@customafk/lunas-ui 0.1.93 → 0.1.94

package/dist/ui/field.cjs

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

package/dist/ui/field.d.cts

@@ -1,56 +1,56 @@
 import { Label } from "./label.cjs";
-import * as react_jsx_runtime122 from "react/jsx-runtime";
+import * as react_jsx_runtime128 from "react/jsx-runtime";
 import * as react1 from "react";
-import * as class_variance_authority_types3 from "class-variance-authority/types";
+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: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"fieldset">) => react_jsx_runtime122.JSX.Element>;
+}: React.ComponentProps<"fieldset">) => react_jsx_runtime128.JSX.Element>;
 declare const FieldLegend: react1.MemoExoticComponent<({
   className,
   variant,
   ...props
 }: React.ComponentProps<"legend"> & {
   variant?: "legend" | "label";
-}) => react_jsx_runtime122.JSX.Element>;
+}) => react_jsx_runtime128.JSX.Element>;
 declare const FieldGroup: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"div">) => react_jsx_runtime122.JSX.Element>;
+}: React.ComponentProps<"div">) => react_jsx_runtime128.JSX.Element>;
 declare const fieldVariants: (props?: ({
   orientation?: "vertical" | "horizontal" | "responsive" | null | undefined;
-} & class_variance_authority_types3.ClassProp) | undefined) => string;
+} & class_variance_authority_types6.ClassProp) | undefined) => string;
 declare const Field: react1.MemoExoticComponent<({
   className,
   orientation,
   ...props
-}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>) => react_jsx_runtime122.JSX.Element>;
+}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>) => react_jsx_runtime128.JSX.Element>;
 declare const FieldContent: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"div">) => react_jsx_runtime122.JSX.Element>;
+}: React.ComponentProps<"div">) => react_jsx_runtime128.JSX.Element>;
 declare const FieldLabel: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<typeof Label>) => react_jsx_runtime122.JSX.Element>;
+}: React.ComponentProps<typeof Label>) => react_jsx_runtime128.JSX.Element>;
 declare const FieldTitle: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"div">) => react_jsx_runtime122.JSX.Element>;
+}: React.ComponentProps<"div">) => react_jsx_runtime128.JSX.Element>;
 declare const FieldDescription: react1.MemoExoticComponent<({
   className,
   ...props
-}: React.ComponentProps<"p">) => react_jsx_runtime122.JSX.Element>;
+}: React.ComponentProps<"p">) => react_jsx_runtime128.JSX.Element>;
 declare const FieldSeparator: react1.MemoExoticComponent<({
   children,
   className,
   ...props
 }: React.ComponentProps<"div"> & {
   children?: React.ReactNode;
-}) => react_jsx_runtime122.JSX.Element>;
+}) => react_jsx_runtime128.JSX.Element>;
 declare const FieldError: react1.MemoExoticComponent<({
   className,
   children,
@@ -60,7 +60,7 @@ declare const FieldError: react1.MemoExoticComponent<({
   errors?: Array<{
     message?: string;
   } | undefined>;
-}) => react_jsx_runtime122.JSX.Element | null>;
+}) => react_jsx_runtime128.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

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

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

package/dist/ui/file-uploader.cjs

@@ -1,3 +1,3 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../button.variants-Bo2vzQp5.cjs`);const t=require(`../button-BLYTfCyl.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;
+"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../button.variants-8QOIR433.cjs`);const t=require(`../button-8Snjc8iT.cjs`),n=require(`./progress.cjs`);let r=require(`@customafk/react-toolkit/utils`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`lucide-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,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,a.jsxs)(`div`,{className:`relative flex w-full flex-col gap-6`,children:[(0,a.jsx)(s.default,{onDrop:T,accept:m,maxSize:h,maxFiles:g,multiple:g>1||_,disabled:D,children:({getRootProps:e,getInputProps:t,isDragActive:n})=>(0,a.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,a.jsx)(`input`,{...t()}),n?(0,a.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,a.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,a.jsx)(o.Upload,{className:`text-text-positive-muted size-7`,"aria-hidden":`true`})}),(0,a.jsx)(`p`,{className:`text-text-positive-muted font-medium`,children:`Drop the files here`})]}):(0,a.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,a.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,a.jsx)(o.Upload,{size:b||24,className:`text-muted-foreground`,"aria-hidden":`true`})}),y&&(0,a.jsxs)(`div`,{className:`flex flex-col gap-px`,children:[(0,a.jsxs)(`p`,{className:`text-text-positive-weak text-xs font-medium`,children:[`Drag `,`'n'`,` drop files here, or click to select files`]}),(0,a.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,a.jsxs)(`div`,{className:`h-fit w-full overflow-y-auto`,children:[(0,a.jsxs)(`div`,{className:`flex items-center justify-between px-3 py-2.5`,children:[(0,a.jsxs)(`div`,{className:`text-text-positive-weak flex items-center gap-1`,children:[(0,a.jsx)(o.Image,{size:16,"aria-hidden":`true`}),(0,a.jsxs)(`p`,{className:`text-sm`,children:[`Ảnh đã tải lên (`,C.length,`)`]})]}),(0,a.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,a.jsx)(o.Trash2,{size:16,"aria-hidden":`true`}),(0,a.jsx)(`p`,{className:`text-sm`,children:`Xóa tất cả`})]})]}),(0,a.jsx)(`div`,{className:`flex flex-col gap-2.5`,children:C?.map((e,t)=>(0,a.jsx)(d,{file:e,onRemove:()=>E(t),progress:p?.[e.name]},t))})]}):null]})}function d({file:e,progress:i,onRemove:s}){return(0,a.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,a.jsxs)(`div`,{className:`flex flex-1 gap-2.5`,children:[f(e)?(0,a.jsx)(p,{file:e}):null,(0,a.jsxs)(`div`,{className:`flex w-full flex-col gap-2`,children:[(0,a.jsxs)(`div`,{className:`flex flex-col gap-y-0.5`,children:[(0,a.jsx)(`p`,{className:`text-text-positive line-clamp-1 text-sm`,children:e.name}),(0,a.jsx)(`p`,{className:`text-text-positive-muted text-xs`,children:(0,r.formatBytes)(e.size)})]}),i?(0,a.jsx)(n.Progress,{value:i}):null]})]}),(0,a.jsx)(`div`,{className:`flex items-center gap-2`,children:(0,a.jsxs)(t.t,{type:`button`,variant:`ghost`,color:`secondary`,size:`icon`,className:`size-7`,onClick:s,children:[(0,a.jsx)(o.Trash2,{size:16,className:`text-text-positive-muted`,"aria-hidden":`true`}),(0,a.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,a.jsx)(`img`,{src:e.preview,className:`border-border aspect-square size-10 shrink-0 rounded border object-cover object-top shadow-sm`}):(0,a.jsx)(o.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.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime147 from "react/jsx-runtime";
+import * as react_jsx_runtime91 from "react/jsx-runtime";
 import { DropzoneProps } from "react-dropzone";
 
 //#region packages/components/ui/file-uploader.d.ts
@@ -72,7 +72,7 @@ interface FileUploaderProps extends React.HTMLAttributes<HTMLDivElement> {
   showText?: boolean;
   iconSize?: number;
 }
-declare function FileUploader(props: FileUploaderProps): react_jsx_runtime147.JSX.Element;
+declare function FileUploader(props: FileUploaderProps): react_jsx_runtime91.JSX.Element;
 //#endregion
 export { FileUploader };
 //# sourceMappingURL=file-uploader.d.cts.map

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

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime137 from "react/jsx-runtime";
+import * as react_jsx_runtime287 from "react/jsx-runtime";
 import { DropzoneProps } from "react-dropzone";
 
 //#region packages/components/ui/file-uploader.d.ts
@@ -72,7 +72,7 @@ interface FileUploaderProps extends React.HTMLAttributes<HTMLDivElement> {
   showText?: boolean;
   iconSize?: number;
 }
-declare function FileUploader(props: FileUploaderProps): react_jsx_runtime137.JSX.Element;
+declare function FileUploader(props: FileUploaderProps): react_jsx_runtime287.JSX.Element;
 //#endregion
 export { FileUploader };
 //# sourceMappingURL=file-uploader.d.mts.map

package/dist/ui/file-uploader.mjs

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

package/dist/ui/form.cjs

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

package/dist/ui/form.d.cts

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime165 from "react/jsx-runtime";
-import * as react11 from "react";
+import * as react_jsx_runtime185 from "react/jsx-runtime";
+import * as react13 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";
@@ -8,7 +8,7 @@ import { ControllerProps, FieldPath, FieldValues } from "react-hook-form";
 declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: react_hook_form0.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
 declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({
   ...props
-}: ControllerProps<TFieldValues, TName>) => react_jsx_runtime165.JSX.Element;
+}: ControllerProps<TFieldValues, TName>) => react_jsx_runtime185.JSX.Element;
 declare const useFormField: () => {
   invalid: boolean;
   isDirty: boolean;
@@ -23,28 +23,28 @@ declare const useFormField: () => {
   formDescriptionId: string;
   formMessageId: string;
 };
-declare const FormItem: react11.MemoExoticComponent<({
+declare const FormItem: react13.MemoExoticComponent<({
   className,
   orientation,
   ...props
 }: React.ComponentProps<"div"> & {
   orientation?: "vertical" | "horizontal" | "responsive";
-}) => react_jsx_runtime165.JSX.Element>;
-declare const FormLabel: react11.MemoExoticComponent<({
+}) => react_jsx_runtime185.JSX.Element>;
+declare const FormLabel: react13.MemoExoticComponent<({
   ...props
-}: React.ComponentProps<typeof Label.Root>) => react_jsx_runtime165.JSX.Element>;
-declare const FormControl: react11.MemoExoticComponent<({
+}: React.ComponentProps<typeof Label.Root>) => react_jsx_runtime185.JSX.Element>;
+declare const FormControl: react13.MemoExoticComponent<({
   ...props
-}: React.ComponentProps<typeof Slot.Slot>) => react_jsx_runtime165.JSX.Element>;
+}: React.ComponentProps<typeof Slot.Slot>) => react_jsx_runtime185.JSX.Element>;
 declare function FormDescription({
   className,
   ...props
-}: React.ComponentProps<'p'>): react_jsx_runtime165.JSX.Element;
+}: React.ComponentProps<'p'>): react_jsx_runtime185.JSX.Element;
 declare function FormMessage({
   className,
   children,
   ...props
-}: React.ComponentProps<'p'>): react_jsx_runtime165.JSX.Element;
+}: React.ComponentProps<'p'>): react_jsx_runtime185.JSX.Element;
 //#endregion
 export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField };
 //# sourceMappingURL=form.d.cts.map

package/dist/ui/form.d.mts

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime152 from "react/jsx-runtime";
 import * as react1 from "react";
+import * as react_jsx_runtime48 from "react/jsx-runtime";
 import { Label, Slot } from "radix-ui";
 import * as react_hook_form0 from "react-hook-form";
 import { ControllerProps, FieldPath, FieldValues } from "react-hook-form";
@@ -8,7 +8,7 @@ import { ControllerProps, FieldPath, FieldValues } from "react-hook-form";
 declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: react_hook_form0.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
 declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({
   ...props
-}: ControllerProps<TFieldValues, TName>) => react_jsx_runtime152.JSX.Element;
+}: ControllerProps<TFieldValues, TName>) => react_jsx_runtime48.JSX.Element;
 declare const useFormField: () => {
   invalid: boolean;
   isDirty: boolean;
@@ -29,22 +29,22 @@ declare const FormItem: react1.MemoExoticComponent<({
   ...props
 }: React.ComponentProps<"div"> & {
   orientation?: "vertical" | "horizontal" | "responsive";
-}) => react_jsx_runtime152.JSX.Element>;
+}) => react_jsx_runtime48.JSX.Element>;
 declare const FormLabel: react1.MemoExoticComponent<({
   ...props
-}: React.ComponentProps<typeof Label.Root>) => react_jsx_runtime152.JSX.Element>;
+}: React.ComponentProps<typeof Label.Root>) => react_jsx_runtime48.JSX.Element>;
 declare const FormControl: react1.MemoExoticComponent<({
   ...props
-}: React.ComponentProps<typeof Slot.Slot>) => react_jsx_runtime152.JSX.Element>;
+}: React.ComponentProps<typeof Slot.Slot>) => react_jsx_runtime48.JSX.Element>;
 declare function FormDescription({
   className,
   ...props
-}: React.ComponentProps<'p'>): react_jsx_runtime152.JSX.Element;
+}: React.ComponentProps<'p'>): react_jsx_runtime48.JSX.Element;
 declare function FormMessage({
   className,
   children,
   ...props
-}: React.ComponentProps<'p'>): react_jsx_runtime152.JSX.Element;
+}: React.ComponentProps<'p'>): react_jsx_runtime48.JSX.Element;
 //#endregion
 export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField };
 //# sourceMappingURL=form.d.mts.map

package/dist/ui/form.mjs

@@ -1,2 +1,2 @@
-"use client";import"../separator-CWar33xc.mjs";import"../label-DW6shAXZ.mjs";import{Field as e,FieldDescription as t,FieldLabel as n}from"./field.mjs";import{cn as r}from"@customafk/react-toolkit/utils";import{jsx as i}from"react/jsx-runtime";import{createContext as a,memo as o,use as s,useId as c}from"react";import{Slot as l}from"radix-ui";import{Controller as u,FormProvider as d,useFormContext as f,useFormState as p}from"react-hook-form";const m=d,h=a({}),g=({...e})=>i(h.Provider,{value:{name:e.name},children:i(u,{...e})}),_=()=>{let e=s(h),t=s(v),{getFieldState:n,control:r,resetField:i}=f(),a=p({name:e.name}),o=n(e.name,a);if(!e)throw Error(`useFormField should be used within <FormField>`);let{id:c}=t;return{id:c,control:r,resetField:i,name:e.name,formItemId:`${c}-form-item`,formDescriptionId:`${c}-form-item-description`,formMessageId:`${c}-form-item-message`,...o}},v=a({}),y=o(({className:t,orientation:n=`responsive`,...r})=>{let a=c();return i(v.Provider,{value:{id:a},children:i(e,{orientation:n,...r,className:t})})});y.displayName=`FormItem`;const b=o(({...e})=>{let{formItemId:t}=_();return i(n,{htmlFor:t,...e})});b.displayName=`FormLabel`;const x=o(({...e})=>{let{error:t,formItemId:n,formDescriptionId:r,formMessageId:a}=_();return i(l.Slot,{"data-slot":`form-control`,id:n,"aria-describedby":t?`${r} ${a}`:`${r}`,"aria-invalid":!!t,...e})});x.displayName=`FormControl`;function S({className:e,...n}){let{formDescriptionId:a}=_();return i(t,{id:a,className:r(`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 C({className:e,children:t,...n}){let{error:a,formMessageId:o}=_();return i(`span`,{"data-slot":`form-message`,id:o,className:r(`text-danger text-xs`,e),...n,children:a?String(a?.message??``):t})}export{m as Form,x as FormControl,S as FormDescription,g as FormField,y as FormItem,b as FormLabel,C as FormMessage,_ as useFormField};
+"use client";import"../separator-Bf0gymN4.mjs";import"../label-Dqr8nxWi.mjs";import{Field as e,FieldDescription as t,FieldLabel as n}from"./field.mjs";import{cn as r}from"@customafk/react-toolkit/utils";import{createContext as i,memo as a,use as o,useId as s}from"react";import{jsx as c}from"react/jsx-runtime";import{Slot as l}from"radix-ui";import{Controller as u,FormProvider as d,useFormContext as f,useFormState as p}from"react-hook-form";const m=d,h=i({}),g=({...e})=>c(h.Provider,{value:{name:e.name},children:c(u,{...e})}),_=()=>{let e=o(h),t=o(v),{getFieldState:n,control:r,resetField:i}=f(),a=p({name:e.name}),s=n(e.name,a);if(!e)throw Error(`useFormField should be used within <FormField>`);let{id:c}=t;return{id:c,control:r,resetField:i,name:e.name,formItemId:`${c}-form-item`,formDescriptionId:`${c}-form-item-description`,formMessageId:`${c}-form-item-message`,...s}},v=i({}),y=a(({className:t,orientation:n=`responsive`,...r})=>{let i=s();return c(v.Provider,{value:{id:i},children:c(e,{orientation:n,...r,className:t})})});y.displayName=`FormItem`;const b=a(({...e})=>{let{formItemId:t}=_();return c(n,{htmlFor:t,...e})});b.displayName=`FormLabel`;const x=a(({...e})=>{let{error:t,formItemId:n,formDescriptionId:r,formMessageId:i}=_();return c(l.Slot,{"data-slot":`form-control`,id:n,"aria-describedby":t?`${r} ${i}`:`${r}`,"aria-invalid":!!t,...e})});x.displayName=`FormControl`;function S({className:e,...n}){let{formDescriptionId:i}=_();return c(t,{id:i,className:r(`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 C({className:e,children:t,...n}){let{error:i,formMessageId:a}=_();return c(`span`,{"data-slot":`form-message`,id:a,className:r(`text-danger text-xs`,e),...n,children:i?String(i?.message??``):t})}export{m as Form,x as FormControl,S as FormDescription,g as FormField,y as FormItem,b as FormLabel,C as FormMessage,_ as useFormField};
 //# sourceMappingURL=form.mjs.map

package/dist/ui/hover-card.d.cts

@@ -1,19 +1,19 @@
-import * as react_jsx_runtime149 from "react/jsx-runtime";
+import * as react_jsx_runtime124 from "react/jsx-runtime";
 import { HoverCard as HoverCard$1 } from "radix-ui";
 
 //#region packages/components/ui/hover-card.d.ts
 declare function HoverCard({
   ...props
-}: React.ComponentProps<typeof HoverCard$1.Root>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof HoverCard$1.Root>): react_jsx_runtime124.JSX.Element;
 declare function HoverCardTrigger({
   ...props
-}: React.ComponentProps<typeof HoverCard$1.Trigger>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof HoverCard$1.Trigger>): react_jsx_runtime124.JSX.Element;
 declare function HoverCardContent({
   className,
   align,
   sideOffset,
   ...props
-}: React.ComponentProps<typeof HoverCard$1.Content>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof HoverCard$1.Content>): react_jsx_runtime124.JSX.Element;
 //#endregion
 export { HoverCard, HoverCardContent, HoverCardTrigger };
 //# sourceMappingURL=hover-card.d.cts.map

package/dist/ui/hover-card.d.mts

@@ -1,19 +1,19 @@
-import * as react_jsx_runtime149 from "react/jsx-runtime";
+import * as react_jsx_runtime43 from "react/jsx-runtime";
 import { HoverCard as HoverCard$1 } from "radix-ui";
 
 //#region packages/components/ui/hover-card.d.ts
 declare function HoverCard({
   ...props
-}: React.ComponentProps<typeof HoverCard$1.Root>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof HoverCard$1.Root>): react_jsx_runtime43.JSX.Element;
 declare function HoverCardTrigger({
   ...props
-}: React.ComponentProps<typeof HoverCard$1.Trigger>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof HoverCard$1.Trigger>): react_jsx_runtime43.JSX.Element;
 declare function HoverCardContent({
   className,
   align,
   sideOffset,
   ...props
-}: React.ComponentProps<typeof HoverCard$1.Content>): react_jsx_runtime149.JSX.Element;
+}: React.ComponentProps<typeof HoverCard$1.Content>): react_jsx_runtime43.JSX.Element;
 //#endregion
 export { HoverCard, HoverCardContent, HoverCardTrigger };
 //# sourceMappingURL=hover-card.d.mts.map

package/dist/ui/image.cjs

@@ -1 +1 @@
-require(`../skeleton-oQFT4xR2.cjs`);const e=require(`../image-D2PTBG_7.cjs`);exports.Image=e.t;
+require(`../skeleton-CHympz8k.cjs`);const e=require(`../image-DuFv8sPr.cjs`);exports.Image=e.t;

package/dist/ui/image.mjs

@@ -1 +1 @@
-import"../skeleton-6MpPv0K3.mjs";import{t as e}from"../image-Dgxtk54D.mjs";export{e as Image};
+import"../skeleton-Ba6koCVf.mjs";import{t as e}from"../image-CS_Q0WA7.mjs";export{e as Image};

package/dist/ui/input-otp.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`),r=require(`lucide-react`),i=require(`react`),a=require(`input-otp`);function o({className:e,containerClassName:r,...i}){return(0,n.jsx)(a.OTPInput,{"data-slot":`input-otp`,containerClassName:(0,t.cn)(`flex items-center gap-2 has-disabled:opacity-50`,r),className:(0,t.cn)(`disabled:cursor-not-allowed`,e),...i})}function s({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`input-otp-group`,className:(0,t.cn)(`flex items-center`,e),...r})}function c({index:e,className:r,...o}){let{char:s,hasFakeCaret:c,isActive:l}=(0,i.use)(a.OTPInputContext)?.slots[e]??{};return(0,n.jsxs)(`div`,{"data-slot":`input-otp-slot`,"data-active":l,className:(0,t.cn)(`data-[active=true]:border-ring data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:ring-destructive/20 dark:data-[active=true]:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[active=true]:aria-invalid:border-destructive dark:bg-input/30 border-input relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none first:rounded-l-md first:border-l last:rounded-r-md data-[active=true]:z-10 data-[active=true]:ring-[3px]`,r),...o,children:[s,c&&(0,n.jsx)(`div`,{className:`pointer-events-none absolute inset-0 flex items-center justify-center`,children:(0,n.jsx)(`div`,{className:`animate-caret-blink bg-foreground h-4 w-px duration-1000`})})]})}function l({...e}){return(0,n.jsx)(`div`,{"data-slot":`input-otp-separator`,role:`separator`,...e,children:(0,n.jsx)(r.MinusIcon,{})})}exports.InputOTP=o,exports.InputOTPGroup=s,exports.InputOTPSeparator=l,exports.InputOTPSlot=c;
+"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react`),r=require(`react/jsx-runtime`),i=require(`lucide-react`),a=require(`input-otp`);function o({className:e,containerClassName:n,...i}){return(0,r.jsx)(a.OTPInput,{"data-slot":`input-otp`,containerClassName:(0,t.cn)(`flex items-center gap-2 has-disabled:opacity-50`,n),className:(0,t.cn)(`disabled:cursor-not-allowed`,e),...i})}function s({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`input-otp-group`,className:(0,t.cn)(`flex items-center`,e),...n})}function c({index:e,className:i,...o}){let{char:s,hasFakeCaret:c,isActive:l}=(0,n.use)(a.OTPInputContext)?.slots[e]??{};return(0,r.jsxs)(`div`,{"data-slot":`input-otp-slot`,"data-active":l,className:(0,t.cn)(`data-[active=true]:border-ring data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:ring-destructive/20 dark:data-[active=true]:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[active=true]:aria-invalid:border-destructive dark:bg-input/30 border-input relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none first:rounded-l-md first:border-l last:rounded-r-md data-[active=true]:z-10 data-[active=true]:ring-[3px]`,i),...o,children:[s,c&&(0,r.jsx)(`div`,{className:`pointer-events-none absolute inset-0 flex items-center justify-center`,children:(0,r.jsx)(`div`,{className:`animate-caret-blink bg-foreground h-4 w-px duration-1000`})})]})}function l({...e}){return(0,r.jsx)(`div`,{"data-slot":`input-otp-separator`,role:`separator`,...e,children:(0,r.jsx)(i.MinusIcon,{})})}exports.InputOTP=o,exports.InputOTPGroup=s,exports.InputOTPSeparator=l,exports.InputOTPSlot=c;
 //# sourceMappingURL=input-otp.cjs.map

package/dist/ui/input-otp.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime152 from "react/jsx-runtime";
+import * as react_jsx_runtime92 from "react/jsx-runtime";
 import { OTPInput } from "input-otp";
 
 //#region packages/components/ui/input-otp.d.ts
@@ -8,21 +8,21 @@ declare function InputOTP({
   ...props
 }: React.ComponentProps<typeof OTPInput> & {
   containerClassName?: string;
-}): react_jsx_runtime152.JSX.Element;
+}): react_jsx_runtime92.JSX.Element;
 declare function InputOTPGroup({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime152.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime92.JSX.Element;
 declare function InputOTPSlot({
   index,
   className,
   ...props
 }: React.ComponentProps<'div'> & {
   index: number;
-}): react_jsx_runtime152.JSX.Element;
+}): react_jsx_runtime92.JSX.Element;
 declare function InputOTPSeparator({
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime152.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime92.JSX.Element;
 //#endregion
 export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };
 //# sourceMappingURL=input-otp.d.cts.map

package/dist/ui/input-otp.d.mts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime158 from "react/jsx-runtime";
+import * as react_jsx_runtime59 from "react/jsx-runtime";
 import { OTPInput } from "input-otp";
 
 //#region packages/components/ui/input-otp.d.ts
@@ -8,21 +8,21 @@ declare function InputOTP({
   ...props
 }: React.ComponentProps<typeof OTPInput> & {
   containerClassName?: string;
-}): react_jsx_runtime158.JSX.Element;
+}): react_jsx_runtime59.JSX.Element;
 declare function InputOTPGroup({
   className,
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime158.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime59.JSX.Element;
 declare function InputOTPSlot({
   index,
   className,
   ...props
 }: React.ComponentProps<'div'> & {
   index: number;
-}): react_jsx_runtime158.JSX.Element;
+}): react_jsx_runtime59.JSX.Element;
 declare function InputOTPSeparator({
   ...props
-}: React.ComponentProps<'div'>): react_jsx_runtime158.JSX.Element;
+}: React.ComponentProps<'div'>): react_jsx_runtime59.JSX.Element;
 //#endregion
 export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };
 //# sourceMappingURL=input-otp.d.mts.map

package/dist/ui/input-otp.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"@customafk/react-toolkit/utils";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{MinusIcon as r}from"lucide-react";import{use as i}from"react";import{OTPInput as a,OTPInputContext as o}from"input-otp";function s({className:n,containerClassName:r,...i}){return t(a,{"data-slot":`input-otp`,containerClassName:e(`flex items-center gap-2 has-disabled:opacity-50`,r),className:e(`disabled:cursor-not-allowed`,n),...i})}function c({className:n,...r}){return t(`div`,{"data-slot":`input-otp-group`,className:e(`flex items-center`,n),...r})}function l({index:r,className:a,...s}){let{char:c,hasFakeCaret:l,isActive:u}=i(o)?.slots[r]??{};return n(`div`,{"data-slot":`input-otp-slot`,"data-active":u,className:e(`data-[active=true]:border-ring data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:ring-destructive/20 dark:data-[active=true]:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[active=true]:aria-invalid:border-destructive dark:bg-input/30 border-input relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none first:rounded-l-md first:border-l last:rounded-r-md data-[active=true]:z-10 data-[active=true]:ring-[3px]`,a),...s,children:[c,l&&t(`div`,{className:`pointer-events-none absolute inset-0 flex items-center justify-center`,children:t(`div`,{className:`animate-caret-blink bg-foreground h-4 w-px duration-1000`})})]})}function u({...e}){return t(`div`,{"data-slot":`input-otp-separator`,role:`separator`,...e,children:t(r,{})})}export{s as InputOTP,c as InputOTPGroup,u as InputOTPSeparator,l as InputOTPSlot};
+"use client";import{cn as e}from"@customafk/react-toolkit/utils";import{use as t}from"react";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{MinusIcon as i}from"lucide-react";import{OTPInput as a,OTPInputContext as o}from"input-otp";function s({className:t,containerClassName:r,...i}){return n(a,{"data-slot":`input-otp`,containerClassName:e(`flex items-center gap-2 has-disabled:opacity-50`,r),className:e(`disabled:cursor-not-allowed`,t),...i})}function c({className:t,...r}){return n(`div`,{"data-slot":`input-otp-group`,className:e(`flex items-center`,t),...r})}function l({index:i,className:a,...s}){let{char:c,hasFakeCaret:l,isActive:u}=t(o)?.slots[i]??{};return r(`div`,{"data-slot":`input-otp-slot`,"data-active":u,className:e(`data-[active=true]:border-ring data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:ring-destructive/20 dark:data-[active=true]:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[active=true]:aria-invalid:border-destructive dark:bg-input/30 border-input relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none first:rounded-l-md first:border-l last:rounded-r-md data-[active=true]:z-10 data-[active=true]:ring-[3px]`,a),...s,children:[c,l&&n(`div`,{className:`pointer-events-none absolute inset-0 flex items-center justify-center`,children:n(`div`,{className:`animate-caret-blink bg-foreground h-4 w-px duration-1000`})})]})}function u({...e}){return n(`div`,{"data-slot":`input-otp-separator`,role:`separator`,...e,children:n(i,{})})}export{s as InputOTP,c as InputOTPGroup,u as InputOTPSeparator,l as InputOTPSlot};
 //# sourceMappingURL=input-otp.mjs.map

package/dist/ui/input.cjs

@@ -1 +1 @@
-"use client";const e=require(`../input-dAoEznUI.cjs`);exports.Input=e.t;
+"use client";const e=require(`../input-BFWWaN-v.cjs`);exports.Input=e.t,exports.inputVariants=e.n;

package/dist/ui/input.d.cts

@@ -1,2 +1,2 @@
-import { t as Input } from "../input-B2Y92Ylo.cjs";
-export { Input };
+import { n as InputVariantProps, r as inputVariants, t as Input } from "../input-mGRGirZ_.cjs";
+export { Input, InputVariantProps, inputVariants };