@servicetitan/anvil2 1.46.7 → 1.46.9
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 +18 -0
- package/dist/{Calendar-BqOvsaby.js → Calendar-BopUjnAk.js} +56 -29
- package/dist/Calendar-BopUjnAk.js.map +1 -0
- package/dist/Calendar.css +64 -48
- package/dist/Calendar.d.ts +3 -3
- package/dist/Calendar.js +9 -1
- package/dist/Calendar.js.map +1 -1
- package/dist/{Combobox-BIBYdOCc.js → Combobox-D4Q9NeVP.js} +15 -15
- package/dist/{Combobox-BIBYdOCc.js.map → Combobox-D4Q9NeVP.js.map} +1 -1
- package/dist/Combobox.js +1 -1
- package/dist/{DateField-BLLbVZBF.js → DateField-B1AdxJKt.js} +4 -4
- package/dist/{DateField-BLLbVZBF.js.map → DateField-B1AdxJKt.js.map} +1 -1
- package/dist/DateField.js +1 -1
- package/dist/{DateFieldRange-BYwuTSkT.js → DateFieldRange-DiNR5bJ6.js} +63 -63
- package/dist/{DateFieldRange-BYwuTSkT.js.map → DateFieldRange-DiNR5bJ6.js.map} +1 -1
- package/dist/DateFieldRange.js +1 -1
- package/dist/{DateFieldSingle-B70fKeo-.js → DateFieldSingle-CTYbquGi.js} +5 -5
- package/dist/{DateFieldSingle-B70fKeo-.js.map → DateFieldSingle-CTYbquGi.js.map} +1 -1
- package/dist/DateFieldSingle.js +1 -1
- package/dist/{DateFieldYearless-BmeKGaDc.js → DateFieldYearless-HrylwnwX.js} +2 -2
- package/dist/{DateFieldYearless-BmeKGaDc.js.map → DateFieldYearless-HrylwnwX.js.map} +1 -1
- package/dist/DateFieldYearless.js +1 -1
- package/dist/{Drawer-C1KtNoLu.js → Drawer-yG7C8Owv.js} +11 -11
- package/dist/{Drawer-C1KtNoLu.js.map → Drawer-yG7C8Owv.js.map} +1 -1
- package/dist/Drawer.css +37 -40
- package/dist/Drawer.js +1 -1
- package/dist/{InputMask-B13KumrK.js → InputMask-BHupXP8N.js} +2 -2
- package/dist/{InputMask-B13KumrK.js.map → InputMask-BHupXP8N.js.map} +1 -1
- package/dist/InputMask.js +1 -1
- package/dist/{ListView-C-cVQZHp.js → ListView-Dsj5MiUx.js} +5 -5
- package/dist/{ListView-C-cVQZHp.js.map → ListView-Dsj5MiUx.js.map} +1 -1
- package/dist/ListView.js +1 -1
- package/dist/{ListView.module-MVsNF0X0.js → ListView.module-BilDg12y.js} +3 -3
- package/dist/ListView.module-BilDg12y.js.map +1 -0
- package/dist/{Listbox-DxGx630W.js → Listbox-CWi30Cwg.js} +9 -9
- package/dist/{Listbox-DxGx630W.js.map → Listbox-CWi30Cwg.js.map} +1 -1
- package/dist/Listbox.js +1 -1
- package/dist/{Listbox.module-DcBE8Zmo.js → Listbox.module-XuKszT3X.js} +3 -3
- package/dist/Listbox.module-XuKszT3X.js.map +1 -0
- package/dist/{Menu-BlHuE7TM.js → Menu-CETp4nrV.js} +2 -1
- package/dist/{Menu-BlHuE7TM.js.map → Menu-CETp4nrV.js.map} +1 -1
- package/dist/Menu.js +1 -1
- package/dist/{NumberField-DWPAy1eG.js → NumberField-lvPAltDB.js} +24 -12
- package/dist/NumberField-lvPAltDB.js.map +1 -0
- package/dist/NumberField.js +1 -1
- package/dist/{Page-DRSFpDAb.js → Page-DAkneNVH.js} +2 -2
- package/dist/{Page-DRSFpDAb.js.map → Page-DAkneNVH.js.map} +1 -1
- package/dist/Page.js +1 -1
- package/dist/{Pagination-UGCNBKo0.js → Pagination-DiLZ3lxt.js} +2 -2
- package/dist/{Pagination-UGCNBKo0.js.map → Pagination-DiLZ3lxt.js.map} +1 -1
- package/dist/Pagination.js +1 -1
- package/dist/{SearchField-CbwGErC4.js → SearchField-DqV9-0wR.js} +8 -8
- package/dist/{SearchField-CbwGErC4.js.map → SearchField-DqV9-0wR.js.map} +1 -1
- package/dist/SearchField.js +1 -1
- package/dist/{Tab-CzNx3IdF.js → Tab-BQ5tMHlN.js} +2 -2
- package/dist/Tab-BQ5tMHlN.js.map +1 -0
- package/dist/Tab.js +1 -1
- package/dist/{TextField-uCHgwO5F.js → TextField-CGfnQPiO.js} +2 -2
- package/dist/{TextField-uCHgwO5F.js.map → TextField-CGfnQPiO.js.map} +1 -1
- package/dist/{TextField-D9gD-34Q.js → TextField-Duo_mY8Y.js} +11 -11
- package/dist/{TextField-D9gD-34Q.js.map → TextField-Duo_mY8Y.js.map} +1 -1
- package/dist/TextField.js +1 -1
- package/dist/{TextField.module-EkKlj66e.js → TextField.module-pD1felN8.js} +3 -3
- package/dist/TextField.module-pD1felN8.js.map +1 -0
- package/dist/{TimeField-CGg_yTaJ.js → TimeField-DohKibUE.js} +3 -3
- package/dist/{TimeField-CGg_yTaJ.js.map → TimeField-DohKibUE.js.map} +1 -1
- package/dist/TimeField.js +1 -1
- package/dist/{Toolbar-B2zhlyBz.js → Toolbar-DbH5zdna.js} +9 -9
- package/dist/{Toolbar-B2zhlyBz.js.map → Toolbar-DbH5zdna.js.map} +1 -1
- package/dist/Toolbar.js +1 -1
- package/dist/beta/components/Calendar/Calendar.d.ts +8 -0
- package/dist/beta/components/Calendar/CalendarBetaPropsContext.d.ts +2 -0
- package/dist/beta/components/Calendar/index.d.ts +2 -0
- package/dist/beta/components/Calendar/useCalendarBetaProps.d.ts +1 -0
- package/dist/beta/components/index.d.ts +1 -0
- package/dist/beta.js +2 -1
- package/dist/beta.js.map +1 -1
- package/dist/components/Calendar/CalendarContext.d.ts +4 -0
- package/dist/components/Calendar/internal/utils.d.ts +1 -0
- package/dist/components/Menu/types.d.ts +2 -1
- package/dist/index.js +19 -19
- package/dist/{utils-Dh3aegV3.js → utils-CskVBG_X.js} +2 -2
- package/dist/{utils-Dh3aegV3.js.map → utils-CskVBG_X.js.map} +1 -1
- package/package.json +2 -5
- package/dist/Calendar-BqOvsaby.js.map +0 -1
- package/dist/ListView.module-MVsNF0X0.js.map +0 -1
- package/dist/Listbox.module-DcBE8Zmo.js.map +0 -1
- package/dist/NumberField-DWPAy1eG.js.map +0 -1
- package/dist/Tab-CzNx3IdF.js.map +0 -1
- package/dist/TextField.module-EkKlj66e.js.map +0 -1
|
@@ -12,25 +12,25 @@ import { u as useDialogTransitionStates, a as useKeyboardFocusables, b as useDia
|
|
|
12
12
|
import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
|
|
13
13
|
import { a as useOnClickOutside } from './useOnClickOutside-C5AZE_I6.js';
|
|
14
14
|
|
|
15
|
-
import './Drawer.css';const drawer = "
|
|
16
|
-
const container = "
|
|
17
|
-
const content = "
|
|
18
|
-
const header = "
|
|
19
|
-
const footer = "
|
|
20
|
-
const remove = "
|
|
21
|
-
const large = "
|
|
22
|
-
const sticky = "
|
|
15
|
+
import './Drawer.css';const drawer = "_drawer_1enz7_2";
|
|
16
|
+
const container = "_container_1enz7_29";
|
|
17
|
+
const content = "_content_1enz7_41";
|
|
18
|
+
const header = "_header_1enz7_47";
|
|
19
|
+
const footer = "_footer_1enz7_70";
|
|
20
|
+
const remove = "_remove_1enz7_87";
|
|
21
|
+
const large = "_large_1enz7_96";
|
|
22
|
+
const sticky = "_sticky_1enz7_99";
|
|
23
23
|
const styles = {
|
|
24
24
|
drawer: drawer,
|
|
25
25
|
container: container,
|
|
26
26
|
content: content,
|
|
27
27
|
header: header,
|
|
28
|
-
"close-container": "_close-
|
|
28
|
+
"close-container": "_close-container_1enz7_63",
|
|
29
29
|
footer: footer,
|
|
30
30
|
remove: remove,
|
|
31
31
|
large: large,
|
|
32
32
|
sticky: sticky,
|
|
33
|
-
"close-button": "_close-
|
|
33
|
+
"close-button": "_close-button_1enz7_105"
|
|
34
34
|
};
|
|
35
35
|
|
|
36
36
|
function useDrawerContext() {
|
|
@@ -367,4 +367,4 @@ const Drawer = Object.assign(DrawerElement, {
|
|
|
367
367
|
});
|
|
368
368
|
|
|
369
369
|
export { Drawer as D, DrawerCancelButton as a, DrawerFooter as b, DrawerHeader as c, DrawerContent as d };
|
|
370
|
-
//# sourceMappingURL=Drawer-
|
|
370
|
+
//# sourceMappingURL=Drawer-yG7C8Owv.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer-C1KtNoLu.js","sources":["../src/components/Drawer/internal/useDrawerContext.ts","../src/components/Drawer/DrawerCancelButton.tsx","../src/components/Drawer/DrawerHeader.tsx","../src/components/Drawer/DrawerFooter.tsx","../src/components/Drawer/DrawerContent.tsx","../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import { useContext } from \"react\";\nimport { DrawerContext } from \"./DrawerContext\";\n\n/**\n * Hook to access the drawer context.\n *\n * @returns The drawer context containing close function and ref\n * @throws Error if used outside of a DrawerContextProvider\n */\nexport function useDrawerContext() {\n const context = useContext(DrawerContext);\n if (!context) {\n throw new Error(\n \"useDrawerContext must be used within a DrawerContextProvider\",\n );\n }\n return context;\n}\n","import { MouseEvent, forwardRef } from \"react\";\nimport { Button, ButtonProps } from \"../Button\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId } from \"../../hooks\";\nimport { useDrawerContext } from \"./internal/useDrawerContext\";\n\n/**\n * Props for the DrawerCancelButton component\n * @extends ButtonProps\n */\nexport type DrawerCancelButtonProps = ButtonProps & DataTrackingId;\n\n/**\n * A button component that automatically closes the drawer when clicked.\n *\n * Features:\n * - Automatically closes the drawer when clicked\n * - Extends Button component functionality\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard button props\n * - Proper focus management\n * - Can be used anywhere within the drawer context\n *\n * @example\n * <DrawerCancelButton appearance=\"ghost\" size=\"small\">\n * Cancel\n * </DrawerCancelButton>\n */\nexport const DrawerCancelButton = forwardRef<\n HTMLButtonElement,\n DrawerCancelButtonProps\n>((props, ref) => {\n const { onClick, ...rest } = props;\n const { close } = useDrawerContext();\n const data = {\n children: childrenToString(props.children),\n appearance: props.appearance,\n size: props.size,\n type: props.type,\n };\n\n const trackingId = useTrackingId({\n name: \"DrawerCancelButton\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const onClickHandler = (e: MouseEvent<HTMLButtonElement>) => {\n onClick?.(e);\n close();\n };\n return (\n <Button\n aria-label=\"Close drawer\"\n data-anv=\"drawer-cancel-button\"\n data-tracking-id={trackingId}\n onClick={onClickHandler}\n ref={ref}\n {...rest}\n />\n );\n});\n\nDrawerCancelButton.displayName = \"DrawerCancelButton\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport styles from \"./Drawer.module.scss\";\nimport { Text } from \"../Text\";\nimport { DrawerCancelButton } from \"./DrawerCancelButton\";\nimport cx from \"classnames\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId } from \"../../hooks\";\n\n/**\n * Props for the DrawerHeader component\n * @extends ComponentPropsWithoutRef<\"header\">\n */\nexport type DrawerHeaderProps = ComponentPropsWithoutRef<\"header\"> &\n DataTrackingId;\n\n/**\n * Header component for the drawer that displays a title and close button.\n *\n * Features:\n * - Displays the drawer title as a headline\n * - Includes an accessible close button\n * - Sticky positioning at the top of the drawer\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Automatic close functionality\n *\n * @example\n * <Drawer.Header>Settings</Drawer.Header>\n */\nexport const DrawerHeader = forwardRef<HTMLHeadElement, DrawerHeaderProps>(\n (props, ref) => {\n const { className, children } = props;\n const data = {\n children: childrenToString(props.children),\n };\n\n const trackingId = useTrackingId({\n name: \"DrawerHeader\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const drawerHeaderClasses = cx(styles.header, className);\n\n return (\n <header\n className={drawerHeaderClasses}\n data-anv=\"drawer-header\"\n data-tracking-id={trackingId}\n ref={ref}\n >\n <Text variant=\"headline\" el=\"h1\">\n {children}\n </Text>\n <span className={styles[\"close-container\"]}>\n <DrawerCancelButton\n className={styles[\"close-button\"]}\n size=\"small\"\n appearance=\"ghost\"\n aria-label=\"Close drawer\"\n data-anv=\"drawer-header-close-button\"\n icon={Close}\n />\n </span>\n </header>\n );\n },\n);\n\nDrawerHeader.displayName = \"DrawerHeader\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport styles from \"./Drawer.module.scss\";\nimport cx from \"classnames\";\n\n/**\n * Props for the DrawerFooter component\n * @extends ComponentPropsWithoutRef<\"footer\">\n */\nexport type DrawerFooterProps = ComponentPropsWithoutRef<\"footer\"> & {\n /**\n * When true, the footer will stick to the bottom of the drawer.\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * Footer component for the drawer that displays action buttons and controls.\n *\n * Features:\n * - Flexible layout for action buttons and controls\n * - Optional sticky positioning at the bottom\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard footer element props\n * - Responsive design that adapts to content\n *\n * @example\n * <Drawer.Footer sticky>\n * <Button onClick={handleSave}>Save</Button>\n * <Button onClick={handleCancel}>Cancel</Button>\n * </Drawer.Footer>\n */\nexport const DrawerFooter = forwardRef<HTMLElement, DrawerFooterProps>(\n (props, ref) => {\n const { className, children, sticky = false, ...rest } = props;\n const drawerFooterClasses = cx(styles.footer, className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n return (\n <footer\n className={drawerFooterClasses}\n data-anv=\"drawer-footer\"\n ref={ref}\n {...rest}\n >\n {children}\n </footer>\n );\n },\n);\n\nDrawerFooter.displayName = \"DrawerFooter\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport styles from \"./Drawer.module.scss\";\nimport cx from \"classnames\";\n\n/**\n * Props for the DrawerContent component\n * @extends ComponentPropsWithoutRef<\"div\">\n */\nexport type DrawerContentProps = ComponentPropsWithoutRef<\"div\">;\n\n/**\n * Content container for the drawer that holds the main content area.\n *\n * Features:\n * - Flexible content area with proper spacing\n * - Scrollable content when needed\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard div element props\n * - Responsive design that adapts to content\n * - Proper focus management\n *\n * @example\n * <Drawer.Content>\n * <p>This is the main content of the drawer.</p>\n * <p>It can contain any type of content.</p>\n * </Drawer.Content>\n */\nexport const DrawerContent = forwardRef<HTMLDivElement, DrawerContentProps>(\n (props, ref) => {\n const { className, children, ...rest } = props;\n const drawerContentClasses = cx(styles.content, className);\n\n return (\n <div\n className={drawerContentClasses}\n data-anv=\"drawer-content\"\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n\nDrawerContent.displayName = \"DrawerContent\";\n","import styles from \"./Drawer.module.scss\";\nimport {\n ComponentPropsWithoutRef,\n forwardRef,\n useRef,\n useId,\n useCallback,\n SyntheticEvent,\n KeyboardEvent,\n useMemo,\n} from \"react\";\nimport { DrawerHeader } from \"./DrawerHeader\";\nimport { DrawerFooter } from \"./DrawerFooter\";\nimport { DrawerContent } from \"./DrawerContent\";\nimport { DrawerCancelButton } from \"./DrawerCancelButton\";\nimport {\n OpenCloseTransitionStateEffects,\n useDialogScrollLock,\n useDialogTransitionStates,\n useKeyboardFocusables,\n useOnClickOutside,\n} from \"../../internal/hooks\";\nimport { DisableCloseOnEscapeOrClickProps, Size } from \"../../types\";\nimport { useMergeRefs } from \"../../hooks\";\nimport cx from \"classnames\";\nimport { ToastProvider } from \"../Toast/internal/ToastProvider\";\nimport { ToasterPopover } from \"../Toast/internal/ToasterPopover\";\nimport { ToasterContent } from \"../Toast/internal/Toaster\";\nimport { DrawerContext } from \"./internal/DrawerContext\";\nimport { FocusableElement } from \"tabbable\";\nimport { useInitialFocus } from \"../Dialog/internal/useInitialFocus\";\n\n/**\n * Props for the Drawer component\n * @extends ComponentPropsWithoutRef<\"dialog\">\n * @extends DialogTransitionStateEffects\n * @extends DisableCloseOnEscapeOrClickProps\n */\nexport type DrawerProps = ComponentPropsWithoutRef<\"dialog\"> &\n OpenCloseTransitionStateEffects &\n DisableCloseOnEscapeOrClickProps & {\n /**\n * The size of the drawer.\n * @default \"medium\"\n */\n size?: Extract<Size, \"medium\" | \"large\">;\n /**\n * Controls whether the drawer is open or closed.\n * @default false\n */\n open?: boolean;\n /**\n * Callback function called after the drawer is animated closed.\n */\n onClose?: () => void;\n /**\n * Callback function called when the drawer opens.\n * @deprecated Use onOpenAnimationStart or onOpenAnimationComplete instead\n */\n onOpen?: () => void;\n /**\n * Callback when clicking outside the drawer\n */\n onClickOutside?: (e: globalThis.MouseEvent) => void;\n /**\n * Enables scroll chaining behavior.\n * @link https://developer.mozilla.org/en-US/docs/Glossary/Scroll_chaining\n */\n enableScrollChaining?: boolean;\n };\n\nconst DrawerElement = forwardRef<HTMLDialogElement, DrawerProps>(\n (props, ref) => {\n const {\n className,\n open = false,\n children,\n onOpen,\n onClose,\n /* eslint-disable-next-line @typescript-eslint/no-unused-vars --\n onCancel is destructured so that it is not passed to the dialog in ...rest\n */\n onCancel,\n onKeyDown,\n disableCloseOnEscape = false,\n onClickOutside,\n disableCloseOnClickOutside = false,\n size = \"medium\",\n enableScrollChaining,\n onOpenAnimationStart,\n onOpenAnimationComplete,\n onCloseAnimationStart,\n onCloseAnimationComplete,\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 combinedRef = useMergeRefs([elRef, ref]);\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 onOpen?.(); // DEPRECATED\n }, [onOpen, onOpenAnimationComplete]),\n onCloseAnimationStart: useCallback(() => {\n onCloseAnimationStart?.();\n }, [onCloseAnimationStart]),\n onCloseAnimationComplete: useCallback(() => {\n onCloseAnimationComplete?.();\n }, [onCloseAnimationComplete]),\n });\n\n const classNames = cx([styles.drawer], className, {\n [styles.remove]: state === \"closing\",\n [styles.large]: size === \"large\",\n });\n\n const { focusables } = useKeyboardFocusables(contentRef, {\n observeChange: false,\n });\n const firstFocusable = focusables?.[0];\n const lastFocusable = focusables?.[focusables.length - 1];\n\n useDialogScrollLock({\n open: isOpenOrOpening,\n id,\n enableScrollChaining,\n elementRef: elRef,\n });\n\n const computeFocus = useCallback((focusables: FocusableElement[]) => {\n return (\n focusables.find(\n (focusable) => focusable.dataset.anv !== \"drawer-header-close-button\",\n ) || focusables[0]\n );\n }, []);\n\n useInitialFocus(elRef, {\n computeFocus,\n });\n\n const onCancelHandler = (e: SyntheticEvent<HTMLDialogElement>) => {\n e.preventDefault();\n\n if (disableCloseOnEscape) return;\n onClose?.();\n };\n\n useOnClickOutside({\n onOutsidePress: (e) => {\n if (!open) return;\n onClickOutside?.(e);\n },\n targets: [\n contentRef.current as HTMLElement,\n toasterRef.current as HTMLElement,\n ],\n onClose: () => {\n if (disableCloseOnClickOutside || !open) return;\n onClose?.();\n },\n });\n\n const onKeyDownHandler = (e: KeyboardEvent<HTMLDialogElement>) => {\n onKeyDown?.(e);\n if (e.code === \"Tab\") {\n if (e.shiftKey && e.target === firstFocusable) {\n e.preventDefault();\n (lastFocusable as HTMLElement)?.focus();\n return;\n }\n if (e.target === lastFocusable && !e.shiftKey) {\n e.preventDefault();\n (firstFocusable as HTMLElement)?.focus();\n return;\n }\n }\n };\n\n const contextValue = useMemo(() => {\n return { close: () => onClose?.() };\n }, [onClose]);\n\n return (\n // dialog element does seem to be interactive on MDN guideline\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <dialog\n className={classNames}\n data-anv=\"drawer\"\n data-anv-scroll-chaining={enableScrollChaining}\n data-anv-transition-state={state}\n ref={combinedRef}\n onCancel={onCancelHandler}\n onKeyDown={onKeyDownHandler}\n {...rest}\n >\n <ToastProvider isDialogToaster={isOpenOrOpening}>\n <ToasterPopover>\n <ToasterContent id=\"drawer-toaster\" ref={toasterRef} />\n </ToasterPopover>\n </ToastProvider>\n <DrawerContext.Provider value={contextValue}>\n <section\n ref={contentRef}\n className={styles.container}\n data-open={isOpenOrOpening}\n >\n {children}\n </section>\n </DrawerContext.Provider>\n </dialog>\n );\n },\n);\nDrawerElement.displayName = \"Drawer\";\n\n/**\n * A slide-out drawer component that provides a modal-like experience from the side of the screen.\n *\n * Features:\n * - Slide-in animation from the side of the screen\n * - Keyboard navigation with focus trapping\n * - Escape key and click outside to close\n * - Configurable size variants (medium, large)\n * - Built-in toast support for notifications\n * - Automatic scroll locking when open\n * - Accessible with proper ARIA attributes\n * - Compound component structure with Header, Footer, Content, and CancelButton\n * - Transition state callbacks for animation control\n * - Optional scroll chaining support\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer open={isOpen} onClose={handleClose} size=\"medium\">\n * <Drawer.Header>Settings</Drawer.Header>\n * <Drawer.Content>Drawer content goes here</Drawer.Content>\n * <Drawer.Footer>\n * <Button onClick={handleSave}>Save</Button>\n * <Drawer.CancelButton>Cancel</Drawer.CancelButton>\n * </Drawer.Footer>\n * </Drawer>\n */\nexport const Drawer = Object.assign(DrawerElement, {\n /**\n * Header component for the drawer that displays a title and close button.\n *\n * Features:\n * - Displays the drawer title as a headline\n * - Includes an accessible close button\n * - Sticky positioning at the top of the drawer\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Automatic close functionality\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer.Header>Settings</Drawer.Header>\n */\n Header: DrawerHeader,\n /**\n * Footer component for the drawer that displays action buttons and controls.\n *\n * Features:\n * - Flexible layout for action buttons and controls\n * - Optional sticky positioning at the bottom\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard footer element props\n * - Responsive design that adapts to content\n *\n * @example\n * <Drawer.Footer sticky>\n * <Button onClick={handleSave}>Save</Button>\n * <Drawer.CancelButton>Cancel</Drawer.CancelButton>\n * </Drawer.Footer>\n */\n Footer: DrawerFooter,\n /**\n * Content container for the drawer that holds the main content area.\n *\n * Features:\n * - Flexible content area with proper spacing\n * - Scrollable content when needed\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard div element props\n * - Responsive design that adapts to content\n * - Proper focus management\n *\n * @example\n * <Drawer.Content>\n * <p>This is the main content of the drawer.</p>\n * <p>It can contain any type of content.</p>\n * </Drawer.Content>\n */\n Content: DrawerContent,\n /**\n * A button component that automatically closes the drawer when clicked.\n *\n * Features:\n * - Automatically closes the drawer when clicked\n * - Extends Button component functionality\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard button props\n * - Proper focus management\n * - Can be used anywhere within the drawer context\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer.CancelButton appearance=\"ghost\" size=\"small\">\n * Cancel\n * </Drawer.CancelButton>\n */\n CancelButton: DrawerCancelButton,\n});\n"],"names":["Close","focusables"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASO,SAAS,gBAAA,GAAmB;AACjC,EAAA,MAAM,OAAA,GAAU,WAAW,aAAa,CAAA;AACxC,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,MAAM,IAAI,KAAA;AAAA,MACR;AAAA,KACF;AAAA,EACF;AACA,EAAA,OAAO,OAAA;AACT;;ACaO,MAAM,kBAAA,GAAqB,UAAA,CAGhC,CAAC,KAAA,EAAO,GAAA,KAAQ;AAChB,EAAA,MAAM,EAAE,OAAA,EAAS,GAAG,IAAA,EAAK,GAAI,KAAA;AAC7B,EAAA,MAAM,EAAE,KAAA,EAAM,GAAI,gBAAA,EAAiB;AACnC,EAAA,MAAM,IAAA,GAAO;AAAA,IACX,QAAA,EAAU,gBAAA,CAAiB,KAAA,CAAM,QAAQ,CAAA;AAAA,IACzC,YAAY,KAAA,CAAM,UAAA;AAAA,IAClB,MAAM,KAAA,CAAM,IAAA;AAAA,IACZ,MAAM,KAAA,CAAM;AAAA,GACd;AAEA,EAAA,MAAM,aAAa,aAAA,CAAc;AAAA,IAC/B,IAAA,EAAM,oBAAA;AAAA,IACN,IAAA;AAAA,IACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,GACxC,CAAA;AAED,EAAA,MAAM,cAAA,GAAiB,CAAC,CAAA,KAAqC;AAC3D,IAAA,OAAA,GAAU,CAAC,CAAA;AACX,IAAA,KAAA,EAAM;AAAA,EACR,CAAA;AACA,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,YAAA,EAAW,cAAA;AAAA,MACX,UAAA,EAAS,sBAAA;AAAA,MACT,kBAAA,EAAkB,UAAA;AAAA,MAClB,OAAA,EAAS,cAAA;AAAA,MACT,GAAA;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC;AAED,kBAAA,CAAmB,WAAA,GAAc,oBAAA;;ACjC1B,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAS,GAAI,KAAA;AAChC,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,QAAA,EAAU,gBAAA,CAAiB,KAAA,CAAM,QAAQ;AAAA,KAC3C;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,mBAAA,GAAsB,EAAA,CAAG,MAAA,CAAO,MAAA,EAAQ,SAAS,CAAA;AAEvD,IAAA,uBACE,IAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,mBAAA;AAAA,QACX,UAAA,EAAS,eAAA;AAAA,QACT,kBAAA,EAAkB,UAAA;AAAA,QAClB,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,UAAA,EAAW,EAAA,EAAG,MACzB,QAAA,EACH,CAAA;AAAA,0BACA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,iBAAiB,CAAA,EACvC,QAAA,kBAAA,GAAA;AAAA,YAAC,kBAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,OAAO,cAAc,CAAA;AAAA,cAChC,IAAA,EAAK,OAAA;AAAA,cACL,UAAA,EAAW,OAAA;AAAA,cACX,YAAA,EAAW,cAAA;AAAA,cACX,UAAA,EAAS,4BAAA;AAAA,cACT,IAAA,EAAMA;AAAA;AAAA,WACR,EACF;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;ACtCpB,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,SAAS,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AACzD,IAAA,MAAM,mBAAA,GAAsB,EAAA,CAAG,MAAA,CAAO,MAAA,EAAQ,SAAA,EAAW;AAAA,MACvD,CAAC,MAAA,CAAO,QAAQ,CAAC,GAAG;AAAA,KACrB,CAAA;AAED,IAAA,uBACE,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,mBAAA;AAAA,QACX,UAAA,EAAS,eAAA;AAAA,QACT,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;ACzBpB,MAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,GAAG,MAAK,GAAI,KAAA;AACzC,IAAA,MAAM,oBAAA,GAAuB,EAAA,CAAG,MAAA,CAAO,OAAA,EAAS,SAAS,CAAA;AAEzD,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,oBAAA;AAAA,QACX,UAAA,EAAS,gBAAA;AAAA,QACT,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,aAAA,CAAc,WAAA,GAAc,eAAA;;ACwB5B,MAAM,aAAA,GAAgB,UAAA;AAAA,EACpB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,IAAA,GAAO,KAAA;AAAA,MACP,QAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA;AAAA;AAAA;AAAA,MAIA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,oBAAA,GAAuB,KAAA;AAAA,MACvB,cAAA;AAAA,MACA,0BAAA,GAA6B,KAAA;AAAA,MAC7B,IAAA,GAAO,QAAA;AAAA,MACP,oBAAA;AAAA,MACA,oBAAA;AAAA,MACA,uBAAA;AAAA,MACA,qBAAA;AAAA,MACA,wBAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,KAAA,GAAQ,OAA0B,IAAI,CAAA;AAC5C,IAAA,MAAM,UAAA,GAAa,OAAuB,IAAI,CAAA;AAC9C,IAAA,MAAM,UAAA,GAAa,OAAuB,IAAI,CAAA;AAC9C,IAAA,MAAM,WAAA,GAAc,YAAA,CAAa,CAAC,KAAA,EAAO,GAAG,CAAC,CAAA;AAC7C,IAAA,MAAM,KAAK,KAAA,EAAM;AAEjB,IAAA,MAAM,EAAE,KAAA,EAAO,eAAA,EAAgB,GAAI,yBAAA,CAA0B,OAAO,IAAA,EAAM;AAAA,MACxE,oBAAA,EAAsB,YAAY,MAAM;AACtC,QAAA,oBAAA,IAAuB;AAAA,MACzB,CAAA,EAAG,CAAC,oBAAoB,CAAC,CAAA;AAAA,MACzB,uBAAA,EAAyB,YAAY,MAAM;AACzC,QAAA,uBAAA,IAA0B;AAC1B,QAAA,MAAA,IAAS;AAAA,MACX,CAAA,EAAG,CAAC,MAAA,EAAQ,uBAAuB,CAAC,CAAA;AAAA,MACpC,qBAAA,EAAuB,YAAY,MAAM;AACvC,QAAA,qBAAA,IAAwB;AAAA,MAC1B,CAAA,EAAG,CAAC,qBAAqB,CAAC,CAAA;AAAA,MAC1B,wBAAA,EAA0B,YAAY,MAAM;AAC1C,QAAA,wBAAA,IAA2B;AAAA,MAC7B,CAAA,EAAG,CAAC,wBAAwB,CAAC;AAAA,KAC9B,CAAA;AAED,IAAA,MAAM,aAAa,EAAA,CAAG,CAAC,MAAA,CAAO,MAAM,GAAG,SAAA,EAAW;AAAA,MAChD,CAAC,MAAA,CAAO,MAAM,GAAG,KAAA,KAAU,SAAA;AAAA,MAC3B,CAAC,MAAA,CAAO,KAAK,GAAG,IAAA,KAAS;AAAA,KAC1B,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAW,GAAI,qBAAA,CAAsB,UAAA,EAAY;AAAA,MACvD,aAAA,EAAe;AAAA,KAChB,CAAA;AACD,IAAA,MAAM,cAAA,GAAiB,aAAa,CAAC,CAAA;AACrC,IAAA,MAAM,aAAA,GAAgB,UAAA,GAAa,UAAA,CAAW,MAAA,GAAS,CAAC,CAAA;AAExD,IAAA,mBAAA,CAAoB;AAAA,MAClB,IAAA,EAAM,eAAA;AAAA,MACN,EAAA;AAAA,MACA,oBAAA;AAAA,MACA,UAAA,EAAY;AAAA,KACb,CAAA;AAED,IAAA,MAAM,YAAA,GAAe,WAAA,CAAY,CAACC,WAAAA,KAAmC;AACnE,MAAA,OACEA,WAAAA,CAAW,IAAA;AAAA,QACT,CAAC,SAAA,KAAc,SAAA,CAAU,OAAA,CAAQ,GAAA,KAAQ;AAAA,OAC3C,IAAKA,YAAW,CAAC,CAAA;AAAA,IAErB,CAAA,EAAG,EAAE,CAAA;AAEL,IAAA,eAAA,CAAgB,KAAA,EAAO;AAAA,MACrB;AAAA,KACD,CAAA;AAED,IAAA,MAAM,eAAA,GAAkB,CAAC,CAAA,KAAyC;AAChE,MAAA,CAAA,CAAE,cAAA,EAAe;AAEjB,MAAA,IAAI,oBAAA,EAAsB;AAC1B,MAAA,OAAA,IAAU;AAAA,IACZ,CAAA;AAEA,IAAA,iBAAA,CAAkB;AAAA,MAChB,cAAA,EAAgB,CAAC,CAAA,KAAM;AACrB,QAAA,IAAI,CAAC,IAAA,EAAM;AACX,QAAA,cAAA,GAAiB,CAAC,CAAA;AAAA,MACpB,CAAA;AAAA,MACA,OAAA,EAAS;AAAA,QACP,UAAA,CAAW,OAAA;AAAA,QACX,UAAA,CAAW;AAAA,OACb;AAAA,MACA,SAAS,MAAM;AACb,QAAA,IAAI,0BAAA,IAA8B,CAAC,IAAA,EAAM;AACzC,QAAA,OAAA,IAAU;AAAA,MACZ;AAAA,KACD,CAAA;AAED,IAAA,MAAM,gBAAA,GAAmB,CAAC,CAAA,KAAwC;AAChE,MAAA,SAAA,GAAY,CAAC,CAAA;AACb,MAAA,IAAI,CAAA,CAAE,SAAS,KAAA,EAAO;AACpB,QAAA,IAAI,CAAA,CAAE,QAAA,IAAY,CAAA,CAAE,MAAA,KAAW,cAAA,EAAgB;AAC7C,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAC,eAA+B,KAAA,EAAM;AACtC,UAAA;AAAA,QACF;AACA,QAAA,IAAI,CAAA,CAAE,MAAA,KAAW,aAAA,IAAiB,CAAC,EAAE,QAAA,EAAU;AAC7C,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAC,gBAAgC,KAAA,EAAM;AACvC,UAAA;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAA;AAEA,IAAA,MAAM,YAAA,GAAe,QAAQ,MAAM;AACjC,MAAA,OAAO,EAAE,KAAA,EAAO,MAAM,OAAA,IAAU,EAAE;AAAA,IACpC,CAAA,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,IAAA;AAAA;AAAA;AAAA,sBAGE,IAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,UAAA;AAAA,UACX,UAAA,EAAS,QAAA;AAAA,UACT,0BAAA,EAA0B,oBAAA;AAAA,UAC1B,2BAAA,EAA2B,KAAA;AAAA,UAC3B,GAAA,EAAK,WAAA;AAAA,UACL,QAAA,EAAU,eAAA;AAAA,UACV,SAAA,EAAW,gBAAA;AAAA,UACV,GAAG,IAAA;AAAA,UAEJ,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,aAAA,EAAA,EAAc,eAAA,EAAiB,eAAA,EAC9B,QAAA,kBAAA,GAAA,CAAC,cAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,cAAA,EAAA,EAAe,EAAA,EAAG,gBAAA,EAAiB,GAAA,EAAK,UAAA,EAAY,CAAA,EACvD,CAAA,EACF,CAAA;AAAA,4BACA,GAAA,CAAC,aAAA,CAAc,QAAA,EAAd,EAAuB,OAAO,YAAA,EAC7B,QAAA,kBAAA,GAAA;AAAA,cAAC,SAAA;AAAA,cAAA;AAAA,gBACC,GAAA,EAAK,UAAA;AAAA,gBACL,WAAW,MAAA,CAAO,SAAA;AAAA,gBAClB,WAAA,EAAW,eAAA;AAAA,gBAEV;AAAA;AAAA,aACH,EACF;AAAA;AAAA;AAAA;AACF;AAAA,EAEJ;AACF,CAAA;AACA,aAAA,CAAc,WAAA,GAAc,QAAA;AA4BrB,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,EAiBjD,MAAA,EAAQ,YAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAmBR,MAAA,EAAQ,YAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBR,OAAA,EAAS,aAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAmBT,YAAA,EAAc;AAChB,CAAC;;;;"}
|
|
1
|
+
{"version":3,"file":"Drawer-yG7C8Owv.js","sources":["../src/components/Drawer/internal/useDrawerContext.ts","../src/components/Drawer/DrawerCancelButton.tsx","../src/components/Drawer/DrawerHeader.tsx","../src/components/Drawer/DrawerFooter.tsx","../src/components/Drawer/DrawerContent.tsx","../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import { useContext } from \"react\";\nimport { DrawerContext } from \"./DrawerContext\";\n\n/**\n * Hook to access the drawer context.\n *\n * @returns The drawer context containing close function and ref\n * @throws Error if used outside of a DrawerContextProvider\n */\nexport function useDrawerContext() {\n const context = useContext(DrawerContext);\n if (!context) {\n throw new Error(\n \"useDrawerContext must be used within a DrawerContextProvider\",\n );\n }\n return context;\n}\n","import { MouseEvent, forwardRef } from \"react\";\nimport { Button, ButtonProps } from \"../Button\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId } from \"../../hooks\";\nimport { useDrawerContext } from \"./internal/useDrawerContext\";\n\n/**\n * Props for the DrawerCancelButton component\n * @extends ButtonProps\n */\nexport type DrawerCancelButtonProps = ButtonProps & DataTrackingId;\n\n/**\n * A button component that automatically closes the drawer when clicked.\n *\n * Features:\n * - Automatically closes the drawer when clicked\n * - Extends Button component functionality\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard button props\n * - Proper focus management\n * - Can be used anywhere within the drawer context\n *\n * @example\n * <DrawerCancelButton appearance=\"ghost\" size=\"small\">\n * Cancel\n * </DrawerCancelButton>\n */\nexport const DrawerCancelButton = forwardRef<\n HTMLButtonElement,\n DrawerCancelButtonProps\n>((props, ref) => {\n const { onClick, ...rest } = props;\n const { close } = useDrawerContext();\n const data = {\n children: childrenToString(props.children),\n appearance: props.appearance,\n size: props.size,\n type: props.type,\n };\n\n const trackingId = useTrackingId({\n name: \"DrawerCancelButton\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const onClickHandler = (e: MouseEvent<HTMLButtonElement>) => {\n onClick?.(e);\n close();\n };\n return (\n <Button\n aria-label=\"Close drawer\"\n data-anv=\"drawer-cancel-button\"\n data-tracking-id={trackingId}\n onClick={onClickHandler}\n ref={ref}\n {...rest}\n />\n );\n});\n\nDrawerCancelButton.displayName = \"DrawerCancelButton\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport styles from \"./Drawer.module.scss\";\nimport { Text } from \"../Text\";\nimport { DrawerCancelButton } from \"./DrawerCancelButton\";\nimport cx from \"classnames\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId } from \"../../hooks\";\n\n/**\n * Props for the DrawerHeader component\n * @extends ComponentPropsWithoutRef<\"header\">\n */\nexport type DrawerHeaderProps = ComponentPropsWithoutRef<\"header\"> &\n DataTrackingId;\n\n/**\n * Header component for the drawer that displays a title and close button.\n *\n * Features:\n * - Displays the drawer title as a headline\n * - Includes an accessible close button\n * - Sticky positioning at the top of the drawer\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Automatic close functionality\n *\n * @example\n * <Drawer.Header>Settings</Drawer.Header>\n */\nexport const DrawerHeader = forwardRef<HTMLHeadElement, DrawerHeaderProps>(\n (props, ref) => {\n const { className, children } = props;\n const data = {\n children: childrenToString(props.children),\n };\n\n const trackingId = useTrackingId({\n name: \"DrawerHeader\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const drawerHeaderClasses = cx(styles.header, className);\n\n return (\n <header\n className={drawerHeaderClasses}\n data-anv=\"drawer-header\"\n data-tracking-id={trackingId}\n ref={ref}\n >\n <Text variant=\"headline\" el=\"h1\">\n {children}\n </Text>\n <span className={styles[\"close-container\"]}>\n <DrawerCancelButton\n className={styles[\"close-button\"]}\n size=\"small\"\n appearance=\"ghost\"\n aria-label=\"Close drawer\"\n data-anv=\"drawer-header-close-button\"\n icon={Close}\n />\n </span>\n </header>\n );\n },\n);\n\nDrawerHeader.displayName = \"DrawerHeader\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport styles from \"./Drawer.module.scss\";\nimport cx from \"classnames\";\n\n/**\n * Props for the DrawerFooter component\n * @extends ComponentPropsWithoutRef<\"footer\">\n */\nexport type DrawerFooterProps = ComponentPropsWithoutRef<\"footer\"> & {\n /**\n * When true, the footer will stick to the bottom of the drawer.\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * Footer component for the drawer that displays action buttons and controls.\n *\n * Features:\n * - Flexible layout for action buttons and controls\n * - Optional sticky positioning at the bottom\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard footer element props\n * - Responsive design that adapts to content\n *\n * @example\n * <Drawer.Footer sticky>\n * <Button onClick={handleSave}>Save</Button>\n * <Button onClick={handleCancel}>Cancel</Button>\n * </Drawer.Footer>\n */\nexport const DrawerFooter = forwardRef<HTMLElement, DrawerFooterProps>(\n (props, ref) => {\n const { className, children, sticky = false, ...rest } = props;\n const drawerFooterClasses = cx(styles.footer, className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n return (\n <footer\n className={drawerFooterClasses}\n data-anv=\"drawer-footer\"\n ref={ref}\n {...rest}\n >\n {children}\n </footer>\n );\n },\n);\n\nDrawerFooter.displayName = \"DrawerFooter\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport styles from \"./Drawer.module.scss\";\nimport cx from \"classnames\";\n\n/**\n * Props for the DrawerContent component\n * @extends ComponentPropsWithoutRef<\"div\">\n */\nexport type DrawerContentProps = ComponentPropsWithoutRef<\"div\">;\n\n/**\n * Content container for the drawer that holds the main content area.\n *\n * Features:\n * - Flexible content area with proper spacing\n * - Scrollable content when needed\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard div element props\n * - Responsive design that adapts to content\n * - Proper focus management\n *\n * @example\n * <Drawer.Content>\n * <p>This is the main content of the drawer.</p>\n * <p>It can contain any type of content.</p>\n * </Drawer.Content>\n */\nexport const DrawerContent = forwardRef<HTMLDivElement, DrawerContentProps>(\n (props, ref) => {\n const { className, children, ...rest } = props;\n const drawerContentClasses = cx(styles.content, className);\n\n return (\n <div\n className={drawerContentClasses}\n data-anv=\"drawer-content\"\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n\nDrawerContent.displayName = \"DrawerContent\";\n","import styles from \"./Drawer.module.scss\";\nimport {\n ComponentPropsWithoutRef,\n forwardRef,\n useRef,\n useId,\n useCallback,\n SyntheticEvent,\n KeyboardEvent,\n useMemo,\n} from \"react\";\nimport { DrawerHeader } from \"./DrawerHeader\";\nimport { DrawerFooter } from \"./DrawerFooter\";\nimport { DrawerContent } from \"./DrawerContent\";\nimport { DrawerCancelButton } from \"./DrawerCancelButton\";\nimport {\n OpenCloseTransitionStateEffects,\n useDialogScrollLock,\n useDialogTransitionStates,\n useKeyboardFocusables,\n useOnClickOutside,\n} from \"../../internal/hooks\";\nimport { DisableCloseOnEscapeOrClickProps, Size } from \"../../types\";\nimport { useMergeRefs } from \"../../hooks\";\nimport cx from \"classnames\";\nimport { ToastProvider } from \"../Toast/internal/ToastProvider\";\nimport { ToasterPopover } from \"../Toast/internal/ToasterPopover\";\nimport { ToasterContent } from \"../Toast/internal/Toaster\";\nimport { DrawerContext } from \"./internal/DrawerContext\";\nimport { FocusableElement } from \"tabbable\";\nimport { useInitialFocus } from \"../Dialog/internal/useInitialFocus\";\n\n/**\n * Props for the Drawer component\n * @extends ComponentPropsWithoutRef<\"dialog\">\n * @extends DialogTransitionStateEffects\n * @extends DisableCloseOnEscapeOrClickProps\n */\nexport type DrawerProps = ComponentPropsWithoutRef<\"dialog\"> &\n OpenCloseTransitionStateEffects &\n DisableCloseOnEscapeOrClickProps & {\n /**\n * The size of the drawer.\n * @default \"medium\"\n */\n size?: Extract<Size, \"medium\" | \"large\">;\n /**\n * Controls whether the drawer is open or closed.\n * @default false\n */\n open?: boolean;\n /**\n * Callback function called after the drawer is animated closed.\n */\n onClose?: () => void;\n /**\n * Callback function called when the drawer opens.\n * @deprecated Use onOpenAnimationStart or onOpenAnimationComplete instead\n */\n onOpen?: () => void;\n /**\n * Callback when clicking outside the drawer\n */\n onClickOutside?: (e: globalThis.MouseEvent) => void;\n /**\n * Enables scroll chaining behavior.\n * @link https://developer.mozilla.org/en-US/docs/Glossary/Scroll_chaining\n */\n enableScrollChaining?: boolean;\n };\n\nconst DrawerElement = forwardRef<HTMLDialogElement, DrawerProps>(\n (props, ref) => {\n const {\n className,\n open = false,\n children,\n onOpen,\n onClose,\n /* eslint-disable-next-line @typescript-eslint/no-unused-vars --\n onCancel is destructured so that it is not passed to the dialog in ...rest\n */\n onCancel,\n onKeyDown,\n disableCloseOnEscape = false,\n onClickOutside,\n disableCloseOnClickOutside = false,\n size = \"medium\",\n enableScrollChaining,\n onOpenAnimationStart,\n onOpenAnimationComplete,\n onCloseAnimationStart,\n onCloseAnimationComplete,\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 combinedRef = useMergeRefs([elRef, ref]);\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 onOpen?.(); // DEPRECATED\n }, [onOpen, onOpenAnimationComplete]),\n onCloseAnimationStart: useCallback(() => {\n onCloseAnimationStart?.();\n }, [onCloseAnimationStart]),\n onCloseAnimationComplete: useCallback(() => {\n onCloseAnimationComplete?.();\n }, [onCloseAnimationComplete]),\n });\n\n const classNames = cx([styles.drawer], className, {\n [styles.remove]: state === \"closing\",\n [styles.large]: size === \"large\",\n });\n\n const { focusables } = useKeyboardFocusables(contentRef, {\n observeChange: false,\n });\n const firstFocusable = focusables?.[0];\n const lastFocusable = focusables?.[focusables.length - 1];\n\n useDialogScrollLock({\n open: isOpenOrOpening,\n id,\n enableScrollChaining,\n elementRef: elRef,\n });\n\n const computeFocus = useCallback((focusables: FocusableElement[]) => {\n return (\n focusables.find(\n (focusable) => focusable.dataset.anv !== \"drawer-header-close-button\",\n ) || focusables[0]\n );\n }, []);\n\n useInitialFocus(elRef, {\n computeFocus,\n });\n\n const onCancelHandler = (e: SyntheticEvent<HTMLDialogElement>) => {\n e.preventDefault();\n\n if (disableCloseOnEscape) return;\n onClose?.();\n };\n\n useOnClickOutside({\n onOutsidePress: (e) => {\n if (!open) return;\n onClickOutside?.(e);\n },\n targets: [\n contentRef.current as HTMLElement,\n toasterRef.current as HTMLElement,\n ],\n onClose: () => {\n if (disableCloseOnClickOutside || !open) return;\n onClose?.();\n },\n });\n\n const onKeyDownHandler = (e: KeyboardEvent<HTMLDialogElement>) => {\n onKeyDown?.(e);\n if (e.code === \"Tab\") {\n if (e.shiftKey && e.target === firstFocusable) {\n e.preventDefault();\n (lastFocusable as HTMLElement)?.focus();\n return;\n }\n if (e.target === lastFocusable && !e.shiftKey) {\n e.preventDefault();\n (firstFocusable as HTMLElement)?.focus();\n return;\n }\n }\n };\n\n const contextValue = useMemo(() => {\n return { close: () => onClose?.() };\n }, [onClose]);\n\n return (\n // dialog element does seem to be interactive on MDN guideline\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <dialog\n className={classNames}\n data-anv=\"drawer\"\n data-anv-scroll-chaining={enableScrollChaining}\n data-anv-transition-state={state}\n ref={combinedRef}\n onCancel={onCancelHandler}\n onKeyDown={onKeyDownHandler}\n {...rest}\n >\n <ToastProvider isDialogToaster={isOpenOrOpening}>\n <ToasterPopover>\n <ToasterContent id=\"drawer-toaster\" ref={toasterRef} />\n </ToasterPopover>\n </ToastProvider>\n <DrawerContext.Provider value={contextValue}>\n <section\n ref={contentRef}\n className={styles.container}\n data-open={isOpenOrOpening}\n >\n {children}\n </section>\n </DrawerContext.Provider>\n </dialog>\n );\n },\n);\nDrawerElement.displayName = \"Drawer\";\n\n/**\n * A slide-out drawer component that provides a modal-like experience from the side of the screen.\n *\n * Features:\n * - Slide-in animation from the side of the screen\n * - Keyboard navigation with focus trapping\n * - Escape key and click outside to close\n * - Configurable size variants (medium, large)\n * - Built-in toast support for notifications\n * - Automatic scroll locking when open\n * - Accessible with proper ARIA attributes\n * - Compound component structure with Header, Footer, Content, and CancelButton\n * - Transition state callbacks for animation control\n * - Optional scroll chaining support\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer open={isOpen} onClose={handleClose} size=\"medium\">\n * <Drawer.Header>Settings</Drawer.Header>\n * <Drawer.Content>Drawer content goes here</Drawer.Content>\n * <Drawer.Footer>\n * <Button onClick={handleSave}>Save</Button>\n * <Drawer.CancelButton>Cancel</Drawer.CancelButton>\n * </Drawer.Footer>\n * </Drawer>\n */\nexport const Drawer = Object.assign(DrawerElement, {\n /**\n * Header component for the drawer that displays a title and close button.\n *\n * Features:\n * - Displays the drawer title as a headline\n * - Includes an accessible close button\n * - Sticky positioning at the top of the drawer\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Automatic close functionality\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer.Header>Settings</Drawer.Header>\n */\n Header: DrawerHeader,\n /**\n * Footer component for the drawer that displays action buttons and controls.\n *\n * Features:\n * - Flexible layout for action buttons and controls\n * - Optional sticky positioning at the bottom\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard footer element props\n * - Responsive design that adapts to content\n *\n * @example\n * <Drawer.Footer sticky>\n * <Button onClick={handleSave}>Save</Button>\n * <Drawer.CancelButton>Cancel</Drawer.CancelButton>\n * </Drawer.Footer>\n */\n Footer: DrawerFooter,\n /**\n * Content container for the drawer that holds the main content area.\n *\n * Features:\n * - Flexible content area with proper spacing\n * - Scrollable content when needed\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard div element props\n * - Responsive design that adapts to content\n * - Proper focus management\n *\n * @example\n * <Drawer.Content>\n * <p>This is the main content of the drawer.</p>\n * <p>It can contain any type of content.</p>\n * </Drawer.Content>\n */\n Content: DrawerContent,\n /**\n * A button component that automatically closes the drawer when clicked.\n *\n * Features:\n * - Automatically closes the drawer when clicked\n * - Extends Button component functionality\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard button props\n * - Proper focus management\n * - Can be used anywhere within the drawer context\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer.CancelButton appearance=\"ghost\" size=\"small\">\n * Cancel\n * </Drawer.CancelButton>\n */\n CancelButton: DrawerCancelButton,\n});\n"],"names":["Close","focusables"],"mappings":"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"}
|
package/dist/Drawer.css
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
@layer starter, reset, base, state, application;
|
|
2
2
|
@layer base {
|
|
3
|
-
.
|
|
3
|
+
._drawer_1enz7_2 {
|
|
4
4
|
border: none;
|
|
5
5
|
background: transparent;
|
|
6
6
|
padding-block: 0;
|
|
7
7
|
padding-inline: 0;
|
|
8
8
|
outline: none;
|
|
9
|
-
animation: _close-
|
|
9
|
+
animation: _close-drawer_1enz7_1 2s forwards;
|
|
10
10
|
transition: width 200ms;
|
|
11
11
|
width: 35rem;
|
|
12
12
|
height: 100%;
|
|
@@ -17,96 +17,93 @@
|
|
|
17
17
|
margin-block-end: 0;
|
|
18
18
|
max-height: 100dvh;
|
|
19
19
|
margin-inline-end: 0;
|
|
20
|
-
|
|
20
|
+
overflow: visible;
|
|
21
21
|
--xpos: 10rem;
|
|
22
|
+
--drawer-padding: 1.5rem;
|
|
22
23
|
}
|
|
23
|
-
.
|
|
24
|
-
animation: _open-
|
|
24
|
+
._drawer_1enz7_2[open] {
|
|
25
|
+
animation: _open-drawer_1enz7_1 300ms forwards;
|
|
25
26
|
}
|
|
26
|
-
.
|
|
27
|
-
animation: _open-
|
|
27
|
+
._drawer_1enz7_2[open]::backdrop {
|
|
28
|
+
animation: _open-backdrop_1enz7_1 200ms forwards;
|
|
28
29
|
}
|
|
29
|
-
.
|
|
30
|
+
._drawer_1enz7_2 ._container_1enz7_29 {
|
|
30
31
|
font-family: var(--font-family-base, "Nunito Sans", sans-serif);
|
|
31
32
|
font-size: 100%;
|
|
32
33
|
color: var(--foreground-color, #141414);
|
|
33
34
|
display: flex;
|
|
34
35
|
box-sizing: border-box;
|
|
35
|
-
padding-block: 1.5rem;
|
|
36
|
-
padding-inline: 1.5rem;
|
|
37
36
|
flex-direction: column;
|
|
38
37
|
background-color: inherit;
|
|
39
|
-
|
|
40
|
-
|
|
38
|
+
height: 100%;
|
|
39
|
+
overflow: auto;
|
|
40
|
+
overscroll-behavior: contain;
|
|
41
41
|
}
|
|
42
|
-
.
|
|
42
|
+
._drawer_1enz7_2 ._container_1enz7_29 ._content_1enz7_41 {
|
|
43
43
|
flex-grow: 1;
|
|
44
|
-
padding-block-start: 0.25rem;
|
|
45
|
-
padding-block-end: 0.25rem;
|
|
46
44
|
font-size: 1rem;
|
|
45
|
+
padding: var(--drawer-padding);
|
|
47
46
|
isolation: isolate;
|
|
48
47
|
}
|
|
49
|
-
.
|
|
48
|
+
._header_1enz7_47 {
|
|
50
49
|
position: sticky;
|
|
51
50
|
inset-block-start: 0;
|
|
52
51
|
display: flex;
|
|
53
52
|
justify-content: space-between;
|
|
54
|
-
padding-block:
|
|
55
|
-
padding-
|
|
56
|
-
|
|
57
|
-
margin-inline: -1.5rem;
|
|
53
|
+
padding-block-start: var(--drawer-padding);
|
|
54
|
+
padding-block-end: 0.25rem;
|
|
55
|
+
padding-inline: var(--drawer-padding);
|
|
58
56
|
background-color: inherit;
|
|
59
57
|
font-size: 1rem;
|
|
60
58
|
z-index: 1;
|
|
61
59
|
}
|
|
62
|
-
.
|
|
60
|
+
._header_1enz7_47 h1 {
|
|
63
61
|
margin-block: 0;
|
|
64
62
|
margin-inline: 0;
|
|
65
63
|
}
|
|
66
|
-
.
|
|
64
|
+
._header_1enz7_47 ._close-container_1enz7_63 {
|
|
67
65
|
display: flex;
|
|
68
66
|
justify-content: center;
|
|
69
67
|
align-items: center;
|
|
70
68
|
width: 1.5625rem;
|
|
71
69
|
height: 1.5625rem;
|
|
72
70
|
}
|
|
73
|
-
.
|
|
71
|
+
._footer_1enz7_70 {
|
|
74
72
|
display: flex;
|
|
75
73
|
gap: 0.75rem;
|
|
76
74
|
justify-content: flex-end;
|
|
77
|
-
padding-block:
|
|
78
|
-
padding-
|
|
79
|
-
|
|
80
|
-
margin-inline: -1.5rem;
|
|
75
|
+
padding-block-start: 0.25rem;
|
|
76
|
+
padding-block-end: var(--drawer-padding);
|
|
77
|
+
padding-inline: var(--drawer-padding);
|
|
81
78
|
background-color: inherit;
|
|
82
79
|
flex-wrap: wrap;
|
|
83
80
|
}
|
|
84
81
|
}
|
|
85
82
|
@layer state {
|
|
86
83
|
@media (prefers-reduced-motion: reduce) {
|
|
87
|
-
.
|
|
84
|
+
._drawer_1enz7_2 {
|
|
88
85
|
--xpos: 0;
|
|
89
86
|
}
|
|
90
87
|
}
|
|
91
|
-
.
|
|
92
|
-
animation: _close-
|
|
88
|
+
._drawer_1enz7_2._remove_1enz7_87[open] {
|
|
89
|
+
animation: _close-drawer_1enz7_1 300ms forwards;
|
|
93
90
|
}
|
|
94
|
-
.
|
|
95
|
-
animation: _close-
|
|
91
|
+
._drawer_1enz7_2._remove_1enz7_87[open]::backdrop {
|
|
92
|
+
animation: _close-backdrop_1enz7_1 200ms forwards;
|
|
96
93
|
}
|
|
97
|
-
.
|
|
94
|
+
._drawer_1enz7_2::backdrop {
|
|
98
95
|
background: #040404;
|
|
99
96
|
}
|
|
100
|
-
.
|
|
97
|
+
._drawer_1enz7_2._large_1enz7_96 {
|
|
101
98
|
width: 48rem;
|
|
102
99
|
}
|
|
103
|
-
.
|
|
100
|
+
._drawer_1enz7_2 ._footer_1enz7_70._sticky_1enz7_99 {
|
|
104
101
|
position: sticky;
|
|
105
102
|
inset-block-end: 0;
|
|
106
103
|
}
|
|
107
104
|
}
|
|
108
105
|
@layer application {
|
|
109
|
-
.
|
|
106
|
+
._drawer_1enz7_2 ._header_1enz7_47 ._close-button_1enz7_105 {
|
|
110
107
|
color: var(--foreground-color, #141414);
|
|
111
108
|
}
|
|
112
109
|
}
|
|
@@ -114,7 +111,7 @@
|
|
|
114
111
|
overflow: hidden;
|
|
115
112
|
}
|
|
116
113
|
|
|
117
|
-
@keyframes _open-
|
|
114
|
+
@keyframes _open-drawer_1enz7_1 {
|
|
118
115
|
from {
|
|
119
116
|
opacity: 0;
|
|
120
117
|
transform: translateX(var(--xpos));
|
|
@@ -124,7 +121,7 @@
|
|
|
124
121
|
transform: translateX(0%);
|
|
125
122
|
}
|
|
126
123
|
}
|
|
127
|
-
@keyframes _close-
|
|
124
|
+
@keyframes _close-drawer_1enz7_1 {
|
|
128
125
|
from {
|
|
129
126
|
opacity: 1;
|
|
130
127
|
transform: translateX(0%);
|
|
@@ -134,7 +131,7 @@
|
|
|
134
131
|
transform: translateX(var(--xpos));
|
|
135
132
|
}
|
|
136
133
|
}
|
|
137
|
-
@keyframes _open-
|
|
134
|
+
@keyframes _open-backdrop_1enz7_1 {
|
|
138
135
|
from {
|
|
139
136
|
opacity: 0;
|
|
140
137
|
}
|
|
@@ -142,7 +139,7 @@
|
|
|
142
139
|
opacity: 0.6;
|
|
143
140
|
}
|
|
144
141
|
}
|
|
145
|
-
@keyframes _close-
|
|
142
|
+
@keyframes _close-backdrop_1enz7_1 {
|
|
146
143
|
from {
|
|
147
144
|
opacity: 0.6;
|
|
148
145
|
}
|
package/dist/Drawer.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { D as Drawer, a as DrawerCancelButton, d as DrawerContent, b as DrawerFooter, c as DrawerHeader, D as default } from './Drawer-
|
|
1
|
+
export { D as Drawer, a as DrawerCancelButton, d as DrawerContent, b as DrawerFooter, c as DrawerHeader, D as default } from './Drawer-yG7C8Owv.js';
|
|
2
2
|
//# sourceMappingURL=Drawer.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { forwardRef, useRef, useMemo, isValidElement, cloneElement } from 'react';
|
|
3
3
|
import { u as useMergeRefs } from './DrawerContext-D4tWTLVf.js';
|
|
4
|
-
import { T as TextField } from './TextField-
|
|
4
|
+
import { T as TextField } from './TextField-Duo_mY8Y.js';
|
|
5
5
|
import { u as useOptionallyControlledState } from './useOptionallyControlledState-DbDuos5L.js';
|
|
6
6
|
import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
|
|
7
7
|
import { useTrackingId } from './useTrackingId.js';
|
|
@@ -261,4 +261,4 @@ const InputMask = forwardRef(
|
|
|
261
261
|
InputMask.displayName = "InputMask";
|
|
262
262
|
|
|
263
263
|
export { InputMask as I };
|
|
264
|
-
//# sourceMappingURL=InputMask-
|
|
264
|
+
//# sourceMappingURL=InputMask-BHupXP8N.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputMask-B13KumrK.js","sources":["../src/components/InputMask/internal/constants.ts","../src/components/InputMask/internal/utils.ts","../src/components/InputMask/InputMask.tsx"],"sourcesContent":["export const MASK_CHARS = [\"a\", \"9\", \"*\"];\n","import { MASK_CHARS } from \"./constants\";\n\n/**\n * This function applies the mask to the input value, returning a new string that matches the mask's format.\n * @param value - a string representing the raw input value (e.g., what the user typed)\n * @param mask - a string representing the desired input mask (e.g., \"99/99/9999\" for a date)\n * @param defaultMaskCharacter - a string representing the default mask character (e.g., \"_\")\n * @returns a string representing the masked value (e.g., \"12/31/2025\" for a date)\n *\n * @example\n * applyMask(\"1234567890\", \"99/99/9999\", \"_\") // \"12/31/2025\"\n * applyMask(\"1234567890\", \"999-999-9999\", \"-\") // \"123-456-7890\"\n * applyMask(\"123\", \"99/99\", \"_\") // \"12/3_\"\n */\nexport function applyMask(\n value: string,\n mask: string,\n defaultMaskCharacter: string,\n) {\n let maskedValue = \"\";\n let valueIndex = 0;\n for (let i = 0; i < mask.length; i++) {\n const maskChar = mask[i];\n if (MASK_CHARS.includes(maskChar)) {\n // Find next acceptable char in value\n while (\n valueIndex < value.length &&\n !isAcceptableChar(value[valueIndex], maskChar)\n ) {\n valueIndex++;\n }\n if (valueIndex < value.length) {\n maskedValue += value[valueIndex];\n valueIndex++;\n } else {\n maskedValue += defaultMaskCharacter;\n }\n } else {\n maskedValue += maskChar;\n }\n }\n return maskedValue;\n}\n/**\n * This function checks if a character is acceptable for a given mask character.\n * @param char - a string representing the character to check\n * @param maskChar - a string representing the mask character\n * @returns a boolean indicating if the character is acceptable\n */\nfunction isAcceptableChar(char: string, maskChar: string) {\n if (maskChar === \"9\") {\n return /\\d/.test(char);\n }\n if (maskChar === \"a\") {\n return /[a-zA-Z]/.test(char);\n }\n if (maskChar === \"*\") {\n return /[a-zA-Z0-9]/.test(char);\n }\n return false;\n}\n/**\n * This function finds the next open character in a given value.\n * @param value - a string representing the value to search\n * @param defaultMaskCharacter - a string representing the default mask character (e.g., \"_\")\n * @returns a number representing the index of the next open character\n */\nexport function getNextOpenCharacterIndex(\n value: string,\n defaultMaskCharacter: string,\n) {\n let idx = value.indexOf(defaultMaskCharacter);\n if (idx < 0) {\n idx = value.length;\n }\n return idx;\n}\n/**\n * This function finds the first non-fixed character in the value.\n * @param startingIndex - a number representing the index to start searching from\n * @param fixedCharacterIndices - an array of numbers representing the indices of the fixed characters\n * @returns a number representing the index of the first non-fixed character\n */\nexport function getFirstNonFixedCharacterIndex(\n startingIndex: number,\n fixedCharacterIndices: number[],\n) {\n let idx = startingIndex;\n while (fixedCharacterIndices.includes(idx)) {\n idx++;\n }\n return idx;\n}\n/**\n * This function finds the last filled character in a given value.\n * @param value - a string representing the value to search\n * @param mask - a string representing the mask\n * @returns a number representing the index of the last filled character\n */\nexport function getLastFilledCharacterIndex(value: string, mask: string) {\n let idx = value\n .split(\"\")\n .findLastIndex((char, i) => isAcceptableChar(char, mask[i]));\n if (idx < 0) {\n idx = 0;\n }\n return idx;\n}\n/**\n * This function finds the first filled character in a given value.\n * @param value - a string representing the value to search\n * @param mask - a string representing the mask\n * @returns a number representing the index of the first filled character\n */\nexport function getFirstFilledCharacterIndex(value: string, mask: string) {\n let idx = value\n .split(\"\")\n .findIndex((char, i) => isAcceptableChar(char, mask[i]));\n if (idx < 0) {\n idx = 0;\n }\n return idx;\n}\n","import {\n ChangeEvent,\n ChangeEventHandler,\n FocusEvent,\n KeyboardEvent,\n InputHTMLAttributes,\n ReactElement,\n cloneElement,\n forwardRef,\n isValidElement,\n useRef,\n useMemo,\n MouseEvent,\n} from \"react\";\nimport { useMergeRefs } from \"@floating-ui/react\";\nimport { useOptionallyControlledState } from \"../../internal/hooks\";\nimport { useTrackingId } from \"../../hooks\";\nimport { TextField, TextFieldProps } from \"../TextField/internal/TextField\";\nimport { childrenToString } from \"../../internal/functions\";\nimport {\n applyMask,\n getLastFilledCharacterIndex,\n getFirstFilledCharacterIndex,\n getFirstNonFixedCharacterIndex,\n getNextOpenCharacterIndex,\n} from \"./internal/utils\";\nimport { MASK_CHARS } from \"./internal/constants\";\nimport { DataTrackingId } from \"../../types\";\n\n/**\n * Props for InputMask when using with children\n */\ninterface InputMaskPropsWithChildren {\n /**\n * Custom input element to be wrapped with mask functionality.\n */\n children: ReactElement<InputHTMLAttributes<HTMLInputElement>>;\n /**\n * Additional props to pass to the input element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n}\n\n/**\n * Props for InputMask when using without children\n */\ninterface InputMaskPropsWithoutChildren {\n /**\n * No children allowed when using default TextField.\n */\n children?: never;\n /**\n * Props to pass to the default TextField component.\n */\n inputProps?: TextFieldProps;\n}\n\n/**\n * Configuration for custom mask handler matching\n */\ninterface ICustomMaskHandlerMatch {\n /**\n * Regular expression pattern to match against input.\n */\n matchPattern: RegExp;\n /**\n * Starting position in the input string.\n */\n startPosition: number;\n /**\n * Ending position in the input string.\n */\n endPosition: number;\n}\n\n/**\n * Configuration for custom mask handler application\n */\ninterface ICustomMaskHandlerApply {\n /**\n * Pattern to apply when match is found.\n */\n applyPattern: string;\n /**\n * Offset to apply to cursor position after transformation.\n */\n caretOffset: number;\n}\n\n/**\n * Custom mask handler for advanced input transformations\n */\ninterface ICustomMaskHandler {\n /**\n * Matching configuration for the handler.\n */\n match: ICustomMaskHandlerMatch;\n /**\n * Application configuration for the handler.\n */\n apply: ICustomMaskHandlerApply;\n}\n\n/**\n * Shared props for InputMask component\n */\ninterface SharedInputMaskProps {\n /**\n * The mask pattern to apply to the input.\n * - \"9\" for digits only\n * - \"a\" for letters only\n * - \"*\" for alphanumeric\n * - Any other character is treated as a fixed character\n */\n mask: string;\n /**\n * Character to display for unfilled mask positions.\n * @default \"_\"\n */\n defaultMaskCharacter?: string;\n /**\n * Controlled value for the input.\n */\n value?: string;\n /**\n * Default value for uncontrolled input.\n */\n defaultValue?: string;\n /**\n * Callback function called when input value changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Array of custom mask handlers for advanced transformations.\n */\n customMaskHandler?: ICustomMaskHandler[];\n}\n\ntype SpecialChange = {\n reason: \"Backspace\" | \"Delete\" | \"Edit\";\n start: number;\n end: number;\n};\n\n/**\n * Props for the InputMask component\n * @property {string} mask - The mask pattern to apply to the input (9 for digits, a for letters, * for alphanumeric)\n * @property {string} [defaultMaskCharacter] - Character to display for unfilled mask positions\n * @property {array} [customMaskHandler] - Array of custom mask handlers for advanced transformations\n * @property {object} [inputProps] - Props to pass to the input component\n * @property {ReactElement} [children] - Custom input element to be wrapped with mask functionality\n * @property {string} [data-tracking-id] - Custom tracking ID for analytics\n */\nexport type InputMaskProps = SharedInputMaskProps &\n (InputMaskPropsWithChildren | InputMaskPropsWithoutChildren) &\n DataTrackingId;\n\n/**\n * InputMask component for applying input masks and formatting to text inputs.\n *\n * @deprecated Use the TextField component with custom masking instead. Over time, we intend to release additional components with built-in masking.\n */\nexport const InputMask = forwardRef<HTMLInputElement, InputMaskProps>(\n (\n {\n children,\n mask,\n defaultMaskCharacter = \"_\",\n value,\n defaultValue,\n onChange,\n inputProps,\n \"data-tracking-id\": dataTrackingId,\n },\n ref,\n ) => {\n const [v, setV] = useOptionallyControlledState({\n controlledValue:\n value !== undefined\n ? applyMask(value, mask, defaultMaskCharacter)\n : undefined,\n defaultValue: applyMask(defaultValue || \"\", mask, defaultMaskCharacter),\n // Omitting the onChange handler here because we want to handle it ourselves (i.e. send an event instead of just the value)\n });\n const specialChange = useRef<SpecialChange | null>(null);\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n const passInRef = useMergeRefs([inputRef, ref]);\n\n const currentOpenCharacterCount = useMemo(() => {\n return v.split(\"\").filter((char) => char === defaultMaskCharacter).length;\n }, [v, defaultMaskCharacter]);\n\n const fixedCharacterIndices = useMemo(() => {\n const fixedIndices: number[] = [];\n mask.split(\"\").forEach((char, i) => {\n if (!MASK_CHARS.includes(char)) {\n fixedIndices.push(i);\n }\n });\n return fixedIndices;\n }, [mask]);\n\n const moveCursorTo = (start: number, end: number = start) => {\n requestAnimationFrame(() => {\n inputRef.current?.setSelectionRange(start, end);\n });\n };\n\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n let newVal = applyMask(e.target.value, mask, defaultMaskCharacter);\n if (\n // A single character was backspaced\n specialChange.current?.reason === \"Backspace\" &&\n specialChange.current.start === specialChange.current.end\n ) {\n // If the character before the backspace is a fixed character, we need to remove the filled character before the fixed character\n if (fixedCharacterIndices.includes(specialChange.current.start - 1)) {\n const removeIndex = getLastFilledCharacterIndex(\n newVal.slice(0, specialChange.current.start),\n mask,\n );\n newVal = applyMask(\n newVal.slice(0, removeIndex) + newVal.slice(removeIndex + 1),\n mask,\n defaultMaskCharacter,\n );\n moveCursorTo(removeIndex, removeIndex);\n } else {\n const idx = Math.min(\n getLastFilledCharacterIndex(newVal, mask) + 1,\n specialChange.current.start - 1,\n );\n moveCursorTo(idx, idx);\n }\n } else if (\n // A single character was deleted\n specialChange.current?.reason === \"Delete\" &&\n specialChange.current.start === specialChange.current.end\n ) {\n // If the character after the delete is a fixed character, we need to remove the filled character after the fixed character\n if (fixedCharacterIndices.includes(specialChange.current.start)) {\n const removeIndex = getFirstFilledCharacterIndex(\n newVal.slice(specialChange.current.start + 1),\n mask,\n );\n newVal = applyMask(\n newVal.slice(0, removeIndex) + newVal.slice(removeIndex + 1),\n mask,\n defaultMaskCharacter,\n );\n }\n const firstFilledIdx = getFirstFilledCharacterIndex(newVal, mask);\n const targetIdx = Math.max(firstFilledIdx, specialChange.current.start);\n moveCursorTo(targetIdx, targetIdx);\n } else if (\n specialChange.current?.reason === \"Edit\" &&\n specialChange.current.start === specialChange.current.end // A single character was edited\n ) {\n const firstNonFixedIdx = getFirstNonFixedCharacterIndex(\n specialChange.current.start + 1,\n fixedCharacterIndices,\n );\n moveCursorTo(firstNonFixedIdx, firstNonFixedIdx);\n } else {\n const newIndex = getNextOpenCharacterIndex(\n newVal,\n defaultMaskCharacter,\n );\n moveCursorTo(newIndex, newIndex);\n }\n\n setV(newVal);\n if (inputRef.current) {\n inputRef.current.value = newVal;\n }\n onChange?.({ ...e, target: { ...e.target, value: newVal } });\n };\n\n const handleFocus = (e: FocusEvent<HTMLInputElement>) => {\n requestAnimationFrame(() => {\n if (\n e.target.selectionStart === null ||\n e.target.selectionStart === undefined ||\n e.target.selectionStart >= v.length\n ) {\n const newIndex = getNextOpenCharacterIndex(v, defaultMaskCharacter);\n moveCursorTo(newIndex, newIndex);\n }\n });\n inputProps?.onFocus?.(e);\n };\n\n const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n const target = e.target as HTMLInputElement;\n if (target.selectionStart === null || target.selectionEnd === null) {\n return;\n }\n if (e.key === \"Backspace\") {\n specialChange.current = {\n reason: \"Backspace\",\n start: target.selectionStart,\n end: target.selectionEnd,\n };\n } else if (e.key === \"Delete\") {\n specialChange.current = {\n reason: \"Delete\",\n start: target.selectionStart,\n end: target.selectionEnd,\n };\n } else if (currentOpenCharacterCount === 0) {\n specialChange.current = {\n reason: \"Edit\",\n start: target.selectionStart,\n end: target.selectionEnd,\n };\n } else {\n specialChange.current = null;\n }\n inputProps?.onKeyDown?.(e);\n };\n\n const handleClick = (e: MouseEvent<HTMLInputElement>) => {\n // For future use.\n e.preventDefault();\n e.stopPropagation();\n inputProps?.onClick?.(e);\n };\n\n const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n // For future use.\n e.preventDefault();\n e.stopPropagation();\n inputProps?.onBlur?.(e);\n };\n\n const mergedInputProps = {\n ...inputProps,\n ...(children && isValidElement(children) ? children.props : {}),\n value: v,\n onChange: handleChange,\n onFocus: handleFocus,\n onKeyDown: handleKeyDown,\n onClick: handleClick,\n onBlur: handleBlur,\n ref: passInRef,\n };\n\n const isInputEmpty = useMemo(() => {\n if (v.length === 0) {\n return true;\n }\n return v === applyMask(\"\", mask, defaultMaskCharacter);\n }, [v, defaultMaskCharacter, mask]);\n\n const data = {\n label:\n \"label\" in mergedInputProps\n ? childrenToString(mergedInputProps.label)\n : null,\n labelProps:\n \"labelProps\" in mergedInputProps ? mergedInputProps.labelProps : null,\n prefix: childrenToString(mergedInputProps.prefix),\n hint:\n \"hint\" in mergedInputProps\n ? childrenToString(mergedInputProps.hint)\n : null,\n description:\n \"description\" in mergedInputProps\n ? childrenToString(mergedInputProps.description)\n : null,\n size: mergedInputProps.size,\n type: mergedInputProps.type,\n };\n\n const trackingId = useTrackingId({\n name: \"InputMask\",\n data,\n hasOverride: !!dataTrackingId,\n });\n\n return children && isValidElement(children) && children.type === \"input\" ? (\n cloneElement(children, {\n ...mergedInputProps,\n \"data-tracking-id\": trackingId,\n } as InputHTMLAttributes<HTMLInputElement> & {\n \"data-tracking-id\"?: string;\n })\n ) : (\n <TextField\n data-input-empty={isInputEmpty}\n data-tracking-id={trackingId}\n {...(mergedInputProps as TextFieldProps)}\n />\n );\n },\n);\n\nInputMask.displayName = \"InputMask\";\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"InputMask-BHupXP8N.js","sources":["../src/components/InputMask/internal/constants.ts","../src/components/InputMask/internal/utils.ts","../src/components/InputMask/InputMask.tsx"],"sourcesContent":["export const MASK_CHARS = [\"a\", \"9\", \"*\"];\n","import { MASK_CHARS } from \"./constants\";\n\n/**\n * This function applies the mask to the input value, returning a new string that matches the mask's format.\n * @param value - a string representing the raw input value (e.g., what the user typed)\n * @param mask - a string representing the desired input mask (e.g., \"99/99/9999\" for a date)\n * @param defaultMaskCharacter - a string representing the default mask character (e.g., \"_\")\n * @returns a string representing the masked value (e.g., \"12/31/2025\" for a date)\n *\n * @example\n * applyMask(\"1234567890\", \"99/99/9999\", \"_\") // \"12/31/2025\"\n * applyMask(\"1234567890\", \"999-999-9999\", \"-\") // \"123-456-7890\"\n * applyMask(\"123\", \"99/99\", \"_\") // \"12/3_\"\n */\nexport function applyMask(\n value: string,\n mask: string,\n defaultMaskCharacter: string,\n) {\n let maskedValue = \"\";\n let valueIndex = 0;\n for (let i = 0; i < mask.length; i++) {\n const maskChar = mask[i];\n if (MASK_CHARS.includes(maskChar)) {\n // Find next acceptable char in value\n while (\n valueIndex < value.length &&\n !isAcceptableChar(value[valueIndex], maskChar)\n ) {\n valueIndex++;\n }\n if (valueIndex < value.length) {\n maskedValue += value[valueIndex];\n valueIndex++;\n } else {\n maskedValue += defaultMaskCharacter;\n }\n } else {\n maskedValue += maskChar;\n }\n }\n return maskedValue;\n}\n/**\n * This function checks if a character is acceptable for a given mask character.\n * @param char - a string representing the character to check\n * @param maskChar - a string representing the mask character\n * @returns a boolean indicating if the character is acceptable\n */\nfunction isAcceptableChar(char: string, maskChar: string) {\n if (maskChar === \"9\") {\n return /\\d/.test(char);\n }\n if (maskChar === \"a\") {\n return /[a-zA-Z]/.test(char);\n }\n if (maskChar === \"*\") {\n return /[a-zA-Z0-9]/.test(char);\n }\n return false;\n}\n/**\n * This function finds the next open character in a given value.\n * @param value - a string representing the value to search\n * @param defaultMaskCharacter - a string representing the default mask character (e.g., \"_\")\n * @returns a number representing the index of the next open character\n */\nexport function getNextOpenCharacterIndex(\n value: string,\n defaultMaskCharacter: string,\n) {\n let idx = value.indexOf(defaultMaskCharacter);\n if (idx < 0) {\n idx = value.length;\n }\n return idx;\n}\n/**\n * This function finds the first non-fixed character in the value.\n * @param startingIndex - a number representing the index to start searching from\n * @param fixedCharacterIndices - an array of numbers representing the indices of the fixed characters\n * @returns a number representing the index of the first non-fixed character\n */\nexport function getFirstNonFixedCharacterIndex(\n startingIndex: number,\n fixedCharacterIndices: number[],\n) {\n let idx = startingIndex;\n while (fixedCharacterIndices.includes(idx)) {\n idx++;\n }\n return idx;\n}\n/**\n * This function finds the last filled character in a given value.\n * @param value - a string representing the value to search\n * @param mask - a string representing the mask\n * @returns a number representing the index of the last filled character\n */\nexport function getLastFilledCharacterIndex(value: string, mask: string) {\n let idx = value\n .split(\"\")\n .findLastIndex((char, i) => isAcceptableChar(char, mask[i]));\n if (idx < 0) {\n idx = 0;\n }\n return idx;\n}\n/**\n * This function finds the first filled character in a given value.\n * @param value - a string representing the value to search\n * @param mask - a string representing the mask\n * @returns a number representing the index of the first filled character\n */\nexport function getFirstFilledCharacterIndex(value: string, mask: string) {\n let idx = value\n .split(\"\")\n .findIndex((char, i) => isAcceptableChar(char, mask[i]));\n if (idx < 0) {\n idx = 0;\n }\n return idx;\n}\n","import {\n ChangeEvent,\n ChangeEventHandler,\n FocusEvent,\n KeyboardEvent,\n InputHTMLAttributes,\n ReactElement,\n cloneElement,\n forwardRef,\n isValidElement,\n useRef,\n useMemo,\n MouseEvent,\n} from \"react\";\nimport { useMergeRefs } from \"@floating-ui/react\";\nimport { useOptionallyControlledState } from \"../../internal/hooks\";\nimport { useTrackingId } from \"../../hooks\";\nimport { TextField, TextFieldProps } from \"../TextField/internal/TextField\";\nimport { childrenToString } from \"../../internal/functions\";\nimport {\n applyMask,\n getLastFilledCharacterIndex,\n getFirstFilledCharacterIndex,\n getFirstNonFixedCharacterIndex,\n getNextOpenCharacterIndex,\n} from \"./internal/utils\";\nimport { MASK_CHARS } from \"./internal/constants\";\nimport { DataTrackingId } from \"../../types\";\n\n/**\n * Props for InputMask when using with children\n */\ninterface InputMaskPropsWithChildren {\n /**\n * Custom input element to be wrapped with mask functionality.\n */\n children: ReactElement<InputHTMLAttributes<HTMLInputElement>>;\n /**\n * Additional props to pass to the input element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n}\n\n/**\n * Props for InputMask when using without children\n */\ninterface InputMaskPropsWithoutChildren {\n /**\n * No children allowed when using default TextField.\n */\n children?: never;\n /**\n * Props to pass to the default TextField component.\n */\n inputProps?: TextFieldProps;\n}\n\n/**\n * Configuration for custom mask handler matching\n */\ninterface ICustomMaskHandlerMatch {\n /**\n * Regular expression pattern to match against input.\n */\n matchPattern: RegExp;\n /**\n * Starting position in the input string.\n */\n startPosition: number;\n /**\n * Ending position in the input string.\n */\n endPosition: number;\n}\n\n/**\n * Configuration for custom mask handler application\n */\ninterface ICustomMaskHandlerApply {\n /**\n * Pattern to apply when match is found.\n */\n applyPattern: string;\n /**\n * Offset to apply to cursor position after transformation.\n */\n caretOffset: number;\n}\n\n/**\n * Custom mask handler for advanced input transformations\n */\ninterface ICustomMaskHandler {\n /**\n * Matching configuration for the handler.\n */\n match: ICustomMaskHandlerMatch;\n /**\n * Application configuration for the handler.\n */\n apply: ICustomMaskHandlerApply;\n}\n\n/**\n * Shared props for InputMask component\n */\ninterface SharedInputMaskProps {\n /**\n * The mask pattern to apply to the input.\n * - \"9\" for digits only\n * - \"a\" for letters only\n * - \"*\" for alphanumeric\n * - Any other character is treated as a fixed character\n */\n mask: string;\n /**\n * Character to display for unfilled mask positions.\n * @default \"_\"\n */\n defaultMaskCharacter?: string;\n /**\n * Controlled value for the input.\n */\n value?: string;\n /**\n * Default value for uncontrolled input.\n */\n defaultValue?: string;\n /**\n * Callback function called when input value changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Array of custom mask handlers for advanced transformations.\n */\n customMaskHandler?: ICustomMaskHandler[];\n}\n\ntype SpecialChange = {\n reason: \"Backspace\" | \"Delete\" | \"Edit\";\n start: number;\n end: number;\n};\n\n/**\n * Props for the InputMask component\n * @property {string} mask - The mask pattern to apply to the input (9 for digits, a for letters, * for alphanumeric)\n * @property {string} [defaultMaskCharacter] - Character to display for unfilled mask positions\n * @property {array} [customMaskHandler] - Array of custom mask handlers for advanced transformations\n * @property {object} [inputProps] - Props to pass to the input component\n * @property {ReactElement} [children] - Custom input element to be wrapped with mask functionality\n * @property {string} [data-tracking-id] - Custom tracking ID for analytics\n */\nexport type InputMaskProps = SharedInputMaskProps &\n (InputMaskPropsWithChildren | InputMaskPropsWithoutChildren) &\n DataTrackingId;\n\n/**\n * InputMask component for applying input masks and formatting to text inputs.\n *\n * @deprecated Use the TextField component with custom masking instead. Over time, we intend to release additional components with built-in masking.\n */\nexport const InputMask = forwardRef<HTMLInputElement, InputMaskProps>(\n (\n {\n children,\n mask,\n defaultMaskCharacter = \"_\",\n value,\n defaultValue,\n onChange,\n inputProps,\n \"data-tracking-id\": dataTrackingId,\n },\n ref,\n ) => {\n const [v, setV] = useOptionallyControlledState({\n controlledValue:\n value !== undefined\n ? applyMask(value, mask, defaultMaskCharacter)\n : undefined,\n defaultValue: applyMask(defaultValue || \"\", mask, defaultMaskCharacter),\n // Omitting the onChange handler here because we want to handle it ourselves (i.e. send an event instead of just the value)\n });\n const specialChange = useRef<SpecialChange | null>(null);\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n const passInRef = useMergeRefs([inputRef, ref]);\n\n const currentOpenCharacterCount = useMemo(() => {\n return v.split(\"\").filter((char) => char === defaultMaskCharacter).length;\n }, [v, defaultMaskCharacter]);\n\n const fixedCharacterIndices = useMemo(() => {\n const fixedIndices: number[] = [];\n mask.split(\"\").forEach((char, i) => {\n if (!MASK_CHARS.includes(char)) {\n fixedIndices.push(i);\n }\n });\n return fixedIndices;\n }, [mask]);\n\n const moveCursorTo = (start: number, end: number = start) => {\n requestAnimationFrame(() => {\n inputRef.current?.setSelectionRange(start, end);\n });\n };\n\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n let newVal = applyMask(e.target.value, mask, defaultMaskCharacter);\n if (\n // A single character was backspaced\n specialChange.current?.reason === \"Backspace\" &&\n specialChange.current.start === specialChange.current.end\n ) {\n // If the character before the backspace is a fixed character, we need to remove the filled character before the fixed character\n if (fixedCharacterIndices.includes(specialChange.current.start - 1)) {\n const removeIndex = getLastFilledCharacterIndex(\n newVal.slice(0, specialChange.current.start),\n mask,\n );\n newVal = applyMask(\n newVal.slice(0, removeIndex) + newVal.slice(removeIndex + 1),\n mask,\n defaultMaskCharacter,\n );\n moveCursorTo(removeIndex, removeIndex);\n } else {\n const idx = Math.min(\n getLastFilledCharacterIndex(newVal, mask) + 1,\n specialChange.current.start - 1,\n );\n moveCursorTo(idx, idx);\n }\n } else if (\n // A single character was deleted\n specialChange.current?.reason === \"Delete\" &&\n specialChange.current.start === specialChange.current.end\n ) {\n // If the character after the delete is a fixed character, we need to remove the filled character after the fixed character\n if (fixedCharacterIndices.includes(specialChange.current.start)) {\n const removeIndex = getFirstFilledCharacterIndex(\n newVal.slice(specialChange.current.start + 1),\n mask,\n );\n newVal = applyMask(\n newVal.slice(0, removeIndex) + newVal.slice(removeIndex + 1),\n mask,\n defaultMaskCharacter,\n );\n }\n const firstFilledIdx = getFirstFilledCharacterIndex(newVal, mask);\n const targetIdx = Math.max(firstFilledIdx, specialChange.current.start);\n moveCursorTo(targetIdx, targetIdx);\n } else if (\n specialChange.current?.reason === \"Edit\" &&\n specialChange.current.start === specialChange.current.end // A single character was edited\n ) {\n const firstNonFixedIdx = getFirstNonFixedCharacterIndex(\n specialChange.current.start + 1,\n fixedCharacterIndices,\n );\n moveCursorTo(firstNonFixedIdx, firstNonFixedIdx);\n } else {\n const newIndex = getNextOpenCharacterIndex(\n newVal,\n defaultMaskCharacter,\n );\n moveCursorTo(newIndex, newIndex);\n }\n\n setV(newVal);\n if (inputRef.current) {\n inputRef.current.value = newVal;\n }\n onChange?.({ ...e, target: { ...e.target, value: newVal } });\n };\n\n const handleFocus = (e: FocusEvent<HTMLInputElement>) => {\n requestAnimationFrame(() => {\n if (\n e.target.selectionStart === null ||\n e.target.selectionStart === undefined ||\n e.target.selectionStart >= v.length\n ) {\n const newIndex = getNextOpenCharacterIndex(v, defaultMaskCharacter);\n moveCursorTo(newIndex, newIndex);\n }\n });\n inputProps?.onFocus?.(e);\n };\n\n const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n const target = e.target as HTMLInputElement;\n if (target.selectionStart === null || target.selectionEnd === null) {\n return;\n }\n if (e.key === \"Backspace\") {\n specialChange.current = {\n reason: \"Backspace\",\n start: target.selectionStart,\n end: target.selectionEnd,\n };\n } else if (e.key === \"Delete\") {\n specialChange.current = {\n reason: \"Delete\",\n start: target.selectionStart,\n end: target.selectionEnd,\n };\n } else if (currentOpenCharacterCount === 0) {\n specialChange.current = {\n reason: \"Edit\",\n start: target.selectionStart,\n end: target.selectionEnd,\n };\n } else {\n specialChange.current = null;\n }\n inputProps?.onKeyDown?.(e);\n };\n\n const handleClick = (e: MouseEvent<HTMLInputElement>) => {\n // For future use.\n e.preventDefault();\n e.stopPropagation();\n inputProps?.onClick?.(e);\n };\n\n const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n // For future use.\n e.preventDefault();\n e.stopPropagation();\n inputProps?.onBlur?.(e);\n };\n\n const mergedInputProps = {\n ...inputProps,\n ...(children && isValidElement(children) ? children.props : {}),\n value: v,\n onChange: handleChange,\n onFocus: handleFocus,\n onKeyDown: handleKeyDown,\n onClick: handleClick,\n onBlur: handleBlur,\n ref: passInRef,\n };\n\n const isInputEmpty = useMemo(() => {\n if (v.length === 0) {\n return true;\n }\n return v === applyMask(\"\", mask, defaultMaskCharacter);\n }, [v, defaultMaskCharacter, mask]);\n\n const data = {\n label:\n \"label\" in mergedInputProps\n ? childrenToString(mergedInputProps.label)\n : null,\n labelProps:\n \"labelProps\" in mergedInputProps ? mergedInputProps.labelProps : null,\n prefix: childrenToString(mergedInputProps.prefix),\n hint:\n \"hint\" in mergedInputProps\n ? childrenToString(mergedInputProps.hint)\n : null,\n description:\n \"description\" in mergedInputProps\n ? childrenToString(mergedInputProps.description)\n : null,\n size: mergedInputProps.size,\n type: mergedInputProps.type,\n };\n\n const trackingId = useTrackingId({\n name: \"InputMask\",\n data,\n hasOverride: !!dataTrackingId,\n });\n\n return children && isValidElement(children) && children.type === \"input\" ? (\n cloneElement(children, {\n ...mergedInputProps,\n \"data-tracking-id\": trackingId,\n } as InputHTMLAttributes<HTMLInputElement> & {\n \"data-tracking-id\"?: string;\n })\n ) : (\n <TextField\n data-input-empty={isInputEmpty}\n data-tracking-id={trackingId}\n {...(mergedInputProps as TextFieldProps)}\n />\n );\n },\n);\n\nInputMask.displayName = \"InputMask\";\n"],"names":[],"mappings":"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"}
|
package/dist/InputMask.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { I as InputMask, I as default } from './InputMask-
|
|
1
|
+
export { I as InputMask, I as default } from './InputMask-BHupXP8N.js';
|
|
2
2
|
//# sourceMappingURL=InputMask.js.map
|
|
@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
|
|
|
2
2
|
import { createContext, useContext, forwardRef, useRef, useId, useEffect, useMemo, useState } from 'react';
|
|
3
3
|
import { C as Checkbox } from './Checkbox-DAODkzN3.js';
|
|
4
4
|
import { c as cx } from './index-tZvMCc77.js';
|
|
5
|
-
import {
|
|
5
|
+
import { l as listViewStyles } from './ListView.module-BilDg12y.js';
|
|
6
6
|
import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
|
|
7
7
|
import { useTrackingId } from './useTrackingId.js';
|
|
8
8
|
import { g as getActiveElement } from './getActiveElement-BcSyVE7S.js';
|
|
@@ -119,7 +119,7 @@ const ListViewOption = forwardRef(
|
|
|
119
119
|
"div",
|
|
120
120
|
{
|
|
121
121
|
"data-tracking-id": trackingId,
|
|
122
|
-
className: cx([
|
|
122
|
+
className: cx([listViewStyles["listview-option"]], className),
|
|
123
123
|
"data-anv": "listview-option",
|
|
124
124
|
style,
|
|
125
125
|
ref: mergedRef,
|
|
@@ -129,7 +129,7 @@ const ListViewOption = forwardRef(
|
|
|
129
129
|
role: "row",
|
|
130
130
|
...forwardedProps,
|
|
131
131
|
children: [
|
|
132
|
-
/* @__PURE__ */ jsx("div", { className:
|
|
132
|
+
/* @__PURE__ */ jsx("div", { className: listViewStyles["cell"], ref: cellRef, role: "gridcell", children: /* @__PURE__ */ jsx(
|
|
133
133
|
Checkbox,
|
|
134
134
|
{
|
|
135
135
|
disabled,
|
|
@@ -421,7 +421,7 @@ const ListViewElement = function(props, ref) {
|
|
|
421
421
|
setSelectedItems(orderedSelected);
|
|
422
422
|
prevSelectedItems.current = orderedSelected;
|
|
423
423
|
}, [onSelectionChange, options, selected]);
|
|
424
|
-
const ListViewClassNames = cx([
|
|
424
|
+
const ListViewClassNames = cx([listViewStyles["listview"]], className);
|
|
425
425
|
if ("items" in remainingProps) {
|
|
426
426
|
const { children: children2, items, ...rest2 } = remainingProps;
|
|
427
427
|
return /* @__PURE__ */ jsx(
|
|
@@ -529,4 +529,4 @@ const ListView = Object.assign(
|
|
|
529
529
|
);
|
|
530
530
|
|
|
531
531
|
export { ListView as L, ListViewOption as a, ListViewOptionCell as b };
|
|
532
|
-
//# sourceMappingURL=ListView-
|
|
532
|
+
//# sourceMappingURL=ListView-Dsj5MiUx.js.map
|