@techzyapp/ui-library 1.0.20 → 1.0.21
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/{Accordion-Dy_dM79Y.cjs → Accordion-P3PNqSER.cjs} +2 -2
- package/dist/{Accordion-Dy_dM79Y.cjs.map → Accordion-P3PNqSER.cjs.map} +1 -1
- package/dist/{Accordion-CAxa1I-m.js → Accordion-w-w_WxxV.js} +3 -3
- package/dist/{Accordion-CAxa1I-m.js.map → Accordion-w-w_WxxV.js.map} +1 -1
- package/dist/{AdminRoot-DlpMJNTx.cjs → AdminRoot-BDRLuMX6.cjs} +2 -2
- package/dist/{AdminRoot-DlpMJNTx.cjs.map → AdminRoot-BDRLuMX6.cjs.map} +1 -1
- package/dist/{AdminRoot-B2J1cHK5.js → AdminRoot-DvF0js0q.js} +4 -4
- package/dist/{AdminRoot-B2J1cHK5.js.map → AdminRoot-DvF0js0q.js.map} +1 -1
- package/dist/{Alert-DRZdNwDm.cjs → Alert-CwoRkKq4.cjs} +2 -2
- package/dist/{Alert-DRZdNwDm.cjs.map → Alert-CwoRkKq4.cjs.map} +1 -1
- package/dist/{Alert-yldGvhVM.js → Alert-DPYmdaWs.js} +5 -5
- package/dist/{Alert-yldGvhVM.js.map → Alert-DPYmdaWs.js.map} +1 -1
- package/dist/{AuthLayout-B1tzhzHo.cjs → AuthLayout-BRUxDgzs.cjs} +2 -2
- package/dist/{AuthLayout-B1tzhzHo.cjs.map → AuthLayout-BRUxDgzs.cjs.map} +1 -1
- package/dist/{AuthLayout-j7EAPPXT.js → AuthLayout-CP9qu6Bv.js} +2 -2
- package/dist/{AuthLayout-j7EAPPXT.js.map → AuthLayout-CP9qu6Bv.js.map} +1 -1
- package/dist/{Avatar-_ufXh3AY.cjs → Avatar-Dgf04PBC.cjs} +2 -2
- package/dist/{Avatar-_ufXh3AY.cjs.map → Avatar-Dgf04PBC.cjs.map} +1 -1
- package/dist/{Avatar-BJVCdo-K.js → Avatar-Q50J8wdN.js} +3 -3
- package/dist/{Avatar-BJVCdo-K.js.map → Avatar-Q50J8wdN.js.map} +1 -1
- package/dist/{AvatarGroup-DdJf4aT7.js → AvatarGroup-YaNasLMS.js} +2 -2
- package/dist/{AvatarGroup-DdJf4aT7.js.map → AvatarGroup-YaNasLMS.js.map} +1 -1
- package/dist/{AvatarGroup-TW1pt4tj.cjs → AvatarGroup-uW0SD5P4.cjs} +2 -2
- package/dist/{AvatarGroup-TW1pt4tj.cjs.map → AvatarGroup-uW0SD5P4.cjs.map} +1 -1
- package/dist/{Breadcrumbs-f0GE4lCI.cjs → Breadcrumbs-CknDBLMw.cjs} +2 -2
- package/dist/{Breadcrumbs-f0GE4lCI.cjs.map → Breadcrumbs-CknDBLMw.cjs.map} +1 -1
- package/dist/{Breadcrumbs-FpIOHx_q.js → Breadcrumbs-l0PlUpQ4.js} +5 -5
- package/dist/{Breadcrumbs-FpIOHx_q.js.map → Breadcrumbs-l0PlUpQ4.js.map} +1 -1
- package/dist/{Button-Cu0XdnW6.cjs → Button-BdihbLYJ.cjs} +2 -2
- package/dist/{Button-Cu0XdnW6.cjs.map → Button-BdihbLYJ.cjs.map} +1 -1
- package/dist/{Button-BkjZ7wEu.js → Button-RljTGqHl.js} +2 -2
- package/dist/{Button-BkjZ7wEu.js.map → Button-RljTGqHl.js.map} +1 -1
- package/dist/{Calendar-DsJ6GICt.js → Calendar-CKCikOQL.js} +4 -4
- package/dist/{Calendar-DsJ6GICt.js.map → Calendar-CKCikOQL.js.map} +1 -1
- package/dist/{Calendar-CGQCditF.cjs → Calendar-DVg1uQuj.cjs} +2 -2
- package/dist/{Calendar-CGQCditF.cjs.map → Calendar-DVg1uQuj.cjs.map} +1 -1
- package/dist/{Card-CumMi_XB.js → Card-B0bYi4g2.js} +4 -4
- package/dist/{Card-CumMi_XB.js.map → Card-B0bYi4g2.js.map} +1 -1
- package/dist/{Card-DGTGdaTZ.cjs → Card-BYFuYD-a.cjs} +2 -2
- package/dist/{Card-DGTGdaTZ.cjs.map → Card-BYFuYD-a.cjs.map} +1 -1
- package/dist/Checkbox-ZYOSBYRt.js +98 -0
- package/dist/Checkbox-ZYOSBYRt.js.map +1 -0
- package/dist/Checkbox-fzJCwe0j.cjs +2 -0
- package/dist/Checkbox-fzJCwe0j.cjs.map +1 -0
- package/dist/{Chip-D83svOCW.js → Chip-BiqfnRUi.js} +3 -3
- package/dist/{Chip-D83svOCW.js.map → Chip-BiqfnRUi.js.map} +1 -1
- package/dist/{Chip-CJuAvgst.cjs → Chip-CdKUtUGE.cjs} +2 -2
- package/dist/{Chip-CJuAvgst.cjs.map → Chip-CdKUtUGE.cjs.map} +1 -1
- package/dist/{ChoiceCardGroup-CvFzZlgI.js → ChoiceCardGroup-DBohUnRj.js} +3 -3
- package/dist/{ChoiceCardGroup-CvFzZlgI.js.map → ChoiceCardGroup-DBohUnRj.js.map} +1 -1
- package/dist/{ChoiceCardGroup-6eFM1eL0.cjs → ChoiceCardGroup-d0VVTUi5.cjs} +2 -2
- package/dist/{ChoiceCardGroup-6eFM1eL0.cjs.map → ChoiceCardGroup-d0VVTUi5.cjs.map} +1 -1
- package/dist/{CodeBlock-BK_KXhos.js → CodeBlock-BX_0tpk3.js} +4 -4
- package/dist/{CodeBlock-BK_KXhos.js.map → CodeBlock-BX_0tpk3.js.map} +1 -1
- package/dist/{CodeBlock-C_UDrrY6.cjs → CodeBlock-CAAggVXS.cjs} +2 -2
- package/dist/{CodeBlock-C_UDrrY6.cjs.map → CodeBlock-CAAggVXS.cjs.map} +1 -1
- package/dist/{ColorPicker-BmxZnsNC.cjs → ColorPicker-BCSaT1A-.cjs} +2 -2
- package/dist/{ColorPicker-BmxZnsNC.cjs.map → ColorPicker-BCSaT1A-.cjs.map} +1 -1
- package/dist/{ColorPicker-DLnB_AvZ.js → ColorPicker-DhSlvwNj.js} +3 -3
- package/dist/{ColorPicker-DLnB_AvZ.js.map → ColorPicker-DhSlvwNj.js.map} +1 -1
- package/dist/{ColorPickerPanel-CoyKplF5.cjs → ColorPickerPanel-BOGYXXF1.cjs} +2 -2
- package/dist/{ColorPickerPanel-CoyKplF5.cjs.map → ColorPickerPanel-BOGYXXF1.cjs.map} +1 -1
- package/dist/{ColorPickerPanel-CG9idF4A.js → ColorPickerPanel-D4t3b9bB.js} +3 -3
- package/dist/{ColorPickerPanel-CG9idF4A.js.map → ColorPickerPanel-D4t3b9bB.js.map} +1 -1
- package/dist/{ConfigProvider-h1WoGC3R.cjs → ConfigProvider-C7DUWHrb.cjs} +2 -2
- package/dist/{ConfigProvider-h1WoGC3R.cjs.map → ConfigProvider-C7DUWHrb.cjs.map} +1 -1
- package/dist/{ConfigProvider-DDuIJSM7.js → ConfigProvider-DT0yrgmd.js} +2 -2
- package/dist/{ConfigProvider-DDuIJSM7.js.map → ConfigProvider-DT0yrgmd.js.map} +1 -1
- package/dist/{CopyButton-tRMAy59I.cjs → CopyButton-3585thVM.cjs} +2 -2
- package/dist/{CopyButton-tRMAy59I.cjs.map → CopyButton-3585thVM.cjs.map} +1 -1
- package/dist/{CopyButton-DdQ-8ExN.js → CopyButton-BEY1gJzK.js} +4 -4
- package/dist/{CopyButton-DdQ-8ExN.js.map → CopyButton-BEY1gJzK.js.map} +1 -1
- package/dist/{DashedButton-q7AOqKUE.cjs → DashedButton-3C4IZuo4.cjs} +2 -2
- package/dist/{DashedButton-q7AOqKUE.cjs.map → DashedButton-3C4IZuo4.cjs.map} +1 -1
- package/dist/{DashedButton-DeiALUPA.js → DashedButton-BXZAyMtw.js} +3 -3
- package/dist/{DashedButton-DeiALUPA.js.map → DashedButton-BXZAyMtw.js.map} +1 -1
- package/dist/{DatePicker-pz634ktl.js → DatePicker-CEFGgXLF.js} +5 -5
- package/dist/{DatePicker-pz634ktl.js.map → DatePicker-CEFGgXLF.js.map} +1 -1
- package/dist/{DatePicker-eryY6Xmx.cjs → DatePicker-Dyj2halw.cjs} +2 -2
- package/dist/{DatePicker-eryY6Xmx.cjs.map → DatePicker-Dyj2halw.cjs.map} +1 -1
- package/dist/{DateTimePicker-CmH3ZuzN.cjs → DateTimePicker-CjX4-8PP.cjs} +2 -2
- package/dist/{DateTimePicker-CmH3ZuzN.cjs.map → DateTimePicker-CjX4-8PP.cjs.map} +1 -1
- package/dist/{DateTimePicker-BJLq9Fud.js → DateTimePicker-hmYBEuUM.js} +8 -8
- package/dist/{DateTimePicker-BJLq9Fud.js.map → DateTimePicker-hmYBEuUM.js.map} +1 -1
- package/dist/{EmptyState-Cxf4H8Cc.cjs → EmptyState-Bj-vX_UV.cjs} +2 -2
- package/dist/{EmptyState-Cxf4H8Cc.cjs.map → EmptyState-Bj-vX_UV.cjs.map} +1 -1
- package/dist/{EmptyState-B2QPNhWW.js → EmptyState-DJDNLKT7.js} +4 -4
- package/dist/{EmptyState-B2QPNhWW.js.map → EmptyState-DJDNLKT7.js.map} +1 -1
- package/dist/{FileCard-Do9D72NA.js → FileCard-C9Ncifnu.js} +5 -5
- package/dist/{FileCard-Do9D72NA.js.map → FileCard-C9Ncifnu.js.map} +1 -1
- package/dist/{FileCard-D0Sa7WJt.cjs → FileCard-Dr5-z1R3.cjs} +2 -2
- package/dist/{FileCard-D0Sa7WJt.cjs.map → FileCard-Dr5-z1R3.cjs.map} +1 -1
- package/dist/{FileUploader-B1Arfj1a.cjs → FileUploader-DeyZENqq.cjs} +2 -2
- package/dist/{FileUploader-B1Arfj1a.cjs.map → FileUploader-DeyZENqq.cjs.map} +1 -1
- package/dist/{FileUploader-4900qKEE.js → FileUploader-XFmBNkA0.js} +6 -6
- package/dist/{FileUploader-4900qKEE.js.map → FileUploader-XFmBNkA0.js.map} +1 -1
- package/dist/{Flag-DNhhLtCC.js → Flag-Bs0xNP-P.js} +2 -2
- package/dist/{Flag-DNhhLtCC.js.map → Flag-Bs0xNP-P.js.map} +1 -1
- package/dist/{Flag-D7Vlczlw.cjs → Flag-Bxnx26DM.cjs} +2 -2
- package/dist/{Flag-D7Vlczlw.cjs.map → Flag-Bxnx26DM.cjs.map} +1 -1
- package/dist/{FullscreenToggle-dU2ai_OZ.cjs → FullscreenToggle-BncatGKj.cjs} +2 -2
- package/dist/{FullscreenToggle-dU2ai_OZ.cjs.map → FullscreenToggle-BncatGKj.cjs.map} +1 -1
- package/dist/{FullscreenToggle-Bc4fB-Mi.js → FullscreenToggle-DMlp05UN.js} +4 -4
- package/dist/{FullscreenToggle-Bc4fB-Mi.js.map → FullscreenToggle-DMlp05UN.js.map} +1 -1
- package/dist/Icon-BVULqOJD.cjs +2 -0
- package/dist/Icon-BVULqOJD.cjs.map +1 -0
- package/dist/{Icon-CophpkHo.js → Icon-DaTvzLBu.js} +2 -1
- package/dist/Icon-DaTvzLBu.js.map +1 -0
- package/dist/{IconButton-DpTxmj3d.js → IconButton-DXMmtuLA.js} +2 -2
- package/dist/{IconButton-DpTxmj3d.js.map → IconButton-DXMmtuLA.js.map} +1 -1
- package/dist/{IconButton-DyRC514t.cjs → IconButton-Lv0sDDR9.cjs} +2 -2
- package/dist/{IconButton-DyRC514t.cjs.map → IconButton-Lv0sDDR9.cjs.map} +1 -1
- package/dist/{ListItem-B4Upc0Hy.js → ListItem-Cn15lJBr.js} +3 -3
- package/dist/{ListItem-B4Upc0Hy.js.map → ListItem-Cn15lJBr.js.map} +1 -1
- package/dist/{ListItem-DWQorRxG.cjs → ListItem-yXXjtepZ.cjs} +2 -2
- package/dist/{ListItem-DWQorRxG.cjs.map → ListItem-yXXjtepZ.cjs.map} +1 -1
- package/dist/{Loader-B45H2SMP.cjs → Loader-53HFNMVX.cjs} +2 -2
- package/dist/{Loader-B45H2SMP.cjs.map → Loader-53HFNMVX.cjs.map} +1 -1
- package/dist/{Loader-B9VXX401.js → Loader-WsjQFl4p.js} +2 -2
- package/dist/{Loader-B9VXX401.js.map → Loader-WsjQFl4p.js.map} +1 -1
- package/dist/{Modal-Us_E-lb2.js → Modal-DBYcoCbJ.js} +5 -5
- package/dist/{Modal-Us_E-lb2.js.map → Modal-DBYcoCbJ.js.map} +1 -1
- package/dist/{Modal-DsoSz0Sp.cjs → Modal-V6eyGSzW.cjs} +2 -2
- package/dist/{Modal-DsoSz0Sp.cjs.map → Modal-V6eyGSzW.cjs.map} +1 -1
- package/dist/{MultiSelect-sKk2KzOd.js → MultiSelect-BsYPr3LD.js} +6 -6
- package/dist/{MultiSelect-sKk2KzOd.js.map → MultiSelect-BsYPr3LD.js.map} +1 -1
- package/dist/{MultiSelect-CtLpWaBX.cjs → MultiSelect-DS2DRpaP.cjs} +2 -2
- package/dist/{MultiSelect-CtLpWaBX.cjs.map → MultiSelect-DS2DRpaP.cjs.map} +1 -1
- package/dist/{NumberField-C6qj3nCa.cjs → NumberField-DC3TdGTt.cjs} +2 -2
- package/dist/{NumberField-C6qj3nCa.cjs.map → NumberField-DC3TdGTt.cjs.map} +1 -1
- package/dist/{NumberField-Cz03nksO.js → NumberField-mFb9pKCx.js} +4 -4
- package/dist/{NumberField-Cz03nksO.js.map → NumberField-mFb9pKCx.js.map} +1 -1
- package/dist/{OtpField-DLXQYMw1.js → OtpField-1ullIIZQ.js} +2 -2
- package/dist/{OtpField-DLXQYMw1.js.map → OtpField-1ullIIZQ.js.map} +1 -1
- package/dist/{OtpField-B46P6aMy.cjs → OtpField-BYj9SDHb.cjs} +2 -2
- package/dist/{OtpField-B46P6aMy.cjs.map → OtpField-BYj9SDHb.cjs.map} +1 -1
- package/dist/{PageLayout-BfeRjBek.cjs → PageLayout-pYL43wI9.cjs} +2 -2
- package/dist/{PageLayout-BfeRjBek.cjs.map → PageLayout-pYL43wI9.cjs.map} +1 -1
- package/dist/{PageLayout-BWU-p_N9.js → PageLayout-qf0H_EmS.js} +2 -2
- package/dist/{PageLayout-BWU-p_N9.js.map → PageLayout-qf0H_EmS.js.map} +1 -1
- package/dist/{PageNotFound-nvZm-UCG.cjs → PageNotFound-D1795gJ7.cjs} +2 -2
- package/dist/{PageNotFound-nvZm-UCG.cjs.map → PageNotFound-D1795gJ7.cjs.map} +1 -1
- package/dist/{PageNotFound-B_nTMrCD.js → PageNotFound-YGVMVvyG.js} +5 -5
- package/dist/{PageNotFound-B_nTMrCD.js.map → PageNotFound-YGVMVvyG.js.map} +1 -1
- package/dist/{Pagination-BYXUhmSz.js → Pagination-BTvUJiee.js} +3 -3
- package/dist/{Pagination-BYXUhmSz.js.map → Pagination-BTvUJiee.js.map} +1 -1
- package/dist/{Pagination-CsClNqIu.cjs → Pagination-WJq_7QNi.cjs} +2 -2
- package/dist/{Pagination-CsClNqIu.cjs.map → Pagination-WJq_7QNi.cjs.map} +1 -1
- package/dist/{RemoveDialog-PHdZi9-d.js → RemoveDialog-BSQ6EMW-.js} +5 -5
- package/dist/{RemoveDialog-PHdZi9-d.js.map → RemoveDialog-BSQ6EMW-.js.map} +1 -1
- package/dist/{RemoveDialog-D5J9TYap.cjs → RemoveDialog-BhcwsY0q.cjs} +2 -2
- package/dist/{RemoveDialog-D5J9TYap.cjs.map → RemoveDialog-BhcwsY0q.cjs.map} +1 -1
- package/dist/{RichTextEditor-jWv0t3vJ.cjs → RichTextEditor-Bc1fhvzn.cjs} +2 -2
- package/dist/{RichTextEditor-jWv0t3vJ.cjs.map → RichTextEditor-Bc1fhvzn.cjs.map} +1 -1
- package/dist/{RichTextEditor-BcmsnYGJ.js → RichTextEditor-CaGPtwXe.js} +9 -9
- package/dist/{RichTextEditor-BcmsnYGJ.js.map → RichTextEditor-CaGPtwXe.js.map} +1 -1
- package/dist/{RootLayout-q_oWf5et.js → RootLayout-BNwHsuhC.js} +31 -31
- package/dist/{RootLayout-q_oWf5et.js.map → RootLayout-BNwHsuhC.js.map} +1 -1
- package/dist/{RootLayout-DtZcqk9N.cjs → RootLayout-CB-3FgOp.cjs} +2 -2
- package/dist/{RootLayout-DtZcqk9N.cjs.map → RootLayout-CB-3FgOp.cjs.map} +1 -1
- package/dist/{Select-CWCeBQ8Q.cjs → Select-Cx1Yl8nq.cjs} +2 -2
- package/dist/{Select-CWCeBQ8Q.cjs.map → Select-Cx1Yl8nq.cjs.map} +1 -1
- package/dist/{Select-UygxT1Ry.js → Select-vKZzS9K4.js} +6 -6
- package/dist/{Select-UygxT1Ry.js.map → Select-vKZzS9K4.js.map} +1 -1
- package/dist/{Sidebar-C0OJK29L.js → Sidebar-CJ7DtOqb.js} +5 -5
- package/dist/{Sidebar-C0OJK29L.js.map → Sidebar-CJ7DtOqb.js.map} +1 -1
- package/dist/{Sidebar-BfBggyuh.cjs → Sidebar-Cv95DJxZ.cjs} +2 -2
- package/dist/{Sidebar-BfBggyuh.cjs.map → Sidebar-Cv95DJxZ.cjs.map} +1 -1
- package/dist/{SpeedDial-DbvOJ4no.js → SpeedDial-Bb0ioXaO.js} +4 -4
- package/dist/{SpeedDial-DbvOJ4no.js.map → SpeedDial-Bb0ioXaO.js.map} +1 -1
- package/dist/{SpeedDial-cKvuSMuk.cjs → SpeedDial-D6sO-9ES.cjs} +2 -2
- package/dist/{SpeedDial-cKvuSMuk.cjs.map → SpeedDial-D6sO-9ES.cjs.map} +1 -1
- package/dist/{Stepper-BxGrP6JZ.js → Stepper-BaEOUnYe.js} +4 -4
- package/dist/{Stepper-BxGrP6JZ.js.map → Stepper-BaEOUnYe.js.map} +1 -1
- package/dist/{Stepper-Db_ALAc4.cjs → Stepper-CVY8NJEI.cjs} +2 -2
- package/dist/{Stepper-Db_ALAc4.cjs.map → Stepper-CVY8NJEI.cjs.map} +1 -1
- package/dist/{SwatchPicker-DbAU9-ux.cjs → SwatchPicker-CCJltwHI.cjs} +2 -2
- package/dist/{SwatchPicker-DbAU9-ux.cjs.map → SwatchPicker-CCJltwHI.cjs.map} +1 -1
- package/dist/{SwatchPicker-D30aSrbY.js → SwatchPicker-CqyWngFJ.js} +2 -2
- package/dist/{SwatchPicker-D30aSrbY.js.map → SwatchPicker-CqyWngFJ.js.map} +1 -1
- package/dist/{Table--pDmXYad.cjs → Table-AQ7yJhtW.cjs} +2 -2
- package/dist/{Table--pDmXYad.cjs.map → Table-AQ7yJhtW.cjs.map} +1 -1
- package/dist/{Table-CNjnvZ-k.js → Table-wn-B7iLj.js} +17 -17
- package/dist/{Table-CNjnvZ-k.js.map → Table-wn-B7iLj.js.map} +1 -1
- package/dist/{Tabs-ozklGWmX.cjs → Tabs-BtcJ2jBl.cjs} +2 -2
- package/dist/{Tabs-ozklGWmX.cjs.map → Tabs-BtcJ2jBl.cjs.map} +1 -1
- package/dist/{Tabs-B0mWCNaC.js → Tabs-DJMfAUni.js} +4 -4
- package/dist/{Tabs-B0mWCNaC.js.map → Tabs-DJMfAUni.js.map} +1 -1
- package/dist/{TagsField-BIxwLfSJ.cjs → TagsField-4x3RmGwt.cjs} +2 -2
- package/dist/{TagsField-BIxwLfSJ.cjs.map → TagsField-4x3RmGwt.cjs.map} +1 -1
- package/dist/{TagsField-CGFm17lP.js → TagsField-Bvh6Fm5Y.js} +5 -5
- package/dist/{TagsField-CGFm17lP.js.map → TagsField-Bvh6Fm5Y.js.map} +1 -1
- package/dist/{TextField-DvKEj36A.cjs → TextField-DNqnpAWB.cjs} +2 -2
- package/dist/{TextField-DvKEj36A.cjs.map → TextField-DNqnpAWB.cjs.map} +1 -1
- package/dist/{TextField-CRCYLPpr.js → TextField-DcdwUA9d.js} +4 -4
- package/dist/{TextField-CRCYLPpr.js.map → TextField-DcdwUA9d.js.map} +1 -1
- package/dist/{ThemeToggle-BwW9L115.js → ThemeToggle-BVQmSMsj.js} +4 -4
- package/dist/{ThemeToggle-BwW9L115.js.map → ThemeToggle-BVQmSMsj.js.map} +1 -1
- package/dist/{ThemeToggle-DxxLN79b.cjs → ThemeToggle-isboxfZk.cjs} +2 -2
- package/dist/{ThemeToggle-DxxLN79b.cjs.map → ThemeToggle-isboxfZk.cjs.map} +1 -1
- package/dist/{TimeColumns-D3nqkQbh.js → TimeColumns-CFy_PynH.js} +2 -2
- package/dist/{TimeColumns-D3nqkQbh.js.map → TimeColumns-CFy_PynH.js.map} +1 -1
- package/dist/{TimeColumns-DB-V4KpQ.cjs → TimeColumns-DxFjjtc7.cjs} +2 -2
- package/dist/{TimeColumns-DB-V4KpQ.cjs.map → TimeColumns-DxFjjtc7.cjs.map} +1 -1
- package/dist/{TimePicker-D51QkQYy.js → TimePicker-ZO7jOJVa.js} +6 -6
- package/dist/{TimePicker-D51QkQYy.js.map → TimePicker-ZO7jOJVa.js.map} +1 -1
- package/dist/{TimePicker-D__72q2J.cjs → TimePicker-v1yA7Igl.cjs} +2 -2
- package/dist/{TimePicker-D__72q2J.cjs.map → TimePicker-v1yA7Igl.cjs.map} +1 -1
- package/dist/{Timeline-WkV4k_we.js → Timeline-D3kzt1dy.js} +3 -3
- package/dist/{Timeline-WkV4k_we.js.map → Timeline-D3kzt1dy.js.map} +1 -1
- package/dist/{Timeline-CoxW0Ia_.cjs → Timeline-ONU_3gi3.cjs} +2 -2
- package/dist/{Timeline-CoxW0Ia_.cjs.map → Timeline-ONU_3gi3.cjs.map} +1 -1
- package/dist/{Toaster-BynCHvUr.js → Toaster-C6UK_2TB.js} +2 -2
- package/dist/{Toaster-BynCHvUr.js.map → Toaster-C6UK_2TB.js.map} +1 -1
- package/dist/{Toaster-tHet1M-T.cjs → Toaster-Qnsq3guQ.cjs} +2 -2
- package/dist/{Toaster-tHet1M-T.cjs.map → Toaster-Qnsq3guQ.cjs.map} +1 -1
- package/dist/{ToggleButtonGroup-BWd7MOcc.js → ToggleButtonGroup-D9odYMzD.js} +3 -3
- package/dist/{ToggleButtonGroup-BWd7MOcc.js.map → ToggleButtonGroup-D9odYMzD.js.map} +1 -1
- package/dist/{ToggleButtonGroup-DYRLwKKh.cjs → ToggleButtonGroup-M2oj_3mc.cjs} +2 -2
- package/dist/{ToggleButtonGroup-DYRLwKKh.cjs.map → ToggleButtonGroup-M2oj_3mc.cjs.map} +1 -1
- package/dist/{TranslatedFields-DHRFcB3n.js → TranslatedFields-Bo5rZ7so.js} +5 -5
- package/dist/{TranslatedFields-DHRFcB3n.js.map → TranslatedFields-Bo5rZ7so.js.map} +1 -1
- package/dist/{TranslatedFields-B3Gli3TZ.cjs → TranslatedFields-CLMvRpJi.cjs} +2 -2
- package/dist/{TranslatedFields-B3Gli3TZ.cjs.map → TranslatedFields-CLMvRpJi.cjs.map} +1 -1
- package/dist/UserCard-454Kc7JS.js +74 -0
- package/dist/UserCard-454Kc7JS.js.map +1 -0
- package/dist/UserCard-CIjZz5xd.cjs +2 -0
- package/dist/UserCard-CIjZz5xd.cjs.map +1 -0
- package/dist/components/Accordion/index.cjs +1 -1
- package/dist/components/Accordion/index.js +1 -1
- package/dist/components/Alert/index.cjs +1 -1
- package/dist/components/Alert/index.js +1 -1
- package/dist/components/AuthLayout/index.cjs +1 -1
- package/dist/components/AuthLayout/index.js +1 -1
- package/dist/components/Avatar/index.cjs +1 -1
- package/dist/components/Avatar/index.js +2 -2
- 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/Checkbox/Checkbox.d.cts +7 -0
- package/dist/components/Checkbox/Checkbox.d.ts +7 -0
- package/dist/components/Checkbox/index.cjs +1 -1
- package/dist/components/Checkbox/index.js +1 -1
- package/dist/components/Chip/index.cjs +1 -1
- package/dist/components/Chip/index.js +1 -1
- package/dist/components/ChoiceCard/index.cjs +1 -1
- package/dist/components/ChoiceCard/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/CopyButton/index.cjs +1 -1
- package/dist/components/CopyButton/index.js +1 -1
- package/dist/components/DashedButton/index.cjs +1 -1
- package/dist/components/DashedButton/index.js +1 -1
- 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/EmptyState/index.cjs +1 -1
- package/dist/components/EmptyState/index.js +1 -1
- package/dist/components/FileCard/index.cjs +1 -1
- package/dist/components/FileCard/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/FullscreenToggle/index.cjs +1 -1
- package/dist/components/FullscreenToggle/index.js +1 -1
- package/dist/components/Icon/index.cjs +1 -1
- package/dist/components/Icon/index.js +2 -2
- 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 +1 -1
- package/dist/components/Loader/index.cjs +1 -1
- package/dist/components/Loader/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/index.cjs +1 -1
- package/dist/components/PageNotFound/index.js +1 -1
- 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/SwatchPicker/index.cjs +1 -1
- package/dist/components/SwatchPicker/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/Timeline/index.cjs +1 -1
- package/dist/components/Timeline/index.js +1 -1
- package/dist/components/Toast/index.cjs +1 -1
- package/dist/components/Toast/index.js +1 -1
- package/dist/components/ToggleButton/index.cjs +1 -1
- package/dist/components/ToggleButton/index.js +1 -1
- package/dist/components/TranslatedFields/index.cjs +1 -1
- package/dist/components/TranslatedFields/index.js +1 -1
- package/dist/components/UserCard/UserCard.d.cts +4 -1
- package/dist/components/UserCard/UserCard.d.ts +4 -1
- package/dist/components/UserCard/index.cjs +1 -1
- package/dist/components/UserCard/index.js +1 -1
- package/dist/entries/app.cjs +1 -1
- package/dist/entries/app.js +1 -1
- package/dist/entries/components.cjs +1 -1
- package/dist/entries/components.js +53 -53
- package/dist/entries/i18n.cjs +1 -1
- package/dist/entries/i18n.js +2 -2
- package/dist/entries/icons.cjs +1 -1
- package/dist/entries/icons.js +2 -2
- package/dist/entries/theme.cjs +1 -1
- package/dist/entries/theme.js +1 -1
- package/dist/i18n/messages.d.cts +1 -0
- package/dist/i18n/messages.d.ts +1 -0
- package/dist/icons/names.d.cts +3 -3
- package/dist/icons/names.d.ts +3 -3
- package/dist/index.cjs +1 -1
- package/dist/index.css +1 -1
- package/dist/index.js +56 -56
- package/dist/{messages-FciBtnCL.js → messages-CGHhwf6F.js} +10 -3
- package/dist/messages-CGHhwf6F.js.map +1 -0
- package/dist/messages-DZJyiaf9.cjs +36 -0
- package/dist/messages-DZJyiaf9.cjs.map +1 -0
- package/dist/names-BJnFU_5m.cjs +2 -0
- package/dist/names-BJnFU_5m.cjs.map +1 -0
- package/dist/{names-D8ABK2Wk.js → names-r21QPjcU.js} +3 -2
- package/dist/names-r21QPjcU.js.map +1 -0
- package/package.json +1 -1
- package/dist/Checkbox-DXOzYIAz.cjs +0 -2
- package/dist/Checkbox-DXOzYIAz.cjs.map +0 -1
- package/dist/Checkbox-XKL_Q5qj.js +0 -84
- package/dist/Checkbox-XKL_Q5qj.js.map +0 -1
- package/dist/Icon-CXTl_QAP.cjs +0 -2
- package/dist/Icon-CXTl_QAP.cjs.map +0 -1
- package/dist/Icon-CophpkHo.js.map +0 -1
- package/dist/UserCard-D7U-CLbM.js +0 -74
- package/dist/UserCard-D7U-CLbM.js.map +0 -1
- package/dist/UserCard-GHw2gTx9.cjs +0 -2
- package/dist/UserCard-GHw2gTx9.cjs.map +0 -1
- package/dist/messages-C0YutUM1.cjs +0 -36
- package/dist/messages-C0YutUM1.cjs.map +0 -1
- package/dist/messages-FciBtnCL.js.map +0 -1
- package/dist/names-C2Yj1p3u.cjs +0 -2
- package/dist/names-C2Yj1p3u.cjs.map +0 -1
- package/dist/names-D8ABK2Wk.js.map +0 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _ } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef as j, isValidElement as p, cloneElement as x } from "react";
|
|
3
3
|
import { clsx as B } from "clsx";
|
|
4
|
-
import { L as v } from "./Loader-
|
|
4
|
+
import { L as v } from "./Loader-WsjQFl4p.js";
|
|
5
5
|
const z = "_iconButton_1ja9g_1", I = "_sm_1ja9g_22", y = "_md_1ja9g_27", k = "_lg_1ja9g_32", C = "_contained_1ja9g_38", E = "_filled_1ja9g_48", L = "_outlined_1ja9g_57", $ = "_text_1ja9g_68", w = "_rounded_1ja9g_78", N = "_disabled_1ja9g_86", R = "_loading_1ja9g_90", V = "_nonClickable_1ja9g_95", t = {
|
|
6
6
|
iconButton: z,
|
|
7
7
|
sm: I,
|
|
@@ -65,4 +65,4 @@ const z = "_iconButton_1ja9g_1", I = "_sm_1ja9g_22", y = "_md_1ja9g_27", k = "_l
|
|
|
65
65
|
export {
|
|
66
66
|
H as I
|
|
67
67
|
};
|
|
68
|
-
//# sourceMappingURL=IconButton-
|
|
68
|
+
//# sourceMappingURL=IconButton-DXMmtuLA.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton-
|
|
1
|
+
{"version":3,"file":"IconButton-DXMmtuLA.js","sources":["../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import {\n cloneElement,\n forwardRef,\n isValidElement,\n type ButtonHTMLAttributes,\n type CSSProperties,\n type ReactElement,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport type { ThemeColor } from '../../theme'\nimport { Loader } from '../Loader'\nimport styles from './IconButton.module.css'\n\nexport type IconButtonVariant = 'contained' | 'filled' | 'outlined' | 'text'\nexport type IconButtonSize = 'sm' | 'md' | 'lg'\n\nexport interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'color'> {\n /** Visual style. `contained` solid · `filled` soft tint · `outlined` border · `text` bare. */\n variant?: IconButtonVariant\n /** Theme palette token that tints the button. Defaults to `accent`. */\n color?: ThemeColor\n /** Preset size — square: width === height === `--tz-control-height-*` (matches `Button` heights). */\n size?: IconButtonSize\n /** Shows the loader in the icon's place and blocks interaction (also sets the native `disabled`). */\n loading?: boolean\n /** Circular shape instead of the default rounded square. */\n rounded?: boolean\n /** Ignores all interaction (no clicks, hover or focus) while keeping the normal look — unlike `disabled`, it's not dimmed. */\n nonClickable?: boolean\n /** The icon to render — typically an `<Icon />`. Swapped for the loader while `loading`. */\n children?: ReactNode\n}\n\n/**\n * A square, text-less button for a single icon. Shares `Button`'s variants,\n * colors and sizing, but its width equals its height (the matching\n * `--tz-control-height-*`). Pass an `<Icon />` (or any node) as the child;\n * while `loading` it's replaced by the `Loader`. Provide an `aria-label` since\n * there's no visible text.\n */\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(function IconButton(\n {\n variant = 'contained',\n color = 'accent',\n size = 'md',\n loading = false,\n rounded = false,\n disabled = false,\n nonClickable = false,\n className,\n style,\n type = 'button',\n tabIndex,\n children,\n ...props\n },\n ref,\n) {\n // size the icon child to match the button (an explicit icon `size` still wins)\n const icon =\n isValidElement(children) && !loading\n ? cloneElement(children as ReactElement<{ size?: IconButtonSize }>, {\n size: (children.props as { size?: IconButtonSize }).size ?? size,\n })\n : children\n\n return (\n <button\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n aria-disabled={nonClickable || undefined}\n tabIndex={nonClickable ? -1 : tabIndex}\n className={clsx(\n styles.iconButton,\n styles[variant],\n styles[size],\n rounded && styles.rounded,\n loading && styles.loading,\n disabled && styles.disabled,\n nonClickable && styles.nonClickable,\n className,\n )}\n style={\n {\n '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`,\n '--tz-btn-on': `var(--tz-color-${color}-contrast, #fff)`,\n ...style,\n } as CSSProperties\n }\n {...props}\n >\n {loading ? <Loader size={size} aria-hidden=\"true\" /> : icon}\n </button>\n )\n})\n"],"names":["IconButton","forwardRef","variant","color","size","loading","rounded","disabled","nonClickable","className","style","type","tabIndex","children","props","ref","icon","isValidElement","cloneElement","jsx","clsx","styles","Loader"],"mappings":";;;;;;;;;;;;;;;;;GAyCaA,IAAaC,EAA+C,SACvE;AAAA,EACE,SAAAC,IAAU;AAAA,EACV,OAAAC,IAAQ;AAAA,EACR,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,SAAAC,IAAU;AAAA,EACV,UAAAC,IAAW;AAAA,EACX,cAAAC,IAAe;AAAA,EACf,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AAEA,QAAMC,IACJC,EAAeJ,CAAQ,KAAK,CAACR,IACzBa,EAAaL,GAAqD;AAAA,IAChE,MAAOA,EAAS,MAAoC,QAAQT;AAAA,EAAA,CAC7D,IACDS;AAEN,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAJ;AAAA,MACA,MAAAJ;AAAA,MACA,UAAUJ,KAAYF;AAAA,MACtB,aAAWA,KAAW;AAAA,MACtB,iBAAeG,KAAgB;AAAA,MAC/B,UAAUA,IAAe,KAAKI;AAAA,MAC9B,WAAWQ;AAAA,QACTC,EAAO;AAAA,QACPA,EAAOnB,CAAO;AAAA,QACdmB,EAAOjB,CAAI;AAAA,QACXE,KAAWe,EAAO;AAAA,QAClBhB,KAAWgB,EAAO;AAAA,QAClBd,KAAYc,EAAO;AAAA,QACnBb,KAAgBa,EAAO;AAAA,QACvBZ;AAAA,MAAA;AAAA,MAEF,OACE;AAAA,QACE,gBAAgB,kBAAkBN,CAAK;AAAA,QACvC,eAAe,kBAAkBA,CAAK;AAAA,QACtC,GAAGO;AAAA,MAAA;AAAA,MAGN,GAAGI;AAAA,MAEH,cAAU,gBAAAK,EAACG,GAAA,EAAO,MAAAlB,GAAY,eAAY,QAAO,IAAKY;AAAA,IAAA;AAAA,EAAA;AAG7D,CAAC;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const _=require("react/jsx-runtime"),a=require("react"),x=require("clsx"),B=require("./Loader-
|
|
2
|
-
//# sourceMappingURL=IconButton-
|
|
1
|
+
"use strict";const _=require("react/jsx-runtime"),a=require("react"),x=require("clsx"),B=require("./Loader-53HFNMVX.cjs"),q="_iconButton_1ja9g_1",v="_sm_1ja9g_22",z="_md_1ja9g_27",I="_lg_1ja9g_32",y="_contained_1ja9g_38",k="_filled_1ja9g_48",p="_outlined_1ja9g_57",C="_text_1ja9g_68",E="_rounded_1ja9g_78",L="_disabled_1ja9g_86",R="_loading_1ja9g_90",$="_nonClickable_1ja9g_95",t={iconButton:q,sm:v,md:z,lg:I,contained:y,filled:k,outlined:p,text:C,rounded:E,disabled:L,loading:R,nonClickable:$},w=a.forwardRef(function({variant:i="contained",color:c="accent",size:e="md",loading:n=!1,rounded:l=!1,disabled:d=!1,nonClickable:s=!1,className:r,style:u,type:g="button",tabIndex:b,children:o,...j},f){const m=a.isValidElement(o)&&!n?a.cloneElement(o,{size:o.props.size??e}):o;return _.jsx("button",{ref:f,type:g,disabled:d||n,"aria-busy":n||void 0,"aria-disabled":s||void 0,tabIndex:s?-1:b,className:x.clsx(t.iconButton,t[i],t[e],l&&t.rounded,n&&t.loading,d&&t.disabled,s&&t.nonClickable,r),style:{"--tz-btn-rgb":`var(--tz-color-${c}-rgb)`,"--tz-btn-on":`var(--tz-color-${c}-contrast, #fff)`,...u},...j,children:n?_.jsx(B.Loader,{size:e,"aria-hidden":"true"}):m})});exports.IconButton=w;
|
|
2
|
+
//# sourceMappingURL=IconButton-Lv0sDDR9.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton-
|
|
1
|
+
{"version":3,"file":"IconButton-Lv0sDDR9.cjs","sources":["../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import {\n cloneElement,\n forwardRef,\n isValidElement,\n type ButtonHTMLAttributes,\n type CSSProperties,\n type ReactElement,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport type { ThemeColor } from '../../theme'\nimport { Loader } from '../Loader'\nimport styles from './IconButton.module.css'\n\nexport type IconButtonVariant = 'contained' | 'filled' | 'outlined' | 'text'\nexport type IconButtonSize = 'sm' | 'md' | 'lg'\n\nexport interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'color'> {\n /** Visual style. `contained` solid · `filled` soft tint · `outlined` border · `text` bare. */\n variant?: IconButtonVariant\n /** Theme palette token that tints the button. Defaults to `accent`. */\n color?: ThemeColor\n /** Preset size — square: width === height === `--tz-control-height-*` (matches `Button` heights). */\n size?: IconButtonSize\n /** Shows the loader in the icon's place and blocks interaction (also sets the native `disabled`). */\n loading?: boolean\n /** Circular shape instead of the default rounded square. */\n rounded?: boolean\n /** Ignores all interaction (no clicks, hover or focus) while keeping the normal look — unlike `disabled`, it's not dimmed. */\n nonClickable?: boolean\n /** The icon to render — typically an `<Icon />`. Swapped for the loader while `loading`. */\n children?: ReactNode\n}\n\n/**\n * A square, text-less button for a single icon. Shares `Button`'s variants,\n * colors and sizing, but its width equals its height (the matching\n * `--tz-control-height-*`). Pass an `<Icon />` (or any node) as the child;\n * while `loading` it's replaced by the `Loader`. Provide an `aria-label` since\n * there's no visible text.\n */\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(function IconButton(\n {\n variant = 'contained',\n color = 'accent',\n size = 'md',\n loading = false,\n rounded = false,\n disabled = false,\n nonClickable = false,\n className,\n style,\n type = 'button',\n tabIndex,\n children,\n ...props\n },\n ref,\n) {\n // size the icon child to match the button (an explicit icon `size` still wins)\n const icon =\n isValidElement(children) && !loading\n ? cloneElement(children as ReactElement<{ size?: IconButtonSize }>, {\n size: (children.props as { size?: IconButtonSize }).size ?? size,\n })\n : children\n\n return (\n <button\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n aria-disabled={nonClickable || undefined}\n tabIndex={nonClickable ? -1 : tabIndex}\n className={clsx(\n styles.iconButton,\n styles[variant],\n styles[size],\n rounded && styles.rounded,\n loading && styles.loading,\n disabled && styles.disabled,\n nonClickable && styles.nonClickable,\n className,\n )}\n style={\n {\n '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`,\n '--tz-btn-on': `var(--tz-color-${color}-contrast, #fff)`,\n ...style,\n } as CSSProperties\n }\n {...props}\n >\n {loading ? <Loader size={size} aria-hidden=\"true\" /> : icon}\n </button>\n )\n})\n"],"names":["IconButton","forwardRef","variant","color","size","loading","rounded","disabled","nonClickable","className","style","type","tabIndex","children","props","ref","icon","isValidElement","cloneElement","jsx","clsx","styles","Loader"],"mappings":"+eAyCaA,EAAaC,EAAAA,WAA+C,SACvE,CACE,QAAAC,EAAU,YACV,MAAAC,EAAQ,SACR,KAAAC,EAAO,KACP,QAAAC,EAAU,GACV,QAAAC,EAAU,GACV,SAAAC,EAAW,GACX,aAAAC,EAAe,GACf,UAAAC,EACA,MAAAC,EACA,KAAAC,EAAO,SACP,SAAAC,EACA,SAAAC,EACA,GAAGC,CACL,EACAC,EACA,CAEA,MAAMC,EACJC,EAAAA,eAAeJ,CAAQ,GAAK,CAACR,EACzBa,EAAAA,aAAaL,EAAqD,CAChE,KAAOA,EAAS,MAAoC,MAAQT,CAAA,CAC7D,EACDS,EAEN,OACEM,EAAAA,IAAC,SAAA,CACC,IAAAJ,EACA,KAAAJ,EACA,SAAUJ,GAAYF,EACtB,YAAWA,GAAW,OACtB,gBAAeG,GAAgB,OAC/B,SAAUA,EAAe,GAAKI,EAC9B,UAAWQ,EAAAA,KACTC,EAAO,WACPA,EAAOnB,CAAO,EACdmB,EAAOjB,CAAI,EACXE,GAAWe,EAAO,QAClBhB,GAAWgB,EAAO,QAClBd,GAAYc,EAAO,SACnBb,GAAgBa,EAAO,aACvBZ,CAAA,EAEF,MACE,CACE,eAAgB,kBAAkBN,CAAK,QACvC,cAAe,kBAAkBA,CAAK,mBACtC,GAAGO,CAAA,EAGN,GAAGI,EAEH,WAAUK,EAAAA,IAACG,EAAAA,OAAA,CAAO,KAAAlB,EAAY,cAAY,OAAO,EAAKY,CAAA,CAAA,CAG7D,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as n, jsxs as f } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef as S } from "react";
|
|
3
3
|
import { clsx as v } from "clsx";
|
|
4
|
-
import { I as y } from "./Icon-
|
|
5
|
-
import { a as C } from "./names-
|
|
4
|
+
import { I as y } from "./Icon-DaTvzLBu.js";
|
|
5
|
+
import { a as C } from "./names-r21QPjcU.js";
|
|
6
6
|
import { u as E } from "./List-LqbfF6gU.js";
|
|
7
7
|
const O = "_item_1d91m_3", j = "_sm_1d91m_25", D = "_md_1d91m_31", A = "_lg_1d91m_36", M = "_itemIcon_1d91m_43", w = "_itemText_1d91m_51", B = "_itemLabel_1d91m_59", R = "_itemDescription_1d91m_66", Z = "_itemTrailing_1d91m_76", $ = "_clickable_1d91m_86", q = "_selected_1d91m_103", F = "_disabled_1d91m_124", t = {
|
|
8
8
|
item: O,
|
|
@@ -71,4 +71,4 @@ const O = "_item_1d91m_3", j = "_sm_1d91m_25", D = "_md_1d91m_31", A = "_lg_1d91
|
|
|
71
71
|
export {
|
|
72
72
|
K as L
|
|
73
73
|
};
|
|
74
|
-
//# sourceMappingURL=ListItem-
|
|
74
|
+
//# sourceMappingURL=ListItem-Cn15lJBr.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem-
|
|
1
|
+
{"version":3,"file":"ListItem-Cn15lJBr.js","sources":["../src/components/List/ListItem.tsx"],"sourcesContent":["import {\n forwardRef,\n type AnchorHTMLAttributes,\n type CSSProperties,\n type ElementType,\n type HTMLAttributes,\n type KeyboardEvent,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { Icon } from '../Icon'\nimport type { ThemeColor } from '../../theme'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { useListSize } from './listContext'\nimport styles from './List.module.css'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport type ListItemSize = 'sm' | 'md' | 'lg'\n\n/** Leading `<Icon>` size per row size. */\nconst ICON_SIZE: Record<ListItemSize, 'sm' | 'md'> = { sm: 'sm', md: 'md', lg: 'md' }\n\nexport interface ListItemProps\n extends\n Omit<HTMLAttributes<HTMLElement>, 'color'>,\n Pick<AnchorHTMLAttributes<HTMLAnchorElement>, 'href' | 'target' | 'rel' | 'download'> {\n /** Leading element — a known `IconName` (rendered as `<Icon>`) or any node (e.g. an `Avatar`). */\n icon?: IconName | ReactNode\n /** Secondary muted line shown under the label. */\n description?: ReactNode\n /** Trailing content pinned to the right (icon, `Badge`, shortcut text, chevron, …). */\n trailing?: ReactNode\n /** Highlights the row as selected/active (menu selection, current nav route). */\n selected?: boolean\n /** Makes the row interactive (hover + cursor; adds `role`/`tabIndex`/keyboard when rendered plain). */\n clickable?: boolean\n /** Dims and inerts the row. */\n disabled?: boolean\n /** Row size — height / padding / font. Defaults to `md`. */\n size?: ListItemSize\n /** Theme color for the selected tint and clickable hover. Defaults to `primary`. */\n color?: ThemeColor\n /** Render a different element/component — e.g. `'a'`, `'button'`, or a router `Link`. Defaults to `div`. */\n as?: ElementType\n /** Primary label / content. */\n children?: ReactNode\n}\n\n/**\n * A flexible, reusable list row: leading `icon`, a label (`children`) with optional `description`, and\n * a `trailing` slot. `clickable` turns it interactive (hover + keyboard when rendered as a plain\n * element), `selected` highlights it, `disabled` inerts it. Render as a link/button/router `Link` via\n * `as`. Designed to compose inside `List` — for menus, the sidebar, or a standalone styled list.\n */\nexport const ListItem = forwardRef<HTMLElement, ListItemProps>(function ListItem(\n {\n icon,\n description,\n trailing,\n selected = false,\n clickable = false,\n disabled = false,\n size: sizeProp,\n color = 'primary',\n as,\n className,\n style,\n children,\n onClick,\n onKeyDown,\n ...props\n },\n ref,\n) {\n // an explicit `size` wins; otherwise inherit a surrounding `List`'s size, falling back to `md`\n const listSize = useListSize()\n const size = sizeProp ?? listSize ?? 'md'\n const Component = (as ?? 'div') as ElementType\n // Anchors, buttons, and custom components (e.g. a router Link) carry their own click + keyboard\n // semantics — only a plain element needs the button role/tabIndex/Enter-Space shim.\n const handlesOwnInteraction =\n as === 'a' || as === 'button' || typeof as === 'function' || typeof as === 'object'\n const isDivButton = clickable && !handlesOwnInteraction\n\n const renderedIcon =\n icon == null ? null : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n <Icon name={icon as IconName} size={ICON_SIZE[size]} />\n ) : (\n icon\n )\n\n const handleKeyDown = (event: KeyboardEvent<HTMLElement>) => {\n if (isDivButton && !disabled && (event.key === 'Enter' || event.key === ' ')) {\n event.preventDefault()\n event.currentTarget.click()\n }\n onKeyDown?.(event)\n }\n\n return (\n <Component\n ref={ref}\n className={clsx(\n styles.item,\n styles[size],\n selected && styles.selected,\n clickable && styles.clickable,\n disabled && styles.disabled,\n className,\n )}\n style={{ '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`, ...style } as CSSProperties}\n role={isDivButton ? 'button' : undefined}\n tabIndex={isDivButton ? (disabled ? -1 : 0) : undefined}\n aria-disabled={disabled || undefined}\n aria-current={selected || undefined}\n onClick={disabled ? undefined : onClick}\n onKeyDown={clickable ? handleKeyDown : onKeyDown}\n {...props}\n >\n {renderedIcon != null && <span className={styles.itemIcon}>{renderedIcon}</span>}\n {(children != null || description != null) && (\n <span className={styles.itemText}>\n {children != null && <span className={styles.itemLabel}>{children}</span>}\n {description != null && <span className={styles.itemDescription}>{description}</span>}\n </span>\n )}\n {trailing != null && <span className={styles.itemTrailing}>{trailing}</span>}\n </Component>\n )\n})\n"],"names":["ICON_NAME_SET","ICON_NAMES","ICON_SIZE","ListItem","forwardRef","icon","description","trailing","selected","clickable","disabled","sizeProp","color","as","className","style","children","onClick","onKeyDown","props","ref","listSize","useListSize","size","Component","isDivButton","renderedIcon","jsx","Icon","handleKeyDown","event","jsxs","clsx","styles"],"mappings":";;;;;;;;;;;;;;;;;;;GAgBMA,IAAgB,IAAI,IAAYC,CAAU,GAK1CC,IAA+C,EAAE,IAAI,MAAM,IAAI,MAAM,IAAI,KAAA,GAkClEC,IAAWC,EAAuC,SAC7D;AAAA,EACE,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,MAAMC;AAAA,EACN,OAAAC,IAAQ;AAAA,EACR,IAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AAEA,QAAMC,IAAWC,EAAA,GACXC,IAAOZ,KAAYU,KAAY,MAC/BG,IAAaX,KAAM,OAKnBY,IAAchB,KAAa,EAD/BI,MAAO,OAAOA,MAAO,YAAY,OAAOA,KAAO,cAAc,OAAOA,KAAO,WAGvEa,IACJrB,KAAQ,OAAO,OAAO,OAAOA,KAAS,YAAYL,EAAc,IAAIK,CAAI,IACtE,gBAAAsB,EAACC,KAAK,MAAMvB,GAAkB,MAAMH,EAAUqB,CAAI,GAAG,IAErDlB,GAGEwB,IAAgB,CAACC,MAAsC;AAC3D,IAAIL,KAAe,CAACf,MAAaoB,EAAM,QAAQ,WAAWA,EAAM,QAAQ,SACtEA,EAAM,eAAA,GACNA,EAAM,cAAc,MAAA,IAEtBZ,KAAA,QAAAA,EAAYY;AAAA,EACd;AAEA,SACE,gBAAAC;AAAA,IAACP;AAAA,IAAA;AAAA,MACC,KAAAJ;AAAA,MACA,WAAWY;AAAA,QACTC,EAAO;AAAA,QACPA,EAAOV,CAAI;AAAA,QACXf,KAAYyB,EAAO;AAAA,QACnBxB,KAAawB,EAAO;AAAA,QACpBvB,KAAYuB,EAAO;AAAA,QACnBnB;AAAA,MAAA;AAAA,MAEF,OAAO,EAAE,gBAAgB,kBAAkBF,CAAK,SAAS,GAAGG,EAAA;AAAA,MAC5D,MAAMU,IAAc,WAAW;AAAA,MAC/B,UAAUA,IAAef,IAAW,KAAK,IAAK;AAAA,MAC9C,iBAAeA,KAAY;AAAA,MAC3B,gBAAcF,KAAY;AAAA,MAC1B,SAASE,IAAW,SAAYO;AAAA,MAChC,WAAWR,IAAYoB,IAAgBX;AAAA,MACtC,GAAGC;AAAA,MAEH,UAAA;AAAA,QAAAO,KAAgB,QAAQ,gBAAAC,EAAC,QAAA,EAAK,WAAWM,EAAO,UAAW,UAAAP,GAAa;AAAA,SACvEV,KAAY,QAAQV,KAAe,2BAClC,QAAA,EAAK,WAAW2B,EAAO,UACrB,UAAA;AAAA,UAAAjB,KAAY,QAAQ,gBAAAW,EAAC,QAAA,EAAK,WAAWM,EAAO,WAAY,UAAAjB,GAAS;AAAA,UACjEV,KAAe,QAAQ,gBAAAqB,EAAC,UAAK,WAAWM,EAAO,iBAAkB,UAAA3B,EAAA,CAAY;AAAA,QAAA,GAChF;AAAA,QAEDC,KAAY,QAAQ,gBAAAoB,EAAC,UAAK,WAAWM,EAAO,cAAe,UAAA1B,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG3E,CAAC;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const t=require("react/jsx-runtime"),z=require("react"),k=require("clsx"),q=require("./Icon-
|
|
2
|
-
//# sourceMappingURL=ListItem-
|
|
1
|
+
"use strict";const t=require("react/jsx-runtime"),z=require("react"),k=require("clsx"),q=require("./Icon-BVULqOJD.cjs"),S=require("./names-BJnFU_5m.cjs"),v=require("./List-ChXO0Hz-.cjs"),y="_item_1d91m_3",C="_sm_1d91m_25",E="_md_1d91m_31",O="_lg_1d91m_36",D="_itemIcon_1d91m_43",A="_itemText_1d91m_51",M="_itemLabel_1d91m_59",R="_itemDescription_1d91m_66",w="_itemTrailing_1d91m_76",B="_clickable_1d91m_86",Z="_selected_1d91m_103",$="_disabled_1d91m_124",e={item:y,sm:C,md:E,lg:O,itemIcon:D,itemText:A,itemLabel:M,itemDescription:R,itemTrailing:w,clickable:B,selected:Z,disabled:$},F=new Set(S.ICON_NAMES),G={sm:"sm",md:"md",lg:"md"},H=z.forwardRef(function({icon:s,description:l,trailing:_,selected:d=!1,clickable:o=!1,disabled:i=!1,size:x,color:b="primary",as:n,className:p,style:f,children:r,onClick:g,onKeyDown:m,...N},T){const j=v.useListSize(),u=x??j??"md",L=n??"div",a=o&&!(n==="a"||n==="button"||typeof n=="function"||typeof n=="object"),I=s==null?null:typeof s=="string"&&F.has(s)?t.jsx(q.Icon,{name:s,size:G[u]}):s,h=c=>{a&&!i&&(c.key==="Enter"||c.key===" ")&&(c.preventDefault(),c.currentTarget.click()),m==null||m(c)};return t.jsxs(L,{ref:T,className:k.clsx(e.item,e[u],d&&e.selected,o&&e.clickable,i&&e.disabled,p),style:{"--tz-btn-rgb":`var(--tz-color-${b}-rgb)`,...f},role:a?"button":void 0,tabIndex:a?i?-1:0:void 0,"aria-disabled":i||void 0,"aria-current":d||void 0,onClick:i?void 0:g,onKeyDown:o?h:m,...N,children:[I!=null&&t.jsx("span",{className:e.itemIcon,children:I}),(r!=null||l!=null)&&t.jsxs("span",{className:e.itemText,children:[r!=null&&t.jsx("span",{className:e.itemLabel,children:r}),l!=null&&t.jsx("span",{className:e.itemDescription,children:l})]}),_!=null&&t.jsx("span",{className:e.itemTrailing,children:_})]})});exports.ListItem=H;
|
|
2
|
+
//# sourceMappingURL=ListItem-yXXjtepZ.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem-
|
|
1
|
+
{"version":3,"file":"ListItem-yXXjtepZ.cjs","sources":["../src/components/List/ListItem.tsx"],"sourcesContent":["import {\n forwardRef,\n type AnchorHTMLAttributes,\n type CSSProperties,\n type ElementType,\n type HTMLAttributes,\n type KeyboardEvent,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { Icon } from '../Icon'\nimport type { ThemeColor } from '../../theme'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { useListSize } from './listContext'\nimport styles from './List.module.css'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\nexport type ListItemSize = 'sm' | 'md' | 'lg'\n\n/** Leading `<Icon>` size per row size. */\nconst ICON_SIZE: Record<ListItemSize, 'sm' | 'md'> = { sm: 'sm', md: 'md', lg: 'md' }\n\nexport interface ListItemProps\n extends\n Omit<HTMLAttributes<HTMLElement>, 'color'>,\n Pick<AnchorHTMLAttributes<HTMLAnchorElement>, 'href' | 'target' | 'rel' | 'download'> {\n /** Leading element — a known `IconName` (rendered as `<Icon>`) or any node (e.g. an `Avatar`). */\n icon?: IconName | ReactNode\n /** Secondary muted line shown under the label. */\n description?: ReactNode\n /** Trailing content pinned to the right (icon, `Badge`, shortcut text, chevron, …). */\n trailing?: ReactNode\n /** Highlights the row as selected/active (menu selection, current nav route). */\n selected?: boolean\n /** Makes the row interactive (hover + cursor; adds `role`/`tabIndex`/keyboard when rendered plain). */\n clickable?: boolean\n /** Dims and inerts the row. */\n disabled?: boolean\n /** Row size — height / padding / font. Defaults to `md`. */\n size?: ListItemSize\n /** Theme color for the selected tint and clickable hover. Defaults to `primary`. */\n color?: ThemeColor\n /** Render a different element/component — e.g. `'a'`, `'button'`, or a router `Link`. Defaults to `div`. */\n as?: ElementType\n /** Primary label / content. */\n children?: ReactNode\n}\n\n/**\n * A flexible, reusable list row: leading `icon`, a label (`children`) with optional `description`, and\n * a `trailing` slot. `clickable` turns it interactive (hover + keyboard when rendered as a plain\n * element), `selected` highlights it, `disabled` inerts it. Render as a link/button/router `Link` via\n * `as`. Designed to compose inside `List` — for menus, the sidebar, or a standalone styled list.\n */\nexport const ListItem = forwardRef<HTMLElement, ListItemProps>(function ListItem(\n {\n icon,\n description,\n trailing,\n selected = false,\n clickable = false,\n disabled = false,\n size: sizeProp,\n color = 'primary',\n as,\n className,\n style,\n children,\n onClick,\n onKeyDown,\n ...props\n },\n ref,\n) {\n // an explicit `size` wins; otherwise inherit a surrounding `List`'s size, falling back to `md`\n const listSize = useListSize()\n const size = sizeProp ?? listSize ?? 'md'\n const Component = (as ?? 'div') as ElementType\n // Anchors, buttons, and custom components (e.g. a router Link) carry their own click + keyboard\n // semantics — only a plain element needs the button role/tabIndex/Enter-Space shim.\n const handlesOwnInteraction =\n as === 'a' || as === 'button' || typeof as === 'function' || typeof as === 'object'\n const isDivButton = clickable && !handlesOwnInteraction\n\n const renderedIcon =\n icon == null ? null : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n <Icon name={icon as IconName} size={ICON_SIZE[size]} />\n ) : (\n icon\n )\n\n const handleKeyDown = (event: KeyboardEvent<HTMLElement>) => {\n if (isDivButton && !disabled && (event.key === 'Enter' || event.key === ' ')) {\n event.preventDefault()\n event.currentTarget.click()\n }\n onKeyDown?.(event)\n }\n\n return (\n <Component\n ref={ref}\n className={clsx(\n styles.item,\n styles[size],\n selected && styles.selected,\n clickable && styles.clickable,\n disabled && styles.disabled,\n className,\n )}\n style={{ '--tz-btn-rgb': `var(--tz-color-${color}-rgb)`, ...style } as CSSProperties}\n role={isDivButton ? 'button' : undefined}\n tabIndex={isDivButton ? (disabled ? -1 : 0) : undefined}\n aria-disabled={disabled || undefined}\n aria-current={selected || undefined}\n onClick={disabled ? undefined : onClick}\n onKeyDown={clickable ? handleKeyDown : onKeyDown}\n {...props}\n >\n {renderedIcon != null && <span className={styles.itemIcon}>{renderedIcon}</span>}\n {(children != null || description != null) && (\n <span className={styles.itemText}>\n {children != null && <span className={styles.itemLabel}>{children}</span>}\n {description != null && <span className={styles.itemDescription}>{description}</span>}\n </span>\n )}\n {trailing != null && <span className={styles.itemTrailing}>{trailing}</span>}\n </Component>\n )\n})\n"],"names":["ICON_NAME_SET","ICON_NAMES","ICON_SIZE","ListItem","forwardRef","icon","description","trailing","selected","clickable","disabled","sizeProp","color","as","className","style","children","onClick","onKeyDown","props","ref","listSize","useListSize","size","Component","isDivButton","renderedIcon","jsx","Icon","handleKeyDown","event","jsxs","clsx","styles"],"mappings":"skBAgBMA,EAAgB,IAAI,IAAYC,YAAU,EAK1CC,EAA+C,CAAE,GAAI,KAAM,GAAI,KAAM,GAAI,IAAA,EAkClEC,EAAWC,EAAAA,WAAuC,SAC7D,CACE,KAAAC,EACA,YAAAC,EACA,SAAAC,EACA,SAAAC,EAAW,GACX,UAAAC,EAAY,GACZ,SAAAC,EAAW,GACX,KAAMC,EACN,MAAAC,EAAQ,UACR,GAAAC,EACA,UAAAC,EACA,MAAAC,EACA,SAAAC,EACA,QAAAC,EACA,UAAAC,EACA,GAAGC,CACL,EACAC,EACA,CAEA,MAAMC,EAAWC,EAAAA,YAAA,EACXC,EAAOZ,GAAYU,GAAY,KAC/BG,EAAaX,GAAM,MAKnBY,EAAchB,GAAa,EAD/BI,IAAO,KAAOA,IAAO,UAAY,OAAOA,GAAO,YAAc,OAAOA,GAAO,UAGvEa,EACJrB,GAAQ,KAAO,KAAO,OAAOA,GAAS,UAAYL,EAAc,IAAIK,CAAI,EACtEsB,MAACC,EAAAA,MAAK,KAAMvB,EAAkB,KAAMH,EAAUqB,CAAI,EAAG,EAErDlB,EAGEwB,EAAiBC,GAAsC,CACvDL,GAAe,CAACf,IAAaoB,EAAM,MAAQ,SAAWA,EAAM,MAAQ,OACtEA,EAAM,eAAA,EACNA,EAAM,cAAc,MAAA,GAEtBZ,GAAA,MAAAA,EAAYY,EACd,EAEA,OACEC,EAAAA,KAACP,EAAA,CACC,IAAAJ,EACA,UAAWY,EAAAA,KACTC,EAAO,KACPA,EAAOV,CAAI,EACXf,GAAYyB,EAAO,SACnBxB,GAAawB,EAAO,UACpBvB,GAAYuB,EAAO,SACnBnB,CAAA,EAEF,MAAO,CAAE,eAAgB,kBAAkBF,CAAK,QAAS,GAAGG,CAAA,EAC5D,KAAMU,EAAc,SAAW,OAC/B,SAAUA,EAAef,EAAW,GAAK,EAAK,OAC9C,gBAAeA,GAAY,OAC3B,eAAcF,GAAY,OAC1B,QAASE,EAAW,OAAYO,EAChC,UAAWR,EAAYoB,EAAgBX,EACtC,GAAGC,EAEH,SAAA,CAAAO,GAAgB,MAAQC,EAAAA,IAAC,OAAA,CAAK,UAAWM,EAAO,SAAW,SAAAP,EAAa,GACvEV,GAAY,MAAQV,GAAe,cAClC,OAAA,CAAK,UAAW2B,EAAO,SACrB,SAAA,CAAAjB,GAAY,MAAQW,EAAAA,IAAC,OAAA,CAAK,UAAWM,EAAO,UAAY,SAAAjB,EAAS,EACjEV,GAAe,MAAQqB,EAAAA,IAAC,QAAK,UAAWM,EAAO,gBAAkB,SAAA3B,CAAA,CAAY,CAAA,EAChF,EAEDC,GAAY,MAAQoB,EAAAA,IAAC,QAAK,UAAWM,EAAO,aAAe,SAAA1B,CAAA,CAAS,CAAA,CAAA,CAAA,CAG3E,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const c=require("react/jsx-runtime"),d=require("react"),_=require("clsx"),q=require("./ConfigProvider-
|
|
2
|
-
//# sourceMappingURL=Loader-
|
|
1
|
+
"use strict";const c=require("react/jsx-runtime"),d=require("react"),_=require("clsx"),q=require("./ConfigProvider-C7DUWHrb.cjs"),i="_loader_qv0xq_2",u="_sm_qv0xq_16",m="_md_qv0xq_22",x="_lg_qv0xq_28",s={loader:i,"tz-loader-spin":"_tz-loader-spin_qv0xq_1",sm:u,md:m,lg:x},v=d.forwardRef(function({size:o="md",color:e,className:t,style:r,...a},l){const n=q.useT();return c.jsx("span",{ref:l,role:"status","aria-label":n("loader.label"),...a,className:_.clsx(s.loader,s[o],t),style:e?{color:`var(--tz-color-${e})`,...r}:r})});exports.Loader=v;
|
|
2
|
+
//# sourceMappingURL=Loader-53HFNMVX.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Loader-
|
|
1
|
+
{"version":3,"file":"Loader-53HFNMVX.cjs","sources":["../src/components/Loader/Loader.tsx"],"sourcesContent":["import { forwardRef, type CSSProperties, type HTMLAttributes } from 'react'\nimport { clsx } from 'clsx'\nimport { useT, type ThemeColor } from '../../theme'\nimport styles from './Loader.module.css'\n\nexport type LoaderSize = 'sm' | 'md' | 'lg'\n\nexport interface LoaderProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'color'> {\n /** Preset size — matches the Icon sizes: `sm` 14px · `md` 18px · `lg` 22px. Defaults to `md`. */\n size?: LoaderSize\n /** Theme palette token used to color the spinner. Omit to inherit the surrounding text color (`currentColor`). */\n color?: ThemeColor\n}\n\n/**\n * A circular spinner. Works standalone as a loading indicator or inside a\n * `Button`, where it inherits the button color via `currentColor` unless an\n * explicit `color` is given.\n */\nexport const Loader = forwardRef<HTMLSpanElement, LoaderProps>(function Loader(\n { size = 'md', color, className, style, ...props },\n ref,\n) {\n const t = useT()\n return (\n <span\n ref={ref}\n role=\"status\"\n aria-label={t('loader.label')}\n {...props}\n className={clsx(styles.loader, styles[size], className)}\n style={color ? ({ color: `var(--tz-color-${color})`, ...style } as CSSProperties) : style}\n />\n )\n})\n"],"names":["Loader","forwardRef","size","color","className","style","props","ref","t","useT","jsx","clsx","styles"],"mappings":"gRAmBaA,EAASC,EAAAA,WAAyC,SAC7D,CAAE,KAAAC,EAAO,KAAM,MAAAC,EAAO,UAAAC,EAAW,MAAAC,EAAO,GAAGC,CAAA,EAC3CC,EACA,CACA,MAAMC,EAAIC,EAAAA,KAAA,EACV,OACEC,EAAAA,IAAC,OAAA,CACC,IAAAH,EACA,KAAK,SACL,aAAYC,EAAE,cAAc,EAC3B,GAAGF,EACJ,UAAWK,EAAAA,KAAKC,EAAO,OAAQA,EAAOV,CAAI,EAAGE,CAAS,EACtD,MAAOD,EAAS,CAAE,MAAO,kBAAkBA,CAAK,IAAK,GAAGE,GAA4BA,CAAA,CAAA,CAG1F,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _ } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef as d } from "react";
|
|
3
3
|
import { clsx as n } from "clsx";
|
|
4
|
-
import { a as c } from "./ConfigProvider-
|
|
4
|
+
import { a as c } from "./ConfigProvider-DT0yrgmd.js";
|
|
5
5
|
const q = "_loader_qv0xq_2", i = "_sm_qv0xq_16", p = "_md_qv0xq_22", x = "_lg_qv0xq_28", s = {
|
|
6
6
|
loader: q,
|
|
7
7
|
"tz-loader-spin": "_tz-loader-spin_qv0xq_1",
|
|
@@ -25,4 +25,4 @@ const q = "_loader_qv0xq_2", i = "_sm_qv0xq_16", p = "_md_qv0xq_22", x = "_lg_qv
|
|
|
25
25
|
export {
|
|
26
26
|
L
|
|
27
27
|
};
|
|
28
|
-
//# sourceMappingURL=Loader-
|
|
28
|
+
//# sourceMappingURL=Loader-WsjQFl4p.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Loader-
|
|
1
|
+
{"version":3,"file":"Loader-WsjQFl4p.js","sources":["../src/components/Loader/Loader.tsx"],"sourcesContent":["import { forwardRef, type CSSProperties, type HTMLAttributes } from 'react'\nimport { clsx } from 'clsx'\nimport { useT, type ThemeColor } from '../../theme'\nimport styles from './Loader.module.css'\n\nexport type LoaderSize = 'sm' | 'md' | 'lg'\n\nexport interface LoaderProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'color'> {\n /** Preset size — matches the Icon sizes: `sm` 14px · `md` 18px · `lg` 22px. Defaults to `md`. */\n size?: LoaderSize\n /** Theme palette token used to color the spinner. Omit to inherit the surrounding text color (`currentColor`). */\n color?: ThemeColor\n}\n\n/**\n * A circular spinner. Works standalone as a loading indicator or inside a\n * `Button`, where it inherits the button color via `currentColor` unless an\n * explicit `color` is given.\n */\nexport const Loader = forwardRef<HTMLSpanElement, LoaderProps>(function Loader(\n { size = 'md', color, className, style, ...props },\n ref,\n) {\n const t = useT()\n return (\n <span\n ref={ref}\n role=\"status\"\n aria-label={t('loader.label')}\n {...props}\n className={clsx(styles.loader, styles[size], className)}\n style={color ? ({ color: `var(--tz-color-${color})`, ...style } as CSSProperties) : style}\n />\n )\n})\n"],"names":["Loader","forwardRef","size","color","className","style","props","ref","t","useT","jsx","clsx","styles"],"mappings":";;;;;;;;;;GAmBaA,IAASC,EAAyC,SAC7D,EAAE,MAAAC,IAAO,MAAM,OAAAC,GAAO,WAAAC,GAAW,OAAAC,GAAO,GAAGC,EAAA,GAC3CC,GACA;AACA,QAAMC,IAAIC,EAAA;AACV,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAH;AAAA,MACA,MAAK;AAAA,MACL,cAAYC,EAAE,cAAc;AAAA,MAC3B,GAAGF;AAAA,MACJ,WAAWK,EAAKC,EAAO,QAAQA,EAAOV,CAAI,GAAGE,CAAS;AAAA,MACtD,OAAOD,IAAS,EAAE,OAAO,kBAAkBA,CAAK,KAAK,GAAGE,MAA4BA;AAAA,IAAA;AAAA,EAAA;AAG1F,CAAC;"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { jsx as r, jsxs as S } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef as U, useRef as p, useState as Y, useEffect as V, useId as $ } from "react";
|
|
3
3
|
import { clsx as P } from "clsx";
|
|
4
|
-
import { a as Z } from "./names-
|
|
5
|
-
import { I as H } from "./Icon-
|
|
6
|
-
import { I as K } from "./IconButton-
|
|
4
|
+
import { a as Z } from "./names-r21QPjcU.js";
|
|
5
|
+
import { I as H } from "./Icon-DaTvzLBu.js";
|
|
6
|
+
import { I as K } from "./IconButton-DXMmtuLA.js";
|
|
7
7
|
import { createPortal as w } from "react-dom";
|
|
8
8
|
import { u as C } from "./useLockBodyScroll-DwBILLPK.js";
|
|
9
|
-
import { a as ee } from "./ConfigProvider-
|
|
9
|
+
import { a as ee } from "./ConfigProvider-DT0yrgmd.js";
|
|
10
10
|
const te = "_overlay_gwv2a_6", ae = {
|
|
11
11
|
overlay: te
|
|
12
12
|
}, re = U(function({
|
|
@@ -192,4 +192,4 @@ export {
|
|
|
192
192
|
Ae as M,
|
|
193
193
|
re as O
|
|
194
194
|
};
|
|
195
|
-
//# sourceMappingURL=Modal-
|
|
195
|
+
//# sourceMappingURL=Modal-DBYcoCbJ.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal-Us_E-lb2.js","sources":["../src/components/Overlay/Overlay.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import {\n forwardRef,\n useEffect,\n useRef,\n useState,\n type CSSProperties,\n type HTMLAttributes,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport { clsx } from 'clsx'\nimport { useLockBodyScroll } from '../../hooks/useLockBodyScroll'\nimport styles from './Overlay.module.css'\n\nexport interface OverlayProps extends HTMLAttributes<HTMLDivElement> {\n /** Whether the overlay is mounted + shown — gates the portal and drives the fade-in. */\n open: boolean\n /** Requested dismiss — fired on a backdrop click (`closeOnBackdrop`) or Escape (`closeOnEscape`). */\n onClose?: () => void\n /** Close when the scrim itself (outside the content) is clicked. Defaults to `true`. */\n closeOnBackdrop?: boolean\n /** Close when Escape is pressed while focus is within the overlay. Defaults to `true`. */\n closeOnEscape?: boolean\n /** Lock page scroll while open. Defaults to `true`. */\n lockScroll?: boolean\n /** Scrim darkness — the black backdrop's alpha (0–1). Defaults to `0.45`. */\n dim?: number\n /** Overlay content — typically a centered dialog / box / media. */\n children?: ReactNode\n}\n\n/**\n * The shared backdrop primitive behind every dimmed, page-blocking surface (`Modal`, the FileUploader\n * lightbox). Portals a fixed full-viewport scrim to `<body>`, locks page scroll, fades in (opacity keyed\n * off a rAF `visible` flag → `data-open`), and dismisses on **backdrop-click** (gated on the pointer-down\n * AND click both landing on the scrim, so a text-selection drag ending on it doesn't close) / **Escape**\n * (swallowed via `stopPropagation` so it can't reach a React-tree ancestor overlay). Centers its children\n * by default; consumers layer their own padding / scroll / placement via `className` + `data-*` and read\n * the shared `data-open` on the scrim for their own box's enter transform. A consumer `onKeyDown` still\n * fires (after the Escape handling) so it can add e.g. a Tab focus-trap. Internal — no `index.ts`, so it's\n * never exposed as a package subpath; import it via `../Overlay/Overlay`. The ref points at the scrim div.\n */\nexport const Overlay = forwardRef<HTMLDivElement, OverlayProps>(function Overlay(\n {\n open,\n onClose,\n closeOnBackdrop = true,\n closeOnEscape = true,\n lockScroll = true,\n dim,\n className,\n style,\n children,\n onKeyDown,\n onMouseDown,\n onClick,\n ...props\n },\n ref,\n) {\n const mouseDownTarget = useRef<EventTarget | null>(null)\n const [visible, setVisible] = useState(false)\n\n useLockBodyScroll(open && lockScroll)\n\n // enter animation: flip `visible` on the frame after mount so the opacity transition runs\n useEffect(() => {\n if (!open) {\n setVisible(false)\n return\n }\n const raf = requestAnimationFrame(() => setVisible(true))\n return () => cancelAnimationFrame(raf)\n }, [open])\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Escape') {\n // the overlay owns the page — swallow Escape so it can't reach a React-tree ancestor overlay (e.g.\n // an outer Modal) even when this one isn't Escape-dismissible\n event.stopPropagation()\n if (closeOnEscape) onClose?.()\n }\n onKeyDown?.(event)\n }\n // remember where the pointer went down so the click handler can tell a scrim click from a drag that\n // started inside the content and ended on the scrim (a text-selection drag)\n const handleMouseDown = (event: MouseEvent<HTMLDivElement>) => {\n mouseDownTarget.current = event.target\n onMouseDown?.(event)\n }\n const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n if (\n closeOnBackdrop &&\n event.target === event.currentTarget &&\n mouseDownTarget.current === event.currentTarget\n ) {\n onClose?.()\n }\n onClick?.(event)\n }\n\n if (!open || typeof document === 'undefined') return null\n\n return createPortal(\n <div\n ref={ref}\n className={clsx(styles.overlay, className)}\n data-open={visible ? 'true' : 'false'}\n style={dim != null ? ({ '--tz-overlay-dim': dim, ...style } as CSSProperties) : style}\n onKeyDown={handleKeyDown}\n onMouseDown={handleMouseDown}\n onClick={handleClick}\n {...props}\n >\n {children}\n </div>,\n document.body,\n )\n})\n","import {\n forwardRef,\n useEffect,\n useId,\n useRef,\n type CSSProperties,\n type HTMLAttributes,\n type KeyboardEvent,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { useT, type ThemeColor } from '../../theme'\nimport { Icon } from '../Icon'\nimport { IconButton } from '../IconButton'\nimport { Overlay } from '../Overlay/Overlay'\nimport styles from './Modal.module.css'\n\nexport type ModalSize = 'sm' | 'md' | 'lg' | 'fullScreen'\nexport type ModalScrollBehavior = 'inside' | 'outside'\nexport type ModalPlacement = 'center' | 'left' | 'right'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\n/** Focusable descendants used by the focus trap + initial focus. */\n// every clause excludes tabindex=\"-1\" so decorative/programmatic-only nodes (e.g. the header's\n// `nonClickable aria-hidden` IconButton) don't count as trap boundaries or initial-focus targets\nconst FOCUSABLE =\n 'a[href]:not([tabindex=\"-1\"]), button:not(:disabled):not([tabindex=\"-1\"]), textarea:not(:disabled):not([tabindex=\"-1\"]), input:not(:disabled):not([tabindex=\"-1\"]), select:not(:disabled):not([tabindex=\"-1\"]), [tabindex]:not([tabindex=\"-1\"])'\n\nexport interface ModalProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'color'> {\n /** Whether the modal is open — gates the portal and drives the enter animation. */\n open: boolean\n /** Called when a dismiss is requested (close button, backdrop click, or Escape). */\n onClose: () => void\n /** Preset width: `sm` 360 · `md` 620 · `lg` 900 px, or `fullScreen` (fills the viewport). Defaults to `md`. */\n size?: ModalSize\n /**\n * Where overflow scrolls when the content is taller than the viewport: `outside` (default — the\n * whole dialog grows and the overlay/page scrolls) or `inside` (the body scrolls while the header +\n * footer stay pinned). Ignored for side-drawer placements (`left`/`right`), which always scroll inside.\n */\n scrollBehavior?: ModalScrollBehavior\n /**\n * Where the dialog sits: `center` (default — the standard centered modal), or `left` / `right` to\n * make it a **full-height side drawer** (sheet) that slides in from that edge. A drawer takes its\n * width from `size`, fills the viewport height, and always scrolls its body inside (header + footer\n * stay pinned).\n */\n placement?: ModalPlacement\n /** Header title. When set, labels the dialog (`aria-labelledby`). */\n title?: ReactNode\n /** Muted description line under the title (e.g. a confirm prompt). */\n description?: ReactNode\n /** Leading header icon shown in a tinted box (like `Card`) — a known `IconName` or any node. */\n icon?: IconName | ReactNode\n /** Theme color that tints the leading icon box. Defaults to `accent`. */\n color?: ThemeColor\n /** Footer slot — right-aligned actions over a top divider (e.g. Cancel / Confirm buttons). */\n footer?: ReactNode\n /** Show the header × close button. Defaults to `true`. */\n showCloseButton?: boolean\n /** Close when the backdrop (outside the dialog) is clicked. Defaults to `true`. */\n closeOnBackdrop?: boolean\n /** Close when Escape is pressed. Defaults to `true`. */\n closeOnEscape?: boolean\n /** Accessible label — used when there's no `title`. */\n ariaLabel?: string\n /** Dialog body. */\n children?: ReactNode\n}\n\n/**\n * A centered, backdrop-dimmed overlay dialog. Portaled to `<body>`, it locks page scroll while open,\n * traps Tab focus inside, restores focus to the previously-focused element on close, and dismisses on\n * close button / backdrop click / Escape (each toggleable). Sizes are `sm`/`md`/`lg` (max-width caps)\n * or `fullScreen`; `scrollBehavior` picks inside-body vs. whole-dialog scrolling. `placement` turns it\n * into a full-height side drawer (`left`/`right`) that slides in from the edge. The header mirrors\n * `Card` — an optional tinted `icon` box + `title` + `description`. Controlled by `open` + `onClose`.\n * The forwarded ref points at the dialog element.\n *\n * @example\n * const { isOpen, open, close } = useDisclosure()\n * <Modal open={isOpen} onClose={close} title=\"Edit\" footer={<Button onClick={close}>Done</Button>}>\n * …\n * </Modal>\n */\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(function Modal(\n {\n open,\n onClose,\n size = 'md',\n scrollBehavior = 'outside',\n placement = 'center',\n title,\n description,\n icon,\n color = 'accent',\n footer,\n showCloseButton = true,\n closeOnBackdrop = true,\n closeOnEscape = true,\n ariaLabel,\n className,\n style,\n children,\n ...props\n },\n forwardedRef,\n) {\n const t = useT()\n const panelRef = useRef<HTMLDivElement | null>(null)\n const bodyRef = useRef<HTMLDivElement | null>(null)\n const footerRef = useRef<HTMLDivElement | null>(null)\n const titleId = useId()\n const descId = useId()\n\n // portal + scrim + scroll-lock + fade-in + backdrop-dismiss are handled by the shared `<Overlay>`\n\n // focus management: move focus into the dialog on open — prefer a body field (form modals land on\n // their first input), else the first footer action (confirm dialogs land on Cancel/Confirm, not the\n // × button), else any control, else the dialog itself; restore focus to the trigger on close\n useEffect(() => {\n if (!open) return\n const previouslyFocused = document.activeElement as HTMLElement | null\n const target =\n bodyRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n footerRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n panelRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n panelRef.current\n // preventScroll so opening an `outside`-scroll modal doesn't jump the overlay to a below-fold control\n target?.focus({ preventScroll: true })\n // only restore if the element is still mounted (it may have unmounted while the modal was open)\n return () => {\n if (previouslyFocused?.isConnected) previouslyFocused.focus?.()\n }\n }, [open])\n\n // merge the panel ref (positioning/focus) with the forwarded ref (consumer access)\n const setPanelRef = (node: HTMLDivElement | null) => {\n panelRef.current = node\n if (typeof forwardedRef === 'function') forwardedRef(node)\n else if (forwardedRef) forwardedRef.current = node\n }\n\n // trap Tab within the dialog so focus can't strand on the locked page behind it (Escape + backdrop\n // dismissal live in `<Overlay>`; this fires after the overlay's own handler)\n const handleTabTrap = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key !== 'Tab') return\n const panel = panelRef.current\n if (!panel) return\n const focusables = [...panel.querySelectorAll<HTMLElement>(FOCUSABLE)].filter(\n (el) => el.offsetParent !== null || el === document.activeElement,\n )\n if (focusables.length === 0) {\n event.preventDefault()\n panel.focus()\n return\n }\n const first = focusables[0]\n const last = focusables[focusables.length - 1]\n const active = document.activeElement\n if (event.shiftKey && (active === first || active === panel)) {\n event.preventDefault()\n last.focus()\n } else if (!event.shiftKey && active === last) {\n event.preventDefault()\n first.focus()\n }\n }\n\n if (!open) return null\n\n // a side drawer (left/right) is always full-height with the body scrolling inside (header/footer pinned)\n const isDrawer = placement !== 'center'\n\n const renderedIcon =\n icon == null ? null : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n <Icon name={icon as IconName} />\n ) : (\n icon\n )\n\n const hasHeader = title != null || description != null || renderedIcon != null || showCloseButton\n // a divider sets the header apart from the body/footer, like Card\n const headerDivided = children != null || footer != null\n\n return (\n <Overlay\n open={open}\n onClose={onClose}\n closeOnBackdrop={closeOnBackdrop}\n closeOnEscape={closeOnEscape}\n onKeyDown={handleTabTrap}\n className={styles.overlay}\n data-size={size}\n data-placement={placement}\n data-scroll={isDrawer ? 'inside' : scrollBehavior}\n >\n <div\n ref={setPanelRef}\n className={clsx(styles.modal, styles[size], className)}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={title != null ? titleId : undefined}\n aria-label={title == null ? ariaLabel : undefined}\n aria-describedby={description != null ? descId : undefined}\n tabIndex={-1}\n style={style as CSSProperties}\n {...props}\n >\n {hasHeader && (\n <div className={clsx(styles.header, headerDivided && styles.headerDivided)}>\n <div className={styles.headerMain}>\n {renderedIcon != null && (\n <IconButton\n variant=\"filled\"\n size=\"sm\"\n color={color}\n nonClickable\n aria-hidden\n className={styles.icon}\n >\n {renderedIcon}\n </IconButton>\n )}\n {(title != null || description != null) && (\n <div className={styles.headerText}>\n {title != null && (\n <div id={titleId} className={styles.title}>\n {title}\n </div>\n )}\n {description != null && (\n <div id={descId} className={styles.subtitle}>\n {description}\n </div>\n )}\n </div>\n )}\n </div>\n {showCloseButton && (\n <IconButton\n variant=\"filled\"\n color=\"primary\"\n size=\"sm\"\n className={styles.close}\n aria-label={t('common.close')}\n onClick={onClose}\n >\n <Icon name=\"Close\" />\n </IconButton>\n )}\n </div>\n )}\n {children != null && (\n <div ref={bodyRef} className={styles.body}>\n {children}\n </div>\n )}\n {footer != null && (\n <div ref={footerRef} className={styles.footer}>\n {footer}\n </div>\n )}\n </div>\n </Overlay>\n )\n})\n"],"names":["Overlay","forwardRef","open","onClose","closeOnBackdrop","closeOnEscape","lockScroll","dim","className","style","children","onKeyDown","onMouseDown","onClick","props","ref","mouseDownTarget","useRef","visible","setVisible","useState","useLockBodyScroll","useEffect","raf","handleKeyDown","event","handleMouseDown","handleClick","createPortal","jsx","clsx","styles","ICON_NAME_SET","ICON_NAMES","FOCUSABLE","Modal","size","scrollBehavior","placement","title","description","icon","color","footer","showCloseButton","ariaLabel","forwardedRef","t","useT","panelRef","bodyRef","footerRef","titleId","useId","descId","previouslyFocused","target","_a","_b","_c","setPanelRef","node","handleTabTrap","panel","focusables","el","first","last","active","isDrawer","renderedIcon","Icon","hasHeader","headerDivided","jsxs","IconButton"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Modal-DBYcoCbJ.js","sources":["../src/components/Overlay/Overlay.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import {\n forwardRef,\n useEffect,\n useRef,\n useState,\n type CSSProperties,\n type HTMLAttributes,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport { clsx } from 'clsx'\nimport { useLockBodyScroll } from '../../hooks/useLockBodyScroll'\nimport styles from './Overlay.module.css'\n\nexport interface OverlayProps extends HTMLAttributes<HTMLDivElement> {\n /** Whether the overlay is mounted + shown — gates the portal and drives the fade-in. */\n open: boolean\n /** Requested dismiss — fired on a backdrop click (`closeOnBackdrop`) or Escape (`closeOnEscape`). */\n onClose?: () => void\n /** Close when the scrim itself (outside the content) is clicked. Defaults to `true`. */\n closeOnBackdrop?: boolean\n /** Close when Escape is pressed while focus is within the overlay. Defaults to `true`. */\n closeOnEscape?: boolean\n /** Lock page scroll while open. Defaults to `true`. */\n lockScroll?: boolean\n /** Scrim darkness — the black backdrop's alpha (0–1). Defaults to `0.45`. */\n dim?: number\n /** Overlay content — typically a centered dialog / box / media. */\n children?: ReactNode\n}\n\n/**\n * The shared backdrop primitive behind every dimmed, page-blocking surface (`Modal`, the FileUploader\n * lightbox). Portals a fixed full-viewport scrim to `<body>`, locks page scroll, fades in (opacity keyed\n * off a rAF `visible` flag → `data-open`), and dismisses on **backdrop-click** (gated on the pointer-down\n * AND click both landing on the scrim, so a text-selection drag ending on it doesn't close) / **Escape**\n * (swallowed via `stopPropagation` so it can't reach a React-tree ancestor overlay). Centers its children\n * by default; consumers layer their own padding / scroll / placement via `className` + `data-*` and read\n * the shared `data-open` on the scrim for their own box's enter transform. A consumer `onKeyDown` still\n * fires (after the Escape handling) so it can add e.g. a Tab focus-trap. Internal — no `index.ts`, so it's\n * never exposed as a package subpath; import it via `../Overlay/Overlay`. The ref points at the scrim div.\n */\nexport const Overlay = forwardRef<HTMLDivElement, OverlayProps>(function Overlay(\n {\n open,\n onClose,\n closeOnBackdrop = true,\n closeOnEscape = true,\n lockScroll = true,\n dim,\n className,\n style,\n children,\n onKeyDown,\n onMouseDown,\n onClick,\n ...props\n },\n ref,\n) {\n const mouseDownTarget = useRef<EventTarget | null>(null)\n const [visible, setVisible] = useState(false)\n\n useLockBodyScroll(open && lockScroll)\n\n // enter animation: flip `visible` on the frame after mount so the opacity transition runs\n useEffect(() => {\n if (!open) {\n setVisible(false)\n return\n }\n const raf = requestAnimationFrame(() => setVisible(true))\n return () => cancelAnimationFrame(raf)\n }, [open])\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Escape') {\n // the overlay owns the page — swallow Escape so it can't reach a React-tree ancestor overlay (e.g.\n // an outer Modal) even when this one isn't Escape-dismissible\n event.stopPropagation()\n if (closeOnEscape) onClose?.()\n }\n onKeyDown?.(event)\n }\n // remember where the pointer went down so the click handler can tell a scrim click from a drag that\n // started inside the content and ended on the scrim (a text-selection drag)\n const handleMouseDown = (event: MouseEvent<HTMLDivElement>) => {\n mouseDownTarget.current = event.target\n onMouseDown?.(event)\n }\n const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n if (\n closeOnBackdrop &&\n event.target === event.currentTarget &&\n mouseDownTarget.current === event.currentTarget\n ) {\n onClose?.()\n }\n onClick?.(event)\n }\n\n if (!open || typeof document === 'undefined') return null\n\n return createPortal(\n <div\n ref={ref}\n className={clsx(styles.overlay, className)}\n data-open={visible ? 'true' : 'false'}\n style={dim != null ? ({ '--tz-overlay-dim': dim, ...style } as CSSProperties) : style}\n onKeyDown={handleKeyDown}\n onMouseDown={handleMouseDown}\n onClick={handleClick}\n {...props}\n >\n {children}\n </div>,\n document.body,\n )\n})\n","import {\n forwardRef,\n useEffect,\n useId,\n useRef,\n type CSSProperties,\n type HTMLAttributes,\n type KeyboardEvent,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { useT, type ThemeColor } from '../../theme'\nimport { Icon } from '../Icon'\nimport { IconButton } from '../IconButton'\nimport { Overlay } from '../Overlay/Overlay'\nimport styles from './Modal.module.css'\n\nexport type ModalSize = 'sm' | 'md' | 'lg' | 'fullScreen'\nexport type ModalScrollBehavior = 'inside' | 'outside'\nexport type ModalPlacement = 'center' | 'left' | 'right'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\n/** Focusable descendants used by the focus trap + initial focus. */\n// every clause excludes tabindex=\"-1\" so decorative/programmatic-only nodes (e.g. the header's\n// `nonClickable aria-hidden` IconButton) don't count as trap boundaries or initial-focus targets\nconst FOCUSABLE =\n 'a[href]:not([tabindex=\"-1\"]), button:not(:disabled):not([tabindex=\"-1\"]), textarea:not(:disabled):not([tabindex=\"-1\"]), input:not(:disabled):not([tabindex=\"-1\"]), select:not(:disabled):not([tabindex=\"-1\"]), [tabindex]:not([tabindex=\"-1\"])'\n\nexport interface ModalProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'color'> {\n /** Whether the modal is open — gates the portal and drives the enter animation. */\n open: boolean\n /** Called when a dismiss is requested (close button, backdrop click, or Escape). */\n onClose: () => void\n /** Preset width: `sm` 360 · `md` 620 · `lg` 900 px, or `fullScreen` (fills the viewport). Defaults to `md`. */\n size?: ModalSize\n /**\n * Where overflow scrolls when the content is taller than the viewport: `outside` (default — the\n * whole dialog grows and the overlay/page scrolls) or `inside` (the body scrolls while the header +\n * footer stay pinned). Ignored for side-drawer placements (`left`/`right`), which always scroll inside.\n */\n scrollBehavior?: ModalScrollBehavior\n /**\n * Where the dialog sits: `center` (default — the standard centered modal), or `left` / `right` to\n * make it a **full-height side drawer** (sheet) that slides in from that edge. A drawer takes its\n * width from `size`, fills the viewport height, and always scrolls its body inside (header + footer\n * stay pinned).\n */\n placement?: ModalPlacement\n /** Header title. When set, labels the dialog (`aria-labelledby`). */\n title?: ReactNode\n /** Muted description line under the title (e.g. a confirm prompt). */\n description?: ReactNode\n /** Leading header icon shown in a tinted box (like `Card`) — a known `IconName` or any node. */\n icon?: IconName | ReactNode\n /** Theme color that tints the leading icon box. Defaults to `accent`. */\n color?: ThemeColor\n /** Footer slot — right-aligned actions over a top divider (e.g. Cancel / Confirm buttons). */\n footer?: ReactNode\n /** Show the header × close button. Defaults to `true`. */\n showCloseButton?: boolean\n /** Close when the backdrop (outside the dialog) is clicked. Defaults to `true`. */\n closeOnBackdrop?: boolean\n /** Close when Escape is pressed. Defaults to `true`. */\n closeOnEscape?: boolean\n /** Accessible label — used when there's no `title`. */\n ariaLabel?: string\n /** Dialog body. */\n children?: ReactNode\n}\n\n/**\n * A centered, backdrop-dimmed overlay dialog. Portaled to `<body>`, it locks page scroll while open,\n * traps Tab focus inside, restores focus to the previously-focused element on close, and dismisses on\n * close button / backdrop click / Escape (each toggleable). Sizes are `sm`/`md`/`lg` (max-width caps)\n * or `fullScreen`; `scrollBehavior` picks inside-body vs. whole-dialog scrolling. `placement` turns it\n * into a full-height side drawer (`left`/`right`) that slides in from the edge. The header mirrors\n * `Card` — an optional tinted `icon` box + `title` + `description`. Controlled by `open` + `onClose`.\n * The forwarded ref points at the dialog element.\n *\n * @example\n * const { isOpen, open, close } = useDisclosure()\n * <Modal open={isOpen} onClose={close} title=\"Edit\" footer={<Button onClick={close}>Done</Button>}>\n * …\n * </Modal>\n */\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(function Modal(\n {\n open,\n onClose,\n size = 'md',\n scrollBehavior = 'outside',\n placement = 'center',\n title,\n description,\n icon,\n color = 'accent',\n footer,\n showCloseButton = true,\n closeOnBackdrop = true,\n closeOnEscape = true,\n ariaLabel,\n className,\n style,\n children,\n ...props\n },\n forwardedRef,\n) {\n const t = useT()\n const panelRef = useRef<HTMLDivElement | null>(null)\n const bodyRef = useRef<HTMLDivElement | null>(null)\n const footerRef = useRef<HTMLDivElement | null>(null)\n const titleId = useId()\n const descId = useId()\n\n // portal + scrim + scroll-lock + fade-in + backdrop-dismiss are handled by the shared `<Overlay>`\n\n // focus management: move focus into the dialog on open — prefer a body field (form modals land on\n // their first input), else the first footer action (confirm dialogs land on Cancel/Confirm, not the\n // × button), else any control, else the dialog itself; restore focus to the trigger on close\n useEffect(() => {\n if (!open) return\n const previouslyFocused = document.activeElement as HTMLElement | null\n const target =\n bodyRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n footerRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n panelRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n panelRef.current\n // preventScroll so opening an `outside`-scroll modal doesn't jump the overlay to a below-fold control\n target?.focus({ preventScroll: true })\n // only restore if the element is still mounted (it may have unmounted while the modal was open)\n return () => {\n if (previouslyFocused?.isConnected) previouslyFocused.focus?.()\n }\n }, [open])\n\n // merge the panel ref (positioning/focus) with the forwarded ref (consumer access)\n const setPanelRef = (node: HTMLDivElement | null) => {\n panelRef.current = node\n if (typeof forwardedRef === 'function') forwardedRef(node)\n else if (forwardedRef) forwardedRef.current = node\n }\n\n // trap Tab within the dialog so focus can't strand on the locked page behind it (Escape + backdrop\n // dismissal live in `<Overlay>`; this fires after the overlay's own handler)\n const handleTabTrap = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key !== 'Tab') return\n const panel = panelRef.current\n if (!panel) return\n const focusables = [...panel.querySelectorAll<HTMLElement>(FOCUSABLE)].filter(\n (el) => el.offsetParent !== null || el === document.activeElement,\n )\n if (focusables.length === 0) {\n event.preventDefault()\n panel.focus()\n return\n }\n const first = focusables[0]\n const last = focusables[focusables.length - 1]\n const active = document.activeElement\n if (event.shiftKey && (active === first || active === panel)) {\n event.preventDefault()\n last.focus()\n } else if (!event.shiftKey && active === last) {\n event.preventDefault()\n first.focus()\n }\n }\n\n if (!open) return null\n\n // a side drawer (left/right) is always full-height with the body scrolling inside (header/footer pinned)\n const isDrawer = placement !== 'center'\n\n const renderedIcon =\n icon == null ? null : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n <Icon name={icon as IconName} />\n ) : (\n icon\n )\n\n const hasHeader = title != null || description != null || renderedIcon != null || showCloseButton\n // a divider sets the header apart from the body/footer, like Card\n const headerDivided = children != null || footer != null\n\n return (\n <Overlay\n open={open}\n onClose={onClose}\n closeOnBackdrop={closeOnBackdrop}\n closeOnEscape={closeOnEscape}\n onKeyDown={handleTabTrap}\n className={styles.overlay}\n data-size={size}\n data-placement={placement}\n data-scroll={isDrawer ? 'inside' : scrollBehavior}\n >\n <div\n ref={setPanelRef}\n className={clsx(styles.modal, styles[size], className)}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={title != null ? titleId : undefined}\n aria-label={title == null ? ariaLabel : undefined}\n aria-describedby={description != null ? descId : undefined}\n tabIndex={-1}\n style={style as CSSProperties}\n {...props}\n >\n {hasHeader && (\n <div className={clsx(styles.header, headerDivided && styles.headerDivided)}>\n <div className={styles.headerMain}>\n {renderedIcon != null && (\n <IconButton\n variant=\"filled\"\n size=\"sm\"\n color={color}\n nonClickable\n aria-hidden\n className={styles.icon}\n >\n {renderedIcon}\n </IconButton>\n )}\n {(title != null || description != null) && (\n <div className={styles.headerText}>\n {title != null && (\n <div id={titleId} className={styles.title}>\n {title}\n </div>\n )}\n {description != null && (\n <div id={descId} className={styles.subtitle}>\n {description}\n </div>\n )}\n </div>\n )}\n </div>\n {showCloseButton && (\n <IconButton\n variant=\"filled\"\n color=\"primary\"\n size=\"sm\"\n className={styles.close}\n aria-label={t('common.close')}\n onClick={onClose}\n >\n <Icon name=\"Close\" />\n </IconButton>\n )}\n </div>\n )}\n {children != null && (\n <div ref={bodyRef} className={styles.body}>\n {children}\n </div>\n )}\n {footer != null && (\n <div ref={footerRef} className={styles.footer}>\n {footer}\n </div>\n )}\n </div>\n </Overlay>\n )\n})\n"],"names":["Overlay","forwardRef","open","onClose","closeOnBackdrop","closeOnEscape","lockScroll","dim","className","style","children","onKeyDown","onMouseDown","onClick","props","ref","mouseDownTarget","useRef","visible","setVisible","useState","useLockBodyScroll","useEffect","raf","handleKeyDown","event","handleMouseDown","handleClick","createPortal","jsx","clsx","styles","ICON_NAME_SET","ICON_NAMES","FOCUSABLE","Modal","size","scrollBehavior","placement","title","description","icon","color","footer","showCloseButton","ariaLabel","forwardedRef","t","useT","panelRef","bodyRef","footerRef","titleId","useId","descId","previouslyFocused","target","_a","_b","_c","setPanelRef","node","handleTabTrap","panel","focusables","el","first","last","active","isDrawer","renderedIcon","Icon","hasHeader","headerDivided","jsxs","IconButton"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const r=require("react/jsx-runtime"),l=require("react"),A=require("clsx"),Q=require("./names-
|
|
2
|
-
//# sourceMappingURL=Modal-
|
|
1
|
+
"use strict";const r=require("react/jsx-runtime"),l=require("react"),A=require("clsx"),Q=require("./names-BJnFU_5m.cjs"),L=require("./Icon-BVULqOJD.cjs"),$=require("./IconButton-Lv0sDDR9.cjs"),W=require("react-dom"),X=require("./useLockBodyScroll-CIXHZo-Q.cjs"),Y=require("./ConfigProvider-C7DUWHrb.cjs"),Z="_overlay_gwv2a_6",w={overlay:Z},H=l.forwardRef(function({open:a,onClose:s,closeOnBackdrop:k=!0,closeOnEscape:g=!0,lockScroll:N=!0,dim:c,className:i,style:d,children:q,onKeyDown:u,onMouseDown:_,onClick:x,...I},T){const j=l.useRef(null),[E,m]=l.useState(!1);X.useLockBodyScroll(a&&N),l.useEffect(()=>{if(!a){m(!1);return}const e=requestAnimationFrame(()=>m(!0));return()=>cancelAnimationFrame(e)},[a]);const D=e=>{e.key==="Escape"&&(e.stopPropagation(),g&&(s==null||s())),u==null||u(e)},h=e=>{j.current=e.target,_==null||_(e)},R=e=>{k&&e.target===e.currentTarget&&j.current===e.currentTarget&&(s==null||s()),x==null||x(e)};return!a||typeof document>"u"?null:W.createPortal(r.jsx("div",{ref:T,className:A.clsx(w.overlay,i),"data-open":E?"true":"false",style:c!=null?{"--tz-overlay-dim":c,...d}:d,onKeyDown:D,onMouseDown:h,onClick:R,...I,children:q}),document.body)}),C="_overlay_1d22k_3",ee="_modal_1d22k_14",te="_sm_1d22k_37",re="_md_1d22k_40",ne="_lg_1d22k_43",le="_fullScreen_1d22k_46",ae="_header_1d22k_58",se="_headerDivided_1d22k_67",ce="_headerMain_1d22k_70",de="_icon_1d22k_77",oe="_headerText_1d22k_80",ie="_title_1d22k_87",ue="_subtitle_1d22k_99",fe="_close_1d22k_111",_e="_body_1d22k_116",me="_footer_1d22k_124",n={overlay:C,modal:ee,sm:te,md:re,lg:ne,fullScreen:le,header:ae,headerDivided:se,headerMain:ce,icon:de,headerText:oe,title:ie,subtitle:ue,close:fe,body:_e,footer:me},he=new Set(Q.ICON_NAMES),S='a[href]:not([tabindex="-1"]), button:not(:disabled):not([tabindex="-1"]), textarea:not(:disabled):not([tabindex="-1"]), input:not(:disabled):not([tabindex="-1"]), select:not(:disabled):not([tabindex="-1"]), [tabindex]:not([tabindex="-1"])',be=l.forwardRef(function({open:a,onClose:s,size:k="md",scrollBehavior:g="outside",placement:N="center",title:c,description:i,icon:d,color:q="accent",footer:u,showCloseButton:_=!0,closeOnBackdrop:x=!0,closeOnEscape:I=!0,ariaLabel:T,className:j,style:E,children:m,...D},h){const R=Y.useT(),e=l.useRef(null),O=l.useRef(null),B=l.useRef(null),P=l.useId(),p=l.useId();l.useEffect(()=>{var f,y,v;if(!a)return;const t=document.activeElement,o=((f=O.current)==null?void 0:f.querySelector(S))??((y=B.current)==null?void 0:y.querySelector(S))??((v=e.current)==null?void 0:v.querySelector(S))??e.current;return o==null||o.focus({preventScroll:!0}),()=>{var b;t!=null&&t.isConnected&&((b=t.focus)==null||b.call(t))}},[a]);const U=t=>{e.current=t,typeof h=="function"?h(t):h&&(h.current=t)},V=t=>{if(t.key!=="Tab")return;const o=e.current;if(!o)return;const f=[...o.querySelectorAll(S)].filter(z=>z.offsetParent!==null||z===document.activeElement);if(f.length===0){t.preventDefault(),o.focus();return}const y=f[0],v=f[f.length-1],b=document.activeElement;t.shiftKey&&(b===y||b===o)?(t.preventDefault(),v.focus()):!t.shiftKey&&b===v&&(t.preventDefault(),y.focus())};if(!a)return null;const F=N!=="center",M=d==null?null:typeof d=="string"&&he.has(d)?r.jsx(L.Icon,{name:d}):d,G=c!=null||i!=null||M!=null||_,J=m!=null||u!=null;return r.jsx(H,{open:a,onClose:s,closeOnBackdrop:x,closeOnEscape:I,onKeyDown:V,className:n.overlay,"data-size":k,"data-placement":N,"data-scroll":F?"inside":g,children:r.jsxs("div",{ref:U,className:A.clsx(n.modal,n[k],j),role:"dialog","aria-modal":"true","aria-labelledby":c!=null?P:void 0,"aria-label":c==null?T:void 0,"aria-describedby":i!=null?p:void 0,tabIndex:-1,style:E,...D,children:[G&&r.jsxs("div",{className:A.clsx(n.header,J&&n.headerDivided),children:[r.jsxs("div",{className:n.headerMain,children:[M!=null&&r.jsx($.IconButton,{variant:"filled",size:"sm",color:q,nonClickable:!0,"aria-hidden":!0,className:n.icon,children:M}),(c!=null||i!=null)&&r.jsxs("div",{className:n.headerText,children:[c!=null&&r.jsx("div",{id:P,className:n.title,children:c}),i!=null&&r.jsx("div",{id:p,className:n.subtitle,children:i})]})]}),_&&r.jsx($.IconButton,{variant:"filled",color:"primary",size:"sm",className:n.close,"aria-label":R("common.close"),onClick:s,children:r.jsx(L.Icon,{name:"Close"})})]}),m!=null&&r.jsx("div",{ref:O,className:n.body,children:m}),u!=null&&r.jsx("div",{ref:B,className:n.footer,children:u})]})})});exports.Modal=be;exports.Overlay=H;
|
|
2
|
+
//# sourceMappingURL=Modal-V6eyGSzW.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal-DsoSz0Sp.cjs","sources":["../src/components/Overlay/Overlay.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import {\n forwardRef,\n useEffect,\n useRef,\n useState,\n type CSSProperties,\n type HTMLAttributes,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport { clsx } from 'clsx'\nimport { useLockBodyScroll } from '../../hooks/useLockBodyScroll'\nimport styles from './Overlay.module.css'\n\nexport interface OverlayProps extends HTMLAttributes<HTMLDivElement> {\n /** Whether the overlay is mounted + shown — gates the portal and drives the fade-in. */\n open: boolean\n /** Requested dismiss — fired on a backdrop click (`closeOnBackdrop`) or Escape (`closeOnEscape`). */\n onClose?: () => void\n /** Close when the scrim itself (outside the content) is clicked. Defaults to `true`. */\n closeOnBackdrop?: boolean\n /** Close when Escape is pressed while focus is within the overlay. Defaults to `true`. */\n closeOnEscape?: boolean\n /** Lock page scroll while open. Defaults to `true`. */\n lockScroll?: boolean\n /** Scrim darkness — the black backdrop's alpha (0–1). Defaults to `0.45`. */\n dim?: number\n /** Overlay content — typically a centered dialog / box / media. */\n children?: ReactNode\n}\n\n/**\n * The shared backdrop primitive behind every dimmed, page-blocking surface (`Modal`, the FileUploader\n * lightbox). Portals a fixed full-viewport scrim to `<body>`, locks page scroll, fades in (opacity keyed\n * off a rAF `visible` flag → `data-open`), and dismisses on **backdrop-click** (gated on the pointer-down\n * AND click both landing on the scrim, so a text-selection drag ending on it doesn't close) / **Escape**\n * (swallowed via `stopPropagation` so it can't reach a React-tree ancestor overlay). Centers its children\n * by default; consumers layer their own padding / scroll / placement via `className` + `data-*` and read\n * the shared `data-open` on the scrim for their own box's enter transform. A consumer `onKeyDown` still\n * fires (after the Escape handling) so it can add e.g. a Tab focus-trap. Internal — no `index.ts`, so it's\n * never exposed as a package subpath; import it via `../Overlay/Overlay`. The ref points at the scrim div.\n */\nexport const Overlay = forwardRef<HTMLDivElement, OverlayProps>(function Overlay(\n {\n open,\n onClose,\n closeOnBackdrop = true,\n closeOnEscape = true,\n lockScroll = true,\n dim,\n className,\n style,\n children,\n onKeyDown,\n onMouseDown,\n onClick,\n ...props\n },\n ref,\n) {\n const mouseDownTarget = useRef<EventTarget | null>(null)\n const [visible, setVisible] = useState(false)\n\n useLockBodyScroll(open && lockScroll)\n\n // enter animation: flip `visible` on the frame after mount so the opacity transition runs\n useEffect(() => {\n if (!open) {\n setVisible(false)\n return\n }\n const raf = requestAnimationFrame(() => setVisible(true))\n return () => cancelAnimationFrame(raf)\n }, [open])\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Escape') {\n // the overlay owns the page — swallow Escape so it can't reach a React-tree ancestor overlay (e.g.\n // an outer Modal) even when this one isn't Escape-dismissible\n event.stopPropagation()\n if (closeOnEscape) onClose?.()\n }\n onKeyDown?.(event)\n }\n // remember where the pointer went down so the click handler can tell a scrim click from a drag that\n // started inside the content and ended on the scrim (a text-selection drag)\n const handleMouseDown = (event: MouseEvent<HTMLDivElement>) => {\n mouseDownTarget.current = event.target\n onMouseDown?.(event)\n }\n const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n if (\n closeOnBackdrop &&\n event.target === event.currentTarget &&\n mouseDownTarget.current === event.currentTarget\n ) {\n onClose?.()\n }\n onClick?.(event)\n }\n\n if (!open || typeof document === 'undefined') return null\n\n return createPortal(\n <div\n ref={ref}\n className={clsx(styles.overlay, className)}\n data-open={visible ? 'true' : 'false'}\n style={dim != null ? ({ '--tz-overlay-dim': dim, ...style } as CSSProperties) : style}\n onKeyDown={handleKeyDown}\n onMouseDown={handleMouseDown}\n onClick={handleClick}\n {...props}\n >\n {children}\n </div>,\n document.body,\n )\n})\n","import {\n forwardRef,\n useEffect,\n useId,\n useRef,\n type CSSProperties,\n type HTMLAttributes,\n type KeyboardEvent,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { useT, type ThemeColor } from '../../theme'\nimport { Icon } from '../Icon'\nimport { IconButton } from '../IconButton'\nimport { Overlay } from '../Overlay/Overlay'\nimport styles from './Modal.module.css'\n\nexport type ModalSize = 'sm' | 'md' | 'lg' | 'fullScreen'\nexport type ModalScrollBehavior = 'inside' | 'outside'\nexport type ModalPlacement = 'center' | 'left' | 'right'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\n/** Focusable descendants used by the focus trap + initial focus. */\n// every clause excludes tabindex=\"-1\" so decorative/programmatic-only nodes (e.g. the header's\n// `nonClickable aria-hidden` IconButton) don't count as trap boundaries or initial-focus targets\nconst FOCUSABLE =\n 'a[href]:not([tabindex=\"-1\"]), button:not(:disabled):not([tabindex=\"-1\"]), textarea:not(:disabled):not([tabindex=\"-1\"]), input:not(:disabled):not([tabindex=\"-1\"]), select:not(:disabled):not([tabindex=\"-1\"]), [tabindex]:not([tabindex=\"-1\"])'\n\nexport interface ModalProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'color'> {\n /** Whether the modal is open — gates the portal and drives the enter animation. */\n open: boolean\n /** Called when a dismiss is requested (close button, backdrop click, or Escape). */\n onClose: () => void\n /** Preset width: `sm` 360 · `md` 620 · `lg` 900 px, or `fullScreen` (fills the viewport). Defaults to `md`. */\n size?: ModalSize\n /**\n * Where overflow scrolls when the content is taller than the viewport: `outside` (default — the\n * whole dialog grows and the overlay/page scrolls) or `inside` (the body scrolls while the header +\n * footer stay pinned). Ignored for side-drawer placements (`left`/`right`), which always scroll inside.\n */\n scrollBehavior?: ModalScrollBehavior\n /**\n * Where the dialog sits: `center` (default — the standard centered modal), or `left` / `right` to\n * make it a **full-height side drawer** (sheet) that slides in from that edge. A drawer takes its\n * width from `size`, fills the viewport height, and always scrolls its body inside (header + footer\n * stay pinned).\n */\n placement?: ModalPlacement\n /** Header title. When set, labels the dialog (`aria-labelledby`). */\n title?: ReactNode\n /** Muted description line under the title (e.g. a confirm prompt). */\n description?: ReactNode\n /** Leading header icon shown in a tinted box (like `Card`) — a known `IconName` or any node. */\n icon?: IconName | ReactNode\n /** Theme color that tints the leading icon box. Defaults to `accent`. */\n color?: ThemeColor\n /** Footer slot — right-aligned actions over a top divider (e.g. Cancel / Confirm buttons). */\n footer?: ReactNode\n /** Show the header × close button. Defaults to `true`. */\n showCloseButton?: boolean\n /** Close when the backdrop (outside the dialog) is clicked. Defaults to `true`. */\n closeOnBackdrop?: boolean\n /** Close when Escape is pressed. Defaults to `true`. */\n closeOnEscape?: boolean\n /** Accessible label — used when there's no `title`. */\n ariaLabel?: string\n /** Dialog body. */\n children?: ReactNode\n}\n\n/**\n * A centered, backdrop-dimmed overlay dialog. Portaled to `<body>`, it locks page scroll while open,\n * traps Tab focus inside, restores focus to the previously-focused element on close, and dismisses on\n * close button / backdrop click / Escape (each toggleable). Sizes are `sm`/`md`/`lg` (max-width caps)\n * or `fullScreen`; `scrollBehavior` picks inside-body vs. whole-dialog scrolling. `placement` turns it\n * into a full-height side drawer (`left`/`right`) that slides in from the edge. The header mirrors\n * `Card` — an optional tinted `icon` box + `title` + `description`. Controlled by `open` + `onClose`.\n * The forwarded ref points at the dialog element.\n *\n * @example\n * const { isOpen, open, close } = useDisclosure()\n * <Modal open={isOpen} onClose={close} title=\"Edit\" footer={<Button onClick={close}>Done</Button>}>\n * …\n * </Modal>\n */\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(function Modal(\n {\n open,\n onClose,\n size = 'md',\n scrollBehavior = 'outside',\n placement = 'center',\n title,\n description,\n icon,\n color = 'accent',\n footer,\n showCloseButton = true,\n closeOnBackdrop = true,\n closeOnEscape = true,\n ariaLabel,\n className,\n style,\n children,\n ...props\n },\n forwardedRef,\n) {\n const t = useT()\n const panelRef = useRef<HTMLDivElement | null>(null)\n const bodyRef = useRef<HTMLDivElement | null>(null)\n const footerRef = useRef<HTMLDivElement | null>(null)\n const titleId = useId()\n const descId = useId()\n\n // portal + scrim + scroll-lock + fade-in + backdrop-dismiss are handled by the shared `<Overlay>`\n\n // focus management: move focus into the dialog on open — prefer a body field (form modals land on\n // their first input), else the first footer action (confirm dialogs land on Cancel/Confirm, not the\n // × button), else any control, else the dialog itself; restore focus to the trigger on close\n useEffect(() => {\n if (!open) return\n const previouslyFocused = document.activeElement as HTMLElement | null\n const target =\n bodyRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n footerRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n panelRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n panelRef.current\n // preventScroll so opening an `outside`-scroll modal doesn't jump the overlay to a below-fold control\n target?.focus({ preventScroll: true })\n // only restore if the element is still mounted (it may have unmounted while the modal was open)\n return () => {\n if (previouslyFocused?.isConnected) previouslyFocused.focus?.()\n }\n }, [open])\n\n // merge the panel ref (positioning/focus) with the forwarded ref (consumer access)\n const setPanelRef = (node: HTMLDivElement | null) => {\n panelRef.current = node\n if (typeof forwardedRef === 'function') forwardedRef(node)\n else if (forwardedRef) forwardedRef.current = node\n }\n\n // trap Tab within the dialog so focus can't strand on the locked page behind it (Escape + backdrop\n // dismissal live in `<Overlay>`; this fires after the overlay's own handler)\n const handleTabTrap = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key !== 'Tab') return\n const panel = panelRef.current\n if (!panel) return\n const focusables = [...panel.querySelectorAll<HTMLElement>(FOCUSABLE)].filter(\n (el) => el.offsetParent !== null || el === document.activeElement,\n )\n if (focusables.length === 0) {\n event.preventDefault()\n panel.focus()\n return\n }\n const first = focusables[0]\n const last = focusables[focusables.length - 1]\n const active = document.activeElement\n if (event.shiftKey && (active === first || active === panel)) {\n event.preventDefault()\n last.focus()\n } else if (!event.shiftKey && active === last) {\n event.preventDefault()\n first.focus()\n }\n }\n\n if (!open) return null\n\n // a side drawer (left/right) is always full-height with the body scrolling inside (header/footer pinned)\n const isDrawer = placement !== 'center'\n\n const renderedIcon =\n icon == null ? null : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n <Icon name={icon as IconName} />\n ) : (\n icon\n )\n\n const hasHeader = title != null || description != null || renderedIcon != null || showCloseButton\n // a divider sets the header apart from the body/footer, like Card\n const headerDivided = children != null || footer != null\n\n return (\n <Overlay\n open={open}\n onClose={onClose}\n closeOnBackdrop={closeOnBackdrop}\n closeOnEscape={closeOnEscape}\n onKeyDown={handleTabTrap}\n className={styles.overlay}\n data-size={size}\n data-placement={placement}\n data-scroll={isDrawer ? 'inside' : scrollBehavior}\n >\n <div\n ref={setPanelRef}\n className={clsx(styles.modal, styles[size], className)}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={title != null ? titleId : undefined}\n aria-label={title == null ? ariaLabel : undefined}\n aria-describedby={description != null ? descId : undefined}\n tabIndex={-1}\n style={style as CSSProperties}\n {...props}\n >\n {hasHeader && (\n <div className={clsx(styles.header, headerDivided && styles.headerDivided)}>\n <div className={styles.headerMain}>\n {renderedIcon != null && (\n <IconButton\n variant=\"filled\"\n size=\"sm\"\n color={color}\n nonClickable\n aria-hidden\n className={styles.icon}\n >\n {renderedIcon}\n </IconButton>\n )}\n {(title != null || description != null) && (\n <div className={styles.headerText}>\n {title != null && (\n <div id={titleId} className={styles.title}>\n {title}\n </div>\n )}\n {description != null && (\n <div id={descId} className={styles.subtitle}>\n {description}\n </div>\n )}\n </div>\n )}\n </div>\n {showCloseButton && (\n <IconButton\n variant=\"filled\"\n color=\"primary\"\n size=\"sm\"\n className={styles.close}\n aria-label={t('common.close')}\n onClick={onClose}\n >\n <Icon name=\"Close\" />\n </IconButton>\n )}\n </div>\n )}\n {children != null && (\n <div ref={bodyRef} className={styles.body}>\n {children}\n </div>\n )}\n {footer != null && (\n <div ref={footerRef} className={styles.footer}>\n {footer}\n </div>\n )}\n </div>\n </Overlay>\n )\n})\n"],"names":["Overlay","forwardRef","open","onClose","closeOnBackdrop","closeOnEscape","lockScroll","dim","className","style","children","onKeyDown","onMouseDown","onClick","props","ref","mouseDownTarget","useRef","visible","setVisible","useState","useLockBodyScroll","useEffect","raf","handleKeyDown","event","handleMouseDown","handleClick","createPortal","jsx","clsx","styles","ICON_NAME_SET","ICON_NAMES","FOCUSABLE","Modal","size","scrollBehavior","placement","title","description","icon","color","footer","showCloseButton","ariaLabel","forwardedRef","t","useT","panelRef","bodyRef","footerRef","titleId","useId","descId","previouslyFocused","target","_a","_b","_c","setPanelRef","node","handleTabTrap","panel","focusables","el","first","last","active","isDrawer","renderedIcon","Icon","hasHeader","headerDivided","jsxs","IconButton"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Modal-V6eyGSzW.cjs","sources":["../src/components/Overlay/Overlay.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import {\n forwardRef,\n useEffect,\n useRef,\n useState,\n type CSSProperties,\n type HTMLAttributes,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n} from 'react'\nimport { createPortal } from 'react-dom'\nimport { clsx } from 'clsx'\nimport { useLockBodyScroll } from '../../hooks/useLockBodyScroll'\nimport styles from './Overlay.module.css'\n\nexport interface OverlayProps extends HTMLAttributes<HTMLDivElement> {\n /** Whether the overlay is mounted + shown — gates the portal and drives the fade-in. */\n open: boolean\n /** Requested dismiss — fired on a backdrop click (`closeOnBackdrop`) or Escape (`closeOnEscape`). */\n onClose?: () => void\n /** Close when the scrim itself (outside the content) is clicked. Defaults to `true`. */\n closeOnBackdrop?: boolean\n /** Close when Escape is pressed while focus is within the overlay. Defaults to `true`. */\n closeOnEscape?: boolean\n /** Lock page scroll while open. Defaults to `true`. */\n lockScroll?: boolean\n /** Scrim darkness — the black backdrop's alpha (0–1). Defaults to `0.45`. */\n dim?: number\n /** Overlay content — typically a centered dialog / box / media. */\n children?: ReactNode\n}\n\n/**\n * The shared backdrop primitive behind every dimmed, page-blocking surface (`Modal`, the FileUploader\n * lightbox). Portals a fixed full-viewport scrim to `<body>`, locks page scroll, fades in (opacity keyed\n * off a rAF `visible` flag → `data-open`), and dismisses on **backdrop-click** (gated on the pointer-down\n * AND click both landing on the scrim, so a text-selection drag ending on it doesn't close) / **Escape**\n * (swallowed via `stopPropagation` so it can't reach a React-tree ancestor overlay). Centers its children\n * by default; consumers layer their own padding / scroll / placement via `className` + `data-*` and read\n * the shared `data-open` on the scrim for their own box's enter transform. A consumer `onKeyDown` still\n * fires (after the Escape handling) so it can add e.g. a Tab focus-trap. Internal — no `index.ts`, so it's\n * never exposed as a package subpath; import it via `../Overlay/Overlay`. The ref points at the scrim div.\n */\nexport const Overlay = forwardRef<HTMLDivElement, OverlayProps>(function Overlay(\n {\n open,\n onClose,\n closeOnBackdrop = true,\n closeOnEscape = true,\n lockScroll = true,\n dim,\n className,\n style,\n children,\n onKeyDown,\n onMouseDown,\n onClick,\n ...props\n },\n ref,\n) {\n const mouseDownTarget = useRef<EventTarget | null>(null)\n const [visible, setVisible] = useState(false)\n\n useLockBodyScroll(open && lockScroll)\n\n // enter animation: flip `visible` on the frame after mount so the opacity transition runs\n useEffect(() => {\n if (!open) {\n setVisible(false)\n return\n }\n const raf = requestAnimationFrame(() => setVisible(true))\n return () => cancelAnimationFrame(raf)\n }, [open])\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Escape') {\n // the overlay owns the page — swallow Escape so it can't reach a React-tree ancestor overlay (e.g.\n // an outer Modal) even when this one isn't Escape-dismissible\n event.stopPropagation()\n if (closeOnEscape) onClose?.()\n }\n onKeyDown?.(event)\n }\n // remember where the pointer went down so the click handler can tell a scrim click from a drag that\n // started inside the content and ended on the scrim (a text-selection drag)\n const handleMouseDown = (event: MouseEvent<HTMLDivElement>) => {\n mouseDownTarget.current = event.target\n onMouseDown?.(event)\n }\n const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n if (\n closeOnBackdrop &&\n event.target === event.currentTarget &&\n mouseDownTarget.current === event.currentTarget\n ) {\n onClose?.()\n }\n onClick?.(event)\n }\n\n if (!open || typeof document === 'undefined') return null\n\n return createPortal(\n <div\n ref={ref}\n className={clsx(styles.overlay, className)}\n data-open={visible ? 'true' : 'false'}\n style={dim != null ? ({ '--tz-overlay-dim': dim, ...style } as CSSProperties) : style}\n onKeyDown={handleKeyDown}\n onMouseDown={handleMouseDown}\n onClick={handleClick}\n {...props}\n >\n {children}\n </div>,\n document.body,\n )\n})\n","import {\n forwardRef,\n useEffect,\n useId,\n useRef,\n type CSSProperties,\n type HTMLAttributes,\n type KeyboardEvent,\n type ReactNode,\n} from 'react'\nimport { clsx } from 'clsx'\nimport { ICON_NAMES, type IconName } from '../../icons/names'\nimport { useT, type ThemeColor } from '../../theme'\nimport { Icon } from '../Icon'\nimport { IconButton } from '../IconButton'\nimport { Overlay } from '../Overlay/Overlay'\nimport styles from './Modal.module.css'\n\nexport type ModalSize = 'sm' | 'md' | 'lg' | 'fullScreen'\nexport type ModalScrollBehavior = 'inside' | 'outside'\nexport type ModalPlacement = 'center' | 'left' | 'right'\n\nconst ICON_NAME_SET = new Set<string>(ICON_NAMES)\n\n/** Focusable descendants used by the focus trap + initial focus. */\n// every clause excludes tabindex=\"-1\" so decorative/programmatic-only nodes (e.g. the header's\n// `nonClickable aria-hidden` IconButton) don't count as trap boundaries or initial-focus targets\nconst FOCUSABLE =\n 'a[href]:not([tabindex=\"-1\"]), button:not(:disabled):not([tabindex=\"-1\"]), textarea:not(:disabled):not([tabindex=\"-1\"]), input:not(:disabled):not([tabindex=\"-1\"]), select:not(:disabled):not([tabindex=\"-1\"]), [tabindex]:not([tabindex=\"-1\"])'\n\nexport interface ModalProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'color'> {\n /** Whether the modal is open — gates the portal and drives the enter animation. */\n open: boolean\n /** Called when a dismiss is requested (close button, backdrop click, or Escape). */\n onClose: () => void\n /** Preset width: `sm` 360 · `md` 620 · `lg` 900 px, or `fullScreen` (fills the viewport). Defaults to `md`. */\n size?: ModalSize\n /**\n * Where overflow scrolls when the content is taller than the viewport: `outside` (default — the\n * whole dialog grows and the overlay/page scrolls) or `inside` (the body scrolls while the header +\n * footer stay pinned). Ignored for side-drawer placements (`left`/`right`), which always scroll inside.\n */\n scrollBehavior?: ModalScrollBehavior\n /**\n * Where the dialog sits: `center` (default — the standard centered modal), or `left` / `right` to\n * make it a **full-height side drawer** (sheet) that slides in from that edge. A drawer takes its\n * width from `size`, fills the viewport height, and always scrolls its body inside (header + footer\n * stay pinned).\n */\n placement?: ModalPlacement\n /** Header title. When set, labels the dialog (`aria-labelledby`). */\n title?: ReactNode\n /** Muted description line under the title (e.g. a confirm prompt). */\n description?: ReactNode\n /** Leading header icon shown in a tinted box (like `Card`) — a known `IconName` or any node. */\n icon?: IconName | ReactNode\n /** Theme color that tints the leading icon box. Defaults to `accent`. */\n color?: ThemeColor\n /** Footer slot — right-aligned actions over a top divider (e.g. Cancel / Confirm buttons). */\n footer?: ReactNode\n /** Show the header × close button. Defaults to `true`. */\n showCloseButton?: boolean\n /** Close when the backdrop (outside the dialog) is clicked. Defaults to `true`. */\n closeOnBackdrop?: boolean\n /** Close when Escape is pressed. Defaults to `true`. */\n closeOnEscape?: boolean\n /** Accessible label — used when there's no `title`. */\n ariaLabel?: string\n /** Dialog body. */\n children?: ReactNode\n}\n\n/**\n * A centered, backdrop-dimmed overlay dialog. Portaled to `<body>`, it locks page scroll while open,\n * traps Tab focus inside, restores focus to the previously-focused element on close, and dismisses on\n * close button / backdrop click / Escape (each toggleable). Sizes are `sm`/`md`/`lg` (max-width caps)\n * or `fullScreen`; `scrollBehavior` picks inside-body vs. whole-dialog scrolling. `placement` turns it\n * into a full-height side drawer (`left`/`right`) that slides in from the edge. The header mirrors\n * `Card` — an optional tinted `icon` box + `title` + `description`. Controlled by `open` + `onClose`.\n * The forwarded ref points at the dialog element.\n *\n * @example\n * const { isOpen, open, close } = useDisclosure()\n * <Modal open={isOpen} onClose={close} title=\"Edit\" footer={<Button onClick={close}>Done</Button>}>\n * …\n * </Modal>\n */\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(function Modal(\n {\n open,\n onClose,\n size = 'md',\n scrollBehavior = 'outside',\n placement = 'center',\n title,\n description,\n icon,\n color = 'accent',\n footer,\n showCloseButton = true,\n closeOnBackdrop = true,\n closeOnEscape = true,\n ariaLabel,\n className,\n style,\n children,\n ...props\n },\n forwardedRef,\n) {\n const t = useT()\n const panelRef = useRef<HTMLDivElement | null>(null)\n const bodyRef = useRef<HTMLDivElement | null>(null)\n const footerRef = useRef<HTMLDivElement | null>(null)\n const titleId = useId()\n const descId = useId()\n\n // portal + scrim + scroll-lock + fade-in + backdrop-dismiss are handled by the shared `<Overlay>`\n\n // focus management: move focus into the dialog on open — prefer a body field (form modals land on\n // their first input), else the first footer action (confirm dialogs land on Cancel/Confirm, not the\n // × button), else any control, else the dialog itself; restore focus to the trigger on close\n useEffect(() => {\n if (!open) return\n const previouslyFocused = document.activeElement as HTMLElement | null\n const target =\n bodyRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n footerRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n panelRef.current?.querySelector<HTMLElement>(FOCUSABLE) ??\n panelRef.current\n // preventScroll so opening an `outside`-scroll modal doesn't jump the overlay to a below-fold control\n target?.focus({ preventScroll: true })\n // only restore if the element is still mounted (it may have unmounted while the modal was open)\n return () => {\n if (previouslyFocused?.isConnected) previouslyFocused.focus?.()\n }\n }, [open])\n\n // merge the panel ref (positioning/focus) with the forwarded ref (consumer access)\n const setPanelRef = (node: HTMLDivElement | null) => {\n panelRef.current = node\n if (typeof forwardedRef === 'function') forwardedRef(node)\n else if (forwardedRef) forwardedRef.current = node\n }\n\n // trap Tab within the dialog so focus can't strand on the locked page behind it (Escape + backdrop\n // dismissal live in `<Overlay>`; this fires after the overlay's own handler)\n const handleTabTrap = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key !== 'Tab') return\n const panel = panelRef.current\n if (!panel) return\n const focusables = [...panel.querySelectorAll<HTMLElement>(FOCUSABLE)].filter(\n (el) => el.offsetParent !== null || el === document.activeElement,\n )\n if (focusables.length === 0) {\n event.preventDefault()\n panel.focus()\n return\n }\n const first = focusables[0]\n const last = focusables[focusables.length - 1]\n const active = document.activeElement\n if (event.shiftKey && (active === first || active === panel)) {\n event.preventDefault()\n last.focus()\n } else if (!event.shiftKey && active === last) {\n event.preventDefault()\n first.focus()\n }\n }\n\n if (!open) return null\n\n // a side drawer (left/right) is always full-height with the body scrolling inside (header/footer pinned)\n const isDrawer = placement !== 'center'\n\n const renderedIcon =\n icon == null ? null : typeof icon === 'string' && ICON_NAME_SET.has(icon) ? (\n <Icon name={icon as IconName} />\n ) : (\n icon\n )\n\n const hasHeader = title != null || description != null || renderedIcon != null || showCloseButton\n // a divider sets the header apart from the body/footer, like Card\n const headerDivided = children != null || footer != null\n\n return (\n <Overlay\n open={open}\n onClose={onClose}\n closeOnBackdrop={closeOnBackdrop}\n closeOnEscape={closeOnEscape}\n onKeyDown={handleTabTrap}\n className={styles.overlay}\n data-size={size}\n data-placement={placement}\n data-scroll={isDrawer ? 'inside' : scrollBehavior}\n >\n <div\n ref={setPanelRef}\n className={clsx(styles.modal, styles[size], className)}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={title != null ? titleId : undefined}\n aria-label={title == null ? ariaLabel : undefined}\n aria-describedby={description != null ? descId : undefined}\n tabIndex={-1}\n style={style as CSSProperties}\n {...props}\n >\n {hasHeader && (\n <div className={clsx(styles.header, headerDivided && styles.headerDivided)}>\n <div className={styles.headerMain}>\n {renderedIcon != null && (\n <IconButton\n variant=\"filled\"\n size=\"sm\"\n color={color}\n nonClickable\n aria-hidden\n className={styles.icon}\n >\n {renderedIcon}\n </IconButton>\n )}\n {(title != null || description != null) && (\n <div className={styles.headerText}>\n {title != null && (\n <div id={titleId} className={styles.title}>\n {title}\n </div>\n )}\n {description != null && (\n <div id={descId} className={styles.subtitle}>\n {description}\n </div>\n )}\n </div>\n )}\n </div>\n {showCloseButton && (\n <IconButton\n variant=\"filled\"\n color=\"primary\"\n size=\"sm\"\n className={styles.close}\n aria-label={t('common.close')}\n onClick={onClose}\n >\n <Icon name=\"Close\" />\n </IconButton>\n )}\n </div>\n )}\n {children != null && (\n <div ref={bodyRef} className={styles.body}>\n {children}\n </div>\n )}\n {footer != null && (\n <div ref={footerRef} className={styles.footer}>\n {footer}\n </div>\n )}\n </div>\n </Overlay>\n )\n})\n"],"names":["Overlay","forwardRef","open","onClose","closeOnBackdrop","closeOnEscape","lockScroll","dim","className","style","children","onKeyDown","onMouseDown","onClick","props","ref","mouseDownTarget","useRef","visible","setVisible","useState","useLockBodyScroll","useEffect","raf","handleKeyDown","event","handleMouseDown","handleClick","createPortal","jsx","clsx","styles","ICON_NAME_SET","ICON_NAMES","FOCUSABLE","Modal","size","scrollBehavior","placement","title","description","icon","color","footer","showCloseButton","ariaLabel","forwardedRef","t","useT","panelRef","bodyRef","footerRef","titleId","useId","descId","previouslyFocused","target","_a","_b","_c","setPanelRef","node","handleTabTrap","panel","focusables","el","first","last","active","isDrawer","renderedIcon","Icon","hasHeader","headerDivided","jsxs","IconButton"],"mappings":"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"}
|
|
@@ -3,13 +3,13 @@ import { forwardRef as Me, useId as Ce, useState as R, useRef as D, useCallback
|
|
|
3
3
|
import { clsx as K } from "clsx";
|
|
4
4
|
import { u as Be } from "./formContext-B7ln1Miy.js";
|
|
5
5
|
import { F as Re } from "./FloatingPanel-BG9Uag__.js";
|
|
6
|
-
import { C as qe } from "./Chip-
|
|
7
|
-
import { I as V } from "./Icon-
|
|
6
|
+
import { C as qe } from "./Chip-BiqfnRUi.js";
|
|
7
|
+
import { I as V } from "./Icon-DaTvzLBu.js";
|
|
8
8
|
import { L as Ke } from "./List-LqbfF6gU.js";
|
|
9
|
-
import { L as Ve } from "./ListItem-
|
|
10
|
-
import { L as We } from "./Loader-
|
|
9
|
+
import { L as Ve } from "./ListItem-Cn15lJBr.js";
|
|
10
|
+
import { L as We } from "./Loader-WsjQFl4p.js";
|
|
11
11
|
import { T as W } from "./Typography-Cta6Rg4L.js";
|
|
12
|
-
import { a as $e } from "./ConfigProvider-
|
|
12
|
+
import { a as $e } from "./ConfigProvider-DT0yrgmd.js";
|
|
13
13
|
const Ae = "_field_16ykc_1", Fe = "_fullWidth_16ykc_7", Oe = "_label_16ykc_12", Pe = "_required_16ykc_21", Se = "_control_16ykc_27", He = "_filled_16ykc_47", je = "_open_16ykc_51", Qe = "_error_16ykc_56", Ue = "_disabled_16ykc_64", ze = "_chips_16ykc_31", Ge = "_value_16ykc_84", Je = "_valueLabel_16ykc_91", Xe = "_placeholder_16ykc_96", Ye = "_clear_16ykc_100", Ze = "_chevron_16ykc_117", er = "_sm_16ykc_127", rr = "_md_16ykc_131", lr = "_lg_16ykc_135", tr = "_helper_16ykc_140", or = "_popover_16ykc_145", ar = "_search_16ykc_152", cr = "_searchIcon_16ykc_161", sr = "_searchInput_16ykc_165", nr = "_listbox_16ykc_180", ir = "_active_16ykc_188", dr = "_noOptions_16ykc_192", ur = "_loading_16ykc_198", l = {
|
|
14
14
|
field: Ae,
|
|
15
15
|
fullWidth: Fe,
|
|
@@ -347,4 +347,4 @@ const Ae = "_field_16ykc_1", Fe = "_fullWidth_16ykc_7", Oe = "_label_16ykc_12",
|
|
|
347
347
|
export {
|
|
348
348
|
Dr as M
|
|
349
349
|
};
|
|
350
|
-
//# sourceMappingURL=MultiSelect-
|
|
350
|
+
//# sourceMappingURL=MultiSelect-BsYPr3LD.js.map
|