@customafk/lunas-ui 0.2.51 → 0.2.53

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

@@ -1,127 +1,2 @@
-import * as react59 from "react";
-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>): react59.JSX.Element;
-/** Portals DropdownMenu content outside the current DOM hierarchy. */
-declare function DropdownMenuPortal({
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Portal>): react59.JSX.Element;
-/** Element that opens the DropdownMenu when activated. */
-declare function DropdownMenuTrigger({
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Trigger>): react59.JSX.Element;
-/** Animated floating panel that contains the dropdown items. */
-declare function DropdownMenuContent({
-  className,
-  sideOffset,
-  align,
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Content>): react59.JSX.Element;
-/** Groups related DropdownMenuItems under a shared logical section. */
-declare function DropdownMenuGroup({
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Group>): react59.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,
-  variant,
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Item> & {
-  inset?: boolean;
-  variant?: 'default' | 'destructive';
-}): react59.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>): react59.JSX.Element;
-/** Groups DropdownMenuRadioItems so only one can be selected at a time. */
-declare function DropdownMenuRadioGroup({
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.RadioGroup>): react59.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>): react59.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;
-}): react59.JSX.Element;
-/** Horizontal dividing line between groups of dropdown items. */
-declare function DropdownMenuSeparator({
-  className,
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Separator>): react59.JSX.Element;
-/** Displays a keyboard shortcut hint aligned to the right of a menu item. */
-declare function DropdownMenuShortcut({
-  className,
-  ...props
-}: React.ComponentProps<'span'>): react59.JSX.Element;
-/** Root container for a nested sub-menu inside a DropdownMenu. */
-declare function DropdownMenuSub({
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.Sub>): react59.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,
-  children,
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.SubTrigger> & {
-  inset?: boolean;
-}): react59.JSX.Element;
-/** Floating panel that contains the items of a nested sub-menu. */
-declare function DropdownMenuSubContent({
-  className,
-  ...props
-}: React.ComponentProps<typeof DropdownMenu$1.SubContent>): react59.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
+import { a as DropdownMenuItem, c as DropdownMenuRadioGroup, d as DropdownMenuShortcut, f as DropdownMenuSub, h as DropdownMenuTrigger, i as DropdownMenuGroup, l as DropdownMenuRadioItem, m as DropdownMenuSubTrigger, n as DropdownMenuCheckboxItem, o as DropdownMenuLabel, p as DropdownMenuSubContent, r as DropdownMenuContent, s as DropdownMenuPortal, t as DropdownMenu, u as DropdownMenuSeparator } from "../dropdown-menu-CpA9s4II.cjs";
+export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };

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

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

package/dist/ui/dropdown-menu.mjs

@@ -0,0 +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-DhKquziD.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 @@
-const e=require(`../chunk-350yNsax.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;
-//# sourceMappingURL=empty.cjs.map
+const e=require(`../empty-dUZoxaBx.cjs`);exports.Empty=e.t,exports.EmptyContent=e.n,exports.EmptyDescription=e.r,exports.EmptyHeader=e.i,exports.EmptyMedia=e.a,exports.EmptyTitle=e.o;

package/dist/ui/empty.d.cts

@@ -1,68 +1,2 @@
-import * as react246 from "react";
-import * as class_variance_authority_types8 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'>): react246.JSX.Element;
-/** Centred column container for the media, title, and description of an empty state. */
-declare function EmptyHeader({
-  className,
-  ...props
-}: React.ComponentProps<'div'>): react246.JSX.Element;
-declare const emptyMediaVariants: (props?: ({
-  variant?: "default" | "icon" | null | undefined;
-} & class_variance_authority_types8.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>): react246.JSX.Element;
-/** Prominent heading text for the empty state. */
-declare function EmptyTitle({
-  className,
-  ...props
-}: React.ComponentProps<'div'>): react246.JSX.Element;
-/** Supporting body text that explains the empty state to the user. */
-declare function EmptyDescription({
-  className,
-  ...props
-}: React.ComponentProps<'p'>): react246.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'>): react246.JSX.Element;
-//#endregion
-export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle };
-//# sourceMappingURL=empty.d.cts.map
+import { a as EmptyMedia, i as EmptyHeader, n as EmptyContent, o as EmptyTitle, r as EmptyDescription, t as Empty } from "../empty-DaK_4UmN.cjs";
+export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle };

package/dist/ui/empty.d.mts

@@ -0,0 +1,2 @@
+import { a as EmptyMedia, i as EmptyHeader, n as EmptyContent, o as EmptyTitle, r as EmptyDescription, t as Empty } from "../empty-BhV9ASYf.mjs";
+export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle };

package/dist/ui/empty.mjs

@@ -0,0 +1 @@
+import{a as e,i as t,n,o as r,r as i,t as a}from"../empty-D6t3C3WX.mjs";export{a as Empty,n as EmptyContent,i as EmptyDescription,t as EmptyHeader,e as EmptyMedia,r as EmptyTitle};

package/dist/ui/field.cjs

@@ -1 +1 @@
-"use client";require(`../separator-KuymG9g0.cjs`),require(`../label-CC6fXVbC.cjs`);const e=require(`../field-BrlETeXX.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;
+"use client";require(`../separator-BRoS5sU8.cjs`),require(`../label--hinNDHW.cjs`);const e=require(`../field-fIef7NR0.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 react116 from "react";
-import * as class_variance_authority_types5 from "class-variance-authority/types";
+import { t as Label } from "../label-DGJL4U_f.cjs";
+import * as react161 from "react";
+import * as class_variance_authority_types6 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 
 //#region packages/components/ui/field.d.ts
-declare const FieldSet: react116.MemoExoticComponent<({
+declare const FieldSet: react161.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"fieldset">) => react116.JSX.Element>;
-declare const FieldLegend: react116.MemoExoticComponent<({
+}: React.ComponentProps<"fieldset">) => react161.JSX.Element>;
+declare const FieldLegend: react161.MemoExoticComponent<({
   className,
   variant,
   ...props
 }: React.ComponentProps<"legend"> & {
   variant?: "legend" | "label";
-}) => react116.JSX.Element>;
-declare const FieldGroup: react116.MemoExoticComponent<({
+}) => react161.JSX.Element>;
+declare const FieldGroup: react161.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"div">) => react116.JSX.Element>;
+}: React.ComponentProps<"div">) => react161.JSX.Element>;
 declare const fieldVariants: (props?: ({
   orientation?: "vertical" | "horizontal" | "responsive" | null | undefined;
-} & class_variance_authority_types5.ClassProp) | undefined) => string;
-declare const Field: react116.MemoExoticComponent<({
+} & class_variance_authority_types6.ClassProp) | undefined) => string;
+declare const Field: react161.MemoExoticComponent<({
   className,
   orientation,
   ...props
-}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>) => react116.JSX.Element>;
-declare const FieldContent: react116.MemoExoticComponent<({
+}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>) => react161.JSX.Element>;
+declare const FieldContent: react161.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"div">) => react116.JSX.Element>;
-declare const FieldLabel: react116.MemoExoticComponent<({
+}: React.ComponentProps<"div">) => react161.JSX.Element>;
+declare const FieldLabel: react161.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<typeof Label>) => react116.JSX.Element>;
-declare const FieldTitle: react116.MemoExoticComponent<({
+}: React.ComponentProps<typeof Label>) => react161.JSX.Element>;
+declare const FieldTitle: react161.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"div">) => react116.JSX.Element>;
-declare const FieldDescription: react116.MemoExoticComponent<({
+}: React.ComponentProps<"div">) => react161.JSX.Element>;
+declare const FieldDescription: react161.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"p">) => react116.JSX.Element>;
-declare const FieldSeparator: react116.MemoExoticComponent<({
+}: React.ComponentProps<"p">) => react161.JSX.Element>;
+declare const FieldSeparator: react161.MemoExoticComponent<({
   children,
   className,
   ...props
 }: React.ComponentProps<"div"> & {
   children?: React.ReactNode;
-}) => react116.JSX.Element>;
-declare const FieldError: react116.MemoExoticComponent<({
+}) => react161.JSX.Element>;
+declare const FieldError: react161.MemoExoticComponent<({
   className,
   children,
   errors,
@@ -59,7 +59,7 @@ declare const FieldError: react116.MemoExoticComponent<({
   errors?: Array<{
     message?: string;
   } | undefined>;
-}) => react116.JSX.Element | null>;
+}) => react161.JSX.Element | null>;
 //#endregion
 export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle };
 //# sourceMappingURL=field.d.cts.map

package/dist/ui/field.d.mts

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

package/dist/ui/field.mjs

@@ -0,0 +1 @@
+"use client";import"../separator-BjRgoiEx.mjs";import"../label-BMVyfKu9.mjs";import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c,u as l}from"../field-BxYoF5AX.mjs";export{c as Field,i as FieldContent,o as FieldDescription,n as FieldError,e as FieldGroup,a as FieldLabel,s as FieldLegend,t as FieldSeparator,r as FieldSet,l as FieldTitle};

package/dist/ui/file-uploader.cjs

@@ -1,3 +1 @@
-"use client";const e=require(`../chunk-350yNsax.cjs`);require(`../button.variants-4kw6plrv.cjs`);const t=require(`../button-C--DAN1D.cjs`),n=require(`../progress-gvBqNiHp.cjs`);let r=require(`lucide-react`),i=require(`react`),a=require(`@customafk/react-toolkit/utils`),o=require(`react/jsx-runtime`),s=require(`react-dropzone`);s=e.n(s);let c=require(`@customafk/react-toolkit/hooks/useControllableState`),l=require(`sonner`);function u(e){let{value:t,onValueChange:n,onUpload:u,progresses:p,accept:m={"image/*":[]},maxSize:h=1024*1024*2,maxFileCount:g=1,multiple:_=!1,disabled:v=!1,showText:y=!0,iconSize:b,className:x,...S}=e,[C,w]=(0,c.useControllableState)({prop:t,onChange:n}),T=(0,i.useCallback)((e,t)=>{if(!_&&g===1&&e.length>1){l.toast.error(`Cannot upload more than 1 file at a time`);return}if((C?.length??0)+e.length>g){l.toast.error(`Cannot upload more than ${g} files`);return}let n=e.map(e=>Object.assign(e,{preview:URL.createObjectURL(e)})),r=C?[...C,...n]:n;if(w(r),t.length>0&&t.forEach(({file:e})=>{l.toast.error(`File ${e.name} was rejected`)}),u&&r.length>0&&r.length<=g){let e=r.length>0?`${r.length} files`:`file`;u(r).then(()=>{w([]),(0,l.toast)(`${e} uploaded`)})}},[C,g,_,u,w]);function E(e){if(!C)return;f(C[e])&&URL.revokeObjectURL(C[e].preview);let t=C.filter((t,n)=>n!==e);w(t),n?.(t)}(0,i.useEffect)(()=>()=>{C&&C.forEach(e=>{f(e)&&URL.revokeObjectURL(e.preview)})},[]);let D=v||(C?.length??0)>=g;return(0,o.jsxs)(`div`,{className:`relative flex w-full flex-col gap-6`,children:[(0,o.jsx)(s.default,{onDrop:T,accept:m,maxSize:h,maxFiles:g,multiple:g>1||_,disabled:D,children:({getRootProps:e,getInputProps:t,isDragActive:n})=>(0,o.jsxs)(`div`,{...e(),className:(0,a.cn)(`group`,`border-border-weak`,`hover:bg-border-weak/20`,`relative grid h-52 w-full cursor-pointer place-items-center rounded-lg border-2 border-dashed px-5 py-2.5 text-center transition`,`ring-offset-background`,`focus-visible:ring-primary-weak`,`focus-visible:ring-2`,`focus-visible:ring-offset-2`,`focus-visible:outline-hidden`,n&&`border-border-primary-strong bg-border-weak/40`,D&&`pointer-events-none opacity-60`,x),...S,children:[(0,o.jsx)(`input`,{...t()}),n?(0,o.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,o.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,o.jsx)(r.Upload,{className:`text-text-positive-muted size-7`,"aria-hidden":`true`})}),(0,o.jsx)(`p`,{className:`text-text-positive-muted font-medium`,children:`Drop the files here`})]}):(0,o.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,o.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,o.jsx)(r.Upload,{size:b||24,className:`text-muted-foreground`,"aria-hidden":`true`})}),y&&(0,o.jsxs)(`div`,{className:`flex flex-col gap-px`,children:[(0,o.jsxs)(`p`,{className:`text-text-positive-weak text-xs font-medium`,children:[`Drag `,`'n'`,` drop files here, or click to select files`]}),(0,o.jsxs)(`p`,{className:`text-text-positive-muted text-xs`,children:[`You can upload`,g>1?` ${g===1/0?`multiple`:g}
-                      files (up to ${(0,a.formatBytes)(h)} each)`:` a file with ${(0,a.formatBytes)(h)}`]})]})]})]})}),C?.length?(0,o.jsxs)(`div`,{className:`h-fit w-full overflow-y-auto`,children:[(0,o.jsxs)(`div`,{className:`flex items-center justify-between px-3 py-2.5`,children:[(0,o.jsxs)(`div`,{className:`text-text-positive-weak flex items-center gap-1`,children:[(0,o.jsx)(r.Image,{size:16,"aria-hidden":`true`}),(0,o.jsxs)(`p`,{className:`text-sm`,children:[`Ảnh đã tải lên (`,C.length,`)`]})]}),(0,o.jsxs)(`button`,{className:`hover:text-text-positive text-text-positive-muted flex cursor-pointer items-center gap-1 transition-colors duration-200`,onClick:()=>{C&&(C.forEach(e=>{f(e)&&URL.revokeObjectURL(e.preview)}),w([]),n?.([]))},children:[(0,o.jsx)(r.Trash2,{size:16,"aria-hidden":`true`}),(0,o.jsx)(`p`,{className:`text-sm`,children:`Xóa tất cả`})]})]}),(0,o.jsx)(`div`,{className:`flex flex-col gap-2.5`,children:C?.map((e,t)=>(0,o.jsx)(d,{file:e,onRemove:()=>E(t),progress:p?.[e.name]},t))})]}):null]})}function d({file:e,progress:i,onRemove:s}){return(0,o.jsxs)(`div`,{className:`border-border-weak hover:border-border relative flex items-center gap-4 rounded-md border py-2 pr-3 pl-2 shadow-xs transition-colors`,children:[(0,o.jsxs)(`div`,{className:`flex flex-1 gap-2.5`,children:[f(e)?(0,o.jsx)(p,{file:e}):null,(0,o.jsxs)(`div`,{className:`flex w-full flex-col gap-2`,children:[(0,o.jsxs)(`div`,{className:`flex flex-col gap-y-0.5`,children:[(0,o.jsx)(`p`,{className:`text-text-positive line-clamp-1 text-sm`,children:e.name}),(0,o.jsx)(`p`,{className:`text-text-positive-muted text-xs`,children:(0,a.formatBytes)(e.size)})]}),i?(0,o.jsx)(n.t,{value:i}):null]})]}),(0,o.jsx)(`div`,{className:`flex items-center gap-2`,children:(0,o.jsxs)(t.t,{type:`button`,variant:`ghost`,color:`secondary`,size:`icon`,className:`size-7`,onClick:s,children:[(0,o.jsx)(r.Trash2,{size:16,className:`text-text-positive-muted`,"aria-hidden":`true`}),(0,o.jsx)(`span`,{className:`sr-only`,children:`Remove file`})]})})]})}function f(e){return`preview`in e&&typeof e.preview==`string`}function p({file:e}){return e.type.startsWith(`image/`)?(0,o.jsx)(`img`,{src:e.preview,className:`border-border aspect-square size-10 shrink-0 rounded border object-cover object-top shadow-sm`}):(0,o.jsx)(r.FileText,{className:`text-text-positive-muted size-10 border`,"aria-hidden":`true`})}exports.FileUploader=u;
-//# sourceMappingURL=file-uploader.cjs.map
+"use client";require(`../button.variants-4kw6plrv.cjs`),require(`../button-C--DAN1D.cjs`),require(`../progress-Dlgbu5Ff.cjs`);const e=require(`../file-uploader-BM0x9VBh.cjs`);exports.FileUploader=e.t;

package/dist/ui/file-uploader.d.cts

@@ -1,103 +1,2 @@
-import * as react237 from "react";
-import { DropzoneProps } from "react-dropzone";
-
-//#region packages/components/ui/file-uploader.d.ts
-
-/**
- * Props for the FileUploader component.
- *
- * @example
- * ```tsx
- * import { FileUploader } from '@customafk/lunas-ui/ui/file-uploader';
- *
- * <FileUploader
- *   accept={{ 'image/*': [] }}
- *   maxSize={1024 * 1024 * 5}
- *   maxFileCount={3}
- *   multiple
- *   onUpload={async (files) => { await uploadFiles(files); }}
- * />
- * ```
- */
-interface FileUploaderProps extends React.HTMLAttributes<HTMLDivElement> {
-  /**
-   * Value of the uploader.
-   * @type File[]
-   * @default undefined
-   * @example value={files}
-   */
-  value?: File[];
-  /**
-   * Function to be called when the value changes.
-   * @type (files: File[]) => void
-   * @default undefined
-   * @example onValueChange={(files) => setFiles(files)}
-   */
-  onValueChange?: (files: File[]) => void;
-  /**
-   * Function to be called when files are uploaded.
-   * @type (files: File[]) => Promise<void>
-   * @default undefined
-   * @example onUpload={(files) => uploadFiles(files)}
-   */
-  onUpload?: (files: File[]) => Promise<void>;
-  /**
-   * Progress of the uploaded files.
-   * @type Record<string, number> | undefined
-   * @default undefined
-   * @example progresses={{ "file1.png": 50 }}
-   */
-  progresses?: Record<string, number>;
-  /**
-   * Accepted file types for the uploader.
-   * @type { [key: string]: string[]}
-   * @default
-   * ```ts
-   * { "image/*": [] }
-   * ```
-   * @example accept={["image/png", "image/jpeg"]}
-   */
-  accept?: DropzoneProps['accept'];
-  /**
-   * Maximum file size for the uploader.
-   * @type number | undefined
-   * @default 1024 * 1024 * 2 // 2MB
-   * @example maxSize={1024 * 1024 * 2} // 2MB
-   */
-  maxSize?: DropzoneProps['maxSize'];
-  /**
-   * Maximum number of files for the uploader.
-   * @type number | undefined
-   * @default 1
-   * @example maxFileCount={4}
-   */
-  maxFileCount?: DropzoneProps['maxFiles'];
-  /**
-   * Whether the uploader should accept multiple files.
-   * @type boolean
-   * @default false
-   * @example multiple
-   */
-  multiple?: boolean;
-  /**
-   * Whether the uploader is disabled.
-   * @type boolean
-   * @default false
-   * @example disabled
-   */
-  disabled?: boolean;
-  /**
-   * Whether to show the instructional drag-and-drop text inside the drop zone.
-   * @default true
-   */
-  showText?: boolean;
-  /** Size in pixels for the upload icon. */
-  iconSize?: number;
-}
-/**
- * A drag-and-drop file upload zone that manages file selection, validation, preview generation, and optional async upload with progress tracking.
- */
-declare function FileUploader(props: FileUploaderProps): react237.JSX.Element;
-//#endregion
-export { FileUploader };
-//# sourceMappingURL=file-uploader.d.cts.map
+import { t as FileUploader } from "../file-uploader-Bcq3zzxa.cjs";
+export { FileUploader };

package/dist/ui/file-uploader.d.mts

@@ -0,0 +1,2 @@
+import { t as FileUploader } from "../file-uploader-nUOkG_fv.mjs";
+export { FileUploader };

package/dist/ui/file-uploader.mjs

@@ -0,0 +1 @@
+"use client";import"../button.variants-DkMqWB8G.mjs";import"../button-CCVJTHBI.mjs";import"../progress-RvyBMsxb.mjs";import{t as e}from"../file-uploader-BTWXTBeQ.mjs";export{e as FileUploader};

package/dist/ui/form.cjs

@@ -1,2 +1 @@
-"use client";const e=require(`../chunk-350yNsax.cjs`);require(`../separator-KuymG9g0.cjs`),require(`../label-CC6fXVbC.cjs`);const t=require(`../field-BrlETeXX.cjs`);let n=require(`react`),r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`),a=require(`radix-ui`),o=require(`react-hook-form`);const s=o.FormProvider,c=(0,n.createContext)({}),l=({...e})=>(0,i.jsx)(c.Provider,{value:{name:e.name},children:(0,i.jsx)(o.Controller,{...e})}),u=()=>{let e=(0,n.use)(c),t=(0,n.use)(d),{getFieldState:r,control:i,resetField:a}=(0,o.useFormContext)(),s=(0,o.useFormState)({name:e.name}),l=r(e.name,s);if(!e)throw Error(`useFormField should be used within <FormField>`);let{id:u}=t;return{id:u,control:i,resetField:a,name:e.name,formItemId:`${u}-form-item`,formDescriptionId:`${u}-form-item-description`,formMessageId:`${u}-form-item-message`,...l}},d=(0,n.createContext)({}),f=(0,n.memo)(({className:e,orientation:r=`responsive`,...a})=>{let o=(0,n.useId)();return(0,i.jsx)(d.Provider,{value:{id:o},children:(0,i.jsx)(t.t,{orientation:r,...a,className:e})})});f.displayName=`FormItem`;const p=(0,n.memo)(({...e})=>{let{formItemId:n}=u();return(0,i.jsx)(t.o,{htmlFor:n,...e})});p.displayName=`FormLabel`;const m=(0,n.memo)(({...e})=>{let{error:t,formItemId:n,formDescriptionId:r,formMessageId:o}=u();return(0,i.jsx)(a.Slot.Slot,{"data-slot":`form-control`,id:n,"aria-describedby":t?`${r} ${o}`:`${r}`,"aria-invalid":!!t,...e})});m.displayName=`FormControl`;function h({className:e,...n}){let{formDescriptionId:a}=u();return(0,i.jsx)(t.r,{id:a,className:(0,r.cn)(`text-text-positive-weak text-sm/6 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),...n})}function g({className:e,children:t,...n}){let{error:a,formMessageId:o}=u();return(0,i.jsx)(`span`,{"data-slot":`form-message`,id:o,className:(0,r.cn)(`text-danger text-xs`,e),...n,children:a?String(a?.message??``):t})}exports.Form=s,exports.FormControl=m,exports.FormDescription=h,exports.FormField=l,exports.FormItem=f,exports.FormLabel=p,exports.FormMessage=g,exports.useFormField=u;
-//# sourceMappingURL=form.cjs.map
+"use client";require(`../separator-BRoS5sU8.cjs`),require(`../label--hinNDHW.cjs`),require(`../field-fIef7NR0.cjs`);const e=require(`../form-RLIQQ3uV.cjs`);exports.Form=e.t,exports.FormControl=e.n,exports.FormDescription=e.r,exports.FormField=e.i,exports.FormItem=e.a,exports.FormLabel=e.o,exports.FormMessage=e.s,exports.useFormField=e.c;

package/dist/ui/form.d.cts

@@ -1,112 +1,2 @@
-import * as react292 from "react";
-import { Label, Slot } from "radix-ui";
-import * as react_hook_form0 from "react-hook-form";
-import { ControllerProps, FieldPath, FieldValues } from "react-hook-form";
-
-//#region packages/components/ui/form.d.ts
-
-/**
- * Re-export of react-hook-form's `FormProvider`; wrap your form with this to give all nested form components access to the form context.
- *
- * @example
- * ```tsx
- * import { Form, FormField, FormItem, FormLabel, FormControl, FormMessage } from '@customafk/lunas-ui/ui/form';
- * import { useForm } from 'react-hook-form';
- *
- * const form = useForm<{ username: string }>();
- *
- * <Form {...form}>
- *   <form onSubmit={form.handleSubmit(onSubmit)}>
- *     <FormField
- *       control={form.control}
- *       name="username"
- *       render={({ field }) => (
- *         <FormItem>
- *           <FormLabel>Username</FormLabel>
- *           <FormControl><input {...field} /></FormControl>
- *           <FormMessage />
- *         </FormItem>
- *       )}
- *     />
- *   </form>
- * </Form>
- * ```
- */
-declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>({
-  children,
-  watch,
-  getValues,
-  getFieldState,
-  setError,
-  clearErrors,
-  setValue,
-  setValues,
-  trigger,
-  formState,
-  resetField,
-  reset,
-  handleSubmit,
-  unregister,
-  control,
-  register,
-  setFocus,
-  subscribe
-}: react_hook_form0.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
-/**
- * Connects a single react-hook-form field to the form context; renders a `Controller` and passes `name` down to nested FormItem, FormLabel, FormControl, and FormMessage.
- */
-declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({
-  ...props
-}: ControllerProps<TFieldValues, TName>) => react292.JSX.Element;
-/**
- * Hook that returns the field state and IDs for the enclosing FormField.
- * Must be called inside a component rendered within a `<FormField>`.
- */
-declare const useFormField: () => {
-  invalid: boolean;
-  isDirty: boolean;
-  isTouched: boolean;
-  isValidating: boolean;
-  error?: react_hook_form0.FieldError;
-  id: string;
-  control: react_hook_form0.Control<FieldValues, any, FieldValues>;
-  resetField: react_hook_form0.UseFormResetField<FieldValues>;
-  name: string;
-  formItemId: string;
-  formDescriptionId: string;
-  formMessageId: string;
-};
-/**
- * Container for a single form field — generates a unique ID and provides it via context to FormLabel, FormControl, and FormMessage.
- *
- * @param orientation - Layout direction: `'vertical'`, `'horizontal'`, or `'responsive'` (default).
- */
-declare const FormItem: react292.MemoExoticComponent<({
-  className,
-  orientation,
-  ...props
-}: React.ComponentProps<"div"> & {
-  orientation?: "vertical" | "horizontal" | "responsive";
-}) => react292.JSX.Element>;
-/** Styled label automatically associated with the FormItem's control via `htmlFor`. */
-declare const FormLabel: react292.MemoExoticComponent<({
-  ...props
-}: React.ComponentProps<typeof Label.Root>) => react292.JSX.Element>;
-/** Radix Slot wrapper that wires the correct `id`, `aria-describedby`, and `aria-invalid` attributes onto the underlying control element. */
-declare const FormControl: react292.MemoExoticComponent<({
-  ...props
-}: React.ComponentProps<typeof Slot.Slot>) => react292.JSX.Element>;
-/** Helper text displayed below the control that provides additional context about the field. */
-declare function FormDescription({
-  className,
-  ...props
-}: React.ComponentProps<'p'>): react292.JSX.Element;
-/** Displays the validation error message for the field, or falls back to `children` when there is no error. */
-declare function FormMessage({
-  className,
-  children,
-  ...props
-}: React.ComponentProps<'p'>): react292.JSX.Element;
-//#endregion
-export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField };
-//# sourceMappingURL=form.d.cts.map
+import { a as FormItem, c as useFormField, i as FormField, n as FormControl, o as FormLabel, r as FormDescription, s as FormMessage, t as Form } from "../form-Cek0ebE_.cjs";
+export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField };

package/dist/ui/form.d.mts

@@ -0,0 +1,2 @@
+import { a as FormItem, c as useFormField, i as FormField, n as FormControl, o as FormLabel, r as FormDescription, s as FormMessage, t as Form } from "../form-BZAtjwSL.mjs";
+export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField };

package/dist/ui/form.mjs

@@ -0,0 +1 @@
+"use client";import"../separator-BjRgoiEx.mjs";import"../label-BMVyfKu9.mjs";import"../field-BxYoF5AX.mjs";import{a as e,c as t,i as n,n as r,o as i,r as a,s as o,t as s}from"../form-DvtaketZ.mjs";export{s as Form,r as FormControl,a as FormDescription,n as FormField,e as FormItem,i as FormLabel,o as FormMessage,t as useFormField};