@intlayer/design-system 8.1.2 → 8.1.3

package/dist/esm/components/DictionaryFieldEditor/StructureView/StructureView.mjs

@@ -1,200 +1,2 @@
-'use client';
-
-import { Container } from "../../Container/index.mjs";
-import { Button, ButtonColor, ButtonSize, ButtonVariant } from "../../Button/Button.mjs";
-import { InputVariant } from "../../Input/Input.mjs";
-import { EditableFieldInput } from "../../EditableField/EditableFieldInput.mjs";
-import { NodeTypeSelector } from "../NodeTypeSelector.mjs";
-import { Plus, Trash } from "lucide-react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { getDefaultNode, getNodeChildren, getNodeType, isSameKeyPath } from "@intlayer/core";
-import { useIntlayer } from "react-intlayer";
-import { useConfiguration, useEditedContentActions, useFocusUnmergedDictionary } from "@intlayer/editor-react";
-import { NodeType } from "@intlayer/types";
-import { camelCaseToSentence } from "@intlayer/config/client";
-
-//#region src/components/DictionaryFieldEditor/StructureView/StructureView.tsx
-const NodeTypeView = ({ section, dictionaryLocalId, keyPath, onNodeTypeChange: onNodeTypeChangeProp }) => {
-	const locales = useConfiguration()?.internationalization.locales ?? [];
-	const nodeType = getNodeType(section);
-	const children = getNodeChildren(section);
-	const onNodeTypeChange = (content) => {
-		onNodeTypeChangeProp(getDefaultNode(nodeType, locales, content));
-	};
-	if (nodeType === NodeType.Translation || nodeType === NodeType.Condition || nodeType === NodeType.Gender || nodeType === NodeType.Enumeration) {
-		const firstKey = Object.keys(section[nodeType])[0];
-		const childrenKeyPath = [...keyPath, {
-			type: nodeType,
-			key: firstKey
-		}];
-		return /* @__PURE__ */ jsxs("div", {
-			className: "flex w-full flex-col gap-1",
-			children: [/* @__PURE__ */ jsx(NodeTypeSelector, {
-				section,
-				onValueChange: (nodeType) => onNodeTypeChangeProp(getDefaultNode(nodeType, locales))
-			}), /* @__PURE__ */ jsx(NodeTypeView, {
-				section: children,
-				keyPath: childrenKeyPath,
-				dictionaryLocalId,
-				onNodeTypeChange
-			})]
-		});
-	}
-	if (nodeType === NodeType.Array) {
-		const childrenKeyPath = [...keyPath, {
-			type: nodeType,
-			key: 0
-		}];
-		return /* @__PURE__ */ jsxs("div", {
-			className: "flex w-full flex-col gap-1",
-			children: [/* @__PURE__ */ jsx(NodeTypeSelector, {
-				section,
-				onValueChange: (nodeType) => onNodeTypeChangeProp(getDefaultNode(nodeType, locales))
-			}), /* @__PURE__ */ jsx(NodeTypeView, {
-				section: children,
-				keyPath: childrenKeyPath,
-				dictionaryLocalId,
-				onNodeTypeChange
-			})]
-		});
-	}
-	if (nodeType === NodeType.Object) return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(NodeTypeSelector, {
-		section,
-		onValueChange: (nodeType) => onNodeTypeChangeProp(getDefaultNode(nodeType, locales))
-	}), /* @__PURE__ */ jsx("div", {
-		className: "mt-6 ml-10",
-		children: /* @__PURE__ */ jsx(StructureView, {
-			keyPath,
-			section,
-			dictionaryLocalId
-		})
-	})] });
-	return /* @__PURE__ */ jsx(NodeTypeSelector, {
-		section,
-		onValueChange: (nodeType) => onNodeTypeChangeProp(getDefaultNode(nodeType, locales))
-	});
-};
-const NodeView = ({ sectionKey, section, keyPath, dictionaryLocalId }) => {
-	const { focusedContent, setFocusedContentKeyPath } = useFocusUnmergedDictionary();
-	const { renameEditedContent, addEditedContent } = useEditedContentActions();
-	const { titleInput, deleteButton } = useIntlayer("structure-view");
-	const handleRenameNodeKey = (keyName) => {
-		renameEditedContent(dictionaryLocalId, keyName, keyPath);
-		const prevKeyPath = keyPath.slice(0, -1);
-		const lastKeyPath = keyPath[keyPath.length - 1];
-		setFocusedContentKeyPath([...prevKeyPath, {
-			...lastKeyPath,
-			key: keyName
-		}]);
-	};
-	return /* @__PURE__ */ jsx(Container, {
-		transparency: "xl",
-		roundedSize: "xl",
-		className: "w-full min-w-80 gap-2 overflow-auto px-5 py-2",
-		border: true,
-		borderColor: "text",
-		background: "none",
-		"aria-selected": isSameKeyPath(keyPath, focusedContent?.keyPath ?? []),
-		onClick: () => setFocusedContentKeyPath(keyPath),
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "flex w-full flex-col items-start justify-between gap-3",
-			children: [typeof sectionKey === "string" && /* @__PURE__ */ jsxs("div", {
-				className: "w-full",
-				children: [/* @__PURE__ */ jsxs("div", {
-					className: "flex w-full items-center justify-between gap-10",
-					children: [/* @__PURE__ */ jsx(EditableFieldInput, {
-						name: "key",
-						"aria-label": "Key",
-						placeholder: titleInput.placeholder.value,
-						defaultValue: sectionKey,
-						onSave: (value) => handleRenameNodeKey(value),
-						variant: InputVariant.INVISIBLE
-					}), /* @__PURE__ */ jsx(Button, {
-						label: deleteButton.label.value,
-						variant: ButtonVariant.HOVERABLE,
-						size: ButtonSize.ICON_SM,
-						color: ButtonColor.TEXT,
-						className: "translate-x-2",
-						Icon: Trash,
-						onClick: () => {
-							addEditedContent(dictionaryLocalId, void 0, keyPath);
-							setFocusedContentKeyPath(keyPath.slice(0, -1));
-						}
-					})]
-				}), /* @__PURE__ */ jsxs("span", {
-					className: "ml-3 text-neutral text-sm",
-					children: [
-						"( ",
-						camelCaseToSentence(sectionKey),
-						" )"
-					]
-				})]
-			}), /* @__PURE__ */ jsx(NodeTypeView, {
-				keyPath,
-				dictionaryLocalId,
-				section,
-				onNodeTypeChange: (content) => {
-					addEditedContent(dictionaryLocalId, content, keyPath);
-				}
-			})]
-		})
-	});
-};
-const ObjectView = ({ section, keyPath, dictionaryLocalId }) => {
-	const { addNodeButton } = useIntlayer("structure-view");
-	const { setFocusedContentKeyPath } = useFocusUnmergedDictionary();
-	const { addEditedContent } = useEditedContentActions();
-	if (!section || typeof section !== "object") return /* @__PURE__ */ jsx("div", { children: "Not an object" });
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-2 overflow-y-auto",
-		children: [/* @__PURE__ */ jsx("ul", {
-			className: "mr-auto flex flex-col gap-4",
-			children: Object.keys(section).map((key) => /* @__PURE__ */ jsx("li", {
-				className: "flex w-full",
-				children: /* @__PURE__ */ jsx(NodeView, {
-					sectionKey: key,
-					section: section?.[key],
-					keyPath: [...keyPath, {
-						type: NodeType.Object,
-						key
-					}],
-					dictionaryLocalId
-				})
-			}, `${JSON.stringify(keyPath)}-object-${key}`))
-		}), /* @__PURE__ */ jsx(Button, {
-			label: addNodeButton.label.value,
-			variant: ButtonVariant.HOVERABLE,
-			size: ButtonSize.MD,
-			color: ButtonColor.TEXT,
-			Icon: Plus,
-			className: "flex-1",
-			onClick: () => {
-				const newKey = "newKey";
-				const newKeyPath = [...keyPath, {
-					type: NodeType.Object,
-					key: newKey
-				}];
-				addEditedContent(dictionaryLocalId, "", newKeyPath);
-				setFocusedContentKeyPath(newKeyPath);
-			},
-			children: addNodeButton.text
-		})]
-	});
-};
-const StructureView = ({ section, keyPath, dictionaryLocalId }) => {
-	if (!section || typeof section !== "object" || typeof section.nodeType === "string") return /* @__PURE__ */ jsx(NodeView, {
-		sectionKey: "content",
-		section,
-		keyPath,
-		dictionaryLocalId
-	});
-	return /* @__PURE__ */ jsx(ObjectView, {
-		section,
-		keyPath,
-		dictionaryLocalId
-	});
-};
-
-//#endregion
-export { NodeView, ObjectView, StructureView };
+"use client";import{Container as e}from"../../Container/index.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonVariant as i}from"../../Button/Button.mjs";import{InputVariant as a}from"../../Input/Input.mjs";import{EditableFieldInput as o}from"../../EditableField/EditableFieldInput.mjs";import{NodeTypeSelector as s}from"../NodeTypeSelector.mjs";import{Plus as c,Trash as l}from"lucide-react";import{Fragment as u,jsx as d,jsxs as f}from"react/jsx-runtime";import{useIntlayer as p}from"react-intlayer";import{useConfiguration as m,useEditedContentActions as h,useFocusUnmergedDictionary as g}from"@intlayer/editor-react";import{getDefaultNode as _,getNodeChildren as v,getNodeType as y}from"@intlayer/core/dictionaryManipulator";import{NodeType as b}from"@intlayer/types";import{isSameKeyPath as x}from"@intlayer/core/utils";import{camelCaseToSentence as S}from"@intlayer/config/client";const C=({section:e,dictionaryLocalId:t,keyPath:n,onNodeTypeChange:r})=>{let i=m()?.internationalization.locales??[],a=y(e),o=v(e),c=e=>{r(_(a,i,e))};if(a===b.Translation||a===b.Condition||a===b.Gender||a===b.Enumeration){let l=Object.keys(e[a])[0],u=[...n,{type:a,key:l}];return f(`div`,{className:`flex w-full flex-col gap-1`,children:[d(s,{section:e,onValueChange:e=>r(_(e,i))}),d(C,{section:o,keyPath:u,dictionaryLocalId:t,onNodeTypeChange:c})]})}if(a===b.Array){let l=[...n,{type:a,key:0}];return f(`div`,{className:`flex w-full flex-col gap-1`,children:[d(s,{section:e,onValueChange:e=>r(_(e,i))}),d(C,{section:o,keyPath:l,dictionaryLocalId:t,onNodeTypeChange:c})]})}return a===b.Object?f(u,{children:[d(s,{section:e,onValueChange:e=>r(_(e,i))}),d(`div`,{className:`mt-6 ml-10`,children:d(E,{keyPath:n,section:e,dictionaryLocalId:t})})]}):d(s,{section:e,onValueChange:e=>r(_(e,i))})},w=({sectionKey:s,section:c,keyPath:u,dictionaryLocalId:m})=>{let{focusedContent:_,setFocusedContentKeyPath:v}=g(),{renameEditedContent:y,addEditedContent:b}=h(),{titleInput:w,deleteButton:T}=p(`structure-view`),E=e=>{y(m,e,u);let t=u.slice(0,-1),n=u[u.length-1];v([...t,{...n,key:e}])};return d(e,{transparency:`xl`,roundedSize:`xl`,className:`w-full min-w-80 gap-2 overflow-auto px-5 py-2`,border:!0,borderColor:`text`,background:`none`,"aria-selected":x(u,_?.keyPath??[]),onClick:()=>v(u),children:f(`div`,{className:`flex w-full flex-col items-start justify-between gap-3`,children:[typeof s==`string`&&f(`div`,{className:`w-full`,children:[f(`div`,{className:`flex w-full items-center justify-between gap-10`,children:[d(o,{name:`key`,"aria-label":`Key`,placeholder:w.placeholder.value,defaultValue:s,onSave:e=>E(e),variant:a.INVISIBLE}),d(t,{label:T.label.value,variant:i.HOVERABLE,size:r.ICON_SM,color:n.TEXT,className:`translate-x-2`,Icon:l,onClick:()=>{b(m,void 0,u),v(u.slice(0,-1))}})]}),f(`span`,{className:`ml-3 text-neutral text-sm`,children:[`( `,S(s),` )`]})]}),d(C,{keyPath:u,dictionaryLocalId:m,section:c,onNodeTypeChange:e=>{b(m,e,u)}})]})})},T=({section:e,keyPath:a,dictionaryLocalId:o})=>{let{addNodeButton:s}=p(`structure-view`),{setFocusedContentKeyPath:l}=g(),{addEditedContent:u}=h();return!e||typeof e!=`object`?d(`div`,{children:`Not an object`}):f(`div`,{className:`flex flex-col gap-2 overflow-y-auto`,children:[d(`ul`,{className:`mr-auto flex flex-col gap-4`,children:Object.keys(e).map(t=>d(`li`,{className:`flex w-full`,children:d(w,{sectionKey:t,section:e?.[t],keyPath:[...a,{type:b.Object,key:t}],dictionaryLocalId:o})},`${JSON.stringify(a)}-object-${t}`))}),d(t,{label:s.label.value,variant:i.HOVERABLE,size:r.MD,color:n.TEXT,Icon:c,className:`flex-1`,onClick:()=>{let e=[...a,{type:b.Object,key:`newKey`}];u(o,``,e),l(e)},children:s.text})]})},E=({section:e,keyPath:t,dictionaryLocalId:n})=>!e||typeof e!=`object`||typeof e.nodeType==`string`?d(w,{sectionKey:`content`,section:e,keyPath:t,dictionaryLocalId:n}):d(T,{section:e,keyPath:t,dictionaryLocalId:n});export{w as NodeView,T as ObjectView,E as StructureView};
 //# sourceMappingURL=StructureView.mjs.map

package/dist/esm/components/DictionaryFieldEditor/StructureView/StructureView.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"StructureView.mjs","names":[],"sources":["../../../../../src/components/DictionaryFieldEditor/StructureView/StructureView.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Button,\n  ButtonColor,\n  ButtonSize,\n  ButtonVariant,\n} from '@components/Button';\nimport { Container } from '@components/Container';\nimport { EditableFieldInput } from '@components/EditableField';\nimport { InputVariant } from '@components/Input';\nimport { camelCaseToSentence } from '@intlayer/config/client';\nimport {\n  getDefaultNode,\n  getNodeChildren,\n  getNodeType,\n  isSameKeyPath,\n} from '@intlayer/core';\nimport {\n  useConfiguration,\n  useEditedContentActions,\n  useFocusUnmergedDictionary,\n} from '@intlayer/editor-react';\nimport {\n  type KeyPath,\n  type LocalDictionaryId,\n  NodeType,\n  type TypedNode,\n} from '@intlayer/types';\nimport type { ContentNode } from 'intlayer';\nimport { Plus, Trash } from 'lucide-react';\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { NodeTypeSelector } from '../NodeTypeSelector';\n\ntype NodeTypeViewProps = {\n  dictionaryLocalId: LocalDictionaryId;\n  keyPath: KeyPath[];\n  section: ContentNode;\n  onNodeTypeChange: (content?: ContentNode) => void;\n};\n\nconst NodeTypeView: FC<NodeTypeViewProps> = ({\n  section,\n  dictionaryLocalId,\n  keyPath,\n  onNodeTypeChange: onNodeTypeChangeProp,\n}) => {\n  const locales = useConfiguration()?.internationalization.locales ?? [];\n  const nodeType = getNodeType(section);\n  const children = getNodeChildren(section);\n\n  const onNodeTypeChange = (content?: ContentNode) => {\n    const transformedContent = getDefaultNode(\n      nodeType,\n      locales,\n      content\n    ) as ContentNode;\n\n    onNodeTypeChangeProp(transformedContent);\n  };\n\n  if (\n    nodeType === NodeType.Translation ||\n    nodeType === NodeType.Condition ||\n    nodeType === NodeType.Gender ||\n    nodeType === NodeType.Enumeration\n  ) {\n    const firstKey = Object.keys(\n      (section as unknown as TypedNode)[nodeType as keyof typeof section]\n    )[0];\n    const childrenKeyPath = [\n      ...keyPath,\n      { type: nodeType, key: firstKey },\n    ] as KeyPath[];\n\n    return (\n      <div className=\"flex w-full flex-col gap-1\">\n        <NodeTypeSelector\n          section={section}\n          onValueChange={(nodeType) =>\n            onNodeTypeChangeProp(\n              getDefaultNode(nodeType, locales) as ContentNode\n            )\n          }\n        />\n\n        <NodeTypeView\n          section={children}\n          keyPath={childrenKeyPath}\n          dictionaryLocalId={dictionaryLocalId}\n          onNodeTypeChange={onNodeTypeChange}\n        />\n      </div>\n    );\n  }\n\n  if (nodeType === NodeType.Array) {\n    const childrenKeyPath = [...keyPath, { type: nodeType, key: 0 } as KeyPath];\n    return (\n      <div className=\"flex w-full flex-col gap-1\">\n        <NodeTypeSelector\n          section={section}\n          onValueChange={(nodeType) =>\n            onNodeTypeChangeProp(\n              getDefaultNode(nodeType, locales) as ContentNode\n            )\n          }\n        />\n\n        <NodeTypeView\n          section={children}\n          keyPath={childrenKeyPath}\n          dictionaryLocalId={dictionaryLocalId}\n          onNodeTypeChange={onNodeTypeChange}\n        />\n      </div>\n    );\n  }\n\n  if (nodeType === NodeType.Object) {\n    return (\n      <>\n        <NodeTypeSelector\n          section={section}\n          onValueChange={(nodeType) =>\n            onNodeTypeChangeProp(\n              getDefaultNode(nodeType, locales) as ContentNode\n            )\n          }\n        />\n        <div className=\"mt-6 ml-10\">\n          <StructureView\n            keyPath={keyPath}\n            section={section}\n            dictionaryLocalId={dictionaryLocalId}\n          />\n        </div>\n      </>\n    );\n  }\n\n  return (\n    <NodeTypeSelector\n      section={section}\n      onValueChange={(nodeType) =>\n        onNodeTypeChangeProp(getDefaultNode(nodeType, locales) as ContentNode)\n      }\n    />\n  );\n};\n\ntype NodeWrapperProps = {\n  sectionKey?: string;\n  dictionaryLocalId: LocalDictionaryId;\n  keyPath: KeyPath[];\n  section: ContentNode;\n};\n\nexport const NodeView: FC<NodeWrapperProps> = ({\n  sectionKey,\n  section,\n  keyPath,\n  dictionaryLocalId,\n}) => {\n  const { focusedContent, setFocusedContentKeyPath } =\n    useFocusUnmergedDictionary();\n  const { renameEditedContent, addEditedContent } = useEditedContentActions();\n\n  const { titleInput, deleteButton } = useIntlayer('structure-view');\n\n  const handleRenameNodeKey = (keyName: string) => {\n    renameEditedContent(dictionaryLocalId, keyName, keyPath);\n    const prevKeyPath: KeyPath[] = keyPath.slice(0, -1);\n    const lastKeyPath: KeyPath = keyPath[keyPath.length - 1];\n    const newKeyPath: KeyPath[] = [\n      ...prevKeyPath,\n      { ...lastKeyPath, key: keyName } as KeyPath,\n    ];\n    setFocusedContentKeyPath(newKeyPath);\n  };\n\n  return (\n    <Container\n      transparency=\"xl\"\n      roundedSize=\"xl\"\n      className=\"w-full min-w-80 gap-2 overflow-auto px-5 py-2\"\n      border\n      borderColor=\"text\"\n      background=\"none\"\n      aria-selected={isSameKeyPath(keyPath, focusedContent?.keyPath ?? [])}\n      onClick={() => setFocusedContentKeyPath(keyPath)}\n    >\n      <div className=\"flex w-full flex-col items-start justify-between gap-3\">\n        {typeof sectionKey === 'string' && (\n          <div className=\"w-full\">\n            <div className=\"flex w-full items-center justify-between gap-10\">\n              <EditableFieldInput\n                name=\"key\"\n                aria-label=\"Key\"\n                placeholder={titleInput.placeholder.value}\n                defaultValue={sectionKey}\n                onSave={(value) => handleRenameNodeKey(value)}\n                variant={InputVariant.INVISIBLE}\n              />\n              <Button\n                label={deleteButton.label.value}\n                variant={ButtonVariant.HOVERABLE}\n                size={ButtonSize.ICON_SM}\n                color={ButtonColor.TEXT}\n                className=\"translate-x-2\"\n                Icon={Trash}\n                onClick={() => {\n                  addEditedContent(dictionaryLocalId, undefined, keyPath);\n\n                  const parentKeyPath: KeyPath[] = keyPath.slice(0, -1);\n                  setFocusedContentKeyPath(parentKeyPath);\n                }}\n              />\n            </div>\n\n            <span className=\"ml-3 text-neutral text-sm\">\n              ( {camelCaseToSentence(sectionKey)} )\n            </span>\n          </div>\n        )}\n        <NodeTypeView\n          keyPath={keyPath}\n          dictionaryLocalId={dictionaryLocalId}\n          section={section}\n          onNodeTypeChange={(content) => {\n            addEditedContent(dictionaryLocalId, content, keyPath);\n          }}\n        />\n      </div>\n    </Container>\n  );\n};\n\ntype ObjectViewProps = {\n  dictionaryLocalId: LocalDictionaryId;\n  keyPath: KeyPath[];\n  section: ContentNode;\n};\n\nexport const ObjectView: FC<ObjectViewProps> = ({\n  section,\n  keyPath,\n  dictionaryLocalId,\n}) => {\n  const { addNodeButton } = useIntlayer('structure-view');\n  const { setFocusedContentKeyPath } = useFocusUnmergedDictionary();\n  const { addEditedContent } = useEditedContentActions();\n\n  if (!section || typeof section !== 'object') {\n    return <div>Not an object</div>;\n  }\n\n  return (\n    <div className=\"flex flex-col gap-2 overflow-y-auto\">\n      <ul className=\"mr-auto flex flex-col gap-4\">\n        {Object.keys(section).map((key) => (\n          <li\n            key={`${JSON.stringify(keyPath)}-object-${key}`}\n            className=\"flex w-full\"\n          >\n            <NodeView\n              sectionKey={key}\n              section={section?.[key as keyof typeof section]}\n              keyPath={[...keyPath, { type: NodeType.Object, key }]}\n              dictionaryLocalId={dictionaryLocalId}\n            />\n          </li>\n        ))}\n      </ul>\n      <Button\n        label={addNodeButton.label.value}\n        variant={ButtonVariant.HOVERABLE}\n        size={ButtonSize.MD}\n        color={ButtonColor.TEXT}\n        Icon={Plus}\n        className=\"flex-1\"\n        onClick={() => {\n          const newKey = 'newKey';\n          const newKeyPath = [\n            ...keyPath,\n            { type: NodeType.Object, key: newKey },\n          ] as KeyPath[];\n          addEditedContent(dictionaryLocalId, '', newKeyPath);\n          setFocusedContentKeyPath(newKeyPath);\n        }}\n      >\n        {addNodeButton.text}\n      </Button>\n    </div>\n  );\n};\n\ntype StructureViewProps = {\n  dictionaryLocalId: LocalDictionaryId;\n  keyPath: KeyPath[];\n  section: ContentNode;\n};\n\nexport const StructureView: FC<StructureViewProps> = ({\n  section,\n  keyPath,\n  dictionaryLocalId,\n}) => {\n  if (\n    !section ||\n    typeof section !== 'object' ||\n    typeof section.nodeType === 'string'\n  ) {\n    return (\n      <NodeView\n        sectionKey={'content'}\n        section={section}\n        keyPath={keyPath}\n        dictionaryLocalId={dictionaryLocalId}\n      />\n    );\n  }\n\n  return (\n    <ObjectView\n      section={section}\n      keyPath={keyPath}\n      dictionaryLocalId={dictionaryLocalId}\n    />\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"StructureView.mjs","names":[],"sources":["../../../../../src/components/DictionaryFieldEditor/StructureView/StructureView.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Button,\n  ButtonColor,\n  ButtonSize,\n  ButtonVariant,\n} from '@components/Button';\nimport { Container } from '@components/Container';\nimport { EditableFieldInput } from '@components/EditableField';\nimport { InputVariant } from '@components/Input';\nimport { camelCaseToSentence } from '@intlayer/config/client';\nimport {\n  getDefaultNode,\n  getNodeChildren,\n  getNodeType,\n} from '@intlayer/core/dictionaryManipulator';\nimport { isSameKeyPath } from '@intlayer/core/utils';\nimport {\n  useConfiguration,\n  useEditedContentActions,\n  useFocusUnmergedDictionary,\n} from '@intlayer/editor-react';\nimport {\n  type KeyPath,\n  type LocalDictionaryId,\n  NodeType,\n  type TypedNode,\n} from '@intlayer/types';\nimport type { ContentNode } from 'intlayer';\nimport { Plus, Trash } from 'lucide-react';\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { NodeTypeSelector } from '../NodeTypeSelector';\n\ntype NodeTypeViewProps = {\n  dictionaryLocalId: LocalDictionaryId;\n  keyPath: KeyPath[];\n  section: ContentNode;\n  onNodeTypeChange: (content?: ContentNode) => void;\n};\n\nconst NodeTypeView: FC<NodeTypeViewProps> = ({\n  section,\n  dictionaryLocalId,\n  keyPath,\n  onNodeTypeChange: onNodeTypeChangeProp,\n}) => {\n  const locales = useConfiguration()?.internationalization.locales ?? [];\n  const nodeType = getNodeType(section);\n  const children = getNodeChildren(section);\n\n  const onNodeTypeChange = (content?: ContentNode) => {\n    const transformedContent = getDefaultNode(\n      nodeType,\n      locales,\n      content\n    ) as ContentNode;\n\n    onNodeTypeChangeProp(transformedContent);\n  };\n\n  if (\n    nodeType === NodeType.Translation ||\n    nodeType === NodeType.Condition ||\n    nodeType === NodeType.Gender ||\n    nodeType === NodeType.Enumeration\n  ) {\n    const firstKey = Object.keys(\n      (section as unknown as TypedNode)[nodeType as keyof typeof section]\n    )[0];\n    const childrenKeyPath = [\n      ...keyPath,\n      { type: nodeType, key: firstKey },\n    ] as KeyPath[];\n\n    return (\n      <div className=\"flex w-full flex-col gap-1\">\n        <NodeTypeSelector\n          section={section}\n          onValueChange={(nodeType) =>\n            onNodeTypeChangeProp(\n              getDefaultNode(nodeType, locales) as ContentNode\n            )\n          }\n        />\n\n        <NodeTypeView\n          section={children}\n          keyPath={childrenKeyPath}\n          dictionaryLocalId={dictionaryLocalId}\n          onNodeTypeChange={onNodeTypeChange}\n        />\n      </div>\n    );\n  }\n\n  if (nodeType === NodeType.Array) {\n    const childrenKeyPath = [...keyPath, { type: nodeType, key: 0 } as KeyPath];\n    return (\n      <div className=\"flex w-full flex-col gap-1\">\n        <NodeTypeSelector\n          section={section}\n          onValueChange={(nodeType) =>\n            onNodeTypeChangeProp(\n              getDefaultNode(nodeType, locales) as ContentNode\n            )\n          }\n        />\n\n        <NodeTypeView\n          section={children}\n          keyPath={childrenKeyPath}\n          dictionaryLocalId={dictionaryLocalId}\n          onNodeTypeChange={onNodeTypeChange}\n        />\n      </div>\n    );\n  }\n\n  if (nodeType === NodeType.Object) {\n    return (\n      <>\n        <NodeTypeSelector\n          section={section}\n          onValueChange={(nodeType) =>\n            onNodeTypeChangeProp(\n              getDefaultNode(nodeType, locales) as ContentNode\n            )\n          }\n        />\n        <div className=\"mt-6 ml-10\">\n          <StructureView\n            keyPath={keyPath}\n            section={section}\n            dictionaryLocalId={dictionaryLocalId}\n          />\n        </div>\n      </>\n    );\n  }\n\n  return (\n    <NodeTypeSelector\n      section={section}\n      onValueChange={(nodeType) =>\n        onNodeTypeChangeProp(getDefaultNode(nodeType, locales) as ContentNode)\n      }\n    />\n  );\n};\n\ntype NodeWrapperProps = {\n  sectionKey?: string;\n  dictionaryLocalId: LocalDictionaryId;\n  keyPath: KeyPath[];\n  section: ContentNode;\n};\n\nexport const NodeView: FC<NodeWrapperProps> = ({\n  sectionKey,\n  section,\n  keyPath,\n  dictionaryLocalId,\n}) => {\n  const { focusedContent, setFocusedContentKeyPath } =\n    useFocusUnmergedDictionary();\n  const { renameEditedContent, addEditedContent } = useEditedContentActions();\n\n  const { titleInput, deleteButton } = useIntlayer('structure-view');\n\n  const handleRenameNodeKey = (keyName: string) => {\n    renameEditedContent(dictionaryLocalId, keyName, keyPath);\n    const prevKeyPath: KeyPath[] = keyPath.slice(0, -1);\n    const lastKeyPath: KeyPath = keyPath[keyPath.length - 1];\n    const newKeyPath: KeyPath[] = [\n      ...prevKeyPath,\n      { ...lastKeyPath, key: keyName } as KeyPath,\n    ];\n    setFocusedContentKeyPath(newKeyPath);\n  };\n\n  return (\n    <Container\n      transparency=\"xl\"\n      roundedSize=\"xl\"\n      className=\"w-full min-w-80 gap-2 overflow-auto px-5 py-2\"\n      border\n      borderColor=\"text\"\n      background=\"none\"\n      aria-selected={isSameKeyPath(keyPath, focusedContent?.keyPath ?? [])}\n      onClick={() => setFocusedContentKeyPath(keyPath)}\n    >\n      <div className=\"flex w-full flex-col items-start justify-between gap-3\">\n        {typeof sectionKey === 'string' && (\n          <div className=\"w-full\">\n            <div className=\"flex w-full items-center justify-between gap-10\">\n              <EditableFieldInput\n                name=\"key\"\n                aria-label=\"Key\"\n                placeholder={titleInput.placeholder.value}\n                defaultValue={sectionKey}\n                onSave={(value) => handleRenameNodeKey(value)}\n                variant={InputVariant.INVISIBLE}\n              />\n              <Button\n                label={deleteButton.label.value}\n                variant={ButtonVariant.HOVERABLE}\n                size={ButtonSize.ICON_SM}\n                color={ButtonColor.TEXT}\n                className=\"translate-x-2\"\n                Icon={Trash}\n                onClick={() => {\n                  addEditedContent(dictionaryLocalId, undefined, keyPath);\n\n                  const parentKeyPath: KeyPath[] = keyPath.slice(0, -1);\n                  setFocusedContentKeyPath(parentKeyPath);\n                }}\n              />\n            </div>\n\n            <span className=\"ml-3 text-neutral text-sm\">\n              ( {camelCaseToSentence(sectionKey)} )\n            </span>\n          </div>\n        )}\n        <NodeTypeView\n          keyPath={keyPath}\n          dictionaryLocalId={dictionaryLocalId}\n          section={section}\n          onNodeTypeChange={(content) => {\n            addEditedContent(dictionaryLocalId, content, keyPath);\n          }}\n        />\n      </div>\n    </Container>\n  );\n};\n\ntype ObjectViewProps = {\n  dictionaryLocalId: LocalDictionaryId;\n  keyPath: KeyPath[];\n  section: ContentNode;\n};\n\nexport const ObjectView: FC<ObjectViewProps> = ({\n  section,\n  keyPath,\n  dictionaryLocalId,\n}) => {\n  const { addNodeButton } = useIntlayer('structure-view');\n  const { setFocusedContentKeyPath } = useFocusUnmergedDictionary();\n  const { addEditedContent } = useEditedContentActions();\n\n  if (!section || typeof section !== 'object') {\n    return <div>Not an object</div>;\n  }\n\n  return (\n    <div className=\"flex flex-col gap-2 overflow-y-auto\">\n      <ul className=\"mr-auto flex flex-col gap-4\">\n        {Object.keys(section).map((key) => (\n          <li\n            key={`${JSON.stringify(keyPath)}-object-${key}`}\n            className=\"flex w-full\"\n          >\n            <NodeView\n              sectionKey={key}\n              section={section?.[key as keyof typeof section]}\n              keyPath={[...keyPath, { type: NodeType.Object, key }]}\n              dictionaryLocalId={dictionaryLocalId}\n            />\n          </li>\n        ))}\n      </ul>\n      <Button\n        label={addNodeButton.label.value}\n        variant={ButtonVariant.HOVERABLE}\n        size={ButtonSize.MD}\n        color={ButtonColor.TEXT}\n        Icon={Plus}\n        className=\"flex-1\"\n        onClick={() => {\n          const newKey = 'newKey';\n          const newKeyPath = [\n            ...keyPath,\n            { type: NodeType.Object, key: newKey },\n          ] as KeyPath[];\n          addEditedContent(dictionaryLocalId, '', newKeyPath);\n          setFocusedContentKeyPath(newKeyPath);\n        }}\n      >\n        {addNodeButton.text}\n      </Button>\n    </div>\n  );\n};\n\ntype StructureViewProps = {\n  dictionaryLocalId: LocalDictionaryId;\n  keyPath: KeyPath[];\n  section: ContentNode;\n};\n\nexport const StructureView: FC<StructureViewProps> = ({\n  section,\n  keyPath,\n  dictionaryLocalId,\n}) => {\n  if (\n    !section ||\n    typeof section !== 'object' ||\n    typeof section.nodeType === 'string'\n  ) {\n    return (\n      <NodeView\n        sectionKey={'content'}\n        section={section}\n        keyPath={keyPath}\n        dictionaryLocalId={dictionaryLocalId}\n      />\n    );\n  }\n\n  return (\n    <ObjectView\n      section={section}\n      keyPath={keyPath}\n      dictionaryLocalId={dictionaryLocalId}\n    />\n  );\n};\n"],"mappings":"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"}

package/dist/esm/components/DictionaryFieldEditor/StructureView/structureView.content.mjs

@@ -1,101 +1,2 @@
-import { t } from "intlayer";
-
-//#region src/components/DictionaryFieldEditor/StructureView/structureView.content.ts
-const structureViewContent = {
-	key: "structure-view",
-	content: {
-		titleInput: { placeholder: t({
-			en: "Enter the key of your node",
-			"en-GB": "Enter the key of your node",
-			fr: "Entrez la clé de votre nœud",
-			es: "Ingrese la clave de su nodo",
-			de: "Geben Sie den Schlüssel Ihres Knotens ein",
-			ja: "ノードのキーを入力してください",
-			ko: "노드의 키를 입력하세요",
-			zh: "输入您节点的键",
-			it: "Inserisci la chiave del tuo nodo",
-			pt: "Insira a chave do seu nó",
-			hi: "अपनी नोड की कुंजी दर्ज करें",
-			ar: "أدخل مفتاح العقدة الخاص بك",
-			ru: "Введите ключ вашего узла",
-			tr: "Düğümünüzün anahtarını girin",
-			pl: "Wprowadź klucz węzła",
-			id: "Masukkan kunci node Anda",
-			vi: "Nhập key của node của bạn",
-			uk: "Введіть ключ вашого вузла"
-		}) },
-		deleteButton: { label: t({
-			en: "Remove node from section",
-			"en-GB": "Remove node from section",
-			fr: "Supprimer le nœud de la section",
-			es: "Eliminar el nodo de la sección",
-			de: "Knoten aus dem Abschnitt entfernen",
-			ja: "セクションからノードを削除",
-			ko: "섹션에서 노드를 제거",
-			zh: "从部分中移除节点",
-			it: "Rimuovi nodo dalla sezione",
-			pt: "Remover nó da seção",
-			hi: "सेक्शन से नोड हटाएं",
-			ar: "إزالة العقدة من القسم",
-			ru: "Удалить узел из секции",
-			tr: "Düğümü bölümden kaldır",
-			pl: "Usuń węzeł z sekcji",
-			id: "Hapus node dari bagian",
-			vi: "Xóa node khỏi section",
-			uk: "Видалити вузол з розділу"
-		}) },
-		addNodeButton: {
-			label: t({
-				en: "Click to add a new node",
-				"en-GB": "Click to add a new node",
-				fr: "Cliquez pour ajouter un nouveau nœud",
-				es: "Haga clic para agregar un nuevo nodo",
-				de: "Klicken, um einen neuen Knoten hinzuzufügen",
-				ja: "新しいノードを追加するにはクリックしてください",
-				ko: "새 노드를 추가하려면 클릭하세요",
-				zh: "点击添加新节点",
-				it: "Fai clic per aggiungere un nuovo nodo",
-				pt: "Clique para adicionar um novo nó",
-				hi: "नया नोड जोड़ने के लिए क्लिक करें",
-				ar: "انقر لإضافة عقدة جديدة",
-				ru: "Нажмите, чтобы добавить новый узел",
-				tr: "Yeni bir düğüm eklemek için tıklayın",
-				pl: "Kliknij, aby dodać nowy węzeł",
-				id: "Klik untuk menambahkan node baru",
-				vi: "Nhấp để thêm node mới",
-				uk: "Натисніть, щоб додати новий вузол"
-			}),
-			text: t({
-				en: "Add a new node",
-				"en-GB": "Add a new node",
-				fr: "Ajouter un nouveau nœud",
-				es: "Agregar un nuevo nodo",
-				de: "Neuen Knoten hinzufügen",
-				ja: "新しいノードを追加",
-				ko: "새 노드 추가",
-				zh: "添加新节点",
-				it: "Aggiungi un nuovo nodo",
-				pt: "Adicionar um novo nó",
-				hi: "नया नोड जोड़ें",
-				ar: "إضافة عقدة جديدة",
-				ru: "Добавить новый узел",
-				tr: "Yeni bir düğüm ekle",
-				pl: "Dodaj nowy węzeł",
-				id: "Tambahkan node baru",
-				vi: "Thêm node mới",
-				uk: "Додати новий вузол"
-			})
-		}
-	},
-	title: "Structure view",
-	description: "Interface content for managing nodes within a structured view, including actions to add, remove, and identify nodes by key.",
-	tags: [
-		"form",
-		"dictionary editor",
-		"structure management"
-	]
-};
-
-//#endregion
-export { structureViewContent as default, structureViewContent };
+import{t as e}from"intlayer";const t={key:`structure-view`,content:{titleInput:{placeholder:e({en:`Enter the key of your node`,"en-GB":`Enter the key of your node`,fr:`Entrez la clé de votre nœud`,es:`Ingrese la clave de su nodo`,de:`Geben Sie den Schlüssel Ihres Knotens ein`,ja:`ノードのキーを入力してください`,ko:`노드의 키를 입력하세요`,zh:`输入您节点的键`,it:`Inserisci la chiave del tuo nodo`,pt:`Insira a chave do seu nó`,hi:`अपनी नोड की कुंजी दर्ज करें`,ar:`أدخل مفتاح العقدة الخاص بك`,ru:`Введите ключ вашего узла`,tr:`Düğümünüzün anahtarını girin`,pl:`Wprowadź klucz węzła`,id:`Masukkan kunci node Anda`,vi:`Nhập key của node của bạn`,uk:`Введіть ключ вашого вузла`})},deleteButton:{label:e({en:`Remove node from section`,"en-GB":`Remove node from section`,fr:`Supprimer le nœud de la section`,es:`Eliminar el nodo de la sección`,de:`Knoten aus dem Abschnitt entfernen`,ja:`セクションからノードを削除`,ko:`섹션에서 노드를 제거`,zh:`从部分中移除节点`,it:`Rimuovi nodo dalla sezione`,pt:`Remover nó da seção`,hi:`सेक्शन से नोड हटाएं`,ar:`إزالة العقدة من القسم`,ru:`Удалить узел из секции`,tr:`Düğümü bölümden kaldır`,pl:`Usuń węzeł z sekcji`,id:`Hapus node dari bagian`,vi:`Xóa node khỏi section`,uk:`Видалити вузол з розділу`})},addNodeButton:{label:e({en:`Click to add a new node`,"en-GB":`Click to add a new node`,fr:`Cliquez pour ajouter un nouveau nœud`,es:`Haga clic para agregar un nuevo nodo`,de:`Klicken, um einen neuen Knoten hinzuzufügen`,ja:`新しいノードを追加するにはクリックしてください`,ko:`새 노드를 추가하려면 클릭하세요`,zh:`点击添加新节点`,it:`Fai clic per aggiungere un nuovo nodo`,pt:`Clique para adicionar um novo nó`,hi:`नया नोड जोड़ने के लिए क्लिक करें`,ar:`انقر لإضافة عقدة جديدة`,ru:`Нажмите, чтобы добавить новый узел`,tr:`Yeni bir düğüm eklemek için tıklayın`,pl:`Kliknij, aby dodać nowy węzeł`,id:`Klik untuk menambahkan node baru`,vi:`Nhấp để thêm node mới`,uk:`Натисніть, щоб додати новий вузол`}),text:e({en:`Add a new node`,"en-GB":`Add a new node`,fr:`Ajouter un nouveau nœud`,es:`Agregar un nuevo nodo`,de:`Neuen Knoten hinzufügen`,ja:`新しいノードを追加`,ko:`새 노드 추가`,zh:`添加新节点`,it:`Aggiungi un nuovo nodo`,pt:`Adicionar um novo nó`,hi:`नया नोड जोड़ें`,ar:`إضافة عقدة جديدة`,ru:`Добавить новый узел`,tr:`Yeni bir düğüm ekle`,pl:`Dodaj nowy węzeł`,id:`Tambahkan node baru`,vi:`Thêm node mới`,uk:`Додати новий вузол`})}},title:`Structure view`,description:`Interface content for managing nodes within a structured view, including actions to add, remove, and identify nodes by key.`,tags:[`form`,`dictionary editor`,`structure management`]};export{t as default,t as structureViewContent};
 //# sourceMappingURL=structureView.content.mjs.map

package/dist/esm/components/DictionaryFieldEditor/StructureView/structureView.content.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"structureView.content.mjs","names":[],"sources":["../../../../../src/components/DictionaryFieldEditor/StructureView/structureView.content.ts"],"sourcesContent":["import { type Dictionary, t } from 'intlayer';\n\nexport const structureViewContent = {\n  key: 'structure-view',\n  content: {\n    titleInput: {\n      placeholder: t({\n        en: 'Enter the key of your node',\n        'en-GB': 'Enter the key of your node',\n        fr: 'Entrez la clé de votre nœud',\n        es: 'Ingrese la clave de su nodo',\n        de: 'Geben Sie den Schlüssel Ihres Knotens ein',\n        ja: 'ノードのキーを入力してください',\n        ko: '노드의 키를 입력하세요',\n        zh: '输入您节点的键',\n        it: 'Inserisci la chiave del tuo nodo',\n        pt: 'Insira a chave do seu nó',\n        hi: 'अपनी नोड की कुंजी दर्ज करें',\n        ar: 'أدخل مفتاح العقدة الخاص بك',\n        ru: 'Введите ключ вашего узла',\n        tr: 'Düğümünüzün anahtarını girin',\n        pl: 'Wprowadź klucz węzła',\n        id: 'Masukkan kunci node Anda',\n        vi: 'Nhập key của node của bạn',\n        uk: 'Введіть ключ вашого вузла',\n      }),\n    },\n    deleteButton: {\n      label: t({\n        en: 'Remove node from section',\n        'en-GB': 'Remove node from section',\n        fr: 'Supprimer le nœud de la section',\n        es: 'Eliminar el nodo de la sección',\n        de: 'Knoten aus dem Abschnitt entfernen',\n        ja: 'セクションからノードを削除',\n        ko: '섹션에서 노드를 제거',\n        zh: '从部分中移除节点',\n        it: 'Rimuovi nodo dalla sezione',\n        pt: 'Remover nó da seção',\n        hi: 'सेक्शन से नोड हटाएं',\n        ar: 'إزالة العقدة من القسم',\n        ru: 'Удалить узел из секции',\n        tr: 'Düğümü bölümden kaldır',\n        pl: 'Usuń węzeł z sekcji',\n        id: 'Hapus node dari bagian',\n        vi: 'Xóa node khỏi section',\n        uk: 'Видалити вузол з розділу',\n      }),\n    },\n    addNodeButton: {\n      label: t({\n        en: 'Click to add a new node',\n        'en-GB': 'Click to add a new node',\n        fr: 'Cliquez pour ajouter un nouveau nœud',\n        es: 'Haga clic para agregar un nuevo nodo',\n        de: 'Klicken, um einen neuen Knoten hinzuzufügen',\n        ja: '新しいノードを追加するにはクリックしてください',\n        ko: '새 노드를 추가하려면 클릭하세요',\n        zh: '点击添加新节点',\n        it: 'Fai clic per aggiungere un nuovo nodo',\n        pt: 'Clique para adicionar um novo nó',\n        hi: 'नया नोड जोड़ने के लिए क्लिक करें',\n        ar: 'انقر لإضافة عقدة جديدة',\n        ru: 'Нажмите, чтобы добавить новый узел',\n        tr: 'Yeni bir düğüm eklemek için tıklayın',\n        pl: 'Kliknij, aby dodać nowy węzeł',\n        id: 'Klik untuk menambahkan node baru',\n        vi: 'Nhấp để thêm node mới',\n        uk: 'Натисніть, щоб додати новий вузол',\n      }),\n      text: t({\n        en: 'Add a new node',\n        'en-GB': 'Add a new node',\n        fr: 'Ajouter un nouveau nœud',\n        es: 'Agregar un nuevo nodo',\n        de: 'Neuen Knoten hinzufügen',\n        ja: '新しいノードを追加',\n        ko: '새 노드 추가',\n        zh: '添加新节点',\n        it: 'Aggiungi un nuovo nodo',\n        pt: 'Adicionar um novo nó',\n        hi: 'नया नोड जोड़ें',\n        ar: 'إضافة عقدة جديدة',\n        ru: 'Добавить новый узел',\n        tr: 'Yeni bir düğüm ekle',\n        pl: 'Dodaj nowy węzeł',\n        id: 'Tambahkan node baru',\n        vi: 'Thêm node mới',\n        uk: 'Додати новий вузол',\n      }),\n    },\n  },\n  title: 'Structure view',\n  description:\n    'Interface content for managing nodes within a structured view, including actions to add, remove, and identify nodes by key.',\n  tags: ['form', 'dictionary editor', 'structure management'],\n} satisfies Dictionary;\n\nexport default structureViewContent;\n"],"mappings":";;;AAEA,MAAa,uBAAuB;CAClC,KAAK;CACL,SAAS;EACP,YAAY,EACV,aAAa,EAAE;GACb,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC,EACH;EACD,cAAc,EACZ,OAAO,EAAE;GACP,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAAC,EACH;EACD,eAAe;GACb,OAAO,EAAE;IACP,IAAI;IACJ,SAAS;IACT,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACL,CAAC;GACF,MAAM,EAAE;IACN,IAAI;IACJ,SAAS;IACT,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACL,CAAC;GACH;EACF;CACD,OAAO;CACP,aACE;CACF,MAAM;EAAC;EAAQ;EAAqB;EAAuB;CAC5D"}
+{"version":3,"file":"structureView.content.mjs","names":[],"sources":["../../../../../src/components/DictionaryFieldEditor/StructureView/structureView.content.ts"],"sourcesContent":["import { type Dictionary, t } from 'intlayer';\n\nexport const structureViewContent = {\n  key: 'structure-view',\n  content: {\n    titleInput: {\n      placeholder: t({\n        en: 'Enter the key of your node',\n        'en-GB': 'Enter the key of your node',\n        fr: 'Entrez la clé de votre nœud',\n        es: 'Ingrese la clave de su nodo',\n        de: 'Geben Sie den Schlüssel Ihres Knotens ein',\n        ja: 'ノードのキーを入力してください',\n        ko: '노드의 키를 입력하세요',\n        zh: '输入您节点的键',\n        it: 'Inserisci la chiave del tuo nodo',\n        pt: 'Insira a chave do seu nó',\n        hi: 'अपनी नोड की कुंजी दर्ज करें',\n        ar: 'أدخل مفتاح العقدة الخاص بك',\n        ru: 'Введите ключ вашего узла',\n        tr: 'Düğümünüzün anahtarını girin',\n        pl: 'Wprowadź klucz węzła',\n        id: 'Masukkan kunci node Anda',\n        vi: 'Nhập key của node của bạn',\n        uk: 'Введіть ключ вашого вузла',\n      }),\n    },\n    deleteButton: {\n      label: t({\n        en: 'Remove node from section',\n        'en-GB': 'Remove node from section',\n        fr: 'Supprimer le nœud de la section',\n        es: 'Eliminar el nodo de la sección',\n        de: 'Knoten aus dem Abschnitt entfernen',\n        ja: 'セクションからノードを削除',\n        ko: '섹션에서 노드를 제거',\n        zh: '从部分中移除节点',\n        it: 'Rimuovi nodo dalla sezione',\n        pt: 'Remover nó da seção',\n        hi: 'सेक्शन से नोड हटाएं',\n        ar: 'إزالة العقدة من القسم',\n        ru: 'Удалить узел из секции',\n        tr: 'Düğümü bölümden kaldır',\n        pl: 'Usuń węzeł z sekcji',\n        id: 'Hapus node dari bagian',\n        vi: 'Xóa node khỏi section',\n        uk: 'Видалити вузол з розділу',\n      }),\n    },\n    addNodeButton: {\n      label: t({\n        en: 'Click to add a new node',\n        'en-GB': 'Click to add a new node',\n        fr: 'Cliquez pour ajouter un nouveau nœud',\n        es: 'Haga clic para agregar un nuevo nodo',\n        de: 'Klicken, um einen neuen Knoten hinzuzufügen',\n        ja: '新しいノードを追加するにはクリックしてください',\n        ko: '새 노드를 추가하려면 클릭하세요',\n        zh: '点击添加新节点',\n        it: 'Fai clic per aggiungere un nuovo nodo',\n        pt: 'Clique para adicionar um novo nó',\n        hi: 'नया नोड जोड़ने के लिए क्लिक करें',\n        ar: 'انقر لإضافة عقدة جديدة',\n        ru: 'Нажмите, чтобы добавить новый узел',\n        tr: 'Yeni bir düğüm eklemek için tıklayın',\n        pl: 'Kliknij, aby dodać nowy węzeł',\n        id: 'Klik untuk menambahkan node baru',\n        vi: 'Nhấp để thêm node mới',\n        uk: 'Натисніть, щоб додати новий вузол',\n      }),\n      text: t({\n        en: 'Add a new node',\n        'en-GB': 'Add a new node',\n        fr: 'Ajouter un nouveau nœud',\n        es: 'Agregar un nuevo nodo',\n        de: 'Neuen Knoten hinzufügen',\n        ja: '新しいノードを追加',\n        ko: '새 노드 추가',\n        zh: '添加新节点',\n        it: 'Aggiungi un nuovo nodo',\n        pt: 'Adicionar um novo nó',\n        hi: 'नया नोड जोड़ें',\n        ar: 'إضافة عقدة جديدة',\n        ru: 'Добавить новый узел',\n        tr: 'Yeni bir düğüm ekle',\n        pl: 'Dodaj nowy węzeł',\n        id: 'Tambahkan node baru',\n        vi: 'Thêm node mới',\n        uk: 'Додати новий вузол',\n      }),\n    },\n  },\n  title: 'Structure view',\n  description:\n    'Interface content for managing nodes within a structured view, including actions to add, remove, and identify nodes by key.',\n  tags: ['form', 'dictionary editor', 'structure management'],\n} satisfies Dictionary;\n\nexport default structureViewContent;\n"],"mappings":"6BAEA,MAAa,EAAuB,CAClC,IAAK,iBACL,QAAS,CACP,WAAY,CACV,YAAa,EAAE,CACb,GAAI,6BACJ,QAAS,6BACT,GAAI,8BACJ,GAAI,8BACJ,GAAI,4CACJ,GAAI,kBACJ,GAAI,eACJ,GAAI,UACJ,GAAI,mCACJ,GAAI,2BACJ,GAAI,8BACJ,GAAI,6BACJ,GAAI,2BACJ,GAAI,+BACJ,GAAI,uBACJ,GAAI,2BACJ,GAAI,4BACJ,GAAI,4BACL,CAAC,CACH,CACD,aAAc,CACZ,MAAO,EAAE,CACP,GAAI,2BACJ,QAAS,2BACT,GAAI,kCACJ,GAAI,iCACJ,GAAI,qCACJ,GAAI,gBACJ,GAAI,cACJ,GAAI,WACJ,GAAI,6BACJ,GAAI,sBACJ,GAAI,sBACJ,GAAI,wBACJ,GAAI,yBACJ,GAAI,yBACJ,GAAI,sBACJ,GAAI,yBACJ,GAAI,wBACJ,GAAI,2BACL,CAAC,CACH,CACD,cAAe,CACb,MAAO,EAAE,CACP,GAAI,0BACJ,QAAS,0BACT,GAAI,uCACJ,GAAI,uCACJ,GAAI,8CACJ,GAAI,0BACJ,GAAI,oBACJ,GAAI,UACJ,GAAI,wCACJ,GAAI,mCACJ,GAAI,mCACJ,GAAI,yBACJ,GAAI,qCACJ,GAAI,uCACJ,GAAI,gCACJ,GAAI,mCACJ,GAAI,wBACJ,GAAI,oCACL,CAAC,CACF,KAAM,EAAE,CACN,GAAI,iBACJ,QAAS,iBACT,GAAI,0BACJ,GAAI,wBACJ,GAAI,0BACJ,GAAI,YACJ,GAAI,UACJ,GAAI,QACJ,GAAI,yBACJ,GAAI,uBACJ,GAAI,iBACJ,GAAI,mBACJ,GAAI,sBACJ,GAAI,sBACJ,GAAI,mBACJ,GAAI,sBACJ,GAAI,gBACJ,GAAI,qBACL,CAAC,CACH,CACF,CACD,MAAO,iBACP,YACE,8HACF,KAAM,CAAC,OAAQ,oBAAqB,uBAAuB,CAC5D"}

package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.mjs

@@ -1,74 +1,2 @@
-'use client';
-
-import { Container } from "../../Container/index.mjs";
-import { Button, ButtonColor, ButtonSize, ButtonTextAlign, ButtonVariant } from "../../Button/Button.mjs";
-import { DropDown } from "../../DropDown/index.mjs";
-import { useVersionSwitcher } from "./VersionSwitcherContext.mjs";
-import { MoveVertical } from "lucide-react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useIntlayer } from "react-intlayer";
-
-//#region src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.tsx
-const DROPDOWN_IDENTIFIER = "version-switcher";
-const VersionSwitcher = ({ panelProps }) => {
-	const { switchTo, versionSwitcherLabel, versionListLabel } = useIntlayer("version-switcher");
-	const { selectedVersion, versions, setSelectedVersion } = useVersionSwitcher();
-	if (versions.length === 0) return /* @__PURE__ */ jsx(Fragment, {});
-	return /* @__PURE__ */ jsx("div", {
-		className: "rounded-xl border border-text text-text transition-colors",
-		"aria-label": versionListLabel.value,
-		children: /* @__PURE__ */ jsxs(DropDown, {
-			identifier: DROPDOWN_IDENTIFIER,
-			children: [/* @__PURE__ */ jsx(DropDown.Trigger, {
-				identifier: DROPDOWN_IDENTIFIER,
-				children: /* @__PURE__ */ jsxs("div", {
-					className: "flex w-full items-center justify-between",
-					children: [/* @__PURE__ */ jsx("div", {
-						className: "px-2",
-						children: selectedVersion ?? "LTS"
-					}), /* @__PURE__ */ jsx(MoveVertical, { className: "w-5 self-center" })]
-				})
-			}), /* @__PURE__ */ jsx(DropDown.Panel, {
-				identifier: DROPDOWN_IDENTIFIER,
-				isOverable: true,
-				isFocusable: true,
-				className: "right-0 left-auto",
-				...panelProps,
-				children: /* @__PURE__ */ jsx(Container, {
-					className: "max-h-[80vh] min-w-28",
-					separator: "y",
-					role: "listbox",
-					transparency: "xs",
-					border: true,
-					roundedSize: "2xl",
-					borderColor: "text",
-					"aria-label": versionSwitcherLabel.value,
-					children: /* @__PURE__ */ jsx("ol", {
-						className: "divide-y divide-dashed divide-text/20 overflow-y-auto p-1",
-						children: versions.reverse().map((version) => /* @__PURE__ */ jsx("li", {
-							className: "px-1.5 py-1",
-							children: /* @__PURE__ */ jsx(Button, {
-								onClick: () => setSelectedVersion(version),
-								label: `${switchTo} v${version}`,
-								isActive: selectedVersion === version,
-								variant: ButtonVariant.HOVERABLE,
-								color: ButtonColor.TEXT,
-								isFullWidth: true,
-								textAlign: ButtonTextAlign.LEFT,
-								size: ButtonSize.SM,
-								children: /* @__PURE__ */ jsx("div", {
-									className: "flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1 text-neutral text-sm",
-									children: version
-								})
-							})
-						}, version))
-					})
-				})
-			})]
-		})
-	});
-};
-
-//#endregion
-export { VersionSwitcher };
+"use client";import{Container as e}from"../../Container/index.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonTextAlign as i,ButtonVariant as a}from"../../Button/Button.mjs";import{DropDown as o}from"../../DropDown/index.mjs";import{useVersionSwitcher as s}from"./VersionSwitcherContext.mjs";import{MoveVertical as c}from"lucide-react";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{useIntlayer as f}from"react-intlayer";const p=`version-switcher`,m=({panelProps:m})=>{let{switchTo:h,versionSwitcherLabel:g,versionListLabel:_}=f(`version-switcher`),{selectedVersion:v,versions:y,setSelectedVersion:b}=s();return y.length===0?u(l,{}):u(`div`,{className:`rounded-xl border border-text text-text transition-colors`,"aria-label":_.value,children:d(o,{identifier:p,children:[u(o.Trigger,{identifier:p,children:d(`div`,{className:`flex w-full items-center justify-between`,children:[u(`div`,{className:`px-2`,children:v??`LTS`}),u(c,{className:`w-5 self-center`})]})}),u(o.Panel,{identifier:p,isOverable:!0,isFocusable:!0,className:`right-0 left-auto`,...m,children:u(e,{className:`max-h-[80vh] min-w-28`,separator:`y`,role:`listbox`,transparency:`xs`,border:!0,roundedSize:`2xl`,borderColor:`text`,"aria-label":g.value,children:u(`ol`,{className:`divide-y divide-dashed divide-text/20 overflow-y-auto p-1`,children:y.reverse().map(e=>u(`li`,{className:`px-1.5 py-1`,children:u(t,{onClick:()=>b(e),label:`${h} v${e}`,isActive:v===e,variant:a.HOVERABLE,color:n.TEXT,isFullWidth:!0,textAlign:i.LEFT,size:r.SM,children:u(`div`,{className:`flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1 text-neutral text-sm`,children:e})})},e))})})})]})})};export{m as VersionSwitcher};
 //# sourceMappingURL=VersionSwitcher.mjs.map

package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VersionSwitcher.mjs","names":[],"sources":["../../../../../src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Button,\n  ButtonColor,\n  ButtonSize,\n  ButtonTextAlign,\n  ButtonVariant,\n} from '@components/Button';\nimport { Container } from '@components/Container';\nimport { DropDown, type PanelProps } from '@components/DropDown';\nimport { MoveVertical } from 'lucide-react';\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { useVersionSwitcher } from './VersionSwitcherContext';\n\nexport type VersionSwitcherProps = {\n  panelProps?: Omit<PanelProps, 'identifier'>;\n};\n\nconst DROPDOWN_IDENTIFIER = 'version-switcher';\n\nexport const VersionSwitcher: FC<VersionSwitcherProps> = ({ panelProps }) => {\n  const { switchTo, versionSwitcherLabel, versionListLabel } =\n    useIntlayer('version-switcher');\n  const { selectedVersion, versions, setSelectedVersion } =\n    useVersionSwitcher();\n\n  if (versions.length === 0) {\n    return <></>;\n  }\n\n  return (\n    <div\n      className=\"rounded-xl border border-text text-text transition-colors\"\n      aria-label={versionListLabel.value}\n    >\n      <DropDown identifier={DROPDOWN_IDENTIFIER}>\n        <DropDown.Trigger identifier={DROPDOWN_IDENTIFIER}>\n          <div className=\"flex w-full items-center justify-between\">\n            <div className=\"px-2\">{selectedVersion ?? 'LTS'}</div>\n            <MoveVertical className=\"w-5 self-center\" />\n          </div>\n        </DropDown.Trigger>\n\n        <DropDown.Panel\n          identifier={DROPDOWN_IDENTIFIER}\n          isOverable\n          isFocusable\n          className=\"right-0 left-auto\"\n          {...panelProps}\n        >\n          <Container\n            className=\"max-h-[80vh] min-w-28\"\n            separator=\"y\"\n            role=\"listbox\"\n            transparency=\"xs\"\n            border\n            roundedSize=\"2xl\"\n            borderColor=\"text\"\n            aria-label={versionSwitcherLabel.value}\n          >\n            <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n              {versions.reverse().map((version) => (\n                <li className=\"px-1.5 py-1\" key={version}>\n                  <Button\n                    onClick={() => setSelectedVersion(version)}\n                    label={`${switchTo} v${version}`}\n                    isActive={selectedVersion === version}\n                    variant={ButtonVariant.HOVERABLE}\n                    color={ButtonColor.TEXT}\n                    isFullWidth\n                    textAlign={ButtonTextAlign.LEFT}\n                    size={ButtonSize.SM}\n                  >\n                    <div className=\"flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1 text-neutral text-sm\">\n                      {version}\n                    </div>\n                  </Button>\n                </li>\n              ))}\n            </ol>\n          </Container>\n        </DropDown.Panel>\n      </DropDown>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAoBA,MAAM,sBAAsB;AAE5B,MAAa,mBAA6C,EAAE,iBAAiB;CAC3E,MAAM,EAAE,UAAU,sBAAsB,qBACtC,YAAY,mBAAmB;CACjC,MAAM,EAAE,iBAAiB,UAAU,uBACjC,oBAAoB;AAEtB,KAAI,SAAS,WAAW,EACtB,QAAO,iCAAK;AAGd,QACE,oBAAC;EACC,WAAU;EACV,cAAY,iBAAiB;YAE7B,qBAAC;GAAS,YAAY;cACpB,oBAAC,SAAS;IAAQ,YAAY;cAC5B,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAI,WAAU;gBAAQ,mBAAmB;OAAY,EACtD,oBAAC,gBAAa,WAAU,oBAAoB;MACxC;KACW,EAEnB,oBAAC,SAAS;IACR,YAAY;IACZ;IACA;IACA,WAAU;IACV,GAAI;cAEJ,oBAAC;KACC,WAAU;KACV,WAAU;KACV,MAAK;KACL,cAAa;KACb;KACA,aAAY;KACZ,aAAY;KACZ,cAAY,qBAAqB;eAEjC,oBAAC;MAAG,WAAU;gBACX,SAAS,SAAS,CAAC,KAAK,YACvB,oBAAC;OAAG,WAAU;iBACZ,oBAAC;QACC,eAAe,mBAAmB,QAAQ;QAC1C,OAAO,GAAG,SAAS,IAAI;QACvB,UAAU,oBAAoB;QAC9B,SAAS,cAAc;QACvB,OAAO,YAAY;QACnB;QACA,WAAW,gBAAgB;QAC3B,MAAM,WAAW;kBAEjB,oBAAC;SAAI,WAAU;mBACZ;UACG;SACC;SAdsB,QAe5B,CACL;OACC;MACK;KACG;IACR;GACP"}
+{"version":3,"file":"VersionSwitcher.mjs","names":[],"sources":["../../../../../src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Button,\n  ButtonColor,\n  ButtonSize,\n  ButtonTextAlign,\n  ButtonVariant,\n} from '@components/Button';\nimport { Container } from '@components/Container';\nimport { DropDown, type PanelProps } from '@components/DropDown';\nimport { MoveVertical } from 'lucide-react';\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { useVersionSwitcher } from './VersionSwitcherContext';\n\nexport type VersionSwitcherProps = {\n  panelProps?: Omit<PanelProps, 'identifier'>;\n};\n\nconst DROPDOWN_IDENTIFIER = 'version-switcher';\n\nexport const VersionSwitcher: FC<VersionSwitcherProps> = ({ panelProps }) => {\n  const { switchTo, versionSwitcherLabel, versionListLabel } =\n    useIntlayer('version-switcher');\n  const { selectedVersion, versions, setSelectedVersion } =\n    useVersionSwitcher();\n\n  if (versions.length === 0) {\n    return <></>;\n  }\n\n  return (\n    <div\n      className=\"rounded-xl border border-text text-text transition-colors\"\n      aria-label={versionListLabel.value}\n    >\n      <DropDown identifier={DROPDOWN_IDENTIFIER}>\n        <DropDown.Trigger identifier={DROPDOWN_IDENTIFIER}>\n          <div className=\"flex w-full items-center justify-between\">\n            <div className=\"px-2\">{selectedVersion ?? 'LTS'}</div>\n            <MoveVertical className=\"w-5 self-center\" />\n          </div>\n        </DropDown.Trigger>\n\n        <DropDown.Panel\n          identifier={DROPDOWN_IDENTIFIER}\n          isOverable\n          isFocusable\n          className=\"right-0 left-auto\"\n          {...panelProps}\n        >\n          <Container\n            className=\"max-h-[80vh] min-w-28\"\n            separator=\"y\"\n            role=\"listbox\"\n            transparency=\"xs\"\n            border\n            roundedSize=\"2xl\"\n            borderColor=\"text\"\n            aria-label={versionSwitcherLabel.value}\n          >\n            <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n              {versions.reverse().map((version) => (\n                <li className=\"px-1.5 py-1\" key={version}>\n                  <Button\n                    onClick={() => setSelectedVersion(version)}\n                    label={`${switchTo} v${version}`}\n                    isActive={selectedVersion === version}\n                    variant={ButtonVariant.HOVERABLE}\n                    color={ButtonColor.TEXT}\n                    isFullWidth\n                    textAlign={ButtonTextAlign.LEFT}\n                    size={ButtonSize.SM}\n                  >\n                    <div className=\"flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1 text-neutral text-sm\">\n                      {version}\n                    </div>\n                  </Button>\n                </li>\n              ))}\n            </ol>\n          </Container>\n        </DropDown.Panel>\n      </DropDown>\n    </div>\n  );\n};\n"],"mappings":"4cAoBA,MAAM,EAAsB,mBAEf,GAA6C,CAAE,gBAAiB,CAC3E,GAAM,CAAE,WAAU,uBAAsB,oBACtC,EAAY,mBAAmB,CAC3B,CAAE,kBAAiB,WAAU,sBACjC,GAAoB,CAMtB,OAJI,EAAS,SAAW,EACf,EAAA,EAAA,EAAA,CAAK,CAIZ,EAAC,MAAA,CACC,UAAU,4DACV,aAAY,EAAiB,eAE7B,EAAC,EAAA,CAAS,WAAY,YACpB,EAAC,EAAS,QAAA,CAAQ,WAAY,WAC5B,EAAC,MAAA,CAAI,UAAU,qDACb,EAAC,MAAA,CAAI,UAAU,gBAAQ,GAAmB,OAAY,CACtD,EAAC,EAAA,CAAa,UAAU,kBAAA,CAAoB,CAAA,EACxC,EACW,CAEnB,EAAC,EAAS,MAAA,CACR,WAAY,EACZ,WAAA,GACA,YAAA,GACA,UAAU,oBACV,GAAI,WAEJ,EAAC,EAAA,CACC,UAAU,wBACV,UAAU,IACV,KAAK,UACL,aAAa,KACb,OAAA,GACA,YAAY,MACZ,YAAY,OACZ,aAAY,EAAqB,eAEjC,EAAC,KAAA,CAAG,UAAU,qEACX,EAAS,SAAS,CAAC,IAAK,GACvB,EAAC,KAAA,CAAG,UAAU,uBACZ,EAAC,EAAA,CACC,YAAe,EAAmB,EAAQ,CAC1C,MAAO,GAAG,EAAS,IAAI,IACvB,SAAU,IAAoB,EAC9B,QAAS,EAAc,UACvB,MAAO,EAAY,KACnB,YAAA,GACA,UAAW,EAAgB,KAC3B,KAAM,EAAW,YAEjB,EAAC,MAAA,CAAI,UAAU,kGACZ,GACG,EACC,EAdsB,EAe5B,CACL,EACC,EACK,EACG,CAAA,EACR,EACP"}

package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.mjs

@@ -1,28 +1,2 @@
-'use client';
-
-import { usePersistedStore } from "../../../hooks/usePersistedStore.mjs";
-import { createContext, useContext } from "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.tsx
-const VersionSwitcherContext = createContext({
-	versions: [],
-	selectedVersion: null,
-	setSelectedVersion: () => {}
-});
-const useVersionSwitcher = () => useContext(VersionSwitcherContext);
-const VersionSwitcherProvider = ({ versions, defaultSelectedVersion, children }) => {
-	const [selectedVersion, setSelectedVersion] = usePersistedStore("version-selector", defaultSelectedVersion);
-	return /* @__PURE__ */ jsx(VersionSwitcherContext, {
-		value: {
-			versions,
-			selectedVersion,
-			setSelectedVersion
-		},
-		children
-	});
-};
-
-//#endregion
-export { VersionSwitcherProvider, useVersionSwitcher };
+"use client";import{usePersistedStore as e}from"../../../hooks/usePersistedStore.mjs";import{createContext as t,useContext as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=t({versions:[],selectedVersion:null,setSelectedVersion:()=>{}}),a=()=>n(i),o=({versions:t,defaultSelectedVersion:n,children:a})=>{let[o,s]=e(`version-selector`,n);return r(i,{value:{versions:t,selectedVersion:o,setSelectedVersion:s},children:a})};export{o as VersionSwitcherProvider,a as useVersionSwitcher};
 //# sourceMappingURL=VersionSwitcherContext.mjs.map

package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VersionSwitcherContext.mjs","names":[],"sources":["../../../../../src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.tsx"],"sourcesContent":["'use client';\n\nimport { usePersistedStore } from '@hooks/usePersistedStore';\nimport {\n  createContext,\n  type Dispatch,\n  type FC,\n  type PropsWithChildren,\n  type SetStateAction,\n  useContext,\n} from 'react';\n\ntype VersionSwitcherContextProps = {\n  versions: string[];\n  selectedVersion: string | null;\n  setSelectedVersion: Dispatch<SetStateAction<string | null>>;\n};\n\nconst VersionSwitcherContext = createContext<VersionSwitcherContextProps>({\n  versions: [],\n  selectedVersion: null,\n  setSelectedVersion: () => {},\n});\n\nexport const useVersionSwitcher = () => useContext(VersionSwitcherContext);\n\ntype VersionSwitcherProviderProps = {\n  versions: string[];\n  defaultSelectedVersion?: string;\n};\n\nexport const VersionSwitcherProvider: FC<\n  PropsWithChildren<VersionSwitcherProviderProps>\n> = ({ versions, defaultSelectedVersion, children }) => {\n  const [selectedVersion, setSelectedVersion] = usePersistedStore<\n    string | null\n  >('version-selector', defaultSelectedVersion);\n\n  return (\n    <VersionSwitcherContext\n      value={{\n        versions,\n        selectedVersion,\n        setSelectedVersion,\n      }}\n    >\n      {children}\n    </VersionSwitcherContext>\n  );\n};\n"],"mappings":";;;;;;;AAkBA,MAAM,yBAAyB,cAA2C;CACxE,UAAU,EAAE;CACZ,iBAAiB;CACjB,0BAA0B;CAC3B,CAAC;AAEF,MAAa,2BAA2B,WAAW,uBAAuB;AAO1E,MAAa,2BAER,EAAE,UAAU,wBAAwB,eAAe;CACtD,MAAM,CAAC,iBAAiB,sBAAsB,kBAE5C,oBAAoB,uBAAuB;AAE7C,QACE,oBAAC;EACC,OAAO;GACL;GACA;GACA;GACD;EAEA;GACsB"}
+{"version":3,"file":"VersionSwitcherContext.mjs","names":[],"sources":["../../../../../src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.tsx"],"sourcesContent":["'use client';\n\nimport { usePersistedStore } from '@hooks/usePersistedStore';\nimport {\n  createContext,\n  type Dispatch,\n  type FC,\n  type PropsWithChildren,\n  type SetStateAction,\n  useContext,\n} from 'react';\n\ntype VersionSwitcherContextProps = {\n  versions: string[];\n  selectedVersion: string | null;\n  setSelectedVersion: Dispatch<SetStateAction<string | null>>;\n};\n\nconst VersionSwitcherContext = createContext<VersionSwitcherContextProps>({\n  versions: [],\n  selectedVersion: null,\n  setSelectedVersion: () => {},\n});\n\nexport const useVersionSwitcher = () => useContext(VersionSwitcherContext);\n\ntype VersionSwitcherProviderProps = {\n  versions: string[];\n  defaultSelectedVersion?: string;\n};\n\nexport const VersionSwitcherProvider: FC<\n  PropsWithChildren<VersionSwitcherProviderProps>\n> = ({ versions, defaultSelectedVersion, children }) => {\n  const [selectedVersion, setSelectedVersion] = usePersistedStore<\n    string | null\n  >('version-selector', defaultSelectedVersion);\n\n  return (\n    <VersionSwitcherContext\n      value={{\n        versions,\n        selectedVersion,\n        setSelectedVersion,\n      }}\n    >\n      {children}\n    </VersionSwitcherContext>\n  );\n};\n"],"mappings":"oLAkBA,MAAM,EAAyB,EAA2C,CACxE,SAAU,EAAE,CACZ,gBAAiB,KACjB,uBAA0B,GAC3B,CAAC,CAEW,MAA2B,EAAW,EAAuB,CAO7D,GAER,CAAE,WAAU,yBAAwB,cAAe,CACtD,GAAM,CAAC,EAAiB,GAAsB,EAE5C,mBAAoB,EAAuB,CAE7C,OACE,EAAC,EAAA,CACC,MAAO,CACL,WACA,kBACA,qBACD,CAEA,YACsB"}

package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/index.mjs

@@ -1,4 +1 @@
-import { VersionSwitcherProvider, useVersionSwitcher } from "./VersionSwitcherContext.mjs";
-import { VersionSwitcher } from "./VersionSwitcher.mjs";
-
-export { VersionSwitcher, VersionSwitcherProvider, useVersionSwitcher };
+import{VersionSwitcherProvider as e,useVersionSwitcher as t}from"./VersionSwitcherContext.mjs";import{VersionSwitcher as n}from"./VersionSwitcher.mjs";export{n as VersionSwitcher,e as VersionSwitcherProvider,t as useVersionSwitcher};