@purpur/library 9.0.6 → 9.0.7
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/CHANGELOG.json +33 -0
- package/CHANGELOG.md +15 -1
- package/dist/{RichText-DRacgpis.mjs → RichText-Bi51HE6X.mjs} +3 -3
- package/dist/{RichText-DRacgpis.mjs.map → RichText-Bi51HE6X.mjs.map} +1 -1
- package/dist/{RichText-DMyGiMN0.js → RichText-DNroJJXv.js} +2 -2
- package/dist/{RichText-DMyGiMN0.js.map → RichText-DNroJJXv.js.map} +1 -1
- package/dist/{ThemeProvider-CrjMv3M8.mjs → ThemeProvider-BR1hJQOD.mjs} +85 -85
- package/dist/{ThemeProvider-CrjMv3M8.mjs.map → ThemeProvider-BR1hJQOD.mjs.map} +1 -1
- package/dist/{accordion-DWflnyWa.mjs → accordion-BKTz9DM6.mjs} +18 -18
- package/dist/{accordion-DWflnyWa.mjs.map → accordion-BKTz9DM6.mjs.map} +1 -1
- package/dist/{accordion-CF2fj2uq.js → accordion-DX8efWOt.js} +2 -2
- package/dist/{accordion-CF2fj2uq.js.map → accordion-DX8efWOt.js.map} +1 -1
- package/dist/accordion.cjs.js +1 -1
- package/dist/accordion.es.js +1 -1
- package/dist/{alert-badge-u7qAhYbR.mjs → alert-badge-DR8cigWu.mjs} +3 -3
- package/dist/{alert-badge-u7qAhYbR.mjs.map → alert-badge-DR8cigWu.mjs.map} +1 -1
- package/dist/alert-badge.es.js +1 -1
- package/dist/{autocomplete-yD0-1vlF.js → autocomplete-6qSqK3SI.js} +2 -2
- package/dist/{autocomplete-yD0-1vlF.js.map → autocomplete-6qSqK3SI.js.map} +1 -1
- package/dist/{autocomplete-0kGG_STe.mjs → autocomplete-B4dZx9zF.mjs} +3 -3
- package/dist/{autocomplete-0kGG_STe.mjs.map → autocomplete-B4dZx9zF.mjs.map} +1 -1
- package/dist/autocomplete.cjs.js +1 -1
- package/dist/autocomplete.es.js +1 -1
- package/dist/button-BfYKNBmC.mjs +102 -0
- package/dist/button-BfYKNBmC.mjs.map +1 -0
- package/dist/button-DDYGuqZ0.js +2 -0
- package/dist/button-DDYGuqZ0.js.map +1 -0
- package/dist/button.cjs.js +1 -1
- package/dist/button.es.js +1 -1
- package/dist/{calendar-pMM0fKEu.js → calendar-CxkJMONO.js} +2 -2
- package/dist/{calendar-pMM0fKEu.js.map → calendar-CxkJMONO.js.map} +1 -1
- package/dist/{calendar-DDie8jSH.mjs → calendar-vALLklKV.mjs} +2 -2
- package/dist/{calendar-DDie8jSH.mjs.map → calendar-vALLklKV.mjs.map} +1 -1
- package/dist/calendar.cjs.js +1 -1
- package/dist/calendar.es.js +1 -1
- package/dist/{card-DiMVw06l.mjs → card-CkZQZOz1.mjs} +9 -9
- package/dist/{card-DiMVw06l.mjs.map → card-CkZQZOz1.mjs.map} +1 -1
- package/dist/{card-B512KHpr.js → card-VMa3cGCP.js} +2 -2
- package/dist/{card-B512KHpr.js.map → card-VMa3cGCP.js.map} +1 -1
- package/dist/card.cjs.js +1 -1
- package/dist/card.es.js +1 -1
- package/dist/{checkbox-LYzMiXu7.mjs → checkbox-D6qWgpWR.mjs} +8 -8
- package/dist/{checkbox-LYzMiXu7.mjs.map → checkbox-D6qWgpWR.mjs.map} +1 -1
- package/dist/checkbox.es.js +1 -1
- package/dist/{chip-group-aj1fdnjC.js → chip-group-B775zvKD.js} +2 -2
- package/dist/{chip-group-aj1fdnjC.js.map → chip-group-B775zvKD.js.map} +1 -1
- package/dist/{chip-group-CJVvfl_J.mjs → chip-group-xuOe7nL3.mjs} +3 -3
- package/dist/{chip-group-CJVvfl_J.mjs.map → chip-group-xuOe7nL3.mjs.map} +1 -1
- package/dist/chip-group.cjs.js +1 -1
- package/dist/chip-group.es.js +1 -1
- package/dist/components/button/src/button.d.ts +1 -2
- package/dist/components/button/src/button.d.ts.map +1 -1
- package/dist/components/date-field/src/date-field.d.ts.map +1 -1
- package/dist/components/stepper/src/stepper-button.d.ts.map +1 -1
- package/dist/components/table/src/table-toolbar.d.ts.map +1 -1
- package/dist/components/tabs/src/tab-content.d.ts.map +1 -1
- package/dist/components/tabs/src/tabs.d.ts.map +1 -1
- package/dist/{container-Bw12NgHN.mjs → container-DLjBTB_w.mjs} +3 -3
- package/dist/{container-Bw12NgHN.mjs.map → container-DLjBTB_w.mjs.map} +1 -1
- package/dist/container.es.js +1 -1
- package/dist/{content-block-DUcjAZgG.mjs → content-block-BMOvlH7a.mjs} +6 -6
- package/dist/{content-block-DUcjAZgG.mjs.map → content-block-BMOvlH7a.mjs.map} +1 -1
- package/dist/{content-block-kzdUWgvH.js → content-block-Cd7xSE8t.js} +2 -2
- package/dist/{content-block-kzdUWgvH.js.map → content-block-Cd7xSE8t.js.map} +1 -1
- package/dist/content-block.cjs.js +1 -1
- package/dist/content-block.es.js +1 -1
- package/dist/{countdown-DxAGVUFI.mjs → countdown-DZ4IwkNy.mjs} +12 -12
- package/dist/{countdown-DxAGVUFI.mjs.map → countdown-DZ4IwkNy.mjs.map} +1 -1
- package/dist/countdown.es.js +1 -1
- package/dist/date-field-CORqon6B.js +2 -0
- package/dist/{date-field-CPiTZqa0.js.map → date-field-CORqon6B.js.map} +1 -1
- package/dist/{date-field-D_6iP2fC.mjs → date-field-CTJB8O0e.mjs} +325 -310
- package/dist/{date-field-D_6iP2fC.mjs.map → date-field-CTJB8O0e.mjs.map} +1 -1
- package/dist/date-field.cjs.js +1 -1
- package/dist/date-field.es.js +1 -1
- package/dist/{date-picker-BRnwwZv1.mjs → date-picker-CJcIJ5VL.mjs} +5 -5
- package/dist/{date-picker-BRnwwZv1.mjs.map → date-picker-CJcIJ5VL.mjs.map} +1 -1
- package/dist/{date-picker-DlJGggam.js → date-picker-Dv3W05Hf.js} +2 -2
- package/dist/{date-picker-DlJGggam.js.map → date-picker-Dv3W05Hf.js.map} +1 -1
- package/dist/date-picker.cjs.js +1 -1
- package/dist/date-picker.es.js +1 -1
- package/dist/{dismissable-chip-group-DsO2cZaF.js → dismissable-chip-group-CnziecOt.js} +2 -2
- package/dist/{dismissable-chip-group-DsO2cZaF.js.map → dismissable-chip-group-CnziecOt.js.map} +1 -1
- package/dist/{dismissable-chip-group-Bl0D18qM.mjs → dismissable-chip-group-ZCYOt1sB.mjs} +2 -2
- package/dist/{dismissable-chip-group-Bl0D18qM.mjs.map → dismissable-chip-group-ZCYOt1sB.mjs.map} +1 -1
- package/dist/dismissable-chip-group.cjs.js +1 -1
- package/dist/dismissable-chip-group.es.js +1 -1
- package/dist/{drawer-nBpCtIdI.js → drawer-Ce5LNpU2.js} +2 -2
- package/dist/{drawer-nBpCtIdI.js.map → drawer-Ce5LNpU2.js.map} +1 -1
- package/dist/{drawer-Boqmgh-i.mjs → drawer-DSFZ61OH.mjs} +14 -14
- package/dist/{drawer-Boqmgh-i.mjs.map → drawer-DSFZ61OH.mjs.map} +1 -1
- package/dist/drawer.cjs.js +1 -1
- package/dist/drawer.es.js +1 -1
- package/dist/{floating-ui.react-dom-0ol4sFzt.mjs → floating-ui.react-dom-gsHLgcoR.mjs} +5 -5
- package/dist/{floating-ui.react-dom-0ol4sFzt.mjs.map → floating-ui.react-dom-gsHLgcoR.mjs.map} +1 -1
- package/dist/{footer-DrjAwjuL.js → footer-BL0ewBZT.js} +2 -2
- package/dist/{footer-DrjAwjuL.js.map → footer-BL0ewBZT.js.map} +1 -1
- package/dist/{footer-DcWsihxS.mjs → footer-cH07Xqil.mjs} +5 -5
- package/dist/{footer-DcWsihxS.mjs.map → footer-cH07Xqil.mjs.map} +1 -1
- package/dist/footer.cjs.js +1 -1
- package/dist/footer.es.js +1 -1
- package/dist/heading-drD5ugCC.js +2 -0
- package/dist/{heading-DLCdW6gx.js.map → heading-drD5ugCC.js.map} +1 -1
- package/dist/heading-xwBuT_-9.mjs +75 -0
- package/dist/{heading-gqtQNo5n.mjs.map → heading-xwBuT_-9.mjs.map} +1 -1
- package/dist/heading.cjs.js +1 -1
- package/dist/heading.es.js +1 -1
- package/dist/{hero-banner-B8fRHxXc.mjs → hero-banner-CkSSlxTW.mjs} +5 -5
- package/dist/{hero-banner-B8fRHxXc.mjs.map → hero-banner-CkSSlxTW.mjs.map} +1 -1
- package/dist/{hero-banner-D3peC1NR.js → hero-banner-JFaqW20R.js} +2 -2
- package/dist/{hero-banner-D3peC1NR.js.map → hero-banner-JFaqW20R.js.map} +1 -1
- package/dist/hero-banner.cjs.js +1 -1
- package/dist/hero-banner.es.js +1 -1
- package/dist/library.cjs.js +1 -1
- package/dist/library.es.js +44 -44
- package/dist/{listbox-u6__DsLw.mjs → listbox-oDeP8FvH.mjs} +2 -2
- package/dist/{listbox-u6__DsLw.mjs.map → listbox-oDeP8FvH.mjs.map} +1 -1
- package/dist/listbox.es.js +1 -1
- package/dist/{modal-C2UQsW-g.mjs → modal-2ymCXTup.mjs} +19 -19
- package/dist/{modal-C2UQsW-g.mjs.map → modal-2ymCXTup.mjs.map} +1 -1
- package/dist/{modal-nyhf5zxG.js → modal-CXi2xez5.js} +2 -2
- package/dist/{modal-nyhf5zxG.js.map → modal-CXi2xez5.js.map} +1 -1
- package/dist/modal.cjs.js +1 -1
- package/dist/modal.es.js +1 -1
- package/dist/{notification-C32wHljA.mjs → notification-BFSOuDp8.mjs} +22 -22
- package/dist/{notification-C32wHljA.mjs.map → notification-BFSOuDp8.mjs.map} +1 -1
- package/dist/{notification-Bg1vQkQ3.js → notification-DdnI2rOh.js} +2 -2
- package/dist/{notification-Bg1vQkQ3.js.map → notification-DdnI2rOh.js.map} +1 -1
- package/dist/{notification-banner-BY2iZOIa.mjs → notification-banner-CQvBezAL.mjs} +3 -3
- package/dist/{notification-banner-BY2iZOIa.mjs.map → notification-banner-CQvBezAL.mjs.map} +1 -1
- package/dist/{notification-banner-C8XsBDTq.js → notification-banner-CT4ew8IQ.js} +2 -2
- package/dist/{notification-banner-C8XsBDTq.js.map → notification-banner-CT4ew8IQ.js.map} +1 -1
- package/dist/notification-banner.cjs.js +1 -1
- package/dist/notification-banner.es.js +1 -1
- package/dist/notification.cjs.js +1 -1
- package/dist/notification.es.js +1 -1
- package/dist/{pagination-CVVCAQ65.mjs → pagination-BdCjh1Pi.mjs} +2 -2
- package/dist/{pagination-CVVCAQ65.mjs.map → pagination-BdCjh1Pi.mjs.map} +1 -1
- package/dist/pagination.es.js +1 -1
- package/dist/{paragraph-DNtj7OLr.mjs → paragraph-Ci50OF1u.mjs} +3 -3
- package/dist/{paragraph-DNtj7OLr.mjs.map → paragraph-Ci50OF1u.mjs.map} +1 -1
- package/dist/paragraph.es.js +1 -1
- package/dist/{popover-B1BgSoQx.js → popover-D3qWbbU4.js} +2 -2
- package/dist/{popover-B1BgSoQx.js.map → popover-D3qWbbU4.js.map} +1 -1
- package/dist/{popover-DBMI9Jy1.mjs → popover-ZeQKmyEb.mjs} +25 -25
- package/dist/{popover-DBMI9Jy1.mjs.map → popover-ZeQKmyEb.mjs.map} +1 -1
- package/dist/popover.cjs.js +1 -1
- package/dist/popover.es.js +1 -1
- package/dist/{product-card-rfpJbzzV.mjs → product-card-BU1ThhCx.mjs} +12 -12
- package/dist/{product-card-rfpJbzzV.mjs.map → product-card-BU1ThhCx.mjs.map} +1 -1
- package/dist/{product-card-DOBHGAa2.js → product-card-CNBegEBW.js} +2 -2
- package/dist/{product-card-DOBHGAa2.js.map → product-card-CNBegEBW.js.map} +1 -1
- package/dist/product-card.cjs.js +1 -1
- package/dist/product-card.es.js +1 -1
- package/dist/{promotion-card-BIFOwMrw.js → promotion-card-CXNhskRl.js} +2 -2
- package/dist/{promotion-card-BIFOwMrw.js.map → promotion-card-CXNhskRl.js.map} +1 -1
- package/dist/{promotion-card-DeyqFnyP.mjs → promotion-card-_bPyVr9t.mjs} +9 -9
- package/dist/{promotion-card-DeyqFnyP.mjs.map → promotion-card-_bPyVr9t.mjs.map} +1 -1
- package/dist/promotion-card.cjs.js +1 -1
- package/dist/promotion-card.es.js +1 -1
- package/dist/purpur.css +1 -1
- package/dist/{quantity-selector-DPOTlMSq.js → quantity-selector-CjSAaj7d.js} +2 -2
- package/dist/{quantity-selector-DPOTlMSq.js.map → quantity-selector-CjSAaj7d.js.map} +1 -1
- package/dist/{quantity-selector-_VcZYLjR.mjs → quantity-selector-HvyYSKah.mjs} +5 -5
- package/dist/{quantity-selector-_VcZYLjR.mjs.map → quantity-selector-HvyYSKah.mjs.map} +1 -1
- package/dist/quantity-selector.cjs.js +1 -1
- package/dist/quantity-selector.es.js +1 -1
- package/dist/{radio-button-group-CZ_FnVAi.js → radio-button-group-BaFpGAcD.js} +2 -2
- package/dist/{radio-button-group-CZ_FnVAi.js.map → radio-button-group-BaFpGAcD.js.map} +1 -1
- package/dist/{radio-button-group-BnCPcmSN.mjs → radio-button-group-CFqPsu5A.mjs} +5 -5
- package/dist/{radio-button-group-BnCPcmSN.mjs.map → radio-button-group-CFqPsu5A.mjs.map} +1 -1
- package/dist/radio-button-group.cjs.js +1 -1
- package/dist/radio-button-group.es.js +1 -1
- package/dist/{radio-card-group-DkaMcmen.mjs → radio-card-group-BlRZBa-9.mjs} +16 -16
- package/dist/{radio-card-group-DkaMcmen.mjs.map → radio-card-group-BlRZBa-9.mjs.map} +1 -1
- package/dist/{radio-card-group-BT5pV3tA.js → radio-card-group-sYcfDPJq.js} +2 -2
- package/dist/{radio-card-group-BT5pV3tA.js.map → radio-card-group-sYcfDPJq.js.map} +1 -1
- package/dist/radio-card-group.cjs.js +1 -1
- package/dist/radio-card-group.es.js +1 -1
- package/dist/rich-text.cjs.js +1 -1
- package/dist/rich-text.es.js +1 -1
- package/dist/scss/heading.mixins.scss +1 -1
- package/dist/{search-field-DH0xeW_J.mjs → search-field-BOmCVr5b.mjs} +11 -11
- package/dist/{search-field-DH0xeW_J.mjs.map → search-field-BOmCVr5b.mjs.map} +1 -1
- package/dist/{search-field-CxX4BBcg.js → search-field-CanOlkIY.js} +2 -2
- package/dist/{search-field-CxX4BBcg.js.map → search-field-CanOlkIY.js.map} +1 -1
- package/dist/search-field.cjs.js +1 -1
- package/dist/search-field.es.js +1 -1
- package/dist/{stepper-BfIbJwZn.mjs → stepper-D7T0wed7.mjs} +68 -71
- package/dist/stepper-D7T0wed7.mjs.map +1 -0
- package/dist/stepper-DYjJgEHL.js +2 -0
- package/dist/stepper-DYjJgEHL.js.map +1 -0
- package/dist/stepper.cjs.js +1 -1
- package/dist/stepper.es.js +1 -1
- package/dist/{table-DvcpczWf.mjs → table-B4pts_r4.mjs} +181 -179
- package/dist/{table-DvcpczWf.mjs.map → table-B4pts_r4.mjs.map} +1 -1
- package/dist/{table-BNeo_B1h.js → table-Bv_BISXV.js} +4 -4
- package/dist/{table-BNeo_B1h.js.map → table-Bv_BISXV.js.map} +1 -1
- package/dist/table.cjs.js +1 -1
- package/dist/table.es.js +1 -1
- package/dist/tabs-Bye5lgZ1.mjs +424 -0
- package/dist/tabs-Bye5lgZ1.mjs.map +1 -0
- package/dist/tabs-D-nfZHIA.js +2 -0
- package/dist/tabs-D-nfZHIA.js.map +1 -0
- package/dist/tabs.cjs.js +1 -1
- package/dist/tabs.es.js +1 -1
- package/dist/{text-area-Cb9Hm2Z9.mjs → text-area-CpYWt99s.mjs} +3 -3
- package/dist/{text-area-Cb9Hm2Z9.mjs.map → text-area-CpYWt99s.mjs.map} +1 -1
- package/dist/text-area.es.js +1 -1
- package/dist/{text-field-PKAaXO1N.mjs → text-field-5rIuW8gc.mjs} +2 -2
- package/dist/{text-field-PKAaXO1N.mjs.map → text-field-5rIuW8gc.mjs.map} +1 -1
- package/dist/{text-field-B8a-NKm4.js → text-field-Xt6T3zjO.js} +2 -2
- package/dist/{text-field-B8a-NKm4.js.map → text-field-Xt6T3zjO.js.map} +1 -1
- package/dist/text-field.cjs.js +1 -1
- package/dist/text-field.es.js +1 -1
- package/dist/theme.es.js +2 -2
- package/dist/{toggle-Cezg5MUc.mjs → toggle-D23x1wWk.mjs} +9 -9
- package/dist/{toggle-Cezg5MUc.mjs.map → toggle-D23x1wWk.mjs.map} +1 -1
- package/dist/toggle.es.js +1 -1
- package/dist/tokens.es.js +3 -3
- package/dist/{tooltip-DXi7ikUT.mjs → tooltip-DkwyNxrQ.mjs} +12 -12
- package/dist/{tooltip-DXi7ikUT.mjs.map → tooltip-DkwyNxrQ.mjs.map} +1 -1
- package/dist/{tooltip-CLQLxoaf.js → tooltip-svlZkXBs.js} +2 -2
- package/dist/{tooltip-CLQLxoaf.js.map → tooltip-svlZkXBs.js.map} +1 -1
- package/dist/tooltip.cjs.js +1 -1
- package/dist/tooltip.es.js +1 -1
- package/dist/{useColorScheme-DRQcbSog.mjs → useColorScheme-9rgSgG0N.mjs} +2 -2
- package/dist/{useColorScheme-DRQcbSog.mjs.map → useColorScheme-9rgSgG0N.mjs.map} +1 -1
- package/dist/{variables-91UvS2rU.mjs → variables-BVgnpUH9.mjs} +253 -253
- package/dist/{variables-91UvS2rU.mjs.map → variables-BVgnpUH9.mjs.map} +1 -1
- package/dist/{variables-BSsIx39i.mjs → variables-DkCN2x27.mjs} +7 -7
- package/dist/{variables-BSsIx39i.mjs.map → variables-DkCN2x27.mjs.map} +1 -1
- package/dist/{variables-BUfnQw6H.mjs → variables-Dr3Hsdn-.mjs} +9 -9
- package/dist/{variables-BUfnQw6H.mjs.map → variables-Dr3Hsdn-.mjs.map} +1 -1
- package/package.json +18 -18
- package/scripts/generate.mts +4 -1
- package/vite-plugin-generate-components-metadata.js +4 -1
- package/dist/button-ChYUPi2k.js +0 -2
- package/dist/button-ChYUPi2k.js.map +0 -1
- package/dist/button-DBX_tvfJ.mjs +0 -105
- package/dist/button-DBX_tvfJ.mjs.map +0 -1
- package/dist/date-field-CPiTZqa0.js +0 -2
- package/dist/heading-DLCdW6gx.js +0 -2
- package/dist/heading-gqtQNo5n.mjs +0 -75
- package/dist/stepper-B248FwO-.js +0 -2
- package/dist/stepper-B248FwO-.js.map +0 -1
- package/dist/stepper-BfIbJwZn.mjs.map +0 -1
- package/dist/tabs-CfHd4UQ2.js +0 -2
- package/dist/tabs-CfHd4UQ2.js.map +0 -1
- package/dist/tabs-CoXMAwMx.mjs +0 -396
- package/dist/tabs-CoXMAwMx.mjs.map +0 -1
|
@@ -1,21 +1,20 @@
|
|
|
1
|
-
import { jsx as r, jsxs as
|
|
2
|
-
import { forwardRef as z, isValidElement as x, useRef as S, useEffect as
|
|
3
|
-
import {
|
|
1
|
+
import { jsx as r, jsxs as N, Fragment as Z } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as z, isValidElement as x, useRef as S, useEffect as F, useState as O, Children as j } from "react";
|
|
3
|
+
import { b as B, a as V } from "./button-BfYKNBmC.mjs";
|
|
4
4
|
import { l as rr } from "./chevron-left.es-UFhf3v35.mjs";
|
|
5
5
|
import { n as tr } from "./chevron-right.es-D7aVK4ER.mjs";
|
|
6
|
-
import { I as er, R as
|
|
6
|
+
import { I as er, R as H } from "./index-IpWiejWQ.mjs";
|
|
7
7
|
import { R as sr, V as pr, S as nr, T as or } from "./index-B8Mazo6u.mjs";
|
|
8
8
|
import { c as L } from "./bind-CU-R61T-.mjs";
|
|
9
|
-
import { b as ir } from "./tooltip-
|
|
9
|
+
import { b as ir } from "./tooltip-DkwyNxrQ.mjs";
|
|
10
10
|
import { a as lr } from "./checkmark.es-DdgIZN2R.mjs";
|
|
11
|
-
|
|
12
|
-
const ar = {
|
|
11
|
+
const ur = {
|
|
13
12
|
PRIMARY: "primary"
|
|
14
13
|
}, I = {
|
|
15
14
|
SMALL_SCREEN: "small-screen",
|
|
16
15
|
LARGE_SCREEN: "large-screen",
|
|
17
16
|
ALWAYS: "always"
|
|
18
|
-
},
|
|
17
|
+
}, ar = {
|
|
19
18
|
"purpur-stepper__nav-container": "_purpur-stepper__nav-container_1rouo_1",
|
|
20
19
|
"purpur-stepper__nav": "_purpur-stepper__nav_1rouo_1",
|
|
21
20
|
"purpur-stepper": "_purpur-stepper_1rouo_1",
|
|
@@ -24,12 +23,12 @@ const ar = {
|
|
|
24
23
|
"purpur-stepper__scroll-button--right": "_purpur-stepper__scroll-button--right_1rouo_21",
|
|
25
24
|
"purpur-stepper__scroll-button-icon": "_purpur-stepper__scroll-button-icon_1rouo_24",
|
|
26
25
|
"purpur-stepper__hidden": "_purpur-stepper__hidden_1rouo_27"
|
|
27
|
-
},
|
|
26
|
+
}, _r = {
|
|
28
27
|
"purpur-stepper-container": "_purpur-stepper-container_162zw_1",
|
|
29
28
|
"purpur-stepper-container__inner--align-with-grid": "_purpur-stepper-container__inner--align-with-grid_162zw_5",
|
|
30
29
|
"purpur-stepper-container--primary": "_purpur-stepper-container--primary_162zw_18",
|
|
31
30
|
"purpur-stepper-container--secondary": "_purpur-stepper-container--secondary_162zw_21"
|
|
32
|
-
}, Y = L.bind(
|
|
31
|
+
}, Y = L.bind(_r), R = "purpur-stepper-container", cr = ({
|
|
33
32
|
["data-testid"]: t = "purpur-stepper-container",
|
|
34
33
|
children: e,
|
|
35
34
|
className: s,
|
|
@@ -37,25 +36,25 @@ const ar = {
|
|
|
37
36
|
variant: i,
|
|
38
37
|
...n
|
|
39
38
|
}) => {
|
|
40
|
-
const b = Y(s,
|
|
41
|
-
[`${
|
|
42
|
-
[`${
|
|
39
|
+
const b = Y(s, R, {
|
|
40
|
+
[`${R}--${i}`]: i,
|
|
41
|
+
[`${R}--align-with-grid`]: p
|
|
43
42
|
});
|
|
44
43
|
return /* @__PURE__ */ r("div", { className: b, "data-testid": t, ...n, children: /* @__PURE__ */ r(
|
|
45
44
|
"div",
|
|
46
45
|
{
|
|
47
|
-
className: Y(`${
|
|
48
|
-
[`${
|
|
46
|
+
className: Y(`${R}__inner`, {
|
|
47
|
+
[`${R}__inner--align-with-grid`]: p
|
|
49
48
|
}),
|
|
50
49
|
children: e
|
|
51
50
|
}
|
|
52
51
|
) });
|
|
53
|
-
},
|
|
52
|
+
}, dr = z(
|
|
54
53
|
({ children: t, ...e }, s) => {
|
|
55
54
|
const { finished: p, ...i } = e;
|
|
56
55
|
return /* @__PURE__ */ r("div", { ...i, ref: s, children: t });
|
|
57
56
|
}
|
|
58
|
-
),
|
|
57
|
+
), br = (t) => !!t && x(t) && !!t.props.label, mr = {
|
|
59
58
|
"purpur-stepper-button": "_purpur-stepper-button_wjiph_1",
|
|
60
59
|
"purpur-stepper-button__trigger-outline": "_purpur-stepper-button__trigger-outline_wjiph_21",
|
|
61
60
|
"purpur-stepper-button--first": "_purpur-stepper-button--first_wjiph_33",
|
|
@@ -75,7 +74,7 @@ const ar = {
|
|
|
75
74
|
"purpur-stepper-button--secondary": "_purpur-stepper-button--secondary_wjiph_142",
|
|
76
75
|
"arrow-tail": "_arrow-tail_wjiph_152",
|
|
77
76
|
"sr-only--lg-down": "_sr-only--lg-down_wjiph_171"
|
|
78
|
-
},
|
|
77
|
+
}, y = L.bind(mr), c = "purpur-stepper-button", hr = ({
|
|
79
78
|
["data-testid"]: t,
|
|
80
79
|
current: e,
|
|
81
80
|
disabled: s,
|
|
@@ -84,7 +83,7 @@ const ar = {
|
|
|
84
83
|
"div",
|
|
85
84
|
{
|
|
86
85
|
"data-testid": t,
|
|
87
|
-
className:
|
|
86
|
+
className: y([
|
|
88
87
|
`${c}__step-number`,
|
|
89
88
|
{
|
|
90
89
|
[`${c}__step-number--current`]: e
|
|
@@ -110,78 +109,76 @@ const ar = {
|
|
|
110
109
|
completedStepLabel: o,
|
|
111
110
|
...u
|
|
112
111
|
}, d) => {
|
|
113
|
-
const
|
|
112
|
+
const $ = n === 0 ? "first" : n === i ? "last" : "middle", f = n === b;
|
|
114
113
|
return /* @__PURE__ */ r(er, { asChild: !0, children: /* @__PURE__ */ r(
|
|
115
114
|
B,
|
|
116
115
|
{
|
|
117
116
|
...u,
|
|
118
117
|
ref: d,
|
|
119
|
-
className:
|
|
118
|
+
className: y(
|
|
120
119
|
t,
|
|
121
120
|
c,
|
|
122
|
-
`${c}--${
|
|
121
|
+
`${c}--${$}`,
|
|
123
122
|
`${c}--${s}`,
|
|
124
123
|
`${c}--visibility-${m}`,
|
|
125
124
|
{
|
|
126
|
-
[`${c}--current`]:
|
|
125
|
+
[`${c}--current`]: f
|
|
127
126
|
},
|
|
128
127
|
{
|
|
129
128
|
[`${c}--disabled`]: p.disabled
|
|
130
129
|
},
|
|
131
130
|
{
|
|
132
|
-
"arrow-tail":
|
|
131
|
+
"arrow-tail": $ !== "first"
|
|
133
132
|
},
|
|
134
133
|
{
|
|
135
|
-
"arrow-forward":
|
|
134
|
+
"arrow-forward": $ !== "last"
|
|
136
135
|
}
|
|
137
136
|
),
|
|
138
137
|
id: `stepper-trigger-button-${n}`,
|
|
139
138
|
variant: V.TERTIARY_PURPLE,
|
|
140
139
|
"data-testid": `${e}-step-trigger-item-${n}`,
|
|
141
140
|
disabled: p.disabled,
|
|
142
|
-
"aria-current":
|
|
141
|
+
"aria-current": f && "step",
|
|
142
|
+
"aria-label": p.finished && !f ? [p.label, o].filter(Boolean).join(", ") : void 0,
|
|
143
143
|
onClick: (T) => l(T, n),
|
|
144
144
|
onFocus: a,
|
|
145
|
-
children: /* @__PURE__ */
|
|
146
|
-
p.finished &&
|
|
145
|
+
children: /* @__PURE__ */ N("span", { className: y(`${c}__trigger-outline`), children: [
|
|
146
|
+
p.finished && !f ? /* @__PURE__ */ r(
|
|
147
147
|
lr,
|
|
148
148
|
{
|
|
149
|
-
className:
|
|
149
|
+
className: y(`${c}__icon`),
|
|
150
150
|
"data-testid": `${e}-step-finished-icon`,
|
|
151
151
|
size: "sm"
|
|
152
152
|
}
|
|
153
153
|
) : /* @__PURE__ */ r(
|
|
154
|
-
|
|
154
|
+
hr,
|
|
155
155
|
{
|
|
156
156
|
"data-testid": `${e}-step-number`,
|
|
157
|
-
current:
|
|
157
|
+
current: f,
|
|
158
158
|
disabled: p.disabled,
|
|
159
159
|
stepNumber: n + 1
|
|
160
160
|
}
|
|
161
161
|
),
|
|
162
|
-
/* @__PURE__ */
|
|
162
|
+
/* @__PURE__ */ r(
|
|
163
163
|
"span",
|
|
164
164
|
{
|
|
165
|
-
className:
|
|
166
|
-
"sr-only--lg-down":
|
|
165
|
+
className: y(`${c}__step-label`, {
|
|
166
|
+
"sr-only--lg-down": !f
|
|
167
167
|
}),
|
|
168
|
-
children:
|
|
169
|
-
p.finished && /* @__PURE__ */ r(ur, { children: `${n + 1} ${o}` }),
|
|
170
|
-
p.label
|
|
171
|
-
]
|
|
168
|
+
children: p.label
|
|
172
169
|
}
|
|
173
170
|
)
|
|
174
171
|
] })
|
|
175
172
|
}
|
|
176
173
|
) });
|
|
177
174
|
}
|
|
178
|
-
),
|
|
175
|
+
), fr = {
|
|
179
176
|
"purpur-stepper-nav-items__list": "_purpur-stepper-nav-items__list_lgkh0_1",
|
|
180
177
|
"purpur-stepper-nav-items__list-item": "_purpur-stepper-nav-items__list-item_lgkh0_7",
|
|
181
178
|
"purpur-stepper-nav-items__list-item--current": "_purpur-stepper-nav-items__list-item--current_lgkh0_25",
|
|
182
179
|
"purpur-stepper-nav-items__tooltip-content": "_purpur-stepper-nav-items__tooltip-content_lgkh0_31",
|
|
183
180
|
"purpur-stepper-nav-items__tooltip-trigger-item-container": "_purpur-stepper-nav-items__tooltip-trigger-item-container_lgkh0_34"
|
|
184
|
-
}, C = L.bind(
|
|
181
|
+
}, C = L.bind(fr), v = "purpur-stepper-nav-items", gr = z(
|
|
185
182
|
({
|
|
186
183
|
["data-testid"]: t,
|
|
187
184
|
variant: e,
|
|
@@ -194,7 +191,7 @@ const ar = {
|
|
|
194
191
|
completedStepLabel: l
|
|
195
192
|
}, a) => {
|
|
196
193
|
const o = i.map((u, d) => {
|
|
197
|
-
const
|
|
194
|
+
const $ = u.disabled ? /* @__PURE__ */ r("span", { className: C(`${v}__tooltip-trigger-item-container`), children: /* @__PURE__ */ r(
|
|
198
195
|
A,
|
|
199
196
|
{
|
|
200
197
|
"data-testid": `${t}-disabled-sm`,
|
|
@@ -212,16 +209,16 @@ const ar = {
|
|
|
212
209
|
return /* @__PURE__ */ r(
|
|
213
210
|
"li",
|
|
214
211
|
{
|
|
215
|
-
className: C(`${
|
|
216
|
-
[`${
|
|
212
|
+
className: C(`${v}__list-item`, {
|
|
213
|
+
[`${v}__list-item--current`]: d === m
|
|
217
214
|
}),
|
|
218
215
|
ref: d === 0 ? n : d === i.length - 1 ? b : null,
|
|
219
|
-
children: u.disabled ? /* @__PURE__ */
|
|
216
|
+
children: u.disabled ? /* @__PURE__ */ N(Z, { children: [
|
|
220
217
|
/* @__PURE__ */ r(
|
|
221
218
|
ir,
|
|
222
219
|
{
|
|
223
|
-
contentClassName: C(`${
|
|
224
|
-
triggerElement:
|
|
220
|
+
contentClassName: C(`${v}__tooltip-content`),
|
|
221
|
+
triggerElement: $,
|
|
225
222
|
children: u.label
|
|
226
223
|
}
|
|
227
224
|
),
|
|
@@ -259,11 +256,11 @@ const ar = {
|
|
|
259
256
|
u.label
|
|
260
257
|
);
|
|
261
258
|
});
|
|
262
|
-
return /* @__PURE__ */ r(
|
|
259
|
+
return /* @__PURE__ */ r(H, { loop: !1, dir: "ltr", children: /* @__PURE__ */ r("ol", { ref: a, className: C(`${v}__list`), children: o }) });
|
|
263
260
|
}
|
|
264
|
-
),
|
|
261
|
+
), $r = (t) => {
|
|
265
262
|
const e = S(!0), s = S(null);
|
|
266
|
-
return
|
|
263
|
+
return F(() => {
|
|
267
264
|
!e.current && s.current !== null && s.current.focus(), e.current = !1;
|
|
268
265
|
}, [t]), {
|
|
269
266
|
contentRef: s
|
|
@@ -271,7 +268,7 @@ const ar = {
|
|
|
271
268
|
}, E = {
|
|
272
269
|
LEFT: "left",
|
|
273
270
|
RIGHT: "right"
|
|
274
|
-
},
|
|
271
|
+
}, wr = () => {
|
|
275
272
|
const t = S(null), e = S(null), s = S(null), [p, i] = O(!1), [n, b] = O(!1), m = (l) => {
|
|
276
273
|
if (!t.current)
|
|
277
274
|
return;
|
|
@@ -284,7 +281,7 @@ const ar = {
|
|
|
284
281
|
left: u + o / 2
|
|
285
282
|
});
|
|
286
283
|
};
|
|
287
|
-
return
|
|
284
|
+
return F(() => {
|
|
288
285
|
if (e.current && s.current && t.current) {
|
|
289
286
|
const l = new IntersectionObserver(
|
|
290
287
|
(a) => {
|
|
@@ -311,7 +308,7 @@ const ar = {
|
|
|
311
308
|
displayRightScrollButton: n,
|
|
312
309
|
handleHorizontalScroll: m
|
|
313
310
|
};
|
|
314
|
-
},
|
|
311
|
+
}, g = L.bind(ar), _ = "purpur-stepper", D = ({
|
|
315
312
|
["aria-label"]: t,
|
|
316
313
|
["data-testid"]: e,
|
|
317
314
|
children: s,
|
|
@@ -322,24 +319,24 @@ const ar = {
|
|
|
322
319
|
alignWithGrid: m = !1,
|
|
323
320
|
leftScrollButtonAriaLabel: l,
|
|
324
321
|
rightScrollButtonAriaLabel: a,
|
|
325
|
-
variant: o =
|
|
322
|
+
variant: o = ur.PRIMARY,
|
|
326
323
|
...u
|
|
327
324
|
}) => {
|
|
328
|
-
const d = j.toArray(s).filter(
|
|
325
|
+
const d = j.toArray(s).filter(br), $ = j.map(d, (h) => {
|
|
329
326
|
const { disabled: w, finished: Q, label: X } = h.props;
|
|
330
327
|
return {
|
|
331
328
|
disabled: w ?? !1,
|
|
332
329
|
finished: Q ?? !1,
|
|
333
330
|
label: X
|
|
334
331
|
};
|
|
335
|
-
}), { contentRef:
|
|
332
|
+
}), { contentRef: f } = $r(n), {
|
|
336
333
|
scrollContainer: T,
|
|
337
334
|
firstStepRef: G,
|
|
338
335
|
lastStepRef: M,
|
|
339
336
|
displayLeftScrollButton: U,
|
|
340
337
|
displayRightScrollButton: W,
|
|
341
338
|
handleHorizontalScroll: P
|
|
342
|
-
} =
|
|
339
|
+
} = wr(), q = g([
|
|
343
340
|
p,
|
|
344
341
|
_,
|
|
345
342
|
{
|
|
@@ -356,28 +353,28 @@ const ar = {
|
|
|
356
353
|
}, K = (h) => {
|
|
357
354
|
k(h);
|
|
358
355
|
};
|
|
359
|
-
return /* @__PURE__ */
|
|
360
|
-
/* @__PURE__ */ r(
|
|
361
|
-
/* @__PURE__ */
|
|
356
|
+
return /* @__PURE__ */ N("div", { className: q, ...u, children: [
|
|
357
|
+
/* @__PURE__ */ r(cr, { variant: o, alignWithGrid: m, children: /* @__PURE__ */ N("div", { className: g(`${_}__nav-container`), children: [
|
|
358
|
+
/* @__PURE__ */ N(sr, { children: [
|
|
362
359
|
/* @__PURE__ */ r(pr, { ref: T, children: /* @__PURE__ */ r(
|
|
363
360
|
"div",
|
|
364
361
|
{
|
|
365
362
|
"aria-label": t,
|
|
366
363
|
"data-testid": e,
|
|
367
|
-
className:
|
|
364
|
+
className: g([
|
|
368
365
|
`${_}__nav`,
|
|
369
366
|
{
|
|
370
367
|
[`${_}__nav--${o}`]: o
|
|
371
368
|
}
|
|
372
369
|
]),
|
|
373
|
-
children: /* @__PURE__ */ r(
|
|
374
|
-
|
|
370
|
+
children: /* @__PURE__ */ r(H, { loop: !1, dir: "ltr", children: /* @__PURE__ */ r(
|
|
371
|
+
gr,
|
|
375
372
|
{
|
|
376
373
|
"data-testid": e,
|
|
377
374
|
variant: o,
|
|
378
375
|
firstStepRef: G,
|
|
379
376
|
lastStepRef: M,
|
|
380
|
-
steps:
|
|
377
|
+
steps: $,
|
|
381
378
|
currentStepIndex: n,
|
|
382
379
|
handleStepChange: J,
|
|
383
380
|
handleStepFocus: K,
|
|
@@ -392,7 +389,7 @@ const ar = {
|
|
|
392
389
|
B,
|
|
393
390
|
{
|
|
394
391
|
"aria-label": l,
|
|
395
|
-
className:
|
|
392
|
+
className: g([
|
|
396
393
|
`${_}__scroll-button`,
|
|
397
394
|
`${_}__scroll-button--left`
|
|
398
395
|
]),
|
|
@@ -402,14 +399,14 @@ const ar = {
|
|
|
402
399
|
onClick: () => {
|
|
403
400
|
P(E.LEFT);
|
|
404
401
|
},
|
|
405
|
-
children: /* @__PURE__ */ r(rr, { className:
|
|
402
|
+
children: /* @__PURE__ */ r(rr, { className: g(`${_}__scroll-button-icon`), size: "md" })
|
|
406
403
|
}
|
|
407
404
|
),
|
|
408
405
|
W && /* @__PURE__ */ r(
|
|
409
406
|
B,
|
|
410
407
|
{
|
|
411
408
|
"aria-label": a,
|
|
412
|
-
className:
|
|
409
|
+
className: g([
|
|
413
410
|
`${_}__scroll-button`,
|
|
414
411
|
`${_}__scroll-button--right`
|
|
415
412
|
]),
|
|
@@ -419,7 +416,7 @@ const ar = {
|
|
|
419
416
|
onClick: () => {
|
|
420
417
|
P(E.RIGHT);
|
|
421
418
|
},
|
|
422
|
-
children: /* @__PURE__ */ r(tr, { className:
|
|
419
|
+
children: /* @__PURE__ */ r(tr, { className: g(`${_}__scroll-button-icon`), size: "md" })
|
|
423
420
|
}
|
|
424
421
|
)
|
|
425
422
|
] }) }),
|
|
@@ -428,12 +425,12 @@ const ar = {
|
|
|
428
425
|
{
|
|
429
426
|
tabIndex: -1,
|
|
430
427
|
"aria-labelledby": `stepper-trigger-button-${n}`,
|
|
431
|
-
ref:
|
|
428
|
+
ref: f,
|
|
432
429
|
style: { outline: "none" },
|
|
433
430
|
children: /* @__PURE__ */ r("div", { "aria-live": "polite", children: j.map(d, (h, w) => /* @__PURE__ */ r(
|
|
434
431
|
"div",
|
|
435
432
|
{
|
|
436
|
-
className:
|
|
433
|
+
className: g({
|
|
437
434
|
[`${_}__hidden`]: w !== n
|
|
438
435
|
}),
|
|
439
436
|
hidden: w !== n,
|
|
@@ -444,9 +441,9 @@ const ar = {
|
|
|
444
441
|
)
|
|
445
442
|
] });
|
|
446
443
|
};
|
|
447
|
-
D.Content =
|
|
444
|
+
D.Content = dr;
|
|
448
445
|
D.displayName = "Stepper";
|
|
449
446
|
export {
|
|
450
447
|
D as S
|
|
451
448
|
};
|
|
452
|
-
//# sourceMappingURL=stepper-
|
|
449
|
+
//# sourceMappingURL=stepper-D7T0wed7.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"stepper-D7T0wed7.mjs","sources":["../../../components/stepper/src/constants.ts","../../../components/stepper/src/stepper-container.tsx","../../../components/stepper/src/stepper-content.tsx","../../../components/stepper/src/stepper-button.tsx","../../../components/stepper/src/stepper-nav-items.tsx","../../../components/stepper/src/use-content-focus.hook.ts","../../../components/stepper/src/use-scroll-buttons.hook.ts","../../../components/stepper/src/stepper.tsx"],"sourcesContent":["export const STEPPER_VARIANT = {\n PRIMARY: \"primary\",\n SECONDARY: \"secondary\",\n} as const;\n\nexport const VISIBILITY_STATES = {\n SMALL_SCREEN: \"small-screen\",\n LARGE_SCREEN: \"large-screen\",\n ALWAYS: \"always\",\n} as const;\n","import React, { type ReactNode } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./stepper-container.module.scss\";\nimport { type StepperVariant } from \"./types\";\n\nconst cx = c.bind(styles);\n\nexport type StepperContainerProps = Omit<BaseProps, \"children\"> & {\n children: ReactNode;\n alignWithGrid: boolean;\n variant: StepperVariant;\n};\n\nconst rootClassName = \"purpur-stepper-container\";\n\nexport const StepperContainer = ({\n [\"data-testid\"]: dataTestId = \"purpur-stepper-container\",\n children,\n className,\n alignWithGrid,\n variant,\n ...props\n}: StepperContainerProps) => {\n const classes: string = cx(className, rootClassName, {\n [`${rootClassName}--${variant}`]: variant,\n [`${rootClassName}--align-with-grid`]: alignWithGrid,\n });\n\n return (\n <div className={classes} data-testid={dataTestId} {...props}>\n <div\n className={cx(`${rootClassName}__inner`, {\n [`${rootClassName}__inner--align-with-grid`]: alignWithGrid,\n })}\n >\n {children}\n </div>\n </div>\n );\n};\n","import React, { forwardRef, isValidElement, type ReactElement, type ReactNode } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\n\nimport { type Optional, type Step } from \"./types\";\n\nexport type StepperContentProps = Omit<BaseProps, \"children\"> & {\n children: ReactNode;\n} & Optional<Step, \"disabled\" | \"finished\">;\n\nexport const StepperContent = forwardRef<HTMLDivElement, StepperContentProps>(\n ({ children, ...props }, ref) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { finished, ...rest } = props;\n return (\n <div {...rest} ref={ref}>\n {children}\n </div>\n );\n }\n);\n\nexport const isStepperContent = (child?: ReactNode): child is ReactElement<StepperContentProps> =>\n !!child && isValidElement<StepperContentProps>(child) && !!child.props.label;\n","import React, { forwardRef } from \"react\";\nimport { Button, BUTTON_VARIANT } from \"@purpur/button\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { IconCheckmark } from \"@purpur/icon/checkmark\";\nimport * as RovingFocusGroup from \"@radix-ui/react-roving-focus\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./stepper-button.module.scss\";\nimport {\n type HandleStepChangeFunction,\n type HandleStepFocusFunction,\n type Step,\n type StepperVariant,\n type VisibilityStates,\n} from \"./types\";\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-stepper-button\";\n\nexport type StepNumberProps = {\n current: boolean;\n disabled: boolean;\n stepNumber: number;\n [\"data-testid\"]?: string;\n};\n\nconst StepNumber = ({\n [\"data-testid\"]: dataTestId,\n current,\n disabled,\n stepNumber,\n}: StepNumberProps) => {\n return (\n <div\n data-testid={dataTestId}\n className={cx([\n `${rootClassName}__step-number`,\n {\n [`${rootClassName}__step-number--current`]: current,\n },\n {\n [`${rootClassName}__step-number--disabled`]: disabled,\n },\n ])}\n >\n {stepNumber}\n </div>\n );\n};\n\nexport type StepperButtonProps = Omit<BaseProps<\"button\">, \"children\"> & {\n variant: StepperVariant;\n step: Step;\n currentStepIndex: number;\n index: number;\n indexOfLastItem: number;\n whenToBeVisible: VisibilityStates;\n handleStepChange: HandleStepChangeFunction;\n handleStepFocus: HandleStepFocusFunction;\n completedStepLabel: string;\n};\n\nexport const StepperButton = forwardRef<HTMLButtonElement, StepperButtonProps>(\n (\n {\n className,\n [\"data-testid\"]: dataTestId,\n variant,\n step,\n indexOfLastItem,\n index,\n currentStepIndex,\n whenToBeVisible,\n handleStepChange,\n handleStepFocus,\n completedStepLabel,\n ...props\n },\n ref\n ) => {\n const placement = index === 0 ? \"first\" : index === indexOfLastItem ? \"last\" : \"middle\";\n const isCurrentStep = index === currentStepIndex;\n return (\n <RovingFocusGroup.Item asChild>\n <Button\n {...props}\n ref={ref}\n className={cx(\n className,\n rootClassName,\n `${rootClassName}--${placement}`,\n `${rootClassName}--${variant}`,\n `${rootClassName}--visibility-${whenToBeVisible}`,\n {\n [`${rootClassName}--current`]: isCurrentStep,\n },\n {\n [`${rootClassName}--disabled`]: step.disabled,\n },\n {\n [\"arrow-tail\"]: placement !== \"first\",\n },\n {\n [\"arrow-forward\"]: placement !== \"last\",\n }\n )}\n id={`stepper-trigger-button-${index}`}\n variant={BUTTON_VARIANT.TERTIARY_PURPLE}\n data-testid={`${dataTestId}-step-trigger-item-${index}`}\n disabled={step.disabled}\n aria-current={isCurrentStep && \"step\"}\n aria-label={\n step.finished && !isCurrentStep\n ? [step.label, completedStepLabel].filter(Boolean).join(\", \")\n : undefined\n }\n onClick={(e) => handleStepChange(e, index)}\n onFocus={handleStepFocus}\n >\n <span className={cx(`${rootClassName}__trigger-outline`)}>\n {step.finished && !isCurrentStep ? (\n <IconCheckmark\n className={cx(`${rootClassName}__icon`)}\n data-testid={`${dataTestId}-step-finished-icon`}\n size=\"sm\"\n />\n ) : (\n <StepNumber\n data-testid={`${dataTestId}-step-number`}\n current={isCurrentStep}\n disabled={step.disabled}\n stepNumber={index + 1}\n />\n )}\n <span\n className={cx(`${rootClassName}__step-label`, {\n [`sr-only--lg-down`]: !isCurrentStep,\n })}\n >\n {step.label}\n </span>\n </span>\n </Button>\n </RovingFocusGroup.Item>\n );\n }\n);\n","import React, { forwardRef, type RefObject } from \"react\";\nimport { Tooltip } from \"@purpur/tooltip\";\nimport * as RovingFocusGroup from \"@radix-ui/react-roving-focus\";\nimport c from \"classnames/bind\";\n\nimport { VISIBILITY_STATES } from \"./constants\";\nimport { StepperButton } from \"./stepper-button\";\nimport styles from \"./stepper-nav-items.module.scss\";\nimport {\n type HandleStepChangeFunction,\n type HandleStepFocusFunction,\n type Step,\n type StepperVariant,\n} from \"./types\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-stepper-nav-items\";\n\nexport type StepperNavItemsProps = {\n variant: StepperVariant;\n [\"data-testid\"]?: string;\n firstStepRef: RefObject<HTMLLIElement | null>;\n lastStepRef: RefObject<HTMLLIElement | null>;\n steps: Step[];\n currentStepIndex: number;\n handleStepChange: HandleStepChangeFunction;\n handleStepFocus: HandleStepFocusFunction;\n completedStepLabel: string;\n};\n\nexport const StepperNavItems = forwardRef<HTMLOListElement, StepperNavItemsProps>(\n (\n {\n [\"data-testid\"]: dataTestId,\n variant,\n handleStepChange,\n handleStepFocus,\n steps,\n firstStepRef,\n lastStepRef,\n currentStepIndex,\n completedStepLabel,\n },\n ref\n ) => {\n const stepListItems = steps.map((step: Step, index: number) => {\n const tooltipTriggerItem = step.disabled ? (\n <span className={cx(`${rootClassName}__tooltip-trigger-item-container`)}>\n <StepperButton\n data-testid={`${dataTestId}-disabled-sm`}\n variant={variant}\n step={step}\n indexOfLastItem={steps.length - 1}\n index={index}\n currentStepIndex={currentStepIndex}\n whenToBeVisible={VISIBILITY_STATES.SMALL_SCREEN}\n completedStepLabel={completedStepLabel}\n handleStepChange={handleStepChange}\n handleStepFocus={handleStepFocus}\n />\n </span>\n ) : null;\n\n return (\n <li\n className={cx(`${rootClassName}__list-item`, {\n [`${rootClassName}__list-item--current`]: index === currentStepIndex,\n })}\n ref={index === 0 ? firstStepRef : index === steps.length - 1 ? lastStepRef : null}\n key={step.label}\n >\n {step.disabled ? (\n <>\n <Tooltip\n contentClassName={cx(`${rootClassName}__tooltip-content`)}\n triggerElement={tooltipTriggerItem}\n >\n {step.label}\n </Tooltip>\n <StepperButton\n data-testid={`${dataTestId}-disabled-lg`}\n variant={variant}\n step={step}\n indexOfLastItem={steps.length - 1}\n index={index}\n currentStepIndex={currentStepIndex}\n whenToBeVisible={VISIBILITY_STATES.LARGE_SCREEN}\n completedStepLabel={completedStepLabel}\n handleStepChange={handleStepChange}\n handleStepFocus={handleStepFocus}\n />\n </>\n ) : (\n <StepperButton\n data-testid={dataTestId}\n variant={variant}\n step={step}\n indexOfLastItem={steps.length - 1}\n index={index}\n currentStepIndex={currentStepIndex}\n whenToBeVisible={VISIBILITY_STATES.ALWAYS}\n completedStepLabel={completedStepLabel}\n handleStepChange={handleStepChange}\n handleStepFocus={handleStepFocus}\n />\n )}\n </li>\n );\n });\n return (\n <RovingFocusGroup.Root loop={false} dir=\"ltr\">\n <ol ref={ref} className={cx(`${rootClassName}__list`)}>\n {stepListItems}\n </ol>\n </RovingFocusGroup.Root>\n );\n }\n);\n","import { type RefObject, useEffect, useRef } from \"react\";\n\ninterface UseContentFocusHook<T extends HTMLElement> {\n contentRef: RefObject<T | null>;\n}\n\nexport const useContentFocus = <T extends HTMLElement>(\n currentStepIndex: number\n): UseContentFocusHook<T> => {\n const firstLoad = useRef<boolean>(true);\n const contentRef = useRef<T | null>(null);\n\n useEffect(() => {\n if (!firstLoad.current && contentRef.current !== null) {\n contentRef.current.focus();\n }\n firstLoad.current = false;\n }, [currentStepIndex]);\n\n return {\n contentRef,\n };\n};\n","import { type RefObject, useEffect, useRef, useState } from \"react\";\n\nexport const SCROLL_DIRECTION = {\n LEFT: \"left\",\n RIGHT: \"right\",\n} as const;\n\nexport type ScrollDirection = (typeof SCROLL_DIRECTION)[keyof typeof SCROLL_DIRECTION];\n\nexport type UseScrollHook<ContainerElement, WatchedElement> = {\n scrollContainer: RefObject<ContainerElement | null>;\n firstStepRef: RefObject<WatchedElement | null>;\n lastStepRef: RefObject<WatchedElement | null>;\n displayLeftScrollButton: boolean;\n displayRightScrollButton: boolean;\n handleHorizontalScroll: (dir: ScrollDirection) => void;\n};\n\nexport const useScrollButtons = <\n ContainerElement extends HTMLElement,\n WatchedElement extends HTMLElement\n>(): UseScrollHook<ContainerElement, WatchedElement> => {\n const scrollContainer = useRef<ContainerElement | null>(null);\n const firstStepRef = useRef<WatchedElement | null>(null);\n const lastStepRef = useRef<WatchedElement | null>(null);\n const [displayLeftScrollButton, setDisplayLeftScrollButton] = useState(false);\n const [displayRightScrollButton, setDisplayRightScrollButton] = useState(false);\n\n const handleHorizontalScroll = (dir: ScrollDirection): void => {\n if (!scrollContainer.current) {\n return;\n }\n const scrollableContainer = scrollContainer.current;\n const scrollableContainerWidth = scrollableContainer.clientWidth;\n const currentScrollLeft = scrollableContainer.scrollLeft;\n if (dir === SCROLL_DIRECTION.LEFT) {\n scrollableContainer.scroll({\n behavior: \"smooth\",\n left: currentScrollLeft - scrollableContainerWidth / 2,\n });\n }\n if (dir === SCROLL_DIRECTION.RIGHT) {\n scrollableContainer.scroll({\n behavior: \"smooth\",\n left: currentScrollLeft + scrollableContainerWidth / 2,\n });\n }\n };\n\n useEffect(() => {\n if (firstStepRef.current && lastStepRef.current && scrollContainer.current) {\n const observer: IntersectionObserver = new IntersectionObserver(\n (entries: IntersectionObserverEntry[]) => {\n for (const entry of entries) {\n if (entry.target === firstStepRef.current) {\n if (entry.isIntersecting) {\n setDisplayLeftScrollButton(false);\n } else {\n setDisplayLeftScrollButton(true);\n }\n continue;\n }\n if (entry.target === lastStepRef.current) {\n if (entry.isIntersecting) {\n setDisplayRightScrollButton(false);\n } else {\n setDisplayRightScrollButton(true);\n }\n }\n }\n },\n {\n root: scrollContainer.current,\n threshold: 0.95,\n }\n );\n\n observer.observe(firstStepRef.current);\n observer.observe(lastStepRef.current);\n\n return () => observer.disconnect();\n }\n return undefined;\n }, [firstStepRef, lastStepRef, scrollContainer]);\n\n return {\n scrollContainer,\n firstStepRef,\n lastStepRef,\n displayLeftScrollButton,\n displayRightScrollButton,\n handleHorizontalScroll,\n };\n};\n","import React, { Children, type ReactElement } from \"react\";\nimport { Button, BUTTON_VARIANT } from \"@purpur/button\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { IconChevronLeft } from \"@purpur/icon/chevron-left\";\nimport { IconChevronRight } from \"@purpur/icon/chevron-right\";\nimport * as RovingFocusGroup from \"@radix-ui/react-roving-focus\";\nimport * as ScrollArea from \"@radix-ui/react-scroll-area\";\nimport c from \"classnames/bind\";\n\nimport { STEPPER_VARIANT } from \"./constants\";\nimport styles from \"./stepper.module.scss\";\nimport { StepperContainer } from \"./stepper-container\";\nimport { isStepperContent, StepperContent } from \"./stepper-content\";\nimport { StepperNavItems } from \"./stepper-nav-items\";\nimport { type Step, type StepChangeFunction, type StepperVariant } from \"./types\";\nimport { useContentFocus } from \"./use-content-focus.hook\";\nimport { SCROLL_DIRECTION, useScrollButtons } from \"./use-scroll-buttons.hook\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-stepper\";\n\nexport type StepperProps = Omit<BaseProps, \"children\"> & {\n children: Array<ReactElement<typeof StepperContent>> | ReactElement<typeof StepperContent>;\n completedStepLabel: string;\n currentStepIndex: number;\n onStepChange: StepChangeFunction;\n alignWithGrid?: boolean;\n leftScrollButtonAriaLabel: string;\n rightScrollButtonAriaLabel: string;\n variant: StepperVariant;\n};\n\nexport type StepperComponent<P> = React.FunctionComponent<P> & {\n Content: typeof StepperContent;\n};\n\nexport const Stepper: StepperComponent<StepperProps> = ({\n [\"aria-label\"]: ariaLabel,\n [\"data-testid\"]: dataTestId,\n children,\n className,\n completedStepLabel,\n currentStepIndex = 0,\n onStepChange,\n alignWithGrid = false,\n leftScrollButtonAriaLabel,\n rightScrollButtonAriaLabel,\n variant = STEPPER_VARIANT.PRIMARY,\n ...props\n}: StepperProps) => {\n const stepperContentChildren = Children.toArray(children).filter(isStepperContent);\n const steps: Step[] = Children.map(stepperContentChildren, (child) => {\n const { disabled, finished, label } = child.props;\n return {\n disabled: disabled ?? false,\n finished: finished ?? false,\n label,\n };\n });\n const { contentRef } = useContentFocus<HTMLDivElement>(currentStepIndex);\n const {\n scrollContainer,\n firstStepRef,\n lastStepRef,\n displayLeftScrollButton,\n displayRightScrollButton,\n handleHorizontalScroll,\n } = useScrollButtons<HTMLDivElement, HTMLLIElement>();\n\n const classes: string = cx([\n className,\n rootClassName,\n {\n [`${rootClassName}--${variant}`]: variant,\n },\n ]);\n const scrollTriggerIntoView = (e: React.FocusEvent | React.MouseEvent): void => {\n (e.target as HTMLButtonElement).scrollIntoView({\n behavior: \"smooth\",\n block: \"nearest\",\n inline: \"center\",\n });\n };\n\n const handleStepChange = (e: React.MouseEvent, idx: number): void => {\n e.preventDefault();\n scrollTriggerIntoView(e);\n onStepChange(idx);\n };\n\n const handleStepFocus = (e: React.FocusEvent): void => {\n scrollTriggerIntoView(e);\n };\n\n return (\n <div className={classes} {...props}>\n <StepperContainer variant={variant} alignWithGrid={alignWithGrid}>\n <div className={cx(`${rootClassName}__nav-container`)}>\n <ScrollArea.Root>\n <ScrollArea.Viewport ref={scrollContainer}>\n <div\n aria-label={ariaLabel}\n data-testid={dataTestId}\n className={cx([\n `${rootClassName}__nav`,\n {\n [`${rootClassName}__nav--${variant}`]: variant,\n },\n ])}\n >\n <RovingFocusGroup.Root loop={false} dir=\"ltr\">\n <StepperNavItems\n data-testid={dataTestId}\n variant={variant}\n firstStepRef={firstStepRef}\n lastStepRef={lastStepRef}\n steps={steps}\n currentStepIndex={currentStepIndex}\n handleStepChange={handleStepChange}\n handleStepFocus={handleStepFocus}\n completedStepLabel={completedStepLabel}\n />\n </RovingFocusGroup.Root>\n </div>\n </ScrollArea.Viewport>\n <ScrollArea.Scrollbar orientation=\"horizontal\">\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n </ScrollArea.Root>\n {displayLeftScrollButton && (\n <Button\n aria-label={leftScrollButtonAriaLabel}\n className={cx([\n `${rootClassName}__scroll-button`,\n `${rootClassName}__scroll-button--left`,\n ])}\n variant={BUTTON_VARIANT.TERTIARY_PURPLE}\n tabIndex={-1}\n iconOnly\n onClick={() => {\n handleHorizontalScroll(SCROLL_DIRECTION.LEFT);\n }}\n >\n <IconChevronLeft className={cx(`${rootClassName}__scroll-button-icon`)} size=\"md\" />\n </Button>\n )}\n {displayRightScrollButton && (\n <Button\n aria-label={rightScrollButtonAriaLabel}\n className={cx([\n `${rootClassName}__scroll-button`,\n `${rootClassName}__scroll-button--right`,\n ])}\n variant={BUTTON_VARIANT.TERTIARY_PURPLE}\n tabIndex={-1}\n iconOnly\n onClick={() => {\n handleHorizontalScroll(SCROLL_DIRECTION.RIGHT);\n }}\n >\n <IconChevronRight className={cx(`${rootClassName}__scroll-button-icon`)} size=\"md\" />\n </Button>\n )}\n </div>\n </StepperContainer>\n <div\n tabIndex={-1}\n aria-labelledby={`stepper-trigger-button-${currentStepIndex}`}\n ref={contentRef}\n style={{ outline: \"none\" }}\n >\n <div aria-live=\"polite\">\n {Children.map(stepperContentChildren, (child, index: number) => (\n <div\n className={cx({\n [`${rootClassName}__hidden`]: index !== currentStepIndex,\n })}\n hidden={index !== currentStepIndex}\n >\n {child}\n </div>\n ))}\n </div>\n </div>\n </div>\n );\n};\n\nStepper.Content = StepperContent;\n\nStepper.displayName = \"Stepper\";\n"],"names":["STEPPER_VARIANT","VISIBILITY_STATES","cx","c","styles","rootClassName","StepperContainer","dataTestId","children","className","alignWithGrid","variant","props","classes","jsx","StepperContent","forwardRef","ref","finished","rest","isStepperContent","child","isValidElement","StepNumber","current","disabled","stepNumber","StepperButton","step","indexOfLastItem","index","currentStepIndex","whenToBeVisible","handleStepChange","handleStepFocus","completedStepLabel","placement","isCurrentStep","RovingFocusGroup.Item","Button","BUTTON_VARIANT","e","IconCheckmark","StepperNavItems","steps","firstStepRef","lastStepRef","stepListItems","tooltipTriggerItem","jsxs","Fragment","Tooltip","RovingFocusGroup.Root","useContentFocus","firstLoad","useRef","contentRef","useEffect","SCROLL_DIRECTION","useScrollButtons","scrollContainer","displayLeftScrollButton","setDisplayLeftScrollButton","useState","displayRightScrollButton","setDisplayRightScrollButton","handleHorizontalScroll","dir","scrollableContainer","scrollableContainerWidth","currentScrollLeft","observer","entries","entry","Stepper","ariaLabel","onStepChange","leftScrollButtonAriaLabel","rightScrollButtonAriaLabel","stepperContentChildren","Children","label","scrollTriggerIntoView","idx","ScrollArea.Root","ScrollArea.Viewport","ScrollArea.Scrollbar","ScrollArea.Thumb","IconChevronLeft","IconChevronRight"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";const e=require("react/jsx-runtime"),l=require("react"),$=require("./button-DDYGuqZ0.js"),M=require("./chevron-left.es-B0vPg5XM.js"),W=require("./chevron-right.es-Bv376M3o.js"),I=require("./index-BVmlsxuF.js"),x=require("./index-CoR7YA3H.js"),T=require("./bind-DeUYJ6m9.js"),J=require("./tooltip-svlZkXBs.js"),K=require("./checkmark.es-lYntWFA3.js"),Q={PRIMARY:"primary"},L={SMALL_SCREEN:"small-screen",LARGE_SCREEN:"large-screen",ALWAYS:"always"},X={"purpur-stepper__nav-container":"_purpur-stepper__nav-container_1rouo_1","purpur-stepper__nav":"_purpur-stepper__nav_1rouo_1","purpur-stepper":"_purpur-stepper_1rouo_1","purpur-stepper__scroll-button":"_purpur-stepper__scroll-button_1rouo_7","purpur-stepper__scroll-button--left":"_purpur-stepper__scroll-button--left_1rouo_18","purpur-stepper__scroll-button--right":"_purpur-stepper__scroll-button--right_1rouo_21","purpur-stepper__scroll-button-icon":"_purpur-stepper__scroll-button-icon_1rouo_24","purpur-stepper__hidden":"_purpur-stepper__hidden_1rouo_27"},Z={"purpur-stepper-container":"_purpur-stepper-container_162zw_1","purpur-stepper-container__inner--align-with-grid":"_purpur-stepper-container__inner--align-with-grid_162zw_5","purpur-stepper-container--primary":"_purpur-stepper-container--primary_162zw_18","purpur-stepper-container--secondary":"_purpur-stepper-container--secondary_162zw_21"},O=T.c.bind(Z),v="purpur-stepper-container",ee=({["data-testid"]:t="purpur-stepper-container",children:r,className:s,alignWithGrid:n,variant:o,...p})=>{const h=O(s,v,{[`${v}--${o}`]:o,[`${v}--align-with-grid`]:n});return e.jsx("div",{className:h,"data-testid":t,...p,children:e.jsx("div",{className:O(`${v}__inner`,{[`${v}__inner--align-with-grid`]:n}),children:r})})},te=l.forwardRef(({children:t,...r},s)=>{const{finished:n,...o}=r;return e.jsx("div",{...o,ref:s,children:t})}),re=t=>!!t&&l.isValidElement(t)&&!!t.props.label,se={"purpur-stepper-button":"_purpur-stepper-button_wjiph_1","purpur-stepper-button__trigger-outline":"_purpur-stepper-button__trigger-outline_wjiph_21","purpur-stepper-button--first":"_purpur-stepper-button--first_wjiph_33","purpur-stepper-button--current":"_purpur-stepper-button--current_wjiph_33","purpur-stepper-button--middle":"_purpur-stepper-button--middle_wjiph_38","purpur-stepper-button--last":"_purpur-stepper-button--last_wjiph_48","purpur-stepper-button--visibility-small-screen":"_purpur-stepper-button--visibility-small-screen_wjiph_58","purpur-stepper-button--visibility-large-screen":"_purpur-stepper-button--visibility-large-screen_wjiph_66","purpur-stepper-button__icon":"_purpur-stepper-button__icon_wjiph_90","purpur-stepper-button__step-number":"_purpur-stepper-button__step-number_wjiph_97","purpur-stepper-button__step-number--current":"_purpur-stepper-button__step-number--current_wjiph_108","purpur-stepper-button__step-number--disabled":"_purpur-stepper-button__step-number--disabled_wjiph_112","purpur-stepper-button__step-label":"_purpur-stepper-button__step-label_wjiph_117","arrow-forward":"_arrow-forward_wjiph_121","purpur-stepper-button--primary":"_purpur-stepper-button--primary_wjiph_133","purpur-stepper-button--disabled":"_purpur-stepper-button--disabled_wjiph_136","purpur-stepper-button--secondary":"_purpur-stepper-button--secondary_wjiph_142","arrow-tail":"_arrow-tail_wjiph_152","sr-only--lg-down":"_sr-only--lg-down_wjiph_171"},y=T.c.bind(se),d="purpur-stepper-button",ne=({["data-testid"]:t,current:r,disabled:s,stepNumber:n})=>e.jsx("div",{"data-testid":t,className:y([`${d}__step-number`,{[`${d}__step-number--current`]:r},{[`${d}__step-number--disabled`]:s}]),children:n}),A=l.forwardRef(({className:t,["data-testid"]:r,variant:s,step:n,indexOfLastItem:o,index:p,currentStepIndex:h,whenToBeVisible:m,handleStepChange:u,handleStepFocus:a,completedStepLabel:i,..._},b)=>{const R=p===0?"first":p===o?"last":"middle",g=p===h;return e.jsx(I.Item,{asChild:!0,children:e.jsx($.Button,{..._,ref:b,className:y(t,d,`${d}--${R}`,`${d}--${s}`,`${d}--visibility-${m}`,{[`${d}--current`]:g},{[`${d}--disabled`]:n.disabled},{"arrow-tail":R!=="first"},{"arrow-forward":R!=="last"}),id:`stepper-trigger-button-${p}`,variant:$.BUTTON_VARIANT.TERTIARY_PURPLE,"data-testid":`${r}-step-trigger-item-${p}`,disabled:n.disabled,"aria-current":g&&"step","aria-label":n.finished&&!g?[n.label,i].filter(Boolean).join(", "):void 0,onClick:E=>u(E,p),onFocus:a,children:e.jsxs("span",{className:y(`${d}__trigger-outline`),children:[n.finished&&!g?e.jsx(K.a,{className:y(`${d}__icon`),"data-testid":`${r}-step-finished-icon`,size:"sm"}):e.jsx(ne,{"data-testid":`${r}-step-number`,current:g,disabled:n.disabled,stepNumber:p+1}),e.jsx("span",{className:y(`${d}__step-label`,{"sr-only--lg-down":!g}),children:n.label})]})})})}),pe={"purpur-stepper-nav-items__list":"_purpur-stepper-nav-items__list_lgkh0_1","purpur-stepper-nav-items__list-item":"_purpur-stepper-nav-items__list-item_lgkh0_7","purpur-stepper-nav-items__list-item--current":"_purpur-stepper-nav-items__list-item--current_lgkh0_25","purpur-stepper-nav-items__tooltip-content":"_purpur-stepper-nav-items__tooltip-content_lgkh0_31","purpur-stepper-nav-items__tooltip-trigger-item-container":"_purpur-stepper-nav-items__tooltip-trigger-item-container_lgkh0_34"},C=T.c.bind(pe),N="purpur-stepper-nav-items",ie=l.forwardRef(({["data-testid"]:t,variant:r,handleStepChange:s,handleStepFocus:n,steps:o,firstStepRef:p,lastStepRef:h,currentStepIndex:m,completedStepLabel:u},a)=>{const i=o.map((_,b)=>{const R=_.disabled?e.jsx("span",{className:C(`${N}__tooltip-trigger-item-container`),children:e.jsx(A,{"data-testid":`${t}-disabled-sm`,variant:r,step:_,indexOfLastItem:o.length-1,index:b,currentStepIndex:m,whenToBeVisible:L.SMALL_SCREEN,completedStepLabel:u,handleStepChange:s,handleStepFocus:n})}):null;return e.jsx("li",{className:C(`${N}__list-item`,{[`${N}__list-item--current`]:b===m}),ref:b===0?p:b===o.length-1?h:null,children:_.disabled?e.jsxs(e.Fragment,{children:[e.jsx(J.Tooltip,{contentClassName:C(`${N}__tooltip-content`),triggerElement:R,children:_.label}),e.jsx(A,{"data-testid":`${t}-disabled-lg`,variant:r,step:_,indexOfLastItem:o.length-1,index:b,currentStepIndex:m,whenToBeVisible:L.LARGE_SCREEN,completedStepLabel:u,handleStepChange:s,handleStepFocus:n})]}):e.jsx(A,{"data-testid":t,variant:r,step:_,indexOfLastItem:o.length-1,index:b,currentStepIndex:m,whenToBeVisible:L.ALWAYS,completedStepLabel:u,handleStepChange:s,handleStepFocus:n})},_.label)});return e.jsx(I.Root,{loop:!1,dir:"ltr",children:e.jsx("ol",{ref:a,className:C(`${N}__list`),children:i})})}),oe=t=>{const r=l.useRef(!0),s=l.useRef(null);return l.useEffect(()=>{!r.current&&s.current!==null&&s.current.focus(),r.current=!1},[t]),{contentRef:s}},S={LEFT:"left",RIGHT:"right"},le=()=>{const t=l.useRef(null),r=l.useRef(null),s=l.useRef(null),[n,o]=l.useState(!1),[p,h]=l.useState(!1),m=u=>{if(!t.current)return;const a=t.current,i=a.clientWidth,_=a.scrollLeft;u===S.LEFT&&a.scroll({behavior:"smooth",left:_-i/2}),u===S.RIGHT&&a.scroll({behavior:"smooth",left:_+i/2})};return l.useEffect(()=>{if(r.current&&s.current&&t.current){const u=new IntersectionObserver(a=>{for(const i of a){if(i.target===r.current){i.isIntersecting?o(!1):o(!0);continue}i.target===s.current&&(i.isIntersecting?h(!1):h(!0))}},{root:t.current,threshold:.95});return u.observe(r.current),u.observe(s.current),()=>u.disconnect()}},[r,s,t]),{scrollContainer:t,firstStepRef:r,lastStepRef:s,displayLeftScrollButton:n,displayRightScrollButton:p,handleHorizontalScroll:m}},j=T.c.bind(X),c="purpur-stepper",B=({["aria-label"]:t,["data-testid"]:r,children:s,className:n,completedStepLabel:o,currentStepIndex:p=0,onStepChange:h,alignWithGrid:m=!1,leftScrollButtonAriaLabel:u,rightScrollButtonAriaLabel:a,variant:i=Q.PRIMARY,..._})=>{const b=l.Children.toArray(s).filter(re),R=l.Children.map(b,f=>{const{disabled:w,finished:D,label:G}=f.props;return{disabled:w??!1,finished:D??!1,label:G}}),{contentRef:g}=oe(p),{scrollContainer:E,firstStepRef:q,lastStepRef:z,displayLeftScrollButton:P,displayRightScrollButton:Y,handleHorizontalScroll:V}=le(),U=j([n,c,{[`${c}--${i}`]:i}]),k=f=>{f.target.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})},F=(f,w)=>{f.preventDefault(),k(f),h(w)},H=f=>{k(f)};return e.jsxs("div",{className:U,..._,children:[e.jsx(ee,{variant:i,alignWithGrid:m,children:e.jsxs("div",{className:j(`${c}__nav-container`),children:[e.jsxs(x.Root,{children:[e.jsx(x.Viewport,{ref:E,children:e.jsx("div",{"aria-label":t,"data-testid":r,className:j([`${c}__nav`,{[`${c}__nav--${i}`]:i}]),children:e.jsx(I.Root,{loop:!1,dir:"ltr",children:e.jsx(ie,{"data-testid":r,variant:i,firstStepRef:q,lastStepRef:z,steps:R,currentStepIndex:p,handleStepChange:F,handleStepFocus:H,completedStepLabel:o})})})}),e.jsx(x.Scrollbar,{orientation:"horizontal",children:e.jsx(x.Thumb,{})})]}),P&&e.jsx($.Button,{"aria-label":u,className:j([`${c}__scroll-button`,`${c}__scroll-button--left`]),variant:$.BUTTON_VARIANT.TERTIARY_PURPLE,tabIndex:-1,iconOnly:!0,onClick:()=>{V(S.LEFT)},children:e.jsx(M.l,{className:j(`${c}__scroll-button-icon`),size:"md"})}),Y&&e.jsx($.Button,{"aria-label":a,className:j([`${c}__scroll-button`,`${c}__scroll-button--right`]),variant:$.BUTTON_VARIANT.TERTIARY_PURPLE,tabIndex:-1,iconOnly:!0,onClick:()=>{V(S.RIGHT)},children:e.jsx(W.n,{className:j(`${c}__scroll-button-icon`),size:"md"})})]})}),e.jsx("div",{tabIndex:-1,"aria-labelledby":`stepper-trigger-button-${p}`,ref:g,style:{outline:"none"},children:e.jsx("div",{"aria-live":"polite",children:l.Children.map(b,(f,w)=>e.jsx("div",{className:j({[`${c}__hidden`]:w!==p}),hidden:w!==p,children:f}))})})]})};B.Content=te;B.displayName="Stepper";exports.Stepper=B;
|
|
2
|
+
//# sourceMappingURL=stepper-DYjJgEHL.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"stepper-DYjJgEHL.js","sources":["../../../components/stepper/src/constants.ts","../../../components/stepper/src/stepper-container.tsx","../../../components/stepper/src/stepper-content.tsx","../../../components/stepper/src/stepper-button.tsx","../../../components/stepper/src/stepper-nav-items.tsx","../../../components/stepper/src/use-content-focus.hook.ts","../../../components/stepper/src/use-scroll-buttons.hook.ts","../../../components/stepper/src/stepper.tsx"],"sourcesContent":["export const STEPPER_VARIANT = {\n PRIMARY: \"primary\",\n SECONDARY: \"secondary\",\n} as const;\n\nexport const VISIBILITY_STATES = {\n SMALL_SCREEN: \"small-screen\",\n LARGE_SCREEN: \"large-screen\",\n ALWAYS: \"always\",\n} as const;\n","import React, { type ReactNode } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./stepper-container.module.scss\";\nimport { type StepperVariant } from \"./types\";\n\nconst cx = c.bind(styles);\n\nexport type StepperContainerProps = Omit<BaseProps, \"children\"> & {\n children: ReactNode;\n alignWithGrid: boolean;\n variant: StepperVariant;\n};\n\nconst rootClassName = \"purpur-stepper-container\";\n\nexport const StepperContainer = ({\n [\"data-testid\"]: dataTestId = \"purpur-stepper-container\",\n children,\n className,\n alignWithGrid,\n variant,\n ...props\n}: StepperContainerProps) => {\n const classes: string = cx(className, rootClassName, {\n [`${rootClassName}--${variant}`]: variant,\n [`${rootClassName}--align-with-grid`]: alignWithGrid,\n });\n\n return (\n <div className={classes} data-testid={dataTestId} {...props}>\n <div\n className={cx(`${rootClassName}__inner`, {\n [`${rootClassName}__inner--align-with-grid`]: alignWithGrid,\n })}\n >\n {children}\n </div>\n </div>\n );\n};\n","import React, { forwardRef, isValidElement, type ReactElement, type ReactNode } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\n\nimport { type Optional, type Step } from \"./types\";\n\nexport type StepperContentProps = Omit<BaseProps, \"children\"> & {\n children: ReactNode;\n} & Optional<Step, \"disabled\" | \"finished\">;\n\nexport const StepperContent = forwardRef<HTMLDivElement, StepperContentProps>(\n ({ children, ...props }, ref) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { finished, ...rest } = props;\n return (\n <div {...rest} ref={ref}>\n {children}\n </div>\n );\n }\n);\n\nexport const isStepperContent = (child?: ReactNode): child is ReactElement<StepperContentProps> =>\n !!child && isValidElement<StepperContentProps>(child) && !!child.props.label;\n","import React, { forwardRef } from \"react\";\nimport { Button, BUTTON_VARIANT } from \"@purpur/button\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { IconCheckmark } from \"@purpur/icon/checkmark\";\nimport * as RovingFocusGroup from \"@radix-ui/react-roving-focus\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./stepper-button.module.scss\";\nimport {\n type HandleStepChangeFunction,\n type HandleStepFocusFunction,\n type Step,\n type StepperVariant,\n type VisibilityStates,\n} from \"./types\";\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-stepper-button\";\n\nexport type StepNumberProps = {\n current: boolean;\n disabled: boolean;\n stepNumber: number;\n [\"data-testid\"]?: string;\n};\n\nconst StepNumber = ({\n [\"data-testid\"]: dataTestId,\n current,\n disabled,\n stepNumber,\n}: StepNumberProps) => {\n return (\n <div\n data-testid={dataTestId}\n className={cx([\n `${rootClassName}__step-number`,\n {\n [`${rootClassName}__step-number--current`]: current,\n },\n {\n [`${rootClassName}__step-number--disabled`]: disabled,\n },\n ])}\n >\n {stepNumber}\n </div>\n );\n};\n\nexport type StepperButtonProps = Omit<BaseProps<\"button\">, \"children\"> & {\n variant: StepperVariant;\n step: Step;\n currentStepIndex: number;\n index: number;\n indexOfLastItem: number;\n whenToBeVisible: VisibilityStates;\n handleStepChange: HandleStepChangeFunction;\n handleStepFocus: HandleStepFocusFunction;\n completedStepLabel: string;\n};\n\nexport const StepperButton = forwardRef<HTMLButtonElement, StepperButtonProps>(\n (\n {\n className,\n [\"data-testid\"]: dataTestId,\n variant,\n step,\n indexOfLastItem,\n index,\n currentStepIndex,\n whenToBeVisible,\n handleStepChange,\n handleStepFocus,\n completedStepLabel,\n ...props\n },\n ref\n ) => {\n const placement = index === 0 ? \"first\" : index === indexOfLastItem ? \"last\" : \"middle\";\n const isCurrentStep = index === currentStepIndex;\n return (\n <RovingFocusGroup.Item asChild>\n <Button\n {...props}\n ref={ref}\n className={cx(\n className,\n rootClassName,\n `${rootClassName}--${placement}`,\n `${rootClassName}--${variant}`,\n `${rootClassName}--visibility-${whenToBeVisible}`,\n {\n [`${rootClassName}--current`]: isCurrentStep,\n },\n {\n [`${rootClassName}--disabled`]: step.disabled,\n },\n {\n [\"arrow-tail\"]: placement !== \"first\",\n },\n {\n [\"arrow-forward\"]: placement !== \"last\",\n }\n )}\n id={`stepper-trigger-button-${index}`}\n variant={BUTTON_VARIANT.TERTIARY_PURPLE}\n data-testid={`${dataTestId}-step-trigger-item-${index}`}\n disabled={step.disabled}\n aria-current={isCurrentStep && \"step\"}\n aria-label={\n step.finished && !isCurrentStep\n ? [step.label, completedStepLabel].filter(Boolean).join(\", \")\n : undefined\n }\n onClick={(e) => handleStepChange(e, index)}\n onFocus={handleStepFocus}\n >\n <span className={cx(`${rootClassName}__trigger-outline`)}>\n {step.finished && !isCurrentStep ? (\n <IconCheckmark\n className={cx(`${rootClassName}__icon`)}\n data-testid={`${dataTestId}-step-finished-icon`}\n size=\"sm\"\n />\n ) : (\n <StepNumber\n data-testid={`${dataTestId}-step-number`}\n current={isCurrentStep}\n disabled={step.disabled}\n stepNumber={index + 1}\n />\n )}\n <span\n className={cx(`${rootClassName}__step-label`, {\n [`sr-only--lg-down`]: !isCurrentStep,\n })}\n >\n {step.label}\n </span>\n </span>\n </Button>\n </RovingFocusGroup.Item>\n );\n }\n);\n","import React, { forwardRef, type RefObject } from \"react\";\nimport { Tooltip } from \"@purpur/tooltip\";\nimport * as RovingFocusGroup from \"@radix-ui/react-roving-focus\";\nimport c from \"classnames/bind\";\n\nimport { VISIBILITY_STATES } from \"./constants\";\nimport { StepperButton } from \"./stepper-button\";\nimport styles from \"./stepper-nav-items.module.scss\";\nimport {\n type HandleStepChangeFunction,\n type HandleStepFocusFunction,\n type Step,\n type StepperVariant,\n} from \"./types\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-stepper-nav-items\";\n\nexport type StepperNavItemsProps = {\n variant: StepperVariant;\n [\"data-testid\"]?: string;\n firstStepRef: RefObject<HTMLLIElement | null>;\n lastStepRef: RefObject<HTMLLIElement | null>;\n steps: Step[];\n currentStepIndex: number;\n handleStepChange: HandleStepChangeFunction;\n handleStepFocus: HandleStepFocusFunction;\n completedStepLabel: string;\n};\n\nexport const StepperNavItems = forwardRef<HTMLOListElement, StepperNavItemsProps>(\n (\n {\n [\"data-testid\"]: dataTestId,\n variant,\n handleStepChange,\n handleStepFocus,\n steps,\n firstStepRef,\n lastStepRef,\n currentStepIndex,\n completedStepLabel,\n },\n ref\n ) => {\n const stepListItems = steps.map((step: Step, index: number) => {\n const tooltipTriggerItem = step.disabled ? (\n <span className={cx(`${rootClassName}__tooltip-trigger-item-container`)}>\n <StepperButton\n data-testid={`${dataTestId}-disabled-sm`}\n variant={variant}\n step={step}\n indexOfLastItem={steps.length - 1}\n index={index}\n currentStepIndex={currentStepIndex}\n whenToBeVisible={VISIBILITY_STATES.SMALL_SCREEN}\n completedStepLabel={completedStepLabel}\n handleStepChange={handleStepChange}\n handleStepFocus={handleStepFocus}\n />\n </span>\n ) : null;\n\n return (\n <li\n className={cx(`${rootClassName}__list-item`, {\n [`${rootClassName}__list-item--current`]: index === currentStepIndex,\n })}\n ref={index === 0 ? firstStepRef : index === steps.length - 1 ? lastStepRef : null}\n key={step.label}\n >\n {step.disabled ? (\n <>\n <Tooltip\n contentClassName={cx(`${rootClassName}__tooltip-content`)}\n triggerElement={tooltipTriggerItem}\n >\n {step.label}\n </Tooltip>\n <StepperButton\n data-testid={`${dataTestId}-disabled-lg`}\n variant={variant}\n step={step}\n indexOfLastItem={steps.length - 1}\n index={index}\n currentStepIndex={currentStepIndex}\n whenToBeVisible={VISIBILITY_STATES.LARGE_SCREEN}\n completedStepLabel={completedStepLabel}\n handleStepChange={handleStepChange}\n handleStepFocus={handleStepFocus}\n />\n </>\n ) : (\n <StepperButton\n data-testid={dataTestId}\n variant={variant}\n step={step}\n indexOfLastItem={steps.length - 1}\n index={index}\n currentStepIndex={currentStepIndex}\n whenToBeVisible={VISIBILITY_STATES.ALWAYS}\n completedStepLabel={completedStepLabel}\n handleStepChange={handleStepChange}\n handleStepFocus={handleStepFocus}\n />\n )}\n </li>\n );\n });\n return (\n <RovingFocusGroup.Root loop={false} dir=\"ltr\">\n <ol ref={ref} className={cx(`${rootClassName}__list`)}>\n {stepListItems}\n </ol>\n </RovingFocusGroup.Root>\n );\n }\n);\n","import { type RefObject, useEffect, useRef } from \"react\";\n\ninterface UseContentFocusHook<T extends HTMLElement> {\n contentRef: RefObject<T | null>;\n}\n\nexport const useContentFocus = <T extends HTMLElement>(\n currentStepIndex: number\n): UseContentFocusHook<T> => {\n const firstLoad = useRef<boolean>(true);\n const contentRef = useRef<T | null>(null);\n\n useEffect(() => {\n if (!firstLoad.current && contentRef.current !== null) {\n contentRef.current.focus();\n }\n firstLoad.current = false;\n }, [currentStepIndex]);\n\n return {\n contentRef,\n };\n};\n","import { type RefObject, useEffect, useRef, useState } from \"react\";\n\nexport const SCROLL_DIRECTION = {\n LEFT: \"left\",\n RIGHT: \"right\",\n} as const;\n\nexport type ScrollDirection = (typeof SCROLL_DIRECTION)[keyof typeof SCROLL_DIRECTION];\n\nexport type UseScrollHook<ContainerElement, WatchedElement> = {\n scrollContainer: RefObject<ContainerElement | null>;\n firstStepRef: RefObject<WatchedElement | null>;\n lastStepRef: RefObject<WatchedElement | null>;\n displayLeftScrollButton: boolean;\n displayRightScrollButton: boolean;\n handleHorizontalScroll: (dir: ScrollDirection) => void;\n};\n\nexport const useScrollButtons = <\n ContainerElement extends HTMLElement,\n WatchedElement extends HTMLElement\n>(): UseScrollHook<ContainerElement, WatchedElement> => {\n const scrollContainer = useRef<ContainerElement | null>(null);\n const firstStepRef = useRef<WatchedElement | null>(null);\n const lastStepRef = useRef<WatchedElement | null>(null);\n const [displayLeftScrollButton, setDisplayLeftScrollButton] = useState(false);\n const [displayRightScrollButton, setDisplayRightScrollButton] = useState(false);\n\n const handleHorizontalScroll = (dir: ScrollDirection): void => {\n if (!scrollContainer.current) {\n return;\n }\n const scrollableContainer = scrollContainer.current;\n const scrollableContainerWidth = scrollableContainer.clientWidth;\n const currentScrollLeft = scrollableContainer.scrollLeft;\n if (dir === SCROLL_DIRECTION.LEFT) {\n scrollableContainer.scroll({\n behavior: \"smooth\",\n left: currentScrollLeft - scrollableContainerWidth / 2,\n });\n }\n if (dir === SCROLL_DIRECTION.RIGHT) {\n scrollableContainer.scroll({\n behavior: \"smooth\",\n left: currentScrollLeft + scrollableContainerWidth / 2,\n });\n }\n };\n\n useEffect(() => {\n if (firstStepRef.current && lastStepRef.current && scrollContainer.current) {\n const observer: IntersectionObserver = new IntersectionObserver(\n (entries: IntersectionObserverEntry[]) => {\n for (const entry of entries) {\n if (entry.target === firstStepRef.current) {\n if (entry.isIntersecting) {\n setDisplayLeftScrollButton(false);\n } else {\n setDisplayLeftScrollButton(true);\n }\n continue;\n }\n if (entry.target === lastStepRef.current) {\n if (entry.isIntersecting) {\n setDisplayRightScrollButton(false);\n } else {\n setDisplayRightScrollButton(true);\n }\n }\n }\n },\n {\n root: scrollContainer.current,\n threshold: 0.95,\n }\n );\n\n observer.observe(firstStepRef.current);\n observer.observe(lastStepRef.current);\n\n return () => observer.disconnect();\n }\n return undefined;\n }, [firstStepRef, lastStepRef, scrollContainer]);\n\n return {\n scrollContainer,\n firstStepRef,\n lastStepRef,\n displayLeftScrollButton,\n displayRightScrollButton,\n handleHorizontalScroll,\n };\n};\n","import React, { Children, type ReactElement } from \"react\";\nimport { Button, BUTTON_VARIANT } from \"@purpur/button\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { IconChevronLeft } from \"@purpur/icon/chevron-left\";\nimport { IconChevronRight } from \"@purpur/icon/chevron-right\";\nimport * as RovingFocusGroup from \"@radix-ui/react-roving-focus\";\nimport * as ScrollArea from \"@radix-ui/react-scroll-area\";\nimport c from \"classnames/bind\";\n\nimport { STEPPER_VARIANT } from \"./constants\";\nimport styles from \"./stepper.module.scss\";\nimport { StepperContainer } from \"./stepper-container\";\nimport { isStepperContent, StepperContent } from \"./stepper-content\";\nimport { StepperNavItems } from \"./stepper-nav-items\";\nimport { type Step, type StepChangeFunction, type StepperVariant } from \"./types\";\nimport { useContentFocus } from \"./use-content-focus.hook\";\nimport { SCROLL_DIRECTION, useScrollButtons } from \"./use-scroll-buttons.hook\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-stepper\";\n\nexport type StepperProps = Omit<BaseProps, \"children\"> & {\n children: Array<ReactElement<typeof StepperContent>> | ReactElement<typeof StepperContent>;\n completedStepLabel: string;\n currentStepIndex: number;\n onStepChange: StepChangeFunction;\n alignWithGrid?: boolean;\n leftScrollButtonAriaLabel: string;\n rightScrollButtonAriaLabel: string;\n variant: StepperVariant;\n};\n\nexport type StepperComponent<P> = React.FunctionComponent<P> & {\n Content: typeof StepperContent;\n};\n\nexport const Stepper: StepperComponent<StepperProps> = ({\n [\"aria-label\"]: ariaLabel,\n [\"data-testid\"]: dataTestId,\n children,\n className,\n completedStepLabel,\n currentStepIndex = 0,\n onStepChange,\n alignWithGrid = false,\n leftScrollButtonAriaLabel,\n rightScrollButtonAriaLabel,\n variant = STEPPER_VARIANT.PRIMARY,\n ...props\n}: StepperProps) => {\n const stepperContentChildren = Children.toArray(children).filter(isStepperContent);\n const steps: Step[] = Children.map(stepperContentChildren, (child) => {\n const { disabled, finished, label } = child.props;\n return {\n disabled: disabled ?? false,\n finished: finished ?? false,\n label,\n };\n });\n const { contentRef } = useContentFocus<HTMLDivElement>(currentStepIndex);\n const {\n scrollContainer,\n firstStepRef,\n lastStepRef,\n displayLeftScrollButton,\n displayRightScrollButton,\n handleHorizontalScroll,\n } = useScrollButtons<HTMLDivElement, HTMLLIElement>();\n\n const classes: string = cx([\n className,\n rootClassName,\n {\n [`${rootClassName}--${variant}`]: variant,\n },\n ]);\n const scrollTriggerIntoView = (e: React.FocusEvent | React.MouseEvent): void => {\n (e.target as HTMLButtonElement).scrollIntoView({\n behavior: \"smooth\",\n block: \"nearest\",\n inline: \"center\",\n });\n };\n\n const handleStepChange = (e: React.MouseEvent, idx: number): void => {\n e.preventDefault();\n scrollTriggerIntoView(e);\n onStepChange(idx);\n };\n\n const handleStepFocus = (e: React.FocusEvent): void => {\n scrollTriggerIntoView(e);\n };\n\n return (\n <div className={classes} {...props}>\n <StepperContainer variant={variant} alignWithGrid={alignWithGrid}>\n <div className={cx(`${rootClassName}__nav-container`)}>\n <ScrollArea.Root>\n <ScrollArea.Viewport ref={scrollContainer}>\n <div\n aria-label={ariaLabel}\n data-testid={dataTestId}\n className={cx([\n `${rootClassName}__nav`,\n {\n [`${rootClassName}__nav--${variant}`]: variant,\n },\n ])}\n >\n <RovingFocusGroup.Root loop={false} dir=\"ltr\">\n <StepperNavItems\n data-testid={dataTestId}\n variant={variant}\n firstStepRef={firstStepRef}\n lastStepRef={lastStepRef}\n steps={steps}\n currentStepIndex={currentStepIndex}\n handleStepChange={handleStepChange}\n handleStepFocus={handleStepFocus}\n completedStepLabel={completedStepLabel}\n />\n </RovingFocusGroup.Root>\n </div>\n </ScrollArea.Viewport>\n <ScrollArea.Scrollbar orientation=\"horizontal\">\n <ScrollArea.Thumb />\n </ScrollArea.Scrollbar>\n </ScrollArea.Root>\n {displayLeftScrollButton && (\n <Button\n aria-label={leftScrollButtonAriaLabel}\n className={cx([\n `${rootClassName}__scroll-button`,\n `${rootClassName}__scroll-button--left`,\n ])}\n variant={BUTTON_VARIANT.TERTIARY_PURPLE}\n tabIndex={-1}\n iconOnly\n onClick={() => {\n handleHorizontalScroll(SCROLL_DIRECTION.LEFT);\n }}\n >\n <IconChevronLeft className={cx(`${rootClassName}__scroll-button-icon`)} size=\"md\" />\n </Button>\n )}\n {displayRightScrollButton && (\n <Button\n aria-label={rightScrollButtonAriaLabel}\n className={cx([\n `${rootClassName}__scroll-button`,\n `${rootClassName}__scroll-button--right`,\n ])}\n variant={BUTTON_VARIANT.TERTIARY_PURPLE}\n tabIndex={-1}\n iconOnly\n onClick={() => {\n handleHorizontalScroll(SCROLL_DIRECTION.RIGHT);\n }}\n >\n <IconChevronRight className={cx(`${rootClassName}__scroll-button-icon`)} size=\"md\" />\n </Button>\n )}\n </div>\n </StepperContainer>\n <div\n tabIndex={-1}\n aria-labelledby={`stepper-trigger-button-${currentStepIndex}`}\n ref={contentRef}\n style={{ outline: \"none\" }}\n >\n <div aria-live=\"polite\">\n {Children.map(stepperContentChildren, (child, index: number) => (\n <div\n className={cx({\n [`${rootClassName}__hidden`]: index !== currentStepIndex,\n })}\n hidden={index !== currentStepIndex}\n >\n {child}\n </div>\n ))}\n </div>\n </div>\n </div>\n );\n};\n\nStepper.Content = StepperContent;\n\nStepper.displayName = \"Stepper\";\n"],"names":["STEPPER_VARIANT","VISIBILITY_STATES","cx","c","styles","rootClassName","StepperContainer","dataTestId","children","className","alignWithGrid","variant","props","classes","jsx","StepperContent","forwardRef","ref","finished","rest","isStepperContent","child","isValidElement","StepNumber","current","disabled","stepNumber","StepperButton","step","indexOfLastItem","index","currentStepIndex","whenToBeVisible","handleStepChange","handleStepFocus","completedStepLabel","placement","isCurrentStep","RovingFocusGroup.Item","Button","BUTTON_VARIANT","e","IconCheckmark","StepperNavItems","steps","firstStepRef","lastStepRef","stepListItems","tooltipTriggerItem","jsxs","Fragment","Tooltip","RovingFocusGroup.Root","useContentFocus","firstLoad","useRef","contentRef","useEffect","SCROLL_DIRECTION","useScrollButtons","scrollContainer","displayLeftScrollButton","setDisplayLeftScrollButton","useState","displayRightScrollButton","setDisplayRightScrollButton","handleHorizontalScroll","dir","scrollableContainer","scrollableContainerWidth","currentScrollLeft","observer","entries","entry","Stepper","ariaLabel","onStepChange","leftScrollButtonAriaLabel","rightScrollButtonAriaLabel","stepperContentChildren","Children","label","scrollTriggerIntoView","idx","ScrollArea.Root","ScrollArea.Viewport","ScrollArea.Scrollbar","ScrollArea.Thumb","IconChevronLeft","IconChevronRight"],"mappings":"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"}
|
package/dist/stepper.cjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./stepper-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./stepper-DYjJgEHL.js");exports.Stepper=e.Stepper;
|
|
2
2
|
//# sourceMappingURL=stepper.cjs.js.map
|
package/dist/stepper.es.js
CHANGED