@customafk/lunas-ui 0.2.80 → 0.2.82

package/dist/ui/dialog.mjs

@@ -1,2 +1,2 @@
-"use client";import{t as e}from"../heading-Fajfx88p.mjs";import{paragraphVariants as t}from"../typography/paragraph.mjs";import{t as n}from"../close-DYJZ8fkh.mjs";import{cn as r}from"@customafk/react-toolkit/utils";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{Dialog as o}from"radix-ui";function s({...e}){return i(o.Root,{"data-slot":`dialog`,...e})}function c({...e}){return i(o.Trigger,{"data-slot":`dialog-trigger`,...e})}function l({...e}){return i(o.Portal,{"data-slot":`dialog-portal`,...e})}function u({...e}){return i(o.Close,{"data-slot":`dialog-close`,...e})}function d({className:e,...t}){return i(o.Overlay,{"data-slot":`dialog-overlay`,className:r(`fixed inset-0 z-50 bg-black/50`,`data-[state=open]:fade-in-0 data-[state=open]:animate-in`,`data-[state=closed]:fade-out-0 data-[state=closed]:animate-out`,e),...t})}function f({className:e,children:t,showCloseButton:s=!0,...c}){return a(l,{children:[i(d,{}),a(o.Content,{"data-slot":`dialog-content`,className:r(`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-400`,`sm:max-w-lg`,`data-[state=open]:fade-in-0 data-[state=open]:zoom-in-80 data-[state=open]:animate-in`,`data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-80 data-[state=closed]:animate-out`,e),onOpenAutoFocus:e=>{e.preventDefault()},...c,children:[t,s&&i(o.Close,{"data-slot":`dialog-close`,tabIndex:-1,asChild:!0,className:`absolute top-3 right-3`,children:i(n,{})})]})]})}function p({className:e,...t}){return i(`div`,{"data-slot":`dialog-header`,className:r(`flex flex-col gap-2 text-center sm:text-left`,e),...t})}function m({className:e,...t}){return i(`div`,{"data-slot":`dialog-footer`,className:r(`flex flex-col-reverse gap-2 sm:flex-row sm:justify-end`,e),...t})}function h({className:t,...n}){return i(o.Title,{"data-slot":`dialog-title`,className:r(e({level:`h3`}),t),...n})}function g({className:e,...n}){return i(o.Description,{"data-slot":`dialog-description`,className:r(t({variant:`muted`}),e),...n})}export{s as Dialog,u as DialogClose,f as DialogContent,g as DialogDescription,m as DialogFooter,p as DialogHeader,d as DialogOverlay,l as DialogPortal,h as DialogTitle,c as DialogTrigger};
+"use client";import{t as e}from"../heading-Fajfx88p.mjs";import{paragraphVariants as t}from"../typography/paragraph.mjs";import{t as n}from"../close-DYJZ8fkh.mjs";import{cn as r}from"@customafk/react-toolkit/utils";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{Dialog as o}from"radix-ui";function s({...e}){return i(o.Root,{"data-slot":`dialog`,...e})}function c({...e}){return i(o.Trigger,{"data-slot":`dialog-trigger`,...e})}function l({...e}){return i(o.Portal,{"data-slot":`dialog-portal`,...e})}function u({...e}){return i(o.Close,{"data-slot":`dialog-close`,...e})}function d({className:e,...t}){return i(o.Overlay,{"data-slot":`dialog-overlay`,className:r(`fixed inset-0 z-50 bg-black/50`,`data-[state=open]:fade-in-0 data-[state=open]:animate-in`,`data-[state=closed]:fade-out-0 data-[state=closed]:animate-out`,e),...t})}function f({className:e,children:t,showCloseButton:s=!0,...c}){return a(l,{children:[i(d,{}),a(o.Content,{"data-slot":`dialog-content`,className:r(`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-400`,`sm:max-w-lg`,`data-[state=open]:fade-in-0 data-[state=open]:zoom-in-80 data-[state=open]:animate-in`,`data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-80 data-[state=closed]:animate-out`,e),onOpenAutoFocus:e=>{e.preventDefault()},...c,children:[t,s&&i(o.Close,{"data-slot":`dialog-close`,tabIndex:-1,asChild:!0,className:`absolute top-3 right-3`,children:i(n,{})})]})]})}function p({className:e,...t}){return i(`div`,{"data-slot":`dialog-header`,className:r(`flex flex-col gap-1 text-center sm:text-left`,e),...t})}function m({className:e,...t}){return i(`div`,{"data-slot":`dialog-footer`,className:r(`flex flex-col-reverse gap-2 sm:flex-row sm:justify-end`,e),...t})}function h({className:t,...n}){return i(o.Title,{"data-slot":`dialog-title`,className:r(e({level:`h3`}),t),...n})}function g({className:e,...n}){return i(o.Description,{"data-slot":`dialog-description`,className:r(t({variant:`muted`}),`not-first:mt-0 md:text-sm`,e),...n})}export{s as Dialog,u as DialogClose,f as DialogContent,g as DialogDescription,m as DialogFooter,p as DialogHeader,d as DialogOverlay,l as DialogPortal,h as DialogTitle,c as DialogTrigger};
 //# sourceMappingURL=dialog.mjs.map

package/dist/ui/dialog.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.mjs","names":["DialogPrimitive"],"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 { headingVariants } from '../typography/heading';\nimport { paragraphVariants } from '../typography/paragraph';\nimport { CloseButton } from './buttons/close';\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]:fade-in-0 data-[state=open]:animate-in',\n        'data-[state=closed]:fade-out-0 data-[state=closed]:animate-out',\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-400',\n          'sm:max-w-lg',\n          'data-[state=open]:fade-in-0 data-[state=open]:zoom-in-80 data-[state=open]:animate-in',\n          'data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-80 data-[state=closed]:animate-out',\n          className\n        )}\n        onOpenAutoFocus={event => {\n          // Prevents focus from shifting to the content when the dialog opens, which can cause layout shift if the content includes autofocusable elements.\n          event.preventDefault();\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":"2SAqCA,SAAS,EAAO,CAAE,GAAG,GAA4D,CAC/E,OAAO,EAACA,EAAgB,KAAjB,CAAsB,YAAU,SAAS,GAAI,CAAQ,CAAA,CAC9D,CAGA,SAAS,EAAc,CAAE,GAAG,GAA+D,CACzF,OAAO,EAACA,EAAgB,QAAjB,CAAyB,YAAU,iBAAiB,GAAI,CAAQ,CAAA,CACzE,CAGA,SAAS,EAAa,CAAE,GAAG,GAA8D,CACvF,OAAO,EAACA,EAAgB,OAAjB,CAAwB,YAAU,gBAAgB,GAAI,CAAQ,CAAA,CACvE,CAGA,SAAS,EAAY,CAAE,GAAG,GAA6D,CACrF,OAAO,EAACA,EAAgB,MAAjB,CAAuB,YAAU,eAAe,GAAI,CAAQ,CAAA,CACrE,CAGA,SAAS,EAAc,CAAE,YAAW,GAAG,GAA+D,CACpG,OACE,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EACT,iCACA,2DACA,iEACA,CACF,EACA,GAAI,CACL,CAAA,CAEL,CAOA,SAAS,EAAc,CACrB,YACA,WACA,kBAAkB,GAClB,GAAG,GAIF,CACD,OACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,CAAA,EAChB,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EACT,gEACA,oDACA,8EACA,cACA,wFACA,iGACA,CACF,EACA,gBAAiB,GAAS,CAExB,EAAM,eAAe,CACvB,EACA,GAAI,EAfN,SAAA,CAiBG,EACA,GACC,EAACA,EAAgB,MAAjB,CAAuB,YAAU,eAAe,SAAU,GAAI,QAAA,GAAQ,UAAU,yBAC9E,SAAA,EAAC,EAAD,CAAc,CAAA,CACO,CAAA,CAEF,CACb,CAAA,CAAA,CAAA,CAAA,CAElB,CAGA,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OAAO,EAAC,MAAD,CAAK,YAAU,gBAAgB,UAAW,EAAG,+CAAgD,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC9H,CAGA,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OAAO,EAAC,MAAD,CAAK,YAAU,gBAAgB,UAAW,EAAG,yDAA0D,CAAS,EAAG,GAAI,CAAQ,CAAA,CACxI,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAA6D,CAChG,OAAO,EAACA,EAAgB,MAAjB,CAAuB,YAAU,eAAe,UAAW,EAAG,EAAgB,CAAE,MAAO,IAAK,CAAC,EAAG,CAAS,EAAG,GAAI,CAAQ,CAAA,CACjI,CAGA,SAAS,EAAkB,CAAE,YAAW,GAAG,GAAmE,CAC5G,OAAO,EAACA,EAAgB,YAAjB,CAA6B,YAAU,qBAAqB,UAAW,EAAG,EAAkB,CAAE,QAAS,OAAQ,CAAC,EAAG,CAAS,EAAG,GAAI,CAAQ,CAAA,CACpJ"}
+{"version":3,"file":"dialog.mjs","names":["DialogPrimitive"],"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 { headingVariants } from '../typography/heading';\nimport { paragraphVariants } from '../typography/paragraph';\nimport { CloseButton } from './buttons/close';\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]:fade-in-0 data-[state=open]:animate-in',\n        'data-[state=closed]:fade-out-0 data-[state=closed]:animate-out',\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-400',\n          'sm:max-w-lg',\n          'data-[state=open]:fade-in-0 data-[state=open]:zoom-in-80 data-[state=open]:animate-in',\n          'data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-80 data-[state=closed]:animate-out',\n          className\n        )}\n        onOpenAutoFocus={event => {\n          // Prevents focus from shifting to the content when the dialog opens, which can cause layout shift if the content includes autofocusable elements.\n          event.preventDefault();\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-1 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 (\n    <DialogPrimitive.Description\n      data-slot=\"dialog-description\"\n      className={cn(paragraphVariants({ variant: 'muted' }), 'not-first:mt-0 md:text-sm', className)}\n      {...props}\n    />\n  );\n}\n\nexport { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };\n"],"mappings":"2SAqCA,SAAS,EAAO,CAAE,GAAG,GAA4D,CAC/E,OAAO,EAACA,EAAgB,KAAjB,CAAsB,YAAU,SAAS,GAAI,CAAQ,CAAA,CAC9D,CAGA,SAAS,EAAc,CAAE,GAAG,GAA+D,CACzF,OAAO,EAACA,EAAgB,QAAjB,CAAyB,YAAU,iBAAiB,GAAI,CAAQ,CAAA,CACzE,CAGA,SAAS,EAAa,CAAE,GAAG,GAA8D,CACvF,OAAO,EAACA,EAAgB,OAAjB,CAAwB,YAAU,gBAAgB,GAAI,CAAQ,CAAA,CACvE,CAGA,SAAS,EAAY,CAAE,GAAG,GAA6D,CACrF,OAAO,EAACA,EAAgB,MAAjB,CAAuB,YAAU,eAAe,GAAI,CAAQ,CAAA,CACrE,CAGA,SAAS,EAAc,CAAE,YAAW,GAAG,GAA+D,CACpG,OACE,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EACT,iCACA,2DACA,iEACA,CACF,EACA,GAAI,CACL,CAAA,CAEL,CAOA,SAAS,EAAc,CACrB,YACA,WACA,kBAAkB,GAClB,GAAG,GAIF,CACD,OACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,CAAA,EAChB,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EACT,gEACA,oDACA,8EACA,cACA,wFACA,iGACA,CACF,EACA,gBAAiB,GAAS,CAExB,EAAM,eAAe,CACvB,EACA,GAAI,EAfN,SAAA,CAiBG,EACA,GACC,EAACA,EAAgB,MAAjB,CAAuB,YAAU,eAAe,SAAU,GAAI,QAAA,GAAQ,UAAU,yBAC9E,SAAA,EAAC,EAAD,CAAc,CAAA,CACO,CAAA,CAEF,CACb,CAAA,CAAA,CAAA,CAAA,CAElB,CAGA,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OAAO,EAAC,MAAD,CAAK,YAAU,gBAAgB,UAAW,EAAG,+CAAgD,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC9H,CAGA,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OAAO,EAAC,MAAD,CAAK,YAAU,gBAAgB,UAAW,EAAG,yDAA0D,CAAS,EAAG,GAAI,CAAQ,CAAA,CACxI,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAA6D,CAChG,OAAO,EAACA,EAAgB,MAAjB,CAAuB,YAAU,eAAe,UAAW,EAAG,EAAgB,CAAE,MAAO,IAAK,CAAC,EAAG,CAAS,EAAG,GAAI,CAAQ,CAAA,CACjI,CAGA,SAAS,EAAkB,CAAE,YAAW,GAAG,GAAmE,CAC5G,OACE,EAACA,EAAgB,YAAjB,CACE,YAAU,qBACV,UAAW,EAAG,EAAkB,CAAE,QAAS,OAAQ,CAAC,EAAG,4BAA6B,CAAS,EAC7F,GAAI,CACL,CAAA,CAEL"}

package/dist/ui/resizable.d.cts

@@ -1,2 +1,2 @@
-import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-CWmitx5U.cjs";
+import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-C3uADYIg.cjs";
 export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

package/dist/ui/resizable.d.mts

@@ -1,2 +1,2 @@
-import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-CWmitx5U.mjs";
+import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-C3uADYIg.mjs";
 export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

package/dist/ui/sheet.cjs

@@ -1,2 +1,2 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("lucide-react"),t=require("@customafk/react-toolkit/utils"),n=require("react/jsx-runtime"),r=require("radix-ui");function i({...e}){return(0,n.jsx)(r.Dialog.Root,{"data-slot":`sheet`,...e})}function a({...e}){return(0,n.jsx)(r.Dialog.Trigger,{"data-slot":`sheet-trigger`,...e})}function o({...e}){return(0,n.jsx)(r.Dialog.Close,{"data-slot":`sheet-close`,...e})}function s({...e}){return(0,n.jsx)(r.Dialog.Portal,{"data-slot":`sheet-portal`,...e})}function c({className:e,...i}){return(0,n.jsx)(r.Dialog.Overlay,{"data-slot":`sheet-overlay`,className:(0,t.cn)(`fixed inset-0 z-50 bg-black/50`,`data-[state=open]:animate-in`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=open]:fade-in-0`,e),...i})}function l({className:i,children:a,side:o=`right`,...l}){return(0,n.jsxs)(s,{children:[(0,n.jsx)(c,{}),(0,n.jsxs)(r.Dialog.Content,{"data-slot":`sheet-content`,className:(0,t.cn)(`bg-background`,`fixed z-50 flex flex-col gap-4 border-border-weak shadow-dropdown transition ease-in-out`,`data-[state=open]:animate-in`,`data-[state=open]:duration-500`,`data-[state=closed]:animate-out`,`data-[state=closed]:duration-300`,o===`right`&&`inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm`,o===`right`&&`data-[state=closed]:slide-out-to-right`,o===`right`&&`data-[state=open]:slide-in-from-right`,o===`left`&&`inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm`,o===`left`&&`data-[state=closed]:slide-out-to-left`,o===`left`&&`data-[state=open]:slide-in-from-left`,o===`top`&&`inset-x-0 top-0 h-auto border-b`,o===`top`&&`data-[state=closed]:slide-out-to-top`,o===`top`&&`data-[state=open]:slide-in-from-top`,o===`bottom`&&`inset-x-0 bottom-0 h-auto border-t`,o===`bottom`&&`data-[state=closed]:slide-out-to-bottom`,o===`bottom`&&`data-[state=open]:slide-in-from-bottom`,i),...l,children:[a,(0,n.jsxs)(r.Dialog.Close,{className:(0,t.cn)(`cursor-pointer p-2 ring-offset-background`,`absolute top-2 right-2 rounded-full opacity-70 transition-opacity`,`data-[state=open]:bg-secondary`,`disabled:pointer-events-none`,`hover:opacity-100`,`hover:bg-border-muted`,`focus:ring-border-weak`,`focus:ring-4`,`focus:outline-hidden`),children:[(0,n.jsx)(e.XIcon,{className:`size-5`}),(0,n.jsx)(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function u({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`sheet-header`,className:(0,t.cn)(`flex flex-0 flex-col gap-1.5 p-4`,e),...r})}function d({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`sheet-footer`,className:(0,t.cn)(`mt-auto flex flex-0 flex-col gap-2 p-4`,e),...r})}function f({className:e,...i}){return(0,n.jsx)(r.Dialog.Title,{"data-slot":`sheet-title`,className:(0,t.cn)(`font-semibold text-text-positive-strong`,e),...i})}function p({className:e,...i}){return(0,n.jsx)(r.Dialog.Description,{"data-slot":`sheet-description`,className:(0,t.cn)(`text-sm text-text-positive-weak`,e),...i})}exports.Sheet=i,exports.SheetClose=o,exports.SheetContent=l,exports.SheetDescription=p,exports.SheetFooter=d,exports.SheetHeader=u,exports.SheetTitle=f,exports.SheetTrigger=a;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("lucide-react"),t=require("@customafk/react-toolkit/utils"),n=require("react/jsx-runtime"),r=require("radix-ui");function i({...e}){return(0,n.jsx)(r.Dialog.Root,{"data-slot":`sheet`,...e})}function a({...e}){return(0,n.jsx)(r.Dialog.Trigger,{"data-slot":`sheet-trigger`,...e})}function o({...e}){return(0,n.jsx)(r.Dialog.Close,{"data-slot":`sheet-close`,...e})}function s({...e}){return(0,n.jsx)(r.Dialog.Portal,{"data-slot":`sheet-portal`,...e})}function c({className:e,...i}){return(0,n.jsx)(r.Dialog.Overlay,{"data-slot":`sheet-overlay`,className:(0,t.cn)(`fixed inset-0 z-50 bg-black/50`,`data-[state=open]:animate-in`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=open]:fade-in-0`,e),...i})}function l({className:i,children:a,side:o=`right`,...l}){return(0,n.jsxs)(s,{children:[(0,n.jsx)(c,{}),(0,n.jsxs)(r.Dialog.Content,{"data-slot":`sheet-content`,className:(0,t.cn)(`bg-background`,`fixed z-50 flex flex-col gap-4 border-border-weak shadow-dropdown transition ease-in-out`,`data-[state=open]:animate-in`,`data-[state=open]:duration-500`,`data-[state=closed]:animate-out`,`data-[state=closed]:duration-300`,o===`right`&&`inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm`,o===`right`&&`data-[state=closed]:slide-out-to-right`,o===`right`&&`data-[state=open]:slide-in-from-right`,o===`left`&&`inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm`,o===`left`&&`data-[state=closed]:slide-out-to-left`,o===`left`&&`data-[state=open]:slide-in-from-left`,o===`top`&&`inset-x-0 top-0 h-auto border-b`,o===`top`&&`data-[state=closed]:slide-out-to-top`,o===`top`&&`data-[state=open]:slide-in-from-top`,o===`bottom`&&`inset-x-0 bottom-0 h-auto border-t`,o===`bottom`&&`data-[state=closed]:slide-out-to-bottom`,o===`bottom`&&`data-[state=open]:slide-in-from-bottom`,i),...l,children:[a,(0,n.jsxs)(r.Dialog.Close,{className:(0,t.cn)(`cursor-pointer p-2 ring-offset-background`,`absolute top-2 right-2 rounded-full opacity-70 transition-opacity`,`data-[state=open]:bg-secondary`,`disabled:pointer-events-none`,`hover:opacity-100`,`hover:bg-border-muted`,`focus:ring-border-weak`,`focus:ring-4`,`focus:outline-hidden`),children:[(0,n.jsx)(e.XIcon,{className:`size-5`}),(0,n.jsx)(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function u({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`sheet-header`,className:(0,t.cn)(`flex flex-0 flex-col gap-1 p-4`,e),...r})}function d({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`sheet-footer`,className:(0,t.cn)(`mt-auto flex flex-0 flex-col gap-2 p-4`,e),...r})}function f({className:e,...i}){return(0,n.jsx)(r.Dialog.Title,{"data-slot":`sheet-title`,className:(0,t.cn)(`font-semibold text-text-positive-strong`,e),...i})}function p({className:e,...i}){return(0,n.jsx)(r.Dialog.Description,{"data-slot":`sheet-description`,className:(0,t.cn)(`text-sm text-text-positive-weak`,e),...i})}exports.Sheet=i,exports.SheetClose=o,exports.SheetContent=l,exports.SheetDescription=p,exports.SheetFooter=d,exports.SheetHeader=u,exports.SheetTitle=f,exports.SheetTrigger=a;
 //# sourceMappingURL=sheet.cjs.map

package/dist/ui/sheet.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.cjs","names":["SheetPrimitive","XIcon"],"sources":["../../packages/components/ui/sheet.tsx"],"sourcesContent":["'use client';\n\nimport { XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Dialog as SheetPrimitive } from 'radix-ui';\n\n/**\n * Root provider for the Sheet panel — wraps all Sheet sub-components and manages open state.\n *\n * @example\n * ```tsx\n * import { Sheet, SheetTrigger, SheetContent, SheetHeader, SheetTitle, SheetDescription } from '@customafk/lunas-ui/ui/sheet';\n *\n * <Sheet>\n *   <SheetTrigger>Open</SheetTrigger>\n *   <SheetContent side=\"right\">\n *     <SheetHeader>\n *       <SheetTitle>Settings</SheetTitle>\n *       <SheetDescription>Manage your preferences.</SheetDescription>\n *     </SheetHeader>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nfunction Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />;\n}\n\n/** Button or element that opens the Sheet when interacted with. */\nfunction SheetTrigger({ ...props }: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />;\n}\n\n/** Button that programmatically closes the Sheet. */\nfunction SheetClose({ ...props }: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />;\n}\n\n/** Portals Sheet content outside the current DOM hierarchy. */\nfunction SheetPortal({ ...props }: React.ComponentProps<typeof SheetPrimitive.Portal>) {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />;\n}\n\n/** Semi-transparent backdrop rendered behind the Sheet panel. */\nfunction SheetOverlay({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Overlay>) {\n  return (\n    <SheetPrimitive.Overlay\n      data-slot=\"sheet-overlay\"\n      className={cn(\n        'fixed inset-0 z-50 bg-black/50',\n        'data-[state=open]:animate-in',\n        'data-[state=closed]:animate-out',\n        'data-[state=closed]:fade-out-0',\n        'data-[state=open]:fade-in-0',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * The sliding panel itself; renders on the specified `side` of the viewport and includes a built-in close button.\n */\nfunction SheetContent({\n  className,\n  children,\n  side = 'right',\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n  /** Edge of the viewport from which the sheet slides in. */\n  side?: 'top' | 'right' | 'bottom' | 'left';\n}) {\n  return (\n    <SheetPortal>\n      <SheetOverlay />\n      <SheetPrimitive.Content\n        data-slot=\"sheet-content\"\n        className={cn(\n          'bg-background',\n          'fixed z-50 flex flex-col gap-4 border-border-weak shadow-dropdown transition ease-in-out',\n\n          'data-[state=open]:animate-in',\n          'data-[state=open]:duration-500',\n          'data-[state=closed]:animate-out',\n          'data-[state=closed]:duration-300',\n\n          side === 'right' && 'inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm',\n          side === 'right' && 'data-[state=closed]:slide-out-to-right',\n          side === 'right' && 'data-[state=open]:slide-in-from-right',\n\n          side === 'left' && 'inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm',\n          side === 'left' && 'data-[state=closed]:slide-out-to-left',\n          side === 'left' && 'data-[state=open]:slide-in-from-left',\n\n          side === 'top' && 'inset-x-0 top-0 h-auto border-b',\n          side === 'top' && 'data-[state=closed]:slide-out-to-top',\n          side === 'top' && 'data-[state=open]:slide-in-from-top',\n\n          side === 'bottom' && 'inset-x-0 bottom-0 h-auto border-t',\n          side === 'bottom' && 'data-[state=closed]:slide-out-to-bottom',\n          side === 'bottom' && 'data-[state=open]:slide-in-from-bottom',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <SheetPrimitive.Close\n          className={cn(\n            'cursor-pointer p-2 ring-offset-background',\n            'absolute top-2 right-2 rounded-full opacity-70 transition-opacity',\n            'data-[state=open]:bg-secondary',\n            'disabled:pointer-events-none',\n            'hover:opacity-100',\n            'hover:bg-border-muted',\n            'focus:ring-border-weak',\n            'focus:ring-4',\n            'focus:outline-hidden'\n          )}\n        >\n          <XIcon className=\"size-5\" />\n          <span className=\"sr-only\">Close</span>\n        </SheetPrimitive.Close>\n      </SheetPrimitive.Content>\n    </SheetPortal>\n  );\n}\n\n/** Padded container for the Sheet title and description at the top of the panel. */\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"sheet-header\" className={cn('flex flex-0 flex-col gap-1.5 p-4', className)} {...props} />;\n}\n\n/** Sticky footer area at the bottom of the Sheet panel, typically used for action buttons. */\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"sheet-footer\" className={cn('mt-auto flex flex-0 flex-col gap-2 p-4', className)} {...props} />;\n}\n\n/** Accessible title element for the Sheet, announced by screen readers on open. */\nfunction SheetTitle({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Title>) {\n  return <SheetPrimitive.Title data-slot=\"sheet-title\" className={cn('font-semibold text-text-positive-strong', className)} {...props} />;\n}\n\n/** Accessible description element for the Sheet, providing supplemental context to the title. */\nfunction SheetDescription({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return <SheetPrimitive.Description data-slot=\"sheet-description\" className={cn('text-sm text-text-positive-weak', className)} {...props} />;\n}\n\nexport { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger };\n"],"mappings":"+MA0BA,SAAS,EAAM,CAAE,GAAG,GAA2D,CAC7E,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,KAAhB,CAAqB,YAAU,QAAQ,GAAI,CAAQ,CAAA,CAC5D,CAGA,SAAS,EAAa,CAAE,GAAG,GAA8D,CACvF,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,QAAhB,CAAwB,YAAU,gBAAgB,GAAI,CAAQ,CAAA,CACvE,CAGA,SAAS,EAAW,CAAE,GAAG,GAA4D,CACnF,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,MAAhB,CAAsB,YAAU,cAAc,GAAI,CAAQ,CAAA,CACnE,CAGA,SAAS,EAAY,CAAE,GAAG,GAA6D,CACrF,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,OAAhB,CAAuB,YAAU,eAAe,GAAI,CAAQ,CAAA,CACrE,CAGA,SAAS,EAAa,CAAE,YAAW,GAAG,GAA8D,CAClG,OACE,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,QAAhB,CACE,YAAU,gBACV,WAAA,EAAA,EAAA,GAAA,CACE,iCACA,+BACA,kCACA,iCACA,8BACA,CACF,EACA,GAAI,CACL,CAAA,CAEL,CAKA,SAAS,EAAa,CACpB,YACA,WACA,OAAO,QACP,GAAG,GAIF,CACD,OACE,EAAA,EAAA,KAAA,CAAC,EAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,EAAD,CAAe,CAAA,GACf,EAAA,EAAA,KAAA,CAACA,EAAAA,OAAe,QAAhB,CACE,YAAU,gBACV,WAAA,EAAA,EAAA,GAAA,CACE,gBACA,2FAEA,+BACA,iCACA,kCACA,mCAEA,IAAS,SAAW,sDACpB,IAAS,SAAW,yCACpB,IAAS,SAAW,wCAEpB,IAAS,QAAU,qDACnB,IAAS,QAAU,wCACnB,IAAS,QAAU,uCAEnB,IAAS,OAAS,kCAClB,IAAS,OAAS,uCAClB,IAAS,OAAS,sCAElB,IAAS,UAAY,qCACrB,IAAS,UAAY,0CACrB,IAAS,UAAY,yCACrB,CACF,EACA,GAAI,EA5BN,SAAA,CA8BG,GACD,EAAA,EAAA,KAAA,CAACA,EAAAA,OAAe,MAAhB,CACE,WAAA,EAAA,EAAA,GAAA,CACE,4CACA,oEACA,iCACA,+BACA,oBACA,wBACA,yBACA,eACA,sBACF,EAXF,SAAA,EAaE,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,UAAU,QAAU,CAAA,GAC3B,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,UAAU,SAAA,OAAW,CAAA,CACjB,CACA,CAAA,CAAA,CACb,CAAA,CAAA,CAAA,CAAA,CAEjB,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,YAAU,eAAe,WAAA,EAAA,EAAA,GAAA,CAAc,mCAAoC,CAAS,EAAG,GAAI,CAAQ,CAAA,CACjH,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,YAAU,eAAe,WAAA,EAAA,EAAA,GAAA,CAAc,yCAA0C,CAAS,EAAG,GAAI,CAAQ,CAAA,CACvH,CAGA,SAAS,EAAW,CAAE,YAAW,GAAG,GAA4D,CAC9F,OAAO,EAAA,EAAA,IAAA,CAACD,EAAAA,OAAe,MAAhB,CAAsB,YAAU,cAAc,WAAA,EAAA,EAAA,GAAA,CAAc,0CAA2C,CAAS,EAAG,GAAI,CAAQ,CAAA,CACxI,CAGA,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAkE,CAC1G,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,YAAhB,CAA4B,YAAU,oBAAoB,WAAA,EAAA,EAAA,GAAA,CAAc,kCAAmC,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC5I"}
+{"version":3,"file":"sheet.cjs","names":["SheetPrimitive","XIcon"],"sources":["../../packages/components/ui/sheet.tsx"],"sourcesContent":["'use client';\n\nimport { XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Dialog as SheetPrimitive } from 'radix-ui';\n\n/**\n * Root provider for the Sheet panel — wraps all Sheet sub-components and manages open state.\n *\n * @example\n * ```tsx\n * import { Sheet, SheetTrigger, SheetContent, SheetHeader, SheetTitle, SheetDescription } from '@customafk/lunas-ui/ui/sheet';\n *\n * <Sheet>\n *   <SheetTrigger>Open</SheetTrigger>\n *   <SheetContent side=\"right\">\n *     <SheetHeader>\n *       <SheetTitle>Settings</SheetTitle>\n *       <SheetDescription>Manage your preferences.</SheetDescription>\n *     </SheetHeader>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nfunction Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />;\n}\n\n/** Button or element that opens the Sheet when interacted with. */\nfunction SheetTrigger({ ...props }: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />;\n}\n\n/** Button that programmatically closes the Sheet. */\nfunction SheetClose({ ...props }: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />;\n}\n\n/** Portals Sheet content outside the current DOM hierarchy. */\nfunction SheetPortal({ ...props }: React.ComponentProps<typeof SheetPrimitive.Portal>) {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />;\n}\n\n/** Semi-transparent backdrop rendered behind the Sheet panel. */\nfunction SheetOverlay({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Overlay>) {\n  return (\n    <SheetPrimitive.Overlay\n      data-slot=\"sheet-overlay\"\n      className={cn(\n        'fixed inset-0 z-50 bg-black/50',\n        'data-[state=open]:animate-in',\n        'data-[state=closed]:animate-out',\n        'data-[state=closed]:fade-out-0',\n        'data-[state=open]:fade-in-0',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * The sliding panel itself; renders on the specified `side` of the viewport and includes a built-in close button.\n */\nfunction SheetContent({\n  className,\n  children,\n  side = 'right',\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n  /** Edge of the viewport from which the sheet slides in. */\n  side?: 'top' | 'right' | 'bottom' | 'left';\n}) {\n  return (\n    <SheetPortal>\n      <SheetOverlay />\n      <SheetPrimitive.Content\n        data-slot=\"sheet-content\"\n        className={cn(\n          'bg-background',\n          'fixed z-50 flex flex-col gap-4 border-border-weak shadow-dropdown transition ease-in-out',\n\n          'data-[state=open]:animate-in',\n          'data-[state=open]:duration-500',\n          'data-[state=closed]:animate-out',\n          'data-[state=closed]:duration-300',\n\n          side === 'right' && 'inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm',\n          side === 'right' && 'data-[state=closed]:slide-out-to-right',\n          side === 'right' && 'data-[state=open]:slide-in-from-right',\n\n          side === 'left' && 'inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm',\n          side === 'left' && 'data-[state=closed]:slide-out-to-left',\n          side === 'left' && 'data-[state=open]:slide-in-from-left',\n\n          side === 'top' && 'inset-x-0 top-0 h-auto border-b',\n          side === 'top' && 'data-[state=closed]:slide-out-to-top',\n          side === 'top' && 'data-[state=open]:slide-in-from-top',\n\n          side === 'bottom' && 'inset-x-0 bottom-0 h-auto border-t',\n          side === 'bottom' && 'data-[state=closed]:slide-out-to-bottom',\n          side === 'bottom' && 'data-[state=open]:slide-in-from-bottom',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <SheetPrimitive.Close\n          className={cn(\n            'cursor-pointer p-2 ring-offset-background',\n            'absolute top-2 right-2 rounded-full opacity-70 transition-opacity',\n            'data-[state=open]:bg-secondary',\n            'disabled:pointer-events-none',\n            'hover:opacity-100',\n            'hover:bg-border-muted',\n            'focus:ring-border-weak',\n            'focus:ring-4',\n            'focus:outline-hidden'\n          )}\n        >\n          <XIcon className=\"size-5\" />\n          <span className=\"sr-only\">Close</span>\n        </SheetPrimitive.Close>\n      </SheetPrimitive.Content>\n    </SheetPortal>\n  );\n}\n\n/** Padded container for the Sheet title and description at the top of the panel. */\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"sheet-header\" className={cn('flex flex-0 flex-col gap-1 p-4', className)} {...props} />;\n}\n\n/** Sticky footer area at the bottom of the Sheet panel, typically used for action buttons. */\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"sheet-footer\" className={cn('mt-auto flex flex-0 flex-col gap-2 p-4', className)} {...props} />;\n}\n\n/** Accessible title element for the Sheet, announced by screen readers on open. */\nfunction SheetTitle({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Title>) {\n  return <SheetPrimitive.Title data-slot=\"sheet-title\" className={cn('font-semibold text-text-positive-strong', className)} {...props} />;\n}\n\n/** Accessible description element for the Sheet, providing supplemental context to the title. */\nfunction SheetDescription({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return <SheetPrimitive.Description data-slot=\"sheet-description\" className={cn('text-sm text-text-positive-weak', className)} {...props} />;\n}\n\nexport { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger };\n"],"mappings":"+MA0BA,SAAS,EAAM,CAAE,GAAG,GAA2D,CAC7E,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,KAAhB,CAAqB,YAAU,QAAQ,GAAI,CAAQ,CAAA,CAC5D,CAGA,SAAS,EAAa,CAAE,GAAG,GAA8D,CACvF,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,QAAhB,CAAwB,YAAU,gBAAgB,GAAI,CAAQ,CAAA,CACvE,CAGA,SAAS,EAAW,CAAE,GAAG,GAA4D,CACnF,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,MAAhB,CAAsB,YAAU,cAAc,GAAI,CAAQ,CAAA,CACnE,CAGA,SAAS,EAAY,CAAE,GAAG,GAA6D,CACrF,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,OAAhB,CAAuB,YAAU,eAAe,GAAI,CAAQ,CAAA,CACrE,CAGA,SAAS,EAAa,CAAE,YAAW,GAAG,GAA8D,CAClG,OACE,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,QAAhB,CACE,YAAU,gBACV,WAAA,EAAA,EAAA,GAAA,CACE,iCACA,+BACA,kCACA,iCACA,8BACA,CACF,EACA,GAAI,CACL,CAAA,CAEL,CAKA,SAAS,EAAa,CACpB,YACA,WACA,OAAO,QACP,GAAG,GAIF,CACD,OACE,EAAA,EAAA,KAAA,CAAC,EAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,EAAD,CAAe,CAAA,GACf,EAAA,EAAA,KAAA,CAACA,EAAAA,OAAe,QAAhB,CACE,YAAU,gBACV,WAAA,EAAA,EAAA,GAAA,CACE,gBACA,2FAEA,+BACA,iCACA,kCACA,mCAEA,IAAS,SAAW,sDACpB,IAAS,SAAW,yCACpB,IAAS,SAAW,wCAEpB,IAAS,QAAU,qDACnB,IAAS,QAAU,wCACnB,IAAS,QAAU,uCAEnB,IAAS,OAAS,kCAClB,IAAS,OAAS,uCAClB,IAAS,OAAS,sCAElB,IAAS,UAAY,qCACrB,IAAS,UAAY,0CACrB,IAAS,UAAY,yCACrB,CACF,EACA,GAAI,EA5BN,SAAA,CA8BG,GACD,EAAA,EAAA,KAAA,CAACA,EAAAA,OAAe,MAAhB,CACE,WAAA,EAAA,EAAA,GAAA,CACE,4CACA,oEACA,iCACA,+BACA,oBACA,wBACA,yBACA,eACA,sBACF,EAXF,SAAA,EAaE,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,UAAU,QAAU,CAAA,GAC3B,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,UAAU,SAAA,OAAW,CAAA,CACjB,CACA,CAAA,CAAA,CACb,CAAA,CAAA,CAAA,CAAA,CAEjB,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,YAAU,eAAe,WAAA,EAAA,EAAA,GAAA,CAAc,iCAAkC,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC/G,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,YAAU,eAAe,WAAA,EAAA,EAAA,GAAA,CAAc,yCAA0C,CAAS,EAAG,GAAI,CAAQ,CAAA,CACvH,CAGA,SAAS,EAAW,CAAE,YAAW,GAAG,GAA4D,CAC9F,OAAO,EAAA,EAAA,IAAA,CAACD,EAAAA,OAAe,MAAhB,CAAsB,YAAU,cAAc,WAAA,EAAA,EAAA,GAAA,CAAc,0CAA2C,CAAS,EAAG,GAAI,CAAQ,CAAA,CACxI,CAGA,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAkE,CAC1G,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAe,YAAhB,CAA4B,YAAU,oBAAoB,WAAA,EAAA,EAAA,GAAA,CAAc,kCAAmC,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC5I"}

package/dist/ui/sheet.mjs

@@ -1,2 +1,2 @@
-"use client";import{XIcon as e}from"lucide-react";import{cn as t}from"@customafk/react-toolkit/utils";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{Dialog as i}from"radix-ui";function a({...e}){return n(i.Root,{"data-slot":`sheet`,...e})}function o({...e}){return n(i.Trigger,{"data-slot":`sheet-trigger`,...e})}function s({...e}){return n(i.Close,{"data-slot":`sheet-close`,...e})}function c({...e}){return n(i.Portal,{"data-slot":`sheet-portal`,...e})}function l({className:e,...r}){return n(i.Overlay,{"data-slot":`sheet-overlay`,className:t(`fixed inset-0 z-50 bg-black/50`,`data-[state=open]:animate-in`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=open]:fade-in-0`,e),...r})}function u({className:a,children:o,side:s=`right`,...u}){return r(c,{children:[n(l,{}),r(i.Content,{"data-slot":`sheet-content`,className:t(`bg-background`,`fixed z-50 flex flex-col gap-4 border-border-weak shadow-dropdown transition ease-in-out`,`data-[state=open]:animate-in`,`data-[state=open]:duration-500`,`data-[state=closed]:animate-out`,`data-[state=closed]:duration-300`,s===`right`&&`inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm`,s===`right`&&`data-[state=closed]:slide-out-to-right`,s===`right`&&`data-[state=open]:slide-in-from-right`,s===`left`&&`inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm`,s===`left`&&`data-[state=closed]:slide-out-to-left`,s===`left`&&`data-[state=open]:slide-in-from-left`,s===`top`&&`inset-x-0 top-0 h-auto border-b`,s===`top`&&`data-[state=closed]:slide-out-to-top`,s===`top`&&`data-[state=open]:slide-in-from-top`,s===`bottom`&&`inset-x-0 bottom-0 h-auto border-t`,s===`bottom`&&`data-[state=closed]:slide-out-to-bottom`,s===`bottom`&&`data-[state=open]:slide-in-from-bottom`,a),...u,children:[o,r(i.Close,{className:t(`cursor-pointer p-2 ring-offset-background`,`absolute top-2 right-2 rounded-full opacity-70 transition-opacity`,`data-[state=open]:bg-secondary`,`disabled:pointer-events-none`,`hover:opacity-100`,`hover:bg-border-muted`,`focus:ring-border-weak`,`focus:ring-4`,`focus:outline-hidden`),children:[n(e,{className:`size-5`}),n(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function d({className:e,...r}){return n(`div`,{"data-slot":`sheet-header`,className:t(`flex flex-0 flex-col gap-1.5 p-4`,e),...r})}function f({className:e,...r}){return n(`div`,{"data-slot":`sheet-footer`,className:t(`mt-auto flex flex-0 flex-col gap-2 p-4`,e),...r})}function p({className:e,...r}){return n(i.Title,{"data-slot":`sheet-title`,className:t(`font-semibold text-text-positive-strong`,e),...r})}function m({className:e,...r}){return n(i.Description,{"data-slot":`sheet-description`,className:t(`text-sm text-text-positive-weak`,e),...r})}export{a as Sheet,s as SheetClose,u as SheetContent,m as SheetDescription,f as SheetFooter,d as SheetHeader,p as SheetTitle,o as SheetTrigger};
+"use client";import{XIcon as e}from"lucide-react";import{cn as t}from"@customafk/react-toolkit/utils";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{Dialog as i}from"radix-ui";function a({...e}){return n(i.Root,{"data-slot":`sheet`,...e})}function o({...e}){return n(i.Trigger,{"data-slot":`sheet-trigger`,...e})}function s({...e}){return n(i.Close,{"data-slot":`sheet-close`,...e})}function c({...e}){return n(i.Portal,{"data-slot":`sheet-portal`,...e})}function l({className:e,...r}){return n(i.Overlay,{"data-slot":`sheet-overlay`,className:t(`fixed inset-0 z-50 bg-black/50`,`data-[state=open]:animate-in`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=open]:fade-in-0`,e),...r})}function u({className:a,children:o,side:s=`right`,...u}){return r(c,{children:[n(l,{}),r(i.Content,{"data-slot":`sheet-content`,className:t(`bg-background`,`fixed z-50 flex flex-col gap-4 border-border-weak shadow-dropdown transition ease-in-out`,`data-[state=open]:animate-in`,`data-[state=open]:duration-500`,`data-[state=closed]:animate-out`,`data-[state=closed]:duration-300`,s===`right`&&`inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm`,s===`right`&&`data-[state=closed]:slide-out-to-right`,s===`right`&&`data-[state=open]:slide-in-from-right`,s===`left`&&`inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm`,s===`left`&&`data-[state=closed]:slide-out-to-left`,s===`left`&&`data-[state=open]:slide-in-from-left`,s===`top`&&`inset-x-0 top-0 h-auto border-b`,s===`top`&&`data-[state=closed]:slide-out-to-top`,s===`top`&&`data-[state=open]:slide-in-from-top`,s===`bottom`&&`inset-x-0 bottom-0 h-auto border-t`,s===`bottom`&&`data-[state=closed]:slide-out-to-bottom`,s===`bottom`&&`data-[state=open]:slide-in-from-bottom`,a),...u,children:[o,r(i.Close,{className:t(`cursor-pointer p-2 ring-offset-background`,`absolute top-2 right-2 rounded-full opacity-70 transition-opacity`,`data-[state=open]:bg-secondary`,`disabled:pointer-events-none`,`hover:opacity-100`,`hover:bg-border-muted`,`focus:ring-border-weak`,`focus:ring-4`,`focus:outline-hidden`),children:[n(e,{className:`size-5`}),n(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function d({className:e,...r}){return n(`div`,{"data-slot":`sheet-header`,className:t(`flex flex-0 flex-col gap-1 p-4`,e),...r})}function f({className:e,...r}){return n(`div`,{"data-slot":`sheet-footer`,className:t(`mt-auto flex flex-0 flex-col gap-2 p-4`,e),...r})}function p({className:e,...r}){return n(i.Title,{"data-slot":`sheet-title`,className:t(`font-semibold text-text-positive-strong`,e),...r})}function m({className:e,...r}){return n(i.Description,{"data-slot":`sheet-description`,className:t(`text-sm text-text-positive-weak`,e),...r})}export{a as Sheet,s as SheetClose,u as SheetContent,m as SheetDescription,f as SheetFooter,d as SheetHeader,p as SheetTitle,o as SheetTrigger};
 //# sourceMappingURL=sheet.mjs.map

package/dist/ui/sheet.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.mjs","names":["SheetPrimitive"],"sources":["../../packages/components/ui/sheet.tsx"],"sourcesContent":["'use client';\n\nimport { XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Dialog as SheetPrimitive } from 'radix-ui';\n\n/**\n * Root provider for the Sheet panel — wraps all Sheet sub-components and manages open state.\n *\n * @example\n * ```tsx\n * import { Sheet, SheetTrigger, SheetContent, SheetHeader, SheetTitle, SheetDescription } from '@customafk/lunas-ui/ui/sheet';\n *\n * <Sheet>\n *   <SheetTrigger>Open</SheetTrigger>\n *   <SheetContent side=\"right\">\n *     <SheetHeader>\n *       <SheetTitle>Settings</SheetTitle>\n *       <SheetDescription>Manage your preferences.</SheetDescription>\n *     </SheetHeader>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nfunction Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />;\n}\n\n/** Button or element that opens the Sheet when interacted with. */\nfunction SheetTrigger({ ...props }: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />;\n}\n\n/** Button that programmatically closes the Sheet. */\nfunction SheetClose({ ...props }: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />;\n}\n\n/** Portals Sheet content outside the current DOM hierarchy. */\nfunction SheetPortal({ ...props }: React.ComponentProps<typeof SheetPrimitive.Portal>) {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />;\n}\n\n/** Semi-transparent backdrop rendered behind the Sheet panel. */\nfunction SheetOverlay({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Overlay>) {\n  return (\n    <SheetPrimitive.Overlay\n      data-slot=\"sheet-overlay\"\n      className={cn(\n        'fixed inset-0 z-50 bg-black/50',\n        'data-[state=open]:animate-in',\n        'data-[state=closed]:animate-out',\n        'data-[state=closed]:fade-out-0',\n        'data-[state=open]:fade-in-0',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * The sliding panel itself; renders on the specified `side` of the viewport and includes a built-in close button.\n */\nfunction SheetContent({\n  className,\n  children,\n  side = 'right',\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n  /** Edge of the viewport from which the sheet slides in. */\n  side?: 'top' | 'right' | 'bottom' | 'left';\n}) {\n  return (\n    <SheetPortal>\n      <SheetOverlay />\n      <SheetPrimitive.Content\n        data-slot=\"sheet-content\"\n        className={cn(\n          'bg-background',\n          'fixed z-50 flex flex-col gap-4 border-border-weak shadow-dropdown transition ease-in-out',\n\n          'data-[state=open]:animate-in',\n          'data-[state=open]:duration-500',\n          'data-[state=closed]:animate-out',\n          'data-[state=closed]:duration-300',\n\n          side === 'right' && 'inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm',\n          side === 'right' && 'data-[state=closed]:slide-out-to-right',\n          side === 'right' && 'data-[state=open]:slide-in-from-right',\n\n          side === 'left' && 'inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm',\n          side === 'left' && 'data-[state=closed]:slide-out-to-left',\n          side === 'left' && 'data-[state=open]:slide-in-from-left',\n\n          side === 'top' && 'inset-x-0 top-0 h-auto border-b',\n          side === 'top' && 'data-[state=closed]:slide-out-to-top',\n          side === 'top' && 'data-[state=open]:slide-in-from-top',\n\n          side === 'bottom' && 'inset-x-0 bottom-0 h-auto border-t',\n          side === 'bottom' && 'data-[state=closed]:slide-out-to-bottom',\n          side === 'bottom' && 'data-[state=open]:slide-in-from-bottom',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <SheetPrimitive.Close\n          className={cn(\n            'cursor-pointer p-2 ring-offset-background',\n            'absolute top-2 right-2 rounded-full opacity-70 transition-opacity',\n            'data-[state=open]:bg-secondary',\n            'disabled:pointer-events-none',\n            'hover:opacity-100',\n            'hover:bg-border-muted',\n            'focus:ring-border-weak',\n            'focus:ring-4',\n            'focus:outline-hidden'\n          )}\n        >\n          <XIcon className=\"size-5\" />\n          <span className=\"sr-only\">Close</span>\n        </SheetPrimitive.Close>\n      </SheetPrimitive.Content>\n    </SheetPortal>\n  );\n}\n\n/** Padded container for the Sheet title and description at the top of the panel. */\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"sheet-header\" className={cn('flex flex-0 flex-col gap-1.5 p-4', className)} {...props} />;\n}\n\n/** Sticky footer area at the bottom of the Sheet panel, typically used for action buttons. */\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"sheet-footer\" className={cn('mt-auto flex flex-0 flex-col gap-2 p-4', className)} {...props} />;\n}\n\n/** Accessible title element for the Sheet, announced by screen readers on open. */\nfunction SheetTitle({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Title>) {\n  return <SheetPrimitive.Title data-slot=\"sheet-title\" className={cn('font-semibold text-text-positive-strong', className)} {...props} />;\n}\n\n/** Accessible description element for the Sheet, providing supplemental context to the title. */\nfunction SheetDescription({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return <SheetPrimitive.Description data-slot=\"sheet-description\" className={cn('text-sm text-text-positive-weak', className)} {...props} />;\n}\n\nexport { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger };\n"],"mappings":"0LA0BA,SAAS,EAAM,CAAE,GAAG,GAA2D,CAC7E,OAAO,EAACA,EAAe,KAAhB,CAAqB,YAAU,QAAQ,GAAI,CAAQ,CAAA,CAC5D,CAGA,SAAS,EAAa,CAAE,GAAG,GAA8D,CACvF,OAAO,EAACA,EAAe,QAAhB,CAAwB,YAAU,gBAAgB,GAAI,CAAQ,CAAA,CACvE,CAGA,SAAS,EAAW,CAAE,GAAG,GAA4D,CACnF,OAAO,EAACA,EAAe,MAAhB,CAAsB,YAAU,cAAc,GAAI,CAAQ,CAAA,CACnE,CAGA,SAAS,EAAY,CAAE,GAAG,GAA6D,CACrF,OAAO,EAACA,EAAe,OAAhB,CAAuB,YAAU,eAAe,GAAI,CAAQ,CAAA,CACrE,CAGA,SAAS,EAAa,CAAE,YAAW,GAAG,GAA8D,CAClG,OACE,EAACA,EAAe,QAAhB,CACE,YAAU,gBACV,UAAW,EACT,iCACA,+BACA,kCACA,iCACA,8BACA,CACF,EACA,GAAI,CACL,CAAA,CAEL,CAKA,SAAS,EAAa,CACpB,YACA,WACA,OAAO,QACP,GAAG,GAIF,CACD,OACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAe,CAAA,EACf,EAACA,EAAe,QAAhB,CACE,YAAU,gBACV,UAAW,EACT,gBACA,2FAEA,+BACA,iCACA,kCACA,mCAEA,IAAS,SAAW,sDACpB,IAAS,SAAW,yCACpB,IAAS,SAAW,wCAEpB,IAAS,QAAU,qDACnB,IAAS,QAAU,wCACnB,IAAS,QAAU,uCAEnB,IAAS,OAAS,kCAClB,IAAS,OAAS,uCAClB,IAAS,OAAS,sCAElB,IAAS,UAAY,qCACrB,IAAS,UAAY,0CACrB,IAAS,UAAY,yCACrB,CACF,EACA,GAAI,EA5BN,SAAA,CA8BG,EACD,EAACA,EAAe,MAAhB,CACE,UAAW,EACT,4CACA,oEACA,iCACA,+BACA,oBACA,wBACA,yBACA,eACA,sBACF,EAXF,SAAA,CAaE,EAAC,EAAD,CAAO,UAAU,QAAU,CAAA,EAC3B,EAAC,OAAD,CAAM,UAAU,UAAU,SAAA,OAAW,CAAA,CACjB,CACA,CAAA,CAAA,CACb,CAAA,CAAA,CAAA,CAAA,CAEjB,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAC,MAAD,CAAK,YAAU,eAAe,UAAW,EAAG,mCAAoC,CAAS,EAAG,GAAI,CAAQ,CAAA,CACjH,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAC,MAAD,CAAK,YAAU,eAAe,UAAW,EAAG,yCAA0C,CAAS,EAAG,GAAI,CAAQ,CAAA,CACvH,CAGA,SAAS,EAAW,CAAE,YAAW,GAAG,GAA4D,CAC9F,OAAO,EAACA,EAAe,MAAhB,CAAsB,YAAU,cAAc,UAAW,EAAG,0CAA2C,CAAS,EAAG,GAAI,CAAQ,CAAA,CACxI,CAGA,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAkE,CAC1G,OAAO,EAACA,EAAe,YAAhB,CAA4B,YAAU,oBAAoB,UAAW,EAAG,kCAAmC,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC5I"}
+{"version":3,"file":"sheet.mjs","names":["SheetPrimitive"],"sources":["../../packages/components/ui/sheet.tsx"],"sourcesContent":["'use client';\n\nimport { XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Dialog as SheetPrimitive } from 'radix-ui';\n\n/**\n * Root provider for the Sheet panel — wraps all Sheet sub-components and manages open state.\n *\n * @example\n * ```tsx\n * import { Sheet, SheetTrigger, SheetContent, SheetHeader, SheetTitle, SheetDescription } from '@customafk/lunas-ui/ui/sheet';\n *\n * <Sheet>\n *   <SheetTrigger>Open</SheetTrigger>\n *   <SheetContent side=\"right\">\n *     <SheetHeader>\n *       <SheetTitle>Settings</SheetTitle>\n *       <SheetDescription>Manage your preferences.</SheetDescription>\n *     </SheetHeader>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nfunction Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />;\n}\n\n/** Button or element that opens the Sheet when interacted with. */\nfunction SheetTrigger({ ...props }: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />;\n}\n\n/** Button that programmatically closes the Sheet. */\nfunction SheetClose({ ...props }: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />;\n}\n\n/** Portals Sheet content outside the current DOM hierarchy. */\nfunction SheetPortal({ ...props }: React.ComponentProps<typeof SheetPrimitive.Portal>) {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />;\n}\n\n/** Semi-transparent backdrop rendered behind the Sheet panel. */\nfunction SheetOverlay({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Overlay>) {\n  return (\n    <SheetPrimitive.Overlay\n      data-slot=\"sheet-overlay\"\n      className={cn(\n        'fixed inset-0 z-50 bg-black/50',\n        'data-[state=open]:animate-in',\n        'data-[state=closed]:animate-out',\n        'data-[state=closed]:fade-out-0',\n        'data-[state=open]:fade-in-0',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * The sliding panel itself; renders on the specified `side` of the viewport and includes a built-in close button.\n */\nfunction SheetContent({\n  className,\n  children,\n  side = 'right',\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n  /** Edge of the viewport from which the sheet slides in. */\n  side?: 'top' | 'right' | 'bottom' | 'left';\n}) {\n  return (\n    <SheetPortal>\n      <SheetOverlay />\n      <SheetPrimitive.Content\n        data-slot=\"sheet-content\"\n        className={cn(\n          'bg-background',\n          'fixed z-50 flex flex-col gap-4 border-border-weak shadow-dropdown transition ease-in-out',\n\n          'data-[state=open]:animate-in',\n          'data-[state=open]:duration-500',\n          'data-[state=closed]:animate-out',\n          'data-[state=closed]:duration-300',\n\n          side === 'right' && 'inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm',\n          side === 'right' && 'data-[state=closed]:slide-out-to-right',\n          side === 'right' && 'data-[state=open]:slide-in-from-right',\n\n          side === 'left' && 'inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm',\n          side === 'left' && 'data-[state=closed]:slide-out-to-left',\n          side === 'left' && 'data-[state=open]:slide-in-from-left',\n\n          side === 'top' && 'inset-x-0 top-0 h-auto border-b',\n          side === 'top' && 'data-[state=closed]:slide-out-to-top',\n          side === 'top' && 'data-[state=open]:slide-in-from-top',\n\n          side === 'bottom' && 'inset-x-0 bottom-0 h-auto border-t',\n          side === 'bottom' && 'data-[state=closed]:slide-out-to-bottom',\n          side === 'bottom' && 'data-[state=open]:slide-in-from-bottom',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <SheetPrimitive.Close\n          className={cn(\n            'cursor-pointer p-2 ring-offset-background',\n            'absolute top-2 right-2 rounded-full opacity-70 transition-opacity',\n            'data-[state=open]:bg-secondary',\n            'disabled:pointer-events-none',\n            'hover:opacity-100',\n            'hover:bg-border-muted',\n            'focus:ring-border-weak',\n            'focus:ring-4',\n            'focus:outline-hidden'\n          )}\n        >\n          <XIcon className=\"size-5\" />\n          <span className=\"sr-only\">Close</span>\n        </SheetPrimitive.Close>\n      </SheetPrimitive.Content>\n    </SheetPortal>\n  );\n}\n\n/** Padded container for the Sheet title and description at the top of the panel. */\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"sheet-header\" className={cn('flex flex-0 flex-col gap-1 p-4', className)} {...props} />;\n}\n\n/** Sticky footer area at the bottom of the Sheet panel, typically used for action buttons. */\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"sheet-footer\" className={cn('mt-auto flex flex-0 flex-col gap-2 p-4', className)} {...props} />;\n}\n\n/** Accessible title element for the Sheet, announced by screen readers on open. */\nfunction SheetTitle({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Title>) {\n  return <SheetPrimitive.Title data-slot=\"sheet-title\" className={cn('font-semibold text-text-positive-strong', className)} {...props} />;\n}\n\n/** Accessible description element for the Sheet, providing supplemental context to the title. */\nfunction SheetDescription({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return <SheetPrimitive.Description data-slot=\"sheet-description\" className={cn('text-sm text-text-positive-weak', className)} {...props} />;\n}\n\nexport { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger };\n"],"mappings":"0LA0BA,SAAS,EAAM,CAAE,GAAG,GAA2D,CAC7E,OAAO,EAACA,EAAe,KAAhB,CAAqB,YAAU,QAAQ,GAAI,CAAQ,CAAA,CAC5D,CAGA,SAAS,EAAa,CAAE,GAAG,GAA8D,CACvF,OAAO,EAACA,EAAe,QAAhB,CAAwB,YAAU,gBAAgB,GAAI,CAAQ,CAAA,CACvE,CAGA,SAAS,EAAW,CAAE,GAAG,GAA4D,CACnF,OAAO,EAACA,EAAe,MAAhB,CAAsB,YAAU,cAAc,GAAI,CAAQ,CAAA,CACnE,CAGA,SAAS,EAAY,CAAE,GAAG,GAA6D,CACrF,OAAO,EAACA,EAAe,OAAhB,CAAuB,YAAU,eAAe,GAAI,CAAQ,CAAA,CACrE,CAGA,SAAS,EAAa,CAAE,YAAW,GAAG,GAA8D,CAClG,OACE,EAACA,EAAe,QAAhB,CACE,YAAU,gBACV,UAAW,EACT,iCACA,+BACA,kCACA,iCACA,8BACA,CACF,EACA,GAAI,CACL,CAAA,CAEL,CAKA,SAAS,EAAa,CACpB,YACA,WACA,OAAO,QACP,GAAG,GAIF,CACD,OACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAe,CAAA,EACf,EAACA,EAAe,QAAhB,CACE,YAAU,gBACV,UAAW,EACT,gBACA,2FAEA,+BACA,iCACA,kCACA,mCAEA,IAAS,SAAW,sDACpB,IAAS,SAAW,yCACpB,IAAS,SAAW,wCAEpB,IAAS,QAAU,qDACnB,IAAS,QAAU,wCACnB,IAAS,QAAU,uCAEnB,IAAS,OAAS,kCAClB,IAAS,OAAS,uCAClB,IAAS,OAAS,sCAElB,IAAS,UAAY,qCACrB,IAAS,UAAY,0CACrB,IAAS,UAAY,yCACrB,CACF,EACA,GAAI,EA5BN,SAAA,CA8BG,EACD,EAACA,EAAe,MAAhB,CACE,UAAW,EACT,4CACA,oEACA,iCACA,+BACA,oBACA,wBACA,yBACA,eACA,sBACF,EAXF,SAAA,CAaE,EAAC,EAAD,CAAO,UAAU,QAAU,CAAA,EAC3B,EAAC,OAAD,CAAM,UAAU,UAAU,SAAA,OAAW,CAAA,CACjB,CACA,CAAA,CAAA,CACb,CAAA,CAAA,CAAA,CAAA,CAEjB,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAC,MAAD,CAAK,YAAU,eAAe,UAAW,EAAG,iCAAkC,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC/G,CAGA,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAC,MAAD,CAAK,YAAU,eAAe,UAAW,EAAG,yCAA0C,CAAS,EAAG,GAAI,CAAQ,CAAA,CACvH,CAGA,SAAS,EAAW,CAAE,YAAW,GAAG,GAA4D,CAC9F,OAAO,EAACA,EAAe,MAAhB,CAAsB,YAAU,cAAc,UAAW,EAAG,0CAA2C,CAAS,EAAG,GAAI,CAAQ,CAAA,CACxI,CAGA,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAkE,CAC1G,OAAO,EAACA,EAAe,YAAhB,CAA4B,YAAU,oBAAoB,UAAW,EAAG,kCAAmC,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC5I"}

package/dist/ui-grid-CzL5J7cm.d.cts

@@ -0,0 +1,128 @@
+//#region packages/components/layouts/ui-grid.d.ts
+/**
+ * Container-query breakpoint keys used by `UIGrid`'s `cols` and `UIGridItem`'s
+ * `span`, resolved against the nearest ancestor `@container/ui-grid` (i.e. the
+ * grid's own rendered width, not the viewport). These match Tailwind v4's default
+ * container-query scale exactly:
+ * - `'base'` — always applied, no minimum width (the fallback/mobile-first value).
+ * - `'sm'` — applies from **384px** (`24rem`) and up.
+ * - `'md'` — applies from **448px** (`28rem`) and up.
+ * - `'lg'` — applies from **512px** (`32rem`) and up.
+ * - `'xl'` — applies from **576px** (`36rem`) and up.
+ * - `'2xl'` — applies from **672px** (`42rem`) and up.
+ * - `'3xl'` — applies from **768px** (`48rem`) and up.
+ *
+ * Whichever breakpoint's minimum width is currently satisfied (in ascending
+ * order) wins, same cascade behavior as Tailwind's ordinary `sm:`/`md:`/`lg:`
+ * responsive classes.
+ */
+type TUIGridBreakpoint = 'base' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
+type TUIGridCols = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+type TUIGridColsConfig = TUIGridCols | Partial<Record<TUIGridBreakpoint, TUIGridCols>>;
+declare const GAP_CLASS: {
+  readonly xs: "gap-1";
+  readonly sm: "gap-2";
+  readonly md: "gap-4";
+  readonly lg: "gap-6";
+  readonly xl: "gap-8";
+  readonly none: "gap-0";
+};
+type UIGridProps = React.PropsWithChildren<{
+  /** Additional Tailwind classes merged on top of the generated classes. */
+  className?: string;
+  /**
+   * Number of base grid columns (`1`–`12`). Every `UIGridItem`'s `span` is
+   * expressed against this same column count at every container width.
+   * - A plain number fixes the column count at every width.
+   * - An object varies the column count as the grid's own rendered width crosses
+   *   each container-query breakpoint (see {@link TUIGridBreakpoint} for the
+   *   exact pixel value of each key) — e.g. "narrow container → 4 columns, wide
+   *   container → 12 columns".
+   * @default 12
+   * @example
+   * ```tsx
+   * // 4 cols below 448px, 8 cols from 448px, 12 cols from 512px up
+   * <UIGrid cols={{ base: 4, md: 8, lg: 12 }} />
+   * ```
+   */
+  cols?: TUIGridColsConfig;
+  /**
+   * Gap between grid cells, reusing the same scale as `Flex`'s `gap` prop.
+   * - `'none'` — `gap-0`
+   * - `'xs'` — `gap-1`
+   * - `'sm'` — `gap-2`
+   * - `'md'` — `gap-4` (default)
+   * - `'lg'` — `gap-6`
+   * - `'xl'` — `gap-8`
+   * @default 'md'
+   */
+  gap?: keyof typeof GAP_CLASS;
+}>;
+/**
+ * A 12-column CSS Grid container with a named `@container` context, so both its
+ * own column count and its `UIGridItem` children's `span` can vary based on the
+ * grid's own rendered width instead of the viewport.
+ *
+ * @example
+ * ```tsx
+ * import { UIGrid, UIGridItem } from '@customafk/lunas-ui/layouts/ui-grid';
+ *
+ * <UIGrid gap="md" cols={{ base: 4, md: 12 }}>
+ *   <UIGridItem span={6}>Left</UIGridItem>
+ *   <UIGridItem span={6}>Right</UIGridItem>
+ * </UIGrid>
+ * ```
+ */
+declare const UIGrid: import("react").MemoExoticComponent<({ cols, gap, className, children }: UIGridProps) => import("react").JSX.Element>;
+type TUIGridSpan = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+type TUIGridItemSpan = TUIGridSpan | Partial<Record<TUIGridBreakpoint, TUIGridSpan>>;
+type UIGridItemProps = React.PropsWithChildren<{
+  /** Additional Tailwind classes merged on top of the span classes. */
+  className?: string;
+  /**
+   * Number of the grid's columns this item should occupy (`1`–`12`).
+   * - A plain number fixes the span at every container width.
+   * - An object varies the span as the *grid's own* rendered width crosses each
+   *   container-query breakpoint (see {@link TUIGridBreakpoint} for the exact
+   *   pixel value of each key), not the viewport.
+   * @default 12
+   * @example
+   * ```tsx
+   * <UIGridItem span={6} />
+   * // full-width below 384px, half from 384px, a third from 448px up
+   * <UIGridItem span={{ base: 12, sm: 6, md: 4 }} />
+   * ```
+   */
+  span?: TUIGridItemSpan;
+  /**
+   * Wraps `children` in a `Suspense` boundary so a lazy-loaded cell (e.g. a
+   * `React.lazy()` component) doesn't block sibling items from rendering.
+   * @default true
+   */
+  suspense?: boolean;
+  /**
+   * Fallback UI shown while suspended children are loading. Only relevant when
+   * `suspense` is `true`.
+   * @default null
+   */
+  fallback?: React.ReactNode;
+}>;
+/**
+ * A single cell inside a `UIGrid`. Spans `12` of the grid's columns by default
+ * (a full-width row) and can vary its span per container-query breakpoint.
+ *
+ * @example
+ * ```tsx
+ * import { UIGrid, UIGridItem } from '@customafk/lunas-ui/layouts/ui-grid';
+ *
+ * <UIGrid>
+ *   <UIGridItem span={{ base: 12, md: 6 }} suspense fallback={<Skeleton />}>
+ *     <LazyWidget />
+ *   </UIGridItem>
+ * </UIGrid>
+ * ```
+ */
+declare const UIGridItem: import("react").MemoExoticComponent<({ span, className, children, suspense, fallback }: UIGridItemProps) => import("react").JSX.Element>;
+//#endregion
+export { TUIGridSpan as a, TUIGridItemSpan as i, TUIGridCols as n, UIGrid as o, TUIGridColsConfig as r, UIGridItem as s, TUIGridBreakpoint as t };
+//# sourceMappingURL=ui-grid-CzL5J7cm.d.cts.map

package/dist/ui-grid-CzL5J7cm.d.mts

@@ -0,0 +1,128 @@
+//#region packages/components/layouts/ui-grid.d.ts
+/**
+ * Container-query breakpoint keys used by `UIGrid`'s `cols` and `UIGridItem`'s
+ * `span`, resolved against the nearest ancestor `@container/ui-grid` (i.e. the
+ * grid's own rendered width, not the viewport). These match Tailwind v4's default
+ * container-query scale exactly:
+ * - `'base'` — always applied, no minimum width (the fallback/mobile-first value).
+ * - `'sm'` — applies from **384px** (`24rem`) and up.
+ * - `'md'` — applies from **448px** (`28rem`) and up.
+ * - `'lg'` — applies from **512px** (`32rem`) and up.
+ * - `'xl'` — applies from **576px** (`36rem`) and up.
+ * - `'2xl'` — applies from **672px** (`42rem`) and up.
+ * - `'3xl'` — applies from **768px** (`48rem`) and up.
+ *
+ * Whichever breakpoint's minimum width is currently satisfied (in ascending
+ * order) wins, same cascade behavior as Tailwind's ordinary `sm:`/`md:`/`lg:`
+ * responsive classes.
+ */
+type TUIGridBreakpoint = 'base' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
+type TUIGridCols = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+type TUIGridColsConfig = TUIGridCols | Partial<Record<TUIGridBreakpoint, TUIGridCols>>;
+declare const GAP_CLASS: {
+  readonly xs: "gap-1";
+  readonly sm: "gap-2";
+  readonly md: "gap-4";
+  readonly lg: "gap-6";
+  readonly xl: "gap-8";
+  readonly none: "gap-0";
+};
+type UIGridProps = React.PropsWithChildren<{
+  /** Additional Tailwind classes merged on top of the generated classes. */
+  className?: string;
+  /**
+   * Number of base grid columns (`1`–`12`). Every `UIGridItem`'s `span` is
+   * expressed against this same column count at every container width.
+   * - A plain number fixes the column count at every width.
+   * - An object varies the column count as the grid's own rendered width crosses
+   *   each container-query breakpoint (see {@link TUIGridBreakpoint} for the
+   *   exact pixel value of each key) — e.g. "narrow container → 4 columns, wide
+   *   container → 12 columns".
+   * @default 12
+   * @example
+   * ```tsx
+   * // 4 cols below 448px, 8 cols from 448px, 12 cols from 512px up
+   * <UIGrid cols={{ base: 4, md: 8, lg: 12 }} />
+   * ```
+   */
+  cols?: TUIGridColsConfig;
+  /**
+   * Gap between grid cells, reusing the same scale as `Flex`'s `gap` prop.
+   * - `'none'` — `gap-0`
+   * - `'xs'` — `gap-1`
+   * - `'sm'` — `gap-2`
+   * - `'md'` — `gap-4` (default)
+   * - `'lg'` — `gap-6`
+   * - `'xl'` — `gap-8`
+   * @default 'md'
+   */
+  gap?: keyof typeof GAP_CLASS;
+}>;
+/**
+ * A 12-column CSS Grid container with a named `@container` context, so both its
+ * own column count and its `UIGridItem` children's `span` can vary based on the
+ * grid's own rendered width instead of the viewport.
+ *
+ * @example
+ * ```tsx
+ * import { UIGrid, UIGridItem } from '@customafk/lunas-ui/layouts/ui-grid';
+ *
+ * <UIGrid gap="md" cols={{ base: 4, md: 12 }}>
+ *   <UIGridItem span={6}>Left</UIGridItem>
+ *   <UIGridItem span={6}>Right</UIGridItem>
+ * </UIGrid>
+ * ```
+ */
+declare const UIGrid: import("react").MemoExoticComponent<({ cols, gap, className, children }: UIGridProps) => import("react").JSX.Element>;
+type TUIGridSpan = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+type TUIGridItemSpan = TUIGridSpan | Partial<Record<TUIGridBreakpoint, TUIGridSpan>>;
+type UIGridItemProps = React.PropsWithChildren<{
+  /** Additional Tailwind classes merged on top of the span classes. */
+  className?: string;
+  /**
+   * Number of the grid's columns this item should occupy (`1`–`12`).
+   * - A plain number fixes the span at every container width.
+   * - An object varies the span as the *grid's own* rendered width crosses each
+   *   container-query breakpoint (see {@link TUIGridBreakpoint} for the exact
+   *   pixel value of each key), not the viewport.
+   * @default 12
+   * @example
+   * ```tsx
+   * <UIGridItem span={6} />
+   * // full-width below 384px, half from 384px, a third from 448px up
+   * <UIGridItem span={{ base: 12, sm: 6, md: 4 }} />
+   * ```
+   */
+  span?: TUIGridItemSpan;
+  /**
+   * Wraps `children` in a `Suspense` boundary so a lazy-loaded cell (e.g. a
+   * `React.lazy()` component) doesn't block sibling items from rendering.
+   * @default true
+   */
+  suspense?: boolean;
+  /**
+   * Fallback UI shown while suspended children are loading. Only relevant when
+   * `suspense` is `true`.
+   * @default null
+   */
+  fallback?: React.ReactNode;
+}>;
+/**
+ * A single cell inside a `UIGrid`. Spans `12` of the grid's columns by default
+ * (a full-width row) and can vary its span per container-query breakpoint.
+ *
+ * @example
+ * ```tsx
+ * import { UIGrid, UIGridItem } from '@customafk/lunas-ui/layouts/ui-grid';
+ *
+ * <UIGrid>
+ *   <UIGridItem span={{ base: 12, md: 6 }} suspense fallback={<Skeleton />}>
+ *     <LazyWidget />
+ *   </UIGridItem>
+ * </UIGrid>
+ * ```
+ */
+declare const UIGridItem: import("react").MemoExoticComponent<({ span, className, children, suspense, fallback }: UIGridItemProps) => import("react").JSX.Element>;
+//#endregion
+export { TUIGridSpan as a, TUIGridItemSpan as i, TUIGridCols as n, UIGrid as o, TUIGridColsConfig as r, UIGridItem as s, TUIGridBreakpoint as t };
+//# sourceMappingURL=ui-grid-CzL5J7cm.d.mts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@customafk/lunas-ui",
-  "version": "0.2.80",
+  "version": "0.2.82",
   "description": "UI library for Lunas Enterprise",
   "type": "module",
   "author": {
@@ -104,6 +104,10 @@
       "require": "./dist/dialogs/loading-dialog.cjs",
       "import": "./dist/dialogs/loading-dialog.mjs"
     },
+    "./dialogs/side-panel": {
+      "require": "./dist/dialogs/side-panel.cjs",
+      "import": "./dist/dialogs/side-panel.mjs"
+    },
     "./features/charts": {
       "require": "./dist/features/charts/index.cjs",
       "import": "./dist/features/charts/index.mjs"
@@ -148,6 +152,10 @@
       "require": "./dist/layouts/grid.cjs",
       "import": "./dist/layouts/grid.mjs"
     },
+    "./layouts/ui-grid": {
+      "require": "./dist/layouts/ui-grid.cjs",
+      "import": "./dist/layouts/ui-grid.mjs"
+    },
     "./layouts/payment-layout": {
       "require": "./dist/layouts/payment-layout/index.cjs",
       "import": "./dist/layouts/payment-layout/index.mjs"

package/dist/currency-display-CanjOswc.mjs

@@ -1,2 +0,0 @@
-import{Q as e}from"./tables-7_KgoyS-.mjs";import{memo as t,useMemo as n}from"react";import{cn as r}from"@customafk/react-toolkit/utils";import{jsx as i}from"react/jsx-runtime";const a=t(({value:t,currency:a=`USD`,locale:o=`en-US`,display:s=`symbol`,size:c=`md`,colorize:l=!1})=>{let u=n(()=>{let e=typeof t==`string`?Number(t.trim()):t;return e==null||Number.isNaN(e)||!Number.isFinite(e)?null:new Intl.NumberFormat(o,{style:`currency`,currency:a,currencyDisplay:s,minimumFractionDigits:0,maximumFractionDigits:0}).format(e)},[t,a,o,s]),d=n(()=>{let e=typeof t==`string`?Number(t.trim()):t;return typeof e==`number`&&e<0},[t]);return u?i(`p`,{className:r(`font-number tabular-nums`,c===`xs`&&`text-xs`,c===`sm`&&`text-sm`,c===`md`&&`text-base`,c===`lg`&&`text-lg`,c===`xl`&&`text-xl`,!l&&`text-text-positive`,l&&d&&`text-danger-strong`,l&&!d&&`text-success-strong`),children:u}):i(e,{})});a.displayName=`UITableCurrencyDisplay`;export{a as UITableCurrencyDisplay};
-//# sourceMappingURL=currency-display-CanjOswc.mjs.map

package/dist/currency-display-CanjOswc.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"currency-display-CanjOswc.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/currency-display.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableCurrencyDisplay} component. */\ntype Props = {\n  /** The numeric value to format as currency; falsy / `NaN` renders an empty state. */\n  value: number | string | null | undefined;\n  /** ISO 4217 currency code (default: `'USD'`). */\n  currency?: string;\n  /**\n   * BCP 47 locale used for number formatting (default: `'en-US'`).\n   * Controls digit grouping and decimal separators.\n   */\n  locale?: string;\n  /** How to display the currency symbol — `'symbol'` (default), `'code'`, or `'name'`. */\n  display?: 'symbol' | 'code' | 'name';\n  /** Font-size variant (default: `'md'`). */\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /** When `true`, applies a green tint for positive and red tint for negative values. */\n  colorize?: boolean;\n};\n\n/**\n * Formats a numeric value as a locale-aware currency string in a table cell.\n * Always shows exactly two decimal places and uses the browser's `Intl` API for\n * symbol placement.  Renders {@link UITableEmpty} when the value is absent or\n * invalid.\n *\n * @example\n * import { UITableCurrencyDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableCurrencyDisplay value={1234.5} currency=\"USD\" colorize />\n */\nexport const UITableCurrencyDisplay = memo(({ value, currency = 'USD', locale = 'en-US', display = 'symbol', size = 'md', colorize = false }: Props) => {\n  const formatted = useMemo(() => {\n    const num = typeof value === 'string' ? Number(value.trim()) : value;\n    if (num === null || num === undefined || Number.isNaN(num) || !Number.isFinite(num)) return null;\n\n    return new Intl.NumberFormat(locale, {\n      style: 'currency',\n      currency,\n      currencyDisplay: display,\n      minimumFractionDigits: 0,\n      maximumFractionDigits: 0,\n    }).format(num);\n  }, [value, currency, locale, display]);\n\n  const isNegative = useMemo(() => {\n    const num = typeof value === 'string' ? Number(value.trim()) : value;\n    return typeof num === 'number' && num < 0;\n  }, [value]);\n\n  if (!formatted) return <UITableEmpty />;\n\n  return (\n    <p\n      className={cn(\n        'font-number tabular-nums',\n        size === 'xs' && 'text-xs',\n        size === 'sm' && 'text-sm',\n        size === 'md' && 'text-base',\n        size === 'lg' && 'text-lg',\n        size === 'xl' && 'text-xl',\n        !colorize && 'text-text-positive',\n        colorize && isNegative && 'text-danger-strong',\n        colorize && !isNegative && 'text-success-strong'\n      )}\n    >\n      {formatted}\n    </p>\n  );\n});\nUITableCurrencyDisplay.displayName = 'UITableCurrencyDisplay';\n"],"mappings":"gLAsCA,MAAa,EAAyB,GAAM,CAAE,QAAO,WAAW,MAAO,SAAS,QAAS,UAAU,SAAU,OAAO,KAAM,WAAW,MAAmB,CACtJ,IAAM,EAAY,MAAc,CAC9B,IAAM,EAAM,OAAO,GAAU,SAAW,OAAO,EAAM,KAAK,CAAC,EAAI,EAG/D,OAFI,GAAQ,MAA6B,OAAO,MAAM,CAAG,GAAK,CAAC,OAAO,SAAS,CAAG,EAAU,KAErF,IAAI,KAAK,aAAa,EAAQ,CACnC,MAAO,WACP,WACA,gBAAiB,EACjB,sBAAuB,EACvB,sBAAuB,CACzB,CAAC,CAAC,CAAC,OAAO,CAAG,CACf,EAAG,CAAC,EAAO,EAAU,EAAQ,CAAO,CAAC,EAE/B,EAAa,MAAc,CAC/B,IAAM,EAAM,OAAO,GAAU,SAAW,OAAO,EAAM,KAAK,CAAC,EAAI,EAC/D,OAAO,OAAO,GAAQ,UAAY,EAAM,CAC1C,EAAG,CAAC,CAAK,CAAC,EAIV,OAFK,EAGH,EAAC,IAAD,CACE,UAAW,EACT,2BACA,IAAS,MAAQ,UACjB,IAAS,MAAQ,UACjB,IAAS,MAAQ,YACjB,IAAS,MAAQ,UACjB,IAAS,MAAQ,UACjB,CAAC,GAAY,qBACb,GAAY,GAAc,qBAC1B,GAAY,CAAC,GAAc,qBAC7B,EAEC,SAAA,CACA,CAAA,EAjBkB,EAAC,EAAD,CAAe,CAAA,CAmBxC,CAAC,EACD,EAAuB,YAAc"}

package/dist/currency-display-xxK62yo4.cjs

@@ -1,2 +0,0 @@
-const e=require("./tables-CS3NhgTc.cjs");let t=require("react"),n=require("@customafk/react-toolkit/utils"),r=require("react/jsx-runtime");const i=(0,t.memo)(({value:i,currency:a=`USD`,locale:o=`en-US`,display:s=`symbol`,size:c=`md`,colorize:l=!1})=>{let u=(0,t.useMemo)(()=>{let e=typeof i==`string`?Number(i.trim()):i;return e==null||Number.isNaN(e)||!Number.isFinite(e)?null:new Intl.NumberFormat(o,{style:`currency`,currency:a,currencyDisplay:s,minimumFractionDigits:0,maximumFractionDigits:0}).format(e)},[i,a,o,s]),d=(0,t.useMemo)(()=>{let e=typeof i==`string`?Number(i.trim()):i;return typeof e==`number`&&e<0},[i]);return u?(0,r.jsx)(`p`,{className:(0,n.cn)(`font-number tabular-nums`,c===`xs`&&`text-xs`,c===`sm`&&`text-sm`,c===`md`&&`text-base`,c===`lg`&&`text-lg`,c===`xl`&&`text-xl`,!l&&`text-text-positive`,l&&d&&`text-danger-strong`,l&&!d&&`text-success-strong`),children:u}):(0,r.jsx)(e.Q,{})});i.displayName=`UITableCurrencyDisplay`,exports.UITableCurrencyDisplay=i;
-//# sourceMappingURL=currency-display-xxK62yo4.cjs.map

package/dist/currency-display-xxK62yo4.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"currency-display-xxK62yo4.cjs","names":["UITableEmpty"],"sources":["../packages/components/features/tables/components/atoms/currency-display.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableCurrencyDisplay} component. */\ntype Props = {\n  /** The numeric value to format as currency; falsy / `NaN` renders an empty state. */\n  value: number | string | null | undefined;\n  /** ISO 4217 currency code (default: `'USD'`). */\n  currency?: string;\n  /**\n   * BCP 47 locale used for number formatting (default: `'en-US'`).\n   * Controls digit grouping and decimal separators.\n   */\n  locale?: string;\n  /** How to display the currency symbol — `'symbol'` (default), `'code'`, or `'name'`. */\n  display?: 'symbol' | 'code' | 'name';\n  /** Font-size variant (default: `'md'`). */\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /** When `true`, applies a green tint for positive and red tint for negative values. */\n  colorize?: boolean;\n};\n\n/**\n * Formats a numeric value as a locale-aware currency string in a table cell.\n * Always shows exactly two decimal places and uses the browser's `Intl` API for\n * symbol placement.  Renders {@link UITableEmpty} when the value is absent or\n * invalid.\n *\n * @example\n * import { UITableCurrencyDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableCurrencyDisplay value={1234.5} currency=\"USD\" colorize />\n */\nexport const UITableCurrencyDisplay = memo(({ value, currency = 'USD', locale = 'en-US', display = 'symbol', size = 'md', colorize = false }: Props) => {\n  const formatted = useMemo(() => {\n    const num = typeof value === 'string' ? Number(value.trim()) : value;\n    if (num === null || num === undefined || Number.isNaN(num) || !Number.isFinite(num)) return null;\n\n    return new Intl.NumberFormat(locale, {\n      style: 'currency',\n      currency,\n      currencyDisplay: display,\n      minimumFractionDigits: 0,\n      maximumFractionDigits: 0,\n    }).format(num);\n  }, [value, currency, locale, display]);\n\n  const isNegative = useMemo(() => {\n    const num = typeof value === 'string' ? Number(value.trim()) : value;\n    return typeof num === 'number' && num < 0;\n  }, [value]);\n\n  if (!formatted) return <UITableEmpty />;\n\n  return (\n    <p\n      className={cn(\n        'font-number tabular-nums',\n        size === 'xs' && 'text-xs',\n        size === 'sm' && 'text-sm',\n        size === 'md' && 'text-base',\n        size === 'lg' && 'text-lg',\n        size === 'xl' && 'text-xl',\n        !colorize && 'text-text-positive',\n        colorize && isNegative && 'text-danger-strong',\n        colorize && !isNegative && 'text-success-strong'\n      )}\n    >\n      {formatted}\n    </p>\n  );\n});\nUITableCurrencyDisplay.displayName = 'UITableCurrencyDisplay';\n"],"mappings":"2IAsCA,MAAa,GAAA,EAAA,EAAA,KAAA,EAA+B,CAAE,QAAO,WAAW,MAAO,SAAS,QAAS,UAAU,SAAU,OAAO,KAAM,WAAW,MAAmB,CACtJ,IAAM,GAAA,EAAA,EAAA,QAAA,KAA0B,CAC9B,IAAM,EAAM,OAAO,GAAU,SAAW,OAAO,EAAM,KAAK,CAAC,EAAI,EAG/D,OAFI,GAAQ,MAA6B,OAAO,MAAM,CAAG,GAAK,CAAC,OAAO,SAAS,CAAG,EAAU,KAErF,IAAI,KAAK,aAAa,EAAQ,CACnC,MAAO,WACP,WACA,gBAAiB,EACjB,sBAAuB,EACvB,sBAAuB,CACzB,CAAC,CAAC,CAAC,OAAO,CAAG,CACf,EAAG,CAAC,EAAO,EAAU,EAAQ,CAAO,CAAC,EAE/B,GAAA,EAAA,EAAA,QAAA,KAA2B,CAC/B,IAAM,EAAM,OAAO,GAAU,SAAW,OAAO,EAAM,KAAK,CAAC,EAAI,EAC/D,OAAO,OAAO,GAAQ,UAAY,EAAM,CAC1C,EAAG,CAAC,CAAK,CAAC,EAIV,OAFK,GAGH,EAAA,EAAA,IAAA,CAAC,IAAD,CACE,WAAA,EAAA,EAAA,GAAA,CACE,2BACA,IAAS,MAAQ,UACjB,IAAS,MAAQ,UACjB,IAAS,MAAQ,YACjB,IAAS,MAAQ,UACjB,IAAS,MAAQ,UACjB,CAAC,GAAY,qBACb,GAAY,GAAc,qBAC1B,GAAY,CAAC,GAAc,qBAC7B,EAEC,SAAA,CACA,CAAA,GAjBkB,EAAA,EAAA,IAAA,CAACA,EAAAA,EAAD,CAAe,CAAA,CAmBxC,CAAC,EACD,EAAuB,YAAc"}

package/dist/filter-B5EnnL9I.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/button.cjs"),t=require("./tables-CS3NhgTc.cjs"),n=require("./ui/checkbox.cjs"),r=require("./ui/dropdown-menu.cjs"),i=require("./ui/resizable.cjs"),a=require("./ui/popover.cjs"),o=require("./ui/input.cjs"),s=require("./ui/separator.cjs"),c=require("./ui/label.cjs"),l=require("./ui/select.cjs");let u=require("lucide-react"),d=require("react"),f=require("@customafk/react-toolkit/utils"),p=require("react/jsx-runtime");const m={tag:(0,p.jsx)(u.TagIcon,{size:14}),"single-tag":(0,p.jsx)(u.TagIcon,{size:14}),"date-range":(0,p.jsx)(u.CalendarIcon,{size:14}),number:(0,p.jsx)(u.HashIcon,{size:14}),text:(0,p.jsx)(u.TypeIcon,{size:14}),boolean:(0,p.jsx)(u.ToggleLeftIcon,{size:14})},h=[{value:`eq`,label:`Bằng (=)`},{value:`ne`,label:`Không bằng (≠)`},{value:`gt`,label:`Lớn hơn (>)`},{value:`gte`,label:`Ít nhất (≥)`},{value:`lt`,label:`Nhỏ hơn (<)`},{value:`lte`,label:`Nhiều nhất (≤)`},{value:`between`,label:`Trong khoảng`}],g=[{value:`contains`,label:`Chứa`},{value:`equals`,label:`Bằng`},{value:`starts-with`,label:`Bắt đầu bằng`},{value:`ends-with`,label:`Kết thúc bằng`}];function _(e,t){switch(e.type){case`single-tag`:return e.value?t.options?.find(t=>t.value===e.value)?.label??e.value:`Chưa đặt`;case`tag`:return e.values.length?e.values.map(e=>t.options?.find(t=>t.value===e)?.label??e).join(`, `):`Chưa đặt`;case`date-range`:return!e.from&&!e.to?`Ngày không xác định`:e.from&&e.to?`${e.from} → ${e.to}`:e.from?`từ ${e.from}`:`đến ${e.to}`;case`number`:{let t={eq:`=`,ne:`≠`,gt:`>`,gte:`≥`,lt:`<`,lte:`≤`,between:`trong khoảng`}[e.operator];return e.value===void 0?t:e.operator===`between`?`${t} ${e.value} – ${e.valueTo??`?`}`:`${t} ${e.value}`}case`text`:{let t={contains:`chứa`,equals:`là`,"starts-with":`bắt đầu bằng`,"ends-with":`kết thúc bằng`}[e.operator];return e.value?`${t} "${e.value}"`:t}case`boolean`:return e.value===null?`Không xác định`:e.value?`Có`:`Không`}}const v=({value:e,definition:t,onChange:r})=>(0,p.jsx)(`div`,{className:`flex flex-col gap-1 p-3`,children:(t.options??[]).length===0?(0,p.jsx)(`p`,{className:`text-xs text-text-positive-muted`,children:`Không có tùy chọn`}):t.options.map(t=>(0,p.jsxs)(c.Label,{className:(0,f.cn)(`flex items-center gap-2 bg-secondary-bg-subtle hover:bg-secondary-muted px-4 py-2 rounded transition-colors`,e.values.includes(t.value)&&`bg-primary-muted hover:bg-primary-subtle`),children:[(0,p.jsx)(n.Checkbox,{checked:e.values.includes(t.value),onCheckedChange:n=>{r({type:`tag`,values:n?[...e.values,t.value]:e.values.filter(e=>e!==t.value)})}}),(0,p.jsx)(`span`,{className:`text-sm`,children:t.label})]},t.value))}),y=({value:e,definition:t,onChange:r})=>(0,p.jsx)(`div`,{className:`flex flex-col gap-1 p-3`,children:(t.options??[]).length===0?(0,p.jsx)(`p`,{className:`text-xs text-text-positive-muted`,children:`Không có tùy chọn`}):t.options.map(t=>(0,p.jsxs)(c.Label,{className:(0,f.cn)(`flex items-center gap-2 bg-secondary-bg-subtle hover:bg-secondary-muted px-4 py-2 rounded transition-colors`,e.value===t.value&&`bg-primary-muted hover:bg-primary-subtle`),children:[(0,p.jsx)(n.Checkbox,{checked:e.value===t.value,onCheckedChange:e=>{r({type:`single-tag`,value:e?t.value:null})}}),(0,p.jsx)(`span`,{className:`text-sm`,children:t.label})]},t.value))}),b=({value:e,onChange:t})=>(0,p.jsxs)(`div`,{className:`flex flex-col gap-3 p-3`,children:[(0,p.jsxs)(`div`,{className:`flex flex-col gap-1`,children:[(0,p.jsx)(`span`,{className:`text-text-positive-muted text-xs`,children:`Từ ngày`}),(0,p.jsx)(o.Input,{type:`date`,size:`md`,value:e.from??``,onValueChange:n=>t({...e,from:n||void 0})})]}),(0,p.jsxs)(`div`,{className:`flex flex-col gap-1`,children:[(0,p.jsx)(`span`,{className:`text-text-positive-muted text-xs`,children:`Đến ngày`}),(0,p.jsx)(o.Input,{type:`date`,size:`md`,value:e.to??``,onValueChange:n=>t({...e,to:n||void 0})})]})]}),x=({value:e,onChange:t})=>(0,p.jsxs)(`div`,{className:`flex flex-col gap-3 p-3`,children:[(0,p.jsxs)(l.Select,{value:e.operator,onValueChange:n=>t({...e,operator:n}),children:[(0,p.jsx)(l.SelectTrigger,{size:`sm`,children:(0,p.jsx)(l.SelectValue,{})}),(0,p.jsx)(l.SelectContent,{children:h.map(e=>(0,p.jsx)(l.SelectItem,{value:e.value,children:e.label},e.value))})]}),(0,p.jsx)(o.Input,{type:`number`,size:`md`,placeholder:`Giá trị`,value:e.value??``,onValueChange:n=>t({...e,value:n?Number(n):void 0})}),e.operator===`between`&&(0,p.jsx)(o.Input,{type:`number`,size:`md`,placeholder:`Đến giá trị`,value:e.valueTo??``,onValueChange:n=>t({...e,valueTo:n?Number(n):void 0})})]}),S=({value:e,onChange:t})=>(0,p.jsxs)(`div`,{className:`flex flex-col gap-3 p-3`,children:[(0,p.jsxs)(l.Select,{value:e.operator,onValueChange:n=>t({...e,operator:n}),children:[(0,p.jsx)(l.SelectTrigger,{size:`sm`,children:(0,p.jsx)(l.SelectValue,{})}),(0,p.jsx)(l.SelectContent,{children:g.map(e=>(0,p.jsx)(l.SelectItem,{value:e.value,children:e.label},e.value))})]}),(0,p.jsx)(o.Input,{type:`text`,size:`md`,placeholder:`Nhập văn bản...`,value:e.value,onValueChange:n=>t({...e,value:n})})]}),C=[{label:`Có`,value:!0},{label:`Không`,value:!1},{label:`Không xác định`,value:null}],w=({value:t,onChange:n})=>(0,p.jsx)(`div`,{className:`flex flex-col gap-1 p-3`,children:C.map(({label:r,value:i})=>(0,p.jsx)(e.Button,{type:`button`,tabIndex:-1,variant:`outline`,className:(0,f.cn)(`rounded px-3 py-1.5 text-left text-sm transition-colors`,t.value===i?`bg-primary-muted font-medium`:`hover:bg-muted-bg-subtle`),onClick:()=>n({type:`boolean`,value:i}),children:r},r))});function T({value:e,definition:t,onChange:n}){switch(e.type){case`tag`:return(0,p.jsx)(v,{value:e,definition:t,onChange:n});case`single-tag`:return(0,p.jsx)(y,{value:e,definition:t,onChange:n});case`date-range`:return(0,p.jsx)(b,{value:e,onChange:n});case`number`:return(0,p.jsx)(x,{value:e,onChange:n});case`text`:return(0,p.jsx)(S,{value:e,onChange:n});case`boolean`:return(0,p.jsx)(w,{value:e,onChange:n})}}const E=({filter:t,definition:n,onRemove:r,onUpdate:i})=>(0,p.jsxs)(`div`,{className:`flex items-center gap-1`,children:[(0,p.jsxs)(a.Popover,{children:[(0,p.jsx)(a.PopoverTrigger,{asChild:!0,children:(0,p.jsxs)(e.Button,{type:`button`,variant:`outline`,color:`muted`,className:`flex-1 bg-white max-w-[calc(100%-32px)] justify-start`,innerClassName:`flex truncate gap-1.5`,children:[(0,p.jsx)(`span`,{className:`shrink-0 text-text-positive font-medium`,children:n.label}),(0,p.jsx)(`span`,{className:`truncate text-xs text-text-positive-weak`,children:_(t.value,n)})]})}),(0,p.jsxs)(a.PopoverContent,{className:`w-64 p-0`,align:`start`,side:`bottom`,children:[(0,p.jsx)(`div`,{className:`border-b border-border px-3 py-2`,children:(0,p.jsxs)(`div`,{className:`flex items-center gap-1.5`,children:[(0,p.jsx)(`span`,{className:`text-text-positive-muted`,children:m[n.type]}),(0,p.jsx)(`p`,{className:`font-medium`,children:n.label})]})}),(0,p.jsx)(T,{value:t.value,definition:n,onChange:i})]})]}),(0,p.jsx)(e.Button,{type:`button`,size:`icon`,variant:`soft`,color:`danger`,className:`shrink`,onClick:r,children:(0,p.jsx)(u.Trash2Icon,{size:13})})]}),D=()=>{let{filterDefinitions:n,activeFilters:a,addFilter:o,removeFilter:c,updateFilter:l}=t.X(),[h,g]=(0,d.useState)(null),_=n.filter(e=>!a.some(t=>t.definitionId===e.id));return(0,p.jsx)(i.ResizablePanel,{defaultSize:25,className:(0,f.cn)(`bg-card`,h===null?`max-w-8!`:`min-w-64`),children:(0,p.jsxs)(`div`,{className:`relative z-20 flex size-full bg-muted-bg-subtle`,children:[(0,p.jsx)(`div`,{className:`min-w-0 flex-1 overflow-hidden`,children:(0,p.jsx)(d.Activity,{mode:h===`filters`?`visible`:`hidden`,children:(0,p.jsxs)(`div`,{className:`flex size-full flex-col gap-2 p-4`,children:[(0,p.jsxs)(`div`,{className:`flex items-center justify-between gap-2`,children:[(0,p.jsx)(`p`,{className:`font-medium`,children:`Bộ lọc`}),(0,p.jsxs)(r.DropdownMenu,{children:[(0,p.jsx)(r.DropdownMenuTrigger,{asChild:!0,children:(0,p.jsxs)(e.Button,{variant:`outline`,color:`muted`,disabled:_.length===0,children:[(0,p.jsx)(u.ListFilterPlus,{size:13}),`Thêm bộ lọc`]})}),(0,p.jsx)(r.DropdownMenuContent,{align:`end`,children:_.map(e=>(0,p.jsxs)(r.DropdownMenuItem,{className:`flex items-center gap-2`,onClick:()=>o(e.id),children:[m[e.type],e.label]},e.id))})]})]}),(0,p.jsx)(s.Separator,{}),a.length===0?(0,p.jsx)(`p`,{className:`py-6 text-center text-xs text-text-positive-muted`,children:`Không có bộ lọc nào`}):(0,p.jsx)(`div`,{className:`flex flex-col gap-2 pt-1`,children:a.map(e=>{let t=n.find(t=>t.id===e.definitionId);return t?(0,p.jsx)(E,{filter:e,definition:t,onRemove:()=>c(e.id),onUpdate:t=>l(e.id,t)},e.id):null})})]})})}),(0,p.jsxs)(`div`,{className:`flex h-full flex-col border-l border-border bg-muted-bg-subtle text-sm`,children:[(0,p.jsxs)(`button`,{type:`button`,className:(0,f.cn)(`relative flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4`,h===`filters`&&`bg-card`),onClick:()=>g(h===`filters`?null:`filters`),children:[(0,p.jsx)(u.ListFilterIcon,{size:18}),a.length>0&&(0,p.jsx)(`span`,{className:`absolute top-2 right-1.5 flex h-4 w-4 items-center justify-center rounded-full bg-primary text-[10px] leading-none text-primary-foreground`,children:a.length}),(0,p.jsx)(`span`,{className:`text-nowrap [writing-mode:vertical-lr]`,children:`Bộ lọc`})]}),(0,p.jsx)(s.Separator,{})]})]})})};exports.UITableFilter=D;
-//# sourceMappingURL=filter-B5EnnL9I.cjs.map

package/dist/filter-BCNjqiBx.mjs

@@ -1,2 +0,0 @@
-import{Button as e}from"./ui/button.mjs";import{X as t}from"./tables-7_KgoyS-.mjs";import{Checkbox as n}from"./ui/checkbox.mjs";import{DropdownMenu as r,DropdownMenuContent as i,DropdownMenuItem as a,DropdownMenuTrigger as o}from"./ui/dropdown-menu.mjs";import{ResizablePanel as s}from"./ui/resizable.mjs";import{Popover as c,PopoverContent as l,PopoverTrigger as u}from"./ui/popover.mjs";import{Input as d}from"./ui/input.mjs";import{Separator as f}from"./ui/separator.mjs";import{Label as p}from"./ui/label.mjs";import{Select as m,SelectContent as h,SelectItem as g,SelectTrigger as _,SelectValue as v}from"./ui/select.mjs";import{CalendarIcon as y,HashIcon as b,ListFilterIcon as x,ListFilterPlus as S,TagIcon as C,ToggleLeftIcon as w,Trash2Icon as T,TypeIcon as E}from"lucide-react";import{Activity as D,useState as O}from"react";import{cn as k}from"@customafk/react-toolkit/utils";import{jsx as A,jsxs as j}from"react/jsx-runtime";const M={tag:A(C,{size:14}),"single-tag":A(C,{size:14}),"date-range":A(y,{size:14}),number:A(b,{size:14}),text:A(E,{size:14}),boolean:A(w,{size:14})},N=[{value:`eq`,label:`Bằng (=)`},{value:`ne`,label:`Không bằng (≠)`},{value:`gt`,label:`Lớn hơn (>)`},{value:`gte`,label:`Ít nhất (≥)`},{value:`lt`,label:`Nhỏ hơn (<)`},{value:`lte`,label:`Nhiều nhất (≤)`},{value:`between`,label:`Trong khoảng`}],P=[{value:`contains`,label:`Chứa`},{value:`equals`,label:`Bằng`},{value:`starts-with`,label:`Bắt đầu bằng`},{value:`ends-with`,label:`Kết thúc bằng`}];function F(e,t){switch(e.type){case`single-tag`:return e.value?t.options?.find(t=>t.value===e.value)?.label??e.value:`Chưa đặt`;case`tag`:return e.values.length?e.values.map(e=>t.options?.find(t=>t.value===e)?.label??e).join(`, `):`Chưa đặt`;case`date-range`:return!e.from&&!e.to?`Ngày không xác định`:e.from&&e.to?`${e.from} → ${e.to}`:e.from?`từ ${e.from}`:`đến ${e.to}`;case`number`:{let t={eq:`=`,ne:`≠`,gt:`>`,gte:`≥`,lt:`<`,lte:`≤`,between:`trong khoảng`}[e.operator];return e.value===void 0?t:e.operator===`between`?`${t} ${e.value} – ${e.valueTo??`?`}`:`${t} ${e.value}`}case`text`:{let t={contains:`chứa`,equals:`là`,"starts-with":`bắt đầu bằng`,"ends-with":`kết thúc bằng`}[e.operator];return e.value?`${t} "${e.value}"`:t}case`boolean`:return e.value===null?`Không xác định`:e.value?`Có`:`Không`}}const I=({value:e,definition:t,onChange:r})=>A(`div`,{className:`flex flex-col gap-1 p-3`,children:(t.options??[]).length===0?A(`p`,{className:`text-xs text-text-positive-muted`,children:`Không có tùy chọn`}):t.options.map(t=>j(p,{className:k(`flex items-center gap-2 bg-secondary-bg-subtle hover:bg-secondary-muted px-4 py-2 rounded transition-colors`,e.values.includes(t.value)&&`bg-primary-muted hover:bg-primary-subtle`),children:[A(n,{checked:e.values.includes(t.value),onCheckedChange:n=>{r({type:`tag`,values:n?[...e.values,t.value]:e.values.filter(e=>e!==t.value)})}}),A(`span`,{className:`text-sm`,children:t.label})]},t.value))}),L=({value:e,definition:t,onChange:r})=>A(`div`,{className:`flex flex-col gap-1 p-3`,children:(t.options??[]).length===0?A(`p`,{className:`text-xs text-text-positive-muted`,children:`Không có tùy chọn`}):t.options.map(t=>j(p,{className:k(`flex items-center gap-2 bg-secondary-bg-subtle hover:bg-secondary-muted px-4 py-2 rounded transition-colors`,e.value===t.value&&`bg-primary-muted hover:bg-primary-subtle`),children:[A(n,{checked:e.value===t.value,onCheckedChange:e=>{r({type:`single-tag`,value:e?t.value:null})}}),A(`span`,{className:`text-sm`,children:t.label})]},t.value))}),R=({value:e,onChange:t})=>j(`div`,{className:`flex flex-col gap-3 p-3`,children:[j(`div`,{className:`flex flex-col gap-1`,children:[A(`span`,{className:`text-text-positive-muted text-xs`,children:`Từ ngày`}),A(d,{type:`date`,size:`md`,value:e.from??``,onValueChange:n=>t({...e,from:n||void 0})})]}),j(`div`,{className:`flex flex-col gap-1`,children:[A(`span`,{className:`text-text-positive-muted text-xs`,children:`Đến ngày`}),A(d,{type:`date`,size:`md`,value:e.to??``,onValueChange:n=>t({...e,to:n||void 0})})]})]}),z=({value:e,onChange:t})=>j(`div`,{className:`flex flex-col gap-3 p-3`,children:[j(m,{value:e.operator,onValueChange:n=>t({...e,operator:n}),children:[A(_,{size:`sm`,children:A(v,{})}),A(h,{children:N.map(e=>A(g,{value:e.value,children:e.label},e.value))})]}),A(d,{type:`number`,size:`md`,placeholder:`Giá trị`,value:e.value??``,onValueChange:n=>t({...e,value:n?Number(n):void 0})}),e.operator===`between`&&A(d,{type:`number`,size:`md`,placeholder:`Đến giá trị`,value:e.valueTo??``,onValueChange:n=>t({...e,valueTo:n?Number(n):void 0})})]}),B=({value:e,onChange:t})=>j(`div`,{className:`flex flex-col gap-3 p-3`,children:[j(m,{value:e.operator,onValueChange:n=>t({...e,operator:n}),children:[A(_,{size:`sm`,children:A(v,{})}),A(h,{children:P.map(e=>A(g,{value:e.value,children:e.label},e.value))})]}),A(d,{type:`text`,size:`md`,placeholder:`Nhập văn bản...`,value:e.value,onValueChange:n=>t({...e,value:n})})]}),V=[{label:`Có`,value:!0},{label:`Không`,value:!1},{label:`Không xác định`,value:null}],H=({value:t,onChange:n})=>A(`div`,{className:`flex flex-col gap-1 p-3`,children:V.map(({label:r,value:i})=>A(e,{type:`button`,tabIndex:-1,variant:`outline`,className:k(`rounded px-3 py-1.5 text-left text-sm transition-colors`,t.value===i?`bg-primary-muted font-medium`:`hover:bg-muted-bg-subtle`),onClick:()=>n({type:`boolean`,value:i}),children:r},r))});function U({value:e,definition:t,onChange:n}){switch(e.type){case`tag`:return A(I,{value:e,definition:t,onChange:n});case`single-tag`:return A(L,{value:e,definition:t,onChange:n});case`date-range`:return A(R,{value:e,onChange:n});case`number`:return A(z,{value:e,onChange:n});case`text`:return A(B,{value:e,onChange:n});case`boolean`:return A(H,{value:e,onChange:n})}}const W=({filter:t,definition:n,onRemove:r,onUpdate:i})=>j(`div`,{className:`flex items-center gap-1`,children:[j(c,{children:[A(u,{asChild:!0,children:j(e,{type:`button`,variant:`outline`,color:`muted`,className:`flex-1 bg-white max-w-[calc(100%-32px)] justify-start`,innerClassName:`flex truncate gap-1.5`,children:[A(`span`,{className:`shrink-0 text-text-positive font-medium`,children:n.label}),A(`span`,{className:`truncate text-xs text-text-positive-weak`,children:F(t.value,n)})]})}),j(l,{className:`w-64 p-0`,align:`start`,side:`bottom`,children:[A(`div`,{className:`border-b border-border px-3 py-2`,children:j(`div`,{className:`flex items-center gap-1.5`,children:[A(`span`,{className:`text-text-positive-muted`,children:M[n.type]}),A(`p`,{className:`font-medium`,children:n.label})]})}),A(U,{value:t.value,definition:n,onChange:i})]})]}),A(e,{type:`button`,size:`icon`,variant:`soft`,color:`danger`,className:`shrink`,onClick:r,children:A(T,{size:13})})]}),G=()=>{let{filterDefinitions:n,activeFilters:c,addFilter:l,removeFilter:u,updateFilter:d}=t(),[p,m]=O(null),h=n.filter(e=>!c.some(t=>t.definitionId===e.id));return A(s,{defaultSize:25,className:k(`bg-card`,p===null?`max-w-8!`:`min-w-64`),children:j(`div`,{className:`relative z-20 flex size-full bg-muted-bg-subtle`,children:[A(`div`,{className:`min-w-0 flex-1 overflow-hidden`,children:A(D,{mode:p===`filters`?`visible`:`hidden`,children:j(`div`,{className:`flex size-full flex-col gap-2 p-4`,children:[j(`div`,{className:`flex items-center justify-between gap-2`,children:[A(`p`,{className:`font-medium`,children:`Bộ lọc`}),j(r,{children:[A(o,{asChild:!0,children:j(e,{variant:`outline`,color:`muted`,disabled:h.length===0,children:[A(S,{size:13}),`Thêm bộ lọc`]})}),A(i,{align:`end`,children:h.map(e=>j(a,{className:`flex items-center gap-2`,onClick:()=>l(e.id),children:[M[e.type],e.label]},e.id))})]})]}),A(f,{}),c.length===0?A(`p`,{className:`py-6 text-center text-xs text-text-positive-muted`,children:`Không có bộ lọc nào`}):A(`div`,{className:`flex flex-col gap-2 pt-1`,children:c.map(e=>{let t=n.find(t=>t.id===e.definitionId);return t?A(W,{filter:e,definition:t,onRemove:()=>u(e.id),onUpdate:t=>d(e.id,t)},e.id):null})})]})})}),j(`div`,{className:`flex h-full flex-col border-l border-border bg-muted-bg-subtle text-sm`,children:[j(`button`,{type:`button`,className:k(`relative flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4`,p===`filters`&&`bg-card`),onClick:()=>m(p===`filters`?null:`filters`),children:[A(x,{size:18}),c.length>0&&A(`span`,{className:`absolute top-2 right-1.5 flex h-4 w-4 items-center justify-center rounded-full bg-primary text-[10px] leading-none text-primary-foreground`,children:c.length}),A(`span`,{className:`text-nowrap [writing-mode:vertical-lr]`,children:`Bộ lọc`})]}),A(f,{})]})]})})};export{G as UITableFilter};
-//# sourceMappingURL=filter-BCNjqiBx.mjs.map

package/dist/statistic-B9OqfhOl.cjs

@@ -1,2 +0,0 @@
-const e=require("./layouts/flex.cjs"),t=require("./tables-CS3NhgTc.cjs");let n=require("react"),r=require("@customafk/react-toolkit/utils"),i=require("react/jsx-runtime");const a=(e,t,n)=>{let r=10**t;switch(n){case`floor`:return Math.floor(e*r)/r;case`ceil`:return Math.ceil(e*r)/r;default:return Math.round(e*r)/r}},o=(0,n.memo)(({decimalSeparator:o=`.`,groupSeparator:s=`,`,prefix:c,suffix:l,precision:u,roundingMode:d=`round`,showTrailingZeros:f=!1,size:p=`lg`,value:m=0})=>{let h=(0,n.useMemo)(()=>{let e={};return typeof u==`number`&&u>=0&&f&&(e.minimumFractionDigits=u),e.maximumFractionDigits=u,e},[u,f]),g=(0,n.useCallback)(e=>{let t=e;return typeof u==`number`&&u>=0&&(t=a(e,u,d)),t.toLocaleString(`vi-VN`,h)},[d,h,u]),_=(0,n.useMemo)(()=>{if(typeof m==`number`)return Number.isNaN(m)||!Number.isFinite(m)?`N/A`:g(m);if(typeof m==`string`){let e=m.trim();if(!e)return`N/A`;let t=Number(e);return Number.isNaN(t)||!Number.isFinite(t)?`N/A`:g(t)}return`N/A`},[m,g]),v=(0,n.useMemo)(()=>o===`.`&&s===`,`?_:_.replace(/,/g,s).replace(/\./g,o),[_,o,s]);return v===`0`||v===`N/A`||!v?(0,i.jsx)(t.Q,{}):(0,i.jsxs)(e.Flex,{padding:`none`,className:(0,r.cn)(`font-number text-lg text-text-positive tabular-nums`,p===`xs`&&`text-xs`,p===`sm`&&`text-sm`,p===`md`&&`text-base`,p===`lg`&&`text-lg`,p===`xl`&&`text-xl`),children:[c,(0,i.jsx)(`p`,{children:v}),l]})});o.displayName=`UITableStatisticDisplay`,exports.UITableStatisticDisplay=o;
-//# sourceMappingURL=statistic-B9OqfhOl.cjs.map

package/dist/statistic-B9OqfhOl.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"statistic-B9OqfhOl.cjs","names":["UITableEmpty","Flex"],"sources":["../packages/components/features/tables/components/atoms/statistic.tsx"],"sourcesContent":["'use client';\nimport { memo, useCallback, useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Flex } from '@/components/layouts/flex';\nimport { UITableEmpty } from './empty';\n\n/**\n * Applies the specified rounding mode to `num` at the given decimal precision.\n *\n * @param num - The number to round.\n * @param precisionValue - Number of decimal places to keep.\n * @param roundingMode - Rounding strategy: `'round'` (default), `'floor'`, or `'ceil'`.\n * @returns The rounded number.\n */\nconst applyRounding = (num: number, precisionValue: number, roundingMode?: 'round' | 'floor' | 'ceil') => {\n  const multiplier = 10 ** precisionValue;\n\n  switch (roundingMode) {\n    case 'floor':\n      return Math.floor(num * multiplier) / multiplier;\n    case 'ceil':\n      return Math.ceil(num * multiplier) / multiplier;\n    default:\n      return Math.round(num * multiplier) / multiplier;\n  }\n};\n\n/** Props for the {@link UITableStatisticDisplay} component. */\ntype Props = {\n  /** Character used to separate the integer and fractional parts (default: `'.'`). */\n  decimalSeparator?: string;\n  /** Character used to separate thousands groups (default: `','`). */\n  groupSeparator?: string;\n  /** Optional node rendered before the formatted number (e.g. a currency symbol). */\n  prefix?: React.ReactNode;\n  /** Optional node rendered after the formatted number (e.g. a unit label). */\n  suffix?: React.ReactNode;\n  /** Number of decimal digits to display. */\n  precision?: number;\n  /** Rounding strategy applied before formatting (default: `'round'`). */\n  roundingMode?: 'round' | 'floor' | 'ceil';\n  /** When `true`, pads the fractional part with trailing zeros up to `precision` digits. */\n  showTrailingZeros?: boolean;\n  /** Font-size variant for the displayed number (default: `'lg'`). */\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /** The numeric or string value to format; falsy / invalid values render an empty state. */\n  value: number | string | null | undefined;\n};\n\n/**\n * A memoized table-cell component that formats a numeric value with configurable\n * separators, precision, rounding, and size; renders {@link UITableEmpty} when\n * the value is zero, invalid, or absent.\n *\n * @example\n * import { UITableStatisticDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableStatisticDisplay value={1234567.89} precision={2} prefix=\"$\" size=\"md\" />\n */\nexport const UITableStatisticDisplay = memo(\n  ({\n    decimalSeparator = '.',\n    groupSeparator = ',',\n    prefix: Prefix,\n    suffix: Suffix,\n    precision,\n    roundingMode = 'round',\n    showTrailingZeros = false,\n    size = 'lg',\n    value = 0,\n  }: Props) => {\n    // Memoize number formatting options\n    const formatOptions = useMemo((): Intl.NumberFormatOptions => {\n      const options: Intl.NumberFormatOptions = {};\n\n      if (typeof precision === 'number' && precision >= 0 && showTrailingZeros) {\n        options.minimumFractionDigits = precision;\n        options.maximumFractionDigits = precision;\n      } else {\n        options.maximumFractionDigits = precision;\n      }\n\n      return options;\n    }, [precision, showTrailingZeros]);\n\n    const formatNumber = useCallback(\n      (num: number): string => {\n        let processedNum = num;\n\n        // Áp dụng làm tròn nếu có precision\n        if (typeof precision === 'number' && precision >= 0) {\n          processedNum = applyRounding(num, precision, roundingMode);\n        }\n\n        return processedNum.toLocaleString('vi-VN', formatOptions);\n      },\n      [roundingMode, formatOptions, precision]\n    );\n\n    // Memoize value processing\n    const processedValue = useMemo((): string => {\n      // Xử lý giá trị number\n      if (typeof value === 'number') {\n        if (Number.isNaN(value) || !Number.isFinite(value)) {\n          return 'N/A';\n        }\n        return formatNumber(value);\n      }\n\n      // Xử lý giá trị string\n      if (typeof value === 'string') {\n        const trimmedValue = value.trim();\n\n        // Nếu là chuỗi rỗng\n        if (!trimmedValue) {\n          return 'N/A';\n        }\n\n        // Thử convert sang number\n        const numValue = Number(trimmedValue);\n\n        if (Number.isNaN(numValue) || !Number.isFinite(numValue)) {\n          // Nếu không phải số, trả về string gốc\n          return 'N/A';\n        }\n\n        return formatNumber(numValue);\n      }\n\n      return 'N/A';\n    }, [value, formatNumber]);\n\n    // Memoize separator replacement\n    const finalFormattedValue = useMemo((): string => {\n      // Chỉ thay thế separators nếu khác mặc định\n      if (decimalSeparator === '.' && groupSeparator === ',') {\n        return processedValue;\n      }\n      return processedValue.replace(/,/g, groupSeparator).replace(/\\./g, decimalSeparator);\n    }, [processedValue, decimalSeparator, groupSeparator]);\n\n    if (finalFormattedValue === '0' || finalFormattedValue === 'N/A' || !finalFormattedValue) {\n      return <UITableEmpty />;\n    }\n\n    return (\n      <Flex\n        padding=\"none\"\n        className={cn(\n          'font-number text-lg text-text-positive tabular-nums',\n          size === 'xs' && 'text-xs',\n          size === 'sm' && 'text-sm',\n          size === 'md' && 'text-base',\n          size === 'lg' && 'text-lg',\n          size === 'xl' && 'text-xl'\n        )}\n      >\n        {Prefix}\n        <p>{finalFormattedValue}</p>\n        {Suffix}\n      </Flex>\n    );\n  }\n);\nUITableStatisticDisplay.displayName = 'UITableStatisticDisplay';\n"],"mappings":"2KAgBA,MAAM,GAAiB,EAAa,EAAwB,IAA8C,CACxG,IAAM,EAAa,IAAM,EAEzB,OAAQ,EAAR,CACE,IAAK,QACH,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,EACxC,IAAK,OACH,OAAO,KAAK,KAAK,EAAM,CAAU,EAAI,EACvC,QACE,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,CAC1C,CACF,EAkCa,GAAA,EAAA,EAAA,KAAA,EACV,CACC,mBAAmB,IACnB,iBAAiB,IACjB,OAAQ,EACR,OAAQ,EACR,YACA,eAAe,QACf,oBAAoB,GACpB,OAAO,KACP,QAAQ,KACG,CAEX,IAAM,GAAA,EAAA,EAAA,QAAA,KAAwD,CAC5D,IAAM,EAAoC,CAAC,EAS3C,OAPI,OAAO,GAAc,UAAY,GAAa,GAAK,IACrD,EAAQ,sBAAwB,GAGhC,EAAQ,sBAAwB,EAG3B,CACT,EAAG,CAAC,EAAW,CAAiB,CAAC,EAE3B,GAAA,EAAA,EAAA,YAAA,CACH,GAAwB,CACvB,IAAI,EAAe,EAOnB,OAJI,OAAO,GAAc,UAAY,GAAa,IAChD,EAAe,EAAc,EAAK,EAAW,CAAY,GAGpD,EAAa,eAAe,QAAS,CAAa,CAC3D,EACA,CAAC,EAAc,EAAe,CAAS,CACzC,EAGM,GAAA,EAAA,EAAA,QAAA,KAAuC,CAE3C,GAAI,OAAO,GAAU,SAInB,OAHI,OAAO,MAAM,CAAK,GAAK,CAAC,OAAO,SAAS,CAAK,EACxC,MAEF,EAAa,CAAK,EAI3B,GAAI,OAAO,GAAU,SAAU,CAC7B,IAAM,EAAe,EAAM,KAAK,EAGhC,GAAI,CAAC,EACH,MAAO,MAIT,IAAM,EAAW,OAAO,CAAY,EAOpC,OALI,OAAO,MAAM,CAAQ,GAAK,CAAC,OAAO,SAAS,CAAQ,EAE9C,MAGF,EAAa,CAAQ,CAC9B,CAEA,MAAO,KACT,EAAG,CAAC,EAAO,CAAY,CAAC,EAGlB,GAAA,EAAA,EAAA,QAAA,KAEA,IAAqB,KAAO,IAAmB,IAC1C,EAEF,EAAe,QAAQ,KAAM,CAAc,CAAC,CAAC,QAAQ,MAAO,CAAgB,EAClF,CAAC,EAAgB,EAAkB,CAAc,CAAC,EAMrD,OAJI,IAAwB,KAAO,IAAwB,OAAS,CAAC,GAC5D,EAAA,EAAA,IAAA,CAACA,EAAAA,EAAD,CAAe,CAAA,GAItB,EAAA,EAAA,KAAA,CAACC,EAAAA,KAAD,CACE,QAAQ,OACR,WAAA,EAAA,EAAA,GAAA,CACE,sDACA,IAAS,MAAQ,UACjB,IAAS,MAAQ,UACjB,IAAS,MAAQ,YACjB,IAAS,MAAQ,UACjB,IAAS,MAAQ,SACnB,EATF,SAAA,CAWG,GACD,EAAA,EAAA,IAAA,CAAC,IAAD,CAAA,SAAI,CAAuB,CAAA,EAC1B,CACG,GAEV,CACF,EACA,EAAwB,YAAc"}

package/dist/statistic-CJVc9sNs.mjs

@@ -1,2 +0,0 @@
-import{Flex as e}from"./layouts/flex.mjs";import{Q as t}from"./tables-7_KgoyS-.mjs";import{memo as n,useCallback as r,useMemo as i}from"react";import{cn as a}from"@customafk/react-toolkit/utils";import{jsx as o,jsxs as s}from"react/jsx-runtime";const c=(e,t,n)=>{let r=10**t;switch(n){case`floor`:return Math.floor(e*r)/r;case`ceil`:return Math.ceil(e*r)/r;default:return Math.round(e*r)/r}},l=n(({decimalSeparator:n=`.`,groupSeparator:l=`,`,prefix:u,suffix:d,precision:f,roundingMode:p=`round`,showTrailingZeros:m=!1,size:h=`lg`,value:g=0})=>{let _=i(()=>{let e={};return typeof f==`number`&&f>=0&&m&&(e.minimumFractionDigits=f),e.maximumFractionDigits=f,e},[f,m]),v=r(e=>{let t=e;return typeof f==`number`&&f>=0&&(t=c(e,f,p)),t.toLocaleString(`vi-VN`,_)},[p,_,f]),y=i(()=>{if(typeof g==`number`)return Number.isNaN(g)||!Number.isFinite(g)?`N/A`:v(g);if(typeof g==`string`){let e=g.trim();if(!e)return`N/A`;let t=Number(e);return Number.isNaN(t)||!Number.isFinite(t)?`N/A`:v(t)}return`N/A`},[g,v]),b=i(()=>n===`.`&&l===`,`?y:y.replace(/,/g,l).replace(/\./g,n),[y,n,l]);return b===`0`||b===`N/A`||!b?o(t,{}):s(e,{padding:`none`,className:a(`font-number text-lg text-text-positive tabular-nums`,h===`xs`&&`text-xs`,h===`sm`&&`text-sm`,h===`md`&&`text-base`,h===`lg`&&`text-lg`,h===`xl`&&`text-xl`),children:[u,o(`p`,{children:b}),d]})});l.displayName=`UITableStatisticDisplay`;export{l as UITableStatisticDisplay};
-//# sourceMappingURL=statistic-CJVc9sNs.mjs.map