@techzyapp/ui-library 1.0.4 → 1.0.8
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/{Alert-BQpA48PY.js → Alert-BL8hDdEl.js} +3 -3
- package/dist/{Alert-BQpA48PY.js.map → Alert-BL8hDdEl.js.map} +1 -1
- package/dist/{Alert-DKIjM-9x.cjs → Alert-C9yBIMq0.cjs} +2 -2
- package/dist/{Alert-DKIjM-9x.cjs.map → Alert-C9yBIMq0.cjs.map} +1 -1
- package/dist/{Breadcrumbs-Bx5UgwDy.js → Breadcrumbs-BC_QSlJZ.js} +3 -3
- package/dist/{Breadcrumbs-Bx5UgwDy.js.map → Breadcrumbs-BC_QSlJZ.js.map} +1 -1
- package/dist/{Breadcrumbs-CHONper7.cjs → Breadcrumbs-DhBx2UgK.cjs} +2 -2
- package/dist/{Breadcrumbs-CHONper7.cjs.map → Breadcrumbs-DhBx2UgK.cjs.map} +1 -1
- package/dist/{Button-DhEv0YFk.js → Button-BT8XmR_T.js} +2 -2
- package/dist/{Button-DhEv0YFk.js.map → Button-BT8XmR_T.js.map} +1 -1
- package/dist/{Button-D4bfVNNa.cjs → Button-C_HPI97g.cjs} +2 -2
- package/dist/{Button-D4bfVNNa.cjs.map → Button-C_HPI97g.cjs.map} +1 -1
- package/dist/{Calendar-Bh317SaV.js → Calendar-B9mXn_zD.js} +3 -3
- package/dist/{Calendar-Bh317SaV.js.map → Calendar-B9mXn_zD.js.map} +1 -1
- package/dist/{Calendar-C8uNezI-.cjs → Calendar-CCCife5b.cjs} +2 -2
- package/dist/{Calendar-C8uNezI-.cjs.map → Calendar-CCCife5b.cjs.map} +1 -1
- package/dist/{Card-DzClqJuu.js → Card-DHPAefzg.js} +2 -2
- package/dist/{Card-DzClqJuu.js.map → Card-DHPAefzg.js.map} +1 -1
- package/dist/{Card-CfyaerZZ.cjs → Card-DfVntHqn.cjs} +2 -2
- package/dist/{Card-CfyaerZZ.cjs.map → Card-DfVntHqn.cjs.map} +1 -1
- package/dist/{Chip-DSrdXLBU.cjs → Chip-BoHt3WYS.cjs} +2 -2
- package/dist/{Chip-DSrdXLBU.cjs.map → Chip-BoHt3WYS.cjs.map} +1 -1
- package/dist/{Chip-Cfo0v3Z8.js → Chip-DX3QECcs.js} +2 -2
- package/dist/{Chip-Cfo0v3Z8.js.map → Chip-DX3QECcs.js.map} +1 -1
- package/dist/{CodeBlock-BWxQyKRo.js → CodeBlock-CPWEOym2.js} +3 -3
- package/dist/{CodeBlock-BWxQyKRo.js.map → CodeBlock-CPWEOym2.js.map} +1 -1
- package/dist/{CodeBlock-CgXOjKS-.cjs → CodeBlock-DKhIGQBg.cjs} +2 -2
- package/dist/{CodeBlock-CgXOjKS-.cjs.map → CodeBlock-DKhIGQBg.cjs.map} +1 -1
- package/dist/{Col-D2TfZKiM.js → Col-B51RlwWP.js} +2 -2
- package/dist/{Col-D2TfZKiM.js.map → Col-B51RlwWP.js.map} +1 -1
- package/dist/{Col-R5mAy8T9.cjs → Col-BdQeyKEX.cjs} +2 -2
- package/dist/{Col-R5mAy8T9.cjs.map → Col-BdQeyKEX.cjs.map} +1 -1
- package/dist/{ColorPicker-2udt1ORM.js → ColorPicker-2qD8vZkR.js} +3 -3
- package/dist/{ColorPicker-2udt1ORM.js.map → ColorPicker-2qD8vZkR.js.map} +1 -1
- package/dist/{ColorPicker-BwmaXCOy.cjs → ColorPicker-BAJWvC3h.cjs} +2 -2
- package/dist/{ColorPicker-BwmaXCOy.cjs.map → ColorPicker-BAJWvC3h.cjs.map} +1 -1
- package/dist/{ColorPickerPanel-ByB1mLSi.cjs → ColorPickerPanel-CkB2pNnX.cjs} +2 -2
- package/dist/{ColorPickerPanel-ByB1mLSi.cjs.map → ColorPickerPanel-CkB2pNnX.cjs.map} +1 -1
- package/dist/{ColorPickerPanel-BM9OwDDE.js → ColorPickerPanel-CovWDIRt.js} +2 -2
- package/dist/{ColorPickerPanel-BM9OwDDE.js.map → ColorPickerPanel-CovWDIRt.js.map} +1 -1
- package/dist/ConfigProvider-DFy6pL-C.cjs +2 -0
- package/dist/ConfigProvider-DFy6pL-C.cjs.map +1 -0
- package/dist/ConfigProvider-sEZzNTeU.js +296 -0
- package/dist/ConfigProvider-sEZzNTeU.js.map +1 -0
- package/dist/DashedButton-DeiALUPA.js +59 -0
- package/dist/DashedButton-DeiALUPA.js.map +1 -0
- package/dist/DashedButton-q7AOqKUE.cjs +2 -0
- package/dist/DashedButton-q7AOqKUE.cjs.map +1 -0
- package/dist/{DatePicker-WM9TC6L_.js → DatePicker-BVHriq5B.js} +4 -4
- package/dist/{DatePicker-WM9TC6L_.js.map → DatePicker-BVHriq5B.js.map} +1 -1
- package/dist/{DatePicker-DF4Epkn8.cjs → DatePicker-TLaQ3ZyB.cjs} +2 -2
- package/dist/{DatePicker-DF4Epkn8.cjs.map → DatePicker-TLaQ3ZyB.cjs.map} +1 -1
- package/dist/{DateTimePicker-DBtcWK0F.js → DateTimePicker-BWxsgyGB.js} +7 -7
- package/dist/{DateTimePicker-DBtcWK0F.js.map → DateTimePicker-BWxsgyGB.js.map} +1 -1
- package/dist/{DateTimePicker-C557OjBU.cjs → DateTimePicker-Dq2jJ2yb.cjs} +2 -2
- package/dist/{DateTimePicker-C557OjBU.cjs.map → DateTimePicker-Dq2jJ2yb.cjs.map} +1 -1
- package/dist/{Dropdown-DKAXue5_.js → Dropdown-FfkmluRu.js} +2 -2
- package/dist/{Dropdown-DKAXue5_.js.map → Dropdown-FfkmluRu.js.map} +1 -1
- package/dist/{Dropdown-DygP50OB.cjs → Dropdown-Ui7h2TGd.cjs} +2 -2
- package/dist/{Dropdown-DygP50OB.cjs.map → Dropdown-Ui7h2TGd.cjs.map} +1 -1
- package/dist/{EmptyState-CCCpZ-ZA.cjs → EmptyState-B2WgeL-H.cjs} +2 -2
- package/dist/{EmptyState-CCCpZ-ZA.cjs.map → EmptyState-B2WgeL-H.cjs.map} +1 -1
- package/dist/{EmptyState-CetM49vk.js → EmptyState-D8eUxb8v.js} +2 -2
- package/dist/{EmptyState-CetM49vk.js.map → EmptyState-D8eUxb8v.js.map} +1 -1
- package/dist/{FileUploader-VtmmwUFE.js → FileUploader-I0G-2WSe.js} +5 -5
- package/dist/{FileUploader-VtmmwUFE.js.map → FileUploader-I0G-2WSe.js.map} +1 -1
- package/dist/{FileUploader-B4TJHyoi.cjs → FileUploader-qsnWX-i5.cjs} +2 -2
- package/dist/{FileUploader-B4TJHyoi.cjs.map → FileUploader-qsnWX-i5.cjs.map} +1 -1
- package/dist/{Flag-EPZOrH-U.cjs → Flag-Bxl1Pa9m.cjs} +2 -2
- package/dist/{Flag-EPZOrH-U.cjs.map → Flag-Bxl1Pa9m.cjs.map} +1 -1
- package/dist/{Flag-BWCX6oSR.js → Flag-CvIo_Eqp.js} +2 -2
- package/dist/{Flag-BWCX6oSR.js.map → Flag-CvIo_Eqp.js.map} +1 -1
- package/dist/Flex-BFn4P1tJ.js +52 -0
- package/dist/Flex-BFn4P1tJ.js.map +1 -0
- package/dist/Flex-C6tHC8n7.cjs +2 -0
- package/dist/Flex-C6tHC8n7.cjs.map +1 -0
- package/dist/{FullscreenToggle-DDKN5n8B.cjs → FullscreenToggle-CEOkPSLp.cjs} +2 -2
- package/dist/{FullscreenToggle-DDKN5n8B.cjs.map → FullscreenToggle-CEOkPSLp.cjs.map} +1 -1
- package/dist/{FullscreenToggle-oWzYqUPH.js → FullscreenToggle-CRMGYmB8.js} +3 -3
- package/dist/{FullscreenToggle-oWzYqUPH.js.map → FullscreenToggle-CRMGYmB8.js.map} +1 -1
- package/dist/Grid-5k6dy-F5.js +26 -0
- package/dist/Grid-5k6dy-F5.js.map +1 -0
- package/dist/Grid-frN0D9lR.cjs +2 -0
- package/dist/Grid-frN0D9lR.cjs.map +1 -0
- package/dist/{IconButton-CBusrDa9.js → IconButton-BZ2jJn_T.js} +2 -2
- package/dist/{IconButton-CBusrDa9.js.map → IconButton-BZ2jJn_T.js.map} +1 -1
- package/dist/{IconButton-D6TenQZ_.cjs → IconButton-ChUfK0pG.cjs} +2 -2
- package/dist/{IconButton-D6TenQZ_.cjs.map → IconButton-ChUfK0pG.cjs.map} +1 -1
- package/dist/{List-CNz2M3-q.cjs → List-ChXO0Hz-.cjs} +2 -2
- package/dist/{List-CNz2M3-q.cjs.map → List-ChXO0Hz-.cjs.map} +1 -1
- package/dist/{List-BHgFI9Ll.js → List-LqbfF6gU.js} +2 -2
- package/dist/{List-BHgFI9Ll.js.map → List-LqbfF6gU.js.map} +1 -1
- package/dist/{ListItem-B4yqZR-Z.js → ListItem-B4Upc0Hy.js} +2 -2
- package/dist/{ListItem-B4yqZR-Z.js.map → ListItem-B4Upc0Hy.js.map} +1 -1
- package/dist/{ListItem-RH-D-Wey.cjs → ListItem-DWQorRxG.cjs} +2 -2
- package/dist/{ListItem-RH-D-Wey.cjs.map → ListItem-DWQorRxG.cjs.map} +1 -1
- package/dist/{Loader-C4JoXOyA.js → Loader-DFlpw5Zc.js} +2 -2
- package/dist/{Loader-C4JoXOyA.js.map → Loader-DFlpw5Zc.js.map} +1 -1
- package/dist/{Loader-D1MtlQOH.cjs → Loader-plA9fgHf.cjs} +2 -2
- package/dist/{Loader-D1MtlQOH.cjs.map → Loader-plA9fgHf.cjs.map} +1 -1
- package/dist/Masonry-BObKcPmo.js +82 -0
- package/dist/Masonry-BObKcPmo.js.map +1 -0
- package/dist/Masonry-BVphuk2X.cjs +2 -0
- package/dist/Masonry-BVphuk2X.cjs.map +1 -0
- package/dist/{Modal-B2YSCVVt.cjs → Modal-BaieUdge.cjs} +2 -2
- package/dist/{Modal-B2YSCVVt.cjs.map → Modal-BaieUdge.cjs.map} +1 -1
- package/dist/{Modal-BuaPDlKV.js → Modal-CRH_i5uU.js} +3 -3
- package/dist/{Modal-BuaPDlKV.js.map → Modal-CRH_i5uU.js.map} +1 -1
- package/dist/{MultiSelect-BGRT_B60.js → MultiSelect-BmkzNHTE.js} +6 -6
- package/dist/{MultiSelect-BGRT_B60.js.map → MultiSelect-BmkzNHTE.js.map} +1 -1
- package/dist/{MultiSelect-CSJKSWpA.cjs → MultiSelect-Cb-N8GIs.cjs} +2 -2
- package/dist/{MultiSelect-CSJKSWpA.cjs.map → MultiSelect-Cb-N8GIs.cjs.map} +1 -1
- package/dist/{NumberField-DBvhSQCw.js → NumberField-D71JI2Wv.js} +3 -3
- package/dist/{NumberField-DBvhSQCw.js.map → NumberField-D71JI2Wv.js.map} +1 -1
- package/dist/{NumberField-DBpO-Z_7.cjs → NumberField-DBwNn3-f.cjs} +2 -2
- package/dist/{NumberField-DBpO-Z_7.cjs.map → NumberField-DBwNn3-f.cjs.map} +1 -1
- package/dist/{OtpField-BUBYyorC.cjs → OtpField-C-SiHxKa.cjs} +2 -2
- package/dist/{OtpField-BUBYyorC.cjs.map → OtpField-C-SiHxKa.cjs.map} +1 -1
- package/dist/{OtpField-CTq-CUbF.js → OtpField-DOz-JmuX.js} +2 -2
- package/dist/{OtpField-CTq-CUbF.js.map → OtpField-DOz-JmuX.js.map} +1 -1
- package/dist/{PageLayout-DddzYw2B.js → PageLayout-BIdgUKsN.js} +2 -2
- package/dist/{PageLayout-DddzYw2B.js.map → PageLayout-BIdgUKsN.js.map} +1 -1
- package/dist/{PageLayout-Dfbjw6jD.cjs → PageLayout-qF5ThZKO.cjs} +2 -2
- package/dist/{PageLayout-Dfbjw6jD.cjs.map → PageLayout-qF5ThZKO.cjs.map} +1 -1
- package/dist/PageNotFound-CsgH9tY0.js +39 -0
- package/dist/PageNotFound-CsgH9tY0.js.map +1 -0
- package/dist/PageNotFound-DObWgQ0Z.cjs +2 -0
- package/dist/PageNotFound-DObWgQ0Z.cjs.map +1 -0
- package/dist/{Pagination-CN9V8M5C.js → Pagination-Kj7ZDi3N.js} +2 -2
- package/dist/{Pagination-CN9V8M5C.js.map → Pagination-Kj7ZDi3N.js.map} +1 -1
- package/dist/{Pagination-DRwTLPh8.cjs → Pagination-S3hENjDy.cjs} +2 -2
- package/dist/{Pagination-DRwTLPh8.cjs.map → Pagination-S3hENjDy.cjs.map} +1 -1
- package/dist/{RemoveDialog-ClyZKyUG.cjs → RemoveDialog-BZ0gUf1p.cjs} +2 -2
- package/dist/{RemoveDialog-ClyZKyUG.cjs.map → RemoveDialog-BZ0gUf1p.cjs.map} +1 -1
- package/dist/{RemoveDialog-Bvt6sH79.js → RemoveDialog-D9a0GttZ.js} +4 -4
- package/dist/{RemoveDialog-Bvt6sH79.js.map → RemoveDialog-D9a0GttZ.js.map} +1 -1
- package/dist/{RichTextEditor-CAYt1Zm1.cjs → RichTextEditor-BX6twJ9D.cjs} +2 -2
- package/dist/{RichTextEditor-CAYt1Zm1.cjs.map → RichTextEditor-BX6twJ9D.cjs.map} +1 -1
- package/dist/{RichTextEditor-BTx8Py3I.js → RichTextEditor-D05Czeif.js} +9 -9
- package/dist/{RichTextEditor-BTx8Py3I.js.map → RichTextEditor-D05Czeif.js.map} +1 -1
- package/dist/RootLayout-BR_pPr3d.cjs +2 -0
- package/dist/RootLayout-BR_pPr3d.cjs.map +1 -0
- package/dist/{RootLayout-DCpfuFWF.js → RootLayout-CgI03ZNA.js} +16 -16
- package/dist/RootLayout-CgI03ZNA.js.map +1 -0
- package/dist/{Select-PbTyxB1Q.js → Select-BZPA2Ytp.js} +5 -5
- package/dist/{Select-PbTyxB1Q.js.map → Select-BZPA2Ytp.js.map} +1 -1
- package/dist/{Select-_6WogC0u.cjs → Select-Dpl8dq_9.cjs} +2 -2
- package/dist/{Select-_6WogC0u.cjs.map → Select-Dpl8dq_9.cjs.map} +1 -1
- package/dist/{Sidebar-AaIlRzgk.cjs → Sidebar-6SAObU0u.cjs} +2 -2
- package/dist/{Sidebar-AaIlRzgk.cjs.map → Sidebar-6SAObU0u.cjs.map} +1 -1
- package/dist/{Sidebar-DRCs2ygZ.js → Sidebar-DEBW6lDA.js} +7 -5
- package/dist/{Sidebar-DRCs2ygZ.js.map → Sidebar-DEBW6lDA.js.map} +1 -1
- package/dist/{SpeedDial-DgFj16BQ.js → SpeedDial-C3PnANAx.js} +2 -2
- package/dist/{SpeedDial-DgFj16BQ.js.map → SpeedDial-C3PnANAx.js.map} +1 -1
- package/dist/{SpeedDial-C4jxIXTr.cjs → SpeedDial-Dex0rF2z.cjs} +2 -2
- package/dist/{SpeedDial-C4jxIXTr.cjs.map → SpeedDial-Dex0rF2z.cjs.map} +1 -1
- package/dist/{Stepper-COKAyN1L.js → Stepper-0e90ZJaw.js} +2 -2
- package/dist/{Stepper-COKAyN1L.js.map → Stepper-0e90ZJaw.js.map} +1 -1
- package/dist/{Stepper-7pPEBRLI.cjs → Stepper-yKwUaxOU.cjs} +2 -2
- package/dist/{Stepper-7pPEBRLI.cjs.map → Stepper-yKwUaxOU.cjs.map} +1 -1
- package/dist/{Table-BeOumGng.cjs → Table-BekBXEnW.cjs} +2 -2
- package/dist/{Table-BeOumGng.cjs.map → Table-BekBXEnW.cjs.map} +1 -1
- package/dist/{Table-BjPLvMbf.js → Table-KEOUL2u3.js} +174 -174
- package/dist/{Table-BjPLvMbf.js.map → Table-KEOUL2u3.js.map} +1 -1
- package/dist/{Tabs--DDM-zKe.js → Tabs-BHk2B50R.js} +2 -2
- package/dist/{Tabs--DDM-zKe.js.map → Tabs-BHk2B50R.js.map} +1 -1
- package/dist/{Tabs-BZcMnjdC.cjs → Tabs-DYUS945Y.cjs} +2 -2
- package/dist/{Tabs-BZcMnjdC.cjs.map → Tabs-DYUS945Y.cjs.map} +1 -1
- package/dist/{TagsField-BTJcZS9P.js → TagsField-BkC5OmIT.js} +4 -4
- package/dist/{TagsField-BTJcZS9P.js.map → TagsField-BkC5OmIT.js.map} +1 -1
- package/dist/{TagsField-kknWiJZZ.cjs → TagsField-DKh9SbG5.cjs} +2 -2
- package/dist/{TagsField-kknWiJZZ.cjs.map → TagsField-DKh9SbG5.cjs.map} +1 -1
- package/dist/{TextField-DMI1X09n.js → TextField-12HcFD7u.js} +3 -3
- package/dist/{TextField-DMI1X09n.js.map → TextField-12HcFD7u.js.map} +1 -1
- package/dist/{TextField-BPefnD5M.cjs → TextField-C9cPPP-B.cjs} +2 -2
- package/dist/{TextField-BPefnD5M.cjs.map → TextField-C9cPPP-B.cjs.map} +1 -1
- package/dist/{ThemeToggle-DTal3RX5.cjs → ThemeToggle-DIXVvqZ7.cjs} +2 -2
- package/dist/{ThemeToggle-DTal3RX5.cjs.map → ThemeToggle-DIXVvqZ7.cjs.map} +1 -1
- package/dist/{ThemeToggle-Deh9j8pm.js → ThemeToggle-DUtDXl1Z.js} +3 -3
- package/dist/{ThemeToggle-Deh9j8pm.js.map → ThemeToggle-DUtDXl1Z.js.map} +1 -1
- package/dist/{TimeColumns-BCNmu4b_.js → TimeColumns-BLhP81oI.js} +2 -2
- package/dist/{TimeColumns-BCNmu4b_.js.map → TimeColumns-BLhP81oI.js.map} +1 -1
- package/dist/{TimeColumns-Duh4DcYJ.cjs → TimeColumns-CgjyPGjs.cjs} +2 -2
- package/dist/{TimeColumns-Duh4DcYJ.cjs.map → TimeColumns-CgjyPGjs.cjs.map} +1 -1
- package/dist/{TimePicker-3JgvK2on.js → TimePicker-CJWjGVqT.js} +5 -5
- package/dist/{TimePicker-3JgvK2on.js.map → TimePicker-CJWjGVqT.js.map} +1 -1
- package/dist/{TimePicker-CfGrCH9T.cjs → TimePicker-CNAXFtJa.cjs} +2 -2
- package/dist/{TimePicker-CfGrCH9T.cjs.map → TimePicker-CNAXFtJa.cjs.map} +1 -1
- package/dist/{Toaster-D-eG1xv7.js → Toaster-B3Mut6eM.js} +2 -2
- package/dist/{Toaster-D-eG1xv7.js.map → Toaster-B3Mut6eM.js.map} +1 -1
- package/dist/{Toaster-Bk5GtPjX.cjs → Toaster-CYt_Hvlh.cjs} +2 -2
- package/dist/{Toaster-Bk5GtPjX.cjs.map → Toaster-CYt_Hvlh.cjs.map} +1 -1
- package/dist/{TranslatedFields-CI0F9bHw.js → TranslatedFields-BEaS1esD.js} +3 -3
- package/dist/{TranslatedFields-CI0F9bHw.js.map → TranslatedFields-BEaS1esD.js.map} +1 -1
- package/dist/{TranslatedFields-DT3bYse6.cjs → TranslatedFields-DshwXj6d.cjs} +2 -2
- package/dist/{TranslatedFields-DT3bYse6.cjs.map → TranslatedFields-DshwXj6d.cjs.map} +1 -1
- package/dist/{UserCard-BhqtX1vU.js → UserCard-Dve-LOSB.js} +3 -3
- package/dist/{UserCard-BhqtX1vU.js.map → UserCard-Dve-LOSB.js.map} +1 -1
- package/dist/{UserCard-OlLeyyS0.cjs → UserCard-sIguy8Jp.cjs} +2 -2
- package/dist/{UserCard-OlLeyyS0.cjs.map → UserCard-sIguy8Jp.cjs.map} +1 -1
- package/dist/breakpoints-BbDakdqF.js +50 -0
- package/dist/breakpoints-BbDakdqF.js.map +1 -0
- package/dist/breakpoints-Dpnh6BbG.cjs +2 -0
- package/dist/breakpoints-Dpnh6BbG.cjs.map +1 -0
- package/dist/components/Alert/index.cjs +1 -1
- package/dist/components/Alert/index.js +1 -1
- package/dist/components/Breadcrumbs/index.cjs +1 -1
- package/dist/components/Breadcrumbs/index.js +1 -1
- package/dist/components/Button/index.cjs +1 -1
- package/dist/components/Button/index.js +1 -1
- package/dist/components/Card/index.cjs +1 -1
- package/dist/components/Card/index.js +1 -1
- package/dist/components/Chip/index.cjs +1 -1
- package/dist/components/Chip/index.js +1 -1
- package/dist/components/CodeBlock/index.cjs +1 -1
- package/dist/components/CodeBlock/index.js +1 -1
- package/dist/components/ColorPicker/index.cjs +1 -1
- package/dist/components/ColorPicker/index.js +1 -1
- package/dist/components/DashedButton/DashedButton.d.cts +33 -0
- package/dist/components/DashedButton/DashedButton.d.ts +33 -0
- package/dist/components/DashedButton/index.cjs +2 -0
- package/dist/components/DashedButton/index.cjs.map +1 -0
- package/dist/components/DashedButton/index.d.cts +2 -0
- package/dist/components/DashedButton/index.d.ts +2 -0
- package/dist/components/DashedButton/index.js +6 -0
- package/dist/components/DashedButton/index.js.map +1 -0
- package/dist/components/DatePicker/index.cjs +1 -1
- package/dist/components/DatePicker/index.js +1 -1
- package/dist/components/DateTimePicker/index.cjs +1 -1
- package/dist/components/DateTimePicker/index.js +1 -1
- package/dist/components/Dropdown/index.cjs +1 -1
- package/dist/components/Dropdown/index.js +1 -1
- package/dist/components/EmptyState/index.cjs +1 -1
- package/dist/components/EmptyState/index.js +1 -1
- package/dist/components/FileUploader/index.cjs +1 -1
- package/dist/components/FileUploader/index.js +1 -1
- package/dist/components/Flag/index.cjs +1 -1
- package/dist/components/Flag/index.js +1 -1
- package/dist/components/Flex/Flex.d.cts +16 -13
- package/dist/components/Flex/Flex.d.ts +16 -13
- package/dist/components/Flex/Grid.d.cts +11 -9
- package/dist/components/Flex/Grid.d.ts +11 -9
- package/dist/components/Flex/index.cjs +1 -1
- package/dist/components/Flex/index.js +3 -3
- package/dist/components/FullscreenToggle/index.cjs +1 -1
- package/dist/components/FullscreenToggle/index.js +1 -1
- package/dist/components/IconButton/index.cjs +1 -1
- package/dist/components/IconButton/index.js +1 -1
- package/dist/components/List/index.cjs +1 -1
- package/dist/components/List/index.js +2 -2
- package/dist/components/Loader/index.cjs +1 -1
- package/dist/components/Loader/index.js +1 -1
- package/dist/components/Masonry/Masonry.d.cts +11 -11
- package/dist/components/Masonry/Masonry.d.ts +11 -11
- package/dist/components/Masonry/index.cjs +1 -1
- package/dist/components/Masonry/index.js +1 -1
- package/dist/components/Modal/index.cjs +1 -1
- package/dist/components/Modal/index.js +1 -1
- package/dist/components/MultiSelect/index.cjs +1 -1
- package/dist/components/MultiSelect/index.js +1 -1
- package/dist/components/NumberField/index.cjs +1 -1
- package/dist/components/NumberField/index.js +1 -1
- package/dist/components/OtpField/index.cjs +1 -1
- package/dist/components/OtpField/index.js +1 -1
- package/dist/components/PageLayout/index.cjs +1 -1
- package/dist/components/PageLayout/index.js +1 -1
- package/dist/components/PageNotFound/PageNotFound.d.cts +34 -0
- package/dist/components/PageNotFound/PageNotFound.d.ts +34 -0
- package/dist/components/PageNotFound/index.cjs +2 -0
- package/dist/components/PageNotFound/index.cjs.map +1 -0
- package/dist/components/PageNotFound/index.d.cts +2 -0
- package/dist/components/PageNotFound/index.d.ts +2 -0
- package/dist/components/PageNotFound/index.js +6 -0
- package/dist/components/PageNotFound/index.js.map +1 -0
- package/dist/components/Pagination/index.cjs +1 -1
- package/dist/components/Pagination/index.js +1 -1
- package/dist/components/RemoveDialog/index.cjs +1 -1
- package/dist/components/RemoveDialog/index.js +1 -1
- package/dist/components/RichTextEditor/index.cjs +1 -1
- package/dist/components/RichTextEditor/index.js +1 -1
- package/dist/components/RootLayout/index.cjs +1 -1
- package/dist/components/RootLayout/index.js +1 -1
- package/dist/components/Select/index.cjs +1 -1
- package/dist/components/Select/index.js +1 -1
- package/dist/components/Sidebar/index.cjs +1 -1
- package/dist/components/Sidebar/index.js +1 -1
- package/dist/components/SpeedDial/index.cjs +1 -1
- package/dist/components/SpeedDial/index.js +1 -1
- package/dist/components/Stepper/index.cjs +1 -1
- package/dist/components/Stepper/index.js +1 -1
- package/dist/components/Table/index.cjs +1 -1
- package/dist/components/Table/index.js +1 -1
- package/dist/components/Tabs/index.cjs +1 -1
- package/dist/components/Tabs/index.js +1 -1
- package/dist/components/TagsField/index.cjs +1 -1
- package/dist/components/TagsField/index.js +1 -1
- package/dist/components/TextField/index.cjs +1 -1
- package/dist/components/TextField/index.js +1 -1
- package/dist/components/ThemeToggle/index.cjs +1 -1
- package/dist/components/ThemeToggle/index.js +1 -1
- package/dist/components/TimePicker/index.cjs +1 -1
- package/dist/components/TimePicker/index.js +1 -1
- package/dist/components/Toast/index.cjs +1 -1
- package/dist/components/Toast/index.js +1 -1
- package/dist/components/TranslatedFields/index.cjs +1 -1
- package/dist/components/TranslatedFields/index.js +1 -1
- package/dist/components/UserCard/index.cjs +1 -1
- package/dist/components/UserCard/index.js +1 -1
- package/dist/components/index.d.cts +2 -0
- package/dist/components/index.d.ts +2 -0
- package/dist/entries/components.cjs +1 -1
- package/dist/entries/components.js +130 -126
- package/dist/entries/components.js.map +1 -1
- package/dist/entries/hooks.cjs +1 -1
- package/dist/entries/hooks.d.cts +1 -1
- package/dist/entries/hooks.d.ts +1 -1
- package/dist/entries/hooks.js +4 -3
- package/dist/entries/i18n.cjs +1 -1
- package/dist/entries/i18n.js +2 -2
- package/dist/entries/theme.cjs +1 -1
- package/dist/entries/theme.d.cts +2 -2
- package/dist/entries/theme.d.ts +2 -2
- package/dist/entries/theme.js +16 -14
- package/dist/hooks/index.d.cts +1 -1
- package/dist/hooks/index.d.ts +1 -1
- package/dist/hooks/useMediaQuery.d.cts +21 -8
- package/dist/hooks/useMediaQuery.d.ts +21 -8
- package/dist/i18n/messages.d.cts +3 -0
- package/dist/i18n/messages.d.ts +3 -0
- package/dist/index.cjs +1 -1
- package/dist/index.css +1 -1
- package/dist/index.js +183 -176
- package/dist/index.js.map +1 -1
- package/dist/messages-BJiUtJ2E.cjs +36 -0
- package/dist/messages-BJiUtJ2E.cjs.map +1 -0
- package/dist/{messages-C-zecFBE.js → messages-CVISEA5N.js} +37 -16
- package/dist/messages-CVISEA5N.js.map +1 -0
- package/dist/theme/ConfigProvider.d.cts +9 -0
- package/dist/theme/ConfigProvider.d.ts +9 -0
- package/dist/theme/breakpoints.d.cts +48 -13
- package/dist/theme/breakpoints.d.ts +48 -13
- package/dist/theme/index.d.cts +2 -2
- package/dist/theme/index.d.ts +2 -2
- package/dist/useMediaQuery-CHMrI6Dy.cjs +2 -0
- package/dist/useMediaQuery-CHMrI6Dy.cjs.map +1 -0
- package/dist/useMediaQuery-DrDUrkmJ.js +32 -0
- package/dist/useMediaQuery-DrDUrkmJ.js.map +1 -0
- package/package.json +1 -1
- package/dist/ConfigProvider-2c94kUOk.js +0 -291
- package/dist/ConfigProvider-2c94kUOk.js.map +0 -1
- package/dist/ConfigProvider-ByOFXVyP.cjs +0 -2
- package/dist/ConfigProvider-ByOFXVyP.cjs.map +0 -1
- package/dist/Flex-Bj3mMF5A.js +0 -50
- package/dist/Flex-Bj3mMF5A.js.map +0 -1
- package/dist/Flex-CqL3Ghda.cjs +0 -2
- package/dist/Flex-CqL3Ghda.cjs.map +0 -1
- package/dist/Grid-Bw95bKkJ.cjs +0 -2
- package/dist/Grid-Bw95bKkJ.cjs.map +0 -1
- package/dist/Grid-CY-syhTX.js +0 -24
- package/dist/Grid-CY-syhTX.js.map +0 -1
- package/dist/Masonry-BTvtDdnt.js +0 -104
- package/dist/Masonry-BTvtDdnt.js.map +0 -1
- package/dist/Masonry-Bl1Mlzqw.cjs +0 -2
- package/dist/Masonry-Bl1Mlzqw.cjs.map +0 -1
- package/dist/RootLayout-Cp-9CVjP.cjs +0 -2
- package/dist/RootLayout-Cp-9CVjP.cjs.map +0 -1
- package/dist/RootLayout-DCpfuFWF.js.map +0 -1
- package/dist/breakpoints-BNPC2_Te.cjs +0 -2
- package/dist/breakpoints-BNPC2_Te.cjs.map +0 -1
- package/dist/breakpoints-o3dzSzrU.js +0 -12
- package/dist/breakpoints-o3dzSzrU.js.map +0 -1
- package/dist/messages-C-zecFBE.js.map +0 -1
- package/dist/messages-Cy-qK5xU.cjs +0 -36
- package/dist/messages-Cy-qK5xU.cjs.map +0 -1
- package/dist/useMediaQuery-BCsNfMA1.cjs +0 -2
- package/dist/useMediaQuery-BCsNfMA1.cjs.map +0 -1
- package/dist/useMediaQuery-_1EcFoC5.js +0 -17
- package/dist/useMediaQuery-_1EcFoC5.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimePicker-C557OjBU.cjs","sources":["../src/components/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n type CSSProperties,\n type FocusEvent,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useT } from '../../theme'\nimport { useFormContext } from '../../form/formContext'\nimport { FloatingPanel } from '../FloatingPanel/FloatingPanel'\nimport { Button } from '../Button'\nimport { Icon } from '../Icon'\nimport { IconButton } from '../IconButton'\nimport { Tabs } from '../Tabs'\nimport { Typography } from '../Typography'\nimport { Calendar } from '../DatePicker/Calendar'\nimport {\n applyMask,\n localWallToUtc,\n maskFromFormat,\n parseISO,\n parseInput,\n parseValue,\n today,\n toISO,\n utcToLocalWall,\n type Dayjs,\n} from '../DatePicker/dateUtils'\nimport styles from '../DatePicker/DatePicker.module.css'\nimport dt from './DateTimePicker.module.css'\nimport { TimeColumns } from './TimeColumns'\n\nexport type DateTimePickerSize = 'sm' | 'md' | 'lg'\n\nexport interface DateTimePickerProps {\n /** Label rendered above the field. */\n label?: ReactNode\n /** Preset size — control height, font and calendar density. */\n size?: DateTimePickerSize\n /** Marks the field invalid: red border/ring + the `helperText` in the error color. */\n error?: boolean\n /** Helper / validation text under the field. Adopts the error color while `error`. */\n helperText?: ReactNode\n /** Adds a red asterisk after the label. */\n required?: boolean\n /** Stretches the field to fill its container width. Defaults to `true`. */\n fullWidth?: boolean\n /** Disables the field. */\n disabled?: boolean\n /** Controlled value — a datetime string in `valueFormat` (default ISO datetime; `''` = empty). */\n value?: string\n /** Initial value for uncontrolled use (in `valueFormat`). */\n defaultValue?: string\n /** Fires with the next datetime in `valueFormat` (`''` when cleared). */\n onChange?: (value: string) => void\n /**\n * Display + typed-input format (dayjs tokens). Defaults to `'DD/MM/YYYY HH:mm:ss'` (or `hh:mm:ss A`\n * when `hour12`; the `:ss` is dropped when `showSeconds` is `false`).\n */\n format?: string\n /**\n * Wire format of `value`/`defaultValue`/`onChange` (dayjs tokens), decoupled from the displayed\n * `format`. Defaults to the ISO datetime `'YYYY-MM-DDTHH:mm:ss[Z]'` when `utc` (the `Z` marks the\n * value as UTC, e.g. `'2026-06-10T09:35:00Z'`), or `'YYYY-MM-DDTHH:mm:ss'` (no `Z`) when `utc={false}`.\n * Incoming values are parsed **leniently** (this format, then any ISO-8601 string — so a backend\n * datetime like `'2026-06-10T09:35:49.6134342'` with or without `Z` is accepted).\n */\n valueFormat?: string\n /**\n * Treat the value as **UTC** and display/edit in the viewer's **local** timezone (default `true`).\n * Set `false` to disable timezone conversion entirely — the field shows and emits the value's exact\n * wall-clock (what you pick is what's sent, no UTC shift).\n */\n utc?: boolean\n /** 12-hour clock (1–12 + AM/PM) instead of 24-hour (0–23). Defaults to `false`. */\n hour12?: boolean\n /** Minute increment for the minutes column. Defaults to `1`. */\n minuteStep?: number\n /** Show the seconds column + `:ss` in the default format. Defaults to `true`; pass `false` to hide seconds. */\n showSeconds?: boolean\n /** Placeholder shown when empty. Defaults to the lowercased `format`. */\n placeholder?: string\n /** Earliest selectable date (ISO date or datetime; day-level bound on the calendar). */\n min?: string\n /** Latest selectable date (ISO date or datetime; day-level bound on the calendar). */\n max?: string\n /** Disables specific dates — receives each day as an ISO `'YYYY-MM-DD'` string. */\n disabledDate?: (date: string) => boolean\n /** First day of the week: 0 = Sunday … 6 = Saturday. Defaults to `1` (Monday). */\n weekStartsOn?: number\n /** Shows a clear (×) button when a value is set. Defaults to `true`. */\n clearable?: boolean\n /** Form field name — auto-binds to a surrounding `<Form>` (value is the datetime string). */\n name?: string\n /** Id for the input (label association). */\n id?: string\n className?: string\n style?: CSSProperties\n}\n\nfunction defaultFormatFor(hour12: boolean, showSeconds: boolean): string {\n const time = hour12\n ? showSeconds\n ? 'hh:mm:ss A'\n : 'hh:mm A'\n : showSeconds\n ? 'HH:mm:ss'\n : 'HH:mm'\n return `DD/MM/YYYY ${time}`\n}\n\n/**\n * A datetime field with a typed, masked input **and** a popover combining the keyboard-navigable\n * `Calendar` (date) with scrollable time columns (hour / minute / optional second + AM/PM in 12-hour\n * mode). All math runs in **UTC** so the instant never drifts with the viewer's timezone; the value is a\n * string in `valueFormat` (UTC ISO datetime with a `Z` by default, or no `Z` when `utc={false}`) — incoming values are parsed\n * leniently (a richer backend datetime is accepted) and the chosen instant is emitted in that format.\n * Picking a date keeps the time and vice-versa, and the popover stays open until you click away,\n * press Escape, or hit Done. Supports `hour12`, `minuteStep`, `showSeconds`, `min`/`max`,\n * `disabledDate`, `weekStartsOn`, and `clearable`. Controlled (`value` + `onChange`) or uncontrolled\n * (`defaultValue`), and binds to a surrounding `<Form>` by `name`. Requires the `dayjs` peer dependency.\n */\nexport const DateTimePicker = forwardRef<HTMLInputElement, DateTimePickerProps>(\n function DateTimePicker(\n {\n label,\n size = 'md',\n error,\n helperText,\n required = false,\n fullWidth = true,\n disabled = false,\n value,\n defaultValue,\n onChange,\n format: formatProp,\n valueFormat: valueFormatProp,\n utc = true,\n hour12 = false,\n minuteStep = 1,\n showSeconds = true,\n placeholder,\n min,\n max,\n disabledDate,\n weekStartsOn = 1,\n clearable = true,\n name,\n id: idProp,\n className,\n style,\n },\n ref,\n ) {\n const t = useT()\n const reactId = useId()\n const id = idProp ?? reactId\n const helperId = `${id}-helper`\n const labelId = `${id}-label`\n const format = formatProp ?? defaultFormatFor(hour12, showSeconds)\n // when the value is UTC, the wire string carries a `Z` (\"…09:35:00Z\"); `utc={false}` emits the\n // bare wall-clock (no zone designator). Override either via `valueFormat`.\n const valueFormat = valueFormatProp ?? (utc ? 'YYYY-MM-DDTHH:mm:ss[Z]' : 'YYYY-MM-DDTHH:mm:ss')\n\n // ── value (controlled / form-bound / uncontrolled) — a `valueFormat` datetime string ────────────\n const form = useFormContext()\n const isFormBound = Boolean(form && name)\n const bound = isFormBound ? form!.field(name!) : undefined\n const externalValue =\n value !== undefined\n ? value\n : isFormBound\n ? ((form!.values[name!] as string | undefined) ?? '')\n : undefined\n const isControlled = value !== undefined || isFormBound\n const [internal, setInternal] = useState<string>(defaultValue ?? '')\n const currentValue = isControlled ? externalValue! : internal\n // when `utc`, parse the UTC value and show it in the viewer's LOCAL time (value stays UTC, emit\n // converts back); when `utc={false}`, show/emit the value's exact wall-clock (no tz conversion)\n const toDisplay = (instant: Dayjs | null) => (utc ? utcToLocalWall(instant) : instant)\n const selected = toDisplay(parseValue(currentValue, valueFormat))\n\n const resolvedError = error ?? bound?.error ?? false\n const resolvedHelperText = helperText ?? bound?.helperText\n\n const minDate = toDisplay(parseValue(min, valueFormat))\n const maxDate = toDisplay(parseValue(max, valueFormat))\n const mask = maskFromFormat(format)\n // precision the user can actually type — driven by the display `format`, not just `showSeconds`\n const timeUnit = /s/.test(format) ? 'second' : 'minute'\n\n const commit = (next: string) => {\n if (next === currentValue) return // skip redundant onChange / setValue with an unchanged value\n if (!isControlled) setInternal(next)\n if (isFormBound) form!.setValue(name!, next)\n onChange?.(next)\n }\n\n // emit a datetime in the wire `valueFormat` (time preserved), or '' to clear. Re-picking the same\n // instant is a no-op (string equality alone would leak a spurious emit for sub-second source values)\n const commitDateTime = (d: Dayjs | null) => {\n if (d && selected && d.isSame(selected, 'second')) return\n // local-wall → UTC for the wire value (or emit the wall-clock as-is when `utc={false}`)\n commit(d ? (utc ? localWallToUtc(d) : d).format(valueFormat) : '')\n }\n\n // true when `d` differs from the current value at the input's precision — gates typed-input commits\n // so a no-op round-trip (focus/blur) never rewrites an unchanged value's finer time\n const changed = (d: Dayjs) => !selected || !d.isSame(selected, timeUnit)\n\n // input display text (kept in sync with the committed value; free while typing an incomplete value)\n const [inputText, setInputText] = useState<string>(() =>\n selected ? selected.format(format) : '',\n )\n useEffect(() => {\n setInputText(selected ? selected.format(format) : '')\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [currentValue, format, valueFormat])\n\n // ── popover ──────────────────────────────────────────────────────────────────────────────────\n const triggerRef = useRef<HTMLDivElement | null>(null)\n const inputRef = useRef<HTMLInputElement | null>(null)\n const [open, setOpen] = useState(false)\n const [viewMonth, setViewMonth] = useState<Dayjs>(() => selected ?? today())\n // which popover tab is active — controlled so picking a day can auto-advance to Time\n const [tab, setTab] = useState<'date' | 'time'>('date')\n const advanceRef = useRef(false) // set when a day-pick advances to Time → move focus there\n\n const setInputRef = useCallback(\n (node: HTMLInputElement | null) => {\n inputRef.current = node\n if (typeof ref === 'function') ref(node)\n else if (ref) (ref as { current: HTMLInputElement | null }).current = node\n },\n [ref],\n )\n\n const fieldBlurRef = useRef<(() => void) | undefined>(undefined)\n fieldBlurRef.current = bound\n ? () => bound.onBlur({} as FocusEvent<HTMLInputElement>)\n : undefined\n\n // the floating panel forwards its node here, for the blur check + the auto-advance focus move\n const popoverRef = useRef<HTMLDivElement | null>(null)\n\n const closePopover = useCallback((refocus: boolean) => {\n setOpen(false)\n fieldBlurRef.current?.()\n if (refocus) inputRef.current?.focus()\n }, [])\n\n useEffect(() => {\n if (open) {\n setViewMonth(selected ?? today())\n setTab('date') // always open on the Date tab\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open])\n\n // after a day-pick auto-advances to the Time tab, move focus onto it so the focus trap holds\n // (the just-picked calendar cell has unmounted); a manual tab switch never triggers this\n useEffect(() => {\n if (tab === 'time' && advanceRef.current) {\n advanceRef.current = false\n popoverRef.current\n ?.querySelector<HTMLElement>('[role=\"tab\"][aria-selected=\"true\"]')\n ?.focus()\n }\n }, [tab, popoverRef])\n\n const isOutOfRange = (d: Dayjs): boolean => {\n if (minDate && d.isBefore(minDate, 'day')) return true\n if (maxDate && d.isAfter(maxDate, 'day')) return true\n return Boolean(disabledDate && disabledDate(toISO(d)))\n }\n\n const handleInputChange = (raw: string) => {\n const masked = applyMask(raw, mask)\n setInputText(masked)\n if (masked === '') {\n commit('') // emptying the field clears the value\n return\n }\n const parsed = parseInput(masked, format)\n if (parsed && !isOutOfRange(parsed) && changed(parsed)) commitDateTime(parsed)\n }\n\n const handleInputBlur = (event: FocusEvent<HTMLInputElement>) => {\n const parsed = parseInput(inputText, format)\n if (inputText === '') {\n commit('') // an emptied field stays cleared\n } else if (parsed && !isOutOfRange(parsed)) {\n if (changed(parsed)) commitDateTime(parsed)\n setInputText(parsed.format(format))\n } else {\n setInputText(selected ? selected.format(format) : '')\n }\n const nextEl = event.relatedTarget as Node | null\n if (nextEl && (popoverRef.current?.contains(nextEl) || triggerRef.current?.contains(nextEl)))\n return\n bound?.onBlur(event)\n }\n\n // picking a day keeps the current time; picking a time keeps the current day — the popover stays open\n const handleSelectDate = (iso: string) => {\n const date = parseISO(iso)\n if (!date) return\n const base = selected ?? today()\n commitDateTime(date.hour(base.hour()).minute(base.minute()).second(base.second()))\n advanceRef.current = true\n setTab('time') // picking a day advances to the Time tab\n }\n const handleTimeChange = (next: Dayjs) => commitDateTime(next)\n\n const iconSize: 'sm' | 'md' = size === 'sm' ? 'sm' : 'md'\n\n return (\n <div\n className={clsx(\n styles.field,\n styles[size],\n fullWidth && styles.fullWidth,\n resolvedError && styles.error,\n disabled && styles.disabled,\n className,\n )}\n style={style}\n >\n {label != null && (\n <label htmlFor={id} className={styles.label}>\n <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n {label}\n </Typography>\n {required && (\n <span className={styles.required} aria-hidden=\"true\">\n *\n </span>\n )}\n </label>\n )}\n\n <div ref={triggerRef} className={clsx(styles.control, open && styles.open)}>\n <input\n ref={setInputRef}\n id={id}\n name={name}\n className={styles.input}\n value={inputText}\n placeholder={placeholder ?? format.toLowerCase()}\n disabled={disabled}\n autoComplete=\"off\"\n aria-invalid={resolvedError || undefined}\n aria-describedby={resolvedHelperText != null ? helperId : undefined}\n onChange={(e) => handleInputChange(e.target.value)}\n onBlur={handleInputBlur}\n />\n\n {clearable && currentValue !== '' && !disabled && (\n <button\n type=\"button\"\n className={styles.clear}\n aria-label={t('dateTimePicker.clear')}\n tabIndex={-1}\n onMouseDown={(e) => e.preventDefault()}\n onClick={() => {\n commit('')\n setInputText('')\n inputRef.current?.focus()\n }}\n >\n <Icon name=\"CloseCircle\" size=\"sm\" />\n </button>\n )}\n\n <IconButton\n type=\"button\"\n variant=\"text\"\n color=\"primary\"\n size={size}\n disabled={disabled}\n aria-label={t('dateTimePicker.open')}\n aria-haspopup=\"dialog\"\n aria-expanded={open}\n className={styles.calendarButton}\n onMouseDown={(e) => e.preventDefault()}\n onClick={() => setOpen((o) => !o)}\n >\n <Icon name=\"Calendar3\" size={iconSize} />\n </IconButton>\n </div>\n\n <FloatingPanel\n ref={popoverRef}\n open={open}\n triggerRef={triggerRef}\n onClose={closePopover}\n role=\"dialog\"\n ariaLabel=\"Choose date and time\"\n trapFocus\n className={clsx(styles.popover, dt.popover)}\n >\n <Tabs\n className={dt.tabs}\n aria-label={t('dateTimePicker.label')}\n fullWidth\n autoFocus\n // the Date/Time tabs are internal popover UI — never sync them to the page URL\n queryKey={null}\n value={tab}\n onChange={(v) => setTab(v as 'date' | 'time')}\n items={[\n {\n value: 'date',\n label: t('dateTimePicker.dateTab'),\n icon: 'Calendar3',\n content: (\n <Calendar\n value={selected}\n month={viewMonth}\n onMonthChange={setViewMonth}\n onSelect={handleSelectDate}\n min={minDate}\n max={maxDate}\n disabledDate={disabledDate}\n weekStartsOn={weekStartsOn}\n labelId={labelId}\n />\n ),\n },\n {\n value: 'time',\n label: t('dateTimePicker.timeTab'),\n icon: 'Clock',\n content: (\n <div className={dt.timePane}>\n <TimeColumns\n value={selected}\n onChange={handleTimeChange}\n hour12={hour12}\n minuteStep={minuteStep}\n showSeconds={showSeconds}\n />\n </div>\n ),\n },\n ]}\n />\n <div className={dt.footer}>\n <Button size=\"sm\" variant=\"filled\" color=\"primary\" onClick={() => closePopover(true)}>\n {t('common.done')}\n </Button>\n </div>\n </FloatingPanel>\n\n {resolvedHelperText != null && (\n <Typography\n as=\"span\"\n id={helperId}\n variant=\"bodySmall\"\n color={resolvedError ? 'error' : 'muted'}\n className={styles.helper}\n >\n {resolvedHelperText}\n </Typography>\n )}\n </div>\n )\n },\n)\n"],"names":["defaultFormatFor","hour12","showSeconds","DateTimePicker","forwardRef","label","size","error","helperText","required","fullWidth","disabled","value","defaultValue","onChange","formatProp","valueFormatProp","utc","minuteStep","placeholder","min","max","disabledDate","weekStartsOn","clearable","name","idProp","className","style","ref","t","useT","reactId","useId","id","helperId","labelId","format","valueFormat","form","useFormContext","isFormBound","bound","externalValue","isControlled","internal","setInternal","useState","currentValue","toDisplay","instant","utcToLocalWall","selected","parseValue","resolvedError","resolvedHelperText","minDate","maxDate","mask","maskFromFormat","timeUnit","commit","next","commitDateTime","d","localWallToUtc","changed","inputText","setInputText","useEffect","triggerRef","useRef","inputRef","open","setOpen","viewMonth","setViewMonth","today","tab","setTab","advanceRef","setInputRef","useCallback","node","fieldBlurRef","popoverRef","closePopover","refocus","_a","_b","isOutOfRange","toISO","handleInputChange","raw","masked","applyMask","parsed","parseInput","handleInputBlur","event","nextEl","handleSelectDate","iso","date","parseISO","base","handleTimeChange","iconSize","jsxs","clsx","styles","jsx","Typography","Icon","IconButton","o","FloatingPanel","dt","Tabs","v","Calendar","TimeColumns","Button"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DateTimePicker-Dq2jJ2yb.cjs","sources":["../src/components/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n type CSSProperties,\n type FocusEvent,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { useT } from '../../theme'\nimport { useFormContext } from '../../form/formContext'\nimport { FloatingPanel } from '../FloatingPanel/FloatingPanel'\nimport { Button } from '../Button'\nimport { Icon } from '../Icon'\nimport { IconButton } from '../IconButton'\nimport { Tabs } from '../Tabs'\nimport { Typography } from '../Typography'\nimport { Calendar } from '../DatePicker/Calendar'\nimport {\n applyMask,\n localWallToUtc,\n maskFromFormat,\n parseISO,\n parseInput,\n parseValue,\n today,\n toISO,\n utcToLocalWall,\n type Dayjs,\n} from '../DatePicker/dateUtils'\nimport styles from '../DatePicker/DatePicker.module.css'\nimport dt from './DateTimePicker.module.css'\nimport { TimeColumns } from './TimeColumns'\n\nexport type DateTimePickerSize = 'sm' | 'md' | 'lg'\n\nexport interface DateTimePickerProps {\n /** Label rendered above the field. */\n label?: ReactNode\n /** Preset size — control height, font and calendar density. */\n size?: DateTimePickerSize\n /** Marks the field invalid: red border/ring + the `helperText` in the error color. */\n error?: boolean\n /** Helper / validation text under the field. Adopts the error color while `error`. */\n helperText?: ReactNode\n /** Adds a red asterisk after the label. */\n required?: boolean\n /** Stretches the field to fill its container width. Defaults to `true`. */\n fullWidth?: boolean\n /** Disables the field. */\n disabled?: boolean\n /** Controlled value — a datetime string in `valueFormat` (default ISO datetime; `''` = empty). */\n value?: string\n /** Initial value for uncontrolled use (in `valueFormat`). */\n defaultValue?: string\n /** Fires with the next datetime in `valueFormat` (`''` when cleared). */\n onChange?: (value: string) => void\n /**\n * Display + typed-input format (dayjs tokens). Defaults to `'DD/MM/YYYY HH:mm:ss'` (or `hh:mm:ss A`\n * when `hour12`; the `:ss` is dropped when `showSeconds` is `false`).\n */\n format?: string\n /**\n * Wire format of `value`/`defaultValue`/`onChange` (dayjs tokens), decoupled from the displayed\n * `format`. Defaults to the ISO datetime `'YYYY-MM-DDTHH:mm:ss[Z]'` when `utc` (the `Z` marks the\n * value as UTC, e.g. `'2026-06-10T09:35:00Z'`), or `'YYYY-MM-DDTHH:mm:ss'` (no `Z`) when `utc={false}`.\n * Incoming values are parsed **leniently** (this format, then any ISO-8601 string — so a backend\n * datetime like `'2026-06-10T09:35:49.6134342'` with or without `Z` is accepted).\n */\n valueFormat?: string\n /**\n * Treat the value as **UTC** and display/edit in the viewer's **local** timezone (default `true`).\n * Set `false` to disable timezone conversion entirely — the field shows and emits the value's exact\n * wall-clock (what you pick is what's sent, no UTC shift).\n */\n utc?: boolean\n /** 12-hour clock (1–12 + AM/PM) instead of 24-hour (0–23). Defaults to `false`. */\n hour12?: boolean\n /** Minute increment for the minutes column. Defaults to `1`. */\n minuteStep?: number\n /** Show the seconds column + `:ss` in the default format. Defaults to `true`; pass `false` to hide seconds. */\n showSeconds?: boolean\n /** Placeholder shown when empty. Defaults to the lowercased `format`. */\n placeholder?: string\n /** Earliest selectable date (ISO date or datetime; day-level bound on the calendar). */\n min?: string\n /** Latest selectable date (ISO date or datetime; day-level bound on the calendar). */\n max?: string\n /** Disables specific dates — receives each day as an ISO `'YYYY-MM-DD'` string. */\n disabledDate?: (date: string) => boolean\n /** First day of the week: 0 = Sunday … 6 = Saturday. Defaults to `1` (Monday). */\n weekStartsOn?: number\n /** Shows a clear (×) button when a value is set. Defaults to `true`. */\n clearable?: boolean\n /** Form field name — auto-binds to a surrounding `<Form>` (value is the datetime string). */\n name?: string\n /** Id for the input (label association). */\n id?: string\n className?: string\n style?: CSSProperties\n}\n\nfunction defaultFormatFor(hour12: boolean, showSeconds: boolean): string {\n const time = hour12\n ? showSeconds\n ? 'hh:mm:ss A'\n : 'hh:mm A'\n : showSeconds\n ? 'HH:mm:ss'\n : 'HH:mm'\n return `DD/MM/YYYY ${time}`\n}\n\n/**\n * A datetime field with a typed, masked input **and** a popover combining the keyboard-navigable\n * `Calendar` (date) with scrollable time columns (hour / minute / optional second + AM/PM in 12-hour\n * mode). All math runs in **UTC** so the instant never drifts with the viewer's timezone; the value is a\n * string in `valueFormat` (UTC ISO datetime with a `Z` by default, or no `Z` when `utc={false}`) — incoming values are parsed\n * leniently (a richer backend datetime is accepted) and the chosen instant is emitted in that format.\n * Picking a date keeps the time and vice-versa, and the popover stays open until you click away,\n * press Escape, or hit Done. Supports `hour12`, `minuteStep`, `showSeconds`, `min`/`max`,\n * `disabledDate`, `weekStartsOn`, and `clearable`. Controlled (`value` + `onChange`) or uncontrolled\n * (`defaultValue`), and binds to a surrounding `<Form>` by `name`. Requires the `dayjs` peer dependency.\n */\nexport const DateTimePicker = forwardRef<HTMLInputElement, DateTimePickerProps>(\n function DateTimePicker(\n {\n label,\n size = 'md',\n error,\n helperText,\n required = false,\n fullWidth = true,\n disabled = false,\n value,\n defaultValue,\n onChange,\n format: formatProp,\n valueFormat: valueFormatProp,\n utc = true,\n hour12 = false,\n minuteStep = 1,\n showSeconds = true,\n placeholder,\n min,\n max,\n disabledDate,\n weekStartsOn = 1,\n clearable = true,\n name,\n id: idProp,\n className,\n style,\n },\n ref,\n ) {\n const t = useT()\n const reactId = useId()\n const id = idProp ?? reactId\n const helperId = `${id}-helper`\n const labelId = `${id}-label`\n const format = formatProp ?? defaultFormatFor(hour12, showSeconds)\n // when the value is UTC, the wire string carries a `Z` (\"…09:35:00Z\"); `utc={false}` emits the\n // bare wall-clock (no zone designator). Override either via `valueFormat`.\n const valueFormat = valueFormatProp ?? (utc ? 'YYYY-MM-DDTHH:mm:ss[Z]' : 'YYYY-MM-DDTHH:mm:ss')\n\n // ── value (controlled / form-bound / uncontrolled) — a `valueFormat` datetime string ────────────\n const form = useFormContext()\n const isFormBound = Boolean(form && name)\n const bound = isFormBound ? form!.field(name!) : undefined\n const externalValue =\n value !== undefined\n ? value\n : isFormBound\n ? ((form!.values[name!] as string | undefined) ?? '')\n : undefined\n const isControlled = value !== undefined || isFormBound\n const [internal, setInternal] = useState<string>(defaultValue ?? '')\n const currentValue = isControlled ? externalValue! : internal\n // when `utc`, parse the UTC value and show it in the viewer's LOCAL time (value stays UTC, emit\n // converts back); when `utc={false}`, show/emit the value's exact wall-clock (no tz conversion)\n const toDisplay = (instant: Dayjs | null) => (utc ? utcToLocalWall(instant) : instant)\n const selected = toDisplay(parseValue(currentValue, valueFormat))\n\n const resolvedError = error ?? bound?.error ?? false\n const resolvedHelperText = helperText ?? bound?.helperText\n\n const minDate = toDisplay(parseValue(min, valueFormat))\n const maxDate = toDisplay(parseValue(max, valueFormat))\n const mask = maskFromFormat(format)\n // precision the user can actually type — driven by the display `format`, not just `showSeconds`\n const timeUnit = /s/.test(format) ? 'second' : 'minute'\n\n const commit = (next: string) => {\n if (next === currentValue) return // skip redundant onChange / setValue with an unchanged value\n if (!isControlled) setInternal(next)\n if (isFormBound) form!.setValue(name!, next)\n onChange?.(next)\n }\n\n // emit a datetime in the wire `valueFormat` (time preserved), or '' to clear. Re-picking the same\n // instant is a no-op (string equality alone would leak a spurious emit for sub-second source values)\n const commitDateTime = (d: Dayjs | null) => {\n if (d && selected && d.isSame(selected, 'second')) return\n // local-wall → UTC for the wire value (or emit the wall-clock as-is when `utc={false}`)\n commit(d ? (utc ? localWallToUtc(d) : d).format(valueFormat) : '')\n }\n\n // true when `d` differs from the current value at the input's precision — gates typed-input commits\n // so a no-op round-trip (focus/blur) never rewrites an unchanged value's finer time\n const changed = (d: Dayjs) => !selected || !d.isSame(selected, timeUnit)\n\n // input display text (kept in sync with the committed value; free while typing an incomplete value)\n const [inputText, setInputText] = useState<string>(() =>\n selected ? selected.format(format) : '',\n )\n useEffect(() => {\n setInputText(selected ? selected.format(format) : '')\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [currentValue, format, valueFormat])\n\n // ── popover ──────────────────────────────────────────────────────────────────────────────────\n const triggerRef = useRef<HTMLDivElement | null>(null)\n const inputRef = useRef<HTMLInputElement | null>(null)\n const [open, setOpen] = useState(false)\n const [viewMonth, setViewMonth] = useState<Dayjs>(() => selected ?? today())\n // which popover tab is active — controlled so picking a day can auto-advance to Time\n const [tab, setTab] = useState<'date' | 'time'>('date')\n const advanceRef = useRef(false) // set when a day-pick advances to Time → move focus there\n\n const setInputRef = useCallback(\n (node: HTMLInputElement | null) => {\n inputRef.current = node\n if (typeof ref === 'function') ref(node)\n else if (ref) (ref as { current: HTMLInputElement | null }).current = node\n },\n [ref],\n )\n\n const fieldBlurRef = useRef<(() => void) | undefined>(undefined)\n fieldBlurRef.current = bound\n ? () => bound.onBlur({} as FocusEvent<HTMLInputElement>)\n : undefined\n\n // the floating panel forwards its node here, for the blur check + the auto-advance focus move\n const popoverRef = useRef<HTMLDivElement | null>(null)\n\n const closePopover = useCallback((refocus: boolean) => {\n setOpen(false)\n fieldBlurRef.current?.()\n if (refocus) inputRef.current?.focus()\n }, [])\n\n useEffect(() => {\n if (open) {\n setViewMonth(selected ?? today())\n setTab('date') // always open on the Date tab\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open])\n\n // after a day-pick auto-advances to the Time tab, move focus onto it so the focus trap holds\n // (the just-picked calendar cell has unmounted); a manual tab switch never triggers this\n useEffect(() => {\n if (tab === 'time' && advanceRef.current) {\n advanceRef.current = false\n popoverRef.current\n ?.querySelector<HTMLElement>('[role=\"tab\"][aria-selected=\"true\"]')\n ?.focus()\n }\n }, [tab, popoverRef])\n\n const isOutOfRange = (d: Dayjs): boolean => {\n if (minDate && d.isBefore(minDate, 'day')) return true\n if (maxDate && d.isAfter(maxDate, 'day')) return true\n return Boolean(disabledDate && disabledDate(toISO(d)))\n }\n\n const handleInputChange = (raw: string) => {\n const masked = applyMask(raw, mask)\n setInputText(masked)\n if (masked === '') {\n commit('') // emptying the field clears the value\n return\n }\n const parsed = parseInput(masked, format)\n if (parsed && !isOutOfRange(parsed) && changed(parsed)) commitDateTime(parsed)\n }\n\n const handleInputBlur = (event: FocusEvent<HTMLInputElement>) => {\n const parsed = parseInput(inputText, format)\n if (inputText === '') {\n commit('') // an emptied field stays cleared\n } else if (parsed && !isOutOfRange(parsed)) {\n if (changed(parsed)) commitDateTime(parsed)\n setInputText(parsed.format(format))\n } else {\n setInputText(selected ? selected.format(format) : '')\n }\n const nextEl = event.relatedTarget as Node | null\n if (nextEl && (popoverRef.current?.contains(nextEl) || triggerRef.current?.contains(nextEl)))\n return\n bound?.onBlur(event)\n }\n\n // picking a day keeps the current time; picking a time keeps the current day — the popover stays open\n const handleSelectDate = (iso: string) => {\n const date = parseISO(iso)\n if (!date) return\n const base = selected ?? today()\n commitDateTime(date.hour(base.hour()).minute(base.minute()).second(base.second()))\n advanceRef.current = true\n setTab('time') // picking a day advances to the Time tab\n }\n const handleTimeChange = (next: Dayjs) => commitDateTime(next)\n\n const iconSize: 'sm' | 'md' = size === 'sm' ? 'sm' : 'md'\n\n return (\n <div\n className={clsx(\n styles.field,\n styles[size],\n fullWidth && styles.fullWidth,\n resolvedError && styles.error,\n disabled && styles.disabled,\n className,\n )}\n style={style}\n >\n {label != null && (\n <label htmlFor={id} className={styles.label}>\n <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n {label}\n </Typography>\n {required && (\n <span className={styles.required} aria-hidden=\"true\">\n *\n </span>\n )}\n </label>\n )}\n\n <div ref={triggerRef} className={clsx(styles.control, open && styles.open)}>\n <input\n ref={setInputRef}\n id={id}\n name={name}\n className={styles.input}\n value={inputText}\n placeholder={placeholder ?? format.toLowerCase()}\n disabled={disabled}\n autoComplete=\"off\"\n aria-invalid={resolvedError || undefined}\n aria-describedby={resolvedHelperText != null ? helperId : undefined}\n onChange={(e) => handleInputChange(e.target.value)}\n onBlur={handleInputBlur}\n />\n\n {clearable && currentValue !== '' && !disabled && (\n <button\n type=\"button\"\n className={styles.clear}\n aria-label={t('dateTimePicker.clear')}\n tabIndex={-1}\n onMouseDown={(e) => e.preventDefault()}\n onClick={() => {\n commit('')\n setInputText('')\n inputRef.current?.focus()\n }}\n >\n <Icon name=\"CloseCircle\" size=\"sm\" />\n </button>\n )}\n\n <IconButton\n type=\"button\"\n variant=\"text\"\n color=\"primary\"\n size={size}\n disabled={disabled}\n aria-label={t('dateTimePicker.open')}\n aria-haspopup=\"dialog\"\n aria-expanded={open}\n className={styles.calendarButton}\n onMouseDown={(e) => e.preventDefault()}\n onClick={() => setOpen((o) => !o)}\n >\n <Icon name=\"Calendar3\" size={iconSize} />\n </IconButton>\n </div>\n\n <FloatingPanel\n ref={popoverRef}\n open={open}\n triggerRef={triggerRef}\n onClose={closePopover}\n role=\"dialog\"\n ariaLabel=\"Choose date and time\"\n trapFocus\n className={clsx(styles.popover, dt.popover)}\n >\n <Tabs\n className={dt.tabs}\n aria-label={t('dateTimePicker.label')}\n fullWidth\n autoFocus\n // the Date/Time tabs are internal popover UI — never sync them to the page URL\n queryKey={null}\n value={tab}\n onChange={(v) => setTab(v as 'date' | 'time')}\n items={[\n {\n value: 'date',\n label: t('dateTimePicker.dateTab'),\n icon: 'Calendar3',\n content: (\n <Calendar\n value={selected}\n month={viewMonth}\n onMonthChange={setViewMonth}\n onSelect={handleSelectDate}\n min={minDate}\n max={maxDate}\n disabledDate={disabledDate}\n weekStartsOn={weekStartsOn}\n labelId={labelId}\n />\n ),\n },\n {\n value: 'time',\n label: t('dateTimePicker.timeTab'),\n icon: 'Clock',\n content: (\n <div className={dt.timePane}>\n <TimeColumns\n value={selected}\n onChange={handleTimeChange}\n hour12={hour12}\n minuteStep={minuteStep}\n showSeconds={showSeconds}\n />\n </div>\n ),\n },\n ]}\n />\n <div className={dt.footer}>\n <Button size=\"sm\" variant=\"filled\" color=\"primary\" onClick={() => closePopover(true)}>\n {t('common.done')}\n </Button>\n </div>\n </FloatingPanel>\n\n {resolvedHelperText != null && (\n <Typography\n as=\"span\"\n id={helperId}\n variant=\"bodySmall\"\n color={resolvedError ? 'error' : 'muted'}\n className={styles.helper}\n >\n {resolvedHelperText}\n </Typography>\n )}\n </div>\n )\n },\n)\n"],"names":["defaultFormatFor","hour12","showSeconds","DateTimePicker","forwardRef","label","size","error","helperText","required","fullWidth","disabled","value","defaultValue","onChange","formatProp","valueFormatProp","utc","minuteStep","placeholder","min","max","disabledDate","weekStartsOn","clearable","name","idProp","className","style","ref","t","useT","reactId","useId","id","helperId","labelId","format","valueFormat","form","useFormContext","isFormBound","bound","externalValue","isControlled","internal","setInternal","useState","currentValue","toDisplay","instant","utcToLocalWall","selected","parseValue","resolvedError","resolvedHelperText","minDate","maxDate","mask","maskFromFormat","timeUnit","commit","next","commitDateTime","d","localWallToUtc","changed","inputText","setInputText","useEffect","triggerRef","useRef","inputRef","open","setOpen","viewMonth","setViewMonth","today","tab","setTab","advanceRef","setInputRef","useCallback","node","fieldBlurRef","popoverRef","closePopover","refocus","_a","_b","isOutOfRange","toISO","handleInputChange","raw","masked","applyMask","parsed","parseInput","handleInputBlur","event","nextEl","handleSelectDate","iso","date","parseISO","base","handleTimeChange","iconSize","jsxs","clsx","styles","jsx","Typography","Icon","IconButton","o","FloatingPanel","dt","Tabs","v","Calendar","TimeColumns","Button"],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ import { jsxs as et, Fragment as nt, jsx as q } from "react/jsx-runtime";
|
|
|
2
2
|
import { useId as ot, useRef as z, useState as R, useCallback as M, useLayoutEffect as rt, useEffect as W, cloneElement as it } from "react";
|
|
3
3
|
import { createPortal as st } from "react-dom";
|
|
4
4
|
import { clsx as ct } from "clsx";
|
|
5
|
-
import { L as at } from "./List-
|
|
5
|
+
import { L as at } from "./List-LqbfF6gU.js";
|
|
6
6
|
import { u as lt } from "./useLockBodyScroll-DwBILLPK.js";
|
|
7
7
|
const ut = "_panel_ntp6g_4", dt = "_sm_ntp6g_21", mt = "_md_ntp6g_24", ft = "_lg_ntp6g_27", C = {
|
|
8
8
|
panel: ut,
|
|
@@ -143,4 +143,4 @@ function Et({
|
|
|
143
143
|
export {
|
|
144
144
|
Et as D
|
|
145
145
|
};
|
|
146
|
-
//# sourceMappingURL=Dropdown-
|
|
146
|
+
//# sourceMappingURL=Dropdown-FfkmluRu.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown-DKAXue5_.js","sources":["../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import {\n cloneElement,\n useCallback,\n useEffect,\n useId,\n useLayoutEffect,\n useRef,\n useState,\n type CSSProperties,\n type MouseEvent as ReactMouseEvent,\n type ReactElement,\n type ReactNode,\n type Ref,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport { clsx } from 'clsx'\nimport { List, type ListItemSize } from '../List'\nimport { useLockBodyScroll } from '../../hooks/useLockBodyScroll'\nimport styles from './Dropdown.module.css'\n\nexport type DropdownPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end'\n\ninterface Position {\n top: number\n left: number\n side: 'top' | 'bottom'\n maxHeight: number\n minWidth?: number\n}\n\nexport interface DropdownProps {\n /** The element that opens the menu (e.g. a `Button` / `IconButton`). Cloned to wire click + a11y. */\n trigger: ReactElement\n /** Menu content — typically `ListItem`s (composed inside a `role=\"menu\"` `List`). */\n children: ReactNode\n /** Preferred placement. Flips to the opposite side automatically when it would overflow. Default `bottom-start`. */\n placement?: DropdownPlacement\n /** Menu size — sets the panel min-width (`sm` 150 · `md` 190 · `lg` 220) and the items' density. Default `md`. */\n size?: ListItemSize\n /**\n * Apply the size-based min-width (`sm` 150 · `md` 190 · `lg` 220px). Defaults to `true`; set `false`\n * to let the menu size to its content instead (the items' density still tracks `size`).\n */\n minWidth?: boolean\n /** Controlled open state. */\n open?: boolean\n /** Initial open state for uncontrolled use. Defaults to `false`. */\n defaultOpen?: boolean\n /** Fires with the next open state. */\n onOpenChange?: (open: boolean) => void\n /** Close the menu when an item inside is clicked. Defaults to `true`. */\n closeOnSelect?: boolean\n /** Make the menu at least as wide as the trigger (select-like). Defaults to `false`. */\n matchTriggerWidth?: boolean\n /** Prevents opening. */\n disabled?: boolean\n /** Gap between the trigger and the menu, in px. Defaults to `6`. */\n offset?: number\n /** Class applied to the floating panel. */\n className?: string\n /** Style applied to the floating panel. */\n style?: CSSProperties\n}\n\n/** Distance the menu is kept from the viewport edges (px). */\nconst VIEWPORT_PADDING = 8\n/** Focusable menu items, used for arrow-key roving. */\nconst FOCUSABLE =\n '[role=\"menuitem\"],[role=\"button\"],a[href],button:not([disabled]),[tabindex]:not([tabindex=\"-1\"])'\n\nfunction focusableItems(panel: HTMLElement | null): HTMLElement[] {\n if (!panel) return []\n return Array.from(panel.querySelectorAll<HTMLElement>(FOCUSABLE)).filter(\n (el) => el.getAttribute('aria-disabled') !== 'true' && el.offsetParent !== null,\n )\n}\n\n/**\n * A floating menu anchored to a `trigger`. Opens on trigger click; closes on outside click, `Escape`,\n * or selecting an item. The panel is portaled to `document.body` and positioned with collision\n * handling — it **flips** to the opposite side when it would overflow, clamps within the viewport, and\n * re-positions on scroll/resize (a too-tall menu caps its height and scrolls). Arrow keys move between\n * items; `Escape` returns focus to the trigger. Compose `ListItem`s as `children`.\n */\nexport function Dropdown({\n trigger,\n children,\n placement = 'bottom-start',\n size = 'md',\n minWidth = true,\n open,\n defaultOpen = false,\n onOpenChange,\n closeOnSelect = true,\n matchTriggerWidth = false,\n disabled = false,\n offset = 6,\n className,\n style,\n}: DropdownProps) {\n const menuId = useId()\n const triggerRef = useRef<HTMLElement | null>(null)\n const panelRef = useRef<HTMLDivElement | null>(null)\n\n const isControlled = open !== undefined\n const [internalOpen, setInternalOpen] = useState(defaultOpen)\n const isOpen = isControlled ? open : internalOpen\n const [visible, setVisible] = useState(false)\n const [pos, setPos] = useState<Position | null>(null)\n\n const setOpen = useCallback(\n (next: boolean) => {\n if (!isControlled) setInternalOpen(next)\n onOpenChange?.(next)\n },\n [isControlled, onOpenChange],\n )\n const close = useCallback(() => setOpen(false), [setOpen])\n\n // lock page scroll while the menu is open (no scrollbar shift)\n useLockBodyScroll(isOpen)\n\n // ── positioning: flip when it would overflow, clamp inside the viewport ──\n const update = useCallback(() => {\n const triggerEl = triggerRef.current\n const panel = panelRef.current\n if (!triggerEl || !panel) return\n\n const rect = triggerEl.getBoundingClientRect()\n const panelW = panel.offsetWidth\n const panelH = panel.offsetHeight\n const vw = window.innerWidth\n const vh = window.innerHeight\n const pad = VIEWPORT_PADDING\n\n const spaceBelow = vh - rect.bottom - offset - pad\n const spaceAbove = rect.top - offset - pad\n let side: 'top' | 'bottom' = placement.startsWith('bottom') ? 'bottom' : 'top'\n // flip only when the preferred side can't fit AND the opposite side has more room\n if (side === 'bottom' && panelH > spaceBelow && spaceAbove > spaceBelow) side = 'top'\n else if (side === 'top' && panelH > spaceAbove && spaceBelow > spaceAbove) side = 'bottom'\n\n const available = side === 'bottom' ? spaceBelow : spaceAbove\n const maxHeight = Math.max(0, available)\n const usedH = Math.min(panelH, maxHeight)\n\n let top = side === 'bottom' ? rect.bottom + offset : rect.top - offset - usedH\n top = Math.min(Math.max(top, pad), Math.max(pad, vh - pad - usedH))\n\n let left = placement.endsWith('end') ? rect.right - panelW : rect.left\n left = Math.min(Math.max(left, pad), Math.max(pad, vw - pad - panelW))\n\n setPos({ top, left, side, maxHeight, minWidth: matchTriggerWidth ? rect.width : undefined })\n }, [placement, offset, matchTriggerWidth])\n\n // position synchronously before paint whenever the menu is open\n useLayoutEffect(() => {\n if (!isOpen) {\n setVisible(false)\n return\n }\n update()\n }, [isOpen, update])\n\n // enter transition + reposition listeners while open\n useEffect(() => {\n if (!isOpen) return\n const raf = requestAnimationFrame(() => setVisible(true))\n\n const onReposition = () => update()\n window.addEventListener('resize', onReposition)\n window.addEventListener('scroll', onReposition, true)\n let ro: ResizeObserver | undefined\n if (typeof ResizeObserver !== 'undefined') {\n ro = new ResizeObserver(onReposition)\n if (panelRef.current) ro.observe(panelRef.current)\n if (triggerRef.current) ro.observe(triggerRef.current)\n }\n\n return () => {\n cancelAnimationFrame(raf)\n window.removeEventListener('resize', onReposition)\n window.removeEventListener('scroll', onReposition, true)\n ro?.disconnect()\n }\n }, [isOpen, update])\n\n // outside click + keyboard (Escape, arrow roving)\n useEffect(() => {\n if (!isOpen) return\n const onPointerDown = (event: PointerEvent) => {\n const target = event.target as Node\n if (triggerRef.current?.contains(target) || panelRef.current?.contains(target)) return\n close()\n }\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n event.preventDefault()\n close()\n triggerRef.current?.focus()\n } else if (event.key === 'Tab') {\n // Tab would move focus by portal DOM order (end of <body>), orphaning the open menu — close it\n // and let focus continue naturally from the trigger (Select/MultiSelect do the same)\n close()\n } else if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n event.preventDefault()\n const items = focusableItems(panelRef.current)\n if (!items.length) return\n const current = items.indexOf(document.activeElement as HTMLElement)\n const delta = event.key === 'ArrowDown' ? 1 : -1\n const next = (current + delta + items.length) % items.length\n items[next]?.focus()\n }\n }\n document.addEventListener('pointerdown', onPointerDown, true)\n document.addEventListener('keydown', onKeyDown)\n return () => {\n document.removeEventListener('pointerdown', onPointerDown, true)\n document.removeEventListener('keydown', onKeyDown)\n }\n }, [isOpen, close])\n\n // focus the first item once the menu is open and positioned\n useEffect(() => {\n if (!isOpen) return\n const raf = requestAnimationFrame(() => focusableItems(panelRef.current)[0]?.focus())\n return () => cancelAnimationFrame(raf)\n }, [isOpen])\n\n const triggerProps = trigger.props as {\n onClick?: (event: ReactMouseEvent) => void\n ref?: Ref<HTMLElement>\n }\n const originalRef = triggerProps.ref\n\n const clonedTrigger = cloneElement(trigger as ReactElement<Record<string, unknown>>, {\n ref: (node: HTMLElement | null) => {\n triggerRef.current = node\n if (typeof originalRef === 'function') originalRef(node)\n else if (originalRef) (originalRef as { current: HTMLElement | null }).current = node\n },\n onClick: (event: ReactMouseEvent) => {\n triggerProps.onClick?.(event)\n if (!disabled) setOpen(!isOpen)\n },\n 'aria-haspopup': 'menu',\n 'aria-expanded': isOpen,\n 'aria-controls': isOpen ? menuId : undefined,\n })\n\n const handlePanelClick = (event: ReactMouseEvent) => {\n if (!closeOnSelect) return\n const item = (event.target as HTMLElement).closest(FOCUSABLE)\n if (item && item.getAttribute('aria-disabled') !== 'true') {\n close()\n triggerRef.current?.focus()\n }\n }\n\n return (\n <>\n {clonedTrigger}\n {isOpen &&\n createPortal(\n <div\n ref={panelRef}\n id={menuId}\n className={clsx(styles.panel, minWidth && styles[size], className)}\n data-open={visible ? 'true' : 'false'}\n data-side={pos?.side ?? 'bottom'}\n style={{\n position: 'fixed',\n top: pos?.top ?? 0,\n left: pos?.left ?? 0,\n maxHeight: pos?.maxHeight,\n minWidth: pos?.minWidth,\n visibility: pos ? 'visible' : 'hidden',\n ...style,\n }}\n onClick={handlePanelClick}\n >\n <List role=\"menu\" size={size} padding=\"xs\">\n {children}\n </List>\n </div>,\n document.body,\n )}\n </>\n )\n}\n"],"names":["VIEWPORT_PADDING","FOCUSABLE","focusableItems","panel","el","Dropdown","trigger","children","placement","size","minWidth","open","defaultOpen","onOpenChange","closeOnSelect","matchTriggerWidth","disabled","offset","className","style","menuId","useId","triggerRef","useRef","panelRef","isControlled","internalOpen","setInternalOpen","useState","isOpen","visible","setVisible","pos","setPos","setOpen","useCallback","next","close","useLockBodyScroll","update","triggerEl","rect","panelW","panelH","vw","vh","pad","spaceBelow","spaceAbove","side","maxHeight","usedH","top","left","useLayoutEffect","useEffect","raf","onReposition","ro","onPointerDown","event","target","_a","_b","onKeyDown","items","current","delta","triggerProps","originalRef","clonedTrigger","cloneElement","node","handlePanelClick","item","jsxs","Fragment","createPortal","jsx","clsx","styles","List"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Dropdown-FfkmluRu.js","sources":["../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import {\n cloneElement,\n useCallback,\n useEffect,\n useId,\n useLayoutEffect,\n useRef,\n useState,\n type CSSProperties,\n type MouseEvent as ReactMouseEvent,\n type ReactElement,\n type ReactNode,\n type Ref,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport { clsx } from 'clsx'\nimport { List, type ListItemSize } from '../List'\nimport { useLockBodyScroll } from '../../hooks/useLockBodyScroll'\nimport styles from './Dropdown.module.css'\n\nexport type DropdownPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end'\n\ninterface Position {\n top: number\n left: number\n side: 'top' | 'bottom'\n maxHeight: number\n minWidth?: number\n}\n\nexport interface DropdownProps {\n /** The element that opens the menu (e.g. a `Button` / `IconButton`). Cloned to wire click + a11y. */\n trigger: ReactElement\n /** Menu content — typically `ListItem`s (composed inside a `role=\"menu\"` `List`). */\n children: ReactNode\n /** Preferred placement. Flips to the opposite side automatically when it would overflow. Default `bottom-start`. */\n placement?: DropdownPlacement\n /** Menu size — sets the panel min-width (`sm` 150 · `md` 190 · `lg` 220) and the items' density. Default `md`. */\n size?: ListItemSize\n /**\n * Apply the size-based min-width (`sm` 150 · `md` 190 · `lg` 220px). Defaults to `true`; set `false`\n * to let the menu size to its content instead (the items' density still tracks `size`).\n */\n minWidth?: boolean\n /** Controlled open state. */\n open?: boolean\n /** Initial open state for uncontrolled use. Defaults to `false`. */\n defaultOpen?: boolean\n /** Fires with the next open state. */\n onOpenChange?: (open: boolean) => void\n /** Close the menu when an item inside is clicked. Defaults to `true`. */\n closeOnSelect?: boolean\n /** Make the menu at least as wide as the trigger (select-like). Defaults to `false`. */\n matchTriggerWidth?: boolean\n /** Prevents opening. */\n disabled?: boolean\n /** Gap between the trigger and the menu, in px. Defaults to `6`. */\n offset?: number\n /** Class applied to the floating panel. */\n className?: string\n /** Style applied to the floating panel. */\n style?: CSSProperties\n}\n\n/** Distance the menu is kept from the viewport edges (px). */\nconst VIEWPORT_PADDING = 8\n/** Focusable menu items, used for arrow-key roving. */\nconst FOCUSABLE =\n '[role=\"menuitem\"],[role=\"button\"],a[href],button:not([disabled]),[tabindex]:not([tabindex=\"-1\"])'\n\nfunction focusableItems(panel: HTMLElement | null): HTMLElement[] {\n if (!panel) return []\n return Array.from(panel.querySelectorAll<HTMLElement>(FOCUSABLE)).filter(\n (el) => el.getAttribute('aria-disabled') !== 'true' && el.offsetParent !== null,\n )\n}\n\n/**\n * A floating menu anchored to a `trigger`. Opens on trigger click; closes on outside click, `Escape`,\n * or selecting an item. The panel is portaled to `document.body` and positioned with collision\n * handling — it **flips** to the opposite side when it would overflow, clamps within the viewport, and\n * re-positions on scroll/resize (a too-tall menu caps its height and scrolls). Arrow keys move between\n * items; `Escape` returns focus to the trigger. Compose `ListItem`s as `children`.\n */\nexport function Dropdown({\n trigger,\n children,\n placement = 'bottom-start',\n size = 'md',\n minWidth = true,\n open,\n defaultOpen = false,\n onOpenChange,\n closeOnSelect = true,\n matchTriggerWidth = false,\n disabled = false,\n offset = 6,\n className,\n style,\n}: DropdownProps) {\n const menuId = useId()\n const triggerRef = useRef<HTMLElement | null>(null)\n const panelRef = useRef<HTMLDivElement | null>(null)\n\n const isControlled = open !== undefined\n const [internalOpen, setInternalOpen] = useState(defaultOpen)\n const isOpen = isControlled ? open : internalOpen\n const [visible, setVisible] = useState(false)\n const [pos, setPos] = useState<Position | null>(null)\n\n const setOpen = useCallback(\n (next: boolean) => {\n if (!isControlled) setInternalOpen(next)\n onOpenChange?.(next)\n },\n [isControlled, onOpenChange],\n )\n const close = useCallback(() => setOpen(false), [setOpen])\n\n // lock page scroll while the menu is open (no scrollbar shift)\n useLockBodyScroll(isOpen)\n\n // ── positioning: flip when it would overflow, clamp inside the viewport ──\n const update = useCallback(() => {\n const triggerEl = triggerRef.current\n const panel = panelRef.current\n if (!triggerEl || !panel) return\n\n const rect = triggerEl.getBoundingClientRect()\n const panelW = panel.offsetWidth\n const panelH = panel.offsetHeight\n const vw = window.innerWidth\n const vh = window.innerHeight\n const pad = VIEWPORT_PADDING\n\n const spaceBelow = vh - rect.bottom - offset - pad\n const spaceAbove = rect.top - offset - pad\n let side: 'top' | 'bottom' = placement.startsWith('bottom') ? 'bottom' : 'top'\n // flip only when the preferred side can't fit AND the opposite side has more room\n if (side === 'bottom' && panelH > spaceBelow && spaceAbove > spaceBelow) side = 'top'\n else if (side === 'top' && panelH > spaceAbove && spaceBelow > spaceAbove) side = 'bottom'\n\n const available = side === 'bottom' ? spaceBelow : spaceAbove\n const maxHeight = Math.max(0, available)\n const usedH = Math.min(panelH, maxHeight)\n\n let top = side === 'bottom' ? rect.bottom + offset : rect.top - offset - usedH\n top = Math.min(Math.max(top, pad), Math.max(pad, vh - pad - usedH))\n\n let left = placement.endsWith('end') ? rect.right - panelW : rect.left\n left = Math.min(Math.max(left, pad), Math.max(pad, vw - pad - panelW))\n\n setPos({ top, left, side, maxHeight, minWidth: matchTriggerWidth ? rect.width : undefined })\n }, [placement, offset, matchTriggerWidth])\n\n // position synchronously before paint whenever the menu is open\n useLayoutEffect(() => {\n if (!isOpen) {\n setVisible(false)\n return\n }\n update()\n }, [isOpen, update])\n\n // enter transition + reposition listeners while open\n useEffect(() => {\n if (!isOpen) return\n const raf = requestAnimationFrame(() => setVisible(true))\n\n const onReposition = () => update()\n window.addEventListener('resize', onReposition)\n window.addEventListener('scroll', onReposition, true)\n let ro: ResizeObserver | undefined\n if (typeof ResizeObserver !== 'undefined') {\n ro = new ResizeObserver(onReposition)\n if (panelRef.current) ro.observe(panelRef.current)\n if (triggerRef.current) ro.observe(triggerRef.current)\n }\n\n return () => {\n cancelAnimationFrame(raf)\n window.removeEventListener('resize', onReposition)\n window.removeEventListener('scroll', onReposition, true)\n ro?.disconnect()\n }\n }, [isOpen, update])\n\n // outside click + keyboard (Escape, arrow roving)\n useEffect(() => {\n if (!isOpen) return\n const onPointerDown = (event: PointerEvent) => {\n const target = event.target as Node\n if (triggerRef.current?.contains(target) || panelRef.current?.contains(target)) return\n close()\n }\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n event.preventDefault()\n close()\n triggerRef.current?.focus()\n } else if (event.key === 'Tab') {\n // Tab would move focus by portal DOM order (end of <body>), orphaning the open menu — close it\n // and let focus continue naturally from the trigger (Select/MultiSelect do the same)\n close()\n } else if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n event.preventDefault()\n const items = focusableItems(panelRef.current)\n if (!items.length) return\n const current = items.indexOf(document.activeElement as HTMLElement)\n const delta = event.key === 'ArrowDown' ? 1 : -1\n const next = (current + delta + items.length) % items.length\n items[next]?.focus()\n }\n }\n document.addEventListener('pointerdown', onPointerDown, true)\n document.addEventListener('keydown', onKeyDown)\n return () => {\n document.removeEventListener('pointerdown', onPointerDown, true)\n document.removeEventListener('keydown', onKeyDown)\n }\n }, [isOpen, close])\n\n // focus the first item once the menu is open and positioned\n useEffect(() => {\n if (!isOpen) return\n const raf = requestAnimationFrame(() => focusableItems(panelRef.current)[0]?.focus())\n return () => cancelAnimationFrame(raf)\n }, [isOpen])\n\n const triggerProps = trigger.props as {\n onClick?: (event: ReactMouseEvent) => void\n ref?: Ref<HTMLElement>\n }\n const originalRef = triggerProps.ref\n\n const clonedTrigger = cloneElement(trigger as ReactElement<Record<string, unknown>>, {\n ref: (node: HTMLElement | null) => {\n triggerRef.current = node\n if (typeof originalRef === 'function') originalRef(node)\n else if (originalRef) (originalRef as { current: HTMLElement | null }).current = node\n },\n onClick: (event: ReactMouseEvent) => {\n triggerProps.onClick?.(event)\n if (!disabled) setOpen(!isOpen)\n },\n 'aria-haspopup': 'menu',\n 'aria-expanded': isOpen,\n 'aria-controls': isOpen ? menuId : undefined,\n })\n\n const handlePanelClick = (event: ReactMouseEvent) => {\n if (!closeOnSelect) return\n const item = (event.target as HTMLElement).closest(FOCUSABLE)\n if (item && item.getAttribute('aria-disabled') !== 'true') {\n close()\n triggerRef.current?.focus()\n }\n }\n\n return (\n <>\n {clonedTrigger}\n {isOpen &&\n createPortal(\n <div\n ref={panelRef}\n id={menuId}\n className={clsx(styles.panel, minWidth && styles[size], className)}\n data-open={visible ? 'true' : 'false'}\n data-side={pos?.side ?? 'bottom'}\n style={{\n position: 'fixed',\n top: pos?.top ?? 0,\n left: pos?.left ?? 0,\n maxHeight: pos?.maxHeight,\n minWidth: pos?.minWidth,\n visibility: pos ? 'visible' : 'hidden',\n ...style,\n }}\n onClick={handlePanelClick}\n >\n <List role=\"menu\" size={size} padding=\"xs\">\n {children}\n </List>\n </div>,\n document.body,\n )}\n </>\n )\n}\n"],"names":["VIEWPORT_PADDING","FOCUSABLE","focusableItems","panel","el","Dropdown","trigger","children","placement","size","minWidth","open","defaultOpen","onOpenChange","closeOnSelect","matchTriggerWidth","disabled","offset","className","style","menuId","useId","triggerRef","useRef","panelRef","isControlled","internalOpen","setInternalOpen","useState","isOpen","visible","setVisible","pos","setPos","setOpen","useCallback","next","close","useLockBodyScroll","update","triggerEl","rect","panelW","panelH","vw","vh","pad","spaceBelow","spaceAbove","side","maxHeight","usedH","top","left","useLayoutEffect","useEffect","raf","onReposition","ro","onPointerDown","event","target","_a","_b","onKeyDown","items","current","delta","triggerProps","originalRef","clonedTrigger","cloneElement","node","handlePanelClick","item","jsxs","Fragment","createPortal","jsx","clsx","styles","List"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const A=require("react/jsx-runtime"),o=require("react"),Z=require("react-dom"),$=require("clsx"),ee=require("./List-
|
|
2
|
-
//# sourceMappingURL=Dropdown-
|
|
1
|
+
"use strict";const A=require("react/jsx-runtime"),o=require("react"),Z=require("react-dom"),$=require("clsx"),ee=require("./List-ChXO0Hz-.cjs"),te=require("./useLockBodyScroll-CIXHZo-Q.cjs"),ne="_panel_ntp6g_4",re="_sm_ntp6g_21",oe="_md_ntp6g_24",se="_lg_ntp6g_27",B={panel:ne,sm:re,md:oe,lg:se},ie=8,j='[role="menuitem"],[role="button"],a[href],button:not([disabled]),[tabindex]:not([tabindex="-1"])';function C(b){return b?Array.from(b.querySelectorAll(j)).filter(h=>h.getAttribute("aria-disabled")!=="true"&&h.offsetParent!==null):[]}function ce({trigger:b,children:h,placement:L="bottom-start",size:M="md",minWidth:O=!0,open:W,defaultOpen:z=!1,onOpenChange:v,closeOnSelect:N=!0,matchTriggerWidth:H=!1,disabled:T=!1,offset:p=6,className:U,style:V}){const S=o.useId(),u=o.useRef(null),d=o.useRef(null),_=W!==void 0,[G,K]=o.useState(z),s=_?W:G,[J,F]=o.useState(!1),[r,Q]=o.useState(null),D=o.useCallback(n=>{_||K(n),v==null||v(n)},[_,v]),w=o.useCallback(()=>D(!1),[D]);te.useLockBodyScroll(s);const g=o.useCallback(()=>{const n=u.current,t=d.current;if(!n||!t)return;const e=n.getBoundingClientRect(),l=t.offsetWidth,a=t.offsetHeight,i=window.innerWidth,E=window.innerHeight,c=ie,m=E-e.bottom-p-c,k=e.top-p-c;let f=L.startsWith("bottom")?"bottom":"top";f==="bottom"&&a>m&&k>m?f="top":f==="top"&&a>k&&m>k&&(f="bottom");const I=Math.max(0,f==="bottom"?m:k),P=Math.min(a,I);let R=f==="bottom"?e.bottom+p:e.top-p-P;R=Math.min(Math.max(R,c),Math.max(c,E-c-P));let q=L.endsWith("end")?e.right-l:e.left;q=Math.min(Math.max(q,c),Math.max(c,i-c-l)),Q({top:R,left:q,side:f,maxHeight:I,minWidth:H?e.width:void 0})},[L,p,H]);o.useLayoutEffect(()=>{if(!s){F(!1);return}g()},[s,g]),o.useEffect(()=>{if(!s)return;const n=requestAnimationFrame(()=>F(!0)),t=()=>g();window.addEventListener("resize",t),window.addEventListener("scroll",t,!0);let e;return typeof ResizeObserver<"u"&&(e=new ResizeObserver(t),d.current&&e.observe(d.current),u.current&&e.observe(u.current)),()=>{cancelAnimationFrame(n),window.removeEventListener("resize",t),window.removeEventListener("scroll",t,!0),e==null||e.disconnect()}},[s,g]),o.useEffect(()=>{if(!s)return;const n=e=>{var a,i;const l=e.target;(a=u.current)!=null&&a.contains(l)||(i=d.current)!=null&&i.contains(l)||w()},t=e=>{var l,a;if(e.key==="Escape")e.preventDefault(),w(),(l=u.current)==null||l.focus();else if(e.key==="Tab")w();else if(e.key==="ArrowDown"||e.key==="ArrowUp"){e.preventDefault();const i=C(d.current);if(!i.length)return;const E=i.indexOf(document.activeElement),c=e.key==="ArrowDown"?1:-1,m=(E+c+i.length)%i.length;(a=i[m])==null||a.focus()}};return document.addEventListener("pointerdown",n,!0),document.addEventListener("keydown",t),()=>{document.removeEventListener("pointerdown",n,!0),document.removeEventListener("keydown",t)}},[s,w]),o.useEffect(()=>{if(!s)return;const n=requestAnimationFrame(()=>{var t;return(t=C(d.current)[0])==null?void 0:t.focus()});return()=>cancelAnimationFrame(n)},[s]);const x=b.props,y=x.ref,X=o.cloneElement(b,{ref:n=>{u.current=n,typeof y=="function"?y(n):y&&(y.current=n)},onClick:n=>{var t;(t=x.onClick)==null||t.call(x,n),T||D(!s)},"aria-haspopup":"menu","aria-expanded":s,"aria-controls":s?S:void 0}),Y=n=>{var e;if(!N)return;const t=n.target.closest(j);t&&t.getAttribute("aria-disabled")!=="true"&&(w(),(e=u.current)==null||e.focus())};return A.jsxs(A.Fragment,{children:[X,s&&Z.createPortal(A.jsx("div",{ref:d,id:S,className:$.clsx(B.panel,O&&B[M],U),"data-open":J?"true":"false","data-side":(r==null?void 0:r.side)??"bottom",style:{position:"fixed",top:(r==null?void 0:r.top)??0,left:(r==null?void 0:r.left)??0,maxHeight:r==null?void 0:r.maxHeight,minWidth:r==null?void 0:r.minWidth,visibility:r?"visible":"hidden",...V},onClick:Y,children:A.jsx(ee.List,{role:"menu",size:M,padding:"xs",children:h})}),document.body)]})}exports.Dropdown=ce;
|
|
2
|
+
//# sourceMappingURL=Dropdown-Ui7h2TGd.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown-DygP50OB.cjs","sources":["../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import {\n cloneElement,\n useCallback,\n useEffect,\n useId,\n useLayoutEffect,\n useRef,\n useState,\n type CSSProperties,\n type MouseEvent as ReactMouseEvent,\n type ReactElement,\n type ReactNode,\n type Ref,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport { clsx } from 'clsx'\nimport { List, type ListItemSize } from '../List'\nimport { useLockBodyScroll } from '../../hooks/useLockBodyScroll'\nimport styles from './Dropdown.module.css'\n\nexport type DropdownPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end'\n\ninterface Position {\n top: number\n left: number\n side: 'top' | 'bottom'\n maxHeight: number\n minWidth?: number\n}\n\nexport interface DropdownProps {\n /** The element that opens the menu (e.g. a `Button` / `IconButton`). Cloned to wire click + a11y. */\n trigger: ReactElement\n /** Menu content — typically `ListItem`s (composed inside a `role=\"menu\"` `List`). */\n children: ReactNode\n /** Preferred placement. Flips to the opposite side automatically when it would overflow. Default `bottom-start`. */\n placement?: DropdownPlacement\n /** Menu size — sets the panel min-width (`sm` 150 · `md` 190 · `lg` 220) and the items' density. Default `md`. */\n size?: ListItemSize\n /**\n * Apply the size-based min-width (`sm` 150 · `md` 190 · `lg` 220px). Defaults to `true`; set `false`\n * to let the menu size to its content instead (the items' density still tracks `size`).\n */\n minWidth?: boolean\n /** Controlled open state. */\n open?: boolean\n /** Initial open state for uncontrolled use. Defaults to `false`. */\n defaultOpen?: boolean\n /** Fires with the next open state. */\n onOpenChange?: (open: boolean) => void\n /** Close the menu when an item inside is clicked. Defaults to `true`. */\n closeOnSelect?: boolean\n /** Make the menu at least as wide as the trigger (select-like). Defaults to `false`. */\n matchTriggerWidth?: boolean\n /** Prevents opening. */\n disabled?: boolean\n /** Gap between the trigger and the menu, in px. Defaults to `6`. */\n offset?: number\n /** Class applied to the floating panel. */\n className?: string\n /** Style applied to the floating panel. */\n style?: CSSProperties\n}\n\n/** Distance the menu is kept from the viewport edges (px). */\nconst VIEWPORT_PADDING = 8\n/** Focusable menu items, used for arrow-key roving. */\nconst FOCUSABLE =\n '[role=\"menuitem\"],[role=\"button\"],a[href],button:not([disabled]),[tabindex]:not([tabindex=\"-1\"])'\n\nfunction focusableItems(panel: HTMLElement | null): HTMLElement[] {\n if (!panel) return []\n return Array.from(panel.querySelectorAll<HTMLElement>(FOCUSABLE)).filter(\n (el) => el.getAttribute('aria-disabled') !== 'true' && el.offsetParent !== null,\n )\n}\n\n/**\n * A floating menu anchored to a `trigger`. Opens on trigger click; closes on outside click, `Escape`,\n * or selecting an item. The panel is portaled to `document.body` and positioned with collision\n * handling — it **flips** to the opposite side when it would overflow, clamps within the viewport, and\n * re-positions on scroll/resize (a too-tall menu caps its height and scrolls). Arrow keys move between\n * items; `Escape` returns focus to the trigger. Compose `ListItem`s as `children`.\n */\nexport function Dropdown({\n trigger,\n children,\n placement = 'bottom-start',\n size = 'md',\n minWidth = true,\n open,\n defaultOpen = false,\n onOpenChange,\n closeOnSelect = true,\n matchTriggerWidth = false,\n disabled = false,\n offset = 6,\n className,\n style,\n}: DropdownProps) {\n const menuId = useId()\n const triggerRef = useRef<HTMLElement | null>(null)\n const panelRef = useRef<HTMLDivElement | null>(null)\n\n const isControlled = open !== undefined\n const [internalOpen, setInternalOpen] = useState(defaultOpen)\n const isOpen = isControlled ? open : internalOpen\n const [visible, setVisible] = useState(false)\n const [pos, setPos] = useState<Position | null>(null)\n\n const setOpen = useCallback(\n (next: boolean) => {\n if (!isControlled) setInternalOpen(next)\n onOpenChange?.(next)\n },\n [isControlled, onOpenChange],\n )\n const close = useCallback(() => setOpen(false), [setOpen])\n\n // lock page scroll while the menu is open (no scrollbar shift)\n useLockBodyScroll(isOpen)\n\n // ── positioning: flip when it would overflow, clamp inside the viewport ──\n const update = useCallback(() => {\n const triggerEl = triggerRef.current\n const panel = panelRef.current\n if (!triggerEl || !panel) return\n\n const rect = triggerEl.getBoundingClientRect()\n const panelW = panel.offsetWidth\n const panelH = panel.offsetHeight\n const vw = window.innerWidth\n const vh = window.innerHeight\n const pad = VIEWPORT_PADDING\n\n const spaceBelow = vh - rect.bottom - offset - pad\n const spaceAbove = rect.top - offset - pad\n let side: 'top' | 'bottom' = placement.startsWith('bottom') ? 'bottom' : 'top'\n // flip only when the preferred side can't fit AND the opposite side has more room\n if (side === 'bottom' && panelH > spaceBelow && spaceAbove > spaceBelow) side = 'top'\n else if (side === 'top' && panelH > spaceAbove && spaceBelow > spaceAbove) side = 'bottom'\n\n const available = side === 'bottom' ? spaceBelow : spaceAbove\n const maxHeight = Math.max(0, available)\n const usedH = Math.min(panelH, maxHeight)\n\n let top = side === 'bottom' ? rect.bottom + offset : rect.top - offset - usedH\n top = Math.min(Math.max(top, pad), Math.max(pad, vh - pad - usedH))\n\n let left = placement.endsWith('end') ? rect.right - panelW : rect.left\n left = Math.min(Math.max(left, pad), Math.max(pad, vw - pad - panelW))\n\n setPos({ top, left, side, maxHeight, minWidth: matchTriggerWidth ? rect.width : undefined })\n }, [placement, offset, matchTriggerWidth])\n\n // position synchronously before paint whenever the menu is open\n useLayoutEffect(() => {\n if (!isOpen) {\n setVisible(false)\n return\n }\n update()\n }, [isOpen, update])\n\n // enter transition + reposition listeners while open\n useEffect(() => {\n if (!isOpen) return\n const raf = requestAnimationFrame(() => setVisible(true))\n\n const onReposition = () => update()\n window.addEventListener('resize', onReposition)\n window.addEventListener('scroll', onReposition, true)\n let ro: ResizeObserver | undefined\n if (typeof ResizeObserver !== 'undefined') {\n ro = new ResizeObserver(onReposition)\n if (panelRef.current) ro.observe(panelRef.current)\n if (triggerRef.current) ro.observe(triggerRef.current)\n }\n\n return () => {\n cancelAnimationFrame(raf)\n window.removeEventListener('resize', onReposition)\n window.removeEventListener('scroll', onReposition, true)\n ro?.disconnect()\n }\n }, [isOpen, update])\n\n // outside click + keyboard (Escape, arrow roving)\n useEffect(() => {\n if (!isOpen) return\n const onPointerDown = (event: PointerEvent) => {\n const target = event.target as Node\n if (triggerRef.current?.contains(target) || panelRef.current?.contains(target)) return\n close()\n }\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n event.preventDefault()\n close()\n triggerRef.current?.focus()\n } else if (event.key === 'Tab') {\n // Tab would move focus by portal DOM order (end of <body>), orphaning the open menu — close it\n // and let focus continue naturally from the trigger (Select/MultiSelect do the same)\n close()\n } else if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n event.preventDefault()\n const items = focusableItems(panelRef.current)\n if (!items.length) return\n const current = items.indexOf(document.activeElement as HTMLElement)\n const delta = event.key === 'ArrowDown' ? 1 : -1\n const next = (current + delta + items.length) % items.length\n items[next]?.focus()\n }\n }\n document.addEventListener('pointerdown', onPointerDown, true)\n document.addEventListener('keydown', onKeyDown)\n return () => {\n document.removeEventListener('pointerdown', onPointerDown, true)\n document.removeEventListener('keydown', onKeyDown)\n }\n }, [isOpen, close])\n\n // focus the first item once the menu is open and positioned\n useEffect(() => {\n if (!isOpen) return\n const raf = requestAnimationFrame(() => focusableItems(panelRef.current)[0]?.focus())\n return () => cancelAnimationFrame(raf)\n }, [isOpen])\n\n const triggerProps = trigger.props as {\n onClick?: (event: ReactMouseEvent) => void\n ref?: Ref<HTMLElement>\n }\n const originalRef = triggerProps.ref\n\n const clonedTrigger = cloneElement(trigger as ReactElement<Record<string, unknown>>, {\n ref: (node: HTMLElement | null) => {\n triggerRef.current = node\n if (typeof originalRef === 'function') originalRef(node)\n else if (originalRef) (originalRef as { current: HTMLElement | null }).current = node\n },\n onClick: (event: ReactMouseEvent) => {\n triggerProps.onClick?.(event)\n if (!disabled) setOpen(!isOpen)\n },\n 'aria-haspopup': 'menu',\n 'aria-expanded': isOpen,\n 'aria-controls': isOpen ? menuId : undefined,\n })\n\n const handlePanelClick = (event: ReactMouseEvent) => {\n if (!closeOnSelect) return\n const item = (event.target as HTMLElement).closest(FOCUSABLE)\n if (item && item.getAttribute('aria-disabled') !== 'true') {\n close()\n triggerRef.current?.focus()\n }\n }\n\n return (\n <>\n {clonedTrigger}\n {isOpen &&\n createPortal(\n <div\n ref={panelRef}\n id={menuId}\n className={clsx(styles.panel, minWidth && styles[size], className)}\n data-open={visible ? 'true' : 'false'}\n data-side={pos?.side ?? 'bottom'}\n style={{\n position: 'fixed',\n top: pos?.top ?? 0,\n left: pos?.left ?? 0,\n maxHeight: pos?.maxHeight,\n minWidth: pos?.minWidth,\n visibility: pos ? 'visible' : 'hidden',\n ...style,\n }}\n onClick={handlePanelClick}\n >\n <List role=\"menu\" size={size} padding=\"xs\">\n {children}\n </List>\n </div>,\n document.body,\n )}\n </>\n )\n}\n"],"names":["VIEWPORT_PADDING","FOCUSABLE","focusableItems","panel","el","Dropdown","trigger","children","placement","size","minWidth","open","defaultOpen","onOpenChange","closeOnSelect","matchTriggerWidth","disabled","offset","className","style","menuId","useId","triggerRef","useRef","panelRef","isControlled","internalOpen","setInternalOpen","useState","isOpen","visible","setVisible","pos","setPos","setOpen","useCallback","next","close","useLockBodyScroll","update","triggerEl","rect","panelW","panelH","vw","vh","pad","spaceBelow","spaceAbove","side","maxHeight","usedH","top","left","useLayoutEffect","useEffect","raf","onReposition","ro","onPointerDown","event","target","_a","_b","onKeyDown","items","current","delta","triggerProps","originalRef","clonedTrigger","cloneElement","node","handlePanelClick","item","jsxs","Fragment","createPortal","jsx","clsx","styles","List"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Dropdown-Ui7h2TGd.cjs","sources":["../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import {\n cloneElement,\n useCallback,\n useEffect,\n useId,\n useLayoutEffect,\n useRef,\n useState,\n type CSSProperties,\n type MouseEvent as ReactMouseEvent,\n type ReactElement,\n type ReactNode,\n type Ref,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport { clsx } from 'clsx'\nimport { List, type ListItemSize } from '../List'\nimport { useLockBodyScroll } from '../../hooks/useLockBodyScroll'\nimport styles from './Dropdown.module.css'\n\nexport type DropdownPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end'\n\ninterface Position {\n top: number\n left: number\n side: 'top' | 'bottom'\n maxHeight: number\n minWidth?: number\n}\n\nexport interface DropdownProps {\n /** The element that opens the menu (e.g. a `Button` / `IconButton`). Cloned to wire click + a11y. */\n trigger: ReactElement\n /** Menu content — typically `ListItem`s (composed inside a `role=\"menu\"` `List`). */\n children: ReactNode\n /** Preferred placement. Flips to the opposite side automatically when it would overflow. Default `bottom-start`. */\n placement?: DropdownPlacement\n /** Menu size — sets the panel min-width (`sm` 150 · `md` 190 · `lg` 220) and the items' density. Default `md`. */\n size?: ListItemSize\n /**\n * Apply the size-based min-width (`sm` 150 · `md` 190 · `lg` 220px). Defaults to `true`; set `false`\n * to let the menu size to its content instead (the items' density still tracks `size`).\n */\n minWidth?: boolean\n /** Controlled open state. */\n open?: boolean\n /** Initial open state for uncontrolled use. Defaults to `false`. */\n defaultOpen?: boolean\n /** Fires with the next open state. */\n onOpenChange?: (open: boolean) => void\n /** Close the menu when an item inside is clicked. Defaults to `true`. */\n closeOnSelect?: boolean\n /** Make the menu at least as wide as the trigger (select-like). Defaults to `false`. */\n matchTriggerWidth?: boolean\n /** Prevents opening. */\n disabled?: boolean\n /** Gap between the trigger and the menu, in px. Defaults to `6`. */\n offset?: number\n /** Class applied to the floating panel. */\n className?: string\n /** Style applied to the floating panel. */\n style?: CSSProperties\n}\n\n/** Distance the menu is kept from the viewport edges (px). */\nconst VIEWPORT_PADDING = 8\n/** Focusable menu items, used for arrow-key roving. */\nconst FOCUSABLE =\n '[role=\"menuitem\"],[role=\"button\"],a[href],button:not([disabled]),[tabindex]:not([tabindex=\"-1\"])'\n\nfunction focusableItems(panel: HTMLElement | null): HTMLElement[] {\n if (!panel) return []\n return Array.from(panel.querySelectorAll<HTMLElement>(FOCUSABLE)).filter(\n (el) => el.getAttribute('aria-disabled') !== 'true' && el.offsetParent !== null,\n )\n}\n\n/**\n * A floating menu anchored to a `trigger`. Opens on trigger click; closes on outside click, `Escape`,\n * or selecting an item. The panel is portaled to `document.body` and positioned with collision\n * handling — it **flips** to the opposite side when it would overflow, clamps within the viewport, and\n * re-positions on scroll/resize (a too-tall menu caps its height and scrolls). Arrow keys move between\n * items; `Escape` returns focus to the trigger. Compose `ListItem`s as `children`.\n */\nexport function Dropdown({\n trigger,\n children,\n placement = 'bottom-start',\n size = 'md',\n minWidth = true,\n open,\n defaultOpen = false,\n onOpenChange,\n closeOnSelect = true,\n matchTriggerWidth = false,\n disabled = false,\n offset = 6,\n className,\n style,\n}: DropdownProps) {\n const menuId = useId()\n const triggerRef = useRef<HTMLElement | null>(null)\n const panelRef = useRef<HTMLDivElement | null>(null)\n\n const isControlled = open !== undefined\n const [internalOpen, setInternalOpen] = useState(defaultOpen)\n const isOpen = isControlled ? open : internalOpen\n const [visible, setVisible] = useState(false)\n const [pos, setPos] = useState<Position | null>(null)\n\n const setOpen = useCallback(\n (next: boolean) => {\n if (!isControlled) setInternalOpen(next)\n onOpenChange?.(next)\n },\n [isControlled, onOpenChange],\n )\n const close = useCallback(() => setOpen(false), [setOpen])\n\n // lock page scroll while the menu is open (no scrollbar shift)\n useLockBodyScroll(isOpen)\n\n // ── positioning: flip when it would overflow, clamp inside the viewport ──\n const update = useCallback(() => {\n const triggerEl = triggerRef.current\n const panel = panelRef.current\n if (!triggerEl || !panel) return\n\n const rect = triggerEl.getBoundingClientRect()\n const panelW = panel.offsetWidth\n const panelH = panel.offsetHeight\n const vw = window.innerWidth\n const vh = window.innerHeight\n const pad = VIEWPORT_PADDING\n\n const spaceBelow = vh - rect.bottom - offset - pad\n const spaceAbove = rect.top - offset - pad\n let side: 'top' | 'bottom' = placement.startsWith('bottom') ? 'bottom' : 'top'\n // flip only when the preferred side can't fit AND the opposite side has more room\n if (side === 'bottom' && panelH > spaceBelow && spaceAbove > spaceBelow) side = 'top'\n else if (side === 'top' && panelH > spaceAbove && spaceBelow > spaceAbove) side = 'bottom'\n\n const available = side === 'bottom' ? spaceBelow : spaceAbove\n const maxHeight = Math.max(0, available)\n const usedH = Math.min(panelH, maxHeight)\n\n let top = side === 'bottom' ? rect.bottom + offset : rect.top - offset - usedH\n top = Math.min(Math.max(top, pad), Math.max(pad, vh - pad - usedH))\n\n let left = placement.endsWith('end') ? rect.right - panelW : rect.left\n left = Math.min(Math.max(left, pad), Math.max(pad, vw - pad - panelW))\n\n setPos({ top, left, side, maxHeight, minWidth: matchTriggerWidth ? rect.width : undefined })\n }, [placement, offset, matchTriggerWidth])\n\n // position synchronously before paint whenever the menu is open\n useLayoutEffect(() => {\n if (!isOpen) {\n setVisible(false)\n return\n }\n update()\n }, [isOpen, update])\n\n // enter transition + reposition listeners while open\n useEffect(() => {\n if (!isOpen) return\n const raf = requestAnimationFrame(() => setVisible(true))\n\n const onReposition = () => update()\n window.addEventListener('resize', onReposition)\n window.addEventListener('scroll', onReposition, true)\n let ro: ResizeObserver | undefined\n if (typeof ResizeObserver !== 'undefined') {\n ro = new ResizeObserver(onReposition)\n if (panelRef.current) ro.observe(panelRef.current)\n if (triggerRef.current) ro.observe(triggerRef.current)\n }\n\n return () => {\n cancelAnimationFrame(raf)\n window.removeEventListener('resize', onReposition)\n window.removeEventListener('scroll', onReposition, true)\n ro?.disconnect()\n }\n }, [isOpen, update])\n\n // outside click + keyboard (Escape, arrow roving)\n useEffect(() => {\n if (!isOpen) return\n const onPointerDown = (event: PointerEvent) => {\n const target = event.target as Node\n if (triggerRef.current?.contains(target) || panelRef.current?.contains(target)) return\n close()\n }\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n event.preventDefault()\n close()\n triggerRef.current?.focus()\n } else if (event.key === 'Tab') {\n // Tab would move focus by portal DOM order (end of <body>), orphaning the open menu — close it\n // and let focus continue naturally from the trigger (Select/MultiSelect do the same)\n close()\n } else if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n event.preventDefault()\n const items = focusableItems(panelRef.current)\n if (!items.length) return\n const current = items.indexOf(document.activeElement as HTMLElement)\n const delta = event.key === 'ArrowDown' ? 1 : -1\n const next = (current + delta + items.length) % items.length\n items[next]?.focus()\n }\n }\n document.addEventListener('pointerdown', onPointerDown, true)\n document.addEventListener('keydown', onKeyDown)\n return () => {\n document.removeEventListener('pointerdown', onPointerDown, true)\n document.removeEventListener('keydown', onKeyDown)\n }\n }, [isOpen, close])\n\n // focus the first item once the menu is open and positioned\n useEffect(() => {\n if (!isOpen) return\n const raf = requestAnimationFrame(() => focusableItems(panelRef.current)[0]?.focus())\n return () => cancelAnimationFrame(raf)\n }, [isOpen])\n\n const triggerProps = trigger.props as {\n onClick?: (event: ReactMouseEvent) => void\n ref?: Ref<HTMLElement>\n }\n const originalRef = triggerProps.ref\n\n const clonedTrigger = cloneElement(trigger as ReactElement<Record<string, unknown>>, {\n ref: (node: HTMLElement | null) => {\n triggerRef.current = node\n if (typeof originalRef === 'function') originalRef(node)\n else if (originalRef) (originalRef as { current: HTMLElement | null }).current = node\n },\n onClick: (event: ReactMouseEvent) => {\n triggerProps.onClick?.(event)\n if (!disabled) setOpen(!isOpen)\n },\n 'aria-haspopup': 'menu',\n 'aria-expanded': isOpen,\n 'aria-controls': isOpen ? menuId : undefined,\n })\n\n const handlePanelClick = (event: ReactMouseEvent) => {\n if (!closeOnSelect) return\n const item = (event.target as HTMLElement).closest(FOCUSABLE)\n if (item && item.getAttribute('aria-disabled') !== 'true') {\n close()\n triggerRef.current?.focus()\n }\n }\n\n return (\n <>\n {clonedTrigger}\n {isOpen &&\n createPortal(\n <div\n ref={panelRef}\n id={menuId}\n className={clsx(styles.panel, minWidth && styles[size], className)}\n data-open={visible ? 'true' : 'false'}\n data-side={pos?.side ?? 'bottom'}\n style={{\n position: 'fixed',\n top: pos?.top ?? 0,\n left: pos?.left ?? 0,\n maxHeight: pos?.maxHeight,\n minWidth: pos?.minWidth,\n visibility: pos ? 'visible' : 'hidden',\n ...style,\n }}\n onClick={handlePanelClick}\n >\n <List role=\"menu\" size={size} padding=\"xs\">\n {children}\n </List>\n </div>,\n document.body,\n )}\n </>\n )\n}\n"],"names":["VIEWPORT_PADDING","FOCUSABLE","focusableItems","panel","el","Dropdown","trigger","children","placement","size","minWidth","open","defaultOpen","onOpenChange","closeOnSelect","matchTriggerWidth","disabled","offset","className","style","menuId","useId","triggerRef","useRef","panelRef","isControlled","internalOpen","setInternalOpen","useState","isOpen","visible","setVisible","pos","setPos","setOpen","useCallback","next","close","useLockBodyScroll","update","triggerEl","rect","panelW","panelH","vw","vh","pad","spaceBelow","spaceAbove","side","maxHeight","usedH","top","left","useLayoutEffect","useEffect","raf","onReposition","ro","onPointerDown","event","target","_a","_b","onKeyDown","items","current","delta","triggerProps","originalRef","clonedTrigger","cloneElement","node","handlePanelClick","item","jsxs","Fragment","createPortal","jsx","clsx","styles","List"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const t=require("react/jsx-runtime"),x=require("react"),y=require("clsx"),l=require("./Icon-CXTl_QAP.cjs"),z=require("./names-C2Yj1p3u.cjs"),N=require("./ConfigProvider-
|
|
2
|
-
//# sourceMappingURL=EmptyState-
|
|
1
|
+
"use strict";const t=require("react/jsx-runtime"),x=require("react"),y=require("clsx"),l=require("./Icon-CXTl_QAP.cjs"),z=require("./names-C2Yj1p3u.cjs"),N=require("./ConfigProvider-DFy6pL-C.cjs"),j="_emptyState_tu8zp_3",h="_sm_tu8zp_17",v="_md_tu8zp_23",f="_lg_tu8zp_29",q="_icon_tu8zp_37",E="_title_tu8zp_53",I="_description_tu8zp_59",g="_action_tu8zp_68",C="_pattern_tu8zp_75",e={emptyState:j,sm:h,md:v,lg:f,icon:q,title:E,description:I,action:g,pattern:C},O=new Set(z.ICON_NAMES),T=x.forwardRef(function({icon:n,title:o,description:s,action:c,size:a="md",pattern:_=!0,className:u,children:p,...d},m){const S=N.useT(),r=o??S("emptyState.title"),i=n===!1?null:n==null?t.jsx(l.Icon,{name:"FolderOpen"}):typeof n=="string"&&O.has(n)?t.jsx(l.Icon,{name:n}):n;return t.jsxs("div",{ref:m,className:y.clsx(e.emptyState,e[a],_&&e.pattern,u),...d,children:[i!=null&&t.jsx("div",{className:e.icon,"aria-hidden":!0,children:i}),r!=null&&t.jsx("div",{className:e.title,children:r}),s!=null&&t.jsx("div",{className:e.description,children:s}),c!=null&&t.jsx("div",{className:e.action,children:c}),p]})});exports.EmptyState=T;
|
|
2
|
+
//# sourceMappingURL=EmptyState-B2WgeL-H.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmptyState-
|
|
1
|
+
{"version":3,"file":"EmptyState-B2WgeL-H.cjs","sources":["../src/components/EmptyState/EmptyState.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode } from 'react'\nimport { clsx } from 'clsx'\nimport { useT } from '../../theme'\nimport { Icon } from '../Icon'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport styles from './EmptyState.module.css'\n\nexport type EmptyStateSize = 'sm' | 'md' | 'lg'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n /** Leading glyph shown in a soft circle — an `IconName`, any node, or `false` to hide it. Defaults to `FolderOpen`. */\n icon?: IconName | ReactNode | false\n /** Heading line. Defaults to `\"No Results Found\"`. */\n title?: ReactNode\n /** Muted description under the title (e.g. a hint on what to do next). */\n description?: ReactNode\n /** Action slot under the text — e.g. an \"Add Item\" or \"Clear Filters\" button. */\n action?: ReactNode\n /** Size — scales the icon, text, and vertical padding. Defaults to `md`. */\n size?: EmptyStateSize\n /**\n * Polished \"hero\" look: a faded grid backdrop (fades out toward the edges) + an elevated icon\n * (gradient + drop shadow). Defaults to `true`; pass `pattern={false}` for the flat, compact placeholder.\n */\n pattern?: boolean\n /** Extra content rendered below the action. */\n children?: ReactNode\n}\n\n/**\n * The empty-state placeholder — drop it in wherever a page, table, list, or gallery has nothing to\n * show (no records yet, no search matches). A centered, muted glyph in a soft circle + a `title` +\n * an optional `description` and `action` (e.g. a \"Add Item\" / \"Clear Filters\" button). Neutral by\n * design; pass a custom `icon` node for a tinted glyph. Token-only styling.\n */\nexport const EmptyState = forwardRef<HTMLDivElement, EmptyStateProps>(function EmptyState(\n { icon, title, description, action, size = 'md', pattern = true, className, children, ...props },\n ref,\n) {\n const t = useT()\n const resolvedTitle = title ?? t('emptyState.title')\n const renderedIcon =\n icon === false ? null : icon == null ? (\n <Icon name=\"FolderOpen\" />\n ) : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n <Icon name={icon as IconName} />\n ) : (\n icon\n )\n\n return (\n <div\n ref={ref}\n className={clsx(styles.emptyState, styles[size], pattern && styles.pattern, className)}\n {...props}\n >\n {renderedIcon != null && (\n <div className={styles.icon} aria-hidden>\n {renderedIcon}\n </div>\n )}\n {resolvedTitle != null && <div className={styles.title}>{resolvedTitle}</div>}\n {description != null && <div className={styles.description}>{description}</div>}\n {action != null && <div className={styles.action}>{action}</div>}\n {children}\n </div>\n )\n})\n"],"names":["ICON_NAME_SET","ICON_NAMES","EmptyState","forwardRef","icon","title","description","action","size","pattern","className","children","props","ref","t","useT","resolvedTitle","renderedIcon","jsx","Icon","jsxs","clsx","styles"],"mappings":"4cASMA,EAAgB,IAAI,IAAYC,YAAU,EA4BnCC,EAAaC,EAAAA,WAA4C,SACpE,CAAE,KAAAC,EAAM,MAAAC,EAAO,YAAAC,EAAa,OAAAC,EAAQ,KAAAC,EAAO,KAAM,QAAAC,EAAU,GAAM,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAA,EACzFC,EACA,CACA,MAAMC,EAAIC,EAAAA,KAAA,EACJC,EAAgBX,GAASS,EAAE,kBAAkB,EAC7CG,EACJb,IAAS,GAAQ,KAAOA,GAAQ,KAC9Bc,MAACC,EAAAA,KAAA,CAAK,KAAK,YAAA,CAAa,EACtB,OAAOf,GAAS,UAAYJ,EAAc,IAAII,CAAI,EACpDc,MAACC,EAAAA,KAAA,CAAK,KAAMf,CAAA,CAAkB,EAE9BA,EAGJ,OACEgB,EAAAA,KAAC,MAAA,CACC,IAAAP,EACA,UAAWQ,EAAAA,KAAKC,EAAO,WAAYA,EAAOd,CAAI,EAAGC,GAAWa,EAAO,QAASZ,CAAS,EACpF,GAAGE,EAEH,SAAA,CAAAK,GAAgB,YACd,MAAA,CAAI,UAAWK,EAAO,KAAM,cAAW,GACrC,SAAAL,CAAA,CACH,EAEDD,GAAiB,MAAQE,EAAAA,IAAC,OAAI,UAAWI,EAAO,MAAQ,SAAAN,EAAc,EACtEV,GAAe,MAAQY,EAAAA,IAAC,OAAI,UAAWI,EAAO,YAAc,SAAAhB,EAAY,EACxEC,GAAU,MAAQW,EAAAA,IAAC,OAAI,UAAWI,EAAO,OAAS,SAAAf,EAAO,EACzDI,CAAA,CAAA,CAAA,CAGP,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { forwardRef as y } from "react";
|
|
|
3
3
|
import { clsx as z } from "clsx";
|
|
4
4
|
import { I as l } from "./Icon-CophpkHo.js";
|
|
5
5
|
import { a as N } from "./names-D8ABK2Wk.js";
|
|
6
|
-
import { a as h } from "./ConfigProvider-
|
|
6
|
+
import { a as h } from "./ConfigProvider-sEZzNTeU.js";
|
|
7
7
|
const v = "_emptyState_tu8zp_3", E = "_sm_tu8zp_17", I = "_md_tu8zp_23", g = "_lg_tu8zp_29", x = "_icon_tu8zp_37", O = "_title_tu8zp_53", T = "_description_tu8zp_59", j = "_action_tu8zp_68", w = "_pattern_tu8zp_75", t = {
|
|
8
8
|
emptyState: v,
|
|
9
9
|
sm: E,
|
|
@@ -35,4 +35,4 @@ const v = "_emptyState_tu8zp_3", E = "_sm_tu8zp_17", I = "_md_tu8zp_23", g = "_l
|
|
|
35
35
|
export {
|
|
36
36
|
B as E
|
|
37
37
|
};
|
|
38
|
-
//# sourceMappingURL=EmptyState-
|
|
38
|
+
//# sourceMappingURL=EmptyState-D8eUxb8v.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmptyState-
|
|
1
|
+
{"version":3,"file":"EmptyState-D8eUxb8v.js","sources":["../src/components/EmptyState/EmptyState.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode } from 'react'\nimport { clsx } from 'clsx'\nimport { useT } from '../../theme'\nimport { Icon } from '../Icon'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport styles from './EmptyState.module.css'\n\nexport type EmptyStateSize = 'sm' | 'md' | 'lg'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n /** Leading glyph shown in a soft circle — an `IconName`, any node, or `false` to hide it. Defaults to `FolderOpen`. */\n icon?: IconName | ReactNode | false\n /** Heading line. Defaults to `\"No Results Found\"`. */\n title?: ReactNode\n /** Muted description under the title (e.g. a hint on what to do next). */\n description?: ReactNode\n /** Action slot under the text — e.g. an \"Add Item\" or \"Clear Filters\" button. */\n action?: ReactNode\n /** Size — scales the icon, text, and vertical padding. Defaults to `md`. */\n size?: EmptyStateSize\n /**\n * Polished \"hero\" look: a faded grid backdrop (fades out toward the edges) + an elevated icon\n * (gradient + drop shadow). Defaults to `true`; pass `pattern={false}` for the flat, compact placeholder.\n */\n pattern?: boolean\n /** Extra content rendered below the action. */\n children?: ReactNode\n}\n\n/**\n * The empty-state placeholder — drop it in wherever a page, table, list, or gallery has nothing to\n * show (no records yet, no search matches). A centered, muted glyph in a soft circle + a `title` +\n * an optional `description` and `action` (e.g. a \"Add Item\" / \"Clear Filters\" button). Neutral by\n * design; pass a custom `icon` node for a tinted glyph. Token-only styling.\n */\nexport const EmptyState = forwardRef<HTMLDivElement, EmptyStateProps>(function EmptyState(\n { icon, title, description, action, size = 'md', pattern = true, className, children, ...props },\n ref,\n) {\n const t = useT()\n const resolvedTitle = title ?? t('emptyState.title')\n const renderedIcon =\n icon === false ? null : icon == null ? (\n <Icon name=\"FolderOpen\" />\n ) : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n <Icon name={icon as IconName} />\n ) : (\n icon\n )\n\n return (\n <div\n ref={ref}\n className={clsx(styles.emptyState, styles[size], pattern && styles.pattern, className)}\n {...props}\n >\n {renderedIcon != null && (\n <div className={styles.icon} aria-hidden>\n {renderedIcon}\n </div>\n )}\n {resolvedTitle != null && <div className={styles.title}>{resolvedTitle}</div>}\n {description != null && <div className={styles.description}>{description}</div>}\n {action != null && <div className={styles.action}>{action}</div>}\n {children}\n </div>\n )\n})\n"],"names":["ICON_NAME_SET","ICON_NAMES","EmptyState","forwardRef","icon","title","description","action","size","pattern","className","children","props","ref","t","useT","resolvedTitle","renderedIcon","jsx","Icon","jsxs","clsx","styles"],"mappings":";;;;;;;;;;;;;;;;GASMA,IAAgB,IAAI,IAAYC,CAAU,GA4BnCC,IAAaC,EAA4C,SACpE,EAAE,MAAAC,GAAM,OAAAC,GAAO,aAAAC,GAAa,QAAAC,GAAQ,MAAAC,IAAO,MAAM,SAAAC,IAAU,IAAM,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GACzFC,GACA;AACA,QAAMC,IAAIC,EAAA,GACJC,IAAgBX,KAASS,EAAE,kBAAkB,GAC7CG,IACJb,MAAS,KAAQ,OAAOA,KAAQ,OAC9B,gBAAAc,EAACC,GAAA,EAAK,MAAK,aAAA,CAAa,IACtB,OAAOf,KAAS,YAAYJ,EAAc,IAAII,CAAI,IACpD,gBAAAc,EAACC,GAAA,EAAK,MAAMf,EAAA,CAAkB,IAE9BA;AAGJ,SACE,gBAAAgB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAP;AAAA,MACA,WAAWQ,EAAKC,EAAO,YAAYA,EAAOd,CAAI,GAAGC,KAAWa,EAAO,SAASZ,CAAS;AAAA,MACpF,GAAGE;AAAA,MAEH,UAAA;AAAA,QAAAK,KAAgB,0BACd,OAAA,EAAI,WAAWK,EAAO,MAAM,eAAW,IACrC,UAAAL,EAAA,CACH;AAAA,QAEDD,KAAiB,QAAQ,gBAAAE,EAAC,SAAI,WAAWI,EAAO,OAAQ,UAAAN,GAAc;AAAA,QACtEV,KAAe,QAAQ,gBAAAY,EAAC,SAAI,WAAWI,EAAO,aAAc,UAAAhB,GAAY;AAAA,QACxEC,KAAU,QAAQ,gBAAAW,EAAC,SAAI,WAAWI,EAAO,QAAS,UAAAf,GAAO;AAAA,QACzDI;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
|
|
@@ -11,10 +11,10 @@ import { t as Ge } from "./toastStore-Cx_JOKwS.js";
|
|
|
11
11
|
import { I as R } from "./Icon-CophpkHo.js";
|
|
12
12
|
import { T as se } from "./Typography-Cta6Rg4L.js";
|
|
13
13
|
import qt from "react-image-crop";
|
|
14
|
-
import { B as Ye } from "./Button-
|
|
15
|
-
import { M as Gt, O as Yt } from "./Modal-
|
|
16
|
-
import { T as Jt } from "./TextField-
|
|
17
|
-
import { a as me, h as Qt } from "./ConfigProvider-
|
|
14
|
+
import { B as Ye } from "./Button-BT8XmR_T.js";
|
|
15
|
+
import { M as Gt, O as Yt } from "./Modal-CRH_i5uU.js";
|
|
16
|
+
import { T as Jt } from "./TextField-12HcFD7u.js";
|
|
17
|
+
import { a as me, h as Qt } from "./ConfigProvider-sEZzNTeU.js";
|
|
18
18
|
import { f as xe } from "./TextField.module-QePvGeJ3.js";
|
|
19
19
|
const Xt = "_cropSection_1j2zs_4", Zt = "_cropHead_1j2zs_10", eo = "_cropStage_1j2zs_16", to = "_crop_1j2zs_4", oo = "_cropImg_1j2zs_30", no = "_altFields_1j2zs_35", Y = {
|
|
20
20
|
cropSection: Xt,
|
|
@@ -681,4 +681,4 @@ const hn = Dt(function({
|
|
|
681
681
|
export {
|
|
682
682
|
hn as F
|
|
683
683
|
};
|
|
684
|
-
//# sourceMappingURL=FileUploader-
|
|
684
|
+
//# sourceMappingURL=FileUploader-I0G-2WSe.js.map
|