Что такое тип IntlayerNode?

Тип IntlayerNode<T> - это специальный тип, предоставляемый пакетами intlayer, такими как next-intlayer, react-intlayer, vue-intlayer, preact-intlayer, solid-intlayer, angular-intlayer, svelte-intlayer, lit-intlayer и vanilla-intlayer.

Пример использования

import { t, type Dictionary } from "intlayer";
import type { ComponentChildren } from "preact";

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

export default appContent;

import { useIntlayer } from "react-intlayer";

const AppContent = () => {
  const { title } = useIntlayer("app");

  return title; // возвращает тип: IntlayerNode<string>
};

Почему Intlayer вставляет IntlayerNode?

Intlayer вставляет IntlayerNode, чтобы иметь возможность отображать селекторы визуального редактора в контексте CMS / визуального редактора.

IntlayerNode - это расширенный узел React/Vue/Preact/Solid/Angular/Svelte/Lit/Vanilla, который также позволяет обращаться к свойствам базового примитивного узла.

Например:

const content = useIntlayer("app");

// Случай со строкой
content.title; // Возвращает IntlayerNode<string>
content.title.value; // Возвращает базовое содержимое, в данном случае строку

content.title.toString(); // Возвращает строку
content.title.toLowerCase(); // Возвращает строку
String(content.title); // Возвращает строку
content.title.toUpperCase(); // Возвращает строку в верхнем регистре
content.title.replace("a", "b"); // Возвращает измененную строку
// ...

Обращение к свойствам IntlayerNode будет работать, но нарушит возможность отображения селекторов в визуальном редакторе.

IntlayerNode также может оборачивать числа или другие типы, такие как IntlayerNode<number>.