boreal-ui 0.0.47 → 0.0.48
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/core/{Card-CbGHr_tX.js → Card-BzpcEKgi.js} +52 -7
- package/dist/core/Card-BzpcEKgi.js.map +1 -0
- package/dist/core/{Card-De2epy0R.cjs → Card-D6SI33n_.cjs} +52 -7
- package/dist/core/Card-D6SI33n_.cjs.map +1 -0
- package/dist/core/Card.cjs.js +1 -1
- package/dist/core/Card.js +1 -1
- package/dist/core/boreal-ui.css +897 -0
- package/dist/core/index.cjs.js +1 -1
- package/dist/core/index.js +1 -1
- package/dist/next/{Accordion-CFb5G7Ql.js → Accordion-CrUmV-HM.js} +50 -50
- package/dist/next/{Accordion-CFb5G7Ql.js.map → Accordion-CrUmV-HM.js.map} +1 -1
- package/dist/next/{Accordion-BvcUpiD3.cjs → Accordion-ugkSb5dI.cjs} +50 -50
- package/dist/next/{Accordion-BvcUpiD3.cjs.map → Accordion-ugkSb5dI.cjs.map} +1 -1
- package/dist/next/Accordion.cjs.js +1 -1
- package/dist/next/Accordion.js +1 -1
- package/dist/next/{Breadcrumbs-D5wEf2-N.cjs → Breadcrumbs-CrKRsQf3.cjs} +2 -2
- package/dist/next/{Breadcrumbs-D5wEf2-N.cjs.map → Breadcrumbs-CrKRsQf3.cjs.map} +1 -1
- package/dist/next/{Breadcrumbs-DZpS-GOj.js → Breadcrumbs-ZK64MIGd.js} +2 -2
- package/dist/next/{Breadcrumbs-DZpS-GOj.js.map → Breadcrumbs-ZK64MIGd.js.map} +1 -1
- package/dist/next/Breadcrumbs.cjs.js +1 -1
- package/dist/next/Breadcrumbs.js +1 -1
- package/dist/next/{Button-Cyq8lKKp.cjs → Button-BI0LErYM.cjs} +46 -46
- package/dist/next/{Button-Cyq8lKKp.cjs.map → Button-BI0LErYM.cjs.map} +1 -1
- package/dist/next/{Button-CQUqfv7B.js → Button-qs4m4zx0.js} +46 -46
- package/dist/next/{Button-CQUqfv7B.js.map → Button-qs4m4zx0.js.map} +1 -1
- package/dist/next/Button.cjs.js +1 -1
- package/dist/next/Button.js +1 -1
- package/dist/next/{Card-D2vuSJt0.cjs → Card-09MMj3o2.cjs} +114 -69
- package/dist/next/Card-09MMj3o2.cjs.map +1 -0
- package/dist/next/{Card-CtUR7xR3.js → Card-Btw1d4gS.js} +114 -69
- package/dist/next/Card-Btw1d4gS.js.map +1 -0
- package/dist/next/Card.cjs.js +1 -1
- package/dist/next/Card.js +1 -1
- package/dist/next/CheckBox.cjs.js +1 -1
- package/dist/next/CheckBox.js +1 -1
- package/dist/next/{Checkbox-dANi8BjQ.js → Checkbox-DBidsakA.js} +44 -44
- package/dist/next/{Checkbox-dANi8BjQ.js.map → Checkbox-DBidsakA.js.map} +1 -1
- package/dist/next/{Checkbox-SXo9UmNY.cjs → Checkbox-hA321207.cjs} +44 -44
- package/dist/next/{Checkbox-SXo9UmNY.cjs.map → Checkbox-hA321207.cjs.map} +1 -1
- package/dist/next/{Chip-BYWlOMgj.cjs → Chip-BWTBVAIE.cjs} +50 -50
- package/dist/next/{Chip-BYWlOMgj.cjs.map → Chip-BWTBVAIE.cjs.map} +1 -1
- package/dist/next/{Chip-B3bTVcNN.js → Chip-D2mvW5L7.js} +50 -50
- package/dist/next/{Chip-B3bTVcNN.js.map → Chip-D2mvW5L7.js.map} +1 -1
- package/dist/next/Chip.cjs.js +1 -1
- package/dist/next/Chip.js +1 -1
- package/dist/next/{CircularProgress-6fmyMX4y.cjs → CircularProgress-BegWxawm.cjs} +37 -37
- package/dist/next/{CircularProgress-6fmyMX4y.cjs.map → CircularProgress-BegWxawm.cjs.map} +1 -1
- package/dist/next/{CircularProgress-CdvDDYyr.js → CircularProgress-wBHZUhul.js} +37 -37
- package/dist/next/{CircularProgress-CdvDDYyr.js.map → CircularProgress-wBHZUhul.js.map} +1 -1
- package/dist/next/CircularProgress.cjs.js +1 -1
- package/dist/next/CircularProgress.js +1 -1
- package/dist/next/{ColorPicker-DhQJXU30.js → ColorPicker-Dd9iz-i8.js} +38 -38
- package/dist/next/{ColorPicker-DhQJXU30.js.map → ColorPicker-Dd9iz-i8.js.map} +1 -1
- package/dist/next/{ColorPicker-DUYMHTpF.cjs → ColorPicker-Tla92spe.cjs} +38 -38
- package/dist/next/{ColorPicker-DUYMHTpF.cjs.map → ColorPicker-Tla92spe.cjs.map} +1 -1
- package/dist/next/ColorPicker.cjs.js +1 -1
- package/dist/next/ColorPicker.js +1 -1
- package/dist/next/{CommandPalette-GmgyP8kF.cjs → CommandPalette-BO6R9zQs.cjs} +41 -41
- package/dist/next/{CommandPalette-GmgyP8kF.cjs.map → CommandPalette-BO6R9zQs.cjs.map} +1 -1
- package/dist/next/{CommandPalette-Bzqc18YQ.js → CommandPalette-CN0BiN0R.js} +41 -41
- package/dist/next/{CommandPalette-Bzqc18YQ.js.map → CommandPalette-CN0BiN0R.js.map} +1 -1
- package/dist/next/CommandPalette.cjs.js +1 -1
- package/dist/next/CommandPalette.js +1 -1
- package/dist/next/{DataTable-Cy3GLZ1j.cjs → DataTable-CUJXAkHe.cjs} +40 -40
- package/dist/next/{DataTable-Cy3GLZ1j.cjs.map → DataTable-CUJXAkHe.cjs.map} +1 -1
- package/dist/next/{DataTable-BoXblTGY.js → DataTable-mMStogSP.js} +40 -40
- package/dist/next/{DataTable-BoXblTGY.js.map → DataTable-mMStogSP.js.map} +1 -1
- package/dist/next/DataTable.cjs.js +1 -1
- package/dist/next/DataTable.js +1 -1
- package/dist/next/{DateTimePicker-i4QztkDP.js → DateTimePicker-CphfYmZ8.js} +46 -46
- package/dist/next/{DateTimePicker-i4QztkDP.js.map → DateTimePicker-CphfYmZ8.js.map} +1 -1
- package/dist/next/{DateTimePicker-DYXQLrAL.cjs → DateTimePicker-DwS2xQNw.cjs} +46 -46
- package/dist/next/{DateTimePicker-DYXQLrAL.cjs.map → DateTimePicker-DwS2xQNw.cjs.map} +1 -1
- package/dist/next/DateTimePicker.cjs.js +1 -1
- package/dist/next/DateTimePicker.js +1 -1
- package/dist/next/{Divider-BAAb-2rY.cjs → Divider-cx8e80sS.cjs} +28 -28
- package/dist/next/{Divider-BAAb-2rY.cjs.map → Divider-cx8e80sS.cjs.map} +1 -1
- package/dist/next/{Divider-O6G6kig_.js → Divider-kiaQzYbi.js} +28 -28
- package/dist/next/{Divider-O6G6kig_.js.map → Divider-kiaQzYbi.js.map} +1 -1
- package/dist/next/Divider.cjs.js +1 -1
- package/dist/next/Divider.js +1 -1
- package/dist/next/{EmptyState-CU6_e2Yr.cjs → EmptyState-Bb90F-ej.cjs} +2 -2
- package/dist/next/{EmptyState-CU6_e2Yr.cjs.map → EmptyState-Bb90F-ej.cjs.map} +1 -1
- package/dist/next/{EmptyState-Cbj1OIeQ.js → EmptyState-Brd4N36F.js} +2 -2
- package/dist/next/{EmptyState-Cbj1OIeQ.js.map → EmptyState-Brd4N36F.js.map} +1 -1
- package/dist/next/EmptyState.cjs.js +1 -1
- package/dist/next/EmptyState.js +1 -1
- package/dist/next/{FileUpload-CNxWsESt.js → FileUpload-BMMpH1El.js} +51 -51
- package/dist/next/{FileUpload-CNxWsESt.js.map → FileUpload-BMMpH1El.js.map} +1 -1
- package/dist/next/{FileUpload-D43mGC5b.cjs → FileUpload-Drm5_xEx.cjs} +51 -51
- package/dist/next/{FileUpload-D43mGC5b.cjs.map → FileUpload-Drm5_xEx.cjs.map} +1 -1
- package/dist/next/FileUpload.cjs.js +1 -1
- package/dist/next/FileUpload.js +1 -1
- package/dist/next/{Footer-CJ19dLJ4.js → Footer-B6_LG958.js} +40 -40
- package/dist/next/{Footer-CJ19dLJ4.js.map → Footer-B6_LG958.js.map} +1 -1
- package/dist/next/{Footer-haPH23Rz.cjs → Footer-EF2-ryvY.cjs} +40 -40
- package/dist/next/{Footer-haPH23Rz.cjs.map → Footer-EF2-ryvY.cjs.map} +1 -1
- package/dist/next/Footer.cjs.js +1 -1
- package/dist/next/Footer.js +1 -1
- package/dist/next/{FormGroup-mHF2j4h8.cjs → FormGroup-Bg2QlTu7.cjs} +30 -30
- package/dist/next/{FormGroup-mHF2j4h8.cjs.map → FormGroup-Bg2QlTu7.cjs.map} +1 -1
- package/dist/next/{FormGroup-B_b5tAwN.js → FormGroup-DmQChKxA.js} +30 -30
- package/dist/next/{FormGroup-B_b5tAwN.js.map → FormGroup-DmQChKxA.js.map} +1 -1
- package/dist/next/FormGroup.cjs.js +1 -1
- package/dist/next/FormGroup.js +1 -1
- package/dist/next/MessagePopUp.cjs.js +1 -1
- package/dist/next/MessagePopUp.js +1 -1
- package/dist/next/{MessagePopup-C08ktRPS.cjs → MessagePopup-DsquzWSn.cjs} +2 -2
- package/dist/next/{MessagePopup-C08ktRPS.cjs.map → MessagePopup-DsquzWSn.cjs.map} +1 -1
- package/dist/next/{MessagePopup-BHMymhHd.js → MessagePopup-WUBGyJ_F.js} +2 -2
- package/dist/next/{MessagePopup-BHMymhHd.js.map → MessagePopup-WUBGyJ_F.js.map} +1 -1
- package/dist/next/{MetricBox-Cc5g8SBy.js → MetricBox-C5KGkv7l.js} +47 -47
- package/dist/next/{MetricBox-Cc5g8SBy.js.map → MetricBox-C5KGkv7l.js.map} +1 -1
- package/dist/next/{MetricBox-BDC6UsP1.cjs → MetricBox-D8eBxQ59.cjs} +47 -47
- package/dist/next/{MetricBox-BDC6UsP1.cjs.map → MetricBox-D8eBxQ59.cjs.map} +1 -1
- package/dist/next/MetricBox.cjs.js +1 -1
- package/dist/next/MetricBox.js +1 -1
- package/dist/next/{NavBar-BZPUPeLz.js → NavBar-CmvgkEZt.js} +37 -37
- package/dist/next/{NavBar-BZPUPeLz.js.map → NavBar-CmvgkEZt.js.map} +1 -1
- package/dist/next/{NavBar-DYUpzh7o.cjs → NavBar-DVEf0iJH.cjs} +37 -37
- package/dist/next/{NavBar-DYUpzh7o.cjs.map → NavBar-DVEf0iJH.cjs.map} +1 -1
- package/dist/next/NavBar.cjs.js +1 -1
- package/dist/next/NavBar.js +1 -1
- package/dist/next/{NotificationCenter-ClijzbwL.cjs → NotificationCenter-CtL6rozQ.cjs} +42 -42
- package/dist/next/{NotificationCenter-ClijzbwL.cjs.map → NotificationCenter-CtL6rozQ.cjs.map} +1 -1
- package/dist/next/{NotificationCenter-C00Gj6Xv.js → NotificationCenter-CtM10CVj.js} +42 -42
- package/dist/next/{NotificationCenter-C00Gj6Xv.js.map → NotificationCenter-CtM10CVj.js.map} +1 -1
- package/dist/next/NotificationCenter.cjs.js +1 -1
- package/dist/next/NotificationCenter.js +1 -1
- package/dist/next/{Pager-C1rpRIOe.cjs → Pager-Bxxewb8I.cjs} +2 -2
- package/dist/next/{Pager-C1rpRIOe.cjs.map → Pager-Bxxewb8I.cjs.map} +1 -1
- package/dist/next/{Pager-DzEFxEIM.js → Pager-D0Mw7o7v.js} +2 -2
- package/dist/next/{Pager-DzEFxEIM.js.map → Pager-D0Mw7o7v.js.map} +1 -1
- package/dist/next/Pager.cjs.js +1 -1
- package/dist/next/Pager.js +1 -1
- package/dist/next/{PopOver-J5eO0UOr.cjs → PopOver-gQfgHe9e.cjs} +40 -40
- package/dist/next/{PopOver-J5eO0UOr.cjs.map → PopOver-gQfgHe9e.cjs.map} +1 -1
- package/dist/next/{PopOver-DFjt5BfD.js → PopOver-qSTx5y8g.js} +40 -40
- package/dist/next/{PopOver-DFjt5BfD.js.map → PopOver-qSTx5y8g.js.map} +1 -1
- package/dist/next/PopOver.cjs.js +1 -1
- package/dist/next/PopOver.js +1 -1
- package/dist/next/{ProgressBar-lOd0cGdF.cjs → ProgressBar-BMuv0kis.cjs} +42 -42
- package/dist/next/{ProgressBar-lOd0cGdF.cjs.map → ProgressBar-BMuv0kis.cjs.map} +1 -1
- package/dist/next/{ProgressBar-hpSJQWrn.js → ProgressBar-DuaWQouO.js} +42 -42
- package/dist/next/{ProgressBar-hpSJQWrn.js.map → ProgressBar-DuaWQouO.js.map} +1 -1
- package/dist/next/ProgressBar.cjs.js +1 -1
- package/dist/next/ProgressBar.js +1 -1
- package/dist/next/{RadioButton-UlG9lzwh.js → RadioButton-CEvIACkL.js} +38 -38
- package/dist/next/{RadioButton-UlG9lzwh.js.map → RadioButton-CEvIACkL.js.map} +1 -1
- package/dist/next/{RadioButton-DkeBXAsO.cjs → RadioButton-D6oyNmVU.cjs} +38 -38
- package/dist/next/{RadioButton-DkeBXAsO.cjs.map → RadioButton-D6oyNmVU.cjs.map} +1 -1
- package/dist/next/RadioButton.cjs.js +1 -1
- package/dist/next/RadioButton.js +1 -1
- package/dist/next/{Rating-BuPujSZA.cjs → Rating-BbqxsFU9.cjs} +34 -34
- package/dist/next/{Rating-BuPujSZA.cjs.map → Rating-BbqxsFU9.cjs.map} +1 -1
- package/dist/next/{Rating-BhZSzD7o.js → Rating-umLbRaAb.js} +34 -34
- package/dist/next/{Rating-BhZSzD7o.js.map → Rating-umLbRaAb.js.map} +1 -1
- package/dist/next/Rating.cjs.js +1 -1
- package/dist/next/Rating.js +1 -1
- package/dist/next/{Skeleton-Cp1BE2Ac.cjs → Skeleton-C6wW8eyR.cjs} +26 -26
- package/dist/next/{Skeleton-Cp1BE2Ac.cjs.map → Skeleton-C6wW8eyR.cjs.map} +1 -1
- package/dist/next/{Skeleton-KKJc191y.js → Skeleton-DC4LJ059.js} +26 -26
- package/dist/next/{Skeleton-KKJc191y.js.map → Skeleton-DC4LJ059.js.map} +1 -1
- package/dist/next/Skeleton.cjs.js +1 -1
- package/dist/next/Skeleton.js +1 -1
- package/dist/next/{Slider-BK-N-zXi.cjs → Slider-g41Qvh6s.cjs} +43 -43
- package/dist/next/{Slider-BK-N-zXi.cjs.map → Slider-g41Qvh6s.cjs.map} +1 -1
- package/dist/next/{Slider-BvcM4-MS.js → Slider-wAbg8hOH.js} +43 -43
- package/dist/next/{Slider-BvcM4-MS.js.map → Slider-wAbg8hOH.js.map} +1 -1
- package/dist/next/Slider.cjs.js +1 -1
- package/dist/next/Slider.js +1 -1
- package/dist/next/{Spinner-Dh8iu4p8.js → Spinner-D3OQ29U9.js} +37 -37
- package/dist/next/{Spinner-Dh8iu4p8.js.map → Spinner-D3OQ29U9.js.map} +1 -1
- package/dist/next/{Spinner-DqTR9rvk.cjs → Spinner-Y53Z6fwK.cjs} +37 -37
- package/dist/next/{Spinner-DqTR9rvk.cjs.map → Spinner-Y53Z6fwK.cjs.map} +1 -1
- package/dist/next/Spinner.cjs.js +1 -1
- package/dist/next/Spinner.js +1 -1
- package/dist/next/{Stepper-nRipbdpR.js → Stepper-BvA_ZAho.js} +39 -39
- package/dist/next/{Stepper-nRipbdpR.js.map → Stepper-BvA_ZAho.js.map} +1 -1
- package/dist/next/{Stepper-RjdxxcS6.cjs → Stepper-D6X70Sr6.cjs} +39 -39
- package/dist/next/{Stepper-RjdxxcS6.cjs.map → Stepper-D6X70Sr6.cjs.map} +1 -1
- package/dist/next/Stepper.cjs.js +1 -1
- package/dist/next/Stepper.js +1 -1
- package/dist/next/{Tabs-D90stLbD.js → Tabs-Bur4oYVF.js} +44 -44
- package/dist/next/{Tabs-D90stLbD.js.map → Tabs-Bur4oYVF.js.map} +1 -1
- package/dist/next/{Tabs-BgKvtbgg.cjs → Tabs-D-5VRbfh.cjs} +44 -44
- package/dist/next/{Tabs-BgKvtbgg.cjs.map → Tabs-D-5VRbfh.cjs.map} +1 -1
- package/dist/next/Tabs.cjs.js +1 -1
- package/dist/next/Tabs.js +1 -1
- package/dist/next/{TagInput-I9GEOn4z.js → TagInput-DKzxPiwU.js} +46 -46
- package/dist/next/{TagInput-I9GEOn4z.js.map → TagInput-DKzxPiwU.js.map} +1 -1
- package/dist/next/{TagInput-C7ohFpQN.cjs → TagInput-DfNJiPKh.cjs} +46 -46
- package/dist/next/{TagInput-C7ohFpQN.cjs.map → TagInput-DfNJiPKh.cjs.map} +1 -1
- package/dist/next/TagInput.cjs.js +1 -1
- package/dist/next/TagInput.js +1 -1
- package/dist/next/{Toolbar-B043HxPz.cjs → Toolbar-PwnuYGDR.cjs} +34 -34
- package/dist/next/{Toolbar-B043HxPz.cjs.map → Toolbar-PwnuYGDR.cjs.map} +1 -1
- package/dist/next/{Toolbar-DJ2eWNqF.js → Toolbar-wbusnAUV.js} +34 -34
- package/dist/next/{Toolbar-DJ2eWNqF.js.map → Toolbar-wbusnAUV.js.map} +1 -1
- package/dist/next/Toolbar.cjs.js +1 -1
- package/dist/next/Toolbar.js +1 -1
- package/dist/next/{Tooltip-BAv_JHBJ.cjs → Tooltip-DPFnMhUd.cjs} +39 -39
- package/dist/next/{Tooltip-BAv_JHBJ.cjs.map → Tooltip-DPFnMhUd.cjs.map} +1 -1
- package/dist/next/{Tooltip-BCtlhs_A.js → Tooltip-_GVlUXAq.js} +39 -39
- package/dist/next/{Tooltip-BCtlhs_A.js.map → Tooltip-_GVlUXAq.js.map} +1 -1
- package/dist/next/Tooltip.cjs.js +1 -1
- package/dist/next/Tooltip.js +1 -1
- package/dist/next/boreal-ui.css +3123 -2410
- package/dist/next/index.cjs.js +56 -56
- package/dist/next/index.js +56 -56
- package/dist/tsconfig.build.tsbuildinfo +1 -1
- package/dist/types/components/Card/Card.types.d.ts +2 -1
- package/dist/types/components/Card/Card.types.d.ts.map +1 -1
- package/dist/types/components/Card/CardBase.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/core/Card-CbGHr_tX.js.map +0 -1
- package/dist/core/Card-De2epy0R.cjs.map +0 -1
- package/dist/next/Card-CtUR7xR3.js.map +0 -1
- package/dist/next/Card-D2vuSJt0.cjs.map +0 -1
|
@@ -4,37 +4,37 @@ const classNames = require("./classNames-BcWMx052.cjs");
|
|
|
4
4
|
const borealStyleConfig = require("./boreal-style-config-Rr5d5Qts.cjs");
|
|
5
5
|
;/* empty css */
|
|
6
6
|
const IconButton = require("./IconButton-2l-_HOMB.cjs");
|
|
7
|
-
const noScroll = "
|
|
8
|
-
const errorMessage = "
|
|
9
|
-
const loadingContainer = "
|
|
10
|
-
const hideScrollbar = "
|
|
11
|
-
const sr_only = "
|
|
12
|
-
const stepper = "
|
|
13
|
-
const xs = "
|
|
14
|
-
const small = "
|
|
15
|
-
const medium = "
|
|
16
|
-
const large = "
|
|
17
|
-
const xl = "
|
|
18
|
-
const vertical = "
|
|
19
|
-
const connector = "
|
|
20
|
-
const clickable = "
|
|
21
|
-
const disabled = "
|
|
22
|
-
const stepButton = "
|
|
23
|
-
const icon = "
|
|
24
|
-
const label = "
|
|
25
|
-
const step = "
|
|
26
|
-
const active = "
|
|
27
|
-
const completed = "
|
|
28
|
-
const primary = "
|
|
29
|
-
const secondary = "
|
|
30
|
-
const tertiary = "
|
|
31
|
-
const quaternary = "
|
|
32
|
-
const clear = "
|
|
33
|
-
const success = "
|
|
34
|
-
const error = "
|
|
35
|
-
const warning = "
|
|
36
|
-
const spin = "
|
|
37
|
-
const pulse = "
|
|
7
|
+
const noScroll = "_noScroll_l3ckd_108";
|
|
8
|
+
const errorMessage = "_errorMessage_l3ckd_109";
|
|
9
|
+
const loadingContainer = "_loadingContainer_l3ckd_110";
|
|
10
|
+
const hideScrollbar = "_hideScrollbar_l3ckd_102";
|
|
11
|
+
const sr_only = "_sr_only_l3ckd_111";
|
|
12
|
+
const stepper = "_stepper_l3ckd_552";
|
|
13
|
+
const xs = "_xs_l3ckd_571";
|
|
14
|
+
const small = "_small_l3ckd_574";
|
|
15
|
+
const medium = "_medium_l3ckd_577";
|
|
16
|
+
const large = "_large_l3ckd_580";
|
|
17
|
+
const xl = "_xl_l3ckd_583";
|
|
18
|
+
const vertical = "_vertical_l3ckd_586";
|
|
19
|
+
const connector = "_connector_l3ckd_592";
|
|
20
|
+
const clickable = "_clickable_l3ckd_608";
|
|
21
|
+
const disabled = "_disabled_l3ckd_611";
|
|
22
|
+
const stepButton = "_stepButton_l3ckd_611";
|
|
23
|
+
const icon = "_icon_l3ckd_624";
|
|
24
|
+
const label = "_label_l3ckd_630";
|
|
25
|
+
const step = "_step_l3ckd_552";
|
|
26
|
+
const active = "_active_l3ckd_675";
|
|
27
|
+
const completed = "_completed_l3ckd_679";
|
|
28
|
+
const primary = "_primary_l3ckd_687";
|
|
29
|
+
const secondary = "_secondary_l3ckd_690";
|
|
30
|
+
const tertiary = "_tertiary_l3ckd_693";
|
|
31
|
+
const quaternary = "_quaternary_l3ckd_696";
|
|
32
|
+
const clear = "_clear_l3ckd_699";
|
|
33
|
+
const success = "_success_l3ckd_702";
|
|
34
|
+
const error = "_error_l3ckd_109";
|
|
35
|
+
const warning = "_warning_l3ckd_708";
|
|
36
|
+
const spin = "_spin_l3ckd_1";
|
|
37
|
+
const pulse = "_pulse_l3ckd_1";
|
|
38
38
|
const styles = {
|
|
39
39
|
noScroll,
|
|
40
40
|
errorMessage,
|
|
@@ -65,15 +65,15 @@ const styles = {
|
|
|
65
65
|
success,
|
|
66
66
|
error,
|
|
67
67
|
warning,
|
|
68
|
-
"fade-in": "_fade-
|
|
69
|
-
"slide-up": "_slide-
|
|
70
|
-
"spin-3d": "_spin-
|
|
68
|
+
"fade-in": "_fade-in_l3ckd_1",
|
|
69
|
+
"slide-up": "_slide-up_l3ckd_1",
|
|
70
|
+
"spin-3d": "_spin-3d_l3ckd_1",
|
|
71
71
|
spin,
|
|
72
72
|
pulse,
|
|
73
|
-
"fade-in-up": "_fade-in-
|
|
74
|
-
"progress-grow": "_progress-
|
|
75
|
-
"indeterminate-move": "_indeterminate-
|
|
76
|
-
"skeleton-loading": "_skeleton-
|
|
73
|
+
"fade-in-up": "_fade-in-up_l3ckd_1",
|
|
74
|
+
"progress-grow": "_progress-grow_l3ckd_1",
|
|
75
|
+
"indeterminate-move": "_indeterminate-move_l3ckd_1",
|
|
76
|
+
"skeleton-loading": "_skeleton-loading_l3ckd_1"
|
|
77
77
|
};
|
|
78
78
|
const StepperBase = ({
|
|
79
79
|
steps,
|
|
@@ -182,4 +182,4 @@ StepperBase.displayName = "StepperBase";
|
|
|
182
182
|
const Stepper = (props) => /* @__PURE__ */ require$$2.jsx(StepperBase, { ...props, classMap: styles, IconButtonComponent: IconButton.IconButton });
|
|
183
183
|
Stepper.displayName = "Stepper";
|
|
184
184
|
exports.Stepper = Stepper;
|
|
185
|
-
//# sourceMappingURL=Stepper-
|
|
185
|
+
//# sourceMappingURL=Stepper-D6X70Sr6.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stepper-
|
|
1
|
+
{"version":3,"file":"Stepper-D6X70Sr6.cjs","sources":["../../src/components/Stepper/StepperBase.tsx","../../src/components/Stepper/next/Stepper.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport {\r\n getDefaultRounding,\r\n getDefaultShadow,\r\n getDefaultSize,\r\n getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\nimport { StepperBaseProps } from \"./Stepper.types\";\r\n\r\nconst StepperBase: React.FC<StepperBaseProps> = ({\r\n steps,\r\n activeStep,\r\n onStepClick,\r\n disableBackNavigation = false,\r\n orientation = \"horizontal\",\r\n theme = getDefaultTheme(),\r\n state = \"\",\r\n size = getDefaultSize(),\r\n shadow = getDefaultShadow(),\r\n rounding = getDefaultRounding(),\r\n \"data-testid\": testId = \"stepper\",\r\n classMap,\r\n className,\r\n IconButtonComponent,\r\n}) => {\r\n const stepCount = steps.length;\r\n const groupLabelId = `${testId}-label`;\r\n\r\n return (\r\n <div\r\n className={combineClassNames(\r\n classMap.stepper,\r\n classMap[orientation],\r\n classMap[theme],\r\n classMap[state],\r\n classMap[size],\r\n className\r\n )}\r\n role=\"list\"\r\n aria-labelledby={groupLabelId}\r\n data-testid={testId}\r\n >\r\n <span id={groupLabelId} className=\"sr_only\">\r\n Progress Stepper\r\n </span>\r\n\r\n {steps.map((step, index) => {\r\n const Icon = step.icon || (() => <span>{index + 1}</span>);\r\n const isCompleted = index < activeStep;\r\n const isActive = index === activeStep;\r\n const isBefore = index < activeStep;\r\n const isDisabled = disableBackNavigation && isBefore;\r\n const canFocus = !!onStepClick && !isDisabled;\r\n const stepId = `${testId}-step-${index}`;\r\n const label = `Step ${index + 1} of ${stepCount}: ${step.label}`;\r\n\r\n return (\r\n <div\r\n key={index}\r\n role=\"listitem\"\r\n className={combineClassNames(\r\n classMap.step,\r\n isActive ? classMap.active : \"\",\r\n isCompleted ? classMap.completed : \"\",\r\n onStepClick ? classMap.clickable : \"\"\r\n )}\r\n data-testid={stepId}\r\n >\r\n <IconButtonComponent\r\n icon={Icon}\r\n theme={theme}\r\n state={state}\r\n className={combineClassNames(\r\n classMap.stepButton,\r\n isActive ? classMap.active : \"\",\r\n isCompleted ? classMap.completed : \"\"\r\n )}\r\n size={size}\r\n shadow={shadow}\r\n rounding={rounding}\r\n disabled={isDisabled}\r\n outline={!isActive}\r\n aria-label={label}\r\n aria-current={isActive ? \"step\" : undefined}\r\n aria-disabled={isDisabled}\r\n data-testid={`${stepId}-icon`}\r\n tabIndex={canFocus ? 0 : -1}\r\n onClick={() => onStepClick?.(index)}\r\n onKeyDown={(e: React.KeyboardEvent) => {\r\n if ((e.key === \"Enter\" || e.key === \" \") && !isDisabled) {\r\n e.preventDefault();\r\n onStepClick?.(index);\r\n }\r\n }}\r\n />\r\n\r\n <span\r\n className={classMap.stepLabel}\r\n data-testid={`${stepId}-label`}\r\n aria-hidden=\"true\"\r\n >\r\n {step.label}\r\n </span>\r\n </div>\r\n );\r\n })}\r\n </div>\r\n );\r\n};\r\n\r\nStepperBase.displayName = \"StepperBase\";\r\nexport default StepperBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Stepper.module.scss\";\r\nimport StepperBase from \"../StepperBase\";\r\nimport { StepperProps } from \"../Stepper.types\";\r\nimport { IconButton } from \"@/index.next\";\r\n\r\nconst Stepper: React.FC<StepperProps> = (props) => (\r\n <StepperBase {...props} classMap={styles} IconButtonComponent={IconButton} />\r\n);\r\nStepper.displayName = \"Stepper\";\r\nexport default Stepper;\r\n"],"names":["getDefaultTheme","getDefaultSize","getDefaultShadow","getDefaultRounding","jsxs","combineClassNames","jsx","step","label","IconButton"],"mappings":"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"}
|
package/dist/next/Stepper.cjs.js
CHANGED
package/dist/next/Stepper.js
CHANGED
|
@@ -3,42 +3,42 @@ import { useId, useState, useRef, useEffect, useMemo } from "react";
|
|
|
3
3
|
import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
|
|
4
4
|
import { c as capitalize } from "./capitalize-C0TSQSPh.js";
|
|
5
5
|
import { c as getDefaultSize, d as getDefaultTheme, a as getDefaultRounding, b as getDefaultShadow } from "./boreal-style-config-BILmxkZG.js";
|
|
6
|
-
const noScroll = "
|
|
7
|
-
const errorMessage = "
|
|
8
|
-
const loadingContainer = "
|
|
9
|
-
const hideScrollbar = "
|
|
10
|
-
const sr_only = "
|
|
11
|
-
const tabs_container = "
|
|
12
|
-
const tabs = "
|
|
13
|
-
const icon = "
|
|
14
|
-
const tab = "
|
|
15
|
-
const xs = "
|
|
16
|
-
const small = "
|
|
17
|
-
const medium = "
|
|
18
|
-
const large = "
|
|
19
|
-
const xl = "
|
|
20
|
-
const content = "
|
|
21
|
-
const primary = "
|
|
22
|
-
const active = "
|
|
23
|
-
const secondary = "
|
|
24
|
-
const tertiary = "
|
|
25
|
-
const quaternary = "
|
|
26
|
-
const clear = "
|
|
27
|
-
const success = "
|
|
28
|
-
const error = "
|
|
29
|
-
const warning = "
|
|
30
|
-
const roundNone = "
|
|
31
|
-
const roundSmall = "
|
|
32
|
-
const roundMedium = "
|
|
33
|
-
const roundLarge = "
|
|
34
|
-
const roundFull = "
|
|
35
|
-
const shadowNone = "
|
|
36
|
-
const shadowLight = "
|
|
37
|
-
const shadowMedium = "
|
|
38
|
-
const shadowStrong = "
|
|
39
|
-
const shadowIntense = "
|
|
40
|
-
const spin = "
|
|
41
|
-
const pulse = "
|
|
6
|
+
const noScroll = "_noScroll_gsvmh_108";
|
|
7
|
+
const errorMessage = "_errorMessage_gsvmh_109";
|
|
8
|
+
const loadingContainer = "_loadingContainer_gsvmh_110";
|
|
9
|
+
const hideScrollbar = "_hideScrollbar_gsvmh_102";
|
|
10
|
+
const sr_only = "_sr_only_gsvmh_111";
|
|
11
|
+
const tabs_container = "_tabs_container_gsvmh_552";
|
|
12
|
+
const tabs = "_tabs_gsvmh_552";
|
|
13
|
+
const icon = "_icon_gsvmh_575";
|
|
14
|
+
const tab = "_tab_gsvmh_552";
|
|
15
|
+
const xs = "_xs_gsvmh_632";
|
|
16
|
+
const small = "_small_gsvmh_642";
|
|
17
|
+
const medium = "_medium_gsvmh_652";
|
|
18
|
+
const large = "_large_gsvmh_662";
|
|
19
|
+
const xl = "_xl_gsvmh_672";
|
|
20
|
+
const content = "_content_gsvmh_682";
|
|
21
|
+
const primary = "_primary_gsvmh_703";
|
|
22
|
+
const active = "_active_gsvmh_703";
|
|
23
|
+
const secondary = "_secondary_gsvmh_712";
|
|
24
|
+
const tertiary = "_tertiary_gsvmh_721";
|
|
25
|
+
const quaternary = "_quaternary_gsvmh_730";
|
|
26
|
+
const clear = "_clear_gsvmh_739";
|
|
27
|
+
const success = "_success_gsvmh_748";
|
|
28
|
+
const error = "_error_gsvmh_109";
|
|
29
|
+
const warning = "_warning_gsvmh_766";
|
|
30
|
+
const roundNone = "_roundNone_gsvmh_779";
|
|
31
|
+
const roundSmall = "_roundSmall_gsvmh_789";
|
|
32
|
+
const roundMedium = "_roundMedium_gsvmh_799";
|
|
33
|
+
const roundLarge = "_roundLarge_gsvmh_809";
|
|
34
|
+
const roundFull = "_roundFull_gsvmh_819";
|
|
35
|
+
const shadowNone = "_shadowNone_gsvmh_829";
|
|
36
|
+
const shadowLight = "_shadowLight_gsvmh_833";
|
|
37
|
+
const shadowMedium = "_shadowMedium_gsvmh_837";
|
|
38
|
+
const shadowStrong = "_shadowStrong_gsvmh_841";
|
|
39
|
+
const shadowIntense = "_shadowIntense_gsvmh_845";
|
|
40
|
+
const spin = "_spin_gsvmh_1";
|
|
41
|
+
const pulse = "_pulse_gsvmh_1";
|
|
42
42
|
const styles = {
|
|
43
43
|
noScroll,
|
|
44
44
|
errorMessage,
|
|
@@ -74,15 +74,15 @@ const styles = {
|
|
|
74
74
|
shadowMedium,
|
|
75
75
|
shadowStrong,
|
|
76
76
|
shadowIntense,
|
|
77
|
-
"fade-in": "_fade-
|
|
78
|
-
"slide-up": "_slide-
|
|
79
|
-
"spin-3d": "_spin-
|
|
77
|
+
"fade-in": "_fade-in_gsvmh_1",
|
|
78
|
+
"slide-up": "_slide-up_gsvmh_1",
|
|
79
|
+
"spin-3d": "_spin-3d_gsvmh_1",
|
|
80
80
|
spin,
|
|
81
81
|
pulse,
|
|
82
|
-
"fade-in-up": "_fade-in-
|
|
83
|
-
"progress-grow": "_progress-
|
|
84
|
-
"indeterminate-move": "_indeterminate-
|
|
85
|
-
"skeleton-loading": "_skeleton-
|
|
82
|
+
"fade-in-up": "_fade-in-up_gsvmh_1",
|
|
83
|
+
"progress-grow": "_progress-grow_gsvmh_1",
|
|
84
|
+
"indeterminate-move": "_indeterminate-move_gsvmh_1",
|
|
85
|
+
"skeleton-loading": "_skeleton-loading_gsvmh_1"
|
|
86
86
|
};
|
|
87
87
|
const TabsBase = ({
|
|
88
88
|
tabs: tabs2,
|
|
@@ -261,4 +261,4 @@ Tabs.displayName = "Tabs";
|
|
|
261
261
|
export {
|
|
262
262
|
Tabs as T
|
|
263
263
|
};
|
|
264
|
-
//# sourceMappingURL=Tabs-
|
|
264
|
+
//# sourceMappingURL=Tabs-Bur4oYVF.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs-D90stLbD.js","sources":["../../src/components/Tabs/TabsBase.tsx","../../src/components/Tabs/next/Tabs.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState, useId } from \"react\";\r\nimport { BaseTabsProps } from \"./Tabs.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n getDefaultRounding,\r\n getDefaultShadow,\r\n getDefaultSize,\r\n getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TabsBase: React.FC<BaseTabsProps> = ({\r\n tabs,\r\n defaultIndex = 0,\r\n onChange,\r\n rounding = getDefaultRounding(),\r\n shadow = getDefaultShadow(),\r\n className = \"\",\r\n theme = getDefaultTheme(),\r\n state = \"\",\r\n size = getDefaultSize(),\r\n orientation = \"horizontal\",\r\n activationMode = \"auto\",\r\n \"data-testid\": testId = \"tabs\",\r\n classMap,\r\n}) => {\r\n const uid = useId();\r\n const baseId = `${testId}-${uid}`;\r\n\r\n const [activeIndex, setActiveIndex] = useState(defaultIndex);\r\n const [focusIndex, setFocusIndex] = useState(defaultIndex);\r\n\r\n const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\r\n\r\n useEffect(() => {\r\n const current = activationMode === \"manual\" ? focusIndex : activeIndex;\r\n tabRefs.current.forEach((el, i) => {\r\n if (!el) return;\r\n el.setAttribute(\"tabindex\", i === current ? \"0\" : \"-1\");\r\n });\r\n tabRefs.current[current]?.focus();\r\n }, [activeIndex, focusIndex, activationMode]);\r\n\r\n const containerClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.container,\r\n classMap[theme],\r\n classMap[state],\r\n classMap[size],\r\n className\r\n ),\r\n [classMap, theme, state, size, className]\r\n );\r\n\r\n const tabClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.tab,\r\n shadow && classMap[`shadow${capitalize(shadow)}`],\r\n rounding && classMap[`round${capitalize(rounding)}`]\r\n ),\r\n [classMap, shadow, rounding]\r\n );\r\n\r\n const activate = (index: number) => {\r\n setActiveIndex(index);\r\n onChange?.(index);\r\n };\r\n\r\n const isDisabled = (index: number) => !!tabs[index]?.disabled;\r\n\r\n const nextEnabled = (start: number, dir: 1 | -1) => {\r\n const len = tabs.length;\r\n let i = start;\r\n for (let n = 0; n < len; n++) {\r\n i = (i + dir + len) % len;\r\n if (!isDisabled(i)) return i;\r\n }\r\n return start;\r\n };\r\n\r\n const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n const horiz = orientation === \"horizontal\";\r\n const { key } = event;\r\n\r\n let newFocus = focusIndex;\r\n\r\n if (horiz && key === \"ArrowRight\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (horiz && key === \"ArrowLeft\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (!horiz && key === \"ArrowDown\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (!horiz && key === \"ArrowUp\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (key === \"Home\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(-1, 1);\r\n } else if (key === \"End\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(0, -1);\r\n } else if (\r\n activationMode === \"manual\" &&\r\n (key === \"Enter\" || key === \" \")\r\n ) {\r\n event.preventDefault();\r\n if (!isDisabled(focusIndex)) activate(focusIndex);\r\n return;\r\n } else {\r\n return;\r\n }\r\n\r\n setFocusIndex(newFocus);\r\n if (activationMode === \"auto\") activate(newFocus);\r\n };\r\n\r\n const currentPanelId = `${baseId}-panel-${activeIndex}`;\r\n const currentTabId = `${baseId}-tab-${activeIndex}`;\r\n\r\n return (\r\n <div className={containerClassNames} data-testid={testId}>\r\n <div\r\n className={classMap.tabs}\r\n role=\"tablist\"\r\n aria-label=\"Tabs\"\r\n aria-orientation={orientation}\r\n onKeyDown={onKeyDown}\r\n data-testid={`${testId}-tablist`}\r\n >\r\n {tabs.map((tab, index) => {\r\n const Icon = tab.icon;\r\n const isActive = index === activeIndex;\r\n const disabled = isDisabled(index);\r\n const tabId = `${baseId}-tab-${index}`;\r\n const panelId = `${baseId}-panel-${index}`;\r\n\r\n return (\r\n <button\r\n key={index}\r\n ref={(el) => {\r\n tabRefs.current[index] = el;\r\n }}\r\n className={combineClassNames(\r\n tabClassNames,\r\n isActive && classMap.active,\r\n disabled && classMap.disabled\r\n )}\r\n role=\"tab\"\r\n type=\"button\"\r\n aria-selected={isActive}\r\n aria-controls={panelId}\r\n id={tabId}\r\n aria-disabled={disabled || undefined}\r\n onClick={() => {\r\n if (disabled) return;\r\n setFocusIndex(index);\r\n activate(index);\r\n }}\r\n data-testid={`${testId}-tab-${index}`}\r\n >\r\n {Icon && (\r\n <div\r\n className={classMap.icon}\r\n aria-hidden=\"true\"\r\n data-testid={`${testId}-icon-${index}`}\r\n >\r\n <Icon />\r\n </div>\r\n )}\r\n {tab.label}\r\n </button>\r\n );\r\n })}\r\n </div>\r\n\r\n <div\r\n className={classMap.content}\r\n role=\"tabpanel\"\r\n id={currentPanelId}\r\n aria-labelledby={currentTabId}\r\n tabIndex={0}\r\n data-testid={`${testId}-panel`}\r\n >\r\n {tabs[activeIndex].content}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nTabsBase.displayName = \"TabsBase\";\r\nexport default TabsBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Tabs.module.scss\";\r\nimport TabsBase from \"../TabsBase\";\r\nimport { TabsProps } from \"../Tabs.types\";\r\n\r\nconst Tabs: React.FC<TabsProps> = (props) => {\r\n return <TabsBase {...props} classMap={styles} />;\r\n};\r\nTabs.displayName = \"Tabs\";\r\nexport default Tabs;\r\n"],"names":["tabs","tab"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tabs-Bur4oYVF.js","sources":["../../src/components/Tabs/TabsBase.tsx","../../src/components/Tabs/next/Tabs.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState, useId } from \"react\";\r\nimport { BaseTabsProps } from \"./Tabs.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n getDefaultRounding,\r\n getDefaultShadow,\r\n getDefaultSize,\r\n getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TabsBase: React.FC<BaseTabsProps> = ({\r\n tabs,\r\n defaultIndex = 0,\r\n onChange,\r\n rounding = getDefaultRounding(),\r\n shadow = getDefaultShadow(),\r\n className = \"\",\r\n theme = getDefaultTheme(),\r\n state = \"\",\r\n size = getDefaultSize(),\r\n orientation = \"horizontal\",\r\n activationMode = \"auto\",\r\n \"data-testid\": testId = \"tabs\",\r\n classMap,\r\n}) => {\r\n const uid = useId();\r\n const baseId = `${testId}-${uid}`;\r\n\r\n const [activeIndex, setActiveIndex] = useState(defaultIndex);\r\n const [focusIndex, setFocusIndex] = useState(defaultIndex);\r\n\r\n const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\r\n\r\n useEffect(() => {\r\n const current = activationMode === \"manual\" ? focusIndex : activeIndex;\r\n tabRefs.current.forEach((el, i) => {\r\n if (!el) return;\r\n el.setAttribute(\"tabindex\", i === current ? \"0\" : \"-1\");\r\n });\r\n tabRefs.current[current]?.focus();\r\n }, [activeIndex, focusIndex, activationMode]);\r\n\r\n const containerClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.container,\r\n classMap[theme],\r\n classMap[state],\r\n classMap[size],\r\n className\r\n ),\r\n [classMap, theme, state, size, className]\r\n );\r\n\r\n const tabClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.tab,\r\n shadow && classMap[`shadow${capitalize(shadow)}`],\r\n rounding && classMap[`round${capitalize(rounding)}`]\r\n ),\r\n [classMap, shadow, rounding]\r\n );\r\n\r\n const activate = (index: number) => {\r\n setActiveIndex(index);\r\n onChange?.(index);\r\n };\r\n\r\n const isDisabled = (index: number) => !!tabs[index]?.disabled;\r\n\r\n const nextEnabled = (start: number, dir: 1 | -1) => {\r\n const len = tabs.length;\r\n let i = start;\r\n for (let n = 0; n < len; n++) {\r\n i = (i + dir + len) % len;\r\n if (!isDisabled(i)) return i;\r\n }\r\n return start;\r\n };\r\n\r\n const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n const horiz = orientation === \"horizontal\";\r\n const { key } = event;\r\n\r\n let newFocus = focusIndex;\r\n\r\n if (horiz && key === \"ArrowRight\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (horiz && key === \"ArrowLeft\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (!horiz && key === \"ArrowDown\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (!horiz && key === \"ArrowUp\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (key === \"Home\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(-1, 1);\r\n } else if (key === \"End\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(0, -1);\r\n } else if (\r\n activationMode === \"manual\" &&\r\n (key === \"Enter\" || key === \" \")\r\n ) {\r\n event.preventDefault();\r\n if (!isDisabled(focusIndex)) activate(focusIndex);\r\n return;\r\n } else {\r\n return;\r\n }\r\n\r\n setFocusIndex(newFocus);\r\n if (activationMode === \"auto\") activate(newFocus);\r\n };\r\n\r\n const currentPanelId = `${baseId}-panel-${activeIndex}`;\r\n const currentTabId = `${baseId}-tab-${activeIndex}`;\r\n\r\n return (\r\n <div className={containerClassNames} data-testid={testId}>\r\n <div\r\n className={classMap.tabs}\r\n role=\"tablist\"\r\n aria-label=\"Tabs\"\r\n aria-orientation={orientation}\r\n onKeyDown={onKeyDown}\r\n data-testid={`${testId}-tablist`}\r\n >\r\n {tabs.map((tab, index) => {\r\n const Icon = tab.icon;\r\n const isActive = index === activeIndex;\r\n const disabled = isDisabled(index);\r\n const tabId = `${baseId}-tab-${index}`;\r\n const panelId = `${baseId}-panel-${index}`;\r\n\r\n return (\r\n <button\r\n key={index}\r\n ref={(el) => {\r\n tabRefs.current[index] = el;\r\n }}\r\n className={combineClassNames(\r\n tabClassNames,\r\n isActive && classMap.active,\r\n disabled && classMap.disabled\r\n )}\r\n role=\"tab\"\r\n type=\"button\"\r\n aria-selected={isActive}\r\n aria-controls={panelId}\r\n id={tabId}\r\n aria-disabled={disabled || undefined}\r\n onClick={() => {\r\n if (disabled) return;\r\n setFocusIndex(index);\r\n activate(index);\r\n }}\r\n data-testid={`${testId}-tab-${index}`}\r\n >\r\n {Icon && (\r\n <div\r\n className={classMap.icon}\r\n aria-hidden=\"true\"\r\n data-testid={`${testId}-icon-${index}`}\r\n >\r\n <Icon />\r\n </div>\r\n )}\r\n {tab.label}\r\n </button>\r\n );\r\n })}\r\n </div>\r\n\r\n <div\r\n className={classMap.content}\r\n role=\"tabpanel\"\r\n id={currentPanelId}\r\n aria-labelledby={currentTabId}\r\n tabIndex={0}\r\n data-testid={`${testId}-panel`}\r\n >\r\n {tabs[activeIndex].content}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nTabsBase.displayName = \"TabsBase\";\r\nexport default TabsBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Tabs.module.scss\";\r\nimport TabsBase from \"../TabsBase\";\r\nimport { TabsProps } from \"../Tabs.types\";\r\n\r\nconst Tabs: React.FC<TabsProps> = (props) => {\r\n return <TabsBase {...props} classMap={styles} />;\r\n};\r\nTabs.displayName = \"Tabs\";\r\nexport default Tabs;\r\n"],"names":["tabs","tab"],"mappings":"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"}
|
|
@@ -4,42 +4,42 @@ const React = require("react");
|
|
|
4
4
|
const classNames = require("./classNames-BcWMx052.cjs");
|
|
5
5
|
const capitalize = require("./capitalize-DoV-nOmN.cjs");
|
|
6
6
|
const borealStyleConfig = require("./boreal-style-config-Rr5d5Qts.cjs");
|
|
7
|
-
const noScroll = "
|
|
8
|
-
const errorMessage = "
|
|
9
|
-
const loadingContainer = "
|
|
10
|
-
const hideScrollbar = "
|
|
11
|
-
const sr_only = "
|
|
12
|
-
const tabs_container = "
|
|
13
|
-
const tabs = "
|
|
14
|
-
const icon = "
|
|
15
|
-
const tab = "
|
|
16
|
-
const xs = "
|
|
17
|
-
const small = "
|
|
18
|
-
const medium = "
|
|
19
|
-
const large = "
|
|
20
|
-
const xl = "
|
|
21
|
-
const content = "
|
|
22
|
-
const primary = "
|
|
23
|
-
const active = "
|
|
24
|
-
const secondary = "
|
|
25
|
-
const tertiary = "
|
|
26
|
-
const quaternary = "
|
|
27
|
-
const clear = "
|
|
28
|
-
const success = "
|
|
29
|
-
const error = "
|
|
30
|
-
const warning = "
|
|
31
|
-
const roundNone = "
|
|
32
|
-
const roundSmall = "
|
|
33
|
-
const roundMedium = "
|
|
34
|
-
const roundLarge = "
|
|
35
|
-
const roundFull = "
|
|
36
|
-
const shadowNone = "
|
|
37
|
-
const shadowLight = "
|
|
38
|
-
const shadowMedium = "
|
|
39
|
-
const shadowStrong = "
|
|
40
|
-
const shadowIntense = "
|
|
41
|
-
const spin = "
|
|
42
|
-
const pulse = "
|
|
7
|
+
const noScroll = "_noScroll_gsvmh_108";
|
|
8
|
+
const errorMessage = "_errorMessage_gsvmh_109";
|
|
9
|
+
const loadingContainer = "_loadingContainer_gsvmh_110";
|
|
10
|
+
const hideScrollbar = "_hideScrollbar_gsvmh_102";
|
|
11
|
+
const sr_only = "_sr_only_gsvmh_111";
|
|
12
|
+
const tabs_container = "_tabs_container_gsvmh_552";
|
|
13
|
+
const tabs = "_tabs_gsvmh_552";
|
|
14
|
+
const icon = "_icon_gsvmh_575";
|
|
15
|
+
const tab = "_tab_gsvmh_552";
|
|
16
|
+
const xs = "_xs_gsvmh_632";
|
|
17
|
+
const small = "_small_gsvmh_642";
|
|
18
|
+
const medium = "_medium_gsvmh_652";
|
|
19
|
+
const large = "_large_gsvmh_662";
|
|
20
|
+
const xl = "_xl_gsvmh_672";
|
|
21
|
+
const content = "_content_gsvmh_682";
|
|
22
|
+
const primary = "_primary_gsvmh_703";
|
|
23
|
+
const active = "_active_gsvmh_703";
|
|
24
|
+
const secondary = "_secondary_gsvmh_712";
|
|
25
|
+
const tertiary = "_tertiary_gsvmh_721";
|
|
26
|
+
const quaternary = "_quaternary_gsvmh_730";
|
|
27
|
+
const clear = "_clear_gsvmh_739";
|
|
28
|
+
const success = "_success_gsvmh_748";
|
|
29
|
+
const error = "_error_gsvmh_109";
|
|
30
|
+
const warning = "_warning_gsvmh_766";
|
|
31
|
+
const roundNone = "_roundNone_gsvmh_779";
|
|
32
|
+
const roundSmall = "_roundSmall_gsvmh_789";
|
|
33
|
+
const roundMedium = "_roundMedium_gsvmh_799";
|
|
34
|
+
const roundLarge = "_roundLarge_gsvmh_809";
|
|
35
|
+
const roundFull = "_roundFull_gsvmh_819";
|
|
36
|
+
const shadowNone = "_shadowNone_gsvmh_829";
|
|
37
|
+
const shadowLight = "_shadowLight_gsvmh_833";
|
|
38
|
+
const shadowMedium = "_shadowMedium_gsvmh_837";
|
|
39
|
+
const shadowStrong = "_shadowStrong_gsvmh_841";
|
|
40
|
+
const shadowIntense = "_shadowIntense_gsvmh_845";
|
|
41
|
+
const spin = "_spin_gsvmh_1";
|
|
42
|
+
const pulse = "_pulse_gsvmh_1";
|
|
43
43
|
const styles = {
|
|
44
44
|
noScroll,
|
|
45
45
|
errorMessage,
|
|
@@ -75,15 +75,15 @@ const styles = {
|
|
|
75
75
|
shadowMedium,
|
|
76
76
|
shadowStrong,
|
|
77
77
|
shadowIntense,
|
|
78
|
-
"fade-in": "_fade-
|
|
79
|
-
"slide-up": "_slide-
|
|
80
|
-
"spin-3d": "_spin-
|
|
78
|
+
"fade-in": "_fade-in_gsvmh_1",
|
|
79
|
+
"slide-up": "_slide-up_gsvmh_1",
|
|
80
|
+
"spin-3d": "_spin-3d_gsvmh_1",
|
|
81
81
|
spin,
|
|
82
82
|
pulse,
|
|
83
|
-
"fade-in-up": "_fade-in-
|
|
84
|
-
"progress-grow": "_progress-
|
|
85
|
-
"indeterminate-move": "_indeterminate-
|
|
86
|
-
"skeleton-loading": "_skeleton-
|
|
83
|
+
"fade-in-up": "_fade-in-up_gsvmh_1",
|
|
84
|
+
"progress-grow": "_progress-grow_gsvmh_1",
|
|
85
|
+
"indeterminate-move": "_indeterminate-move_gsvmh_1",
|
|
86
|
+
"skeleton-loading": "_skeleton-loading_gsvmh_1"
|
|
87
87
|
};
|
|
88
88
|
const TabsBase = ({
|
|
89
89
|
tabs: tabs2,
|
|
@@ -260,4 +260,4 @@ const Tabs = (props) => {
|
|
|
260
260
|
};
|
|
261
261
|
Tabs.displayName = "Tabs";
|
|
262
262
|
exports.Tabs = Tabs;
|
|
263
|
-
//# sourceMappingURL=Tabs-
|
|
263
|
+
//# sourceMappingURL=Tabs-D-5VRbfh.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs-BgKvtbgg.cjs","sources":["../../src/components/Tabs/TabsBase.tsx","../../src/components/Tabs/next/Tabs.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState, useId } from \"react\";\r\nimport { BaseTabsProps } from \"./Tabs.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n getDefaultRounding,\r\n getDefaultShadow,\r\n getDefaultSize,\r\n getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TabsBase: React.FC<BaseTabsProps> = ({\r\n tabs,\r\n defaultIndex = 0,\r\n onChange,\r\n rounding = getDefaultRounding(),\r\n shadow = getDefaultShadow(),\r\n className = \"\",\r\n theme = getDefaultTheme(),\r\n state = \"\",\r\n size = getDefaultSize(),\r\n orientation = \"horizontal\",\r\n activationMode = \"auto\",\r\n \"data-testid\": testId = \"tabs\",\r\n classMap,\r\n}) => {\r\n const uid = useId();\r\n const baseId = `${testId}-${uid}`;\r\n\r\n const [activeIndex, setActiveIndex] = useState(defaultIndex);\r\n const [focusIndex, setFocusIndex] = useState(defaultIndex);\r\n\r\n const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\r\n\r\n useEffect(() => {\r\n const current = activationMode === \"manual\" ? focusIndex : activeIndex;\r\n tabRefs.current.forEach((el, i) => {\r\n if (!el) return;\r\n el.setAttribute(\"tabindex\", i === current ? \"0\" : \"-1\");\r\n });\r\n tabRefs.current[current]?.focus();\r\n }, [activeIndex, focusIndex, activationMode]);\r\n\r\n const containerClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.container,\r\n classMap[theme],\r\n classMap[state],\r\n classMap[size],\r\n className\r\n ),\r\n [classMap, theme, state, size, className]\r\n );\r\n\r\n const tabClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.tab,\r\n shadow && classMap[`shadow${capitalize(shadow)}`],\r\n rounding && classMap[`round${capitalize(rounding)}`]\r\n ),\r\n [classMap, shadow, rounding]\r\n );\r\n\r\n const activate = (index: number) => {\r\n setActiveIndex(index);\r\n onChange?.(index);\r\n };\r\n\r\n const isDisabled = (index: number) => !!tabs[index]?.disabled;\r\n\r\n const nextEnabled = (start: number, dir: 1 | -1) => {\r\n const len = tabs.length;\r\n let i = start;\r\n for (let n = 0; n < len; n++) {\r\n i = (i + dir + len) % len;\r\n if (!isDisabled(i)) return i;\r\n }\r\n return start;\r\n };\r\n\r\n const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n const horiz = orientation === \"horizontal\";\r\n const { key } = event;\r\n\r\n let newFocus = focusIndex;\r\n\r\n if (horiz && key === \"ArrowRight\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (horiz && key === \"ArrowLeft\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (!horiz && key === \"ArrowDown\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (!horiz && key === \"ArrowUp\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (key === \"Home\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(-1, 1);\r\n } else if (key === \"End\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(0, -1);\r\n } else if (\r\n activationMode === \"manual\" &&\r\n (key === \"Enter\" || key === \" \")\r\n ) {\r\n event.preventDefault();\r\n if (!isDisabled(focusIndex)) activate(focusIndex);\r\n return;\r\n } else {\r\n return;\r\n }\r\n\r\n setFocusIndex(newFocus);\r\n if (activationMode === \"auto\") activate(newFocus);\r\n };\r\n\r\n const currentPanelId = `${baseId}-panel-${activeIndex}`;\r\n const currentTabId = `${baseId}-tab-${activeIndex}`;\r\n\r\n return (\r\n <div className={containerClassNames} data-testid={testId}>\r\n <div\r\n className={classMap.tabs}\r\n role=\"tablist\"\r\n aria-label=\"Tabs\"\r\n aria-orientation={orientation}\r\n onKeyDown={onKeyDown}\r\n data-testid={`${testId}-tablist`}\r\n >\r\n {tabs.map((tab, index) => {\r\n const Icon = tab.icon;\r\n const isActive = index === activeIndex;\r\n const disabled = isDisabled(index);\r\n const tabId = `${baseId}-tab-${index}`;\r\n const panelId = `${baseId}-panel-${index}`;\r\n\r\n return (\r\n <button\r\n key={index}\r\n ref={(el) => {\r\n tabRefs.current[index] = el;\r\n }}\r\n className={combineClassNames(\r\n tabClassNames,\r\n isActive && classMap.active,\r\n disabled && classMap.disabled\r\n )}\r\n role=\"tab\"\r\n type=\"button\"\r\n aria-selected={isActive}\r\n aria-controls={panelId}\r\n id={tabId}\r\n aria-disabled={disabled || undefined}\r\n onClick={() => {\r\n if (disabled) return;\r\n setFocusIndex(index);\r\n activate(index);\r\n }}\r\n data-testid={`${testId}-tab-${index}`}\r\n >\r\n {Icon && (\r\n <div\r\n className={classMap.icon}\r\n aria-hidden=\"true\"\r\n data-testid={`${testId}-icon-${index}`}\r\n >\r\n <Icon />\r\n </div>\r\n )}\r\n {tab.label}\r\n </button>\r\n );\r\n })}\r\n </div>\r\n\r\n <div\r\n className={classMap.content}\r\n role=\"tabpanel\"\r\n id={currentPanelId}\r\n aria-labelledby={currentTabId}\r\n tabIndex={0}\r\n data-testid={`${testId}-panel`}\r\n >\r\n {tabs[activeIndex].content}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nTabsBase.displayName = \"TabsBase\";\r\nexport default TabsBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Tabs.module.scss\";\r\nimport TabsBase from \"../TabsBase\";\r\nimport { TabsProps } from \"../Tabs.types\";\r\n\r\nconst Tabs: React.FC<TabsProps> = (props) => {\r\n return <TabsBase {...props} classMap={styles} />;\r\n};\r\nTabs.displayName = \"Tabs\";\r\nexport default Tabs;\r\n"],"names":["tabs","getDefaultRounding","getDefaultShadow","getDefaultTheme","getDefaultSize","useId","useState","useRef","useEffect","useMemo","combineClassNames","capitalize","jsxs","jsx","tab"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tabs-D-5VRbfh.cjs","sources":["../../src/components/Tabs/TabsBase.tsx","../../src/components/Tabs/next/Tabs.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState, useId } from \"react\";\r\nimport { BaseTabsProps } from \"./Tabs.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n getDefaultRounding,\r\n getDefaultShadow,\r\n getDefaultSize,\r\n getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TabsBase: React.FC<BaseTabsProps> = ({\r\n tabs,\r\n defaultIndex = 0,\r\n onChange,\r\n rounding = getDefaultRounding(),\r\n shadow = getDefaultShadow(),\r\n className = \"\",\r\n theme = getDefaultTheme(),\r\n state = \"\",\r\n size = getDefaultSize(),\r\n orientation = \"horizontal\",\r\n activationMode = \"auto\",\r\n \"data-testid\": testId = \"tabs\",\r\n classMap,\r\n}) => {\r\n const uid = useId();\r\n const baseId = `${testId}-${uid}`;\r\n\r\n const [activeIndex, setActiveIndex] = useState(defaultIndex);\r\n const [focusIndex, setFocusIndex] = useState(defaultIndex);\r\n\r\n const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\r\n\r\n useEffect(() => {\r\n const current = activationMode === \"manual\" ? focusIndex : activeIndex;\r\n tabRefs.current.forEach((el, i) => {\r\n if (!el) return;\r\n el.setAttribute(\"tabindex\", i === current ? \"0\" : \"-1\");\r\n });\r\n tabRefs.current[current]?.focus();\r\n }, [activeIndex, focusIndex, activationMode]);\r\n\r\n const containerClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.container,\r\n classMap[theme],\r\n classMap[state],\r\n classMap[size],\r\n className\r\n ),\r\n [classMap, theme, state, size, className]\r\n );\r\n\r\n const tabClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.tab,\r\n shadow && classMap[`shadow${capitalize(shadow)}`],\r\n rounding && classMap[`round${capitalize(rounding)}`]\r\n ),\r\n [classMap, shadow, rounding]\r\n );\r\n\r\n const activate = (index: number) => {\r\n setActiveIndex(index);\r\n onChange?.(index);\r\n };\r\n\r\n const isDisabled = (index: number) => !!tabs[index]?.disabled;\r\n\r\n const nextEnabled = (start: number, dir: 1 | -1) => {\r\n const len = tabs.length;\r\n let i = start;\r\n for (let n = 0; n < len; n++) {\r\n i = (i + dir + len) % len;\r\n if (!isDisabled(i)) return i;\r\n }\r\n return start;\r\n };\r\n\r\n const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n const horiz = orientation === \"horizontal\";\r\n const { key } = event;\r\n\r\n let newFocus = focusIndex;\r\n\r\n if (horiz && key === \"ArrowRight\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (horiz && key === \"ArrowLeft\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (!horiz && key === \"ArrowDown\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (!horiz && key === \"ArrowUp\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (key === \"Home\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(-1, 1);\r\n } else if (key === \"End\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(0, -1);\r\n } else if (\r\n activationMode === \"manual\" &&\r\n (key === \"Enter\" || key === \" \")\r\n ) {\r\n event.preventDefault();\r\n if (!isDisabled(focusIndex)) activate(focusIndex);\r\n return;\r\n } else {\r\n return;\r\n }\r\n\r\n setFocusIndex(newFocus);\r\n if (activationMode === \"auto\") activate(newFocus);\r\n };\r\n\r\n const currentPanelId = `${baseId}-panel-${activeIndex}`;\r\n const currentTabId = `${baseId}-tab-${activeIndex}`;\r\n\r\n return (\r\n <div className={containerClassNames} data-testid={testId}>\r\n <div\r\n className={classMap.tabs}\r\n role=\"tablist\"\r\n aria-label=\"Tabs\"\r\n aria-orientation={orientation}\r\n onKeyDown={onKeyDown}\r\n data-testid={`${testId}-tablist`}\r\n >\r\n {tabs.map((tab, index) => {\r\n const Icon = tab.icon;\r\n const isActive = index === activeIndex;\r\n const disabled = isDisabled(index);\r\n const tabId = `${baseId}-tab-${index}`;\r\n const panelId = `${baseId}-panel-${index}`;\r\n\r\n return (\r\n <button\r\n key={index}\r\n ref={(el) => {\r\n tabRefs.current[index] = el;\r\n }}\r\n className={combineClassNames(\r\n tabClassNames,\r\n isActive && classMap.active,\r\n disabled && classMap.disabled\r\n )}\r\n role=\"tab\"\r\n type=\"button\"\r\n aria-selected={isActive}\r\n aria-controls={panelId}\r\n id={tabId}\r\n aria-disabled={disabled || undefined}\r\n onClick={() => {\r\n if (disabled) return;\r\n setFocusIndex(index);\r\n activate(index);\r\n }}\r\n data-testid={`${testId}-tab-${index}`}\r\n >\r\n {Icon && (\r\n <div\r\n className={classMap.icon}\r\n aria-hidden=\"true\"\r\n data-testid={`${testId}-icon-${index}`}\r\n >\r\n <Icon />\r\n </div>\r\n )}\r\n {tab.label}\r\n </button>\r\n );\r\n })}\r\n </div>\r\n\r\n <div\r\n className={classMap.content}\r\n role=\"tabpanel\"\r\n id={currentPanelId}\r\n aria-labelledby={currentTabId}\r\n tabIndex={0}\r\n data-testid={`${testId}-panel`}\r\n >\r\n {tabs[activeIndex].content}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nTabsBase.displayName = \"TabsBase\";\r\nexport default TabsBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Tabs.module.scss\";\r\nimport TabsBase from \"../TabsBase\";\r\nimport { TabsProps } from \"../Tabs.types\";\r\n\r\nconst Tabs: React.FC<TabsProps> = (props) => {\r\n return <TabsBase {...props} classMap={styles} />;\r\n};\r\nTabs.displayName = \"Tabs\";\r\nexport default Tabs;\r\n"],"names":["tabs","getDefaultRounding","getDefaultShadow","getDefaultTheme","getDefaultSize","useId","useState","useRef","useEffect","useMemo","combineClassNames","capitalize","jsxs","jsx","tab"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,WAAoC,CAAC;AAAA,EACzC,MAAAA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA,WAAWC,kBAAAA,mBAAA;AAAA,EACX,SAASC,kBAAAA,iBAAA;AAAA,EACT,YAAY;AAAA,EACZ,QAAQC,kBAAAA,gBAAA;AAAA,EACR,QAAQ;AAAA,EACR,OAAOC,kBAAAA,eAAA;AAAA,EACP,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,eAAe,SAAS;AAAA,EACxB;AACF,MAAM;AACJ,QAAM,MAAMC,MAAAA,MAAA;AACZ,QAAM,SAAS,GAAG,MAAM,IAAI,GAAG;AAE/B,QAAM,CAAC,aAAa,cAAc,IAAIC,MAAAA,SAAS,YAAY;AAC3D,QAAM,CAAC,YAAY,aAAa,IAAIA,MAAAA,SAAS,YAAY;AAEzD,QAAM,UAAUC,MAAAA,OAAqC,EAAE;AAEvDC,QAAAA,UAAU,MAAM;;AACd,UAAM,UAAU,mBAAmB,WAAW,aAAa;AAC3D,YAAQ,QAAQ,QAAQ,CAAC,IAAI,MAAM;AACjC,UAAI,CAAC,GAAI;AACT,SAAG,aAAa,YAAY,MAAM,UAAU,MAAM,IAAI;AAAA,IACxD,CAAC;AACD,kBAAQ,QAAQ,OAAO,MAAvB,mBAA0B;AAAA,EAC5B,GAAG,CAAC,aAAa,YAAY,cAAc,CAAC;AAE5C,QAAM,sBAAsBC,MAAAA;AAAAA,IAC1B,MACEC,WAAAA;AAAAA,MACE,SAAS;AAAA,MACT,SAAS,KAAK;AAAA,MACd,SAAS,KAAK;AAAA,MACd,SAAS,IAAI;AAAA,MACb;AAAA,IAAA;AAAA,IAEJ,CAAC,UAAU,OAAO,OAAO,MAAM,SAAS;AAAA,EAAA;AAG1C,QAAM,gBAAgBD,MAAAA;AAAAA,IACpB,MACEC,WAAAA;AAAAA,MACE,SAAS;AAAA,MACT,UAAU,SAAS,SAASC,WAAAA,WAAW,MAAM,CAAC,EAAE;AAAA,MAChD,YAAY,SAAS,QAAQA,WAAAA,WAAW,QAAQ,CAAC,EAAE;AAAA,IAAA;AAAA,IAEvD,CAAC,UAAU,QAAQ,QAAQ;AAAA,EAAA;AAG7B,QAAM,WAAW,CAAC,UAAkB;AAClC,mBAAe,KAAK;AACpB,yCAAW;AAAA,EACb;AAEA,QAAM,aAAa,CAAC,UAAA;;AAAkB,YAAC,GAAC,KAAAX,MAAK,KAAK,MAAV,mBAAa;AAAA;AAErD,QAAM,cAAc,CAAC,OAAe,QAAgB;AAClD,UAAM,MAAMA,MAAK;AACjB,QAAI,IAAI;AACR,aAAS,IAAI,GAAG,IAAI,KAAK,KAAK;AAC5B,WAAK,IAAI,MAAM,OAAO;AACtB,UAAI,CAAC,WAAW,CAAC,EAAG,QAAO;AAAA,IAC7B;AACA,WAAO;AAAA,EACT;AAEA,QAAM,YAAY,CAAC,UAA+C;AAChE,UAAM,QAAQ,gBAAgB;AAC9B,UAAM,EAAE,QAAQ;AAEhB,QAAI,WAAW;AAEf,QAAI,SAAS,QAAQ,cAAc;AACjC,YAAM,eAAA;AACN,iBAAW,YAAY,YAAY,CAAC;AAAA,IACtC,WAAW,SAAS,QAAQ,aAAa;AACvC,YAAM,eAAA;AACN,iBAAW,YAAY,YAAY,EAAE;AAAA,IACvC,WAAW,CAAC,SAAS,QAAQ,aAAa;AACxC,YAAM,eAAA;AACN,iBAAW,YAAY,YAAY,CAAC;AAAA,IACtC,WAAW,CAAC,SAAS,QAAQ,WAAW;AACtC,YAAM,eAAA;AACN,iBAAW,YAAY,YAAY,EAAE;AAAA,IACvC,WAAW,QAAQ,QAAQ;AACzB,YAAM,eAAA;AACN,iBAAW,YAAY,IAAI,CAAC;AAAA,IAC9B,WAAW,QAAQ,OAAO;AACxB,YAAM,eAAA;AACN,iBAAW,YAAY,GAAG,EAAE;AAAA,IAC9B,WACE,mBAAmB,aAClB,QAAQ,WAAW,QAAQ,MAC5B;AACA,YAAM,eAAA;AACN,UAAI,CAAC,WAAW,UAAU,YAAY,UAAU;AAChD;AAAA,IACF,OAAO;AACL;AAAA,IACF;AAEA,kBAAc,QAAQ;AACtB,QAAI,mBAAmB,OAAQ,UAAS,QAAQ;AAAA,EAClD;AAEA,QAAM,iBAAiB,GAAG,MAAM,UAAU,WAAW;AACrD,QAAM,eAAe,GAAG,MAAM,QAAQ,WAAW;AAEjD,SACEY,2BAAAA,KAAC,OAAA,EAAI,WAAW,qBAAqB,eAAa,QAChD,UAAA;AAAA,IAAAC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,SAAS;AAAA,QACpB,MAAK;AAAA,QACL,cAAW;AAAA,QACX,oBAAkB;AAAA,QAClB;AAAA,QACA,eAAa,GAAG,MAAM;AAAA,QAErB,UAAAb,MAAK,IAAI,CAACc,MAAK,UAAU;AACxB,gBAAM,OAAOA,KAAI;AACjB,gBAAM,WAAW,UAAU;AAC3B,gBAAM,WAAW,WAAW,KAAK;AACjC,gBAAM,QAAQ,GAAG,MAAM,QAAQ,KAAK;AACpC,gBAAM,UAAU,GAAG,MAAM,UAAU,KAAK;AAExC,iBACEF,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cAEC,KAAK,CAAC,OAAO;AACX,wBAAQ,QAAQ,KAAK,IAAI;AAAA,cAC3B;AAAA,cACA,WAAWF,WAAAA;AAAAA,gBACT;AAAA,gBACA,YAAY,SAAS;AAAA,gBACrB,YAAY,SAAS;AAAA,cAAA;AAAA,cAEvB,MAAK;AAAA,cACL,MAAK;AAAA,cACL,iBAAe;AAAA,cACf,iBAAe;AAAA,cACf,IAAI;AAAA,cACJ,iBAAe,YAAY;AAAA,cAC3B,SAAS,MAAM;AACb,oBAAI,SAAU;AACd,8BAAc,KAAK;AACnB,yBAAS,KAAK;AAAA,cAChB;AAAA,cACA,eAAa,GAAG,MAAM,QAAQ,KAAK;AAAA,cAElC,UAAA;AAAA,gBAAA,QACCG,2BAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAW,SAAS;AAAA,oBACpB,eAAY;AAAA,oBACZ,eAAa,GAAG,MAAM,SAAS,KAAK;AAAA,oBAEpC,yCAAC,MAAA,CAAA,CAAK;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGTC,KAAI;AAAA,cAAA;AAAA,YAAA;AAAA,YA/BA;AAAA,UAAA;AAAA,QAkCX,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,IAGHD,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,SAAS;AAAA,QACpB,MAAK;AAAA,QACL,IAAI;AAAA,QACJ,mBAAiB;AAAA,QACjB,UAAU;AAAA,QACV,eAAa,GAAG,MAAM;AAAA,QAErB,UAAAb,MAAK,WAAW,EAAE;AAAA,MAAA;AAAA,IAAA;AAAA,EACrB,GACF;AAEJ;AAEA,SAAS,cAAc;AC3LvB,MAAM,OAA4B,CAAC,UAAU;AAC3C,SAAOa,2BAAAA,IAAC,UAAA,EAAU,GAAG,OAAO,UAAU,QAAQ;AAChD;AACA,KAAK,cAAc;;"}
|
package/dist/next/Tabs.cjs.js
CHANGED
package/dist/next/Tabs.js
CHANGED
|
@@ -7,44 +7,44 @@ import { C as CloseIcon } from "./CloseIcon-C3eQm4EK.js";
|
|
|
7
7
|
import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
|
|
8
8
|
import { c as capitalize } from "./capitalize-C0TSQSPh.js";
|
|
9
9
|
import { c as getDefaultSize, d as getDefaultTheme, a as getDefaultRounding, b as getDefaultShadow } from "./boreal-style-config-BILmxkZG.js";
|
|
10
|
-
const noScroll = "
|
|
11
|
-
const errorMessage = "
|
|
12
|
-
const loadingContainer = "
|
|
13
|
-
const hideScrollbar = "
|
|
14
|
-
const sr_only = "
|
|
15
|
-
const tagInput = "
|
|
16
|
-
const tag = "
|
|
17
|
-
const suggestionItem = "
|
|
18
|
-
const inputWrapper = "
|
|
19
|
-
const tagContainer = "
|
|
20
|
-
const removeButton = "
|
|
21
|
-
const tagLabel = "
|
|
22
|
-
const suggestionList = "
|
|
23
|
-
const xs = "
|
|
24
|
-
const small = "
|
|
25
|
-
const medium = "
|
|
26
|
-
const large = "
|
|
27
|
-
const xl = "
|
|
28
|
-
const primary = "
|
|
29
|
-
const secondary = "
|
|
30
|
-
const tertiary = "
|
|
31
|
-
const quaternary = "
|
|
32
|
-
const clear = "
|
|
33
|
-
const success = "
|
|
34
|
-
const error = "
|
|
35
|
-
const warning = "
|
|
36
|
-
const roundNone = "
|
|
37
|
-
const roundSmall = "
|
|
38
|
-
const roundMedium = "
|
|
39
|
-
const roundLarge = "
|
|
40
|
-
const roundFull = "
|
|
41
|
-
const shadowNone = "
|
|
42
|
-
const shadowLight = "
|
|
43
|
-
const shadowMedium = "
|
|
44
|
-
const shadowStrong = "
|
|
45
|
-
const shadowIntense = "
|
|
46
|
-
const spin = "
|
|
47
|
-
const pulse = "
|
|
10
|
+
const noScroll = "_noScroll_1h749_108";
|
|
11
|
+
const errorMessage = "_errorMessage_1h749_109";
|
|
12
|
+
const loadingContainer = "_loadingContainer_1h749_110";
|
|
13
|
+
const hideScrollbar = "_hideScrollbar_1h749_102";
|
|
14
|
+
const sr_only = "_sr_only_1h749_111";
|
|
15
|
+
const tagInput = "_tagInput_1h749_552";
|
|
16
|
+
const tag = "_tag_1h749_552";
|
|
17
|
+
const suggestionItem = "_suggestionItem_1h749_580";
|
|
18
|
+
const inputWrapper = "_inputWrapper_1h749_584";
|
|
19
|
+
const tagContainer = "_tagContainer_1h749_593";
|
|
20
|
+
const removeButton = "_removeButton_1h749_616";
|
|
21
|
+
const tagLabel = "_tagLabel_1h749_659";
|
|
22
|
+
const suggestionList = "_suggestionList_1h749_663";
|
|
23
|
+
const xs = "_xs_1h749_706";
|
|
24
|
+
const small = "_small_1h749_716";
|
|
25
|
+
const medium = "_medium_1h749_726";
|
|
26
|
+
const large = "_large_1h749_736";
|
|
27
|
+
const xl = "_xl_1h749_746";
|
|
28
|
+
const primary = "_primary_1h749_756";
|
|
29
|
+
const secondary = "_secondary_1h749_760";
|
|
30
|
+
const tertiary = "_tertiary_1h749_764";
|
|
31
|
+
const quaternary = "_quaternary_1h749_768";
|
|
32
|
+
const clear = "_clear_1h749_772";
|
|
33
|
+
const success = "_success_1h749_776";
|
|
34
|
+
const error = "_error_1h749_109";
|
|
35
|
+
const warning = "_warning_1h749_786";
|
|
36
|
+
const roundNone = "_roundNone_1h749_791";
|
|
37
|
+
const roundSmall = "_roundSmall_1h749_795";
|
|
38
|
+
const roundMedium = "_roundMedium_1h749_799";
|
|
39
|
+
const roundLarge = "_roundLarge_1h749_803";
|
|
40
|
+
const roundFull = "_roundFull_1h749_807";
|
|
41
|
+
const shadowNone = "_shadowNone_1h749_811";
|
|
42
|
+
const shadowLight = "_shadowLight_1h749_815";
|
|
43
|
+
const shadowMedium = "_shadowMedium_1h749_819";
|
|
44
|
+
const shadowStrong = "_shadowStrong_1h749_823";
|
|
45
|
+
const shadowIntense = "_shadowIntense_1h749_827";
|
|
46
|
+
const spin = "_spin_1h749_1";
|
|
47
|
+
const pulse = "_pulse_1h749_1";
|
|
48
48
|
const styles = {
|
|
49
49
|
noScroll,
|
|
50
50
|
errorMessage,
|
|
@@ -82,15 +82,15 @@ const styles = {
|
|
|
82
82
|
shadowMedium,
|
|
83
83
|
shadowStrong,
|
|
84
84
|
shadowIntense,
|
|
85
|
-
"fade-in": "_fade-
|
|
86
|
-
"slide-up": "_slide-
|
|
87
|
-
"spin-3d": "_spin-
|
|
85
|
+
"fade-in": "_fade-in_1h749_1",
|
|
86
|
+
"slide-up": "_slide-up_1h749_1",
|
|
87
|
+
"spin-3d": "_spin-3d_1h749_1",
|
|
88
88
|
spin,
|
|
89
89
|
pulse,
|
|
90
|
-
"fade-in-up": "_fade-in-
|
|
91
|
-
"progress-grow": "_progress-
|
|
92
|
-
"indeterminate-move": "_indeterminate-
|
|
93
|
-
"skeleton-loading": "_skeleton-
|
|
90
|
+
"fade-in-up": "_fade-in-up_1h749_1",
|
|
91
|
+
"progress-grow": "_progress-grow_1h749_1",
|
|
92
|
+
"indeterminate-move": "_indeterminate-move_1h749_1",
|
|
93
|
+
"skeleton-loading": "_skeleton-loading_1h749_1"
|
|
94
94
|
};
|
|
95
95
|
const TagInputBase = ({
|
|
96
96
|
tags = [],
|
|
@@ -361,4 +361,4 @@ TagInput.displayName = "TagInput";
|
|
|
361
361
|
export {
|
|
362
362
|
TagInput as T
|
|
363
363
|
};
|
|
364
|
-
//# sourceMappingURL=TagInput-
|
|
364
|
+
//# sourceMappingURL=TagInput-DKzxPiwU.js.map
|