@pareto-engineering/design-system 5.12.10 → 5.12.12

package/dist/stories/f/HighlightedTextInput.stories.js

@@ -0,0 +1,166 @@
+import { jsxs as c, jsx as a } from "react/jsx-runtime";
+import { Formik as h, Form as g } from "formik";
+import "../../ui/a/AppContext/Context.js";
+import "../../ui/a/AppContext/ContextProvider.js";
+import "react";
+import "../../ui/a/BlurOverlay/BlurOverlay.js";
+import { H as m, D as b } from "../../FormBuilder-U45jur81.js";
+import "../../ui/a/Conversation/Context.js";
+import "../../ui/a/DotInfo/DotInfo.js";
+import "../../ui/a/Figure/Figure.js";
+import "../../ui/a/HamburgerButton/HamburgerButton.js";
+import "../../ui/a/IconList/IconList.js";
+import "../../ui/a/Label/Label.js";
+import "../../ui/a/LoadingCircle/LoadingCircle.js";
+import "../../ui/a/People/People.js";
+import "../../ui/a/Popover/Popover.js";
+import "../../ui/a/ProgressBar/ProgressBar.js";
+import "../../ui/a/Quote/Quote.js";
+import "../../ui/a/SVG/SVG.js";
+import "../../ui/a/SnapScroller/SnapScroller.js";
+import "../../ui/a/Spinner/Spinner.js";
+import "../../ui/a/Timestamp/Timestamp.js";
+import "../../ui/a/MetaCard/MetaCard.js";
+import "../../ui/a/AnimatedBlobs/AnimatedBlobs.js";
+import "../../ui/a/Tip/Tip.js";
+import "../../ui/a/TextSteps/TextSteps.js";
+import "../../ui/a/Removable/Removable.js";
+import "../../ui/a/ToggleSwitch/ToggleSwitch.js";
+import "../../ui/a/XMLEditor/XMLEditor.js";
+import "../../DatePicker-DHuh_8q6.js";
+import "../../ui/a/Tooltip/Tooltip.js";
+import "../../ui/a/Charts/AreaChart/AreaChart.js";
+import "../../ui/a/Charts/BarChart/BarChart.js";
+import "../../ui/a/Charts/PieChart/PieChart.js";
+import "../../ui/a/ThroughPutIndicator/ThroughPutIndicator.js";
+import "../../ui/b/Page/Context.js";
+import "../../ui/b/Title/Title.js";
+import "../../ui/c/SocialMediaShareButton/SocialMediaShareButton.js";
+import "../../ui/f/common/Label/Label.js";
+import "../../ui/f/common/Description/Description.js";
+import "../../ui/f/common/Hint/Hint.js";
+import '../../assets/styles.css';/* empty css                    */
+import "../../ui/f/fields/QueryCombobox/common/Menu/Menu.js";
+import "../../debounce-Cm69Z_cF.js";
+import "../../ui/f/fields/LatexPreviewInput/convertLatexToHtml.js";
+import "../../ui/f/fields/RadioInput/RadioInput.js";
+import "../../ui/g/DragAndDrop/DragAndDrop.js";
+import "../../throttle-BCrS-Wew.js";
+import "../../ui/utils/formatting.js";
+const ut = {
+  title: "f/fields/HighlightedTextInput",
+  component: m,
+  subcomponents: {
+    // Item:HighlightedTextInput.Item
+  },
+  decorators: [
+    (t) => /* @__PURE__ */ a(
+      h,
+      {
+        initialValues: {
+          template: "Hello {{data.name}}, your order {{data.orderId}} is ready!",
+          emptyField: "",
+          invalidTest: "Check {{invalid.var}} syntax"
+        },
+        onSubmit: () => {
+        },
+        children: /* @__PURE__ */ a(g, { children: t() })
+      }
+    )
+  ],
+  argTypes: {
+    placeholder: { control: "text" },
+    disabled: { control: "boolean" },
+    name: { control: "text" },
+    label: { control: "text" },
+    labelColor: { control: "text" },
+    optional: { control: "boolean" },
+    description: { control: "text" }
+  }
+}, n = (t) => {
+  if (!t) return [];
+  const o = [], p = /\{\{([^}]+)\}\}/g;
+  let e = 0, i = p.exec(t);
+  for (; i !== null; ) {
+    i.index > e && o.push({
+      text: t.slice(e, i.index),
+      type: "text",
+      startAt: e
+    });
+    const s = i[1].trim(), d = s.startsWith("data.") || s.startsWith("attachments");
+    o.push({
+      text: i[0],
+      type: d ? "valid" : "invalid",
+      startAt: i.index
+    }), e = p.lastIndex, i = p.exec(t);
+  }
+  return e < t.length && o.push({
+    text: t.slice(e),
+    type: "text",
+    startAt: e
+  }), o;
+}, r = (t) => /* @__PURE__ */ c(
+  "div",
+  {
+    style: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "1rem",
+      maxWidth: "500px"
+    },
+    children: [
+      /* @__PURE__ */ a(m, { ...t }),
+      /* @__PURE__ */ a(b, {})
+    ]
+  }
+), l = r.bind({});
+l.args = {
+  name: "template",
+  label: "Template with variables",
+  parseSegments: n
+};
+const x = r.bind({});
+x.args = {
+  ...l.args,
+  description: "Use {{data.fieldName}} to reference task data fields"
+};
+const u = r.bind({});
+u.args = {
+  name: "emptyField",
+  label: "Enter a template",
+  placeholder: "Type something like {{data.name}}...",
+  parseSegments: n
+};
+const f = r.bind({});
+f.args = {
+  name: "invalidTest",
+  label: "Template with invalid variable",
+  description: "Invalid variables are highlighted differently",
+  parseSegments: n
+};
+const v = r.bind({});
+v.args = {
+  ...l.args,
+  disabled: !0
+};
+const y = r.bind({});
+y.args = {
+  ...l.args,
+  optional: !0
+};
+const T = r.bind({});
+T.args = {
+  name: "template",
+  label: "Plain text input (no parseSegments)",
+  description: "Without parseSegments, it behaves like a normal text input"
+};
+export {
+  l as Base,
+  v as Disabled,
+  y as Optional,
+  x as WithDescription,
+  f as WithInvalidVariables,
+  u as WithPlaceholder,
+  T as WithoutHighlighting,
+  ut as default
+};

package/dist/stories/f/Label.stories.js

@@ -3,7 +3,7 @@ import "react";
 import "../../ui/a/AppContext/Context.js";
 import "../../ui/a/AppContext/ContextProvider.js";
 import "../../ui/a/BlurOverlay/BlurOverlay.js";
-import "../../FormBuilder-BgjYyPAc.js";
+import "../../FormBuilder-U45jur81.js";
 import "../../ui/a/Conversation/Context.js";
 import "../../ui/a/DotInfo/DotInfo.js";
 import "../../ui/a/Figure/Figure.js";
@@ -37,8 +37,9 @@ import "../../ui/b/Title/Title.js";
 import "../../ui/c/SocialMediaShareButton/SocialMediaShareButton.js";
 import o from "../../ui/f/common/Label/Label.js";
 import "../../ui/f/common/Description/Description.js";
+import "../../ui/f/common/Hint/Hint.js";
 import "formik";
-import "../../ui/f/common/CharacterCount/CharacterCount.js";
+import '../../assets/styles.css';/* empty css                    */
 import "../../ui/f/fields/QueryCombobox/common/Menu/Menu.js";
 import "../../debounce-Cm69Z_cF.js";
 import "../../ui/f/fields/LatexPreviewInput/convertLatexToHtml.js";
@@ -46,7 +47,7 @@ import "../../ui/f/fields/RadioInput/RadioInput.js";
 import "../../ui/g/DragAndDrop/DragAndDrop.js";
 import "../../throttle-BCrS-Wew.js";
 import "../../ui/utils/formatting.js";
-const $ = {
+const oo = {
   title: "f/common/Label",
   component: o,
   subcomponents: {
@@ -58,12 +59,12 @@ const $ = {
   argTypes: {
     backgroundColor: { control: "color" }
   }
-}, t = (r) => /* @__PURE__ */ m(o, { ...r, children: "Sample Label" }), oo = t.bind(), p = t.bind({});
+}, t = (r) => /* @__PURE__ */ m(o, { ...r, children: "Sample Label" }), to = t.bind(), p = t.bind({});
 p.args = {
   optional: !0
 };
 export {
-  oo as Base,
+  to as Base,
   p as Optional,
-  $ as default
+  oo as default
 };

package/dist/stories/f/LinkInput.stories.js

@@ -4,7 +4,7 @@ import { Formik as l, Form as a } from "formik";
 import "../../ui/a/AppContext/Context.js";
 import "../../ui/a/AppContext/ContextProvider.js";
 import "../../ui/a/BlurOverlay/BlurOverlay.js";
-import { j as p, D as n } from "../../FormBuilder-BgjYyPAc.js";
+import { j as p, D as n } from "../../FormBuilder-U45jur81.js";
 import "../../ui/a/Conversation/Context.js";
 import "../../ui/a/DotInfo/DotInfo.js";
 import "../../ui/a/Figure/Figure.js";
@@ -38,7 +38,8 @@ import "../../ui/b/Title/Title.js";
 import "../../ui/c/SocialMediaShareButton/SocialMediaShareButton.js";
 import "../../ui/f/common/Label/Label.js";
 import "../../ui/f/common/Description/Description.js";
-import "../../ui/f/common/CharacterCount/CharacterCount.js";
+import "../../ui/f/common/Hint/Hint.js";
+import '../../assets/styles.css';/* empty css                    */
 import "../../ui/f/fields/QueryCombobox/common/Menu/Menu.js";
 import "../../debounce-Cm69Z_cF.js";
 import "../../ui/f/fields/LatexPreviewInput/convertLatexToHtml.js";
@@ -46,7 +47,7 @@ import "../../ui/f/fields/RadioInput/RadioInput.js";
 import "../../ui/g/DragAndDrop/DragAndDrop.js";
 import "../../throttle-BCrS-Wew.js";
 import "../../ui/utils/formatting.js";
-const so = {
+const co = {
   title: "f/fields/LinkInput",
   component: p,
   subcomponents: {
@@ -119,5 +120,5 @@ export {
   g as WithDisabled,
   b as WithPlaceholder,
   d as WithValidation,
-  so as default
+  co as default
 };

package/dist/stories/f/RadioInput.stories.js

@@ -4,7 +4,7 @@ import { Formik as t, Form as i } from "formik";
 import "../../ui/a/AppContext/Context.js";
 import "../../ui/a/AppContext/ContextProvider.js";
 import "../../ui/a/BlurOverlay/BlurOverlay.js";
-import "../../FormBuilder-BgjYyPAc.js";
+import "../../FormBuilder-U45jur81.js";
 import "../../ui/a/Conversation/Context.js";
 import "../../ui/a/DotInfo/DotInfo.js";
 import "../../ui/a/Figure/Figure.js";
@@ -38,7 +38,8 @@ import "../../ui/b/Title/Title.js";
 import "../../ui/c/SocialMediaShareButton/SocialMediaShareButton.js";
 import "../../ui/f/common/Label/Label.js";
 import "../../ui/f/common/Description/Description.js";
-import "../../ui/f/common/CharacterCount/CharacterCount.js";
+import "../../ui/f/common/Hint/Hint.js";
+import '../../assets/styles.css';/* empty css                    */
 import "../../ui/f/fields/QueryCombobox/common/Menu/Menu.js";
 import "../../debounce-Cm69Z_cF.js";
 import "../../ui/f/fields/LatexPreviewInput/convertLatexToHtml.js";
@@ -46,7 +47,7 @@ import p from "../../ui/f/fields/RadioInput/RadioInput.js";
 import "../../ui/g/DragAndDrop/DragAndDrop.js";
 import "../../throttle-BCrS-Wew.js";
 import "../../ui/utils/formatting.js";
-const $ = {
+const oo = {
   title: "f/fields/RadioInput",
   component: p,
   subcomponents: {
@@ -64,13 +65,13 @@ const $ = {
   argTypes: {
     backgroundColor: { control: "color" }
   }
-}, oo = {
+}, ro = {
   args: {
     label: "Radio Input",
     name: "option"
   }
 };
 export {
-  oo as Base,
-  $ as default
+  ro as Base,
+  oo as default
 };

package/dist/stories/f/RatingsInput.stories.js

@@ -4,7 +4,7 @@ import { Formik as a, Form as e } from "formik";
 import "../../ui/a/AppContext/Context.js";
 import "../../ui/a/AppContext/ContextProvider.js";
 import "../../ui/a/BlurOverlay/BlurOverlay.js";
-import { R as p, D as l } from "../../FormBuilder-BgjYyPAc.js";
+import { R as p, D as l } from "../../FormBuilder-U45jur81.js";
 import "../../ui/a/Conversation/Context.js";
 import "../../ui/a/DotInfo/DotInfo.js";
 import "../../ui/a/Figure/Figure.js";
@@ -38,7 +38,8 @@ import "../../ui/b/Title/Title.js";
 import "../../ui/c/SocialMediaShareButton/SocialMediaShareButton.js";
 import "../../ui/f/common/Label/Label.js";
 import "../../ui/f/common/Description/Description.js";
-import "../../ui/f/common/CharacterCount/CharacterCount.js";
+import "../../ui/f/common/Hint/Hint.js";
+import '../../assets/styles.css';/* empty css                    */
 import "../../ui/f/fields/QueryCombobox/common/Menu/Menu.js";
 import "../../debounce-Cm69Z_cF.js";
 import "../../ui/f/fields/LatexPreviewInput/convertLatexToHtml.js";
@@ -46,7 +47,7 @@ import "../../ui/f/fields/RadioInput/RadioInput.js";
 import "../../ui/g/DragAndDrop/DragAndDrop.js";
 import "../../throttle-BCrS-Wew.js";
 import "../../ui/utils/formatting.js";
-const nt = {
+const at = {
   title: "f/fields/RatingsInput",
   component: p,
   subcomponents: {
@@ -114,5 +115,5 @@ export {
   c as Labels,
   m as Numbers,
   s as Optional,
-  nt as default
+  at as default
 };

package/dist/stories/f/SelectInput.stories.js

@@ -4,7 +4,7 @@ import { Formik as n, Form as s } from "formik";
 import "../../ui/a/AppContext/Context.js";
 import "../../ui/a/AppContext/ContextProvider.js";
 import "../../ui/a/BlurOverlay/BlurOverlay.js";
-import { f as p, D as m } from "../../FormBuilder-BgjYyPAc.js";
+import { f as l, D as m } from "../../FormBuilder-U45jur81.js";
 import "../../ui/a/Conversation/Context.js";
 import "../../ui/a/DotInfo/DotInfo.js";
 import "../../ui/a/Figure/Figure.js";
@@ -38,7 +38,8 @@ import "../../ui/b/Title/Title.js";
 import "../../ui/c/SocialMediaShareButton/SocialMediaShareButton.js";
 import "../../ui/f/common/Label/Label.js";
 import "../../ui/f/common/Description/Description.js";
-import "../../ui/f/common/CharacterCount/CharacterCount.js";
+import "../../ui/f/common/Hint/Hint.js";
+import '../../assets/styles.css';/* empty css                    */
 import "../../ui/f/fields/QueryCombobox/common/Menu/Menu.js";
 import "../../debounce-Cm69Z_cF.js";
 import "../../ui/f/fields/LatexPreviewInput/convertLatexToHtml.js";
@@ -46,9 +47,9 @@ import "../../ui/f/fields/RadioInput/RadioInput.js";
 import "../../ui/g/DragAndDrop/DragAndDrop.js";
 import "../../throttle-BCrS-Wew.js";
 import "../../ui/utils/formatting.js";
-const bo = {
+const uo = {
   title: "f/fields/SelectInput",
-  component: p,
+  component: l,
   subcomponents: {
     // Item:SelectInput.Item
   },
@@ -77,7 +78,7 @@ const bo = {
       gap: "1rem"
     },
     children: [
-      /* @__PURE__ */ i(p, { ...o }),
+      /* @__PURE__ */ i(l, { ...o }),
       /* @__PURE__ */ i(m, {})
     ]
   }
@@ -135,16 +136,16 @@ f.args = {
   placeholder: "Type to search",
   multiple: !0
 };
-const l = {
+const p = {
   args: {
     ...t.args,
     hasDefault: !0,
     options: [...t.args.options.map((o, r) => r === 2 ? { ...o, isDefault: !0 } : o)]
   }
-}, uo = {
-  ...l,
+}, go = {
+  ...p,
   args: {
-    ...l.args,
+    ...p.args,
     testOverride: !0
   }
 };
@@ -156,7 +157,7 @@ export {
   c as Optional,
   u as Required,
   d as StringAndObjects,
-  l as WithDefault,
-  uo as WithDefaultNoOverride,
-  bo as default
+  p as WithDefault,
+  go as WithDefaultNoOverride,
+  uo as default
 };

package/dist/stories/f/TextInput.stories.js

@@ -4,7 +4,7 @@ import { Formik as n, Form as s } from "formik";
 import "../../ui/a/AppContext/Context.js";
 import "../../ui/a/AppContext/ContextProvider.js";
 import "../../ui/a/BlurOverlay/BlurOverlay.js";
-import { e as a, D as c } from "../../FormBuilder-BgjYyPAc.js";
+import { e as a, D as c } from "../../FormBuilder-U45jur81.js";
 import "../../ui/a/Conversation/Context.js";
 import "../../ui/a/DotInfo/DotInfo.js";
 import "../../ui/a/Figure/Figure.js";
@@ -38,7 +38,8 @@ import "../../ui/b/Title/Title.js";
 import "../../ui/c/SocialMediaShareButton/SocialMediaShareButton.js";
 import "../../ui/f/common/Label/Label.js";
 import "../../ui/f/common/Description/Description.js";
-import "../../ui/f/common/CharacterCount/CharacterCount.js";
+import "../../ui/f/common/Hint/Hint.js";
+import '../../assets/styles.css';/* empty css                    */
 import "../../ui/f/fields/QueryCombobox/common/Menu/Menu.js";
 import "../../debounce-Cm69Z_cF.js";
 import "../../ui/f/fields/LatexPreviewInput/convertLatexToHtml.js";
@@ -46,7 +47,7 @@ import "../../ui/f/fields/RadioInput/RadioInput.js";
 import "../../ui/g/DragAndDrop/DragAndDrop.js";
 import "../../throttle-BCrS-Wew.js";
 import "../../ui/utils/formatting.js";
-const ut = {
+const ft = {
   title: "f/fields/TextInput",
   component: a,
   subcomponents: {
@@ -159,5 +160,5 @@ export {
   b as WithPlaceholder,
   C as WithShouldShowCharacterCountFalse,
   g as WithValidation,
-  ut as default
+  ft as default
 };

package/dist/stories/f/TextareaInput.stories.js

@@ -1,10 +1,10 @@
 import { jsxs as n, jsx as i } from "react/jsx-runtime";
 import "react";
-import { Formik as p, Form as l } from "formik";
+import { Formik as p, Form as m } from "formik";
 import "../../ui/a/AppContext/Context.js";
 import "../../ui/a/AppContext/ContextProvider.js";
 import "../../ui/a/BlurOverlay/BlurOverlay.js";
-import { h as a, D as m } from "../../FormBuilder-BgjYyPAc.js";
+import { h as a, D as l } from "../../FormBuilder-U45jur81.js";
 import "../../ui/a/Conversation/Context.js";
 import "../../ui/a/DotInfo/DotInfo.js";
 import "../../ui/a/Figure/Figure.js";
@@ -38,7 +38,8 @@ import "../../ui/b/Title/Title.js";
 import "../../ui/c/SocialMediaShareButton/SocialMediaShareButton.js";
 import "../../ui/f/common/Label/Label.js";
 import "../../ui/f/common/Description/Description.js";
-import "../../ui/f/common/CharacterCount/CharacterCount.js";
+import "../../ui/f/common/Hint/Hint.js";
+import '../../assets/styles.css';/* empty css                    */
 import "../../ui/f/fields/QueryCombobox/common/Menu/Menu.js";
 import "../../debounce-Cm69Z_cF.js";
 import "../../ui/f/fields/LatexPreviewInput/convertLatexToHtml.js";
@@ -46,7 +47,7 @@ import "../../ui/f/fields/RadioInput/RadioInput.js";
 import "../../ui/g/DragAndDrop/DragAndDrop.js";
 import "../../throttle-BCrS-Wew.js";
 import "../../ui/utils/formatting.js";
-const uo = {
+const xo = {
   title: "f/fields/TextareaInput",
   component: a,
   subcomponents: {
@@ -57,7 +58,7 @@ const uo = {
       p,
       {
         initialValues: { feedback: "" },
-        children: /* @__PURE__ */ i(l, { children: t() })
+        children: /* @__PURE__ */ i(m, { children: t() })
       }
     )
   ],
@@ -81,7 +82,7 @@ const uo = {
     },
     children: [
       /* @__PURE__ */ i(a, { ...t }),
-      /* @__PURE__ */ i(m, {})
+      /* @__PURE__ */ i(l, {})
     ]
   }
 ), r = o.bind({});
@@ -148,5 +149,5 @@ export {
   u as VerticalResize,
   s as WithMaxLength,
   z as WithShouldShowCharacterCountFalse,
-  uo as default
+  xo as default
 };

package/dist/stories/g/DragAndDrop.stories.js

@@ -1,9 +1,9 @@
-import { jsxs as n, jsx as i } from "react/jsx-runtime";
+import { jsxs as o, jsx as i } from "react/jsx-runtime";
 import { useRef as c, useState as u } from "react";
 import "../../ui/a/AppContext/Context.js";
 import "../../ui/a/AppContext/ContextProvider.js";
 import "../../ui/a/BlurOverlay/BlurOverlay.js";
-import { e as g, D as h } from "../../FormBuilder-BgjYyPAc.js";
+import { e as g, D as h } from "../../FormBuilder-U45jur81.js";
 import "../../ui/a/Conversation/Context.js";
 import "../../ui/a/DotInfo/DotInfo.js";
 import "../../ui/a/Figure/Figure.js";
@@ -37,8 +37,9 @@ import "../../ui/b/Title/Title.js";
 import "../../ui/c/SocialMediaShareButton/SocialMediaShareButton.js";
 import "../../ui/f/common/Label/Label.js";
 import "../../ui/f/common/Description/Description.js";
+import "../../ui/f/common/Hint/Hint.js";
 import { Formik as f, Form as C } from "formik";
-import "../../ui/f/common/CharacterCount/CharacterCount.js";
+import '../../assets/styles.css';/* empty css                    */
 import "../../ui/f/fields/QueryCombobox/common/Menu/Menu.js";
 import "../../debounce-Cm69Z_cF.js";
 import "../../ui/f/fields/LatexPreviewInput/convertLatexToHtml.js";
@@ -46,7 +47,7 @@ import "../../ui/f/fields/RadioInput/RadioInput.js";
 import d from "../../ui/g/DragAndDrop/DragAndDrop.js";
 import "../../throttle-BCrS-Wew.js";
 import "../../ui/utils/formatting.js";
-const Ce = {
+const be = {
   title: "g/DragAndDrop",
   component: d,
   subcomponents: {
@@ -58,7 +59,7 @@ const Ce = {
   argTypes: {
     backgroundColor: { control: "color" }
   }
-}, b = ({ children: e, dragHandleProps: t }) => /* @__PURE__ */ n(
+}, b = ({ children: e, dragHandleProps: t }) => /* @__PURE__ */ o(
   "div",
   {
     style: {
@@ -71,11 +72,11 @@ const Ce = {
       e
     ]
   }
-), be = {
+), ye = {
   args: {
     items: Array(8).fill().map((e, t) => ({
       disabled: t === 0,
-      Content: (r) => /* @__PURE__ */ n(b, { dragHandleProps: r, children: [
+      Content: (r) => /* @__PURE__ */ o(b, { dragHandleProps: r, children: [
         "Item",
         " ",
         t + 1
@@ -83,7 +84,7 @@ const Ce = {
       identifier: `Item ${t + 1}`
     }))
   }
-}, y = ({ index: e, dragHandleProps: t }) => /* @__PURE__ */ n(
+}, y = ({ index: e, dragHandleProps: t }) => /* @__PURE__ */ o(
   "div",
   {
     style: {
@@ -94,7 +95,7 @@ const Ce = {
     },
     children: [
       /* @__PURE__ */ i("span", { ...t, className: "ai-icon", children: "H" }),
-      /* @__PURE__ */ n(
+      /* @__PURE__ */ o(
         "div",
         {
           style: {
@@ -106,7 +107,7 @@ const Ce = {
             gap: "var(--gap)"
           },
           children: [
-            /* @__PURE__ */ n(
+            /* @__PURE__ */ o(
               "p",
               {
                 style: {
@@ -124,7 +125,7 @@ const Ce = {
       )
     ]
   }
-), ye = {
+), De = {
   render: ({ items: e }) => {
     const t = c();
     return /* @__PURE__ */ i(
@@ -132,7 +133,7 @@ const Ce = {
       {
         initialValues: { items: [] },
         innerRef: t,
-        children: /* @__PURE__ */ n(C, { children: [
+        children: /* @__PURE__ */ o(C, { children: [
           /* @__PURE__ */ i(d, { onOrderChange: (a) => {
             const { values: s, setFieldValue: l } = t.current || {}, m = a.map(({ identifier: p }) => s == null ? void 0 : s[p]);
             l("items", m);
@@ -148,7 +149,7 @@ const Ce = {
       identifier: `input-${t + 1}`
     }))
   }
-}, o = ({ name: e, dragHandleProps: t }) => /* @__PURE__ */ n(
+}, n = ({ name: e, dragHandleProps: t }) => /* @__PURE__ */ o(
   "div",
   {
     style: {
@@ -170,30 +171,30 @@ const Ce = {
     id: "visible",
     title: "Visible columns",
     items: [
-      { identifier: "name", Content: (e) => /* @__PURE__ */ i(o, { name: "Name", dragHandleProps: e }) },
-      { identifier: "email", Content: (e) => /* @__PURE__ */ i(o, { name: "Email", dragHandleProps: e }) },
-      { identifier: "status", Content: (e) => /* @__PURE__ */ i(o, { name: "Status", dragHandleProps: e }) },
-      { identifier: "role", Content: (e) => /* @__PURE__ */ i(o, { name: "Role", dragHandleProps: e }) }
+      { identifier: "name", Content: (e) => /* @__PURE__ */ i(n, { name: "Name", dragHandleProps: e }) },
+      { identifier: "email", Content: (e) => /* @__PURE__ */ i(n, { name: "Email", dragHandleProps: e }) },
+      { identifier: "status", Content: (e) => /* @__PURE__ */ i(n, { name: "Status", dragHandleProps: e }) },
+      { identifier: "role", Content: (e) => /* @__PURE__ */ i(n, { name: "Role", dragHandleProps: e }) }
     ]
   },
   {
     id: "hidden",
     title: "Hidden columns",
     items: [
-      { identifier: "created_at", Content: (e) => /* @__PURE__ */ i(o, { name: "Created At", dragHandleProps: e }) },
-      { identifier: "updated_at", Content: (e) => /* @__PURE__ */ i(o, { name: "Updated At", dragHandleProps: e }) }
+      { identifier: "created_at", Content: (e) => /* @__PURE__ */ i(n, { name: "Created At", dragHandleProps: e }) },
+      { identifier: "updated_at", Content: (e) => /* @__PURE__ */ i(n, { name: "Updated At", dragHandleProps: e }) }
     ]
   }
-], v = ({ identifier: e, dragHandleProps: t }) => /* @__PURE__ */ i(o, { name: e, dragHandleProps: t }), H = (e) => e.map((t) => ({
+], v = ({ identifier: e, dragHandleProps: t }) => /* @__PURE__ */ i(n, { name: e, dragHandleProps: t }), H = (e) => e.map((t) => ({
   ...t,
   items: t.items.map((r) => ({
     ...r,
     Content: r.Content || ((a) => /* @__PURE__ */ i(v, { identifier: r.identifier, dragHandleProps: a }))
   }))
-})), De = {
+})), ve = {
   render: ({ sections: e = D, sectionTitleClassName: t }) => {
     const r = H(e), [a, s] = u(r);
-    return /* @__PURE__ */ n("div", { style: { maxWidth: "400px", padding: "1rem" }, children: [
+    return /* @__PURE__ */ o("div", { style: { maxWidth: "400px", padding: "1rem" }, children: [
       /* @__PURE__ */ i("h3", { style: { marginBottom: "1rem" }, children: "Multi-Section Drag and Drop" }),
       /* @__PURE__ */ i("p", { style: { marginBottom: "1rem", color: "#666" }, children: "Drag items to reorder within a section or move between sections." }),
       /* @__PURE__ */ i(
@@ -240,8 +241,8 @@ const Ce = {
   }
 };
 export {
-  be as Base,
-  De as MultiSection,
-  ye as WithFormikInputs,
-  Ce as default
+  ye as Base,
+  ve as MultiSection,
+  De as WithFormikInputs,
+  be as default
 };