@intlayer/editor-react 5.3.12 → 5.4.0-canary.0

package/dist/cjs/ConfigurationContext.cjs

@@ -25,15 +25,20 @@ __export(ConfigurationContext_exports, {
 });
 module.exports = __toCommonJS(ConfigurationContext_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_editor = require("@intlayer/editor");
 var import_react = require("react");
 var import_useCrossFrameState = require('./useCrossFrameState.cjs');
 const ConfigurationStatesContext = (0, import_react.createContext)(
   void 0
 );
-const useConfigurationState = () => (0, import_useCrossFrameState.useCrossFrameState)("INTLAYER_CONFIGURATION", void 0, {
-  receive: false,
-  emit: true
-});
+const useConfigurationState = () => (0, import_useCrossFrameState.useCrossFrameState)(
+  import_editor.MessageKey.INTLAYER_CONFIGURATION,
+  void 0,
+  {
+    receive: false,
+    emit: true
+  }
+);
 const ConfigurationProvider = ({ children, configuration }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ConfigurationStatesContext.Provider, { value: configuration, children });
 const useConfiguration = () => (0, import_react.useContext)(ConfigurationStatesContext);
 // Annotate the CommonJS export names for ESM import in node:

package/dist/cjs/ConfigurationContext.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ConfigurationContext.tsx"],"sourcesContent":["'use client';\n\nimport { type IntlayerConfig } from '@intlayer/config/client';\nimport {\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n} from 'react';\nimport { useCrossFrameState } from './useCrossFrameState';\n\nconst ConfigurationStatesContext = createContext<IntlayerConfig | undefined>(\n  undefined\n);\n\nexport const useConfigurationState = () =>\n  useCrossFrameState<IntlayerConfig>('INTLAYER_CONFIGURATION', undefined, {\n    receive: false,\n    emit: true,\n  });\n\nexport type ConfigurationProviderProps = {\n  configuration?: IntlayerConfig;\n};\n\nexport const ConfigurationProvider: FC<\n  PropsWithChildren<ConfigurationProviderProps>\n> = ({ children, configuration }) => (\n  <ConfigurationStatesContext.Provider value={configuration}>\n    {children}\n  </ConfigurationStatesContext.Provider>\n);\n\nexport const useConfiguration = () => useContext(ConfigurationStatesContext);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BE;AAzBF,mBAKO;AACP,gCAAmC;AAEnC,MAAM,iCAA6B;AAAA,EACjC;AACF;AAEO,MAAM,wBAAwB,UACnC,8CAAmC,0BAA0B,QAAW;AAAA,EACtE,SAAS;AAAA,EACT,MAAM;AACR,CAAC;AAMI,MAAM,wBAET,CAAC,EAAE,UAAU,cAAc,MAC7B,4CAAC,2BAA2B,UAA3B,EAAoC,OAAO,eACzC,UACH;AAGK,MAAM,mBAAmB,UAAM,yBAAW,0BAA0B;","names":[]}
+{"version":3,"sources":["../../src/ConfigurationContext.tsx"],"sourcesContent":["'use client';\n\nimport { type IntlayerConfig } from '@intlayer/config/client';\nimport { MessageKey } from '@intlayer/editor';\nimport {\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n} from 'react';\nimport { useCrossFrameState } from './useCrossFrameState';\n\nconst ConfigurationStatesContext = createContext<IntlayerConfig | undefined>(\n  undefined\n);\n\nexport const useConfigurationState = () =>\n  useCrossFrameState<IntlayerConfig>(\n    MessageKey.INTLAYER_CONFIGURATION,\n    undefined,\n    {\n      receive: false,\n      emit: true,\n    }\n  );\n\nexport type ConfigurationProviderProps = {\n  configuration?: IntlayerConfig;\n};\n\nexport const ConfigurationProvider: FC<\n  PropsWithChildren<ConfigurationProviderProps>\n> = ({ children, configuration }) => (\n  <ConfigurationStatesContext.Provider value={configuration}>\n    {children}\n  </ConfigurationStatesContext.Provider>\n);\n\nexport const useConfiguration = () => useContext(ConfigurationStatesContext);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiCE;AA9BF,oBAA2B;AAC3B,mBAKO;AACP,gCAAmC;AAEnC,MAAM,iCAA6B;AAAA,EACjC;AACF;AAEO,MAAM,wBAAwB,UACnC;AAAA,EACE,yBAAW;AAAA,EACX;AAAA,EACA;AAAA,IACE,SAAS;AAAA,IACT,MAAM;AAAA,EACR;AACF;AAMK,MAAM,wBAET,CAAC,EAAE,UAAU,cAAc,MAC7B,4CAAC,2BAA2B,UAA3B,EAAoC,OAAO,eACzC,UACH;AAGK,MAAM,mBAAmB,UAAM,yBAAW,0BAA0B;","names":[]}

package/dist/cjs/DictionariesRecordContext.cjs

@@ -25,6 +25,7 @@ __export(DictionariesRecordContext_exports, {
 });
 module.exports = __toCommonJS(DictionariesRecordContext_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_editor = require("@intlayer/editor");
 var import_react = require("react");
 var import_useCrossFrameState = require('./useCrossFrameState.cjs');
 const DictionariesRecordStatesContext = (0, import_react.createContext)(void 0);
@@ -33,7 +34,7 @@ const DictionariesRecordProvider = ({
   children
 }) => {
   const [localeDictionaries, setLocaleDictionaries] = (0, import_useCrossFrameState.useCrossFrameState)(
-    "INTLAYER_LOCALE_DICTIONARIES_CHANGED",
+    import_editor.MessageKey.INTLAYER_LOCALE_DICTIONARIES_CHANGED,
     void 0
   );
   const stateValue = (0, import_react.useMemo)(

package/dist/cjs/DictionariesRecordContext.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/DictionariesRecordContext.tsx"],"sourcesContent":["'use client';\n\nimport type { Dictionary } from '@intlayer/core';\nimport {\n  createContext,\n  useContext,\n  type Dispatch,\n  type SetStateAction,\n  type FC,\n  type PropsWithChildren,\n  useMemo,\n} from 'react';\nimport { useCrossFrameState } from './useCrossFrameState';\n\nexport type DictionaryContent = Record<Dictionary['key'], Dictionary>;\n\ntype DictionariesRecordStatesContextType = {\n  localeDictionaries: DictionaryContent;\n};\ntype DictionariesRecordActionsContextType = {\n  setLocaleDictionaries: Dispatch<SetStateAction<DictionaryContent>>;\n  setLocaleDictionary: (dictionary: Dictionary) => void;\n};\n\nconst DictionariesRecordStatesContext = createContext<\n  DictionariesRecordStatesContextType | undefined\n>(undefined);\nconst DictionariesRecordActionsContext = createContext<\n  DictionariesRecordActionsContextType | undefined\n>(undefined);\n\nexport const DictionariesRecordProvider: FC<PropsWithChildren> = ({\n  children,\n}) => {\n  const [localeDictionaries, setLocaleDictionaries] =\n    useCrossFrameState<DictionaryContent>(\n      'INTLAYER_LOCALE_DICTIONARIES_CHANGED',\n      undefined\n    );\n\n  const stateValue = useMemo(\n    () => ({\n      localeDictionaries: localeDictionaries ?? {},\n    }),\n    [localeDictionaries]\n  );\n\n  const actionValue = useMemo(\n    () => ({\n      setLocaleDictionaries,\n      setLocaleDictionary: (dictionary: Dictionary) => {\n        setLocaleDictionaries((dictionaries) => ({\n          ...dictionaries,\n          [dictionary.key]: dictionary,\n        }));\n      },\n    }),\n    [setLocaleDictionaries]\n  );\n\n  return (\n    <DictionariesRecordStatesContext.Provider value={stateValue}>\n      <DictionariesRecordActionsContext.Provider value={actionValue}>\n        {children}\n      </DictionariesRecordActionsContext.Provider>\n    </DictionariesRecordStatesContext.Provider>\n  );\n};\n\nexport const useDictionariesRecordActions = () =>\n  useContext(DictionariesRecordActionsContext);\n\nexport const useDictionariesRecord = () => {\n  const actionsContext = useDictionariesRecordActions();\n  const statesContext = useContext(DictionariesRecordStatesContext);\n\n  if (!statesContext) {\n    throw new Error(\n      'useDictionariesRecordStates must be used within a DictionariesRecordProvider'\n    );\n  }\n\n  return { ...statesContext, ...actionsContext };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA8DM;AA3DN,mBAQO;AACP,gCAAmC;AAYnC,MAAM,sCAAkC,4BAEtC,MAAS;AACX,MAAM,uCAAmC,4BAEvC,MAAS;AAEJ,MAAM,6BAAoD,CAAC;AAAA,EAChE;AACF,MAAM;AACJ,QAAM,CAAC,oBAAoB,qBAAqB,QAC9C;AAAA,IACE;AAAA,IACA;AAAA,EACF;AAEF,QAAM,iBAAa;AAAA,IACjB,OAAO;AAAA,MACL,oBAAoB,sBAAsB,CAAC;AAAA,IAC7C;AAAA,IACA,CAAC,kBAAkB;AAAA,EACrB;AAEA,QAAM,kBAAc;AAAA,IAClB,OAAO;AAAA,MACL;AAAA,MACA,qBAAqB,CAAC,eAA2B;AAC/C,8BAAsB,CAAC,kBAAkB;AAAA,UACvC,GAAG;AAAA,UACH,CAAC,WAAW,GAAG,GAAG;AAAA,QACpB,EAAE;AAAA,MACJ;AAAA,IACF;AAAA,IACA,CAAC,qBAAqB;AAAA,EACxB;AAEA,SACE,4CAAC,gCAAgC,UAAhC,EAAyC,OAAO,YAC/C,sDAAC,iCAAiC,UAAjC,EAA0C,OAAO,aAC/C,UACH,GACF;AAEJ;AAEO,MAAM,+BAA+B,UAC1C,yBAAW,gCAAgC;AAEtC,MAAM,wBAAwB,MAAM;AACzC,QAAM,iBAAiB,6BAA6B;AACpD,QAAM,oBAAgB,yBAAW,+BAA+B;AAEhE,MAAI,CAAC,eAAe;AAClB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEA,SAAO,EAAE,GAAG,eAAe,GAAG,eAAe;AAC/C;","names":[]}
+{"version":3,"sources":["../../src/DictionariesRecordContext.tsx"],"sourcesContent":["'use client';\n\nimport type { Dictionary } from '@intlayer/core';\nimport { MessageKey } from '@intlayer/editor';\nimport {\n  createContext,\n  useContext,\n  useMemo,\n  type Dispatch,\n  type FC,\n  type PropsWithChildren,\n  type SetStateAction,\n} from 'react';\nimport { useCrossFrameState } from './useCrossFrameState';\n\nexport type DictionaryContent = Record<Dictionary['key'], Dictionary>;\n\ntype DictionariesRecordStatesContextType = {\n  localeDictionaries: DictionaryContent;\n};\ntype DictionariesRecordActionsContextType = {\n  setLocaleDictionaries: Dispatch<SetStateAction<DictionaryContent>>;\n  setLocaleDictionary: (dictionary: Dictionary) => void;\n};\n\nconst DictionariesRecordStatesContext = createContext<\n  DictionariesRecordStatesContextType | undefined\n>(undefined);\nconst DictionariesRecordActionsContext = createContext<\n  DictionariesRecordActionsContextType | undefined\n>(undefined);\n\nexport const DictionariesRecordProvider: FC<PropsWithChildren> = ({\n  children,\n}) => {\n  const [localeDictionaries, setLocaleDictionaries] =\n    useCrossFrameState<DictionaryContent>(\n      MessageKey.INTLAYER_LOCALE_DICTIONARIES_CHANGED,\n      undefined\n    );\n\n  const stateValue = useMemo(\n    () => ({\n      localeDictionaries: localeDictionaries ?? {},\n    }),\n    [localeDictionaries]\n  );\n\n  const actionValue = useMemo(\n    () => ({\n      setLocaleDictionaries,\n      setLocaleDictionary: (dictionary: Dictionary) => {\n        setLocaleDictionaries((dictionaries) => ({\n          ...dictionaries,\n          [dictionary.key]: dictionary,\n        }));\n      },\n    }),\n    [setLocaleDictionaries]\n  );\n\n  return (\n    <DictionariesRecordStatesContext.Provider value={stateValue}>\n      <DictionariesRecordActionsContext.Provider value={actionValue}>\n        {children}\n      </DictionariesRecordActionsContext.Provider>\n    </DictionariesRecordStatesContext.Provider>\n  );\n};\n\nexport const useDictionariesRecordActions = () =>\n  useContext(DictionariesRecordActionsContext);\n\nexport const useDictionariesRecord = () => {\n  const actionsContext = useDictionariesRecordActions();\n  const statesContext = useContext(DictionariesRecordStatesContext);\n\n  if (!statesContext) {\n    throw new Error(\n      'useDictionariesRecordStates must be used within a DictionariesRecordProvider'\n    );\n  }\n\n  return { ...statesContext, ...actionsContext };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+DM;AA5DN,oBAA2B;AAC3B,mBAQO;AACP,gCAAmC;AAYnC,MAAM,sCAAkC,4BAEtC,MAAS;AACX,MAAM,uCAAmC,4BAEvC,MAAS;AAEJ,MAAM,6BAAoD,CAAC;AAAA,EAChE;AACF,MAAM;AACJ,QAAM,CAAC,oBAAoB,qBAAqB,QAC9C;AAAA,IACE,yBAAW;AAAA,IACX;AAAA,EACF;AAEF,QAAM,iBAAa;AAAA,IACjB,OAAO;AAAA,MACL,oBAAoB,sBAAsB,CAAC;AAAA,IAC7C;AAAA,IACA,CAAC,kBAAkB;AAAA,EACrB;AAEA,QAAM,kBAAc;AAAA,IAClB,OAAO;AAAA,MACL;AAAA,MACA,qBAAqB,CAAC,eAA2B;AAC/C,8BAAsB,CAAC,kBAAkB;AAAA,UACvC,GAAG;AAAA,UACH,CAAC,WAAW,GAAG,GAAG;AAAA,QACpB,EAAE;AAAA,MACJ;AAAA,IACF;AAAA,IACA,CAAC,qBAAqB;AAAA,EACxB;AAEA,SACE,4CAAC,gCAAgC,UAAhC,EAAyC,OAAO,YAC/C,sDAAC,iCAAiC,UAAjC,EAA0C,OAAO,aAC/C,UACH,GACF;AAEJ;AAEO,MAAM,+BAA+B,UAC1C,yBAAW,gCAAgC;AAEtC,MAAM,wBAAwB,MAAM;AACzC,QAAM,iBAAiB,6BAA6B;AACpD,QAAM,oBAAgB,yBAAW,+BAA+B;AAEhE,MAAI,CAAC,eAAe;AAClB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEA,SAAO,EAAE,GAAG,eAAe,GAAG,eAAe;AAC/C;","names":[]}

package/dist/cjs/EditedContentContext.cjs

@@ -28,24 +28,27 @@ __export(EditedContentContext_exports, {
 module.exports = __toCommonJS(EditedContentContext_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_core = require("@intlayer/core");
+var import_editor = require("@intlayer/editor");
 var import_react = require("react");
 var import_DictionariesRecordContext = require('./DictionariesRecordContext.cjs');
-var import_useCrossFrameState = require('./useCrossFrameState.cjs');
 var import_useCrossFrameMessageListener = require('./useCrossFrameMessageListener.cjs');
+var import_useCrossFrameState = require('./useCrossFrameState.cjs');
 const EditedContentStateContext = (0, import_react.createContext)(void 0);
 const usePostEditedContentState = (onEventTriggered) => (0, import_useCrossFrameMessageListener.useCrossFrameMessageListener)(
-  "INTLAYER_EDITED_CONTENT_CHANGED/post",
+  `${import_editor.MessageKey.INTLAYER_EDITED_CONTENT_CHANGED}/post`,
   onEventTriggered
 );
 const useGetEditedContentState = (onEventTriggered) => (0, import_useCrossFrameMessageListener.useCrossFrameMessageListener)(
-  "INTLAYER_EDITED_CONTENT_CHANGED/get",
+  `${import_editor.MessageKey.INTLAYER_EDITED_CONTENT_CHANGED}/get`,
   onEventTriggered
 );
 const EditedContentActionsContext = (0, import_react.createContext)(void 0);
 const resolveState = (state, prevState) => typeof state === "function" ? state(prevState) : state;
 const EditedContentProvider = ({ children }) => {
   const { localeDictionaries } = (0, import_DictionariesRecordContext.useDictionariesRecord)();
-  const [editedContent, setEditedContentState] = (0, import_useCrossFrameState.useCrossFrameState)("INTLAYER_EDITED_CONTENT_CHANGED");
+  const [editedContent, setEditedContentState] = (0, import_useCrossFrameState.useCrossFrameState)(
+    import_editor.MessageKey.INTLAYER_EDITED_CONTENT_CHANGED
+  );
   const setEditedDictionary = (newValue) => {
     let updatedDictionaries = resolveState(newValue);
     setEditedContentState((prev) => {

package/dist/cjs/EditedContentContext.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/EditedContentContext.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type Dictionary,\n  type ContentNode,\n  type KeyPath,\n  editDictionaryByKeyPath,\n  getContentNodeByKeyPath,\n  renameContentNodeByKeyPath,\n} from '@intlayer/core';\nimport {\n  type Dispatch,\n  createContext,\n  useContext,\n  type SetStateAction,\n  type FC,\n  type PropsWithChildren,\n} from 'react';\nimport {\n  useDictionariesRecord,\n  type DictionaryContent,\n} from './DictionariesRecordContext';\nimport { useCrossFrameState } from './useCrossFrameState';\nimport { useCrossFrameMessageListener } from './useCrossFrameMessageListener';\n\ntype EditedContentStateContextType = {\n  editedContent: Record<Dictionary['key'], Dictionary> | undefined;\n};\n\nconst EditedContentStateContext = createContext<\n  EditedContentStateContextType | undefined\n>(undefined);\n\nexport const usePostEditedContentState = <S,>(\n  onEventTriggered?: (data: S) => void\n) =>\n  useCrossFrameMessageListener(\n    'INTLAYER_EDITED_CONTENT_CHANGED/post',\n    onEventTriggered\n  );\n\nexport const useGetEditedContentState = <S,>(\n  onEventTriggered?: (data: S) => void\n) =>\n  useCrossFrameMessageListener(\n    'INTLAYER_EDITED_CONTENT_CHANGED/get',\n    onEventTriggered\n  );\n\ntype EditedContentActionsContextType = {\n  setEditedContentState: (\n    editedContent: Record<Dictionary['key'], Dictionary>\n  ) => void;\n  setEditedDictionary: Dispatch<SetStateAction<Dictionary>>;\n  setEditedContent: (\n    dictionaryKey: Dictionary['key'],\n    newValue: Dictionary['content']\n  ) => void;\n  addEditedContent: (\n    dictionaryKey: Dictionary['key'],\n    newValue: ContentNode<any>,\n    keyPath?: KeyPath[],\n    overwrite?: boolean\n  ) => void;\n  renameEditedContent: (\n    dictionaryKey: Dictionary['key'],\n    newKey: KeyPath['key'],\n    keyPath?: KeyPath[]\n  ) => void;\n  removeEditedContent: (\n    dictionaryKey: Dictionary['key'],\n    keyPath: KeyPath[]\n  ) => void;\n  restoreEditedContent: (dictionaryKey: Dictionary['key']) => void;\n  clearEditedDictionaryContent: (dictionaryKey: Dictionary['key']) => void;\n  clearEditedContent: () => void;\n  getEditedContentValue: (\n    dictionaryKey: Dictionary['key'],\n    keyPath: KeyPath[]\n  ) => ContentNode | undefined;\n};\n\nconst EditedContentActionsContext = createContext<\n  EditedContentActionsContextType | undefined\n>(undefined);\n\nconst resolveState = <S,>(state?: SetStateAction<S>, prevState?: S): S =>\n  typeof state === 'function'\n    ? (state as (prevState?: S) => S)(prevState)\n    : (state as S);\n\nexport const EditedContentProvider: FC<PropsWithChildren> = ({ children }) => {\n  const { localeDictionaries } = useDictionariesRecord();\n\n  const [editedContent, setEditedContentState] =\n    useCrossFrameState<DictionaryContent>('INTLAYER_EDITED_CONTENT_CHANGED');\n\n  const setEditedDictionary: Dispatch<SetStateAction<Dictionary>> = (\n    newValue\n  ) => {\n    let updatedDictionaries: Dictionary = resolveState(newValue);\n\n    setEditedContentState((prev) => {\n      updatedDictionaries = resolveState(\n        newValue,\n        prev?.[updatedDictionaries.key]\n      );\n\n      return {\n        ...prev,\n        [updatedDictionaries.key]: updatedDictionaries,\n      };\n    });\n\n    return updatedDictionaries;\n  };\n\n  const setEditedContent = (\n    dictionaryKey: Dictionary['key'],\n    newValue: Dictionary['content']\n  ) => {\n    setEditedContentState((prev) => ({\n      ...prev,\n      [dictionaryKey]: {\n        ...prev?.[dictionaryKey],\n        content: newValue,\n      },\n    }));\n  };\n\n  const addEditedContent = (\n    dictionaryKey: Dictionary['key'],\n    newValue: ContentNode,\n    keyPath: KeyPath[] = [],\n    overwrite: boolean = true\n  ) => {\n    setEditedContentState((prev) => {\n      // Get the starting content: edited version if available, otherwise a deep copy of the original\n      const originalContent = localeDictionaries[dictionaryKey]?.content;\n      const currentContent = structuredClone(\n        prev?.[dictionaryKey]?.content ?? originalContent\n      );\n\n      let newKeyPath = keyPath;\n      if (!overwrite) {\n        // Find a unique key based on the keyPath provided\n        let index = 0;\n        const otherKeyPath = keyPath.slice(0, -1);\n        const lastKeyPath: KeyPath = keyPath[keyPath.length - 1];\n        let finalKey = lastKeyPath.key;\n\n        // Loop until we find a key that does not exist\n        while (\n          typeof getContentNodeByKeyPath(currentContent, newKeyPath) !==\n          'undefined'\n        ) {\n          index++;\n          finalKey =\n            index === 0 ? lastKeyPath.key : `${lastKeyPath.key} (${index})`;\n          newKeyPath = [\n            ...otherKeyPath,\n            { ...lastKeyPath, key: finalKey } as KeyPath,\n          ];\n        }\n      }\n\n      const updatedContent = editDictionaryByKeyPath(\n        currentContent,\n        newKeyPath,\n        newValue\n      );\n\n      return {\n        ...prev,\n        [dictionaryKey]: {\n          ...prev?.[dictionaryKey],\n          content: updatedContent as Dictionary['content'],\n        },\n      };\n    });\n  };\n\n  const renameEditedContent = (\n    dictionaryKey: Dictionary['key'],\n    newKey: KeyPath['key'],\n    keyPath: KeyPath[] = []\n  ) => {\n    setEditedContentState((prev) => {\n      // Retrieve the base content: use edited version if available, otherwise deep copy of original\n      const originalContent = localeDictionaries[dictionaryKey]?.content;\n      const currentContent = structuredClone(\n        prev?.[dictionaryKey]?.content ?? originalContent\n      );\n\n      const contentWithNewField = renameContentNodeByKeyPath(\n        currentContent,\n        newKey,\n        keyPath\n      );\n\n      return {\n        ...prev,\n        [dictionaryKey]: {\n          ...prev?.[dictionaryKey],\n          content: contentWithNewField as Dictionary['content'],\n        },\n      };\n    });\n  };\n\n  const removeEditedContent = (\n    dictionaryKey: Dictionary['key'],\n    keyPath: KeyPath[]\n  ) => {\n    setEditedContentState((prev) => {\n      // Retrieve the original content as reference\n      const originalContent = localeDictionaries[dictionaryKey]?.content;\n      const currentContent = structuredClone(\n        prev?.[dictionaryKey]?.content ?? originalContent\n      );\n\n      // Get the initial value from the original dictionary content\n      const initialContent = getContentNodeByKeyPath(originalContent, keyPath);\n\n      // Restore the value at the given keyPath\n      const restoredContent = editDictionaryByKeyPath(\n        currentContent,\n        keyPath,\n        initialContent\n      );\n\n      return {\n        ...prev,\n        [dictionaryKey]: {\n          ...prev?.[dictionaryKey],\n          content: restoredContent as Dictionary['content'],\n        },\n      };\n    });\n  };\n\n  const restoreEditedContent = (dictionaryKey: Dictionary['key']) => {\n    setEditedContentState((prev) => {\n      const updated = { ...prev };\n      delete updated[dictionaryKey];\n      return updated;\n    });\n  };\n\n  const clearEditedDictionaryContent = (dictionaryKey: Dictionary['key']) => {\n    setEditedContentState((prev) => {\n      const filtered = Object.entries(prev).reduce((acc, [key, value]) => {\n        if (key === dictionaryKey) {\n          return acc;\n        }\n        return { ...acc, [key]: value };\n      }, {} as DictionaryContent);\n      return filtered;\n    });\n  };\n\n  const clearEditedContent = () => {\n    setEditedContentState({});\n  };\n\n  const getEditedContentValue = (\n    dictionaryKey: Dictionary['key'],\n    keyPath: KeyPath[]\n  ): ContentNode | undefined => {\n    const currentContent = editedContent?.[dictionaryKey]?.content ?? {};\n    return getContentNodeByKeyPath(currentContent, keyPath);\n  };\n\n  return (\n    <EditedContentStateContext.Provider\n      value={{\n        editedContent,\n      }}\n    >\n      <EditedContentActionsContext.Provider\n        value={{\n          setEditedContentState,\n          setEditedDictionary,\n          setEditedContent,\n          addEditedContent,\n          renameEditedContent,\n          removeEditedContent,\n          restoreEditedContent,\n          clearEditedDictionaryContent,\n          clearEditedContent,\n          getEditedContentValue,\n        }}\n      >\n        {children}\n      </EditedContentActionsContext.Provider>\n    </EditedContentStateContext.Provider>\n  );\n};\n\nexport const useEditedContentActions = () =>\n  useContext(EditedContentActionsContext);\n\nexport const useEditedContent = () => {\n  const stateContext = useContext(EditedContentStateContext);\n  const actionContext = useEditedContentActions();\n\n  return { ...stateContext, ...actionContext };\n};\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/EditedContentContext.tsx"],"sourcesContent":["'use client';\n\nimport {\n  editDictionaryByKeyPath,\n  getContentNodeByKeyPath,\n  renameContentNodeByKeyPath,\n  type ContentNode,\n  type Dictionary,\n  type KeyPath,\n} from '@intlayer/core';\nimport { MessageKey } from '@intlayer/editor';\nimport {\n  createContext,\n  useContext,\n  type Dispatch,\n  type FC,\n  type PropsWithChildren,\n  type SetStateAction,\n} from 'react';\nimport {\n  useDictionariesRecord,\n  type DictionaryContent,\n} from './DictionariesRecordContext';\nimport { useCrossFrameMessageListener } from './useCrossFrameMessageListener';\nimport { useCrossFrameState } from './useCrossFrameState';\n\ntype EditedContentStateContextType = {\n  editedContent: Record<Dictionary['key'], Dictionary> | undefined;\n};\n\nconst EditedContentStateContext = createContext<\n  EditedContentStateContextType | undefined\n>(undefined);\n\nexport const usePostEditedContentState = <S,>(\n  onEventTriggered?: (data: S) => void\n) =>\n  useCrossFrameMessageListener(\n    `${MessageKey.INTLAYER_EDITED_CONTENT_CHANGED}/post`,\n    onEventTriggered\n  );\n\nexport const useGetEditedContentState = <S,>(\n  onEventTriggered?: (data: S) => void\n) =>\n  useCrossFrameMessageListener(\n    `${MessageKey.INTLAYER_EDITED_CONTENT_CHANGED}/get`,\n    onEventTriggered\n  );\n\ntype EditedContentActionsContextType = {\n  setEditedContentState: (\n    editedContent: Record<Dictionary['key'], Dictionary>\n  ) => void;\n  setEditedDictionary: Dispatch<SetStateAction<Dictionary>>;\n  setEditedContent: (\n    dictionaryKey: Dictionary['key'],\n    newValue: Dictionary['content']\n  ) => void;\n  addEditedContent: (\n    dictionaryKey: Dictionary['key'],\n    newValue: ContentNode<any>,\n    keyPath?: KeyPath[],\n    overwrite?: boolean\n  ) => void;\n  renameEditedContent: (\n    dictionaryKey: Dictionary['key'],\n    newKey: KeyPath['key'],\n    keyPath?: KeyPath[]\n  ) => void;\n  removeEditedContent: (\n    dictionaryKey: Dictionary['key'],\n    keyPath: KeyPath[]\n  ) => void;\n  restoreEditedContent: (dictionaryKey: Dictionary['key']) => void;\n  clearEditedDictionaryContent: (dictionaryKey: Dictionary['key']) => void;\n  clearEditedContent: () => void;\n  getEditedContentValue: (\n    dictionaryKey: Dictionary['key'],\n    keyPath: KeyPath[]\n  ) => ContentNode | undefined;\n};\n\nconst EditedContentActionsContext = createContext<\n  EditedContentActionsContextType | undefined\n>(undefined);\n\nconst resolveState = <S,>(state?: SetStateAction<S>, prevState?: S): S =>\n  typeof state === 'function'\n    ? (state as (prevState?: S) => S)(prevState)\n    : (state as S);\n\nexport const EditedContentProvider: FC<PropsWithChildren> = ({ children }) => {\n  const { localeDictionaries } = useDictionariesRecord();\n\n  const [editedContent, setEditedContentState] =\n    useCrossFrameState<DictionaryContent>(\n      MessageKey.INTLAYER_EDITED_CONTENT_CHANGED\n    );\n\n  const setEditedDictionary: Dispatch<SetStateAction<Dictionary>> = (\n    newValue\n  ) => {\n    let updatedDictionaries: Dictionary = resolveState(newValue);\n\n    setEditedContentState((prev) => {\n      updatedDictionaries = resolveState(\n        newValue,\n        prev?.[updatedDictionaries.key]\n      );\n\n      return {\n        ...prev,\n        [updatedDictionaries.key]: updatedDictionaries,\n      };\n    });\n\n    return updatedDictionaries;\n  };\n\n  const setEditedContent = (\n    dictionaryKey: Dictionary['key'],\n    newValue: Dictionary['content']\n  ) => {\n    setEditedContentState((prev) => ({\n      ...prev,\n      [dictionaryKey]: {\n        ...prev?.[dictionaryKey],\n        content: newValue,\n      },\n    }));\n  };\n\n  const addEditedContent = (\n    dictionaryKey: Dictionary['key'],\n    newValue: ContentNode,\n    keyPath: KeyPath[] = [],\n    overwrite: boolean = true\n  ) => {\n    setEditedContentState((prev) => {\n      // Get the starting content: edited version if available, otherwise a deep copy of the original\n      const originalContent = localeDictionaries[dictionaryKey]?.content;\n      const currentContent = structuredClone(\n        prev?.[dictionaryKey]?.content ?? originalContent\n      );\n\n      let newKeyPath = keyPath;\n      if (!overwrite) {\n        // Find a unique key based on the keyPath provided\n        let index = 0;\n        const otherKeyPath = keyPath.slice(0, -1);\n        const lastKeyPath: KeyPath = keyPath[keyPath.length - 1];\n        let finalKey = lastKeyPath.key;\n\n        // Loop until we find a key that does not exist\n        while (\n          typeof getContentNodeByKeyPath(currentContent, newKeyPath) !==\n          'undefined'\n        ) {\n          index++;\n          finalKey =\n            index === 0 ? lastKeyPath.key : `${lastKeyPath.key} (${index})`;\n          newKeyPath = [\n            ...otherKeyPath,\n            { ...lastKeyPath, key: finalKey } as KeyPath,\n          ];\n        }\n      }\n\n      const updatedContent = editDictionaryByKeyPath(\n        currentContent,\n        newKeyPath,\n        newValue\n      );\n\n      return {\n        ...prev,\n        [dictionaryKey]: {\n          ...prev?.[dictionaryKey],\n          content: updatedContent as Dictionary['content'],\n        },\n      };\n    });\n  };\n\n  const renameEditedContent = (\n    dictionaryKey: Dictionary['key'],\n    newKey: KeyPath['key'],\n    keyPath: KeyPath[] = []\n  ) => {\n    setEditedContentState((prev) => {\n      // Retrieve the base content: use edited version if available, otherwise deep copy of original\n      const originalContent = localeDictionaries[dictionaryKey]?.content;\n      const currentContent = structuredClone(\n        prev?.[dictionaryKey]?.content ?? originalContent\n      );\n\n      const contentWithNewField = renameContentNodeByKeyPath(\n        currentContent,\n        newKey,\n        keyPath\n      );\n\n      return {\n        ...prev,\n        [dictionaryKey]: {\n          ...prev?.[dictionaryKey],\n          content: contentWithNewField as Dictionary['content'],\n        },\n      };\n    });\n  };\n\n  const removeEditedContent = (\n    dictionaryKey: Dictionary['key'],\n    keyPath: KeyPath[]\n  ) => {\n    setEditedContentState((prev) => {\n      // Retrieve the original content as reference\n      const originalContent = localeDictionaries[dictionaryKey]?.content;\n      const currentContent = structuredClone(\n        prev?.[dictionaryKey]?.content ?? originalContent\n      );\n\n      // Get the initial value from the original dictionary content\n      const initialContent = getContentNodeByKeyPath(originalContent, keyPath);\n\n      // Restore the value at the given keyPath\n      const restoredContent = editDictionaryByKeyPath(\n        currentContent,\n        keyPath,\n        initialContent\n      );\n\n      return {\n        ...prev,\n        [dictionaryKey]: {\n          ...prev?.[dictionaryKey],\n          content: restoredContent as Dictionary['content'],\n        },\n      };\n    });\n  };\n\n  const restoreEditedContent = (dictionaryKey: Dictionary['key']) => {\n    setEditedContentState((prev) => {\n      const updated = { ...prev };\n      delete updated[dictionaryKey];\n      return updated;\n    });\n  };\n\n  const clearEditedDictionaryContent = (dictionaryKey: Dictionary['key']) => {\n    setEditedContentState((prev) => {\n      const filtered = Object.entries(prev).reduce((acc, [key, value]) => {\n        if (key === dictionaryKey) {\n          return acc;\n        }\n        return { ...acc, [key]: value };\n      }, {} as DictionaryContent);\n      return filtered;\n    });\n  };\n\n  const clearEditedContent = () => {\n    setEditedContentState({});\n  };\n\n  const getEditedContentValue = (\n    dictionaryKey: Dictionary['key'],\n    keyPath: KeyPath[]\n  ): ContentNode | undefined => {\n    const currentContent = editedContent?.[dictionaryKey]?.content ?? {};\n    return getContentNodeByKeyPath(currentContent, keyPath);\n  };\n\n  return (\n    <EditedContentStateContext.Provider\n      value={{\n        editedContent,\n      }}\n    >\n      <EditedContentActionsContext.Provider\n        value={{\n          setEditedContentState,\n          setEditedDictionary,\n          setEditedContent,\n          addEditedContent,\n          renameEditedContent,\n          removeEditedContent,\n          restoreEditedContent,\n          clearEditedDictionaryContent,\n          clearEditedContent,\n          getEditedContentValue,\n        }}\n      >\n        {children}\n      </EditedContentActionsContext.Provider>\n    </EditedContentStateContext.Provider>\n  );\n};\n\nexport const useEditedContentActions = () =>\n  useContext(EditedContentActionsContext);\n\nexport const useEditedContent = () => {\n  const stateContext = useContext(EditedContentStateContext);\n  const actionContext = useEditedContentActions();\n\n  return { ...stateContext, ...actionContext };\n};\n"],"mappings":"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","names":[]}

package/dist/cjs/EditorEnabledContext.cjs

@@ -27,18 +27,22 @@ __export(EditorEnabledContext_exports, {
 });
 module.exports = __toCommonJS(EditorEnabledContext_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_editor = require("@intlayer/editor");
 var import_react = require("react");
-var import_useCrossFrameState = require('./useCrossFrameState.cjs');
 var import_useCrossFrameMessageListener = require('./useCrossFrameMessageListener.cjs');
+var import_useCrossFrameState = require('./useCrossFrameState.cjs');
 const EditorEnabledContext = (0, import_react.createContext)({
   enabled: false
 });
-const useEditorEnabledState = (options) => (0, import_useCrossFrameState.useCrossFrameState)("INTLAYER_EDITOR_ENABLED", false, options);
+const useEditorEnabledState = (options) => (0, import_useCrossFrameState.useCrossFrameState)(import_editor.MessageKey.INTLAYER_EDITOR_ENABLED, false, options);
 const usePostEditorEnabledState = (onEventTriggered) => (0, import_useCrossFrameMessageListener.useCrossFrameMessageListener)(
-  "INTLAYER_EDITOR_ENABLED/post",
+  `${import_editor.MessageKey.INTLAYER_EDITOR_ENABLED}/post`,
+  onEventTriggered
+);
+const useGetEditorEnabledState = (onEventTriggered) => (0, import_useCrossFrameMessageListener.useCrossFrameMessageListener)(
+  `${import_editor.MessageKey.INTLAYER_EDITOR_ENABLED}/get`,
   onEventTriggered
 );
-const useGetEditorEnabledState = (onEventTriggered) => (0, import_useCrossFrameMessageListener.useCrossFrameMessageListener)("INTLAYER_EDITOR_ENABLED/get", onEventTriggered);
 const EditorEnabledProvider = ({ children }) => {
   const [isEnabled] = useEditorEnabledState({
     emit: false,

package/dist/cjs/EditorEnabledContext.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/EditorEnabledContext.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  useContext,\n  type FC,\n  type PropsWithChildren,\n} from 'react';\nimport {\n  type CrossFrameStateOptions,\n  useCrossFrameState,\n} from './useCrossFrameState';\nimport { useCrossFrameMessageListener } from './useCrossFrameMessageListener';\n\nexport type EditorEnabledStateProps = {\n  enabled: boolean;\n};\n\nconst EditorEnabledContext = createContext<EditorEnabledStateProps>({\n  enabled: false,\n});\n\nexport const useEditorEnabledState = (options?: CrossFrameStateOptions) =>\n  useCrossFrameState('INTLAYER_EDITOR_ENABLED', false, options);\n\nexport const usePostEditorEnabledState = <S,>(\n  onEventTriggered?: (data: S) => void\n) =>\n  useCrossFrameMessageListener(\n    'INTLAYER_EDITOR_ENABLED/post',\n    onEventTriggered\n  );\n\nexport const useGetEditorEnabledState = <S,>(\n  onEventTriggered?: (data: S) => void\n) =>\n  useCrossFrameMessageListener('INTLAYER_EDITOR_ENABLED/get', onEventTriggered);\n\nexport const EditorEnabledProvider: FC<PropsWithChildren> = ({ children }) => {\n  const [isEnabled] = useEditorEnabledState({\n    emit: false,\n    receive: true,\n  });\n\n  return (\n    <EditorEnabledContext.Provider value={{ enabled: isEnabled }}>\n      {children}\n    </EditorEnabledContext.Provider>\n  );\n};\n\nexport const useEditorEnabled = () => useContext(EditorEnabledContext);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA6CI;AA3CJ,mBAKO;AACP,gCAGO;AACP,0CAA6C;AAM7C,MAAM,2BAAuB,4BAAuC;AAAA,EAClE,SAAS;AACX,CAAC;AAEM,MAAM,wBAAwB,CAAC,gBACpC,8CAAmB,2BAA2B,OAAO,OAAO;AAEvD,MAAM,4BAA4B,CACvC,yBAEA;AAAA,EACE;AAAA,EACA;AACF;AAEK,MAAM,2BAA2B,CACtC,yBAEA,kEAA6B,+BAA+B,gBAAgB;AAEvE,MAAM,wBAA+C,CAAC,EAAE,SAAS,MAAM;AAC5E,QAAM,CAAC,SAAS,IAAI,sBAAsB;AAAA,IACxC,MAAM;AAAA,IACN,SAAS;AAAA,EACX,CAAC;AAED,SACE,4CAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,SAAS,UAAU,GACxD,UACH;AAEJ;AAEO,MAAM,mBAAmB,UAAM,yBAAW,oBAAoB;","names":[]}
+{"version":3,"sources":["../../src/EditorEnabledContext.tsx"],"sourcesContent":["'use client';\n\nimport { MessageKey } from '@intlayer/editor';\nimport {\n  createContext,\n  useContext,\n  type FC,\n  type PropsWithChildren,\n} from 'react';\nimport { useCrossFrameMessageListener } from './useCrossFrameMessageListener';\nimport {\n  useCrossFrameState,\n  type CrossFrameStateOptions,\n} from './useCrossFrameState';\n\nexport type EditorEnabledStateProps = {\n  enabled: boolean;\n};\n\nconst EditorEnabledContext = createContext<EditorEnabledStateProps>({\n  enabled: false,\n});\n\nexport const useEditorEnabledState = (options?: CrossFrameStateOptions) =>\n  useCrossFrameState(MessageKey.INTLAYER_EDITOR_ENABLED, false, options);\n\nexport const usePostEditorEnabledState = <S,>(\n  onEventTriggered?: (data: S) => void\n) =>\n  useCrossFrameMessageListener(\n    `${MessageKey.INTLAYER_EDITOR_ENABLED}/post`,\n    onEventTriggered\n  );\n\nexport const useGetEditorEnabledState = <S,>(\n  onEventTriggered?: (data: S) => void\n) =>\n  useCrossFrameMessageListener(\n    `${MessageKey.INTLAYER_EDITOR_ENABLED}/get`,\n    onEventTriggered\n  );\n\nexport const EditorEnabledProvider: FC<PropsWithChildren> = ({ children }) => {\n  const [isEnabled] = useEditorEnabledState({\n    emit: false,\n    receive: true,\n  });\n\n  return (\n    <EditorEnabledContext.Provider value={{ enabled: isEnabled }}>\n      {children}\n    </EditorEnabledContext.Provider>\n  );\n};\n\nexport const useEditorEnabled = () => useContext(EditorEnabledContext);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiDI;AA/CJ,oBAA2B;AAC3B,mBAKO;AACP,0CAA6C;AAC7C,gCAGO;AAMP,MAAM,2BAAuB,4BAAuC;AAAA,EAClE,SAAS;AACX,CAAC;AAEM,MAAM,wBAAwB,CAAC,gBACpC,8CAAmB,yBAAW,yBAAyB,OAAO,OAAO;AAEhE,MAAM,4BAA4B,CACvC,yBAEA;AAAA,EACE,GAAG,yBAAW,uBAAuB;AAAA,EACrC;AACF;AAEK,MAAM,2BAA2B,CACtC,yBAEA;AAAA,EACE,GAAG,yBAAW,uBAAuB;AAAA,EACrC;AACF;AAEK,MAAM,wBAA+C,CAAC,EAAE,SAAS,MAAM;AAC5E,QAAM,CAAC,SAAS,IAAI,sBAAsB;AAAA,IACxC,MAAM;AAAA,IACN,SAAS;AAAA,EACX,CAAC;AAED,SACE,4CAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,SAAS,UAAU,GACxD,UACH;AAEJ;AAEO,MAAM,mBAAmB,UAAM,yBAAW,oBAAoB;","names":[]}

package/dist/cjs/EditorProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/EditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  ReactNode,\n  useEffect,\n  useState,\n  type FC,\n  type PropsWithChildren,\n} from 'react';\nimport { ChangedContentProvider } from './ChangedContentContext';\nimport {\n  type CommunicatorProviderProps,\n  CommunicatorProvider,\n} from './CommunicatorContext';\nimport {\n  type ConfigurationProviderProps,\n  ConfigurationProvider,\n} from './ConfigurationContext';\nimport { DictionariesRecordProvider } from './DictionariesRecordContext';\nimport {\n  EditedContentProvider,\n  useGetEditedContentState,\n} from './EditedContentContext';\nimport {\n  EditorEnabledProvider,\n  useEditorEnabled,\n  useGetEditorEnabledState,\n} from './EditorEnabledContext';\nimport { FocusDictionaryProvider } from './FocusDictionaryContext';\n\n/**\n * This component add all the providers needed by the editor.\n * It is used to wrap the application, or the editor to work together.\n */\nconst EditorProvidersWrapper: FC<PropsWithChildren> = ({ children }) => {\n  const getEditedContentState = useGetEditedContentState();\n\n  useEffect(() => {\n    getEditedContentState();\n  }, []);\n\n  return (\n    <DictionariesRecordProvider>\n      <EditedContentProvider>\n        <FocusDictionaryProvider>{children}</FocusDictionaryProvider>\n      </EditedContentProvider>\n    </DictionariesRecordProvider>\n  );\n};\n\ntype FallbackProps = {\n  fallback: ReactNode;\n};\n\n/**\n * This component check if the editor is enabled to render the editor providers.\n */\nconst EditorEnabledCheckRenderer: FC<PropsWithChildren<FallbackProps>> = ({\n  children,\n  fallback,\n}) => {\n  const getEditorEnabled = useGetEditorEnabledState();\n\n  const { enabled } = useEditorEnabled();\n\n  useEffect(() => {\n    if (enabled) return;\n\n    // Check if the editor is wrapping the application\n    getEditorEnabled();\n  }, [enabled]);\n\n  return enabled ? children : fallback;\n};\n\n/**\n * This component is used to check if the editor is wrapping the application.\n * It avoid to send window.postMessage to the application if the editor is not wrapping the application.\n */\nconst IframeCheckRenderer: FC<PropsWithChildren<FallbackProps>> = ({\n  children,\n  fallback,\n}) => {\n  const [isInIframe, setIsInIframe] = useState(false);\n\n  useEffect(() => {\n    setIsInIframe(window.self !== window.top);\n  }, []);\n\n  return isInIframe ? children : fallback;\n};\n\nexport type EditorProviderProps = CommunicatorProviderProps &\n  ConfigurationProviderProps & {\n    mode: 'editor' | 'client';\n  };\n\nexport const EditorProvider: FC<PropsWithChildren<EditorProviderProps>> = ({\n  children,\n  configuration,\n  ...props\n}) => (\n  <ChangedContentProvider>\n    <EditorEnabledProvider>\n      <ConfigurationProvider configuration={configuration}>\n        {props.mode === 'editor' ? (\n          <CommunicatorProvider {...props}>\n            <EditorProvidersWrapper>{children}</EditorProvidersWrapper>\n          </CommunicatorProvider>\n        ) : (\n          <IframeCheckRenderer fallback={children}>\n            <CommunicatorProvider {...props}>\n              <EditorEnabledCheckRenderer fallback={children}>\n                <EditorProvidersWrapper>{children}</EditorProvidersWrapper>\n              </EditorEnabledCheckRenderer>\n            </CommunicatorProvider>\n          </IframeCheckRenderer>\n        )}\n      </ConfigurationProvider>\n    </EditorEnabledProvider>\n  </ChangedContentProvider>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4CQ;AA1CR,mBAMO;AACP,mCAAuC;AACvC,iCAGO;AACP,kCAGO;AACP,uCAA2C;AAC3C,kCAGO;AACP,kCAIO;AACP,oCAAwC;AAMxC,MAAM,yBAAgD,CAAC,EAAE,SAAS,MAAM;AACtE,QAAM,4BAAwB,sDAAyB;AAEvD,8BAAU,MAAM;AACd,0BAAsB;AAAA,EACxB,GAAG,CAAC,CAAC;AAEL,SACE,4CAAC,+DACC,sDAAC,qDACC,sDAAC,yDAAyB,UAAS,GACrC,GACF;AAEJ;AASA,MAAM,6BAAmE,CAAC;AAAA,EACxE;AAAA,EACA;AACF,MAAM;AACJ,QAAM,uBAAmB,sDAAyB;AAElD,QAAM,EAAE,QAAQ,QAAI,8CAAiB;AAErC,8BAAU,MAAM;AACd,QAAI,QAAS;AAGb,qBAAiB;AAAA,EACnB,GAAG,CAAC,OAAO,CAAC;AAEZ,SAAO,UAAU,WAAW;AAC9B;AAMA,MAAM,sBAA4D,CAAC;AAAA,EACjE;AAAA,EACA;AACF,MAAM;AACJ,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAElD,8BAAU,MAAM;AACd,kBAAc,OAAO,SAAS,OAAO,GAAG;AAAA,EAC1C,GAAG,CAAC,CAAC;AAEL,SAAO,aAAa,WAAW;AACjC;AAOO,MAAM,iBAA6D,CAAC;AAAA,EACzE;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACE,4CAAC,uDACC,sDAAC,qDACC,sDAAC,qDAAsB,eACpB,gBAAM,SAAS,WACd,4CAAC,mDAAsB,GAAG,OACxB,sDAAC,0BAAwB,UAAS,GACpC,IAEA,4CAAC,uBAAoB,UAAU,UAC7B,sDAAC,mDAAsB,GAAG,OACxB,sDAAC,8BAA2B,UAAU,UACpC,sDAAC,0BAAwB,UAAS,GACpC,GACF,GACF,GAEJ,GACF,GACF;","names":[]}
+{"version":3,"sources":["../../src/EditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type FC,\n  type PropsWithChildren,\n  ReactNode,\n  useEffect,\n  useState,\n} from 'react';\nimport { ChangedContentProvider } from './ChangedContentContext';\nimport {\n  type CommunicatorProviderProps,\n  CommunicatorProvider,\n} from './CommunicatorContext';\nimport {\n  type ConfigurationProviderProps,\n  ConfigurationProvider,\n} from './ConfigurationContext';\nimport { DictionariesRecordProvider } from './DictionariesRecordContext';\nimport {\n  EditedContentProvider,\n  useGetEditedContentState,\n} from './EditedContentContext';\nimport {\n  EditorEnabledProvider,\n  useEditorEnabled,\n  useGetEditorEnabledState,\n} from './EditorEnabledContext';\nimport { FocusDictionaryProvider } from './FocusDictionaryContext';\n\n/**\n * This component add all the providers needed by the editor.\n * It is used to wrap the application, or the editor to work together.\n */\nconst EditorProvidersWrapper: FC<PropsWithChildren> = ({ children }) => {\n  const getEditedContentState = useGetEditedContentState();\n\n  useEffect(() => {\n    getEditedContentState();\n  }, []);\n\n  return (\n    <DictionariesRecordProvider>\n      <EditedContentProvider>\n        <FocusDictionaryProvider>{children}</FocusDictionaryProvider>\n      </EditedContentProvider>\n    </DictionariesRecordProvider>\n  );\n};\n\ntype FallbackProps = {\n  fallback: ReactNode;\n};\n\n/**\n * This component check if the editor is enabled to render the editor providers.\n */\nconst EditorEnabledCheckRenderer: FC<PropsWithChildren<FallbackProps>> = ({\n  children,\n  fallback,\n}) => {\n  const getEditorEnabled = useGetEditorEnabledState();\n\n  const { enabled } = useEditorEnabled();\n\n  useEffect(() => {\n    if (enabled) return;\n\n    // Check if the editor is wrapping the application\n    getEditorEnabled();\n  }, [enabled]);\n\n  return enabled ? children : fallback;\n};\n\n/**\n * This component is used to check if the editor is wrapping the application.\n * It avoid to send window.postMessage to the application if the editor is not wrapping the application.\n */\nconst IframeCheckRenderer: FC<PropsWithChildren<FallbackProps>> = ({\n  children,\n  fallback,\n}) => {\n  const [isInIframe, setIsInIframe] = useState(false);\n\n  useEffect(() => {\n    setIsInIframe(window.self !== window.top);\n  }, []);\n\n  return isInIframe ? children : fallback;\n};\n\nexport type EditorProviderProps = CommunicatorProviderProps &\n  ConfigurationProviderProps & {\n    mode: 'editor' | 'client';\n  };\n\nexport const EditorProvider: FC<PropsWithChildren<EditorProviderProps>> = ({\n  children,\n  configuration,\n  ...props\n}) => (\n  <ChangedContentProvider>\n    <EditorEnabledProvider>\n      <ConfigurationProvider configuration={configuration}>\n        {props.mode === 'editor' ? (\n          <CommunicatorProvider {...props}>\n            <EditorProvidersWrapper>{children}</EditorProvidersWrapper>\n          </CommunicatorProvider>\n        ) : (\n          <IframeCheckRenderer fallback={children}>\n            <CommunicatorProvider {...props}>\n              <EditorEnabledCheckRenderer fallback={children}>\n                <EditorProvidersWrapper>{children}</EditorProvidersWrapper>\n              </EditorEnabledCheckRenderer>\n            </CommunicatorProvider>\n          </IframeCheckRenderer>\n        )}\n      </ConfigurationProvider>\n    </EditorEnabledProvider>\n  </ChangedContentProvider>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4CQ;AA1CR,mBAMO;AACP,mCAAuC;AACvC,iCAGO;AACP,kCAGO;AACP,uCAA2C;AAC3C,kCAGO;AACP,kCAIO;AACP,oCAAwC;AAMxC,MAAM,yBAAgD,CAAC,EAAE,SAAS,MAAM;AACtE,QAAM,4BAAwB,sDAAyB;AAEvD,8BAAU,MAAM;AACd,0BAAsB;AAAA,EACxB,GAAG,CAAC,CAAC;AAEL,SACE,4CAAC,+DACC,sDAAC,qDACC,sDAAC,yDAAyB,UAAS,GACrC,GACF;AAEJ;AASA,MAAM,6BAAmE,CAAC;AAAA,EACxE;AAAA,EACA;AACF,MAAM;AACJ,QAAM,uBAAmB,sDAAyB;AAElD,QAAM,EAAE,QAAQ,QAAI,8CAAiB;AAErC,8BAAU,MAAM;AACd,QAAI,QAAS;AAGb,qBAAiB;AAAA,EACnB,GAAG,CAAC,OAAO,CAAC;AAEZ,SAAO,UAAU,WAAW;AAC9B;AAMA,MAAM,sBAA4D,CAAC;AAAA,EACjE;AAAA,EACA;AACF,MAAM;AACJ,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAElD,8BAAU,MAAM;AACd,kBAAc,OAAO,SAAS,OAAO,GAAG;AAAA,EAC1C,GAAG,CAAC,CAAC;AAEL,SAAO,aAAa,WAAW;AACjC;AAOO,MAAM,iBAA6D,CAAC;AAAA,EACzE;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACE,4CAAC,uDACC,sDAAC,qDACC,sDAAC,qDAAsB,eACpB,gBAAM,SAAS,WACd,4CAAC,mDAAsB,GAAG,OACxB,sDAAC,0BAAwB,UAAS,GACpC,IAEA,4CAAC,uBAAoB,UAAU,UAC7B,sDAAC,mDAAsB,GAAG,OACxB,sDAAC,8BAA2B,UAAU,UACpC,sDAAC,0BAAwB,UAAS,GACpC,GACF,GACF,GAEJ,GACF,GACF;","names":[]}

package/dist/cjs/FocusDictionaryContext.cjs

@@ -25,6 +25,7 @@ __export(FocusDictionaryContext_exports, {
 });
 module.exports = __toCommonJS(FocusDictionaryContext_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_editor = require("@intlayer/editor");
 var import_react = require("react");
 var import_useCrossFrameState = require('./useCrossFrameState.cjs');
 const FocusDictionaryStateContext = (0, import_react.createContext)(void 0);
@@ -33,7 +34,7 @@ const FocusDictionaryProvider = ({
   children
 }) => {
   const [focusedContent, setFocusedContent] = (0, import_useCrossFrameState.useCrossFrameState)(
-    "INTLAYER_FOCUSED_CONTENT_CHANGED",
+    import_editor.MessageKey.INTLAYER_FOCUSED_CONTENT_CHANGED,
     null
   );
   const setFocusedContentKeyPath = (keyPath) => {

package/dist/cjs/FocusDictionaryContext.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/FocusDictionaryContext.tsx"],"sourcesContent":["'use client';\n\nimport type { KeyPath } from '@intlayer/core';\nimport {\n  createContext,\n  useContext,\n  type FC,\n  type PropsWithChildren,\n  type Dispatch,\n  type SetStateAction,\n} from 'react';\nimport { useCrossFrameState } from './useCrossFrameState';\n\ntype DictionaryPath = string;\n\nexport type FileContent = {\n  dictionaryKey: string;\n  keyPath?: KeyPath[];\n  dictionaryPath?: DictionaryPath;\n};\n\ntype FocusDictionaryState = {\n  focusedContent: FileContent | null;\n};\n\ntype FocusDictionaryActions = {\n  setFocusedContent: Dispatch<SetStateAction<FileContent | null>>;\n  setFocusedContentKeyPath: (keyPath: KeyPath[]) => void;\n};\n\nconst FocusDictionaryStateContext = createContext<\n  FocusDictionaryState | undefined\n>(undefined);\nconst FocusDictionaryActionsContext = createContext<\n  FocusDictionaryActions | undefined\n>(undefined);\n\nexport const FocusDictionaryProvider: FC<PropsWithChildren> = ({\n  children,\n}) => {\n  const [focusedContent, setFocusedContent] =\n    useCrossFrameState<FileContent | null>(\n      'INTLAYER_FOCUSED_CONTENT_CHANGED',\n      null\n    );\n\n  const setFocusedContentKeyPath = (keyPath: KeyPath[]) => {\n    setFocusedContent((prev) => {\n      if (!prev) {\n        return prev; // nothing to update if there's no focused content\n      }\n      return { ...prev, keyPath };\n    });\n  };\n\n  return (\n    <FocusDictionaryStateContext.Provider value={{ focusedContent }}>\n      <FocusDictionaryActionsContext.Provider\n        value={{ setFocusedContent, setFocusedContentKeyPath }}\n      >\n        {children}\n      </FocusDictionaryActionsContext.Provider>\n    </FocusDictionaryStateContext.Provider>\n  );\n};\n\nexport const useFocusDictionaryActions = () => {\n  const context = useContext(FocusDictionaryActionsContext);\n  if (context === undefined) {\n    throw new Error(\n      'useFocusDictionaryActions must be used within a FocusDictionaryProvider'\n    );\n  }\n  return context;\n};\n\nexport const useFocusDictionary = () => {\n  const actionContext = useFocusDictionaryActions();\n  const stateContext = useContext(FocusDictionaryStateContext);\n\n  if (stateContext === undefined) {\n    throw new Error(\n      'useFocusDictionaryState must be used within a FocusDictionaryProvider'\n    );\n  }\n\n  return { ...stateContext, ...actionContext };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyDM;AAtDN,mBAOO;AACP,gCAAmC;AAmBnC,MAAM,kCAA8B,4BAElC,MAAS;AACX,MAAM,oCAAgC,4BAEpC,MAAS;AAEJ,MAAM,0BAAiD,CAAC;AAAA,EAC7D;AACF,MAAM;AACJ,QAAM,CAAC,gBAAgB,iBAAiB,QACtC;AAAA,IACE;AAAA,IACA;AAAA,EACF;AAEF,QAAM,2BAA2B,CAAC,YAAuB;AACvD,sBAAkB,CAAC,SAAS;AAC1B,UAAI,CAAC,MAAM;AACT,eAAO;AAAA,MACT;AACA,aAAO,EAAE,GAAG,MAAM,QAAQ;AAAA,IAC5B,CAAC;AAAA,EACH;AAEA,SACE,4CAAC,4BAA4B,UAA5B,EAAqC,OAAO,EAAE,eAAe,GAC5D;AAAA,IAAC,8BAA8B;AAAA,IAA9B;AAAA,MACC,OAAO,EAAE,mBAAmB,yBAAyB;AAAA,MAEpD;AAAA;AAAA,EACH,GACF;AAEJ;AAEO,MAAM,4BAA4B,MAAM;AAC7C,QAAM,cAAU,yBAAW,6BAA6B;AACxD,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAEO,MAAM,qBAAqB,MAAM;AACtC,QAAM,gBAAgB,0BAA0B;AAChD,QAAM,mBAAe,yBAAW,2BAA2B;AAE3D,MAAI,iBAAiB,QAAW;AAC9B,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEA,SAAO,EAAE,GAAG,cAAc,GAAG,cAAc;AAC7C;","names":[]}
+{"version":3,"sources":["../../src/FocusDictionaryContext.tsx"],"sourcesContent":["'use client';\n\nimport type { KeyPath } from '@intlayer/core';\nimport { MessageKey } from '@intlayer/editor';\nimport {\n  createContext,\n  useContext,\n  type Dispatch,\n  type FC,\n  type PropsWithChildren,\n  type SetStateAction,\n} from 'react';\nimport { useCrossFrameState } from './useCrossFrameState';\n\ntype DictionaryPath = string;\n\nexport type FileContent = {\n  dictionaryKey: string;\n  keyPath?: KeyPath[];\n  dictionaryPath?: DictionaryPath;\n};\n\ntype FocusDictionaryState = {\n  focusedContent: FileContent | null;\n};\n\ntype FocusDictionaryActions = {\n  setFocusedContent: Dispatch<SetStateAction<FileContent | null>>;\n  setFocusedContentKeyPath: (keyPath: KeyPath[]) => void;\n};\n\nconst FocusDictionaryStateContext = createContext<\n  FocusDictionaryState | undefined\n>(undefined);\nconst FocusDictionaryActionsContext = createContext<\n  FocusDictionaryActions | undefined\n>(undefined);\n\nexport const FocusDictionaryProvider: FC<PropsWithChildren> = ({\n  children,\n}) => {\n  const [focusedContent, setFocusedContent] =\n    useCrossFrameState<FileContent | null>(\n      MessageKey.INTLAYER_FOCUSED_CONTENT_CHANGED,\n      null\n    );\n\n  const setFocusedContentKeyPath = (keyPath: KeyPath[]) => {\n    setFocusedContent((prev) => {\n      if (!prev) {\n        return prev; // nothing to update if there's no focused content\n      }\n      return { ...prev, keyPath };\n    });\n  };\n\n  return (\n    <FocusDictionaryStateContext.Provider value={{ focusedContent }}>\n      <FocusDictionaryActionsContext.Provider\n        value={{ setFocusedContent, setFocusedContentKeyPath }}\n      >\n        {children}\n      </FocusDictionaryActionsContext.Provider>\n    </FocusDictionaryStateContext.Provider>\n  );\n};\n\nexport const useFocusDictionaryActions = () => {\n  const context = useContext(FocusDictionaryActionsContext);\n  if (context === undefined) {\n    throw new Error(\n      'useFocusDictionaryActions must be used within a FocusDictionaryProvider'\n    );\n  }\n  return context;\n};\n\nexport const useFocusDictionary = () => {\n  const actionContext = useFocusDictionaryActions();\n  const stateContext = useContext(FocusDictionaryStateContext);\n\n  if (stateContext === undefined) {\n    throw new Error(\n      'useFocusDictionaryState must be used within a FocusDictionaryProvider'\n    );\n  }\n\n  return { ...stateContext, ...actionContext };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0DM;AAvDN,oBAA2B;AAC3B,mBAOO;AACP,gCAAmC;AAmBnC,MAAM,kCAA8B,4BAElC,MAAS;AACX,MAAM,oCAAgC,4BAEpC,MAAS;AAEJ,MAAM,0BAAiD,CAAC;AAAA,EAC7D;AACF,MAAM;AACJ,QAAM,CAAC,gBAAgB,iBAAiB,QACtC;AAAA,IACE,yBAAW;AAAA,IACX;AAAA,EACF;AAEF,QAAM,2BAA2B,CAAC,YAAuB;AACvD,sBAAkB,CAAC,SAAS;AAC1B,UAAI,CAAC,MAAM;AACT,eAAO;AAAA,MACT;AACA,aAAO,EAAE,GAAG,MAAM,QAAQ;AAAA,IAC5B,CAAC;AAAA,EACH;AAEA,SACE,4CAAC,4BAA4B,UAA5B,EAAqC,OAAO,EAAE,eAAe,GAC5D;AAAA,IAAC,8BAA8B;AAAA,IAA9B;AAAA,MACC,OAAO,EAAE,mBAAmB,yBAAyB;AAAA,MAEpD;AAAA;AAAA,EACH,GACF;AAEJ;AAEO,MAAM,4BAA4B,MAAM;AAC7C,QAAM,cAAU,yBAAW,6BAA6B;AACxD,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAEO,MAAM,qBAAqB,MAAM;AACtC,QAAM,gBAAgB,0BAA0B;AAChD,QAAM,mBAAe,yBAAW,2BAA2B;AAE3D,MAAI,iBAAiB,QAAW;AAC9B,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEA,SAAO,EAAE,GAAG,cAAc,GAAG,cAAc;AAC7C;","names":[]}

package/dist/cjs/index.cjs

@@ -15,29 +15,31 @@ var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "defau
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var index_exports = {};
 module.exports = __toCommonJS(index_exports);
-__reExport(index_exports, require('./useCrossFrameMessageListener.cjs'), module.exports);
-__reExport(index_exports, require('./useCrossFrameState.cjs'), module.exports);
+__reExport(index_exports, require("@intlayer/editor"), module.exports);
+__reExport(index_exports, require('./ChangedContentContext.cjs'), module.exports);
 __reExport(index_exports, require('./ConfigurationContext.cjs'), module.exports);
 __reExport(index_exports, require('./DictionariesRecordContext.cjs'), module.exports);
 __reExport(index_exports, require('./EditedContentContext.cjs'), module.exports);
-__reExport(index_exports, require('./FocusDictionaryContext.cjs'), module.exports);
 __reExport(index_exports, require('./EditorEnabledContext.cjs'), module.exports);
 __reExport(index_exports, require('./EditorProvider.cjs'), module.exports);
+__reExport(index_exports, require('./FocusDictionaryContext.cjs'), module.exports);
+__reExport(index_exports, require('./useCrossFrameMessageListener.cjs'), module.exports);
+__reExport(index_exports, require('./useCrossFrameState.cjs'), module.exports);
 __reExport(index_exports, require('./useCrossURLPathState.cjs'), module.exports);
-__reExport(index_exports, require('./useIframeClickCommunicator.cjs'), module.exports);
-__reExport(index_exports, require('./ChangedContentContext.cjs'), module.exports);
+__reExport(index_exports, require('./useIframeClickInterceptor.cjs'), module.exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  ...require('./useCrossFrameMessageListener.cjs'),
-  ...require('./useCrossFrameState.cjs'),
+  ...require("@intlayer/editor"),
+  ...require('./ChangedContentContext.cjs'),
   ...require('./ConfigurationContext.cjs'),
   ...require('./DictionariesRecordContext.cjs'),
   ...require('./EditedContentContext.cjs'),
-  ...require('./FocusDictionaryContext.cjs'),
   ...require('./EditorEnabledContext.cjs'),
   ...require('./EditorProvider.cjs'),
+  ...require('./FocusDictionaryContext.cjs'),
+  ...require('./useCrossFrameMessageListener.cjs'),
+  ...require('./useCrossFrameState.cjs'),
   ...require('./useCrossURLPathState.cjs'),
-  ...require('./useIframeClickCommunicator.cjs'),
-  ...require('./ChangedContentContext.cjs')
+  ...require('./useIframeClickInterceptor.cjs')
 });
 //# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export * from './useCrossFrameMessageListener';\nexport * from './useCrossFrameState';\nexport * from './ConfigurationContext';\nexport * from './DictionariesRecordContext';\nexport * from './EditedContentContext';\nexport * from './FocusDictionaryContext';\nexport * from './EditorEnabledContext';\nexport * from './EditorProvider';\nexport * from './useCrossURLPathState';\nexport * from './useIframeClickCommunicator';\nexport * from './ChangedContentContext';\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,0BAAc,2CAAd;AACA,0BAAc,iCADd;AAEA,0BAAc,mCAFd;AAGA,0BAAc,wCAHd;AAIA,0BAAc,mCAJd;AAKA,0BAAc,qCALd;AAMA,0BAAc,mCANd;AAOA,0BAAc,6BAPd;AAQA,0BAAc,mCARd;AASA,0BAAc,yCATd;AAUA,0BAAc,oCAVd;","names":[]}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export * from '@intlayer/editor';\nexport * from './ChangedContentContext';\nexport * from './ConfigurationContext';\nexport * from './DictionariesRecordContext';\nexport * from './EditedContentContext';\nexport * from './EditorEnabledContext';\nexport * from './EditorProvider';\nexport * from './FocusDictionaryContext';\nexport * from './useCrossFrameMessageListener';\nexport * from './useCrossFrameState';\nexport * from './useCrossURLPathState';\nexport * from './useIframeClickInterceptor';\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,0BAAc,6BAAd;AACA,0BAAc,oCADd;AAEA,0BAAc,mCAFd;AAGA,0BAAc,wCAHd;AAIA,0BAAc,mCAJd;AAKA,0BAAc,mCALd;AAMA,0BAAc,6BANd;AAOA,0BAAc,qCAPd;AAQA,0BAAc,2CARd;AASA,0BAAc,iCATd;AAUA,0BAAc,mCAVd;AAWA,0BAAc,wCAXd;","names":[]}

package/dist/cjs/useCrossFrameMessageListener.cjs

@@ -22,26 +22,9 @@ __export(useCrossFrameMessageListener_exports, {
   useCrossFrameMessageListener: () => useCrossFrameMessageListener
 });
 module.exports = __toCommonJS(useCrossFrameMessageListener_exports);
+var import_editor = require("@intlayer/editor");
 var import_react = require("react");
 var import_CommunicatorContext = require('./CommunicatorContext.cjs');
-const compareUrls = (url1, url2) => {
-  try {
-    const parsedUrl1 = new URL(url1);
-    const parsedUrl2 = new URL(url2);
-    if (parsedUrl1.protocol !== parsedUrl2.protocol || parsedUrl1.hostname !== parsedUrl2.hostname || parsedUrl1.port !== parsedUrl2.port) {
-      return false;
-    }
-    const path1 = parsedUrl1.pathname.replace(/\/$/, "");
-    const path2 = parsedUrl2.pathname.replace(/\/$/, "");
-    if (path1 !== "" && path2 !== "" && path1 !== path2) {
-      return false;
-    }
-    return true;
-  } catch (error) {
-    console.error("Invalid URL(s)", error);
-    return false;
-  }
-};
 const useCrossFrameMessageListener = (key, onEventTriggered, revalidator) => {
   const { allowedOrigins, postMessage, senderId } = (0, import_CommunicatorContext.useCommunicator)();
   (0, import_react.useEffect)(() => {
@@ -50,7 +33,7 @@ const useCrossFrameMessageListener = (key, onEventTriggered, revalidator) => {
         const { type, data, senderId: msgSenderId } = event.data;
         if (type !== key) return;
         if (msgSenderId === senderId) return;
-        if (typeof allowedOrigins === "undefined" || allowedOrigins?.some((url) => compareUrls(url, event.origin)) || allowedOrigins?.includes("*")) {
+        if (typeof allowedOrigins === "undefined" || allowedOrigins?.some((url) => (0, import_editor.compareUrls)(url, event.origin)) || allowedOrigins?.includes("*")) {
           onEventTriggered(data);
         }
       };

package/dist/cjs/useCrossFrameMessageListener.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/useCrossFrameMessageListener.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect } from 'react';\nimport { useCommunicator } from './CommunicatorContext';\nimport { type MessageKey } from './messageKey';\n\n/**\n * Compare two URLs for equality.\n * This function is used to determine if a message originates from the same origin.\n *\n * ```js\n * // Example usage\n * console.log(compareUrls(\"http://localhost:5173/\", \"http://localhost:5173\")); // true\n * console.log(compareUrls(\"http://localhost:5173\", \"http://localhost:5173?myParam=true\")); // true\n * console.log(compareUrls(\"http://localhost:5173/subpath\", \"http://localhost:5173\")); // true\n * console.log(compareUrls(\"http://localhost:5172\", \"http://localhost:5173\")); // false\n * ```\n *\n * @param url1 - The first URL to compare.\n * @param url2 - The second URL to compare.\n * @returns Whether the two URLs are equal.\n */\nconst compareUrls = (url1: string, url2: string): boolean => {\n  try {\n    const parsedUrl1 = new URL(url1);\n    const parsedUrl2 = new URL(url2);\n\n    // Compare protocol, hostname, and port\n    if (\n      parsedUrl1.protocol !== parsedUrl2.protocol ||\n      parsedUrl1.hostname !== parsedUrl2.hostname ||\n      parsedUrl1.port !== parsedUrl2.port\n    ) {\n      return false;\n    }\n\n    // One URL should not have a subpath while the other does\n    const path1 = parsedUrl1.pathname.replace(/\\/$/, ''); // Remove trailing slash\n    const path2 = parsedUrl2.pathname.replace(/\\/$/, '');\n\n    if (path1 !== '' && path2 !== '' && path1 !== path2) {\n      return false;\n    }\n\n    return true;\n  } catch (error) {\n    console.error('Invalid URL(s)', error);\n    return false;\n  }\n};\n\n/**\n * useCrossFrameMessageListener\n *\n * This React hook listens for messages sent via the `postMessage` API and triggers a callback\n * whenever a message of the specified type (`key`) is received. It is useful for synchronizing\n * state or events across different windows, iframes, or contexts.\n *\n * @template S - The type of the data payload in the message.\n * @param key - A unique identifier for the message type to listen for.\n * @param [onEventTriggered] - A callback function triggered when a message\n * @param [revalidator] - A function that re-suscribes the listener. Could be usefull if onEventTriggered depend of some state\n * with the specified key is received. The callback receives the message data as its argument.\n *\n * @returns {{ postMessage: (data: S) => void }} An object containing a `postMessage` function\n * that allows broadcasting messages with the specified key and data.\n */\nexport const useCrossFrameMessageListener = <S,>(\n  key: `${MessageKey}` | `${MessageKey}/post` | `${MessageKey}/get`,\n  onEventTriggered?: (data: S) => void,\n  revalidator?: any\n) => {\n  const { allowedOrigins, postMessage, senderId } = useCommunicator();\n\n  useEffect(() => {\n    if (onEventTriggered) {\n      /**\n       * Message handler to process incoming messages.\n       *\n       * - **Message Filtering:** Ensures only messages with the specified `key` are processed.\n       * - **Origin Validation:** Checks that the origin of the message is within the allowed origins.\n       *\n       * @param {MessageEvent<{ type: string; data: S }>} event - The incoming message event object.\n       */\n      const handleMessage = (\n        event: MessageEvent<{ type: string; data: S; senderId: string }>\n      ) => {\n        const { type, data, senderId: msgSenderId } = event.data;\n\n        // Ignore messages that do not match the current key\n        if (type !== key) return;\n\n        // Ignore messages from myself\n        if (msgSenderId === senderId) return;\n\n        // Check if the message origin is allowed\n        if (\n          typeof allowedOrigins === 'undefined' ||\n          allowedOrigins?.some((url) => compareUrls(url, event.origin)) ||\n          allowedOrigins?.includes('*')\n        ) {\n          // Update the local state with the received data\n          onEventTriggered(data);\n        }\n      };\n\n      window.addEventListener('message', handleMessage);\n\n      // Clean up the event listener on unmount\n      return () => window.removeEventListener('message', handleMessage);\n    }\n  }, [allowedOrigins, postMessage, senderId, revalidator]);\n\n  /**\n   * A wrapper function around the `postMessage` function to broadcast messages efficiently.\n   *\n   * - **Encapsulation:** Ensures the `postMessage` function is scoped to the provided key.\n   * - **Ease of Use:** Simplifies broadcasting messages with consistent type and format.\n   *\n   * @param {S} data - The data payload to include in the message.\n   * @returns {void}\n   */\n  const postMessageWrapper: (data?: S) => void = (data) => {\n    postMessage({ type: key, data, senderId });\n  };\n\n  return postMessageWrapper;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAA0B;AAC1B,iCAAgC;AAmBhC,MAAM,cAAc,CAAC,MAAc,SAA0B;AAC3D,MAAI;AACF,UAAM,aAAa,IAAI,IAAI,IAAI;AAC/B,UAAM,aAAa,IAAI,IAAI,IAAI;AAG/B,QACE,WAAW,aAAa,WAAW,YACnC,WAAW,aAAa,WAAW,YACnC,WAAW,SAAS,WAAW,MAC/B;AACA,aAAO;AAAA,IACT;AAGA,UAAM,QAAQ,WAAW,SAAS,QAAQ,OAAO,EAAE;AACnD,UAAM,QAAQ,WAAW,SAAS,QAAQ,OAAO,EAAE;AAEnD,QAAI,UAAU,MAAM,UAAU,MAAM,UAAU,OAAO;AACnD,aAAO;AAAA,IACT;AAEA,WAAO;AAAA,EACT,SAAS,OAAO;AACd,YAAQ,MAAM,kBAAkB,KAAK;AACrC,WAAO;AAAA,EACT;AACF;AAkBO,MAAM,+BAA+B,CAC1C,KACA,kBACA,gBACG;AACH,QAAM,EAAE,gBAAgB,aAAa,SAAS,QAAI,4CAAgB;AAElE,8BAAU,MAAM;AACd,QAAI,kBAAkB;AASpB,YAAM,gBAAgB,CACpB,UACG;AACH,cAAM,EAAE,MAAM,MAAM,UAAU,YAAY,IAAI,MAAM;AAGpD,YAAI,SAAS,IAAK;AAGlB,YAAI,gBAAgB,SAAU;AAG9B,YACE,OAAO,mBAAmB,eAC1B,gBAAgB,KAAK,CAAC,QAAQ,YAAY,KAAK,MAAM,MAAM,CAAC,KAC5D,gBAAgB,SAAS,GAAG,GAC5B;AAEA,2BAAiB,IAAI;AAAA,QACvB;AAAA,MACF;AAEA,aAAO,iBAAiB,WAAW,aAAa;AAGhD,aAAO,MAAM,OAAO,oBAAoB,WAAW,aAAa;AAAA,IAClE;AAAA,EACF,GAAG,CAAC,gBAAgB,aAAa,UAAU,WAAW,CAAC;AAWvD,QAAM,qBAAyC,CAAC,SAAS;AACvD,gBAAY,EAAE,MAAM,KAAK,MAAM,SAAS,CAAC;AAAA,EAC3C;AAEA,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../src/useCrossFrameMessageListener.tsx"],"sourcesContent":["'use client';\n\nimport { type MessageKey, compareUrls } from '@intlayer/editor';\nimport { useEffect } from 'react';\nimport { useCommunicator } from './CommunicatorContext';\n\n/**\n * useCrossFrameMessageListener\n *\n * This React hook listens for messages sent via the `postMessage` API and triggers a callback\n * whenever a message of the specified type (`key`) is received. It is useful for synchronizing\n * state or events across different windows, iframes, or contexts.\n *\n * @template S - The type of the data payload in the message.\n * @param key - A unique identifier for the message type to listen for.\n * @param [onEventTriggered] - A callback function triggered when a message\n * @param [revalidator] - A function that re-suscribes the listener. Could be usefull if onEventTriggered depend of some state\n * with the specified key is received. The callback receives the message data as its argument.\n *\n * @returns {{ postMessage: (data: S) => void }} An object containing a `postMessage` function\n * that allows broadcasting messages with the specified key and data.\n */\nexport const useCrossFrameMessageListener = <S,>(\n  key: `${MessageKey}` | `${MessageKey}/post` | `${MessageKey}/get`,\n  onEventTriggered?: (data: S) => void,\n  revalidator?: any\n) => {\n  const { allowedOrigins, postMessage, senderId } = useCommunicator();\n\n  useEffect(() => {\n    if (onEventTriggered) {\n      /**\n       * Message handler to process incoming messages.\n       *\n       * - **Message Filtering:** Ensures only messages with the specified `key` are processed.\n       * - **Origin Validation:** Checks that the origin of the message is within the allowed origins.\n       *\n       * @param {MessageEvent<{ type: string; data: S }>} event - The incoming message event object.\n       */\n      const handleMessage = (\n        event: MessageEvent<{ type: string; data: S; senderId: string }>\n      ) => {\n        const { type, data, senderId: msgSenderId } = event.data;\n\n        // Ignore messages that do not match the current key\n        if (type !== key) return;\n\n        // Ignore messages from myself\n        if (msgSenderId === senderId) return;\n\n        // Check if the message origin is allowed\n        if (\n          typeof allowedOrigins === 'undefined' ||\n          allowedOrigins?.some((url) => compareUrls(url, event.origin)) ||\n          allowedOrigins?.includes('*')\n        ) {\n          // Update the local state with the received data\n          onEventTriggered(data);\n        }\n      };\n\n      window.addEventListener('message', handleMessage);\n\n      // Clean up the event listener on unmount\n      return () => window.removeEventListener('message', handleMessage);\n    }\n  }, [allowedOrigins, postMessage, senderId, revalidator]);\n\n  /**\n   * A wrapper function around the `postMessage` function to broadcast messages efficiently.\n   *\n   * - **Encapsulation:** Ensures the `postMessage` function is scoped to the provided key.\n   * - **Ease of Use:** Simplifies broadcasting messages with consistent type and format.\n   *\n   * @param {S} data - The data payload to include in the message.\n   * @returns {void}\n   */\n  const postMessageWrapper: (data?: S) => void = (data) => {\n    postMessage({ type: key, data, senderId });\n  };\n\n  return postMessageWrapper;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,oBAA6C;AAC7C,mBAA0B;AAC1B,iCAAgC;AAkBzB,MAAM,+BAA+B,CAC1C,KACA,kBACA,gBACG;AACH,QAAM,EAAE,gBAAgB,aAAa,SAAS,QAAI,4CAAgB;AAElE,8BAAU,MAAM;AACd,QAAI,kBAAkB;AASpB,YAAM,gBAAgB,CACpB,UACG;AACH,cAAM,EAAE,MAAM,MAAM,UAAU,YAAY,IAAI,MAAM;AAGpD,YAAI,SAAS,IAAK;AAGlB,YAAI,gBAAgB,SAAU;AAG9B,YACE,OAAO,mBAAmB,eAC1B,gBAAgB,KAAK,CAAC,YAAQ,2BAAY,KAAK,MAAM,MAAM,CAAC,KAC5D,gBAAgB,SAAS,GAAG,GAC5B;AAEA,2BAAiB,IAAI;AAAA,QACvB;AAAA,MACF;AAEA,aAAO,iBAAiB,WAAW,aAAa;AAGhD,aAAO,MAAM,OAAO,oBAAoB,WAAW,aAAa;AAAA,IAClE;AAAA,EACF,GAAG,CAAC,gBAAgB,aAAa,UAAU,WAAW,CAAC;AAWvD,QAAM,qBAAyC,CAAC,SAAS;AACvD,gBAAY,EAAE,MAAM,KAAK,MAAM,SAAS,CAAC;AAAA,EAC3C;AAEA,SAAO;AACT;","names":[]}

package/dist/cjs/useCrossFrameState.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/useCrossFrameState.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useState, type Dispatch, type SetStateAction } from 'react';\nimport { useCommunicator } from './CommunicatorContext';\nimport { type MessageKey } from './messageKey';\nimport { useCrossFrameMessageListener } from './useCrossFrameMessageListener';\n\nexport type CrossFrameStateOptions = {\n  emit?: boolean;\n  receive?: boolean;\n};\n\nconst resolveState = <S,>(state?: SetStateAction<S>, prevState?: S): S =>\n  typeof state === 'function'\n    ? (state as (prevState?: S) => S)(prevState)\n    : (state as S);\n\n/**\n * Configuration options for `useCrossFrameState`.\n * @typedef {Object} CrossFrameStateOptions\n * @property {boolean} [emit=true] - Whether to broadcast state changes to other instances.\n * @property {boolean} [receive=true] - Whether to listen for state updates from other instances.\n */\n\n/**\n * useCrossFrameState\n *\n * This React hook synchronizes state across multiple instances (e.g., different iframes or windows).\n * It uses the `postMessage` API to communicate state changes and updates between instances.\n *\n * @template S - The type of the state.\n * @param {`${MessageKey}`} key - A unique identifier for the state to synchronize.\n * @param {S | (() => S)} [initialState] - The initial state value or a function to compute it lazily.\n * @param {CrossFrameStateOptions} [options] - Configuration options to control emitting and receiving messages.\n *   - `emit` (default: true): Whether to broadcast state changes to other instances.\n *   - `receive` (default: true): Whether to listen for state updates from other instances.\n *\n * @returns {[S, Dispatch<SetStateAction<S>>]} An array containing the current state and a setter function.\n */\nexport const useCrossFrameState = <S,>(\n  key: `${MessageKey}`,\n  initialState?: S | (() => S),\n  options?: CrossFrameStateOptions\n): [S, Dispatch<SetStateAction<S>>, typeof postState] => {\n  const { postMessage, senderId } = useCommunicator();\n\n  const { emit, receive } = options ?? { emit: true, receive: true };\n\n  const handleStateChange = (state?: SetStateAction<S>, prevState?: S) => {\n    // Initialize state from the provided initial value, if defined\n    const resolvedState: S = resolveState(state, prevState);\n\n    // Emit the initial state if `emit` is enabled and initial state is defined\n    if (\n      emit &&\n      typeof postMessage === 'function' &&\n      typeof resolvedState !== 'undefined'\n    ) {\n      postMessage({ type: `${key}/post`, data: resolvedState, senderId });\n    }\n\n    return resolvedState;\n  };\n\n  const postState = () => {\n    if (typeof postMessage !== 'function') return;\n    postMessage({ type: `${key}/post`, data: state, senderId });\n  };\n\n  const [state, setState] = useState<S>(() => handleStateChange(initialState));\n\n  /**\n   * A wrapper function around the `setState` function to handle messaging efficiently.\n   *\n   * This approach has several advantages over using an additional `useEffect`:\n   * - **Avoid Redundant Re-renders:** By emitting the message directly within the `setState` logic,\n   *   it prevents the extra render cycle that would be triggered when using `useEffect`.\n   * - **Consistency:** Ensures the message is emitted immediately when the state is updated,\n   *   avoiding potential delays caused by the asynchronous nature of `useEffect`.\n   *\n   * This function keeps the same API as `setState` and is memoized using `useCallback`\n   * to prevent unnecessary re-renders of dependent components.\n   *\n   * @template S - The type of the state.\n   * @param {SetStateAction<S>} valueOrUpdater - The new state or a function to produce it.\n   * @returns {void}\n   */\n  const setStateWrapper: Dispatch<SetStateAction<S>> = (valueOrUpdater) =>\n    setState((prevState) => handleStateChange(valueOrUpdater, prevState));\n\n  /**\n   * Listen for messages with the specified key and update the state accordingly.\n   */\n  useCrossFrameMessageListener<S>(\n    `${key}/post`,\n    // Only activate the state listener if the `receive` option is true\n    receive\n      ? (data) => {\n          setState(data);\n        }\n      : undefined\n  );\n\n  const onGetMessage = (_: unknown, originSenderId?: string) => {\n    if (!emit) return;\n    if (typeof postMessage !== 'function') return;\n    if (originSenderId === senderId) return;\n    if (typeof state === 'undefined') return;\n\n    postMessage({ type: `${key}/post`, data: state, senderId });\n  };\n\n  /**\n   * Listen for messages request to get the state content and send it back.\n   */\n  useCrossFrameMessageListener<S>(\n    `${key}/get`,\n    // Only activate the state listener if the `emit` option is true\n    emit ? onGetMessage : undefined,\n    state // Revalidate the listener if the state changes\n  );\n\n  useEffect(() => {\n    // If the component is mounted and the hook in receive mode,\n    // Request the state from the other instance\n    if (\n      receive &&\n      typeof postMessage === 'function' &&\n      typeof state === 'undefined'\n    ) {\n      postMessage({ type: `${key}/get`, senderId });\n    }\n  }, []);\n\n  // Return the useState state and setter\n  return [state, setStateWrapper, postState];\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAwE;AACxE,iCAAgC;AAEhC,0CAA6C;AAO7C,MAAM,eAAe,CAAK,OAA2B,cACnD,OAAO,UAAU,aACZ,MAA+B,SAAS,IACxC;AAwBA,MAAM,qBAAqB,CAChC,KACA,cACA,YACuD;AACvD,QAAM,EAAE,aAAa,SAAS,QAAI,4CAAgB;AAElD,QAAM,EAAE,MAAM,QAAQ,IAAI,WAAW,EAAE,MAAM,MAAM,SAAS,KAAK;AAEjE,QAAM,oBAAoB,CAACA,QAA2B,cAAkB;AAEtE,UAAM,gBAAmB,aAAaA,QAAO,SAAS;AAGtD,QACE,QACA,OAAO,gBAAgB,cACvB,OAAO,kBAAkB,aACzB;AACA,kBAAY,EAAE,MAAM,GAAG,GAAG,SAAS,MAAM,eAAe,SAAS,CAAC;AAAA,IACpE;AAEA,WAAO;AAAA,EACT;AAEA,QAAM,YAAY,MAAM;AACtB,QAAI,OAAO,gBAAgB,WAAY;AACvC,gBAAY,EAAE,MAAM,GAAG,GAAG,SAAS,MAAM,OAAO,SAAS,CAAC;AAAA,EAC5D;AAEA,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAY,MAAM,kBAAkB,YAAY,CAAC;AAkB3E,QAAM,kBAA+C,CAAC,mBACpD,SAAS,CAAC,cAAc,kBAAkB,gBAAgB,SAAS,CAAC;AAKtE;AAAA,IACE,GAAG,GAAG;AAAA;AAAA,IAEN,UACI,CAAC,SAAS;AACR,eAAS,IAAI;AAAA,IACf,IACA;AAAA,EACN;AAEA,QAAM,eAAe,CAAC,GAAY,mBAA4B;AAC5D,QAAI,CAAC,KAAM;AACX,QAAI,OAAO,gBAAgB,WAAY;AACvC,QAAI,mBAAmB,SAAU;AACjC,QAAI,OAAO,UAAU,YAAa;AAElC,gBAAY,EAAE,MAAM,GAAG,GAAG,SAAS,MAAM,OAAO,SAAS,CAAC;AAAA,EAC5D;AAKA;AAAA,IACE,GAAG,GAAG;AAAA;AAAA,IAEN,OAAO,eAAe;AAAA,IACtB;AAAA;AAAA,EACF;AAEA,8BAAU,MAAM;AAGd,QACE,WACA,OAAO,gBAAgB,cACvB,OAAO,UAAU,aACjB;AACA,kBAAY,EAAE,MAAM,GAAG,GAAG,QAAQ,SAAS,CAAC;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,CAAC;AAGL,SAAO,CAAC,OAAO,iBAAiB,SAAS;AAC3C;","names":["state"]}
+{"version":3,"sources":["../../src/useCrossFrameState.tsx"],"sourcesContent":["'use client';\n\nimport { type MessageKey } from '@intlayer/editor';\nimport { useEffect, useState, type Dispatch, type SetStateAction } from 'react';\nimport { useCommunicator } from './CommunicatorContext';\nimport { useCrossFrameMessageListener } from './useCrossFrameMessageListener';\n\nexport type CrossFrameStateOptions = {\n  emit?: boolean;\n  receive?: boolean;\n};\n\nconst resolveState = <S,>(state?: SetStateAction<S>, prevState?: S): S =>\n  typeof state === 'function'\n    ? (state as (prevState?: S) => S)(prevState)\n    : (state as S);\n\n/**\n * Configuration options for `useCrossFrameState`.\n * @typedef {Object} CrossFrameStateOptions\n * @property {boolean} [emit=true] - Whether to broadcast state changes to other instances.\n * @property {boolean} [receive=true] - Whether to listen for state updates from other instances.\n */\n\n/**\n * useCrossFrameState\n *\n * This React hook synchronizes state across multiple instances (e.g., different iframes or windows).\n * It uses the `postMessage` API to communicate state changes and updates between instances.\n *\n * @template S - The type of the state.\n * @param key - A unique identifier for the state to synchronize.\n * @param initialState - The initial state value or a function to compute it lazily.\n * @param options - Configuration options to control emitting and receiving messages.\n *   - `emit` (default: true): Whether to broadcast state changes to other instances.\n *   - `receive` (default: true): Whether to listen for state updates from other instances.\n *\n * @returns {[S, Dispatch<SetStateAction<S>>]} An array containing the current state and a setter function.\n */\nexport const useCrossFrameState = <S,>(\n  key: `${MessageKey}`,\n  initialState?: S | (() => S),\n  options?: CrossFrameStateOptions\n): [S, Dispatch<SetStateAction<S>>, typeof postState] => {\n  const { postMessage, senderId } = useCommunicator();\n\n  const { emit, receive } = options ?? { emit: true, receive: true };\n\n  const handleStateChange = (state?: SetStateAction<S>, prevState?: S) => {\n    // Initialize state from the provided initial value, if defined\n    const resolvedState: S = resolveState(state, prevState);\n\n    // Emit the initial state if `emit` is enabled and initial state is defined\n    if (\n      emit &&\n      typeof postMessage === 'function' &&\n      typeof resolvedState !== 'undefined'\n    ) {\n      postMessage({ type: `${key}/post`, data: resolvedState, senderId });\n    }\n\n    return resolvedState;\n  };\n\n  const postState = () => {\n    if (typeof postMessage !== 'function') return;\n    postMessage({ type: `${key}/post`, data: state, senderId });\n  };\n\n  const [state, setState] = useState<S>(() => handleStateChange(initialState));\n\n  /**\n   * A wrapper function around the `setState` function to handle messaging efficiently.\n   *\n   * This approach has several advantages over using an additional `useEffect`:\n   * - **Avoid Redundant Re-renders:** By emitting the message directly within the `setState` logic,\n   *   it prevents the extra render cycle that would be triggered when using `useEffect`.\n   * - **Consistency:** Ensures the message is emitted immediately when the state is updated,\n   *   avoiding potential delays caused by the asynchronous nature of `useEffect`.\n   *\n   * This function keeps the same API as `setState` and is memoized using `useCallback`\n   * to prevent unnecessary re-renders of dependent components.\n   *\n   * @template S - The type of the state.\n   * @param {SetStateAction<S>} valueOrUpdater - The new state or a function to produce it.\n   * @returns {void}\n   */\n  const setStateWrapper: Dispatch<SetStateAction<S>> = (valueOrUpdater) =>\n    setState((prevState) => handleStateChange(valueOrUpdater, prevState));\n\n  /**\n   * Listen for messages with the specified key and update the state accordingly.\n   */\n  useCrossFrameMessageListener<S>(\n    `${key}/post`,\n    // Only activate the state listener if the `receive` option is true\n    receive\n      ? (data) => {\n          setState(data);\n        }\n      : undefined\n  );\n\n  const onGetMessage = (_: unknown, originSenderId?: string) => {\n    if (!emit) return;\n    if (typeof postMessage !== 'function') return;\n    if (originSenderId === senderId) return;\n    if (typeof state === 'undefined') return;\n\n    postMessage({ type: `${key}/post`, data: state, senderId });\n  };\n\n  /**\n   * Listen for messages request to get the state content and send it back.\n   */\n  useCrossFrameMessageListener<S>(\n    `${key}/get`,\n    // Only activate the state listener if the `emit` option is true\n    emit ? onGetMessage : undefined,\n    state // Revalidate the listener if the state changes\n  );\n\n  useEffect(() => {\n    // If the component is mounted and the hook in receive mode,\n    // Request the state from the other instance\n    if (\n      receive &&\n      typeof postMessage === 'function' &&\n      typeof state === 'undefined'\n    ) {\n      postMessage({ type: `${key}/get`, senderId });\n    }\n  }, []);\n\n  // Return the useState state and setter\n  return [state, setStateWrapper, postState];\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAAwE;AACxE,iCAAgC;AAChC,0CAA6C;AAO7C,MAAM,eAAe,CAAK,OAA2B,cACnD,OAAO,UAAU,aACZ,MAA+B,SAAS,IACxC;AAwBA,MAAM,qBAAqB,CAChC,KACA,cACA,YACuD;AACvD,QAAM,EAAE,aAAa,SAAS,QAAI,4CAAgB;AAElD,QAAM,EAAE,MAAM,QAAQ,IAAI,WAAW,EAAE,MAAM,MAAM,SAAS,KAAK;AAEjE,QAAM,oBAAoB,CAACA,QAA2B,cAAkB;AAEtE,UAAM,gBAAmB,aAAaA,QAAO,SAAS;AAGtD,QACE,QACA,OAAO,gBAAgB,cACvB,OAAO,kBAAkB,aACzB;AACA,kBAAY,EAAE,MAAM,GAAG,GAAG,SAAS,MAAM,eAAe,SAAS,CAAC;AAAA,IACpE;AAEA,WAAO;AAAA,EACT;AAEA,QAAM,YAAY,MAAM;AACtB,QAAI,OAAO,gBAAgB,WAAY;AACvC,gBAAY,EAAE,MAAM,GAAG,GAAG,SAAS,MAAM,OAAO,SAAS,CAAC;AAAA,EAC5D;AAEA,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAY,MAAM,kBAAkB,YAAY,CAAC;AAkB3E,QAAM,kBAA+C,CAAC,mBACpD,SAAS,CAAC,cAAc,kBAAkB,gBAAgB,SAAS,CAAC;AAKtE;AAAA,IACE,GAAG,GAAG;AAAA;AAAA,IAEN,UACI,CAAC,SAAS;AACR,eAAS,IAAI;AAAA,IACf,IACA;AAAA,EACN;AAEA,QAAM,eAAe,CAAC,GAAY,mBAA4B;AAC5D,QAAI,CAAC,KAAM;AACX,QAAI,OAAO,gBAAgB,WAAY;AACvC,QAAI,mBAAmB,SAAU;AACjC,QAAI,OAAO,UAAU,YAAa;AAElC,gBAAY,EAAE,MAAM,GAAG,GAAG,SAAS,MAAM,OAAO,SAAS,CAAC;AAAA,EAC5D;AAKA;AAAA,IACE,GAAG,GAAG;AAAA;AAAA,IAEN,OAAO,eAAe;AAAA,IACtB;AAAA;AAAA,EACF;AAEA,8BAAU,MAAM;AAGd,QACE,WACA,OAAO,gBAAgB,cACvB,OAAO,UAAU,aACjB;AACA,kBAAY,EAAE,MAAM,GAAG,GAAG,QAAQ,SAAS,CAAC;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,CAAC;AAGL,SAAO,CAAC,OAAO,iBAAiB,SAAS;AAC3C;","names":["state"]}

package/dist/cjs/useCrossURLPathState.cjs

@@ -23,9 +23,10 @@ __export(useCrossURLPathState_exports, {
   useCrossURLPathState: () => useCrossURLPathState
 });
 module.exports = __toCommonJS(useCrossURLPathState_exports);
+var import_editor = require("@intlayer/editor");
 var import_react = require("react");
 var import_useCrossFrameState = require('./useCrossFrameState.cjs');
-const useCrossURLPathState = (initialState, options) => (0, import_useCrossFrameState.useCrossFrameState)("INTLAYER_URL_CHANGE", initialState, options);
+const useCrossURLPathState = (initialState, options) => (0, import_useCrossFrameState.useCrossFrameState)(import_editor.MessageKey.INTLAYER_URL_CHANGE, initialState, options);
 const useCrossURLPathSetter = (initialState) => {
   const states = useCrossURLPathState(initialState, {
     emit: true,

package/dist/cjs/useCrossURLPathState.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/useCrossURLPathState.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect } from 'react';\nimport {\n  useCrossFrameState,\n  type CrossFrameStateOptions,\n} from './useCrossFrameState';\n\nexport const useCrossURLPathState = (\n  initialState?: string,\n  options?: CrossFrameStateOptions\n) => useCrossFrameState('INTLAYER_URL_CHANGE', initialState, options);\n\nexport const useCrossURLPathSetter = (initialState?: string) => {\n  const states = useCrossURLPathState(initialState, {\n    emit: true,\n    receive: false,\n  });\n  const [_state, setState] = states;\n\n  useEffect(() => {\n    /**\n     * 1) Monkey patch history methods (pushState, replaceState)\n     *    to dispatch a custom event whenever they are called.\n     */\n    const originalPushState = history.pushState;\n    const originalReplaceState = history.replaceState;\n\n    const injectLocationChangeEvent = (method: (...args: any[]) => void) =>\n      function (this: typeof history, ...args: [any, string, string?]) {\n        method.apply(this, args);\n        window.dispatchEvent(new Event('locationchange'));\n      };\n\n    history.pushState = injectLocationChangeEvent(originalPushState);\n    history.replaceState = injectLocationChangeEvent(originalReplaceState);\n\n    /**\n     * 2) The callback to update our state whenever the URL changes.\n     */\n    const updateURLState = () => {\n      setState(window.location.pathname);\n    };\n\n    /**\n     * 3) Attach event listeners for locationchange, popstate, hashchange.\n     *    - 'locationchange' is our custom event triggered by push/replaceState overrides.\n     *    - 'popstate' is fired on back/forward navigation.\n     *    - 'hashchange' is for URL hash (#) changes.\n     *    - 'load' is when new page is loaded\n     */\n    window.addEventListener('locationchange', updateURLState);\n    window.addEventListener('popstate', updateURLState);\n    window.addEventListener('hashchange', updateURLState);\n    window.addEventListener('load', updateURLState);\n\n    // Initialize our state immediately on mount\n    updateURLState();\n\n    /**\n     * 4) Cleanup when the component unmounts:\n     *    - Remove event listeners.\n     *    - Restore original pushState & replaceState to avoid side effects.\n     */\n    return () => {\n      window.removeEventListener('locationchange', updateURLState);\n      window.removeEventListener('popstate', updateURLState);\n      window.removeEventListener('hashchange', updateURLState);\n      window.removeEventListener('load', updateURLState);\n      history.pushState = originalPushState;\n      history.replaceState = originalReplaceState;\n    };\n  }, []);\n\n  return states;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAA0B;AAC1B,gCAGO;AAEA,MAAM,uBAAuB,CAClC,cACA,gBACG,8CAAmB,uBAAuB,cAAc,OAAO;AAE7D,MAAM,wBAAwB,CAAC,iBAA0B;AAC9D,QAAM,SAAS,qBAAqB,cAAc;AAAA,IAChD,MAAM;AAAA,IACN,SAAS;AAAA,EACX,CAAC;AACD,QAAM,CAAC,QAAQ,QAAQ,IAAI;AAE3B,8BAAU,MAAM;AAKd,UAAM,oBAAoB,QAAQ;AAClC,UAAM,uBAAuB,QAAQ;AAErC,UAAM,4BAA4B,CAAC,WACjC,YAAmC,MAA8B;AAC/D,aAAO,MAAM,MAAM,IAAI;AACvB,aAAO,cAAc,IAAI,MAAM,gBAAgB,CAAC;AAAA,IAClD;AAEF,YAAQ,YAAY,0BAA0B,iBAAiB;AAC/D,YAAQ,eAAe,0BAA0B,oBAAoB;AAKrE,UAAM,iBAAiB,MAAM;AAC3B,eAAS,OAAO,SAAS,QAAQ;AAAA,IACnC;AASA,WAAO,iBAAiB,kBAAkB,cAAc;AACxD,WAAO,iBAAiB,YAAY,cAAc;AAClD,WAAO,iBAAiB,cAAc,cAAc;AACpD,WAAO,iBAAiB,QAAQ,cAAc;AAG9C,mBAAe;AAOf,WAAO,MAAM;AACX,aAAO,oBAAoB,kBAAkB,cAAc;AAC3D,aAAO,oBAAoB,YAAY,cAAc;AACrD,aAAO,oBAAoB,cAAc,cAAc;AACvD,aAAO,oBAAoB,QAAQ,cAAc;AACjD,cAAQ,YAAY;AACpB,cAAQ,eAAe;AAAA,IACzB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../src/useCrossURLPathState.tsx"],"sourcesContent":["'use client';\n\nimport { MessageKey } from '@intlayer/editor';\nimport { useEffect } from 'react';\nimport {\n  useCrossFrameState,\n  type CrossFrameStateOptions,\n} from './useCrossFrameState';\n\nexport const useCrossURLPathState = (\n  initialState?: string,\n  options?: CrossFrameStateOptions\n) => useCrossFrameState(MessageKey.INTLAYER_URL_CHANGE, initialState, options);\n\nexport const useCrossURLPathSetter = (initialState?: string) => {\n  const states = useCrossURLPathState(initialState, {\n    emit: true,\n    receive: false,\n  });\n  const [_state, setState] = states;\n\n  useEffect(() => {\n    /**\n     * 1) Monkey patch history methods (pushState, replaceState)\n     *    to dispatch a custom event whenever they are called.\n     */\n    const originalPushState = history.pushState;\n    const originalReplaceState = history.replaceState;\n\n    const injectLocationChangeEvent = (method: (...args: any[]) => void) =>\n      function (this: typeof history, ...args: [any, string, string?]) {\n        method.apply(this, args);\n        window.dispatchEvent(new Event('locationchange'));\n      };\n\n    history.pushState = injectLocationChangeEvent(originalPushState);\n    history.replaceState = injectLocationChangeEvent(originalReplaceState);\n\n    /**\n     * 2) The callback to update our state whenever the URL changes.\n     */\n    const updateURLState = () => {\n      setState(window.location.pathname);\n    };\n\n    /**\n     * 3) Attach event listeners for locationchange, popstate, hashchange.\n     *    - 'locationchange' is our custom event triggered by push/replaceState overrides.\n     *    - 'popstate' is fired on back/forward navigation.\n     *    - 'hashchange' is for URL hash (#) changes.\n     *    - 'load' is when new page is loaded\n     */\n    window.addEventListener('locationchange', updateURLState);\n    window.addEventListener('popstate', updateURLState);\n    window.addEventListener('hashchange', updateURLState);\n    window.addEventListener('load', updateURLState);\n\n    // Initialize our state immediately on mount\n    updateURLState();\n\n    /**\n     * 4) Cleanup when the component unmounts:\n     *    - Remove event listeners.\n     *    - Restore original pushState & replaceState to avoid side effects.\n     */\n    return () => {\n      window.removeEventListener('locationchange', updateURLState);\n      window.removeEventListener('popstate', updateURLState);\n      window.removeEventListener('hashchange', updateURLState);\n      window.removeEventListener('load', updateURLState);\n      history.pushState = originalPushState;\n      history.replaceState = originalReplaceState;\n    };\n  }, []);\n\n  return states;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,oBAA2B;AAC3B,mBAA0B;AAC1B,gCAGO;AAEA,MAAM,uBAAuB,CAClC,cACA,gBACG,8CAAmB,yBAAW,qBAAqB,cAAc,OAAO;AAEtE,MAAM,wBAAwB,CAAC,iBAA0B;AAC9D,QAAM,SAAS,qBAAqB,cAAc;AAAA,IAChD,MAAM;AAAA,IACN,SAAS;AAAA,EACX,CAAC;AACD,QAAM,CAAC,QAAQ,QAAQ,IAAI;AAE3B,8BAAU,MAAM;AAKd,UAAM,oBAAoB,QAAQ;AAClC,UAAM,uBAAuB,QAAQ;AAErC,UAAM,4BAA4B,CAAC,WACjC,YAAmC,MAA8B;AAC/D,aAAO,MAAM,MAAM,IAAI;AACvB,aAAO,cAAc,IAAI,MAAM,gBAAgB,CAAC;AAAA,IAClD;AAEF,YAAQ,YAAY,0BAA0B,iBAAiB;AAC/D,YAAQ,eAAe,0BAA0B,oBAAoB;AAKrE,UAAM,iBAAiB,MAAM;AAC3B,eAAS,OAAO,SAAS,QAAQ;AAAA,IACnC;AASA,WAAO,iBAAiB,kBAAkB,cAAc;AACxD,WAAO,iBAAiB,YAAY,cAAc;AAClD,WAAO,iBAAiB,cAAc,cAAc;AACpD,WAAO,iBAAiB,QAAQ,cAAc;AAG9C,mBAAe;AAOf,WAAO,MAAM;AACX,aAAO,oBAAoB,kBAAkB,cAAc;AAC3D,aAAO,oBAAoB,YAAY,cAAc;AACrD,aAAO,oBAAoB,cAAc,cAAc;AACvD,aAAO,oBAAoB,QAAQ,cAAc;AACjD,cAAQ,YAAY;AACpB,cAAQ,eAAe;AAAA,IACzB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;","names":[]}

package/dist/cjs/{useIframeClickCommunicator.cjs → useIframeClickInterceptor.cjs}

@@ -17,17 +17,18 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var useIframeClickCommunicator_exports = {};
-__export(useIframeClickCommunicator_exports, {
+var useIframeClickInterceptor_exports = {};
+__export(useIframeClickInterceptor_exports, {
   useIframeClickInterceptor: () => useIframeClickInterceptor,
   useIframeClickMerger: () => useIframeClickMerger
 });
-module.exports = __toCommonJS(useIframeClickCommunicator_exports);
+module.exports = __toCommonJS(useIframeClickInterceptor_exports);
+var import_editor = require("@intlayer/editor");
 var import_react = require("react");
 var import_useCrossFrameMessageListener = require('./useCrossFrameMessageListener.cjs');
 const useIframeClickInterceptor = () => {
   const postMessage = (0, import_useCrossFrameMessageListener.useCrossFrameMessageListener)(
-    "INTLAYER_IFRAME_CLICKED"
+    `${import_editor.MessageKey.INTLAYER_IFRAME_CLICKED}/post`
   );
   (0, import_react.useEffect)(() => {
     const handlePostMessageEvent = () => {
@@ -37,29 +38,13 @@ const useIframeClickInterceptor = () => {
     return () => window.removeEventListener("mousedown", handlePostMessageEvent);
   }, [postMessage]);
 };
-const handleIframeMessage = (event) => {
-  const simulatedMouseDownEvent = new MouseEvent("mousedown", {
-    bubbles: true,
-    cancelable: true,
-    view: window
-  });
-  const simulatedClickEvent = new MouseEvent("click", {
-    bubbles: true,
-    cancelable: true,
-    view: window
-  });
-  Object.assign(simulatedClickEvent, { iframeData: event });
-  Object.assign(simulatedMouseDownEvent, { iframeData: event });
-  window.dispatchEvent(simulatedClickEvent);
-  window.dispatchEvent(simulatedMouseDownEvent);
-};
 const useIframeClickMerger = () => (0, import_useCrossFrameMessageListener.useCrossFrameMessageListener)(
-  "INTLAYER_IFRAME_CLICKED",
-  handleIframeMessage
+  `${import_editor.MessageKey.INTLAYER_IFRAME_CLICKED}/get`,
+  import_editor.mergeIframeClick
 );
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   useIframeClickInterceptor,
   useIframeClickMerger
 });
-//# sourceMappingURL=useIframeClickCommunicator.cjs.map
+//# sourceMappingURL=useIframeClickInterceptor.cjs.map

package/dist/cjs/useIframeClickInterceptor.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/useIframeClickInterceptor.tsx"],"sourcesContent":["'use client';\n\nimport { MessageKey, mergeIframeClick } from '@intlayer/editor';\nimport { useEffect } from 'react';\nimport { useCrossFrameMessageListener } from './useCrossFrameMessageListener';\n\nexport const useIframeClickInterceptor = () => {\n  const postMessage = useCrossFrameMessageListener<undefined>(\n    `${MessageKey.INTLAYER_IFRAME_CLICKED}/post`\n  );\n\n  useEffect(() => {\n    const handlePostMessageEvent: EventListener = () => {\n      postMessage(undefined);\n    };\n\n    window.addEventListener('mousedown', handlePostMessageEvent);\n\n    return () =>\n      window.removeEventListener('mousedown', handlePostMessageEvent);\n  }, [postMessage]);\n};\n\nexport const useIframeClickMerger = () =>\n  useCrossFrameMessageListener<MessageEvent>(\n    `${MessageKey.INTLAYER_IFRAME_CLICKED}/get`,\n    mergeIframeClick\n  );\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,oBAA6C;AAC7C,mBAA0B;AAC1B,0CAA6C;AAEtC,MAAM,4BAA4B,MAAM;AAC7C,QAAM,kBAAc;AAAA,IAClB,GAAG,yBAAW,uBAAuB;AAAA,EACvC;AAEA,8BAAU,MAAM;AACd,UAAM,yBAAwC,MAAM;AAClD,kBAAY,MAAS;AAAA,IACvB;AAEA,WAAO,iBAAiB,aAAa,sBAAsB;AAE3D,WAAO,MACL,OAAO,oBAAoB,aAAa,sBAAsB;AAAA,EAClE,GAAG,CAAC,WAAW,CAAC;AAClB;AAEO,MAAM,uBAAuB,UAClC;AAAA,EACE,GAAG,yBAAW,uBAAuB;AAAA,EACrC;AACF;","names":[]}

package/dist/esm/ConfigurationContext.mjs

@@ -1,5 +1,6 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
+import { MessageKey } from "@intlayer/editor";
 import {
   createContext,
   useContext
@@ -8,10 +9,14 @@ import { useCrossFrameState } from "./useCrossFrameState.mjs";
 const ConfigurationStatesContext = createContext(
   void 0
 );
-const useConfigurationState = () => useCrossFrameState("INTLAYER_CONFIGURATION", void 0, {
-  receive: false,
-  emit: true
-});
+const useConfigurationState = () => useCrossFrameState(
+  MessageKey.INTLAYER_CONFIGURATION,
+  void 0,
+  {
+    receive: false,
+    emit: true
+  }
+);
 const ConfigurationProvider = ({ children, configuration }) => /* @__PURE__ */ jsx(ConfigurationStatesContext.Provider, { value: configuration, children });
 const useConfiguration = () => useContext(ConfigurationStatesContext);
 export {

package/dist/esm/ConfigurationContext.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ConfigurationContext.tsx"],"sourcesContent":["'use client';\n\nimport { type IntlayerConfig } from '@intlayer/config/client';\nimport {\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n} from 'react';\nimport { useCrossFrameState } from './useCrossFrameState';\n\nconst ConfigurationStatesContext = createContext<IntlayerConfig | undefined>(\n  undefined\n);\n\nexport const useConfigurationState = () =>\n  useCrossFrameState<IntlayerConfig>('INTLAYER_CONFIGURATION', undefined, {\n    receive: false,\n    emit: true,\n  });\n\nexport type ConfigurationProviderProps = {\n  configuration?: IntlayerConfig;\n};\n\nexport const ConfigurationProvider: FC<\n  PropsWithChildren<ConfigurationProviderProps>\n> = ({ children, configuration }) => (\n  <ConfigurationStatesContext.Provider value={configuration}>\n    {children}\n  </ConfigurationStatesContext.Provider>\n);\n\nexport const useConfiguration = () => useContext(ConfigurationStatesContext);\n"],"mappings":";AA4BE;AAzBF;AAAA,EAGE;AAAA,EACA;AAAA,OACK;AACP,SAAS,0BAA0B;AAEnC,MAAM,6BAA6B;AAAA,EACjC;AACF;AAEO,MAAM,wBAAwB,MACnC,mBAAmC,0BAA0B,QAAW;AAAA,EACtE,SAAS;AAAA,EACT,MAAM;AACR,CAAC;AAMI,MAAM,wBAET,CAAC,EAAE,UAAU,cAAc,MAC7B,oBAAC,2BAA2B,UAA3B,EAAoC,OAAO,eACzC,UACH;AAGK,MAAM,mBAAmB,MAAM,WAAW,0BAA0B;","names":[]}
+{"version":3,"sources":["../../src/ConfigurationContext.tsx"],"sourcesContent":["'use client';\n\nimport { type IntlayerConfig } from '@intlayer/config/client';\nimport { MessageKey } from '@intlayer/editor';\nimport {\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n} from 'react';\nimport { useCrossFrameState } from './useCrossFrameState';\n\nconst ConfigurationStatesContext = createContext<IntlayerConfig | undefined>(\n  undefined\n);\n\nexport const useConfigurationState = () =>\n  useCrossFrameState<IntlayerConfig>(\n    MessageKey.INTLAYER_CONFIGURATION,\n    undefined,\n    {\n      receive: false,\n      emit: true,\n    }\n  );\n\nexport type ConfigurationProviderProps = {\n  configuration?: IntlayerConfig;\n};\n\nexport const ConfigurationProvider: FC<\n  PropsWithChildren<ConfigurationProviderProps>\n> = ({ children, configuration }) => (\n  <ConfigurationStatesContext.Provider value={configuration}>\n    {children}\n  </ConfigurationStatesContext.Provider>\n);\n\nexport const useConfiguration = () => useContext(ConfigurationStatesContext);\n"],"mappings":";AAiCE;AA9BF,SAAS,kBAAkB;AAC3B;AAAA,EAGE;AAAA,EACA;AAAA,OACK;AACP,SAAS,0BAA0B;AAEnC,MAAM,6BAA6B;AAAA,EACjC;AACF;AAEO,MAAM,wBAAwB,MACnC;AAAA,EACE,WAAW;AAAA,EACX;AAAA,EACA;AAAA,IACE,SAAS;AAAA,IACT,MAAM;AAAA,EACR;AACF;AAMK,MAAM,wBAET,CAAC,EAAE,UAAU,cAAc,MAC7B,oBAAC,2BAA2B,UAA3B,EAAoC,OAAO,eACzC,UACH;AAGK,MAAM,mBAAmB,MAAM,WAAW,0BAA0B;","names":[]}

package/dist/esm/DictionariesRecordContext.mjs

@@ -1,5 +1,6 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
+import { MessageKey } from "@intlayer/editor";
 import {
   createContext,
   useContext,
@@ -12,7 +13,7 @@ const DictionariesRecordProvider = ({
   children
 }) => {
   const [localeDictionaries, setLocaleDictionaries] = useCrossFrameState(
-    "INTLAYER_LOCALE_DICTIONARIES_CHANGED",
+    MessageKey.INTLAYER_LOCALE_DICTIONARIES_CHANGED,
     void 0
   );
   const stateValue = useMemo(