@salt-ds/lab 1.0.0-alpha.93 → 1.0.0-alpha.95

package/dist-es/tree/TreeNodeExpansionIcon.js

@@ -1,60 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { makePrefixer, useIcon } from '@salt-ds/core';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
-import { useTreeNodeContext, useTreeContext } from './TreeContext.js';
-import css_248z from './TreeNodeExpansionIcon.css.js';
-
-const withBaseName = makePrefixer("saltTreeNodeExpansionIcon");
-const TreeNodeExpansionIcon = forwardRef(function TreeNodeExpansionIcon2(props, ref) {
-  const { className, onClick, ...rest } = props;
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "salt-tree-node-expansion-icon",
-    css: css_248z,
-    window: targetWindow
-  });
-  const nodeContext = useTreeNodeContext();
-  if (!nodeContext) {
-    throw new Error("TreeNodeExpansionIcon must be used within a TreeNode");
-  }
-  const { value, hasChildren, expanded, disabled } = nodeContext;
-  const { toggleExpanded } = useTreeContext();
-  const { ExpandGroupIcon, CollapseGroupIcon } = useIcon();
-  const handleClick = (event) => {
-    onClick == null ? void 0 : onClick(event);
-    if (disabled || !hasChildren) return;
-    toggleExpanded(event, value);
-  };
-  if (!hasChildren) {
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        ref,
-        className: clsx(withBaseName(), withBaseName("placeholder"), className),
-        "aria-hidden": true,
-        ...rest
-      }
-    );
-  }
-  const Icon = expanded ? CollapseGroupIcon : ExpandGroupIcon;
-  return (
-    // biome-ignore lint/a11y/useKeyWithClickEvents: keyboard handled at tree level, same as W3C
-    /* @__PURE__ */ jsx(
-      "span",
-      {
-        ref,
-        className: clsx(withBaseName(), className),
-        onClick: handleClick,
-        "aria-hidden": true,
-        ...rest,
-        children: /* @__PURE__ */ jsx(Icon, { className: withBaseName("icon") })
-      }
-    )
-  );
-});
-
-export { TreeNodeExpansionIcon };
-//# sourceMappingURL=TreeNodeExpansionIcon.js.map

package/dist-es/tree/TreeNodeExpansionIcon.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TreeNodeExpansionIcon.js","sources":["../src/tree/TreeNodeExpansionIcon.tsx"],"sourcesContent":["import { makePrefixer, useIcon } 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  forwardRef,\n  type MouseEvent,\n} from \"react\";\nimport { useTreeContext, useTreeNodeContext } from \"./TreeContext\";\nimport treeNodeExpansionIconCss from \"./TreeNodeExpansionIcon.css\";\n\nexport interface TreeNodeExpansionIconProps\n  extends ComponentPropsWithoutRef<\"span\"> {}\n\nconst withBaseName = makePrefixer(\"saltTreeNodeExpansionIcon\");\n\nexport const TreeNodeExpansionIcon = forwardRef<\n  HTMLSpanElement,\n  TreeNodeExpansionIconProps\n>(function TreeNodeExpansionIcon(props, ref) {\n  const { className, onClick, ...rest } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-tree-node-expansion-icon\",\n    css: treeNodeExpansionIconCss,\n    window: targetWindow,\n  });\n\n  const nodeContext = useTreeNodeContext();\n  if (!nodeContext) {\n    throw new Error(\"TreeNodeExpansionIcon must be used within a TreeNode\");\n  }\n\n  const { value, hasChildren, expanded, disabled } = nodeContext;\n  const { toggleExpanded } = useTreeContext();\n  const { ExpandGroupIcon, CollapseGroupIcon } = useIcon();\n\n  const handleClick = (event: MouseEvent<HTMLSpanElement>) => {\n    onClick?.(event);\n    if (disabled || !hasChildren) return;\n    toggleExpanded(event, value);\n  };\n\n  if (!hasChildren) {\n    return (\n      <span\n        ref={ref}\n        className={clsx(withBaseName(), withBaseName(\"placeholder\"), className)}\n        aria-hidden\n        {...rest}\n      />\n    );\n  }\n\n  const Icon = expanded ? CollapseGroupIcon : ExpandGroupIcon;\n\n  return (\n    // biome-ignore lint/a11y/useKeyWithClickEvents: keyboard handled at tree level, same as W3C\n    <span\n      ref={ref}\n      className={clsx(withBaseName(), className)}\n      onClick={handleClick}\n      aria-hidden\n      {...rest}\n    >\n      <Icon className={withBaseName(\"icon\")} />\n    </span>\n  );\n});\n"],"names":["TreeNodeExpansionIcon","treeNodeExpansionIconCss"],"mappings":";;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,2BAA2B,CAAA;AAEtD,MAAM,qBAAA,GAAwB,UAAA,CAGnC,SAASA,sBAAAA,CAAsB,OAAO,GAAA,EAAK;AAC3C,EAAA,MAAM,EAAE,SAAA,EAAW,OAAA,EAAS,GAAG,MAAK,GAAI,KAAA;AAExC,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,+BAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,cAAc,kBAAA,EAAmB;AACvC,EAAA,IAAI,CAAC,WAAA,EAAa;AAChB,IAAA,MAAM,IAAI,MAAM,sDAAsD,CAAA;AAAA,EACxE;AAEA,EAAA,MAAM,EAAE,KAAA,EAAO,WAAA,EAAa,QAAA,EAAU,UAAS,GAAI,WAAA;AACnD,EAAA,MAAM,EAAE,cAAA,EAAe,GAAI,cAAA,EAAe;AAC1C,EAAA,MAAM,EAAE,eAAA,EAAiB,iBAAA,EAAkB,GAAI,OAAA,EAAQ;AAEvD,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAuC;AAC1D,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AACV,IAAA,IAAI,QAAA,IAAY,CAAC,WAAA,EAAa;AAC9B,IAAA,cAAA,CAAe,OAAO,KAAK,CAAA;AAAA,EAC7B,CAAA;AAEA,EAAA,IAAI,CAAC,WAAA,EAAa;AAChB,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,WAAW,IAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,aAAa,GAAG,SAAS,CAAA;AAAA,QACtE,aAAA,EAAW,IAAA;AAAA,QACV,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AAEA,EAAA,MAAM,IAAA,GAAO,WAAW,iBAAA,GAAoB,eAAA;AAE5C,EAAA;AAAA;AAAA,oBAEE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,OAAA,EAAS,WAAA;AAAA,QACT,aAAA,EAAW,IAAA;AAAA,QACV,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,MAAM,CAAA,EAAG;AAAA;AAAA;AACzC;AAEJ,CAAC;;;;"}

package/dist-es/tree/TreeNodeLabel.css.js

@@ -1,4 +0,0 @@
-var css_248z = ".saltTreeNodeLabel {\n  flex: 1;\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n  letter-spacing: var(--salt-text-letterSpacing);\n  word-break: break-word;\n}\n";
-
-export { css_248z as default };
-//# sourceMappingURL=TreeNodeLabel.css.js.map

package/dist-es/tree/TreeNodeLabel.css.js.map

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

package/dist-es/tree/TreeNodeLabel.js

@@ -1,24 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { makePrefixer } from '@salt-ds/core';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
-import css_248z from './TreeNodeLabel.css.js';
-
-const withBaseName = makePrefixer("saltTreeNodeLabel");
-const TreeNodeLabel = forwardRef(
-  function TreeNodeLabel2(props, ref) {
-    const { children, className, ...rest } = props;
-    const targetWindow = useWindow();
-    useComponentCssInjection({
-      testId: "salt-tree-node-label",
-      css: css_248z,
-      window: targetWindow
-    });
-    return /* @__PURE__ */ jsx("span", { ref, className: clsx(withBaseName(), className), ...rest, children });
-  }
-);
-
-export { TreeNodeLabel };
-//# sourceMappingURL=TreeNodeLabel.js.map

package/dist-es/tree/TreeNodeLabel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TreeNodeLabel.js","sources":["../src/tree/TreeNodeLabel.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 ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport treeNodeLabelCss from \"./TreeNodeLabel.css\";\n\nexport interface TreeNodeLabelProps extends ComponentPropsWithoutRef<\"span\"> {}\n\nconst withBaseName = makePrefixer(\"saltTreeNodeLabel\");\n\nexport const TreeNodeLabel = forwardRef<HTMLSpanElement, TreeNodeLabelProps>(\n  function TreeNodeLabel(props, ref) {\n    const { children, className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-tree-node-label\",\n      css: treeNodeLabelCss,\n      window: targetWindow,\n    });\n\n    return (\n      <span ref={ref} className={clsx(withBaseName(), className)} {...rest}>\n        {children}\n      </span>\n    );\n  },\n);\n"],"names":["TreeNodeLabel","treeNodeLabelCss"],"mappings":";;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAE9C,MAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,SAASA,cAAAA,CAAc,KAAA,EAAO,GAAA,EAAK;AACjC,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AAEzC,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACE,GAAA,CAAC,MAAA,EAAA,EAAK,GAAA,EAAU,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA,EAAI,GAAG,IAAA,EAC7D,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;;;;"}

package/dist-es/tree/TreeNodeTrigger.css.js

@@ -1,4 +0,0 @@
-var css_248z = ".saltTreeNodeTrigger {\n  box-sizing: border-box;\n  display: flex;\n  align-items: flex-start;\n  gap: var(--salt-spacing-100);\n  width: 100%;\n\n  padding-top: calc(var(--salt-spacing-75) + var(--salt-spacing-50));\n  padding-bottom: calc(var(--salt-spacing-75) + var(--salt-spacing-50));\n  padding-right: var(--salt-spacing-100);\n  /* Keep a fixed spacing-100 outer left padding for all nodes, then add one\n   indent step per additional level. Each indent step = (icon column width +\n   inter-item gap).\n   Level-1 nodes get no extra indent; level-2 gets 1 step, level-3 gets 2, etc.\n   */\n  --saltTreeNodeTrigger-iconSize: max(var(--salt-size-icon), 12px);\n  --saltTreeNodeTrigger-indentStep: calc(var(--saltTreeNodeTrigger-iconSize) + var(--salt-spacing-100));\n  --saltTreeNodeTrigger-iconOffsetY: calc((var(--salt-text-lineHeight) - var(--saltTreeNodeTrigger-iconSize)) / 2);\n  --saltTreeNodeTrigger-checkboxOffsetY: calc((var(--salt-text-lineHeight) - var(--salt-size-selectable)) / 2);\n  padding-left: calc(var(--salt-spacing-100) + (var(--saltTreeNodeTrigger-indentStep) * (var(--saltTreeNode-level, 1) - 1)));\n  background: var(--salt-selectable-background);\n  color: var(--salt-content-primary-foreground);\n}\n\n/* Account for selectable and icon token size differences */\n.saltTree-multiselect .saltTreeNodeTrigger {\n  --saltTreeNodeTrigger-indentStep: calc(((var(--saltTreeNodeTrigger-iconSize) + var(--salt-size-selectable)) / 2) + var(--salt-spacing-100));\n}\n\n.saltTreeNodeTrigger:hover {\n  background: var(--salt-selectable-background-hover);\n}\n\n.saltTreeNode:focus-visible > .saltTreeNodeTrigger,\n.saltTreeNode-focusVisible > .saltTreeNodeTrigger {\n  background: var(--salt-selectable-background-hover);\n}\n\n.saltTreeNode-selected > .saltTreeNodeTrigger {\n  background: var(--salt-selectable-background-selected);\n  box-shadow:\n    0 calc(var(--salt-size-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected),\n    0 var(--salt-size-fixed-100) 0 0 var(--salt-selectable-borderColor-selected);\n  position: relative;\n  z-index: var(--salt-zIndex-default);\n}\n\n.saltTreeNode-selected:focus-visible > .saltTreeNodeTrigger,\n.saltTreeNode-selected.saltTreeNode-focusVisible > .saltTreeNodeTrigger {\n  background: var(--salt-selectable-background-selected);\n}\n\n.saltTreeNode-disabled > .saltTreeNodeTrigger,\n.saltTreeNode-disabled:hover > .saltTreeNodeTrigger {\n  opacity: 0.4;\n  cursor: var(--salt-cursor-disabled);\n\n  background: var(--salt-selectable-background);\n  color: var(--salt-content-primary-foreground);\n}\n\n.saltTreeNodeTrigger > .saltTreeNode-checkbox {\n  margin-top: var(--saltTreeNodeTrigger-checkboxOffsetY);\n  margin-bottom: 0;\n}\n\n.saltTreeNodeTrigger > .saltTreeNodeExpansionIcon,\n.saltTreeNodeTrigger > .saltTreeNode-icon {\n  margin-top: var(--saltTreeNodeTrigger-iconOffsetY);\n}\n\n.saltTreeNodeTrigger > .saltIcon {\n  margin-top: var(--saltTreeNodeTrigger-iconOffsetY);\n  flex-shrink: 0;\n  color: var(--salt-content-primary-foreground);\n}\n";
-
-export { css_248z as default };
-//# sourceMappingURL=TreeNodeTrigger.css.js.map

package/dist-es/tree/TreeNodeTrigger.css.js.map

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

package/dist-es/tree/TreeNodeTrigger.js

@@ -1,151 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { makePrefixer, useForkRef, CheckboxIcon } from '@salt-ds/core';
-import { useComponentCssInjection } from '@salt-ds/styles';
-import { useWindow } from '@salt-ds/window';
-import { clsx } from 'clsx';
-import { forwardRef, useRef, useState, useEffect } from 'react';
-import { useTreeNodeContext, useTreeContext } from './TreeContext.js';
-import { TreeNodeExpansionIcon } from './TreeNodeExpansionIcon.js';
-import css_248z from './TreeNodeTrigger.css.js';
-
-const withBaseName = makePrefixer("saltTreeNodeTrigger");
-const withNodeBaseName = makePrefixer("saltTreeNode");
-const TreeNodeTrigger = forwardRef(function TreeNodeTrigger2(props, ref) {
-  const {
-    className,
-    children,
-    style,
-    onClick,
-    onFocus,
-    onBlur,
-    onMouseDown,
-    onKeyDown,
-    ...rest
-  } = props;
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "salt-tree-node-trigger",
-    css: css_248z,
-    window: targetWindow
-  });
-  const nodeContext = useTreeNodeContext();
-  if (!nodeContext) {
-    throw new Error("TreeNodeTrigger must be used within a TreeNode");
-  }
-  const {
-    value,
-    level,
-    hasChildren,
-    expanded,
-    disabled,
-    id,
-    nodeRef,
-    setNodeRef,
-    selected,
-    indeterminate,
-    nodeChildren
-  } = nodeContext;
-  const {
-    multiselect,
-    activeNode,
-    setActiveNode,
-    select,
-    tabbableNodeId,
-    registerElement
-  } = useTreeContext();
-  const triggerContentRef = useForkRef(useRef(null), ref);
-  const wasMouseDownRef = useRef(false);
-  const [focusVisible, setFocusVisible] = useState(false);
-  const isActive = activeNode === value;
-  const isTabbable = tabbableNodeId === value;
-  useEffect(() => {
-    if (nodeRef.current) {
-      return registerElement(value, nodeRef.current);
-    }
-  }, [value, registerElement, nodeRef]);
-  const handleClick = (event) => {
-    onClick == null ? void 0 : onClick(event);
-    if (disabled) return;
-    const target = event.target;
-    if (target.closest(".saltTreeNodeExpansionIcon")) return;
-    const nestedTreeItem = target.closest('[role="treeitem"]');
-    if (nestedTreeItem && nestedTreeItem !== nodeRef.current) {
-      return;
-    }
-    setActiveNode(value);
-    select(event, value);
-  };
-  const handleFocus = (event) => {
-    if (event.target !== event.currentTarget) return;
-    onFocus == null ? void 0 : onFocus(event);
-    if (!wasMouseDownRef.current) {
-      setFocusVisible(true);
-    }
-    wasMouseDownRef.current = false;
-    setActiveNode(value);
-  };
-  const handleBlur = (event) => {
-    if (event.target !== event.currentTarget) return;
-    onBlur == null ? void 0 : onBlur(event);
-    setFocusVisible(false);
-  };
-  const handleMouseDown = (event) => {
-    wasMouseDownRef.current = true;
-    onMouseDown == null ? void 0 : onMouseDown(event);
-  };
-  return /* @__PURE__ */ jsxs(
-    "li",
-    {
-      ref: setNodeRef,
-      id,
-      role: "treeitem",
-      "aria-expanded": hasChildren ? expanded : void 0,
-      "aria-selected": multiselect ? void 0 : selected,
-      "aria-checked": multiselect ? indeterminate ? "mixed" : selected : void 0,
-      "aria-level": level,
-      "aria-disabled": disabled || void 0,
-      tabIndex: isTabbable ? 0 : -1,
-      className: clsx(
-        withNodeBaseName(),
-        {
-          [withNodeBaseName("expanded")]: expanded,
-          [withNodeBaseName("selected")]: selected && !multiselect,
-          [withNodeBaseName("active")]: isActive,
-          [withNodeBaseName("disabled")]: disabled,
-          [withNodeBaseName("hasChildren")]: hasChildren,
-          [withNodeBaseName("focusVisible")]: focusVisible
-        },
-        className
-      ),
-      style: {
-        "--saltTreeNode-level": level,
-        ...style
-      },
-      onClick: handleClick,
-      onFocus: handleFocus,
-      onBlur: handleBlur,
-      onMouseDown: handleMouseDown,
-      onKeyDown,
-      ...rest,
-      children: [
-        /* @__PURE__ */ jsxs("span", { ref: triggerContentRef, className: withBaseName(), children: [
-          /* @__PURE__ */ jsx(TreeNodeExpansionIcon, {}),
-          multiselect && /* @__PURE__ */ jsx(
-            CheckboxIcon,
-            {
-              checked: selected,
-              indeterminate,
-              disabled,
-              className: withNodeBaseName("checkbox")
-            }
-          ),
-          children
-        ] }),
-        hasChildren && expanded && /* @__PURE__ */ jsx("ul", { role: "group", className: withNodeBaseName("group"), children: nodeChildren })
-      ]
-    }
-  );
-});
-
-export { TreeNodeTrigger };
-//# sourceMappingURL=TreeNodeTrigger.js.map

package/dist-es/tree/TreeNodeTrigger.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TreeNodeTrigger.js","sources":["../src/tree/TreeNodeTrigger.tsx"],"sourcesContent":["import { CheckboxIcon, 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 CSSProperties,\n  type FocusEvent,\n  forwardRef,\n  type MouseEvent,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useTreeContext, useTreeNodeContext } from \"./TreeContext\";\nimport { TreeNodeExpansionIcon } from \"./TreeNodeExpansionIcon\";\nimport treeNodeTriggerCss from \"./TreeNodeTrigger.css\";\n\nexport interface TreeNodeTriggerProps extends ComponentPropsWithoutRef<\"li\"> {}\n\nconst withBaseName = makePrefixer(\"saltTreeNodeTrigger\");\nconst withNodeBaseName = makePrefixer(\"saltTreeNode\");\n\n/**\n * The forwarded ref points to the inner trigger content span (for tooltip positioning),\n * while the <li> handles focus, ARIA, and event handling.\n */\nexport const TreeNodeTrigger = forwardRef<\n  HTMLSpanElement,\n  TreeNodeTriggerProps\n>(function TreeNodeTrigger(props, ref) {\n  const {\n    className,\n    children,\n    style,\n    onClick,\n    onFocus,\n    onBlur,\n    onMouseDown,\n    onKeyDown,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-tree-node-trigger\",\n    css: treeNodeTriggerCss,\n    window: targetWindow,\n  });\n\n  const nodeContext = useTreeNodeContext();\n  if (!nodeContext) {\n    throw new Error(\"TreeNodeTrigger must be used within a TreeNode\");\n  }\n\n  const {\n    value,\n    level,\n    hasChildren,\n    expanded,\n    disabled,\n    id,\n    nodeRef,\n    setNodeRef,\n    selected,\n    indeterminate,\n    nodeChildren,\n  } = nodeContext;\n\n  const {\n    multiselect,\n    activeNode,\n    setActiveNode,\n    select,\n    tabbableNodeId,\n    registerElement,\n  } = useTreeContext();\n\n  const triggerContentRef = useForkRef(useRef<HTMLSpanElement>(null), ref);\n  const wasMouseDownRef = useRef(false);\n  const [focusVisible, setFocusVisible] = useState(false);\n\n  const isActive = activeNode === value;\n\n  const isTabbable = tabbableNodeId === value;\n\n  useEffect(() => {\n    if (nodeRef.current) {\n      return registerElement(value, nodeRef.current);\n    }\n  }, [value, registerElement, nodeRef]);\n\n  const handleClick = (event: MouseEvent<HTMLLIElement>) => {\n    onClick?.(event);\n    if (disabled) return;\n    const target = event.target as HTMLElement;\n    if (target.closest(\".saltTreeNodeExpansionIcon\")) return;\n    const nestedTreeItem = target.closest('[role=\"treeitem\"]');\n    if (nestedTreeItem && nestedTreeItem !== nodeRef.current) {\n      return;\n    }\n    setActiveNode(value);\n    select(event, value);\n  };\n\n  const handleFocus = (event: FocusEvent<HTMLLIElement>) => {\n    if (event.target !== event.currentTarget) return;\n    onFocus?.(event);\n    if (!wasMouseDownRef.current) {\n      setFocusVisible(true);\n    }\n    wasMouseDownRef.current = false;\n    setActiveNode(value);\n  };\n\n  const handleBlur = (event: FocusEvent<HTMLLIElement>) => {\n    if (event.target !== event.currentTarget) return;\n    onBlur?.(event);\n    setFocusVisible(false);\n  };\n\n  const handleMouseDown = (event: MouseEvent<HTMLLIElement>) => {\n    wasMouseDownRef.current = true;\n    onMouseDown?.(event);\n  };\n\n  return (\n    <li\n      ref={setNodeRef}\n      id={id}\n      role=\"treeitem\"\n      aria-expanded={hasChildren ? expanded : undefined}\n      aria-selected={multiselect ? undefined : selected}\n      aria-checked={\n        multiselect ? (indeterminate ? \"mixed\" : selected) : undefined\n      }\n      aria-level={level}\n      aria-disabled={disabled || undefined}\n      tabIndex={isTabbable ? 0 : -1}\n      className={clsx(\n        withNodeBaseName(),\n        {\n          [withNodeBaseName(\"expanded\")]: expanded,\n          [withNodeBaseName(\"selected\")]: selected && !multiselect,\n          [withNodeBaseName(\"active\")]: isActive,\n          [withNodeBaseName(\"disabled\")]: disabled,\n          [withNodeBaseName(\"hasChildren\")]: hasChildren,\n          [withNodeBaseName(\"focusVisible\")]: focusVisible,\n        },\n        className,\n      )}\n      style={\n        {\n          \"--saltTreeNode-level\": level,\n          ...style,\n        } as CSSProperties\n      }\n      onClick={handleClick}\n      onFocus={handleFocus}\n      onBlur={handleBlur}\n      onMouseDown={handleMouseDown}\n      onKeyDown={onKeyDown}\n      {...rest}\n    >\n      <span ref={triggerContentRef} className={withBaseName()}>\n        <TreeNodeExpansionIcon />\n        {multiselect && (\n          <CheckboxIcon\n            checked={selected}\n            indeterminate={indeterminate}\n            disabled={disabled}\n            className={withNodeBaseName(\"checkbox\")}\n          />\n        )}\n        {children}\n      </span>\n\n      {hasChildren && expanded && (\n        <ul role=\"group\" className={withNodeBaseName(\"group\")}>\n          {nodeChildren}\n        </ul>\n      )}\n    </li>\n  );\n});\n"],"names":["TreeNodeTrigger","treeNodeTriggerCss"],"mappings":"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"}

package/dist-es/tree/treeModel.js

@@ -1,57 +0,0 @@
-import { Children, isValidElement, Fragment } from 'react';
-
-function isFragmentElement(child) {
-  return isValidElement(child) && child.type === Fragment;
-}
-function isTreeNodeElement(child) {
-  return isValidElement(child) && typeof child.props.value === "string";
-}
-function flattenTreeNodeChildren(children) {
-  const flattenedChildren = [];
-  Children.forEach(children, (child) => {
-    if (isFragmentElement(child)) {
-      flattenedChildren.push(...flattenTreeNodeChildren(child.props.children));
-    } else if (child !== null && child !== void 0 && typeof child !== "boolean") {
-      flattenedChildren.push(child);
-    }
-  });
-  return flattenedChildren;
-}
-function getTreeNodeElements(children) {
-  return flattenTreeNodeChildren(children).filter(isTreeNodeElement);
-}
-function buildTreeModel(children) {
-  const nodes = /* @__PURE__ */ new Map();
-  const rootValues = [];
-  const childrenOf = /* @__PURE__ */ new Map();
-  function traverse(reactChildren, parentValue, parentDisabled = false) {
-    const treeNodeChildren = getTreeNodeElements(reactChildren);
-    const siblingValues = [];
-    for (const child of treeNodeChildren) {
-      const value = child.props.value;
-      const childTreeNodes = getTreeNodeElements(child.props.children);
-      const hasChildren = childTreeNodes.length > 0;
-      const disabled = parentDisabled || Boolean(child.props.disabled);
-      nodes.set(value, {
-        value,
-        parentValue,
-        hasChildren,
-        disabled
-      });
-      siblingValues.push(value);
-      if (hasChildren) {
-        traverse(child.props.children, value, disabled);
-      }
-    }
-    if (parentValue !== void 0) {
-      childrenOf.set(parentValue, siblingValues);
-    } else {
-      rootValues.push(...siblingValues);
-    }
-  }
-  traverse(children);
-  return { nodes, rootValues, childrenOf };
-}
-
-export { buildTreeModel, flattenTreeNodeChildren, isTreeNodeElement };
-//# sourceMappingURL=treeModel.js.map

package/dist-es/tree/treeModel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"treeModel.js","sources":["../src/tree/treeModel.ts"],"sourcesContent":["import {\n  Children,\n  Fragment,\n  isValidElement,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\n\nexport interface TreeNodeMeta {\n  value: string;\n  parentValue: string | undefined;\n  hasChildren: boolean;\n  disabled: boolean;\n}\n\nexport interface TreeModel {\n  /** All nodes indexed by value */\n  nodes: Map<string, TreeNodeMeta>;\n  /** Ordered list of root node values */\n  rootValues: string[];\n  /** Maps parent value to ordered list of child values */\n  childrenOf: Map<string, string[]>;\n}\n\ninterface TreeNodeElementProps {\n  value: string;\n  disabled?: boolean;\n  children?: ReactNode;\n}\n\nfunction isFragmentElement(\n  child: ReactNode,\n): child is ReactElement<{ children?: ReactNode }> {\n  return (\n    isValidElement<{ children?: ReactNode }>(child) && child.type === Fragment\n  );\n}\n\nexport function isTreeNodeElement(\n  child: ReactNode,\n): child is ReactElement<TreeNodeElementProps> {\n  return (\n    isValidElement<TreeNodeElementProps>(child) &&\n    typeof child.props.value === \"string\"\n  );\n}\n\nexport function flattenTreeNodeChildren(children: ReactNode): ReactNode[] {\n  const flattenedChildren: ReactNode[] = [];\n\n  Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      flattenedChildren.push(...flattenTreeNodeChildren(child.props.children));\n    } else if (\n      child !== null &&\n      child !== undefined &&\n      typeof child !== \"boolean\"\n    ) {\n      flattenedChildren.push(child);\n    }\n  });\n\n  return flattenedChildren;\n}\n\nfunction getTreeNodeElements(\n  children: ReactNode,\n): ReactElement<TreeNodeElementProps>[] {\n  return flattenTreeNodeChildren(children).filter(isTreeNodeElement);\n}\n\nexport function buildTreeModel(children: ReactNode): TreeModel {\n  const nodes = new Map<string, TreeNodeMeta>();\n  const rootValues: string[] = [];\n  const childrenOf = new Map<string, string[]>();\n\n  function traverse(\n    reactChildren: ReactNode,\n    parentValue?: string,\n    parentDisabled = false,\n  ): void {\n    const treeNodeChildren = getTreeNodeElements(reactChildren);\n    const siblingValues: string[] = [];\n\n    for (const child of treeNodeChildren) {\n      const value = child.props.value;\n      const childTreeNodes = getTreeNodeElements(child.props.children);\n      const hasChildren = childTreeNodes.length > 0;\n      const disabled = parentDisabled || Boolean(child.props.disabled);\n\n      nodes.set(value, {\n        value,\n        parentValue,\n        hasChildren,\n        disabled,\n      });\n\n      siblingValues.push(value);\n\n      if (hasChildren) {\n        traverse(child.props.children, value, disabled);\n      }\n    }\n\n    if (parentValue !== undefined) {\n      childrenOf.set(parentValue, siblingValues);\n    } else {\n      rootValues.push(...siblingValues);\n    }\n  }\n\n  traverse(children);\n\n  return { nodes, rootValues, childrenOf };\n}\n"],"names":[],"mappings":";;AA8BA,SAAS,kBACP,KAAA,EACiD;AACjD,EAAA,OACE,cAAA,CAAyC,KAAK,CAAA,IAAK,KAAA,CAAM,IAAA,KAAS,QAAA;AAEtE;AAEO,SAAS,kBACd,KAAA,EAC6C;AAC7C,EAAA,OACE,eAAqC,KAAK,CAAA,IAC1C,OAAO,KAAA,CAAM,MAAM,KAAA,KAAU,QAAA;AAEjC;AAEO,SAAS,wBAAwB,QAAA,EAAkC;AACxE,EAAA,MAAM,oBAAiC,EAAC;AAExC,EAAA,QAAA,CAAS,OAAA,CAAQ,QAAA,EAAU,CAAC,KAAA,KAAU;AACpC,IAAA,IAAI,iBAAA,CAAkB,KAAK,CAAA,EAAG;AAC5B,MAAA,iBAAA,CAAkB,KAAK,GAAG,uBAAA,CAAwB,KAAA,CAAM,KAAA,CAAM,QAAQ,CAAC,CAAA;AAAA,IACzE,WACE,KAAA,KAAU,IAAA,IACV,UAAU,MAAA,IACV,OAAO,UAAU,SAAA,EACjB;AACA,MAAA,iBAAA,CAAkB,KAAK,KAAK,CAAA;AAAA,IAC9B;AAAA,EACF,CAAC,CAAA;AAED,EAAA,OAAO,iBAAA;AACT;AAEA,SAAS,oBACP,QAAA,EACsC;AACtC,EAAA,OAAO,uBAAA,CAAwB,QAAQ,CAAA,CAAE,MAAA,CAAO,iBAAiB,CAAA;AACnE;AAEO,SAAS,eAAe,QAAA,EAAgC;AAC7D,EAAA,MAAM,KAAA,uBAAY,GAAA,EAA0B;AAC5C,EAAA,MAAM,aAAuB,EAAC;AAC9B,EAAA,MAAM,UAAA,uBAAiB,GAAA,EAAsB;AAE7C,EAAA,SAAS,QAAA,CACP,aAAA,EACA,WAAA,EACA,cAAA,GAAiB,KAAA,EACX;AACN,IAAA,MAAM,gBAAA,GAAmB,oBAAoB,aAAa,CAAA;AAC1D,IAAA,MAAM,gBAA0B,EAAC;AAEjC,IAAA,KAAA,MAAW,SAAS,gBAAA,EAAkB;AACpC,MAAA,MAAM,KAAA,GAAQ,MAAM,KAAA,CAAM,KAAA;AAC1B,MAAA,MAAM,cAAA,GAAiB,mBAAA,CAAoB,KAAA,CAAM,KAAA,CAAM,QAAQ,CAAA;AAC/D,MAAA,MAAM,WAAA,GAAc,eAAe,MAAA,GAAS,CAAA;AAC5C,MAAA,MAAM,QAAA,GAAW,cAAA,IAAkB,OAAA,CAAQ,KAAA,CAAM,MAAM,QAAQ,CAAA;AAE/D,MAAA,KAAA,CAAM,IAAI,KAAA,EAAO;AAAA,QACf,KAAA;AAAA,QACA,WAAA;AAAA,QACA,WAAA;AAAA,QACA;AAAA,OACD,CAAA;AAED,MAAA,aAAA,CAAc,KAAK,KAAK,CAAA;AAExB,MAAA,IAAI,WAAA,EAAa;AACf,QAAA,QAAA,CAAS,KAAA,CAAM,KAAA,CAAM,QAAA,EAAU,KAAA,EAAO,QAAQ,CAAA;AAAA,MAChD;AAAA,IACF;AAEA,IAAA,IAAI,gBAAgB,MAAA,EAAW;AAC7B,MAAA,UAAA,CAAW,GAAA,CAAI,aAAa,aAAa,CAAA;AAAA,IAC3C,CAAA,MAAO;AACL,MAAA,UAAA,CAAW,IAAA,CAAK,GAAG,aAAa,CAAA;AAAA,IAClC;AAAA,EACF;AAEA,EAAA,QAAA,CAAS,QAAQ,CAAA;AAEjB,EAAA,OAAO,EAAE,KAAA,EAAO,UAAA,EAAY,UAAA,EAAW;AACzC;;;;"}