react-intlayer 4.0.3 → 4.0.4

package/dist/cjs/client/PoweredByMeta.cjs

@@ -26,10 +26,15 @@ var import_react = require("react");
 const PoweredByMeta = () => {
   if (process.env.NODE_ENV !== "production") return null;
   (0, import_react.useEffect)(() => {
-    const metaTag = document.createElement("meta");
-    metaTag.name = "content-powered-by";
-    metaTag.content = "Intlayer - https://intlayer.org";
-    document.head.appendChild(metaTag);
+    const existingMeta = document.head.querySelector(
+      'meta[name="content-powered-by"]'
+    );
+    if (!existingMeta) {
+      const metaTag = document.createElement("meta");
+      metaTag.name = "content-powered-by";
+      metaTag.content = "Intlayer - https://intlayer.org";
+      document.head.appendChild(metaTag);
+    }
   }, []);
   return null;
 };

package/dist/cjs/client/PoweredByMeta.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/client/PoweredByMeta.ts"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect } from 'react';\n\nexport const PoweredByMeta: FC = () => {\n  if (process.env.NODE_ENV !== 'production') return null;\n\n  useEffect(() => {\n    const metaTag = document.createElement('meta');\n    metaTag.name = 'content-powered-by';\n    metaTag.content = 'Intlayer - https://intlayer.org';\n    document.head.appendChild(metaTag);\n  }, []);\n\n  return null; // This component does not render anything visible\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAmC;AAE5B,MAAM,gBAAoB,MAAM;AACrC,MAAI,QAAQ,IAAI,aAAa,aAAc,QAAO;AAElD,8BAAU,MAAM;AACd,UAAM,UAAU,SAAS,cAAc,MAAM;AAC7C,YAAQ,OAAO;AACf,YAAQ,UAAU;AAClB,aAAS,KAAK,YAAY,OAAO;AAAA,EACnC,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../../src/client/PoweredByMeta.ts"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect } from 'react';\n\nexport const PoweredByMeta: FC = () => {\n  if (process.env.NODE_ENV !== 'production') return null;\n\n  useEffect(() => {\n    // Check if the meta tag already exists\n    const existingMeta = document.head.querySelector(\n      'meta[name=\"content-powered-by\"]'\n    );\n\n    if (!existingMeta) {\n      const metaTag = document.createElement('meta');\n      metaTag.name = 'content-powered-by';\n      metaTag.content = 'Intlayer - https://intlayer.org';\n      document.head.appendChild(metaTag);\n    }\n  }, []);\n\n  return null; // This component does not render anything visible\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAmC;AAE5B,MAAM,gBAAoB,MAAM;AACrC,MAAI,QAAQ,IAAI,aAAa,aAAc,QAAO;AAElD,8BAAU,MAAM;AAEd,UAAM,eAAe,SAAS,KAAK;AAAA,MACjC;AAAA,IACF;AAEA,QAAI,CAAC,cAAc;AACjB,YAAM,UAAU,SAAS,cAAc,MAAM;AAC7C,cAAQ,OAAO;AACf,cAAQ,UAAU;AAClB,eAAS,KAAK,YAAY,OAAO;AAAA,IACnC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;","names":[]}

package/dist/cjs/editor/ContentSelectorWrapper.cjs

@@ -24,8 +24,8 @@ __export(ContentSelectorWrapper_exports, {
 module.exports = __toCommonJS(ContentSelectorWrapper_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_core = require("@intlayer/core");
-var import_react = require("react");
 var import_editor_react = require("@intlayer/editor-react");
+var import_react = require("react");
 var import_ContentSelector = require('../UI/ContentSelector.cjs');
 const ContentSelectorWrapper = ({
   children,
@@ -34,6 +34,7 @@ const ContentSelectorWrapper = ({
   keyPath,
   ...props
 }) => {
+  const { enabled } = (0, import_editor_react.useEditorEnabled)();
   const { focusedContent, setFocusedContent } = (0, import_editor_react.useFocusDictionary)();
   const { getEditedContentValue } = (0, import_editor_react.useEditedContentActions)();
   const editedValue = (0, import_react.useMemo)(
@@ -50,7 +51,7 @@ const ContentSelectorWrapper = ({
     [dictionaryKey, dictionaryPath, keyPath, setFocusedContent]
   );
   const isSelected = (0, import_react.useMemo)(
-    () => ((focusedContent?.keyPath?.length ?? 0) > 0 && (0, import_core.isSameKeyPath)(focusedContent?.keyPath ?? [], keyPath)) ?? false,
+    () => (focusedContent?.dictionaryKey === dictionaryKey && (focusedContent?.keyPath?.length ?? 0) > 0 && (0, import_core.isSameKeyPath)(focusedContent?.keyPath ?? [], keyPath)) ?? false,
     [focusedContent, keyPath]
   );
   (0, import_react.useEffect)(() => {
@@ -60,7 +61,18 @@ const ContentSelectorWrapper = ({
       setDisplayedChildren(children);
     }
   }, [editedValue, focusedContent, children]);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ContentSelector.ContentSelector, { onPress: handleSelect, isSelecting: isSelected, ...props, children: displayedChildren });
+  if (enabled) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_ContentSelector.ContentSelector,
+      {
+        onPress: handleSelect,
+        isSelecting: isSelected,
+        ...props,
+        children: displayedChildren
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children });
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/editor/ContentSelectorWrapper.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport { isSameKeyPath, type KeyPath } from '@intlayer/core';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  useMemo,\n  type FC,\n  type ReactNode,\n  HTMLAttributes,\n} from 'react';\nimport {\n  useFocusDictionary,\n  useEditedContentActions,\n} from '@intlayer/editor-react';\nimport { ContentSelector } from '../UI/ContentSelector';\n\ntype ContentData = {\n  dictionaryKey: string;\n  dictionaryPath: string;\n  keyPath: KeyPath[];\n};\n\nexport type ContentSelectorWrapperProps = ContentData &\n  HTMLAttributes<HTMLDivElement>;\n\nexport const ContentSelectorWrapper: FC<ContentSelectorWrapperProps> = ({\n  children,\n  dictionaryKey,\n  dictionaryPath,\n  keyPath,\n  ...props\n}) => {\n  const { focusedContent, setFocusedContent } = useFocusDictionary();\n  const { getEditedContentValue } = useEditedContentActions();\n\n  const editedValue = useMemo(\n    () => getEditedContentValue(dictionaryKey, keyPath),\n    [dictionaryKey, keyPath, getEditedContentValue]\n  );\n\n  const [displayedChildren, setDisplayedChildren] =\n    useState<ReactNode>(children);\n\n  const handleSelect = useCallback(\n    () =>\n      setFocusedContent({\n        dictionaryKey,\n        dictionaryPath,\n        keyPath,\n      }),\n    [dictionaryKey, dictionaryPath, keyPath, setFocusedContent]\n  );\n\n  const isSelected = useMemo(\n    () =>\n      ((focusedContent?.keyPath?.length ?? 0) > 0 &&\n        isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ??\n      false,\n    [focusedContent, keyPath]\n  );\n\n  useEffect(() => {\n    // Use useEffect to avoid 'Text content does not match server-rendered HTML' error\n    if (editedValue && typeof editedValue === 'string') {\n      setDisplayedChildren(editedValue);\n    } else {\n      setDisplayedChildren(children);\n    }\n  }, [editedValue, focusedContent, children]);\n\n  return (\n    <ContentSelector onPress={handleSelect} isSelecting={isSelected} {...props}>\n      {displayedChildren}\n    </ContentSelector>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAyEI;AAvEJ,kBAA4C;AAC5C,mBAQO;AACP,0BAGO;AACP,6BAAgC;AAWzB,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,EAAE,gBAAgB,kBAAkB,QAAI,wCAAmB;AACjE,QAAM,EAAE,sBAAsB,QAAI,6CAAwB;AAE1D,QAAM,kBAAc;AAAA,IAClB,MAAM,sBAAsB,eAAe,OAAO;AAAA,IAClD,CAAC,eAAe,SAAS,qBAAqB;AAAA,EAChD;AAEA,QAAM,CAAC,mBAAmB,oBAAoB,QAC5C,uBAAoB,QAAQ;AAE9B,QAAM,mBAAe;AAAA,IACnB,MACE,kBAAkB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACH,CAAC,eAAe,gBAAgB,SAAS,iBAAiB;AAAA,EAC5D;AAEA,QAAM,iBAAa;AAAA,IACjB,QACI,gBAAgB,SAAS,UAAU,KAAK,SACxC,2BAAc,gBAAgB,WAAW,CAAC,GAAG,OAAO,MACtD;AAAA,IACF,CAAC,gBAAgB,OAAO;AAAA,EAC1B;AAEA,8BAAU,MAAM;AAEd,QAAI,eAAe,OAAO,gBAAgB,UAAU;AAClD,2BAAqB,WAAW;AAAA,IAClC,OAAO;AACL,2BAAqB,QAAQ;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,aAAa,gBAAgB,QAAQ,CAAC;AAE1C,SACE,4CAAC,0CAAgB,SAAS,cAAc,aAAa,YAAa,GAAG,OAClE,6BACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/editor/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport { isSameKeyPath, type KeyPath } from '@intlayer/core';\nimport {\n  useFocusDictionary,\n  useEditedContentActions,\n  useEditorEnabled,\n} from '@intlayer/editor-react';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  useMemo,\n  type FC,\n  type ReactNode,\n  HTMLAttributes,\n} from 'react';\nimport { ContentSelector } from '../UI/ContentSelector';\n\ntype ContentData = {\n  dictionaryKey: string;\n  dictionaryPath: string;\n  keyPath: KeyPath[];\n};\n\nexport type ContentSelectorWrapperProps = ContentData &\n  HTMLAttributes<HTMLDivElement>;\n\nexport const ContentSelectorWrapper: FC<ContentSelectorWrapperProps> = ({\n  children,\n  dictionaryKey,\n  dictionaryPath,\n  keyPath,\n  ...props\n}) => {\n  const { enabled } = useEditorEnabled();\n  const { focusedContent, setFocusedContent } = useFocusDictionary();\n  const { getEditedContentValue } = useEditedContentActions();\n\n  const editedValue = useMemo(\n    () => getEditedContentValue(dictionaryKey, keyPath),\n    [dictionaryKey, keyPath, getEditedContentValue]\n  );\n\n  const [displayedChildren, setDisplayedChildren] =\n    useState<ReactNode>(children);\n\n  const handleSelect = useCallback(\n    () =>\n      setFocusedContent({\n        dictionaryKey,\n        dictionaryPath,\n        keyPath,\n      }),\n    [dictionaryKey, dictionaryPath, keyPath, setFocusedContent]\n  );\n\n  const isSelected = useMemo(\n    () =>\n      (focusedContent?.dictionaryKey === dictionaryKey &&\n        (focusedContent?.keyPath?.length ?? 0) > 0 &&\n        isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ??\n      false,\n    [focusedContent, keyPath]\n  );\n\n  useEffect(() => {\n    // Use useEffect to avoid 'Text content does not match server-rendered HTML' error\n    if (editedValue && typeof editedValue === 'string') {\n      setDisplayedChildren(editedValue);\n    } else {\n      setDisplayedChildren(children);\n    }\n  }, [editedValue, focusedContent, children]);\n\n  if (enabled) {\n    return (\n      <ContentSelector\n        onPress={handleSelect}\n        isSelecting={isSelected}\n        {...props}\n      >\n        {displayedChildren}\n      </ContentSelector>\n    );\n  }\n\n  return <>{children}</>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6EM;AA3EN,kBAA4C;AAC5C,0BAIO;AACP,mBAQO;AACP,6BAAgC;AAWzB,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,EAAE,QAAQ,QAAI,sCAAiB;AACrC,QAAM,EAAE,gBAAgB,kBAAkB,QAAI,wCAAmB;AACjE,QAAM,EAAE,sBAAsB,QAAI,6CAAwB;AAE1D,QAAM,kBAAc;AAAA,IAClB,MAAM,sBAAsB,eAAe,OAAO;AAAA,IAClD,CAAC,eAAe,SAAS,qBAAqB;AAAA,EAChD;AAEA,QAAM,CAAC,mBAAmB,oBAAoB,QAC5C,uBAAoB,QAAQ;AAE9B,QAAM,mBAAe;AAAA,IACnB,MACE,kBAAkB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACH,CAAC,eAAe,gBAAgB,SAAS,iBAAiB;AAAA,EAC5D;AAEA,QAAM,iBAAa;AAAA,IACjB,OACG,gBAAgB,kBAAkB,kBAChC,gBAAgB,SAAS,UAAU,KAAK,SACzC,2BAAc,gBAAgB,WAAW,CAAC,GAAG,OAAO,MACtD;AAAA,IACF,CAAC,gBAAgB,OAAO;AAAA,EAC1B;AAEA,8BAAU,MAAM;AAEd,QAAI,eAAe,OAAO,gBAAgB,UAAU;AAClD,2BAAqB,WAAW;AAAA,IAClC,OAAO;AACL,2BAAqB,QAAQ;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,aAAa,gBAAgB,QAAQ,CAAC;AAE1C,MAAI,SAAS;AACX,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT,aAAa;AAAA,QACZ,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,SAAO,2EAAG,UAAS;AACrB;","names":[]}

package/dist/cjs/editor/IntlayerEditorProvider.cjs

@@ -1,7 +1,10 @@
 "use strict";
+"use client";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -15,6 +18,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var IntlayerEditorProvider_exports = {};
 __export(IntlayerEditorProvider_exports, {
@@ -23,16 +34,35 @@ __export(IntlayerEditorProvider_exports, {
 module.exports = __toCommonJS(IntlayerEditorProvider_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_client = require("@intlayer/config/client");
+var import_dictionaries_entry = __toESM(require("@intlayer/dictionaries-entry"));
 var import_editor_react = require("@intlayer/editor-react");
-const {
-  editor: { enabled }
-} = (0, import_client.getConfiguration)();
-const IntlayerEditorProvider = ({ children }) => {
-  if (enabled) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_editor_react.EditorProvider, { targetWindow: window, children });
-  }
-  return children;
+var import_react = require("react");
+const IntlayerEditorProviderEnabled = () => {
+  (0, import_editor_react.useCrossURLPathState)(void 0, {
+    receive: false,
+    emit: true
+  });
+  const { setConfiguration } = (0, import_editor_react.useConfigurationActions)();
+  const { setLocaleDictionaries } = (0, import_editor_react.useDictionariesRecordActions)();
+  (0, import_react.useEffect)(() => {
+    setLocaleDictionaries(import_dictionaries_entry.default);
+    const config = (0, import_client.getConfiguration)();
+    setConfiguration(config);
+  }, [setLocaleDictionaries]);
+  (0, import_editor_react.useIframeClickInterceptor)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {});
 };
+const IntlayerEditorProvider = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  import_editor_react.EditorProvider,
+  {
+    postMessage: (data) => window.parent?.postMessage(data, "*"),
+    allowedOrigins: ["*"],
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IntlayerEditorProviderEnabled, {}),
+      children
+    ]
+  }
+);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   IntlayerEditorProvider

package/dist/cjs/editor/IntlayerEditorProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["import { FC, PropsWithChildren } from 'react';\nimport { getConfiguration } from '@intlayer/config/client';\nimport { EditorProvider } from '@intlayer/editor-react';\n\nconst {\n  editor: { enabled },\n} = getConfiguration();\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n  if (enabled) {\n    return <EditorProvider targetWindow={window}>{children}</EditorProvider>;\n  }\n\n  return children;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAUW;AATX,oBAAiC;AACjC,0BAA+B;AAE/B,MAAM;AAAA,EACJ,QAAQ,EAAE,QAAQ;AACpB,QAAI,gCAAiB;AAEd,MAAM,yBAAgD,CAAC,EAAE,SAAS,MAAM;AAC7E,MAAI,SAAS;AACX,WAAO,4CAAC,sCAAe,cAAc,QAAS,UAAS;AAAA,EACzD;AAEA,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration } from '@intlayer/config/client';\nimport dictionaries from '@intlayer/dictionaries-entry';\nimport {\n  EditorProvider,\n  useCrossURLPathState,\n  useDictionariesRecordActions,\n  useConfigurationActions,\n  useIframeClickInterceptor,\n} from '@intlayer/editor-react';\nimport { useEffect, type FC, type PropsWithChildren } from 'react';\n\n/**\n * @intlayer/dictionaries-entry is a package that only returns the dictionary entry path.\n * Using an external package allow to alias it in the bundle configuration (such as webpack).\n * The alias allow hot reload the app (such as nextjs) on any dictionary change.\n */\nconst IntlayerEditorProviderEnabled: FC = () => {\n  /**\n   * URL Messages\n   */\n  useCrossURLPathState(undefined, {\n    receive: false,\n    emit: true,\n  });\n\n  /**\n   * Configuration Messages\n   */\n  const { setConfiguration } = useConfigurationActions();\n  const { setLocaleDictionaries } = useDictionariesRecordActions();\n\n  useEffect(() => {\n    setLocaleDictionaries(dictionaries);\n\n    const config = getConfiguration();\n    setConfiguration(config);\n  }, [setLocaleDictionaries]);\n\n  /**\n   * Click Messages\n   */\n  useIframeClickInterceptor();\n\n  return <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => (\n  <EditorProvider\n    postMessage={(data) => window.parent?.postMessage(data, '*')}\n    allowedOrigins={['*']}\n  >\n    <IntlayerEditorProviderEnabled />\n    {children}\n  </EditorProvider>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6CS;AA3CT,oBAAiC;AACjC,gCAAyB;AACzB,0BAMO;AACP,mBAA2D;AAO3D,MAAM,gCAAoC,MAAM;AAI9C,gDAAqB,QAAW;AAAA,IAC9B,SAAS;AAAA,IACT,MAAM;AAAA,EACR,CAAC;AAKD,QAAM,EAAE,iBAAiB,QAAI,6CAAwB;AACrD,QAAM,EAAE,sBAAsB,QAAI,kDAA6B;AAE/D,8BAAU,MAAM;AACd,0BAAsB,0BAAAA,OAAY;AAElC,UAAM,aAAS,gCAAiB;AAChC,qBAAiB,MAAM;AAAA,EACzB,GAAG,CAAC,qBAAqB,CAAC;AAK1B,qDAA0B;AAE1B,SAAO,2EAAE;AACX;AAEO,MAAM,yBAAgD,CAAC,EAAE,SAAS,MACvE;AAAA,EAAC;AAAA;AAAA,IACC,aAAa,CAAC,SAAS,OAAO,QAAQ,YAAY,MAAM,GAAG;AAAA,IAC3D,gBAAgB,CAAC,GAAG;AAAA,IAEpB;AAAA,kDAAC,iCAA8B;AAAA,MAC9B;AAAA;AAAA;AACH;","names":["dictionaries"]}

package/dist/cjs/editor/renderContentEditor.cjs

@@ -22,30 +22,10 @@ __export(renderContentEditor_exports, {
 });
 module.exports = __toCommonJS(renderContentEditor_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_client = require("@intlayer/config/client");
 var import_ContentSelectorWrapper = require('./ContentSelectorWrapper.cjs');
-const {
-  editor: { enabled }
-} = (0, import_client.getConfiguration)();
-const IntlayerEditorElement = ({
-  content,
-  isContentSelectable,
-  ...props
-}) => {
-  if (enabled && isContentSelectable) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ContentSelectorWrapper.ContentSelectorWrapper, { ...props, children: content });
-  }
-  return content;
-};
-const renderIntlayerEditor = (data, isContentSelectable = true) => {
-  const Result = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    IntlayerEditorElement,
-    {
-      ...data,
-      isContentSelectable
-    }
-  );
-  return { ...Result, value: data.content };
+const renderIntlayerEditor = (props) => {
+  const Result = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ContentSelectorWrapper.ContentSelectorWrapper, { ...props, children: props.content });
+  return { ...Result, value: props.content };
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/editor/renderContentEditor.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/renderContentEditor.tsx"],"sourcesContent":["import { getConfiguration } from '@intlayer/config/client';\nimport type { KeyPath } from '@intlayer/core';\nimport type { FC, ReactNode } from 'react';\nimport { ContentSelectorWrapper } from './ContentSelectorWrapper';\n\nconst {\n  editor: { enabled },\n} = getConfiguration();\n\nexport type IntlayerEditorElementProps = {\n  content: string;\n  dictionaryKey: string;\n  dictionaryPath: string;\n  keyPath: KeyPath[];\n  isContentSelectable: boolean;\n};\n\nconst IntlayerEditorElement: FC<IntlayerEditorElementProps> = ({\n  content,\n  isContentSelectable,\n  ...props\n}) => {\n  if (enabled && isContentSelectable) {\n    return (\n      <ContentSelectorWrapper {...props}>{content}</ContentSelectorWrapper>\n    );\n  }\n  return content;\n};\n\nexport type IntlayerNode<T = string> = ReactNode & {\n  value: T;\n};\n\nexport const renderIntlayerEditor = (\n  data: IntlayerEditorElementProps,\n  isContentSelectable = true\n): IntlayerNode => {\n  const Result = (\n    <IntlayerEditorElement\n      {...data}\n      isContentSelectable={isContentSelectable}\n    />\n  );\n\n  return { ...Result, value: data.content };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwBM;AAxBN,oBAAiC;AAGjC,oCAAuC;AAEvC,MAAM;AAAA,EACJ,QAAQ,EAAE,QAAQ;AACpB,QAAI,gCAAiB;AAUrB,MAAM,wBAAwD,CAAC;AAAA,EAC7D;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,MAAI,WAAW,qBAAqB;AAClC,WACE,4CAAC,wDAAwB,GAAG,OAAQ,mBAAQ;AAAA,EAEhD;AACA,SAAO;AACT;AAMO,MAAM,uBAAuB,CAClC,MACA,sBAAsB,SACL;AACjB,QAAM,SACJ;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA;AAAA,EACF;AAGF,SAAO,EAAE,GAAG,QAAQ,OAAO,KAAK,QAAQ;AAC1C;","names":[]}
+{"version":3,"sources":["../../../src/editor/renderContentEditor.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport {\n  ContentSelectorWrapper,\n  type ContentSelectorWrapperProps,\n} from './ContentSelectorWrapper';\n\nexport type IntlayerNode<T = string> = ReactNode & {\n  value: T;\n};\n\nexport type RenderIntlayerEditorProps = Omit<\n  ContentSelectorWrapperProps,\n  'children'\n> & {\n  content: string;\n};\n\nexport const renderIntlayerEditor = (\n  props: RenderIntlayerEditorProps\n): IntlayerNode => {\n  const Result = (\n    <ContentSelectorWrapper {...props}>{props.content}</ContentSelectorWrapper>\n  );\n\n  return { ...Result, value: props.content };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBI;AApBJ,oCAGO;AAaA,MAAM,uBAAuB,CAClC,UACiB;AACjB,QAAM,SACJ,4CAAC,wDAAwB,GAAG,OAAQ,gBAAM,SAAQ;AAGpD,SAAO,EAAE,GAAG,QAAQ,OAAO,MAAM,QAAQ;AAC3C;","names":[]}

package/dist/cjs/getDictionary.cjs

@@ -18,37 +18,11 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var getDictionary_exports = {};
 __export(getDictionary_exports, {
-  getDictionary: () => getDictionary,
-  recursiveTransformContent: () => recursiveTransformContent
+  getDictionary: () => getDictionary
 });
 module.exports = __toCommonJS(getDictionary_exports);
-var import_react = require("react");
-var import_renderContentEditor = require('./editor/renderContentEditor.cjs');
 var import_processDictionary = require('./processDictionary/index.cjs');
-const recursiveTransformContent = (value, isRenderEditor = false) => {
-  if (typeof value === "function") {
-    return (props) => recursiveTransformContent(value(props), isRenderEditor);
-  } else if (typeof value === "object") {
-    if (typeof value.dictionaryKey !== "undefined") {
-      if (isRenderEditor) {
-        return (0, import_renderContentEditor.renderIntlayerEditor)(value);
-      }
-      return value.content;
-    } else if (Array.isArray(value)) {
-      return value.map((el) => recursiveTransformContent(el, isRenderEditor));
-    } else if ((0, import_react.isValidElement)(value)) {
-      return value;
-    }
-    return Object.entries(value).reduce(
-      (acc, [key, value2]) => ({
-        ...acc,
-        [key]: recursiveTransformContent(value2, isRenderEditor)
-      }),
-      {}
-    );
-  }
-  return value;
-};
+var import_recursiveTransformContent = require('./recursiveTransformContent.cjs');
 const getDictionary = (dictionary, locale, isRenderEditor = false) => {
   const result = (0, import_processDictionary.processDictionary)(
     dictionary.content,
@@ -57,14 +31,13 @@ const getDictionary = (dictionary, locale, isRenderEditor = false) => {
     [],
     locale
   );
-  return recursiveTransformContent(
+  return (0, import_recursiveTransformContent.recursiveTransformContent)(
     result,
     isRenderEditor
   );
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  getDictionary,
-  recursiveTransformContent
+  getDictionary
 });
 //# sourceMappingURL=getDictionary.cjs.map

package/dist/cjs/getDictionary.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/getDictionary.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type { Locales } from '@intlayer/config';\nimport type {\n  DeclarationContent,\n  DictionaryValue,\n  NodeType,\n} from '@intlayer/core';\nimport { isValidElement, type ReactNode } from 'react';\nimport {\n  type IntlayerNode,\n  renderIntlayerEditor,\n} from './editor/renderContentEditor';\nimport { processDictionary } from './processDictionary/index';\n\ntype TransformNodeType<T, L extends Locales, R extends boolean> = T extends {\n  [NodeType.Enumeration]: { '1': any };\n}\n  ? (\n      quantity: number\n    ) => DeepTransformContent<T[NodeType.Enumeration]['1'], L, R>\n  : T extends {\n        [NodeType.Translation]: object;\n      }\n    ? L extends keyof T[NodeType.Translation]\n      ? DeepTransformContent<T[NodeType.Translation][L], L, R>\n      : never\n    : T;\n\nexport type DeepTransformContent<\n  T,\n  L extends Locales,\n  R extends boolean,\n> = T extends object // Check if the property is an object\n  ? T extends (infer U)[] // If it's an array, infer the type of array elements\n    ? DeepTransformContent<U, L, R>[] // Apply DeepTransformContent recursively to each element of the array\n    : T extends {\n          nodeType: NodeType | string;\n        }\n      ? TransformNodeType<T, L, R>\n      : T extends { _owner: any; key: any; props: any; ref: any }\n        ? ReactNode\n        : {\n            [K in keyof T]: DeepTransformContent<T[K], L, R>;\n          }\n  : T extends undefined\n    ? never\n    : R extends true\n      ? IntlayerNode<T>\n      : T;\n\n/**\n * Go through the object. If a object has a keyPath, render the intlayer editor if editor enabled.\n */\nexport const recursiveTransformContent = (\n  value: any,\n  isRenderEditor = false\n): object => {\n  if (typeof value === 'function') {\n    return (props: any) =>\n      recursiveTransformContent(value(props), isRenderEditor);\n  } else if (typeof value === 'object') {\n    if (typeof value.dictionaryKey !== 'undefined') {\n      if (isRenderEditor) {\n        return renderIntlayerEditor(value);\n      }\n      return value.content;\n    } else if (Array.isArray(value)) {\n      return value.map((el) => recursiveTransformContent(el, isRenderEditor));\n    } else if (isValidElement(value)) {\n      return value;\n    }\n\n    return Object.entries(value).reduce(\n      (acc, [key, value]) => ({\n        ...acc,\n        [key]: recursiveTransformContent(value, isRenderEditor),\n      }),\n      {} as object\n    );\n  }\n\n  return value;\n};\n\ntype DataFromDictionary<\n  T extends DeclarationContent,\n  K extends Locales,\n  R extends boolean = false,\n> = DeepTransformContent<T['content'], K, R>;\n\nexport type UseDictionary = <\n  T extends DeclarationContent,\n  L extends Locales,\n  R extends boolean = false,\n>(\n  dictionary: T,\n  locale?: L,\n  isRenderEditor?: R\n) => DataFromDictionary<T, L, R>;\n\n/**\n * Hook that picks one dictionary by its id and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const getDictionary: UseDictionary = <\n  T extends DeclarationContent,\n  L extends Locales,\n  R extends boolean = false,\n>(\n  dictionary: T,\n  locale?: L,\n  isRenderEditor: R = false as R\n) => {\n  const result = processDictionary(\n    dictionary.content as DictionaryValue,\n    dictionary.key,\n    dictionary.filePath,\n    [],\n    locale\n  );\n\n  return recursiveTransformContent(\n    result,\n    isRenderEditor\n  ) as DataFromDictionary<T, L, R>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,mBAA+C;AAC/C,iCAGO;AACP,+BAAkC;AAyC3B,MAAM,4BAA4B,CACvC,OACA,iBAAiB,UACN;AACX,MAAI,OAAO,UAAU,YAAY;AAC/B,WAAO,CAAC,UACN,0BAA0B,MAAM,KAAK,GAAG,cAAc;AAAA,EAC1D,WAAW,OAAO,UAAU,UAAU;AACpC,QAAI,OAAO,MAAM,kBAAkB,aAAa;AAC9C,UAAI,gBAAgB;AAClB,mBAAO,iDAAqB,KAAK;AAAA,MACnC;AACA,aAAO,MAAM;AAAA,IACf,WAAW,MAAM,QAAQ,KAAK,GAAG;AAC/B,aAAO,MAAM,IAAI,CAAC,OAAO,0BAA0B,IAAI,cAAc,CAAC;AAAA,IACxE,eAAW,6BAAe,KAAK,GAAG;AAChC,aAAO;AAAA,IACT;AAEA,WAAO,OAAO,QAAQ,KAAK,EAAE;AAAA,MAC3B,CAAC,KAAK,CAAC,KAAKA,MAAK,OAAO;AAAA,QACtB,GAAG;AAAA,QACH,CAAC,GAAG,GAAG,0BAA0BA,QAAO,cAAc;AAAA,MACxD;AAAA,MACA,CAAC;AAAA,IACH;AAAA,EACF;AAEA,SAAO;AACT;AAuBO,MAAM,gBAA+B,CAK1C,YACA,QACA,iBAAoB,UACjB;AACH,QAAM,aAAS;AAAA,IACb,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,CAAC;AAAA,IACD;AAAA,EACF;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":["value"]}
+{"version":3,"sources":["../../src/getDictionary.ts"],"sourcesContent":["import type { Locales } from '@intlayer/config';\nimport type { DeclarationContent, DictionaryValue } from '@intlayer/core';\nimport { processDictionary } from './processDictionary/index';\nimport {\n  DeepTransformContent,\n  recursiveTransformContent,\n} from './recursiveTransformContent';\n\ntype DataFromDictionary<\n  T extends DeclarationContent,\n  K extends Locales,\n  R extends boolean = false,\n> = DeepTransformContent<T['content'], K, R>;\n\nexport type UseDictionary = <\n  T extends DeclarationContent,\n  L extends Locales,\n  R extends boolean = false,\n>(\n  dictionary: T,\n  locale?: L,\n  isRenderEditor?: R,\n  isContentSelectable?: boolean\n) => DataFromDictionary<T, L, R>;\n\n/**\n * Hook that picks one dictionary by its id and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const getDictionary: UseDictionary = <\n  T extends DeclarationContent,\n  L extends Locales,\n  R extends boolean = false,\n>(\n  dictionary: T,\n  locale?: L,\n  isRenderEditor: R = false as R\n) => {\n  const result = processDictionary(\n    dictionary.content as DictionaryValue,\n    dictionary.key,\n    dictionary.filePath,\n    [],\n    locale\n  );\n\n  return recursiveTransformContent(\n    result,\n    isRenderEditor\n  ) as DataFromDictionary<T, L, R>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,+BAAkC;AAClC,uCAGO;AAwBA,MAAM,gBAA+B,CAK1C,YACA,QACA,iBAAoB,UACjB;AACH,QAAM,aAAS;AAAA,IACb,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,CAAC;AAAA,IACD;AAAA,EACF;AAEA,aAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/dist/cjs/getIntlayer.cjs

@@ -32,8 +32,8 @@ __export(getIntlayer_exports, {
 });
 module.exports = __toCommonJS(getIntlayer_exports);
 var import_dictionaries_entry = __toESM(require("@intlayer/dictionaries-entry"));
-var import_getDictionary = require('./getDictionary.cjs');
 var import_processDictionary = require('./processDictionary/index.cjs');
+var import_recursiveTransformContent = require('./recursiveTransformContent.cjs');
 const getIntlayer = (key, locale, isRenderEditor = false) => {
   const dictionary = import_dictionaries_entry.default[key];
   if (!dictionary) {
@@ -46,7 +46,7 @@ const getIntlayer = (key, locale, isRenderEditor = false) => {
     [],
     locale
   );
-  return (0, import_getDictionary.recursiveTransformContent)(
+  return (0, import_recursiveTransformContent.recursiveTransformContent)(
     result,
     isRenderEditor
   );

package/dist/cjs/getIntlayer.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/getIntlayer.ts"],"sourcesContent":["import type { Locales } from '@intlayer/config';\nimport type { Dictionary } from '@intlayer/core';\n/**\n * @intlayer/dictionaries-entry is a package that only returns the dictionary entry path.\n * Using an external package allow to alias it in the bundle configuration (such as webpack).\n * The alias allow hot reload the app (such as nextjs) on any dictionary change.\n */\nimport dictionaries from '@intlayer/dictionaries-entry';\nimport type { IntlayerDictionaryTypesConnector } from 'intlayer';\nimport {\n  type DeepTransformContent,\n  recursiveTransformContent,\n} from './getDictionary';\nimport { processDictionary } from './processDictionary/index';\n\n/**\n * Provides a fallback to string type if the generic type T is never,\n * otherwise returns T. This is useful for handling cases where no keys are found.\n * Example: StringFallback<never> -> string; StringFallback<'key'> -> 'key'\n */\nexport type StringFallback<T> = T extends never ? string : T; // If no keys are found, return string to disable error, and accept any string as dictionary key\n\n/**\n * Represents the keys of the IntlayerDictionaryTypesConnector,\n * ensuring they are valid dictionary keys or fallback to string if none exist.\n *\n * Example:\n * ```ts\n * DictionaryKeys -> 'key1' | 'key2'\n * // or if IntlayerDictionaryTypesConnector is not defined,\n * DictionaryKeys -> string\n * ```\n */\nexport type DictionaryKeys = StringFallback<\n  keyof IntlayerDictionaryTypesConnector\n>;\n\n/**\n * Represents the data type returned by the useIntlayer hook,\n * excluding the 'id' and 'filePath' keys from the dictionary content.\n */\nexport type DataFromDictionaryKey<\n  T extends DictionaryKeys,\n  K extends Locales,\n  R extends boolean = false,\n> = DeepTransformContent<IntlayerDictionaryTypesConnector[T]['content'], K, R>;\n\n/**\n * Type definition for the useIntlayer hook, which takes a dictionary ID and an optional locale,\n * and returns the deeply transformed dictionary content.\n *\n */\nexport type UseIntlayer = <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = false,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor?: R\n) => DataFromDictionaryKey<T, L, R>;\n\nexport type UseIntlayerEditable = <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = true,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor?: R\n) => DataFromDictionaryKey<T, L, R>;\n\nexport const getIntlayer: UseIntlayer = <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = false,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor: R = false as R\n) => {\n  const dictionary: Dictionary = dictionaries[key as keyof typeof dictionaries];\n\n  if (!dictionary) {\n    throw new Error(`Dictionary ${key} not found`, dictionaries);\n  }\n\n  const result = processDictionary(\n    dictionary.content,\n    dictionary.key,\n    dictionary.filePath,\n    [],\n    locale\n  );\n\n  return recursiveTransformContent(\n    result,\n    isRenderEditor\n  ) as DataFromDictionaryKey<T, L, R>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,gCAAyB;AAEzB,2BAGO;AACP,+BAAkC;AA2D3B,MAAM,cAA2B,CAKtC,KACA,QACA,iBAAoB,UACjB;AACH,QAAM,aAAyB,0BAAAA,QAAa,GAAgC;AAE5E,MAAI,CAAC,YAAY;AACf,UAAM,IAAI,MAAM,cAAc,GAAG,cAAc,0BAAAA,OAAY;AAAA,EAC7D;AAEA,QAAM,aAAS;AAAA,IACb,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,CAAC;AAAA,IACD;AAAA,EACF;AAEA,aAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":["dictionaries"]}
+{"version":3,"sources":["../../src/getIntlayer.ts"],"sourcesContent":["import type { Locales } from '@intlayer/config';\nimport type { Dictionary } from '@intlayer/core';\n/**\n * @intlayer/dictionaries-entry is a package that only returns the dictionary entry path.\n * Using an external package allow to alias it in the bundle configuration (such as webpack).\n * The alias allow hot reload the app (such as nextjs) on any dictionary change.\n */\nimport dictionaries from '@intlayer/dictionaries-entry';\nimport type { IntlayerDictionaryTypesConnector } from 'intlayer';\nimport { processDictionary } from './processDictionary/index';\nimport {\n  type DeepTransformContent,\n  recursiveTransformContent,\n} from './recursiveTransformContent';\n\n/**\n * Provides a fallback to string type if the generic type T is never,\n * otherwise returns T. This is useful for handling cases where no keys are found.\n * Example: StringFallback<never> -> string; StringFallback<'key'> -> 'key'\n */\nexport type StringFallback<T> = T extends never ? string : T; // If no keys are found, return string to disable error, and accept any string as dictionary key\n\n/**\n * Represents the keys of the IntlayerDictionaryTypesConnector,\n * ensuring they are valid dictionary keys or fallback to string if none exist.\n *\n * Example:\n * ```ts\n * DictionaryKeys -> 'key1' | 'key2'\n * // or if IntlayerDictionaryTypesConnector is not defined,\n * DictionaryKeys -> string\n * ```\n */\nexport type DictionaryKeys = StringFallback<\n  keyof IntlayerDictionaryTypesConnector\n>;\n\n/**\n * Represents the data type returned by the useIntlayer hook,\n * excluding the 'id' and 'filePath' keys from the dictionary content.\n */\nexport type DataFromDictionaryKey<\n  T extends DictionaryKeys,\n  K extends Locales,\n  R extends boolean = false,\n> = DeepTransformContent<IntlayerDictionaryTypesConnector[T]['content'], K, R>;\n\n/**\n * Type definition for the useIntlayer hook, which takes a dictionary ID and an optional locale,\n * and returns the deeply transformed dictionary content.\n *\n */\nexport type UseIntlayer = <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = false,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor?: R,\n  isContentSelectable?: boolean\n) => DataFromDictionaryKey<T, L, R>;\n\nexport type UseIntlayerEditable = <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = true,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor?: R,\n  isContentSelectable?: boolean\n) => DataFromDictionaryKey<T, L, R>;\n\nexport const getIntlayer: UseIntlayer = <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = false,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor: R = false as R\n) => {\n  const dictionary: Dictionary = dictionaries[key as keyof typeof dictionaries];\n\n  if (!dictionary) {\n    throw new Error(`Dictionary ${key} not found`, dictionaries);\n  }\n\n  const result = processDictionary(\n    dictionary.content,\n    dictionary.key,\n    dictionary.filePath,\n    [],\n    locale\n  );\n\n  return recursiveTransformContent(\n    result,\n    isRenderEditor\n  ) as DataFromDictionaryKey<T, L, R>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,gCAAyB;AAEzB,+BAAkC;AAClC,uCAGO;AA6DA,MAAM,cAA2B,CAKtC,KACA,QACA,iBAAoB,UACjB;AACH,QAAM,aAAyB,0BAAAA,QAAa,GAAgC;AAE5E,MAAI,CAAC,YAAY;AACf,UAAM,IAAI,MAAM,cAAc,GAAG,cAAc,0BAAAA,OAAY;AAAA,EAC7D;AAEA,QAAM,aAAS;AAAA,IACb,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,CAAC;AAAA,IACD;AAAA,EACF;AAEA,aAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":["dictionaries"]}

package/dist/cjs/getIntlayerAsync.cjs

@@ -22,10 +22,10 @@ __export(getIntlayerAsync_exports, {
   getIntlayerAsync: () => getIntlayerAsync
 });
 module.exports = __toCommonJS(getIntlayerAsync_exports);
-var import_fetchDistantDictionary = require('./distantDictionary/fetchDistantDictionary.cjs');
+var import_api = require("@intlayer/api");
 var import_getDictionary = require('./getDictionary.cjs');
 const getIntlayerAsync = async (key, locale, isRenderEditor = true) => {
-  const jsonDistantDictionary = await (0, import_fetchDistantDictionary.fetchDistantDictionary)(key);
+  const jsonDistantDictionary = await (0, import_api.fetchDistantDictionary)(key);
   if (jsonDistantDictionary) {
     return (0, import_getDictionary.getDictionary)(
       jsonDistantDictionary,

package/dist/cjs/getIntlayerAsync.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/getIntlayerAsync.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport { DeclarationContent } from 'intlayer';\nimport { fetchDistantDictionary } from './distantDictionary/fetchDistantDictionary';\nimport { getDictionary } from './getDictionary';\nimport { DictionaryKeys, DataFromDictionaryKey } from './getIntlayer';\n\nexport type GetIntlayerAsync = <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = true,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor?: R\n) => Promise<DataFromDictionaryKey<T, L, R> | null>;\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * This hook will prerender the locale dictionary and fetch simultaneously the distant dictionaries to hydrate it.\n *\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const getIntlayerAsync: GetIntlayerAsync = async <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = true,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor = true as R\n) => {\n  const jsonDistantDictionary = await fetchDistantDictionary(key);\n\n  if (jsonDistantDictionary) {\n    return getDictionary(\n      jsonDistantDictionary as unknown as DeclarationContent,\n      locale,\n      isRenderEditor\n    ) as DataFromDictionaryKey<T, L, R>;\n  }\n\n  return null;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,oCAAuC;AACvC,2BAA8B;AAqBvB,MAAM,mBAAqC,OAKhD,KACA,QACA,iBAAiB,SACd;AACH,QAAM,wBAAwB,UAAM,sDAAuB,GAAG;AAE9D,MAAI,uBAAuB;AACzB,eAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../src/getIntlayerAsync.ts"],"sourcesContent":["'use client';\n\nimport { fetchDistantDictionary } from '@intlayer/api';\nimport type { Locales } from '@intlayer/config/client';\nimport { DeclarationContent } from 'intlayer';\nimport { getDictionary } from './getDictionary';\nimport { DictionaryKeys, DataFromDictionaryKey } from './getIntlayer';\n\nexport type GetIntlayerAsync = <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = true,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor?: R\n) => Promise<DataFromDictionaryKey<T, L, R> | null>;\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * This hook will prerender the locale dictionary and fetch simultaneously the distant dictionaries to hydrate it.\n *\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const getIntlayerAsync: GetIntlayerAsync = async <\n  T extends DictionaryKeys,\n  L extends Locales,\n  R extends boolean = true,\n>(\n  key: T,\n  locale?: L,\n  isRenderEditor = true as R\n) => {\n  const jsonDistantDictionary = await fetchDistantDictionary(key);\n\n  if (jsonDistantDictionary) {\n    return getDictionary(\n      jsonDistantDictionary as unknown as DeclarationContent,\n      locale,\n      isRenderEditor\n    ) as DataFromDictionaryKey<T, L, R>;\n  }\n\n  return null;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,iBAAuC;AAGvC,2BAA8B;AAqBvB,MAAM,mBAAqC,OAKhD,KACA,QACA,iBAAiB,SACd;AACH,QAAM,wBAAwB,UAAM,mCAAuB,GAAG;AAE9D,MAAI,uBAAuB;AACzB,eAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;","names":[]}

package/dist/cjs/recursiveTransformContent.cjs

@@ -0,0 +1,54 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var recursiveTransformContent_exports = {};
+__export(recursiveTransformContent_exports, {
+  recursiveTransformContent: () => recursiveTransformContent
+});
+module.exports = __toCommonJS(recursiveTransformContent_exports);
+var import_react = require("react");
+var import_renderContentEditor = require('./editor/renderContentEditor.cjs');
+const recursiveTransformContent = (value, isRenderEditor = false) => {
+  if (typeof value === "function") {
+    return (props) => recursiveTransformContent(value(props), isRenderEditor);
+  } else if (typeof value === "object") {
+    if (typeof value.dictionaryKey !== "undefined") {
+      if (isRenderEditor) {
+        return (0, import_renderContentEditor.renderIntlayerEditor)(value);
+      }
+      return value.content;
+    } else if (Array.isArray(value)) {
+      return value.map((el) => recursiveTransformContent(el, isRenderEditor));
+    } else if ((0, import_react.isValidElement)(value)) {
+      return value;
+    }
+    return Object.entries(value).reduce(
+      (acc, [key, value2]) => ({
+        ...acc,
+        [key]: recursiveTransformContent(value2, isRenderEditor)
+      }),
+      {}
+    );
+  }
+  return value;
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  recursiveTransformContent
+});
+//# sourceMappingURL=recursiveTransformContent.cjs.map

package/dist/cjs/recursiveTransformContent.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/recursiveTransformContent.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type { Locales } from '@intlayer/config';\nimport type { NodeType } from '@intlayer/core';\nimport { isValidElement, type ReactNode } from 'react';\nimport {\n  type IntlayerNode,\n  renderIntlayerEditor,\n} from './editor/renderContentEditor';\n\ntype TransformNodeType<T, L extends Locales, R extends boolean> = T extends {\n  [NodeType.Enumeration]: { '1': any };\n}\n  ? (\n      quantity: number\n    ) => DeepTransformContent<T[NodeType.Enumeration]['1'], L, R>\n  : T extends {\n        [NodeType.Translation]: object;\n      }\n    ? L extends keyof T[NodeType.Translation]\n      ? DeepTransformContent<T[NodeType.Translation][L], L, R>\n      : never\n    : T;\n\nexport type DeepTransformContent<\n  T,\n  L extends Locales,\n  R extends boolean,\n> = T extends object // Check if the property is an object\n  ? T extends (infer U)[] // If it's an array, infer the type of array elements\n    ? DeepTransformContent<U, L, R>[] // Apply DeepTransformContent recursively to each element of the array\n    : T extends {\n          nodeType: NodeType | string;\n        }\n      ? TransformNodeType<T, L, R>\n      : T extends { _owner: any; key: any; props: any; ref: any }\n        ? ReactNode\n        : {\n            [K in keyof T]: DeepTransformContent<T[K], L, R>;\n          }\n  : T extends undefined\n    ? never\n    : R extends true\n      ? IntlayerNode<T>\n      : T;\n\n/**\n * Go through the object. If a object has a keyPath, render the intlayer editor if editor enabled.\n */\nexport const recursiveTransformContent = (\n  value: any,\n  isRenderEditor = false\n): object => {\n  if (typeof value === 'function') {\n    return (props: any) =>\n      recursiveTransformContent(value(props), isRenderEditor);\n  } else if (typeof value === 'object') {\n    if (typeof value.dictionaryKey !== 'undefined') {\n      if (isRenderEditor) {\n        return renderIntlayerEditor(value);\n      }\n      return value.content;\n    } else if (Array.isArray(value)) {\n      return value.map((el) => recursiveTransformContent(el, isRenderEditor));\n    } else if (isValidElement(value)) {\n      return value;\n    }\n\n    return Object.entries(value).reduce(\n      (acc, [key, value]) => ({\n        ...acc,\n        [key]: recursiveTransformContent(value, isRenderEditor),\n      }),\n      {} as object\n    );\n  }\n\n  return value;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAA+C;AAC/C,iCAGO;AAyCA,MAAM,4BAA4B,CACvC,OACA,iBAAiB,UACN;AACX,MAAI,OAAO,UAAU,YAAY;AAC/B,WAAO,CAAC,UACN,0BAA0B,MAAM,KAAK,GAAG,cAAc;AAAA,EAC1D,WAAW,OAAO,UAAU,UAAU;AACpC,QAAI,OAAO,MAAM,kBAAkB,aAAa;AAC9C,UAAI,gBAAgB;AAClB,mBAAO,iDAAqB,KAAK;AAAA,MACnC;AACA,aAAO,MAAM;AAAA,IACf,WAAW,MAAM,QAAQ,KAAK,GAAG;AAC/B,aAAO,MAAM,IAAI,CAAC,OAAO,0BAA0B,IAAI,cAAc,CAAC;AAAA,IACxE,eAAW,6BAAe,KAAK,GAAG;AAChC,aAAO;AAAA,IACT;AAEA,WAAO,OAAO,QAAQ,KAAK,EAAE;AAAA,MAC3B,CAAC,KAAK,CAAC,KAAKA,MAAK,OAAO;AAAA,QACtB,GAAG;AAAA,QACH,CAAC,GAAG,GAAG,0BAA0BA,QAAO,cAAc;AAAA,MACxD;AAAA,MACA,CAAC;AAAA,IACH;AAAA,EACF;AAEA,SAAO;AACT;","names":["value"]}

package/dist/esm/client/PoweredByMeta.mjs

@@ -3,10 +3,15 @@ import { useEffect } from "react";
 const PoweredByMeta = () => {
   if (process.env.NODE_ENV !== "production") return null;
   useEffect(() => {
-    const metaTag = document.createElement("meta");
-    metaTag.name = "content-powered-by";
-    metaTag.content = "Intlayer - https://intlayer.org";
-    document.head.appendChild(metaTag);
+    const existingMeta = document.head.querySelector(
+      'meta[name="content-powered-by"]'
+    );
+    if (!existingMeta) {
+      const metaTag = document.createElement("meta");
+      metaTag.name = "content-powered-by";
+      metaTag.content = "Intlayer - https://intlayer.org";
+      document.head.appendChild(metaTag);
+    }
   }, []);
   return null;
 };

package/dist/esm/client/PoweredByMeta.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/client/PoweredByMeta.ts"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect } from 'react';\n\nexport const PoweredByMeta: FC = () => {\n  if (process.env.NODE_ENV !== 'production') return null;\n\n  useEffect(() => {\n    const metaTag = document.createElement('meta');\n    metaTag.name = 'content-powered-by';\n    metaTag.content = 'Intlayer - https://intlayer.org';\n    document.head.appendChild(metaTag);\n  }, []);\n\n  return null; // This component does not render anything visible\n};\n"],"mappings":";AAEA,SAAkB,iBAAiB;AAE5B,MAAM,gBAAoB,MAAM;AACrC,MAAI,QAAQ,IAAI,aAAa,aAAc,QAAO;AAElD,YAAU,MAAM;AACd,UAAM,UAAU,SAAS,cAAc,MAAM;AAC7C,YAAQ,OAAO;AACf,YAAQ,UAAU;AAClB,aAAS,KAAK,YAAY,OAAO;AAAA,EACnC,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../../src/client/PoweredByMeta.ts"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect } from 'react';\n\nexport const PoweredByMeta: FC = () => {\n  if (process.env.NODE_ENV !== 'production') return null;\n\n  useEffect(() => {\n    // Check if the meta tag already exists\n    const existingMeta = document.head.querySelector(\n      'meta[name=\"content-powered-by\"]'\n    );\n\n    if (!existingMeta) {\n      const metaTag = document.createElement('meta');\n      metaTag.name = 'content-powered-by';\n      metaTag.content = 'Intlayer - https://intlayer.org';\n      document.head.appendChild(metaTag);\n    }\n  }, []);\n\n  return null; // This component does not render anything visible\n};\n"],"mappings":";AAEA,SAAkB,iBAAiB;AAE5B,MAAM,gBAAoB,MAAM;AACrC,MAAI,QAAQ,IAAI,aAAa,aAAc,QAAO;AAElD,YAAU,MAAM;AAEd,UAAM,eAAe,SAAS,KAAK;AAAA,MACjC;AAAA,IACF;AAEA,QAAI,CAAC,cAAc;AACjB,YAAM,UAAU,SAAS,cAAc,MAAM;AAC7C,cAAQ,OAAO;AACf,cAAQ,UAAU;AAClB,eAAS,KAAK,YAAY,OAAO;AAAA,IACnC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;","names":[]}

package/dist/esm/editor/ContentSelectorWrapper.mjs

@@ -1,16 +1,17 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
+import { Fragment, jsx } from "react/jsx-runtime";
 import { isSameKeyPath } from "@intlayer/core";
+import {
+  useFocusDictionary,
+  useEditedContentActions,
+  useEditorEnabled
+} from "@intlayer/editor-react";
 import {
   useCallback,
   useEffect,
   useState,
   useMemo
 } from "react";
-import {
-  useFocusDictionary,
-  useEditedContentActions
-} from "@intlayer/editor-react";
 import { ContentSelector } from '../UI/ContentSelector.mjs';
 const ContentSelectorWrapper = ({
   children,
@@ -19,6 +20,7 @@ const ContentSelectorWrapper = ({
   keyPath,
   ...props
 }) => {
+  const { enabled } = useEditorEnabled();
   const { focusedContent, setFocusedContent } = useFocusDictionary();
   const { getEditedContentValue } = useEditedContentActions();
   const editedValue = useMemo(
@@ -35,7 +37,7 @@ const ContentSelectorWrapper = ({
     [dictionaryKey, dictionaryPath, keyPath, setFocusedContent]
   );
   const isSelected = useMemo(
-    () => ((focusedContent?.keyPath?.length ?? 0) > 0 && isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ?? false,
+    () => (focusedContent?.dictionaryKey === dictionaryKey && (focusedContent?.keyPath?.length ?? 0) > 0 && isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ?? false,
     [focusedContent, keyPath]
   );
   useEffect(() => {
@@ -45,7 +47,18 @@ const ContentSelectorWrapper = ({
       setDisplayedChildren(children);
     }
   }, [editedValue, focusedContent, children]);
-  return /* @__PURE__ */ jsx(ContentSelector, { onPress: handleSelect, isSelecting: isSelected, ...props, children: displayedChildren });
+  if (enabled) {
+    return /* @__PURE__ */ jsx(
+      ContentSelector,
+      {
+        onPress: handleSelect,
+        isSelecting: isSelected,
+        ...props,
+        children: displayedChildren
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children });
 };
 export {
   ContentSelectorWrapper

package/dist/esm/editor/ContentSelectorWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport { isSameKeyPath, type KeyPath } from '@intlayer/core';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  useMemo,\n  type FC,\n  type ReactNode,\n  HTMLAttributes,\n} from 'react';\nimport {\n  useFocusDictionary,\n  useEditedContentActions,\n} from '@intlayer/editor-react';\nimport { ContentSelector } from '../UI/ContentSelector';\n\ntype ContentData = {\n  dictionaryKey: string;\n  dictionaryPath: string;\n  keyPath: KeyPath[];\n};\n\nexport type ContentSelectorWrapperProps = ContentData &\n  HTMLAttributes<HTMLDivElement>;\n\nexport const ContentSelectorWrapper: FC<ContentSelectorWrapperProps> = ({\n  children,\n  dictionaryKey,\n  dictionaryPath,\n  keyPath,\n  ...props\n}) => {\n  const { focusedContent, setFocusedContent } = useFocusDictionary();\n  const { getEditedContentValue } = useEditedContentActions();\n\n  const editedValue = useMemo(\n    () => getEditedContentValue(dictionaryKey, keyPath),\n    [dictionaryKey, keyPath, getEditedContentValue]\n  );\n\n  const [displayedChildren, setDisplayedChildren] =\n    useState<ReactNode>(children);\n\n  const handleSelect = useCallback(\n    () =>\n      setFocusedContent({\n        dictionaryKey,\n        dictionaryPath,\n        keyPath,\n      }),\n    [dictionaryKey, dictionaryPath, keyPath, setFocusedContent]\n  );\n\n  const isSelected = useMemo(\n    () =>\n      ((focusedContent?.keyPath?.length ?? 0) > 0 &&\n        isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ??\n      false,\n    [focusedContent, keyPath]\n  );\n\n  useEffect(() => {\n    // Use useEffect to avoid 'Text content does not match server-rendered HTML' error\n    if (editedValue && typeof editedValue === 'string') {\n      setDisplayedChildren(editedValue);\n    } else {\n      setDisplayedChildren(children);\n    }\n  }, [editedValue, focusedContent, children]);\n\n  return (\n    <ContentSelector onPress={handleSelect} isSelecting={isSelected} {...props}>\n      {displayedChildren}\n    </ContentSelector>\n  );\n};\n"],"mappings":";AAyEI;AAvEJ,SAAS,qBAAmC;AAC5C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AACP;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAWzB,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,EAAE,gBAAgB,kBAAkB,IAAI,mBAAmB;AACjE,QAAM,EAAE,sBAAsB,IAAI,wBAAwB;AAE1D,QAAM,cAAc;AAAA,IAClB,MAAM,sBAAsB,eAAe,OAAO;AAAA,IAClD,CAAC,eAAe,SAAS,qBAAqB;AAAA,EAChD;AAEA,QAAM,CAAC,mBAAmB,oBAAoB,IAC5C,SAAoB,QAAQ;AAE9B,QAAM,eAAe;AAAA,IACnB,MACE,kBAAkB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACH,CAAC,eAAe,gBAAgB,SAAS,iBAAiB;AAAA,EAC5D;AAEA,QAAM,aAAa;AAAA,IACjB,QACI,gBAAgB,SAAS,UAAU,KAAK,KACxC,cAAc,gBAAgB,WAAW,CAAC,GAAG,OAAO,MACtD;AAAA,IACF,CAAC,gBAAgB,OAAO;AAAA,EAC1B;AAEA,YAAU,MAAM;AAEd,QAAI,eAAe,OAAO,gBAAgB,UAAU;AAClD,2BAAqB,WAAW;AAAA,IAClC,OAAO;AACL,2BAAqB,QAAQ;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,aAAa,gBAAgB,QAAQ,CAAC;AAE1C,SACE,oBAAC,mBAAgB,SAAS,cAAc,aAAa,YAAa,GAAG,OAClE,6BACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/editor/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport { isSameKeyPath, type KeyPath } from '@intlayer/core';\nimport {\n  useFocusDictionary,\n  useEditedContentActions,\n  useEditorEnabled,\n} from '@intlayer/editor-react';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  useMemo,\n  type FC,\n  type ReactNode,\n  HTMLAttributes,\n} from 'react';\nimport { ContentSelector } from '../UI/ContentSelector';\n\ntype ContentData = {\n  dictionaryKey: string;\n  dictionaryPath: string;\n  keyPath: KeyPath[];\n};\n\nexport type ContentSelectorWrapperProps = ContentData &\n  HTMLAttributes<HTMLDivElement>;\n\nexport const ContentSelectorWrapper: FC<ContentSelectorWrapperProps> = ({\n  children,\n  dictionaryKey,\n  dictionaryPath,\n  keyPath,\n  ...props\n}) => {\n  const { enabled } = useEditorEnabled();\n  const { focusedContent, setFocusedContent } = useFocusDictionary();\n  const { getEditedContentValue } = useEditedContentActions();\n\n  const editedValue = useMemo(\n    () => getEditedContentValue(dictionaryKey, keyPath),\n    [dictionaryKey, keyPath, getEditedContentValue]\n  );\n\n  const [displayedChildren, setDisplayedChildren] =\n    useState<ReactNode>(children);\n\n  const handleSelect = useCallback(\n    () =>\n      setFocusedContent({\n        dictionaryKey,\n        dictionaryPath,\n        keyPath,\n      }),\n    [dictionaryKey, dictionaryPath, keyPath, setFocusedContent]\n  );\n\n  const isSelected = useMemo(\n    () =>\n      (focusedContent?.dictionaryKey === dictionaryKey &&\n        (focusedContent?.keyPath?.length ?? 0) > 0 &&\n        isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ??\n      false,\n    [focusedContent, keyPath]\n  );\n\n  useEffect(() => {\n    // Use useEffect to avoid 'Text content does not match server-rendered HTML' error\n    if (editedValue && typeof editedValue === 'string') {\n      setDisplayedChildren(editedValue);\n    } else {\n      setDisplayedChildren(children);\n    }\n  }, [editedValue, focusedContent, children]);\n\n  if (enabled) {\n    return (\n      <ContentSelector\n        onPress={handleSelect}\n        isSelecting={isSelected}\n        {...props}\n      >\n        {displayedChildren}\n      </ContentSelector>\n    );\n  }\n\n  return <>{children}</>;\n};\n"],"mappings":";AA6EM,SAUG,UAVH;AA3EN,SAAS,qBAAmC;AAC5C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AACP,SAAS,uBAAuB;AAWzB,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,EAAE,QAAQ,IAAI,iBAAiB;AACrC,QAAM,EAAE,gBAAgB,kBAAkB,IAAI,mBAAmB;AACjE,QAAM,EAAE,sBAAsB,IAAI,wBAAwB;AAE1D,QAAM,cAAc;AAAA,IAClB,MAAM,sBAAsB,eAAe,OAAO;AAAA,IAClD,CAAC,eAAe,SAAS,qBAAqB;AAAA,EAChD;AAEA,QAAM,CAAC,mBAAmB,oBAAoB,IAC5C,SAAoB,QAAQ;AAE9B,QAAM,eAAe;AAAA,IACnB,MACE,kBAAkB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACH,CAAC,eAAe,gBAAgB,SAAS,iBAAiB;AAAA,EAC5D;AAEA,QAAM,aAAa;AAAA,IACjB,OACG,gBAAgB,kBAAkB,kBAChC,gBAAgB,SAAS,UAAU,KAAK,KACzC,cAAc,gBAAgB,WAAW,CAAC,GAAG,OAAO,MACtD;AAAA,IACF,CAAC,gBAAgB,OAAO;AAAA,EAC1B;AAEA,YAAU,MAAM;AAEd,QAAI,eAAe,OAAO,gBAAgB,UAAU;AAClD,2BAAqB,WAAW;AAAA,IAClC,OAAO;AACL,2BAAqB,QAAQ;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,aAAa,gBAAgB,QAAQ,CAAC;AAE1C,MAAI,SAAS;AACX,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT,aAAa;AAAA,QACZ,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,SAAO,gCAAG,UAAS;AACrB;","names":[]}

package/dist/esm/editor/IntlayerEditorProvider.mjs

@@ -1,15 +1,41 @@
-import { jsx } from "react/jsx-runtime";
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { getConfiguration } from "@intlayer/config/client";
-import { EditorProvider } from "@intlayer/editor-react";
-const {
-  editor: { enabled }
-} = getConfiguration();
-const IntlayerEditorProvider = ({ children }) => {
-  if (enabled) {
-    return /* @__PURE__ */ jsx(EditorProvider, { targetWindow: window, children });
-  }
-  return children;
+import dictionaries from "@intlayer/dictionaries-entry";
+import {
+  EditorProvider,
+  useCrossURLPathState,
+  useDictionariesRecordActions,
+  useConfigurationActions,
+  useIframeClickInterceptor
+} from "@intlayer/editor-react";
+import { useEffect } from "react";
+const IntlayerEditorProviderEnabled = () => {
+  useCrossURLPathState(void 0, {
+    receive: false,
+    emit: true
+  });
+  const { setConfiguration } = useConfigurationActions();
+  const { setLocaleDictionaries } = useDictionariesRecordActions();
+  useEffect(() => {
+    setLocaleDictionaries(dictionaries);
+    const config = getConfiguration();
+    setConfiguration(config);
+  }, [setLocaleDictionaries]);
+  useIframeClickInterceptor();
+  return /* @__PURE__ */ jsx(Fragment, {});
 };
+const IntlayerEditorProvider = ({ children }) => /* @__PURE__ */ jsxs(
+  EditorProvider,
+  {
+    postMessage: (data) => window.parent?.postMessage(data, "*"),
+    allowedOrigins: ["*"],
+    children: [
+      /* @__PURE__ */ jsx(IntlayerEditorProviderEnabled, {}),
+      children
+    ]
+  }
+);
 export {
   IntlayerEditorProvider
 };

package/dist/esm/editor/IntlayerEditorProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["import { FC, PropsWithChildren } from 'react';\nimport { getConfiguration } from '@intlayer/config/client';\nimport { EditorProvider } from '@intlayer/editor-react';\n\nconst {\n  editor: { enabled },\n} = getConfiguration();\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n  if (enabled) {\n    return <EditorProvider targetWindow={window}>{children}</EditorProvider>;\n  }\n\n  return children;\n};\n"],"mappings":"AAUW;AATX,SAAS,wBAAwB;AACjC,SAAS,sBAAsB;AAE/B,MAAM;AAAA,EACJ,QAAQ,EAAE,QAAQ;AACpB,IAAI,iBAAiB;AAEd,MAAM,yBAAgD,CAAC,EAAE,SAAS,MAAM;AAC7E,MAAI,SAAS;AACX,WAAO,oBAAC,kBAAe,cAAc,QAAS,UAAS;AAAA,EACzD;AAEA,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration } from '@intlayer/config/client';\nimport dictionaries from '@intlayer/dictionaries-entry';\nimport {\n  EditorProvider,\n  useCrossURLPathState,\n  useDictionariesRecordActions,\n  useConfigurationActions,\n  useIframeClickInterceptor,\n} from '@intlayer/editor-react';\nimport { useEffect, type FC, type PropsWithChildren } from 'react';\n\n/**\n * @intlayer/dictionaries-entry is a package that only returns the dictionary entry path.\n * Using an external package allow to alias it in the bundle configuration (such as webpack).\n * The alias allow hot reload the app (such as nextjs) on any dictionary change.\n */\nconst IntlayerEditorProviderEnabled: FC = () => {\n  /**\n   * URL Messages\n   */\n  useCrossURLPathState(undefined, {\n    receive: false,\n    emit: true,\n  });\n\n  /**\n   * Configuration Messages\n   */\n  const { setConfiguration } = useConfigurationActions();\n  const { setLocaleDictionaries } = useDictionariesRecordActions();\n\n  useEffect(() => {\n    setLocaleDictionaries(dictionaries);\n\n    const config = getConfiguration();\n    setConfiguration(config);\n  }, [setLocaleDictionaries]);\n\n  /**\n   * Click Messages\n   */\n  useIframeClickInterceptor();\n\n  return <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => (\n  <EditorProvider\n    postMessage={(data) => window.parent?.postMessage(data, '*')}\n    allowedOrigins={['*']}\n  >\n    <IntlayerEditorProviderEnabled />\n    {children}\n  </EditorProvider>\n);\n"],"mappings":";AA6CS,wBAIP,YAJO;AA3CT,SAAS,wBAAwB;AACjC,OAAO,kBAAkB;AACzB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,iBAAkD;AAO3D,MAAM,gCAAoC,MAAM;AAI9C,uBAAqB,QAAW;AAAA,IAC9B,SAAS;AAAA,IACT,MAAM;AAAA,EACR,CAAC;AAKD,QAAM,EAAE,iBAAiB,IAAI,wBAAwB;AACrD,QAAM,EAAE,sBAAsB,IAAI,6BAA6B;AAE/D,YAAU,MAAM;AACd,0BAAsB,YAAY;AAElC,UAAM,SAAS,iBAAiB;AAChC,qBAAiB,MAAM;AAAA,EACzB,GAAG,CAAC,qBAAqB,CAAC;AAK1B,4BAA0B;AAE1B,SAAO,gCAAE;AACX;AAEO,MAAM,yBAAgD,CAAC,EAAE,SAAS,MACvE;AAAA,EAAC;AAAA;AAAA,IACC,aAAa,CAAC,SAAS,OAAO,QAAQ,YAAY,MAAM,GAAG;AAAA,IAC3D,gBAAgB,CAAC,GAAG;AAAA,IAEpB;AAAA,0BAAC,iCAA8B;AAAA,MAC9B;AAAA;AAAA;AACH;","names":[]}