@servicetitan/anvil2 3.0.0 → 3.0.2
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 +45 -0
- package/README.md +8 -6
- package/dist/{AiMark-B1-M3ZgP.js → AiMark-DiMotaq3.js} +3 -3
- package/dist/{AiMark-B1-M3ZgP.js.map → AiMark-DiMotaq3.js.map} +1 -1
- package/dist/AiMark.css +3 -3
- package/dist/AiMark.js +1 -1
- package/dist/{Alert-DmbqtMg_.js → Alert-DhhVURcl.js} +2 -2
- package/dist/{Alert-DmbqtMg_.js.map → Alert-DhhVURcl.js.map} +1 -1
- package/dist/Alert.css +1 -1
- package/dist/Alert.js +1 -1
- package/dist/Announcement.css +1 -1
- package/dist/AnvilProvider.css +1 -2
- package/dist/{Avatar-NbFc4Ovc.js → Avatar-BmNcLUg-.js} +2 -2
- package/dist/{Avatar-NbFc4Ovc.js.map → Avatar-BmNcLUg-.js.map} +1 -1
- package/dist/{Avatar-B4hRHku9.js → Avatar-Cw8B8xZV.js} +2 -2
- package/dist/Avatar-Cw8B8xZV.js.map +1 -0
- package/dist/Avatar.css +2 -2
- package/dist/Avatar.js +2 -2
- package/dist/Badge.css +1 -1
- package/dist/{Breadcrumbs-CYmciJ1D.js → Breadcrumbs-vvKOtFwN.js} +2 -2
- package/dist/{Breadcrumbs-CYmciJ1D.js.map → Breadcrumbs-vvKOtFwN.js.map} +1 -1
- package/dist/Breadcrumbs.css +1 -1
- package/dist/Breadcrumbs.js +1 -1
- package/dist/Button.css +1 -1
- package/dist/ButtonCompound.css +1 -1
- package/dist/ButtonToggle.css +1 -1
- package/dist/{Calendar-BAbAagIx.js → Calendar-BLvBN8Ou.js} +2 -2
- package/dist/{Calendar-BAbAagIx.js.map → Calendar-BLvBN8Ou.js.map} +1 -1
- package/dist/{Calendar-CaCMa_jq.js → Calendar-Dtn07sfJ.js} +2 -2
- package/dist/{Calendar-CaCMa_jq.js.map → Calendar-Dtn07sfJ.js.map} +1 -1
- package/dist/Calendar.css +2 -2
- package/dist/Calendar.js +2 -2
- package/dist/Card.css +1 -1
- package/dist/{Checkbox-BSAS8-DM.js → Checkbox-BngBrjEV.js} +3 -3
- package/dist/{Checkbox-BSAS8-DM.js.map → Checkbox-BngBrjEV.js.map} +1 -1
- package/dist/{Checkbox-Ckl8EFpF.js → Checkbox-lSwl_u26.js} +2 -2
- package/dist/{Checkbox-Ckl8EFpF.js.map → Checkbox-lSwl_u26.js.map} +1 -1
- package/dist/Checkbox.css +1 -1
- package/dist/Checkbox.js +1 -1
- package/dist/{Chip-CR5i8mQW.js → Chip-DBn3KRak.js} +3 -3
- package/dist/{Chip-CR5i8mQW.js.map → Chip-DBn3KRak.js.map} +1 -1
- package/dist/Chip.css +1 -1
- package/dist/Chip.js +1 -1
- package/dist/{Combobox-BffGTugd.js → Combobox-BqhvHG9H.js} +5 -5
- package/dist/{Combobox-BffGTugd.js.map → Combobox-BqhvHG9H.js.map} +1 -1
- package/dist/Combobox.css +1 -1
- package/dist/Combobox.js +1 -1
- package/dist/{DataTable-D9Xj1nq5.js → DataTable-CB-exG-7.js} +1173 -142
- package/dist/DataTable-CB-exG-7.js.map +1 -0
- package/dist/DataTable.css +274 -118
- package/dist/{DateFieldRange-DPTC3EZz.js → DateFieldRange-Ci-OHK6g.js} +4 -4
- package/dist/{DateFieldRange-DPTC3EZz.js.map → DateFieldRange-Ci-OHK6g.js.map} +1 -1
- package/dist/DateFieldRange.js +1 -1
- package/dist/{DateFieldSingle-w1G-zd9G.js → DateFieldSingle-JOEy4kSL.js} +4 -4
- package/dist/{DateFieldSingle-w1G-zd9G.js.map → DateFieldSingle-JOEy4kSL.js.map} +1 -1
- package/dist/DateFieldSingle.js +1 -1
- package/dist/{DateFieldYearless-DHNVc7Sd.js → DateFieldYearless-CIqPup6O.js} +4 -4
- package/dist/{DateFieldYearless-DHNVc7Sd.js.map → DateFieldYearless-CIqPup6O.js.map} +1 -1
- package/dist/DateFieldYearless.js +1 -1
- package/dist/{DateFieldYearlessRange-C5ktVUgG.js → DateFieldYearlessRange-Cf11uZhk.js} +3 -3
- package/dist/{DateFieldYearlessRange-C5ktVUgG.js.map → DateFieldYearlessRange-Cf11uZhk.js.map} +1 -1
- package/dist/DateFieldYearlessRange.css +1 -1
- package/dist/DateFieldYearlessRange.js +1 -1
- package/dist/{DaysOfTheWeek-BubWkBZ0.js → DaysOfTheWeek-R2-y7cqh.js} +3 -3
- package/dist/{DaysOfTheWeek-BubWkBZ0.js.map → DaysOfTheWeek-R2-y7cqh.js.map} +1 -1
- package/dist/DaysOfTheWeek.css +1 -1
- package/dist/DaysOfTheWeek.js +1 -1
- package/dist/Details.css +1 -1
- package/dist/{Dialog-DGmF6qx3.js → Dialog-C3yST7Ly.js} +5 -5
- package/dist/Dialog-C3yST7Ly.js.map +1 -0
- package/dist/Dialog.css +1 -1
- package/dist/Dialog.js +1 -1
- package/dist/Divider.css +1 -1
- package/dist/Dnd.js +2 -1
- package/dist/Dnd.js.map +1 -1
- package/dist/DndHandleButton-Dgt9G-dF.js +43 -0
- package/dist/DndHandleButton-Dgt9G-dF.js.map +1 -0
- package/dist/DndHandleButton.css +22 -0
- package/dist/DndSort.css +1 -1
- package/dist/DndSort.js +2 -1
- package/dist/DndSort.js.map +1 -1
- package/dist/{Drawer-iewBy1DW.js → Drawer-CouIrQ8u.js} +6 -6
- package/dist/{Drawer-iewBy1DW.js.map → Drawer-CouIrQ8u.js.map} +1 -1
- package/dist/Drawer.css +1 -1
- package/dist/Drawer.js +1 -1
- package/dist/DrillDown.css +1 -1
- package/dist/DrillDown.js +1 -1
- package/dist/{EditCard-D7-Ye7R0.js → EditCard-DFBjxF9l.js} +2 -2
- package/dist/{EditCard-D7-Ye7R0.js.map → EditCard-DFBjxF9l.js.map} +1 -1
- package/dist/EditCard.css +1 -1
- package/dist/EditCard.js +1 -1
- package/dist/{FieldLabel-DZWu5dMp.js → FieldLabel-rHPbiyR3.js} +3 -3
- package/dist/{FieldLabel-DZWu5dMp.js.map → FieldLabel-rHPbiyR3.js.map} +1 -1
- package/dist/FieldLabel.css +2 -2
- package/dist/FieldLabel.js +1 -1
- package/dist/FieldMessage.css +1 -1
- package/dist/{Toolbar-C1_etxss.js → FilterBar-kVue-bVK.js} +127 -939
- package/dist/FilterBar-kVue-bVK.js.map +1 -0
- package/dist/FilterBar.css +59 -0
- package/dist/FilterBar.d.ts +6 -0
- package/dist/FilterBar.js +2 -0
- package/dist/FilterBar.js.map +1 -0
- package/dist/Flex.css +1 -1
- package/dist/Grid.css +1 -1
- package/dist/Helper.css +1 -1
- package/dist/Icon.css +1 -1
- package/dist/{InputMask-EwEJlW-t.js → InputMask-DxbFpzo7.js} +3 -3
- package/dist/{InputMask-EwEJlW-t.js.map → InputMask-DxbFpzo7.js.map} +1 -1
- package/dist/InputMask.js +1 -1
- package/dist/InteractiveCard-KGs2b_al.js +119 -0
- package/dist/InteractiveCard-KGs2b_al.js.map +1 -0
- package/dist/InteractiveCard.css +22 -29
- package/dist/InteractiveCard.js +1 -1
- package/dist/Layout.css +1 -1
- package/dist/Link.css +1 -1
- package/dist/List.css +1 -1
- package/dist/{ListView-DBO9Bl1H.js → ListView-CYkuvkAy.js} +2 -2
- package/dist/{ListView-DBO9Bl1H.js.map → ListView-CYkuvkAy.js.map} +1 -1
- package/dist/ListView.css +1 -1
- package/dist/ListView.js +1 -1
- package/dist/{Listbox-DDlxpVu9.js → Listbox-BBrsMfO3.js} +2 -2
- package/dist/{Listbox-DDlxpVu9.js.map → Listbox-BBrsMfO3.js.map} +1 -1
- package/dist/Listbox.css +1 -1
- package/dist/Listbox.js +1 -1
- package/dist/Menu.css +1 -1
- package/dist/MultiSelectField.js +1 -1
- package/dist/{MultiSelectFieldSync-DZ3tm7zt.js → MultiSelectFieldSync-BWZQ4MFC.js} +5 -5
- package/dist/{MultiSelectFieldSync-DZ3tm7zt.js.map → MultiSelectFieldSync-BWZQ4MFC.js.map} +1 -1
- package/dist/MultiSelectFieldSync.css +1 -1
- package/dist/MultiSelectMenu.js +1 -1
- package/dist/{MultiSelectMenuSync-dgO9SmHi.js → MultiSelectMenuSync-Bl4ty0je.js} +4 -4
- package/dist/{MultiSelectMenuSync-dgO9SmHi.js.map → MultiSelectMenuSync-Bl4ty0je.js.map} +1 -1
- package/dist/{NumberField-DJbdyatF.js → NumberField-DMHJ2Cyi.js} +4 -5
- package/dist/NumberField-DMHJ2Cyi.js.map +1 -0
- package/dist/NumberField.css +1 -1
- package/dist/NumberField.js +1 -1
- package/dist/Overflow.css +2 -2
- package/dist/Overflow.js +1 -1
- package/dist/{Page-Be1Blwme.js → Page-Blw4TE5J.js} +9 -9
- package/dist/{Page-Be1Blwme.js.map → Page-Blw4TE5J.js.map} +1 -1
- package/dist/Page.css +1 -1
- package/dist/Page.js +1 -1
- package/dist/{Pagination-USDJM5vi.js → Pagination-DYNH3WeU.js} +2 -2
- package/dist/{Pagination-USDJM5vi.js.map → Pagination-DYNH3WeU.js.map} +1 -1
- package/dist/Pagination.css +6 -6
- package/dist/Pagination.js +1 -1
- package/dist/{Popover-CyB7yzSf.js → Popover-C_XdNvAZ.js} +2 -2
- package/dist/{Popover-CyB7yzSf.js.map → Popover-C_XdNvAZ.js.map} +1 -1
- package/dist/Popover.css +1 -1
- package/dist/Popover.js +1 -1
- package/dist/{ProgressBar-DSrjgLTx.js → ProgressBar-BwHaAD25.js} +2 -2
- package/dist/{ProgressBar-DSrjgLTx.js.map → ProgressBar-BwHaAD25.js.map} +1 -1
- package/dist/ProgressBar.css +1 -1
- package/dist/ProgressBar.js +1 -1
- package/dist/{Radio-CQaXJ72d.js → Radio-DJ6KgfcS.js} +2 -2
- package/dist/{Radio-CQaXJ72d.js.map → Radio-DJ6KgfcS.js.map} +1 -1
- package/dist/{Radio-DO4UhbBE.js → Radio-IksHWkBl.js} +3 -3
- package/dist/{Radio-DO4UhbBE.js.map → Radio-IksHWkBl.js.map} +1 -1
- package/dist/Radio.css +1 -1
- package/dist/Radio.js +1 -1
- package/dist/RichTextEditor-C_Boj8QP.js +30852 -0
- package/dist/RichTextEditor-C_Boj8QP.js.map +1 -0
- package/dist/RichTextEditor.css +178 -0
- package/dist/RichTextEditor.d.ts +2 -0
- package/dist/RichTextEditor.js +2 -0
- package/dist/RichTextEditor.js.map +1 -0
- package/dist/{SearchField-CsRGYZx3.js → SearchField-BKJOW-vI.js} +3 -10
- package/dist/SearchField-BKJOW-vI.js.map +1 -0
- package/dist/SearchField-BplvDpBG.js +13 -0
- package/dist/SearchField-BplvDpBG.js.map +1 -0
- package/dist/SearchField.css +1 -1
- package/dist/SearchField.js +1 -1
- package/dist/SegmentedControl.css +1 -1
- package/dist/{SelectCard-CtXwY8FZ.js → SelectCard-E-13CjHS.js} +3 -3
- package/dist/{SelectCard-CtXwY8FZ.js.map → SelectCard-E-13CjHS.js.map} +1 -1
- package/dist/SelectCard.css +1 -1
- package/dist/SelectCard.js +1 -1
- package/dist/SelectField.js +1 -1
- package/dist/{SelectFieldLabel-DLT5dKbx.js → SelectFieldLabel-C-MrQm-n.js} +2 -2
- package/dist/{SelectFieldLabel-DLT5dKbx.js.map → SelectFieldLabel-C-MrQm-n.js.map} +1 -1
- package/dist/{SelectFieldSync-C44hPeeS.js → SelectFieldSync-BbJFd_bV.js} +4 -4
- package/dist/{SelectFieldSync-C44hPeeS.js.map → SelectFieldSync-BbJFd_bV.js.map} +1 -1
- package/dist/SelectMenu.js +1 -1
- package/dist/{SelectMenuSync-V97oN85V.js → SelectMenuSync-CBMdmGTU.js} +4 -4
- package/dist/{SelectMenuSync-V97oN85V.js.map → SelectMenuSync-CBMdmGTU.js.map} +1 -1
- package/dist/{SelectOptions-CDoo4AUu.js → SelectOptions-BT9OCfPh.js} +2 -2
- package/dist/{SelectOptions-CDoo4AUu.js.map → SelectOptions-BT9OCfPh.js.map} +1 -1
- package/dist/{SelectTrigger-BWN3Tx43.js → SelectTrigger-DtyxYDzP.js} +3 -3
- package/dist/{SelectTrigger-BWN3Tx43.js.map → SelectTrigger-DtyxYDzP.js.map} +1 -1
- package/dist/SelectTrigger.js +1 -1
- package/dist/{SelectTriggerBase-Do7lQ5rw.js → SelectTriggerBase-Xwq929Wr.js} +3 -3
- package/dist/{SelectTriggerBase-Do7lQ5rw.js.map → SelectTriggerBase-Xwq929Wr.js.map} +1 -1
- package/dist/SelectTriggerBase.css +1 -1
- package/dist/SideNav.css +1 -1
- package/dist/Skeleton.css +1 -1
- package/dist/Spinner.css +1 -1
- package/dist/SrOnly.css +1 -1
- package/dist/StatusIcon.css +1 -1
- package/dist/Stepper.css +4 -4
- package/dist/{Switch-DeBu4Ucg.js → Switch-CElshQ9N.js} +2 -2
- package/dist/{Switch-DeBu4Ucg.js.map → Switch-CElshQ9N.js.map} +1 -1
- package/dist/Switch.css +1 -1
- package/dist/Switch.js +1 -1
- package/dist/Tab.css +1 -1
- package/dist/Table.js +1 -1
- package/dist/{Text-J5YtSSXY.js → Text-C0F8AkvH.js} +5 -5
- package/dist/Text-C0F8AkvH.js.map +1 -0
- package/dist/Text.css +1 -1
- package/dist/Text.js +1 -1
- package/dist/{TextField-CRDTnuUN.js → TextField-CLZEj0aI.js} +3 -3
- package/dist/{TextField-CRDTnuUN.js.map → TextField-CLZEj0aI.js.map} +1 -1
- package/dist/{TextField-YlMkDHp-.js → TextField-yL52fx5R.js} +2 -2
- package/dist/{TextField-YlMkDHp-.js.map → TextField-yL52fx5R.js.map} +1 -1
- package/dist/TextField.css +1 -1
- package/dist/TextField.js +1 -1
- package/dist/{Textarea-CxXmr_Gx.js → Textarea-CGgyvnM8.js} +3 -3
- package/dist/{Textarea-CxXmr_Gx.js.map → Textarea-CGgyvnM8.js.map} +1 -1
- package/dist/Textarea.css +1 -1
- package/dist/Textarea.js +1 -1
- package/dist/ThemeProvider.css +0 -1
- package/dist/{TimeField-DTg0CE5L.js → TimeField-BEvxjjFp.js} +4 -4
- package/dist/{TimeField-DTg0CE5L.js.map → TimeField-BEvxjjFp.js.map} +1 -1
- package/dist/TimeField.css +1 -1
- package/dist/TimeField.js +1 -1
- package/dist/TimezoneMessage.css +1 -1
- package/dist/Toast.js +2 -2
- package/dist/{Toaster-Bq42x6Gx.js → Toaster-DllJAOK8.js} +3 -3
- package/dist/{Toaster-Bq42x6Gx.js.map → Toaster-DllJAOK8.js.map} +1 -1
- package/dist/{Toaster-Dly3rfva.js → Toaster-DuadB8pq.js} +2 -2
- package/dist/{Toaster-Dly3rfva.js.map → Toaster-DuadB8pq.js.map} +1 -1
- package/dist/Toaster.css +1 -1
- package/dist/Toolbar-J5cakHba.js +588 -0
- package/dist/Toolbar-J5cakHba.js.map +1 -0
- package/dist/Toolbar-QYRQv45Y.js +780 -0
- package/dist/Toolbar-QYRQv45Y.js.map +1 -0
- package/dist/Toolbar.css +2 -96
- package/dist/Toolbar.js +2 -1
- package/dist/Toolbar.js.map +1 -1
- package/dist/{index2.css → Toolbar2.css} +1 -1
- package/dist/ToolbarButtonToggle-Ch0SH4oH.js +285 -0
- package/dist/ToolbarButtonToggle-Ch0SH4oH.js.map +1 -0
- package/dist/ToolbarButtonToggle.css +41 -0
- package/dist/{Tooltip-BlStOXN3.js → Tooltip-lBmgi5ZB.js} +7 -6
- package/dist/Tooltip-lBmgi5ZB.js.map +1 -0
- package/dist/Tooltip.css +7 -6
- package/dist/Tooltip.js +1 -1
- package/dist/{YearlessDateInputWithPicker-DyytWt0x.js → YearlessDateInputWithPicker-DryLX8sA.js} +2 -2
- package/dist/{YearlessDateInputWithPicker-DyytWt0x.js.map → YearlessDateInputWithPicker-DryLX8sA.js.map} +1 -1
- package/dist/YearlessDateInputWithPicker.css +2 -2
- package/dist/add-BcQkAUip.js +6 -0
- package/dist/add-BcQkAUip.js.map +1 -0
- package/dist/assets/css-utils/a2-border.css +23 -53
- package/dist/assets/css-utils/a2-color.css +221 -449
- package/dist/assets/css-utils/a2-font.css +21 -47
- package/dist/assets/css-utils/a2-spacing.css +238 -481
- package/dist/assets/css-utils/a2-utils.css +497 -1002
- package/dist/assets/css-utils/border.css +23 -53
- package/dist/assets/css-utils/color.css +221 -449
- package/dist/assets/css-utils/font.css +21 -47
- package/dist/assets/css-utils/spacing.css +238 -481
- package/dist/assets/css-utils/utils.css +497 -1002
- package/dist/assets/icons/st/unsorted.svg +1 -1
- package/dist/beta/components/FilterBar/FilterBar.d.ts +87 -0
- package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterToggleButton.d.ts +1 -1
- package/dist/beta/components/FilterBar/index.d.ts +3 -0
- package/dist/beta/components/{Toolbar/Filters → FilterBar}/internal/FilterGroupContext.d.ts +5 -5
- package/dist/beta/components/{Toolbar/Filters → FilterBar}/internal/types.d.ts +2 -2
- package/dist/beta/components/{Toolbar/Filters → FilterBar}/internal/utils/test.d.ts +1 -0
- package/dist/beta/components/InteractiveCard/InteractiveCard.d.ts +3 -1
- package/dist/beta/components/RichTextEditor/RichTextEditor.d.ts +27 -0
- package/dist/beta/components/RichTextEditor/index.d.ts +2 -0
- package/dist/beta/components/RichTextEditor/internal/LinkPopover.d.ts +14 -0
- package/dist/beta/components/RichTextEditor/internal/MentionList.d.ts +14 -0
- package/dist/beta/components/RichTextEditor/internal/MentionNodeView.d.ts +11 -0
- package/dist/beta/components/RichTextEditor/internal/MentionPopover.d.ts +16 -0
- package/dist/beta/components/RichTextEditor/internal/RichTextEditorContext.d.ts +57 -0
- package/dist/beta/components/RichTextEditor/internal/RichTextEditorDragHandle.d.ts +6 -0
- package/dist/beta/components/RichTextEditor/internal/RichTextEditorMockData.d.ts +8 -0
- package/dist/beta/components/RichTextEditor/internal/RichTextEditorProvider.d.ts +8 -0
- package/dist/beta/components/RichTextEditor/internal/RichTextEditorToolbar.d.ts +1 -0
- package/dist/beta/components/RichTextEditor/internal/YouTubeEmbedPrompt.d.ts +11 -0
- package/dist/beta/components/RichTextEditor/internal/YouTubePopover.d.ts +11 -0
- package/dist/beta/components/RichTextEditor/internal/extensions/ImageUploadExtension.d.ts +3 -0
- package/dist/beta/components/RichTextEditor/internal/extensions/LinkKeyboardShortcutExtension.d.ts +8 -0
- package/dist/beta/components/RichTextEditor/internal/extensions/MentionExtension.d.ts +18 -0
- package/dist/beta/components/RichTextEditor/internal/extensions/YoutubeExtension.d.ts +8 -0
- package/dist/beta/components/RichTextEditor/internal/useRichTextEditor.d.ts +32 -0
- package/dist/beta/components/RichTextEditor/types.d.ts +103 -0
- package/dist/beta/components/Table/DataTable/DataTable.d.ts +40 -1
- package/dist/beta/components/Table/DataTable/internal/DataTableBody.d.ts +22 -0
- package/dist/beta/components/Table/DataTable/internal/DataTableBodyRow.d.ts +18 -1
- package/dist/beta/components/Table/DataTable/internal/cells/CellFocusContext.d.ts +16 -0
- package/dist/beta/components/Table/DataTable/internal/editable-cells/DataTableEditableCustomCell.d.ts +8 -0
- package/dist/beta/components/Table/DataTable/internal/editable-cells/useCustomEditHelpers.d.ts +49 -0
- package/dist/beta/components/Table/DataTable/internal/useDataTableVirtualizer.d.ts +9 -5
- package/dist/beta/components/Table/DataTable/internal/util/cellTypeHelpers.d.ts +3 -0
- package/dist/beta/components/Table/DataTable/internal/util/getTanStackColumnDef.d.ts +13 -1
- package/dist/beta/components/Table/createColumnHelper.d.ts +48 -22
- package/dist/beta/components/Table/internal/getCommonPinningClasses.d.ts +1 -1
- package/dist/beta/components/Table/types.d.ts +311 -7
- package/dist/beta/components/Toolbar/Toolbar.d.ts +0 -54
- package/dist/beta/components/Toolbar/index.d.ts +0 -1
- package/dist/beta/components/index.d.ts +2 -0
- package/dist/beta.js +13 -10
- package/dist/beta.js.map +1 -1
- package/dist/components/Toolbar/internal/utils/accessibility.d.ts +5 -0
- package/dist/getKeyboardFocusableElements-B_U9rt6y.js +11 -0
- package/dist/getKeyboardFocusableElements-B_U9rt6y.js.map +1 -0
- package/dist/index-DUzqzmOX.js +17044 -0
- package/dist/index-DUzqzmOX.js.map +1 -0
- package/dist/index-DtsM4pjR.js +71 -0
- package/dist/index-DtsM4pjR.js.map +1 -0
- package/dist/index.css +1 -22
- package/dist/index.js +49 -813
- package/dist/index.js.map +1 -1
- package/dist/internal/components/Surface/Surface.d.ts +141 -0
- package/dist/internal/components/Surface/index.d.ts +1 -0
- package/dist/internal/components/index.d.ts +1 -0
- package/dist/internal/functions/getKeyboardFocusableElements.d.ts +11 -0
- package/dist/{stripInlineMarkdown-BWbMy7r_.js → stripInlineMarkdown-BOi-eJO3.js} +2 -2
- package/dist/{stripInlineMarkdown-BWbMy7r_.js.map → stripInlineMarkdown-BOi-eJO3.js.map} +1 -1
- package/dist/{syncFilterUtils-BLcRXQfd.js → syncFilterUtils-Gvm81gyv.js} +5 -5
- package/dist/{syncFilterUtils-BLcRXQfd.js.map → syncFilterUtils-Gvm81gyv.js.map} +1 -1
- package/dist/syncFilterUtils.css +4 -4
- package/dist/token/core/css-utils/a2-border.css +0 -30
- package/dist/token/core/css-utils/a2-color.css +0 -228
- package/dist/token/core/css-utils/a2-font.css +1 -27
- package/dist/token/core/css-utils/a2-spacing.css +1 -244
- package/dist/token/core/css-utils/a2-utils.css +0 -505
- package/dist/token/core/css-utils/border.css +0 -30
- package/dist/token/core/css-utils/color.css +0 -228
- package/dist/token/core/css-utils/font.css +1 -27
- package/dist/token/core/css-utils/spacing.css +1 -244
- package/dist/token/core/css-utils/utils.css +0 -505
- package/dist/{useDrilldown-D5WWJRU2.js → useDrilldown-6SfknQ2s.js} +3 -3
- package/dist/{useDrilldown-D5WWJRU2.js.map → useDrilldown-6SfknQ2s.js.map} +1 -1
- package/dist/{useInitialFocus-BUxEDMEG.js → useInitialFocus-BIvXK1Rp.js} +2 -2
- package/dist/{useInitialFocus-BUxEDMEG.js.map → useInitialFocus-BIvXK1Rp.js.map} +1 -1
- package/dist/{usePopoverTransitionStates-CDXCdyKa.js → usePopoverTransitionStates-B1opfxxn.js} +1 -2
- package/dist/{usePopoverTransitionStates-CDXCdyKa.js.map → usePopoverTransitionStates-B1opfxxn.js.map} +1 -1
- package/dist/{useToggleSelection-D_2qS0P1.js → useToggleSelection-odFvSS5t.js} +2 -2
- package/dist/{useToggleSelection-D_2qS0P1.js.map → useToggleSelection-odFvSS5t.js.map} +1 -1
- package/package.json +26 -11
- package/dist/Avatar-B4hRHku9.js.map +0 -1
- package/dist/DataTable-D9Xj1nq5.js.map +0 -1
- package/dist/Dialog-DGmF6qx3.js.map +0 -1
- package/dist/InteractiveCard-CnW0m_F-.js +0 -87
- package/dist/InteractiveCard-CnW0m_F-.js.map +0 -1
- package/dist/NumberField-DJbdyatF.js.map +0 -1
- package/dist/SearchField-CsRGYZx3.js.map +0 -1
- package/dist/Text-J5YtSSXY.js.map +0 -1
- package/dist/Toolbar-C1_etxss.js.map +0 -1
- package/dist/Tooltip-BlStOXN3.js.map +0 -1
- package/dist/beta/components/Toolbar/Filters/FilterGroup.d.ts +0 -25
- package/dist/getKeyboardFocusableElements-QqcABz0D.js +0 -12
- package/dist/getKeyboardFocusableElements-QqcABz0D.js.map +0 -1
- package/dist/index-ByMdotWU.js +0 -107
- package/dist/index-ByMdotWU.js.map +0 -1
- /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterButton.d.ts +0 -0
- /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterDateRange.d.ts +0 -0
- /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterDateSingle.d.ts +0 -0
- /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterDrawer.d.ts +0 -0
- /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterItemWrapper.d.ts +0 -0
- /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterSelect.d.ts +0 -0
- /package/dist/beta/components/{Toolbar/Filters → FilterBar}/internal/utils/filter-state.d.ts +0 -0
package/dist/index.js
CHANGED
|
@@ -1,84 +1,80 @@
|
|
|
1
|
-
|
|
2
|
-
export { A as Alert } from './Alert-
|
|
3
|
-
|
|
4
|
-
export { A as AiMark } from './AiMark-B1-M3ZgP.js';
|
|
1
|
+
export { DndSort, DndSortCard, DndSortZone } from './DndSort.js';
|
|
2
|
+
export { A as Alert } from './Alert-DhhVURcl.js';
|
|
3
|
+
export { A as AiMark } from './AiMark-DiMotaq3.js';
|
|
5
4
|
export { A as Announcement } from './Announcement-_C5g2Lzm.js';
|
|
6
|
-
export { A as Avatar } from './Avatar-
|
|
7
|
-
export { A as AvatarGroup } from './Avatar-
|
|
5
|
+
export { A as Avatar } from './Avatar-BmNcLUg-.js';
|
|
6
|
+
export { A as AvatarGroup } from './Avatar-Cw8B8xZV.js';
|
|
8
7
|
export { B as Badge } from './Badge-C_wTvtnB.js';
|
|
9
|
-
export { B as Breadcrumbs } from './Breadcrumbs-
|
|
10
|
-
|
|
8
|
+
export { B as Breadcrumbs } from './Breadcrumbs-vvKOtFwN.js';
|
|
9
|
+
export { B as Button } from './Button-Bnt8XUI7.js';
|
|
11
10
|
export { B as ButtonCompound } from './ButtonCompound-DsrK7G3q.js';
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
export { a as Calendar, g as CalendarMonth, f as CalendarMonthButton, e as CalendarNext, b as CalendarNow, d as CalendarPrev, c as CalendarYearButton } from './Calendar-
|
|
11
|
+
export { B as ButtonLink } from './ButtonLink-j3h_wRNi.js';
|
|
12
|
+
export { B as ButtonToggle } from './ButtonToggle-Ct9_5bhC.js';
|
|
13
|
+
export { a as Calendar, g as CalendarMonth, f as CalendarMonthButton, e as CalendarNext, b as CalendarNow, d as CalendarPrev, c as CalendarYearButton } from './Calendar-Dtn07sfJ.js';
|
|
15
14
|
export { C as Card } from './Card-DSFuXUGk.js';
|
|
16
|
-
export { C as Checkbox } from './Checkbox-
|
|
17
|
-
export { C as Chip } from './Chip-
|
|
18
|
-
export { C as Combobox, a as ComboboxElement, c as ComboboxList, b as ComboboxSelect } from './Combobox-
|
|
15
|
+
export { C as Checkbox } from './Checkbox-lSwl_u26.js';
|
|
16
|
+
export { C as Chip } from './Chip-DBn3KRak.js';
|
|
17
|
+
export { C as Combobox, a as ComboboxElement, c as ComboboxList, b as ComboboxSelect } from './Combobox-BqhvHG9H.js';
|
|
19
18
|
export { u as useInfiniteCombobox } from './useInfiniteCombobox-WcRgC9p6.js';
|
|
20
|
-
export { D as DateFieldRange } from './DateFieldRange-
|
|
21
|
-
export { D as DateFieldSingle } from './DateFieldSingle-
|
|
22
|
-
export { D as DateFieldYearless } from './DateFieldYearless-
|
|
23
|
-
export { D as DateFieldYearlessRange } from './DateFieldYearlessRange-
|
|
24
|
-
export { D as DaysOfTheWeek } from './DaysOfTheWeek-
|
|
19
|
+
export { D as DateFieldRange } from './DateFieldRange-Ci-OHK6g.js';
|
|
20
|
+
export { D as DateFieldSingle } from './DateFieldSingle-JOEy4kSL.js';
|
|
21
|
+
export { D as DateFieldYearless } from './DateFieldYearless-CIqPup6O.js';
|
|
22
|
+
export { D as DateFieldYearlessRange } from './DateFieldYearlessRange-Cf11uZhk.js';
|
|
23
|
+
export { D as DaysOfTheWeek } from './DaysOfTheWeek-R2-y7cqh.js';
|
|
25
24
|
export { D as Details } from './Details-DYRJcLWL.js';
|
|
26
|
-
export { D as Dialog } from './Dialog-
|
|
25
|
+
export { D as Dialog } from './Dialog-C3yST7Ly.js';
|
|
27
26
|
export { D as Divider } from './Divider-Ds3WKsKa.js';
|
|
28
|
-
export { D as Dnd } from './index-
|
|
29
|
-
export { D as Drawer } from './Drawer-
|
|
30
|
-
export { D as DrillDown, b as DrillDownContent, c as DrillDownFooter, a as DrillDownHeader, d as DrillDownNextButton, e as DrillDownPrevButton, u as useDrillDown } from './useDrilldown-
|
|
31
|
-
export { E as EditCard } from './EditCard-
|
|
32
|
-
export { F as FieldLabel } from './FieldLabel-
|
|
27
|
+
export { D as Dnd } from './index-DtsM4pjR.js';
|
|
28
|
+
export { D as Drawer } from './Drawer-CouIrQ8u.js';
|
|
29
|
+
export { D as DrillDown, b as DrillDownContent, c as DrillDownFooter, a as DrillDownHeader, d as DrillDownNextButton, e as DrillDownPrevButton, u as useDrillDown } from './useDrilldown-6SfknQ2s.js';
|
|
30
|
+
export { E as EditCard } from './EditCard-DFBjxF9l.js';
|
|
31
|
+
export { F as FieldLabel } from './FieldLabel-rHPbiyR3.js';
|
|
33
32
|
export { w as warnDeprecatedErrorUsage } from './utils-CM48ODEJ.js';
|
|
34
33
|
export { F as FieldMessage } from './FieldMessage-DzxfodaI.js';
|
|
35
|
-
|
|
34
|
+
export { F as Flex } from './Flex-DOUtHiPi.js';
|
|
36
35
|
export { G as Grid } from './Grid-B1VVssDD.js';
|
|
37
36
|
export { I as Icon } from './Icon-BMMbp40n.js';
|
|
38
|
-
export { I as InputMask } from './InputMask-
|
|
37
|
+
export { I as InputMask } from './InputMask-DxbFpzo7.js';
|
|
39
38
|
export { L as Layout, b as LayoutElement, a as LayoutItem } from './Layout-C2Q2hyLG.js';
|
|
40
39
|
export { L as Link, u as useLinkStyles } from './Link-BUgivkGS.js';
|
|
41
40
|
export { L as LinkButton } from './LinkButton-CuHSdGdj.js';
|
|
42
41
|
export { L as List } from './List-BXyHWQ9e.js';
|
|
43
|
-
|
|
44
|
-
export { L as ListView, a as ListViewOption, b as ListViewOptionCell } from './ListView-
|
|
42
|
+
export { L as Listbox } from './Listbox-BBrsMfO3.js';
|
|
43
|
+
export { L as ListView, a as ListViewOption, b as ListViewOptionCell } from './ListView-CYkuvkAy.js';
|
|
45
44
|
export { M as Menu } from './Menu-wpTyUDac.js';
|
|
46
|
-
export { N as NumberField } from './NumberField-
|
|
45
|
+
export { N as NumberField } from './NumberField-DMHJ2Cyi.js';
|
|
47
46
|
export { Overflow, OverflowText } from './Overflow.js';
|
|
48
|
-
export { P as Page } from './Page-
|
|
49
|
-
export { P as Pagination } from './Pagination-
|
|
50
|
-
export { P as Popover } from './Popover-
|
|
51
|
-
export { P as ProgressBar } from './ProgressBar-
|
|
52
|
-
export { R as Radio } from './Radio-
|
|
53
|
-
export { S as SearchField } from './SearchField-
|
|
47
|
+
export { P as Page } from './Page-Blw4TE5J.js';
|
|
48
|
+
export { P as Pagination } from './Pagination-DYNH3WeU.js';
|
|
49
|
+
export { P as Popover } from './Popover-C_XdNvAZ.js';
|
|
50
|
+
export { P as ProgressBar } from './ProgressBar-BwHaAD25.js';
|
|
51
|
+
export { R as Radio } from './Radio-DJ6KgfcS.js';
|
|
52
|
+
export { S as SearchField } from './SearchField-BplvDpBG.js';
|
|
54
53
|
export { S as SegmentedControl, a as SegmentedControlSegment } from './SegmentedControl-Chhqyyra.js';
|
|
55
|
-
export { S as SelectCard } from './SelectCard-
|
|
56
|
-
export { S as SelectTrigger } from './SelectTrigger-
|
|
54
|
+
export { S as SelectCard } from './SelectCard-E-13CjHS.js';
|
|
55
|
+
export { S as SelectTrigger } from './SelectTrigger-DtyxYDzP.js';
|
|
57
56
|
export { S as SideNav } from './SideNav-CZRVOSbt.js';
|
|
58
57
|
export { Skeleton, SkeletonCircle, SkeletonPill, SkeletonRectangle, SkeletonText } from './Skeleton.js';
|
|
59
58
|
export { S as Spinner } from './Spinner-lPMo68yW.js';
|
|
60
59
|
export { S as SrOnly } from './SrOnly-pnf8ajnh.js';
|
|
61
60
|
export { S as Stepper } from './Stepper-CYY64NU1.js';
|
|
62
|
-
export { S as Switch } from './Switch-
|
|
61
|
+
export { S as Switch } from './Switch-CElshQ9N.js';
|
|
63
62
|
export { T as Tab } from './Tab-CewPzmuK.js';
|
|
64
|
-
export { T as Text } from './Text-
|
|
65
|
-
export { T as Textarea } from './Textarea-
|
|
66
|
-
export { T as TextField } from './TextField-
|
|
67
|
-
export { T as TimeField } from './TimeField-
|
|
68
|
-
export { T as Toaster } from './Toaster-
|
|
69
|
-
export { t as toast } from './Toaster-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
import { c as cx } from './index-De1g9FRV.js';
|
|
73
|
-
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-CB_zHDbW.js';
|
|
74
|
-
import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
|
|
75
|
-
import { T as Tooltip } from './Tooltip-BlStOXN3.js';
|
|
63
|
+
export { T as Text } from './Text-C0F8AkvH.js';
|
|
64
|
+
export { T as Textarea } from './Textarea-CGgyvnM8.js';
|
|
65
|
+
export { T as TextField } from './TextField-yL52fx5R.js';
|
|
66
|
+
export { T as TimeField } from './TimeField-BEvxjjFp.js';
|
|
67
|
+
export { T as Toaster } from './Toaster-DuadB8pq.js';
|
|
68
|
+
export { t as toast } from './Toaster-DllJAOK8.js';
|
|
69
|
+
export { T as Toolbar } from './Toolbar-QYRQv45Y.js';
|
|
70
|
+
export { T as Tooltip } from './Tooltip-lBmgi5ZB.js';
|
|
76
71
|
export { u as useAccessibleColor } from './useAccessibleColor-BYKjkGRg.js';
|
|
77
72
|
export { u as useBreakpoint } from './useBreakpoint-CeaUyHxh.js';
|
|
73
|
+
export { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
|
|
78
74
|
export { u as usePrefersColorScheme } from './usePrefersColorScheme-_hT7dK7_.js';
|
|
79
75
|
export { u as usePrefersReducedMotion } from './usePrefersReducedMotion-DR9B_D6w.js';
|
|
80
76
|
export { u as useSwipe } from './useSwipe-Cp-CJxLU.js';
|
|
81
|
-
|
|
77
|
+
export { useTrackingId } from './useTrackingId.js';
|
|
82
78
|
export { A as AnvilProvider, a as AnvilProviderContext } from './AnvilProvider-JXEbeQjR.js';
|
|
83
79
|
export { L as LocalizationProvider } from './LocalizationProvider-CO8fQGqs.js';
|
|
84
80
|
export { L as LocalizationContext, u as useLocalizationContext } from './LocalizationContext-UsmB5mnR.js';
|
|
@@ -87,11 +83,6 @@ export { T as ThemeProvider } from './ThemeProvider-D4KdGCaP.js';
|
|
|
87
83
|
export { u as useTheme } from './useTheme-B4i6a3bM.js';
|
|
88
84
|
export { T as TrackingProvider } from './TrackingProvider-Co4lyoI9.js';
|
|
89
85
|
export { u as useTrackingContext } from './useTrackingContext-C522P4sv.js';
|
|
90
|
-
import { g as getKeyboardFocusableElements } from './getKeyboardFocusableElements-QqcABz0D.js';
|
|
91
|
-
import { u as useIntersectionObserver } from './useIntersectionObserver-BEmMDO3P.js';
|
|
92
|
-
import { S as SvgArrowDropDown } from './arrow_drop_down-ChAdBDux.js';
|
|
93
|
-
import { S as SvgMoreHoriz } from './more_horiz-DJgdQiy0.js';
|
|
94
|
-
import { S as SvgMoreVert } from './more_vert-C_lJSyxt.js';
|
|
95
86
|
|
|
96
87
|
const IANA_TIMEZONES = [
|
|
97
88
|
"Pacific/Kiritimati",
|
|
@@ -522,760 +513,5 @@ const IANA_TIMEZONES = [
|
|
|
522
513
|
"Pacific/Pago_Pago"
|
|
523
514
|
];
|
|
524
515
|
|
|
525
|
-
|
|
526
|
-
isInOverflowMenu: false
|
|
527
|
-
});
|
|
528
|
-
const useOverFlowItemContext = () => useContext(OverflowItemContext);
|
|
529
|
-
|
|
530
|
-
const ToolbarContext = createContext({
|
|
531
|
-
overflowItems: [],
|
|
532
|
-
addItem: () => {
|
|
533
|
-
return;
|
|
534
|
-
},
|
|
535
|
-
removeItem: () => {
|
|
536
|
-
return;
|
|
537
|
-
},
|
|
538
|
-
toolbarRef: { current: null },
|
|
539
|
-
orderedIds: [],
|
|
540
|
-
overflow: "wrap",
|
|
541
|
-
size: "xsmall"
|
|
542
|
-
});
|
|
543
|
-
const useToolbarSize = () => useContext(ToolbarContext).size;
|
|
544
|
-
|
|
545
|
-
function getToolbarElements(toolbarElement) {
|
|
546
|
-
const toolbarContent = toolbarElement.querySelector(
|
|
547
|
-
'[data-anv="toolbar-content"]'
|
|
548
|
-
);
|
|
549
|
-
const mainItems = getKeyboardFocusableElements(toolbarContent).filter(
|
|
550
|
-
(item) => {
|
|
551
|
-
const isVisible = !item.closest('[aria-hidden="true"]');
|
|
552
|
-
return isVisible;
|
|
553
|
-
}
|
|
554
|
-
);
|
|
555
|
-
const overflowTrigger = toolbarElement.querySelector(
|
|
556
|
-
'[data-anv="toolbar-overflow-trigger"]'
|
|
557
|
-
);
|
|
558
|
-
return overflowTrigger ? [...mainItems, overflowTrigger] : mainItems;
|
|
559
|
-
}
|
|
560
|
-
function updateToolbarItemsTabIndex(toolbarElement, activeItem) {
|
|
561
|
-
if (!toolbarElement) return;
|
|
562
|
-
const items = getToolbarElements(toolbarElement);
|
|
563
|
-
if (!items.length) return;
|
|
564
|
-
let activeIndex = 0;
|
|
565
|
-
if (typeof activeItem === "number") {
|
|
566
|
-
activeIndex = Math.max(0, Math.min(activeItem, items.length - 1));
|
|
567
|
-
} else if (activeItem instanceof Element) {
|
|
568
|
-
const foundIndex = items.indexOf(activeItem);
|
|
569
|
-
if (foundIndex !== -1) {
|
|
570
|
-
activeIndex = foundIndex;
|
|
571
|
-
}
|
|
572
|
-
}
|
|
573
|
-
items.forEach((item, index) => {
|
|
574
|
-
item.setAttribute("tabindex", index === activeIndex ? "0" : "-1");
|
|
575
|
-
});
|
|
576
|
-
return items[activeIndex];
|
|
577
|
-
}
|
|
578
|
-
function handleToolbarKeyDown(event, toolbarElement) {
|
|
579
|
-
if (!toolbarElement || event.altKey || event.ctrlKey || event.metaKey) return;
|
|
580
|
-
const items = getToolbarElements(toolbarElement);
|
|
581
|
-
if (!items.length) return;
|
|
582
|
-
const activeElement = event.target;
|
|
583
|
-
if (!toolbarElement.contains(activeElement)) return;
|
|
584
|
-
const activeItem = items.find(
|
|
585
|
-
(item) => item === activeElement || Array.from(item.children).some((child) => child === activeElement)
|
|
586
|
-
);
|
|
587
|
-
const activeIndex = activeItem ? items.indexOf(activeItem) : -1;
|
|
588
|
-
if (activeIndex === -1) return;
|
|
589
|
-
let nextIndex = activeIndex;
|
|
590
|
-
const isVertical = toolbarElement.getAttribute("aria-orientation") === "vertical";
|
|
591
|
-
switch (event.key) {
|
|
592
|
-
case "ArrowLeft":
|
|
593
|
-
case "ArrowUp":
|
|
594
|
-
event.preventDefault();
|
|
595
|
-
if (isVertical && event.key === "ArrowUp" || !isVertical && event.key === "ArrowLeft") {
|
|
596
|
-
nextIndex = activeIndex <= 0 ? items.length - 1 : activeIndex - 1;
|
|
597
|
-
}
|
|
598
|
-
break;
|
|
599
|
-
case "ArrowRight":
|
|
600
|
-
case "ArrowDown":
|
|
601
|
-
event.preventDefault();
|
|
602
|
-
if (isVertical && event.key === "ArrowDown" || !isVertical && event.key === "ArrowRight") {
|
|
603
|
-
nextIndex = activeIndex >= items.length - 1 ? 0 : activeIndex + 1;
|
|
604
|
-
}
|
|
605
|
-
break;
|
|
606
|
-
case "Home":
|
|
607
|
-
event.preventDefault();
|
|
608
|
-
nextIndex = 0;
|
|
609
|
-
break;
|
|
610
|
-
case "End":
|
|
611
|
-
event.preventDefault();
|
|
612
|
-
nextIndex = items.length - 1;
|
|
613
|
-
break;
|
|
614
|
-
default:
|
|
615
|
-
return;
|
|
616
|
-
}
|
|
617
|
-
updateToolbarItemsTabIndex(toolbarElement, nextIndex);
|
|
618
|
-
items[nextIndex]?.focus();
|
|
619
|
-
}
|
|
620
|
-
const handleMenuKeyboardNavigation = (event) => {
|
|
621
|
-
const menuItems = Array.from(
|
|
622
|
-
event.currentTarget.querySelectorAll('[role="menuitem"]')
|
|
623
|
-
).map((menuItem) => {
|
|
624
|
-
return getKeyboardFocusableElements(menuItem)[0] || menuItem;
|
|
625
|
-
});
|
|
626
|
-
if (!menuItems.length) return;
|
|
627
|
-
const currentIndex = menuItems.indexOf(document.activeElement);
|
|
628
|
-
if (currentIndex === -1) return;
|
|
629
|
-
let nextIndex = currentIndex;
|
|
630
|
-
const isModifierKey = event.altKey || event.ctrlKey || event.metaKey;
|
|
631
|
-
if (isModifierKey) return;
|
|
632
|
-
switch (event.key) {
|
|
633
|
-
case "ArrowDown":
|
|
634
|
-
case "ArrowUp": {
|
|
635
|
-
event.preventDefault();
|
|
636
|
-
const direction = event.key === "ArrowDown" ? 1 : -1;
|
|
637
|
-
nextIndex = (currentIndex + direction + menuItems.length) % menuItems.length;
|
|
638
|
-
break;
|
|
639
|
-
}
|
|
640
|
-
case "Home":
|
|
641
|
-
event.preventDefault();
|
|
642
|
-
nextIndex = 0;
|
|
643
|
-
break;
|
|
644
|
-
case "End":
|
|
645
|
-
event.preventDefault();
|
|
646
|
-
nextIndex = menuItems.length - 1;
|
|
647
|
-
break;
|
|
648
|
-
default:
|
|
649
|
-
return;
|
|
650
|
-
}
|
|
651
|
-
menuItems[nextIndex]?.focus();
|
|
652
|
-
};
|
|
653
|
-
|
|
654
|
-
const toolbar = "_toolbar_8m7of_1";
|
|
655
|
-
const styles = {
|
|
656
|
-
toolbar: toolbar,
|
|
657
|
-
"toolbar-content": "_toolbar-content_8m7of_5",
|
|
658
|
-
"toolbar-overflow-content": "_toolbar-overflow-content_8m7of_9",
|
|
659
|
-
"toolbar-button-item": "_toolbar-button-item_8m7of_17",
|
|
660
|
-
"toolbar-button-toggle-item": "_toolbar-button-toggle-item_8m7of_26",
|
|
661
|
-
"toolbar-overflow-trigger": "_toolbar-overflow-trigger_8m7of_49",
|
|
662
|
-
"toolbar-item": "_toolbar-item_8m7of_60",
|
|
663
|
-
"overflow-collapse": "_overflow-collapse_8m7of_66"
|
|
664
|
-
};
|
|
665
|
-
|
|
666
|
-
const ToolbarItemWrapper = ({
|
|
667
|
-
item,
|
|
668
|
-
children
|
|
669
|
-
}) => {
|
|
670
|
-
const { addItem, removeItem, toolbarRef, overflow } = useContext(ToolbarContext);
|
|
671
|
-
const itemId = useId();
|
|
672
|
-
const elementRef = useRef(null);
|
|
673
|
-
const prevIntersectingRef = useRef(true);
|
|
674
|
-
const isCollapseMode = overflow === "collapse";
|
|
675
|
-
const handleVisibilityChange = useCallback(
|
|
676
|
-
(isVisible) => {
|
|
677
|
-
if (!isCollapseMode || prevIntersectingRef.current === isVisible) return;
|
|
678
|
-
const itemWithId = { ...item, id: itemId };
|
|
679
|
-
if (isVisible) {
|
|
680
|
-
removeItem(itemWithId);
|
|
681
|
-
} else {
|
|
682
|
-
addItem(itemWithId);
|
|
683
|
-
}
|
|
684
|
-
prevIntersectingRef.current = isVisible;
|
|
685
|
-
},
|
|
686
|
-
[isCollapseMode, item, itemId, addItem, removeItem]
|
|
687
|
-
);
|
|
688
|
-
const { isIntersecting, ref } = useIntersectionObserver({
|
|
689
|
-
root: isCollapseMode ? toolbarRef.current : null,
|
|
690
|
-
threshold: 1,
|
|
691
|
-
initialIsIntersecting: false,
|
|
692
|
-
onChange: handleVisibilityChange
|
|
693
|
-
});
|
|
694
|
-
const setRefCallback = useCallback(
|
|
695
|
-
(node) => {
|
|
696
|
-
elementRef.current = node;
|
|
697
|
-
if (isCollapseMode) {
|
|
698
|
-
ref(node);
|
|
699
|
-
}
|
|
700
|
-
},
|
|
701
|
-
[ref, isCollapseMode]
|
|
702
|
-
);
|
|
703
|
-
const handleFocusOrClick = useCallback(() => {
|
|
704
|
-
if (!toolbarRef.current || !elementRef.current) return;
|
|
705
|
-
const currentElement = elementRef.current.querySelector("button, a, input");
|
|
706
|
-
if (!currentElement) return;
|
|
707
|
-
updateToolbarItemsTabIndex(toolbarRef.current, currentElement);
|
|
708
|
-
}, [toolbarRef]);
|
|
709
|
-
useEffect(() => {
|
|
710
|
-
const interactiveEl = elementRef.current?.querySelector("button, a, input");
|
|
711
|
-
if (!interactiveEl) return;
|
|
712
|
-
interactiveEl.addEventListener("focus", handleFocusOrClick);
|
|
713
|
-
interactiveEl.addEventListener("click", handleFocusOrClick);
|
|
714
|
-
return () => {
|
|
715
|
-
interactiveEl.removeEventListener("focus", handleFocusOrClick);
|
|
716
|
-
interactiveEl.removeEventListener("click", handleFocusOrClick);
|
|
717
|
-
};
|
|
718
|
-
}, [handleFocusOrClick]);
|
|
719
|
-
useEffect(() => {
|
|
720
|
-
if (isCollapseMode) {
|
|
721
|
-
prevIntersectingRef.current = true;
|
|
722
|
-
}
|
|
723
|
-
}, [isCollapseMode]);
|
|
724
|
-
const isHidden = isCollapseMode && !isIntersecting;
|
|
725
|
-
return /* @__PURE__ */ jsx(
|
|
726
|
-
"div",
|
|
727
|
-
{
|
|
728
|
-
ref: setRefCallback,
|
|
729
|
-
className: styles["toolbar-item"],
|
|
730
|
-
style: { visibility: isHidden ? "hidden" : "visible" },
|
|
731
|
-
"aria-hidden": isHidden,
|
|
732
|
-
...{ inert: isHidden ? "" : void 0 },
|
|
733
|
-
"data-id": itemId,
|
|
734
|
-
"data-anv": "toolbar-item",
|
|
735
|
-
children
|
|
736
|
-
}
|
|
737
|
-
);
|
|
738
|
-
};
|
|
739
|
-
|
|
740
|
-
const ToolbarButton = forwardRef(
|
|
741
|
-
(props, ref) => {
|
|
742
|
-
const { appearance = "ghost", className, children, ...rest } = props;
|
|
743
|
-
const { isInOverflowMenu = false } = useOverFlowItemContext?.() || {};
|
|
744
|
-
const size = useToolbarSize();
|
|
745
|
-
const trackingId = useTrackingId({
|
|
746
|
-
name: "ToolbarButton",
|
|
747
|
-
data: {
|
|
748
|
-
disabled: props.disabled,
|
|
749
|
-
"aria-label": props["aria-label"],
|
|
750
|
-
children: props.children
|
|
751
|
-
},
|
|
752
|
-
hasOverride: !!props["data-tracking-id"]
|
|
753
|
-
});
|
|
754
|
-
const buttonClassNames = cx(className, styles["toolbar-button-item"]);
|
|
755
|
-
const item = children ? /* @__PURE__ */ jsx(
|
|
756
|
-
Button,
|
|
757
|
-
{
|
|
758
|
-
ref,
|
|
759
|
-
"data-tracking-id": trackingId,
|
|
760
|
-
appearance,
|
|
761
|
-
size,
|
|
762
|
-
"data-anv": "toolbar-button",
|
|
763
|
-
className: buttonClassNames,
|
|
764
|
-
...rest,
|
|
765
|
-
children
|
|
766
|
-
}
|
|
767
|
-
) : /* @__PURE__ */ jsxs(Tooltip, { children: [
|
|
768
|
-
/* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(
|
|
769
|
-
Button,
|
|
770
|
-
{
|
|
771
|
-
ref,
|
|
772
|
-
"data-tracking-id": trackingId,
|
|
773
|
-
appearance,
|
|
774
|
-
size,
|
|
775
|
-
"data-anv": "toolbar-button",
|
|
776
|
-
className: buttonClassNames,
|
|
777
|
-
...rest
|
|
778
|
-
}
|
|
779
|
-
) }),
|
|
780
|
-
/* @__PURE__ */ jsx(Tooltip.Content, { children: rest["aria-label"] })
|
|
781
|
-
] });
|
|
782
|
-
if (isInOverflowMenu) {
|
|
783
|
-
return item;
|
|
784
|
-
}
|
|
785
|
-
return /* @__PURE__ */ jsx(ToolbarItemWrapper, { item: { itemProps: props, itemType: "button" }, children: item });
|
|
786
|
-
}
|
|
787
|
-
);
|
|
788
|
-
ToolbarButton.displayName = "ToolbarButton";
|
|
789
|
-
|
|
790
|
-
const ToolbarButtonToggle = forwardRef((props, _ref) => {
|
|
791
|
-
const { className, children, ...rest } = props;
|
|
792
|
-
const { isInOverflowMenu = false } = useOverFlowItemContext?.() || {};
|
|
793
|
-
const size = useToolbarSize();
|
|
794
|
-
const trackingId = useTrackingId({
|
|
795
|
-
name: "ToolbarButtonToggle",
|
|
796
|
-
data: {
|
|
797
|
-
checked: props.checked,
|
|
798
|
-
disabled: props.disabled,
|
|
799
|
-
"aria-label": props["aria-label"],
|
|
800
|
-
children: props.children
|
|
801
|
-
},
|
|
802
|
-
hasOverride: !!props["data-tracking-id"]
|
|
803
|
-
});
|
|
804
|
-
const buttonToggleClassNames = cx(
|
|
805
|
-
className,
|
|
806
|
-
styles["toolbar-button-item"],
|
|
807
|
-
styles["toolbar-button-toggle-item"]
|
|
808
|
-
);
|
|
809
|
-
const item = children ? /* @__PURE__ */ jsx(
|
|
810
|
-
ButtonToggle,
|
|
811
|
-
{
|
|
812
|
-
"data-tracking-id": trackingId,
|
|
813
|
-
size,
|
|
814
|
-
"data-anv": "toolbar-button-toggle",
|
|
815
|
-
className: buttonToggleClassNames,
|
|
816
|
-
...rest,
|
|
817
|
-
children
|
|
818
|
-
}
|
|
819
|
-
) : /* @__PURE__ */ jsxs(Tooltip, { children: [
|
|
820
|
-
/* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(
|
|
821
|
-
ButtonToggle,
|
|
822
|
-
{
|
|
823
|
-
"data-tracking-id": trackingId,
|
|
824
|
-
size,
|
|
825
|
-
"data-anv": "toolbar-button-toggle",
|
|
826
|
-
className: buttonToggleClassNames,
|
|
827
|
-
...rest
|
|
828
|
-
}
|
|
829
|
-
) }),
|
|
830
|
-
/* @__PURE__ */ jsx(Tooltip.Content, { children: rest["aria-label"] })
|
|
831
|
-
] });
|
|
832
|
-
if (isInOverflowMenu) {
|
|
833
|
-
return item;
|
|
834
|
-
}
|
|
835
|
-
return /* @__PURE__ */ jsx(ToolbarItemWrapper, { item: { itemProps: props, itemType: "buttonToggle" }, children: item });
|
|
836
|
-
});
|
|
837
|
-
ToolbarButtonToggle.displayName = "ToolbarButtonToggle";
|
|
838
|
-
|
|
839
|
-
const ToolbarButtonLink = forwardRef((props, _ref) => {
|
|
840
|
-
const { appearance = "ghost", className, children, icon, ...rest } = props;
|
|
841
|
-
const { isInOverflowMenu = false } = useOverFlowItemContext?.() || {};
|
|
842
|
-
const size = useToolbarSize();
|
|
843
|
-
const trackingId = useTrackingId({
|
|
844
|
-
name: "ToolbarButtonLink",
|
|
845
|
-
data: {
|
|
846
|
-
href: props.href,
|
|
847
|
-
disabled: props.disabled,
|
|
848
|
-
"aria-label": props["aria-label"],
|
|
849
|
-
children: props.children,
|
|
850
|
-
target: props.target
|
|
851
|
-
},
|
|
852
|
-
hasOverride: !!props["data-tracking-id"]
|
|
853
|
-
});
|
|
854
|
-
const buttonLinkClassNames = cx(className, styles["toolbar-button-item"]);
|
|
855
|
-
const item = children ? /* @__PURE__ */ jsx(
|
|
856
|
-
ButtonLink,
|
|
857
|
-
{
|
|
858
|
-
"data-tracking-id": trackingId,
|
|
859
|
-
appearance,
|
|
860
|
-
size,
|
|
861
|
-
icon,
|
|
862
|
-
"data-anv": "toolbar-button-link",
|
|
863
|
-
className: buttonLinkClassNames,
|
|
864
|
-
...rest,
|
|
865
|
-
children
|
|
866
|
-
}
|
|
867
|
-
) : /* @__PURE__ */ jsxs(Tooltip, { children: [
|
|
868
|
-
/* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(
|
|
869
|
-
ButtonLink,
|
|
870
|
-
{
|
|
871
|
-
"data-tracking-id": trackingId,
|
|
872
|
-
appearance,
|
|
873
|
-
size,
|
|
874
|
-
icon,
|
|
875
|
-
"data-anv": "toolbar-button-link",
|
|
876
|
-
className: buttonLinkClassNames,
|
|
877
|
-
...rest,
|
|
878
|
-
children
|
|
879
|
-
}
|
|
880
|
-
) }),
|
|
881
|
-
/* @__PURE__ */ jsx(Tooltip.Content, { children: rest["aria-label"] })
|
|
882
|
-
] });
|
|
883
|
-
if (isInOverflowMenu) {
|
|
884
|
-
return item;
|
|
885
|
-
}
|
|
886
|
-
return /* @__PURE__ */ jsx(ToolbarItemWrapper, { item: { itemProps: props, itemType: "buttonLink" }, children: item });
|
|
887
|
-
});
|
|
888
|
-
ToolbarButtonLink.displayName = "ToolbarButtonLink";
|
|
889
|
-
|
|
890
|
-
const ToolbarSelect = forwardRef(
|
|
891
|
-
(props, _ref) => {
|
|
892
|
-
const {
|
|
893
|
-
appearance = "ghost",
|
|
894
|
-
onChange,
|
|
895
|
-
selected: selectedItemId,
|
|
896
|
-
accessibleLabel,
|
|
897
|
-
className,
|
|
898
|
-
items,
|
|
899
|
-
...rest
|
|
900
|
-
} = props;
|
|
901
|
-
const selectId = useId();
|
|
902
|
-
const [isPopoverOpen, setIsPopoverOpen] = useState(false);
|
|
903
|
-
const defaultId = items.length > 0 ? items[0].id : "";
|
|
904
|
-
const [internalSelectedId, setInternalSelectedId] = useState(defaultId);
|
|
905
|
-
const selectedId = selectedItemId ?? internalSelectedId;
|
|
906
|
-
const selectedItem = items.find((item2) => item2.id === selectedId) || items.find((item2) => item2.id === defaultId);
|
|
907
|
-
useEffect(() => {
|
|
908
|
-
if (!selectedItemId && items.length > 0 && !items.some((item2) => item2.id === internalSelectedId)) {
|
|
909
|
-
setInternalSelectedId(items[0].id);
|
|
910
|
-
}
|
|
911
|
-
}, [items, selectedItemId, internalSelectedId]);
|
|
912
|
-
const handleSelectionChange = (selected) => {
|
|
913
|
-
if (selected?.id) {
|
|
914
|
-
if (selectedItemId === void 0) {
|
|
915
|
-
setInternalSelectedId(selected.id);
|
|
916
|
-
}
|
|
917
|
-
onChange?.(selected.id);
|
|
918
|
-
setIsPopoverOpen(false);
|
|
919
|
-
}
|
|
920
|
-
};
|
|
921
|
-
const { isInOverflowMenu = false } = useOverFlowItemContext?.() || {};
|
|
922
|
-
const toolbarSize = useToolbarSize();
|
|
923
|
-
const trackingId = useTrackingId({
|
|
924
|
-
name: "ToolbarSelect",
|
|
925
|
-
data: {
|
|
926
|
-
selected: props.selected,
|
|
927
|
-
disabled: props.disabled,
|
|
928
|
-
"aria-label": props["aria-label"],
|
|
929
|
-
items: props.items
|
|
930
|
-
},
|
|
931
|
-
hasOverride: !!props["data-tracking-id"]
|
|
932
|
-
});
|
|
933
|
-
const buttonClassNames = cx(className, styles["toolbar-button-item"]);
|
|
934
|
-
const item = /* @__PURE__ */ jsxs(
|
|
935
|
-
Popover,
|
|
936
|
-
{
|
|
937
|
-
noPadding: true,
|
|
938
|
-
open: isPopoverOpen,
|
|
939
|
-
onClickOutside: () => {
|
|
940
|
-
setIsPopoverOpen(false);
|
|
941
|
-
},
|
|
942
|
-
onClose: () => {
|
|
943
|
-
setIsPopoverOpen(false);
|
|
944
|
-
},
|
|
945
|
-
children: [
|
|
946
|
-
/* @__PURE__ */ jsx(
|
|
947
|
-
Popover.Button,
|
|
948
|
-
{
|
|
949
|
-
"data-tracking-id": trackingId,
|
|
950
|
-
appearance,
|
|
951
|
-
size: toolbarSize,
|
|
952
|
-
icon: { after: SvgArrowDropDown },
|
|
953
|
-
className: buttonClassNames,
|
|
954
|
-
id: selectId,
|
|
955
|
-
"data-anv": "toolbar-select",
|
|
956
|
-
onClick: () => {
|
|
957
|
-
setIsPopoverOpen(!isPopoverOpen);
|
|
958
|
-
},
|
|
959
|
-
...rest,
|
|
960
|
-
children: selectedItem?.label
|
|
961
|
-
}
|
|
962
|
-
),
|
|
963
|
-
/* @__PURE__ */ jsx(
|
|
964
|
-
Popover.Content,
|
|
965
|
-
{
|
|
966
|
-
className: styles["toolbar-select-content"],
|
|
967
|
-
"aria-label": accessibleLabel,
|
|
968
|
-
children: /* @__PURE__ */ jsx(
|
|
969
|
-
Listbox,
|
|
970
|
-
{
|
|
971
|
-
selected: selectedItem,
|
|
972
|
-
onSelectionChange: handleSelectionChange,
|
|
973
|
-
items,
|
|
974
|
-
"aria-labelledby": selectId,
|
|
975
|
-
disableAutoSelectOnFocus: true,
|
|
976
|
-
children: ({ items: items2 }) => items2.map((item2) => /* @__PURE__ */ jsx(Listbox.Option, { item: item2, children: item2.label }, item2.label))
|
|
977
|
-
}
|
|
978
|
-
)
|
|
979
|
-
}
|
|
980
|
-
)
|
|
981
|
-
]
|
|
982
|
-
}
|
|
983
|
-
);
|
|
984
|
-
if (isInOverflowMenu) {
|
|
985
|
-
return item;
|
|
986
|
-
}
|
|
987
|
-
return /* @__PURE__ */ jsx(ToolbarItemWrapper, { item: { itemProps: props, itemType: "select" }, children: item });
|
|
988
|
-
}
|
|
989
|
-
);
|
|
990
|
-
ToolbarSelect.displayName = "ToolbarSelect";
|
|
991
|
-
|
|
992
|
-
const OverflowItem = ({ itemType, itemProps }) => {
|
|
993
|
-
switch (itemType) {
|
|
994
|
-
case "button":
|
|
995
|
-
return /* @__PURE__ */ jsx(ToolbarButton, { ...itemProps });
|
|
996
|
-
case "buttonToggle":
|
|
997
|
-
return /* @__PURE__ */ jsx(ToolbarButtonToggle, { ...itemProps });
|
|
998
|
-
case "buttonLink":
|
|
999
|
-
return /* @__PURE__ */ jsx(ToolbarButtonLink, { ...itemProps });
|
|
1000
|
-
case "select":
|
|
1001
|
-
return /* @__PURE__ */ jsx(ToolbarSelect, { ...itemProps });
|
|
1002
|
-
default:
|
|
1003
|
-
return null;
|
|
1004
|
-
}
|
|
1005
|
-
};
|
|
1006
|
-
const ToolbarOverflowMenu = ({
|
|
1007
|
-
additionalItems,
|
|
1008
|
-
direction
|
|
1009
|
-
}) => {
|
|
1010
|
-
const { overflowItems, orderedIds } = useContext(ToolbarContext);
|
|
1011
|
-
const menuTriggerId = useId();
|
|
1012
|
-
const size = useToolbarSize();
|
|
1013
|
-
const orderedItems = useMemo(() => {
|
|
1014
|
-
const allElements = orderedIds?.map((id) => {
|
|
1015
|
-
return overflowItems.find((item) => item.id === id);
|
|
1016
|
-
});
|
|
1017
|
-
return allElements?.filter((item) => item !== void 0) || [];
|
|
1018
|
-
}, [orderedIds, overflowItems]);
|
|
1019
|
-
const popoverButtonClassNames = cx(
|
|
1020
|
-
styles["toolbar-button-item"],
|
|
1021
|
-
styles["toolbar-overflow-trigger"]
|
|
1022
|
-
);
|
|
1023
|
-
const overflowIcon = direction === "horizontal" ? SvgMoreHoriz : SvgMoreVert;
|
|
1024
|
-
return /* @__PURE__ */ jsxs(Popover, { noPadding: true, children: [
|
|
1025
|
-
/* @__PURE__ */ jsx(
|
|
1026
|
-
Popover.Button,
|
|
1027
|
-
{
|
|
1028
|
-
size,
|
|
1029
|
-
appearance: "ghost",
|
|
1030
|
-
id: menuTriggerId,
|
|
1031
|
-
className: popoverButtonClassNames,
|
|
1032
|
-
"data-anv": "toolbar-overflow-trigger",
|
|
1033
|
-
"aria-label": "Additional toolbar options",
|
|
1034
|
-
icon: overflowIcon
|
|
1035
|
-
}
|
|
1036
|
-
),
|
|
1037
|
-
/* @__PURE__ */ jsx(Popover.Content, { children: /* @__PURE__ */ jsx(OverflowItemContext.Provider, { value: { isInOverflowMenu: true }, children: /* @__PURE__ */ jsxs(
|
|
1038
|
-
"ul",
|
|
1039
|
-
{
|
|
1040
|
-
role: "menu",
|
|
1041
|
-
className: styles["toolbar-overflow-content"],
|
|
1042
|
-
"data-anv": "toolbar-overflow-menu",
|
|
1043
|
-
"aria-labelledby": menuTriggerId,
|
|
1044
|
-
onKeyDown: handleMenuKeyboardNavigation,
|
|
1045
|
-
children: [
|
|
1046
|
-
orderedItems.map((item) => {
|
|
1047
|
-
const { itemType, itemProps, id } = item;
|
|
1048
|
-
return /* @__PURE__ */ jsx(
|
|
1049
|
-
"li",
|
|
1050
|
-
{
|
|
1051
|
-
role: "menuitem",
|
|
1052
|
-
"data-anv": "toolbar-overflow-item",
|
|
1053
|
-
children: /* @__PURE__ */ jsx(
|
|
1054
|
-
OverflowItem,
|
|
1055
|
-
{
|
|
1056
|
-
itemType,
|
|
1057
|
-
itemProps,
|
|
1058
|
-
id
|
|
1059
|
-
}
|
|
1060
|
-
)
|
|
1061
|
-
},
|
|
1062
|
-
`${itemType}-${id}`
|
|
1063
|
-
);
|
|
1064
|
-
}),
|
|
1065
|
-
additionalItems?.map((item, index) => /* @__PURE__ */ jsx(
|
|
1066
|
-
"li",
|
|
1067
|
-
{
|
|
1068
|
-
role: "menuitem",
|
|
1069
|
-
"data-anv": "toolbar-overflow-item",
|
|
1070
|
-
children: item
|
|
1071
|
-
},
|
|
1072
|
-
`additional-item-${index}`
|
|
1073
|
-
))
|
|
1074
|
-
]
|
|
1075
|
-
}
|
|
1076
|
-
) }) })
|
|
1077
|
-
] });
|
|
1078
|
-
};
|
|
1079
|
-
|
|
1080
|
-
const Toolbar = Object.assign(
|
|
1081
|
-
forwardRef(function ToolbarInner(props, ref) {
|
|
1082
|
-
const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
|
|
1083
|
-
const {
|
|
1084
|
-
associatedContent,
|
|
1085
|
-
className,
|
|
1086
|
-
children,
|
|
1087
|
-
style,
|
|
1088
|
-
direction = "horizontal",
|
|
1089
|
-
overflow = "wrap",
|
|
1090
|
-
onKeyDown,
|
|
1091
|
-
additionalItems,
|
|
1092
|
-
size = "xsmall",
|
|
1093
|
-
...rest
|
|
1094
|
-
} = componentProps;
|
|
1095
|
-
const [overflowItems, setOverflowItems] = useState([]);
|
|
1096
|
-
const toolbarItemsRef = useRef(null);
|
|
1097
|
-
const toolbarRef = useRef(null);
|
|
1098
|
-
const [orderedIds, setOrderedIds] = useState([]);
|
|
1099
|
-
useEffect(() => {
|
|
1100
|
-
const newOrderedIds = Array.from(
|
|
1101
|
-
toolbarItemsRef.current?.querySelectorAll("[data-id]") || []
|
|
1102
|
-
).map((el) => {
|
|
1103
|
-
return el.getAttribute("data-id");
|
|
1104
|
-
});
|
|
1105
|
-
setOrderedIds(newOrderedIds);
|
|
1106
|
-
}, [children]);
|
|
1107
|
-
const addItem = useCallback((item) => {
|
|
1108
|
-
setOverflowItems((prev) => [...prev, item]);
|
|
1109
|
-
}, []);
|
|
1110
|
-
const removeItem = useCallback((item) => {
|
|
1111
|
-
setOverflowItems(
|
|
1112
|
-
(prev) => prev.filter((component) => component.id !== item.id)
|
|
1113
|
-
);
|
|
1114
|
-
}, []);
|
|
1115
|
-
useEffect(() => {
|
|
1116
|
-
if (toolbarRef.current) {
|
|
1117
|
-
updateToolbarItemsTabIndex(toolbarRef.current);
|
|
1118
|
-
}
|
|
1119
|
-
}, [children]);
|
|
1120
|
-
const handleKeyDown = useCallback(
|
|
1121
|
-
(event) => {
|
|
1122
|
-
if (toolbarRef.current) {
|
|
1123
|
-
handleToolbarKeyDown(event, toolbarRef.current);
|
|
1124
|
-
}
|
|
1125
|
-
onKeyDown?.(event);
|
|
1126
|
-
},
|
|
1127
|
-
[onKeyDown]
|
|
1128
|
-
);
|
|
1129
|
-
const showOverflowMenu = overflow === "collapse" && overflowItems.length > 0 || !!additionalItems;
|
|
1130
|
-
const value = useMemo(
|
|
1131
|
-
() => ({
|
|
1132
|
-
overflowItems,
|
|
1133
|
-
addItem,
|
|
1134
|
-
removeItem,
|
|
1135
|
-
toolbarRef,
|
|
1136
|
-
orderedIds,
|
|
1137
|
-
overflow,
|
|
1138
|
-
size
|
|
1139
|
-
}),
|
|
1140
|
-
[
|
|
1141
|
-
overflowItems,
|
|
1142
|
-
addItem,
|
|
1143
|
-
removeItem,
|
|
1144
|
-
toolbarRef,
|
|
1145
|
-
orderedIds,
|
|
1146
|
-
overflow,
|
|
1147
|
-
size
|
|
1148
|
-
]
|
|
1149
|
-
);
|
|
1150
|
-
const styleCombined = {
|
|
1151
|
-
...style,
|
|
1152
|
-
...layoutStyles
|
|
1153
|
-
};
|
|
1154
|
-
const toolbarClassNames = cx(styles["toolbar"], className);
|
|
1155
|
-
const toolbarContentClassNames = cx(styles["toolbar-content"], {
|
|
1156
|
-
[styles[`overflow-${overflow}`]]: overflow
|
|
1157
|
-
});
|
|
1158
|
-
return /* @__PURE__ */ jsx(ToolbarContext.Provider, { value, children: /* @__PURE__ */ jsxs(
|
|
1159
|
-
Flex,
|
|
1160
|
-
{
|
|
1161
|
-
direction: direction === "horizontal" ? "row" : "column",
|
|
1162
|
-
wrap: overflow === "wrap" ? "wrap" : "nowrap",
|
|
1163
|
-
alignItems: "center",
|
|
1164
|
-
className: toolbarClassNames,
|
|
1165
|
-
style: styleCombined,
|
|
1166
|
-
ref: useMergeRefs([toolbarRef, ref]),
|
|
1167
|
-
role: "toolbar",
|
|
1168
|
-
"data-anv": "toolbar",
|
|
1169
|
-
"aria-orientation": direction,
|
|
1170
|
-
"aria-label": `Toolbar for ${associatedContent}. Use arrow keys to navigate through toolbar controls.`,
|
|
1171
|
-
onKeyDown: handleKeyDown,
|
|
1172
|
-
...rest,
|
|
1173
|
-
children: [
|
|
1174
|
-
/* @__PURE__ */ jsx(
|
|
1175
|
-
Flex,
|
|
1176
|
-
{
|
|
1177
|
-
ref: useMergeRefs([toolbarItemsRef, ref]),
|
|
1178
|
-
className: toolbarContentClassNames,
|
|
1179
|
-
direction: direction === "horizontal" ? "row" : "column",
|
|
1180
|
-
wrap: overflow === "wrap" ? "wrap" : "nowrap",
|
|
1181
|
-
alignItems: "center",
|
|
1182
|
-
grow: 1,
|
|
1183
|
-
"data-anv": "toolbar-content",
|
|
1184
|
-
children
|
|
1185
|
-
}
|
|
1186
|
-
),
|
|
1187
|
-
showOverflowMenu && /* @__PURE__ */ jsx(
|
|
1188
|
-
ToolbarOverflowMenu,
|
|
1189
|
-
{
|
|
1190
|
-
direction,
|
|
1191
|
-
additionalItems
|
|
1192
|
-
}
|
|
1193
|
-
)
|
|
1194
|
-
]
|
|
1195
|
-
}
|
|
1196
|
-
) });
|
|
1197
|
-
}),
|
|
1198
|
-
{
|
|
1199
|
-
/**
|
|
1200
|
-
* ToolbarButton component for standard clickable actions within a toolbar with anvil2 tracking.
|
|
1201
|
-
*
|
|
1202
|
-
* Features:
|
|
1203
|
-
* - Designed specifically for toolbar integration
|
|
1204
|
-
* - Consistent styling with other toolbar items
|
|
1205
|
-
* - Automatic tooltip for icon-only buttons
|
|
1206
|
-
* - Overflow menu support
|
|
1207
|
-
* - Accessibility enforcement for aria-labels
|
|
1208
|
-
* - Ghost and primary appearance options
|
|
1209
|
-
* - Automatic tracking ID generation for analytics
|
|
1210
|
-
*
|
|
1211
|
-
* @example
|
|
1212
|
-
* <Toolbar.Button icon={BoldIcon} aria-label="Bold text" />
|
|
1213
|
-
*
|
|
1214
|
-
* @example
|
|
1215
|
-
* <Toolbar.Button appearance="primary">
|
|
1216
|
-
* Save
|
|
1217
|
-
* </Toolbar.Button>
|
|
1218
|
-
*/
|
|
1219
|
-
Button: ToolbarButton,
|
|
1220
|
-
/**
|
|
1221
|
-
* ToolbarButtonToggle component for toggleable actions within a toolbar with anvil2 tracking.
|
|
1222
|
-
*
|
|
1223
|
-
* Features:
|
|
1224
|
-
* - Toggle state management
|
|
1225
|
-
* - Designed specifically for toolbar integration
|
|
1226
|
-
* - Consistent styling with other toolbar items
|
|
1227
|
-
* - Overflow menu support
|
|
1228
|
-
* - Accessibility enforcement for aria-labels
|
|
1229
|
-
* - Ghost and primary appearance options
|
|
1230
|
-
* - Automatic tracking ID generation for analytics
|
|
1231
|
-
*
|
|
1232
|
-
* @example
|
|
1233
|
-
* <Toolbar.ButtonToggle icon={BoldIcon} aria-label="Bold" checked={isBold} />
|
|
1234
|
-
*/
|
|
1235
|
-
ButtonToggle: ToolbarButtonToggle,
|
|
1236
|
-
/**
|
|
1237
|
-
* ToolbarButtonLink component for link actions within a toolbar with anvil2 tracking.
|
|
1238
|
-
*
|
|
1239
|
-
* Features:
|
|
1240
|
-
* - Link functionality with href support
|
|
1241
|
-
* - Designed specifically for toolbar integration
|
|
1242
|
-
* - Consistent styling with other toolbar items
|
|
1243
|
-
* - Overflow menu support
|
|
1244
|
-
* - Accessibility enforcement for aria-labels
|
|
1245
|
-
* - Ghost and primary appearance options
|
|
1246
|
-
* - Automatic tracking ID generation for analytics
|
|
1247
|
-
*
|
|
1248
|
-
* @example
|
|
1249
|
-
* <Toolbar.ButtonLink href="/help">
|
|
1250
|
-
* Help
|
|
1251
|
-
* </Toolbar.ButtonLink>
|
|
1252
|
-
*/
|
|
1253
|
-
ButtonLink: ToolbarButtonLink,
|
|
1254
|
-
/**
|
|
1255
|
-
* ToolbarSelect component provides a dropdown selector within a toolbar with anvil2 tracking.
|
|
1256
|
-
*
|
|
1257
|
-
* Features:
|
|
1258
|
-
* - Dropdown menu with selectable options
|
|
1259
|
-
* - Controlled and uncontrolled usage patterns
|
|
1260
|
-
* - Automatic overflow menu integration
|
|
1261
|
-
* - Accessibility support with proper ARIA labels
|
|
1262
|
-
* - Ghost and primary appearance options
|
|
1263
|
-
* - Dropdown arrow icon indicator
|
|
1264
|
-
* - Listbox integration for keyboard navigation
|
|
1265
|
-
* - Automatic tracking ID generation for analytics
|
|
1266
|
-
*
|
|
1267
|
-
* @example
|
|
1268
|
-
* <Toolbar.Select
|
|
1269
|
-
* items={fontOptions}
|
|
1270
|
-
* selected="arial"
|
|
1271
|
-
* accessibleLabel="Font family"
|
|
1272
|
-
* onChange={(id) => setFont(id)}
|
|
1273
|
-
* />
|
|
1274
|
-
*/
|
|
1275
|
-
Select: ToolbarSelect
|
|
1276
|
-
}
|
|
1277
|
-
);
|
|
1278
|
-
Toolbar.displayName = "Toolbar";
|
|
1279
|
-
|
|
1280
|
-
export { Button, ButtonLink, ButtonToggle, Flex, IANA_TIMEZONES, Listbox, Toolbar, Tooltip, useMergeRefs, useTrackingId };
|
|
516
|
+
export { IANA_TIMEZONES };
|
|
1281
517
|
//# sourceMappingURL=index.js.map
|