@salt-ds/lab 1.0.0-alpha.9 → 1.0.0-alpha.90

package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverflowPanel.js","sources":["../src/toolbar/overflow-panel/OverflowPanel.tsx"],"sourcesContent":["import {\n  Button,\n  makePrefixer,\n  useControlled,\n  useIcon,\n  useIdMemo as useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  cloneElement,\n  type ForwardedRef,\n  forwardRef,\n  type MouseEvent,\n  type ReactElement,\n  useCallback,\n  useRef,\n} from \"react\";\n\nimport {\n  useCollectionItems,\n  useKeyboardNavigationPanel,\n} from \"../../common-hooks\";\n\nimport { DropdownBase, type DropdownBaseProps } from \"../../dropdown\";\nimport { ToolbarField, type ToolbarFieldProps } from \"../toolbar-field\";\nimport overflowPanelCss from \"./OverflowPanel.css\";\nimport { OverflowSeparator } from \"./OverflowSeparator\";\n\nconst withBaseName = makePrefixer(\"saltOverflowPanel\");\n\nexport interface DropdownPanelProps extends DropdownBaseProps {\n  /**\n   * Trigger button icon\n   */\n  triggerButtonIcon?: JSX.Element;\n  /**\n   * Trigger button text\n   */\n  triggerButtonLabel?: string;\n}\n\nexport const OverflowPanel = forwardRef(function DropdownPanel(\n  {\n    children,\n    className,\n    defaultIsOpen,\n    isOpen: isOpenProp,\n    onOpenChange,\n    triggerButtonIcon,\n    triggerButtonLabel,\n    ...props\n  }: DropdownPanelProps,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overflow-panel\",\n    css: overflowPanelCss,\n    window: targetWindow,\n  });\n  const { OverflowIcon } = useIcon();\n  const id = useId();\n  const collectionHook = useCollectionItems<ReactElement>({\n    id,\n    children,\n  });\n\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const [isOpen, setIsOpen] = useControlled<boolean>({\n    controlled: isOpenProp,\n    default: defaultIsOpen || false,\n    name: \"DropdownPanel\",\n  });\n\n  const { highlightedIndex: highlightedIdx, ...keyboardHook } =\n    useKeyboardNavigationPanel({\n      cycleFocus: true,\n      defaultHighlightedIndex: 0,\n      focusOnHighlight: true,\n      indexPositions: collectionHook.data,\n    });\n\n  const focusTrigger = useCallback(() => {\n    if (triggerRef.current) {\n      triggerRef.current.focus();\n    }\n  }, []);\n\n  const setPanelRef = useCallback((el: HTMLElement | null) => el?.focus(), []);\n\n  const handleItemClick = (evt: MouseEvent) => {\n    // if (sourceItem.props[\"data-close-on-click\"] !== false) closeMenu();\n    setIsOpen(false);\n    focusTrigger();\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    setIsOpen(open);\n    onOpenChange?.(open);\n  };\n\n  const getTriggerButtonIcon = () =>\n    (triggerButtonIcon ?? triggerButtonLabel === undefined) ? (\n      <OverflowIcon />\n    ) : undefined;\n\n  return (\n    <DropdownBase\n      {...props}\n      className={clsx(withBaseName(), className)}\n      isOpen={isOpen}\n      onOpenChange={handleOpenChange}\n      placement=\"bottom-end\"\n      ref={forwardedRef}\n    >\n      <Button variant=\"secondary\" ref={triggerRef}>\n        {getTriggerButtonIcon()}\n        {triggerButtonLabel}\n      </Button>\n      <div\n        className={withBaseName(\"content\")}\n        ref={setPanelRef}\n        tabIndex={-1}\n        {...keyboardHook.listProps}\n      >\n        {collectionHook.data.map((item) => {\n          const { type } = item.value as ReactElement;\n          if (type === OverflowSeparator) {\n            return item.value;\n          }\n          const formFieldProps = {\n            id: item.id,\n            inOverflowPanel: true,\n            key: item.id,\n            onClick: handleItemClick,\n          } as ToolbarFieldProps;\n\n          if (type === ToolbarField) {\n            return cloneElement(item.value as ReactElement, formFieldProps);\n          }\n          return (\n            <ToolbarField {...formFieldProps} key={item.id}>\n              {item.value}\n            </ToolbarField>\n          );\n        })}\n      </div>\n    </DropdownBase>\n  );\n});\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","overflowPanelCss","useIcon","useId","useCollectionItems","useRef","useControlled","useKeyboardNavigationPanel","useCallback","jsx","jsxs","DropdownBase","clsx","Button","OverflowSeparator","ToolbarField","cloneElement","createElement"],"mappings":"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"}

package/dist-cjs/toolbar/overflow-panel/OverflowSeparator.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltOverflowSeparator {\n  background: var(--salt-separable-tertiary-borderColor);\n  height: var(--salt-size-fixed-100);\n  margin: calc(var(--salt-size-unit) / 2) 0;\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=OverflowSeparator.css.js.map

package/dist-cjs/toolbar/overflow-panel/OverflowSeparator.css.js.map

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

package/dist-cjs/toolbar/overflow-panel/OverflowSeparator.js

@@ -0,0 +1,26 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var OverflowSeparator$1 = require('./OverflowSeparator.css.js');
+
+const withBaseName = core.makePrefixer("saltOverflowSeparator");
+const OverflowSeparator = (props) => {
+  const { className, focusable, ...rest } = props;
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "salt-overflow-separator",
+    css: OverflowSeparator$1,
+    window: targetWindow
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx(withBaseName(), className), ...rest });
+};
+OverflowSeparator.defaultProps = {
+  focusable: false
+};
+
+exports.OverflowSeparator = OverflowSeparator;
+//# sourceMappingURL=OverflowSeparator.js.map

package/dist-cjs/toolbar/overflow-panel/OverflowSeparator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverflowSeparator.js","sources":["../src/toolbar/overflow-panel/OverflowSeparator.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport type { HTMLAttributes, ReactElement } from \"react\";\nimport overflowSeparatorCss from \"./OverflowSeparator.css\";\n\nconst withBaseName = makePrefixer(\"saltOverflowSeparator\");\n\nexport interface OverflowSeparatorProps extends HTMLAttributes<HTMLDivElement> {\n  children?: never;\n  focusable?: boolean;\n}\n\nexport const OverflowSeparator = (\n  props: OverflowSeparatorProps,\n): ReactElement => {\n  const { className, focusable, ...rest } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overflow-separator\",\n    css: overflowSeparatorCss,\n    window: targetWindow,\n  });\n  return <div className={clsx(withBaseName(), className)} {...rest} />;\n};\n\nOverflowSeparator.defaultProps = {\n  focusable: false,\n};\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","overflowSeparatorCss","jsx","clsx"],"mappings":";;;;;;;;;AAOA,MAAM,YAAA,GAAeA,kBAAa,uBAAuB,CAAA;AAOlD,MAAM,iBAAA,GAAoB,CAC/B,KAAA,KACiB;AACjB,EAAA,MAAM,EAAE,SAAA,EAAW,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AAC1C,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,yBAAA;AAAA,IACR,GAAA,EAAKC,mBAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AACD,EAAA,uBAAOC,cAAA,CAAC,SAAI,SAAA,EAAWC,SAAA,CAAK,cAAa,EAAG,SAAS,CAAA,EAAI,GAAG,IAAA,EAAM,CAAA;AACpE;AAEA,iBAAA,CAAkB,YAAA,GAAe;AAAA,EAC/B,SAAA,EAAW;AACb,CAAA;;;;"}

package/dist-cjs/toolbar/toolbar-field/ToolbarField.js

@@ -0,0 +1,16 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+var FormFieldLegacy = require('../../form-field-legacy/FormFieldLegacy.js');
+require('../../form-field-legacy/FormLabel.js');
+var useToolbarField = require('./useToolbarField.js');
+
+const ToolbarField = react.forwardRef(function ToolbarField2(props, forwardedRef) {
+  const toolbarFieldProps = useToolbarField.useToolbarField(props);
+  return /* @__PURE__ */ jsxRuntime.jsx(FormFieldLegacy.FormFieldLegacy, { ...toolbarFieldProps, ref: forwardedRef });
+});
+ToolbarField.displayName = "ToolbarField";
+
+exports.ToolbarField = ToolbarField;
+//# sourceMappingURL=ToolbarField.js.map

package/dist-cjs/toolbar/toolbar-field/ToolbarField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarField.js","sources":["../src/toolbar/toolbar-field/ToolbarField.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef } from \"react\";\nimport { FormFieldLegacy as FormField } from \"../../form-field-legacy\";\nimport type { ToolbarFieldProps } from \"./toolbarFieldTypes\";\nimport { useToolbarField } from \"./useToolbarField\";\n\nexport const ToolbarField = forwardRef(function ToolbarField(\n  props: ToolbarFieldProps,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const toolbarFieldProps = useToolbarField(props);\n  return <FormField {...toolbarFieldProps} ref={forwardedRef} />;\n});\n\nToolbarField.displayName = \"ToolbarField\";\n"],"names":["forwardRef","ToolbarField","useToolbarField","jsx","FormField"],"mappings":";;;;;;;;AAKO,MAAM,YAAA,GAAeA,gBAAA,CAAW,SAASC,aAAAA,CAC9C,OACA,YAAA,EACA;AACA,EAAA,MAAM,iBAAA,GAAoBC,gCAAgB,KAAK,CAAA;AAC/C,EAAA,uBAAOC,cAAA,CAACC,+BAAA,EAAA,EAAW,GAAG,iBAAA,EAAmB,KAAK,YAAA,EAAc,CAAA;AAC9D,CAAC;AAED,YAAA,CAAa,WAAA,GAAc,cAAA;;;;"}

package/dist-cjs/toolbar/toolbar-field/useToolbarField.js

@@ -0,0 +1,81 @@
+'use strict';
+
+var clsx = require('clsx');
+var react = require('react');
+var ToolbarButton = require('../ToolbarButton.js');
+
+const NullActivationIndicator = () => null;
+const primaryControls = ["Dropdown", "Input"];
+const getChildElementName = (element) => {
+  if (react.isValidElement(element)) {
+    const { type } = element;
+    if (typeof type === "string") {
+      return type;
+    }
+    if (typeof type.name === "string") {
+      return type.name;
+    }
+    if ("displayName" in type) {
+      return type.displayName;
+    }
+    return "";
+  }
+  throw Error(
+    "useToolbarField, child of ToolbarField is not valid ReactElememnt"
+  );
+};
+const isToolbarButton = (element) => react.isValidElement(element) && element.type === ToolbarButton.ToolbarButton;
+const getToolbarFormFieldProps = (child, isOverflowPanel = false) => {
+  let activationIndicator = NullActivationIndicator;
+  let variant = "tertiary";
+  const element = child;
+  if (react.isValidElement(element)) {
+    const name = getChildElementName(element);
+    if (primaryControls.includes(name)) {
+      activationIndicator = void 0;
+      variant = "primary";
+    }
+  }
+  return {
+    ActivationIndicatorComponent: activationIndicator,
+    className: clsx.clsx({
+      "saltFormFieldLegacy-toolbarButton": isOverflowPanel && isToolbarButton(element),
+      [`saltFormFieldLegacy-${variant}`]: variant
+    }),
+    fullWidth: false
+  };
+};
+const InteractiveComponents = ["Input", "Dropdown"];
+const useToolbarField = (props) => {
+  const {
+    ActivationIndicatorComponent: ActivationIndicatorComponentProp,
+    className: classNameProp,
+    inOverflowPanel,
+    labelPlacement: labelPlacementProp,
+    onClick,
+    ...rest
+  } = props;
+  const childElementName = getChildElementName(props.children);
+  const { className, ActivationIndicatorComponent, ...calculatedProps } = getToolbarFormFieldProps(props.children, inOverflowPanel);
+  const labelPlacement = labelPlacementProp ?? (inOverflowPanel ? "top" : "left");
+  const handleClick = react.useCallback(
+    (e) => {
+      if (onClick && !InteractiveComponents.includes(childElementName)) {
+        onClick(e);
+      }
+    },
+    [childElementName, onClick]
+  );
+  return {
+    ActivationIndicatorComponent: ActivationIndicatorComponentProp ?? ActivationIndicatorComponent,
+    className: clsx.clsx("saltToolbarField", classNameProp, className),
+    labelPlacement,
+    onClick: handleClick,
+    ...rest,
+    ...calculatedProps
+  };
+};
+
+exports.getToolbarFormFieldProps = getToolbarFormFieldProps;
+exports.useToolbarField = useToolbarField;
+//# sourceMappingURL=useToolbarField.js.map

package/dist-cjs/toolbar/toolbar-field/useToolbarField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useToolbarField.js","sources":["../src/toolbar/toolbar-field/useToolbarField.ts"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  isValidElement,\n  type MouseEvent,\n  type ReactElement,\n  type ReactNode,\n  useCallback,\n} from \"react\";\nimport { ToolbarButton } from \"../ToolbarButton\";\nimport type { ToolbarFieldProps } from \"./toolbarFieldTypes\";\n\ntype TypeWithDisplayName = { displayName: string };\ntype ActivationIndicator = ToolbarFieldProps[\"ActivationIndicatorComponent\"];\ntype ToolbarFormFieldVariant = \"primary\" | \"tertiary\";\n\nconst NullActivationIndicator = () => null;\nconst primaryControls = [\"Dropdown\", \"Input\"];\n\nconst getChildElementName = (element: ReactNode): string => {\n  if (isValidElement(element)) {\n    const { type } = element;\n    if (typeof type === \"string\") {\n      return type;\n    }\n    if (typeof type.name === \"string\") {\n      return type.name;\n    }\n    if (\"displayName\" in type) {\n      return (type as TypeWithDisplayName).displayName;\n    }\n    return \"\";\n  }\n  throw Error(\n    \"useToolbarField, child of ToolbarField is not valid ReactElememnt\",\n  );\n};\n\n// ToolbarButton gets special styling treatment in the OverflowPanel but styling is\n// applied to the FormField, so we need to target those FormFields hosting ToolbarButtons.\nconst isToolbarButton = (element: ReactElement): boolean =>\n  isValidElement(element) && element.type === ToolbarButton;\n\n// Some props for Toolbar FormFields depend on the control hosted by\n// the FormField.\nexport const getToolbarFormFieldProps = (\n  child: ReactNode,\n  isOverflowPanel = false,\n): ToolbarFieldProps => {\n  let activationIndicator: ActivationIndicator = NullActivationIndicator;\n  let variant: ToolbarFormFieldVariant = \"tertiary\";\n  const element = child as ReactElement;\n  if (isValidElement(element)) {\n    const name = getChildElementName(element);\n    if (primaryControls.includes(name)) {\n      activationIndicator = undefined;\n      variant = \"primary\";\n    }\n  }\n  return {\n    ActivationIndicatorComponent: activationIndicator,\n    className: clsx({\n      \"saltFormFieldLegacy-toolbarButton\":\n        isOverflowPanel && isToolbarButton(element),\n      [`saltFormFieldLegacy-${variant}`]: variant,\n    }),\n    fullWidth: false,\n  };\n};\n\n// Eventually this list needs to be configurable at the Toolbar level\nconst InteractiveComponents = [\"Input\", \"Dropdown\"];\n\nexport const useToolbarField = (\n  props: ToolbarFieldProps,\n): ToolbarFieldProps => {\n  const {\n    ActivationIndicatorComponent: ActivationIndicatorComponentProp,\n    className: classNameProp,\n    inOverflowPanel,\n    labelPlacement: labelPlacementProp,\n    onClick,\n    ...rest\n  } = props;\n\n  const childElementName = getChildElementName(props.children);\n  const { className, ActivationIndicatorComponent, ...calculatedProps } =\n    getToolbarFormFieldProps(props.children, inOverflowPanel);\n\n  const labelPlacement =\n    labelPlacementProp ?? (inOverflowPanel ? \"top\" : \"left\");\n\n  // disableFocusRing ???\n\n  const handleClick = useCallback(\n    (e: MouseEvent<HTMLDivElement>) => {\n      if (onClick && !InteractiveComponents.includes(childElementName)) {\n        onClick(e);\n      }\n    },\n    [childElementName, onClick],\n  );\n  return {\n    ActivationIndicatorComponent:\n      ActivationIndicatorComponentProp ?? ActivationIndicatorComponent,\n    className: clsx(\"saltToolbarField\", classNameProp, className),\n    labelPlacement,\n    onClick: handleClick,\n    ...rest,\n    ...calculatedProps,\n  };\n};\n"],"names":["isValidElement","ToolbarButton","clsx","useCallback"],"mappings":"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"}

package/dist-cjs/tree/Tree.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltTree {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-spacing-fixed-100);\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  outline: none;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.saltTree-disabled {\n  cursor: var(--salt-cursor-disabled);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=Tree.css.js.map

package/dist-cjs/tree/Tree.css.js.map

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

package/dist-cjs/tree/Tree.js

@@ -0,0 +1,297 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var react = require('react');
+var Tree$1 = require('./Tree.css.js');
+var TreeContext = require('./TreeContext.js');
+var useTree = require('./useTree.js');
+
+const withBaseName = core.makePrefixer("saltTree");
+const Tree = react.forwardRef(
+  function Tree2(props, ref) {
+    const {
+      children,
+      className,
+      defaultExpanded,
+      expanded,
+      onExpandedChange,
+      defaultSelected,
+      selected,
+      onSelectionChange,
+      multiselect = false,
+      disabled = false,
+      onKeyDown,
+      onBlur,
+      ...rest
+    } = props;
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-tree",
+      css: Tree$1,
+      window: targetWindow
+    });
+    const treeState = useTree.useTree({
+      defaultExpanded,
+      expanded,
+      onExpandedChange,
+      defaultSelected,
+      selected,
+      onSelectionChange,
+      multiselect,
+      disabled,
+      children
+    });
+    const {
+      activeNode,
+      setActiveNode,
+      expandedArray,
+      setExpandedArray,
+      expandedState,
+      toggleExpanded,
+      select,
+      selectedSet,
+      setSelectedState,
+      visibleNodes,
+      getNodeMeta,
+      getElement,
+      getParent,
+      getChildren,
+      treeModel,
+      disabledIdsSet
+    } = treeState;
+    const lastKeypressRef = react.useRef("");
+    const keypressTimeoutRef = react.useRef(
+      null
+    );
+    const treeRef = react.useRef(null);
+    react.useEffect(() => {
+      return () => {
+        if (keypressTimeoutRef.current) {
+          clearTimeout(keypressTimeoutRef.current);
+        }
+      };
+    }, []);
+    const handleBlur = (event) => {
+      var _a;
+      onBlur == null ? void 0 : onBlur(event);
+      const relatedTarget = event.relatedTarget;
+      if (!((_a = treeRef.current) == null ? void 0 : _a.contains(relatedTarget))) {
+        setActiveNode(void 0);
+      }
+    };
+    const focusNode = (value) => {
+      const element = getElement(value);
+      if (!element) {
+        return "missing";
+      }
+      const activeEl = targetWindow == null ? void 0 : targetWindow.document.activeElement;
+      if (activeEl === element) {
+        return "already-focused";
+      }
+      element.focus();
+      element.scrollIntoView({ block: "nearest", inline: "nearest" });
+      return "focused";
+    };
+    const handleKeyDown = (event) => {
+      var _a, _b;
+      onKeyDown == null ? void 0 : onKeyDown(event);
+      if (disabled) return;
+      if (visibleNodes.length === 0) return;
+      const currentIndex = activeNode ? visibleNodes.indexOf(activeNode) : -1;
+      let newActiveNode;
+      let handled = false;
+      switch (event.key) {
+        case "ArrowDown": {
+          handled = true;
+          const nextIndex = currentIndex + 1;
+          if (nextIndex < visibleNodes.length) {
+            newActiveNode = visibleNodes[nextIndex];
+          }
+          break;
+        }
+        case "ArrowUp": {
+          handled = true;
+          const prevIndex = currentIndex - 1;
+          if (prevIndex >= 0) {
+            newActiveNode = visibleNodes[prevIndex];
+          }
+          break;
+        }
+        case "ArrowRight": {
+          handled = true;
+          if (activeNode) {
+            const nodeMeta = getNodeMeta(activeNode);
+            const isDisabled = disabledIdsSet.has(activeNode);
+            if (!isDisabled && (nodeMeta == null ? void 0 : nodeMeta.hasChildren)) {
+              if (!expandedState.has(activeNode)) {
+                toggleExpanded(event, activeNode);
+              } else {
+                const firstChild = visibleNodes.find(
+                  (visibleNode) => getParent(visibleNode) === activeNode
+                );
+                if (firstChild) {
+                  newActiveNode = firstChild;
+                }
+              }
+            }
+          }
+          break;
+        }
+        case "ArrowLeft": {
+          handled = true;
+          if (activeNode) {
+            const isDisabled = disabledIdsSet.has(activeNode);
+            if (!isDisabled) {
+              if (expandedState.has(activeNode)) {
+                toggleExpanded(event, activeNode);
+              } else {
+                const parent = getParent(activeNode);
+                if (parent) {
+                  newActiveNode = parent;
+                }
+              }
+            }
+          }
+          break;
+        }
+        case "Home": {
+          handled = true;
+          newActiveNode = visibleNodes[0];
+          break;
+        }
+        case "End": {
+          handled = true;
+          newActiveNode = visibleNodes[visibleNodes.length - 1];
+          break;
+        }
+        case "Enter": {
+          handled = true;
+          if (activeNode) {
+            select(event, activeNode);
+          }
+          break;
+        }
+        case " ": {
+          handled = true;
+          if (activeNode) {
+            select(event, activeNode);
+          }
+          break;
+        }
+        case "*": {
+          handled = true;
+          if (activeNode) {
+            const parent = getParent(activeNode);
+            const siblings = parent ? getChildren(parent) : treeModel.rootValues;
+            const toExpand = siblings.filter((sibling) => {
+              const siblingMeta = getNodeMeta(sibling);
+              return (siblingMeta == null ? void 0 : siblingMeta.hasChildren) && !expandedState.has(sibling) && !disabledIdsSet.has(sibling);
+            });
+            if (toExpand.length > 0) {
+              const newExpanded = [...expandedArray, ...toExpand];
+              setExpandedArray(newExpanded);
+              onExpandedChange == null ? void 0 : onExpandedChange(event, newExpanded);
+            }
+          }
+          break;
+        }
+        default: {
+          if (event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey) {
+            handled = true;
+            if (keypressTimeoutRef.current) {
+              clearTimeout(keypressTimeoutRef.current);
+            }
+            lastKeypressRef.current += event.key.toLowerCase();
+            const searchString = lastKeypressRef.current;
+            keypressTimeoutRef.current = setTimeout(() => {
+              lastKeypressRef.current = "";
+            }, 500);
+            const currentIndex2 = activeNode ? visibleNodes.indexOf(activeNode) : -1;
+            let found = false;
+            for (let i = currentIndex2 + 1; i < visibleNodes.length; i++) {
+              const element = getElement(visibleNodes[i]);
+              if ((_a = element == null ? void 0 : element.textContent) == null ? void 0 : _a.toLowerCase().startsWith(searchString)) {
+                newActiveNode = visibleNodes[i];
+                found = true;
+                break;
+              }
+            }
+            if (!found) {
+              for (let i = 0; i <= currentIndex2; i++) {
+                const element = getElement(visibleNodes[i]);
+                if ((_b = element == null ? void 0 : element.textContent) == null ? void 0 : _b.toLowerCase().startsWith(searchString)) {
+                  newActiveNode = visibleNodes[i];
+                  break;
+                }
+              }
+            }
+          }
+          break;
+        }
+      }
+      if ((event.ctrlKey || event.metaKey) && event.key === "a" && multiselect) {
+        handled = true;
+        event.preventDefault();
+        const allVisibleValues = visibleNodes.filter(
+          (visibleNode) => !disabledIdsSet.has(visibleNode)
+        );
+        const allSelected = allVisibleValues.every(
+          (visible) => selectedSet.has(visible)
+        );
+        const newSelected = allSelected ? [] : allVisibleValues;
+        setSelectedState(newSelected);
+        onSelectionChange == null ? void 0 : onSelectionChange(event, newSelected);
+        return;
+      }
+      if (event.shiftKey && (event.key === "ArrowUp" || event.key === "ArrowDown") && multiselect) {
+        handled = true;
+        const isDown = event.key === "ArrowDown";
+        const currentIndex2 = activeNode ? visibleNodes.indexOf(activeNode) : -1;
+        const nextIndex = isDown ? currentIndex2 + 1 : currentIndex2 - 1;
+        if (nextIndex >= 0 && nextIndex < visibleNodes.length) {
+          const nextValue = visibleNodes[nextIndex];
+          if (!disabledIdsSet.has(nextValue)) {
+            select(event, nextValue);
+            newActiveNode = nextValue;
+          }
+        }
+      }
+      if (handled) {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+      if (newActiveNode !== void 0) {
+        const focusResult = focusNode(newActiveNode);
+        if (focusResult !== "focused") {
+          setActiveNode(newActiveNode);
+        }
+      }
+    };
+    const handleRef = core.useForkRef(treeRef, ref);
+    return /* @__PURE__ */ jsxRuntime.jsx(TreeContext.TreeProvider, { value: treeState, children: /* @__PURE__ */ jsxRuntime.jsx(
+      "ul",
+      {
+        ref: handleRef,
+        role: "tree",
+        "aria-multiselectable": multiselect ? true : void 0,
+        "aria-disabled": disabled || void 0,
+        className: clsx.clsx(
+          withBaseName(),
+          { [withBaseName("disabled")]: disabled },
+          className
+        ),
+        onKeyDown: handleKeyDown,
+        onBlur: handleBlur,
+        ...rest,
+        children
+      }
+    ) });
+  }
+);
+
+exports.Tree = Tree;
+//# sourceMappingURL=Tree.js.map

package/dist-cjs/tree/Tree.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tree.js","sources":["../src/tree/Tree.tsx"],"sourcesContent":["import { makePrefixer, useForkRef } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type FocusEvent,\n  forwardRef,\n  type KeyboardEvent,\n  type SyntheticEvent,\n  useEffect,\n  useRef,\n} from \"react\";\nimport treeCss from \"./Tree.css\";\nimport { TreeProvider } from \"./TreeContext\";\nimport { useTree } from \"./useTree\";\n\nexport interface TreeProps extends ComponentPropsWithoutRef<\"ul\"> {\n  /**\n   * Default expanded nodes (uncontrolled)\n   */\n  defaultExpanded?: string[];\n  /**\n   * Expanded nodes (controlled)\n   */\n  expanded?: string[];\n  /**\n   * Callback on expanded nodes change\n   */\n  onExpandedChange?: (event: SyntheticEvent, expanded: string[]) => void;\n  /**\n   * Default selected nodes (uncontrolled)\n   */\n  defaultSelected?: string[];\n  /**\n   * Selected nodes\n   */\n  selected?: string[];\n  /**\n   * Callback on selected nodes change\n   */\n  onSelectionChange?: (event: SyntheticEvent, selected: string[]) => void;\n  /**\n   * Sets multiselect mode with checkboxes and allows for multiple node selection\n   */\n  multiselect?: boolean;\n  /**\n   * Sets tree to disabled state, preventing all interaction\n   */\n  disabled?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltTree\");\n\nexport const Tree = forwardRef<HTMLUListElement, TreeProps>(\n  function Tree(props, ref) {\n    const {\n      children,\n      className,\n      defaultExpanded,\n      expanded,\n      onExpandedChange,\n      defaultSelected,\n      selected,\n      onSelectionChange,\n      multiselect = false,\n      disabled = false,\n      onKeyDown,\n      onBlur,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-tree\",\n      css: treeCss,\n      window: targetWindow,\n    });\n\n    const treeState = useTree({\n      defaultExpanded,\n      expanded,\n      onExpandedChange,\n      defaultSelected,\n      selected,\n      onSelectionChange,\n      multiselect,\n      disabled,\n      children,\n    });\n\n    const {\n      activeNode,\n      setActiveNode,\n      expandedArray,\n      setExpandedArray,\n      expandedState,\n      toggleExpanded,\n      select,\n      selectedSet,\n      setSelectedState,\n      visibleNodes,\n      getNodeMeta,\n      getElement,\n      getParent,\n      getChildren,\n      treeModel,\n      disabledIdsSet,\n    } = treeState;\n\n    const lastKeypressRef = useRef<string>(\"\");\n    const keypressTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(\n      null,\n    );\n    const treeRef = useRef<HTMLUListElement>(null);\n\n    useEffect(() => {\n      return () => {\n        if (keypressTimeoutRef.current) {\n          clearTimeout(keypressTimeoutRef.current);\n        }\n      };\n    }, []);\n\n    const handleBlur = (event: FocusEvent<HTMLUListElement>) => {\n      onBlur?.(event);\n      const relatedTarget = event.relatedTarget as Node | null;\n      if (!treeRef.current?.contains(relatedTarget)) {\n        setActiveNode(undefined);\n      }\n    };\n\n    const focusNode = (\n      value: string,\n    ): \"focused\" | \"already-focused\" | \"missing\" => {\n      const element = getElement(value);\n      if (!element) {\n        return \"missing\";\n      }\n\n      const activeEl = targetWindow?.document.activeElement;\n      if (activeEl === element) {\n        return \"already-focused\";\n      }\n\n      element.focus();\n      element.scrollIntoView({ block: \"nearest\", inline: \"nearest\" });\n      return \"focused\";\n    };\n\n    const handleKeyDown = (event: KeyboardEvent<HTMLUListElement>) => {\n      onKeyDown?.(event);\n\n      if (disabled) return;\n\n      if (visibleNodes.length === 0) return;\n\n      const currentIndex = activeNode ? visibleNodes.indexOf(activeNode) : -1;\n\n      let newActiveNode: string | undefined;\n      let handled = false;\n\n      switch (event.key) {\n        case \"ArrowDown\": {\n          handled = true;\n          const nextIndex = currentIndex + 1;\n          if (nextIndex < visibleNodes.length) {\n            newActiveNode = visibleNodes[nextIndex];\n          }\n          break;\n        }\n        case \"ArrowUp\": {\n          handled = true;\n          const prevIndex = currentIndex - 1;\n          if (prevIndex >= 0) {\n            newActiveNode = visibleNodes[prevIndex];\n          }\n          break;\n        }\n        case \"ArrowRight\": {\n          handled = true;\n          if (activeNode) {\n            const nodeMeta = getNodeMeta(activeNode);\n            const isDisabled = disabledIdsSet.has(activeNode);\n            if (!isDisabled && nodeMeta?.hasChildren) {\n              if (!expandedState.has(activeNode)) {\n                toggleExpanded(event, activeNode);\n              } else {\n                const firstChild = visibleNodes.find(\n                  (visibleNode) => getParent(visibleNode) === activeNode,\n                );\n                if (firstChild) {\n                  newActiveNode = firstChild;\n                }\n              }\n            }\n          }\n          break;\n        }\n        case \"ArrowLeft\": {\n          handled = true;\n          if (activeNode) {\n            const isDisabled = disabledIdsSet.has(activeNode);\n            if (!isDisabled) {\n              if (expandedState.has(activeNode)) {\n                toggleExpanded(event, activeNode);\n              } else {\n                const parent = getParent(activeNode);\n                if (parent) {\n                  newActiveNode = parent;\n                }\n              }\n            }\n          }\n          break;\n        }\n        case \"Home\": {\n          handled = true;\n          newActiveNode = visibleNodes[0];\n          break;\n        }\n        case \"End\": {\n          handled = true;\n          newActiveNode = visibleNodes[visibleNodes.length - 1];\n          break;\n        }\n        case \"Enter\": {\n          handled = true;\n          if (activeNode) {\n            select(event, activeNode);\n          }\n          break;\n        }\n        case \" \": {\n          handled = true;\n          if (activeNode) {\n            select(event, activeNode);\n          }\n          break;\n        }\n        case \"*\": {\n          handled = true;\n          if (activeNode) {\n            const parent = getParent(activeNode);\n            // Get siblings: either children of parent, or root nodes if no parent\n            const siblings = parent\n              ? getChildren(parent)\n              : treeModel.rootValues;\n\n            const toExpand = siblings.filter((sibling) => {\n              const siblingMeta = getNodeMeta(sibling);\n              return (\n                siblingMeta?.hasChildren &&\n                !expandedState.has(sibling) &&\n                !disabledIdsSet.has(sibling)\n              );\n            });\n\n            if (toExpand.length > 0) {\n              const newExpanded = [...expandedArray, ...toExpand];\n              setExpandedArray(newExpanded);\n              onExpandedChange?.(event, newExpanded);\n            }\n          }\n          break;\n        }\n        default: {\n          // Type-ahead\n          if (\n            event.key.length === 1 &&\n            !event.ctrlKey &&\n            !event.metaKey &&\n            !event.altKey\n          ) {\n            handled = true;\n\n            if (keypressTimeoutRef.current) {\n              clearTimeout(keypressTimeoutRef.current);\n            }\n\n            lastKeypressRef.current += event.key.toLowerCase();\n            const searchString = lastKeypressRef.current;\n\n            keypressTimeoutRef.current = setTimeout(() => {\n              lastKeypressRef.current = \"\";\n            }, 500);\n\n            const currentIndex = activeNode\n              ? visibleNodes.indexOf(activeNode)\n              : -1;\n            let found = false;\n\n            for (let i = currentIndex + 1; i < visibleNodes.length; i++) {\n              const element = getElement(visibleNodes[i]);\n              if (\n                element?.textContent?.toLowerCase().startsWith(searchString)\n              ) {\n                newActiveNode = visibleNodes[i];\n                found = true;\n                break;\n              }\n            }\n\n            if (!found) {\n              for (let i = 0; i <= currentIndex; i++) {\n                const element = getElement(visibleNodes[i]);\n                if (\n                  element?.textContent?.toLowerCase().startsWith(searchString)\n                ) {\n                  newActiveNode = visibleNodes[i];\n                  break;\n                }\n              }\n            }\n          }\n          break;\n        }\n      }\n\n      if (\n        (event.ctrlKey || event.metaKey) &&\n        event.key === \"a\" &&\n        multiselect\n      ) {\n        handled = true;\n        event.preventDefault();\n\n        const allVisibleValues = visibleNodes.filter(\n          (visibleNode) => !disabledIdsSet.has(visibleNode),\n        );\n        const allSelected = allVisibleValues.every((visible) =>\n          selectedSet.has(visible),\n        );\n\n        const newSelected = allSelected ? [] : allVisibleValues;\n\n        setSelectedState(newSelected);\n        onSelectionChange?.(event, newSelected);\n        return;\n      }\n\n      if (\n        event.shiftKey &&\n        (event.key === \"ArrowUp\" || event.key === \"ArrowDown\") &&\n        multiselect\n      ) {\n        handled = true;\n        const isDown = event.key === \"ArrowDown\";\n        const currentIndex = activeNode ? visibleNodes.indexOf(activeNode) : -1;\n        const nextIndex = isDown ? currentIndex + 1 : currentIndex - 1;\n\n        if (nextIndex >= 0 && nextIndex < visibleNodes.length) {\n          const nextValue = visibleNodes[nextIndex];\n\n          if (!disabledIdsSet.has(nextValue)) {\n            select(event, nextValue);\n            newActiveNode = nextValue;\n          }\n        }\n      }\n\n      if (handled) {\n        event.preventDefault();\n        event.stopPropagation();\n      }\n\n      if (newActiveNode !== undefined) {\n        const focusResult = focusNode(newActiveNode);\n        if (focusResult !== \"focused\") {\n          setActiveNode(newActiveNode);\n        }\n      }\n    };\n\n    const handleRef = useForkRef(treeRef, ref);\n\n    return (\n      <TreeProvider value={treeState}>\n        <ul\n          ref={handleRef}\n          role=\"tree\"\n          aria-multiselectable={multiselect ? true : undefined}\n          aria-disabled={disabled || undefined}\n          className={clsx(\n            withBaseName(),\n            { [withBaseName(\"disabled\")]: disabled },\n            className,\n          )}\n          onKeyDown={handleKeyDown}\n          onBlur={handleBlur}\n          {...rest}\n        >\n          {children}\n        </ul>\n      </TreeProvider>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","Tree","useWindow","useComponentCssInjection","treeCss","useTree","useRef","useEffect","currentIndex","useForkRef","jsx","TreeProvider","clsx"],"mappings":"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"}

package/dist-cjs/tree/TreeContext.js

@@ -0,0 +1,31 @@
+'use strict';
+
+var core = require('@salt-ds/core');
+var react = require('react');
+
+const TreeContext = core.createContext(
+  "Tree Context",
+  void 0
+);
+const TreeProvider = TreeContext.Provider;
+function useTreeContext() {
+  const context = react.useContext(TreeContext);
+  if (!context) {
+    throw new Error("useTreeContext must be used within a TreeProvider");
+  }
+  return context;
+}
+const TreeNodeContext = core.createContext(
+  "TreeNodeContext",
+  void 0
+);
+const TreeNodeProvider = TreeNodeContext.Provider;
+function useTreeNodeContext() {
+  return react.useContext(TreeNodeContext);
+}
+
+exports.TreeNodeProvider = TreeNodeProvider;
+exports.TreeProvider = TreeProvider;
+exports.useTreeContext = useTreeContext;
+exports.useTreeNodeContext = useTreeNodeContext;
+//# sourceMappingURL=TreeContext.js.map

package/dist-cjs/tree/TreeContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeContext.js","sources":["../src/tree/TreeContext.ts"],"sourcesContent":["import { createContext } from \"@salt-ds/core\";\nimport {\n  type Dispatch,\n  type ReactNode,\n  type SetStateAction,\n  type SyntheticEvent,\n  useContext,\n} from \"react\";\nimport type { TreeModel, TreeNodeMeta } from \"./useTree\";\n\nexport interface TreeContextValue {\n  expandedState: Set<string>;\n  /** Toggle a node expansion state */\n  toggleExpanded: (event: SyntheticEvent, value: string) => void;\n\n  /** Selected node values */\n  selectedState: string[];\n  /** Selected node values as Set for O(1) lookups */\n  selectedSet: Set<string>;\n  /** Set selected state directly */\n  setSelectedState: Dispatch<SetStateAction<string[]>>;\n  /** Select node */\n  select: (event: SyntheticEvent, value: string) => void;\n\n  /** Whether multiselect mode with checkboxes is enabled */\n  multiselect: boolean;\n  /** Disabled state of the tree */\n  disabled: boolean;\n  /** Set of disabled node IDs */\n  disabledIdsSet: Set<string>;\n\n  /** Tree model for traversal */\n  treeModel: TreeModel;\n  /** Get node metadata from tree model */\n  getNodeMeta: (value: string) => TreeNodeMeta | undefined;\n  /** Get parent of a node */\n  getParent: (value: string) => string | undefined;\n  /** Get children of a node */\n  getChildren: (value: string) => string[];\n  /** Get all descendants of a node */\n  getDescendants: (value: string) => string[];\n  /** Get all ancestors of a node */\n  getAncestors: (value: string) => string[];\n  /** Memoized visible (navigable) nodes in tree order */\n  visibleNodes: string[];\n  /** Memoized tabbable node ID for roving tabindex (computed once at tree level) */\n  tabbableNodeId: string | undefined;\n  /** Register a DOM element for focus management */\n  registerElement: (value: string, element: HTMLElement) => () => void;\n  /** Get DOM element for a node (if mounted) */\n  getElement: (value: string) => HTMLElement | undefined;\n  /** Active node value */\n  activeNode: string | undefined;\n  /** Set the active node */\n  setActiveNode: Dispatch<SetStateAction<string | undefined>>;\n\n  /** Set of indeterminate (partially selected) node IDs */\n  indeterminateState: Set<string>;\n}\n\nconst TreeContext = createContext<TreeContextValue | undefined>(\n  \"Tree Context\",\n  undefined,\n);\n\nexport const TreeProvider = TreeContext.Provider;\n\nexport function useTreeContext(): TreeContextValue {\n  const context = useContext(TreeContext);\n  if (!context) {\n    throw new Error(\"useTreeContext must be used within a TreeProvider\");\n  }\n  return context;\n}\n\nexport interface TreeNodeContextValue {\n  /** Current node value */\n  value: string;\n  /** Current depth level */\n  level: number;\n  /** Whether node has children */\n  hasChildren: boolean;\n  /** Whether node is expanded */\n  expanded: boolean;\n  /** Whether node is disabled */\n  disabled: boolean;\n  /** Node id for the li element */\n  id: string;\n  /** Whether node is selected */\n  selected: boolean;\n  /** Whether node is in indeterminate state (partially selected children) */\n  indeterminate: boolean;\n  /** Child TreeNode elements to be rendered inside the group */\n  nodeChildren: ReactNode;\n}\n\nconst TreeNodeContext = createContext<TreeNodeContextValue | undefined>(\n  \"TreeNodeContext\",\n  undefined,\n);\n\nexport const TreeNodeProvider = TreeNodeContext.Provider;\n\nexport function useTreeNodeContext(): TreeNodeContextValue | undefined {\n  return useContext(TreeNodeContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;AA4DA,MAAM,WAAA,GAAcA,kBAAA;AAAA,EAClB,cAAA;AAAA,EACA;AACF,CAAA;AAEO,MAAM,eAAe,WAAA,CAAY;AAEjC,SAAS,cAAA,GAAmC;AACjD,EAAA,MAAM,OAAA,GAAUC,iBAAW,WAAW,CAAA;AACtC,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,MAAM,IAAI,MAAM,mDAAmD,CAAA;AAAA,EACrE;AACA,EAAA,OAAO,OAAA;AACT;AAuBA,MAAM,eAAA,GAAkBD,kBAAA;AAAA,EACtB,iBAAA;AAAA,EACA;AACF,CAAA;AAEO,MAAM,mBAAmB,eAAA,CAAgB;AAEzC,SAAS,kBAAA,GAAuD;AACrE,EAAA,OAAOC,iBAAW,eAAe,CAAA;AACnC;;;;;;;"}

package/dist-cjs/tree/TreeNode.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltTreeNode {\n  list-style: none;\n  position: relative;\n  cursor: var(--salt-cursor-hover);\n}\n\n.saltTreeNode:focus {\n  outline: none;\n}\n\n/* Focus visible styles - applied when keyboard navigation is used */\n.saltTreeNode:focus-visible > .saltTreeNodeTrigger,\n.saltTreeNode-focusVisible > .saltTreeNodeTrigger {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(var(--salt-size-fixed-100) * -2);\n  position: relative;\n  z-index: calc(var(--salt-zIndex-default) + 1);\n}\n\n/* Selected + focus visible */\n.saltTreeNode-selected:focus-visible > .saltTreeNodeTrigger,\n.saltTreeNode-selected.saltTreeNode-focusVisible > .saltTreeNodeTrigger {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(var(--salt-size-fixed-100) * -2);\n  z-index: calc(var(--salt-zIndex-default) + 1);\n}\n\n.saltTreeNode-group {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-spacing-fixed-100);\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  padding-top: var(--salt-spacing-fixed-100);\n}\n\n.saltTreeNode-checkbox {\n  flex-shrink: 0;\n  height: var(--salt-size-selectable);\n}\n\n.saltTreeNode-icon {\n  display: flex;\n  align-items: flex-start;\n  justify-content: center;\n  width: var(--salt-size-selectable);\n  min-width: var(--salt-size-selectable);\n  height: var(--salt-size-selectable);\n  flex-shrink: 0;\n}\n\n.saltTreeNode-icon > * {\n  color: var(--salt-content-primary-foreground);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=TreeNode.css.js.map

package/dist-cjs/tree/TreeNode.css.js.map

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