@servicetitan/anvil2 1.50.2 → 1.52.0
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 +34 -0
- package/dist/{Alert-DNhUyWVm.js → Alert-DREZhnU9.js} +4 -4
- package/dist/{Alert-DNhUyWVm.js.map → Alert-DREZhnU9.js.map} +1 -1
- package/dist/Alert.js +1 -1
- package/dist/{Announcement-BBq8zIQ3.js → Announcement-CRaUI73J.js} +13 -13
- package/dist/{Announcement-BBq8zIQ3.js.map → Announcement-CRaUI73J.js.map} +1 -1
- package/dist/Announcement.css +21 -10
- package/dist/Announcement.js +1 -1
- package/dist/{AnvilProvider-DBYMPYAO.js → AnvilProvider-0P4WQf5C.js} +3 -3
- package/dist/{AnvilProvider-DBYMPYAO.js.map → AnvilProvider-0P4WQf5C.js.map} +1 -1
- package/dist/AnvilProvider.js +1 -1
- package/dist/{Avatar-DeEV-v-b.js → Avatar-B4RLfLCS.js} +2 -2
- package/dist/{Avatar-DeEV-v-b.js.map → Avatar-B4RLfLCS.js.map} +1 -1
- package/dist/{Avatar-gtxslf5v.js → Avatar-DQN2dNgB.js} +3 -3
- package/dist/{Avatar-gtxslf5v.js.map → Avatar-DQN2dNgB.js.map} +1 -1
- package/dist/Avatar.js +2 -2
- package/dist/{Badge-DY5xJkqi.js → Badge-BrysDYfx.js} +3 -3
- package/dist/{Badge-DY5xJkqi.js.map → Badge-BrysDYfx.js.map} +1 -1
- package/dist/Badge.js +1 -1
- package/dist/{Breadcrumbs-CfJJlIIa.js → Breadcrumbs-S_ffklLw.js} +5 -5
- package/dist/{Breadcrumbs-CfJJlIIa.js.map → Breadcrumbs-S_ffklLw.js.map} +1 -1
- package/dist/Breadcrumbs.js +1 -1
- package/dist/{Button-92_FKAyV.js → Button-B__Q1BA5.js} +7 -6
- package/dist/Button-B__Q1BA5.js.map +1 -0
- package/dist/Button.css +62 -47
- package/dist/Button.js +1 -1
- package/dist/Button.module-Ck7VrMqw.js +26 -0
- package/dist/Button.module-Ck7VrMqw.js.map +1 -0
- package/dist/{ButtonCompound-COdSELhh.js → ButtonCompound-BB_WRzP4.js} +3 -3
- package/dist/{ButtonCompound-COdSELhh.js.map → ButtonCompound-BB_WRzP4.js.map} +1 -1
- package/dist/ButtonCompound.js +1 -1
- package/dist/{ButtonLink-C0zR7Wnb.js → ButtonLink-Dy0nfK_C.js} +5 -5
- package/dist/{ButtonLink-C0zR7Wnb.js.map → ButtonLink-Dy0nfK_C.js.map} +1 -1
- package/dist/ButtonLink.js +1 -1
- package/dist/{ButtonToggle--sKvhBoA.js → ButtonToggle-DVwe4l6m.js} +4 -4
- package/dist/{ButtonToggle--sKvhBoA.js.map → ButtonToggle-DVwe4l6m.js.map} +1 -1
- package/dist/ButtonToggle.js +1 -1
- package/dist/{Calendar-BeFARXwq.js → Calendar-C724Q7o1.js} +6 -6
- package/dist/{Calendar-BeFARXwq.js.map → Calendar-C724Q7o1.js.map} +1 -1
- package/dist/{Calendar-M9v994mm.js → Calendar-Cf0RN7Lw.js} +2 -2
- package/dist/{Calendar-M9v994mm.js.map → Calendar-Cf0RN7Lw.js.map} +1 -1
- package/dist/Calendar.js +2 -2
- package/dist/{Card-Ch3sMUo5.js → Card-TovA8Io5.js} +2 -2
- package/dist/{Card-Ch3sMUo5.js.map → Card-TovA8Io5.js.map} +1 -1
- package/dist/Card.js +1 -1
- package/dist/{Checkbox-BwFY38z1.js → Checkbox-AzsJkMNc.js} +46 -11
- package/dist/Checkbox-AzsJkMNc.js.map +1 -0
- package/dist/{Checkbox-Chck2V5C.js → Checkbox-cVEmXIlq.js} +2 -2
- package/dist/{Checkbox-Chck2V5C.js.map → Checkbox-cVEmXIlq.js.map} +1 -1
- package/dist/Checkbox.js +2 -2
- package/dist/{Chip-UqdorCE2.js → Chip-U9Ly2Ykq.js} +20 -16
- package/dist/Chip-U9Ly2Ykq.js.map +1 -0
- package/dist/Chip.js +1 -1
- package/dist/{Combobox-BTTWNSW1.js → Combobox-DM9cqsHw.js} +16 -16
- package/dist/{Combobox-BTTWNSW1.js.map → Combobox-DM9cqsHw.js.map} +1 -1
- package/dist/Combobox.js +1 -1
- package/dist/{DataTable-hXWouflx.js → DataTable-cgdU7End.js} +26 -15
- package/dist/{DataTable-hXWouflx.js.map → DataTable-cgdU7End.js.map} +1 -1
- package/dist/{DateField-B8JdMu94.js → DateField-c-ZqCtla.js} +6 -6
- package/dist/{DateField-B8JdMu94.js.map → DateField-c-ZqCtla.js.map} +1 -1
- package/dist/DateField.js +1 -1
- package/dist/{DateFieldRange-DWAgi_T9.js → DateFieldRange-DrLAeGHW.js} +6 -6
- package/dist/{DateFieldRange-DWAgi_T9.js.map → DateFieldRange-DrLAeGHW.js.map} +1 -1
- package/dist/DateFieldRange.js +1 -1
- package/dist/{DateFieldSingle-CQ6X-bVX.js → DateFieldSingle-DXwHdNB1.js} +6 -6
- package/dist/{DateFieldSingle-CQ6X-bVX.js.map → DateFieldSingle-DXwHdNB1.js.map} +1 -1
- package/dist/DateFieldSingle.js +1 -1
- package/dist/{DateFieldYearless-D6-NfIHu.js → DateFieldYearless-CdveZwsP.js} +5 -5
- package/dist/{DateFieldYearless-D6-NfIHu.js.map → DateFieldYearless-CdveZwsP.js.map} +1 -1
- package/dist/DateFieldYearless.js +1 -1
- package/dist/{DateFieldYearlessRange-CQM0vibm.js → DateFieldYearlessRange-ChwJDu5j.js} +6 -6
- package/dist/{DateFieldYearlessRange-CQM0vibm.js.map → DateFieldYearlessRange-ChwJDu5j.js.map} +1 -1
- package/dist/DateFieldYearlessRange.js +1 -1
- package/dist/{DaysOfTheWeek-BR-mg77X.js → DaysOfTheWeek-C40p_Az5.js} +6 -6
- package/dist/{DaysOfTheWeek-BR-mg77X.js.map → DaysOfTheWeek-C40p_Az5.js.map} +1 -1
- package/dist/DaysOfTheWeek.js +1 -1
- package/dist/{Details-CkaKTRvc.js → Details-BPC57NEj.js} +3 -3
- package/dist/{Details-CkaKTRvc.js.map → Details-BPC57NEj.js.map} +1 -1
- package/dist/Details.js +1 -1
- package/dist/{Dialog-Ba2oIATn.js → Dialog-BUntSmzP.js} +19 -10
- package/dist/Dialog-BUntSmzP.js.map +1 -0
- package/dist/Dialog.js +2 -2
- package/dist/{DialogCancelButton-CBHyI0CI.js → DialogCancelButton-DTRntuai.js} +2 -2
- package/dist/{DialogCancelButton-CBHyI0CI.js.map → DialogCancelButton-DTRntuai.js.map} +1 -1
- package/dist/{Divider-Olv8yWXD.js → Divider-CJvAnDYV.js} +2 -2
- package/dist/{Divider-Olv8yWXD.js.map → Divider-CJvAnDYV.js.map} +1 -1
- package/dist/Divider.js +1 -1
- package/dist/Dnd.js +1 -1
- package/dist/DndSort.js +5 -5
- package/dist/{Drawer-CWogbC68.js → Drawer-DwiVY4OM.js} +19 -10
- package/dist/Drawer-DwiVY4OM.js.map +1 -0
- package/dist/Drawer.js +1 -1
- package/dist/DrillDown.css +160 -0
- package/dist/DrillDown.d.ts +6 -0
- package/dist/DrillDown.js +2 -0
- package/dist/DrillDown.js.map +1 -0
- package/dist/DrillDown.module-C8VOhzaF.js +27 -0
- package/dist/DrillDown.module-C8VOhzaF.js.map +1 -0
- package/dist/{EditCard-Ds1UXJIS.js → EditCard-DgHXddkx.js} +6 -6
- package/dist/{EditCard-Ds1UXJIS.js.map → EditCard-DgHXddkx.js.map} +1 -1
- package/dist/EditCard.js +1 -1
- package/dist/{FieldDialog-BHgkQOhh.js → FieldDialog-DBazpB1n.js} +9 -9
- package/dist/{FieldDialog-BHgkQOhh.js.map → FieldDialog-DBazpB1n.js.map} +1 -1
- package/dist/{FieldLabel-BWOIFXgt.js → FieldLabel-BIfomAmE.js} +5 -5
- package/dist/{FieldLabel-BWOIFXgt.js.map → FieldLabel-BIfomAmE.js.map} +1 -1
- package/dist/FieldLabel.js +1 -1
- package/dist/{FieldMessage-DdCUxZz-.js → FieldMessage-CRNo4fd5.js} +3 -3
- package/dist/{FieldMessage-DdCUxZz-.js.map → FieldMessage-CRNo4fd5.js.map} +1 -1
- package/dist/FieldMessage.js +1 -1
- package/dist/{Flex-CjPHUTeq.js → Flex-DKS51qTf.js} +2 -2
- package/dist/{Flex-CjPHUTeq.js.map → Flex-DKS51qTf.js.map} +1 -1
- package/dist/Flex.js +1 -1
- package/dist/{Grid-DW2cAuHi.js → Grid-BUmKiLhz.js} +2 -2
- package/dist/{Grid-DW2cAuHi.js.map → Grid-BUmKiLhz.js.map} +1 -1
- package/dist/Grid.js +1 -1
- package/dist/{Helper-DzVUQgUJ.js → Helper-xZuAxaI0.js} +3 -3
- package/dist/{Helper-DzVUQgUJ.js.map → Helper-xZuAxaI0.js.map} +1 -1
- package/dist/{Icon-BSuTVNaa.js → Icon-BckjFkbw.js} +2 -2
- package/dist/{Icon-BSuTVNaa.js.map → Icon-BckjFkbw.js.map} +1 -1
- package/dist/Icon.js +1 -1
- package/dist/{InputMask-BzY1DJoV.js → InputMask-DVlAP_RP.js} +2 -2
- package/dist/{InputMask-BzY1DJoV.js.map → InputMask-DVlAP_RP.js.map} +1 -1
- package/dist/InputMask.js +1 -1
- package/dist/InteractiveCard-CvX95yR4.js +87 -0
- package/dist/InteractiveCard-CvX95yR4.js.map +1 -0
- package/dist/InteractiveCard.css +62 -0
- package/dist/InteractiveCard.d.ts +2 -0
- package/dist/InteractiveCard.js +2 -0
- package/dist/InteractiveCard.js.map +1 -0
- package/dist/{Layout-CUUb2PVr.js → Layout-DTAU7jS5.js} +2 -2
- package/dist/{Layout-CUUb2PVr.js.map → Layout-DTAU7jS5.js.map} +1 -1
- package/dist/Layout.js +1 -1
- package/dist/{Link-CGXEFA9w.js → Link-Bxzoojbs.js} +3 -3
- package/dist/{Link-CGXEFA9w.js.map → Link-Bxzoojbs.js.map} +1 -1
- package/dist/Link.js +1 -1
- package/dist/{LinkButton-BBCO-4em.js → LinkButton-FNYSfnTk.js} +2 -2
- package/dist/{LinkButton-BBCO-4em.js.map → LinkButton-FNYSfnTk.js.map} +1 -1
- package/dist/LinkButton.js +1 -1
- package/dist/{ListView-C5OBwbHe.js → ListView-Cg4nBWfN.js} +6 -5
- package/dist/ListView-Cg4nBWfN.js.map +1 -0
- package/dist/ListView.js +1 -1
- package/dist/{Listbox-C-n4IVVj.js → Listbox-BC4cG6vA.js} +5 -5
- package/dist/{Listbox-C-n4IVVj.js.map → Listbox-BC4cG6vA.js.map} +1 -1
- package/dist/Listbox.js +1 -1
- package/dist/{Menu-69JwGxYh.js → Menu-BtV2MgPG.js} +5 -5
- package/dist/{Menu-69JwGxYh.js.map → Menu-BtV2MgPG.js.map} +1 -1
- package/dist/Menu.js +1 -1
- package/dist/MultiSelectField.js +1 -1
- package/dist/{MultiSelectFieldSync-B3HNQf7R.js → MultiSelectFieldSync-9UFpyC0G.js} +11 -11
- package/dist/{MultiSelectFieldSync-B3HNQf7R.js.map → MultiSelectFieldSync-9UFpyC0G.js.map} +1 -1
- package/dist/{NumberField-CcH25bnO.js → NumberField-c5meQe1x.js} +7 -7
- package/dist/{NumberField-CcH25bnO.js.map → NumberField-c5meQe1x.js.map} +1 -1
- package/dist/NumberField.js +1 -1
- package/dist/Overflow.js +2 -2
- package/dist/{Page-B5HZSjSl.js → Page-CwZN3mFe.js} +110 -74
- package/dist/Page-CwZN3mFe.js.map +1 -0
- package/dist/Page.css +75 -71
- package/dist/Page.js +1 -1
- package/dist/{Pagination-CkdBaQx6.js → Pagination-B5q1H_YV.js} +8 -8
- package/dist/{Pagination-CkdBaQx6.js.map → Pagination-B5q1H_YV.js.map} +1 -1
- package/dist/Pagination.js +1 -1
- package/dist/{Popover-D9SmGQTh.js → Popover-CrJCwGA4.js} +4 -4
- package/dist/{Popover-D9SmGQTh.js.map → Popover-CrJCwGA4.js.map} +1 -1
- package/dist/Popover.js +1 -1
- package/dist/{ProgressBar-BABkqVmW.js → ProgressBar-BoKQoFpC.js} +6 -6
- package/dist/{ProgressBar-BABkqVmW.js.map → ProgressBar-BoKQoFpC.js.map} +1 -1
- package/dist/ProgressBar.js +1 -1
- package/dist/{Radio-Cds2laHA.js → Radio-Du9AQNxt.js} +2 -2
- package/dist/{Radio-Cds2laHA.js.map → Radio-Du9AQNxt.js.map} +1 -1
- package/dist/Radio.js +2 -2
- package/dist/{RadioGroup-COVlUmwy.js → RadioGroup-D_wLF0Ns.js} +46 -11
- package/dist/RadioGroup-D_wLF0Ns.js.map +1 -0
- package/dist/{SearchField-CJAo8dE0.js → SearchField-0DZvPwPZ.js} +4 -4
- package/dist/{SearchField-CJAo8dE0.js.map → SearchField-0DZvPwPZ.js.map} +1 -1
- package/dist/SearchField.js +1 -1
- package/dist/{SegmentedControl-DK1cwC7A.js → SegmentedControl-CMBQf7uo.js} +3 -3
- package/dist/{SegmentedControl-DK1cwC7A.js.map → SegmentedControl-CMBQf7uo.js.map} +1 -1
- package/dist/SegmentedControl.js +1 -1
- package/dist/{SelectCard-C-Kjk5eS.js → SelectCard-DVR6V1Yy.js} +114 -52
- package/dist/SelectCard-DVR6V1Yy.js.map +1 -0
- package/dist/SelectCard.css +40 -11
- package/dist/SelectCard.js +1 -1
- package/dist/SelectField.js +1 -1
- package/dist/{SelectFieldSync-0CL0RTpg.js → SelectFieldSync-_bvi-bS4.js} +9 -9
- package/dist/{SelectFieldSync-0CL0RTpg.js.map → SelectFieldSync-_bvi-bS4.js.map} +1 -1
- package/dist/{SelectTrigger-C1U-PlLz.js → SelectTrigger-D9ooImIA.js} +4 -4
- package/dist/{SelectTrigger-C1U-PlLz.js.map → SelectTrigger-D9ooImIA.js.map} +1 -1
- package/dist/SelectTrigger.js +1 -1
- package/dist/{SelectTriggerBase-RHD4FTQE.js → SelectTriggerBase-CdWAoTbv.js} +7 -7
- package/dist/{SelectTriggerBase-RHD4FTQE.js.map → SelectTriggerBase-CdWAoTbv.js.map} +1 -1
- package/dist/{SideNav-B1sH17Uc.js → SideNav-CG7ApaF5.js} +3 -3
- package/dist/{SideNav-B1sH17Uc.js.map → SideNav-CG7ApaF5.js.map} +1 -1
- package/dist/SideNav.js +1 -1
- package/dist/Skeleton.js +1 -1
- package/dist/{Spinner-xEFwsq8_.js → Spinner-CpEm3Lud.js} +2 -2
- package/dist/{Spinner-xEFwsq8_.js.map → Spinner-CpEm3Lud.js.map} +1 -1
- package/dist/Spinner.js +1 -1
- package/dist/{SrOnly-CTsYSuby.js → SrOnly-CrdBTl6E.js} +2 -2
- package/dist/{SrOnly-CTsYSuby.js.map → SrOnly-CrdBTl6E.js.map} +1 -1
- package/dist/SrOnly.js +1 -1
- package/dist/{Stepper-BZr9ytpD.js → Stepper-CPLniGfU.js} +4 -4
- package/dist/{Stepper-BZr9ytpD.js.map → Stepper-CPLniGfU.js.map} +1 -1
- package/dist/Stepper.js +1 -1
- package/dist/{Switch-CGpg2ake.js → Switch-CkZm45S3.js} +5 -5
- package/dist/{Switch-CGpg2ake.js.map → Switch-CkZm45S3.js.map} +1 -1
- package/dist/Switch.js +1 -1
- package/dist/{Tab-6UavokJJ.js → Tab-DC6z5eG3.js} +3 -3
- package/dist/{Tab-6UavokJJ.js.map → Tab-DC6z5eG3.js.map} +1 -1
- package/dist/Tab.js +1 -1
- package/dist/Table.js +1 -1
- package/dist/{Text-kPA-VzsB.js → Text-rR4bxNLd.js} +2 -2
- package/dist/{Text-kPA-VzsB.js.map → Text-rR4bxNLd.js.map} +1 -1
- package/dist/Text.js +1 -1
- package/dist/{TextField-BZ3h2mqU.js → TextField-CfUGyOma.js} +5 -5
- package/dist/{TextField-BZ3h2mqU.js.map → TextField-CfUGyOma.js.map} +1 -1
- package/dist/{TextField-BYGSTwkL.js → TextField-Db1sNZD1.js} +2 -2
- package/dist/{TextField-BYGSTwkL.js.map → TextField-Db1sNZD1.js.map} +1 -1
- package/dist/TextField.js +1 -1
- package/dist/{Textarea-Cb0Qs2FH.js → Textarea-Bqs7Nc16.js} +4 -4
- package/dist/{Textarea-Cb0Qs2FH.js.map → Textarea-Bqs7Nc16.js.map} +1 -1
- package/dist/Textarea.js +1 -1
- package/dist/{ThemeProvider-Bmsz__5N.js → ThemeProvider-DyYBQz5m.js} +2 -2
- package/dist/{ThemeProvider-Bmsz__5N.js.map → ThemeProvider-DyYBQz5m.js.map} +1 -1
- package/dist/ThemeProvider.js +1 -1
- package/dist/{TimeField-DBtJYC7t.js → TimeField-B44RhKMt.js} +6 -6
- package/dist/{TimeField-DBtJYC7t.js.map → TimeField-B44RhKMt.js.map} +1 -1
- package/dist/TimeField.js +1 -1
- package/dist/Toast.js +2 -2
- package/dist/{Toaster-DDrGllhh.js → Toaster-CeJoSndf.js} +6 -6
- package/dist/{Toaster-DDrGllhh.js.map → Toaster-CeJoSndf.js.map} +1 -1
- package/dist/{Toaster-Cerf91qp.js → Toaster-Cv04VrhM.js} +2 -2
- package/dist/{Toaster-Cerf91qp.js.map → Toaster-Cv04VrhM.js.map} +1 -1
- package/dist/{Toolbar-K9UFfyvX.js → Toolbar-BwF6ty_5.js} +20 -20
- package/dist/{Toolbar-K9UFfyvX.js.map → Toolbar-BwF6ty_5.js.map} +1 -1
- package/dist/Toolbar.js +1 -1
- package/dist/{Tooltip-CkfkiQPz.js → Tooltip--7kKcIkr.js} +3 -3
- package/dist/{Tooltip-CkfkiQPz.js.map → Tooltip--7kKcIkr.js.map} +1 -1
- package/dist/Tooltip.js +1 -1
- package/dist/{YearlessDateInputWithPicker-BIkxKxPi.js → YearlessDateInputWithPicker-Dxf9vgxB.js} +6 -6
- package/dist/{YearlessDateInputWithPicker-BIkxKxPi.js.map → YearlessDateInputWithPicker-Dxf9vgxB.js.map} +1 -1
- package/dist/beta/components/InteractiveCard/InteractiveCard.d.ts +49 -0
- package/dist/beta/components/InteractiveCard/index.d.ts +2 -0
- package/dist/beta/components/InteractiveCard/types.d.ts +101 -0
- package/dist/beta/components/Table/DataTable/types.d.ts +6 -0
- package/dist/beta/components/Toolbar/Toolbar.d.ts +2 -2
- package/dist/beta/components/Toolbar/ToolbarSelect.d.ts +2 -2
- package/dist/beta/components/index.d.ts +1 -0
- package/dist/beta.js +8 -7
- package/dist/beta.js.map +1 -1
- package/dist/components/Badge/Badge.figma.d.ts +1 -0
- package/dist/components/Button/Button.d.ts +2 -2
- package/dist/components/Checkbox/Checkbox.d.ts +4 -0
- package/dist/components/Checkbox/CheckboxGroup.d.ts +35 -0
- package/dist/components/Checkbox/internal/CheckboxGroupContext.d.ts +19 -0
- package/dist/components/Dialog/Dialog.d.ts +25 -0
- package/dist/components/Drawer/Drawer.d.ts +17 -0
- package/dist/components/DrillDown/DrillDown.d.ts +55 -0
- package/dist/components/DrillDown/DrillDownContent.d.ts +24 -0
- package/dist/components/DrillDown/DrillDownFooter.d.ts +28 -0
- package/dist/components/DrillDown/DrillDownHeader.d.ts +33 -0
- package/dist/components/DrillDown/DrillDownNextButton.d.ts +28 -0
- package/dist/components/DrillDown/DrillDownPrevButton.d.ts +28 -0
- package/dist/components/DrillDown/index.d.ts +8 -0
- package/dist/components/DrillDown/internal/DrillDownContext.d.ts +12 -0
- package/dist/components/DrillDown/internal/useDrillDownContext.d.ts +1 -0
- package/dist/components/DrillDown/internal/useDrillDownContextState.d.ts +14 -0
- package/dist/components/DrillDown/useDrilldown.d.ts +40 -0
- package/dist/components/Icon/Icons.figma.d.ts +1 -1
- package/dist/components/ListView/internal/types.d.ts +3 -1
- package/dist/components/Page/Page.d.ts +2 -0
- package/dist/components/Page/PagePanel.d.ts +17 -0
- package/dist/components/Page/index.d.ts +1 -0
- package/dist/components/Radio/Radio.d.ts +4 -0
- package/dist/components/Radio/Radio.figma.d.ts +1 -0
- package/dist/components/Radio/RadioGroup.d.ts +35 -0
- package/dist/components/Radio/internal/RadioGroupContext.d.ts +19 -0
- package/dist/components/SelectCard/SelectCard.d.ts +8 -1
- package/dist/components/SelectCard/SelectCardGroup.d.ts +6 -0
- package/dist/components/SelectCard/internal/SelectCardContext.d.ts +7 -1
- package/dist/components/SelectCard/internal/SelectCardProvider.d.ts +1 -1
- package/dist/components/Toolbar/Toolbar.d.ts +2 -2
- package/dist/components/Toolbar/ToolbarSelect.d.ts +2 -2
- package/dist/components/index.d.ts +1 -0
- package/dist/{index-ByS9WvPk.js → index-DVtI3CrN.js} +4 -4
- package/dist/{index-ByS9WvPk.js.map → index-DVtI3CrN.js.map} +1 -1
- package/dist/{index-tZvMCc77.js → index-SvGbrGuT.js} +27 -2
- package/dist/{index-tZvMCc77.js.map → index-SvGbrGuT.js.map} +1 -1
- package/dist/index.js +72 -71
- package/dist/index.js.map +1 -1
- package/dist/{match-sorter.esm-NrKOPPde.js → match-sorter.esm-B3vwg1-X.js} +2 -2
- package/dist/{match-sorter.esm-NrKOPPde.js.map → match-sorter.esm-B3vwg1-X.js.map} +1 -1
- package/dist/useDrillDownContext-BssSasVB.js +15 -0
- package/dist/useDrillDownContext-BssSasVB.js.map +1 -0
- package/dist/useDrilldown-pzr3387k.js +2456 -0
- package/dist/useDrilldown-pzr3387k.js.map +1 -0
- package/dist/{useInitialFocus-D_ESGka7.js → useInitialFocus-XFk_17dP.js} +97 -3
- package/dist/useInitialFocus-XFk_17dP.js.map +1 -0
- package/dist/{utils-u8cyv323.js → utils-CsKSRsqK.js} +2 -2
- package/dist/{utils-u8cyv323.js.map → utils-CsKSRsqK.js.map} +1 -1
- package/package.json +5 -2
- package/dist/Button-92_FKAyV.js.map +0 -1
- package/dist/Button.module-C1g9rrJs.js +0 -25
- package/dist/Button.module-C1g9rrJs.js.map +0 -1
- package/dist/Checkbox-BwFY38z1.js.map +0 -1
- package/dist/Chip-UqdorCE2.js.map +0 -1
- package/dist/Dialog-Ba2oIATn.js.map +0 -1
- package/dist/Drawer-CWogbC68.js.map +0 -1
- package/dist/ListView-C5OBwbHe.js.map +0 -1
- package/dist/Page-B5HZSjSl.js.map +0 -1
- package/dist/RadioGroup-COVlUmwy.js.map +0 -1
- package/dist/SelectCard-C-Kjk5eS.js.map +0 -1
- package/dist/useInitialFocus-D_ESGka7.js.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,39 @@
|
|
|
1
1
|
# @servicetitan/anvil2
|
|
2
2
|
|
|
3
|
+
## 1.52.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#1853](https://github.com/servicetitan/hammer/pull/1853) [`5d58224`](https://github.com/servicetitan/hammer/commit/5d582247697b0313f9c6f82b962fcb99c549eb2b) Thanks [@w-a-t-s-o-n](https://github.com/w-a-t-s-o-n)! - [Checkbox.Group, Radio.Group] Add `description`, `error`, `errorAriaLive`, and `hint` props
|
|
8
|
+
|
|
9
|
+
- [`650b010`](https://github.com/servicetitan/hammer/commit/650b010d13a03713824d7489e93a3ffc98f15f4d) Thanks [@rgdelato](https://github.com/rgdelato)! - [Spinner] Update Spinner to an official verision with size properties and dynamic stroke width
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [#1839](https://github.com/servicetitan/hammer/pull/1839) [`d38db43`](https://github.com/servicetitan/hammer/commit/d38db43bbacb85443f4a942eacd3e3f97bc02276) Thanks [@Diveafall](https://github.com/Diveafall)! - **BETA** [DataTable]: Add `refreshKey` prop to trigger loading page data
|
|
14
|
+
|
|
15
|
+
## 1.51.0
|
|
16
|
+
|
|
17
|
+
### Minor Changes
|
|
18
|
+
|
|
19
|
+
- [#1805](https://github.com/servicetitan/hammer/pull/1805) [`c517bef`](https://github.com/servicetitan/hammer/commit/c517bef0183714b09856c4bdeb0093757d52b73a) Thanks [@w-a-t-s-o-n](https://github.com/w-a-t-s-o-n)! - [SelectCard, SelectCard.Group] New `showSelectIndicator` prop to show radio/checkbox visuals
|
|
20
|
+
|
|
21
|
+
- [#1829](https://github.com/servicetitan/hammer/pull/1829) [`d8a0670`](https://github.com/servicetitan/hammer/commit/d8a0670e20e823d16bdcd9581c38566f61c736f4) Thanks [@w-a-t-s-o-n](https://github.com/w-a-t-s-o-n)! - [Button] Add `"xsmall"` option to `size` prop
|
|
22
|
+
|
|
23
|
+
- [#1771](https://github.com/servicetitan/hammer/pull/1771) [`ce40328`](https://github.com/servicetitan/hammer/commit/ce40328800ee66f5bd4b5d6879a529c6d4933a8a) Thanks [@rgdelato](https://github.com/rgdelato)! - [DrillDown, Dialog, Drawer, Page.Panel] Add new `DrillDown` components for use within `Dialog`, `Drawer`, and `Page.Panel`
|
|
24
|
+
|
|
25
|
+
### Patch Changes
|
|
26
|
+
|
|
27
|
+
- [#1806](https://github.com/servicetitan/hammer/pull/1806) [`f8fd824`](https://github.com/servicetitan/hammer/commit/f8fd824cfd673d81346de4f2eda8a9533c53ea99) Thanks [@ericag1985](https://github.com/ericag1985)! - [Announcement] Fix button backgrounds and focus rings not meeting WCAG threshold
|
|
28
|
+
|
|
29
|
+
- [#1822](https://github.com/servicetitan/hammer/pull/1822) [`a3346c5`](https://github.com/servicetitan/hammer/commit/a3346c52f5054531bd15357a442b1329ca1e6301) Thanks [@da1z](https://github.com/da1z)! - [ListView] Fix type narrowing for onSelectionChange callback when items prop is not provided
|
|
30
|
+
|
|
31
|
+
- [#1811](https://github.com/servicetitan/hammer/pull/1811) [`0d85336`](https://github.com/servicetitan/hammer/commit/0d85336e1d4e5040dbf01400e4dce33bb6e05812) Thanks [@ericag1985](https://github.com/ericag1985)! - **BETA** [InteractiveCard] Initial beta release of `InteractiveCard`
|
|
32
|
+
|
|
33
|
+
- [#1813](https://github.com/servicetitan/hammer/pull/1813) [`3262bd6`](https://github.com/servicetitan/hammer/commit/3262bd6a1fbdacb70d3bf4c93d3a2b5b979991e4) Thanks [@w-a-t-s-o-n](https://github.com/w-a-t-s-o-n)! - [Chip] Refactor multiline calc to use computed styles instead of range
|
|
34
|
+
|
|
35
|
+
- [#1805](https://github.com/servicetitan/hammer/pull/1805) [`c517bef`](https://github.com/servicetitan/hammer/commit/c517bef0183714b09856c4bdeb0093757d52b73a) Thanks [@w-a-t-s-o-n](https://github.com/w-a-t-s-o-n)! - [SelectCard, SelectCard.Group] Make `onChange` props optional
|
|
36
|
+
|
|
3
37
|
## 1.50.2
|
|
4
38
|
|
|
5
39
|
### Patch Changes
|
|
@@ -5,9 +5,9 @@ import { S as SvgInfo } from './info-CYpG6tcI.js';
|
|
|
5
5
|
import { S as SvgWarning } from './warning-c4Wj1rI4.js';
|
|
6
6
|
import { S as SvgError } from './error-DR_wWdYY.js';
|
|
7
7
|
import { S as SvgCheckCircle } from './check_circle-CM0ukqXv.js';
|
|
8
|
-
import { I as Icon } from './Icon-
|
|
9
|
-
import { B as Button } from './Button-
|
|
10
|
-
import { c as cx } from './index-
|
|
8
|
+
import { I as Icon } from './Icon-BckjFkbw.js';
|
|
9
|
+
import { B as Button } from './Button-B__Q1BA5.js';
|
|
10
|
+
import { c as cx } from './index-SvGbrGuT.js';
|
|
11
11
|
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
|
|
12
12
|
import { useTrackingId } from './useTrackingId.js';
|
|
13
13
|
|
|
@@ -110,4 +110,4 @@ const Alert = forwardRef(
|
|
|
110
110
|
Alert.displayName = "Alert";
|
|
111
111
|
|
|
112
112
|
export { Alert as A };
|
|
113
|
-
//# sourceMappingURL=Alert-
|
|
113
|
+
//# sourceMappingURL=Alert-DREZhnU9.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert-
|
|
1
|
+
{"version":3,"file":"Alert-DREZhnU9.js","sources":["../src/components/Alert/Alert.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, MouseEvent, Ref, forwardRef } from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport {\n DataTrackingId,\n LayoutUtilProps,\n OnCloseProps,\n Status,\n Svg,\n} from \"../../types\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport Info from \"@servicetitan/hammer-icon/mdi/round/info.svg\";\nimport Warning from \"@servicetitan/hammer-icon/mdi/round/warning.svg\";\nimport Danger from \"@servicetitan/hammer-icon/mdi/round/error.svg\";\nimport Success from \"@servicetitan/hammer-icon/mdi/round/check_circle.svg\";\nimport Icon from \"../Icon\";\nimport Button from \"../Button\";\n\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\nimport cx from \"classnames\";\nimport styles from \"./Alert.module.scss\";\n\n/**\n * Props for the Alert component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends LayoutUtilProps\n * @extends OnCloseProps\n */\nexport type AlertProps = ComponentPropsWithoutRef<\"div\"> &\n LayoutUtilProps &\n OnCloseProps & {\n /**\n * The visual style of an alert.\n * @default info\n */\n status?: Status;\n /**\n * The title text displayed in the alert.\n */\n title: string;\n } &\n /**\n * Data tracking id\n */\n DataTrackingId;\n\nconst statusIconMap: Record<NonNullable<AlertProps[\"status\"]>, Svg> = {\n info: Info,\n success: Success,\n warning: Warning,\n danger: Danger,\n};\n\n/**\n * Alert component for displaying important messages to users.\n *\n * Features:\n * - Supports different visual styles (info, success, warning, danger)\n * - Optional close button for dismissible alerts\n * - Customizable title and content\n * - Accessible with proper ARIA roles\n * - Includes status-specific icons\n * - Supports layout utilities for positioning and spacing\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Alert\n * title=\"System Update\"\n * onClose={() => console.log('Alert closed')}\n * >\n * The system will be updated tonight.\n * </Alert>\n *\n * @example\n * <Alert\n * status=\"success\"\n * title=\"Operation Complete\"\n * >\n * Your changes have been saved successfully.\n * </Alert>\n */\nexport const Alert = forwardRef(\n (props: AlertProps, ref: Ref<HTMLDivElement>) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const {\n children,\n className,\n title,\n status = \"info\",\n style,\n onClose,\n ...rest\n } = componentProps;\n\n const data = {\n title,\n status,\n };\n\n const trackingId = useTrackingId({\n name: \"Alert\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const alertCx = cx(styles[\"alert\"], className, {\n [styles[\"success\"]]: status === \"success\",\n [styles[\"warning\"]]: status === \"warning\",\n [styles[\"danger\"]]: status === \"danger\",\n });\n\n const styleCombined = {\n ...style,\n ...layoutStyles,\n };\n\n return (\n <div\n data-tracking-id={trackingId}\n data-anv=\"alert\"\n role=\"status\"\n className={alertCx}\n style={styleCombined}\n {...rest}\n ref={ref}\n >\n <div className={styles[\"top\"]}>\n <span className={styles[\"title-container\"]}>\n {\n <Icon\n size=\"large\"\n className={styles[\"status-icon\"]}\n svg={statusIconMap[status ?? \"info\"]}\n />\n }\n {title}\n </span>\n {!!onClose && (\n <span className={styles[\"close-container\"]}>\n <Button\n icon={Close}\n size=\"small\"\n appearance=\"ghost\"\n className={styles[\"close-button\"]}\n onClick={(e: MouseEvent<HTMLButtonElement>) => onClose(e)}\n aria-label={`Dismiss ${status} alert`}\n />\n </span>\n )}\n </div>\n {children && <div className={styles[\"content\"]}>{children}</div>}\n </div>\n );\n },\n);\n\nAlert.displayName = \"Alert\";\n"],"names":["Info","Success","Warning","Danger","Close"],"mappings":"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"}
|
package/dist/Alert.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { A as Alert, A as default } from './Alert-
|
|
1
|
+
export { A as Alert, A as default } from './Alert-DREZhnU9.js';
|
|
2
2
|
//# sourceMappingURL=Alert.js.map
|
|
@@ -5,27 +5,27 @@ import { S as SvgInfo } from './info-CYpG6tcI.js';
|
|
|
5
5
|
import { S as SvgWarning } from './warning-c4Wj1rI4.js';
|
|
6
6
|
import { S as SvgError } from './error-DR_wWdYY.js';
|
|
7
7
|
import { S as SvgCheckCircle } from './check_circle-CM0ukqXv.js';
|
|
8
|
-
import { B as Button } from './Button-
|
|
9
|
-
import { I as Icon } from './Icon-
|
|
10
|
-
import { c as cx } from './index-
|
|
8
|
+
import { B as Button } from './Button-B__Q1BA5.js';
|
|
9
|
+
import { I as Icon } from './Icon-BckjFkbw.js';
|
|
10
|
+
import { c as cx } from './index-SvGbrGuT.js';
|
|
11
11
|
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
|
|
12
12
|
import { useTrackingId } from './useTrackingId.js';
|
|
13
13
|
|
|
14
|
-
import './Announcement.css';const announcement = "
|
|
15
|
-
const title = "
|
|
16
|
-
const success = "
|
|
17
|
-
const warning = "
|
|
18
|
-
const danger = "
|
|
14
|
+
import './Announcement.css';const announcement = "_announcement_178jo_2";
|
|
15
|
+
const title = "_title_178jo_48";
|
|
16
|
+
const success = "_success_178jo_68";
|
|
17
|
+
const warning = "_warning_178jo_76";
|
|
18
|
+
const danger = "_danger_178jo_84";
|
|
19
19
|
const styles = {
|
|
20
20
|
announcement: announcement,
|
|
21
|
-
"close-container": "_close-
|
|
22
|
-
"title-container": "_title-
|
|
21
|
+
"close-container": "_close-container_178jo_39",
|
|
22
|
+
"title-container": "_title-container_178jo_48",
|
|
23
23
|
title: title,
|
|
24
|
-
"status-icon": "_status-
|
|
24
|
+
"status-icon": "_status-icon_178jo_65",
|
|
25
25
|
success: success,
|
|
26
26
|
warning: warning,
|
|
27
27
|
danger: danger,
|
|
28
|
-
"close-button": "_close-
|
|
28
|
+
"close-button": "_close-button_178jo_94"
|
|
29
29
|
};
|
|
30
30
|
|
|
31
31
|
const statusIconMap = {
|
|
@@ -106,4 +106,4 @@ const Announcement = forwardRef(
|
|
|
106
106
|
Announcement.displayName = "Announcement";
|
|
107
107
|
|
|
108
108
|
export { Announcement as A };
|
|
109
|
-
//# sourceMappingURL=Announcement-
|
|
109
|
+
//# sourceMappingURL=Announcement-CRaUI73J.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Announcement-
|
|
1
|
+
{"version":3,"file":"Announcement-CRaUI73J.js","sources":["../src/components/Announcement/Announcement.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, MouseEvent, Ref, forwardRef } from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport {\n DataTrackingId,\n LayoutUtilProps,\n OnCloseProps,\n Status,\n Svg,\n} from \"../../types\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport Info from \"@servicetitan/hammer-icon/mdi/round/info.svg\";\nimport Warning from \"@servicetitan/hammer-icon/mdi/round/warning.svg\";\nimport Danger from \"@servicetitan/hammer-icon/mdi/round/error.svg\";\nimport Success from \"@servicetitan/hammer-icon/mdi/round/check_circle.svg\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport Button from \"../Button\";\nimport Icon from \"../Icon\";\n\nimport cx from \"classnames\";\nimport styles from \"./Announcement.module.scss\";\n\n/**\n * Props for the Announcement component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\">\n * @extends OnCloseProps\n */\nexport type AnnouncementProps = ComponentPropsWithoutRef<\"div\"> &\n Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\"> &\n OnCloseProps & {\n /**\n * The visual style of the announcement.\n * @default info\n */\n status?: Status;\n /**\n * The title text displayed in the announcement.\n */\n title: string;\n } &\n /**\n * Data tracking id\n */\n DataTrackingId;\n\nconst statusIconMap: Record<NonNullable<AnnouncementProps[\"status\"]>, Svg> = {\n info: Info,\n success: Success,\n warning: Warning,\n danger: Danger,\n};\n\n/**\n * Announcement component for displaying important messages to users.\n *\n * Features:\n * - Supports different visual styles (info, success, warning, danger)\n * - Optional close button for dismissible announcements\n * - Customizable title and content\n * - Accessible with proper ARIA roles\n * - Includes status-specific icons\n * - Supports layout utilities for positioning and spacing\n * - Includes data tracking capabilities\n *\n * @example\n * <Announcement\n * title=\"New Feature\"\n * onClose={() => console.log('Announcement closed')}\n * >\n * Check out our latest feature!\n * </Announcement>\n *\n * @example\n * <Announcement\n * status=\"warning\"\n * title=\"Maintenance Notice\"\n * >\n * Scheduled maintenance will begin in 30 minutes.\n * </Announcement>\n */\nexport const Announcement = forwardRef(\n (props: AnnouncementProps, ref: Ref<HTMLDivElement>) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n\n const {\n className,\n title,\n status = \"info\",\n children,\n style,\n onClose,\n ...rest\n } = componentProps;\n\n const data = {\n title,\n status,\n };\n\n const trackingId = useTrackingId({\n name: \"Announcement\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const AnnouncementCx = cx(styles[\"announcement\"], className, {\n [styles[\"success\"]]: status === \"success\",\n [styles[\"warning\"]]: status === \"warning\",\n [styles[\"danger\"]]: status === \"danger\",\n });\n\n const styleCombined = {\n ...style,\n ...layoutStyles,\n };\n\n return (\n <div\n data-tracking-id={trackingId}\n role=\"status\"\n className={AnnouncementCx}\n data-anv=\"announcement\"\n style={styleCombined}\n {...rest}\n ref={ref}\n >\n <span className={styles[\"title-container\"]}>\n <Icon\n size=\"large\"\n className={styles[\"status-icon\"]}\n svg={statusIconMap[status]}\n />\n\n <span className={styles[\"title\"]}>{title}</span>\n </span>\n\n {children}\n\n {onClose ? (\n <span className={styles[\"close-container\"]}>\n <Button\n icon={Close}\n size=\"small\"\n appearance=\"ghost\"\n className={styles[\"close-button\"]}\n onClick={(e: MouseEvent<HTMLButtonElement>) => onClose(e)}\n aria-label={`Dismiss ${status} announcement`}\n />\n </span>\n ) : null}\n </div>\n );\n },\n);\n\nAnnouncement.displayName = \"Announcement\";\n"],"names":["Info","Success","Warning","Danger","Close"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,MAAM,aAAA,GAAuE;AAAA,EAC3E,IAAA,EAAMA,OAAA;AAAA,EACN,OAAA,EAASC,cAAA;AAAA,EACT,OAAA,EAASC,UAAA;AAAA,EACT,MAAA,EAAQC;AACV,CAAA;AA8BO,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAA0B,GAAA,KAA6B;AACtD,IAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AAEjE,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,KAAA;AAAA,MACA,MAAA,GAAS,MAAA;AAAA,MACT,QAAA;AAAA,MACA,KAAA;AAAA,MACA,OAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,KAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,cAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AAED,IAAA,MAAM,cAAA,GAAiB,EAAA,CAAG,MAAA,CAAO,cAAc,GAAG,SAAA,EAAW;AAAA,MAC3D,CAAC,MAAA,CAAO,SAAS,CAAC,GAAG,MAAA,KAAW,SAAA;AAAA,MAChC,CAAC,MAAA,CAAO,SAAS,CAAC,GAAG,MAAA,KAAW,SAAA;AAAA,MAChC,CAAC,MAAA,CAAO,QAAQ,CAAC,GAAG,MAAA,KAAW;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,aAAA,GAAgB;AAAA,MACpB,GAAG,KAAA;AAAA,MACH,GAAG;AAAA,KACL;AAEA,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,kBAAA,EAAkB,UAAA;AAAA,QAClB,IAAA,EAAK,QAAA;AAAA,QACL,SAAA,EAAW,cAAA;AAAA,QACX,UAAA,EAAS,cAAA;AAAA,QACT,KAAA,EAAO,aAAA;AAAA,QACN,GAAG,IAAA;AAAA,QACJ,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,iBAAiB,CAAA,EACvC,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,IAAA;AAAA,cAAA;AAAA,gBACC,IAAA,EAAK,OAAA;AAAA,gBACL,SAAA,EAAW,OAAO,aAAa,CAAA;AAAA,gBAC/B,GAAA,EAAK,cAAc,MAAM;AAAA;AAAA,aAC3B;AAAA,gCAEC,MAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,OAAO,GAAI,QAAA,EAAA,KAAA,EAAM;AAAA,WAAA,EAC3C,CAAA;AAAA,UAEC,QAAA;AAAA,UAEA,0BACC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,iBAAiB,CAAA,EACvC,QAAA,kBAAA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAMC,QAAA;AAAA,cACN,IAAA,EAAK,OAAA;AAAA,cACL,UAAA,EAAW,OAAA;AAAA,cACX,SAAA,EAAW,OAAO,cAAc,CAAA;AAAA,cAChC,OAAA,EAAS,CAAC,CAAA,KAAqC,OAAA,CAAQ,CAAC,CAAA;AAAA,cACxD,YAAA,EAAY,WAAW,MAAM,CAAA,aAAA;AAAA;AAAA,aAEjC,CAAA,GACE;AAAA;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;;;"}
|
package/dist/Announcement.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
@layer starter, reset, base, state, application;
|
|
2
2
|
@layer reset {
|
|
3
|
-
.
|
|
3
|
+
._announcement_178jo_2 {
|
|
4
4
|
all: unset;
|
|
5
5
|
font-family: var(--font-family-base, "Nunito Sans", sans-serif);
|
|
6
6
|
font-size: 100%;
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
}
|
|
16
16
|
}
|
|
17
17
|
@layer base {
|
|
18
|
-
.
|
|
18
|
+
._announcement_178jo_2 {
|
|
19
19
|
padding-block: 0.5rem !important;
|
|
20
20
|
padding-inline: 1rem;
|
|
21
21
|
width: 100%;
|
|
@@ -29,11 +29,15 @@
|
|
|
29
29
|
position: relative;
|
|
30
30
|
gap: 1rem;
|
|
31
31
|
padding-inline-end: 3.5rem;
|
|
32
|
+
--button-secondary-background-color: light-dark(
|
|
33
|
+
#04040426,
|
|
34
|
+
#ffffff8c
|
|
35
|
+
);
|
|
32
36
|
--button-secondary-foreground-color: var(--foreground-color-on-primary, #ffffff);
|
|
33
37
|
--button-secondary-foreground-color-hover: var(--foreground-color-on-primary, #ffffff);
|
|
34
38
|
--button-secondary-foreground-color-active: var(--foreground-color-on-primary, #ffffff);
|
|
35
39
|
}
|
|
36
|
-
.
|
|
40
|
+
._announcement_178jo_2 ._close-container_178jo_39 {
|
|
37
41
|
display: flex;
|
|
38
42
|
justify-content: center;
|
|
39
43
|
align-items: center;
|
|
@@ -42,47 +46,54 @@
|
|
|
42
46
|
position: absolute;
|
|
43
47
|
inset-inline-end: 1rem;
|
|
44
48
|
}
|
|
45
|
-
.
|
|
49
|
+
._announcement_178jo_2 ._title-container_178jo_48 {
|
|
46
50
|
display: flex;
|
|
47
51
|
align-items: center;
|
|
48
52
|
gap: 0.25rem;
|
|
49
53
|
overflow: hidden;
|
|
50
54
|
}
|
|
51
|
-
.
|
|
55
|
+
._announcement_178jo_2 ._title-container_178jo_48 ._title_178jo_48 {
|
|
52
56
|
overflow: hidden;
|
|
53
57
|
white-space: nowrap;
|
|
54
58
|
text-overflow: ellipsis;
|
|
55
59
|
font-size: 1rem;
|
|
56
60
|
}
|
|
61
|
+
._announcement_178jo_2 button {
|
|
62
|
+
outline-color: var(--a2-announcement-focus-ring-color, var(--foreground-color-on-primary, #ffffff));
|
|
63
|
+
}
|
|
57
64
|
}
|
|
58
65
|
@layer state {
|
|
59
|
-
.
|
|
66
|
+
._announcement_178jo_2 ._status-icon_178jo_65 {
|
|
60
67
|
color: inherit;
|
|
61
68
|
}
|
|
62
|
-
.
|
|
69
|
+
._announcement_178jo_2._success_178jo_68 {
|
|
63
70
|
background-color: var(--status-color-success, #007A4D);
|
|
64
71
|
color: var(--foreground-color-inverted, #ffffff);
|
|
72
|
+
--a2-announcement-focus-ring-color: var(--foreground-color-inverted, #ffffff);
|
|
65
73
|
--button-secondary-foreground-color: var(--foreground-color-inverted, #ffffff);
|
|
66
74
|
--button-secondary-foreground-color-hover: var(--foreground-color-inverted, #ffffff);
|
|
67
75
|
--button-secondary-foreground-color-active: var(--foreground-color-inverted, #ffffff);
|
|
68
76
|
}
|
|
69
|
-
.
|
|
77
|
+
._announcement_178jo_2._warning_178jo_76 {
|
|
70
78
|
background-color: var(--status-color-warning, #ffbe00);
|
|
71
79
|
color: var(--foreground-color-on-warning, #141414);
|
|
80
|
+
--a2-announcement-focus-ring-color: var(--foreground-color-on-warning, #141414);
|
|
72
81
|
--button-secondary-foreground-color: var(--foreground-color-on-warning, #141414);
|
|
73
82
|
--button-secondary-foreground-color-hover: var(--foreground-color-on-warning, #141414);
|
|
74
83
|
--button-secondary-foreground-color-active: var(--foreground-color-on-warning, #141414);
|
|
75
84
|
}
|
|
76
|
-
.
|
|
85
|
+
._announcement_178jo_2._danger_178jo_84 {
|
|
77
86
|
background-color: var(--status-color-danger, #e13212);
|
|
78
87
|
color: var(--foreground-color-on-danger, #ffffff);
|
|
88
|
+
--a2-announcement-focus-ring-color: var(--foreground-color-on-danger, #ffffff);
|
|
79
89
|
--button-secondary-foreground-color: var(--foreground-color-on-danger, #ffffff);
|
|
80
90
|
--button-secondary-foreground-color-hover: var(--foreground-color-on-danger, #ffffff);
|
|
81
91
|
--button-secondary-foreground-color-active: var(--foreground-color-on-danger, #ffffff);
|
|
82
92
|
}
|
|
83
93
|
}
|
|
84
94
|
@layer application {
|
|
85
|
-
.
|
|
95
|
+
._announcement_178jo_2 ._close-button_178jo_94 {
|
|
86
96
|
color: inherit;
|
|
97
|
+
outline-color: var(--a2-announcement-focus-ring-color, var(--foreground-color-on-primary, #ffffff));
|
|
87
98
|
}
|
|
88
99
|
}
|
package/dist/Announcement.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { A as Announcement, A as default } from './Announcement-
|
|
1
|
+
export { A as Announcement, A as default } from './Announcement-CRaUI73J.js';
|
|
2
2
|
//# sourceMappingURL=Announcement.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { t as themeStyles, T as ThemeProvider } from './ThemeProvider-
|
|
2
|
+
import { t as themeStyles, T as ThemeProvider } from './ThemeProvider-DyYBQz5m.js';
|
|
3
3
|
import { useState, useMemo } from 'react';
|
|
4
|
-
import { c as cx } from './index-
|
|
4
|
+
import { c as cx } from './index-SvGbrGuT.js';
|
|
5
5
|
import { u as useBreakpoint } from './useBreakpoint-BGCsBhQ7.js';
|
|
6
6
|
import { a as useTranslations, L as LocalizationContext } from './LocalizationContext-UsmB5mnR.js';
|
|
7
7
|
import { T as TrackingProvider } from './TrackingProvider-Co4lyoI9.js';
|
|
@@ -63,4 +63,4 @@ const AnvilProvider = (props) => {
|
|
|
63
63
|
};
|
|
64
64
|
|
|
65
65
|
export { AnvilProvider as A };
|
|
66
|
-
//# sourceMappingURL=AnvilProvider-
|
|
66
|
+
//# sourceMappingURL=AnvilProvider-0P4WQf5C.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnvilProvider-
|
|
1
|
+
{"version":3,"file":"AnvilProvider-0P4WQf5C.js","sources":["../src/providers/AnvilProvider/AnvilProvider.tsx"],"sourcesContent":["import { ThemeProvider } from \"../ThemeProvider\";\nimport themeStyles from \"../ThemeProvider/ThemeProvider.module.scss\";\nimport { useMemo, useState } from \"react\";\nimport cx from \"classnames\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\nimport { useTranslations } from \"../LocalizationProvider/useTranslations\";\nimport { LocalizationContext } from \"../LocalizationProvider\";\nimport TrackingProvider from \"../TrackingProvider\";\nimport {\n AnvilProviderContext,\n AnvilProviderProps,\n TooltipLegacyGroupContext,\n} from \"./AnvilProviderContext\";\n\nexport const AnvilProvider = (props: AnvilProviderProps) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n\n const {\n themeData,\n localizationData,\n trackingIdData,\n children,\n className,\n style,\n ...rest\n } = componentProps;\n\n const {\n locale = \"en\",\n dir = \"ltr\",\n translations = {},\n } = localizationData ?? {};\n\n const { scope = \"ST\", optOut } = trackingIdData ?? {};\n\n const classNameCombined = cx(className, [themeStyles[\"theme-core\"]], {\n [themeStyles[\"mode-dark\"]]: themeData?.mode === \"dark\",\n [themeStyles[\"mode-light\"]]: themeData?.mode === \"light\",\n });\n const styleCombined = {\n ...style,\n ...layoutStyles,\n };\n\n const breakpoint = useBreakpoint();\n\n const [disableDelayGroup, setDisableDelayGroup] = useState(false);\n\n const { translations: t } = useTranslations(translations);\n\n const localizationContextValue = useMemo(() => ({ locale, t }), [locale, t]);\n const tooltipLegacyGroupContextValue = useMemo(\n () => ({ disableDelayGroup: setDisableDelayGroup }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [disableDelayGroup],\n );\n\n return (\n <AnvilProviderContext.Provider value={{ breakpoint }}>\n <ThemeProvider\n className={classNameCombined}\n style={styleCombined}\n theme={themeData?.theme}\n mode={themeData?.mode}\n dir={dir}\n {...rest}\n >\n <TooltipLegacyGroupContext.Provider\n value={tooltipLegacyGroupContextValue}\n >\n <LocalizationContext.Provider value={localizationContextValue}>\n <TrackingProvider scope={scope} optOut={optOut}>\n {children}\n </TrackingProvider>\n </LocalizationContext.Provider>\n </TooltipLegacyGroupContext.Provider>\n </ThemeProvider>\n </AnvilProviderContext.Provider>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAeO,MAAM,aAAA,GAAgB,CAAC,KAAA,KAA8B;AAC1D,EAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AAEjE,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,gBAAA;AAAA,IACA,cAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,cAAA;AAEJ,EAAA,MAAM;AAAA,IACJ,MAAA,GAAS,IAAA;AAAA,IACT,GAAA,GAAM,KAAA;AAAA,IACN,eAAe;AAAC,GAClB,GAAI,oBAAoB,EAAC;AAEzB,EAAA,MAAM,EAAE,KAAA,GAAQ,IAAA,EAAM,MAAA,EAAO,GAAI,kBAAkB,EAAC;AAEpD,EAAA,MAAM,oBAAoB,EAAA,CAAG,SAAA,EAAW,CAAC,WAAA,CAAY,YAAY,CAAC,CAAA,EAAG;AAAA,IACnE,CAAC,WAAA,CAAY,WAAW,CAAC,GAAG,WAAW,IAAA,KAAS,MAAA;AAAA,IAChD,CAAC,WAAA,CAAY,YAAY,CAAC,GAAG,WAAW,IAAA,KAAS;AAAA,GAClD,CAAA;AACD,EAAA,MAAM,aAAA,GAAgB;AAAA,IACpB,GAAG,KAAA;AAAA,IACH,GAAG;AAAA,GACL;AAEA,EAAA,MAAM,aAAa,aAAA,EAAc;AAEjC,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,SAAS,KAAK,CAAA;AAEhE,EAAA,MAAM,EAAE,YAAA,EAAc,CAAA,EAAE,GAAI,gBAAgB,YAAY,CAAA;AAExD,EAAA,MAAM,wBAAA,GAA2B,OAAA,CAAQ,OAAO,EAAE,MAAA,EAAQ,GAAE,CAAA,EAAI,CAAC,MAAA,EAAQ,CAAC,CAAC,CAAA;AAC3E,EAAA,MAAM,8BAAA,GAAiC,OAAA;AAAA,IACrC,OAAO,EAAE,iBAAA,EAAmB,oBAAA,EAAqB,CAAA;AAAA;AAAA,IAEjD,CAAC,iBAAiB;AAAA,GACpB;AAEA,EAAA,2BACG,oBAAA,CAAqB,QAAA,EAArB,EAA8B,KAAA,EAAO,EAAE,YAAW,EACjD,QAAA,kBAAA,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,iBAAA;AAAA,MACX,KAAA,EAAO,aAAA;AAAA,MACP,OAAO,SAAA,EAAW,KAAA;AAAA,MAClB,MAAM,SAAA,EAAW,IAAA;AAAA,MACjB,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAAC,yBAAA,CAA0B,QAAA;AAAA,QAA1B;AAAA,UACC,KAAA,EAAO,8BAAA;AAAA,UAEP,QAAA,kBAAA,GAAA,CAAC,mBAAA,CAAoB,QAAA,EAApB,EAA6B,KAAA,EAAO,wBAAA,EACnC,QAAA,kBAAA,GAAA,CAAC,gBAAA,EAAA,EAAiB,KAAA,EAAc,MAAA,EAC7B,QAAA,EACH,CAAA,EACF;AAAA;AAAA;AACF;AAAA,GACF,EACF,CAAA;AAEJ;;;;"}
|
package/dist/AnvilProvider.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { A as AnvilProvider, A as default } from './AnvilProvider-
|
|
1
|
+
export { A as AnvilProvider, A as default } from './AnvilProvider-0P4WQf5C.js';
|
|
2
2
|
export { A as AnvilProviderContext } from './AnvilProviderContext-B5CU2cEi.js';
|
|
3
3
|
//# sourceMappingURL=AnvilProvider.js.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { A as AvatarGroup, a as Avatar$1 } from './Avatar-
|
|
2
|
+
import { A as AvatarGroup, a as Avatar$1 } from './Avatar-DQN2dNgB.js';
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
4
|
|
|
5
5
|
const AvatarElement = forwardRef(
|
|
@@ -32,4 +32,4 @@ const Avatar = Object.assign(AvatarElement, {
|
|
|
32
32
|
});
|
|
33
33
|
|
|
34
34
|
export { Avatar as A };
|
|
35
|
-
//# sourceMappingURL=Avatar-
|
|
35
|
+
//# sourceMappingURL=Avatar-B4RLfLCS.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar-
|
|
1
|
+
{"version":3,"file":"Avatar-B4RLfLCS.js","sources":["../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import {\n Avatar as CoreAvatar,\n AvatarProps as CoreAvatarProps,\n} from \"./internal/Avatar\";\nimport { Ref, forwardRef } from \"react\";\nimport { DistributiveOmit } from \"../../types\";\nimport { AvatarGroup } from \"./AvatarGroup\";\n\n/**\n * Props for the Avatar component\n * @property {string} name - Full name used for alt text and screen reader\n * @property {string} [color] - Custom color of the Avatar\n * @property {string} [image] - Image source to be used for Avatar\n * @property {\"small\" | \"medium\" | \"large\"} [size] - Size of the Avatar\n * @property {\"online\" | \"offline\"} [status] - Online status of the Avatar\n * @extends ComponentPropsWithoutRef<\"span\">\n * @extends Omit<AvatarBaseProps, \"initials\">\n * @extends Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\">\n * @extends DataTrackingId\n */\nexport type AvatarProps = DistributiveOmit<CoreAvatarProps, \"size\"> & {\n size?: Extract<CoreAvatarProps[\"size\"], \"small\" | \"medium\" | \"large\">;\n};\n\n/**\n * Avatar component for displaying user avatars with initials or images.\n *\n * Features:\n * - Displays user initials when no image is provided\n * - Supports custom colors and sizes\n * - Shows online/offline status\n * - Fully accessible with screen reader support\n * - Automatic image fallback handling\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Avatar name=\"John Doe\" size=\"medium\" status=\"online\" />\n */\nconst AvatarElement = forwardRef(\n (props: AvatarProps, ref: Ref<HTMLSpanElement>) => {\n return <CoreAvatar ref={ref} {...props} />;\n },\n);\nAvatarElement.displayName = CoreAvatar.displayName;\n\nexport const Avatar = Object.assign(AvatarElement, {\n /**\n * AvatarGroup component for displaying multiple avatars in a group.\n *\n * Features:\n * - Displays multiple avatars in a stacked layout\n * - Handles overflow with a count indicator\n * - Maintains consistent sizing across all avatars\n * - Supports custom styling and layout\n * - Automatically adjusts z-index for proper stacking\n * - Fully accessible with screen reader support\n *\n * @example\n * <Avatar.Group max={3}>\n * <Avatar name=\"John Doe\" />\n * <Avatar name=\"Jane Smith\" />\n * <Avatar name=\"Bob Johnson\" />\n * <Avatar name=\"Alice Brown\" />\n * </Avatar.Group>\n */\n Group: AvatarGroup,\n});\n"],"names":["CoreAvatar"],"mappings":";;;;AAsCA,MAAM,aAAA,GAAgB,UAAA;AAAA,EACpB,CAAC,OAAoB,GAAA,KAA8B;AACjD,IAAA,uBAAO,GAAA,CAACA,QAAA,EAAA,EAAW,GAAA,EAAW,GAAG,KAAA,EAAO,CAAA;AAAA,EAC1C;AACF,CAAA;AACA,aAAA,CAAc,cAAcA,QAAA,CAAW,WAAA;AAEhC,MAAM,MAAA,GAAS,MAAA,CAAO,MAAA,CAAO,aAAA,EAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBjD,KAAA,EAAO;AACT,CAAC;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { forwardRef, useRef, useState, useContext, useMemo, useEffect, Children, isValidElement, cloneElement } from 'react';
|
|
3
|
-
import { c as cx } from './index-
|
|
3
|
+
import { c as cx } from './index-SvGbrGuT.js';
|
|
4
4
|
import { u as useAccessibleColor, t as tinycolor } from './useAccessibleColor-BYKjkGRg.js';
|
|
5
|
-
import { S as SrOnly } from './SrOnly-
|
|
5
|
+
import { S as SrOnly } from './SrOnly-CrdBTl6E.js';
|
|
6
6
|
import { T as ThemeProviderContext } from './ThemeProviderContext-l52GohYT.js';
|
|
7
7
|
import { u as usePrefersColorScheme } from './usePrefersColorScheme-_hT7dK7_.js';
|
|
8
8
|
import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
|
|
@@ -253,4 +253,4 @@ const Avatar = Object.assign(AvatarElement, {
|
|
|
253
253
|
});
|
|
254
254
|
|
|
255
255
|
export { AvatarGroup as A, Avatar as a };
|
|
256
|
-
//# sourceMappingURL=Avatar-
|
|
256
|
+
//# sourceMappingURL=Avatar-DQN2dNgB.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar-gtxslf5v.js","sources":["../src/internal/functions/getInitial.ts","../src/components/Avatar/internal/AvatarBase.tsx","../src/components/Avatar/AvatarGroup.tsx","../src/components/Avatar/internal/Avatar.tsx"],"sourcesContent":["/**\n * Extracts initials from a full name string.\n *\n * Features:\n * - Handles single names (returns first two characters)\n * - Handles multiple names (returns first and last name initials)\n * - Automatically capitalizes all initials\n * - Filters out empty strings and whitespace\n * - Handles edge cases like empty names and single characters\n * - Preserves proper capitalization rules\n * - Returns undefined for empty or falsy input\n *\n * @param name - The full name string to extract initials from\n * @returns The initials as a string, or undefined if name is empty\n */\nexport function getInitial(name: string) {\n if (!name) return undefined;\n\n const nameArray = name.split(\" \").filter(Boolean);\n\n if (nameArray.length > 1)\n return `${nameArray[0][0]?.toUpperCase()}${nameArray[\n nameArray.length - 1\n ][0].toUpperCase()}`;\n\n if (nameArray[0][1]) {\n return `${nameArray[0][0].toUpperCase()}${nameArray[0][1].toLowerCase()}`;\n }\n return `${nameArray[0][0].toUpperCase()}`;\n}\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n useContext,\n useRef,\n useState,\n useEffect,\n useMemo,\n} from \"react\";\nimport cx from \"classnames\";\nimport tinycolor from \"tinycolor2\";\n\nimport { LayoutUtilProps, Size } from \"../../../types\";\nimport { SrOnly } from \"../../SrOnly\";\nimport {\n useAccessibleColor,\n useMergeRefs,\n usePrefersColorScheme,\n} from \"../../../hooks\";\n\nimport styles from \"./AvatarBase.module.scss\";\nimport { ThemeProviderContext } from \"../../../providers/ThemeProvider/internal/ThemeProviderContext\";\n\n/**\n * Props for the AvatarBase component\n * @extends ComponentPropsWithoutRef<\"span\">\n * @extends Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\">\n */\nexport type AvatarBaseProps = ComponentPropsWithoutRef<\"span\"> &\n Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\"> & {\n /**\n * Full name\n * @accessibility This is used for alt text and Screenreader\n */\n name: string;\n /**\n * Custom color of the AvatarBase\n */\n color?: string;\n /**\n * Image source to be used for AvatarBase\n */\n image?: string;\n /**\n * Initials to display if no image is provided\n */\n initials?: string;\n /**\n * @default medium\n */\n size?: Extract<Size, \"xsmall\" | \"small\" | \"medium\" | \"large\">;\n /**\n * Online status of the AvatarBase\n */\n status?: \"online\" | \"offline\";\n };\n\n/**\n * Base Avatar component that handles the core avatar functionality.\n *\n * Features:\n * - Renders user avatars with images or initials\n * - Supports custom colors with accessible contrast\n * - Shows online/offline status indicator\n * - Handles image loading errors gracefully\n * - Supports light and dark themes\n * - Fully accessible with screen reader support\n *\n * @example\n * <AvatarBase name=\"John Doe\" size=\"medium\" status=\"online\" />\n */\nexport const AvatarBase = forwardRef<HTMLSpanElement, AvatarBaseProps>(\n (props, ref) => {\n const {\n className,\n color,\n status,\n name,\n image,\n initials,\n style,\n size,\n ...rest\n } = props;\n\n const elRef = useRef<HTMLSpanElement>(null);\n const imgRef = useRef<HTMLImageElement>(null);\n const [hasImageErrored, setHasImageErrored] = useState(false);\n const avatarBaseClassNames = cx(styles[\"avatar-base\"], className, {\n [styles[`${size}`]]: size,\n });\n const onlineIndicatorClassNames = cx(styles[\"indicator\"], {\n [styles[\"offline\"]]: !status || status === \"offline\",\n [styles[\"online\"]]: status && status === \"online\",\n });\n\n const { mode: themeMode } = useContext(ThemeProviderContext);\n const { mode: sysMode } = usePrefersColorScheme();\n const mode = themeMode ?? sysMode;\n\n const { foreground, background, border } = useAccessibleColor(color, mode);\n\n const styleWithColor = {\n \"--int-bg-color\": color && background,\n \"--int-font-color\": color && foreground,\n \"--int-border-color\": color && border,\n ...style,\n };\n\n const onlineIndicatorBorderColor = useMemo(() => {\n if (mode === \"dark\") {\n if (color) {\n return tinycolor(background).brighten(20).toHexString();\n }\n }\n return \"var(--background-color)\";\n }, [color, mode, background]);\n\n const onlineIndicatorStyles = {\n \"--int-border-color\": onlineIndicatorBorderColor,\n } as React.CSSProperties;\n\n const onlineString = status;\n const srOnly = [name, onlineString].filter(Boolean).join(\" \");\n\n // if the image prop updates, also reset the error state for the new image\n useEffect(() => {\n if (image) {\n setHasImageErrored(false);\n }\n }, [image]);\n\n // if the image is already complete on our first render (likely due to SSR),\n // check the error state of the already complete image\n useEffect(() => {\n if (image && imgRef.current && imgRef.current.complete) {\n const img = new Image();\n img.onerror = () => setHasImageErrored(true);\n img.src = image;\n }\n }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <span\n className={avatarBaseClassNames}\n style={styleWithColor}\n data-anv=\"avatarBase\"\n {...rest}\n ref={useMergeRefs([elRef, ref])}\n >\n {image && !hasImageErrored ? (\n <img\n className={styles[\"img\"]}\n aria-hidden\n src={image}\n alt={name}\n onError={() => setHasImageErrored(true)}\n ref={imgRef}\n />\n ) : initials ? (\n <span className={styles[\"initial\"]} aria-hidden>\n {initials}\n </span>\n ) : (\n <span aria-hidden>?</span>\n )}\n\n {status && (\n <span\n aria-hidden\n className={onlineIndicatorClassNames}\n style={onlineIndicatorStyles}\n />\n )}\n\n <SrOnly>{srOnly}</SrOnly>\n </span>\n );\n },\n);\n\nAvatarBase.displayName = \"AvatarBase\";\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n Children,\n isValidElement,\n cloneElement,\n CSSProperties,\n ReactElement,\n} from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./AvatarGroup.module.scss\";\nimport avatarBaseStyles from \"./internal/AvatarBase.module.scss\";\nimport type { LayoutUtilProps } from \"../../types\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { AvatarBase } from \"./internal/AvatarBase\";\n\n/**\n * Props for the AvatarGroup component\n * @property {number} [max] - Maximum number of avatars to display before truncating\n * @extends LayoutUtilProps\n * @extends ComponentPropsWithoutRef<\"span\">\n */\nexport type AvatarGroupProps = LayoutUtilProps &\n ComponentPropsWithoutRef<\"span\"> & {\n /**\n * Max child to show before truncating\n */\n max?: number;\n };\n\n/**\n * AvatarGroup component for displaying multiple avatars in a group.\n *\n * Features:\n * - Displays multiple avatars in a stacked layout\n * - Handles overflow with a count indicator\n * - Maintains consistent sizing across all avatars\n * - Supports custom styling and layout\n * - Automatically adjusts z-index for proper stacking\n * - Fully accessible with screen reader support\n *\n * @example\n * <Avatar.Group max={3}>\n * <Avatar name=\"John Doe\" />\n * <Avatar name=\"Jane Smith\" />\n * <Avatar name=\"Bob Johnson\" />\n * <Avatar name=\"Alice Brown\" />\n * </Avatar.Group>\n */\nexport const AvatarGroup = forwardRef<HTMLSpanElement, AvatarGroupProps>(\n (props, ref) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const { className, max, style, children, ...rest } = componentProps;\n const childrenArr = Children.toArray(children);\n const inferredSize =\n (isValidElement(childrenArr[0]) && childrenArr[0].props.size) ?? \"medium\";\n const isOverflowing = max ? max < childrenArr.length : false;\n\n const overflowCount = max && childrenArr.length - max;\n\n const avatarGroupClassNames = cx(styles[\"avatar-group\"], className, {\n [styles[`${inferredSize}`]]: inferredSize,\n });\n\n const avatarBaseOverflowClassNames = cx(\n avatarBaseStyles[\"avatar-base-overflow\"],\n {\n [avatarBaseStyles[\"overflow-ten-plus\"]]:\n overflowCount && overflowCount > 9,\n },\n );\n\n const styleCombined = {\n ...style,\n ...layoutStyles,\n };\n return (\n <span\n ref={ref}\n className={avatarGroupClassNames}\n style={styleCombined}\n data-anv=\"avatar-group\"\n {...rest}\n >\n {childrenArr.map((child, i) => {\n let childEl = child;\n if (isValidElement(child)) {\n const nIndex = childrenArr.length - i;\n const nStyle: CSSProperties = {\n ...child.props.style,\n zIndex: nIndex,\n };\n childEl = cloneElement(child as ReactElement, {\n style: nStyle,\n });\n }\n\n if (!max) return childEl;\n if (i < max) return childEl;\n return null;\n })}\n {isOverflowing && max && (\n <AvatarBase\n className={avatarBaseOverflowClassNames}\n name={`+${overflowCount}`}\n initials={`+${overflowCount}`}\n size={inferredSize}\n />\n )}\n </span>\n );\n },\n);\n\nAvatarGroup.displayName = \"AvatarGroup\";\n","import { ComponentPropsWithoutRef, forwardRef, useMemo } from \"react\";\nimport { AvatarGroup } from \"../AvatarGroup\";\nimport { LayoutUtilProps } from \"../../../types\";\nimport { getInitial } from \"../../../internal/functions\";\n\nimport { useLayoutPropsUtil } from \"../../../internal/hooks\";\nimport { AvatarBase, AvatarBaseProps } from \"./AvatarBase\";\n\n/**\n * Props for the Avatar component\n * @property {string} name - Full name of the user. Used for alt text and screen reader announcements\n * @property {string} [color] - Custom color of the avatar. Should maintain sufficient contrast ratio for accessibility\n * @property {string} [image] - Image source to be used for avatar. Falls back to initials if image fails to load\n * @property {Extract<Size, \"small\" | \"medium\" | \"large\">} [size] - Size of the Avatar\n * @property {\"online\" | \"offline\"} [status] - Online status of the Avatar\n * @extends ComponentPropsWithoutRef<\"span\">\n * @extends Omit<AvatarBaseProps, \"initials\">\n * @extends Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\">\n */\nexport type AvatarProps = ComponentPropsWithoutRef<\"span\"> &\n Omit<AvatarBaseProps, \"initials\"> &\n Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\">;\n\nconst AvatarElement = forwardRef<HTMLSpanElement, AvatarProps>((props, ref) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const { name, style, ...rest } = componentProps;\n\n const styleWithLayout = useMemo(() => {\n return {\n ...layoutStyles,\n ...style,\n };\n }, [layoutStyles, style]);\n\n const initials = getInitial(name);\n\n return (\n <AvatarBase\n style={styleWithLayout}\n data-anv=\"avatar\"\n name={name}\n ref={ref}\n initials={rest.size === \"small\" ? initials?.[0] : initials}\n {...rest}\n />\n );\n});\n\nAvatarElement.displayName = \"Avatar\";\n\n/**\n * Avatar component for displaying user avatars with initials or images.\n *\n * Features:\n * - Displays user initials when no image is provided\n * - Supports custom colors and sizes\n * - Shows online/offline status\n * - Fully accessible with screen reader support\n * - Automatic image fallback handling\n * - Supports layout utilities for positioning and spacing\n *\n * @example\n * <Avatar\n * name=\"John Doe\"\n * image=\"https://example.com/avatar.jpg\"\n * size=\"medium\"\n * status=\"online\"\n * />\n */\nexport const Avatar = Object.assign(AvatarElement, {\n /**\n * AvatarGroup component for displaying multiple avatars in a group.\n *\n * Features:\n * - Displays multiple avatars in a stacked layout\n * - Handles overflow with a count indicator\n * - Maintains consistent sizing across all avatars\n * - Supports custom styling and layout\n * - Automatically adjusts z-index for proper stacking\n * - Fully accessible with screen reader support\n *\n * @example\n * <Avatar.Group max={3}>\n * <Avatar name=\"John Doe\" />\n * <Avatar name=\"Jane Smith\" />\n * <Avatar name=\"Bob Johnson\" />\n * <Avatar name=\"Alice Brown\" />\n * </Avatar.Group>\n */\n Group: AvatarGroup,\n});\n"],"names":["styles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Avatar-DQN2dNgB.js","sources":["../src/internal/functions/getInitial.ts","../src/components/Avatar/internal/AvatarBase.tsx","../src/components/Avatar/AvatarGroup.tsx","../src/components/Avatar/internal/Avatar.tsx"],"sourcesContent":["/**\n * Extracts initials from a full name string.\n *\n * Features:\n * - Handles single names (returns first two characters)\n * - Handles multiple names (returns first and last name initials)\n * - Automatically capitalizes all initials\n * - Filters out empty strings and whitespace\n * - Handles edge cases like empty names and single characters\n * - Preserves proper capitalization rules\n * - Returns undefined for empty or falsy input\n *\n * @param name - The full name string to extract initials from\n * @returns The initials as a string, or undefined if name is empty\n */\nexport function getInitial(name: string) {\n if (!name) return undefined;\n\n const nameArray = name.split(\" \").filter(Boolean);\n\n if (nameArray.length > 1)\n return `${nameArray[0][0]?.toUpperCase()}${nameArray[\n nameArray.length - 1\n ][0].toUpperCase()}`;\n\n if (nameArray[0][1]) {\n return `${nameArray[0][0].toUpperCase()}${nameArray[0][1].toLowerCase()}`;\n }\n return `${nameArray[0][0].toUpperCase()}`;\n}\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n useContext,\n useRef,\n useState,\n useEffect,\n useMemo,\n} from \"react\";\nimport cx from \"classnames\";\nimport tinycolor from \"tinycolor2\";\n\nimport { LayoutUtilProps, Size } from \"../../../types\";\nimport { SrOnly } from \"../../SrOnly\";\nimport {\n useAccessibleColor,\n useMergeRefs,\n usePrefersColorScheme,\n} from \"../../../hooks\";\n\nimport styles from \"./AvatarBase.module.scss\";\nimport { ThemeProviderContext } from \"../../../providers/ThemeProvider/internal/ThemeProviderContext\";\n\n/**\n * Props for the AvatarBase component\n * @extends ComponentPropsWithoutRef<\"span\">\n * @extends Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\">\n */\nexport type AvatarBaseProps = ComponentPropsWithoutRef<\"span\"> &\n Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\"> & {\n /**\n * Full name\n * @accessibility This is used for alt text and Screenreader\n */\n name: string;\n /**\n * Custom color of the AvatarBase\n */\n color?: string;\n /**\n * Image source to be used for AvatarBase\n */\n image?: string;\n /**\n * Initials to display if no image is provided\n */\n initials?: string;\n /**\n * @default medium\n */\n size?: Extract<Size, \"xsmall\" | \"small\" | \"medium\" | \"large\">;\n /**\n * Online status of the AvatarBase\n */\n status?: \"online\" | \"offline\";\n };\n\n/**\n * Base Avatar component that handles the core avatar functionality.\n *\n * Features:\n * - Renders user avatars with images or initials\n * - Supports custom colors with accessible contrast\n * - Shows online/offline status indicator\n * - Handles image loading errors gracefully\n * - Supports light and dark themes\n * - Fully accessible with screen reader support\n *\n * @example\n * <AvatarBase name=\"John Doe\" size=\"medium\" status=\"online\" />\n */\nexport const AvatarBase = forwardRef<HTMLSpanElement, AvatarBaseProps>(\n (props, ref) => {\n const {\n className,\n color,\n status,\n name,\n image,\n initials,\n style,\n size,\n ...rest\n } = props;\n\n const elRef = useRef<HTMLSpanElement>(null);\n const imgRef = useRef<HTMLImageElement>(null);\n const [hasImageErrored, setHasImageErrored] = useState(false);\n const avatarBaseClassNames = cx(styles[\"avatar-base\"], className, {\n [styles[`${size}`]]: size,\n });\n const onlineIndicatorClassNames = cx(styles[\"indicator\"], {\n [styles[\"offline\"]]: !status || status === \"offline\",\n [styles[\"online\"]]: status && status === \"online\",\n });\n\n const { mode: themeMode } = useContext(ThemeProviderContext);\n const { mode: sysMode } = usePrefersColorScheme();\n const mode = themeMode ?? sysMode;\n\n const { foreground, background, border } = useAccessibleColor(color, mode);\n\n const styleWithColor = {\n \"--int-bg-color\": color && background,\n \"--int-font-color\": color && foreground,\n \"--int-border-color\": color && border,\n ...style,\n };\n\n const onlineIndicatorBorderColor = useMemo(() => {\n if (mode === \"dark\") {\n if (color) {\n return tinycolor(background).brighten(20).toHexString();\n }\n }\n return \"var(--background-color)\";\n }, [color, mode, background]);\n\n const onlineIndicatorStyles = {\n \"--int-border-color\": onlineIndicatorBorderColor,\n } as React.CSSProperties;\n\n const onlineString = status;\n const srOnly = [name, onlineString].filter(Boolean).join(\" \");\n\n // if the image prop updates, also reset the error state for the new image\n useEffect(() => {\n if (image) {\n setHasImageErrored(false);\n }\n }, [image]);\n\n // if the image is already complete on our first render (likely due to SSR),\n // check the error state of the already complete image\n useEffect(() => {\n if (image && imgRef.current && imgRef.current.complete) {\n const img = new Image();\n img.onerror = () => setHasImageErrored(true);\n img.src = image;\n }\n }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <span\n className={avatarBaseClassNames}\n style={styleWithColor}\n data-anv=\"avatarBase\"\n {...rest}\n ref={useMergeRefs([elRef, ref])}\n >\n {image && !hasImageErrored ? (\n <img\n className={styles[\"img\"]}\n aria-hidden\n src={image}\n alt={name}\n onError={() => setHasImageErrored(true)}\n ref={imgRef}\n />\n ) : initials ? (\n <span className={styles[\"initial\"]} aria-hidden>\n {initials}\n </span>\n ) : (\n <span aria-hidden>?</span>\n )}\n\n {status && (\n <span\n aria-hidden\n className={onlineIndicatorClassNames}\n style={onlineIndicatorStyles}\n />\n )}\n\n <SrOnly>{srOnly}</SrOnly>\n </span>\n );\n },\n);\n\nAvatarBase.displayName = \"AvatarBase\";\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n Children,\n isValidElement,\n cloneElement,\n CSSProperties,\n ReactElement,\n} from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./AvatarGroup.module.scss\";\nimport avatarBaseStyles from \"./internal/AvatarBase.module.scss\";\nimport type { LayoutUtilProps } from \"../../types\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { AvatarBase } from \"./internal/AvatarBase\";\n\n/**\n * Props for the AvatarGroup component\n * @property {number} [max] - Maximum number of avatars to display before truncating\n * @extends LayoutUtilProps\n * @extends ComponentPropsWithoutRef<\"span\">\n */\nexport type AvatarGroupProps = LayoutUtilProps &\n ComponentPropsWithoutRef<\"span\"> & {\n /**\n * Max child to show before truncating\n */\n max?: number;\n };\n\n/**\n * AvatarGroup component for displaying multiple avatars in a group.\n *\n * Features:\n * - Displays multiple avatars in a stacked layout\n * - Handles overflow with a count indicator\n * - Maintains consistent sizing across all avatars\n * - Supports custom styling and layout\n * - Automatically adjusts z-index for proper stacking\n * - Fully accessible with screen reader support\n *\n * @example\n * <Avatar.Group max={3}>\n * <Avatar name=\"John Doe\" />\n * <Avatar name=\"Jane Smith\" />\n * <Avatar name=\"Bob Johnson\" />\n * <Avatar name=\"Alice Brown\" />\n * </Avatar.Group>\n */\nexport const AvatarGroup = forwardRef<HTMLSpanElement, AvatarGroupProps>(\n (props, ref) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const { className, max, style, children, ...rest } = componentProps;\n const childrenArr = Children.toArray(children);\n const inferredSize =\n (isValidElement(childrenArr[0]) && childrenArr[0].props.size) ?? \"medium\";\n const isOverflowing = max ? max < childrenArr.length : false;\n\n const overflowCount = max && childrenArr.length - max;\n\n const avatarGroupClassNames = cx(styles[\"avatar-group\"], className, {\n [styles[`${inferredSize}`]]: inferredSize,\n });\n\n const avatarBaseOverflowClassNames = cx(\n avatarBaseStyles[\"avatar-base-overflow\"],\n {\n [avatarBaseStyles[\"overflow-ten-plus\"]]:\n overflowCount && overflowCount > 9,\n },\n );\n\n const styleCombined = {\n ...style,\n ...layoutStyles,\n };\n return (\n <span\n ref={ref}\n className={avatarGroupClassNames}\n style={styleCombined}\n data-anv=\"avatar-group\"\n {...rest}\n >\n {childrenArr.map((child, i) => {\n let childEl = child;\n if (isValidElement(child)) {\n const nIndex = childrenArr.length - i;\n const nStyle: CSSProperties = {\n ...child.props.style,\n zIndex: nIndex,\n };\n childEl = cloneElement(child as ReactElement, {\n style: nStyle,\n });\n }\n\n if (!max) return childEl;\n if (i < max) return childEl;\n return null;\n })}\n {isOverflowing && max && (\n <AvatarBase\n className={avatarBaseOverflowClassNames}\n name={`+${overflowCount}`}\n initials={`+${overflowCount}`}\n size={inferredSize}\n />\n )}\n </span>\n );\n },\n);\n\nAvatarGroup.displayName = \"AvatarGroup\";\n","import { ComponentPropsWithoutRef, forwardRef, useMemo } from \"react\";\nimport { AvatarGroup } from \"../AvatarGroup\";\nimport { LayoutUtilProps } from \"../../../types\";\nimport { getInitial } from \"../../../internal/functions\";\n\nimport { useLayoutPropsUtil } from \"../../../internal/hooks\";\nimport { AvatarBase, AvatarBaseProps } from \"./AvatarBase\";\n\n/**\n * Props for the Avatar component\n * @property {string} name - Full name of the user. Used for alt text and screen reader announcements\n * @property {string} [color] - Custom color of the avatar. Should maintain sufficient contrast ratio for accessibility\n * @property {string} [image] - Image source to be used for avatar. Falls back to initials if image fails to load\n * @property {Extract<Size, \"small\" | \"medium\" | \"large\">} [size] - Size of the Avatar\n * @property {\"online\" | \"offline\"} [status] - Online status of the Avatar\n * @extends ComponentPropsWithoutRef<\"span\">\n * @extends Omit<AvatarBaseProps, \"initials\">\n * @extends Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\">\n */\nexport type AvatarProps = ComponentPropsWithoutRef<\"span\"> &\n Omit<AvatarBaseProps, \"initials\"> &\n Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\">;\n\nconst AvatarElement = forwardRef<HTMLSpanElement, AvatarProps>((props, ref) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const { name, style, ...rest } = componentProps;\n\n const styleWithLayout = useMemo(() => {\n return {\n ...layoutStyles,\n ...style,\n };\n }, [layoutStyles, style]);\n\n const initials = getInitial(name);\n\n return (\n <AvatarBase\n style={styleWithLayout}\n data-anv=\"avatar\"\n name={name}\n ref={ref}\n initials={rest.size === \"small\" ? initials?.[0] : initials}\n {...rest}\n />\n );\n});\n\nAvatarElement.displayName = \"Avatar\";\n\n/**\n * Avatar component for displaying user avatars with initials or images.\n *\n * Features:\n * - Displays user initials when no image is provided\n * - Supports custom colors and sizes\n * - Shows online/offline status\n * - Fully accessible with screen reader support\n * - Automatic image fallback handling\n * - Supports layout utilities for positioning and spacing\n *\n * @example\n * <Avatar\n * name=\"John Doe\"\n * image=\"https://example.com/avatar.jpg\"\n * size=\"medium\"\n * status=\"online\"\n * />\n */\nexport const Avatar = Object.assign(AvatarElement, {\n /**\n * AvatarGroup component for displaying multiple avatars in a group.\n *\n * Features:\n * - Displays multiple avatars in a stacked layout\n * - Handles overflow with a count indicator\n * - Maintains consistent sizing across all avatars\n * - Supports custom styling and layout\n * - Automatically adjusts z-index for proper stacking\n * - Fully accessible with screen reader support\n *\n * @example\n * <Avatar.Group max={3}>\n * <Avatar name=\"John Doe\" />\n * <Avatar name=\"Jane Smith\" />\n * <Avatar name=\"Bob Johnson\" />\n * <Avatar name=\"Alice Brown\" />\n * </Avatar.Group>\n */\n Group: AvatarGroup,\n});\n"],"names":["styles"],"mappings":"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"}
|
package/dist/Avatar.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { A as Avatar, A as default } from './Avatar-
|
|
2
|
-
export { A as AvatarGroup } from './Avatar-
|
|
1
|
+
export { A as Avatar, A as default } from './Avatar-B4RLfLCS.js';
|
|
2
|
+
export { A as AvatarGroup } from './Avatar-DQN2dNgB.js';
|
|
3
3
|
//# sourceMappingURL=Avatar.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
|
-
import { c as cx } from './index-
|
|
4
|
-
import { S as SrOnly } from './SrOnly-
|
|
3
|
+
import { c as cx } from './index-SvGbrGuT.js';
|
|
4
|
+
import { S as SrOnly } from './SrOnly-CrdBTl6E.js';
|
|
5
5
|
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
|
|
6
6
|
|
|
7
7
|
import './Badge.css';const badge = "_badge_1rwnm_2";
|
|
@@ -50,4 +50,4 @@ const Badge = forwardRef((props, ref) => {
|
|
|
50
50
|
Badge.displayName = "Badge";
|
|
51
51
|
|
|
52
52
|
export { Badge as B };
|
|
53
|
-
//# sourceMappingURL=Badge-
|
|
53
|
+
//# sourceMappingURL=Badge-BrysDYfx.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge-
|
|
1
|
+
{"version":3,"file":"Badge-BrysDYfx.js","sources":["../src/components/Badge/Badge.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./Badge.module.scss\";\nimport { SrOnly } from \"../SrOnly\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { LayoutUtilProps } from \"../../types\";\n\n/**\n * Props for the Badge component\n * @extends ComponentPropsWithoutRef<\"sup\">\n * @extends Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\">\n */\nexport type BadgeProps = ComponentPropsWithoutRef<\"sup\"> &\n Omit<LayoutUtilProps, \"flex\" | \"flexBasis\" | \"flexGrow\" | \"flexShrink\"> & {\n /**\n * Optional offset configuration for badge positioning\n */\n offset?: {\n /**\n * Horizontal offset from the default position\n * @default \"0px\"\n */\n x?: string;\n /**\n * Vertical offset from the default position\n * @default \"0px\"\n */\n y?: string;\n };\n };\n\n/**\n * Badge component for displaying small status indicators or counts.\n *\n * Features:\n * - Positioned as a superscript element\n * - Customizable offset positioning\n * - Screen reader support with aria-label\n * - Empty state styling when no content\n * - Supports layout utilities for positioning\n * - Accessible with proper ARIA roles\n *\n * @example\n * <Button>\n * Notifications\n * <Badge aria-label=\"3 new messages\">3</Badge>\n * </Button>\n */\nexport const Badge = forwardRef<HTMLScriptElement, BadgeProps>((props, ref) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const {\n offset,\n children,\n style,\n className,\n \"aria-label\": ariaLabel,\n ...rest\n } = componentProps;\n const classNames = cx(styles[\"badge\"], className, {\n [styles.empty]: !children,\n });\n const offsetX = offset?.x ?? `0px`;\n const offsetY = offset?.y ?? `0px`;\n const iStyle = {\n ...style,\n ...layoutStyles,\n \"--offsetY\": offsetY,\n \"--offsetX\": offsetX,\n };\n\n return (\n <sup\n className={classNames}\n style={iStyle}\n data-anv=\"badge\"\n {...rest}\n ref={ref}\n >\n <SrOnly>{ariaLabel}</SrOnly>\n {children}\n </sup>\n );\n});\nBadge.displayName = \"Badge\";\n"],"names":[],"mappings":";;;;;;;;;;;;;AAgDO,MAAM,KAAA,GAAQ,UAAA,CAA0C,CAAC,KAAA,EAAO,GAAA,KAAQ;AAC7E,EAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,EAAA,MAAM;AAAA,IACJ,MAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,SAAA;AAAA,IACA,YAAA,EAAc,SAAA;AAAA,IACd,GAAG;AAAA,GACL,GAAI,cAAA;AACJ,EAAA,MAAM,UAAA,GAAa,EAAA,CAAG,MAAA,CAAO,OAAO,GAAG,SAAA,EAAW;AAAA,IAChD,CAAC,MAAA,CAAO,KAAK,GAAG,CAAC;AAAA,GAClB,CAAA;AACD,EAAA,MAAM,OAAA,GAAU,QAAQ,CAAA,IAAK,CAAA,GAAA,CAAA;AAC7B,EAAA,MAAM,OAAA,GAAU,QAAQ,CAAA,IAAK,CAAA,GAAA,CAAA;AAC7B,EAAA,MAAM,MAAA,GAAS;AAAA,IACb,GAAG,KAAA;AAAA,IACH,GAAG,YAAA;AAAA,IACH,WAAA,EAAa,OAAA;AAAA,IACb,WAAA,EAAa;AAAA,GACf;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,UAAA;AAAA,MACX,KAAA,EAAO,MAAA;AAAA,MACP,UAAA,EAAS,OAAA;AAAA,MACR,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,UAAQ,QAAA,EAAA,SAAA,EAAU,CAAA;AAAA,QAClB;AAAA;AAAA;AAAA,GACH;AAEJ,CAAC;AACD,KAAA,CAAM,WAAA,GAAc,OAAA;;;;"}
|
package/dist/Badge.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { B as Badge, B as default } from './Badge-
|
|
1
|
+
export { B as Badge, B as default } from './Badge-BrysDYfx.js';
|
|
2
2
|
//# sourceMappingURL=Badge.js.map
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { forwardRef, Children, cloneElement } from 'react';
|
|
4
|
-
import { c as cx } from './index-
|
|
5
|
-
import { L as Link } from './Link-
|
|
4
|
+
import { c as cx } from './index-SvGbrGuT.js';
|
|
5
|
+
import { L as Link } from './Link-Bxzoojbs.js';
|
|
6
6
|
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
|
|
7
|
-
import { T as Text } from './Text-
|
|
8
|
-
import { I as Icon } from './Icon-
|
|
7
|
+
import { T as Text } from './Text-rR4bxNLd.js';
|
|
8
|
+
import { I as Icon } from './Icon-BckjFkbw.js';
|
|
9
9
|
|
|
10
10
|
import './Breadcrumbs.css';const SvgChevronRight = (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: "M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }));
|
|
11
11
|
|
|
@@ -102,4 +102,4 @@ const Breadcrumbs = Object.assign(BreadcrumbsElement, {
|
|
|
102
102
|
});
|
|
103
103
|
|
|
104
104
|
export { Breadcrumbs as B, BreadcrumbsElement as a, BreadcrumbsLink as b };
|
|
105
|
-
//# sourceMappingURL=Breadcrumbs-
|
|
105
|
+
//# sourceMappingURL=Breadcrumbs-S_ffklLw.js.map
|