¿Qué es el tipo IntlayerNode?

    El tipo IntlayerNode<T> es un tipo especial proporcionado por los paquetes de intlayer como next-intlayer, react-intlayer, vue-intlayer, preact-intlayer, solid-intlayer, angular-intlayer, svelte-intlayer, lit-intlayer y vanilla-intlayer.

    Ejemplo de uso

    src/app.content.tsx
    import { t, type Dictionary } from "intlayer";
import type { ComponentChildren } from "preact";

const appContent = {
  key: "app",
  content: {
    title: "Vite + Preact",
  },
} satisfies Dictionary;

export default appContent;
    src/App.tsx
    import { useIntlayer } from "react-intlayer";const AppContent = () => {const { title } = useIntlayer("app");return title; // devuelve tipo: IntlayerNode&lt;string&gt;};

    ¿Por qué Intlayer inserta un IntlayerNode?

    Intlayer inserta un IntlayerNode para poder renderizar los Selectores del editor visual en el contexto del CMS / Editor Visual.

    Demostración del Editor Visual

    Un IntlayerNode es un nodo enriquecido de React/Vue/Preact/Solid/Angular/Svelte/Lit/Vanilla, pero también permite acceder a las propiedades del nodo primitivo base.

    Por ejemplo:

    js
    const content = useIntlayer("app");// Caso de cadena (String)content.title; // Devuelve IntlayerNode&lt;string&gt;content.title.value; // Devuelve el contenido base, aquí una cadenacontent.title.toString(); // Devuelve cadenacontent.title.toLowerCase(); // Devuelve cadenaString(content.title); // Devuelve cadenacontent.title.toUpperCase(); // Devuelve cadena en mayúsculascontent.title.replace("a", "b"); // Devuelve cadena modificada// ...
    Acceder a las propiedades de un IntlayerNode funcionará, pero romperá la capacidad de mostrar los selectores en el Editor Visual.
    El IntlayerNode también puede envolver un número u otros tipos como IntlayerNode<number>