@servicetitan/anvil2 2.7.0 → 2.8.0

package/dist/{SegmentedControl-7fDLhgvh.js → SegmentedControl-B9NWUF7s.js}

@@ -3,10 +3,10 @@ import { createContext, forwardRef, useContext, useRef, useId } from 'react';
 import { c as cx } from './index-De1g9FRV.js';
 import { D as Duration } from './primitive-C3RFDRA8.js';
 import { I as Icon } from './Icon-DuIlne4x.js';
-import { u as useReducedMotion } from './use-reduced-motion-DSpxmqyT.js';
-import { m as motion } from './proxy-BbFHSE6L.js';
+import { u as useReducedMotion } from './use-reduced-motion-CqjZZ5QB.js';
 import { useTrackingId } from './useTrackingId.js';
 import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
+import { m as motion } from './proxy-DEehATlA.js';
 import { u as useOptionallyControlledState } from './useOptionallyControlledState-DbDuos5L.js';
 
 import './SegmentedControl.css';const SegmentedControlContext = createContext({});
@@ -92,83 +92,87 @@ const SegmentedControlSegment = forwardRef((props, ref) => {
 });
 SegmentedControlSegment.displayName = "SegmentedControlSegment";
 
-const SegmentedControlElement = forwardRef((props, ref) => {
-  const {
-    className,
-    onClick,
-    onChange,
-    children,
-    size = "medium",
-    defaultSelected,
-    selected,
-    name,
-    fill,
-    ...rest
-  } = props;
-  const [current, setCurrent] = useOptionallyControlledState({
-    controlledValue: selected,
-    defaultValue: defaultSelected,
-    onChange
-  });
-  const segmentedControlRef = useRef(null);
-  const SegmentedControlClassNames = cx(
-    styles["segmented-control"],
-    styles[size],
-    className,
-    {
-      [styles.fill]: fill
-    }
-  );
-  const uid = useId();
-  const data = {
-    name: props.name
-  };
-  const trackingId = useTrackingId({
-    name: "SegmentedControl",
-    data,
-    hasOverride: !!props["data-tracking-id"]
-  });
-  return /* @__PURE__ */ jsx(
-    motion.div,
-    {
-      transition: { duration: 0 },
-      layout: true,
-      role: "radiogroup",
-      className: SegmentedControlClassNames,
-      "data-anv": "segmented-control",
-      "data-tracking-id": trackingId,
-      ref: useMergeRefs([segmentedControlRef, ref]),
-      ...rest,
-      children: /* @__PURE__ */ jsx(
-        SegmentedControlContext.Provider,
+const SegmentedControl = Object.assign(
+  forwardRef(
+    function SegmentedControlInner(props, ref) {
+      const {
+        className,
+        onClick,
+        onChange,
+        children,
+        size = "medium",
+        defaultSelected,
+        selected,
+        name,
+        fill,
+        ...rest
+      } = props;
+      const [current, setCurrent] = useOptionallyControlledState({
+        controlledValue: selected,
+        defaultValue: defaultSelected,
+        onChange
+      });
+      const segmentedControlRef = useRef(null);
+      const SegmentedControlClassNames = cx(
+        styles["segmented-control"],
+        styles[size],
+        className,
+        {
+          [styles.fill]: fill
+        }
+      );
+      const uid = useId();
+      const data = {
+        name: props.name
+      };
+      const trackingId = useTrackingId({
+        name: "SegmentedControl",
+        data,
+        hasOverride: !!props["data-tracking-id"]
+      });
+      return /* @__PURE__ */ jsx(
+        motion.div,
         {
-          value: { current, setCurrent, name: name ?? uid },
-          children
+          transition: { duration: 0 },
+          layout: true,
+          role: "radiogroup",
+          className: SegmentedControlClassNames,
+          "data-anv": "segmented-control",
+          "data-tracking-id": trackingId,
+          ref: useMergeRefs([segmentedControlRef, ref]),
+          ...rest,
+          children: /* @__PURE__ */ jsx(
+            SegmentedControlContext.Provider,
+            {
+              value: { current, setCurrent, name: name ?? uid },
+              children
+            }
+          )
         }
-      )
+      );
     }
-  );
-});
-SegmentedControlElement.displayName = "SegmentedControl";
-const SegmentedControl = Object.assign(SegmentedControlElement, {
-  /**
-   * SegmentedControlSegment component for individual segments within a segmented control.
-   *
-   * Features:
-   * - Individual segment with radio input
-   * - Optional icon support
-   * - Animated selection indicator
-   * - Accessibility support with proper ARIA attributes
-   * - Context integration with parent SegmentedControl
-   * - Motion animations with reduced motion support
-   *
-   * @example
-   * <SegmentedControl.Segment value="option1" icon={Icon1}>
-   *   Option 1
-   * </SegmentedControl.Segment>
-   */
-  Segment: SegmentedControlSegment
-});
+  ),
+  {
+    /**
+     * SegmentedControlSegment component for individual segments within a segmented control.
+     *
+     * Features:
+     * - Individual segment with radio input
+     * - Optional icon support
+     * - Animated selection indicator
+     * - Accessibility support with proper ARIA attributes
+     * - Context integration with parent SegmentedControl
+     * - Motion animations with reduced motion support
+     *
+     * @example
+     * <SegmentedControl.Segment value="option1" icon={Icon1}>
+     *   Option 1
+     * </SegmentedControl.Segment>
+     */
+    Segment: SegmentedControlSegment
+  }
+);
+SegmentedControl.displayName = "SegmentedControl";
 
 export { SegmentedControl as S, SegmentedControlSegment as a };
-//# sourceMappingURL=SegmentedControl-7fDLhgvh.js.map
+//# sourceMappingURL=SegmentedControl-B9NWUF7s.js.map

package/dist/{SegmentedControl-7fDLhgvh.js.map → SegmentedControl-B9NWUF7s.js.map}

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl-7fDLhgvh.js","sources":["../src/components/SegmentedControl/internal/SegmentedControlContext.ts","../src/components/SegmentedControl/SegmentedControlSegment.tsx","../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import { createContext } from \"react\";\n\nimport { SegmentedControlSegmentProps } from \"../SegmentedControlSegment\";\nimport { SegmentedControlProps } from \"../SegmentedControl\";\n\n/**\n * Context props for SegmentedControl internal state management\n */\nexport type SegmentedControlContextProps = {\n  /**\n   * Currently selected segment value\n   */\n  current?: SegmentedControlSegmentProps[\"value\"];\n  /**\n   * Function to set the current segment\n   */\n  setCurrent?: (value: SegmentedControlSegmentProps[\"value\"]) => void;\n  /**\n   * Change handler for the segmented control\n   */\n  onChange?: SegmentedControlProps[\"onChange\"];\n  /**\n   * Name attribute for radio inputs\n   */\n  name?: string;\n};\n\nexport const SegmentedControlContext =\n  createContext<SegmentedControlContextProps>({});\n","import {\n  useContext,\n  useRef,\n  forwardRef,\n  ComponentPropsWithoutRef,\n} from \"react\";\nimport cx from \"classnames\";\nimport { core } from \"@servicetitan/hammer-token\";\n\nimport { DataTrackingId } from \"../../types\";\nimport { Icon, IconProps } from \"../Icon\";\nimport { motion, useReducedMotion } from \"motion/react\";\nimport { useMergeRefs, useTrackingId } from \"../../hooks\";\n\nimport { SegmentedControlContext } from \"./internal/SegmentedControlContext\";\n\nimport styles from \"./SegmentedControl.module.scss\";\n\n/**\n * State object returned by segment interactions\n */\nexport type SegmentState = {\n  /**\n   * Whether the segment is checked\n   */\n  checked: boolean;\n  /**\n   * The value of the segment\n   */\n  value?: SegmentedControlSegmentProps[\"value\"];\n};\n\n/**\n * Props for the SegmentedControlSegment component\n * @extends ComponentPropsWithoutRef<\"label\">\n */\nexport type SegmentedControlSegmentProps = ComponentPropsWithoutRef<\"label\"> & {\n  /**\n   * Optional icon to display in the segment\n   */\n  icon?: IconProps[\"svg\"];\n  /**\n   * Value of the segment\n   */\n  value: string;\n  /**\n   * The content to display in the segment\n   */\n  children?: React.ReactNode;\n} & DataTrackingId;\n\n/**\n * SegmentedControlSegment component for individual segments within a segmented control.\n *\n * Features:\n * - Individual segment with radio input\n * - Optional icon support\n * - Animated selection indicator\n * - Accessibility support with proper ARIA attributes\n * - Context integration with parent SegmentedControl\n * - Motion animations with reduced motion support\n * - Icon-only mode when no children provided\n * - Data tracking id support\n *\n * @example\n * <SegmentedControl.Segment value=\"option1\" icon={Icon1}>\n *   Option 1\n * </SegmentedControl.Segment>\n *\n * @example\n * <SegmentedControl.Segment value=\"icon-only\" icon={IconOnly} />\n */\nexport const SegmentedControlSegment = forwardRef<\n  HTMLLabelElement,\n  SegmentedControlSegmentProps\n>((props, ref) => {\n  const {\n    icon,\n    value,\n    children,\n    className,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n  const shouldReduceMotion = useReducedMotion();\n  const { current, setCurrent, name } = useContext(SegmentedControlContext);\n  const labelRef = useRef<HTMLSpanElement>(null);\n\n  const classNames = cx(styles.segment, className, {\n    [styles[\"icon-only\"]]: icon && !children,\n  });\n\n  const data = {\n    value: props.value,\n  };\n\n  const trackingId = useTrackingId({\n    name: \"SegmentedControlSegment\",\n    data,\n    hasOverride: !!props[\"data-tracking-id\"],\n  });\n\n  // For icon-only segments (no children), use aria-label if provided, otherwise fall back to value\n  const computedAriaLabel = !children ? ariaLabel || value : undefined;\n\n  return (\n    <>\n      <label\n        className={classNames}\n        ref={useMergeRefs([labelRef, ref])}\n        data-tracking-id={trackingId}\n        data-anv=\"segmented-control-segment\"\n        aria-label={computedAriaLabel}\n        {...rest}\n      >\n        <input\n          type=\"radio\"\n          name={name}\n          value={value}\n          onChange={() => setCurrent?.(value)}\n          checked={current === value}\n          aria-checked={current === value}\n        />\n        {icon ? <Icon svg={icon} aria-hidden /> : null}\n        {children}\n        {current === value && (\n          <motion.span\n            layoutId={name}\n            className={styles[\"select-indicator\"]}\n            transition={{\n              duration: shouldReduceMotion\n                ? 0\n                : +core.primitive.Duration.value.replace(\"ms\", \"\") / 1000,\n            }}\n          />\n        )}\n      </label>\n    </>\n  );\n});\n\nSegmentedControlSegment.displayName = \"SegmentedControlSegment\";\n","import { forwardRef, useId, ComponentPropsWithoutRef, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { motion } from \"motion/react\";\n\nimport { DataTrackingId, LayoutUtilProps, Size } from \"../../types\";\nimport { useMergeRefs, useTrackingId } from \"../../hooks\";\nimport { useOptionallyControlledState } from \"../../internal/hooks\";\n\nimport { SegmentedControlContext } from \"./internal/SegmentedControlContext\";\nimport {\n  SegmentedControlSegment,\n  SegmentedControlSegmentProps,\n} from \"./SegmentedControlSegment\";\n\nimport styles from \"./SegmentedControl.module.scss\";\n\n/**\n * Base props for SegmentedControl component\n * @extends Omit<ComponentPropsWithoutRef<\"div\">, \"onAnimationStart\" | \"onDragStart\" | \"onDragEnd\" | \"onDrag\" | \"onChange\">\n * @extends LayoutUtilProps\n */\ntype BaseSegmentedControlProps = Omit<\n  ComponentPropsWithoutRef<\"div\">,\n  \"onAnimationStart\" | \"onDragStart\" | \"onDragEnd\" | \"onDrag\" | \"onChange\"\n> &\n  LayoutUtilProps &\n  DataTrackingId & {\n    /**\n     * Callback when segment is changed\n     */\n    onChange?: (value: SegmentedControlSegmentProps[\"value\"]) => void;\n\n    /**\n     * Size of the segment\n     * @default \"medium\"\n     */\n    size?: Extract<Size, \"small\" | \"medium\">;\n\n    /**\n     * Whether to fill available width\n     * @default false\n     */\n    fill?: boolean;\n\n    /**\n     * Name attribute for radio inputs\n     * @remarks If empty, it will auto generate one using useId()\n     */\n    name?: string;\n\n    /**\n     * The segments to render within the segmented control\n     */\n    children?: React.ReactNode;\n  };\n\n/**\n * Props for controlled SegmentedControl\n */\ntype ControlledSegmentedControlProps = BaseSegmentedControlProps & {\n  /**\n   * Selected segment (controlled mode)\n   */\n  selected: SegmentedControlSegmentProps[\"value\"];\n  defaultSelected?: never;\n};\n\n/**\n * Props for uncontrolled SegmentedControl\n */\ntype UncontrolledSegmentedControlProps = BaseSegmentedControlProps & {\n  /**\n   * Initial selection (uncontrolled mode)\n   */\n  defaultSelected: SegmentedControlSegmentProps[\"value\"];\n  selected?: never;\n};\n\n/**\n * Props for the SegmentedControl component\n */\nexport type SegmentedControlProps =\n  | ControlledSegmentedControlProps\n  | UncontrolledSegmentedControlProps;\n\nconst SegmentedControlElement = forwardRef<\n  HTMLDivElement,\n  SegmentedControlProps\n>((props, ref) => {\n  const {\n    className,\n    onClick,\n    onChange,\n    children,\n    size = \"medium\",\n    defaultSelected,\n    selected,\n    name,\n    fill,\n    ...rest\n  } = props;\n\n  const [current, setCurrent] = useOptionallyControlledState({\n    controlledValue: selected,\n    defaultValue: defaultSelected,\n    onChange,\n  });\n\n  const segmentedControlRef = useRef<HTMLDivElement>(null);\n\n  const SegmentedControlClassNames = cx(\n    styles[\"segmented-control\"],\n    styles[size],\n    className,\n    {\n      [styles.fill]: fill,\n    },\n  );\n\n  const uid = useId();\n\n  const data = {\n    name: props.name,\n  };\n\n  const trackingId = useTrackingId({\n    name: \"SegmentedControl\",\n    data,\n    hasOverride: !!props[\"data-tracking-id\"],\n  });\n\n  return (\n    <motion.div\n      transition={{ duration: 0 }}\n      layout\n      role=\"radiogroup\"\n      className={SegmentedControlClassNames}\n      data-anv=\"segmented-control\"\n      data-tracking-id={trackingId}\n      ref={useMergeRefs([segmentedControlRef, ref])}\n      {...rest}\n    >\n      <SegmentedControlContext.Provider\n        value={{ current, setCurrent, name: name ?? uid }}\n      >\n        {children}\n      </SegmentedControlContext.Provider>\n    </motion.div>\n  );\n});\n\nSegmentedControlElement.displayName = \"SegmentedControl\";\n\n/**\n * SegmentedControl component for selecting one option from a group of related choices.\n *\n * Features:\n * - Supports both controlled and uncontrolled modes\n * - Multiple size variants (small, medium)\n * - Optional fill width mode\n * - Smooth animations with motion\n * - Accessibility support with proper radio group semantics\n * - Layout utility props for positioning and spacing\n * - Context-based state management\n * - Auto-generated or custom name attributes\n * - Segment support via SegmentedControl.Segment\n * - Data tracking id support\n *\n * @example\n * <SegmentedControl\n *   selected={selectedValue}\n *   onChange={setSelectedValue}\n *   size=\"medium\"\n * >\n *   <SegmentedControl.Segment value=\"option1\">Option 1</SegmentedControl.Segment>\n *   <SegmentedControl.Segment value=\"option2\">Option 2</SegmentedControl.Segment>\n *   <SegmentedControl.Segment value=\"option3\">Option 3</SegmentedControl.Segment>\n * </SegmentedControl>\n *\n * @example\n * <SegmentedControl\n *   defaultSelected=\"small\"\n *   size=\"small\"\n *   fill\n * >\n *   <SegmentedControl.Segment value=\"small\" icon={SmallIcon}>Small</SegmentedControl.Segment>\n *   <SegmentedControl.Segment value=\"large\" icon={LargeIcon}>Large</SegmentedControl.Segment>\n * </SegmentedControl>\n */\nexport const SegmentedControl = Object.assign(SegmentedControlElement, {\n  /**\n   * SegmentedControlSegment component for individual segments within a segmented control.\n   *\n   * Features:\n   * - Individual segment with radio input\n   * - Optional icon support\n   * - Animated selection indicator\n   * - Accessibility support with proper ARIA attributes\n   * - Context integration with parent SegmentedControl\n   * - Motion animations with reduced motion support\n   *\n   * @example\n   * <SegmentedControl.Segment value=\"option1\" icon={Icon1}>\n   *   Option 1\n   * </SegmentedControl.Segment>\n   */\n  Segment: SegmentedControlSegment,\n});\n\nexport default SegmentedControl;\n"],"names":["core.primitive.Duration"],"mappings":"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"}
+{"version":3,"file":"SegmentedControl-B9NWUF7s.js","sources":["../src/components/SegmentedControl/internal/SegmentedControlContext.ts","../src/components/SegmentedControl/SegmentedControlSegment.tsx","../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import { createContext } from \"react\";\n\nimport { SegmentedControlSegmentProps } from \"../SegmentedControlSegment\";\nimport { SegmentedControlProps } from \"../SegmentedControl\";\n\n/**\n * Context props for SegmentedControl internal state management\n */\nexport type SegmentedControlContextProps = {\n  /**\n   * Currently selected segment value\n   */\n  current?: SegmentedControlSegmentProps[\"value\"];\n  /**\n   * Function to set the current segment\n   */\n  setCurrent?: (value: SegmentedControlSegmentProps[\"value\"]) => void;\n  /**\n   * Change handler for the segmented control\n   */\n  onChange?: SegmentedControlProps[\"onChange\"];\n  /**\n   * Name attribute for radio inputs\n   */\n  name?: string;\n};\n\nexport const SegmentedControlContext =\n  createContext<SegmentedControlContextProps>({});\n","import {\n  useContext,\n  useRef,\n  forwardRef,\n  ComponentPropsWithoutRef,\n} from \"react\";\nimport cx from \"classnames\";\nimport { core } from \"@servicetitan/hammer-token\";\n\nimport { DataTrackingId } from \"../../types\";\nimport { Icon, IconProps } from \"../Icon\";\nimport { motion, useReducedMotion } from \"motion/react\";\nimport { useMergeRefs, useTrackingId } from \"../../hooks\";\n\nimport { SegmentedControlContext } from \"./internal/SegmentedControlContext\";\n\nimport styles from \"./SegmentedControl.module.scss\";\n\n/**\n * State object returned by segment interactions\n */\nexport type SegmentState = {\n  /**\n   * Whether the segment is checked\n   */\n  checked: boolean;\n  /**\n   * The value of the segment\n   */\n  value?: SegmentedControlSegmentProps[\"value\"];\n};\n\n/**\n * Props for the SegmentedControlSegment component\n * @extends ComponentPropsWithoutRef<\"label\">\n */\nexport type SegmentedControlSegmentProps = ComponentPropsWithoutRef<\"label\"> & {\n  /**\n   * Optional icon to display in the segment\n   */\n  icon?: IconProps[\"svg\"];\n  /**\n   * Value of the segment\n   */\n  value: string;\n  /**\n   * The content to display in the segment\n   */\n  children?: React.ReactNode;\n} & DataTrackingId;\n\n/**\n * SegmentedControlSegment component for individual segments within a segmented control.\n *\n * Features:\n * - Individual segment with radio input\n * - Optional icon support\n * - Animated selection indicator\n * - Accessibility support with proper ARIA attributes\n * - Context integration with parent SegmentedControl\n * - Motion animations with reduced motion support\n * - Icon-only mode when no children provided\n * - Data tracking id support\n *\n * @example\n * <SegmentedControl.Segment value=\"option1\" icon={Icon1}>\n *   Option 1\n * </SegmentedControl.Segment>\n *\n * @example\n * <SegmentedControl.Segment value=\"icon-only\" icon={IconOnly} />\n */\nexport const SegmentedControlSegment = forwardRef<\n  HTMLLabelElement,\n  SegmentedControlSegmentProps\n>((props, ref) => {\n  const {\n    icon,\n    value,\n    children,\n    className,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n  const shouldReduceMotion = useReducedMotion();\n  const { current, setCurrent, name } = useContext(SegmentedControlContext);\n  const labelRef = useRef<HTMLSpanElement>(null);\n\n  const classNames = cx(styles.segment, className, {\n    [styles[\"icon-only\"]]: icon && !children,\n  });\n\n  const data = {\n    value: props.value,\n  };\n\n  const trackingId = useTrackingId({\n    name: \"SegmentedControlSegment\",\n    data,\n    hasOverride: !!props[\"data-tracking-id\"],\n  });\n\n  // For icon-only segments (no children), use aria-label if provided, otherwise fall back to value\n  const computedAriaLabel = !children ? ariaLabel || value : undefined;\n\n  return (\n    <>\n      <label\n        className={classNames}\n        ref={useMergeRefs([labelRef, ref])}\n        data-tracking-id={trackingId}\n        data-anv=\"segmented-control-segment\"\n        aria-label={computedAriaLabel}\n        {...rest}\n      >\n        <input\n          type=\"radio\"\n          name={name}\n          value={value}\n          onChange={() => setCurrent?.(value)}\n          checked={current === value}\n          aria-checked={current === value}\n        />\n        {icon ? <Icon svg={icon} aria-hidden /> : null}\n        {children}\n        {current === value && (\n          <motion.span\n            layoutId={name}\n            className={styles[\"select-indicator\"]}\n            transition={{\n              duration: shouldReduceMotion\n                ? 0\n                : +core.primitive.Duration.value.replace(\"ms\", \"\") / 1000,\n            }}\n          />\n        )}\n      </label>\n    </>\n  );\n});\n\nSegmentedControlSegment.displayName = \"SegmentedControlSegment\";\n","import { forwardRef, useId, ComponentPropsWithoutRef, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { motion } from \"motion/react\";\n\nimport { DataTrackingId, LayoutUtilProps, Size } from \"../../types\";\nimport { useMergeRefs, useTrackingId } from \"../../hooks\";\nimport { useOptionallyControlledState } from \"../../internal/hooks\";\n\nimport { SegmentedControlContext } from \"./internal/SegmentedControlContext\";\nimport {\n  SegmentedControlSegment,\n  SegmentedControlSegmentProps,\n} from \"./SegmentedControlSegment\";\n\nimport styles from \"./SegmentedControl.module.scss\";\n\n/**\n * Base props for SegmentedControl component\n * @extends Omit<ComponentPropsWithoutRef<\"div\">, \"onAnimationStart\" | \"onDragStart\" | \"onDragEnd\" | \"onDrag\" | \"onChange\">\n * @extends LayoutUtilProps\n */\ntype BaseSegmentedControlProps = Omit<\n  ComponentPropsWithoutRef<\"div\">,\n  \"onAnimationStart\" | \"onDragStart\" | \"onDragEnd\" | \"onDrag\" | \"onChange\"\n> &\n  LayoutUtilProps &\n  DataTrackingId & {\n    /**\n     * Callback when segment is changed\n     */\n    onChange?: (value: SegmentedControlSegmentProps[\"value\"]) => void;\n\n    /**\n     * Size of the segment\n     * @default \"medium\"\n     */\n    size?: Extract<Size, \"small\" | \"medium\">;\n\n    /**\n     * Whether to fill available width\n     * @default false\n     */\n    fill?: boolean;\n\n    /**\n     * Name attribute for radio inputs\n     * @remarks If empty, it will auto generate one using useId()\n     */\n    name?: string;\n\n    /**\n     * The segments to render within the segmented control\n     */\n    children?: React.ReactNode;\n  };\n\n/**\n * Props for controlled SegmentedControl\n */\ntype ControlledSegmentedControlProps = BaseSegmentedControlProps & {\n  /**\n   * Selected segment (controlled mode)\n   */\n  selected: SegmentedControlSegmentProps[\"value\"];\n  defaultSelected?: never;\n};\n\n/**\n * Props for uncontrolled SegmentedControl\n */\ntype UncontrolledSegmentedControlProps = BaseSegmentedControlProps & {\n  /**\n   * Initial selection (uncontrolled mode)\n   */\n  defaultSelected: SegmentedControlSegmentProps[\"value\"];\n  selected?: never;\n};\n\n/**\n * Props for the SegmentedControl component\n */\nexport type SegmentedControlProps =\n  | ControlledSegmentedControlProps\n  | UncontrolledSegmentedControlProps;\n\n/**\n * SegmentedControl component for selecting one option from a group of related choices.\n *\n * Features:\n * - Supports both controlled and uncontrolled modes\n * - Multiple size variants (small, medium)\n * - Optional fill width mode\n * - Smooth animations with motion\n * - Accessibility support with proper radio group semantics\n * - Layout utility props for positioning and spacing\n * - Context-based state management\n * - Auto-generated or custom name attributes\n * - Segment support via SegmentedControl.Segment\n * - Data tracking id support\n *\n * @example\n * <SegmentedControl\n *   selected={selectedValue}\n *   onChange={setSelectedValue}\n *   size=\"medium\"\n * >\n *   <SegmentedControl.Segment value=\"option1\">Option 1</SegmentedControl.Segment>\n *   <SegmentedControl.Segment value=\"option2\">Option 2</SegmentedControl.Segment>\n *   <SegmentedControl.Segment value=\"option3\">Option 3</SegmentedControl.Segment>\n * </SegmentedControl>\n *\n * @example\n * <SegmentedControl\n *   defaultSelected=\"small\"\n *   size=\"small\"\n *   fill\n * >\n *   <SegmentedControl.Segment value=\"small\" icon={SmallIcon}>Small</SegmentedControl.Segment>\n *   <SegmentedControl.Segment value=\"large\" icon={LargeIcon}>Large</SegmentedControl.Segment>\n * </SegmentedControl>\n */\nexport const SegmentedControl = Object.assign(\n  forwardRef<HTMLDivElement, SegmentedControlProps>(\n    function SegmentedControlInner(props, ref) {\n      const {\n        className,\n        onClick,\n        onChange,\n        children,\n        size = \"medium\",\n        defaultSelected,\n        selected,\n        name,\n        fill,\n        ...rest\n      } = props;\n\n      const [current, setCurrent] = useOptionallyControlledState({\n        controlledValue: selected,\n        defaultValue: defaultSelected,\n        onChange,\n      });\n\n      const segmentedControlRef = useRef<HTMLDivElement>(null);\n\n      const SegmentedControlClassNames = cx(\n        styles[\"segmented-control\"],\n        styles[size],\n        className,\n        {\n          [styles.fill]: fill,\n        },\n      );\n\n      const uid = useId();\n\n      const data = {\n        name: props.name,\n      };\n\n      const trackingId = useTrackingId({\n        name: \"SegmentedControl\",\n        data,\n        hasOverride: !!props[\"data-tracking-id\"],\n      });\n\n      return (\n        <motion.div\n          transition={{ duration: 0 }}\n          layout\n          role=\"radiogroup\"\n          className={SegmentedControlClassNames}\n          data-anv=\"segmented-control\"\n          data-tracking-id={trackingId}\n          ref={useMergeRefs([segmentedControlRef, ref])}\n          {...rest}\n        >\n          <SegmentedControlContext.Provider\n            value={{ current, setCurrent, name: name ?? uid }}\n          >\n            {children}\n          </SegmentedControlContext.Provider>\n        </motion.div>\n      );\n    },\n  ),\n  {\n    /**\n     * SegmentedControlSegment component for individual segments within a segmented control.\n     *\n     * Features:\n     * - Individual segment with radio input\n     * - Optional icon support\n     * - Animated selection indicator\n     * - Accessibility support with proper ARIA attributes\n     * - Context integration with parent SegmentedControl\n     * - Motion animations with reduced motion support\n     *\n     * @example\n     * <SegmentedControl.Segment value=\"option1\" icon={Icon1}>\n     *   Option 1\n     * </SegmentedControl.Segment>\n     */\n    Segment: SegmentedControlSegment,\n  },\n);\nSegmentedControl.displayName = \"SegmentedControl\";\n\nexport default SegmentedControl;\n"],"names":["core.primitive.Duration"],"mappings":"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"}

package/dist/SegmentedControl.js

@@ -1,2 +1,2 @@
-export { S as SegmentedControl, a as SegmentedControlSegment, S as default } from './SegmentedControl-7fDLhgvh.js';
+export { S as SegmentedControl, a as SegmentedControlSegment, S as default } from './SegmentedControl-B9NWUF7s.js';
 //# sourceMappingURL=SegmentedControl.js.map

package/dist/SelectCard-8OmIDl1m.js

@@ -0,0 +1,352 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useContext, createContext, useState, useMemo, useId, forwardRef, useLayoutEffect, useRef } from 'react';
+import { c as cx } from './index-De1g9FRV.js';
+import { a as CheckboxGroup, C as Checkbox } from './Checkbox-BlFc6ZWy.js';
+import { a as RadioGroup, R as Radio, S as SvgRadioButtonUnchecked, b as SvgRadioButtonChecked } from './Radio-CZZd8phn.js';
+import { C as Card } from './Card-wz71dEVA.js';
+import { I as Icon } from './Icon-DuIlne4x.js';
+import { a as SvgCheckBox, b as SvgCheckBoxOutlineBlank } from './indeterminate_check_box-B4zobNlt.js';
+import { u as useOptionallyControlledState } from './useOptionallyControlledState-DbDuos5L.js';
+
+import './SelectCard.css';const SelectCardContext = createContext(null);
+const useSelectCardContext = () => useContext(SelectCardContext);
+
+const SelectCardProvider = ({
+  children,
+  defaultValue,
+  onChange,
+  selectionMode,
+  showSelectIndicator,
+  value
+}) => {
+  const isControlled = value !== void 0;
+  const [internalSelection, setInternalSelection] = useState(() => {
+    const ids = defaultValue ?? [];
+    return new Set(selectionMode === "single" ? ids.slice(0, 1) : ids);
+  });
+  const selection = useMemo(() => {
+    if (!isControlled) return internalSelection;
+    const ids = value ?? [];
+    return new Set(selectionMode === "single" ? ids.slice(0, 1) : ids);
+  }, [isControlled, value, internalSelection, selectionMode]);
+  const radioName = useId();
+  const handleChange = (e, state, options) => {
+    if (!state || !state.id) {
+      if (!options?.internal) {
+        onChange?.(e, state);
+      }
+      return;
+    }
+    if (!isControlled) {
+      if (selectionMode === "single") {
+        setInternalSelection(state.checked ? /* @__PURE__ */ new Set([state.id]) : /* @__PURE__ */ new Set());
+      } else {
+        setInternalSelection((prev) => {
+          const next = new Set(prev);
+          if (state.checked) {
+            next.add(state.id);
+          } else {
+            next.delete(state.id);
+          }
+          return next;
+        });
+      }
+    }
+    if (!options?.internal) {
+      onChange?.(e, state);
+    }
+  };
+  const context = {
+    hasGroupDefault: defaultValue !== void 0,
+    isGroupControlled: isControlled,
+    selectionMode,
+    onChange: handleChange,
+    radioName,
+    selection,
+    showSelectIndicator
+  };
+  return /* @__PURE__ */ jsx(SelectCardContext.Provider, { value: context, children });
+};
+
+const SelectCardGroup = forwardRef((props, _ref) => {
+  const {
+    ariaLabelledBy,
+    children,
+    defaultValue,
+    legend,
+    legendProps,
+    moreInfo,
+    onChange,
+    required = false,
+    selectionMode,
+    showSelectIndicator = false,
+    value,
+    ...rest
+  } = props;
+  return /* @__PURE__ */ jsxs(
+    SelectCardProvider,
+    {
+      defaultValue,
+      onChange,
+      selectionMode,
+      showSelectIndicator,
+      value,
+      children: [
+        selectionMode === "multiple" && /* @__PURE__ */ jsx(
+          CheckboxGroup,
+          {
+            "aria-labelledby": ariaLabelledBy,
+            legend,
+            legendProps,
+            required,
+            moreInfo,
+            ...rest,
+            children
+          }
+        ),
+        selectionMode === "single" && /* @__PURE__ */ jsx(
+          RadioGroup,
+          {
+            "aria-labelledby": ariaLabelledBy,
+            legend,
+            legendProps,
+            required,
+            moreInfo,
+            ...rest,
+            children
+          }
+        )
+      ]
+    }
+  );
+});
+SelectCardGroup.displayName = "SelectCardGroup";
+
+const styles = {
+	"select-card": "_select-card_1grbf_2",
+	"select-card-wrapper": "_select-card-wrapper_1grbf_20",
+	"select-card-label": "_select-card-label_1grbf_23",
+	"icon-wrapper": "_icon-wrapper_1grbf_26",
+	"icon-checked": "_icon-checked_1grbf_33",
+	"icon-unchecked": "_icon-unchecked_1grbf_34",
+	"select-card--selected": "_select-card--selected_1grbf_45",
+	"select-card--checked": "_select-card--checked_1grbf_61",
+	"select-card--errored": "_select-card--errored_1grbf_68",
+	"select-card--disabled": "_select-card--disabled_1grbf_76",
+	"select-card--remove-drop-shadow": "_select-card--remove-drop-shadow_1grbf_80"
+};
+
+const SelectCard = Object.assign(
+  forwardRef(
+    function SelectCardInner(props, ref) {
+      const {
+        checkboxProps,
+        children,
+        checked: checkedProp,
+        className,
+        defaultChecked: defaultCheckedProp,
+        disabled,
+        errored,
+        radioProps,
+        onChange,
+        removeDropShadow,
+        showSelectIndicator = false,
+        id,
+        ...rest
+      } = props;
+      const [checked, setChecked] = useOptionallyControlledState({
+        controlledValue: checkedProp,
+        defaultValue: defaultCheckedProp || false,
+        onChange
+      });
+      const context = useSelectCardContext();
+      const isCardControlled = checkedProp !== void 0;
+      const isGroupControlled = context?.isGroupControlled ?? false;
+      const [_, setForceRenderCount] = useState(0);
+      useLayoutEffect(() => {
+        const initialChecked = checkedProp ?? defaultCheckedProp;
+        if (initialChecked && !isGroupControlled && !context?.hasGroupDefault) {
+          context?.onChange?.(
+            void 0,
+            {
+              id,
+              checked: initialChecked
+            },
+            { internal: true }
+          );
+          setForceRenderCount((prev) => prev + 1);
+        }
+      }, []);
+      const isFirstRender = useRef(true);
+      useLayoutEffect(() => {
+        if (isFirstRender.current) {
+          isFirstRender.current = false;
+          return;
+        }
+        if (isCardControlled && context) {
+          if (context.selectionMode === "single" && !checkedProp) {
+            return;
+          }
+          context.onChange?.(
+            void 0,
+            {
+              id,
+              checked: checkedProp
+            },
+            { internal: true }
+          );
+        }
+      }, [checkedProp]);
+      const handleChange = (event) => {
+        const newChecked = event ? event.target.checked : false;
+        setChecked(newChecked);
+        context?.onChange?.(event, {
+          id,
+          checked: newChecked
+        });
+      };
+      const isChecked = context ? context.selection.has(id) : checked;
+      const showIndicator = context?.showSelectIndicator || showSelectIndicator;
+      const inputChecked = isGroupControlled ? isChecked : isCardControlled ? checkedProp : void 0;
+      const inputDefaultChecked = isGroupControlled || isCardControlled ? void 0 : context?.hasGroupDefault ? context.selection.has(id) : defaultCheckedProp;
+      const contentClassName = cx(styles["select-card"], className, {
+        [styles["select-card--remove-drop-shadow"]]: removeDropShadow,
+        [styles["select-card--checked"]]: isChecked,
+        [styles["select-card--selected"]]: isChecked && !errored,
+        [styles["select-card--errored"]]: errored,
+        [styles["select-card--disabled"]]: disabled
+      });
+      return /* @__PURE__ */ jsxs(Fragment, { children: [
+        (!context || context?.selectionMode === "multiple") && /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            ...checkboxProps,
+            className: cx(
+              styles["select-card-wrapper"],
+              checkboxProps?.className
+            ),
+            labelWrapperClassName: styles["select-card-label"],
+            checked: inputChecked,
+            defaultChecked: inputDefaultChecked,
+            onChange: handleChange,
+            disabled,
+            ref,
+            label: /* @__PURE__ */ jsx(
+              Card,
+              {
+                ...rest,
+                className: contentClassName,
+                flex: showIndicator ? "1" : void 0,
+                gap: showIndicator ? "2" : void 0,
+                alignItems: showIndicator ? "flex-start" : void 0,
+                children: showIndicator ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsxs("span", { className: styles["icon-wrapper"], "aria-hidden": true, children: [
+                    /* @__PURE__ */ jsx(
+                      Icon,
+                      {
+                        size: "large",
+                        svg: SvgCheckBox,
+                        className: styles["icon-checked"]
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      Icon,
+                      {
+                        size: "large",
+                        svg: SvgCheckBoxOutlineBlank,
+                        className: styles["icon-unchecked"]
+                      }
+                    )
+                  ] }),
+                  children
+                ] }) : children
+              }
+            ),
+            hideCheckbox: true
+          }
+        ),
+        context?.selectionMode === "single" && /* @__PURE__ */ jsx(
+          Radio,
+          {
+            ...radioProps,
+            className: cx(
+              styles["select-card-wrapper"],
+              radioProps?.className
+            ),
+            labelWrapperClassName: styles["select-card-label"],
+            checked: inputChecked,
+            defaultChecked: inputDefaultChecked,
+            onChange: handleChange,
+            disabled,
+            ref,
+            name: context.radioName,
+            label: /* @__PURE__ */ jsx(
+              Card,
+              {
+                ...rest,
+                className: contentClassName,
+                flex: showIndicator ? "1" : void 0,
+                gap: showIndicator ? "2" : void 0,
+                alignItems: showIndicator ? "flex-start" : void 0,
+                children: showIndicator ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsxs("span", { className: styles["icon-wrapper"], "aria-hidden": true, children: [
+                    /* @__PURE__ */ jsx(
+                      Icon,
+                      {
+                        size: "large",
+                        svg: SvgRadioButtonUnchecked,
+                        className: styles["icon-unchecked"]
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      Icon,
+                      {
+                        size: "large",
+                        svg: SvgRadioButtonChecked,
+                        className: styles["icon-checked"]
+                      }
+                    )
+                  ] }),
+                  children
+                ] }) : children
+              }
+            ),
+            hideRadio: true
+          }
+        )
+      ] });
+    }
+  ),
+  {
+    /**
+     * SelectCardGroup component for managing groups of selectable cards.
+     *
+     * Features:
+     * - Manages selection state for multiple SelectCard components
+     * - Supports both single and multiple selection modes
+     * - Provides proper accessibility with legends and ARIA labels
+     * - Handles required field validation
+     * - Automatic radio button grouping for single selection
+     * - Context provider for child SelectCard components
+     *
+     * @example
+     * <SelectCard.Group
+     *   legend="Choose your plan"
+     *   selectionMode="single"
+     *   onChange={(e, state) => console.log('Selection changed:', state)}
+     * >
+     *   <SelectCard id="basic" onChange={() => {}}>
+     *     <Text variant="headline" size="small">Basic Plan</Text>
+     *   </SelectCard>
+     *   <SelectCard id="premium" onChange={() => {}}>
+     *     <Text variant="headline" size="small">Premium Plan</Text>
+     *   </SelectCard>
+     * </SelectCard.Group>
+     */
+    Group: SelectCardGroup
+  }
+);
+SelectCard.displayName = "SelectCard";
+
+export { SelectCard as S };
+//# sourceMappingURL=SelectCard-8OmIDl1m.js.map