@customafk/lunas-ui 0.1.3 → 0.1.5

package/dist/ui/drawer.d.cts

@@ -0,0 +1,44 @@
+import * as react_jsx_runtime286 from "react/jsx-runtime";
+import { Drawer as Drawer$1 } from "vaul";
+
+//#region packages/components/ui/drawer.d.ts
+declare function Drawer({
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Root>): react_jsx_runtime286.JSX.Element;
+declare function DrawerTrigger({
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Trigger>): react_jsx_runtime286.JSX.Element;
+declare function DrawerPortal({
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Portal>): react_jsx_runtime286.JSX.Element;
+declare function DrawerClose({
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Close>): react_jsx_runtime286.JSX.Element;
+declare function DrawerOverlay({
+  className,
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Overlay>): react_jsx_runtime286.JSX.Element;
+declare function DrawerContent({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Content>): react_jsx_runtime286.JSX.Element;
+declare function DrawerHeader({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime286.JSX.Element;
+declare function DrawerFooter({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime286.JSX.Element;
+declare function DrawerTitle({
+  className,
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Title>): react_jsx_runtime286.JSX.Element;
+declare function DrawerDescription({
+  className,
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Description>): react_jsx_runtime286.JSX.Element;
+//#endregion
+export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger };
+//# sourceMappingURL=drawer.d.cts.map

package/dist/ui/drawer.d.mts

@@ -0,0 +1,44 @@
+import * as react_jsx_runtime287 from "react/jsx-runtime";
+import { Drawer as Drawer$1 } from "vaul";
+
+//#region packages/components/ui/drawer.d.ts
+declare function Drawer({
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Root>): react_jsx_runtime287.JSX.Element;
+declare function DrawerTrigger({
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Trigger>): react_jsx_runtime287.JSX.Element;
+declare function DrawerPortal({
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Portal>): react_jsx_runtime287.JSX.Element;
+declare function DrawerClose({
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Close>): react_jsx_runtime287.JSX.Element;
+declare function DrawerOverlay({
+  className,
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Overlay>): react_jsx_runtime287.JSX.Element;
+declare function DrawerContent({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Content>): react_jsx_runtime287.JSX.Element;
+declare function DrawerHeader({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime287.JSX.Element;
+declare function DrawerFooter({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime287.JSX.Element;
+declare function DrawerTitle({
+  className,
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Title>): react_jsx_runtime287.JSX.Element;
+declare function DrawerDescription({
+  className,
+  ...props
+}: React.ComponentProps<typeof Drawer$1.Description>): react_jsx_runtime287.JSX.Element;
+//#endregion
+export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger };
+//# sourceMappingURL=drawer.d.mts.map

package/dist/ui/drawer.mjs

@@ -0,0 +1 @@
+"use client";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"../drawer-B6N8aQHZ.mjs";export{c as Drawer,i as DrawerClose,o as DrawerContent,n as DrawerDescription,e as DrawerFooter,a as DrawerHeader,s as DrawerOverlay,t as DrawerPortal,r as DrawerTitle,l as DrawerTrigger};

package/dist/ui/dropdown-menu.cjs

@@ -1 +1 @@
-"use client";const e=require(`../dropdown-menu-B9JJkec-.cjs`);exports.DropdownMenu=e.t,exports.DropdownMenuCheckboxItem=e.n,exports.DropdownMenuContent=e.r,exports.DropdownMenuGroup=e.i,exports.DropdownMenuItem=e.a,exports.DropdownMenuLabel=e.o,exports.DropdownMenuPortal=e.s,exports.DropdownMenuRadioGroup=e.c,exports.DropdownMenuRadioItem=e.l,exports.DropdownMenuSeparator=e.u,exports.DropdownMenuShortcut=e.d,exports.DropdownMenuSub=e.f,exports.DropdownMenuSubContent=e.p,exports.DropdownMenuSubTrigger=e.m,exports.DropdownMenuTrigger=e.h;
+"use client";const e=require(`../dropdown-menu-LaPPDajj.cjs`);exports.DropdownMenu=e.t,exports.DropdownMenuCheckboxItem=e.n,exports.DropdownMenuContent=e.r,exports.DropdownMenuGroup=e.i,exports.DropdownMenuItem=e.a,exports.DropdownMenuLabel=e.o,exports.DropdownMenuPortal=e.s,exports.DropdownMenuRadioGroup=e.c,exports.DropdownMenuRadioItem=e.l,exports.DropdownMenuSeparator=e.u,exports.DropdownMenuShortcut=e.d,exports.DropdownMenuSub=e.f,exports.DropdownMenuSubContent=e.p,exports.DropdownMenuSubTrigger=e.m,exports.DropdownMenuTrigger=e.h;

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

@@ -0,0 +1,78 @@
+import * as react_jsx_runtime43 from "react/jsx-runtime";
+import { DropdownMenu as DropdownMenu$1 } from "radix-ui";
+
+//#region packages/components/ui/dropdown-menu.d.ts
+declare function DropdownMenu({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Root>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuPortal({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Portal>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuTrigger({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Trigger>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuContent({
+  className,
+  sideOffset,
+  align,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Content>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuGroup({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Group>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuItem({
+  className,
+  inset,
+  variant,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Item> & {
+  inset?: boolean;
+  variant?: 'default' | 'destructive';
+}): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuCheckboxItem({
+  className,
+  children,
+  checked,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.CheckboxItem>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuRadioGroup({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.RadioGroup>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuRadioItem({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.RadioItem>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuLabel({
+  className,
+  inset,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Label> & {
+  inset?: boolean;
+}): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Separator>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuShortcut({
+  className,
+  ...props
+}: React.ComponentProps<'span'>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuSub({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Sub>): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuSubTrigger({
+  className,
+  inset,
+  children,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.SubTrigger> & {
+  inset?: boolean;
+}): react_jsx_runtime43.JSX.Element;
+declare function DropdownMenuSubContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.SubContent>): react_jsx_runtime43.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

@@ -0,0 +1,78 @@
+import * as react_jsx_runtime198 from "react/jsx-runtime";
+import { DropdownMenu as DropdownMenu$1 } from "radix-ui";
+
+//#region packages/components/ui/dropdown-menu.d.ts
+declare function DropdownMenu({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Root>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuPortal({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Portal>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuTrigger({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Trigger>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuContent({
+  className,
+  sideOffset,
+  align,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Content>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuGroup({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Group>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuItem({
+  className,
+  inset,
+  variant,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Item> & {
+  inset?: boolean;
+  variant?: 'default' | 'destructive';
+}): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuCheckboxItem({
+  className,
+  children,
+  checked,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.CheckboxItem>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuRadioGroup({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.RadioGroup>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuRadioItem({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.RadioItem>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuLabel({
+  className,
+  inset,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Label> & {
+  inset?: boolean;
+}): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Separator>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuShortcut({
+  className,
+  ...props
+}: React.ComponentProps<'span'>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuSub({
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.Sub>): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuSubTrigger({
+  className,
+  inset,
+  children,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.SubTrigger> & {
+  inset?: boolean;
+}): react_jsx_runtime198.JSX.Element;
+declare function DropdownMenuSubContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof DropdownMenu$1.SubContent>): react_jsx_runtime198.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

@@ -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-Ce5qre1g.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.d.cts

@@ -0,0 +1,36 @@
+import * as react_jsx_runtime93 from "react/jsx-runtime";
+import * as class_variance_authority_types2 from "class-variance-authority/types";
+import { VariantProps } from "class-variance-authority";
+
+//#region packages/components/ui/empty.d.ts
+declare function Empty({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime93.JSX.Element;
+declare function EmptyHeader({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime93.JSX.Element;
+declare const emptyMediaVariants: (props?: ({
+  variant?: "default" | "icon" | null | undefined;
+} & class_variance_authority_types2.ClassProp) | undefined) => string;
+declare function EmptyMedia({
+  className,
+  variant,
+  ...props
+}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime93.JSX.Element;
+declare function EmptyTitle({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime93.JSX.Element;
+declare function EmptyDescription({
+  className,
+  ...props
+}: React.ComponentProps<'p'>): react_jsx_runtime93.JSX.Element;
+declare function EmptyContent({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime93.JSX.Element;
+//#endregion
+export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle };
+//# sourceMappingURL=empty.d.cts.map

package/dist/ui/empty.d.mts

@@ -0,0 +1,36 @@
+import * as react_jsx_runtime298 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import * as class_variance_authority_types9 from "class-variance-authority/types";
+
+//#region packages/components/ui/empty.d.ts
+declare function Empty({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime298.JSX.Element;
+declare function EmptyHeader({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime298.JSX.Element;
+declare const emptyMediaVariants: (props?: ({
+  variant?: "default" | "icon" | null | undefined;
+} & class_variance_authority_types9.ClassProp) | undefined) => string;
+declare function EmptyMedia({
+  className,
+  variant,
+  ...props
+}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime298.JSX.Element;
+declare function EmptyTitle({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime298.JSX.Element;
+declare function EmptyDescription({
+  className,
+  ...props
+}: React.ComponentProps<'p'>): react_jsx_runtime298.JSX.Element;
+declare function EmptyContent({
+  className,
+  ...props
+}: React.ComponentProps<'div'>): react_jsx_runtime298.JSX.Element;
+//#endregion
+export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle };
+//# sourceMappingURL=empty.d.mts.map

package/dist/ui/empty.mjs

@@ -0,0 +1,2 @@
+import{cn as e}from"@customafk/react-toolkit/utils";import{jsx as t}from"react/jsx-runtime";import{cva as n}from"class-variance-authority";function r({className:n,...r}){return t(`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`,n),...r})}function i({className:n,...r}){return t(`div`,{"data-slot":`empty-header`,className:e(`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 t(`div`,{"data-slot":`empty-icon`,"data-variant":r,className:e(a({variant:r,className:n})),...i})}function s({className:n,...r}){return t(`div`,{"data-slot":`empty-title`,className:e(`text-lg font-medium tracking-tight`,n),...r})}function c({className:n,...r}){return t(`div`,{"data-slot":`empty-description`,className:e(`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 t(`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`,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

@@ -0,0 +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"}

package/dist/ui/field.cjs

@@ -1 +1 @@
-"use client";require(`../label-D2Kl-Q_-.cjs`),require(`../separator-D3CGKwyf.cjs`);const e=require(`../field-Cjpwx_6d.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-CBup_ah1.cjs`),require(`../label-C6_Tplyy.cjs`);const e=require(`../field-D8lireRm.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

@@ -0,0 +1,66 @@
+import { Label } from "./label.cjs";
+import * as react_jsx_runtime81 from "react/jsx-runtime";
+import * as react1 from "react";
+import * as class_variance_authority_types1 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_runtime81.JSX.Element>;
+declare const FieldLegend: react1.MemoExoticComponent<({
+  className,
+  variant,
+  ...props
+}: React.ComponentProps<"legend"> & {
+  variant?: "legend" | "label";
+}) => react_jsx_runtime81.JSX.Element>;
+declare const FieldGroup: react1.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<"div">) => react_jsx_runtime81.JSX.Element>;
+declare const fieldVariants: (props?: ({
+  orientation?: "vertical" | "horizontal" | "responsive" | null | undefined;
+} & class_variance_authority_types1.ClassProp) | undefined) => string;
+declare const Field: react1.MemoExoticComponent<({
+  className,
+  orientation,
+  ...props
+}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>) => react_jsx_runtime81.JSX.Element>;
+declare const FieldContent: react1.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<"div">) => react_jsx_runtime81.JSX.Element>;
+declare const FieldLabel: react1.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<typeof Label>) => react_jsx_runtime81.JSX.Element>;
+declare const FieldTitle: react1.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<"div">) => react_jsx_runtime81.JSX.Element>;
+declare const FieldDescription: react1.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<"p">) => react_jsx_runtime81.JSX.Element>;
+declare const FieldSeparator: react1.MemoExoticComponent<({
+  children,
+  className,
+  ...props
+}: React.ComponentProps<"div"> & {
+  children?: React.ReactNode;
+}) => react_jsx_runtime81.JSX.Element>;
+declare const FieldError: react1.MemoExoticComponent<({
+  className,
+  children,
+  errors,
+  ...props
+}: React.ComponentProps<"div"> & {
+  errors?: Array<{
+    message?: string;
+  } | undefined>;
+}) => react_jsx_runtime81.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,66 @@
+import { Label } from "./label.mjs";
+import * as react_jsx_runtime121 from "react/jsx-runtime";
+import * as react3 from "react";
+import { VariantProps } from "class-variance-authority";
+import * as class_variance_authority_types1 from "class-variance-authority/types";
+
+//#region packages/components/ui/field.d.ts
+declare const FieldSet: react3.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<"fieldset">) => react_jsx_runtime121.JSX.Element>;
+declare const FieldLegend: react3.MemoExoticComponent<({
+  className,
+  variant,
+  ...props
+}: React.ComponentProps<"legend"> & {
+  variant?: "legend" | "label";
+}) => react_jsx_runtime121.JSX.Element>;
+declare const FieldGroup: react3.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<"div">) => react_jsx_runtime121.JSX.Element>;
+declare const fieldVariants: (props?: ({
+  orientation?: "vertical" | "horizontal" | "responsive" | null | undefined;
+} & class_variance_authority_types1.ClassProp) | undefined) => string;
+declare const Field: react3.MemoExoticComponent<({
+  className,
+  orientation,
+  ...props
+}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>) => react_jsx_runtime121.JSX.Element>;
+declare const FieldContent: react3.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<"div">) => react_jsx_runtime121.JSX.Element>;
+declare const FieldLabel: react3.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<typeof Label>) => react_jsx_runtime121.JSX.Element>;
+declare const FieldTitle: react3.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<"div">) => react_jsx_runtime121.JSX.Element>;
+declare const FieldDescription: react3.MemoExoticComponent<({
+  className,
+  ...props
+}: React.ComponentProps<"p">) => react_jsx_runtime121.JSX.Element>;
+declare const FieldSeparator: react3.MemoExoticComponent<({
+  children,
+  className,
+  ...props
+}: React.ComponentProps<"div"> & {
+  children?: React.ReactNode;
+}) => react_jsx_runtime121.JSX.Element>;
+declare const FieldError: react3.MemoExoticComponent<({
+  className,
+  children,
+  errors,
+  ...props
+}: React.ComponentProps<"div"> & {
+  errors?: Array<{
+    message?: string;
+  } | undefined>;
+}) => react_jsx_runtime121.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-D1hK3QAo.mjs";import"../label-C6OaewtP.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-COna_98h.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,3 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../dist-Dh8WwRa8.cjs`),require(`../button.variants-D1vkzrn1.cjs`);const t=require(`../button-BSQjtXgG.cjs`),n=require(`../progress-BvFZ5L8e.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.t(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;
+"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../button.variants-C--cfyfH.cjs`);const t=require(`../button-DtFiUaY7.cjs`),n=require(`./progress.cjs`);let r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`),a=require(`lucide-react`),o=require(`react`),s=require(`react-dropzone`);s=e.t(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,o.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,o.useEffect)(()=>()=>{C&&C.forEach(e=>{f(e)&&URL.revokeObjectURL(e.preview)})},[]);let D=v||(C?.length??0)>=g;return(0,i.jsxs)(`div`,{className:`relative flex w-full flex-col gap-6`,children:[(0,i.jsx)(s.default,{onDrop:T,accept:m,maxSize:h,maxFiles:g,multiple:g>1||_,disabled:D,children:({getRootProps:e,getInputProps:t,isDragActive:n})=>(0,i.jsxs)(`div`,{...e(),className:(0,r.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,i.jsx)(`input`,{...t()}),n?(0,i.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,i.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,i.jsx)(a.Upload,{className:`text-text-positive-muted size-7`,"aria-hidden":`true`})}),(0,i.jsx)(`p`,{className:`text-text-positive-muted font-medium`,children:`Drop the files here`})]}):(0,i.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,i.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,i.jsx)(a.Upload,{size:b||24,className:`text-muted-foreground`,"aria-hidden":`true`})}),y&&(0,i.jsxs)(`div`,{className:`flex flex-col gap-px`,children:[(0,i.jsxs)(`p`,{className:`text-text-positive-weak text-xs font-medium`,children:[`Drag `,`'n'`,` drop files here, or click to select files`]}),(0,i.jsxs)(`p`,{className:`text-text-positive-muted text-xs`,children:[`You can upload`,g>1?` ${g===1/0?`multiple`:g}
+                      files (up to ${(0,r.formatBytes)(h)} each)`:` a file with ${(0,r.formatBytes)(h)}`]})]})]})]})}),C?.length?(0,i.jsxs)(`div`,{className:`h-fit w-full overflow-y-auto`,children:[(0,i.jsxs)(`div`,{className:`flex items-center justify-between px-3 py-2.5`,children:[(0,i.jsxs)(`div`,{className:`text-text-positive-weak flex items-center gap-1`,children:[(0,i.jsx)(a.Image,{size:16,"aria-hidden":`true`}),(0,i.jsxs)(`p`,{className:`text-sm`,children:[`Ảnh đã tải lên (`,C.length,`)`]})]}),(0,i.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,i.jsx)(a.Trash2,{size:16,"aria-hidden":`true`}),(0,i.jsx)(`p`,{className:`text-sm`,children:`Xóa tất cả`})]})]}),(0,i.jsx)(`div`,{className:`flex flex-col gap-2.5`,children:C?.map((e,t)=>(0,i.jsx)(d,{file:e,onRemove:()=>E(t),progress:p?.[e.name]},t))})]}):null]})}function d({file:e,progress:o,onRemove:s}){return(0,i.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,i.jsxs)(`div`,{className:`flex flex-1 gap-2.5`,children:[f(e)?(0,i.jsx)(p,{file:e}):null,(0,i.jsxs)(`div`,{className:`flex w-full flex-col gap-2`,children:[(0,i.jsxs)(`div`,{className:`flex flex-col gap-y-0.5`,children:[(0,i.jsx)(`p`,{className:`text-text-positive line-clamp-1 text-sm`,children:e.name}),(0,i.jsx)(`p`,{className:`text-text-positive-muted text-xs`,children:(0,r.formatBytes)(e.size)})]}),o?(0,i.jsx)(n.Progress,{value:o}):null]})]}),(0,i.jsx)(`div`,{className:`flex items-center gap-2`,children:(0,i.jsxs)(t.t,{type:`button`,variant:`ghost`,color:`secondary`,size:`icon`,className:`size-7`,onClick:s,children:[(0,i.jsx)(a.Trash2,{size:16,className:`text-text-positive-muted`,"aria-hidden":`true`}),(0,i.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,i.jsx)(`img`,{src:e.preview,className:`border-border aspect-square size-10 shrink-0 rounded border object-cover object-top shadow-sm`}):(0,i.jsx)(a.FileText,{className:`text-text-positive-muted size-10 border`,"aria-hidden":`true`})}exports.FileUploader=u;
 //# sourceMappingURL=file-uploader.cjs.map

package/dist/ui/file-uploader.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"file-uploader.cjs","names":["Dropzone","Upload","Image","Trash2","Progress","Button","FileText"],"sources":["../../packages/components/ui/file-uploader.tsx"],"sourcesContent":["'use client';\nimport { useCallback, useEffect } from 'react';\nimport Dropzone, { type DropzoneProps, type FileRejection } from 'react-dropzone';\nimport { useControllableState } from '@customafk/react-toolkit/hooks/useControllableState';\nimport { cn, formatBytes } from '@customafk/react-toolkit/utils';\n\nimport { FileText, Image, Trash2, Upload } from 'lucide-react';\nimport { toast } from 'sonner';\n\nimport { Button } from '@/components/ui/button';\nimport { Progress } from '@/components/ui/progress';\n\ninterface FileUploaderProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Value of the uploader.\n   * @type File[]\n   * @default undefined\n   * @example value={files}\n   */\n  value?: File[];\n\n  /**\n   * Function to be called when the value changes.\n   * @type (files: File[]) => void\n   * @default undefined\n   * @example onValueChange={(files) => setFiles(files)}\n   */\n  onValueChange?: (files: File[]) => void;\n\n  /**\n   * Function to be called when files are uploaded.\n   * @type (files: File[]) => Promise<void>\n   * @default undefined\n   * @example onUpload={(files) => uploadFiles(files)}\n   */\n  onUpload?: (files: File[]) => Promise<void>;\n\n  /**\n   * Progress of the uploaded files.\n   * @type Record<string, number> | undefined\n   * @default undefined\n   * @example progresses={{ \"file1.png\": 50 }}\n   */\n  progresses?: Record<string, number>;\n\n  /**\n   * Accepted file types for the uploader.\n   * @type { [key: string]: string[]}\n   * @default\n   * ```ts\n   * { \"image/*\": [] }\n   * ```\n   * @example accept={[\"image/png\", \"image/jpeg\"]}\n   */\n  accept?: DropzoneProps['accept'];\n\n  /**\n   * Maximum file size for the uploader.\n   * @type number | undefined\n   * @default 1024 * 1024 * 2 // 2MB\n   * @example maxSize={1024 * 1024 * 2} // 2MB\n   */\n  maxSize?: DropzoneProps['maxSize'];\n\n  /**\n   * Maximum number of files for the uploader.\n   * @type number | undefined\n   * @default 1\n   * @example maxFileCount={4}\n   */\n  maxFileCount?: DropzoneProps['maxFiles'];\n\n  /**\n   * Whether the uploader should accept multiple files.\n   * @type boolean\n   * @default false\n   * @example multiple\n   */\n  multiple?: boolean;\n\n  /**\n   * Whether the uploader is disabled.\n   * @type boolean\n   * @default false\n   * @example disabled\n   */\n  disabled?: boolean;\n\n  showText?: boolean;\n  iconSize?: number;\n}\n\nexport function FileUploader(props: FileUploaderProps) {\n  const {\n    value: valueProp,\n    onValueChange,\n    onUpload,\n    progresses,\n    accept = {\n      'image/*': [],\n    },\n    maxSize = 1024 * 1024 * 2,\n    maxFileCount = 1,\n    multiple = false,\n    disabled = false,\n    showText = true,\n    iconSize,\n    className,\n    ...dropzoneProps\n  } = props;\n\n  const [files, setFiles] = useControllableState({\n    prop: valueProp,\n    onChange: onValueChange,\n  });\n\n  const onDrop = useCallback(\n    (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {\n      if (!multiple && maxFileCount === 1 && acceptedFiles.length > 1) {\n        toast.error('Cannot upload more than 1 file at a time');\n\n        return;\n      }\n\n      if ((files?.length ?? 0) + acceptedFiles.length > maxFileCount) {\n        toast.error(`Cannot upload more than ${maxFileCount} files`);\n        return;\n      }\n\n      const newFiles = acceptedFiles.map(file =>\n        Object.assign(file, {\n          preview: URL.createObjectURL(file),\n        })\n      );\n\n      const updatedFiles = files ? [...files, ...newFiles] : newFiles;\n\n      setFiles(updatedFiles);\n\n      if (rejectedFiles.length > 0) {\n        rejectedFiles.forEach(({ file }) => {\n          toast.error(`File ${file.name} was rejected`);\n        });\n      }\n\n      if (onUpload && updatedFiles.length > 0 && updatedFiles.length <= maxFileCount) {\n        const target = updatedFiles.length > 0 ? `${updatedFiles.length} files` : `file`;\n\n        onUpload(updatedFiles).then(() => {\n          setFiles([]);\n          toast(`${target} uploaded`);\n        });\n      }\n    },\n\n    [files, maxFileCount, multiple, onUpload, setFiles]\n  );\n\n  function onRemove(index: number) {\n    if (!files) return;\n\n    if (isFileWithPreview(files[index])) {\n      URL.revokeObjectURL(files[index].preview);\n    }\n\n    const newFiles = files.filter((_, i) => i !== index);\n    setFiles(newFiles);\n    onValueChange?.(newFiles);\n  }\n\n  // Revoke preview url when component unmounts\n  useEffect(() => {\n    return () => {\n      if (!files) return;\n      files.forEach(file => {\n        if (isFileWithPreview(file)) {\n          URL.revokeObjectURL(file.preview);\n        }\n      });\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const isDisabled = disabled || (files?.length ?? 0) >= maxFileCount;\n\n  return (\n    <div className=\"relative flex w-full flex-col gap-6\">\n      <Dropzone onDrop={onDrop} accept={accept} maxSize={maxSize} maxFiles={maxFileCount} multiple={maxFileCount > 1 || multiple} disabled={isDisabled}>\n        {({ getRootProps, getInputProps, isDragActive }) => (\n          <div\n            {...getRootProps()}\n            className={cn(\n              'group',\n              'border-border-weak',\n              'hover:bg-border-weak/20',\n              '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',\n              'ring-offset-background',\n              'focus-visible:ring-primary-weak',\n              'focus-visible:ring-2',\n              'focus-visible:ring-offset-2',\n              'focus-visible:outline-hidden',\n              isDragActive && 'border-border-primary-strong bg-border-weak/40',\n              isDisabled && 'pointer-events-none opacity-60',\n              className\n            )}\n            {...dropzoneProps}\n          >\n            <input {...getInputProps()} />\n            {isDragActive ? (\n              <div className=\"flex flex-col items-center justify-center gap-4 sm:px-5\">\n                <div className=\"rounded-full border border-dashed p-3\">\n                  <Upload className=\"text-text-positive-muted size-7\" aria-hidden=\"true\" />\n                </div>\n                <p className=\"text-text-positive-muted font-medium\">Drop the files here</p>\n              </div>\n            ) : (\n              <div className=\"flex flex-col items-center justify-center gap-4 sm:px-5\">\n                <div className=\"rounded-full border border-dashed p-3\">\n                  <Upload size={iconSize || 24} className=\"text-muted-foreground\" aria-hidden=\"true\" />\n                </div>\n                {showText && (\n                  <div className=\"flex flex-col gap-px\">\n                    <p className=\"text-text-positive-weak text-xs font-medium\">Drag {`'n'`} drop files here, or click to select files</p>\n                    <p className=\"text-text-positive-muted text-xs\">\n                      You can upload\n                      {maxFileCount > 1\n                        ? ` ${maxFileCount === Infinity ? 'multiple' : maxFileCount}\n                      files (up to ${formatBytes(maxSize)} each)`\n                        : ` a file with ${formatBytes(maxSize)}`}\n                    </p>\n                  </div>\n                )}\n              </div>\n            )}\n          </div>\n        )}\n      </Dropzone>\n      {files?.length ? (\n        <div className=\"h-fit w-full overflow-y-auto\">\n          <div className=\"flex items-center justify-between px-3 py-2.5\">\n            <div className=\"text-text-positive-weak flex items-center gap-1\">\n              <Image size={16} aria-hidden=\"true\" />\n              <p className=\"text-sm\">Ảnh đã tải lên ({files.length})</p>\n            </div>\n            <button\n              className=\"hover:text-text-positive text-text-positive-muted flex cursor-pointer items-center gap-1 transition-colors duration-200\"\n              onClick={() => {\n                if (!files) return;\n                files.forEach(file => {\n                  if (!isFileWithPreview(file)) return;\n                  URL.revokeObjectURL(file.preview);\n                });\n                setFiles([]);\n                onValueChange?.([]);\n              }}\n            >\n              <Trash2 size={16} aria-hidden=\"true\" />\n              <p className=\"text-sm\">Xóa tất cả</p>\n            </button>\n          </div>\n          <div className=\"flex flex-col gap-2.5\">\n            {files?.map((file, index) => (\n              <FileCard key={index} file={file} onRemove={() => onRemove(index)} progress={progresses?.[file.name]} />\n            ))}\n          </div>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\ninterface FileCardProps {\n  file: File;\n  onRemove: () => void;\n  progress?: number;\n}\n\nfunction FileCard({ file, progress, onRemove }: FileCardProps) {\n  return (\n    <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\">\n      <div className=\"flex flex-1 gap-2.5\">\n        {isFileWithPreview(file) ? <FilePreview file={file} /> : null}\n        <div className=\"flex w-full flex-col gap-2\">\n          <div className=\"flex flex-col gap-y-0.5\">\n            <p className=\"text-text-positive line-clamp-1 text-sm\">{file.name}</p>\n            <p className=\"text-text-positive-muted text-xs\">{formatBytes(file.size)}</p>\n          </div>\n          {progress ? <Progress value={progress} /> : null}\n        </div>\n      </div>\n      <div className=\"flex items-center gap-2\">\n        <Button type=\"button\" variant=\"ghost\" color=\"secondary\" size=\"icon\" className=\"size-7\" onClick={onRemove}>\n          <Trash2 size={16} className=\"text-text-positive-muted\" aria-hidden=\"true\" />\n          <span className=\"sr-only\">Remove file</span>\n        </Button>\n      </div>\n    </div>\n  );\n}\n\nfunction isFileWithPreview(file: File): file is File & { preview: string } {\n  return 'preview' in file && typeof file.preview === 'string';\n}\n\ninterface FilePreviewProps {\n  file: File & { preview: string };\n}\n\nfunction FilePreview({ file }: FilePreviewProps) {\n  if (file.type.startsWith('image/')) {\n    return <img src={file.preview} className=\"border-border aspect-square size-10 shrink-0 rounded border object-cover object-top shadow-sm\" />;\n  }\n\n  return <FileText className=\"text-text-positive-muted size-10 border\" aria-hidden=\"true\" />;\n}\n"],"mappings":"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"}
+{"version":3,"file":"file-uploader.cjs","names":["Dropzone","Upload","Image","Trash2","Progress","Button","FileText"],"sources":["../../packages/components/ui/file-uploader.tsx"],"sourcesContent":["'use client';\nimport { useCallback, useEffect } from 'react';\nimport Dropzone, { type DropzoneProps, type FileRejection } from 'react-dropzone';\nimport { useControllableState } from '@customafk/react-toolkit/hooks/useControllableState';\nimport { cn, formatBytes } from '@customafk/react-toolkit/utils';\n\nimport { FileText, Image, Trash2, Upload } from 'lucide-react';\nimport { toast } from 'sonner';\n\nimport { Button } from '@/components/ui/button';\nimport { Progress } from '@/components/ui/progress';\n\ninterface FileUploaderProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Value of the uploader.\n   * @type File[]\n   * @default undefined\n   * @example value={files}\n   */\n  value?: File[];\n\n  /**\n   * Function to be called when the value changes.\n   * @type (files: File[]) => void\n   * @default undefined\n   * @example onValueChange={(files) => setFiles(files)}\n   */\n  onValueChange?: (files: File[]) => void;\n\n  /**\n   * Function to be called when files are uploaded.\n   * @type (files: File[]) => Promise<void>\n   * @default undefined\n   * @example onUpload={(files) => uploadFiles(files)}\n   */\n  onUpload?: (files: File[]) => Promise<void>;\n\n  /**\n   * Progress of the uploaded files.\n   * @type Record<string, number> | undefined\n   * @default undefined\n   * @example progresses={{ \"file1.png\": 50 }}\n   */\n  progresses?: Record<string, number>;\n\n  /**\n   * Accepted file types for the uploader.\n   * @type { [key: string]: string[]}\n   * @default\n   * ```ts\n   * { \"image/*\": [] }\n   * ```\n   * @example accept={[\"image/png\", \"image/jpeg\"]}\n   */\n  accept?: DropzoneProps['accept'];\n\n  /**\n   * Maximum file size for the uploader.\n   * @type number | undefined\n   * @default 1024 * 1024 * 2 // 2MB\n   * @example maxSize={1024 * 1024 * 2} // 2MB\n   */\n  maxSize?: DropzoneProps['maxSize'];\n\n  /**\n   * Maximum number of files for the uploader.\n   * @type number | undefined\n   * @default 1\n   * @example maxFileCount={4}\n   */\n  maxFileCount?: DropzoneProps['maxFiles'];\n\n  /**\n   * Whether the uploader should accept multiple files.\n   * @type boolean\n   * @default false\n   * @example multiple\n   */\n  multiple?: boolean;\n\n  /**\n   * Whether the uploader is disabled.\n   * @type boolean\n   * @default false\n   * @example disabled\n   */\n  disabled?: boolean;\n\n  showText?: boolean;\n  iconSize?: number;\n}\n\nexport function FileUploader(props: FileUploaderProps) {\n  const {\n    value: valueProp,\n    onValueChange,\n    onUpload,\n    progresses,\n    accept = {\n      'image/*': [],\n    },\n    maxSize = 1024 * 1024 * 2,\n    maxFileCount = 1,\n    multiple = false,\n    disabled = false,\n    showText = true,\n    iconSize,\n    className,\n    ...dropzoneProps\n  } = props;\n\n  const [files, setFiles] = useControllableState({\n    prop: valueProp,\n    onChange: onValueChange,\n  });\n\n  const onDrop = useCallback(\n    (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {\n      if (!multiple && maxFileCount === 1 && acceptedFiles.length > 1) {\n        toast.error('Cannot upload more than 1 file at a time');\n\n        return;\n      }\n\n      if ((files?.length ?? 0) + acceptedFiles.length > maxFileCount) {\n        toast.error(`Cannot upload more than ${maxFileCount} files`);\n        return;\n      }\n\n      const newFiles = acceptedFiles.map(file =>\n        Object.assign(file, {\n          preview: URL.createObjectURL(file),\n        })\n      );\n\n      const updatedFiles = files ? [...files, ...newFiles] : newFiles;\n\n      setFiles(updatedFiles);\n\n      if (rejectedFiles.length > 0) {\n        rejectedFiles.forEach(({ file }) => {\n          toast.error(`File ${file.name} was rejected`);\n        });\n      }\n\n      if (onUpload && updatedFiles.length > 0 && updatedFiles.length <= maxFileCount) {\n        const target = updatedFiles.length > 0 ? `${updatedFiles.length} files` : `file`;\n\n        onUpload(updatedFiles).then(() => {\n          setFiles([]);\n          toast(`${target} uploaded`);\n        });\n      }\n    },\n\n    [files, maxFileCount, multiple, onUpload, setFiles]\n  );\n\n  function onRemove(index: number) {\n    if (!files) return;\n\n    if (isFileWithPreview(files[index])) {\n      URL.revokeObjectURL(files[index].preview);\n    }\n\n    const newFiles = files.filter((_, i) => i !== index);\n    setFiles(newFiles);\n    onValueChange?.(newFiles);\n  }\n\n  // Revoke preview url when component unmounts\n  useEffect(() => {\n    return () => {\n      if (!files) return;\n      files.forEach(file => {\n        if (isFileWithPreview(file)) {\n          URL.revokeObjectURL(file.preview);\n        }\n      });\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const isDisabled = disabled || (files?.length ?? 0) >= maxFileCount;\n\n  return (\n    <div className=\"relative flex w-full flex-col gap-6\">\n      <Dropzone onDrop={onDrop} accept={accept} maxSize={maxSize} maxFiles={maxFileCount} multiple={maxFileCount > 1 || multiple} disabled={isDisabled}>\n        {({ getRootProps, getInputProps, isDragActive }) => (\n          <div\n            {...getRootProps()}\n            className={cn(\n              'group',\n              'border-border-weak',\n              'hover:bg-border-weak/20',\n              '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',\n              'ring-offset-background',\n              'focus-visible:ring-primary-weak',\n              'focus-visible:ring-2',\n              'focus-visible:ring-offset-2',\n              'focus-visible:outline-hidden',\n              isDragActive && 'border-border-primary-strong bg-border-weak/40',\n              isDisabled && 'pointer-events-none opacity-60',\n              className\n            )}\n            {...dropzoneProps}\n          >\n            <input {...getInputProps()} />\n            {isDragActive ? (\n              <div className=\"flex flex-col items-center justify-center gap-4 sm:px-5\">\n                <div className=\"rounded-full border border-dashed p-3\">\n                  <Upload className=\"text-text-positive-muted size-7\" aria-hidden=\"true\" />\n                </div>\n                <p className=\"text-text-positive-muted font-medium\">Drop the files here</p>\n              </div>\n            ) : (\n              <div className=\"flex flex-col items-center justify-center gap-4 sm:px-5\">\n                <div className=\"rounded-full border border-dashed p-3\">\n                  <Upload size={iconSize || 24} className=\"text-muted-foreground\" aria-hidden=\"true\" />\n                </div>\n                {showText && (\n                  <div className=\"flex flex-col gap-px\">\n                    <p className=\"text-text-positive-weak text-xs font-medium\">Drag {`'n'`} drop files here, or click to select files</p>\n                    <p className=\"text-text-positive-muted text-xs\">\n                      You can upload\n                      {maxFileCount > 1\n                        ? ` ${maxFileCount === Infinity ? 'multiple' : maxFileCount}\n                      files (up to ${formatBytes(maxSize)} each)`\n                        : ` a file with ${formatBytes(maxSize)}`}\n                    </p>\n                  </div>\n                )}\n              </div>\n            )}\n          </div>\n        )}\n      </Dropzone>\n      {files?.length ? (\n        <div className=\"h-fit w-full overflow-y-auto\">\n          <div className=\"flex items-center justify-between px-3 py-2.5\">\n            <div className=\"text-text-positive-weak flex items-center gap-1\">\n              <Image size={16} aria-hidden=\"true\" />\n              <p className=\"text-sm\">Ảnh đã tải lên ({files.length})</p>\n            </div>\n            <button\n              className=\"hover:text-text-positive text-text-positive-muted flex cursor-pointer items-center gap-1 transition-colors duration-200\"\n              onClick={() => {\n                if (!files) return;\n                files.forEach(file => {\n                  if (!isFileWithPreview(file)) return;\n                  URL.revokeObjectURL(file.preview);\n                });\n                setFiles([]);\n                onValueChange?.([]);\n              }}\n            >\n              <Trash2 size={16} aria-hidden=\"true\" />\n              <p className=\"text-sm\">Xóa tất cả</p>\n            </button>\n          </div>\n          <div className=\"flex flex-col gap-2.5\">\n            {files?.map((file, index) => (\n              <FileCard key={index} file={file} onRemove={() => onRemove(index)} progress={progresses?.[file.name]} />\n            ))}\n          </div>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\ninterface FileCardProps {\n  file: File;\n  onRemove: () => void;\n  progress?: number;\n}\n\nfunction FileCard({ file, progress, onRemove }: FileCardProps) {\n  return (\n    <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\">\n      <div className=\"flex flex-1 gap-2.5\">\n        {isFileWithPreview(file) ? <FilePreview file={file} /> : null}\n        <div className=\"flex w-full flex-col gap-2\">\n          <div className=\"flex flex-col gap-y-0.5\">\n            <p className=\"text-text-positive line-clamp-1 text-sm\">{file.name}</p>\n            <p className=\"text-text-positive-muted text-xs\">{formatBytes(file.size)}</p>\n          </div>\n          {progress ? <Progress value={progress} /> : null}\n        </div>\n      </div>\n      <div className=\"flex items-center gap-2\">\n        <Button type=\"button\" variant=\"ghost\" color=\"secondary\" size=\"icon\" className=\"size-7\" onClick={onRemove}>\n          <Trash2 size={16} className=\"text-text-positive-muted\" aria-hidden=\"true\" />\n          <span className=\"sr-only\">Remove file</span>\n        </Button>\n      </div>\n    </div>\n  );\n}\n\nfunction isFileWithPreview(file: File): file is File & { preview: string } {\n  return 'preview' in file && typeof file.preview === 'string';\n}\n\ninterface FilePreviewProps {\n  file: File & { preview: string };\n}\n\nfunction FilePreview({ file }: FilePreviewProps) {\n  if (file.type.startsWith('image/')) {\n    return <img src={file.preview} className=\"border-border aspect-square size-10 shrink-0 rounded border object-cover object-top shadow-sm\" />;\n  }\n\n  return <FileText className=\"text-text-positive-muted size-10 border\" aria-hidden=\"true\" />;\n}\n"],"mappings":"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"}