מהו הטיפוס 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 כדי לאפשר רינדור של בוררי העורך החזותי (Visual Editor Selectors) בהקשר של ה-CMS / Visual Editor.

IntlayerNode הוא React/Vue/Preact/Solid/Angular/Svelte/Lit/Vanilla Node מועשר, המאפשר גם גישה למאפיינים של צומת הפרימיטיב הבסיסי.

לדוגמה:

const content = useIntlayer("app");

// במקרה של מחרוזת (String)
content.title; // מחזיר IntlayerNode<string>
content.title.value; // מחזיר את התוכן הבסיסי, כאן מחרוזת

content.title.toString(); // מחזיר string
content.title.toLowerCase(); // מחזיר string
String(content.title); // מחזיר string
content.title.toUpperCase(); // מחזיר מחרוזת באותיות גדולות (uppercased)
content.title.replace("a", "b"); // מחזיר מחרוזת מעודכנת
// ...

גישה ישירה למאפיינים של IntlayerNode תעבוד, אך תפגע ביכולת להציג את הבוררים בעורך החזותי (Visual Editor).

ה-IntlayerNode יכול גם לעטוף מספרים או טיפוסים אחרים כגון IntlayerNode<number>.