@rainbow-oh/yee-c 0.6.4 → 0.8.0

package/dist/esm/Tree/tree.js

@@ -1,19 +1,29 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function (_e) { function e(_x) { return _e.apply(this, arguments); } e.toString = function () { return _e.toString(); }; return e; }(function (e) { throw e; }), f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function (_e2) { function e(_x2) { return _e2.apply(this, arguments); } e.toString = function () { return _e2.toString(); }; return e; }(function (e) { didErr = true; err = e; }), f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 import clsx from 'clsx';
-import React, { createContext, useCallback, useContext, useMemo, useRef, useState } from 'react';
+import React, { createContext, useContext, useMemo, useRef, useState } from 'react';
+import { AnimatePresence, motion } from 'motion/react';
 import { GlobalContext } from "../Config-Provider";
+import useEvent from "../hooks/useEvent";
 import useMergedState from "../hooks/useMergedState";
+import useVirtualList from "../hooks/useVirtualList";
 import mergeContextToProps from "../utils/mergeContextToProps";
-import TreeNode from "./tree-node";
+import TreeNodeComp from "./tree-node";
 import { getCheckedKeys, tree2array } from "./utils/tree-tools";
 import "./style/index.less";
 var DEFAULTFIELDNAMES = {
@@ -23,11 +33,12 @@ var DEFAULTFIELDNAMES = {
 };
 export var TreeContext = /*#__PURE__*/createContext({
   showIcon: true,
-  selectedKeys: [],
-  checkedKeys: [],
-  expandedKeys: [],
+  selectedUids: new Set(),
+  checkedUids: new Set(),
+  indeterminateUids: new Set(),
+  expandedUids: new Set(),
   draggable: false,
-  draggingKey: null,
+  draggingUid: null,
   dropState: null,
   onCheck: function onCheck() {},
   onSelect: function onSelect() {},
@@ -37,10 +48,133 @@ export var TreeContext = /*#__PURE__*/createContext({
   onNodeDragLeave: function onNodeDragLeave() {},
   onNodeDrop: function onNodeDrop() {}
 });
+
+// ---------------------------------------------------------------------------
+// Helpers: convert between external user keys and internal uids
+// ---------------------------------------------------------------------------
+
+var EMPTY_ARRAY = [];
+
+/**
+ * Given a list of user-provided keys, find matching uids.
+ * A key may match multiple nodes (non-unique keys), so we return all matches.
+ * Returns an array of uid strings (for use with useMergedState).
+ */
+function keysToUidArray(keys, flatItems) {
+  if (!keys) return undefined;
+  if (keys.length === 0) return EMPTY_ARRAY;
+  var keySet = new Set(keys.map(String));
+  var uids = [];
+  var _iterator = _createForOfIteratorHelper(flatItems),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var item = _step.value;
+      if (keySet.has(String(item.key))) {
+        uids.push(item.uid);
+      }
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  return uids;
+}
+
+/**
+ * Hook that memoizes a uid array derived from external keys.
+ * Only returns a new reference when the actual uid content changes.
+ * This prevents useMergedState from seeing a "new value" every render.
+ */
+function useStableUidArray(keys, flatItems) {
+  var ref = useRef({
+    keys: undefined,
+    result: undefined
+  });
+
+  // Only recompute if external keys reference or flatItems changed
+  var computed = useMemo(function () {
+    return keysToUidArray(keys, flatItems);
+  }, [keys, flatItems]);
+
+  // Stable reference: reuse previous if content is identical
+  if (computed === undefined) {
+    ref.current = {
+      keys: keys,
+      result: undefined
+    };
+    return undefined;
+  }
+  var prev = ref.current.result;
+  if (prev && prev.length === computed.length && prev.every(function (v, i) {
+    return v === computed[i];
+  })) {
+    return prev;
+  }
+  ref.current = {
+    keys: keys,
+    result: computed
+  };
+  return computed;
+}
+
+/**
+ * Convert an array of uids to user keys (for external callbacks).
+ */
+function uidsToKeys(uids, map) {
+  var keys = [];
+  var _iterator2 = _createForOfIteratorHelper(uids),
+    _step2;
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var _uid = _step2.value;
+      var node = map.get(_uid);
+      if (node) keys.push(node.key);
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+  return keys;
+}
+
+/** Build a Set from an array (avoids downlevelIteration issues with Set constructor). */
+function arrayToSet(arr) {
+  var s = new Set();
+  var _iterator3 = _createForOfIteratorHelper(arr),
+    _step3;
+  try {
+    for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+      var item = _step3.value;
+      s.add(item);
+    }
+  } catch (err) {
+    _iterator3.e(err);
+  } finally {
+    _iterator3.f();
+  }
+  return s;
+}
+
+/** Convert a Set to an array (avoids spread/iteration issues). */
+function setToArray(s) {
+  var arr = [];
+  s.forEach(function (v) {
+    return arr.push(v);
+  });
+  return arr;
+}
+
+// ---------------------------------------------------------------------------
+// Tree Component
+// ---------------------------------------------------------------------------
+
 var Tree = function Tree(baseprops) {
   var _useContext = useContext(GlobalContext),
     tree = _useContext.tree;
-  // @ts-expect-error - tree context type may not match TreeProps<T> exactly, mergeContextToProps handles this
+  // @ts-expect-error - tree context type may not match TreeProps<T> exactly
   var props = mergeContextToProps(baseprops, tree);
   var _props$prefixCls = props.prefixCls,
     prefixCls = _props$prefixCls === void 0 ? 'yee-tree' : _props$prefixCls,
@@ -70,191 +204,320 @@ var Tree = function Tree(baseprops) {
     onDrop = props.onDrop,
     onSelect = props.onSelect,
     onCheck = props.onCheck,
-    onExpand = props.onExpand;
-  var _useMergedState = useMergedState([], {
-      value: selectedKeys,
-      defaultValue: defaultSelectedKeys
-    }),
-    _useMergedState2 = _slicedToArray(_useMergedState, 2),
-    mergedSelectedKeys = _useMergedState2[0],
-    setMergedSelectedKeys = _useMergedState2[1];
-  var _useMergedState3 = useMergedState([], {
-      value: checkedKeys,
-      defaultValue: defaultCheckedKeys
-    }),
-    _useMergedState4 = _slicedToArray(_useMergedState3, 2),
-    mergedCheckedKeys = _useMergedState4[0],
-    setMergedCheckedKeys = _useMergedState4[1];
+    onExpand = props.onExpand,
+    _props$virtual = props.virtual,
+    virtual = _props$virtual === void 0 ? false : _props$virtual,
+    height = props.height,
+    _props$itemHeight = props.itemHeight,
+    itemHeight = _props$itemHeight === void 0 ? 28 : _props$itemHeight;
+
+  // ======================== Data ========================
   var _useMemo = useMemo(function () {
       return tree2array(dataSource !== null && dataSource !== void 0 ? dataSource : [], fieldNames);
     }, [dataSource, fieldNames]),
     _useMemo2 = _slicedToArray(_useMemo, 2),
     flatItems = _useMemo2[0],
     itemMap = _useMemo2[1];
-  var allParentKeys = useMemo(function () {
-    var keys = [];
-    flatItems.forEach(function (item) {
-      if (!item.isLeaf) {
-        keys.push(item.key);
+
+  // All parent uids (for defaultExpandAll)
+  var allParentUidArray = useMemo(function () {
+    var uids = [];
+    var _iterator4 = _createForOfIteratorHelper(flatItems),
+      _step4;
+    try {
+      for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
+        var item = _step4.value;
+        if (!item.isLeaf) uids.push(item.uid);
       }
-    });
-    return keys;
+    } catch (err) {
+      _iterator4.e(err);
+    } finally {
+      _iterator4.f();
+    }
+    return uids;
   }, [flatItems]);
-  var _useMergedState5 = useMergedState(function () {
-      return defaultExpandAll ? allParentKeys : [];
+
+  // ==================== State (array-based for useMergedState compatibility) ====================
+  // useMergedState works with arrays (serializable, isEqual-friendly).
+  // We derive Sets via useMemo for O(1) lookups in render/handlers.
+  // useStableUidArray ensures stable references to prevent infinite re-render loops.
+
+  var stableExpandedValue = useStableUidArray(expandedKeys, flatItems);
+  var stableExpandedDefault = useStableUidArray(defaultExpandedKeys, flatItems);
+  var stableSelectedValue = useStableUidArray(selectedKeys, flatItems);
+  var stableSelectedDefault = useStableUidArray(defaultSelectedKeys, flatItems);
+  var stableCheckedValue = useStableUidArray(checkedKeys, flatItems);
+  var stableCheckedDefault = useStableUidArray(defaultCheckedKeys, flatItems);
+
+  // --- Expanded ---
+  var _useMergedState = useMergedState(function () {
+      return defaultExpandAll ? allParentUidArray : [];
     }, {
-      value: expandedKeys,
-      defaultValue: defaultExpandedKeys
+      value: stableExpandedValue,
+      defaultValue: stableExpandedDefault
+    }),
+    _useMergedState2 = _slicedToArray(_useMergedState, 2),
+    expandedUidArray = _useMergedState2[0],
+    setExpandedUidArray = _useMergedState2[1];
+  var expandedUidSet = useMemo(function () {
+    return arrayToSet(expandedUidArray);
+  }, [expandedUidArray]);
+
+  // --- Selected ---
+  var _useMergedState3 = useMergedState([], {
+      value: stableSelectedValue,
+      defaultValue: stableSelectedDefault
+    }),
+    _useMergedState4 = _slicedToArray(_useMergedState3, 2),
+    selectedUidArray = _useMergedState4[0],
+    setSelectedUidArray = _useMergedState4[1];
+  var selectedUidSet = useMemo(function () {
+    return arrayToSet(selectedUidArray);
+  }, [selectedUidArray]);
+
+  // --- Checked ---
+  var _useMergedState5 = useMergedState([], {
+      value: stableCheckedValue,
+      defaultValue: stableCheckedDefault
     }),
     _useMergedState6 = _slicedToArray(_useMergedState5, 2),
-    mergedExpandedKeys = _useMergedState6[0],
-    setMergedExpandedKeys = _useMergedState6[1];
-  var handleCheck = useCallback(function (event) {
-    var key = event.target.value;
+    checkedUidArray = _useMergedState6[0],
+    setCheckedUidArray = _useMergedState6[1];
+  var checkedUidSet = useMemo(function () {
+    return arrayToSet(checkedUidArray);
+  }, [checkedUidArray]);
+
+  // --- Indeterminate (half-select) ---
+  // A non-leaf node is indeterminate if:
+  //   - It is NOT itself checked
+  //   - At least one of its descendants IS checked
+  var indeterminateUidSet = useMemo(function () {
+    var result = new Set();
+    var _iterator5 = _createForOfIteratorHelper(flatItems),
+      _step5;
+    try {
+      for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
+        var item = _step5.value;
+        if (!item.isLeaf && !checkedUidSet.has(item.uid) && item.childUids && item.childUids.some(function (cuid) {
+          return checkedUidSet.has(cuid);
+        })) {
+          result.add(item.uid);
+        }
+      }
+    } catch (err) {
+      _iterator5.e(err);
+    } finally {
+      _iterator5.f();
+    }
+    return result;
+  }, [flatItems, checkedUidSet]);
+
+  // ==================== Visible Items ====================
+  // A node is visible if it's a root OR its parent is both visible and expanded.
+  // flatItems is in pre-order so we can compute in a single forward pass.
+  var visibleItems = useMemo(function () {
+    var visibleSet = new Set();
+    var result = [];
+    var _iterator6 = _createForOfIteratorHelper(flatItems),
+      _step6;
+    try {
+      for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
+        var item = _step6.value;
+        if (item.depth === 0) {
+          visibleSet.add(item.uid);
+          result.push(item);
+        } else if (item.pUid && visibleSet.has(item.pUid) && expandedUidSet.has(item.pUid)) {
+          visibleSet.add(item.uid);
+          result.push(item);
+        }
+      }
+    } catch (err) {
+      _iterator6.e(err);
+    } finally {
+      _iterator6.f();
+    }
+    return result;
+  }, [flatItems, expandedUidSet]);
+
+  // ==================== Handlers ====================
+  // All handlers use useEvent for stable references — they always read
+  // the latest state via closure without being listed as deps.
+
+  var handleCheck = useEvent(function (event, uid) {
     var checked = event.target.checked;
-    var treeNode = itemMap.get(key);
-    var newKeys = getCheckedKeys({
+    var treeNode = itemMap.get(uid);
+    var newUidSet = getCheckedKeys({
       checked: checked,
-      keys: mergedCheckedKeys,
-      key: key,
+      keys: checkedUidSet,
+      uid: uid,
       map: itemMap
     });
-    var nodes = newKeys.map(function (key) {
-      var _itemMap$get;
-      return (_itemMap$get = itemMap.get(key)) === null || _itemMap$get === void 0 ? void 0 : _itemMap$get.original;
-    }).filter(function (node) {
-      return node !== undefined;
-    });
-    setMergedCheckedKeys(newKeys);
-    var originalNode = treeNode === null || treeNode === void 0 ? void 0 : treeNode.original;
-    if (originalNode) {
-      onCheck === null || onCheck === void 0 || onCheck(newKeys, {
+    var newUidArr = setToArray(newUidSet);
+    setCheckedUidArray(newUidArr);
+    if (treeNode && onCheck) {
+      var externalKeys = uidsToKeys(newUidArr, itemMap);
+      var nodes = [];
+      newUidSet.forEach(function (u) {
+        var _itemMap$get;
+        var n = (_itemMap$get = itemMap.get(u)) === null || _itemMap$get === void 0 ? void 0 : _itemMap$get.original;
+        if (n) nodes.push(n);
+      });
+      onCheck(externalKeys, {
         checked: checked,
         checkedNodes: nodes,
-        node: originalNode
+        node: treeNode.original
       });
     }
-  }, [mergedCheckedKeys, itemMap, onCheck]);
-  var handleSelect = useCallback(function (key) {
-    var selected = mergedSelectedKeys.includes(key);
-    var newKeys = multiple ? selected ? _toConsumableArray(mergedSelectedKeys.filter(function (k) {
-      return k !== key;
-    })) : [].concat(_toConsumableArray(mergedSelectedKeys), [key]) : selected ? [] : [key];
-    setMergedSelectedKeys(newKeys);
-    var nodes = newKeys.map(function (k) {
-      var _itemMap$get2;
-      return (_itemMap$get2 = itemMap.get(k)) === null || _itemMap$get2 === void 0 ? void 0 : _itemMap$get2.original;
-    }).filter(function (node) {
-      return node !== undefined;
-    });
-    var treeNode = itemMap.get(key);
-    var originalNode = treeNode === null || treeNode === void 0 ? void 0 : treeNode.original;
-    if (originalNode) {
-      onSelect === null || onSelect === void 0 || onSelect(newKeys, {
+  });
+  var handleSelect = useEvent(function (uid) {
+    var selected = selectedUidSet.has(uid);
+    var newUidArr;
+    if (multiple) {
+      if (selected) {
+        newUidArr = selectedUidArray.filter(function (u) {
+          return u !== uid;
+        });
+      } else {
+        newUidArr = [].concat(_toConsumableArray(selectedUidArray), [uid]);
+      }
+    } else {
+      newUidArr = selected ? [] : [uid];
+    }
+    setSelectedUidArray(newUidArr);
+    var treeNode = itemMap.get(uid);
+    if (treeNode && onSelect) {
+      var externalKeys = uidsToKeys(newUidArr, itemMap);
+      var nodes = [];
+      var _iterator7 = _createForOfIteratorHelper(newUidArr),
+        _step7;
+      try {
+        for (_iterator7.s(); !(_step7 = _iterator7.n()).done;) {
+          var _itemMap$get2;
+          var u = _step7.value;
+          var n = (_itemMap$get2 = itemMap.get(u)) === null || _itemMap$get2 === void 0 ? void 0 : _itemMap$get2.original;
+          if (n) nodes.push(n);
+        }
+      } catch (err) {
+        _iterator7.e(err);
+      } finally {
+        _iterator7.f();
+      }
+      onSelect(externalKeys, {
         selected: !selected,
         selectedNodes: nodes,
-        node: originalNode
+        node: treeNode.original
       });
     }
-  }, [mergedSelectedKeys, itemMap, multiple, onSelect]);
-  var handleExpand = useCallback(function (key) {
-    var expanded = mergedExpandedKeys.includes(key);
-    var newKeys = expanded ? _toConsumableArray(mergedExpandedKeys.filter(function (k) {
-      return k !== key;
-    })) : [].concat(_toConsumableArray(mergedExpandedKeys), [key]);
-    setMergedExpandedKeys(newKeys);
-    var nodes = newKeys.map(function (k) {
-      var _itemMap$get3;
-      return (_itemMap$get3 = itemMap.get(k)) === null || _itemMap$get3 === void 0 ? void 0 : _itemMap$get3.original;
-    }).filter(function (node) {
-      return node !== undefined;
-    });
-    onExpand === null || onExpand === void 0 || onExpand(newKeys, {
-      expanded: !expanded,
-      expandedNodes: nodes,
-      node: nodes
-    });
-  }, [mergedExpandedKeys, itemMap, onExpand]);
+  });
+  var handleExpand = useEvent(function (uid) {
+    var expanded = expandedUidSet.has(uid);
+    var newUidArr = expanded ? expandedUidArray.filter(function (u) {
+      return u !== uid;
+    }) : [].concat(_toConsumableArray(expandedUidArray), [uid]);
+    setExpandedUidArray(newUidArr);
+    if (onExpand) {
+      var externalKeys = uidsToKeys(newUidArr, itemMap);
+      var treeNode = itemMap.get(uid);
+      var nodes = [];
+      var _iterator8 = _createForOfIteratorHelper(newUidArr),
+        _step8;
+      try {
+        for (_iterator8.s(); !(_step8 = _iterator8.n()).done;) {
+          var _itemMap$get3;
+          var u = _step8.value;
+          var n = (_itemMap$get3 = itemMap.get(u)) === null || _itemMap$get3 === void 0 ? void 0 : _itemMap$get3.original;
+          if (n) nodes.push(n);
+        }
+      } catch (err) {
+        _iterator8.e(err);
+      } finally {
+        _iterator8.f();
+      }
+      onExpand(externalKeys, {
+        expanded: !expanded,
+        expandedNodes: nodes,
+        node: treeNode.original
+      });
+    }
+  });
 
-  // --- drag & drop (native HTML5) ---
-  // dataTransfer is not reliably readable during dragover, so the drag key
-  // lives in a ref as the source of truth; a state mirrors it for styling.
-  var dragKeyRef = useRef(null);
+  // --- Drag & Drop ---
+  var dragUidRef = useRef(null);
   var _useState = useState(null),
     _useState2 = _slicedToArray(_useState, 2),
-    draggingKey = _useState2[0],
-    setDraggingKey = _useState2[1];
+    draggingUid = _useState2[0],
+    setDraggingUid = _useState2[1];
   var _useState3 = useState(null),
     _useState4 = _slicedToArray(_useState3, 2),
     dropState = _useState4[0],
     setDropState = _useState4[1];
-
-  // A drop is a cycle/illegal if the target is the dragged node itself or one
-  // of its descendants. Covers before/after/inside uniformly.
-  var isIllegalMove = useCallback(function (dragKey, dropKey) {
-    if (dragKey === dropKey) return true;
-    var dropNode = itemMap.get(dropKey);
-    return !!dropNode && dropNode.path.includes(dragKey);
-  }, [itemMap]);
-  var resolvePosition = useCallback(function (rect, clientY) {
+  var resolvePosition = function resolvePosition(rect, clientY) {
     var offset = (clientY - rect.top) / rect.height;
     if (offset < 0.25) return 'before';
     if (offset > 0.75) return 'after';
     return 'inside';
-  }, []);
-  var handleDragStart = useCallback(function (key, e) {
-    var node = itemMap.get(key);
+  };
+  var isIllegalMove = function isIllegalMove(dragUid, dropUid) {
+    if (dragUid === dropUid) return true;
+    var dropNode = itemMap.get(dropUid);
+    if (!dropNode) return true;
+    var current = dropNode;
+    while (current) {
+      if (current.pUid === dragUid) return true;
+      current = current.pUid ? itemMap.get(current.pUid) : undefined;
+    }
+    return false;
+  };
+  var handleDragStart = useEvent(function (uid, e) {
+    var node = itemMap.get(uid);
     if (node !== null && node !== void 0 && node.disabled) {
       e.preventDefault();
       return;
     }
-    dragKeyRef.current = key;
-    setDraggingKey(key);
+    dragUidRef.current = uid;
+    setDraggingUid(uid);
     if (e.dataTransfer) {
       e.dataTransfer.effectAllowed = 'move';
       try {
-        e.dataTransfer.setData('text/plain', String(key));
+        e.dataTransfer.setData('text/plain', uid);
       } catch (_unused) {
-        /* some browsers throw on setData in certain modes */
+        /* some browsers throw */
       }
     }
-  }, [itemMap]);
-  var handleDragOver = useCallback(function (key, e) {
-    var dragKey = dragKeyRef.current;
-    if (dragKey === null) return;
-    if (isIllegalMove(dragKey, key)) return;
-    var dropNode = itemMap.get(key);
+  });
+  var handleDragOver = useEvent(function (uid, e) {
+    var dragUid = dragUidRef.current;
+    if (dragUid === null) return;
+    if (isIllegalMove(dragUid, uid)) return;
+    var dropNode = itemMap.get(uid);
     if (!dropNode || dropNode.disabled) return;
     var position = resolvePosition(e.currentTarget.getBoundingClientRect(), e.clientY);
-    var dragNode = itemMap.get(dragKey);
+    var dragNode = itemMap.get(dragUid);
     if (allowDrop && dragNode && allowDrop({
       dragNode: dragNode.original,
       dropNode: dropNode.original,
       position: position
     }) === false) {
-      return; // not calling preventDefault shows the "no-drop" cursor
+      return;
     }
     e.preventDefault();
     if (e.dataTransfer) e.dataTransfer.dropEffect = 'move';
     setDropState(function (prev) {
-      return prev && prev.key === key && prev.position === position ? prev : {
-        key: key,
+      return prev && prev.uid === uid && prev.position === position ? prev : {
+        uid: uid,
         position: position
       };
     });
-  }, [itemMap, isIllegalMove, resolvePosition, allowDrop]);
-  var handleDragLeave = useCallback(
-  // Intentionally a no-op: dragleave fires spuriously when crossing child
-  // elements. Drop state is cleared in handleDragEnd at the Tree root.
-  function () {}, []);
-  var handleDrop = useCallback(function (key, e) {
+  });
+  var handleDragLeave = useEvent(function () {});
+  var handleDrop = useEvent(function (uid, e) {
     e.preventDefault();
-    var dragKey = dragKeyRef.current;
-    if (dragKey === null) return;
+    var dragUid = dragUidRef.current;
+    if (dragUid === null) return;
     var position = resolvePosition(e.currentTarget.getBoundingClientRect(), e.clientY);
-    if (isIllegalMove(dragKey, key)) return;
-    var dragNode = itemMap.get(dragKey);
-    var dropNode = itemMap.get(key);
+    if (isIllegalMove(dragUid, uid)) return;
+    var dragNode = itemMap.get(dragUid);
+    var dropNode = itemMap.get(uid);
     if (!dragNode || !dropNode) return;
     if (allowDrop && allowDrop({
       dragNode: dragNode.original,
@@ -266,45 +529,46 @@ var Tree = function Tree(baseprops) {
     onDrop === null || onDrop === void 0 || onDrop({
       dragNode: dragNode.original,
       dropNode: dropNode.original,
-      dragKey: dragKey,
-      dropKey: key,
+      dragKey: dragNode.key,
+      dropKey: dropNode.key,
+      dragPath: [].concat(_toConsumableArray(dragNode.path), [dragNode.key]),
+      dropPath: [].concat(_toConsumableArray(dropNode.path), [dropNode.key]),
       position: position,
       dropToGap: position !== 'inside'
     });
 
-    // Auto-expand the target after a drop-inside so the dragged node is
-    // visible. Only effective in uncontrolled expandedKeys mode.
+    // Auto-expand the target after a drop-inside
     if (position === 'inside') {
-      setMergedExpandedKeys(function (prev) {
-        return prev.includes(key) ? prev : [].concat(_toConsumableArray(prev), [key]);
+      setExpandedUidArray(function (prev) {
+        if (prev.includes(uid)) return prev;
+        return [].concat(_toConsumableArray(prev), [uid]);
       });
     }
-    dragKeyRef.current = null;
-    setDraggingKey(null);
+    dragUidRef.current = null;
+    setDraggingUid(null);
     setDropState(null);
-  }, [itemMap, isIllegalMove, resolvePosition, allowDrop, onDrop]);
-  var handleDragEnd = useCallback(function () {
-    dragKeyRef.current = null;
-    setDraggingKey(null);
+  });
+  var handleDragEnd = useEvent(function () {
+    dragUidRef.current = null;
+    setDraggingUid(null);
     setDropState(null);
-  }, []);
-  return /*#__PURE__*/React.createElement("div", {
-    className: clsx(prefixCls, className),
-    style: style,
-    onDragEnd: handleDragEnd
-  }, /*#__PURE__*/React.createElement(TreeContext.Provider, {
-    value: {
+  });
+
+  // ==================== Context Value (memoized) ====================
+  var contextValue = useMemo(function () {
+    return {
       prefixCls: prefixCls,
       checkable: checkable,
       showIcon: showIcon,
       icon: icon,
       showLine: showLine,
       switcherIcon: switcherIcon,
-      selectedKeys: mergedSelectedKeys,
-      checkedKeys: mergedCheckedKeys,
-      expandedKeys: mergedExpandedKeys,
+      selectedUids: selectedUidSet,
+      checkedUids: checkedUidSet,
+      indeterminateUids: indeterminateUidSet,
+      expandedUids: expandedUidSet,
       draggable: draggable,
-      draggingKey: draggingKey,
+      draggingUid: draggingUid,
       dropState: dropState,
       onCheck: handleCheck,
       onSelect: handleSelect,
@@ -313,12 +577,157 @@ var Tree = function Tree(baseprops) {
       onNodeDragOver: handleDragOver,
       onNodeDragLeave: handleDragLeave,
       onNodeDrop: handleDrop
+    };
+  }, [prefixCls, checkable, showIcon, icon, showLine, switcherIcon, selectedUidSet, checkedUidSet, indeterminateUidSet, expandedUidSet, draggable, draggingUid, dropState,
+  // handlers are stable (useEvent), but listed for correctness
+  handleCheck, handleSelect, handleExpand, handleDragStart, handleDragOver, handleDragLeave, handleDrop]);
+
+  // ==================== Virtual Scroll ====================
+  var useVirtual = virtual && height !== null && height !== undefined;
+  var _useVirtualList = useVirtualList({
+      itemCount: useVirtual ? visibleItems.length : 0,
+      itemHeight: itemHeight,
+      overscan: 4
+    }),
+    start = _useVirtualList.start,
+    end = _useVirtualList.end,
+    offsetY = _useVirtualList.offsetY,
+    totalHeight = _useVirtualList.totalHeight,
+    viewportRef = _useVirtualList.viewportRef,
+    onScroll = _useVirtualList.onScroll;
+
+  // ==================== Render ====================
+  if (useVirtual) {
+    var slicedItems = visibleItems.slice(start, end);
+    return /*#__PURE__*/React.createElement("div", {
+      className: clsx(prefixCls, className),
+      style: style,
+      onDragEnd: handleDragEnd
+    }, /*#__PURE__*/React.createElement(TreeContext.Provider, {
+      value: contextValue
+    }, /*#__PURE__*/React.createElement("div", {
+      ref: viewportRef,
+      onScroll: onScroll,
+      style: {
+        height: height,
+        overflowY: 'auto'
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        height: totalHeight,
+        position: 'relative'
+      }
+    }, slicedItems.map(function (node, i) {
+      return /*#__PURE__*/React.createElement(TreeNodeComp, {
+        node: node,
+        key: node.uid,
+        style: {
+          position: 'absolute',
+          top: 0,
+          left: 0,
+          width: '100%',
+          height: itemHeight,
+          transform: "translateY(".concat(offsetY + i * itemHeight, "px)")
+        }
+      });
+    })))));
+  }
+
+  // ==================== Render (non-virtual) ====================
+  // Group consecutive children of the same parent into segments.
+  // Each group animates as a single unit (one height measurement) rather than
+  // each node individually, drastically reducing layout thrashing.
+
+  var segments = [];
+  var currentGroup = null;
+  var _iterator9 = _createForOfIteratorHelper(visibleItems),
+    _step9;
+  try {
+    for (_iterator9.s(); !(_step9 = _iterator9.n()).done;) {
+      var node = _step9.value;
+      if (node.depth === 0) {
+        // Root nodes are always visible, render directly without animation
+        if (currentGroup) {
+          segments.push(_objectSpread({
+            type: 'group'
+          }, currentGroup));
+          currentGroup = null;
+        }
+        segments.push({
+          type: 'node',
+          node: node
+        });
+      } else {
+        // Non-root: group consecutive children under the same parent
+        if (currentGroup && currentGroup.pUid === node.pUid) {
+          currentGroup.nodes.push(node);
+        } else {
+          if (currentGroup) {
+            segments.push(_objectSpread({
+              type: 'group'
+            }, currentGroup));
+          }
+          currentGroup = {
+            pUid: node.pUid,
+            nodes: [node]
+          };
+        }
+      }
     }
-  }, flatItems.map(function (node, index) {
-    return /*#__PURE__*/React.createElement(TreeNode, {
-      node: node,
-      key: node.key || index
-    });
-  })));
+  } catch (err) {
+    _iterator9.e(err);
+  } finally {
+    _iterator9.f();
+  }
+  if (currentGroup) {
+    segments.push(_objectSpread({
+      type: 'group'
+    }, currentGroup));
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: clsx(prefixCls, className),
+    style: style,
+    onDragEnd: handleDragEnd
+  }, /*#__PURE__*/React.createElement(TreeContext.Provider, {
+    value: contextValue
+  }, /*#__PURE__*/React.createElement(AnimatePresence, {
+    initial: false
+  }, segments.map(function (segment) {
+    if (segment.type === 'node') {
+      return /*#__PURE__*/React.createElement(TreeNodeComp, {
+        node: segment.node,
+        key: segment.node.uid
+      });
+    }
+    // Keep the wrapper mounted throughout native drag operations.
+    // Replacing this tree after dragStart removes the browser's drag
+    // source and cancels the drag before dragOver/drop can fire.
+    return /*#__PURE__*/React.createElement(motion.div, {
+      key: segment.pUid + '\x01children',
+      initial: {
+        height: 0,
+        opacity: 0
+      },
+      animate: {
+        height: 'auto',
+        opacity: 1
+      },
+      exit: {
+        height: 0,
+        opacity: 0
+      },
+      transition: {
+        duration: 0.15
+      },
+      style: {
+        overflow: 'hidden'
+      }
+    }, segment.nodes.map(function (node) {
+      return /*#__PURE__*/React.createElement(TreeNodeComp, {
+        node: node,
+        key: node.uid
+      });
+    }));
+  }))));
 };
 export default Tree;