@customafk/lunas-ui 0.2.70 → 0.2.71

package/dist/{simple-email-field-B73GdTF_.mjs.map → simple-email-field-CFbpYis_.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-email-field-B73GdTF_.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-email-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { AtSignIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  maxLength?: number;\n  disabled?: boolean;\n};\n\nexport const SimpleEmailField: React.FC<Props> = ({ label, placeholder, required, maxLength, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <div className=\"relative\">\n        <Input\n          id={id}\n          name={name}\n          type=\"email\"\n          value={state.value ?? ''}\n          aria-invalid={_invalid}\n          autoComplete=\"email\"\n          placeholder={placeholder}\n          disabled={disabled || isSubmitting}\n          className={cn('pl-9')}\n          onBlur={handleBlur}\n          onChange={onChange}\n        />\n        <div className=\"pointer-events-none absolute inset-y-0 left-0 flex size-9 items-center justify-center text-muted\">\n          <AtSignIcon size={14} />\n        </div>\n      </div>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"gaAwBA,MAAa,GAAqC,CAAE,QAAO,cAAa,WAAU,YAAW,cAAe,CAC1G,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAW,GACd,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,MAAD,CAAK,UAAU,oBAAf,CACE,EAAC,EAAD,CACM,KACE,OACN,KAAK,QACL,MAAO,EAAM,OAAS,GACtB,eAAc,EACd,aAAa,QACA,cACb,SAAU,GAAY,EACtB,UAAW,EAAG,MAAM,EACpB,OAAQ,EACE,UACX,CAAA,EACD,EAAC,MAAD,CAAK,UAAU,4GACb,EAAC,EAAD,CAAY,KAAM,EAAK,CAAA,CACpB,CAAA,CACF,IACJ,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-email-field-CFbpYis_.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-email-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { AtSignIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  maxLength?: number;\n  disabled?: boolean;\n};\n\nexport const SimpleEmailField: React.FC<Props> = ({ label, placeholder, required, maxLength, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <div className=\"relative\">\n        <Input\n          id={id}\n          name={name}\n          type=\"email\"\n          value={state.value ?? ''}\n          aria-invalid={_invalid}\n          autoComplete=\"email\"\n          placeholder={placeholder}\n          disabled={disabled || isSubmitting}\n          className={cn('pl-9')}\n          onBlur={handleBlur}\n          onChange={onChange}\n        />\n        <div className=\"pointer-events-none absolute inset-y-0 left-0 flex size-9 items-center justify-center text-muted\">\n          <AtSignIcon size={14} />\n        </div>\n      </div>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"gaAwBA,MAAa,GAAqC,CAAE,QAAO,cAAa,WAAU,YAAW,cAAe,CAC1G,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAW,GACd,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,MAAD,CAAK,UAAU,oBAAf,CACE,EAAC,EAAD,CACM,KACE,OACN,KAAK,QACL,MAAO,EAAM,OAAS,GACtB,eAAc,EACd,aAAa,QACA,cACb,SAAU,GAAY,EACtB,UAAW,EAAG,MAAM,EACpB,OAAQ,EACE,UACX,CAAA,EACD,EAAC,MAAD,CAAK,UAAU,4GACb,EAAC,EAAD,CAAY,KAAM,EAAK,CAAA,CACpB,CAAA,CACF,IACJ,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-email-field-dskmgGEz.cjs → simple-email-field-DpuMlzxg.cjs}

@@ -1,2 +1,2 @@
-const e=require("./tanstack-form-DU-ZKXxZ.cjs"),t=require("./ui/input.cjs"),n=require("./ui/label.cjs"),r=require("./field-BV5twmKA.cjs");let i=require("lucide-react"),a=require("react"),o=require("@customafk/react-toolkit/utils"),s=require("react/jsx-runtime"),c=require("@tanstack/react-form");const l=({label:l,placeholder:u,required:d,maxLength:f,disabled:p})=>{let m=(0,a.useId)(),{form:h,name:g,state:_,handleBlur:v,handleChange:y}=e.G(),b=(0,c.useStore)(h.store,({isSubmitting:e})=>e),x=_.meta.isTouched&&!_.meta.isValid,S=(0,a.useCallback)(({target:{value:e}})=>{b||f&&e.length>f||y(e||null)},[b,f,y]);return(0,s.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[l&&(0,s.jsxs)(n.Label,{htmlFor:m,children:[l,d&&(0,s.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,s.jsxs)(`div`,{className:`relative`,children:[(0,s.jsx)(t.Input,{id:m,name:g,type:`email`,value:_.value??``,"aria-invalid":x,autoComplete:`email`,placeholder:u,disabled:p||b,className:(0,o.cn)(`pl-9`),onBlur:v,onChange:S}),(0,s.jsx)(`div`,{className:`pointer-events-none absolute inset-y-0 left-0 flex size-9 items-center justify-center text-muted`,children:(0,s.jsx)(i.AtSignIcon,{size:14})})]}),x&&(0,s.jsx)(r.FieldError,{errors:_.meta.errors})]})};exports.SimpleEmailField=l;
-//# sourceMappingURL=simple-email-field-dskmgGEz.cjs.map
+const e=require("./tanstack-form-CX3lC3mC.cjs"),t=require("./ui/input.cjs"),n=require("./ui/label.cjs"),r=require("./field-BSLi-P0Q.cjs");let i=require("lucide-react"),a=require("react"),o=require("@customafk/react-toolkit/utils"),s=require("react/jsx-runtime"),c=require("@tanstack/react-form");const l=({label:l,placeholder:u,required:d,maxLength:f,disabled:p})=>{let m=(0,a.useId)(),{form:h,name:g,state:_,handleBlur:v,handleChange:y}=e.G(),b=(0,c.useStore)(h.store,({isSubmitting:e})=>e),x=_.meta.isTouched&&!_.meta.isValid,S=(0,a.useCallback)(({target:{value:e}})=>{b||f&&e.length>f||y(e||null)},[b,f,y]);return(0,s.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[l&&(0,s.jsxs)(n.Label,{htmlFor:m,children:[l,d&&(0,s.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,s.jsxs)(`div`,{className:`relative`,children:[(0,s.jsx)(t.Input,{id:m,name:g,type:`email`,value:_.value??``,"aria-invalid":x,autoComplete:`email`,placeholder:u,disabled:p||b,className:(0,o.cn)(`pl-9`),onBlur:v,onChange:S}),(0,s.jsx)(`div`,{className:`pointer-events-none absolute inset-y-0 left-0 flex size-9 items-center justify-center text-muted`,children:(0,s.jsx)(i.AtSignIcon,{size:14})})]}),x&&(0,s.jsx)(r.FieldError,{errors:_.meta.errors})]})};exports.SimpleEmailField=l;
+//# sourceMappingURL=simple-email-field-DpuMlzxg.cjs.map

package/dist/{simple-email-field-dskmgGEz.cjs.map → simple-email-field-DpuMlzxg.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-email-field-dskmgGEz.cjs","names":["useTanStackFieldContext","Label","Input","AtSignIcon","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-email-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { AtSignIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  maxLength?: number;\n  disabled?: boolean;\n};\n\nexport const SimpleEmailField: React.FC<Props> = ({ label, placeholder, required, maxLength, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <div className=\"relative\">\n        <Input\n          id={id}\n          name={name}\n          type=\"email\"\n          value={state.value ?? ''}\n          aria-invalid={_invalid}\n          autoComplete=\"email\"\n          placeholder={placeholder}\n          disabled={disabled || isSubmitting}\n          className={cn('pl-9')}\n          onBlur={handleBlur}\n          onChange={onChange}\n        />\n        <div className=\"pointer-events-none absolute inset-y-0 left-0 flex size-9 items-center justify-center text-muted\">\n          <AtSignIcon size={14} />\n        </div>\n      </div>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"wSAwBA,MAAa,GAAqC,CAAE,QAAO,cAAa,WAAU,YAAW,cAAe,CAC1G,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,EACH,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,oBAAf,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CACM,KACE,OACN,KAAK,QACL,MAAO,EAAM,OAAS,GACtB,eAAc,EACd,aAAa,QACA,cACb,SAAU,GAAY,EACtB,WAAA,EAAA,EAAA,GAAA,CAAc,MAAM,EACpB,OAAQ,EACE,UACX,CAAA,GACD,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,6GACb,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,KAAM,EAAK,CAAA,CACpB,CAAA,CACF,IACJ,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-email-field-DpuMlzxg.cjs","names":["useTanStackFieldContext","Label","Input","AtSignIcon","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-email-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { AtSignIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  maxLength?: number;\n  disabled?: boolean;\n};\n\nexport const SimpleEmailField: React.FC<Props> = ({ label, placeholder, required, maxLength, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <div className=\"relative\">\n        <Input\n          id={id}\n          name={name}\n          type=\"email\"\n          value={state.value ?? ''}\n          aria-invalid={_invalid}\n          autoComplete=\"email\"\n          placeholder={placeholder}\n          disabled={disabled || isSubmitting}\n          className={cn('pl-9')}\n          onBlur={handleBlur}\n          onChange={onChange}\n        />\n        <div className=\"pointer-events-none absolute inset-y-0 left-0 flex size-9 items-center justify-center text-muted\">\n          <AtSignIcon size={14} />\n        </div>\n      </div>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"wSAwBA,MAAa,GAAqC,CAAE,QAAO,cAAa,WAAU,YAAW,cAAe,CAC1G,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,EACH,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,oBAAf,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CACM,KACE,OACN,KAAK,QACL,MAAO,EAAM,OAAS,GACtB,eAAc,EACd,aAAa,QACA,cACb,SAAU,GAAY,EACtB,WAAA,EAAA,EAAA,GAAA,CAAc,MAAM,EACpB,OAAQ,EACE,UACX,CAAA,GACD,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,6GACb,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,KAAM,EAAK,CAAA,CACpB,CAAA,CACF,IACJ,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-number-field-ggLY5zA7.mjs → simple-number-field-BY0b4BJp.mjs}

@@ -1,2 +1,2 @@
-import{G as e}from"./tanstack-form-B6mzOylW.mjs";import{Label as t}from"./ui/label.mjs";import{FieldError as n}from"./field-BKyUqvzh.mjs";import{t as r}from"./number-input-CqkegUWs.mjs";import{useCallback as i,useId as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import{useStore as c}from"@tanstack/react-form";const l=({label:l,placeholder:u,required:d,unit:f,allowNegative:p,disabled:m})=>{let h=a(),{form:g,state:_,handleBlur:v,handleChange:y}=e(),b=c(g.store,({isSubmitting:e})=>e),x=_.meta.isTouched&&!_.meta.isValid,S=i(e=>{b||y(e)},[b,y]);return s(`div`,{className:`flex flex-col gap-1.5`,children:[l&&s(t,{htmlFor:h,children:[l,d&&o(`span`,{className:`text-danger-strong`,children:`*`})]}),o(r,{id:h,value:_.value,placeholder:u,unitText:f,allowNegative:p,disabled:m||b,onBlur:v,onValueChange:S}),x&&o(n,{errors:_.meta.errors})]})};export{l as SimpleNumberField};
-//# sourceMappingURL=simple-number-field-ggLY5zA7.mjs.map
+import{G as e}from"./tanstack-form-CKAWexet.mjs";import{Label as t}from"./ui/label.mjs";import{FieldError as n}from"./field-V2DoD8qL.mjs";import{t as r}from"./number-input-CqkegUWs.mjs";import{useCallback as i,useId as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import{useStore as c}from"@tanstack/react-form";const l=({label:l,placeholder:u,required:d,unit:f,allowNegative:p,disabled:m})=>{let h=a(),{form:g,state:_,handleBlur:v,handleChange:y}=e(),b=c(g.store,({isSubmitting:e})=>e),x=_.meta.isTouched&&!_.meta.isValid,S=i(e=>{b||y(e)},[b,y]);return s(`div`,{className:`flex flex-col gap-1.5`,children:[l&&s(t,{htmlFor:h,children:[l,d&&o(`span`,{className:`text-danger-strong`,children:`*`})]}),o(r,{id:h,value:_.value,placeholder:u,unitText:f,allowNegative:p,disabled:m||b,onBlur:v,onValueChange:S}),x&&o(n,{errors:_.meta.errors})]})};export{l as SimpleNumberField};
+//# sourceMappingURL=simple-number-field-BY0b4BJp.mjs.map

package/dist/{simple-number-field-ggLY5zA7.mjs.map → simple-number-field-BY0b4BJp.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-number-field-ggLY5zA7.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-number-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '@/components/ui/label';\nimport { NumberInput } from '@/components/ui/inputs/number-input';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  unit?: string;\n  allowNegative?: boolean;\n  disabled?: boolean;\n};\n\nexport const SimpleNumberField: React.FC<Props> = ({ label, placeholder, required, unit, allowNegative, disabled }) => {\n  const id = useId();\n  const { form, state, handleBlur, handleChange } = useTanStackFieldContext<number | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onValueChange = useCallback(\n    (value: number | null) => {\n      if (isSubmitting) return;\n      handleChange(value);\n    },\n    [isSubmitting, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <NumberInput\n        id={id}\n        value={state.value}\n        placeholder={placeholder}\n        unitText={unit}\n        allowNegative={allowNegative}\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onValueChange={onValueChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"2UAqBA,MAAa,GAAsC,CAAE,QAAO,cAAa,WAAU,OAAM,gBAAe,cAAe,CACrH,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEnF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAgB,EACnB,GAAyB,CACpB,GACJ,EAAa,CAAK,CACpB,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CACM,KACJ,MAAO,EAAM,MACA,cACb,SAAU,EACK,gBACf,SAAU,GAAY,EACtB,OAAQ,EACO,eAChB,CAAA,EACA,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-number-field-BY0b4BJp.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-number-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '@/components/ui/label';\nimport { NumberInput } from '@/components/ui/inputs/number-input';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  unit?: string;\n  allowNegative?: boolean;\n  disabled?: boolean;\n};\n\nexport const SimpleNumberField: React.FC<Props> = ({ label, placeholder, required, unit, allowNegative, disabled }) => {\n  const id = useId();\n  const { form, state, handleBlur, handleChange } = useTanStackFieldContext<number | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onValueChange = useCallback(\n    (value: number | null) => {\n      if (isSubmitting) return;\n      handleChange(value);\n    },\n    [isSubmitting, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <NumberInput\n        id={id}\n        value={state.value}\n        placeholder={placeholder}\n        unitText={unit}\n        allowNegative={allowNegative}\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onValueChange={onValueChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"2UAqBA,MAAa,GAAsC,CAAE,QAAO,cAAa,WAAU,OAAM,gBAAe,cAAe,CACrH,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEnF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAgB,EACnB,GAAyB,CACpB,GACJ,EAAa,CAAK,CACpB,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CACM,KACJ,MAAO,EAAM,MACA,cACb,SAAU,EACK,gBACf,SAAU,GAAY,EACtB,OAAQ,EACO,eAChB,CAAA,EACA,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-number-field-RBxUxq_w.cjs → simple-number-field-C4y4rQcw.cjs}

@@ -1,2 +1,2 @@
-const e=require("./tanstack-form-DU-ZKXxZ.cjs"),t=require("./ui/label.cjs"),n=require("./field-BV5twmKA.cjs"),r=require("./number-input-kTh9zzr7.cjs");let i=require("react"),a=require("react/jsx-runtime"),o=require("@tanstack/react-form");const s=({label:s,placeholder:c,required:l,unit:u,allowNegative:d,disabled:f})=>{let p=(0,i.useId)(),{form:m,state:h,handleBlur:g,handleChange:_}=e.G(),v=(0,o.useStore)(m.store,({isSubmitting:e})=>e),y=h.meta.isTouched&&!h.meta.isValid,b=(0,i.useCallback)(e=>{v||_(e)},[v,_]);return(0,a.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[s&&(0,a.jsxs)(t.Label,{htmlFor:p,children:[s,l&&(0,a.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,a.jsx)(r.t,{id:p,value:h.value,placeholder:c,unitText:u,allowNegative:d,disabled:f||v,onBlur:g,onValueChange:b}),y&&(0,a.jsx)(n.FieldError,{errors:h.meta.errors})]})};exports.SimpleNumberField=s;
-//# sourceMappingURL=simple-number-field-RBxUxq_w.cjs.map
+const e=require("./tanstack-form-CX3lC3mC.cjs"),t=require("./ui/label.cjs"),n=require("./field-BSLi-P0Q.cjs"),r=require("./number-input-kTh9zzr7.cjs");let i=require("react"),a=require("react/jsx-runtime"),o=require("@tanstack/react-form");const s=({label:s,placeholder:c,required:l,unit:u,allowNegative:d,disabled:f})=>{let p=(0,i.useId)(),{form:m,state:h,handleBlur:g,handleChange:_}=e.G(),v=(0,o.useStore)(m.store,({isSubmitting:e})=>e),y=h.meta.isTouched&&!h.meta.isValid,b=(0,i.useCallback)(e=>{v||_(e)},[v,_]);return(0,a.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[s&&(0,a.jsxs)(t.Label,{htmlFor:p,children:[s,l&&(0,a.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,a.jsx)(r.t,{id:p,value:h.value,placeholder:c,unitText:u,allowNegative:d,disabled:f||v,onBlur:g,onValueChange:b}),y&&(0,a.jsx)(n.FieldError,{errors:h.meta.errors})]})};exports.SimpleNumberField=s;
+//# sourceMappingURL=simple-number-field-C4y4rQcw.cjs.map

package/dist/{simple-number-field-RBxUxq_w.cjs.map → simple-number-field-C4y4rQcw.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-number-field-RBxUxq_w.cjs","names":["useTanStackFieldContext","Label","NumberInput","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-number-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '@/components/ui/label';\nimport { NumberInput } from '@/components/ui/inputs/number-input';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  unit?: string;\n  allowNegative?: boolean;\n  disabled?: boolean;\n};\n\nexport const SimpleNumberField: React.FC<Props> = ({ label, placeholder, required, unit, allowNegative, disabled }) => {\n  const id = useId();\n  const { form, state, handleBlur, handleChange } = useTanStackFieldContext<number | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onValueChange = useCallback(\n    (value: number | null) => {\n      if (isSubmitting) return;\n      handleChange(value);\n    },\n    [isSubmitting, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <NumberInput\n        id={id}\n        value={state.value}\n        placeholder={placeholder}\n        unitText={unit}\n        allowNegative={allowNegative}\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onValueChange={onValueChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"+OAqBA,MAAa,GAAsC,CAAE,QAAO,cAAa,WAAU,OAAM,gBAAe,cAAe,CACrH,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEnF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,CACH,GAAyB,CACpB,GACJ,EAAa,CAAK,CACpB,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,IAAA,CAACC,EAAAA,EAAD,CACM,KACJ,MAAO,EAAM,MACA,cACb,SAAU,EACK,gBACf,SAAU,GAAY,EACtB,OAAQ,EACO,eAChB,CAAA,EACA,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-number-field-C4y4rQcw.cjs","names":["useTanStackFieldContext","Label","NumberInput","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-number-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '@/components/ui/label';\nimport { NumberInput } from '@/components/ui/inputs/number-input';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  unit?: string;\n  allowNegative?: boolean;\n  disabled?: boolean;\n};\n\nexport const SimpleNumberField: React.FC<Props> = ({ label, placeholder, required, unit, allowNegative, disabled }) => {\n  const id = useId();\n  const { form, state, handleBlur, handleChange } = useTanStackFieldContext<number | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onValueChange = useCallback(\n    (value: number | null) => {\n      if (isSubmitting) return;\n      handleChange(value);\n    },\n    [isSubmitting, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <NumberInput\n        id={id}\n        value={state.value}\n        placeholder={placeholder}\n        unitText={unit}\n        allowNegative={allowNegative}\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onValueChange={onValueChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"+OAqBA,MAAa,GAAsC,CAAE,QAAO,cAAa,WAAU,OAAM,gBAAe,cAAe,CACrH,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEnF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,CACH,GAAyB,CACpB,GACJ,EAAa,CAAK,CACpB,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,IAAA,CAACC,EAAAA,EAAD,CACM,KACJ,MAAO,EAAM,MACA,cACb,SAAU,EACK,gBACf,SAAU,GAAY,EACtB,OAAQ,EACO,eAChB,CAAA,EACA,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-password-field-BBpfmgoT.cjs → simple-password-field-BUzKJ0fu.cjs}

@@ -1,2 +1,2 @@
-const e=require("./tanstack-form-DU-ZKXxZ.cjs"),t=require("./ui/input.cjs"),n=require("./ui/label.cjs"),r=require("./field-BV5twmKA.cjs");let i=require("lucide-react"),a=require("react"),o=require("react/jsx-runtime"),s=require("@tanstack/react-form");const c=({label:c,placeholder:l,required:u,disabled:d})=>{let f=(0,a.useId)(),{form:p,name:m,state:h,handleBlur:g,handleChange:_}=e.G(),v=(0,s.useStore)(p.store,({isSubmitting:e})=>e),[y,b]=(0,a.useState)(!1),x=h.meta.isTouched&&!h.meta.isValid,S=(0,a.useCallback)(()=>b(e=>!e),[]),C=(0,a.useCallback)(({target:{value:e}})=>{v||_(e||null)},[v,_]);return(0,o.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[c&&(0,o.jsxs)(n.Label,{htmlFor:f,children:[c,u&&(0,o.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,o.jsxs)(`div`,{className:`relative`,children:[(0,o.jsx)(t.Input,{id:f,name:m,type:y?`text`:`password`,value:h.value??``,"aria-invalid":x,autoComplete:`current-password`,placeholder:l,disabled:d||v,className:`pr-9`,onBlur:g,onChange:C}),(0,o.jsx)(`button`,{type:`button`,tabIndex:-1,"aria-label":y?`Ẩn mật khẩu`:`Hiện mật khẩu`,"aria-pressed":y,"aria-controls":f,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:d||v,onClick:S,children:y?(0,o.jsx)(i.EyeOffIcon,{size:16,"aria-hidden":`true`}):(0,o.jsx)(i.EyeIcon,{size:16,"aria-hidden":`true`})})]}),x&&(0,o.jsx)(r.FieldError,{errors:h.meta.errors})]})};exports.SimplePasswordField=c;
-//# sourceMappingURL=simple-password-field-BBpfmgoT.cjs.map
+const e=require("./tanstack-form-CX3lC3mC.cjs"),t=require("./ui/input.cjs"),n=require("./ui/label.cjs"),r=require("./field-BSLi-P0Q.cjs");let i=require("lucide-react"),a=require("react"),o=require("react/jsx-runtime"),s=require("@tanstack/react-form");const c=({label:c,placeholder:l,required:u,disabled:d})=>{let f=(0,a.useId)(),{form:p,name:m,state:h,handleBlur:g,handleChange:_}=e.G(),v=(0,s.useStore)(p.store,({isSubmitting:e})=>e),[y,b]=(0,a.useState)(!1),x=h.meta.isTouched&&!h.meta.isValid,S=(0,a.useCallback)(()=>b(e=>!e),[]),C=(0,a.useCallback)(({target:{value:e}})=>{v||_(e||null)},[v,_]);return(0,o.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[c&&(0,o.jsxs)(n.Label,{htmlFor:f,children:[c,u&&(0,o.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,o.jsxs)(`div`,{className:`relative`,children:[(0,o.jsx)(t.Input,{id:f,name:m,type:y?`text`:`password`,value:h.value??``,"aria-invalid":x,autoComplete:`current-password`,placeholder:l,disabled:d||v,className:`pr-9`,onBlur:g,onChange:C}),(0,o.jsx)(`button`,{type:`button`,tabIndex:-1,"aria-label":y?`Ẩn mật khẩu`:`Hiện mật khẩu`,"aria-pressed":y,"aria-controls":f,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:d||v,onClick:S,children:y?(0,o.jsx)(i.EyeOffIcon,{size:16,"aria-hidden":`true`}):(0,o.jsx)(i.EyeIcon,{size:16,"aria-hidden":`true`})})]}),x&&(0,o.jsx)(r.FieldError,{errors:h.meta.errors})]})};exports.SimplePasswordField=c;
+//# sourceMappingURL=simple-password-field-BUzKJ0fu.cjs.map

package/dist/{simple-password-field-BBpfmgoT.cjs.map → simple-password-field-BUzKJ0fu.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-password-field-BBpfmgoT.cjs","names":["useTanStackFieldContext","Label","Input","EyeOffIcon","EyeIcon","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-password-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { EyeIcon, EyeOffIcon } from 'lucide-react';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  disabled?: boolean;\n};\n\nexport const SimplePasswordField: React.FC<Props> = ({ label, placeholder, required, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const [isVisible, setIsVisible] = useState(false);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const toggleVisibility = useCallback(() => setIsVisible(prev => !prev), []);\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <div className=\"relative\">\n        <Input\n          id={id}\n          name={name}\n          type={isVisible ? 'text' : 'password'}\n          value={state.value ?? ''}\n          aria-invalid={_invalid}\n          autoComplete=\"current-password\"\n          placeholder={placeholder}\n          disabled={disabled || isSubmitting}\n          className=\"pr-9\"\n          onBlur={handleBlur}\n          onChange={onChange}\n        />\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          aria-label={isVisible ? 'Ẩn mật khẩu' : 'Hiện mật khẩu'}\n          aria-pressed={isVisible}\n          aria-controls={id}\n          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\"\n          disabled={disabled || isSubmitting}\n          onClick={toggleVisibility}\n        >\n          {isVisible ? <EyeOffIcon size={16} aria-hidden=\"true\" /> : <EyeIcon size={16} aria-hidden=\"true\" />}\n        </button>\n      </div>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"4PAqBA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,cAAe,CAClG,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,CAAC,EAAW,IAAA,EAAA,EAAA,SAAA,CAAyB,EAAK,EAE1C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,KAAqC,EAAa,GAAQ,CAAC,CAAI,EAAG,CAAC,CAAC,EAEpE,GAAA,EAAA,EAAA,YAAA,EACH,CAAE,OAAQ,CAAE,YAAc,CACrB,GACJ,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,oBAAf,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CACM,KACE,OACN,KAAM,EAAY,OAAS,WAC3B,MAAO,EAAM,OAAS,GACtB,eAAc,EACd,aAAa,mBACA,cACb,SAAU,GAAY,EACtB,UAAU,OACV,OAAQ,EACE,UACX,CAAA,GACD,EAAA,EAAA,IAAA,CAAC,SAAD,CACE,KAAK,SACL,SAAU,GACV,aAAY,EAAY,cAAgB,gBACxC,eAAc,EACd,gBAAe,EACf,UAAU,0NACV,SAAU,GAAY,EACtB,QAAS,WAER,GAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,KAAM,GAAI,cAAY,MAAQ,CAAA,GAAI,EAAA,EAAA,IAAA,CAACC,EAAAA,QAAD,CAAS,KAAM,GAAI,cAAY,MAAQ,CAAA,CAC5F,CAAA,CACL,IACJ,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-password-field-BUzKJ0fu.cjs","names":["useTanStackFieldContext","Label","Input","EyeOffIcon","EyeIcon","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-password-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { EyeIcon, EyeOffIcon } from 'lucide-react';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  disabled?: boolean;\n};\n\nexport const SimplePasswordField: React.FC<Props> = ({ label, placeholder, required, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const [isVisible, setIsVisible] = useState(false);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const toggleVisibility = useCallback(() => setIsVisible(prev => !prev), []);\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <div className=\"relative\">\n        <Input\n          id={id}\n          name={name}\n          type={isVisible ? 'text' : 'password'}\n          value={state.value ?? ''}\n          aria-invalid={_invalid}\n          autoComplete=\"current-password\"\n          placeholder={placeholder}\n          disabled={disabled || isSubmitting}\n          className=\"pr-9\"\n          onBlur={handleBlur}\n          onChange={onChange}\n        />\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          aria-label={isVisible ? 'Ẩn mật khẩu' : 'Hiện mật khẩu'}\n          aria-pressed={isVisible}\n          aria-controls={id}\n          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\"\n          disabled={disabled || isSubmitting}\n          onClick={toggleVisibility}\n        >\n          {isVisible ? <EyeOffIcon size={16} aria-hidden=\"true\" /> : <EyeIcon size={16} aria-hidden=\"true\" />}\n        </button>\n      </div>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"4PAqBA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,cAAe,CAClG,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,CAAC,EAAW,IAAA,EAAA,EAAA,SAAA,CAAyB,EAAK,EAE1C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,KAAqC,EAAa,GAAQ,CAAC,CAAI,EAAG,CAAC,CAAC,EAEpE,GAAA,EAAA,EAAA,YAAA,EACH,CAAE,OAAQ,CAAE,YAAc,CACrB,GACJ,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,oBAAf,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CACM,KACE,OACN,KAAM,EAAY,OAAS,WAC3B,MAAO,EAAM,OAAS,GACtB,eAAc,EACd,aAAa,mBACA,cACb,SAAU,GAAY,EACtB,UAAU,OACV,OAAQ,EACE,UACX,CAAA,GACD,EAAA,EAAA,IAAA,CAAC,SAAD,CACE,KAAK,SACL,SAAU,GACV,aAAY,EAAY,cAAgB,gBACxC,eAAc,EACd,gBAAe,EACf,UAAU,0NACV,SAAU,GAAY,EACtB,QAAS,WAER,GAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,KAAM,GAAI,cAAY,MAAQ,CAAA,GAAI,EAAA,EAAA,IAAA,CAACC,EAAAA,QAAD,CAAS,KAAM,GAAI,cAAY,MAAQ,CAAA,CAC5F,CAAA,CACL,IACJ,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-password-field-CrGsdjSa.mjs → simple-password-field-CA0FuETK.mjs}

@@ -1,2 +1,2 @@
-import{G as e}from"./tanstack-form-B6mzOylW.mjs";import{Input as t}from"./ui/input.mjs";import{Label as n}from"./ui/label.mjs";import{FieldError as r}from"./field-BKyUqvzh.mjs";import{EyeIcon as i,EyeOffIcon as a}from"lucide-react";import{useCallback as o,useId as s,useState as c}from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";import{useStore as d}from"@tanstack/react-form";const f=({label:f,placeholder:p,required:m,disabled:h})=>{let g=s(),{form:_,name:v,state:y,handleBlur:b,handleChange:x}=e(),S=d(_.store,({isSubmitting:e})=>e),[C,w]=c(!1),T=y.meta.isTouched&&!y.meta.isValid,E=o(()=>w(e=>!e),[]),D=o(({target:{value:e}})=>{S||x(e||null)},[S,x]);return u(`div`,{className:`flex flex-col gap-1.5`,children:[f&&u(n,{htmlFor:g,children:[f,m&&l(`span`,{className:`text-danger-strong`,children:`*`})]}),u(`div`,{className:`relative`,children:[l(t,{id:g,name:v,type:C?`text`:`password`,value:y.value??``,"aria-invalid":T,autoComplete:`current-password`,placeholder:p,disabled:h||S,className:`pr-9`,onBlur:b,onChange:D}),l(`button`,{type:`button`,tabIndex:-1,"aria-label":C?`Ẩn mật khẩu`:`Hiện mật khẩu`,"aria-pressed":C,"aria-controls":g,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:h||S,onClick:E,children:l(C?a:i,{size:16,"aria-hidden":`true`})})]}),T&&l(r,{errors:y.meta.errors})]})};export{f as SimplePasswordField};
-//# sourceMappingURL=simple-password-field-CrGsdjSa.mjs.map
+import{G as e}from"./tanstack-form-CKAWexet.mjs";import{Input as t}from"./ui/input.mjs";import{Label as n}from"./ui/label.mjs";import{FieldError as r}from"./field-V2DoD8qL.mjs";import{EyeIcon as i,EyeOffIcon as a}from"lucide-react";import{useCallback as o,useId as s,useState as c}from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";import{useStore as d}from"@tanstack/react-form";const f=({label:f,placeholder:p,required:m,disabled:h})=>{let g=s(),{form:_,name:v,state:y,handleBlur:b,handleChange:x}=e(),S=d(_.store,({isSubmitting:e})=>e),[C,w]=c(!1),T=y.meta.isTouched&&!y.meta.isValid,E=o(()=>w(e=>!e),[]),D=o(({target:{value:e}})=>{S||x(e||null)},[S,x]);return u(`div`,{className:`flex flex-col gap-1.5`,children:[f&&u(n,{htmlFor:g,children:[f,m&&l(`span`,{className:`text-danger-strong`,children:`*`})]}),u(`div`,{className:`relative`,children:[l(t,{id:g,name:v,type:C?`text`:`password`,value:y.value??``,"aria-invalid":T,autoComplete:`current-password`,placeholder:p,disabled:h||S,className:`pr-9`,onBlur:b,onChange:D}),l(`button`,{type:`button`,tabIndex:-1,"aria-label":C?`Ẩn mật khẩu`:`Hiện mật khẩu`,"aria-pressed":C,"aria-controls":g,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:h||S,onClick:E,children:l(C?a:i,{size:16,"aria-hidden":`true`})})]}),T&&l(r,{errors:y.meta.errors})]})};export{f as SimplePasswordField};
+//# sourceMappingURL=simple-password-field-CA0FuETK.mjs.map

package/dist/{simple-password-field-CrGsdjSa.mjs.map → simple-password-field-CA0FuETK.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-password-field-CrGsdjSa.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-password-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { EyeIcon, EyeOffIcon } from 'lucide-react';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  disabled?: boolean;\n};\n\nexport const SimplePasswordField: React.FC<Props> = ({ label, placeholder, required, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const [isVisible, setIsVisible] = useState(false);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const toggleVisibility = useCallback(() => setIsVisible(prev => !prev), []);\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <div className=\"relative\">\n        <Input\n          id={id}\n          name={name}\n          type={isVisible ? 'text' : 'password'}\n          value={state.value ?? ''}\n          aria-invalid={_invalid}\n          autoComplete=\"current-password\"\n          placeholder={placeholder}\n          disabled={disabled || isSubmitting}\n          className=\"pr-9\"\n          onBlur={handleBlur}\n          onChange={onChange}\n        />\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          aria-label={isVisible ? 'Ẩn mật khẩu' : 'Hiện mật khẩu'}\n          aria-pressed={isVisible}\n          aria-controls={id}\n          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\"\n          disabled={disabled || isSubmitting}\n          onClick={toggleVisibility}\n        >\n          {isVisible ? <EyeOffIcon size={16} aria-hidden=\"true\" /> : <EyeIcon size={16} aria-hidden=\"true\" />}\n        </button>\n      </div>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"uYAqBA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,cAAe,CAClG,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,CAAC,EAAW,GAAgB,EAAS,EAAK,EAE1C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAmB,MAAkB,EAAa,GAAQ,CAAC,CAAI,EAAG,CAAC,CAAC,EAEpE,EAAW,GACd,CAAE,OAAQ,CAAE,YAAc,CACrB,GACJ,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,MAAD,CAAK,UAAU,oBAAf,CACE,EAAC,EAAD,CACM,KACE,OACN,KAAM,EAAY,OAAS,WAC3B,MAAO,EAAM,OAAS,GACtB,eAAc,EACd,aAAa,mBACA,cACb,SAAU,GAAY,EACtB,UAAU,OACV,OAAQ,EACE,UACX,CAAA,EACD,EAAC,SAAD,CACE,KAAK,SACL,SAAU,GACV,aAAY,EAAY,cAAgB,gBACxC,eAAc,EACd,gBAAe,EACf,UAAU,0NACV,SAAU,GAAY,EACtB,QAAS,WAEI,EAAZ,EAAa,EAA8C,EAA/C,CAAY,KAAM,GAAI,cAAY,MAAQ,CAA2C,CAC5F,CAAA,CACL,IACJ,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-password-field-CA0FuETK.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-password-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { EyeIcon, EyeOffIcon } from 'lucide-react';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  disabled?: boolean;\n};\n\nexport const SimplePasswordField: React.FC<Props> = ({ label, placeholder, required, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const [isVisible, setIsVisible] = useState(false);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const toggleVisibility = useCallback(() => setIsVisible(prev => !prev), []);\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <div className=\"relative\">\n        <Input\n          id={id}\n          name={name}\n          type={isVisible ? 'text' : 'password'}\n          value={state.value ?? ''}\n          aria-invalid={_invalid}\n          autoComplete=\"current-password\"\n          placeholder={placeholder}\n          disabled={disabled || isSubmitting}\n          className=\"pr-9\"\n          onBlur={handleBlur}\n          onChange={onChange}\n        />\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          aria-label={isVisible ? 'Ẩn mật khẩu' : 'Hiện mật khẩu'}\n          aria-pressed={isVisible}\n          aria-controls={id}\n          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\"\n          disabled={disabled || isSubmitting}\n          onClick={toggleVisibility}\n        >\n          {isVisible ? <EyeOffIcon size={16} aria-hidden=\"true\" /> : <EyeIcon size={16} aria-hidden=\"true\" />}\n        </button>\n      </div>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"uYAqBA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,cAAe,CAClG,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,CAAC,EAAW,GAAgB,EAAS,EAAK,EAE1C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAmB,MAAkB,EAAa,GAAQ,CAAC,CAAI,EAAG,CAAC,CAAC,EAEpE,EAAW,GACd,CAAE,OAAQ,CAAE,YAAc,CACrB,GACJ,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,MAAD,CAAK,UAAU,oBAAf,CACE,EAAC,EAAD,CACM,KACE,OACN,KAAM,EAAY,OAAS,WAC3B,MAAO,EAAM,OAAS,GACtB,eAAc,EACd,aAAa,mBACA,cACb,SAAU,GAAY,EACtB,UAAU,OACV,OAAQ,EACE,UACX,CAAA,EACD,EAAC,SAAD,CACE,KAAK,SACL,SAAU,GACV,aAAY,EAAY,cAAgB,gBACxC,eAAc,EACd,gBAAe,EACf,UAAU,0NACV,SAAU,GAAY,EACtB,QAAS,WAEI,EAAZ,EAAa,EAA8C,EAA/C,CAAY,KAAM,GAAI,cAAY,MAAQ,CAA2C,CAC5F,CAAA,CACL,IACJ,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-radio-group-field-CZ5u-XiY.mjs → simple-radio-group-field-BM7HBTSs.mjs}

@@ -1,2 +1,2 @@
-import{G as e}from"./tanstack-form-B6mzOylW.mjs";import{Label as t}from"./ui/label.mjs";import{RadioGroup as n,RadioGroupItem as r}from"./ui/radio-group.mjs";import{FieldError as i}from"./field-BKyUqvzh.mjs";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{useStore as s}from"@tanstack/react-form";const c=({label:c,required:l,disabled:u,options:d,orientation:f=`vertical`})=>{let{form:p,name:m,state:h,handleBlur:g,handleChange:_}=e(),v=s(p.store,({isSubmitting:e})=>e),y=h.meta.isTouched&&!h.meta.isValid,b=u||v;return o(`div`,{className:`flex flex-col gap-1.5`,children:[c&&o(t,{children:[c,l&&a(`span`,{className:`text-danger-strong`,children:`*`})]}),a(n,{name:m,value:h.value??``,disabled:b,"aria-invalid":y,className:f===`horizontal`?`flex flex-row flex-wrap gap-x-4 gap-y-2`:`flex flex-col gap-2`,onValueChange:_,onBlur:g,children:d.map(e=>o(`div`,{className:`flex items-center gap-2`,children:[a(r,{id:`${m}-${e.value}`,value:e.value}),a(t,{htmlFor:`${m}-${e.value}`,className:`cursor-pointer font-normal`,children:e.label})]},e.value))}),y&&a(i,{errors:h.meta.errors})]})};export{c as SimpleRadioGroupField};
-//# sourceMappingURL=simple-radio-group-field-CZ5u-XiY.mjs.map
+import{G as e}from"./tanstack-form-CKAWexet.mjs";import{Label as t}from"./ui/label.mjs";import{RadioGroup as n,RadioGroupItem as r}from"./ui/radio-group.mjs";import{FieldError as i}from"./field-V2DoD8qL.mjs";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{useStore as s}from"@tanstack/react-form";const c=({label:c,required:l,disabled:u,options:d,orientation:f=`vertical`})=>{let{form:p,name:m,state:h,handleBlur:g,handleChange:_}=e(),v=s(p.store,({isSubmitting:e})=>e),y=h.meta.isTouched&&!h.meta.isValid,b=u||v;return o(`div`,{className:`flex flex-col gap-1.5`,children:[c&&o(t,{children:[c,l&&a(`span`,{className:`text-danger-strong`,children:`*`})]}),a(n,{name:m,value:h.value??``,disabled:b,"aria-invalid":y,className:f===`horizontal`?`flex flex-row flex-wrap gap-x-4 gap-y-2`:`flex flex-col gap-2`,onValueChange:_,onBlur:g,children:d.map(e=>o(`div`,{className:`flex items-center gap-2`,children:[a(r,{id:`${m}-${e.value}`,value:e.value}),a(t,{htmlFor:`${m}-${e.value}`,className:`cursor-pointer font-normal`,children:e.label})]},e.value))}),y&&a(i,{errors:h.meta.errors})]})};export{c as SimpleRadioGroupField};
+//# sourceMappingURL=simple-radio-group-field-BM7HBTSs.mjs.map

package/dist/{simple-radio-group-field-CZ5u-XiY.mjs.map → simple-radio-group-field-BM7HBTSs.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-radio-group-field-CZ5u-XiY.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-radio-group-field.tsx"],"sourcesContent":["'use client';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '@/components/ui/label';\nimport { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  required?: boolean;\n  disabled?: boolean;\n  options: Array<{ value: string; label: string }>;\n  orientation?: 'horizontal' | 'vertical';\n};\n\nexport const SimpleRadioGroupField: React.FC<Props> = ({ label, required, disabled, options, orientation = 'vertical' }) => {\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n  const isDisabled = disabled || isSubmitting;\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <RadioGroup\n        name={name}\n        value={state.value ?? ''}\n        disabled={isDisabled}\n        aria-invalid={_invalid}\n        className={orientation === 'horizontal' ? 'flex flex-row flex-wrap gap-x-4 gap-y-2' : 'flex flex-col gap-2'}\n        onValueChange={handleChange}\n        onBlur={handleBlur}\n      >\n        {options.map(option => (\n          <div key={option.value} className=\"flex items-center gap-2\">\n            <RadioGroupItem id={`${name}-${option.value}`} value={option.value} />\n            <Label htmlFor={`${name}-${option.value}`} className=\"cursor-pointer font-normal\">\n              {option.label}\n            </Label>\n          </div>\n        ))}\n      </RadioGroup>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"kTAkBA,MAAa,GAA0C,CAAE,QAAO,WAAU,WAAU,UAAS,cAAc,cAAiB,CAC1H,GAAM,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAa,GAAY,EAE/B,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAA,SAAA,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,CAAA,CAAA,EAET,EAAC,EAAD,CACQ,OACN,MAAO,EAAM,OAAS,GACtB,SAAU,EACV,eAAc,EACd,UAAW,IAAgB,aAAe,0CAA4C,sBACtF,cAAe,EACf,OAAQ,WAEP,EAAQ,IAAI,GACX,EAAC,MAAD,CAAwB,UAAU,mCAAlC,CACE,EAAC,EAAD,CAAgB,GAAI,GAAG,EAAK,GAAG,EAAO,QAAS,MAAO,EAAO,KAAQ,CAAA,EACrE,EAAC,EAAD,CAAO,QAAS,GAAG,EAAK,GAAG,EAAO,QAAS,UAAU,sCAClD,EAAO,KACH,CAAA,CACJ,GALK,EAAO,KAKZ,CACN,CACS,CAAA,EACX,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-radio-group-field-BM7HBTSs.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-radio-group-field.tsx"],"sourcesContent":["'use client';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '@/components/ui/label';\nimport { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  required?: boolean;\n  disabled?: boolean;\n  options: Array<{ value: string; label: string }>;\n  orientation?: 'horizontal' | 'vertical';\n};\n\nexport const SimpleRadioGroupField: React.FC<Props> = ({ label, required, disabled, options, orientation = 'vertical' }) => {\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n  const isDisabled = disabled || isSubmitting;\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <RadioGroup\n        name={name}\n        value={state.value ?? ''}\n        disabled={isDisabled}\n        aria-invalid={_invalid}\n        className={orientation === 'horizontal' ? 'flex flex-row flex-wrap gap-x-4 gap-y-2' : 'flex flex-col gap-2'}\n        onValueChange={handleChange}\n        onBlur={handleBlur}\n      >\n        {options.map(option => (\n          <div key={option.value} className=\"flex items-center gap-2\">\n            <RadioGroupItem id={`${name}-${option.value}`} value={option.value} />\n            <Label htmlFor={`${name}-${option.value}`} className=\"cursor-pointer font-normal\">\n              {option.label}\n            </Label>\n          </div>\n        ))}\n      </RadioGroup>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"kTAkBA,MAAa,GAA0C,CAAE,QAAO,WAAU,WAAU,UAAS,cAAc,cAAiB,CAC1H,GAAM,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAa,GAAY,EAE/B,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAA,SAAA,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,CAAA,CAAA,EAET,EAAC,EAAD,CACQ,OACN,MAAO,EAAM,OAAS,GACtB,SAAU,EACV,eAAc,EACd,UAAW,IAAgB,aAAe,0CAA4C,sBACtF,cAAe,EACf,OAAQ,WAEP,EAAQ,IAAI,GACX,EAAC,MAAD,CAAwB,UAAU,mCAAlC,CACE,EAAC,EAAD,CAAgB,GAAI,GAAG,EAAK,GAAG,EAAO,QAAS,MAAO,EAAO,KAAQ,CAAA,EACrE,EAAC,EAAD,CAAO,QAAS,GAAG,EAAK,GAAG,EAAO,QAAS,UAAU,sCAClD,EAAO,KACH,CAAA,CACJ,GALK,EAAO,KAKZ,CACN,CACS,CAAA,EACX,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-radio-group-field-Dyc3SO9t.cjs → simple-radio-group-field-CCxUaYom.cjs}

@@ -1,2 +1,2 @@
-const e=require("./tanstack-form-DU-ZKXxZ.cjs"),t=require("./ui/label.cjs"),n=require("./ui/radio-group.cjs"),r=require("./field-BV5twmKA.cjs");let i=require("react/jsx-runtime"),a=require("@tanstack/react-form");const o=({label:o,required:s,disabled:c,options:l,orientation:u=`vertical`})=>{let{form:d,name:f,state:p,handleBlur:m,handleChange:h}=e.G(),g=(0,a.useStore)(d.store,({isSubmitting:e})=>e),_=p.meta.isTouched&&!p.meta.isValid,v=c||g;return(0,i.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[o&&(0,i.jsxs)(t.Label,{children:[o,s&&(0,i.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,i.jsx)(n.RadioGroup,{name:f,value:p.value??``,disabled:v,"aria-invalid":_,className:u===`horizontal`?`flex flex-row flex-wrap gap-x-4 gap-y-2`:`flex flex-col gap-2`,onValueChange:h,onBlur:m,children:l.map(e=>(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,i.jsx)(n.RadioGroupItem,{id:`${f}-${e.value}`,value:e.value}),(0,i.jsx)(t.Label,{htmlFor:`${f}-${e.value}`,className:`cursor-pointer font-normal`,children:e.label})]},e.value))}),_&&(0,i.jsx)(r.FieldError,{errors:p.meta.errors})]})};exports.SimpleRadioGroupField=o;
-//# sourceMappingURL=simple-radio-group-field-Dyc3SO9t.cjs.map
+const e=require("./tanstack-form-CX3lC3mC.cjs"),t=require("./ui/label.cjs"),n=require("./ui/radio-group.cjs"),r=require("./field-BSLi-P0Q.cjs");let i=require("react/jsx-runtime"),a=require("@tanstack/react-form");const o=({label:o,required:s,disabled:c,options:l,orientation:u=`vertical`})=>{let{form:d,name:f,state:p,handleBlur:m,handleChange:h}=e.G(),g=(0,a.useStore)(d.store,({isSubmitting:e})=>e),_=p.meta.isTouched&&!p.meta.isValid,v=c||g;return(0,i.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[o&&(0,i.jsxs)(t.Label,{children:[o,s&&(0,i.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,i.jsx)(n.RadioGroup,{name:f,value:p.value??``,disabled:v,"aria-invalid":_,className:u===`horizontal`?`flex flex-row flex-wrap gap-x-4 gap-y-2`:`flex flex-col gap-2`,onValueChange:h,onBlur:m,children:l.map(e=>(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,i.jsx)(n.RadioGroupItem,{id:`${f}-${e.value}`,value:e.value}),(0,i.jsx)(t.Label,{htmlFor:`${f}-${e.value}`,className:`cursor-pointer font-normal`,children:e.label})]},e.value))}),_&&(0,i.jsx)(r.FieldError,{errors:p.meta.errors})]})};exports.SimpleRadioGroupField=o;
+//# sourceMappingURL=simple-radio-group-field-CCxUaYom.cjs.map

package/dist/{simple-radio-group-field-Dyc3SO9t.cjs.map → simple-radio-group-field-CCxUaYom.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-radio-group-field-Dyc3SO9t.cjs","names":["useTanStackFieldContext","Label","RadioGroup","RadioGroupItem","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-radio-group-field.tsx"],"sourcesContent":["'use client';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '@/components/ui/label';\nimport { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  required?: boolean;\n  disabled?: boolean;\n  options: Array<{ value: string; label: string }>;\n  orientation?: 'horizontal' | 'vertical';\n};\n\nexport const SimpleRadioGroupField: React.FC<Props> = ({ label, required, disabled, options, orientation = 'vertical' }) => {\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n  const isDisabled = disabled || isSubmitting;\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <RadioGroup\n        name={name}\n        value={state.value ?? ''}\n        disabled={isDisabled}\n        aria-invalid={_invalid}\n        className={orientation === 'horizontal' ? 'flex flex-row flex-wrap gap-x-4 gap-y-2' : 'flex flex-col gap-2'}\n        onValueChange={handleChange}\n        onBlur={handleBlur}\n      >\n        {options.map(option => (\n          <div key={option.value} className=\"flex items-center gap-2\">\n            <RadioGroupItem id={`${name}-${option.value}`} value={option.value} />\n            <Label htmlFor={`${name}-${option.value}`} className=\"cursor-pointer font-normal\">\n              {option.label}\n            </Label>\n          </div>\n        ))}\n      </RadioGroup>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"qNAkBA,MAAa,GAA0C,CAAE,QAAO,WAAU,WAAU,UAAS,cAAc,cAAiB,CAC1H,GAAM,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAa,GAAY,EAE/B,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAA,SAAA,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,CAAA,CAAA,GAET,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CACQ,OACN,MAAO,EAAM,OAAS,GACtB,SAAU,EACV,eAAc,EACd,UAAW,IAAgB,aAAe,0CAA4C,sBACtF,cAAe,EACf,OAAQ,WAEP,EAAQ,IAAI,IACX,EAAA,EAAA,KAAA,CAAC,MAAD,CAAwB,UAAU,mCAAlC,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,GAAI,GAAG,EAAK,GAAG,EAAO,QAAS,MAAO,EAAO,KAAQ,CAAA,GACrE,EAAA,EAAA,IAAA,CAACF,EAAAA,MAAD,CAAO,QAAS,GAAG,EAAK,GAAG,EAAO,QAAS,UAAU,sCAClD,EAAO,KACH,CAAA,CACJ,GALK,EAAO,KAKZ,CACN,CACS,CAAA,EACX,IAAY,EAAA,EAAA,IAAA,CAACG,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-radio-group-field-CCxUaYom.cjs","names":["useTanStackFieldContext","Label","RadioGroup","RadioGroupItem","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-radio-group-field.tsx"],"sourcesContent":["'use client';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Label } from '@/components/ui/label';\nimport { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  required?: boolean;\n  disabled?: boolean;\n  options: Array<{ value: string; label: string }>;\n  orientation?: 'horizontal' | 'vertical';\n};\n\nexport const SimpleRadioGroupField: React.FC<Props> = ({ label, required, disabled, options, orientation = 'vertical' }) => {\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n  const isDisabled = disabled || isSubmitting;\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <RadioGroup\n        name={name}\n        value={state.value ?? ''}\n        disabled={isDisabled}\n        aria-invalid={_invalid}\n        className={orientation === 'horizontal' ? 'flex flex-row flex-wrap gap-x-4 gap-y-2' : 'flex flex-col gap-2'}\n        onValueChange={handleChange}\n        onBlur={handleBlur}\n      >\n        {options.map(option => (\n          <div key={option.value} className=\"flex items-center gap-2\">\n            <RadioGroupItem id={`${name}-${option.value}`} value={option.value} />\n            <Label htmlFor={`${name}-${option.value}`} className=\"cursor-pointer font-normal\">\n              {option.label}\n            </Label>\n          </div>\n        ))}\n      </RadioGroup>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"qNAkBA,MAAa,GAA0C,CAAE,QAAO,WAAU,WAAU,UAAS,cAAc,cAAiB,CAC1H,GAAM,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAa,GAAY,EAE/B,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAA,SAAA,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,CAAA,CAAA,GAET,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CACQ,OACN,MAAO,EAAM,OAAS,GACtB,SAAU,EACV,eAAc,EACd,UAAW,IAAgB,aAAe,0CAA4C,sBACtF,cAAe,EACf,OAAQ,WAEP,EAAQ,IAAI,IACX,EAAA,EAAA,KAAA,CAAC,MAAD,CAAwB,UAAU,mCAAlC,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,GAAI,GAAG,EAAK,GAAG,EAAO,QAAS,MAAO,EAAO,KAAQ,CAAA,GACrE,EAAA,EAAA,IAAA,CAACF,EAAAA,MAAD,CAAO,QAAS,GAAG,EAAK,GAAG,EAAO,QAAS,UAAU,sCAClD,EAAO,KACH,CAAA,CACJ,GALK,EAAO,KAKZ,CACN,CACS,CAAA,EACX,IAAY,EAAA,EAAA,IAAA,CAACG,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-select-field-CyFJthFb.mjs → simple-select-field-CeTVQwmP.mjs}

@@ -1,2 +1,2 @@
-import{Button as e}from"./ui/button.mjs";import{G as t}from"./tanstack-form-B6mzOylW.mjs";import{Label as n}from"./ui/label.mjs";import{Drawer as r,DrawerClose as i,DrawerContent as a,DrawerHeader as o,DrawerTitle as s}from"./ui/drawer.mjs";import{Select as c,SelectContent as l,SelectItem as u,SelectTrigger as d,SelectValue as f}from"./ui/select.mjs";import{FieldError as p}from"./field-BKyUqvzh.mjs";import{PackagePlusIcon as m}from"lucide-react";import{useId as h,useState as g}from"react";import{cn as _}from"@customafk/react-toolkit/utils";import{jsx as v,jsxs as y}from"react/jsx-runtime";import{useIsMobile as b}from"@customafk/react-toolkit/hooks/useMobile";const x=({label:x,placeholder:S,required:C,options:w})=>{let T=h(),{state:E,handleBlur:D,handleChange:O}=t(),k=b(),[A,j]=g(!1),M=E.meta.isTouched&&!E.meta.isValid,N=w.find(e=>e.value===E.value)?.label;return k?y(`div`,{className:`flex flex-col gap-1.5`,children:[x&&y(n,{htmlFor:T,children:[x,C&&v(`span`,{className:`text-danger-strong`,children:`*`})]}),v(e,{id:T,type:`button`,variant:`outline`,color:`muted`,className:_(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!E.value&&`text-text-positive-muted`,M&&`outline-danger bg-danger-bg-subtle`),"aria-invalid":M,onBlur:D,onClick:()=>j(!0),children:N??v(`span`,{className:`text-text-positive-muted`,children:S})}),v(r,{open:A,onOpenChange:j,direction:`bottom`,children:y(a,{children:[v(o,{children:v(s,{children:x??S??`Select an option`})}),v(`div`,{className:`flex flex-col overflow-y-auto pb-safe-bottom`,children:w.length>0?w.map(e=>v(i,{asChild:!0,children:v(`button`,{type:`button`,className:_(`flex w-full items-center px-4 py-3 text-left text-sm transition-colors`,`hover:bg-muted-muted active:bg-muted-muted`,E.value===e.value&&`bg-primary-bg-subtle font-medium text-primary`),onClick:()=>{O(e.value),j(!1)},children:e.label})},e.value)):y(`div`,{className:`flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak`,children:[v(m,{strokeWidth:1}),`No options available`]})})]})}),M&&v(p,{errors:E.meta.errors})]}):y(`div`,{className:`flex flex-col gap-1.5`,children:[x&&y(n,{htmlFor:T,children:[x,C&&v(`span`,{className:`text-danger-strong`,children:`*`})]}),y(c,{value:E.value??``,onValueChange:O,children:[v(d,{id:T,"aria-invalid":M?`true`:void 0,onBlur:D,children:v(f,{placeholder:S})}),v(l,{children:w.length>0?w.map(e=>v(u,{value:e.value,children:e.label},e.value)):y(`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:[v(m,{strokeWidth:1}),`No options available`]})})]}),M&&v(p,{errors:E.meta.errors})]})};export{x as SimpleSelectField};
-//# sourceMappingURL=simple-select-field-CyFJthFb.mjs.map
+import{Button as e}from"./ui/button.mjs";import{G as t}from"./tanstack-form-CKAWexet.mjs";import{Label as n}from"./ui/label.mjs";import{Drawer as r,DrawerClose as i,DrawerContent as a,DrawerHeader as o,DrawerTitle as s}from"./ui/drawer.mjs";import{Select as c,SelectContent as l,SelectItem as u,SelectTrigger as d,SelectValue as f}from"./ui/select.mjs";import{FieldError as p}from"./field-V2DoD8qL.mjs";import{PackagePlusIcon as m}from"lucide-react";import{useId as h,useState as g}from"react";import{cn as _}from"@customafk/react-toolkit/utils";import{jsx as v,jsxs as y}from"react/jsx-runtime";import{useIsMobile as b}from"@customafk/react-toolkit/hooks/useMobile";const x=({label:x,placeholder:S,required:C,options:w})=>{let T=h(),{state:E,handleBlur:D,handleChange:O}=t(),k=b(),[A,j]=g(!1),M=E.meta.isTouched&&!E.meta.isValid,N=w.find(e=>e.value===E.value)?.label;return k?y(`div`,{className:`flex flex-col gap-1.5`,children:[x&&y(n,{htmlFor:T,children:[x,C&&v(`span`,{className:`text-danger-strong`,children:`*`})]}),v(e,{id:T,type:`button`,variant:`outline`,color:`muted`,className:_(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!E.value&&`text-text-positive-muted`,M&&`outline-danger bg-danger-bg-subtle`),"aria-invalid":M,onBlur:D,onClick:()=>j(!0),children:N??v(`span`,{className:`text-text-positive-muted`,children:S})}),v(r,{open:A,onOpenChange:j,direction:`bottom`,children:y(a,{children:[v(o,{children:v(s,{children:x??S??`Select an option`})}),v(`div`,{className:`flex flex-col overflow-y-auto pb-safe-bottom`,children:w.length>0?w.map(e=>v(i,{asChild:!0,children:v(`button`,{type:`button`,className:_(`flex w-full items-center px-4 py-3 text-left text-sm transition-colors`,`hover:bg-muted-muted active:bg-muted-muted`,E.value===e.value&&`bg-primary-bg-subtle font-medium text-primary`),onClick:()=>{O(e.value),j(!1)},children:e.label})},e.value)):y(`div`,{className:`flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak`,children:[v(m,{strokeWidth:1}),`No options available`]})})]})}),M&&v(p,{errors:E.meta.errors})]}):y(`div`,{className:`flex flex-col gap-1.5`,children:[x&&y(n,{htmlFor:T,children:[x,C&&v(`span`,{className:`text-danger-strong`,children:`*`})]}),y(c,{value:E.value??``,onValueChange:O,children:[v(d,{id:T,"aria-invalid":M?`true`:void 0,onBlur:D,children:v(f,{placeholder:S})}),v(l,{children:w.length>0?w.map(e=>v(u,{value:e.value,children:e.label},e.value)):y(`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:[v(m,{strokeWidth:1}),`No options available`]})})]}),M&&v(p,{errors:E.meta.errors})]})};export{x as SimpleSelectField};
+//# sourceMappingURL=simple-select-field-CeTVQwmP.mjs.map

package/dist/{simple-select-field-CyFJthFb.mjs.map → simple-select-field-CeTVQwmP.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-select-field-CyFJthFb.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-select-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { PackagePlusIcon } from 'lucide-react';\n\nimport { useIsMobile } from '@customafk/react-toolkit/hooks/useMobile';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Drawer, DrawerClose, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer';\nimport { Label } from '@/components/ui/label';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  options: Array<{ value: string; label: string }>;\n};\n\nexport const SimpleSelectField: React.FC<Props> = ({ label, placeholder, required, options }) => {\n  const id = useId();\n  const { state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n  const isMobile = useIsMobile();\n  const [drawerOpen, setDrawerOpen] = useState(false);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n  const selectedLabel = options.find(o => o.value === state.value)?.label;\n\n  if (isMobile) {\n    return (\n      <div className=\"flex flex-col gap-1.5\">\n        {label && (\n          <Label htmlFor={id}>\n            {label}\n            {required && <span className=\"text-danger-strong\">*</span>}\n          </Label>\n        )}\n        <Button\n          id={id}\n          type=\"button\"\n          variant=\"outline\"\n          color=\"muted\"\n          className={cn(\n            'w-full justify-start font-normal outline-1 outline-border -outline-offset-1',\n            !state.value && 'text-text-positive-muted',\n            _invalid && 'outline-danger bg-danger-bg-subtle'\n          )}\n          aria-invalid={_invalid}\n          onBlur={handleBlur}\n          onClick={() => setDrawerOpen(true)}\n        >\n          {selectedLabel ?? <span className=\"text-text-positive-muted\">{placeholder}</span>}\n        </Button>\n\n        <Drawer open={drawerOpen} onOpenChange={setDrawerOpen} direction=\"bottom\">\n          <DrawerContent>\n            <DrawerHeader>\n              <DrawerTitle>{label ?? placeholder ?? 'Select an option'}</DrawerTitle>\n            </DrawerHeader>\n            <div className=\"flex flex-col overflow-y-auto pb-safe-bottom\">\n              {options.length > 0 ? (\n                options.map(option => (\n                  <DrawerClose key={option.value} asChild>\n                    <button\n                      type=\"button\"\n                      className={cn(\n                        'flex w-full items-center px-4 py-3 text-left text-sm transition-colors',\n                        'hover:bg-muted-muted active:bg-muted-muted',\n                        state.value === option.value && 'bg-primary-bg-subtle font-medium text-primary'\n                      )}\n                      onClick={() => {\n                        handleChange(option.value);\n                        setDrawerOpen(false);\n                      }}\n                    >\n                      {option.label}\n                    </button>\n                  </DrawerClose>\n                ))\n              ) : (\n                <div className=\"flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak\">\n                  <PackagePlusIcon strokeWidth={1} />\n                  No options available\n                </div>\n              )}\n            </div>\n          </DrawerContent>\n        </Drawer>\n\n        {_invalid && <FieldError errors={state.meta.errors} />}\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Select value={state.value ?? ''} onValueChange={handleChange}>\n        <SelectTrigger id={id} aria-invalid={_invalid ? 'true' : undefined} onBlur={handleBlur}>\n          <SelectValue placeholder={placeholder} />\n        </SelectTrigger>\n        <SelectContent>\n          {options.length > 0 ? (\n            options.map(option => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label}\n              </SelectItem>\n            ))\n          ) : (\n            <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\">\n              <PackagePlusIcon strokeWidth={1} />\n              No options available\n            </div>\n          )}\n        </SelectContent>\n      </Select>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"2pBAwBA,MAAa,GAAsC,CAAE,QAAO,cAAa,WAAU,aAAc,CAC/F,IAAM,EAAK,EAAM,EACX,CAAE,QAAO,aAAY,gBAAiB,EAAuC,EAC7E,EAAW,EAAY,EACvB,CAAC,EAAY,GAAiB,EAAS,EAAK,EAE5C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAgB,EAAQ,KAAK,GAAK,EAAE,QAAU,EAAM,KAAK,CAAC,EAAE,MAoElE,OAlEI,EAEA,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CACM,KACJ,KAAK,SACL,QAAQ,UACR,MAAM,QACN,UAAW,EACT,8EACA,CAAC,EAAM,OAAS,2BAChB,GAAY,oCACd,EACA,eAAc,EACd,OAAQ,EACR,YAAe,EAAc,EAAI,WAEhC,GAAiB,EAAC,OAAD,CAAM,UAAU,oCAA4B,CAAkB,CAAA,CAC1E,CAAA,EAER,EAAC,EAAD,CAAQ,KAAM,EAAY,aAAc,EAAe,UAAU,kBAC/D,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAA,SAAc,GAAS,GAAe,kBAAgC,CAAA,CAC1D,CAAA,EACd,EAAC,MAAD,CAAK,UAAU,wDACZ,EAAQ,OAAS,EAChB,EAAQ,IAAI,GACV,EAAC,EAAD,CAAgC,QAAA,YAC9B,EAAC,SAAD,CACE,KAAK,SACL,UAAW,EACT,yEACA,6CACA,EAAM,QAAU,EAAO,OAAS,+CAClC,EACA,YAAe,CACb,EAAa,EAAO,KAAK,EACzB,EAAc,EAAK,CACrB,WAEC,EAAO,KACF,CAAA,CACG,EAfK,EAAO,KAeZ,CACd,EAED,EAAC,MAAD,CAAK,UAAU,0GAAf,CACE,EAAC,EAAD,CAAiB,YAAa,CAAI,CAAA,EAAC,sBAEhC,GAEJ,CAAA,CACQ,CAAA,CAAA,CACT,CAAA,EAEP,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,IAKP,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CAAQ,MAAO,EAAM,OAAS,GAAI,cAAe,WAAjD,CACE,EAAC,EAAD,CAAmB,KAAI,eAAc,EAAW,OAAS,IAAA,GAAW,OAAQ,WAC1E,EAAC,EAAD,CAA0B,aAAc,CAAA,CAC3B,CAAA,EACf,EAAC,EAAD,CAAA,SACG,EAAQ,OAAS,EAChB,EAAQ,IAAI,GACV,EAAC,EAAD,CAA+B,MAAO,EAAO,eAC1C,EAAO,KACE,EAFK,EAAO,KAEZ,CACb,EAED,EAAC,MAAD,CAAK,UAAU,wJAAf,CACE,EAAC,EAAD,CAAiB,YAAa,CAAI,CAAA,EAAC,sBAEhC,GAEM,CAAA,CACT,IACP,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-select-field-CeTVQwmP.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-select-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { PackagePlusIcon } from 'lucide-react';\n\nimport { useIsMobile } from '@customafk/react-toolkit/hooks/useMobile';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Drawer, DrawerClose, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer';\nimport { Label } from '@/components/ui/label';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  options: Array<{ value: string; label: string }>;\n};\n\nexport const SimpleSelectField: React.FC<Props> = ({ label, placeholder, required, options }) => {\n  const id = useId();\n  const { state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n  const isMobile = useIsMobile();\n  const [drawerOpen, setDrawerOpen] = useState(false);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n  const selectedLabel = options.find(o => o.value === state.value)?.label;\n\n  if (isMobile) {\n    return (\n      <div className=\"flex flex-col gap-1.5\">\n        {label && (\n          <Label htmlFor={id}>\n            {label}\n            {required && <span className=\"text-danger-strong\">*</span>}\n          </Label>\n        )}\n        <Button\n          id={id}\n          type=\"button\"\n          variant=\"outline\"\n          color=\"muted\"\n          className={cn(\n            'w-full justify-start font-normal outline-1 outline-border -outline-offset-1',\n            !state.value && 'text-text-positive-muted',\n            _invalid && 'outline-danger bg-danger-bg-subtle'\n          )}\n          aria-invalid={_invalid}\n          onBlur={handleBlur}\n          onClick={() => setDrawerOpen(true)}\n        >\n          {selectedLabel ?? <span className=\"text-text-positive-muted\">{placeholder}</span>}\n        </Button>\n\n        <Drawer open={drawerOpen} onOpenChange={setDrawerOpen} direction=\"bottom\">\n          <DrawerContent>\n            <DrawerHeader>\n              <DrawerTitle>{label ?? placeholder ?? 'Select an option'}</DrawerTitle>\n            </DrawerHeader>\n            <div className=\"flex flex-col overflow-y-auto pb-safe-bottom\">\n              {options.length > 0 ? (\n                options.map(option => (\n                  <DrawerClose key={option.value} asChild>\n                    <button\n                      type=\"button\"\n                      className={cn(\n                        'flex w-full items-center px-4 py-3 text-left text-sm transition-colors',\n                        'hover:bg-muted-muted active:bg-muted-muted',\n                        state.value === option.value && 'bg-primary-bg-subtle font-medium text-primary'\n                      )}\n                      onClick={() => {\n                        handleChange(option.value);\n                        setDrawerOpen(false);\n                      }}\n                    >\n                      {option.label}\n                    </button>\n                  </DrawerClose>\n                ))\n              ) : (\n                <div className=\"flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak\">\n                  <PackagePlusIcon strokeWidth={1} />\n                  No options available\n                </div>\n              )}\n            </div>\n          </DrawerContent>\n        </Drawer>\n\n        {_invalid && <FieldError errors={state.meta.errors} />}\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Select value={state.value ?? ''} onValueChange={handleChange}>\n        <SelectTrigger id={id} aria-invalid={_invalid ? 'true' : undefined} onBlur={handleBlur}>\n          <SelectValue placeholder={placeholder} />\n        </SelectTrigger>\n        <SelectContent>\n          {options.length > 0 ? (\n            options.map(option => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label}\n              </SelectItem>\n            ))\n          ) : (\n            <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\">\n              <PackagePlusIcon strokeWidth={1} />\n              No options available\n            </div>\n          )}\n        </SelectContent>\n      </Select>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"2pBAwBA,MAAa,GAAsC,CAAE,QAAO,cAAa,WAAU,aAAc,CAC/F,IAAM,EAAK,EAAM,EACX,CAAE,QAAO,aAAY,gBAAiB,EAAuC,EAC7E,EAAW,EAAY,EACvB,CAAC,EAAY,GAAiB,EAAS,EAAK,EAE5C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAgB,EAAQ,KAAK,GAAK,EAAE,QAAU,EAAM,KAAK,CAAC,EAAE,MAoElE,OAlEI,EAEA,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CACM,KACJ,KAAK,SACL,QAAQ,UACR,MAAM,QACN,UAAW,EACT,8EACA,CAAC,EAAM,OAAS,2BAChB,GAAY,oCACd,EACA,eAAc,EACd,OAAQ,EACR,YAAe,EAAc,EAAI,WAEhC,GAAiB,EAAC,OAAD,CAAM,UAAU,oCAA4B,CAAkB,CAAA,CAC1E,CAAA,EAER,EAAC,EAAD,CAAQ,KAAM,EAAY,aAAc,EAAe,UAAU,kBAC/D,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAA,SAAc,GAAS,GAAe,kBAAgC,CAAA,CAC1D,CAAA,EACd,EAAC,MAAD,CAAK,UAAU,wDACZ,EAAQ,OAAS,EAChB,EAAQ,IAAI,GACV,EAAC,EAAD,CAAgC,QAAA,YAC9B,EAAC,SAAD,CACE,KAAK,SACL,UAAW,EACT,yEACA,6CACA,EAAM,QAAU,EAAO,OAAS,+CAClC,EACA,YAAe,CACb,EAAa,EAAO,KAAK,EACzB,EAAc,EAAK,CACrB,WAEC,EAAO,KACF,CAAA,CACG,EAfK,EAAO,KAeZ,CACd,EAED,EAAC,MAAD,CAAK,UAAU,0GAAf,CACE,EAAC,EAAD,CAAiB,YAAa,CAAI,CAAA,EAAC,sBAEhC,GAEJ,CAAA,CACQ,CAAA,CAAA,CACT,CAAA,EAEP,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,IAKP,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CAAQ,MAAO,EAAM,OAAS,GAAI,cAAe,WAAjD,CACE,EAAC,EAAD,CAAmB,KAAI,eAAc,EAAW,OAAS,IAAA,GAAW,OAAQ,WAC1E,EAAC,EAAD,CAA0B,aAAc,CAAA,CAC3B,CAAA,EACf,EAAC,EAAD,CAAA,SACG,EAAQ,OAAS,EAChB,EAAQ,IAAI,GACV,EAAC,EAAD,CAA+B,MAAO,EAAO,eAC1C,EAAO,KACE,EAFK,EAAO,KAEZ,CACb,EAED,EAAC,MAAD,CAAK,UAAU,wJAAf,CACE,EAAC,EAAD,CAAiB,YAAa,CAAI,CAAA,EAAC,sBAEhC,GAEM,CAAA,CACT,IACP,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-select-field-CCmaLlAT.cjs → simple-select-field-CzN4Xb7n.cjs}

@@ -1,2 +1,2 @@
-const e=require("./ui/button.cjs"),t=require("./tanstack-form-DU-ZKXxZ.cjs"),n=require("./ui/label.cjs"),r=require("./ui/drawer.cjs"),i=require("./ui/select.cjs"),a=require("./field-BV5twmKA.cjs");let o=require("lucide-react"),s=require("react"),c=require("@customafk/react-toolkit/utils"),l=require("react/jsx-runtime"),u=require("@customafk/react-toolkit/hooks/useMobile");const d=({label:d,placeholder:f,required:p,options:m})=>{let h=(0,s.useId)(),{state:g,handleBlur:_,handleChange:v}=t.G(),y=(0,u.useIsMobile)(),[b,x]=(0,s.useState)(!1),S=g.meta.isTouched&&!g.meta.isValid,C=m.find(e=>e.value===g.value)?.label;return y?(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[d&&(0,l.jsxs)(n.Label,{htmlFor:h,children:[d,p&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsx)(e.Button,{id:h,type:`button`,variant:`outline`,color:`muted`,className:(0,c.cn)(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!g.value&&`text-text-positive-muted`,S&&`outline-danger bg-danger-bg-subtle`),"aria-invalid":S,onBlur:_,onClick:()=>x(!0),children:C??(0,l.jsx)(`span`,{className:`text-text-positive-muted`,children:f})}),(0,l.jsx)(r.Drawer,{open:b,onOpenChange:x,direction:`bottom`,children:(0,l.jsxs)(r.DrawerContent,{children:[(0,l.jsx)(r.DrawerHeader,{children:(0,l.jsx)(r.DrawerTitle,{children:d??f??`Select an option`})}),(0,l.jsx)(`div`,{className:`flex flex-col overflow-y-auto pb-safe-bottom`,children:m.length>0?m.map(e=>(0,l.jsx)(r.DrawerClose,{asChild:!0,children:(0,l.jsx)(`button`,{type:`button`,className:(0,c.cn)(`flex w-full items-center px-4 py-3 text-left text-sm transition-colors`,`hover:bg-muted-muted active:bg-muted-muted`,g.value===e.value&&`bg-primary-bg-subtle font-medium text-primary`),onClick:()=>{v(e.value),x(!1)},children:e.label})},e.value)):(0,l.jsxs)(`div`,{className:`flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak`,children:[(0,l.jsx)(o.PackagePlusIcon,{strokeWidth:1}),`No options available`]})})]})}),S&&(0,l.jsx)(a.FieldError,{errors:g.meta.errors})]}):(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[d&&(0,l.jsxs)(n.Label,{htmlFor:h,children:[d,p&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsxs)(i.Select,{value:g.value??``,onValueChange:v,children:[(0,l.jsx)(i.SelectTrigger,{id:h,"aria-invalid":S?`true`:void 0,onBlur:_,children:(0,l.jsx)(i.SelectValue,{placeholder:f})}),(0,l.jsx)(i.SelectContent,{children:m.length>0?m.map(e=>(0,l.jsx)(i.SelectItem,{value:e.value,children:e.label},e.value)):(0,l.jsxs)(`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:[(0,l.jsx)(o.PackagePlusIcon,{strokeWidth:1}),`No options available`]})})]}),S&&(0,l.jsx)(a.FieldError,{errors:g.meta.errors})]})};exports.SimpleSelectField=d;
-//# sourceMappingURL=simple-select-field-CCmaLlAT.cjs.map
+const e=require("./ui/button.cjs"),t=require("./tanstack-form-CX3lC3mC.cjs"),n=require("./ui/label.cjs"),r=require("./ui/drawer.cjs"),i=require("./ui/select.cjs"),a=require("./field-BSLi-P0Q.cjs");let o=require("lucide-react"),s=require("react"),c=require("@customafk/react-toolkit/utils"),l=require("react/jsx-runtime"),u=require("@customafk/react-toolkit/hooks/useMobile");const d=({label:d,placeholder:f,required:p,options:m})=>{let h=(0,s.useId)(),{state:g,handleBlur:_,handleChange:v}=t.G(),y=(0,u.useIsMobile)(),[b,x]=(0,s.useState)(!1),S=g.meta.isTouched&&!g.meta.isValid,C=m.find(e=>e.value===g.value)?.label;return y?(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[d&&(0,l.jsxs)(n.Label,{htmlFor:h,children:[d,p&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsx)(e.Button,{id:h,type:`button`,variant:`outline`,color:`muted`,className:(0,c.cn)(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!g.value&&`text-text-positive-muted`,S&&`outline-danger bg-danger-bg-subtle`),"aria-invalid":S,onBlur:_,onClick:()=>x(!0),children:C??(0,l.jsx)(`span`,{className:`text-text-positive-muted`,children:f})}),(0,l.jsx)(r.Drawer,{open:b,onOpenChange:x,direction:`bottom`,children:(0,l.jsxs)(r.DrawerContent,{children:[(0,l.jsx)(r.DrawerHeader,{children:(0,l.jsx)(r.DrawerTitle,{children:d??f??`Select an option`})}),(0,l.jsx)(`div`,{className:`flex flex-col overflow-y-auto pb-safe-bottom`,children:m.length>0?m.map(e=>(0,l.jsx)(r.DrawerClose,{asChild:!0,children:(0,l.jsx)(`button`,{type:`button`,className:(0,c.cn)(`flex w-full items-center px-4 py-3 text-left text-sm transition-colors`,`hover:bg-muted-muted active:bg-muted-muted`,g.value===e.value&&`bg-primary-bg-subtle font-medium text-primary`),onClick:()=>{v(e.value),x(!1)},children:e.label})},e.value)):(0,l.jsxs)(`div`,{className:`flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak`,children:[(0,l.jsx)(o.PackagePlusIcon,{strokeWidth:1}),`No options available`]})})]})}),S&&(0,l.jsx)(a.FieldError,{errors:g.meta.errors})]}):(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[d&&(0,l.jsxs)(n.Label,{htmlFor:h,children:[d,p&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsxs)(i.Select,{value:g.value??``,onValueChange:v,children:[(0,l.jsx)(i.SelectTrigger,{id:h,"aria-invalid":S?`true`:void 0,onBlur:_,children:(0,l.jsx)(i.SelectValue,{placeholder:f})}),(0,l.jsx)(i.SelectContent,{children:m.length>0?m.map(e=>(0,l.jsx)(i.SelectItem,{value:e.value,children:e.label},e.value)):(0,l.jsxs)(`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:[(0,l.jsx)(o.PackagePlusIcon,{strokeWidth:1}),`No options available`]})})]}),S&&(0,l.jsx)(a.FieldError,{errors:g.meta.errors})]})};exports.SimpleSelectField=d;
+//# sourceMappingURL=simple-select-field-CzN4Xb7n.cjs.map

package/dist/{simple-select-field-CCmaLlAT.cjs.map → simple-select-field-CzN4Xb7n.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-select-field-CCmaLlAT.cjs","names":["useTanStackFieldContext","Label","Button","Drawer","DrawerContent","DrawerHeader","DrawerTitle","DrawerClose","PackagePlusIcon","FieldError","Select","SelectTrigger","SelectValue","SelectContent","SelectItem"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-select-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { PackagePlusIcon } from 'lucide-react';\n\nimport { useIsMobile } from '@customafk/react-toolkit/hooks/useMobile';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Drawer, DrawerClose, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer';\nimport { Label } from '@/components/ui/label';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  options: Array<{ value: string; label: string }>;\n};\n\nexport const SimpleSelectField: React.FC<Props> = ({ label, placeholder, required, options }) => {\n  const id = useId();\n  const { state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n  const isMobile = useIsMobile();\n  const [drawerOpen, setDrawerOpen] = useState(false);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n  const selectedLabel = options.find(o => o.value === state.value)?.label;\n\n  if (isMobile) {\n    return (\n      <div className=\"flex flex-col gap-1.5\">\n        {label && (\n          <Label htmlFor={id}>\n            {label}\n            {required && <span className=\"text-danger-strong\">*</span>}\n          </Label>\n        )}\n        <Button\n          id={id}\n          type=\"button\"\n          variant=\"outline\"\n          color=\"muted\"\n          className={cn(\n            'w-full justify-start font-normal outline-1 outline-border -outline-offset-1',\n            !state.value && 'text-text-positive-muted',\n            _invalid && 'outline-danger bg-danger-bg-subtle'\n          )}\n          aria-invalid={_invalid}\n          onBlur={handleBlur}\n          onClick={() => setDrawerOpen(true)}\n        >\n          {selectedLabel ?? <span className=\"text-text-positive-muted\">{placeholder}</span>}\n        </Button>\n\n        <Drawer open={drawerOpen} onOpenChange={setDrawerOpen} direction=\"bottom\">\n          <DrawerContent>\n            <DrawerHeader>\n              <DrawerTitle>{label ?? placeholder ?? 'Select an option'}</DrawerTitle>\n            </DrawerHeader>\n            <div className=\"flex flex-col overflow-y-auto pb-safe-bottom\">\n              {options.length > 0 ? (\n                options.map(option => (\n                  <DrawerClose key={option.value} asChild>\n                    <button\n                      type=\"button\"\n                      className={cn(\n                        'flex w-full items-center px-4 py-3 text-left text-sm transition-colors',\n                        'hover:bg-muted-muted active:bg-muted-muted',\n                        state.value === option.value && 'bg-primary-bg-subtle font-medium text-primary'\n                      )}\n                      onClick={() => {\n                        handleChange(option.value);\n                        setDrawerOpen(false);\n                      }}\n                    >\n                      {option.label}\n                    </button>\n                  </DrawerClose>\n                ))\n              ) : (\n                <div className=\"flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak\">\n                  <PackagePlusIcon strokeWidth={1} />\n                  No options available\n                </div>\n              )}\n            </div>\n          </DrawerContent>\n        </Drawer>\n\n        {_invalid && <FieldError errors={state.meta.errors} />}\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Select value={state.value ?? ''} onValueChange={handleChange}>\n        <SelectTrigger id={id} aria-invalid={_invalid ? 'true' : undefined} onBlur={handleBlur}>\n          <SelectValue placeholder={placeholder} />\n        </SelectTrigger>\n        <SelectContent>\n          {options.length > 0 ? (\n            options.map(option => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label}\n              </SelectItem>\n            ))\n          ) : (\n            <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\">\n              <PackagePlusIcon strokeWidth={1} />\n              No options available\n            </div>\n          )}\n        </SelectContent>\n      </Select>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"uXAwBA,MAAa,GAAsC,CAAE,QAAO,cAAa,WAAU,aAAc,CAC/F,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAC7E,GAAA,EAAA,EAAA,YAAA,CAAuB,EACvB,CAAC,EAAY,IAAA,EAAA,EAAA,SAAA,CAA0B,EAAK,EAE5C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAgB,EAAQ,KAAK,GAAK,EAAE,QAAU,EAAM,KAAK,CAAC,EAAE,MAoElE,OAlEI,GAEA,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAD,CACM,KACJ,KAAK,SACL,QAAQ,UACR,MAAM,QACN,WAAA,EAAA,EAAA,GAAA,CACE,8EACA,CAAC,EAAM,OAAS,2BAChB,GAAY,oCACd,EACA,eAAc,EACd,OAAQ,EACR,YAAe,EAAc,EAAI,WAEhC,IAAiB,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,oCAA4B,CAAkB,CAAA,CAC1E,CAAA,GAER,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAD,CAAQ,KAAM,EAAY,aAAc,EAAe,UAAU,mBAC/D,EAAA,EAAA,KAAA,CAACC,EAAAA,cAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAA,UACE,EAAA,EAAA,IAAA,CAACC,EAAAA,YAAD,CAAA,SAAc,GAAS,GAAe,kBAAgC,CAAA,CAC1D,CAAA,GACd,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,wDACZ,EAAQ,OAAS,EAChB,EAAQ,IAAI,IACV,EAAA,EAAA,IAAA,CAACC,EAAAA,YAAD,CAAgC,QAAA,aAC9B,EAAA,EAAA,IAAA,CAAC,SAAD,CACE,KAAK,SACL,WAAA,EAAA,EAAA,GAAA,CACE,yEACA,6CACA,EAAM,QAAU,EAAO,OAAS,+CAClC,EACA,YAAe,CACb,EAAa,EAAO,KAAK,EACzB,EAAc,EAAK,CACrB,WAEC,EAAO,KACF,CAAA,CACG,EAfK,EAAO,KAeZ,CACd,GAED,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,0GAAf,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,gBAAD,CAAiB,YAAa,CAAI,CAAA,EAAC,sBAEhC,GAEJ,CAAA,CACQ,CAAA,CAAA,CACT,CAAA,EAEP,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,KAKP,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACR,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,KAAA,CAACS,EAAAA,OAAD,CAAQ,MAAO,EAAM,OAAS,GAAI,cAAe,WAAjD,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAmB,KAAI,eAAc,EAAW,OAAS,IAAA,GAAW,OAAQ,YAC1E,EAAA,EAAA,IAAA,CAACC,EAAAA,YAAD,CAA0B,aAAc,CAAA,CAC3B,CAAA,GACf,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAA,SACG,EAAQ,OAAS,EAChB,EAAQ,IAAI,IACV,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAA+B,MAAO,EAAO,eAC1C,EAAO,KACE,EAFK,EAAO,KAEZ,CACb,GAED,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,wJAAf,EACE,EAAA,EAAA,IAAA,CAACN,EAAAA,gBAAD,CAAiB,YAAa,CAAI,CAAA,EAAC,sBAEhC,GAEM,CAAA,CACT,IACP,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-select-field-CzN4Xb7n.cjs","names":["useTanStackFieldContext","Label","Button","Drawer","DrawerContent","DrawerHeader","DrawerTitle","DrawerClose","PackagePlusIcon","FieldError","Select","SelectTrigger","SelectValue","SelectContent","SelectItem"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-select-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { PackagePlusIcon } from 'lucide-react';\n\nimport { useIsMobile } from '@customafk/react-toolkit/hooks/useMobile';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Drawer, DrawerClose, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer';\nimport { Label } from '@/components/ui/label';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  options: Array<{ value: string; label: string }>;\n};\n\nexport const SimpleSelectField: React.FC<Props> = ({ label, placeholder, required, options }) => {\n  const id = useId();\n  const { state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n  const isMobile = useIsMobile();\n  const [drawerOpen, setDrawerOpen] = useState(false);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n  const selectedLabel = options.find(o => o.value === state.value)?.label;\n\n  if (isMobile) {\n    return (\n      <div className=\"flex flex-col gap-1.5\">\n        {label && (\n          <Label htmlFor={id}>\n            {label}\n            {required && <span className=\"text-danger-strong\">*</span>}\n          </Label>\n        )}\n        <Button\n          id={id}\n          type=\"button\"\n          variant=\"outline\"\n          color=\"muted\"\n          className={cn(\n            'w-full justify-start font-normal outline-1 outline-border -outline-offset-1',\n            !state.value && 'text-text-positive-muted',\n            _invalid && 'outline-danger bg-danger-bg-subtle'\n          )}\n          aria-invalid={_invalid}\n          onBlur={handleBlur}\n          onClick={() => setDrawerOpen(true)}\n        >\n          {selectedLabel ?? <span className=\"text-text-positive-muted\">{placeholder}</span>}\n        </Button>\n\n        <Drawer open={drawerOpen} onOpenChange={setDrawerOpen} direction=\"bottom\">\n          <DrawerContent>\n            <DrawerHeader>\n              <DrawerTitle>{label ?? placeholder ?? 'Select an option'}</DrawerTitle>\n            </DrawerHeader>\n            <div className=\"flex flex-col overflow-y-auto pb-safe-bottom\">\n              {options.length > 0 ? (\n                options.map(option => (\n                  <DrawerClose key={option.value} asChild>\n                    <button\n                      type=\"button\"\n                      className={cn(\n                        'flex w-full items-center px-4 py-3 text-left text-sm transition-colors',\n                        'hover:bg-muted-muted active:bg-muted-muted',\n                        state.value === option.value && 'bg-primary-bg-subtle font-medium text-primary'\n                      )}\n                      onClick={() => {\n                        handleChange(option.value);\n                        setDrawerOpen(false);\n                      }}\n                    >\n                      {option.label}\n                    </button>\n                  </DrawerClose>\n                ))\n              ) : (\n                <div className=\"flex items-center justify-center gap-x-2 px-4 py-8 text-center text-sm text-text-positive-weak\">\n                  <PackagePlusIcon strokeWidth={1} />\n                  No options available\n                </div>\n              )}\n            </div>\n          </DrawerContent>\n        </Drawer>\n\n        {_invalid && <FieldError errors={state.meta.errors} />}\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Select value={state.value ?? ''} onValueChange={handleChange}>\n        <SelectTrigger id={id} aria-invalid={_invalid ? 'true' : undefined} onBlur={handleBlur}>\n          <SelectValue placeholder={placeholder} />\n        </SelectTrigger>\n        <SelectContent>\n          {options.length > 0 ? (\n            options.map(option => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label}\n              </SelectItem>\n            ))\n          ) : (\n            <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\">\n              <PackagePlusIcon strokeWidth={1} />\n              No options available\n            </div>\n          )}\n        </SelectContent>\n      </Select>\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"uXAwBA,MAAa,GAAsC,CAAE,QAAO,cAAa,WAAU,aAAc,CAC/F,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAC7E,GAAA,EAAA,EAAA,YAAA,CAAuB,EACvB,CAAC,EAAY,IAAA,EAAA,EAAA,SAAA,CAA0B,EAAK,EAE5C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAgB,EAAQ,KAAK,GAAK,EAAE,QAAU,EAAM,KAAK,CAAC,EAAE,MAoElE,OAlEI,GAEA,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAD,CACM,KACJ,KAAK,SACL,QAAQ,UACR,MAAM,QACN,WAAA,EAAA,EAAA,GAAA,CACE,8EACA,CAAC,EAAM,OAAS,2BAChB,GAAY,oCACd,EACA,eAAc,EACd,OAAQ,EACR,YAAe,EAAc,EAAI,WAEhC,IAAiB,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,oCAA4B,CAAkB,CAAA,CAC1E,CAAA,GAER,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAD,CAAQ,KAAM,EAAY,aAAc,EAAe,UAAU,mBAC/D,EAAA,EAAA,KAAA,CAACC,EAAAA,cAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAA,UACE,EAAA,EAAA,IAAA,CAACC,EAAAA,YAAD,CAAA,SAAc,GAAS,GAAe,kBAAgC,CAAA,CAC1D,CAAA,GACd,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,wDACZ,EAAQ,OAAS,EAChB,EAAQ,IAAI,IACV,EAAA,EAAA,IAAA,CAACC,EAAAA,YAAD,CAAgC,QAAA,aAC9B,EAAA,EAAA,IAAA,CAAC,SAAD,CACE,KAAK,SACL,WAAA,EAAA,EAAA,GAAA,CACE,yEACA,6CACA,EAAM,QAAU,EAAO,OAAS,+CAClC,EACA,YAAe,CACb,EAAa,EAAO,KAAK,EACzB,EAAc,EAAK,CACrB,WAEC,EAAO,KACF,CAAA,CACG,EAfK,EAAO,KAeZ,CACd,GAED,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,0GAAf,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,gBAAD,CAAiB,YAAa,CAAI,CAAA,EAAC,sBAEhC,GAEJ,CAAA,CACQ,CAAA,CAAA,CACT,CAAA,EAEP,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,KAKP,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACR,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,KAAA,CAACS,EAAAA,OAAD,CAAQ,MAAO,EAAM,OAAS,GAAI,cAAe,WAAjD,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAmB,KAAI,eAAc,EAAW,OAAS,IAAA,GAAW,OAAQ,YAC1E,EAAA,EAAA,IAAA,CAACC,EAAAA,YAAD,CAA0B,aAAc,CAAA,CAC3B,CAAA,GACf,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAA,SACG,EAAQ,OAAS,EAChB,EAAQ,IAAI,IACV,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAA+B,MAAO,EAAO,eAC1C,EAAO,KACE,EAFK,EAAO,KAEZ,CACb,GAED,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,wJAAf,EACE,EAAA,EAAA,IAAA,CAACN,EAAAA,gBAAD,CAAiB,YAAa,CAAI,CAAA,EAAC,sBAEhC,GAEM,CAAA,CACT,IACP,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-text-field-DxZyRSy5.mjs → simple-text-field-CDsgWUFD.mjs}

@@ -1,2 +1,2 @@
-import{G as e}from"./tanstack-form-B6mzOylW.mjs";import{Input as t}from"./ui/input.mjs";import{Label as n}from"./ui/label.mjs";import{FieldError as r}from"./field-BKyUqvzh.mjs";import{useCallback as i,useId as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import{useStore as c}from"@tanstack/react-form";const l=({label:l,placeholder:u,required:d,maxLength:f,disabled:p})=>{let m=a(),{form:h,name:g,state:_,handleBlur:v,handleChange:y}=e(),b=c(h.store,({isSubmitting:e})=>e),x=_.meta.isTouched&&!_.meta.isValid,S=i(({target:{value:e}})=>{b||f&&e.length>f||y(e||null)},[b,f,y]);return s(`div`,{className:`flex flex-col gap-1.5`,children:[l&&s(n,{htmlFor:m,children:[l,d&&o(`span`,{className:`text-danger-strong`,children:`*`})]}),o(t,{id:m,name:g,value:_.value??``,"aria-invalid":x,placeholder:u,autoComplete:`off`,disabled:p||b,onBlur:v,onChange:S}),x&&o(r,{errors:_.meta.errors})]})};export{l as SimpleTextField};
-//# sourceMappingURL=simple-text-field-DxZyRSy5.mjs.map
+import{G as e}from"./tanstack-form-CKAWexet.mjs";import{Input as t}from"./ui/input.mjs";import{Label as n}from"./ui/label.mjs";import{FieldError as r}from"./field-V2DoD8qL.mjs";import{useCallback as i,useId as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import{useStore as c}from"@tanstack/react-form";const l=({label:l,placeholder:u,required:d,maxLength:f,disabled:p})=>{let m=a(),{form:h,name:g,state:_,handleBlur:v,handleChange:y}=e(),b=c(h.store,({isSubmitting:e})=>e),x=_.meta.isTouched&&!_.meta.isValid,S=i(({target:{value:e}})=>{b||f&&e.length>f||y(e||null)},[b,f,y]);return s(`div`,{className:`flex flex-col gap-1.5`,children:[l&&s(n,{htmlFor:m,children:[l,d&&o(`span`,{className:`text-danger-strong`,children:`*`})]}),o(t,{id:m,name:g,value:_.value??``,"aria-invalid":x,placeholder:u,autoComplete:`off`,disabled:p||b,onBlur:v,onChange:S}),x&&o(r,{errors:_.meta.errors})]})};export{l as SimpleTextField};
+//# sourceMappingURL=simple-text-field-CDsgWUFD.mjs.map

package/dist/{simple-text-field-DxZyRSy5.mjs.map → simple-text-field-CDsgWUFD.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-text-field-DxZyRSy5.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-text-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\nimport type { SimpleTextFieldProps as Props } from '../../types';\n\nexport const SimpleTextField: React.FC<Props> = ({ label, placeholder, required, maxLength, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Input\n        id={id}\n        name={name}\n        value={state.value ?? ''}\n        aria-invalid={_invalid}\n        placeholder={placeholder}\n        autoComplete=\"off\"\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onChange={onChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"kUAcA,MAAa,GAAoC,CAAE,QAAO,cAAa,WAAU,YAAW,cAAe,CACzG,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAW,GACd,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CACM,KACE,OACN,MAAO,EAAM,OAAS,GACtB,eAAc,EACD,cACb,aAAa,MACb,SAAU,GAAY,EACtB,OAAQ,EACE,UACX,CAAA,EACA,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-text-field-CDsgWUFD.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-text-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\nimport type { SimpleTextFieldProps as Props } from '../../types';\n\nexport const SimpleTextField: React.FC<Props> = ({ label, placeholder, required, maxLength, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Input\n        id={id}\n        name={name}\n        value={state.value ?? ''}\n        aria-invalid={_invalid}\n        placeholder={placeholder}\n        autoComplete=\"off\"\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onChange={onChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"kUAcA,MAAa,GAAoC,CAAE,QAAO,cAAa,WAAU,YAAW,cAAe,CACzG,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAW,GACd,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CACM,KACE,OACN,MAAO,EAAM,OAAS,GACtB,eAAc,EACD,cACb,aAAa,MACb,SAAU,GAAY,EACtB,OAAQ,EACE,UACX,CAAA,EACA,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-text-field-DSX3rP7g.cjs → simple-text-field-DGZL0gML.cjs}

@@ -1,2 +1,2 @@
-const e=require("./tanstack-form-DU-ZKXxZ.cjs"),t=require("./ui/input.cjs"),n=require("./ui/label.cjs"),r=require("./field-BV5twmKA.cjs");let i=require("react"),a=require("react/jsx-runtime"),o=require("@tanstack/react-form");const s=({label:s,placeholder:c,required:l,maxLength:u,disabled:d})=>{let f=(0,i.useId)(),{form:p,name:m,state:h,handleBlur:g,handleChange:_}=e.G(),v=(0,o.useStore)(p.store,({isSubmitting:e})=>e),y=h.meta.isTouched&&!h.meta.isValid,b=(0,i.useCallback)(({target:{value:e}})=>{v||u&&e.length>u||_(e||null)},[v,u,_]);return(0,a.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[s&&(0,a.jsxs)(n.Label,{htmlFor:f,children:[s,l&&(0,a.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,a.jsx)(t.Input,{id:f,name:m,value:h.value??``,"aria-invalid":y,placeholder:c,autoComplete:`off`,disabled:d||v,onBlur:g,onChange:b}),y&&(0,a.jsx)(r.FieldError,{errors:h.meta.errors})]})};exports.SimpleTextField=s;
-//# sourceMappingURL=simple-text-field-DSX3rP7g.cjs.map
+const e=require("./tanstack-form-CX3lC3mC.cjs"),t=require("./ui/input.cjs"),n=require("./ui/label.cjs"),r=require("./field-BSLi-P0Q.cjs");let i=require("react"),a=require("react/jsx-runtime"),o=require("@tanstack/react-form");const s=({label:s,placeholder:c,required:l,maxLength:u,disabled:d})=>{let f=(0,i.useId)(),{form:p,name:m,state:h,handleBlur:g,handleChange:_}=e.G(),v=(0,o.useStore)(p.store,({isSubmitting:e})=>e),y=h.meta.isTouched&&!h.meta.isValid,b=(0,i.useCallback)(({target:{value:e}})=>{v||u&&e.length>u||_(e||null)},[v,u,_]);return(0,a.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[s&&(0,a.jsxs)(n.Label,{htmlFor:f,children:[s,l&&(0,a.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,a.jsx)(t.Input,{id:f,name:m,value:h.value??``,"aria-invalid":y,placeholder:c,autoComplete:`off`,disabled:d||v,onBlur:g,onChange:b}),y&&(0,a.jsx)(r.FieldError,{errors:h.meta.errors})]})};exports.SimpleTextField=s;
+//# sourceMappingURL=simple-text-field-DGZL0gML.cjs.map

package/dist/{simple-text-field-DSX3rP7g.cjs.map → simple-text-field-DGZL0gML.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-text-field-DSX3rP7g.cjs","names":["useTanStackFieldContext","Label","Input","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-text-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\nimport type { SimpleTextFieldProps as Props } from '../../types';\n\nexport const SimpleTextField: React.FC<Props> = ({ label, placeholder, required, maxLength, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Input\n        id={id}\n        name={name}\n        value={state.value ?? ''}\n        aria-invalid={_invalid}\n        placeholder={placeholder}\n        autoComplete=\"off\"\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onChange={onChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"kOAcA,MAAa,GAAoC,CAAE,QAAO,cAAa,WAAU,YAAW,cAAe,CACzG,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,EACH,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CACM,KACE,OACN,MAAO,EAAM,OAAS,GACtB,eAAc,EACD,cACb,aAAa,MACb,SAAU,GAAY,EACtB,OAAQ,EACE,UACX,CAAA,EACA,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-text-field-DGZL0gML.cjs","names":["useTanStackFieldContext","Label","Input","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-text-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Input } from '@/components/ui/input';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\nimport type { SimpleTextFieldProps as Props } from '../../types';\n\nexport const SimpleTextField: React.FC<Props> = ({ label, placeholder, required, maxLength, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Input\n        id={id}\n        name={name}\n        value={state.value ?? ''}\n        aria-invalid={_invalid}\n        placeholder={placeholder}\n        autoComplete=\"off\"\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onChange={onChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"kOAcA,MAAa,GAAoC,CAAE,QAAO,cAAa,WAAU,YAAW,cAAe,CACzG,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,EACH,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CACM,KACE,OACN,MAAO,EAAM,OAAS,GACtB,eAAc,EACD,cACb,aAAa,MACb,SAAU,GAAY,EACtB,OAAQ,EACE,UACX,CAAA,EACA,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-textarea-field-BiaAbLgT.mjs → simple-textarea-field-BiuHXtqj.mjs}

@@ -1,2 +1,2 @@
-import{G as e}from"./tanstack-form-B6mzOylW.mjs";import{Label as t}from"./ui/label.mjs";import{Textarea as n}from"./ui/textarea.mjs";import{FieldError as r}from"./field-BKyUqvzh.mjs";import{useCallback as i,useId as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import{useStore as c}from"@tanstack/react-form";const l=({label:l,placeholder:u,required:d,maxLength:f,rows:p,disabled:m})=>{let h=a(),{form:g,name:_,state:v,handleBlur:y,handleChange:b}=e(),x=c(g.store,({isSubmitting:e})=>e),S=v.meta.isTouched&&!v.meta.isValid,C=i(({target:{value:e}})=>{x||f&&e.length>f||b(e||null)},[x,f,b]);return s(`div`,{className:`flex flex-col gap-1.5`,children:[l&&s(t,{htmlFor:h,children:[l,d&&o(`span`,{className:`text-danger-strong`,children:`*`})]}),o(n,{id:h,name:_,value:v.value??``,"aria-invalid":S,placeholder:u,rows:p,disabled:m||x,onBlur:y,onChange:C}),S&&o(r,{errors:v.meta.errors})]})};export{l as SimpleTextareaField};
-//# sourceMappingURL=simple-textarea-field-BiaAbLgT.mjs.map
+import{G as e}from"./tanstack-form-CKAWexet.mjs";import{Label as t}from"./ui/label.mjs";import{Textarea as n}from"./ui/textarea.mjs";import{FieldError as r}from"./field-V2DoD8qL.mjs";import{useCallback as i,useId as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import{useStore as c}from"@tanstack/react-form";const l=({label:l,placeholder:u,required:d,maxLength:f,rows:p,disabled:m})=>{let h=a(),{form:g,name:_,state:v,handleBlur:y,handleChange:b}=e(),x=c(g.store,({isSubmitting:e})=>e),S=v.meta.isTouched&&!v.meta.isValid,C=i(({target:{value:e}})=>{x||f&&e.length>f||b(e||null)},[x,f,b]);return s(`div`,{className:`flex flex-col gap-1.5`,children:[l&&s(t,{htmlFor:h,children:[l,d&&o(`span`,{className:`text-danger-strong`,children:`*`})]}),o(n,{id:h,name:_,value:v.value??``,"aria-invalid":S,placeholder:u,rows:p,disabled:m||x,onBlur:y,onChange:C}),S&&o(r,{errors:v.meta.errors})]})};export{l as SimpleTextareaField};
+//# sourceMappingURL=simple-textarea-field-BiuHXtqj.mjs.map

package/dist/{simple-textarea-field-BiaAbLgT.mjs.map → simple-textarea-field-BiuHXtqj.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-textarea-field-BiaAbLgT.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-textarea-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Textarea } from '@/components/ui/textarea';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  maxLength?: number;\n  rows?: number;\n  disabled?: boolean;\n};\n\nexport const SimpleTextareaField: React.FC<Props> = ({ label, placeholder, required, maxLength, rows, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLTextAreaElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Textarea\n        id={id}\n        name={name}\n        value={state.value ?? ''}\n        aria-invalid={_invalid}\n        placeholder={placeholder}\n        rows={rows}\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onChange={onChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"wUAqBA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,YAAW,OAAM,cAAe,CACnH,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAW,GACd,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CACM,KACE,OACN,MAAO,EAAM,OAAS,GACtB,eAAc,EACD,cACP,OACN,SAAU,GAAY,EACtB,OAAQ,EACE,UACX,CAAA,EACA,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-textarea-field-BiuHXtqj.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-textarea-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Textarea } from '@/components/ui/textarea';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  maxLength?: number;\n  rows?: number;\n  disabled?: boolean;\n};\n\nexport const SimpleTextareaField: React.FC<Props> = ({ label, placeholder, required, maxLength, rows, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLTextAreaElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Textarea\n        id={id}\n        name={name}\n        value={state.value ?? ''}\n        aria-invalid={_invalid}\n        placeholder={placeholder}\n        rows={rows}\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onChange={onChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"wUAqBA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,YAAW,OAAM,cAAe,CACnH,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEzF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,EAAW,GACd,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACG,GACC,EAAC,EAAD,CAAO,QAAS,WAAhB,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,IAET,EAAC,EAAD,CACM,KACE,OACN,MAAO,EAAM,OAAS,GACtB,eAAc,EACD,cACP,OACN,SAAU,GAAY,EACtB,OAAQ,EACE,UACX,CAAA,EACA,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{simple-textarea-field--FWXqgy7.cjs → simple-textarea-field-vGYOegPj.cjs}

@@ -1,2 +1,2 @@
-const e=require("./tanstack-form-DU-ZKXxZ.cjs"),t=require("./ui/label.cjs"),n=require("./ui/textarea.cjs"),r=require("./field-BV5twmKA.cjs");let i=require("react"),a=require("react/jsx-runtime"),o=require("@tanstack/react-form");const s=({label:s,placeholder:c,required:l,maxLength:u,rows:d,disabled:f})=>{let p=(0,i.useId)(),{form:m,name:h,state:g,handleBlur:_,handleChange:v}=e.G(),y=(0,o.useStore)(m.store,({isSubmitting:e})=>e),b=g.meta.isTouched&&!g.meta.isValid,x=(0,i.useCallback)(({target:{value:e}})=>{y||u&&e.length>u||v(e||null)},[y,u,v]);return(0,a.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[s&&(0,a.jsxs)(t.Label,{htmlFor:p,children:[s,l&&(0,a.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,a.jsx)(n.Textarea,{id:p,name:h,value:g.value??``,"aria-invalid":b,placeholder:c,rows:d,disabled:f||y,onBlur:_,onChange:x}),b&&(0,a.jsx)(r.FieldError,{errors:g.meta.errors})]})};exports.SimpleTextareaField=s;
-//# sourceMappingURL=simple-textarea-field--FWXqgy7.cjs.map
+const e=require("./tanstack-form-CX3lC3mC.cjs"),t=require("./ui/label.cjs"),n=require("./ui/textarea.cjs"),r=require("./field-BSLi-P0Q.cjs");let i=require("react"),a=require("react/jsx-runtime"),o=require("@tanstack/react-form");const s=({label:s,placeholder:c,required:l,maxLength:u,rows:d,disabled:f})=>{let p=(0,i.useId)(),{form:m,name:h,state:g,handleBlur:_,handleChange:v}=e.G(),y=(0,o.useStore)(m.store,({isSubmitting:e})=>e),b=g.meta.isTouched&&!g.meta.isValid,x=(0,i.useCallback)(({target:{value:e}})=>{y||u&&e.length>u||v(e||null)},[y,u,v]);return(0,a.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[s&&(0,a.jsxs)(t.Label,{htmlFor:p,children:[s,l&&(0,a.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,a.jsx)(n.Textarea,{id:p,name:h,value:g.value??``,"aria-invalid":b,placeholder:c,rows:d,disabled:f||y,onBlur:_,onChange:x}),b&&(0,a.jsx)(r.FieldError,{errors:g.meta.errors})]})};exports.SimpleTextareaField=s;
+//# sourceMappingURL=simple-textarea-field-vGYOegPj.cjs.map

package/dist/{simple-textarea-field--FWXqgy7.cjs.map → simple-textarea-field-vGYOegPj.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"simple-textarea-field--FWXqgy7.cjs","names":["useTanStackFieldContext","Label","Textarea","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-textarea-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Textarea } from '@/components/ui/textarea';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  maxLength?: number;\n  rows?: number;\n  disabled?: boolean;\n};\n\nexport const SimpleTextareaField: React.FC<Props> = ({ label, placeholder, required, maxLength, rows, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLTextAreaElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Textarea\n        id={id}\n        name={name}\n        value={state.value ?? ''}\n        aria-invalid={_invalid}\n        placeholder={placeholder}\n        rows={rows}\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onChange={onChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"qOAqBA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,YAAW,OAAM,cAAe,CACnH,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,EACH,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,IAAA,CAACC,EAAAA,SAAD,CACM,KACE,OACN,MAAO,EAAM,OAAS,GACtB,eAAc,EACD,cACP,OACN,SAAU,GAAY,EACtB,OAAQ,EACE,UACX,CAAA,EACA,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
+{"version":3,"file":"simple-textarea-field-vGYOegPj.cjs","names":["useTanStackFieldContext","Label","Textarea","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-textarea-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Textarea } from '@/components/ui/textarea';\nimport { Label } from '@/components/ui/label';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n  label?: string;\n  placeholder?: string;\n  required?: boolean;\n  maxLength?: number;\n  rows?: number;\n  disabled?: boolean;\n};\n\nexport const SimpleTextareaField: React.FC<Props> = ({ label, placeholder, required, maxLength, rows, disabled }) => {\n  const id = useId();\n  const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n  const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n  const _invalid = state.meta.isTouched && !state.meta.isValid;\n\n  const onChange = useCallback<React.ChangeEventHandler<HTMLTextAreaElement>>(\n    ({ target: { value } }) => {\n      if (isSubmitting) return;\n      if (maxLength && value.length > maxLength) return;\n      handleChange(value || null);\n    },\n    [isSubmitting, maxLength, handleChange]\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1.5\">\n      {label && (\n        <Label htmlFor={id}>\n          {label}\n          {required && <span className=\"text-danger-strong\">*</span>}\n        </Label>\n      )}\n      <Textarea\n        id={id}\n        name={name}\n        value={state.value ?? ''}\n        aria-invalid={_invalid}\n        placeholder={placeholder}\n        rows={rows}\n        disabled={disabled || isSubmitting}\n        onBlur={handleBlur}\n        onChange={onChange}\n      />\n      {_invalid && <FieldError errors={state.meta.errors} />}\n    </div>\n  );\n};\n"],"mappings":"qOAqBA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,YAAW,OAAM,cAAe,CACnH,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAuC,EAEzF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAE/C,GAAA,EAAA,EAAA,YAAA,EACH,CAAE,OAAQ,CAAE,YAAc,CACrB,GACA,GAAa,EAAM,OAAS,GAChC,EAAa,GAAS,IAAI,CAC5B,EACA,CAAC,EAAc,EAAW,CAAY,CACxC,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,CACG,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,IAAA,CAACC,EAAAA,SAAD,CACM,KACE,OACN,MAAO,EAAM,OAAS,GACtB,eAAc,EACD,cACP,OACN,SAAU,GAAY,EACtB,OAAQ,EACE,UACX,CAAA,EACA,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}

package/dist/{switch-field-aaA3hplb.mjs → switch-field-BVgtm94W.mjs}

@@ -1,2 +1,2 @@
-import{G as e}from"./tanstack-form-B6mzOylW.mjs";import{Field as t,FieldContent as n,FieldDescription as r,FieldGroup as i,FieldNote as a,FieldSeparator as o,FieldTitle as s}from"./field-BKyUqvzh.mjs";import{cn as c}from"@customafk/react-toolkit/utils";import{jsx as l,jsxs as u}from"react/jsx-runtime";import{Switch as d}from"radix-ui";function f({className:e,...t}){return l(d.Root,{"data-slot":`switch`,className:c(`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:l(d.Thumb,{"data-slot":`switch-thumb`,className:c(`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 p=({label:c,description:d,helperText:p})=>{let m=e();return u(i,{className:`gap-y-4 px-4`,children:[u(t,{orientation:`vertical`,className:`relative justify-between gap-y-1`,children:[u(n,{children:[l(s,{className:`cursor-pointer`,children:l(`label`,{htmlFor:m.name,children:c})}),l(r,{children:d}),l(f,{id:m.name,checked:m.state.value??!1,className:`absolute top-1 right-1`,onBlur:m.handleBlur,onCheckedChange:m.handleChange})]}),l(a,{isShow:!!p,children:p})]}),l(o,{})]})};export{p as SwitchField};
-//# sourceMappingURL=switch-field-aaA3hplb.mjs.map
+import{G as e}from"./tanstack-form-CKAWexet.mjs";import{Field as t,FieldContent as n,FieldDescription as r,FieldGroup as i,FieldNote as a,FieldSeparator as o,FieldTitle as s}from"./field-V2DoD8qL.mjs";import{cn as c}from"@customafk/react-toolkit/utils";import{jsx as l,jsxs as u}from"react/jsx-runtime";import{Switch as d}from"radix-ui";function f({className:e,...t}){return l(d.Root,{"data-slot":`switch`,className:c(`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:l(d.Thumb,{"data-slot":`switch-thumb`,className:c(`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 p=({label:c,description:d,helperText:p})=>{let m=e();return u(i,{className:`gap-y-4 px-4`,children:[u(t,{orientation:`vertical`,className:`relative justify-between gap-y-1`,children:[u(n,{children:[l(s,{className:`cursor-pointer`,children:l(`label`,{htmlFor:m.name,children:c})}),l(r,{children:d}),l(f,{id:m.name,checked:m.state.value??!1,className:`absolute top-1 right-1`,onBlur:m.handleBlur,onCheckedChange:m.handleChange})]}),l(a,{isShow:!!p,children:p})]}),l(o,{})]})};export{p as SwitchField};
+//# sourceMappingURL=switch-field-BVgtm94W.mjs.map

package/dist/{switch-field-aaA3hplb.mjs.map → switch-field-BVgtm94W.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"switch-field-aaA3hplb.mjs","names":["Switch","SwitchPrimitive","Switch"],"sources":["../packages/components/features/tanstack-form/components/ui/switch.tsx","../packages/components/features/tanstack-form/components/fields/switch-field.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Switch as SwitchPrimitive } from 'radix-ui';\n\n/**\n * Accessible toggle switch built on Radix UI, styled with primary-color checked state and smooth thumb transition.\n *\n * @example\n * import { Switch } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <Switch defaultChecked onCheckedChange={(checked) => console.log(checked)} />\n */\nfunction Switch({ className, ...props }: React.ComponentProps<typeof SwitchPrimitive.Root>) {\n  return (\n    <SwitchPrimitive.Root\n      data-slot=\"switch\"\n      className={cn(\n        'peer',\n        'w-8 shrink-0 cursor-pointer items-center rounded-full shadow-xs transition-all',\n        'inline-flex h-5',\n        'focus-visible:border-primary-strong',\n        'focus-visible:ring-primary-weak',\n        'focus-visible:ring-4',\n        'disabled:cursor-not-allowed',\n        'disabled:opacity-50',\n\n        '-outline-offset-1 inset-shadow-2xs outline-1',\n\n        'data-[state=checked]:bg-primary',\n        'data-[state=checked]:outline-primary-strong',\n\n        'data-[state=unchecked]:bg-muted-weak',\n        'data-[state=unchecked]:outline-border',\n\n        'data-[state=unchecked]:[&_span]:size-4',\n        'data-[state=unchecked]:[&_span]:translate-x-0.5',\n        'data-[state=unchecked]:[&_span]:rtl:-translate-x-0.5',\n        className\n      )}\n      {...props}\n    >\n      <SwitchPrimitive.Thumb\n        data-slot=\"switch-thumb\"\n        className={cn(\n          'block size-4 bg-card shadow-xs',\n          'pointer-events-none rounded-full ring-0 transition-transform',\n          'data-[state=checked]:translate-x-[calc(100%-3px)]',\n          'data-[state=unchecked]:translate-x-0'\n        )}\n      />\n    </SwitchPrimitive.Root>\n  );\n}\n\nexport { Switch };\n","'use client';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { Field, FieldContent, FieldDescription, FieldGroup, FieldNote, FieldSeparator, FieldTitle } from '../ui/field';\nimport { Switch } from '../ui/switch';\n\nimport type { SwitchFieldProps as Props } from '../../types';\n\n/**\n * A TanStack Form-connected boolean toggle field rendered as a labelled switch,\n * positioned absolutely in the top-right corner of the field card.\n *\n * @example\n * import { SwitchField } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <form.Field name=\"notifications\">\n *   {() => (\n *     <SwitchField\n *       label=\"Enable notifications\"\n *       description=\"Receive email alerts for important events\"\n *       helperText=\"You can change this at any time\"\n *     />\n *   )}\n * </form.Field>\n */\nexport const SwitchField: React.FC<Props> = ({ label, description, helperText }) => {\n  const field = useTanStackFieldContext<boolean | null>();\n\n  return (\n    <FieldGroup className=\"gap-y-4 px-4\">\n      <Field orientation=\"vertical\" className=\"relative justify-between gap-y-1\">\n        <FieldContent>\n          <FieldTitle className=\"cursor-pointer\">\n            <label htmlFor={field.name}>{label}</label>\n          </FieldTitle>\n          <FieldDescription>{description}</FieldDescription>\n          <Switch\n            id={field.name}\n            checked={field.state.value ?? false}\n            className=\"absolute top-1 right-1\"\n            onBlur={field.handleBlur}\n            onCheckedChange={field.handleChange}\n          />\n        </FieldContent>\n        <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n      </Field>\n      <FieldSeparator />\n    </FieldGroup>\n  );\n};\n"],"mappings":"iVAcA,SAASA,EAAO,CAAE,YAAW,GAAG,GAA4D,CAC1F,OACE,EAACC,EAAgB,KAAjB,CACE,YAAU,SACV,UAAW,EACT,OACA,iFACA,kBACA,sCACA,kCACA,uBACA,8BACA,sBAEA,+CAEA,kCACA,8CAEA,uCACA,wCAEA,yCACA,kDACA,uDACA,CACF,EACA,GAAI,WAEJ,EAACA,EAAgB,MAAjB,CACE,YAAU,eACV,UAAW,EACT,iCACA,+DACA,oDACA,sCACF,CACD,CAAA,CACmB,CAAA,CAE1B,CC7BA,MAAa,GAAgC,CAAE,QAAO,cAAa,gBAAiB,CAClF,IAAM,EAAQ,EAAwC,EAEtD,OACE,EAAC,EAAD,CAAY,UAAU,wBAAtB,CACE,EAAC,EAAD,CAAO,YAAY,WAAW,UAAU,4CAAxC,CACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAY,UAAU,0BACpB,EAAC,QAAD,CAAO,QAAS,EAAM,cAAO,CAAa,CAAA,CAChC,CAAA,EACZ,EAAC,EAAD,CAAA,SAAmB,CAA8B,CAAA,EACjD,EAACC,EAAD,CACE,GAAI,EAAM,KACV,QAAS,EAAM,MAAM,OAAS,GAC9B,UAAU,yBACV,OAAQ,EAAM,WACd,gBAAiB,EAAM,YACxB,CAAA,CACW,CAAA,CAAA,EACd,EAAC,EAAD,CAAW,OAAQ,CAAC,CAAC,WAAa,CAAsB,CAAA,CACnD,IACP,EAAC,EAAD,CAAiB,CAAA,CACP,GAEhB"}
+{"version":3,"file":"switch-field-BVgtm94W.mjs","names":["Switch","SwitchPrimitive","Switch"],"sources":["../packages/components/features/tanstack-form/components/ui/switch.tsx","../packages/components/features/tanstack-form/components/fields/switch-field.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Switch as SwitchPrimitive } from 'radix-ui';\n\n/**\n * Accessible toggle switch built on Radix UI, styled with primary-color checked state and smooth thumb transition.\n *\n * @example\n * import { Switch } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <Switch defaultChecked onCheckedChange={(checked) => console.log(checked)} />\n */\nfunction Switch({ className, ...props }: React.ComponentProps<typeof SwitchPrimitive.Root>) {\n  return (\n    <SwitchPrimitive.Root\n      data-slot=\"switch\"\n      className={cn(\n        'peer',\n        'w-8 shrink-0 cursor-pointer items-center rounded-full shadow-xs transition-all',\n        'inline-flex h-5',\n        'focus-visible:border-primary-strong',\n        'focus-visible:ring-primary-weak',\n        'focus-visible:ring-4',\n        'disabled:cursor-not-allowed',\n        'disabled:opacity-50',\n\n        '-outline-offset-1 inset-shadow-2xs outline-1',\n\n        'data-[state=checked]:bg-primary',\n        'data-[state=checked]:outline-primary-strong',\n\n        'data-[state=unchecked]:bg-muted-weak',\n        'data-[state=unchecked]:outline-border',\n\n        'data-[state=unchecked]:[&_span]:size-4',\n        'data-[state=unchecked]:[&_span]:translate-x-0.5',\n        'data-[state=unchecked]:[&_span]:rtl:-translate-x-0.5',\n        className\n      )}\n      {...props}\n    >\n      <SwitchPrimitive.Thumb\n        data-slot=\"switch-thumb\"\n        className={cn(\n          'block size-4 bg-card shadow-xs',\n          'pointer-events-none rounded-full ring-0 transition-transform',\n          'data-[state=checked]:translate-x-[calc(100%-3px)]',\n          'data-[state=unchecked]:translate-x-0'\n        )}\n      />\n    </SwitchPrimitive.Root>\n  );\n}\n\nexport { Switch };\n","'use client';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { Field, FieldContent, FieldDescription, FieldGroup, FieldNote, FieldSeparator, FieldTitle } from '../ui/field';\nimport { Switch } from '../ui/switch';\n\nimport type { SwitchFieldProps as Props } from '../../types';\n\n/**\n * A TanStack Form-connected boolean toggle field rendered as a labelled switch,\n * positioned absolutely in the top-right corner of the field card.\n *\n * @example\n * import { SwitchField } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <form.Field name=\"notifications\">\n *   {() => (\n *     <SwitchField\n *       label=\"Enable notifications\"\n *       description=\"Receive email alerts for important events\"\n *       helperText=\"You can change this at any time\"\n *     />\n *   )}\n * </form.Field>\n */\nexport const SwitchField: React.FC<Props> = ({ label, description, helperText }) => {\n  const field = useTanStackFieldContext<boolean | null>();\n\n  return (\n    <FieldGroup className=\"gap-y-4 px-4\">\n      <Field orientation=\"vertical\" className=\"relative justify-between gap-y-1\">\n        <FieldContent>\n          <FieldTitle className=\"cursor-pointer\">\n            <label htmlFor={field.name}>{label}</label>\n          </FieldTitle>\n          <FieldDescription>{description}</FieldDescription>\n          <Switch\n            id={field.name}\n            checked={field.state.value ?? false}\n            className=\"absolute top-1 right-1\"\n            onBlur={field.handleBlur}\n            onCheckedChange={field.handleChange}\n          />\n        </FieldContent>\n        <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n      </Field>\n      <FieldSeparator />\n    </FieldGroup>\n  );\n};\n"],"mappings":"iVAcA,SAASA,EAAO,CAAE,YAAW,GAAG,GAA4D,CAC1F,OACE,EAACC,EAAgB,KAAjB,CACE,YAAU,SACV,UAAW,EACT,OACA,iFACA,kBACA,sCACA,kCACA,uBACA,8BACA,sBAEA,+CAEA,kCACA,8CAEA,uCACA,wCAEA,yCACA,kDACA,uDACA,CACF,EACA,GAAI,WAEJ,EAACA,EAAgB,MAAjB,CACE,YAAU,eACV,UAAW,EACT,iCACA,+DACA,oDACA,sCACF,CACD,CAAA,CACmB,CAAA,CAE1B,CC7BA,MAAa,GAAgC,CAAE,QAAO,cAAa,gBAAiB,CAClF,IAAM,EAAQ,EAAwC,EAEtD,OACE,EAAC,EAAD,CAAY,UAAU,wBAAtB,CACE,EAAC,EAAD,CAAO,YAAY,WAAW,UAAU,4CAAxC,CACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAY,UAAU,0BACpB,EAAC,QAAD,CAAO,QAAS,EAAM,cAAO,CAAa,CAAA,CAChC,CAAA,EACZ,EAAC,EAAD,CAAA,SAAmB,CAA8B,CAAA,EACjD,EAACC,EAAD,CACE,GAAI,EAAM,KACV,QAAS,EAAM,MAAM,OAAS,GAC9B,UAAU,yBACV,OAAQ,EAAM,WACd,gBAAiB,EAAM,YACxB,CAAA,CACW,CAAA,CAAA,EACd,EAAC,EAAD,CAAW,OAAQ,CAAC,CAAC,WAAa,CAAsB,CAAA,CACnD,IACP,EAAC,EAAD,CAAiB,CAAA,CACP,GAEhB"}

package/dist/{switch-field-BS8XStmz.cjs → switch-field-DPB3JDT3.cjs}

@@ -1,2 +1,2 @@
-const e=require("./tanstack-form-DU-ZKXxZ.cjs"),t=require("./field-BV5twmKA.cjs");let n=require("@customafk/react-toolkit/utils"),r=require("react/jsx-runtime"),i=require("radix-ui");function a({className:e,...t}){return(0,r.jsx)(i.Switch.Root,{"data-slot":`switch`,className:(0,n.cn)(`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:(0,r.jsx)(i.Switch.Thumb,{"data-slot":`switch-thumb`,className:(0,n.cn)(`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 o=({label:n,description:i,helperText:o})=>{let s=e.G();return(0,r.jsxs)(t.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,r.jsxs)(t.Field,{orientation:`vertical`,className:`relative justify-between gap-y-1`,children:[(0,r.jsxs)(t.FieldContent,{children:[(0,r.jsx)(t.FieldTitle,{className:`cursor-pointer`,children:(0,r.jsx)(`label`,{htmlFor:s.name,children:n})}),(0,r.jsx)(t.FieldDescription,{children:i}),(0,r.jsx)(a,{id:s.name,checked:s.state.value??!1,className:`absolute top-1 right-1`,onBlur:s.handleBlur,onCheckedChange:s.handleChange})]}),(0,r.jsx)(t.FieldNote,{isShow:!!o,children:o})]}),(0,r.jsx)(t.FieldSeparator,{})]})};exports.SwitchField=o;
-//# sourceMappingURL=switch-field-BS8XStmz.cjs.map
+const e=require("./tanstack-form-CX3lC3mC.cjs"),t=require("./field-BSLi-P0Q.cjs");let n=require("@customafk/react-toolkit/utils"),r=require("react/jsx-runtime"),i=require("radix-ui");function a({className:e,...t}){return(0,r.jsx)(i.Switch.Root,{"data-slot":`switch`,className:(0,n.cn)(`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:(0,r.jsx)(i.Switch.Thumb,{"data-slot":`switch-thumb`,className:(0,n.cn)(`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 o=({label:n,description:i,helperText:o})=>{let s=e.G();return(0,r.jsxs)(t.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,r.jsxs)(t.Field,{orientation:`vertical`,className:`relative justify-between gap-y-1`,children:[(0,r.jsxs)(t.FieldContent,{children:[(0,r.jsx)(t.FieldTitle,{className:`cursor-pointer`,children:(0,r.jsx)(`label`,{htmlFor:s.name,children:n})}),(0,r.jsx)(t.FieldDescription,{children:i}),(0,r.jsx)(a,{id:s.name,checked:s.state.value??!1,className:`absolute top-1 right-1`,onBlur:s.handleBlur,onCheckedChange:s.handleChange})]}),(0,r.jsx)(t.FieldNote,{isShow:!!o,children:o})]}),(0,r.jsx)(t.FieldSeparator,{})]})};exports.SwitchField=o;
+//# sourceMappingURL=switch-field-DPB3JDT3.cjs.map