intlayer-editor 3.5.0 → 3.5.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/ContentSelectorWrapper.cjs +67 -0
- package/dist/cjs/ContentSelectorWrapper.cjs.map +1 -0
- package/dist/cjs/DictionaryEditionDrawer/DictionaryEditionDrawer.cjs +156 -0
- package/dist/cjs/DictionaryEditionDrawer/DictionaryEditionDrawer.cjs.map +1 -0
- package/dist/cjs/DictionaryEditionDrawer/index.cjs +25 -0
- package/dist/cjs/DictionaryEditionDrawer/index.cjs.map +1 -0
- package/dist/cjs/DictionaryEditionDrawer/useDictionaryEditionDrawer.cjs +79 -0
- package/dist/cjs/DictionaryEditionDrawer/useDictionaryEditionDrawer.cjs.map +1 -0
- package/dist/cjs/DictionaryListDrawer/DictionaryListDrawer.cjs +89 -0
- package/dist/cjs/DictionaryListDrawer/DictionaryListDrawer.cjs.map +1 -0
- package/dist/cjs/DictionaryListDrawer/dictionaryListDrawerIdentifier.cjs +29 -0
- package/dist/cjs/DictionaryListDrawer/dictionaryListDrawerIdentifier.cjs.map +1 -0
- package/dist/cjs/DictionaryListDrawer/index.cjs +25 -0
- package/dist/cjs/DictionaryListDrawer/index.cjs.map +1 -0
- package/dist/cjs/IntlayerEditorProvider.cjs +92 -0
- package/dist/cjs/IntlayerEditorProvider.cjs.map +1 -0
- package/dist/cjs/index.cjs +27 -0
- package/dist/cjs/index.cjs.map +1 -0
- package/dist/cjs/styles/style.css +2 -0
- package/dist/cjs/styles/style.css.map +1 -0
- package/dist/cjs/styles/tailwind.cjs +41 -0
- package/dist/cjs/styles/tailwind.cjs.map +1 -0
- package/dist/esm/ContentSelectorWrapper.mjs +48 -0
- package/dist/esm/ContentSelectorWrapper.mjs.map +1 -0
- package/dist/esm/DictionaryEditionDrawer/DictionaryEditionDrawer.mjs +141 -0
- package/dist/esm/DictionaryEditionDrawer/DictionaryEditionDrawer.mjs.map +1 -0
- package/dist/esm/DictionaryEditionDrawer/index.mjs +3 -0
- package/dist/esm/DictionaryEditionDrawer/index.mjs.map +1 -0
- package/dist/esm/DictionaryEditionDrawer/useDictionaryEditionDrawer.mjs +58 -0
- package/dist/esm/DictionaryEditionDrawer/useDictionaryEditionDrawer.mjs.map +1 -0
- package/dist/esm/DictionaryListDrawer/DictionaryListDrawer.mjs +71 -0
- package/dist/esm/DictionaryListDrawer/DictionaryListDrawer.mjs.map +1 -0
- package/dist/esm/DictionaryListDrawer/dictionaryListDrawerIdentifier.mjs +5 -0
- package/dist/esm/DictionaryListDrawer/dictionaryListDrawerIdentifier.mjs.map +1 -0
- package/dist/esm/DictionaryListDrawer/index.mjs +3 -0
- package/dist/esm/DictionaryListDrawer/index.mjs.map +1 -0
- package/dist/esm/IntlayerEditorProvider.mjs +71 -0
- package/dist/esm/IntlayerEditorProvider.mjs.map +1 -0
- package/dist/esm/index.mjs +4 -0
- package/dist/esm/index.mjs.map +1 -0
- package/dist/esm/styles/style.css +2 -0
- package/dist/esm/styles/style.css.map +1 -0
- package/dist/esm/styles/tailwind.mjs +9 -0
- package/dist/esm/styles/tailwind.mjs.map +1 -0
- package/dist/types/ContentSelectorWrapper.d.ts +11 -0
- package/dist/types/ContentSelectorWrapper.d.ts.map +1 -0
- package/dist/types/DictionaryEditionDrawer/DictionaryEditionDrawer.d.ts +22 -0
- package/dist/types/DictionaryEditionDrawer/DictionaryEditionDrawer.d.ts.map +1 -0
- package/dist/types/DictionaryEditionDrawer/index.d.ts +3 -0
- package/dist/types/DictionaryEditionDrawer/index.d.ts.map +1 -0
- package/dist/types/DictionaryEditionDrawer/useDictionaryEditionDrawer.d.ts +20 -0
- package/dist/types/DictionaryEditionDrawer/useDictionaryEditionDrawer.d.ts.map +1 -0
- package/dist/types/DictionaryListDrawer/DictionaryListDrawer.d.ts +3 -0
- package/dist/types/DictionaryListDrawer/DictionaryListDrawer.d.ts.map +1 -0
- package/dist/types/DictionaryListDrawer/dictionaryListDrawerIdentifier.d.ts +2 -0
- package/dist/types/DictionaryListDrawer/dictionaryListDrawerIdentifier.d.ts.map +1 -0
- package/dist/types/DictionaryListDrawer/index.d.ts +3 -0
- package/dist/types/DictionaryListDrawer/index.d.ts.map +1 -0
- package/dist/types/IntlayerEditorProvider.d.ts +21 -0
- package/dist/types/IntlayerEditorProvider.d.ts.map +1 -0
- package/dist/types/index.d.ts +4 -0
- package/dist/types/index.d.ts.map +1 -0
- package/dist/types/styles/tailwind.d.ts +4 -0
- package/dist/types/styles/tailwind.d.ts.map +1 -0
- package/package.json +10 -10
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __copyProps = (to, from, except, desc) => {
|
|
7
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
8
|
+
for (let key of __getOwnPropNames(from))
|
|
9
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
10
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
11
|
+
}
|
|
12
|
+
return to;
|
|
13
|
+
};
|
|
14
|
+
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
15
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
16
|
+
var src_exports = {};
|
|
17
|
+
module.exports = __toCommonJS(src_exports);
|
|
18
|
+
__reExport(src_exports, require('./DictionaryEditionDrawer/index.cjs'), module.exports);
|
|
19
|
+
__reExport(src_exports, require('./DictionaryListDrawer/index.cjs'), module.exports);
|
|
20
|
+
__reExport(src_exports, require('./IntlayerEditorProvider.cjs'), module.exports);
|
|
21
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
22
|
+
0 && (module.exports = {
|
|
23
|
+
...require('./DictionaryEditionDrawer/index.cjs'),
|
|
24
|
+
...require('./DictionaryListDrawer/index.cjs'),
|
|
25
|
+
...require('./IntlayerEditorProvider.cjs')
|
|
26
|
+
});
|
|
27
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export * from './DictionaryEditionDrawer/index';\nexport * from './DictionaryListDrawer/index';\nexport * from './IntlayerEditorProvider';\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,4CAAd;AACA,wBAAc,yCADd;AAEA,wBAAc,qCAFd;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var tailwind_exports = {};
|
|
30
|
+
__export(tailwind_exports, {
|
|
31
|
+
default: () => tailwind_default,
|
|
32
|
+
tailwindPresetConfig: () => import_tailwind_config.tailwindPresetConfig
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(tailwind_exports);
|
|
35
|
+
var import_tailwind_config = __toESM(require("@intlayer/design-system/tailwind-config"));
|
|
36
|
+
var tailwind_default = import_tailwind_config.default;
|
|
37
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
38
|
+
0 && (module.exports = {
|
|
39
|
+
tailwindPresetConfig
|
|
40
|
+
});
|
|
41
|
+
//# sourceMappingURL=tailwind.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/styles/tailwind.ts"],"sourcesContent":["import tailwindConfig, {\n tailwindPresetConfig,\n} from '@intlayer/design-system/tailwind-config';\n\nexport { tailwindPresetConfig };\nexport default tailwindConfig;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAEO;AAGP,IAAO,mBAAQ,uBAAAA;","names":["tailwindConfig"]}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { isSameKeyPath } from "@intlayer/core";
|
|
4
|
+
import { ContentSelector } from "@intlayer/design-system";
|
|
5
|
+
import {
|
|
6
|
+
useCallback,
|
|
7
|
+
useEffect,
|
|
8
|
+
useState,
|
|
9
|
+
useMemo
|
|
10
|
+
} from "react";
|
|
11
|
+
import { useIntlayerEditorContext } from './IntlayerEditorProvider.mjs';
|
|
12
|
+
import { useDictionaryEditionDrawer } from './DictionaryEditionDrawer/useDictionaryEditionDrawer.mjs';
|
|
13
|
+
const ContentSelectorWrapper = ({
|
|
14
|
+
children,
|
|
15
|
+
dictionaryId,
|
|
16
|
+
dictionaryPath,
|
|
17
|
+
keyPath
|
|
18
|
+
}) => {
|
|
19
|
+
const { open, getEditedContentValue, focusedContent, isOpen } = useDictionaryEditionDrawer(dictionaryId);
|
|
20
|
+
const editedValue = getEditedContentValue(dictionaryId, keyPath);
|
|
21
|
+
const { isEditorEnabled } = useIntlayerEditorContext();
|
|
22
|
+
const [displayedChildren, setDisplayedChildren] = useState(children);
|
|
23
|
+
const handleSelect = useCallback(
|
|
24
|
+
() => open({
|
|
25
|
+
dictionaryId,
|
|
26
|
+
dictionaryPath,
|
|
27
|
+
keyPath
|
|
28
|
+
}),
|
|
29
|
+
[dictionaryId, dictionaryPath, keyPath, open]
|
|
30
|
+
);
|
|
31
|
+
const isSelected = useMemo(
|
|
32
|
+
() => (isOpen && (focusedContent?.keyPath?.length ?? 0) > 0 && isSameKeyPath(focusedContent?.keyPath ?? [], keyPath)) ?? false,
|
|
33
|
+
[focusedContent, isOpen, keyPath]
|
|
34
|
+
);
|
|
35
|
+
useEffect(() => {
|
|
36
|
+
if (isEditorEnabled && editedValue && typeof editedValue === "string") {
|
|
37
|
+
setDisplayedChildren(editedValue);
|
|
38
|
+
}
|
|
39
|
+
}, [editedValue, isEditorEnabled]);
|
|
40
|
+
if (!isEditorEnabled) {
|
|
41
|
+
return children;
|
|
42
|
+
}
|
|
43
|
+
return /* @__PURE__ */ jsx(ContentSelector, { onSelect: handleSelect, isSelecting: isSelected, children: displayedChildren });
|
|
44
|
+
};
|
|
45
|
+
export {
|
|
46
|
+
ContentSelectorWrapper
|
|
47
|
+
};
|
|
48
|
+
//# sourceMappingURL=ContentSelectorWrapper.mjs.map
|
|
@@ -0,0 +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":[]}
|
|
@@ -0,0 +1,141 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import {
|
|
4
|
+
RightDrawer,
|
|
5
|
+
DictionaryEditor,
|
|
6
|
+
LocaleSwitcher,
|
|
7
|
+
Modal,
|
|
8
|
+
useEditionPanelStore,
|
|
9
|
+
DictionaryFieldEditor,
|
|
10
|
+
useRightDrawerStore
|
|
11
|
+
} from "@intlayer/design-system";
|
|
12
|
+
import { useGetAllDictionaries } from "@intlayer/design-system/hooks";
|
|
13
|
+
import { useCallback, useEffect, useState } from "react";
|
|
14
|
+
import { t } from "react-intlayer";
|
|
15
|
+
import { useShallow } from "zustand/shallow";
|
|
16
|
+
import { dictionaryListDrawerIdentifier } from '../DictionaryListDrawer/dictionaryListDrawerIdentifier.mjs';
|
|
17
|
+
import {
|
|
18
|
+
useDictionaryEditionDrawer,
|
|
19
|
+
getDrawerIdentifier
|
|
20
|
+
} from './useDictionaryEditionDrawer.mjs';
|
|
21
|
+
const DictionaryEditionDrawerContent = ({ locale, identifier, handleOnBack }) => {
|
|
22
|
+
const [keyPathEditionModal, setKeyPathEditionModal] = useState(null);
|
|
23
|
+
const { setDictionariesRecord, focusedContent } = useDictionaryEditionDrawer(identifier);
|
|
24
|
+
const { all: dictionaries } = useGetAllDictionaries();
|
|
25
|
+
const onClickDictionaryList = useCallback(() => {
|
|
26
|
+
setKeyPathEditionModal(null);
|
|
27
|
+
handleOnBack();
|
|
28
|
+
}, [handleOnBack]);
|
|
29
|
+
useEffect(() => {
|
|
30
|
+
if (dictionaries) {
|
|
31
|
+
setDictionariesRecord(dictionaries);
|
|
32
|
+
}
|
|
33
|
+
}, [setDictionariesRecord, dictionaries]);
|
|
34
|
+
const dictionaryId = focusedContent?.dictionaryId;
|
|
35
|
+
if (!dictionaryId) return /* @__PURE__ */ jsx(Fragment, { children: "No dictionary focused" });
|
|
36
|
+
const dictionary = dictionaries[dictionaryId];
|
|
37
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
38
|
+
/* @__PURE__ */ jsx(
|
|
39
|
+
Modal,
|
|
40
|
+
{
|
|
41
|
+
isOpen: keyPathEditionModal !== null,
|
|
42
|
+
onClose: () => setKeyPathEditionModal(null),
|
|
43
|
+
hasCloseButton: true,
|
|
44
|
+
title: t({
|
|
45
|
+
en: "Edit field",
|
|
46
|
+
fr: "Modifier le champ",
|
|
47
|
+
es: "Editar campo"
|
|
48
|
+
}),
|
|
49
|
+
size: "xl",
|
|
50
|
+
transparency: "lg",
|
|
51
|
+
children: dictionary && /* @__PURE__ */ jsx(
|
|
52
|
+
DictionaryFieldEditor,
|
|
53
|
+
{
|
|
54
|
+
dictionary,
|
|
55
|
+
onClickDictionaryList
|
|
56
|
+
}
|
|
57
|
+
)
|
|
58
|
+
}
|
|
59
|
+
),
|
|
60
|
+
/* @__PURE__ */ jsx(
|
|
61
|
+
DictionaryEditor,
|
|
62
|
+
{
|
|
63
|
+
dictionary,
|
|
64
|
+
locale,
|
|
65
|
+
onClickEdit: setKeyPathEditionModal
|
|
66
|
+
}
|
|
67
|
+
)
|
|
68
|
+
] });
|
|
69
|
+
};
|
|
70
|
+
const DictionaryEditionDrawer = ({
|
|
71
|
+
locale,
|
|
72
|
+
localeList,
|
|
73
|
+
setLocale,
|
|
74
|
+
dictionaryId
|
|
75
|
+
}) => {
|
|
76
|
+
const id = getDrawerIdentifier(dictionaryId);
|
|
77
|
+
const { focusedContent, close } = useDictionaryEditionDrawer(dictionaryId);
|
|
78
|
+
const { openDictionaryListDrawer } = useRightDrawerStore((s) => ({
|
|
79
|
+
openDictionaryListDrawer: () => s.open(dictionaryListDrawerIdentifier)
|
|
80
|
+
}));
|
|
81
|
+
const handleOnBack = () => {
|
|
82
|
+
close();
|
|
83
|
+
openDictionaryListDrawer();
|
|
84
|
+
};
|
|
85
|
+
return /* @__PURE__ */ jsx(
|
|
86
|
+
RightDrawer,
|
|
87
|
+
{
|
|
88
|
+
title: dictionaryId,
|
|
89
|
+
identifier: id,
|
|
90
|
+
header: /* @__PURE__ */ jsx(
|
|
91
|
+
LocaleSwitcher,
|
|
92
|
+
{
|
|
93
|
+
setLocale,
|
|
94
|
+
locale,
|
|
95
|
+
localeList
|
|
96
|
+
}
|
|
97
|
+
),
|
|
98
|
+
backButton: {
|
|
99
|
+
onBack: handleOnBack,
|
|
100
|
+
text: t({
|
|
101
|
+
en: "Dictionary list",
|
|
102
|
+
fr: "Liste des dictionnaires",
|
|
103
|
+
es: "Lista de diccionarios"
|
|
104
|
+
})
|
|
105
|
+
},
|
|
106
|
+
children: focusedContent && /* @__PURE__ */ jsx(
|
|
107
|
+
DictionaryEditionDrawerContent,
|
|
108
|
+
{
|
|
109
|
+
focusedContent,
|
|
110
|
+
locale,
|
|
111
|
+
identifier: id,
|
|
112
|
+
handleOnBack
|
|
113
|
+
}
|
|
114
|
+
)
|
|
115
|
+
}
|
|
116
|
+
);
|
|
117
|
+
};
|
|
118
|
+
const DictionaryEditionDrawerController = ({ locale, localeList, setLocale }) => {
|
|
119
|
+
const focusedContent = useEditionPanelStore(
|
|
120
|
+
useShallow((s) => s.focusedContent)
|
|
121
|
+
);
|
|
122
|
+
const dictionaryId = focusedContent?.dictionaryId;
|
|
123
|
+
if (!dictionaryId) {
|
|
124
|
+
return /* @__PURE__ */ jsx(Fragment, {});
|
|
125
|
+
}
|
|
126
|
+
return /* @__PURE__ */ jsx(
|
|
127
|
+
DictionaryEditionDrawer,
|
|
128
|
+
{
|
|
129
|
+
locale,
|
|
130
|
+
localeList,
|
|
131
|
+
setLocale,
|
|
132
|
+
dictionaryId
|
|
133
|
+
}
|
|
134
|
+
);
|
|
135
|
+
};
|
|
136
|
+
export {
|
|
137
|
+
DictionaryEditionDrawer,
|
|
138
|
+
DictionaryEditionDrawerContent,
|
|
139
|
+
DictionaryEditionDrawerController
|
|
140
|
+
};
|
|
141
|
+
//# sourceMappingURL=DictionaryEditionDrawer.mjs.map
|
|
@@ -0,0 +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 } from 'react-intlayer';\nimport { useShallow } from 'zustand/shallow';\nimport { dictionaryListDrawerIdentifier } from '../DictionaryListDrawer/dictionaryListDrawerIdentifier';\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 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: t({\n en: 'Dictionary list',\n fr: 'Liste des dictionnaires',\n es: 'Lista de diccionarios',\n }),\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":"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","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/DictionaryEditionDrawer/index.ts"],"sourcesContent":["export * from './DictionaryEditionDrawer';\nexport * from './useDictionaryEditionDrawer';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;","names":[]}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import {
|
|
2
|
+
useRightDrawerStore,
|
|
3
|
+
useEditedContentStore,
|
|
4
|
+
useEditionPanelStore
|
|
5
|
+
} from "@intlayer/design-system";
|
|
6
|
+
import { useCallback } from "react";
|
|
7
|
+
import { useShallow } from "zustand/shallow";
|
|
8
|
+
const getDrawerIdentifier = (dictionaryId) => `dictionary_edition_${dictionaryId}`;
|
|
9
|
+
const useDictionaryEditionDrawer = (dictionaryId) => {
|
|
10
|
+
const id = getDrawerIdentifier(dictionaryId);
|
|
11
|
+
const { isOpenDrawer, openDrawer, closeDrawer } = useRightDrawerStore(
|
|
12
|
+
useShallow((e) => ({
|
|
13
|
+
isOpenDrawer: e.isOpen,
|
|
14
|
+
openDrawer: e.open,
|
|
15
|
+
closeDrawer: e.close
|
|
16
|
+
}))
|
|
17
|
+
);
|
|
18
|
+
const { setDictionariesRecord, getEditedContentValue } = useEditedContentStore(
|
|
19
|
+
useShallow((s) => ({
|
|
20
|
+
setDictionariesRecord: s.setDictionariesRecord,
|
|
21
|
+
getEditedContentValue: s.getEditedContentValue
|
|
22
|
+
}))
|
|
23
|
+
);
|
|
24
|
+
const { setFocusedContent, focusedContent } = useEditionPanelStore(
|
|
25
|
+
useShallow((s) => ({
|
|
26
|
+
focusedContent: s.focusedContent,
|
|
27
|
+
setFocusedContent: s.setFocusedContent
|
|
28
|
+
}))
|
|
29
|
+
);
|
|
30
|
+
const openDictionaryEditionDrawer = useCallback(
|
|
31
|
+
({
|
|
32
|
+
dictionaryId: dictionaryId2,
|
|
33
|
+
dictionaryPath,
|
|
34
|
+
keyPath = []
|
|
35
|
+
}) => {
|
|
36
|
+
setFocusedContent({
|
|
37
|
+
dictionaryId: dictionaryId2,
|
|
38
|
+
dictionaryPath,
|
|
39
|
+
keyPath
|
|
40
|
+
});
|
|
41
|
+
openDrawer(id);
|
|
42
|
+
},
|
|
43
|
+
[openDrawer, setFocusedContent]
|
|
44
|
+
);
|
|
45
|
+
return {
|
|
46
|
+
isOpen: isOpenDrawer(id),
|
|
47
|
+
focusedContent,
|
|
48
|
+
setDictionariesRecord,
|
|
49
|
+
getEditedContentValue,
|
|
50
|
+
open: openDictionaryEditionDrawer,
|
|
51
|
+
close: () => closeDrawer(id)
|
|
52
|
+
};
|
|
53
|
+
};
|
|
54
|
+
export {
|
|
55
|
+
getDrawerIdentifier,
|
|
56
|
+
useDictionaryEditionDrawer
|
|
57
|
+
};
|
|
58
|
+
//# sourceMappingURL=useDictionaryEditionDrawer.mjs.map
|
|
@@ -0,0 +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"]}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { Fragment, jsx } from "react/jsx-runtime";
|
|
3
|
+
import {
|
|
4
|
+
RightDrawer,
|
|
5
|
+
Button,
|
|
6
|
+
useEditedContentStore,
|
|
7
|
+
useEditionPanelStore,
|
|
8
|
+
useRightDrawerStore
|
|
9
|
+
} from "@intlayer/design-system";
|
|
10
|
+
import { useGetAllDictionaries } from "@intlayer/design-system/hooks";
|
|
11
|
+
import { ChevronRight } from "lucide-react";
|
|
12
|
+
import { useCallback, useMemo } from "react";
|
|
13
|
+
import { useShallow } from "zustand/shallow";
|
|
14
|
+
import { getDrawerIdentifier } from '../DictionaryEditionDrawer/useDictionaryEditionDrawer.mjs';
|
|
15
|
+
import { dictionaryListDrawerIdentifier } from './dictionaryListDrawerIdentifier.mjs';
|
|
16
|
+
const DictionaryListDrawer = () => {
|
|
17
|
+
const { all: dictionaries } = useGetAllDictionaries();
|
|
18
|
+
const dictionaryKeyList = useMemo(
|
|
19
|
+
() => Object.keys(dictionaries),
|
|
20
|
+
[dictionaries]
|
|
21
|
+
);
|
|
22
|
+
const { closeDrawer, openDrawer } = useRightDrawerStore(
|
|
23
|
+
useShallow((s) => ({
|
|
24
|
+
closeDrawer: s.close,
|
|
25
|
+
openDrawer: s.open
|
|
26
|
+
}))
|
|
27
|
+
);
|
|
28
|
+
const editedContent = useEditedContentStore(
|
|
29
|
+
useShallow((s) => s.editedContent)
|
|
30
|
+
);
|
|
31
|
+
const setFocusedContent = useEditionPanelStore(
|
|
32
|
+
useShallow((s) => s.setFocusedContent)
|
|
33
|
+
);
|
|
34
|
+
const handleClickDictionary = (dictionaryId) => {
|
|
35
|
+
closeDrawer(dictionaryListDrawerIdentifier);
|
|
36
|
+
const { filePath } = dictionaries[dictionaryId];
|
|
37
|
+
setFocusedContent({
|
|
38
|
+
dictionaryId,
|
|
39
|
+
dictionaryPath: filePath
|
|
40
|
+
});
|
|
41
|
+
openDrawer(getDrawerIdentifier(dictionaryId));
|
|
42
|
+
};
|
|
43
|
+
const isDictionaryEdited = useCallback(
|
|
44
|
+
(dictionaryId) => Object.keys(editedContent).includes(dictionaryId),
|
|
45
|
+
[editedContent]
|
|
46
|
+
);
|
|
47
|
+
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
|
|
48
|
+
RightDrawer,
|
|
49
|
+
{
|
|
50
|
+
title: "Dictionary list",
|
|
51
|
+
identifier: dictionaryListDrawerIdentifier,
|
|
52
|
+
children: dictionaryKeyList.map((dictionaryId) => /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
|
|
53
|
+
Button,
|
|
54
|
+
{
|
|
55
|
+
label: `Open dictionary editor ${dictionaryId}`,
|
|
56
|
+
onClick: () => handleClickDictionary(dictionaryId),
|
|
57
|
+
variant: "hoverable",
|
|
58
|
+
color: "text",
|
|
59
|
+
IconRight: ChevronRight,
|
|
60
|
+
size: "md",
|
|
61
|
+
isFullWidth: true,
|
|
62
|
+
children: isDictionaryEdited(dictionaryId) ? `\u270E ${dictionaryId}` : dictionaryId
|
|
63
|
+
}
|
|
64
|
+
) }, dictionaryId))
|
|
65
|
+
}
|
|
66
|
+
) });
|
|
67
|
+
};
|
|
68
|
+
export {
|
|
69
|
+
DictionaryListDrawer
|
|
70
|
+
};
|
|
71
|
+
//# sourceMappingURL=DictionaryListDrawer.mjs.map
|
|
@@ -0,0 +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":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/DictionaryListDrawer/dictionaryListDrawerIdentifier.ts"],"sourcesContent":["export const dictionaryListDrawerIdentifier = 'dictionaryList';\n"],"mappings":"AAAO,MAAM,iCAAiC;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/DictionaryListDrawer/index.ts"],"sourcesContent":["export * from './DictionaryListDrawer';\nexport * from './dictionaryListDrawerIdentifier';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;","names":[]}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { getConfiguration } from "@intlayer/config/client";
|
|
4
|
+
import { DictionaryEditionDrawerController } from './DictionaryEditionDrawer/index.mjs';
|
|
5
|
+
import { DictionaryListDrawer } from './DictionaryListDrawer/index.mjs';
|
|
6
|
+
import { useIntlayerContext } from "react-intlayer";
|
|
7
|
+
import { useContentSelectorContext } from "react-intlayer/editor";
|
|
8
|
+
import { ContentSelectorWrapper } from './ContentSelectorWrapper.mjs';
|
|
9
|
+
import {
|
|
10
|
+
createContext,
|
|
11
|
+
useContext,
|
|
12
|
+
useEffect,
|
|
13
|
+
useMemo
|
|
14
|
+
} from "react";
|
|
15
|
+
const IntlayerEditorContext = createContext({
|
|
16
|
+
isEditorEnabled: false
|
|
17
|
+
});
|
|
18
|
+
const useIntlayerEditorContext = () => useContext(IntlayerEditorContext);
|
|
19
|
+
const IntlayerEditorProvider = ({
|
|
20
|
+
children,
|
|
21
|
+
isEnabled = true
|
|
22
|
+
}) => {
|
|
23
|
+
const { editor, internationalization } = getConfiguration();
|
|
24
|
+
const { setState } = useContentSelectorContext();
|
|
25
|
+
const { locale, setLocale } = useIntlayerContext();
|
|
26
|
+
const isEditorEnabled = useMemo(
|
|
27
|
+
() => Boolean(
|
|
28
|
+
editor.enabled && editor.clientId && editor.clientSecret && isEnabled
|
|
29
|
+
),
|
|
30
|
+
[editor.enabled && editor.clientId && editor.clientSecret && isEnabled]
|
|
31
|
+
);
|
|
32
|
+
useEffect(() => {
|
|
33
|
+
setState({
|
|
34
|
+
ContentSelectorWrapper
|
|
35
|
+
});
|
|
36
|
+
}, [setState]);
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
if (isEnabled && editor.enabled) {
|
|
39
|
+
if (!editor.clientId) {
|
|
40
|
+
console.error(
|
|
41
|
+
"Editor is enabled but clientId is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor."
|
|
42
|
+
);
|
|
43
|
+
}
|
|
44
|
+
if (!editor.clientSecret) {
|
|
45
|
+
console.error(
|
|
46
|
+
"Editor is enabled but clientSecret is not set. Please set it in the editor configuration. See http://localhost:3000/doc/concept/editor."
|
|
47
|
+
);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}, [isEnabled, editor.enabled, editor.clientId, editor.clientSecret]);
|
|
51
|
+
return /* @__PURE__ */ jsxs(IntlayerEditorContext.Provider, { value: { isEditorEnabled }, children: [
|
|
52
|
+
children,
|
|
53
|
+
isEditorEnabled && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
54
|
+
/* @__PURE__ */ jsx(
|
|
55
|
+
DictionaryEditionDrawerController,
|
|
56
|
+
{
|
|
57
|
+
locale,
|
|
58
|
+
localeList: internationalization.locales,
|
|
59
|
+
setLocale
|
|
60
|
+
}
|
|
61
|
+
),
|
|
62
|
+
/* @__PURE__ */ jsx(DictionaryListDrawer, {})
|
|
63
|
+
] })
|
|
64
|
+
] });
|
|
65
|
+
};
|
|
66
|
+
export {
|
|
67
|
+
IntlayerEditorContext,
|
|
68
|
+
IntlayerEditorProvider,
|
|
69
|
+
useIntlayerEditorContext
|
|
70
|
+
};
|
|
71
|
+
//# sourceMappingURL=IntlayerEditorProvider.mjs.map
|
|
@@ -0,0 +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":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export * from './DictionaryEditionDrawer/index';\nexport * from './DictionaryListDrawer/index';\nexport * from './IntlayerEditorProvider';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/styles/tailwind.ts"],"sourcesContent":["import tailwindConfig, {\n tailwindPresetConfig,\n} from '@intlayer/design-system/tailwind-config';\n\nexport { tailwindPresetConfig };\nexport default tailwindConfig;\n"],"mappings":"AAAA,OAAO;AAAA,EACL;AAAA,OACK;AAGP,IAAO,mBAAQ;","names":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { type KeyPath } from '@intlayer/core';
|
|
2
|
+
import { type FC, type ReactNode } from 'react';
|
|
3
|
+
type ContentSelectorWrapperProps = {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
dictionaryId: string;
|
|
6
|
+
dictionaryPath: string;
|
|
7
|
+
keyPath: KeyPath[];
|
|
8
|
+
};
|
|
9
|
+
export declare const ContentSelectorWrapper: FC<ContentSelectorWrapperProps>;
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=ContentSelectorWrapper.d.ts.map
|
|
@@ -0,0 +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"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import type { Locales } from '@intlayer/config/client';
|
|
2
|
+
import { type FC } from 'react';
|
|
3
|
+
import { type FileContent as FileContentWithDictionaryPath } from './useDictionaryEditionDrawer';
|
|
4
|
+
type DictionaryEditionDrawerContentProps = {
|
|
5
|
+
focusedContent: FileContentWithDictionaryPath;
|
|
6
|
+
locale: Locales;
|
|
7
|
+
identifier: string;
|
|
8
|
+
handleOnBack: () => void;
|
|
9
|
+
};
|
|
10
|
+
export declare const DictionaryEditionDrawerContent: FC<DictionaryEditionDrawerContentProps>;
|
|
11
|
+
type DictionaryEditionDrawerProps = DictionaryEditionDrawerControllerProps & {
|
|
12
|
+
dictionaryId: string;
|
|
13
|
+
};
|
|
14
|
+
export declare const DictionaryEditionDrawer: FC<DictionaryEditionDrawerProps>;
|
|
15
|
+
type DictionaryEditionDrawerControllerProps = {
|
|
16
|
+
locale: Locales;
|
|
17
|
+
localeList: Locales[];
|
|
18
|
+
setLocale: (locale: Locales) => void;
|
|
19
|
+
};
|
|
20
|
+
export declare const DictionaryEditionDrawerController: FC<DictionaryEditionDrawerControllerProps>;
|
|
21
|
+
export {};
|
|
22
|
+
//# sourceMappingURL=DictionaryEditionDrawer.d.ts.map
|
|
@@ -0,0 +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;AAIlE,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,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"}
|