@k3-universe/react-kit 0.0.15 → 0.0.16

package/dist/index.js

@@ -35215,10 +35215,9 @@ function DataTable({
   }, [onRefresh]);
   const renderActionButton = (action, key) => {
     if (action.element) return /* @__PURE__ */ jsx(React.Fragment, { children: action.element }, key);
-    const content = /* @__PURE__ */ jsxs(Fragment, { children: [
-      action.icon && action.iconPosition !== "right" && /* @__PURE__ */ jsx("span", { className: "mr-2", children: action.icon }),
-      action.label,
-      action.icon && action.iconPosition === "right" && /* @__PURE__ */ jsx("span", { className: "ml-2", children: action.icon })
+    const content = /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+      action.icon && /* @__PURE__ */ jsx("span", { className: cn$1(action.iconPosition === "right" ? "order-last" : ""), children: action.icon }),
+      action.label
     ] });
     return /* @__PURE__ */ jsx(
       Button$1,
@@ -35239,10 +35238,9 @@ function DataTable({
       var _a2;
       return (_a2 = action.onClick) == null ? void 0 : _a2.call(action, { selectedRows, clearSelection: () => table.resetRowSelection() });
     };
-    const content = /* @__PURE__ */ jsxs(Fragment, { children: [
-      action.icon && action.iconPosition !== "right" && /* @__PURE__ */ jsx("span", { className: "mr-2", children: action.icon }),
-      action.label,
-      action.icon && action.iconPosition === "right" && /* @__PURE__ */ jsx("span", { className: "ml-2", children: action.icon })
+    const content = /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+      action.icon && /* @__PURE__ */ jsx("span", { className: cn$1(action.iconPosition === "right" ? "order-last" : ""), children: action.icon }),
+      action.label
     ] });
     return /* @__PURE__ */ jsx(
       Button$1,
@@ -41329,14 +41327,18 @@ const StackDialogContext = createContext({
   }
 });
 function StackDialogRenderer(props2) {
-  const handleCloseDialog = (id) => () => {
-    props2.closeDialog(id);
+  const handleCloseDialog = (dialog) => () => {
+    if (dialog.onInterruptClosing == null) {
+      props2.closeDialog(dialog.id);
+    } else if (dialog.onInterruptClosing()) {
+      props2.closeDialog(dialog.id);
+    }
   };
   return props2.dialogs.map((dialog, i2) => /* @__PURE__ */ jsx(
     Dialog,
     {
       open: !!props2.dialogs[i2],
-      onOpenChange: handleCloseDialog(dialog.id),
+      onOpenChange: handleCloseDialog(dialog),
       children: /* @__PURE__ */ jsx(
         DialogContent,
         {
@@ -41357,15 +41359,10 @@ function StackDialogContextProvider(props2) {
   const [activeDialogs, setActiveDialogs] = useState([]);
   const ids = useRef(0);
   const handleCreateDialog = useCallback((config2) => {
-    const dialogId = config2.id || (ids.current++).toString();
+    const dialogId = config2.id ?? (ids.current++).toString();
     setActiveDialogs((prev) => {
       const clone2 = [...prev];
-      clone2.push({
-        id: dialogId,
-        template: config2.template,
-        closeOnEscapePressed: config2.closeOnEscapePressed,
-        closeOnInteractOutside: config2.closeOnInteractOutside
-      });
+      clone2.push({ ...config2, id: dialogId });
       return clone2;
     });
     return dialogId;

package/dist/kit/builder/data-table/components/DataTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../../src/kit/builder/data-table/components/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,SAAS,EACd,KAAK,kBAAkB,EACvB,KAAK,eAAe,EACpB,KAAK,KAAK,IAAI,UAAU,EACxB,KAAK,YAAY,EACjB,KAAK,eAAe,EACrB,MAAM,uBAAuB,CAAC;AAU/B,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAI5F,MAAM,WAAW,cAAc,CAAC,KAAK,EAAE,MAAM;IAC3C,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,EAAE,CAAC;IACpC,IAAI,EAAE,KAAK,EAAE,CAAC;IAEd,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,eAAe,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAC;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,qBAAqB,CAAC,EAAE,CAAC,QAAQ,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC/D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,kBAAkB,CAAC,EAAE,CAAC,QAAQ,EAAE,eAAe,KAAK,IAAI,CAAC;IACzD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,qBAAqB,CAAC,EAAE,eAAe,CAAC;IACxC,wBAAwB,CAAC,EAAE,CAAC,QAAQ,EAAE,eAAe,KAAK,IAAI,CAAC;IAE/D,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;IAE7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,WAAW,CAAC,EAAE,oBAAoB,CAAC;IACnC,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAAC;IAClD,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IAE/D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,eAAe,EAAE,CAAC;IAC5B,YAAY,CAAC,EAAE,oBAAoB,CAAC,KAAK,CAAC,EAAE,CAAC;IAE7C,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAEvC,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,IAAI,CAAC;IAElC,aAAa,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACtC;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,EACvC,OAAO,EACP,IAAI,EACJ,OAAO,EACP,OAAO,EACP,YAAY,EACZ,eAAe,EACf,aAAa,EACb,kBAAkB,EAClB,qBAAqB,EACrB,QAAQ,EACR,UAAU,EACV,kBAAkB,EAClB,eAAe,EACf,gBAAgB,EAChB,qBAAqB,EACrB,wBAAwB,EACxB,OAAO,EACP,SAAS,EACT,SAAyB,EACzB,WAAW,EACX,gBAAgB,EAChB,kBAAkB,EAClB,UAAU,EACV,OAAO,EACP,YAAY,EACZ,mBAAmB,EACnB,SAAS,EACT,UAAU,EACV,aAAa,EACb,WAAW,EACX,0BAA0B,GAC3B,EAAE,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,2CAyT/B"}
+{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../../src/kit/builder/data-table/components/DataTable.tsx"],"names":[],"mappings":"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"}

package/dist/kit/builder/stack-dialog/provider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../../../../src/kit/builder/stack-dialog/provider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiC,MAAM,OAAO,CAAC;AAKzE,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,iBAAiB,2CAkDlE"}
+{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../../../../src/kit/builder/stack-dialog/provider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiC,MAAM,OAAO,CAAC;AAKzE,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,iBAAiB,2CA6ClE"}

package/dist/kit/builder/stack-dialog/renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../../../src/kit/builder/stack-dialog/renderer.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C,wBAAgB,mBAAmB,CAAC,KAAK,EAAE;IACzC,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;CAClC,6CAyBA"}
+{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../../../src/kit/builder/stack-dialog/renderer.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C,wBAAgB,mBAAmB,CAAC,KAAK,EAAE;IACzC,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;CAClC,6CA8BA"}

package/dist/kit/builder/stack-dialog/types.d.ts

@@ -8,13 +8,20 @@ export type StackDialogContextInstance = {
 export type StackDialogInstance = {
     id: string;
     template: ReactNode;
+    onInterruptClosing?: () => boolean;
     closeOnInteractOutside?: boolean;
     closeOnEscapePressed?: boolean;
 };
 export type StackDialogCreateConfig = {
+    /** Optional ID for the dialog, generated when omited. */
     id?: string;
+    /** The element to be rendered in the dialog. */
     template: ReactNode;
+    /** Return **`true`** to continue closing the dialog. */
+    onInterruptClosing?: () => boolean;
+    /** Allow closing the dialog by clicking outside of dialog. */
     closeOnInteractOutside?: boolean;
+    /** Allow closing the dialog by pressing Escape key. */
     closeOnEscapePressed?: boolean;
 };
 export type StackDialogHook = Omit<StackDialogContextInstance, "activeDialogs">;

package/dist/kit/builder/stack-dialog/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/kit/builder/stack-dialog/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,0BAA0B,GAAG;IACvC,aAAa,EAAE,mBAAmB,EAAE,CAAC;IACrC,YAAY,EAAE,CAAC,MAAM,EAAE,uBAAuB,KAAK,MAAM,CAAC;IAC1D,WAAW,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,eAAe,EAAE,MAAM,IAAI,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,SAAS,CAAC;IACpB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,SAAS,CAAC;IACpB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,0BAA0B,EAAE,eAAe,CAAC,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/kit/builder/stack-dialog/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,0BAA0B,GAAG;IACvC,aAAa,EAAE,mBAAmB,EAAE,CAAC;IACrC,YAAY,EAAE,CAAC,MAAM,EAAE,uBAAuB,KAAK,MAAM,CAAC;IAC1D,WAAW,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,eAAe,EAAE,MAAM,IAAI,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,SAAS,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,OAAO,CAAC;IACnC,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC,yDAAyD;IACzD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,gDAAgD;IAChD,QAAQ,EAAE,SAAS,CAAC;IACpB,wDAAwD;IACxD,kBAAkB,CAAC,EAAE,MAAM,OAAO,CAAC;IACnC,8DAA8D;IAC9D,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,uDAAuD;IACvD,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,0BAA0B,EAAE,eAAe,CAAC,CAAA"}

package/dist/kit/themes/clean-slate.css

@@ -584,6 +584,10 @@
     z-index: 1;
   }
 
+  .order-last {
+    order: 9999;
+  }
+
   .col-span-1 {
     grid-column: span 1 / span 1;
   }
@@ -1728,6 +1732,10 @@
     margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
   }
 
+  .gap-x-2 {
+    column-gap: calc(var(--spacing) * 2);
+  }
+
   :where(.space-x-1 > :not(:last-child)) {
     --tw-space-x-reverse: 0;
     margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));

package/dist/kit/themes/default.css

@@ -587,6 +587,10 @@
     z-index: 1;
   }
 
+  .order-last {
+    order: 9999;
+  }
+
   .col-span-1 {
     grid-column: span 1 / span 1;
   }
@@ -1731,6 +1735,10 @@
     margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
   }
 
+  .gap-x-2 {
+    column-gap: calc(var(--spacing) * 2);
+  }
+
   :where(.space-x-1 > :not(:last-child)) {
     --tw-space-x-reverse: 0;
     margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));

package/dist/kit/themes/minimal-modern.css

@@ -584,6 +584,10 @@
     z-index: 1;
   }
 
+  .order-last {
+    order: 9999;
+  }
+
   .col-span-1 {
     grid-column: span 1 / span 1;
   }
@@ -1728,6 +1732,10 @@
     margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
   }
 
+  .gap-x-2 {
+    column-gap: calc(var(--spacing) * 2);
+  }
+
   :where(.space-x-1 > :not(:last-child)) {
     --tw-space-x-reverse: 0;
     margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));

package/dist/kit/themes/spotify.css

@@ -584,6 +584,10 @@
     z-index: 1;
   }
 
+  .order-last {
+    order: 9999;
+  }
+
   .col-span-1 {
     grid-column: span 1 / span 1;
   }
@@ -1728,6 +1732,10 @@
     margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
   }
 
+  .gap-x-2 {
+    column-gap: calc(var(--spacing) * 2);
+  }
+
   :where(.space-x-1 > :not(:last-child)) {
     --tw-space-x-reverse: 0;
     margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@k3-universe/react-kit",
-  "version": "0.0.15",
+  "version": "0.0.16",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",

package/src/kit/builder/data-table/components/DataTable.tsx

@@ -220,11 +220,10 @@ export function DataTable<TData, TValue>({
   const renderActionButton = (action: DataTableAction, key: React.Key) => {
     if (action.element) return <React.Fragment key={key}>{action.element}</React.Fragment>;
     const content = (
-      <>
-        {action.icon && action.iconPosition !== 'right' && <span className="mr-2">{action.icon}</span>}
+      <div className="flex items-center gap-x-2">
+        {action.icon && <span className={cn(action.iconPosition === 'right' ? 'order-last' : '')}>{action.icon}</span>}
         {action.label}
-        {action.icon && action.iconPosition === 'right' && <span className="ml-2">{action.icon}</span>}
-      </>
+      </div>
     );
     return (
       <Button
@@ -244,11 +243,10 @@ export function DataTable<TData, TValue>({
     if (action.element) return <React.Fragment key={key}>{action.element}</React.Fragment>;
     const onClick = () => action.onClick?.({ selectedRows, clearSelection: () => table.resetRowSelection() });
     const content = (
-      <>
-        {action.icon && action.iconPosition !== 'right' && <span className="mr-2">{action.icon}</span>}
+      <div className="flex items-center gap-x-2">
+        {action.icon && <span className={cn(action.iconPosition === 'right' ? 'order-last' : '')}>{action.icon}</span>}
         {action.label}
-        {action.icon && action.iconPosition === 'right' && <span className="ml-2">{action.icon}</span>}
-      </>
+      </div>
     );
     return (
       <Button

package/src/kit/builder/stack-dialog/provider.tsx

@@ -8,16 +8,11 @@ export function StackDialogContextProvider(props: PropsWithChildren) {
   const ids = useRef<number>(0)
 
   const handleCreateDialog = useCallback((config: StackDialogCreateConfig) => {
-    const dialogId = config.id || (ids.current++).toString();
+    const dialogId = config.id ?? (ids.current++).toString();
 
     setActiveDialogs(prev => {
       const clone = [...prev];
-      clone.push({
-        id: dialogId,
-        template: config.template,
-        closeOnEscapePressed: config.closeOnEscapePressed,
-        closeOnInteractOutside: config.closeOnInteractOutside,
-      });
+      clone.push({ ...config, id: dialogId });
       return clone;
     });
 

package/src/kit/builder/stack-dialog/renderer.tsx

@@ -5,15 +5,20 @@ export function StackDialogRenderer(props: {
   dialogs: StackDialogInstance[],
   closeDialog: (id: string) => void
 }) {
-  const handleCloseDialog = (id: string) => () => {
-    props.closeDialog(id)
+  const handleCloseDialog = (dialog: StackDialogInstance) => () => {
+    if (dialog.onInterruptClosing == null) {
+      props.closeDialog(dialog.id);
+    }
+    else if (dialog.onInterruptClosing()) {
+      props.closeDialog(dialog.id)
+    }
   }
 
   return props.dialogs.map((dialog, i) => (
     (
       <Dialog
         open={!!props.dialogs[i]}
-        onOpenChange={handleCloseDialog(dialog.id)}
+        onOpenChange={handleCloseDialog(dialog)}
         key={dialog.id}
       >
         <DialogContent

package/src/kit/builder/stack-dialog/types.ts

@@ -10,14 +10,21 @@ export type StackDialogContextInstance = {
 export type StackDialogInstance = {
   id: string,
   template: ReactNode,
+  onInterruptClosing?: () => boolean,
   closeOnInteractOutside?: boolean,
   closeOnEscapePressed?: boolean,
 };
 
 export type StackDialogCreateConfig = {
+  /** Optional ID for the dialog, generated when omited. */
   id?: string,
+  /** The element to be rendered in the dialog. */
   template: ReactNode,
+  /** Return **`true`** to continue closing the dialog. */
+  onInterruptClosing?: () => boolean,
+  /** Allow closing the dialog by clicking outside of dialog. */
   closeOnInteractOutside?: boolean,
+  /** Allow closing the dialog by pressing Escape key. */
   closeOnEscapePressed?: boolean,
 };
 

package/storybook-static/assets/Accordion.stories-KU4JBR8U.js

@@ -1,52 +0,0 @@
-import{j as e}from"./jsx-runtime-D_zvdyIk.js";import{A as n,a as o,b as r,c as i}from"./accordion-DVgwQcnw.js";import{r as T}from"./iframe-v7iAhKit.js";import"./index-CDY5kTx5.js";import"./index-Bv9yk470.js";import"./index-DbaA6-o1.js";import"./index-DW48STyt.js";import"./index-ByqivBWx.js";import"./index-D8RXF03I.js";import"./index-Tp9IdbR8.js";import"./index-DrN5n71E.js";import"./index-CwBdPBFz.js";import"./index-CGnyVRgB.js";import"./index-AvwFFKJc.js";import"./index-BfiCOk42.js";import"./index-B_qx7A5T.js";import"./utils-D-KgF5mV.js";import"./chevron-down-D_37S6il.js";import"./createLucideIcon-BrHXro7t.js";import"./preload-helper-Dp1pzeXC.js";const G={title:"Shadcn/UI/Accordion",component:n},c={args:{type:"single",collapsible:!0},render:t=>e.jsxs(n,{...t,children:[e.jsxs(o,{value:"item-1",children:[e.jsx(r,{children:"Is it accessible?"}),e.jsx(i,{children:"Yes. It adheres to WAI-ARIA design patterns."})]}),e.jsxs(o,{value:"item-2",children:[e.jsx(r,{children:"Is it styled?"}),e.jsx(i,{children:"Yes. It comes with default styles that can be overridden."})]}),e.jsxs(o,{value:"item-3",children:[e.jsx(r,{children:"Is it animated?"}),e.jsx(i,{children:"Yes. It uses utility classes for smooth animations."})]})]})},s={args:{type:"multiple",defaultValue:["item-1"]},render:t=>e.jsxs(n,{...t,children:[e.jsxs(o,{value:"item-1",children:[e.jsx(r,{children:"Open multiple items?"}),e.jsx(i,{children:"Yes. In multiple mode you can keep several sections open."})]}),e.jsxs(o,{value:"item-2",children:[e.jsx(r,{children:"Keeps state independent?"}),e.jsx(i,{children:"Each item can be toggled independently in multiple mode."})]}),e.jsxs(o,{value:"item-3",children:[e.jsx(r,{children:"Works with defaultValue?"}),e.jsx(i,{children:"Provide an array of values to open initially."})]})]})},d={render:t=>e.jsxs(n,{...t,children:[e.jsxs(o,{value:"item-1",children:[e.jsx(r,{children:"Interactable item"}),e.jsx(i,{children:"This item can be toggled as usual."})]}),e.jsxs(o,{value:"item-2",disabled:!0,children:[e.jsx(r,{children:"Disabled item"}),e.jsx(i,{children:"This content cannot be toggled because the item is disabled."})]})]})};function y(){const[t,C]=T.useState("item-1");return e.jsxs(n,{type:"single",collapsible:!0,value:t,onValueChange:C,children:[e.jsxs(o,{value:"item-1",children:[e.jsx(r,{children:"Controlled: Item 1"}),e.jsx(i,{children:"Clicking again will collapse because collapsible is true."})]}),e.jsxs(o,{value:"item-2",children:[e.jsx(r,{children:"Controlled: Item 2"}),e.jsx(i,{children:"State is managed via value/onValueChange."})]})]})}const a={render:()=>e.jsx(y,{})};var l,m,u;c.parameters={...c.parameters,docs:{...(l=c.parameters)==null?void 0:l.docs,source:{originalSource:`{
-  args: {
-    type: 'single',
-    collapsible: true
-  },
-  render: args => <Accordion {...args}>
-      <AccordionItem value="item-1">
-        <AccordionTrigger>Is it accessible?</AccordionTrigger>
-        <AccordionContent>Yes. It adheres to WAI-ARIA design patterns.</AccordionContent>
-      </AccordionItem>
-      <AccordionItem value="item-2">
-        <AccordionTrigger>Is it styled?</AccordionTrigger>
-        <AccordionContent>Yes. It comes with default styles that can be overridden.</AccordionContent>
-      </AccordionItem>
-      <AccordionItem value="item-3">
-        <AccordionTrigger>Is it animated?</AccordionTrigger>
-        <AccordionContent>Yes. It uses utility classes for smooth animations.</AccordionContent>
-      </AccordionItem>
-    </Accordion>
-}`,...(u=(m=c.parameters)==null?void 0:m.docs)==null?void 0:u.source}}};var p,g,A;s.parameters={...s.parameters,docs:{...(p=s.parameters)==null?void 0:p.docs,source:{originalSource:`{
-  args: {
-    type: 'multiple',
-    defaultValue: ['item-1']
-  },
-  render: args => <Accordion {...args}>
-      <AccordionItem value="item-1">
-        <AccordionTrigger>Open multiple items?</AccordionTrigger>
-        <AccordionContent>Yes. In multiple mode you can keep several sections open.</AccordionContent>
-      </AccordionItem>
-      <AccordionItem value="item-2">
-        <AccordionTrigger>Keeps state independent?</AccordionTrigger>
-        <AccordionContent>Each item can be toggled independently in multiple mode.</AccordionContent>
-      </AccordionItem>
-      <AccordionItem value="item-3">
-        <AccordionTrigger>Works with defaultValue?</AccordionTrigger>
-        <AccordionContent>Provide an array of values to open initially.</AccordionContent>
-      </AccordionItem>
-    </Accordion>
-}`,...(A=(g=s.parameters)==null?void 0:g.docs)==null?void 0:A.source}}};var h,I,x;d.parameters={...d.parameters,docs:{...(h=d.parameters)==null?void 0:h.docs,source:{originalSource:`{
-  render: args => <Accordion {...args}>
-      <AccordionItem value="item-1">
-        <AccordionTrigger>Interactable item</AccordionTrigger>
-        <AccordionContent>This item can be toggled as usual.</AccordionContent>
-      </AccordionItem>
-      <AccordionItem value="item-2" disabled>
-        <AccordionTrigger>Disabled item</AccordionTrigger>
-        <AccordionContent>This content cannot be toggled because the item is disabled.</AccordionContent>
-      </AccordionItem>
-    </Accordion>
-}`,...(x=(I=d.parameters)==null?void 0:I.docs)==null?void 0:x.source}}};var j,v,b;a.parameters={...a.parameters,docs:{...(j=a.parameters)==null?void 0:j.docs,source:{originalSource:`{
-  render: () => <ControlledAccordionDemo />
-}`,...(b=(v=a.parameters)==null?void 0:v.docs)==null?void 0:b.source}}};const H=["Basic","Multiple","DisabledItem","Controlled"];export{c as Basic,a as Controlled,d as DisabledItem,s as Multiple,H as __namedExportsOrder,G as default};