@servicetitan/anvil2 1.49.5 → 1.49.7

package/dist/Popover.css

@@ -50,7 +50,7 @@
   }
 }@layer starter, reset, base, state, application;
 @layer reset {
-  ._content_yo27y_2 {
+  ._content_zhizt_2 {
     all: unset;
     font-family: var(--font-family-base, "Nunito Sans", sans-serif);
     font-size: 100%;
@@ -65,7 +65,8 @@
   }
 }
 @layer base {
-  ._content_yo27y_2 {
+  ._content_zhizt_2 {
+    --popover-bridge-size: 8px;
     width: -moz-max-content;
     width: max-content;
     max-width: calc(100% - 1.5rem);
@@ -78,7 +79,7 @@
     opacity: 0;
     transition: opacity 100ms, width 100ms, height 100ms, overlay 100ms allow-discrete, display 100ms allow-discrete;
   }
-  ._content_yo27y_2 ._scroller_yo27y_29 {
+  ._content_zhizt_2 ._scroller_zhizt_30 {
     height: inherit;
     box-sizing: border-box;
     padding: 1rem;
@@ -86,32 +87,62 @@
     max-height: inherit;
     min-height: inherit;
   }
-  ._arrow_yo27y_37 {
+  ._arrow_zhizt_38 {
     fill: var(--background-color-strong, #f7f7f7);
     position: absolute;
     height: 0.875rem;
     width: 0.875rem;
   }
-  ._arrow_yo27y_37 path {
+  ._arrow_zhizt_38 path {
     stroke: var(--border-color-subdued, #dfe0e1);
     stroke-width: 0.0625rem;
     stroke-dasharray: 0, 0.875rem, 0.8125rem;
     stroke-linejoin: round;
   }
+  ._content_zhizt_2[data-position]::before {
+    content: "";
+    position: absolute;
+    pointer-events: auto;
+    background: transparent;
+  }
+  ._content_zhizt_2[data-position=bottom]::before {
+    bottom: 100%;
+    left: 0;
+    width: 100%;
+    height: var(--popover-bridge-size);
+  }
+  ._content_zhizt_2[data-position=top]::before {
+    top: 100%;
+    left: 0;
+    width: 100%;
+    height: var(--popover-bridge-size);
+  }
+  ._content_zhizt_2[data-position=left]::before {
+    left: 100%;
+    top: 0;
+    height: 100%;
+    width: var(--popover-bridge-size);
+  }
+  ._content_zhizt_2[data-position=right]::before {
+    right: 100%;
+    top: 0;
+    height: 100%;
+    width: var(--popover-bridge-size);
+  }
 }
 @layer state {
-  ._content_yo27y_2:not(:popover-open):not(dialog[open]) {
+  ._content_zhizt_2:not(:popover-open):not(dialog[open]) {
     display: none !important;
   }
-  ._content_yo27y_2:popover-open {
+  ._content_zhizt_2:popover-open {
     opacity: 1;
   }
   @starting-style {
-    ._content_yo27y_2:popover-open {
+    ._content_zhizt_2:popover-open {
       opacity: 0;
     }
   }
-  ._content_yo27y_2._no-padding_yo27y_62 ._scroller_yo27y_29 {
+  ._content_zhizt_2._no-padding_zhizt_93 ._scroller_zhizt_30 {
     padding-block: 0;
     padding-inline: 0;
   }

package/dist/Popover.js

@@ -1,2 +1,2 @@
-export { P as Popover, a as PopoverButton, b as PopoverClose, c as PopoverContent, d as PopoverTrigger, P as default } from './Popover-CcMDyKTj.js';
+export { P as Popover, a as PopoverButton, b as PopoverClose, c as PopoverContent, d as PopoverTrigger, P as default } from './Popover-CCXrzBul.js';
 //# sourceMappingURL=Popover.js.map

package/dist/{ProgressBar-R_UjSR4o.js → ProgressBar-BpKEr6cO.js}

@@ -1,12 +1,13 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef, useId } from 'react';
 import { c as cx } from './index-tZvMCc77.js';
-import { a as SvgCheckCircle, S as SvgError } from './check_circle-Dja-C2lM.js';
-import { F as FieldLabel } from './FieldLabel-BIStrC2x.js';
+import { S as SvgCheckCircle } from './check_circle-CM0ukqXv.js';
+import { S as SvgError } from './error-DR_wWdYY.js';
+import { F as FieldLabel } from './FieldLabel-jqlQ1Ldh.js';
 import { F as Flex } from './Flex-CjPHUTeq.js';
 import { I as Icon } from './Icon-BSuTVNaa.js';
 import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
-import { H as Helper } from './Helper-DjWotFtO.js';
+import { H as Helper } from './Helper-DzVUQgUJ.js';
 
 import './ProgressBar.css';const bar = "_bar_1lj98_23";
 const indeterminate = "_indeterminate_1lj98_1";
@@ -127,4 +128,4 @@ const ProgressBar = forwardRef(
 ProgressBar.displayName = "ProgressBar";
 
 export { ProgressBar as P };
-//# sourceMappingURL=ProgressBar-R_UjSR4o.js.map
+//# sourceMappingURL=ProgressBar-BpKEr6cO.js.map

package/dist/{ProgressBar-R_UjSR4o.js.map → ProgressBar-BpKEr6cO.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar-R_UjSR4o.js","sources":["../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import {\n  forwardRef,\n  ComponentPropsWithoutRef,\n  useId,\n  AriaAttributes,\n  ReactElement,\n} from \"react\";\nimport cx from \"classnames\";\nimport Check from \"@servicetitan/hammer-icon/mdi/round/check_circle.svg\";\nimport Error from \"@servicetitan/hammer-icon/mdi/round/error.svg\";\n\nimport { FieldLabel, FieldLabelProps } from \"../FieldLabel\";\nimport { Flex } from \"../Flex\";\nimport { Helper, HelperProps } from \"../../internal/components\";\nimport { Icon } from \"../Icon\";\nimport { LayoutUtilProps } from \"../../types\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\nimport styles from \"./ProgressBar.module.scss\";\n\n/**\n * Props for the ProgressBar component\n * @extends Omit<ComponentPropsWithoutRef<\"progress\">, \"value\">\n * @extends LayoutUtilProps\n */\nexport type ProgressBarProps = Omit<\n  ComponentPropsWithoutRef<\"progress\">,\n  \"value\"\n> &\n  LayoutUtilProps & {\n    /**\n     * Error state or error message to display\n     * @default false\n     */\n    error?: ReactElement | string | boolean;\n    /**\n     * ARIA live region setting for error announcements\n     */\n    errorAriaLive?: HelperProps[\"errorAriaLive\"];\n    /**\n     * Description text to display below the progress bar\n     */\n    description?: HelperProps[\"description\"];\n  } & (\n    | {\n        /**\n         * Label text for the progress bar\n         */\n        label: FieldLabelProps[\"children\"];\n        /**\n         * Additional props for the label component\n         */\n        labelProps?: Omit<FieldLabelProps, \"children\" | \"id\" | \"required\">;\n      }\n    | {\n        label?: never;\n        labelProps?: never;\n        /**\n         * Accessible label for the progress bar (alternative to label)\n         */\n        [\"aria-label\"]: Exclude<AriaAttributes[\"aria-label\"], undefined>;\n      }\n    | {\n        label?: never;\n        labelProps?: never;\n        /**\n         * ID of element that labels the progress bar (alternative to label)\n         */\n        [\"aria-labelledby\"]: Exclude<\n          AriaAttributes[\"aria-labelledby\"],\n          undefined\n        >;\n      }\n  ) &\n  (\n    | {\n        /**\n         * Current progress value (0-100 or 0-max)\n         */\n        value: `${number}` | number;\n        /**\n         * Whether the progress bar is in indeterminate state\n         * @default false\n         */\n        indeterminate?: false;\n      }\n    | {\n        value?: never;\n        /**\n         * Whether the progress bar is in indeterminate state\n         */\n        indeterminate: true;\n      }\n  );\n\n/**\n * ProgressBar component for displaying progress indicators.\n *\n * Features:\n * - Supports both determinate and indeterminate progress states\n * - Optional label with customizable label props\n * - Error state with error message display\n * - Success state with check icon when value equals max\n * - Description text support\n * - Accessibility support with proper ARIA attributes\n * - Layout utility props for positioning and spacing\n * - Flexible labeling options (label, aria-label, aria-labelledby)\n * - Error and success visual indicators\n *\n * @example\n * <ProgressBar\n *   label=\"Upload Progress\"\n *   value={75}\n *   max={100}\n *   description=\"Uploading files...\"\n * />\n *\n * @example\n * <ProgressBar\n *   label=\"Processing\"\n *   indeterminate\n *   description=\"Please wait...\"\n * />\n *\n * @example\n * <ProgressBar\n *   aria-label=\"Download progress\"\n *   value={50}\n *   error=\"Download failed\"\n * />\n */\nexport const ProgressBar = forwardRef<HTMLDivElement, ProgressBarProps>(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      className,\n      style,\n      value,\n      children,\n      indeterminate,\n      errorAriaLive,\n      description,\n      error = false,\n      max = 100,\n      ...mainProps\n    } = componentProps;\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n\n    const errorMessage = typeof error !== \"boolean\" ? error : undefined;\n    const labelUid = useId();\n    const isSuccess = typeof value !== \"undefined\" && +value >= +max;\n\n    if (\"label\" in props && !!props.label) {\n      const { label, labelProps, ...rest } = mainProps;\n\n      const ProgressBarClassNames = cx(\n        [styles[\"progress-bar\"]],\n\n        className,\n        {\n          [styles[`error`]]: error,\n          [styles[`success`]]: isSuccess,\n        },\n      );\n\n      return (\n        <div\n          className={ProgressBarClassNames}\n          data-anv=\"progress-bar\"\n          style={styleCombined}\n          ref={ref}\n        >\n          <Flex justifyContent=\"space-between\" alignItems=\"center\">\n            <FieldLabel id={labelUid} {...labelProps}>\n              {label}\n            </FieldLabel>\n            {isSuccess && !error ? (\n              <Icon className={styles[\"check-icon\"]} svg={Check} />\n            ) : null}\n            {error ? (\n              <Icon className={styles[\"error-icon\"]} svg={Error} />\n            ) : null}\n          </Flex>\n          <div className={styles[\"bar-container\"]}>\n            <progress\n              aria-labelledby={labelUid}\n              className={styles[\"bar\"]}\n              value={value}\n              max={max}\n              {...rest}\n            />\n          </div>\n          {errorMessage || description ? (\n            <Helper\n              errorMessage={errorMessage}\n              errorAriaLive={errorAriaLive}\n              description={description}\n            />\n          ) : null}\n        </div>\n      );\n    }\n\n    const ProgressBarClassNames = cx([styles[\"progress-bar\"]], className, {\n      [styles[`error`]]: error,\n      [styles[`success`]]: isSuccess,\n    });\n\n    return (\n      <div\n        className={ProgressBarClassNames}\n        data-anv=\"progress-bar\"\n        style={styleCombined}\n        ref={ref}\n      >\n        <div className={styles[\"bar-container\"]}>\n          <progress\n            className={styles[\"bar\"]}\n            max={max}\n            value={value}\n            {...mainProps}\n          />\n        </div>\n        {errorMessage || description ? (\n          <Helper\n            errorMessage={errorMessage}\n            errorAriaLive={errorAriaLive}\n            description={description}\n          />\n        ) : null}\n      </div>\n    );\n  },\n);\n\nProgressBar.displayName = \"ProgressBar\";\n"],"names":["ProgressBarClassNames","Check","Error"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAmIO,MAAM,WAAA,GAAc,UAAA;AAAA,EACzB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,KAAA;AAAA,MACA,KAAA;AAAA,MACA,QAAA;AAAA,MACA,aAAA;AAAA,MACA,aAAA;AAAA,MACA,WAAA;AAAA,MACA,KAAA,GAAQ,KAAA;AAAA,MACR,GAAA,GAAM,GAAA;AAAA,MACN,GAAG;AAAA,KACL,GAAI,cAAA;AACJ,IAAA,MAAM,aAAA,GAAgB;AAAA,MACpB,GAAG,KAAA;AAAA,MACH,GAAG;AAAA,KACL;AAEA,IAAA,MAAM,YAAA,GAAe,OAAO,KAAA,KAAU,SAAA,GAAY,KAAA,GAAQ,MAAA;AAC1D,IAAA,MAAM,WAAW,KAAA,EAAM;AACvB,IAAA,MAAM,YAAY,OAAO,KAAA,KAAU,WAAA,IAAe,CAAC,SAAS,CAAC,GAAA;AAE7D,IAAA,IAAI,OAAA,IAAW,KAAA,IAAS,CAAC,CAAC,MAAM,KAAA,EAAO;AACrC,MAAA,MAAM,EAAE,KAAA,EAAO,UAAA,EAAY,GAAG,MAAK,GAAI,SAAA;AAEvC,MAAA,MAAMA,sBAAAA,GAAwB,EAAA;AAAA,QAC5B,CAAC,MAAA,CAAO,cAAc,CAAC,CAAA;AAAA,QAEvB,SAAA;AAAA,QACA;AAAA,UACE,CAAC,MAAA,CAAO,CAAA,KAAA,CAAO,CAAC,GAAG,KAAA;AAAA,UACnB,CAAC,MAAA,CAAO,CAAA,OAAA,CAAS,CAAC,GAAG;AAAA;AACvB,OACF;AAEA,MAAA,uBACE,IAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAWA,sBAAAA;AAAA,UACX,UAAA,EAAS,cAAA;AAAA,UACT,KAAA,EAAO,aAAA;AAAA,UACP,GAAA;AAAA,UAEA,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,IAAA,EAAA,EAAK,cAAA,EAAe,eAAA,EAAgB,UAAA,EAAW,QAAA,EAC9C,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAI,QAAA,EAAW,GAAG,YAC3B,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,cACC,SAAA,IAAa,CAAC,KAAA,mBACb,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,YAAY,CAAA,EAAG,GAAA,EAAKC,cAAA,EAAO,CAAA,GACjD,IAAA;AAAA,cACH,KAAA,uBACE,IAAA,EAAA,EAAK,SAAA,EAAW,OAAO,YAAY,CAAA,EAAG,GAAA,EAAKC,QAAA,EAAO,CAAA,GACjD;AAAA,aAAA,EACN,CAAA;AAAA,4BACA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,eAAe,CAAA,EACpC,QAAA,kBAAA,GAAA;AAAA,cAAC,UAAA;AAAA,cAAA;AAAA,gBACC,iBAAA,EAAiB,QAAA;AAAA,gBACjB,SAAA,EAAW,OAAO,KAAK,CAAA;AAAA,gBACvB,KAAA;AAAA,gBACA,GAAA;AAAA,gBACC,GAAG;AAAA;AAAA,aACN,EACF,CAAA;AAAA,YACC,gBAAgB,WAAA,mBACf,GAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,YAAA;AAAA,gBACA,aAAA;AAAA,gBACA;AAAA;AAAA,aACF,GACE;AAAA;AAAA;AAAA,OACN;AAAA,IAEJ;AAEA,IAAA,MAAM,wBAAwB,EAAA,CAAG,CAAC,OAAO,cAAc,CAAC,GAAG,SAAA,EAAW;AAAA,MACpE,CAAC,MAAA,CAAO,CAAA,KAAA,CAAO,CAAC,GAAG,KAAA;AAAA,MACnB,CAAC,MAAA,CAAO,CAAA,OAAA,CAAS,CAAC,GAAG;AAAA,KACtB,CAAA;AAED,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,qBAAA;AAAA,QACX,UAAA,EAAS,cAAA;AAAA,QACT,KAAA,EAAO,aAAA;AAAA,QACP,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,eAAe,CAAA,EACpC,QAAA,kBAAA,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,OAAO,KAAK,CAAA;AAAA,cACvB,GAAA;AAAA,cACA,KAAA;AAAA,cACC,GAAG;AAAA;AAAA,WACN,EACF,CAAA;AAAA,UACC,gBAAgB,WAAA,mBACf,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,YAAA;AAAA,cACA,aAAA;AAAA,cACA;AAAA;AAAA,WACF,GACE;AAAA;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA;;;;"}
+{"version":3,"file":"ProgressBar-BpKEr6cO.js","sources":["../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import {\n  forwardRef,\n  ComponentPropsWithoutRef,\n  useId,\n  AriaAttributes,\n  ReactElement,\n} from \"react\";\nimport cx from \"classnames\";\nimport Check from \"@servicetitan/hammer-icon/mdi/round/check_circle.svg\";\nimport Error from \"@servicetitan/hammer-icon/mdi/round/error.svg\";\n\nimport { FieldLabel, FieldLabelProps } from \"../FieldLabel\";\nimport { Flex } from \"../Flex\";\nimport { Helper, HelperProps } from \"../../internal/components\";\nimport { Icon } from \"../Icon\";\nimport { LayoutUtilProps } from \"../../types\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\nimport styles from \"./ProgressBar.module.scss\";\n\n/**\n * Props for the ProgressBar component\n * @extends Omit<ComponentPropsWithoutRef<\"progress\">, \"value\">\n * @extends LayoutUtilProps\n */\nexport type ProgressBarProps = Omit<\n  ComponentPropsWithoutRef<\"progress\">,\n  \"value\"\n> &\n  LayoutUtilProps & {\n    /**\n     * Error state or error message to display\n     * @default false\n     */\n    error?: ReactElement | string | boolean;\n    /**\n     * ARIA live region setting for error announcements\n     */\n    errorAriaLive?: HelperProps[\"errorAriaLive\"];\n    /**\n     * Description text to display below the progress bar\n     */\n    description?: HelperProps[\"description\"];\n  } & (\n    | {\n        /**\n         * Label text for the progress bar\n         */\n        label: FieldLabelProps[\"children\"];\n        /**\n         * Additional props for the label component\n         */\n        labelProps?: Omit<FieldLabelProps, \"children\" | \"id\" | \"required\">;\n      }\n    | {\n        label?: never;\n        labelProps?: never;\n        /**\n         * Accessible label for the progress bar (alternative to label)\n         */\n        [\"aria-label\"]: Exclude<AriaAttributes[\"aria-label\"], undefined>;\n      }\n    | {\n        label?: never;\n        labelProps?: never;\n        /**\n         * ID of element that labels the progress bar (alternative to label)\n         */\n        [\"aria-labelledby\"]: Exclude<\n          AriaAttributes[\"aria-labelledby\"],\n          undefined\n        >;\n      }\n  ) &\n  (\n    | {\n        /**\n         * Current progress value (0-100 or 0-max)\n         */\n        value: `${number}` | number;\n        /**\n         * Whether the progress bar is in indeterminate state\n         * @default false\n         */\n        indeterminate?: false;\n      }\n    | {\n        value?: never;\n        /**\n         * Whether the progress bar is in indeterminate state\n         */\n        indeterminate: true;\n      }\n  );\n\n/**\n * ProgressBar component for displaying progress indicators.\n *\n * Features:\n * - Supports both determinate and indeterminate progress states\n * - Optional label with customizable label props\n * - Error state with error message display\n * - Success state with check icon when value equals max\n * - Description text support\n * - Accessibility support with proper ARIA attributes\n * - Layout utility props for positioning and spacing\n * - Flexible labeling options (label, aria-label, aria-labelledby)\n * - Error and success visual indicators\n *\n * @example\n * <ProgressBar\n *   label=\"Upload Progress\"\n *   value={75}\n *   max={100}\n *   description=\"Uploading files...\"\n * />\n *\n * @example\n * <ProgressBar\n *   label=\"Processing\"\n *   indeterminate\n *   description=\"Please wait...\"\n * />\n *\n * @example\n * <ProgressBar\n *   aria-label=\"Download progress\"\n *   value={50}\n *   error=\"Download failed\"\n * />\n */\nexport const ProgressBar = forwardRef<HTMLDivElement, ProgressBarProps>(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      className,\n      style,\n      value,\n      children,\n      indeterminate,\n      errorAriaLive,\n      description,\n      error = false,\n      max = 100,\n      ...mainProps\n    } = componentProps;\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n\n    const errorMessage = typeof error !== \"boolean\" ? error : undefined;\n    const labelUid = useId();\n    const isSuccess = typeof value !== \"undefined\" && +value >= +max;\n\n    if (\"label\" in props && !!props.label) {\n      const { label, labelProps, ...rest } = mainProps;\n\n      const ProgressBarClassNames = cx(\n        [styles[\"progress-bar\"]],\n\n        className,\n        {\n          [styles[`error`]]: error,\n          [styles[`success`]]: isSuccess,\n        },\n      );\n\n      return (\n        <div\n          className={ProgressBarClassNames}\n          data-anv=\"progress-bar\"\n          style={styleCombined}\n          ref={ref}\n        >\n          <Flex justifyContent=\"space-between\" alignItems=\"center\">\n            <FieldLabel id={labelUid} {...labelProps}>\n              {label}\n            </FieldLabel>\n            {isSuccess && !error ? (\n              <Icon className={styles[\"check-icon\"]} svg={Check} />\n            ) : null}\n            {error ? (\n              <Icon className={styles[\"error-icon\"]} svg={Error} />\n            ) : null}\n          </Flex>\n          <div className={styles[\"bar-container\"]}>\n            <progress\n              aria-labelledby={labelUid}\n              className={styles[\"bar\"]}\n              value={value}\n              max={max}\n              {...rest}\n            />\n          </div>\n          {errorMessage || description ? (\n            <Helper\n              errorMessage={errorMessage}\n              errorAriaLive={errorAriaLive}\n              description={description}\n            />\n          ) : null}\n        </div>\n      );\n    }\n\n    const ProgressBarClassNames = cx([styles[\"progress-bar\"]], className, {\n      [styles[`error`]]: error,\n      [styles[`success`]]: isSuccess,\n    });\n\n    return (\n      <div\n        className={ProgressBarClassNames}\n        data-anv=\"progress-bar\"\n        style={styleCombined}\n        ref={ref}\n      >\n        <div className={styles[\"bar-container\"]}>\n          <progress\n            className={styles[\"bar\"]}\n            max={max}\n            value={value}\n            {...mainProps}\n          />\n        </div>\n        {errorMessage || description ? (\n          <Helper\n            errorMessage={errorMessage}\n            errorAriaLive={errorAriaLive}\n            description={description}\n          />\n        ) : null}\n      </div>\n    );\n  },\n);\n\nProgressBar.displayName = \"ProgressBar\";\n"],"names":["ProgressBarClassNames","Check","Error"],"mappings":"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"}

package/dist/ProgressBar.js

@@ -1,2 +1,2 @@
-export { P as ProgressBar, P as default } from './ProgressBar-R_UjSR4o.js';
+export { P as ProgressBar, P as default } from './ProgressBar-BpKEr6cO.js';
 //# sourceMappingURL=ProgressBar.js.map

package/dist/{Radio-CLR1m8N9.js → Radio-jj0-1dOg.js}

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
-import { R as RadioGroup, a as Radio$1 } from './RadioGroup-m46C69uO.js';
+import { R as RadioGroup, a as Radio$1 } from './RadioGroup-Bxy415eu.js';
 import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
 import { useTrackingId } from './useTrackingId.js';
 
@@ -57,4 +57,4 @@ const Radio = Object.assign(RadioElement, {
 });
 
 export { Radio as R };
-//# sourceMappingURL=Radio-CLR1m8N9.js.map
+//# sourceMappingURL=Radio-jj0-1dOg.js.map

package/dist/{Radio-CLR1m8N9.js.map → Radio-jj0-1dOg.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Radio-CLR1m8N9.js","sources":["../src/components/Radio/Radio.tsx"],"sourcesContent":["import { Ref, forwardRef } from \"react\";\nimport {\n  RadioProps as CoreRadioProps,\n  Radio as CoreRadio,\n} from \"./internal/Radio\";\nimport { RadioGroup } from \"./RadioGroup\";\nimport { useTrackingId } from \"../../hooks\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\n\n/**\n * Props for the Radio component\n * @property {boolean} [checked] - Controlled state\n * @property {boolean} [defaultChecked] - Uncontrolled state\n * @property {Function} [onChange] - Callback when radio is changed\n * @property {ReactElement | string} [label] - Label for Radio\n * @property {boolean} [error] - Error state for the radio\n * @property {object} [icons] - Icon overrides for checked and unchecked states\n * @property {string} [description] - Description text to display below the radio\n * @property {string} [aria-label] - Accessible label for the radio\n * @property {string} [aria-labelledby] - ID of element that labels the radio\n * @property {string} [name] - Name attribute for the radio\n * @property {string} [data-tracking-id] - Custom tracking ID for analytics\n * @extends DataTrackingId\n */\nexport type RadioProps = Omit<CoreRadioProps, \"hideRadio\"> & DataTrackingId;\n\nconst RadioElement = forwardRef(\n  (props: RadioProps, ref: Ref<HTMLInputElement>) => {\n    const data = {\n      label: childrenToString(props.label),\n      ariaLabel: props[\"aria-label\"],\n      ariaLabelledBy: props[\"aria-labelledby\"],\n      name: props.name,\n      value: props.value,\n    };\n\n    const trackingId = useTrackingId({\n      name: \"Radio\",\n      data,\n      hasOverride: !!props[\"data-tracking-id\"],\n    });\n    return <CoreRadio ref={ref} data-tracking-id={trackingId} {...props} />;\n  },\n);\n\nRadioElement.displayName = CoreRadio.displayName;\n\n/**\n * Radio component for single selection from a group of options.\n *\n * Features:\n * - Supports both controlled and uncontrolled modes\n * - Customizable icons for checked and unchecked states\n * - Error state with visual indicators\n * - Description text support\n * - Accessibility support with proper ARIA attributes\n * - Layout utility props for positioning and spacing\n * - Flexible labeling options\n * - Group support via Radio.Group\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Radio\n *   label=\"Option 1\"\n *   value=\"option1\"\n *   checked={selectedValue === \"option1\"}\n *   onChange={(e, state) => setSelectedValue(state?.value)}\n * />\n *\n * @example\n * <Radio\n *   label=\"Custom styled option\"\n *   value=\"custom\"\n *   icons={{\n *     checked: CustomCheckedIcon,\n *     unchecked: CustomUncheckedIcon\n *   }}\n *   description=\"This option has custom styling\"\n * />\n *\n * @example\n * <Radio.Group legend=\"Choose your preference\" required>\n *   <Radio label=\"Option A\" value=\"a\" />\n *   <Radio label=\"Option B\" value=\"b\" />\n *   <Radio label=\"Option C\" value=\"c\" />\n * </Radio.Group>\n */\nexport const Radio = Object.assign(RadioElement, {\n  /**\n   * RadioGroup component for grouping related radio options.\n   *\n   * Features:\n   * - Groups multiple radio options together\n   * - Legend support for group labeling\n   * - Required field indication\n   * - Accessibility support with proper fieldset semantics\n   * - Layout utility props for positioning and spacing\n   * - Focus and blur event handling\n   * - More info support for additional context\n   * - Automatic alignment based on flex direction\n   *\n   * @example\n   * <RadioGroup legend=\"Choose your preference\" required>\n   *   <Radio label=\"Option A\" value=\"a\" />\n   *   <Radio label=\"Option B\" value=\"b\" />\n   *   <Radio label=\"Option C\" value=\"c\" />\n   * </RadioGroup>\n   *\n   * @example\n   * <RadioGroup\n   *   legend=\"Horizontal layout\"\n   *   flexDirection=\"row\"\n   *   gap=\"4\"\n   * >\n   *   <Radio label=\"Yes\" value=\"yes\" />\n   *   <Radio label=\"No\" value=\"no\" />\n   * </RadioGroup>\n   */\n  Group: RadioGroup,\n});\n"],"names":["CoreRadio"],"mappings":";;;;;;AA2BA,MAAM,YAAA,GAAe,UAAA;AAAA,EACnB,CAAC,OAAmB,GAAA,KAA+B;AACjD,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,KAAA,EAAO,gBAAA,CAAiB,KAAA,CAAM,KAAK,CAAA;AAAA,MACnC,SAAA,EAAW,MAAM,YAAY,CAAA;AAAA,MAC7B,cAAA,EAAgB,MAAM,iBAAiB,CAAA;AAAA,MACvC,MAAM,KAAA,CAAM,IAAA;AAAA,MACZ,OAAO,KAAA,CAAM;AAAA,KACf;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,OAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AACD,IAAA,2BAAQA,OAAA,EAAA,EAAU,GAAA,EAAU,kBAAA,EAAkB,UAAA,EAAa,GAAG,KAAA,EAAO,CAAA;AAAA,EACvE;AACF,CAAA;AAEA,YAAA,CAAa,cAAcA,OAAA,CAAU,WAAA;AA0C9B,MAAM,KAAA,GAAQ,MAAA,CAAO,MAAA,CAAO,YAAA,EAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA+B/C,KAAA,EAAO;AACT,CAAC;;;;"}
+{"version":3,"file":"Radio-jj0-1dOg.js","sources":["../src/components/Radio/Radio.tsx"],"sourcesContent":["import { Ref, forwardRef } from \"react\";\nimport {\n  RadioProps as CoreRadioProps,\n  Radio as CoreRadio,\n} from \"./internal/Radio\";\nimport { RadioGroup } from \"./RadioGroup\";\nimport { useTrackingId } from \"../../hooks\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\n\n/**\n * Props for the Radio component\n * @property {boolean} [checked] - Controlled state\n * @property {boolean} [defaultChecked] - Uncontrolled state\n * @property {Function} [onChange] - Callback when radio is changed\n * @property {ReactElement | string} [label] - Label for Radio\n * @property {boolean} [error] - Error state for the radio\n * @property {object} [icons] - Icon overrides for checked and unchecked states\n * @property {string} [description] - Description text to display below the radio\n * @property {string} [aria-label] - Accessible label for the radio\n * @property {string} [aria-labelledby] - ID of element that labels the radio\n * @property {string} [name] - Name attribute for the radio\n * @property {string} [data-tracking-id] - Custom tracking ID for analytics\n * @extends DataTrackingId\n */\nexport type RadioProps = Omit<CoreRadioProps, \"hideRadio\"> & DataTrackingId;\n\nconst RadioElement = forwardRef(\n  (props: RadioProps, ref: Ref<HTMLInputElement>) => {\n    const data = {\n      label: childrenToString(props.label),\n      ariaLabel: props[\"aria-label\"],\n      ariaLabelledBy: props[\"aria-labelledby\"],\n      name: props.name,\n      value: props.value,\n    };\n\n    const trackingId = useTrackingId({\n      name: \"Radio\",\n      data,\n      hasOverride: !!props[\"data-tracking-id\"],\n    });\n    return <CoreRadio ref={ref} data-tracking-id={trackingId} {...props} />;\n  },\n);\n\nRadioElement.displayName = CoreRadio.displayName;\n\n/**\n * Radio component for single selection from a group of options.\n *\n * Features:\n * - Supports both controlled and uncontrolled modes\n * - Customizable icons for checked and unchecked states\n * - Error state with visual indicators\n * - Description text support\n * - Accessibility support with proper ARIA attributes\n * - Layout utility props for positioning and spacing\n * - Flexible labeling options\n * - Group support via Radio.Group\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Radio\n *   label=\"Option 1\"\n *   value=\"option1\"\n *   checked={selectedValue === \"option1\"}\n *   onChange={(e, state) => setSelectedValue(state?.value)}\n * />\n *\n * @example\n * <Radio\n *   label=\"Custom styled option\"\n *   value=\"custom\"\n *   icons={{\n *     checked: CustomCheckedIcon,\n *     unchecked: CustomUncheckedIcon\n *   }}\n *   description=\"This option has custom styling\"\n * />\n *\n * @example\n * <Radio.Group legend=\"Choose your preference\" required>\n *   <Radio label=\"Option A\" value=\"a\" />\n *   <Radio label=\"Option B\" value=\"b\" />\n *   <Radio label=\"Option C\" value=\"c\" />\n * </Radio.Group>\n */\nexport const Radio = Object.assign(RadioElement, {\n  /**\n   * RadioGroup component for grouping related radio options.\n   *\n   * Features:\n   * - Groups multiple radio options together\n   * - Legend support for group labeling\n   * - Required field indication\n   * - Accessibility support with proper fieldset semantics\n   * - Layout utility props for positioning and spacing\n   * - Focus and blur event handling\n   * - More info support for additional context\n   * - Automatic alignment based on flex direction\n   *\n   * @example\n   * <RadioGroup legend=\"Choose your preference\" required>\n   *   <Radio label=\"Option A\" value=\"a\" />\n   *   <Radio label=\"Option B\" value=\"b\" />\n   *   <Radio label=\"Option C\" value=\"c\" />\n   * </RadioGroup>\n   *\n   * @example\n   * <RadioGroup\n   *   legend=\"Horizontal layout\"\n   *   flexDirection=\"row\"\n   *   gap=\"4\"\n   * >\n   *   <Radio label=\"Yes\" value=\"yes\" />\n   *   <Radio label=\"No\" value=\"no\" />\n   * </RadioGroup>\n   */\n  Group: RadioGroup,\n});\n"],"names":["CoreRadio"],"mappings":";;;;;;AA2BA,MAAM,YAAA,GAAe,UAAA;AAAA,EACnB,CAAC,OAAmB,GAAA,KAA+B;AACjD,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,KAAA,EAAO,gBAAA,CAAiB,KAAA,CAAM,KAAK,CAAA;AAAA,MACnC,SAAA,EAAW,MAAM,YAAY,CAAA;AAAA,MAC7B,cAAA,EAAgB,MAAM,iBAAiB,CAAA;AAAA,MACvC,MAAM,KAAA,CAAM,IAAA;AAAA,MACZ,OAAO,KAAA,CAAM;AAAA,KACf;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,OAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AACD,IAAA,2BAAQA,OAAA,EAAA,EAAU,GAAA,EAAU,kBAAA,EAAkB,UAAA,EAAa,GAAG,KAAA,EAAO,CAAA;AAAA,EACvE;AACF,CAAA;AAEA,YAAA,CAAa,cAAcA,OAAA,CAAU,WAAA;AA0C9B,MAAM,KAAA,GAAQ,MAAA,CAAO,MAAA,CAAO,YAAA,EAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA+B/C,KAAA,EAAO;AACT,CAAC;;;;"}

package/dist/Radio.js

@@ -1,3 +1,3 @@
-export { R as Radio, R as default } from './Radio-CLR1m8N9.js';
-export { R as RadioGroup } from './RadioGroup-m46C69uO.js';
+export { R as Radio, R as default } from './Radio-jj0-1dOg.js';
+export { R as RadioGroup } from './RadioGroup-Bxy415eu.js';
 //# sourceMappingURL=Radio.js.map

package/dist/{RadioGroup-m46C69uO.js → RadioGroup-Bxy415eu.js}

@@ -3,10 +3,10 @@ import * as React from 'react';
 import { forwardRef, useId, useState } from 'react';
 import { c as cx } from './index-tZvMCc77.js';
 import { I as Icon } from './Icon-BSuTVNaa.js';
-import { H as Helper } from './Helper-DjWotFtO.js';
+import { H as Helper } from './Helper-DzVUQgUJ.js';
 import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
 import { S as SrOnly } from './SrOnly-CTsYSuby.js';
-import { F as FieldLabel } from './FieldLabel-BIStrC2x.js';
+import { F as FieldLabel } from './FieldLabel-jqlQ1Ldh.js';
 
 import './RadioGroup.css';const SvgRadioButtonUnchecked = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z" }));
 
@@ -194,4 +194,4 @@ const RadioGroup = forwardRef(
 RadioGroup.displayName = "RadioGroup";
 
 export { RadioGroup as R, Radio as a };
-//# sourceMappingURL=RadioGroup-m46C69uO.js.map
+//# sourceMappingURL=RadioGroup-Bxy415eu.js.map

package/dist/{RadioGroup-m46C69uO.js.map → RadioGroup-Bxy415eu.js.map}

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup-m46C69uO.js","sources":["../../hammer-icon/mdi/two-tone/radio_button_unchecked.svg","../../hammer-icon/mdi/two-tone/radio_button_checked.svg","../src/components/Radio/internal/Radio.tsx","../src/components/Radio/RadioGroup.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgRadioButtonUnchecked = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z\" }));\nexport default SvgRadioButtonUnchecked;\n","import * as React from \"react\";\nconst SvgRadioButtonChecked = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z\" }), /* @__PURE__ */ React.createElement(\"circle\", { cx: 12, cy: 12, r: 5 }));\nexport default SvgRadioButtonChecked;\n","import {\n  forwardRef,\n  ComponentPropsWithoutRef,\n  ChangeEvent,\n  ReactElement,\n  useId,\n} from \"react\";\nimport cx from \"classnames\";\nimport { Icon } from \"../../Icon\";\nimport Radio_outline from \"@servicetitan/hammer-icon/mdi/two-tone/radio_button_unchecked.svg\";\nimport Radio_checked from \"@servicetitan/hammer-icon/mdi/two-tone/radio_button_checked.svg\";\nimport styles from \"../Radio.module.scss\";\nimport { LayoutUtilProps, Svg } from \"../../../types\";\nimport { useLayoutPropsUtil } from \"../../../internal/hooks\";\nimport { Helper, HelperProps } from \"../../../internal/components\";\nimport { RadioState } from \"../types\";\n\n/**\n * Props for the Radio component\n * @extends Omit<ComponentPropsWithoutRef<\"input\">, \"onChange\">\n * @extends LayoutUtilProps\n */\nexport type RadioProps = Omit<ComponentPropsWithoutRef<\"input\">, \"onChange\"> &\n  LayoutUtilProps & {\n    /**\n     * Controlled state\n     * @default false\n     */\n    checked?: boolean;\n\n    /**\n     * Uncontrolled state\n     * @default false\n     */\n    defaultChecked?: boolean;\n\n    /**\n     * Callback when radio is changed\n     */\n    onChange?: (e?: ChangeEvent<HTMLInputElement>, state?: RadioState) => void;\n\n    /**\n     * Label for Radio\n     * @remarks This should either be a string or have text content inside for accessibility\n     */\n    label?: ReactElement | string;\n\n    /**\n     * Error state for the radio\n     * @default false\n     */\n    error?: boolean;\n\n    /**\n     * Icon overrides for checked and unchecked states\n     */\n    icons?: {\n      /**\n       * Icon to display when radio is checked\n       */\n      checked?: Svg;\n      /**\n       * Icon to display when radio is unchecked\n       */\n      unchecked?: Svg;\n    };\n\n    /**\n     * Description text to display below the radio\n     */\n    description?: HelperProps[\"description\"];\n\n    /**\n     * When true, hides the radio for visual users\n     * @default false\n     */\n    hideRadio?: boolean;\n  };\n\nconst RadioElement = forwardRef<HTMLInputElement, RadioProps>((props, ref) => {\n  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n  const {\n    className,\n    checked,\n    defaultChecked,\n    value,\n    icons,\n    error,\n    label,\n    onChange,\n    style,\n    description,\n    hideRadio = false,\n    ...rest\n  } = componentProps;\n  const {\n    checked: checkedIcon = Radio_checked,\n    unchecked: uncheckedIcon = Radio_outline,\n  } = { ...icons };\n\n  const onChangeHandler = (e: ChangeEvent<HTMLInputElement>) => {\n    onChange?.(e, { value, checked: e.target.checked });\n  };\n\n  const helperUid = useId();\n\n  const wrapperClassNames = cx(\n    styles[\"wrapper\"],\n    { [styles[\"focus\"]]: hideRadio },\n    className,\n  );\n\n  const radioClassNames = cx(styles[\"radio\"], {\n    [styles[\"error\"]]: error,\n  });\n\n  const styleCombined = {\n    ...style,\n    ...layoutStyles,\n  };\n\n  return (\n    <div className={wrapperClassNames} style={styleCombined} data-anv=\"radio\">\n      <label className={radioClassNames}>\n        <input\n          type=\"radio\"\n          aria-checked={checked ?? defaultChecked}\n          checked={checked}\n          defaultChecked={defaultChecked}\n          value={value}\n          onChange={onChangeHandler}\n          aria-describedby={description ? helperUid : undefined}\n          ref={ref}\n          {...rest}\n        />\n\n        <span\n          className={cx(styles[\"icon-wrapper\"], {\n            [styles[\"sr-only\"]]: hideRadio,\n          })}\n        >\n          <Icon\n            size=\"large\"\n            svg={uncheckedIcon}\n            className={cx([styles[\"icon-unchecked\"]])}\n          />\n\n          <Icon\n            size=\"large\"\n            svg={checkedIcon}\n            className={cx([styles[\"icon-checked\"]])}\n          />\n        </span>\n\n        <span className={cx({ [styles[\"focus-label\"]]: hideRadio })}>\n          {label}\n        </span>\n      </label>\n\n      {description ? (\n        <div className={styles[\"helper-wrapper\"]}>\n          <Helper id={helperUid} description={description} />\n        </div>\n      ) : null}\n    </div>\n  );\n});\n\nRadioElement.displayName = \"RadioElement\";\n\n/**\n * Radio component for single selection from a group of options.\n *\n * Features:\n * - Supports both controlled and uncontrolled modes\n * - Customizable icons for checked and unchecked states\n * - Error state with visual indicators\n * - Description text support\n * - Accessibility support with proper ARIA attributes\n * - Layout utility props for positioning and spacing\n * - Optional radio hiding for visual users\n * - Flexible labeling options\n * - Group support via Radio.Group\n *\n * @example\n * <Radio\n *   label=\"Option 1\"\n *   value=\"option1\"\n *   checked={selectedValue === \"option1\"}\n *   onChange={(e, state) => setSelectedValue(state?.value)}\n * />\n *\n * @example\n * <Radio\n *   label=\"Custom styled option\"\n *   value=\"custom\"\n *   icons={{\n *     checked: CustomCheckedIcon,\n *     unchecked: CustomUncheckedIcon\n *   }}\n *   description=\"This option has custom styling\"\n * />\n *\n * @example\n * <Radio.Group legend=\"Choose your preference\" required>\n *   <Radio label=\"Option A\" value=\"a\" />\n *   <Radio label=\"Option B\" value=\"b\" />\n *   <Radio label=\"Option C\" value=\"c\" />\n * </Radio.Group>\n */\nexport const Radio = RadioElement;\n","import {\n  ComponentPropsWithoutRef,\n  FocusEventHandler,\n  forwardRef,\n  ReactElement,\n  useState,\n} from \"react\";\nimport styles from \"./Radio.module.scss\";\nimport cx from \"classnames\";\nimport { LayoutUtilProps } from \"../../types\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { SrOnly } from \"../SrOnly\";\nimport { FieldLabel } from \"../FieldLabel\";\nimport { FieldLabelProps } from \"../../internal/types\";\n\n/**\n * Props for the RadioGroup component\n * @extends ComponentPropsWithoutRef<\"fieldset\">\n * @extends LayoutUtilProps\n * @extends Omit<FieldLabelProps, \"labelProps\">\n */\nexport type RadioGroupProps = ComponentPropsWithoutRef<\"fieldset\"> &\n  LayoutUtilProps &\n  Omit<FieldLabelProps, \"labelProps\"> & {\n    /**\n     * Required flag for label\n     * @remarks This does not enforce error when nothing is selected\n     */\n    required?: boolean;\n\n    /**\n     * Legend for the fieldset\n     */\n    legend?: string | ReactElement;\n  };\n\n/**\n * RadioGroup component for grouping related radio options.\n *\n * Features:\n * - Groups multiple radio options together\n * - Legend support for group labeling\n * - Required field indication\n * - Accessibility support with proper fieldset semantics\n * - Layout utility props for positioning and spacing\n * - Focus and blur event handling\n * - More info support for additional context\n * - Automatic alignment based on flex direction\n *\n * @example\n * <RadioGroup legend=\"Choose your preference\" required>\n *   <Radio label=\"Option A\" value=\"a\" />\n *   <Radio label=\"Option B\" value=\"b\" />\n *   <Radio label=\"Option C\" value=\"c\" />\n * </RadioGroup>\n *\n * @example\n * <RadioGroup\n *   legend=\"Horizontal layout\"\n *   flexDirection=\"row\"\n *   gap=\"4\"\n * >\n *   <Radio label=\"Yes\" value=\"yes\" />\n *   <Radio label=\"No\" value=\"no\" />\n * </RadioGroup>\n */\nexport const RadioGroup = forwardRef<HTMLFieldSetElement, RadioGroupProps>(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      className,\n      children,\n      legend,\n      moreInfo,\n      onBlur,\n      onFocus,\n      required,\n      style,\n      ...rest\n    } = componentProps;\n\n    const RadioGroupClassNames = cx(styles[\"radio-group\"], className);\n    const [openInfo, setOpenInfo] = useState<boolean>(false);\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n      alignItems:\n        layoutStyles?.alignItems ??\n        (layoutStyles?.flexDirection === \"row\" ? \"center\" : undefined),\n    };\n\n    const focusHandler: FocusEventHandler<HTMLFieldSetElement> = (e) => {\n      onFocus?.(e);\n      setOpenInfo(true);\n    };\n\n    const blurHandler: FocusEventHandler<HTMLFieldSetElement> = (e) => {\n      onBlur?.(e);\n      setOpenInfo(false);\n    };\n\n    return (\n      <fieldset\n        role=\"radiogroup\"\n        data-anv=\"radio-group\"\n        className={RadioGroupClassNames}\n        aria-required={required}\n        style={styleCombined}\n        ref={ref}\n        onFocus={focusHandler}\n        onBlur={blurHandler}\n        {...rest}\n      >\n        <legend className={styles[\"legend\"]}>\n          {legend}\n          {required && \", required\"}\n          {moreInfo && <SrOnly>{moreInfo}</SrOnly>}\n        </legend>\n        <FieldLabel\n          aria-hidden\n          moreInfo={moreInfo}\n          required={required}\n          openMoreInfo={openInfo}\n        >\n          {legend}\n        </FieldLabel>\n        <div\n          className={styles[\"children\"]}\n          style={{\n            flexDirection: layoutStyles?.flexDirection,\n            gap: layoutStyles?.gap,\n          }}\n        >\n          {children}\n        </div>\n      </fieldset>\n    );\n  },\n);\n\nRadioGroup.displayName = \"RadioGroup\";\n"],"names":["Radio_checked","Radio_outline"],"mappings":"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"}
+{"version":3,"file":"RadioGroup-Bxy415eu.js","sources":["../../hammer-icon/mdi/two-tone/radio_button_unchecked.svg","../../hammer-icon/mdi/two-tone/radio_button_checked.svg","../src/components/Radio/internal/Radio.tsx","../src/components/Radio/RadioGroup.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgRadioButtonUnchecked = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z\" }));\nexport default SvgRadioButtonUnchecked;\n","import * as React from \"react\";\nconst SvgRadioButtonChecked = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z\" }), /* @__PURE__ */ React.createElement(\"circle\", { cx: 12, cy: 12, r: 5 }));\nexport default SvgRadioButtonChecked;\n","import {\n  forwardRef,\n  ComponentPropsWithoutRef,\n  ChangeEvent,\n  ReactElement,\n  useId,\n} from \"react\";\nimport cx from \"classnames\";\nimport { Icon } from \"../../Icon\";\nimport Radio_outline from \"@servicetitan/hammer-icon/mdi/two-tone/radio_button_unchecked.svg\";\nimport Radio_checked from \"@servicetitan/hammer-icon/mdi/two-tone/radio_button_checked.svg\";\nimport styles from \"../Radio.module.scss\";\nimport { LayoutUtilProps, Svg } from \"../../../types\";\nimport { useLayoutPropsUtil } from \"../../../internal/hooks\";\nimport { Helper, HelperProps } from \"../../../internal/components\";\nimport { RadioState } from \"../types\";\n\n/**\n * Props for the Radio component\n * @extends Omit<ComponentPropsWithoutRef<\"input\">, \"onChange\">\n * @extends LayoutUtilProps\n */\nexport type RadioProps = Omit<ComponentPropsWithoutRef<\"input\">, \"onChange\"> &\n  LayoutUtilProps & {\n    /**\n     * Controlled state\n     * @default false\n     */\n    checked?: boolean;\n\n    /**\n     * Uncontrolled state\n     * @default false\n     */\n    defaultChecked?: boolean;\n\n    /**\n     * Callback when radio is changed\n     */\n    onChange?: (e?: ChangeEvent<HTMLInputElement>, state?: RadioState) => void;\n\n    /**\n     * Label for Radio\n     * @remarks This should either be a string or have text content inside for accessibility\n     */\n    label?: ReactElement | string;\n\n    /**\n     * Error state for the radio\n     * @default false\n     */\n    error?: boolean;\n\n    /**\n     * Icon overrides for checked and unchecked states\n     */\n    icons?: {\n      /**\n       * Icon to display when radio is checked\n       */\n      checked?: Svg;\n      /**\n       * Icon to display when radio is unchecked\n       */\n      unchecked?: Svg;\n    };\n\n    /**\n     * Description text to display below the radio\n     */\n    description?: HelperProps[\"description\"];\n\n    /**\n     * When true, hides the radio for visual users\n     * @default false\n     */\n    hideRadio?: boolean;\n  };\n\nconst RadioElement = forwardRef<HTMLInputElement, RadioProps>((props, ref) => {\n  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n  const {\n    className,\n    checked,\n    defaultChecked,\n    value,\n    icons,\n    error,\n    label,\n    onChange,\n    style,\n    description,\n    hideRadio = false,\n    ...rest\n  } = componentProps;\n  const {\n    checked: checkedIcon = Radio_checked,\n    unchecked: uncheckedIcon = Radio_outline,\n  } = { ...icons };\n\n  const onChangeHandler = (e: ChangeEvent<HTMLInputElement>) => {\n    onChange?.(e, { value, checked: e.target.checked });\n  };\n\n  const helperUid = useId();\n\n  const wrapperClassNames = cx(\n    styles[\"wrapper\"],\n    { [styles[\"focus\"]]: hideRadio },\n    className,\n  );\n\n  const radioClassNames = cx(styles[\"radio\"], {\n    [styles[\"error\"]]: error,\n  });\n\n  const styleCombined = {\n    ...style,\n    ...layoutStyles,\n  };\n\n  return (\n    <div className={wrapperClassNames} style={styleCombined} data-anv=\"radio\">\n      <label className={radioClassNames}>\n        <input\n          type=\"radio\"\n          aria-checked={checked ?? defaultChecked}\n          checked={checked}\n          defaultChecked={defaultChecked}\n          value={value}\n          onChange={onChangeHandler}\n          aria-describedby={description ? helperUid : undefined}\n          ref={ref}\n          {...rest}\n        />\n\n        <span\n          className={cx(styles[\"icon-wrapper\"], {\n            [styles[\"sr-only\"]]: hideRadio,\n          })}\n        >\n          <Icon\n            size=\"large\"\n            svg={uncheckedIcon}\n            className={cx([styles[\"icon-unchecked\"]])}\n          />\n\n          <Icon\n            size=\"large\"\n            svg={checkedIcon}\n            className={cx([styles[\"icon-checked\"]])}\n          />\n        </span>\n\n        <span className={cx({ [styles[\"focus-label\"]]: hideRadio })}>\n          {label}\n        </span>\n      </label>\n\n      {description ? (\n        <div className={styles[\"helper-wrapper\"]}>\n          <Helper id={helperUid} description={description} />\n        </div>\n      ) : null}\n    </div>\n  );\n});\n\nRadioElement.displayName = \"RadioElement\";\n\n/**\n * Radio component for single selection from a group of options.\n *\n * Features:\n * - Supports both controlled and uncontrolled modes\n * - Customizable icons for checked and unchecked states\n * - Error state with visual indicators\n * - Description text support\n * - Accessibility support with proper ARIA attributes\n * - Layout utility props for positioning and spacing\n * - Optional radio hiding for visual users\n * - Flexible labeling options\n * - Group support via Radio.Group\n *\n * @example\n * <Radio\n *   label=\"Option 1\"\n *   value=\"option1\"\n *   checked={selectedValue === \"option1\"}\n *   onChange={(e, state) => setSelectedValue(state?.value)}\n * />\n *\n * @example\n * <Radio\n *   label=\"Custom styled option\"\n *   value=\"custom\"\n *   icons={{\n *     checked: CustomCheckedIcon,\n *     unchecked: CustomUncheckedIcon\n *   }}\n *   description=\"This option has custom styling\"\n * />\n *\n * @example\n * <Radio.Group legend=\"Choose your preference\" required>\n *   <Radio label=\"Option A\" value=\"a\" />\n *   <Radio label=\"Option B\" value=\"b\" />\n *   <Radio label=\"Option C\" value=\"c\" />\n * </Radio.Group>\n */\nexport const Radio = RadioElement;\n","import {\n  ComponentPropsWithoutRef,\n  FocusEventHandler,\n  forwardRef,\n  ReactElement,\n  useState,\n} from \"react\";\nimport styles from \"./Radio.module.scss\";\nimport cx from \"classnames\";\nimport { LayoutUtilProps } from \"../../types\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { SrOnly } from \"../SrOnly\";\nimport { FieldLabel } from \"../FieldLabel\";\nimport { FieldLabelProps } from \"../../internal/types\";\n\n/**\n * Props for the RadioGroup component\n * @extends ComponentPropsWithoutRef<\"fieldset\">\n * @extends LayoutUtilProps\n * @extends Omit<FieldLabelProps, \"labelProps\">\n */\nexport type RadioGroupProps = ComponentPropsWithoutRef<\"fieldset\"> &\n  LayoutUtilProps &\n  Omit<FieldLabelProps, \"labelProps\"> & {\n    /**\n     * Required flag for label\n     * @remarks This does not enforce error when nothing is selected\n     */\n    required?: boolean;\n\n    /**\n     * Legend for the fieldset\n     */\n    legend?: string | ReactElement;\n  };\n\n/**\n * RadioGroup component for grouping related radio options.\n *\n * Features:\n * - Groups multiple radio options together\n * - Legend support for group labeling\n * - Required field indication\n * - Accessibility support with proper fieldset semantics\n * - Layout utility props for positioning and spacing\n * - Focus and blur event handling\n * - More info support for additional context\n * - Automatic alignment based on flex direction\n *\n * @example\n * <RadioGroup legend=\"Choose your preference\" required>\n *   <Radio label=\"Option A\" value=\"a\" />\n *   <Radio label=\"Option B\" value=\"b\" />\n *   <Radio label=\"Option C\" value=\"c\" />\n * </RadioGroup>\n *\n * @example\n * <RadioGroup\n *   legend=\"Horizontal layout\"\n *   flexDirection=\"row\"\n *   gap=\"4\"\n * >\n *   <Radio label=\"Yes\" value=\"yes\" />\n *   <Radio label=\"No\" value=\"no\" />\n * </RadioGroup>\n */\nexport const RadioGroup = forwardRef<HTMLFieldSetElement, RadioGroupProps>(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      className,\n      children,\n      legend,\n      moreInfo,\n      onBlur,\n      onFocus,\n      required,\n      style,\n      ...rest\n    } = componentProps;\n\n    const RadioGroupClassNames = cx(styles[\"radio-group\"], className);\n    const [openInfo, setOpenInfo] = useState<boolean>(false);\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n      alignItems:\n        layoutStyles?.alignItems ??\n        (layoutStyles?.flexDirection === \"row\" ? \"center\" : undefined),\n    };\n\n    const focusHandler: FocusEventHandler<HTMLFieldSetElement> = (e) => {\n      onFocus?.(e);\n      setOpenInfo(true);\n    };\n\n    const blurHandler: FocusEventHandler<HTMLFieldSetElement> = (e) => {\n      onBlur?.(e);\n      setOpenInfo(false);\n    };\n\n    return (\n      <fieldset\n        role=\"radiogroup\"\n        data-anv=\"radio-group\"\n        className={RadioGroupClassNames}\n        aria-required={required}\n        style={styleCombined}\n        ref={ref}\n        onFocus={focusHandler}\n        onBlur={blurHandler}\n        {...rest}\n      >\n        <legend className={styles[\"legend\"]}>\n          {legend}\n          {required && \", required\"}\n          {moreInfo && <SrOnly>{moreInfo}</SrOnly>}\n        </legend>\n        <FieldLabel\n          aria-hidden\n          moreInfo={moreInfo}\n          required={required}\n          openMoreInfo={openInfo}\n        >\n          {legend}\n        </FieldLabel>\n        <div\n          className={styles[\"children\"]}\n          style={{\n            flexDirection: layoutStyles?.flexDirection,\n            gap: layoutStyles?.gap,\n          }}\n        >\n          {children}\n        </div>\n      </fieldset>\n    );\n  },\n);\n\nRadioGroup.displayName = \"RadioGroup\";\n"],"names":["Radio_checked","Radio_outline"],"mappings":"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"}

package/dist/{SearchField-DrgNbG3I.js → SearchField-D6bICv4b.js}

@@ -12,12 +12,15 @@ import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
 
 import './SearchField.css';const SvgSearch = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M15.5 14h-.79l-.28-.27a6.5 6.5 0 0 0 1.48-5.34c-.47-2.78-2.79-5-5.59-5.34a6.505 6.505 0 0 0-7.27 7.27c.34 2.8 2.56 5.12 5.34 5.59a6.5 6.5 0 0 0 5.34-1.48l.27.28v.79l4.25 4.25c.41.41 1.08.41 1.49 0 .41-.41.41-1.08 0-1.49L15.5 14zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" }));
 
-const searchfield = "_searchfield_1s8tg_2";
-const clear = "_clear_1s8tg_10";
+const searchfield = "_searchfield_44tin_2";
+const clear = "_clear_44tin_10";
+const input = "_input_44tin_7";
 const styles = {
 	searchfield: searchfield,
-	"input-wrapper": "_input-wrapper_1s8tg_7",
-	clear: clear};
+	"input-wrapper": "_input-wrapper_44tin_7",
+	clear: clear,
+	input: input
+};
 
 const SearchField = forwardRef(
   function SearchField2(props, ref) {
@@ -62,6 +65,7 @@ const SearchField = forwardRef(
       if (disabled || rest.readOnly) return;
       onClear?.();
       if (value) {
+        inputRef.current.focus();
         return;
       }
       const nativeInputValueSetter = Object.getOwnPropertyDescriptor(
@@ -71,6 +75,28 @@ const SearchField = forwardRef(
       nativeInputValueSetter?.call(inputRef.current, "");
       inputRef.current.dispatchEvent(new Event("input", { bubbles: true }));
       setHasValue(false);
+      inputRef.current.focus();
+    };
+    const handleClearKeyDown = (e) => {
+      if (e.code === "Enter" || e.code === "Space") {
+        e.preventDefault();
+        handleClear();
+      } else if (e.code === "ArrowLeft") {
+        e.preventDefault();
+        inputRef.current?.focus();
+      }
+    };
+    const handleInputKeyDown = (e) => {
+      if (e.code === "ArrowRight" && hasValue) {
+        const input = e.currentTarget;
+        if (input.selectionStart === input.value.length) {
+          e.preventDefault();
+          const clearButton = input.parentElement?.querySelector(
+            '[role="button"]'
+          );
+          clearButton?.focus();
+        }
+      }
     };
     const data = {
       value: props.value,
@@ -113,9 +139,10 @@ const SearchField = forwardRef(
                 /* @__PURE__ */ jsx(
                   "input",
                   {
-                    className: cx(textFieldStyles["input"]),
+                    className: cx(textFieldStyles["input"], styles["input"]),
                     ref: useMergeRefs([ref, inputRef]),
                     onChange: handleOnChange,
+                    onKeyDown: handleInputKeyDown,
                     placeholder,
                     value,
                     type: "search",
@@ -129,10 +156,12 @@ const SearchField = forwardRef(
                 /* @__PURE__ */ jsx(
                   Icon,
                   {
-                    "aria-label": "cancel",
+                    "aria-label": "Clear search",
                     svg: SvgClose,
                     role: "button",
                     onClick: handleClear,
+                    onKeyDown: handleClearKeyDown,
+                    tabIndex: -1,
                     className: styles["clear"],
                     "aria-disabled": disabled,
                     style: {
@@ -151,4 +180,4 @@ const SearchField = forwardRef(
 );
 
 export { SearchField as S, SvgSearch as a };
-//# sourceMappingURL=SearchField-DrgNbG3I.js.map
+//# sourceMappingURL=SearchField-D6bICv4b.js.map

package/dist/SearchField-D6bICv4b.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchField-D6bICv4b.js","sources":["../../hammer-icon/mdi/round/search.svg","../src/components/SearchField/SearchField.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgSearch = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M15.5 14h-.79l-.28-.27a6.5 6.5 0 0 0 1.48-5.34c-.47-2.78-2.79-5-5.59-5.34a6.505 6.505 0 0 0-7.27 7.27c.34 2.8 2.56 5.12 5.34 5.59a6.5 6.5 0 0 0 5.34-1.48l.27.28v.79l4.25 4.25c.41.41 1.08.41 1.49 0 .41-.41.41-1.08 0-1.49L15.5 14zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" }));\nexport default SvgSearch;\n","import {\n  forwardRef,\n  ComponentPropsWithoutRef,\n  useId,\n  useRef,\n  ChangeEvent,\n  KeyboardEvent,\n  useState,\n  useEffect,\n} from \"react\";\nimport cx from \"classnames\";\n\nimport textfieldStyles from \"../TextField/TextField.module.scss\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport Search from \"@servicetitan/hammer-icon/mdi/round/search.svg\";\nimport styles from \"./SearchField.module.scss\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { SrOnly } from \"../SrOnly\";\nimport { Icon } from \"../Icon\";\nimport { useTrackingId, useMergeRefs } from \"../../hooks\";\nimport { DataTrackingId, LayoutUtilProps, Size } from \"../../types\";\n\n/**\n * Props for the SearchField component\n * @extends Omit<ComponentPropsWithoutRef<\"input\">, \"size\" | \"prefix\" | \"required\" | \"children\">\n * @extends LayoutUtilProps\n */\nexport type SearchFieldProps = Omit<\n  ComponentPropsWithoutRef<\"input\">,\n  \"size\" | \"prefix\" | \"required\" | \"children\"\n> &\n  LayoutUtilProps & {\n    /**\n     * Size of the search field\n     * @default \"medium\"\n     */\n    size?: Extract<Size, \"small\" | \"medium\" | \"large\">;\n    /**\n     * Whether the search field is disabled\n     * @default false\n     */\n    disabled?: boolean;\n    /**\n     * Callback when the clear button is clicked or activated via keyboard (Enter/Space)\n     */\n    onClear?: () => void;\n  } & DataTrackingId;\n\n/**\n * SearchField component for text input with search functionality.\n *\n * Features:\n * - Search icon prefix for visual clarity\n * - Clear button that appears when input has value\n * - Arrow key navigation between input and clear button (Right arrow to clear button, Left arrow back to input)\n * - Clear button activated with Enter/Space keys\n * - Focus returns to input after clearing\n * - Multiple size variants (small, medium, large)\n * - Controlled and uncontrolled modes\n * - Disabled and read-only states\n * - Accessibility support with proper ARIA attributes\n * - Layout utility props for positioning and spacing\n * - Automatic value detection for clear button visibility\n * - Search-specific input type and autocomplete settings\n * - Screen reader support with placeholder announcements\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <SearchField\n *   placeholder=\"Search users...\"\n *   onChange={(e) => setSearchTerm(e.target.value)}\n *   onClear={() => setSearchTerm(\"\")}\n * />\n *\n * @example\n * <SearchField\n *   size=\"large\"\n *   value={searchValue}\n *   onChange={(e) => setSearchValue(e.target.value)}\n *   disabled={isLoading}\n * />\n */\nexport const SearchField = forwardRef<HTMLInputElement, SearchFieldProps>(\n  function SearchField(props, ref) {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      className,\n      size,\n      onChange,\n      onClear,\n      id: idProp,\n      disabled,\n      style,\n      value,\n      placeholder = \"Search...\",\n      autoComplete = \"off\",\n      ...rest\n    } = componentProps;\n\n    const [hasValue, setHasValue] = useState(\n      rest.defaultValue || value ? true : false,\n    );\n    const placeholderUid = useId();\n\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const styleCombined = { ...style, ...layoutStyles };\n\n    const handleOnChange = (e: ChangeEvent<HTMLInputElement>) => {\n      if (e.target.value) {\n        setHasValue(true);\n      } else {\n        setHasValue(false);\n      }\n      onChange?.(e);\n    };\n\n    useEffect(() => {\n      if (typeof value === \"undefined\") return;\n      if (value === \"\" || !value) {\n        setHasValue(false);\n      } else {\n        setHasValue(true);\n      }\n    }, [value]);\n\n    const handleClear = () => {\n      if (!inputRef.current) return;\n      if (disabled || rest.readOnly) return;\n      onClear?.();\n      if (value) {\n        inputRef.current.focus();\n        return;\n      }\n      const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n        window.HTMLInputElement.prototype,\n        \"value\",\n      )?.set;\n      nativeInputValueSetter?.call(inputRef.current, \"\");\n      inputRef.current.dispatchEvent(new Event(\"input\", { bubbles: true }));\n      setHasValue(false);\n      inputRef.current.focus();\n    };\n\n    const handleClearKeyDown = (e: KeyboardEvent<HTMLSpanElement>) => {\n      if (e.code === \"Enter\" || e.code === \"Space\") {\n        e.preventDefault();\n        handleClear();\n      } else if (e.code === \"ArrowLeft\") {\n        e.preventDefault();\n        inputRef.current?.focus();\n      }\n    };\n\n    const handleInputKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n      if (e.code === \"ArrowRight\" && hasValue) {\n        const input = e.currentTarget;\n        // Only move focus if cursor is at the end\n        if (input.selectionStart === input.value.length) {\n          e.preventDefault();\n          const clearButton = input.parentElement?.querySelector(\n            '[role=\"button\"]',\n          ) as HTMLElement;\n          clearButton?.focus();\n        }\n      }\n    };\n\n    const data = {\n      value: props.value,\n      defaultValue: props.defaultValue,\n      disabled: props.disabled,\n      readOnly: props.readOnly,\n      size: props.size,\n    };\n\n    const trackingId = useTrackingId({\n      name: \"SearchField\",\n      data,\n      hasOverride: !!props[\"data-tracking-id\"],\n    });\n\n    return (\n      <div\n        className={cx(\n          textfieldStyles[\"textfield\"],\n          styles[\"searchfield\"],\n          className,\n        )}\n        data-anv=\"SearchField\"\n        style={styleCombined}\n      >\n        <div\n          className={cx(\n            textfieldStyles[\"input-wrapper\"],\n            styles[\"input-wrapper\"],\n            {\n              [textfieldStyles[\"small\"]]: size === \"small\",\n              [textfieldStyles[\"large\"]]: size === \"large\",\n            },\n          )}\n          role=\"presentation\"\n          onClick={() => inputRef.current?.focus()}\n        >\n          <div aria-hidden className={textfieldStyles[\"prefix\"]}>\n            <Icon aria-label=\"search\" svg={Search} />\n          </div>\n          <input\n            className={cx(textfieldStyles[\"input\"], styles[\"input\"])}\n            ref={useMergeRefs([ref, inputRef])}\n            onChange={handleOnChange}\n            onKeyDown={handleInputKeyDown}\n            placeholder={placeholder}\n            value={value}\n            type=\"search\"\n            autoComplete={autoComplete}\n            disabled={disabled}\n            aria-labelledby={placeholderUid}\n            data-tracking-id={trackingId}\n            {...rest}\n          />\n          <Icon\n            aria-label=\"Clear search\"\n            svg={Close}\n            role=\"button\"\n            onClick={handleClear}\n            onKeyDown={handleClearKeyDown}\n            tabIndex={-1}\n            className={styles[\"clear\"]}\n            aria-disabled={disabled}\n            style={{\n              visibility: hasValue ? \"visible\" : \"hidden\",\n            }}\n          />\n        </div>\n        <SrOnly id={placeholderUid}>{placeholder}</SrOnly>\n      </div>\n    );\n  },\n);\n"],"names":["SearchField","textfieldStyles","Search","Close"],"mappings":"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"}

package/dist/SearchField.css

@@ -1,29 +1,34 @@
 @layer starter, reset, base, state, application;
 @layer reset {
-  ._searchfield_1s8tg_2 input[type=search]::-webkit-search-cancel-button {
+  ._searchfield_44tin_2 input[type=search]::-webkit-search-cancel-button {
     display: none;
   }
 }
 @layer base {
-  ._searchfield_1s8tg_2 ._input-wrapper_1s8tg_7 {
-    padding-inline-end: 0.75rem;
+  ._searchfield_44tin_2 ._input-wrapper_44tin_7 {
+    padding-inline-end: 0.5rem;
   }
-  ._searchfield_1s8tg_2 ._input-wrapper_1s8tg_7:has(._clear_1s8tg_10:active) {
+  ._searchfield_44tin_2 ._input-wrapper_44tin_7:has(._clear_44tin_10:active) {
     outline: 0.125rem solid var(--focus-ring-color, #0265DC);
     outline-offset: 0.125rem;
   }
-  ._searchfield_1s8tg_2 ._input-wrapper_1s8tg_7 ._input_1s8tg_7::-moz-placeholder {
+  ._searchfield_44tin_2 ._input-wrapper_44tin_7 ._input_44tin_7 {
+    padding-inline-end: 0.5rem;
+  }
+  ._searchfield_44tin_2 ._input-wrapper_44tin_7 ._input_44tin_7::-moz-placeholder {
     color: var(--foreground-color-subdued, #737475);
   }
-  ._searchfield_1s8tg_2 ._input-wrapper_1s8tg_7 ._input_1s8tg_7::placeholder {
+  ._searchfield_44tin_2 ._input-wrapper_44tin_7 ._input_44tin_7::placeholder {
     color: var(--foreground-color-subdued, #737475);
   }
-  ._searchfield_1s8tg_2 ._clear_1s8tg_10 {
+  ._searchfield_44tin_2 ._clear_44tin_10 {
+    border-radius: 0.375rem;
+    padding: 0.25rem;
     cursor: pointer;
   }
 }
 @layer state {
-  ._searchfield_1s8tg_2 ._input-wrapper_1s8tg_7:has(._clear_1s8tg_10:active) {
+  ._searchfield_44tin_2 ._input-wrapper_44tin_7:has(._clear_44tin_10:active) {
     outline: 0.125rem solid var(--focus-ring-color, #0265DC);
     outline-offset: 0.125rem;
   }

package/dist/SearchField.js

@@ -1,2 +1,2 @@
-export { S as SearchField } from './SearchField-DrgNbG3I.js';
+export { S as SearchField } from './SearchField-D6bICv4b.js';
 //# sourceMappingURL=SearchField.js.map

package/dist/{SelectCard-DViLgRGh.js → SelectCard-CjbsPKZ4.js}

@@ -1,8 +1,8 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useContext, createContext, useState, useId, forwardRef, useLayoutEffect } from 'react';
 import { c as cx } from './index-tZvMCc77.js';
-import { C as CheckboxGroup, a as Checkbox } from './Checkbox-DwuDx-t4.js';
-import { R as RadioGroup, a as Radio } from './RadioGroup-m46C69uO.js';
+import { C as CheckboxGroup, a as Checkbox } from './Checkbox-DbBeuNdW.js';
+import { R as RadioGroup, a as Radio } from './RadioGroup-Bxy415eu.js';
 import { C as Card } from './Card-Ch3sMUo5.js';
 import { u as useOptionallyControlledState } from './useOptionallyControlledState-DbDuos5L.js';
 
@@ -222,4 +222,4 @@ const SelectCard = Object.assign(SelectCardElement, {
 });
 
 export { SelectCard as S, SelectCardElement as a, SelectCardGroup as b };
-//# sourceMappingURL=SelectCard-DViLgRGh.js.map
+//# sourceMappingURL=SelectCard-CjbsPKZ4.js.map