@fuf-stack/uniform 1.18.3 → 1.19.1
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 +7 -5
- package/dist/Checkboxes/index.d.cts +1 -1
- package/dist/Checkboxes/index.d.ts +1 -1
- package/dist/Checkboxes/index.js +2 -3
- package/dist/{Checkboxes-BGrK_mwQ.js → Checkboxes-D1hppxDE.js} +7 -10
- package/dist/Checkboxes-D1hppxDE.js.map +1 -0
- package/dist/{Checkboxes-Dk7yyRVR.cjs → Checkboxes-DegQ22uN.cjs} +18 -21
- package/dist/Checkboxes-DegQ22uN.cjs.map +1 -0
- package/dist/FieldArray/index.cjs +7 -5
- package/dist/FieldArray/index.d.cts +1 -1
- package/dist/FieldArray/index.d.ts +1 -1
- package/dist/FieldArray/index.js +2 -3
- package/dist/{FieldArray-Bs2ViU8m.js → FieldArray-BVL5Tz0Q.js} +51 -71
- package/dist/FieldArray-BVL5Tz0Q.js.map +1 -0
- package/dist/{FieldArray-C6RHZcKa.cjs → FieldArray-CeiNCobX.cjs} +66 -86
- package/dist/FieldArray-CeiNCobX.cjs.map +1 -0
- package/dist/FieldCard/index.cjs +4 -4
- package/dist/FieldCard/index.d.cts +1 -1
- package/dist/FieldCard/index.d.ts +1 -1
- package/dist/FieldCard/index.js +2 -3
- package/dist/{FieldCard-BxK_IJOR.cjs → FieldCard-C0kNSLj7.cjs} +20 -24
- package/dist/FieldCard-C0kNSLj7.cjs.map +1 -0
- package/dist/{FieldCard-16yCF83m.js → FieldCard-SjYNs4sL.js} +8 -12
- package/dist/FieldCard-SjYNs4sL.js.map +1 -0
- package/dist/{FieldCopyTestIdButton-BoEdlzLs.js → FieldCopyTestIdButton-Dpmo0uBV.js} +4 -7
- package/dist/FieldCopyTestIdButton-Dpmo0uBV.js.map +1 -0
- package/dist/{FieldCopyTestIdButton-4uupFq1U.cjs → FieldCopyTestIdButton-DrUzXwTo.cjs} +14 -17
- package/dist/FieldCopyTestIdButton-DrUzXwTo.cjs.map +1 -0
- package/dist/{FieldValidationError-Br6iopZj.cjs → FieldValidationError-8H8LxDjk.cjs} +14 -17
- package/dist/FieldValidationError-8H8LxDjk.cjs.map +1 -0
- package/dist/{FieldValidationError-XQaViV52.js → FieldValidationError-ktTyyyip.js} +4 -7
- package/dist/FieldValidationError-ktTyyyip.js.map +1 -0
- package/dist/Form/index.cjs +7 -5
- package/dist/Form/index.d.cts +1 -1
- package/dist/Form/index.d.ts +1 -2
- package/dist/Form/index.js +2 -3
- package/dist/{Form--SsSvsxl.cjs → Form-Dqa1b7Y7.cjs} +17 -22
- package/dist/Form-Dqa1b7Y7.cjs.map +1 -0
- package/dist/{Form-ccsEssie.js → Form-Wzy7pBVt.js} +8 -13
- package/dist/Form-Wzy7pBVt.js.map +1 -0
- package/dist/{FormContext-CCe8drkp.d.ts → FormContext-B4KQxdl7.d.ts} +1 -1
- package/dist/{FormContext-CCe8drkp.d.ts.map → FormContext-B4KQxdl7.d.ts.map} +1 -1
- package/dist/{FormContext-BSLO2-sO.cjs → FormContext-BrY1FQYR.cjs} +29 -37
- package/dist/{FormContext-BSLO2-sO.cjs.map → FormContext-BrY1FQYR.cjs.map} +1 -1
- package/dist/{FormContext-RSA21aDt.d.cts → FormContext-BuG3xZFe.d.cts} +1 -1
- package/dist/{FormContext-RSA21aDt.d.cts.map → FormContext-BuG3xZFe.d.cts.map} +1 -1
- package/dist/{FormContext-kE3YKhp_.js → FormContext-CLfMWHQM.js} +4 -7
- package/dist/{FormContext-kE3YKhp_.js.map → FormContext-CLfMWHQM.js.map} +1 -1
- package/dist/Grid/index.cjs +7 -5
- package/dist/Grid/index.d.cts +1 -1
- package/dist/Grid/index.d.ts +1 -1
- package/dist/Grid/index.js +2 -3
- package/dist/{Grid-BaqBa1ku.js → Grid-Bzyi97Cx.js} +4 -7
- package/dist/Grid-Bzyi97Cx.js.map +1 -0
- package/dist/{Grid-D5Yf0nD_.cjs → Grid-DdYQQ_UM.cjs} +14 -17
- package/dist/Grid-DdYQQ_UM.cjs.map +1 -0
- package/dist/Input/index.cjs +7 -5
- package/dist/Input/index.d.cts +1 -1
- package/dist/Input/index.d.ts +1 -1
- package/dist/Input/index.js +2 -3
- package/dist/{Input-BCs_eyJ9.js → Input-BDWP4hOr.js} +6 -9
- package/dist/{Input-BCs_eyJ9.js.map → Input-BDWP4hOr.js.map} +1 -1
- package/dist/{Input-B3p_4ntD.cjs → Input-BXJ4DSha.cjs} +18 -21
- package/dist/Input-BXJ4DSha.cjs.map +1 -0
- package/dist/RadioBoxes/index.cjs +7 -5
- package/dist/RadioBoxes/index.d.cts +1 -1
- package/dist/RadioBoxes/index.d.ts +1 -1
- package/dist/RadioBoxes/index.js +2 -3
- package/dist/{RadioBoxes-C3Cwrn2I.js → RadioBoxes-BR3X986V.js} +16 -23
- package/dist/RadioBoxes-BR3X986V.js.map +1 -0
- package/dist/{RadioBoxes-xRvNe5U8.cjs → RadioBoxes-Cim3InDW.cjs} +33 -40
- package/dist/RadioBoxes-Cim3InDW.cjs.map +1 -0
- package/dist/RadioTabs/index.cjs +7 -5
- package/dist/RadioTabs/index.d.cts +1 -1
- package/dist/RadioTabs/index.d.ts +1 -1
- package/dist/RadioTabs/index.js +2 -3
- package/dist/{RadioTabs-DfOGIsEf.js → RadioTabs-CsVqYCE9.js} +6 -9
- package/dist/RadioTabs-CsVqYCE9.js.map +1 -0
- package/dist/{RadioTabs-BaHvYcd-.cjs → RadioTabs-t-x2XnuI.cjs} +18 -21
- package/dist/RadioTabs-t-x2XnuI.cjs.map +1 -0
- package/dist/Radios/index.cjs +7 -5
- package/dist/Radios/index.d.cts +1 -1
- package/dist/Radios/index.d.ts +1 -1
- package/dist/Radios/index.js +2 -3
- package/dist/{Radios-xM-09vB5.js → Radios-CYwW3bZa.js} +13 -19
- package/dist/Radios-CYwW3bZa.js.map +1 -0
- package/dist/{Radios-BfA3uL35.cjs → Radios-CjEFdyD6.cjs} +25 -31
- package/dist/Radios-CjEFdyD6.cjs.map +1 -0
- package/dist/Select/index.cjs +7 -5
- package/dist/Select/index.d.cts +1 -1
- package/dist/Select/index.d.ts +1 -1
- package/dist/Select/index.js +2 -3
- package/dist/{Select-DH_YaruM.cjs → Select-BEed8xan.cjs} +23 -28
- package/dist/Select-BEed8xan.cjs.map +1 -0
- package/dist/{Select-DlEUzYl6.js → Select-BILyyM7Z.js} +9 -14
- package/dist/Select-BILyyM7Z.js.map +1 -0
- package/dist/Slider/index.cjs +7 -5
- package/dist/Slider/index.d.cts +1 -1
- package/dist/Slider/index.d.ts +1 -1
- package/dist/Slider/index.js +2 -3
- package/dist/{Slider-C-dMrJZ6.cjs → Slider-CFYP86ku.cjs} +16 -19
- package/dist/Slider-CFYP86ku.cjs.map +1 -0
- package/dist/{Slider-CTFuVrp2.js → Slider-DxRcLu-j.js} +5 -8
- package/dist/{Slider-CTFuVrp2.js.map → Slider-DxRcLu-j.js.map} +1 -1
- package/dist/SubmitButton/index.cjs +7 -5
- package/dist/SubmitButton/index.d.cts +1 -1
- package/dist/SubmitButton/index.d.ts +1 -1
- package/dist/SubmitButton/index.js +2 -3
- package/dist/{SubmitButton-Bh1RN0F1.js → SubmitButton-Bu3NNFyt.js} +5 -8
- package/dist/SubmitButton-Bu3NNFyt.js.map +1 -0
- package/dist/{SubmitButton-CJ6s1mZr.cjs → SubmitButton-D7xacDyS.cjs} +15 -18
- package/dist/SubmitButton-D7xacDyS.cjs.map +1 -0
- package/dist/Switch/index.cjs +7 -5
- package/dist/Switch/index.d.cts +1 -1
- package/dist/Switch/index.d.ts +1 -1
- package/dist/Switch/index.js +2 -3
- package/dist/{Switch-CXrz-M3V.js → Switch-CMpXZdLc.js} +5 -8
- package/dist/{Switch-CXrz-M3V.js.map → Switch-CMpXZdLc.js.map} +1 -1
- package/dist/{Switch-CeUMwheZ.cjs → Switch-Dt9TGQ8d.cjs} +16 -19
- package/dist/Switch-Dt9TGQ8d.cjs.map +1 -0
- package/dist/SwitchBox/index.cjs +7 -5
- package/dist/SwitchBox/index.d.cts +1 -1
- package/dist/SwitchBox/index.d.ts +1 -1
- package/dist/SwitchBox/index.js +2 -3
- package/dist/{SwitchBox-C-aLl2nX.js → SwitchBox-Cg7NPfp_.js} +5 -8
- package/dist/SwitchBox-Cg7NPfp_.js.map +1 -0
- package/dist/{SwitchBox-mGUPvJE0.cjs → SwitchBox-DMPp_Ed-.cjs} +21 -24
- package/dist/SwitchBox-DMPp_Ed-.cjs.map +1 -0
- package/dist/TextArea/index.cjs +7 -5
- package/dist/TextArea/index.d.cts +1 -1
- package/dist/TextArea/index.d.ts +1 -1
- package/dist/TextArea/index.js +2 -3
- package/dist/{TextArea-BLkVYmHZ.js → TextArea-Bxi2pXvY.js} +6 -9
- package/dist/TextArea-Bxi2pXvY.js.map +1 -0
- package/dist/{TextArea-BYEuk4Ng.cjs → TextArea-DDwzXW-y.cjs} +18 -21
- package/dist/TextArea-DDwzXW-y.cjs.map +1 -0
- package/dist/helpers/index.cjs +397 -10
- package/dist/helpers/index.cjs.map +1 -0
- package/dist/helpers/index.d.cts +224 -2
- package/dist/helpers/index.d.cts.map +1 -0
- package/dist/helpers/index.d.ts +224 -2
- package/dist/helpers/index.d.ts.map +1 -0
- package/dist/helpers/index.js +387 -2
- package/dist/helpers/index.js.map +1 -0
- package/dist/hooks/useClientValidation/index.cjs +3 -3
- package/dist/hooks/useClientValidation/index.d.cts +1 -1
- package/dist/hooks/useClientValidation/index.d.ts +1 -1
- package/dist/hooks/useClientValidation/index.js +2 -3
- package/dist/hooks/useController/index.cjs +3 -3
- package/dist/hooks/useController/index.d.cts +1 -1
- package/dist/hooks/useController/index.d.ts +1 -1
- package/dist/hooks/useController/index.js +2 -3
- package/dist/hooks/useFormContext/index.cjs +8 -3
- package/dist/hooks/useFormContext/index.cjs.map +1 -0
- package/dist/hooks/useFormContext/index.d.cts +1 -1
- package/dist/hooks/useFormContext/index.d.ts +1 -3
- package/dist/hooks/useFormContext/index.js +6 -2
- package/dist/hooks/useFormContext/index.js.map +1 -0
- package/dist/hooks/useInput/index.cjs +8 -8
- package/dist/hooks/useInput/index.d.cts +1 -1
- package/dist/hooks/useInput/index.d.ts +1 -1
- package/dist/hooks/useInput/index.js +2 -3
- package/dist/hooks/useInputValueDebounce/index.cjs +92 -2
- package/dist/hooks/useInputValueDebounce/index.cjs.map +1 -0
- package/dist/hooks/useInputValueDebounce/index.d.cts +1 -1
- package/dist/hooks/useInputValueDebounce/index.d.ts +1 -1
- package/dist/hooks/useInputValueDebounce/index.js +90 -2
- package/dist/hooks/useInputValueDebounce/index.js.map +1 -0
- package/dist/hooks/useInputValueTransform/index.cjs +3 -3
- package/dist/hooks/useInputValueTransform/index.d.cts +1 -1
- package/dist/hooks/useInputValueTransform/index.d.ts +1 -1
- package/dist/hooks/useInputValueTransform/index.js +2 -3
- package/dist/hooks/useUniformField/index.cjs +135 -2
- package/dist/hooks/useUniformField/index.cjs.map +1 -0
- package/dist/hooks/useUniformField/index.d.cts +1 -1
- package/dist/hooks/useUniformField/index.d.ts +1 -5
- package/dist/hooks/useUniformField/index.js +132 -2
- package/dist/hooks/useUniformField/index.js.map +1 -0
- package/dist/hooks/useUniformFieldArray/index.cjs +83 -2
- package/dist/hooks/useUniformFieldArray/index.cjs.map +1 -0
- package/dist/hooks/useUniformFieldArray/index.d.cts +1 -1
- package/dist/hooks/useUniformFieldArray/index.d.ts +1 -26
- package/dist/hooks/useUniformFieldArray/index.js +81 -2
- package/dist/hooks/useUniformFieldArray/index.js.map +1 -0
- package/dist/hooks/useWatchUserChange/index.cjs +3 -3
- package/dist/hooks/useWatchUserChange/index.d.cts +1 -1
- package/dist/hooks/useWatchUserChange/index.d.ts +1 -1
- package/dist/hooks/useWatchUserChange/index.js +2 -3
- package/dist/{index-TmijvCD0.d.ts → index-25CYKzg4.d.cts} +22 -22
- package/dist/index-25CYKzg4.d.cts.map +1 -0
- package/dist/{index-CeiIXmAI.d.cts → index-3e3711-8.d.cts} +36 -36
- package/dist/index-3e3711-8.d.cts.map +1 -0
- package/dist/{index-E6etS7_8.d.ts → index-6hu79Fof.d.ts} +34 -34
- package/dist/index-6hu79Fof.d.ts.map +1 -0
- package/dist/index-AmOFlE3L.d.cts +278 -0
- package/dist/index-AmOFlE3L.d.cts.map +1 -0
- package/dist/{index-wwmQClW-.d.cts → index-B-6CMF1H.d.ts} +21 -21
- package/dist/index-B-6CMF1H.d.ts.map +1 -0
- package/dist/{index-ahxY6Q0X.d.cts → index-B6WwxkLx2.d.ts} +3 -3
- package/dist/index-B6WwxkLx2.d.ts.map +1 -0
- package/dist/{index-BlJFGN_o.d.ts → index-B9lVf5LI.d.ts} +48 -48
- package/dist/index-B9lVf5LI.d.ts.map +1 -0
- package/dist/{index-ttNINAv3.d.ts → index-BV1VKQdy.d.cts} +3 -3
- package/dist/{index-qo0Ta_R3.d.cts.map → index-BV1VKQdy.d.cts.map} +1 -1
- package/dist/{index-C1-F9Ga-.d.cts → index-BdYKQ59a.d.cts} +7 -7
- package/dist/index-BdYKQ59a.d.cts.map +1 -0
- package/dist/{index-Bl1Adhfx.d.ts → index-BwAI1VFS.d.ts} +6 -6
- package/dist/index-BwAI1VFS.d.ts.map +1 -0
- package/dist/{index-BsCPUK2g.d.cts → index-BzIB-MQg.d.cts} +48 -48
- package/dist/index-BzIB-MQg.d.cts.map +1 -0
- package/dist/{index-DFzyOxvt.d.cts → index-C-DiLZRu.d.cts} +6 -6
- package/dist/index-C-DiLZRu.d.cts.map +1 -0
- package/dist/{index-BKQc5PQn.d.cts → index-C9up4f3f.d.cts} +34 -34
- package/dist/index-C9up4f3f.d.cts.map +1 -0
- package/dist/{index-Dty4h2eA.d.ts → index-CE0aQlFw.d.ts} +7 -7
- package/dist/index-CE0aQlFw.d.ts.map +1 -0
- package/dist/{index-BrMk3Wee.d.ts → index-CY2Mpaz3.d.cts} +4 -4
- package/dist/index-CY2Mpaz3.d.cts.map +1 -0
- package/dist/index-CuRn5Thx.d.ts +278 -0
- package/dist/index-CuRn5Thx.d.ts.map +1 -0
- package/dist/{index-qo0Ta_R3.d.cts → index-Cv4ERj3i.d.ts} +3 -3
- package/dist/{index-ttNINAv3.d.ts.map → index-Cv4ERj3i.d.ts.map} +1 -1
- package/dist/{index-ByyEP8UR.d.cts → index-D6XwSwTP.d.cts} +6 -6
- package/dist/{index-ByyEP8UR.d.cts.map → index-D6XwSwTP.d.cts.map} +1 -1
- package/dist/{index-Dr06SNZN.d.cts → index-DD_RPe91.d.ts} +4 -4
- package/dist/index-DD_RPe91.d.ts.map +1 -0
- package/dist/{index-DLR8z1lG.d.cts → index-DFWSHdua.d.ts} +3 -3
- package/dist/{index-CPkTYivq.d.ts.map → index-DFWSHdua.d.ts.map} +1 -1
- package/dist/{index-B0rp5NJy.d.cts → index-DMwNV_Br.d.cts} +35 -36
- package/dist/index-DMwNV_Br.d.cts.map +1 -0
- package/dist/index-DeEmP3Jc.d.cts +1 -0
- package/dist/{index-mmk9VKYu.d.ts → index-DiD7s23-.d.cts} +21 -21
- package/dist/index-DiD7s23-.d.cts.map +1 -0
- package/dist/{index--NM5Ctp6.d.ts → index-Dj3NDj0T.d.ts} +4 -4
- package/dist/{index--NM5Ctp6.d.ts.map → index-Dj3NDj0T.d.ts.map} +1 -1
- package/dist/{index-CPkTYivq.d.ts → index-DkiQkdCW.d.cts} +3 -3
- package/dist/{index-DLR8z1lG.d.cts.map → index-DkiQkdCW.d.cts.map} +1 -1
- package/dist/{index-CI0AWMsR.d.ts → index-DkxqHE_P2.d.ts} +3 -3
- package/dist/{index-B7Xz_OY2.d.cts.map → index-DkxqHE_P2.d.ts.map} +1 -1
- package/dist/{index-B7Xz_OY2.d.cts → index-Dld6NP_K.d.cts} +3 -3
- package/dist/index-Dld6NP_K.d.cts.map +1 -0
- package/dist/{index-CZq5eXSP.d.ts → index-DlebotZ4.d.ts} +36 -36
- package/dist/index-DlebotZ4.d.ts.map +1 -0
- package/dist/index-DsC0y6kU.d.cts +70 -0
- package/dist/index-DsC0y6kU.d.cts.map +1 -0
- package/dist/index-DwqOejxR.d.ts +70 -0
- package/dist/index-DwqOejxR.d.ts.map +1 -0
- package/dist/{index-BaxXDaOZ.d.ts → index-Gs3zrYoY.d.ts} +35 -37
- package/dist/index-Gs3zrYoY.d.ts.map +1 -0
- package/dist/{index-BlX_mF6D.d.cts → index-N5wvPOq3.d.ts} +22 -22
- package/dist/index-N5wvPOq3.d.ts.map +1 -0
- package/dist/{index-BNYtqtXt.d.cts → index-NjKV8LJD.d.cts} +4 -4
- package/dist/{index-BNYtqtXt.d.cts.map → index-NjKV8LJD.d.cts.map} +1 -1
- package/dist/{index-DVZCz730.d.ts → index-fgARdsoB.d.ts} +6 -6
- package/dist/{index-DVZCz730.d.ts.map → index-fgARdsoB.d.ts.map} +1 -1
- package/dist/{index-CMehV9mc.d.ts → index-jCfJAgDc.d.cts} +3 -3
- package/dist/index-jCfJAgDc.d.cts.map +1 -0
- package/dist/{index--KhDRPu3.d.cts → index-pwXVq8hR.d.cts} +6 -6
- package/dist/index-pwXVq8hR.d.cts.map +1 -0
- package/dist/index-sQecLSpR.d.cts +1 -0
- package/dist/{index-BgyvEfYZ.d.ts → index-wV1E_PkS.d.ts} +6 -6
- package/dist/index-wV1E_PkS.d.ts.map +1 -0
- package/dist/index.cjs +63 -63
- package/dist/index.d.cts +27 -27
- package/dist/index.d.ts +27 -29
- package/dist/index.js +29 -30
- package/dist/partials/FieldCopyTestIdButton/index.cjs +7 -5
- package/dist/partials/FieldCopyTestIdButton/index.d.cts +1 -1
- package/dist/partials/FieldCopyTestIdButton/index.d.ts +1 -1
- package/dist/partials/FieldCopyTestIdButton/index.js +2 -3
- package/dist/partials/FieldValidationError/index.cjs +7 -5
- package/dist/partials/FieldValidationError/index.d.cts +1 -1
- package/dist/partials/FieldValidationError/index.d.ts +1 -1
- package/dist/partials/FieldValidationError/index.js +2 -3
- package/dist/{useClientValidation-B4xrGBJZ.d.ts → useClientValidation-BWElhQ91.d.ts} +2 -3
- package/dist/useClientValidation-BWElhQ91.d.ts.map +1 -0
- package/dist/{useClientValidation-DksyV18M.js → useClientValidation-Dn_kJkE5.js} +5 -6
- package/dist/{useClientValidation-DksyV18M.js.map → useClientValidation-Dn_kJkE5.js.map} +1 -1
- package/dist/{useClientValidation-B_dYQB5o.d.cts → useClientValidation-DtnfCE5T.d.cts} +2 -3
- package/dist/{useClientValidation-B4xrGBJZ.d.ts.map → useClientValidation-DtnfCE5T.d.cts.map} +1 -1
- package/dist/{useClientValidation-Dnj_wuwf.cjs → useClientValidation-NKOuXuHV.cjs} +16 -17
- package/dist/useClientValidation-NKOuXuHV.cjs.map +1 -0
- package/dist/{useController-NjuthTyL.js → useController-B-6PzFna.js} +4 -5
- package/dist/{useController-NjuthTyL.js.map → useController-B-6PzFna.js.map} +1 -1
- package/dist/{useController-D8MEXnmB.d.cts → useController-CNiqy_2D.d.cts} +1 -1
- package/dist/{useController-D8MEXnmB.d.cts.map → useController-CNiqy_2D.d.cts.map} +1 -1
- package/dist/{useController-CHOpoCoz.d.ts → useController-Cc0UNQMm.d.ts} +1 -1
- package/dist/{useController-CHOpoCoz.d.ts.map → useController-Cc0UNQMm.d.ts.map} +1 -1
- package/dist/{useController-B_SSp5Z5.cjs → useController-DVRh86Zy.cjs} +11 -12
- package/dist/{useController-B_SSp5Z5.cjs.map → useController-DVRh86Zy.cjs.map} +1 -1
- package/dist/{useFormContext-vdeeDsAs.cjs → useFormContext-Bum4VP1o.cjs} +20 -21
- package/dist/{useFormContext-vdeeDsAs.cjs.map → useFormContext-Bum4VP1o.cjs.map} +1 -1
- package/dist/{useFormContext-Di67HIf7.js → useFormContext-Bzpyonu6.js} +5 -6
- package/dist/{useFormContext-Di67HIf7.js.map → useFormContext-Bzpyonu6.js.map} +1 -1
- package/dist/{useFormContext-C6OOtqZ5.d.ts → useFormContext-DEMm-bsc.d.ts} +22 -22
- package/dist/useFormContext-DEMm-bsc.d.ts.map +1 -0
- package/dist/{useFormContext-Dh97YG47.d.cts → useFormContext-Dey5DbWr.d.cts} +22 -22
- package/dist/useFormContext-Dey5DbWr.d.cts.map +1 -0
- package/dist/{useInput-BWzvIUpW.js → useInput-CVm3tP78.js} +1 -2
- package/dist/{useInputValueDebounce-ZLyAmuXV.d.cts → useInputValueDebounce-puGRVJ6t.d.cts} +1 -1
- package/dist/{useInputValueDebounce-ZLyAmuXV.d.cts.map → useInputValueDebounce-puGRVJ6t.d.cts.map} +1 -1
- package/dist/{useInputValueDebounce-Dhlv1NUY.d.ts → useInputValueDebounce-sFOlecIQ.d.ts} +1 -1
- package/dist/{useInputValueDebounce-Dhlv1NUY.d.ts.map → useInputValueDebounce-sFOlecIQ.d.ts.map} +1 -1
- package/dist/{useInputValueTransform-CNCBU7a9.d.cts → useInputValueTransform-BwAfw8Xb.d.cts} +1 -1
- package/dist/{useInputValueTransform-CNCBU7a9.d.cts.map → useInputValueTransform-BwAfw8Xb.d.cts.map} +1 -1
- package/dist/{useInputValueTransform-C-fmz3ke.js → useInputValueTransform-CXdmtc0Q.js} +2 -3
- package/dist/{useInputValueTransform-C-fmz3ke.js.map → useInputValueTransform-CXdmtc0Q.js.map} +1 -1
- package/dist/{useInputValueTransform-tsMNM7g_.d.ts → useInputValueTransform-CdoaxNyD.d.ts} +1 -1
- package/dist/{useInputValueTransform-tsMNM7g_.d.ts.map → useInputValueTransform-CdoaxNyD.d.ts.map} +1 -1
- package/dist/{useInputValueTransform-BBRvvhDe.cjs → useInputValueTransform-DKH-7F9D.cjs} +8 -9
- package/dist/{useInputValueTransform-BBRvvhDe.cjs.map → useInputValueTransform-DKH-7F9D.cjs.map} +1 -1
- package/dist/{useUniformField-Bd_oDkYE.d.cts → useUniformField-DB8jF52F.d.cts} +5 -5
- package/dist/{useUniformField-Bd_oDkYE.d.cts.map → useUniformField-DB8jF52F.d.cts.map} +1 -1
- package/dist/{useUniformField-BDKjYBKu.d.ts → useUniformField-iHk8xYXN.d.ts} +5 -5
- package/dist/{useUniformField-BDKjYBKu.d.ts.map → useUniformField-iHk8xYXN.d.ts.map} +1 -1
- package/dist/{useUniformFieldArray-lV3Nbum2.d.ts → useUniformFieldArray-B0SPtHeT.d.ts} +18 -18
- package/dist/useUniformFieldArray-B0SPtHeT.d.ts.map +1 -0
- package/dist/{useUniformFieldArray-CWiaXKO6.d.cts → useUniformFieldArray-okvikMJp.d.cts} +18 -18
- package/dist/useUniformFieldArray-okvikMJp.d.cts.map +1 -0
- package/dist/{useWatchUserChange-C1Kluht2.cjs → useWatchUserChange-CBuIa5kU.cjs} +9 -10
- package/dist/{useWatchUserChange-C1Kluht2.cjs.map → useWatchUserChange-CBuIa5kU.cjs.map} +1 -1
- package/dist/{useWatchUserChange-BnnrFjyq.d.ts → useWatchUserChange-CH4x16_r.d.ts} +1 -1
- package/dist/{useWatchUserChange-BnnrFjyq.d.ts.map → useWatchUserChange-CH4x16_r.d.ts.map} +1 -1
- package/dist/{useWatchUserChange-Dj9Imxfi.js → useWatchUserChange-CLgLc5W4.js} +3 -4
- package/dist/{useWatchUserChange-Dj9Imxfi.js.map → useWatchUserChange-CLgLc5W4.js.map} +1 -1
- package/dist/{useWatchUserChange-DalJOKBC.d.cts → useWatchUserChange-CZu_ZZ38.d.cts} +1 -1
- package/dist/{useWatchUserChange-DalJOKBC.d.cts.map → useWatchUserChange-CZu_ZZ38.d.cts.map} +1 -1
- package/package.json +74 -70
- package/dist/Checkboxes-BGrK_mwQ.js.map +0 -1
- package/dist/Checkboxes-Dk7yyRVR.cjs.map +0 -1
- package/dist/FieldArray-Bs2ViU8m.js.map +0 -1
- package/dist/FieldArray-C6RHZcKa.cjs.map +0 -1
- package/dist/FieldCard-16yCF83m.js.map +0 -1
- package/dist/FieldCard-BxK_IJOR.cjs.map +0 -1
- package/dist/FieldCopyTestIdButton-4uupFq1U.cjs.map +0 -1
- package/dist/FieldCopyTestIdButton-BoEdlzLs.js.map +0 -1
- package/dist/FieldValidationError-Br6iopZj.cjs.map +0 -1
- package/dist/FieldValidationError-XQaViV52.js.map +0 -1
- package/dist/Form--SsSvsxl.cjs.map +0 -1
- package/dist/Form-ccsEssie.js.map +0 -1
- package/dist/Grid-BaqBa1ku.js.map +0 -1
- package/dist/Grid-D5Yf0nD_.cjs.map +0 -1
- package/dist/Input-B3p_4ntD.cjs.map +0 -1
- package/dist/RadioBoxes-C3Cwrn2I.js.map +0 -1
- package/dist/RadioBoxes-xRvNe5U8.cjs.map +0 -1
- package/dist/RadioTabs-BaHvYcd-.cjs.map +0 -1
- package/dist/RadioTabs-DfOGIsEf.js.map +0 -1
- package/dist/Radios-BfA3uL35.cjs.map +0 -1
- package/dist/Radios-xM-09vB5.js.map +0 -1
- package/dist/Select-DH_YaruM.cjs.map +0 -1
- package/dist/Select-DlEUzYl6.js.map +0 -1
- package/dist/Slider-C-dMrJZ6.cjs.map +0 -1
- package/dist/SubmitButton-Bh1RN0F1.js.map +0 -1
- package/dist/SubmitButton-CJ6s1mZr.cjs.map +0 -1
- package/dist/Switch-CeUMwheZ.cjs.map +0 -1
- package/dist/SwitchBox-C-aLl2nX.js.map +0 -1
- package/dist/SwitchBox-mGUPvJE0.cjs.map +0 -1
- package/dist/TextArea-BLkVYmHZ.js.map +0 -1
- package/dist/TextArea-BYEuk4Ng.cjs.map +0 -1
- package/dist/helpers-33jajRcN.js +0 -390
- package/dist/helpers-33jajRcN.js.map +0 -1
- package/dist/helpers-Bd_QpqXg.cjs +0 -444
- package/dist/helpers-Bd_QpqXg.cjs.map +0 -1
- package/dist/index--KhDRPu3.d.cts.map +0 -1
- package/dist/index-B0rp5NJy.d.cts.map +0 -1
- package/dist/index-BBw9RSKy.d.ts +0 -278
- package/dist/index-BBw9RSKy.d.ts.map +0 -1
- package/dist/index-BKQc5PQn.d.cts.map +0 -1
- package/dist/index-BLgXFM85.d.cts +0 -224
- package/dist/index-BLgXFM85.d.cts.map +0 -1
- package/dist/index-BaxXDaOZ.d.ts.map +0 -1
- package/dist/index-BgyvEfYZ.d.ts.map +0 -1
- package/dist/index-BjHnNRSC.d.cts +0 -278
- package/dist/index-BjHnNRSC.d.cts.map +0 -1
- package/dist/index-Bl1Adhfx.d.ts.map +0 -1
- package/dist/index-BlJFGN_o.d.ts.map +0 -1
- package/dist/index-BlX_mF6D.d.cts.map +0 -1
- package/dist/index-BrMk3Wee.d.ts.map +0 -1
- package/dist/index-BsCPUK2g.d.cts.map +0 -1
- package/dist/index-C1-F9Ga-.d.cts.map +0 -1
- package/dist/index-CI0AWMsR.d.ts.map +0 -1
- package/dist/index-CMehV9mc.d.ts.map +0 -1
- package/dist/index-CZq5eXSP.d.ts.map +0 -1
- package/dist/index-CeiIXmAI.d.cts.map +0 -1
- package/dist/index-DFzyOxvt.d.cts.map +0 -1
- package/dist/index-Dr06SNZN.d.cts.map +0 -1
- package/dist/index-Dty4h2eA.d.ts.map +0 -1
- package/dist/index-E6etS7_8.d.ts.map +0 -1
- package/dist/index-TmijvCD0.d.ts.map +0 -1
- package/dist/index-ahxY6Q0X.d.cts.map +0 -1
- package/dist/index-mmk9VKYu.d.ts.map +0 -1
- package/dist/index-w8E8Koak.d.ts +0 -224
- package/dist/index-w8E8Koak.d.ts.map +0 -1
- package/dist/index-wwmQClW-.d.cts.map +0 -1
- package/dist/useClientValidation-B_dYQB5o.d.cts.map +0 -1
- package/dist/useClientValidation-Dnj_wuwf.cjs.map +0 -1
- package/dist/useFormContext-C6OOtqZ5.d.ts.map +0 -1
- package/dist/useFormContext-CLymm_7t.js +0 -6
- package/dist/useFormContext-CLymm_7t.js.map +0 -1
- package/dist/useFormContext-CkeSOfWD.cjs +0 -6
- package/dist/useFormContext-CkeSOfWD.cjs.map +0 -1
- package/dist/useFormContext-Dh97YG47.d.cts.map +0 -1
- package/dist/useInputValueDebounce-CRaM7HEM.cjs +0 -99
- package/dist/useInputValueDebounce-CRaM7HEM.cjs.map +0 -1
- package/dist/useInputValueDebounce-DJO5uzLb.js +0 -93
- package/dist/useInputValueDebounce-DJO5uzLb.js.map +0 -1
- package/dist/useUniformField-6c4OCAfb.cjs +0 -142
- package/dist/useUniformField-6c4OCAfb.cjs.map +0 -1
- package/dist/useUniformField-C-Xyu-8v.js +0 -135
- package/dist/useUniformField-C-Xyu-8v.js.map +0 -1
- package/dist/useUniformFieldArray-BKvA0FQW.js +0 -84
- package/dist/useUniformFieldArray-BKvA0FQW.js.map +0 -1
- package/dist/useUniformFieldArray-CRCbV1J2.cjs +0 -90
- package/dist/useUniformFieldArray-CRCbV1J2.cjs.map +0 -1
- package/dist/useUniformFieldArray-CWiaXKO6.d.cts.map +0 -1
- package/dist/useUniformFieldArray-lV3Nbum2.d.ts.map +0 -1
- /package/dist/{index-BMCcWGYS.d.ts → index--okzibnx.d.ts} +0 -0
- /package/dist/{index-C8k_zgEm.d.cts → index-B2TCFhpj.d.ts} +0 -0
- /package/dist/{index-DDRpa5CJ.d.cts → index-BtBZHVmz.d.cts} +0 -0
- /package/dist/{index-GGHuYh77.d.ts → index-CI4LJief.d.ts} +0 -0
- /package/dist/{useInput-BVZvtfNg.d.ts → useInput-93TCCrkB.d.cts} +0 -0
- /package/dist/{useInput-CKmKH9Ij.d.cts → useInput-C_fY--wx.d.ts} +0 -0
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
const
|
|
3
|
-
const
|
|
1
|
+
require("./FormContext-BrY1FQYR.cjs");
|
|
2
|
+
const require_helpers_index = require("./helpers/index.cjs");
|
|
3
|
+
const require_hooks_useUniformField_index = require("./hooks/useUniformField/index.cjs");
|
|
4
4
|
let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
|
|
5
5
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
6
6
|
let _heroui_radio = require("@heroui/radio");
|
|
7
|
-
|
|
8
7
|
//#region src/Radios/Radios.tsx
|
|
9
8
|
const radiosVariants = (0, _fuf_stack_pixel_utils.tv)({ slots: {
|
|
10
9
|
base: "group gap-0",
|
|
@@ -21,11 +20,11 @@ const radiosVariants = (0, _fuf_stack_pixel_utils.tv)({ slots: {
|
|
|
21
20
|
* Radios component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)
|
|
22
21
|
*/
|
|
23
22
|
const Radios = ({ className = void 0, inline = false, name, options, ...uniformFieldProps }) => {
|
|
24
|
-
const { ariaLabel, disabled, errorMessage, field: { onBlur, onChange, ref, value }, invalid, label, required, testId } =
|
|
23
|
+
const { ariaLabel, disabled, errorMessage, field: { onBlur, onChange, ref, value }, invalid, label, required, testId } = require_hooks_useUniformField_index.useUniformField({
|
|
25
24
|
name,
|
|
26
25
|
...uniformFieldProps
|
|
27
26
|
});
|
|
28
|
-
const { convertToOriginalType } =
|
|
27
|
+
const { convertToOriginalType } = require_helpers_index.createOptionValueConverter(options);
|
|
29
28
|
const classNames = (0, _fuf_stack_pixel_utils.variantsToClassNames)(radiosVariants(), className, "base");
|
|
30
29
|
const itemClassNames = {
|
|
31
30
|
base: classNames.itemBase,
|
|
@@ -55,37 +54,32 @@ const Radios = ({ className = void 0, inline = false, name, options, ...uniformF
|
|
|
55
54
|
onChange(convertToOriginalType(newValue));
|
|
56
55
|
},
|
|
57
56
|
children: options.map((option) => {
|
|
58
|
-
if ("value" in option) {
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
children: option.label ?? option.value
|
|
66
|
-
}, String(option.value));
|
|
67
|
-
}
|
|
57
|
+
if ("value" in option) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_radio.Radio, {
|
|
58
|
+
classNames: itemClassNames,
|
|
59
|
+
"data-testid": (0, _fuf_stack_pixel_utils.slugify)(`${testId}_option_${option.testId ?? option.value}`, { replaceDots: true }),
|
|
60
|
+
isDisabled: !!disabled || option.disabled,
|
|
61
|
+
value: String(option.value),
|
|
62
|
+
children: option.label ?? option.value
|
|
63
|
+
}, String(option.value));
|
|
68
64
|
return null;
|
|
69
65
|
})
|
|
70
66
|
});
|
|
71
67
|
};
|
|
72
|
-
var Radios_default$1 = Radios;
|
|
73
|
-
|
|
74
68
|
//#endregion
|
|
75
69
|
//#region src/Radios/index.ts
|
|
76
|
-
var Radios_default =
|
|
77
|
-
|
|
70
|
+
var Radios_default = Radios;
|
|
78
71
|
//#endregion
|
|
79
|
-
Object.defineProperty(exports,
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
72
|
+
Object.defineProperty(exports, "Radios", {
|
|
73
|
+
enumerable: true,
|
|
74
|
+
get: function() {
|
|
75
|
+
return Radios;
|
|
76
|
+
}
|
|
84
77
|
});
|
|
85
|
-
Object.defineProperty(exports,
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
78
|
+
Object.defineProperty(exports, "Radios_default", {
|
|
79
|
+
enumerable: true,
|
|
80
|
+
get: function() {
|
|
81
|
+
return Radios_default;
|
|
82
|
+
}
|
|
90
83
|
});
|
|
91
|
-
|
|
84
|
+
|
|
85
|
+
//# sourceMappingURL=Radios-CjEFdyD6.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Radios-CjEFdyD6.cjs","names":["useUniformField","createOptionValueConverter","HeroRadioGroup","HeroRadio"],"sources":["../src/Radios/Radios.tsx","../src/Radios/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport {\n Radio as HeroRadio,\n RadioGroup as HeroRadioGroup,\n} from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { createOptionValueConverter } from '../helpers';\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const radiosVariants = tv({\n slots: {\n // Needs group for group-data condition\n base: 'group gap-0',\n itemBase: '',\n itemControl: 'bg-focus group-data-[invalid=true]:bg-danger',\n itemDescription: '',\n itemLabel: 'text-sm',\n itemLabelWrapper: '',\n itemWrapper:\n 'group-data-[invalid=true]:border-danger! [&:not(group-data-[invalid=\"true\"]):not(group-data-[selected=\"false\"])]:border-focus',\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof radiosVariants>;\ntype ClassName = TVClassName<typeof radiosVariants>;\n\nexport interface RadioOption {\n /** disables the option */\n disabled?: boolean;\n /** option label */\n label?: ReactNode;\n /** option icon */\n icon?: ReactNode;\n /** HTML data-testid attribute of the option */\n testId?: string;\n /** option value */\n value: string | number;\n}\n\nexport interface RadiosProps 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 /** Determines if the Buttons are disabled or not. */\n disabled?: boolean;\n /** determines orientation of the Buttons. */\n inline?: boolean;\n /** Label displayed next to the RadioButton. */\n label?: ReactNode;\n /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n name: string;\n /** Radio button configuration. */\n options: RadioOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n}\n\n/**\n * Radios component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n */\nconst Radios = ({\n className = undefined,\n inline = false,\n name,\n options,\n ...uniformFieldProps\n}: RadiosProps): ReactElement => {\n const {\n ariaLabel,\n disabled,\n errorMessage,\n field: { onBlur, onChange, ref, value },\n invalid,\n label,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Create converter to preserve number types for option values\n const { convertToOriginalType } = createOptionValueConverter(options);\n\n // classNames from slots\n const variants = radiosVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const itemClassNames = {\n base: classNames.itemBase,\n control: classNames.itemControl,\n description: classNames.itemDescription,\n label: classNames.itemLabel,\n labelWrapper: classNames.itemLabelWrapper,\n wrapper: classNames.itemWrapper,\n };\n\n return (\n <HeroRadioGroup\n ref={ref}\n aria-label={ariaLabel}\n classNames={classNames}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n errorMessage={errorMessage}\n isDisabled={disabled}\n isInvalid={invalid}\n isRequired={required}\n label={label ? <legend>{label}</legend> : null}\n name={name}\n onBlur={onBlur}\n orientation={inline ? 'horizontal' : 'vertical'}\n value={value != null ? String(value) : ''}\n onValueChange={(newValue) => {\n onChange(convertToOriginalType(newValue));\n }}\n >\n {options.map((option) => {\n if ('value' in option) {\n const optionTestId = slugify(\n `${testId}_option_${option.testId ?? option.value}`,\n { replaceDots: true },\n );\n return (\n <HeroRadio\n key={String(option.value)}\n classNames={itemClassNames}\n data-testid={optionTestId}\n isDisabled={!!disabled || option.disabled}\n value={String(option.value)}\n >\n {option.label ?? option.value}\n </HeroRadio>\n );\n }\n return null;\n })}\n </HeroRadioGroup>\n );\n};\n\nexport default Radios;\n","import Radios from './Radios';\n\nexport type { RadiosProps } from './Radios';\n\nexport { Radios };\n\nexport default Radios;\n"],"mappings":";;;;;;;AAaA,MAAa,kBAAA,GAAA,uBAAA,IAAoB,EAC/B,OAAO;CAEL,MAAM;CACN,UAAU;CACV,aAAa;CACb,iBAAiB;CACjB,WAAW;CACX,kBAAkB;CAClB,aACE;CAEF,OACE;CACF,SAAS;CACV,EACF,CAAC;;;;AAwCF,MAAM,UAAU,EACd,YAAY,KAAA,GACZ,SAAS,OACT,MACA,SACA,GAAG,wBAC4B;CAC/B,MAAM,EACJ,WACA,UACA,cACA,OAAO,EAAE,QAAQ,UAAU,KAAK,SAChC,SACA,OACA,UACA,WACEA,oCAAAA,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,EAAE,0BAA0BC,sBAAAA,2BAA2B,QAAQ;CAIrE,MAAM,cAAA,GAAA,uBAAA,sBADW,gBAAgB,EACiB,WAAW,OAAO;CAEpE,MAAM,iBAAiB;EACrB,MAAM,WAAW;EACjB,SAAS,WAAW;EACpB,aAAa,WAAW;EACxB,OAAO,WAAW;EAClB,cAAc,WAAW;EACzB,SAAS,WAAW;EACrB;AAED,QACE,iBAAA,GAAA,kBAAA,KAACC,cAAAA,YAAD;EACO;EACL,cAAY;EACA;EAGZ,gBAAc;EACd,iBAAe;EACf,eAAa;EACC;EACd,YAAY;EACZ,WAAW;EACX,YAAY;EACZ,OAAO,QAAQ,iBAAA,GAAA,kBAAA,KAAC,UAAD,EAAA,UAAS,OAAe,CAAA,GAAG;EACpC;EACE;EACR,aAAa,SAAS,eAAe;EACrC,OAAO,SAAS,OAAO,OAAO,MAAM,GAAG;EACvC,gBAAgB,aAAa;AAC3B,YAAS,sBAAsB,SAAS,CAAC;;YAG1C,QAAQ,KAAK,WAAW;AACvB,OAAI,WAAW,OAKb,QACE,iBAAA,GAAA,kBAAA,KAACC,cAAAA,OAAD;IAEE,YAAY;IACZ,gBAAA,GAAA,uBAAA,SAPF,GAAG,OAAO,UAAU,OAAO,UAAU,OAAO,SAC5C,EAAE,aAAa,MAAM,CACtB;IAMG,YAAY,CAAC,CAAC,YAAY,OAAO;IACjC,OAAO,OAAO,OAAO,MAAM;cAE1B,OAAO,SAAS,OAAO;IACd,EAPL,OAAO,OAAO,MAAM,CAOf;AAGhB,UAAO;IACP;EACa,CAAA;;;;AC/IrB,IAAA,iBAAe"}
|
package/dist/Select/index.cjs
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
Object.
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
Object.defineProperties(exports, {
|
|
2
|
+
__esModule: { value: true },
|
|
3
|
+
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
+
});
|
|
5
|
+
const require_Select = require("../Select-BEed8xan.cjs");
|
|
6
|
+
exports.Select = require_Select.Select;
|
|
7
|
+
exports.default = require_Select.Select_default;
|
package/dist/Select/index.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as SelectProps, t as Select } from "../index-
|
|
1
|
+
import { n as SelectProps, t as Select } from "../index-AmOFlE3L.cjs";
|
|
2
2
|
export { Select, Select as default, SelectProps };
|
package/dist/Select/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as SelectProps, t as Select } from "../index-
|
|
1
|
+
import { n as SelectProps, t as Select } from "../index-CuRn5Thx.js";
|
|
2
2
|
export { Select, Select as default, SelectProps };
|
package/dist/Select/index.js
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
import { n as
|
|
2
|
-
|
|
3
|
-
export { Select_default as Select, Select_default$1 as default };
|
|
1
|
+
import { n as Select, t as Select_default } from "../Select-BILyyM7Z.js";
|
|
2
|
+
export { Select, Select_default as default };
|
|
@@ -1,14 +1,13 @@
|
|
|
1
|
-
const require_FormContext = require(
|
|
2
|
-
const
|
|
3
|
-
const require_useFormContext = require(
|
|
4
|
-
const
|
|
1
|
+
const require_FormContext = require("./FormContext-BrY1FQYR.cjs");
|
|
2
|
+
const require_helpers_index = require("./helpers/index.cjs");
|
|
3
|
+
const require_useFormContext = require("./useFormContext-Bum4VP1o.cjs");
|
|
4
|
+
const require_hooks_useUniformField_index = require("./hooks/useUniformField/index.cjs");
|
|
5
5
|
let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
|
|
6
6
|
let react = require("react");
|
|
7
7
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
8
|
let react_select = require("react-select");
|
|
9
9
|
react_select = require_FormContext.__toESM(react_select);
|
|
10
10
|
let _heroui_select = require("@heroui/select");
|
|
11
|
-
|
|
12
11
|
//#region src/Select/Select.tsx
|
|
13
12
|
const selectVariants = (0, _fuf_stack_pixel_utils.tv)({ slots: {
|
|
14
13
|
base: "group leading-normal",
|
|
@@ -50,16 +49,14 @@ const InputComponent = (props) => {
|
|
|
50
49
|
});
|
|
51
50
|
};
|
|
52
51
|
const ControlComponent = (props) => {
|
|
53
|
-
const testId = `${props.selectProps["data-testid"]}_select`;
|
|
54
52
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
55
|
-
"data-testid":
|
|
53
|
+
"data-testid": `${props.selectProps["data-testid"]}_select`,
|
|
56
54
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_select.components.Control, { ...props })
|
|
57
55
|
});
|
|
58
56
|
};
|
|
59
57
|
const OptionComponent = (props) => {
|
|
60
|
-
const testId = `${props.selectProps["data-testid"]}_select_option_${(0, _fuf_stack_pixel_utils.slugify)(String(props?.data?.testId ?? props?.data?.value), { replaceDots: true })}`;
|
|
61
58
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
62
|
-
"data-testid": testId,
|
|
59
|
+
"data-testid": `${props.selectProps["data-testid"]}_select_option_${(0, _fuf_stack_pixel_utils.slugify)(String(props?.data?.testId ?? props?.data?.value), { replaceDots: true })}`,
|
|
63
60
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_select.components.Option, { ...props })
|
|
64
61
|
});
|
|
65
62
|
};
|
|
@@ -72,13 +69,13 @@ const DropdownIndicatorComponent = (props) => {
|
|
|
72
69
|
};
|
|
73
70
|
/** Select component based on [HeroUI Select](https://www.heroui.com//docs/components/select) and [React-Select](https://react-select.com/home) */
|
|
74
71
|
const Select = ({ className = void 0, clearable = true, filterOption = void 0, renderOptionLabel = void 0, inputValue = void 0, loading = false, multiSelect = false, name, onInputChange = void 0, options, placeholder = void 0, selectedOptionFallback = void 0, ...uniformFieldProps }) => {
|
|
75
|
-
const { ariaLabel, disabled, errorMessage, field: { onBlur, onChange, ref, value }, getErrorMessageProps, getHelperWrapperProps, getLabelProps, invalid, label, required, testId } =
|
|
72
|
+
const { ariaLabel, disabled, errorMessage, field: { onBlur, onChange, ref, value }, getErrorMessageProps, getHelperWrapperProps, getLabelProps, invalid, label, required, testId } = require_hooks_useUniformField_index.useUniformField({
|
|
76
73
|
name,
|
|
77
74
|
...uniformFieldProps
|
|
78
75
|
});
|
|
79
76
|
const { getFieldState } = require_useFormContext.useFormContext();
|
|
80
77
|
const [isFocused, setIsFocused] = (0, react.useState)(false);
|
|
81
|
-
const { convertToOriginalType } =
|
|
78
|
+
const { convertToOriginalType } = require_helpers_index.createOptionValueConverter(options);
|
|
82
79
|
const classNames = (0, _fuf_stack_pixel_utils.variantsToClassNames)(selectVariants(), className, "base");
|
|
83
80
|
const reactSelectClassNames = {
|
|
84
81
|
clearIndicator: () => {
|
|
@@ -177,12 +174,12 @@ const Select = ({ className = void 0, clearable = true, filterOption = void 0, r
|
|
|
177
174
|
};
|
|
178
175
|
};
|
|
179
176
|
if (multiSelect) {
|
|
180
|
-
if (!Array.isArray(value) ||
|
|
177
|
+
if (!Array.isArray(value) || require_helpers_index.isValueEmpty(value)) return [];
|
|
181
178
|
return value.map((v) => {
|
|
182
179
|
return findOption(v);
|
|
183
180
|
});
|
|
184
181
|
}
|
|
185
|
-
if (
|
|
182
|
+
if (require_helpers_index.isValueEmpty(value)) return null;
|
|
186
183
|
return findOption(value);
|
|
187
184
|
})();
|
|
188
185
|
const handleChange = (option) => {
|
|
@@ -260,23 +257,21 @@ const Select = ({ className = void 0, clearable = true, filterOption = void 0, r
|
|
|
260
257
|
]
|
|
261
258
|
});
|
|
262
259
|
};
|
|
263
|
-
var Select_default$1 = Select;
|
|
264
|
-
|
|
265
260
|
//#endregion
|
|
266
261
|
//#region src/Select/index.ts
|
|
267
|
-
var Select_default =
|
|
268
|
-
|
|
262
|
+
var Select_default = Select;
|
|
269
263
|
//#endregion
|
|
270
|
-
Object.defineProperty(exports,
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
264
|
+
Object.defineProperty(exports, "Select", {
|
|
265
|
+
enumerable: true,
|
|
266
|
+
get: function() {
|
|
267
|
+
return Select;
|
|
268
|
+
}
|
|
275
269
|
});
|
|
276
|
-
Object.defineProperty(exports,
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
270
|
+
Object.defineProperty(exports, "Select_default", {
|
|
271
|
+
enumerable: true,
|
|
272
|
+
get: function() {
|
|
273
|
+
return Select_default;
|
|
274
|
+
}
|
|
281
275
|
});
|
|
282
|
-
|
|
276
|
+
|
|
277
|
+
//# sourceMappingURL=Select-BEed8xan.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Select-BEed8xan.cjs","names":["components","useUniformField","useFormContext","createOptionValueConverter","isValueEmpty","ReactSelect"],"sources":["../src/Select/Select.tsx","../src/Select/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\nimport type { MultiValue, Props, SingleValue } from 'react-select';\n\nimport { useState } from 'react';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@heroui/select';\n\nimport { cn, slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { createOptionValueConverter, isValueEmpty } from '../helpers';\nimport { useFormContext } from '../hooks/useFormContext';\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const selectVariants = tv({\n slots: {\n base: 'group leading-normal',\n clearIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n control:\n 'duration-150! rounded-lg border-2 border-default-200 bg-content1 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n control_focused: 'border-focus',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-default-300',\n input: 'py-0.5 pl-1',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'pointer-events-auto relative bottom-1.5 ml-1 subpixel-antialiased text-small group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n loadingIndicator: '',\n loadingMessage: 'rounded-sm p-2 text-foreground-500',\n menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: 'z-50!',\n multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n option_focused: 'bg-default-100 active:bg-default-200',\n option_selected: 'bg-default-300',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'ml-1 py-0.5 pl-1 text-sm text-foreground-500',\n selectContainer: '',\n singleValue: 'ml-1! leading-7!',\n valueContainer: 'gap-1 p-1',\n },\n});\n\ninterface SelectOption {\n /**\n * True when option was auto-generated because the value wasn't found in options.\n * Use in renderOptionLabel to render a component that fetches the real label.\n */\n isFallback?: boolean;\n /** option label */\n label?: ReactNode;\n /** option value */\n value: string | number;\n}\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps 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; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n /** Filter Select Options */\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** Format the label of the option */\n renderOptionLabel?: undefined | Props['formatOptionLabel'];\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /**\n * Fallback option(s) for async selects when value isn't in current options.\n * Use when the selected value may not be in the options list (e.g., after\n * search results change). Used only if value not found in options.\n * For single select: pass the option object or undefined\n * For multi-select: pass an array of option objects\n */\n selectedOptionFallback?: SelectOption | SelectOption[];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}`;\n\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select`;\n return (\n <div data-testid={testId}>\n {}\n <components.Control {...props} />\n </div>\n );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select_option_${slugify(String(props?.data?.testId ?? props?.data?.value), { replaceDots: true })}`;\n return (\n <div data-testid={testId}>\n {}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_select_dropdown`}>\n {}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\n/** Select component based on [HeroUI Select](https://www.heroui.com//docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n filterOption = undefined,\n renderOptionLabel = undefined,\n inputValue = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n selectedOptionFallback = undefined,\n ...uniformFieldProps\n}: SelectProps) => {\n const {\n ariaLabel,\n disabled,\n errorMessage,\n field: { onBlur, onChange, ref, value },\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n invalid,\n label,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Get getFieldState to check isTouched in onChange callback\n const { getFieldState } = useFormContext();\n\n // Track if the select is focused\n const [isFocused, setIsFocused] = useState(false);\n\n // Create converter to preserve number types for option values\n const { convertToOriginalType } = createOptionValueConverter(options);\n\n // classNames from slots\n const variants = selectVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n // React-select classNames configuration\n const reactSelectClassNames = {\n clearIndicator: () => {\n return classNames.clearIndicator;\n },\n control: () => {\n return cn(classNames.control, {\n [classNames.control_focused]: isFocused && !invalid,\n });\n },\n dropdownIndicator: () => {\n return classNames.dropdownIndicator;\n },\n groupHeading: () => {\n return classNames.groupHeading;\n },\n indicatorSeparator: () => {\n return classNames.indicatorSeparator;\n },\n indicatorsContainer: () => {\n return classNames.indicatorsContainer;\n },\n input: () => {\n return classNames.input;\n },\n loadingIndicator: () => {\n return classNames.loadingIndicator;\n },\n loadingMessage: () => {\n return classNames.loadingMessage;\n },\n menu: () => {\n return classNames.menu;\n },\n menuList: () => {\n return classNames.menuList;\n },\n menuPortal: () => {\n return classNames.menuPortal;\n },\n multiValue: () => {\n return classNames.multiValue;\n },\n multiValueLabel: () => {\n return cn(classNames.multiValueLabel, `${getValueProps().className}`);\n },\n multiValueRemove: () => {\n return classNames.multiValueRemove;\n },\n noOptionsMessage: () => {\n return classNames.noOptionsMessage;\n },\n option: ({\n isFocused: optionIsFocused,\n isSelected: optionIsSelected,\n }: {\n isFocused: boolean;\n isSelected: boolean;\n }) => {\n return cn(classNames.option, {\n [classNames.option_focused]: optionIsFocused,\n [classNames.option_selected]: optionIsSelected,\n });\n },\n placeholder: () => {\n return classNames.placeholder;\n },\n singleValue: () => {\n return cn(classNames.singleValue, `${getValueProps().className}`);\n },\n valueContainer: () => {\n return classNames.valueContainer;\n },\n };\n\n const { getBaseProps, getTriggerProps, getValueProps } = useSelect({\n children: [],\n classNames,\n errorMessage,\n isDisabled: disabled,\n isInvalid: invalid,\n isLoading: loading,\n isRequired: required,\n label,\n labelPlacement: 'outside',\n });\n\n // Compute selected option(s) for react-select\n //\n // Priority for finding options:\n // 1. Look in current options list\n // 2. Use selectedOptionFallback prop (for async selects with pre-fetched data)\n // 3. Create fallback with value as label\n //\n // Handles edge cases:\n // - Compares as strings to support both string and number values\n // - Returns null for empty single-select (required by react-select to clear)\n // - Creates fallback options when value exists but isn't in options list\n // (common with async selects where options change after selection)\n const reactSelectValue = (() => {\n // Helper to find option by value\n const findOption = (v: string | number): SelectOption => {\n // First, look in options list\n const inOptions = options.find((option) => {\n return String(option.value) === String(v);\n });\n if (inOptions) {\n return inOptions;\n }\n\n // Second, look in selectedOptionFallback prop (for async selects)\n if (selectedOptionFallback) {\n if (Array.isArray(selectedOptionFallback)) {\n const inSelected = selectedOptionFallback.find((option) => {\n return String(option.value) === String(v);\n });\n if (inSelected) {\n return inSelected;\n }\n } else if (String(selectedOptionFallback.value) === String(v)) {\n return selectedOptionFallback;\n }\n }\n\n // Fallback: create option with value as label, marked as fallback\n return { isFallback: true, label: String(v), value: v };\n };\n\n if (multiSelect) {\n if (!Array.isArray(value) || isValueEmpty(value)) {\n return [];\n }\n return value.map((v) => {\n return findOption(v);\n });\n }\n\n // Single select - use isValueEmpty to handle marker strings (__NULL__, etc.)\n if (isValueEmpty(value)) {\n return null;\n }\n return findOption(value);\n })();\n\n // Handle selection change\n const handleChange = (\n option: MultiValue<SelectOption> | SingleValue<SelectOption>,\n ) => {\n if (multiSelect) {\n onChange(\n (option as SelectOption[])?.map((_option) => {\n return convertToOriginalType(_option.value);\n }),\n );\n } else {\n const newValue = (option as SelectOption)?.value;\n // Pass null explicitly when clearing (not undefined)\n onChange(newValue != null ? convertToOriginalType(newValue) : null);\n }\n // Mark field as touched immediately when a selection is made if not already touched\n // This ensures validation errors show right away (isTouched becomes true)\n // For Select components, selecting an option is a complete user action\n // (unlike text inputs where typing is ongoing), so we mark as touched immediately\n const { isTouched: currentIsTouched } = getFieldState(name, testId);\n if (!currentIsTouched) {\n onBlur();\n }\n };\n\n // Handle blur event\n const handleBlur = () => {\n setIsFocused(false);\n onBlur();\n };\n\n // Handle focus event\n const handleFocus = () => {\n setIsFocused(true);\n };\n\n return (\n <div\n {...getBaseProps()}\n className={cn(classNames.base)}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n data-required={required}\n data-testid={`${testId}_wrapper`}\n >\n {label ? (\n <label\n className={classNames.label}\n data-slot=\"label\"\n htmlFor={`react-select-${name}-input`}\n id={getLabelProps().id}\n >\n {label}\n </label>\n ) : null}\n <ReactSelect\n ref={ref}\n menuShouldBlockScroll\n unstyled\n aria-errormessage=\"\"\n aria-invalid={invalid}\n // set aria-labelledby to the label id so that the select is accessible\n aria-label={ariaLabel}\n classNames={reactSelectClassNames}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={testId}\n filterOption={filterOption}\n formatOptionLabel={renderOptionLabel}\n inputValue={inputValue}\n instanceId={name}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n // set menuPosition to fixed so that menu can be rendered\n // inside Card / Modal components, menuShouldBlockScroll\n // prevents container scroll when menu is open\n menuPosition=\"fixed\"\n name={name}\n onBlur={handleBlur}\n onChange={handleChange}\n onFocus={handleFocus}\n onInputChange={onInputChange}\n options={options}\n placeholder={placeholder}\n value={reactSelectValue}\n // set aria-labelledby to the label id so that the select is accessible\n aria-labelledby={\n label\n ? getTriggerProps()['aria-labelledby']?.split(' ')[1]\n : undefined\n }\n components={{\n Control: ControlComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n Input: InputComponent,\n Option: OptionComponent,\n }}\n />\n {invalid ? (\n <div {...getHelperWrapperProps()}>\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"],"mappings":"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"}
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { n as useFormContext } from "./useFormContext-
|
|
3
|
-
import {
|
|
1
|
+
import { createOptionValueConverter, isValueEmpty } from "./helpers/index.js";
|
|
2
|
+
import { n as useFormContext } from "./useFormContext-Bzpyonu6.js";
|
|
3
|
+
import { useUniformField } from "./hooks/useUniformField/index.js";
|
|
4
4
|
import { cn, slugify, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
|
|
5
5
|
import { useState } from "react";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
import ReactSelect, { components } from "react-select";
|
|
8
8
|
import { useSelect } from "@heroui/select";
|
|
9
|
-
|
|
10
9
|
//#region src/Select/Select.tsx
|
|
11
10
|
const selectVariants = tv({ slots: {
|
|
12
11
|
base: "group leading-normal",
|
|
@@ -48,16 +47,14 @@ const InputComponent = (props) => {
|
|
|
48
47
|
});
|
|
49
48
|
};
|
|
50
49
|
const ControlComponent = (props) => {
|
|
51
|
-
const testId = `${props.selectProps["data-testid"]}_select`;
|
|
52
50
|
return /* @__PURE__ */ jsx("div", {
|
|
53
|
-
"data-testid":
|
|
51
|
+
"data-testid": `${props.selectProps["data-testid"]}_select`,
|
|
54
52
|
children: /* @__PURE__ */ jsx(components.Control, { ...props })
|
|
55
53
|
});
|
|
56
54
|
};
|
|
57
55
|
const OptionComponent = (props) => {
|
|
58
|
-
const testId = `${props.selectProps["data-testid"]}_select_option_${slugify(String(props?.data?.testId ?? props?.data?.value), { replaceDots: true })}`;
|
|
59
56
|
return /* @__PURE__ */ jsx("div", {
|
|
60
|
-
"data-testid": testId,
|
|
57
|
+
"data-testid": `${props.selectProps["data-testid"]}_select_option_${slugify(String(props?.data?.testId ?? props?.data?.value), { replaceDots: true })}`,
|
|
61
58
|
children: /* @__PURE__ */ jsx(components.Option, { ...props })
|
|
62
59
|
});
|
|
63
60
|
};
|
|
@@ -258,12 +255,10 @@ const Select = ({ className = void 0, clearable = true, filterOption = void 0, r
|
|
|
258
255
|
]
|
|
259
256
|
});
|
|
260
257
|
};
|
|
261
|
-
var Select_default$1 = Select;
|
|
262
|
-
|
|
263
258
|
//#endregion
|
|
264
259
|
//#region src/Select/index.ts
|
|
265
|
-
var Select_default =
|
|
266
|
-
|
|
260
|
+
var Select_default = Select;
|
|
267
261
|
//#endregion
|
|
268
|
-
export {
|
|
269
|
-
|
|
262
|
+
export { Select as n, Select_default as t };
|
|
263
|
+
|
|
264
|
+
//# sourceMappingURL=Select-BILyyM7Z.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Select-BILyyM7Z.js","names":[],"sources":["../src/Select/Select.tsx","../src/Select/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\nimport type { MultiValue, Props, SingleValue } from 'react-select';\n\nimport { useState } from 'react';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@heroui/select';\n\nimport { cn, slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { createOptionValueConverter, isValueEmpty } from '../helpers';\nimport { useFormContext } from '../hooks/useFormContext';\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const selectVariants = tv({\n slots: {\n base: 'group leading-normal',\n clearIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n control:\n 'duration-150! rounded-lg border-2 border-default-200 bg-content1 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n control_focused: 'border-focus',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-default-300',\n input: 'py-0.5 pl-1',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'pointer-events-auto relative bottom-1.5 ml-1 subpixel-antialiased text-small group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n loadingIndicator: '',\n loadingMessage: 'rounded-sm p-2 text-foreground-500',\n menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: 'z-50!',\n multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n option_focused: 'bg-default-100 active:bg-default-200',\n option_selected: 'bg-default-300',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'ml-1 py-0.5 pl-1 text-sm text-foreground-500',\n selectContainer: '',\n singleValue: 'ml-1! leading-7!',\n valueContainer: 'gap-1 p-1',\n },\n});\n\ninterface SelectOption {\n /**\n * True when option was auto-generated because the value wasn't found in options.\n * Use in renderOptionLabel to render a component that fetches the real label.\n */\n isFallback?: boolean;\n /** option label */\n label?: ReactNode;\n /** option value */\n value: string | number;\n}\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps 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; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n /** Filter Select Options */\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** Format the label of the option */\n renderOptionLabel?: undefined | Props['formatOptionLabel'];\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /**\n * Fallback option(s) for async selects when value isn't in current options.\n * Use when the selected value may not be in the options list (e.g., after\n * search results change). Used only if value not found in options.\n * For single select: pass the option object or undefined\n * For multi-select: pass an array of option objects\n */\n selectedOptionFallback?: SelectOption | SelectOption[];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}`;\n\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select`;\n return (\n <div data-testid={testId}>\n {}\n <components.Control {...props} />\n </div>\n );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select_option_${slugify(String(props?.data?.testId ?? props?.data?.value), { replaceDots: true })}`;\n return (\n <div data-testid={testId}>\n {}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_select_dropdown`}>\n {}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\n/** Select component based on [HeroUI Select](https://www.heroui.com//docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n filterOption = undefined,\n renderOptionLabel = undefined,\n inputValue = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n selectedOptionFallback = undefined,\n ...uniformFieldProps\n}: SelectProps) => {\n const {\n ariaLabel,\n disabled,\n errorMessage,\n field: { onBlur, onChange, ref, value },\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n invalid,\n label,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Get getFieldState to check isTouched in onChange callback\n const { getFieldState } = useFormContext();\n\n // Track if the select is focused\n const [isFocused, setIsFocused] = useState(false);\n\n // Create converter to preserve number types for option values\n const { convertToOriginalType } = createOptionValueConverter(options);\n\n // classNames from slots\n const variants = selectVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n // React-select classNames configuration\n const reactSelectClassNames = {\n clearIndicator: () => {\n return classNames.clearIndicator;\n },\n control: () => {\n return cn(classNames.control, {\n [classNames.control_focused]: isFocused && !invalid,\n });\n },\n dropdownIndicator: () => {\n return classNames.dropdownIndicator;\n },\n groupHeading: () => {\n return classNames.groupHeading;\n },\n indicatorSeparator: () => {\n return classNames.indicatorSeparator;\n },\n indicatorsContainer: () => {\n return classNames.indicatorsContainer;\n },\n input: () => {\n return classNames.input;\n },\n loadingIndicator: () => {\n return classNames.loadingIndicator;\n },\n loadingMessage: () => {\n return classNames.loadingMessage;\n },\n menu: () => {\n return classNames.menu;\n },\n menuList: () => {\n return classNames.menuList;\n },\n menuPortal: () => {\n return classNames.menuPortal;\n },\n multiValue: () => {\n return classNames.multiValue;\n },\n multiValueLabel: () => {\n return cn(classNames.multiValueLabel, `${getValueProps().className}`);\n },\n multiValueRemove: () => {\n return classNames.multiValueRemove;\n },\n noOptionsMessage: () => {\n return classNames.noOptionsMessage;\n },\n option: ({\n isFocused: optionIsFocused,\n isSelected: optionIsSelected,\n }: {\n isFocused: boolean;\n isSelected: boolean;\n }) => {\n return cn(classNames.option, {\n [classNames.option_focused]: optionIsFocused,\n [classNames.option_selected]: optionIsSelected,\n });\n },\n placeholder: () => {\n return classNames.placeholder;\n },\n singleValue: () => {\n return cn(classNames.singleValue, `${getValueProps().className}`);\n },\n valueContainer: () => {\n return classNames.valueContainer;\n },\n };\n\n const { getBaseProps, getTriggerProps, getValueProps } = useSelect({\n children: [],\n classNames,\n errorMessage,\n isDisabled: disabled,\n isInvalid: invalid,\n isLoading: loading,\n isRequired: required,\n label,\n labelPlacement: 'outside',\n });\n\n // Compute selected option(s) for react-select\n //\n // Priority for finding options:\n // 1. Look in current options list\n // 2. Use selectedOptionFallback prop (for async selects with pre-fetched data)\n // 3. Create fallback with value as label\n //\n // Handles edge cases:\n // - Compares as strings to support both string and number values\n // - Returns null for empty single-select (required by react-select to clear)\n // - Creates fallback options when value exists but isn't in options list\n // (common with async selects where options change after selection)\n const reactSelectValue = (() => {\n // Helper to find option by value\n const findOption = (v: string | number): SelectOption => {\n // First, look in options list\n const inOptions = options.find((option) => {\n return String(option.value) === String(v);\n });\n if (inOptions) {\n return inOptions;\n }\n\n // Second, look in selectedOptionFallback prop (for async selects)\n if (selectedOptionFallback) {\n if (Array.isArray(selectedOptionFallback)) {\n const inSelected = selectedOptionFallback.find((option) => {\n return String(option.value) === String(v);\n });\n if (inSelected) {\n return inSelected;\n }\n } else if (String(selectedOptionFallback.value) === String(v)) {\n return selectedOptionFallback;\n }\n }\n\n // Fallback: create option with value as label, marked as fallback\n return { isFallback: true, label: String(v), value: v };\n };\n\n if (multiSelect) {\n if (!Array.isArray(value) || isValueEmpty(value)) {\n return [];\n }\n return value.map((v) => {\n return findOption(v);\n });\n }\n\n // Single select - use isValueEmpty to handle marker strings (__NULL__, etc.)\n if (isValueEmpty(value)) {\n return null;\n }\n return findOption(value);\n })();\n\n // Handle selection change\n const handleChange = (\n option: MultiValue<SelectOption> | SingleValue<SelectOption>,\n ) => {\n if (multiSelect) {\n onChange(\n (option as SelectOption[])?.map((_option) => {\n return convertToOriginalType(_option.value);\n }),\n );\n } else {\n const newValue = (option as SelectOption)?.value;\n // Pass null explicitly when clearing (not undefined)\n onChange(newValue != null ? convertToOriginalType(newValue) : null);\n }\n // Mark field as touched immediately when a selection is made if not already touched\n // This ensures validation errors show right away (isTouched becomes true)\n // For Select components, selecting an option is a complete user action\n // (unlike text inputs where typing is ongoing), so we mark as touched immediately\n const { isTouched: currentIsTouched } = getFieldState(name, testId);\n if (!currentIsTouched) {\n onBlur();\n }\n };\n\n // Handle blur event\n const handleBlur = () => {\n setIsFocused(false);\n onBlur();\n };\n\n // Handle focus event\n const handleFocus = () => {\n setIsFocused(true);\n };\n\n return (\n <div\n {...getBaseProps()}\n className={cn(classNames.base)}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n data-required={required}\n data-testid={`${testId}_wrapper`}\n >\n {label ? (\n <label\n className={classNames.label}\n data-slot=\"label\"\n htmlFor={`react-select-${name}-input`}\n id={getLabelProps().id}\n >\n {label}\n </label>\n ) : null}\n <ReactSelect\n ref={ref}\n menuShouldBlockScroll\n unstyled\n aria-errormessage=\"\"\n aria-invalid={invalid}\n // set aria-labelledby to the label id so that the select is accessible\n aria-label={ariaLabel}\n classNames={reactSelectClassNames}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={testId}\n filterOption={filterOption}\n formatOptionLabel={renderOptionLabel}\n inputValue={inputValue}\n instanceId={name}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n // set menuPosition to fixed so that menu can be rendered\n // inside Card / Modal components, menuShouldBlockScroll\n // prevents container scroll when menu is open\n menuPosition=\"fixed\"\n name={name}\n onBlur={handleBlur}\n onChange={handleChange}\n onFocus={handleFocus}\n onInputChange={onInputChange}\n options={options}\n placeholder={placeholder}\n value={reactSelectValue}\n // set aria-labelledby to the label id so that the select is accessible\n aria-labelledby={\n label\n ? getTriggerProps()['aria-labelledby']?.split(' ')[1]\n : undefined\n }\n components={{\n Control: ControlComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n Input: InputComponent,\n Option: OptionComponent,\n }}\n />\n {invalid ? (\n <div {...getHelperWrapperProps()}>\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"],"mappings":"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"}
|
package/dist/Slider/index.cjs
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
Object.
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
Object.defineProperties(exports, {
|
|
2
|
+
__esModule: { value: true },
|
|
3
|
+
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
+
});
|
|
5
|
+
const require_Slider = require("../Slider-CFYP86ku.cjs");
|
|
6
|
+
exports.Slider = require_Slider.Slider;
|
|
7
|
+
exports.default = require_Slider.Slider_default;
|
package/dist/Slider/index.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as SliderProps, t as Slider } from "../index-
|
|
1
|
+
import { n as SliderProps, t as Slider } from "../index-BzIB-MQg.cjs";
|
|
2
2
|
export { Slider, Slider as default, SliderProps };
|
package/dist/Slider/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as SliderProps, t as Slider } from "../index-
|
|
1
|
+
import { n as SliderProps, t as Slider } from "../index-B9lVf5LI.js";
|
|
2
2
|
export { Slider, Slider as default, SliderProps };
|
package/dist/Slider/index.js
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
import { n as
|
|
2
|
-
|
|
3
|
-
export { Slider_default as Slider, Slider_default$1 as default };
|
|
1
|
+
import { n as Slider, t as Slider_default } from "../Slider-DxRcLu-j.js";
|
|
2
|
+
export { Slider, Slider_default as default };
|
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
const
|
|
1
|
+
require("./FormContext-BrY1FQYR.cjs");
|
|
2
|
+
const require_hooks_useUniformField_index = require("./hooks/useUniformField/index.cjs");
|
|
3
3
|
let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
|
|
4
4
|
let react = require("react");
|
|
5
5
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
6
6
|
let _react_aria_visually_hidden = require("@react-aria/visually-hidden");
|
|
7
7
|
let _heroui_slider = require("@heroui/slider");
|
|
8
|
-
|
|
9
8
|
//#region src/Slider/Slider.tsx
|
|
10
9
|
const sliderVariants = (0, _fuf_stack_pixel_utils.tv)({ slots: {
|
|
11
10
|
base: "group",
|
|
@@ -26,7 +25,7 @@ const sliderVariants = (0, _fuf_stack_pixel_utils.tv)({ slots: {
|
|
|
26
25
|
* Slider component based on [HeroUI Slider](https://www.heroui.com//docs/components/slider)
|
|
27
26
|
*/
|
|
28
27
|
const Slider = ({ className = void 0, endContent = void 0, fillOffset = void 0, name, showSteps = false, size = "md", startContent = void 0, step = 1, minValue = 0, maxValue = 100, ...uniformFieldProps }) => {
|
|
29
|
-
const { ariaLabel, disabled, field, getErrorMessageProps, getHelperWrapperProps, invalid, label, onBlur, onChange, ref, required, errorMessage, testId } =
|
|
28
|
+
const { ariaLabel, disabled, field, getErrorMessageProps, getHelperWrapperProps, invalid, label, onBlur, onChange, ref, required, errorMessage, testId } = require_hooks_useUniformField_index.useUniformField({
|
|
30
29
|
name,
|
|
31
30
|
...uniformFieldProps
|
|
32
31
|
});
|
|
@@ -101,23 +100,21 @@ const Slider = ({ className = void 0, endContent = void 0, fillOffset = void 0,
|
|
|
101
100
|
]
|
|
102
101
|
});
|
|
103
102
|
};
|
|
104
|
-
var Slider_default$1 = Slider;
|
|
105
|
-
|
|
106
103
|
//#endregion
|
|
107
104
|
//#region src/Slider/index.ts
|
|
108
|
-
var Slider_default =
|
|
109
|
-
|
|
105
|
+
var Slider_default = Slider;
|
|
110
106
|
//#endregion
|
|
111
|
-
Object.defineProperty(exports,
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
107
|
+
Object.defineProperty(exports, "Slider", {
|
|
108
|
+
enumerable: true,
|
|
109
|
+
get: function() {
|
|
110
|
+
return Slider;
|
|
111
|
+
}
|
|
116
112
|
});
|
|
117
|
-
Object.defineProperty(exports,
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
113
|
+
Object.defineProperty(exports, "Slider_default", {
|
|
114
|
+
enumerable: true,
|
|
115
|
+
get: function() {
|
|
116
|
+
return Slider_default;
|
|
117
|
+
}
|
|
122
118
|
});
|
|
123
|
-
|
|
119
|
+
|
|
120
|
+
//# sourceMappingURL=Slider-CFYP86ku.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Slider-CFYP86ku.cjs","names":["useUniformField","VisuallyHidden","HeroUISlider"],"sources":["../src/Slider/Slider.tsx","../src/Slider/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Slider as HeroUISlider } from '@heroui/slider';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const sliderVariants = tv({\n slots: {\n base: 'group',\n endContent: '',\n errorMessage: 'ml-1 mt-1',\n filler: '',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n labelWrapper: '',\n mark: '',\n startContent: '',\n step: '',\n thumb: '',\n track: '',\n trackWrapper: '',\n value: '',\n },\n});\n\ntype VariantProps = TVProps<typeof sliderVariants>;\ntype ClassName = TVClassName<typeof sliderVariants>;\n\nexport interface SliderProps 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 /** input field is disabled */\n disabled?: boolean;\n /** Content to display at the end of the slider */\n endContent?: ReactNode;\n /** The offset from where the fill should start */\n fillOffset?: number;\n /** form field label */\n label?: string;\n /** form field name */\n name: string;\n /**\n * Whether to show step dots on the slider\n * @default false\n */\n showSteps?: boolean;\n /**\n * The size of the slider\n * @default \"md\"\n */\n size?: 'sm' | 'md' | 'lg';\n /** Content to display at the start of the slider */\n startContent?: ReactNode;\n /**\n * The step value of the slider\n * @default 1\n */\n step?: number;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /**\n * The minimum value of the slider\n * @default 0\n */\n minValue?: number;\n /**\n * The maximum value of the slider\n * @default 100\n */\n maxValue?: number;\n}\n\n/**\n * Slider component based on [HeroUI Slider](https://www.heroui.com//docs/components/slider)\n */\nconst Slider = ({\n className = undefined,\n endContent = undefined,\n fillOffset = undefined,\n name,\n showSteps = false,\n size = 'md',\n startContent = undefined,\n step = 1,\n minValue = 0,\n maxValue = 100,\n ...uniformFieldProps\n}: SliderProps) => {\n const {\n ariaLabel,\n disabled,\n field,\n getErrorMessageProps,\n getHelperWrapperProps,\n invalid,\n label,\n onBlur,\n onChange,\n ref,\n required,\n errorMessage,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Ref for the visual slider to forward focus\n const visualSliderRef = useRef<HTMLDivElement>(null);\n\n // classNames from slots\n const variants = sliderVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n // Get the current value, defaulting to minValue if null/undefined\n const currentValue = field.value != null ? Number(field.value) : minValue;\n\n return (\n <div\n className={classNames.base}\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n >\n {/* Visually hidden input for form accessibility and focus management */}\n <VisuallyHidden>\n <input\n ref={ref}\n aria-label={ariaLabel}\n disabled={disabled}\n max={maxValue}\n min={minValue}\n name={name}\n onBlur={onBlur}\n step={step}\n tabIndex={-1}\n type=\"range\"\n value={currentValue}\n onChange={(e) => {\n onChange(Number(e.target.value));\n }}\n onFocus={() => {\n // When RHF focuses this hidden input (e.g., on validation error),\n // forward focus to the visual slider to show focus ring\n visualSliderRef.current?.focus();\n }}\n />\n </VisuallyHidden>\n {/* Visual HeroUISlider component */}\n <HeroUISlider\n ref={visualSliderRef}\n aria-label={ariaLabel}\n color={invalid ? 'danger' : 'primary'}\n endContent={endContent}\n fillOffset={fillOffset}\n isDisabled={disabled}\n label={label}\n maxValue={maxValue}\n minValue={minValue}\n name={`${name}_slider`}\n onBlur={onBlur}\n onChange={onChange}\n showSteps={showSteps}\n size={size}\n startContent={startContent}\n step={step}\n value={currentValue}\n classNames={{\n endContent: classNames.endContent,\n filler: classNames.filler,\n label: classNames.label,\n labelWrapper: classNames.labelWrapper,\n mark: classNames.mark,\n startContent: classNames.startContent,\n step: classNames.step,\n thumb: classNames.thumb,\n track: classNames.track,\n trackWrapper: classNames.trackWrapper,\n value: classNames.value,\n }}\n />\n {invalid ? (\n <div\n {...getHelperWrapperProps()}\n className={cn(\n getHelperWrapperProps()?.className,\n // force helper to be visible (for some reason it's hidden by default) and remove margin\n 'ml-0 block',\n )}\n >\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default Slider;\n","import Slider from './Slider';\n\nexport type { SliderProps } from './Slider';\n\nexport { Slider };\n\nexport default Slider;\n"],"mappings":";;;;;;;;AAYA,MAAa,kBAAA,GAAA,uBAAA,IAAoB,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CACd,QAAQ;CAGR,OACE;CACF,cAAc;CACd,MAAM;CACN,cAAc;CACd,MAAM;CACN,OAAO;CACP,OAAO;CACP,cAAc;CACd,OAAO;CACR,EACF,CAAC;;;;AAsDF,MAAM,UAAU,EACd,YAAY,KAAA,GACZ,aAAa,KAAA,GACb,aAAa,KAAA,GACb,MACA,YAAY,OACZ,OAAO,MACP,eAAe,KAAA,GACf,OAAO,GACP,WAAW,GACX,WAAW,KACX,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,UACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,cACA,WACEA,oCAAAA,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,mBAAA,GAAA,MAAA,QAAyC,KAAK;CAIpD,MAAM,cAAA,GAAA,uBAAA,sBADW,gBAAgB,EACiB,WAAW,OAAO;CAGpE,MAAM,eAAe,MAAM,SAAS,OAAO,OAAO,MAAM,MAAM,GAAG;AAEjE,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,WAAW,WAAW;EACtB,gBAAc;EACd,iBAAe;EACf,eAAa;YAJf;GAOE,iBAAA,GAAA,kBAAA,KAACC,4BAAAA,gBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAC,SAAD;IACO;IACL,cAAY;IACF;IACV,KAAK;IACL,KAAK;IACC;IACE;IACF;IACN,UAAU;IACV,MAAK;IACL,OAAO;IACP,WAAW,MAAM;AACf,cAAS,OAAO,EAAE,OAAO,MAAM,CAAC;;IAElC,eAAe;AAGb,qBAAgB,SAAS,OAAO;;IAElC,CAAA,EACa,CAAA;GAEjB,iBAAA,GAAA,kBAAA,KAACC,eAAAA,QAAD;IACE,KAAK;IACL,cAAY;IACZ,OAAO,UAAU,WAAW;IAChB;IACA;IACZ,YAAY;IACL;IACG;IACA;IACV,MAAM,GAAG,KAAK;IACN;IACE;IACC;IACL;IACQ;IACR;IACN,OAAO;IACP,YAAY;KACV,YAAY,WAAW;KACvB,QAAQ,WAAW;KACnB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,OAAO,WAAW;KAClB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,OAAO,WAAW;KACnB;IACD,CAAA;GACD,UACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;IACE,GAAI,uBAAuB;IAC3B,YAAA,GAAA,uBAAA,IACE,uBAAuB,EAAE,WAEzB,aACD;cAED,iBAAA,GAAA,kBAAA,KAAC,OAAD;KAAK,GAAI,sBAAsB;eAAG;KAAmB,CAAA;IACjD,CAAA,GACJ;GACA;;;;;ACrMV,IAAA,iBAAe"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { useUniformField } from "./hooks/useUniformField/index.js";
|
|
2
2
|
import { cn, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
|
|
3
3
|
import { useRef } from "react";
|
|
4
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
import { VisuallyHidden } from "@react-aria/visually-hidden";
|
|
6
6
|
import { Slider } from "@heroui/slider";
|
|
7
|
-
|
|
8
7
|
//#region src/Slider/Slider.tsx
|
|
9
8
|
const sliderVariants = tv({ slots: {
|
|
10
9
|
base: "group",
|
|
@@ -100,12 +99,10 @@ const Slider$1 = ({ className = void 0, endContent = void 0, fillOffset = void 0
|
|
|
100
99
|
]
|
|
101
100
|
});
|
|
102
101
|
};
|
|
103
|
-
var Slider_default$1 = Slider$1;
|
|
104
|
-
|
|
105
102
|
//#endregion
|
|
106
103
|
//#region src/Slider/index.ts
|
|
107
|
-
var Slider_default =
|
|
108
|
-
|
|
104
|
+
var Slider_default = Slider$1;
|
|
109
105
|
//#endregion
|
|
110
|
-
export {
|
|
111
|
-
|
|
106
|
+
export { Slider$1 as n, Slider_default as t };
|
|
107
|
+
|
|
108
|
+
//# sourceMappingURL=Slider-DxRcLu-j.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider-
|
|
1
|
+
{"version":3,"file":"Slider-DxRcLu-j.js","names":["Slider","HeroUISlider","Slider"],"sources":["../src/Slider/Slider.tsx","../src/Slider/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Slider as HeroUISlider } from '@heroui/slider';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const sliderVariants = tv({\n slots: {\n base: 'group',\n endContent: '',\n errorMessage: 'ml-1 mt-1',\n filler: '',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n labelWrapper: '',\n mark: '',\n startContent: '',\n step: '',\n thumb: '',\n track: '',\n trackWrapper: '',\n value: '',\n },\n});\n\ntype VariantProps = TVProps<typeof sliderVariants>;\ntype ClassName = TVClassName<typeof sliderVariants>;\n\nexport interface SliderProps 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 /** input field is disabled */\n disabled?: boolean;\n /** Content to display at the end of the slider */\n endContent?: ReactNode;\n /** The offset from where the fill should start */\n fillOffset?: number;\n /** form field label */\n label?: string;\n /** form field name */\n name: string;\n /**\n * Whether to show step dots on the slider\n * @default false\n */\n showSteps?: boolean;\n /**\n * The size of the slider\n * @default \"md\"\n */\n size?: 'sm' | 'md' | 'lg';\n /** Content to display at the start of the slider */\n startContent?: ReactNode;\n /**\n * The step value of the slider\n * @default 1\n */\n step?: number;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /**\n * The minimum value of the slider\n * @default 0\n */\n minValue?: number;\n /**\n * The maximum value of the slider\n * @default 100\n */\n maxValue?: number;\n}\n\n/**\n * Slider component based on [HeroUI Slider](https://www.heroui.com//docs/components/slider)\n */\nconst Slider = ({\n className = undefined,\n endContent = undefined,\n fillOffset = undefined,\n name,\n showSteps = false,\n size = 'md',\n startContent = undefined,\n step = 1,\n minValue = 0,\n maxValue = 100,\n ...uniformFieldProps\n}: SliderProps) => {\n const {\n ariaLabel,\n disabled,\n field,\n getErrorMessageProps,\n getHelperWrapperProps,\n invalid,\n label,\n onBlur,\n onChange,\n ref,\n required,\n errorMessage,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Ref for the visual slider to forward focus\n const visualSliderRef = useRef<HTMLDivElement>(null);\n\n // classNames from slots\n const variants = sliderVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n // Get the current value, defaulting to minValue if null/undefined\n const currentValue = field.value != null ? Number(field.value) : minValue;\n\n return (\n <div\n className={classNames.base}\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n >\n {/* Visually hidden input for form accessibility and focus management */}\n <VisuallyHidden>\n <input\n ref={ref}\n aria-label={ariaLabel}\n disabled={disabled}\n max={maxValue}\n min={minValue}\n name={name}\n onBlur={onBlur}\n step={step}\n tabIndex={-1}\n type=\"range\"\n value={currentValue}\n onChange={(e) => {\n onChange(Number(e.target.value));\n }}\n onFocus={() => {\n // When RHF focuses this hidden input (e.g., on validation error),\n // forward focus to the visual slider to show focus ring\n visualSliderRef.current?.focus();\n }}\n />\n </VisuallyHidden>\n {/* Visual HeroUISlider component */}\n <HeroUISlider\n ref={visualSliderRef}\n aria-label={ariaLabel}\n color={invalid ? 'danger' : 'primary'}\n endContent={endContent}\n fillOffset={fillOffset}\n isDisabled={disabled}\n label={label}\n maxValue={maxValue}\n minValue={minValue}\n name={`${name}_slider`}\n onBlur={onBlur}\n onChange={onChange}\n showSteps={showSteps}\n size={size}\n startContent={startContent}\n step={step}\n value={currentValue}\n classNames={{\n endContent: classNames.endContent,\n filler: classNames.filler,\n label: classNames.label,\n labelWrapper: classNames.labelWrapper,\n mark: classNames.mark,\n startContent: classNames.startContent,\n step: classNames.step,\n thumb: classNames.thumb,\n track: classNames.track,\n trackWrapper: classNames.trackWrapper,\n value: classNames.value,\n }}\n />\n {invalid ? (\n <div\n {...getHelperWrapperProps()}\n className={cn(\n getHelperWrapperProps()?.className,\n // force helper to be visible (for some reason it's hidden by default) and remove margin\n 'ml-0 block',\n )}\n >\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default Slider;\n","import Slider from './Slider';\n\nexport type { SliderProps } from './Slider';\n\nexport { Slider };\n\nexport default Slider;\n"],"mappings":";;;;;;;AAYA,MAAa,iBAAiB,GAAG,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CACd,QAAQ;CAGR,OACE;CACF,cAAc;CACd,MAAM;CACN,cAAc;CACd,MAAM;CACN,OAAO;CACP,OAAO;CACP,cAAc;CACd,OAAO;CACR,EACF,CAAC;;;;AAsDF,MAAMA,YAAU,EACd,YAAY,KAAA,GACZ,aAAa,KAAA,GACb,aAAa,KAAA,GACb,MACA,YAAY,OACZ,OAAO,MACP,eAAe,KAAA,GACf,OAAO,GACP,WAAW,GACX,WAAW,KACX,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,UACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,cACA,WACE,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,kBAAkB,OAAuB,KAAK;CAIpD,MAAM,aAAa,qBADF,gBAAgB,EACiB,WAAW,OAAO;CAGpE,MAAM,eAAe,MAAM,SAAS,OAAO,OAAO,MAAM,MAAM,GAAG;AAEjE,QACE,qBAAC,OAAD;EACE,WAAW,WAAW;EACtB,gBAAc;EACd,iBAAe;EACf,eAAa;YAJf;GAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,SAAD;IACO;IACL,cAAY;IACF;IACV,KAAK;IACL,KAAK;IACC;IACE;IACF;IACN,UAAU;IACV,MAAK;IACL,OAAO;IACP,WAAW,MAAM;AACf,cAAS,OAAO,EAAE,OAAO,MAAM,CAAC;;IAElC,eAAe;AAGb,qBAAgB,SAAS,OAAO;;IAElC,CAAA,EACa,CAAA;GAEjB,oBAACC,QAAD;IACE,KAAK;IACL,cAAY;IACZ,OAAO,UAAU,WAAW;IAChB;IACA;IACZ,YAAY;IACL;IACG;IACA;IACV,MAAM,GAAG,KAAK;IACN;IACE;IACC;IACL;IACQ;IACR;IACN,OAAO;IACP,YAAY;KACV,YAAY,WAAW;KACvB,QAAQ,WAAW;KACnB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,OAAO,WAAW;KAClB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,OAAO,WAAW;KACnB;IACD,CAAA;GACD,UACC,oBAAC,OAAD;IACE,GAAI,uBAAuB;IAC3B,WAAW,GACT,uBAAuB,EAAE,WAEzB,aACD;cAED,oBAAC,OAAD;KAAK,GAAI,sBAAsB;eAAG;KAAmB,CAAA;IACjD,CAAA,GACJ;GACA;;;;;ACrMV,IAAA,iBAAeC"}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
Object.
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
Object.defineProperties(exports, {
|
|
2
|
+
__esModule: { value: true },
|
|
3
|
+
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
+
});
|
|
5
|
+
const require_SubmitButton = require("../SubmitButton-D7xacDyS.cjs");
|
|
6
|
+
exports.SubmitButton = require_SubmitButton.SubmitButton;
|
|
7
|
+
exports.default = require_SubmitButton.SubmitButton_default;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as SubmitButtonProps, t as SubmitButton } from "../index-
|
|
1
|
+
import { n as SubmitButtonProps, t as SubmitButton } from "../index-DkiQkdCW.cjs";
|
|
2
2
|
export { SubmitButton, SubmitButton as default, SubmitButtonProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as SubmitButtonProps, t as SubmitButton } from "../index-
|
|
1
|
+
import { n as SubmitButtonProps, t as SubmitButton } from "../index-DFWSHdua.js";
|
|
2
2
|
export { SubmitButton, SubmitButton as default, SubmitButtonProps };
|