@fuf-stack/uniform 1.22.5 → 1.22.6
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 +113 -4
- package/dist/Checkboxes/index.cjs.map +1 -0
- package/dist/Checkboxes/index.d.cts +534 -2
- package/dist/Checkboxes/index.d.cts.map +1 -0
- package/dist/Checkboxes/index.d.ts +534 -2
- package/dist/Checkboxes/index.d.ts.map +1 -0
- package/dist/Checkboxes/index.js +112 -2
- package/dist/Checkboxes/index.js.map +1 -0
- package/dist/DatePicker/index.cjs +194 -4
- package/dist/DatePicker/index.cjs.map +1 -0
- package/dist/DatePicker/index.d.cts +1413 -2
- package/dist/{index-D7AUghFx.d.ts.map → DatePicker/index.d.cts.map} +1 -1
- package/dist/DatePicker/index.d.ts +1413 -2
- package/dist/{index-CD0Wpla3.d.cts.map → DatePicker/index.d.ts.map} +1 -1
- package/dist/DatePicker/index.js +193 -2
- package/dist/DatePicker/index.js.map +1 -0
- package/dist/FieldArray/index.cjs +495 -4
- package/dist/FieldArray/index.cjs.map +1 -0
- package/dist/FieldArray/index.d.cts +539 -2
- package/dist/{index-B4XExHDi.d.cts.map → FieldArray/index.d.cts.map} +1 -1
- package/dist/FieldArray/index.d.ts +539 -2
- package/dist/{index-yYjVSHlN.d.ts.map → FieldArray/index.d.ts.map} +1 -1
- package/dist/FieldArray/index.js +494 -2
- package/dist/FieldArray/index.js.map +1 -0
- package/dist/FieldCard/index.cjs +226 -4
- package/dist/FieldCard/index.cjs.map +1 -0
- package/dist/FieldCard/index.d.cts +314 -2
- package/dist/FieldCard/index.d.cts.map +1 -0
- package/dist/FieldCard/index.d.ts +314 -2
- package/dist/FieldCard/index.d.ts.map +1 -0
- package/dist/FieldCard/index.js +225 -2
- package/dist/FieldCard/index.js.map +1 -0
- package/dist/{FieldCopyTestIdButton-Dpmo0uBV.js → FieldCopyTestIdButton-CRJBix9D.js} +2 -2
- package/dist/{FieldCopyTestIdButton-Dpmo0uBV.js.map → FieldCopyTestIdButton-CRJBix9D.js.map} +1 -1
- package/dist/{FieldCopyTestIdButton-ptoB1F75.cjs → FieldCopyTestIdButton-D3D_LmJh.cjs} +1 -8
- package/dist/{FieldCopyTestIdButton-ptoB1F75.cjs.map → FieldCopyTestIdButton-D3D_LmJh.cjs.map} +1 -1
- package/dist/{FieldValidationError-ktTyyyip.js → FieldValidationError-ByRoIxaM.js} +5 -5
- package/dist/{FieldValidationError-ktTyyyip.js.map → FieldValidationError-ByRoIxaM.js.map} +1 -1
- package/dist/{FieldValidationError-BQcvvU9i.cjs → FieldValidationError-CfYKzl7P.cjs} +5 -6
- package/dist/{FieldValidationError-BQcvvU9i.cjs.map → FieldValidationError-CfYKzl7P.cjs.map} +1 -1
- package/dist/Form/index.cjs +118 -3
- package/dist/Form/index.cjs.map +1 -0
- package/dist/Form/index.d.cts +43 -2
- package/dist/Form/index.d.cts.map +1 -0
- package/dist/Form/index.d.ts +43 -2
- package/dist/Form/index.d.ts.map +1 -0
- package/dist/Form/index.js +118 -2
- package/dist/Form/index.js.map +1 -0
- package/dist/{FormContext-3kamRn2C.d.cts → FormContext-BLWS7bhO.d.cts} +1 -1
- package/dist/{FormContext-3kamRn2C.d.cts.map → FormContext-BLWS7bhO.d.cts.map} +1 -1
- package/dist/{FormContext-BQeKOV-0.js → FormContext-DjJOJKxj.js} +1 -1
- package/dist/{FormContext-BQeKOV-0.js.map → FormContext-DjJOJKxj.js.map} +1 -1
- package/dist/{FormContext-DsmS_mkO.cjs → FormContext-EGH0cVnH.cjs} +1 -1
- package/dist/{FormContext-DsmS_mkO.cjs.map → FormContext-EGH0cVnH.cjs.map} +1 -1
- package/dist/{FormContext-i66vM5f1.d.ts → FormContext-LgzrDWu1.d.ts} +1 -1
- package/dist/{FormContext-i66vM5f1.d.ts.map → FormContext-LgzrDWu1.d.ts.map} +1 -1
- package/dist/Grid/index.cjs +1 -2
- package/dist/Grid/index.d.cts +22 -2
- package/dist/Grid/index.d.cts.map +1 -0
- package/dist/Grid/index.d.ts +22 -2
- package/dist/Grid/index.d.ts.map +1 -0
- package/dist/Grid/index.js +2 -2
- package/dist/{Grid-D-VcRGi9.cjs → Grid-BbqCRkuY.cjs} +1 -8
- package/dist/{Grid-D-VcRGi9.cjs.map → Grid-BbqCRkuY.cjs.map} +1 -1
- package/dist/{Grid-BQpLOB0G.js → Grid-CTs-Rb9G.js} +2 -2
- package/dist/{Grid-BQpLOB0G.js.map → Grid-CTs-Rb9G.js.map} +1 -1
- package/dist/Input/index.cjs +96 -3
- package/dist/Input/index.cjs.map +1 -0
- package/dist/Input/index.d.cts +677 -2
- package/dist/Input/index.d.cts.map +1 -0
- package/dist/Input/index.d.ts +677 -2
- package/dist/Input/index.d.ts.map +1 -0
- package/dist/Input/index.js +96 -2
- package/dist/Input/index.js.map +1 -0
- package/dist/RadioBoxes/index.cjs +136 -4
- package/dist/RadioBoxes/index.cjs.map +1 -0
- package/dist/RadioBoxes/index.d.cts +1477 -2
- package/dist/RadioBoxes/index.d.cts.map +1 -0
- package/dist/RadioBoxes/index.d.ts +1477 -2
- package/dist/RadioBoxes/index.d.ts.map +1 -0
- package/dist/RadioBoxes/index.js +135 -2
- package/dist/RadioBoxes/index.js.map +1 -0
- package/dist/RadioTabs/index.cjs +123 -4
- package/dist/RadioTabs/index.cjs.map +1 -0
- package/dist/RadioTabs/index.d.cts +585 -2
- package/dist/RadioTabs/index.d.cts.map +1 -0
- package/dist/RadioTabs/index.d.ts +585 -2
- package/dist/RadioTabs/index.d.ts.map +1 -0
- package/dist/RadioTabs/index.js +120 -2
- package/dist/RadioTabs/index.js.map +1 -0
- package/dist/Radios/index.cjs +74 -4
- package/dist/Radios/index.cjs.map +1 -0
- package/dist/Radios/index.d.cts +1263 -2
- package/dist/{index-DCwffq1f.d.ts.map → Radios/index.d.cts.map} +1 -1
- package/dist/Radios/index.d.ts +1263 -2
- package/dist/{index-CqXEYILn.d.cts.map → Radios/index.d.ts.map} +1 -1
- package/dist/Radios/index.js +73 -2
- package/dist/Radios/index.js.map +1 -0
- package/dist/Select/index.cjs +286 -4
- package/dist/Select/index.cjs.map +1 -0
- package/dist/Select/index.d.cts +3917 -2
- package/dist/{index-D1cB3mbB.d.ts.map → Select/index.d.cts.map} +1 -1
- package/dist/Select/index.d.ts +3917 -2
- package/dist/{index-veBM95Gw.d.cts.map → Select/index.d.ts.map} +1 -1
- package/dist/Select/index.js +283 -2
- package/dist/Select/index.js.map +1 -0
- package/dist/Slider/index.cjs +109 -4
- package/dist/Slider/index.cjs.map +1 -0
- package/dist/Slider/index.d.cts +1760 -2
- package/dist/{index-BUZEnZDm.d.ts.map → Slider/index.d.cts.map} +1 -1
- package/dist/Slider/index.d.ts +1760 -2
- package/dist/{index-Bie3CWyW.d.cts.map → Slider/index.d.ts.map} +1 -1
- package/dist/Slider/index.js +108 -2
- package/dist/Slider/index.js.map +1 -0
- package/dist/SubmitButton/index.cjs +31 -3
- package/dist/SubmitButton/index.cjs.map +1 -0
- package/dist/SubmitButton/index.d.cts +38 -2
- package/dist/SubmitButton/index.d.cts.map +1 -0
- package/dist/SubmitButton/index.d.ts +38 -2
- package/dist/SubmitButton/index.d.ts.map +1 -0
- package/dist/SubmitButton/index.js +31 -2
- package/dist/SubmitButton/index.js.map +1 -0
- package/dist/Switch/index.cjs +82 -4
- package/dist/Switch/index.cjs.map +1 -0
- package/dist/Switch/index.d.cts +1257 -2
- package/dist/{index-DqMpHpu7.d.ts.map → Switch/index.d.cts.map} +1 -1
- package/dist/Switch/index.d.ts +1257 -2
- package/dist/{index-19JGtN7H.d.cts.map → Switch/index.d.ts.map} +1 -1
- package/dist/Switch/index.js +81 -2
- package/dist/Switch/index.js.map +1 -0
- package/dist/SwitchBox/index.cjs +154 -4
- package/dist/SwitchBox/index.cjs.map +1 -0
- package/dist/SwitchBox/index.d.cts +473 -2
- package/dist/SwitchBox/index.d.cts.map +1 -0
- package/dist/SwitchBox/index.d.ts +473 -2
- package/dist/SwitchBox/index.d.ts.map +1 -0
- package/dist/SwitchBox/index.js +153 -2
- package/dist/SwitchBox/index.js.map +1 -0
- package/dist/TextArea/index.cjs +66 -3
- package/dist/TextArea/index.cjs.map +1 -0
- package/dist/TextArea/index.d.cts +659 -2
- package/dist/TextArea/index.d.cts.map +1 -0
- package/dist/TextArea/index.d.ts +659 -2
- package/dist/TextArea/index.d.ts.map +1 -0
- package/dist/TextArea/index.js +66 -2
- package/dist/TextArea/index.js.map +1 -0
- package/dist/Time/index.cjs +217 -4
- package/dist/Time/index.cjs.map +1 -0
- package/dist/Time/index.d.cts +1028 -2
- package/dist/Time/index.d.cts.map +1 -0
- package/dist/Time/index.d.ts +1028 -2
- package/dist/Time/index.d.ts.map +1 -0
- package/dist/Time/index.js +216 -2
- package/dist/Time/index.js.map +1 -0
- package/dist/helpers/index.cjs +0 -1
- package/dist/helpers/index.cjs.map +1 -1
- package/dist/helpers/index.js.map +1 -1
- package/dist/hooks/useClientValidation/index.cjs +177 -3
- package/dist/hooks/useClientValidation/index.cjs.map +1 -1
- package/dist/hooks/useClientValidation/index.d.cts +148 -2
- package/dist/hooks/useClientValidation/index.d.cts.map +1 -0
- package/dist/hooks/useClientValidation/index.d.ts +148 -2
- package/dist/hooks/useClientValidation/index.d.ts.map +1 -0
- package/dist/hooks/useClientValidation/index.js +175 -1
- package/dist/hooks/useClientValidation/index.js.map +1 -1
- package/dist/hooks/useController/index.cjs +1 -1
- package/dist/hooks/useController/index.d.cts +1 -1
- package/dist/hooks/useController/index.d.ts +1 -1
- package/dist/hooks/useController/index.js +1 -1
- package/dist/hooks/useFormContext/index.cjs +1 -1
- package/dist/hooks/useFormContext/index.d.cts +1 -1
- package/dist/hooks/useFormContext/index.d.ts +1 -1
- package/dist/hooks/useFormContext/index.js +1 -1
- package/dist/hooks/useInput/index.cjs +0 -1
- package/dist/hooks/useInput/index.d.cts +1 -1
- package/dist/hooks/useInput/index.d.ts +1 -1
- package/dist/hooks/useInput/index.js +1 -1
- package/dist/hooks/useInputValueDebounce/index.cjs +1 -2
- package/dist/hooks/useInputValueDebounce/index.cjs.map +1 -1
- package/dist/hooks/useInputValueDebounce/index.d.cts +66 -2
- package/dist/hooks/useInputValueDebounce/index.d.cts.map +1 -0
- package/dist/hooks/useInputValueDebounce/index.d.ts +66 -2
- package/dist/hooks/useInputValueDebounce/index.d.ts.map +1 -0
- package/dist/hooks/useInputValueDebounce/index.js +1 -1
- package/dist/hooks/useInputValueTransform/index.cjs +1 -1
- package/dist/hooks/useInputValueTransform/index.d.cts +1 -1
- package/dist/hooks/useInputValueTransform/index.d.ts +1 -1
- package/dist/hooks/useInputValueTransform/index.js +1 -1
- package/dist/hooks/useUniformField/index.cjs +8 -8
- package/dist/hooks/useUniformField/index.cjs.map +1 -1
- package/dist/hooks/useUniformField/index.d.cts +98 -2
- package/dist/hooks/useUniformField/index.d.cts.map +1 -0
- package/dist/hooks/useUniformField/index.d.ts +98 -2
- package/dist/hooks/useUniformField/index.d.ts.map +1 -0
- package/dist/hooks/useUniformField/index.js +8 -8
- package/dist/hooks/useUniformField/index.js.map +1 -1
- package/dist/hooks/useUniformFieldArray/index.cjs +1 -2
- package/dist/hooks/useUniformFieldArray/index.cjs.map +1 -1
- package/dist/hooks/useUniformFieldArray/index.d.cts +79 -2
- package/dist/hooks/useUniformFieldArray/index.d.cts.map +1 -0
- package/dist/hooks/useUniformFieldArray/index.d.ts +79 -2
- package/dist/hooks/useUniformFieldArray/index.d.ts.map +1 -0
- package/dist/hooks/useUniformFieldArray/index.js +1 -1
- package/dist/hooks/useWatchFormReset/index.cjs +1 -2
- package/dist/hooks/useWatchFormReset/index.cjs.map +1 -1
- package/dist/hooks/useWatchFormReset/index.d.cts +38 -2
- package/dist/hooks/useWatchFormReset/index.d.cts.map +1 -0
- package/dist/hooks/useWatchFormReset/index.d.ts +38 -2
- package/dist/hooks/useWatchFormReset/index.d.ts.map +1 -0
- package/dist/hooks/useWatchFormReset/index.js +1 -1
- package/dist/hooks/useWatchUserChange/index.cjs +82 -2
- package/dist/hooks/useWatchUserChange/index.cjs.map +1 -1
- package/dist/hooks/useWatchUserChange/index.d.cts +80 -2
- package/dist/hooks/useWatchUserChange/index.d.cts.map +1 -0
- package/dist/hooks/useWatchUserChange/index.d.ts +80 -2
- package/dist/hooks/useWatchUserChange/index.d.ts.map +1 -0
- package/dist/hooks/useWatchUserChange/index.js +81 -1
- package/dist/hooks/useWatchUserChange/index.js.map +1 -1
- package/dist/partials/FieldCopyTestIdButton/index.cjs +1 -2
- package/dist/partials/FieldCopyTestIdButton/index.d.cts +14 -2
- package/dist/partials/FieldCopyTestIdButton/index.d.cts.map +1 -0
- package/dist/partials/FieldCopyTestIdButton/index.d.ts +14 -2
- package/dist/partials/FieldCopyTestIdButton/index.d.ts.map +1 -0
- package/dist/partials/FieldCopyTestIdButton/index.js +2 -2
- package/dist/partials/FieldValidationError/index.cjs +1 -2
- package/dist/partials/FieldValidationError/index.d.cts +22 -2
- package/dist/partials/FieldValidationError/index.d.cts.map +1 -0
- package/dist/partials/FieldValidationError/index.d.ts +22 -2
- package/dist/partials/FieldValidationError/index.d.ts.map +1 -0
- package/dist/partials/FieldValidationError/index.js +2 -2
- package/dist/{useController-CzP0aVFC.d.ts → useController-CvQqCvFJ.d.ts} +1 -1
- package/dist/{useController-CzP0aVFC.d.ts.map → useController-CvQqCvFJ.d.ts.map} +1 -1
- package/dist/{useController--lRPWBuD.cjs → useController-Dbe7ADG6.cjs} +2 -2
- package/dist/{useController--lRPWBuD.cjs.map → useController-Dbe7ADG6.cjs.map} +1 -1
- package/dist/{useController-B287flU_.js → useController-DxFS0u7c.js} +2 -2
- package/dist/{useController-B287flU_.js.map → useController-DxFS0u7c.js.map} +1 -1
- package/dist/{useController-BT3Fd0IO.d.cts → useController-fblEApv_.d.cts} +1 -1
- package/dist/{useController-BT3Fd0IO.d.cts.map → useController-fblEApv_.d.cts.map} +1 -1
- package/dist/{useFormContext-Bj1gXLt_.d.ts → useFormContext-B1-deU4Z.d.ts} +2 -2
- package/dist/{useFormContext-Bj1gXLt_.d.ts.map → useFormContext-B1-deU4Z.d.ts.map} +1 -1
- package/dist/{useFormContext-CT8H8xIe.js → useFormContext-BJqa1FoT.js} +2 -2
- package/dist/{useFormContext-CT8H8xIe.js.map → useFormContext-BJqa1FoT.js.map} +1 -1
- package/dist/{useFormContext-M94eQfHm.d.cts → useFormContext-D5vrT2sg.d.cts} +2 -2
- package/dist/{useFormContext-M94eQfHm.d.cts.map → useFormContext-D5vrT2sg.d.cts.map} +1 -1
- package/dist/{useFormContext-CrXwNYiB.cjs → useFormContext-kUHonwgu.cjs} +2 -2
- package/dist/{useFormContext-CrXwNYiB.cjs.map → useFormContext-kUHonwgu.cjs.map} +1 -1
- package/dist/{useInputValueTransform-CNCBU7a9.d.cts → useInputValueTransform-DCXXb2Lp.d.cts} +1 -1
- package/dist/{useInputValueTransform-CNCBU7a9.d.cts.map → useInputValueTransform-DCXXb2Lp.d.cts.map} +1 -1
- package/dist/{useInputValueTransform-dLfFIYW4.d.ts → useInputValueTransform-DCXXb2Lp.d.ts} +1 -1
- package/dist/{useInputValueTransform-dLfFIYW4.d.ts.map → useInputValueTransform-DCXXb2Lp.d.ts.map} +1 -1
- package/dist/{useInputValueTransform-CXdmtc0Q.js → useInputValueTransform-DJ5zkqSy.js} +1 -1
- package/dist/{useInputValueTransform-CXdmtc0Q.js.map → useInputValueTransform-DJ5zkqSy.js.map} +1 -1
- package/dist/{useInputValueTransform-Bm65K8LX.cjs → useInputValueTransform-P62UUZBl.cjs} +1 -2
- package/dist/{useInputValueTransform-Bm65K8LX.cjs.map → useInputValueTransform-P62UUZBl.cjs.map} +1 -1
- package/package.json +5 -12
- package/dist/Checkboxes-DrJqx6O2.cjs +0 -130
- package/dist/Checkboxes-DrJqx6O2.cjs.map +0 -1
- package/dist/Checkboxes-X6FRwI50.js +0 -112
- package/dist/Checkboxes-X6FRwI50.js.map +0 -1
- package/dist/DatePicker-CGIWizz9.js +0 -193
- package/dist/DatePicker-CGIWizz9.js.map +0 -1
- package/dist/DatePicker-CYUuwwsm.cjs +0 -211
- package/dist/DatePicker-CYUuwwsm.cjs.map +0 -1
- package/dist/FieldArray-Dkw6JBnT.js +0 -494
- package/dist/FieldArray-Dkw6JBnT.js.map +0 -1
- package/dist/FieldArray-V66fsvtd.cjs +0 -512
- package/dist/FieldArray-V66fsvtd.cjs.map +0 -1
- package/dist/FieldCard-CAHnM8C0.cjs +0 -243
- package/dist/FieldCard-CAHnM8C0.cjs.map +0 -1
- package/dist/FieldCard-Cg31ce9J.js +0 -225
- package/dist/FieldCard-Cg31ce9J.js.map +0 -1
- package/dist/Form-CYlsIABv.cjs +0 -125
- package/dist/Form-CYlsIABv.cjs.map +0 -1
- package/dist/Form-D3yfDu4L.js +0 -114
- package/dist/Form-D3yfDu4L.js.map +0 -1
- package/dist/Input-B5RxbkNS.js +0 -96
- package/dist/Input-B5RxbkNS.js.map +0 -1
- package/dist/Input-DvVViuWH.cjs +0 -108
- package/dist/Input-DvVViuWH.cjs.map +0 -1
- package/dist/RadioBoxes-BmLrbYXt.cjs +0 -153
- package/dist/RadioBoxes-BmLrbYXt.cjs.map +0 -1
- package/dist/RadioBoxes-DWxJBTKR.js +0 -135
- package/dist/RadioBoxes-DWxJBTKR.js.map +0 -1
- package/dist/RadioTabs-14XTbTJU.cjs +0 -139
- package/dist/RadioTabs-14XTbTJU.cjs.map +0 -1
- package/dist/RadioTabs-DAY6MYJI.js +0 -120
- package/dist/RadioTabs-DAY6MYJI.js.map +0 -1
- package/dist/Radios-C938-msm.js +0 -73
- package/dist/Radios-C938-msm.js.map +0 -1
- package/dist/Radios-D_B9Y8s2.cjs +0 -91
- package/dist/Radios-D_B9Y8s2.cjs.map +0 -1
- package/dist/Select-BL6k_e-D.js +0 -283
- package/dist/Select-BL6k_e-D.js.map +0 -1
- package/dist/Select-D66A-hYm.cjs +0 -302
- package/dist/Select-D66A-hYm.cjs.map +0 -1
- package/dist/Slider-ChC2PZNb.cjs +0 -126
- package/dist/Slider-ChC2PZNb.cjs.map +0 -1
- package/dist/Slider-DmEwhC1T.js +0 -108
- package/dist/Slider-DmEwhC1T.js.map +0 -1
- package/dist/SubmitButton-D-wn1PJV.cjs +0 -43
- package/dist/SubmitButton-D-wn1PJV.cjs.map +0 -1
- package/dist/SubmitButton-D6aU7IgC.js +0 -31
- package/dist/SubmitButton-D6aU7IgC.js.map +0 -1
- package/dist/Switch-Ch6_VInV.cjs +0 -99
- package/dist/Switch-Ch6_VInV.cjs.map +0 -1
- package/dist/Switch-DvKRPFcC.js +0 -81
- package/dist/Switch-DvKRPFcC.js.map +0 -1
- package/dist/SwitchBox-BU1XieaZ.js +0 -153
- package/dist/SwitchBox-BU1XieaZ.js.map +0 -1
- package/dist/SwitchBox-Dl-F5y2m.cjs +0 -171
- package/dist/SwitchBox-Dl-F5y2m.cjs.map +0 -1
- package/dist/TextArea-CMXm-kTK.cjs +0 -78
- package/dist/TextArea-CMXm-kTK.cjs.map +0 -1
- package/dist/TextArea-DAg_K-QP.js +0 -66
- package/dist/TextArea-DAg_K-QP.js.map +0 -1
- package/dist/Time-B_SXrKWK.js +0 -216
- package/dist/Time-B_SXrKWK.js.map +0 -1
- package/dist/Time-CYoWaQsz.cjs +0 -234
- package/dist/Time-CYoWaQsz.cjs.map +0 -1
- package/dist/index-19JGtN7H.d.cts +0 -1257
- package/dist/index-54OZEaUU.d.ts +0 -43
- package/dist/index-54OZEaUU.d.ts.map +0 -1
- package/dist/index-B4XExHDi.d.cts +0 -539
- package/dist/index-BUZEnZDm.d.ts +0 -1760
- package/dist/index-Bbaubtxp.d.cts +0 -677
- package/dist/index-Bbaubtxp.d.cts.map +0 -1
- package/dist/index-BdgFJ-dj.d.ts +0 -1028
- package/dist/index-BdgFJ-dj.d.ts.map +0 -1
- package/dist/index-BiZNkLK3.d.cts +0 -1477
- package/dist/index-BiZNkLK3.d.cts.map +0 -1
- package/dist/index-Bie3CWyW.d.cts +0 -1760
- package/dist/index-BqxDWhNr.d.cts +0 -22
- package/dist/index-BqxDWhNr.d.cts.map +0 -1
- package/dist/index-BsTqcI1C.d.cts +0 -659
- package/dist/index-BsTqcI1C.d.cts.map +0 -1
- package/dist/index-C3-TV4Up.d.cts +0 -43
- package/dist/index-C3-TV4Up.d.cts.map +0 -1
- package/dist/index-C6Y8KybK.d.ts +0 -677
- package/dist/index-C6Y8KybK.d.ts.map +0 -1
- package/dist/index-CD0Wpla3.d.cts +0 -1413
- package/dist/index-CEJxjf5R.d.ts +0 -22
- package/dist/index-CEJxjf5R.d.ts.map +0 -1
- package/dist/index-CHQKk_fN2.d.ts +0 -14
- package/dist/index-CHQKk_fN2.d.ts.map +0 -1
- package/dist/index-CUByIf_d.d.ts +0 -314
- package/dist/index-CUByIf_d.d.ts.map +0 -1
- package/dist/index-CV7wqRev.d.ts +0 -38
- package/dist/index-CV7wqRev.d.ts.map +0 -1
- package/dist/index-CXvUaeCL.d.cts +0 -14
- package/dist/index-CXvUaeCL.d.cts.map +0 -1
- package/dist/index-Cf2B9woY.d.cts +0 -473
- package/dist/index-Cf2B9woY.d.cts.map +0 -1
- package/dist/index-CqXEYILn.d.cts +0 -1263
- package/dist/index-D1cB3mbB.d.ts +0 -3917
- package/dist/index-D7AUghFx.d.ts +0 -1413
- package/dist/index-DCwffq1f.d.ts +0 -1263
- package/dist/index-DFbuWomg.d.ts +0 -534
- package/dist/index-DFbuWomg.d.ts.map +0 -1
- package/dist/index-DXOBPBft.d.ts +0 -659
- package/dist/index-DXOBPBft.d.ts.map +0 -1
- package/dist/index-DY-d4cFe.d.cts +0 -1028
- package/dist/index-DY-d4cFe.d.cts.map +0 -1
- package/dist/index-DpXSZCZe.d.cts +0 -38
- package/dist/index-DpXSZCZe.d.cts.map +0 -1
- package/dist/index-DqMpHpu7.d.ts +0 -1257
- package/dist/index-DwnqyNnX.d.cts +0 -534
- package/dist/index-DwnqyNnX.d.cts.map +0 -1
- package/dist/index-OdNTqjhQ.d.ts +0 -585
- package/dist/index-OdNTqjhQ.d.ts.map +0 -1
- package/dist/index-P30z4VRT.d.cts +0 -22
- package/dist/index-P30z4VRT.d.cts.map +0 -1
- package/dist/index-PWRw2bPH.d.ts +0 -22
- package/dist/index-PWRw2bPH.d.ts.map +0 -1
- package/dist/index-QPDvw5Z5.d.cts +0 -585
- package/dist/index-QPDvw5Z5.d.cts.map +0 -1
- package/dist/index-amMd-sQN.d.ts +0 -473
- package/dist/index-amMd-sQN.d.ts.map +0 -1
- package/dist/index-clztdahp.d.ts +0 -1477
- package/dist/index-clztdahp.d.ts.map +0 -1
- package/dist/index-jK092-MJ.d.cts +0 -314
- package/dist/index-jK092-MJ.d.cts.map +0 -1
- package/dist/index-veBM95Gw.d.cts +0 -3917
- package/dist/index-yYjVSHlN.d.ts +0 -539
- package/dist/index.cjs +0 -94
- package/dist/index.cjs.map +0 -1
- package/dist/index.d.cts +0 -31
- package/dist/index.d.ts +0 -31
- package/dist/index.js +0 -36
- package/dist/index.js.map +0 -1
- package/dist/useClientValidation-BRfhqRom.cjs +0 -190
- package/dist/useClientValidation-BRfhqRom.cjs.map +0 -1
- package/dist/useClientValidation-C2dLJnDI.d.cts +0 -148
- package/dist/useClientValidation-C2dLJnDI.d.cts.map +0 -1
- package/dist/useClientValidation-DpLdzIAb.js +0 -178
- package/dist/useClientValidation-DpLdzIAb.js.map +0 -1
- package/dist/useClientValidation-qRq2_spX.d.ts +0 -148
- package/dist/useClientValidation-qRq2_spX.d.ts.map +0 -1
- package/dist/useInputValueDebounce-CfQDiomI.d.cts +0 -66
- package/dist/useInputValueDebounce-CfQDiomI.d.cts.map +0 -1
- package/dist/useInputValueDebounce-DZgzL7GQ.d.ts +0 -66
- package/dist/useInputValueDebounce-DZgzL7GQ.d.ts.map +0 -1
- package/dist/useUniformField-BE-e3C4Y.d.cts +0 -98
- package/dist/useUniformField-BE-e3C4Y.d.cts.map +0 -1
- package/dist/useUniformField-DUW-svZD.d.ts +0 -98
- package/dist/useUniformField-DUW-svZD.d.ts.map +0 -1
- package/dist/useUniformFieldArray-CdWv1SEk.d.ts +0 -79
- package/dist/useUniformFieldArray-CdWv1SEk.d.ts.map +0 -1
- package/dist/useUniformFieldArray-kkOHxNFF.d.cts +0 -79
- package/dist/useUniformFieldArray-kkOHxNFF.d.cts.map +0 -1
- package/dist/useWatchFormReset-BSd6jMxU.d.cts +0 -38
- package/dist/useWatchFormReset-BSd6jMxU.d.cts.map +0 -1
- package/dist/useWatchFormReset-C7YJ-I3N.d.ts +0 -38
- package/dist/useWatchFormReset-C7YJ-I3N.d.ts.map +0 -1
- package/dist/useWatchUserChange-C1xWHtFG.cjs +0 -90
- package/dist/useWatchUserChange-C1xWHtFG.cjs.map +0 -1
- package/dist/useWatchUserChange-CpyZz2i7.d.ts +0 -80
- package/dist/useWatchUserChange-CpyZz2i7.d.ts.map +0 -1
- package/dist/useWatchUserChange-DSAboNCs.d.cts +0 -80
- package/dist/useWatchUserChange-DSAboNCs.d.cts.map +0 -1
- package/dist/useWatchUserChange-DSQGsl1R.js +0 -84
- package/dist/useWatchUserChange-DSQGsl1R.js.map +0 -1
- /package/dist/{index-BLwMeReG.d.ts → index-BKZ67WMa.d.cts} +0 -0
- /package/dist/{index-C2gUMYkE.d.cts → index-BKZ67WMa.d.ts} +0 -0
- /package/dist/{index-CJgP-E0M.d.cts → index-BVVgDSdq.d.cts} +0 -0
- /package/dist/{index-Cg9utiy0.d.ts → index-BVVgDSdq.d.ts} +0 -0
- /package/dist/{index-CspKFJM1.d.cts → index-DmtQKWjk.d.cts} +0 -0
- /package/dist/{index-h64gcVNJ.d.ts → index-DmtQKWjk.d.ts} +0 -0
- /package/dist/{useInput-CVm3tP78.js → useInput-C0aJaAGe.js} +0 -0
- /package/dist/{useInput-BdH8oftG.d.ts → useInput-ClpHDPdr.d.cts} +0 -0
- /package/dist/{useInput-DZOmMKcp.d.cts → useInput-ClpHDPdr.d.ts} +0 -0
|
@@ -1,153 +0,0 @@
|
|
|
1
|
-
require("./FormContext-DsmS_mkO.cjs");
|
|
2
|
-
const require_helpers_index = require("./helpers/index.cjs");
|
|
3
|
-
const require_hooks_useUniformField_index = require("./hooks/useUniformField/index.cjs");
|
|
4
|
-
let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
|
|
5
|
-
let react_jsx_runtime = require("react/jsx-runtime");
|
|
6
|
-
let _heroui_radio = require("@heroui/radio");
|
|
7
|
-
let _react_aria_visually_hidden = require("@react-aria/visually-hidden");
|
|
8
|
-
//#region src/RadioBoxes/RadioBox.tsx
|
|
9
|
-
const radioBoxVariants = (0, _fuf_stack_pixel_utils.tv)({
|
|
10
|
-
slots: {
|
|
11
|
-
base: "group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus",
|
|
12
|
-
control: "",
|
|
13
|
-
description: "text-foreground opacity-70 text-small",
|
|
14
|
-
icon: "",
|
|
15
|
-
label: "",
|
|
16
|
-
labelWrapper: "grow"
|
|
17
|
-
},
|
|
18
|
-
variants: {
|
|
19
|
-
isDisabled: { true: { base: "pointer-events-none opacity-disabled" } },
|
|
20
|
-
isInvalid: { true: { base: "!border-danger" } }
|
|
21
|
-
}
|
|
22
|
-
});
|
|
23
|
-
const RadioBox = ({ classNames: _classNames = void 0, icon = void 0, isInvalid = false, ...props }) => {
|
|
24
|
-
const { children, Component, description, getBaseProps, getControlProps, getInputProps, getLabelProps, getLabelWrapperProps, getWrapperProps, isDisabled } = (0, _heroui_radio.useRadio)(props);
|
|
25
|
-
const classNames = (0, _fuf_stack_pixel_utils.variantsToClassNames)(radioBoxVariants({
|
|
26
|
-
isDisabled,
|
|
27
|
-
isInvalid
|
|
28
|
-
}), _classNames, "base");
|
|
29
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Component, {
|
|
30
|
-
...getBaseProps(),
|
|
31
|
-
className: classNames.base,
|
|
32
|
-
children: [
|
|
33
|
-
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_react_aria_visually_hidden.VisuallyHidden, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", { ...getInputProps() }) }),
|
|
34
|
-
!icon ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
35
|
-
...getWrapperProps(),
|
|
36
|
-
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
37
|
-
...getControlProps(),
|
|
38
|
-
className: (0, _fuf_stack_pixel_utils.cn)(getControlProps().className, classNames.control)
|
|
39
|
-
})
|
|
40
|
-
}) : null,
|
|
41
|
-
icon ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
42
|
-
className: classNames.icon,
|
|
43
|
-
children: icon
|
|
44
|
-
}) : null,
|
|
45
|
-
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
46
|
-
...getLabelWrapperProps(),
|
|
47
|
-
className: (0, _fuf_stack_pixel_utils.cn)(getLabelWrapperProps().className, classNames.labelWrapper),
|
|
48
|
-
children: [children ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
49
|
-
...getLabelProps(),
|
|
50
|
-
className: (0, _fuf_stack_pixel_utils.cn)(getLabelProps().className, classNames.label),
|
|
51
|
-
children
|
|
52
|
-
}) : null, description ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
53
|
-
className: classNames.description,
|
|
54
|
-
children: description
|
|
55
|
-
}) : null]
|
|
56
|
-
}),
|
|
57
|
-
icon ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
58
|
-
...getWrapperProps(),
|
|
59
|
-
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
60
|
-
...getControlProps(),
|
|
61
|
-
className: (0, _fuf_stack_pixel_utils.cn)(getControlProps().className, classNames.control)
|
|
62
|
-
})
|
|
63
|
-
}) : null
|
|
64
|
-
]
|
|
65
|
-
});
|
|
66
|
-
};
|
|
67
|
-
//#endregion
|
|
68
|
-
//#region src/RadioBoxes/RadioBoxes.tsx
|
|
69
|
-
const radioBoxesVariants = (0, _fuf_stack_pixel_utils.tv)({ slots: {
|
|
70
|
-
base: "group gap-0",
|
|
71
|
-
boxBase: "",
|
|
72
|
-
boxControl: "",
|
|
73
|
-
boxDescription: "",
|
|
74
|
-
boxLabel: "",
|
|
75
|
-
boxLabelWrapper: "",
|
|
76
|
-
label: "mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger",
|
|
77
|
-
wrapper: ""
|
|
78
|
-
} });
|
|
79
|
-
/**
|
|
80
|
-
* RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)
|
|
81
|
-
*/
|
|
82
|
-
const RadioBoxes = ({ className = void 0, inline = false, name, options, ...uniformFieldProps }) => {
|
|
83
|
-
const { ariaLabel, errorMessage, invalid, disabled, label, field: { onBlur, onChange, ref, value }, required, testId } = require_hooks_useUniformField_index.useUniformField({
|
|
84
|
-
name,
|
|
85
|
-
...uniformFieldProps
|
|
86
|
-
});
|
|
87
|
-
const { convertToOriginalType } = require_helpers_index.createOptionValueConverter(options);
|
|
88
|
-
const classNames = (0, _fuf_stack_pixel_utils.variantsToClassNames)(radioBoxesVariants(), className, "base");
|
|
89
|
-
const boxClassNames = {
|
|
90
|
-
base: classNames.boxBase,
|
|
91
|
-
control: classNames.boxControl,
|
|
92
|
-
description: classNames.boxDescription,
|
|
93
|
-
label: classNames.boxLabel,
|
|
94
|
-
labelWrapper: classNames.boxLabelWrapper
|
|
95
|
-
};
|
|
96
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_radio.RadioGroup, {
|
|
97
|
-
ref,
|
|
98
|
-
"aria-label": ariaLabel,
|
|
99
|
-
classNames,
|
|
100
|
-
"data-invalid": invalid,
|
|
101
|
-
"data-required": required,
|
|
102
|
-
"data-testid": testId,
|
|
103
|
-
errorMessage,
|
|
104
|
-
isDisabled: disabled,
|
|
105
|
-
isInvalid: invalid,
|
|
106
|
-
isRequired: required,
|
|
107
|
-
label: label ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("legend", { children: label }) : null,
|
|
108
|
-
name,
|
|
109
|
-
onBlur,
|
|
110
|
-
onValueChange: (newValue) => {
|
|
111
|
-
onChange(convertToOriginalType(newValue));
|
|
112
|
-
},
|
|
113
|
-
orientation: inline ? "horizontal" : "vertical",
|
|
114
|
-
value: value != null ? String(value) : "",
|
|
115
|
-
children: options.map((option) => {
|
|
116
|
-
if ("value" in option) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RadioBox, {
|
|
117
|
-
classNames: boxClassNames,
|
|
118
|
-
"data-testid": (0, _fuf_stack_pixel_utils.slugify)(`${testId}_option_${option.testId ?? option.value}`, { replaceDots: true }),
|
|
119
|
-
description: option.description,
|
|
120
|
-
icon: option.icon,
|
|
121
|
-
isDisabled: !!disabled || option.disabled,
|
|
122
|
-
isInvalid: invalid,
|
|
123
|
-
value: String(option.value),
|
|
124
|
-
children: option.label ?? option.value
|
|
125
|
-
}, String(option.value));
|
|
126
|
-
return null;
|
|
127
|
-
})
|
|
128
|
-
});
|
|
129
|
-
};
|
|
130
|
-
//#endregion
|
|
131
|
-
//#region src/RadioBoxes/index.ts
|
|
132
|
-
var RadioBoxes_default = RadioBoxes;
|
|
133
|
-
//#endregion
|
|
134
|
-
Object.defineProperty(exports, "RadioBoxes", {
|
|
135
|
-
enumerable: true,
|
|
136
|
-
get: function() {
|
|
137
|
-
return RadioBoxes;
|
|
138
|
-
}
|
|
139
|
-
});
|
|
140
|
-
Object.defineProperty(exports, "RadioBoxes_default", {
|
|
141
|
-
enumerable: true,
|
|
142
|
-
get: function() {
|
|
143
|
-
return RadioBoxes_default;
|
|
144
|
-
}
|
|
145
|
-
});
|
|
146
|
-
Object.defineProperty(exports, "radioBoxVariants", {
|
|
147
|
-
enumerable: true,
|
|
148
|
-
get: function() {
|
|
149
|
-
return radioBoxVariants;
|
|
150
|
-
}
|
|
151
|
-
});
|
|
152
|
-
|
|
153
|
-
//# sourceMappingURL=RadioBoxes-BmLrbYXt.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RadioBoxes-BmLrbYXt.cjs","names":["VisuallyHidden","useUniformField","createOptionValueConverter","HeroRadioGroup"],"sources":["../src/RadioBoxes/RadioBox.tsx","../src/RadioBoxes/RadioBoxes.tsx","../src/RadioBoxes/index.ts"],"sourcesContent":["import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { RadioProps as HeroRadioProps } from '@heroui/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nexport const radioBoxVariants = tv({\n slots: {\n base: 'group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus',\n control: '',\n description: 'text-foreground opacity-70 text-small',\n icon: '',\n label: '',\n labelWrapper: 'grow',\n },\n variants: {\n isDisabled: {\n true: {\n base: 'pointer-events-none opacity-disabled',\n },\n },\n isInvalid: {\n true: {\n base: '!border-danger',\n },\n },\n },\n});\n\ntype ClassName = TVClassName<typeof radioBoxVariants>;\n\nexport interface RadioBoxProps extends Omit<HeroRadioProps, 'className'> {\n /** CSS class name */\n className?: ClassName;\n /** icon for the option */\n icon?: ReactNode;\n /** whether the radio is invalid */\n isInvalid?: boolean;\n}\n\nexport const RadioBox = ({\n classNames: _classNames = undefined,\n icon = undefined,\n isInvalid = false,\n ...props\n}: RadioBoxProps) => {\n const {\n children,\n Component,\n description,\n getBaseProps,\n getControlProps,\n getInputProps,\n getLabelProps,\n getLabelWrapperProps,\n getWrapperProps,\n isDisabled,\n } = useRadio(props as HeroRadioProps);\n\n // classNames from slots\n const variants = radioBoxVariants({\n isDisabled,\n isInvalid,\n });\n const classNames = variantsToClassNames(\n variants,\n // @ts-expect-error not sure here, but it works\n _classNames,\n 'base',\n );\n\n return (\n <Component {...getBaseProps()} className={classNames.base}>\n <VisuallyHidden>\n <input {...getInputProps()} />\n </VisuallyHidden>\n {!icon ? (\n <span {...getWrapperProps()}>\n <span\n {...getControlProps()}\n className={cn(getControlProps().className, classNames.control)}\n />\n </span>\n ) : null}\n {icon ? <div className={classNames.icon}>{icon}</div> : null}\n <div\n {...getLabelWrapperProps()}\n className={cn(\n getLabelWrapperProps().className,\n classNames.labelWrapper,\n )}\n >\n {children ? (\n <span\n {...getLabelProps()}\n className={cn(getLabelProps().className, classNames.label)}\n >\n {children}\n </span>\n ) : null}\n {description ? (\n <div className={classNames.description}>{description}</div>\n ) : null}\n </div>\n {icon ? (\n <span {...getWrapperProps()}>\n <span\n {...getControlProps()}\n className={cn(getControlProps().className, classNames.control)}\n />\n </span>\n ) : null}\n </Component>\n );\n};\n\nexport default RadioBox;\n","import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n//\nimport type { RadioBoxProps } from './RadioBox';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { createOptionValueConverter } from '../helpers';\nimport { useUniformField } from '../hooks/useUniformField';\nimport { RadioBox } from './RadioBox';\n\nexport const radioBoxesVariants = tv({\n slots: {\n base: 'group gap-0', // Needs group for group-data condition\n boxBase: '',\n boxControl: '',\n boxDescription: '',\n boxLabel: '',\n boxLabelWrapper: '',\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 '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 radioBoxesVariants>;\ntype ClassName = TVClassName<typeof radioBoxesVariants>;\n\nexport interface RadioBoxOption {\n /** Description of the value. Works with variant radioBox. */\n description?: ReactNode;\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 RadioBoxesProps 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: RadioBoxOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n}\n\n/**\n * RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n */\nconst RadioBoxes = ({\n className = undefined,\n inline = false,\n name,\n options,\n ...uniformFieldProps\n}: RadioBoxesProps) => {\n const {\n ariaLabel,\n errorMessage,\n invalid,\n disabled,\n label,\n field: { onBlur, onChange, ref, value },\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 = radioBoxesVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n const boxClassNames: RadioBoxProps['classNames'] = {\n base: classNames.boxBase,\n control: classNames.boxControl,\n description: classNames.boxDescription,\n label: classNames.boxLabel,\n labelWrapper: classNames.boxLabelWrapper,\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 onValueChange={(newValue) => {\n onChange(convertToOriginalType(newValue));\n }}\n orientation={inline ? 'horizontal' : 'vertical'}\n value={value != null ? String(value) : ''}\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 <RadioBox\n key={String(option.value)}\n classNames={boxClassNames}\n data-testid={optionTestId}\n description={option.description}\n icon={option.icon}\n isDisabled={!!disabled || option.disabled}\n isInvalid={invalid}\n value={String(option.value)}\n >\n {option.label ?? option.value}\n </RadioBox>\n );\n }\n return null;\n })}\n </HeroRadioGroup>\n );\n};\n\nexport default RadioBoxes;\n","import RadioBoxes from './RadioBoxes';\n\nexport type { RadioBoxesProps, RadioBoxOption } from './RadioBoxes';\n\nexport { radioBoxVariants } from './RadioBox';\n\nexport { RadioBoxes };\n\nexport default RadioBoxes;\n"],"mappings":"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"}
|
|
@@ -1,135 +0,0 @@
|
|
|
1
|
-
import { createOptionValueConverter } from "./helpers/index.js";
|
|
2
|
-
import { useUniformField } from "./hooks/useUniformField/index.js";
|
|
3
|
-
import { cn, slugify, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
|
|
4
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
-
import { RadioGroup, useRadio } from "@heroui/radio";
|
|
6
|
-
import { VisuallyHidden } from "@react-aria/visually-hidden";
|
|
7
|
-
//#region src/RadioBoxes/RadioBox.tsx
|
|
8
|
-
const radioBoxVariants = tv({
|
|
9
|
-
slots: {
|
|
10
|
-
base: "group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus",
|
|
11
|
-
control: "",
|
|
12
|
-
description: "text-foreground opacity-70 text-small",
|
|
13
|
-
icon: "",
|
|
14
|
-
label: "",
|
|
15
|
-
labelWrapper: "grow"
|
|
16
|
-
},
|
|
17
|
-
variants: {
|
|
18
|
-
isDisabled: { true: { base: "pointer-events-none opacity-disabled" } },
|
|
19
|
-
isInvalid: { true: { base: "!border-danger" } }
|
|
20
|
-
}
|
|
21
|
-
});
|
|
22
|
-
const RadioBox = ({ classNames: _classNames = void 0, icon = void 0, isInvalid = false, ...props }) => {
|
|
23
|
-
const { children, Component, description, getBaseProps, getControlProps, getInputProps, getLabelProps, getLabelWrapperProps, getWrapperProps, isDisabled } = useRadio(props);
|
|
24
|
-
const classNames = variantsToClassNames(radioBoxVariants({
|
|
25
|
-
isDisabled,
|
|
26
|
-
isInvalid
|
|
27
|
-
}), _classNames, "base");
|
|
28
|
-
return /* @__PURE__ */ jsxs(Component, {
|
|
29
|
-
...getBaseProps(),
|
|
30
|
-
className: classNames.base,
|
|
31
|
-
children: [
|
|
32
|
-
/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx("input", { ...getInputProps() }) }),
|
|
33
|
-
!icon ? /* @__PURE__ */ jsx("span", {
|
|
34
|
-
...getWrapperProps(),
|
|
35
|
-
children: /* @__PURE__ */ jsx("span", {
|
|
36
|
-
...getControlProps(),
|
|
37
|
-
className: cn(getControlProps().className, classNames.control)
|
|
38
|
-
})
|
|
39
|
-
}) : null,
|
|
40
|
-
icon ? /* @__PURE__ */ jsx("div", {
|
|
41
|
-
className: classNames.icon,
|
|
42
|
-
children: icon
|
|
43
|
-
}) : null,
|
|
44
|
-
/* @__PURE__ */ jsxs("div", {
|
|
45
|
-
...getLabelWrapperProps(),
|
|
46
|
-
className: cn(getLabelWrapperProps().className, classNames.labelWrapper),
|
|
47
|
-
children: [children ? /* @__PURE__ */ jsx("span", {
|
|
48
|
-
...getLabelProps(),
|
|
49
|
-
className: cn(getLabelProps().className, classNames.label),
|
|
50
|
-
children
|
|
51
|
-
}) : null, description ? /* @__PURE__ */ jsx("div", {
|
|
52
|
-
className: classNames.description,
|
|
53
|
-
children: description
|
|
54
|
-
}) : null]
|
|
55
|
-
}),
|
|
56
|
-
icon ? /* @__PURE__ */ jsx("span", {
|
|
57
|
-
...getWrapperProps(),
|
|
58
|
-
children: /* @__PURE__ */ jsx("span", {
|
|
59
|
-
...getControlProps(),
|
|
60
|
-
className: cn(getControlProps().className, classNames.control)
|
|
61
|
-
})
|
|
62
|
-
}) : null
|
|
63
|
-
]
|
|
64
|
-
});
|
|
65
|
-
};
|
|
66
|
-
//#endregion
|
|
67
|
-
//#region src/RadioBoxes/RadioBoxes.tsx
|
|
68
|
-
const radioBoxesVariants = tv({ slots: {
|
|
69
|
-
base: "group gap-0",
|
|
70
|
-
boxBase: "",
|
|
71
|
-
boxControl: "",
|
|
72
|
-
boxDescription: "",
|
|
73
|
-
boxLabel: "",
|
|
74
|
-
boxLabelWrapper: "",
|
|
75
|
-
label: "mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger",
|
|
76
|
-
wrapper: ""
|
|
77
|
-
} });
|
|
78
|
-
/**
|
|
79
|
-
* RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)
|
|
80
|
-
*/
|
|
81
|
-
const RadioBoxes = ({ className = void 0, inline = false, name, options, ...uniformFieldProps }) => {
|
|
82
|
-
const { ariaLabel, errorMessage, invalid, disabled, label, field: { onBlur, onChange, ref, value }, required, testId } = useUniformField({
|
|
83
|
-
name,
|
|
84
|
-
...uniformFieldProps
|
|
85
|
-
});
|
|
86
|
-
const { convertToOriginalType } = createOptionValueConverter(options);
|
|
87
|
-
const classNames = variantsToClassNames(radioBoxesVariants(), className, "base");
|
|
88
|
-
const boxClassNames = {
|
|
89
|
-
base: classNames.boxBase,
|
|
90
|
-
control: classNames.boxControl,
|
|
91
|
-
description: classNames.boxDescription,
|
|
92
|
-
label: classNames.boxLabel,
|
|
93
|
-
labelWrapper: classNames.boxLabelWrapper
|
|
94
|
-
};
|
|
95
|
-
return /* @__PURE__ */ jsx(RadioGroup, {
|
|
96
|
-
ref,
|
|
97
|
-
"aria-label": ariaLabel,
|
|
98
|
-
classNames,
|
|
99
|
-
"data-invalid": invalid,
|
|
100
|
-
"data-required": required,
|
|
101
|
-
"data-testid": testId,
|
|
102
|
-
errorMessage,
|
|
103
|
-
isDisabled: disabled,
|
|
104
|
-
isInvalid: invalid,
|
|
105
|
-
isRequired: required,
|
|
106
|
-
label: label ? /* @__PURE__ */ jsx("legend", { children: label }) : null,
|
|
107
|
-
name,
|
|
108
|
-
onBlur,
|
|
109
|
-
onValueChange: (newValue) => {
|
|
110
|
-
onChange(convertToOriginalType(newValue));
|
|
111
|
-
},
|
|
112
|
-
orientation: inline ? "horizontal" : "vertical",
|
|
113
|
-
value: value != null ? String(value) : "",
|
|
114
|
-
children: options.map((option) => {
|
|
115
|
-
if ("value" in option) return /* @__PURE__ */ jsx(RadioBox, {
|
|
116
|
-
classNames: boxClassNames,
|
|
117
|
-
"data-testid": slugify(`${testId}_option_${option.testId ?? option.value}`, { replaceDots: true }),
|
|
118
|
-
description: option.description,
|
|
119
|
-
icon: option.icon,
|
|
120
|
-
isDisabled: !!disabled || option.disabled,
|
|
121
|
-
isInvalid: invalid,
|
|
122
|
-
value: String(option.value),
|
|
123
|
-
children: option.label ?? option.value
|
|
124
|
-
}, String(option.value));
|
|
125
|
-
return null;
|
|
126
|
-
})
|
|
127
|
-
});
|
|
128
|
-
};
|
|
129
|
-
//#endregion
|
|
130
|
-
//#region src/RadioBoxes/index.ts
|
|
131
|
-
var RadioBoxes_default = RadioBoxes;
|
|
132
|
-
//#endregion
|
|
133
|
-
export { RadioBoxes as n, radioBoxVariants as r, RadioBoxes_default as t };
|
|
134
|
-
|
|
135
|
-
//# sourceMappingURL=RadioBoxes-DWxJBTKR.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RadioBoxes-DWxJBTKR.js","names":["HeroRadioGroup"],"sources":["../src/RadioBoxes/RadioBox.tsx","../src/RadioBoxes/RadioBoxes.tsx","../src/RadioBoxes/index.ts"],"sourcesContent":["import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { RadioProps as HeroRadioProps } from '@heroui/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nexport const radioBoxVariants = tv({\n slots: {\n base: 'group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus',\n control: '',\n description: 'text-foreground opacity-70 text-small',\n icon: '',\n label: '',\n labelWrapper: 'grow',\n },\n variants: {\n isDisabled: {\n true: {\n base: 'pointer-events-none opacity-disabled',\n },\n },\n isInvalid: {\n true: {\n base: '!border-danger',\n },\n },\n },\n});\n\ntype ClassName = TVClassName<typeof radioBoxVariants>;\n\nexport interface RadioBoxProps extends Omit<HeroRadioProps, 'className'> {\n /** CSS class name */\n className?: ClassName;\n /** icon for the option */\n icon?: ReactNode;\n /** whether the radio is invalid */\n isInvalid?: boolean;\n}\n\nexport const RadioBox = ({\n classNames: _classNames = undefined,\n icon = undefined,\n isInvalid = false,\n ...props\n}: RadioBoxProps) => {\n const {\n children,\n Component,\n description,\n getBaseProps,\n getControlProps,\n getInputProps,\n getLabelProps,\n getLabelWrapperProps,\n getWrapperProps,\n isDisabled,\n } = useRadio(props as HeroRadioProps);\n\n // classNames from slots\n const variants = radioBoxVariants({\n isDisabled,\n isInvalid,\n });\n const classNames = variantsToClassNames(\n variants,\n // @ts-expect-error not sure here, but it works\n _classNames,\n 'base',\n );\n\n return (\n <Component {...getBaseProps()} className={classNames.base}>\n <VisuallyHidden>\n <input {...getInputProps()} />\n </VisuallyHidden>\n {!icon ? (\n <span {...getWrapperProps()}>\n <span\n {...getControlProps()}\n className={cn(getControlProps().className, classNames.control)}\n />\n </span>\n ) : null}\n {icon ? <div className={classNames.icon}>{icon}</div> : null}\n <div\n {...getLabelWrapperProps()}\n className={cn(\n getLabelWrapperProps().className,\n classNames.labelWrapper,\n )}\n >\n {children ? (\n <span\n {...getLabelProps()}\n className={cn(getLabelProps().className, classNames.label)}\n >\n {children}\n </span>\n ) : null}\n {description ? (\n <div className={classNames.description}>{description}</div>\n ) : null}\n </div>\n {icon ? (\n <span {...getWrapperProps()}>\n <span\n {...getControlProps()}\n className={cn(getControlProps().className, classNames.control)}\n />\n </span>\n ) : null}\n </Component>\n );\n};\n\nexport default RadioBox;\n","import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n//\nimport type { RadioBoxProps } from './RadioBox';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { createOptionValueConverter } from '../helpers';\nimport { useUniformField } from '../hooks/useUniformField';\nimport { RadioBox } from './RadioBox';\n\nexport const radioBoxesVariants = tv({\n slots: {\n base: 'group gap-0', // Needs group for group-data condition\n boxBase: '',\n boxControl: '',\n boxDescription: '',\n boxLabel: '',\n boxLabelWrapper: '',\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 '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 radioBoxesVariants>;\ntype ClassName = TVClassName<typeof radioBoxesVariants>;\n\nexport interface RadioBoxOption {\n /** Description of the value. Works with variant radioBox. */\n description?: ReactNode;\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 RadioBoxesProps 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: RadioBoxOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n}\n\n/**\n * RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n */\nconst RadioBoxes = ({\n className = undefined,\n inline = false,\n name,\n options,\n ...uniformFieldProps\n}: RadioBoxesProps) => {\n const {\n ariaLabel,\n errorMessage,\n invalid,\n disabled,\n label,\n field: { onBlur, onChange, ref, value },\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 = radioBoxesVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n const boxClassNames: RadioBoxProps['classNames'] = {\n base: classNames.boxBase,\n control: classNames.boxControl,\n description: classNames.boxDescription,\n label: classNames.boxLabel,\n labelWrapper: classNames.boxLabelWrapper,\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 onValueChange={(newValue) => {\n onChange(convertToOriginalType(newValue));\n }}\n orientation={inline ? 'horizontal' : 'vertical'}\n value={value != null ? String(value) : ''}\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 <RadioBox\n key={String(option.value)}\n classNames={boxClassNames}\n data-testid={optionTestId}\n description={option.description}\n icon={option.icon}\n isDisabled={!!disabled || option.disabled}\n isInvalid={invalid}\n value={String(option.value)}\n >\n {option.label ?? option.value}\n </RadioBox>\n );\n }\n return null;\n })}\n </HeroRadioGroup>\n );\n};\n\nexport default RadioBoxes;\n","import RadioBoxes from './RadioBoxes';\n\nexport type { RadioBoxesProps, RadioBoxOption } from './RadioBoxes';\n\nexport { radioBoxVariants } from './RadioBox';\n\nexport { RadioBoxes };\n\nexport default RadioBoxes;\n"],"mappings":";;;;;;;AASA,MAAa,mBAAmB,GAAG;CACjC,OAAO;EACL,MAAM;EACN,SAAS;EACT,aAAa;EACb,MAAM;EACN,OAAO;EACP,cAAc;CAChB;CACA,UAAU;EACR,YAAY,EACV,MAAM,EACJ,MAAM,uCACR,EACF;EACA,WAAW,EACT,MAAM,EACJ,MAAM,iBACR,EACF;CACF;AACF,CAAC;AAaD,MAAa,YAAY,EACvB,YAAY,cAAc,KAAA,GAC1B,OAAO,KAAA,GACP,YAAY,OACZ,GAAG,YACgB;CACnB,MAAM,EACJ,UACA,WACA,aACA,cACA,iBACA,eACA,eACA,sBACA,iBACA,eACE,SAAS,KAAuB;CAOpC,MAAM,aAAa,qBAJF,iBAAiB;EAChC;EACA;CACF,CAES,GAEP,aACA,MACF;CAEA,OACE,qBAAC,WAAD;EAAW,GAAI,aAAa;EAAG,WAAW,WAAW;YAArD;GACE,oBAAC,gBAAD,EAAA,UACE,oBAAC,SAAD,EAAO,GAAI,cAAc,EAAI,CAAA,EACf,CAAA;GACf,CAAC,OACA,oBAAC,QAAD;IAAM,GAAI,gBAAgB;cACxB,oBAAC,QAAD;KACE,GAAI,gBAAgB;KACpB,WAAW,GAAG,gBAAgB,EAAE,WAAW,WAAW,OAAO;IAC9D,CAAA;GACG,CAAA,IACJ;GACH,OAAO,oBAAC,OAAD;IAAK,WAAW,WAAW;cAAO;GAAU,CAAA,IAAI;GACxD,qBAAC,OAAD;IACE,GAAI,qBAAqB;IACzB,WAAW,GACT,qBAAqB,EAAE,WACvB,WAAW,YACb;cALF,CAOG,WACC,oBAAC,QAAD;KACE,GAAI,cAAc;KAClB,WAAW,GAAG,cAAc,EAAE,WAAW,WAAW,KAAK;KAExD;IACG,CAAA,IACJ,MACH,cACC,oBAAC,OAAD;KAAK,WAAW,WAAW;eAAc;IAAiB,CAAA,IACxD,IACD;;GACJ,OACC,oBAAC,QAAD;IAAM,GAAI,gBAAgB;cACxB,oBAAC,QAAD;KACE,GAAI,gBAAgB;KACpB,WAAW,GAAG,gBAAgB,EAAE,WAAW,WAAW,OAAO;IAC9D,CAAA;GACG,CAAA,IACJ;EACK;;AAEf;;;ACxGA,MAAa,qBAAqB,GAAG,EACnC,OAAO;CACL,MAAM;CACN,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,UAAU;CACV,iBAAiB;CAGjB,OACE;CACF,SAAS;AACX,EACF,CAAC;;;;AA0CD,MAAM,cAAc,EAClB,YAAY,KAAA,GACZ,SAAS,OACT,MACA,SACA,GAAG,wBACkB;CACrB,MAAM,EACJ,WACA,cACA,SACA,UACA,OACA,OAAO,EAAE,QAAQ,UAAU,KAAK,SAChC,UACA,WACE,gBAAgB;EAClB;EACA,GAAG;CACL,CAAC;CAGD,MAAM,EAAE,0BAA0B,2BAA2B,OAAO;CAIpE,MAAM,aAAa,qBADF,mBAC8B,GAAG,WAAW,MAAM;CACnE,MAAM,gBAA6C;EACjD,MAAM,WAAW;EACjB,SAAS,WAAW;EACpB,aAAa,WAAW;EACxB,OAAO,WAAW;EAClB,cAAc,WAAW;CAC3B;CAEA,OACE,oBAACA,YAAD;EACO;EACL,cAAY;EACA;EAGZ,gBAAc;EACd,iBAAe;EACf,eAAa;EACC;EACd,YAAY;EACZ,WAAW;EACX,YAAY;EACZ,OAAO,QAAQ,oBAAC,UAAD,EAAA,UAAS,MAAc,CAAA,IAAI;EACpC;EACE;EACR,gBAAgB,aAAa;GAC3B,SAAS,sBAAsB,QAAQ,CAAC;EAC1C;EACA,aAAa,SAAS,eAAe;EACrC,OAAO,SAAS,OAAO,OAAO,KAAK,IAAI;YAEtC,QAAQ,KAAK,WAAW;GACvB,IAAI,WAAW,QAKb,OACE,oBAAC,UAAD;IAEE,YAAY;IACZ,eARiB,QACnB,GAAG,OAAO,UAAU,OAAO,UAAU,OAAO,SAC5C,EAAE,aAAa,KAAK,CAMM;IACxB,aAAa,OAAO;IACpB,MAAM,OAAO;IACb,YAAY,CAAC,CAAC,YAAY,OAAO;IACjC,WAAW;IACX,OAAO,OAAO,OAAO,KAAK;cAEzB,OAAO,SAAS,OAAO;GAChB,GAVH,OAAO,OAAO,KAAK,CAUhB;GAGd,OAAO;EACT,CAAC;CACa,CAAA;AAEpB;;;AChJA,IAAA,qBAAe"}
|
|
@@ -1,139 +0,0 @@
|
|
|
1
|
-
const require_FormContext = require("./FormContext-DsmS_mkO.cjs");
|
|
2
|
-
const require_helpers_index = require("./helpers/index.cjs");
|
|
3
|
-
const require_hooks_useUniformField_index = require("./hooks/useUniformField/index.cjs");
|
|
4
|
-
let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
|
|
5
|
-
let react = require("react");
|
|
6
|
-
let react_jsx_runtime = require("react/jsx-runtime");
|
|
7
|
-
let _heroui_radio = require("@heroui/radio");
|
|
8
|
-
let _react_aria_visually_hidden = require("@react-aria/visually-hidden");
|
|
9
|
-
let _fuf_stack_pixels_Tabs = require("@fuf-stack/pixels/Tabs");
|
|
10
|
-
_fuf_stack_pixels_Tabs = require_FormContext.__toESM(_fuf_stack_pixels_Tabs);
|
|
11
|
-
//#region src/RadioTabs/RadioTabs.tsx
|
|
12
|
-
const radioTabsVariants = (0, _fuf_stack_pixel_utils.tv)({
|
|
13
|
-
slots: {
|
|
14
|
-
base: "group gap-0",
|
|
15
|
-
cursor: "",
|
|
16
|
-
label: "mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger",
|
|
17
|
-
tab: "",
|
|
18
|
-
tabBase: "",
|
|
19
|
-
tabContent: "",
|
|
20
|
-
tabList: "",
|
|
21
|
-
tabPanel: "p-3",
|
|
22
|
-
tabWrapper: "",
|
|
23
|
-
wrapper: ""
|
|
24
|
-
},
|
|
25
|
-
variants: {
|
|
26
|
-
hasContent: { true: {
|
|
27
|
-
base: "",
|
|
28
|
-
tabBase: "p-1",
|
|
29
|
-
tabWrapper: ["rounded-medium border border-divider", "w-full"]
|
|
30
|
-
} },
|
|
31
|
-
fullWidth: { true: { tabWrapper: "w-full" } },
|
|
32
|
-
isInvalid: { true: { tabWrapper: "rounded-medium border-2 !border-danger" } }
|
|
33
|
-
}
|
|
34
|
-
});
|
|
35
|
-
/**
|
|
36
|
-
* RadioTabs component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)
|
|
37
|
-
* and [HeroUI Tabs](https://www.heroui.com//docs/components/tabs)
|
|
38
|
-
*/
|
|
39
|
-
const RadioTabs = ({ className = void 0, fullWidth = false, inline = false, name, options, variant = void 0, ...uniformFieldProps }) => {
|
|
40
|
-
const { ariaLabel, disabled, errorMessage, field: { onBlur, onChange, ref, value }, invalid, label, required, testId } = require_hooks_useUniformField_index.useUniformField({
|
|
41
|
-
name,
|
|
42
|
-
...uniformFieldProps
|
|
43
|
-
});
|
|
44
|
-
const visualRadioGroupRef = (0, react.useRef)(null);
|
|
45
|
-
const { convertToOriginalType } = require_helpers_index.createOptionValueConverter(options);
|
|
46
|
-
const tabOptions = options.map((option) => {
|
|
47
|
-
return {
|
|
48
|
-
content: option?.content,
|
|
49
|
-
disabled: option?.disabled,
|
|
50
|
-
key: String(option.value),
|
|
51
|
-
label: option?.label ?? option?.value,
|
|
52
|
-
testId: (0, _fuf_stack_pixel_utils.slugify)(`option_${option?.testId ?? option?.value}`, { replaceDots: true })
|
|
53
|
-
};
|
|
54
|
-
});
|
|
55
|
-
const disabledAllKeys = tabOptions?.map((option) => {
|
|
56
|
-
return option.key;
|
|
57
|
-
});
|
|
58
|
-
const classNames = (0, _fuf_stack_pixel_utils.variantsToClassNames)(radioTabsVariants({
|
|
59
|
-
fullWidth,
|
|
60
|
-
hasContent: options.some((option) => {
|
|
61
|
-
return option.content;
|
|
62
|
-
}),
|
|
63
|
-
isInvalid: invalid
|
|
64
|
-
}), className, "base");
|
|
65
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_react_aria_visually_hidden.VisuallyHidden, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
|
|
66
|
-
ref,
|
|
67
|
-
"aria-label": ariaLabel,
|
|
68
|
-
name,
|
|
69
|
-
onBlur,
|
|
70
|
-
onChange: (e) => {
|
|
71
|
-
onChange(convertToOriginalType(e.target.value));
|
|
72
|
-
},
|
|
73
|
-
onFocus: () => {
|
|
74
|
-
(visualRadioGroupRef.current?.querySelector("[role=\"tab\"]"))?.focus();
|
|
75
|
-
},
|
|
76
|
-
value: value ?? ""
|
|
77
|
-
}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_radio.RadioGroup, {
|
|
78
|
-
ref: visualRadioGroupRef,
|
|
79
|
-
"aria-label": ariaLabel,
|
|
80
|
-
classNames: {
|
|
81
|
-
base: classNames.base,
|
|
82
|
-
label: classNames.label,
|
|
83
|
-
wrapper: classNames.wrapper
|
|
84
|
-
},
|
|
85
|
-
"data-invalid": invalid,
|
|
86
|
-
"data-required": required,
|
|
87
|
-
"data-testid": testId,
|
|
88
|
-
errorMessage,
|
|
89
|
-
isDisabled: disabled,
|
|
90
|
-
isInvalid: invalid,
|
|
91
|
-
isRequired: required,
|
|
92
|
-
label: label ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("legend", { children: label }) : null,
|
|
93
|
-
name: `${name}_radiotabs`,
|
|
94
|
-
orientation: inline ? "horizontal" : "vertical",
|
|
95
|
-
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_fuf_stack_pixels_Tabs.default, {
|
|
96
|
-
className: {
|
|
97
|
-
base: classNames.tabBase,
|
|
98
|
-
cursor: classNames.cursor,
|
|
99
|
-
panel: classNames.tabPanel,
|
|
100
|
-
tab: classNames.tab,
|
|
101
|
-
tabContent: classNames.tabContent,
|
|
102
|
-
tabList: classNames.tabList,
|
|
103
|
-
tabWrapper: classNames.tabWrapper
|
|
104
|
-
},
|
|
105
|
-
disabledKeys: disabled ? disabledAllKeys : void 0,
|
|
106
|
-
onSelectionChange: (key) => {
|
|
107
|
-
if (key != null) onChange(convertToOriginalType(key));
|
|
108
|
-
},
|
|
109
|
-
tabs: tabOptions,
|
|
110
|
-
testId,
|
|
111
|
-
variant,
|
|
112
|
-
selectedKey: value != null ? String(value) : ""
|
|
113
|
-
})
|
|
114
|
-
})] });
|
|
115
|
-
};
|
|
116
|
-
//#endregion
|
|
117
|
-
//#region src/RadioTabs/index.ts
|
|
118
|
-
var RadioTabs_default = RadioTabs;
|
|
119
|
-
//#endregion
|
|
120
|
-
Object.defineProperty(exports, "RadioTabs", {
|
|
121
|
-
enumerable: true,
|
|
122
|
-
get: function() {
|
|
123
|
-
return RadioTabs;
|
|
124
|
-
}
|
|
125
|
-
});
|
|
126
|
-
Object.defineProperty(exports, "RadioTabs_default", {
|
|
127
|
-
enumerable: true,
|
|
128
|
-
get: function() {
|
|
129
|
-
return RadioTabs_default;
|
|
130
|
-
}
|
|
131
|
-
});
|
|
132
|
-
Object.defineProperty(exports, "radioTabsVariants", {
|
|
133
|
-
enumerable: true,
|
|
134
|
-
get: function() {
|
|
135
|
-
return radioTabsVariants;
|
|
136
|
-
}
|
|
137
|
-
});
|
|
138
|
-
|
|
139
|
-
//# sourceMappingURL=RadioTabs-14XTbTJU.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RadioTabs-14XTbTJU.cjs","names":["useUniformField","createOptionValueConverter","VisuallyHidden","HeroRadioGroup","Tabs"],"sources":["../src/RadioTabs/RadioTabs.tsx","../src/RadioTabs/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { TabsProps } from '@fuf-stack/pixels';\nimport type { TabProps } from '@fuf-stack/pixels/Tabs';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport Tabs from '@fuf-stack/pixels/Tabs';\n\nimport { createOptionValueConverter } from '../helpers';\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const radioTabsVariants = tv({\n slots: {\n base: 'group gap-0', // Needs group for group-data condition\n cursor: '',\n label:\n 'mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger',\n tab: '',\n tabBase: '',\n tabContent: '',\n tabList: '',\n tabPanel: 'p-3',\n tabWrapper: '',\n wrapper: '',\n },\n variants: {\n hasContent: {\n true: {\n base: '',\n tabBase: 'p-1',\n tabWrapper: [\n // border style\n 'rounded-medium border border-divider',\n // full width\n 'w-full',\n ],\n },\n },\n fullWidth: {\n true: {\n tabWrapper: 'w-full',\n },\n },\n isInvalid: {\n true: {\n tabWrapper: 'rounded-medium border-2 !border-danger',\n },\n },\n },\n});\n\ntype VariantProps = TVProps<typeof radioTabsVariants>;\ntype ClassName = TVClassName<typeof radioTabsVariants>;\n\nexport interface RadioTabOption {\n /** Optional content inside of the tab */\n content?: ReactNode;\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 | boolean;\n}\n\nexport interface RadioTabsProps extends Omit<VariantProps, 'hasContent'> {\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 /** Whether tabs should take up full container width */\n fullWidth?: 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: RadioTabOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n /** How the RadioTabs should look like. */\n variant?: TabsProps['variant'];\n}\n\n/**\n * RadioTabs component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n * and [HeroUI Tabs](https://www.heroui.com//docs/components/tabs)\n */\nconst RadioTabs = ({\n className = undefined,\n fullWidth = false,\n inline = false,\n name,\n options,\n variant = undefined,\n ...uniformFieldProps\n}: RadioTabsProps): 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 a ref for the visual radio group to forward focus\n const visualRadioGroupRef = useRef<HTMLDivElement>(null);\n\n // Create converter to preserve number types for option values\n const { convertToOriginalType } = createOptionValueConverter(options);\n\n const tabOptions = options.map<TabProps>((option) => {\n return {\n content: option?.content,\n disabled: option?.disabled,\n // Tabs component uses string keys internally\n key: String(option.value),\n label: option?.label ?? option?.value,\n testId: slugify(`option_${option?.testId ?? option?.value}`, {\n replaceDots: true,\n }),\n };\n });\n\n const disabledAllKeys: string[] | undefined = tabOptions?.map((option) => {\n return option.key as string;\n });\n\n // check if any option has content\n // eslint-disable-next-line @typescript-eslint/no-misused-promises, @typescript-eslint/promise-function-async\n const hasContent = options.some((option) => {\n return option.content;\n });\n\n // classNames from slots\n const variants = radioTabsVariants({\n fullWidth,\n hasContent,\n isInvalid: invalid,\n });\n const classNames = variantsToClassNames(variants, className, 'base');\n\n return (\n <>\n {/* Visually hidden input for React Hook Form focus management */}\n <VisuallyHidden>\n <input\n ref={ref}\n aria-label={ariaLabel}\n name={name}\n onBlur={onBlur}\n onChange={(e) => {\n onChange(convertToOriginalType(e.target.value));\n }}\n onFocus={() => {\n // Forward focus to the first tab when RHF focuses this input\n const firstTab = visualRadioGroupRef.current?.querySelector(\n '[role=\"tab\"]',\n ) as HTMLElement;\n firstTab?.focus();\n }}\n value={value ?? ''}\n />\n </VisuallyHidden>\n\n <HeroRadioGroup\n ref={visualRadioGroupRef}\n aria-label={ariaLabel}\n classNames={{\n base: classNames.base,\n label: classNames.label,\n wrapper: classNames.wrapper,\n }}\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}_radiotabs`}\n orientation={inline ? 'horizontal' : 'vertical'}\n >\n <Tabs\n className={{\n base: classNames.tabBase,\n cursor: classNames.cursor,\n panel: classNames.tabPanel,\n tab: classNames.tab,\n tabContent: classNames.tabContent,\n tabList: classNames.tabList,\n tabWrapper: classNames.tabWrapper,\n }}\n disabledKeys={disabled ? disabledAllKeys : undefined}\n onSelectionChange={(key) => {\n if (key != null) {\n onChange(convertToOriginalType(key));\n }\n }}\n tabs={tabOptions}\n testId={testId}\n variant={variant}\n // make sure component is controlled (convert to string for Tabs)\n selectedKey={value != null ? String(value) : ''}\n />\n </HeroRadioGroup>\n </>\n );\n};\n\nexport default RadioTabs;\n","import RadioTabs from './RadioTabs';\n\nexport type { RadioTabsProps, RadioTabOption } from './RadioTabs';\n\nexport { radioTabsVariants } from './RadioTabs';\n\nexport { RadioTabs };\n\nexport default RadioTabs;\n"],"mappings":"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"}
|
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
import { createOptionValueConverter } from "./helpers/index.js";
|
|
2
|
-
import { useUniformField } from "./hooks/useUniformField/index.js";
|
|
3
|
-
import { slugify, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
|
|
4
|
-
import { useRef } from "react";
|
|
5
|
-
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
-
import { RadioGroup } from "@heroui/radio";
|
|
7
|
-
import { VisuallyHidden } from "@react-aria/visually-hidden";
|
|
8
|
-
import Tabs from "@fuf-stack/pixels/Tabs";
|
|
9
|
-
//#region src/RadioTabs/RadioTabs.tsx
|
|
10
|
-
const radioTabsVariants = tv({
|
|
11
|
-
slots: {
|
|
12
|
-
base: "group gap-0",
|
|
13
|
-
cursor: "",
|
|
14
|
-
label: "mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger",
|
|
15
|
-
tab: "",
|
|
16
|
-
tabBase: "",
|
|
17
|
-
tabContent: "",
|
|
18
|
-
tabList: "",
|
|
19
|
-
tabPanel: "p-3",
|
|
20
|
-
tabWrapper: "",
|
|
21
|
-
wrapper: ""
|
|
22
|
-
},
|
|
23
|
-
variants: {
|
|
24
|
-
hasContent: { true: {
|
|
25
|
-
base: "",
|
|
26
|
-
tabBase: "p-1",
|
|
27
|
-
tabWrapper: ["rounded-medium border border-divider", "w-full"]
|
|
28
|
-
} },
|
|
29
|
-
fullWidth: { true: { tabWrapper: "w-full" } },
|
|
30
|
-
isInvalid: { true: { tabWrapper: "rounded-medium border-2 !border-danger" } }
|
|
31
|
-
}
|
|
32
|
-
});
|
|
33
|
-
/**
|
|
34
|
-
* RadioTabs component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)
|
|
35
|
-
* and [HeroUI Tabs](https://www.heroui.com//docs/components/tabs)
|
|
36
|
-
*/
|
|
37
|
-
const RadioTabs = ({ className = void 0, fullWidth = false, inline = false, name, options, variant = void 0, ...uniformFieldProps }) => {
|
|
38
|
-
const { ariaLabel, disabled, errorMessage, field: { onBlur, onChange, ref, value }, invalid, label, required, testId } = useUniformField({
|
|
39
|
-
name,
|
|
40
|
-
...uniformFieldProps
|
|
41
|
-
});
|
|
42
|
-
const visualRadioGroupRef = useRef(null);
|
|
43
|
-
const { convertToOriginalType } = createOptionValueConverter(options);
|
|
44
|
-
const tabOptions = options.map((option) => {
|
|
45
|
-
return {
|
|
46
|
-
content: option?.content,
|
|
47
|
-
disabled: option?.disabled,
|
|
48
|
-
key: String(option.value),
|
|
49
|
-
label: option?.label ?? option?.value,
|
|
50
|
-
testId: slugify(`option_${option?.testId ?? option?.value}`, { replaceDots: true })
|
|
51
|
-
};
|
|
52
|
-
});
|
|
53
|
-
const disabledAllKeys = tabOptions?.map((option) => {
|
|
54
|
-
return option.key;
|
|
55
|
-
});
|
|
56
|
-
const classNames = variantsToClassNames(radioTabsVariants({
|
|
57
|
-
fullWidth,
|
|
58
|
-
hasContent: options.some((option) => {
|
|
59
|
-
return option.content;
|
|
60
|
-
}),
|
|
61
|
-
isInvalid: invalid
|
|
62
|
-
}), className, "base");
|
|
63
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx("input", {
|
|
64
|
-
ref,
|
|
65
|
-
"aria-label": ariaLabel,
|
|
66
|
-
name,
|
|
67
|
-
onBlur,
|
|
68
|
-
onChange: (e) => {
|
|
69
|
-
onChange(convertToOriginalType(e.target.value));
|
|
70
|
-
},
|
|
71
|
-
onFocus: () => {
|
|
72
|
-
(visualRadioGroupRef.current?.querySelector("[role=\"tab\"]"))?.focus();
|
|
73
|
-
},
|
|
74
|
-
value: value ?? ""
|
|
75
|
-
}) }), /* @__PURE__ */ jsx(RadioGroup, {
|
|
76
|
-
ref: visualRadioGroupRef,
|
|
77
|
-
"aria-label": ariaLabel,
|
|
78
|
-
classNames: {
|
|
79
|
-
base: classNames.base,
|
|
80
|
-
label: classNames.label,
|
|
81
|
-
wrapper: classNames.wrapper
|
|
82
|
-
},
|
|
83
|
-
"data-invalid": invalid,
|
|
84
|
-
"data-required": required,
|
|
85
|
-
"data-testid": testId,
|
|
86
|
-
errorMessage,
|
|
87
|
-
isDisabled: disabled,
|
|
88
|
-
isInvalid: invalid,
|
|
89
|
-
isRequired: required,
|
|
90
|
-
label: label ? /* @__PURE__ */ jsx("legend", { children: label }) : null,
|
|
91
|
-
name: `${name}_radiotabs`,
|
|
92
|
-
orientation: inline ? "horizontal" : "vertical",
|
|
93
|
-
children: /* @__PURE__ */ jsx(Tabs, {
|
|
94
|
-
className: {
|
|
95
|
-
base: classNames.tabBase,
|
|
96
|
-
cursor: classNames.cursor,
|
|
97
|
-
panel: classNames.tabPanel,
|
|
98
|
-
tab: classNames.tab,
|
|
99
|
-
tabContent: classNames.tabContent,
|
|
100
|
-
tabList: classNames.tabList,
|
|
101
|
-
tabWrapper: classNames.tabWrapper
|
|
102
|
-
},
|
|
103
|
-
disabledKeys: disabled ? disabledAllKeys : void 0,
|
|
104
|
-
onSelectionChange: (key) => {
|
|
105
|
-
if (key != null) onChange(convertToOriginalType(key));
|
|
106
|
-
},
|
|
107
|
-
tabs: tabOptions,
|
|
108
|
-
testId,
|
|
109
|
-
variant,
|
|
110
|
-
selectedKey: value != null ? String(value) : ""
|
|
111
|
-
})
|
|
112
|
-
})] });
|
|
113
|
-
};
|
|
114
|
-
//#endregion
|
|
115
|
-
//#region src/RadioTabs/index.ts
|
|
116
|
-
var RadioTabs_default = RadioTabs;
|
|
117
|
-
//#endregion
|
|
118
|
-
export { RadioTabs as n, radioTabsVariants as r, RadioTabs_default as t };
|
|
119
|
-
|
|
120
|
-
//# sourceMappingURL=RadioTabs-DAY6MYJI.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RadioTabs-DAY6MYJI.js","names":["HeroRadioGroup"],"sources":["../src/RadioTabs/RadioTabs.tsx","../src/RadioTabs/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { TabsProps } from '@fuf-stack/pixels';\nimport type { TabProps } from '@fuf-stack/pixels/Tabs';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport Tabs from '@fuf-stack/pixels/Tabs';\n\nimport { createOptionValueConverter } from '../helpers';\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const radioTabsVariants = tv({\n slots: {\n base: 'group gap-0', // Needs group for group-data condition\n cursor: '',\n label:\n 'mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger',\n tab: '',\n tabBase: '',\n tabContent: '',\n tabList: '',\n tabPanel: 'p-3',\n tabWrapper: '',\n wrapper: '',\n },\n variants: {\n hasContent: {\n true: {\n base: '',\n tabBase: 'p-1',\n tabWrapper: [\n // border style\n 'rounded-medium border border-divider',\n // full width\n 'w-full',\n ],\n },\n },\n fullWidth: {\n true: {\n tabWrapper: 'w-full',\n },\n },\n isInvalid: {\n true: {\n tabWrapper: 'rounded-medium border-2 !border-danger',\n },\n },\n },\n});\n\ntype VariantProps = TVProps<typeof radioTabsVariants>;\ntype ClassName = TVClassName<typeof radioTabsVariants>;\n\nexport interface RadioTabOption {\n /** Optional content inside of the tab */\n content?: ReactNode;\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 | boolean;\n}\n\nexport interface RadioTabsProps extends Omit<VariantProps, 'hasContent'> {\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 /** Whether tabs should take up full container width */\n fullWidth?: 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: RadioTabOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n /** How the RadioTabs should look like. */\n variant?: TabsProps['variant'];\n}\n\n/**\n * RadioTabs component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n * and [HeroUI Tabs](https://www.heroui.com//docs/components/tabs)\n */\nconst RadioTabs = ({\n className = undefined,\n fullWidth = false,\n inline = false,\n name,\n options,\n variant = undefined,\n ...uniformFieldProps\n}: RadioTabsProps): 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 a ref for the visual radio group to forward focus\n const visualRadioGroupRef = useRef<HTMLDivElement>(null);\n\n // Create converter to preserve number types for option values\n const { convertToOriginalType } = createOptionValueConverter(options);\n\n const tabOptions = options.map<TabProps>((option) => {\n return {\n content: option?.content,\n disabled: option?.disabled,\n // Tabs component uses string keys internally\n key: String(option.value),\n label: option?.label ?? option?.value,\n testId: slugify(`option_${option?.testId ?? option?.value}`, {\n replaceDots: true,\n }),\n };\n });\n\n const disabledAllKeys: string[] | undefined = tabOptions?.map((option) => {\n return option.key as string;\n });\n\n // check if any option has content\n // eslint-disable-next-line @typescript-eslint/no-misused-promises, @typescript-eslint/promise-function-async\n const hasContent = options.some((option) => {\n return option.content;\n });\n\n // classNames from slots\n const variants = radioTabsVariants({\n fullWidth,\n hasContent,\n isInvalid: invalid,\n });\n const classNames = variantsToClassNames(variants, className, 'base');\n\n return (\n <>\n {/* Visually hidden input for React Hook Form focus management */}\n <VisuallyHidden>\n <input\n ref={ref}\n aria-label={ariaLabel}\n name={name}\n onBlur={onBlur}\n onChange={(e) => {\n onChange(convertToOriginalType(e.target.value));\n }}\n onFocus={() => {\n // Forward focus to the first tab when RHF focuses this input\n const firstTab = visualRadioGroupRef.current?.querySelector(\n '[role=\"tab\"]',\n ) as HTMLElement;\n firstTab?.focus();\n }}\n value={value ?? ''}\n />\n </VisuallyHidden>\n\n <HeroRadioGroup\n ref={visualRadioGroupRef}\n aria-label={ariaLabel}\n classNames={{\n base: classNames.base,\n label: classNames.label,\n wrapper: classNames.wrapper,\n }}\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}_radiotabs`}\n orientation={inline ? 'horizontal' : 'vertical'}\n >\n <Tabs\n className={{\n base: classNames.tabBase,\n cursor: classNames.cursor,\n panel: classNames.tabPanel,\n tab: classNames.tab,\n tabContent: classNames.tabContent,\n tabList: classNames.tabList,\n tabWrapper: classNames.tabWrapper,\n }}\n disabledKeys={disabled ? disabledAllKeys : undefined}\n onSelectionChange={(key) => {\n if (key != null) {\n onChange(convertToOriginalType(key));\n }\n }}\n tabs={tabOptions}\n testId={testId}\n variant={variant}\n // make sure component is controlled (convert to string for Tabs)\n selectedKey={value != null ? String(value) : ''}\n />\n </HeroRadioGroup>\n </>\n );\n};\n\nexport default RadioTabs;\n","import RadioTabs from './RadioTabs';\n\nexport type { RadioTabsProps, RadioTabOption } from './RadioTabs';\n\nexport { radioTabsVariants } from './RadioTabs';\n\nexport { RadioTabs };\n\nexport default RadioTabs;\n"],"mappings":";;;;;;;;;AAgBA,MAAa,oBAAoB,GAAG;CAClC,OAAO;EACL,MAAM;EACN,QAAQ;EACR,OACE;EACF,KAAK;EACL,SAAS;EACT,YAAY;EACZ,SAAS;EACT,UAAU;EACV,YAAY;EACZ,SAAS;CACX;CACA,UAAU;EACR,YAAY,EACV,MAAM;GACJ,MAAM;GACN,SAAS;GACT,YAAY,CAEV,wCAEA,QACF;EACF,EACF;EACA,WAAW,EACT,MAAM,EACJ,YAAY,SACd,EACF;EACA,WAAW,EACT,MAAM,EACJ,YAAY,yCACd,EACF;CACF;AACF,CAAC;;;;;AA+CD,MAAM,aAAa,EACjB,YAAY,KAAA,GACZ,YAAY,OACZ,SAAS,OACT,MACA,SACA,UAAU,KAAA,GACV,GAAG,wBAC+B;CAClC,MAAM,EACJ,WACA,UACA,cACA,OAAO,EAAE,QAAQ,UAAU,KAAK,SAChC,SACA,OACA,UACA,WACE,gBAAgB;EAClB;EACA,GAAG;CACL,CAAC;CAGD,MAAM,sBAAsB,OAAuB,IAAI;CAGvD,MAAM,EAAE,0BAA0B,2BAA2B,OAAO;CAEpE,MAAM,aAAa,QAAQ,KAAe,WAAW;EACnD,OAAO;GACL,SAAS,QAAQ;GACjB,UAAU,QAAQ;GAElB,KAAK,OAAO,OAAO,KAAK;GACxB,OAAO,QAAQ,SAAS,QAAQ;GAChC,QAAQ,QAAQ,UAAU,QAAQ,UAAU,QAAQ,SAAS,EAC3D,aAAa,KACf,CAAC;EACH;CACF,CAAC;CAED,MAAM,kBAAwC,YAAY,KAAK,WAAW;EACxE,OAAO,OAAO;CAChB,CAAC;CAcD,MAAM,aAAa,qBALF,kBAAkB;EACjC;EACA,YAPiB,QAAQ,MAAM,WAAW;GAC1C,OAAO,OAAO;EAChB,CAKW;EACT,WAAW;CACb,CAC+C,GAAG,WAAW,MAAM;CAEnE,OACE,qBAAA,UAAA,EAAA,UAAA,CAEE,oBAAC,gBAAD,EAAA,UACE,oBAAC,SAAD;EACO;EACL,cAAY;EACN;EACE;EACR,WAAW,MAAM;GACf,SAAS,sBAAsB,EAAE,OAAO,KAAK,CAAC;EAChD;EACA,eAAe;GAKb,CAHiB,oBAAoB,SAAS,cAC5C,gBACF,IACU,MAAM;EAClB;EACA,OAAO,SAAS;CACjB,CAAA,EACa,CAAA,GAEhB,oBAACA,YAAD;EACE,KAAK;EACL,cAAY;EACZ,YAAY;GACV,MAAM,WAAW;GACjB,OAAO,WAAW;GAClB,SAAS,WAAW;EACtB;EAGA,gBAAc;EACd,iBAAe;EACf,eAAa;EACC;EACd,YAAY;EACZ,WAAW;EACX,YAAY;EACZ,OAAO,QAAQ,oBAAC,UAAD,EAAA,UAAS,MAAc,CAAA,IAAI;EAC1C,MAAM,GAAG,KAAK;EACd,aAAa,SAAS,eAAe;YAErC,oBAAC,MAAD;GACE,WAAW;IACT,MAAM,WAAW;IACjB,QAAQ,WAAW;IACnB,OAAO,WAAW;IAClB,KAAK,WAAW;IAChB,YAAY,WAAW;IACvB,SAAS,WAAW;IACpB,YAAY,WAAW;GACzB;GACA,cAAc,WAAW,kBAAkB,KAAA;GAC3C,oBAAoB,QAAQ;IAC1B,IAAI,OAAO,MACT,SAAS,sBAAsB,GAAG,CAAC;GAEvC;GACA,MAAM;GACE;GACC;GAET,aAAa,SAAS,OAAO,OAAO,KAAK,IAAI;EAC9C,CAAA;CACa,CAAA,CAChB,EAAA,CAAA;AAEN;;;AC9NA,IAAA,oBAAe"}
|