intlayer-editor 3.5.4 → 3.5.6

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,8 @@ 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, localeList, identifier, handleOnBack, isDarkMode }) => {
+  const { modalTitle } = (0, import_react_intlayer.useDictionary)(import_dictionaryEditionDrawer.default);
   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 +57,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,
@@ -66,18 +67,16 @@ const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) =>
         isOpen: keyPathEditionModal !== null,
         onClose: () => setKeyPathEditionModal(null),
         hasCloseButton: true,
-        title: (0, import_react_intlayer.t)({
-          en: "Edit field",
-          fr: "Modifier le champ",
-          es: "Editar campo"
-        }),
+        title: modalTitle,
         size: "xl",
         transparency: "lg",
         children: dictionary && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           import_design_system.DictionaryFieldEditor,
           {
             dictionary,
-            onClickDictionaryList
+            onClickDictionaryList,
+            isDarkMode,
+            availableLocales: localeList
           }
         )
       }
@@ -96,11 +95,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 +111,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 +131,9 @@ const DictionaryEditionDrawer = ({
           focusedContent,
           locale,
           identifier: id,
-          handleOnBack
+          handleOnBack,
+          isDarkMode,
+          localeList
         }
       )
     }
@@ -141,8 +143,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 +153,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  localeList: Locales[];\n  identifier: string;\n  handleOnBack: () => void;\n  isDarkMode?: boolean;\n};\n\nexport const DictionaryEditionDrawerContent: FC<\n  DictionaryEditionDrawerContentProps\n> = ({ locale, localeList, identifier, handleOnBack, isDarkMode }) => {\n  const { modalTitle } = useDictionary(dictionaryEditionDrawerContent);\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={modalTitle}\n        size=\"xl\"\n        transparency=\"lg\"\n      >\n        {dictionary && (\n          <DictionaryFieldEditor\n            dictionary={dictionary}\n            onClickDictionaryList={onClickDictionaryList}\n            isDarkMode={isDarkMode}\n            availableLocales={localeList}\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          localeList={localeList}\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;AA0D6B;AAtD7B,2BAQO;AACP,mBAAsC;AACtC,mBAA0D;AAC1D,4BAAiC;AACjC,qBAA2B;AAC3B,4CAA+C;AAC/C,qCAA2C;AAC3C,wCAIO;AAWA,MAAM,iCAET,CAAC,EAAE,QAAQ,YAAY,YAAY,cAAc,WAAW,MAAM;AACpE,QAAM,EAAE,WAAW,QAAI,qCAAc,+BAAAA,OAA8B;AACnE,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,OAAO;AAAA,QACP,MAAK;AAAA,QACL,cAAa;AAAA,QAEZ,wBACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,kBAAkB;AAAA;AAAA,QACpB;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,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/dictionaryEditionDrawer.content.cjs

@@ -28,7 +28,47 @@ const dictionaryEditionDrawerContent = {
     backButtonText: (0, import_intlayer.t)({
       en: "Dictionary list",
       fr: "Liste des dictionnaires",
-      es: "Lista de diccionarios"
+      es: "Lista de diccionarios",
+      de: "W\xF6rterbuchliste",
+      ja: "\u8F9E\u66F8\u30EA\u30B9\u30C8",
+      ko: "\uC0AC\uC804 \uBAA9\uB85D",
+      zh: "\u8BCD\u5178\u5217\u8868",
+      it: "Elenco di dizionari",
+      pt: "Lista de dicion\xE1rios",
+      hi: "\u0936\u092C\u094D\u0926\u0915\u094B\u0936 \u0938\u0942\u091A\u0940",
+      ar: "\u0642\u0627\u0626\u0645\u0629 \u0627\u0644\u0642\u0648\u0627\u0645\u0644",
+      ru: "\u0421\u043F\u0438\u0441\u043E\u043A \u0441\u043B\u043E\u0432\u0430\u0440\u0435\u0439",
+      "en-GB": "Dictionary list"
+    }),
+    modalTitle: (0, import_intlayer.t)({
+      en: "Edit dictionary",
+      fr: "Modifier le dictionnaire",
+      es: "Editar el diccionario",
+      de: "W\xF6rterbuch bearbeiten",
+      ja: "\u8F9E\u66F8\u3092\u7DE8\u96C6",
+      ko: "\uC0AC\uC804 \uD3B8\uC9D1",
+      zh: "\u7F16\u8F91\u8BCD\u5178",
+      it: "Modifica dizionario",
+      pt: "Editar dicion\xE1rio",
+      hi: "\u0936\u092C\u094D\u0926\u0915\u094B\u0936 \u0938\u0902\u092A\u093E\u0926\u093F\u0924 \u0915\u0930\u0947\u0902",
+      ar: "\u062A\u062D\u0631\u064A\u0631 \u0642\u0627\u0645\u0648\u0633",
+      ru: "\u0420\u0435\u0434\u0430\u043A\u0442\u0438\u0440\u043E\u0432\u0430\u0442\u044C \u0441\u043B\u043E\u0432\u0430\u0440\u044C",
+      "en-GB": "Edit dictionary"
+    }),
+    noDictionaryFocused: (0, import_intlayer.t)({
+      en: "No dictionary focused",
+      fr: "Aucun dictionnaire s\xE9lectionn\xE9",
+      es: "No hay diccionario enfocado",
+      de: "Kein W\xF6rterbuch ausgew\xE4hlt",
+      ja: "\u30D5\u30A9\u30FC\u30AB\u30B9\u3055\u308C\u305F\u8F9E\u66F8\u304C\u3042\u308A\u307E\u305B\u3093",
+      ko: "\uD3EC\uCEE4\uC2A4\uAC00 \uC788\uB294 \uC0AC\uC804\uC774 \uC5C6\uC2B5\uB2C8\uB2E4",
+      zh: "\u6CA1\u6709\u805A\u7126\u7684\u8BCD\u5178",
+      it: "Nessun dizionario selezionato",
+      pt: "Nenhum dicion\xE1rio focalizado",
+      hi: "\u0915\u094B\u0908 \u092B\u094B\u0915\u0938 \u0936\u092C\u094D\u0926\u0915\u094B\u0936 \u0928\u0939\u0940\u0902 \u0939\u0948",
+      ar: "\u0644\u0627 \u064A\u0648\u062C\u062F \u0642\u0627\u0645\u0648\u0633 \u0645\u0631\u062A\u0628\u0637",
+      ru: "\u041D\u0435\u0442 \u0444\u043E\u043A\u0443\u0441\u0438\u0440\u043E\u0432\u0430\u043D\u043D\u043E\u0433\u043E \u0441\u043B\u043E\u0432\u0430\u0440\u044F",
+      "en-GB": "No dictionary focused"
     })
   }
 };

package/dist/cjs/DictionaryEditionDrawer/dictionaryEditionDrawer.content.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/DictionaryEditionDrawer/dictionaryEditionDrawer.content.ts"],"sourcesContent":["import { t, type DeclarationContent } from 'intlayer';\n\nconst dictionaryEditionDrawerContent = {\n  key: 'dictionary-edition-drawer',\n  content: {\n    backButtonText: t({\n      en: 'Dictionary list',\n      fr: 'Liste des dictionnaires',\n      es: 'Lista de diccionarios',\n    }),\n  },\n} satisfies DeclarationContent;\n\nexport default dictionaryEditionDrawerContent;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAA2C;AAE3C,MAAM,iCAAiC;AAAA,EACrC,KAAK;AAAA,EACL,SAAS;AAAA,IACP,oBAAgB,mBAAE;AAAA,MAChB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN,CAAC;AAAA,EACH;AACF;AAEA,IAAO,0CAAQ;","names":[]}
+{"version":3,"sources":["../../../src/DictionaryEditionDrawer/dictionaryEditionDrawer.content.ts"],"sourcesContent":["import { t, type DeclarationContent } from 'intlayer';\n\nconst dictionaryEditionDrawerContent = {\n  key: 'dictionary-edition-drawer',\n  content: {\n    backButtonText: t({\n      en: 'Dictionary list',\n      fr: 'Liste des dictionnaires',\n      es: 'Lista de diccionarios',\n      de: 'Wörterbuchliste',\n      ja: '辞書リスト',\n      ko: '사전 목록',\n      zh: '词典列表',\n      it: 'Elenco di dizionari',\n      pt: 'Lista de dicionários',\n      hi: 'शब्दकोश सूची',\n      ar: 'قائمة القوامل',\n      ru: 'Список словарей',\n      'en-GB': 'Dictionary list',\n    }),\n    modalTitle: t({\n      en: 'Edit dictionary',\n      fr: 'Modifier le dictionnaire',\n      es: 'Editar el diccionario',\n      de: 'Wörterbuch bearbeiten',\n      ja: '辞書を編集',\n      ko: '사전 편집',\n      zh: '编辑词典',\n      it: 'Modifica dizionario',\n      pt: 'Editar dicionário',\n      hi: 'शब्दकोश संपादित करें',\n      ar: 'تحرير قاموس',\n      ru: 'Редактировать словарь',\n      'en-GB': 'Edit dictionary',\n    }),\n    noDictionaryFocused: t({\n      en: 'No dictionary focused',\n      fr: 'Aucun dictionnaire sélectionné',\n      es: 'No hay diccionario enfocado',\n      de: 'Kein Wörterbuch ausgewählt',\n      ja: 'フォーカスされた辞書がありません',\n      ko: '포커스가 있는 사전이 없습니다',\n      zh: '没有聚焦的词典',\n      it: 'Nessun dizionario selezionato',\n      pt: 'Nenhum dicionário focalizado',\n      hi: 'कोई फोकस शब्दकोश नहीं है',\n      ar: 'لا يوجد قاموس مرتبط',\n      ru: 'Нет фокусированного словаря',\n      'en-GB': 'No dictionary focused',\n    }),\n  },\n} satisfies DeclarationContent;\n\nexport default dictionaryEditionDrawerContent;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAA2C;AAE3C,MAAM,iCAAiC;AAAA,EACrC,KAAK;AAAA,EACL,SAAS;AAAA,IACP,oBAAgB,mBAAE;AAAA,MAChB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,SAAS;AAAA,IACX,CAAC;AAAA,IACD,gBAAY,mBAAE;AAAA,MACZ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,SAAS;AAAA,IACX,CAAC;AAAA,IACD,yBAAqB,mBAAE;AAAA,MACrB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,SAAS;AAAA,IACX,CAAC;AAAA,EACH;AACF;AAEA,IAAO,0CAAQ;","names":[]}

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

@@ -32,6 +32,7 @@ var import_react_intlayer = require("react-intlayer");
 var import_editor = require("react-intlayer/editor");
 var import_ContentSelectorWrapper = require('./ContentSelectorWrapper.cjs');
 var import_react = require("react");
+var import_hooks = require("@intlayer/design-system/hooks");
 const IntlayerEditorContext = (0, import_react.createContext)({
   isEditorEnabled: false
 });
@@ -57,20 +58,26 @@ 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"
+          }
         );
       }
     }
   }, [isEnabled, editor.enabled, editor.clientId, editor.clientSecret]);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(IntlayerEditorContext.Provider, { value: { isEditorEnabled }, children: [
     children,
-    isEditorEnabled && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    isEditorEnabled && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_hooks.AsyncStateProvider, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         import_DictionaryEditionDrawer.DictionaryEditionDrawerController,
         {

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';\nimport { AsyncStateProvider } from '@intlayer/design-system/hooks';\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        <AsyncStateProvider>\n          <DictionaryEditionDrawerController\n            locale={locale}\n            localeList={internationalization.locales}\n            setLocale={setLocale}\n          />\n          <DictionaryListDrawer />\n        </AsyncStateProvider>\n      )}\n    </IntlayerEditorContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA4FQ;AA1FR,oBAA4C;AAC5C,qCAAkD;AAClD,kCAAqC;AACrC,4BAAmC;AACnC,oBAA0C;AAC1C,oCAAuC;AACvC,mBAOO;AACP,mBAAmC;AAS5B,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,6CAAC,mCACC;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

@@ -11,7 +11,7 @@ import {
 } from "@intlayer/design-system";
 import { useGetAllDictionaries } from "@intlayer/design-system/hooks";
 import { useCallback, useEffect, useState } from "react";
-import { t, useDictionary } from "react-intlayer";
+import { useDictionary } from "react-intlayer";
 import { useShallow } from "zustand/shallow";
 import { dictionaryListDrawerIdentifier } from '../DictionaryListDrawer/dictionaryListDrawerIdentifier.mjs';
 import dictionaryEditionDrawerContent from './dictionaryEditionDrawer.content.mjs';
@@ -19,7 +19,8 @@ import {
   useDictionaryEditionDrawer,
   getDrawerIdentifier
 } from './useDictionaryEditionDrawer.mjs';
-const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) => {
+const DictionaryEditionDrawerContent = ({ locale, localeList, identifier, handleOnBack, isDarkMode }) => {
+  const { modalTitle } = useDictionary(dictionaryEditionDrawerContent);
   const [keyPathEditionModal, setKeyPathEditionModal] = useState(null);
   const { setDictionariesRecord, focusedContent } = useDictionaryEditionDrawer(identifier);
   const { all: dictionaries } = useGetAllDictionaries();
@@ -32,9 +33,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,
@@ -42,18 +43,16 @@ const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) =>
         isOpen: keyPathEditionModal !== null,
         onClose: () => setKeyPathEditionModal(null),
         hasCloseButton: true,
-        title: t({
-          en: "Edit field",
-          fr: "Modifier le champ",
-          es: "Editar campo"
-        }),
+        title: modalTitle,
         size: "xl",
         transparency: "lg",
         children: dictionary && /* @__PURE__ */ jsx(
           DictionaryFieldEditor,
           {
             dictionary,
-            onClickDictionaryList
+            onClickDictionaryList,
+            isDarkMode,
+            availableLocales: localeList
           }
         )
       }
@@ -72,11 +71,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 +87,7 @@ const DictionaryEditionDrawer = ({
   return /* @__PURE__ */ jsx(
     RightDrawer,
     {
-      title: dictionaryId,
+      title: dictionaryKey,
       identifier: id,
       header: /* @__PURE__ */ jsx(
         LocaleSwitcher,
@@ -107,7 +107,9 @@ const DictionaryEditionDrawer = ({
           focusedContent,
           locale,
           identifier: id,
-          handleOnBack
+          handleOnBack,
+          isDarkMode,
+          localeList
         }
       )
     }
@@ -117,8 +119,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 +129,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  localeList: Locales[];\n  identifier: string;\n  handleOnBack: () => void;\n  isDarkMode?: boolean;\n};\n\nexport const DictionaryEditionDrawerContent: FC<\n  DictionaryEditionDrawerContentProps\n> = ({ locale, localeList, identifier, handleOnBack, isDarkMode }) => {\n  const { modalTitle } = useDictionary(dictionaryEditionDrawerContent);\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={modalTitle}\n        size=\"xl\"\n        transparency=\"lg\"\n      >\n        {dictionary && (\n          <DictionaryFieldEditor\n            dictionary={dictionary}\n            onClickDictionaryList={onClickDictionaryList}\n            isDarkMode={isDarkMode}\n            availableLocales={localeList}\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          localeList={localeList}\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":";AA0D6B,wBAKzB,YALyB;AAtD7B;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,SAAY,qBAAqB;AACjC,SAAS,kBAAkB;AAC3B,SAAS,sCAAsC;AAC/C,OAAO,oCAAoC;AAC3C;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AAWA,MAAM,iCAET,CAAC,EAAE,QAAQ,YAAY,YAAY,cAAc,WAAW,MAAM;AACpE,QAAM,EAAE,WAAW,IAAI,cAAc,8BAA8B;AACnE,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;AAAA,QACP,MAAK;AAAA,QACL,cAAa;AAAA,QAEZ,wBACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,kBAAkB;AAAA;AAAA,QACpB;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,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/dictionaryEditionDrawer.content.mjs

@@ -5,7 +5,47 @@ const dictionaryEditionDrawerContent = {
     backButtonText: t({
       en: "Dictionary list",
       fr: "Liste des dictionnaires",
-      es: "Lista de diccionarios"
+      es: "Lista de diccionarios",
+      de: "W\xF6rterbuchliste",
+      ja: "\u8F9E\u66F8\u30EA\u30B9\u30C8",
+      ko: "\uC0AC\uC804 \uBAA9\uB85D",
+      zh: "\u8BCD\u5178\u5217\u8868",
+      it: "Elenco di dizionari",
+      pt: "Lista de dicion\xE1rios",
+      hi: "\u0936\u092C\u094D\u0926\u0915\u094B\u0936 \u0938\u0942\u091A\u0940",
+      ar: "\u0642\u0627\u0626\u0645\u0629 \u0627\u0644\u0642\u0648\u0627\u0645\u0644",
+      ru: "\u0421\u043F\u0438\u0441\u043E\u043A \u0441\u043B\u043E\u0432\u0430\u0440\u0435\u0439",
+      "en-GB": "Dictionary list"
+    }),
+    modalTitle: t({
+      en: "Edit dictionary",
+      fr: "Modifier le dictionnaire",
+      es: "Editar el diccionario",
+      de: "W\xF6rterbuch bearbeiten",
+      ja: "\u8F9E\u66F8\u3092\u7DE8\u96C6",
+      ko: "\uC0AC\uC804 \uD3B8\uC9D1",
+      zh: "\u7F16\u8F91\u8BCD\u5178",
+      it: "Modifica dizionario",
+      pt: "Editar dicion\xE1rio",
+      hi: "\u0936\u092C\u094D\u0926\u0915\u094B\u0936 \u0938\u0902\u092A\u093E\u0926\u093F\u0924 \u0915\u0930\u0947\u0902",
+      ar: "\u062A\u062D\u0631\u064A\u0631 \u0642\u0627\u0645\u0648\u0633",
+      ru: "\u0420\u0435\u0434\u0430\u043A\u0442\u0438\u0440\u043E\u0432\u0430\u0442\u044C \u0441\u043B\u043E\u0432\u0430\u0440\u044C",
+      "en-GB": "Edit dictionary"
+    }),
+    noDictionaryFocused: t({
+      en: "No dictionary focused",
+      fr: "Aucun dictionnaire s\xE9lectionn\xE9",
+      es: "No hay diccionario enfocado",
+      de: "Kein W\xF6rterbuch ausgew\xE4hlt",
+      ja: "\u30D5\u30A9\u30FC\u30AB\u30B9\u3055\u308C\u305F\u8F9E\u66F8\u304C\u3042\u308A\u307E\u305B\u3093",
+      ko: "\uD3EC\uCEE4\uC2A4\uAC00 \uC788\uB294 \uC0AC\uC804\uC774 \uC5C6\uC2B5\uB2C8\uB2E4",
+      zh: "\u6CA1\u6709\u805A\u7126\u7684\u8BCD\u5178",
+      it: "Nessun dizionario selezionato",
+      pt: "Nenhum dicion\xE1rio focalizado",
+      hi: "\u0915\u094B\u0908 \u092B\u094B\u0915\u0938 \u0936\u092C\u094D\u0926\u0915\u094B\u0936 \u0928\u0939\u0940\u0902 \u0939\u0948",
+      ar: "\u0644\u0627 \u064A\u0648\u062C\u062F \u0642\u0627\u0645\u0648\u0633 \u0645\u0631\u062A\u0628\u0637",
+      ru: "\u041D\u0435\u0442 \u0444\u043E\u043A\u0443\u0441\u0438\u0440\u043E\u0432\u0430\u043D\u043D\u043E\u0433\u043E \u0441\u043B\u043E\u0432\u0430\u0440\u044F",
+      "en-GB": "No dictionary focused"
     })
   }
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/DictionaryEditionDrawer/dictionaryEditionDrawer.content.ts"],"sourcesContent":["import { t, type DeclarationContent } from 'intlayer';\n\nconst dictionaryEditionDrawerContent = {\n  key: 'dictionary-edition-drawer',\n  content: {\n    backButtonText: t({\n      en: 'Dictionary list',\n      fr: 'Liste des dictionnaires',\n      es: 'Lista de diccionarios',\n    }),\n  },\n} satisfies DeclarationContent;\n\nexport default dictionaryEditionDrawerContent;\n"],"mappings":"AAAA,SAAS,SAAkC;AAE3C,MAAM,iCAAiC;AAAA,EACrC,KAAK;AAAA,EACL,SAAS;AAAA,IACP,gBAAgB,EAAE;AAAA,MAChB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN,CAAC;AAAA,EACH;AACF;AAEA,IAAO,0CAAQ;","names":[]}
+{"version":3,"sources":["../../../src/DictionaryEditionDrawer/dictionaryEditionDrawer.content.ts"],"sourcesContent":["import { t, type DeclarationContent } from 'intlayer';\n\nconst dictionaryEditionDrawerContent = {\n  key: 'dictionary-edition-drawer',\n  content: {\n    backButtonText: t({\n      en: 'Dictionary list',\n      fr: 'Liste des dictionnaires',\n      es: 'Lista de diccionarios',\n      de: 'Wörterbuchliste',\n      ja: '辞書リスト',\n      ko: '사전 목록',\n      zh: '词典列表',\n      it: 'Elenco di dizionari',\n      pt: 'Lista de dicionários',\n      hi: 'शब्दकोश सूची',\n      ar: 'قائمة القوامل',\n      ru: 'Список словарей',\n      'en-GB': 'Dictionary list',\n    }),\n    modalTitle: t({\n      en: 'Edit dictionary',\n      fr: 'Modifier le dictionnaire',\n      es: 'Editar el diccionario',\n      de: 'Wörterbuch bearbeiten',\n      ja: '辞書を編集',\n      ko: '사전 편집',\n      zh: '编辑词典',\n      it: 'Modifica dizionario',\n      pt: 'Editar dicionário',\n      hi: 'शब्दकोश संपादित करें',\n      ar: 'تحرير قاموس',\n      ru: 'Редактировать словарь',\n      'en-GB': 'Edit dictionary',\n    }),\n    noDictionaryFocused: t({\n      en: 'No dictionary focused',\n      fr: 'Aucun dictionnaire sélectionné',\n      es: 'No hay diccionario enfocado',\n      de: 'Kein Wörterbuch ausgewählt',\n      ja: 'フォーカスされた辞書がありません',\n      ko: '포커스가 있는 사전이 없습니다',\n      zh: '没有聚焦的词典',\n      it: 'Nessun dizionario selezionato',\n      pt: 'Nenhum dicionário focalizado',\n      hi: 'कोई फोकस शब्दकोश नहीं है',\n      ar: 'لا يوجد قاموس مرتبط',\n      ru: 'Нет фокусированного словаря',\n      'en-GB': 'No dictionary focused',\n    }),\n  },\n} satisfies DeclarationContent;\n\nexport default dictionaryEditionDrawerContent;\n"],"mappings":"AAAA,SAAS,SAAkC;AAE3C,MAAM,iCAAiC;AAAA,EACrC,KAAK;AAAA,EACL,SAAS;AAAA,IACP,gBAAgB,EAAE;AAAA,MAChB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,SAAS;AAAA,IACX,CAAC;AAAA,IACD,YAAY,EAAE;AAAA,MACZ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,SAAS;AAAA,IACX,CAAC;AAAA,IACD,qBAAqB,EAAE;AAAA,MACrB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,SAAS;AAAA,IACX,CAAC;AAAA,EACH;AACF;AAEA,IAAO,0CAAQ;","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 { jsx, jsxs } from "react/jsx-runtime";
+import { appLogger, getConfiguration } from "@intlayer/config/client";
 import { DictionaryEditionDrawerController } from './DictionaryEditionDrawer/index.mjs';
 import { DictionaryListDrawer } from './DictionaryListDrawer/index.mjs';
 import { useIntlayerContext } from "react-intlayer";
@@ -12,6 +12,7 @@ import {
   useEffect,
   useMemo
 } from "react";
+import { AsyncStateProvider } from "@intlayer/design-system/hooks";
 const IntlayerEditorContext = createContext({
   isEditorEnabled: false
 });
@@ -37,20 +38,26 @@ 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"
+          }
         );
       }
     }
   }, [isEnabled, editor.enabled, editor.clientId, editor.clientSecret]);
   return /* @__PURE__ */ jsxs(IntlayerEditorContext.Provider, { value: { isEditorEnabled }, children: [
     children,
-    isEditorEnabled && /* @__PURE__ */ jsxs(Fragment, { children: [
+    isEditorEnabled && /* @__PURE__ */ jsxs(AsyncStateProvider, { children: [
       /* @__PURE__ */ jsx(
         DictionaryEditionDrawerController,
         {

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';\nimport { AsyncStateProvider } from '@intlayer/design-system/hooks';\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        <AsyncStateProvider>\n          <DictionaryEditionDrawerController\n            locale={locale}\n            localeList={internationalization.locales}\n            setLocale={setLocale}\n          />\n          <DictionaryListDrawer />\n        </AsyncStateProvider>\n      )}\n    </IntlayerEditorContext.Provider>\n  );\n};\n"],"mappings":";AA4FQ,SACE,KADF;AA1FR,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;AACP,SAAS,0BAA0B;AAS5B,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,qBAAC,sBACC;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

@@ -4,12 +4,15 @@ import { type FileContent as FileContentWithDictionaryPath } from './useDictiona
 type DictionaryEditionDrawerContentProps = {
     focusedContent: FileContentWithDictionaryPath;
     locale: Locales;
+    localeList: 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,OAAO,EAAE,CAAC;IACtB,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,CAqDpC,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,CAgDpE,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/dictionaryEditionDrawer.content.d.ts

@@ -2,6 +2,8 @@ declare const dictionaryEditionDrawerContent: {
     key: string;
     content: {
         backButtonText: import("@intlayer/core").TranslationContent<string>;
+        modalTitle: import("@intlayer/core").TranslationContent<string>;
+        noDictionaryFocused: import("@intlayer/core").TranslationContent<string>;
     };
 };
 export default dictionaryEditionDrawerContent;

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

@@ -1 +1 @@
-{"version":3,"file":"dictionaryEditionDrawer.content.d.ts","sourceRoot":"","sources":["../../../src/DictionaryEditionDrawer/dictionaryEditionDrawer.content.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,8BAA8B;;;;;CASN,CAAC;AAE/B,eAAe,8BAA8B,CAAC"}
+{"version":3,"file":"dictionaryEditionDrawer.content.d.ts","sourceRoot":"","sources":["../../../src/DictionaryEditionDrawer/dictionaryEditionDrawer.content.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,8BAA8B;;;;;;;CAiDN,CAAC;AAE/B,eAAe,8BAA8B,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;AAGf,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.6",
   "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.6",
+    "@intlayer/core": "^3.5.6",
+    "@intlayer/design-system": "^3.5.6",
+    "intlayer": "^3.5.6"
   },
   "devDependencies": {
     "@babel/generator": "7.26.2",
@@ -104,11 +104,11 @@
     "@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/core": "^3.5.6",
+    "@intlayer/config": "^3.5.6",
+    "intlayer": "^3.5.6",
+    "@intlayer/design-system": "^3.5.6",
+    "react-intlayer": "^3.5.6"
   },
   "engines": {
     "node": ">=14.18"