@fuf-stack/uniform 1.11.0 → 1.11.2
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.
- package/dist/Checkboxes/index.cjs +1 -1
- package/dist/Checkboxes/index.d.cts +1 -1
- package/dist/Checkboxes/index.d.ts +1 -1
- package/dist/Checkboxes/index.js +1 -1
- package/dist/{Checkboxes-CGWhnpBp.js → Checkboxes-BY4UK0Xf.js} +6 -6
- package/dist/Checkboxes-BY4UK0Xf.js.map +1 -0
- package/dist/{Checkboxes-Ds6bzl6p.cjs → Checkboxes-DgCK-Wq-.cjs} +18 -18
- package/dist/Checkboxes-DgCK-Wq-.cjs.map +1 -0
- package/dist/FieldArray/index.cjs +1 -1
- package/dist/FieldArray/index.d.cts +1 -1
- package/dist/FieldArray/index.d.ts +1 -1
- package/dist/FieldArray/index.js +1 -1
- package/dist/{FieldArray-D3iUaRLo.js → FieldArray-CDLaGvNj.js} +8 -8
- package/dist/FieldArray-CDLaGvNj.js.map +1 -0
- package/dist/{FieldArray-BexXN9bO.cjs → FieldArray-DBsyUQkU.cjs} +49 -49
- package/dist/FieldArray-DBsyUQkU.cjs.map +1 -0
- package/dist/FieldCard/index.cjs +1 -1
- package/dist/FieldCard/index.d.cts +1 -1
- package/dist/FieldCard/index.d.ts +1 -1
- package/dist/FieldCard/index.js +1 -1
- package/dist/{FieldCard-mpmErfDK.js → FieldCard-C1MCSbPW.js} +3 -3
- package/dist/{FieldCard-mpmErfDK.js.map → FieldCard-C1MCSbPW.js.map} +1 -1
- package/dist/{FieldCard-pP7aniZU.cjs → FieldCard-NKF358fO.cjs} +13 -13
- package/dist/{FieldCard-pP7aniZU.cjs.map → FieldCard-NKF358fO.cjs.map} +1 -1
- package/dist/{FieldCopyTestIdButton-AaLwu_8y.cjs → FieldCopyTestIdButton-BSYcSo2o.cjs} +10 -10
- package/dist/{FieldCopyTestIdButton-AaLwu_8y.cjs.map → FieldCopyTestIdButton-BSYcSo2o.cjs.map} +1 -1
- package/dist/{FieldCopyTestIdButton-Cx8AXJhO.js → FieldCopyTestIdButton-DWPCDJ-s.js} +4 -4
- package/dist/{FieldCopyTestIdButton-Cx8AXJhO.js.map → FieldCopyTestIdButton-DWPCDJ-s.js.map} +1 -1
- package/dist/{FieldValidationError-D86DPSOH.js → FieldValidationError-1hiDEFew.js} +4 -4
- package/dist/{FieldValidationError-D86DPSOH.js.map → FieldValidationError-1hiDEFew.js.map} +1 -1
- package/dist/{FieldValidationError-Cq6aI0tE.cjs → FieldValidationError-CE8R8qry.cjs} +13 -13
- package/dist/{FieldValidationError-Cq6aI0tE.cjs.map → FieldValidationError-CE8R8qry.cjs.map} +1 -1
- package/dist/Form/index.cjs +1 -1
- package/dist/Form/index.d.ts +1 -1
- package/dist/Form/index.js +1 -1
- package/dist/{Form-FvN3SXfF.cjs → Form-BsD69fql.cjs} +19 -19
- package/dist/{Form-FvN3SXfF.cjs.map → Form-BsD69fql.cjs.map} +1 -1
- package/dist/{Form-CFmCTl60.js → Form-DRNEwHsi.js} +4 -4
- package/dist/{Form-CFmCTl60.js.map → Form-DRNEwHsi.js.map} +1 -1
- package/dist/{FormContext-C3GymQOA.cjs → FormContext-Bb6d8hdG.cjs} +8 -8
- package/dist/FormContext-Bb6d8hdG.cjs.map +1 -0
- package/dist/FormContext-CN9n_KdE.js.map +1 -1
- package/dist/Grid/index.cjs +1 -1
- package/dist/Grid/index.d.cts +1 -1
- package/dist/Grid/index.d.ts +1 -1
- package/dist/Grid/index.js +1 -1
- package/dist/{Grid-DG60vYYG.cjs → Grid-D84e76CE.cjs} +8 -8
- package/dist/{Grid-DG60vYYG.cjs.map → Grid-D84e76CE.cjs.map} +1 -1
- package/dist/{Grid-DEH7Sezi.js → Grid-LRjQlZms.js} +4 -4
- package/dist/{Grid-DEH7Sezi.js.map → Grid-LRjQlZms.js.map} +1 -1
- package/dist/Input/index.cjs +1 -1
- package/dist/Input/index.d.cts +1 -1
- package/dist/Input/index.d.ts +1 -1
- package/dist/Input/index.js +1 -1
- package/dist/{Input--h5t7Sbl.js → Input-DXMWGTBh.js} +5 -5
- package/dist/Input-DXMWGTBh.js.map +1 -0
- package/dist/{Input-DKfFFOpo.cjs → Input-DeTpxiK_.cjs} +15 -15
- package/dist/Input-DeTpxiK_.cjs.map +1 -0
- package/dist/RadioBoxes/index.cjs +1 -1
- package/dist/RadioBoxes/index.d.cts +1 -1
- package/dist/RadioBoxes/index.d.ts +1 -1
- package/dist/RadioBoxes/index.js +1 -1
- package/dist/{RadioBoxes-7qdHj3ti.js → RadioBoxes-BEln4a-B.js} +5 -5
- package/dist/RadioBoxes-BEln4a-B.js.map +1 -0
- package/dist/{RadioBoxes-Bd9ahl4i.cjs → RadioBoxes-gsQGqQCd.cjs} +22 -22
- package/dist/RadioBoxes-gsQGqQCd.cjs.map +1 -0
- package/dist/RadioTabs/index.cjs +1 -1
- package/dist/RadioTabs/index.d.cts +1 -1
- package/dist/RadioTabs/index.d.ts +1 -1
- package/dist/RadioTabs/index.js +1 -1
- package/dist/{RadioTabs-DcEUdW7r.cjs → RadioTabs-BYpP0tKA.cjs} +18 -18
- package/dist/RadioTabs-BYpP0tKA.cjs.map +1 -0
- package/dist/{RadioTabs-DXs98jng.js → RadioTabs-DLr9QiXI.js} +5 -5
- package/dist/RadioTabs-DLr9QiXI.js.map +1 -0
- package/dist/Radios/index.cjs +1 -1
- package/dist/Radios/index.d.cts +1 -1
- package/dist/Radios/index.d.ts +1 -1
- package/dist/Radios/index.js +1 -1
- package/dist/{Radios-CIPNqPzi.cjs → Radios-BCOfnTke.cjs} +14 -14
- package/dist/{Radios-CIPNqPzi.cjs.map → Radios-BCOfnTke.cjs.map} +1 -1
- package/dist/{Radios-BIx06mzU.js → Radios-DCXI2kMf.js} +5 -5
- package/dist/{Radios-BIx06mzU.js.map → Radios-DCXI2kMf.js.map} +1 -1
- package/dist/Select/index.cjs +1 -1
- package/dist/Select/index.d.cts +1 -1
- package/dist/Select/index.d.ts +1 -1
- package/dist/Select/index.js +1 -1
- package/dist/{Select-CBjqYDcs.js → Select-CyfEmWiD.js} +5 -5
- package/dist/Select-CyfEmWiD.js.map +1 -0
- package/dist/{Select-BsL7qn2v.cjs → Select-KnPGOO27.cjs} +19 -19
- package/dist/Select-KnPGOO27.cjs.map +1 -0
- package/dist/Slider/index.cjs +1 -1
- package/dist/Slider/index.d.cts +1 -1
- package/dist/Slider/index.d.ts +1 -1
- package/dist/Slider/index.js +1 -1
- package/dist/{Slider-BDLbD7d5.cjs → Slider-C7xxYPgR.cjs} +15 -15
- package/dist/{Slider-BDLbD7d5.cjs.map → Slider-C7xxYPgR.cjs.map} +1 -1
- package/dist/{Slider-BHjHSoIk.js → Slider-Dlhb-9hC.js} +5 -5
- package/dist/{Slider-BHjHSoIk.js.map → Slider-Dlhb-9hC.js.map} +1 -1
- package/dist/SubmitButton/index.cjs +1 -1
- package/dist/SubmitButton/index.d.cts +1 -1
- package/dist/SubmitButton/index.d.ts +1 -1
- package/dist/SubmitButton/index.js +1 -1
- package/dist/{SubmitButton-7iOaKzhB.js → SubmitButton-C5f6j0N4.js} +4 -4
- package/dist/{SubmitButton-7iOaKzhB.js.map → SubmitButton-C5f6j0N4.js.map} +1 -1
- package/dist/{SubmitButton-DhtPJuro.cjs → SubmitButton-CUBItcBn.cjs} +12 -12
- package/dist/{SubmitButton-DhtPJuro.cjs.map → SubmitButton-CUBItcBn.cjs.map} +1 -1
- package/dist/Switch/index.cjs +1 -1
- package/dist/Switch/index.d.cts +1 -1
- package/dist/Switch/index.d.ts +1 -1
- package/dist/Switch/index.js +1 -1
- package/dist/{Switch-DCxAgt_L.js → Switch--m02Xcq8.js} +5 -5
- package/dist/{Switch-DCxAgt_L.js.map → Switch--m02Xcq8.js.map} +1 -1
- package/dist/{Switch-Dczzog3v.cjs → Switch-6LyeZHJh.cjs} +15 -15
- package/dist/{Switch-Dczzog3v.cjs.map → Switch-6LyeZHJh.cjs.map} +1 -1
- package/dist/SwitchBox/index.cjs +1 -1
- package/dist/SwitchBox/index.d.cts +1 -1
- package/dist/SwitchBox/index.d.ts +1 -1
- package/dist/SwitchBox/index.js +1 -1
- package/dist/{SwitchBox-DqVmZYId.cjs → SwitchBox-CtGiQdys.cjs} +19 -19
- package/dist/{SwitchBox-DqVmZYId.cjs.map → SwitchBox-CtGiQdys.cjs.map} +1 -1
- package/dist/{SwitchBox-DPHryDOM.js → SwitchBox-D0-e-pbM.js} +5 -5
- package/dist/{SwitchBox-DPHryDOM.js.map → SwitchBox-D0-e-pbM.js.map} +1 -1
- package/dist/TextArea/index.cjs +1 -1
- package/dist/TextArea/index.d.cts +1 -1
- package/dist/TextArea/index.d.ts +1 -1
- package/dist/TextArea/index.js +1 -1
- package/dist/{TextArea-BR6e-Fio.js → TextArea-BiSnvJ69.js} +5 -5
- package/dist/{TextArea-BR6e-Fio.js.map → TextArea-BiSnvJ69.js.map} +1 -1
- package/dist/{TextArea-CH-F6_ax.cjs → TextArea-PtdSABZS.cjs} +13 -13
- package/dist/{TextArea-CH-F6_ax.cjs.map → TextArea-PtdSABZS.cjs.map} +1 -1
- package/dist/helpers/index.cjs +1 -1
- package/dist/helpers-B-CJOBt3.js.map +1 -1
- package/dist/{helpers-KTgXi0lA.cjs → helpers-B84E9vHd.cjs} +4 -4
- package/dist/helpers-B84E9vHd.cjs.map +1 -0
- package/dist/hooks/useClientValidation/index.cjs +1 -1
- package/dist/hooks/useClientValidation/index.d.cts +1 -1
- package/dist/hooks/useClientValidation/index.d.ts +1 -1
- package/dist/hooks/useController/index.cjs +1 -1
- package/dist/hooks/useController/index.d.ts +0 -1
- package/dist/hooks/useFormContext/index.cjs +1 -1
- package/dist/hooks/useFormContext/index.d.cts +1 -1
- package/dist/hooks/useFormContext/index.d.ts +2 -2
- package/dist/hooks/useInput/index.cjs +3 -3
- package/dist/hooks/useInput/index.d.cts +1 -1
- package/dist/hooks/useInput/index.d.ts +1 -1
- package/dist/hooks/useInputValueDebounce/index.cjs +1 -1
- package/dist/hooks/useInputValueDebounce/index.d.cts +1 -1
- package/dist/hooks/useInputValueDebounce/index.d.ts +1 -1
- package/dist/hooks/useInputValueTransform/index.cjs +1 -1
- package/dist/hooks/useUniformField/index.cjs +1 -1
- package/dist/hooks/useUniformField/index.d.cts +1 -1
- package/dist/hooks/useUniformField/index.d.ts +3 -3
- package/dist/hooks/useUniformField/index.js +1 -1
- package/dist/hooks/useUniformFieldArray/index.cjs +1 -1
- package/dist/hooks/useUniformFieldArray/index.d.cts +1 -1
- package/dist/hooks/useUniformFieldArray/index.d.ts +24 -4
- package/dist/hooks/useUniformFieldArray/index.js +1 -1
- package/dist/hooks/useWatchUserChange/index.cjs +1 -1
- package/dist/{index-CzypMcVS.d.cts → index--E2ZsMya.d.ts} +6 -6
- package/dist/{index-C_ATGeaX.d.ts.map → index--E2ZsMya.d.ts.map} +1 -1
- package/dist/{index-C56I3SOi.d.cts → index-BITJ-CZL.d.cts} +4 -4
- package/dist/{index-C56I3SOi.d.cts.map → index-BITJ-CZL.d.cts.map} +1 -1
- package/dist/{index-CVY05bZf.d.ts → index-BL0DnIzh.d.ts} +3 -3
- package/dist/{index-CVY05bZf.d.ts.map → index-BL0DnIzh.d.ts.map} +1 -1
- package/dist/{index-CHmS3ri3.d.ts → index-BQDEnYTq.d.ts} +1 -1
- package/dist/{index-CHmS3ri3.d.ts.map → index-BQDEnYTq.d.ts.map} +1 -1
- package/dist/{index-DHHBSmJb.d.ts → index-BTTo_ufh.d.ts} +1 -1
- package/dist/{index-DHHBSmJb.d.ts.map → index-BTTo_ufh.d.ts.map} +1 -1
- package/dist/{index-B74QlCAy.d.cts → index-BWNJdLDV.d.ts} +48 -48
- package/dist/{index-B4Wkijem.d.ts.map → index-BWNJdLDV.d.ts.map} +1 -1
- package/dist/{index-CraZe1qS.d.ts → index-Bj_lpc5r.d.cts} +21 -21
- package/dist/{index-CI9QBUoM.d.cts.map → index-Bj_lpc5r.d.cts.map} +1 -1
- package/dist/{index-B4Wkijem.d.ts → index-Bo_n9sse.d.cts} +47 -47
- package/dist/{index-B74QlCAy.d.cts.map → index-Bo_n9sse.d.cts.map} +1 -1
- package/dist/{index-iuLEYAix.d.cts → index-BxA_pJWn.d.cts} +21 -21
- package/dist/{index-iuLEYAix.d.cts.map → index-BxA_pJWn.d.cts.map} +1 -1
- package/dist/{index-Drl7euco.d.ts → index-C-2nxT8D.d.ts} +21 -21
- package/dist/{index-Drl7euco.d.ts.map → index-C-2nxT8D.d.ts.map} +1 -1
- package/dist/{index-C1fYmoY0.d.ts → index-C0L7GvgN.d.cts} +34 -34
- package/dist/index-C0L7GvgN.d.cts.map +1 -0
- package/dist/{index-DzuP5q-2.d.ts → index-C1PUx1tH.d.ts} +6 -6
- package/dist/index-C1PUx1tH.d.ts.map +1 -0
- package/dist/index-CADnFWHq.d.ts +264 -0
- package/dist/{index-BTEsKen4.d.ts.map → index-CADnFWHq.d.ts.map} +1 -1
- package/dist/{index-BM4XWo1K.d.ts → index-CGnr_e53.d.ts} +36 -36
- package/dist/{index-BM4XWo1K.d.ts.map → index-CGnr_e53.d.ts.map} +1 -1
- package/dist/{index-DhMSgdwM.d.ts → index-CSBE6Et0.d.cts} +6 -6
- package/dist/{index-Dklb-p_1.d.cts.map → index-CSBE6Et0.d.cts.map} +1 -1
- package/dist/{index-D6RB3b5L.d.ts → index-CVnn6mEI.d.ts} +4 -4
- package/dist/{index-D6RB3b5L.d.ts.map → index-CVnn6mEI.d.ts.map} +1 -1
- package/dist/{index-BMN2XNyT.d.cts → index-CYdvpGJF.d.cts} +3 -3
- package/dist/{index-BMN2XNyT.d.cts.map → index-CYdvpGJF.d.cts.map} +1 -1
- package/dist/{index-CbAh0Kfo.d.cts → index-Cb0AgRRa.d.cts} +3 -3
- package/dist/{index-CbAh0Kfo.d.cts.map → index-Cb0AgRRa.d.cts.map} +1 -1
- package/dist/{index-DA5um0u6.d.cts → index-D38wOL-M.d.ts} +34 -34
- package/dist/index-D38wOL-M.d.ts.map +1 -0
- package/dist/{index-DpD4MxGD.d.cts → index-DG9C0kHA.d.ts} +35 -34
- package/dist/{index-RvYO46Vg.d.ts.map → index-DG9C0kHA.d.ts.map} +1 -1
- package/dist/{index-RvYO46Vg.d.ts → index-DNkZrb7P.d.cts} +35 -36
- package/dist/{index-DpD4MxGD.d.cts.map → index-DNkZrb7P.d.cts.map} +1 -1
- package/dist/{index-C_ATGeaX.d.ts → index-DRij_w43.d.cts} +5 -5
- package/dist/{index-CzypMcVS.d.cts.map → index-DRij_w43.d.cts.map} +1 -1
- package/dist/{index-Dklb-p_1.d.cts → index-DmMenZfj.d.ts} +5 -5
- package/dist/{index-DhMSgdwM.d.ts.map → index-DmMenZfj.d.ts.map} +1 -1
- package/dist/{index-CI9QBUoM.d.cts → index-DnzC0GCS.d.ts} +3 -3
- package/dist/index-DnzC0GCS.d.ts.map +1 -0
- package/dist/{index-BOI0cy-n.d.cts → index-DoS0lVRe.d.cts} +34 -34
- package/dist/index-DoS0lVRe.d.cts.map +1 -0
- package/dist/{index-aHcGnXHf.d.ts → index-DvB46QAb.d.ts} +3 -3
- package/dist/{index-aHcGnXHf.d.ts.map → index-DvB46QAb.d.ts.map} +1 -1
- package/dist/{index-BW9EUWZE.d.cts → index-DxdaxM3o.d.cts} +3 -3
- package/dist/{index-BW9EUWZE.d.cts.map → index-DxdaxM3o.d.cts.map} +1 -1
- package/dist/{index-CQWoxgWk.d.ts → index-Edx7MxXu.d.ts} +3 -3
- package/dist/{index-CQWoxgWk.d.ts.map → index-Edx7MxXu.d.ts.map} +1 -1
- package/dist/{index-BaBZGCqS.d.cts → index-F11geOHD.d.ts} +6 -6
- package/dist/{index-CvA5yKx9.d.ts.map → index-F11geOHD.d.ts.map} +1 -1
- package/dist/{index-1gPh6Uoh.d.cts → index-PU5WNOH9.d.cts} +3 -3
- package/dist/{index-1gPh6Uoh.d.cts.map → index-PU5WNOH9.d.cts.map} +1 -1
- package/dist/{index-CO-l7RmT.d.cts → index-WogV9uVV.d.cts} +6 -6
- package/dist/{index-CO-l7RmT.d.cts.map → index-WogV9uVV.d.cts.map} +1 -1
- package/dist/{index-CvA5yKx9.d.ts → index-oyX8xu0F.d.cts} +4 -4
- package/dist/{index-BaBZGCqS.d.cts.map → index-oyX8xu0F.d.cts.map} +1 -1
- package/dist/index-sJZ434Sg.d.cts +264 -0
- package/dist/index-sJZ434Sg.d.cts.map +1 -0
- package/dist/index.cjs +29 -29
- package/dist/index.d.cts +22 -22
- package/dist/index.d.ts +24 -25
- package/dist/index.js +19 -19
- package/dist/partials/FieldCopyTestIdButton/index.cjs +1 -1
- package/dist/partials/FieldCopyTestIdButton/index.d.cts +1 -1
- package/dist/partials/FieldCopyTestIdButton/index.d.ts +1 -1
- package/dist/partials/FieldCopyTestIdButton/index.js +1 -1
- package/dist/partials/FieldValidationError/index.cjs +1 -1
- package/dist/partials/FieldValidationError/index.d.cts +1 -1
- package/dist/partials/FieldValidationError/index.d.ts +1 -1
- package/dist/partials/FieldValidationError/index.js +1 -1
- package/dist/{useClientValidation-CkBtUSco.d.ts → useClientValidation-BQqwz628.d.cts} +3 -3
- package/dist/{useClientValidation-C3Q5UCy9.d.cts.map → useClientValidation-BQqwz628.d.cts.map} +1 -1
- package/dist/useClientValidation-BnnscAEe.js.map +1 -1
- package/dist/{useClientValidation-oZd4_ocQ.cjs → useClientValidation-CmYVGlLr.cjs} +7 -7
- package/dist/useClientValidation-CmYVGlLr.cjs.map +1 -0
- package/dist/{useClientValidation-C3Q5UCy9.d.cts → useClientValidation-DJ4JuN_9.d.ts} +3 -3
- package/dist/{useClientValidation-CkBtUSco.d.ts.map → useClientValidation-DJ4JuN_9.d.ts.map} +1 -1
- package/dist/{useController-BzkCcbSo.cjs → useController-CkmO5CLh.cjs} +3 -3
- package/dist/{useController-BzkCcbSo.cjs.map → useController-CkmO5CLh.cjs.map} +1 -1
- package/dist/{useFormContext-CZh7pv8f.d.cts → useFormContext-B083Y-kw.d.cts} +17 -17
- package/dist/{useFormContext-CZh7pv8f.d.cts.map → useFormContext-B083Y-kw.d.cts.map} +1 -1
- package/dist/{useFormContext-3AAPT6eZ.d.ts → useFormContext-B2TS6xq0.d.ts} +1 -1
- package/dist/{useFormContext-3AAPT6eZ.d.ts.map → useFormContext-B2TS6xq0.d.ts.map} +1 -1
- package/dist/{useFormContext-CWuN-_7P.cjs → useFormContext-Bp0EODoO.cjs} +3 -3
- package/dist/useFormContext-Bp0EODoO.cjs.map +1 -0
- package/dist/useFormContext-JCm1UR_e.js.map +1 -1
- package/dist/{useInputValueDebounce-B2RzCWty.d.cts → useInputValueDebounce-B5b-v8Hc.d.cts} +1 -1
- package/dist/{useInputValueDebounce-B2RzCWty.d.cts.map → useInputValueDebounce-B5b-v8Hc.d.cts.map} +1 -1
- package/dist/{useInputValueDebounce-tL8maIp8.cjs → useInputValueDebounce-BcUyaS94.cjs} +2 -2
- package/dist/{useInputValueDebounce-tL8maIp8.cjs.map → useInputValueDebounce-BcUyaS94.cjs.map} +1 -1
- package/dist/{useInputValueDebounce-C7_bvNGH.d.ts → useInputValueDebounce-DoRuSF6R.d.ts} +1 -1
- package/dist/{useInputValueDebounce-C7_bvNGH.d.ts.map → useInputValueDebounce-DoRuSF6R.d.ts.map} +1 -1
- package/dist/{useInputValueTransform-C-uSW8Y3.cjs → useInputValueTransform-DFPA3KVy.cjs} +2 -2
- package/dist/{useInputValueTransform-C-uSW8Y3.cjs.map → useInputValueTransform-DFPA3KVy.cjs.map} +1 -1
- package/dist/{useUniformField-Be3kdnhK.d.cts → useUniformField-B2OZ-Z1G.d.cts} +3 -3
- package/dist/{useUniformField-Be3kdnhK.d.cts.map → useUniformField-B2OZ-Z1G.d.cts.map} +1 -1
- package/dist/{useUniformField-BMvnRC_r.cjs → useUniformField-Bj23Kvbs.cjs} +13 -13
- package/dist/useUniformField-Bj23Kvbs.cjs.map +1 -0
- package/dist/{useUniformField-DDHQ5B11.d.ts → useUniformField-CwEHonNe.d.ts} +3 -3
- package/dist/{useUniformField-DDHQ5B11.d.ts.map → useUniformField-CwEHonNe.d.ts.map} +1 -1
- package/dist/{useUniformField-ClprfrES.js → useUniformField-gU4qYUwL.js} +3 -3
- package/dist/useUniformField-gU4qYUwL.js.map +1 -0
- package/dist/{useUniformFieldArray-C-0OXG3N.js → useUniformFieldArray-B5PyxL1P.js} +2 -2
- package/dist/{useUniformFieldArray-C-0OXG3N.js.map → useUniformFieldArray-B5PyxL1P.js.map} +1 -1
- package/dist/{useUniformFieldArray-BhPi3gPv.d.ts → useUniformFieldArray-CXoWvu6m.d.ts} +3 -3
- package/dist/{useUniformFieldArray-BhPi3gPv.d.ts.map → useUniformFieldArray-CXoWvu6m.d.ts.map} +1 -1
- package/dist/{useUniformFieldArray-btjvJdZ6.cjs → useUniformFieldArray-G1lokW7x.cjs} +7 -7
- package/dist/{useUniformFieldArray-btjvJdZ6.cjs.map → useUniformFieldArray-G1lokW7x.cjs.map} +1 -1
- package/dist/{useUniformFieldArray-BBFw08qL.d.cts → useUniformFieldArray-qtJMEosJ.d.cts} +13 -13
- package/dist/{useUniformFieldArray-BBFw08qL.d.cts.map → useUniformFieldArray-qtJMEosJ.d.cts.map} +1 -1
- package/dist/{useWatchUserChange-C5dr12By.cjs → useWatchUserChange-BnxYE-0b.cjs} +3 -3
- package/dist/{useWatchUserChange-C5dr12By.cjs.map → useWatchUserChange-BnxYE-0b.cjs.map} +1 -1
- package/package.json +10 -10
- package/dist/Checkboxes-CGWhnpBp.js.map +0 -1
- package/dist/Checkboxes-Ds6bzl6p.cjs.map +0 -1
- package/dist/FieldArray-BexXN9bO.cjs.map +0 -1
- package/dist/FieldArray-D3iUaRLo.js.map +0 -1
- package/dist/FormContext-C3GymQOA.cjs.map +0 -1
- package/dist/Input--h5t7Sbl.js.map +0 -1
- package/dist/Input-DKfFFOpo.cjs.map +0 -1
- package/dist/RadioBoxes-7qdHj3ti.js.map +0 -1
- package/dist/RadioBoxes-Bd9ahl4i.cjs.map +0 -1
- package/dist/RadioTabs-DXs98jng.js.map +0 -1
- package/dist/RadioTabs-DcEUdW7r.cjs.map +0 -1
- package/dist/Select-BsL7qn2v.cjs.map +0 -1
- package/dist/Select-CBjqYDcs.js.map +0 -1
- package/dist/helpers-KTgXi0lA.cjs.map +0 -1
- package/dist/index-BOI0cy-n.d.cts.map +0 -1
- package/dist/index-BTEsKen4.d.ts +0 -264
- package/dist/index-C1fYmoY0.d.ts.map +0 -1
- package/dist/index-CJNLQVjx.d.ts +0 -1
- package/dist/index-CqV2Q3da.d.cts +0 -264
- package/dist/index-CqV2Q3da.d.cts.map +0 -1
- package/dist/index-CraZe1qS.d.ts.map +0 -1
- package/dist/index-CwSIy_W-.d.cts +0 -1
- package/dist/index-DA5um0u6.d.cts.map +0 -1
- package/dist/index-DzuP5q-2.d.ts.map +0 -1
- package/dist/useClientValidation-oZd4_ocQ.cjs.map +0 -1
- package/dist/useFormContext-CWuN-_7P.cjs.map +0 -1
- package/dist/useUniformField-BMvnRC_r.cjs.map +0 -1
- package/dist/useUniformField-ClprfrES.js.map +0 -1
- /package/dist/{index-B3Z8gdjC.d.ts → index-BRLjimYW.d.ts} +0 -0
- /package/dist/{index-BXpMZvwA.d.cts → index-DpEKQcoR.d.cts} +0 -0
- /package/dist/{useInput-IGJqJ2tR.d.ts → useInput--wjwIBc5.d.cts} +0 -0
- /package/dist/{useInput-NMHJNZ5A.d.cts → useInput-BCdeYOOg.d.ts} +0 -0
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
const require_FormContext = require('./FormContext-
|
|
2
|
-
const require_useFormContext = require('./useFormContext-
|
|
3
|
-
let
|
|
1
|
+
const require_FormContext = require('./FormContext-Bb6d8hdG.cjs');
|
|
2
|
+
const require_useFormContext = require('./useFormContext-Bp0EODoO.cjs');
|
|
3
|
+
let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
|
|
4
4
|
let react = require("react");
|
|
5
5
|
let react_icons_fa6 = require("react-icons/fa6");
|
|
6
6
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
7
7
|
let react_icons_fa = require("react-icons/fa");
|
|
8
|
-
let
|
|
9
|
-
let
|
|
10
|
-
let
|
|
8
|
+
let _fuf_stack_pixels_Button = require("@fuf-stack/pixels/Button");
|
|
9
|
+
let _fuf_stack_pixels_Card = require("@fuf-stack/pixels/Card");
|
|
10
|
+
let _fuf_stack_pixels_Json = require("@fuf-stack/pixels/Json");
|
|
11
11
|
require("@fuf-stack/pixels/Json.css");
|
|
12
12
|
|
|
13
13
|
//#region src/Form/subcomponents/FormDebugViewer.tsx
|
|
@@ -31,7 +31,7 @@ const FormDebugViewer = ({ className = void 0 }) => {
|
|
|
31
31
|
subscription();
|
|
32
32
|
};
|
|
33
33
|
}, [showDebugCard]);
|
|
34
|
-
if (showDebugButton) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
34
|
+
if (showDebugButton) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_fuf_stack_pixels_Button.Button, {
|
|
35
35
|
ariaLabel: "Enable form debug mode",
|
|
36
36
|
className: "fixed bottom-2.5 right-2.5 w-5 text-default-400",
|
|
37
37
|
icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_fa6.FaBug, {}),
|
|
@@ -41,14 +41,14 @@ const FormDebugViewer = ({ className = void 0 }) => {
|
|
|
41
41
|
}
|
|
42
42
|
});
|
|
43
43
|
if (!showDebugCard) return null;
|
|
44
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(
|
|
45
|
-
className: (0,
|
|
44
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_fuf_stack_pixels_Card.Card, {
|
|
45
|
+
className: (0, _fuf_stack_pixel_utils.cn)(className),
|
|
46
46
|
header: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
47
47
|
className: "flex w-full flex-row justify-between",
|
|
48
48
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
49
49
|
className: "text-lg",
|
|
50
50
|
children: "Debug Mode"
|
|
51
|
-
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
51
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_fuf_stack_pixels_Button.Button, {
|
|
52
52
|
color: "danger",
|
|
53
53
|
icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_fa.FaTimes, {}),
|
|
54
54
|
size: "sm",
|
|
@@ -58,7 +58,7 @@ const FormDebugViewer = ({ className = void 0 }) => {
|
|
|
58
58
|
}
|
|
59
59
|
})]
|
|
60
60
|
}),
|
|
61
|
-
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
61
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_fuf_stack_pixels_Button.Button, {
|
|
62
62
|
className: "mb-4 ml-auto mr-auto",
|
|
63
63
|
icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_fa6.FaBullseye, {}),
|
|
64
64
|
variant: showDebugTestIds ? "solid" : "light",
|
|
@@ -66,7 +66,7 @@ const FormDebugViewer = ({ className = void 0 }) => {
|
|
|
66
66
|
setDebugMode(debugMode === "debug" ? "debug-testids" : "debug");
|
|
67
67
|
},
|
|
68
68
|
children: showDebugTestIds ? "Hide CopyButton" : "Show CopyButton"
|
|
69
|
-
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
69
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_fuf_stack_pixels_Json.Json, { value: {
|
|
70
70
|
values,
|
|
71
71
|
errors: errors ?? null,
|
|
72
72
|
submit: {
|
|
@@ -97,9 +97,9 @@ const Form = ({ children, className = void 0, debug = void 0, initialValues = vo
|
|
|
97
97
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
98
98
|
className: "flex w-full flex-row justify-between gap-6",
|
|
99
99
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("form", {
|
|
100
|
-
className: (0,
|
|
100
|
+
className: (0, _fuf_stack_pixel_utils.cn)("grow", className),
|
|
101
101
|
"data-form-is-valid": isValid,
|
|
102
|
-
"data-testid": (0,
|
|
102
|
+
"data-testid": (0, _fuf_stack_pixel_utils.slugify)(testId ?? name ?? ""),
|
|
103
103
|
name,
|
|
104
104
|
onSubmit: handleSubmit,
|
|
105
105
|
children
|
|
@@ -108,23 +108,23 @@ const Form = ({ children, className = void 0, debug = void 0, initialValues = vo
|
|
|
108
108
|
}
|
|
109
109
|
});
|
|
110
110
|
};
|
|
111
|
-
var Form_default = Form;
|
|
111
|
+
var Form_default$1 = Form;
|
|
112
112
|
|
|
113
113
|
//#endregion
|
|
114
114
|
//#region src/Form/index.ts
|
|
115
|
-
var Form_default
|
|
115
|
+
var Form_default = Form_default$1;
|
|
116
116
|
|
|
117
117
|
//#endregion
|
|
118
118
|
Object.defineProperty(exports, 'Form_default', {
|
|
119
119
|
enumerable: true,
|
|
120
120
|
get: function () {
|
|
121
|
-
return Form_default
|
|
121
|
+
return Form_default;
|
|
122
122
|
}
|
|
123
123
|
});
|
|
124
124
|
Object.defineProperty(exports, 'Form_default$1', {
|
|
125
125
|
enumerable: true,
|
|
126
126
|
get: function () {
|
|
127
|
-
return Form_default;
|
|
127
|
+
return Form_default$1;
|
|
128
128
|
}
|
|
129
129
|
});
|
|
130
|
-
//# sourceMappingURL=Form-
|
|
130
|
+
//# sourceMappingURL=Form-BsD69fql.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form-
|
|
1
|
+
{"version":3,"file":"Form-BsD69fql.cjs","names":["useFormContext","Button","FaBug","Card","FaTimes","FaBullseye","Json","FormProvider","FormDebugViewer","Form"],"sources":["../src/Form/subcomponents/FormDebugViewer.tsx","../src/Form/Form.tsx","../src/Form/index.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { FaTimes } from 'react-icons/fa';\nimport { FaBug, FaBullseye } from 'react-icons/fa6';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels/Button';\nimport { Card } from '@fuf-stack/pixels/Card';\nimport { Json } from '@fuf-stack/pixels/Json';\n\nimport { useFormContext } from '../../hooks/useFormContext';\n\n// import Json css (theme)\nimport '@fuf-stack/pixels/Json.css';\n\ninterface FormDebugViewerProps {\n /** CSS class name */\n className?: string;\n}\n\n/** Renders a form debug panel with information about the current form state */\nconst FormDebugViewer = ({ className = undefined }: FormDebugViewerProps) => {\n const {\n debugMode,\n formState: { isValid, isSubmitting, submitCount, isSubmitSuccessful },\n getValues,\n setDebugMode,\n validation: { errors },\n subscribe,\n } = useFormContext();\n\n const showDebugButton = debugMode === 'off';\n const showDebugCard = debugMode === 'debug' || debugMode === 'debug-testids';\n const showDebugTestIds = debugMode === 'debug-testids';\n\n // Use subscribe instead of watch() to avoid triggering re-renders on parent components.\n // This component manages its own state and only updates itself when form values change.\n const [values, setValues] = useState<Record<string, unknown>>({});\n\n useEffect(() => {\n // Only subscribe when debug card is visible\n if (!showDebugCard) {\n return undefined;\n }\n\n // Initialize with current values when debug card is opened\n setValues(getValues() ?? {});\n\n const subscription = subscribe({\n formState: { values: true },\n callback: (state) => {\n setValues(state.values ?? {});\n },\n });\n\n return () => {\n subscription();\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [showDebugCard]);\n\n if (showDebugButton) {\n return (\n <Button\n ariaLabel=\"Enable form debug mode\"\n className=\"fixed bottom-2.5 right-2.5 w-5 text-default-400\"\n icon={<FaBug />}\n variant=\"light\"\n onClick={() => {\n setDebugMode('debug');\n }}\n />\n );\n }\n\n // do not show card\n if (!showDebugCard) {\n return null;\n }\n\n return (\n <Card\n className={cn(className)}\n header={\n <div className=\"flex w-full flex-row justify-between\">\n <span className=\"text-lg\">Debug Mode</span>\n <Button\n color=\"danger\"\n icon={<FaTimes />}\n size=\"sm\"\n variant=\"light\"\n onClick={() => {\n setDebugMode('off');\n }}\n />\n </div>\n }\n >\n <Button\n className=\"mb-4 ml-auto mr-auto\"\n icon={<FaBullseye />}\n variant={showDebugTestIds ? 'solid' : 'light'}\n onClick={() => {\n setDebugMode(debugMode === 'debug' ? 'debug-testids' : 'debug');\n }}\n >\n {showDebugTestIds ? 'Hide CopyButton' : 'Show CopyButton'}\n </Button>\n <Json\n value={{\n values,\n errors: errors ?? null,\n submit: {\n isValid,\n isSubmitting,\n isSubmitSuccessful,\n submitCount,\n },\n }}\n />\n </Card>\n );\n};\n\nexport default FormDebugViewer;\n","import type { VetoInstance } from '@fuf-stack/veto';\nimport type { ReactNode } from 'react';\nimport type { FieldValues, SubmitHandler } from 'react-hook-form';\nimport type { DebugModeSettings } from './subcomponents/FormContext';\n\nimport { cn, slugify } from '@fuf-stack/pixel-utils';\n\nimport FormProvider from './subcomponents/FormContext';\nimport FormDebugViewer from './subcomponents/FormDebugViewer';\n\nconst IS_TEST = process.env.NODE_ENV === 'test';\n\nexport interface FormProps {\n /** form children */\n children: ReactNode | ReactNode[];\n /** CSS class name */\n className?: string | string[];\n /** settings for from debug mode */\n debug?: DebugModeSettings;\n /** initial form values */\n initialValues?: FieldValues;\n /** name of the form */\n name?: string;\n /** form submit handler */\n onSubmit: SubmitHandler<FieldValues>;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** veto validation schema */\n validation?: VetoInstance;\n /** when the validation should be triggered */\n validationTrigger?: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * Form component that has to wrap every uniform\n */\nconst Form = ({\n children,\n className = undefined,\n debug = undefined,\n initialValues = undefined,\n name = undefined,\n onSubmit,\n testId = undefined,\n validation = undefined,\n validationTrigger = 'all',\n}: FormProps) => {\n return (\n <FormProvider\n debugModeSettings={debug}\n initialValues={initialValues}\n onSubmit={onSubmit}\n validation={validation}\n validationTrigger={validationTrigger}\n >\n {({ handleSubmit, isValid }) => {\n return (\n <div className=\"flex w-full flex-row justify-between gap-6\">\n <form\n className={cn('grow', className)}\n data-form-is-valid={isValid}\n data-testid={slugify(testId ?? name ?? '')}\n name={name}\n onSubmit={handleSubmit}\n >\n {children}\n </form>\n {/* render debug viewer when not in test environment and debug not disabled */}\n {!IS_TEST && !debug?.disable && (\n <FormDebugViewer className=\"w-96 shrink\" />\n )}\n </div>\n );\n }}\n </FormProvider>\n );\n};\n\nexport default Form;\n","import Form from './Form';\n\nexport type { FormProps } from './Form';\n\nexport { Form };\n\nexport default Form;\n"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAM,mBAAmB,EAAE,YAAY,aAAsC;CAC3E,MAAM,EACJ,WACA,WAAW,EAAE,SAAS,cAAc,aAAa,sBACjD,WACA,cACA,YAAY,EAAE,UACd,cACEA,uCAAgB;CAEpB,MAAM,kBAAkB,cAAc;CACtC,MAAM,gBAAgB,cAAc,WAAW,cAAc;CAC7D,MAAM,mBAAmB,cAAc;CAIvC,MAAM,CAAC,QAAQ,iCAA+C,EAAE,CAAC;AAEjE,4BAAgB;AAEd,MAAI,CAAC,cACH;AAIF,YAAU,WAAW,IAAI,EAAE,CAAC;EAE5B,MAAM,eAAe,UAAU;GAC7B,WAAW,EAAE,QAAQ,MAAM;GAC3B,WAAW,UAAU;AACnB,cAAU,MAAM,UAAU,EAAE,CAAC;;GAEhC,CAAC;AAEF,eAAa;AACX,iBAAc;;IAGf,CAAC,cAAc,CAAC;AAEnB,KAAI,gBACF,QACE,2CAACC;EACC,WAAU;EACV,WAAU;EACV,MAAM,2CAACC,0BAAQ;EACf,SAAQ;EACR,eAAe;AACb,gBAAa,QAAQ;;GAEvB;AAKN,KAAI,CAAC,cACH,QAAO;AAGT,QACE,4CAACC;EACC,0CAAc,UAAU;EACxB,QACE,4CAAC;GAAI,WAAU;cACb,2CAAC;IAAK,WAAU;cAAU;KAAiB,EAC3C,2CAACF;IACC,OAAM;IACN,MAAM,2CAACG,2BAAU;IACjB,MAAK;IACL,SAAQ;IACR,eAAe;AACb,kBAAa,MAAM;;KAErB;IACE;aAGR,2CAACH;GACC,WAAU;GACV,MAAM,2CAACI,+BAAa;GACpB,SAAS,mBAAmB,UAAU;GACtC,eAAe;AACb,iBAAa,cAAc,UAAU,kBAAkB,QAAQ;;aAGhE,mBAAmB,oBAAoB;IACjC,EACT,2CAACC,+BACC,OAAO;GACL;GACA,QAAQ,UAAU;GAClB,QAAQ;IACN;IACA;IACA;IACA;IACD;GACF,GACD;GACG;;AAIX,8BAAe;;;;ACjHf,MAAM,UAAU,QAAQ,IAAI,aAAa;;;;AA0BzC,MAAM,QAAQ,EACZ,UACA,YAAY,QACZ,QAAQ,QACR,gBAAgB,QAChB,OAAO,QACP,UACA,SAAS,QACT,aAAa,QACb,oBAAoB,YACL;AACf,QACE,2CAACC;EACC,mBAAmB;EACJ;EACL;EACE;EACO;aAEjB,EAAE,cAAc,cAAc;AAC9B,UACE,4CAAC;IAAI,WAAU;eACb,2CAAC;KACC,0CAAc,QAAQ,UAAU;KAChC,sBAAoB;KACpB,mDAAqB,UAAU,QAAQ,GAAG;KACpC;KACN,UAAU;KAET;MACI,EAEN,CAAC,WAAW,CAAC,OAAO,WACnB,2CAACC,2BAAgB,WAAU,gBAAgB;KAEzC;;GAGG;;AAInB,qBAAe;;;;ACxEf,mBAAeC"}
|
|
@@ -108,12 +108,12 @@ const Form = ({ children, className = void 0, debug = void 0, initialValues = vo
|
|
|
108
108
|
}
|
|
109
109
|
});
|
|
110
110
|
};
|
|
111
|
-
var Form_default = Form;
|
|
111
|
+
var Form_default$1 = Form;
|
|
112
112
|
|
|
113
113
|
//#endregion
|
|
114
114
|
//#region src/Form/index.ts
|
|
115
|
-
var Form_default
|
|
115
|
+
var Form_default = Form_default$1;
|
|
116
116
|
|
|
117
117
|
//#endregion
|
|
118
|
-
export { Form_default as n, Form_default
|
|
119
|
-
//# sourceMappingURL=Form-
|
|
118
|
+
export { Form_default$1 as n, Form_default as t };
|
|
119
|
+
//# sourceMappingURL=Form-DRNEwHsi.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form-
|
|
1
|
+
{"version":3,"file":"Form-DRNEwHsi.js","names":["FormProvider","FormDebugViewer","Form"],"sources":["../src/Form/subcomponents/FormDebugViewer.tsx","../src/Form/Form.tsx","../src/Form/index.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { FaTimes } from 'react-icons/fa';\nimport { FaBug, FaBullseye } from 'react-icons/fa6';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels/Button';\nimport { Card } from '@fuf-stack/pixels/Card';\nimport { Json } from '@fuf-stack/pixels/Json';\n\nimport { useFormContext } from '../../hooks/useFormContext';\n\n// import Json css (theme)\nimport '@fuf-stack/pixels/Json.css';\n\ninterface FormDebugViewerProps {\n /** CSS class name */\n className?: string;\n}\n\n/** Renders a form debug panel with information about the current form state */\nconst FormDebugViewer = ({ className = undefined }: FormDebugViewerProps) => {\n const {\n debugMode,\n formState: { isValid, isSubmitting, submitCount, isSubmitSuccessful },\n getValues,\n setDebugMode,\n validation: { errors },\n subscribe,\n } = useFormContext();\n\n const showDebugButton = debugMode === 'off';\n const showDebugCard = debugMode === 'debug' || debugMode === 'debug-testids';\n const showDebugTestIds = debugMode === 'debug-testids';\n\n // Use subscribe instead of watch() to avoid triggering re-renders on parent components.\n // This component manages its own state and only updates itself when form values change.\n const [values, setValues] = useState<Record<string, unknown>>({});\n\n useEffect(() => {\n // Only subscribe when debug card is visible\n if (!showDebugCard) {\n return undefined;\n }\n\n // Initialize with current values when debug card is opened\n setValues(getValues() ?? {});\n\n const subscription = subscribe({\n formState: { values: true },\n callback: (state) => {\n setValues(state.values ?? {});\n },\n });\n\n return () => {\n subscription();\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [showDebugCard]);\n\n if (showDebugButton) {\n return (\n <Button\n ariaLabel=\"Enable form debug mode\"\n className=\"fixed bottom-2.5 right-2.5 w-5 text-default-400\"\n icon={<FaBug />}\n variant=\"light\"\n onClick={() => {\n setDebugMode('debug');\n }}\n />\n );\n }\n\n // do not show card\n if (!showDebugCard) {\n return null;\n }\n\n return (\n <Card\n className={cn(className)}\n header={\n <div className=\"flex w-full flex-row justify-between\">\n <span className=\"text-lg\">Debug Mode</span>\n <Button\n color=\"danger\"\n icon={<FaTimes />}\n size=\"sm\"\n variant=\"light\"\n onClick={() => {\n setDebugMode('off');\n }}\n />\n </div>\n }\n >\n <Button\n className=\"mb-4 ml-auto mr-auto\"\n icon={<FaBullseye />}\n variant={showDebugTestIds ? 'solid' : 'light'}\n onClick={() => {\n setDebugMode(debugMode === 'debug' ? 'debug-testids' : 'debug');\n }}\n >\n {showDebugTestIds ? 'Hide CopyButton' : 'Show CopyButton'}\n </Button>\n <Json\n value={{\n values,\n errors: errors ?? null,\n submit: {\n isValid,\n isSubmitting,\n isSubmitSuccessful,\n submitCount,\n },\n }}\n />\n </Card>\n );\n};\n\nexport default FormDebugViewer;\n","import type { VetoInstance } from '@fuf-stack/veto';\nimport type { ReactNode } from 'react';\nimport type { FieldValues, SubmitHandler } from 'react-hook-form';\nimport type { DebugModeSettings } from './subcomponents/FormContext';\n\nimport { cn, slugify } from '@fuf-stack/pixel-utils';\n\nimport FormProvider from './subcomponents/FormContext';\nimport FormDebugViewer from './subcomponents/FormDebugViewer';\n\nconst IS_TEST = process.env.NODE_ENV === 'test';\n\nexport interface FormProps {\n /** form children */\n children: ReactNode | ReactNode[];\n /** CSS class name */\n className?: string | string[];\n /** settings for from debug mode */\n debug?: DebugModeSettings;\n /** initial form values */\n initialValues?: FieldValues;\n /** name of the form */\n name?: string;\n /** form submit handler */\n onSubmit: SubmitHandler<FieldValues>;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** veto validation schema */\n validation?: VetoInstance;\n /** when the validation should be triggered */\n validationTrigger?: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * Form component that has to wrap every uniform\n */\nconst Form = ({\n children,\n className = undefined,\n debug = undefined,\n initialValues = undefined,\n name = undefined,\n onSubmit,\n testId = undefined,\n validation = undefined,\n validationTrigger = 'all',\n}: FormProps) => {\n return (\n <FormProvider\n debugModeSettings={debug}\n initialValues={initialValues}\n onSubmit={onSubmit}\n validation={validation}\n validationTrigger={validationTrigger}\n >\n {({ handleSubmit, isValid }) => {\n return (\n <div className=\"flex w-full flex-row justify-between gap-6\">\n <form\n className={cn('grow', className)}\n data-form-is-valid={isValid}\n data-testid={slugify(testId ?? name ?? '')}\n name={name}\n onSubmit={handleSubmit}\n >\n {children}\n </form>\n {/* render debug viewer when not in test environment and debug not disabled */}\n {!IS_TEST && !debug?.disable && (\n <FormDebugViewer className=\"w-96 shrink\" />\n )}\n </div>\n );\n }}\n </FormProvider>\n );\n};\n\nexport default Form;\n","import Form from './Form';\n\nexport type { FormProps } from './Form';\n\nexport { Form };\n\nexport default Form;\n"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAM,mBAAmB,EAAE,YAAY,aAAsC;CAC3E,MAAM,EACJ,WACA,WAAW,EAAE,SAAS,cAAc,aAAa,sBACjD,WACA,cACA,YAAY,EAAE,UACd,cACE,gBAAgB;CAEpB,MAAM,kBAAkB,cAAc;CACtC,MAAM,gBAAgB,cAAc,WAAW,cAAc;CAC7D,MAAM,mBAAmB,cAAc;CAIvC,MAAM,CAAC,QAAQ,aAAa,SAAkC,EAAE,CAAC;AAEjE,iBAAgB;AAEd,MAAI,CAAC,cACH;AAIF,YAAU,WAAW,IAAI,EAAE,CAAC;EAE5B,MAAM,eAAe,UAAU;GAC7B,WAAW,EAAE,QAAQ,MAAM;GAC3B,WAAW,UAAU;AACnB,cAAU,MAAM,UAAU,EAAE,CAAC;;GAEhC,CAAC;AAEF,eAAa;AACX,iBAAc;;IAGf,CAAC,cAAc,CAAC;AAEnB,KAAI,gBACF,QACE,oBAAC;EACC,WAAU;EACV,WAAU;EACV,MAAM,oBAAC,UAAQ;EACf,SAAQ;EACR,eAAe;AACb,gBAAa,QAAQ;;GAEvB;AAKN,KAAI,CAAC,cACH,QAAO;AAGT,QACE,qBAAC;EACC,WAAW,GAAG,UAAU;EACxB,QACE,qBAAC;GAAI,WAAU;cACb,oBAAC;IAAK,WAAU;cAAU;KAAiB,EAC3C,oBAAC;IACC,OAAM;IACN,MAAM,oBAAC,YAAU;IACjB,MAAK;IACL,SAAQ;IACR,eAAe;AACb,kBAAa,MAAM;;KAErB;IACE;aAGR,oBAAC;GACC,WAAU;GACV,MAAM,oBAAC,eAAa;GACpB,SAAS,mBAAmB,UAAU;GACtC,eAAe;AACb,iBAAa,cAAc,UAAU,kBAAkB,QAAQ;;aAGhE,mBAAmB,oBAAoB;IACjC,EACT,oBAAC,QACC,OAAO;GACL;GACA,QAAQ,UAAU;GAClB,QAAQ;IACN;IACA;IACA;IACA;IACD;GACF,GACD;GACG;;AAIX,8BAAe;;;;ACjHf,MAAM,UAAU,QAAQ,IAAI,aAAa;;;;AA0BzC,MAAM,QAAQ,EACZ,UACA,YAAY,QACZ,QAAQ,QACR,gBAAgB,QAChB,OAAO,QACP,UACA,SAAS,QACT,aAAa,QACb,oBAAoB,YACL;AACf,QACE,oBAACA;EACC,mBAAmB;EACJ;EACL;EACE;EACO;aAEjB,EAAE,cAAc,cAAc;AAC9B,UACE,qBAAC;IAAI,WAAU;eACb,oBAAC;KACC,WAAW,GAAG,QAAQ,UAAU;KAChC,sBAAoB;KACpB,eAAa,QAAQ,UAAU,QAAQ,GAAG;KACpC;KACN,UAAU;KAET;MACI,EAEN,CAAC,WAAW,CAAC,OAAO,WACnB,oBAACC,2BAAgB,WAAU,gBAAgB;KAEzC;;GAGG;;AAInB,qBAAe;;;;ACxEf,mBAAeC"}
|
|
@@ -25,15 +25,15 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
25
25
|
}) : target, mod));
|
|
26
26
|
|
|
27
27
|
//#endregion
|
|
28
|
-
const require_helpers = require('./helpers-
|
|
28
|
+
const require_helpers = require('./helpers-B84E9vHd.cjs');
|
|
29
29
|
let react = require("react");
|
|
30
30
|
react = __toESM(react);
|
|
31
|
-
let
|
|
31
|
+
let _fuf_stack_pixels = require("@fuf-stack/pixels");
|
|
32
32
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
33
33
|
let react_hook_form = require("react-hook-form");
|
|
34
34
|
let debug = require("debug");
|
|
35
35
|
debug = __toESM(debug);
|
|
36
|
-
let
|
|
36
|
+
let _fuf_stack_veto = require("@fuf-stack/veto");
|
|
37
37
|
|
|
38
38
|
//#region src/Form/subcomponents/FormResolver.ts
|
|
39
39
|
/**
|
|
@@ -85,10 +85,10 @@ const useExtendedValidation = (baseValidation) => {
|
|
|
85
85
|
if (!hasBaseValidation && !hasClientSchemas) return;
|
|
86
86
|
if (!hasClientSchemas) return baseValidation;
|
|
87
87
|
const clientSchemasCombined = clientSchemaValues.reduce((combined, clientSchema) => {
|
|
88
|
-
return combined ? (0,
|
|
88
|
+
return combined ? (0, _fuf_stack_veto.and)(combined, clientSchema) : clientSchema;
|
|
89
89
|
}, null);
|
|
90
|
-
if (hasBaseValidation && clientSchemasCombined) return (0,
|
|
91
|
-
if (clientSchemasCombined) return (0,
|
|
90
|
+
if (hasBaseValidation && clientSchemasCombined) return (0, _fuf_stack_veto.veto)((0, _fuf_stack_veto.and)(baseValidation.schema, clientSchemasCombined));
|
|
91
|
+
if (clientSchemasCombined) return (0, _fuf_stack_veto.veto)(clientSchemasCombined);
|
|
92
92
|
return baseValidation;
|
|
93
93
|
}, [baseValidation, clientSchemaValues]),
|
|
94
94
|
setClientValidationSchema
|
|
@@ -157,7 +157,7 @@ debug$1("UniformContext exported", {
|
|
|
157
157
|
* - React Hook Form context
|
|
158
158
|
*/
|
|
159
159
|
const FormProvider = ({ children, debugModeSettings = void 0, initialValues = void 0, onSubmit, validation: baseValidation = void 0, validationTrigger }) => {
|
|
160
|
-
const [debugMode, setDebugMode] = (0,
|
|
160
|
+
const [debugMode, setDebugMode] = (0, _fuf_stack_pixels.useLocalStorage)(debugModeSettings?.localStorageKey ?? DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT, "off");
|
|
161
161
|
const { extendedValidation, setClientValidationSchema } = useExtendedValidation(baseValidation);
|
|
162
162
|
const { resolver, validationErrors, validationErrorsHash } = useFormResolver(extendedValidation);
|
|
163
163
|
const methods = (0, react_hook_form.useForm)({
|
|
@@ -272,4 +272,4 @@ Object.defineProperty(exports, '__toESM', {
|
|
|
272
272
|
return __toESM;
|
|
273
273
|
}
|
|
274
274
|
});
|
|
275
|
-
//# sourceMappingURL=FormContext-
|
|
275
|
+
//# sourceMappingURL=FormContext-Bb6d8hdG.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormContext-Bb6d8hdG.cjs","names":["toValidationFormat","debug","React","toFormFormat","toValidationFormat","HookFormProvider"],"sources":["../src/Form/subcomponents/FormResolver.ts","../src/Form/subcomponents/FormContext.tsx"],"sourcesContent":["import type {\n VetoFormattedError,\n VetoInstance,\n VetoTypeAny,\n} from '@fuf-stack/veto';\nimport type { FieldValues } from 'react-hook-form';\n\nimport { useMemo, useRef, useState } from 'react';\n\nimport { and, veto } from '@fuf-stack/veto';\n\nimport { toValidationFormat } from '../../helpers';\n\n/**\n * Hook that manages client validation schemas state.\n *\n * Provides a centralized way to add/remove dynamic validation schemas\n * that can be combined with base form validation.\n *\n * @returns Object with client validation state and memoized setter function\n */\nexport const useClientValidationManager = () => {\n // Client validation schemas state\n const [clientValidationSchemas, setClientValidationSchemas] = useState<\n Record<string, VetoTypeAny>\n >({});\n\n // Memoized function to set/clear client validation schema\n const setClientValidationSchema = useMemo(() => {\n return (key: string, schema: VetoTypeAny | null) => {\n // update client validation schemas\n setClientValidationSchemas((prev) => {\n // if no schema and no existing client validation schema for this key, do nothing\n if (!prev[key] && !schema) {\n return prev;\n }\n // if no schema, remove the client validation schema for this key\n if (!schema) {\n const { [key]: _removed, ...rest } = prev;\n return rest;\n }\n // if schema, add or update the client validation schema for this key\n return { ...prev, [key]: schema };\n });\n };\n }, []);\n\n return {\n clientValidationSchemas,\n setClientValidationSchema,\n };\n};\n\n/**\n * Hook that creates an extended validation instance combining base Veto validation with dynamic client validation.\n *\n * @param baseValidation - Optional base Veto validation schema\n * @returns Combined validation instance and client schema setter\n */\nexport const useExtendedValidation = (baseValidation?: VetoInstance) => {\n // Setup client validation schemas\n const { clientValidationSchemas, setClientValidationSchema } =\n useClientValidationManager();\n\n // Create a stable dependency array from the client validation schemas\n const clientSchemaValues = useMemo(\n () => {\n const keys = Object.keys(clientValidationSchemas).sort();\n return keys\n .map((key) => {\n return clientValidationSchemas[key];\n })\n .filter(Boolean);\n },\n // Include the object identity to react to schema instance updates with same shape\n [clientValidationSchemas],\n );\n\n // Memoized extended validation instance\n const extendedValidation = useMemo(\n () => {\n const hasBaseValidation = !!baseValidation;\n const hasClientSchemas = clientSchemaValues.length > 0;\n\n // If no base validation and no client schemas, return undefined\n if (!hasBaseValidation && !hasClientSchemas) {\n return undefined;\n }\n\n // If no client schemas, return base validation\n if (!hasClientSchemas) {\n return baseValidation;\n }\n\n // Combine client validation schemas\n const clientSchemasCombined = clientSchemaValues.reduce(\n // @ts-expect-error is ok, because initially it is null\n (combined, clientSchema) => {\n return combined ? and(combined, clientSchema) : clientSchema;\n },\n null,\n );\n\n // return combined validation\n if (hasBaseValidation && clientSchemasCombined) {\n return veto(and(baseValidation.schema, clientSchemasCombined));\n }\n\n // If we only have client schemas, return them as a veto instance\n if (clientSchemasCombined) {\n return veto(clientSchemasCombined);\n }\n\n // This should not happen due to the conditions above, but just in case\n return baseValidation;\n },\n // Recompute when validation schema instances change\n [baseValidation, clientSchemaValues],\n );\n\n return {\n extendedValidation,\n setClientValidationSchema,\n };\n};\n\n/**\n * Hook that creates a React Hook Form resolver from an extended validation instance.\n *\n * @param extendedValidation - Extended validation instance from useExtendedValidation\n * @returns Object containing resolver function, current validation errors, and optimization hash\n */\nexport const useFormResolver = (extendedValidation?: VetoInstance) => {\n // Use ref to store validation errors without triggering re-renders\n const validationErrors = useRef<VetoFormattedError>(undefined);\n\n // Memoized resolver function for React Hook Form\n const resolver = useMemo(() => {\n if (!extendedValidation) {\n return undefined;\n }\n\n return async (values: FieldValues) => {\n const validationValues = toValidationFormat(values) ?? {};\n const result = await extendedValidation.validateAsync(validationValues);\n validationErrors.current = result.errors ?? undefined;\n\n // Transform veto result to React Hook Form format\n return {\n values: result.data ?? {},\n errors: result.errors ?? {},\n };\n };\n }, [extendedValidation]);\n\n // Hash for memo dependency optimization in consuming components\n const validationErrorsHash = JSON.stringify(validationErrors.current);\n\n return {\n resolver,\n validationErrors: validationErrors.current,\n validationErrorsHash,\n };\n};\n","import type {\n VetoFormattedError,\n VetoInstance,\n VetoTypeAny,\n} from '@fuf-stack/veto';\nimport type { BaseSyntheticEvent, ReactNode } from 'react';\nimport type { FieldValues, Path, SubmitHandler } from 'react-hook-form';\n\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { FormProvider as HookFormProvider, useForm } from 'react-hook-form';\n\nimport createDebug from 'debug';\n\nimport { useLocalStorage } from '@fuf-stack/pixels';\n\nimport { toFormFormat, toValidationFormat } from '../../helpers';\nimport { useExtendedValidation, useFormResolver } from './FormResolver';\n\nconst debug = createDebug('uniform:FormContext');\n\ntype DebugMode = 'debug' | 'debug-testids' | 'off' | 'disabled';\n\nexport interface DebugModeSettings {\n /** disable form debug completely */\n disable?: boolean;\n /** custom localStorage key to save debug mode state */\n localStorageKey?: string;\n}\n\n/**\n * Listener function that gets called when a field changes due to user input\n */\nexport type UserChangeListener<TFieldValues extends object = object> = (\n fieldName: Path<TFieldValues>,\n value: unknown,\n) => void;\n\nconst DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT = 'uniform:debug-mode';\n\n/**\n * The `UniformContext` provides control over the form's submission behavior and may optionally include\n * a Veto validation schema for form validation.\n *\n * Specifically, this context offers:\n * 1. **Form Submission Control**: The `preventSubmit` function allows components to enable or disable\n * form submissions.\n * 2. **Optional Validation Schema**: The `validation` property may hold a Veto validation schema instance\n * that can be used to validate form fields and handle validation logic.\n * 3. **Client Validation**: The `setClientValidationSchema` function allows setting dynamic client-side\n * validation schemas that complement the base Veto validation.\n * 4. **User Change Tracking**: The `userChange` property provides a pub/sub system for tracking\n * user-initiated field changes (typing, clicking, selecting) - NOT programmatic changes like\n * form.reset() or form.setValue(). Used by the `useWatchUserChange` hook to enable reactive\n * field dependencies.\n *\n * This context is useful for components that need to interact with or control the form submission state,\n * or access the validation schema for managing form validation logic.\n *\n * IMPORTANT: Context Singleton Pattern for HMR (Hot Module Replacement)\n * =====================================================================\n *\n * We use a global window variable to ensure only ONE context instance exists across\n * hot module reloads during development. This is critical because:\n *\n * **The Problem:**\n * When using Vite/Storybook with Fast Refresh (HMR), editing this file causes it to\n * be re-evaluated. Each re-evaluation runs `React.createContext()` again, creating a\n * NEW context instance. This leads to \"context instance mismatch\":\n *\n * 1. FormProvider (provider) loads and uses context instance A\n * 2. File is edited, HMR triggers\n * 3. SubmitButton (consumer) hot-reloads and imports context instance B\n * 4. Provider writes to instance A, Consumer reads from instance B\n * 5. Result: Consumer sees default values (triggerSubmit = () => undefined)\n * 6. Clicking submit does nothing because it calls the empty default function\n *\n * **The Solution:**\n * By storing the context in `window.__UNIFORM_CONTEXT__`, we ensure:\n * - First load: Create context and store in window\n * - Subsequent HMRs: Reuse the same context from window\n * - All components always reference the SAME context instance\n * - Provider and consumers can properly communicate\n *\n * **Why This Is Safe:**\n * - Only affects development (production has no HMR)\n * - Context type never changes (same interface)\n * - React handles cleanup on unmount normally\n * - No memory leaks (context is lightweight)\n *\n * Without this pattern, you'd need to restart the dev server after every edit\n * to FormContext.tsx to ensure all components use the same context instance.\n */\n\n// Define the context type\ninterface UniformContextType {\n /** Form debug mode enabled or not */\n debugMode: DebugMode;\n /** settings for from debug mode */\n debugModeSettings?: DebugModeSettings;\n /** Function to update if the form can currently be submitted */\n preventSubmit: (prevent: boolean) => void;\n /** Setter to enable or disable form debug mode */\n setDebugMode: (debugMode: DebugMode) => void;\n /** Function to trigger form submit programmatically */\n triggerSubmit: (e?: BaseSyntheticEvent) => Promise<void> | void;\n /** User change tracking (user input only, not programmatic changes) */\n userChange: {\n /**\n * Subscribe to user field changes.\n * Returns an unsubscribe function.\n */\n subscribe: (listener: UserChangeListener) => () => void;\n /**\n * Notify all subscribers about a user field change.\n * Called from useController when user interacts with a field.\n */\n notify: (fieldName: string, value: unknown) => void;\n };\n /** Form validation configuration */\n validation: {\n /** Base validation schema instance (without client validation) */\n baseInstance?: VetoInstance;\n /** Veto validation schema instance for form validation */\n instance?: VetoInstance;\n /** Current validation errors in form */\n errors?: VetoFormattedError;\n /** Function to set client validation schema for a specific key */\n setClientValidationSchema: (\n key: string,\n schema: VetoTypeAny | null,\n ) => void;\n };\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nif (!(window as any).__UNIFORM_CONTEXT__) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (window as any).__UNIFORM_CONTEXT__ = React.createContext<UniformContextType>(\n {\n debugMode: 'off',\n preventSubmit: () => {\n return undefined;\n },\n setDebugMode: () => {\n return undefined;\n },\n triggerSubmit: () => {\n return undefined;\n },\n userChange: {\n subscribe: () => {\n return () => {\n return undefined;\n };\n },\n notify: () => {\n return undefined;\n },\n },\n validation: {\n setClientValidationSchema: () => {\n return undefined;\n },\n },\n },\n );\n debug('Creating new UniformContext instance');\n} else {\n debug(\n 'Reusing existing UniformContext instance from window.__UNIFORM_CONTEXT__',\n );\n}\n\n// Export the singleton context instance from window\n// This ensures all imports get the same context, even after HMR\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const UniformContext = (window as any)\n .__UNIFORM_CONTEXT__ as React.Context<UniformContextType>;\n\ndebug('UniformContext exported', {\n contextExists: !!UniformContext,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n windowContextExists: !!(window as any).__UNIFORM_CONTEXT__,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n contextsMatch: UniformContext === (window as any).__UNIFORM_CONTEXT__,\n});\n\n// Define props for the FormProvider component, extending HookForm's props\ninterface FormProviderProps {\n /** children form render function */\n children: (childProps: {\n handleSubmit: (e?: BaseSyntheticEvent) => Promise<void>;\n isValid: boolean;\n }) => ReactNode;\n /** settings for from debug mode */\n debugModeSettings?: DebugModeSettings;\n /** initial form values */\n initialValues?: FieldValues;\n /** form submit handler */\n onSubmit: SubmitHandler<FieldValues>;\n /** Veto validation schema instance */\n validation?: VetoInstance;\n /** when the validation should be triggered */\n validationTrigger: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * FormProvider component provides:\n * - Veto validation schema context\n * - Client validation schema management\n * - Submit handler with automatic data conversion and submission control with preventSubmit\n * - Form Debug Mode state\n * - React Hook Form context\n */\nconst FormProvider: React.FC<FormProviderProps> = ({\n children,\n debugModeSettings = undefined,\n initialValues = undefined,\n onSubmit,\n validation: baseValidation = undefined,\n validationTrigger,\n}) => {\n // Form Debug mode state is handled in the form context\n const [debugMode, setDebugMode] = useLocalStorage<DebugMode>(\n debugModeSettings?.localStorageKey ?? DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT,\n 'off',\n );\n\n // Create extended validation combining base + client validations\n const { extendedValidation, setClientValidationSchema } =\n useExtendedValidation(baseValidation);\n\n // Create resolver from extended validation + get current validation errors\n const { resolver, validationErrors, validationErrorsHash } =\n useFormResolver(extendedValidation);\n\n // Initialize react hook form with the resolver\n const methods = useForm({\n defaultValues: initialValues ? toFormFormat(initialValues) : initialValues,\n // set rhf mode\n // see: https://react-hook-form.com/docs/useform#mode\n mode: validationTrigger,\n resolver,\n });\n\n // Get isValid from React Hook Form's formState\n const isValid = methods.formState?.isValid;\n\n // Control if the form can currently be submitted\n const [preventSubmit, setPreventSubmit] = useState(false);\n\n // User change listener registry (stored in ref to avoid re-renders)\n const userChangeListenersRef = useRef<Set<UserChangeListener>>(new Set());\n\n // Subscribe to user changes\n const subscribeUserChange = useCallback(\n (listener: UserChangeListener): (() => void) => {\n userChangeListenersRef.current.add(listener);\n // Return cleanup function to unsubscribe\n return () => {\n userChangeListenersRef.current.delete(listener);\n };\n },\n [],\n );\n\n // Notify all subscribers about user change\n const notifyUserChange = useCallback(\n (fieldName: string, value: unknown): void => {\n // Notify all registered listeners\n userChangeListenersRef.current.forEach((listener) => {\n listener(fieldName as Path<object>, value);\n });\n },\n [],\n );\n\n // Create submit handler with automatic data conversion\n // eslint-disable-next-line consistent-return\n const handleSubmit = async (e?: React.BaseSyntheticEvent) => {\n debug('handleSubmit called', {\n preventSubmit,\n formStateIsValid: methods.formState.isValid,\n validationErrors: methods.formState.errors,\n validationTrigger,\n formValues: methods.getValues(),\n });\n\n // only prevent submit when form state is valid, because otherwise\n // submit will only trigger validation and add errors / focus invalid fields\n if (methods.formState.isValid && preventSubmit) {\n debug('⛔ Form submit PREVENTED', {\n formStateIsValid: methods.formState.isValid,\n preventSubmit,\n });\n console.warn(\n '[FormProvider] form submit was prevented because preventSubmit is true...',\n );\n e?.preventDefault();\n return Promise.resolve();\n }\n\n debug('✓ Form submit ALLOWED', {\n formStateIsValid: methods.formState.isValid,\n preventSubmit,\n reason: !methods.formState.isValid\n ? 'Form is invalid (will trigger validation and show errors)'\n : 'Form is valid and preventSubmit is false',\n });\n\n // Convert nullish strings and filter out empty values before submission\n const wrappedOnSubmit = (data: FieldValues, event?: BaseSyntheticEvent) => {\n const submitData = toValidationFormat(data) ?? {};\n debug('onSubmit callback called', { submitData });\n return onSubmit(submitData, event);\n };\n\n await methods.handleSubmit(wrappedOnSubmit)(e);\n\n debug('handleSubmit completed');\n };\n\n // Memoize the context value to prevent re-renders\n const contextValue = useMemo(\n () => {\n return {\n // set debugMode to disabled when debugModeSettings.disable is true\n // otherwise use current debug mode from localStorage\n debugMode: debugModeSettings?.disable ? 'disabled' : debugMode,\n preventSubmit: (prevent: boolean) => {\n debug('preventSubmit called', {\n previousValue: preventSubmit,\n newValue: prevent,\n formStateIsValid: methods.formState.isValid,\n validationErrors: methods.formState.errors,\n });\n setPreventSubmit(prevent);\n },\n setClientValidationSchema,\n setDebugMode,\n triggerSubmit: handleSubmit,\n userChange: {\n subscribe: subscribeUserChange,\n notify: notifyUserChange,\n },\n validation: {\n baseInstance: baseValidation,\n instance: extendedValidation,\n errors: validationErrors,\n setClientValidationSchema,\n },\n };\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [debugMode, debugModeSettings?.disable, validationErrorsHash],\n );\n\n return (\n <UniformContext.Provider value={contextValue}>\n {/* Spread all hook form props into HookFormProvider */}\n <HookFormProvider {...methods}>\n {children({ handleSubmit, isValid })}\n </HookFormProvider>\n </UniformContext.Provider>\n );\n};\n\nexport default FormProvider;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormContext-CN9n_KdE.js","names":["FormProvider: React.FC<FormProviderProps>","HookFormProvider","FormProvider"],"sources":["../src/Form/subcomponents/FormResolver.ts","../src/Form/subcomponents/FormContext.tsx"],"sourcesContent":["import type {\n VetoFormattedError,\n VetoInstance,\n VetoTypeAny,\n} from '@fuf-stack/veto';\nimport type { FieldValues } from 'react-hook-form';\n\nimport { useMemo, useRef, useState } from 'react';\n\nimport { and, veto } from '@fuf-stack/veto';\n\nimport { toValidationFormat } from '../../helpers';\n\n/**\n * Hook that manages client validation schemas state.\n *\n * Provides a centralized way to add/remove dynamic validation schemas\n * that can be combined with base form validation.\n *\n * @returns Object with client validation state and memoized setter function\n */\nexport const useClientValidationManager = () => {\n // Client validation schemas state\n const [clientValidationSchemas, setClientValidationSchemas] = useState<\n Record<string, VetoTypeAny>\n >({});\n\n // Memoized function to set/clear client validation schema\n const setClientValidationSchema = useMemo(() => {\n return (key: string, schema: VetoTypeAny | null) => {\n // update client validation schemas\n setClientValidationSchemas((prev) => {\n // if no schema and no existing client validation schema for this key, do nothing\n if (!prev[key] && !schema) {\n return prev;\n }\n // if no schema, remove the client validation schema for this key\n if (!schema) {\n const { [key]: _removed, ...rest } = prev;\n return rest;\n }\n // if schema, add or update the client validation schema for this key\n return { ...prev, [key]: schema };\n });\n };\n }, []);\n\n return {\n clientValidationSchemas,\n setClientValidationSchema,\n };\n};\n\n/**\n * Hook that creates an extended validation instance combining base Veto validation with dynamic client validation.\n *\n * @param baseValidation - Optional base Veto validation schema\n * @returns Combined validation instance and client schema setter\n */\nexport const useExtendedValidation = (baseValidation?: VetoInstance) => {\n // Setup client validation schemas\n const { clientValidationSchemas, setClientValidationSchema } =\n useClientValidationManager();\n\n // Create a stable dependency array from the client validation schemas\n const clientSchemaValues = useMemo(\n () => {\n const keys = Object.keys(clientValidationSchemas).sort();\n return keys\n .map((key) => {\n return clientValidationSchemas[key];\n })\n .filter(Boolean);\n },\n // Include the object identity to react to schema instance updates with same shape\n [clientValidationSchemas],\n );\n\n // Memoized extended validation instance\n const extendedValidation = useMemo(\n () => {\n const hasBaseValidation = !!baseValidation;\n const hasClientSchemas = clientSchemaValues.length > 0;\n\n // If no base validation and no client schemas, return undefined\n if (!hasBaseValidation && !hasClientSchemas) {\n return undefined;\n }\n\n // If no client schemas, return base validation\n if (!hasClientSchemas) {\n return baseValidation;\n }\n\n // Combine client validation schemas\n const clientSchemasCombined = clientSchemaValues.reduce(\n // @ts-expect-error is ok, because initially it is null\n (combined, clientSchema) => {\n return combined ? and(combined, clientSchema) : clientSchema;\n },\n null,\n );\n\n // return combined validation\n if (hasBaseValidation && clientSchemasCombined) {\n return veto(and(baseValidation.schema, clientSchemasCombined));\n }\n\n // If we only have client schemas, return them as a veto instance\n if (clientSchemasCombined) {\n return veto(clientSchemasCombined);\n }\n\n // This should not happen due to the conditions above, but just in case\n return baseValidation;\n },\n // Recompute when validation schema instances change\n [baseValidation, clientSchemaValues],\n );\n\n return {\n extendedValidation,\n setClientValidationSchema,\n };\n};\n\n/**\n * Hook that creates a React Hook Form resolver from an extended validation instance.\n *\n * @param extendedValidation - Extended validation instance from useExtendedValidation\n * @returns Object containing resolver function, current validation errors, and optimization hash\n */\nexport const useFormResolver = (extendedValidation?: VetoInstance) => {\n // Use ref to store validation errors without triggering re-renders\n const validationErrors = useRef<VetoFormattedError>(undefined);\n\n // Memoized resolver function for React Hook Form\n const resolver = useMemo(() => {\n if (!extendedValidation) {\n return undefined;\n }\n\n return async (values: FieldValues) => {\n const validationValues = toValidationFormat(values) ?? {};\n const result = await extendedValidation.validateAsync(validationValues);\n validationErrors.current = result.errors ?? undefined;\n\n // Transform veto result to React Hook Form format\n return {\n values: result.data ?? {},\n errors: result.errors ?? {},\n };\n };\n }, [extendedValidation]);\n\n // Hash for memo dependency optimization in consuming components\n const validationErrorsHash = JSON.stringify(validationErrors.current);\n\n return {\n resolver,\n validationErrors: validationErrors.current,\n validationErrorsHash,\n };\n};\n","import type {\n VetoFormattedError,\n VetoInstance,\n VetoTypeAny,\n} from '@fuf-stack/veto';\nimport type { BaseSyntheticEvent, ReactNode } from 'react';\nimport type { FieldValues, Path, SubmitHandler } from 'react-hook-form';\n\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { FormProvider as HookFormProvider, useForm } from 'react-hook-form';\n\nimport createDebug from 'debug';\n\nimport { useLocalStorage } from '@fuf-stack/pixels';\n\nimport { toFormFormat, toValidationFormat } from '../../helpers';\nimport { useExtendedValidation, useFormResolver } from './FormResolver';\n\nconst debug = createDebug('uniform:FormContext');\n\ntype DebugMode = 'debug' | 'debug-testids' | 'off' | 'disabled';\n\nexport interface DebugModeSettings {\n /** disable form debug completely */\n disable?: boolean;\n /** custom localStorage key to save debug mode state */\n localStorageKey?: string;\n}\n\n/**\n * Listener function that gets called when a field changes due to user input\n */\nexport type UserChangeListener<TFieldValues extends object = object> = (\n fieldName: Path<TFieldValues>,\n value: unknown,\n) => void;\n\nconst DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT = 'uniform:debug-mode';\n\n/**\n * The `UniformContext` provides control over the form's submission behavior and may optionally include\n * a Veto validation schema for form validation.\n *\n * Specifically, this context offers:\n * 1. **Form Submission Control**: The `preventSubmit` function allows components to enable or disable\n * form submissions.\n * 2. **Optional Validation Schema**: The `validation` property may hold a Veto validation schema instance\n * that can be used to validate form fields and handle validation logic.\n * 3. **Client Validation**: The `setClientValidationSchema` function allows setting dynamic client-side\n * validation schemas that complement the base Veto validation.\n * 4. **User Change Tracking**: The `userChange` property provides a pub/sub system for tracking\n * user-initiated field changes (typing, clicking, selecting) - NOT programmatic changes like\n * form.reset() or form.setValue(). Used by the `useWatchUserChange` hook to enable reactive\n * field dependencies.\n *\n * This context is useful for components that need to interact with or control the form submission state,\n * or access the validation schema for managing form validation logic.\n *\n * IMPORTANT: Context Singleton Pattern for HMR (Hot Module Replacement)\n * =====================================================================\n *\n * We use a global window variable to ensure only ONE context instance exists across\n * hot module reloads during development. This is critical because:\n *\n * **The Problem:**\n * When using Vite/Storybook with Fast Refresh (HMR), editing this file causes it to\n * be re-evaluated. Each re-evaluation runs `React.createContext()` again, creating a\n * NEW context instance. This leads to \"context instance mismatch\":\n *\n * 1. FormProvider (provider) loads and uses context instance A\n * 2. File is edited, HMR triggers\n * 3. SubmitButton (consumer) hot-reloads and imports context instance B\n * 4. Provider writes to instance A, Consumer reads from instance B\n * 5. Result: Consumer sees default values (triggerSubmit = () => undefined)\n * 6. Clicking submit does nothing because it calls the empty default function\n *\n * **The Solution:**\n * By storing the context in `window.__UNIFORM_CONTEXT__`, we ensure:\n * - First load: Create context and store in window\n * - Subsequent HMRs: Reuse the same context from window\n * - All components always reference the SAME context instance\n * - Provider and consumers can properly communicate\n *\n * **Why This Is Safe:**\n * - Only affects development (production has no HMR)\n * - Context type never changes (same interface)\n * - React handles cleanup on unmount normally\n * - No memory leaks (context is lightweight)\n *\n * Without this pattern, you'd need to restart the dev server after every edit\n * to FormContext.tsx to ensure all components use the same context instance.\n */\n\n// Define the context type\ninterface UniformContextType {\n /** Form debug mode enabled or not */\n debugMode: DebugMode;\n /** settings for from debug mode */\n debugModeSettings?: DebugModeSettings;\n /** Function to update if the form can currently be submitted */\n preventSubmit: (prevent: boolean) => void;\n /** Setter to enable or disable form debug mode */\n setDebugMode: (debugMode: DebugMode) => void;\n /** Function to trigger form submit programmatically */\n triggerSubmit: (e?: BaseSyntheticEvent) => Promise<void> | void;\n /** User change tracking (user input only, not programmatic changes) */\n userChange: {\n /**\n * Subscribe to user field changes.\n * Returns an unsubscribe function.\n */\n subscribe: (listener: UserChangeListener) => () => void;\n /**\n * Notify all subscribers about a user field change.\n * Called from useController when user interacts with a field.\n */\n notify: (fieldName: string, value: unknown) => void;\n };\n /** Form validation configuration */\n validation: {\n /** Base validation schema instance (without client validation) */\n baseInstance?: VetoInstance;\n /** Veto validation schema instance for form validation */\n instance?: VetoInstance;\n /** Current validation errors in form */\n errors?: VetoFormattedError;\n /** Function to set client validation schema for a specific key */\n setClientValidationSchema: (\n key: string,\n schema: VetoTypeAny | null,\n ) => void;\n };\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nif (!(window as any).__UNIFORM_CONTEXT__) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (window as any).__UNIFORM_CONTEXT__ = React.createContext<UniformContextType>(\n {\n debugMode: 'off',\n preventSubmit: () => {\n return undefined;\n },\n setDebugMode: () => {\n return undefined;\n },\n triggerSubmit: () => {\n return undefined;\n },\n userChange: {\n subscribe: () => {\n return () => {\n return undefined;\n };\n },\n notify: () => {\n return undefined;\n },\n },\n validation: {\n setClientValidationSchema: () => {\n return undefined;\n },\n },\n },\n );\n debug('Creating new UniformContext instance');\n} else {\n debug(\n 'Reusing existing UniformContext instance from window.__UNIFORM_CONTEXT__',\n );\n}\n\n// Export the singleton context instance from window\n// This ensures all imports get the same context, even after HMR\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const UniformContext = (window as any)\n .__UNIFORM_CONTEXT__ as React.Context<UniformContextType>;\n\ndebug('UniformContext exported', {\n contextExists: !!UniformContext,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n windowContextExists: !!(window as any).__UNIFORM_CONTEXT__,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n contextsMatch: UniformContext === (window as any).__UNIFORM_CONTEXT__,\n});\n\n// Define props for the FormProvider component, extending HookForm's props\ninterface FormProviderProps {\n /** children form render function */\n children: (childProps: {\n handleSubmit: (e?: BaseSyntheticEvent) => Promise<void>;\n isValid: boolean;\n }) => ReactNode;\n /** settings for from debug mode */\n debugModeSettings?: DebugModeSettings;\n /** initial form values */\n initialValues?: FieldValues;\n /** form submit handler */\n onSubmit: SubmitHandler<FieldValues>;\n /** Veto validation schema instance */\n validation?: VetoInstance;\n /** when the validation should be triggered */\n validationTrigger: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * FormProvider component provides:\n * - Veto validation schema context\n * - Client validation schema management\n * - Submit handler with automatic data conversion and submission control with preventSubmit\n * - Form Debug Mode state\n * - React Hook Form context\n */\nconst FormProvider: React.FC<FormProviderProps> = ({\n children,\n debugModeSettings = undefined,\n initialValues = undefined,\n onSubmit,\n validation: baseValidation = undefined,\n validationTrigger,\n}) => {\n // Form Debug mode state is handled in the form context\n const [debugMode, setDebugMode] = useLocalStorage<DebugMode>(\n debugModeSettings?.localStorageKey ?? DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT,\n 'off',\n );\n\n // Create extended validation combining base + client validations\n const { extendedValidation, setClientValidationSchema } =\n useExtendedValidation(baseValidation);\n\n // Create resolver from extended validation + get current validation errors\n const { resolver, validationErrors, validationErrorsHash } =\n useFormResolver(extendedValidation);\n\n // Initialize react hook form with the resolver\n const methods = useForm({\n defaultValues: initialValues ? toFormFormat(initialValues) : initialValues,\n // set rhf mode\n // see: https://react-hook-form.com/docs/useform#mode\n mode: validationTrigger,\n resolver,\n });\n\n // Get isValid from React Hook Form's formState\n const isValid = methods.formState?.isValid;\n\n // Control if the form can currently be submitted\n const [preventSubmit, setPreventSubmit] = useState(false);\n\n // User change listener registry (stored in ref to avoid re-renders)\n const userChangeListenersRef = useRef<Set<UserChangeListener>>(new Set());\n\n // Subscribe to user changes\n const subscribeUserChange = useCallback(\n (listener: UserChangeListener): (() => void) => {\n userChangeListenersRef.current.add(listener);\n // Return cleanup function to unsubscribe\n return () => {\n userChangeListenersRef.current.delete(listener);\n };\n },\n [],\n );\n\n // Notify all subscribers about user change\n const notifyUserChange = useCallback(\n (fieldName: string, value: unknown): void => {\n // Notify all registered listeners\n userChangeListenersRef.current.forEach((listener) => {\n listener(fieldName as Path<object>, value);\n });\n },\n [],\n );\n\n // Create submit handler with automatic data conversion\n // eslint-disable-next-line consistent-return\n const handleSubmit = async (e?: React.BaseSyntheticEvent) => {\n debug('handleSubmit called', {\n preventSubmit,\n formStateIsValid: methods.formState.isValid,\n validationErrors: methods.formState.errors,\n validationTrigger,\n formValues: methods.getValues(),\n });\n\n // only prevent submit when form state is valid, because otherwise\n // submit will only trigger validation and add errors / focus invalid fields\n if (methods.formState.isValid && preventSubmit) {\n debug('⛔ Form submit PREVENTED', {\n formStateIsValid: methods.formState.isValid,\n preventSubmit,\n });\n console.warn(\n '[FormProvider] form submit was prevented because preventSubmit is true...',\n );\n e?.preventDefault();\n return Promise.resolve();\n }\n\n debug('✓ Form submit ALLOWED', {\n formStateIsValid: methods.formState.isValid,\n preventSubmit,\n reason: !methods.formState.isValid\n ? 'Form is invalid (will trigger validation and show errors)'\n : 'Form is valid and preventSubmit is false',\n });\n\n // Convert nullish strings and filter out empty values before submission\n const wrappedOnSubmit = (data: FieldValues, event?: BaseSyntheticEvent) => {\n const submitData = toValidationFormat(data) ?? {};\n debug('onSubmit callback called', { submitData });\n return onSubmit(submitData, event);\n };\n\n await methods.handleSubmit(wrappedOnSubmit)(e);\n\n debug('handleSubmit completed');\n };\n\n // Memoize the context value to prevent re-renders\n const contextValue = useMemo(\n () => {\n return {\n // set debugMode to disabled when debugModeSettings.disable is true\n // otherwise use current debug mode from localStorage\n debugMode: debugModeSettings?.disable ? 'disabled' : debugMode,\n preventSubmit: (prevent: boolean) => {\n debug('preventSubmit called', {\n previousValue: preventSubmit,\n newValue: prevent,\n formStateIsValid: methods.formState.isValid,\n validationErrors: methods.formState.errors,\n });\n setPreventSubmit(prevent);\n },\n setClientValidationSchema,\n setDebugMode,\n triggerSubmit: handleSubmit,\n userChange: {\n subscribe: subscribeUserChange,\n notify: notifyUserChange,\n },\n validation: {\n baseInstance: baseValidation,\n instance: extendedValidation,\n errors: validationErrors,\n setClientValidationSchema,\n },\n };\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [debugMode, debugModeSettings?.disable, validationErrorsHash],\n );\n\n return (\n <UniformContext.Provider value={contextValue}>\n {/* Spread all hook form props into HookFormProvider */}\n <HookFormProvider {...methods}>\n {children({ handleSubmit, isValid })}\n </HookFormProvider>\n </UniformContext.Provider>\n );\n};\n\nexport default FormProvider;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"FormContext-CN9n_KdE.js","names":["FormProvider","HookFormProvider"],"sources":["../src/Form/subcomponents/FormResolver.ts","../src/Form/subcomponents/FormContext.tsx"],"sourcesContent":["import type {\n VetoFormattedError,\n VetoInstance,\n VetoTypeAny,\n} from '@fuf-stack/veto';\nimport type { FieldValues } from 'react-hook-form';\n\nimport { useMemo, useRef, useState } from 'react';\n\nimport { and, veto } from '@fuf-stack/veto';\n\nimport { toValidationFormat } from '../../helpers';\n\n/**\n * Hook that manages client validation schemas state.\n *\n * Provides a centralized way to add/remove dynamic validation schemas\n * that can be combined with base form validation.\n *\n * @returns Object with client validation state and memoized setter function\n */\nexport const useClientValidationManager = () => {\n // Client validation schemas state\n const [clientValidationSchemas, setClientValidationSchemas] = useState<\n Record<string, VetoTypeAny>\n >({});\n\n // Memoized function to set/clear client validation schema\n const setClientValidationSchema = useMemo(() => {\n return (key: string, schema: VetoTypeAny | null) => {\n // update client validation schemas\n setClientValidationSchemas((prev) => {\n // if no schema and no existing client validation schema for this key, do nothing\n if (!prev[key] && !schema) {\n return prev;\n }\n // if no schema, remove the client validation schema for this key\n if (!schema) {\n const { [key]: _removed, ...rest } = prev;\n return rest;\n }\n // if schema, add or update the client validation schema for this key\n return { ...prev, [key]: schema };\n });\n };\n }, []);\n\n return {\n clientValidationSchemas,\n setClientValidationSchema,\n };\n};\n\n/**\n * Hook that creates an extended validation instance combining base Veto validation with dynamic client validation.\n *\n * @param baseValidation - Optional base Veto validation schema\n * @returns Combined validation instance and client schema setter\n */\nexport const useExtendedValidation = (baseValidation?: VetoInstance) => {\n // Setup client validation schemas\n const { clientValidationSchemas, setClientValidationSchema } =\n useClientValidationManager();\n\n // Create a stable dependency array from the client validation schemas\n const clientSchemaValues = useMemo(\n () => {\n const keys = Object.keys(clientValidationSchemas).sort();\n return keys\n .map((key) => {\n return clientValidationSchemas[key];\n })\n .filter(Boolean);\n },\n // Include the object identity to react to schema instance updates with same shape\n [clientValidationSchemas],\n );\n\n // Memoized extended validation instance\n const extendedValidation = useMemo(\n () => {\n const hasBaseValidation = !!baseValidation;\n const hasClientSchemas = clientSchemaValues.length > 0;\n\n // If no base validation and no client schemas, return undefined\n if (!hasBaseValidation && !hasClientSchemas) {\n return undefined;\n }\n\n // If no client schemas, return base validation\n if (!hasClientSchemas) {\n return baseValidation;\n }\n\n // Combine client validation schemas\n const clientSchemasCombined = clientSchemaValues.reduce(\n // @ts-expect-error is ok, because initially it is null\n (combined, clientSchema) => {\n return combined ? and(combined, clientSchema) : clientSchema;\n },\n null,\n );\n\n // return combined validation\n if (hasBaseValidation && clientSchemasCombined) {\n return veto(and(baseValidation.schema, clientSchemasCombined));\n }\n\n // If we only have client schemas, return them as a veto instance\n if (clientSchemasCombined) {\n return veto(clientSchemasCombined);\n }\n\n // This should not happen due to the conditions above, but just in case\n return baseValidation;\n },\n // Recompute when validation schema instances change\n [baseValidation, clientSchemaValues],\n );\n\n return {\n extendedValidation,\n setClientValidationSchema,\n };\n};\n\n/**\n * Hook that creates a React Hook Form resolver from an extended validation instance.\n *\n * @param extendedValidation - Extended validation instance from useExtendedValidation\n * @returns Object containing resolver function, current validation errors, and optimization hash\n */\nexport const useFormResolver = (extendedValidation?: VetoInstance) => {\n // Use ref to store validation errors without triggering re-renders\n const validationErrors = useRef<VetoFormattedError>(undefined);\n\n // Memoized resolver function for React Hook Form\n const resolver = useMemo(() => {\n if (!extendedValidation) {\n return undefined;\n }\n\n return async (values: FieldValues) => {\n const validationValues = toValidationFormat(values) ?? {};\n const result = await extendedValidation.validateAsync(validationValues);\n validationErrors.current = result.errors ?? undefined;\n\n // Transform veto result to React Hook Form format\n return {\n values: result.data ?? {},\n errors: result.errors ?? {},\n };\n };\n }, [extendedValidation]);\n\n // Hash for memo dependency optimization in consuming components\n const validationErrorsHash = JSON.stringify(validationErrors.current);\n\n return {\n resolver,\n validationErrors: validationErrors.current,\n validationErrorsHash,\n };\n};\n","import type {\n VetoFormattedError,\n VetoInstance,\n VetoTypeAny,\n} from '@fuf-stack/veto';\nimport type { BaseSyntheticEvent, ReactNode } from 'react';\nimport type { FieldValues, Path, SubmitHandler } from 'react-hook-form';\n\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { FormProvider as HookFormProvider, useForm } from 'react-hook-form';\n\nimport createDebug from 'debug';\n\nimport { useLocalStorage } from '@fuf-stack/pixels';\n\nimport { toFormFormat, toValidationFormat } from '../../helpers';\nimport { useExtendedValidation, useFormResolver } from './FormResolver';\n\nconst debug = createDebug('uniform:FormContext');\n\ntype DebugMode = 'debug' | 'debug-testids' | 'off' | 'disabled';\n\nexport interface DebugModeSettings {\n /** disable form debug completely */\n disable?: boolean;\n /** custom localStorage key to save debug mode state */\n localStorageKey?: string;\n}\n\n/**\n * Listener function that gets called when a field changes due to user input\n */\nexport type UserChangeListener<TFieldValues extends object = object> = (\n fieldName: Path<TFieldValues>,\n value: unknown,\n) => void;\n\nconst DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT = 'uniform:debug-mode';\n\n/**\n * The `UniformContext` provides control over the form's submission behavior and may optionally include\n * a Veto validation schema for form validation.\n *\n * Specifically, this context offers:\n * 1. **Form Submission Control**: The `preventSubmit` function allows components to enable or disable\n * form submissions.\n * 2. **Optional Validation Schema**: The `validation` property may hold a Veto validation schema instance\n * that can be used to validate form fields and handle validation logic.\n * 3. **Client Validation**: The `setClientValidationSchema` function allows setting dynamic client-side\n * validation schemas that complement the base Veto validation.\n * 4. **User Change Tracking**: The `userChange` property provides a pub/sub system for tracking\n * user-initiated field changes (typing, clicking, selecting) - NOT programmatic changes like\n * form.reset() or form.setValue(). Used by the `useWatchUserChange` hook to enable reactive\n * field dependencies.\n *\n * This context is useful for components that need to interact with or control the form submission state,\n * or access the validation schema for managing form validation logic.\n *\n * IMPORTANT: Context Singleton Pattern for HMR (Hot Module Replacement)\n * =====================================================================\n *\n * We use a global window variable to ensure only ONE context instance exists across\n * hot module reloads during development. This is critical because:\n *\n * **The Problem:**\n * When using Vite/Storybook with Fast Refresh (HMR), editing this file causes it to\n * be re-evaluated. Each re-evaluation runs `React.createContext()` again, creating a\n * NEW context instance. This leads to \"context instance mismatch\":\n *\n * 1. FormProvider (provider) loads and uses context instance A\n * 2. File is edited, HMR triggers\n * 3. SubmitButton (consumer) hot-reloads and imports context instance B\n * 4. Provider writes to instance A, Consumer reads from instance B\n * 5. Result: Consumer sees default values (triggerSubmit = () => undefined)\n * 6. Clicking submit does nothing because it calls the empty default function\n *\n * **The Solution:**\n * By storing the context in `window.__UNIFORM_CONTEXT__`, we ensure:\n * - First load: Create context and store in window\n * - Subsequent HMRs: Reuse the same context from window\n * - All components always reference the SAME context instance\n * - Provider and consumers can properly communicate\n *\n * **Why This Is Safe:**\n * - Only affects development (production has no HMR)\n * - Context type never changes (same interface)\n * - React handles cleanup on unmount normally\n * - No memory leaks (context is lightweight)\n *\n * Without this pattern, you'd need to restart the dev server after every edit\n * to FormContext.tsx to ensure all components use the same context instance.\n */\n\n// Define the context type\ninterface UniformContextType {\n /** Form debug mode enabled or not */\n debugMode: DebugMode;\n /** settings for from debug mode */\n debugModeSettings?: DebugModeSettings;\n /** Function to update if the form can currently be submitted */\n preventSubmit: (prevent: boolean) => void;\n /** Setter to enable or disable form debug mode */\n setDebugMode: (debugMode: DebugMode) => void;\n /** Function to trigger form submit programmatically */\n triggerSubmit: (e?: BaseSyntheticEvent) => Promise<void> | void;\n /** User change tracking (user input only, not programmatic changes) */\n userChange: {\n /**\n * Subscribe to user field changes.\n * Returns an unsubscribe function.\n */\n subscribe: (listener: UserChangeListener) => () => void;\n /**\n * Notify all subscribers about a user field change.\n * Called from useController when user interacts with a field.\n */\n notify: (fieldName: string, value: unknown) => void;\n };\n /** Form validation configuration */\n validation: {\n /** Base validation schema instance (without client validation) */\n baseInstance?: VetoInstance;\n /** Veto validation schema instance for form validation */\n instance?: VetoInstance;\n /** Current validation errors in form */\n errors?: VetoFormattedError;\n /** Function to set client validation schema for a specific key */\n setClientValidationSchema: (\n key: string,\n schema: VetoTypeAny | null,\n ) => void;\n };\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nif (!(window as any).__UNIFORM_CONTEXT__) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (window as any).__UNIFORM_CONTEXT__ = React.createContext<UniformContextType>(\n {\n debugMode: 'off',\n preventSubmit: () => {\n return undefined;\n },\n setDebugMode: () => {\n return undefined;\n },\n triggerSubmit: () => {\n return undefined;\n },\n userChange: {\n subscribe: () => {\n return () => {\n return undefined;\n };\n },\n notify: () => {\n return undefined;\n },\n },\n validation: {\n setClientValidationSchema: () => {\n return undefined;\n },\n },\n },\n );\n debug('Creating new UniformContext instance');\n} else {\n debug(\n 'Reusing existing UniformContext instance from window.__UNIFORM_CONTEXT__',\n );\n}\n\n// Export the singleton context instance from window\n// This ensures all imports get the same context, even after HMR\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const UniformContext = (window as any)\n .__UNIFORM_CONTEXT__ as React.Context<UniformContextType>;\n\ndebug('UniformContext exported', {\n contextExists: !!UniformContext,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n windowContextExists: !!(window as any).__UNIFORM_CONTEXT__,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n contextsMatch: UniformContext === (window as any).__UNIFORM_CONTEXT__,\n});\n\n// Define props for the FormProvider component, extending HookForm's props\ninterface FormProviderProps {\n /** children form render function */\n children: (childProps: {\n handleSubmit: (e?: BaseSyntheticEvent) => Promise<void>;\n isValid: boolean;\n }) => ReactNode;\n /** settings for from debug mode */\n debugModeSettings?: DebugModeSettings;\n /** initial form values */\n initialValues?: FieldValues;\n /** form submit handler */\n onSubmit: SubmitHandler<FieldValues>;\n /** Veto validation schema instance */\n validation?: VetoInstance;\n /** when the validation should be triggered */\n validationTrigger: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * FormProvider component provides:\n * - Veto validation schema context\n * - Client validation schema management\n * - Submit handler with automatic data conversion and submission control with preventSubmit\n * - Form Debug Mode state\n * - React Hook Form context\n */\nconst FormProvider: React.FC<FormProviderProps> = ({\n children,\n debugModeSettings = undefined,\n initialValues = undefined,\n onSubmit,\n validation: baseValidation = undefined,\n validationTrigger,\n}) => {\n // Form Debug mode state is handled in the form context\n const [debugMode, setDebugMode] = useLocalStorage<DebugMode>(\n debugModeSettings?.localStorageKey ?? DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT,\n 'off',\n );\n\n // Create extended validation combining base + client validations\n const { extendedValidation, setClientValidationSchema } =\n useExtendedValidation(baseValidation);\n\n // Create resolver from extended validation + get current validation errors\n const { resolver, validationErrors, validationErrorsHash } =\n useFormResolver(extendedValidation);\n\n // Initialize react hook form with the resolver\n const methods = useForm({\n defaultValues: initialValues ? toFormFormat(initialValues) : initialValues,\n // set rhf mode\n // see: https://react-hook-form.com/docs/useform#mode\n mode: validationTrigger,\n resolver,\n });\n\n // Get isValid from React Hook Form's formState\n const isValid = methods.formState?.isValid;\n\n // Control if the form can currently be submitted\n const [preventSubmit, setPreventSubmit] = useState(false);\n\n // User change listener registry (stored in ref to avoid re-renders)\n const userChangeListenersRef = useRef<Set<UserChangeListener>>(new Set());\n\n // Subscribe to user changes\n const subscribeUserChange = useCallback(\n (listener: UserChangeListener): (() => void) => {\n userChangeListenersRef.current.add(listener);\n // Return cleanup function to unsubscribe\n return () => {\n userChangeListenersRef.current.delete(listener);\n };\n },\n [],\n );\n\n // Notify all subscribers about user change\n const notifyUserChange = useCallback(\n (fieldName: string, value: unknown): void => {\n // Notify all registered listeners\n userChangeListenersRef.current.forEach((listener) => {\n listener(fieldName as Path<object>, value);\n });\n },\n [],\n );\n\n // Create submit handler with automatic data conversion\n // eslint-disable-next-line consistent-return\n const handleSubmit = async (e?: React.BaseSyntheticEvent) => {\n debug('handleSubmit called', {\n preventSubmit,\n formStateIsValid: methods.formState.isValid,\n validationErrors: methods.formState.errors,\n validationTrigger,\n formValues: methods.getValues(),\n });\n\n // only prevent submit when form state is valid, because otherwise\n // submit will only trigger validation and add errors / focus invalid fields\n if (methods.formState.isValid && preventSubmit) {\n debug('⛔ Form submit PREVENTED', {\n formStateIsValid: methods.formState.isValid,\n preventSubmit,\n });\n console.warn(\n '[FormProvider] form submit was prevented because preventSubmit is true...',\n );\n e?.preventDefault();\n return Promise.resolve();\n }\n\n debug('✓ Form submit ALLOWED', {\n formStateIsValid: methods.formState.isValid,\n preventSubmit,\n reason: !methods.formState.isValid\n ? 'Form is invalid (will trigger validation and show errors)'\n : 'Form is valid and preventSubmit is false',\n });\n\n // Convert nullish strings and filter out empty values before submission\n const wrappedOnSubmit = (data: FieldValues, event?: BaseSyntheticEvent) => {\n const submitData = toValidationFormat(data) ?? {};\n debug('onSubmit callback called', { submitData });\n return onSubmit(submitData, event);\n };\n\n await methods.handleSubmit(wrappedOnSubmit)(e);\n\n debug('handleSubmit completed');\n };\n\n // Memoize the context value to prevent re-renders\n const contextValue = useMemo(\n () => {\n return {\n // set debugMode to disabled when debugModeSettings.disable is true\n // otherwise use current debug mode from localStorage\n debugMode: debugModeSettings?.disable ? 'disabled' : debugMode,\n preventSubmit: (prevent: boolean) => {\n debug('preventSubmit called', {\n previousValue: preventSubmit,\n newValue: prevent,\n formStateIsValid: methods.formState.isValid,\n validationErrors: methods.formState.errors,\n });\n setPreventSubmit(prevent);\n },\n setClientValidationSchema,\n setDebugMode,\n triggerSubmit: handleSubmit,\n userChange: {\n subscribe: subscribeUserChange,\n notify: notifyUserChange,\n },\n validation: {\n baseInstance: baseValidation,\n instance: extendedValidation,\n errors: validationErrors,\n setClientValidationSchema,\n },\n };\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [debugMode, debugModeSettings?.disable, validationErrorsHash],\n );\n\n return (\n <UniformContext.Provider value={contextValue}>\n {/* Spread all hook form props into HookFormProvider */}\n <HookFormProvider {...methods}>\n {children({ handleSubmit, isValid })}\n </HookFormProvider>\n </UniformContext.Provider>\n );\n};\n\nexport default FormProvider;\n"],"mappings":"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"}
|
package/dist/Grid/index.cjs
CHANGED
package/dist/Grid/index.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as GridProps, t as Grid } from "../index-
|
|
1
|
+
import { n as GridProps, t as Grid } from "../index-DxdaxM3o.cjs";
|
|
2
2
|
export { Grid, Grid as default, GridProps };
|
package/dist/Grid/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as GridProps, t as Grid } from "../index-
|
|
1
|
+
import { n as GridProps, t as Grid } from "../index-Edx7MxXu.js";
|
|
2
2
|
export { Grid, Grid as default, GridProps };
|
package/dist/Grid/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
const require_FormContext = require('./FormContext-
|
|
2
|
-
let
|
|
1
|
+
const require_FormContext = require('./FormContext-Bb6d8hdG.cjs');
|
|
2
|
+
let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
|
|
3
3
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
4
4
|
|
|
5
5
|
//#region src/Grid/Grid.tsx
|
|
@@ -8,28 +8,28 @@ let react_jsx_runtime = require("react/jsx-runtime");
|
|
|
8
8
|
*/
|
|
9
9
|
const Grid = ({ children = null, className = void 0, testId = void 0 }) => {
|
|
10
10
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
11
|
-
className: (0,
|
|
11
|
+
className: (0, _fuf_stack_pixel_utils.cn)("grid gap-4", className),
|
|
12
12
|
"data-testid": testId,
|
|
13
13
|
children
|
|
14
14
|
});
|
|
15
15
|
};
|
|
16
|
-
var Grid_default = Grid;
|
|
16
|
+
var Grid_default$1 = Grid;
|
|
17
17
|
|
|
18
18
|
//#endregion
|
|
19
19
|
//#region src/Grid/index.ts
|
|
20
|
-
var Grid_default
|
|
20
|
+
var Grid_default = Grid_default$1;
|
|
21
21
|
|
|
22
22
|
//#endregion
|
|
23
23
|
Object.defineProperty(exports, 'Grid_default', {
|
|
24
24
|
enumerable: true,
|
|
25
25
|
get: function () {
|
|
26
|
-
return Grid_default
|
|
26
|
+
return Grid_default;
|
|
27
27
|
}
|
|
28
28
|
});
|
|
29
29
|
Object.defineProperty(exports, 'Grid_default$1', {
|
|
30
30
|
enumerable: true,
|
|
31
31
|
get: function () {
|
|
32
|
-
return Grid_default;
|
|
32
|
+
return Grid_default$1;
|
|
33
33
|
}
|
|
34
34
|
});
|
|
35
|
-
//# sourceMappingURL=Grid-
|
|
35
|
+
//# sourceMappingURL=Grid-D84e76CE.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Grid-
|
|
1
|
+
{"version":3,"file":"Grid-D84e76CE.cjs","names":["Grid"],"sources":["../src/Grid/Grid.tsx","../src/Grid/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nexport interface GridProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Defines the default grid for form components\n */\nconst Grid = ({\n children = null,\n className = undefined,\n testId = undefined,\n}: GridProps) => {\n return (\n <div className={cn('grid gap-4', className)} data-testid={testId}>\n {children}\n </div>\n );\n};\n\nexport default Grid;\n","import Grid from './Grid';\n\nexport type { GridProps } from './Grid';\n\nexport { Grid };\n\nexport default Grid;\n"],"mappings":";;;;;;;;AAgBA,MAAM,QAAQ,EACZ,WAAW,MACX,YAAY,QACZ,SAAS,aACM;AACf,QACE,2CAAC;EAAI,0CAAc,cAAc,UAAU;EAAE,eAAa;EACvD;GACG;;AAIV,qBAAe;;;;ACtBf,mBAAeA"}
|
|
@@ -12,12 +12,12 @@ const Grid = ({ children = null, className = void 0, testId = void 0 }) => {
|
|
|
12
12
|
children
|
|
13
13
|
});
|
|
14
14
|
};
|
|
15
|
-
var Grid_default = Grid;
|
|
15
|
+
var Grid_default$1 = Grid;
|
|
16
16
|
|
|
17
17
|
//#endregion
|
|
18
18
|
//#region src/Grid/index.ts
|
|
19
|
-
var Grid_default
|
|
19
|
+
var Grid_default = Grid_default$1;
|
|
20
20
|
|
|
21
21
|
//#endregion
|
|
22
|
-
export { Grid_default as n, Grid_default
|
|
23
|
-
//# sourceMappingURL=Grid-
|
|
22
|
+
export { Grid_default$1 as n, Grid_default as t };
|
|
23
|
+
//# sourceMappingURL=Grid-LRjQlZms.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Grid-
|
|
1
|
+
{"version":3,"file":"Grid-LRjQlZms.js","names":["Grid"],"sources":["../src/Grid/Grid.tsx","../src/Grid/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nexport interface GridProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Defines the default grid for form components\n */\nconst Grid = ({\n children = null,\n className = undefined,\n testId = undefined,\n}: GridProps) => {\n return (\n <div className={cn('grid gap-4', className)} data-testid={testId}>\n {children}\n </div>\n );\n};\n\nexport default Grid;\n","import Grid from './Grid';\n\nexport type { GridProps } from './Grid';\n\nexport { Grid };\n\nexport default Grid;\n"],"mappings":";;;;;;;AAgBA,MAAM,QAAQ,EACZ,WAAW,MACX,YAAY,QACZ,SAAS,aACM;AACf,QACE,oBAAC;EAAI,WAAW,GAAG,cAAc,UAAU;EAAE,eAAa;EACvD;GACG;;AAIV,qBAAe;;;;ACtBf,mBAAeA"}
|
package/dist/Input/index.cjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
2
|
-
const require_Input = require('../Input-
|
|
2
|
+
const require_Input = require('../Input-DeTpxiK_.cjs');
|
|
3
3
|
|
|
4
4
|
exports.Input = require_Input.Input_default$1;
|
|
5
5
|
exports.default = require_Input.Input_default;
|
package/dist/Input/index.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as InputProps, t as Input } from "../index-
|
|
1
|
+
import { n as InputProps, t as Input } from "../index-BxA_pJWn.cjs";
|
|
2
2
|
export { Input, Input as default, InputProps };
|
package/dist/Input/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as InputProps, t as Input } from "../index-
|
|
1
|
+
import { n as InputProps, t as Input } from "../index-C-2nxT8D.js";
|
|
2
2
|
export { Input, Input as default, InputProps };
|
package/dist/Input/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as useUniformField } from "./useUniformField-
|
|
1
|
+
import { t as useUniformField } from "./useUniformField-gU4qYUwL.js";
|
|
2
2
|
import { t as useInputValueDebounce } from "./useInputValueDebounce-DaH5ONlQ.js";
|
|
3
3
|
import { tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -83,12 +83,12 @@ const Input$1 = ({ className: _className = void 0, clearable = false, debounceDe
|
|
|
83
83
|
value
|
|
84
84
|
});
|
|
85
85
|
};
|
|
86
|
-
var Input_default = Input$1;
|
|
86
|
+
var Input_default$1 = Input$1;
|
|
87
87
|
|
|
88
88
|
//#endregion
|
|
89
89
|
//#region src/Input/index.ts
|
|
90
|
-
var Input_default
|
|
90
|
+
var Input_default = Input_default$1;
|
|
91
91
|
|
|
92
92
|
//#endregion
|
|
93
|
-
export { Input_default as n, Input_default
|
|
94
|
-
//# sourceMappingURL=Input
|
|
93
|
+
export { Input_default$1 as n, Input_default as t };
|
|
94
|
+
//# sourceMappingURL=Input-DXMWGTBh.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input-DXMWGTBh.js","names":["Input","HeroNumberInput","HeroInput","Input"],"sources":["../src/Input/Input.tsx","../src/Input/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { InputProps as HeroInputProps } from '@heroui/input';\nimport type { ReactNode } from 'react';\nimport type { InputValueTransform } from '../hooks/useInputValueTransform';\n\nimport { Input as HeroInput } from '@heroui/input';\nimport { NumberInput as HeroNumberInput } from '@heroui/number-input';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useInputValueDebounce } from '../hooks/useInputValueDebounce';\nimport { useUniformField } from '../hooks/useUniformField';\n\n// input variants\nexport const inputVariants = tv({\n slots: {\n /** wrapper around the whole input */\n base: '',\n /** clear button */\n clearButton: '',\n /** actual input element */\n input: '',\n /** inner wrapper (HeroUI inputWrapper slot) */\n inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n },\n});\n\ntype VariantProps = TVProps<typeof inputVariants>;\ntype ClassName = TVClassName<typeof inputVariants>;\n\nexport interface InputProps extends VariantProps {\n /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n ariaLabel?: string;\n /** CSS class name */\n className?: ClassName;\n /** shows clear button when input has value */\n clearable?: boolean;\n /** debounce delay in milliseconds for form state updates (default: 300ms) */\n debounceDelay?: number;\n /** input field is disabled */\n disabled?: boolean;\n /** added content to the end of the input Field. */\n endContent?: ReactNode;\n /** form field label */\n label?: ReactNode;\n /** form field name */\n name: string;\n /** callback that is fired when the value is cleared */\n onClear?: () => void;\n /** form field placeholder */\n placeholder?: string;\n /** size of the input */\n size?: 'sm' | 'md' | 'lg';\n /** content added to the start of the input field */\n startContent?: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** allows disentangled display and form values for a field */\n transform?: InputValueTransform<string>;\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [HeroUI Input](https://www.heroui.com//docs/components/input)\n */\nconst Input = ({\n className: _className = undefined,\n clearable = false,\n debounceDelay = 300,\n endContent = undefined,\n name,\n onClear = undefined,\n placeholder = ' ',\n size = undefined,\n startContent = undefined,\n type = undefined,\n ...uniformFieldProps\n}: InputProps) => {\n const {\n ariaLabel,\n disabled,\n field: {\n onChange: fieldOnChange,\n onBlur: fieldOnBlur,\n value: fieldValue,\n ref,\n },\n errorMessage,\n invalid,\n label,\n required,\n testId,\n resetField,\n } = useUniformField({ name, type, ...uniformFieldProps });\n\n // Use hook that provides debounced onChange and enhanced blur handling\n const { onChange, onBlur, value } = useInputValueDebounce({\n debounceDelay,\n onBlur: fieldOnBlur,\n onChange: fieldOnChange,\n value: fieldValue,\n });\n\n // If input is clearable add props for clearing input value\n const clearableProps: Pick<HeroInputProps, 'isClearable' | 'onClear'> =\n clearable\n ? {\n isClearable: true,\n onClear: () => {\n // if field had initial value we do not reset it\n // to that value, but clear it instead\n resetField(name, { defaultValue: null });\n // if onClear cb provided we call it\n if (onClear) {\n onClear();\n }\n },\n }\n : {};\n\n // classNames from slots\n const variants = inputVariants();\n const classNames = variantsToClassNames(variants, _className, 'base');\n\n // Common props for both Input and NumberInput\n const commonProps = {\n ref,\n // Only add aria-label if there's no meaningful placeholder (HeroUI uses placeholder as aria-label)\n 'aria-label':\n !placeholder || placeholder.trim() === '' ? ariaLabel : undefined,\n // disable autocomplete\n autoComplete: 'off',\n classNames: {\n base: classNames.base,\n clearButton: classNames.clearButton,\n // set padding to 0 for error message exit animation\n helperWrapper: 'p-0',\n input: classNames.input,\n inputWrapper: classNames.inputWrapper,\n },\n 'data-testid': testId,\n endContent,\n errorMessage,\n id: testId,\n isDisabled: disabled,\n isInvalid: invalid,\n isRequired: required,\n label,\n labelPlacement: 'outside' as const,\n name,\n onBlur,\n placeholder,\n radius: 'sm' as const,\n size,\n startContent,\n variant: 'bordered' as const,\n ...clearableProps,\n };\n\n // Render NumberInput for number type\n if (type === 'number') {\n // Parse the string value to number - use null for empty/cleared state to keep component controlled\n const numberValue =\n value !== '' && value != null && !Number.isNaN(Number(value))\n ? Number(value)\n : null;\n\n return (\n <HeroNumberInput\n {...commonProps}\n // @ts-expect-error - HeroUI NumberInput type is not compatible with null,\n // but it needs to be for empty/cleared state to be controlled\n value={numberValue}\n // Disable thousands separator to avoid parsing issues\n formatOptions={{\n useGrouping: false,\n }}\n // NumberInput onChange receives either an event or a number\n onChange={(e: React.ChangeEvent<HTMLInputElement> | number) => {\n if (typeof e === 'number') {\n // Convert number to synthetic event and pass through debounced onChange\n onChange({\n target: { value: String(e) },\n } as React.ChangeEvent<HTMLInputElement>);\n } else {\n // Pass event through debounced onChange\n onChange(e);\n }\n }}\n />\n );\n }\n\n // Render regular Input for text/password\n return (\n <HeroInput {...commonProps} onChange={onChange} type={type} value={value} />\n );\n};\n\nexport default Input;\n","import Input from './Input';\n\nexport type { InputProps } from './Input';\n\nexport { Input };\n\nexport default Input;\n"],"mappings":";;;;;;;;AAcA,MAAa,gBAAgB,GAAG,EAC9B,OAAO;CAEL,MAAM;CAEN,aAAa;CAEb,OAAO;CAEP,cAAc;CACf,EACF,CAAC;;;;AAyCF,MAAMA,WAAS,EACb,WAAW,aAAa,QACxB,YAAY,OACZ,gBAAgB,KAChB,aAAa,QACb,MACA,UAAU,QACV,cAAc,KACd,OAAO,QACP,eAAe,QACf,OAAO,QACP,GAAG,wBACa;CAChB,MAAM,EACJ,WACA,UACA,OAAO,EACL,UAAU,eACV,QAAQ,aACR,OAAO,YACP,OAEF,cACA,SACA,OACA,UACA,QACA,eACE,gBAAgB;EAAE;EAAM;EAAM,GAAG;EAAmB,CAAC;CAGzD,MAAM,EAAE,UAAU,QAAQ,UAAU,sBAAsB;EACxD;EACA,QAAQ;EACR,UAAU;EACV,OAAO;EACR,CAAC;CAGF,MAAM,iBACJ,YACI;EACE,aAAa;EACb,eAAe;AAGb,cAAW,MAAM,EAAE,cAAc,MAAM,CAAC;AAExC,OAAI,QACF,UAAS;;EAGd,GACD,EAAE;CAIR,MAAM,aAAa,qBADF,eAAe,EACkB,YAAY,OAAO;CAGrE,MAAM,cAAc;EAClB;EAEA,cACE,CAAC,eAAe,YAAY,MAAM,KAAK,KAAK,YAAY;EAE1D,cAAc;EACd,YAAY;GACV,MAAM,WAAW;GACjB,aAAa,WAAW;GAExB,eAAe;GACf,OAAO,WAAW;GAClB,cAAc,WAAW;GAC1B;EACD,eAAe;EACf;EACA;EACA,IAAI;EACJ,YAAY;EACZ,WAAW;EACX,YAAY;EACZ;EACA,gBAAgB;EAChB;EACA;EACA;EACA,QAAQ;EACR;EACA;EACA,SAAS;EACT,GAAG;EACJ;AAGD,KAAI,SAAS,UAAU;EAErB,MAAM,cACJ,UAAU,MAAM,SAAS,QAAQ,CAAC,OAAO,MAAM,OAAO,MAAM,CAAC,GACzD,OAAO,MAAM,GACb;AAEN,SACE,oBAACC;GACC,GAAI;GAGJ,OAAO;GAEP,eAAe,EACb,aAAa,OACd;GAED,WAAW,MAAoD;AAC7D,QAAI,OAAO,MAAM,SAEf,UAAS,EACP,QAAQ,EAAE,OAAO,OAAO,EAAE,EAAE,EAC7B,CAAwC;QAGzC,UAAS,EAAE;;IAGf;;AAKN,QACE,oBAACC;EAAU,GAAI;EAAuB;EAAgB;EAAa;GAAS;;AAIhF,sBAAeF;;;;AClMf,oBAAeG"}
|