@intlayer/design-system 2.0.12 → 3.0.0

package/dist/components/DictionaryFieldEditor/getIsEditableSection.d.ts

@@ -0,0 +1,4 @@
+import { DictionaryValue } from '@intlayer/core';
+
+export declare const getIsEditableSection: (section: DictionaryValue) => boolean;
+//# sourceMappingURL=getIsEditableSection.d.ts.map

package/dist/components/DictionaryFieldEditor/getIsEditableSection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getIsEditableSection.d.ts","sourceRoot":"","sources":["../../../src/components/DictionaryFieldEditor/getIsEditableSection.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,eAAe,EAKrB,MAAM,gBAAgB,CAAC;AAoCxB,eAAO,MAAM,oBAAoB,YAAa,eAAe,YAK3B,CAAC"}

package/dist/components/DictionaryFieldEditor/getIsEditableSection.mjs

@@ -0,0 +1,38 @@
+import { NodeType } from "@intlayer/core";
+import { isValidElement } from "react";
+const getIsReactNodeContent = (section) => (
+  // Check if type of section is multilingual content
+  isValidElement(section)
+);
+const getIsStringTranslationContent = (section) => (
+  // Check if type of section is multilingual content
+  section?.nodeType === NodeType.Translation && // Check if the content is a string
+  typeof Object.values(
+    section[NodeType.Translation]
+  )[0] === "string"
+);
+const getIsStringEnumerationContent = (section) => (
+  // Check if type of section is enumeration content
+  section?.nodeType === NodeType.Enumeration && // Check if the enum has no content
+  (Object.values(section[NodeType.Enumeration]).length === 0 || // Check if the content is a string
+  typeof Object.values(
+    section[NodeType.Enumeration]
+  )[0] === "string")
+);
+const getIsStringArrayContent = (section) => (
+  // Check if the content is an array
+  Array.isArray(section) && // Check if the array has no content
+  (section.length === 0 || // Check if the content is a string
+  section.every(
+    (el) => typeof el === "string"
+  ))
+);
+const getIsEditableSection = (section) => typeof section === "string" || // String
+getIsReactNodeContent(section) || // ReactNode
+getIsStringTranslationContent(section) || // Translation
+getIsStringEnumerationContent(section) || // Translation
+getIsStringArrayContent(section);
+export {
+  getIsEditableSection
+};
+//# sourceMappingURL=getIsEditableSection.mjs.map

package/dist/components/DictionaryFieldEditor/getIsEditableSection.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"getIsEditableSection.mjs","sources":["../../../src/components/DictionaryFieldEditor/getIsEditableSection.ts"],"sourcesContent":["import {\n  type DictionaryValue,\n  type TranslationContent,\n  type EnumerationContent,\n  type RecursiveDictionaryValue,\n  NodeType,\n} from '@intlayer/core';\nimport { isValidElement } from 'react';\n\nconst getIsReactNodeContent = (section: DictionaryValue) =>\n  // Check if type of section is multilingual content\n  isValidElement(section);\n\nconst getIsStringTranslationContent = (section: DictionaryValue) =>\n  // Check if type of section is multilingual content\n  (section as TranslationContent<unknown>)?.nodeType === NodeType.Translation &&\n  // Check if the content is a string\n  typeof Object.values(\n    (section as TranslationContent<unknown>)[NodeType.Translation]\n  )[0] === 'string';\n\nconst getIsStringEnumerationContent = (section: DictionaryValue) =>\n  // Check if type of section is enumeration content\n  (section as EnumerationContent<unknown>)?.nodeType === NodeType.Enumeration &&\n  // Check if the enum has no content\n  (Object.values((section as EnumerationContent<unknown>)[NodeType.Enumeration])\n    .length === 0 ||\n    // Check if the content is a string\n    typeof Object.values(\n      (section as EnumerationContent<unknown>)[NodeType.Enumeration]\n    )[0] === 'string');\n\nconst getIsStringArrayContent = (section: DictionaryValue) =>\n  // Check if the content is an array\n  Array.isArray(section) &&\n  // Check if the array has no content\n  (section.length === 0 ||\n    // Check if the content is a string\n    (section as RecursiveDictionaryValue[]).every(\n      (el) => typeof el === 'string'\n    ));\n\nexport const getIsEditableSection = (section: DictionaryValue) =>\n  typeof section === 'string' || // String\n  getIsReactNodeContent(section) || // ReactNode\n  getIsStringTranslationContent(section) || // Translation\n  getIsStringEnumerationContent(section) || // Translation\n  getIsStringArrayContent(section); // Array\n"],"names":[],"mappings":";;AASA,MAAM,wBAAwB,CAAC;AAAA;AAAA,EAE7B,eAAe,OAAO;AAAA;AAExB,MAAM,gCAAgC,CAAC;AAAA;AAAA,EAEpC,SAAyC,aAAa,SAAS;AAAA,EAEhE,OAAO,OAAO;AAAA,IACX,QAAwC,SAAS,WAAW;AAAA,EAAA,EAC7D,CAAC,MAAM;AAAA;AAEX,MAAM,gCAAgC,CAAC;AAAA;AAAA,EAEpC,SAAyC,aAAa,SAAS;AAAA,GAE/D,OAAO,OAAQ,QAAwC,SAAS,WAAW,CAAC,EAC1E,WAAW;AAAA,EAEZ,OAAO,OAAO;AAAA,IACX,QAAwC,SAAS,WAAW;AAAA,EAAA,EAC7D,CAAC,MAAM;AAAA;AAEb,MAAM,0BAA0B,CAAC;AAAA;AAAA,EAE/B,MAAM,QAAQ,OAAO;AAAA,GAEpB,QAAQ,WAAW;AAAA,EAEjB,QAAuC;AAAA,IACtC,CAAC,OAAO,OAAO,OAAO;AAAA,EAAA;AAAA;AAGrB,MAAM,uBAAuB,CAAC,YACnC,OAAO,YAAY;AACnB,sBAAsB,OAAO;AAC7B,8BAA8B,OAAO;AACrC,8BAA8B,OAAO;AACrC,wBAAwB,OAAO;"}

package/dist/components/DictionaryFieldEditor/index.cjs

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const components_DictionaryFieldEditor_DictionariesSelector_DictionariesSelector = require("./DictionariesSelector/DictionariesSelector.cjs");
+const components_DictionaryFieldEditor_DictionaryCreationForm_DictionaryCreationForm = require("./DictionaryCreationForm/DictionaryCreationForm.cjs");
+const components_DictionaryFieldEditor_DictionaryFieldEditor = require("./DictionaryFieldEditor.cjs");
+exports.DictionariesSelector = components_DictionaryFieldEditor_DictionariesSelector_DictionariesSelector.DictionariesSelector;
+exports.DictionaryCreationForm = components_DictionaryFieldEditor_DictionaryCreationForm_DictionaryCreationForm.DictionaryCreationForm;
+exports.DictionaryFieldEditor = components_DictionaryFieldEditor_DictionaryFieldEditor.DictionaryFieldEditor;
+//# sourceMappingURL=index.cjs.map

package/dist/components/DictionaryFieldEditor/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/DictionaryFieldEditor/index.d.ts

@@ -0,0 +1,4 @@
+export * from './DictionariesSelector/DictionariesSelector';
+export * from './DictionaryCreationForm/DictionaryCreationForm';
+export * from './DictionaryFieldEditor';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/DictionaryFieldEditor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DictionaryFieldEditor/index.ts"],"names":[],"mappings":"AAAA,cAAc,6CAA6C,CAAC;AAC5D,cAAc,iDAAiD,CAAC;AAChE,cAAc,yBAAyB,CAAC"}

package/dist/components/DictionaryFieldEditor/index.mjs

@@ -0,0 +1,9 @@
+import { DictionariesSelector } from "./DictionariesSelector/DictionariesSelector.mjs";
+import { DictionaryCreationForm } from "./DictionaryCreationForm/DictionaryCreationForm.mjs";
+import { DictionaryFieldEditor } from "./DictionaryFieldEditor.mjs";
+export {
+  DictionariesSelector,
+  DictionaryCreationForm,
+  DictionaryFieldEditor
+};
+//# sourceMappingURL=index.mjs.map

package/dist/components/DictionaryFieldEditor/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/components/DictionaryFieldEditor/nodeTypeSelector.content.cjs

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const intlayer = require("intlayer");
+const nodeTypeSelectorContent = {
+  key: "node-type-selector",
+  content: {
+    triggerPlaceHolder: intlayer.t({
+      en: "Node type",
+      fr: "Type du Nœud",
+      es: "Typo del nodo"
+    }),
+    multilingualText: intlayer.t({
+      en: "Multilingual Text",
+      fr: "Texte multilingue",
+      es: "Texto multilingüe"
+    }),
+    text: intlayer.t({
+      en: "Text",
+      fr: "Texte",
+      es: "Texto"
+    }),
+    node: intlayer.t({
+      en: "Node",
+      fr: "Nœud",
+      es: "Nodo"
+    }),
+    array: intlayer.t({
+      en: "Array",
+      fr: "Tableau",
+      es: "Matriz"
+    }),
+    enumeration: intlayer.t({
+      en: "Enumeration",
+      fr: "Énumération",
+      es: "Enumeración"
+    })
+  }
+};
+exports.nodeTypeSelectorContent = nodeTypeSelectorContent;
+//# sourceMappingURL=nodeTypeSelector.content.cjs.map

package/dist/components/DictionaryFieldEditor/nodeTypeSelector.content.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"nodeTypeSelector.content.cjs","sources":["../../../src/components/DictionaryFieldEditor/nodeTypeSelector.content.ts"],"sourcesContent":["import { t, type DeclarationContent } from 'intlayer';\n\nexport const nodeTypeSelectorContent = {\n  key: 'node-type-selector',\n  content: {\n    triggerPlaceHolder: t({\n      en: 'Node type',\n      fr: 'Type du Nœud',\n      es: 'Typo del nodo',\n    }),\n    multilingualText: t({\n      en: 'Multilingual Text',\n      fr: 'Texte multilingue',\n      es: 'Texto multilingüe',\n    }),\n    text: t({\n      en: 'Text',\n      fr: 'Texte',\n      es: 'Texto',\n    }),\n    node: t({\n      en: 'Node',\n      fr: 'Nœud',\n      es: 'Nodo',\n    }),\n    array: t({\n      en: 'Array',\n      fr: 'Tableau',\n      es: 'Matriz',\n    }),\n    enumeration: t({\n      en: 'Enumeration',\n      fr: 'Énumération',\n      es: 'Enumeración',\n    }),\n  },\n} satisfies DeclarationContent;\n"],"names":["t"],"mappings":";;;AAEO,MAAM,0BAA0B;AAAA,EACrC,KAAK;AAAA,EACL,SAAS;AAAA,IACP,oBAAoBA,SAAAA,EAAE;AAAA,MACpB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,kBAAkBA,SAAAA,EAAE;AAAA,MAClB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,MAAMA,SAAAA,EAAE;AAAA,MACN,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,MAAMA,SAAAA,EAAE;AAAA,MACN,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,OAAOA,SAAAA,EAAE;AAAA,MACP,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,aAAaA,SAAAA,EAAE;AAAA,MACb,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,EACH;AACF;;"}

package/dist/components/DictionaryFieldEditor/nodeTypeSelector.content.d.ts

@@ -0,0 +1,12 @@
+export declare const nodeTypeSelectorContent: {
+    key: string;
+    content: {
+        triggerPlaceHolder: import('@intlayer/core').TranslationContent<string>;
+        multilingualText: import('@intlayer/core').TranslationContent<string>;
+        text: import('@intlayer/core').TranslationContent<string>;
+        node: import('@intlayer/core').TranslationContent<string>;
+        array: import('@intlayer/core').TranslationContent<string>;
+        enumeration: import('@intlayer/core').TranslationContent<string>;
+    };
+};
+//# sourceMappingURL=nodeTypeSelector.content.d.ts.map

package/dist/components/DictionaryFieldEditor/nodeTypeSelector.content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"nodeTypeSelector.content.d.ts","sourceRoot":"","sources":["../../../src/components/DictionaryFieldEditor/nodeTypeSelector.content.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,uBAAuB;;;;;;;;;;CAkCN,CAAC"}

package/dist/components/DictionaryFieldEditor/nodeTypeSelector.content.mjs

@@ -0,0 +1,40 @@
+import { t } from "intlayer";
+const nodeTypeSelectorContent = {
+  key: "node-type-selector",
+  content: {
+    triggerPlaceHolder: t({
+      en: "Node type",
+      fr: "Type du Nœud",
+      es: "Typo del nodo"
+    }),
+    multilingualText: t({
+      en: "Multilingual Text",
+      fr: "Texte multilingue",
+      es: "Texto multilingüe"
+    }),
+    text: t({
+      en: "Text",
+      fr: "Texte",
+      es: "Texto"
+    }),
+    node: t({
+      en: "Node",
+      fr: "Nœud",
+      es: "Nodo"
+    }),
+    array: t({
+      en: "Array",
+      fr: "Tableau",
+      es: "Matriz"
+    }),
+    enumeration: t({
+      en: "Enumeration",
+      fr: "Énumération",
+      es: "Enumeración"
+    })
+  }
+};
+export {
+  nodeTypeSelectorContent
+};
+//# sourceMappingURL=nodeTypeSelector.content.mjs.map

package/dist/components/DictionaryFieldEditor/nodeTypeSelector.content.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"nodeTypeSelector.content.mjs","sources":["../../../src/components/DictionaryFieldEditor/nodeTypeSelector.content.ts"],"sourcesContent":["import { t, type DeclarationContent } from 'intlayer';\n\nexport const nodeTypeSelectorContent = {\n  key: 'node-type-selector',\n  content: {\n    triggerPlaceHolder: t({\n      en: 'Node type',\n      fr: 'Type du Nœud',\n      es: 'Typo del nodo',\n    }),\n    multilingualText: t({\n      en: 'Multilingual Text',\n      fr: 'Texte multilingue',\n      es: 'Texto multilingüe',\n    }),\n    text: t({\n      en: 'Text',\n      fr: 'Texte',\n      es: 'Texto',\n    }),\n    node: t({\n      en: 'Node',\n      fr: 'Nœud',\n      es: 'Nodo',\n    }),\n    array: t({\n      en: 'Array',\n      fr: 'Tableau',\n      es: 'Matriz',\n    }),\n    enumeration: t({\n      en: 'Enumeration',\n      fr: 'Énumération',\n      es: 'Enumeración',\n    }),\n  },\n} satisfies DeclarationContent;\n"],"names":[],"mappings":";AAEO,MAAM,0BAA0B;AAAA,EACrC,KAAK;AAAA,EACL,SAAS;AAAA,IACP,oBAAoB,EAAE;AAAA,MACpB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,kBAAkB,EAAE;AAAA,MAClB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,MAAM,EAAE;AAAA,MACN,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,MAAM,EAAE;AAAA,MACN,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,OAAO,EAAE;AAAA,MACP,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,IACD,aAAa,EAAE;AAAA,MACb,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,CACL;AAAA,EACH;AACF;"}

package/dist/components/DropDown/index.cjs

@@ -0,0 +1,77 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("../../jsx-runtime-DvCoRj5u.cjs");
+const utils_cn = require("../../utils/cn.cjs");
+const components_MaxHeightSmoother_index = require("../MaxHeightSmoother/index.cjs");
+const DropDown = ({
+  children,
+  className,
+  identifier,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+  "div",
+  {
+    className: utils_cn.cn(`group/dropdown relative flex`, className),
+    "aria-label": `DropDown ${identifier}`,
+    id: `unrollable-panel-button-${identifier}`,
+    "aria-haspopup": true,
+    ...props,
+    children
+  }
+);
+const Trigger = ({
+  children,
+  identifier,
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+  "button",
+  {
+    className: utils_cn.cn("w-full cursor-pointer", className),
+    "aria-label": `Open panel ${identifier}`,
+    ...props,
+    children
+  }
+);
+const Panel = ({
+  children,
+  isHidden = void 0,
+  isOverable = false,
+  isFocusable = false,
+  align = "start",
+  identifier,
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+  "div",
+  {
+    className: utils_cn.cn(
+      "absolute top-[calc(100%+0.5rem)] z-[1000] min-w-full",
+      align === "start" && "left-0",
+      align === "end" && "right-0",
+      className
+    ),
+    "aria-hidden": isHidden,
+    role: "region",
+    "aria-labelledby": `unrollable-panel-button-${identifier}`,
+    id: `unrollable-panel-${identifier}`,
+    children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+      components_MaxHeightSmoother_index.MaxHeightSmoother,
+      {
+        isHidden,
+        className: utils_cn.cn(
+          "overflow-x-visible",
+          isHidden !== false ? "invisible" : "visible",
+          isOverable && "group-hover/dropdown:visible group-hover/dropdown:grid-rows-[1fr]",
+          isFocusable && "group-focus-within/dropdown:visible group-focus-within/dropdown:grid-rows-[1fr]"
+        ),
+        ...props,
+        children
+      }
+    )
+  }
+);
+DropDown.Trigger = Trigger;
+DropDown.Panel = Panel;
+exports.DropDown = DropDown;
+//# sourceMappingURL=index.cjs.map

package/dist/components/DropDown/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/components/DropDown/index.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport type { DropDownType, PanelProps, TriggerProps } from './types';\n\n/**\n * Trigger allowing to open a dropdown menu.\n *\n * Example:\n * ```jsx\n * <DropDown identifier=\"dropdown\">\n *   <DropDown.Trigger>\n *     Open dropdown\n *   </DropDown.Trigger>\n *\n *   <DropDown.Panel identifier=\"dropdown\">\n *     <div>Content</div>\n *   </DropDown.Panel>\n * </DropDown>\n * ```\n *\n * > Note DropDown.Trigger can be replaced by a button. Don't add a button inside the trigger.\n */\nexport const DropDown: DropDownType = ({\n  children,\n  className,\n  identifier,\n  ...props\n}) => (\n  <div\n    className={cn(`group/dropdown relative flex`, className)}\n    aria-label={`DropDown ${identifier}`}\n    id={`unrollable-panel-button-${identifier}`}\n    aria-haspopup\n    {...props}\n  >\n    {children}\n  </div>\n);\n\n/**\n * Trigger allowing to open a dropdown menu.\n *\n * Example:\n * ```jsx\n * <DropDown.Trigger identifier=\"dropdown\">\n *   <div>Open dropdown</div>\n * </DropDown.Trigger>\n * ```\n *\n * > Note DropDown.Trigger can be replaced by a button. Don't add a button inside the trigger.\n */\nconst Trigger: FC<TriggerProps> = ({\n  children,\n  identifier,\n  className,\n  ...props\n}) => (\n  <button\n    className={cn('w-full cursor-pointer', className)}\n    aria-label={`Open panel ${identifier}`}\n    {...props}\n  >\n    {children}\n  </button>\n);\n\n/**\n * Component that opens a dropdown menu when the trigger is clicked.\n *\n * Example:\n * ```jsx\n * <DropDown.Panel identifier=\"dropdown\">\n *   <div>Content</div>\n * </DropDown.Panel>\n * ```\n */\nconst Panel: FC<PanelProps> = ({\n  children,\n  isHidden = undefined,\n  isOverable = false,\n  isFocusable = false,\n  align = 'start',\n  identifier,\n  className,\n  ...props\n}) => (\n  <div\n    className={cn(\n      'absolute top-[calc(100%+0.5rem)] z-[1000] min-w-full',\n      align === 'start' && 'left-0',\n      align === 'end' && 'right-0',\n      className\n    )}\n    aria-hidden={isHidden}\n    role=\"region\"\n    aria-labelledby={`unrollable-panel-button-${identifier}`}\n    id={`unrollable-panel-${identifier}`}\n  >\n    <MaxHeightSmoother\n      isHidden={isHidden}\n      className={cn(\n        'overflow-x-visible',\n        isHidden !== false ? 'invisible' : 'visible',\n        isOverable &&\n          'group-hover/dropdown:visible group-hover/dropdown:grid-rows-[1fr]',\n        isFocusable &&\n          'group-focus-within/dropdown:visible group-focus-within/dropdown:grid-rows-[1fr]'\n      )}\n      {...props}\n    >\n      {children}\n    </MaxHeightSmoother>\n  </div>\n);\n\nDropDown.Trigger = Trigger;\nDropDown.Panel = Panel;\n"],"names":["jsx","cn","MaxHeightSmoother"],"mappings":";;;;;AAuBO,MAAM,WAAyB,CAAC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACEA,2BAAA,kBAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,SAAG,GAAA,gCAAgC,SAAS;AAAA,IACvD,cAAY,YAAY,UAAU;AAAA,IAClC,IAAI,2BAA2B,UAAU;AAAA,IACzC,iBAAa;AAAA,IACZ,GAAG;AAAA,IAEH;AAAA,EAAA;AACH;AAeF,MAAM,UAA4B,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACED,2BAAA,kBAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,SAAAA,GAAG,yBAAyB,SAAS;AAAA,IAChD,cAAY,cAAc,UAAU;AAAA,IACnC,GAAG;AAAA,IAEH;AAAA,EAAA;AACH;AAaF,MAAM,QAAwB,CAAC;AAAA,EAC7B;AAAA,EACA,WAAW;AAAA,EACX,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACED,2BAAA,kBAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,SAAA;AAAA,MACT;AAAA,MACA,UAAU,WAAW;AAAA,MACrB,UAAU,SAAS;AAAA,MACnB;AAAA,IACF;AAAA,IACA,eAAa;AAAA,IACb,MAAK;AAAA,IACL,mBAAiB,2BAA2B,UAAU;AAAA,IACtD,IAAI,oBAAoB,UAAU;AAAA,IAElC,UAAAD,2BAAA,kBAAA;AAAA,MAACE,mCAAA;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAWD,SAAA;AAAA,UACT;AAAA,UACA,aAAa,QAAQ,cAAc;AAAA,UACnC,cACE;AAAA,UACF,eACE;AAAA,QACJ;AAAA,QACC,GAAG;AAAA,QAEH;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AACF;AAGF,SAAS,UAAU;AACnB,SAAS,QAAQ;;"}

package/dist/components/DropDown/index.d.ts

@@ -1,3 +1,22 @@
-import { UnrollablePanelType } from './types';
+import { DropDownType } from './types';
 
-export declare const DropDown: UnrollablePanelType;
+/**
+ * Trigger allowing to open a dropdown menu.
+ *
+ * Example:
+ * ```jsx
+ * <DropDown identifier="dropdown">
+ *   <DropDown.Trigger>
+ *     Open dropdown
+ *   </DropDown.Trigger>
+ *
+ *   <DropDown.Panel identifier="dropdown">
+ *     <div>Content</div>
+ *   </DropDown.Panel>
+ * </DropDown>
+ * ```
+ *
+ * > Note DropDown.Trigger can be replaced by a button. Don't add a button inside the trigger.
+ */
+export declare const DropDown: DropDownType;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/DropDown/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DropDown/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAA4B,MAAM,SAAS,CAAC;AAEtE;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,QAAQ,EAAE,YAetB,CAAC"}

package/dist/components/DropDown/index.mjs

@@ -0,0 +1,77 @@
+import { j as jsxRuntimeExports } from "../../jsx-runtime-BgSF1HG2.js";
+import { cn } from "../../utils/cn.mjs";
+import { MaxHeightSmoother } from "../MaxHeightSmoother/index.mjs";
+const DropDown = ({
+  children,
+  className,
+  identifier,
+  ...props
+}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  "div",
+  {
+    className: cn(`group/dropdown relative flex`, className),
+    "aria-label": `DropDown ${identifier}`,
+    id: `unrollable-panel-button-${identifier}`,
+    "aria-haspopup": true,
+    ...props,
+    children
+  }
+);
+const Trigger = ({
+  children,
+  identifier,
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  "button",
+  {
+    className: cn("w-full cursor-pointer", className),
+    "aria-label": `Open panel ${identifier}`,
+    ...props,
+    children
+  }
+);
+const Panel = ({
+  children,
+  isHidden = void 0,
+  isOverable = false,
+  isFocusable = false,
+  align = "start",
+  identifier,
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  "div",
+  {
+    className: cn(
+      "absolute top-[calc(100%+0.5rem)] z-[1000] min-w-full",
+      align === "start" && "left-0",
+      align === "end" && "right-0",
+      className
+    ),
+    "aria-hidden": isHidden,
+    role: "region",
+    "aria-labelledby": `unrollable-panel-button-${identifier}`,
+    id: `unrollable-panel-${identifier}`,
+    children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      MaxHeightSmoother,
+      {
+        isHidden,
+        className: cn(
+          "overflow-x-visible",
+          isHidden !== false ? "invisible" : "visible",
+          isOverable && "group-hover/dropdown:visible group-hover/dropdown:grid-rows-[1fr]",
+          isFocusable && "group-focus-within/dropdown:visible group-focus-within/dropdown:grid-rows-[1fr]"
+        ),
+        ...props,
+        children
+      }
+    )
+  }
+);
+DropDown.Trigger = Trigger;
+DropDown.Panel = Panel;
+export {
+  DropDown
+};
+//# sourceMappingURL=index.mjs.map

package/dist/components/DropDown/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../src/components/DropDown/index.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport type { DropDownType, PanelProps, TriggerProps } from './types';\n\n/**\n * Trigger allowing to open a dropdown menu.\n *\n * Example:\n * ```jsx\n * <DropDown identifier=\"dropdown\">\n *   <DropDown.Trigger>\n *     Open dropdown\n *   </DropDown.Trigger>\n *\n *   <DropDown.Panel identifier=\"dropdown\">\n *     <div>Content</div>\n *   </DropDown.Panel>\n * </DropDown>\n * ```\n *\n * > Note DropDown.Trigger can be replaced by a button. Don't add a button inside the trigger.\n */\nexport const DropDown: DropDownType = ({\n  children,\n  className,\n  identifier,\n  ...props\n}) => (\n  <div\n    className={cn(`group/dropdown relative flex`, className)}\n    aria-label={`DropDown ${identifier}`}\n    id={`unrollable-panel-button-${identifier}`}\n    aria-haspopup\n    {...props}\n  >\n    {children}\n  </div>\n);\n\n/**\n * Trigger allowing to open a dropdown menu.\n *\n * Example:\n * ```jsx\n * <DropDown.Trigger identifier=\"dropdown\">\n *   <div>Open dropdown</div>\n * </DropDown.Trigger>\n * ```\n *\n * > Note DropDown.Trigger can be replaced by a button. Don't add a button inside the trigger.\n */\nconst Trigger: FC<TriggerProps> = ({\n  children,\n  identifier,\n  className,\n  ...props\n}) => (\n  <button\n    className={cn('w-full cursor-pointer', className)}\n    aria-label={`Open panel ${identifier}`}\n    {...props}\n  >\n    {children}\n  </button>\n);\n\n/**\n * Component that opens a dropdown menu when the trigger is clicked.\n *\n * Example:\n * ```jsx\n * <DropDown.Panel identifier=\"dropdown\">\n *   <div>Content</div>\n * </DropDown.Panel>\n * ```\n */\nconst Panel: FC<PanelProps> = ({\n  children,\n  isHidden = undefined,\n  isOverable = false,\n  isFocusable = false,\n  align = 'start',\n  identifier,\n  className,\n  ...props\n}) => (\n  <div\n    className={cn(\n      'absolute top-[calc(100%+0.5rem)] z-[1000] min-w-full',\n      align === 'start' && 'left-0',\n      align === 'end' && 'right-0',\n      className\n    )}\n    aria-hidden={isHidden}\n    role=\"region\"\n    aria-labelledby={`unrollable-panel-button-${identifier}`}\n    id={`unrollable-panel-${identifier}`}\n  >\n    <MaxHeightSmoother\n      isHidden={isHidden}\n      className={cn(\n        'overflow-x-visible',\n        isHidden !== false ? 'invisible' : 'visible',\n        isOverable &&\n          'group-hover/dropdown:visible group-hover/dropdown:grid-rows-[1fr]',\n        isFocusable &&\n          'group-focus-within/dropdown:visible group-focus-within/dropdown:grid-rows-[1fr]'\n      )}\n      {...props}\n    >\n      {children}\n    </MaxHeightSmoother>\n  </div>\n);\n\nDropDown.Trigger = Trigger;\nDropDown.Panel = Panel;\n"],"names":["jsx"],"mappings":";;;AAuBO,MAAM,WAAyB,CAAC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACEA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAW,GAAG,gCAAgC,SAAS;AAAA,IACvD,cAAY,YAAY,UAAU;AAAA,IAClC,IAAI,2BAA2B,UAAU;AAAA,IACzC,iBAAa;AAAA,IACZ,GAAG;AAAA,IAEH;AAAA,EAAA;AACH;AAeF,MAAM,UAA4B,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACEA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAW,GAAG,yBAAyB,SAAS;AAAA,IAChD,cAAY,cAAc,UAAU;AAAA,IACnC,GAAG;AAAA,IAEH;AAAA,EAAA;AACH;AAaF,MAAM,QAAwB,CAAC;AAAA,EAC7B;AAAA,EACA,WAAW;AAAA,EACX,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACEA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA,UAAU,WAAW;AAAA,MACrB,UAAU,SAAS;AAAA,MACnB;AAAA,IACF;AAAA,IACA,eAAa;AAAA,IACb,MAAK;AAAA,IACL,mBAAiB,2BAA2B,UAAU;AAAA,IACtD,IAAI,oBAAoB,UAAU;AAAA,IAElC,UAAAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA,aAAa,QAAQ,cAAc;AAAA,UACnC,cACE;AAAA,UACF,eACE;AAAA,QACJ;AAAA,QACC,GAAG;AAAA,QAEH;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AACF;AAGF,SAAS,UAAU;AACnB,SAAS,QAAQ;"}

package/dist/components/DropDown/types.cjs

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=types.cjs.map

package/dist/components/DropDown/types.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/DropDown/types.d.ts

@@ -1,15 +1,20 @@
 import { HTMLAttributes, FC } from 'react';
 
-export type UnrollablePanelTriggerProps = HTMLAttributes<HTMLButtonElement> & {
+export type DropDownProps = HTMLAttributes<HTMLDivElement> & {
     identifier: string;
 };
-type UnrollablePanelProps = HTMLAttributes<HTMLDivElement> & {
+export type DropDownType = FC<DropDownProps> & {
+    Trigger: FC<TriggerProps>;
+    Panel: FC<PanelProps>;
+};
+export type TriggerProps = HTMLAttributes<HTMLButtonElement> & {
+    identifier: string;
+};
+export type PanelProps = HTMLAttributes<HTMLDivElement> & {
     isFocusable?: boolean;
     isHidden?: boolean;
     isOverable?: boolean;
     identifier: string;
+    align?: 'start' | 'end';
 };
-export type UnrollablePanelType = FC<UnrollablePanelProps> & {
-    Trigger: FC<UnrollablePanelTriggerProps>;
-};
-export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/DropDown/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/DropDown/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhD,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAC3D,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,EAAE,CAAC,aAAa,CAAC,GAAG;IAC7C,OAAO,EAAE,EAAE,CAAC,YAAY,CAAC,CAAC;IAC1B,KAAK,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IAC7D,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IACxD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;CACzB,CAAC"}

package/dist/components/DropDown/types.mjs

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=types.mjs.map

package/dist/components/DropDown/types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/EditableField/EditableFieldInput.cjs

@@ -0,0 +1,28 @@
+"use client";
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("../../jsx-runtime-DvCoRj5u.cjs");
+const require$$0 = require("react");
+const components_Input_Input = require("../Input/Input.cjs");
+require("../Input/InputPassword.cjs");
+const components_EditableField_EditableFieldLayout = require("./EditableFieldLayout.cjs");
+const EditableFieldInput = (props) => {
+  const inputRef = require$$0.useRef(null);
+  const handleCancel = () => {
+    if (inputRef.current) {
+      inputRef.current.value = inputRef.current.defaultValue ?? "";
+    }
+    props.onCancel?.(inputRef.current?.value ?? "");
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+    components_EditableField_EditableFieldLayout.EditableFieldLayout,
+    {
+      value: inputRef.current?.value ?? inputRef.current?.defaultValue ?? props.value ?? props.defaultValue,
+      onCancel: handleCancel,
+      onSave: () => props.onSave?.(inputRef.current?.value ?? ""),
+      children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(components_Input_Input.Input, { ref: inputRef, ...props })
+    }
+  );
+};
+exports.EditableFieldInput = EditableFieldInput;
+//# sourceMappingURL=EditableFieldInput.cjs.map

package/dist/components/EditableField/EditableFieldInput.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableFieldInput.cjs","sources":["../../../src/components/EditableField/EditableFieldInput.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, useRef } from 'react';\nimport { Input, type InputProps } from '../Input';\nimport { EditableFieldLayout } from './EditableFieldLayout';\n\ntype EditableFieldInputProps = InputProps & {\n  onSave?: (value: string) => void;\n  onCancel?: (value: string) => void;\n};\n\nexport const EditableFieldInput: FC<EditableFieldInputProps> = (props) => {\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const handleCancel = () => {\n    if (inputRef.current) {\n      inputRef.current.value = inputRef.current.defaultValue ?? '';\n    }\n\n    props.onCancel?.(inputRef.current?.value ?? '');\n  };\n\n  return (\n    <EditableFieldLayout\n      value={\n        inputRef.current?.value ??\n        inputRef.current?.defaultValue ??\n        (props.value as string) ??\n        props.defaultValue\n      }\n      onCancel={handleCancel}\n      onSave={() => props.onSave?.(inputRef.current?.value ?? '')}\n    >\n      <Input ref={inputRef} {...props} />\n    </EditableFieldLayout>\n  );\n};\n"],"names":["useRef","jsx","EditableFieldLayout","Input"],"mappings":";;;;;;;;AAWa,MAAA,qBAAkD,CAAC,UAAU;AAClE,QAAA,WAAWA,kBAAyB,IAAI;AAE9C,QAAM,eAAe,MAAM;AACzB,QAAI,SAAS,SAAS;AACpB,eAAS,QAAQ,QAAQ,SAAS,QAAQ,gBAAgB;AAAA,IAC5D;AAEA,UAAM,WAAW,SAAS,SAAS,SAAS,EAAE;AAAA,EAAA;AAI9C,SAAAC,2BAAA,kBAAA;AAAA,IAACC,6CAAA;AAAA,IAAA;AAAA,MACC,OACE,SAAS,SAAS,SAClB,SAAS,SAAS,gBACjB,MAAM,SACP,MAAM;AAAA,MAER,UAAU;AAAA,MACV,QAAQ,MAAM,MAAM,SAAS,SAAS,SAAS,SAAS,EAAE;AAAA,MAE1D,UAACD,2BAAA,kBAAA,IAAAE,8BAAA,EAAM,KAAK,UAAW,GAAG,OAAO;AAAA,IAAA;AAAA,EAAA;AAGvC;;"}

package/dist/components/EditableField/EditableFieldInput.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+import { InputProps } from '../Input';
+
+type EditableFieldInputProps = InputProps & {
+    onSave?: (value: string) => void;
+    onCancel?: (value: string) => void;
+};
+export declare const EditableFieldInput: FC<EditableFieldInputProps>;
+export {};
+//# sourceMappingURL=EditableFieldInput.d.ts.map

package/dist/components/EditableField/EditableFieldInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableFieldInput.d.ts","sourceRoot":"","sources":["../../../src/components/EditableField/EditableFieldInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,EAAU,MAAM,OAAO,CAAC;AACxC,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAGlD,KAAK,uBAAuB,GAAG,UAAU,GAAG;IAC1C,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAyB1D,CAAC"}

package/dist/components/EditableField/EditableFieldInput.mjs

@@ -0,0 +1,28 @@
+"use client";
+import { j as jsxRuntimeExports } from "../../jsx-runtime-BgSF1HG2.js";
+import { useRef } from "react";
+import { Input } from "../Input/Input.mjs";
+import "../Input/InputPassword.mjs";
+import { EditableFieldLayout } from "./EditableFieldLayout.mjs";
+const EditableFieldInput = (props) => {
+  const inputRef = useRef(null);
+  const handleCancel = () => {
+    if (inputRef.current) {
+      inputRef.current.value = inputRef.current.defaultValue ?? "";
+    }
+    props.onCancel?.(inputRef.current?.value ?? "");
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    EditableFieldLayout,
+    {
+      value: inputRef.current?.value ?? inputRef.current?.defaultValue ?? props.value ?? props.defaultValue,
+      onCancel: handleCancel,
+      onSave: () => props.onSave?.(inputRef.current?.value ?? ""),
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Input, { ref: inputRef, ...props })
+    }
+  );
+};
+export {
+  EditableFieldInput
+};
+//# sourceMappingURL=EditableFieldInput.mjs.map

package/dist/components/EditableField/EditableFieldInput.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableFieldInput.mjs","sources":["../../../src/components/EditableField/EditableFieldInput.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, useRef } from 'react';\nimport { Input, type InputProps } from '../Input';\nimport { EditableFieldLayout } from './EditableFieldLayout';\n\ntype EditableFieldInputProps = InputProps & {\n  onSave?: (value: string) => void;\n  onCancel?: (value: string) => void;\n};\n\nexport const EditableFieldInput: FC<EditableFieldInputProps> = (props) => {\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const handleCancel = () => {\n    if (inputRef.current) {\n      inputRef.current.value = inputRef.current.defaultValue ?? '';\n    }\n\n    props.onCancel?.(inputRef.current?.value ?? '');\n  };\n\n  return (\n    <EditableFieldLayout\n      value={\n        inputRef.current?.value ??\n        inputRef.current?.defaultValue ??\n        (props.value as string) ??\n        props.defaultValue\n      }\n      onCancel={handleCancel}\n      onSave={() => props.onSave?.(inputRef.current?.value ?? '')}\n    >\n      <Input ref={inputRef} {...props} />\n    </EditableFieldLayout>\n  );\n};\n"],"names":["jsx"],"mappings":";;;;;;AAWa,MAAA,qBAAkD,CAAC,UAAU;AAClE,QAAA,WAAW,OAAyB,IAAI;AAE9C,QAAM,eAAe,MAAM;AACzB,QAAI,SAAS,SAAS;AACpB,eAAS,QAAQ,QAAQ,SAAS,QAAQ,gBAAgB;AAAA,IAC5D;AAEA,UAAM,WAAW,SAAS,SAAS,SAAS,EAAE;AAAA,EAAA;AAI9C,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OACE,SAAS,SAAS,SAClB,SAAS,SAAS,gBACjB,MAAM,SACP,MAAM;AAAA,MAER,UAAU;AAAA,MACV,QAAQ,MAAM,MAAM,SAAS,SAAS,SAAS,SAAS,EAAE;AAAA,MAE1D,UAACA,kCAAA,IAAA,OAAA,EAAM,KAAK,UAAW,GAAG,OAAO;AAAA,IAAA;AAAA,EAAA;AAGvC;"}