@customafk/lunas-ui 0.2.4 → 0.2.6

package/dist/ui/dropdown-menu.d.cts

@@ -1,25 +1,57 @@
-import * as react_jsx_runtime149 from "react/jsx-runtime";
+import * as react_jsx_runtime143 from "react/jsx-runtime";
 import { DropdownMenu as DropdownMenu$1 } from "radix-ui";
 
 //#region packages/components/ui/dropdown-menu.d.ts
+
+/**
+ * Root provider for the DropdownMenu — wraps all sub-components and controls open state.
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   DropdownMenu, DropdownMenuTrigger, DropdownMenuContent,
+ *   DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator,
+ * } from '@customafk/lunas-ui/ui/dropdown-menu';
+ *
+ * <DropdownMenu>
+ *   <DropdownMenuTrigger>Options</DropdownMenuTrigger>
+ *   <DropdownMenuContent>
+ *     <DropdownMenuLabel>My Account</DropdownMenuLabel>
+ *     <DropdownMenuSeparator />
+ *     <DropdownMenuItem>Profile</DropdownMenuItem>
+ *     <DropdownMenuItem variant="destructive">Delete</DropdownMenuItem>
+ *   </DropdownMenuContent>
+ * </DropdownMenu>
+ * ```
+ */
 declare function DropdownMenu({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Root>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Root>): react_jsx_runtime143.JSX.Element;
+/** Portals DropdownMenu content outside the current DOM hierarchy. */
 declare function DropdownMenuPortal({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Portal>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Portal>): react_jsx_runtime143.JSX.Element;
+/** Element that opens the DropdownMenu when activated. */
 declare function DropdownMenuTrigger({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Trigger>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Trigger>): react_jsx_runtime143.JSX.Element;
+/** Animated floating panel that contains the dropdown items. */
 declare function DropdownMenuContent({
   className,
   sideOffset,
   align,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Content>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Content>): react_jsx_runtime143.JSX.Element;
+/** Groups related DropdownMenuItems under a shared logical section. */
 declare function DropdownMenuGroup({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Group>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Group>): react_jsx_runtime143.JSX.Element;
+/**
+ * A single clickable row inside a DropdownMenuContent.
+ *
+ * @param inset - When true, adds left padding to align with items that have icons.
+ * @param variant - Visual style: `'default'` or `'destructive'`.
+ */
 declare function DropdownMenuItem({
   className,
   inset,
@@ -28,39 +60,55 @@ declare function DropdownMenuItem({
 }: React.ComponentProps<typeof DropdownMenu$1.Item> & {
   inset?: boolean;
   variant?: 'default' | 'destructive';
-}): react_jsx_runtime149.JSX.Element;
+}): react_jsx_runtime143.JSX.Element;
+/** A checkable menu item that displays a checkmark when selected. */
 declare function DropdownMenuCheckboxItem({
   className,
   children,
   checked,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.CheckboxItem>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.CheckboxItem>): react_jsx_runtime143.JSX.Element;
+/** Groups DropdownMenuRadioItems so only one can be selected at a time. */
 declare function DropdownMenuRadioGroup({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.RadioGroup>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.RadioGroup>): react_jsx_runtime143.JSX.Element;
+/** A radio-button menu item; shows a filled circle when selected. */
 declare function DropdownMenuRadioItem({
   className,
   children,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.RadioItem>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.RadioItem>): react_jsx_runtime143.JSX.Element;
+/**
+ * Non-interactive label used to describe a group of items.
+ *
+ * @param inset - When true, adds left padding to align with inset items.
+ */
 declare function DropdownMenuLabel({
   className,
   inset,
   ...props
 }: React.ComponentProps<typeof DropdownMenu$1.Label> & {
   inset?: boolean;
-}): react_jsx_runtime149.JSX.Element;
+}): react_jsx_runtime143.JSX.Element;
+/** Horizontal dividing line between groups of dropdown items. */
 declare function DropdownMenuSeparator({
   className,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Separator>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Separator>): react_jsx_runtime143.JSX.Element;
+/** Displays a keyboard shortcut hint aligned to the right of a menu item. */
 declare function DropdownMenuShortcut({
   className,
   ...props
-}: React.ComponentProps<'span'>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<'span'>): react_jsx_runtime143.JSX.Element;
+/** Root container for a nested sub-menu inside a DropdownMenu. */
 declare function DropdownMenuSub({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Sub>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Sub>): react_jsx_runtime143.JSX.Element;
+/**
+ * Menu item that reveals a nested DropdownMenuSubContent on hover or activation.
+ *
+ * @param inset - When true, adds left padding to align with inset items.
+ */
 declare function DropdownMenuSubTrigger({
   className,
   inset,
@@ -68,11 +116,12 @@ declare function DropdownMenuSubTrigger({
   ...props
 }: React.ComponentProps<typeof DropdownMenu$1.SubTrigger> & {
   inset?: boolean;
-}): react_jsx_runtime149.JSX.Element;
+}): react_jsx_runtime143.JSX.Element;
+/** Floating panel that contains the items of a nested sub-menu. */
 declare function DropdownMenuSubContent({
   className,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.SubContent>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.SubContent>): react_jsx_runtime143.JSX.Element;
 //#endregion
 export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };
 //# sourceMappingURL=dropdown-menu.d.cts.map

package/dist/ui/dropdown-menu.d.mts

@@ -1,25 +1,57 @@
-import * as react_jsx_runtime88 from "react/jsx-runtime";
+import * as react_jsx_runtime234 from "react/jsx-runtime";
 import { DropdownMenu as DropdownMenu$1 } from "radix-ui";
 
 //#region packages/components/ui/dropdown-menu.d.ts
+
+/**
+ * Root provider for the DropdownMenu — wraps all sub-components and controls open state.
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   DropdownMenu, DropdownMenuTrigger, DropdownMenuContent,
+ *   DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator,
+ * } from '@customafk/lunas-ui/ui/dropdown-menu';
+ *
+ * <DropdownMenu>
+ *   <DropdownMenuTrigger>Options</DropdownMenuTrigger>
+ *   <DropdownMenuContent>
+ *     <DropdownMenuLabel>My Account</DropdownMenuLabel>
+ *     <DropdownMenuSeparator />
+ *     <DropdownMenuItem>Profile</DropdownMenuItem>
+ *     <DropdownMenuItem variant="destructive">Delete</DropdownMenuItem>
+ *   </DropdownMenuContent>
+ * </DropdownMenu>
+ * ```
+ */
 declare function DropdownMenu({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Root>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Root>): react_jsx_runtime234.JSX.Element;
+/** Portals DropdownMenu content outside the current DOM hierarchy. */
 declare function DropdownMenuPortal({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Portal>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Portal>): react_jsx_runtime234.JSX.Element;
+/** Element that opens the DropdownMenu when activated. */
 declare function DropdownMenuTrigger({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Trigger>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Trigger>): react_jsx_runtime234.JSX.Element;
+/** Animated floating panel that contains the dropdown items. */
 declare function DropdownMenuContent({
   className,
   sideOffset,
   align,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Content>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Content>): react_jsx_runtime234.JSX.Element;
+/** Groups related DropdownMenuItems under a shared logical section. */
 declare function DropdownMenuGroup({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Group>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Group>): react_jsx_runtime234.JSX.Element;
+/**
+ * A single clickable row inside a DropdownMenuContent.
+ *
+ * @param inset - When true, adds left padding to align with items that have icons.
+ * @param variant - Visual style: `'default'` or `'destructive'`.
+ */
 declare function DropdownMenuItem({
   className,
   inset,
@@ -28,39 +60,55 @@ declare function DropdownMenuItem({
 }: React.ComponentProps<typeof DropdownMenu$1.Item> & {
   inset?: boolean;
   variant?: 'default' | 'destructive';
-}): react_jsx_runtime88.JSX.Element;
+}): react_jsx_runtime234.JSX.Element;
+/** A checkable menu item that displays a checkmark when selected. */
 declare function DropdownMenuCheckboxItem({
   className,
   children,
   checked,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.CheckboxItem>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.CheckboxItem>): react_jsx_runtime234.JSX.Element;
+/** Groups DropdownMenuRadioItems so only one can be selected at a time. */
 declare function DropdownMenuRadioGroup({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.RadioGroup>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.RadioGroup>): react_jsx_runtime234.JSX.Element;
+/** A radio-button menu item; shows a filled circle when selected. */
 declare function DropdownMenuRadioItem({
   className,
   children,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.RadioItem>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.RadioItem>): react_jsx_runtime234.JSX.Element;
+/**
+ * Non-interactive label used to describe a group of items.
+ *
+ * @param inset - When true, adds left padding to align with inset items.
+ */
 declare function DropdownMenuLabel({
   className,
   inset,
   ...props
 }: React.ComponentProps<typeof DropdownMenu$1.Label> & {
   inset?: boolean;
-}): react_jsx_runtime88.JSX.Element;
+}): react_jsx_runtime234.JSX.Element;
+/** Horizontal dividing line between groups of dropdown items. */
 declare function DropdownMenuSeparator({
   className,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Separator>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Separator>): react_jsx_runtime234.JSX.Element;
+/** Displays a keyboard shortcut hint aligned to the right of a menu item. */
 declare function DropdownMenuShortcut({
   className,
   ...props
-}: React.ComponentProps<'span'>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<'span'>): react_jsx_runtime234.JSX.Element;
+/** Root container for a nested sub-menu inside a DropdownMenu. */
 declare function DropdownMenuSub({
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Sub>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.Sub>): react_jsx_runtime234.JSX.Element;
+/**
+ * Menu item that reveals a nested DropdownMenuSubContent on hover or activation.
+ *
+ * @param inset - When true, adds left padding to align with inset items.
+ */
 declare function DropdownMenuSubTrigger({
   className,
   inset,
@@ -68,11 +116,12 @@ declare function DropdownMenuSubTrigger({
   ...props
 }: React.ComponentProps<typeof DropdownMenu$1.SubTrigger> & {
   inset?: boolean;
-}): react_jsx_runtime88.JSX.Element;
+}): react_jsx_runtime234.JSX.Element;
+/** Floating panel that contains the items of a nested sub-menu. */
 declare function DropdownMenuSubContent({
   className,
   ...props
-}: React.ComponentProps<typeof DropdownMenu$1.SubContent>): react_jsx_runtime88.JSX.Element;
+}: React.ComponentProps<typeof DropdownMenu$1.SubContent>): react_jsx_runtime234.JSX.Element;
 //#endregion
 export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };
 //# sourceMappingURL=dropdown-menu.d.mts.map

package/dist/ui/dropdown-menu.mjs

@@ -1 +1 @@
-"use client";import{a as e,c as t,d as n,f as r,h as i,i as a,l as o,m as s,n as c,o as l,p as u,r as d,s as f,t as p,u as m}from"../dropdown-menu-B8GUTfTp.mjs";export{p as DropdownMenu,c as DropdownMenuCheckboxItem,d as DropdownMenuContent,a as DropdownMenuGroup,e as DropdownMenuItem,l as DropdownMenuLabel,f as DropdownMenuPortal,t as DropdownMenuRadioGroup,o as DropdownMenuRadioItem,m as DropdownMenuSeparator,n as DropdownMenuShortcut,r as DropdownMenuSub,u as DropdownMenuSubContent,s as DropdownMenuSubTrigger,i as DropdownMenuTrigger};
+"use client";import{a as e,c as t,d as n,f as r,h as i,i as a,l as o,m as s,n as c,o as l,p as u,r as d,s as f,t as p,u as m}from"../dropdown-menu-DWSfXhHo.mjs";export{p as DropdownMenu,c as DropdownMenuCheckboxItem,d as DropdownMenuContent,a as DropdownMenuGroup,e as DropdownMenuItem,l as DropdownMenuLabel,f as DropdownMenuPortal,t as DropdownMenuRadioGroup,o as DropdownMenuRadioItem,m as DropdownMenuSeparator,n as DropdownMenuShortcut,r as DropdownMenuSub,u as DropdownMenuSubContent,s as DropdownMenuSubTrigger,i as DropdownMenuTrigger};

package/dist/ui/empty.cjs

@@ -1,2 +1,2 @@
-const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`class-variance-authority`),r=require(`react/jsx-runtime`);function i({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`empty`,className:(0,t.cn)(`flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12`,e),...n})}function a({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`empty-header`,className:(0,t.cn)(`flex max-w-sm flex-col items-center gap-2 text-center`,e),...n})}const o=(0,n.cva)(`flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0`,{variants:{variant:{default:`bg-transparent`,icon:`bg-muted-muted text-text-positive-weak flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6`}},defaultVariants:{variant:`default`}});function s({className:e,variant:n=`default`,...i}){return(0,r.jsx)(`div`,{"data-slot":`empty-icon`,"data-variant":n,className:(0,t.cn)(o({variant:n,className:e})),...i})}function c({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`empty-title`,className:(0,t.cn)(`text-lg font-medium tracking-tight`,e),...n})}function l({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`empty-description`,className:(0,t.cn)(`text-text-positive-weak [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4`,e),...n})}function u({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`empty-content`,className:(0,t.cn)(`flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance`,e),...n})}exports.Empty=i,exports.EmptyContent=u,exports.EmptyDescription=l,exports.EmptyHeader=a,exports.EmptyMedia=s,exports.EmptyTitle=c;
+const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`react/jsx-runtime`),n=require(`@customafk/react-toolkit/utils`),r=require(`class-variance-authority`);function i({className:e,...r}){return(0,t.jsx)(`div`,{"data-slot":`empty`,className:(0,n.cn)(`flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12`,e),...r})}function a({className:e,...r}){return(0,t.jsx)(`div`,{"data-slot":`empty-header`,className:(0,n.cn)(`flex max-w-sm flex-col items-center gap-2 text-center`,e),...r})}const o=(0,r.cva)(`flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0`,{variants:{variant:{default:`bg-transparent`,icon:`bg-muted-muted text-text-positive-weak flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6`}},defaultVariants:{variant:`default`}});function s({className:e,variant:r=`default`,...i}){return(0,t.jsx)(`div`,{"data-slot":`empty-icon`,"data-variant":r,className:(0,n.cn)(o({variant:r,className:e})),...i})}function c({className:e,...r}){return(0,t.jsx)(`div`,{"data-slot":`empty-title`,className:(0,n.cn)(`text-lg font-medium tracking-tight`,e),...r})}function l({className:e,...r}){return(0,t.jsx)(`div`,{"data-slot":`empty-description`,className:(0,n.cn)(`text-text-positive-weak [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4`,e),...r})}function u({className:e,...r}){return(0,t.jsx)(`div`,{"data-slot":`empty-content`,className:(0,n.cn)(`flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance`,e),...r})}exports.Empty=i,exports.EmptyContent=u,exports.EmptyDescription=l,exports.EmptyHeader=a,exports.EmptyMedia=s,exports.EmptyTitle=c;
 //# sourceMappingURL=empty.cjs.map

package/dist/ui/empty.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"empty.cjs","names":[],"sources":["../../packages/components/ui/empty.tsx"],"sourcesContent":["import { cn } from '@customafk/react-toolkit/utils';\n\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nfunction Empty({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"empty\"\n      className={cn('flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12', className)}\n      {...props}\n    />\n  );\n}\n\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"empty-header\" className={cn('flex max-w-sm flex-col items-center gap-2 text-center', className)} {...props} />;\n}\n\nconst emptyMediaVariants = cva('flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0', {\n  variants: {\n    variant: {\n      default: 'bg-transparent',\n      icon: \"bg-muted-muted text-text-positive-weak flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6\",\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nfunction EmptyMedia({ className, variant = 'default', ...props }: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>) {\n  return <div data-slot=\"empty-icon\" data-variant={variant} className={cn(emptyMediaVariants({ variant, className }))} {...props} />;\n}\n\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"empty-title\" className={cn('text-lg font-medium tracking-tight', className)} {...props} />;\n}\n\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  return (\n    <div\n      data-slot=\"empty-description\"\n      className={cn('text-text-positive-weak [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4', className)}\n      {...props}\n    />\n  );\n}\n\nfunction EmptyContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div data-slot=\"empty-content\" className={cn('flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance', className)} {...props} />\n  );\n}\n\nexport { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };\n"],"mappings":"8JAKA,SAAS,EAAM,CAAE,YAAW,GAAG,GAAsC,CACnE,OACE,EAAA,EAAA,KAAC,MAAA,CACC,YAAU,QACV,WAAA,EAAA,EAAA,IAAc,+HAAgI,EAAU,CACxJ,GAAI,GACJ,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,eAAe,WAAA,EAAA,EAAA,IAAc,wDAAyD,EAAU,CAAE,GAAI,GAAS,CAGvI,MAAM,GAAA,EAAA,EAAA,KAAyB,8FAA+F,CAC5H,SAAU,CACR,QAAS,CACP,QAAS,iBACT,KAAM,2IACP,CACF,CACD,gBAAiB,CACf,QAAS,UACV,CACF,CAAC,CAEF,SAAS,EAAW,CAAE,YAAW,UAAU,UAAW,GAAG,GAAgF,CACvI,OAAO,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,aAAa,eAAc,EAAS,WAAA,EAAA,EAAA,IAAc,EAAmB,CAAE,UAAS,YAAW,CAAC,CAAC,CAAE,GAAI,GAAS,CAGpI,SAAS,EAAW,CAAE,YAAW,GAAG,GAAsC,CACxE,OAAO,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,cAAc,WAAA,EAAA,EAAA,IAAc,qCAAsC,EAAU,CAAE,GAAI,GAAS,CAGnH,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAoC,CAC5E,OACE,EAAA,EAAA,KAAC,MAAA,CACC,YAAU,oBACV,WAAA,EAAA,EAAA,IAAc,4GAA6G,EAAU,CACrI,GAAI,GACJ,CAIN,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OACE,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,gBAAgB,WAAA,EAAA,EAAA,IAAc,gFAAiF,EAAU,CAAE,GAAI,GAAS"}
+{"version":3,"file":"empty.cjs","names":[],"sources":["../../packages/components/ui/empty.tsx"],"sourcesContent":["import { cn } from '@customafk/react-toolkit/utils';\n\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\n/**\n * Full-page or section empty-state container with centred layout and dashed border, composed with EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, and EmptyContent.\n *\n * @example\n * ```tsx\n * import {\n *   Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent,\n * } from '@customafk/lunas-ui/ui/empty';\n * import { SearchX } from 'lucide-react';\n *\n * <Empty>\n *   <EmptyHeader>\n *     <EmptyMedia variant=\"icon\"><SearchX /></EmptyMedia>\n *     <EmptyTitle>No results found</EmptyTitle>\n *     <EmptyDescription>Try adjusting your search filters.</EmptyDescription>\n *   </EmptyHeader>\n *   <EmptyContent>\n *     <button>Reset filters</button>\n *   </EmptyContent>\n * </Empty>\n * ```\n */\nfunction Empty({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"empty\"\n      className={cn('flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12', className)}\n      {...props}\n    />\n  );\n}\n\n/** Centred column container for the media, title, and description of an empty state. */\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"empty-header\" className={cn('flex max-w-sm flex-col items-center gap-2 text-center', className)} {...props} />;\n}\n\nconst emptyMediaVariants = cva('flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0', {\n  variants: {\n    variant: {\n      default: 'bg-transparent',\n      icon: \"bg-muted-muted text-text-positive-weak flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6\",\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\n/**\n * Container for the visual element (illustration, icon, or image) in an empty state.\n *\n * @param variant - `'default'` renders a transparent wrapper; `'icon'` renders a rounded muted square with the icon centred inside.\n */\nfunction EmptyMedia({ className, variant = 'default', ...props }: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>) {\n  return <div data-slot=\"empty-icon\" data-variant={variant} className={cn(emptyMediaVariants({ variant, className }))} {...props} />;\n}\n\n/** Prominent heading text for the empty state. */\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"empty-title\" className={cn('text-lg font-medium tracking-tight', className)} {...props} />;\n}\n\n/** Supporting body text that explains the empty state to the user. */\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  return (\n    <div\n      data-slot=\"empty-description\"\n      className={cn('text-text-positive-weak [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4', className)}\n      {...props}\n    />\n  );\n}\n\n/** Action area below the header — typically holds buttons or links to help the user proceed. */\nfunction EmptyContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div data-slot=\"empty-content\" className={cn('flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance', className)} {...props} />\n  );\n}\n\nexport { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };\n"],"mappings":"8JA2BA,SAAS,EAAM,CAAE,YAAW,GAAG,GAAsC,CACnE,OACE,EAAA,EAAA,KAAC,MAAA,CACC,YAAU,QACV,WAAA,EAAA,EAAA,IAAc,+HAAgI,EAAU,CACxJ,GAAI,GACJ,CAKN,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,eAAe,WAAA,EAAA,EAAA,IAAc,wDAAyD,EAAU,CAAE,GAAI,GAAS,CAGvI,MAAM,GAAA,EAAA,EAAA,KAAyB,8FAA+F,CAC5H,SAAU,CACR,QAAS,CACP,QAAS,iBACT,KAAM,2IACP,CACF,CACD,gBAAiB,CACf,QAAS,UACV,CACF,CAAC,CAOF,SAAS,EAAW,CAAE,YAAW,UAAU,UAAW,GAAG,GAAgF,CACvI,OAAO,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,aAAa,eAAc,EAAS,WAAA,EAAA,EAAA,IAAc,EAAmB,CAAE,UAAS,YAAW,CAAC,CAAC,CAAE,GAAI,GAAS,CAIpI,SAAS,EAAW,CAAE,YAAW,GAAG,GAAsC,CACxE,OAAO,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,cAAc,WAAA,EAAA,EAAA,IAAc,qCAAsC,EAAU,CAAE,GAAI,GAAS,CAInH,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAoC,CAC5E,OACE,EAAA,EAAA,KAAC,MAAA,CACC,YAAU,oBACV,WAAA,EAAA,EAAA,IAAc,4GAA6G,EAAU,CACrI,GAAI,GACJ,CAKN,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OACE,EAAA,EAAA,KAAC,MAAA,CAAI,YAAU,gBAAgB,WAAA,EAAA,EAAA,IAAc,gFAAiF,EAAU,CAAE,GAAI,GAAS"}

package/dist/ui/empty.d.cts

@@ -1,36 +1,68 @@
-import * as react_jsx_runtime107 from "react/jsx-runtime";
-import * as class_variance_authority_types4 from "class-variance-authority/types";
+import * as react_jsx_runtime90 from "react/jsx-runtime";
+import * as class_variance_authority_types5 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 
 //#region packages/components/ui/empty.d.ts
+
+/**
+ * Full-page or section empty-state container with centred layout and dashed border, composed with EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, and EmptyContent.
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent,
+ * } from '@customafk/lunas-ui/ui/empty';
+ * import { SearchX } from 'lucide-react';
+ *
+ * <Empty>
+ *   <EmptyHeader>
+ *     <EmptyMedia variant="icon"><SearchX /></EmptyMedia>
+ *     <EmptyTitle>No results found</EmptyTitle>
+ *     <EmptyDescription>Try adjusting your search filters.</EmptyDescription>
+ *   </EmptyHeader>
+ *   <EmptyContent>
+ *     <button>Reset filters</button>
+ *   </EmptyContent>
+ * </Empty>
+ * ```
+ */
 declare function Empty({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime107.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime90.JSX.Element;
+/** Centred column container for the media, title, and description of an empty state. */
 declare function EmptyHeader({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime107.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime90.JSX.Element;
 declare const emptyMediaVariants: (props?: ({
   variant?: "default" | "icon" | null | undefined;
-} & class_variance_authority_types4.ClassProp) | undefined) => string;
+} & class_variance_authority_types5.ClassProp) | undefined) => string;
+/**
+ * Container for the visual element (illustration, icon, or image) in an empty state.
+ *
+ * @param variant - `'default'` renders a transparent wrapper; `'icon'` renders a rounded muted square with the icon centred inside.
+ */
 declare function EmptyMedia({
   className,
   variant,
   ...props
-}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime107.JSX.Element;
+}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime90.JSX.Element;
+/** Prominent heading text for the empty state. */
 declare function EmptyTitle({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime107.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime90.JSX.Element;
+/** Supporting body text that explains the empty state to the user. */
 declare function EmptyDescription({
   className,
   ...props
-}: React.ComponentProps<'p'>): react_jsx_runtime107.JSX.Element;
+}: React.ComponentProps<'p'>): react_jsx_runtime90.JSX.Element;
+/** Action area below the header — typically holds buttons or links to help the user proceed. */
 declare function EmptyContent({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime107.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime90.JSX.Element;
 //#endregion
 export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle };
 //# sourceMappingURL=empty.d.cts.map

package/dist/ui/empty.d.mts

@@ -1,36 +1,68 @@
+import * as react_jsx_runtime70 from "react/jsx-runtime";
 import { VariantProps } from "class-variance-authority";
-import * as react_jsx_runtime46 from "react/jsx-runtime";
-import * as class_variance_authority_types2 from "class-variance-authority/types";
+import * as class_variance_authority_types5 from "class-variance-authority/types";
 
 //#region packages/components/ui/empty.d.ts
+
+/**
+ * Full-page or section empty-state container with centred layout and dashed border, composed with EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, and EmptyContent.
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent,
+ * } from '@customafk/lunas-ui/ui/empty';
+ * import { SearchX } from 'lucide-react';
+ *
+ * <Empty>
+ *   <EmptyHeader>
+ *     <EmptyMedia variant="icon"><SearchX /></EmptyMedia>
+ *     <EmptyTitle>No results found</EmptyTitle>
+ *     <EmptyDescription>Try adjusting your search filters.</EmptyDescription>
+ *   </EmptyHeader>
+ *   <EmptyContent>
+ *     <button>Reset filters</button>
+ *   </EmptyContent>
+ * </Empty>
+ * ```
+ */
 declare function Empty({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime46.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime70.JSX.Element;
+/** Centred column container for the media, title, and description of an empty state. */
 declare function EmptyHeader({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime46.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime70.JSX.Element;
 declare const emptyMediaVariants: (props?: ({
   variant?: "default" | "icon" | null | undefined;
-} & class_variance_authority_types2.ClassProp) | undefined) => string;
+} & class_variance_authority_types5.ClassProp) | undefined) => string;
+/**
+ * Container for the visual element (illustration, icon, or image) in an empty state.
+ *
+ * @param variant - `'default'` renders a transparent wrapper; `'icon'` renders a rounded muted square with the icon centred inside.
+ */
 declare function EmptyMedia({
   className,
   variant,
   ...props
-}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime46.JSX.Element;
+}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime70.JSX.Element;
+/** Prominent heading text for the empty state. */
 declare function EmptyTitle({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime46.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime70.JSX.Element;
+/** Supporting body text that explains the empty state to the user. */
 declare function EmptyDescription({
   className,
   ...props
-}: React.ComponentProps<'p'>): react_jsx_runtime46.JSX.Element;
+}: React.ComponentProps<'p'>): react_jsx_runtime70.JSX.Element;
+/** Action area below the header — typically holds buttons or links to help the user proceed. */
 declare function EmptyContent({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime46.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime70.JSX.Element;
 //#endregion
 export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle };
 //# sourceMappingURL=empty.d.mts.map

package/dist/ui/empty.mjs

@@ -1,2 +1,2 @@
-import{cn as e}from"@customafk/react-toolkit/utils";import{cva as t}from"class-variance-authority";import{jsx as n}from"react/jsx-runtime";function r({className:t,...r}){return n(`div`,{"data-slot":`empty`,className:e(`flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12`,t),...r})}function i({className:t,...r}){return n(`div`,{"data-slot":`empty-header`,className:e(`flex max-w-sm flex-col items-center gap-2 text-center`,t),...r})}const a=t(`flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0`,{variants:{variant:{default:`bg-transparent`,icon:`bg-muted-muted text-text-positive-weak flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6`}},defaultVariants:{variant:`default`}});function o({className:t,variant:r=`default`,...i}){return n(`div`,{"data-slot":`empty-icon`,"data-variant":r,className:e(a({variant:r,className:t})),...i})}function s({className:t,...r}){return n(`div`,{"data-slot":`empty-title`,className:e(`text-lg font-medium tracking-tight`,t),...r})}function c({className:t,...r}){return n(`div`,{"data-slot":`empty-description`,className:e(`text-text-positive-weak [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4`,t),...r})}function l({className:t,...r}){return n(`div`,{"data-slot":`empty-content`,className:e(`flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance`,t),...r})}export{r as Empty,l as EmptyContent,c as EmptyDescription,i as EmptyHeader,o as EmptyMedia,s as EmptyTitle};
+import{jsx as e}from"react/jsx-runtime";import{cn as t}from"@customafk/react-toolkit/utils";import{cva as n}from"class-variance-authority";function r({className:n,...r}){return e(`div`,{"data-slot":`empty`,className:t(`flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12`,n),...r})}function i({className:n,...r}){return e(`div`,{"data-slot":`empty-header`,className:t(`flex max-w-sm flex-col items-center gap-2 text-center`,n),...r})}const a=n(`flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0`,{variants:{variant:{default:`bg-transparent`,icon:`bg-muted-muted text-text-positive-weak flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6`}},defaultVariants:{variant:`default`}});function o({className:n,variant:r=`default`,...i}){return e(`div`,{"data-slot":`empty-icon`,"data-variant":r,className:t(a({variant:r,className:n})),...i})}function s({className:n,...r}){return e(`div`,{"data-slot":`empty-title`,className:t(`text-lg font-medium tracking-tight`,n),...r})}function c({className:n,...r}){return e(`div`,{"data-slot":`empty-description`,className:t(`text-text-positive-weak [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4`,n),...r})}function l({className:n,...r}){return e(`div`,{"data-slot":`empty-content`,className:t(`flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance`,n),...r})}export{r as Empty,l as EmptyContent,c as EmptyDescription,i as EmptyHeader,o as EmptyMedia,s as EmptyTitle};
 //# sourceMappingURL=empty.mjs.map

package/dist/ui/empty.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"empty.mjs","names":[],"sources":["../../packages/components/ui/empty.tsx"],"sourcesContent":["import { cn } from '@customafk/react-toolkit/utils';\n\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nfunction Empty({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"empty\"\n      className={cn('flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12', className)}\n      {...props}\n    />\n  );\n}\n\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"empty-header\" className={cn('flex max-w-sm flex-col items-center gap-2 text-center', className)} {...props} />;\n}\n\nconst emptyMediaVariants = cva('flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0', {\n  variants: {\n    variant: {\n      default: 'bg-transparent',\n      icon: \"bg-muted-muted text-text-positive-weak flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6\",\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nfunction EmptyMedia({ className, variant = 'default', ...props }: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>) {\n  return <div data-slot=\"empty-icon\" data-variant={variant} className={cn(emptyMediaVariants({ variant, className }))} {...props} />;\n}\n\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"empty-title\" className={cn('text-lg font-medium tracking-tight', className)} {...props} />;\n}\n\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  return (\n    <div\n      data-slot=\"empty-description\"\n      className={cn('text-text-positive-weak [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4', className)}\n      {...props}\n    />\n  );\n}\n\nfunction EmptyContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div data-slot=\"empty-content\" className={cn('flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance', className)} {...props} />\n  );\n}\n\nexport { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };\n"],"mappings":"2IAKA,SAAS,EAAM,CAAE,YAAW,GAAG,GAAsC,CACnE,OACE,EAAC,MAAA,CACC,YAAU,QACV,UAAW,EAAG,+HAAgI,EAAU,CACxJ,GAAI,GACJ,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAC,MAAA,CAAI,YAAU,eAAe,UAAW,EAAG,wDAAyD,EAAU,CAAE,GAAI,GAAS,CAGvI,MAAM,EAAqB,EAAI,8FAA+F,CAC5H,SAAU,CACR,QAAS,CACP,QAAS,iBACT,KAAM,2IACP,CACF,CACD,gBAAiB,CACf,QAAS,UACV,CACF,CAAC,CAEF,SAAS,EAAW,CAAE,YAAW,UAAU,UAAW,GAAG,GAAgF,CACvI,OAAO,EAAC,MAAA,CAAI,YAAU,aAAa,eAAc,EAAS,UAAW,EAAG,EAAmB,CAAE,UAAS,YAAW,CAAC,CAAC,CAAE,GAAI,GAAS,CAGpI,SAAS,EAAW,CAAE,YAAW,GAAG,GAAsC,CACxE,OAAO,EAAC,MAAA,CAAI,YAAU,cAAc,UAAW,EAAG,qCAAsC,EAAU,CAAE,GAAI,GAAS,CAGnH,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAoC,CAC5E,OACE,EAAC,MAAA,CACC,YAAU,oBACV,UAAW,EAAG,4GAA6G,EAAU,CACrI,GAAI,GACJ,CAIN,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OACE,EAAC,MAAA,CAAI,YAAU,gBAAgB,UAAW,EAAG,gFAAiF,EAAU,CAAE,GAAI,GAAS"}
+{"version":3,"file":"empty.mjs","names":[],"sources":["../../packages/components/ui/empty.tsx"],"sourcesContent":["import { cn } from '@customafk/react-toolkit/utils';\n\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\n/**\n * Full-page or section empty-state container with centred layout and dashed border, composed with EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, and EmptyContent.\n *\n * @example\n * ```tsx\n * import {\n *   Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent,\n * } from '@customafk/lunas-ui/ui/empty';\n * import { SearchX } from 'lucide-react';\n *\n * <Empty>\n *   <EmptyHeader>\n *     <EmptyMedia variant=\"icon\"><SearchX /></EmptyMedia>\n *     <EmptyTitle>No results found</EmptyTitle>\n *     <EmptyDescription>Try adjusting your search filters.</EmptyDescription>\n *   </EmptyHeader>\n *   <EmptyContent>\n *     <button>Reset filters</button>\n *   </EmptyContent>\n * </Empty>\n * ```\n */\nfunction Empty({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"empty\"\n      className={cn('flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12', className)}\n      {...props}\n    />\n  );\n}\n\n/** Centred column container for the media, title, and description of an empty state. */\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"empty-header\" className={cn('flex max-w-sm flex-col items-center gap-2 text-center', className)} {...props} />;\n}\n\nconst emptyMediaVariants = cva('flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0', {\n  variants: {\n    variant: {\n      default: 'bg-transparent',\n      icon: \"bg-muted-muted text-text-positive-weak flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6\",\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\n/**\n * Container for the visual element (illustration, icon, or image) in an empty state.\n *\n * @param variant - `'default'` renders a transparent wrapper; `'icon'` renders a rounded muted square with the icon centred inside.\n */\nfunction EmptyMedia({ className, variant = 'default', ...props }: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>) {\n  return <div data-slot=\"empty-icon\" data-variant={variant} className={cn(emptyMediaVariants({ variant, className }))} {...props} />;\n}\n\n/** Prominent heading text for the empty state. */\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot=\"empty-title\" className={cn('text-lg font-medium tracking-tight', className)} {...props} />;\n}\n\n/** Supporting body text that explains the empty state to the user. */\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  return (\n    <div\n      data-slot=\"empty-description\"\n      className={cn('text-text-positive-weak [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4', className)}\n      {...props}\n    />\n  );\n}\n\n/** Action area below the header — typically holds buttons or links to help the user proceed. */\nfunction EmptyContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div data-slot=\"empty-content\" className={cn('flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance', className)} {...props} />\n  );\n}\n\nexport { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };\n"],"mappings":"2IA2BA,SAAS,EAAM,CAAE,YAAW,GAAG,GAAsC,CACnE,OACE,EAAC,MAAA,CACC,YAAU,QACV,UAAW,EAAG,+HAAgI,EAAU,CACxJ,GAAI,GACJ,CAKN,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAO,EAAC,MAAA,CAAI,YAAU,eAAe,UAAW,EAAG,wDAAyD,EAAU,CAAE,GAAI,GAAS,CAGvI,MAAM,EAAqB,EAAI,8FAA+F,CAC5H,SAAU,CACR,QAAS,CACP,QAAS,iBACT,KAAM,2IACP,CACF,CACD,gBAAiB,CACf,QAAS,UACV,CACF,CAAC,CAOF,SAAS,EAAW,CAAE,YAAW,UAAU,UAAW,GAAG,GAAgF,CACvI,OAAO,EAAC,MAAA,CAAI,YAAU,aAAa,eAAc,EAAS,UAAW,EAAG,EAAmB,CAAE,UAAS,YAAW,CAAC,CAAC,CAAE,GAAI,GAAS,CAIpI,SAAS,EAAW,CAAE,YAAW,GAAG,GAAsC,CACxE,OAAO,EAAC,MAAA,CAAI,YAAU,cAAc,UAAW,EAAG,qCAAsC,EAAU,CAAE,GAAI,GAAS,CAInH,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAoC,CAC5E,OACE,EAAC,MAAA,CACC,YAAU,oBACV,UAAW,EAAG,4GAA6G,EAAU,CACrI,GAAI,GACJ,CAKN,SAAS,EAAa,CAAE,YAAW,GAAG,GAAsC,CAC1E,OACE,EAAC,MAAA,CAAI,YAAU,gBAAgB,UAAW,EAAG,gFAAiF,EAAU,CAAE,GAAI,GAAS"}

package/dist/ui/field.cjs

@@ -1,2 +1 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`../separator-C3ip6sbh.cjs`),n=require(`../label-BzfsTrVt.cjs`);let r=require(`@customafk/react-toolkit/utils`),i=require(`class-variance-authority`),a=require(`react`),o=require(`react/jsx-runtime`),s=require(`lucide-react`);const c=(0,a.memo)(({className:e,...t})=>(0,o.jsx)(`fieldset`,{"data-slot":`field-set`,className:(0,r.cn)(`flex flex-col gap-6`,`has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3`,e),...t}));c.displayName=`FieldSet`;const l=(0,a.memo)(({className:e,variant:t=`legend`,...n})=>(0,o.jsx)(`legend`,{"data-slot":`field-legend`,"data-variant":t,className:(0,r.cn)(`mb-3 font-medium`,`data-[variant=legend]:text-base`,`data-[variant=label]:text-sm`,e),...n}));l.displayName=`FieldLegend`;const u=(0,a.memo)(({className:e,...t})=>(0,o.jsx)(`div`,{"data-slot":`field-group`,className:(0,r.cn)(`group/field-group @container/field-group flex w-full flex-col gap-7 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4`,e),...t}));u.displayName=`FieldGroup`;const d=(0,i.cva)(`group/field flex w-full gap-3 data-[invalid=true]:text-destructive`,{variants:{orientation:{vertical:[`flex-col *:w-full [&>.sr-only]:w-auto`],horizontal:[`flex-row items-center`,`*:data-[slot=field-label]:flex-auto`,`has-[>[data-slot=field-content]]:items-start`,`has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`],responsive:[`flex-col *:w-full [&>.sr-only]:w-auto`,`@md/field-group:flex-row`,`@md/field-group:items-center`,`@md/field-group:*:w-auto`,`@md/field-group:*:data-[slot=field-label]:flex-auto`,`@md/field-group:has-[>[data-slot=field-content]]:items-start`,`@md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`]}},defaultVariants:{orientation:`vertical`}}),f=(0,a.memo)(({className:e,orientation:t=`vertical`,...n})=>(0,o.jsx)(`div`,{"data-slot":`field`,"data-orientation":t,className:(0,r.cn)(d({orientation:t}),e),...n}));f.displayName=`Field`;const p=(0,a.memo)(({className:e,...t})=>(0,o.jsx)(`div`,{"data-slot":`field-content`,className:(0,r.cn)(`group/field-content flex basis-2/5 flex-col gap-1.5 leading-snug`,e),...t}));p.displayName=`FieldContent`;const m=(0,a.memo)(({className:e,...t})=>(0,o.jsx)(n.t,{"data-slot":`field-label`,className:(0,r.cn)(`group/field-label peer/field-label flex w-fit gap-2 leading-snug`,`group-data-[disabled=true]/field:opacity-50`,`has-[>[data-slot=field]]:w-full`,`has-[>[data-slot=field]]:flex-col`,`has-[>[data-slot=field]]:rounded-md`,`has-[>[data-slot=field]]:border`,`*:data-[slot=field]:p-4`,`has-data-[state=checked]:bg-primary/5`,`has-data-[state=checked]:border-primary`,e),...t}));m.displayName=`FieldLabel`;const h=(0,a.memo)(({className:e,...t})=>(0,o.jsx)(`div`,{"data-slot":`field-label`,className:(0,r.cn)(`flex w-fit items-center gap-2 font-medium text-sm leading-snug group-data-[disabled=true]/field:opacity-50`,e),...t}));h.displayName=`FieldTitle`;const g=(0,a.memo)(({className:e,...t})=>(0,o.jsx)(`p`,{"data-slot":`field-description`,className:(0,r.cn)(`text-text-positive-weak text-sm leading-normal font-normal group-has-data-[orientation=horizontal]/field:text-balance`,`last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5`,`[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4`,e),...t}));g.displayName=`FieldDescription`;const _=(0,a.memo)(({children:e,className:n,...i})=>(0,o.jsxs)(`div`,{"data-slot":`field-separator`,"data-content":!!e,className:(0,r.cn)(`relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2`,n),...i,children:[(0,o.jsx)(t.t,{className:`absolute inset-0 top-1/2`}),e&&(0,o.jsx)(`span`,{className:`relative mx-auto block w-fit bg-background px-2 text-text-positive-weak`,"data-slot":`field-separator-content`,children:e})]}));_.displayName=`FieldSeparator`;const v=(0,a.memo)(({className:e,children:t,errors:n,...i})=>{let c=(0,a.useMemo)(()=>t||(n?n?.length===1&&n[0]?.message?(0,o.jsxs)(`div`,{className:`flex flex-row items-center justify-start gap-x-0.5`,children:[(0,o.jsx)(s.BanIcon,{size:14}),(0,o.jsx)(`p`,{children:n[0].message})]}):(0,o.jsx)(`ul`,{className:`ml-4 flex list-disc flex-col gap-1`,children:n.map(e=>typeof e==`string`?(0,o.jsx)(`li`,{children:e},e):e?.message?(0,o.jsx)(`li`,{children:e.message},e.message):null)}):null),[t,n]);return c?(0,o.jsx)(`div`,{role:`alert`,"data-slot":`field-error`,className:(0,r.cn)(`w-full font-normal text-danger text-xs`,e),...i,children:c}):null});v.displayName=`FieldError`,exports.Field=f,exports.FieldContent=p,exports.FieldDescription=g,exports.FieldError=v,exports.FieldGroup=u,exports.FieldLabel=m,exports.FieldLegend=l,exports.FieldSeparator=_,exports.FieldSet=c,exports.FieldTitle=h;
-//# sourceMappingURL=field.cjs.map
+"use client";require(`../separator-BwZb12bh.cjs`),require(`../label-DkMTQ3Ch.cjs`);const e=require(`../field-CppNvoxV.cjs`);exports.Field=e.t,exports.FieldContent=e.n,exports.FieldDescription=e.r,exports.FieldError=e.i,exports.FieldGroup=e.a,exports.FieldLabel=e.o,exports.FieldLegend=e.s,exports.FieldSeparator=e.c,exports.FieldSet=e.l,exports.FieldTitle=e.u;

package/dist/ui/field.d.cts

@@ -1,56 +1,56 @@
 import { Label } from "./label.cjs";
-import * as react_jsx_runtime133 from "react/jsx-runtime";
+import * as react_jsx_runtime121 from "react/jsx-runtime";
+import * as class_variance_authority_types6 from "class-variance-authority/types";
 import * as react1 from "react";
-import * as class_variance_authority_types5 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 
 //#region packages/components/ui/field.d.ts
 declare const FieldSet: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"fieldset">) => react_jsx_runtime133.JSX.Element>;
+}: React.ComponentProps<"fieldset">) => react_jsx_runtime121.JSX.Element>;
 declare const FieldLegend: react1.MemoExoticComponent<({
   className,
   variant,
   ...props
 }: React.ComponentProps<"legend"> & {
   variant?: "legend" | "label";
-}) => react_jsx_runtime133.JSX.Element>;
+}) => react_jsx_runtime121.JSX.Element>;
 declare const FieldGroup: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"div">) => react_jsx_runtime133.JSX.Element>;
+}: React.ComponentProps<"div">) => react_jsx_runtime121.JSX.Element>;
 declare const fieldVariants: (props?: ({
   orientation?: "vertical" | "horizontal" | "responsive" | null | undefined;
-} & class_variance_authority_types5.ClassProp) | undefined) => string;
+} & class_variance_authority_types6.ClassProp) | undefined) => string;
 declare const Field: react1.MemoExoticComponent<({
   className,
   orientation,
   ...props
-}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>) => react_jsx_runtime133.JSX.Element>;
+}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>) => react_jsx_runtime121.JSX.Element>;
 declare const FieldContent: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"div">) => react_jsx_runtime133.JSX.Element>;
+}: React.ComponentProps<"div">) => react_jsx_runtime121.JSX.Element>;
 declare const FieldLabel: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<typeof Label>) => react_jsx_runtime133.JSX.Element>;
+}: React.ComponentProps<typeof Label>) => react_jsx_runtime121.JSX.Element>;
 declare const FieldTitle: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"div">) => react_jsx_runtime133.JSX.Element>;
+}: React.ComponentProps<"div">) => react_jsx_runtime121.JSX.Element>;
 declare const FieldDescription: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"p">) => react_jsx_runtime133.JSX.Element>;
+}: React.ComponentProps<"p">) => react_jsx_runtime121.JSX.Element>;
 declare const FieldSeparator: react1.MemoExoticComponent<({
   children,
   className,
   ...props
 }: React.ComponentProps<"div"> & {
   children?: React.ReactNode;
-}) => react_jsx_runtime133.JSX.Element>;
+}) => react_jsx_runtime121.JSX.Element>;
 declare const FieldError: react1.MemoExoticComponent<({
   className,
   children,
@@ -60,7 +60,7 @@ declare const FieldError: react1.MemoExoticComponent<({
   errors?: Array<{
     message?: string;
   } | undefined>;
-}) => react_jsx_runtime133.JSX.Element | null>;
+}) => react_jsx_runtime121.JSX.Element | null>;
 //#endregion
 export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle };
 //# sourceMappingURL=field.d.cts.map