@customafk/lunas-ui 0.2.73 → 0.2.74

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (169) hide show
  1. package/dist/{action-submit-C19tPHgf.cjs → action-submit-DI590CG3.cjs} +2 -2
  2. package/dist/{action-submit-C19tPHgf.cjs.map → action-submit-DI590CG3.cjs.map} +1 -1
  3. package/dist/{action-submit-cOfq0OSY.mjs → action-submit-ScN29AQ1.mjs} +2 -2
  4. package/dist/{action-submit-cOfq0OSY.mjs.map → action-submit-ScN29AQ1.mjs.map} +1 -1
  5. package/dist/{actions-form-3ItwYOFj.cjs → actions-form-CNW4nhAP.cjs} +2 -2
  6. package/dist/{actions-form-3ItwYOFj.cjs.map → actions-form-CNW4nhAP.cjs.map} +1 -1
  7. package/dist/{actions-form-DxbT1lip.mjs → actions-form-f8sejItb.mjs} +2 -2
  8. package/dist/{actions-form-DxbT1lip.mjs.map → actions-form-f8sejItb.mjs.map} +1 -1
  9. package/dist/{button-Bk4Y6_9I.d.cts → button-CKRN3ZQT.d.cts} +2 -2
  10. package/dist/{button-Bk4Y6_9I.d.mts → button-CKRN3ZQT.d.mts} +2 -2
  11. package/dist/{calendar-DPKt7D3w.d.mts → calendar-CIhMEz65.d.mts} +2 -2
  12. package/dist/{calendar-stv2bJv0.d.cts → calendar-DJdVw-yD.d.cts} +2 -2
  13. package/dist/{carousel-CV3IZ96x.d.mts → carousel-BniJSLfd.d.mts} +2 -2
  14. package/dist/{carousel-c2XuzmYN.d.cts → carousel-D4--8HfP.d.cts} +2 -2
  15. package/dist/{checkbox-field-BRqU_dYY.cjs → checkbox-field-Ck_VADFe.cjs} +2 -2
  16. package/dist/{checkbox-field-BRqU_dYY.cjs.map → checkbox-field-Ck_VADFe.cjs.map} +1 -1
  17. package/dist/{checkbox-field-BAQN-Yno.mjs → checkbox-field-Csro0Nla.mjs} +2 -2
  18. package/dist/{checkbox-field-BAQN-Yno.mjs.map → checkbox-field-Csro0Nla.mjs.map} +1 -1
  19. package/dist/{combobox-field-yvQPJSFC.mjs → combobox-field-BMfA_taQ.mjs} +2 -2
  20. package/dist/{combobox-field-yvQPJSFC.mjs.map → combobox-field-BMfA_taQ.mjs.map} +1 -1
  21. package/dist/{combobox-field-DnCpN--a.cjs → combobox-field-Bxrct4lA.cjs} +2 -2
  22. package/dist/{combobox-field-DnCpN--a.cjs.map → combobox-field-Bxrct4lA.cjs.map} +1 -1
  23. package/dist/{date-field-DLsJBYw8.cjs → date-field-Ba6O0uV3.cjs} +2 -2
  24. package/dist/{date-field-DLsJBYw8.cjs.map → date-field-Ba6O0uV3.cjs.map} +1 -1
  25. package/dist/{date-field-O67C78Kw.mjs → date-field-DUx13OiJ.mjs} +2 -2
  26. package/dist/{date-field-O67C78Kw.mjs.map → date-field-DUx13OiJ.mjs.map} +1 -1
  27. package/dist/{dialog-form-ClTCyJDD.cjs → dialog-form-B_kgYxZg.cjs} +2 -2
  28. package/dist/{dialog-form-ClTCyJDD.cjs.map → dialog-form-B_kgYxZg.cjs.map} +1 -1
  29. package/dist/{dialog-form-BxlLrEeZ.mjs → dialog-form-SyBJUlDB.mjs} +2 -2
  30. package/dist/{dialog-form-BxlLrEeZ.mjs.map → dialog-form-SyBJUlDB.mjs.map} +1 -1
  31. package/dist/dialogs/detail-dialog/components/sidebar.d.cts +2 -2
  32. package/dist/dialogs/detail-dialog/components/sidebar.d.mts +2 -2
  33. package/dist/{email-field-DqEDxkp7.mjs → email-field-BGYZUVl0.mjs} +2 -2
  34. package/dist/{email-field-DqEDxkp7.mjs.map → email-field-BGYZUVl0.mjs.map} +1 -1
  35. package/dist/{email-field-DZzkfVj5.cjs → email-field-CO_BZHod.cjs} +2 -2
  36. package/dist/{email-field-DZzkfVj5.cjs.map → email-field-CO_BZHod.cjs.map} +1 -1
  37. package/dist/features/tanstack-form/index.cjs +1 -1
  38. package/dist/features/tanstack-form/index.mjs +1 -1
  39. package/dist/features/text-editor/index.cjs +1 -1
  40. package/dist/features/text-editor/index.d.cts +1 -1
  41. package/dist/features/text-editor/index.d.mts +1 -1
  42. package/dist/features/text-editor/index.mjs +1 -1
  43. package/dist/{flex-CT71VV-I.d.cts → flex-bw7U4hXn.d.cts} +2 -2
  44. package/dist/{flex-CT71VV-I.d.mts → flex-bw7U4hXn.d.mts} +2 -2
  45. package/dist/{index-D9bKlLiM.d.cts → index-DOaKN0wJ.d.cts} +22 -2
  46. package/dist/{index-D9bKlLiM.d.mts → index-DOaKN0wJ.d.mts} +22 -2
  47. package/dist/index.cjs +1 -1
  48. package/dist/index.d.cts +9 -9
  49. package/dist/index.d.mts +9 -9
  50. package/dist/index.mjs +1 -1
  51. package/dist/{item-DTR2f2CX.d.cts → item-B2JsbfYJ.d.cts} +2 -2
  52. package/dist/{item-cIhkI3ZI.d.mts → item-DCYlZYdc.d.mts} +2 -2
  53. package/dist/layouts/flex.d.cts +1 -1
  54. package/dist/layouts/flex.d.mts +1 -1
  55. package/dist/{number-field-Cx-1U_Np.mjs → number-field-B89VeU2r.mjs} +2 -2
  56. package/dist/{number-field-Cx-1U_Np.mjs.map → number-field-B89VeU2r.mjs.map} +1 -1
  57. package/dist/{number-field-BTLobx1F.cjs → number-field-C7iEv5GJ.cjs} +2 -2
  58. package/dist/{number-field-BTLobx1F.cjs.map → number-field-C7iEv5GJ.cjs.map} +1 -1
  59. package/dist/{pagination-B2fyP0J2.d.cts → pagination-B03e1b6x.d.mts} +2 -2
  60. package/dist/{pagination-DY0PBCnI.d.mts → pagination-Dw23nKW-.d.cts} +2 -2
  61. package/dist/{password-field-CuBcb4mi.cjs → password-field-9RZ84TNz.cjs} +2 -2
  62. package/dist/{password-field-CuBcb4mi.cjs.map → password-field-9RZ84TNz.cjs.map} +1 -1
  63. package/dist/{password-field-CGPjZ5hZ.mjs → password-field-pqUgUcgf.mjs} +2 -2
  64. package/dist/{password-field-CGPjZ5hZ.mjs.map → password-field-pqUgUcgf.mjs.map} +1 -1
  65. package/dist/{popover-form-DVJUQ3_T.mjs → popover-form-BmOqFjQM.mjs} +2 -2
  66. package/dist/{popover-form-DVJUQ3_T.mjs.map → popover-form-BmOqFjQM.mjs.map} +1 -1
  67. package/dist/{popover-form-DzvgWQ2Q.cjs → popover-form-CLr6xIl5.cjs} +2 -2
  68. package/dist/{popover-form-DzvgWQ2Q.cjs.map → popover-form-CLr6xIl5.cjs.map} +1 -1
  69. package/dist/{radio-group-field-GiEbZRkS.cjs → radio-group-field-Bm2nkk1W.cjs} +2 -2
  70. package/dist/{radio-group-field-GiEbZRkS.cjs.map → radio-group-field-Bm2nkk1W.cjs.map} +1 -1
  71. package/dist/{radio-group-field-C45y9BQt.mjs → radio-group-field-DsUi8uCy.mjs} +2 -2
  72. package/dist/{radio-group-field-C45y9BQt.mjs.map → radio-group-field-DsUi8uCy.mjs.map} +1 -1
  73. package/dist/{select-field-Cd63KvgR.cjs → select-field-F9eikYws.cjs} +2 -2
  74. package/dist/{select-field-Cd63KvgR.cjs.map → select-field-F9eikYws.cjs.map} +1 -1
  75. package/dist/{select-field-y3Zttb4j.mjs → select-field-ikKFoatc.mjs} +2 -2
  76. package/dist/{select-field-y3Zttb4j.mjs.map → select-field-ikKFoatc.mjs.map} +1 -1
  77. package/dist/{simple-array-field-BODzA766.cjs → simple-array-field-Bm_5b8pE.cjs} +2 -2
  78. package/dist/{simple-array-field-BODzA766.cjs.map → simple-array-field-Bm_5b8pE.cjs.map} +1 -1
  79. package/dist/{simple-array-field-DI_56dVs.mjs → simple-array-field-CeqZJfVs.mjs} +2 -2
  80. package/dist/{simple-array-field-DI_56dVs.mjs.map → simple-array-field-CeqZJfVs.mjs.map} +1 -1
  81. package/dist/{simple-boolean-field-BjnIh9Mq.cjs → simple-boolean-field-BeL9WjD5.cjs} +2 -2
  82. package/dist/{simple-boolean-field-BjnIh9Mq.cjs.map → simple-boolean-field-BeL9WjD5.cjs.map} +1 -1
  83. package/dist/{simple-boolean-field-oP5yJDQL.mjs → simple-boolean-field-DZ0J-Pk0.mjs} +2 -2
  84. package/dist/{simple-boolean-field-oP5yJDQL.mjs.map → simple-boolean-field-DZ0J-Pk0.mjs.map} +1 -1
  85. package/dist/{simple-combobox-field-Bd-xk5kC.mjs → simple-combobox-field-BQXmNATZ.mjs} +2 -2
  86. package/dist/{simple-combobox-field-Bd-xk5kC.mjs.map → simple-combobox-field-BQXmNATZ.mjs.map} +1 -1
  87. package/dist/{simple-combobox-field-Dgicw0VN.cjs → simple-combobox-field-CeV40wnv.cjs} +2 -2
  88. package/dist/{simple-combobox-field-Dgicw0VN.cjs.map → simple-combobox-field-CeV40wnv.cjs.map} +1 -1
  89. package/dist/{simple-date-field-hORsbXHE.cjs → simple-date-field-CrH-92i4.cjs} +2 -2
  90. package/dist/{simple-date-field-hORsbXHE.cjs.map → simple-date-field-CrH-92i4.cjs.map} +1 -1
  91. package/dist/{simple-date-field-DE5Z-Zkc.mjs → simple-date-field-D9ymav2L.mjs} +2 -2
  92. package/dist/{simple-date-field-DE5Z-Zkc.mjs.map → simple-date-field-D9ymav2L.mjs.map} +1 -1
  93. package/dist/{simple-email-field-CFbpYis_.mjs → simple-email-field-8IiVOYa-.mjs} +2 -2
  94. package/dist/{simple-email-field-CFbpYis_.mjs.map → simple-email-field-8IiVOYa-.mjs.map} +1 -1
  95. package/dist/{simple-email-field-DpuMlzxg.cjs → simple-email-field-CsMmMSvS.cjs} +2 -2
  96. package/dist/{simple-email-field-DpuMlzxg.cjs.map → simple-email-field-CsMmMSvS.cjs.map} +1 -1
  97. package/dist/{simple-number-field-BY0b4BJp.mjs → simple-number-field-C6hE1Qlj.mjs} +2 -2
  98. package/dist/{simple-number-field-BY0b4BJp.mjs.map → simple-number-field-C6hE1Qlj.mjs.map} +1 -1
  99. package/dist/{simple-number-field-C4y4rQcw.cjs → simple-number-field-CrU2A2yp.cjs} +2 -2
  100. package/dist/{simple-number-field-C4y4rQcw.cjs.map → simple-number-field-CrU2A2yp.cjs.map} +1 -1
  101. package/dist/{simple-password-field-CA0FuETK.mjs → simple-password-field-CabyA9Y7.mjs} +2 -2
  102. package/dist/{simple-password-field-CA0FuETK.mjs.map → simple-password-field-CabyA9Y7.mjs.map} +1 -1
  103. package/dist/{simple-password-field-BUzKJ0fu.cjs → simple-password-field-DWmUR_5_.cjs} +2 -2
  104. package/dist/{simple-password-field-BUzKJ0fu.cjs.map → simple-password-field-DWmUR_5_.cjs.map} +1 -1
  105. package/dist/{simple-radio-group-field-BM7HBTSs.mjs → simple-radio-group-field-BNFgrTSb.mjs} +2 -2
  106. package/dist/{simple-radio-group-field-BM7HBTSs.mjs.map → simple-radio-group-field-BNFgrTSb.mjs.map} +1 -1
  107. package/dist/{simple-radio-group-field-CCxUaYom.cjs → simple-radio-group-field-CpTX_Xoy.cjs} +2 -2
  108. package/dist/{simple-radio-group-field-CCxUaYom.cjs.map → simple-radio-group-field-CpTX_Xoy.cjs.map} +1 -1
  109. package/dist/{simple-select-field-CeTVQwmP.mjs → simple-select-field-CiUfRHCo.mjs} +2 -2
  110. package/dist/{simple-select-field-CeTVQwmP.mjs.map → simple-select-field-CiUfRHCo.mjs.map} +1 -1
  111. package/dist/{simple-select-field-CzN4Xb7n.cjs → simple-select-field-VibM3I3D.cjs} +2 -2
  112. package/dist/{simple-select-field-CzN4Xb7n.cjs.map → simple-select-field-VibM3I3D.cjs.map} +1 -1
  113. package/dist/{simple-text-field-CDsgWUFD.mjs → simple-text-field-Cmmmci4R.mjs} +2 -2
  114. package/dist/{simple-text-field-CDsgWUFD.mjs.map → simple-text-field-Cmmmci4R.mjs.map} +1 -1
  115. package/dist/{simple-text-field-DGZL0gML.cjs → simple-text-field-DRlcBB-3.cjs} +2 -2
  116. package/dist/{simple-text-field-DGZL0gML.cjs.map → simple-text-field-DRlcBB-3.cjs.map} +1 -1
  117. package/dist/{simple-textarea-field-vGYOegPj.cjs → simple-textarea-field-B0fOG7nh.cjs} +2 -2
  118. package/dist/{simple-textarea-field-vGYOegPj.cjs.map → simple-textarea-field-B0fOG7nh.cjs.map} +1 -1
  119. package/dist/{simple-textarea-field-BiuHXtqj.mjs → simple-textarea-field-BDqw8ewE.mjs} +2 -2
  120. package/dist/{simple-textarea-field-BiuHXtqj.mjs.map → simple-textarea-field-BDqw8ewE.mjs.map} +1 -1
  121. package/dist/{switch-field-BVgtm94W.mjs → switch-field-BDVIJ21m.mjs} +2 -2
  122. package/dist/{switch-field-BVgtm94W.mjs.map → switch-field-BDVIJ21m.mjs.map} +1 -1
  123. package/dist/{switch-field-DPB3JDT3.cjs → switch-field-D6CCxaEX.cjs} +2 -2
  124. package/dist/{switch-field-DPB3JDT3.cjs.map → switch-field-D6CCxaEX.cjs.map} +1 -1
  125. package/dist/{tanstack-form-CKAWexet.mjs → tanstack-form-AGwPfwiM.mjs} +2 -2
  126. package/dist/{tanstack-form-CKAWexet.mjs.map → tanstack-form-AGwPfwiM.mjs.map} +1 -1
  127. package/dist/{tanstack-form-CX3lC3mC.cjs → tanstack-form-Bae0TOEr.cjs} +2 -2
  128. package/dist/{tanstack-form-CX3lC3mC.cjs.map → tanstack-form-Bae0TOEr.cjs.map} +1 -1
  129. package/dist/text-editor-BQtIXOpM.mjs +2 -0
  130. package/dist/text-editor-BQtIXOpM.mjs.map +1 -0
  131. package/dist/text-editor-DJYQXXtP.cjs +2 -0
  132. package/dist/text-editor-DJYQXXtP.cjs.map +1 -0
  133. package/dist/{text-editor-field-qa3t2GBg.mjs → text-editor-field-C2KDtfZV.mjs} +2 -2
  134. package/dist/{text-editor-field-qa3t2GBg.mjs.map → text-editor-field-C2KDtfZV.mjs.map} +1 -1
  135. package/dist/{text-editor-field-Ddvgdo_p.cjs → text-editor-field-DF8lkOc_.cjs} +2 -2
  136. package/dist/{text-editor-field-Ddvgdo_p.cjs.map → text-editor-field-DF8lkOc_.cjs.map} +1 -1
  137. package/dist/{text-field-Cwu0xuXt.cjs → text-field-B1n5Xd-k.cjs} +2 -2
  138. package/dist/{text-field-Cwu0xuXt.cjs.map → text-field-B1n5Xd-k.cjs.map} +1 -1
  139. package/dist/{text-field-CBUTZKGH.mjs → text-field-BJciq-S8.mjs} +2 -2
  140. package/dist/{text-field-CBUTZKGH.mjs.map → text-field-BJciq-S8.mjs.map} +1 -1
  141. package/dist/{textarea-field-Ctj5o5my.mjs → textarea-field-BjdX2Qjt.mjs} +2 -2
  142. package/dist/{textarea-field-Ctj5o5my.mjs.map → textarea-field-BjdX2Qjt.mjs.map} +1 -1
  143. package/dist/{textarea-field-jOqHJcAL.cjs → textarea-field-Bm7bsyjB.cjs} +2 -2
  144. package/dist/{textarea-field-jOqHJcAL.cjs.map → textarea-field-Bm7bsyjB.cjs.map} +1 -1
  145. package/dist/{toggle-Bh4EazxT.d.mts → toggle-Bk5Lvs5n.d.cts} +2 -2
  146. package/dist/{toggle-Bh4EazxT.d.cts → toggle-Bk5Lvs5n.d.mts} +2 -2
  147. package/dist/{toggle-group-BpqkL1ds.d.cts → toggle-group-7ZP2e-K1.d.mts} +2 -2
  148. package/dist/{toggle-group-DzNE38v5.d.mts → toggle-group-B0pu4YV-.d.cts} +2 -2
  149. package/dist/ui/button.d.cts +1 -1
  150. package/dist/ui/button.d.mts +1 -1
  151. package/dist/ui/calendar.d.cts +1 -1
  152. package/dist/ui/calendar.d.mts +1 -1
  153. package/dist/ui/carousel.d.cts +1 -1
  154. package/dist/ui/carousel.d.mts +1 -1
  155. package/dist/ui/item.d.cts +1 -1
  156. package/dist/ui/item.d.mts +1 -1
  157. package/dist/ui/pagination.d.cts +1 -1
  158. package/dist/ui/pagination.d.mts +1 -1
  159. package/dist/ui/status.d.cts +1 -1
  160. package/dist/ui/status.d.mts +1 -1
  161. package/dist/ui/toggle-group.d.cts +1 -1
  162. package/dist/ui/toggle-group.d.mts +1 -1
  163. package/dist/ui/toggle.d.cts +1 -1
  164. package/dist/ui/toggle.d.mts +1 -1
  165. package/package.json +1 -1
  166. package/dist/text-editor-BYE2-G5K.mjs +0 -2
  167. package/dist/text-editor-BYE2-G5K.mjs.map +0 -1
  168. package/dist/text-editor-CfQk5dIx.cjs +0 -2
  169. package/dist/text-editor-CfQk5dIx.cjs.map +0 -1
@@ -1,2 +1,2 @@
1
- const e=require("./ui/checkbox.cjs"),t=require("./tanstack-form-CX3lC3mC.cjs"),n=require("./ui/label.cjs"),r=require("./ui/switch.cjs"),i=require("./field-BSLi-P0Q.cjs");let a=require("react"),o=require("react/jsx-runtime"),s=require("@tanstack/react-form");const c=({label:c,required:l,disabled:u,variant:d=`checkbox`})=>{let f=(0,a.useId)(),{form:p,name:m,state:h,handleBlur:g,handleChange:_}=t.G(),v=(0,s.useStore)(p.store,({isSubmitting:e})=>e),y=h.meta.isTouched&&!h.meta.isValid,b=h.value??!1,x=u||v,S=(0,a.useCallback)(e=>{v||_(e)},[v,_]);return(0,o.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[(0,o.jsxs)(`div`,{className:`flex items-center gap-2 h-9`,children:[d===`switch`?(0,o.jsx)(r.Switch,{id:f,name:m,checked:b,disabled:x,"aria-invalid":y,onBlur:g,onCheckedChange:S}):(0,o.jsx)(e.Checkbox,{id:f,name:m,checked:b,disabled:x,"aria-invalid":y,onBlur:g,onCheckedChange:S}),c&&(0,o.jsxs)(n.Label,{htmlFor:f,className:`cursor-pointer`,children:[c,l&&(0,o.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]})]}),y&&(0,o.jsx)(i.FieldError,{errors:h.meta.errors})]})};exports.SimpleBooleanField=c;
2
- //# sourceMappingURL=simple-boolean-field-BjnIh9Mq.cjs.map
1
+ const e=require("./ui/checkbox.cjs"),t=require("./tanstack-form-Bae0TOEr.cjs"),n=require("./ui/label.cjs"),r=require("./ui/switch.cjs"),i=require("./field-BSLi-P0Q.cjs");let a=require("react"),o=require("react/jsx-runtime"),s=require("@tanstack/react-form");const c=({label:c,required:l,disabled:u,variant:d=`checkbox`})=>{let f=(0,a.useId)(),{form:p,name:m,state:h,handleBlur:g,handleChange:_}=t.G(),v=(0,s.useStore)(p.store,({isSubmitting:e})=>e),y=h.meta.isTouched&&!h.meta.isValid,b=h.value??!1,x=u||v,S=(0,a.useCallback)(e=>{v||_(e)},[v,_]);return(0,o.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[(0,o.jsxs)(`div`,{className:`flex items-center gap-2 h-9`,children:[d===`switch`?(0,o.jsx)(r.Switch,{id:f,name:m,checked:b,disabled:x,"aria-invalid":y,onBlur:g,onCheckedChange:S}):(0,o.jsx)(e.Checkbox,{id:f,name:m,checked:b,disabled:x,"aria-invalid":y,onBlur:g,onCheckedChange:S}),c&&(0,o.jsxs)(n.Label,{htmlFor:f,className:`cursor-pointer`,children:[c,l&&(0,o.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]})]}),y&&(0,o.jsx)(i.FieldError,{errors:h.meta.errors})]})};exports.SimpleBooleanField=c;
2
+ //# sourceMappingURL=simple-boolean-field-BeL9WjD5.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"simple-boolean-field-BjnIh9Mq.cjs","names":["useTanStackFieldContext","Switch","Checkbox","Label","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-boolean-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { Label } from '@/components/ui/label';\nimport { Switch } from '@/components/ui/switch';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n label?: string;\n required?: boolean;\n disabled?: boolean;\n variant?: 'checkbox' | 'switch';\n};\n\nexport const SimpleBooleanField: React.FC<Props> = ({ label, required, disabled, variant = 'checkbox' }) => {\n const id = useId();\n const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<boolean | null>();\n\n const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n const _invalid = state.meta.isTouched && !state.meta.isValid;\n const checked = state.value ?? false;\n const isDisabled = disabled || isSubmitting;\n\n const onCheckedChange = useCallback(\n (value: boolean) => {\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 <div className=\"flex items-center gap-2 h-9\">\n {variant === 'switch' ? (\n <Switch id={id} name={name} checked={checked} disabled={isDisabled} aria-invalid={_invalid} onBlur={handleBlur} onCheckedChange={onCheckedChange} />\n ) : (\n <Checkbox id={id} name={name} checked={checked} disabled={isDisabled} aria-invalid={_invalid} onBlur={handleBlur} onCheckedChange={onCheckedChange} />\n )}\n {label && (\n <Label htmlFor={id} className=\"cursor-pointer\">\n {label}\n {required && <span className=\"text-danger-strong\">*</span>}\n </Label>\n )}\n </div>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"kQAoBA,MAAa,GAAuC,CAAE,QAAO,WAAU,WAAU,UAAU,cAAiB,CAC1G,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAwC,EAE1F,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAU,EAAM,OAAS,GACzB,EAAa,GAAY,EAEzB,GAAA,EAAA,EAAA,YAAA,CACH,GAAmB,CACd,GACJ,EAAa,CAAK,CACpB,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,EACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,uCAAf,CACG,IAAY,UACX,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAD,CAAY,KAAU,OAAe,UAAS,SAAU,EAAY,eAAc,EAAU,OAAQ,EAA6B,iBAAkB,CAAA,GAEnJ,EAAA,EAAA,IAAA,CAACC,EAAAA,SAAD,CAAc,KAAU,OAAe,UAAS,SAAU,EAAY,eAAc,EAAU,OAAQ,EAA6B,iBAAkB,CAAA,EAEtJ,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,EAAI,UAAU,0BAA9B,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,GAEN,IACJ,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
1
+ {"version":3,"file":"simple-boolean-field-BeL9WjD5.cjs","names":["useTanStackFieldContext","Switch","Checkbox","Label","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-boolean-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { Label } from '@/components/ui/label';\nimport { Switch } from '@/components/ui/switch';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n label?: string;\n required?: boolean;\n disabled?: boolean;\n variant?: 'checkbox' | 'switch';\n};\n\nexport const SimpleBooleanField: React.FC<Props> = ({ label, required, disabled, variant = 'checkbox' }) => {\n const id = useId();\n const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<boolean | null>();\n\n const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n const _invalid = state.meta.isTouched && !state.meta.isValid;\n const checked = state.value ?? false;\n const isDisabled = disabled || isSubmitting;\n\n const onCheckedChange = useCallback(\n (value: boolean) => {\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 <div className=\"flex items-center gap-2 h-9\">\n {variant === 'switch' ? (\n <Switch id={id} name={name} checked={checked} disabled={isDisabled} aria-invalid={_invalid} onBlur={handleBlur} onCheckedChange={onCheckedChange} />\n ) : (\n <Checkbox id={id} name={name} checked={checked} disabled={isDisabled} aria-invalid={_invalid} onBlur={handleBlur} onCheckedChange={onCheckedChange} />\n )}\n {label && (\n <Label htmlFor={id} className=\"cursor-pointer\">\n {label}\n {required && <span className=\"text-danger-strong\">*</span>}\n </Label>\n )}\n </div>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"kQAoBA,MAAa,GAAuC,CAAE,QAAO,WAAU,WAAU,UAAU,cAAiB,CAC1G,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAwC,EAE1F,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAU,EAAM,OAAS,GACzB,EAAa,GAAY,EAEzB,GAAA,EAAA,EAAA,YAAA,CACH,GAAmB,CACd,GACJ,EAAa,CAAK,CACpB,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iCAAf,EACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,uCAAf,CACG,IAAY,UACX,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAD,CAAY,KAAU,OAAe,UAAS,SAAU,EAAY,eAAc,EAAU,OAAQ,EAA6B,iBAAkB,CAAA,GAEnJ,EAAA,EAAA,IAAA,CAACC,EAAAA,SAAD,CAAc,KAAU,OAAe,UAAS,SAAU,EAAY,eAAc,EAAU,OAAQ,EAA6B,iBAAkB,CAAA,EAEtJ,IACC,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,QAAS,EAAI,UAAU,0BAA9B,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,GAEN,IACJ,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
@@ -1,2 +1,2 @@
1
- import{Checkbox as e}from"./ui/checkbox.mjs";import{G as t}from"./tanstack-form-CKAWexet.mjs";import{Label as n}from"./ui/label.mjs";import{Switch as r}from"./ui/switch.mjs";import{FieldError as i}from"./field-V2DoD8qL.mjs";import{useCallback as a,useId as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{useStore as l}from"@tanstack/react-form";const u=({label:u,required:d,disabled:f,variant:p=`checkbox`})=>{let m=o(),{form:h,name:g,state:_,handleBlur:v,handleChange:y}=t(),b=l(h.store,({isSubmitting:e})=>e),x=_.meta.isTouched&&!_.meta.isValid,S=_.value??!1,C=f||b,w=a(e=>{b||y(e)},[b,y]);return c(`div`,{className:`flex flex-col gap-1.5`,children:[c(`div`,{className:`flex items-center gap-2 h-9`,children:[s(p===`switch`?r:e,{id:m,name:g,checked:S,disabled:C,"aria-invalid":x,onBlur:v,onCheckedChange:w}),u&&c(n,{htmlFor:m,className:`cursor-pointer`,children:[u,d&&s(`span`,{className:`text-danger-strong`,children:`*`})]})]}),x&&s(i,{errors:_.meta.errors})]})};export{u as SimpleBooleanField};
2
- //# sourceMappingURL=simple-boolean-field-oP5yJDQL.mjs.map
1
+ import{Checkbox as e}from"./ui/checkbox.mjs";import{G as t}from"./tanstack-form-AGwPfwiM.mjs";import{Label as n}from"./ui/label.mjs";import{Switch as r}from"./ui/switch.mjs";import{FieldError as i}from"./field-V2DoD8qL.mjs";import{useCallback as a,useId as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{useStore as l}from"@tanstack/react-form";const u=({label:u,required:d,disabled:f,variant:p=`checkbox`})=>{let m=o(),{form:h,name:g,state:_,handleBlur:v,handleChange:y}=t(),b=l(h.store,({isSubmitting:e})=>e),x=_.meta.isTouched&&!_.meta.isValid,S=_.value??!1,C=f||b,w=a(e=>{b||y(e)},[b,y]);return c(`div`,{className:`flex flex-col gap-1.5`,children:[c(`div`,{className:`flex items-center gap-2 h-9`,children:[s(p===`switch`?r:e,{id:m,name:g,checked:S,disabled:C,"aria-invalid":x,onBlur:v,onCheckedChange:w}),u&&c(n,{htmlFor:m,className:`cursor-pointer`,children:[u,d&&s(`span`,{className:`text-danger-strong`,children:`*`})]})]}),x&&s(i,{errors:_.meta.errors})]})};export{u as SimpleBooleanField};
2
+ //# sourceMappingURL=simple-boolean-field-DZ0J-Pk0.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"simple-boolean-field-oP5yJDQL.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-boolean-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { Label } from '@/components/ui/label';\nimport { Switch } from '@/components/ui/switch';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n label?: string;\n required?: boolean;\n disabled?: boolean;\n variant?: 'checkbox' | 'switch';\n};\n\nexport const SimpleBooleanField: React.FC<Props> = ({ label, required, disabled, variant = 'checkbox' }) => {\n const id = useId();\n const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<boolean | null>();\n\n const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n const _invalid = state.meta.isTouched && !state.meta.isValid;\n const checked = state.value ?? false;\n const isDisabled = disabled || isSubmitting;\n\n const onCheckedChange = useCallback(\n (value: boolean) => {\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 <div className=\"flex items-center gap-2 h-9\">\n {variant === 'switch' ? (\n <Switch id={id} name={name} checked={checked} disabled={isDisabled} aria-invalid={_invalid} onBlur={handleBlur} onCheckedChange={onCheckedChange} />\n ) : (\n <Checkbox id={id} name={name} checked={checked} disabled={isDisabled} aria-invalid={_invalid} onBlur={handleBlur} onCheckedChange={onCheckedChange} />\n )}\n {label && (\n <Label htmlFor={id} className=\"cursor-pointer\">\n {label}\n {required && <span className=\"text-danger-strong\">*</span>}\n </Label>\n )}\n </div>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"iXAoBA,MAAa,GAAuC,CAAE,QAAO,WAAU,WAAU,UAAU,cAAiB,CAC1G,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAwC,EAE1F,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAU,EAAM,OAAS,GACzB,EAAa,GAAY,EAEzB,EAAkB,EACrB,GAAmB,CACd,GACJ,EAAa,CAAK,CACpB,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACE,EAAC,MAAD,CAAK,UAAU,uCAAf,CAEI,EADD,IAAY,SACV,EAEA,EAFD,CAAY,KAAU,OAAe,UAAS,SAAU,EAAY,eAAc,EAAU,OAAQ,EAA6B,iBAAkB,CAEE,EAEtJ,GACC,EAAC,EAAD,CAAO,QAAS,EAAI,UAAU,0BAA9B,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,GAEN,IACJ,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
1
+ {"version":3,"file":"simple-boolean-field-DZ0J-Pk0.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-boolean-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { Label } from '@/components/ui/label';\nimport { Switch } from '@/components/ui/switch';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport { FieldError } from '../ui/field';\n\ntype Props = {\n label?: string;\n required?: boolean;\n disabled?: boolean;\n variant?: 'checkbox' | 'switch';\n};\n\nexport const SimpleBooleanField: React.FC<Props> = ({ label, required, disabled, variant = 'checkbox' }) => {\n const id = useId();\n const { form, name, state, handleBlur, handleChange } = useTanStackFieldContext<boolean | null>();\n\n const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n\n const _invalid = state.meta.isTouched && !state.meta.isValid;\n const checked = state.value ?? false;\n const isDisabled = disabled || isSubmitting;\n\n const onCheckedChange = useCallback(\n (value: boolean) => {\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 <div className=\"flex items-center gap-2 h-9\">\n {variant === 'switch' ? (\n <Switch id={id} name={name} checked={checked} disabled={isDisabled} aria-invalid={_invalid} onBlur={handleBlur} onCheckedChange={onCheckedChange} />\n ) : (\n <Checkbox id={id} name={name} checked={checked} disabled={isDisabled} aria-invalid={_invalid} onBlur={handleBlur} onCheckedChange={onCheckedChange} />\n )}\n {label && (\n <Label htmlFor={id} className=\"cursor-pointer\">\n {label}\n {required && <span className=\"text-danger-strong\">*</span>}\n </Label>\n )}\n </div>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"iXAoBA,MAAa,GAAuC,CAAE,QAAO,WAAU,WAAU,UAAU,cAAiB,CAC1G,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,OAAM,QAAO,aAAY,gBAAiB,EAAwC,EAE1F,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAU,EAAM,OAAS,GACzB,EAAa,GAAY,EAEzB,EAAkB,EACrB,GAAmB,CACd,GACJ,EAAa,CAAK,CACpB,EACA,CAAC,EAAc,CAAY,CAC7B,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,CACE,EAAC,MAAD,CAAK,UAAU,uCAAf,CAEI,EADD,IAAY,SACV,EAEA,EAFD,CAAY,KAAU,OAAe,UAAS,SAAU,EAAY,eAAc,EAAU,OAAQ,EAA6B,iBAAkB,CAEE,EAEtJ,GACC,EAAC,EAAD,CAAO,QAAS,EAAI,UAAU,0BAA9B,CACG,EACA,GAAY,EAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,GAEN,IACJ,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
@@ -1,2 +1,2 @@
1
- import{Button as e}from"./ui/button.mjs";import{Command as t,CommandEmpty as n,CommandGroup as r,CommandInput as i,CommandItem as a,CommandList as o}from"./ui/command.mjs";import{G as s}from"./tanstack-form-CKAWexet.mjs";import{Popover as c,PopoverContent as l,PopoverTrigger as u}from"./ui/popover.mjs";import{Label as d}from"./ui/label.mjs";import{Drawer as f,DrawerContent as p,DrawerHeader as m,DrawerTitle as h}from"./ui/drawer.mjs";import{FieldError as g}from"./field-V2DoD8qL.mjs";import{useId as _,useState as v}from"react";import{cn as y}from"@customafk/react-toolkit/utils";import{jsx as b,jsxs as x}from"react/jsx-runtime";import{useIsMobile as S}from"@customafk/react-toolkit/hooks/useMobile";import{useStore as C}from"@tanstack/react-form";const w=({label:w,placeholder:T,required:E,disabled:D,options:O})=>{let k=_(),{form:A,state:j,handleBlur:M,handleChange:N}=s(),P=C(A.store,({isSubmitting:e})=>e),F=S(),[I,L]=v(!1),R=j.meta.isTouched&&!j.meta.isValid,z=D||P,B=O.find(({value:e})=>e===j.value)?.label,V=x(t,{children:[b(i,{placeholder:T??`Tìm kiếm…`}),x(o,{children:[b(n,{children:`Không tìm thấy kết quả.`}),b(r,{children:O.map(e=>b(a,{value:e.label,onSelect:()=>{N(e.value===j.value?null:e.value),L(!1)},children:e.label},e.value))})]})]});return F?x(`div`,{className:`flex flex-col gap-1.5`,children:[w&&x(d,{htmlFor:k,children:[w,E&&b(`span`,{className:`text-danger-strong`,children:`*`})]}),b(e,{id:k,type:`button`,variant:`outline`,color:`muted`,disabled:z,"aria-invalid":R,className:y(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!j.value&&`text-text-positive-muted`,R&&`outline-danger bg-danger-bg-subtle`),onBlur:M,onClick:()=>L(!0),children:B??b(`span`,{className:`text-text-positive-muted`,children:T})}),b(f,{open:I,onOpenChange:L,direction:`bottom`,children:x(p,{children:[b(m,{children:b(h,{children:w??T??`Tìm kiếm…`})}),b(`div`,{className:`overflow-y-auto pb-safe-bottom`,children:V})]})}),R&&b(g,{errors:j.meta.errors})]}):x(`div`,{className:`flex flex-col gap-1.5`,children:[w&&x(d,{htmlFor:k,children:[w,E&&b(`span`,{className:`text-danger-strong`,children:`*`})]}),x(c,{children:[b(u,{asChild:!0,children:b(e,{id:k,variant:`outline`,color:`muted`,size:`lg`,disabled:z,"aria-invalid":R,className:y(`flex w-full items-center justify-start rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,!j.value&&`text-text-positive-muted`),children:B??b(`span`,{className:`text-text-positive-muted`,children:T})})}),b(l,{align:`start`,side:`bottom`,className:`w-[--radix-popover-trigger-width] p-0 rounded`,onBlur:M,children:V})]}),R&&b(g,{errors:j.meta.errors})]})};export{w as SimpleComboboxField};
2
- //# sourceMappingURL=simple-combobox-field-Bd-xk5kC.mjs.map
1
+ import{Button as e}from"./ui/button.mjs";import{Command as t,CommandEmpty as n,CommandGroup as r,CommandInput as i,CommandItem as a,CommandList as o}from"./ui/command.mjs";import{G as s}from"./tanstack-form-AGwPfwiM.mjs";import{Popover as c,PopoverContent as l,PopoverTrigger as u}from"./ui/popover.mjs";import{Label as d}from"./ui/label.mjs";import{Drawer as f,DrawerContent as p,DrawerHeader as m,DrawerTitle as h}from"./ui/drawer.mjs";import{FieldError as g}from"./field-V2DoD8qL.mjs";import{useId as _,useState as v}from"react";import{cn as y}from"@customafk/react-toolkit/utils";import{jsx as b,jsxs as x}from"react/jsx-runtime";import{useIsMobile as S}from"@customafk/react-toolkit/hooks/useMobile";import{useStore as C}from"@tanstack/react-form";const w=({label:w,placeholder:T,required:E,disabled:D,options:O})=>{let k=_(),{form:A,state:j,handleBlur:M,handleChange:N}=s(),P=C(A.store,({isSubmitting:e})=>e),F=S(),[I,L]=v(!1),R=j.meta.isTouched&&!j.meta.isValid,z=D||P,B=O.find(({value:e})=>e===j.value)?.label,V=x(t,{children:[b(i,{placeholder:T??`Tìm kiếm…`}),x(o,{children:[b(n,{children:`Không tìm thấy kết quả.`}),b(r,{children:O.map(e=>b(a,{value:e.label,onSelect:()=>{N(e.value===j.value?null:e.value),L(!1)},children:e.label},e.value))})]})]});return F?x(`div`,{className:`flex flex-col gap-1.5`,children:[w&&x(d,{htmlFor:k,children:[w,E&&b(`span`,{className:`text-danger-strong`,children:`*`})]}),b(e,{id:k,type:`button`,variant:`outline`,color:`muted`,disabled:z,"aria-invalid":R,className:y(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!j.value&&`text-text-positive-muted`,R&&`outline-danger bg-danger-bg-subtle`),onBlur:M,onClick:()=>L(!0),children:B??b(`span`,{className:`text-text-positive-muted`,children:T})}),b(f,{open:I,onOpenChange:L,direction:`bottom`,children:x(p,{children:[b(m,{children:b(h,{children:w??T??`Tìm kiếm…`})}),b(`div`,{className:`overflow-y-auto pb-safe-bottom`,children:V})]})}),R&&b(g,{errors:j.meta.errors})]}):x(`div`,{className:`flex flex-col gap-1.5`,children:[w&&x(d,{htmlFor:k,children:[w,E&&b(`span`,{className:`text-danger-strong`,children:`*`})]}),x(c,{children:[b(u,{asChild:!0,children:b(e,{id:k,variant:`outline`,color:`muted`,size:`lg`,disabled:z,"aria-invalid":R,className:y(`flex w-full items-center justify-start rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,!j.value&&`text-text-positive-muted`),children:B??b(`span`,{className:`text-text-positive-muted`,children:T})})}),b(l,{align:`start`,side:`bottom`,className:`w-[--radix-popover-trigger-width] p-0 rounded`,onBlur:M,children:V})]}),R&&b(g,{errors:j.meta.errors})]})};export{w as SimpleComboboxField};
2
+ //# sourceMappingURL=simple-combobox-field-BQXmNATZ.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"simple-combobox-field-Bd-xk5kC.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-combobox-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { useIsMobile } from '@customafk/react-toolkit/hooks/useMobile';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from '@/components/ui/command';\nimport { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer';\nimport { Label } from '@/components/ui/label';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\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 options: Array<{ value: string; label: string }>;\n};\n\nexport const SimpleComboboxField: React.FC<Props> = ({ label, placeholder, required, disabled, options }) => {\n const id = useId();\n const { form, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n const isMobile = useIsMobile();\n const [drawerOpen, setDrawerOpen] = useState(false);\n\n const _invalid = state.meta.isTouched && !state.meta.isValid;\n const isDisabled = disabled || isSubmitting;\n\n const selectedLabel = options.find(({ value }) => value === state.value)?.label;\n\n const commandList = (\n <Command>\n <CommandInput placeholder={placeholder ?? 'Tìm kiếm…'} />\n <CommandList>\n <CommandEmpty>Không tìm thấy kết quả.</CommandEmpty>\n <CommandGroup>\n {options.map(option => (\n <CommandItem\n key={option.value}\n value={option.label}\n onSelect={() => {\n handleChange(option.value === state.value ? null : option.value);\n setDrawerOpen(false);\n }}\n >\n {option.label}\n </CommandItem>\n ))}\n </CommandGroup>\n </CommandList>\n </Command>\n );\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 disabled={isDisabled}\n aria-invalid={_invalid}\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 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 ?? 'Tìm kiếm…'}</DrawerTitle>\n </DrawerHeader>\n <div className=\"overflow-y-auto pb-safe-bottom\">{commandList}</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 <Popover>\n <PopoverTrigger asChild>\n <Button\n id={id}\n variant=\"outline\"\n color=\"muted\"\n size=\"lg\"\n disabled={isDisabled}\n aria-invalid={_invalid}\n className={cn(\n 'flex w-full items-center justify-start rounded outline-border font-normal',\n 'hover:bg-transparent',\n 'focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak',\n 'data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak',\n !state.value && 'text-text-positive-muted'\n )}\n >\n {selectedLabel ?? <span className=\"text-text-positive-muted\">{placeholder}</span>}\n </Button>\n </PopoverTrigger>\n <PopoverContent align=\"start\" side=\"bottom\" className=\"w-[--radix-popover-trigger-width] p-0 rounded\" onBlur={handleBlur}>\n {commandList}\n </PopoverContent>\n </Popover>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"ivBA0BA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,WAAU,aAAc,CAC3G,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEnF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EACtE,EAAW,EAAY,EACvB,CAAC,EAAY,GAAiB,EAAS,EAAK,EAE5C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAa,GAAY,EAEzB,EAAgB,EAAQ,MAAM,CAAE,WAAY,IAAU,EAAM,KAAK,CAAC,EAAE,MAEpE,EACJ,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAc,YAAa,GAAe,WAAc,CAAA,EACxD,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SAAc,yBAAqC,CAAA,EACnD,EAAC,EAAD,CAAA,SACG,EAAQ,IAAI,GACX,EAAC,EAAD,CAEE,MAAO,EAAO,MACd,aAAgB,CACd,EAAa,EAAO,QAAU,EAAM,MAAQ,KAAO,EAAO,KAAK,EAC/D,EAAc,EAAK,CACrB,WAEC,EAAO,KACG,EARN,EAAO,KAQD,CACd,CACW,CAAA,CACH,CAAA,CAAA,CACN,CAAA,CAAA,EA4CX,OAzCI,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,SAAU,EACV,eAAc,EACd,UAAW,EACT,8EACA,CAAC,EAAM,OAAS,2BAChB,GAAY,oCACd,EACA,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,WAAyB,CAAA,CACnD,CAAA,EACd,EAAC,MAAD,CAAK,UAAU,0CAAkC,CAAiB,CAAA,CACrD,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,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,YACd,EAAC,EAAD,CACM,KACJ,QAAQ,UACR,MAAM,QACN,KAAK,KACL,SAAU,EACV,eAAc,EACd,UAAW,EACT,4EACA,uBACA,oFACA,oIACA,CAAC,EAAM,OAAS,0BAClB,WAEC,GAAiB,EAAC,OAAD,CAAM,UAAU,oCAA4B,CAAkB,CAAA,CAC1E,CAAA,CACM,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,QAAQ,KAAK,SAAS,UAAU,gDAAgD,OAAQ,WAC3G,CACa,CAAA,CACT,CAAA,CAAA,EACR,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
1
+ {"version":3,"file":"simple-combobox-field-BQXmNATZ.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-combobox-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { useIsMobile } from '@customafk/react-toolkit/hooks/useMobile';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from '@/components/ui/command';\nimport { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer';\nimport { Label } from '@/components/ui/label';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\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 options: Array<{ value: string; label: string }>;\n};\n\nexport const SimpleComboboxField: React.FC<Props> = ({ label, placeholder, required, disabled, options }) => {\n const id = useId();\n const { form, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n const isMobile = useIsMobile();\n const [drawerOpen, setDrawerOpen] = useState(false);\n\n const _invalid = state.meta.isTouched && !state.meta.isValid;\n const isDisabled = disabled || isSubmitting;\n\n const selectedLabel = options.find(({ value }) => value === state.value)?.label;\n\n const commandList = (\n <Command>\n <CommandInput placeholder={placeholder ?? 'Tìm kiếm…'} />\n <CommandList>\n <CommandEmpty>Không tìm thấy kết quả.</CommandEmpty>\n <CommandGroup>\n {options.map(option => (\n <CommandItem\n key={option.value}\n value={option.label}\n onSelect={() => {\n handleChange(option.value === state.value ? null : option.value);\n setDrawerOpen(false);\n }}\n >\n {option.label}\n </CommandItem>\n ))}\n </CommandGroup>\n </CommandList>\n </Command>\n );\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 disabled={isDisabled}\n aria-invalid={_invalid}\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 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 ?? 'Tìm kiếm…'}</DrawerTitle>\n </DrawerHeader>\n <div className=\"overflow-y-auto pb-safe-bottom\">{commandList}</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 <Popover>\n <PopoverTrigger asChild>\n <Button\n id={id}\n variant=\"outline\"\n color=\"muted\"\n size=\"lg\"\n disabled={isDisabled}\n aria-invalid={_invalid}\n className={cn(\n 'flex w-full items-center justify-start rounded outline-border font-normal',\n 'hover:bg-transparent',\n 'focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak',\n 'data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak',\n !state.value && 'text-text-positive-muted'\n )}\n >\n {selectedLabel ?? <span className=\"text-text-positive-muted\">{placeholder}</span>}\n </Button>\n </PopoverTrigger>\n <PopoverContent align=\"start\" side=\"bottom\" className=\"w-[--radix-popover-trigger-width] p-0 rounded\" onBlur={handleBlur}>\n {commandList}\n </PopoverContent>\n </Popover>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"ivBA0BA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,WAAU,aAAc,CAC3G,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiB,EAAuC,EAEnF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EACtE,EAAW,EAAY,EACvB,CAAC,EAAY,GAAiB,EAAS,EAAK,EAE5C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAa,GAAY,EAEzB,EAAgB,EAAQ,MAAM,CAAE,WAAY,IAAU,EAAM,KAAK,CAAC,EAAE,MAEpE,EACJ,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAc,YAAa,GAAe,WAAc,CAAA,EACxD,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SAAc,yBAAqC,CAAA,EACnD,EAAC,EAAD,CAAA,SACG,EAAQ,IAAI,GACX,EAAC,EAAD,CAEE,MAAO,EAAO,MACd,aAAgB,CACd,EAAa,EAAO,QAAU,EAAM,MAAQ,KAAO,EAAO,KAAK,EAC/D,EAAc,EAAK,CACrB,WAEC,EAAO,KACG,EARN,EAAO,KAQD,CACd,CACW,CAAA,CACH,CAAA,CAAA,CACN,CAAA,CAAA,EA4CX,OAzCI,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,SAAU,EACV,eAAc,EACd,UAAW,EACT,8EACA,CAAC,EAAM,OAAS,2BAChB,GAAY,oCACd,EACA,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,WAAyB,CAAA,CACnD,CAAA,EACd,EAAC,MAAD,CAAK,UAAU,0CAAkC,CAAiB,CAAA,CACrD,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,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,YACd,EAAC,EAAD,CACM,KACJ,QAAQ,UACR,MAAM,QACN,KAAK,KACL,SAAU,EACV,eAAc,EACd,UAAW,EACT,4EACA,uBACA,oFACA,oIACA,CAAC,EAAM,OAAS,0BAClB,WAEC,GAAiB,EAAC,OAAD,CAAM,UAAU,oCAA4B,CAAkB,CAAA,CAC1E,CAAA,CACM,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,QAAQ,KAAK,SAAS,UAAU,gDAAgD,OAAQ,WAC3G,CACa,CAAA,CACT,CAAA,CAAA,EACR,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
@@ -1,2 +1,2 @@
1
- const e=require("./ui/button.cjs"),t=require("./ui/command.cjs"),n=require("./tanstack-form-CX3lC3mC.cjs"),r=require("./ui/popover.cjs"),i=require("./ui/label.cjs"),a=require("./ui/drawer.cjs"),o=require("./field-BSLi-P0Q.cjs");let s=require("react"),c=require("@customafk/react-toolkit/utils"),l=require("react/jsx-runtime"),u=require("@customafk/react-toolkit/hooks/useMobile"),d=require("@tanstack/react-form");const f=({label:f,placeholder:p,required:m,disabled:h,options:g})=>{let _=(0,s.useId)(),{form:v,state:y,handleBlur:b,handleChange:x}=n.G(),S=(0,d.useStore)(v.store,({isSubmitting:e})=>e),C=(0,u.useIsMobile)(),[w,T]=(0,s.useState)(!1),E=y.meta.isTouched&&!y.meta.isValid,D=h||S,O=g.find(({value:e})=>e===y.value)?.label,k=(0,l.jsxs)(t.Command,{children:[(0,l.jsx)(t.CommandInput,{placeholder:p??`Tìm kiếm…`}),(0,l.jsxs)(t.CommandList,{children:[(0,l.jsx)(t.CommandEmpty,{children:`Không tìm thấy kết quả.`}),(0,l.jsx)(t.CommandGroup,{children:g.map(e=>(0,l.jsx)(t.CommandItem,{value:e.label,onSelect:()=>{x(e.value===y.value?null:e.value),T(!1)},children:e.label},e.value))})]})]});return C?(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[f&&(0,l.jsxs)(i.Label,{htmlFor:_,children:[f,m&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsx)(e.Button,{id:_,type:`button`,variant:`outline`,color:`muted`,disabled:D,"aria-invalid":E,className:(0,c.cn)(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!y.value&&`text-text-positive-muted`,E&&`outline-danger bg-danger-bg-subtle`),onBlur:b,onClick:()=>T(!0),children:O??(0,l.jsx)(`span`,{className:`text-text-positive-muted`,children:p})}),(0,l.jsx)(a.Drawer,{open:w,onOpenChange:T,direction:`bottom`,children:(0,l.jsxs)(a.DrawerContent,{children:[(0,l.jsx)(a.DrawerHeader,{children:(0,l.jsx)(a.DrawerTitle,{children:f??p??`Tìm kiếm…`})}),(0,l.jsx)(`div`,{className:`overflow-y-auto pb-safe-bottom`,children:k})]})}),E&&(0,l.jsx)(o.FieldError,{errors:y.meta.errors})]}):(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[f&&(0,l.jsxs)(i.Label,{htmlFor:_,children:[f,m&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsxs)(r.Popover,{children:[(0,l.jsx)(r.PopoverTrigger,{asChild:!0,children:(0,l.jsx)(e.Button,{id:_,variant:`outline`,color:`muted`,size:`lg`,disabled:D,"aria-invalid":E,className:(0,c.cn)(`flex w-full items-center justify-start rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,!y.value&&`text-text-positive-muted`),children:O??(0,l.jsx)(`span`,{className:`text-text-positive-muted`,children:p})})}),(0,l.jsx)(r.PopoverContent,{align:`start`,side:`bottom`,className:`w-[--radix-popover-trigger-width] p-0 rounded`,onBlur:b,children:k})]}),E&&(0,l.jsx)(o.FieldError,{errors:y.meta.errors})]})};exports.SimpleComboboxField=f;
2
- //# sourceMappingURL=simple-combobox-field-Dgicw0VN.cjs.map
1
+ const e=require("./ui/button.cjs"),t=require("./ui/command.cjs"),n=require("./tanstack-form-Bae0TOEr.cjs"),r=require("./ui/popover.cjs"),i=require("./ui/label.cjs"),a=require("./ui/drawer.cjs"),o=require("./field-BSLi-P0Q.cjs");let s=require("react"),c=require("@customafk/react-toolkit/utils"),l=require("react/jsx-runtime"),u=require("@customafk/react-toolkit/hooks/useMobile"),d=require("@tanstack/react-form");const f=({label:f,placeholder:p,required:m,disabled:h,options:g})=>{let _=(0,s.useId)(),{form:v,state:y,handleBlur:b,handleChange:x}=n.G(),S=(0,d.useStore)(v.store,({isSubmitting:e})=>e),C=(0,u.useIsMobile)(),[w,T]=(0,s.useState)(!1),E=y.meta.isTouched&&!y.meta.isValid,D=h||S,O=g.find(({value:e})=>e===y.value)?.label,k=(0,l.jsxs)(t.Command,{children:[(0,l.jsx)(t.CommandInput,{placeholder:p??`Tìm kiếm…`}),(0,l.jsxs)(t.CommandList,{children:[(0,l.jsx)(t.CommandEmpty,{children:`Không tìm thấy kết quả.`}),(0,l.jsx)(t.CommandGroup,{children:g.map(e=>(0,l.jsx)(t.CommandItem,{value:e.label,onSelect:()=>{x(e.value===y.value?null:e.value),T(!1)},children:e.label},e.value))})]})]});return C?(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[f&&(0,l.jsxs)(i.Label,{htmlFor:_,children:[f,m&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsx)(e.Button,{id:_,type:`button`,variant:`outline`,color:`muted`,disabled:D,"aria-invalid":E,className:(0,c.cn)(`w-full justify-start font-normal outline-1 outline-border -outline-offset-1`,!y.value&&`text-text-positive-muted`,E&&`outline-danger bg-danger-bg-subtle`),onBlur:b,onClick:()=>T(!0),children:O??(0,l.jsx)(`span`,{className:`text-text-positive-muted`,children:p})}),(0,l.jsx)(a.Drawer,{open:w,onOpenChange:T,direction:`bottom`,children:(0,l.jsxs)(a.DrawerContent,{children:[(0,l.jsx)(a.DrawerHeader,{children:(0,l.jsx)(a.DrawerTitle,{children:f??p??`Tìm kiếm…`})}),(0,l.jsx)(`div`,{className:`overflow-y-auto pb-safe-bottom`,children:k})]})}),E&&(0,l.jsx)(o.FieldError,{errors:y.meta.errors})]}):(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[f&&(0,l.jsxs)(i.Label,{htmlFor:_,children:[f,m&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsxs)(r.Popover,{children:[(0,l.jsx)(r.PopoverTrigger,{asChild:!0,children:(0,l.jsx)(e.Button,{id:_,variant:`outline`,color:`muted`,size:`lg`,disabled:D,"aria-invalid":E,className:(0,c.cn)(`flex w-full items-center justify-start rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,!y.value&&`text-text-positive-muted`),children:O??(0,l.jsx)(`span`,{className:`text-text-positive-muted`,children:p})})}),(0,l.jsx)(r.PopoverContent,{align:`start`,side:`bottom`,className:`w-[--radix-popover-trigger-width] p-0 rounded`,onBlur:b,children:k})]}),E&&(0,l.jsx)(o.FieldError,{errors:y.meta.errors})]})};exports.SimpleComboboxField=f;
2
+ //# sourceMappingURL=simple-combobox-field-CeV40wnv.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"simple-combobox-field-Dgicw0VN.cjs","names":["useTanStackFieldContext","Command","CommandInput","CommandList","CommandEmpty","CommandGroup","CommandItem","Label","Button","Drawer","DrawerContent","DrawerHeader","DrawerTitle","FieldError","Popover","PopoverTrigger","PopoverContent"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-combobox-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { useIsMobile } from '@customafk/react-toolkit/hooks/useMobile';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from '@/components/ui/command';\nimport { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer';\nimport { Label } from '@/components/ui/label';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\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 options: Array<{ value: string; label: string }>;\n};\n\nexport const SimpleComboboxField: React.FC<Props> = ({ label, placeholder, required, disabled, options }) => {\n const id = useId();\n const { form, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n const isMobile = useIsMobile();\n const [drawerOpen, setDrawerOpen] = useState(false);\n\n const _invalid = state.meta.isTouched && !state.meta.isValid;\n const isDisabled = disabled || isSubmitting;\n\n const selectedLabel = options.find(({ value }) => value === state.value)?.label;\n\n const commandList = (\n <Command>\n <CommandInput placeholder={placeholder ?? 'Tìm kiếm…'} />\n <CommandList>\n <CommandEmpty>Không tìm thấy kết quả.</CommandEmpty>\n <CommandGroup>\n {options.map(option => (\n <CommandItem\n key={option.value}\n value={option.label}\n onSelect={() => {\n handleChange(option.value === state.value ? null : option.value);\n setDrawerOpen(false);\n }}\n >\n {option.label}\n </CommandItem>\n ))}\n </CommandGroup>\n </CommandList>\n </Command>\n );\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 disabled={isDisabled}\n aria-invalid={_invalid}\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 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 ?? 'Tìm kiếm…'}</DrawerTitle>\n </DrawerHeader>\n <div className=\"overflow-y-auto pb-safe-bottom\">{commandList}</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 <Popover>\n <PopoverTrigger asChild>\n <Button\n id={id}\n variant=\"outline\"\n color=\"muted\"\n size=\"lg\"\n disabled={isDisabled}\n aria-invalid={_invalid}\n className={cn(\n 'flex w-full items-center justify-start rounded outline-border font-normal',\n 'hover:bg-transparent',\n 'focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak',\n 'data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak',\n !state.value && 'text-text-positive-muted'\n )}\n >\n {selectedLabel ?? <span className=\"text-text-positive-muted\">{placeholder}</span>}\n </Button>\n </PopoverTrigger>\n <PopoverContent align=\"start\" side=\"bottom\" className=\"w-[--radix-popover-trigger-width] p-0 rounded\" onBlur={handleBlur}>\n {commandList}\n </PopoverContent>\n </Popover>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"8ZA0BA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,WAAU,aAAc,CAC3G,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,EACtE,GAAA,EAAA,EAAA,YAAA,CAAuB,EACvB,CAAC,EAAY,IAAA,EAAA,EAAA,SAAA,CAA0B,EAAK,EAE5C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAa,GAAY,EAEzB,EAAgB,EAAQ,MAAM,CAAE,WAAY,IAAU,EAAM,KAAK,CAAC,EAAE,MAEpE,GACJ,EAAA,EAAA,KAAA,CAACC,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAc,YAAa,GAAe,WAAc,CAAA,GACxD,EAAA,EAAA,KAAA,CAACC,EAAAA,YAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAA,SAAc,yBAAqC,CAAA,GACnD,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAA,SACG,EAAQ,IAAI,IACX,EAAA,EAAA,IAAA,CAACC,EAAAA,YAAD,CAEE,MAAO,EAAO,MACd,aAAgB,CACd,EAAa,EAAO,QAAU,EAAM,MAAQ,KAAO,EAAO,KAAK,EAC/D,EAAc,EAAK,CACrB,WAEC,EAAO,KACG,EARN,EAAO,KAQD,CACd,CACW,CAAA,CACH,CAAA,CAAA,CACN,CAAA,CAAA,EA4CX,OAzCI,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,SAAU,EACV,eAAc,EACd,WAAA,EAAA,EAAA,GAAA,CACE,8EACA,CAAC,EAAM,OAAS,2BAChB,GAAY,oCACd,EACA,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,WAAyB,CAAA,CACnD,CAAA,GACd,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,0CAAkC,CAAiB,CAAA,CACrD,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,CAACN,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,KAAA,CAACO,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,aACd,EAAA,EAAA,IAAA,CAACP,EAAAA,OAAD,CACM,KACJ,QAAQ,UACR,MAAM,QACN,KAAK,KACL,SAAU,EACV,eAAc,EACd,WAAA,EAAA,EAAA,GAAA,CACE,4EACA,uBACA,oFACA,oIACA,CAAC,EAAM,OAAS,0BAClB,WAEC,IAAiB,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,oCAA4B,CAAkB,CAAA,CAC1E,CAAA,CACM,CAAA,GAChB,EAAA,EAAA,IAAA,CAACQ,EAAAA,eAAD,CAAgB,MAAM,QAAQ,KAAK,SAAS,UAAU,gDAAgD,OAAQ,WAC3G,CACa,CAAA,CACT,CAAA,CAAA,EACR,IAAY,EAAA,EAAA,IAAA,CAACH,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
1
+ {"version":3,"file":"simple-combobox-field-CeV40wnv.cjs","names":["useTanStackFieldContext","Command","CommandInput","CommandList","CommandEmpty","CommandGroup","CommandItem","Label","Button","Drawer","DrawerContent","DrawerHeader","DrawerTitle","FieldError","Popover","PopoverTrigger","PopoverContent"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-combobox-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { useIsMobile } from '@customafk/react-toolkit/hooks/useMobile';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from '@/components/ui/command';\nimport { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer';\nimport { Label } from '@/components/ui/label';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\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 options: Array<{ value: string; label: string }>;\n};\n\nexport const SimpleComboboxField: React.FC<Props> = ({ label, placeholder, required, disabled, options }) => {\n const id = useId();\n const { form, state, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n const isMobile = useIsMobile();\n const [drawerOpen, setDrawerOpen] = useState(false);\n\n const _invalid = state.meta.isTouched && !state.meta.isValid;\n const isDisabled = disabled || isSubmitting;\n\n const selectedLabel = options.find(({ value }) => value === state.value)?.label;\n\n const commandList = (\n <Command>\n <CommandInput placeholder={placeholder ?? 'Tìm kiếm…'} />\n <CommandList>\n <CommandEmpty>Không tìm thấy kết quả.</CommandEmpty>\n <CommandGroup>\n {options.map(option => (\n <CommandItem\n key={option.value}\n value={option.label}\n onSelect={() => {\n handleChange(option.value === state.value ? null : option.value);\n setDrawerOpen(false);\n }}\n >\n {option.label}\n </CommandItem>\n ))}\n </CommandGroup>\n </CommandList>\n </Command>\n );\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 disabled={isDisabled}\n aria-invalid={_invalid}\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 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 ?? 'Tìm kiếm…'}</DrawerTitle>\n </DrawerHeader>\n <div className=\"overflow-y-auto pb-safe-bottom\">{commandList}</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 <Popover>\n <PopoverTrigger asChild>\n <Button\n id={id}\n variant=\"outline\"\n color=\"muted\"\n size=\"lg\"\n disabled={isDisabled}\n aria-invalid={_invalid}\n className={cn(\n 'flex w-full items-center justify-start rounded outline-border font-normal',\n 'hover:bg-transparent',\n 'focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak',\n 'data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak',\n !state.value && 'text-text-positive-muted'\n )}\n >\n {selectedLabel ?? <span className=\"text-text-positive-muted\">{placeholder}</span>}\n </Button>\n </PopoverTrigger>\n <PopoverContent align=\"start\" side=\"bottom\" className=\"w-[--radix-popover-trigger-width] p-0 rounded\" onBlur={handleBlur}>\n {commandList}\n </PopoverContent>\n </Popover>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"8ZA0BA,MAAa,GAAwC,CAAE,QAAO,cAAa,WAAU,WAAU,aAAc,CAC3G,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,EACtE,GAAA,EAAA,EAAA,YAAA,CAAuB,EACvB,CAAC,EAAY,IAAA,EAAA,EAAA,SAAA,CAA0B,EAAK,EAE5C,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAC/C,EAAa,GAAY,EAEzB,EAAgB,EAAQ,MAAM,CAAE,WAAY,IAAU,EAAM,KAAK,CAAC,EAAE,MAEpE,GACJ,EAAA,EAAA,KAAA,CAACC,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAc,YAAa,GAAe,WAAc,CAAA,GACxD,EAAA,EAAA,KAAA,CAACC,EAAAA,YAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAA,SAAc,yBAAqC,CAAA,GACnD,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAA,SACG,EAAQ,IAAI,IACX,EAAA,EAAA,IAAA,CAACC,EAAAA,YAAD,CAEE,MAAO,EAAO,MACd,aAAgB,CACd,EAAa,EAAO,QAAU,EAAM,MAAQ,KAAO,EAAO,KAAK,EAC/D,EAAc,EAAK,CACrB,WAEC,EAAO,KACG,EARN,EAAO,KAQD,CACd,CACW,CAAA,CACH,CAAA,CAAA,CACN,CAAA,CAAA,EA4CX,OAzCI,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,SAAU,EACV,eAAc,EACd,WAAA,EAAA,EAAA,GAAA,CACE,8EACA,CAAC,EAAM,OAAS,2BAChB,GAAY,oCACd,EACA,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,WAAyB,CAAA,CACnD,CAAA,GACd,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,0CAAkC,CAAiB,CAAA,CACrD,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,CAACN,EAAAA,MAAD,CAAO,QAAS,WAAhB,CACG,EACA,IAAY,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8BAAqB,GAAO,CAAA,CACpD,KAET,EAAA,EAAA,KAAA,CAACO,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,aACd,EAAA,EAAA,IAAA,CAACP,EAAAA,OAAD,CACM,KACJ,QAAQ,UACR,MAAM,QACN,KAAK,KACL,SAAU,EACV,eAAc,EACd,WAAA,EAAA,EAAA,GAAA,CACE,4EACA,uBACA,oFACA,oIACA,CAAC,EAAM,OAAS,0BAClB,WAEC,IAAiB,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,oCAA4B,CAAkB,CAAA,CAC1E,CAAA,CACM,CAAA,GAChB,EAAA,EAAA,IAAA,CAACQ,EAAAA,eAAD,CAAgB,MAAM,QAAQ,KAAK,SAAS,UAAU,gDAAgD,OAAQ,WAC3G,CACa,CAAA,CACT,CAAA,CAAA,EACR,IAAY,EAAA,EAAA,IAAA,CAACH,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
@@ -1,2 +1,2 @@
1
- const e=require("./ui/button.cjs"),t=require("./tanstack-form-CX3lC3mC.cjs"),n=require("./ui/popover.cjs"),r=require("./ui/label.cjs"),i=require("./ui/calendar.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/date-fns"),d=require("@tanstack/react-form");const f=({label:f,placeholder:p,required:m,disabled:h,minDate:g,maxDate:_})=>{let v=(0,s.useId)(),{form:y,state:b,handleBlur:x,handleChange:S}=t.G(),C=(0,d.useStore)(y.store,({isSubmitting:e})=>e),w=b.meta.isTouched&&!b.meta.isValid;return(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[f&&(0,l.jsxs)(r.Label,{htmlFor:v,children:[f,m&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsxs)(n.Popover,{children:[(0,l.jsx)(n.PopoverTrigger,{asChild:!0,children:(0,l.jsxs)(e.Button,{id:v,variant:`outline`,color:`muted`,size:`lg`,disabled:h||C,"aria-invalid":w,className:(0,c.cn)(`flex w-full items-center justify-between rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,b.value===null&&`text-text-positive-muted`),children:[(0,l.jsx)(`span`,{children:b.value?(0,u.format)(b.value,`PPP`):p??`Select date`}),(0,l.jsx)(o.CalendarDaysIcon,{strokeWidth:1})]})}),(0,l.jsx)(n.PopoverContent,{align:`start`,side:`bottom`,className:`w-fit p-0 rounded`,onBlur:x,children:(0,l.jsx)(i.Calendar,{mode:`single`,selected:b.value??void 0,hidden:{before:g??new Date(1900,0,1),after:_??new Date(2100,11,31)},onSelect:e=>{e&&S(e)}})})]}),w&&(0,l.jsx)(a.FieldError,{errors:b.meta.errors})]})};exports.SimpleDateField=f;
2
- //# sourceMappingURL=simple-date-field-hORsbXHE.cjs.map
1
+ const e=require("./ui/button.cjs"),t=require("./tanstack-form-Bae0TOEr.cjs"),n=require("./ui/popover.cjs"),r=require("./ui/label.cjs"),i=require("./ui/calendar.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/date-fns"),d=require("@tanstack/react-form");const f=({label:f,placeholder:p,required:m,disabled:h,minDate:g,maxDate:_})=>{let v=(0,s.useId)(),{form:y,state:b,handleBlur:x,handleChange:S}=t.G(),C=(0,d.useStore)(y.store,({isSubmitting:e})=>e),w=b.meta.isTouched&&!b.meta.isValid;return(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[f&&(0,l.jsxs)(r.Label,{htmlFor:v,children:[f,m&&(0,l.jsx)(`span`,{className:`text-danger-strong`,children:`*`})]}),(0,l.jsxs)(n.Popover,{children:[(0,l.jsx)(n.PopoverTrigger,{asChild:!0,children:(0,l.jsxs)(e.Button,{id:v,variant:`outline`,color:`muted`,size:`lg`,disabled:h||C,"aria-invalid":w,className:(0,c.cn)(`flex w-full items-center justify-between rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,b.value===null&&`text-text-positive-muted`),children:[(0,l.jsx)(`span`,{children:b.value?(0,u.format)(b.value,`PPP`):p??`Select date`}),(0,l.jsx)(o.CalendarDaysIcon,{strokeWidth:1})]})}),(0,l.jsx)(n.PopoverContent,{align:`start`,side:`bottom`,className:`w-fit p-0 rounded`,onBlur:x,children:(0,l.jsx)(i.Calendar,{mode:`single`,selected:b.value??void 0,hidden:{before:g??new Date(1900,0,1),after:_??new Date(2100,11,31)},onSelect:e=>{e&&S(e)}})})]}),w&&(0,l.jsx)(a.FieldError,{errors:b.meta.errors})]})};exports.SimpleDateField=f;
2
+ //# sourceMappingURL=simple-date-field-CrH-92i4.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"simple-date-field-hORsbXHE.cjs","names":["useTanStackFieldContext","Label","Popover","PopoverTrigger","Button","CalendarDaysIcon","PopoverContent","Calendar","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-date-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\nimport { CalendarDaysIcon } from 'lucide-react';\n\nimport { format } from '@customafk/react-toolkit/date-fns';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Calendar } from '@/components/ui/calendar';\nimport { Label } from '@/components/ui/label';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\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 minDate?: Date;\n maxDate?: Date;\n};\n\nexport const SimpleDateField: React.FC<Props> = ({ label, placeholder, required, disabled, minDate, maxDate }) => {\n const id = useId();\n const { form, state, handleBlur, handleChange } = useTanStackFieldContext<Date | 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 htmlFor={id}>\n {label}\n {required && <span className=\"text-danger-strong\">*</span>}\n </Label>\n )}\n <Popover>\n <PopoverTrigger asChild>\n <Button\n id={id}\n variant=\"outline\"\n color=\"muted\"\n size=\"lg\"\n disabled={isDisabled}\n aria-invalid={_invalid}\n className={cn(\n 'flex w-full items-center justify-between rounded outline-border font-normal',\n 'hover:bg-transparent',\n 'focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak',\n 'data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak',\n state.value === null && 'text-text-positive-muted'\n )}\n >\n <span>{state.value ? format(state.value, 'PPP') : (placeholder ?? 'Select date')}</span>\n <CalendarDaysIcon strokeWidth={1} />\n </Button>\n </PopoverTrigger>\n <PopoverContent align=\"start\" side=\"bottom\" className=\"w-fit p-0 rounded\" onBlur={handleBlur}>\n <Calendar\n mode=\"single\"\n selected={state.value ?? undefined}\n hidden={{\n before: minDate ?? new Date(1900, 0, 1),\n after: maxDate ?? new Date(2100, 11, 31),\n }}\n onSelect={date => {\n if (!date) return;\n handleChange(date);\n }}\n />\n </PopoverContent>\n </Popover>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"qZA2BA,MAAa,GAAoC,CAAE,QAAO,cAAa,WAAU,WAAU,UAAS,aAAc,CAChH,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAqC,EAEjF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAGrD,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,CAACC,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,aACd,EAAA,EAAA,KAAA,CAACC,EAAAA,OAAD,CACM,KACJ,QAAQ,UACR,MAAM,QACN,KAAK,KACL,SAjBS,GAAY,EAkBrB,eAAc,EACd,WAAA,EAAA,EAAA,GAAA,CACE,8EACA,uBACA,oFACA,oIACA,EAAM,QAAU,MAAQ,0BAC1B,WAbF,EAeE,EAAA,EAAA,IAAA,CAAC,OAAD,CAAA,SAAO,EAAM,OAAA,EAAA,EAAA,OAAA,CAAe,EAAM,MAAO,KAAK,EAAK,GAAe,aAAqB,CAAA,GACvF,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAkB,YAAa,CAAI,CAAA,CAC7B,GACM,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAM,QAAQ,KAAK,SAAS,UAAU,oBAAoB,OAAQ,YAChF,EAAA,EAAA,IAAA,CAACC,EAAAA,SAAD,CACE,KAAK,SACL,SAAU,EAAM,OAAS,IAAA,GACzB,OAAQ,CACN,OAAQ,GAAW,IAAI,KAAK,KAAM,EAAG,CAAC,EACtC,MAAO,GAAW,IAAI,KAAK,KAAM,GAAI,EAAE,CACzC,EACA,SAAU,GAAQ,CACX,GACL,EAAa,CAAI,CACnB,CACD,CAAA,CACa,CAAA,CACT,CAAA,CAAA,EACR,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
1
+ {"version":3,"file":"simple-date-field-CrH-92i4.cjs","names":["useTanStackFieldContext","Label","Popover","PopoverTrigger","Button","CalendarDaysIcon","PopoverContent","Calendar","FieldError"],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-date-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\nimport { CalendarDaysIcon } from 'lucide-react';\n\nimport { format } from '@customafk/react-toolkit/date-fns';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Calendar } from '@/components/ui/calendar';\nimport { Label } from '@/components/ui/label';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\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 minDate?: Date;\n maxDate?: Date;\n};\n\nexport const SimpleDateField: React.FC<Props> = ({ label, placeholder, required, disabled, minDate, maxDate }) => {\n const id = useId();\n const { form, state, handleBlur, handleChange } = useTanStackFieldContext<Date | 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 htmlFor={id}>\n {label}\n {required && <span className=\"text-danger-strong\">*</span>}\n </Label>\n )}\n <Popover>\n <PopoverTrigger asChild>\n <Button\n id={id}\n variant=\"outline\"\n color=\"muted\"\n size=\"lg\"\n disabled={isDisabled}\n aria-invalid={_invalid}\n className={cn(\n 'flex w-full items-center justify-between rounded outline-border font-normal',\n 'hover:bg-transparent',\n 'focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak',\n 'data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak',\n state.value === null && 'text-text-positive-muted'\n )}\n >\n <span>{state.value ? format(state.value, 'PPP') : (placeholder ?? 'Select date')}</span>\n <CalendarDaysIcon strokeWidth={1} />\n </Button>\n </PopoverTrigger>\n <PopoverContent align=\"start\" side=\"bottom\" className=\"w-fit p-0 rounded\" onBlur={handleBlur}>\n <Calendar\n mode=\"single\"\n selected={state.value ?? undefined}\n hidden={{\n before: minDate ?? new Date(1900, 0, 1),\n after: maxDate ?? new Date(2100, 11, 31),\n }}\n onSelect={date => {\n if (!date) return;\n handleChange(date);\n }}\n />\n </PopoverContent>\n </Popover>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"qZA2BA,MAAa,GAAoC,CAAE,QAAO,cAAa,WAAU,WAAU,UAAS,aAAc,CAChH,IAAM,GAAA,EAAA,EAAA,MAAA,CAAW,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiBA,EAAAA,EAAqC,EAEjF,GAAA,EAAA,EAAA,SAAA,CAAwB,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAGrD,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,CAACC,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,aACd,EAAA,EAAA,KAAA,CAACC,EAAAA,OAAD,CACM,KACJ,QAAQ,UACR,MAAM,QACN,KAAK,KACL,SAjBS,GAAY,EAkBrB,eAAc,EACd,WAAA,EAAA,EAAA,GAAA,CACE,8EACA,uBACA,oFACA,oIACA,EAAM,QAAU,MAAQ,0BAC1B,WAbF,EAeE,EAAA,EAAA,IAAA,CAAC,OAAD,CAAA,SAAO,EAAM,OAAA,EAAA,EAAA,OAAA,CAAe,EAAM,MAAO,KAAK,EAAK,GAAe,aAAqB,CAAA,GACvF,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAkB,YAAa,CAAI,CAAA,CAC7B,GACM,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAM,QAAQ,KAAK,SAAS,UAAU,oBAAoB,OAAQ,YAChF,EAAA,EAAA,IAAA,CAACC,EAAAA,SAAD,CACE,KAAK,SACL,SAAU,EAAM,OAAS,IAAA,GACzB,OAAQ,CACN,OAAQ,GAAW,IAAI,KAAK,KAAM,EAAG,CAAC,EACtC,MAAO,GAAW,IAAI,KAAK,KAAM,GAAI,EAAE,CACzC,EACA,SAAU,GAAQ,CACX,GACL,EAAa,CAAI,CACnB,CACD,CAAA,CACa,CAAA,CACT,CAAA,CAAA,EACR,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
@@ -1,2 +1,2 @@
1
- import{Button as e}from"./ui/button.mjs";import{G as t}from"./tanstack-form-CKAWexet.mjs";import{Popover as n,PopoverContent as r,PopoverTrigger as i}from"./ui/popover.mjs";import{Label as a}from"./ui/label.mjs";import{Calendar as o}from"./ui/calendar.mjs";import{FieldError as s}from"./field-V2DoD8qL.mjs";import{CalendarDaysIcon as c}from"lucide-react";import{useId as l}from"react";import{cn as u}from"@customafk/react-toolkit/utils";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{format as p}from"@customafk/react-toolkit/date-fns";import{useStore as m}from"@tanstack/react-form";const h=({label:h,placeholder:g,required:_,disabled:v,minDate:y,maxDate:b})=>{let x=l(),{form:S,state:C,handleBlur:w,handleChange:T}=t(),E=m(S.store,({isSubmitting:e})=>e),D=C.meta.isTouched&&!C.meta.isValid;return f(`div`,{className:`flex flex-col gap-1.5`,children:[h&&f(a,{htmlFor:x,children:[h,_&&d(`span`,{className:`text-danger-strong`,children:`*`})]}),f(n,{children:[d(i,{asChild:!0,children:f(e,{id:x,variant:`outline`,color:`muted`,size:`lg`,disabled:v||E,"aria-invalid":D,className:u(`flex w-full items-center justify-between rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,C.value===null&&`text-text-positive-muted`),children:[d(`span`,{children:C.value?p(C.value,`PPP`):g??`Select date`}),d(c,{strokeWidth:1})]})}),d(r,{align:`start`,side:`bottom`,className:`w-fit p-0 rounded`,onBlur:w,children:d(o,{mode:`single`,selected:C.value??void 0,hidden:{before:y??new Date(1900,0,1),after:b??new Date(2100,11,31)},onSelect:e=>{e&&T(e)}})})]}),D&&d(s,{errors:C.meta.errors})]})};export{h as SimpleDateField};
2
- //# sourceMappingURL=simple-date-field-DE5Z-Zkc.mjs.map
1
+ import{Button as e}from"./ui/button.mjs";import{G as t}from"./tanstack-form-AGwPfwiM.mjs";import{Popover as n,PopoverContent as r,PopoverTrigger as i}from"./ui/popover.mjs";import{Label as a}from"./ui/label.mjs";import{Calendar as o}from"./ui/calendar.mjs";import{FieldError as s}from"./field-V2DoD8qL.mjs";import{CalendarDaysIcon as c}from"lucide-react";import{useId as l}from"react";import{cn as u}from"@customafk/react-toolkit/utils";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{format as p}from"@customafk/react-toolkit/date-fns";import{useStore as m}from"@tanstack/react-form";const h=({label:h,placeholder:g,required:_,disabled:v,minDate:y,maxDate:b})=>{let x=l(),{form:S,state:C,handleBlur:w,handleChange:T}=t(),E=m(S.store,({isSubmitting:e})=>e),D=C.meta.isTouched&&!C.meta.isValid;return f(`div`,{className:`flex flex-col gap-1.5`,children:[h&&f(a,{htmlFor:x,children:[h,_&&d(`span`,{className:`text-danger-strong`,children:`*`})]}),f(n,{children:[d(i,{asChild:!0,children:f(e,{id:x,variant:`outline`,color:`muted`,size:`lg`,disabled:v||E,"aria-invalid":D,className:u(`flex w-full items-center justify-between rounded outline-border font-normal`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,C.value===null&&`text-text-positive-muted`),children:[d(`span`,{children:C.value?p(C.value,`PPP`):g??`Select date`}),d(c,{strokeWidth:1})]})}),d(r,{align:`start`,side:`bottom`,className:`w-fit p-0 rounded`,onBlur:w,children:d(o,{mode:`single`,selected:C.value??void 0,hidden:{before:y??new Date(1900,0,1),after:b??new Date(2100,11,31)},onSelect:e=>{e&&T(e)}})})]}),D&&d(s,{errors:C.meta.errors})]})};export{h as SimpleDateField};
2
+ //# sourceMappingURL=simple-date-field-D9ymav2L.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"simple-date-field-DE5Z-Zkc.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-date-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\nimport { CalendarDaysIcon } from 'lucide-react';\n\nimport { format } from '@customafk/react-toolkit/date-fns';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Calendar } from '@/components/ui/calendar';\nimport { Label } from '@/components/ui/label';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\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 minDate?: Date;\n maxDate?: Date;\n};\n\nexport const SimpleDateField: React.FC<Props> = ({ label, placeholder, required, disabled, minDate, maxDate }) => {\n const id = useId();\n const { form, state, handleBlur, handleChange } = useTanStackFieldContext<Date | 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 htmlFor={id}>\n {label}\n {required && <span className=\"text-danger-strong\">*</span>}\n </Label>\n )}\n <Popover>\n <PopoverTrigger asChild>\n <Button\n id={id}\n variant=\"outline\"\n color=\"muted\"\n size=\"lg\"\n disabled={isDisabled}\n aria-invalid={_invalid}\n className={cn(\n 'flex w-full items-center justify-between rounded outline-border font-normal',\n 'hover:bg-transparent',\n 'focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak',\n 'data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak',\n state.value === null && 'text-text-positive-muted'\n )}\n >\n <span>{state.value ? format(state.value, 'PPP') : (placeholder ?? 'Select date')}</span>\n <CalendarDaysIcon strokeWidth={1} />\n </Button>\n </PopoverTrigger>\n <PopoverContent align=\"start\" side=\"bottom\" className=\"w-fit p-0 rounded\" onBlur={handleBlur}>\n <Calendar\n mode=\"single\"\n selected={state.value ?? undefined}\n hidden={{\n before: minDate ?? new Date(1900, 0, 1),\n after: maxDate ?? new Date(2100, 11, 31),\n }}\n onSelect={date => {\n if (!date) return;\n handleChange(date);\n }}\n />\n </PopoverContent>\n </Popover>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"klBA2BA,MAAa,GAAoC,CAAE,QAAO,cAAa,WAAU,WAAU,UAAS,aAAc,CAChH,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiB,EAAqC,EAEjF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAGrD,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,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,YACd,EAAC,EAAD,CACM,KACJ,QAAQ,UACR,MAAM,QACN,KAAK,KACL,SAjBS,GAAY,EAkBrB,eAAc,EACd,UAAW,EACT,8EACA,uBACA,oFACA,oIACA,EAAM,QAAU,MAAQ,0BAC1B,WAbF,CAeE,EAAC,OAAD,CAAA,SAAO,EAAM,MAAQ,EAAO,EAAM,MAAO,KAAK,EAAK,GAAe,aAAqB,CAAA,EACvF,EAAC,EAAD,CAAkB,YAAa,CAAI,CAAA,CAC7B,GACM,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,QAAQ,KAAK,SAAS,UAAU,oBAAoB,OAAQ,WAChF,EAAC,EAAD,CACE,KAAK,SACL,SAAU,EAAM,OAAS,IAAA,GACzB,OAAQ,CACN,OAAQ,GAAW,IAAI,KAAK,KAAM,EAAG,CAAC,EACtC,MAAO,GAAW,IAAI,KAAK,KAAM,GAAI,EAAE,CACzC,EACA,SAAU,GAAQ,CACX,GACL,EAAa,CAAI,CACnB,CACD,CAAA,CACa,CAAA,CACT,CAAA,CAAA,EACR,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
1
+ {"version":3,"file":"simple-date-field-D9ymav2L.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/atoms/simple-date-field.tsx"],"sourcesContent":["'use client';\n\nimport { useId } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\nimport { CalendarDaysIcon } from 'lucide-react';\n\nimport { format } from '@customafk/react-toolkit/date-fns';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Calendar } from '@/components/ui/calendar';\nimport { Label } from '@/components/ui/label';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\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 minDate?: Date;\n maxDate?: Date;\n};\n\nexport const SimpleDateField: React.FC<Props> = ({ label, placeholder, required, disabled, minDate, maxDate }) => {\n const id = useId();\n const { form, state, handleBlur, handleChange } = useTanStackFieldContext<Date | 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 htmlFor={id}>\n {label}\n {required && <span className=\"text-danger-strong\">*</span>}\n </Label>\n )}\n <Popover>\n <PopoverTrigger asChild>\n <Button\n id={id}\n variant=\"outline\"\n color=\"muted\"\n size=\"lg\"\n disabled={isDisabled}\n aria-invalid={_invalid}\n className={cn(\n 'flex w-full items-center justify-between rounded outline-border font-normal',\n 'hover:bg-transparent',\n 'focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak',\n 'data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak',\n state.value === null && 'text-text-positive-muted'\n )}\n >\n <span>{state.value ? format(state.value, 'PPP') : (placeholder ?? 'Select date')}</span>\n <CalendarDaysIcon strokeWidth={1} />\n </Button>\n </PopoverTrigger>\n <PopoverContent align=\"start\" side=\"bottom\" className=\"w-fit p-0 rounded\" onBlur={handleBlur}>\n <Calendar\n mode=\"single\"\n selected={state.value ?? undefined}\n hidden={{\n before: minDate ?? new Date(1900, 0, 1),\n after: maxDate ?? new Date(2100, 11, 31),\n }}\n onSelect={date => {\n if (!date) return;\n handleChange(date);\n }}\n />\n </PopoverContent>\n </Popover>\n {_invalid && <FieldError errors={state.meta.errors} />}\n </div>\n );\n};\n"],"mappings":"klBA2BA,MAAa,GAAoC,CAAE,QAAO,cAAa,WAAU,WAAU,UAAS,aAAc,CAChH,IAAM,EAAK,EAAM,EACX,CAAE,OAAM,QAAO,aAAY,gBAAiB,EAAqC,EAEjF,EAAe,EAAS,EAAK,OAAQ,CAAE,kBAAmB,CAAY,EAEtE,EAAW,EAAM,KAAK,WAAa,CAAC,EAAM,KAAK,QAGrD,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,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,YACd,EAAC,EAAD,CACM,KACJ,QAAQ,UACR,MAAM,QACN,KAAK,KACL,SAjBS,GAAY,EAkBrB,eAAc,EACd,UAAW,EACT,8EACA,uBACA,oFACA,oIACA,EAAM,QAAU,MAAQ,0BAC1B,WAbF,CAeE,EAAC,OAAD,CAAA,SAAO,EAAM,MAAQ,EAAO,EAAM,MAAO,KAAK,EAAK,GAAe,aAAqB,CAAA,EACvF,EAAC,EAAD,CAAkB,YAAa,CAAI,CAAA,CAC7B,GACM,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,QAAQ,KAAK,SAAS,UAAU,oBAAoB,OAAQ,WAChF,EAAC,EAAD,CACE,KAAK,SACL,SAAU,EAAM,OAAS,IAAA,GACzB,OAAQ,CACN,OAAQ,GAAW,IAAI,KAAK,KAAM,EAAG,CAAC,EACtC,MAAO,GAAW,IAAI,KAAK,KAAM,GAAI,EAAE,CACzC,EACA,SAAU,GAAQ,CACX,GACL,EAAa,CAAI,CACnB,CACD,CAAA,CACa,CAAA,CACT,CAAA,CAAA,EACR,GAAY,EAAC,EAAD,CAAY,OAAQ,EAAM,KAAK,MAAS,CAAA,CAClD,GAET"}
@@ -1,2 +1,2 @@
1
- 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{AtSignIcon as i}from"lucide-react";import{useCallback as a,useId as o}from"react";import{cn as s}from"@customafk/react-toolkit/utils";import{jsx as c,jsxs as l}from"react/jsx-runtime";import{useStore as u}from"@tanstack/react-form";const d=({label:d,placeholder:f,required:p,maxLength:m,disabled:h})=>{let g=o(),{form:_,name:v,state:y,handleBlur:b,handleChange:x}=e(),S=u(_.store,({isSubmitting:e})=>e),C=y.meta.isTouched&&!y.meta.isValid,w=a(({target:{value:e}})=>{S||m&&e.length>m||x(e||null)},[S,m,x]);return l(`div`,{className:`flex flex-col gap-1.5`,children:[d&&l(n,{htmlFor:g,children:[d,p&&c(`span`,{className:`text-danger-strong`,children:`*`})]}),l(`div`,{className:`relative`,children:[c(t,{id:g,name:v,type:`email`,value:y.value??``,"aria-invalid":C,autoComplete:`email`,placeholder:f,disabled:h||S,className:s(`pl-9`),onBlur:b,onChange:w}),c(`div`,{className:`pointer-events-none absolute inset-y-0 left-0 flex size-9 items-center justify-center text-muted`,children:c(i,{size:14})})]}),C&&c(r,{errors:y.meta.errors})]})};export{d as SimpleEmailField};
2
- //# sourceMappingURL=simple-email-field-CFbpYis_.mjs.map
1
+ import{G as e}from"./tanstack-form-AGwPfwiM.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{AtSignIcon as i}from"lucide-react";import{useCallback as a,useId as o}from"react";import{cn as s}from"@customafk/react-toolkit/utils";import{jsx as c,jsxs as l}from"react/jsx-runtime";import{useStore as u}from"@tanstack/react-form";const d=({label:d,placeholder:f,required:p,maxLength:m,disabled:h})=>{let g=o(),{form:_,name:v,state:y,handleBlur:b,handleChange:x}=e(),S=u(_.store,({isSubmitting:e})=>e),C=y.meta.isTouched&&!y.meta.isValid,w=a(({target:{value:e}})=>{S||m&&e.length>m||x(e||null)},[S,m,x]);return l(`div`,{className:`flex flex-col gap-1.5`,children:[d&&l(n,{htmlFor:g,children:[d,p&&c(`span`,{className:`text-danger-strong`,children:`*`})]}),l(`div`,{className:`relative`,children:[c(t,{id:g,name:v,type:`email`,value:y.value??``,"aria-invalid":C,autoComplete:`email`,placeholder:f,disabled:h||S,className:s(`pl-9`),onBlur:b,onChange:w}),c(`div`,{className:`pointer-events-none absolute inset-y-0 left-0 flex size-9 items-center justify-center text-muted`,children:c(i,{size:14})})]}),C&&c(r,{errors:y.meta.errors})]})};export{d as SimpleEmailField};
2
+ //# sourceMappingURL=simple-email-field-8IiVOYa-.mjs.map
@@ -1 +1 @@
1
- {"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"}
1
+ {"version":3,"file":"simple-email-field-8IiVOYa-.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"}
@@ -1,2 +1,2 @@
1
- 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;
2
- //# sourceMappingURL=simple-email-field-DpuMlzxg.cjs.map
1
+ const e=require("./tanstack-form-Bae0TOEr.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;
2
+ //# sourceMappingURL=simple-email-field-CsMmMSvS.cjs.map
@@ -1 +1 @@
1
- {"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"}
1
+ {"version":3,"file":"simple-email-field-CsMmMSvS.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"}
@@ -1,2 +1,2 @@
1
- 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};
2
- //# sourceMappingURL=simple-number-field-BY0b4BJp.mjs.map
1
+ import{G as e}from"./tanstack-form-AGwPfwiM.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};
2
+ //# sourceMappingURL=simple-number-field-C6hE1Qlj.mjs.map
@@ -1 +1 @@
1
- {"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"}
1
+ {"version":3,"file":"simple-number-field-C6hE1Qlj.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"}
@@ -1,2 +1,2 @@
1
- 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;
2
- //# sourceMappingURL=simple-number-field-C4y4rQcw.cjs.map
1
+ const e=require("./tanstack-form-Bae0TOEr.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;
2
+ //# sourceMappingURL=simple-number-field-CrU2A2yp.cjs.map
@@ -1 +1 @@
1
- {"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"}
1
+ {"version":3,"file":"simple-number-field-CrU2A2yp.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"}
@@ -1,2 +1,2 @@
1
- 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};
2
- //# sourceMappingURL=simple-password-field-CA0FuETK.mjs.map
1
+ import{G as e}from"./tanstack-form-AGwPfwiM.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};
2
+ //# sourceMappingURL=simple-password-field-CabyA9Y7.mjs.map
@@ -1 +1 @@
1
- {"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"}
1
+ {"version":3,"file":"simple-password-field-CabyA9Y7.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"}
@@ -1,2 +1,2 @@
1
- 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;
2
- //# sourceMappingURL=simple-password-field-BUzKJ0fu.cjs.map
1
+ const e=require("./tanstack-form-Bae0TOEr.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;
2
+ //# sourceMappingURL=simple-password-field-DWmUR_5_.cjs.map
@@ -1 +1 @@
1
- {"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"}
1
+ {"version":3,"file":"simple-password-field-DWmUR_5_.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"}
@@ -1,2 +1,2 @@
1
- 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};
2
- //# sourceMappingURL=simple-radio-group-field-BM7HBTSs.mjs.map
1
+ import{G as e}from"./tanstack-form-AGwPfwiM.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};
2
+ //# sourceMappingURL=simple-radio-group-field-BNFgrTSb.mjs.map
@@ -1 +1 @@
1
- {"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"}
1
+ {"version":3,"file":"simple-radio-group-field-BNFgrTSb.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"}
@@ -1,2 +1,2 @@
1
- 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;
2
- //# sourceMappingURL=simple-radio-group-field-CCxUaYom.cjs.map
1
+ const e=require("./tanstack-form-Bae0TOEr.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;
2
+ //# sourceMappingURL=simple-radio-group-field-CpTX_Xoy.cjs.map
@@ -1 +1 @@
1
- {"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"}
1
+ {"version":3,"file":"simple-radio-group-field-CpTX_Xoy.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"}
@@ -1,2 +1,2 @@
1
- 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};
2
- //# sourceMappingURL=simple-select-field-CeTVQwmP.mjs.map
1
+ import{Button as e}from"./ui/button.mjs";import{G as t}from"./tanstack-form-AGwPfwiM.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};
2
+ //# sourceMappingURL=simple-select-field-CiUfRHCo.mjs.map