@customafk/lunas-ui 0.2.5 → 0.2.7

package/dist/dialog-CNhwBcEl.d.cts

@@ -0,0 +1,90 @@
+import * as react_jsx_runtime95 from "react/jsx-runtime";
+import { Dialog } from "radix-ui";
+
+//#region packages/components/ui/dialog.d.ts
+
+/**
+ * Accessible modal dialog built on Radix UI's Dialog primitives with animated overlay, close button, and responsive sizing.
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   Dialog, DialogTrigger, DialogContent,
+ *   DialogHeader, DialogTitle, DialogDescription, DialogFooter,
+ * } from '@customafk/lunas-ui/ui/dialog';
+ * import { Button } from '@customafk/lunas-ui/ui/button';
+ *
+ * <Dialog>
+ *   <DialogTrigger asChild>
+ *     <Button>Open dialog</Button>
+ *   </DialogTrigger>
+ *   <DialogContent>
+ *     <DialogHeader>
+ *       <DialogTitle>Confirm action</DialogTitle>
+ *       <DialogDescription>This cannot be undone.</DialogDescription>
+ *     </DialogHeader>
+ *     <DialogFooter>
+ *       <Button variant="outline">Cancel</Button>
+ *       <Button>Confirm</Button>
+ *     </DialogFooter>
+ *   </DialogContent>
+ * </Dialog>
+ * ```
+ */
+declare function Dialog$1({
+  ...props
+}: React.ComponentProps<typeof Dialog.Root>): react_jsx_runtime95.JSX.Element;
+/** Element that opens the dialog when clicked; typically wrapped with `asChild` around a `Button`. */
+declare function DialogTrigger({
+  ...props
+}: React.ComponentProps<typeof Dialog.Trigger>): react_jsx_runtime95.JSX.Element;
+/** Renders dialog overlay and content into a portal outside the normal React tree. */
+declare function DialogPortal({
+  ...props
+}: React.ComponentProps<typeof Dialog.Portal>): react_jsx_runtime95.JSX.Element;
+/** Button that closes the dialog; can be composed with `asChild` to use a custom element. */
+declare function DialogClose({
+  ...props
+}: React.ComponentProps<typeof Dialog.Close>): react_jsx_runtime95.JSX.Element;
+/** Semi-transparent backdrop rendered behind the dialog panel with fade-in/out animation. */
+declare function DialogOverlay({
+  className,
+  ...props
+}: React.ComponentProps<typeof Dialog.Overlay>): react_jsx_runtime95.JSX.Element;
+/**
+ * Animated dialog panel centred on screen; includes `DialogOverlay` and an optional close button.
+ *
+ * @param showCloseButton - When `true` (default), renders a `CloseButton` in the top-right corner.
+ */
+declare function DialogContent({
+  className,
+  children,
+  showCloseButton,
+  ...props
+}: React.ComponentProps<typeof Dialog.Content> & {
+  /** When `true` (default), renders an `×` close button fixed to the top-right corner of the panel. */
+  showCloseButton?: boolean;
+}): react_jsx_runtime95.JSX.Element;
+/** Layout wrapper for the dialog title and description, stacked vertically with left alignment on wider screens. */
+declare function DialogHeader({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime95.JSX.Element;
+/** Layout wrapper for dialog action buttons, stacked on mobile and right-aligned in a row on wider screens. */
+declare function DialogFooter({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime95.JSX.Element;
+/** Accessible heading for the dialog panel, styled with the h3 heading variant and announced by screen readers. */
+declare function DialogTitle({
+  className,
+  ...props
+}: React.ComponentProps<typeof Dialog.Title>): react_jsx_runtime95.JSX.Element;
+/** Muted supporting text that describes the dialog's purpose; read by screen readers alongside the title. */
+declare function DialogDescription({
+  className,
+  ...props
+}: React.ComponentProps<typeof Dialog.Description>): react_jsx_runtime95.JSX.Element;
+//#endregion
+export { DialogFooter as a, DialogPortal as c, DialogDescription as i, DialogTitle as l, DialogClose as n, DialogHeader as o, DialogContent as r, DialogOverlay as s, Dialog$1 as t, DialogTrigger as u };
+//# sourceMappingURL=dialog-CNhwBcEl.d.cts.map

package/dist/dialog-D6ygAOSV.d.mts

@@ -0,0 +1,90 @@
+import * as react_jsx_runtime104 from "react/jsx-runtime";
+import { Dialog } from "radix-ui";
+
+//#region packages/components/ui/dialog.d.ts
+
+/**
+ * Accessible modal dialog built on Radix UI's Dialog primitives with animated overlay, close button, and responsive sizing.
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   Dialog, DialogTrigger, DialogContent,
+ *   DialogHeader, DialogTitle, DialogDescription, DialogFooter,
+ * } from '@customafk/lunas-ui/ui/dialog';
+ * import { Button } from '@customafk/lunas-ui/ui/button';
+ *
+ * <Dialog>
+ *   <DialogTrigger asChild>
+ *     <Button>Open dialog</Button>
+ *   </DialogTrigger>
+ *   <DialogContent>
+ *     <DialogHeader>
+ *       <DialogTitle>Confirm action</DialogTitle>
+ *       <DialogDescription>This cannot be undone.</DialogDescription>
+ *     </DialogHeader>
+ *     <DialogFooter>
+ *       <Button variant="outline">Cancel</Button>
+ *       <Button>Confirm</Button>
+ *     </DialogFooter>
+ *   </DialogContent>
+ * </Dialog>
+ * ```
+ */
+declare function Dialog$1({
+  ...props
+}: React.ComponentProps<typeof Dialog.Root>): react_jsx_runtime104.JSX.Element;
+/** Element that opens the dialog when clicked; typically wrapped with `asChild` around a `Button`. */
+declare function DialogTrigger({
+  ...props
+}: React.ComponentProps<typeof Dialog.Trigger>): react_jsx_runtime104.JSX.Element;
+/** Renders dialog overlay and content into a portal outside the normal React tree. */
+declare function DialogPortal({
+  ...props
+}: React.ComponentProps<typeof Dialog.Portal>): react_jsx_runtime104.JSX.Element;
+/** Button that closes the dialog; can be composed with `asChild` to use a custom element. */
+declare function DialogClose({
+  ...props
+}: React.ComponentProps<typeof Dialog.Close>): react_jsx_runtime104.JSX.Element;
+/** Semi-transparent backdrop rendered behind the dialog panel with fade-in/out animation. */
+declare function DialogOverlay({
+  className,
+  ...props
+}: React.ComponentProps<typeof Dialog.Overlay>): react_jsx_runtime104.JSX.Element;
+/**
+ * Animated dialog panel centred on screen; includes `DialogOverlay` and an optional close button.
+ *
+ * @param showCloseButton - When `true` (default), renders a `CloseButton` in the top-right corner.
+ */
+declare function DialogContent({
+  className,
+  children,
+  showCloseButton,
+  ...props
+}: React.ComponentProps<typeof Dialog.Content> & {
+  /** When `true` (default), renders an `×` close button fixed to the top-right corner of the panel. */
+  showCloseButton?: boolean;
+}): react_jsx_runtime104.JSX.Element;
+/** Layout wrapper for the dialog title and description, stacked vertically with left alignment on wider screens. */
+declare function DialogHeader({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime104.JSX.Element;
+/** Layout wrapper for dialog action buttons, stacked on mobile and right-aligned in a row on wider screens. */
+declare function DialogFooter({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime104.JSX.Element;
+/** Accessible heading for the dialog panel, styled with the h3 heading variant and announced by screen readers. */
+declare function DialogTitle({
+  className,
+  ...props
+}: React.ComponentProps<typeof Dialog.Title>): react_jsx_runtime104.JSX.Element;
+/** Muted supporting text that describes the dialog's purpose; read by screen readers alongside the title. */
+declare function DialogDescription({
+  className,
+  ...props
+}: React.ComponentProps<typeof Dialog.Description>): react_jsx_runtime104.JSX.Element;
+//#endregion
+export { DialogFooter as a, DialogPortal as c, DialogDescription as i, DialogTitle as l, DialogClose as n, DialogHeader as o, DialogContent as r, DialogOverlay as s, Dialog$1 as t, DialogTrigger as u };
+//# sourceMappingURL=dialog-D6ygAOSV.d.mts.map

package/dist/dialog-o_68LQXd.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-Bmb41Sf3.cjs`),t=require(`./heading-AKz5ewy-.cjs`),n=require(`./paragraph-DN85Huc4.cjs`),r=require(`./close-DXk_H3Gt.cjs`);let i=require(`react/jsx-runtime`),a=require(`@customafk/react-toolkit/utils`),o=require(`radix-ui`);function s({...e}){return(0,i.jsx)(o.Dialog.Root,{"data-slot":`dialog`,...e})}function c({...e}){return(0,i.jsx)(o.Dialog.Trigger,{"data-slot":`dialog-trigger`,...e})}function l({...e}){return(0,i.jsx)(o.Dialog.Portal,{"data-slot":`dialog-portal`,...e})}function u({...e}){return(0,i.jsx)(o.Dialog.Close,{"data-slot":`dialog-close`,...e})}function d({className:e,...t}){return(0,i.jsx)(o.Dialog.Overlay,{"data-slot":`dialog-overlay`,className:(0,a.cn)(`fixed inset-0 z-50 bg-black/50`,`data-[state=open]:animate-in data-[state=open]:fade-in-0`,`data-[state=closed]:animate-out data-[state=closed]:fade-out-0`,e),...t})}function f({className:e,children:t,showCloseButton:n=!0,...s}){return(0,i.jsxs)(l,{children:[(0,i.jsx)(d,{}),(0,i.jsxs)(o.Dialog.Content,{"data-slot":`dialog-content`,className:(0,a.cn)(`fixed top-1/2 left-1/2 z-50 -translate-x-1/2 -translate-y-1/2`,`grid w-full max-w-[calc(100%-2rem)] bg-background`,`max-h-[85dvh] gap-4 rounded-2xl p-6 shadow-dialog outline-none duration-200`,`sm:max-w-lg`,`data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-80`,`data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-80`,e),...s,children:[t,n&&(0,i.jsx)(o.Dialog.Close,{"data-slot":`dialog-close`,tabIndex:-1,asChild:!0,className:`absolute top-3 right-3`,children:(0,i.jsx)(r.t,{})})]})]})}function p({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`dialog-header`,className:(0,a.cn)(`flex flex-col gap-2 text-center sm:text-left`,e),...t})}function m({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`dialog-footer`,className:(0,a.cn)(`flex flex-col-reverse gap-2 sm:flex-row sm:justify-end`,e),...t})}function h({className:e,...n}){return(0,i.jsx)(o.Dialog.Title,{"data-slot":`dialog-title`,className:(0,a.cn)(t.t({level:`h3`}),e),...n})}function g({className:e,...t}){return(0,i.jsx)(o.Dialog.Description,{"data-slot":`dialog-description`,className:(0,a.cn)(n.n({variant:`muted`}),e),...t})}Object.defineProperty(exports,`a`,{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,`c`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`l`,{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,`o`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,`s`,{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,`u`,{enumerable:!0,get:function(){return c}});
+//# sourceMappingURL=dialog-o_68LQXd.cjs.map

package/dist/dialog-o_68LQXd.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-o_68LQXd.cjs","names":["DialogPrimitive","CloseButton","headingVariants","paragraphVariants"],"sources":["../packages/components/ui/dialog.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Dialog as DialogPrimitive } from 'radix-ui';\nimport { CloseButton } from './buttons/close';\nimport { headingVariants } from '../typography/heading';\nimport { paragraphVariants } from '../typography/paragraph';\n\n/**\n * Accessible modal dialog built on Radix UI's Dialog primitives with animated overlay, close button, and responsive sizing.\n *\n * @example\n * ```tsx\n * import {\n *   Dialog, DialogTrigger, DialogContent,\n *   DialogHeader, DialogTitle, DialogDescription, DialogFooter,\n * } from '@customafk/lunas-ui/ui/dialog';\n * import { Button } from '@customafk/lunas-ui/ui/button';\n *\n * <Dialog>\n *   <DialogTrigger asChild>\n *     <Button>Open dialog</Button>\n *   </DialogTrigger>\n *   <DialogContent>\n *     <DialogHeader>\n *       <DialogTitle>Confirm action</DialogTitle>\n *       <DialogDescription>This cannot be undone.</DialogDescription>\n *     </DialogHeader>\n *     <DialogFooter>\n *       <Button variant=\"outline\">Cancel</Button>\n *       <Button>Confirm</Button>\n *     </DialogFooter>\n *   </DialogContent>\n * </Dialog>\n * ```\n */\nfunction Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>) {\n  return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />;\n}\n\n/** Element that opens the dialog when clicked; typically wrapped with `asChild` around a `Button`. */\nfunction DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n  return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />;\n}\n\n/** Renders dialog overlay and content into a portal outside the normal React tree. */\nfunction DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n  return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />;\n}\n\n/** Button that closes the dialog; can be composed with `asChild` to use a custom element. */\nfunction DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>) {\n  return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />;\n}\n\n/** Semi-transparent backdrop rendered behind the dialog panel with fade-in/out animation. */\nfunction DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>) {\n  return (\n    <DialogPrimitive.Overlay\n      data-slot=\"dialog-overlay\"\n      className={cn(\n        'fixed inset-0 z-50 bg-black/50',\n        'data-[state=open]:animate-in data-[state=open]:fade-in-0',\n        'data-[state=closed]:animate-out data-[state=closed]:fade-out-0',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Animated dialog panel centred on screen; includes `DialogOverlay` and an optional close button.\n *\n * @param showCloseButton - When `true` (default), renders a `CloseButton` in the top-right corner.\n */\nfunction DialogContent({\n  className,\n  children,\n  showCloseButton = true,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Content> & {\n  /** When `true` (default), renders an `×` close button fixed to the top-right corner of the panel. */\n  showCloseButton?: boolean;\n}) {\n  return (\n    <DialogPortal>\n      <DialogOverlay />\n      <DialogPrimitive.Content\n        data-slot=\"dialog-content\"\n        className={cn(\n          'fixed top-1/2 left-1/2 z-50 -translate-x-1/2 -translate-y-1/2',\n          'grid w-full max-w-[calc(100%-2rem)] bg-background',\n          'max-h-[85dvh] gap-4 rounded-2xl p-6 shadow-dialog outline-none duration-200',\n          'sm:max-w-lg',\n          'data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-80',\n          'data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-80',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {showCloseButton && (\n          <DialogPrimitive.Close data-slot=\"dialog-close\" tabIndex={-1} asChild className=\"absolute top-3 right-3\">\n            <CloseButton />\n          </DialogPrimitive.Close>\n        )}\n      </DialogPrimitive.Content>\n    </DialogPortal>\n  );\n}\n\n/** Layout wrapper for the dialog title and description, stacked vertically with left alignment on wider screens. */\nfunction DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"dialog-header\" className={cn('flex flex-col gap-2 text-center sm:text-left', className)} {...props} />;\n}\n\n/** Layout wrapper for dialog action buttons, stacked on mobile and right-aligned in a row on wider screens. */\nfunction DialogFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"dialog-footer\" className={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)} {...props} />;\n}\n\n/** Accessible heading for the dialog panel, styled with the h3 heading variant and announced by screen readers. */\nfunction DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>) {\n  return <DialogPrimitive.Title data-slot=\"dialog-title\" className={cn(headingVariants({ level: 'h3' }), className)} {...props} />;\n}\n\n/** Muted supporting text that describes the dialog's purpose; read by screen readers alongside the title. */\nfunction DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>) {\n  return <DialogPrimitive.Description data-slot=\"dialog-description\" className={cn(paragraphVariants({ variant: 'muted' }), className)} {...props} />;\n}\n\nexport { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };\n"],"mappings":"yPAqCA,SAAS,EAAO,CAAE,GAAG,GAA4D,CAC/E,OAAO,EAAA,EAAA,KAACA,EAAAA,OAAgB,KAAA,CAAK,YAAU,SAAS,GAAI,GAAS,CAI/D,SAAS,EAAc,CAAE,GAAG,GAA+D,CACzF,OAAO,EAAA,EAAA,KAACA,EAAAA,OAAgB,QAAA,CAAQ,YAAU,iBAAiB,GAAI,GAAS,CAI1E,SAAS,EAAa,CAAE,GAAG,GAA8D,CACvF,OAAO,EAAA,EAAA,KAACA,EAAAA,OAAgB,OAAA,CAAO,YAAU,gBAAgB,GAAI,GAAS,CAIxE,SAAS,EAAY,CAAE,GAAG,GAA6D,CACrF,OAAO,EAAA,EAAA,KAACA,EAAAA,OAAgB,MAAA,CAAM,YAAU,eAAe,GAAI,GAAS,CAItE,SAAS,EAAc,CAAE,YAAW,GAAG,GAA+D,CACpG,OACE,EAAA,EAAA,KAACA,EAAAA,OAAgB,QAAA,CACf,YAAU,iBACV,WAAA,EAAA,EAAA,IACE,iCACA,2DACA,iEACA,EACD,CACD,GAAI,GACJ,CASN,SAAS,EAAc,CACrB,YACA,WACA,kBAAkB,GAClB,GAAG,GAIF,CACD,OACE,EAAA,EAAA,MAAC,EAAA,CAAA,SAAA,EACC,EAAA,EAAA,KAAC,EAAA,EAAA,CAAgB,EACjB,EAAA,EAAA,MAACA,EAAAA,OAAgB,QAAA,CACf,YAAU,iBACV,WAAA,EAAA,EAAA,IACE,gEACA,oDACA,8EACA,cACA,wFACA,iGACA,EACD,CACD,GAAI,YAEH,EACA,IACC,EAAA,EAAA,KAACA,EAAAA,OAAgB,MAAA,CAAM,YAAU,eAAe,SAAU,GAAI,QAAA,GAAQ,UAAU,mCAC9E,EAAA,EAAA,KAACC,EAAAA,EAAAA,EAAAA,CAAc,EACO,CAAA,EAEF,CAAA,CAAA,CACb,CAKnB,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OAAO,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,gBAAgB,WAAA,EAAA,EAAA,IAAc,+CAAgD,EAAU,CAAE,GAAI,GAAS,CAI/H,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OAAO,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,gBAAgB,WAAA,EAAA,EAAA,IAAc,yDAA0D,EAAU,CAAE,GAAI,GAAS,CAIzI,SAAS,EAAY,CAAE,YAAW,GAAG,GAA6D,CAChG,OAAO,EAAA,EAAA,KAACD,EAAAA,OAAgB,MAAA,CAAM,YAAU,eAAe,WAAA,EAAA,EAAA,IAAcE,EAAAA,EAAgB,CAAE,MAAO,KAAM,CAAC,CAAE,EAAU,CAAE,GAAI,GAAS,CAIlI,SAAS,EAAkB,CAAE,YAAW,GAAG,GAAmE,CAC5G,OAAO,EAAA,EAAA,KAACF,EAAAA,OAAgB,YAAA,CAAY,YAAU,qBAAqB,WAAA,EAAA,EAAA,IAAcG,EAAAA,EAAkB,CAAE,QAAS,QAAS,CAAC,CAAE,EAAU,CAAE,GAAI,GAAS"}

package/dist/dialogs/confirm-dialog.cjs

@@ -1,2 +1,2 @@
-const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../heading-BEbpIiLg.cjs`),require(`../paragraph-Co2e-y5c.cjs`),require(`../button.variants-aqkTmzFu.cjs`);const t=require(`../ui/alert-dialog.cjs`);let n=require(`react/jsx-runtime`),r=require(`lucide-react`);const i=({open:e,isLoading:i=!1,title:a,description:o,cancelText:s,submitText:c,descriptionClassName:l,onOpenChange:u,onConfirm:d})=>(0,n.jsx)(t.AlertDialog,{open:e,onOpenChange:u,children:(0,n.jsxs)(t.AlertDialogContent,{className:`p-4 pb-5`,children:[(0,n.jsxs)(t.AlertDialogHeader,{className:`gap-2`,children:[(0,n.jsxs)(t.AlertDialogTitle,{className:`inline-flex items-center gap-x-1`,children:[(0,n.jsx)(r.TriangleAlert,{size:20}),(0,n.jsx)(`p`,{children:a})]}),(0,n.jsx)(t.AlertDialogDescription,{className:l,children:o})]}),(0,n.jsxs)(t.AlertDialogFooter,{children:[(0,n.jsx)(t.AlertDialogCancel,{children:s||`Cancel`}),(0,n.jsx)(t.AlertDialogAction,{type:`button`,className:`min-h-9 w-full md:w-24`,onClick:e=>{d?.(),e.preventDefault(),e.stopPropagation()},children:i?(0,n.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:(0,n.jsx)(`div`,{className:`loader-spinner text-muted-foreground`})}):c||`Confirm`})]})]})});exports.ConfirmDialog=i;
+"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../button.variants-tnhb123u.cjs`),require(`../heading-AKz5ewy-.cjs`),require(`../paragraph-DN85Huc4.cjs`);const t=require(`../ui/alert-dialog.cjs`);let n=require(`lucide-react`),r=require(`react`),i=require(`react/jsx-runtime`);const a=({open:e,isLoading:a=!1,title:o,description:s,cancelText:c=`Cancel`,submitText:l=`Confirm`,descriptionClassName:u,onOpenChange:d,onConfirm:f})=>{let p=(0,r.useCallback)(e=>{e.preventDefault(),e.stopPropagation(),f?.()},[f]);return(0,i.jsx)(t.AlertDialog,{open:e,onOpenChange:d,children:(0,i.jsxs)(t.AlertDialogContent,{className:`p-4 pb-5`,children:[(0,i.jsxs)(t.AlertDialogHeader,{className:`gap-2`,children:[(0,i.jsxs)(t.AlertDialogTitle,{className:`inline-flex items-center gap-x-1`,children:[(0,i.jsx)(n.TriangleAlert,{size:20}),(0,i.jsx)(`p`,{children:o})]}),(0,i.jsx)(t.AlertDialogDescription,{className:u,children:s})]}),(0,i.jsxs)(t.AlertDialogFooter,{children:[(0,i.jsx)(t.AlertDialogCancel,{children:c}),(0,i.jsx)(t.AlertDialogAction,{type:`button`,className:`min-h-9 w-full md:w-24`,onClick:p,children:a?(0,i.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:(0,i.jsx)(`div`,{className:`loader-spinner text-text-positive-weak`})}):l})]})]})})};exports.ConfirmDialog=a;
 //# sourceMappingURL=confirm-dialog.cjs.map

package/dist/dialogs/confirm-dialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"confirm-dialog.cjs","names":["ConfirmDialog: React.FC<React.PropsWithChildren<Props>>","AlertDialog","AlertDialogContent","AlertDialogHeader","AlertDialogTitle","TriangleAlert","AlertDialogDescription","AlertDialogFooter","AlertDialogCancel","AlertDialogAction"],"sources":["../../packages/components/dialogs/confirm-dialog.tsx"],"sourcesContent":["import { TriangleAlert } from 'lucide-react';\n\nimport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogTitle,\n} from '../ui/alert-dialog';\n\ntype Props = {\n  open?: boolean;\n  isLoading?: boolean;\n  title: string;\n  description: string;\n  cancelText?: string;\n  submitText?: string;\n  descriptionClassName?: string;\n  onOpenChange?: (open: boolean) => void;\n  onConfirm?: () => Promise<void> | void;\n};\n\nexport const ConfirmDialog: React.FC<React.PropsWithChildren<Props>> = ({\n  open,\n  isLoading = false,\n  title,\n  description,\n  cancelText,\n  submitText,\n  descriptionClassName,\n  onOpenChange,\n  onConfirm,\n}) => {\n  return (\n    <AlertDialog open={open} onOpenChange={onOpenChange}>\n      <AlertDialogContent className=\"p-4 pb-5\">\n        <AlertDialogHeader className=\"gap-2\">\n          <AlertDialogTitle className=\"inline-flex items-center gap-x-1\">\n            <TriangleAlert size={20} />\n            <p>{title}</p>\n          </AlertDialogTitle>\n          <AlertDialogDescription className={descriptionClassName}>{description}</AlertDialogDescription>\n        </AlertDialogHeader>\n        <AlertDialogFooter>\n          <AlertDialogCancel>{cancelText || 'Cancel'}</AlertDialogCancel>\n          <AlertDialogAction\n            type=\"button\"\n            className=\"min-h-9 w-full md:w-24\"\n            onClick={e => {\n              onConfirm?.();\n              e.preventDefault();\n              e.stopPropagation();\n            }}\n          >\n            {!isLoading ? (\n              submitText || 'Confirm'\n            ) : (\n              <div className=\"absolute inset-0 flex items-center justify-center\">\n                <div className=\"loader-spinner text-muted-foreground\" />\n              </div>\n            )}\n          </AlertDialogAction>\n        </AlertDialogFooter>\n      </AlertDialogContent>\n    </AlertDialog>\n  );\n};\n"],"mappings":"mQAyBA,MAAaA,GAA2D,CACtE,OACA,YAAY,GACZ,QACA,cACA,aACA,aACA,uBACA,eACA,gBAGE,EAAA,EAAA,KAACC,EAAAA,YAAAA,CAAkB,OAAoB,yBACrC,EAAA,EAAA,MAACC,EAAAA,mBAAAA,CAAmB,UAAU,sBAC5B,EAAA,EAAA,MAACC,EAAAA,kBAAAA,CAAkB,UAAU,mBAC3B,EAAA,EAAA,MAACC,EAAAA,iBAAAA,CAAiB,UAAU,8CAC1B,EAAA,EAAA,KAACC,EAAAA,cAAAA,CAAc,KAAM,GAAA,CAAM,EAC3B,EAAA,EAAA,KAAC,IAAA,CAAA,SAAG,EAAA,CAAU,CAAA,EACG,EACnB,EAAA,EAAA,KAACC,EAAAA,uBAAAA,CAAuB,UAAW,WAAuB,GAAqC,CAAA,EAC7E,EACpB,EAAA,EAAA,MAACC,EAAAA,kBAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,KAACC,EAAAA,kBAAAA,CAAAA,SAAmB,GAAc,SAAA,CAA6B,EAC/D,EAAA,EAAA,KAACC,EAAAA,kBAAAA,CACC,KAAK,SACL,UAAU,yBACV,QAAS,GAAK,CACZ,KAAa,CACb,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,WAGnB,GAGA,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,8DACb,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,uCAAA,CAAyC,EACpD,CAJN,GAAc,WAME,CAAA,CAAA,CACF,CAAA,EACD,EACT"}
+{"version":3,"file":"confirm-dialog.cjs","names":["ConfirmDialog: React.FC<ConfirmDialogProps>","AlertDialog","AlertDialogContent","AlertDialogHeader","AlertDialogTitle","TriangleAlert","AlertDialogDescription","AlertDialogFooter","AlertDialogCancel","AlertDialogAction"],"sources":["../../packages/components/dialogs/confirm-dialog.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback } from 'react';\nimport { TriangleAlert } from 'lucide-react';\nimport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogTitle,\n} from '../ui/alert-dialog';\n\n/**\n * Props for the {@link ConfirmDialog} component.\n */\nexport type ConfirmDialogProps = {\n  /**\n   * Controls whether the dialog is currently open.\n   * This is a **controlled** prop — pair it with `onOpenChange` to manage state.\n   */\n  open?: boolean;\n\n  /**\n   * When `true`, shows an animated spinner inside the confirm button and\n   * prevents double-submission. Typically bound to a mutation's pending state.\n   *\n   * @default false\n   */\n  isLoading?: boolean;\n\n  /**\n   * The dialog heading text. Keep it short and action-oriented,\n   * e.g. `\"Delete user?\"` or `\"Unsaved changes\"`.\n   */\n  title: string;\n\n  /**\n   * Body copy explaining what will happen if the user confirms.\n   * For irreversible actions, state explicitly that the action cannot be undone.\n   */\n  description: string;\n\n  /**\n   * Label for the cancel / dismiss button.\n   *\n   * @default \"Cancel\"\n   */\n  cancelText?: string;\n\n  /**\n   * Label for the confirm / submit button.\n   *\n   * @default \"Confirm\"\n   */\n  submitText?: string;\n\n  /**\n   * Additional class names applied to the `AlertDialogDescription` element.\n   * Useful for overriding text color or font size for specific contexts.\n   */\n  descriptionClassName?: string;\n\n  /**\n   * Callback fired when the dialog open state changes.\n   * Required to implement controlled open / close behavior.\n   *\n   * @param open - `true` when opening, `false` when closing.\n   */\n  onOpenChange?: (open: boolean) => void;\n\n  /**\n   * Async-safe callback fired when the user clicks the confirm button.\n   * Supports both synchronous and `Promise`-returning functions.\n   *\n   * The dialog does **not** auto-close after `onConfirm` resolves — the caller\n   * is responsible for setting `open` to `false` once the operation completes.\n   *\n   * @example\n   * ```tsx\n   * onConfirm={async () => {\n   *   await deleteUser(userId);\n   *   setOpen(false);\n   * }}\n   * ```\n   */\n  onConfirm?: () => Promise<void> | void;\n};\n\n/**\n * A controlled confirmation dialog for destructive or irreversible actions.\n *\n * Built on Radix UI's `AlertDialog` primitive. Renders a warning icon, title,\n * description, and Cancel / Confirm buttons. The confirm button supports an\n * async loading state to prevent double-submission.\n *\n * **Import:** `import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog'`\n *\n * @example Delete confirmation with React state\n * ```tsx\n * import { useState } from 'react';\n * import { Button } from '@customafk/lunas-ui/ui/button';\n * import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';\n *\n * export function DeleteUserButton({ userId }: { userId: string }) {\n *   const [open, setOpen] = useState(false);\n *   const [isPending, setIsPending] = useState(false);\n *\n *   const handleDelete = async () => {\n *     setIsPending(true);\n *     try {\n *       await deleteUser(userId);\n *       setOpen(false);\n *     } finally {\n *       setIsPending(false);\n *     }\n *   };\n *\n *   return (\n *     <>\n *       <Button variant=\"outline\" color=\"danger\" onClick={() => setOpen(true)}>\n *         Delete user\n *       </Button>\n *       <ConfirmDialog\n *         open={open}\n *         title=\"Delete user?\"\n *         description=\"This action is permanent and cannot be undone.\"\n *         submitText=\"Yes, delete\"\n *         isLoading={isPending}\n *         onOpenChange={setOpen}\n *         onConfirm={handleDelete}\n *       />\n *     </>\n *   );\n * }\n * ```\n *\n * @example With TanStack Query mutation\n * ```tsx\n * import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';\n * import { useMutation } from '@tanstack/react-query';\n *\n * export function ArchiveDialog({ open, onOpenChange, id }: Props) {\n *   const { mutateAsync, isPending } = useMutation({ mutationFn: archiveItem });\n *\n *   return (\n *     <ConfirmDialog\n *       open={open}\n *       title=\"Archive item?\"\n *       description=\"The item will be hidden but can be restored later.\"\n *       submitText=\"Archive\"\n *       isLoading={isPending}\n *       onOpenChange={onOpenChange}\n *       onConfirm={() => mutateAsync(id).then(() => onOpenChange(false))}\n *     />\n *   );\n * }\n * ```\n */\nexport const ConfirmDialog: React.FC<ConfirmDialogProps> = ({\n  open,\n  isLoading = false,\n  title,\n  description,\n  cancelText = 'Cancel',\n  submitText = 'Confirm',\n  descriptionClassName,\n  onOpenChange,\n  onConfirm,\n}) => {\n  const handleConfirm = useCallback(\n    (e: React.MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      onConfirm?.();\n    },\n    [onConfirm]\n  );\n\n  return (\n    <AlertDialog open={open} onOpenChange={onOpenChange}>\n      <AlertDialogContent className=\"p-4 pb-5\">\n        <AlertDialogHeader className=\"gap-2\">\n          <AlertDialogTitle className=\"inline-flex items-center gap-x-1\">\n            <TriangleAlert size={20} />\n            <p>{title}</p>\n          </AlertDialogTitle>\n          <AlertDialogDescription className={descriptionClassName}>{description}</AlertDialogDescription>\n        </AlertDialogHeader>\n        <AlertDialogFooter>\n          <AlertDialogCancel>{cancelText}</AlertDialogCancel>\n          <AlertDialogAction type=\"button\" className=\"min-h-9 w-full md:w-24\" onClick={handleConfirm}>\n            {isLoading ? (\n              <div className=\"absolute inset-0 flex items-center justify-center\">\n                <div className=\"loader-spinner text-text-positive-weak\" />\n              </div>\n            ) : (\n              submitText\n            )}\n          </AlertDialogAction>\n        </AlertDialogFooter>\n      </AlertDialogContent>\n    </AlertDialog>\n  );\n};\n"],"mappings":"mSAiKA,MAAaA,GAA+C,CAC1D,OACA,YAAY,GACZ,QACA,cACA,aAAa,SACb,aAAa,UACb,uBACA,eACA,eACI,CACJ,IAAM,GAAA,EAAA,EAAA,aACH,GAAwB,CACvB,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,CACnB,KAAa,EAEf,CAAC,EAAU,CACZ,CAED,OACE,EAAA,EAAA,KAACC,EAAAA,YAAAA,CAAkB,OAAoB,yBACrC,EAAA,EAAA,MAACC,EAAAA,mBAAAA,CAAmB,UAAU,sBAC5B,EAAA,EAAA,MAACC,EAAAA,kBAAAA,CAAkB,UAAU,mBAC3B,EAAA,EAAA,MAACC,EAAAA,iBAAAA,CAAiB,UAAU,8CAC1B,EAAA,EAAA,KAACC,EAAAA,cAAAA,CAAc,KAAM,GAAA,CAAM,EAC3B,EAAA,EAAA,KAAC,IAAA,CAAA,SAAG,EAAA,CAAU,CAAA,EACG,EACnB,EAAA,EAAA,KAACC,EAAAA,uBAAAA,CAAuB,UAAW,WAAuB,GAAqC,CAAA,EAC7E,EACpB,EAAA,EAAA,MAACC,EAAAA,kBAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,KAACC,EAAAA,kBAAAA,CAAAA,SAAmB,EAAA,CAA+B,EACnD,EAAA,EAAA,KAACC,EAAAA,kBAAAA,CAAkB,KAAK,SAAS,UAAU,yBAAyB,QAAS,WAC1E,GACC,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,8DACb,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,yCAAA,CAA2C,EACtD,CAEN,GAEgB,CAAA,CAAA,CACF,CAAA,EACD,EACT"}

package/dist/dialogs/confirm-dialog.d.cts

@@ -1,16 +1,142 @@
 //#region packages/components/dialogs/confirm-dialog.d.ts
-type Props = {
+/**
+ * Props for the {@link ConfirmDialog} component.
+ */
+type ConfirmDialogProps = {
+  /**
+   * Controls whether the dialog is currently open.
+   * This is a **controlled** prop — pair it with `onOpenChange` to manage state.
+   */
   open?: boolean;
+  /**
+   * When `true`, shows an animated spinner inside the confirm button and
+   * prevents double-submission. Typically bound to a mutation's pending state.
+   *
+   * @default false
+   */
   isLoading?: boolean;
+  /**
+   * The dialog heading text. Keep it short and action-oriented,
+   * e.g. `"Delete user?"` or `"Unsaved changes"`.
+   */
   title: string;
+  /**
+   * Body copy explaining what will happen if the user confirms.
+   * For irreversible actions, state explicitly that the action cannot be undone.
+   */
   description: string;
+  /**
+   * Label for the cancel / dismiss button.
+   *
+   * @default "Cancel"
+   */
   cancelText?: string;
+  /**
+   * Label for the confirm / submit button.
+   *
+   * @default "Confirm"
+   */
   submitText?: string;
+  /**
+   * Additional class names applied to the `AlertDialogDescription` element.
+   * Useful for overriding text color or font size for specific contexts.
+   */
   descriptionClassName?: string;
+  /**
+   * Callback fired when the dialog open state changes.
+   * Required to implement controlled open / close behavior.
+   *
+   * @param open - `true` when opening, `false` when closing.
+   */
   onOpenChange?: (open: boolean) => void;
+  /**
+   * Async-safe callback fired when the user clicks the confirm button.
+   * Supports both synchronous and `Promise`-returning functions.
+   *
+   * The dialog does **not** auto-close after `onConfirm` resolves — the caller
+   * is responsible for setting `open` to `false` once the operation completes.
+   *
+   * @example
+   * ```tsx
+   * onConfirm={async () => {
+   *   await deleteUser(userId);
+   *   setOpen(false);
+   * }}
+   * ```
+   */
   onConfirm?: () => Promise<void> | void;
 };
-declare const ConfirmDialog: React.FC<React.PropsWithChildren<Props>>;
+/**
+ * A controlled confirmation dialog for destructive or irreversible actions.
+ *
+ * Built on Radix UI's `AlertDialog` primitive. Renders a warning icon, title,
+ * description, and Cancel / Confirm buttons. The confirm button supports an
+ * async loading state to prevent double-submission.
+ *
+ * **Import:** `import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog'`
+ *
+ * @example Delete confirmation with React state
+ * ```tsx
+ * import { useState } from 'react';
+ * import { Button } from '@customafk/lunas-ui/ui/button';
+ * import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';
+ *
+ * export function DeleteUserButton({ userId }: { userId: string }) {
+ *   const [open, setOpen] = useState(false);
+ *   const [isPending, setIsPending] = useState(false);
+ *
+ *   const handleDelete = async () => {
+ *     setIsPending(true);
+ *     try {
+ *       await deleteUser(userId);
+ *       setOpen(false);
+ *     } finally {
+ *       setIsPending(false);
+ *     }
+ *   };
+ *
+ *   return (
+ *     <>
+ *       <Button variant="outline" color="danger" onClick={() => setOpen(true)}>
+ *         Delete user
+ *       </Button>
+ *       <ConfirmDialog
+ *         open={open}
+ *         title="Delete user?"
+ *         description="This action is permanent and cannot be undone."
+ *         submitText="Yes, delete"
+ *         isLoading={isPending}
+ *         onOpenChange={setOpen}
+ *         onConfirm={handleDelete}
+ *       />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @example With TanStack Query mutation
+ * ```tsx
+ * import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';
+ * import { useMutation } from '@tanstack/react-query';
+ *
+ * export function ArchiveDialog({ open, onOpenChange, id }: Props) {
+ *   const { mutateAsync, isPending } = useMutation({ mutationFn: archiveItem });
+ *
+ *   return (
+ *     <ConfirmDialog
+ *       open={open}
+ *       title="Archive item?"
+ *       description="The item will be hidden but can be restored later."
+ *       submitText="Archive"
+ *       isLoading={isPending}
+ *       onOpenChange={onOpenChange}
+ *       onConfirm={() => mutateAsync(id).then(() => onOpenChange(false))}
+ *     />
+ *   );
+ * }
+ * ```
+ */
+declare const ConfirmDialog: React.FC<ConfirmDialogProps>;
 //#endregion
-export { ConfirmDialog };
+export { ConfirmDialog, ConfirmDialogProps };
 //# sourceMappingURL=confirm-dialog.d.cts.map

package/dist/dialogs/confirm-dialog.d.mts

@@ -1,16 +1,142 @@
 //#region packages/components/dialogs/confirm-dialog.d.ts
-type Props = {
+/**
+ * Props for the {@link ConfirmDialog} component.
+ */
+type ConfirmDialogProps = {
+  /**
+   * Controls whether the dialog is currently open.
+   * This is a **controlled** prop — pair it with `onOpenChange` to manage state.
+   */
   open?: boolean;
+  /**
+   * When `true`, shows an animated spinner inside the confirm button and
+   * prevents double-submission. Typically bound to a mutation's pending state.
+   *
+   * @default false
+   */
   isLoading?: boolean;
+  /**
+   * The dialog heading text. Keep it short and action-oriented,
+   * e.g. `"Delete user?"` or `"Unsaved changes"`.
+   */
   title: string;
+  /**
+   * Body copy explaining what will happen if the user confirms.
+   * For irreversible actions, state explicitly that the action cannot be undone.
+   */
   description: string;
+  /**
+   * Label for the cancel / dismiss button.
+   *
+   * @default "Cancel"
+   */
   cancelText?: string;
+  /**
+   * Label for the confirm / submit button.
+   *
+   * @default "Confirm"
+   */
   submitText?: string;
+  /**
+   * Additional class names applied to the `AlertDialogDescription` element.
+   * Useful for overriding text color or font size for specific contexts.
+   */
   descriptionClassName?: string;
+  /**
+   * Callback fired when the dialog open state changes.
+   * Required to implement controlled open / close behavior.
+   *
+   * @param open - `true` when opening, `false` when closing.
+   */
   onOpenChange?: (open: boolean) => void;
+  /**
+   * Async-safe callback fired when the user clicks the confirm button.
+   * Supports both synchronous and `Promise`-returning functions.
+   *
+   * The dialog does **not** auto-close after `onConfirm` resolves — the caller
+   * is responsible for setting `open` to `false` once the operation completes.
+   *
+   * @example
+   * ```tsx
+   * onConfirm={async () => {
+   *   await deleteUser(userId);
+   *   setOpen(false);
+   * }}
+   * ```
+   */
   onConfirm?: () => Promise<void> | void;
 };
-declare const ConfirmDialog: React.FC<React.PropsWithChildren<Props>>;
+/**
+ * A controlled confirmation dialog for destructive or irreversible actions.
+ *
+ * Built on Radix UI's `AlertDialog` primitive. Renders a warning icon, title,
+ * description, and Cancel / Confirm buttons. The confirm button supports an
+ * async loading state to prevent double-submission.
+ *
+ * **Import:** `import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog'`
+ *
+ * @example Delete confirmation with React state
+ * ```tsx
+ * import { useState } from 'react';
+ * import { Button } from '@customafk/lunas-ui/ui/button';
+ * import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';
+ *
+ * export function DeleteUserButton({ userId }: { userId: string }) {
+ *   const [open, setOpen] = useState(false);
+ *   const [isPending, setIsPending] = useState(false);
+ *
+ *   const handleDelete = async () => {
+ *     setIsPending(true);
+ *     try {
+ *       await deleteUser(userId);
+ *       setOpen(false);
+ *     } finally {
+ *       setIsPending(false);
+ *     }
+ *   };
+ *
+ *   return (
+ *     <>
+ *       <Button variant="outline" color="danger" onClick={() => setOpen(true)}>
+ *         Delete user
+ *       </Button>
+ *       <ConfirmDialog
+ *         open={open}
+ *         title="Delete user?"
+ *         description="This action is permanent and cannot be undone."
+ *         submitText="Yes, delete"
+ *         isLoading={isPending}
+ *         onOpenChange={setOpen}
+ *         onConfirm={handleDelete}
+ *       />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @example With TanStack Query mutation
+ * ```tsx
+ * import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';
+ * import { useMutation } from '@tanstack/react-query';
+ *
+ * export function ArchiveDialog({ open, onOpenChange, id }: Props) {
+ *   const { mutateAsync, isPending } = useMutation({ mutationFn: archiveItem });
+ *
+ *   return (
+ *     <ConfirmDialog
+ *       open={open}
+ *       title="Archive item?"
+ *       description="The item will be hidden but can be restored later."
+ *       submitText="Archive"
+ *       isLoading={isPending}
+ *       onOpenChange={onOpenChange}
+ *       onConfirm={() => mutateAsync(id).then(() => onOpenChange(false))}
+ *     />
+ *   );
+ * }
+ * ```
+ */
+declare const ConfirmDialog: React.FC<ConfirmDialogProps>;
 //#endregion
-export { ConfirmDialog };
+export { ConfirmDialog, ConfirmDialogProps };
 //# sourceMappingURL=confirm-dialog.d.mts.map

package/dist/dialogs/confirm-dialog.mjs

@@ -1,2 +1,2 @@
-import"../heading-CrF1CFWS.mjs";import"../paragraph-DmiXlAnE.mjs";import"../button.variants-B_dFX3i2.mjs";import{AlertDialog as e,AlertDialogAction as t,AlertDialogCancel as n,AlertDialogContent as r,AlertDialogDescription as i,AlertDialogFooter as a,AlertDialogHeader as o,AlertDialogTitle as s}from"../ui/alert-dialog.mjs";import{jsx as c,jsxs as l}from"react/jsx-runtime";import{TriangleAlert as u}from"lucide-react";const d=({open:d,isLoading:f=!1,title:p,description:m,cancelText:h,submitText:g,descriptionClassName:_,onOpenChange:v,onConfirm:y})=>c(e,{open:d,onOpenChange:v,children:l(r,{className:`p-4 pb-5`,children:[l(o,{className:`gap-2`,children:[l(s,{className:`inline-flex items-center gap-x-1`,children:[c(u,{size:20}),c(`p`,{children:p})]}),c(i,{className:_,children:m})]}),l(a,{children:[c(n,{children:h||`Cancel`}),c(t,{type:`button`,className:`min-h-9 w-full md:w-24`,onClick:e=>{y?.(),e.preventDefault(),e.stopPropagation()},children:f?c(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:c(`div`,{className:`loader-spinner text-muted-foreground`})}):g||`Confirm`})]})]})});export{d as ConfirmDialog};
+"use client";import"../button.variants-DeCyas1F.mjs";import"../heading-DN67djxs.mjs";import"../paragraph-Ch5TvEqL.mjs";import{AlertDialog as e,AlertDialogAction as t,AlertDialogCancel as n,AlertDialogContent as r,AlertDialogDescription as i,AlertDialogFooter as a,AlertDialogHeader as o,AlertDialogTitle as s}from"../ui/alert-dialog.mjs";import{TriangleAlert as c}from"lucide-react";import{useCallback as l}from"react";import{jsx as u,jsxs as d}from"react/jsx-runtime";const f=({open:f,isLoading:p=!1,title:m,description:h,cancelText:g=`Cancel`,submitText:_=`Confirm`,descriptionClassName:v,onOpenChange:y,onConfirm:b})=>{let x=l(e=>{e.preventDefault(),e.stopPropagation(),b?.()},[b]);return u(e,{open:f,onOpenChange:y,children:d(r,{className:`p-4 pb-5`,children:[d(o,{className:`gap-2`,children:[d(s,{className:`inline-flex items-center gap-x-1`,children:[u(c,{size:20}),u(`p`,{children:m})]}),u(i,{className:v,children:h})]}),d(a,{children:[u(n,{children:g}),u(t,{type:`button`,className:`min-h-9 w-full md:w-24`,onClick:x,children:p?u(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:u(`div`,{className:`loader-spinner text-text-positive-weak`})}):_})]})]})})};export{f as ConfirmDialog};
 //# sourceMappingURL=confirm-dialog.mjs.map

package/dist/dialogs/confirm-dialog.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"confirm-dialog.mjs","names":["ConfirmDialog: React.FC<React.PropsWithChildren<Props>>"],"sources":["../../packages/components/dialogs/confirm-dialog.tsx"],"sourcesContent":["import { TriangleAlert } from 'lucide-react';\n\nimport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogTitle,\n} from '../ui/alert-dialog';\n\ntype Props = {\n  open?: boolean;\n  isLoading?: boolean;\n  title: string;\n  description: string;\n  cancelText?: string;\n  submitText?: string;\n  descriptionClassName?: string;\n  onOpenChange?: (open: boolean) => void;\n  onConfirm?: () => Promise<void> | void;\n};\n\nexport const ConfirmDialog: React.FC<React.PropsWithChildren<Props>> = ({\n  open,\n  isLoading = false,\n  title,\n  description,\n  cancelText,\n  submitText,\n  descriptionClassName,\n  onOpenChange,\n  onConfirm,\n}) => {\n  return (\n    <AlertDialog open={open} onOpenChange={onOpenChange}>\n      <AlertDialogContent className=\"p-4 pb-5\">\n        <AlertDialogHeader className=\"gap-2\">\n          <AlertDialogTitle className=\"inline-flex items-center gap-x-1\">\n            <TriangleAlert size={20} />\n            <p>{title}</p>\n          </AlertDialogTitle>\n          <AlertDialogDescription className={descriptionClassName}>{description}</AlertDialogDescription>\n        </AlertDialogHeader>\n        <AlertDialogFooter>\n          <AlertDialogCancel>{cancelText || 'Cancel'}</AlertDialogCancel>\n          <AlertDialogAction\n            type=\"button\"\n            className=\"min-h-9 w-full md:w-24\"\n            onClick={e => {\n              onConfirm?.();\n              e.preventDefault();\n              e.stopPropagation();\n            }}\n          >\n            {!isLoading ? (\n              submitText || 'Confirm'\n            ) : (\n              <div className=\"absolute inset-0 flex items-center justify-center\">\n                <div className=\"loader-spinner text-muted-foreground\" />\n              </div>\n            )}\n          </AlertDialogAction>\n        </AlertDialogFooter>\n      </AlertDialogContent>\n    </AlertDialog>\n  );\n};\n"],"mappings":"oaAyBA,MAAaA,GAA2D,CACtE,OACA,YAAY,GACZ,QACA,cACA,aACA,aACA,uBACA,eACA,eAGE,EAAC,EAAA,CAAkB,OAAoB,wBACrC,EAAC,EAAA,CAAmB,UAAU,qBAC5B,EAAC,EAAA,CAAkB,UAAU,kBAC3B,EAAC,EAAA,CAAiB,UAAU,6CAC1B,EAAC,EAAA,CAAc,KAAM,GAAA,CAAM,CAC3B,EAAC,IAAA,CAAA,SAAG,EAAA,CAAU,CAAA,EACG,CACnB,EAAC,EAAA,CAAuB,UAAW,WAAuB,GAAqC,CAAA,EAC7E,CACpB,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAA,SAAmB,GAAc,SAAA,CAA6B,CAC/D,EAAC,EAAA,CACC,KAAK,SACL,UAAU,yBACV,QAAS,GAAK,CACZ,KAAa,CACb,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,WAGnB,EAGA,EAAC,MAAA,CAAI,UAAU,6DACb,EAAC,MAAA,CAAI,UAAU,uCAAA,CAAyC,EACpD,CAJN,GAAc,WAME,CAAA,CAAA,CACF,CAAA,EACD,EACT"}
+{"version":3,"file":"confirm-dialog.mjs","names":["ConfirmDialog: React.FC<ConfirmDialogProps>"],"sources":["../../packages/components/dialogs/confirm-dialog.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback } from 'react';\nimport { TriangleAlert } from 'lucide-react';\nimport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogTitle,\n} from '../ui/alert-dialog';\n\n/**\n * Props for the {@link ConfirmDialog} component.\n */\nexport type ConfirmDialogProps = {\n  /**\n   * Controls whether the dialog is currently open.\n   * This is a **controlled** prop — pair it with `onOpenChange` to manage state.\n   */\n  open?: boolean;\n\n  /**\n   * When `true`, shows an animated spinner inside the confirm button and\n   * prevents double-submission. Typically bound to a mutation's pending state.\n   *\n   * @default false\n   */\n  isLoading?: boolean;\n\n  /**\n   * The dialog heading text. Keep it short and action-oriented,\n   * e.g. `\"Delete user?\"` or `\"Unsaved changes\"`.\n   */\n  title: string;\n\n  /**\n   * Body copy explaining what will happen if the user confirms.\n   * For irreversible actions, state explicitly that the action cannot be undone.\n   */\n  description: string;\n\n  /**\n   * Label for the cancel / dismiss button.\n   *\n   * @default \"Cancel\"\n   */\n  cancelText?: string;\n\n  /**\n   * Label for the confirm / submit button.\n   *\n   * @default \"Confirm\"\n   */\n  submitText?: string;\n\n  /**\n   * Additional class names applied to the `AlertDialogDescription` element.\n   * Useful for overriding text color or font size for specific contexts.\n   */\n  descriptionClassName?: string;\n\n  /**\n   * Callback fired when the dialog open state changes.\n   * Required to implement controlled open / close behavior.\n   *\n   * @param open - `true` when opening, `false` when closing.\n   */\n  onOpenChange?: (open: boolean) => void;\n\n  /**\n   * Async-safe callback fired when the user clicks the confirm button.\n   * Supports both synchronous and `Promise`-returning functions.\n   *\n   * The dialog does **not** auto-close after `onConfirm` resolves — the caller\n   * is responsible for setting `open` to `false` once the operation completes.\n   *\n   * @example\n   * ```tsx\n   * onConfirm={async () => {\n   *   await deleteUser(userId);\n   *   setOpen(false);\n   * }}\n   * ```\n   */\n  onConfirm?: () => Promise<void> | void;\n};\n\n/**\n * A controlled confirmation dialog for destructive or irreversible actions.\n *\n * Built on Radix UI's `AlertDialog` primitive. Renders a warning icon, title,\n * description, and Cancel / Confirm buttons. The confirm button supports an\n * async loading state to prevent double-submission.\n *\n * **Import:** `import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog'`\n *\n * @example Delete confirmation with React state\n * ```tsx\n * import { useState } from 'react';\n * import { Button } from '@customafk/lunas-ui/ui/button';\n * import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';\n *\n * export function DeleteUserButton({ userId }: { userId: string }) {\n *   const [open, setOpen] = useState(false);\n *   const [isPending, setIsPending] = useState(false);\n *\n *   const handleDelete = async () => {\n *     setIsPending(true);\n *     try {\n *       await deleteUser(userId);\n *       setOpen(false);\n *     } finally {\n *       setIsPending(false);\n *     }\n *   };\n *\n *   return (\n *     <>\n *       <Button variant=\"outline\" color=\"danger\" onClick={() => setOpen(true)}>\n *         Delete user\n *       </Button>\n *       <ConfirmDialog\n *         open={open}\n *         title=\"Delete user?\"\n *         description=\"This action is permanent and cannot be undone.\"\n *         submitText=\"Yes, delete\"\n *         isLoading={isPending}\n *         onOpenChange={setOpen}\n *         onConfirm={handleDelete}\n *       />\n *     </>\n *   );\n * }\n * ```\n *\n * @example With TanStack Query mutation\n * ```tsx\n * import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';\n * import { useMutation } from '@tanstack/react-query';\n *\n * export function ArchiveDialog({ open, onOpenChange, id }: Props) {\n *   const { mutateAsync, isPending } = useMutation({ mutationFn: archiveItem });\n *\n *   return (\n *     <ConfirmDialog\n *       open={open}\n *       title=\"Archive item?\"\n *       description=\"The item will be hidden but can be restored later.\"\n *       submitText=\"Archive\"\n *       isLoading={isPending}\n *       onOpenChange={onOpenChange}\n *       onConfirm={() => mutateAsync(id).then(() => onOpenChange(false))}\n *     />\n *   );\n * }\n * ```\n */\nexport const ConfirmDialog: React.FC<ConfirmDialogProps> = ({\n  open,\n  isLoading = false,\n  title,\n  description,\n  cancelText = 'Cancel',\n  submitText = 'Confirm',\n  descriptionClassName,\n  onOpenChange,\n  onConfirm,\n}) => {\n  const handleConfirm = useCallback(\n    (e: React.MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      onConfirm?.();\n    },\n    [onConfirm]\n  );\n\n  return (\n    <AlertDialog open={open} onOpenChange={onOpenChange}>\n      <AlertDialogContent className=\"p-4 pb-5\">\n        <AlertDialogHeader className=\"gap-2\">\n          <AlertDialogTitle className=\"inline-flex items-center gap-x-1\">\n            <TriangleAlert size={20} />\n            <p>{title}</p>\n          </AlertDialogTitle>\n          <AlertDialogDescription className={descriptionClassName}>{description}</AlertDialogDescription>\n        </AlertDialogHeader>\n        <AlertDialogFooter>\n          <AlertDialogCancel>{cancelText}</AlertDialogCancel>\n          <AlertDialogAction type=\"button\" className=\"min-h-9 w-full md:w-24\" onClick={handleConfirm}>\n            {isLoading ? (\n              <div className=\"absolute inset-0 flex items-center justify-center\">\n                <div className=\"loader-spinner text-text-positive-weak\" />\n              </div>\n            ) : (\n              submitText\n            )}\n          </AlertDialogAction>\n        </AlertDialogFooter>\n      </AlertDialogContent>\n    </AlertDialog>\n  );\n};\n"],"mappings":"qdAiKA,MAAaA,GAA+C,CAC1D,OACA,YAAY,GACZ,QACA,cACA,aAAa,SACb,aAAa,UACb,uBACA,eACA,eACI,CACJ,IAAM,EAAgB,EACnB,GAAwB,CACvB,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,CACnB,KAAa,EAEf,CAAC,EAAU,CACZ,CAED,OACE,EAAC,EAAA,CAAkB,OAAoB,wBACrC,EAAC,EAAA,CAAmB,UAAU,qBAC5B,EAAC,EAAA,CAAkB,UAAU,kBAC3B,EAAC,EAAA,CAAiB,UAAU,6CAC1B,EAAC,EAAA,CAAc,KAAM,GAAA,CAAM,CAC3B,EAAC,IAAA,CAAA,SAAG,EAAA,CAAU,CAAA,EACG,CACnB,EAAC,EAAA,CAAuB,UAAW,WAAuB,GAAqC,CAAA,EAC7E,CACpB,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAA,SAAmB,EAAA,CAA+B,CACnD,EAAC,EAAA,CAAkB,KAAK,SAAS,UAAU,yBAAyB,QAAS,WAC1E,EACC,EAAC,MAAA,CAAI,UAAU,6DACb,EAAC,MAAA,CAAI,UAAU,yCAAA,CAA2C,EACtD,CAEN,GAEgB,CAAA,CAAA,CACF,CAAA,EACD,EACT"}

package/dist/dialogs/detail-dialog/components/sidebar.cjs

@@ -1,2 +1 @@
-"use client";const e=require(`../../../chunk-Bmb41Sf3.cjs`);require(`../../../button.variants-aqkTmzFu.cjs`);const t=require(`../../../button-Cd7YtPlT.cjs`),n=require(`../../../skeleton-CHympz8k.cjs`),r=require(`../../../tooltip-DC6i1A25.cjs`),i=require(`../../../separator-C3ip6sbh.cjs`),a=require(`../../../sheet-5MJRtrfG.cjs`);let o=require(`@customafk/react-toolkit/utils`),s=require(`class-variance-authority`),c=require(`react/jsx-runtime`),l=require(`lucide-react`),u=require(`react`),d=require(`radix-ui`),f=require(`@customafk/react-toolkit/hooks/useMobile`);const p=`detai_dialog_sidebar_state`,m=3600*24*7,h=`20rem`,g=`18rem`,_=`3rem`,v=`p`,y=(0,u.createContext)(null);function b(){let e=(0,u.use)(y);if(!e)throw Error(`useSidebar must be used within a SidebarProvider.`);return e}function x({defaultOpen:e=!0,open:t,onOpenChange:n,className:i,style:a,children:s,...l}){let d=(0,f.useIsMobile)(),[p,m]=(0,u.useState)(!1),[h,g]=(0,u.useState)(e),_=t??h,v=(0,u.useCallback)(e=>{let t=typeof e==`function`?e(_):e;n?n(t):g(t),document.cookie=`detai_dialog_sidebar_state=${t}; path=/; max-age=604800`},[n,_]),b=(0,u.useCallback)(()=>d?m(e=>!e):v(e=>!e),[d,v]);(0,u.useEffect)(()=>{let e=e=>{e.key===`p`&&(e.metaKey||e.ctrlKey)&&(e.preventDefault(),b())};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[b]);let x=_?`expanded`:`collapsed`,S=(0,u.useMemo)(()=>({state:x,isMobile:d,toggleSidebar:b,open:_,setOpen:v,openMobile:p,setOpenMobile:m}),[x,d,_,v,p,b]);return(0,c.jsx)(y.Provider,{value:S,children:(0,c.jsx)(r.r,{delayDuration:0,children:(0,c.jsx)(`div`,{"data-slot":`sidebar-wrapper`,style:{"--sidebar-width":`20rem`,"--sidebar-width-icon":`3rem`,...a},className:(0,o.cn)(`group/sidebar-wrapper flex h-full min-h-[85dvh] w-full items-start has-data-[variant=inset]:bg-sidebar`,i),...l,children:s})})})}function S({side:e=`left`,variant:t=`sidebar`,collapsible:n=`offcanvas`,className:r,children:i,...s}){let{state:l,isMobile:u,openMobile:d,setOpenMobile:f}=b();return n===`none`?(0,c.jsx)(`div`,{"data-slot":`sidebar`,className:(0,o.cn)(`flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground`,r),...s,children:i}):u?(0,c.jsx)(a.t,{open:d,onOpenChange:f,...s,children:(0,c.jsxs)(a.r,{"data-sidebar":`sidebar`,"data-slot":`sidebar`,"data-mobile":`true`,className:`z-20 hidden w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground shadow-nav md:flex [&>button]:hidden`,style:{"--sidebar-width":`18rem`},side:e,children:[(0,c.jsxs)(a.o,{className:`sr-only`,children:[(0,c.jsx)(a.s,{children:`Sidebar`}),(0,c.jsx)(a.i,{children:`Displays the mobile sidebar.`})]}),(0,c.jsx)(`div`,{className:`flex h-full w-full flex-col`,children:i})]})}):(0,c.jsxs)(`div`,{className:`group peer hidden text-sidebar-foreground md:block`,"data-state":l,"data-collapsible":l===`collapsed`?n:``,"data-variant":t,"data-side":e,"data-slot":`sidebar`,children:[(0,c.jsx)(`div`,{"data-slot":`sidebar-gap`,className:(0,o.cn)(`relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear`,`group-data-[collapsible=offcanvas]:w-0`,`group-data-[side=right]:rotate-180`,t===`floating`||t===`inset`?`group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]`:`group-data-[collapsible=icon]:w-(--sidebar-width-icon)`)}),(0,c.jsx)(`div`,{"data-slot":`sidebar-container`,className:(0,o.cn)(`absolute inset-y-0 z-20 hidden w-(--sidebar-width) shadow-nav transition-[left,right,width] duration-200 ease-linear md:flex`,e===`left`?`left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]`:`right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]`,t===`floating`||t===`inset`?`p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]`:`group-data-[collapsible=icon]:w-(--sidebar-width-icon)`,r),...s,children:(0,c.jsx)(`div`,{"data-sidebar":`sidebar`,"data-slot":`sidebar-inner`,className:(0,o.cn)(`flex size-full flex-col shadow-nav`,`group-data-[variant=floating]:border-sidebar-border`,`group-data-[variant=floating]:rounded-lg`,`group-data-[variant=floating]:border`,`group-data-[variant=floating]:shadow-sm`),children:i})})]})}function C({className:e,onClick:n,...r}){let{toggleSidebar:i}=b();return(0,c.jsxs)(t.t,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`secondary`,size:`icon`,className:(0,o.cn)(`size-10 rounded-full [&_svg]:size-6!`,e),onClick:e=>{n?.(e),i()},...r,children:[(0,c.jsx)(l.MenuIcon,{}),(0,c.jsx)(`span`,{className:`sr-only`,children:`Toggle Sidebar`})]})}function w({className:e,...t}){let{toggleSidebar:n}=b();return(0,c.jsx)(`button`,{"data-sidebar":`rail`,"data-slot":`sidebar-rail`,"aria-label":`Toggle Sidebar`,tabIndex:-1,onClick:n,title:`Toggle Sidebar`,className:(0,o.cn)(`absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear sm:flex`,`after:absolute`,`after:inset-y-0`,`after:left-1/2 after:w-0.5`,`hover:after:bg-sidebar-border`,`group-data-[side=left]:-right-4`,`group-data-[side=right]:left-0`,`in-data-[side=left]:cursor-w-resize`,`in-data-[side=right]:cursor-e-resize`,`[[data-side=left][data-state=collapsed]_&]:cursor-e-resize`,`[[data-side=right][data-state=collapsed]_&]:cursor-w-resize`,`hover:group-data-[collapsible=offcanvas]:bg-sidebar`,`group-data-[collapsible=offcanvas]:translate-x-0`,`group-data-[collapsible=offcanvas]:after:left-full`,`[[data-side=left][data-collapsible=offcanvas]_&]:-right-2`,`[[data-side=right][data-collapsible=offcanvas]_&]:-left-2`,e),...t})}function T({className:e,...t}){return(0,c.jsx)(`main`,{"data-slot":`sidebar-inset`,className:(0,o.cn)(`relative flex w-full flex-1 flex-col bg-background`,`md:peer-data-[variant=inset]:m-2`,`md:peer-data-[variant=inset]:ml-0`,`md:peer-data-[variant=inset]:rounded-xl`,`md:peer-data-[variant=inset]:shadow-sm`,`md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2`,e),...t})}function E({className:e,...t}){return(0,c.jsx)(`div`,{"data-slot":`sidebar-header`,"data-sidebar":`header`,className:(0,o.cn)(`flex flex-col gap-2 p-2`,e),...t})}function D({className:e,children:t,...n}){let{open:r}=b();return(0,c.jsx)(`div`,{"data-slot":`sidebar-footer`,"data-sidebar":`footer`,className:(0,o.cn)(`flex flex-col gap-2 p-2`,e),...n,children:(0,c.jsxs)(P,{children:[r&&(0,c.jsx)(F,{children:t}),(0,c.jsx)(F,{children:(0,c.jsx)(`p`,{className:`pt-2 text-center text-muted-foreground text-xs`,children:`Copyright © 2025, Lunas.`})})]})})}function O({className:e,...t}){return(0,c.jsx)(i.t,{"data-slot":`sidebar-separator`,"data-sidebar":`separator`,className:(0,o.cn)(`mx-2 w-auto bg-sidebar-border`,e),...t})}function k({className:e,...t}){return(0,c.jsx)(`div`,{"data-slot":`sidebar-content`,"data-sidebar":`content`,className:(0,o.cn)(`flex min-h-0 flex-1 flex-col gap-2 overflow-auto`,`group-data-[collapsible=icon]:overflow-hidden`,e),...t})}function A({className:e,...t}){return(0,c.jsx)(`div`,{"data-slot":`sidebar-group`,"data-sidebar":`group`,className:(0,o.cn)(`relative flex w-full min-w-0 flex-col p-2`,e),...t})}function j({className:e,asChild:t=!1,...n}){return(0,c.jsx)(t?d.Slot.Slot:`div`,{"data-slot":`sidebar-group-label`,"data-sidebar":`group-label`,className:(0,o.cn)(`flex h-8 shrink-0 items-center rounded-md px-2 font-medium text-sidebar-foreground/70 text-xs outline-hidden ring-sidebar-ring transition-[margin,opacity] duration-200 ease-linear`,`focus-visible:ring-2`,`[&>svg]:size-4`,`[&>svg]:shrink-0`,`group-data-[collapsible=icon]:-mt-8`,`group-data-[collapsible=icon]:opacity-0`,e),...n})}function M({className:e,asChild:t=!1,...n}){return(0,c.jsx)(t?d.Slot.Slot:`button`,{"data-slot":`sidebar-group-action`,"data-sidebar":`group-action`,className:(0,o.cn)(`absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-hidden ring-sidebar-ring transition-transform`,`hover:bg-sidebar-accent hover:text-sidebar-accent-foreground`,`focus-visible:ring-2`,`[&>svg]:size-4`,`[&>svg]:shrink-0`,`after:absolute`,`after:-inset-2`,`md:after:hidden`,`group-data-[collapsible=icon]:hidden`,e),...n})}function N({className:e,...t}){return(0,c.jsx)(`div`,{"data-slot":`sidebar-group-content`,"data-sidebar":`group-content`,className:(0,o.cn)(`w-full text-sm`,e),...t})}function P({className:e,...t}){return(0,c.jsx)(`ul`,{"data-slot":`sidebar-menu`,"data-sidebar":`menu`,className:(0,o.cn)(`flex w-full min-w-0 flex-col gap-1`,e),...t})}function F({className:e,...t}){return(0,c.jsx)(`li`,{"data-slot":`sidebar-menu-item`,"data-sidebar":`menu-item`,className:(0,o.cn)(`group/menu-item relative`,e),...t})}const I=(0,s.cva)([`peer/menu-button`,`cursor-pointer`,`flex w-full items-center gap-2`,`overflow-hidden rounded-md p-2 outline-hidden`,`truncate text-left font-normal`,`transition-[color,width,height,padding]`,`hover:bg-sidebar-accent`,`hover:text-sidebar-accent-foreground`,`active:bg-sidebar-accent`,`active:text-sidebar-accent-foreground`,`disabled:pointer-events-none`,`disabled:opacity-50`,`group-has-data-[sidebar=menu-action]/menu-item:pr-8`,`aria-disabled:pointer-events-none`,`aria-disabled:opacity-50`,`data-[active=true]:bg-sidebar-primary-muted`,`data-[active=true]:font-normal`,`data-[active=true]:text-sidebar-primary`,`data-[state=open]:hover:bg-sidebar-accent`,`data-[state=open]:hover:text-sidebar-accent-foreground`,`group-data-[collapsible=icon]:size-8!`,`group-data-[collapsible=icon]:p-2!`,`[&>svg]:size-4`,`[&>svg]:shrink-0`,`[&>span:last-child]:truncate`],{variants:{variant:{default:`hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground/80`,outline:`bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]`},size:{default:`h-8 text-sm`,sm:`h-7 text-xs`,lg:`h-12 text-sm group-data-[collapsible=icon]:p-0!`}},defaultVariants:{variant:`default`,size:`default`}});function L({asChild:e=!1,isActive:t=!1,variant:n=`default`,size:i=`default`,tooltip:a,className:s,...l}){let u=e?d.Slot.Slot:`button`,{state:f}=b(),p=(0,c.jsx)(u,{"data-slot":`sidebar-menu-button`,"data-sidebar":`menu-button`,"data-size":i,"data-active":t,className:(0,o.cn)(I({variant:n,size:i}),s),...l});return a?(typeof a==`string`&&(a={children:a}),(0,c.jsxs)(r.t,{children:[(0,c.jsx)(r.i,{asChild:!0,children:p}),(0,c.jsx)(r.n,{side:`right`,align:`center`,hidden:f!==`collapsed`,...a})]})):p}function R({className:e,asChild:t=!1,showOnHover:n=!1,...r}){return(0,c.jsx)(t?d.Slot.Slot:`button`,{"data-slot":`sidebar-menu-action`,"data-sidebar":`menu-action`,className:(0,o.cn)(`text-sidebar-foreground ring-sidebar-ring`,`hover:bg-sidebar-accent`,`hover:text-sidebar-accent-foreground`,`absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform peer-hover/menu-button:text-sidebar-accent-foreground`,`focus-visible:ring-2`,`[&>svg]:size-4`,`[&>svg]:shrink-0`,`after:absolute after:-inset-2 md:after:hidden`,`peer-data-[size=sm]/menu-button:top-1`,`peer-data-[size=default]/menu-button:top-1.5`,`peer-data-[size=lg]/menu-button:top-2.5`,`group-data-[collapsible=icon]:hidden`,n&&`peer-data-[active=true]/menu-button:text-sidebar-accent-foreground`,n&&`$group-focus-within/menu-item:opacity-100`,n&&`group-hover/menu-item:opacity-100`,n&&`data-[state=open]:opacity-100 md:opacity-0`,e),...r})}function z({className:e,...t}){return(0,c.jsx)(`div`,{"data-slot":`sidebar-menu-badge`,"data-sidebar":`menu-badge`,className:(0,o.cn)(`pointer-events-none absolute right-1 flex h-5 min-w-5 select-none items-center justify-center rounded-md px-1 font-medium text-sidebar-foreground text-xs tabular-nums`,`peer-hover/menu-button:text-sidebar-accent-foreground`,`peer-data-[active=true]/menu-button:text-sidebar-accent-foreground`,`peer-data-[size=sm]/menu-button:top-1`,`peer-data-[size=default]/menu-button:top-1.5`,`peer-data-[size=lg]/menu-button:top-2.5`,`group-data-[collapsible=icon]:hidden`,e),...t})}function B({className:e,showIcon:t=!1,...r}){let i=(0,u.useMemo)(()=>`${Math.floor(Math.random()*40)+50}%`,[]);return(0,c.jsxs)(`div`,{"data-slot":`sidebar-menu-skeleton`,"data-sidebar":`menu-skeleton`,className:(0,o.cn)(`flex h-8 items-center gap-2 rounded-md px-2`,e),...r,children:[t&&(0,c.jsx)(n.t,{className:`size-4 rounded-md`,"data-sidebar":`menu-skeleton-icon`}),(0,c.jsx)(n.t,{className:`h-4 max-w-(--skeleton-width) flex-1`,"data-sidebar":`menu-skeleton-text`,style:{"--skeleton-width":i}})]})}function V({className:e,...t}){return(0,c.jsx)(`ul`,{"data-slot":`sidebar-menu-sub`,"data-sidebar":`menu-sub`,className:(0,o.cn)(`mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-sidebar-border border-l px-2.5 py-0.5`,`group-data-[collapsible=icon]:hidden`,e),...t})}function H({className:e,...t}){return(0,c.jsx)(`li`,{"data-slot":`sidebar-menu-sub-item`,"data-sidebar":`menu-sub-item`,className:(0,o.cn)(`group/menu-sub-item relative`,e),...t})}function U({asChild:e=!1,size:t=`md`,isActive:n=!1,className:r,...i}){return(0,c.jsx)(e?d.Slot.Slot:`a`,{"data-slot":`sidebar-menu-sub-button`,"data-sidebar":`menu-sub-button`,"data-size":t,"data-active":n,className:(0,o.cn)(`text-sidebar-foreground ring-sidebar-ring`,`flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden`,`hover:bg-sidebar-accent`,`hover:text-sidebar-accent-foreground`,`active:bg-sidebar-accent`,`active:text-sidebar-accent-foreground`,`focus-visible:ring-2`,`disabled:pointer-events-none`,`disabled:opacity-50`,`aria-disabled:pointer-events-none`,`aria-disabled:opacity-50`,`[&>span:last-child]:truncate`,`[&>svg]:size-4`,`[&>svg]:shrink-0`,`[&>svg]:text-sidebar-accent-foreground`,`data-[active=true]:bg-sidebar-accent`,`data-[active=true]:text-sidebar-accent-foreground`,`group-data-[collapsible=icon]:hidden`,t===`sm`&&`text-xs`,t===`md`&&`text-sm`,r),...i})}exports.DetailDialogSidebarContent=k,exports.DetailDialogSidebarFooter=D,exports.DetailDialogSidebarGroup=A,exports.DetailDialogSidebarGroupAction=M,exports.DetailDialogSidebarGroupContent=N,exports.DetailDialogSidebarGroupLabel=j,exports.DetailDialogSidebarHeader=E,exports.DetailDialogSidebarMenu=P,exports.DetailDialogSidebarMenuAction=R,exports.DetailDialogSidebarMenuBadge=z,exports.DetailDialogSidebarMenuButton=L,exports.DetailDialogSidebarMenuItem=F,exports.DetailDialogSidebarMenuSkeleton=B,exports.DetailDialogSidebarMenuSub=V,exports.DetailDialogSidebarMenuSubButton=U,exports.DetailDialogSidebarMenuSubItem=H,exports.DetailDialogSidebarRail=w,exports.DetailDialogSidebarSeparator=O,exports.DetailDialogSidebarTrigger=C,exports.Sidebar=S,exports.SidebarInset=T,exports.SidebarProvider=x,exports.useSidebar=b;
-//# sourceMappingURL=sidebar.cjs.map
+"use client";require(`../../../button.variants-tnhb123u.cjs`),require(`../../../button-CwDT3m4m.cjs`),require(`../../../skeleton-BfMCjXYM.cjs`),require(`../../../tooltip-itUmYz9k.cjs`),require(`../../../separator-BwZb12bh.cjs`),require(`../../../sheet-CaDXTx7n.cjs`);const e=require(`../../../sidebar-C27_pwLR.cjs`);exports.DetailDialogSidebarContent=e.t,exports.DetailDialogSidebarFooter=e.n,exports.DetailDialogSidebarGroup=e.r,exports.DetailDialogSidebarGroupAction=e.i,exports.DetailDialogSidebarGroupContent=e.a,exports.DetailDialogSidebarGroupLabel=e.o,exports.DetailDialogSidebarHeader=e.s,exports.DetailDialogSidebarMenu=e.c,exports.DetailDialogSidebarMenuAction=e.l,exports.DetailDialogSidebarMenuBadge=e.u,exports.DetailDialogSidebarMenuButton=e.d,exports.DetailDialogSidebarMenuItem=e.f,exports.DetailDialogSidebarMenuSkeleton=e.p,exports.DetailDialogSidebarMenuSub=e.m,exports.DetailDialogSidebarMenuSubButton=e.h,exports.DetailDialogSidebarMenuSubItem=e.g,exports.DetailDialogSidebarRail=e._,exports.DetailDialogSidebarSeparator=e.v,exports.DetailDialogSidebarTrigger=e.y,exports.Sidebar=e.b,exports.SidebarInset=e.x,exports.SidebarProvider=e.S,exports.useSidebar=e.C;