@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
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog-DGmF6qx3.js","sources":["../src/components/Dialog/DialogHeader.tsx","../src/components/Dialog/DialogFooter.tsx","../src/components/Dialog/DialogContent.tsx","../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport cx from \"classnames\";\n\nimport { Text } from \"../Text\";\nimport { DialogCancelButton } from \"./DialogCancelButton\";\n\nimport styles from \"./Dialog.module.scss\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId, useMergeRefs } from \"../../hooks\";\nimport { DataTrackingId } from \"../../types\";\nimport { useDialogContext } from \"./internal/useDialogContext\";\n\n/**\n * Props for the DialogHeader component\n * @extends ComponentPropsWithoutRef<\"header\">\n */\nexport type DialogHeaderProps = ComponentPropsWithoutRef<\"header\"> &\n DataTrackingId;\n\n/**\n * DialogHeader component for the header section of a Dialog.\n *\n * Features:\n * - Displays dialog title with headline typography\n * - Includes close button with proper accessibility\n * - Sticky positioning for long content\n * - Consistent spacing and styling\n * - Automatic focus management\n *\n * @example\n * <Dialog.Header>Confirm Delete</Dialog.Header>\n */\nexport const DialogHeader = forwardRef<HTMLDivElement, DialogHeaderProps>(\n (props: DialogHeaderProps, ref) => {\n const { children, className, ...rest } = props;\n const { headerRef } = useDialogContext();\n const data = {\n children: childrenToString(props.children),\n };\n\n const trackingId = useTrackingId({\n name: \"Dialog\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const headerClassNames = cx(className, styles[\"header\"]);\n\n return (\n <header\n className={headerClassNames}\n data-anv=\"dialog-header\"\n data-tracking-id={trackingId}\n ref={useMergeRefs([ref, headerRef])}\n {...rest}\n >\n <Text variant=\"headline\" el=\"h1\" className={styles[\"title\"]}>\n {children}\n </Text>\n <span className={styles[\"close-container\"]}>\n <DialogCancelButton\n className={styles[\"close-button\"]}\n size=\"small\"\n appearance=\"ghost\"\n aria-label=\"Close dialog\"\n icon={Close}\n />\n </span>\n </header>\n );\n },\n);\n\nDialogHeader.displayName = \"DialogHeader\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\n\nimport styles from \"./Dialog.module.scss\";\n\n/**\n * Props for the DialogFooter component\n * @extends ComponentPropsWithoutRef<\"footer\">\n */\nexport type DialogFooterProps = ComponentPropsWithoutRef<\"footer\"> & {\n /**\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * DialogFooter component for the footer section of a Dialog.\n *\n * Features:\n * - Container for dialog action buttons\n * - Optional sticky positioning for long content\n * - Consistent spacing and alignment\n * - Right-aligned button layout by default\n * - Flexible content area for custom layouts\n *\n * @example\n * <Dialog.Footer sticky>\n * <Dialog.CancelButton>Cancel</Dialog.CancelButton>\n * <Button appearance=\"primary\">Save</Button>\n * </Dialog.Footer>\n */\nexport const DialogFooter = forwardRef<HTMLElement, DialogFooterProps>(\n (props, ref) => {\n const { children, className, sticky = false, ...rest } = props;\n\n const footerClassNames = cx(styles[\"footer\"], className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n return (\n <footer\n className={footerClassNames}\n data-anv=\"dialog-footer\"\n ref={ref}\n {...rest}\n >\n {children}\n </footer>\n );\n },\n);\n\nDialogFooter.displayName = \"DialogFooter\";\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n useState,\n} from \"react\";\nimport cx from \"classnames\";\n\nimport styles from \"./Dialog.module.scss\";\nimport { useDialogContext } from \"./internal/useDialogContext\";\n\n/**\n * Props for the DialogContent component\n * @extends ComponentPropsWithoutRef<\"div\">\n */\nexport type DialogContentProps = ComponentPropsWithoutRef<\"div\"> & {\n /**\n * When true, the content will stick below the header during scroll.\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * DialogContent component for the main content area of a Dialog.\n *\n * Features:\n * - Main content container for dialog body\n * - Flexible height with overflow handling\n * - Optional sticky positioning below header\n * - Consistent padding and spacing\n * - Responsive design\n * - Proper content scrolling for long content\n *\n * @example\n * // Basic content\n * <Dialog.Content>\n * <p>This is the main content of the dialog.</p>\n * </Dialog.Content>\n *\n * @example\n * // Sticky content (e.g., search field that remains visible while scrolling)\n * <Dialog.Content sticky>\n * <TextField placeholder=\"Filter results...\" />\n * </Dialog.Content>\n */\nexport const DialogContent = forwardRef<HTMLDivElement, DialogContentProps>(\n (props, ref) => {\n const { children, className, sticky = false, ...rest } = props;\n const { headerRef } = useDialogContext();\n const [headerHeight, setHeaderHeight] = useState(0);\n\n useEffect(() => {\n const headerElement = headerRef?.current;\n if (!sticky || !headerElement) return;\n\n const updateHeight = () => {\n setHeaderHeight(headerElement.offsetHeight || 0);\n };\n\n updateHeight();\n const resizeObserver = new ResizeObserver(updateHeight);\n resizeObserver.observe(headerElement);\n\n return () => resizeObserver.disconnect();\n }, [sticky, headerRef]);\n\n const contentClassNames = cx(styles[\"content\"], className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n const stickyStyle = sticky ? { top: `${headerHeight}px` } : undefined;\n\n return (\n <div\n className={contentClassNames}\n data-anv=\"dialog-content\"\n ref={ref}\n style={{ ...stickyStyle, ...rest.style }}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n\nDialogContent.displayName = \"DialogContent\";\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n KeyboardEvent,\n useMemo,\n useLayoutEffect,\n} from \"react\";\nimport { DialogHeader } from \"./DialogHeader\";\nimport { DialogFooter } from \"./DialogFooter\";\nimport { DialogContent } from \"./DialogContent\";\nimport { DialogCancelButton } from \"./DialogCancelButton\";\nimport {\n OpenCloseTransitionStateEffects,\n useDialogScrollLock,\n useDialogTransitionStates,\n useKeyboardFocusables,\n useOnClickOutside,\n} from \"../../internal/hooks\";\nimport {\n FocusableElement,\n DisableCloseOnEscapeOrClickProps,\n Size,\n} from \"../../types\";\nimport { registerLayer, unregisterLayer } from \"../../internal/utils\";\nimport { DialogContext, DialogContextProps } from \"./internal/DialogContext\";\nimport {\n DrillDownContext,\n DrillDownContextProps,\n} from \"../DrillDown/internal/DrillDownContext\";\nimport { useDrillDownContextState } from \"../DrillDown/internal/useDrillDownContextState\";\nimport styles from \"./Dialog.module.scss\";\nimport drillDownStyles from \"../DrillDown/DrillDown.module.scss\";\nimport { useMergeRefs } from \"../../hooks\";\nimport cx from \"classnames\";\n\nimport { ToastProvider } from \"../Toast/internal/ToastProvider\";\nimport { ToasterPopover } from \"../Toast/internal/ToasterPopover\";\nimport { ToasterContent } from \"../Toast/internal/Toaster\";\nimport { useInitialFocus } from \"./internal/useInitialFocus\";\n\n/**\n * Props for the Dialog component\n * @extends ComponentPropsWithoutRef<\"dialog\">\n * @extends DialogTransitionStateEffects\n * @extends DisableCloseOnEscapeOrClickProps\n */\nexport type DialogProps = ComponentPropsWithoutRef<\"dialog\"> &\n OpenCloseTransitionStateEffects &\n DisableCloseOnEscapeOrClickProps & {\n /**\n * @default false\n */\n fullScreen?: boolean;\n /**\n * @default \"medium\"\n */\n size?: Extract<Size, \"medium\" | \"large\" | \"xlarge\">;\n\n /**\n * @default false\n */\n open?: boolean;\n onClose?: () => void;\n /**\n * Callback when clicking outside the dialog\n */\n onClickOutside?: (e: globalThis.MouseEvent) => void;\n /**\n * Enables scroll chaining\n * @link https://developer.mozilla.org/en-US/docs/Glossary/Scroll_chaining\n */\n enableScrollChaining?: boolean;\n /**\n * Given an array of focusable elements, return the initial focus target.\n * @param focusables - The focusable elements to pick from\n * @returns The initial focus target\n */\n initialFocusResolver?: (focusables: FocusableElement[]) => FocusableElement;\n /**\n * Sets the default DrillDown index when used in an uncontrolled way\n */\n defaultDrillDownIndex?: DrillDownContextProps[\"index\"];\n /**\n * Callback to pass context to useDrillDown hook\n */\n onDrillDownContextChange?: (context: DrillDownContextProps) => void;\n };\n\n/**\n * Dialog component for creating modal dialogs and overlays.\n *\n * Features:\n * - Modal dialog with backdrop overlay\n * - Controlled and uncontrolled open state\n * - Smooth open/close animations\n * - Keyboard navigation and focus management\n * - Escape key and click outside to close\n * - Multiple size variants (medium, large, fullscreen)\n * - Scroll chaining support\n * - Toast integration for notifications\n * - Compound component pattern with Header, Footer, Content, and CancelButton sub-components\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Dialog open={isOpen} onClose={() => setIsOpen(false)}>\n * <Dialog.Header>Confirm Action</Dialog.Header>\n * <Dialog.Content>Are you sure you want to proceed?</Dialog.Content>\n * <Dialog.Footer>\n * <Dialog.CancelButton>Cancel</Dialog.CancelButton>\n * <Button appearance=\"primary\">Confirm</Button>\n * </Dialog.Footer>\n * </Dialog>\n */\nexport const Dialog = Object.assign(\n forwardRef<HTMLDialogElement, DialogProps>(function DialogInner(props, ref) {\n const {\n className,\n open = false,\n children,\n onClose,\n onKeyDown,\n fullScreen = false,\n disableCloseOnEscape = false,\n onClickOutside,\n disableCloseOnClickOutside = false,\n size,\n enableScrollChaining,\n onOpenAnimationStart,\n onOpenAnimationComplete,\n onCloseAnimationStart,\n onCloseAnimationComplete,\n initialFocusResolver,\n defaultDrillDownIndex,\n onDrillDownContextChange,\n ...rest\n } = props;\n\n const elRef = useRef<HTMLDialogElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const toasterRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLElement>(null);\n\n const [hasOpenPopover, setHasOpenPopover] =\n useState<DialogContextProps[\"hasOpenPopover\"]>(false);\n\n const drillDownContextValue = useDrillDownContextState({\n defaultDrillDownIndex,\n });\n\n const id = useId();\n\n const { state, isOpenOrOpening } = useDialogTransitionStates(elRef, open, {\n onOpenAnimationStart: useCallback(() => {\n onOpenAnimationStart?.();\n }, [onOpenAnimationStart]),\n onOpenAnimationComplete: useCallback(() => {\n onOpenAnimationComplete?.();\n }, [onOpenAnimationComplete]),\n onCloseAnimationStart: useCallback(() => {\n onCloseAnimationStart?.();\n }, [onCloseAnimationStart]),\n onCloseAnimationComplete: useCallback(() => {\n onCloseAnimationComplete?.();\n }, [onCloseAnimationComplete]),\n });\n\n const previousOpenRef = useRef(open);\n\n useLayoutEffect(() => {\n if (open && !previousOpenRef.current) {\n drillDownContextValue.setHostTrigger?.(\n document.activeElement instanceof HTMLElement\n ? document.activeElement\n : null,\n );\n }\n }, [open, drillDownContextValue]);\n\n useEffect(() => {\n previousOpenRef.current = open;\n }, [open]);\n\n useEffect(() => {\n if (state === \"closing\") {\n drillDownContextValue.onHostClose?.();\n }\n }, [state, drillDownContextValue]);\n\n useEffect(() => {\n if (state === \"closed\") {\n drillDownContextValue.onHostClosed?.();\n }\n }, [state, drillDownContextValue]);\n\n const drillDownContextProviderValue = useMemo(\n () => ({\n ...drillDownContextValue,\n hostIsInteractive: state !== \"closing\" && state !== \"closed\",\n }),\n [drillDownContextValue, state],\n );\n\n useLayoutEffect(() => {\n onDrillDownContextChange?.(drillDownContextProviderValue);\n }, [drillDownContextProviderValue]); // eslint-disable-line react-hooks/exhaustive-deps\n\n // DEPRECATED\n const initial = useRef(true);\n useEffect(() => {\n if (initial.current) {\n initial.current = false;\n }\n }, [id, isOpenOrOpening]);\n\n const classNames = cx([styles.dialog, drillDownStyles.dialog], className, {\n [styles[\"closing\"]]: state === \"closing\",\n [styles[\"fullscreen\"]]: fullScreen,\n ...(size && { [styles[size]]: true }),\n });\n\n const { focusables } = useKeyboardFocusables(contentRef, {\n observeChange: true,\n });\n\n useDialogScrollLock({\n open: isOpenOrOpening,\n id,\n enableScrollChaining,\n elementRef: elRef,\n });\n\n // Register/unregister with layer manager for proper stacking\n useEffect(() => {\n if (open) {\n registerLayer(id);\n } else {\n unregisterLayer(id);\n }\n\n // Cleanup when component unmounts\n return () => {\n unregisterLayer(id);\n };\n }, [open, id]);\n\n useOnClickOutside({\n onClickOutsideBegin: (e) => {\n if (!open) return;\n onClickOutside?.(e);\n },\n targets: [\n contentRef.current as HTMLElement,\n toasterRef.current as HTMLElement,\n ],\n onClickOutside: () => {\n if (disableCloseOnClickOutside || !open) return;\n onClose?.();\n },\n layerId: id,\n });\n\n const computeFocus = useCallback((focusables: FocusableElement[]) => {\n return (\n focusables.find(\n (focusable) => focusable.dataset.anv !== \"dialog-cancel-button\",\n ) || focusables[0]\n );\n }, []);\n\n useInitialFocus(elRef, {\n computeFocus: initialFocusResolver || computeFocus,\n });\n\n const onKeyDownHandler = (e: KeyboardEvent<HTMLDialogElement>) => {\n onKeyDown?.(e);\n if (e.code === \"Escape\") {\n e.preventDefault();\n if (disableCloseOnEscape) return;\n if (hasOpenPopover) return;\n onClose?.();\n return;\n }\n\n if (e.code === \"Tab\") {\n if (e.shiftKey && e.target === focusables?.[0]) {\n e.preventDefault();\n (focusables[focusables.length - 1] as HTMLElement)?.focus();\n return;\n }\n if (e.target === focusables?.[focusables.length - 1] && !e.shiftKey) {\n e.preventDefault();\n focusables[0].focus();\n return;\n }\n }\n };\n\n return (\n // dialog element does seem to be interactive on MDN guideline\n <dialog\n className={classNames}\n data-anv=\"dialog\"\n data-anv-scroll-chaining={enableScrollChaining}\n data-anv-transition-state={state}\n ref={useMergeRefs([ref, elRef])}\n onKeyDown={onKeyDownHandler}\n {...rest}\n >\n <ToastProvider isDialogToaster={open}>\n <ToasterPopover>\n <ToasterContent id=\"dialog-toaster\" ref={toasterRef} />\n </ToasterPopover>\n </ToastProvider>\n\n <DrillDownContext.Provider value={drillDownContextProviderValue}>\n <DialogContext.Provider\n value={{\n close: () => onClose?.(),\n ref: elRef,\n hasOpenPopover,\n setHasOpenPopover,\n headerRef,\n state,\n }}\n >\n <section\n ref={contentRef}\n className={styles[\"container\"]}\n data-open={open}\n >\n {children}\n </section>\n </DialogContext.Provider>\n </DrillDownContext.Provider>\n </dialog>\n );\n }),\n {\n /**\n * DialogHeader component for the header section of a Dialog.\n *\n * Features:\n * - Displays dialog title with headline typography\n * - Includes close button with proper accessibility\n * - Sticky positioning for long content\n * - Consistent spacing and styling\n * - Automatic focus management\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Dialog.Header>Confirm Delete</Dialog.Header>\n */\n Header: DialogHeader,\n /**\n * DialogFooter component for the footer section of a Dialog.\n *\n * Features:\n * - Container for dialog action buttons\n * - Optional sticky positioning for long content\n * - Consistent spacing and alignment\n * - Right-aligned button layout by default\n * - Flexible content area for custom layouts\n *\n * @example\n * <Dialog.Footer sticky>\n * <Dialog.CancelButton>Cancel</Dialog.CancelButton>\n * <Button appearance=\"primary\">Save</Button>\n * </Dialog.Footer>\n */\n Footer: DialogFooter,\n /**\n * DialogContent component for the main content area of a Dialog.\n *\n * Features:\n * - Main content container for dialog body\n * - Flexible height with overflow handling\n * - Consistent padding and spacing\n * - Responsive design\n * - Proper content scrolling for long content\n *\n * @example\n * <Dialog.Content>\n * <p>This is the main content of the dialog.</p>\n * </Dialog.Content>\n */\n Content: DialogContent,\n /**\n * DialogCancelButton component for cancel/close actions in a Dialog.\n *\n * Features:\n * - Button that automatically closes the dialog when clicked\n * - Extends all Button component props and functionality\n * - Proper accessibility with close dialog semantics\n * - Automatic focus management\n * - Consistent styling with other dialog elements\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Dialog.CancelButton appearance=\"ghost\">Cancel</Dialog.CancelButton>\n */\n CancelButton: DialogCancelButton,\n },\n);\nDialog.displayName = \"Dialog\";\nexport const DialogElement = Dialog;\n"],"names":["Close","focusables"],"mappings":"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"}
|
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { forwardRef } from 'react';
|
|
3
|
-
import { C as Card } from './Card-DSFuXUGk.js';
|
|
4
|
-
import { c as cx } from './index-De1g9FRV.js';
|
|
5
|
-
|
|
6
|
-
import './InteractiveCard.css';const styles = {
|
|
7
|
-
"card-wrapper": "_card-wrapper_1ygty_4",
|
|
8
|
-
"card-action": "_card-action_1ygty_16",
|
|
9
|
-
"bg-stronger": "_bg-stronger_1ygty_32",
|
|
10
|
-
"bg-strong": "_bg-strong_1ygty_32",
|
|
11
|
-
"card-content": "_card-content_1ygty_43"
|
|
12
|
-
};
|
|
13
|
-
|
|
14
|
-
const InteractiveCard = forwardRef(
|
|
15
|
-
(props, ref) => {
|
|
16
|
-
const {
|
|
17
|
-
wrapperProps,
|
|
18
|
-
actionProps,
|
|
19
|
-
contentProps = {},
|
|
20
|
-
children,
|
|
21
|
-
"data-interactive": dataInteractive
|
|
22
|
-
} = props;
|
|
23
|
-
const {
|
|
24
|
-
"aria-label": ariaLabel,
|
|
25
|
-
className: wrapperClassName,
|
|
26
|
-
style: wrapperStyle,
|
|
27
|
-
...restWrapperProps
|
|
28
|
-
} = wrapperProps;
|
|
29
|
-
const { "aria-label": actionAriaLabel, ...restActionProps } = actionProps;
|
|
30
|
-
const {
|
|
31
|
-
padding = "medium",
|
|
32
|
-
background,
|
|
33
|
-
className: contentClassName,
|
|
34
|
-
...restContentProps
|
|
35
|
-
} = contentProps;
|
|
36
|
-
const actionClassNames = cx(styles["card-action"], {
|
|
37
|
-
[styles[`bg-${background}`]]: !!background
|
|
38
|
-
});
|
|
39
|
-
const contentClassNames = cx(styles["card-content"], contentClassName);
|
|
40
|
-
const wrapperClassNames = cx(styles["card-wrapper"], wrapperClassName);
|
|
41
|
-
const isLink = "href" in restActionProps;
|
|
42
|
-
return /* @__PURE__ */ jsxs(
|
|
43
|
-
"div",
|
|
44
|
-
{
|
|
45
|
-
...restWrapperProps,
|
|
46
|
-
role: "group",
|
|
47
|
-
"aria-label": ariaLabel,
|
|
48
|
-
className: wrapperClassNames,
|
|
49
|
-
style: wrapperStyle,
|
|
50
|
-
ref,
|
|
51
|
-
children: [
|
|
52
|
-
isLink ? /* @__PURE__ */ jsx(
|
|
53
|
-
"a",
|
|
54
|
-
{
|
|
55
|
-
...restActionProps,
|
|
56
|
-
"aria-label": actionAriaLabel,
|
|
57
|
-
className: actionClassNames,
|
|
58
|
-
"data-interactive": dataInteractive
|
|
59
|
-
}
|
|
60
|
-
) : /* @__PURE__ */ jsx(
|
|
61
|
-
"button",
|
|
62
|
-
{
|
|
63
|
-
...restActionProps,
|
|
64
|
-
"aria-label": actionAriaLabel,
|
|
65
|
-
className: actionClassNames,
|
|
66
|
-
"data-interactive": dataInteractive,
|
|
67
|
-
type: "button"
|
|
68
|
-
}
|
|
69
|
-
),
|
|
70
|
-
/* @__PURE__ */ jsx(
|
|
71
|
-
Card,
|
|
72
|
-
{
|
|
73
|
-
padding,
|
|
74
|
-
className: contentClassNames,
|
|
75
|
-
...restContentProps,
|
|
76
|
-
children
|
|
77
|
-
}
|
|
78
|
-
)
|
|
79
|
-
]
|
|
80
|
-
}
|
|
81
|
-
);
|
|
82
|
-
}
|
|
83
|
-
);
|
|
84
|
-
InteractiveCard.displayName = "InteractiveCard";
|
|
85
|
-
|
|
86
|
-
export { InteractiveCard as I };
|
|
87
|
-
//# sourceMappingURL=InteractiveCard-CnW0m_F-.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"InteractiveCard-CnW0m_F-.js","sources":["../src/beta/components/InteractiveCard/InteractiveCard.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport {\n InteractiveCardProps,\n ActionLinkProps,\n ActionButtonProps,\n} from \"./types\";\nimport { Card } from \"../../../components/Card\";\n\nimport cx from \"classnames\";\nimport styles from \"./InteractiveCard.module.scss\";\n\n/**\n * InteractiveCard component for creating clickable cards with nested interactive elements.\n *\n * Features:\n * - Clickable card area that can be a button or link\n * - Supports nested interactive elements without accessibility violations\n * - Uses sibling structure with pointer-events to avoid nested button issues\n * - Box-shadow feedback on hover and focus of any interactive element\n * - Full keyboard accessibility with proper focus management\n * - Touch-friendly with mobile support\n * - Customizable padding and background variants via contentProps\n * - WCAG AA 2.2 compliant\n * - Required ARIA labels for screen reader support\n * - Supports all Card props for styling and layout via contentProps\n *\n * @example\n * // Button card with nested actions\n * <InteractiveCard\n * wrapperProps={{ \"aria-label\": \"Kitchen Measurement 2 card\" }}\n * actionProps={{\n * \"aria-label\": \"Expand Kitchen Measurement 2\",\n * onClick: handleExpand,\n * }}\n * contentProps={{ padding: \"large\" }}\n * >\n * <Text variant=\"headline\">Kitchen Measurement 2</Text>\n * <Button>Exact Size</Button>\n * <Button>Block Size</Button>\n * </InteractiveCard>\n *\n * @example\n * // Link card with nested actions\n * <InteractiveCard\n * wrapperProps={{ \"aria-label\": \"Tommy Lee's Project card\" }}\n * actionProps={{\n * \"aria-label\": \"Navigate to Tommy Lee's Project\",\n * href: \"/project/123\",\n * }}\n * contentProps={{ padding: \"large\" }}\n * >\n * <Text variant=\"headline\">Tommy Lee's Project</Text>\n * <IconButton icon={Edit} onClick={(e) => {\n * e.preventDefault();\n * handleEdit();\n * }} />\n * </InteractiveCard>\n */\nexport const InteractiveCard = forwardRef<HTMLDivElement, InteractiveCardProps>(\n (props, ref) => {\n const {\n wrapperProps,\n actionProps,\n contentProps = {},\n children,\n \"data-interactive\": dataInteractive,\n } = props as InteractiveCardProps & {\n \"data-interactive\"?: string;\n };\n\n // Destructure className and style from wrapperProps to merge with internal values\n const {\n \"aria-label\": ariaLabel,\n className: wrapperClassName,\n style: wrapperStyle,\n ...restWrapperProps\n } = wrapperProps;\n\n // Destructure aria-label from actionProps\n const { \"aria-label\": actionAriaLabel, ...restActionProps } = actionProps;\n\n // Destructure contentProps\n const {\n padding = \"medium\",\n background,\n className: contentClassName,\n ...restContentProps\n } = contentProps;\n\n const actionClassNames = cx(styles[\"card-action\"], {\n [styles[`bg-${background}`]]: !!background,\n });\n\n const contentClassNames = cx(styles[\"card-content\"], contentClassName);\n\n const wrapperClassNames = cx(styles[\"card-wrapper\"], wrapperClassName);\n\n // Determine the interactive element type based on href presence\n const isLink = \"href\" in restActionProps;\n\n return (\n <div\n {...restWrapperProps}\n role=\"group\"\n aria-label={ariaLabel}\n className={wrapperClassNames}\n style={wrapperStyle}\n ref={ref}\n >\n {/* Interactive layer (button or link) - provides background and hover effects */}\n {isLink ? (\n <a\n {...(restActionProps as ActionLinkProps)}\n aria-label={actionAriaLabel}\n className={actionClassNames}\n data-interactive={dataInteractive}\n />\n ) : (\n <button\n {...(restActionProps as ActionButtonProps)}\n aria-label={actionAriaLabel}\n className={actionClassNames}\n data-interactive={dataInteractive}\n type=\"button\"\n />\n )}\n\n {/* Content layer - transparent card with padding */}\n <Card\n padding={padding}\n className={contentClassNames}\n {...restContentProps}\n >\n {children}\n </Card>\n </div>\n );\n },\n);\n\nInteractiveCard.displayName = \"InteractiveCard\";\n"],"names":[],"mappings":";;;;;;;;;;;;;AA0DO,MAAM,eAAA,GAAkB,UAAA;AAAA,EAC7B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM;AAAA,MACJ,YAAA;AAAA,MACA,WAAA;AAAA,MACA,eAAe,EAAC;AAAA,MAChB,QAAA;AAAA,MACA,kBAAA,EAAoB;AAAA,KACtB,GAAI,KAAA;AAKJ,IAAA,MAAM;AAAA,MACJ,YAAA,EAAc,SAAA;AAAA,MACd,SAAA,EAAW,gBAAA;AAAA,MACX,KAAA,EAAO,YAAA;AAAA,MACP,GAAG;AAAA,KACL,GAAI,YAAA;AAGJ,IAAA,MAAM,EAAE,YAAA,EAAc,eAAA,EAAiB,GAAG,iBAAgB,GAAI,WAAA;AAG9D,IAAA,MAAM;AAAA,MACJ,OAAA,GAAU,QAAA;AAAA,MACV,UAAA;AAAA,MACA,SAAA,EAAW,gBAAA;AAAA,MACX,GAAG;AAAA,KACL,GAAI,YAAA;AAEJ,IAAA,MAAM,gBAAA,GAAmB,EAAA,CAAG,MAAA,CAAO,aAAa,CAAA,EAAG;AAAA,MACjD,CAAC,OAAO,CAAA,GAAA,EAAM,UAAU,EAAE,CAAC,GAAG,CAAC,CAAC;AAAA,KACjC,CAAA;AAED,IAAA,MAAM,iBAAA,GAAoB,EAAA,CAAG,MAAA,CAAO,cAAc,GAAG,gBAAgB,CAAA;AAErE,IAAA,MAAM,iBAAA,GAAoB,EAAA,CAAG,MAAA,CAAO,cAAc,GAAG,gBAAgB,CAAA;AAGrE,IAAA,MAAM,SAAS,MAAA,IAAU,eAAA;AAEzB,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACE,GAAG,gBAAA;AAAA,QACJ,IAAA,EAAK,OAAA;AAAA,QACL,YAAA,EAAY,SAAA;AAAA,QACZ,SAAA,EAAW,iBAAA;AAAA,QACX,KAAA,EAAO,YAAA;AAAA,QACP,GAAA;AAAA,QAGC,QAAA,EAAA;AAAA,UAAA,MAAA,mBACC,GAAA;AAAA,YAAC,GAAA;AAAA,YAAA;AAAA,cACE,GAAI,eAAA;AAAA,cACL,YAAA,EAAY,eAAA;AAAA,cACZ,SAAA,EAAW,gBAAA;AAAA,cACX,kBAAA,EAAkB;AAAA;AAAA,WACpB,mBAEA,GAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACE,GAAI,eAAA;AAAA,cACL,YAAA,EAAY,eAAA;AAAA,cACZ,SAAA,EAAW,gBAAA;AAAA,cACX,kBAAA,EAAkB,eAAA;AAAA,cAClB,IAAA,EAAK;AAAA;AAAA,WACP;AAAA,0BAIF,GAAA;AAAA,YAAC,IAAA;AAAA,YAAA;AAAA,cACC,OAAA;AAAA,cACA,SAAA,EAAW,iBAAA;AAAA,cACV,GAAG,gBAAA;AAAA,cAEH;AAAA;AAAA;AACH;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,eAAA,CAAgB,WAAA,GAAc,iBAAA;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"NumberField-DJbdyatF.js","sources":["../../hammer-icon/mdi/round/add.svg","../../hammer-icon/mdi/round/remove.svg","../src/components/NumberField/NumberField.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgAdd = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M18 13h-5v5c0 .55-.45 1-1 1s-1-.45-1-1v-5H6c-.55 0-1-.45-1-1s.45-1 1-1h5V6c0-.55.45-1 1-1s1 .45 1 1v5h5c.55 0 1 .45 1 1s-.45 1-1 1z\" }));\nexport default SvgAdd;\n","import * as React from \"react\";\nconst SvgRemove = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M18 13H6c-.55 0-1-.45-1-1s.45-1 1-1h12c.55 0 1 .45 1 1s-.45 1-1 1z\" }));\nexport default SvgRemove;\n","import {\n ReactElement,\n forwardRef,\n isValidElement,\n ComponentPropsWithoutRef,\n useId,\n useRef,\n} from \"react\";\nimport cx from \"classnames\";\nimport { Spinner } from \"../Spinner\";\nimport textFieldStyles from \"../TextField/TextField.module.scss\";\nimport numberFieldStyles from \"./NumberField.module.scss\";\nimport { Helper, HelperProps } from \"../../internal/components\";\nimport { warnDeprecatedErrorUsage } from \"../FieldMessage\";\nimport { LayoutUtilProps, Size, DataTrackingId } from \"../../types\";\nimport { useMergeRefs, useTrackingId } from \"../../hooks\";\nimport { Button } from \"../Button\";\nimport { Icon } from \"../Icon\";\nimport IconAdd from \"@servicetitan/hammer-icon/mdi/round/add.svg\";\nimport IconRemove from \"@servicetitan/hammer-icon/mdi/round/remove.svg\";\nimport {\n useFocusWithin,\n useLayoutPropsUtil,\n useNumberField,\n} from \"../../internal/hooks\";\nimport {\n childrenToString,\n stripInlineMarkdown,\n warnOnce,\n} from \"../../internal/functions\";\nimport { FieldLabel } from \"../FieldLabel\";\nimport { FieldLabelProps } from \"../../internal/types\";\n\n/**\n * Props for the NumberField component.\n * @extends Omit<ComponentPropsWithoutRef<\"input\">, \"size\" | \"prefix\" | \"type\" | \"inputMode\" | \"value\" | \"defaultValue\" | \"onFocus\" | \"onBlur\" | \"onChange\">\n * @extends LayoutUtilProps\n * @extends FieldLabelProps\n * @extends DataTrackingId\n */\nexport type NumberFieldProps = Omit<\n ComponentPropsWithoutRef<\"input\">,\n | \"size\"\n | \"prefix\"\n | \"type\"\n | \"inputMode\"\n | \"value\"\n | \"defaultValue\"\n | \"onFocus\"\n | \"onBlur\"\n | \"onChange\"\n> &\n LayoutUtilProps &\n FieldLabelProps & {\n /**\n * Error state for the field. Pass `true` to indicate error styling without a message.\n * Pass a string, string[], or ReactElement (deprecated) for error messages.\n */\n error?: boolean | string | ReactElement | string[];\n // TODO(v4.0.0): make label required\n /**\n * Label for the field.\n * Omitting `label` is deprecated — it will be required in v4.0.0. Use `hideLabel` to visually hide it.\n */\n label?: string;\n /**\n * When `true`, hides the visible label and moves it to `aria-label` on the input.\n * Requires `label` to be set — the label is always needed for accessibility.\n * @default false\n */\n hideLabel?: boolean;\n prefix?: string;\n suffix?: string;\n size?: Extract<Size, \"small\" | \"medium\" | \"large\">;\n description?: HelperProps[\"description\"];\n /**\n * @deprecated No longer used. Error messages always use `aria-live=\"assertive\"`.\n */\n errorAriaLive?: HelperProps[\"errorAriaLive\"];\n hint?: HelperProps[\"hint\"];\n /**\n * Warning message(s) to display. Supports a single string or an array of strings.\n */\n warning?: string | string[];\n loading?: boolean;\n disabled?: boolean;\n minValue?: number;\n maxValue?: number;\n maximumFractionDigits?: number;\n minimumFractionDigits?: number;\n step?: number;\n value?: number | null;\n defaultValue?: number | null;\n onChange?: (value: number | null) => void;\n onFocus?: (event: React.FocusEvent) => void;\n onBlur?: (event: React.FocusEvent) => void;\n hideControls?: boolean;\n } & DataTrackingId;\n\nexport const NumberField = forwardRef<HTMLInputElement, NumberFieldProps>(\n (props, ref) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const {\n className,\n error,\n errorAriaLive: _errorAriaLive,\n defaultValue: defaultValueProp,\n value: valueProp,\n label,\n moreInfo,\n prefix,\n suffix,\n size,\n required,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n id: idProp,\n description,\n hint,\n warning,\n loading,\n disabled,\n readOnly,\n labelProps,\n style,\n placeholder,\n minValue,\n maxValue,\n maximumFractionDigits = 0,\n minimumFractionDigits = 0,\n step = 1,\n hideControls = false,\n hideLabel = false,\n ...rest\n } = componentProps;\n const numberFieldRef = useRef<HTMLDivElement>(null);\n\n const { props: wrapperProps } = useFocusWithin({\n onFocus: (e) => {\n onFocusProp?.(e);\n },\n onBlur: (e) => {\n onBlurProp?.(e);\n },\n });\n\n const { inputProps, inputRef, incrementButtonProps, decrementButtonProps } =\n useNumberField({\n minValue,\n maxValue,\n maximumFractionDigits,\n minimumFractionDigits,\n step,\n value: valueProp,\n defaultValue: defaultValueProp,\n onChange: onChangeProp,\n label,\n });\n\n const combinedInputRef = useMergeRefs([numberFieldRef, inputRef, ref]);\n\n const labelUid = useId();\n const id = idProp ?? labelUid;\n const prefixUid = useId();\n const suffixUid = useId();\n const helperUid = useId();\n const moreInfoUid = useId();\n\n warnDeprecatedErrorUsage(\"NumberField\", error);\n\n // TODO(v4.0.0): remove once label is required\n if (label === undefined) {\n warnOnce(\n \"NumberField: label will be required in v4.0.0. Use hideLabel to visually hide the label.\",\n );\n }\n\n const errorMessages =\n typeof error === \"boolean\" || error === undefined ? undefined : error;\n\n const hasHelperText = hint || errorMessages || warning || description;\n\n const ariaDescribedBy =\n [hasHelperText && helperUid, moreInfo && moreInfoUid]\n .filter(Boolean)\n .join(\" \") || undefined;\n\n const styleCombined = { ...style, ...layoutStyles };\n\n const data = {\n label: childrenToString(props.label),\n prefix: childrenToString(props.prefix),\n suffix: childrenToString(props.suffix),\n description: childrenToString(props.description),\n size: props.size,\n minValue: props.minValue,\n maxValue: props.maxValue,\n step: props.step,\n maximumFractionDigits: props.maximumFractionDigits,\n minimumFractionDigits: props.minimumFractionDigits,\n };\n\n const trackingId = useTrackingId({\n name: \"NumberField\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n return (\n <div\n className={cx(textFieldStyles[\"textfield\"], className)}\n data-anv=\"number-field\"\n style={styleCombined}\n {...wrapperProps}\n >\n {/* TODO(v4.0.0): simplify to !hideLabel once label is required */}\n {label && !hideLabel && (\n <FieldLabel\n moreInfo={moreInfo}\n moreInfoId={moreInfo ? moreInfoUid : undefined}\n required={required}\n htmlFor={id}\n {...labelProps}\n >\n {label}\n </FieldLabel>\n )}\n <div\n className={cx(textFieldStyles[\"input-wrapper\"], {\n [textFieldStyles[\"small\"]]: size === \"small\",\n [textFieldStyles[\"large\"]]: size === \"large\",\n [numberFieldStyles[\"small\"]]: size === \"small\",\n [numberFieldStyles[\"large\"]]: size === \"large\",\n })}\n role=\"presentation\"\n onClick={() => numberFieldRef.current?.focus()}\n >\n {prefix ? (\n <div\n aria-hidden\n className={textFieldStyles[\"prefix\"]}\n id={`prefix${prefixUid}`}\n >\n {prefix}\n </div>\n ) : null}\n <input\n id={id}\n className={cx(textFieldStyles[\"input\"], {\n [textFieldStyles[\"error\"]]: error,\n })}\n data-tracking-id={trackingId}\n {...rest}\n {...inputProps}\n required={required}\n placeholder={placeholder}\n readOnly={readOnly}\n disabled={disabled}\n ref={combinedInputRef}\n aria-label={\n // TODO(v4.0.0): remove typeof check — label will always be string\n hideLabel && typeof label === \"string\"\n ? stripInlineMarkdown(label)\n : label\n ? undefined\n : placeholder\n }\n aria-describedby={ariaDescribedBy}\n aria-invalid={error ? !!error : undefined}\n />\n {loading ? (\n <div\n className={textFieldStyles[\"loading-spinner-wrapper\"]}\n data-testid=\"spinner\"\n >\n <Spinner size=\"small\" />\n </div>\n ) : null}\n {suffix ? (\n <div\n className={textFieldStyles[\"suffix\"]}\n aria-hidden\n id={`suffix${suffixUid}`}\n >\n {suffix}\n </div>\n ) : null}\n {!hideControls && !disabled && !readOnly && (\n <div className={numberFieldStyles[\"stepper-buttons\"]}>\n <Button\n appearance=\"secondary\"\n size=\"small\"\n className={numberFieldStyles[\"stepper-button\"]}\n {...decrementButtonProps}\n >\n <Icon svg={IconRemove} />\n </Button>\n <Button\n appearance=\"secondary\"\n size=\"small\"\n className={numberFieldStyles[\"stepper-button\"]}\n {...incrementButtonProps}\n >\n <Icon svg={IconAdd} />\n </Button>\n </div>\n )}\n </div>\n {hasHelperText ? (\n <Helper\n id={helperUid}\n hint={hint}\n showCounter={false}\n error={\n typeof errorMessages === \"string\" || Array.isArray(errorMessages)\n ? errorMessages\n : undefined\n }\n warning={warning}\n errorMessage={\n isValidElement(errorMessages) ? errorMessages : undefined\n }\n description={description}\n />\n ) : null}\n </div>\n );\n },\n);\n\nNumberField.displayName = \"NumberField\";\n"],"names":["IconRemove","IconAdd"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,MAAM,MAAM,GAAG,CAAC,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,4BAA4B,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,qIAAqI,EAAE,CAAC,CAAC;;ACArW,MAAM,SAAS,GAAG,CAAC,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,4BAA4B,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,oEAAoE,EAAE,CAAC,CAAC;;ACkGhS,MAAM,WAAA,GAAc,UAAA;AAAA,EACzB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,KAAA;AAAA,MACA,aAAA,EAAe,cAAA;AAAA,MACf,YAAA,EAAc,gBAAA;AAAA,MACd,KAAA,EAAO,SAAA;AAAA,MACP,KAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA,EAAU,YAAA;AAAA,MACV,OAAA,EAAS,WAAA;AAAA,MACT,MAAA,EAAQ,UAAA;AAAA,MACR,EAAA,EAAI,MAAA;AAAA,MACJ,WAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAA;AAAA,MACA,KAAA;AAAA,MACA,WAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,qBAAA,GAAwB,CAAA;AAAA,MACxB,qBAAA,GAAwB,CAAA;AAAA,MACxB,IAAA,GAAO,CAAA;AAAA,MACP,YAAA,GAAe,KAAA;AAAA,MACf,SAAA,GAAY,KAAA;AAAA,MACZ,GAAG;AAAA,KACL,GAAI,cAAA;AACJ,IAAA,MAAM,cAAA,GAAiB,OAAuB,IAAI,CAAA;AAElD,IAAA,MAAM,EAAE,KAAA,EAAO,YAAA,EAAa,GAAI,cAAA,CAAe;AAAA,MAC7C,OAAA,EAAS,CAAC,CAAA,KAAM;AACd,QAAA,WAAA,GAAc,CAAC,CAAA;AAAA,MACjB,CAAA;AAAA,MACA,MAAA,EAAQ,CAAC,CAAA,KAAM;AACb,QAAA,UAAA,GAAa,CAAC,CAAA;AAAA,MAChB;AAAA,KACD,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAY,QAAA,EAAU,oBAAA,EAAsB,oBAAA,KAClD,cAAA,CAAe;AAAA,MACb,QAAA;AAAA,MACA,QAAA;AAAA,MACA,qBAAA;AAAA,MACA,qBAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAA,EAAO,SAAA;AAAA,MACP,YAAA,EAAc,gBAAA;AAAA,MACd,QAAA,EAAU,YAAA;AAAA,MACV;AAAA,KACD,CAAA;AAEH,IAAA,MAAM,mBAAmB,YAAA,CAAa,CAAC,cAAA,EAAgB,QAAA,EAAU,GAAG,CAAC,CAAA;AAErE,IAAA,MAAM,WAAW,KAAA,EAAM;AACvB,IAAA,MAAM,KAAK,MAAA,IAAU,QAAA;AACrB,IAAA,MAAM,YAAY,KAAA,EAAM;AACxB,IAAA,MAAM,YAAY,KAAA,EAAM;AACxB,IAAA,MAAM,YAAY,KAAA,EAAM;AACxB,IAAA,MAAM,cAAc,KAAA,EAAM;AAE1B,IAAA,wBAAA,CAAyB,eAAe,KAAK,CAAA;AAG7C,IAAA,IAAI,UAAU,MAAA,EAAW;AACvB,MAAA,QAAA;AAAA,QACE;AAAA,OACF;AAAA,IACF;AAEA,IAAA,MAAM,gBACJ,OAAO,KAAA,KAAU,SAAA,IAAa,KAAA,KAAU,SAAY,MAAA,GAAY,KAAA;AAElE,IAAA,MAAM,aAAA,GAAgB,IAAA,IAAQ,aAAA,IAAiB,OAAA,IAAW,WAAA;AAE1D,IAAA,MAAM,eAAA,GACJ,CAAC,aAAA,IAAiB,SAAA,EAAW,QAAA,IAAY,WAAW,CAAA,CACjD,MAAA,CAAO,OAAO,CAAA,CACd,IAAA,CAAK,GAAG,CAAA,IAAK,MAAA;AAElB,IAAA,MAAM,aAAA,GAAgB,EAAE,GAAG,KAAA,EAAO,GAAG,YAAA,EAAa;AAElD,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,KAAA,EAAO,gBAAA,CAAiB,KAAA,CAAM,KAAK,CAAA;AAAA,MACnC,MAAA,EAAQ,gBAAA,CAAiB,KAAA,CAAM,MAAM,CAAA;AAAA,MACrC,MAAA,EAAQ,gBAAA,CAAiB,KAAA,CAAM,MAAM,CAAA;AAAA,MACrC,WAAA,EAAa,gBAAA,CAAiB,KAAA,CAAM,WAAW,CAAA;AAAA,MAC/C,MAAM,KAAA,CAAM,IAAA;AAAA,MACZ,UAAU,KAAA,CAAM,QAAA;AAAA,MAChB,UAAU,KAAA,CAAM,QAAA;AAAA,MAChB,MAAM,KAAA,CAAM,IAAA;AAAA,MACZ,uBAAuB,KAAA,CAAM,qBAAA;AAAA,MAC7B,uBAAuB,KAAA,CAAM;AAAA,KAC/B;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,aAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AAED,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,EAAA,CAAG,eAAA,CAAgB,WAAW,GAAG,SAAS,CAAA;AAAA,QACrD,UAAA,EAAS,cAAA;AAAA,QACT,KAAA,EAAO,aAAA;AAAA,QACN,GAAG,YAAA;AAAA,QAGH,QAAA,EAAA;AAAA,UAAA,KAAA,IAAS,CAAC,SAAA,oBACT,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,QAAA;AAAA,cACA,UAAA,EAAY,WAAW,WAAA,GAAc,MAAA;AAAA,cACrC,QAAA;AAAA,cACA,OAAA,EAAS,EAAA;AAAA,cACR,GAAG,UAAA;AAAA,cAEH,QAAA,EAAA;AAAA;AAAA,WACH;AAAA,0BAEF,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA,CAAG,eAAA,CAAgB,eAAe,CAAA,EAAG;AAAA,gBAC9C,CAAC,eAAA,CAAgB,OAAO,CAAC,GAAG,IAAA,KAAS,OAAA;AAAA,gBACrC,CAAC,eAAA,CAAgB,OAAO,CAAC,GAAG,IAAA,KAAS,OAAA;AAAA,gBACrC,CAAC,iBAAA,CAAkB,OAAO,CAAC,GAAG,IAAA,KAAS,OAAA;AAAA,gBACvC,CAAC,iBAAA,CAAkB,OAAO,CAAC,GAAG,IAAA,KAAS;AAAA,eACxC,CAAA;AAAA,cACD,IAAA,EAAK,cAAA;AAAA,cACL,OAAA,EAAS,MAAM,cAAA,CAAe,OAAA,EAAS,KAAA,EAAM;AAAA,cAE5C,QAAA,EAAA;AAAA,gBAAA,MAAA,mBACC,GAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,aAAA,EAAW,IAAA;AAAA,oBACX,SAAA,EAAW,gBAAgB,QAAQ,CAAA;AAAA,oBACnC,EAAA,EAAI,SAAS,SAAS,CAAA,CAAA;AAAA,oBAErB,QAAA,EAAA;AAAA;AAAA,iBACH,GACE,IAAA;AAAA,gCACJ,GAAA;AAAA,kBAAC,OAAA;AAAA,kBAAA;AAAA,oBACC,EAAA;AAAA,oBACA,SAAA,EAAW,EAAA,CAAG,eAAA,CAAgB,OAAO,CAAA,EAAG;AAAA,sBACtC,CAAC,eAAA,CAAgB,OAAO,CAAC,GAAG;AAAA,qBAC7B,CAAA;AAAA,oBACD,kBAAA,EAAkB,UAAA;AAAA,oBACjB,GAAG,IAAA;AAAA,oBACH,GAAG,UAAA;AAAA,oBACJ,QAAA;AAAA,oBACA,WAAA;AAAA,oBACA,QAAA;AAAA,oBACA,QAAA;AAAA,oBACA,GAAA,EAAK,gBAAA;AAAA,oBACL,YAAA;AAAA;AAAA,sBAEE,SAAA,IAAa,OAAO,KAAA,KAAU,QAAA,GAC1B,oBAAoB,KAAK,CAAA,GACzB,QACE,MAAA,GACA;AAAA,qBAAA;AAAA,oBAER,kBAAA,EAAkB,eAAA;AAAA,oBAClB,cAAA,EAAc,KAAA,GAAQ,CAAC,CAAC,KAAA,GAAQ;AAAA;AAAA,iBAClC;AAAA,gBACC,OAAA,mBACC,GAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAW,gBAAgB,yBAAyB,CAAA;AAAA,oBACpD,aAAA,EAAY,SAAA;AAAA,oBAEZ,QAAA,kBAAA,GAAA,CAAC,OAAA,EAAA,EAAQ,IAAA,EAAK,OAAA,EAAQ;AAAA;AAAA,iBACxB,GACE,IAAA;AAAA,gBACH,MAAA,mBACC,GAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAW,gBAAgB,QAAQ,CAAA;AAAA,oBACnC,aAAA,EAAW,IAAA;AAAA,oBACX,EAAA,EAAI,SAAS,SAAS,CAAA,CAAA;AAAA,oBAErB,QAAA,EAAA;AAAA;AAAA,iBACH,GACE,IAAA;AAAA,gBACH,CAAC,YAAA,IAAgB,CAAC,QAAA,IAAY,CAAC,QAAA,oBAC9B,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,iBAAA,CAAkB,iBAAiB,CAAA,EACjD,QAAA,EAAA;AAAA,kCAAA,GAAA;AAAA,oBAAC,MAAA;AAAA,oBAAA;AAAA,sBACC,UAAA,EAAW,WAAA;AAAA,sBACX,IAAA,EAAK,OAAA;AAAA,sBACL,SAAA,EAAW,kBAAkB,gBAAgB,CAAA;AAAA,sBAC5C,GAAG,oBAAA;AAAA,sBAEJ,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,GAAA,EAAKA,SAAA,EAAY;AAAA;AAAA,mBACzB;AAAA,kCACA,GAAA;AAAA,oBAAC,MAAA;AAAA,oBAAA;AAAA,sBACC,UAAA,EAAW,WAAA;AAAA,sBACX,IAAA,EAAK,OAAA;AAAA,sBACL,SAAA,EAAW,kBAAkB,gBAAgB,CAAA;AAAA,sBAC5C,GAAG,oBAAA;AAAA,sBAEJ,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,GAAA,EAAKC,MAAA,EAAS;AAAA;AAAA;AACtB,iBAAA,EACF;AAAA;AAAA;AAAA,WAEJ;AAAA,UACC,aAAA,mBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,EAAA,EAAI,SAAA;AAAA,cACJ,IAAA;AAAA,cACA,WAAA,EAAa,KAAA;AAAA,cACb,KAAA,EACE,OAAO,aAAA,KAAkB,QAAA,IAAY,MAAM,OAAA,CAAQ,aAAa,IAC5D,aAAA,GACA,MAAA;AAAA,cAEN,OAAA;AAAA,cACA,YAAA,EACE,cAAA,CAAe,aAAa,CAAA,GAAI,aAAA,GAAgB,MAAA;AAAA,cAElD;AAAA;AAAA,WACF,GACE;AAAA;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SearchField-CsRGYZx3.js","sources":["../../hammer-icon/mdi/round/search.svg","../src/components/SearchField/internal/SearchField.tsx","../src/components/SearchField/SearchField.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgSearch = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M15.5 14h-.79l-.28-.27a6.5 6.5 0 0 0 1.48-5.34c-.47-2.78-2.79-5-5.59-5.34a6.505 6.505 0 0 0-7.27 7.27c.34 2.8 2.56 5.12 5.34 5.59a6.5 6.5 0 0 0 5.34-1.48l.27.28v.79l4.25 4.25c.41.41 1.08.41 1.49 0 .41-.41.41-1.08 0-1.49L15.5 14zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" }));\nexport default SvgSearch;\n","import {\n forwardRef,\n ComponentPropsWithoutRef,\n useId,\n useRef,\n ChangeEvent,\n KeyboardEvent,\n useState,\n useEffect,\n} from \"react\";\nimport cx from \"classnames\";\n\nimport textfieldStyles from \"../../TextField/TextField.module.scss\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport Search from \"@servicetitan/hammer-icon/mdi/round/search.svg\";\nimport styles from \"../SearchField.module.scss\";\nimport { useLayoutPropsUtil } from \"../../../internal/hooks\";\nimport { SrOnly } from \"../../SrOnly\";\nimport { Icon } from \"../../Icon\";\nimport { useTrackingId, useMergeRefs } from \"../../../hooks\";\nimport { DataTrackingId, LayoutUtilProps, Size } from \"../../../types\";\n\n/**\n * Props for the SearchField component\n * @extends Omit<ComponentPropsWithoutRef<\"input\">, \"size\" | \"prefix\" | \"required\" | \"children\">\n * @extends LayoutUtilProps\n */\nexport type SearchFieldProps = Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"size\" | \"prefix\" | \"required\" | \"children\"\n> &\n LayoutUtilProps & {\n /**\n * Size of the search field\n * @default \"medium\"\n */\n size?: Extract<Size, \"xsmall\" | \"small\" | \"medium\" | \"large\">;\n /**\n * Whether the search field is disabled\n * @default false\n */\n disabled?: boolean;\n /**\n * Callback when the clear button is clicked or activated via keyboard (Enter/Space)\n */\n onClear?: () => void;\n } & DataTrackingId;\n\n/**\n * SearchField component for text input with search functionality.\n *\n * Features:\n * - Search icon prefix for visual clarity\n * - Clear button that appears when input has value\n * - Arrow key navigation between input and clear button (Right arrow to clear button, Left arrow back to input)\n * - Clear button activated with Enter/Space keys\n * - Focus returns to input after clearing\n * - Multiple size variants (xsmall, small, medium, large)\n * - Controlled and uncontrolled modes\n * - Disabled and read-only states\n * - Accessibility support with proper ARIA attributes\n * - Layout utility props for positioning and spacing\n * - Automatic value detection for clear button visibility\n * - Search-specific input type and autocomplete settings\n * - Screen reader support with placeholder announcements\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <SearchField\n * placeholder=\"Search users...\"\n * onChange={(e) => setSearchTerm(e.target.value)}\n * onClear={() => setSearchTerm(\"\")}\n * />\n *\n * @example\n * <SearchField\n * size=\"large\"\n * value={searchValue}\n * onChange={(e) => setSearchValue(e.target.value)}\n * disabled={isLoading}\n * />\n */\nexport const SearchField = forwardRef<HTMLInputElement, SearchFieldProps>(\n function SearchField(props, ref) {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const {\n className,\n size,\n onChange,\n onClear,\n id: idProp,\n disabled,\n style,\n value,\n placeholder = \"Search...\",\n autoComplete = \"off\",\n ...rest\n } = componentProps;\n\n const [hasValue, setHasValue] = useState(\n rest.defaultValue || value ? true : false,\n );\n const placeholderUid = useId();\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n const styleCombined = { ...style, ...layoutStyles };\n\n const handleOnChange = (e: ChangeEvent<HTMLInputElement>) => {\n if (e.target.value) {\n setHasValue(true);\n } else {\n setHasValue(false);\n }\n onChange?.(e);\n };\n\n useEffect(() => {\n if (typeof value === \"undefined\") return;\n if (value === \"\" || !value) {\n setHasValue(false);\n } else {\n setHasValue(true);\n }\n }, [value]);\n\n const handleClear = () => {\n if (!inputRef.current) return;\n if (disabled || rest.readOnly) return;\n onClear?.();\n if (value) {\n inputRef.current.focus();\n return;\n }\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\",\n )?.set;\n nativeInputValueSetter?.call(inputRef.current, \"\");\n inputRef.current.dispatchEvent(new Event(\"input\", { bubbles: true }));\n setHasValue(false);\n inputRef.current.focus();\n };\n\n const handleClearKeyDown = (e: KeyboardEvent<HTMLSpanElement>) => {\n if (e.code === \"Enter\" || e.code === \"Space\") {\n e.preventDefault();\n handleClear();\n } else if (e.code === \"ArrowLeft\") {\n e.preventDefault();\n inputRef.current?.focus();\n }\n };\n\n const handleInputKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n if (e.code === \"ArrowRight\" && hasValue) {\n const input = e.currentTarget;\n if (input.selectionStart === input.value.length) {\n e.preventDefault();\n const clearButton = input.parentElement?.querySelector(\n '[role=\"button\"]',\n ) as HTMLElement;\n clearButton?.focus();\n }\n }\n };\n\n const data = {\n value: props.value,\n defaultValue: props.defaultValue,\n disabled: props.disabled,\n readOnly: props.readOnly,\n size: props.size,\n };\n\n const trackingId = useTrackingId({\n name: \"SearchField\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n return (\n <div\n className={cx(\n textfieldStyles[\"textfield\"],\n styles[\"searchfield\"],\n className,\n )}\n data-anv=\"SearchField\"\n style={styleCombined}\n >\n <div\n className={cx(\n textfieldStyles[\"input-wrapper\"],\n styles[\"input-wrapper\"],\n {\n [textfieldStyles[\"xsmall\"]]: size === \"xsmall\",\n [textfieldStyles[\"small\"]]: size === \"small\",\n [textfieldStyles[\"large\"]]: size === \"large\",\n },\n )}\n role=\"presentation\"\n onClick={() => inputRef.current?.focus()}\n >\n <div aria-hidden className={textfieldStyles[\"prefix\"]}>\n <Icon aria-label=\"search\" svg={Search} />\n </div>\n <input\n className={cx(textfieldStyles[\"input\"], styles[\"input\"], {\n [styles[\"input--has-value\"]]: hasValue,\n })}\n ref={useMergeRefs([ref, inputRef])}\n onChange={handleOnChange}\n onKeyDown={handleInputKeyDown}\n placeholder={placeholder}\n value={value}\n type=\"search\"\n autoComplete={autoComplete}\n disabled={disabled}\n aria-labelledby={placeholderUid}\n data-tracking-id={trackingId}\n {...rest}\n />\n <Icon\n aria-label=\"Clear search\"\n svg={Close}\n role=\"button\"\n onClick={handleClear}\n onKeyDown={handleClearKeyDown}\n tabIndex={-1}\n className={styles[\"clear\"]}\n aria-disabled={disabled}\n style={{\n visibility: hasValue ? \"visible\" : \"hidden\",\n }}\n />\n </div>\n <SrOnly id={placeholderUid}>{placeholder}</SrOnly>\n </div>\n );\n },\n);\n","import {\n SearchField as CoreSearchField,\n SearchFieldProps as CoreSearchFieldProps,\n} from \"./internal/SearchField\";\nimport { forwardRef } from \"react\";\nimport { DistributiveOmit } from \"../../types\";\n\n/**\n * Props for the SearchField component\n * @extends Omit<ComponentPropsWithoutRef<\"input\">, \"size\" | \"prefix\" | \"required\" | \"children\">\n * @extends LayoutUtilProps\n */\nexport type SearchFieldProps = DistributiveOmit<\n CoreSearchFieldProps,\n \"size\"\n> & {\n /**\n * Size of the search field\n * @default \"medium\"\n */\n size?: Extract<CoreSearchFieldProps[\"size\"], \"small\" | \"medium\" | \"large\">;\n};\n\n/**\n * SearchField component for text input with search functionality.\n *\n * Features:\n * - Search icon prefix for visual clarity\n * - Clear button that appears when input has value\n * - Arrow key navigation between input and clear button (Right arrow to clear button, Left arrow back to input)\n * - Clear button activated with Enter/Space keys\n * - Focus returns to input after clearing\n * - Multiple size variants (small, medium, large)\n * - Controlled and uncontrolled modes\n * - Disabled and read-only states\n * - Accessibility support with proper ARIA attributes\n * - Layout utility props for positioning and spacing\n * - Automatic value detection for clear button visibility\n * - Search-specific input type and autocomplete settings\n * - Screen reader support with placeholder announcements\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <SearchField\n * placeholder=\"Search users...\"\n * onChange={(e) => setSearchTerm(e.target.value)}\n * onClear={() => setSearchTerm(\"\")}\n * />\n *\n * @example\n * <SearchField\n * size=\"large\"\n * value={searchValue}\n * onChange={(e) => setSearchValue(e.target.value)}\n * disabled={isLoading}\n * />\n */\nexport const SearchField = forwardRef<HTMLInputElement, SearchFieldProps>(\n (props, ref) => {\n return <CoreSearchField ref={ref} {...props} />;\n },\n);\nSearchField.displayName = \"SearchField\";\n"],"names":["SearchField","textfieldStyles","Search","Close","CoreSearchField"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Text-J5YtSSXY.js","sources":["../src/components/Text/Text.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { forwardRef, LegacyRef } from \"react\";\nimport styles from \"./Text.module.scss\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { AiMark } from \"../AiMark\";\nimport {\n BodyTextInlineProps,\n BodyTextProps,\n EyebrowProps,\n HeadlineProps,\n} from \"./types\";\n\n/**\n * Props for the Text component\n * @extends HeadlineProps<\"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\">\n * @extends EyebrowProps\n * @extends BodyTextProps\n * @extends BodyTextInlineProps\n */\nexport type TextProps =\n | HeadlineProps<\"h1\">\n | HeadlineProps<\"h2\">\n | HeadlineProps<\"h3\">\n | HeadlineProps<\"h4\">\n | HeadlineProps<\"h5\">\n | HeadlineProps<\"h6\">\n | EyebrowProps\n | BodyTextProps\n | BodyTextInlineProps;\n\n/**\n * Text component for displaying various types of text content with consistent styling.\n *\n * Features:\n * - Multiple text variants (headline, eyebrow, body)\n * - Semantic HTML elements (h1-h6, p, span)\n * - Multiple size options for each variant\n *\n * @example\n * <Text variant=\"headline\" el=\"h1\" size=\"large\">Main Heading</Text>\n * <Text variant=\"headline\" el=\"h2\" size=\"medium\">Sub Heading</Text>\n *\n * @example\n * <Text variant=\"eyebrow\" size=\"small\">Category Label</Text>\n *\n * @example\n * <Text size=\"large\">Large body text</Text>\n * <Text subdued>Deemphasized text</Text>\n * <Text inline>Inline text within other text</Text>\n */\nexport const Text = forwardRef<\n HTMLHeadingElement | HTMLSpanElement | HTMLParagraphElement,\n TextProps\n>((props, ref) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n if (props.variant === \"headline\") {\n const {\n variant: _,\n children,\n className,\n el: HeadlineElement,\n size = \"medium\",\n style,\n aiMark,\n ...rest\n } = componentProps;\n\n const TextClasses = classnames(styles[\"headline\"], className, {\n [styles[`${size}`]]: size,\n });\n\n const styleCombined = { ...style, ...layoutStyles };\n\n const aiMarkSize = size === \"small\" ? \"medium\" : size;\n\n const aiMarkNode = aiMark && (\n <span className={styles[\"headline-ai-mark\"]}>\n <AiMark\n type=\"gradient\"\n collapsePadding=\"block\"\n size={aiMarkSize}\n popoverOrTooltipConfig={\n typeof aiMark === \"object\" ? aiMark : undefined\n }\n />\n </span>\n );\n\n return (\n // @ts-expect-error ts(2604) HeadlineElement will work as element tag\n <HeadlineElement\n ref={ref as LegacyRef<HTMLHeadingElement>}\n className={TextClasses}\n data-anv=\"text\"\n style={styleCombined}\n {...rest}\n >\n {aiMarkNode ? (\n <span className={styles[\"headline-with-ai-mark\"]}>\n {children}\n {aiMarkNode}\n </span>\n ) : (\n children\n )}\n </HeadlineElement>\n );\n } else if (props.variant === \"eyebrow\") {\n const {\n variant: _,\n children,\n className,\n size = \"medium\",\n style,\n ...rest\n } = componentProps;\n\n const TextClasses = classnames(styles[\"eyebrow\"], className, {\n [styles[`${size}`]]: size,\n });\n\n const styleCombined = { ...style, ...layoutStyles };\n\n return (\n <span\n ref={ref as LegacyRef<HTMLSpanElement>}\n className={TextClasses}\n data-anv=\"text\"\n style={styleCombined}\n {...rest}\n >\n {children}\n </span>\n );\n } else {\n const {\n variant: _,\n children,\n className,\n subdued,\n inline,\n style,\n size = \"medium\",\n ...rest\n } = componentProps;\n\n const TextClasses = classnames(styles[\"bodytext\"], className, {\n [styles[`${size}`]]: size,\n [styles[\"subdued\"]]: subdued,\n [styles[\"inline\"]]: inline,\n });\n\n const styleCombined = { ...style, ...layoutStyles };\n\n if (inline) {\n return (\n <span\n ref={ref as LegacyRef<HTMLSpanElement>}\n className={TextClasses}\n data-anv=\"text\"\n style={styleCombined}\n {...rest}\n >\n {children}\n </span>\n );\n } else {\n return (\n <p\n ref={ref as LegacyRef<HTMLParagraphElement>}\n className={TextClasses}\n data-anv=\"text\"\n style={styleCombined}\n {...rest}\n >\n {children}\n </p>\n );\n }\n }\n});\n\nText.displayName = \"Text\";\n"],"names":["classnames","styles"],"mappings":";;;;;;;AAkDO,MAAM,IAAA,GAAO,UAAA,CAGlB,CAAC,KAAA,EAAO,GAAA,KAAQ;AAChB,EAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,EAAA,IAAI,KAAA,CAAM,YAAY,UAAA,EAAY;AAChC,IAAA,MAAM;AAAA,MACJ,OAAA,EAAS,CAAA;AAAA,MACT,QAAA;AAAA,MACA,SAAA;AAAA,MACA,EAAA,EAAI,eAAA;AAAA,MACJ,IAAA,GAAO,QAAA;AAAA,MACP,KAAA;AAAA,MACA,MAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,WAAA,GAAcA,EAAA,CAAWC,UAAA,CAAO,UAAU,GAAG,SAAA,EAAW;AAAA,MAC5D,CAACA,UAAA,CAAO,CAAA,EAAG,IAAI,CAAA,CAAE,CAAC,GAAG;AAAA,KACtB,CAAA;AAED,IAAA,MAAM,aAAA,GAAgB,EAAE,GAAG,KAAA,EAAO,GAAG,YAAA,EAAa;AAElD,IAAA,MAAM,UAAA,GAAa,IAAA,KAAS,OAAA,GAAU,QAAA,GAAW,IAAA;AAEjD,IAAA,MAAM,aAAa,MAAA,oBACjB,GAAA,CAAC,UAAK,SAAA,EAAWA,UAAA,CAAO,kBAAkB,CAAA,EACxC,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,UAAA;AAAA,QACL,eAAA,EAAgB,OAAA;AAAA,QAChB,IAAA,EAAM,UAAA;AAAA,QACN,sBAAA,EACE,OAAO,MAAA,KAAW,QAAA,GAAW,MAAA,GAAS;AAAA;AAAA,KAE1C,EACF,CAAA;AAGF,IAAA;AAAA;AAAA,sBAEE,GAAA;AAAA,QAAC,eAAA;AAAA,QAAA;AAAA,UACC,GAAA;AAAA,UACA,SAAA,EAAW,WAAA;AAAA,UACX,UAAA,EAAS,MAAA;AAAA,UACT,KAAA,EAAO,aAAA;AAAA,UACN,GAAG,IAAA;AAAA,UAEH,uCACC,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAWA,UAAA,CAAO,uBAAuB,CAAA,EAC5C,QAAA,EAAA;AAAA,YAAA,QAAA;AAAA,YACA;AAAA,WAAA,EACH,CAAA,GAEA;AAAA;AAAA;AAEJ;AAAA,EAEJ,CAAA,MAAA,IAAW,KAAA,CAAM,OAAA,KAAY,SAAA,EAAW;AACtC,IAAA,MAAM;AAAA,MACJ,OAAA,EAAS,CAAA;AAAA,MACT,QAAA;AAAA,MACA,SAAA;AAAA,MACA,IAAA,GAAO,QAAA;AAAA,MACP,KAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,WAAA,GAAcD,EAAA,CAAWC,UAAA,CAAO,SAAS,GAAG,SAAA,EAAW;AAAA,MAC3D,CAACA,UAAA,CAAO,CAAA,EAAG,IAAI,CAAA,CAAE,CAAC,GAAG;AAAA,KACtB,CAAA;AAED,IAAA,MAAM,aAAA,GAAgB,EAAE,GAAG,KAAA,EAAO,GAAG,YAAA,EAAa;AAElD,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,WAAA;AAAA,QACX,UAAA,EAAS,MAAA;AAAA,QACT,KAAA,EAAO,aAAA;AAAA,QACN,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ,CAAA,MAAO;AACL,IAAA,MAAM;AAAA,MACJ,OAAA,EAAS,CAAA;AAAA,MACT,QAAA;AAAA,MACA,SAAA;AAAA,MACA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAA;AAAA,MACA,IAAA,GAAO,QAAA;AAAA,MACP,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,WAAA,GAAcD,EAAA,CAAWC,UAAA,CAAO,UAAU,GAAG,SAAA,EAAW;AAAA,MAC5D,CAACA,UAAA,CAAO,CAAA,EAAG,IAAI,CAAA,CAAE,CAAC,GAAG,IAAA;AAAA,MACrB,CAACA,UAAA,CAAO,SAAS,CAAC,GAAG,OAAA;AAAA,MACrB,CAACA,UAAA,CAAO,QAAQ,CAAC,GAAG;AAAA,KACrB,CAAA;AAED,IAAA,MAAM,aAAA,GAAgB,EAAE,GAAG,KAAA,EAAO,GAAG,YAAA,EAAa;AAElD,IAAA,IAAI,MAAA,EAAQ;AACV,MAAA,uBACE,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,GAAA;AAAA,UACA,SAAA,EAAW,WAAA;AAAA,UACX,UAAA,EAAS,MAAA;AAAA,UACT,KAAA,EAAO,aAAA;AAAA,UACN,GAAG,IAAA;AAAA,UAEH;AAAA;AAAA,OACH;AAAA,IAEJ,CAAA,MAAO;AACL,MAAA,uBACE,GAAA;AAAA,QAAC,GAAA;AAAA,QAAA;AAAA,UACC,GAAA;AAAA,UACA,SAAA,EAAW,WAAA;AAAA,UACX,UAAA,EAAS,MAAA;AAAA,UACT,KAAA,EAAO,aAAA;AAAA,UACN,GAAG,IAAA;AAAA,UAEH;AAAA;AAAA,OACH;AAAA,IAEJ;AAAA,EACF;AACF,CAAC;AAED,IAAA,CAAK,WAAA,GAAc,MAAA;;;;"}
|