@salt-ds/core 1.21.0 → 1.23.0

package/dist-cjs/interactable-card/InteractableCardGroup.js

@@ -0,0 +1,228 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var clsx = require('clsx');
+var window = require('@salt-ds/window');
+var styles = require('@salt-ds/styles');
+var makePrefixer = require('../utils/makePrefixer.js');
+var useControlled = require('../utils/useControlled.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+var useForkRef = require('../utils/useForkRef.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+require('../accordion/AccordionGroup.js');
+require('../accordion/AccordionPanel.js');
+require('../accordion/Accordion.js');
+require('../accordion/AccordionHeader.js');
+require('../aria-announcer/AriaAnnouncerContext.js');
+require('../avatar/Avatar.js');
+require('../badge/Badge.js');
+require('../banner/Banner.js');
+require('../banner/BannerActions.js');
+require('../banner/BannerContent.js');
+require('../border-item/BorderItem.js');
+require('../border-layout/BorderLayout.js');
+require('../button/Button.js');
+require('../card/Card.js');
+require('../checkbox/Checkbox.js');
+require('../checkbox/CheckboxGroup.js');
+require('@salt-ds/icons');
+require('../combo-box/ComboBox.js');
+require('../dialog/Dialog.js');
+require('../dialog/DialogHeader.js');
+require('../dialog/DialogActions.js');
+require('../dialog/DialogContent.js');
+require('../dialog/DialogContext.js');
+require('../dialog/DialogCloseButton.js');
+require('../drawer/Drawer.js');
+require('../drawer/DrawerCloseButton.js');
+require('../dropdown/Dropdown.js');
+require('../file-drop-zone/FileDropZone.js');
+require('../file-drop-zone/FileDropZoneIcon.js');
+require('../file-drop-zone/FileDropZoneTrigger.js');
+require('../flex-item/FlexItem.js');
+require('../flex-layout/FlexLayout.js');
+require('../flow-layout/FlowLayout.js');
+require('../form-field/FormField.js');
+require('../status-indicator/StatusIndicator.js');
+require('../text/Text.js');
+require('../text/Code.js');
+require('../text/Display.js');
+require('../text/Headings.js');
+require('../text/Label.js');
+require('../text/TextAction.js');
+require('../text/TextNotation.js');
+require('../form-field-context/FormFieldContext.js');
+require('../grid-item/GridItem.js');
+require('../grid-layout/GridLayout.js');
+require('../input/Input.js');
+require('./InteractableCard.js');
+var InteractableCardGroupContext = require('./InteractableCardGroupContext.js');
+require('../link/Link.js');
+require('../link-card/LinkCard.js');
+require('../list-control/ListControlContext.js');
+require('../multiline-input/MultilineInput.js');
+require('../navigation-item/NavigationItem.js');
+require('../option/Option.js');
+require('../option/OptionGroup.js');
+require('../pagination/Pagination.js');
+require('../pagination/Paginator.js');
+require('../pagination/CompactInput.js');
+require('../pagination/CompactPaginator.js');
+require('../pagination/GoToInput.js');
+require('../panel/Panel.js');
+require('../pill/Pill.js');
+require('../progress/CircularProgress/CircularProgress.js');
+require('../progress/LinearProgress/LinearProgress.js');
+require('../radio-button/RadioButton.js');
+require('../radio-button/RadioButtonGroup.js');
+require('../scrim/Scrim.js');
+require('../segmented-button-group/SegmentedButtonGroup.js');
+require('../spinner/Spinner.js');
+require('../stack-layout/StackLayout.js');
+require('../status-adornment/StatusAdornment.js');
+require('../toast/Toast.js');
+require('../toast/ToastContent.js');
+require('../split-layout/SplitLayout.js');
+require('../switch/Switch.js');
+require('../toggle-button/ToggleButton.js');
+require('../toggle-button-group/ToggleButtonGroup.js');
+require('../toggle-button-group/ToggleButtonGroupContext.js');
+require('../tooltip/Tooltip.js');
+require('@floating-ui/react');
+var InteractableCardGroup$1 = require('./InteractableCardGroup.css.js');
+
+const withBaseName = makePrefixer.makePrefixer("saltInteractableCardGroup");
+const InteractableCardGroup = React.forwardRef(function InteractableCardGroup2(props, ref) {
+  const {
+    children,
+    className,
+    value: valueProp,
+    defaultValue,
+    disabled,
+    onChange,
+    onKeyDown,
+    multiSelect,
+    ...rest
+  } = props;
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "salt-interactable-card-group",
+    css: InteractableCardGroup$1,
+    window: targetWindow
+  });
+  const groupRef = React.useRef(null);
+  const handleRef = useForkRef.useForkRef(ref, groupRef);
+  const [value, setValue] = useControlled.useControlled({
+    default: defaultValue,
+    controlled: valueProp,
+    name: "InteractableCardGroup",
+    state: "value"
+  });
+  const [elements, setElements] = React.useState([]);
+  React.useEffect(() => {
+    var _a, _b;
+    const childElements = Array.from(
+      (_b = (_a = groupRef.current) == null ? void 0 : _a.querySelectorAll(
+        ".saltInteractableCard:not([disabled])"
+      )) != null ? _b : []
+    );
+    setElements(childElements);
+  }, [children]);
+  const select = React.useCallback(
+    (event, newValue) => {
+      if (multiSelect) {
+        const currentValues = Array.isArray(value) ? value : [];
+        const isSelected2 = currentValues.includes(newValue);
+        const nextValues = isSelected2 ? currentValues.filter((val) => val !== newValue) : [...currentValues, newValue];
+        setValue(nextValues);
+        onChange == null ? void 0 : onChange(event, nextValues);
+      } else {
+        setValue(newValue);
+        if (value !== newValue) {
+          onChange == null ? void 0 : onChange(event, newValue);
+        }
+      }
+    },
+    [onChange, value, setValue, multiSelect]
+  );
+  const isSelected = React.useCallback(
+    (cardValue) => multiSelect ? Array.isArray(value) && value.includes(cardValue) : cardValue !== void 0 && value === cardValue,
+    [value, multiSelect]
+  );
+  const isFirstChild = React.useCallback(
+    (cardValue) => {
+      return elements.findIndex(
+        (element) => element.getAttribute("data-value") === cardValue
+      ) === 0;
+    },
+    [elements]
+  );
+  const contextValue = React.useMemo(
+    () => ({
+      select,
+      isSelected,
+      isFirstChild,
+      disabled,
+      multiSelect,
+      value
+    }),
+    [select, isSelected, disabled, multiSelect, isFirstChild, value]
+  );
+  const handleKeyDown = (event) => {
+    var _a, _b;
+    const currentIndex = elements.findIndex(
+      (element) => element === document.activeElement
+    );
+    const nextIndex = (currentIndex + 1) % elements.length;
+    const prevIndex = (currentIndex - 1 + elements.length) % elements.length;
+    if (event.key == " ") {
+      event.preventDefault();
+      select(
+        event,
+        elements[currentIndex].getAttribute(
+          "data-value"
+        )
+      );
+    }
+    if (!multiSelect) {
+      switch (event.key) {
+        case "ArrowDown":
+        case "ArrowRight":
+          const nextValue = elements[nextIndex].getAttribute(
+            "data-value"
+          );
+          select(event, nextValue);
+          (_a = elements[nextIndex]) == null ? void 0 : _a.focus();
+          break;
+        case "ArrowUp":
+        case "ArrowLeft":
+          const prevValue = elements[prevIndex].getAttribute(
+            "data-value"
+          );
+          select(event, prevValue);
+          (_b = elements[prevIndex]) == null ? void 0 : _b.focus();
+          break;
+      }
+    }
+    onKeyDown == null ? void 0 : onKeyDown(event);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(InteractableCardGroupContext.InteractableCardGroupContext.Provider, {
+    value: contextValue,
+    children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+      className: clsx.clsx(withBaseName(), className),
+      role: multiSelect ? "group" : "radiogroup",
+      onKeyDown: handleKeyDown,
+      ref: handleRef,
+      ...rest,
+      children
+    })
+  });
+});
+
+exports.InteractableCardGroup = InteractableCardGroup;
+//# sourceMappingURL=InteractableCardGroup.js.map

package/dist-cjs/interactable-card/InteractableCardGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InteractableCardGroup.js","sources":["../src/interactable-card/InteractableCardGroup.tsx"],"sourcesContent":["import {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  KeyboardEvent,\n  SyntheticEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\nimport {\n  InteractableCardGroupContext,\n  InteractableCardValue,\n} from \"./InteractableCardGroupContext\";\nimport interactableCardGroupCss from \"./InteractableCardGroup.css\";\n\nexport interface InteractableCardGroupProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n  /**\n   * The default value. Use when the component is not controlled. Should be an array when `multiSelect` is true.\n   */\n  defaultValue?: InteractableCardValue;\n  /**\n   * If `true`, the Interactable Card Group will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The value. Use when the component is controlled. Should be an array when `multiSelect` is true.\n   */\n  value?: InteractableCardValue;\n  /**\n   * If `true` the Interactable Card Group will allow multiple selection functionality, with keyboard interactions matching those of a checkbox.\n   * By default the group allows mutually exclusive selection with keyboard interactions matching radio buttons.\n   */\n  multiSelect?: boolean;\n  /**\n   * Callback fired when the selection changes.\n   * @param event\n   */\n  onChange?: (\n    event: SyntheticEvent<HTMLDivElement>,\n    value: InteractableCardValue\n  ) => void;\n}\n\nconst withBaseName = makePrefixer(\"saltInteractableCardGroup\");\n\nexport const InteractableCardGroup = forwardRef<\n  HTMLDivElement,\n  InteractableCardGroupProps\n>(function InteractableCardGroup(props, ref) {\n  const {\n    children,\n    className,\n    value: valueProp,\n    defaultValue,\n    disabled,\n    onChange,\n    onKeyDown,\n    multiSelect,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-interactable-card-group\",\n    css: interactableCardGroupCss,\n    window: targetWindow,\n  });\n\n  const groupRef = useRef<HTMLDivElement>(null);\n  const handleRef = useForkRef(ref, groupRef);\n\n  const [value, setValue] = useControlled({\n    default: defaultValue,\n    controlled: valueProp,\n    name: \"InteractableCardGroup\",\n    state: \"value\",\n  });\n\n  const [elements, setElements] = useState<HTMLElement[]>([]);\n\n  useEffect(() => {\n    const childElements: HTMLElement[] = Array.from(\n      groupRef.current?.querySelectorAll(\n        \".saltInteractableCard:not([disabled])\"\n      ) ?? []\n    );\n    setElements(childElements);\n  }, [children]);\n\n  const select = useCallback(\n    (\n      event: SyntheticEvent<HTMLDivElement>,\n      newValue: InteractableCardValue\n    ) => {\n      if (multiSelect) {\n        const currentValues = Array.isArray(value) ? value : [];\n        const isSelected = currentValues.includes(newValue);\n\n        const nextValues = isSelected\n          ? currentValues.filter((val) => val !== newValue)\n          : [...currentValues, newValue];\n        setValue(nextValues);\n        onChange?.(event, nextValues);\n      } else {\n        setValue(newValue);\n        if (value !== newValue) {\n          onChange?.(event, newValue);\n        }\n      }\n    },\n    [onChange, value, setValue, multiSelect]\n  );\n\n  const isSelected = useCallback(\n    (cardValue: InteractableCardValue) =>\n      multiSelect\n        ? Array.isArray(value) && value.includes(cardValue)\n        : cardValue !== undefined && value === cardValue,\n    [value, multiSelect]\n  );\n\n  const isFirstChild = useCallback(\n    (cardValue: InteractableCardValue) => {\n      return (\n        elements.findIndex(\n          (element) => element.getAttribute(\"data-value\") === cardValue\n        ) === 0\n      );\n    },\n    [elements]\n  );\n\n  const contextValue = useMemo(\n    () => ({\n      select,\n      isSelected,\n      isFirstChild,\n      disabled,\n      multiSelect,\n      value,\n    }),\n    [select, isSelected, disabled, multiSelect, isFirstChild, value]\n  );\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    const currentIndex = elements.findIndex(\n      (element) => element === document.activeElement\n    );\n    const nextIndex = (currentIndex + 1) % elements.length;\n    const prevIndex = (currentIndex - 1 + elements.length) % elements.length;\n\n    if (event.key == \" \") {\n      event.preventDefault();\n      select(\n        event,\n        elements[currentIndex].getAttribute(\n          \"data-value\"\n        ) as InteractableCardValue\n      );\n    }\n\n    if (!multiSelect) {\n      switch (event.key) {\n        case \"ArrowDown\":\n        case \"ArrowRight\":\n          const nextValue = elements[nextIndex].getAttribute(\n            \"data-value\"\n          ) as InteractableCardValue;\n          select(event, nextValue);\n          elements[nextIndex]?.focus();\n          break;\n        case \"ArrowUp\":\n        case \"ArrowLeft\":\n          const prevValue = elements[prevIndex].getAttribute(\n            \"data-value\"\n          ) as InteractableCardValue;\n          select(event, prevValue);\n          elements[prevIndex]?.focus();\n          break;\n      }\n    }\n    onKeyDown?.(event);\n  };\n\n  return (\n    <InteractableCardGroupContext.Provider value={contextValue}>\n      <div\n        className={clsx(withBaseName(), className)}\n        role={multiSelect ? \"group\" : \"radiogroup\"}\n        onKeyDown={handleKeyDown}\n        ref={handleRef}\n        {...rest}\n      >\n        {children}\n      </div>\n    </InteractableCardGroupContext.Provider>\n  );\n});\n"],"names":["makePrefixer","forwardRef","InteractableCardGroup","useWindow","useComponentCssInjection","interactableCardGroupCss","useRef","useForkRef","useControlled","useState","useEffect","useCallback","isSelected","useMemo","jsx","InteractableCardGroupContext","clsx"],"mappings":"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"}

package/dist-cjs/interactable-card/InteractableCardGroupContext.js

@@ -0,0 +1,103 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var createContext = require('../utils/createContext.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+require('clsx');
+require('../accordion/AccordionGroup.js');
+require('../accordion/AccordionPanel.js');
+require('../accordion/Accordion.js');
+require('../accordion/AccordionHeader.js');
+require('../aria-announcer/AriaAnnouncerContext.js');
+require('react/jsx-runtime');
+require('../avatar/Avatar.js');
+require('../badge/Badge.js');
+require('../banner/Banner.js');
+require('../banner/BannerActions.js');
+require('../banner/BannerContent.js');
+require('../border-item/BorderItem.js');
+require('../border-layout/BorderLayout.js');
+require('../button/Button.js');
+require('../card/Card.js');
+require('../checkbox/Checkbox.js');
+require('../checkbox/CheckboxGroup.js');
+require('@salt-ds/styles');
+require('@salt-ds/window');
+require('@salt-ds/icons');
+require('../combo-box/ComboBox.js');
+require('../dialog/Dialog.js');
+require('../dialog/DialogHeader.js');
+require('../dialog/DialogActions.js');
+require('../dialog/DialogContent.js');
+require('../dialog/DialogContext.js');
+require('../dialog/DialogCloseButton.js');
+require('../drawer/Drawer.js');
+require('../drawer/DrawerCloseButton.js');
+require('../dropdown/Dropdown.js');
+require('../file-drop-zone/FileDropZone.js');
+require('../file-drop-zone/FileDropZoneIcon.js');
+require('../file-drop-zone/FileDropZoneTrigger.js');
+require('../flex-item/FlexItem.js');
+require('../flex-layout/FlexLayout.js');
+require('../flow-layout/FlowLayout.js');
+require('../form-field/FormField.js');
+require('../status-indicator/StatusIndicator.js');
+require('../text/Text.js');
+require('../text/Code.js');
+require('../text/Display.js');
+require('../text/Headings.js');
+require('../text/Label.js');
+require('../text/TextAction.js');
+require('../text/TextNotation.js');
+require('../form-field-context/FormFieldContext.js');
+require('../grid-item/GridItem.js');
+require('../grid-layout/GridLayout.js');
+require('../input/Input.js');
+require('./InteractableCard.js');
+require('./InteractableCardGroup.js');
+require('../link/Link.js');
+require('../link-card/LinkCard.js');
+require('../list-control/ListControlContext.js');
+require('../multiline-input/MultilineInput.js');
+require('../navigation-item/NavigationItem.js');
+require('../option/Option.js');
+require('../option/OptionGroup.js');
+require('../pagination/Pagination.js');
+require('../pagination/Paginator.js');
+require('../pagination/CompactInput.js');
+require('../pagination/CompactPaginator.js');
+require('../pagination/GoToInput.js');
+require('../panel/Panel.js');
+require('../pill/Pill.js');
+require('../progress/CircularProgress/CircularProgress.js');
+require('../progress/LinearProgress/LinearProgress.js');
+require('../radio-button/RadioButton.js');
+require('../radio-button/RadioButtonGroup.js');
+require('../scrim/Scrim.js');
+require('../segmented-button-group/SegmentedButtonGroup.js');
+require('../spinner/Spinner.js');
+require('../stack-layout/StackLayout.js');
+require('../status-adornment/StatusAdornment.js');
+require('../toast/Toast.js');
+require('../toast/ToastContent.js');
+require('../split-layout/SplitLayout.js');
+require('../switch/Switch.js');
+require('../toggle-button/ToggleButton.js');
+require('../toggle-button-group/ToggleButtonGroup.js');
+require('../toggle-button-group/ToggleButtonGroupContext.js');
+require('../tooltip/Tooltip.js');
+require('@floating-ui/react');
+
+const InteractableCardGroupContext = createContext.createContext("InteractableCardGroupContext", void 0);
+function useInteractableCardGroup() {
+  return React.useContext(InteractableCardGroupContext);
+}
+
+exports.InteractableCardGroupContext = InteractableCardGroupContext;
+exports.useInteractableCardGroup = useInteractableCardGroup;
+//# sourceMappingURL=InteractableCardGroupContext.js.map

package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InteractableCardGroupContext.js","sources":["../src/interactable-card/InteractableCardGroupContext.tsx"],"sourcesContent":["import { SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport type InteractableCardValue = string | readonly string[] | undefined;\n\nexport interface InteractableCardGroupContextValue {\n  disabled?: boolean;\n  select: (\n    event: SyntheticEvent<HTMLDivElement>,\n    value: InteractableCardValue\n  ) => void;\n  isSelected: (id: InteractableCardValue) => boolean;\n  isFirstChild: (value: InteractableCardValue) => boolean;\n  multiSelect?: boolean;\n  value: InteractableCardValue;\n}\n\nexport const InteractableCardGroupContext = createContext<\n  InteractableCardGroupContextValue | undefined\n>(\"InteractableCardGroupContext\", undefined);\n\nexport function useInteractableCardGroup() {\n  return useContext(InteractableCardGroupContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBa,MAAA,4BAAA,GAA+BA,2BAE1C,CAAA,8BAAA,EAAgC,KAAS,CAAA,EAAA;AAEpC,SAAS,wBAA2B,GAAA;AACzC,EAAA,OAAOC,iBAAW,4BAA4B,CAAA,CAAA;AAChD;;;;;"}

package/dist-cjs/{card → interactable-card}/useInteractableCard.js

@@ -14,9 +14,10 @@ const useInteractableCard = ({
   const [keyIsDown, setkeyIsDown] = React.useState("");
   const [active, setActive] = React.useState(false);
   const enter = "Enter";
+  const space = " ";
   React.useEffect(() => {
     const t = setTimeout(() => {
-      if (keyIsDown !== enter) {
+      if (keyIsDown !== enter && keyIsDown !== space) {
         setActive(false);
       }
     }, 0);
@@ -38,9 +39,11 @@ const useInteractableCard = ({
     onBlur == null ? void 0 : onBlur(event);
   };
   const handleKeyDown = (event) => {
-    if (event.key === enter) {
+    if (event.key === enter || event.key === space) {
       setkeyIsDown(event.key);
+      event.preventDefault();
       setActive(true);
+      onClick == null ? void 0 : onClick(event);
     }
     onKeyDown == null ? void 0 : onKeyDown(event);
   };

package/dist-cjs/interactable-card/useInteractableCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInteractableCard.js","sources":["../src/interactable-card/useInteractableCard.ts"],"sourcesContent":["import {\n  FocusEvent,\n  KeyboardEvent,\n  MouseEvent,\n  useEffect,\n  useState,\n} from \"react\";\n\nexport interface CardHookProps<T extends Element> {\n  disabled?: boolean;\n  onKeyUp?: (event: KeyboardEvent<T>) => void;\n  onKeyDown?: (event: KeyboardEvent<T>) => void;\n  onClick?: (event: MouseEvent<T>) => void;\n  onBlur?: (event: FocusEvent<T>) => void;\n}\n\nexport interface CardHookResult<T extends Element> {\n  active: boolean;\n  cardProps: {\n    \"aria-disabled\"?: boolean;\n    disabled?: boolean;\n    tabIndex: number;\n    onBlur: (event: FocusEvent<T>) => void;\n    onClick?: (event: MouseEvent<T>) => void;\n    onKeyDown: (event: KeyboardEvent<T>) => void;\n    onKeyUp: (event: KeyboardEvent<T>) => void;\n  };\n}\n\nexport const useInteractableCard = <T extends Element>({\n  disabled,\n  onKeyUp,\n  onKeyDown,\n  onClick,\n  onBlur,\n}: CardHookProps<T>): CardHookResult<T> => {\n  const [keyIsDown, setkeyIsDown] = useState(\"\");\n  const [active, setActive] = useState(false);\n\n  const enter = \"Enter\";\n  const space = \" \";\n\n  useEffect(() => {\n    const t = setTimeout(() => {\n      // This key state check is to stop continual visual state change when using Enter Key, which the browser treats as both key and click events on a Button-like component\n      // This key state check also fixes Firefox Button where Space key is pressed but button fails to be in active state\n      if (keyIsDown !== enter && keyIsDown !== space) {\n        setActive(false);\n      }\n    }, 0);\n\n    return () => {\n      clearTimeout(t);\n    };\n  }, [active, keyIsDown]);\n\n  const handleKeyUp = (event: KeyboardEvent<T>) => {\n    setkeyIsDown(\"\");\n    setActive(false);\n    onKeyUp?.(event);\n  };\n\n  const handleClick = (event: MouseEvent<T>) => {\n    setActive(true);\n    onClick?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<T>) => {\n    setActive(false);\n    onBlur?.(event);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<T>) => {\n    if (event.key === enter || event.key === space) {\n      setkeyIsDown(event.key);\n      event.preventDefault();\n      setActive(true);\n      onClick?.(event as unknown as MouseEvent<T>);\n    }\n    onKeyDown?.(event);\n  };\n\n  const cardProps = {\n    \"aria-disabled\": disabled ? true : undefined,\n    disabled: disabled,\n    tabIndex: disabled ? -1 : 0,\n    onBlur: handleBlur,\n    onClick: !disabled ? handleClick : undefined,\n    onKeyDown: handleKeyDown,\n    onKeyUp: handleKeyUp,\n  };\n\n  return {\n    active,\n    cardProps,\n  };\n};\n"],"names":["useState","useEffect"],"mappings":";;;;;;AA6BO,MAAM,sBAAsB,CAAoB;AAAA,EACrD,QAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AACF,CAA2C,KAAA;AACzC,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIA,eAAS,EAAE,CAAA,CAAA;AAC7C,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIA,eAAS,KAAK,CAAA,CAAA;AAE1C,EAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AACd,EAAA,MAAM,KAAQ,GAAA,GAAA,CAAA;AAEd,EAAAC,eAAA,CAAU,MAAM;AACd,IAAM,MAAA,CAAA,GAAI,WAAW,MAAM;AAGzB,MAAI,IAAA,SAAA,KAAc,KAAS,IAAA,SAAA,KAAc,KAAO,EAAA;AAC9C,QAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AAAA,OACjB;AAAA,OACC,CAAC,CAAA,CAAA;AAEJ,IAAA,OAAO,MAAM;AACX,MAAA,YAAA,CAAa,CAAC,CAAA,CAAA;AAAA,KAChB,CAAA;AAAA,GACC,EAAA,CAAC,MAAQ,EAAA,SAAS,CAAC,CAAA,CAAA;AAEtB,EAAM,MAAA,WAAA,GAAc,CAAC,KAA4B,KAAA;AAC/C,IAAA,YAAA,CAAa,EAAE,CAAA,CAAA;AACf,IAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AACf,IAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACZ,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAAyB,KAAA;AAC5C,IAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AACd,IAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACZ,CAAA;AAEA,EAAM,MAAA,UAAA,GAAa,CAAC,KAAyB,KAAA;AAC3C,IAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AACf,IAAS,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACX,CAAA;AAEA,EAAM,MAAA,aAAA,GAAgB,CAAC,KAA4B,KAAA;AACjD,IAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,KAAS,IAAA,KAAA,CAAM,QAAQ,KAAO,EAAA;AAC9C,MAAA,YAAA,CAAa,MAAM,GAAG,CAAA,CAAA;AACtB,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,MAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AACd,MAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AAAA,KACZ;AACA,IAAY,SAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACd,CAAA;AAEA,EAAA,MAAM,SAAY,GAAA;AAAA,IAChB,eAAA,EAAiB,WAAW,IAAO,GAAA,KAAA,CAAA;AAAA,IACnC,QAAA;AAAA,IACA,QAAA,EAAU,WAAW,CAAK,CAAA,GAAA,CAAA;AAAA,IAC1B,MAAQ,EAAA,UAAA;AAAA,IACR,OAAA,EAAS,CAAC,QAAA,GAAW,WAAc,GAAA,KAAA,CAAA;AAAA,IACnC,SAAW,EAAA,aAAA;AAAA,IACX,OAAS,EAAA,WAAA;AAAA,GACX,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,MAAA;AAAA,IACA,SAAA;AAAA,GACF,CAAA;AACF;;;;"}

package/dist-cjs/link/Link.js

@@ -25,23 +25,16 @@ require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
 require('../button/Button.js');
 require('../card/Card.js');
-require('../card/InteractableCard.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
 require('../combo-box/ComboBox.js');
 require('../dialog/Dialog.js');
-require('../status-indicator/StatusIndicator.js');
-var Text = require('../text/Text.js');
-require('../text/Display.js');
-require('../text/Headings.js');
-require('../text/Label.js');
-require('../text/TextNotation.js');
-require('../text/TextAction.js');
-require('../dialog/DialogContext.js');
+require('../dialog/DialogHeader.js');
 require('../dialog/DialogActions.js');
 require('../dialog/DialogContent.js');
+require('../dialog/DialogContext.js');
 require('../dialog/DialogCloseButton.js');
 require('../drawer/Drawer.js');
 require('../drawer/DrawerCloseButton.js');
@@ -53,10 +46,21 @@ require('../flex-item/FlexItem.js');
 require('../flex-layout/FlexLayout.js');
 require('../flow-layout/FlowLayout.js');
 require('../form-field/FormField.js');
+require('../status-indicator/StatusIndicator.js');
+var Text = require('../text/Text.js');
+require('../text/Code.js');
+require('../text/Display.js');
+require('../text/Headings.js');
+require('../text/Label.js');
+require('../text/TextAction.js');
+require('../text/TextNotation.js');
 require('../form-field-context/FormFieldContext.js');
 require('../grid-item/GridItem.js');
 require('../grid-layout/GridLayout.js');
 require('../input/Input.js');
+require('../interactable-card/InteractableCard.js');
+require('../interactable-card/InteractableCardGroup.js');
+require('../interactable-card/InteractableCardGroupContext.js');
 require('../link-card/LinkCard.js');
 require('../list-control/ListControlContext.js');
 require('../multiline-input/MultilineInput.js');
@@ -75,6 +79,7 @@ require('../progress/LinearProgress/LinearProgress.js');
 require('../radio-button/RadioButton.js');
 require('../radio-button/RadioButtonGroup.js');
 require('../scrim/Scrim.js');
+require('../segmented-button-group/SegmentedButtonGroup.js');
 require('../spinner/Spinner.js');
 require('../stack-layout/StackLayout.js');
 require('../status-adornment/StatusAdornment.js');

package/dist-cjs/link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sources":["../src/link/Link.tsx"],"sourcesContent":["import { ComponentType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { IconProps, TearOutIcon } from \"@salt-ds/icons\";\nimport { makePrefixer } from \"../utils\";\nimport { Text, TextProps } from \"../text\";\n\nimport linkCss from \"./Link.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltLink\");\n\n/**\n * Links are a fundamental navigation element. When clicked, they take the user to an entirely different page.\n *\n * @example\n * <LinkExample to=\"#link\">Action</LinkExample>\n */\nexport interface LinkProps extends Omit<TextProps<\"a\">, \"as\" | \"disabled\"> {\n  IconComponent?: ComponentType<IconProps> | null;\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  {\n    IconComponent = TearOutIcon,\n    href,\n    className,\n    children,\n    variant = \"primary\",\n    target = \"_self\",\n    ...rest\n  },\n  ref\n): ReactElement<LinkProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-link\",\n    css: linkCss,\n    window: targetWindow,\n  });\n\n  return (\n    <Text\n      as=\"a\"\n      className={clsx(withBaseName(), className)}\n      href={href}\n      ref={ref}\n      target={target}\n      variant={variant}\n      {...rest}\n    >\n      {children}\n      {target === \"_blank\" && (\n        <>\n          {IconComponent && (\n            <IconComponent className={withBaseName(\"icon\")} aria-hidden />\n          )}\n          <span className={withBaseName(\"externalLinkADA\")}>External</span>\n        </>\n      )}\n    </Text>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Link","TearOutIcon","useWindow","useComponentCssInjection","linkCss","jsxs","Text","clsx","Fragment","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AAY/B,MAAA,IAAA,GAAOC,gBAAyC,CAAA,SAASC,KACpE,CAAA;AAAA,EACE,aAAgB,GAAAC,iBAAA;AAAA,EAChB,IAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAU,GAAA,SAAA;AAAA,EACV,MAAS,GAAA,OAAA;AAAA,EACN,GAAA,IAAA;AACL,CAAA,EACA,GACyB,EAAA;AACzB,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,eAAA,CAAAC,SAAA,EAAA;AAAA,IACC,EAAG,EAAA,GAAA;AAAA,IACH,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,IAAA;AAAA,IACA,GAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,MACA,WAAW,QACV,oBAAAF,eAAA,CAAAG,mBAAA,EAAA;AAAA,QACG,QAAA,EAAA;AAAA,UAAA,aAAA,oBACEC,cAAA,CAAA,aAAA,EAAA;AAAA,YAAc,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,YAAG,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,0BAE7DA,cAAA,CAAA,MAAA,EAAA;AAAA,YAAK,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,YAAG,QAAA,EAAA,UAAA;AAAA,WAAQ,CAAA;AAAA,SAAA;AAAA,OAC5D,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Link.js","sources":["../src/link/Link.tsx"],"sourcesContent":["import { ComponentType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { IconProps, TearOutIcon } from \"@salt-ds/icons\";\nimport { makePrefixer } from \"../utils\";\nimport { Text, TextProps } from \"../text\";\n\nimport linkCss from \"./Link.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltLink\");\n\n/**\n * Links are a fundamental navigation element. When clicked, they take the user to an entirely different page.\n *\n * @example\n * <LinkExample to=\"#link\">Action</LinkExample>\n */\nexport interface LinkProps extends Omit<TextProps<\"a\">, \"as\" | \"disabled\"> {\n  IconComponent?: ComponentType<IconProps> | null;\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  {\n    IconComponent = TearOutIcon,\n    href,\n    className,\n    children,\n    variant = \"primary\",\n    target = \"_self\",\n    ...rest\n  },\n  ref\n): ReactElement<LinkProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-link\",\n    css: linkCss,\n    window: targetWindow,\n  });\n\n  return (\n    <Text\n      as=\"a\"\n      className={clsx(withBaseName(), className)}\n      href={href}\n      ref={ref}\n      target={target}\n      variant={variant}\n      {...rest}\n    >\n      {children}\n      {target === \"_blank\" && (\n        <>\n          {IconComponent && (\n            <IconComponent className={withBaseName(\"icon\")} aria-hidden />\n          )}\n          <span className={withBaseName(\"externalLinkADA\")}>External</span>\n        </>\n      )}\n    </Text>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Link","TearOutIcon","useWindow","useComponentCssInjection","linkCss","jsxs","Text","clsx","Fragment","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AAY/B,MAAA,IAAA,GAAOC,gBAAyC,CAAA,SAASC,KACpE,CAAA;AAAA,EACE,aAAgB,GAAAC,iBAAA;AAAA,EAChB,IAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAU,GAAA,SAAA;AAAA,EACV,MAAS,GAAA,OAAA;AAAA,EACN,GAAA,IAAA;AACL,CAAA,EACA,GACyB,EAAA;AACzB,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,eAAA,CAAAC,SAAA,EAAA;AAAA,IACC,EAAG,EAAA,GAAA;AAAA,IACH,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,IAAA;AAAA,IACA,GAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,MACA,WAAW,QACV,oBAAAF,eAAA,CAAAG,mBAAA,EAAA;AAAA,QACG,QAAA,EAAA;AAAA,UAAA,aAAA,oBACEC,cAAA,CAAA,aAAA,EAAA;AAAA,YAAc,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,YAAG,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,0BAE7DA,cAAA,CAAA,MAAA,EAAA;AAAA,YAAK,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,YAAG,QAAA,EAAA,UAAA;AAAA,WAAQ,CAAA;AAAA,SAAA;AAAA,OAC5D,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/link-card/LinkCard.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = "/* Styles applied to LinkCard */\n.saltLinkCard {\n  border-width: var(--saltLinkCard-borderWidth, var(--salt-size-border));\n  border-style: var(--saltLinkCard-borderStyle, var(--salt-container-borderStyle));\n  border-radius: var(--saltLinkCard-borderRadius, 0);\n  display: block;\n  padding: var(--saltLinkCard-padding, var(--salt-spacing-200));\n  position: relative;\n  text-decoration: none;\n  transition: box-shadow var(--salt-duration-instant) ease-in-out;\n}\n\n/* Styles applied to LinkCard when variant=\"primary\" */\n.saltLinkCard-primary {\n  background: var(--saltLinkCard-background, var(--salt-container-primary-background));\n  border-color: var(--salt-container-primary-borderColor);\n  --linkCard-accent-color: var(--salt-container-primary-borderColor);\n}\n\n/* Styles applied to LinkCard when variant=\"secondary\" */\n.saltLinkCard-secondary {\n  background: var(--saltLinkCard-background, var(--salt-container-secondary-background));\n  border-color: var(--salt-container-secondary-borderColor);\n  --linkCard-accent-color: var(--salt-container-secondary-borderColor);\n}\n\n/* Styles applied to create accent */\n.saltLinkCard-accent::after {\n  content: \"\";\n  position: absolute;\n  background-color: var(--saltLinkCard-accent-color, var(--linkCard-accent-color));\n}\n\n/* Styles applied to LinkCard if `accent=\"bottom\"` (default) */\n.saltLinkCard-accentBottom::after {\n  left: calc(-1 * var(--salt-size-border));\n  bottom: calc(-1 * var(--salt-size-border));\n  height: var(--salt-size-accent);\n  width: calc(100% + calc(2 * var(--salt-size-border)));\n}\n\n/* Styles applied to LinkCard if `accent=\"left\"` */\n.saltLinkCard-accentLeft::after {\n  left: calc(-1 * var(--salt-size-border));\n  top: calc(-1 * var(--salt-size-border));\n  height: calc(100% + calc(2 * var(--salt-size-border)));\n  width: var(--salt-size-accent);\n}\n\n/* Styles applied to LinkCard if `accent=\"top\"` */\n.saltLinkCard-accentTop::after {\n  left: calc(-1 * var(--salt-size-border));\n  top: calc(-1 * var(--salt-size-border));\n  height: var(--salt-size-accent);\n  width: calc(100% + calc(2 * var(--salt-size-border)));\n}\n\n/* Styles applied to LinkCard if `accent=\"right\"` */\n.saltLinkCard-accentRight::after {\n  right: calc(-1 * var(--salt-size-border));\n  top: calc(-1 * var(--salt-size-border));\n  height: calc(100% + calc(2 * var(--salt-size-border)));\n  width: var(--salt-size-accent);\n}\n\n/* Styles applied to LinkCard on focus */\n.saltLinkCard:focus-visible {\n  cursor: var(--salt-selectable-cursor-hover);\n  box-shadow: var(--salt-overlayable-shadow-hover);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-offset: var(--salt-focused-outlineOffset);\n  --linkCard-accent-color: var(--salt-selectable-foreground-hover);\n}\n\n/* Styles applied on hover state to LinkCard */\n.saltLinkCard:hover {\n  cursor: var(--salt-selectable-cursor-hover);\n  box-shadow: var(--salt-overlayable-shadow-hover);\n  --linkCard-accent-color: var(--salt-selectable-foreground-hover);\n}\n\n/* Styles applied on active state to LinkCard */\n.saltLinkCard:active {\n  cursor: var(--salt-selectable-cursor-active);\n  border-color: var(--salt-selectable-borderColor-selected);\n  box-shadow: var(--salt-overlayable-shadow);\n  --linkCard-accent-color: var(--salt-selectable-foreground-selected);\n}\n";
+var css_248z = "/* Styles applied to LinkCard */\n.saltLinkCard {\n  border-width: var(--saltLinkCard-borderWidth, var(--salt-size-border));\n  border-style: var(--saltLinkCard-borderStyle, var(--salt-container-borderStyle));\n  border-radius: var(--saltLinkCard-borderRadius, 0);\n  display: block;\n  padding: var(--saltLinkCard-padding, var(--salt-spacing-200));\n  position: relative;\n  text-decoration: none;\n  transition: box-shadow var(--salt-duration-instant) ease-in-out;\n}\n\n/* Styles applied to LinkCard when variant=\"primary\" */\n.saltLinkCard-primary {\n  background: var(--saltLinkCard-background, var(--salt-container-primary-background));\n  border-color: var(--salt-container-primary-borderColor);\n  --linkCard-accent-color: var(--salt-container-primary-borderColor);\n}\n\n/* Styles applied to LinkCard when variant=\"secondary\" */\n.saltLinkCard-secondary {\n  background: var(--saltLinkCard-background, var(--salt-container-secondary-background));\n  border-color: var(--salt-container-secondary-borderColor);\n  --linkCard-accent-color: var(--salt-container-secondary-borderColor);\n}\n\n/* Styles applied to create accent */\n.saltLinkCard-accent::after {\n  content: \"\";\n  position: absolute;\n  background-color: var(--saltLinkCard-accent-color, var(--linkCard-accent-color));\n}\n\n/* Styles applied to LinkCard if `accent=\"bottom\"` (default) */\n.saltLinkCard-accentBottom::after {\n  left: calc(-1 * var(--salt-size-border));\n  bottom: calc(-1 * var(--salt-size-border));\n  height: var(--salt-size-accent);\n  width: calc(100% + calc(2 * var(--salt-size-border)));\n}\n\n/* Styles applied to LinkCard if `accent=\"left\"` */\n.saltLinkCard-accentLeft::after {\n  left: calc(-1 * var(--salt-size-border));\n  top: calc(-1 * var(--salt-size-border));\n  height: calc(100% + calc(2 * var(--salt-size-border)));\n  width: var(--salt-size-accent);\n}\n\n/* Styles applied to LinkCard if `accent=\"top\"` */\n.saltLinkCard-accentTop::after {\n  left: calc(-1 * var(--salt-size-border));\n  top: calc(-1 * var(--salt-size-border));\n  height: var(--salt-size-accent);\n  width: calc(100% + calc(2 * var(--salt-size-border)));\n}\n\n/* Styles applied to LinkCard if `accent=\"right\"` */\n.saltLinkCard-accentRight::after {\n  right: calc(-1 * var(--salt-size-border));\n  top: calc(-1 * var(--salt-size-border));\n  height: calc(100% + calc(2 * var(--salt-size-border)));\n  width: var(--salt-size-accent);\n}\n\n/* Styles applied to LinkCard on focus */\n.saltLinkCard:focus-visible {\n  cursor: var(--salt-selectable-cursor-hover);\n  box-shadow: var(--salt-overlayable-shadow-hover);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-offset: var(--salt-focused-outlineOffset);\n  --linkCard-accent-color: var(--salt-selectable-foreground-hover);\n}\n\n/* Styles applied on active state to LinkCard */\n.saltLinkCard:active {\n  cursor: var(--salt-selectable-cursor-active);\n  border-color: var(--salt-selectable-borderColor-selected);\n  box-shadow: var(--salt-overlayable-shadow);\n  --linkCard-accent-color: var(--salt-selectable-foreground-selected);\n}\n\n/* Styles applied on hover state to LinkCard */\n@media (hover: hover) {\n  .saltLinkCard:hover {\n    cursor: var(--salt-selectable-cursor-hover);\n    box-shadow: var(--salt-overlayable-shadow-hover);\n    --linkCard-accent-color: var(--salt-selectable-foreground-hover);\n  }\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=LinkCard.css.js.map

package/dist-cjs/link-card/LinkCard.js

@@ -27,22 +27,15 @@ require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
 require('../button/Button.js');
 require('../card/Card.js');
-require('../card/InteractableCard.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');
 require('@salt-ds/icons');
 require('../combo-box/ComboBox.js');
 require('../dialog/Dialog.js');
-require('../status-indicator/StatusIndicator.js');
-require('../text/Text.js');
-require('../text/Display.js');
-require('../text/Headings.js');
-require('../text/Label.js');
-require('../text/TextNotation.js');
-require('../text/TextAction.js');
-require('../dialog/DialogContext.js');
+require('../dialog/DialogHeader.js');
 require('../dialog/DialogActions.js');
 require('../dialog/DialogContent.js');
+require('../dialog/DialogContext.js');
 require('../dialog/DialogCloseButton.js');
 require('../drawer/Drawer.js');
 require('../drawer/DrawerCloseButton.js');
@@ -54,10 +47,21 @@ require('../flex-item/FlexItem.js');
 require('../flex-layout/FlexLayout.js');
 require('../flow-layout/FlowLayout.js');
 require('../form-field/FormField.js');
+require('../status-indicator/StatusIndicator.js');
+require('../text/Text.js');
+require('../text/Code.js');
+require('../text/Display.js');
+require('../text/Headings.js');
+require('../text/Label.js');
+require('../text/TextAction.js');
+require('../text/TextNotation.js');
 require('../form-field-context/FormFieldContext.js');
 require('../grid-item/GridItem.js');
 require('../grid-layout/GridLayout.js');
 require('../input/Input.js');
+require('../interactable-card/InteractableCard.js');
+require('../interactable-card/InteractableCardGroup.js');
+require('../interactable-card/InteractableCardGroupContext.js');
 require('../link/Link.js');
 require('../list-control/ListControlContext.js');
 require('../multiline-input/MultilineInput.js');
@@ -76,6 +80,7 @@ require('../progress/LinearProgress/LinearProgress.js');
 require('../radio-button/RadioButton.js');
 require('../radio-button/RadioButtonGroup.js');
 require('../scrim/Scrim.js');
+require('../segmented-button-group/SegmentedButtonGroup.js');
 require('../spinner/Spinner.js');
 require('../stack-layout/StackLayout.js');
 require('../status-adornment/StatusAdornment.js');

package/dist-cjs/link-card/LinkCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinkCard.js","sources":["../src/link-card/LinkCard.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport linkCardCss from \"./LinkCard.css\";\n\nconst withBaseName = makePrefixer(\"saltLinkCard\");\n\nexport interface LinkCardProps extends ComponentPropsWithoutRef<\"a\"> {\n  /**\n   * If provided an accent is shown in the specified position.\n   */\n  accent?: \"bottom\" | \"top\" | \"left\" | \"right\";\n  /**\n   * Styling variant; defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nexport const LinkCard = forwardRef<HTMLAnchorElement, LinkCardProps>(\n  function LinkCard(props, ref) {\n    const {\n      accent,\n      children,\n      className,\n      href,\n      variant = \"primary\",\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-link-card\",\n      css: linkCardCss,\n      window: targetWindow,\n    });\n\n    return (\n      <a\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"accent\")]: accent,\n            [withBaseName(`accent${capitalize(accent ?? \"\")}`)]: accent,\n          },\n          className\n        )}\n        href={href}\n        {...rest}\n        ref={ref}\n      >\n        {children}\n      </a>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","LinkCard","useWindow","useComponentCssInjection","linkCardCss","jsx","clsx","capitalize"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,cAAc,CAAA,CAAA;AAazC,MAAM,QAAW,GAAAC,gBAAA;AAAA,EACtB,SAASC,SAAS,CAAA,KAAA,EAAO,GAAK,EAAA;AAC5B,IAAM,MAAA;AAAA,MACJ,MAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAU,GAAA,SAAA;AAAA,MACP,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,GAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,OAAO,CAAA;AAAA,QACpB;AAAA,UACE,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,UAC1B,CAAC,YAAa,CAAA,CAAA,MAAA,EAASC,sBAAW,MAAU,IAAA,IAAA,GAAA,MAAA,GAAA,EAAE,GAAG,CAAI,GAAA,MAAA;AAAA,SACvD;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,IAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"LinkCard.js","sources":["../src/link-card/LinkCard.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport linkCardCss from \"./LinkCard.css\";\n\nconst withBaseName = makePrefixer(\"saltLinkCard\");\n\nexport interface LinkCardProps extends ComponentPropsWithoutRef<\"a\"> {\n  /**\n   * If provided an accent is shown in the specified position.\n   */\n  accent?: \"bottom\" | \"top\" | \"left\" | \"right\";\n  /**\n   * Styling variant; defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nexport const LinkCard = forwardRef<HTMLAnchorElement, LinkCardProps>(\n  function LinkCard(props, ref) {\n    const {\n      accent,\n      children,\n      className,\n      href,\n      variant = \"primary\",\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-link-card\",\n      css: linkCardCss,\n      window: targetWindow,\n    });\n\n    return (\n      <a\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"accent\")]: accent,\n            [withBaseName(`accent${capitalize(accent ?? \"\")}`)]: accent,\n          },\n          className\n        )}\n        href={href}\n        {...rest}\n        ref={ref}\n      >\n        {children}\n      </a>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","LinkCard","useWindow","useComponentCssInjection","linkCardCss","jsx","clsx","capitalize"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,cAAc,CAAA,CAAA;AAazC,MAAM,QAAW,GAAAC,gBAAA;AAAA,EACtB,SAASC,SAAS,CAAA,KAAA,EAAO,GAAK,EAAA;AAC5B,IAAM,MAAA;AAAA,MACJ,MAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAU,GAAA,SAAA;AAAA,MACP,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,GAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,OAAO,CAAA;AAAA,QACpB;AAAA,UACE,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,UAC1B,CAAC,YAAa,CAAA,CAAA,MAAA,EAASC,sBAAW,MAAU,IAAA,IAAA,GAAA,MAAA,GAAA,EAAE,GAAG,CAAI,GAAA,MAAA;AAAA,SACvD;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,IAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/list-control/ListControlContext.js

@@ -24,7 +24,6 @@ require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
 require('../button/Button.js');
 require('../card/Card.js');
-require('../card/InteractableCard.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');
 require('@salt-ds/styles');
@@ -32,16 +31,10 @@ require('@salt-ds/window');
 require('@salt-ds/icons');
 require('../combo-box/ComboBox.js');
 require('../dialog/Dialog.js');
-require('../status-indicator/StatusIndicator.js');
-require('../text/Text.js');
-require('../text/Display.js');
-require('../text/Headings.js');
-require('../text/Label.js');
-require('../text/TextNotation.js');
-require('../text/TextAction.js');
-require('../dialog/DialogContext.js');
+require('../dialog/DialogHeader.js');
 require('../dialog/DialogActions.js');
 require('../dialog/DialogContent.js');
+require('../dialog/DialogContext.js');
 require('../dialog/DialogCloseButton.js');
 require('../drawer/Drawer.js');
 require('../drawer/DrawerCloseButton.js');
@@ -53,10 +46,21 @@ require('../flex-item/FlexItem.js');
 require('../flex-layout/FlexLayout.js');
 require('../flow-layout/FlowLayout.js');
 require('../form-field/FormField.js');
+require('../status-indicator/StatusIndicator.js');
+require('../text/Text.js');
+require('../text/Code.js');
+require('../text/Display.js');
+require('../text/Headings.js');
+require('../text/Label.js');
+require('../text/TextAction.js');
+require('../text/TextNotation.js');
 require('../form-field-context/FormFieldContext.js');
 require('../grid-item/GridItem.js');
 require('../grid-layout/GridLayout.js');
 require('../input/Input.js');
+require('../interactable-card/InteractableCard.js');
+require('../interactable-card/InteractableCardGroup.js');
+require('../interactable-card/InteractableCardGroupContext.js');
 require('../link/Link.js');
 require('../link-card/LinkCard.js');
 require('../multiline-input/MultilineInput.js');
@@ -75,6 +79,7 @@ require('../progress/LinearProgress/LinearProgress.js');
 require('../radio-button/RadioButton.js');
 require('../radio-button/RadioButtonGroup.js');
 require('../scrim/Scrim.js');
+require('../segmented-button-group/SegmentedButtonGroup.js');
 require('../spinner/Spinner.js');
 require('../stack-layout/StackLayout.js');
 require('../status-adornment/StatusAdornment.js');

package/dist-cjs/list-control/ListControlContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListControlContext.js","sources":["../src/list-control/ListControlContext.tsx"],"sourcesContent":["import { SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\nimport { defaultValueToString } from \"./ListControlState\";\n\nexport interface OptionValue<Item> {\n  id: string;\n  disabled: boolean;\n  value: Item;\n}\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport interface ListControlContextValue<Item> {\n  openState: boolean;\n  setOpen: (newOpen: boolean, openChangeReason?: OpenChangeReason) => void;\n  register: (\n    optionValue: OptionValue<Item>,\n    element: HTMLElement\n  ) => () => void;\n  selectedState: unknown[];\n  select: (event: SyntheticEvent, option: OptionValue<Item>) => void;\n  activeState?: OptionValue<Item>;\n  setActive: (option: OptionValue<Item>) => void;\n  multiselect: boolean;\n  focusVisibleState: boolean;\n  valueToString: (item: Item) => string;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Need to use any here as a winder type but it gets narrowed when using the useListControl hook.\nexport const ListControlContext = createContext<ListControlContextValue<any>>(\n  \"ListControlContext\",\n  {\n    openState: false,\n    setOpen() {\n      return undefined;\n    },\n    register() {\n      return () => undefined;\n    },\n    selectedState: [],\n    select() {\n      return undefined;\n    },\n    activeState: undefined,\n    setActive() {\n      return undefined;\n    },\n    multiselect: false,\n    focusVisibleState: false,\n    valueToString: defaultValueToString,\n  }\n);\n\nexport function useListControlContext<Item>() {\n  return useContext(ListControlContext) as ListControlContextValue<Item>;\n}\n"],"names":["createContext","defaultValueToString","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BO,MAAM,kBAAqB,GAAAA,2BAAA;AAAA,EAChC,oBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,OAAU,GAAA;AACR,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,QAAW,GAAA;AACT,MAAA,OAAO,MAAM,KAAA,CAAA,CAAA;AAAA,KACf;AAAA,IACA,eAAe,EAAC;AAAA,IAChB,MAAS,GAAA;AACP,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA,CAAA;AAAA,IACb,SAAY,GAAA;AACV,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA;AAAA,IACb,iBAAmB,EAAA,KAAA;AAAA,IACnB,aAAe,EAAAC,qCAAA;AAAA,GACjB;AACF,EAAA;AAEO,SAAS,qBAA8B,GAAA;AAC5C,EAAA,OAAOC,iBAAW,kBAAkB,CAAA,CAAA;AACtC;;;;;"}
+{"version":3,"file":"ListControlContext.js","sources":["../src/list-control/ListControlContext.tsx"],"sourcesContent":["import { SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\nimport { defaultValueToString } from \"./ListControlState\";\n\nexport interface OptionValue<Item> {\n  id: string;\n  disabled: boolean;\n  value: Item;\n}\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport interface ListControlContextValue<Item> {\n  openState: boolean;\n  setOpen: (newOpen: boolean, openChangeReason?: OpenChangeReason) => void;\n  register: (\n    optionValue: OptionValue<Item>,\n    element: HTMLElement\n  ) => () => void;\n  selectedState: unknown[];\n  select: (event: SyntheticEvent, option: OptionValue<Item>) => void;\n  activeState?: OptionValue<Item>;\n  setActive: (option: OptionValue<Item>) => void;\n  multiselect: boolean;\n  focusVisibleState: boolean;\n  valueToString: (item: Item) => string;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Need to use any here as a winder type but it gets narrowed when using the useListControl hook.\nexport const ListControlContext = createContext<ListControlContextValue<any>>(\n  \"ListControlContext\",\n  {\n    openState: false,\n    setOpen() {\n      return undefined;\n    },\n    register() {\n      return () => undefined;\n    },\n    selectedState: [],\n    select() {\n      return undefined;\n    },\n    activeState: undefined,\n    setActive() {\n      return undefined;\n    },\n    multiselect: false,\n    focusVisibleState: false,\n    valueToString: defaultValueToString,\n  }\n);\n\nexport function useListControlContext<Item>() {\n  return useContext(ListControlContext) as ListControlContextValue<Item>;\n}\n"],"names":["createContext","defaultValueToString","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BO,MAAM,kBAAqB,GAAAA,2BAAA;AAAA,EAChC,oBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,OAAU,GAAA;AACR,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,QAAW,GAAA;AACT,MAAA,OAAO,MAAM,KAAA,CAAA,CAAA;AAAA,KACf;AAAA,IACA,eAAe,EAAC;AAAA,IAChB,MAAS,GAAA;AACP,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA,CAAA;AAAA,IACb,SAAY,GAAA;AACV,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA;AAAA,IACb,iBAAmB,EAAA,KAAA;AAAA,IACnB,aAAe,EAAAC,qCAAA;AAAA,GACjB;AACF,EAAA;AAEO,SAAS,qBAA8B,GAAA;AAC5C,EAAA,OAAOC,iBAAW,kBAAkB,CAAA,CAAA;AACtC;;;;;"}