intlayer-editor 3.5.4 → 3.5.5

package/README.md

@@ -1,6 +1,6 @@
 <div align="center">
   <a href="https://www.npmjs.com/package/intlayer">
-    <img src="docs/assets/logo.png" width="500" alt="intlayer" />
+    <img src="https://raw.githubusercontent.com/aymericzip/intlayer/572ae9c9acafb74307b81530c1931a8e98990aef/docs/assets/logo.png" width="500" alt="intlayer" />
   </a>
 </div>
 
@@ -29,19 +29,19 @@ For more details on how to install the package, see the relevant section below:
 
 ### Integrating with Next.js
 
-For integration with Next.js, refer to the [setup guide](https://github.com/aymericzip/intlayer/blob/main/docs/docs/intlayer_with_nextjs_15.md).
+For integration with Next.js, refer to the [setup guide](https://github.com/aymericzip/intlayer/blob/main/docs/en/intlayer_with_nextjs_15.md).
 
 ### Integrating with Create React App
 
-For integration with Create React App, refer to the [setup guide](https://github.com/aymericzip/intlayer/blob/main/docs/docs/intlayer_with_create_react_app.md
+For integration with Create React App, refer to the [setup guide](https://github.com/aymericzip/intlayer/blob/main/docs/en/intlayer_with_create_react_app.md)
 
 ### Integrating with Vite + React
 
-For integration with Vite + React, refer to the [setup guide](https://github.com/aymericzip/intlayer/blob/main/docs/docs/intlayer_with_vite+react.md
+For integration with Vite + React, refer to the [setup guide](https://github.com/aymericzip/intlayer/blob/main/docs/en/intlayer_with_vite+react.md)
 
 ## How Intlayer Editor Works
 
-Each time you make a change using Intlayer Editor, the server automatically inserts your changes into your [Intlayer declaration files](https://github.com/aymericzip/intlayer/blob/main/docs/docs/content_declaration/get_started.mdwherever these files are declared in your project.
+Each time you make a change using Intlayer Editor, the server automatically inserts your changes into your [Intlayer declaration files](https://github.com/aymericzip/intlayer/blob/main/docs/en/content_declaration/get_started.md) wherever these files are declared in your project.
 
 In this way, you don't have to worry about where the file is declared or about finding your key in your dictionary collection.
 
@@ -83,7 +83,7 @@ const config: IntlayerConfig = {
 
 > If you don't have a client ID and client secret, you can obtain them by creating a new client in the [Intlayer Dashboard - Projects](https://intlayer.org/dashboard/projects).
 
-> To see all available parameters, refer to the [configuration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/configuration.md
+> To see all available parameters, refer to the [configuration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/en/configuration.md)
 
 ### 2. Insert the Intlayer Editor Provider in your application
 

package/dist/cjs/ContentSelectorWrapper.cjs

@@ -28,23 +28,37 @@ var import_design_system = require("@intlayer/design-system");
 var import_react = require("react");
 var import_IntlayerEditorProvider = require('./IntlayerEditorProvider.cjs');
 var import_useDictionaryEditionDrawer = require('./DictionaryEditionDrawer/useDictionaryEditionDrawer.cjs');
+var import_shallow = require("zustand/shallow");
 const ContentSelectorWrapper = ({
   children,
-  dictionaryId,
+  dictionaryKey,
   dictionaryPath,
   keyPath
 }) => {
-  const { open, getEditedContentValue, focusedContent, isOpen } = (0, import_useDictionaryEditionDrawer.useDictionaryEditionDrawer)(dictionaryId);
-  const editedValue = getEditedContentValue(dictionaryId, keyPath);
+  const { open, getEditedContentValue, focusedContent, isOpen } = (0, import_useDictionaryEditionDrawer.useDictionaryEditionDrawer)(dictionaryKey);
+  const { editedContent } = (0, import_design_system.useEditedContentStore)(
+    (0, import_shallow.useShallow)((s) => ({
+      editedContent: s.editedContent
+    }))
+  );
+  const editedValue = (0, import_react.useMemo)(
+    () => getEditedContentValue(dictionaryKey, keyPath),
+    [
+      editedContent[dictionaryKey],
+      dictionaryKey,
+      keyPath,
+      getEditedContentValue
+    ]
+  );
   const { isEditorEnabled } = (0, import_IntlayerEditorProvider.useIntlayerEditorContext)();
   const [displayedChildren, setDisplayedChildren] = (0, import_react.useState)(children);
   const handleSelect = (0, import_react.useCallback)(
     () => open({
-      dictionaryId,
+      dictionaryKey,
       dictionaryPath,
       keyPath
     }),
-    [dictionaryId, dictionaryPath, keyPath, open]
+    [dictionaryKey, dictionaryPath, keyPath, open]
   );
   const isSelected = (0, import_react.useMemo)(
     () => (isOpen && (focusedContent?.keyPath?.length ?? 0) > 0 && (0, import_core.isSameKeyPath)(focusedContent?.keyPath ?? [], keyPath)) ?? false,
@@ -53,8 +67,10 @@ const ContentSelectorWrapper = ({
   (0, import_react.useEffect)(() => {
     if (isEditorEnabled && editedValue && typeof editedValue === "string") {
       setDisplayedChildren(editedValue);
+    } else {
+      setDisplayedChildren(children);
     }
-  }, [editedValue, isEditorEnabled]);
+  }, [editedValue, isEditorEnabled, focusedContent, children]);
   if (!isEditorEnabled) {
     return children;
   }

package/dist/cjs/ContentSelectorWrapper.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport { isSameKeyPath, type KeyPath } from '@intlayer/core';\nimport { ContentSelector } from '@intlayer/design-system';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  useMemo,\n  type FC,\n  type ReactNode,\n} from 'react';\nimport { useIntlayerEditorContext } from './IntlayerEditorProvider';\nimport { useDictionaryEditionDrawer } from './DictionaryEditionDrawer/useDictionaryEditionDrawer';\n\ntype ContentSelectorWrapperProps = {\n  children: ReactNode;\n  dictionaryId: string;\n  dictionaryPath: string;\n  keyPath: KeyPath[];\n};\n\nexport const ContentSelectorWrapper: FC<ContentSelectorWrapperProps> = ({\n  children,\n  dictionaryId,\n  dictionaryPath,\n  keyPath,\n}) => {\n  const { open, getEditedContentValue, focusedContent, isOpen } =\n    useDictionaryEditionDrawer(dictionaryId);\n  const editedValue = getEditedContentValue(dictionaryId, keyPath);\n  const { isEditorEnabled } = useIntlayerEditorContext();\n  const [displayedChildren, setDisplayedChildren] =\n    useState<ReactNode>(children);\n\n  const handleSelect = useCallback(\n    () =>\n      open({\n        dictionaryId,\n        dictionaryPath,\n        keyPath,\n      }),\n    [dictionaryId, dictionaryPath, keyPath, open]\n  );\n\n  const isSelected = useMemo(\n    () =>\n      (isOpen &&\n        (focusedContent?.keyPath?.length ?? 0) > 0 &&\n        isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ??\n      false,\n    [focusedContent, isOpen, keyPath]\n  );\n\n  useEffect(() => {\n    // Use useEffect to avoid 'Text content does not match server-rendered HTML' error\n    if (isEditorEnabled && editedValue && typeof editedValue === 'string') {\n      setDisplayedChildren(editedValue);\n    }\n  }, [editedValue, isEditorEnabled]);\n\n  if (!isEditorEnabled) {\n    return children;\n  }\n\n  return (\n    <ContentSelector onSelect={handleSelect} isSelecting={isSelected}>\n      {displayedChildren}\n    </ContentSelector>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkEI;AAhEJ,kBAA4C;AAC5C,2BAAgC;AAChC,mBAOO;AACP,oCAAyC;AACzC,wCAA2C;AASpC,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,uBAAuB,gBAAgB,OAAO,QAC1D,8DAA2B,YAAY;AACzC,QAAM,cAAc,sBAAsB,cAAc,OAAO;AAC/D,QAAM,EAAE,gBAAgB,QAAI,wDAAyB;AACrD,QAAM,CAAC,mBAAmB,oBAAoB,QAC5C,uBAAoB,QAAQ;AAE9B,QAAM,mBAAe;AAAA,IACnB,MACE,KAAK;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACH,CAAC,cAAc,gBAAgB,SAAS,IAAI;AAAA,EAC9C;AAEA,QAAM,iBAAa;AAAA,IACjB,OACG,WACE,gBAAgB,SAAS,UAAU,KAAK,SACzC,2BAAc,gBAAgB,WAAW,CAAC,GAAG,OAAO,MACtD;AAAA,IACF,CAAC,gBAAgB,QAAQ,OAAO;AAAA,EAClC;AAEA,8BAAU,MAAM;AAEd,QAAI,mBAAmB,eAAe,OAAO,gBAAgB,UAAU;AACrE,2BAAqB,WAAW;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,aAAa,eAAe,CAAC;AAEjC,MAAI,CAAC,iBAAiB;AACpB,WAAO;AAAA,EACT;AAEA,SACE,4CAAC,wCAAgB,UAAU,cAAc,aAAa,YACnD,6BACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport { isSameKeyPath, type KeyPath } from '@intlayer/core';\nimport {\n  ContentSelector,\n  useEditedContentStore,\n} from '@intlayer/design-system';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  useMemo,\n  type FC,\n  type ReactNode,\n} from 'react';\nimport { useIntlayerEditorContext } from './IntlayerEditorProvider';\nimport { useDictionaryEditionDrawer } from './DictionaryEditionDrawer/useDictionaryEditionDrawer';\nimport { useShallow } from 'zustand/shallow';\n\ntype ContentSelectorWrapperProps = {\n  children: ReactNode;\n  dictionaryKey: string;\n  dictionaryPath: string;\n  keyPath: KeyPath[];\n};\n\nexport const ContentSelectorWrapper: FC<ContentSelectorWrapperProps> = ({\n  children,\n  dictionaryKey,\n  dictionaryPath,\n  keyPath,\n}) => {\n  const { open, getEditedContentValue, focusedContent, isOpen } =\n    useDictionaryEditionDrawer(dictionaryKey);\n  const { editedContent } = useEditedContentStore(\n    useShallow((s) => ({\n      editedContent: s.editedContent,\n    }))\n  );\n  const editedValue = useMemo(\n    () => getEditedContentValue(dictionaryKey, keyPath),\n    [\n      editedContent[dictionaryKey],\n      dictionaryKey,\n      keyPath,\n      getEditedContentValue,\n    ]\n  );\n  const { isEditorEnabled } = useIntlayerEditorContext();\n  const [displayedChildren, setDisplayedChildren] =\n    useState<ReactNode>(children);\n\n  const handleSelect = useCallback(\n    () =>\n      open({\n        dictionaryKey,\n        dictionaryPath,\n        keyPath,\n      }),\n    [dictionaryKey, dictionaryPath, keyPath, open]\n  );\n\n  const isSelected = useMemo(\n    () =>\n      (isOpen &&\n        (focusedContent?.keyPath?.length ?? 0) > 0 &&\n        isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ??\n      false,\n    [focusedContent, isOpen, keyPath]\n  );\n\n  useEffect(() => {\n    // Use useEffect to avoid 'Text content does not match server-rendered HTML' error\n    if (isEditorEnabled && editedValue && typeof editedValue === 'string') {\n      setDisplayedChildren(editedValue);\n    } else {\n      setDisplayedChildren(children);\n    }\n  }, [editedValue, isEditorEnabled, focusedContent, children]);\n\n  if (!isEditorEnabled) {\n    return children;\n  }\n\n  return (\n    <ContentSelector onSelect={handleSelect} isSelecting={isSelected}>\n      {displayedChildren}\n    </ContentSelector>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqFI;AAnFJ,kBAA4C;AAC5C,2BAGO;AACP,mBAOO;AACP,oCAAyC;AACzC,wCAA2C;AAC3C,qBAA2B;AASpB,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,uBAAuB,gBAAgB,OAAO,QAC1D,8DAA2B,aAAa;AAC1C,QAAM,EAAE,cAAc,QAAI;AAAA,QACxB,2BAAW,CAAC,OAAO;AAAA,MACjB,eAAe,EAAE;AAAA,IACnB,EAAE;AAAA,EACJ;AACA,QAAM,kBAAc;AAAA,IAClB,MAAM,sBAAsB,eAAe,OAAO;AAAA,IAClD;AAAA,MACE,cAAc,aAAa;AAAA,MAC3B;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACA,QAAM,EAAE,gBAAgB,QAAI,wDAAyB;AACrD,QAAM,CAAC,mBAAmB,oBAAoB,QAC5C,uBAAoB,QAAQ;AAE9B,QAAM,mBAAe;AAAA,IACnB,MACE,KAAK;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACH,CAAC,eAAe,gBAAgB,SAAS,IAAI;AAAA,EAC/C;AAEA,QAAM,iBAAa;AAAA,IACjB,OACG,WACE,gBAAgB,SAAS,UAAU,KAAK,SACzC,2BAAc,gBAAgB,WAAW,CAAC,GAAG,OAAO,MACtD;AAAA,IACF,CAAC,gBAAgB,QAAQ,OAAO;AAAA,EAClC;AAEA,8BAAU,MAAM;AAEd,QAAI,mBAAmB,eAAe,OAAO,gBAAgB,UAAU;AACrE,2BAAqB,WAAW;AAAA,IAClC,OAAO;AACL,2BAAqB,QAAQ;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,aAAa,iBAAiB,gBAAgB,QAAQ,CAAC;AAE3D,MAAI,CAAC,iBAAiB;AACpB,WAAO;AAAA,EACT;AAEA,SACE,4CAAC,wCAAgB,UAAU,cAAc,aAAa,YACnD,6BACH;AAEJ;","names":[]}

package/dist/cjs/DictionaryEditionDrawer/DictionaryEditionDrawer.cjs

@@ -43,7 +43,7 @@ var import_shallow = require("zustand/shallow");
 var import_dictionaryListDrawerIdentifier = require('../DictionaryListDrawer/dictionaryListDrawerIdentifier.cjs');
 var import_dictionaryEditionDrawer = __toESM(require('./dictionaryEditionDrawer.content.cjs'));
 var import_useDictionaryEditionDrawer = require('./useDictionaryEditionDrawer.cjs');
-const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) => {
+const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack, isDarkMode }) => {
   const [keyPathEditionModal, setKeyPathEditionModal] = (0, import_react.useState)(null);
   const { setDictionariesRecord, focusedContent } = (0, import_useDictionaryEditionDrawer.useDictionaryEditionDrawer)(identifier);
   const { all: dictionaries } = (0, import_hooks.useGetAllDictionaries)();
@@ -56,9 +56,9 @@ const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) =>
       setDictionariesRecord(dictionaries);
     }
   }, [setDictionariesRecord, dictionaries]);
-  const dictionaryId = focusedContent?.dictionaryId;
-  if (!dictionaryId) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: "No dictionary focused" });
-  const dictionary = dictionaries[dictionaryId];
+  const dictionaryKey = focusedContent?.dictionaryKey;
+  if (!dictionaryKey) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: "No dictionary focused" });
+  const dictionary = dictionaries[dictionaryKey];
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_design_system.Modal,
@@ -77,7 +77,8 @@ const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) =>
           import_design_system.DictionaryFieldEditor,
           {
             dictionary,
-            onClickDictionaryList
+            onClickDictionaryList,
+            isDarkMode
           }
         )
       }
@@ -96,11 +97,12 @@ const DictionaryEditionDrawer = ({
   locale,
   localeList,
   setLocale,
-  dictionaryId
+  dictionaryKey,
+  isDarkMode
 }) => {
   const { backButtonText } = (0, import_react_intlayer.useDictionary)(import_dictionaryEditionDrawer.default);
-  const id = (0, import_useDictionaryEditionDrawer.getDrawerIdentifier)(dictionaryId);
-  const { focusedContent, close } = (0, import_useDictionaryEditionDrawer.useDictionaryEditionDrawer)(dictionaryId);
+  const id = (0, import_useDictionaryEditionDrawer.getDrawerIdentifier)(dictionaryKey);
+  const { focusedContent, close } = (0, import_useDictionaryEditionDrawer.useDictionaryEditionDrawer)(dictionaryKey);
   const { openDictionaryListDrawer } = (0, import_design_system.useRightDrawerStore)((s) => ({
     openDictionaryListDrawer: () => s.open(import_dictionaryListDrawerIdentifier.dictionaryListDrawerIdentifier)
   }));
@@ -111,7 +113,7 @@ const DictionaryEditionDrawer = ({
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_design_system.RightDrawer,
     {
-      title: dictionaryId,
+      title: dictionaryKey,
       identifier: id,
       header: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         import_design_system.LocaleSwitcher,
@@ -131,7 +133,8 @@ const DictionaryEditionDrawer = ({
           focusedContent,
           locale,
           identifier: id,
-          handleOnBack
+          handleOnBack,
+          isDarkMode
         }
       )
     }
@@ -141,8 +144,8 @@ const DictionaryEditionDrawerController = ({ locale, localeList, setLocale }) =>
   const focusedContent = (0, import_design_system.useEditionPanelStore)(
     (0, import_shallow.useShallow)((s) => s.focusedContent)
   );
-  const dictionaryId = focusedContent?.dictionaryId;
-  if (!dictionaryId) {
+  const dictionaryKey = focusedContent?.dictionaryKey;
+  if (!dictionaryKey) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {});
   }
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -151,7 +154,7 @@ const DictionaryEditionDrawerController = ({ locale, localeList, setLocale }) =>
       locale,
       localeList,
       setLocale,
-      dictionaryId
+      dictionaryKey
     }
   );
 };

package/dist/cjs/DictionaryEditionDrawer/DictionaryEditionDrawer.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/DictionaryEditionDrawer/DictionaryEditionDrawer.tsx"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport type { Dictionary, KeyPath } from '@intlayer/core';\nimport {\n  RightDrawer,\n  DictionaryEditor,\n  LocaleSwitcher,\n  Modal,\n  useEditionPanelStore,\n  DictionaryFieldEditor,\n  useRightDrawerStore,\n} from '@intlayer/design-system';\nimport { useGetAllDictionaries } from '@intlayer/design-system/hooks';\nimport { useCallback, useEffect, useState, type FC } from 'react';\nimport { t, useDictionary } from 'react-intlayer';\nimport { useShallow } from 'zustand/shallow';\nimport { dictionaryListDrawerIdentifier } from '../DictionaryListDrawer/dictionaryListDrawerIdentifier';\nimport dictionaryEditionDrawerContent from './dictionaryEditionDrawer.content';\nimport {\n  type FileContent as FileContentWithDictionaryPath,\n  useDictionaryEditionDrawer,\n  getDrawerIdentifier,\n} from './useDictionaryEditionDrawer';\n\ntype DictionaryEditionDrawerContentProps = {\n  focusedContent: FileContentWithDictionaryPath;\n  locale: Locales;\n  identifier: string;\n  handleOnBack: () => void;\n};\n\nexport const DictionaryEditionDrawerContent: FC<\n  DictionaryEditionDrawerContentProps\n> = ({ locale, identifier, handleOnBack }) => {\n  const [keyPathEditionModal, setKeyPathEditionModal] = useState<\n    KeyPath[] | null\n  >(null);\n  const { setDictionariesRecord, focusedContent } =\n    useDictionaryEditionDrawer(identifier);\n  const { all: dictionaries } = useGetAllDictionaries();\n\n  const onClickDictionaryList = useCallback(() => {\n    setKeyPathEditionModal(null);\n    handleOnBack();\n  }, [handleOnBack]);\n\n  useEffect(() => {\n    if (dictionaries) {\n      setDictionariesRecord(dictionaries);\n    }\n  }, [setDictionariesRecord, dictionaries]);\n\n  const dictionaryId = focusedContent?.dictionaryId;\n\n  if (!dictionaryId) return <>No dictionary focused</>;\n\n  const dictionary: Dictionary = dictionaries[dictionaryId];\n\n  return (\n    <>\n      <Modal\n        isOpen={keyPathEditionModal !== null}\n        onClose={() => setKeyPathEditionModal(null)}\n        hasCloseButton\n        title={t({\n          en: 'Edit field',\n          fr: 'Modifier le champ',\n          es: 'Editar campo',\n        })}\n        size=\"xl\"\n        transparency=\"lg\"\n      >\n        {dictionary && (\n          <DictionaryFieldEditor\n            dictionary={dictionary}\n            onClickDictionaryList={onClickDictionaryList}\n          />\n        )}\n      </Modal>\n      <DictionaryEditor\n        dictionary={dictionary}\n        locale={locale}\n        onClickEdit={setKeyPathEditionModal}\n      />\n    </>\n  );\n};\n\ntype DictionaryEditionDrawerProps = DictionaryEditionDrawerControllerProps & {\n  dictionaryId: string;\n};\n\nexport const DictionaryEditionDrawer: FC<DictionaryEditionDrawerProps> = ({\n  locale,\n  localeList,\n  setLocale,\n  dictionaryId,\n}) => {\n  const { backButtonText } = useDictionary(dictionaryEditionDrawerContent);\n  const id = getDrawerIdentifier(dictionaryId);\n\n  const { focusedContent, close } = useDictionaryEditionDrawer(dictionaryId);\n  const { openDictionaryListDrawer } = useRightDrawerStore((s) => ({\n    openDictionaryListDrawer: () => s.open(dictionaryListDrawerIdentifier),\n  }));\n\n  const handleOnBack = () => {\n    close();\n    openDictionaryListDrawer();\n  };\n\n  return (\n    <RightDrawer\n      title={dictionaryId}\n      identifier={id}\n      header={\n        <LocaleSwitcher\n          setLocale={setLocale}\n          locale={locale}\n          localeList={localeList}\n        />\n      }\n      backButton={{\n        onBack: handleOnBack,\n        text: backButtonText,\n      }}\n    >\n      {focusedContent && (\n        <DictionaryEditionDrawerContent\n          focusedContent={focusedContent}\n          locale={locale}\n          identifier={id}\n          handleOnBack={handleOnBack}\n        />\n      )}\n    </RightDrawer>\n  );\n};\n\ntype DictionaryEditionDrawerControllerProps = {\n  locale: Locales;\n  localeList: Locales[];\n  setLocale: (locale: Locales) => void;\n};\n\nexport const DictionaryEditionDrawerController: FC<\n  DictionaryEditionDrawerControllerProps\n> = ({ locale, localeList, setLocale }) => {\n  const focusedContent = useEditionPanelStore(\n    useShallow((s) => s.focusedContent)\n  );\n  const dictionaryId: string | undefined = focusedContent?.dictionaryId;\n\n  if (!dictionaryId) {\n    return <></>;\n  }\n\n  return (\n    <DictionaryEditionDrawer\n      locale={locale}\n      localeList={localeList}\n      setLocale={setLocale}\n      dictionaryId={dictionaryId}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuD4B;AAnD5B,2BAQO;AACP,mBAAsC;AACtC,mBAA0D;AAC1D,4BAAiC;AACjC,qBAA2B;AAC3B,4CAA+C;AAC/C,qCAA2C;AAC3C,wCAIO;AASA,MAAM,iCAET,CAAC,EAAE,QAAQ,YAAY,aAAa,MAAM;AAC5C,QAAM,CAAC,qBAAqB,sBAAsB,QAAI,uBAEpD,IAAI;AACN,QAAM,EAAE,uBAAuB,eAAe,QAC5C,8DAA2B,UAAU;AACvC,QAAM,EAAE,KAAK,aAAa,QAAI,oCAAsB;AAEpD,QAAM,4BAAwB,0BAAY,MAAM;AAC9C,2BAAuB,IAAI;AAC3B,iBAAa;AAAA,EACf,GAAG,CAAC,YAAY,CAAC;AAEjB,8BAAU,MAAM;AACd,QAAI,cAAc;AAChB,4BAAsB,YAAY;AAAA,IACpC;AAAA,EACF,GAAG,CAAC,uBAAuB,YAAY,CAAC;AAExC,QAAM,eAAe,gBAAgB;AAErC,MAAI,CAAC,aAAc,QAAO,2EAAE,mCAAqB;AAEjD,QAAM,aAAyB,aAAa,YAAY;AAExD,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,wBAAwB;AAAA,QAChC,SAAS,MAAM,uBAAuB,IAAI;AAAA,QAC1C,gBAAc;AAAA,QACd,WAAO,yBAAE;AAAA,UACP,IAAI;AAAA,UACJ,IAAI;AAAA,UACJ,IAAI;AAAA,QACN,CAAC;AAAA,QACD,MAAK;AAAA,QACL,cAAa;AAAA,QAEZ,wBACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA;AAAA,QACF;AAAA;AAAA,IAEJ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,aAAa;AAAA;AAAA,IACf;AAAA,KACF;AAEJ;AAMO,MAAM,0BAA4D,CAAC;AAAA,EACxE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,eAAe,QAAI,qCAAc,+BAAAA,OAA8B;AACvE,QAAM,SAAK,uDAAoB,YAAY;AAE3C,QAAM,EAAE,gBAAgB,MAAM,QAAI,8DAA2B,YAAY;AACzE,QAAM,EAAE,yBAAyB,QAAI,0CAAoB,CAAC,OAAO;AAAA,IAC/D,0BAA0B,MAAM,EAAE,KAAK,oEAA8B;AAAA,EACvE,EAAE;AAEF,QAAM,eAAe,MAAM;AACzB,UAAM;AACN,6BAAyB;AAAA,EAC3B;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,QACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA,MAEF,YAAY;AAAA,QACV,QAAQ;AAAA,QACR,MAAM;AAAA,MACR;AAAA,MAEC,4BACC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,YAAY;AAAA,UACZ;AAAA;AAAA,MACF;AAAA;AAAA,EAEJ;AAEJ;AAQO,MAAM,oCAET,CAAC,EAAE,QAAQ,YAAY,UAAU,MAAM;AACzC,QAAM,qBAAiB;AAAA,QACrB,2BAAW,CAAC,MAAM,EAAE,cAAc;AAAA,EACpC;AACA,QAAM,eAAmC,gBAAgB;AAEzD,MAAI,CAAC,cAAc;AACjB,WAAO,2EAAE;AAAA,EACX;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;","names":["dictionaryEditionDrawerContent"]}
+{"version":3,"sources":["../../../src/DictionaryEditionDrawer/DictionaryEditionDrawer.tsx"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport type { Dictionary, KeyPath } from '@intlayer/core';\nimport {\n  RightDrawer,\n  DictionaryEditor,\n  LocaleSwitcher,\n  Modal,\n  useEditionPanelStore,\n  DictionaryFieldEditor,\n  useRightDrawerStore,\n} from '@intlayer/design-system';\nimport { useGetAllDictionaries } from '@intlayer/design-system/hooks';\nimport { useCallback, useEffect, useState, type FC } from 'react';\nimport { t, useDictionary } from 'react-intlayer';\nimport { useShallow } from 'zustand/shallow';\nimport { dictionaryListDrawerIdentifier } from '../DictionaryListDrawer/dictionaryListDrawerIdentifier';\nimport dictionaryEditionDrawerContent from './dictionaryEditionDrawer.content';\nimport {\n  type FileContent as FileContentWithDictionaryPath,\n  useDictionaryEditionDrawer,\n  getDrawerIdentifier,\n} from './useDictionaryEditionDrawer';\n\ntype DictionaryEditionDrawerContentProps = {\n  focusedContent: FileContentWithDictionaryPath;\n  locale: Locales;\n  identifier: string;\n  handleOnBack: () => void;\n  isDarkMode?: boolean;\n};\n\nexport const DictionaryEditionDrawerContent: FC<\n  DictionaryEditionDrawerContentProps\n> = ({ locale, identifier, handleOnBack, isDarkMode }) => {\n  const [keyPathEditionModal, setKeyPathEditionModal] = useState<\n    KeyPath[] | null\n  >(null);\n  const { setDictionariesRecord, focusedContent } =\n    useDictionaryEditionDrawer(identifier);\n  const { all: dictionaries } = useGetAllDictionaries();\n\n  const onClickDictionaryList = useCallback(() => {\n    setKeyPathEditionModal(null);\n    handleOnBack();\n  }, [handleOnBack]);\n\n  useEffect(() => {\n    if (dictionaries) {\n      setDictionariesRecord(dictionaries);\n    }\n  }, [setDictionariesRecord, dictionaries]);\n\n  const dictionaryKey = focusedContent?.dictionaryKey;\n\n  if (!dictionaryKey) return <>No dictionary focused</>;\n\n  const dictionary: Dictionary = dictionaries[dictionaryKey];\n\n  return (\n    <>\n      <Modal\n        isOpen={keyPathEditionModal !== null}\n        onClose={() => setKeyPathEditionModal(null)}\n        hasCloseButton\n        title={t({\n          en: 'Edit field',\n          fr: 'Modifier le champ',\n          es: 'Editar campo',\n        })}\n        size=\"xl\"\n        transparency=\"lg\"\n      >\n        {dictionary && (\n          <DictionaryFieldEditor\n            dictionary={dictionary}\n            onClickDictionaryList={onClickDictionaryList}\n            isDarkMode={isDarkMode}\n          />\n        )}\n      </Modal>\n      <DictionaryEditor\n        dictionary={dictionary}\n        locale={locale}\n        onClickEdit={setKeyPathEditionModal}\n      />\n    </>\n  );\n};\n\ntype DictionaryEditionDrawerProps = DictionaryEditionDrawerControllerProps & {\n  dictionaryKey: string;\n  isDarkMode?: boolean;\n};\n\nexport const DictionaryEditionDrawer: FC<DictionaryEditionDrawerProps> = ({\n  locale,\n  localeList,\n  setLocale,\n  dictionaryKey,\n  isDarkMode,\n}) => {\n  const { backButtonText } = useDictionary(dictionaryEditionDrawerContent);\n  const id = getDrawerIdentifier(dictionaryKey);\n\n  const { focusedContent, close } = useDictionaryEditionDrawer(dictionaryKey);\n  const { openDictionaryListDrawer } = useRightDrawerStore((s) => ({\n    openDictionaryListDrawer: () => s.open(dictionaryListDrawerIdentifier),\n  }));\n\n  const handleOnBack = () => {\n    close();\n    openDictionaryListDrawer();\n  };\n\n  return (\n    <RightDrawer\n      title={dictionaryKey}\n      identifier={id}\n      header={\n        <LocaleSwitcher\n          setLocale={setLocale}\n          locale={locale}\n          localeList={localeList}\n        />\n      }\n      backButton={{\n        onBack: handleOnBack,\n        text: backButtonText,\n      }}\n    >\n      {focusedContent && (\n        <DictionaryEditionDrawerContent\n          focusedContent={focusedContent}\n          locale={locale}\n          identifier={id}\n          handleOnBack={handleOnBack}\n          isDarkMode={isDarkMode}\n        />\n      )}\n    </RightDrawer>\n  );\n};\n\ntype DictionaryEditionDrawerControllerProps = {\n  locale: Locales;\n  localeList: Locales[];\n  setLocale: (locale: Locales) => void;\n};\n\nexport const DictionaryEditionDrawerController: FC<\n  DictionaryEditionDrawerControllerProps\n> = ({ locale, localeList, setLocale }) => {\n  const focusedContent = useEditionPanelStore(\n    useShallow((s) => s.focusedContent)\n  );\n  const dictionaryKey: string | undefined = focusedContent?.dictionaryKey;\n\n  if (!dictionaryKey) {\n    return <></>;\n  }\n\n  return (\n    <DictionaryEditionDrawer\n      locale={locale}\n      localeList={localeList}\n      setLocale={setLocale}\n      dictionaryKey={dictionaryKey}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAwD6B;AApD7B,2BAQO;AACP,mBAAsC;AACtC,mBAA0D;AAC1D,4BAAiC;AACjC,qBAA2B;AAC3B,4CAA+C;AAC/C,qCAA2C;AAC3C,wCAIO;AAUA,MAAM,iCAET,CAAC,EAAE,QAAQ,YAAY,cAAc,WAAW,MAAM;AACxD,QAAM,CAAC,qBAAqB,sBAAsB,QAAI,uBAEpD,IAAI;AACN,QAAM,EAAE,uBAAuB,eAAe,QAC5C,8DAA2B,UAAU;AACvC,QAAM,EAAE,KAAK,aAAa,QAAI,oCAAsB;AAEpD,QAAM,4BAAwB,0BAAY,MAAM;AAC9C,2BAAuB,IAAI;AAC3B,iBAAa;AAAA,EACf,GAAG,CAAC,YAAY,CAAC;AAEjB,8BAAU,MAAM;AACd,QAAI,cAAc;AAChB,4BAAsB,YAAY;AAAA,IACpC;AAAA,EACF,GAAG,CAAC,uBAAuB,YAAY,CAAC;AAExC,QAAM,gBAAgB,gBAAgB;AAEtC,MAAI,CAAC,cAAe,QAAO,2EAAE,mCAAqB;AAElD,QAAM,aAAyB,aAAa,aAAa;AAEzD,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,wBAAwB;AAAA,QAChC,SAAS,MAAM,uBAAuB,IAAI;AAAA,QAC1C,gBAAc;AAAA,QACd,WAAO,yBAAE;AAAA,UACP,IAAI;AAAA,UACJ,IAAI;AAAA,UACJ,IAAI;AAAA,QACN,CAAC;AAAA,QACD,MAAK;AAAA,QACL,cAAa;AAAA,QAEZ,wBACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA;AAAA,IAEJ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,aAAa;AAAA;AAAA,IACf;AAAA,KACF;AAEJ;AAOO,MAAM,0BAA4D,CAAC;AAAA,EACxE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,eAAe,QAAI,qCAAc,+BAAAA,OAA8B;AACvE,QAAM,SAAK,uDAAoB,aAAa;AAE5C,QAAM,EAAE,gBAAgB,MAAM,QAAI,8DAA2B,aAAa;AAC1E,QAAM,EAAE,yBAAyB,QAAI,0CAAoB,CAAC,OAAO;AAAA,IAC/D,0BAA0B,MAAM,EAAE,KAAK,oEAA8B;AAAA,EACvE,EAAE;AAEF,QAAM,eAAe,MAAM;AACzB,UAAM;AACN,6BAAyB;AAAA,EAC3B;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,QACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA,MAEF,YAAY;AAAA,QACV,QAAQ;AAAA,QACR,MAAM;AAAA,MACR;AAAA,MAEC,4BACC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,YAAY;AAAA,UACZ;AAAA,UACA;AAAA;AAAA,MACF;AAAA;AAAA,EAEJ;AAEJ;AAQO,MAAM,oCAET,CAAC,EAAE,QAAQ,YAAY,UAAU,MAAM;AACzC,QAAM,qBAAiB;AAAA,QACrB,2BAAW,CAAC,MAAM,EAAE,cAAc;AAAA,EACpC;AACA,QAAM,gBAAoC,gBAAgB;AAE1D,MAAI,CAAC,eAAe;AAClB,WAAO,2EAAE;AAAA,EACX;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;","names":["dictionaryEditionDrawerContent"]}

package/dist/cjs/DictionaryEditionDrawer/useDictionaryEditionDrawer.cjs

@@ -25,9 +25,9 @@ module.exports = __toCommonJS(useDictionaryEditionDrawer_exports);
 var import_design_system = require("@intlayer/design-system");
 var import_react = require("react");
 var import_shallow = require("zustand/shallow");
-const getDrawerIdentifier = (dictionaryId) => `dictionary_edition_${dictionaryId}`;
-const useDictionaryEditionDrawer = (dictionaryId) => {
-  const id = getDrawerIdentifier(dictionaryId);
+const getDrawerIdentifier = (dictionaryKey) => `dictionary_edition_${dictionaryKey}`;
+const useDictionaryEditionDrawer = (dictionaryKey) => {
+  const id = getDrawerIdentifier(dictionaryKey);
   const { isOpenDrawer, openDrawer, closeDrawer } = (0, import_design_system.useRightDrawerStore)(
     (0, import_shallow.useShallow)((e) => ({
       isOpenDrawer: e.isOpen,
@@ -49,12 +49,12 @@ const useDictionaryEditionDrawer = (dictionaryId) => {
   );
   const openDictionaryEditionDrawer = (0, import_react.useCallback)(
     ({
-      dictionaryId: dictionaryId2,
+      dictionaryKey: dictionaryKey2,
       dictionaryPath,
       keyPath = []
     }) => {
       setFocusedContent({
-        dictionaryId: dictionaryId2,
+        dictionaryKey: dictionaryKey2,
         dictionaryPath,
         keyPath
       });

package/dist/cjs/DictionaryEditionDrawer/useDictionaryEditionDrawer.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/DictionaryEditionDrawer/useDictionaryEditionDrawer.ts"],"sourcesContent":["import type { Dictionary, DictionaryValue, KeyPath } from '@intlayer/core';\nimport {\n  useRightDrawerStore,\n  useEditedContentStore,\n  useEditionPanelStore,\n} from '@intlayer/design-system';\nimport { useCallback } from 'react';\nimport { useShallow } from 'zustand/shallow';\n\nexport const getDrawerIdentifier = (dictionaryId: string) =>\n  `dictionary_edition_${dictionaryId}`;\n\ntype DictionaryId = string;\ntype DictionaryPath = string;\n\nexport type FileContent = {\n  dictionaryPath?: DictionaryPath;\n  dictionaryId: string;\n  keyPath?: KeyPath[];\n};\n\ntype DictionaryEditionDrawer = {\n  focusedContent: FileContent | null;\n  isOpen: boolean;\n  open: (content: FileContent) => void;\n  close: () => void;\n  setDictionariesRecord: (\n    dictionariesRecord: Record<DictionaryId, Dictionary>\n  ) => void;\n  getEditedContentValue: (\n    dictionaryId: DictionaryId,\n    keyPath: KeyPath[]\n  ) => DictionaryValue | undefined;\n};\n\ntype OpenDictionaryEditionDrawerProps = {\n  dictionaryId: string;\n  dictionaryPath?: string;\n  keyPath?: KeyPath[];\n};\n\nexport const useDictionaryEditionDrawer = (\n  dictionaryId: string\n): DictionaryEditionDrawer => {\n  const id = getDrawerIdentifier(dictionaryId);\n  const { isOpenDrawer, openDrawer, closeDrawer } = useRightDrawerStore(\n    useShallow((e) => ({\n      isOpenDrawer: e.isOpen,\n      openDrawer: e.open,\n      closeDrawer: e.close,\n    }))\n  );\n  const { setDictionariesRecord, getEditedContentValue } =\n    useEditedContentStore(\n      useShallow((s) => ({\n        setDictionariesRecord: s.setDictionariesRecord,\n        getEditedContentValue: s.getEditedContentValue,\n      }))\n    );\n  const { setFocusedContent, focusedContent } = useEditionPanelStore(\n    useShallow((s) => ({\n      focusedContent: s.focusedContent,\n      setFocusedContent: s.setFocusedContent,\n    }))\n  );\n\n  const openDictionaryEditionDrawer = useCallback(\n    ({\n      dictionaryId,\n      dictionaryPath,\n      keyPath = [],\n    }: OpenDictionaryEditionDrawerProps) => {\n      setFocusedContent({\n        dictionaryId,\n        dictionaryPath,\n        keyPath,\n      });\n\n      openDrawer(id);\n    },\n    [openDrawer, setFocusedContent]\n  );\n\n  return {\n    isOpen: isOpenDrawer(id),\n    focusedContent,\n    setDictionariesRecord,\n    getEditedContentValue,\n    open: openDictionaryEditionDrawer,\n    close: () => closeDrawer(id),\n  };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,2BAIO;AACP,mBAA4B;AAC5B,qBAA2B;AAEpB,MAAM,sBAAsB,CAAC,iBAClC,sBAAsB,YAAY;AA+B7B,MAAM,6BAA6B,CACxC,iBAC4B;AAC5B,QAAM,KAAK,oBAAoB,YAAY;AAC3C,QAAM,EAAE,cAAc,YAAY,YAAY,QAAI;AAAA,QAChD,2BAAW,CAAC,OAAO;AAAA,MACjB,cAAc,EAAE;AAAA,MAChB,YAAY,EAAE;AAAA,MACd,aAAa,EAAE;AAAA,IACjB,EAAE;AAAA,EACJ;AACA,QAAM,EAAE,uBAAuB,sBAAsB,QACnD;AAAA,QACE,2BAAW,CAAC,OAAO;AAAA,MACjB,uBAAuB,EAAE;AAAA,MACzB,uBAAuB,EAAE;AAAA,IAC3B,EAAE;AAAA,EACJ;AACF,QAAM,EAAE,mBAAmB,eAAe,QAAI;AAAA,QAC5C,2BAAW,CAAC,OAAO;AAAA,MACjB,gBAAgB,EAAE;AAAA,MAClB,mBAAmB,EAAE;AAAA,IACvB,EAAE;AAAA,EACJ;AAEA,QAAM,kCAA8B;AAAA,IAClC,CAAC;AAAA,MACC,cAAAA;AAAA,MACA;AAAA,MACA,UAAU,CAAC;AAAA,IACb,MAAwC;AACtC,wBAAkB;AAAA,QAChB,cAAAA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,iBAAW,EAAE;AAAA,IACf;AAAA,IACA,CAAC,YAAY,iBAAiB;AAAA,EAChC;AAEA,SAAO;AAAA,IACL,QAAQ,aAAa,EAAE;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,OAAO,MAAM,YAAY,EAAE;AAAA,EAC7B;AACF;","names":["dictionaryId"]}
+{"version":3,"sources":["../../../src/DictionaryEditionDrawer/useDictionaryEditionDrawer.ts"],"sourcesContent":["import type { Dictionary, DictionaryValue, KeyPath } from '@intlayer/core';\nimport {\n  useRightDrawerStore,\n  useEditedContentStore,\n  useEditionPanelStore,\n} from '@intlayer/design-system';\nimport { useCallback } from 'react';\nimport { useShallow } from 'zustand/shallow';\n\nexport const getDrawerIdentifier = (dictionaryKey: string) =>\n  `dictionary_edition_${dictionaryKey}`;\n\ntype DictionaryKey = string;\ntype DictionaryPath = string;\n\nexport type FileContent = {\n  dictionaryPath?: DictionaryPath;\n  dictionaryKey: DictionaryKey;\n  keyPath?: KeyPath[];\n};\n\ntype DictionaryEditionDrawer = {\n  focusedContent: FileContent | null;\n  isOpen: boolean;\n  open: (content: FileContent) => void;\n  close: () => void;\n  setDictionariesRecord: (\n    dictionariesRecord: Record<DictionaryKey, Dictionary>\n  ) => void;\n  getEditedContentValue: (\n    dictionaryKey: DictionaryKey,\n    keyPath: KeyPath[]\n  ) => DictionaryValue | undefined;\n};\n\ntype OpenDictionaryEditionDrawerProps = {\n  dictionaryKey: string;\n  dictionaryPath?: string;\n  keyPath?: KeyPath[];\n};\n\nexport const useDictionaryEditionDrawer = (\n  dictionaryKey: string\n): DictionaryEditionDrawer => {\n  const id = getDrawerIdentifier(dictionaryKey);\n  const { isOpenDrawer, openDrawer, closeDrawer } = useRightDrawerStore(\n    useShallow((e) => ({\n      isOpenDrawer: e.isOpen,\n      openDrawer: e.open,\n      closeDrawer: e.close,\n    }))\n  );\n  const { setDictionariesRecord, getEditedContentValue } =\n    useEditedContentStore(\n      useShallow((s) => ({\n        setDictionariesRecord: s.setDictionariesRecord,\n        getEditedContentValue: s.getEditedContentValue,\n      }))\n    );\n  const { setFocusedContent, focusedContent } = useEditionPanelStore(\n    useShallow((s) => ({\n      focusedContent: s.focusedContent,\n      setFocusedContent: s.setFocusedContent,\n    }))\n  );\n\n  const openDictionaryEditionDrawer = useCallback(\n    ({\n      dictionaryKey,\n      dictionaryPath,\n      keyPath = [],\n    }: OpenDictionaryEditionDrawerProps) => {\n      setFocusedContent({\n        dictionaryKey,\n        dictionaryPath,\n        keyPath,\n      });\n\n      openDrawer(id);\n    },\n    [openDrawer, setFocusedContent]\n  );\n\n  return {\n    isOpen: isOpenDrawer(id),\n    focusedContent,\n    setDictionariesRecord,\n    getEditedContentValue,\n    open: openDictionaryEditionDrawer,\n    close: () => closeDrawer(id),\n  };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,2BAIO;AACP,mBAA4B;AAC5B,qBAA2B;AAEpB,MAAM,sBAAsB,CAAC,kBAClC,sBAAsB,aAAa;AA+B9B,MAAM,6BAA6B,CACxC,kBAC4B;AAC5B,QAAM,KAAK,oBAAoB,aAAa;AAC5C,QAAM,EAAE,cAAc,YAAY,YAAY,QAAI;AAAA,QAChD,2BAAW,CAAC,OAAO;AAAA,MACjB,cAAc,EAAE;AAAA,MAChB,YAAY,EAAE;AAAA,MACd,aAAa,EAAE;AAAA,IACjB,EAAE;AAAA,EACJ;AACA,QAAM,EAAE,uBAAuB,sBAAsB,QACnD;AAAA,QACE,2BAAW,CAAC,OAAO;AAAA,MACjB,uBAAuB,EAAE;AAAA,MACzB,uBAAuB,EAAE;AAAA,IAC3B,EAAE;AAAA,EACJ;AACF,QAAM,EAAE,mBAAmB,eAAe,QAAI;AAAA,QAC5C,2BAAW,CAAC,OAAO;AAAA,MACjB,gBAAgB,EAAE;AAAA,MAClB,mBAAmB,EAAE;AAAA,IACvB,EAAE;AAAA,EACJ;AAEA,QAAM,kCAA8B;AAAA,IAClC,CAAC;AAAA,MACC,eAAAA;AAAA,MACA;AAAA,MACA,UAAU,CAAC;AAAA,IACb,MAAwC;AACtC,wBAAkB;AAAA,QAChB,eAAAA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,iBAAW,EAAE;AAAA,IACf;AAAA,IACA,CAAC,YAAY,iBAAiB;AAAA,EAChC;AAEA,SAAO;AAAA,IACL,QAAQ,aAAa,EAAE;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,OAAO,MAAM,YAAY,EAAE;AAAA,EAC7B;AACF;","names":["dictionaryKey"]}

package/dist/cjs/DictionaryListDrawer/DictionaryListDrawer.cjs

@@ -48,17 +48,17 @@ const DictionaryListDrawer = () => {
   const setFocusedContent = (0, import_design_system.useEditionPanelStore)(
     (0, import_shallow.useShallow)((s) => s.setFocusedContent)
   );
-  const handleClickDictionary = (dictionaryId) => {
+  const handleClickDictionary = (dictionaryKey) => {
     closeDrawer(import_dictionaryListDrawerIdentifier.dictionaryListDrawerIdentifier);
-    const { filePath } = dictionaries[dictionaryId];
+    const { filePath } = dictionaries[dictionaryKey];
     setFocusedContent({
-      dictionaryId,
+      dictionaryKey,
       dictionaryPath: filePath
     });
-    openDrawer((0, import_useDictionaryEditionDrawer.getDrawerIdentifier)(dictionaryId));
+    openDrawer((0, import_useDictionaryEditionDrawer.getDrawerIdentifier)(dictionaryKey));
   };
   const isDictionaryEdited = (0, import_react.useCallback)(
-    (dictionaryId) => Object.keys(editedContent).includes(dictionaryId),
+    (dictionaryKey) => Object.keys(editedContent).includes(dictionaryKey),
     [editedContent]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -66,19 +66,19 @@ const DictionaryListDrawer = () => {
     {
       title: "Dictionary list",
       identifier: import_dictionaryListDrawerIdentifier.dictionaryListDrawerIdentifier,
-      children: dictionaryKeyList.map((dictionaryId) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      children: dictionaryKeyList.map((dictionaryKey) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         import_design_system.Button,
         {
-          label: `Open dictionary editor ${dictionaryId}`,
-          onClick: () => handleClickDictionary(dictionaryId),
+          label: `Open dictionary editor ${dictionaryKey}`,
+          onClick: () => handleClickDictionary(dictionaryKey),
           variant: "hoverable",
           color: "text",
           IconRight: import_lucide_react.ChevronRight,
           size: "md",
           isFullWidth: true,
-          children: isDictionaryEdited(dictionaryId) ? `\u270E ${dictionaryId}` : dictionaryId
+          children: isDictionaryEdited(dictionaryKey) ? `\u270E ${dictionaryKey}` : dictionaryKey
         }
-      ) }, dictionaryId))
+      ) }, dictionaryKey))
     }
   ) });
 };

package/dist/cjs/DictionaryListDrawer/DictionaryListDrawer.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/DictionaryListDrawer/DictionaryListDrawer.tsx"],"sourcesContent":["'use client';\n\nimport { Locales } from '@intlayer/config';\nimport {\n  RightDrawer,\n  Button,\n  useEditedContentStore,\n  useEditionPanelStore,\n  useRightDrawerStore,\n} from '@intlayer/design-system';\nimport { useGetAllDictionaries } from '@intlayer/design-system/hooks';\nimport { ChevronRight } from 'lucide-react';\nimport { useCallback, useMemo, FC } from 'react';\nimport { useShallow } from 'zustand/shallow';\nimport { getDrawerIdentifier } from '../DictionaryEditionDrawer/useDictionaryEditionDrawer';\nimport { dictionaryListDrawerIdentifier } from './dictionaryListDrawerIdentifier';\n\nexport const DictionaryListDrawer: FC = () => {\n  const { all: dictionaries } = useGetAllDictionaries();\n  const dictionaryKeyList = useMemo(\n    () => Object.keys(dictionaries) as Locales[],\n    [dictionaries]\n  );\n\n  const { closeDrawer, openDrawer } = useRightDrawerStore(\n    useShallow((s) => ({\n      closeDrawer: s.close,\n      openDrawer: s.open,\n    }))\n  );\n\n  const editedContent = useEditedContentStore(\n    useShallow((s) => s.editedContent)\n  );\n  const setFocusedContent = useEditionPanelStore(\n    useShallow((s) => s.setFocusedContent)\n  );\n\n  const handleClickDictionary = (dictionaryId: string) => {\n    closeDrawer(dictionaryListDrawerIdentifier);\n\n    const { filePath } = dictionaries[dictionaryId];\n    setFocusedContent({\n      dictionaryId,\n      dictionaryPath: filePath,\n    });\n\n    openDrawer(getDrawerIdentifier(dictionaryId));\n  };\n\n  const isDictionaryEdited = useCallback(\n    (dictionaryId: string) => Object.keys(editedContent).includes(dictionaryId),\n    [editedContent]\n  );\n\n  return (\n    <>\n      <RightDrawer\n        title=\"Dictionary list\"\n        identifier={dictionaryListDrawerIdentifier}\n      >\n        {dictionaryKeyList.map((dictionaryId) => (\n          <div key={dictionaryId}>\n            <Button\n              label={`Open dictionary editor ${dictionaryId}`}\n              onClick={() => handleClickDictionary(dictionaryId)}\n              variant=\"hoverable\"\n              color=\"text\"\n              IconRight={ChevronRight}\n              size=\"md\"\n              isFullWidth\n            >\n              {isDictionaryEdited(dictionaryId)\n                ? `✎ ${dictionaryId}`\n                : dictionaryId}\n            </Button>\n          </div>\n        ))}\n      </RightDrawer>\n    </>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwDI;AArDJ,2BAMO;AACP,mBAAsC;AACtC,0BAA6B;AAC7B,mBAAyC;AACzC,qBAA2B;AAC3B,wCAAoC;AACpC,4CAA+C;AAExC,MAAM,uBAA2B,MAAM;AAC5C,QAAM,EAAE,KAAK,aAAa,QAAI,oCAAsB;AACpD,QAAM,wBAAoB;AAAA,IACxB,MAAM,OAAO,KAAK,YAAY;AAAA,IAC9B,CAAC,YAAY;AAAA,EACf;AAEA,QAAM,EAAE,aAAa,WAAW,QAAI;AAAA,QAClC,2BAAW,CAAC,OAAO;AAAA,MACjB,aAAa,EAAE;AAAA,MACf,YAAY,EAAE;AAAA,IAChB,EAAE;AAAA,EACJ;AAEA,QAAM,oBAAgB;AAAA,QACpB,2BAAW,CAAC,MAAM,EAAE,aAAa;AAAA,EACnC;AACA,QAAM,wBAAoB;AAAA,QACxB,2BAAW,CAAC,MAAM,EAAE,iBAAiB;AAAA,EACvC;AAEA,QAAM,wBAAwB,CAAC,iBAAyB;AACtD,gBAAY,oEAA8B;AAE1C,UAAM,EAAE,SAAS,IAAI,aAAa,YAAY;AAC9C,sBAAkB;AAAA,MAChB;AAAA,MACA,gBAAgB;AAAA,IAClB,CAAC;AAED,mBAAW,uDAAoB,YAAY,CAAC;AAAA,EAC9C;AAEA,QAAM,yBAAqB;AAAA,IACzB,CAAC,iBAAyB,OAAO,KAAK,aAAa,EAAE,SAAS,YAAY;AAAA,IAC1E,CAAC,aAAa;AAAA,EAChB;AAEA,SACE,2EACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,YAAY;AAAA,MAEX,4BAAkB,IAAI,CAAC,iBACtB,4CAAC,SACC;AAAA,QAAC;AAAA;AAAA,UACC,OAAO,0BAA0B,YAAY;AAAA,UAC7C,SAAS,MAAM,sBAAsB,YAAY;AAAA,UACjD,SAAQ;AAAA,UACR,OAAM;AAAA,UACN,WAAW;AAAA,UACX,MAAK;AAAA,UACL,aAAW;AAAA,UAEV,6BAAmB,YAAY,IAC5B,UAAK,YAAY,KACjB;AAAA;AAAA,MACN,KAbQ,YAcV,CACD;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/DictionaryListDrawer/DictionaryListDrawer.tsx"],"sourcesContent":["'use client';\n\nimport { Locales } from '@intlayer/config';\nimport {\n  RightDrawer,\n  Button,\n  useEditedContentStore,\n  useEditionPanelStore,\n  useRightDrawerStore,\n} from '@intlayer/design-system';\nimport { useGetAllDictionaries } from '@intlayer/design-system/hooks';\nimport { ChevronRight } from 'lucide-react';\nimport { useCallback, useMemo, FC } from 'react';\nimport { useShallow } from 'zustand/shallow';\nimport { getDrawerIdentifier } from '../DictionaryEditionDrawer/useDictionaryEditionDrawer';\nimport { dictionaryListDrawerIdentifier } from './dictionaryListDrawerIdentifier';\n\nexport const DictionaryListDrawer: FC = () => {\n  const { all: dictionaries } = useGetAllDictionaries();\n  const dictionaryKeyList = useMemo(\n    () => Object.keys(dictionaries) as Locales[],\n    [dictionaries]\n  );\n\n  const { closeDrawer, openDrawer } = useRightDrawerStore(\n    useShallow((s) => ({\n      closeDrawer: s.close,\n      openDrawer: s.open,\n    }))\n  );\n\n  const editedContent = useEditedContentStore(\n    useShallow((s) => s.editedContent)\n  );\n  const setFocusedContent = useEditionPanelStore(\n    useShallow((s) => s.setFocusedContent)\n  );\n\n  const handleClickDictionary = (dictionaryKey: string) => {\n    closeDrawer(dictionaryListDrawerIdentifier);\n\n    const { filePath } = dictionaries[dictionaryKey];\n    setFocusedContent({\n      dictionaryKey,\n      dictionaryPath: filePath,\n    });\n\n    openDrawer(getDrawerIdentifier(dictionaryKey));\n  };\n\n  const isDictionaryEdited = useCallback(\n    (dictionaryKey: string) =>\n      Object.keys(editedContent).includes(dictionaryKey),\n    [editedContent]\n  );\n\n  return (\n    <>\n      <RightDrawer\n        title=\"Dictionary list\"\n        identifier={dictionaryListDrawerIdentifier}\n      >\n        {dictionaryKeyList.map((dictionaryKey) => (\n          <div key={dictionaryKey}>\n            <Button\n              label={`Open dictionary editor ${dictionaryKey}`}\n              onClick={() => handleClickDictionary(dictionaryKey)}\n              variant=\"hoverable\"\n              color=\"text\"\n              IconRight={ChevronRight}\n              size=\"md\"\n              isFullWidth\n            >\n              {isDictionaryEdited(dictionaryKey)\n                ? `✎ ${dictionaryKey}`\n                : dictionaryKey}\n            </Button>\n          </div>\n        ))}\n      </RightDrawer>\n    </>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAyDI;AAtDJ,2BAMO;AACP,mBAAsC;AACtC,0BAA6B;AAC7B,mBAAyC;AACzC,qBAA2B;AAC3B,wCAAoC;AACpC,4CAA+C;AAExC,MAAM,uBAA2B,MAAM;AAC5C,QAAM,EAAE,KAAK,aAAa,QAAI,oCAAsB;AACpD,QAAM,wBAAoB;AAAA,IACxB,MAAM,OAAO,KAAK,YAAY;AAAA,IAC9B,CAAC,YAAY;AAAA,EACf;AAEA,QAAM,EAAE,aAAa,WAAW,QAAI;AAAA,QAClC,2BAAW,CAAC,OAAO;AAAA,MACjB,aAAa,EAAE;AAAA,MACf,YAAY,EAAE;AAAA,IAChB,EAAE;AAAA,EACJ;AAEA,QAAM,oBAAgB;AAAA,QACpB,2BAAW,CAAC,MAAM,EAAE,aAAa;AAAA,EACnC;AACA,QAAM,wBAAoB;AAAA,QACxB,2BAAW,CAAC,MAAM,EAAE,iBAAiB;AAAA,EACvC;AAEA,QAAM,wBAAwB,CAAC,kBAA0B;AACvD,gBAAY,oEAA8B;AAE1C,UAAM,EAAE,SAAS,IAAI,aAAa,aAAa;AAC/C,sBAAkB;AAAA,MAChB;AAAA,MACA,gBAAgB;AAAA,IAClB,CAAC;AAED,mBAAW,uDAAoB,aAAa,CAAC;AAAA,EAC/C;AAEA,QAAM,yBAAqB;AAAA,IACzB,CAAC,kBACC,OAAO,KAAK,aAAa,EAAE,SAAS,aAAa;AAAA,IACnD,CAAC,aAAa;AAAA,EAChB;AAEA,SACE,2EACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,YAAY;AAAA,MAEX,4BAAkB,IAAI,CAAC,kBACtB,4CAAC,SACC;AAAA,QAAC;AAAA;AAAA,UACC,OAAO,0BAA0B,aAAa;AAAA,UAC9C,SAAS,MAAM,sBAAsB,aAAa;AAAA,UAClD,SAAQ;AAAA,UACR,OAAM;AAAA,UACN,WAAW;AAAA,UACX,MAAK;AAAA,UACL,aAAW;AAAA,UAEV,6BAAmB,aAAa,IAC7B,UAAK,aAAa,KAClB;AAAA;AAAA,MACN,KAbQ,aAcV,CACD;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}

package/dist/cjs/IntlayerEditorProvider.cjs

@@ -57,13 +57,19 @@ const IntlayerEditorProvider = ({
   (0, import_react.useEffect)(() => {
     if (isEnabled && editor.enabled) {
       if (!editor.clientId) {
-        console.error(
-          "Editor is enabled but clientId is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor."
+        (0, import_client.appLogger)(
+          "Editor is enabled but clientId is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.",
+          {
+            level: "error"
+          }
         );
       }
       if (!editor.clientSecret) {
-        console.error(
-          "Editor is enabled but clientSecret is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor."
+        (0, import_client.appLogger)(
+          "Editor is enabled but clientSecret is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.",
+          {
+            level: "error"
+          }
         );
       }
     }

package/dist/cjs/IntlayerEditorProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration } from '@intlayer/config/client';\nimport { DictionaryEditionDrawerController } from './DictionaryEditionDrawer/index';\nimport { DictionaryListDrawer } from './DictionaryListDrawer/index';\nimport { useIntlayerContext } from 'react-intlayer';\nimport { useContentSelectorContext } from 'react-intlayer/editor';\nimport { ContentSelectorWrapper } from './ContentSelectorWrapper';\nimport {\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useEffect,\n  useMemo,\n} from 'react';\n\ntype IntlayerEditorValue = {\n  isEditorEnabled: boolean;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerEditorContext = createContext<IntlayerEditorValue>({\n  isEditorEnabled: false,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerEditorContext = () => useContext(IntlayerEditorContext);\n\nexport type IntlayerEditorProviderProps = PropsWithChildren<{\n  isEnabled?: boolean;\n}>;\n\n/**\n * Provider that store the current locale on the client side\n */\nexport const IntlayerEditorProvider: FC<IntlayerEditorProviderProps> = ({\n  children,\n  isEnabled = true,\n}) => {\n  const { editor, internationalization } = getConfiguration();\n\n  const { setState } = useContentSelectorContext();\n\n  const { locale, setLocale } = useIntlayerContext();\n\n  const isEditorEnabled = useMemo(\n    () =>\n      Boolean(\n        editor.enabled && editor.clientId && editor.clientSecret && isEnabled\n      ),\n    [editor.enabled && editor.clientId && editor.clientSecret && isEnabled]\n  );\n\n  useEffect(() => {\n    setState({\n      ContentSelectorWrapper,\n    });\n  }, [setState]);\n\n  useEffect(() => {\n    if (isEnabled && editor.enabled) {\n      if (!editor.clientId) {\n        console.error(\n          'Editor is enabled but clientId is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.'\n        );\n      }\n\n      if (!editor.clientSecret) {\n        console.error(\n          'Editor is enabled but clientSecret is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.'\n        );\n      }\n    }\n  }, [isEnabled, editor.enabled, editor.clientId, editor.clientSecret]);\n\n  return (\n    <IntlayerEditorContext.Provider value={{ isEditorEnabled }}>\n      {children}\n\n      {isEditorEnabled && (\n        <>\n          <DictionaryEditionDrawerController\n            locale={locale}\n            localeList={internationalization.locales}\n            setLocale={setLocale}\n          />\n          <DictionaryListDrawer />\n        </>\n      )}\n    </IntlayerEditorContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqFQ;AAnFR,oBAAiC;AACjC,qCAAkD;AAClD,kCAAqC;AACrC,4BAAmC;AACnC,oBAA0C;AAC1C,oCAAuC;AACvC,mBAOO;AASA,MAAM,4BAAwB,4BAAmC;AAAA,EACtE,iBAAiB;AACnB,CAAC;AAKM,MAAM,2BAA2B,UAAM,yBAAW,qBAAqB;AASvE,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA,YAAY;AACd,MAAM;AACJ,QAAM,EAAE,QAAQ,qBAAqB,QAAI,gCAAiB;AAE1D,QAAM,EAAE,SAAS,QAAI,yCAA0B;AAE/C,QAAM,EAAE,QAAQ,UAAU,QAAI,0CAAmB;AAEjD,QAAM,sBAAkB;AAAA,IACtB,MACE;AAAA,MACE,OAAO,WAAW,OAAO,YAAY,OAAO,gBAAgB;AAAA,IAC9D;AAAA,IACF,CAAC,OAAO,WAAW,OAAO,YAAY,OAAO,gBAAgB,SAAS;AAAA,EACxE;AAEA,8BAAU,MAAM;AACd,aAAS;AAAA,MACP;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,QAAQ,CAAC;AAEb,8BAAU,MAAM;AACd,QAAI,aAAa,OAAO,SAAS;AAC/B,UAAI,CAAC,OAAO,UAAU;AACpB,gBAAQ;AAAA,UACN;AAAA,QACF;AAAA,MACF;AAEA,UAAI,CAAC,OAAO,cAAc;AACxB,gBAAQ;AAAA,UACN;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,WAAW,OAAO,SAAS,OAAO,UAAU,OAAO,YAAY,CAAC;AAEpE,SACE,6CAAC,sBAAsB,UAAtB,EAA+B,OAAO,EAAE,gBAAgB,GACtD;AAAA;AAAA,IAEA,mBACC,4EACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,YAAY,qBAAqB;AAAA,UACjC;AAAA;AAAA,MACF;AAAA,MACA,4CAAC,oDAAqB;AAAA,OACxB;AAAA,KAEJ;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport { appLogger, getConfiguration } from '@intlayer/config/client';\nimport { DictionaryEditionDrawerController } from './DictionaryEditionDrawer/index';\nimport { DictionaryListDrawer } from './DictionaryListDrawer/index';\nimport { useIntlayerContext } from 'react-intlayer';\nimport { useContentSelectorContext } from 'react-intlayer/editor';\nimport { ContentSelectorWrapper } from './ContentSelectorWrapper';\nimport {\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useEffect,\n  useMemo,\n} from 'react';\n\ntype IntlayerEditorValue = {\n  isEditorEnabled: boolean;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerEditorContext = createContext<IntlayerEditorValue>({\n  isEditorEnabled: false,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerEditorContext = () => useContext(IntlayerEditorContext);\n\nexport type IntlayerEditorProviderProps = PropsWithChildren<{\n  isEnabled?: boolean;\n}>;\n\n/**\n * Provider that store the current locale on the client side\n */\nexport const IntlayerEditorProvider: FC<IntlayerEditorProviderProps> = ({\n  children,\n  isEnabled = true,\n}) => {\n  const { editor, internationalization } = getConfiguration();\n\n  const { setState } = useContentSelectorContext();\n\n  const { locale, setLocale } = useIntlayerContext();\n\n  const isEditorEnabled = useMemo(\n    () =>\n      Boolean(\n        editor.enabled && editor.clientId && editor.clientSecret && isEnabled\n      ),\n    [editor.enabled && editor.clientId && editor.clientSecret && isEnabled]\n  );\n\n  useEffect(() => {\n    setState({\n      ContentSelectorWrapper,\n    });\n  }, [setState]);\n\n  useEffect(() => {\n    if (isEnabled && editor.enabled) {\n      if (!editor.clientId) {\n        appLogger(\n          'Editor is enabled but clientId is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.',\n          {\n            level: 'error',\n          }\n        );\n      }\n\n      if (!editor.clientSecret) {\n        appLogger(\n          'Editor is enabled but clientSecret is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.',\n          {\n            level: 'error',\n          }\n        );\n      }\n    }\n  }, [isEnabled, editor.enabled, editor.clientId, editor.clientSecret]);\n\n  return (\n    <IntlayerEditorContext.Provider value={{ isEditorEnabled }}>\n      {children}\n\n      {isEditorEnabled && (\n        <>\n          <DictionaryEditionDrawerController\n            locale={locale}\n            localeList={internationalization.locales}\n            setLocale={setLocale}\n          />\n          <DictionaryListDrawer />\n        </>\n      )}\n    </IntlayerEditorContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2FQ;AAzFR,oBAA4C;AAC5C,qCAAkD;AAClD,kCAAqC;AACrC,4BAAmC;AACnC,oBAA0C;AAC1C,oCAAuC;AACvC,mBAOO;AASA,MAAM,4BAAwB,4BAAmC;AAAA,EACtE,iBAAiB;AACnB,CAAC;AAKM,MAAM,2BAA2B,UAAM,yBAAW,qBAAqB;AASvE,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA,YAAY;AACd,MAAM;AACJ,QAAM,EAAE,QAAQ,qBAAqB,QAAI,gCAAiB;AAE1D,QAAM,EAAE,SAAS,QAAI,yCAA0B;AAE/C,QAAM,EAAE,QAAQ,UAAU,QAAI,0CAAmB;AAEjD,QAAM,sBAAkB;AAAA,IACtB,MACE;AAAA,MACE,OAAO,WAAW,OAAO,YAAY,OAAO,gBAAgB;AAAA,IAC9D;AAAA,IACF,CAAC,OAAO,WAAW,OAAO,YAAY,OAAO,gBAAgB,SAAS;AAAA,EACxE;AAEA,8BAAU,MAAM;AACd,aAAS;AAAA,MACP;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,QAAQ,CAAC;AAEb,8BAAU,MAAM;AACd,QAAI,aAAa,OAAO,SAAS;AAC/B,UAAI,CAAC,OAAO,UAAU;AACpB;AAAA,UACE;AAAA,UACA;AAAA,YACE,OAAO;AAAA,UACT;AAAA,QACF;AAAA,MACF;AAEA,UAAI,CAAC,OAAO,cAAc;AACxB;AAAA,UACE;AAAA,UACA;AAAA,YACE,OAAO;AAAA,UACT;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,WAAW,OAAO,SAAS,OAAO,UAAU,OAAO,YAAY,CAAC;AAEpE,SACE,6CAAC,sBAAsB,UAAtB,EAA+B,OAAO,EAAE,gBAAgB,GACtD;AAAA;AAAA,IAEA,mBACC,4EACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,YAAY,qBAAqB;AAAA,UACjC;AAAA;AAAA,MACF;AAAA,MACA,4CAAC,oDAAqB;AAAA,OACxB;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/esm/ContentSelectorWrapper.mjs

@@ -1,7 +1,10 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { isSameKeyPath } from "@intlayer/core";
-import { ContentSelector } from "@intlayer/design-system";
+import {
+  ContentSelector,
+  useEditedContentStore
+} from "@intlayer/design-system";
 import {
   useCallback,
   useEffect,
@@ -10,23 +13,37 @@ import {
 } from "react";
 import { useIntlayerEditorContext } from './IntlayerEditorProvider.mjs';
 import { useDictionaryEditionDrawer } from './DictionaryEditionDrawer/useDictionaryEditionDrawer.mjs';
+import { useShallow } from "zustand/shallow";
 const ContentSelectorWrapper = ({
   children,
-  dictionaryId,
+  dictionaryKey,
   dictionaryPath,
   keyPath
 }) => {
-  const { open, getEditedContentValue, focusedContent, isOpen } = useDictionaryEditionDrawer(dictionaryId);
-  const editedValue = getEditedContentValue(dictionaryId, keyPath);
+  const { open, getEditedContentValue, focusedContent, isOpen } = useDictionaryEditionDrawer(dictionaryKey);
+  const { editedContent } = useEditedContentStore(
+    useShallow((s) => ({
+      editedContent: s.editedContent
+    }))
+  );
+  const editedValue = useMemo(
+    () => getEditedContentValue(dictionaryKey, keyPath),
+    [
+      editedContent[dictionaryKey],
+      dictionaryKey,
+      keyPath,
+      getEditedContentValue
+    ]
+  );
   const { isEditorEnabled } = useIntlayerEditorContext();
   const [displayedChildren, setDisplayedChildren] = useState(children);
   const handleSelect = useCallback(
     () => open({
-      dictionaryId,
+      dictionaryKey,
       dictionaryPath,
       keyPath
     }),
-    [dictionaryId, dictionaryPath, keyPath, open]
+    [dictionaryKey, dictionaryPath, keyPath, open]
   );
   const isSelected = useMemo(
     () => (isOpen && (focusedContent?.keyPath?.length ?? 0) > 0 && isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ?? false,
@@ -35,8 +52,10 @@ const ContentSelectorWrapper = ({
   useEffect(() => {
     if (isEditorEnabled && editedValue && typeof editedValue === "string") {
       setDisplayedChildren(editedValue);
+    } else {
+      setDisplayedChildren(children);
     }
-  }, [editedValue, isEditorEnabled]);
+  }, [editedValue, isEditorEnabled, focusedContent, children]);
   if (!isEditorEnabled) {
     return children;
   }

package/dist/esm/ContentSelectorWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport { isSameKeyPath, type KeyPath } from '@intlayer/core';\nimport { ContentSelector } from '@intlayer/design-system';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  useMemo,\n  type FC,\n  type ReactNode,\n} from 'react';\nimport { useIntlayerEditorContext } from './IntlayerEditorProvider';\nimport { useDictionaryEditionDrawer } from './DictionaryEditionDrawer/useDictionaryEditionDrawer';\n\ntype ContentSelectorWrapperProps = {\n  children: ReactNode;\n  dictionaryId: string;\n  dictionaryPath: string;\n  keyPath: KeyPath[];\n};\n\nexport const ContentSelectorWrapper: FC<ContentSelectorWrapperProps> = ({\n  children,\n  dictionaryId,\n  dictionaryPath,\n  keyPath,\n}) => {\n  const { open, getEditedContentValue, focusedContent, isOpen } =\n    useDictionaryEditionDrawer(dictionaryId);\n  const editedValue = getEditedContentValue(dictionaryId, keyPath);\n  const { isEditorEnabled } = useIntlayerEditorContext();\n  const [displayedChildren, setDisplayedChildren] =\n    useState<ReactNode>(children);\n\n  const handleSelect = useCallback(\n    () =>\n      open({\n        dictionaryId,\n        dictionaryPath,\n        keyPath,\n      }),\n    [dictionaryId, dictionaryPath, keyPath, open]\n  );\n\n  const isSelected = useMemo(\n    () =>\n      (isOpen &&\n        (focusedContent?.keyPath?.length ?? 0) > 0 &&\n        isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ??\n      false,\n    [focusedContent, isOpen, keyPath]\n  );\n\n  useEffect(() => {\n    // Use useEffect to avoid 'Text content does not match server-rendered HTML' error\n    if (isEditorEnabled && editedValue && typeof editedValue === 'string') {\n      setDisplayedChildren(editedValue);\n    }\n  }, [editedValue, isEditorEnabled]);\n\n  if (!isEditorEnabled) {\n    return children;\n  }\n\n  return (\n    <ContentSelector onSelect={handleSelect} isSelecting={isSelected}>\n      {displayedChildren}\n    </ContentSelector>\n  );\n};\n"],"mappings":";AAkEI;AAhEJ,SAAS,qBAAmC;AAC5C,SAAS,uBAAuB;AAChC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AACP,SAAS,gCAAgC;AACzC,SAAS,kCAAkC;AASpC,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,uBAAuB,gBAAgB,OAAO,IAC1D,2BAA2B,YAAY;AACzC,QAAM,cAAc,sBAAsB,cAAc,OAAO;AAC/D,QAAM,EAAE,gBAAgB,IAAI,yBAAyB;AACrD,QAAM,CAAC,mBAAmB,oBAAoB,IAC5C,SAAoB,QAAQ;AAE9B,QAAM,eAAe;AAAA,IACnB,MACE,KAAK;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACH,CAAC,cAAc,gBAAgB,SAAS,IAAI;AAAA,EAC9C;AAEA,QAAM,aAAa;AAAA,IACjB,OACG,WACE,gBAAgB,SAAS,UAAU,KAAK,KACzC,cAAc,gBAAgB,WAAW,CAAC,GAAG,OAAO,MACtD;AAAA,IACF,CAAC,gBAAgB,QAAQ,OAAO;AAAA,EAClC;AAEA,YAAU,MAAM;AAEd,QAAI,mBAAmB,eAAe,OAAO,gBAAgB,UAAU;AACrE,2BAAqB,WAAW;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,aAAa,eAAe,CAAC;AAEjC,MAAI,CAAC,iBAAiB;AACpB,WAAO;AAAA,EACT;AAEA,SACE,oBAAC,mBAAgB,UAAU,cAAc,aAAa,YACnD,6BACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport { isSameKeyPath, type KeyPath } from '@intlayer/core';\nimport {\n  ContentSelector,\n  useEditedContentStore,\n} from '@intlayer/design-system';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  useMemo,\n  type FC,\n  type ReactNode,\n} from 'react';\nimport { useIntlayerEditorContext } from './IntlayerEditorProvider';\nimport { useDictionaryEditionDrawer } from './DictionaryEditionDrawer/useDictionaryEditionDrawer';\nimport { useShallow } from 'zustand/shallow';\n\ntype ContentSelectorWrapperProps = {\n  children: ReactNode;\n  dictionaryKey: string;\n  dictionaryPath: string;\n  keyPath: KeyPath[];\n};\n\nexport const ContentSelectorWrapper: FC<ContentSelectorWrapperProps> = ({\n  children,\n  dictionaryKey,\n  dictionaryPath,\n  keyPath,\n}) => {\n  const { open, getEditedContentValue, focusedContent, isOpen } =\n    useDictionaryEditionDrawer(dictionaryKey);\n  const { editedContent } = useEditedContentStore(\n    useShallow((s) => ({\n      editedContent: s.editedContent,\n    }))\n  );\n  const editedValue = useMemo(\n    () => getEditedContentValue(dictionaryKey, keyPath),\n    [\n      editedContent[dictionaryKey],\n      dictionaryKey,\n      keyPath,\n      getEditedContentValue,\n    ]\n  );\n  const { isEditorEnabled } = useIntlayerEditorContext();\n  const [displayedChildren, setDisplayedChildren] =\n    useState<ReactNode>(children);\n\n  const handleSelect = useCallback(\n    () =>\n      open({\n        dictionaryKey,\n        dictionaryPath,\n        keyPath,\n      }),\n    [dictionaryKey, dictionaryPath, keyPath, open]\n  );\n\n  const isSelected = useMemo(\n    () =>\n      (isOpen &&\n        (focusedContent?.keyPath?.length ?? 0) > 0 &&\n        isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ??\n      false,\n    [focusedContent, isOpen, keyPath]\n  );\n\n  useEffect(() => {\n    // Use useEffect to avoid 'Text content does not match server-rendered HTML' error\n    if (isEditorEnabled && editedValue && typeof editedValue === 'string') {\n      setDisplayedChildren(editedValue);\n    } else {\n      setDisplayedChildren(children);\n    }\n  }, [editedValue, isEditorEnabled, focusedContent, children]);\n\n  if (!isEditorEnabled) {\n    return children;\n  }\n\n  return (\n    <ContentSelector onSelect={handleSelect} isSelecting={isSelected}>\n      {displayedChildren}\n    </ContentSelector>\n  );\n};\n"],"mappings":";AAqFI;AAnFJ,SAAS,qBAAmC;AAC5C;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AACP,SAAS,gCAAgC;AACzC,SAAS,kCAAkC;AAC3C,SAAS,kBAAkB;AASpB,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,uBAAuB,gBAAgB,OAAO,IAC1D,2BAA2B,aAAa;AAC1C,QAAM,EAAE,cAAc,IAAI;AAAA,IACxB,WAAW,CAAC,OAAO;AAAA,MACjB,eAAe,EAAE;AAAA,IACnB,EAAE;AAAA,EACJ;AACA,QAAM,cAAc;AAAA,IAClB,MAAM,sBAAsB,eAAe,OAAO;AAAA,IAClD;AAAA,MACE,cAAc,aAAa;AAAA,MAC3B;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACA,QAAM,EAAE,gBAAgB,IAAI,yBAAyB;AACrD,QAAM,CAAC,mBAAmB,oBAAoB,IAC5C,SAAoB,QAAQ;AAE9B,QAAM,eAAe;AAAA,IACnB,MACE,KAAK;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACH,CAAC,eAAe,gBAAgB,SAAS,IAAI;AAAA,EAC/C;AAEA,QAAM,aAAa;AAAA,IACjB,OACG,WACE,gBAAgB,SAAS,UAAU,KAAK,KACzC,cAAc,gBAAgB,WAAW,CAAC,GAAG,OAAO,MACtD;AAAA,IACF,CAAC,gBAAgB,QAAQ,OAAO;AAAA,EAClC;AAEA,YAAU,MAAM;AAEd,QAAI,mBAAmB,eAAe,OAAO,gBAAgB,UAAU;AACrE,2BAAqB,WAAW;AAAA,IAClC,OAAO;AACL,2BAAqB,QAAQ;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,aAAa,iBAAiB,gBAAgB,QAAQ,CAAC;AAE3D,MAAI,CAAC,iBAAiB;AACpB,WAAO;AAAA,EACT;AAEA,SACE,oBAAC,mBAAgB,UAAU,cAAc,aAAa,YACnD,6BACH;AAEJ;","names":[]}

package/dist/esm/DictionaryEditionDrawer/DictionaryEditionDrawer.mjs

@@ -19,7 +19,7 @@ import {
   useDictionaryEditionDrawer,
   getDrawerIdentifier
 } from './useDictionaryEditionDrawer.mjs';
-const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) => {
+const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack, isDarkMode }) => {
   const [keyPathEditionModal, setKeyPathEditionModal] = useState(null);
   const { setDictionariesRecord, focusedContent } = useDictionaryEditionDrawer(identifier);
   const { all: dictionaries } = useGetAllDictionaries();
@@ -32,9 +32,9 @@ const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) =>
       setDictionariesRecord(dictionaries);
     }
   }, [setDictionariesRecord, dictionaries]);
-  const dictionaryId = focusedContent?.dictionaryId;
-  if (!dictionaryId) return /* @__PURE__ */ jsx(Fragment, { children: "No dictionary focused" });
-  const dictionary = dictionaries[dictionaryId];
+  const dictionaryKey = focusedContent?.dictionaryKey;
+  if (!dictionaryKey) return /* @__PURE__ */ jsx(Fragment, { children: "No dictionary focused" });
+  const dictionary = dictionaries[dictionaryKey];
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       Modal,
@@ -53,7 +53,8 @@ const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) =>
           DictionaryFieldEditor,
           {
             dictionary,
-            onClickDictionaryList
+            onClickDictionaryList,
+            isDarkMode
           }
         )
       }
@@ -72,11 +73,12 @@ const DictionaryEditionDrawer = ({
   locale,
   localeList,
   setLocale,
-  dictionaryId
+  dictionaryKey,
+  isDarkMode
 }) => {
   const { backButtonText } = useDictionary(dictionaryEditionDrawerContent);
-  const id = getDrawerIdentifier(dictionaryId);
-  const { focusedContent, close } = useDictionaryEditionDrawer(dictionaryId);
+  const id = getDrawerIdentifier(dictionaryKey);
+  const { focusedContent, close } = useDictionaryEditionDrawer(dictionaryKey);
   const { openDictionaryListDrawer } = useRightDrawerStore((s) => ({
     openDictionaryListDrawer: () => s.open(dictionaryListDrawerIdentifier)
   }));
@@ -87,7 +89,7 @@ const DictionaryEditionDrawer = ({
   return /* @__PURE__ */ jsx(
     RightDrawer,
     {
-      title: dictionaryId,
+      title: dictionaryKey,
       identifier: id,
       header: /* @__PURE__ */ jsx(
         LocaleSwitcher,
@@ -107,7 +109,8 @@ const DictionaryEditionDrawer = ({
           focusedContent,
           locale,
           identifier: id,
-          handleOnBack
+          handleOnBack,
+          isDarkMode
         }
       )
     }
@@ -117,8 +120,8 @@ const DictionaryEditionDrawerController = ({ locale, localeList, setLocale }) =>
   const focusedContent = useEditionPanelStore(
     useShallow((s) => s.focusedContent)
   );
-  const dictionaryId = focusedContent?.dictionaryId;
-  if (!dictionaryId) {
+  const dictionaryKey = focusedContent?.dictionaryKey;
+  if (!dictionaryKey) {
     return /* @__PURE__ */ jsx(Fragment, {});
   }
   return /* @__PURE__ */ jsx(
@@ -127,7 +130,7 @@ const DictionaryEditionDrawerController = ({ locale, localeList, setLocale }) =>
       locale,
       localeList,
       setLocale,
-      dictionaryId
+      dictionaryKey
     }
   );
 };

package/dist/esm/DictionaryEditionDrawer/DictionaryEditionDrawer.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/DictionaryEditionDrawer/DictionaryEditionDrawer.tsx"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport type { Dictionary, KeyPath } from '@intlayer/core';\nimport {\n  RightDrawer,\n  DictionaryEditor,\n  LocaleSwitcher,\n  Modal,\n  useEditionPanelStore,\n  DictionaryFieldEditor,\n  useRightDrawerStore,\n} from '@intlayer/design-system';\nimport { useGetAllDictionaries } from '@intlayer/design-system/hooks';\nimport { useCallback, useEffect, useState, type FC } from 'react';\nimport { t, useDictionary } from 'react-intlayer';\nimport { useShallow } from 'zustand/shallow';\nimport { dictionaryListDrawerIdentifier } from '../DictionaryListDrawer/dictionaryListDrawerIdentifier';\nimport dictionaryEditionDrawerContent from './dictionaryEditionDrawer.content';\nimport {\n  type FileContent as FileContentWithDictionaryPath,\n  useDictionaryEditionDrawer,\n  getDrawerIdentifier,\n} from './useDictionaryEditionDrawer';\n\ntype DictionaryEditionDrawerContentProps = {\n  focusedContent: FileContentWithDictionaryPath;\n  locale: Locales;\n  identifier: string;\n  handleOnBack: () => void;\n};\n\nexport const DictionaryEditionDrawerContent: FC<\n  DictionaryEditionDrawerContentProps\n> = ({ locale, identifier, handleOnBack }) => {\n  const [keyPathEditionModal, setKeyPathEditionModal] = useState<\n    KeyPath[] | null\n  >(null);\n  const { setDictionariesRecord, focusedContent } =\n    useDictionaryEditionDrawer(identifier);\n  const { all: dictionaries } = useGetAllDictionaries();\n\n  const onClickDictionaryList = useCallback(() => {\n    setKeyPathEditionModal(null);\n    handleOnBack();\n  }, [handleOnBack]);\n\n  useEffect(() => {\n    if (dictionaries) {\n      setDictionariesRecord(dictionaries);\n    }\n  }, [setDictionariesRecord, dictionaries]);\n\n  const dictionaryId = focusedContent?.dictionaryId;\n\n  if (!dictionaryId) return <>No dictionary focused</>;\n\n  const dictionary: Dictionary = dictionaries[dictionaryId];\n\n  return (\n    <>\n      <Modal\n        isOpen={keyPathEditionModal !== null}\n        onClose={() => setKeyPathEditionModal(null)}\n        hasCloseButton\n        title={t({\n          en: 'Edit field',\n          fr: 'Modifier le champ',\n          es: 'Editar campo',\n        })}\n        size=\"xl\"\n        transparency=\"lg\"\n      >\n        {dictionary && (\n          <DictionaryFieldEditor\n            dictionary={dictionary}\n            onClickDictionaryList={onClickDictionaryList}\n          />\n        )}\n      </Modal>\n      <DictionaryEditor\n        dictionary={dictionary}\n        locale={locale}\n        onClickEdit={setKeyPathEditionModal}\n      />\n    </>\n  );\n};\n\ntype DictionaryEditionDrawerProps = DictionaryEditionDrawerControllerProps & {\n  dictionaryId: string;\n};\n\nexport const DictionaryEditionDrawer: FC<DictionaryEditionDrawerProps> = ({\n  locale,\n  localeList,\n  setLocale,\n  dictionaryId,\n}) => {\n  const { backButtonText } = useDictionary(dictionaryEditionDrawerContent);\n  const id = getDrawerIdentifier(dictionaryId);\n\n  const { focusedContent, close } = useDictionaryEditionDrawer(dictionaryId);\n  const { openDictionaryListDrawer } = useRightDrawerStore((s) => ({\n    openDictionaryListDrawer: () => s.open(dictionaryListDrawerIdentifier),\n  }));\n\n  const handleOnBack = () => {\n    close();\n    openDictionaryListDrawer();\n  };\n\n  return (\n    <RightDrawer\n      title={dictionaryId}\n      identifier={id}\n      header={\n        <LocaleSwitcher\n          setLocale={setLocale}\n          locale={locale}\n          localeList={localeList}\n        />\n      }\n      backButton={{\n        onBack: handleOnBack,\n        text: backButtonText,\n      }}\n    >\n      {focusedContent && (\n        <DictionaryEditionDrawerContent\n          focusedContent={focusedContent}\n          locale={locale}\n          identifier={id}\n          handleOnBack={handleOnBack}\n        />\n      )}\n    </RightDrawer>\n  );\n};\n\ntype DictionaryEditionDrawerControllerProps = {\n  locale: Locales;\n  localeList: Locales[];\n  setLocale: (locale: Locales) => void;\n};\n\nexport const DictionaryEditionDrawerController: FC<\n  DictionaryEditionDrawerControllerProps\n> = ({ locale, localeList, setLocale }) => {\n  const focusedContent = useEditionPanelStore(\n    useShallow((s) => s.focusedContent)\n  );\n  const dictionaryId: string | undefined = focusedContent?.dictionaryId;\n\n  if (!dictionaryId) {\n    return <></>;\n  }\n\n  return (\n    <DictionaryEditionDrawer\n      locale={locale}\n      localeList={localeList}\n      setLocale={setLocale}\n      dictionaryId={dictionaryId}\n    />\n  );\n};\n"],"mappings":";AAuD4B,wBAKxB,YALwB;AAnD5B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,6BAA6B;AACtC,SAAS,aAAa,WAAW,gBAAyB;AAC1D,SAAS,GAAG,qBAAqB;AACjC,SAAS,kBAAkB;AAC3B,SAAS,sCAAsC;AAC/C,OAAO,oCAAoC;AAC3C;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AASA,MAAM,iCAET,CAAC,EAAE,QAAQ,YAAY,aAAa,MAAM;AAC5C,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAEpD,IAAI;AACN,QAAM,EAAE,uBAAuB,eAAe,IAC5C,2BAA2B,UAAU;AACvC,QAAM,EAAE,KAAK,aAAa,IAAI,sBAAsB;AAEpD,QAAM,wBAAwB,YAAY,MAAM;AAC9C,2BAAuB,IAAI;AAC3B,iBAAa;AAAA,EACf,GAAG,CAAC,YAAY,CAAC;AAEjB,YAAU,MAAM;AACd,QAAI,cAAc;AAChB,4BAAsB,YAAY;AAAA,IACpC;AAAA,EACF,GAAG,CAAC,uBAAuB,YAAY,CAAC;AAExC,QAAM,eAAe,gBAAgB;AAErC,MAAI,CAAC,aAAc,QAAO,gCAAE,mCAAqB;AAEjD,QAAM,aAAyB,aAAa,YAAY;AAExD,SACE,iCACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,wBAAwB;AAAA,QAChC,SAAS,MAAM,uBAAuB,IAAI;AAAA,QAC1C,gBAAc;AAAA,QACd,OAAO,EAAE;AAAA,UACP,IAAI;AAAA,UACJ,IAAI;AAAA,UACJ,IAAI;AAAA,QACN,CAAC;AAAA,QACD,MAAK;AAAA,QACL,cAAa;AAAA,QAEZ,wBACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA;AAAA,QACF;AAAA;AAAA,IAEJ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,aAAa;AAAA;AAAA,IACf;AAAA,KACF;AAEJ;AAMO,MAAM,0BAA4D,CAAC;AAAA,EACxE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,eAAe,IAAI,cAAc,8BAA8B;AACvE,QAAM,KAAK,oBAAoB,YAAY;AAE3C,QAAM,EAAE,gBAAgB,MAAM,IAAI,2BAA2B,YAAY;AACzE,QAAM,EAAE,yBAAyB,IAAI,oBAAoB,CAAC,OAAO;AAAA,IAC/D,0BAA0B,MAAM,EAAE,KAAK,8BAA8B;AAAA,EACvE,EAAE;AAEF,QAAM,eAAe,MAAM;AACzB,UAAM;AACN,6BAAyB;AAAA,EAC3B;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,QACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA,MAEF,YAAY;AAAA,QACV,QAAQ;AAAA,QACR,MAAM;AAAA,MACR;AAAA,MAEC,4BACC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,YAAY;AAAA,UACZ;AAAA;AAAA,MACF;AAAA;AAAA,EAEJ;AAEJ;AAQO,MAAM,oCAET,CAAC,EAAE,QAAQ,YAAY,UAAU,MAAM;AACzC,QAAM,iBAAiB;AAAA,IACrB,WAAW,CAAC,MAAM,EAAE,cAAc;AAAA,EACpC;AACA,QAAM,eAAmC,gBAAgB;AAEzD,MAAI,CAAC,cAAc;AACjB,WAAO,gCAAE;AAAA,EACX;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/DictionaryEditionDrawer/DictionaryEditionDrawer.tsx"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport type { Dictionary, KeyPath } from '@intlayer/core';\nimport {\n  RightDrawer,\n  DictionaryEditor,\n  LocaleSwitcher,\n  Modal,\n  useEditionPanelStore,\n  DictionaryFieldEditor,\n  useRightDrawerStore,\n} from '@intlayer/design-system';\nimport { useGetAllDictionaries } from '@intlayer/design-system/hooks';\nimport { useCallback, useEffect, useState, type FC } from 'react';\nimport { t, useDictionary } from 'react-intlayer';\nimport { useShallow } from 'zustand/shallow';\nimport { dictionaryListDrawerIdentifier } from '../DictionaryListDrawer/dictionaryListDrawerIdentifier';\nimport dictionaryEditionDrawerContent from './dictionaryEditionDrawer.content';\nimport {\n  type FileContent as FileContentWithDictionaryPath,\n  useDictionaryEditionDrawer,\n  getDrawerIdentifier,\n} from './useDictionaryEditionDrawer';\n\ntype DictionaryEditionDrawerContentProps = {\n  focusedContent: FileContentWithDictionaryPath;\n  locale: Locales;\n  identifier: string;\n  handleOnBack: () => void;\n  isDarkMode?: boolean;\n};\n\nexport const DictionaryEditionDrawerContent: FC<\n  DictionaryEditionDrawerContentProps\n> = ({ locale, identifier, handleOnBack, isDarkMode }) => {\n  const [keyPathEditionModal, setKeyPathEditionModal] = useState<\n    KeyPath[] | null\n  >(null);\n  const { setDictionariesRecord, focusedContent } =\n    useDictionaryEditionDrawer(identifier);\n  const { all: dictionaries } = useGetAllDictionaries();\n\n  const onClickDictionaryList = useCallback(() => {\n    setKeyPathEditionModal(null);\n    handleOnBack();\n  }, [handleOnBack]);\n\n  useEffect(() => {\n    if (dictionaries) {\n      setDictionariesRecord(dictionaries);\n    }\n  }, [setDictionariesRecord, dictionaries]);\n\n  const dictionaryKey = focusedContent?.dictionaryKey;\n\n  if (!dictionaryKey) return <>No dictionary focused</>;\n\n  const dictionary: Dictionary = dictionaries[dictionaryKey];\n\n  return (\n    <>\n      <Modal\n        isOpen={keyPathEditionModal !== null}\n        onClose={() => setKeyPathEditionModal(null)}\n        hasCloseButton\n        title={t({\n          en: 'Edit field',\n          fr: 'Modifier le champ',\n          es: 'Editar campo',\n        })}\n        size=\"xl\"\n        transparency=\"lg\"\n      >\n        {dictionary && (\n          <DictionaryFieldEditor\n            dictionary={dictionary}\n            onClickDictionaryList={onClickDictionaryList}\n            isDarkMode={isDarkMode}\n          />\n        )}\n      </Modal>\n      <DictionaryEditor\n        dictionary={dictionary}\n        locale={locale}\n        onClickEdit={setKeyPathEditionModal}\n      />\n    </>\n  );\n};\n\ntype DictionaryEditionDrawerProps = DictionaryEditionDrawerControllerProps & {\n  dictionaryKey: string;\n  isDarkMode?: boolean;\n};\n\nexport const DictionaryEditionDrawer: FC<DictionaryEditionDrawerProps> = ({\n  locale,\n  localeList,\n  setLocale,\n  dictionaryKey,\n  isDarkMode,\n}) => {\n  const { backButtonText } = useDictionary(dictionaryEditionDrawerContent);\n  const id = getDrawerIdentifier(dictionaryKey);\n\n  const { focusedContent, close } = useDictionaryEditionDrawer(dictionaryKey);\n  const { openDictionaryListDrawer } = useRightDrawerStore((s) => ({\n    openDictionaryListDrawer: () => s.open(dictionaryListDrawerIdentifier),\n  }));\n\n  const handleOnBack = () => {\n    close();\n    openDictionaryListDrawer();\n  };\n\n  return (\n    <RightDrawer\n      title={dictionaryKey}\n      identifier={id}\n      header={\n        <LocaleSwitcher\n          setLocale={setLocale}\n          locale={locale}\n          localeList={localeList}\n        />\n      }\n      backButton={{\n        onBack: handleOnBack,\n        text: backButtonText,\n      }}\n    >\n      {focusedContent && (\n        <DictionaryEditionDrawerContent\n          focusedContent={focusedContent}\n          locale={locale}\n          identifier={id}\n          handleOnBack={handleOnBack}\n          isDarkMode={isDarkMode}\n        />\n      )}\n    </RightDrawer>\n  );\n};\n\ntype DictionaryEditionDrawerControllerProps = {\n  locale: Locales;\n  localeList: Locales[];\n  setLocale: (locale: Locales) => void;\n};\n\nexport const DictionaryEditionDrawerController: FC<\n  DictionaryEditionDrawerControllerProps\n> = ({ locale, localeList, setLocale }) => {\n  const focusedContent = useEditionPanelStore(\n    useShallow((s) => s.focusedContent)\n  );\n  const dictionaryKey: string | undefined = focusedContent?.dictionaryKey;\n\n  if (!dictionaryKey) {\n    return <></>;\n  }\n\n  return (\n    <DictionaryEditionDrawer\n      locale={locale}\n      localeList={localeList}\n      setLocale={setLocale}\n      dictionaryKey={dictionaryKey}\n    />\n  );\n};\n"],"mappings":";AAwD6B,wBAKzB,YALyB;AApD7B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,6BAA6B;AACtC,SAAS,aAAa,WAAW,gBAAyB;AAC1D,SAAS,GAAG,qBAAqB;AACjC,SAAS,kBAAkB;AAC3B,SAAS,sCAAsC;AAC/C,OAAO,oCAAoC;AAC3C;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AAUA,MAAM,iCAET,CAAC,EAAE,QAAQ,YAAY,cAAc,WAAW,MAAM;AACxD,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAEpD,IAAI;AACN,QAAM,EAAE,uBAAuB,eAAe,IAC5C,2BAA2B,UAAU;AACvC,QAAM,EAAE,KAAK,aAAa,IAAI,sBAAsB;AAEpD,QAAM,wBAAwB,YAAY,MAAM;AAC9C,2BAAuB,IAAI;AAC3B,iBAAa;AAAA,EACf,GAAG,CAAC,YAAY,CAAC;AAEjB,YAAU,MAAM;AACd,QAAI,cAAc;AAChB,4BAAsB,YAAY;AAAA,IACpC;AAAA,EACF,GAAG,CAAC,uBAAuB,YAAY,CAAC;AAExC,QAAM,gBAAgB,gBAAgB;AAEtC,MAAI,CAAC,cAAe,QAAO,gCAAE,mCAAqB;AAElD,QAAM,aAAyB,aAAa,aAAa;AAEzD,SACE,iCACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,wBAAwB;AAAA,QAChC,SAAS,MAAM,uBAAuB,IAAI;AAAA,QAC1C,gBAAc;AAAA,QACd,OAAO,EAAE;AAAA,UACP,IAAI;AAAA,UACJ,IAAI;AAAA,UACJ,IAAI;AAAA,QACN,CAAC;AAAA,QACD,MAAK;AAAA,QACL,cAAa;AAAA,QAEZ,wBACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA;AAAA,IAEJ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,aAAa;AAAA;AAAA,IACf;AAAA,KACF;AAEJ;AAOO,MAAM,0BAA4D,CAAC;AAAA,EACxE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,eAAe,IAAI,cAAc,8BAA8B;AACvE,QAAM,KAAK,oBAAoB,aAAa;AAE5C,QAAM,EAAE,gBAAgB,MAAM,IAAI,2BAA2B,aAAa;AAC1E,QAAM,EAAE,yBAAyB,IAAI,oBAAoB,CAAC,OAAO;AAAA,IAC/D,0BAA0B,MAAM,EAAE,KAAK,8BAA8B;AAAA,EACvE,EAAE;AAEF,QAAM,eAAe,MAAM;AACzB,UAAM;AACN,6BAAyB;AAAA,EAC3B;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,QACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA,MAEF,YAAY;AAAA,QACV,QAAQ;AAAA,QACR,MAAM;AAAA,MACR;AAAA,MAEC,4BACC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,YAAY;AAAA,UACZ;AAAA,UACA;AAAA;AAAA,MACF;AAAA;AAAA,EAEJ;AAEJ;AAQO,MAAM,oCAET,CAAC,EAAE,QAAQ,YAAY,UAAU,MAAM;AACzC,QAAM,iBAAiB;AAAA,IACrB,WAAW,CAAC,MAAM,EAAE,cAAc;AAAA,EACpC;AACA,QAAM,gBAAoC,gBAAgB;AAE1D,MAAI,CAAC,eAAe;AAClB,WAAO,gCAAE;AAAA,EACX;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/esm/DictionaryEditionDrawer/useDictionaryEditionDrawer.mjs

@@ -5,9 +5,9 @@ import {
 } from "@intlayer/design-system";
 import { useCallback } from "react";
 import { useShallow } from "zustand/shallow";
-const getDrawerIdentifier = (dictionaryId) => `dictionary_edition_${dictionaryId}`;
-const useDictionaryEditionDrawer = (dictionaryId) => {
-  const id = getDrawerIdentifier(dictionaryId);
+const getDrawerIdentifier = (dictionaryKey) => `dictionary_edition_${dictionaryKey}`;
+const useDictionaryEditionDrawer = (dictionaryKey) => {
+  const id = getDrawerIdentifier(dictionaryKey);
   const { isOpenDrawer, openDrawer, closeDrawer } = useRightDrawerStore(
     useShallow((e) => ({
       isOpenDrawer: e.isOpen,
@@ -29,12 +29,12 @@ const useDictionaryEditionDrawer = (dictionaryId) => {
   );
   const openDictionaryEditionDrawer = useCallback(
     ({
-      dictionaryId: dictionaryId2,
+      dictionaryKey: dictionaryKey2,
       dictionaryPath,
       keyPath = []
     }) => {
       setFocusedContent({
-        dictionaryId: dictionaryId2,
+        dictionaryKey: dictionaryKey2,
         dictionaryPath,
         keyPath
       });

package/dist/esm/DictionaryEditionDrawer/useDictionaryEditionDrawer.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/DictionaryEditionDrawer/useDictionaryEditionDrawer.ts"],"sourcesContent":["import type { Dictionary, DictionaryValue, KeyPath } from '@intlayer/core';\nimport {\n  useRightDrawerStore,\n  useEditedContentStore,\n  useEditionPanelStore,\n} from '@intlayer/design-system';\nimport { useCallback } from 'react';\nimport { useShallow } from 'zustand/shallow';\n\nexport const getDrawerIdentifier = (dictionaryId: string) =>\n  `dictionary_edition_${dictionaryId}`;\n\ntype DictionaryId = string;\ntype DictionaryPath = string;\n\nexport type FileContent = {\n  dictionaryPath?: DictionaryPath;\n  dictionaryId: string;\n  keyPath?: KeyPath[];\n};\n\ntype DictionaryEditionDrawer = {\n  focusedContent: FileContent | null;\n  isOpen: boolean;\n  open: (content: FileContent) => void;\n  close: () => void;\n  setDictionariesRecord: (\n    dictionariesRecord: Record<DictionaryId, Dictionary>\n  ) => void;\n  getEditedContentValue: (\n    dictionaryId: DictionaryId,\n    keyPath: KeyPath[]\n  ) => DictionaryValue | undefined;\n};\n\ntype OpenDictionaryEditionDrawerProps = {\n  dictionaryId: string;\n  dictionaryPath?: string;\n  keyPath?: KeyPath[];\n};\n\nexport const useDictionaryEditionDrawer = (\n  dictionaryId: string\n): DictionaryEditionDrawer => {\n  const id = getDrawerIdentifier(dictionaryId);\n  const { isOpenDrawer, openDrawer, closeDrawer } = useRightDrawerStore(\n    useShallow((e) => ({\n      isOpenDrawer: e.isOpen,\n      openDrawer: e.open,\n      closeDrawer: e.close,\n    }))\n  );\n  const { setDictionariesRecord, getEditedContentValue } =\n    useEditedContentStore(\n      useShallow((s) => ({\n        setDictionariesRecord: s.setDictionariesRecord,\n        getEditedContentValue: s.getEditedContentValue,\n      }))\n    );\n  const { setFocusedContent, focusedContent } = useEditionPanelStore(\n    useShallow((s) => ({\n      focusedContent: s.focusedContent,\n      setFocusedContent: s.setFocusedContent,\n    }))\n  );\n\n  const openDictionaryEditionDrawer = useCallback(\n    ({\n      dictionaryId,\n      dictionaryPath,\n      keyPath = [],\n    }: OpenDictionaryEditionDrawerProps) => {\n      setFocusedContent({\n        dictionaryId,\n        dictionaryPath,\n        keyPath,\n      });\n\n      openDrawer(id);\n    },\n    [openDrawer, setFocusedContent]\n  );\n\n  return {\n    isOpen: isOpenDrawer(id),\n    focusedContent,\n    setDictionariesRecord,\n    getEditedContentValue,\n    open: openDictionaryEditionDrawer,\n    close: () => closeDrawer(id),\n  };\n};\n"],"mappings":"AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAEpB,MAAM,sBAAsB,CAAC,iBAClC,sBAAsB,YAAY;AA+B7B,MAAM,6BAA6B,CACxC,iBAC4B;AAC5B,QAAM,KAAK,oBAAoB,YAAY;AAC3C,QAAM,EAAE,cAAc,YAAY,YAAY,IAAI;AAAA,IAChD,WAAW,CAAC,OAAO;AAAA,MACjB,cAAc,EAAE;AAAA,MAChB,YAAY,EAAE;AAAA,MACd,aAAa,EAAE;AAAA,IACjB,EAAE;AAAA,EACJ;AACA,QAAM,EAAE,uBAAuB,sBAAsB,IACnD;AAAA,IACE,WAAW,CAAC,OAAO;AAAA,MACjB,uBAAuB,EAAE;AAAA,MACzB,uBAAuB,EAAE;AAAA,IAC3B,EAAE;AAAA,EACJ;AACF,QAAM,EAAE,mBAAmB,eAAe,IAAI;AAAA,IAC5C,WAAW,CAAC,OAAO;AAAA,MACjB,gBAAgB,EAAE;AAAA,MAClB,mBAAmB,EAAE;AAAA,IACvB,EAAE;AAAA,EACJ;AAEA,QAAM,8BAA8B;AAAA,IAClC,CAAC;AAAA,MACC,cAAAA;AAAA,MACA;AAAA,MACA,UAAU,CAAC;AAAA,IACb,MAAwC;AACtC,wBAAkB;AAAA,QAChB,cAAAA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,iBAAW,EAAE;AAAA,IACf;AAAA,IACA,CAAC,YAAY,iBAAiB;AAAA,EAChC;AAEA,SAAO;AAAA,IACL,QAAQ,aAAa,EAAE;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,OAAO,MAAM,YAAY,EAAE;AAAA,EAC7B;AACF;","names":["dictionaryId"]}
+{"version":3,"sources":["../../../src/DictionaryEditionDrawer/useDictionaryEditionDrawer.ts"],"sourcesContent":["import type { Dictionary, DictionaryValue, KeyPath } from '@intlayer/core';\nimport {\n  useRightDrawerStore,\n  useEditedContentStore,\n  useEditionPanelStore,\n} from '@intlayer/design-system';\nimport { useCallback } from 'react';\nimport { useShallow } from 'zustand/shallow';\n\nexport const getDrawerIdentifier = (dictionaryKey: string) =>\n  `dictionary_edition_${dictionaryKey}`;\n\ntype DictionaryKey = string;\ntype DictionaryPath = string;\n\nexport type FileContent = {\n  dictionaryPath?: DictionaryPath;\n  dictionaryKey: DictionaryKey;\n  keyPath?: KeyPath[];\n};\n\ntype DictionaryEditionDrawer = {\n  focusedContent: FileContent | null;\n  isOpen: boolean;\n  open: (content: FileContent) => void;\n  close: () => void;\n  setDictionariesRecord: (\n    dictionariesRecord: Record<DictionaryKey, Dictionary>\n  ) => void;\n  getEditedContentValue: (\n    dictionaryKey: DictionaryKey,\n    keyPath: KeyPath[]\n  ) => DictionaryValue | undefined;\n};\n\ntype OpenDictionaryEditionDrawerProps = {\n  dictionaryKey: string;\n  dictionaryPath?: string;\n  keyPath?: KeyPath[];\n};\n\nexport const useDictionaryEditionDrawer = (\n  dictionaryKey: string\n): DictionaryEditionDrawer => {\n  const id = getDrawerIdentifier(dictionaryKey);\n  const { isOpenDrawer, openDrawer, closeDrawer } = useRightDrawerStore(\n    useShallow((e) => ({\n      isOpenDrawer: e.isOpen,\n      openDrawer: e.open,\n      closeDrawer: e.close,\n    }))\n  );\n  const { setDictionariesRecord, getEditedContentValue } =\n    useEditedContentStore(\n      useShallow((s) => ({\n        setDictionariesRecord: s.setDictionariesRecord,\n        getEditedContentValue: s.getEditedContentValue,\n      }))\n    );\n  const { setFocusedContent, focusedContent } = useEditionPanelStore(\n    useShallow((s) => ({\n      focusedContent: s.focusedContent,\n      setFocusedContent: s.setFocusedContent,\n    }))\n  );\n\n  const openDictionaryEditionDrawer = useCallback(\n    ({\n      dictionaryKey,\n      dictionaryPath,\n      keyPath = [],\n    }: OpenDictionaryEditionDrawerProps) => {\n      setFocusedContent({\n        dictionaryKey,\n        dictionaryPath,\n        keyPath,\n      });\n\n      openDrawer(id);\n    },\n    [openDrawer, setFocusedContent]\n  );\n\n  return {\n    isOpen: isOpenDrawer(id),\n    focusedContent,\n    setDictionariesRecord,\n    getEditedContentValue,\n    open: openDictionaryEditionDrawer,\n    close: () => closeDrawer(id),\n  };\n};\n"],"mappings":"AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAEpB,MAAM,sBAAsB,CAAC,kBAClC,sBAAsB,aAAa;AA+B9B,MAAM,6BAA6B,CACxC,kBAC4B;AAC5B,QAAM,KAAK,oBAAoB,aAAa;AAC5C,QAAM,EAAE,cAAc,YAAY,YAAY,IAAI;AAAA,IAChD,WAAW,CAAC,OAAO;AAAA,MACjB,cAAc,EAAE;AAAA,MAChB,YAAY,EAAE;AAAA,MACd,aAAa,EAAE;AAAA,IACjB,EAAE;AAAA,EACJ;AACA,QAAM,EAAE,uBAAuB,sBAAsB,IACnD;AAAA,IACE,WAAW,CAAC,OAAO;AAAA,MACjB,uBAAuB,EAAE;AAAA,MACzB,uBAAuB,EAAE;AAAA,IAC3B,EAAE;AAAA,EACJ;AACF,QAAM,EAAE,mBAAmB,eAAe,IAAI;AAAA,IAC5C,WAAW,CAAC,OAAO;AAAA,MACjB,gBAAgB,EAAE;AAAA,MAClB,mBAAmB,EAAE;AAAA,IACvB,EAAE;AAAA,EACJ;AAEA,QAAM,8BAA8B;AAAA,IAClC,CAAC;AAAA,MACC,eAAAA;AAAA,MACA;AAAA,MACA,UAAU,CAAC;AAAA,IACb,MAAwC;AACtC,wBAAkB;AAAA,QAChB,eAAAA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,iBAAW,EAAE;AAAA,IACf;AAAA,IACA,CAAC,YAAY,iBAAiB;AAAA,EAChC;AAEA,SAAO;AAAA,IACL,QAAQ,aAAa,EAAE;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,OAAO,MAAM,YAAY,EAAE;AAAA,EAC7B;AACF;","names":["dictionaryKey"]}

package/dist/esm/DictionaryListDrawer/DictionaryListDrawer.mjs

@@ -31,17 +31,17 @@ const DictionaryListDrawer = () => {
   const setFocusedContent = useEditionPanelStore(
     useShallow((s) => s.setFocusedContent)
   );
-  const handleClickDictionary = (dictionaryId) => {
+  const handleClickDictionary = (dictionaryKey) => {
     closeDrawer(dictionaryListDrawerIdentifier);
-    const { filePath } = dictionaries[dictionaryId];
+    const { filePath } = dictionaries[dictionaryKey];
     setFocusedContent({
-      dictionaryId,
+      dictionaryKey,
       dictionaryPath: filePath
     });
-    openDrawer(getDrawerIdentifier(dictionaryId));
+    openDrawer(getDrawerIdentifier(dictionaryKey));
   };
   const isDictionaryEdited = useCallback(
-    (dictionaryId) => Object.keys(editedContent).includes(dictionaryId),
+    (dictionaryKey) => Object.keys(editedContent).includes(dictionaryKey),
     [editedContent]
   );
   return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
@@ -49,19 +49,19 @@ const DictionaryListDrawer = () => {
     {
       title: "Dictionary list",
       identifier: dictionaryListDrawerIdentifier,
-      children: dictionaryKeyList.map((dictionaryId) => /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+      children: dictionaryKeyList.map((dictionaryKey) => /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
         Button,
         {
-          label: `Open dictionary editor ${dictionaryId}`,
-          onClick: () => handleClickDictionary(dictionaryId),
+          label: `Open dictionary editor ${dictionaryKey}`,
+          onClick: () => handleClickDictionary(dictionaryKey),
           variant: "hoverable",
           color: "text",
           IconRight: ChevronRight,
           size: "md",
           isFullWidth: true,
-          children: isDictionaryEdited(dictionaryId) ? `\u270E ${dictionaryId}` : dictionaryId
+          children: isDictionaryEdited(dictionaryKey) ? `\u270E ${dictionaryKey}` : dictionaryKey
         }
-      ) }, dictionaryId))
+      ) }, dictionaryKey))
     }
   ) });
 };

package/dist/esm/DictionaryListDrawer/DictionaryListDrawer.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/DictionaryListDrawer/DictionaryListDrawer.tsx"],"sourcesContent":["'use client';\n\nimport { Locales } from '@intlayer/config';\nimport {\n  RightDrawer,\n  Button,\n  useEditedContentStore,\n  useEditionPanelStore,\n  useRightDrawerStore,\n} from '@intlayer/design-system';\nimport { useGetAllDictionaries } from '@intlayer/design-system/hooks';\nimport { ChevronRight } from 'lucide-react';\nimport { useCallback, useMemo, FC } from 'react';\nimport { useShallow } from 'zustand/shallow';\nimport { getDrawerIdentifier } from '../DictionaryEditionDrawer/useDictionaryEditionDrawer';\nimport { dictionaryListDrawerIdentifier } from './dictionaryListDrawerIdentifier';\n\nexport const DictionaryListDrawer: FC = () => {\n  const { all: dictionaries } = useGetAllDictionaries();\n  const dictionaryKeyList = useMemo(\n    () => Object.keys(dictionaries) as Locales[],\n    [dictionaries]\n  );\n\n  const { closeDrawer, openDrawer } = useRightDrawerStore(\n    useShallow((s) => ({\n      closeDrawer: s.close,\n      openDrawer: s.open,\n    }))\n  );\n\n  const editedContent = useEditedContentStore(\n    useShallow((s) => s.editedContent)\n  );\n  const setFocusedContent = useEditionPanelStore(\n    useShallow((s) => s.setFocusedContent)\n  );\n\n  const handleClickDictionary = (dictionaryId: string) => {\n    closeDrawer(dictionaryListDrawerIdentifier);\n\n    const { filePath } = dictionaries[dictionaryId];\n    setFocusedContent({\n      dictionaryId,\n      dictionaryPath: filePath,\n    });\n\n    openDrawer(getDrawerIdentifier(dictionaryId));\n  };\n\n  const isDictionaryEdited = useCallback(\n    (dictionaryId: string) => Object.keys(editedContent).includes(dictionaryId),\n    [editedContent]\n  );\n\n  return (\n    <>\n      <RightDrawer\n        title=\"Dictionary list\"\n        identifier={dictionaryListDrawerIdentifier}\n      >\n        {dictionaryKeyList.map((dictionaryId) => (\n          <div key={dictionaryId}>\n            <Button\n              label={`Open dictionary editor ${dictionaryId}`}\n              onClick={() => handleClickDictionary(dictionaryId)}\n              variant=\"hoverable\"\n              color=\"text\"\n              IconRight={ChevronRight}\n              size=\"md\"\n              isFullWidth\n            >\n              {isDictionaryEdited(dictionaryId)\n                ? `✎ ${dictionaryId}`\n                : dictionaryId}\n            </Button>\n          </div>\n        ))}\n      </RightDrawer>\n    </>\n  );\n};\n"],"mappings":";AAwDI,mBAOQ,WAPR;AArDJ;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,6BAA6B;AACtC,SAAS,oBAAoB;AAC7B,SAAS,aAAa,eAAmB;AACzC,SAAS,kBAAkB;AAC3B,SAAS,2BAA2B;AACpC,SAAS,sCAAsC;AAExC,MAAM,uBAA2B,MAAM;AAC5C,QAAM,EAAE,KAAK,aAAa,IAAI,sBAAsB;AACpD,QAAM,oBAAoB;AAAA,IACxB,MAAM,OAAO,KAAK,YAAY;AAAA,IAC9B,CAAC,YAAY;AAAA,EACf;AAEA,QAAM,EAAE,aAAa,WAAW,IAAI;AAAA,IAClC,WAAW,CAAC,OAAO;AAAA,MACjB,aAAa,EAAE;AAAA,MACf,YAAY,EAAE;AAAA,IAChB,EAAE;AAAA,EACJ;AAEA,QAAM,gBAAgB;AAAA,IACpB,WAAW,CAAC,MAAM,EAAE,aAAa;AAAA,EACnC;AACA,QAAM,oBAAoB;AAAA,IACxB,WAAW,CAAC,MAAM,EAAE,iBAAiB;AAAA,EACvC;AAEA,QAAM,wBAAwB,CAAC,iBAAyB;AACtD,gBAAY,8BAA8B;AAE1C,UAAM,EAAE,SAAS,IAAI,aAAa,YAAY;AAC9C,sBAAkB;AAAA,MAChB;AAAA,MACA,gBAAgB;AAAA,IAClB,CAAC;AAED,eAAW,oBAAoB,YAAY,CAAC;AAAA,EAC9C;AAEA,QAAM,qBAAqB;AAAA,IACzB,CAAC,iBAAyB,OAAO,KAAK,aAAa,EAAE,SAAS,YAAY;AAAA,IAC1E,CAAC,aAAa;AAAA,EAChB;AAEA,SACE,gCACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,YAAY;AAAA,MAEX,4BAAkB,IAAI,CAAC,iBACtB,oBAAC,SACC;AAAA,QAAC;AAAA;AAAA,UACC,OAAO,0BAA0B,YAAY;AAAA,UAC7C,SAAS,MAAM,sBAAsB,YAAY;AAAA,UACjD,SAAQ;AAAA,UACR,OAAM;AAAA,UACN,WAAW;AAAA,UACX,MAAK;AAAA,UACL,aAAW;AAAA,UAEV,6BAAmB,YAAY,IAC5B,UAAK,YAAY,KACjB;AAAA;AAAA,MACN,KAbQ,YAcV,CACD;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/DictionaryListDrawer/DictionaryListDrawer.tsx"],"sourcesContent":["'use client';\n\nimport { Locales } from '@intlayer/config';\nimport {\n  RightDrawer,\n  Button,\n  useEditedContentStore,\n  useEditionPanelStore,\n  useRightDrawerStore,\n} from '@intlayer/design-system';\nimport { useGetAllDictionaries } from '@intlayer/design-system/hooks';\nimport { ChevronRight } from 'lucide-react';\nimport { useCallback, useMemo, FC } from 'react';\nimport { useShallow } from 'zustand/shallow';\nimport { getDrawerIdentifier } from '../DictionaryEditionDrawer/useDictionaryEditionDrawer';\nimport { dictionaryListDrawerIdentifier } from './dictionaryListDrawerIdentifier';\n\nexport const DictionaryListDrawer: FC = () => {\n  const { all: dictionaries } = useGetAllDictionaries();\n  const dictionaryKeyList = useMemo(\n    () => Object.keys(dictionaries) as Locales[],\n    [dictionaries]\n  );\n\n  const { closeDrawer, openDrawer } = useRightDrawerStore(\n    useShallow((s) => ({\n      closeDrawer: s.close,\n      openDrawer: s.open,\n    }))\n  );\n\n  const editedContent = useEditedContentStore(\n    useShallow((s) => s.editedContent)\n  );\n  const setFocusedContent = useEditionPanelStore(\n    useShallow((s) => s.setFocusedContent)\n  );\n\n  const handleClickDictionary = (dictionaryKey: string) => {\n    closeDrawer(dictionaryListDrawerIdentifier);\n\n    const { filePath } = dictionaries[dictionaryKey];\n    setFocusedContent({\n      dictionaryKey,\n      dictionaryPath: filePath,\n    });\n\n    openDrawer(getDrawerIdentifier(dictionaryKey));\n  };\n\n  const isDictionaryEdited = useCallback(\n    (dictionaryKey: string) =>\n      Object.keys(editedContent).includes(dictionaryKey),\n    [editedContent]\n  );\n\n  return (\n    <>\n      <RightDrawer\n        title=\"Dictionary list\"\n        identifier={dictionaryListDrawerIdentifier}\n      >\n        {dictionaryKeyList.map((dictionaryKey) => (\n          <div key={dictionaryKey}>\n            <Button\n              label={`Open dictionary editor ${dictionaryKey}`}\n              onClick={() => handleClickDictionary(dictionaryKey)}\n              variant=\"hoverable\"\n              color=\"text\"\n              IconRight={ChevronRight}\n              size=\"md\"\n              isFullWidth\n            >\n              {isDictionaryEdited(dictionaryKey)\n                ? `✎ ${dictionaryKey}`\n                : dictionaryKey}\n            </Button>\n          </div>\n        ))}\n      </RightDrawer>\n    </>\n  );\n};\n"],"mappings":";AAyDI,mBAOQ,WAPR;AAtDJ;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,6BAA6B;AACtC,SAAS,oBAAoB;AAC7B,SAAS,aAAa,eAAmB;AACzC,SAAS,kBAAkB;AAC3B,SAAS,2BAA2B;AACpC,SAAS,sCAAsC;AAExC,MAAM,uBAA2B,MAAM;AAC5C,QAAM,EAAE,KAAK,aAAa,IAAI,sBAAsB;AACpD,QAAM,oBAAoB;AAAA,IACxB,MAAM,OAAO,KAAK,YAAY;AAAA,IAC9B,CAAC,YAAY;AAAA,EACf;AAEA,QAAM,EAAE,aAAa,WAAW,IAAI;AAAA,IAClC,WAAW,CAAC,OAAO;AAAA,MACjB,aAAa,EAAE;AAAA,MACf,YAAY,EAAE;AAAA,IAChB,EAAE;AAAA,EACJ;AAEA,QAAM,gBAAgB;AAAA,IACpB,WAAW,CAAC,MAAM,EAAE,aAAa;AAAA,EACnC;AACA,QAAM,oBAAoB;AAAA,IACxB,WAAW,CAAC,MAAM,EAAE,iBAAiB;AAAA,EACvC;AAEA,QAAM,wBAAwB,CAAC,kBAA0B;AACvD,gBAAY,8BAA8B;AAE1C,UAAM,EAAE,SAAS,IAAI,aAAa,aAAa;AAC/C,sBAAkB;AAAA,MAChB;AAAA,MACA,gBAAgB;AAAA,IAClB,CAAC;AAED,eAAW,oBAAoB,aAAa,CAAC;AAAA,EAC/C;AAEA,QAAM,qBAAqB;AAAA,IACzB,CAAC,kBACC,OAAO,KAAK,aAAa,EAAE,SAAS,aAAa;AAAA,IACnD,CAAC,aAAa;AAAA,EAChB;AAEA,SACE,gCACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,YAAY;AAAA,MAEX,4BAAkB,IAAI,CAAC,kBACtB,oBAAC,SACC;AAAA,QAAC;AAAA;AAAA,UACC,OAAO,0BAA0B,aAAa;AAAA,UAC9C,SAAS,MAAM,sBAAsB,aAAa;AAAA,UAClD,SAAQ;AAAA,UACR,OAAM;AAAA,UACN,WAAW;AAAA,UACX,MAAK;AAAA,UACL,aAAW;AAAA,UAEV,6BAAmB,aAAa,IAC7B,UAAK,aAAa,KAClB;AAAA;AAAA,MACN,KAbQ,aAcV,CACD;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}

package/dist/esm/IntlayerEditorProvider.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { getConfiguration } from "@intlayer/config/client";
+import { appLogger, getConfiguration } from "@intlayer/config/client";
 import { DictionaryEditionDrawerController } from './DictionaryEditionDrawer/index.mjs';
 import { DictionaryListDrawer } from './DictionaryListDrawer/index.mjs';
 import { useIntlayerContext } from "react-intlayer";
@@ -37,13 +37,19 @@ const IntlayerEditorProvider = ({
   useEffect(() => {
     if (isEnabled && editor.enabled) {
       if (!editor.clientId) {
-        console.error(
-          "Editor is enabled but clientId is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor."
+        appLogger(
+          "Editor is enabled but clientId is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.",
+          {
+            level: "error"
+          }
         );
       }
       if (!editor.clientSecret) {
-        console.error(
-          "Editor is enabled but clientSecret is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor."
+        appLogger(
+          "Editor is enabled but clientSecret is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.",
+          {
+            level: "error"
+          }
         );
       }
     }

package/dist/esm/IntlayerEditorProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration } from '@intlayer/config/client';\nimport { DictionaryEditionDrawerController } from './DictionaryEditionDrawer/index';\nimport { DictionaryListDrawer } from './DictionaryListDrawer/index';\nimport { useIntlayerContext } from 'react-intlayer';\nimport { useContentSelectorContext } from 'react-intlayer/editor';\nimport { ContentSelectorWrapper } from './ContentSelectorWrapper';\nimport {\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useEffect,\n  useMemo,\n} from 'react';\n\ntype IntlayerEditorValue = {\n  isEditorEnabled: boolean;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerEditorContext = createContext<IntlayerEditorValue>({\n  isEditorEnabled: false,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerEditorContext = () => useContext(IntlayerEditorContext);\n\nexport type IntlayerEditorProviderProps = PropsWithChildren<{\n  isEnabled?: boolean;\n}>;\n\n/**\n * Provider that store the current locale on the client side\n */\nexport const IntlayerEditorProvider: FC<IntlayerEditorProviderProps> = ({\n  children,\n  isEnabled = true,\n}) => {\n  const { editor, internationalization } = getConfiguration();\n\n  const { setState } = useContentSelectorContext();\n\n  const { locale, setLocale } = useIntlayerContext();\n\n  const isEditorEnabled = useMemo(\n    () =>\n      Boolean(\n        editor.enabled && editor.clientId && editor.clientSecret && isEnabled\n      ),\n    [editor.enabled && editor.clientId && editor.clientSecret && isEnabled]\n  );\n\n  useEffect(() => {\n    setState({\n      ContentSelectorWrapper,\n    });\n  }, [setState]);\n\n  useEffect(() => {\n    if (isEnabled && editor.enabled) {\n      if (!editor.clientId) {\n        console.error(\n          'Editor is enabled but clientId is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.'\n        );\n      }\n\n      if (!editor.clientSecret) {\n        console.error(\n          'Editor is enabled but clientSecret is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.'\n        );\n      }\n    }\n  }, [isEnabled, editor.enabled, editor.clientId, editor.clientSecret]);\n\n  return (\n    <IntlayerEditorContext.Provider value={{ isEditorEnabled }}>\n      {children}\n\n      {isEditorEnabled && (\n        <>\n          <DictionaryEditionDrawerController\n            locale={locale}\n            localeList={internationalization.locales}\n            setLocale={setLocale}\n          />\n          <DictionaryListDrawer />\n        </>\n      )}\n    </IntlayerEditorContext.Provider>\n  );\n};\n"],"mappings":";AAqFQ,mBACE,KADF;AAnFR,SAAS,wBAAwB;AACjC,SAAS,yCAAyC;AAClD,SAAS,4BAA4B;AACrC,SAAS,0BAA0B;AACnC,SAAS,iCAAiC;AAC1C,SAAS,8BAA8B;AACvC;AAAA,EAGE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AASA,MAAM,wBAAwB,cAAmC;AAAA,EACtE,iBAAiB;AACnB,CAAC;AAKM,MAAM,2BAA2B,MAAM,WAAW,qBAAqB;AASvE,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA,YAAY;AACd,MAAM;AACJ,QAAM,EAAE,QAAQ,qBAAqB,IAAI,iBAAiB;AAE1D,QAAM,EAAE,SAAS,IAAI,0BAA0B;AAE/C,QAAM,EAAE,QAAQ,UAAU,IAAI,mBAAmB;AAEjD,QAAM,kBAAkB;AAAA,IACtB,MACE;AAAA,MACE,OAAO,WAAW,OAAO,YAAY,OAAO,gBAAgB;AAAA,IAC9D;AAAA,IACF,CAAC,OAAO,WAAW,OAAO,YAAY,OAAO,gBAAgB,SAAS;AAAA,EACxE;AAEA,YAAU,MAAM;AACd,aAAS;AAAA,MACP;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,QAAQ,CAAC;AAEb,YAAU,MAAM;AACd,QAAI,aAAa,OAAO,SAAS;AAC/B,UAAI,CAAC,OAAO,UAAU;AACpB,gBAAQ;AAAA,UACN;AAAA,QACF;AAAA,MACF;AAEA,UAAI,CAAC,OAAO,cAAc;AACxB,gBAAQ;AAAA,UACN;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,WAAW,OAAO,SAAS,OAAO,UAAU,OAAO,YAAY,CAAC;AAEpE,SACE,qBAAC,sBAAsB,UAAtB,EAA+B,OAAO,EAAE,gBAAgB,GACtD;AAAA;AAAA,IAEA,mBACC,iCACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,YAAY,qBAAqB;AAAA,UACjC;AAAA;AAAA,MACF;AAAA,MACA,oBAAC,wBAAqB;AAAA,OACxB;AAAA,KAEJ;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport { appLogger, getConfiguration } from '@intlayer/config/client';\nimport { DictionaryEditionDrawerController } from './DictionaryEditionDrawer/index';\nimport { DictionaryListDrawer } from './DictionaryListDrawer/index';\nimport { useIntlayerContext } from 'react-intlayer';\nimport { useContentSelectorContext } from 'react-intlayer/editor';\nimport { ContentSelectorWrapper } from './ContentSelectorWrapper';\nimport {\n  type FC,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useEffect,\n  useMemo,\n} from 'react';\n\ntype IntlayerEditorValue = {\n  isEditorEnabled: boolean;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerEditorContext = createContext<IntlayerEditorValue>({\n  isEditorEnabled: false,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerEditorContext = () => useContext(IntlayerEditorContext);\n\nexport type IntlayerEditorProviderProps = PropsWithChildren<{\n  isEnabled?: boolean;\n}>;\n\n/**\n * Provider that store the current locale on the client side\n */\nexport const IntlayerEditorProvider: FC<IntlayerEditorProviderProps> = ({\n  children,\n  isEnabled = true,\n}) => {\n  const { editor, internationalization } = getConfiguration();\n\n  const { setState } = useContentSelectorContext();\n\n  const { locale, setLocale } = useIntlayerContext();\n\n  const isEditorEnabled = useMemo(\n    () =>\n      Boolean(\n        editor.enabled && editor.clientId && editor.clientSecret && isEnabled\n      ),\n    [editor.enabled && editor.clientId && editor.clientSecret && isEnabled]\n  );\n\n  useEffect(() => {\n    setState({\n      ContentSelectorWrapper,\n    });\n  }, [setState]);\n\n  useEffect(() => {\n    if (isEnabled && editor.enabled) {\n      if (!editor.clientId) {\n        appLogger(\n          'Editor is enabled but clientId is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.',\n          {\n            level: 'error',\n          }\n        );\n      }\n\n      if (!editor.clientSecret) {\n        appLogger(\n          'Editor is enabled but clientSecret is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor.',\n          {\n            level: 'error',\n          }\n        );\n      }\n    }\n  }, [isEnabled, editor.enabled, editor.clientId, editor.clientSecret]);\n\n  return (\n    <IntlayerEditorContext.Provider value={{ isEditorEnabled }}>\n      {children}\n\n      {isEditorEnabled && (\n        <>\n          <DictionaryEditionDrawerController\n            locale={locale}\n            localeList={internationalization.locales}\n            setLocale={setLocale}\n          />\n          <DictionaryListDrawer />\n        </>\n      )}\n    </IntlayerEditorContext.Provider>\n  );\n};\n"],"mappings":";AA2FQ,mBACE,KADF;AAzFR,SAAS,WAAW,wBAAwB;AAC5C,SAAS,yCAAyC;AAClD,SAAS,4BAA4B;AACrC,SAAS,0BAA0B;AACnC,SAAS,iCAAiC;AAC1C,SAAS,8BAA8B;AACvC;AAAA,EAGE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AASA,MAAM,wBAAwB,cAAmC;AAAA,EACtE,iBAAiB;AACnB,CAAC;AAKM,MAAM,2BAA2B,MAAM,WAAW,qBAAqB;AASvE,MAAM,yBAA0D,CAAC;AAAA,EACtE;AAAA,EACA,YAAY;AACd,MAAM;AACJ,QAAM,EAAE,QAAQ,qBAAqB,IAAI,iBAAiB;AAE1D,QAAM,EAAE,SAAS,IAAI,0BAA0B;AAE/C,QAAM,EAAE,QAAQ,UAAU,IAAI,mBAAmB;AAEjD,QAAM,kBAAkB;AAAA,IACtB,MACE;AAAA,MACE,OAAO,WAAW,OAAO,YAAY,OAAO,gBAAgB;AAAA,IAC9D;AAAA,IACF,CAAC,OAAO,WAAW,OAAO,YAAY,OAAO,gBAAgB,SAAS;AAAA,EACxE;AAEA,YAAU,MAAM;AACd,aAAS;AAAA,MACP;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,QAAQ,CAAC;AAEb,YAAU,MAAM;AACd,QAAI,aAAa,OAAO,SAAS;AAC/B,UAAI,CAAC,OAAO,UAAU;AACpB;AAAA,UACE;AAAA,UACA;AAAA,YACE,OAAO;AAAA,UACT;AAAA,QACF;AAAA,MACF;AAEA,UAAI,CAAC,OAAO,cAAc;AACxB;AAAA,UACE;AAAA,UACA;AAAA,YACE,OAAO;AAAA,UACT;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,WAAW,OAAO,SAAS,OAAO,UAAU,OAAO,YAAY,CAAC;AAEpE,SACE,qBAAC,sBAAsB,UAAtB,EAA+B,OAAO,EAAE,gBAAgB,GACtD;AAAA;AAAA,IAEA,mBACC,iCACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,YAAY,qBAAqB;AAAA,UACjC;AAAA;AAAA,MACF;AAAA,MACA,oBAAC,wBAAqB;AAAA,OACxB;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/types/ContentSelectorWrapper.d.ts

@@ -2,7 +2,7 @@ import { type KeyPath } from '@intlayer/core';
 import { type FC, type ReactNode } from 'react';
 type ContentSelectorWrapperProps = {
     children: ReactNode;
-    dictionaryId: string;
+    dictionaryKey: string;
     dictionaryPath: string;
     keyPath: KeyPath[];
 };

package/dist/types/ContentSelectorWrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContentSelectorWrapper.d.ts","sourceRoot":"","sources":["../../src/ContentSelectorWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiB,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAKL,KAAK,EAAE,EACP,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,KAAK,2BAA2B,GAAG;IACjC,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,MAAM,CAAC;IACvB,OAAO,EAAE,OAAO,EAAE,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,2BAA2B,CAgDlE,CAAC"}
+{"version":3,"file":"ContentSelectorWrapper.d.ts","sourceRoot":"","sources":["../../src/ContentSelectorWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiB,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAK7D,OAAO,EAKL,KAAK,EAAE,EACP,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,KAAK,2BAA2B,GAAG;IACjC,QAAQ,EAAE,SAAS,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,OAAO,EAAE,OAAO,EAAE,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,2BAA2B,CA+DlE,CAAC"}

package/dist/types/DictionaryEditionDrawer/DictionaryEditionDrawer.d.ts

@@ -6,10 +6,12 @@ type DictionaryEditionDrawerContentProps = {
     locale: Locales;
     identifier: string;
     handleOnBack: () => void;
+    isDarkMode?: boolean;
 };
 export declare const DictionaryEditionDrawerContent: FC<DictionaryEditionDrawerContentProps>;
 type DictionaryEditionDrawerProps = DictionaryEditionDrawerControllerProps & {
-    dictionaryId: string;
+    dictionaryKey: string;
+    isDarkMode?: boolean;
 };
 export declare const DictionaryEditionDrawer: FC<DictionaryEditionDrawerProps>;
 type DictionaryEditionDrawerControllerProps = {

package/dist/types/DictionaryEditionDrawer/DictionaryEditionDrawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DictionaryEditionDrawer.d.ts","sourceRoot":"","sources":["../../../src/DictionaryEditionDrawer/DictionaryEditionDrawer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAYvD,OAAO,EAAoC,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAKlE,OAAO,EACL,KAAK,WAAW,IAAI,6BAA6B,EAGlD,MAAM,8BAA8B,CAAC;AAEtC,KAAK,mCAAmC,GAAG;IACzC,cAAc,EAAE,6BAA6B,CAAC;IAC9C,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,8BAA8B,EAAE,EAAE,CAC7C,mCAAmC,CAsDpC,CAAC;AAEF,KAAK,4BAA4B,GAAG,sCAAsC,GAAG;IAC3E,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,EAAE,CAAC,4BAA4B,CA6CpE,CAAC;AAEF,KAAK,sCAAsC,GAAG;IAC5C,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,OAAO,EAAE,CAAC;IACtB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CACtC,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,EAAE,CAChD,sCAAsC,CAmBvC,CAAC"}
+{"version":3,"file":"DictionaryEditionDrawer.d.ts","sourceRoot":"","sources":["../../../src/DictionaryEditionDrawer/DictionaryEditionDrawer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAYvD,OAAO,EAAoC,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAKlE,OAAO,EACL,KAAK,WAAW,IAAI,6BAA6B,EAGlD,MAAM,8BAA8B,CAAC;AAEtC,KAAK,mCAAmC,GAAG;IACzC,cAAc,EAAE,6BAA6B,CAAC;IAC9C,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,8BAA8B,EAAE,EAAE,CAC7C,mCAAmC,CAuDpC,CAAC;AAEF,KAAK,4BAA4B,GAAG,sCAAsC,GAAG;IAC3E,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,EAAE,CAAC,4BAA4B,CA+CpE,CAAC;AAEF,KAAK,sCAAsC,GAAG;IAC5C,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,OAAO,EAAE,CAAC;IACtB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CACtC,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,EAAE,CAChD,sCAAsC,CAmBvC,CAAC"}

package/dist/types/DictionaryEditionDrawer/useDictionaryEditionDrawer.d.ts

@@ -1,10 +1,10 @@
 import type { Dictionary, DictionaryValue, KeyPath } from '@intlayer/core';
-export declare const getDrawerIdentifier: (dictionaryId: string) => string;
-type DictionaryId = string;
+export declare const getDrawerIdentifier: (dictionaryKey: string) => string;
+type DictionaryKey = string;
 type DictionaryPath = string;
 export type FileContent = {
     dictionaryPath?: DictionaryPath;
-    dictionaryId: string;
+    dictionaryKey: DictionaryKey;
     keyPath?: KeyPath[];
 };
 type DictionaryEditionDrawer = {
@@ -12,9 +12,9 @@ type DictionaryEditionDrawer = {
     isOpen: boolean;
     open: (content: FileContent) => void;
     close: () => void;
-    setDictionariesRecord: (dictionariesRecord: Record<DictionaryId, Dictionary>) => void;
-    getEditedContentValue: (dictionaryId: DictionaryId, keyPath: KeyPath[]) => DictionaryValue | undefined;
+    setDictionariesRecord: (dictionariesRecord: Record<DictionaryKey, Dictionary>) => void;
+    getEditedContentValue: (dictionaryKey: DictionaryKey, keyPath: KeyPath[]) => DictionaryValue | undefined;
 };
-export declare const useDictionaryEditionDrawer: (dictionaryId: string) => DictionaryEditionDrawer;
+export declare const useDictionaryEditionDrawer: (dictionaryKey: string) => DictionaryEditionDrawer;
 export {};
 //# sourceMappingURL=useDictionaryEditionDrawer.d.ts.map

package/dist/types/DictionaryEditionDrawer/useDictionaryEditionDrawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDictionaryEditionDrawer.d.ts","sourceRoot":"","sources":["../../../src/DictionaryEditionDrawer/useDictionaryEditionDrawer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAS3E,eAAO,MAAM,mBAAmB,iBAAkB,MAAM,WAClB,CAAC;AAEvC,KAAK,YAAY,GAAG,MAAM,CAAC;AAC3B,KAAK,cAAc,GAAG,MAAM,CAAC;AAE7B,MAAM,MAAM,WAAW,GAAG;IACxB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;CACrB,CAAC;AAEF,KAAK,uBAAuB,GAAG;IAC7B,cAAc,EAAE,WAAW,GAAG,IAAI,CAAC;IACnC,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;IACrC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,qBAAqB,EAAE,CACrB,kBAAkB,EAAE,MAAM,CAAC,YAAY,EAAE,UAAU,CAAC,KACjD,IAAI,CAAC;IACV,qBAAqB,EAAE,CACrB,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,EAAE,KACf,eAAe,GAAG,SAAS,CAAC;CAClC,CAAC;AAQF,eAAO,MAAM,0BAA0B,iBACvB,MAAM,KACnB,uBAgDF,CAAC"}
+{"version":3,"file":"useDictionaryEditionDrawer.d.ts","sourceRoot":"","sources":["../../../src/DictionaryEditionDrawer/useDictionaryEditionDrawer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAS3E,eAAO,MAAM,mBAAmB,kBAAmB,MAAM,WAClB,CAAC;AAExC,KAAK,aAAa,GAAG,MAAM,CAAC;AAC5B,KAAK,cAAc,GAAG,MAAM,CAAC;AAE7B,MAAM,MAAM,WAAW,GAAG;IACxB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,aAAa,EAAE,aAAa,CAAC;IAC7B,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;CACrB,CAAC;AAEF,KAAK,uBAAuB,GAAG;IAC7B,cAAc,EAAE,WAAW,GAAG,IAAI,CAAC;IACnC,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;IACrC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,qBAAqB,EAAE,CACrB,kBAAkB,EAAE,MAAM,CAAC,aAAa,EAAE,UAAU,CAAC,KAClD,IAAI,CAAC;IACV,qBAAqB,EAAE,CACrB,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,OAAO,EAAE,KACf,eAAe,GAAG,SAAS,CAAC;CAClC,CAAC;AAQF,eAAO,MAAM,0BAA0B,kBACtB,MAAM,KACpB,uBAgDF,CAAC"}

package/dist/types/DictionaryListDrawer/DictionaryListDrawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DictionaryListDrawer.d.ts","sourceRoot":"","sources":["../../../src/DictionaryListDrawer/DictionaryListDrawer.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAwB,EAAE,EAAE,MAAM,OAAO,CAAC;AAKjD,eAAO,MAAM,oBAAoB,EAAE,EAgElC,CAAC"}
+{"version":3,"file":"DictionaryListDrawer.d.ts","sourceRoot":"","sources":["../../../src/DictionaryListDrawer/DictionaryListDrawer.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAwB,EAAE,EAAE,MAAM,OAAO,CAAC;AAKjD,eAAO,MAAM,oBAAoB,EAAE,EAiElC,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"IntlayerEditorProvider.d.ts","sourceRoot":"","sources":["../../src/IntlayerEditorProvider.tsx"],"names":[],"mappings":"AAQA,OAAO,EACL,KAAK,EAAE,EACP,KAAK,iBAAiB,EAKvB,MAAM,OAAO,CAAC;AAEf,KAAK,mBAAmB,GAAG;IACzB,eAAe,EAAE,OAAO,CAAC;CAC1B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,8CAEhC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,wBAAwB,2BAA0C,CAAC;AAEhF,MAAM,MAAM,2BAA2B,GAAG,iBAAiB,CAAC;IAC1D,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,2BAA2B,CAwDlE,CAAC"}
+{"version":3,"file":"IntlayerEditorProvider.d.ts","sourceRoot":"","sources":["../../src/IntlayerEditorProvider.tsx"],"names":[],"mappings":"AAQA,OAAO,EACL,KAAK,EAAE,EACP,KAAK,iBAAiB,EAKvB,MAAM,OAAO,CAAC;AAEf,KAAK,mBAAmB,GAAG;IACzB,eAAe,EAAE,OAAO,CAAC;CAC1B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,8CAEhC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,wBAAwB,2BAA0C,CAAC;AAEhF,MAAM,MAAM,2BAA2B,GAAG,iBAAiB,CAAC;IAC1D,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,2BAA2B,CA8DlE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intlayer-editor",
-  "version": "3.5.4",
+  "version": "3.5.5",
   "private": false,
   "description": "IntLayer Editor is a tool that allow you to edit your IntLayer declaration files using a graphical interface.",
   "keywords": [
@@ -74,10 +74,10 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "zustand": "^5.0.1",
-    "@intlayer/config": "^3.5.4",
-    "@intlayer/core": "^3.5.4",
-    "intlayer": "^3.5.4",
-    "@intlayer/design-system": "^3.5.4"
+    "@intlayer/config": "^3.5.5",
+    "intlayer": "^3.5.5",
+    "@intlayer/core": "^3.5.5",
+    "@intlayer/design-system": "^3.5.5"
   },
   "devDependencies": {
     "@babel/generator": "7.26.2",
@@ -98,17 +98,17 @@
     "tsc-alias": "^1.8.10",
     "tsup": "^8.3.5",
     "typescript": "^5.7.2",
-    "@utils/ts-config": "^1.0.4",
     "@utils/eslint-config": "^1.0.4",
+    "@utils/ts-config": "^1.0.4",
     "@utils/ts-config-types": "^1.0.4",
     "@utils/tsup-config": "^1.0.4"
   },
   "peerDependencies": {
-    "@intlayer/core": "^3.5.4",
-    "intlayer": "^3.5.4",
-    "@intlayer/config": "^3.5.4",
-    "@intlayer/design-system": "^3.5.4",
-    "react-intlayer": "^3.5.4"
+    "@intlayer/config": "^3.5.5",
+    "@intlayer/core": "^3.5.5",
+    "@intlayer/design-system": "^3.5.5",
+    "intlayer": "^3.5.5",
+    "react-intlayer": "^3.5.5"
   },
   "engines": {
     "node": ">=14.18"