@salt-ds/core 1.22.0 → 1.23.0

package/dist-es/segmented-button-group/SegmentedButtonGroup.css.js

@@ -0,0 +1,4 @@
+var css_248z = ".saltSegmentedButtonGroup {\n  display: flex;\n  flex-direction: row;\n  background: var(--button-background);\n  gap: var(--salt-size-border);\n}\n\n.saltSegmentedButtonGroup > *:not(:last-child)::after {\n  content: \"\";\n  width: var(--salt-size-border);\n  position: absolute;\n  background: var(--button-background);\n  right: calc(var(--salt-size-border) * -1);\n  height: 100%;\n}\n\n.saltSegmentedButtonGroup > *:not(:first-child)::before {\n  content: \"\";\n  width: var(--salt-size-border);\n  position: absolute;\n  background: var(--salt-separable-primary-borderColor);\n  left: calc(var(--salt-size-border) * -1);\n  height: 100%;\n}\n";
+
+export { css_248z as default };
+//# sourceMappingURL=SegmentedButtonGroup.css.js.map

package/dist-es/segmented-button-group/SegmentedButtonGroup.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedButtonGroup.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist-es/{card/InteractableCard.js → segmented-button-group/SegmentedButtonGroup.js}

@@ -1,9 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
-import { clsx } from 'clsx';
 import { forwardRef } from 'react';
-import { useWindow } from '@salt-ds/window';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { capitalize } from '../utils/capitalize.js';
+import { clsx } from 'clsx';
 import { makePrefixer } from '../utils/makePrefixer.js';
 import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
@@ -22,9 +19,11 @@ import '../banner/BannerContent.js';
 import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
-import './Card.js';
+import '../card/Card.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
 import '@salt-ds/icons';
 import '../combo-box/ComboBox.js';
 import '../dialog/Dialog.js';
@@ -55,6 +54,9 @@ import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -86,54 +88,23 @@ import '../toggle-button-group/ToggleButtonGroup.js';
 import '../toggle-button-group/ToggleButtonGroupContext.js';
 import '../tooltip/Tooltip.js';
 import '@floating-ui/react';
-import { useInteractableCard } from './useInteractableCard.js';
-import css_248z from './InteractableCard.css.js';
+import css_248z from './SegmentedButtonGroup.css.js';
 
-const withBaseName = makePrefixer("saltInteractableCard");
-const InteractableCard = forwardRef(function InteractableCard2(props, ref) {
-  const {
-    accentPlacement = "bottom",
-    children,
-    className,
-    variant = "primary",
-    disabled,
-    onBlur,
-    onClick,
-    onKeyUp,
-    onKeyDown,
-    ...rest
-  } = props;
+const withBaseName = makePrefixer("saltSegmentedButtonGroup");
+const SegmentedButtonGroup = forwardRef(function SegmentedButtonGroup2({ className, children, ...rest }, ref) {
   const targetWindow = useWindow();
   useComponentCssInjection({
-    testId: "salt-interactable-card",
+    testId: "salt-segmented-button-group",
     css: css_248z,
     window: targetWindow
   });
-  const { active, cardProps } = useInteractableCard({
-    disabled,
-    onKeyUp,
-    onKeyDown,
-    onBlur,
-    onClick
-  });
-  const { tabIndex, ...restCardProps } = cardProps;
   return /* @__PURE__ */ jsx("div", {
-    ...restCardProps,
-    className: clsx(
-      withBaseName(),
-      withBaseName(variant),
-      withBaseName(`accent${capitalize(accentPlacement)}`),
-      {
-        [withBaseName("disabled")]: disabled,
-        [withBaseName("active")]: active
-      },
-      className
-    ),
-    ...rest,
+    className: clsx(withBaseName(), className),
     ref,
+    ...rest,
     children
   });
 });
 
-export { InteractableCard };
-//# sourceMappingURL=InteractableCard.js.map
+export { SegmentedButtonGroup };
+//# sourceMappingURL=SegmentedButtonGroup.js.map

package/dist-es/segmented-button-group/SegmentedButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedButtonGroup.js","sources":["../src/segmented-button-group/SegmentedButtonGroup.tsx"],"sourcesContent":["import { forwardRef, ComponentPropsWithoutRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"../utils\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport segmentedButtonGroupCss from \"./SegmentedButtonGroup.css\";\n\nexport interface SegmentedButtonGroupProps\n  extends ComponentPropsWithoutRef<\"div\"> {}\n\nconst withBaseName = makePrefixer(\"saltSegmentedButtonGroup\");\n\nexport const SegmentedButtonGroup = forwardRef<\n  HTMLDivElement,\n  SegmentedButtonGroupProps\n>(function SegmentedButtonGroup({ className, children, ...rest }, ref) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-segmented-button-group\",\n    css: segmentedButtonGroupCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n      {children}\n    </div>\n  );\n});\n"],"names":["SegmentedButtonGroup","segmentedButtonGroupCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,0BAA0B,CAAA,CAAA;AAE/C,MAAA,oBAAA,GAAuB,WAGlC,SAASA,qBAAAA,CAAqB,EAAE,SAAW,EAAA,QAAA,EAAA,GAAa,IAAK,EAAA,EAAG,GAAK,EAAA;AACrE,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,6BAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAG,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC5D,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/spinner/Spinner.js

@@ -21,7 +21,6 @@ import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import '../card/InteractableCard.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
@@ -56,6 +55,9 @@ import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -75,6 +77,7 @@ import '../progress/LinearProgress/LinearProgress.js';
 import '../radio-button/RadioButton.js';
 import '../radio-button/RadioButtonGroup.js';
 import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
 import '../stack-layout/StackLayout.js';
 import '../status-adornment/StatusAdornment.js';
 import '../toast/Toast.js';

package/dist-es/spinner/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useId } from \"../utils\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\nimport spinnerCss from \"./Spinner.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useDensity } from \"../salt-provider\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"small\" | \"medium\" | \"large\" />\n */\n\nexport const SpinnerSizeValues = [\n  \"default\",\n  \"large\",\n  \"small\",\n  \"medium\",\n] as const;\n\ntype SpinnerSize = (typeof SpinnerSizeValues)[number];\n\nexport type SpinnerSVGSize = Exclude<SpinnerSize, \"default\">;\n\nconst handleSize = (size: SpinnerSize): SpinnerSVGSize =>\n  size === \"default\" ? \"medium\" : size;\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n   */\n  announcerInterval?: number;\n  /**\n   *  * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n   */\n  announcerTimeout?: number;\n  /**\n   * The className(s) of the component\n   */\n  className?: string;\n  /**\n   * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n   */\n  completionAnnouncement?: string | null;\n  /**\n   * If true, built in aria announcer will be inactive\n   */\n  disableAnnouncer?: boolean;\n  /**\n   * The prop for the role attribute of the component\n   */\n  role?: string;\n  /**\n   * Determines the size of the spinner. Must be one of: 'default', 'large', 'small', 'medium'.\n   */\n  size?: SpinnerSize;\n  /**\n   * The ids of the SvgSpinner components\n   */\n  id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n  function Spinner(\n    {\n      \"aria-label\": ariaLabel = \"loading\",\n      announcerInterval = 5000,\n      announcerTimeout = 20000,\n      completionAnnouncement = `finished ${ariaLabel}`,\n      disableAnnouncer,\n      role = \"img\",\n      className,\n      size = \"medium\",\n      id: idProp,\n      ...rest\n    },\n    ref\n  ) {\n    const id = useId(idProp);\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-spinner\",\n      css: spinnerCss,\n      window: targetWindow,\n    });\n\n    const { announce } = useAriaAnnouncer();\n\n    const density = useDensity();\n    size = handleSize(size);\n\n    useEffect(() => {\n      if (disableAnnouncer) return;\n\n      announce(ariaLabel);\n\n      const startTime = new Date().getTime();\n\n      const interval =\n        announcerInterval > 0 &&\n        setInterval(() => {\n          if (new Date().getTime() - startTime > announcerTimeout) {\n            // The announcer will stop after `announcerTimeout` time\n            announce(\n              `${ariaLabel} is still in progress, but will no longer announce.`\n            );\n            interval && clearInterval(interval);\n            return;\n          }\n          announce(ariaLabel);\n        }, announcerInterval);\n\n      return () => {\n        if (disableAnnouncer) return;\n\n        interval && clearInterval(interval);\n        if (completionAnnouncement) {\n          announce(completionAnnouncement);\n        }\n      };\n    }, [\n      announce,\n      announcerInterval,\n      announcerTimeout,\n      ariaLabel,\n      completionAnnouncement,\n      disableAnnouncer,\n    ]);\n\n    return (\n      <div\n        aria-label={ariaLabel}\n        className={clsx(withBaseName(), withBaseName(size), className)}\n        ref={ref}\n        role={role}\n        {...rest}\n      >\n        <SpinnerSVG size={size} density={density} id={id} />\n      </div>\n    );\n  }\n);\n"],"names":["Spinner","spinnerCss"],"mappings":"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"}
+{"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useId } from \"../utils\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\nimport spinnerCss from \"./Spinner.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useDensity } from \"../salt-provider\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"small\" | \"medium\" | \"large\" />\n */\n\nexport const SpinnerSizeValues = [\n  \"default\",\n  \"large\",\n  \"small\",\n  \"medium\",\n] as const;\n\ntype SpinnerSize = (typeof SpinnerSizeValues)[number];\n\nexport type SpinnerSVGSize = Exclude<SpinnerSize, \"default\">;\n\nconst handleSize = (size: SpinnerSize): SpinnerSVGSize =>\n  size === \"default\" ? \"medium\" : size;\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n   */\n  announcerInterval?: number;\n  /**\n   *  * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n   */\n  announcerTimeout?: number;\n  /**\n   * The className(s) of the component\n   */\n  className?: string;\n  /**\n   * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n   */\n  completionAnnouncement?: string | null;\n  /**\n   * If true, built in aria announcer will be inactive\n   */\n  disableAnnouncer?: boolean;\n  /**\n   * The prop for the role attribute of the component\n   */\n  role?: string;\n  /**\n   * Determines the size of the spinner. Must be one of: 'default', 'large', 'small', 'medium'.\n   */\n  size?: SpinnerSize;\n  /**\n   * The ids of the SvgSpinner components\n   */\n  id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n  function Spinner(\n    {\n      \"aria-label\": ariaLabel = \"loading\",\n      announcerInterval = 5000,\n      announcerTimeout = 20000,\n      completionAnnouncement = `finished ${ariaLabel}`,\n      disableAnnouncer,\n      role = \"img\",\n      className,\n      size = \"medium\",\n      id: idProp,\n      ...rest\n    },\n    ref\n  ) {\n    const id = useId(idProp);\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-spinner\",\n      css: spinnerCss,\n      window: targetWindow,\n    });\n\n    const { announce } = useAriaAnnouncer();\n\n    const density = useDensity();\n    size = handleSize(size);\n\n    useEffect(() => {\n      if (disableAnnouncer) return;\n\n      announce(ariaLabel);\n\n      const startTime = new Date().getTime();\n\n      const interval =\n        announcerInterval > 0 &&\n        setInterval(() => {\n          if (new Date().getTime() - startTime > announcerTimeout) {\n            // The announcer will stop after `announcerTimeout` time\n            announce(\n              `${ariaLabel} is still in progress, but will no longer announce.`\n            );\n            interval && clearInterval(interval);\n            return;\n          }\n          announce(ariaLabel);\n        }, announcerInterval);\n\n      return () => {\n        if (disableAnnouncer) return;\n\n        interval && clearInterval(interval);\n        if (completionAnnouncement) {\n          announce(completionAnnouncement);\n        }\n      };\n    }, [\n      announce,\n      announcerInterval,\n      announcerTimeout,\n      ariaLabel,\n      completionAnnouncement,\n      disableAnnouncer,\n    ]);\n\n    return (\n      <div\n        aria-label={ariaLabel}\n        className={clsx(withBaseName(), withBaseName(size), className)}\n        ref={ref}\n        role={role}\n        {...rest}\n      >\n        <SpinnerSVG size={size} density={density} id={id} />\n      </div>\n    );\n  }\n);\n"],"names":["Spinner","spinnerCss"],"mappings":"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"}

package/dist-es/spinner/svgSpinners/SpinnerSVG.js

@@ -20,7 +20,6 @@ import '../../border-item/BorderItem.js';
 import '../../border-layout/BorderLayout.js';
 import '../../button/Button.js';
 import '../../card/Card.js';
-import '../../card/InteractableCard.js';
 import '../../checkbox/Checkbox.js';
 import '../../checkbox/CheckboxGroup.js';
 import '@salt-ds/styles';
@@ -55,6 +54,9 @@ import '../../form-field-context/FormFieldContext.js';
 import '../../grid-item/GridItem.js';
 import '../../grid-layout/GridLayout.js';
 import '../../input/Input.js';
+import '../../interactable-card/InteractableCard.js';
+import '../../interactable-card/InteractableCardGroup.js';
+import '../../interactable-card/InteractableCardGroupContext.js';
 import '../../link/Link.js';
 import '../../link-card/LinkCard.js';
 import '../../list-control/ListControlContext.js';
@@ -74,6 +76,7 @@ import '../../progress/LinearProgress/LinearProgress.js';
 import '../../radio-button/RadioButton.js';
 import '../../radio-button/RadioButtonGroup.js';
 import '../../scrim/Scrim.js';
+import '../../segmented-button-group/SegmentedButtonGroup.js';
 import '../Spinner.js';
 import '../../stack-layout/StackLayout.js';
 import '../../status-adornment/StatusAdornment.js';

package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpinnerSVG.js","sources":["../src/spinner/svgSpinners/SpinnerSVG.tsx"],"sourcesContent":["import { SVGAttributes } from \"react\";\nimport { makePrefixer } from \"../../utils\";\nimport { SpinnerSVGSize } from \"../Spinner\";\nimport { Density } from \"../../theme\";\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\ninterface SpinnerProps {\n  id?: string;\n  rest?: Omit<SVGAttributes<SVGSVGElement>, \"id\">;\n  size: SpinnerSVGSize;\n  density: Density;\n}\n\nconst sizeAndStrokeWidthMapping = {\n  small: {\n    high: { width: 12, strokeWidth: 2 },\n    medium: { width: 12, strokeWidth: 2 },\n    low: { width: 14, strokeWidth: 2 },\n    touch: { width: 16, strokeWidth: 2 },\n  },\n  medium: {\n    high: { width: 20, strokeWidth: 2 },\n    medium: { width: 28, strokeWidth: 4 },\n    low: { width: 36, strokeWidth: 6 },\n    touch: { width: 44, strokeWidth: 8 },\n  },\n  large: {\n    high: { width: 40, strokeWidth: 2 },\n    medium: { width: 56, strokeWidth: 4 },\n    low: { width: 72, strokeWidth: 6 },\n    touch: { width: 88, strokeWidth: 8 },\n  },\n};\n\nexport const SpinnerSVG = ({\n  id = \"svg-spinner\",\n  rest,\n  size,\n  density,\n}: SpinnerProps) => {\n  const { width, strokeWidth } = sizeAndStrokeWidthMapping[size][density];\n  const radius = (width - strokeWidth) / 2;\n\n  return (\n    <svg\n      className={withBaseName(\"spinner\")}\n      viewBox={`0 0 ${width} ${width}`}\n      id={id}\n      {...rest}\n    >\n      <defs>\n        <linearGradient id={`${id}-1`} x1=\"0\" y1=\"0\" x2=\"100%\" y2=\"0\">\n          <stop\n            className={withBaseName(\"gradientStop\")}\n            offset=\"15%\"\n            stopOpacity=\"1\"\n          />\n          <stop\n            className={withBaseName(\"gradientStop\")}\n            offset=\"100%\"\n            stopOpacity=\"0\"\n          />\n        </linearGradient>\n      </defs>\n      <g fill=\"none\">\n        {/* \n          This first path draws the top half of the circle without a gradient. \n          It starts from the right end, moves in a circular arc, and ends at the left end.\n        */}\n        <path\n          d={`M${width - strokeWidth / 2},${\n            width / 2\n          } a${radius},${radius} 0 1,0 -${width - strokeWidth},0`}\n          stroke=\"var(--saltSpinner-gradient-color, var(--salt-accent-background)\"\n          strokeWidth=\"var(--spinner-strokeWidth)\"\n          fill=\"none\"\n        />\n        {/* \n          This second path draws the left half of the circle with a gradient that transitions \n          from opaque on the left to transparent on the right.\n          It starts from the top-center, moves in a circular arc, and ends at the bottom-center.\n        */}\n        <path\n          d={`M${width / 2},${strokeWidth / 2} a${radius},${radius} 0 1,0 0,${\n            width - strokeWidth\n          }`}\n          stroke={`url(#${id}-1)`}\n          strokeWidth=\"var(--spinner-strokeWidth)\"\n          fill=\"none\"\n        />\n      </g>\n    </svg>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SpinnerSVG.js","sources":["../src/spinner/svgSpinners/SpinnerSVG.tsx"],"sourcesContent":["import { SVGAttributes } from \"react\";\nimport { makePrefixer } from \"../../utils\";\nimport { SpinnerSVGSize } from \"../Spinner\";\nimport { Density } from \"../../theme\";\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\ninterface SpinnerProps {\n  id?: string;\n  rest?: Omit<SVGAttributes<SVGSVGElement>, \"id\">;\n  size: SpinnerSVGSize;\n  density: Density;\n}\n\nconst sizeAndStrokeWidthMapping = {\n  small: {\n    high: { width: 12, strokeWidth: 2 },\n    medium: { width: 12, strokeWidth: 2 },\n    low: { width: 14, strokeWidth: 2 },\n    touch: { width: 16, strokeWidth: 2 },\n  },\n  medium: {\n    high: { width: 20, strokeWidth: 2 },\n    medium: { width: 28, strokeWidth: 4 },\n    low: { width: 36, strokeWidth: 6 },\n    touch: { width: 44, strokeWidth: 8 },\n  },\n  large: {\n    high: { width: 40, strokeWidth: 2 },\n    medium: { width: 56, strokeWidth: 4 },\n    low: { width: 72, strokeWidth: 6 },\n    touch: { width: 88, strokeWidth: 8 },\n  },\n};\n\nexport const SpinnerSVG = ({\n  id = \"svg-spinner\",\n  rest,\n  size,\n  density,\n}: SpinnerProps) => {\n  const { width, strokeWidth } = sizeAndStrokeWidthMapping[size][density];\n  const radius = (width - strokeWidth) / 2;\n\n  return (\n    <svg\n      className={withBaseName(\"spinner\")}\n      viewBox={`0 0 ${width} ${width}`}\n      id={id}\n      {...rest}\n    >\n      <defs>\n        <linearGradient id={`${id}-1`} x1=\"0\" y1=\"0\" x2=\"100%\" y2=\"0\">\n          <stop\n            className={withBaseName(\"gradientStop\")}\n            offset=\"15%\"\n            stopOpacity=\"1\"\n          />\n          <stop\n            className={withBaseName(\"gradientStop\")}\n            offset=\"100%\"\n            stopOpacity=\"0\"\n          />\n        </linearGradient>\n      </defs>\n      <g fill=\"none\">\n        {/* \n          This first path draws the top half of the circle without a gradient. \n          It starts from the right end, moves in a circular arc, and ends at the left end.\n        */}\n        <path\n          d={`M${width - strokeWidth / 2},${\n            width / 2\n          } a${radius},${radius} 0 1,0 -${width - strokeWidth},0`}\n          stroke=\"var(--saltSpinner-gradient-color, var(--salt-accent-background)\"\n          strokeWidth=\"var(--spinner-strokeWidth)\"\n          fill=\"none\"\n        />\n        {/* \n          This second path draws the left half of the circle with a gradient that transitions \n          from opaque on the left to transparent on the right.\n          It starts from the top-center, moves in a circular arc, and ends at the bottom-center.\n        */}\n        <path\n          d={`M${width / 2},${strokeWidth / 2} a${radius},${radius} 0 1,0 0,${\n            width - strokeWidth\n          }`}\n          stroke={`url(#${id}-1)`}\n          strokeWidth=\"var(--spinner-strokeWidth)\"\n          fill=\"none\"\n        />\n      </g>\n    </svg>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist-es/split-layout/SplitLayout.js

@@ -21,7 +21,6 @@ import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import '../card/InteractableCard.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
@@ -55,6 +54,9 @@ import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -74,6 +76,7 @@ import '../progress/LinearProgress/LinearProgress.js';
 import '../radio-button/RadioButton.js';
 import '../radio-button/RadioButtonGroup.js';
 import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
 import '../spinner/Spinner.js';
 import '../stack-layout/StackLayout.js';
 import '../status-adornment/StatusAdornment.js';

package/dist-es/split-layout/SplitLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"SplitLayout.js","sources":["../src/split-layout/SplitLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement, ReactNode } from \"react\";\nimport { FlexLayout, FlexLayoutProps } from \"../flex-layout\";\nimport {\n  makePrefixer,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\nimport splitLayoutCss from \"./SplitLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { clsx } from \"clsx\";\n\nconst withBaseName = makePrefixer(\"saltSplitLayout\");\n\nexport type SplitLayoutProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Defines the default behavior for how flex items are laid out along the cross axis on the current line.\n       */\n      align?: FlexLayoutProps<ElementType>[\"align\"];\n      /**\n       * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n       */\n      direction?: FlexLayoutProps<ElementType>[\"direction\"];\n      /**\n       * End component to be rendered.\n       */\n      endItem?: ReactNode;\n      /**\n       * Controls the space between left and right items.\n       */\n      gap?: FlexLayoutProps<ElementType>[\"gap\"];\n      /**\n       * Start component to be rendered.\n       */\n      startItem?: ReactNode;\n    }\n  >;\n\ntype SplitLayoutComponent = <T extends ElementType = \"div\">(\n  props: SplitLayoutProps<T>\n) => ReactElement | null;\n\nexport const SplitLayout: SplitLayoutComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    { endItem, startItem, className, ...rest }: SplitLayoutProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-split-layout\",\n      css: splitLayoutCss,\n      window: targetWindow,\n    });\n\n    const justify = endItem && !startItem ? \"end\" : \"space-between\";\n    return (\n      <FlexLayout\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        justify={justify}\n        {...rest}\n      >\n        {startItem}\n        {endItem}\n      </FlexLayout>\n    );\n  }\n);\n"],"names":["splitLayoutCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA,CAAA;AAiC5C,MAAM,WAAoC,GAAA,UAAA;AAAA,EAC/C,CACE,EAAE,OAAA,EAAS,WAAW,SAAc,EAAA,GAAA,IAAA,IACpC,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,OAAU,GAAA,OAAA,IAAW,CAAC,SAAA,GAAY,KAAQ,GAAA,eAAA,CAAA;AAChD,IAAA,uBACG,IAAA,CAAA,UAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,OAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,SAAA;AAAA,QACA,OAAA;AAAA,OAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"SplitLayout.js","sources":["../src/split-layout/SplitLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement, ReactNode } from \"react\";\nimport { FlexLayout, FlexLayoutProps } from \"../flex-layout\";\nimport {\n  makePrefixer,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\nimport splitLayoutCss from \"./SplitLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { clsx } from \"clsx\";\n\nconst withBaseName = makePrefixer(\"saltSplitLayout\");\n\nexport type SplitLayoutProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Defines the default behavior for how flex items are laid out along the cross axis on the current line.\n       */\n      align?: FlexLayoutProps<ElementType>[\"align\"];\n      /**\n       * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n       */\n      direction?: FlexLayoutProps<ElementType>[\"direction\"];\n      /**\n       * End component to be rendered.\n       */\n      endItem?: ReactNode;\n      /**\n       * Controls the space between left and right items.\n       */\n      gap?: FlexLayoutProps<ElementType>[\"gap\"];\n      /**\n       * Start component to be rendered.\n       */\n      startItem?: ReactNode;\n    }\n  >;\n\ntype SplitLayoutComponent = <T extends ElementType = \"div\">(\n  props: SplitLayoutProps<T>\n) => ReactElement | null;\n\nexport const SplitLayout: SplitLayoutComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    { endItem, startItem, className, ...rest }: SplitLayoutProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-split-layout\",\n      css: splitLayoutCss,\n      window: targetWindow,\n    });\n\n    const justify = endItem && !startItem ? \"end\" : \"space-between\";\n    return (\n      <FlexLayout\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        justify={justify}\n        {...rest}\n      >\n        {startItem}\n        {endItem}\n      </FlexLayout>\n    );\n  }\n);\n"],"names":["splitLayoutCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA,CAAA;AAiC5C,MAAM,WAAoC,GAAA,UAAA;AAAA,EAC/C,CACE,EAAE,OAAA,EAAS,WAAW,SAAc,EAAA,GAAA,IAAA,IACpC,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,OAAU,GAAA,OAAA,IAAW,CAAC,SAAA,GAAY,KAAQ,GAAA,eAAA,CAAA;AAChD,IAAA,uBACG,IAAA,CAAA,UAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,OAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,SAAA;AAAA,QACA,OAAA;AAAA,OAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/stack-layout/StackLayout.js

@@ -20,7 +20,6 @@ import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import '../card/InteractableCard.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
@@ -55,6 +54,9 @@ import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -74,6 +76,7 @@ import '../progress/LinearProgress/LinearProgress.js';
 import '../radio-button/RadioButton.js';
 import '../radio-button/RadioButtonGroup.js';
 import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
 import '../spinner/Spinner.js';
 import '../status-adornment/StatusAdornment.js';
 import '../toast/Toast.js';

package/dist-es/stack-layout/StackLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackLayout.js","sources":["../src/stack-layout/StackLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport {\n  FlexLayout,\n  FlexLayoutProps,\n  LayoutDirection,\n  LayoutSeparator,\n} from \"../flex-layout\";\nimport {\n  makePrefixer,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n  ResponsiveProp,\n  useResponsiveProp,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport stackLayoutCss from \"./StackLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltStackLayout\");\n\nexport type StackLayoutProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n       */\n      align?: FlexLayoutProps<ElementType>[\"align\"];\n      /**\n       * Establishes the main-axis, defining the direction children are placed. Default is \"column\".\n       */\n      direction?: ResponsiveProp<LayoutDirection>;\n      /**\n       * Controls the space between items, default is 3.\n       */\n      gap?: FlexLayoutProps<ElementType>[\"gap\"];\n      /**\n       * Adds a separator between elements, default is false.\n       */\n      separators?: LayoutSeparator | boolean;\n    }\n  >;\n\ntype StackLayoutComponent = <T extends ElementType = \"div\">(\n  props: StackLayoutProps<T>\n) => ReactElement | null;\n\nexport const StackLayout: StackLayoutComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    {\n      children,\n      className,\n      direction = \"column\",\n      gap,\n      separators,\n      style,\n      ...rest\n    }: StackLayoutProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-stack-layout\",\n      css: stackLayoutCss,\n      window: targetWindow,\n    });\n\n    const flexGap = useResponsiveProp(gap, 3);\n    const separatorAlignment = separators === true ? \"center\" : separators;\n    const flexDirection = useResponsiveProp(direction, \"column\");\n    const stackLayoutStyles = {\n      ...style,\n      \"--stackLayout-gap-multiplier\": flexGap,\n    };\n    return (\n      <FlexLayout\n        className={clsx(\n          withBaseName(),\n          withBaseName(flexDirection),\n          {\n            [withBaseName(\"separator\")]: !!separatorAlignment,\n            [separatorAlignment\n              ? withBaseName(`separator-${separatorAlignment}`)\n              : \"\"]: separatorAlignment,\n          },\n          className\n        )}\n        ref={ref}\n        direction={direction}\n        style={stackLayoutStyles}\n        wrap={false}\n        gap={flexGap}\n        {...rest}\n      >\n        {children}\n      </FlexLayout>\n    );\n  }\n);\n"],"names":["stackLayoutCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA,CAAA;AA6B5C,MAAM,WAAoC,GAAA,UAAA;AAAA,EAC/C,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAY,GAAA,QAAA;AAAA,IACZ,GAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AACxC,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,QAAQ,CAAA,CAAA;AAC3D,IAAA,MAAM,iBAAoB,GAAA;AAAA,MACxB,GAAG,KAAA;AAAA,MACH,8BAAgC,EAAA,OAAA;AAAA,KAClC,CAAA;AACA,IAAA,uBACG,GAAA,CAAA,UAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,aAAa,CAAA;AAAA,QAC1B;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,CAAC,CAAC,kBAAA;AAAA,UAC/B,CAAC,kBACG,GAAA,YAAA,CAAa,CAAa,UAAA,EAAA,kBAAA,CAAA,CAAoB,IAC9C,EAAK,GAAA,kBAAA;AAAA,SACX;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAO,EAAA,iBAAA;AAAA,MACP,IAAM,EAAA,KAAA;AAAA,MACN,GAAK,EAAA,OAAA;AAAA,MACJ,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"StackLayout.js","sources":["../src/stack-layout/StackLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport {\n  FlexLayout,\n  FlexLayoutProps,\n  LayoutDirection,\n  LayoutSeparator,\n} from \"../flex-layout\";\nimport {\n  makePrefixer,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n  ResponsiveProp,\n  useResponsiveProp,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport stackLayoutCss from \"./StackLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltStackLayout\");\n\nexport type StackLayoutProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n       */\n      align?: FlexLayoutProps<ElementType>[\"align\"];\n      /**\n       * Establishes the main-axis, defining the direction children are placed. Default is \"column\".\n       */\n      direction?: ResponsiveProp<LayoutDirection>;\n      /**\n       * Controls the space between items, default is 3.\n       */\n      gap?: FlexLayoutProps<ElementType>[\"gap\"];\n      /**\n       * Adds a separator between elements, default is false.\n       */\n      separators?: LayoutSeparator | boolean;\n    }\n  >;\n\ntype StackLayoutComponent = <T extends ElementType = \"div\">(\n  props: StackLayoutProps<T>\n) => ReactElement | null;\n\nexport const StackLayout: StackLayoutComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    {\n      children,\n      className,\n      direction = \"column\",\n      gap,\n      separators,\n      style,\n      ...rest\n    }: StackLayoutProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-stack-layout\",\n      css: stackLayoutCss,\n      window: targetWindow,\n    });\n\n    const flexGap = useResponsiveProp(gap, 3);\n    const separatorAlignment = separators === true ? \"center\" : separators;\n    const flexDirection = useResponsiveProp(direction, \"column\");\n    const stackLayoutStyles = {\n      ...style,\n      \"--stackLayout-gap-multiplier\": flexGap,\n    };\n    return (\n      <FlexLayout\n        className={clsx(\n          withBaseName(),\n          withBaseName(flexDirection),\n          {\n            [withBaseName(\"separator\")]: !!separatorAlignment,\n            [separatorAlignment\n              ? withBaseName(`separator-${separatorAlignment}`)\n              : \"\"]: separatorAlignment,\n          },\n          className\n        )}\n        ref={ref}\n        direction={direction}\n        style={stackLayoutStyles}\n        wrap={false}\n        gap={flexGap}\n        {...rest}\n      >\n        {children}\n      </FlexLayout>\n    );\n  }\n);\n"],"names":["stackLayoutCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA,CAAA;AA6B5C,MAAM,WAAoC,GAAA,UAAA;AAAA,EAC/C,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAY,GAAA,QAAA;AAAA,IACZ,GAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AACxC,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,QAAQ,CAAA,CAAA;AAC3D,IAAA,MAAM,iBAAoB,GAAA;AAAA,MACxB,GAAG,KAAA;AAAA,MACH,8BAAgC,EAAA,OAAA;AAAA,KAClC,CAAA;AACA,IAAA,uBACG,GAAA,CAAA,UAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,aAAa,CAAA;AAAA,QAC1B;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,CAAC,CAAC,kBAAA;AAAA,UAC/B,CAAC,kBACG,GAAA,YAAA,CAAa,CAAa,UAAA,EAAA,kBAAA,CAAA,CAAoB,IAC9C,EAAK,GAAA,kBAAA;AAAA,SACX;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAO,EAAA,iBAAA;AAAA,MACP,IAAM,EAAA,KAAA;AAAA,MACN,GAAK,EAAA,OAAA;AAAA,MACJ,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/status-adornment/StatusAdornment.js

@@ -22,7 +22,6 @@ import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import '../card/InteractableCard.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
 import '@salt-ds/icons';
@@ -55,6 +54,9 @@ import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -74,6 +76,7 @@ import '../progress/LinearProgress/LinearProgress.js';
 import '../radio-button/RadioButton.js';
 import '../radio-button/RadioButtonGroup.js';
 import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
 import '../spinner/Spinner.js';
 import '../stack-layout/StackLayout.js';
 import '../toast/Toast.js';

package/dist-es/status-adornment/StatusAdornment.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusAdornment.js","sources":["../src/status-adornment/StatusAdornment.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\nimport { ErrorAdornmentIcon } from \"./ErrorAdornment\";\nimport { SuccessAdornmentIcon } from \"./SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"./WarningAdornment\";\n\nimport statusAdornmentCss from \"./StatusAdornment.css\";\n\nconst icons = {\n  error: ErrorAdornmentIcon,\n  warning: WarningAdornmentIcon,\n  success: SuccessAdornmentIcon,\n};\n\nexport type AdornmentValidationStatus = Exclude<ValidationStatus, \"info\">;\n\nexport interface StatusAdornmentProps extends IconProps {\n  /**\n   * Status adornment to be displayed.\n   */\n  status: AdornmentValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<AdornmentValidationStatus, string> = {\n  error: \"error\",\n  warning: \"warning\",\n  success: \"success\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusAdornment\");\n\nexport const StatusAdornment = forwardRef<SVGSVGElement, StatusAdornmentProps>(\n  function StatusAdornment({ className, status, ...restProps }, ref) {\n    const AdornmentComponent = icons[status];\n    const ariaLabel = statusToAriaLabelMap[status];\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-status-adornment\",\n      css: statusAdornmentCss,\n      window: targetWindow,\n    });\n\n    return (\n      <AdornmentComponent\n        className={clsx(withBaseName(), withBaseName(status), className)}\n        aria-label={ariaLabel}\n        {...restProps}\n        ref={ref}\n      />\n    );\n  }\n);\n"],"names":["StatusAdornment","statusAdornmentCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,KAAQ,GAAA;AAAA,EACZ,KAAO,EAAA,kBAAA;AAAA,EACP,OAAS,EAAA,oBAAA;AAAA,EACT,OAAS,EAAA,oBAAA;AACX,CAAA,CAAA;AAWA,MAAM,oBAAkE,GAAA;AAAA,EACtE,KAAO,EAAA,OAAA;AAAA,EACP,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AACX,CAAA,CAAA;AAEA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAEhD,MAAM,eAAkB,GAAA,UAAA;AAAA,EAC7B,SAASA,gBAAgB,CAAA,EAAE,WAAW,MAAW,EAAA,GAAA,SAAA,IAAa,GAAK,EAAA;AACjE,IAAA,MAAM,qBAAqB,KAAM,CAAA,MAAA,CAAA,CAAA;AACjC,IAAA,MAAM,YAAY,oBAAqB,CAAA,MAAA,CAAA,CAAA;AAEvC,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,uBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACG,GAAA,CAAA,kBAAA,EAAA;AAAA,MACC,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,MAC/D,YAAY,EAAA,SAAA;AAAA,MACX,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"StatusAdornment.js","sources":["../src/status-adornment/StatusAdornment.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\nimport { ErrorAdornmentIcon } from \"./ErrorAdornment\";\nimport { SuccessAdornmentIcon } from \"./SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"./WarningAdornment\";\n\nimport statusAdornmentCss from \"./StatusAdornment.css\";\n\nconst icons = {\n  error: ErrorAdornmentIcon,\n  warning: WarningAdornmentIcon,\n  success: SuccessAdornmentIcon,\n};\n\nexport type AdornmentValidationStatus = Exclude<ValidationStatus, \"info\">;\n\nexport interface StatusAdornmentProps extends IconProps {\n  /**\n   * Status adornment to be displayed.\n   */\n  status: AdornmentValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<AdornmentValidationStatus, string> = {\n  error: \"error\",\n  warning: \"warning\",\n  success: \"success\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusAdornment\");\n\nexport const StatusAdornment = forwardRef<SVGSVGElement, StatusAdornmentProps>(\n  function StatusAdornment({ className, status, ...restProps }, ref) {\n    const AdornmentComponent = icons[status];\n    const ariaLabel = statusToAriaLabelMap[status];\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-status-adornment\",\n      css: statusAdornmentCss,\n      window: targetWindow,\n    });\n\n    return (\n      <AdornmentComponent\n        className={clsx(withBaseName(), withBaseName(status), className)}\n        aria-label={ariaLabel}\n        {...restProps}\n        ref={ref}\n      />\n    );\n  }\n);\n"],"names":["StatusAdornment","statusAdornmentCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,KAAQ,GAAA;AAAA,EACZ,KAAO,EAAA,kBAAA;AAAA,EACP,OAAS,EAAA,oBAAA;AAAA,EACT,OAAS,EAAA,oBAAA;AACX,CAAA,CAAA;AAWA,MAAM,oBAAkE,GAAA;AAAA,EACtE,KAAO,EAAA,OAAA;AAAA,EACP,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AACX,CAAA,CAAA;AAEA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAEhD,MAAM,eAAkB,GAAA,UAAA;AAAA,EAC7B,SAASA,gBAAgB,CAAA,EAAE,WAAW,MAAW,EAAA,GAAA,SAAA,IAAa,GAAK,EAAA;AACjE,IAAA,MAAM,qBAAqB,KAAM,CAAA,MAAA,CAAA,CAAA;AACjC,IAAA,MAAM,YAAY,oBAAqB,CAAA,MAAA,CAAA,CAAA;AAEvC,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,uBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACG,GAAA,CAAA,kBAAA,EAAA;AAAA,MACC,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,MAC/D,YAAY,EAAA,SAAA;AAAA,MACX,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/status-indicator/StatusIndicator.js

@@ -21,7 +21,6 @@ import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import '../card/InteractableCard.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
@@ -54,6 +53,9 @@ import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -73,6 +75,7 @@ import '../progress/LinearProgress/LinearProgress.js';
 import '../radio-button/RadioButton.js';
 import '../radio-button/RadioButtonGroup.js';
 import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
 import '../spinner/Spinner.js';
 import '../stack-layout/StackLayout.js';
 import '../status-adornment/StatusAdornment.js';

package/dist-es/status-indicator/StatusIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusIndicator.js","sources":["../src/status-indicator/StatusIndicator.tsx"],"sourcesContent":["import {\n  DEFAULT_ICON_SIZE,\n  ErrorSolidIcon,\n  IconProps,\n  InfoSolidIcon,\n  SuccessTickIcon,\n  WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { ValidationStatus } from \"./ValidationStatus\";\n\nimport statusIndicatorCss from \"./StatusIndicator.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst icons = {\n  error: ErrorSolidIcon,\n  success: SuccessTickIcon,\n  warning: WarningSolidIcon,\n  info: InfoSolidIcon,\n};\n\nexport interface StatusIndicatorProps extends IconProps {\n  /**\n   * Status indicator to be displayed.\n   */\n  status: ValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<ValidationStatus, string> = {\n  error: \"error\",\n  success: \"success\",\n  warning: \"warning\",\n  info: \"info\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusIndicator\");\n\nexport const StatusIndicator = forwardRef<SVGSVGElement, StatusIndicatorProps>(\n  function StatusIndicator(\n    { className, status, size = DEFAULT_ICON_SIZE, ...restProps },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-status-indicator\",\n      css: statusIndicatorCss,\n      window: targetWindow,\n    });\n\n    const IconComponent = icons[status];\n    const ariaLabel = statusToAriaLabelMap[status];\n\n    return (\n      <IconComponent\n        className={clsx(withBaseName(), withBaseName(status), className)}\n        size={size}\n        aria-label={ariaLabel}\n        {...restProps}\n        ref={ref}\n      />\n    );\n  }\n);\n"],"names":["StatusIndicator","statusIndicatorCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,KAAQ,GAAA;AAAA,EACZ,KAAO,EAAA,cAAA;AAAA,EACP,OAAS,EAAA,eAAA;AAAA,EACT,OAAS,EAAA,gBAAA;AAAA,EACT,IAAM,EAAA,aAAA;AACR,CAAA,CAAA;AASA,MAAM,oBAAyD,GAAA;AAAA,EAC7D,KAAO,EAAA,OAAA;AAAA,EACP,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA,MAAA;AACR,CAAA,CAAA;AAEA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAEhD,MAAM,eAAkB,GAAA,UAAA;AAAA,EAC7B,SAASA,iBACP,EAAE,SAAA,EAAW,QAAQ,IAAO,GAAA,iBAAA,EAAA,GAAsB,SAAU,EAAA,EAC5D,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,uBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,gBAAgB,KAAM,CAAA,MAAA,CAAA,CAAA;AAC5B,IAAA,MAAM,YAAY,oBAAqB,CAAA,MAAA,CAAA,CAAA;AAEvC,IAAA,uBACG,GAAA,CAAA,aAAA,EAAA;AAAA,MACC,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,MAC/D,IAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACX,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"StatusIndicator.js","sources":["../src/status-indicator/StatusIndicator.tsx"],"sourcesContent":["import {\n  DEFAULT_ICON_SIZE,\n  ErrorSolidIcon,\n  IconProps,\n  InfoSolidIcon,\n  SuccessTickIcon,\n  WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { ValidationStatus } from \"./ValidationStatus\";\n\nimport statusIndicatorCss from \"./StatusIndicator.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst icons = {\n  error: ErrorSolidIcon,\n  success: SuccessTickIcon,\n  warning: WarningSolidIcon,\n  info: InfoSolidIcon,\n};\n\nexport interface StatusIndicatorProps extends IconProps {\n  /**\n   * Status indicator to be displayed.\n   */\n  status: ValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<ValidationStatus, string> = {\n  error: \"error\",\n  success: \"success\",\n  warning: \"warning\",\n  info: \"info\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusIndicator\");\n\nexport const StatusIndicator = forwardRef<SVGSVGElement, StatusIndicatorProps>(\n  function StatusIndicator(\n    { className, status, size = DEFAULT_ICON_SIZE, ...restProps },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-status-indicator\",\n      css: statusIndicatorCss,\n      window: targetWindow,\n    });\n\n    const IconComponent = icons[status];\n    const ariaLabel = statusToAriaLabelMap[status];\n\n    return (\n      <IconComponent\n        className={clsx(withBaseName(), withBaseName(status), className)}\n        size={size}\n        aria-label={ariaLabel}\n        {...restProps}\n        ref={ref}\n      />\n    );\n  }\n);\n"],"names":["StatusIndicator","statusIndicatorCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,KAAQ,GAAA;AAAA,EACZ,KAAO,EAAA,cAAA;AAAA,EACP,OAAS,EAAA,eAAA;AAAA,EACT,OAAS,EAAA,gBAAA;AAAA,EACT,IAAM,EAAA,aAAA;AACR,CAAA,CAAA;AASA,MAAM,oBAAyD,GAAA;AAAA,EAC7D,KAAO,EAAA,OAAA;AAAA,EACP,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA,MAAA;AACR,CAAA,CAAA;AAEA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAEhD,MAAM,eAAkB,GAAA,UAAA;AAAA,EAC7B,SAASA,iBACP,EAAE,SAAA,EAAW,QAAQ,IAAO,GAAA,iBAAA,EAAA,GAAsB,SAAU,EAAA,EAC5D,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,uBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,gBAAgB,KAAM,CAAA,MAAA,CAAA,CAAA;AAC5B,IAAA,MAAM,YAAY,oBAAqB,CAAA,MAAA,CAAA,CAAA;AAEvC,IAAA,uBACG,GAAA,CAAA,aAAA,EAAA;AAAA,MACC,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,MAC/D,IAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACX,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/switch/Switch.js

@@ -23,7 +23,6 @@ import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import '../card/InteractableCard.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
@@ -57,6 +56,9 @@ import '../text/TextNotation.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -76,6 +78,7 @@ import '../progress/LinearProgress/LinearProgress.js';
 import '../radio-button/RadioButton.js';
 import '../radio-button/RadioButtonGroup.js';
 import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
 import '../spinner/Spinner.js';
 import '../stack-layout/StackLayout.js';
 import '../status-adornment/StatusAdornment.js';
@@ -174,6 +177,7 @@ const Switch = forwardRef(function Switch2(props, ref) {
         onChange: handleChange,
         onFocus,
         type: "checkbox",
+        role: "switch",
         ...restInputProps
       }),
       /* @__PURE__ */ jsx("span", {

package/dist-es/switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sources":["../src/switch/Switch.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  ComponentPropsWithoutRef,\n  FocusEventHandler,\n  forwardRef,\n  ReactNode,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { useDensity } from \"../salt-provider\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport switchCss from \"./Switch.css\";\nimport {\n  IconProps,\n  SuccessSmallSolidIcon,\n  SuccessSolidIcon,\n} from \"@salt-ds/icons\";\n\nexport interface SwitchProps\n  extends Omit<\n    ComponentPropsWithoutRef<\"label\">,\n    \"children\" | \"onFocus\" | \"onBlur\" | \"onChange\"\n  > {\n  /**\n   * If `true`, the checkbox will be checked.\n   */\n  checked?: boolean;\n  /**\n   * Whether the checkbox component is checked by default\n   * This will be disregarded if checked is already set.\n   */\n  defaultChecked?: boolean;\n  /**\n   * If `true`, the checkbox will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Properties applied to the input element.\n   */\n  inputProps?: Partial<ComponentPropsWithoutRef<\"input\">>;\n  /**\n   * The label to be shown next to the checkbox.\n   */\n  label?: ReactNode;\n  /**\n   * The name applied to the input.\n   */\n  name?: string;\n  /**\n   * Callback when checkbox loses focus.\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checked state is changed.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checkbox gains focus.\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * The value of the checkbox.\n   */\n  value?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSwitch\");\n\nfunction CheckedIcon(props: IconProps) {\n  const density = useDensity();\n  return density === \"high\" ? (\n    <SuccessSmallSolidIcon {...props} />\n  ) : (\n    <SuccessSolidIcon {...props} />\n  );\n}\n\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(function Switch(\n  props,\n  ref\n) {\n  const {\n    checked: checkedProp,\n    className,\n    defaultChecked,\n    disabled: disabledProp,\n    inputProps = {},\n    label,\n    name,\n    onBlur,\n    onChange,\n    onFocus,\n    value,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-switch\",\n    css: switchCss,\n    window: targetWindow,\n  });\n\n  const {\n    \"aria-describedby\": inputDescribedBy,\n    \"aria-labelledby\": inputLabelledBy,\n    className: inputClassName,\n    onChange: inputOnChange,\n    ...restInputProps\n  } = inputProps;\n\n  const [checked, setChecked] = useControlled({\n    controlled: checkedProp,\n    default: Boolean(defaultChecked),\n    name: \"Switch\",\n    state: \"checked\",\n  });\n\n  const { a11yProps: formFieldA11yProps, disabled: formFieldDisabled } =\n    useFormFieldProps();\n\n  const disabled = formFieldDisabled || disabledProp;\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    // Workaround for https://github.com/facebook/react/issues/9023\n    if (event.nativeEvent.defaultPrevented) {\n      return;\n    }\n\n    const value = event.target.checked;\n    setChecked(value);\n    onChange?.(event);\n    inputOnChange?.(event);\n  };\n\n  return (\n    <label\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"checked\")]: checked,\n        },\n        className\n      )}\n      ref={ref}\n      {...rest}\n    >\n      <input\n        aria-describedby={clsx(\n          formFieldA11yProps?.[\"aria-describedby\"],\n          inputDescribedBy\n        )}\n        aria-labelledby={clsx(\n          formFieldA11yProps?.[\"aria-labelledby\"],\n          inputLabelledBy\n        )}\n        name={name}\n        value={value}\n        checked={checked}\n        className={clsx(withBaseName(\"input\"), inputClassName)}\n        defaultChecked={defaultChecked}\n        disabled={disabled}\n        onBlur={onBlur}\n        onChange={handleChange}\n        onFocus={onFocus}\n        type=\"checkbox\"\n        {...restInputProps}\n      />\n      <span className={withBaseName(\"track\")}>\n        <span className={withBaseName(\"thumb\")}>\n          {checked && (\n            <CheckedIcon aria-hidden className={withBaseName(\"icon\")} />\n          )}\n        </span>\n      </span>\n      <span className={withBaseName(\"label\")}>{label}</span>\n    </label>\n  );\n});\n"],"names":["Switch","switchCss","value"],"mappings":"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"}
+{"version":3,"file":"Switch.js","sources":["../src/switch/Switch.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  ComponentPropsWithoutRef,\n  FocusEventHandler,\n  forwardRef,\n  ReactNode,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { useDensity } from \"../salt-provider\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport switchCss from \"./Switch.css\";\nimport {\n  IconProps,\n  SuccessSmallSolidIcon,\n  SuccessSolidIcon,\n} from \"@salt-ds/icons\";\n\nexport interface SwitchProps\n  extends Omit<\n    ComponentPropsWithoutRef<\"label\">,\n    \"children\" | \"onFocus\" | \"onBlur\" | \"onChange\"\n  > {\n  /**\n   * If `true`, the checkbox will be checked.\n   */\n  checked?: boolean;\n  /**\n   * Whether the checkbox component is checked by default\n   * This will be disregarded if checked is already set.\n   */\n  defaultChecked?: boolean;\n  /**\n   * If `true`, the checkbox will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Properties applied to the input element.\n   */\n  inputProps?: Partial<ComponentPropsWithoutRef<\"input\">>;\n  /**\n   * The label to be shown next to the checkbox.\n   */\n  label?: ReactNode;\n  /**\n   * The name applied to the input.\n   */\n  name?: string;\n  /**\n   * Callback when checkbox loses focus.\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checked state is changed.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checkbox gains focus.\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * The value of the checkbox.\n   */\n  value?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSwitch\");\n\nfunction CheckedIcon(props: IconProps) {\n  const density = useDensity();\n  return density === \"high\" ? (\n    <SuccessSmallSolidIcon {...props} />\n  ) : (\n    <SuccessSolidIcon {...props} />\n  );\n}\n\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(function Switch(\n  props,\n  ref\n) {\n  const {\n    checked: checkedProp,\n    className,\n    defaultChecked,\n    disabled: disabledProp,\n    inputProps = {},\n    label,\n    name,\n    onBlur,\n    onChange,\n    onFocus,\n    value,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-switch\",\n    css: switchCss,\n    window: targetWindow,\n  });\n\n  const {\n    \"aria-describedby\": inputDescribedBy,\n    \"aria-labelledby\": inputLabelledBy,\n    className: inputClassName,\n    onChange: inputOnChange,\n    ...restInputProps\n  } = inputProps;\n\n  const [checked, setChecked] = useControlled({\n    controlled: checkedProp,\n    default: Boolean(defaultChecked),\n    name: \"Switch\",\n    state: \"checked\",\n  });\n\n  const { a11yProps: formFieldA11yProps, disabled: formFieldDisabled } =\n    useFormFieldProps();\n\n  const disabled = formFieldDisabled || disabledProp;\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    // Workaround for https://github.com/facebook/react/issues/9023\n    if (event.nativeEvent.defaultPrevented) {\n      return;\n    }\n\n    const value = event.target.checked;\n    setChecked(value);\n    onChange?.(event);\n    inputOnChange?.(event);\n  };\n\n  return (\n    <label\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"checked\")]: checked,\n        },\n        className\n      )}\n      ref={ref}\n      {...rest}\n    >\n      <input\n        aria-describedby={clsx(\n          formFieldA11yProps?.[\"aria-describedby\"],\n          inputDescribedBy\n        )}\n        aria-labelledby={clsx(\n          formFieldA11yProps?.[\"aria-labelledby\"],\n          inputLabelledBy\n        )}\n        name={name}\n        value={value}\n        checked={checked}\n        className={clsx(withBaseName(\"input\"), inputClassName)}\n        defaultChecked={defaultChecked}\n        disabled={disabled}\n        onBlur={onBlur}\n        onChange={handleChange}\n        onFocus={onFocus}\n        type=\"checkbox\"\n        role=\"switch\"\n        {...restInputProps}\n      />\n      <span className={withBaseName(\"track\")}>\n        <span className={withBaseName(\"thumb\")}>\n          {checked && (\n            <CheckedIcon aria-hidden className={withBaseName(\"icon\")} />\n          )}\n        </span>\n      </span>\n      <span className={withBaseName(\"label\")}>{label}</span>\n    </label>\n  );\n});\n"],"names":["Switch","switchCss","value"],"mappings":"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"}

package/dist-es/text/Text.js

@@ -20,7 +20,6 @@ import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import '../card/InteractableCard.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
@@ -54,6 +53,9 @@ import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -73,6 +75,7 @@ import '../progress/LinearProgress/LinearProgress.js';
 import '../radio-button/RadioButton.js';
 import '../radio-button/RadioButtonGroup.js';
 import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
 import '../spinner/Spinner.js';
 import '../stack-layout/StackLayout.js';
 import '../status-adornment/StatusAdornment.js';

package/dist-es/text/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, ReactElement } from \"react\";\n\nimport textCss from \"./Text.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n  T,\n  {\n    /**\n     * Applies disabled styling when true\n     */\n    disabled?: boolean;\n    /**\n     * Apply text truncation by mentioning number of rows to be displayed\n     */\n    maxRows?: number;\n    /**\n     * Match styling to another text component's style\n     */\n    styleAs?:\n      | \"h1\"\n      | \"h2\"\n      | \"h3\"\n      | \"h4\"\n      | \"label\"\n      | \"display1\"\n      | \"display2\"\n      | \"display3\"\n      | \"notation\"\n      | \"action\"\n      | \"code\";\n    /**\n     * Change text color palette\n     */\n    variant?: \"primary\" | \"secondary\";\n  }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n  props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    {\n      as,\n      children,\n      className,\n      disabled = false,\n      maxRows,\n      style,\n      styleAs,\n      variant = \"primary\",\n      ...restProps\n    }: TextProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-text\",\n      css: textCss,\n      window: targetWindow,\n    });\n\n    const Component = as || \"div\";\n\n    const textStyles = { \"--text-max-rows\": maxRows, ...style };\n\n    return (\n      <Component\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"lineClamp\")]: maxRows,\n            [withBaseName(styleAs || \"\")]: styleAs,\n            [withBaseName(variant)]: variant,\n          },\n          className\n        )}\n        {...restProps}\n        ref={ref}\n        style={textStyles}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["textCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA,CAAA;AAErC,MAAM,IAAsB,GAAA,UAAA;AAAA,EACjC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAU,GAAA,SAAA;AAAA,IACP,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,WAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AAExB,IAAA,MAAM,UAAa,GAAA,EAAE,iBAAmB,EAAA,OAAA,EAAS,GAAG,KAAM,EAAA,CAAA;AAE1D,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,OAAA;AAAA,UAC7B,CAAC,YAAA,CAAa,OAAW,IAAA,EAAE,CAAI,GAAA,OAAA;AAAA,UAC/B,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,OAAA;AAAA,SAC3B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,KAAO,EAAA,UAAA;AAAA,MAEN,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, ReactElement } from \"react\";\n\nimport textCss from \"./Text.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n  T,\n  {\n    /**\n     * Applies disabled styling when true\n     */\n    disabled?: boolean;\n    /**\n     * Apply text truncation by mentioning number of rows to be displayed\n     */\n    maxRows?: number;\n    /**\n     * Match styling to another text component's style\n     */\n    styleAs?:\n      | \"h1\"\n      | \"h2\"\n      | \"h3\"\n      | \"h4\"\n      | \"label\"\n      | \"display1\"\n      | \"display2\"\n      | \"display3\"\n      | \"notation\"\n      | \"action\"\n      | \"code\";\n    /**\n     * Change text color palette\n     */\n    variant?: \"primary\" | \"secondary\";\n  }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n  props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    {\n      as,\n      children,\n      className,\n      disabled = false,\n      maxRows,\n      style,\n      styleAs,\n      variant = \"primary\",\n      ...restProps\n    }: TextProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-text\",\n      css: textCss,\n      window: targetWindow,\n    });\n\n    const Component = as || \"div\";\n\n    const textStyles = { \"--text-max-rows\": maxRows, ...style };\n\n    return (\n      <Component\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"lineClamp\")]: maxRows,\n            [withBaseName(styleAs || \"\")]: styleAs,\n            [withBaseName(variant)]: variant,\n          },\n          className\n        )}\n        {...restProps}\n        ref={ref}\n        style={textStyles}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["textCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA,CAAA;AAErC,MAAM,IAAsB,GAAA,UAAA;AAAA,EACjC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAU,GAAA,SAAA;AAAA,IACP,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,WAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AAExB,IAAA,MAAM,UAAa,GAAA,EAAE,iBAAmB,EAAA,OAAA,EAAS,GAAG,KAAM,EAAA,CAAA;AAE1D,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,OAAA;AAAA,UAC7B,CAAC,YAAA,CAAa,OAAW,IAAA,EAAE,CAAI,GAAA,OAAA;AAAA,UAC/B,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,OAAA;AAAA,SAC3B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,KAAO,EAAA,UAAA;AAAA,MAEN,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/toast/Toast.js

@@ -23,7 +23,6 @@ import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import '../card/InteractableCard.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
 import '@salt-ds/icons';
@@ -55,6 +54,9 @@ import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -74,6 +76,7 @@ import '../progress/LinearProgress/LinearProgress.js';
 import '../radio-button/RadioButton.js';
 import '../radio-button/RadioButtonGroup.js';
 import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
 import '../spinner/Spinner.js';
 import '../stack-layout/StackLayout.js';
 import '../status-adornment/StatusAdornment.js';

package/dist-es/toast/Toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.js","sources":["../src/toast/Toast.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastCss from \"./Toast.css\";\n\nconst withBaseName = makePrefixer(\"saltToast\");\n\nexport interface ToastProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   *  A string to determine the current state of the Toast.\n   */\n  status?: ValidationStatus;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(function Toast(\n  props,\n  ref\n) {\n  const { children, className, status = \"info\", ...rest } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-toast\",\n    css: toastCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(withBaseName(), withBaseName(status), className)}\n      role=\"alert\"\n      {...rest}\n      ref={ref}\n    >\n      <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n      {children}\n    </div>\n  );\n});\n"],"names":["Toast","toastCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA,CAAA;AAStC,MAAM,KAAQ,GAAA,UAAA,CAAuC,SAASA,MAAAA,CACnE,OACA,GACA,EAAA;AACA,EAAA,MAAM,EAAE,QAAU,EAAA,SAAA,EAAW,MAAS,GAAA,MAAA,EAAA,GAAW,MAAS,GAAA,KAAA,CAAA;AAC1D,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,IAC/D,IAAK,EAAA,OAAA;AAAA,IACJ,GAAG,IAAA;AAAA,IACJ,GAAA;AAAA,IAEA,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,eAAA,EAAA;AAAA,QAAgB,MAAA;AAAA,QAAgB,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MACjE,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Toast.js","sources":["../src/toast/Toast.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastCss from \"./Toast.css\";\n\nconst withBaseName = makePrefixer(\"saltToast\");\n\nexport interface ToastProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   *  A string to determine the current state of the Toast.\n   */\n  status?: ValidationStatus;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(function Toast(\n  props,\n  ref\n) {\n  const { children, className, status = \"info\", ...rest } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-toast\",\n    css: toastCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(withBaseName(), withBaseName(status), className)}\n      role=\"alert\"\n      {...rest}\n      ref={ref}\n    >\n      <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n      {children}\n    </div>\n  );\n});\n"],"names":["Toast","toastCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA,CAAA;AAStC,MAAM,KAAQ,GAAA,UAAA,CAAuC,SAASA,MAAAA,CACnE,OACA,GACA,EAAA;AACA,EAAA,MAAM,EAAE,QAAU,EAAA,SAAA,EAAW,MAAS,GAAA,MAAA,EAAA,GAAW,MAAS,GAAA,KAAA,CAAA;AAC1D,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,IAC/D,IAAK,EAAA,OAAA;AAAA,IACJ,GAAG,IAAA;AAAA,IACJ,GAAA;AAAA,IAEA,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,eAAA,EAAA;AAAA,QAAgB,MAAA;AAAA,QAAgB,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MACjE,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/toast/ToastContent.js

@@ -22,7 +22,6 @@ import '../border-item/BorderItem.js';
 import '../border-layout/BorderLayout.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import '../card/InteractableCard.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
 import '@salt-ds/icons';
@@ -55,6 +54,9 @@ import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
 import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-control/ListControlContext.js';
@@ -74,6 +76,7 @@ import '../progress/LinearProgress/LinearProgress.js';
 import '../radio-button/RadioButton.js';
 import '../radio-button/RadioButtonGroup.js';
 import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
 import '../spinner/Spinner.js';
 import '../stack-layout/StackLayout.js';
 import '../status-adornment/StatusAdornment.js';