@commercetools/nimbus 0.0.0-canary-20251027194157 → 0.0.0-canary-20251028202350
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/chunks/{Button-CqCJF7Kz.es.js → Button-SjGHt140.es.js} +2 -2
- package/dist/chunks/{Button-CqCJF7Kz.es.js.map → Button-SjGHt140.es.js.map} +1 -1
- package/dist/chunks/{CollectionBuilder-CoZRYV8T.es.js → CollectionBuilder-BhYUxJYI.es.js} +6 -6
- package/dist/chunks/{CollectionBuilder-CoZRYV8T.es.js.map → CollectionBuilder-BhYUxJYI.es.js.map} +1 -1
- package/dist/chunks/{DateField-ChNVEFNs.es.js → DateField-DMjgxual.es.js} +5 -5
- package/dist/chunks/{DateField-ChNVEFNs.es.js.map → DateField-DMjgxual.es.js.map} +1 -1
- package/dist/chunks/{DatePicker-uW8Z5fWm.es.js → DatePicker-Cvad8nra.es.js} +7 -7
- package/dist/chunks/{DatePicker-uW8Z5fWm.es.js.map → DatePicker-Cvad8nra.es.js.map} +1 -1
- package/dist/chunks/{DatePicker-Codg0QnC.cjs.js → DatePicker-DGLrUdLu.cjs.js} +2 -2
- package/dist/chunks/{DatePicker-Codg0QnC.cjs.js.map → DatePicker-DGLrUdLu.cjs.js.map} +1 -1
- package/dist/chunks/{Dialog-DyQtQIZJ.es.js → Dialog-BUtdEtlF.es.js} +11 -11
- package/dist/chunks/{Dialog-DyQtQIZJ.es.js.map → Dialog-BUtdEtlF.es.js.map} +1 -1
- package/dist/chunks/{Dialog-DINBl88u.cjs.js → Dialog-Ye_7tQZU.cjs.js} +2 -2
- package/dist/chunks/{Dialog-DINBl88u.cjs.js.map → Dialog-Ye_7tQZU.cjs.js.map} +1 -1
- package/dist/chunks/Header-Bvl-gjeR.cjs.js +2 -0
- package/dist/chunks/Header-Bvl-gjeR.cjs.js.map +1 -0
- package/dist/chunks/Header-CpF5ynyj.es.js +213 -0
- package/dist/chunks/Header-CpF5ynyj.es.js.map +1 -0
- package/dist/chunks/{Heading-C5BLc9Ds.es.js → Heading-DXod1zoy.es.js} +7 -7
- package/dist/chunks/{Heading-C5BLc9Ds.es.js.map → Heading-DXod1zoy.es.js.map} +1 -1
- package/dist/chunks/ListBox-CdtzuZzA.es.js +561 -0
- package/dist/chunks/ListBox-CdtzuZzA.es.js.map +1 -0
- package/dist/chunks/ListBox-Dcnj8pHo.cjs.js +2 -0
- package/dist/chunks/ListBox-Dcnj8pHo.cjs.js.map +1 -0
- package/dist/chunks/{Modal-DDTTtqGV.es.js → Modal-BgIeZMyG.es.js} +4 -4
- package/dist/chunks/{Modal-DDTTtqGV.es.js.map → Modal-BgIeZMyG.es.js.map} +1 -1
- package/dist/chunks/{Modal-C9uSJ3BN.cjs.js → Modal-DjOIA2BE.cjs.js} +2 -2
- package/dist/chunks/{Modal-C9uSJ3BN.cjs.js.map → Modal-DjOIA2BE.cjs.js.map} +1 -1
- package/dist/chunks/{RSPContexts-DV4cFLUV.es.js → RSPContexts-DLgb84PF.es.js} +3 -3
- package/dist/chunks/{RSPContexts-DV4cFLUV.es.js.map → RSPContexts-DLgb84PF.es.js.map} +1 -1
- package/dist/chunks/{SelectionManager-Bo1rTzWU.es.js → SelectionManager-S9Amkvfg.es.js} +9 -9
- package/dist/chunks/{SelectionManager-Bo1rTzWU.es.js.map → SelectionManager-S9Amkvfg.es.js.map} +1 -1
- package/dist/chunks/{Separator-OdAUxccH.es.js → Separator-kuF-Wo1o.es.js} +2 -2
- package/dist/chunks/{Separator-OdAUxccH.es.js.map → Separator-kuF-Wo1o.es.js.map} +1 -1
- package/dist/chunks/{ToggleButton-BlpcYfFt.es.js → ToggleButton-BIiBT_jL.es.js} +2 -2
- package/dist/chunks/{ToggleButton-BlpcYfFt.es.js.map → ToggleButton-BIiBT_jL.es.js.map} +1 -1
- package/dist/chunks/{accordion-B9pzlIJn.cjs.js → accordion-DhybkUP0.cjs.js} +2 -2
- package/dist/chunks/{accordion-B9pzlIJn.cjs.js.map → accordion-DhybkUP0.cjs.js.map} +1 -1
- package/dist/chunks/{accordion-BazoFx8H.es.js → accordion-DwkpvHwM.es.js} +3 -3
- package/dist/chunks/{accordion-BazoFx8H.es.js.map → accordion-DwkpvHwM.es.js.map} +1 -1
- package/dist/chunks/alert-BlkniDy9.cjs.js +2 -0
- package/dist/chunks/alert-BlkniDy9.cjs.js.map +1 -0
- package/dist/chunks/{alert-DafE92Ep.es.js → alert-CVXQqjXr.es.js} +33 -33
- package/dist/chunks/alert-CVXQqjXr.es.js.map +1 -0
- package/dist/chunks/{button-rMTplznF.es.js → button-B1VvTs1w.es.js} +5 -5
- package/dist/chunks/{button-rMTplznF.es.js.map → button-B1VvTs1w.es.js.map} +1 -1
- package/dist/chunks/{button-DEenpJMD.cjs.js → button-CrUeW0pR.cjs.js} +2 -2
- package/dist/chunks/{button-DEenpJMD.cjs.js.map → button-CrUeW0pR.cjs.js.map} +1 -1
- package/dist/chunks/calendar-BiE914Ki.cjs.js +2 -0
- package/dist/chunks/calendar-BiE914Ki.cjs.js.map +1 -0
- package/dist/chunks/{calendar-B_6JEmid.es.js → calendar-D7pzgXqX.es.js} +27 -18
- package/dist/chunks/calendar-D7pzgXqX.es.js.map +1 -0
- package/dist/chunks/{checkbox-CBESN7DZ.cjs.js → checkbox-CVnNylPS.cjs.js} +2 -2
- package/dist/chunks/{checkbox-CBESN7DZ.cjs.js.map → checkbox-CVnNylPS.cjs.js.map} +1 -1
- package/dist/chunks/{checkbox-BAfhgr2Q.es.js → checkbox-CjR64WWv.es.js} +5 -5
- package/dist/chunks/{checkbox-BAfhgr2Q.es.js.map → checkbox-CjR64WWv.es.js.map} +1 -1
- package/dist/chunks/{collapsible-motion-D0FWLqB-.cjs.js → collapsible-motion-CUcSKaFQ.cjs.js} +2 -2
- package/dist/chunks/{collapsible-motion-D0FWLqB-.cjs.js.map → collapsible-motion-CUcSKaFQ.cjs.js.map} +1 -1
- package/dist/chunks/{collapsible-motion-BAHapRD_.es.js → collapsible-motion-CqJQvrAr.es.js} +3 -3
- package/dist/chunks/{collapsible-motion-BAHapRD_.es.js.map → collapsible-motion-CqJQvrAr.es.js.map} +1 -1
- package/dist/chunks/combobox-Bm_d6SaB.cjs.js +2 -0
- package/dist/chunks/{combobox-CJEs8K1H.cjs.js.map → combobox-Bm_d6SaB.cjs.js.map} +1 -1
- package/dist/chunks/{combobox-Dcaw-Scl.es.js → combobox-g3cCFSMZ.es.js} +127 -128
- package/dist/chunks/{combobox-Dcaw-Scl.es.js.map → combobox-g3cCFSMZ.es.js.map} +1 -1
- package/dist/chunks/data-table--7Qxgjb7.cjs.js +2 -0
- package/dist/chunks/data-table--7Qxgjb7.cjs.js.map +1 -0
- package/dist/chunks/data-table-Dnp2C_pq.es.js +4176 -0
- package/dist/chunks/data-table-Dnp2C_pq.es.js.map +1 -0
- package/dist/chunks/{date-input-Edn9vWV1.es.js → date-input-CRnreBK0.es.js} +4 -4
- package/dist/chunks/{date-input-Edn9vWV1.es.js.map → date-input-CRnreBK0.es.js.map} +1 -1
- package/dist/chunks/{date-input-CbJeRnmd.cjs.js → date-input-CXFII_3C.cjs.js} +2 -2
- package/dist/chunks/{date-input-CbJeRnmd.cjs.js.map → date-input-CXFII_3C.cjs.js.map} +1 -1
- package/dist/chunks/{date-picker-Bedy6752.cjs.js → date-picker-BzSXCoJ0.cjs.js} +2 -2
- package/dist/chunks/{date-picker-Bedy6752.cjs.js.map → date-picker-BzSXCoJ0.cjs.js.map} +1 -1
- package/dist/chunks/{date-picker-DvI-NGBn.es.js → date-picker-Zz2Sp3S6.es.js} +16 -18
- package/dist/chunks/{date-picker-DvI-NGBn.es.js.map → date-picker-Zz2Sp3S6.es.js.map} +1 -1
- package/dist/chunks/{date-range-picker-BoYoffUD.es.js → date-range-picker-B2Cln3mU.es.js} +15 -17
- package/dist/chunks/{date-range-picker-BoYoffUD.es.js.map → date-range-picker-B2Cln3mU.es.js.map} +1 -1
- package/dist/chunks/{date-range-picker-odYIm4fD.cjs.js → date-range-picker-H_YtkQRE.cjs.js} +2 -2
- package/dist/chunks/{date-range-picker-odYIm4fD.cjs.js.map → date-range-picker-H_YtkQRE.cjs.js.map} +1 -1
- package/dist/chunks/{date-range-picker.field-CzsXm49P.es.js → date-range-picker.field-BUaFYM2O.es.js} +3 -3
- package/dist/chunks/{date-range-picker.field-CzsXm49P.es.js.map → date-range-picker.field-BUaFYM2O.es.js.map} +1 -1
- package/dist/chunks/{date-range-picker.field-DTWGHjdx.cjs.js → date-range-picker.field-CS0YU89_.cjs.js} +2 -2
- package/dist/chunks/{date-range-picker.field-DTWGHjdx.cjs.js.map → date-range-picker.field-CS0YU89_.cjs.js.map} +1 -1
- package/dist/chunks/{dialog-CMGeFzws.cjs.js → dialog-D7sGE9KU.cjs.js} +2 -2
- package/dist/chunks/{dialog-CMGeFzws.cjs.js.map → dialog-D7sGE9KU.cjs.js.map} +1 -1
- package/dist/chunks/{dialog-DuiXnZGx.es.js → dialog-DPpvAxDq.es.js} +2 -2
- package/dist/chunks/{dialog-DuiXnZGx.es.js.map → dialog-DPpvAxDq.es.js.map} +1 -1
- package/dist/chunks/{dialog.close-trigger-BNvTsWOn.es.js → dialog.close-trigger-BhUQxKIh.es.js} +7 -7
- package/dist/chunks/{dialog.close-trigger-BNvTsWOn.es.js.map → dialog.close-trigger-BhUQxKIh.es.js.map} +1 -1
- package/dist/chunks/{dialog.close-trigger-Crx_OdhW.cjs.js → dialog.close-trigger-Y9dS7xOy.cjs.js} +2 -2
- package/dist/chunks/{dialog.close-trigger-Crx_OdhW.cjs.js.map → dialog.close-trigger-Y9dS7xOy.cjs.js.map} +1 -1
- package/dist/chunks/{draggable-list-DR2KKaO_.cjs.js → draggable-list-TkB0lPBh.cjs.js} +3 -3
- package/dist/chunks/draggable-list-TkB0lPBh.cjs.js.map +1 -0
- package/dist/chunks/{draggable-list-BB8IGQJ6.es.js → draggable-list-ibWoXfeJ.es.js} +332 -318
- package/dist/chunks/draggable-list-ibWoXfeJ.es.js.map +1 -0
- package/dist/chunks/{drawer-DUVlTd1F.cjs.js → drawer-DZ75mvzL.cjs.js} +2 -2
- package/dist/chunks/{drawer-DUVlTd1F.cjs.js.map → drawer-DZ75mvzL.cjs.js.map} +1 -1
- package/dist/chunks/{drawer-hKr6SpSe.es.js → drawer-ZczUeqdd.es.js} +8 -8
- package/dist/chunks/{drawer-hKr6SpSe.es.js.map → drawer-ZczUeqdd.es.js.map} +1 -1
- package/dist/chunks/{extract-style-props-CBaCGha4.cjs.js → extract-style-props-B6-o20G1.cjs.js} +2 -2
- package/dist/chunks/{extract-style-props-CBaCGha4.cjs.js.map → extract-style-props-B6-o20G1.cjs.js.map} +1 -1
- package/dist/chunks/{extract-style-props-Cw0ebuoO.es.js → extract-style-props-fH5EHRZU.es.js} +2 -2
- package/dist/chunks/{extract-style-props-Cw0ebuoO.es.js.map → extract-style-props-fH5EHRZU.es.js.map} +1 -1
- package/dist/chunks/{form-field-DBi9CFok.es.js → form-field-C25xvMEM.es.js} +4 -4
- package/dist/chunks/form-field-C25xvMEM.es.js.map +1 -0
- package/dist/chunks/form-field-CpRzgqpq.cjs.js +2 -0
- package/dist/chunks/form-field-CpRzgqpq.cjs.js.map +1 -0
- package/dist/chunks/{getScrollParent-BsNSsJla.es.js → getScrollParent-g7luwBTz.es.js} +2 -2
- package/dist/chunks/{getScrollParent-BsNSsJla.es.js.map → getScrollParent-g7luwBTz.es.js.map} +1 -1
- package/dist/chunks/{heading-Ck9HCM5P.es.js → heading-BfaL2s7d.es.js} +2 -2
- package/dist/chunks/{heading-Ck9HCM5P.es.js.map → heading-BfaL2s7d.es.js.map} +1 -1
- package/dist/chunks/{icon-button-DJZJwO7E.cjs.js → icon-button-C_itb6iA.cjs.js} +2 -2
- package/dist/chunks/{icon-button-DJZJwO7E.cjs.js.map → icon-button-C_itb6iA.cjs.js.map} +1 -1
- package/dist/chunks/{icon-button-Bvr0zLGt.es.js → icon-button-XkzBkGuJ.es.js} +2 -2
- package/dist/chunks/{icon-button-Bvr0zLGt.es.js.map → icon-button-XkzBkGuJ.es.js.map} +1 -1
- package/dist/chunks/{icon-toggle-button-BlY5NEmP.es.js → icon-toggle-button-D4MFHBgl.es.js} +2 -2
- package/dist/chunks/{icon-toggle-button-BlY5NEmP.es.js.map → icon-toggle-button-D4MFHBgl.es.js.map} +1 -1
- package/dist/chunks/{icon-toggle-button-CUmglgfA.cjs.js → icon-toggle-button-D562D8WP.cjs.js} +2 -2
- package/dist/chunks/{icon-toggle-button-CUmglgfA.cjs.js.map → icon-toggle-button-D562D8WP.cjs.js.map} +1 -1
- package/dist/chunks/{index-CFfbr5i_.cjs.js → index-8m2zx8YL.cjs.js} +3 -3
- package/dist/chunks/index-8m2zx8YL.cjs.js.map +1 -0
- package/dist/chunks/{index-BGkAxVw_.es.js → index-B7wlrXvj.es.js} +22 -39
- package/dist/chunks/index-B7wlrXvj.es.js.map +1 -0
- package/dist/chunks/{link-CU-7XY0h.es.js → link-CPnL46cY.es.js} +3 -3
- package/dist/chunks/{link-CU-7XY0h.es.js.map → link-CPnL46cY.es.js.map} +1 -1
- package/dist/chunks/{localized-field-Cfr2yWfg.cjs.js → localized-field-ByW-vsvR.cjs.js} +2 -2
- package/dist/chunks/{localized-field-Cfr2yWfg.cjs.js.map → localized-field-ByW-vsvR.cjs.js.map} +1 -1
- package/dist/chunks/{localized-field-CmbkpZ4q.es.js → localized-field-DyZpSuGk.es.js} +23 -23
- package/dist/chunks/{localized-field-CmbkpZ4q.es.js.map → localized-field-DyZpSuGk.es.js.map} +1 -1
- package/dist/chunks/{menu-KGSl9Em7.cjs.js → menu-CJeqjRAs.cjs.js} +2 -2
- package/dist/chunks/{menu-KGSl9Em7.cjs.js.map → menu-CJeqjRAs.cjs.js.map} +1 -1
- package/dist/chunks/{menu-DG4V0LSQ.es.js → menu-CaSPNND_.es.js} +6 -6
- package/dist/chunks/{menu-DG4V0LSQ.es.js.map → menu-CaSPNND_.es.js.map} +1 -1
- package/dist/chunks/{money-input-CGMeW-uD.cjs.js → money-input-BT3JhOpu.cjs.js} +2 -2
- package/dist/chunks/{money-input-CGMeW-uD.cjs.js.map → money-input-BT3JhOpu.cjs.js.map} +1 -1
- package/dist/chunks/{money-input-Dci2k5rg.es.js → money-input-D6_TFZB-.es.js} +5 -5
- package/dist/chunks/{money-input-Dci2k5rg.es.js.map → money-input-D6_TFZB-.es.js.map} +1 -1
- package/dist/chunks/{multiline-text-input-IMPfRfkg.cjs.js → multiline-text-input-BWEsaxf_.cjs.js} +2 -2
- package/dist/chunks/{multiline-text-input-IMPfRfkg.cjs.js.map → multiline-text-input-BWEsaxf_.cjs.js.map} +1 -1
- package/dist/chunks/{multiline-text-input-DvnSJca6.es.js → multiline-text-input-DqLmTSr5.es.js} +3 -3
- package/dist/chunks/{multiline-text-input-DvnSJca6.es.js.map → multiline-text-input-DqLmTSr5.es.js.map} +1 -1
- package/dist/chunks/{nimbus-provider-CymDVsXZ.es.js → nimbus-provider-Bap0WHRm.es.js} +9 -9
- package/dist/chunks/{nimbus-provider-CymDVsXZ.es.js.map → nimbus-provider-Bap0WHRm.es.js.map} +1 -1
- package/dist/chunks/{nimbus-provider-DyYGXHWz.cjs.js → nimbus-provider-BarcIhYi.cjs.js} +2 -2
- package/dist/chunks/{nimbus-provider-DyYGXHWz.cjs.js.map → nimbus-provider-BarcIhYi.cjs.js.map} +1 -1
- package/dist/chunks/{number-input-D5uge6-t.cjs.js → number-input-BskHV8w5.cjs.js} +2 -2
- package/dist/chunks/{number-input-D5uge6-t.cjs.js.map → number-input-BskHV8w5.cjs.js.map} +1 -1
- package/dist/chunks/{number-input-CoVt943T.es.js → number-input-CerB7jp0.es.js} +4 -4
- package/dist/chunks/{number-input-CoVt943T.es.js.map → number-input-CerB7jp0.es.js.map} +1 -1
- package/dist/chunks/{openLink-D7--QlSJ.es.js → openLink-BNz58j4a.es.js} +7 -7
- package/dist/chunks/{openLink-D7--QlSJ.es.js.map → openLink-BNz58j4a.es.js.map} +1 -1
- package/dist/chunks/{pagination-C4_2Ov7h.es.js → pagination-dlHn3OhV.es.js} +25 -25
- package/dist/chunks/{pagination-C4_2Ov7h.es.js.map → pagination-dlHn3OhV.es.js.map} +1 -1
- package/dist/chunks/{pagination-Dbf6i8je.cjs.js → pagination-xj41eBPX.cjs.js} +2 -2
- package/dist/chunks/{pagination-Dbf6i8je.cjs.js.map → pagination-xj41eBPX.cjs.js.map} +1 -1
- package/dist/chunks/password-input-DGtJisDd.cjs.js +2 -0
- package/dist/chunks/password-input-DGtJisDd.cjs.js.map +1 -0
- package/dist/chunks/{password-input-D-WKBfJ_.es.js → password-input-Dw-m0lej.es.js} +11 -11
- package/dist/chunks/password-input-Dw-m0lej.es.js.map +1 -0
- package/dist/chunks/{popover-B5j28gJx.es.js → popover-CaE5pDl9.es.js} +2 -2
- package/dist/chunks/{popover-B5j28gJx.es.js.map → popover-CaE5pDl9.es.js.map} +1 -1
- package/dist/chunks/{popover-D0TkE271.cjs.js → popover-DY7ASSCU.cjs.js} +2 -2
- package/dist/chunks/{popover-D0TkE271.cjs.js.map → popover-DY7ASSCU.cjs.js.map} +1 -1
- package/dist/chunks/{progress-bar-DrK5bppD.es.js → progress-bar-CYd6T1Ax.es.js} +2 -2
- package/dist/chunks/{progress-bar-DrK5bppD.es.js.map → progress-bar-CYd6T1Ax.es.js.map} +1 -1
- package/dist/chunks/{progress-bar-CJqyWOZe.cjs.js → progress-bar-Dx9Zr5Yh.cjs.js} +2 -2
- package/dist/chunks/{progress-bar-CJqyWOZe.cjs.js.map → progress-bar-Dx9Zr5Yh.cjs.js.map} +1 -1
- package/dist/chunks/{radio-input-BL1YItkC.es.js → radio-input-Dg7PXbQa.es.js} +4 -4
- package/dist/chunks/{radio-input-BL1YItkC.es.js.map → radio-input-Dg7PXbQa.es.js.map} +1 -1
- package/dist/chunks/{radio-input-1myCCuNN.cjs.js → radio-input-yA7MF_jw.cjs.js} +2 -2
- package/dist/chunks/{radio-input-1myCCuNN.cjs.js.map → radio-input-yA7MF_jw.cjs.js.map} +1 -1
- package/dist/chunks/{range-calendar-C_2BhVos.es.js → range-calendar-D6nonjnz.es.js} +40 -31
- package/dist/chunks/range-calendar-D6nonjnz.es.js.map +1 -0
- package/dist/chunks/range-calendar-DhKTQPnz.cjs.js +2 -0
- package/dist/chunks/range-calendar-DhKTQPnz.cjs.js.map +1 -0
- package/dist/chunks/{rich-text-input-rd0Z_BZN.cjs.js → rich-text-input-CViBsj3Y.cjs.js} +2 -2
- package/dist/chunks/{rich-text-input-rd0Z_BZN.cjs.js.map → rich-text-input-CViBsj3Y.cjs.js.map} +1 -1
- package/dist/chunks/{rich-text-input-BH9R2Ndd.es.js → rich-text-input-hBorJHFw.es.js} +9 -9
- package/dist/chunks/{rich-text-input-BH9R2Ndd.es.js.map → rich-text-input-hBorJHFw.es.js.map} +1 -1
- package/dist/chunks/{scoped-search-input-DZYDPxMi.es.js → scoped-search-input-B7rDiJuj.es.js} +5 -5
- package/dist/chunks/{scoped-search-input-DZYDPxMi.es.js.map → scoped-search-input-B7rDiJuj.es.js.map} +1 -1
- package/dist/chunks/{scoped-search-input-DNmFeyN7.cjs.js → scoped-search-input-C6B7Szzk.cjs.js} +2 -2
- package/dist/chunks/{scoped-search-input-DNmFeyN7.cjs.js.map → scoped-search-input-C6B7Szzk.cjs.js.map} +1 -1
- package/dist/chunks/{scrollIntoView-DniANfOx.es.js → scrollIntoView-CRn_Y0bq.es.js} +4 -4
- package/dist/chunks/{scrollIntoView-DniANfOx.es.js.map → scrollIntoView-CRn_Y0bq.es.js.map} +1 -1
- package/dist/chunks/{search-input-CbKf6uv-.es.js → search-input-tna-iiqy.es.js} +7 -7
- package/dist/chunks/{search-input-CbKf6uv-.es.js.map → search-input-tna-iiqy.es.js.map} +1 -1
- package/dist/chunks/{search-input-Cuqj5Ozc.cjs.js → search-input-vq7lviez.cjs.js} +2 -2
- package/dist/chunks/{search-input-Cuqj5Ozc.cjs.js.map → search-input-vq7lviez.cjs.js.map} +1 -1
- package/dist/chunks/{select-C2lIA5hg.es.js → select-B0WZuFVc.es.js} +66 -67
- package/dist/chunks/{select-C2lIA5hg.es.js.map → select-B0WZuFVc.es.js.map} +1 -1
- package/dist/chunks/select-wD3QlanS.cjs.js +2 -0
- package/dist/chunks/{select-CWaI47Kc.cjs.js.map → select-wD3QlanS.cjs.js.map} +1 -1
- package/dist/chunks/{separator-DVnpuMAc.es.js → separator-Dng72n3L.es.js} +4 -4
- package/dist/chunks/{separator-DVnpuMAc.es.js.map → separator-Dng72n3L.es.js.map} +1 -1
- package/dist/chunks/{separator-D75V0Oga.cjs.js → separator-TrQT9Pcb.cjs.js} +2 -2
- package/dist/chunks/{separator-D75V0Oga.cjs.js.map → separator-TrQT9Pcb.cjs.js.map} +1 -1
- package/dist/chunks/split-button-BH500vls.cjs.js +2 -0
- package/dist/chunks/split-button-BH500vls.cjs.js.map +1 -0
- package/dist/chunks/{split-button-C1PFrcU6.es.js → split-button-pF0iIa_0.es.js} +10 -10
- package/dist/chunks/split-button-pF0iIa_0.es.js.map +1 -0
- package/dist/chunks/{switch-2AsRNDVU.cjs.js → switch-D3tDl7RG.cjs.js} +2 -2
- package/dist/chunks/{switch-2AsRNDVU.cjs.js.map → switch-D3tDl7RG.cjs.js.map} +1 -1
- package/dist/chunks/{switch-DVQRB0wu.es.js → switch-DJENPCZA.es.js} +4 -4
- package/dist/chunks/{switch-DVQRB0wu.es.js.map → switch-DJENPCZA.es.js.map} +1 -1
- package/dist/chunks/tabs-Bj24YiXX.cjs.js +2 -0
- package/dist/chunks/{tabs-BlcjUZnC.cjs.js.map → tabs-Bj24YiXX.cjs.js.map} +1 -1
- package/dist/chunks/{tabs-SeVATsGV.es.js → tabs-D3SqKC9V.es.js} +35 -35
- package/dist/chunks/{tabs-SeVATsGV.es.js.map → tabs-D3SqKC9V.es.js.map} +1 -1
- package/dist/chunks/{tag-group-DrCKPNqX.es.js → tag-group-DQ72dsVp.es.js} +13 -13
- package/dist/chunks/{tag-group-DrCKPNqX.es.js.map → tag-group-DQ72dsVp.es.js.map} +1 -1
- package/dist/chunks/tag-group-Djb2ouRY.cjs.js +2 -0
- package/dist/chunks/{tag-group-DexGJ8Hf.cjs.js.map → tag-group-Djb2ouRY.cjs.js.map} +1 -1
- package/dist/chunks/{text-input-Bm7-FMPR.cjs.js → text-input-B5tizBg4.cjs.js} +2 -2
- package/dist/chunks/{text-input-Bm7-FMPR.cjs.js.map → text-input-B5tizBg4.cjs.js.map} +1 -1
- package/dist/chunks/{text-input-CSkQFwGX.es.js → text-input-DBFEKmrv.es.js} +3 -3
- package/dist/chunks/{text-input-CSkQFwGX.es.js.map → text-input-DBFEKmrv.es.js.map} +1 -1
- package/dist/chunks/{time-input-ClOP5fJr.es.js → time-input-BJ1nDsyZ.es.js} +4 -4
- package/dist/chunks/{time-input-ClOP5fJr.es.js.map → time-input-BJ1nDsyZ.es.js.map} +1 -1
- package/dist/chunks/{time-input-BHyImNO3.cjs.js → time-input-DWrgu6Yp.cjs.js} +2 -2
- package/dist/chunks/{time-input-BHyImNO3.cjs.js.map → time-input-DWrgu6Yp.cjs.js.map} +1 -1
- package/dist/chunks/{toggle-button-Rczis1rR.es.js → toggle-button-Dm4hPGPr.es.js} +4 -4
- package/dist/chunks/{toggle-button-Rczis1rR.es.js.map → toggle-button-Dm4hPGPr.es.js.map} +1 -1
- package/dist/chunks/{toggle-button-group-TrFHgAeL.es.js → toggle-button-group-DMH0nd7S.es.js} +3 -3
- package/dist/chunks/{toggle-button-group-TrFHgAeL.es.js.map → toggle-button-group-DMH0nd7S.es.js.map} +1 -1
- package/dist/chunks/{toggle-button-group-BQczQ6D_.cjs.js → toggle-button-group-Lfn3zYmC.cjs.js} +2 -2
- package/dist/chunks/{toggle-button-group-BQczQ6D_.cjs.js.map → toggle-button-group-Lfn3zYmC.cjs.js.map} +1 -1
- package/dist/chunks/{toggle-button-group.recipe-DgySRvOW.cjs.js → toggle-button-group.recipe-COF-yHYR.cjs.js} +2 -2
- package/dist/chunks/{toggle-button-group.recipe-DgySRvOW.cjs.js.map → toggle-button-group.recipe-COF-yHYR.cjs.js.map} +1 -1
- package/dist/chunks/{toggle-button-group.recipe-CbCnJQP3.es.js → toggle-button-group.recipe-Cl3PTeGf.es.js} +2 -16
- package/dist/chunks/toggle-button-group.recipe-Cl3PTeGf.es.js.map +1 -0
- package/dist/chunks/{toggle-button-enJHTjsJ.cjs.js → toggle-button-mL9CAReh.cjs.js} +2 -2
- package/dist/chunks/{toggle-button-enJHTjsJ.cjs.js.map → toggle-button-mL9CAReh.cjs.js.map} +1 -1
- package/dist/chunks/{toolbar-CNqSGtQi.cjs.js → toolbar-Df-6gFqW.cjs.js} +2 -2
- package/dist/chunks/{toolbar-CNqSGtQi.cjs.js.map → toolbar-Df-6gFqW.cjs.js.map} +1 -1
- package/dist/chunks/{toolbar-CsuzuQNn.es.js → toolbar-wCiInDj2.es.js} +3 -3
- package/dist/chunks/{toolbar-CsuzuQNn.es.js.map → toolbar-wCiInDj2.es.js.map} +1 -1
- package/dist/chunks/{useButton-DEV993k7.es.js → useButton-C6AOJI9V.es.js} +2 -2
- package/dist/chunks/{useButton-DEV993k7.es.js.map → useButton-C6AOJI9V.es.js.map} +1 -1
- package/dist/chunks/{useDateFormatter-YLMdKUmg.es.js → useDateFormatter-eE8d1TkO.es.js} +2 -2
- package/dist/chunks/{useDateFormatter-YLMdKUmg.es.js.map → useDateFormatter-eE8d1TkO.es.js.map} +1 -1
- package/dist/chunks/useGridListItem-BETI-KGO.cjs.js +2 -0
- package/dist/chunks/useGridListItem-BETI-KGO.cjs.js.map +1 -0
- package/dist/chunks/{useHighlightSelectionDescription-DH3XBG7f.es.js → useGridListItem-WBYPB9KF.es.js} +406 -163
- package/dist/chunks/useGridListItem-WBYPB9KF.es.js.map +1 -0
- package/dist/chunks/useListState-BFNT8oUW.es.js +139 -0
- package/dist/chunks/useListState-BFNT8oUW.es.js.map +1 -0
- package/dist/chunks/useListState-QQtJHpsQ.cjs.js +2 -0
- package/dist/chunks/useListState-QQtJHpsQ.cjs.js.map +1 -0
- package/dist/chunks/{usePress-D9qOoxbA.es.js → usePress-HeLch-fy.es.js} +2 -2
- package/dist/chunks/{usePress-D9qOoxbA.es.js.map → usePress-HeLch-fy.es.js.map} +1 -1
- package/dist/chunks/{useSingleSelectListState-BawVWofI.cjs.js → useSingleSelectListState-CsD7W9nK.cjs.js} +2 -2
- package/dist/chunks/{useSingleSelectListState-BawVWofI.cjs.js.map → useSingleSelectListState-CsD7W9nK.cjs.js.map} +1 -1
- package/dist/chunks/{useSingleSelectListState-Bjn8R8w0.es.js → useSingleSelectListState-DcU-tU_H.es.js} +2 -2
- package/dist/chunks/{useSingleSelectListState-Bjn8R8w0.es.js.map → useSingleSelectListState-DcU-tU_H.es.js.map} +1 -1
- package/dist/chunks/{useToggle-Cc5uCpc9.es.js → useToggle-XQtoJnll.es.js} +2 -2
- package/dist/chunks/{useToggle-Cc5uCpc9.es.js.map → useToggle-XQtoJnll.es.js.map} +1 -1
- package/dist/components/accordion.cjs +1 -1
- package/dist/components/accordion.es.js +1 -1
- package/dist/components/alert/alert.recipe.d.ts +0 -22
- package/dist/components/alert/alert.slots.d.ts +4 -9
- package/dist/components/alert/alert.types.d.ts +5 -3
- package/dist/components/alert.cjs +1 -1
- package/dist/components/alert.es.js +1 -1
- package/dist/components/button/button.recipe.d.ts +0 -14
- package/dist/components/button/button.slots.d.ts +2 -2
- package/dist/components/button/button.types.d.ts +6 -5
- package/dist/components/button.cjs +1 -1
- package/dist/components/button.es.js +1 -1
- package/dist/components/calendar.cjs +1 -1
- package/dist/components/calendar.es.js +1 -1
- package/dist/components/checkbox.cjs +1 -1
- package/dist/components/checkbox.es.js +1 -1
- package/dist/components/collapsible-motion.cjs +1 -1
- package/dist/components/collapsible-motion.es.js +1 -1
- package/dist/components/combobox.cjs +1 -1
- package/dist/components/combobox.es.js +1 -1
- package/dist/components/components.cjs +1 -1
- package/dist/components/components.es.js +1 -1
- package/dist/components/data-table/components/data-table.layout-settings-panel.d.ts +4 -0
- package/dist/components/data-table/components/data-table.manager.d.ts +9 -0
- package/dist/components/data-table/components/data-table.visible-columns-panel.d.ts +7 -0
- package/dist/components/data-table/constants.d.ts +4 -0
- package/dist/components/data-table/data-table.d.ts +24 -1
- package/dist/components/data-table/data-table.i18n.d.ts +120 -0
- package/dist/components/data-table/data-table.slots.d.ts +2 -2
- package/dist/components/data-table/data-table.types.d.ts +20 -7
- package/dist/components/data-table/index.d.ts +1 -0
- package/dist/components/data-table/test-data.d.ts +4 -1
- package/dist/components/data-table.cjs +1 -1
- package/dist/components/data-table.es.js +10 -8
- package/dist/components/date-input.cjs +1 -1
- package/dist/components/date-input.es.js +1 -1
- package/dist/components/date-picker.cjs +1 -1
- package/dist/components/date-picker.es.js +1 -1
- package/dist/components/date-range-picker-field.cjs +1 -1
- package/dist/components/date-range-picker-field.es.js +1 -1
- package/dist/components/date-range-picker.cjs +1 -1
- package/dist/components/date-range-picker.es.js +1 -1
- package/dist/components/dialog.cjs +1 -1
- package/dist/components/dialog.es.js +1 -1
- package/dist/components/draggable-list.cjs +1 -1
- package/dist/components/draggable-list.es.js +1 -1
- package/dist/components/drawer.cjs +1 -1
- package/dist/components/drawer.es.js +1 -1
- package/dist/components/fields.cjs +1 -1
- package/dist/components/fields.es.js +1 -1
- package/dist/components/form-field.cjs +1 -1
- package/dist/components/form-field.es.js +1 -1
- package/dist/components/heading.es.js +1 -1
- package/dist/components/icon-button.cjs +1 -1
- package/dist/components/icon-button.es.js +1 -1
- package/dist/components/icon-toggle-button.cjs +1 -1
- package/dist/components/icon-toggle-button.es.js +1 -1
- package/dist/components/link.es.js +1 -1
- package/dist/components/loading-spinner/loading-spinner.recipe.d.ts +1 -1
- package/dist/components/loading-spinner/loading-spinner.slots.d.ts +5 -2
- package/dist/components/loading-spinner/loading-spinner.types.d.ts +3 -6
- package/dist/components/localized-field.cjs +1 -1
- package/dist/components/localized-field.es.js +1 -1
- package/dist/components/money-input.cjs +1 -1
- package/dist/components/money-input.es.js +1 -1
- package/dist/components/multiline-text-input.cjs +1 -1
- package/dist/components/multiline-text-input.es.js +1 -1
- package/dist/components/nimbus-provider.cjs +1 -1
- package/dist/components/nimbus-provider.es.js +1 -1
- package/dist/components/number-input.cjs +1 -1
- package/dist/components/number-input.es.js +1 -1
- package/dist/components/pagination.cjs +1 -1
- package/dist/components/pagination.es.js +1 -1
- package/dist/components/password-input.cjs +1 -1
- package/dist/components/password-input.es.js +1 -1
- package/dist/components/patterns.cjs +1 -1
- package/dist/components/patterns.es.js +1 -1
- package/dist/components/popover.cjs +1 -1
- package/dist/components/popover.es.js +1 -1
- package/dist/components/progress-bar.cjs +1 -1
- package/dist/components/progress-bar.es.js +1 -1
- package/dist/components/radio-input.cjs +1 -1
- package/dist/components/radio-input.es.js +1 -1
- package/dist/components/range-calendar.cjs +1 -1
- package/dist/components/range-calendar.es.js +1 -1
- package/dist/components/rich-text-input.cjs +1 -1
- package/dist/components/rich-text-input.es.js +1 -1
- package/dist/components/scoped-search-input.cjs +1 -1
- package/dist/components/scoped-search-input.es.js +1 -1
- package/dist/components/search-input.cjs +1 -1
- package/dist/components/search-input.es.js +1 -1
- package/dist/components/select.cjs +1 -1
- package/dist/components/select.es.js +1 -1
- package/dist/components/separator.cjs +1 -1
- package/dist/components/separator.es.js +1 -1
- package/dist/components/split-button/split-button.types.d.ts +1 -1
- package/dist/components/split-button.cjs +1 -1
- package/dist/components/split-button.es.js +1 -1
- package/dist/components/switch.cjs +1 -1
- package/dist/components/switch.es.js +1 -1
- package/dist/components/tabs.cjs +1 -1
- package/dist/components/tabs.es.js +1 -1
- package/dist/components/tag-group.cjs +1 -1
- package/dist/components/tag-group.es.js +1 -1
- package/dist/components/text-input.cjs +1 -1
- package/dist/components/text-input.es.js +1 -1
- package/dist/components/time-input.cjs +1 -1
- package/dist/components/time-input.es.js +1 -1
- package/dist/components/toggle-button/toggle-button.recipe.d.ts +0 -14
- package/dist/components/toggle-button/toggle-button.slots.d.ts +4 -11
- package/dist/components/toggle-button/toggle-button.types.d.ts +5 -4
- package/dist/components/toggle-button-group/toggle-button-group.recipe.d.ts +1 -1
- package/dist/components/toggle-button-group/toggle-button-group.types.d.ts +6 -4
- package/dist/components/toggle-button-group.cjs +1 -1
- package/dist/components/toggle-button-group.es.js +1 -1
- package/dist/components/toggle-button.cjs +1 -1
- package/dist/components/toggle-button.es.js +1 -1
- package/dist/components/toolbar.cjs +1 -1
- package/dist/components/toolbar.es.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.es.js +136 -134
- package/dist/index.es.js.map +1 -1
- package/dist/theme/recipes/index.d.ts +1 -29
- package/dist/theme/slot-recipes/index.d.ts +1 -23
- package/dist/type-utils/shared-types.d.ts +3 -6
- package/package.json +5 -5
- package/dist/chunks/DragAndDrop-35iVlv_E.cjs.js +0 -2
- package/dist/chunks/DragAndDrop-35iVlv_E.cjs.js.map +0 -1
- package/dist/chunks/DragAndDrop-Cu_xjzZg.es.js +0 -76
- package/dist/chunks/DragAndDrop-Cu_xjzZg.es.js.map +0 -1
- package/dist/chunks/Header-BE5dOA7y.es.js +0 -59
- package/dist/chunks/Header-BE5dOA7y.es.js.map +0 -1
- package/dist/chunks/Header-Ba1_guwA.cjs.js +0 -2
- package/dist/chunks/Header-Ba1_guwA.cjs.js.map +0 -1
- package/dist/chunks/ListBox-DkXFmzHf.cjs.js +0 -2
- package/dist/chunks/ListBox-DkXFmzHf.cjs.js.map +0 -1
- package/dist/chunks/ListBox-DxgCeXuN.es.js +0 -493
- package/dist/chunks/ListBox-DxgCeXuN.es.js.map +0 -1
- package/dist/chunks/ListKeyboardDelegate-BEarLHjT.cjs.js +0 -2
- package/dist/chunks/ListKeyboardDelegate-BEarLHjT.cjs.js.map +0 -1
- package/dist/chunks/ListKeyboardDelegate-ekIDdehS.es.js +0 -159
- package/dist/chunks/ListKeyboardDelegate-ekIDdehS.es.js.map +0 -1
- package/dist/chunks/alert-BYw_3VgA.cjs.js +0 -2
- package/dist/chunks/alert-BYw_3VgA.cjs.js.map +0 -1
- package/dist/chunks/alert-DafE92Ep.es.js.map +0 -1
- package/dist/chunks/calendar-B_6JEmid.es.js.map +0 -1
- package/dist/chunks/calendar-Kd_2ZJIo.cjs.js +0 -2
- package/dist/chunks/calendar-Kd_2ZJIo.cjs.js.map +0 -1
- package/dist/chunks/combobox-CJEs8K1H.cjs.js +0 -2
- package/dist/chunks/data-table-DdnSEpEq.cjs.js +0 -2
- package/dist/chunks/data-table-DdnSEpEq.cjs.js.map +0 -1
- package/dist/chunks/data-table-zaE0wk1G.es.js +0 -3638
- package/dist/chunks/data-table-zaE0wk1G.es.js.map +0 -1
- package/dist/chunks/draggable-list-BB8IGQJ6.es.js.map +0 -1
- package/dist/chunks/draggable-list-DR2KKaO_.cjs.js.map +0 -1
- package/dist/chunks/form-field-DBi9CFok.es.js.map +0 -1
- package/dist/chunks/form-field-Dn5VxoQ2.cjs.js +0 -2
- package/dist/chunks/form-field-Dn5VxoQ2.cjs.js.map +0 -1
- package/dist/chunks/index-BGkAxVw_.es.js.map +0 -1
- package/dist/chunks/index-CFfbr5i_.cjs.js.map +0 -1
- package/dist/chunks/inertValue-B7loUihk.es.js +0 -9
- package/dist/chunks/inertValue-B7loUihk.es.js.map +0 -1
- package/dist/chunks/inertValue-BWmZ1afe.cjs.js +0 -2
- package/dist/chunks/inertValue-BWmZ1afe.cjs.js.map +0 -1
- package/dist/chunks/password-input-D-WKBfJ_.es.js.map +0 -1
- package/dist/chunks/password-input-DApa74CT.cjs.js +0 -2
- package/dist/chunks/password-input-DApa74CT.cjs.js.map +0 -1
- package/dist/chunks/range-calendar-C_2BhVos.es.js.map +0 -1
- package/dist/chunks/range-calendar-M5itlXS-.cjs.js +0 -2
- package/dist/chunks/range-calendar-M5itlXS-.cjs.js.map +0 -1
- package/dist/chunks/select-CWaI47Kc.cjs.js +0 -2
- package/dist/chunks/split-button-C1PFrcU6.es.js.map +0 -1
- package/dist/chunks/split-button-DhxZShYM.cjs.js +0 -2
- package/dist/chunks/split-button-DhxZShYM.cjs.js.map +0 -1
- package/dist/chunks/tabs-BlcjUZnC.cjs.js +0 -2
- package/dist/chunks/tag-group-DexGJ8Hf.cjs.js +0 -2
- package/dist/chunks/toggle-button-group.recipe-CbCnJQP3.es.js.map +0 -1
- package/dist/chunks/useGridListItem-DSRAVcC0.es.js +0 -251
- package/dist/chunks/useGridListItem-DSRAVcC0.es.js.map +0 -1
- package/dist/chunks/useGridListItem-Dt8Kui_9.cjs.js +0 -2
- package/dist/chunks/useGridListItem-Dt8Kui_9.cjs.js.map +0 -1
- package/dist/chunks/useGridSelectionCheckbox-CB9AkcJ-.cjs.js +0 -2
- package/dist/chunks/useGridSelectionCheckbox-CB9AkcJ-.cjs.js.map +0 -1
- package/dist/chunks/useGridSelectionCheckbox-qNlOk_Zu.es.js +0 -23
- package/dist/chunks/useGridSelectionCheckbox-qNlOk_Zu.es.js.map +0 -1
- package/dist/chunks/useHighlightSelectionDescription-C37fwYgQ.cjs.js +0 -2
- package/dist/chunks/useHighlightSelectionDescription-C37fwYgQ.cjs.js.map +0 -1
- package/dist/chunks/useHighlightSelectionDescription-DH3XBG7f.es.js.map +0 -1
- package/dist/chunks/useListState-HM8Jsi0C.cjs.js +0 -2
- package/dist/chunks/useListState-HM8Jsi0C.cjs.js.map +0 -1
- package/dist/chunks/useListState-QNqJ2RZ-.es.js +0 -134
- package/dist/chunks/useListState-QNqJ2RZ-.es.js.map +0 -1
|
@@ -4,18 +4,18 @@ import { defineMessages as L, useIntl as R } from "react-intl";
|
|
|
4
4
|
import { ChevronLeft as V, ChevronRight as B } from "@commercetools/nimbus-icons";
|
|
5
5
|
import { S as F } from "./stack-CoNreM7B.es.js";
|
|
6
6
|
import { Flex as N } from "@chakra-ui/react/flex";
|
|
7
|
-
import { S as I } from "./select-
|
|
7
|
+
import { S as I } from "./select-B0WZuFVc.es.js";
|
|
8
8
|
import { T as v } from "./text-BVYJmhjj.es.js";
|
|
9
|
-
import { I as G } from "./icon-button-
|
|
10
|
-
import { N as K } from "./number-input-
|
|
9
|
+
import { I as G } from "./icon-button-XkzBkGuJ.es.js";
|
|
10
|
+
import { N as K } from "./number-input-CerB7jp0.es.js";
|
|
11
11
|
function W({
|
|
12
|
-
totalItems:
|
|
13
|
-
currentPage:
|
|
12
|
+
totalItems: n,
|
|
13
|
+
currentPage: o,
|
|
14
14
|
pageSize: p = 20,
|
|
15
15
|
onPageChange: l,
|
|
16
16
|
onPageSizeChange: u
|
|
17
17
|
}) {
|
|
18
|
-
const [m, d] = D(1), [C, z] = D(p), g =
|
|
18
|
+
const [m, d] = D(1), [C, z] = D(p), g = o !== void 0, w = g ? o : m, e = p ?? C, r = Math.max(1, Math.ceil(n / e)), a = Math.max(1, Math.min(w, r)), t = Math.min((a - 1) * e + 1, n), f = Math.min(a * e, n), h = a > 1, b = a < r, c = T(
|
|
19
19
|
(P) => {
|
|
20
20
|
const M = Math.max(1, Math.min(P, r));
|
|
21
21
|
g || d(M), l?.(M);
|
|
@@ -27,14 +27,14 @@ function W({
|
|
|
27
27
|
b && c(a + 1);
|
|
28
28
|
}, [b, a, c]), k = T(
|
|
29
29
|
(P) => {
|
|
30
|
-
const M = Math.ceil(
|
|
30
|
+
const M = Math.ceil(n / P), x = Math.min(a, M);
|
|
31
31
|
z(P), !g && x !== a && d(x), u?.(P), x !== a && l?.(x);
|
|
32
32
|
},
|
|
33
|
-
[
|
|
33
|
+
[n, a, g, l, u]
|
|
34
34
|
);
|
|
35
35
|
return j(
|
|
36
36
|
() => ({
|
|
37
|
-
totalItems:
|
|
37
|
+
totalItems: n,
|
|
38
38
|
currentPage: a,
|
|
39
39
|
pageSize: e,
|
|
40
40
|
totalPages: r,
|
|
@@ -48,7 +48,7 @@ function W({
|
|
|
48
48
|
setPageSize: k
|
|
49
49
|
}),
|
|
50
50
|
[
|
|
51
|
-
|
|
51
|
+
n,
|
|
52
52
|
a,
|
|
53
53
|
e,
|
|
54
54
|
r,
|
|
@@ -104,8 +104,8 @@ const s = /* @__PURE__ */ L({
|
|
|
104
104
|
description: "aria-label for the next page button",
|
|
105
105
|
defaultMessage: "Go to next page"
|
|
106
106
|
}
|
|
107
|
-
}), $ = (
|
|
108
|
-
const
|
|
107
|
+
}), $ = (n) => {
|
|
108
|
+
const o = R(), {
|
|
109
109
|
totalItems: p,
|
|
110
110
|
currentPage: l,
|
|
111
111
|
pageSize: u,
|
|
@@ -115,7 +115,7 @@ const s = /* @__PURE__ */ L({
|
|
|
115
115
|
"aria-label": z,
|
|
116
116
|
enablePageInput: g = !0,
|
|
117
117
|
enablePageSizeSelector: w = !0
|
|
118
|
-
} =
|
|
118
|
+
} = n, e = W({
|
|
119
119
|
totalItems: p,
|
|
120
120
|
currentPage: l,
|
|
121
121
|
pageSize: u,
|
|
@@ -141,11 +141,11 @@ const s = /* @__PURE__ */ L({
|
|
|
141
141
|
isClearable: !1,
|
|
142
142
|
selectedKey: e.pageSize.toString(),
|
|
143
143
|
onSelectionChange: a,
|
|
144
|
-
"aria-label":
|
|
144
|
+
"aria-label": o.formatMessage(s.itemsPerPage),
|
|
145
145
|
children: /* @__PURE__ */ i(I.Options, { children: r.map((t) => /* @__PURE__ */ i(I.Option, { id: t.id, children: t.name }, t.id)) })
|
|
146
146
|
}
|
|
147
147
|
),
|
|
148
|
-
/* @__PURE__ */ i(v, { color: "neutral.12", children:
|
|
148
|
+
/* @__PURE__ */ i(v, { color: "neutral.12", children: o.formatMessage(s.itemsPerPageText) })
|
|
149
149
|
] }),
|
|
150
150
|
/* @__PURE__ */ i(N, { flexGrow: "1" }),
|
|
151
151
|
/* @__PURE__ */ S(
|
|
@@ -154,7 +154,7 @@ const s = /* @__PURE__ */ L({
|
|
|
154
154
|
align: "center",
|
|
155
155
|
gap: "200",
|
|
156
156
|
role: "navigation",
|
|
157
|
-
"aria-label": z ??
|
|
157
|
+
"aria-label": z ?? o.formatMessage(s.pagination),
|
|
158
158
|
children: [
|
|
159
159
|
/* @__PURE__ */ i(
|
|
160
160
|
G,
|
|
@@ -162,13 +162,13 @@ const s = /* @__PURE__ */ L({
|
|
|
162
162
|
onClick: e.goToPreviousPage,
|
|
163
163
|
isDisabled: !e.hasPreviousPage,
|
|
164
164
|
variant: "ghost",
|
|
165
|
-
|
|
166
|
-
"aria-label":
|
|
165
|
+
colorPalette: "primary",
|
|
166
|
+
"aria-label": o.formatMessage(s.goToPreviousPage),
|
|
167
167
|
children: /* @__PURE__ */ i(V, {})
|
|
168
168
|
}
|
|
169
169
|
),
|
|
170
170
|
/* @__PURE__ */ S(N, { align: "center", gap: "200", children: [
|
|
171
|
-
/* @__PURE__ */ i(v, { color: "neutral.12", children:
|
|
171
|
+
/* @__PURE__ */ i(v, { color: "neutral.12", children: o.formatMessage(s.page) }),
|
|
172
172
|
g ? /* @__PURE__ */ i(
|
|
173
173
|
K,
|
|
174
174
|
{
|
|
@@ -179,12 +179,12 @@ const s = /* @__PURE__ */ L({
|
|
|
179
179
|
step: 1,
|
|
180
180
|
isDisabled: !1,
|
|
181
181
|
width: "9ch",
|
|
182
|
-
"aria-label":
|
|
182
|
+
"aria-label": o.formatMessage(s.currentPage),
|
|
183
183
|
"aria-current": "page"
|
|
184
184
|
}
|
|
185
185
|
) : /* @__PURE__ */ i(v, { fontWeight: "semibold", color: "neutral.12", "aria-current": "page", children: e.currentPage }),
|
|
186
|
-
/* @__PURE__ */ i(v, { color: "neutral.12", children:
|
|
187
|
-
totalPages:
|
|
186
|
+
/* @__PURE__ */ i(v, { color: "neutral.12", children: o.formatMessage(s.ofTotalPages, {
|
|
187
|
+
totalPages: o.formatNumber(e.totalPages)
|
|
188
188
|
}) })
|
|
189
189
|
] }),
|
|
190
190
|
/* @__PURE__ */ i(
|
|
@@ -193,8 +193,8 @@ const s = /* @__PURE__ */ L({
|
|
|
193
193
|
onClick: e.goToNextPage,
|
|
194
194
|
isDisabled: !e.hasNextPage,
|
|
195
195
|
variant: "ghost",
|
|
196
|
-
|
|
197
|
-
"aria-label":
|
|
196
|
+
colorPalette: "primary",
|
|
197
|
+
"aria-label": o.formatMessage(s.goToNextPage),
|
|
198
198
|
children: /* @__PURE__ */ i(B, {})
|
|
199
199
|
}
|
|
200
200
|
)
|
|
@@ -207,4 +207,4 @@ $.displayName = "Pagination";
|
|
|
207
207
|
export {
|
|
208
208
|
$ as P
|
|
209
209
|
};
|
|
210
|
-
//# sourceMappingURL=pagination-
|
|
210
|
+
//# sourceMappingURL=pagination-dlHn3OhV.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pagination-C4_2Ov7h.es.js","sources":["../../src/components/pagination/hooks/use-pagination.ts","../../src/components/pagination/pagination.i18n.ts","../../src/components/pagination/pagination.tsx"],"sourcesContent":["import { useState, useCallback, useMemo } from \"react\";\n\nexport type PaginationState = {\n /** Total number of items across all pages */\n totalItems: number;\n /** Current active page (1-based) */\n currentPage: number;\n /** Number of items displayed per page */\n pageSize: number;\n /** Total number of pages available */\n totalPages: number;\n /** Index of the first item on current page (1-based) */\n startItem: number;\n /** Index of the last item on current page (1-based) */\n endItem: number;\n /** Whether there is a previous page available */\n hasPreviousPage: boolean;\n /** Whether there is a next page available */\n hasNextPage: boolean;\n};\n\nexport type UsePaginationProps = {\n /** Total number of items to paginate */\n totalItems: number;\n /** Initial current page (1-based), defaults to 1 */\n currentPage?: number;\n /** Initial number of items per page, defaults to 10 */\n pageSize?: number;\n /** Callback fired when the current page changes */\n onPageChange?: (page: number) => void;\n /** Callback fired when the page size changes */\n onPageSizeChange?: (pageSize: number) => void;\n};\n\nexport type UsePaginationReturn = PaginationState & {\n /** Navigate to a specific page number (1-based) */\n goToPage: (page: number) => void;\n /** Navigate to the previous page, if available */\n goToPreviousPage: () => void;\n /** Navigate to the next page, if available */\n goToNextPage: () => void;\n /** Change the number of items displayed per page */\n setPageSize: (pageSize: number) => void;\n};\n\n/**\n * # usePagination\n *\n * Custom hook that provides pagination state management and navigation controls.\n *\n * Supports both controlled and uncontrolled modes:\n * - Controlled: Parent component manages currentPage state via props and callbacks\n * - Uncontrolled: Hook manages internal currentPage state automatically\n *\n * @param props - Configuration object for pagination behavior\n * @param props.totalItems - Total number of items to paginate\n * @param props.currentPage - Current page number (controlled mode). If undefined, uses uncontrolled mode\n * @param props.pageSize - Number of items per page (defaults to 20)\n * @param props.onPageChange - Callback fired when page changes\n * @param props.onPageSizeChange - Callback fired when page size changes\n *\n * @returns Object containing pagination state and navigation functions:\n * - totalItems: Total number of items\n * - currentPage: Current active page number (1-based)\n * - pageSize: Number of items per page\n * - totalPages: Total number of pages\n * - startItem: First item number on current page\n * - endItem: Last item number on current page\n * - hasPreviousPage: Whether previous page exists\n * - hasNextPage: Whether next page exists\n * - goToPage: Function to navigate to specific page\n * - goToPreviousPage: Function to navigate to previous page\n * - goToNextPage: Function to navigate to next page\n * - setPageSize: Function to change page size\n *\n */\nexport function usePagination({\n totalItems,\n currentPage: controlledCurrentPage,\n pageSize: controlledPageSize = 20,\n onPageChange,\n onPageSizeChange,\n}: UsePaginationProps): UsePaginationReturn {\n // Internal state for uncontrolled mode\n const [internalCurrentPage, setInternalCurrentPage] = useState(1);\n const [internalPageSize, setInternalPageSize] = useState(controlledPageSize);\n\n // Determine if controlled or uncontrolled\n const isControlled = controlledCurrentPage !== undefined;\n const currentPage = isControlled\n ? controlledCurrentPage\n : internalCurrentPage;\n const pageSize = controlledPageSize ?? internalPageSize;\n\n // Calculate pagination values\n const totalPages = Math.max(1, Math.ceil(totalItems / pageSize));\n\n // Ensure currentPage is within valid bounds\n const validCurrentPage = Math.max(1, Math.min(currentPage, totalPages));\n\n const startItem = Math.min((validCurrentPage - 1) * pageSize + 1, totalItems);\n const endItem = Math.min(validCurrentPage * pageSize, totalItems);\n\n const hasPreviousPage = validCurrentPage > 1;\n const hasNextPage = validCurrentPage < totalPages;\n\n // Page navigation functions\n const goToPage = useCallback(\n (page: number) => {\n const newPage = Math.max(1, Math.min(page, totalPages));\n\n if (!isControlled) {\n setInternalCurrentPage(newPage);\n }\n\n onPageChange?.(newPage);\n },\n [totalPages, isControlled, onPageChange]\n );\n\n const goToPreviousPage = useCallback(() => {\n if (hasPreviousPage) {\n goToPage(validCurrentPage - 1);\n }\n }, [hasPreviousPage, validCurrentPage, goToPage]);\n\n const goToNextPage = useCallback(() => {\n if (hasNextPage) {\n goToPage(validCurrentPage + 1);\n }\n }, [hasNextPage, validCurrentPage, goToPage]);\n\n const setPageSize = useCallback(\n (newPageSize: number) => {\n const newTotalPages = Math.ceil(totalItems / newPageSize);\n const newPage = Math.min(validCurrentPage, newTotalPages);\n\n setInternalPageSize(newPageSize);\n\n if (!isControlled && newPage !== validCurrentPage) {\n setInternalCurrentPage(newPage);\n }\n\n onPageSizeChange?.(newPageSize);\n\n if (newPage !== validCurrentPage) {\n onPageChange?.(newPage);\n }\n },\n [totalItems, validCurrentPage, isControlled, onPageChange, onPageSizeChange]\n );\n\n return useMemo(\n () => ({\n totalItems,\n currentPage: validCurrentPage,\n pageSize,\n totalPages,\n startItem,\n endItem,\n hasPreviousPage,\n hasNextPage,\n goToPage,\n goToPreviousPage,\n goToNextPage,\n setPageSize,\n }),\n [\n totalItems,\n validCurrentPage,\n pageSize,\n totalPages,\n startItem,\n endItem,\n hasPreviousPage,\n hasNextPage,\n goToPage,\n goToPreviousPage,\n goToNextPage,\n setPageSize,\n ]\n );\n}\n","import { defineMessages } from \"react-intl\";\n\nexport const messages = defineMessages({\n pagination: {\n id: \"Nimbus.Pagination.pagination\",\n description: \"aria-label for the pagination navigation element\",\n defaultMessage: \"Pagination\",\n },\n itemsPerPage: {\n id: \"Nimbus.Pagination.itemsPerPage\",\n description: \"aria-label for the items per page selector\",\n defaultMessage: \"Items per page\",\n },\n itemsPerPageText: {\n id: \"Nimbus.Pagination.itemsPerPageText\",\n description: \"text label displayed next to the page size selector\",\n defaultMessage: \"items per page\",\n },\n goToPreviousPage: {\n id: \"Nimbus.Pagination.goToPreviousPage\",\n description: \"aria-label for the previous page button\",\n defaultMessage: \"Go to previous page\",\n },\n currentPage: {\n id: \"Nimbus.Pagination.currentPage\",\n description: \"aria-label for the current page input field\",\n defaultMessage: \"Current page\",\n },\n page: {\n id: \"Nimbus.Pagination.page\",\n description: \"text label displayed before the page number\",\n defaultMessage: \"Page\",\n },\n ofTotalPages: {\n id: \"Nimbus.Pagination.ofTotalPages\",\n description: \"text showing total pages count after current page input\",\n defaultMessage: \"of {totalPages}\",\n },\n goToNextPage: {\n id: \"Nimbus.Pagination.goToNextPage\",\n description: \"aria-label for the next page button\",\n defaultMessage: \"Go to next page\",\n },\n});\n","import { useMemo } from \"react\";\nimport { useIntl } from \"react-intl\";\nimport { ChevronLeft, ChevronRight } from \"@commercetools/nimbus-icons\";\nimport {\n Flex,\n IconButton,\n NumberInput,\n Select,\n Stack,\n Text,\n} from \"@/components\";\nimport { usePagination } from \"./hooks/use-pagination\";\nimport type { PaginationProps } from \"./pagination.types\";\nimport { messages } from \"./pagination.i18n\";\n\n/**\n * # Pagination\n *\n * A component that allows users to navigate through pages and control page size.\n * Combines a page size selector and page navigator for comprehensive pagination control.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/pagination}\n */\nexport const Pagination = (props: PaginationProps) => {\n const intl = useIntl();\n const {\n totalItems,\n currentPage,\n pageSize,\n pageSizeOptions = [10, 20, 50, 100],\n onPageChange,\n onPageSizeChange,\n \"aria-label\": ariaLabel,\n enablePageInput = true,\n enablePageSizeSelector = true,\n } = props;\n\n const pagination = usePagination({\n totalItems,\n currentPage,\n pageSize,\n onPageChange,\n onPageSizeChange,\n });\n\n // Prepare page size options for select\n const pageSizeSelectOptions = useMemo(\n () =>\n pageSizeOptions.map((size) => ({\n id: size.toString(),\n name: `${size}`,\n })),\n [pageSizeOptions]\n );\n\n const handlePageSizeChange = (key: React.Key | null) => {\n if (key) {\n const newPageSize = parseInt(key.toString(), 10);\n pagination.setPageSize(newPageSize);\n }\n };\n\n return (\n <Stack gap=\"400\" direction={{ base: \"column\", sm: \"row\" }} align=\"center\">\n {/* Page Size Selector */}\n {enablePageSizeSelector && (\n <Flex align=\"center\" gap=\"200\">\n <Select.Root\n isClearable={false}\n selectedKey={pagination.pageSize.toString()}\n onSelectionChange={handlePageSizeChange}\n aria-label={intl.formatMessage(messages.itemsPerPage)}\n >\n <Select.Options>\n {pageSizeSelectOptions.map((option) => (\n <Select.Option key={option.id} id={option.id}>\n {option.name}\n </Select.Option>\n ))}\n </Select.Options>\n </Select.Root>\n <Text color=\"neutral.12\">\n {intl.formatMessage(messages.itemsPerPageText)}\n </Text>\n </Flex>\n )}\n <Flex flexGrow=\"1\" />\n {/* Page Navigator */}\n <Flex\n align=\"center\"\n gap=\"200\"\n role=\"navigation\"\n aria-label={ariaLabel ?? intl.formatMessage(messages.pagination)}\n >\n <IconButton\n onClick={pagination.goToPreviousPage}\n isDisabled={!pagination.hasPreviousPage}\n variant=\"ghost\"\n tone=\"primary\"\n aria-label={intl.formatMessage(messages.goToPreviousPage)}\n >\n <ChevronLeft />\n </IconButton>\n\n <Flex align=\"center\" gap=\"200\">\n <Text color=\"neutral.12\">{intl.formatMessage(messages.page)}</Text>\n {enablePageInput ? (\n <NumberInput\n value={pagination.currentPage}\n onChange={(value: number | undefined) =>\n pagination.goToPage(value || 1)\n }\n minValue={1}\n maxValue={pagination.totalPages}\n step={1}\n isDisabled={false}\n width=\"9ch\"\n aria-label={intl.formatMessage(messages.currentPage)}\n aria-current=\"page\"\n />\n ) : (\n <Text fontWeight=\"semibold\" color=\"neutral.12\" aria-current=\"page\">\n {pagination.currentPage}\n </Text>\n )}\n <Text color=\"neutral.12\">\n {intl.formatMessage(messages.ofTotalPages, {\n totalPages: intl.formatNumber(pagination.totalPages),\n })}\n </Text>\n </Flex>\n\n <IconButton\n onClick={pagination.goToNextPage}\n isDisabled={!pagination.hasNextPage}\n variant=\"ghost\"\n tone=\"primary\"\n aria-label={intl.formatMessage(messages.goToNextPage)}\n >\n <ChevronRight />\n </IconButton>\n </Flex>\n </Stack>\n );\n};\n\n// Manually assign a displayName for debugging purposes\nPagination.displayName = \"Pagination\";\n"],"names":["usePagination","totalItems","controlledCurrentPage","controlledPageSize","onPageChange","onPageSizeChange","internalCurrentPage","setInternalCurrentPage","useState","internalPageSize","setInternalPageSize","isControlled","currentPage","pageSize","totalPages","validCurrentPage","startItem","endItem","hasPreviousPage","hasNextPage","goToPage","useCallback","page","newPage","goToPreviousPage","goToNextPage","setPageSize","newPageSize","newTotalPages","useMemo","messages","defineMessages","Pagination","props","intl","useIntl","pageSizeOptions","ariaLabel","enablePageInput","enablePageSizeSelector","pagination","pageSizeSelectOptions","size","handlePageSizeChange","key","jsxs","Stack","Flex","jsx","Select","option","Text","IconButton","ChevronLeft","NumberInput","value","ChevronRight"],"mappings":";;;;;;;;;;AA4EO,SAASA,EAAc;AAAA,EAC5B,YAAAC;AAAA,EACA,aAAaC;AAAA,EACb,UAAUC,IAAqB;AAAA,EAC/B,cAAAC;AAAA,EACA,kBAAAC;AACF,GAA4C;AAE1C,QAAM,CAACC,GAAqBC,CAAsB,IAAIC,EAAS,CAAC,GAC1D,CAACC,GAAkBC,CAAmB,IAAIF,EAASL,CAAkB,GAGrEQ,IAAeT,MAA0B,QACzCU,IAAcD,IAChBT,IACAI,GACEO,IAAWV,KAAsBM,GAGjCK,IAAa,KAAK,IAAI,GAAG,KAAK,KAAKb,IAAaY,CAAQ,CAAC,GAGzDE,IAAmB,KAAK,IAAI,GAAG,KAAK,IAAIH,GAAaE,CAAU,CAAC,GAEhEE,IAAY,KAAK,KAAKD,IAAmB,KAAKF,IAAW,GAAGZ,CAAU,GACtEgB,IAAU,KAAK,IAAIF,IAAmBF,GAAUZ,CAAU,GAE1DiB,IAAkBH,IAAmB,GACrCI,IAAcJ,IAAmBD,GAGjCM,IAAWC;AAAA,IACf,CAACC,MAAiB;AAChB,YAAMC,IAAU,KAAK,IAAI,GAAG,KAAK,IAAID,GAAMR,CAAU,CAAC;AAEtD,MAAKH,KACHJ,EAAuBgB,CAAO,GAGhCnB,IAAemB,CAAO;AAAA,IACxB;AAAA,IACA,CAACT,GAAYH,GAAcP,CAAY;AAAA,EAAA,GAGnCoB,IAAmBH,EAAY,MAAM;AACzC,IAAIH,KACFE,EAASL,IAAmB,CAAC;AAAA,EAEjC,GAAG,CAACG,GAAiBH,GAAkBK,CAAQ,CAAC,GAE1CK,IAAeJ,EAAY,MAAM;AACrC,IAAIF,KACFC,EAASL,IAAmB,CAAC;AAAA,EAEjC,GAAG,CAACI,GAAaJ,GAAkBK,CAAQ,CAAC,GAEtCM,IAAcL;AAAA,IAClB,CAACM,MAAwB;AACvB,YAAMC,IAAgB,KAAK,KAAK3B,IAAa0B,CAAW,GAClDJ,IAAU,KAAK,IAAIR,GAAkBa,CAAa;AAExD,MAAAlB,EAAoBiB,CAAW,GAE3B,CAAChB,KAAgBY,MAAYR,KAC/BR,EAAuBgB,CAAO,GAGhClB,IAAmBsB,CAAW,GAE1BJ,MAAYR,KACdX,IAAemB,CAAO;AAAA,IAE1B;AAAA,IACA,CAACtB,GAAYc,GAAkBJ,GAAcP,GAAcC,CAAgB;AAAA,EAAA;AAG7E,SAAOwB;AAAA,IACL,OAAO;AAAA,MACL,YAAA5B;AAAA,MACA,aAAac;AAAA,MACb,UAAAF;AAAA,MACA,YAAAC;AAAA,MACA,WAAAE;AAAA,MACA,SAAAC;AAAA,MACA,iBAAAC;AAAA,MACA,aAAAC;AAAA,MACA,UAAAC;AAAA,MACA,kBAAAI;AAAA,MACA,cAAAC;AAAA,MACA,aAAAC;AAAA,IAAA;AAAA,IAEF;AAAA,MACEzB;AAAA,MACAc;AAAA,MACAF;AAAA,MACAC;AAAA,MACAE;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAI;AAAA,MACAC;AAAA,MACAC;AAAA,IAAA;AAAA,EACF;AAEJ;ACpLO,MAAMI,IAAW,gBAAAC,EAAe;AAAA,EACrC,YAAY;AAAA,IACV,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,cAAc;AAAA,IACZ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,kBAAkB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,kBAAkB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,aAAa;AAAA,IACX,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,cAAc;AAAA,IACZ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,cAAc;AAAA,IACZ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAEpB,CAAC,GCpBYC,IAAa,CAACC,MAA2B;AACpD,QAAMC,IAAOC,EAAA,GACP;AAAA,IACJ,YAAAlC;AAAA,IACA,aAAAW;AAAA,IACA,UAAAC;AAAA,IACA,iBAAAuB,IAAkB,CAAC,IAAI,IAAI,IAAI,GAAG;AAAA,IAClC,cAAAhC;AAAA,IACA,kBAAAC;AAAA,IACA,cAAcgC;AAAA,IACd,iBAAAC,IAAkB;AAAA,IAClB,wBAAAC,IAAyB;AAAA,EAAA,IACvBN,GAEEO,IAAaxC,EAAc;AAAA,IAC/B,YAAAC;AAAA,IACA,aAAAW;AAAA,IACA,UAAAC;AAAA,IACA,cAAAT;AAAA,IACA,kBAAAC;AAAA,EAAA,CACD,GAGKoC,IAAwBZ;AAAA,IAC5B,MACEO,EAAgB,IAAI,CAACM,OAAU;AAAA,MAC7B,IAAIA,EAAK,SAAA;AAAA,MACT,MAAM,GAAGA,CAAI;AAAA,IAAA,EACb;AAAA,IACJ,CAACN,CAAe;AAAA,EAAA,GAGZO,IAAuB,CAACC,MAA0B;AACtD,QAAIA,GAAK;AACP,YAAMjB,IAAc,SAASiB,EAAI,SAAA,GAAY,EAAE;AAC/C,MAAAJ,EAAW,YAAYb,CAAW;AAAA,IACpC;AAAA,EACF;AAEA,SACE,gBAAAkB,EAACC,GAAA,EAAM,KAAI,OAAM,WAAW,EAAE,MAAM,UAAU,IAAI,MAAA,GAAS,OAAM,UAE9D,UAAA;AAAA,IAAAP,KACC,gBAAAM,EAACE,GAAA,EAAK,OAAM,UAAS,KAAI,OACvB,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC,EAAO;AAAA,QAAP;AAAA,UACC,aAAa;AAAA,UACb,aAAaT,EAAW,SAAS,SAAA;AAAA,UACjC,mBAAmBG;AAAA,UACnB,cAAYT,EAAK,cAAcJ,EAAS,YAAY;AAAA,UAEpD,UAAA,gBAAAkB,EAACC,EAAO,SAAP,EACE,YAAsB,IAAI,CAACC,MAC1B,gBAAAF,EAACC,EAAO,QAAP,EAA8B,IAAIC,EAAO,IACvC,UAAAA,EAAO,QADUA,EAAO,EAE3B,CACD,EAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,MAEF,gBAAAF,EAACG,KAAK,OAAM,cACT,YAAK,cAAcrB,EAAS,gBAAgB,EAAA,CAC/C;AAAA,IAAA,GACF;AAAA,IAEF,gBAAAkB,EAACD,GAAA,EAAK,UAAS,IAAA,CAAI;AAAA,IAEnB,gBAAAF;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,KAAI;AAAA,QACJ,MAAK;AAAA,QACL,cAAYV,KAAaH,EAAK,cAAcJ,EAAS,UAAU;AAAA,QAE/D,UAAA;AAAA,UAAA,gBAAAkB;AAAA,YAACI;AAAA,YAAA;AAAA,cACC,SAASZ,EAAW;AAAA,cACpB,YAAY,CAACA,EAAW;AAAA,cACxB,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,cAAYN,EAAK,cAAcJ,EAAS,gBAAgB;AAAA,cAExD,4BAACuB,GAAA,CAAA,CAAY;AAAA,YAAA;AAAA,UAAA;AAAA,UAGf,gBAAAR,EAACE,GAAA,EAAK,OAAM,UAAS,KAAI,OACvB,UAAA;AAAA,YAAA,gBAAAC,EAACG,KAAK,OAAM,cAAc,YAAK,cAAcrB,EAAS,IAAI,GAAE;AAAA,YAC3DQ,IACC,gBAAAU;AAAA,cAACM;AAAA,cAAA;AAAA,gBACC,OAAOd,EAAW;AAAA,gBAClB,UAAU,CAACe,MACTf,EAAW,SAASe,KAAS,CAAC;AAAA,gBAEhC,UAAU;AAAA,gBACV,UAAUf,EAAW;AAAA,gBACrB,MAAM;AAAA,gBACN,YAAY;AAAA,gBACZ,OAAM;AAAA,gBACN,cAAYN,EAAK,cAAcJ,EAAS,WAAW;AAAA,gBACnD,gBAAa;AAAA,cAAA;AAAA,YAAA,IAGf,gBAAAkB,EAACG,GAAA,EAAK,YAAW,YAAW,OAAM,cAAa,gBAAa,QACzD,UAAAX,EAAW,YAAA,CACd;AAAA,8BAEDW,GAAA,EAAK,OAAM,cACT,UAAAjB,EAAK,cAAcJ,EAAS,cAAc;AAAA,cACzC,YAAYI,EAAK,aAAaM,EAAW,UAAU;AAAA,YAAA,CACpD,EAAA,CACH;AAAA,UAAA,GACF;AAAA,UAEA,gBAAAQ;AAAA,YAACI;AAAA,YAAA;AAAA,cACC,SAASZ,EAAW;AAAA,cACpB,YAAY,CAACA,EAAW;AAAA,cACxB,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,cAAYN,EAAK,cAAcJ,EAAS,YAAY;AAAA,cAEpD,4BAAC0B,GAAA,CAAA,CAAa;AAAA,YAAA;AAAA,UAAA;AAAA,QAChB;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;AAGAxB,EAAW,cAAc;"}
|
|
1
|
+
{"version":3,"file":"pagination-dlHn3OhV.es.js","sources":["../../src/components/pagination/hooks/use-pagination.ts","../../src/components/pagination/pagination.i18n.ts","../../src/components/pagination/pagination.tsx"],"sourcesContent":["import { useState, useCallback, useMemo } from \"react\";\n\nexport type PaginationState = {\n /** Total number of items across all pages */\n totalItems: number;\n /** Current active page (1-based) */\n currentPage: number;\n /** Number of items displayed per page */\n pageSize: number;\n /** Total number of pages available */\n totalPages: number;\n /** Index of the first item on current page (1-based) */\n startItem: number;\n /** Index of the last item on current page (1-based) */\n endItem: number;\n /** Whether there is a previous page available */\n hasPreviousPage: boolean;\n /** Whether there is a next page available */\n hasNextPage: boolean;\n};\n\nexport type UsePaginationProps = {\n /** Total number of items to paginate */\n totalItems: number;\n /** Initial current page (1-based), defaults to 1 */\n currentPage?: number;\n /** Initial number of items per page, defaults to 10 */\n pageSize?: number;\n /** Callback fired when the current page changes */\n onPageChange?: (page: number) => void;\n /** Callback fired when the page size changes */\n onPageSizeChange?: (pageSize: number) => void;\n};\n\nexport type UsePaginationReturn = PaginationState & {\n /** Navigate to a specific page number (1-based) */\n goToPage: (page: number) => void;\n /** Navigate to the previous page, if available */\n goToPreviousPage: () => void;\n /** Navigate to the next page, if available */\n goToNextPage: () => void;\n /** Change the number of items displayed per page */\n setPageSize: (pageSize: number) => void;\n};\n\n/**\n * # usePagination\n *\n * Custom hook that provides pagination state management and navigation controls.\n *\n * Supports both controlled and uncontrolled modes:\n * - Controlled: Parent component manages currentPage state via props and callbacks\n * - Uncontrolled: Hook manages internal currentPage state automatically\n *\n * @param props - Configuration object for pagination behavior\n * @param props.totalItems - Total number of items to paginate\n * @param props.currentPage - Current page number (controlled mode). If undefined, uses uncontrolled mode\n * @param props.pageSize - Number of items per page (defaults to 20)\n * @param props.onPageChange - Callback fired when page changes\n * @param props.onPageSizeChange - Callback fired when page size changes\n *\n * @returns Object containing pagination state and navigation functions:\n * - totalItems: Total number of items\n * - currentPage: Current active page number (1-based)\n * - pageSize: Number of items per page\n * - totalPages: Total number of pages\n * - startItem: First item number on current page\n * - endItem: Last item number on current page\n * - hasPreviousPage: Whether previous page exists\n * - hasNextPage: Whether next page exists\n * - goToPage: Function to navigate to specific page\n * - goToPreviousPage: Function to navigate to previous page\n * - goToNextPage: Function to navigate to next page\n * - setPageSize: Function to change page size\n *\n */\nexport function usePagination({\n totalItems,\n currentPage: controlledCurrentPage,\n pageSize: controlledPageSize = 20,\n onPageChange,\n onPageSizeChange,\n}: UsePaginationProps): UsePaginationReturn {\n // Internal state for uncontrolled mode\n const [internalCurrentPage, setInternalCurrentPage] = useState(1);\n const [internalPageSize, setInternalPageSize] = useState(controlledPageSize);\n\n // Determine if controlled or uncontrolled\n const isControlled = controlledCurrentPage !== undefined;\n const currentPage = isControlled\n ? controlledCurrentPage\n : internalCurrentPage;\n const pageSize = controlledPageSize ?? internalPageSize;\n\n // Calculate pagination values\n const totalPages = Math.max(1, Math.ceil(totalItems / pageSize));\n\n // Ensure currentPage is within valid bounds\n const validCurrentPage = Math.max(1, Math.min(currentPage, totalPages));\n\n const startItem = Math.min((validCurrentPage - 1) * pageSize + 1, totalItems);\n const endItem = Math.min(validCurrentPage * pageSize, totalItems);\n\n const hasPreviousPage = validCurrentPage > 1;\n const hasNextPage = validCurrentPage < totalPages;\n\n // Page navigation functions\n const goToPage = useCallback(\n (page: number) => {\n const newPage = Math.max(1, Math.min(page, totalPages));\n\n if (!isControlled) {\n setInternalCurrentPage(newPage);\n }\n\n onPageChange?.(newPage);\n },\n [totalPages, isControlled, onPageChange]\n );\n\n const goToPreviousPage = useCallback(() => {\n if (hasPreviousPage) {\n goToPage(validCurrentPage - 1);\n }\n }, [hasPreviousPage, validCurrentPage, goToPage]);\n\n const goToNextPage = useCallback(() => {\n if (hasNextPage) {\n goToPage(validCurrentPage + 1);\n }\n }, [hasNextPage, validCurrentPage, goToPage]);\n\n const setPageSize = useCallback(\n (newPageSize: number) => {\n const newTotalPages = Math.ceil(totalItems / newPageSize);\n const newPage = Math.min(validCurrentPage, newTotalPages);\n\n setInternalPageSize(newPageSize);\n\n if (!isControlled && newPage !== validCurrentPage) {\n setInternalCurrentPage(newPage);\n }\n\n onPageSizeChange?.(newPageSize);\n\n if (newPage !== validCurrentPage) {\n onPageChange?.(newPage);\n }\n },\n [totalItems, validCurrentPage, isControlled, onPageChange, onPageSizeChange]\n );\n\n return useMemo(\n () => ({\n totalItems,\n currentPage: validCurrentPage,\n pageSize,\n totalPages,\n startItem,\n endItem,\n hasPreviousPage,\n hasNextPage,\n goToPage,\n goToPreviousPage,\n goToNextPage,\n setPageSize,\n }),\n [\n totalItems,\n validCurrentPage,\n pageSize,\n totalPages,\n startItem,\n endItem,\n hasPreviousPage,\n hasNextPage,\n goToPage,\n goToPreviousPage,\n goToNextPage,\n setPageSize,\n ]\n );\n}\n","import { defineMessages } from \"react-intl\";\n\nexport const messages = defineMessages({\n pagination: {\n id: \"Nimbus.Pagination.pagination\",\n description: \"aria-label for the pagination navigation element\",\n defaultMessage: \"Pagination\",\n },\n itemsPerPage: {\n id: \"Nimbus.Pagination.itemsPerPage\",\n description: \"aria-label for the items per page selector\",\n defaultMessage: \"Items per page\",\n },\n itemsPerPageText: {\n id: \"Nimbus.Pagination.itemsPerPageText\",\n description: \"text label displayed next to the page size selector\",\n defaultMessage: \"items per page\",\n },\n goToPreviousPage: {\n id: \"Nimbus.Pagination.goToPreviousPage\",\n description: \"aria-label for the previous page button\",\n defaultMessage: \"Go to previous page\",\n },\n currentPage: {\n id: \"Nimbus.Pagination.currentPage\",\n description: \"aria-label for the current page input field\",\n defaultMessage: \"Current page\",\n },\n page: {\n id: \"Nimbus.Pagination.page\",\n description: \"text label displayed before the page number\",\n defaultMessage: \"Page\",\n },\n ofTotalPages: {\n id: \"Nimbus.Pagination.ofTotalPages\",\n description: \"text showing total pages count after current page input\",\n defaultMessage: \"of {totalPages}\",\n },\n goToNextPage: {\n id: \"Nimbus.Pagination.goToNextPage\",\n description: \"aria-label for the next page button\",\n defaultMessage: \"Go to next page\",\n },\n});\n","import { useMemo } from \"react\";\nimport { useIntl } from \"react-intl\";\nimport { ChevronLeft, ChevronRight } from \"@commercetools/nimbus-icons\";\nimport {\n Flex,\n IconButton,\n NumberInput,\n Select,\n Stack,\n Text,\n} from \"@/components\";\nimport { usePagination } from \"./hooks/use-pagination\";\nimport type { PaginationProps } from \"./pagination.types\";\nimport { messages } from \"./pagination.i18n\";\n\n/**\n * # Pagination\n *\n * A component that allows users to navigate through pages and control page size.\n * Combines a page size selector and page navigator for comprehensive pagination control.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/pagination}\n */\nexport const Pagination = (props: PaginationProps) => {\n const intl = useIntl();\n const {\n totalItems,\n currentPage,\n pageSize,\n pageSizeOptions = [10, 20, 50, 100],\n onPageChange,\n onPageSizeChange,\n \"aria-label\": ariaLabel,\n enablePageInput = true,\n enablePageSizeSelector = true,\n } = props;\n\n const pagination = usePagination({\n totalItems,\n currentPage,\n pageSize,\n onPageChange,\n onPageSizeChange,\n });\n\n // Prepare page size options for select\n const pageSizeSelectOptions = useMemo(\n () =>\n pageSizeOptions.map((size) => ({\n id: size.toString(),\n name: `${size}`,\n })),\n [pageSizeOptions]\n );\n\n const handlePageSizeChange = (key: React.Key | null) => {\n if (key) {\n const newPageSize = parseInt(key.toString(), 10);\n pagination.setPageSize(newPageSize);\n }\n };\n\n return (\n <Stack gap=\"400\" direction={{ base: \"column\", sm: \"row\" }} align=\"center\">\n {/* Page Size Selector */}\n {enablePageSizeSelector && (\n <Flex align=\"center\" gap=\"200\">\n <Select.Root\n isClearable={false}\n selectedKey={pagination.pageSize.toString()}\n onSelectionChange={handlePageSizeChange}\n aria-label={intl.formatMessage(messages.itemsPerPage)}\n >\n <Select.Options>\n {pageSizeSelectOptions.map((option) => (\n <Select.Option key={option.id} id={option.id}>\n {option.name}\n </Select.Option>\n ))}\n </Select.Options>\n </Select.Root>\n <Text color=\"neutral.12\">\n {intl.formatMessage(messages.itemsPerPageText)}\n </Text>\n </Flex>\n )}\n <Flex flexGrow=\"1\" />\n {/* Page Navigator */}\n <Flex\n align=\"center\"\n gap=\"200\"\n role=\"navigation\"\n aria-label={ariaLabel ?? intl.formatMessage(messages.pagination)}\n >\n <IconButton\n onClick={pagination.goToPreviousPage}\n isDisabled={!pagination.hasPreviousPage}\n variant=\"ghost\"\n colorPalette=\"primary\"\n aria-label={intl.formatMessage(messages.goToPreviousPage)}\n >\n <ChevronLeft />\n </IconButton>\n\n <Flex align=\"center\" gap=\"200\">\n <Text color=\"neutral.12\">{intl.formatMessage(messages.page)}</Text>\n {enablePageInput ? (\n <NumberInput\n value={pagination.currentPage}\n onChange={(value: number | undefined) =>\n pagination.goToPage(value || 1)\n }\n minValue={1}\n maxValue={pagination.totalPages}\n step={1}\n isDisabled={false}\n width=\"9ch\"\n aria-label={intl.formatMessage(messages.currentPage)}\n aria-current=\"page\"\n />\n ) : (\n <Text fontWeight=\"semibold\" color=\"neutral.12\" aria-current=\"page\">\n {pagination.currentPage}\n </Text>\n )}\n <Text color=\"neutral.12\">\n {intl.formatMessage(messages.ofTotalPages, {\n totalPages: intl.formatNumber(pagination.totalPages),\n })}\n </Text>\n </Flex>\n\n <IconButton\n onClick={pagination.goToNextPage}\n isDisabled={!pagination.hasNextPage}\n variant=\"ghost\"\n colorPalette=\"primary\"\n aria-label={intl.formatMessage(messages.goToNextPage)}\n >\n <ChevronRight />\n </IconButton>\n </Flex>\n </Stack>\n );\n};\n\n// Manually assign a displayName for debugging purposes\nPagination.displayName = \"Pagination\";\n"],"names":["usePagination","totalItems","controlledCurrentPage","controlledPageSize","onPageChange","onPageSizeChange","internalCurrentPage","setInternalCurrentPage","useState","internalPageSize","setInternalPageSize","isControlled","currentPage","pageSize","totalPages","validCurrentPage","startItem","endItem","hasPreviousPage","hasNextPage","goToPage","useCallback","page","newPage","goToPreviousPage","goToNextPage","setPageSize","newPageSize","newTotalPages","useMemo","messages","defineMessages","Pagination","props","intl","useIntl","pageSizeOptions","ariaLabel","enablePageInput","enablePageSizeSelector","pagination","pageSizeSelectOptions","size","handlePageSizeChange","key","jsxs","Stack","Flex","jsx","Select","option","Text","IconButton","ChevronLeft","NumberInput","value","ChevronRight"],"mappings":";;;;;;;;;;AA4EO,SAASA,EAAc;AAAA,EAC5B,YAAAC;AAAA,EACA,aAAaC;AAAA,EACb,UAAUC,IAAqB;AAAA,EAC/B,cAAAC;AAAA,EACA,kBAAAC;AACF,GAA4C;AAE1C,QAAM,CAACC,GAAqBC,CAAsB,IAAIC,EAAS,CAAC,GAC1D,CAACC,GAAkBC,CAAmB,IAAIF,EAASL,CAAkB,GAGrEQ,IAAeT,MAA0B,QACzCU,IAAcD,IAChBT,IACAI,GACEO,IAAWV,KAAsBM,GAGjCK,IAAa,KAAK,IAAI,GAAG,KAAK,KAAKb,IAAaY,CAAQ,CAAC,GAGzDE,IAAmB,KAAK,IAAI,GAAG,KAAK,IAAIH,GAAaE,CAAU,CAAC,GAEhEE,IAAY,KAAK,KAAKD,IAAmB,KAAKF,IAAW,GAAGZ,CAAU,GACtEgB,IAAU,KAAK,IAAIF,IAAmBF,GAAUZ,CAAU,GAE1DiB,IAAkBH,IAAmB,GACrCI,IAAcJ,IAAmBD,GAGjCM,IAAWC;AAAA,IACf,CAACC,MAAiB;AAChB,YAAMC,IAAU,KAAK,IAAI,GAAG,KAAK,IAAID,GAAMR,CAAU,CAAC;AAEtD,MAAKH,KACHJ,EAAuBgB,CAAO,GAGhCnB,IAAemB,CAAO;AAAA,IACxB;AAAA,IACA,CAACT,GAAYH,GAAcP,CAAY;AAAA,EAAA,GAGnCoB,IAAmBH,EAAY,MAAM;AACzC,IAAIH,KACFE,EAASL,IAAmB,CAAC;AAAA,EAEjC,GAAG,CAACG,GAAiBH,GAAkBK,CAAQ,CAAC,GAE1CK,IAAeJ,EAAY,MAAM;AACrC,IAAIF,KACFC,EAASL,IAAmB,CAAC;AAAA,EAEjC,GAAG,CAACI,GAAaJ,GAAkBK,CAAQ,CAAC,GAEtCM,IAAcL;AAAA,IAClB,CAACM,MAAwB;AACvB,YAAMC,IAAgB,KAAK,KAAK3B,IAAa0B,CAAW,GAClDJ,IAAU,KAAK,IAAIR,GAAkBa,CAAa;AAExD,MAAAlB,EAAoBiB,CAAW,GAE3B,CAAChB,KAAgBY,MAAYR,KAC/BR,EAAuBgB,CAAO,GAGhClB,IAAmBsB,CAAW,GAE1BJ,MAAYR,KACdX,IAAemB,CAAO;AAAA,IAE1B;AAAA,IACA,CAACtB,GAAYc,GAAkBJ,GAAcP,GAAcC,CAAgB;AAAA,EAAA;AAG7E,SAAOwB;AAAA,IACL,OAAO;AAAA,MACL,YAAA5B;AAAA,MACA,aAAac;AAAA,MACb,UAAAF;AAAA,MACA,YAAAC;AAAA,MACA,WAAAE;AAAA,MACA,SAAAC;AAAA,MACA,iBAAAC;AAAA,MACA,aAAAC;AAAA,MACA,UAAAC;AAAA,MACA,kBAAAI;AAAA,MACA,cAAAC;AAAA,MACA,aAAAC;AAAA,IAAA;AAAA,IAEF;AAAA,MACEzB;AAAA,MACAc;AAAA,MACAF;AAAA,MACAC;AAAA,MACAE;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAI;AAAA,MACAC;AAAA,MACAC;AAAA,IAAA;AAAA,EACF;AAEJ;ACpLO,MAAMI,IAAW,gBAAAC,EAAe;AAAA,EACrC,YAAY;AAAA,IACV,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,cAAc;AAAA,IACZ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,kBAAkB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,kBAAkB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,aAAa;AAAA,IACX,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,cAAc;AAAA,IACZ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,cAAc;AAAA,IACZ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAEpB,CAAC,GCpBYC,IAAa,CAACC,MAA2B;AACpD,QAAMC,IAAOC,EAAA,GACP;AAAA,IACJ,YAAAlC;AAAA,IACA,aAAAW;AAAA,IACA,UAAAC;AAAA,IACA,iBAAAuB,IAAkB,CAAC,IAAI,IAAI,IAAI,GAAG;AAAA,IAClC,cAAAhC;AAAA,IACA,kBAAAC;AAAA,IACA,cAAcgC;AAAA,IACd,iBAAAC,IAAkB;AAAA,IAClB,wBAAAC,IAAyB;AAAA,EAAA,IACvBN,GAEEO,IAAaxC,EAAc;AAAA,IAC/B,YAAAC;AAAA,IACA,aAAAW;AAAA,IACA,UAAAC;AAAA,IACA,cAAAT;AAAA,IACA,kBAAAC;AAAA,EAAA,CACD,GAGKoC,IAAwBZ;AAAA,IAC5B,MACEO,EAAgB,IAAI,CAACM,OAAU;AAAA,MAC7B,IAAIA,EAAK,SAAA;AAAA,MACT,MAAM,GAAGA,CAAI;AAAA,IAAA,EACb;AAAA,IACJ,CAACN,CAAe;AAAA,EAAA,GAGZO,IAAuB,CAACC,MAA0B;AACtD,QAAIA,GAAK;AACP,YAAMjB,IAAc,SAASiB,EAAI,SAAA,GAAY,EAAE;AAC/C,MAAAJ,EAAW,YAAYb,CAAW;AAAA,IACpC;AAAA,EACF;AAEA,SACE,gBAAAkB,EAACC,GAAA,EAAM,KAAI,OAAM,WAAW,EAAE,MAAM,UAAU,IAAI,MAAA,GAAS,OAAM,UAE9D,UAAA;AAAA,IAAAP,KACC,gBAAAM,EAACE,GAAA,EAAK,OAAM,UAAS,KAAI,OACvB,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC,EAAO;AAAA,QAAP;AAAA,UACC,aAAa;AAAA,UACb,aAAaT,EAAW,SAAS,SAAA;AAAA,UACjC,mBAAmBG;AAAA,UACnB,cAAYT,EAAK,cAAcJ,EAAS,YAAY;AAAA,UAEpD,UAAA,gBAAAkB,EAACC,EAAO,SAAP,EACE,YAAsB,IAAI,CAACC,MAC1B,gBAAAF,EAACC,EAAO,QAAP,EAA8B,IAAIC,EAAO,IACvC,UAAAA,EAAO,QADUA,EAAO,EAE3B,CACD,EAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,MAEF,gBAAAF,EAACG,KAAK,OAAM,cACT,YAAK,cAAcrB,EAAS,gBAAgB,EAAA,CAC/C;AAAA,IAAA,GACF;AAAA,IAEF,gBAAAkB,EAACD,GAAA,EAAK,UAAS,IAAA,CAAI;AAAA,IAEnB,gBAAAF;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,KAAI;AAAA,QACJ,MAAK;AAAA,QACL,cAAYV,KAAaH,EAAK,cAAcJ,EAAS,UAAU;AAAA,QAE/D,UAAA;AAAA,UAAA,gBAAAkB;AAAA,YAACI;AAAA,YAAA;AAAA,cACC,SAASZ,EAAW;AAAA,cACpB,YAAY,CAACA,EAAW;AAAA,cACxB,SAAQ;AAAA,cACR,cAAa;AAAA,cACb,cAAYN,EAAK,cAAcJ,EAAS,gBAAgB;AAAA,cAExD,4BAACuB,GAAA,CAAA,CAAY;AAAA,YAAA;AAAA,UAAA;AAAA,UAGf,gBAAAR,EAACE,GAAA,EAAK,OAAM,UAAS,KAAI,OACvB,UAAA;AAAA,YAAA,gBAAAC,EAACG,KAAK,OAAM,cAAc,YAAK,cAAcrB,EAAS,IAAI,GAAE;AAAA,YAC3DQ,IACC,gBAAAU;AAAA,cAACM;AAAA,cAAA;AAAA,gBACC,OAAOd,EAAW;AAAA,gBAClB,UAAU,CAACe,MACTf,EAAW,SAASe,KAAS,CAAC;AAAA,gBAEhC,UAAU;AAAA,gBACV,UAAUf,EAAW;AAAA,gBACrB,MAAM;AAAA,gBACN,YAAY;AAAA,gBACZ,OAAM;AAAA,gBACN,cAAYN,EAAK,cAAcJ,EAAS,WAAW;AAAA,gBACnD,gBAAa;AAAA,cAAA;AAAA,YAAA,IAGf,gBAAAkB,EAACG,GAAA,EAAK,YAAW,YAAW,OAAM,cAAa,gBAAa,QACzD,UAAAX,EAAW,YAAA,CACd;AAAA,8BAEDW,GAAA,EAAK,OAAM,cACT,UAAAjB,EAAK,cAAcJ,EAAS,cAAc;AAAA,cACzC,YAAYI,EAAK,aAAaM,EAAW,UAAU;AAAA,YAAA,CACpD,EAAA,CACH;AAAA,UAAA,GACF;AAAA,UAEA,gBAAAQ;AAAA,YAACI;AAAA,YAAA;AAAA,cACC,SAASZ,EAAW;AAAA,cACpB,YAAY,CAACA,EAAW;AAAA,cACxB,SAAQ;AAAA,cACR,cAAa;AAAA,cACb,cAAYN,EAAK,cAAcJ,EAAS,YAAY;AAAA,cAEpD,4BAAC0B,GAAA,CAAA,CAAa;AAAA,YAAA;AAAA,UAAA;AAAA,QAChB;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;AAGAxB,EAAW,cAAc;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const a=require("react/jsx-runtime"),g=require("react"),F=require("react-intl"),w=require("@commercetools/nimbus-icons"),R=require("./stack-CIN13EDn.cjs.js"),T=require("@chakra-ui/react/flex"),q=require("./select-
|
|
2
|
-
//# sourceMappingURL=pagination-
|
|
1
|
+
"use strict";const a=require("react/jsx-runtime"),g=require("react"),F=require("react-intl"),w=require("@commercetools/nimbus-icons"),R=require("./stack-CIN13EDn.cjs.js"),T=require("@chakra-ui/react/flex"),q=require("./select-wD3QlanS.cjs.js"),j=require("./text-BtRhIklG.cjs.js"),y=require("./icon-button-C_itb6iA.cjs.js"),B=require("./number-input-BskHV8w5.cjs.js");function D({totalItems:s,currentPage:n,pageSize:p=20,onPageChange:c,onPageSizeChange:d}){const[m,x]=g.useState(1),[v,N]=g.useState(p),l=n!==void 0,C=l?n:m,e=p??v,o=Math.max(1,Math.ceil(s/e)),t=Math.max(1,Math.min(C,o)),i=Math.min((t-1)*e+1,s),h=Math.min(t*e,s),b=t>1,f=t<o,u=g.useCallback(P=>{const M=Math.max(1,Math.min(P,o));l||x(M),c?.(M)},[o,l,c]),z=g.useCallback(()=>{b&&u(t-1)},[b,t,u]),I=g.useCallback(()=>{f&&u(t+1)},[f,t,u]),k=g.useCallback(P=>{const M=Math.ceil(s/P),S=Math.min(t,M);N(P),!l&&S!==t&&x(S),d?.(P),S!==t&&c?.(S)},[s,t,l,c,d]);return g.useMemo(()=>({totalItems:s,currentPage:t,pageSize:e,totalPages:o,startItem:i,endItem:h,hasPreviousPage:b,hasNextPage:f,goToPage:u,goToPreviousPage:z,goToNextPage:I,setPageSize:k}),[s,t,e,o,i,h,b,f,u,z,I,k])}const r=F.defineMessages({pagination:{id:"Nimbus.Pagination.pagination",description:"aria-label for the pagination navigation element",defaultMessage:"Pagination"},itemsPerPage:{id:"Nimbus.Pagination.itemsPerPage",description:"aria-label for the items per page selector",defaultMessage:"Items per page"},itemsPerPageText:{id:"Nimbus.Pagination.itemsPerPageText",description:"text label displayed next to the page size selector",defaultMessage:"items per page"},goToPreviousPage:{id:"Nimbus.Pagination.goToPreviousPage",description:"aria-label for the previous page button",defaultMessage:"Go to previous page"},currentPage:{id:"Nimbus.Pagination.currentPage",description:"aria-label for the current page input field",defaultMessage:"Current page"},page:{id:"Nimbus.Pagination.page",description:"text label displayed before the page number",defaultMessage:"Page"},ofTotalPages:{id:"Nimbus.Pagination.ofTotalPages",description:"text showing total pages count after current page input",defaultMessage:"of {totalPages}"},goToNextPage:{id:"Nimbus.Pagination.goToNextPage",description:"aria-label for the next page button",defaultMessage:"Go to next page"}}),O=s=>{const n=F.useIntl(),{totalItems:p,currentPage:c,pageSize:d,pageSizeOptions:m=[10,20,50,100],onPageChange:x,onPageSizeChange:v,"aria-label":N,enablePageInput:l=!0,enablePageSizeSelector:C=!0}=s,e=D({totalItems:p,currentPage:c,pageSize:d,onPageChange:x,onPageSizeChange:v}),o=g.useMemo(()=>m.map(i=>({id:i.toString(),name:`${i}`})),[m]),t=i=>{if(i){const h=parseInt(i.toString(),10);e.setPageSize(h)}};return a.jsxs(R.Stack,{gap:"400",direction:{base:"column",sm:"row"},align:"center",children:[C&&a.jsxs(T.Flex,{align:"center",gap:"200",children:[a.jsx(q.Select.Root,{isClearable:!1,selectedKey:e.pageSize.toString(),onSelectionChange:t,"aria-label":n.formatMessage(r.itemsPerPage),children:a.jsx(q.Select.Options,{children:o.map(i=>a.jsx(q.Select.Option,{id:i.id,children:i.name},i.id))})}),a.jsx(j.Text,{color:"neutral.12",children:n.formatMessage(r.itemsPerPageText)})]}),a.jsx(T.Flex,{flexGrow:"1"}),a.jsxs(T.Flex,{align:"center",gap:"200",role:"navigation","aria-label":N??n.formatMessage(r.pagination),children:[a.jsx(y.IconButton,{onClick:e.goToPreviousPage,isDisabled:!e.hasPreviousPage,variant:"ghost",colorPalette:"primary","aria-label":n.formatMessage(r.goToPreviousPage),children:a.jsx(w.ChevronLeft,{})}),a.jsxs(T.Flex,{align:"center",gap:"200",children:[a.jsx(j.Text,{color:"neutral.12",children:n.formatMessage(r.page)}),l?a.jsx(B.NumberInput,{value:e.currentPage,onChange:i=>e.goToPage(i||1),minValue:1,maxValue:e.totalPages,step:1,isDisabled:!1,width:"9ch","aria-label":n.formatMessage(r.currentPage),"aria-current":"page"}):a.jsx(j.Text,{fontWeight:"semibold",color:"neutral.12","aria-current":"page",children:e.currentPage}),a.jsx(j.Text,{color:"neutral.12",children:n.formatMessage(r.ofTotalPages,{totalPages:n.formatNumber(e.totalPages)})})]}),a.jsx(y.IconButton,{onClick:e.goToNextPage,isDisabled:!e.hasNextPage,variant:"ghost",colorPalette:"primary","aria-label":n.formatMessage(r.goToNextPage),children:a.jsx(w.ChevronRight,{})})]})]})};O.displayName="Pagination";exports.Pagination=O;
|
|
2
|
+
//# sourceMappingURL=pagination-xj41eBPX.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pagination-Dbf6i8je.cjs.js","sources":["../../src/components/pagination/hooks/use-pagination.ts","../../src/components/pagination/pagination.i18n.ts","../../src/components/pagination/pagination.tsx"],"sourcesContent":["import { useState, useCallback, useMemo } from \"react\";\n\nexport type PaginationState = {\n /** Total number of items across all pages */\n totalItems: number;\n /** Current active page (1-based) */\n currentPage: number;\n /** Number of items displayed per page */\n pageSize: number;\n /** Total number of pages available */\n totalPages: number;\n /** Index of the first item on current page (1-based) */\n startItem: number;\n /** Index of the last item on current page (1-based) */\n endItem: number;\n /** Whether there is a previous page available */\n hasPreviousPage: boolean;\n /** Whether there is a next page available */\n hasNextPage: boolean;\n};\n\nexport type UsePaginationProps = {\n /** Total number of items to paginate */\n totalItems: number;\n /** Initial current page (1-based), defaults to 1 */\n currentPage?: number;\n /** Initial number of items per page, defaults to 10 */\n pageSize?: number;\n /** Callback fired when the current page changes */\n onPageChange?: (page: number) => void;\n /** Callback fired when the page size changes */\n onPageSizeChange?: (pageSize: number) => void;\n};\n\nexport type UsePaginationReturn = PaginationState & {\n /** Navigate to a specific page number (1-based) */\n goToPage: (page: number) => void;\n /** Navigate to the previous page, if available */\n goToPreviousPage: () => void;\n /** Navigate to the next page, if available */\n goToNextPage: () => void;\n /** Change the number of items displayed per page */\n setPageSize: (pageSize: number) => void;\n};\n\n/**\n * # usePagination\n *\n * Custom hook that provides pagination state management and navigation controls.\n *\n * Supports both controlled and uncontrolled modes:\n * - Controlled: Parent component manages currentPage state via props and callbacks\n * - Uncontrolled: Hook manages internal currentPage state automatically\n *\n * @param props - Configuration object for pagination behavior\n * @param props.totalItems - Total number of items to paginate\n * @param props.currentPage - Current page number (controlled mode). If undefined, uses uncontrolled mode\n * @param props.pageSize - Number of items per page (defaults to 20)\n * @param props.onPageChange - Callback fired when page changes\n * @param props.onPageSizeChange - Callback fired when page size changes\n *\n * @returns Object containing pagination state and navigation functions:\n * - totalItems: Total number of items\n * - currentPage: Current active page number (1-based)\n * - pageSize: Number of items per page\n * - totalPages: Total number of pages\n * - startItem: First item number on current page\n * - endItem: Last item number on current page\n * - hasPreviousPage: Whether previous page exists\n * - hasNextPage: Whether next page exists\n * - goToPage: Function to navigate to specific page\n * - goToPreviousPage: Function to navigate to previous page\n * - goToNextPage: Function to navigate to next page\n * - setPageSize: Function to change page size\n *\n */\nexport function usePagination({\n totalItems,\n currentPage: controlledCurrentPage,\n pageSize: controlledPageSize = 20,\n onPageChange,\n onPageSizeChange,\n}: UsePaginationProps): UsePaginationReturn {\n // Internal state for uncontrolled mode\n const [internalCurrentPage, setInternalCurrentPage] = useState(1);\n const [internalPageSize, setInternalPageSize] = useState(controlledPageSize);\n\n // Determine if controlled or uncontrolled\n const isControlled = controlledCurrentPage !== undefined;\n const currentPage = isControlled\n ? controlledCurrentPage\n : internalCurrentPage;\n const pageSize = controlledPageSize ?? internalPageSize;\n\n // Calculate pagination values\n const totalPages = Math.max(1, Math.ceil(totalItems / pageSize));\n\n // Ensure currentPage is within valid bounds\n const validCurrentPage = Math.max(1, Math.min(currentPage, totalPages));\n\n const startItem = Math.min((validCurrentPage - 1) * pageSize + 1, totalItems);\n const endItem = Math.min(validCurrentPage * pageSize, totalItems);\n\n const hasPreviousPage = validCurrentPage > 1;\n const hasNextPage = validCurrentPage < totalPages;\n\n // Page navigation functions\n const goToPage = useCallback(\n (page: number) => {\n const newPage = Math.max(1, Math.min(page, totalPages));\n\n if (!isControlled) {\n setInternalCurrentPage(newPage);\n }\n\n onPageChange?.(newPage);\n },\n [totalPages, isControlled, onPageChange]\n );\n\n const goToPreviousPage = useCallback(() => {\n if (hasPreviousPage) {\n goToPage(validCurrentPage - 1);\n }\n }, [hasPreviousPage, validCurrentPage, goToPage]);\n\n const goToNextPage = useCallback(() => {\n if (hasNextPage) {\n goToPage(validCurrentPage + 1);\n }\n }, [hasNextPage, validCurrentPage, goToPage]);\n\n const setPageSize = useCallback(\n (newPageSize: number) => {\n const newTotalPages = Math.ceil(totalItems / newPageSize);\n const newPage = Math.min(validCurrentPage, newTotalPages);\n\n setInternalPageSize(newPageSize);\n\n if (!isControlled && newPage !== validCurrentPage) {\n setInternalCurrentPage(newPage);\n }\n\n onPageSizeChange?.(newPageSize);\n\n if (newPage !== validCurrentPage) {\n onPageChange?.(newPage);\n }\n },\n [totalItems, validCurrentPage, isControlled, onPageChange, onPageSizeChange]\n );\n\n return useMemo(\n () => ({\n totalItems,\n currentPage: validCurrentPage,\n pageSize,\n totalPages,\n startItem,\n endItem,\n hasPreviousPage,\n hasNextPage,\n goToPage,\n goToPreviousPage,\n goToNextPage,\n setPageSize,\n }),\n [\n totalItems,\n validCurrentPage,\n pageSize,\n totalPages,\n startItem,\n endItem,\n hasPreviousPage,\n hasNextPage,\n goToPage,\n goToPreviousPage,\n goToNextPage,\n setPageSize,\n ]\n );\n}\n","import { defineMessages } from \"react-intl\";\n\nexport const messages = defineMessages({\n pagination: {\n id: \"Nimbus.Pagination.pagination\",\n description: \"aria-label for the pagination navigation element\",\n defaultMessage: \"Pagination\",\n },\n itemsPerPage: {\n id: \"Nimbus.Pagination.itemsPerPage\",\n description: \"aria-label for the items per page selector\",\n defaultMessage: \"Items per page\",\n },\n itemsPerPageText: {\n id: \"Nimbus.Pagination.itemsPerPageText\",\n description: \"text label displayed next to the page size selector\",\n defaultMessage: \"items per page\",\n },\n goToPreviousPage: {\n id: \"Nimbus.Pagination.goToPreviousPage\",\n description: \"aria-label for the previous page button\",\n defaultMessage: \"Go to previous page\",\n },\n currentPage: {\n id: \"Nimbus.Pagination.currentPage\",\n description: \"aria-label for the current page input field\",\n defaultMessage: \"Current page\",\n },\n page: {\n id: \"Nimbus.Pagination.page\",\n description: \"text label displayed before the page number\",\n defaultMessage: \"Page\",\n },\n ofTotalPages: {\n id: \"Nimbus.Pagination.ofTotalPages\",\n description: \"text showing total pages count after current page input\",\n defaultMessage: \"of {totalPages}\",\n },\n goToNextPage: {\n id: \"Nimbus.Pagination.goToNextPage\",\n description: \"aria-label for the next page button\",\n defaultMessage: \"Go to next page\",\n },\n});\n","import { useMemo } from \"react\";\nimport { useIntl } from \"react-intl\";\nimport { ChevronLeft, ChevronRight } from \"@commercetools/nimbus-icons\";\nimport {\n Flex,\n IconButton,\n NumberInput,\n Select,\n Stack,\n Text,\n} from \"@/components\";\nimport { usePagination } from \"./hooks/use-pagination\";\nimport type { PaginationProps } from \"./pagination.types\";\nimport { messages } from \"./pagination.i18n\";\n\n/**\n * # Pagination\n *\n * A component that allows users to navigate through pages and control page size.\n * Combines a page size selector and page navigator for comprehensive pagination control.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/pagination}\n */\nexport const Pagination = (props: PaginationProps) => {\n const intl = useIntl();\n const {\n totalItems,\n currentPage,\n pageSize,\n pageSizeOptions = [10, 20, 50, 100],\n onPageChange,\n onPageSizeChange,\n \"aria-label\": ariaLabel,\n enablePageInput = true,\n enablePageSizeSelector = true,\n } = props;\n\n const pagination = usePagination({\n totalItems,\n currentPage,\n pageSize,\n onPageChange,\n onPageSizeChange,\n });\n\n // Prepare page size options for select\n const pageSizeSelectOptions = useMemo(\n () =>\n pageSizeOptions.map((size) => ({\n id: size.toString(),\n name: `${size}`,\n })),\n [pageSizeOptions]\n );\n\n const handlePageSizeChange = (key: React.Key | null) => {\n if (key) {\n const newPageSize = parseInt(key.toString(), 10);\n pagination.setPageSize(newPageSize);\n }\n };\n\n return (\n <Stack gap=\"400\" direction={{ base: \"column\", sm: \"row\" }} align=\"center\">\n {/* Page Size Selector */}\n {enablePageSizeSelector && (\n <Flex align=\"center\" gap=\"200\">\n <Select.Root\n isClearable={false}\n selectedKey={pagination.pageSize.toString()}\n onSelectionChange={handlePageSizeChange}\n aria-label={intl.formatMessage(messages.itemsPerPage)}\n >\n <Select.Options>\n {pageSizeSelectOptions.map((option) => (\n <Select.Option key={option.id} id={option.id}>\n {option.name}\n </Select.Option>\n ))}\n </Select.Options>\n </Select.Root>\n <Text color=\"neutral.12\">\n {intl.formatMessage(messages.itemsPerPageText)}\n </Text>\n </Flex>\n )}\n <Flex flexGrow=\"1\" />\n {/* Page Navigator */}\n <Flex\n align=\"center\"\n gap=\"200\"\n role=\"navigation\"\n aria-label={ariaLabel ?? intl.formatMessage(messages.pagination)}\n >\n <IconButton\n onClick={pagination.goToPreviousPage}\n isDisabled={!pagination.hasPreviousPage}\n variant=\"ghost\"\n tone=\"primary\"\n aria-label={intl.formatMessage(messages.goToPreviousPage)}\n >\n <ChevronLeft />\n </IconButton>\n\n <Flex align=\"center\" gap=\"200\">\n <Text color=\"neutral.12\">{intl.formatMessage(messages.page)}</Text>\n {enablePageInput ? (\n <NumberInput\n value={pagination.currentPage}\n onChange={(value: number | undefined) =>\n pagination.goToPage(value || 1)\n }\n minValue={1}\n maxValue={pagination.totalPages}\n step={1}\n isDisabled={false}\n width=\"9ch\"\n aria-label={intl.formatMessage(messages.currentPage)}\n aria-current=\"page\"\n />\n ) : (\n <Text fontWeight=\"semibold\" color=\"neutral.12\" aria-current=\"page\">\n {pagination.currentPage}\n </Text>\n )}\n <Text color=\"neutral.12\">\n {intl.formatMessage(messages.ofTotalPages, {\n totalPages: intl.formatNumber(pagination.totalPages),\n })}\n </Text>\n </Flex>\n\n <IconButton\n onClick={pagination.goToNextPage}\n isDisabled={!pagination.hasNextPage}\n variant=\"ghost\"\n tone=\"primary\"\n aria-label={intl.formatMessage(messages.goToNextPage)}\n >\n <ChevronRight />\n </IconButton>\n </Flex>\n </Stack>\n );\n};\n\n// Manually assign a displayName for debugging purposes\nPagination.displayName = \"Pagination\";\n"],"names":["usePagination","totalItems","controlledCurrentPage","controlledPageSize","onPageChange","onPageSizeChange","internalCurrentPage","setInternalCurrentPage","useState","internalPageSize","setInternalPageSize","isControlled","currentPage","pageSize","totalPages","validCurrentPage","startItem","endItem","hasPreviousPage","hasNextPage","goToPage","useCallback","page","newPage","goToPreviousPage","goToNextPage","setPageSize","newPageSize","newTotalPages","useMemo","messages","defineMessages","Pagination","props","intl","useIntl","pageSizeOptions","ariaLabel","enablePageInput","enablePageSizeSelector","pagination","pageSizeSelectOptions","size","handlePageSizeChange","key","jsxs","Stack","Flex","jsx","Select","option","Text","IconButton","ChevronLeft","NumberInput","value","ChevronRight"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"pagination-xj41eBPX.cjs.js","sources":["../../src/components/pagination/hooks/use-pagination.ts","../../src/components/pagination/pagination.i18n.ts","../../src/components/pagination/pagination.tsx"],"sourcesContent":["import { useState, useCallback, useMemo } from \"react\";\n\nexport type PaginationState = {\n /** Total number of items across all pages */\n totalItems: number;\n /** Current active page (1-based) */\n currentPage: number;\n /** Number of items displayed per page */\n pageSize: number;\n /** Total number of pages available */\n totalPages: number;\n /** Index of the first item on current page (1-based) */\n startItem: number;\n /** Index of the last item on current page (1-based) */\n endItem: number;\n /** Whether there is a previous page available */\n hasPreviousPage: boolean;\n /** Whether there is a next page available */\n hasNextPage: boolean;\n};\n\nexport type UsePaginationProps = {\n /** Total number of items to paginate */\n totalItems: number;\n /** Initial current page (1-based), defaults to 1 */\n currentPage?: number;\n /** Initial number of items per page, defaults to 10 */\n pageSize?: number;\n /** Callback fired when the current page changes */\n onPageChange?: (page: number) => void;\n /** Callback fired when the page size changes */\n onPageSizeChange?: (pageSize: number) => void;\n};\n\nexport type UsePaginationReturn = PaginationState & {\n /** Navigate to a specific page number (1-based) */\n goToPage: (page: number) => void;\n /** Navigate to the previous page, if available */\n goToPreviousPage: () => void;\n /** Navigate to the next page, if available */\n goToNextPage: () => void;\n /** Change the number of items displayed per page */\n setPageSize: (pageSize: number) => void;\n};\n\n/**\n * # usePagination\n *\n * Custom hook that provides pagination state management and navigation controls.\n *\n * Supports both controlled and uncontrolled modes:\n * - Controlled: Parent component manages currentPage state via props and callbacks\n * - Uncontrolled: Hook manages internal currentPage state automatically\n *\n * @param props - Configuration object for pagination behavior\n * @param props.totalItems - Total number of items to paginate\n * @param props.currentPage - Current page number (controlled mode). If undefined, uses uncontrolled mode\n * @param props.pageSize - Number of items per page (defaults to 20)\n * @param props.onPageChange - Callback fired when page changes\n * @param props.onPageSizeChange - Callback fired when page size changes\n *\n * @returns Object containing pagination state and navigation functions:\n * - totalItems: Total number of items\n * - currentPage: Current active page number (1-based)\n * - pageSize: Number of items per page\n * - totalPages: Total number of pages\n * - startItem: First item number on current page\n * - endItem: Last item number on current page\n * - hasPreviousPage: Whether previous page exists\n * - hasNextPage: Whether next page exists\n * - goToPage: Function to navigate to specific page\n * - goToPreviousPage: Function to navigate to previous page\n * - goToNextPage: Function to navigate to next page\n * - setPageSize: Function to change page size\n *\n */\nexport function usePagination({\n totalItems,\n currentPage: controlledCurrentPage,\n pageSize: controlledPageSize = 20,\n onPageChange,\n onPageSizeChange,\n}: UsePaginationProps): UsePaginationReturn {\n // Internal state for uncontrolled mode\n const [internalCurrentPage, setInternalCurrentPage] = useState(1);\n const [internalPageSize, setInternalPageSize] = useState(controlledPageSize);\n\n // Determine if controlled or uncontrolled\n const isControlled = controlledCurrentPage !== undefined;\n const currentPage = isControlled\n ? controlledCurrentPage\n : internalCurrentPage;\n const pageSize = controlledPageSize ?? internalPageSize;\n\n // Calculate pagination values\n const totalPages = Math.max(1, Math.ceil(totalItems / pageSize));\n\n // Ensure currentPage is within valid bounds\n const validCurrentPage = Math.max(1, Math.min(currentPage, totalPages));\n\n const startItem = Math.min((validCurrentPage - 1) * pageSize + 1, totalItems);\n const endItem = Math.min(validCurrentPage * pageSize, totalItems);\n\n const hasPreviousPage = validCurrentPage > 1;\n const hasNextPage = validCurrentPage < totalPages;\n\n // Page navigation functions\n const goToPage = useCallback(\n (page: number) => {\n const newPage = Math.max(1, Math.min(page, totalPages));\n\n if (!isControlled) {\n setInternalCurrentPage(newPage);\n }\n\n onPageChange?.(newPage);\n },\n [totalPages, isControlled, onPageChange]\n );\n\n const goToPreviousPage = useCallback(() => {\n if (hasPreviousPage) {\n goToPage(validCurrentPage - 1);\n }\n }, [hasPreviousPage, validCurrentPage, goToPage]);\n\n const goToNextPage = useCallback(() => {\n if (hasNextPage) {\n goToPage(validCurrentPage + 1);\n }\n }, [hasNextPage, validCurrentPage, goToPage]);\n\n const setPageSize = useCallback(\n (newPageSize: number) => {\n const newTotalPages = Math.ceil(totalItems / newPageSize);\n const newPage = Math.min(validCurrentPage, newTotalPages);\n\n setInternalPageSize(newPageSize);\n\n if (!isControlled && newPage !== validCurrentPage) {\n setInternalCurrentPage(newPage);\n }\n\n onPageSizeChange?.(newPageSize);\n\n if (newPage !== validCurrentPage) {\n onPageChange?.(newPage);\n }\n },\n [totalItems, validCurrentPage, isControlled, onPageChange, onPageSizeChange]\n );\n\n return useMemo(\n () => ({\n totalItems,\n currentPage: validCurrentPage,\n pageSize,\n totalPages,\n startItem,\n endItem,\n hasPreviousPage,\n hasNextPage,\n goToPage,\n goToPreviousPage,\n goToNextPage,\n setPageSize,\n }),\n [\n totalItems,\n validCurrentPage,\n pageSize,\n totalPages,\n startItem,\n endItem,\n hasPreviousPage,\n hasNextPage,\n goToPage,\n goToPreviousPage,\n goToNextPage,\n setPageSize,\n ]\n );\n}\n","import { defineMessages } from \"react-intl\";\n\nexport const messages = defineMessages({\n pagination: {\n id: \"Nimbus.Pagination.pagination\",\n description: \"aria-label for the pagination navigation element\",\n defaultMessage: \"Pagination\",\n },\n itemsPerPage: {\n id: \"Nimbus.Pagination.itemsPerPage\",\n description: \"aria-label for the items per page selector\",\n defaultMessage: \"Items per page\",\n },\n itemsPerPageText: {\n id: \"Nimbus.Pagination.itemsPerPageText\",\n description: \"text label displayed next to the page size selector\",\n defaultMessage: \"items per page\",\n },\n goToPreviousPage: {\n id: \"Nimbus.Pagination.goToPreviousPage\",\n description: \"aria-label for the previous page button\",\n defaultMessage: \"Go to previous page\",\n },\n currentPage: {\n id: \"Nimbus.Pagination.currentPage\",\n description: \"aria-label for the current page input field\",\n defaultMessage: \"Current page\",\n },\n page: {\n id: \"Nimbus.Pagination.page\",\n description: \"text label displayed before the page number\",\n defaultMessage: \"Page\",\n },\n ofTotalPages: {\n id: \"Nimbus.Pagination.ofTotalPages\",\n description: \"text showing total pages count after current page input\",\n defaultMessage: \"of {totalPages}\",\n },\n goToNextPage: {\n id: \"Nimbus.Pagination.goToNextPage\",\n description: \"aria-label for the next page button\",\n defaultMessage: \"Go to next page\",\n },\n});\n","import { useMemo } from \"react\";\nimport { useIntl } from \"react-intl\";\nimport { ChevronLeft, ChevronRight } from \"@commercetools/nimbus-icons\";\nimport {\n Flex,\n IconButton,\n NumberInput,\n Select,\n Stack,\n Text,\n} from \"@/components\";\nimport { usePagination } from \"./hooks/use-pagination\";\nimport type { PaginationProps } from \"./pagination.types\";\nimport { messages } from \"./pagination.i18n\";\n\n/**\n * # Pagination\n *\n * A component that allows users to navigate through pages and control page size.\n * Combines a page size selector and page navigator for comprehensive pagination control.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/pagination}\n */\nexport const Pagination = (props: PaginationProps) => {\n const intl = useIntl();\n const {\n totalItems,\n currentPage,\n pageSize,\n pageSizeOptions = [10, 20, 50, 100],\n onPageChange,\n onPageSizeChange,\n \"aria-label\": ariaLabel,\n enablePageInput = true,\n enablePageSizeSelector = true,\n } = props;\n\n const pagination = usePagination({\n totalItems,\n currentPage,\n pageSize,\n onPageChange,\n onPageSizeChange,\n });\n\n // Prepare page size options for select\n const pageSizeSelectOptions = useMemo(\n () =>\n pageSizeOptions.map((size) => ({\n id: size.toString(),\n name: `${size}`,\n })),\n [pageSizeOptions]\n );\n\n const handlePageSizeChange = (key: React.Key | null) => {\n if (key) {\n const newPageSize = parseInt(key.toString(), 10);\n pagination.setPageSize(newPageSize);\n }\n };\n\n return (\n <Stack gap=\"400\" direction={{ base: \"column\", sm: \"row\" }} align=\"center\">\n {/* Page Size Selector */}\n {enablePageSizeSelector && (\n <Flex align=\"center\" gap=\"200\">\n <Select.Root\n isClearable={false}\n selectedKey={pagination.pageSize.toString()}\n onSelectionChange={handlePageSizeChange}\n aria-label={intl.formatMessage(messages.itemsPerPage)}\n >\n <Select.Options>\n {pageSizeSelectOptions.map((option) => (\n <Select.Option key={option.id} id={option.id}>\n {option.name}\n </Select.Option>\n ))}\n </Select.Options>\n </Select.Root>\n <Text color=\"neutral.12\">\n {intl.formatMessage(messages.itemsPerPageText)}\n </Text>\n </Flex>\n )}\n <Flex flexGrow=\"1\" />\n {/* Page Navigator */}\n <Flex\n align=\"center\"\n gap=\"200\"\n role=\"navigation\"\n aria-label={ariaLabel ?? intl.formatMessage(messages.pagination)}\n >\n <IconButton\n onClick={pagination.goToPreviousPage}\n isDisabled={!pagination.hasPreviousPage}\n variant=\"ghost\"\n colorPalette=\"primary\"\n aria-label={intl.formatMessage(messages.goToPreviousPage)}\n >\n <ChevronLeft />\n </IconButton>\n\n <Flex align=\"center\" gap=\"200\">\n <Text color=\"neutral.12\">{intl.formatMessage(messages.page)}</Text>\n {enablePageInput ? (\n <NumberInput\n value={pagination.currentPage}\n onChange={(value: number | undefined) =>\n pagination.goToPage(value || 1)\n }\n minValue={1}\n maxValue={pagination.totalPages}\n step={1}\n isDisabled={false}\n width=\"9ch\"\n aria-label={intl.formatMessage(messages.currentPage)}\n aria-current=\"page\"\n />\n ) : (\n <Text fontWeight=\"semibold\" color=\"neutral.12\" aria-current=\"page\">\n {pagination.currentPage}\n </Text>\n )}\n <Text color=\"neutral.12\">\n {intl.formatMessage(messages.ofTotalPages, {\n totalPages: intl.formatNumber(pagination.totalPages),\n })}\n </Text>\n </Flex>\n\n <IconButton\n onClick={pagination.goToNextPage}\n isDisabled={!pagination.hasNextPage}\n variant=\"ghost\"\n colorPalette=\"primary\"\n aria-label={intl.formatMessage(messages.goToNextPage)}\n >\n <ChevronRight />\n </IconButton>\n </Flex>\n </Stack>\n );\n};\n\n// Manually assign a displayName for debugging purposes\nPagination.displayName = \"Pagination\";\n"],"names":["usePagination","totalItems","controlledCurrentPage","controlledPageSize","onPageChange","onPageSizeChange","internalCurrentPage","setInternalCurrentPage","useState","internalPageSize","setInternalPageSize","isControlled","currentPage","pageSize","totalPages","validCurrentPage","startItem","endItem","hasPreviousPage","hasNextPage","goToPage","useCallback","page","newPage","goToPreviousPage","goToNextPage","setPageSize","newPageSize","newTotalPages","useMemo","messages","defineMessages","Pagination","props","intl","useIntl","pageSizeOptions","ariaLabel","enablePageInput","enablePageSizeSelector","pagination","pageSizeSelectOptions","size","handlePageSizeChange","key","jsxs","Stack","Flex","jsx","Select","option","Text","IconButton","ChevronLeft","NumberInput","value","ChevronRight"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";const s=require("react/jsx-runtime"),h=require("react"),b=require("./text-input-B5tizBg4.cjs.js"),a=require("@commercetools/nimbus-icons"),o=require("react-intl"),n=require("./tooltip-Aar_qzmT.cjs.js"),m=require("./icon-button-C_itb6iA.cjs.js"),e=o.defineMessages({hide:{id:"Nimbus.PasswordInput.hide",description:"aria-label & tooltip for hide password button",defaultMessage:"Hide password"},show:{id:"Nimbus.PasswordInput.show",description:"aria-label & tooltip for show password button",defaultMessage:"Show password"}}),d=i=>{const{ref:l,size:u="md",isDisabled:c}=i,r=o.useIntl(),[t,p]=h.useState(!1),w=()=>p(!t);return s.jsx(b.TextInput,{ref:l,...i,trailingElement:s.jsxs(n.Tooltip.Root,{children:[s.jsx(m.IconButton,{size:u==="md"?"xs":"2xs",variant:"ghost",colorPalette:"primary","aria-label":t?r.formatMessage(e.hide):r.formatMessage(e.show),onPress:w,isDisabled:c,children:t?s.jsx(a.VisibilityOff,{}):s.jsx(a.Visibility,{})}),s.jsx(n.Tooltip.Content,{children:s.jsx(o.FormattedMessage,{...t?e.hide:e.show})})]}),type:t?"text":"password"})};d.displayName="PasswordInput";exports.PasswordInput=d;
|
|
2
|
+
//# sourceMappingURL=password-input-DGtJisDd.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"password-input-DGtJisDd.cjs.js","sources":["../../src/components/password-input/password-input.i18n.ts","../../src/components/password-input/password-input.tsx"],"sourcesContent":["import { defineMessages } from \"react-intl\";\n\nexport const messages = defineMessages({\n hide: {\n id: \"Nimbus.PasswordInput.hide\",\n description: \"aria-label & tooltip for hide password button\",\n defaultMessage: \"Hide password\",\n },\n show: {\n id: \"Nimbus.PasswordInput.show\",\n description: \"aria-label & tooltip for show password button\",\n defaultMessage: \"Show password\",\n },\n});\n","import { useState } from \"react\";\nimport { IconButton, Tooltip } from \"@/components\";\nimport { TextInput } from \"@/components/text-input\";\nimport { Visibility, VisibilityOff } from \"@commercetools/nimbus-icons\";\nimport type { PasswordInputProps } from \"./password-input.types\";\nimport { FormattedMessage, useIntl } from \"react-intl\";\nimport { messages } from \"./password-input.i18n\";\n\n/**\n * # PasswordInput\n *\n * A password input is a text field that hides entered characters for secure password entry.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/passwordinput}\n */\nexport const PasswordInput = (props: PasswordInputProps) => {\n const { ref, size = \"md\", isDisabled } = props;\n\n const intl = useIntl();\n const [showPassword, setShowPassword] = useState(false);\n\n const toggleVisibility = () => setShowPassword(!showPassword);\n\n return (\n <TextInput\n ref={ref}\n {...props}\n trailingElement={\n <Tooltip.Root>\n <IconButton\n size={size === \"md\" ? \"xs\" : \"2xs\"}\n variant=\"ghost\"\n colorPalette=\"primary\"\n aria-label={\n showPassword\n ? intl.formatMessage(messages.hide)\n : intl.formatMessage(messages.show)\n }\n onPress={toggleVisibility}\n isDisabled={isDisabled}\n >\n {showPassword ? <VisibilityOff /> : <Visibility />}\n </IconButton>\n <Tooltip.Content>\n <FormattedMessage\n {...(showPassword ? messages.hide : messages.show)}\n />\n </Tooltip.Content>\n </Tooltip.Root>\n }\n type={showPassword ? \"text\" : \"password\"}\n />\n );\n};\n\nPasswordInput.displayName = \"PasswordInput\";\n"],"names":["messages","defineMessages","PasswordInput","props","ref","size","isDisabled","intl","useIntl","showPassword","setShowPassword","useState","toggleVisibility","jsx","TextInput","jsxs","Tooltip","IconButton","VisibilityOff","Visibility","FormattedMessage"],"mappings":"kQAEaA,EAAWC,EAAAA,eAAe,CACrC,KAAM,CACJ,GAAI,4BACJ,YAAa,gDACb,eAAgB,eAAA,EAElB,KAAM,CACJ,GAAI,4BACJ,YAAa,gDACb,eAAgB,eAAA,CAEpB,CAAC,ECEYC,EAAiBC,GAA8B,CAC1D,KAAM,CAAE,IAAAC,EAAK,KAAAC,EAAO,KAAM,WAAAC,GAAeH,EAEnCI,EAAOC,EAAAA,QAAA,EACP,CAACC,EAAcC,CAAe,EAAIC,EAAAA,SAAS,EAAK,EAEhDC,EAAmB,IAAMF,EAAgB,CAACD,CAAY,EAE5D,OACEI,EAAAA,IAACC,EAAAA,UAAA,CACC,IAAAV,EACC,GAAGD,EACJ,gBACEY,EAAAA,KAACC,EAAAA,QAAQ,KAAR,CACC,SAAA,CAAAH,EAAAA,IAACI,EAAAA,WAAA,CACC,KAAMZ,IAAS,KAAO,KAAO,MAC7B,QAAQ,QACR,aAAa,UACb,aACEI,EACIF,EAAK,cAAcP,EAAS,IAAI,EAChCO,EAAK,cAAcP,EAAS,IAAI,EAEtC,QAASY,EACT,WAAAN,EAEC,SAAAG,EAAeI,MAACK,EAAAA,cAAA,CAAA,CAAc,QAAMC,EAAAA,WAAA,CAAA,CAAW,CAAA,CAAA,EAElDN,EAAAA,IAACG,EAAAA,QAAQ,QAAR,CACC,SAAAH,EAAAA,IAACO,EAAAA,iBAAA,CACE,GAAIX,EAAeT,EAAS,KAAOA,EAAS,IAAA,CAAA,CAC/C,CACF,CAAA,EACF,EAEF,KAAMS,EAAe,OAAS,UAAA,CAAA,CAGpC,EAEAP,EAAc,YAAc"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx as s, jsxs as p } from "react/jsx-runtime";
|
|
2
2
|
import { useState as w } from "react";
|
|
3
|
-
import { T as f } from "./text-input-
|
|
3
|
+
import { T as f } from "./text-input-DBFEKmrv.es.js";
|
|
4
4
|
import { VisibilityOff as h, Visibility as u } from "@commercetools/nimbus-icons";
|
|
5
|
-
import { defineMessages as
|
|
5
|
+
import { defineMessages as c, useIntl as b, FormattedMessage as g } from "react-intl";
|
|
6
6
|
import { b as r } from "./tooltip-CDmtIjmS.es.js";
|
|
7
|
-
import { I } from "./icon-button-
|
|
8
|
-
const t = /* @__PURE__ */
|
|
7
|
+
import { I as P } from "./icon-button-XkzBkGuJ.es.js";
|
|
8
|
+
const t = /* @__PURE__ */ c({
|
|
9
9
|
hide: {
|
|
10
10
|
id: "Nimbus.PasswordInput.hide",
|
|
11
11
|
description: "aria-label & tooltip for hide password button",
|
|
@@ -16,8 +16,8 @@ const t = /* @__PURE__ */ b({
|
|
|
16
16
|
description: "aria-label & tooltip for show password button",
|
|
17
17
|
defaultMessage: "Show password"
|
|
18
18
|
}
|
|
19
|
-
}),
|
|
20
|
-
const { ref: a, size: d = "md", isDisabled: n } = e, i =
|
|
19
|
+
}), I = (e) => {
|
|
20
|
+
const { ref: a, size: d = "md", isDisabled: n } = e, i = b(), [o, l] = w(!1), m = () => l(!o);
|
|
21
21
|
return /* @__PURE__ */ s(
|
|
22
22
|
f,
|
|
23
23
|
{
|
|
@@ -25,11 +25,11 @@ const t = /* @__PURE__ */ b({
|
|
|
25
25
|
...e,
|
|
26
26
|
trailingElement: /* @__PURE__ */ p(r.Root, { children: [
|
|
27
27
|
/* @__PURE__ */ s(
|
|
28
|
-
|
|
28
|
+
P,
|
|
29
29
|
{
|
|
30
30
|
size: d === "md" ? "xs" : "2xs",
|
|
31
31
|
variant: "ghost",
|
|
32
|
-
|
|
32
|
+
colorPalette: "primary",
|
|
33
33
|
"aria-label": o ? i.formatMessage(t.hide) : i.formatMessage(t.show),
|
|
34
34
|
onPress: m,
|
|
35
35
|
isDisabled: n,
|
|
@@ -47,8 +47,8 @@ const t = /* @__PURE__ */ b({
|
|
|
47
47
|
}
|
|
48
48
|
);
|
|
49
49
|
};
|
|
50
|
-
|
|
50
|
+
I.displayName = "PasswordInput";
|
|
51
51
|
export {
|
|
52
|
-
P
|
|
52
|
+
I as P
|
|
53
53
|
};
|
|
54
|
-
//# sourceMappingURL=password-input-
|
|
54
|
+
//# sourceMappingURL=password-input-Dw-m0lej.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"password-input-Dw-m0lej.es.js","sources":["../../src/components/password-input/password-input.i18n.ts","../../src/components/password-input/password-input.tsx"],"sourcesContent":["import { defineMessages } from \"react-intl\";\n\nexport const messages = defineMessages({\n hide: {\n id: \"Nimbus.PasswordInput.hide\",\n description: \"aria-label & tooltip for hide password button\",\n defaultMessage: \"Hide password\",\n },\n show: {\n id: \"Nimbus.PasswordInput.show\",\n description: \"aria-label & tooltip for show password button\",\n defaultMessage: \"Show password\",\n },\n});\n","import { useState } from \"react\";\nimport { IconButton, Tooltip } from \"@/components\";\nimport { TextInput } from \"@/components/text-input\";\nimport { Visibility, VisibilityOff } from \"@commercetools/nimbus-icons\";\nimport type { PasswordInputProps } from \"./password-input.types\";\nimport { FormattedMessage, useIntl } from \"react-intl\";\nimport { messages } from \"./password-input.i18n\";\n\n/**\n * # PasswordInput\n *\n * A password input is a text field that hides entered characters for secure password entry.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/passwordinput}\n */\nexport const PasswordInput = (props: PasswordInputProps) => {\n const { ref, size = \"md\", isDisabled } = props;\n\n const intl = useIntl();\n const [showPassword, setShowPassword] = useState(false);\n\n const toggleVisibility = () => setShowPassword(!showPassword);\n\n return (\n <TextInput\n ref={ref}\n {...props}\n trailingElement={\n <Tooltip.Root>\n <IconButton\n size={size === \"md\" ? \"xs\" : \"2xs\"}\n variant=\"ghost\"\n colorPalette=\"primary\"\n aria-label={\n showPassword\n ? intl.formatMessage(messages.hide)\n : intl.formatMessage(messages.show)\n }\n onPress={toggleVisibility}\n isDisabled={isDisabled}\n >\n {showPassword ? <VisibilityOff /> : <Visibility />}\n </IconButton>\n <Tooltip.Content>\n <FormattedMessage\n {...(showPassword ? messages.hide : messages.show)}\n />\n </Tooltip.Content>\n </Tooltip.Root>\n }\n type={showPassword ? \"text\" : \"password\"}\n />\n );\n};\n\nPasswordInput.displayName = \"PasswordInput\";\n"],"names":["messages","defineMessages","PasswordInput","props","ref","size","isDisabled","intl","useIntl","showPassword","setShowPassword","useState","toggleVisibility","jsx","TextInput","jsxs","Tooltip","IconButton","VisibilityOff","Visibility","FormattedMessage"],"mappings":";;;;;;;AAEO,MAAMA,IAAW,gBAAAC,EAAe;AAAA,EACrC,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAAA,EAElB,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,EAAA;AAEpB,CAAC,GCEYC,IAAgB,CAACC,MAA8B;AAC1D,QAAM,EAAE,KAAAC,GAAK,MAAAC,IAAO,MAAM,YAAAC,MAAeH,GAEnCI,IAAOC,EAAA,GACP,CAACC,GAAcC,CAAe,IAAIC,EAAS,EAAK,GAEhDC,IAAmB,MAAMF,EAAgB,CAACD,CAAY;AAE5D,SACE,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAV;AAAA,MACC,GAAGD;AAAA,MACJ,iBACE,gBAAAY,EAACC,EAAQ,MAAR,EACC,UAAA;AAAA,QAAA,gBAAAH;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,MAAMZ,MAAS,OAAO,OAAO;AAAA,YAC7B,SAAQ;AAAA,YACR,cAAa;AAAA,YACb,cACEI,IACIF,EAAK,cAAcP,EAAS,IAAI,IAChCO,EAAK,cAAcP,EAAS,IAAI;AAAA,YAEtC,SAASY;AAAA,YACT,YAAAN;AAAA,YAEC,UAAAG,IAAe,gBAAAI,EAACK,GAAA,CAAA,CAAc,sBAAMC,GAAA,CAAA,CAAW;AAAA,UAAA;AAAA,QAAA;AAAA,QAElD,gBAAAN,EAACG,EAAQ,SAAR,EACC,UAAA,gBAAAH;AAAA,UAACO;AAAA,UAAA;AAAA,YACE,GAAIX,IAAeT,EAAS,OAAOA,EAAS;AAAA,UAAA;AAAA,QAAA,EAC/C,CACF;AAAA,MAAA,GACF;AAAA,MAEF,MAAMS,IAAe,SAAS;AAAA,IAAA;AAAA,EAAA;AAGpC;AAEAP,EAAc,cAAc;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import { createRecipeContext as p } from "@chakra-ui/react";
|
|
3
|
-
import { $ as s } from "./Dialog-
|
|
3
|
+
import { $ as s } from "./Dialog-BUtdEtlF.es.js";
|
|
4
4
|
const { withContext: n } = /* @__PURE__ */ p({
|
|
5
5
|
key: "popover"
|
|
6
6
|
}), c = /* @__PURE__ */ n(s), i = (o) => {
|
|
@@ -11,4 +11,4 @@ i.displayName = "Popover";
|
|
|
11
11
|
export {
|
|
12
12
|
i as P
|
|
13
13
|
};
|
|
14
|
-
//# sourceMappingURL=popover-
|
|
14
|
+
//# sourceMappingURL=popover-CaE5pDl9.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover-
|
|
1
|
+
{"version":3,"file":"popover-CaE5pDl9.es.js","sources":["../../src/components/popover/popover.slots.tsx","../../src/components/popover/popover.tsx"],"sourcesContent":["import { createRecipeContext } from \"@chakra-ui/react\";\nimport { Popover as RaPopover } from \"react-aria-components\";\nimport type { SlotComponent } from \"@/type-utils\";\nimport type { PopoverProps } from \"./popover.types\";\n\nconst { withContext } = createRecipeContext({\n key: \"popover\",\n});\n\nexport const PopoverRootSlot: SlotComponent<typeof RaPopover, PopoverProps> =\n withContext<typeof RaPopover, PopoverProps>(RaPopover);\n","import { PopoverRootSlot } from \"./popover.slots\";\nimport type { PopoverProps } from \"./popover.types\";\n\n/**\n * # Popover\n *\n * A component that displays floating content in relation to a trigger element.\n *\n * Note this component is only used internally.\n */\nexport const Popover = (props: PopoverProps) => {\n const { children, ...rest } = props;\n\n return <PopoverRootSlot {...rest}>{children}</PopoverRootSlot>;\n};\n\nPopover.displayName = \"Popover\";\n"],"names":["withContext","createRecipeContext","PopoverRootSlot","RaPopover","Popover","props","children","rest","jsx"],"mappings":";;;AAKA,MAAM,EAAE,aAAAA,EAAA,IAAgB,gBAAAC,EAAoB;AAAA,EAC1C,KAAK;AACP,CAAC,GAEYC,IACX,gBAAAF,EAA4CG,CAAS,GCA1CC,IAAU,CAACC,MAAwB;AAC9C,QAAM,EAAE,UAAAC,GAAU,GAAGC,EAAA,IAASF;AAE9B,SAAO,gBAAAG,EAACN,GAAA,EAAiB,GAAGK,GAAO,UAAAD,EAAA,CAAS;AAC9C;AAEAF,EAAQ,cAAc;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const s=require("react/jsx-runtime"),c=require("@chakra-ui/react"),n=require("./Dialog-
|
|
2
|
-
//# sourceMappingURL=popover-
|
|
1
|
+
"use strict";const s=require("react/jsx-runtime"),c=require("@chakra-ui/react"),n=require("./Dialog-Ye_7tQZU.cjs.js"),{withContext:i}=c.createRecipeContext({key:"popover"}),p=i(n.$07b14b47974efb58$export$5b6b19405a83ff9d),e=o=>{const{children:t,...r}=o;return s.jsx(p,{...r,children:t})};e.displayName="Popover";exports.Popover=e;
|
|
2
|
+
//# sourceMappingURL=popover-DY7ASSCU.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover-
|
|
1
|
+
{"version":3,"file":"popover-DY7ASSCU.cjs.js","sources":["../../src/components/popover/popover.slots.tsx","../../src/components/popover/popover.tsx"],"sourcesContent":["import { createRecipeContext } from \"@chakra-ui/react\";\nimport { Popover as RaPopover } from \"react-aria-components\";\nimport type { SlotComponent } from \"@/type-utils\";\nimport type { PopoverProps } from \"./popover.types\";\n\nconst { withContext } = createRecipeContext({\n key: \"popover\",\n});\n\nexport const PopoverRootSlot: SlotComponent<typeof RaPopover, PopoverProps> =\n withContext<typeof RaPopover, PopoverProps>(RaPopover);\n","import { PopoverRootSlot } from \"./popover.slots\";\nimport type { PopoverProps } from \"./popover.types\";\n\n/**\n * # Popover\n *\n * A component that displays floating content in relation to a trigger element.\n *\n * Note this component is only used internally.\n */\nexport const Popover = (props: PopoverProps) => {\n const { children, ...rest } = props;\n\n return <PopoverRootSlot {...rest}>{children}</PopoverRootSlot>;\n};\n\nPopover.displayName = \"Popover\";\n"],"names":["withContext","createRecipeContext","PopoverRootSlot","RaPopover","Popover","props","children","rest","jsx"],"mappings":"sHAKM,CAAE,YAAAA,CAAA,EAAgBC,sBAAoB,CAC1C,IAAK,SACP,CAAC,EAEYC,EACXF,EAA4CG,2CAAS,ECA1CC,EAAWC,GAAwB,CAC9C,KAAM,CAAE,SAAAC,EAAU,GAAGC,CAAA,EAASF,EAE9B,OAAOG,EAAAA,IAACN,EAAA,CAAiB,GAAGK,EAAO,SAAAD,CAAA,CAAS,CAC9C,EAEAF,EAAQ,YAAc"}
|
|
@@ -4,7 +4,7 @@ import { a as m } from "./Label-CUlxhtnU.es.js";
|
|
|
4
4
|
import { a as V } from "./ProgressBar-DZzovBW5.es.js";
|
|
5
5
|
import { createSlotRecipeContext as F, mergeRefs as j } from "@chakra-ui/react";
|
|
6
6
|
import { useSlotRecipe as H } from "@chakra-ui/react/styled-system";
|
|
7
|
-
import { e as D } from "./extract-style-props-
|
|
7
|
+
import { e as D } from "./extract-style-props-fH5EHRZU.es.js";
|
|
8
8
|
import { $ as G } from "./useObjectRef-CaJ5pgjX.es.js";
|
|
9
9
|
import { Flex as I } from "@chakra-ui/react/flex";
|
|
10
10
|
import { B as L } from "./box-DuBoAZvq.es.js";
|
|
@@ -74,4 +74,4 @@ A.displayName = "ProgressBar";
|
|
|
74
74
|
export {
|
|
75
75
|
A as P
|
|
76
76
|
};
|
|
77
|
-
//# sourceMappingURL=progress-bar-
|
|
77
|
+
//# sourceMappingURL=progress-bar-CYd6T1Ax.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"progress-bar-
|
|
1
|
+
{"version":3,"file":"progress-bar-CYd6T1Ax.es.js","sources":["../../src/components/progress-bar/progress-bar.slots.tsx","../../src/components/progress-bar/progress-bar.tsx"],"sourcesContent":["import { createSlotRecipeContext } from \"@chakra-ui/react\";\nimport type {\n ProgressBarRootSlotProps,\n ProgressBarTrackSlotProps,\n ProgressBarFillSlotProps,\n ProgressBarLabelSlotProps,\n ProgressBarValueSlotProps,\n} from \"./progress-bar.types.tsx\";\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n key: \"progressBar\",\n});\n\n// ProgressBar Root - Main container\nexport const ProgressBarRootSlot = withProvider<\n HTMLDivElement,\n ProgressBarRootSlotProps\n>(\"div\", \"root\");\n\n// ProgressBar Track - Background bar\nexport const ProgressBarTrackSlot = withContext<\n HTMLDivElement,\n ProgressBarTrackSlotProps\n>(\"div\", \"track\");\n\n// ProgressBar Fill - Progress indicator\nexport const ProgressBarFillSlot = withContext<\n HTMLDivElement,\n ProgressBarFillSlotProps\n>(\"div\", \"fill\");\n\n// ProgressBar Label - Label text\nexport const ProgressBarLabelSlot = withContext<\n HTMLSpanElement,\n ProgressBarLabelSlotProps\n>(\"span\", \"label\");\n\n// ProgressBar Value - Value text\nexport const ProgressBarValueSlot = withContext<\n HTMLSpanElement,\n ProgressBarValueSlotProps\n>(\"span\", \"value\");\n","import { useRef } from \"react\";\nimport {\n ProgressBar as RaProgressBar,\n Label as RaLabel,\n} from \"react-aria-components\";\nimport { useObjectRef } from \"react-aria\";\nimport { mergeRefs } from \"@chakra-ui/react\";\nimport { useSlotRecipe } from \"@chakra-ui/react/styled-system\";\nimport { Flex, Box } from \"@/components\";\nimport {\n ProgressBarRootSlot,\n ProgressBarTrackSlot,\n ProgressBarFillSlot,\n ProgressBarLabelSlot,\n ProgressBarValueSlot,\n} from \"./progress-bar.slots\";\nimport type { ProgressBarProps } from \"./progress-bar.types\";\nimport { extractStyleProps } from \"@/utils\";\n\n/**\n * ProgressBar\n * ============================================================\n * Displays progress towards completion of a task or process\n *\n * Features:\n *\n * - Supports both determinate (with value) and indeterminate (loading) states\n * - Two visual variants: solid (gradient) and contrast (monochromatic)\n * - Three layouts: minimal, inline, and stacked\n * - Configurable value formatting with internationalization support\n * - Full accessibility support with ARIA attributes\n * - Allows forwarding refs to the underlying DOM element\n * - Accepts all native HTML div attributes\n * - Supports variants, sizes, etc. configured in the recipe\n * - Allows overriding styles by using style-props\n */\nexport const ProgressBar = (props: ProgressBarProps) => {\n const {\n ref: forwardedRef,\n value,\n minValue = 0,\n maxValue = 100,\n isDynamic = true,\n isIndeterminate,\n label,\n formatOptions = { style: \"percent\" },\n variant = \"solid\",\n layout = \"stacked\",\n colorPalette = \"primary\",\n ...rest\n } = props;\n\n const recipe = useSlotRecipe({ key: \"progressBar\" });\n const [recipeProps, remainingProps] = recipe.splitVariantProps({\n variant,\n colorPalette,\n ...props,\n });\n const [styleProps] = extractStyleProps(remainingProps);\n\n const localRef = useRef<HTMLDivElement>(null);\n const ref = useObjectRef(mergeRefs(localRef, forwardedRef));\n\n return (\n <ProgressBarRootSlot\n {...recipeProps}\n {...styleProps}\n {...recipeProps}\n isDynamic={isDynamic}\n isIndeterminate={isIndeterminate}\n asChild\n >\n <RaProgressBar\n ref={ref}\n value={value}\n minValue={minValue}\n maxValue={maxValue}\n isIndeterminate={isIndeterminate}\n formatOptions={formatOptions}\n {...rest}\n >\n {({ percentage, valueText }) => (\n <>\n {layout === \"stacked\" && (\n <Flex>\n {label && (\n <ProgressBarLabelSlot asChild>\n <RaLabel>{label}</RaLabel>\n </ProgressBarLabelSlot>\n )}\n <Box flexGrow=\"1\" />\n {label && value && (\n <ProgressBarValueSlot>{valueText}</ProgressBarValueSlot>\n )}\n </Flex>\n )}\n\n {layout === \"inline\" && label && (\n <ProgressBarLabelSlot lineHeight=\"1\" asChild>\n <RaLabel>{label}</RaLabel>\n </ProgressBarLabelSlot>\n )}\n\n <ProgressBarTrackSlot>\n <ProgressBarFillSlot\n style={{ width: isIndeterminate ? \"40%\" : `${percentage}%` }}\n data-indeterminate={isIndeterminate}\n data-complete={\n !isIndeterminate &&\n percentage !== undefined &&\n percentage >= 100\n }\n />\n </ProgressBarTrackSlot>\n\n {layout === \"inline\" && value && (\n <ProgressBarValueSlot lineHeight=\"1\">\n {valueText}\n </ProgressBarValueSlot>\n )}\n </>\n )}\n </RaProgressBar>\n </ProgressBarRootSlot>\n );\n};\n\nProgressBar.displayName = \"ProgressBar\";\n"],"names":["withProvider","withContext","createSlotRecipeContext","ProgressBarRootSlot","ProgressBarTrackSlot","ProgressBarFillSlot","ProgressBarLabelSlot","ProgressBarValueSlot","ProgressBar","props","forwardedRef","value","minValue","maxValue","isDynamic","isIndeterminate","label","formatOptions","variant","layout","colorPalette","rest","recipe","useSlotRecipe","recipeProps","remainingProps","styleProps","extractStyleProps","localRef","useRef","ref","useObjectRef","mergeRefs","jsx","RaProgressBar","percentage","valueText","jsxs","Fragment","Flex","RaLabel","Box"],"mappings":";;;;;;;;;;AASA,MAAM,EAAE,cAAAA,GAAc,aAAAC,EAAA,IAAgB,gBAAAC,EAAwB;AAAA,EAC5D,KAAK;AACP,CAAC,GAGYC,IAAsB,gBAAAH,EAGjC,OAAO,MAAM,GAGFI,IAAuB,gBAAAH,EAGlC,OAAO,OAAO,GAGHI,IAAsB,gBAAAJ,EAGjC,OAAO,MAAM,GAGFK,IAAuB,gBAAAL,EAGlC,QAAQ,OAAO,GAGJM,IAAuB,gBAAAN,EAGlC,QAAQ,OAAO,GCLJO,IAAc,CAACC,MAA4B;AACtD,QAAM;AAAA,IACJ,KAAKC;AAAA,IACL,OAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,iBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,eAAAC,IAAgB,EAAE,OAAO,UAAA;AAAA,IACzB,SAAAC,IAAU;AAAA,IACV,QAAAC,IAAS;AAAA,IACT,cAAAC,IAAe;AAAA,IACf,GAAGC;AAAA,EAAA,IACDZ,GAEEa,IAASC,EAAc,EAAE,KAAK,eAAe,GAC7C,CAACC,GAAaC,CAAc,IAAIH,EAAO,kBAAkB;AAAA,IAC7D,SAAAJ;AAAA,IACA,cAAAE;AAAA,IACA,GAAGX;AAAA,EAAA,CACJ,GACK,CAACiB,CAAU,IAAIC,EAAkBF,CAAc,GAE/CG,IAAWC,EAAuB,IAAI,GACtCC,IAAMC,EAAaC,EAAUJ,GAAUlB,CAAY,CAAC;AAE1D,SACE,gBAAAuB;AAAA,IAAC9B;AAAA,IAAA;AAAA,MACE,GAAGqB;AAAA,MACH,GAAGE;AAAA,MACH,GAAGF;AAAA,MACJ,WAAAV;AAAA,MACA,iBAAAC;AAAA,MACA,SAAO;AAAA,MAEP,UAAA,gBAAAkB;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,KAAAJ;AAAA,UACA,OAAAnB;AAAA,UACA,UAAAC;AAAA,UACA,UAAAC;AAAA,UACA,iBAAAE;AAAA,UACA,eAAAE;AAAA,UACC,GAAGI;AAAA,UAEH,UAAA,CAAC,EAAE,YAAAc,GAAY,WAAAC,EAAA,MACd,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,YAAAnB,MAAW,+BACToB,GAAA,EACE,UAAA;AAAA,cAAAvB,uBACEV,GAAA,EAAqB,SAAO,IAC3B,UAAA,gBAAA2B,EAACO,GAAA,EAAS,aAAM,EAAA,CAClB;AAAA,cAEF,gBAAAP,EAACQ,GAAA,EAAI,UAAS,IAAA,CAAI;AAAA,cACjBzB,KAASL,KACR,gBAAAsB,EAAC1B,GAAA,EAAsB,UAAA6B,EAAA,CAAU;AAAA,YAAA,GAErC;AAAA,YAGDjB,MAAW,YAAYH,KACtB,gBAAAiB,EAAC3B,GAAA,EAAqB,YAAW,KAAI,SAAO,IAC1C,UAAA,gBAAA2B,EAACO,GAAA,EAAS,UAAAxB,EAAA,CAAM,GAClB;AAAA,8BAGDZ,GAAA,EACC,UAAA,gBAAA6B;AAAA,cAAC5B;AAAA,cAAA;AAAA,gBACC,OAAO,EAAE,OAAOU,IAAkB,QAAQ,GAAGoB,CAAU,IAAA;AAAA,gBACvD,sBAAoBpB;AAAA,gBACpB,iBACE,CAACA,KACDoB,MAAe,UACfA,KAAc;AAAA,cAAA;AAAA,YAAA,GAGpB;AAAA,YAEChB,MAAW,YAAYR,uBACrBJ,GAAA,EAAqB,YAAW,KAC9B,UAAA6B,EAAA,CACH;AAAA,UAAA,EAAA,CAEJ;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ;AAAA,EAAA;AAGN;AAEA5B,EAAY,cAAc;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const e=require("react/jsx-runtime"),k=require("react"),d=require("./Label-szabofdc.cjs.js"),w=require("./ProgressBar-BnIWveAr.cjs.js"),u=require("@chakra-ui/react"),C=require("@chakra-ui/react/styled-system"),V=require("./extract-style-props-
|
|
2
|
-
//# sourceMappingURL=progress-bar-
|
|
1
|
+
"use strict";const e=require("react/jsx-runtime"),k=require("react"),d=require("./Label-szabofdc.cjs.js"),w=require("./ProgressBar-BnIWveAr.cjs.js"),u=require("@chakra-ui/react"),C=require("@chakra-ui/react/styled-system"),V=require("./extract-style-props-B6-o20G1.cjs.js"),F=require("./useObjectRef-4v2MxSjQ.cjs.js"),H=require("@chakra-ui/react/flex"),L=require("./box-CWni3A32.cjs.js"),{withProvider:O,withContext:t}=u.createSlotRecipeContext({key:"progressBar"}),D=O("div","root"),G=t("div","track"),I=t("div","fill"),x=t("span","label"),f=t("span","value"),p=l=>{const{ref:h,value:o,minValue:b=0,maxValue:P=100,isDynamic:$=!0,isIndeterminate:r,label:s,formatOptions:j={style:"percent"},variant:g="solid",layout:i="stacked",colorPalette:m="primary",...y}=l,B=C.useSlotRecipe({key:"progressBar"}),[n,S]=B.splitVariantProps({variant:g,colorPalette:m,...l}),[q]=V.extractStyleProps(S),R=k.useRef(null),v=F.$df56164dff5785e2$export$4338b53315abf666(u.mergeRefs(R,h));return e.jsx(D,{...n,...q,...n,isDynamic:$,isIndeterminate:r,asChild:!0,children:e.jsx(w.$0393f8ab869a0f1a$export$c17561cb55d4db30,{ref:v,value:o,minValue:b,maxValue:P,isIndeterminate:r,formatOptions:j,...y,children:({percentage:a,valueText:c})=>e.jsxs(e.Fragment,{children:[i==="stacked"&&e.jsxs(H.Flex,{children:[s&&e.jsx(x,{asChild:!0,children:e.jsx(d.$01b77f81d0f07f68$export$b04be29aa201d4f5,{children:s})}),e.jsx(L.Box,{flexGrow:"1"}),s&&o&&e.jsx(f,{children:c})]}),i==="inline"&&s&&e.jsx(x,{lineHeight:"1",asChild:!0,children:e.jsx(d.$01b77f81d0f07f68$export$b04be29aa201d4f5,{children:s})}),e.jsx(G,{children:e.jsx(I,{style:{width:r?"40%":`${a}%`},"data-indeterminate":r,"data-complete":!r&&a!==void 0&&a>=100})}),i==="inline"&&o&&e.jsx(f,{lineHeight:"1",children:c})]})})})};p.displayName="ProgressBar";exports.ProgressBar=p;
|
|
2
|
+
//# sourceMappingURL=progress-bar-Dx9Zr5Yh.cjs.js.map
|