@servicetitan/anvil2 1.48.1 → 1.49.1

package/dist/{Drawer-DyHDRTR-.js → Drawer-BLfDJU-e.js}

@@ -1,13 +1,13 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useContext, forwardRef, useRef, useId, useCallback, useEffect, useMemo } from 'react';
 import { S as SvgClose } from './close-DZj38AEh.js';
-import { T as Text } from './Text-CDzLZl1O.js';
-import { B as Button } from './Button-DzcOa6iJ.js';
+import { T as Text } from './Text-kPA-VzsB.js';
+import { B as Button } from './Button-92_FKAyV.js';
 import { a as DrawerContext } from './DrawerContext-D4tWTLVf.js';
 import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
 import { useTrackingId } from './useTrackingId.js';
 import { c as cx } from './index-tZvMCc77.js';
-import { a as ToastProvider, b as ToasterPopover, c as ToasterContent } from './Toaster-D72xHdfH.js';
+import { a as ToastProvider, b as ToasterPopover, c as ToasterContent } from './Toaster-Dg7M4W4U.js';
 import { u as useDialogTransitionStates, a as useKeyboardFocusables, b as useDialogScrollLock, c as useInitialFocus } from './useInitialFocus-Cl_Txu7W.js';
 import { r as registerLayer, a as unregisterLayer, b as useOnClickOutside } from './useOnClickOutside-BDzuUjmY.js';
 import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
@@ -376,4 +376,4 @@ const Drawer = Object.assign(DrawerElement, {
 });
 
 export { Drawer as D, DrawerCancelButton as a, DrawerFooter as b, DrawerHeader as c, DrawerContent as d };
-//# sourceMappingURL=Drawer-DyHDRTR-.js.map
+//# sourceMappingURL=Drawer-BLfDJU-e.js.map

package/dist/{Drawer-DyHDRTR-.js.map → Drawer-BLfDJU-e.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Drawer-DyHDRTR-.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  useEffect,\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 {\n  FocusableElement,\n  DisableCloseOnEscapeOrClickProps,\n  Size,\n} from \"../../types\";\nimport { registerLayer, unregisterLayer } from \"../../internal/utils\";\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 { 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     * Given an array of focusable elements, return the initial focus target.\n     * @param focusables - The focusable elements to pick from\n     * @returns The initial focus target\n     */\n    initialFocusResolver?: (focusables: FocusableElement[]) => FocusableElement;\n  };\n\nconst DrawerElement = forwardRef<HTMLDialogElement, DrawerProps>(\n  (props, ref) => {\n    const {\n      className,\n      open = false,\n      children,\n      onOpen,\n      onClose,\n      // onCancel is destructured so that it is not passed to the dialog in ...rest\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      initialFocusResolver,\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    // Register/unregister with layer manager for proper stacking\n    useEffect(() => {\n      if (open) {\n        registerLayer(id);\n      } else {\n        unregisterLayer(id);\n      }\n\n      // Cleanup when component unmounts\n      return () => {\n        unregisterLayer(id);\n      };\n    }, [open, id]);\n\n    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: initialFocusResolver || 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      layerId: id,\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      <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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"}
+{"version":3,"file":"Drawer-BLfDJU-e.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  useEffect,\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 {\n  FocusableElement,\n  DisableCloseOnEscapeOrClickProps,\n  Size,\n} from \"../../types\";\nimport { registerLayer, unregisterLayer } from \"../../internal/utils\";\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 { 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     * Given an array of focusable elements, return the initial focus target.\n     * @param focusables - The focusable elements to pick from\n     * @returns The initial focus target\n     */\n    initialFocusResolver?: (focusables: FocusableElement[]) => FocusableElement;\n  };\n\nconst DrawerElement = forwardRef<HTMLDialogElement, DrawerProps>(\n  (props, ref) => {\n    const {\n      className,\n      open = false,\n      children,\n      onOpen,\n      onClose,\n      // onCancel is destructured so that it is not passed to the dialog in ...rest\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      initialFocusResolver,\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    // Register/unregister with layer manager for proper stacking\n    useEffect(() => {\n      if (open) {\n        registerLayer(id);\n      } else {\n        unregisterLayer(id);\n      }\n\n      // Cleanup when component unmounts\n      return () => {\n        unregisterLayer(id);\n      };\n    }, [open, id]);\n\n    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: initialFocusResolver || 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      layerId: id,\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      <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;;ACmC5B,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,MAEA,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,oBAAA;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;AAGD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,IAAA,EAAM;AACR,QAAA,aAAA,CAAc,EAAE,CAAA;AAAA,MAClB,CAAA,MAAO;AACL,QAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,MACpB;AAGA,MAAA,OAAO,MAAM;AACX,QAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,MACpB,CAAA;AAAA,IACF,CAAA,EAAG,CAAC,IAAA,EAAM,EAAE,CAAC,CAAA;AAEb,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,cAAc,oBAAA,IAAwB;AAAA,KACvC,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,CAAA;AAAA,MACA,OAAA,EAAS;AAAA,KACV,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,sBAEE,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;;;;"}

package/dist/Drawer.js

@@ -1,2 +1,2 @@
-export { D as Drawer, a as DrawerCancelButton, d as DrawerContent, b as DrawerFooter, c as DrawerHeader, D as default } from './Drawer-DyHDRTR-.js';
+export { D as Drawer, a as DrawerCancelButton, d as DrawerContent, b as DrawerFooter, c as DrawerHeader, D as default } from './Drawer-BLfDJU-e.js';
 //# sourceMappingURL=Drawer.js.map

package/dist/{EditCard-LdyduHqX.js → EditCard-Ds1UXJIS.js}

@@ -3,11 +3,11 @@ import { c as cx } from './index-tZvMCc77.js';
 import * as React from 'react';
 import { forwardRef } from 'react';
 import { S as SvgCheck } from './check-Cf67OWrZ.js';
-import { C as Card } from './Card-Cyoz-LaD.js';
-import { T as Text } from './Text-CDzLZl1O.js';
-import { I as Icon } from './Icon-TcJbUdTz.js';
-import { B as Button } from './Button-DzcOa6iJ.js';
-import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-C7FVYB8F.js';
+import { C as Card } from './Card-Ch3sMUo5.js';
+import { T as Text } from './Text-kPA-VzsB.js';
+import { I as Icon } from './Icon-BSuTVNaa.js';
+import { B as Button } from './Button-92_FKAyV.js';
+import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
 
 import './EditCard.css';const container = "_container_1bs09_11";
 const header = "_header_1bs09_17";
@@ -108,4 +108,4 @@ const EditCard = forwardRef(
 EditCard.displayName = "EditCard";
 
 export { EditCard as E };
-//# sourceMappingURL=EditCard-LdyduHqX.js.map
+//# sourceMappingURL=EditCard-Ds1UXJIS.js.map

package/dist/{EditCard-LdyduHqX.js.map → EditCard-Ds1UXJIS.js.map}

@@ -1 +1 @@
-{"version":3,"file":"EditCard-LdyduHqX.js","sources":["../../hammer-icon/mdi/round/priority_high.svg","../src/components/EditCard/EditCard.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgPriorityHigh = (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(\"circle\", { cx: 12, cy: 19, r: 2 }), /* @__PURE__ */ React.createElement(\"path\", { d: \"M12 3c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2s2-.9 2-2V5c0-1.1-.9-2-2-2z\" }));\nexport default SvgPriorityHigh;\n","import cx from \"classnames\";\nimport styles from \"./EditCard.module.scss\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { LayoutUtilProps } from \"../../types\";\nimport Check from \"@servicetitan/hammer-icon/mdi/round/check.svg\";\nimport PriorityHigh from \"@servicetitan/hammer-icon/mdi/round/priority_high.svg\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { Card } from \"../Card\";\nimport { Text } from \"../Text\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\n\n/**\n * Props for the EditCard component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends LayoutUtilProps\n */\nexport type EditCardProps = ComponentPropsWithoutRef<\"div\"> &\n  LayoutUtilProps & {\n    /**\n     * The header text to display. Can be a string or an object mapping states to different text.\n     */\n    headerText:\n      | string\n      | {\n          \"not started\": string;\n          \"in progress\": string;\n          error: string;\n          complete: string;\n        };\n    /**\n     * The current state of the edit card.\n     */\n    state: EditCardState;\n    /**\n     * Text to display on the save button.\n     * @default \"Save\"\n     */\n    saveButtonText?: string;\n    /**\n     * Text to display on the edit button.\n     * @default \"Edit\"\n     */\n    editButtonText?: string;\n    /**\n     * Whether to disable the edit button.\n     * @default false\n     */\n    disableEdit?: boolean;\n    /**\n     * Whether to disable the save button.\n     * @default false\n     */\n    disableSave?: boolean;\n    /**\n     * Callback function called when the state changes.\n     */\n    onStateChange?: (changeType: EditCardChange) => void;\n  };\n\n/**\n * The type of state change that can occur.\n * @property {\"edit\"} edit - User clicked the edit button to start editing\n * @property {\"save\"} save - User clicked the save button to save changes\n * @property {\"cancel\"} cancel - User clicked the cancel button to discard changes\n */\nexport type EditCardChange = \"edit\" | \"save\" | \"cancel\";\n\n/**\n * The current state of the edit card.\n * @property {\"not started\"} not started - Initial state, content is not being edited\n * @property {\"in progress\"} in progress - User is currently editing the content\n * @property {\"error\"} error - An error occurred during the edit process\n * @property {\"complete\"} complete - Edit was successfully completed\n */\nexport type EditCardState =\n  | \"not started\"\n  | \"in progress\"\n  | \"error\"\n  | \"complete\";\n\n/**\n * EditCard component for managing editable content with different states and actions.\n *\n * Features:\n * - Four distinct states: not started, in progress, error, and complete\n * - Visual indicators for each state with appropriate icons\n * - Dynamic header text that can change based on state\n * - Edit and save buttons with customizable text\n * - Optional button disabling for different states\n * - State change callbacks for handling user interactions\n * - Built on Card component with consistent styling\n * - Supports layout utilities for positioning and spacing\n * - Accessible with proper ARIA attributes\n * - Visual state indicators with color-coded borders\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <EditCard\n *   headerText=\"User Profile\"\n *   state=\"not started\"\n *   onStateChange={(change) => console.log(change)}\n * >\n *   <Text>Profile information goes here</Text>\n * </EditCard>\n */\nexport const EditCard = forwardRef<HTMLDivElement, EditCardProps>(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      children,\n      className,\n      style,\n      headerText,\n      state,\n      editButtonText = \"Edit\",\n      saveButtonText = \"Save\",\n      disableEdit = false,\n      disableSave = false,\n      onStateChange,\n      ...rest\n    } = componentProps;\n\n    const kebabState = state?.replaceAll(\" \", \"-\");\n\n    const editCardClassNames = cx(\n      styles[\"edit-card\"],\n      styles[`edit-card-${kebabState}`],\n      className,\n    );\n\n    return (\n      <Card\n        padding=\"large\"\n        className={editCardClassNames}\n        data-anv=\"edit-card\"\n        style={style}\n        ref={ref}\n        {...rest}\n      >\n        <div\n          className={cx(styles.indicator, styles[`indicator-${kebabState}`])}\n        >\n          {state === \"complete\" && <Icon svg={Check} />}\n          {state === \"error\" && <Icon svg={PriorityHigh} />}\n        </div>\n        <div className={styles.container}>\n          <div className={styles.header}>\n            <Text className={styles.heading} variant=\"headline\" el=\"h3\">\n              {typeof headerText === \"string\" ? headerText : headerText[state]}\n            </Text>\n            {state !== \"in progress\" && (\n              <Button\n                disabled={disableEdit}\n                onClick={() => onStateChange?.(\"edit\")}\n              >\n                {editButtonText}\n              </Button>\n            )}\n          </div>\n          {children && (\n            <div className={styles.content} style={layoutStyles}>\n              {children}\n            </div>\n          )}\n          {state === \"in progress\" && (\n            <div className={styles.footer}>\n              <Button onClick={() => onStateChange?.(\"cancel\")}>Cancel</Button>\n              <Button\n                appearance=\"primary\"\n                onClick={() => onStateChange?.(\"save\")}\n                disabled={disableSave}\n              >\n                {saveButtonText}\n              </Button>\n            </div>\n          )}\n        </div>\n      </Card>\n    );\n  },\n);\n\nEditCard.displayName = \"EditCard\";\n"],"names":["Check","PriorityHigh"],"mappings":"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"}
+{"version":3,"file":"EditCard-Ds1UXJIS.js","sources":["../../hammer-icon/mdi/round/priority_high.svg","../src/components/EditCard/EditCard.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgPriorityHigh = (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(\"circle\", { cx: 12, cy: 19, r: 2 }), /* @__PURE__ */ React.createElement(\"path\", { d: \"M12 3c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2s2-.9 2-2V5c0-1.1-.9-2-2-2z\" }));\nexport default SvgPriorityHigh;\n","import cx from \"classnames\";\nimport styles from \"./EditCard.module.scss\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { LayoutUtilProps } from \"../../types\";\nimport Check from \"@servicetitan/hammer-icon/mdi/round/check.svg\";\nimport PriorityHigh from \"@servicetitan/hammer-icon/mdi/round/priority_high.svg\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { Card } from \"../Card\";\nimport { Text } from \"../Text\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\n\n/**\n * Props for the EditCard component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends LayoutUtilProps\n */\nexport type EditCardProps = ComponentPropsWithoutRef<\"div\"> &\n  LayoutUtilProps & {\n    /**\n     * The header text to display. Can be a string or an object mapping states to different text.\n     */\n    headerText:\n      | string\n      | {\n          \"not started\": string;\n          \"in progress\": string;\n          error: string;\n          complete: string;\n        };\n    /**\n     * The current state of the edit card.\n     */\n    state: EditCardState;\n    /**\n     * Text to display on the save button.\n     * @default \"Save\"\n     */\n    saveButtonText?: string;\n    /**\n     * Text to display on the edit button.\n     * @default \"Edit\"\n     */\n    editButtonText?: string;\n    /**\n     * Whether to disable the edit button.\n     * @default false\n     */\n    disableEdit?: boolean;\n    /**\n     * Whether to disable the save button.\n     * @default false\n     */\n    disableSave?: boolean;\n    /**\n     * Callback function called when the state changes.\n     */\n    onStateChange?: (changeType: EditCardChange) => void;\n  };\n\n/**\n * The type of state change that can occur.\n * @property {\"edit\"} edit - User clicked the edit button to start editing\n * @property {\"save\"} save - User clicked the save button to save changes\n * @property {\"cancel\"} cancel - User clicked the cancel button to discard changes\n */\nexport type EditCardChange = \"edit\" | \"save\" | \"cancel\";\n\n/**\n * The current state of the edit card.\n * @property {\"not started\"} not started - Initial state, content is not being edited\n * @property {\"in progress\"} in progress - User is currently editing the content\n * @property {\"error\"} error - An error occurred during the edit process\n * @property {\"complete\"} complete - Edit was successfully completed\n */\nexport type EditCardState =\n  | \"not started\"\n  | \"in progress\"\n  | \"error\"\n  | \"complete\";\n\n/**\n * EditCard component for managing editable content with different states and actions.\n *\n * Features:\n * - Four distinct states: not started, in progress, error, and complete\n * - Visual indicators for each state with appropriate icons\n * - Dynamic header text that can change based on state\n * - Edit and save buttons with customizable text\n * - Optional button disabling for different states\n * - State change callbacks for handling user interactions\n * - Built on Card component with consistent styling\n * - Supports layout utilities for positioning and spacing\n * - Accessible with proper ARIA attributes\n * - Visual state indicators with color-coded borders\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <EditCard\n *   headerText=\"User Profile\"\n *   state=\"not started\"\n *   onStateChange={(change) => console.log(change)}\n * >\n *   <Text>Profile information goes here</Text>\n * </EditCard>\n */\nexport const EditCard = forwardRef<HTMLDivElement, EditCardProps>(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      children,\n      className,\n      style,\n      headerText,\n      state,\n      editButtonText = \"Edit\",\n      saveButtonText = \"Save\",\n      disableEdit = false,\n      disableSave = false,\n      onStateChange,\n      ...rest\n    } = componentProps;\n\n    const kebabState = state?.replaceAll(\" \", \"-\");\n\n    const editCardClassNames = cx(\n      styles[\"edit-card\"],\n      styles[`edit-card-${kebabState}`],\n      className,\n    );\n\n    return (\n      <Card\n        padding=\"large\"\n        className={editCardClassNames}\n        data-anv=\"edit-card\"\n        style={style}\n        ref={ref}\n        {...rest}\n      >\n        <div\n          className={cx(styles.indicator, styles[`indicator-${kebabState}`])}\n        >\n          {state === \"complete\" && <Icon svg={Check} />}\n          {state === \"error\" && <Icon svg={PriorityHigh} />}\n        </div>\n        <div className={styles.container}>\n          <div className={styles.header}>\n            <Text className={styles.heading} variant=\"headline\" el=\"h3\">\n              {typeof headerText === \"string\" ? headerText : headerText[state]}\n            </Text>\n            {state !== \"in progress\" && (\n              <Button\n                disabled={disableEdit}\n                onClick={() => onStateChange?.(\"edit\")}\n              >\n                {editButtonText}\n              </Button>\n            )}\n          </div>\n          {children && (\n            <div className={styles.content} style={layoutStyles}>\n              {children}\n            </div>\n          )}\n          {state === \"in progress\" && (\n            <div className={styles.footer}>\n              <Button onClick={() => onStateChange?.(\"cancel\")}>Cancel</Button>\n              <Button\n                appearance=\"primary\"\n                onClick={() => onStateChange?.(\"save\")}\n                disabled={disableSave}\n              >\n                {saveButtonText}\n              </Button>\n            </div>\n          )}\n        </div>\n      </Card>\n    );\n  },\n);\n\nEditCard.displayName = \"EditCard\";\n"],"names":["Check","PriorityHigh"],"mappings":"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"}

package/dist/EditCard.js

@@ -1,2 +1,2 @@
-export { E as EditCard, E as default } from './EditCard-LdyduHqX.js';
+export { E as EditCard, E as default } from './EditCard-Ds1UXJIS.js';
 //# sourceMappingURL=EditCard.js.map

package/dist/{FieldLabel-DIlzcPIQ.js → FieldLabel-CHMCV9wX.js}

@@ -1,52 +1,70 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
+import { useState, forwardRef } from 'react';
 import { c as cx } from './index-tZvMCc77.js';
 import { S as SrOnly } from './SrOnly-CTsYSuby.js';
-import { T as Tooltip } from './Tooltip-BOfdwyTv.js';
-import { I as Icon } from './Icon-TcJbUdTz.js';
+import { T as Tooltip } from './Tooltip-CZsoFe6C.js';
+import { I as Icon } from './Icon-BSuTVNaa.js';
 import { S as SvgInfo } from './info-CYpG6tcI.js';
 
-import './FieldLabel.css';const label = "_label_jfzvd_2";
-const required = "_required_jfzvd_46";
+import './FieldLabel.css';const label = "_label_wc4yy_2";
+const required = "_required_wc4yy_61";
 const styles = {
 	label: label,
-	"top-container": "_top-container_jfzvd_37",
-	"label-text": "_label-text_jfzvd_42",
+	"top-container": "_top-container_wc4yy_52",
+	"label-text": "_label-text_wc4yy_57",
 	required: required,
-	"info-trigger": "_info-trigger_jfzvd_51",
-	"info-content": "_info-content_jfzvd_56"
+	"info-trigger": "_info-trigger_wc4yy_66",
+	"info-content": "_info-content_wc4yy_71"
 };
 
 const FieldLabelMoreInfoIcon = ({
   moreInfo,
-  openMoreInfo
+  openMoreInfo,
+  listenForHover = false
 }) => {
+  const [hovered, setHovered] = useState(false);
+  const open = listenForHover && hovered ? true : openMoreInfo;
   return /* @__PURE__ */ jsxs(
     Tooltip,
     {
-      open: openMoreInfo,
+      open,
       placement: "top",
       offset: 5,
       fallbackPlacements: ["right", "bottom", "left"],
       children: [
-        /* @__PURE__ */ jsx(Tooltip.Trigger, { className: styles["info-trigger"], children: /* @__PURE__ */ jsx(Icon, { svg: SvgInfo }) }),
+        /* @__PURE__ */ jsx(
+          Tooltip.Trigger,
+          {
+            className: styles["info-trigger"],
+            onMouseEnter: () => setHovered(true),
+            onMouseLeave: () => setHovered(false),
+            children: /* @__PURE__ */ jsx(Icon, { svg: SvgInfo })
+          }
+        ),
         /* @__PURE__ */ jsx(Tooltip.Content, { className: styles["info-content"], children: moreInfo })
       ]
     }
   );
 };
 
-const FieldLabel = forwardRef(
-  (props, ref) => {
-    const { children, className, moreInfo, required, openMoreInfo, ...rest } = props;
+const FieldLabelElement = forwardRef(
+  ({
+    el: Element = "label",
+    children,
+    className,
+    moreInfo,
+    required,
+    openMoreInfo,
+    ...props
+  }, ref) => {
     const FieldLabelClassNames = cx([styles["label"]], className);
     return /* @__PURE__ */ jsxs(
-      "label",
+      Element,
       {
         className: FieldLabelClassNames,
         "data-anv": "label",
         ref,
-        ...rest,
+        ...props,
         children: [
           /* @__PURE__ */ jsxs("div", { className: styles["top-container"], "aria-atomic": "true", children: [
             /* @__PURE__ */ jsxs("span", { className: styles["label-text"], children: [
@@ -70,7 +88,8 @@ const FieldLabel = forwardRef(
     );
   }
 );
-FieldLabel.displayName = "FieldLabel";
+FieldLabelElement.displayName = "FieldLabel";
+const FieldLabel = FieldLabelElement;
 
 export { FieldLabel as F };
-//# sourceMappingURL=FieldLabel-DIlzcPIQ.js.map
+//# sourceMappingURL=FieldLabel-CHMCV9wX.js.map

package/dist/FieldLabel-CHMCV9wX.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLabel-CHMCV9wX.js","sources":["../src/components/FieldLabel/internal/FieldLabelMoreInfoIcon.tsx","../src/components/FieldLabel/FieldLabel.tsx"],"sourcesContent":["import { FieldLabelProps } from \"../FieldLabel\";\nimport { Tooltip } from \"../../Tooltip\";\nimport { Icon } from \"../../Icon\";\nimport Info from \"@servicetitan/hammer-icon/mdi/round/info.svg\";\nimport styles from \"../FieldLabel.module.scss\";\nimport { useState } from \"react\";\n\n/**\n * Internal component for rendering the info icon with tooltip.\n *\n * @param props - Component props\n * @param props.moreInfo - The content to display in the tooltip\n * @param props.openMoreInfo - Controls the tooltip open state\n * @param props.listenForHover - Whether to listen for hover events\n */\nexport const FieldLabelMoreInfoIcon = ({\n  moreInfo,\n  openMoreInfo,\n  listenForHover = false,\n}: {\n  moreInfo: FieldLabelProps[\"moreInfo\"];\n  openMoreInfo: FieldLabelProps[\"openMoreInfo\"];\n  listenForHover?: boolean;\n}) => {\n  const [hovered, setHovered] = useState(false);\n  const open = listenForHover && hovered ? true : openMoreInfo;\n  return (\n    <Tooltip\n      open={open}\n      placement=\"top\"\n      offset={5}\n      fallbackPlacements={[\"right\", \"bottom\", \"left\"]}\n    >\n      <Tooltip.Trigger\n        className={styles[\"info-trigger\"]}\n        onMouseEnter={() => setHovered(true)}\n        onMouseLeave={() => setHovered(false)}\n      >\n        <Icon svg={Info} />\n      </Tooltip.Trigger>\n      <Tooltip.Content className={styles[\"info-content\"]}>\n        {moreInfo}\n      </Tooltip.Content>\n    </Tooltip>\n  );\n};\n","import {\n  forwardRef,\n  ComponentPropsWithoutRef,\n  ReactNode,\n  type ElementType,\n  type JSX,\n  type JSXElementConstructor,\n} from \"react\";\nimport cx from \"classnames\";\n\nimport styles from \"./FieldLabel.module.scss\";\nimport { TooltipProps } from \"../Tooltip\";\nimport { SrOnly } from \"../SrOnly\";\nimport { FieldLabelMoreInfoIcon } from \"./internal/FieldLabelMoreInfoIcon\";\n\ntype IntrinsicAttributes<\n  E extends keyof JSX.IntrinsicElements | JSXElementConstructor<unknown>,\n> = JSX.LibraryManagedAttributes<E, ComponentPropsWithoutRef<E>>;\n\ntype FieldLabelOwnProps<E extends ElementType = ElementType> = {\n  /** The HTML element to render */\n  el?: E;\n  /** Unique identifier for the label element */\n  id?: string;\n  /**\n   * Whether the field is required. Shows a red asterisk (*) when true.\n   * @default false\n   */\n  required?: boolean;\n  /** Additional information to display in a tooltip */\n  moreInfo?: ReactNode;\n  /**\n   * Controls the open state of the more info tooltip.\n   * @default false\n   */\n  openMoreInfo?: TooltipProps[\"open\"];\n};\n\n/**\n * Props for the FieldLabel component.\n */\nexport type FieldLabelProps<E extends ElementType = ElementType> =\n  FieldLabelOwnProps<E> &\n    Omit<IntrinsicAttributes<E>, keyof FieldLabelOwnProps>;\n\n/**\n * FieldLabel component for form field labels with optional required indicator and help tooltip.\n *\n * Features:\n * - Accessible form label with proper semantic HTML\n * - Optional required field indicator with red asterisk\n * - Help tooltip with info icon for additional context\n * - Screen reader support for required field announcement\n * - Controlled and uncontrolled tooltip state management\n * - Flexible content support for label text and help information\n * - Proper ARIA attributes and semantic structure\n * - Responsive design with consistent typography\n * - Polymorphic element support for different HTML elements\n *\n * @example\n * <FieldLabel as=\"label\" htmlFor=\"email\" required>\n *   Email Address\n * </FieldLabel>\n * <input id=\"email\" type=\"email\" />\n *\n * @example\n * <FieldLabel\n *   el=\"label\"\n *   htmlFor=\"password\"\n *   required\n *   moreInfo=\"Password must be at least 8 characters long\"\n * >\n *   Password\n * </FieldLabel>\n * <input id=\"password\" type=\"password\" />\n *\n * @example\n * <FieldLabel el=\"legend\" required>\n *   Form Section\n * </FieldLabel>\n */\nconst FieldLabelElement = forwardRef(\n  (\n    {\n      el: Element = \"label\",\n      children,\n      className,\n      moreInfo,\n      required,\n      openMoreInfo,\n      ...props\n    }: FieldLabelProps,\n    ref,\n  ) => {\n    const FieldLabelClassNames = cx([styles[\"label\"]], className);\n\n    return (\n      <Element\n        className={FieldLabelClassNames}\n        data-anv=\"label\"\n        ref={ref}\n        {...props}\n      >\n        <div className={styles[\"top-container\"]} aria-atomic=\"true\">\n          <span className={styles[\"label-text\"]}>\n            {children}\n            {required ? (\n              <>\n                <span aria-hidden className={styles[\"required\"]}>\n                  *\n                </span>\n                <SrOnly>Required</SrOnly>\n              </>\n            ) : null}\n          </span>\n          {moreInfo ? (\n            <FieldLabelMoreInfoIcon\n              moreInfo={moreInfo}\n              openMoreInfo={openMoreInfo}\n            />\n          ) : null}\n        </div>\n\n        {moreInfo ? <SrOnly>{moreInfo}</SrOnly> : null}\n      </Element>\n    );\n  },\n);\n\nFieldLabelElement.displayName = \"FieldLabel\";\n\nexport const FieldLabel = FieldLabelElement as <\n  E extends ElementType = \"label\",\n>(\n  props: FieldLabelProps<E>,\n) => JSX.Element;\n"],"names":["Info"],"mappings":";;;;;;;;;;;;;;;;;;;AAeO,MAAM,yBAAyB,CAAC;AAAA,EACrC,QAAA;AAAA,EACA,YAAA;AAAA,EACA,cAAA,GAAiB;AACnB,CAAA,KAIM;AACJ,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,SAAS,KAAK,CAAA;AAC5C,EAAA,MAAM,IAAA,GAAO,cAAA,IAAkB,OAAA,GAAU,IAAA,GAAO,YAAA;AAChD,EAAA,uBACE,IAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,SAAA,EAAU,KAAA;AAAA,MACV,MAAA,EAAQ,CAAA;AAAA,MACR,kBAAA,EAAoB,CAAC,OAAA,EAAS,QAAA,EAAU,MAAM,CAAA;AAAA,MAE9C,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,OAAA,CAAQ,OAAA;AAAA,UAAR;AAAA,YACC,SAAA,EAAW,OAAO,cAAc,CAAA;AAAA,YAChC,YAAA,EAAc,MAAM,UAAA,CAAW,IAAI,CAAA;AAAA,YACnC,YAAA,EAAc,MAAM,UAAA,CAAW,KAAK,CAAA;AAAA,YAEpC,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,GAAA,EAAKA,OAAA,EAAM;AAAA;AAAA,SACnB;AAAA,wBACA,GAAA,CAAC,QAAQ,OAAA,EAAR,EAAgB,WAAW,MAAA,CAAO,cAAc,GAC9C,QAAA,EAAA,QAAA,EACH;AAAA;AAAA;AAAA,GACF;AAEJ,CAAA;;ACoCA,MAAM,iBAAA,GAAoB,UAAA;AAAA,EACxB,CACE;AAAA,IACE,IAAI,OAAA,GAAU,OAAA;AAAA,IACd,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,MAAM,uBAAuB,EAAA,CAAG,CAAC,OAAO,OAAO,CAAC,GAAG,SAAS,CAAA;AAE5D,IAAA,uBACE,IAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,oBAAA;AAAA,QACX,UAAA,EAAS,OAAA;AAAA,QACT,GAAA;AAAA,QACC,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,SAAI,SAAA,EAAW,MAAA,CAAO,eAAe,CAAA,EAAG,eAAY,MAAA,EACnD,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,YAAY,CAAA,EACjC,QAAA,EAAA;AAAA,cAAA,QAAA;AAAA,cACA,2BACC,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,UAAK,aAAA,EAAW,IAAA,EAAC,WAAW,MAAA,CAAO,UAAU,GAAG,QAAA,EAAA,GAAA,EAEjD,CAAA;AAAA,gCACA,GAAA,CAAC,UAAO,QAAA,EAAA,UAAA,EAAQ;AAAA,eAAA,EAClB,CAAA,GACE;AAAA,aAAA,EACN,CAAA;AAAA,YACC,QAAA,mBACC,GAAA;AAAA,cAAC,sBAAA;AAAA,cAAA;AAAA,gBACC,QAAA;AAAA,gBACA;AAAA;AAAA,aACF,GACE;AAAA,WAAA,EACN,CAAA;AAAA,UAEC,QAAA,mBAAW,GAAA,CAAC,MAAA,EAAA,EAAQ,QAAA,EAAA,QAAA,EAAS,CAAA,GAAY;AAAA;AAAA;AAAA,KAC5C;AAAA,EAEJ;AACF,CAAA;AAEA,iBAAA,CAAkB,WAAA,GAAc,YAAA;AAEzB,MAAM,UAAA,GAAa;;;;"}

package/dist/FieldLabel.css

@@ -1,6 +1,6 @@
 @layer starter, reset, base, state, application;
 @layer reset {
-  ._label_jfzvd_2 {
+  ._label_wc4yy_2 {
     all: unset;
     font-family: var(--font-family-base, "Nunito Sans", sans-serif);
     font-size: 100%;
@@ -12,10 +12,25 @@
     border-color: transparent;
     box-sizing: border-box;
     display: revert-layer;
+    all: unset;
+    font-family: var(--font-family-base, "Nunito Sans", sans-serif);
+    font-size: 100%;
+    color: var(--foreground-color, #141414);
+    margin: 0;
+    padding: 0;
+    border-style: none;
+    border-width: 0;
+    border-color: transparent;
+    box-sizing: border-box;
+    display: revert-layer;
+  }
+  legend._label_wc4yy_2 {
+    border: 0px !important;
+    color: var(--foreground-color, #141414) !important;
   }
 }
 @layer base {
-  ._label_jfzvd_2 {
+  ._label_wc4yy_2 {
     all: unset;
     font-family: var(--font-family-base, "Nunito Sans", sans-serif);
     font-size: 100%;
@@ -35,26 +50,26 @@
     font-size: 0.875rem;
     line-height: 1;
   }
-  ._label_jfzvd_2 ._top-container_jfzvd_37 {
+  ._label_wc4yy_2 ._top-container_wc4yy_52 {
     display: flex;
     gap: 0.25rem;
     align-items: flex-start;
   }
-  ._label_jfzvd_2 ._label-text_jfzvd_42 {
+  ._label_wc4yy_2 ._label-text_wc4yy_57 {
     line-height: 1rem;
     font-weight: 600;
   }
-  ._label_jfzvd_2 ._label-text_jfzvd_42 ._required_jfzvd_46 {
+  ._label_wc4yy_2 ._label-text_wc4yy_57 ._required_wc4yy_61 {
     color: var(--foreground-color-danger, #e13212);
     margin-inline-start: 0.125rem;
     margin-inline-end: 0.125rem;
   }
-  ._label_jfzvd_2 ._info-trigger_jfzvd_51 {
+  ._label_wc4yy_2 ._info-trigger_wc4yy_66 {
     display: flex;
     align-items: center;
     cursor: pointer;
   }
-  ._label_jfzvd_2 ._info-content_jfzvd_56 {
+  ._label_wc4yy_2 ._info-content_wc4yy_71 {
     max-width: 15rem !important;
   }
 }

package/dist/FieldLabel.js

@@ -1,2 +1,2 @@
-export { F as FieldLabel, F as default } from './FieldLabel-DIlzcPIQ.js';
+export { F as FieldLabel, F as default } from './FieldLabel-CHMCV9wX.js';
 //# sourceMappingURL=FieldLabel.js.map

package/dist/{FieldMessage-BbARBii0.js → FieldMessage-DWONT3dr.js}

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { c as cx } from './index-tZvMCc77.js';
-import { I as Icon } from './Icon-TcJbUdTz.js';
+import { I as Icon } from './Icon-BSuTVNaa.js';
 import { S as SvgWarning } from './warning-c4Wj1rI4.js';
 
 import './FieldMessage.css';const messages = "_messages_1hr9l_1";
@@ -51,4 +51,4 @@ const FieldMessage = forwardRef(
 FieldMessage.displayName = "FieldMessage";
 
 export { FieldMessage as F };
-//# sourceMappingURL=FieldMessage-BbARBii0.js.map
+//# sourceMappingURL=FieldMessage-DWONT3dr.js.map

package/dist/{FieldMessage-BbARBii0.js.map → FieldMessage-DWONT3dr.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FieldMessage-BbARBii0.js","sources":["../src/components/FieldMessage/FieldMessage.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type AriaAttributes,\n  type ReactElement,\n  type ComponentPropsWithoutRef,\n} from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./FieldMessage.module.scss\";\nimport { Icon } from \"../Icon\";\nimport Error from \"@servicetitan/hammer-icon/mdi/round/warning.svg\";\n\n/**\n * Props for the FieldMessage component\n * @extends ComponentPropsWithoutRef<\"div\">\n */\nexport type FieldMessageProps = ComponentPropsWithoutRef<\"div\"> & {\n  /**\n   * Unique identifier for the field message container.\n   */\n  id?: string;\n  /**\n   * Hint text or element to display when there's no error.\n   */\n  hint?: ReactElement | string;\n  /**\n   * Description text or element to display below the main message.\n   */\n  description?: ReactElement | string;\n  /**\n   * Error message or element to display when there's an error.\n   */\n  errorMessage?: ReactElement | string;\n  /**\n   * aria-live attribute value for the error message.\n   * @default assertive\n   * @remarks Controls how screen readers announce error messages. \"assertive\" interrupts current speech, \"polite\" waits for current speech to finish.\n   * @link https://www.w3.org/WAI/tutorials/forms/notifications/\n   */\n  errorAriaLive?: AriaAttributes[\"aria-live\"];\n};\n\n/**\n * FieldMessage component for displaying hints, descriptions, and error messages for form fields.\n *\n * Features:\n * - Displays hint text when no error is present\n * - Shows error messages with warning icon when errors occur\n * - Supports both string and React element content\n * - Configurable aria-live behavior for screen readers\n * - Optional description text for additional context\n * - Accessible with proper ARIA attributes\n * - Visual error indicators with warning icons\n * - Conditional rendering based on error state\n * - Supports layout utilities for positioning and spacing\n *\n * @example\n * <FieldMessage\n *   hint=\"Enter your email address\"\n *   description=\"We'll use this to send you updates\"\n *   errorMessage=\"Please enter a valid email address\"\n * />\n */\nexport const FieldMessage = forwardRef<HTMLDivElement, FieldMessageProps>(\n  (props, ref) => {\n    const {\n      id,\n      hint,\n      description,\n      errorAriaLive = \"assertive\",\n      errorMessage,\n      className,\n      ...rest\n    } = props;\n\n    return (\n      <div\n        {...rest}\n        className={cx(styles[\"messages\"], className)}\n        ref={ref}\n        id={id}\n      >\n        {errorMessage ? (\n          <div className={styles[\"error-container\"]}>\n            <Icon\n              inherit\n              className={styles[\"error-icon\"]}\n              aria-hidden\n              svg={Error}\n            />\n            <span className={styles[\"error-message\"]} aria-live={errorAriaLive}>\n              {errorMessage}\n            </span>\n          </div>\n        ) : (\n          (hint ?? null)\n        )}\n        {description ? (\n          <div className={styles[\"description-container\"]}>\n            {description ? <span>{description}</span> : null}\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\n\nFieldMessage.displayName = \"FieldMessage\";\n"],"names":["Error"],"mappings":";;;;;;;;;;;;;AA8DO,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM;AAAA,MACJ,EAAA;AAAA,MACA,IAAA;AAAA,MACA,WAAA;AAAA,MACA,aAAA,GAAgB,WAAA;AAAA,MAChB,YAAA;AAAA,MACA,SAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACE,GAAG,IAAA;AAAA,QACJ,SAAA,EAAW,EAAA,CAAG,MAAA,CAAO,UAAU,GAAG,SAAS,CAAA;AAAA,QAC3C,GAAA;AAAA,QACA,EAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,YAAA,mBACC,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,iBAAiB,CAAA,EACtC,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,IAAA;AAAA,cAAA;AAAA,gBACC,OAAA,EAAO,IAAA;AAAA,gBACP,SAAA,EAAW,OAAO,YAAY,CAAA;AAAA,gBAC9B,aAAA,EAAW,IAAA;AAAA,gBACX,GAAA,EAAKA;AAAA;AAAA,aACP;AAAA,4BACA,GAAA,CAAC,UAAK,SAAA,EAAW,MAAA,CAAO,eAAe,CAAA,EAAG,WAAA,EAAW,eAClD,QAAA,EAAA,YAAA,EACH;AAAA,WAAA,EACF,IAEC,IAAA,IAAQ,IAAA;AAAA,UAEV,WAAA,mBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,uBAAuB,CAAA,EAC3C,QAAA,EAAA,WAAA,mBAAc,GAAA,CAAC,MAAA,EAAA,EAAM,QAAA,EAAA,WAAA,EAAY,CAAA,GAAU,MAC9C,CAAA,GACE;AAAA;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;;;"}
+{"version":3,"file":"FieldMessage-DWONT3dr.js","sources":["../src/components/FieldMessage/FieldMessage.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type AriaAttributes,\n  type ReactElement,\n  type ComponentPropsWithoutRef,\n} from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./FieldMessage.module.scss\";\nimport { Icon } from \"../Icon\";\nimport Error from \"@servicetitan/hammer-icon/mdi/round/warning.svg\";\n\n/**\n * Props for the FieldMessage component\n * @extends ComponentPropsWithoutRef<\"div\">\n */\nexport type FieldMessageProps = ComponentPropsWithoutRef<\"div\"> & {\n  /**\n   * Unique identifier for the field message container.\n   */\n  id?: string;\n  /**\n   * Hint text or element to display when there's no error.\n   */\n  hint?: ReactElement | string;\n  /**\n   * Description text or element to display below the main message.\n   */\n  description?: ReactElement | string;\n  /**\n   * Error message or element to display when there's an error.\n   */\n  errorMessage?: ReactElement | string;\n  /**\n   * aria-live attribute value for the error message.\n   * @default assertive\n   * @remarks Controls how screen readers announce error messages. \"assertive\" interrupts current speech, \"polite\" waits for current speech to finish.\n   * @link https://www.w3.org/WAI/tutorials/forms/notifications/\n   */\n  errorAriaLive?: AriaAttributes[\"aria-live\"];\n};\n\n/**\n * FieldMessage component for displaying hints, descriptions, and error messages for form fields.\n *\n * Features:\n * - Displays hint text when no error is present\n * - Shows error messages with warning icon when errors occur\n * - Supports both string and React element content\n * - Configurable aria-live behavior for screen readers\n * - Optional description text for additional context\n * - Accessible with proper ARIA attributes\n * - Visual error indicators with warning icons\n * - Conditional rendering based on error state\n * - Supports layout utilities for positioning and spacing\n *\n * @example\n * <FieldMessage\n *   hint=\"Enter your email address\"\n *   description=\"We'll use this to send you updates\"\n *   errorMessage=\"Please enter a valid email address\"\n * />\n */\nexport const FieldMessage = forwardRef<HTMLDivElement, FieldMessageProps>(\n  (props, ref) => {\n    const {\n      id,\n      hint,\n      description,\n      errorAriaLive = \"assertive\",\n      errorMessage,\n      className,\n      ...rest\n    } = props;\n\n    return (\n      <div\n        {...rest}\n        className={cx(styles[\"messages\"], className)}\n        ref={ref}\n        id={id}\n      >\n        {errorMessage ? (\n          <div className={styles[\"error-container\"]}>\n            <Icon\n              inherit\n              className={styles[\"error-icon\"]}\n              aria-hidden\n              svg={Error}\n            />\n            <span className={styles[\"error-message\"]} aria-live={errorAriaLive}>\n              {errorMessage}\n            </span>\n          </div>\n        ) : (\n          (hint ?? null)\n        )}\n        {description ? (\n          <div className={styles[\"description-container\"]}>\n            {description ? <span>{description}</span> : null}\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\n\nFieldMessage.displayName = \"FieldMessage\";\n"],"names":["Error"],"mappings":";;;;;;;;;;;;;AA8DO,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM;AAAA,MACJ,EAAA;AAAA,MACA,IAAA;AAAA,MACA,WAAA;AAAA,MACA,aAAA,GAAgB,WAAA;AAAA,MAChB,YAAA;AAAA,MACA,SAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACE,GAAG,IAAA;AAAA,QACJ,SAAA,EAAW,EAAA,CAAG,MAAA,CAAO,UAAU,GAAG,SAAS,CAAA;AAAA,QAC3C,GAAA;AAAA,QACA,EAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,YAAA,mBACC,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,iBAAiB,CAAA,EACtC,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,IAAA;AAAA,cAAA;AAAA,gBACC,OAAA,EAAO,IAAA;AAAA,gBACP,SAAA,EAAW,OAAO,YAAY,CAAA;AAAA,gBAC9B,aAAA,EAAW,IAAA;AAAA,gBACX,GAAA,EAAKA;AAAA;AAAA,aACP;AAAA,4BACA,GAAA,CAAC,UAAK,SAAA,EAAW,MAAA,CAAO,eAAe,CAAA,EAAG,WAAA,EAAW,eAClD,QAAA,EAAA,YAAA,EACH;AAAA,WAAA,EACF,IAEC,IAAA,IAAQ,IAAA;AAAA,UAEV,WAAA,mBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,uBAAuB,CAAA,EAC3C,QAAA,EAAA,WAAA,mBAAc,GAAA,CAAC,MAAA,EAAA,EAAM,QAAA,EAAA,WAAA,EAAY,CAAA,GAAU,MAC9C,CAAA,GACE;AAAA;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;;;"}

package/dist/FieldMessage.js

@@ -1,2 +1,2 @@
-export { F as FieldMessage, F as default } from './FieldMessage-BbARBii0.js';
+export { F as FieldMessage, F as default } from './FieldMessage-DWONT3dr.js';
 //# sourceMappingURL=FieldMessage.js.map

package/dist/{Flex-GLF5XRJg.js → Flex-CjPHUTeq.js}

@@ -1,7 +1,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { c as cx } from './index-tZvMCc77.js';
-import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-C7FVYB8F.js';
+import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
 
 import './Flex.css';const flex = "_flex_3ncub_2";
 const styles = {
@@ -97,4 +97,4 @@ const Flex = forwardRef((props, ref) => {
 Flex.displayName = "Flex";
 
 export { Flex as F };
-//# sourceMappingURL=Flex-GLF5XRJg.js.map
+//# sourceMappingURL=Flex-CjPHUTeq.js.map

package/dist/{Flex-GLF5XRJg.js.map → Flex-CjPHUTeq.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Flex-GLF5XRJg.js","sources":["../src/components/Flex/Flex.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./Flex.module.scss\";\nimport { FlexSpecificProps } from \"./internal/FlexSpecificProps\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\n/**\n * Props for the Flex component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends FlexSpecificProps\n */\nexport type FlexProps = ComponentPropsWithoutRef<\"div\"> &\n  FlexSpecificProps & {\n    /**\n     * Responsive props for small screens (sm breakpoint).\n     */\n    sm?: FlexSpecificProps;\n    /**\n     * Responsive props for medium screens (md breakpoint).\n     */\n    md?: FlexSpecificProps;\n    /**\n     * Responsive props for large screens (lg breakpoint).\n     */\n    lg?: FlexSpecificProps;\n    /**\n     * Responsive props for extra large screens (xl breakpoint).\n     */\n    xl?: FlexSpecificProps;\n    /**\n     * Responsive props for extra extra large screens (xxl breakpoint).\n     */\n    xxl?: FlexSpecificProps;\n  };\n\n/**\n * Flex component for creating flexible layouts using CSS Flexbox.\n *\n * Features:\n * - CSS Flexbox layout with full control over flex properties\n * - Support for both flex and inline-flex display modes\n * - Responsive design with breakpoint-specific props (sm, md, lg, xl, xxl)\n * - Comprehensive layout utilities for spacing, alignment, and positioning\n * - Automatic style generation and class management\n * - Support for all standard div element props\n * - Flexible direction, grow, shrink, basis, and wrap controls\n * - Deprecated flexShrink prop with modern shrink alternative\n *\n * @example\n * <Flex direction=\"row\" gap=\"4\" alignItems=\"center\">\n *   <div>Item 1</div>\n *   <div>Item 2</div>\n *   <div>Item 3</div>\n * </Flex>\n *\n * @example\n * <Flex\n *   direction=\"column\"\n *   gap=\"2\"\n *   md={{ direction: \"row\", gap: \"4\" }}\n * >\n *   <div>Item 1</div>\n *   <div>Item 2</div>\n *   <div>Item 3</div>\n * </Flex>\n */\nexport const Flex = forwardRef<HTMLDivElement, FlexProps>((props, ref) => {\n  const {\n    inline,\n    direction,\n    grow,\n    shrink,\n    basis,\n    wrap,\n    sm,\n    md,\n    lg,\n    xl,\n    xxl,\n    ...nonLayoutProps\n  } = props;\n  const combineLayoutProps = {\n    ...nonLayoutProps,\n    flexDirection: direction,\n    flexGrow: grow,\n    flexShrink: shrink,\n    flexBasis: basis,\n    flexWrap: wrap,\n    sm: {\n      ...sm,\n      flexDirection: sm?.direction,\n      flexGrow: sm?.grow,\n      flexShrink: sm?.shrink,\n      flexBasis: sm?.basis,\n      flexWrap: sm?.wrap,\n    },\n    md: {\n      ...md,\n      flexDirection: md?.direction,\n      flexGrow: md?.grow,\n      flexShrink: md?.shrink,\n      flexBasis: md?.basis,\n      flexWrap: md?.wrap,\n    },\n    lg: {\n      ...lg,\n      flexDirection: lg?.direction,\n      flexGrow: lg?.grow,\n      flexShrink: lg?.shrink,\n      flexBasis: lg?.basis,\n      flexWrap: lg?.wrap,\n    },\n    xl: {\n      ...xl,\n      flexDirection: xl?.direction,\n      flexGrow: xl?.grow,\n      flexShrink: xl?.shrink,\n      flexBasis: xl?.basis,\n      flexWrap: xl?.wrap,\n    },\n    xxl: {\n      ...xxl,\n      flexDirection: xxl?.direction,\n      flexGrow: xxl?.grow,\n      flexShrink: xxl?.shrink,\n      flexBasis: xxl?.basis,\n      flexWrap: xxl?.wrap,\n    },\n  };\n  const { layoutStyles, componentProps } =\n    useLayoutPropsUtil(combineLayoutProps);\n\n  const { children, className, style, ...rest } = componentProps;\n\n  const flexClassNames = cx(className, {\n    [styles[\"flex\"]]: !inline,\n    [styles[\"inline-flex\"]]: inline,\n  });\n\n  const styleCombined = {\n    ...style,\n    ...layoutStyles,\n  };\n\n  return (\n    <div\n      className={flexClassNames}\n      data-anv=\"flex\"\n      style={styleCombined}\n      ref={ref}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n});\n\nFlex.displayName = \"Flex\";\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Flex-CjPHUTeq.js","sources":["../src/components/Flex/Flex.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./Flex.module.scss\";\nimport { FlexSpecificProps } from \"./internal/FlexSpecificProps\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\n/**\n * Props for the Flex component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends FlexSpecificProps\n */\nexport type FlexProps = ComponentPropsWithoutRef<\"div\"> &\n  FlexSpecificProps & {\n    /**\n     * Responsive props for small screens (sm breakpoint).\n     */\n    sm?: FlexSpecificProps;\n    /**\n     * Responsive props for medium screens (md breakpoint).\n     */\n    md?: FlexSpecificProps;\n    /**\n     * Responsive props for large screens (lg breakpoint).\n     */\n    lg?: FlexSpecificProps;\n    /**\n     * Responsive props for extra large screens (xl breakpoint).\n     */\n    xl?: FlexSpecificProps;\n    /**\n     * Responsive props for extra extra large screens (xxl breakpoint).\n     */\n    xxl?: FlexSpecificProps;\n  };\n\n/**\n * Flex component for creating flexible layouts using CSS Flexbox.\n *\n * Features:\n * - CSS Flexbox layout with full control over flex properties\n * - Support for both flex and inline-flex display modes\n * - Responsive design with breakpoint-specific props (sm, md, lg, xl, xxl)\n * - Comprehensive layout utilities for spacing, alignment, and positioning\n * - Automatic style generation and class management\n * - Support for all standard div element props\n * - Flexible direction, grow, shrink, basis, and wrap controls\n * - Deprecated flexShrink prop with modern shrink alternative\n *\n * @example\n * <Flex direction=\"row\" gap=\"4\" alignItems=\"center\">\n *   <div>Item 1</div>\n *   <div>Item 2</div>\n *   <div>Item 3</div>\n * </Flex>\n *\n * @example\n * <Flex\n *   direction=\"column\"\n *   gap=\"2\"\n *   md={{ direction: \"row\", gap: \"4\" }}\n * >\n *   <div>Item 1</div>\n *   <div>Item 2</div>\n *   <div>Item 3</div>\n * </Flex>\n */\nexport const Flex = forwardRef<HTMLDivElement, FlexProps>((props, ref) => {\n  const {\n    inline,\n    direction,\n    grow,\n    shrink,\n    basis,\n    wrap,\n    sm,\n    md,\n    lg,\n    xl,\n    xxl,\n    ...nonLayoutProps\n  } = props;\n  const combineLayoutProps = {\n    ...nonLayoutProps,\n    flexDirection: direction,\n    flexGrow: grow,\n    flexShrink: shrink,\n    flexBasis: basis,\n    flexWrap: wrap,\n    sm: {\n      ...sm,\n      flexDirection: sm?.direction,\n      flexGrow: sm?.grow,\n      flexShrink: sm?.shrink,\n      flexBasis: sm?.basis,\n      flexWrap: sm?.wrap,\n    },\n    md: {\n      ...md,\n      flexDirection: md?.direction,\n      flexGrow: md?.grow,\n      flexShrink: md?.shrink,\n      flexBasis: md?.basis,\n      flexWrap: md?.wrap,\n    },\n    lg: {\n      ...lg,\n      flexDirection: lg?.direction,\n      flexGrow: lg?.grow,\n      flexShrink: lg?.shrink,\n      flexBasis: lg?.basis,\n      flexWrap: lg?.wrap,\n    },\n    xl: {\n      ...xl,\n      flexDirection: xl?.direction,\n      flexGrow: xl?.grow,\n      flexShrink: xl?.shrink,\n      flexBasis: xl?.basis,\n      flexWrap: xl?.wrap,\n    },\n    xxl: {\n      ...xxl,\n      flexDirection: xxl?.direction,\n      flexGrow: xxl?.grow,\n      flexShrink: xxl?.shrink,\n      flexBasis: xxl?.basis,\n      flexWrap: xxl?.wrap,\n    },\n  };\n  const { layoutStyles, componentProps } =\n    useLayoutPropsUtil(combineLayoutProps);\n\n  const { children, className, style, ...rest } = componentProps;\n\n  const flexClassNames = cx(className, {\n    [styles[\"flex\"]]: !inline,\n    [styles[\"inline-flex\"]]: inline,\n  });\n\n  const styleCombined = {\n    ...style,\n    ...layoutStyles,\n  };\n\n  return (\n    <div\n      className={flexClassNames}\n      data-anv=\"flex\"\n      style={styleCombined}\n      ref={ref}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n});\n\nFlex.displayName = \"Flex\";\n"],"names":[],"mappings":"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"}

package/dist/Flex.js

@@ -1,2 +1,2 @@
-export { F as Flex, F as default } from './Flex-GLF5XRJg.js';
+export { F as Flex, F as default } from './Flex-CjPHUTeq.js';
 //# sourceMappingURL=Flex.js.map

package/dist/{Grid-BpAt2zA7.js → Grid-DW2cAuHi.js}

@@ -1,7 +1,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { c as cx } from './index-tZvMCc77.js';
-import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-C7FVYB8F.js';
+import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
 
 import './Grid.css';const grid = "_grid_1yq7u_2";
 const styles = {
@@ -144,4 +144,4 @@ const Grid = Object.assign(GridElement, {
 });
 
 export { Grid as G };
-//# sourceMappingURL=Grid-BpAt2zA7.js.map
+//# sourceMappingURL=Grid-DW2cAuHi.js.map

package/dist/{Grid-BpAt2zA7.js.map → Grid-DW2cAuHi.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Grid-BpAt2zA7.js","sources":["../src/components/Grid/internal/GridItem.tsx","../src/components/Grid/Grid.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\n\nimport styles from \"../Grid.module.scss\";\nimport { useLayoutPropsUtil } from \"../../../internal/hooks\";\nimport { LayoutUtilProps } from \"../../../types\";\n\n/**\n * Props for the GridItem component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends LayoutUtilProps\n */\nexport type GridItemProps = ComponentPropsWithoutRef<\"div\"> & LayoutUtilProps;\n\n/**\n * GridItem component for individual items within a CSS Grid layout.\n *\n * Features:\n * - Individual grid item with full layout utility support\n * - Automatic grid item styling and class management\n * - Comprehensive layout utilities for positioning and sizing\n * - Support for all standard div element props\n * - Flexible grid positioning and sizing controls\n * - Automatic style generation and class management\n * - Works seamlessly with Grid component\n *\n * @example\n * <Grid templateColumns=\"repeat(2, 1fr)\" gap=\"4\">\n *   <Grid.Item>Grid Item 1</Grid.Item>\n *   <Grid.Item>Grid Item 2</Grid.Item>\n * </Grid>\n */\nexport const GridItem = forwardRef<HTMLDivElement, GridItemProps>(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const { className, children, style, ...rest } = componentProps;\n\n    const gridItemClassNames = cx([styles[\"grid-item\"]], className, {});\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n\n    return (\n      <div\n        className={gridItemClassNames}\n        data-anv=\"grid-item\"\n        ref={ref}\n        style={styleCombined}\n        {...rest}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\nGridItem.displayName = \"GridItem\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\n\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport styles from \"./Grid.module.scss\";\nimport { GridSpecificProps } from \"./internal/GridSpecificProps\";\nimport { GridItem } from \"./internal/GridItem\";\n\n/**\n * Props for the Grid component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends GridSpecificProps\n */\nexport type GridProps = ComponentPropsWithoutRef<\"div\"> & {\n  /**\n   * Applies `display: inline-grid` instead of `grid`\n   */\n  inline?: boolean;\n} & GridSpecificProps & {\n    /**\n     * Responsive props for small screens (sm breakpoint).\n     */\n    sm?: GridSpecificProps;\n    /**\n     * Responsive props for medium screens (md breakpoint).\n     */\n    md?: GridSpecificProps;\n    /**\n     * Responsive props for large screens (lg breakpoint).\n     */\n    lg?: GridSpecificProps;\n    /**\n     * Responsive props for extra large screens (xl breakpoint).\n     */\n    xl?: GridSpecificProps;\n    /**\n     * Responsive props for extra extra large screens (xxl breakpoint).\n     */\n    xxl?: GridSpecificProps;\n  };\n\nconst GridElement = forwardRef<HTMLDivElement, GridProps>((props, ref) => {\n  const {\n    inline,\n    templateColumns,\n    templateRows,\n    templateAreas,\n    autoColumns,\n    autoRows,\n    sm,\n    md,\n    lg,\n    xl,\n    xxl,\n    ...nonLayoutProps\n  } = props;\n  const combineLayoutProps = {\n    ...nonLayoutProps,\n    gridTemplateColumns: props.templateColumns,\n    gridTemplateRows: props.templateRows,\n    gridTemplateAreas: props.templateAreas,\n    gridAutoColumns: props.autoColumns,\n    gridAutoRows: props.autoRows,\n    sm: {\n      ...sm,\n      gridTemplateColumns: sm?.templateColumns,\n      gridTemplateRows: sm?.templateRows,\n      gridTemplateAreas: sm?.templateAreas,\n      gridAutoColumns: sm?.autoColumns,\n      gridAutoRows: sm?.autoRows,\n    },\n    md: {\n      ...md,\n      gridTemplateColumns: md?.templateColumns,\n      gridTemplateRows: md?.templateRows,\n      gridTemplateAreas: md?.templateAreas,\n      gridAutoColumns: md?.autoColumns,\n      gridAutoRows: md?.autoRows,\n    },\n    lg: {\n      ...lg,\n      gridTemplateColumns: lg?.templateColumns,\n      gridTemplateRows: lg?.templateRows,\n      gridTemplateAreas: lg?.templateAreas,\n      gridAutoColumns: lg?.autoColumns,\n      gridAutoRows: lg?.autoRows,\n    },\n    xl: {\n      ...xl,\n      gridTemplateColumns: xl?.templateColumns,\n      gridTemplateRows: xl?.templateRows,\n      gridTemplateAreas: xl?.templateAreas,\n      gridAutoColumns: xl?.autoColumns,\n      gridAutoRows: xl?.autoRows,\n    },\n    xxl: {\n      ...xxl,\n      gridTemplateColumns: xxl?.templateColumns,\n      gridTemplateRows: xxl?.templateRows,\n      gridTemplateAreas: xxl?.templateAreas,\n      gridAutoColumns: xxl?.autoColumns,\n      gridAutoRows: xxl?.autoRows,\n    },\n  };\n  const { layoutStyles, componentProps } =\n    useLayoutPropsUtil(combineLayoutProps);\n  const { children, className, style, ...rest } = componentProps;\n\n  const gridClassNames = cx(className, {\n    [styles[\"grid\"]]: !inline,\n    [styles[\"inline-grid\"]]: inline,\n  });\n\n  const styleCombined = {\n    ...style,\n    ...layoutStyles,\n  };\n\n  return (\n    <div\n      className={gridClassNames}\n      data-anv=\"grid\"\n      style={styleCombined}\n      ref={ref}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n});\n\nGridElement.displayName = \"Grid\";\n\n/**\n * Grid component for creating CSS Grid layouts with responsive design.\n *\n * Features:\n * - CSS Grid layout with full control over grid properties\n * - Support for both grid and inline-grid display modes\n * - Responsive design with breakpoint-specific props (sm, md, lg, xl, xxl)\n * - Comprehensive layout utilities for spacing, alignment, and positioning\n * - Template columns, rows, and areas configuration\n * - Auto columns and rows sizing\n * - Automatic style generation and class management\n * - Support for all standard div element props\n * - Flexible grid template and auto-sizing controls\n * - Automatic tracking ID generation for analytics\n * - Compound component structure with Item sub-component\n *\n * @example\n * <Grid templateColumns=\"repeat(3, 1fr)\" gap=\"4\">\n *   <Grid.Item>Grid Item 1</Grid.Item>\n *   <Grid.Item>Grid Item 2</Grid.Item>\n *   <Grid.Item>Grid Item 3</Grid.Item>\n * </Grid>\n *\n * @example\n * <Grid\n *   templateColumns=\"repeat(1, 1fr)\"\n *   gap=\"2\"\n *   md={{ templateColumns: \"repeat(3, 1fr)\", gap: \"4\" }}\n * >\n *   <Grid.Item>Grid Item 1</Grid.Item>\n *   <Grid.Item>Grid Item 2</Grid.Item>\n *   <Grid.Item>Grid Item 3</Grid.Item>\n * </Grid>\n */\nexport const Grid = Object.assign(GridElement, {\n  /**\n   * GridItem component for individual items within a CSS Grid layout.\n   *\n   * Features:\n   * - Individual grid item with full layout utility support\n   * - Automatic grid item styling and class management\n   * - Comprehensive layout utilities for positioning and sizing\n   * - Support for all standard div element props\n   * - Flexible grid positioning and sizing controls\n   * - Automatic style generation and class management\n   * - Works seamlessly with Grid component\n   * - Automatic tracking ID generation for analytics\n   *\n   * @example\n   * <Grid templateColumns=\"repeat(2, 1fr)\" gap=\"4\">\n   *   <Grid.Item>Grid Item 1</Grid.Item>\n   *   <Grid.Item>Grid Item 2</Grid.Item>\n   * </Grid>\n   */\n  Item: GridItem,\n});\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Grid-DW2cAuHi.js","sources":["../src/components/Grid/internal/GridItem.tsx","../src/components/Grid/Grid.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\n\nimport styles from \"../Grid.module.scss\";\nimport { useLayoutPropsUtil } from \"../../../internal/hooks\";\nimport { LayoutUtilProps } from \"../../../types\";\n\n/**\n * Props for the GridItem component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends LayoutUtilProps\n */\nexport type GridItemProps = ComponentPropsWithoutRef<\"div\"> & LayoutUtilProps;\n\n/**\n * GridItem component for individual items within a CSS Grid layout.\n *\n * Features:\n * - Individual grid item with full layout utility support\n * - Automatic grid item styling and class management\n * - Comprehensive layout utilities for positioning and sizing\n * - Support for all standard div element props\n * - Flexible grid positioning and sizing controls\n * - Automatic style generation and class management\n * - Works seamlessly with Grid component\n *\n * @example\n * <Grid templateColumns=\"repeat(2, 1fr)\" gap=\"4\">\n *   <Grid.Item>Grid Item 1</Grid.Item>\n *   <Grid.Item>Grid Item 2</Grid.Item>\n * </Grid>\n */\nexport const GridItem = forwardRef<HTMLDivElement, GridItemProps>(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const { className, children, style, ...rest } = componentProps;\n\n    const gridItemClassNames = cx([styles[\"grid-item\"]], className, {});\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n\n    return (\n      <div\n        className={gridItemClassNames}\n        data-anv=\"grid-item\"\n        ref={ref}\n        style={styleCombined}\n        {...rest}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\nGridItem.displayName = \"GridItem\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\n\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport styles from \"./Grid.module.scss\";\nimport { GridSpecificProps } from \"./internal/GridSpecificProps\";\nimport { GridItem } from \"./internal/GridItem\";\n\n/**\n * Props for the Grid component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends GridSpecificProps\n */\nexport type GridProps = ComponentPropsWithoutRef<\"div\"> & {\n  /**\n   * Applies `display: inline-grid` instead of `grid`\n   */\n  inline?: boolean;\n} & GridSpecificProps & {\n    /**\n     * Responsive props for small screens (sm breakpoint).\n     */\n    sm?: GridSpecificProps;\n    /**\n     * Responsive props for medium screens (md breakpoint).\n     */\n    md?: GridSpecificProps;\n    /**\n     * Responsive props for large screens (lg breakpoint).\n     */\n    lg?: GridSpecificProps;\n    /**\n     * Responsive props for extra large screens (xl breakpoint).\n     */\n    xl?: GridSpecificProps;\n    /**\n     * Responsive props for extra extra large screens (xxl breakpoint).\n     */\n    xxl?: GridSpecificProps;\n  };\n\nconst GridElement = forwardRef<HTMLDivElement, GridProps>((props, ref) => {\n  const {\n    inline,\n    templateColumns,\n    templateRows,\n    templateAreas,\n    autoColumns,\n    autoRows,\n    sm,\n    md,\n    lg,\n    xl,\n    xxl,\n    ...nonLayoutProps\n  } = props;\n  const combineLayoutProps = {\n    ...nonLayoutProps,\n    gridTemplateColumns: props.templateColumns,\n    gridTemplateRows: props.templateRows,\n    gridTemplateAreas: props.templateAreas,\n    gridAutoColumns: props.autoColumns,\n    gridAutoRows: props.autoRows,\n    sm: {\n      ...sm,\n      gridTemplateColumns: sm?.templateColumns,\n      gridTemplateRows: sm?.templateRows,\n      gridTemplateAreas: sm?.templateAreas,\n      gridAutoColumns: sm?.autoColumns,\n      gridAutoRows: sm?.autoRows,\n    },\n    md: {\n      ...md,\n      gridTemplateColumns: md?.templateColumns,\n      gridTemplateRows: md?.templateRows,\n      gridTemplateAreas: md?.templateAreas,\n      gridAutoColumns: md?.autoColumns,\n      gridAutoRows: md?.autoRows,\n    },\n    lg: {\n      ...lg,\n      gridTemplateColumns: lg?.templateColumns,\n      gridTemplateRows: lg?.templateRows,\n      gridTemplateAreas: lg?.templateAreas,\n      gridAutoColumns: lg?.autoColumns,\n      gridAutoRows: lg?.autoRows,\n    },\n    xl: {\n      ...xl,\n      gridTemplateColumns: xl?.templateColumns,\n      gridTemplateRows: xl?.templateRows,\n      gridTemplateAreas: xl?.templateAreas,\n      gridAutoColumns: xl?.autoColumns,\n      gridAutoRows: xl?.autoRows,\n    },\n    xxl: {\n      ...xxl,\n      gridTemplateColumns: xxl?.templateColumns,\n      gridTemplateRows: xxl?.templateRows,\n      gridTemplateAreas: xxl?.templateAreas,\n      gridAutoColumns: xxl?.autoColumns,\n      gridAutoRows: xxl?.autoRows,\n    },\n  };\n  const { layoutStyles, componentProps } =\n    useLayoutPropsUtil(combineLayoutProps);\n  const { children, className, style, ...rest } = componentProps;\n\n  const gridClassNames = cx(className, {\n    [styles[\"grid\"]]: !inline,\n    [styles[\"inline-grid\"]]: inline,\n  });\n\n  const styleCombined = {\n    ...style,\n    ...layoutStyles,\n  };\n\n  return (\n    <div\n      className={gridClassNames}\n      data-anv=\"grid\"\n      style={styleCombined}\n      ref={ref}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n});\n\nGridElement.displayName = \"Grid\";\n\n/**\n * Grid component for creating CSS Grid layouts with responsive design.\n *\n * Features:\n * - CSS Grid layout with full control over grid properties\n * - Support for both grid and inline-grid display modes\n * - Responsive design with breakpoint-specific props (sm, md, lg, xl, xxl)\n * - Comprehensive layout utilities for spacing, alignment, and positioning\n * - Template columns, rows, and areas configuration\n * - Auto columns and rows sizing\n * - Automatic style generation and class management\n * - Support for all standard div element props\n * - Flexible grid template and auto-sizing controls\n * - Automatic tracking ID generation for analytics\n * - Compound component structure with Item sub-component\n *\n * @example\n * <Grid templateColumns=\"repeat(3, 1fr)\" gap=\"4\">\n *   <Grid.Item>Grid Item 1</Grid.Item>\n *   <Grid.Item>Grid Item 2</Grid.Item>\n *   <Grid.Item>Grid Item 3</Grid.Item>\n * </Grid>\n *\n * @example\n * <Grid\n *   templateColumns=\"repeat(1, 1fr)\"\n *   gap=\"2\"\n *   md={{ templateColumns: \"repeat(3, 1fr)\", gap: \"4\" }}\n * >\n *   <Grid.Item>Grid Item 1</Grid.Item>\n *   <Grid.Item>Grid Item 2</Grid.Item>\n *   <Grid.Item>Grid Item 3</Grid.Item>\n * </Grid>\n */\nexport const Grid = Object.assign(GridElement, {\n  /**\n   * GridItem component for individual items within a CSS Grid layout.\n   *\n   * Features:\n   * - Individual grid item with full layout utility support\n   * - Automatic grid item styling and class management\n   * - Comprehensive layout utilities for positioning and sizing\n   * - Support for all standard div element props\n   * - Flexible grid positioning and sizing controls\n   * - Automatic style generation and class management\n   * - Works seamlessly with Grid component\n   * - Automatic tracking ID generation for analytics\n   *\n   * @example\n   * <Grid templateColumns=\"repeat(2, 1fr)\" gap=\"4\">\n   *   <Grid.Item>Grid Item 1</Grid.Item>\n   *   <Grid.Item>Grid Item 2</Grid.Item>\n   * </Grid>\n   */\n  Item: GridItem,\n});\n"],"names":[],"mappings":"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"}