@bigbinary/neeto-atoms 1.0.36 → 1.0.37

package/dist/cjs/{Tree-BPd0DuLh.js → Tree-DAyVPLnJ.js}

@@ -2,7 +2,7 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-var utils$1 = require('./utils-CTr7wn5d.js');
+var utils$1 = require('./utils-BhM0B89p.js');
 var chevronDown = require('./chevron-down-CPsWSS51.js');
 var chevronRight = require('./chevron-right-0jNdwX2Q.js');
 var primitives_Checkbox = require('./primitives/Checkbox.js');
@@ -3536,6 +3536,33 @@ function getGlobalContext() {
   return typeof global !== 'undefined' ? global : window;
 }
 
+/**
+ * A utility for rendering a drag preview image
+ */
+
+React.memo(function DragPreviewImage(_ref) {
+  var connect = _ref.connect,
+      src = _ref.src;
+  React.useEffect(function () {
+    if (typeof Image === 'undefined') return;
+    var connected = false;
+    var img = new Image();
+    img.src = src;
+
+    img.onload = function () {
+      connect(img);
+      connected = true;
+    };
+
+    return function () {
+      if (connected) {
+        connect(null);
+      }
+    };
+  });
+  return null;
+});
+
 function _classCallCheck$a(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties$a(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -7627,359 +7654,525 @@ const TreeContext = React.createContext(null);
 const useTreeContext = () => React.useContext(TreeContext);
 
 const walkTree = (nodes, callback) => {
-    nodes.forEach(node => {
-        callback(node);
-        if (node.children)
-            walkTree(node.children, callback);
-    });
+  nodes.forEach((node) => {
+    callback(node);
+    if (node.children) walkTree(node.children, callback);
+  });
 };
 const findNode = (key, nodes) => {
-    for (const node of nodes) {
-        if (node.key === key)
-            return node;
-        if (node.children) {
-            const found = findNode(key, node.children);
-            if (found)
-                return found;
-        }
+  for (const node of nodes) {
+    if (node.key === key) return node;
+    if (node.children) {
+      const found = findNode(key, node.children);
+      if (found) return found;
     }
-    return undefined;
+  }
+  return void 0;
 };
 const expandedKeysToOpenState = (keys) => keys.reduce((map, key) => {
-    map[key] = true;
-    return map;
+  map[key] = true;
+  return map;
 }, {});
 const getExpandedKeysFromTree = (rootChildren) => {
-    const keys = [];
-    const walk = (nodes) => {
-        nodes.forEach(node => {
-            if (node.isOpen)
-                keys.push(node.id);
-            if (node.children)
-                walk(node.children);
-        });
-    };
-    walk(rootChildren);
-    return keys;
+  const keys = [];
+  const walk = (nodes) => {
+    nodes.forEach((node) => {
+      if (node.isOpen) keys.push(node.id);
+      if (node.children) walk(node.children);
+    });
+  };
+  walk(rootChildren);
+  return keys;
 };
 const countAllNodes = (nodes) => {
-    let count = 0;
-    walkTree(nodes, () => count++);
-    return count;
+  let count = 0;
+  walkTree(nodes, () => count++);
+  return count;
 };
 
-const useTreeExpansion = ({ expandedKeys: controlledKeys, defaultExpandedKeys, autoExpandParent, onExpand, treeRef, }) => {
-    const isControlled = controlledKeys !== undefined;
-    const initialOpenState = React.useMemo(() => expandedKeysToOpenState(controlledKeys ?? defaultExpandedKeys ?? []), []);
-    React.useEffect(() => {
-        if (!isControlled || !treeRef.current)
-            return;
-        const tree = treeRef.current;
-        const desired = new Set(controlledKeys);
-        tree.root.children?.forEach(function syncNode(node) {
-            if (node.isInternal) {
-                if (desired.has(node.id) && !node.isOpen)
-                    node.open();
-                if (!desired.has(node.id) && node.isOpen)
-                    node.close();
-                node.children?.forEach(syncNode);
-            }
-        });
-    }, [controlledKeys, isControlled, treeRef]);
-    const handleToggle = React.useCallback((id) => {
-        if (!onExpand || !treeRef.current)
-            return;
-        const tree = treeRef.current;
-        const node = tree.get(id);
-        if (!node)
-            return;
-        if (autoExpandParent && node.isOpen) {
-            node.openParents();
-        }
-        const keys = getExpandedKeysFromTree(tree.root.children);
-        onExpand(keys, { expanded: node.isOpen, node: node.data });
-    }, [onExpand, autoExpandParent, treeRef]);
-    return { initialOpenState, handleToggle };
+const useTreeExpansion = ({
+  expandedKeys: controlledKeys,
+  defaultExpandedKeys,
+  autoExpandParent,
+  onExpand,
+  treeRef
+}) => {
+  const isControlled = controlledKeys !== void 0;
+  const initialOpenState = React.useMemo(
+    () => expandedKeysToOpenState(controlledKeys ?? defaultExpandedKeys ?? []),
+    []
+  );
+  React.useEffect(() => {
+    if (!isControlled || !treeRef.current) return;
+    const tree = treeRef.current;
+    const desired = new Set(controlledKeys);
+    tree.root.children?.forEach(function syncNode(node) {
+      if (node.isInternal) {
+        if (desired.has(node.id) && !node.isOpen) node.open();
+        if (!desired.has(node.id) && node.isOpen) node.close();
+        node.children?.forEach(syncNode);
+      }
+    });
+  }, [controlledKeys, isControlled, treeRef]);
+  const handleToggle = React.useCallback(
+    (id) => {
+      if (!onExpand || !treeRef.current) return;
+      const tree = treeRef.current;
+      const node = tree.get(id);
+      if (!node) return;
+      if (autoExpandParent && node.isOpen) {
+        node.openParents();
+      }
+      const keys = getExpandedKeysFromTree(
+        tree.root.children
+      );
+      onExpand(keys, { expanded: node.isOpen, node: node.data });
+    },
+    [onExpand, autoExpandParent, treeRef]
+  );
+  return { initialOpenState, handleToggle };
 };
 
-const useTreeSelection = ({ selectedKeys: controlledKeys, defaultSelectedKeys, onSelect, treeRef, selectable, }) => {
-    const isControlled = controlledKeys !== undefined;
-    const didApplyDefaults = React.useRef(false);
-    React.useEffect(() => {
-        if (!treeRef.current)
-            return;
-        if (isControlled) {
-            const tree = treeRef.current;
-            tree.deselectAll();
-            controlledKeys.forEach(key => tree.selectMulti(key));
-        }
-        else if (!didApplyDefaults.current && defaultSelectedKeys?.length) {
-            didApplyDefaults.current = true;
-            const tree = treeRef.current;
-            defaultSelectedKeys.forEach(key => tree.selectMulti(key));
-        }
-    }, [controlledKeys, isControlled, defaultSelectedKeys, treeRef]);
-    const handleSelect = React.useCallback((nodes) => {
-        if (!selectable || !onSelect)
-            return;
-        const lastNode = nodes[nodes.length - 1];
-        if (!lastNode)
-            return;
-        onSelect(nodes.map(n => n.id), { node: lastNode.data });
-    }, [onSelect, selectable]);
-    return { handleSelect };
+const useTreeSelection = ({
+  selectedKeys: controlledKeys,
+  defaultSelectedKeys,
+  onSelect,
+  treeRef,
+  selectable
+}) => {
+  const isControlled = controlledKeys !== void 0;
+  const didApplyDefaults = React.useRef(false);
+  React.useEffect(() => {
+    if (!treeRef.current) return;
+    if (isControlled) {
+      const tree = treeRef.current;
+      tree.deselectAll();
+      controlledKeys.forEach((key) => tree.selectMulti(key));
+    } else if (!didApplyDefaults.current && defaultSelectedKeys?.length) {
+      didApplyDefaults.current = true;
+      const tree = treeRef.current;
+      defaultSelectedKeys.forEach((key) => tree.selectMulti(key));
+    }
+  }, [controlledKeys, isControlled, defaultSelectedKeys, treeRef]);
+  const handleSelect = React.useCallback(
+    (nodes) => {
+      if (!selectable || !onSelect) return;
+      const lastNode = nodes[nodes.length - 1];
+      if (!lastNode) return;
+      onSelect(
+        nodes.map((n) => n.id),
+        { node: lastNode.data }
+      );
+    },
+    [onSelect, selectable]
+  );
+  return { handleSelect };
 };
 
 const getAllDescendantKeys = (node) => {
-    const keys = [];
-    const walk = (n) => {
-        keys.push(n.key);
-        n.children?.forEach(walk);
-    };
-    walk(node);
-    return keys;
+  const keys = [];
+  const walk = (node2) => {
+    keys.push(node2.key);
+    node2.children?.forEach(walk);
+  };
+  walk(node);
+  return keys;
 };
 const computeAncestorStates = (nodes, checked, halfChecked) => {
-    nodes.forEach(node => {
-        if (!node.children?.length)
-            return;
-        computeAncestorStates(node.children, checked, halfChecked);
-        const childKeys = node.children.map(c => c.key);
-        const checkedCount = childKeys.filter(k => checked.has(k)).length;
-        const halfCount = childKeys.filter(k => halfChecked.has(k)).length;
-        if (checkedCount === childKeys.length) {
-            checked.add(node.key);
-            halfChecked.delete(node.key);
-        }
-        else if (checkedCount > 0 || halfCount > 0) {
-            checked.delete(node.key);
-            halfChecked.add(node.key);
-        }
-        else {
-            checked.delete(node.key);
-            halfChecked.delete(node.key);
-        }
-    });
+  nodes.forEach((node) => {
+    if (!node.children?.length) return;
+    computeAncestorStates(node.children, checked, halfChecked);
+    const childKeys = node.children.map((child) => child.key);
+    const checkedCount = childKeys.filter((key) => checked.has(key)).length;
+    const halfCount = childKeys.filter((key) => halfChecked.has(key)).length;
+    if (checkedCount === childKeys.length) {
+      checked.add(node.key);
+      halfChecked.delete(node.key);
+    } else if (checkedCount > 0 || halfCount > 0) {
+      checked.delete(node.key);
+      halfChecked.add(node.key);
+    } else {
+      checked.delete(node.key);
+      halfChecked.delete(node.key);
+    }
+  });
 };
 const toggleCheckCascade = (key, isChecking, treeData, currentChecked) => {
-    const checked = new Set(currentChecked);
-    const halfChecked = new Set();
-    const findAndProcess = (nodes) => {
-        for (const node of nodes) {
-            if (node.key === key) {
-                const descendantKeys = getAllDescendantKeys(node);
-                descendantKeys.forEach(k => isChecking ? checked.add(k) : checked.delete(k));
-                return true;
-            }
-            if (node.children && findAndProcess(node.children))
-                return true;
-        }
-        return false;
-    };
-    findAndProcess(treeData);
-    computeAncestorStates(treeData, checked, halfChecked);
-    return {
-        checked: Array.from(checked),
-        halfChecked: Array.from(halfChecked),
-    };
+  const checked = new Set(currentChecked);
+  const halfChecked = /* @__PURE__ */ new Set();
+  const findAndProcess = (nodes) => {
+    for (const node of nodes) {
+      if (node.key === key) {
+        const descendantKeys = getAllDescendantKeys(node);
+        descendantKeys.forEach(
+          (descendantKey) => isChecking ? checked.add(descendantKey) : checked.delete(descendantKey)
+        );
+        return true;
+      }
+      if (node.children && findAndProcess(node.children)) return true;
+    }
+    return false;
+  };
+  findAndProcess(treeData);
+  computeAncestorStates(treeData, checked, halfChecked);
+  return {
+    checked: Array.from(checked),
+    halfChecked: Array.from(halfChecked)
+  };
 };
 
 const normalizeKeys = (keys) => {
-    if (Array.isArray(keys))
-        return { checked: keys, halfChecked: [] };
-    return keys;
+  if (Array.isArray(keys)) return { checked: keys, halfChecked: [] };
+  return keys;
 };
-const useTreeCheck = ({ checkable, checkedKeys: controlledKeys, defaultCheckedKeys, checkStrictly = false, treeData, onCheck, }) => {
-    const isControlled = controlledKeys !== undefined;
-    const [internalChecked, setInternalChecked] = React.useState(() => new Set(defaultCheckedKeys ?? []));
-    const [internalHalf, setInternalHalf] = React.useState(new Set());
-    const { checkedSet, halfSet } = React.useMemo(() => {
-        if (isControlled) {
-            const { checked, halfChecked } = normalizeKeys(controlledKeys);
-            return { checkedSet: new Set(checked), halfSet: new Set(halfChecked) };
-        }
-        return { checkedSet: internalChecked, halfSet: internalHalf };
-    }, [isControlled, controlledKeys, internalChecked, internalHalf]);
-    const handleCheckToggle = React.useCallback((key) => {
-        if (!checkable)
-            return;
-        const isChecking = !checkedSet.has(key);
-        const node = findNode(key, treeData);
-        if (checkStrictly) {
-            const newChecked = new Set(checkedSet);
-            if (isChecking) {
-                newChecked.add(key);
-            }
-            else {
-                newChecked.delete(key);
-            }
-            if (!isControlled)
-                setInternalChecked(newChecked);
-            onCheck?.(Array.from(newChecked), {
-                checked: isChecking,
-                node: node,
-            });
+const useTreeCheck = ({
+  checkable,
+  checkedKeys: controlledKeys,
+  defaultCheckedKeys,
+  checkStrictly = false,
+  treeData,
+  onCheck
+}) => {
+  const isControlled = controlledKeys !== void 0;
+  const [internalChecked, setInternalChecked] = React.useState(
+    () => new Set(defaultCheckedKeys ?? [])
+  );
+  const [internalHalf, setInternalHalf] = React.useState(/* @__PURE__ */ new Set());
+  const { checkedSet, halfSet } = React.useMemo(() => {
+    if (isControlled) {
+      const { checked, halfChecked } = normalizeKeys(controlledKeys);
+      return { checkedSet: new Set(checked), halfSet: new Set(halfChecked) };
+    }
+    return { checkedSet: internalChecked, halfSet: internalHalf };
+  }, [isControlled, controlledKeys, internalChecked, internalHalf]);
+  const handleCheckToggle = React.useCallback(
+    (key) => {
+      if (!checkable) return;
+      const isChecking = !checkedSet.has(key);
+      const node = findNode(key, treeData);
+      if (checkStrictly) {
+        const newChecked = new Set(checkedSet);
+        if (isChecking) {
+          newChecked.add(key);
+        } else {
+          newChecked.delete(key);
         }
-        else {
-            const result = toggleCheckCascade(key, isChecking, treeData, checkedSet);
-            if (!isControlled) {
-                setInternalChecked(new Set(result.checked));
-                setInternalHalf(new Set(result.halfChecked));
-            }
-            onCheck?.(result, { checked: isChecking, node: node });
+        if (!isControlled) setInternalChecked(newChecked);
+        onCheck?.(Array.from(newChecked), {
+          checked: isChecking,
+          node
+        });
+      } else {
+        const result = toggleCheckCascade(
+          key,
+          isChecking,
+          treeData,
+          checkedSet
+        );
+        if (!isControlled) {
+          setInternalChecked(new Set(result.checked));
+          setInternalHalf(new Set(result.halfChecked));
         }
-    }, [checkable, checkedSet, checkStrictly, treeData, isControlled, onCheck]);
-    return {
-        checkedKeys: checkedSet,
-        halfCheckedKeys: halfSet,
-        handleCheckToggle,
-    };
+        onCheck?.(result, { checked: isChecking, node });
+      }
+    },
+    [checkable, checkedSet, checkStrictly, treeData, isControlled, onCheck]
+  );
+  return {
+    checkedKeys: checkedSet,
+    halfCheckedKeys: halfSet,
+    handleCheckToggle
+  };
 };
 
-const SwitcherIcon = ({ expanded, className }) => expanded ? (jsxRuntime.jsx(chevronDown.ChevronDown, { className: utils$1.cn("size-4 shrink-0", className) })) : (jsxRuntime.jsx(chevronRight.ChevronRight, { className: utils$1.cn("size-4 shrink-0", className) }));
-
-const TreeCheckbox = ({ checked, indeterminate, disabled, onChange, }) => (jsxRuntime.jsx(primitives_Checkbox.Checkbox, { "aria-label": "Select node", checked: indeterminate ? "indeterminate" : checked, className: utils$1.cn("mr-1.5 shrink-0", disabled && "opacity-50"), disabled: disabled, onClick: e => e.stopPropagation(), onCheckedChange: onChange }));
-
-const TreeNode = ({ node, style, dragHandle, }) => {
-    const ctx = useTreeContext();
-    const data = node.data;
-    const isDisabled = ctx.disabled || data.disabled;
-    const isNodeSelectable = ctx.selectable && data.selectable !== false;
-    const isHighlighted = ctx.filterTreeNode?.(data) ?? false;
-    const isLoading = ctx.loadingKeys.has(node.id);
-    const isChecked = ctx.checkedKeys.has(node.id);
-    const isHalfChecked = ctx.halfCheckedKeys.has(node.id);
-    const handleContextMenu = (e) => {
-        if (ctx.onRightClick) {
-            e.preventDefault();
-            ctx.onRightClick({ event: e, node: data });
-        }
-    };
-    const isLeafNode = data.isLeaf || (!ctx.hasLoadData && node.isLeaf);
-    const renderSwitcher = () => {
-        if (isLeafNode) {
-            return jsxRuntime.jsx("span", { className: "inline-block size-4" });
-        }
-        if (isLoading) {
-            return jsxRuntime.jsx(loaderCircle.LoaderCircle, { className: "size-4 shrink-0 animate-spin" });
-        }
-        if (ctx.switcherIcon) {
-            return typeof ctx.switcherIcon === "function"
-                ? ctx.switcherIcon({ expanded: node.isOpen })
-                : ctx.switcherIcon;
-        }
-        return jsxRuntime.jsx(SwitcherIcon, { expanded: node.isOpen });
-    };
-    const renderTitle = () => {
-        if (ctx.titleRender)
-            return ctx.titleRender(data);
-        return jsxRuntime.jsx("span", { className: "truncate", children: data.title });
-    };
-    return (jsxRuntime.jsxs("div", { ref: dragHandle, className: utils$1.cn("group flex items-center gap-1 rounded-sm px-1", "cursor-pointer select-none", node.isSelected && isNodeSelectable && "bg-primary/10", node.isFocused && "ring-ring ring-1 ring-inset", isHighlighted && "text-orange-500", isDisabled && "pointer-events-none opacity-50", ctx.blockNode && "w-full", node.willReceiveDrop && "bg-primary/5"), style: style, onContextMenu: handleContextMenu, children: [ctx.showLine && jsxRuntime.jsx(IndentLines, { indent: ctx.indent, level: node.level }), jsxRuntime.jsx("button", { className: "shrink-0 rounded-sm p-0.5 hover:bg-muted", tabIndex: -1, onClick: e => {
-                    e.stopPropagation();
-                    if (!isDisabled)
-                        node.toggle();
-                }, children: renderSwitcher() }), ctx.checkable && (jsxRuntime.jsx(TreeCheckbox, { checked: isChecked, disabled: !!isDisabled, indeterminate: isHalfChecked, onChange: () => !isDisabled && ctx.onCheckToggle(node.id) })), jsxRuntime.jsx("div", { className: "flex-1 truncate py-1 text-sm", children: renderTitle() })] }));
+const SwitcherIcon = ({ expanded, className }) => expanded ? /* @__PURE__ */ jsxRuntime.jsx(chevronDown.ChevronDown, { className: utils$1.cn("size-4 shrink-0", className) }) : /* @__PURE__ */ jsxRuntime.jsx(chevronRight.ChevronRight, { className: utils$1.cn("size-4 shrink-0", className) });
+
+const TreeCheckbox = ({
+  checked,
+  indeterminate,
+  disabled,
+  onChange
+}) => /* @__PURE__ */ jsxRuntime.jsx(
+  primitives_Checkbox.Checkbox,
+  {
+    "aria-label": "Select node",
+    checked: indeterminate ? "indeterminate" : checked,
+    className: utils$1.cn("mr-1.5 shrink-0", disabled && "opacity-50"),
+    disabled,
+    onClick: (e) => e.stopPropagation(),
+    onCheckedChange: onChange
+  }
+);
+
+const TreeNode = ({
+  node,
+  style,
+  dragHandle
+}) => {
+  const {
+    disabled: contextDisabled,
+    selectable,
+    filterTreeNode,
+    loadingKeys,
+    checkedKeys,
+    halfCheckedKeys,
+    onRightClick,
+    hasLoadData,
+    switcherIcon,
+    titleRender,
+    blockNode,
+    showLine,
+    indent,
+    checkable,
+    onCheckToggle
+  } = useTreeContext();
+  const data = node.data;
+  const isDisabled = contextDisabled || data.disabled;
+  const isNodeSelectable = selectable && data.selectable !== false;
+  const isHighlighted = filterTreeNode?.(data) ?? false;
+  const isLoading = loadingKeys.has(node.id);
+  const isChecked = checkedKeys.has(node.id);
+  const isHalfChecked = halfCheckedKeys.has(node.id);
+  const handleContextMenu = (e) => {
+    if (onRightClick) {
+      e.preventDefault();
+      onRightClick({ event: e, node: data });
+    }
+  };
+  const isLeafNode = data.isLeaf || !hasLoadData && node.isLeaf;
+  const renderSwitcher = () => {
+    if (isLeafNode) {
+      return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-block size-4" });
+    }
+    if (isLoading) {
+      return /* @__PURE__ */ jsxRuntime.jsx(loaderCircle.LoaderCircle, { className: "size-4 shrink-0 animate-spin" });
+    }
+    if (switcherIcon) {
+      return typeof switcherIcon === "function" ? switcherIcon({ expanded: node.isOpen }) : switcherIcon;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(SwitcherIcon, { expanded: node.isOpen });
+  };
+  const renderTitle = () => {
+    if (titleRender) return titleRender(data);
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: data.title });
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref: dragHandle,
+      className: utils$1.cn(
+        "group flex items-center gap-1 rounded-sm px-1",
+        "cursor-pointer select-none",
+        node.isSelected && isNodeSelectable && "bg-primary/10",
+        node.isFocused && "ring-ring ring-1 ring-inset",
+        isHighlighted && "text-orange-500",
+        isDisabled && "pointer-events-none opacity-50",
+        blockNode && "w-full",
+        node.willReceiveDrop && "bg-primary/5"
+      ),
+      style,
+      onContextMenu: handleContextMenu,
+      children: [
+        showLine && /* @__PURE__ */ jsxRuntime.jsx(IndentLines, { indent, level: node.level }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            className: "shrink-0 rounded-sm p-0.5 hover:bg-muted",
+            tabIndex: -1,
+            onClick: (e) => {
+              e.stopPropagation();
+              if (!isDisabled) node.toggle();
+            },
+            children: renderSwitcher()
+          }
+        ),
+        checkable && /* @__PURE__ */ jsxRuntime.jsx(
+          TreeCheckbox,
+          {
+            checked: isChecked,
+            disabled: !!isDisabled,
+            indeterminate: isHalfChecked,
+            onChange: () => !isDisabled && onCheckToggle(node.id)
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 truncate py-1 text-sm", children: renderTitle() })
+      ]
+    }
+  );
 };
-const IndentLines = ({ level, indent }) => (jsxRuntime.jsx(jsxRuntime.Fragment, { children: Array.from({ length: level }, (_, i) => (jsxRuntime.jsx("span", { className: "absolute top-0 bottom-0 border-l border-border", style: { left: `${i * indent + indent / 2}px` } }, i))) }));
-
-const Tree = ({ treeData, selectable = true, selectedKeys, defaultSelectedKeys, multiple = false, onSelect, expandedKeys, defaultExpandedKeys, autoExpandParent = false, onExpand, checkable = false, checkedKeys, defaultCheckedKeys, checkStrictly = false, onCheck, draggable = false, allowDrop = true, onMove, titleRender, renderNode, switcherIcon, filterTreeNode, loadData, loadedKeys, onLoad, showLine = false, blockNode = false, height, virtual = true, disabled = false, onRightClick, className, rowHeight = DEFAULT_ROW_HEIGHT, indent = DEFAULT_INDENT, }) => {
-    const treeRef = React.useRef(undefined);
-    const [loadingKeys, setLoadingKeys] = React.useState(new Set());
-    const loadingKeysRef = React.useRef(loadingKeys);
-    loadingKeysRef.current = loadingKeys;
-    const loadedSet = React.useMemo(() => new Set(loadedKeys ?? []), [loadedKeys]);
-    const { initialOpenState, handleToggle } = useTreeExpansion({
-        expandedKeys,
-        defaultExpandedKeys,
-        autoExpandParent,
-        onExpand,
-        treeRef,
-    });
-    const { handleSelect } = useTreeSelection({
-        selectedKeys,
-        defaultSelectedKeys,
-        onSelect,
-        treeRef,
-        selectable,
-    });
-    const { checkedKeys: checkedSet, halfCheckedKeys: halfSet, handleCheckToggle, } = useTreeCheck({
-        checkable,
-        checkedKeys,
-        defaultCheckedKeys,
-        checkStrictly,
-        treeData,
-        onCheck,
-    });
-    const handleAsyncToggle = React.useCallback((id) => {
-        handleToggle(id);
-        if (!loadData || !treeRef.current)
-            return;
-        const node = treeRef.current.get(id);
-        if (!node?.isOpen || loadedSet.has(id) || loadingKeysRef.current.has(id))
-            return;
-        if (node.data.children?.length)
-            return;
-        setLoadingKeys(prev => new Set([...prev, id]));
-        loadData(node.data)
-            .then(() => {
-            onLoad?.([...loadedSet, id], { node: node.data });
-        })
-            .finally(() => {
-            setLoadingKeys(prev => {
-                const next = new Set(prev);
-                next.delete(id);
-                return next;
-            });
+const IndentLines = ({ level, indent }) => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: Array.from({ length: level }, (_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+  "span",
+  {
+    className: "absolute top-0 bottom-0 border-l border-border",
+    style: { left: `${i * indent + indent / 2}px` }
+  },
+  i
+)) });
+
+const Tree = ({
+  treeData,
+  selectable = true,
+  selectedKeys,
+  defaultSelectedKeys,
+  multiple = false,
+  onSelect,
+  expandedKeys,
+  defaultExpandedKeys,
+  autoExpandParent = false,
+  onExpand,
+  checkable = false,
+  checkedKeys,
+  defaultCheckedKeys,
+  checkStrictly = false,
+  onCheck,
+  draggable = false,
+  allowDrop = true,
+  onMove,
+  titleRender,
+  renderNode,
+  switcherIcon,
+  filterTreeNode,
+  loadData,
+  loadedKeys,
+  onLoad,
+  showLine = false,
+  blockNode = false,
+  height,
+  virtual = true,
+  disabled = false,
+  onRightClick,
+  className,
+  rowHeight = DEFAULT_ROW_HEIGHT,
+  indent = DEFAULT_INDENT
+}) => {
+  const treeRef = React.useRef(void 0);
+  const [loadingKeys, setLoadingKeys] = React.useState(/* @__PURE__ */ new Set());
+  const loadingKeysRef = React.useRef(loadingKeys);
+  loadingKeysRef.current = loadingKeys;
+  const loadedSet = React.useMemo(() => new Set(loadedKeys ?? []), [loadedKeys]);
+  const { initialOpenState, handleToggle } = useTreeExpansion({
+    expandedKeys,
+    defaultExpandedKeys,
+    autoExpandParent,
+    onExpand,
+    treeRef
+  });
+  const { handleSelect } = useTreeSelection({
+    selectedKeys,
+    defaultSelectedKeys,
+    onSelect,
+    treeRef,
+    selectable
+  });
+  const {
+    checkedKeys: checkedSet,
+    halfCheckedKeys: halfSet,
+    handleCheckToggle
+  } = useTreeCheck({
+    checkable,
+    checkedKeys,
+    defaultCheckedKeys,
+    checkStrictly,
+    treeData,
+    onCheck
+  });
+  const handleAsyncToggle = React.useCallback(
+    (id) => {
+      handleToggle(id);
+      if (!loadData || !treeRef.current) return;
+      const node = treeRef.current.get(id);
+      if (!node?.isOpen || loadedSet.has(id) || loadingKeysRef.current.has(id))
+        return;
+      if (node.data.children?.length) return;
+      setLoadingKeys((prev) => /* @__PURE__ */ new Set([...prev, id]));
+      loadData(node.data).then(() => {
+        onLoad?.([...loadedSet, id], { node: node.data });
+      }).finally(() => {
+        setLoadingKeys((prev) => {
+          const next = new Set(prev);
+          next.delete(id);
+          return next;
         });
-    }, [handleToggle, loadData, loadedSet, onLoad]);
-    const resolvedHeight = React.useMemo(() => {
-        if (height)
-            return height;
-        if (!virtual)
-            return countAllNodes(treeData) * rowHeight;
-        return DEFAULT_HEIGHT;
-    }, [height, virtual, treeData, rowHeight]);
-    const ctxValue = React.useMemo(() => ({
-        checkable,
-        checkedKeys: checkedSet,
-        halfCheckedKeys: halfSet,
-        onCheckToggle: handleCheckToggle,
-        titleRender,
-        switcherIcon,
-        filterTreeNode,
-        showLine,
-        blockNode,
-        disabled,
-        selectable,
-        indent,
-        loadingKeys,
-        hasLoadData: !!loadData,
-        onRightClick,
-    }), [
-        checkable,
-        checkedSet,
-        halfSet,
-        handleCheckToggle,
-        titleRender,
-        switcherIcon,
-        filterTreeNode,
-        showLine,
-        blockNode,
-        disabled,
-        selectable,
-        indent,
-        loadData,
-        loadingKeys,
-        onRightClick,
-    ]);
-    return (jsxRuntime.jsx(TreeContext.Provider, { value: ctxValue, children: jsxRuntime.jsx("div", { className: utils$1.cn("neeto-atoms-tree", showLine && "relative", className), children: jsxRuntime.jsx(Tree$1, { ref: el => {
-                    if (el)
-                        treeRef.current = el;
-                }, childrenAccessor: "children", data: treeData, disableDrag: !draggable || disabled, disableDrop: !allowDrop || disabled, disableEdit: true, disableMultiSelection: !multiple, height: resolvedHeight, idAccessor: "key", indent: indent, initialOpenState: initialOpenState, openByDefault: false, rowHeight: rowHeight, selectionFollowsFocus: false, width: "100%", onMove: onMove, onSelect: handleSelect, onToggle: handleAsyncToggle, children: renderNode ?? TreeNode }) }) }));
+      });
+    },
+    [handleToggle, loadData, loadedSet, onLoad]
+  );
+  const resolvedHeight = React.useMemo(() => {
+    if (height) return height;
+    if (!virtual) return countAllNodes(treeData) * rowHeight;
+    return DEFAULT_HEIGHT;
+  }, [height, virtual, treeData, rowHeight]);
+  const ctxValue = React.useMemo(
+    () => ({
+      checkable,
+      checkedKeys: checkedSet,
+      halfCheckedKeys: halfSet,
+      onCheckToggle: handleCheckToggle,
+      titleRender,
+      switcherIcon,
+      filterTreeNode,
+      showLine,
+      blockNode,
+      disabled,
+      selectable,
+      indent,
+      loadingKeys,
+      hasLoadData: !!loadData,
+      onRightClick
+    }),
+    [
+      checkable,
+      checkedSet,
+      halfSet,
+      handleCheckToggle,
+      titleRender,
+      switcherIcon,
+      filterTreeNode,
+      showLine,
+      blockNode,
+      disabled,
+      selectable,
+      indent,
+      loadData,
+      loadingKeys,
+      onRightClick
+    ]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(TreeContext.Provider, { value: ctxValue, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: utils$1.cn("neeto-atoms-tree", showLine && "relative", className),
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        Tree$1,
+        {
+          ref: (el) => {
+            if (el) treeRef.current = el;
+          },
+          childrenAccessor: "children",
+          data: treeData,
+          disableDrag: !draggable || disabled,
+          disableDrop: !allowDrop || disabled,
+          disableEdit: true,
+          disableMultiSelection: !multiple,
+          height: resolvedHeight,
+          idAccessor: "key",
+          indent,
+          initialOpenState,
+          openByDefault: false,
+          rowHeight,
+          selectionFollowsFocus: false,
+          width: "100%",
+          onMove,
+          onSelect: handleSelect,
+          onToggle: handleAsyncToggle,
+          children: renderNode ?? TreeNode
+        }
+      )
+    }
+  ) });
 };
 
 exports.Tree = Tree;
 exports.findNode = findNode;
 exports.walkTree = walkTree;
-//# sourceMappingURL=Tree-BPd0DuLh.js.map
+//# sourceMappingURL=Tree-DAyVPLnJ.js.map