react-intlayer 4.1.8 → 4.1.10

package/dist/cjs/client/IntlayerProvider.cjs

@@ -67,10 +67,10 @@ const IntlayerProviderContent = ({
     () => ({ locale: currentLocale, setLocale }),
     [currentLocale, setLocale]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(IntlayerClientContext.Provider, { value, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IntlayerClientContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_editor_react.ChangedContentProvider, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_PoweredByMeta.PoweredByMeta, {}),
     children
-  ] });
+  ] }) });
 };
 const IntlayerProvider = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_IntlayerEditorProvider.IntlayerEditorProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IntlayerProviderContent, { ...props }) });
 // Annotate the CommonJS export names for ESM import in node:

package/dist/cjs/client/IntlayerProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration, type Locales } from '@intlayer/config/client';\nimport { useCrossFrameState } from '@intlayer/editor-react';\nimport {\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useMemo,\n  type FC,\n  useState,\n  useCallback,\n} from 'react';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\nimport { PoweredByMeta } from './PoweredByMeta';\nimport { localeCookie, setLocaleCookie } from './useLocaleCookie';\n\ntype IntlayerValue = {\n  locale: Locales;\n  setLocale: (newLocale: Locales) => void;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n  locale: localeCookie ?? getConfiguration().internationalization.defaultLocale,\n  setLocale: () => null,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\nexport type IntlayerProviderProps = PropsWithChildren & {\n  locale?: Locales;\n  setLocale?: (locale: Locales) => void;\n};\n\n/**\n * Provider that store the current locale on the client side\n */\nconst IntlayerProviderContent: FC<IntlayerProviderProps> = ({\n  locale,\n  children,\n  setLocale: setLocaleProp,\n}) => {\n  const { internationalization } = getConfiguration();\n  const { defaultLocale, locales: availableLocales } = internationalization;\n\n  const [currentLocale, setCurrentLocale] = useCrossFrameState(\n    'INTLAYER_CURRENT_LOCALE',\n    locale ?? localeCookie ?? defaultLocale\n  );\n\n  const setLocaleBase = useCallback(\n    (newLocale: Locales) => {\n      if (currentLocale.toString() === newLocale.toString()) return;\n\n      if (!availableLocales.includes(newLocale)) {\n        console.error(`Locale ${locale} is not available`);\n        return;\n      }\n\n      setCurrentLocale(newLocale); // Update state\n      setLocaleCookie(newLocale); // Optionally set cookie for persistence\n    },\n    [availableLocales, currentLocale, locale]\n  );\n\n  const setLocale = useMemo(\n    () => setLocaleProp ?? setLocaleBase,\n    [setLocaleProp, setLocaleBase]\n  );\n\n  const value: IntlayerValue = useMemo<IntlayerValue>(\n    () => ({ locale: currentLocale, setLocale }),\n    [currentLocale, setLocale]\n  );\n\n  return (\n    <IntlayerClientContext.Provider value={value}>\n      <PoweredByMeta />\n      {children}\n    </IntlayerClientContext.Provider>\n  );\n};\n\nexport const IntlayerProvider: FC<IntlayerProviderProps> = (props) => (\n  <IntlayerEditorProvider>\n    <IntlayerProviderContent {...props} />\n  </IntlayerEditorProvider>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkFI;AAhFJ,oBAA+C;AAC/C,0BAAmC;AACnC,mBAQO;AACP,oCAAuC;AACvC,2BAA8B;AAC9B,6BAA8C;AAUvC,MAAM,4BAAwB,4BAA6B;AAAA,EAChE,QAAQ,2CAAgB,gCAAiB,EAAE,qBAAqB;AAAA,EAChE,WAAW,MAAM;AACnB,CAAC;AAKM,MAAM,qBAAqB,UAAM,yBAAW,qBAAqB;AAUxE,MAAM,0BAAqD,CAAC;AAAA,EAC1D;AAAA,EACA;AAAA,EACA,WAAW;AACb,MAAM;AACJ,QAAM,EAAE,qBAAqB,QAAI,gCAAiB;AAClD,QAAM,EAAE,eAAe,SAAS,iBAAiB,IAAI;AAErD,QAAM,CAAC,eAAe,gBAAgB,QAAI;AAAA,IACxC;AAAA,IACA,UAAU,uCAAgB;AAAA,EAC5B;AAEA,QAAM,oBAAgB;AAAA,IACpB,CAAC,cAAuB;AACtB,UAAI,cAAc,SAAS,MAAM,UAAU,SAAS,EAAG;AAEvD,UAAI,CAAC,iBAAiB,SAAS,SAAS,GAAG;AACzC,gBAAQ,MAAM,UAAU,MAAM,mBAAmB;AACjD;AAAA,MACF;AAEA,uBAAiB,SAAS;AAC1B,kDAAgB,SAAS;AAAA,IAC3B;AAAA,IACA,CAAC,kBAAkB,eAAe,MAAM;AAAA,EAC1C;AAEA,QAAM,gBAAY;AAAA,IAChB,MAAM,iBAAiB;AAAA,IACvB,CAAC,eAAe,aAAa;AAAA,EAC/B;AAEA,QAAM,YAAuB;AAAA,IAC3B,OAAO,EAAE,QAAQ,eAAe,UAAU;AAAA,IAC1C,CAAC,eAAe,SAAS;AAAA,EAC3B;AAEA,SACE,6CAAC,sBAAsB,UAAtB,EAA+B,OAC9B;AAAA,gDAAC,sCAAc;AAAA,IACd;AAAA,KACH;AAEJ;AAEO,MAAM,mBAA8C,CAAC,UAC1D,4CAAC,wDACC,sDAAC,2BAAyB,GAAG,OAAO,GACtC;","names":[]}
+{"version":3,"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration, type Locales } from '@intlayer/config/client';\nimport {\n  ChangedContentProvider,\n  useCrossFrameState,\n} from '@intlayer/editor-react';\nimport {\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useMemo,\n  type FC,\n  useCallback,\n} from 'react';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\nimport { PoweredByMeta } from './PoweredByMeta';\nimport { localeCookie, setLocaleCookie } from './useLocaleCookie';\n\ntype IntlayerValue = {\n  locale: Locales;\n  setLocale: (newLocale: Locales) => void;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n  locale: localeCookie ?? getConfiguration().internationalization.defaultLocale,\n  setLocale: () => null,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\nexport type IntlayerProviderProps = PropsWithChildren & {\n  locale?: Locales;\n  setLocale?: (locale: Locales) => void;\n};\n\n/**\n * Provider that store the current locale on the client side\n */\nconst IntlayerProviderContent: FC<IntlayerProviderProps> = ({\n  locale,\n  children,\n  setLocale: setLocaleProp,\n}) => {\n  const { internationalization } = getConfiguration();\n  const { defaultLocale, locales: availableLocales } = internationalization;\n\n  const [currentLocale, setCurrentLocale] = useCrossFrameState(\n    'INTLAYER_CURRENT_LOCALE',\n    locale ?? localeCookie ?? defaultLocale\n  );\n\n  const setLocaleBase = useCallback(\n    (newLocale: Locales) => {\n      if (currentLocale.toString() === newLocale.toString()) return;\n\n      if (!availableLocales.includes(newLocale)) {\n        console.error(`Locale ${locale} is not available`);\n        return;\n      }\n\n      setCurrentLocale(newLocale); // Update state\n      setLocaleCookie(newLocale); // Optionally set cookie for persistence\n    },\n    [availableLocales, currentLocale, locale]\n  );\n\n  const setLocale = useMemo(\n    () => setLocaleProp ?? setLocaleBase,\n    [setLocaleProp, setLocaleBase]\n  );\n\n  const value: IntlayerValue = useMemo<IntlayerValue>(\n    () => ({ locale: currentLocale, setLocale }),\n    [currentLocale, setLocale]\n  );\n\n  return (\n    <IntlayerClientContext.Provider value={value}>\n      <ChangedContentProvider>\n        <PoweredByMeta />\n        {children}\n      </ChangedContentProvider>\n    </IntlayerClientContext.Provider>\n  );\n};\n\nexport const IntlayerProvider: FC<IntlayerProviderProps> = (props) => (\n  <IntlayerEditorProvider>\n    <IntlayerProviderContent {...props} />\n  </IntlayerEditorProvider>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqFM;AAnFN,oBAA+C;AAC/C,0BAGO;AACP,mBAOO;AACP,oCAAuC;AACvC,2BAA8B;AAC9B,6BAA8C;AAUvC,MAAM,4BAAwB,4BAA6B;AAAA,EAChE,QAAQ,2CAAgB,gCAAiB,EAAE,qBAAqB;AAAA,EAChE,WAAW,MAAM;AACnB,CAAC;AAKM,MAAM,qBAAqB,UAAM,yBAAW,qBAAqB;AAUxE,MAAM,0BAAqD,CAAC;AAAA,EAC1D;AAAA,EACA;AAAA,EACA,WAAW;AACb,MAAM;AACJ,QAAM,EAAE,qBAAqB,QAAI,gCAAiB;AAClD,QAAM,EAAE,eAAe,SAAS,iBAAiB,IAAI;AAErD,QAAM,CAAC,eAAe,gBAAgB,QAAI;AAAA,IACxC;AAAA,IACA,UAAU,uCAAgB;AAAA,EAC5B;AAEA,QAAM,oBAAgB;AAAA,IACpB,CAAC,cAAuB;AACtB,UAAI,cAAc,SAAS,MAAM,UAAU,SAAS,EAAG;AAEvD,UAAI,CAAC,iBAAiB,SAAS,SAAS,GAAG;AACzC,gBAAQ,MAAM,UAAU,MAAM,mBAAmB;AACjD;AAAA,MACF;AAEA,uBAAiB,SAAS;AAC1B,kDAAgB,SAAS;AAAA,IAC3B;AAAA,IACA,CAAC,kBAAkB,eAAe,MAAM;AAAA,EAC1C;AAEA,QAAM,gBAAY;AAAA,IAChB,MAAM,iBAAiB;AAAA,IACvB,CAAC,eAAe,aAAa;AAAA,EAC/B;AAEA,QAAM,YAAuB;AAAA,IAC3B,OAAO,EAAE,QAAQ,eAAe,UAAU;AAAA,IAC1C,CAAC,eAAe,SAAS;AAAA,EAC3B;AAEA,SACE,4CAAC,sBAAsB,UAAtB,EAA+B,OAC9B,uDAAC,8CACC;AAAA,gDAAC,sCAAc;AAAA,IACd;AAAA,KACH,GACF;AAEJ;AAEO,MAAM,mBAA8C,CAAC,UAC1D,4CAAC,wDACC,sDAAC,2BAAyB,GAAG,OAAO,GACtC;","names":[]}

package/dist/cjs/client/useIntlayer.cjs

@@ -22,12 +22,18 @@ __export(useIntlayer_exports, {
   useIntlayer: () => useIntlayer
 });
 module.exports = __toCommonJS(useIntlayer_exports);
+var import_editor_react = require("@intlayer/editor-react");
 var import_react = require("react");
+var import_getDictionary = require('../getDictionary.cjs');
 var import_getIntlayer = require('../getIntlayer.cjs');
 var import_IntlayerProvider = require('./IntlayerProvider.cjs');
 const useIntlayer = (key, locale, isRenderEditor = true) => {
   const { locale: currentLocale } = (0, import_react.useContext)(import_IntlayerProvider.IntlayerClientContext);
+  const { changedContent } = (0, import_editor_react.useChangedContent)();
   const localeTarget = locale ?? currentLocale;
+  if (changedContent?.[key]) {
+    return (0, import_getDictionary.getDictionary)(key, localeTarget, isRenderEditor);
+  }
   return (0, import_getIntlayer.getIntlayer)(key, localeTarget, isRenderEditor);
 };
 // Annotate the CommonJS export names for ESM import in node:

package/dist/cjs/client/useIntlayer.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/client/useIntlayer.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport { useContext } from 'react';\nimport {\n  type DictionaryKeys,\n  getIntlayer,\n  type UseIntlayerEditable,\n} from '../getIntlayer';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useIntlayer: UseIntlayerEditable = <T extends DictionaryKeys>(\n  key: T,\n  locale?: Locales,\n  isRenderEditor = true\n) => {\n  const { locale: currentLocale } = useContext(IntlayerClientContext);\n  const localeTarget = locale ?? currentLocale;\n\n  return getIntlayer(key, localeTarget, isRenderEditor);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAA2B;AAC3B,yBAIO;AACP,8BAAsC;AAO/B,MAAM,cAAmC,CAC9C,KACA,QACA,iBAAiB,SACd;AACH,QAAM,EAAE,QAAQ,cAAc,QAAI,yBAAW,6CAAqB;AAClE,QAAM,eAAe,UAAU;AAE/B,aAAO,gCAAY,KAAK,cAAc,cAAc;AACtD;","names":[]}
+{"version":3,"sources":["../../../src/client/useIntlayer.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport { useChangedContent } from '@intlayer/editor-react';\nimport { useContext } from 'react';\nimport { getDictionary } from '../getDictionary';\nimport {\n  type DictionaryKeys,\n  getIntlayer,\n  type UseIntlayerEditable,\n} from '../getIntlayer';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useIntlayer: UseIntlayerEditable = <T extends DictionaryKeys>(\n  key: T,\n  locale?: Locales,\n  isRenderEditor = true\n) => {\n  const { locale: currentLocale } = useContext(IntlayerClientContext);\n  const { changedContent } = useChangedContent();\n  const localeTarget = locale ?? currentLocale;\n\n  if (changedContent?.[key]) {\n    return getDictionary(key, localeTarget, isRenderEditor);\n  }\n\n  return getIntlayer(key, localeTarget, isRenderEditor);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,0BAAkC;AAClC,mBAA2B;AAC3B,2BAA8B;AAC9B,yBAIO;AACP,8BAAsC;AAO/B,MAAM,cAAmC,CAC9C,KACA,QACA,iBAAiB,SACd;AACH,QAAM,EAAE,QAAQ,cAAc,QAAI,yBAAW,6CAAqB;AAClE,QAAM,EAAE,eAAe,QAAI,uCAAkB;AAC7C,QAAM,eAAe,UAAU;AAE/B,MAAI,iBAAiB,GAAG,GAAG;AACzB,eAAO,oCAAc,KAAK,cAAc,cAAc;AAAA,EACxD;AAEA,aAAO,gCAAY,KAAK,cAAc,cAAc;AACtD;","names":[]}

package/dist/cjs/editor/IntlayerEditorProvider.cjs

@@ -33,6 +33,7 @@ __export(IntlayerEditorProvider_exports, {
 });
 module.exports = __toCommonJS(IntlayerEditorProvider_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_api = require("@intlayer/api");
 var import_client = require("@intlayer/config/client");
 var import_dictionaries_entry = __toESM(require("@intlayer/dictionaries-entry"));
 var import_editor_react = require("@intlayer/editor-react");
@@ -47,6 +48,17 @@ const IntlayerEditorHooksEnabled = () => {
     setLocaleDictionaries(import_dictionaries_entry.default);
   }, [setLocaleDictionaries]);
   (0, import_editor_react.useIframeClickInterceptor)();
+  const { setChangedContent } = (0, import_editor_react.useChangedContentActions)();
+  const { editor } = (0, import_client.getConfiguration)();
+  const eventSource = new import_api.IntlayerEventListener();
+  (0, import_react.useEffect)(() => {
+    if (!editor.hotReload) return;
+    if (!editor.clientId) return;
+    if (!editor.clientSecret) return;
+    eventSource.initialize();
+    eventSource.onDictionaryChange = (dictionary) => setChangedContent(dictionary.key, dictionary.content);
+    return () => eventSource.cleanup();
+  }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {});
 };
 const IntlayerEditorHook = () => {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\n'use client';\n\nimport { getConfiguration } from '@intlayer/config/client';\n/**\n * @intlayer/dictionaries-entry is a package that only returns the dictionary entry path.\n * Using an external package allow to alias it in the bundle configuration (such as webpack).\n * The alias allow hot reload the app (such as nextjs) on any dictionary change.\n */\nimport dictionaries from '@intlayer/dictionaries-entry';\nimport {\n  EditorProvider,\n  useCrossURLPathState,\n  useDictionariesRecordActions,\n  useIframeClickInterceptor,\n  useEditorEnabled,\n} from '@intlayer/editor-react';\nimport { useEffect, type FC, type PropsWithChildren } from 'react';\n\nconst IntlayerEditorHooksEnabled: FC = () => {\n  /**\n   * URL Messages\n   */\n  useCrossURLPathState(undefined, {\n    receive: false,\n    emit: true,\n  });\n\n  /**\n   * Locale Dictionaries Messages\n   */\n  const { setLocaleDictionaries } = useDictionariesRecordActions();\n\n  useEffect(() => {\n    setLocaleDictionaries(dictionaries);\n  }, [setLocaleDictionaries]);\n\n  /**\n   * Click Messages\n   */\n  useIframeClickInterceptor();\n\n  return <></>;\n};\n\nconst IntlayerEditorHook: FC = () => {\n  const { enabled } = useEditorEnabled();\n\n  return enabled ? <IntlayerEditorHooksEnabled /> : <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n  const configuration = getConfiguration();\n\n  const { editor } = configuration;\n\n  return (\n    <EditorProvider\n      postMessage={(data: any) => {\n        if (typeof window === 'undefined') return;\n\n        if (editor.applicationURL.length > 0) {\n          window?.postMessage(\n            data,\n            // Use to restrict the origin of the editor for security reasons.\n            // Correspond to the current application URL to synchronize the locales states.\n            editor.applicationURL\n          );\n        }\n        if (editor.editorURL.length > 0) {\n          window.parent?.postMessage(\n            data,\n            // Use to restrict the origin of the editor for security reasons.\n            // Correspond to the editor URL to synchronize the locales states.\n            editor.editorURL\n          );\n        }\n\n        if (editor.cmsURL.length > 0) {\n          window.parent?.postMessage(\n            data,\n            // Use to restrict the origin of the CMS for security reasons.\n            // Correspond to the CMS URL.\n            editor.cmsURL\n          );\n        }\n      }}\n      allowedOrigins={[editor.editorURL, editor.cmsURL, editor.applicationURL]}\n      mode=\"client\"\n      configuration={configuration}\n    >\n      <IntlayerEditorHook />\n      {children}\n    </EditorProvider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA2CS;AAvCT,oBAAiC;AAMjC,gCAAyB;AACzB,0BAMO;AACP,mBAA2D;AAE3D,MAAM,6BAAiC,MAAM;AAI3C,gDAAqB,QAAW;AAAA,IAC9B,SAAS;AAAA,IACT,MAAM;AAAA,EACR,CAAC;AAKD,QAAM,EAAE,sBAAsB,QAAI,kDAA6B;AAE/D,8BAAU,MAAM;AACd,0BAAsB,0BAAAA,OAAY;AAAA,EACpC,GAAG,CAAC,qBAAqB,CAAC;AAK1B,qDAA0B;AAE1B,SAAO,2EAAE;AACX;AAEA,MAAM,qBAAyB,MAAM;AACnC,QAAM,EAAE,QAAQ,QAAI,sCAAiB;AAErC,SAAO,UAAU,4CAAC,8BAA2B,IAAK,2EAAE;AACtD;AAEO,MAAM,yBAAgD,CAAC,EAAE,SAAS,MAAM;AAC7E,QAAM,oBAAgB,gCAAiB;AAEvC,QAAM,EAAE,OAAO,IAAI;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAa,CAAC,SAAc;AAC1B,YAAI,OAAO,WAAW,YAAa;AAEnC,YAAI,OAAO,eAAe,SAAS,GAAG;AACpC,kBAAQ;AAAA,YACN;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AACA,YAAI,OAAO,UAAU,SAAS,GAAG;AAC/B,iBAAO,QAAQ;AAAA,YACb;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AAEA,YAAI,OAAO,OAAO,SAAS,GAAG;AAC5B,iBAAO,QAAQ;AAAA,YACb;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AAAA,MACF;AAAA,MACA,gBAAgB,CAAC,OAAO,WAAW,OAAO,QAAQ,OAAO,cAAc;AAAA,MACvE,MAAK;AAAA,MACL;AAAA,MAEA;AAAA,oDAAC,sBAAmB;AAAA,QACnB;AAAA;AAAA;AAAA,EACH;AAEJ;","names":["dictionaries"]}
+{"version":3,"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\n'use client';\n\nimport { IntlayerEventListener } from '@intlayer/api';\nimport { getConfiguration } from '@intlayer/config/client';\n/**\n * @intlayer/dictionaries-entry is a package that only returns the dictionary entry path.\n * Using an external package allow to alias it in the bundle configuration (such as webpack).\n * The alias allow hot reload the app (such as nextjs) on any dictionary change.\n */\nimport dictionaries from '@intlayer/dictionaries-entry';\nimport {\n  EditorProvider,\n  useCrossURLPathState,\n  useDictionariesRecordActions,\n  useIframeClickInterceptor,\n  useEditorEnabled,\n  useChangedContentActions,\n} from '@intlayer/editor-react';\nimport { useEffect, type FC, type PropsWithChildren } from 'react';\n\nconst IntlayerEditorHooksEnabled: FC = () => {\n  /**\n   * URL Messages\n   */\n  useCrossURLPathState(undefined, {\n    receive: false,\n    emit: true,\n  });\n\n  /**\n   * Locale Dictionaries Messages\n   */\n  const { setLocaleDictionaries } = useDictionariesRecordActions();\n\n  useEffect(() => {\n    setLocaleDictionaries(dictionaries);\n  }, [setLocaleDictionaries]);\n\n  /**\n   * Click Messages\n   */\n  useIframeClickInterceptor();\n\n  /**\n   * Hot reloading\n   */\n  const { setChangedContent } = useChangedContentActions();\n  const { editor } = getConfiguration();\n  const eventSource = new IntlayerEventListener();\n\n  useEffect(() => {\n    if (!editor.hotReload) return;\n    if (!editor.clientId) return;\n    if (!editor.clientSecret) return;\n\n    eventSource.initialize();\n\n    eventSource.onDictionaryChange = (dictionary) =>\n      setChangedContent(dictionary.key, dictionary.content);\n\n    return () => eventSource.cleanup();\n  }, []);\n\n  return <></>;\n};\n\nconst IntlayerEditorHook: FC = () => {\n  const { enabled } = useEditorEnabled();\n\n  return enabled ? <IntlayerEditorHooksEnabled /> : <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n  const configuration = getConfiguration();\n\n  const { editor } = configuration;\n\n  return (\n    <EditorProvider\n      postMessage={(data: any) => {\n        if (typeof window === 'undefined') return;\n\n        if (editor.applicationURL.length > 0) {\n          window?.postMessage(\n            data,\n            // Use to restrict the origin of the editor for security reasons.\n            // Correspond to the current application URL to synchronize the locales states.\n            editor.applicationURL\n          );\n        }\n        if (editor.editorURL.length > 0) {\n          window.parent?.postMessage(\n            data,\n            // Use to restrict the origin of the editor for security reasons.\n            // Correspond to the editor URL to synchronize the locales states.\n            editor.editorURL\n          );\n        }\n\n        if (editor.cmsURL.length > 0) {\n          window.parent?.postMessage(\n            data,\n            // Use to restrict the origin of the CMS for security reasons.\n            // Correspond to the CMS URL.\n            editor.cmsURL\n          );\n        }\n      }}\n      allowedOrigins={[editor.editorURL, editor.cmsURL, editor.applicationURL]}\n      mode=\"client\"\n      configuration={configuration}\n    >\n      <IntlayerEditorHook />\n      {children}\n    </EditorProvider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiES;AA7DT,iBAAsC;AACtC,oBAAiC;AAMjC,gCAAyB;AACzB,0BAOO;AACP,mBAA2D;AAE3D,MAAM,6BAAiC,MAAM;AAI3C,gDAAqB,QAAW;AAAA,IAC9B,SAAS;AAAA,IACT,MAAM;AAAA,EACR,CAAC;AAKD,QAAM,EAAE,sBAAsB,QAAI,kDAA6B;AAE/D,8BAAU,MAAM;AACd,0BAAsB,0BAAAA,OAAY;AAAA,EACpC,GAAG,CAAC,qBAAqB,CAAC;AAK1B,qDAA0B;AAK1B,QAAM,EAAE,kBAAkB,QAAI,8CAAyB;AACvD,QAAM,EAAE,OAAO,QAAI,gCAAiB;AACpC,QAAM,cAAc,IAAI,iCAAsB;AAE9C,8BAAU,MAAM;AACd,QAAI,CAAC,OAAO,UAAW;AACvB,QAAI,CAAC,OAAO,SAAU;AACtB,QAAI,CAAC,OAAO,aAAc;AAE1B,gBAAY,WAAW;AAEvB,gBAAY,qBAAqB,CAAC,eAChC,kBAAkB,WAAW,KAAK,WAAW,OAAO;AAEtD,WAAO,MAAM,YAAY,QAAQ;AAAA,EACnC,GAAG,CAAC,CAAC;AAEL,SAAO,2EAAE;AACX;AAEA,MAAM,qBAAyB,MAAM;AACnC,QAAM,EAAE,QAAQ,QAAI,sCAAiB;AAErC,SAAO,UAAU,4CAAC,8BAA2B,IAAK,2EAAE;AACtD;AAEO,MAAM,yBAAgD,CAAC,EAAE,SAAS,MAAM;AAC7E,QAAM,oBAAgB,gCAAiB;AAEvC,QAAM,EAAE,OAAO,IAAI;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAa,CAAC,SAAc;AAC1B,YAAI,OAAO,WAAW,YAAa;AAEnC,YAAI,OAAO,eAAe,SAAS,GAAG;AACpC,kBAAQ;AAAA,YACN;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AACA,YAAI,OAAO,UAAU,SAAS,GAAG;AAC/B,iBAAO,QAAQ;AAAA,YACb;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AAEA,YAAI,OAAO,OAAO,SAAS,GAAG;AAC5B,iBAAO,QAAQ;AAAA,YACb;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AAAA,MACF;AAAA,MACA,gBAAgB,CAAC,OAAO,WAAW,OAAO,QAAQ,OAAO,cAAc;AAAA,MACvE,MAAK;AAAA,MACL;AAAA,MAEA;AAAA,oDAAC,sBAAmB;AAAA,QACnB;AAAA;AAAA;AAAA,EACH;AAEJ;","names":["dictionaries"]}

package/dist/esm/client/IntlayerProvider.mjs

@@ -1,7 +1,10 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { getConfiguration } from "@intlayer/config/client";
-import { useCrossFrameState } from "@intlayer/editor-react";
+import {
+  ChangedContentProvider,
+  useCrossFrameState
+} from "@intlayer/editor-react";
 import {
   createContext,
   useContext,
@@ -47,10 +50,10 @@ const IntlayerProviderContent = ({
     () => ({ locale: currentLocale, setLocale }),
     [currentLocale, setLocale]
   );
-  return /* @__PURE__ */ jsxs(IntlayerClientContext.Provider, { value, children: [
+  return /* @__PURE__ */ jsx(IntlayerClientContext.Provider, { value, children: /* @__PURE__ */ jsxs(ChangedContentProvider, { children: [
     /* @__PURE__ */ jsx(PoweredByMeta, {}),
     children
-  ] });
+  ] }) });
 };
 const IntlayerProvider = (props) => /* @__PURE__ */ jsx(IntlayerEditorProvider, { children: /* @__PURE__ */ jsx(IntlayerProviderContent, { ...props }) });
 export {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration, type Locales } from '@intlayer/config/client';\nimport { useCrossFrameState } from '@intlayer/editor-react';\nimport {\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useMemo,\n  type FC,\n  useState,\n  useCallback,\n} from 'react';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\nimport { PoweredByMeta } from './PoweredByMeta';\nimport { localeCookie, setLocaleCookie } from './useLocaleCookie';\n\ntype IntlayerValue = {\n  locale: Locales;\n  setLocale: (newLocale: Locales) => void;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n  locale: localeCookie ?? getConfiguration().internationalization.defaultLocale,\n  setLocale: () => null,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\nexport type IntlayerProviderProps = PropsWithChildren & {\n  locale?: Locales;\n  setLocale?: (locale: Locales) => void;\n};\n\n/**\n * Provider that store the current locale on the client side\n */\nconst IntlayerProviderContent: FC<IntlayerProviderProps> = ({\n  locale,\n  children,\n  setLocale: setLocaleProp,\n}) => {\n  const { internationalization } = getConfiguration();\n  const { defaultLocale, locales: availableLocales } = internationalization;\n\n  const [currentLocale, setCurrentLocale] = useCrossFrameState(\n    'INTLAYER_CURRENT_LOCALE',\n    locale ?? localeCookie ?? defaultLocale\n  );\n\n  const setLocaleBase = useCallback(\n    (newLocale: Locales) => {\n      if (currentLocale.toString() === newLocale.toString()) return;\n\n      if (!availableLocales.includes(newLocale)) {\n        console.error(`Locale ${locale} is not available`);\n        return;\n      }\n\n      setCurrentLocale(newLocale); // Update state\n      setLocaleCookie(newLocale); // Optionally set cookie for persistence\n    },\n    [availableLocales, currentLocale, locale]\n  );\n\n  const setLocale = useMemo(\n    () => setLocaleProp ?? setLocaleBase,\n    [setLocaleProp, setLocaleBase]\n  );\n\n  const value: IntlayerValue = useMemo<IntlayerValue>(\n    () => ({ locale: currentLocale, setLocale }),\n    [currentLocale, setLocale]\n  );\n\n  return (\n    <IntlayerClientContext.Provider value={value}>\n      <PoweredByMeta />\n      {children}\n    </IntlayerClientContext.Provider>\n  );\n};\n\nexport const IntlayerProvider: FC<IntlayerProviderProps> = (props) => (\n  <IntlayerEditorProvider>\n    <IntlayerProviderContent {...props} />\n  </IntlayerEditorProvider>\n);\n"],"mappings":";AAkFI,SACE,KADF;AAhFJ,SAAS,wBAAsC;AAC/C,SAAS,0BAA0B;AACnC;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,EAGA;AAAA,OACK;AACP,SAAS,8BAA8B;AACvC,SAAS,qBAAqB;AAC9B,SAAS,cAAc,uBAAuB;AAUvC,MAAM,wBAAwB,cAA6B;AAAA,EAChE,QAAQ,gBAAgB,iBAAiB,EAAE,qBAAqB;AAAA,EAChE,WAAW,MAAM;AACnB,CAAC;AAKM,MAAM,qBAAqB,MAAM,WAAW,qBAAqB;AAUxE,MAAM,0BAAqD,CAAC;AAAA,EAC1D;AAAA,EACA;AAAA,EACA,WAAW;AACb,MAAM;AACJ,QAAM,EAAE,qBAAqB,IAAI,iBAAiB;AAClD,QAAM,EAAE,eAAe,SAAS,iBAAiB,IAAI;AAErD,QAAM,CAAC,eAAe,gBAAgB,IAAI;AAAA,IACxC;AAAA,IACA,UAAU,gBAAgB;AAAA,EAC5B;AAEA,QAAM,gBAAgB;AAAA,IACpB,CAAC,cAAuB;AACtB,UAAI,cAAc,SAAS,MAAM,UAAU,SAAS,EAAG;AAEvD,UAAI,CAAC,iBAAiB,SAAS,SAAS,GAAG;AACzC,gBAAQ,MAAM,UAAU,MAAM,mBAAmB;AACjD;AAAA,MACF;AAEA,uBAAiB,SAAS;AAC1B,sBAAgB,SAAS;AAAA,IAC3B;AAAA,IACA,CAAC,kBAAkB,eAAe,MAAM;AAAA,EAC1C;AAEA,QAAM,YAAY;AAAA,IAChB,MAAM,iBAAiB;AAAA,IACvB,CAAC,eAAe,aAAa;AAAA,EAC/B;AAEA,QAAM,QAAuB;AAAA,IAC3B,OAAO,EAAE,QAAQ,eAAe,UAAU;AAAA,IAC1C,CAAC,eAAe,SAAS;AAAA,EAC3B;AAEA,SACE,qBAAC,sBAAsB,UAAtB,EAA+B,OAC9B;AAAA,wBAAC,iBAAc;AAAA,IACd;AAAA,KACH;AAEJ;AAEO,MAAM,mBAA8C,CAAC,UAC1D,oBAAC,0BACC,8BAAC,2BAAyB,GAAG,OAAO,GACtC;","names":[]}
+{"version":3,"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration, type Locales } from '@intlayer/config/client';\nimport {\n  ChangedContentProvider,\n  useCrossFrameState,\n} from '@intlayer/editor-react';\nimport {\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useMemo,\n  type FC,\n  useCallback,\n} from 'react';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\nimport { PoweredByMeta } from './PoweredByMeta';\nimport { localeCookie, setLocaleCookie } from './useLocaleCookie';\n\ntype IntlayerValue = {\n  locale: Locales;\n  setLocale: (newLocale: Locales) => void;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n  locale: localeCookie ?? getConfiguration().internationalization.defaultLocale,\n  setLocale: () => null,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\nexport type IntlayerProviderProps = PropsWithChildren & {\n  locale?: Locales;\n  setLocale?: (locale: Locales) => void;\n};\n\n/**\n * Provider that store the current locale on the client side\n */\nconst IntlayerProviderContent: FC<IntlayerProviderProps> = ({\n  locale,\n  children,\n  setLocale: setLocaleProp,\n}) => {\n  const { internationalization } = getConfiguration();\n  const { defaultLocale, locales: availableLocales } = internationalization;\n\n  const [currentLocale, setCurrentLocale] = useCrossFrameState(\n    'INTLAYER_CURRENT_LOCALE',\n    locale ?? localeCookie ?? defaultLocale\n  );\n\n  const setLocaleBase = useCallback(\n    (newLocale: Locales) => {\n      if (currentLocale.toString() === newLocale.toString()) return;\n\n      if (!availableLocales.includes(newLocale)) {\n        console.error(`Locale ${locale} is not available`);\n        return;\n      }\n\n      setCurrentLocale(newLocale); // Update state\n      setLocaleCookie(newLocale); // Optionally set cookie for persistence\n    },\n    [availableLocales, currentLocale, locale]\n  );\n\n  const setLocale = useMemo(\n    () => setLocaleProp ?? setLocaleBase,\n    [setLocaleProp, setLocaleBase]\n  );\n\n  const value: IntlayerValue = useMemo<IntlayerValue>(\n    () => ({ locale: currentLocale, setLocale }),\n    [currentLocale, setLocale]\n  );\n\n  return (\n    <IntlayerClientContext.Provider value={value}>\n      <ChangedContentProvider>\n        <PoweredByMeta />\n        {children}\n      </ChangedContentProvider>\n    </IntlayerClientContext.Provider>\n  );\n};\n\nexport const IntlayerProvider: FC<IntlayerProviderProps> = (props) => (\n  <IntlayerEditorProvider>\n    <IntlayerProviderContent {...props} />\n  </IntlayerEditorProvider>\n);\n"],"mappings":";AAqFM,SACE,KADF;AAnFN,SAAS,wBAAsC;AAC/C;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,OACK;AACP,SAAS,8BAA8B;AACvC,SAAS,qBAAqB;AAC9B,SAAS,cAAc,uBAAuB;AAUvC,MAAM,wBAAwB,cAA6B;AAAA,EAChE,QAAQ,gBAAgB,iBAAiB,EAAE,qBAAqB;AAAA,EAChE,WAAW,MAAM;AACnB,CAAC;AAKM,MAAM,qBAAqB,MAAM,WAAW,qBAAqB;AAUxE,MAAM,0BAAqD,CAAC;AAAA,EAC1D;AAAA,EACA;AAAA,EACA,WAAW;AACb,MAAM;AACJ,QAAM,EAAE,qBAAqB,IAAI,iBAAiB;AAClD,QAAM,EAAE,eAAe,SAAS,iBAAiB,IAAI;AAErD,QAAM,CAAC,eAAe,gBAAgB,IAAI;AAAA,IACxC;AAAA,IACA,UAAU,gBAAgB;AAAA,EAC5B;AAEA,QAAM,gBAAgB;AAAA,IACpB,CAAC,cAAuB;AACtB,UAAI,cAAc,SAAS,MAAM,UAAU,SAAS,EAAG;AAEvD,UAAI,CAAC,iBAAiB,SAAS,SAAS,GAAG;AACzC,gBAAQ,MAAM,UAAU,MAAM,mBAAmB;AACjD;AAAA,MACF;AAEA,uBAAiB,SAAS;AAC1B,sBAAgB,SAAS;AAAA,IAC3B;AAAA,IACA,CAAC,kBAAkB,eAAe,MAAM;AAAA,EAC1C;AAEA,QAAM,YAAY;AAAA,IAChB,MAAM,iBAAiB;AAAA,IACvB,CAAC,eAAe,aAAa;AAAA,EAC/B;AAEA,QAAM,QAAuB;AAAA,IAC3B,OAAO,EAAE,QAAQ,eAAe,UAAU;AAAA,IAC1C,CAAC,eAAe,SAAS;AAAA,EAC3B;AAEA,SACE,oBAAC,sBAAsB,UAAtB,EAA+B,OAC9B,+BAAC,0BACC;AAAA,wBAAC,iBAAc;AAAA,IACd;AAAA,KACH,GACF;AAEJ;AAEO,MAAM,mBAA8C,CAAC,UAC1D,oBAAC,0BACC,8BAAC,2BAAyB,GAAG,OAAO,GACtC;","names":[]}

package/dist/esm/client/useIntlayer.mjs

@@ -1,12 +1,18 @@
 "use client";
+import { useChangedContent } from "@intlayer/editor-react";
 import { useContext } from "react";
+import { getDictionary } from "../getDictionary.mjs";
 import {
   getIntlayer
 } from "../getIntlayer.mjs";
 import { IntlayerClientContext } from "./IntlayerProvider.mjs";
 const useIntlayer = (key, locale, isRenderEditor = true) => {
   const { locale: currentLocale } = useContext(IntlayerClientContext);
+  const { changedContent } = useChangedContent();
   const localeTarget = locale ?? currentLocale;
+  if (changedContent?.[key]) {
+    return getDictionary(key, localeTarget, isRenderEditor);
+  }
   return getIntlayer(key, localeTarget, isRenderEditor);
 };
 export {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/client/useIntlayer.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport { useContext } from 'react';\nimport {\n  type DictionaryKeys,\n  getIntlayer,\n  type UseIntlayerEditable,\n} from '../getIntlayer';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useIntlayer: UseIntlayerEditable = <T extends DictionaryKeys>(\n  key: T,\n  locale?: Locales,\n  isRenderEditor = true\n) => {\n  const { locale: currentLocale } = useContext(IntlayerClientContext);\n  const localeTarget = locale ?? currentLocale;\n\n  return getIntlayer(key, localeTarget, isRenderEditor);\n};\n"],"mappings":";AAGA,SAAS,kBAAkB;AAC3B;AAAA,EAEE;AAAA,OAEK;AACP,SAAS,6BAA6B;AAO/B,MAAM,cAAmC,CAC9C,KACA,QACA,iBAAiB,SACd;AACH,QAAM,EAAE,QAAQ,cAAc,IAAI,WAAW,qBAAqB;AAClE,QAAM,eAAe,UAAU;AAE/B,SAAO,YAAY,KAAK,cAAc,cAAc;AACtD;","names":[]}
+{"version":3,"sources":["../../../src/client/useIntlayer.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport { useChangedContent } from '@intlayer/editor-react';\nimport { useContext } from 'react';\nimport { getDictionary } from '../getDictionary';\nimport {\n  type DictionaryKeys,\n  getIntlayer,\n  type UseIntlayerEditable,\n} from '../getIntlayer';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useIntlayer: UseIntlayerEditable = <T extends DictionaryKeys>(\n  key: T,\n  locale?: Locales,\n  isRenderEditor = true\n) => {\n  const { locale: currentLocale } = useContext(IntlayerClientContext);\n  const { changedContent } = useChangedContent();\n  const localeTarget = locale ?? currentLocale;\n\n  if (changedContent?.[key]) {\n    return getDictionary(key, localeTarget, isRenderEditor);\n  }\n\n  return getIntlayer(key, localeTarget, isRenderEditor);\n};\n"],"mappings":";AAGA,SAAS,yBAAyB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,qBAAqB;AAC9B;AAAA,EAEE;AAAA,OAEK;AACP,SAAS,6BAA6B;AAO/B,MAAM,cAAmC,CAC9C,KACA,QACA,iBAAiB,SACd;AACH,QAAM,EAAE,QAAQ,cAAc,IAAI,WAAW,qBAAqB;AAClE,QAAM,EAAE,eAAe,IAAI,kBAAkB;AAC7C,QAAM,eAAe,UAAU;AAE/B,MAAI,iBAAiB,GAAG,GAAG;AACzB,WAAO,cAAc,KAAK,cAAc,cAAc;AAAA,EACxD;AAEA,SAAO,YAAY,KAAK,cAAc,cAAc;AACtD;","names":[]}

package/dist/esm/editor/IntlayerEditorProvider.mjs

@@ -1,5 +1,6 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { IntlayerEventListener } from "@intlayer/api";
 import { getConfiguration } from "@intlayer/config/client";
 import dictionaries from "@intlayer/dictionaries-entry";
 import {
@@ -7,7 +8,8 @@ import {
   useCrossURLPathState,
   useDictionariesRecordActions,
   useIframeClickInterceptor,
-  useEditorEnabled
+  useEditorEnabled,
+  useChangedContentActions
 } from "@intlayer/editor-react";
 import { useEffect } from "react";
 const IntlayerEditorHooksEnabled = () => {
@@ -20,6 +22,17 @@ const IntlayerEditorHooksEnabled = () => {
     setLocaleDictionaries(dictionaries);
   }, [setLocaleDictionaries]);
   useIframeClickInterceptor();
+  const { setChangedContent } = useChangedContentActions();
+  const { editor } = getConfiguration();
+  const eventSource = new IntlayerEventListener();
+  useEffect(() => {
+    if (!editor.hotReload) return;
+    if (!editor.clientId) return;
+    if (!editor.clientSecret) return;
+    eventSource.initialize();
+    eventSource.onDictionaryChange = (dictionary) => setChangedContent(dictionary.key, dictionary.content);
+    return () => eventSource.cleanup();
+  }, []);
   return /* @__PURE__ */ jsx(Fragment, {});
 };
 const IntlayerEditorHook = () => {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\n'use client';\n\nimport { getConfiguration } from '@intlayer/config/client';\n/**\n * @intlayer/dictionaries-entry is a package that only returns the dictionary entry path.\n * Using an external package allow to alias it in the bundle configuration (such as webpack).\n * The alias allow hot reload the app (such as nextjs) on any dictionary change.\n */\nimport dictionaries from '@intlayer/dictionaries-entry';\nimport {\n  EditorProvider,\n  useCrossURLPathState,\n  useDictionariesRecordActions,\n  useIframeClickInterceptor,\n  useEditorEnabled,\n} from '@intlayer/editor-react';\nimport { useEffect, type FC, type PropsWithChildren } from 'react';\n\nconst IntlayerEditorHooksEnabled: FC = () => {\n  /**\n   * URL Messages\n   */\n  useCrossURLPathState(undefined, {\n    receive: false,\n    emit: true,\n  });\n\n  /**\n   * Locale Dictionaries Messages\n   */\n  const { setLocaleDictionaries } = useDictionariesRecordActions();\n\n  useEffect(() => {\n    setLocaleDictionaries(dictionaries);\n  }, [setLocaleDictionaries]);\n\n  /**\n   * Click Messages\n   */\n  useIframeClickInterceptor();\n\n  return <></>;\n};\n\nconst IntlayerEditorHook: FC = () => {\n  const { enabled } = useEditorEnabled();\n\n  return enabled ? <IntlayerEditorHooksEnabled /> : <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n  const configuration = getConfiguration();\n\n  const { editor } = configuration;\n\n  return (\n    <EditorProvider\n      postMessage={(data: any) => {\n        if (typeof window === 'undefined') return;\n\n        if (editor.applicationURL.length > 0) {\n          window?.postMessage(\n            data,\n            // Use to restrict the origin of the editor for security reasons.\n            // Correspond to the current application URL to synchronize the locales states.\n            editor.applicationURL\n          );\n        }\n        if (editor.editorURL.length > 0) {\n          window.parent?.postMessage(\n            data,\n            // Use to restrict the origin of the editor for security reasons.\n            // Correspond to the editor URL to synchronize the locales states.\n            editor.editorURL\n          );\n        }\n\n        if (editor.cmsURL.length > 0) {\n          window.parent?.postMessage(\n            data,\n            // Use to restrict the origin of the CMS for security reasons.\n            // Correspond to the CMS URL.\n            editor.cmsURL\n          );\n        }\n      }}\n      allowedOrigins={[editor.editorURL, editor.cmsURL, editor.applicationURL]}\n      mode=\"client\"\n      configuration={configuration}\n    >\n      <IntlayerEditorHook />\n      {children}\n    </EditorProvider>\n  );\n};\n"],"mappings":";AA2CS,wBAeL,YAfK;AAvCT,SAAS,wBAAwB;AAMjC,OAAO,kBAAkB;AACzB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,iBAAkD;AAE3D,MAAM,6BAAiC,MAAM;AAI3C,uBAAqB,QAAW;AAAA,IAC9B,SAAS;AAAA,IACT,MAAM;AAAA,EACR,CAAC;AAKD,QAAM,EAAE,sBAAsB,IAAI,6BAA6B;AAE/D,YAAU,MAAM;AACd,0BAAsB,YAAY;AAAA,EACpC,GAAG,CAAC,qBAAqB,CAAC;AAK1B,4BAA0B;AAE1B,SAAO,gCAAE;AACX;AAEA,MAAM,qBAAyB,MAAM;AACnC,QAAM,EAAE,QAAQ,IAAI,iBAAiB;AAErC,SAAO,UAAU,oBAAC,8BAA2B,IAAK,gCAAE;AACtD;AAEO,MAAM,yBAAgD,CAAC,EAAE,SAAS,MAAM;AAC7E,QAAM,gBAAgB,iBAAiB;AAEvC,QAAM,EAAE,OAAO,IAAI;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAa,CAAC,SAAc;AAC1B,YAAI,OAAO,WAAW,YAAa;AAEnC,YAAI,OAAO,eAAe,SAAS,GAAG;AACpC,kBAAQ;AAAA,YACN;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AACA,YAAI,OAAO,UAAU,SAAS,GAAG;AAC/B,iBAAO,QAAQ;AAAA,YACb;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AAEA,YAAI,OAAO,OAAO,SAAS,GAAG;AAC5B,iBAAO,QAAQ;AAAA,YACb;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AAAA,MACF;AAAA,MACA,gBAAgB,CAAC,OAAO,WAAW,OAAO,QAAQ,OAAO,cAAc;AAAA,MACvE,MAAK;AAAA,MACL;AAAA,MAEA;AAAA,4BAAC,sBAAmB;AAAA,QACnB;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\n'use client';\n\nimport { IntlayerEventListener } from '@intlayer/api';\nimport { getConfiguration } from '@intlayer/config/client';\n/**\n * @intlayer/dictionaries-entry is a package that only returns the dictionary entry path.\n * Using an external package allow to alias it in the bundle configuration (such as webpack).\n * The alias allow hot reload the app (such as nextjs) on any dictionary change.\n */\nimport dictionaries from '@intlayer/dictionaries-entry';\nimport {\n  EditorProvider,\n  useCrossURLPathState,\n  useDictionariesRecordActions,\n  useIframeClickInterceptor,\n  useEditorEnabled,\n  useChangedContentActions,\n} from '@intlayer/editor-react';\nimport { useEffect, type FC, type PropsWithChildren } from 'react';\n\nconst IntlayerEditorHooksEnabled: FC = () => {\n  /**\n   * URL Messages\n   */\n  useCrossURLPathState(undefined, {\n    receive: false,\n    emit: true,\n  });\n\n  /**\n   * Locale Dictionaries Messages\n   */\n  const { setLocaleDictionaries } = useDictionariesRecordActions();\n\n  useEffect(() => {\n    setLocaleDictionaries(dictionaries);\n  }, [setLocaleDictionaries]);\n\n  /**\n   * Click Messages\n   */\n  useIframeClickInterceptor();\n\n  /**\n   * Hot reloading\n   */\n  const { setChangedContent } = useChangedContentActions();\n  const { editor } = getConfiguration();\n  const eventSource = new IntlayerEventListener();\n\n  useEffect(() => {\n    if (!editor.hotReload) return;\n    if (!editor.clientId) return;\n    if (!editor.clientSecret) return;\n\n    eventSource.initialize();\n\n    eventSource.onDictionaryChange = (dictionary) =>\n      setChangedContent(dictionary.key, dictionary.content);\n\n    return () => eventSource.cleanup();\n  }, []);\n\n  return <></>;\n};\n\nconst IntlayerEditorHook: FC = () => {\n  const { enabled } = useEditorEnabled();\n\n  return enabled ? <IntlayerEditorHooksEnabled /> : <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n  const configuration = getConfiguration();\n\n  const { editor } = configuration;\n\n  return (\n    <EditorProvider\n      postMessage={(data: any) => {\n        if (typeof window === 'undefined') return;\n\n        if (editor.applicationURL.length > 0) {\n          window?.postMessage(\n            data,\n            // Use to restrict the origin of the editor for security reasons.\n            // Correspond to the current application URL to synchronize the locales states.\n            editor.applicationURL\n          );\n        }\n        if (editor.editorURL.length > 0) {\n          window.parent?.postMessage(\n            data,\n            // Use to restrict the origin of the editor for security reasons.\n            // Correspond to the editor URL to synchronize the locales states.\n            editor.editorURL\n          );\n        }\n\n        if (editor.cmsURL.length > 0) {\n          window.parent?.postMessage(\n            data,\n            // Use to restrict the origin of the CMS for security reasons.\n            // Correspond to the CMS URL.\n            editor.cmsURL\n          );\n        }\n      }}\n      allowedOrigins={[editor.editorURL, editor.cmsURL, editor.applicationURL]}\n      mode=\"client\"\n      configuration={configuration}\n    >\n      <IntlayerEditorHook />\n      {children}\n    </EditorProvider>\n  );\n};\n"],"mappings":";AAiES,wBAeL,YAfK;AA7DT,SAAS,6BAA6B;AACtC,SAAS,wBAAwB;AAMjC,OAAO,kBAAkB;AACzB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,iBAAkD;AAE3D,MAAM,6BAAiC,MAAM;AAI3C,uBAAqB,QAAW;AAAA,IAC9B,SAAS;AAAA,IACT,MAAM;AAAA,EACR,CAAC;AAKD,QAAM,EAAE,sBAAsB,IAAI,6BAA6B;AAE/D,YAAU,MAAM;AACd,0BAAsB,YAAY;AAAA,EACpC,GAAG,CAAC,qBAAqB,CAAC;AAK1B,4BAA0B;AAK1B,QAAM,EAAE,kBAAkB,IAAI,yBAAyB;AACvD,QAAM,EAAE,OAAO,IAAI,iBAAiB;AACpC,QAAM,cAAc,IAAI,sBAAsB;AAE9C,YAAU,MAAM;AACd,QAAI,CAAC,OAAO,UAAW;AACvB,QAAI,CAAC,OAAO,SAAU;AACtB,QAAI,CAAC,OAAO,aAAc;AAE1B,gBAAY,WAAW;AAEvB,gBAAY,qBAAqB,CAAC,eAChC,kBAAkB,WAAW,KAAK,WAAW,OAAO;AAEtD,WAAO,MAAM,YAAY,QAAQ;AAAA,EACnC,GAAG,CAAC,CAAC;AAEL,SAAO,gCAAE;AACX;AAEA,MAAM,qBAAyB,MAAM;AACnC,QAAM,EAAE,QAAQ,IAAI,iBAAiB;AAErC,SAAO,UAAU,oBAAC,8BAA2B,IAAK,gCAAE;AACtD;AAEO,MAAM,yBAAgD,CAAC,EAAE,SAAS,MAAM;AAC7E,QAAM,gBAAgB,iBAAiB;AAEvC,QAAM,EAAE,OAAO,IAAI;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAa,CAAC,SAAc;AAC1B,YAAI,OAAO,WAAW,YAAa;AAEnC,YAAI,OAAO,eAAe,SAAS,GAAG;AACpC,kBAAQ;AAAA,YACN;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AACA,YAAI,OAAO,UAAU,SAAS,GAAG;AAC/B,iBAAO,QAAQ;AAAA,YACb;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AAEA,YAAI,OAAO,OAAO,SAAS,GAAG;AAC5B,iBAAO,QAAQ;AAAA,YACb;AAAA;AAAA;AAAA,YAGA,OAAO;AAAA,UACT;AAAA,QACF;AAAA,MACF;AAAA,MACA,gBAAgB,CAAC,OAAO,WAAW,OAAO,QAAQ,OAAO,cAAc;AAAA,MACvE,MAAK;AAAA,MACL;AAAA,MAEA;AAAA,4BAAC,sBAAmB;AAAA,QACnB;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/types/client/IntlayerProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IntlayerProvider.d.ts","sourceRoot":"","sources":["../../../src/client/IntlayerProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAoB,KAAK,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAEzE,OAAO,EACL,KAAK,iBAAiB,EAItB,KAAK,EAAE,EAGR,MAAM,OAAO,CAAC;AAKf,KAAK,aAAa,GAAG;IACnB,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,wCAGhC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,kBAAkB,qBAA0C,CAAC;AAE1E,MAAM,MAAM,qBAAqB,GAAG,iBAAiB,GAAG;IACtD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CACvC,CAAC;AAmDF,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAItD,CAAC"}
+{"version":3,"file":"IntlayerProvider.d.ts","sourceRoot":"","sources":["../../../src/client/IntlayerProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAoB,KAAK,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAKzE,OAAO,EACL,KAAK,iBAAiB,EAItB,KAAK,EAAE,EAER,MAAM,OAAO,CAAC;AAKf,KAAK,aAAa,GAAG;IACnB,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,wCAGhC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,kBAAkB,qBAA0C,CAAC;AAE1E,MAAM,MAAM,qBAAqB,GAAG,iBAAiB,GAAG;IACtD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CACvC,CAAC;AAqDF,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAItD,CAAC"}

package/dist/types/client/useIntlayer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useIntlayer.d.ts","sourceRoot":"","sources":["../../../src/client/useIntlayer.ts"],"names":[],"mappings":"AAIA,OAAO,EAGL,KAAK,mBAAmB,EACzB,MAAM,gBAAgB,CAAC;AAGxB;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,mBASzB,CAAC"}
+{"version":3,"file":"useIntlayer.d.ts","sourceRoot":"","sources":["../../../src/client/useIntlayer.ts"],"names":[],"mappings":"AAMA,OAAO,EAGL,KAAK,mBAAmB,EACzB,MAAM,gBAAgB,CAAC;AAGxB;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,mBAczB,CAAC"}

package/dist/types/editor/IntlayerEditorProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IntlayerEditorProvider.d.ts","sourceRoot":"","sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAa,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAkCnE,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,iBAAiB,CA4CxD,CAAC"}
+{"version":3,"file":"IntlayerEditorProvider.d.ts","sourceRoot":"","sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAa,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAsDnE,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,iBAAiB,CA4CxD,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-intlayer",
-  "version": "4.1.8",
+  "version": "4.1.10",
   "private": false,
   "description": "Easily internationalize i18n your React applications with type-safe multilingual content management.",
   "keywords": [
@@ -68,11 +68,11 @@
   ],
   "dependencies": {
     "js-cookie": "^3.0.5",
-    "@intlayer/api": "4.1.8",
-    "@intlayer/config": "4.1.8",
-    "@intlayer/dictionaries-entry": "4.1.8",
-    "@intlayer/core": "4.1.8",
-    "@intlayer/editor-react": "4.1.8"
+    "@intlayer/api": "4.1.10",
+    "@intlayer/config": "4.1.10",
+    "@intlayer/core": "4.1.10",
+    "@intlayer/dictionaries-entry": "4.1.10",
+    "@intlayer/editor-react": "4.1.10"
   },
   "devDependencies": {
     "@craco/types": "^7.1.0",
@@ -87,21 +87,21 @@
     "tsc-alias": "^1.8.10",
     "tsup": "^8.3.5",
     "typescript": "^5.7.3",
-    "@intlayer/backend": "4.1.8",
-    "@utils/eslint-config": "1.0.4",
+    "@intlayer/backend": "4.1.10",
     "@utils/ts-config": "1.0.4",
     "@utils/ts-config-types": "1.0.4",
-    "@utils/tsup-config": "1.0.4"
+    "@utils/tsup-config": "1.0.4",
+    "@utils/eslint-config": "1.0.4"
   },
   "peerDependencies": {
     "react": ">=16.0.0",
     "react-dom": ">=16.0.0",
-    "@intlayer/api": "4.1.8",
-    "@intlayer/config": "4.1.8",
-    "@intlayer/editor-react": "4.1.8",
-    "@intlayer/core": "4.1.8",
-    "@intlayer/dictionaries-entry": "4.1.8",
-    "intlayer": "4.1.8"
+    "@intlayer/api": "4.1.10",
+    "@intlayer/config": "4.1.10",
+    "@intlayer/dictionaries-entry": "4.1.10",
+    "@intlayer/editor-react": "4.1.10",
+    "intlayer": "4.1.10",
+    "@intlayer/core": "4.1.10"
   },
   "engines": {
     "node": ">=14.18"