@servicetitan/anvil2 3.4.0 → 3.4.1
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.md +12 -0
- package/dist/{AiMark-Cb8qjOm8.js → AiMark-BL2p0EKB.js} +15 -5
- package/dist/{AiMark-Cb8qjOm8.js.map → AiMark-BL2p0EKB.js.map} +1 -1
- package/dist/AiMark.js +1 -1
- package/dist/{Alert-DcaD1Lkb.js → Alert-Cgo8pwhb.js} +3 -3
- package/dist/{Alert-DcaD1Lkb.js.map → Alert-Cgo8pwhb.js.map} +1 -1
- package/dist/Alert.js +1 -1
- package/dist/{Announcement-BLU0FORF.js → Announcement-4w6XjLcB.js} +2 -2
- package/dist/{Announcement-BLU0FORF.js.map → Announcement-4w6XjLcB.js.map} +1 -1
- package/dist/Announcement.js +1 -1
- package/dist/{Breadcrumbs-uTw8OAJ0.js → Breadcrumbs-DcMJdSC5.js} +2 -2
- package/dist/{Breadcrumbs-uTw8OAJ0.js.map → Breadcrumbs-DcMJdSC5.js.map} +1 -1
- package/dist/Breadcrumbs.js +1 -1
- package/dist/{Button-BUb1Qc37.js → Button-CjeF1Agb.js} +2 -2
- package/dist/{Button-BUb1Qc37.js.map → Button-CjeF1Agb.js.map} +1 -1
- package/dist/Button.css +21 -21
- package/dist/Button.js +1 -1
- package/dist/Button.module-BuOc7iPY.js +23 -0
- package/dist/Button.module-BuOc7iPY.js.map +1 -0
- package/dist/{ButtonCompound-_0ddykI_.js → ButtonCompound-D7kA0qXr.js} +2 -2
- package/dist/{ButtonCompound-_0ddykI_.js.map → ButtonCompound-D7kA0qXr.js.map} +1 -1
- package/dist/ButtonCompound.js +1 -1
- package/dist/{ButtonLink-CWbYzTTz.js → ButtonLink-BSReBbc3.js} +2 -2
- package/dist/{ButtonLink-CWbYzTTz.js.map → ButtonLink-BSReBbc3.js.map} +1 -1
- package/dist/ButtonLink.js +1 -1
- package/dist/{ButtonToggle-MLRj4uKG.js → ButtonToggle-CnOsM7-u.js} +2 -2
- package/dist/{ButtonToggle-MLRj4uKG.js.map → ButtonToggle-CnOsM7-u.js.map} +1 -1
- package/dist/ButtonToggle.js +1 -1
- package/dist/{Calendar-Dt0HL8Fv.js → Calendar-C05ESFqK.js} +3 -3
- package/dist/{Calendar-Dt0HL8Fv.js.map → Calendar-C05ESFqK.js.map} +1 -1
- package/dist/{Calendar-OMUNura7.js → Calendar-Dmsp_qIo.js} +2 -2
- package/dist/{Calendar-OMUNura7.js.map → Calendar-Dmsp_qIo.js.map} +1 -1
- package/dist/Calendar.js +2 -2
- package/dist/{Checkbox-BHrSg0oH.js → Checkbox-DEU2CtNu.js} +2 -2
- package/dist/{Checkbox-BHrSg0oH.js.map → Checkbox-DEU2CtNu.js.map} +1 -1
- package/dist/{Checkbox-D17xXjUh.js → Checkbox-DqY9bRng.js} +3 -3
- package/dist/{Checkbox-D17xXjUh.js.map → Checkbox-DqY9bRng.js.map} +1 -1
- package/dist/Checkbox.js +1 -1
- package/dist/{Chip-BRgs4B-5.js → Chip-Cb3dnZht.js} +2 -2
- package/dist/{Chip-BRgs4B-5.js.map → Chip-Cb3dnZht.js.map} +1 -1
- package/dist/Chip.js +1 -1
- package/dist/Combobox.js +1 -1
- package/dist/{DataTable-B-UT9iTJ.js → DataTable-QWgY5s7o.js} +15 -9
- package/dist/{DataTable-B-UT9iTJ.js.map → DataTable-QWgY5s7o.js.map} +1 -1
- package/dist/{DateFieldRange-CODGX5B3.js → DateFieldRange-BWE-utxz.js} +4 -4
- package/dist/{DateFieldRange-CODGX5B3.js.map → DateFieldRange-BWE-utxz.js.map} +1 -1
- package/dist/DateFieldRange.js +1 -1
- package/dist/{DateFieldSingle-DMjzOgf5.js → DateFieldSingle-DOJZRbkP.js} +4 -4
- package/dist/{DateFieldSingle-DMjzOgf5.js.map → DateFieldSingle-DOJZRbkP.js.map} +1 -1
- package/dist/DateFieldSingle.js +1 -1
- package/dist/{DateFieldYearless-DObHxquf.js → DateFieldYearless-BHGGAa4K.js} +4 -4
- package/dist/{DateFieldYearless-DObHxquf.js.map → DateFieldYearless-BHGGAa4K.js.map} +1 -1
- package/dist/DateFieldYearless.js +1 -1
- package/dist/{DateFieldYearlessRange-CGgc8wuL.js → DateFieldYearlessRange-CxEaZnI6.js} +3 -3
- package/dist/{DateFieldYearlessRange-CGgc8wuL.js.map → DateFieldYearlessRange-CxEaZnI6.js.map} +1 -1
- package/dist/DateFieldYearlessRange.js +1 -1
- package/dist/{DaysOfTheWeek-CxCsJPOI.js → DaysOfTheWeek-or-V9aOL.js} +3 -3
- package/dist/{DaysOfTheWeek-CxCsJPOI.js.map → DaysOfTheWeek-or-V9aOL.js.map} +1 -1
- package/dist/DaysOfTheWeek.js +1 -1
- package/dist/{Dialog-D0nVpLUN.js → Dialog-D7wWgUiC.js} +4 -4
- package/dist/{Dialog-D0nVpLUN.js.map → Dialog-D7wWgUiC.js.map} +1 -1
- package/dist/Dialog.js +1 -1
- package/dist/{DialogCancelButton-DKdPbZFu.js → DialogCancelButton-CIGGMaOE.js} +2 -2
- package/dist/{DialogCancelButton-DKdPbZFu.js.map → DialogCancelButton-CIGGMaOE.js.map} +1 -1
- package/dist/Dnd.js +2 -2
- package/dist/{DndHandleButton-Cj7pIegT.js → DndHandleButton-B_Geiaeb.js} +2 -2
- package/dist/{DndHandleButton-Cj7pIegT.js.map → DndHandleButton-B_Geiaeb.js.map} +1 -1
- package/dist/DndSort.js +3 -3
- package/dist/{Drawer-k6VSs33j.js → Drawer-rHhrkb8I.js} +4 -4
- package/dist/{Drawer-k6VSs33j.js.map → Drawer-rHhrkb8I.js.map} +1 -1
- package/dist/Drawer.js +1 -1
- package/dist/DrillDown.js +1 -1
- package/dist/{EditCard-B-CA6y8j.js → EditCard-BygUiJyq.js} +3 -3
- package/dist/{EditCard-B-CA6y8j.js.map → EditCard-BygUiJyq.js.map} +1 -1
- package/dist/EditCard.js +1 -1
- package/dist/{FieldLabel-Fu5hJMwQ.js → FieldLabel-BLH70tsq.js} +2 -2
- package/dist/{FieldLabel-Fu5hJMwQ.js.map → FieldLabel-BLH70tsq.js.map} +1 -1
- package/dist/FieldLabel.js +1 -1
- package/dist/{FilterBar-pK1K3u-K.js → FilterBar-kN4R0B_m.js} +7 -7
- package/dist/{FilterBar-pK1K3u-K.js.map → FilterBar-kN4R0B_m.js.map} +1 -1
- package/dist/FilterBar.js +1 -1
- package/dist/{InputMask-CoiA8nQO.js → InputMask-G9TeTPS8.js} +3 -3
- package/dist/{InputMask-CoiA8nQO.js.map → InputMask-G9TeTPS8.js.map} +1 -1
- package/dist/InputMask.js +1 -1
- package/dist/{ListView-l-S-D8xq.js → ListView-A4v-kbPH.js} +2 -2
- package/dist/{ListView-l-S-D8xq.js.map → ListView-A4v-kbPH.js.map} +1 -1
- package/dist/ListView.js +1 -1
- package/dist/{Listbox-D2LdclLc.js → Listbox-DTxGVQQ9.js} +2 -2
- package/dist/{Listbox-D2LdclLc.js.map → Listbox-DTxGVQQ9.js.map} +1 -1
- package/dist/Listbox.js +1 -1
- package/dist/{Menu-DIRJgAtb.js → Menu-BAya9Qnd.js} +2 -2
- package/dist/{Menu-DIRJgAtb.js.map → Menu-BAya9Qnd.js.map} +1 -1
- package/dist/Menu.js +1 -1
- package/dist/{MenuFooter-8BJxv5HH.js → MenuFooter-BZTsAaOz.js} +2 -2
- package/dist/{MenuFooter-8BJxv5HH.js.map → MenuFooter-BZTsAaOz.js.map} +1 -1
- package/dist/MultiSelectField.js +1 -1
- package/dist/{MultiSelectFieldSync-BHuikb4i.js → MultiSelectFieldSync-Zr6ObmiY.js} +7 -7
- package/dist/{MultiSelectFieldSync-BHuikb4i.js.map → MultiSelectFieldSync-Zr6ObmiY.js.map} +1 -1
- package/dist/MultiSelectMenu.js +1 -1
- package/dist/{MultiSelectMenuSync-pwUMDt4l.js → MultiSelectMenuSync-Cdsp2_ZA.js} +5 -5
- package/dist/{MultiSelectMenuSync-pwUMDt4l.js.map → MultiSelectMenuSync-Cdsp2_ZA.js.map} +1 -1
- package/dist/{NumberField-TQyVxw3T.js → NumberField-CigVFXzW.js} +4 -4
- package/dist/{NumberField-TQyVxw3T.js.map → NumberField-CigVFXzW.js.map} +1 -1
- package/dist/NumberField.js +1 -1
- package/dist/{Page-CV7kXuxd.js → Page-DMvEouPp.js} +10 -10
- package/dist/{Page-CV7kXuxd.js.map → Page-DMvEouPp.js.map} +1 -1
- package/dist/Page.js +1 -1
- package/dist/{Pagination-DocfPR17.js → Pagination-Bur581V_.js} +5 -5
- package/dist/{Pagination-DocfPR17.js.map → Pagination-Bur581V_.js.map} +1 -1
- package/dist/Pagination.js +1 -1
- package/dist/{Popover-JEE1iAsT.js → Popover-C-pv_ah6.js} +15 -2
- package/dist/Popover-C-pv_ah6.js.map +1 -0
- package/dist/Popover.js +1 -1
- package/dist/{ProgressBar-DAMwAbgw.js → ProgressBar-CJwF0L2j.js} +2 -2
- package/dist/{ProgressBar-DAMwAbgw.js.map → ProgressBar-CJwF0L2j.js.map} +1 -1
- package/dist/ProgressBar.js +1 -1
- package/dist/{Radio-D-TddAD8.js → Radio-CspG2mD_.js} +3 -3
- package/dist/{Radio-D-TddAD8.js.map → Radio-CspG2mD_.js.map} +1 -1
- package/dist/{Radio-BcxS2T20.js → Radio-DAsbQWNO.js} +2 -2
- package/dist/{Radio-BcxS2T20.js.map → Radio-DAsbQWNO.js.map} +1 -1
- package/dist/Radio.js +1 -1
- package/dist/{RichTextEditor-BnFo_55G.js → RichTextEditor-D1IBYQyU.js} +11 -11
- package/dist/{RichTextEditor-BnFo_55G.js.map → RichTextEditor-D1IBYQyU.js.map} +1 -1
- package/dist/RichTextEditor.js +1 -1
- package/dist/{SavedFiltersButton-CJo9E3-a.js → SavedFiltersButton-CtClXIW1.js} +10 -10
- package/dist/{SavedFiltersButton-CJo9E3-a.js.map → SavedFiltersButton-CtClXIW1.js.map} +1 -1
- package/dist/SavedFiltersButton.js +1 -1
- package/dist/{SelectCard-Bns0m-jY.js → SelectCard-Bk2JEIie.js} +3 -3
- package/dist/{SelectCard-Bns0m-jY.js.map → SelectCard-Bk2JEIie.js.map} +1 -1
- package/dist/SelectCard.js +1 -1
- package/dist/SelectField.js +1 -1
- package/dist/{SelectFieldLabel-BLZVhNgs.js → SelectFieldLabel-VLPS25_a.js} +2 -2
- package/dist/{SelectFieldLabel-BLZVhNgs.js.map → SelectFieldLabel-VLPS25_a.js.map} +1 -1
- package/dist/{SelectFieldSync-B__983Yd.js → SelectFieldSync-DO03WeCx.js} +6 -6
- package/dist/{SelectFieldSync-B__983Yd.js.map → SelectFieldSync-DO03WeCx.js.map} +1 -1
- package/dist/SelectMenu.js +1 -1
- package/dist/{SelectMenuSync-DI0ZSU4b.js → SelectMenuSync-DStox_Zy.js} +5 -5
- package/dist/{SelectMenuSync-DI0ZSU4b.js.map → SelectMenuSync-DStox_Zy.js.map} +1 -1
- package/dist/{SelectOptions-DTHVh2em.js → SelectOptions-DmqnJbq5.js} +2 -2
- package/dist/{SelectOptions-DTHVh2em.js.map → SelectOptions-DmqnJbq5.js.map} +1 -1
- package/dist/{SelectTrigger-CfiFs8q0.js → SelectTrigger-C--mlQPY.js} +2 -2
- package/dist/{SelectTrigger-CfiFs8q0.js.map → SelectTrigger-C--mlQPY.js.map} +1 -1
- package/dist/SelectTrigger.js +1 -1
- package/dist/{SelectTriggerBase-ibMt1vdq.js → SelectTriggerBase-DCdVK5FM.js} +4 -4
- package/dist/{SelectTriggerBase-ibMt1vdq.js.map → SelectTriggerBase-DCdVK5FM.js.map} +1 -1
- package/dist/{Stepper-C6kagSPw.js → Stepper-Bp5XkY2q.js} +2 -2
- package/dist/{Stepper-C6kagSPw.js.map → Stepper-Bp5XkY2q.js.map} +1 -1
- package/dist/Stepper.js +1 -1
- package/dist/{Switch-CddxqwQq.js → Switch-97v6BcuM.js} +2 -2
- package/dist/{Switch-CddxqwQq.js.map → Switch-97v6BcuM.js.map} +1 -1
- package/dist/Switch.js +1 -1
- package/dist/Table.js +1 -1
- package/dist/{Text-D9pGACpv.js → Text-CXf0c8th.js} +2 -2
- package/dist/{Text-D9pGACpv.js.map → Text-CXf0c8th.js.map} +1 -1
- package/dist/Text.js +1 -1
- package/dist/{TextField-BCsO3hjg.js → TextField-B_LS82U2.js} +2 -2
- package/dist/{TextField-BCsO3hjg.js.map → TextField-B_LS82U2.js.map} +1 -1
- package/dist/{TextField-qztk_Ivl.js → TextField-ttW-PfxW.js} +3 -3
- package/dist/{TextField-qztk_Ivl.js.map → TextField-ttW-PfxW.js.map} +1 -1
- package/dist/TextField.js +1 -1
- package/dist/{Textarea-BRbxK5zB.js → Textarea-B58yhkqk.js} +3 -3
- package/dist/{Textarea-BRbxK5zB.js.map → Textarea-B58yhkqk.js.map} +1 -1
- package/dist/Textarea.js +1 -1
- package/dist/{TimeField-D7JuCeWV.js → TimeField-CacCU22y.js} +4 -4
- package/dist/{TimeField-D7JuCeWV.js.map → TimeField-CacCU22y.js.map} +1 -1
- package/dist/TimeField.js +1 -1
- package/dist/Toast.js +2 -2
- package/dist/{Toaster-DGWxlVrT.js → Toaster-BMUQLR4X.js} +4 -4
- package/dist/{Toaster-DGWxlVrT.js.map → Toaster-BMUQLR4X.js.map} +1 -1
- package/dist/{Toaster-BE8-zVU_.js → Toaster-CggpDaEy.js} +2 -2
- package/dist/{Toaster-BE8-zVU_.js.map → Toaster-CggpDaEy.js.map} +1 -1
- package/dist/{Toolbar-Bj1cbM0Z.js → Toolbar-BObGbcb3.js} +6 -6
- package/dist/{Toolbar-Bj1cbM0Z.js.map → Toolbar-BObGbcb3.js.map} +1 -1
- package/dist/{Toolbar-nLRa6pYr.js → Toolbar-CGI7ilfn.js} +6 -6
- package/dist/{Toolbar-nLRa6pYr.js.map → Toolbar-CGI7ilfn.js.map} +1 -1
- package/dist/Toolbar.js +2 -2
- package/dist/{ToolbarButtonToggle-DaI6YeLV.js → ToolbarButtonToggle-DsaG1BWZ.js} +2 -2
- package/dist/{ToolbarButtonToggle-DaI6YeLV.js.map → ToolbarButtonToggle-DsaG1BWZ.js.map} +1 -1
- package/dist/TreeSelectField.js +1 -1
- package/dist/{TreeSelectFieldSync-B61EZhiW.js → TreeSelectFieldSync-BHSzJlYx.js} +6 -6
- package/dist/{TreeSelectFieldSync-B61EZhiW.js.map → TreeSelectFieldSync-BHSzJlYx.js.map} +1 -1
- package/dist/TreeSelectMenu.js +1 -1
- package/dist/{TreeSelectMenuSync-B0jTaUkT.js → TreeSelectMenuSync-BfYc8PHd.js} +4 -4
- package/dist/{TreeSelectMenuSync-B0jTaUkT.js.map → TreeSelectMenuSync-BfYc8PHd.js.map} +1 -1
- package/dist/{TypeaheadTextField-DQmEFEBL.js → TypeaheadTextField-DU10rQHH.js} +3 -3
- package/dist/{TypeaheadTextField-DQmEFEBL.js.map → TypeaheadTextField-DU10rQHH.js.map} +1 -1
- package/dist/TypeaheadTextField.js +1 -1
- package/dist/{YearlessDateInputWithPicker-gPopOijG.js → YearlessDateInputWithPicker-DtikVrWk.js} +2 -2
- package/dist/{YearlessDateInputWithPicker-gPopOijG.js.map → YearlessDateInputWithPicker-DtikVrWk.js.map} +1 -1
- package/dist/beta.js +16 -16
- package/dist/{filter-state-TODQ_3Dx.js → filter-state-BL17jEUz.js} +43 -31
- package/dist/filter-state-BL17jEUz.js.map +1 -0
- package/dist/{index-iTige6rD.js → index-Bg9IAYMO.js} +2 -2
- package/dist/{index-iTige6rD.js.map → index-Bg9IAYMO.js.map} +1 -1
- package/dist/{index-D2ybh-FH.js → index-Deyzt7C3.js} +2 -2
- package/dist/{index-D2ybh-FH.js.map → index-Deyzt7C3.js.map} +1 -1
- package/dist/index.js +48 -48
- package/dist/src/beta/components/FilterBar/internal/types.d.ts +9 -3
- package/dist/src/beta/components/FilterBar/internal/utils/dateListLibraryOptions.d.ts +12 -6
- package/dist/src/internal/components/Popover/internal/PopoverContext.d.ts +2 -0
- package/dist/{stripInlineMarkdown-CIYBRFbl.js → stripInlineMarkdown-D8j76cz_.js} +2 -2
- package/dist/{stripInlineMarkdown-CIYBRFbl.js.map → stripInlineMarkdown-D8j76cz_.js.map} +1 -1
- package/dist/{syncFilterUtils-BwxAsKjG.js → syncFilterUtils-DV1H8ZIz.js} +4 -4
- package/dist/{syncFilterUtils-BwxAsKjG.js.map → syncFilterUtils-DV1H8ZIz.js.map} +1 -1
- package/dist/{treeSync-SwmUBJwF.js → treeSync-DluwQlVs.js} +3 -3
- package/dist/{treeSync-SwmUBJwF.js.map → treeSync-DluwQlVs.js.map} +1 -1
- package/dist/{useAdaptiveView-Bt1axQ6s.js → useAdaptiveView-0Cd-y9FC.js} +4 -4
- package/dist/{useAdaptiveView-Bt1axQ6s.js.map → useAdaptiveView-0Cd-y9FC.js.map} +1 -1
- package/dist/{useDrilldown-X85I7E2L.js → useDrilldown-C5jP2l0a.js} +3 -3
- package/dist/{useDrilldown-X85I7E2L.js.map → useDrilldown-C5jP2l0a.js.map} +1 -1
- package/dist/{useInfiniteCombobox-CmR1G9VN.js → useInfiniteCombobox-BlP6jZ6d.js} +4 -4
- package/dist/{useInfiniteCombobox-CmR1G9VN.js.map → useInfiniteCombobox-BlP6jZ6d.js.map} +1 -1
- package/dist/{useToggleSelection-Cv_6Wnbc.js → useToggleSelection-qzKkgwTj.js} +2 -2
- package/dist/{useToggleSelection-Cv_6Wnbc.js.map → useToggleSelection-qzKkgwTj.js.map} +1 -1
- package/package.json +1 -1
- package/dist/Button.module-y-kLMLvt.js +0 -23
- package/dist/Button.module-y-kLMLvt.js.map +0 -1
- package/dist/Popover-JEE1iAsT.js.map +0 -1
- package/dist/filter-state-TODQ_3Dx.js.map +0 -1
package/dist/Button.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.anvil2 {.
|
|
1
|
+
.anvil2 {._button_1llbs_1 {
|
|
2
2
|
--a2-internal-button-background-color: var(--a2-mod-button-background-color);
|
|
3
3
|
--a2-internal-button-foreground-color: var(--a2-mod-button-foreground-color);
|
|
4
4
|
--a2-mod-button-background-color: var(--a2-button-secondary-background-color, var(--a2-background-color-secondary, light-dark(rgba(4, 4, 4, 0.0588235294), rgba(255, 255, 255, 0.0784313725))));
|
|
@@ -80,23 +80,23 @@
|
|
|
80
80
|
transition: outline var(--a2-duration-default, 200ms) var(--a2-transition-ease-out, cubic-bezier(0, 0, 0.4, 1)), background-color var(--a2-duration-default, 200ms) var(--a2-transition-ease-out, cubic-bezier(0, 0, 0.4, 1));
|
|
81
81
|
width: var(--a2-mod-button-width, -moz-fit-content);
|
|
82
82
|
width: var(--a2-mod-button-width, fit-content);
|
|
83
|
-
}.
|
|
83
|
+
}._button_1llbs_1:not(:disabled, [aria-disabled=true])[data-interactive=focus-visible], ._button_1llbs_1:not(:disabled, [aria-disabled=true]):focus-visible {
|
|
84
84
|
--a2-mod-button-outline-width: var(--a2-size-half, 0.125rem);
|
|
85
|
-
}.
|
|
85
|
+
}._button_1llbs_1[data-interactive=hover]:not(:disabled, [aria-disabled=true]), ._button_1llbs_1:hover:not(:disabled, [aria-disabled=true]) {
|
|
86
86
|
--a2-internal-button-background-color: var(
|
|
87
87
|
--a2-mod-button-background-color-hover
|
|
88
88
|
);
|
|
89
89
|
--a2-internal-button-foreground-color: var(
|
|
90
90
|
--a2-mod-button-foreground-color-hover
|
|
91
91
|
);
|
|
92
|
-
}.
|
|
92
|
+
}._button_1llbs_1[data-interactive=active]:not(:disabled, [aria-disabled=true]), ._button_1llbs_1:active:not(:disabled, [aria-disabled=true]) {
|
|
93
93
|
--a2-internal-button-background-color: var(
|
|
94
94
|
--a2-mod-button-background-color-active
|
|
95
95
|
);
|
|
96
96
|
--a2-internal-button-foreground-color: var(
|
|
97
97
|
--a2-mod-button-foreground-color-active
|
|
98
98
|
);
|
|
99
|
-
}.
|
|
99
|
+
}._button_1llbs_1[aria-disabled=true], ._button_1llbs_1:disabled {
|
|
100
100
|
--a2-mod-button-background-color: var(
|
|
101
101
|
--a2-mod-button-background-color-disabled
|
|
102
102
|
);
|
|
@@ -106,11 +106,11 @@
|
|
|
106
106
|
--a2-mod-button-foreground-color-disabled
|
|
107
107
|
);
|
|
108
108
|
opacity: var(--a2-opacity-disabled, 0.6);
|
|
109
|
-
}.
|
|
109
|
+
}._loading_1llbs_113 {
|
|
110
110
|
--a2-mod-button-cursor: progress;
|
|
111
|
-
}._loading-
|
|
111
|
+
}._loading-spinner_1llbs_117 {
|
|
112
112
|
--a2-mod-spinner-height: var(--a2-size-4, 1rem);
|
|
113
|
-
}._size-
|
|
113
|
+
}._size-xsmall_1llbs_121 {
|
|
114
114
|
--a2-mod-button-font-size: var(--a2-size-3, 0.75rem);
|
|
115
115
|
--a2-mod-button-line-height: var(--a2-size-4, 1rem);
|
|
116
116
|
--a2-mod-button-padding-block-end: var(--a2-mod-button-padding-xsmall-block);
|
|
@@ -123,7 +123,7 @@
|
|
|
123
123
|
--a2-mod-button-padding-inline-end: var(
|
|
124
124
|
--a2-mod-button-padding-xsmall-inline
|
|
125
125
|
);
|
|
126
|
-
}._size-
|
|
126
|
+
}._size-small_1llbs_136 {
|
|
127
127
|
--a2-mod-button-font-size: calc(var(--a2-size-3, 0.75rem) + var(--a2-size-half, 0.125rem));
|
|
128
128
|
--a2-mod-button-line-height: var(--a2-size-4, 1rem);
|
|
129
129
|
--a2-mod-button-padding-block-end: var(--a2-mod-button-padding-small-block);
|
|
@@ -132,7 +132,7 @@
|
|
|
132
132
|
--a2-mod-button-padding-small-inline
|
|
133
133
|
);
|
|
134
134
|
--a2-mod-button-padding-inline-end: var(--a2-mod-button-padding-small-inline);
|
|
135
|
-
}._size-
|
|
135
|
+
}._size-medium_1llbs_147 {
|
|
136
136
|
--a2-mod-button-font-size: var(--a2-size-4, 1rem);
|
|
137
137
|
--a2-mod-button-line-height: var(--a2-size-4, 1rem);
|
|
138
138
|
--a2-mod-button-padding-block-end: var(--a2-mod-button-padding-medium-block);
|
|
@@ -145,7 +145,7 @@
|
|
|
145
145
|
--a2-mod-button-padding-inline-end: var(
|
|
146
146
|
--a2-mod-button-padding-medium-inline
|
|
147
147
|
);
|
|
148
|
-
}._size-
|
|
148
|
+
}._size-large_1llbs_162 {
|
|
149
149
|
--a2-mod-button-font-size: var(--a2-size-4, 1rem);
|
|
150
150
|
--a2-mod-button-line-height: var(--a2-size-4, 1rem);
|
|
151
151
|
--a2-mod-button-padding-block-end: var(--a2-mod-button-padding-large-block);
|
|
@@ -154,7 +154,7 @@
|
|
|
154
154
|
--a2-mod-button-padding-large-inline
|
|
155
155
|
);
|
|
156
156
|
--a2-mod-button-padding-inline-end: var(--a2-mod-button-padding-large-inline);
|
|
157
|
-
}._appearance-
|
|
157
|
+
}._appearance-primary_1llbs_173 {
|
|
158
158
|
--a2-mod-button-background-color: var(--a2-button-primary-background-color, var(--a2-background-color-primary, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
|
|
159
159
|
--a2-mod-button-background-color-active: var(--a2-button-primary-background-color-active, var(--a2-background-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-100, #cce3ff))));
|
|
160
160
|
--a2-mod-button-background-color-disabled: var(--a2-button-primary-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
|
|
@@ -166,7 +166,7 @@
|
|
|
166
166
|
--a2-mod-button-foreground-color-active: var(--a2-button-primary-foreground-color-active, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
|
|
167
167
|
--a2-mod-button-foreground-color-disabled: var(--a2-button-primary-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
|
|
168
168
|
--a2-mod-button-foreground-color-hover: var(--a2-button-primary-foreground-color-hover, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
|
|
169
|
-
}._appearance-
|
|
169
|
+
}._appearance-secondary_1llbs_187 {
|
|
170
170
|
--a2-mod-button-background-color: var(--a2-button-secondary-background-color, var(--a2-background-color-secondary, light-dark(rgba(4, 4, 4, 0.0588235294), rgba(255, 255, 255, 0.0784313725))));
|
|
171
171
|
--a2-mod-button-background-color-active: var(--a2-button-secondary-background-color-active, var(--a2-background-color-secondary-active, light-dark(rgba(4, 4, 4, 0.1607843137), rgba(255, 255, 255, 0.1607843137))));
|
|
172
172
|
--a2-mod-button-background-color-disabled: var(--a2-button-secondary-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
|
|
@@ -178,7 +178,7 @@
|
|
|
178
178
|
--a2-mod-button-foreground-color-active: var(--a2-button-secondary-foreground-color-active, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
|
|
179
179
|
--a2-mod-button-foreground-color-disabled: var(--a2-button-secondary-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
|
|
180
180
|
--a2-mod-button-foreground-color-hover: var(--a2-button-secondary-foreground-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
|
|
181
|
-
}._appearance-
|
|
181
|
+
}._appearance-ghost_1llbs_201 {
|
|
182
182
|
--a2-mod-button-background-color: var(--a2-button-ghost-background-color, rgba(0, 0, 0, 0));
|
|
183
183
|
--a2-mod-button-background-color-active: var(--a2-button-ghost-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(rgba(139, 139, 139, 0.1607843137), rgba(255, 255, 255, 0.1607843137))));
|
|
184
184
|
--a2-mod-button-background-color-disabled: var(--a2-button-ghost-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
|
|
@@ -190,7 +190,7 @@
|
|
|
190
190
|
--a2-mod-button-foreground-color-active: var(--a2-button-ghost-foreground-color-active, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
|
|
191
191
|
--a2-mod-button-foreground-color-disabled: var(--a2-button-ghost-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
|
|
192
192
|
--a2-mod-button-foreground-color-hover: var(--a2-button-ghost-foreground-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
|
|
193
|
-
}._danger-
|
|
193
|
+
}._danger-primary_1llbs_215 {
|
|
194
194
|
--a2-mod-button-background-color: var(--a2-button-danger-primary-background-color, var(--a2-background-color-danger, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)))));
|
|
195
195
|
--a2-mod-button-background-color-active: var(--a2-button-danger-primary-background-color-active, var(--a2-background-color-danger-active, light-dark(var(--a2-color-red-800, #731100), var(--a2-color-red-200, #ffac9e))));
|
|
196
196
|
--a2-mod-button-background-color-disabled: var(--a2-button-danger-primary-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
|
|
@@ -202,7 +202,7 @@
|
|
|
202
202
|
--a2-mod-button-foreground-color-active: var(--a2-button-danger-primary-foreground-color-active, var(--a2-foreground-color-on-danger, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
|
|
203
203
|
--a2-mod-button-foreground-color-disabled: var(--a2-button-danger-primary-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
|
|
204
204
|
--a2-mod-button-foreground-color-hover: var(--a2-button-danger-primary-foreground-color-hover, var(--a2-foreground-color-on-danger, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
|
|
205
|
-
}._danger-
|
|
205
|
+
}._danger-secondary_1llbs_229 {
|
|
206
206
|
--a2-mod-button-background-color: var(--a2-button-danger-secondary-background-color, var(--a2-background-color-danger-subdued, light-dark(var(--a2-color-red-50, #ffe9e5), rgba(255, 134, 112, 0.2))));
|
|
207
207
|
--a2-mod-button-background-color-active: var(--a2-button-danger-secondary-background-color-active, var(--a2-background-color-danger-subdued-active, light-dark(var(--a2-color-red-200, #ffac9e), rgba(255, 134, 112, 0.4))));
|
|
208
208
|
--a2-mod-button-background-color-disabled: var(--a2-button-danger-secondary-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
|
|
@@ -214,7 +214,7 @@
|
|
|
214
214
|
--a2-mod-button-foreground-color-active: var(--a2-button-danger-secondary-foreground-color-active, var(--a2-foreground-color-on-danger-subdued-active, light-dark(var(--a2-color-red-900, #470b00), var(--a2-color-neutral-0, #ffffff))));
|
|
215
215
|
--a2-mod-button-foreground-color-disabled: var(--a2-button-danger-secondary-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
|
|
216
216
|
--a2-mod-button-foreground-color-hover: var(--a2-button-danger-secondary-foreground-color-hover, var(--a2-foreground-color-on-danger-subdued-hover, light-dark(var(--a2-color-red-800, #731100), var(--a2-color-neutral-0, #ffffff))));
|
|
217
|
-
}._size-xsmall-
|
|
217
|
+
}._size-xsmall-icon_1llbs_243 {
|
|
218
218
|
--a2-mod-button-min-width: auto;
|
|
219
219
|
--a2-mod-button-padding-block-end: var(
|
|
220
220
|
--a2-mod-button-type-icon-padding-xsmall
|
|
@@ -228,7 +228,7 @@
|
|
|
228
228
|
--a2-mod-button-padding-inline-end: var(
|
|
229
229
|
--a2-mod-button-type-icon-padding-xsmall
|
|
230
230
|
);
|
|
231
|
-
}._size-small-
|
|
231
|
+
}._size-small-icon_1llbs_259 {
|
|
232
232
|
--a2-mod-button-min-width: auto;
|
|
233
233
|
--a2-mod-button-padding-block-end: var(
|
|
234
234
|
--a2-mod-button-type-icon-padding-small-medium
|
|
@@ -242,7 +242,7 @@
|
|
|
242
242
|
--a2-mod-button-padding-inline-end: var(
|
|
243
243
|
--a2-mod-button-type-icon-padding-small-medium
|
|
244
244
|
);
|
|
245
|
-
}._size-medium-
|
|
245
|
+
}._size-medium-icon_1llbs_275 {
|
|
246
246
|
--a2-mod-button-min-width: auto;
|
|
247
247
|
--a2-mod-button-padding-block-end: var(
|
|
248
248
|
--a2-mod-button-type-icon-padding-small-medium
|
|
@@ -256,7 +256,7 @@
|
|
|
256
256
|
--a2-mod-button-padding-inline-end: var(
|
|
257
257
|
--a2-mod-button-type-icon-padding-small-medium
|
|
258
258
|
);
|
|
259
|
-
}._size-large-
|
|
259
|
+
}._size-large-icon_1llbs_291 {
|
|
260
260
|
--a2-mod-button-min-width: auto;
|
|
261
261
|
--a2-mod-button-padding-block-end: var(
|
|
262
262
|
--a2-mod-button-type-icon-padding-large
|
|
@@ -270,7 +270,7 @@
|
|
|
270
270
|
--a2-mod-button-padding-inline-end: var(
|
|
271
271
|
--a2-mod-button-type-icon-padding-large
|
|
272
272
|
);
|
|
273
|
-
}a.
|
|
273
|
+
}a._button_1llbs_1 {
|
|
274
274
|
color: var(--a2-internal-button-foreground-color) !important;
|
|
275
275
|
}
|
|
276
276
|
}
|
package/dist/Button.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { B as Button, B as default } from './Button-
|
|
1
|
+
export { B as Button, B as default } from './Button-CjeF1Agb.js';
|
|
2
2
|
//# sourceMappingURL=Button.js.map
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import './Button.css';const button = "_button_1llbs_1";
|
|
2
|
+
const loading = "_loading_1llbs_113";
|
|
3
|
+
const styles = {
|
|
4
|
+
button: button,
|
|
5
|
+
loading: loading,
|
|
6
|
+
"loading-spinner": "_loading-spinner_1llbs_117",
|
|
7
|
+
"size-xsmall": "_size-xsmall_1llbs_121",
|
|
8
|
+
"size-small": "_size-small_1llbs_136",
|
|
9
|
+
"size-medium": "_size-medium_1llbs_147",
|
|
10
|
+
"size-large": "_size-large_1llbs_162",
|
|
11
|
+
"appearance-primary": "_appearance-primary_1llbs_173",
|
|
12
|
+
"appearance-secondary": "_appearance-secondary_1llbs_187",
|
|
13
|
+
"appearance-ghost": "_appearance-ghost_1llbs_201",
|
|
14
|
+
"danger-primary": "_danger-primary_1llbs_215",
|
|
15
|
+
"danger-secondary": "_danger-secondary_1llbs_229",
|
|
16
|
+
"size-xsmall-icon": "_size-xsmall-icon_1llbs_243",
|
|
17
|
+
"size-small-icon": "_size-small-icon_1llbs_259",
|
|
18
|
+
"size-medium-icon": "_size-medium-icon_1llbs_275",
|
|
19
|
+
"size-large-icon": "_size-large-icon_1llbs_291"
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
export { styles as s };
|
|
23
|
+
//# sourceMappingURL=Button.module-BuOc7iPY.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.module-BuOc7iPY.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
3
|
import { c as cx } from './index-De1g9FRV.js';
|
|
4
|
-
import { s as styles$1 } from './Button.module-
|
|
4
|
+
import { s as styles$1 } from './Button.module-BuOc7iPY.js';
|
|
5
5
|
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjqeAJZ9.js';
|
|
6
6
|
import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
|
|
7
7
|
import { useTrackingId } from './useTrackingId.js';
|
|
@@ -68,4 +68,4 @@ const ButtonCompound = forwardRef(
|
|
|
68
68
|
ButtonCompound.displayName = "ButtonCompound";
|
|
69
69
|
|
|
70
70
|
export { ButtonCompound as B };
|
|
71
|
-
//# sourceMappingURL=ButtonCompound-
|
|
71
|
+
//# sourceMappingURL=ButtonCompound-D7kA0qXr.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonCompound-
|
|
1
|
+
{"version":3,"file":"ButtonCompound-D7kA0qXr.js","sources":["../src/components/ButtonCompound/ButtonCompound.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, Ref, forwardRef } from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport { DataTrackingId, LayoutUtilProps } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\nimport cx from \"classnames\";\nimport buttonStyles from \"../Button/Button.module.scss\";\nimport styles from \"./ButtonCompound.module.scss\";\n\n/**\n * Props for the ButtonCompound component\n * @extends LayoutUtilProps\n * @extends ComponentPropsWithoutRef<\"button\">\n */\nexport type ButtonCompoundProps = LayoutUtilProps &\n ComponentPropsWithoutRef<\"button\"> & {\n /**\n * The shape of the compound button.\n * @default rounded\n */\n shape?: \"pill\" | \"circular\" | \"rounded\";\n } &\n /**\n * Data tracking id\n */\n DataTrackingId;\n\n/**\n * ButtonCompound component for creating compound button layouts.\n *\n * Features:\n * - Three shape options (pill, circular, rounded)\n * - Transparent background for compound layouts\n * - Supports layout utilities for positioning and spacing\n * - Full accessibility support with proper ARIA attributes\n * - Flexible content support\n * - Consistent styling with other button components\n * - Hover and active state management\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonCompound shape=\"circular\">\n * <Avatar name=\"John Doe\" />\n * </ButtonCompound>\n */\nexport const ButtonCompound = forwardRef(\n (props: ButtonCompoundProps, ref: Ref<HTMLButtonElement>) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const {\n className,\n shape = \"rounded\",\n type,\n disabled,\n children,\n style,\n ...rest\n } = componentProps;\n\n const data = {\n children: childrenToString(props.children),\n shape,\n type,\n };\n\n const trackingId = useTrackingId({\n name: \"ButtonCompound\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const buttonClassNames = cx(\n className,\n buttonStyles[\"button\"],\n styles[\"button-compound\"],\n {\n [styles[\"shape-pill\"]]: shape === \"pill\",\n [styles[\"shape-circular\"]]: shape === \"circular\",\n [styles[\"shape-rounded\"]]: shape === \"rounded\",\n },\n );\n\n const styleCombined = {\n ...style,\n ...layoutStyles,\n };\n\n return (\n <button\n data-tracking-id={trackingId}\n className={buttonClassNames}\n type={type}\n disabled={disabled}\n data-anv=\"button-compound\"\n ref={ref}\n style={styleCombined}\n {...rest}\n >\n {children}\n </button>\n );\n },\n);\n\nButtonCompound.displayName = \"ButtonCompound\";\n"],"names":["buttonStyles"],"mappings":";;;;;;;;;;;;;;;AA8CO,MAAM,cAAA,GAAiB,UAAA;AAAA,EAC5B,CAAC,OAA4B,GAAA,KAAgC;AAC3D,IAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,KAAA,GAAQ,SAAA;AAAA,MACR,IAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,QAAA,EAAU,gBAAA,CAAiB,KAAA,CAAM,QAAQ,CAAA;AAAA,MACzC,KAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,gBAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AAED,IAAA,MAAM,gBAAA,GAAmB,EAAA;AAAA,MACvB,SAAA;AAAA,MACAA,SAAa,QAAQ,CAAA;AAAA,MACrB,OAAO,iBAAiB,CAAA;AAAA,MACxB;AAAA,QACE,CAAC,MAAA,CAAO,YAAY,CAAC,GAAG,KAAA,KAAU,MAAA;AAAA,QAClC,CAAC,MAAA,CAAO,gBAAgB,CAAC,GAAG,KAAA,KAAU,UAAA;AAAA,QACtC,CAAC,MAAA,CAAO,eAAe,CAAC,GAAG,KAAA,KAAU;AAAA;AACvC,KACF;AAEA,IAAA,MAAM,aAAA,GAAgB;AAAA,MACpB,GAAG,KAAA;AAAA,MACH,GAAG;AAAA,KACL;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,kBAAA,EAAkB,UAAA;AAAA,QAClB,SAAA,EAAW,gBAAA;AAAA,QACX,IAAA;AAAA,QACA,QAAA;AAAA,QACA,UAAA,EAAS,iBAAA;AAAA,QACT,GAAA;AAAA,QACA,KAAA,EAAO,aAAA;AAAA,QACN,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,cAAA,CAAe,WAAA,GAAc,gBAAA;;;;"}
|
package/dist/ButtonCompound.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { B as ButtonCompound, B as default } from './ButtonCompound-
|
|
1
|
+
export { B as ButtonCompound, B as default } from './ButtonCompound-D7kA0qXr.js';
|
|
2
2
|
//# sourceMappingURL=ButtonCompound.js.map
|
|
@@ -3,7 +3,7 @@ import { forwardRef } from 'react';
|
|
|
3
3
|
import { I as Icon } from './Icon-BEwHECSM.js';
|
|
4
4
|
import { S as Spinner } from './Spinner-B7tTWcP6.js';
|
|
5
5
|
import { c as cx } from './index-De1g9FRV.js';
|
|
6
|
-
import { s as styles } from './Button.module-
|
|
6
|
+
import { s as styles } from './Button.module-BuOc7iPY.js';
|
|
7
7
|
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjqeAJZ9.js';
|
|
8
8
|
import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
|
|
9
9
|
import { useTrackingId } from './useTrackingId.js';
|
|
@@ -137,4 +137,4 @@ const ButtonLink = forwardRef(
|
|
|
137
137
|
ButtonLink.displayName = "ButtonLink";
|
|
138
138
|
|
|
139
139
|
export { ButtonLink as B };
|
|
140
|
-
//# sourceMappingURL=ButtonLink-
|
|
140
|
+
//# sourceMappingURL=ButtonLink-BSReBbc3.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonLink-CWbYzTTz.js","sources":["../src/components/ButtonLink/ButtonLink.tsx"],"sourcesContent":["import {\n ComponentPropsWithoutRef,\n KeyboardEvent,\n MouseEvent,\n Ref,\n forwardRef,\n} from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport {\n DataTrackingId,\n ButtonAppearance,\n LayoutUtilProps,\n Size,\n} from \"../../types\";\nimport Icon, { IconProps } from \"../Icon\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport Spinner from \"../Spinner\";\n\nimport cx from \"classnames\";\nimport styles from \"../Button/Button.module.scss\";\n\n/**\n * Props for the ButtonLink component\n * @extends LayoutUtilProps\n * @extends ComponentPropsWithoutRef<\"a\">\n */\nexport type ButtonLinkProps = LayoutUtilProps &\n ComponentPropsWithoutRef<\"a\"> & {\n /**\n * The disabled state of the button link.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * The visual variant of the button link.\n * @default secondary\n */\n appearance?: ButtonAppearance;\n\n /**\n * The size of the button link.\n * @default medium\n */\n size?: Extract<Size, \"xsmall\" | \"small\" | \"medium\" | \"large\">;\n\n /**\n * The icons of the button link.\n */\n icon?:\n | IconProps[\"svg\"]\n | {\n after: IconProps[\"svg\"];\n }\n | {\n before: IconProps[\"svg\"];\n };\n\n /**\n * The loading state of the button link.\n * If true, it will show infinite state of the loading.\n * @default false\n */\n loading?: boolean;\n } &\n /**\n * Data tracking id\n */\n DataTrackingId;\n\n/**\n * ButtonLink component for creating clickable links that look like buttons.\n *\n * Features:\n * - Multiple visual appearances (primary, secondary, ghost, danger variants)\n * - Four size options (xsmall, small, medium, large)\n * - Loading state with spinner animation\n * - Icon support (before, after, or icon-only)\n * - Full accessibility support with proper ARIA attributes\n * - Supports layout utilities for positioning and spacing\n * - Keyboard navigation support (Space and Enter keys)\n * - Automatic disabled state when loading\n * - Prevents navigation when disabled or loading\n * - Flexible content with text and/or icons\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonLink href=\"/dashboard\" appearance=\"primary\" size=\"medium\">\n * Go to Dashboard\n * </ButtonLink>\n */\nexport const ButtonLink = forwardRef(\n (props: ButtonLinkProps, ref: Ref<HTMLAnchorElement>) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n\n const {\n children,\n className,\n appearance = \"secondary\",\n size = \"medium\",\n icon,\n loading = false,\n disabled,\n onClick,\n onKeyUp,\n onKeyDown,\n style,\n href,\n type,\n ...rest\n } = componentProps;\n\n const data = {\n children: childrenToString(props.children),\n appearance,\n href,\n icon,\n size,\n type,\n };\n\n const iconBefore = (icon: ButtonLinkProps[\"icon\"]) => {\n if (icon && typeof icon === \"object\" && \"before\" in icon) {\n return (\n <Icon\n aria-hidden\n className={styles[\"icon\"]}\n inherit\n svg={icon.before}\n />\n );\n }\n if (icon && typeof icon !== \"object\") {\n return (\n <Icon aria-hidden className={styles[\"icon\"]} inherit svg={icon} />\n );\n }\n return;\n };\n\n const handleOnClick = (e: MouseEvent<HTMLAnchorElement>) => {\n if (disabled || loading) {\n e.preventDefault();\n return;\n }\n onClick?.(e);\n };\n\n const onKeyDownHandler = (e: KeyboardEvent<HTMLAnchorElement>) => {\n if (e.code === \"Space\") {\n e.preventDefault();\n onKeyDown?.(e);\n return;\n }\n\n onKeyDown?.(e);\n };\n\n const onKeyUpHandler = (e: KeyboardEvent<HTMLAnchorElement>) => {\n if (e.code === \"Space\" || e.code === \"Enter\") {\n e.preventDefault();\n if (onClick) {\n e.currentTarget.click();\n }\n }\n\n onKeyUp?.(e);\n };\n\n const trackingId = useTrackingId({\n name: \"ButtonLink\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const buttonClassNames = cx(className, styles[\"button\"], {\n [styles[\"appearance-primary\"]]: appearance === \"primary\",\n [styles[\"appearance-secondary\"]]: appearance === \"secondary\",\n [styles[\"appearance-ghost\"]]: appearance === \"ghost\",\n [styles[\"danger-secondary\"]]: appearance === \"danger-secondary\",\n [styles[\"danger-primary\"]]: appearance === \"danger\",\n [styles[\"size-xsmall\"]]: size === \"xsmall\",\n [styles[\"size-small\"]]: size === \"small\",\n [styles[\"size-medium\"]]: size === \"medium\",\n [styles[\"size-large\"]]: size === \"large\",\n [styles[\"size-xsmall-icon\"]]: size === \"xsmall\" && !children,\n [styles[\"size-small-icon\"]]: size === \"small\" && !children,\n [styles[\"size-medium-icon\"]]: size === \"medium\" && !children,\n [styles[\"size-large-icon\"]]: size === \"large\" && !children,\n [styles[\"loading\"]]: loading,\n });\n\n const styleCombined = {\n ...style,\n ...layoutStyles,\n };\n\n return (\n <a\n data-tracking-id={trackingId}\n className={buttonClassNames}\n aria-disabled={disabled || loading}\n aria-busy={loading}\n data-anv=\"button-link\"\n tabIndex={disabled || loading ? -1 : 0}\n onClick={handleOnClick}\n onKeyDown={onKeyDownHandler}\n onKeyUp={onKeyUpHandler}\n style={styleCombined}\n ref={ref}\n href={href}\n {...rest}\n >\n {loading ? (\n <Spinner inherit size=\"small\" className={styles[\"loading-spinner\"]} />\n ) : icon ? (\n iconBefore(icon)\n ) : null}\n {children}\n {typeof icon === \"object\" && \"after\" in icon ? (\n <Icon\n className={styles[\"icon\"]}\n inherit\n aria-hidden\n svg={icon.after}\n />\n ) : null}\n </a>\n );\n },\n);\n\nButtonLink.displayName = \"ButtonLink\";\n"],"names":["icon"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ButtonLink-BSReBbc3.js","sources":["../src/components/ButtonLink/ButtonLink.tsx"],"sourcesContent":["import {\n ComponentPropsWithoutRef,\n KeyboardEvent,\n MouseEvent,\n Ref,\n forwardRef,\n} from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport {\n DataTrackingId,\n ButtonAppearance,\n LayoutUtilProps,\n Size,\n} from \"../../types\";\nimport Icon, { IconProps } from \"../Icon\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport Spinner from \"../Spinner\";\n\nimport cx from \"classnames\";\nimport styles from \"../Button/Button.module.scss\";\n\n/**\n * Props for the ButtonLink component\n * @extends LayoutUtilProps\n * @extends ComponentPropsWithoutRef<\"a\">\n */\nexport type ButtonLinkProps = LayoutUtilProps &\n ComponentPropsWithoutRef<\"a\"> & {\n /**\n * The disabled state of the button link.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * The visual variant of the button link.\n * @default secondary\n */\n appearance?: ButtonAppearance;\n\n /**\n * The size of the button link.\n * @default medium\n */\n size?: Extract<Size, \"xsmall\" | \"small\" | \"medium\" | \"large\">;\n\n /**\n * The icons of the button link.\n */\n icon?:\n | IconProps[\"svg\"]\n | {\n after: IconProps[\"svg\"];\n }\n | {\n before: IconProps[\"svg\"];\n };\n\n /**\n * The loading state of the button link.\n * If true, it will show infinite state of the loading.\n * @default false\n */\n loading?: boolean;\n } &\n /**\n * Data tracking id\n */\n DataTrackingId;\n\n/**\n * ButtonLink component for creating clickable links that look like buttons.\n *\n * Features:\n * - Multiple visual appearances (primary, secondary, ghost, danger variants)\n * - Four size options (xsmall, small, medium, large)\n * - Loading state with spinner animation\n * - Icon support (before, after, or icon-only)\n * - Full accessibility support with proper ARIA attributes\n * - Supports layout utilities for positioning and spacing\n * - Keyboard navigation support (Space and Enter keys)\n * - Automatic disabled state when loading\n * - Prevents navigation when disabled or loading\n * - Flexible content with text and/or icons\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonLink href=\"/dashboard\" appearance=\"primary\" size=\"medium\">\n * Go to Dashboard\n * </ButtonLink>\n */\nexport const ButtonLink = forwardRef(\n (props: ButtonLinkProps, ref: Ref<HTMLAnchorElement>) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n\n const {\n children,\n className,\n appearance = \"secondary\",\n size = \"medium\",\n icon,\n loading = false,\n disabled,\n onClick,\n onKeyUp,\n onKeyDown,\n style,\n href,\n type,\n ...rest\n } = componentProps;\n\n const data = {\n children: childrenToString(props.children),\n appearance,\n href,\n icon,\n size,\n type,\n };\n\n const iconBefore = (icon: ButtonLinkProps[\"icon\"]) => {\n if (icon && typeof icon === \"object\" && \"before\" in icon) {\n return (\n <Icon\n aria-hidden\n className={styles[\"icon\"]}\n inherit\n svg={icon.before}\n />\n );\n }\n if (icon && typeof icon !== \"object\") {\n return (\n <Icon aria-hidden className={styles[\"icon\"]} inherit svg={icon} />\n );\n }\n return;\n };\n\n const handleOnClick = (e: MouseEvent<HTMLAnchorElement>) => {\n if (disabled || loading) {\n e.preventDefault();\n return;\n }\n onClick?.(e);\n };\n\n const onKeyDownHandler = (e: KeyboardEvent<HTMLAnchorElement>) => {\n if (e.code === \"Space\") {\n e.preventDefault();\n onKeyDown?.(e);\n return;\n }\n\n onKeyDown?.(e);\n };\n\n const onKeyUpHandler = (e: KeyboardEvent<HTMLAnchorElement>) => {\n if (e.code === \"Space\" || e.code === \"Enter\") {\n e.preventDefault();\n if (onClick) {\n e.currentTarget.click();\n }\n }\n\n onKeyUp?.(e);\n };\n\n const trackingId = useTrackingId({\n name: \"ButtonLink\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const buttonClassNames = cx(className, styles[\"button\"], {\n [styles[\"appearance-primary\"]]: appearance === \"primary\",\n [styles[\"appearance-secondary\"]]: appearance === \"secondary\",\n [styles[\"appearance-ghost\"]]: appearance === \"ghost\",\n [styles[\"danger-secondary\"]]: appearance === \"danger-secondary\",\n [styles[\"danger-primary\"]]: appearance === \"danger\",\n [styles[\"size-xsmall\"]]: size === \"xsmall\",\n [styles[\"size-small\"]]: size === \"small\",\n [styles[\"size-medium\"]]: size === \"medium\",\n [styles[\"size-large\"]]: size === \"large\",\n [styles[\"size-xsmall-icon\"]]: size === \"xsmall\" && !children,\n [styles[\"size-small-icon\"]]: size === \"small\" && !children,\n [styles[\"size-medium-icon\"]]: size === \"medium\" && !children,\n [styles[\"size-large-icon\"]]: size === \"large\" && !children,\n [styles[\"loading\"]]: loading,\n });\n\n const styleCombined = {\n ...style,\n ...layoutStyles,\n };\n\n return (\n <a\n data-tracking-id={trackingId}\n className={buttonClassNames}\n aria-disabled={disabled || loading}\n aria-busy={loading}\n data-anv=\"button-link\"\n tabIndex={disabled || loading ? -1 : 0}\n onClick={handleOnClick}\n onKeyDown={onKeyDownHandler}\n onKeyUp={onKeyUpHandler}\n style={styleCombined}\n ref={ref}\n href={href}\n {...rest}\n >\n {loading ? (\n <Spinner inherit size=\"small\" className={styles[\"loading-spinner\"]} />\n ) : icon ? (\n iconBefore(icon)\n ) : null}\n {children}\n {typeof icon === \"object\" && \"after\" in icon ? (\n <Icon\n className={styles[\"icon\"]}\n inherit\n aria-hidden\n svg={icon.after}\n />\n ) : null}\n </a>\n );\n },\n);\n\nButtonLink.displayName = \"ButtonLink\";\n"],"names":["icon"],"mappings":"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"}
|
package/dist/ButtonLink.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { B as ButtonLink, B as default } from './ButtonLink-
|
|
1
|
+
export { B as ButtonLink, B as default } from './ButtonLink-BSReBbc3.js';
|
|
2
2
|
//# sourceMappingURL=ButtonLink.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { forwardRef, useState, useEffect } from 'react';
|
|
3
|
-
import { B as Button } from './Button-
|
|
3
|
+
import { B as Button } from './Button-CjeF1Agb.js';
|
|
4
4
|
import { c as cx } from './index-De1g9FRV.js';
|
|
5
5
|
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjqeAJZ9.js';
|
|
6
6
|
import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
|
|
@@ -78,4 +78,4 @@ const ButtonToggle = forwardRef(
|
|
|
78
78
|
ButtonToggle.displayName = "ButtonToggle";
|
|
79
79
|
|
|
80
80
|
export { ButtonToggle as B };
|
|
81
|
-
//# sourceMappingURL=ButtonToggle-
|
|
81
|
+
//# sourceMappingURL=ButtonToggle-CnOsM7-u.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonToggle-
|
|
1
|
+
{"version":3,"file":"ButtonToggle-CnOsM7-u.js","sources":["../src/components/ButtonToggle/ButtonToggle.tsx"],"sourcesContent":["import {\n forwardRef,\n KeyboardEvent,\n MouseEvent,\n Ref,\n useEffect,\n useState,\n} from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport { DataTrackingId } from \"../../types\";\nimport { Button, ButtonProps } from \"../Button/Button\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\nimport cx from \"classnames\";\nimport styles from \"./ButtonToggle.module.scss\";\n\nexport type ButtonToggleState = {\n pressed: boolean;\n value?: string;\n};\n\n/**\n * Props for the ButtonToggle component\n * @extends Omit<ButtonProps, \"appearance\" | \"loading\">\n */\nexport type ButtonToggleProps = Omit<ButtonProps, \"appearance\" | \"loading\"> & {\n /**\n * The default pressed(selected) state of the toggle button.\n * @default false\n */\n defaultChecked?: boolean;\n\n /**\n * The controlled pressed(selected) state of the toggle button.\n */\n checked?: boolean;\n\n /**\n * The value of the toggle button.\n */\n value?: string;\n\n /**\n * Callback for when pressed(selected) changes.\n */\n onChange?: (\n e: MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>,\n state: ButtonToggleState,\n ) => void;\n} &\n /**\n * Data tracking id\n */\n DataTrackingId;\n\n/**\n * ButtonToggle component for creating toggleable button states.\n *\n * Features:\n * - Supports both controlled and uncontrolled state management\n * - Toggle state with pressed/selected visual feedback\n * - Full accessibility support with aria-pressed attribute\n * - Callback support for state changes\n * - Supports layout utilities for positioning and spacing\n * - Inherits all button features except appearance and loading\n * - Flexible content with text and/or icons\n * - Keyboard interaction support\n * - Value association for form-like behavior\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonToggle\n * defaultChecked={false}\n * onChange={(e, state) => console.log('Toggle state:', state.pressed)}\n * >\n * Toggle Me\n * </ButtonToggle>\n */\nexport const ButtonToggle = forwardRef(\n (props: ButtonToggleProps, ref: Ref<HTMLButtonElement>) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const {\n value,\n defaultChecked = false,\n checked,\n className,\n onClick,\n onChange,\n onKeyDown,\n style,\n icon,\n size,\n type,\n ...rest\n } = componentProps;\n\n const [isPressed, setIsPressed] = useState(checked ?? defaultChecked);\n\n const onClickHandler = (e: MouseEvent<HTMLButtonElement>) => {\n if (typeof checked === \"undefined\") {\n setIsPressed(!isPressed);\n onChange?.(e, { pressed: !isPressed, value });\n }\n onClick?.(e);\n };\n\n useEffect(() => {\n if (typeof checked === \"undefined\") return;\n setIsPressed(checked);\n }, [checked]);\n\n const data = {\n children: childrenToString(props.children),\n icon,\n size,\n value,\n type,\n };\n\n const trackingId = useTrackingId({\n name: \"ButtonToggle\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const ButtonToggleClassNames = cx(className, styles[\"button-toggle\"]);\n\n const styleCombined = {\n ...style,\n ...layoutStyles,\n };\n return (\n <Button\n data-tracking-id={trackingId}\n data-anv=\"button-toggle\"\n aria-pressed={isPressed}\n onClick={onClickHandler}\n className={ButtonToggleClassNames}\n value={value}\n style={styleCombined}\n icon={icon}\n size={size}\n type={type}\n ref={ref}\n {...rest}\n />\n );\n },\n);\n\nButtonToggle.displayName = \"ButtonToggle\";\n"],"names":[],"mappings":";;;;;;;;;;;;AA+EO,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAA0B,GAAA,KAAgC;AACzD,IAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAA,MAAM;AAAA,MACJ,KAAA;AAAA,MACA,cAAA,GAAiB,KAAA;AAAA,MACjB,OAAA;AAAA,MACA,SAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,QAAA,CAAS,WAAW,cAAc,CAAA;AAEpE,IAAA,MAAM,cAAA,GAAiB,CAAC,CAAA,KAAqC;AAC3D,MAAA,IAAI,OAAO,YAAY,WAAA,EAAa;AAClC,QAAA,YAAA,CAAa,CAAC,SAAS,CAAA;AACvB,QAAA,QAAA,GAAW,GAAG,EAAE,OAAA,EAAS,CAAC,SAAA,EAAW,OAAO,CAAA;AAAA,MAC9C;AACA,MAAA,OAAA,GAAU,CAAC,CAAA;AAAA,IACb,CAAA;AAEA,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,OAAO,YAAY,WAAA,EAAa;AACpC,MAAA,YAAA,CAAa,OAAO,CAAA;AAAA,IACtB,CAAA,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,QAAA,EAAU,gBAAA,CAAiB,KAAA,CAAM,QAAQ,CAAA;AAAA,MACzC,IAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,cAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AAED,IAAA,MAAM,sBAAA,GAAyB,EAAA,CAAG,SAAA,EAAW,MAAA,CAAO,eAAe,CAAC,CAAA;AAEpE,IAAA,MAAM,aAAA,GAAgB;AAAA,MACpB,GAAG,KAAA;AAAA,MACH,GAAG;AAAA,KACL;AACA,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,kBAAA,EAAkB,UAAA;AAAA,QAClB,UAAA,EAAS,eAAA;AAAA,QACT,cAAA,EAAc,SAAA;AAAA,QACd,OAAA,EAAS,cAAA;AAAA,QACT,SAAA,EAAW,sBAAA;AAAA,QACX,KAAA;AAAA,QACA,KAAA,EAAO,aAAA;AAAA,QACP,IAAA;AAAA,QACA,IAAA;AAAA,QACA,IAAA;AAAA,QACA,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;;;"}
|
package/dist/ButtonToggle.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { B as ButtonToggle, B as default } from './ButtonToggle-
|
|
1
|
+
export { B as ButtonToggle, B as default } from './ButtonToggle-CnOsM7-u.js';
|
|
2
2
|
//# sourceMappingURL=ButtonToggle.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { D as DateTime, I as Info } from './luxon-wpz4A-OQ.js';
|
|
3
3
|
import { createContext, useContext, forwardRef, useState, useEffect, useRef, useCallback, useMemo, useId } from 'react';
|
|
4
|
-
import { B as Button } from './Button-
|
|
4
|
+
import { B as Button } from './Button-CjeF1Agb.js';
|
|
5
5
|
import { S as SvgKeyboardArrowDown } from './keyboard_arrow_down-C8WQ38p1.js';
|
|
6
6
|
import { S as SvgKeyboardArrowUp } from './keyboard_arrow_up-CxzK6LAl.js';
|
|
7
7
|
import { S as SvgKeyboardArrowLeft } from './keyboard_arrow_left-CiE1n99w.js';
|
|
@@ -10,7 +10,7 @@ import { S as SvgKeyboardArrowRight } from './keyboard_arrow_right-DMloHg_F.js';
|
|
|
10
10
|
import { S as SrOnly } from './SrOnly-pnf8ajnh.js';
|
|
11
11
|
import { u as useSwipe } from './useSwipe-Cp-CJxLU.js';
|
|
12
12
|
import { G as Grid } from './Grid-ho1pGJ5L.js';
|
|
13
|
-
import { S as SelectCard } from './SelectCard-
|
|
13
|
+
import { S as SelectCard } from './SelectCard-Bk2JEIie.js';
|
|
14
14
|
import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
|
|
15
15
|
import { u as useVirtualizer } from './index-DXeGMe23.js';
|
|
16
16
|
import { u as useOptionallyControlledState } from './useOptionallyControlledState-DbDuos5L.js';
|
|
@@ -1822,4 +1822,4 @@ const Calendar = Object.assign(
|
|
|
1822
1822
|
Calendar.displayName = "Calendar";
|
|
1823
1823
|
|
|
1824
1824
|
export { CalendarBetaPropsContext as C, Calendar as a, CalendarNow as b, CalendarYearButton as c, CalendarPrev as d, CalendarNext as e, CalendarMonthButton as f, CalendarMonth as g, useCalendarBetaProps as u };
|
|
1825
|
-
//# sourceMappingURL=Calendar-
|
|
1825
|
+
//# sourceMappingURL=Calendar-C05ESFqK.js.map
|