Autor:
    Aymeric PINEAU
    Creación:2026-01-21Última actualización:2026-01-21

    Paquete react-intlayer

    El paquete react-intlayer proporciona las herramientas necesarias para integrar Intlayer en aplicaciones React. Incluye providers de contexto, hooks y componentes para manejar contenido multilingüe.

    Instalación

    bash
    npm install react-intlayer

    Exportaciones

    Proveedores

    Importar:

    tsx
    import "react-intlayer";
    ComponenteDescripciónDocumento relacionado
    IntlayerProviderEl proveedor principal que envuelve tu aplicación y proporciona el contexto de Intlayer. Incluye soporte para el editor por defecto.IntlayerProvider
    IntlayerProviderContentUn componente proveedor centrado en el contenido sin las funcionalidades del editor. Úsalo cuando no necesites el editor visual.-
    HTMLProviderProveedor para la configuración de internacionalización relacionada con HTML. Permite sobrescribir componentes para etiquetas HTML.-

    Hooks

    Importar:

    tsx
    import "react-intlayer";
    HookDescripciónDocumento relacionado
    useHTMLRendererHook para obtener una función de renderizado de HTML preconfigurada.-
    useMarkdownRendererHook para obtener una función de renderizado de Markdown preconfigurada.-
    useIntlayerHook del lado del cliente que selecciona un diccionario por su clave y devuelve su contenido. Usa la locale del contexto si no se proporciona.useIntlayer
    useDictionaryHook que transforma un objeto de diccionario y devuelve el contenido para la locale actual. Procesa traducciones t(), enumeraciones, etc.useDictionary
    useDictionaryAsyncHook que gestiona diccionarios asíncronos. Acepta un mapa de diccionarios basado en Promise y lo resuelve para la locale actual.-
    useDictionaryDynamicHook que gestiona diccionarios dinámicos cargados por clave. Utiliza React Suspense internamente para los estados de carga.-
    useLocaleHook del lado del cliente para obtener la locale actual, la locale predeterminada, las locales disponibles y una función para actualizar la locale.useLocale
    useLocaleBaseHook para obtener la locale actual y todos los campos relacionados (locale, defaultLocale, availableLocales, setLocale) desde el contexto.-
    usePathnameHook que devuelve la ruta de acceso (pathname) actual con el segmento del idioma eliminado. Reactivo a la navegación del navegador a través de popstate.usePathname
    useRewriteURLHook del lado del cliente para gestionar reescrituras de URL. Si existe una regla de reescritura para el pathname y la locale actuales, actualizará la URL.useRewriteURL
    useI18nHook que proporciona una función de traducción t() para acceder a contenido anidado mediante clave. Emula el patrón de i18next/next-intl.useI18n
    useIntlHook que proporciona un objeto Intl ligado a la locale. Inyecta automáticamente la locale actual y utiliza caching optimizado.-
    useLocaleStorageHook que proporciona persistencia de la locale en localStorage o cookies. Devuelve funciones getter y setter.-
    useLocaleCookieObsoleto. Usa useLocaleStorage en su lugar. Hook que gestiona la persistencia de la locale en cookies.-
    useLoadDynamicHook para cargar diccionarios dinámicos usando React Suspense. Acepta una key y una promise; almacena en caché los resultados.-
    useIntlayerContextHook que proporciona los valores actuales del contexto del cliente Intlayer (locale, setLocale, etc.).-
    useHTMLContextHook para acceder a las anulaciones de componentes HTML desde el contexto HTMLProvider.-

    Funciones

    Importar:

    tsx
    import "react-intlayer";
    FunciónDescripciónDocumento relacionado
    renderHTMLUtilidad independiente para renderizar HTML fuera de componentes.-
    renderMarkdownUtilidad independiente para renderizar Markdown fuera de componentes.-
    tFunción de traducción en cliente que devuelve la traducción del contenido multilingüe proporcionado. Usa el locale del contexto si no se indica.translation
    getDictionaryProcesa objetos de diccionario y devuelve el contenido para el locale especificado. Procesa traducciones t(), enumeraciones, Markdown, HTML, etc.-
    getIntlayerRecupera un diccionario por su clave desde la declaración generada y devuelve su contenido para el locale especificado. Versión optimizada de getDictionary.-
    setLocaleInStorageEstablece la locale en el almacenamiento (localStorage o cookie según la configuración).-
    setLocaleCookieObsoleto. Usa setLocaleInStorage en su lugar. Establece la locale en una cookie.-
    localeInStorageObtiene el locale desde el almacenamiento (local storage o cookie).-
    localeCookieObsoleto. Usa localeInStorage en su lugar. Obtiene el locale desde la cookie.-

    Componentes

    Importar:

    tsx
    import "react-intlayer";

    o

    tsx
    import "react-intlayer/markdown";
    ComponenteDescripciónDocumento relacionado
    HTMLRendererRenderiza contenido HTML con componentes personalizados.-
    MarkdownProviderProveedor para el contexto de renderizado de markdown. Permite anular componentes personalizados para los elementos de markdown.-
    MarkdownRendererRenderiza contenido markdown con componentes personalizados. Admite todas las características estándar de markdown y la sintaxis específica de Intlayer.MarkdownRenderer

    Tipos

    Importación:

    tsx
    import "react-intlayer";
    TipoDescripción
    IntlayerNodeTipo que representa un nodo en el árbol de contenido de Intlayer. Usado para la manipulación de contenido con tipado seguro.

    Lado del servidor (react-intlayer/server)

    Importar:

    tsx
    import "react-intlayer/server";
    ExportaciónTipoDescripción
    IntlayerServerProviderComponentProveedor para renderizado del lado del servidor.
    IntlayerServerComponentEnvoltorio del lado del servidor para el contenido de Intlayer.
    tFunctionVersión del lado del servidor de la función de traducción.
    useLocaleHookHook para acceder al locale en el lado del servidor.
    useIntlayerHookVersión del lado del servidor de useIntlayer.
    useDictionaryHookVersión del lado del servidor de useDictionary.
    useI18nHookVersión del lado del servidor de useI18n.
    localeFunctionFunción para obtener o establecer el locale en el servidor.
    validatePrefixIntlayerProvider