@customafk/lunas-ui 0.2.64 → 0.2.66

package/dist/tanstack-form-DTCgWGCA.mjs

@@ -1,2 +0,0 @@
-import{Button as e}from"./ui/button.mjs";import{Tooltip as t,TooltipContent as n,TooltipTrigger as r}from"./ui/tooltip.mjs";import{Separator as i}from"./ui/separator.mjs";import{t as a}from"./close-DYJZ8fkh.mjs";import{Dialog as o,DialogClose as s,DialogContent as c,DialogOverlay as l,DialogPortal as u,DialogTitle as d}from"./ui/dialog.mjs";import{Command as f,CommandEmpty as p,CommandGroup as m,CommandInput as h,CommandItem as g,CommandList as _}from"./ui/command.mjs";import{Switch as v}from"./ui/switch.mjs";import{Checkbox as y}from"./ui/checkbox.mjs";import{Input as b}from"./ui/input.mjs";import{Label as x}from"./ui/label.mjs";import{Popover as S,PopoverContent as C,PopoverTrigger as w}from"./ui/popover.mjs";import{Select as T,SelectContent as E,SelectItem as D,SelectTrigger as O,SelectValue as k}from"./ui/select.mjs";import{Drawer as A,DrawerClose as j,DrawerContent as M,DrawerHeader as ee,DrawerTitle as te}from"./ui/drawer.mjs";import{Calendar as ne}from"./ui/calendar.mjs";import{RadioGroup as re,RadioGroupItem as ie}from"./ui/radio-group.mjs";import{Textarea as ae}from"./ui/textarea.mjs";import{t as oe}from"./text-editor-BQtIXOpM.mjs";import{ArrowDownToLine as se,AtSignIcon as ce,BanIcon as le,CalendarDaysIcon as ue,CheckIcon as de,ChevronDownIcon as fe,CopyIcon as pe,EyeIcon as me,EyeOffIcon as he,HelpCircleIcon as ge,InfoIcon as _e,Loader2Icon as ve,PackagePlusIcon as ye,PlusIcon as be,Trash2Icon as xe,XIcon as N}from"lucide-react";import{memo as P,useCallback as F,useEffect as Se,useId as I,useMemo as Ce,useRef as we,useState as L}from"react";import{cn as R}from"@customafk/react-toolkit/utils";import{cva as Te}from"class-variance-authority";import{Fragment as Ee,jsx as z,jsxs as B}from"react/jsx-runtime";import{endOfToday as De,endOfTomorrow as Oe,endOfYesterday as ke,format as Ae,lastDayOfMonth as je,startOfMonth as Me,subDays as Ne}from"@customafk/react-toolkit/date-fns";import{Dialog as V,Label as Pe,Separator as Fe,Switch as Ie}from"radix-ui";import{useIsMobile as Le}from"@customafk/react-toolkit/hooks/useMobile";import{createFormHook as Re,createFormHookContexts as ze,useStore as H}from"@tanstack/react-form";function Be({width:e,className:t,children:n}){return z(`div`,{"data-slot":`array-col`,style:e?{width:typeof e==`number`?`${e}px`:e,flexShrink:0}:{flex:1,minWidth:0},className:t,children:n})}function Ve({className:e,children:t}){return B(`div`,{"data-slot":`array-header-row`,className:R(`mb-1 flex items-center gap-2 px-1 text-xs font-medium text-text-positive-weak`,e),children:[t,z(`div`,{className:`min-w-8 w-8 shrink-0`})]})}function He({defaultRow:t,children:n,addLabel:r=`Thêm hàng`,className:i}){let a=$(),o=a.state.value??[],s=F(()=>{a.pushValue({...t})},[a,t]),c=F(e=>{a.removeValue(e)},[a]);return B(`div`,{"data-slot":`simple-array-field`,className:R(`flex flex-col gap-2`,i),children:[o.map((t,r)=>B(`div`,{className:`flex items-start gap-2`,children:[n(r),z(e,{type:`button`,size:`icon`,variant:`ghost`,color:`danger`,className:`min-w-8`,onClick:()=>c(r),children:z(xe,{size:14})})]},r)),z(`div`,{children:B(e,{type:`button`,variant:`outline`,color:`muted`,size:`xs`,onClick:s,children:[z(be,{size:13}),r]})})]})}function Ue({className:e,children:t,...n}){return B(Pe.Root,{"data-slot":`label`,className:R(`text-text-positive`,`flex w-full items-center justify-between`,`select-none font-medium text-sm/6 leading-none`,`group-data-[disabled=true]:pointer-events-none`,`group-data-[disabled=true]:opacity-50`,`peer-disabled:cursor-not-allowed`,`peer-disabled:opacity-50`,`aria-required:*:data-[slot=required-indicator]:inline-block`,e),...n,children:[z(`span`,{className:`flex items-center gap-1`,children:t}),z(`span`,{"data-slot":`required-indicator`,className:`hidden shrink-0 rounded-lg bg-danger-strong px-1.5 py-1 font-semibold text-[11px] leading-none text-white`,children:`Bắt buộc`})]})}const We=Te(`group/field flex w-full gap-2 data-[invalid=true]:text-danger *:data-[slot=field-content]:gap-0`,{variants:{orientation:{vertical:[`flex-col *:w-full [&>.sr-only]:w-auto`],horizontal:[`flex-row items-center gap-4`,`*:data-[slot=field-content]:basis-1/2`,`*:data-[slot=field-content-main]:flex-1`,`*: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:gap-4`,`@md/field-group:*:w-auto`,`@md/field-group:*:data-[slot=field-content]:basis-1/2`,`@md/field-group:*:data-[slot=field-content-main]:basis-1/2`,`@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`}}),Ge=P(({className:e,...t})=>z(`fieldset`,{"data-slot":`field-set`,className:R(`flex flex-col gap-6 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3`,e),...t}));Ge.displayName=`FieldSet`;const Ke=P(({className:e,variant:t=`legend`,...n})=>z(`legend`,{"data-slot":`field-legend`,"data-variant":t,className:R(`mb-3 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base`,e),...n}));Ke.displayName=`FieldLegend`;const U=P(({className:e,...t})=>z(`div`,{"data-slot":`field-group`,className:R(`group/field-group @container/field-group`,`flex flex-col gap-7 pt-4`,`data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4`,e),...t}));U.displayName=`FieldGroup`;const W=P(({className:e,orientation:t=`vertical`,...n})=>z(`div`,{"data-slot":`field`,"data-orientation":t,className:R(We({orientation:t}),e),...n}));W.displayName=`Field`;const G=P(({className:e,...t})=>z(`div`,{"data-slot":`field-content`,className:R(`group/field-content flex flex-col gap-1.5 leading-snug`,e),...t}));G.displayName=`FieldContent`;const K=P(({className:e,...t})=>z(`div`,{"data-slot":`field-content-main`,className:R(`relative`,e),...t}));K.displayName=`FieldContentMain`;const q=P(({className:e,...t})=>z(Ue,{"data-slot":`field-label`,className:R(`group/field-label peer/field-label min-h-6 gap-1 font-medium leading-snug`,`has-[>[data-slot=field]]:w-full`,`has-[>[data-slot=field]]:flex-col`,`has-[>[data-slot=field]]:rounded-md`,`has-[>[data-slot=field]]:border`,`has-[>[data-slot=field]]:border-border`,`has-data-[state=checked]:border-primary`,`*:data-[slot=field]:p-4 group-data-[disabled=true]/field:opacity-50`,e),...t}));q.displayName=`FieldLabel`;const qe=P(({className:e,...t})=>z(`div`,{"data-slot":`field-label`,className:R(`flex w-fit items-center gap-2 font-medium text-sm leading-snug group-data-[disabled=true]/field:opacity-50`,e),...t}));qe.displayName=`FieldTitle`;const J=P(({className:e,...t})=>z(`p`,{"data-slot":`field-description`,className:R(`nth-last-2:-mt-1 font-normal text-text-positive-weak text-xs leading-normal last:mt-0 [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4 [[data-variant=legend]+&]:-mt-1.5`,e),...t}));J.displayName=`FieldDescription`;const Y=P(({isShow:e=!0,className:t,children:n,...r})=>e===!1?null:B(`div`,{"data-slot":`field-note`,className:R(`flex items-start gap-1.5 rounded border border-primary-muted/60 bg-primary-bg-subtle/80 px-2.5 py-2 text-text-positive-weak text-xs`,t),...r,children:[z(_e,{size:12,className:`mt-0.5 shrink-0 text-primary/70`}),z(`span`,{children:n})]}));Y.displayName=`FieldNote`;const X=P(({tooltip:e})=>B(t,{children:[z(r,{asChild:!0,children:B(`button`,{type:`button`,tabIndex:-1,className:`inline-flex cursor-default items-center text-text-positive-weak/70 hover:text-text-positive focus:outline-none`,children:[z(ge,{size:13,"aria-hidden":`true`}),z(`span`,{className:`sr-only`,children:`Thêm thông tin`})]})}),z(n,{side:`top`,className:`max-w-xs text-balance`,children:e})]}));X.displayName=`FieldTooltip`;const Z=P(({children:e,className:t,...n})=>B(`div`,{"data-slot":`field-separator`,"data-content":!!e,className:R(`relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2`,t),...n,children:[z(i,{className:`absolute inset-0 top-1/2`}),e&&z(`span`,{className:`relative mx-auto block w-fit bg-background px-2 text-text-positive-weak`,"data-slot":`field-separator-content`,children:e})]}));Z.displayName=`FieldSeparator`;const Q=P(({className:e,children:t,errors:n,requiredMessage:r=`Trường này là bắt buộc`,...i})=>{let a=Ce(()=>{let e=e=>e.code===`invalid_type`?r:e.message;return t||(n?n?.length===1&&n[0]?.message?z(`div`,{className:`flex flex-row items-center justify-start gap-x-0.5`,children:z(`p`,{children:e(n[0])})}):z(`ul`,{className:`flex list-none flex-col`,children:n.map(t=>typeof t==`string`?z(`li`,{children:t},t):t?.message?z(`li`,{children:e(t)},t.code??t.message):null)}):null)},[t,n,r]);return a?z(`div`,{role:`alert`,"data-slot":`field-error`,className:R(`w-full font-medium text-danger-strong text-xs`,e),...i,children:a}):null});Q.displayName=`FieldError`;const Je=({label:e,required:t,disabled:n,variant:r=`checkbox`})=>{let i=I(),{form:a,name:o,state:s,handleBlur:c,handleChange:l}=$(),u=H(a.store,({isSubmitting:e})=>e),d=s.meta.isTouched&&!s.meta.isValid,f=s.value??!1,p=n||u,m=F(e=>{u||l(e)},[u,l]);return B(`div`,{className:`flex flex-col gap-1.5`,children:[B(`div`,{className:`flex items-center gap-2 h-9`,children:[z(r===`switch`?v:y,{id:i,name:o,checked:f,disabled:p,"aria-invalid":d,onBlur:c,onCheckedChange:m}),e&&B(x,{htmlFor:i,className:`cursor-pointer`,children:[e,t&&z(`span`,{className:`text-danger-strong`,children:`*`})]})]}),d&&z(Q,{errors:s.meta.errors})]})},Ye=({label:t,placeholder:n,required:r,disabled:i,options:a})=>{let o=I(),{form:s,state:c,handleBlur:l,handleChange:u}=$(),d=H(s.store,({isSubmitting:e})=>e),v=Le(),[y,b]=L(!1),T=c.meta.isTouched&&!c.meta.isValid,E=i||d,D=a.find(({value:e})=>e===c.value)?.label,O=B(f,{children:[z(h,{placeholder:n??`Tìm kiếm…`}),B(_,{children:[z(p,{children:`Không tìm thấy kết quả.`}),z(m,{children:a.map(e=>z(g,{value:e.label,onSelect:()=>{u(e.value===c.value?null:e.value),b(!1)},children:e.label},e.value))})]})]});return v?B(`div`,{className:`flex flex-col gap-1.5`,children:[t&&B(x,{htmlFor:o,children:[t,r&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),z(e,{id:o,type:`button`,variant:`outline`,color:`muted`,disabled:E,"aria-invalid":T,className:R(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!c.value&&`text-text-positive-muted`,T&&`outline-danger bg-danger-bg-subtle`),onBlur:l,onClick:()=>b(!0),children:D??z(`span`,{className:`text-text-positive-muted`,children:n})}),z(A,{open:y,onOpenChange:b,direction:`bottom`,children:B(M,{children:[z(ee,{children:z(te,{children:t??n??`Tìm kiếm…`})}),z(`div`,{className:`overflow-y-auto pb-safe-bottom`,children:O})]})}),T&&z(Q,{errors:c.meta.errors})]}):B(`div`,{className:`flex flex-col gap-1.5`,children:[t&&B(x,{htmlFor:o,children:[t,r&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),B(S,{children:[z(w,{asChild:!0,children:z(e,{id:o,variant:`outline`,color:`muted`,size:`lg`,disabled:E,"aria-invalid":T,className:R(`flex w-full items-center justify-start rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,!c.value&&`text-text-positive-muted`),children:D??z(`span`,{className:`text-text-positive-muted`,children:n})})}),z(C,{align:`start`,side:`bottom`,className:`w-[--radix-popover-trigger-width] p-0 rounded`,onBlur:l,children:O})]}),T&&z(Q,{errors:c.meta.errors})]})},Xe=({label:t,placeholder:n,required:r,disabled:i,minDate:a,maxDate:o})=>{let s=I(),{form:c,state:l,handleBlur:u,handleChange:d}=$(),f=H(c.store,({isSubmitting:e})=>e),p=l.meta.isTouched&&!l.meta.isValid;return B(`div`,{className:`flex flex-col gap-1.5`,children:[t&&B(x,{htmlFor:s,children:[t,r&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),B(S,{children:[z(w,{asChild:!0,children:B(e,{id:s,variant:`outline`,color:`muted`,size:`lg`,disabled:i||f,"aria-invalid":p,className:R(`flex w-full items-center justify-between rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,l.value===null&&`text-text-positive-muted`),children:[z(`span`,{children:l.value?Ae(l.value,`PPP`):n??`Select date`}),z(ue,{strokeWidth:1})]})}),z(C,{align:`start`,side:`bottom`,className:`w-fit p-0 rounded`,onBlur:u,children:z(ne,{mode:`single`,selected:l.value??void 0,hidden:{before:a??new Date(1900,0,1),after:o??new Date(2100,11,31)},onSelect:e=>{e&&d(e)}})})]}),p&&z(Q,{errors:l.meta.errors})]})},Ze=({label:e,required:t,disabled:n,options:r,orientation:i=`vertical`})=>{let{form:a,name:o,state:s,handleBlur:c,handleChange:l}=$(),u=H(a.store,({isSubmitting:e})=>e),d=s.meta.isTouched&&!s.meta.isValid,f=n||u;return B(`div`,{className:`flex flex-col gap-1.5`,children:[e&&B(x,{children:[e,t&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),z(re,{name:o,value:s.value??``,disabled:f,"aria-invalid":d,className:i===`horizontal`?`flex flex-row flex-wrap gap-x-4 gap-y-2`:`flex flex-col gap-2`,onValueChange:l,onBlur:c,children:r.map(e=>B(`div`,{className:`flex items-center gap-2`,children:[z(ie,{id:`${o}-${e.value}`,value:e.value}),z(x,{htmlFor:`${o}-${e.value}`,className:`cursor-pointer font-normal`,children:e.label})]},e.value))}),d&&z(Q,{errors:s.meta.errors})]})},Qe=({label:e,placeholder:t,required:n,maxLength:r,disabled:i})=>{let a=I(),{form:o,name:s,state:c,handleBlur:l,handleChange:u}=$(),d=H(o.store,({isSubmitting:e})=>e),f=c.meta.isTouched&&!c.meta.isValid,p=F(({target:{value:e}})=>{d||r&&e.length>r||u(e||null)},[d,r,u]);return B(`div`,{className:`flex flex-col gap-1.5`,children:[e&&B(x,{htmlFor:a,children:[e,n&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),B(`div`,{className:`relative`,children:[z(b,{id:a,name:s,type:`email`,value:c.value??``,"aria-invalid":f,autoComplete:`email`,placeholder:t,disabled:i||d,className:R(`pl-9`),onBlur:l,onChange:p}),z(`div`,{className:`pointer-events-none absolute inset-y-0 left-0 flex size-9 items-center justify-center text-muted`,children:z(ce,{size:14})})]}),f&&z(Q,{errors:c.meta.errors})]})},$e=e=>e?/^-?\d*\.?\d*$/:/^\d*\.?\d*$/,et=e=>Number(e).toLocaleString(),tt=(e,t,n)=>{if(n===`none`)return e;let r=10**t,i=e*r;switch(n){case`up`:return Math.ceil(i)/r;case`down`:return Math.floor(i)/r;case`nearest`:return i%1<.1?Math.floor(i)/r:i%1>=.59?Math.ceil(i)/r:(Math.floor(i)+.5)/r;default:return e}},nt=({disabled:e=!1,readOnly:t=!1,allowNegative:n=!1,numberAfterDecimalPoint:r=2,roundingRule:i=`none`,value:a=null,unitText:o,decimal:s,placeholder:c,precision:l,wrapperClassName:u,className:d,onChange:f,onValueChange:p,onFocus:m,onBlur:h,...g})=>{let _=we(null),v=we(null),[y,x]=L(a?.toString()??null),S=Ce(()=>s?.[1]??r,[s,r]),C=Ce(()=>s&&s[0]-s[1],[s]),w=Ce(()=>$e(n),[n]),T=F(e=>{if(!S||e===`-`)return!0;let[t,n=``]=e.split(`.`),r=t.startsWith(`-`)?t.length-1:t.length;return n.length<=S&&r<=(C??1/0)},[S,C]),E=F(e=>{if(e===`0`)return`0`;if(!Number(e))return null;let[t,n=``]=tt(parseFloat(e),Math.min(S-1,l||0),i).toString().split(`.`),r=et(t);return n?`${r}.${n}`:r},[S,l,i]),D=F(e=>{let t=e===`0`,n=e===`-`||/^-0+(\.0+)?$/.test(e)||/^-0*\.$/.test(e);if(t){p?.(0),x(e);return}if(n){x(()=>(p?.(0),e));return}},[p]),O=F(e=>{f?.(e);let{value:t}=e.target;if(t===``||t===void 0){p?.(null),x(null);return}D(t),!(!w.test(t)||!T(t))&&(p?.(parseFloat(t)||0),x(t))},[T,f,p,D,w]),k=F(e=>{t||(m?.(e),x(e=>typeof e==`string`?e.replace(/,/g,``):null))},[t,m]),A=F(e=>{t||(h?.(e),x(e=>e===null?null:e===`0`||e===`-`||/^-0+(\.0+)?$/.test(e)||/^-0*\.$/.test(e)?`0`:typeof e==`string`?E(e):null))},[t,E,h]);return Se(()=>{let e=document.activeElement===v.current;if(a==null||!w.test(a.toString())||!T(a.toString())){x(null);return}x(t=>e?t:E(a.toString()))},[E,a,T,w]),Se(()=>{if(!_.current||!v.current||!o)return;let e=_.current.offsetWidth;v.current.style.setProperty(`padding-right`,`${(e+10)/16}rem`)},[o]),B(`div`,{className:R(`relative`,u),children:[z(b,{...g,ref:v,value:y||(t?`0`:``),placeholder:c,disabled:e,readOnly:t,className:R(`text-end font-number text-sm slashed-zero lining-nums tabular-nums`,t&&`bg-muted text-muted-foreground`,d),onChange:O,onFocus:k,onBlur:A}),o&&z(`span`,{ref:_,className:`-translate-y-1/2 pointer-events-none absolute top-1/2 right-2 text-muted-foreground text-sm`,children:o})]})},rt=({label:e,placeholder:t,required:n,unit:r,allowNegative:i,disabled:a})=>{let o=I(),{form:s,state:c,handleBlur:l,handleChange:u}=$(),d=H(s.store,({isSubmitting:e})=>e),f=c.meta.isTouched&&!c.meta.isValid,p=F(e=>{d||u(e)},[d,u]);return B(`div`,{className:`flex flex-col gap-1.5`,children:[e&&B(x,{htmlFor:o,children:[e,n&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),z(nt,{id:o,value:c.value,placeholder:t,unitText:r,allowNegative:i,disabled:a||d,onBlur:l,onValueChange:p}),f&&z(Q,{errors:c.meta.errors})]})},it=({label:e,placeholder:t,required:n,disabled:r})=>{let i=I(),{form:a,name:o,state:s,handleBlur:c,handleChange:l}=$(),u=H(a.store,({isSubmitting:e})=>e),[d,f]=L(!1),p=s.meta.isTouched&&!s.meta.isValid,m=F(()=>f(e=>!e),[]),h=F(({target:{value:e}})=>{u||l(e||null)},[u,l]);return B(`div`,{className:`flex flex-col gap-1.5`,children:[e&&B(x,{htmlFor:i,children:[e,n&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),B(`div`,{className:`relative`,children:[z(b,{id:i,name:o,type:d?`text`:`password`,value:s.value??``,"aria-invalid":p,autoComplete:`current-password`,placeholder:t,disabled:r||u,className:`pr-9`,onBlur:c,onChange:h}),z(`button`,{type:`button`,tabIndex:-1,"aria-label":d?`Ẩn mật khẩu`:`Hiện mật khẩu`,"aria-pressed":d,"aria-controls":i,className:`absolute inset-y-0 right-0 flex size-9 items-center justify-center text-muted outline-none transition-colors hover:text-text-positive focus-visible:text-text-positive disabled:pointer-events-none disabled:opacity-50`,disabled:r||u,onClick:m,children:z(d?he:me,{size:16,"aria-hidden":`true`})})]}),p&&z(Q,{errors:s.meta.errors})]})},at=({label:t,placeholder:n,required:r,options:i})=>{let a=I(),{state:o,handleBlur:s,handleChange:c}=$(),l=Le(),[u,d]=L(!1),f=o.meta.isTouched&&!o.meta.isValid,p=i.find(e=>e.value===o.value)?.label;return l?B(`div`,{className:`flex flex-col gap-1.5`,children:[t&&B(x,{htmlFor:a,children:[t,r&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),z(e,{id:a,type:`button`,variant:`outline`,color:`muted`,className:R(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!o.value&&`text-text-positive-muted`,f&&`outline-danger bg-danger-bg-subtle`),"aria-invalid":f,onBlur:s,onClick:()=>d(!0),children:p??z(`span`,{className:`text-text-positive-muted`,children:n})}),z(A,{open:u,onOpenChange:d,direction:`bottom`,children:B(M,{children:[z(ee,{children:z(te,{children:t??n??`Select an option`})}),z(`div`,{className:`flex flex-col overflow-y-auto pb-safe-bottom`,children:i.length>0?i.map(e=>z(j,{asChild:!0,children:z(`button`,{type:`button`,className:R(`flex w-full items-center px-4 py-3 text-left text-sm transition-colors`,`hover:bg-muted-muted active:bg-muted-muted`,o.value===e.value&&`bg-primary-bg-subtle font-medium text-primary`),onClick:()=>{c(e.value),d(!1)},children:e.label})},e.value)):B(`div`,{className:`flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak`,children:[z(ye,{strokeWidth:1}),`No options available`]})})]})}),f&&z(Q,{errors:o.meta.errors})]}):B(`div`,{className:`flex flex-col gap-1.5`,children:[t&&B(x,{htmlFor:a,children:[t,r&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),B(T,{value:o.value??``,onValueChange:c,children:[z(O,{id:a,"aria-invalid":f?`true`:void 0,onBlur:s,children:z(k,{placeholder:n})}),z(E,{children:i.length>0?i.map(e=>z(D,{value:e.value,children:e.label},e.value)):B(`div`,{className:`flex items-center justify-center gap-x-2 rounded border border-border bg-muted-muted px-4 py-6.5 text-center text-sm text-text-positive-weak`,children:[z(ye,{strokeWidth:1}),`No options available`]})})]}),f&&z(Q,{errors:o.meta.errors})]})},ot=({label:e,placeholder:t,required:n,maxLength:r,rows:i,disabled:a})=>{let o=I(),{form:s,name:c,state:l,handleBlur:u,handleChange:d}=$(),f=H(s.store,({isSubmitting:e})=>e),p=l.meta.isTouched&&!l.meta.isValid,m=F(({target:{value:e}})=>{f||r&&e.length>r||d(e||null)},[f,r,d]);return B(`div`,{className:`flex flex-col gap-1.5`,children:[e&&B(x,{htmlFor:o,children:[e,n&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),z(ae,{id:o,name:c,value:l.value??``,"aria-invalid":p,placeholder:t,rows:i,disabled:a||f,onBlur:u,onChange:m}),p&&z(Q,{errors:l.meta.errors})]})},st=({label:e,placeholder:t,required:n,maxLength:r,disabled:i})=>{let a=I(),{form:o,name:s,state:c,handleBlur:l,handleChange:u}=$(),d=H(o.store,({isSubmitting:e})=>e),f=c.meta.isTouched&&!c.meta.isValid,p=F(({target:{value:e}})=>{d||r&&e.length>r||u(e||null)},[d,r,u]);return B(`div`,{className:`flex flex-col gap-1.5`,children:[e&&B(x,{htmlFor:a,children:[e,n&&z(`span`,{className:`text-danger-strong`,children:`*`})]}),z(b,{id:a,name:s,value:c.value??``,"aria-invalid":f,placeholder:t,autoComplete:`off`,disabled:i||d,onBlur:l,onChange:p}),f&&z(Q,{errors:c.meta.errors})]})},ct=({label:e,description:t,options:n,tooltip:r,helperText:i,orientation:a})=>{let o=$(),s=H(o.form.store,({isSubmitting:e})=>e);return B(U,{className:`gap-y-4 px-4`,children:[B(W,{orientation:a,children:[B(G,{children:[B(q,{children:[e,r&&z(X,{tooltip:r})]}),z(J,{children:t}),z(Y,{isShow:!!i,children:i})]}),z(K,{children:z(U,{className:`flex flex-col gap-y-2`,children:n.map(e=>B(W,{orientation:`horizontal`,children:[z(y,{id:`${o.name}-${e.value}`,name:o.name,checked:o.state.value?.includes(e.value)??!1,disabled:s,onCheckedChange:t=>{if(t&&o.state.value!==null)o.pushValue(e.value);else if(t&&o.state.value===null)o.setValue([e.value]);else if(!t&&o.state.value!==null){let t=o.state.value.indexOf(e.value);t>-1&&o.removeValue(t)}else o.setValue(null)}}),z(q,{htmlFor:`${o.name}-${e.value}`,className:`text-text-positive`,children:e.label})]},e.value))})})]}),z(Z,{})]})},lt=P(({label:t,description:n,placeholder:r,tooltip:i,helperText:a,orientation:c=`responsive`,options:d,required:v=!1,disabled:y=!1,clearable:b=!1,showErrorMessage:x=!0})=>{let T=I(),E=$(),D=Le(),[O,k]=L(!1),[A,j]=L(!1),M=H(E.form.store,({isSubmitting:e})=>e),ee=y||M,te=E.state.meta.isDirty||E.state.meta.isTouched,ne=te&&!E.state.meta.isValid,re=v&&E.state.value===null,ie=b&&!!E.state.value&&!ee,ae=d.find(({value:e})=>e===E.state.value)?.label,oe=()=>{E.handleChange(null),E.handleBlur()},se=t=>z(e,{variant:`outline`,color:`muted`,size:`lg`,disabled:ee,"aria-invalid":ne?!0:void 0,"aria-describedby":T,className:R(`flex w-full items-center justify-start rounded outline-border`,`hover:bg-transparent`,`focus-visible:outline-1 focus-visible:outline-primary-strong focus-visible:ring-4 focus-visible:ring-primary-weak`,`data-[state=open]:text-text-positive-muted data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,ie&&`pr-8`,!E.state.value&&`text-text-positive-muted`,ne&&`outline-danger bg-danger-bg-subtle ring-4 ring-danger-weak`),onClick:t,children:ae?z(`p`,{className:`flex min-w-0 flex-1 items-center gap-2 truncate text-start`,children:ae}):z(`p`,{className:`flex-1 text-start text-text-positive-muted`,children:r})}),ce=e=>B(f,{className:`border-none`,children:[z(h,{placeholder:r??`Tìm kiếm…`}),B(_,{children:[z(p,{className:`flex min-h-30 items-center justify-center text-sm text-text-positive-weak`,children:`Không tìm thấy kết quả nào phù hợp.`}),z(m,{className:`max-h-60 overflow-y-auto`,children:d.map(({value:t,label:n})=>z(g,{value:n,onSelect:()=>e(t),children:n},t))})]})]});return B(U,{className:`gap-y-4 px-4`,children:[B(W,{orientation:c,"data-invalid":ne,children:[B(G,{children:[B(q,{"aria-required":re,htmlFor:E.name,children:[t,i&&z(X,{tooltip:i})]}),z(J,{children:n})]}),z(K,{className:`flex justify-end`,children:B(`div`,{className:`flex w-full flex-col`,children:[B(`div`,{className:`relative`,children:[D?B(Ee,{children:[se(()=>k(!0)),z(o,{open:O,onOpenChange:e=>{k(e),e||E.handleBlur()},children:B(u,{children:[z(l,{}),B(V.Content,{onOpenAutoFocus:e=>e.preventDefault(),className:R(`fixed inset-x-0 bottom-0 z-50`,`flex flex-col bg-background rounded-t-2xl outline-none`,`max-h-[80dvh] shadow-[0_-4px_24px_rgba(0,0,0,0.08)]`,`data-[state=open]:animate-in data-[state=open]:slide-in-from-bottom data-[state=open]:fade-in-0`,`data-[state=closed]:animate-out data-[state=closed]:slide-out-to-bottom data-[state=closed]:fade-out-0`,`duration-300`),children:[B(`div`,{className:`flex items-center justify-between px-4 py-3 border-b border-border shrink-0`,children:[z(`span`,{className:`font-semibold text-sm text-text-positive`,children:t}),z(s,{asChild:!0,children:z(`button`,{type:`button`,"aria-label":`Đóng`,className:`flex size-7 items-center justify-center rounded-md text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive`,children:z(N,{size:16})})})]}),B(`div`,{className:`flex flex-col overflow-y-auto`,children:[ie&&z(s,{asChild:!0,children:B(`button`,{type:`button`,className:`flex w-full items-center gap-x-2 px-4 py-3 text-left text-sm text-danger-strong transition-colors hover:bg-danger-bg-subtle`,onClick:oe,children:[z(N,{size:14}),`Xóa lựa chọn`]})}),ce(e=>{E.handleChange(e),k(!1),E.handleBlur()})]}),z(`div`,{className:`shrink-0 h-safe-bottom`})]})]})})]}):B(S,{open:A,onOpenChange:e=>{j(e),e||E.handleBlur()},children:[z(w,{asChild:!0,children:se()}),z(C,{align:`end`,side:`bottom`,className:`flex w-fit rounded p-0`,children:ce(e=>{E.handleChange(e),j(!1),E.handleBlur()})})]}),ie&&z(`button`,{type:`button`,"aria-label":`Xóa lựa chọn`,className:`absolute right-2 top-1/2 -translate-y-1/2 flex size-4 cursor-pointer items-center justify-center rounded-md text-text-positive-weak outline-none transition-[color,transform] hover:text-text-positive focus-visible:text-primary-strong focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:oe,children:z(N,{"aria-hidden":`true`})})]}),te&&x&&z(Q,{id:T,className:`mt-1`,errors:E.state.meta.errors}),z(Y,{isShow:!!a,children:a})]})})]}),z(Z,{})]})});lt.displayName=`ComboboxField`;const ut=P(({label:t,description:n,placeholder:r,orientation:i=`responsive`,tooltip:a,helperText:o,showErrorMessage:s=!0,required:c=!1,disabled:l=!1,minDate:u,maxDate:d})=>{let f=I(),p=$(),[m,h]=L(!1),g=H(p.form.store,({isSubmitting:e})=>e),_=l||g,v=p.state.meta.isDirty||p.state.meta.isTouched,y=v&&!p.state.meta.isValid,b=c&&p.state.value===null,x=e=>{p.handleChange(e),h(!1)};return B(U,{className:`px-4`,children:[B(W,{orientation:i,"data-invalid":y,children:[B(G,{children:[B(q,{htmlFor:p.name,"aria-required":b,children:[t,a&&z(X,{tooltip:a})]}),z(J,{children:n})]}),z(K,{className:`flex flex-col space-y-1`,children:B(`div`,{className:`flex w-full flex-col`,children:[B(S,{open:m,onOpenChange:e=>{h(e),e||p.handleBlur()},children:[z(w,{asChild:!0,children:B(e,{variant:`outline`,color:`muted`,size:`lg`,disabled:_,"aria-invalid":y?!0:void 0,"aria-describedby":f,className:R(`flex items-center justify-between rounded font-normal outline-border`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,p.state.value===null&&`text-text-positive-muted`,y&&`outline-danger bg-danger-bg-subtle ring-4 ring-danger-weak`),children:[z(`p`,{children:p.state.value===null?r??`Select date`:Ae(p.state.value,`PPPP`)}),z(ue,{strokeWidth:1})]})}),B(C,{align:`start`,side:`bottom`,className:`flex w-fit min-w-0 overflow-y-auto rounded p-0`,children:[B(`div`,{className:`flex h-full flex-col space-y-2 border-r border-r-border p-2 [&>button]:justify-start [&>button]:text-sm`,children:[z(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>x(De()),children:`Hôm nay`}),z(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>x(Oe()),children:`Ngày mai`}),z(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>x(ke()),children:`Hôm qua`}),z(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>x(Ne(De(),3)),children:`3 ngày qua`}),z(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>x(Ne(De(),7)),children:`7 ngày qua`}),z(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>x(Ne(De(),30)),children:`30 ngày qua`}),z(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>x(Me(De())),children:`Tháng này`}),z(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>x(je(De())),children:`Tháng trước`})]}),z(`div`,{className:`flex flex-1 flex-col`,children:z(`div`,{className:`min-w-73 border-b border-b-border p-2`,children:z(ne,{mode:`single`,selected:p.state.value??void 0,hidden:{before:u??new Date(1900,0,1),after:d??new Date(2100,11,31)},onSelect:e=>{e&&x(e)}})})})]})]}),v&&s&&z(Q,{id:f,className:`mt-1`,errors:p.state.meta.errors}),z(Y,{isShow:!!o,children:o})]})})]}),z(Z,{})]})});ut.displayName=`DateField`;const dt=({label:e,description:t,placeholder:n,tooltip:r,helperText:i,orientation:a=`responsive`,showErrorMessage:o=!0,required:s=!1,maxLength:c})=>{let{form:l,name:u,state:d,handleBlur:f,handleChange:p}=$(),m=H(l.store,({isSubmitting:e})=>e),h=d.meta.isDirty&&d.meta.isTouched&&!d.meta.isValid,g=s&&d.value===null,_=!m&&!!d.value,v=F(({target:{value:e}})=>{m||c&&e.length>c||p(e||null)},[m,c,p]),y=F(()=>{m||p(null)},[m,p]);return B(U,{className:`gap-y-4 px-4`,children:[B(W,{"data-invalid":h,orientation:a,children:[B(G,{children:[B(q,{htmlFor:u,"aria-required":g,children:[e,r&&z(X,{tooltip:r})]}),z(J,{children:t})]}),B(K,{children:[z(b,{id:u,name:u,value:d.value===null?``:d.value,"aria-invalid":h,autoComplete:`email`,placeholder:n,className:R(`pl-9`,_&&`pr-9`,m&&`pointer-events-none bg-muted-muted opacity-60`),onBlur:f,onChange:v}),z(`div`,{className:`absolute top-0 left-0 flex size-9 items-center justify-center text-muted`,children:z(ce,{size:14})}),_&&z(`button`,{type:`button`,"aria-label":`Xóa`,className:`absolute inset-e-0 inset-y-0 top-3 flex h-fit w-8 cursor-pointer items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:text-text-positive-strong`,onClick:y,children:z(N,{size:14,"aria-hidden":`true`})}),z(`div`,{className:`mt-1 flex w-full items-start justify-start`,children:o&&d.meta.isDirty&&z(Q,{errors:d.meta.errors})}),z(Y,{isShow:!!i,children:i})]})]}),z(Z,{})]})},ft=P(({label:e,description:t,placeholder:n,tooltip:r,helperText:i,orientation:a=`responsive`,showErrorMessage:o=!0,rounding:s,decimalPlaces:c,precision:l,unit:u,required:d=!1,disabled:f=!1,allowNegative:p})=>{let m=I(),h=I(),g=$(),_=H(g.form.store,({isSubmitting:e})=>e),v=f||_,y=g.state.meta.isDirty||g.state.meta.isTouched,b=y&&!g.state.meta.isValid,x=d&&g.state.value===null,S=!!g.state.meta.errors.length,C=F(e=>{v||g.handleChange(e)},[v,g.handleChange]);return B(U,{className:`gap-y-4 px-4`,children:[B(W,{orientation:a,"data-invalid":b,children:[B(G,{children:[B(q,{htmlFor:m,"aria-required":x,children:[e,r&&z(X,{tooltip:r})]}),z(J,{children:t})]}),B(K,{children:[B(`div`,{className:`relative w-full`,children:[z(nt,{id:m,value:g.state.value,"aria-invalid":b,"aria-describedby":h,placeholder:n,disabled:v,roundingRule:s,numberAfterDecimalPoint:c,precision:l,unitText:u,allowNegative:p,className:R(v&&`pointer-events-none opacity-60`),onBlur:g.handleBlur,onValueChange:C}),_&&z(`div`,{className:`pointer-events-none absolute inset-s-2 inset-y-0 top-2.5 [&>svg]:size-3.5`,children:z(ve,{className:`animate-spin text-primary-strong`})}),!_&&y&&o&&S&&z(`div`,{className:`pointer-events-none absolute inset-s-2 inset-y-0 top-2.75 text-danger-strong [&>svg]:size-3.5`,children:z(le,{})}),z(`div`,{className:`mt-1 flex w-full items-start justify-between gap-x-2`,children:y&&o?z(Q,{id:h,className:`flex-1`,errors:g.state.meta.errors}):z(`div`,{})})]}),z(Y,{isShow:!!i,children:i})]})]}),z(Z,{})]})});ft.displayName=`NumberField`;const pt=({label:e,description:t,placeholder:n,orientation:r=`responsive`,tooltip:i,helperText:a,showErrorMessage:o=!0})=>{let s=I(),{form:c,name:l,state:u,handleBlur:d,handleChange:f}=$(),p=H(c.store,({isSubmitting:e})=>e),[m,h]=L(!1),g=u.meta.isDirty&&u.meta.isTouched&&!u.meta.isValid,_=F(()=>h(e=>!e),[]),v=F(({target:{value:e}})=>{p||f(e||null)},[p,f]);return B(U,{className:`gap-y-4 px-4`,children:[B(W,{"data-invalid":g,orientation:r,children:[B(G,{children:[B(q,{htmlFor:s,children:[e,i&&z(X,{tooltip:i})]}),z(J,{children:t})]}),B(K,{children:[z(b,{id:s,name:l,type:m?`text`:`password`,placeholder:n,value:u.value??``,"aria-invalid":g,autoComplete:`new-password`,onBlur:d,onChange:v}),z(`button`,{className:`absolute inset-e-0 inset-y-0 flex size-9 items-center justify-center rounded-e-md text-muted outline-none transition-[color,box-shadow] focus:z-10 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,type:`button`,onClick:_,"aria-label":m?`Ẩn mật khẩu`:`Hiện mật khẩu`,"aria-pressed":m,"aria-controls":s,children:z(m?he:me,{size:16,"aria-hidden":`true`})}),z(`div`,{className:`mt-1 flex w-full items-start justify-start`,children:o&&u.meta.isDirty&&z(Q,{errors:u.meta.errors})}),z(Y,{isShow:!!a,children:a})]})]}),z(Z,{})]})},mt=({label:e,description:t,orientation:n,options:r,tooltip:i,helperText:a})=>{let o=$(),s=H(o.form.store,({isSubmitting:e})=>e);return B(U,{className:`px-4`,children:[B(W,{orientation:n,className:`flex-col gap-2`,children:[B(G,{children:[B(q,{children:[e,i&&z(X,{tooltip:i})]}),z(J,{children:t}),z(Y,{isShow:!!a,children:a})]}),z(K,{children:z(re,{value:o.state.value??``,className:`w-full`,onValueChange:o.handleChange,children:r.map(e=>z(q,{className:R(`h-fit`,o.state.value===e.value&&`border-primary-weak! bg-primary-bg-subtle`,s&&`pointer-events-none bg-muted-muted opacity-60`,o.state.value===e.value&&s&&`border-border-strong!`),children:B(W,{orientation:`horizontal`,className:`items-start gap-3 rounded p-2!`,children:[z(ie,{value:e.value,className:`mt-0.5 shrink-0`}),B(G,{className:`gap-0.5!`,children:[z(qe,{children:e.label}),z(J,{className:`text-xs`,children:e.description})]})]})},e.value))})})]}),z(Z,{})]})},ht=P(({label:e,description:t,placeholder:n,orientation:r=`responsive`,tooltip:i,options:a,helperText:c,clearable:d=!1,required:f=!1,disabled:p=!1,showErrorMessage:m=!0})=>{let h=I(),g=$(),_=Le(),[v,y]=L(!1),b=H(g.form.store,({isSubmitting:e})=>e),x=p||b,S=g.state.meta.isDirty||g.state.meta.isTouched,C=S&&!g.state.meta.isValid,w=f&&g.state.value===null,A=d&&!!g.state.value&&!x,j=a.find(e=>e.value===g.state.value)?.label,M=()=>{g.handleChange(null),g.handleBlur()};return B(U,{className:`gap-y-4 px-4`,children:[B(W,{orientation:r,"data-invalid":C,children:[B(G,{children:[B(q,{htmlFor:g.name,"aria-required":w,children:[e,i&&z(X,{tooltip:i})]}),z(J,{children:t})]}),B(K,{className:`flex flex-col`,children:[_?B(Ee,{children:[B(`button`,{id:g.name,type:`button`,disabled:x,"aria-invalid":C?`true`:void 0,"aria-describedby":h,onBlur:g.handleBlur,onClick:()=>y(!0),className:R(`flex w-full items-center justify-between`,`outline-1 outline-border -outline-offset-1`,`gap-2 rounded bg-transparent px-3 py-2`,`shadow-input transition-all cursor-pointer whitespace-nowrap text-sm`,`focus-visible:outline-primary-strong focus-visible:ring-4 focus-visible:ring-primary-weak`,`disabled:cursor-not-allowed disabled:opacity-50`,C&&`outline-danger bg-danger-bg-subtle ring-danger-weak`,!g.state.value&&`text-text-positive-muted`),children:[z(`span`,{className:`line-clamp-1`,children:j??n}),z(fe,{size:16,className:`shrink-0 opacity-50`})]}),z(o,{open:v,onOpenChange:e=>{y(e),e||g.handleBlur()},children:B(u,{children:[z(l,{}),B(V.Content,{onOpenAutoFocus:e=>e.preventDefault(),className:R(`fixed inset-x-0 bottom-0 z-50`,`flex flex-col bg-background rounded-t-2xl outline-none`,`max-h-[80dvh] shadow-[0_-4px_24px_rgba(0,0,0,0.08)]`,`data-[state=open]:animate-in data-[state=open]:slide-in-from-bottom data-[state=open]:fade-in-0`,`data-[state=closed]:animate-out data-[state=closed]:slide-out-to-bottom data-[state=closed]:fade-out-0`,`duration-300`),children:[B(`div`,{className:`flex items-center justify-between px-4 py-3 border-b border-border shrink-0`,children:[z(`span`,{className:`font-semibold text-sm text-text-positive`,children:e??n??`Chọn một tùy chọn`}),z(s,{asChild:!0,children:z(`button`,{type:`button`,"aria-label":`Đóng`,className:`flex size-7 items-center justify-center rounded-md text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive`,children:z(N,{size:16})})})]}),B(`div`,{className:`flex flex-col overflow-y-auto`,children:[A&&z(s,{asChild:!0,children:B(`button`,{type:`button`,className:`flex w-full items-center gap-x-2 px-4 py-3 text-left text-sm text-danger-strong transition-colors hover:bg-danger-bg-subtle`,onClick:M,children:[z(N,{size:14}),`Xóa lựa chọn`]})}),a.length>0?a.map(e=>z(s,{asChild:!0,children:z(`button`,{type:`button`,className:R(`flex w-full items-center px-4 py-3 text-left text-sm transition-colors`,`hover:bg-muted-muted active:bg-muted-muted`,g.state.value===e.value&&`bg-primary-bg-subtle font-medium text-primary`),onClick:()=>{g.handleChange(e.value),g.handleBlur()},children:e.label})},e.value)):B(`div`,{className:`flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak`,children:[z(ye,{strokeWidth:1}),`Không có tùy chọn`]})]}),z(`div`,{className:`shrink-0 h-safe-bottom`})]})]})})]}):B(`div`,{className:`relative`,children:[B(T,{value:g.state.value??``,disabled:x,onValueChange:g.handleChange,children:[z(O,{"aria-invalid":C?`true`:void 0,"aria-describedby":h,onBlur:g.handleBlur,children:z(k,{placeholder:n})}),z(E,{children:a.length>0?a.map(e=>z(D,{value:e.value,children:e.label},e.value)):B(`div`,{className:`flex items-center justify-center gap-x-2 rounded border border-border bg-muted-muted px-4 py-6.5 text-center text-sm text-text-positive-weak`,children:[z(ye,{strokeWidth:1}),`No options available`]})})]}),A&&z(`button`,{type:`button`,"aria-label":`Xóa lựa chọn`,className:`absolute right-7 top-1/2 -translate-y-1/2 flex size-4 cursor-pointer items-center justify-center rounded-md text-text-positive-weak outline-none transition-[color,transform] hover:text-text-positive focus-visible:text-primary-strong focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:M,children:z(N,{"aria-hidden":`true`})})]}),S&&m&&z(Q,{id:h,className:`mt-1`,errors:g.state.meta.errors}),z(Y,{isShow:!!c,children:c})]})]}),z(Z,{})]})});ht.displayName=`SelectField`;function gt({className:e,...t}){return z(Ie.Root,{"data-slot":`switch`,className:R(`peer`,`w-8 shrink-0 cursor-pointer items-center rounded-full shadow-xs transition-all`,`inline-flex h-5`,`focus-visible:border-primary-strong`,`focus-visible:ring-primary-weak`,`focus-visible:ring-4`,`disabled:cursor-not-allowed`,`disabled:opacity-50`,`-outline-offset-1 inset-shadow-2xs outline-1`,`data-[state=checked]:bg-primary`,`data-[state=checked]:outline-primary-strong`,`data-[state=unchecked]:bg-muted-weak`,`data-[state=unchecked]:outline-border`,`data-[state=unchecked]:[&_span]:size-4`,`data-[state=unchecked]:[&_span]:translate-x-0.5`,`data-[state=unchecked]:[&_span]:rtl:-translate-x-0.5`,e),...t,children:z(Ie.Thumb,{"data-slot":`switch-thumb`,className:R(`block size-4 bg-card shadow-xs`,`pointer-events-none rounded-full ring-0 transition-transform`,`data-[state=checked]:translate-x-[calc(100%-3px)]`,`data-[state=unchecked]:translate-x-0`)})})}const _t=({label:e,description:t,helperText:n})=>{let r=$();return B(U,{className:`gap-y-4 px-4`,children:[B(W,{orientation:`vertical`,className:`relative justify-between gap-y-1`,children:[B(G,{children:[z(qe,{className:`cursor-pointer`,children:z(`label`,{htmlFor:r.name,children:e})}),z(J,{children:t}),z(gt,{id:r.name,checked:r.state.value??!1,className:`absolute top-1 right-1`,onBlur:r.handleBlur,onCheckedChange:r.handleChange})]}),z(Y,{isShow:!!n,children:n})]}),z(Z,{})]})},vt=e=>{e.key===`Enter`&&e.preventDefault()},yt=P(({label:e,description:t,placeholder:n,tooltip:r,helperText:i,counter:a=!1,orientation:o=`responsive`,showClearButton:s=!1,showErrorMessage:c=!0,required:l=!1,disabled:u=!1,maxLength:d})=>{let f=I(),p=I(),m=we(null),{form:h,name:g,state:_,handleBlur:v,handleChange:y}=$(),x=H(h.store,({isSubmitting:e})=>e),S=u||x,C=_.meta.isDirty||_.meta.isTouched,w=C&&!_.meta.isValid,T=l&&_.value===null,E=_.meta.errors.length>0,D=s&&!S&&!!_.value,O=a?_.value?.length??0:0,k=a&&!!d&&O>=d*.8,A=a&&!!d&&O>=d,j=a?d?`${O} / ${d} ký tự`:`${O} ký tự`:null,M=a||C&&c,ee=F(({target:{value:e}})=>{a&&d&&e.length>d||y(e||null)},[a,d,y]),te=F(()=>{y(null),m.current?.focus()},[y]);return B(U,{className:`gap-y-4 px-4`,children:[B(W,{orientation:o,"data-invalid":w,children:[B(G,{children:[B(q,{"aria-required":T,htmlFor:f,children:[e,r&&z(X,{tooltip:r})]}),t&&z(J,{children:t})]}),B(K,{children:[z(b,{ref:m,id:f,name:g,value:_.value??``,"aria-invalid":w,"aria-describedby":p,autoComplete:`off`,placeholder:n,autoCapitalize:`none`,autoCorrect:`off`,disabled:S,className:R(`pr-6`,S&&`pointer-events-none bg-muted-muted opacity-60`),onBlur:v,onChange:ee,onKeyDown:vt}),D&&z(`button`,{type:`button`,"aria-label":`Xóa`,className:`absolute inset-e-1 top-2.5 flex size-4 cursor-pointer items-center justify-center rounded-md text-text-positive-weak outline-none transition-[color,transform] hover:text-text-positive focus-visible:text-primary-strong focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:te,children:z(N,{"aria-hidden":`true`})}),x&&z(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak`,children:z(ve,{size:14,className:`animate-spin text-primary-strong`})}),!D&&C&&c&&E&&z(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong`,children:z(le,{"aria-hidden":`true`,size:14})}),M&&B(`div`,{className:`my-1 flex w-full items-start justify-between gap-x-2`,children:[C&&c?z(Q,{id:p,className:`flex-1`,errors:_.meta.errors}):z(`div`,{}),a&&z(`p`,{className:R(`h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors`,A?`font-medium text-danger-strong`:k?`text-warning-strong`:`text-text-positive-weak`),children:j})]}),z(Y,{isShow:!!i,children:i})]})]}),z(Z,{})]})});yt.displayName=`TextField`;const bt=P(({label:e,description:t,placeholder:n,tooltip:r,helperText:i,counter:a=!1,orientation:o=`responsive`,showErrorMessage:s=!0,required:c=!1,disabled:l=!1,maxLength:u})=>{let d=I(),f=I(),[p,m]=L(!1),h=we(null),{form:g,state:_,name:v,handleBlur:y,handleChange:b}=$(),x=H(g.store,({isSubmitting:e})=>e),S=l||x,C=_.value?.length??0,w=Ce(()=>a?u?`${C} / ${u} ký tự`:`${C} ký tự`:``,[C,a,u]),T=!!u&&C>=u*.8,E=!!u&&C>=u,D=_.meta.isDirty||_.meta.isTouched,O=D&&!_.meta.isValid,k=c&&_.value===null,A=!!_.meta.errors.length,j=!!_.value&&!S,M=Ce(()=>R(`h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors`,E?`font-medium text-danger-strong`:T?`text-warning-strong`:`text-text-positive-weak`),[E,T]),ee=F(({target:{value:e}})=>{S||a&&u&&e.length>u||b(e||null)},[S,a,u,b]),te=F(async()=>{_.value&&(await navigator.clipboard.writeText(_.value),h.current!==null&&window.clearTimeout(h.current),m(!0),h.current=window.setTimeout(()=>m(!1),1500))},[_.value]);return Se(()=>()=>{h.current!==null&&window.clearTimeout(h.current)},[]),B(U,{className:`gap-y-4 px-4`,children:[B(W,{orientation:o,"data-invalid":O,children:[B(G,{children:[B(q,{"aria-required":k,htmlFor:d,children:[e,r&&z(X,{tooltip:r})]}),z(J,{children:t})]}),B(K,{children:[z(ae,{id:d,name:v,value:_.value??``,"aria-invalid":O,"aria-describedby":f,autoCapitalize:`none`,autoComplete:`off`,autoCorrect:`off`,placeholder:n,disabled:S,className:R(S&&`pointer-events-none bg-muted-muted opacity-60`),onChange:ee,onBlur:y}),j&&z(`button`,{type:`button`,"aria-label":`Sao chép`,className:`absolute inset-e-1 top-2 flex size-4 cursor-pointer items-center justify-center rounded-md outline-none transition-[color,transform] focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:te,children:p?z(de,{"aria-hidden":`true`,className:`text-success-strong`}):z(pe,{"aria-hidden":`true`,className:`text-text-positive-weak transition-colors hover:text-text-positive focus-visible:text-primary-strong`})}),x&&z(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak`,children:z(ve,{size:14,className:`animate-spin text-primary-strong`})}),!j&&D&&s&&A&&z(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong`,children:z(le,{size:14})}),B(`div`,{className:`my-1 flex w-full items-start justify-between gap-x-2`,children:[D&&s?z(Q,{id:f,className:`flex-1`,errors:_.meta.errors}):z(`div`,{}),!!a&&z(`p`,{className:M,children:w})]}),z(Y,{isShow:!!i,children:i})]})]}),z(Z,{})]})});bt.displayName=`TextareaField`;const xt=P(({label:e,description:t,placeholder:n,tooltip:r,helperText:i,showErrorMessage:a=!0,required:o=!1})=>{let{form:s,state:c,handleChange:l}=$(),u=H(s.store,({isSubmitting:e})=>e),d=c.meta.isDirty&&c.meta.isTouched&&!c.meta.isValid,f=o&&c.value===null,p=F(e=>{u||l(e||null)},[u,l]);return B(U,{className:`gap-y-4 px-4`,children:[B(W,{orientation:`vertical`,"data-invalid":d,children:[B(G,{children:[B(q,{"aria-required":f,children:[e,r&&z(X,{tooltip:r})]}),z(J,{children:t})]}),z(oe,{value:c.value??``,placeholder:n,readOnly:u,onChange:p}),c.meta.isDirty&&a&&!!c.meta.errors.length&&z(Q,{errors:c.meta.errors}),z(Y,{isShow:!!i,children:i})]}),z(Z,{})]})});xt.displayName=`TextEditorField`;const St=({label:t,className:n})=>{let r=Rt(),i=F(async()=>{await r.handleSubmit({submitAction:`submit`}),r.state.isSubmitSuccessful&&r.reset()},[r]);return z(r.Subscribe,{selector:e=>({disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit||e.isDefaultValue,isSubmitting:e.isSubmitting}),children:({disabled:r,isSubmitting:a})=>z(e,{type:`button`,size:`md`,disabled:r,isLoading:a,className:R(`min-h-8 min-w-32`,n),onClick:i,children:t??`Xác nhận`})})},Ct=({type:t=`create`})=>{let n=Rt();return B(`div`,{className:`flex h-8 items-center justify-between`,children:[z(n.Subscribe,{selector:e=>({disabled:e.isPristine||e.isSubmitting}),children:({disabled:t})=>z(e,{color:`muted`,variant:`outline`,type:`button`,size:`md`,disabled:t,className:`h-full min-w-32`,onClick:()=>n.reset(),children:`Hủy bỏ`})}),t===`create`&&z(n.Subscribe,{selector:e=>({disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit||e.isDefaultValue,isSubmitting:e.isSubmitting}),children:({disabled:t,isSubmitting:r})=>B(e,{type:`submit`,size:`md`,disabled:t,isLoading:r,className:`h-full min-w-32`,onClick:async()=>{await n.handleSubmit({submitAction:`create`}),n.state.isSubmitSuccessful&&n.reset()},children:[z(be,{}),`Thêm mới`]})}),t===`update`&&z(n.Subscribe,{selector:e=>({disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit||e.isDefaultValue,isSubmitting:e.isSubmitting}),children:({disabled:t,isSubmitting:r})=>B(e,{type:`submit`,size:`md`,disabled:t,isLoading:r,className:`h-full min-w-32`,onClick:async()=>{await n.handleSubmit({submitAction:`update`}),n.state.isSubmitSuccessful&&n.reset()},children:[z(se,{}),`Cập nhật`]})})]})};function wt({className:e,orientation:t=`horizontal`,decorative:n=!0,...r}){return z(Fe.Root,{"data-slot":`separator`,decorative:n,orientation:t,className:R(`shrink-0 bg-border-weak`,`data-[orientation=horizontal]:h-px`,`data-[orientation=horizontal]:w-full`,`data-[orientation=vertical]:h-full`,`data-[orientation=vertical]:w-px`,e),...r})}const Tt=({title:t,description:n,onDelete:r,children:i})=>B(`section`,{"data-slot":`card-form`,className:`relative flex flex-col rounded-md bg-card pb-4 shadow-card ring-1 ring-border`,children:[B(`div`,{"data-slot":`card-form-header`,className:`flex flex-col space-y-0.5 px-4 py-3`,children:[z(`p`,{className:`font-semibold text-base tracking-tight`,children:t}),!!n&&z(`p`,{className:`text-text-positive-weak text-sm`,children:n})]}),z(wt,{}),z(`div`,{"data-slot":`card-form-main`,className:`flex flex-col py-4`,children:i}),!!r&&B(e,{color:`danger`,variant:`ghost`,size:`sm`,className:`absolute top-2.5 right-3`,onClick:e=>{r?.(),e.preventDefault(),e.stopPropagation()},children:[z(xe,{}),`Remove`]})]}),Et=({children:e})=>z(`div`,{"data-slot":`section-form`,className:`flex flex-col space-y-4`,children:e}),Dt=({disabled:t,className:n,onClick:r,children:i})=>z(e,{type:`button`,variant:`outline`,color:`muted`,disabled:t,className:R(`min-w-40`,n),onClick:r,children:i??`Huỷ`}),Ot=({isSubmitting:t,submitText:n=`Xác nhận`,disabled:r,className:i,onClick:a})=>z(e,{type:`button`,isLoading:t,disabled:r||t,className:R(`min-w-40`,i),onClick:a,children:n}),kt=({title:e,submitText:t,width:n,maxWidth:r,className:a,open:s,onOpenChange:f,children:p})=>{let m=Rt(),h=F(e=>{e||m.reset(),f?.(e)},[m.reset,f]);return z(o,{open:s,onOpenChange:h,children:B(u,{"data-slot":`dialog-portal`,children:[z(l,{}),B(c,{style:{"--width":n,"--max-width":r},className:R(`flex size-full max-h-dvh max-w-dvw flex-col gap-0 overflow-y-auto rounded-none p-0 shadow-dialog sm:h-auto sm:max-h-[85dvh] sm:max-w-5xl sm:rounded-md`,n&&`sm:w-(--width)`,r&&`sm:max-w-(--max-width)`,a),onOpenAutoFocus:e=>{e.preventDefault()},children:[z(`div`,{"data-slot":`dialog-header`,className:`flex items-center justify-center gap-2 px-6 py-5 text-center sm:text-left`,children:z(d,{"data-slot":`dialog-title`,className:`font-semibold text-lg tracking-tight`,children:e})}),z(i,{}),z(`div`,{"data-slot":`dialog-content`,className:`relative flex flex-col overflow-y-auto p-0 pt-4 max-sm:flex-1 sm:p-4`,children:p}),z(i,{}),B(`div`,{"data-slot":`dialog-footer`,className:`flex flex-col-reverse items-center justify-end gap-2 px-6 py-4 sm:flex-row max-sm:[&>button]:w-full`,children:[z(m.Subscribe,{selector:e=>({disabled:e.isSubmitting}),children:({disabled:e})=>z(Dt,{disabled:e,onClick:()=>{m.reset(),h(!1)}})}),z(m.Subscribe,{selector:e=>({isSubmitting:e.isSubmitting,disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit}),children:({isSubmitting:e,disabled:n})=>z(Ot,{isSubmitting:e,disabled:n,submitText:t,onClick:()=>m.handleSubmit()})})]})]})]})})},At=({label:e,description:t,helperText:n,orientation:r=`responsive`,children:i})=>B(U,{className:`gap-y-4 px-4`,children:[B(W,{orientation:r,children:[B(G,{children:[z(q,{children:e}),z(J,{children:t})]}),B(K,{children:[i,z(Y,{isShow:!!n,children:n})]})]}),z(Z,{})]}),jt=({title:e,open:t,contentClassName:n,onOpenChange:r,children:i})=>{let o=Rt();return z(V.Root,{"data-slot":`dialog`,open:t,onOpenChange:r,children:B(V.Portal,{"data-slot":`dialog-portal`,children:[z(V.Overlay,{"data-slot":`dialog-overlay`,className:R(`fixed inset-0 z-40 bg-black/40 backdrop-blur-sm`,`data-[state=open]:animate-in data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:fade-out`)}),z(V.Content,{"data-slot":`dialog-content`,className:R(`fixed top-4 right-4 z-50 h-[calc(100dvh-2rem)] min-w-sm max-w-xl rounded-md bg-background shadow-lg ring-1 ring-border`,`duration-300`,`data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:fade-out`),children:B(`section`,{className:`relative flex size-full flex-col`,children:[z(`header`,{className:`flex h-14 shrink-0 items-center border-b border-border px-5`,children:z(`h2`,{className:`font-semibold text-base tracking-tight text-text-positive`,children:e})}),z(`div`,{className:R(`flex flex-1 flex-col overflow-y-auto py-4`,n),children:i}),B(`div`,{className:`flex shrink-0 flex-col gap-2 border-t border-border px-4 py-3`,children:[z(o.Subscribe,{selector:e=>({isSubmitting:e.isSubmitting,disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit}),children:({isSubmitting:e,disabled:t})=>z(Ot,{isSubmitting:e,disabled:t,className:`w-full`,onClick:()=>o.handleSubmit()})}),z(o.Subscribe,{selector:e=>({disabled:e.isPristine||e.isSubmitting}),children:({disabled:e})=>z(Dt,{disabled:e,className:`w-full`,onClick:()=>{o.reset(),r?.(!1)}})})]}),z(V.Close,{asChild:!0,children:z(a,{className:`absolute top-2.5 right-3`})})]})})]})})},Mt=({children:e})=>z(`header`,{"data-slot":`section-header`,className:`flex items-center px-4 py-3 font-semibold text-base text-text-positive tracking-tight`,children:e}),Nt=({children:e})=>z(`main`,{"data-slot":`section-main`,className:`relative flex flex-col py-4`,children:e}),Pt=({title:e,children:t})=>B(`section`,{"data-slot":`section-form`,className:`flex flex-col rounded-md bg-background shadow-card ring-1 ring-border`,children:[z(Mt,{children:e}),z(wt,{}),z(Nt,{children:t})]}),Ft=({title:e,description:t,helperText:n})=>B(U,{className:`gap-y-4 px-4`,children:[B(W,{className:`gap-0`,children:[B(G,{children:[z(Ke,{className:`mb-1`,children:e}),z(J,{children:t})]}),z(Y,{isShow:!!n,children:n})]}),z(Z,{})]}),{fieldContext:It,formContext:Lt,useFieldContext:$,useFormContext:Rt}=ze(),{useAppForm:zt,withForm:Bt,withFieldGroup:Vt}=Re({fieldContext:It,formContext:Lt,fieldComponents:{TextField:yt,TextareaField:bt,TextEditorField:xt,NumberField:ft,EmailField:dt,PasswordField:pt,SelectField:ht,ComboboxField:lt,DateField:ut,SwitchField:_t,RadioGroupField:mt,CheckboxField:ct,SimpleTextField:st,SimpleEmailField:Qe,SimplePasswordField:it,SimpleTextareaField:ot,SimpleNumberField:rt,SimpleSelectField:at,SimpleArrayField:He,SimpleBooleanField:Je,SimpleComboboxField:Ye,SimpleDateField:Xe,SimpleRadioGroupField:Ze,FieldGroup:U,Field:W,FieldContent:G,FieldLabel:q,FieldContentMain:K,FieldSeparator:Z,FieldError:Q},formComponents:{TanStackDialogForm:kt,TanStackPopoverForm:jt,TanStackContainerForm:Et,TanStackSectionForm:Pt,TanStackCardForm:Tt,TanStackFieldGroup:At,TanStackTitleField:Ft,TanStackActionsForm:Ct,TanStackActionSubmit:St,ArrayCol:Be,ArrayHeaderRow:Ve}});export{it as A,Q as B,dt as C,st as D,ct as E,Ye as F,Ve as G,q as H,Je as I,He as K,W as L,Qe as M,Ze as N,ot as O,Xe as P,G as R,ft as S,lt as T,Z as U,U as V,Be as W,yt as _,Bt as a,mt as b,jt as c,Et as d,Tt as f,bt as g,xt as h,Vt as i,rt as j,at as k,At as l,St as m,zt as n,Ft as o,Ct as p,Rt as r,Pt as s,$ as t,kt as u,_t as v,ut as w,pt as x,ht as y,K as z};
-//# sourceMappingURL=tanstack-form-DTCgWGCA.mjs.map