@qsxy/element-plus-react 1.0.0-next.5 → 1.0.0-next.8

package/dist/Tree/DirectoryTree.js

@@ -33,48 +33,25 @@ __export(DirectoryTree_exports, {
 });
 module.exports = __toCommonJS(DirectoryTree_exports);
 var import_classnames = __toESM(require("classnames"));
-var import_debounce = __toESM(require("lodash/debounce"));
-var import_react = __toESM(require("react"));
-var import_util = require("./util");
-var import_treeUtil = require("./utils/treeUtil");
+var React = __toESM(require("react"));
 var import_Icon = require("../Icon");
 var import_Tree = __toESM(require("./Tree"));
+var import_util = require("./util");
 var import_dictUtil = require("./utils/dictUtil");
-var hasChildren = (props) => {
-  const { eventKey } = props;
-  const {
-    context: { keyEntities }
-  } = props;
-  const { children } = keyEntities[eventKey] || {};
-  return !!(children || []).length;
-};
-var isLeaf = (props) => {
-  const { loaded } = props;
-  const {
-    context: { loadData }
-  } = props;
-  const _hasChildren = hasChildren(props);
-  if (props.isLeaf === false) {
-    return false;
-  }
-  return props.isLeaf || !loadData && !_hasChildren || loadData && loaded && !_hasChildren;
-};
+var import_treeUtil = require("./utils/treeUtil");
 function getIcon(props) {
-  const { expanded } = props;
-  const _isLeaf = isLeaf(props);
-  if (_isLeaf) {
-    return /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, { name: "file-lines", prefix: "far" });
+  const { isLeaf, expanded } = props;
+  if (isLeaf) {
+    return /* @__PURE__ */ React.createElement(import_Icon.Icon, { name: "file-lines", prefix: "far" });
   }
-  return expanded ? /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, { name: "folder-open", prefix: "far" }) : /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, { name: "folder-closed", prefix: "fas" });
+  return expanded ? /* @__PURE__ */ React.createElement(import_Icon.Icon, { name: "folder-open", prefix: "far" }) : /* @__PURE__ */ React.createElement(import_Icon.Icon, { name: "folder-closed", prefix: "fas" });
 }
 function getTreeData({ treeData, children }) {
   return treeData || (0, import_treeUtil.convertTreeToData)(children);
 }
-function InternalDirectoryTree({ defaultExpandAll, defaultExpandParent, defaultExpandedKeys, ...props }, ref) {
-  const lastSelectedKey = (0, import_react.useRef)();
-  const cachedSelectedKeys = (0, import_react.useRef)();
-  const treeRef = (0, import_react.createRef)();
-  (0, import_react.useImperativeHandle)(ref, () => treeRef.current);
+var DirectoryTree = ({ defaultExpandAll, defaultExpandParent, defaultExpandedKeys, ...props }, ref) => {
+  const lastSelectedKey = React.useRef(null);
+  const cachedSelectedKeys = React.useRef(null);
   const getInitExpandedKeys = () => {
     const { keyEntities } = (0, import_treeUtil.convertDataToEntities)(getTreeData(props));
     let initExpandedKeys;
@@ -83,31 +60,22 @@ function InternalDirectoryTree({ defaultExpandAll, defaultExpandParent, defaultE
     } else if (defaultExpandParent) {
       initExpandedKeys = (0, import_util.conductExpandParent)(props.expandedKeys || defaultExpandedKeys || [], keyEntities);
     } else {
-      initExpandedKeys = props.expandedKeys || defaultExpandedKeys;
+      initExpandedKeys = props.expandedKeys || defaultExpandedKeys || [];
     }
     return initExpandedKeys;
   };
-  const [selectedKeys, setSelectedKeys] = (0, import_react.useState)(props.selectedKeys || props.defaultSelectedKeys || []);
-  const [expandedKeys, setExpandedKeys] = (0, import_react.useState)(getInitExpandedKeys());
-  (0, import_react.useEffect)(() => {
+  const [selectedKeys, setSelectedKeys] = React.useState(props.selectedKeys || props.defaultSelectedKeys || []);
+  const [expandedKeys, setExpandedKeys] = React.useState(() => getInitExpandedKeys());
+  React.useEffect(() => {
     if ("selectedKeys" in props) {
       setSelectedKeys(props.selectedKeys);
     }
   }, [props.selectedKeys]);
-  (0, import_react.useEffect)(() => {
+  React.useEffect(() => {
     if ("expandedKeys" in props) {
       setExpandedKeys(props.expandedKeys);
     }
   }, [props.expandedKeys]);
-  const expandFolderNode = (event, node) => {
-    if (node.isLeaf || event.shiftKey || event.metaKey || event.ctrlKey) {
-      return;
-    }
-    treeRef.current.onNodeExpand(event, node);
-  };
-  const onDebounceExpand = (0, import_debounce.default)(expandFolderNode, 200, {
-    leading: true
-  });
   const onExpand = (keys, info) => {
     var _a;
     if (!("expandedKeys" in props)) {
@@ -115,25 +83,9 @@ function InternalDirectoryTree({ defaultExpandAll, defaultExpandParent, defaultE
     }
     return (_a = props.onExpand) == null ? void 0 : _a.call(props, keys, info);
   };
-  const onClick = (event, node) => {
-    var _a;
-    const { expandAction } = props;
-    if (expandAction === "click") {
-      onDebounceExpand(event, node);
-    }
-    (_a = props.onClick) == null ? void 0 : _a.call(props, event, node);
-  };
-  const onDoubleClick = (event, node) => {
-    var _a;
-    const { expandAction } = props;
-    if (expandAction === "doubleClick") {
-      onDebounceExpand(event, node);
-    }
-    (_a = props.onDoubleClick) == null ? void 0 : _a.call(props, event, node);
-  };
   const onSelect = (keys, event) => {
     var _a;
-    const { multiple } = props;
+    const { multiple, fieldNames } = props;
     const { node, nativeEvent } = event;
     const { key = "" } = node;
     const treeData = getTreeData(props);
@@ -149,7 +101,7 @@ function InternalDirectoryTree({ defaultExpandAll, defaultExpandParent, defaultE
       newSelectedKeys = keys;
       lastSelectedKey.current = key;
       cachedSelectedKeys.current = newSelectedKeys;
-      newEvent.selectedNodes = (0, import_dictUtil.convertDirectoryKeysToNodes)(treeData, newSelectedKeys);
+      newEvent.selectedNodes = (0, import_dictUtil.convertDirectoryKeysToNodes)(treeData, newSelectedKeys, fieldNames);
     } else if (multiple && shiftPick) {
       newSelectedKeys = Array.from(
         /* @__PURE__ */ new Set([
@@ -158,47 +110,46 @@ function InternalDirectoryTree({ defaultExpandAll, defaultExpandParent, defaultE
             treeData,
             expandedKeys,
             startKey: key,
-            endKey: lastSelectedKey.current
+            endKey: lastSelectedKey.current,
+            fieldNames
           })
         ])
       );
-      newEvent.selectedNodes = (0, import_dictUtil.convertDirectoryKeysToNodes)(treeData, newSelectedKeys);
+      newEvent.selectedNodes = (0, import_dictUtil.convertDirectoryKeysToNodes)(treeData, newSelectedKeys, fieldNames);
     } else {
       newSelectedKeys = [key];
       lastSelectedKey.current = key;
       cachedSelectedKeys.current = newSelectedKeys;
-      newEvent.selectedNodes = (0, import_dictUtil.convertDirectoryKeysToNodes)(treeData, newSelectedKeys);
+      newEvent.selectedNodes = (0, import_dictUtil.convertDirectoryKeysToNodes)(treeData, newSelectedKeys, fieldNames);
     }
     (_a = props.onSelect) == null ? void 0 : _a.call(props, newSelectedKeys, newEvent);
     if (!("selectedKeys" in props)) {
       setSelectedKeys(newSelectedKeys);
     }
   };
-  const { prefixCls = "r-tree", className, ...otherProps } = props;
+  const { className, showIcon = true, expandAction = "click", ...otherProps } = props;
+  const prefixCls = "el-tree";
   const connectClassName = (0, import_classnames.default)(`${prefixCls}-directory`, className);
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement(
     import_Tree.default,
     {
       icon: getIcon,
-      ref: treeRef,
+      ref,
       blockNode: true,
       ...otherProps,
+      showIcon,
+      expandAction,
       prefixCls,
       className: connectClassName,
       expandedKeys,
       selectedKeys,
       onSelect,
-      onClick,
-      onDoubleClick,
       onExpand
     }
   );
-}
-var ForwardDirectoryTree = (0, import_react.forwardRef)(InternalDirectoryTree);
-var DirectoryTree = ForwardDirectoryTree;
-DirectoryTree.displayName = "DirectoryTree";
-DirectoryTree.defaultProps = {
-  showIcon: true,
-  expandAction: "doubleClick"
 };
-var DirectoryTree_default = DirectoryTree;
+var ForwardDirectoryTree = React.forwardRef(DirectoryTree);
+if (process.env.NODE_ENV !== "production") {
+  ForwardDirectoryTree.displayName = "DirectoryTree";
+}
+var DirectoryTree_default = ForwardDirectoryTree;

package/dist/Tree/DropIndicator.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
-export default function DropIndicator({ dropPosition, dropLevelOffset, indent }: {
+export interface DropIndicatorProps {
     dropPosition: -1 | 0 | 1;
     dropLevelOffset: number;
     indent: number;
-}): React.JSX.Element;
+}
+declare const DropIndicator: React.FC<Readonly<DropIndicatorProps>>;
+export default DropIndicator;

package/dist/Tree/DropIndicator.js

@@ -29,11 +29,12 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/Tree/DropIndicator.tsx
 var DropIndicator_exports = {};
 __export(DropIndicator_exports, {
-  default: () => DropIndicator
+  default: () => DropIndicator_default
 });
 module.exports = __toCommonJS(DropIndicator_exports);
 var import_react = __toESM(require("react"));
-function DropIndicator({ dropPosition, dropLevelOffset, indent }) {
+var DropIndicator = (props) => {
+  const { dropPosition, dropLevelOffset, indent } = props;
   const style = {
     pointerEvents: "none",
     position: "absolute",
@@ -56,4 +57,8 @@ function DropIndicator({ dropPosition, dropLevelOffset, indent }) {
       break;
   }
   return /* @__PURE__ */ import_react.default.createElement("div", { style });
+};
+if (process.env.NODE_ENV !== "production") {
+  DropIndicator.displayName = "DropIndicator";
 }
+var DropIndicator_default = DropIndicator;

package/dist/Tree/Indent.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
+import * as React from 'react';
 interface IndentProps {
     prefixCls: string;
     level: number;
     isStart: boolean[];
     isEnd: boolean[];
 }
-declare const _default: React.MemoExoticComponent<({ prefixCls, level, isStart, isEnd }: IndentProps) => React.JSX.Element>;
+declare const _default: React.NamedExoticComponent<IndentProps>;
 export default _default;

package/dist/Tree/Indent.js

@@ -33,13 +33,13 @@ __export(Indent_exports, {
 });
 module.exports = __toCommonJS(Indent_exports);
 var import_classnames = __toESM(require("classnames"));
-var import_react = __toESM(require("react"));
+var React = __toESM(require("react"));
 var Indent = ({ prefixCls, level, isStart, isEnd }) => {
   const baseClassName = `${prefixCls}-indent-unit`;
   const list = [];
   for (let i = 0; i < level; i += 1) {
     list.push(
-      /* @__PURE__ */ import_react.default.createElement(
+      /* @__PURE__ */ React.createElement(
         "span",
         {
           key: i,
@@ -51,6 +51,6 @@ var Indent = ({ prefixCls, level, isStart, isEnd }) => {
       )
     );
   }
-  return /* @__PURE__ */ import_react.default.createElement("span", { "aria-hidden": "true", className: `${prefixCls}-indent` }, list);
+  return /* @__PURE__ */ React.createElement("span", { "aria-hidden": "true", className: `${prefixCls}-indent` }, list);
 };
-var Indent_default = (0, import_react.memo)(Indent);
+var Indent_default = React.memo(Indent);

package/dist/Tree/MotionTreeNode.d.ts

@@ -1,7 +1,6 @@
-import { FC } from 'react';
-import { TreeNodeProps } from './TreeNode';
-import { FlattenNode } from './typings';
-import { TreeNodeRequiredProps } from './utils/treeUtil';
+import * as React from 'react';
+import type { FlattenNode, TreeNodeProps } from './typings';
+import { type TreeNodeRequiredProps } from './utils/treeUtil';
 interface MotionTreeNodeProps extends Omit<TreeNodeProps, 'domRef'> {
     active: boolean;
     motion?: any;
@@ -11,5 +10,5 @@ interface MotionTreeNodeProps extends Omit<TreeNodeProps, 'domRef'> {
     motionType?: 'show' | 'hide';
     treeNodeRequiredProps: TreeNodeRequiredProps;
 }
-declare const MotionTreeNode: FC<MotionTreeNodeProps>;
+declare const MotionTreeNode: React.ForwardRefExoticComponent<MotionTreeNodeProps & React.RefAttributes<HTMLDivElement>>;
 export default MotionTreeNode;

package/dist/Tree/MotionTreeNode.js

@@ -33,14 +33,17 @@ __export(MotionTreeNode_exports, {
 });
 module.exports = __toCommonJS(MotionTreeNode_exports);
 var import_classnames = __toESM(require("classnames"));
-var import_omit = __toESM(require("lodash/omit"));
-var import_react = __toESM(require("react"));
+var import_rc_util = require("rc-util");
+var import_useLayoutEffect = __toESM(require("rc-util/lib/hooks/useLayoutEffect"));
+var React = __toESM(require("react"));
+var import_react = require("react");
 var import_Transition = require("../Transition");
 var import_TreeNode = __toESM(require("./TreeNode"));
 var import_contextTypes = require("./contextTypes");
+var import_useUnmount = __toESM(require("./useUnmount"));
 var import_treeUtil = require("./utils/treeUtil");
-var MotionTreeNode = (0, import_react.forwardRef)(
-  ({
+var MotionTreeNode = React.forwardRef((oriProps, ref) => {
+  const {
     className,
     style,
     motion,
@@ -51,59 +54,73 @@ var MotionTreeNode = (0, import_react.forwardRef)(
     active,
     treeNodeRequiredProps,
     ...props
-  }, ref) => {
-    const [visible, setVisible] = (0, import_react.useState)(true);
-    const { prefixCls } = (0, import_react.useContext)(import_contextTypes.TreeContext);
-    const motionedRef = (0, import_react.useRef)(false);
-    const onMotionEnd = () => {
-      if (!motionedRef.current) {
-        onOriginMotionEnd();
-      }
-      motionedRef.current = true;
-    };
-    (0, import_react.useEffect)(() => {
-      if (motionNodes && motionType === "hide" && visible) {
-        setVisible(false);
-      }
-    }, [motionNodes]);
-    (0, import_react.useEffect)(() => {
-      if (motionNodes) {
-        onOriginMotionStart();
+  } = oriProps;
+  const [visible, setVisible] = React.useState(true);
+  const { prefixCls } = React.useContext(import_contextTypes.TreeContext);
+  const targetVisible = motionNodes && motionType !== "hide";
+  const motionedRef = (0, import_react.useRef)(false);
+  const containerRef = (0, import_react.useRef)(null);
+  const mergedRef = (0, import_rc_util.useComposeRef)(ref, containerRef);
+  const onMotionEnd = () => {
+    if (!motionedRef.current) {
+      onOriginMotionEnd();
+    }
+    motionedRef.current = true;
+  };
+  (0, import_useLayoutEffect.default)(() => {
+    if (motionNodes) {
+      if (targetVisible !== visible) {
+        setVisible(targetVisible);
       }
-      return () => {
-        if (motionNodes) {
-          onMotionEnd();
-        }
-      };
-    }, []);
+    }
+  }, [motionNodes]);
+  const triggerMotionStart = () => {
     if (motionNodes) {
-      return /* @__PURE__ */ import_react.default.createElement(import_Transition.Transition, { ref, visible, ...motion, transitionAppear: motionType === "show", afterEnter: onMotionEnd, afterLeave: onMotionEnd }, ({ className: motionClassName, style: motionStyle }, motionRef) => /* @__PURE__ */ import_react.default.createElement("div", { ref: motionRef, className: (0, import_classnames.default)(`${prefixCls}-treenode-motion`, motionClassName), style: motionStyle }, motionNodes.map((treeNode) => {
-        const {
-          data: { ...restProps },
+      onOriginMotionStart();
+    }
+  };
+  const triggerMotionEndRef = React.useRef(false);
+  const triggerMotionEnd = () => {
+    if (motionNodes && !triggerMotionEndRef.current) {
+      triggerMotionEndRef.current = true;
+      onOriginMotionEnd();
+    }
+  };
+  (0, import_useUnmount.default)(triggerMotionStart, triggerMotionEnd);
+  const onVisibleChanged = (nextVisible) => {
+    if (targetVisible === nextVisible) {
+      triggerMotionEnd();
+    }
+  };
+  if (motionNodes) {
+    return /* @__PURE__ */ React.createElement(import_Transition.Transition, { nodeRef: containerRef, visible, ...motion, transitionAppear: motionType === "show", afterEnter: onMotionEnd, afterLeave: onMotionEnd }, /* @__PURE__ */ React.createElement("div", { ref: mergedRef, className: (0, import_classnames.default)(`${prefixCls}-treenode-motion`, className), style }, motionNodes.map((treeNode) => {
+      const {
+        data: { ...restProps },
+        title,
+        key,
+        isStart,
+        isEnd
+      } = treeNode;
+      delete restProps.children;
+      const treeNodeProps = (0, import_treeUtil.getTreeNodeProps)(key, treeNodeRequiredProps);
+      return /* @__PURE__ */ React.createElement(
+        import_TreeNode.default,
+        {
+          ...restProps,
+          ...treeNodeProps,
           title,
+          active,
+          data: treeNode.data,
           key,
           isStart,
           isEnd
-        } = treeNode;
-        delete restProps.children;
-        const treeNodeProps = (0, import_treeUtil.getTreeNodeProps)(key, treeNodeRequiredProps);
-        return /* @__PURE__ */ import_react.default.createElement(
-          import_TreeNode.default,
-          {
-            ...(0, import_omit.default)(restProps, "children"),
-            ...treeNodeProps,
-            title,
-            active,
-            data: treeNode.data,
-            key,
-            isStart,
-            isEnd
-          }
-        );
-      })));
-    }
-    return /* @__PURE__ */ import_react.default.createElement(import_TreeNode.default, { domRef: ref, className, style, ...props, active });
+        }
+      );
+    })));
   }
-);
-MotionTreeNode.displayName = "MotionTreeNode";
+  return /* @__PURE__ */ React.createElement(import_TreeNode.default, { domRef: ref, className, style, ...props, active });
+});
+if (process.env.NODE_ENV !== "production") {
+  MotionTreeNode.displayName = "MotionTreeNode";
+}
 var MotionTreeNode_default = MotionTreeNode;

package/dist/Tree/NodeList.d.ts

@@ -1,18 +1,21 @@
-import React, { FC } from 'react';
-import { DataEntity, FlattenNode, Key, ScrollTo } from './typings';
+/**
+ * Handle virtual list of the TreeNodes.
+ */
+import * as React from 'react';
+import type { BasicDataNode, DataEntity, DataNode, FlattenNode, Key, KeyEntities, ScrollTo } from './typings';
 export declare const MOTION_KEY: string;
 export declare const MotionEntity: DataEntity;
 export interface NodeListRef {
     scrollTo: ScrollTo;
     getIndentWidth: () => number;
 }
-interface NodeListProps {
+interface NodeListProps<TreeDataType extends BasicDataNode> {
     prefixCls: string;
     style: React.CSSProperties;
-    data: FlattenNode[];
+    data: FlattenNode<TreeDataType>[];
     motion: any;
     focusable?: boolean;
-    activeItem: FlattenNode;
+    activeItem: FlattenNode<TreeDataType>;
     focused?: boolean;
     tabIndex: number;
     checkable?: boolean;
@@ -24,16 +27,17 @@ interface NodeListProps {
     loadedKeys: Key[];
     loadingKeys: Key[];
     halfCheckedKeys: Key[];
-    keyEntities: Record<Key, DataEntity<any>>;
+    keyEntities: KeyEntities;
     dragging: boolean;
     dragOverNodeKey: Key;
     dropPosition: number;
     height: number;
     itemHeight: number;
     virtual?: boolean;
-    onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;
-    onFocus?: React.FocusEventHandler<HTMLInputElement>;
-    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+    scrollWidth?: number;
+    onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
+    onFocus?: React.FocusEventHandler<HTMLDivElement>;
+    onBlur?: React.FocusEventHandler<HTMLDivElement>;
     onActiveChange: (key: Key) => void;
     onListChangeStart: () => void;
     onListChangeEnd: () => void;
@@ -41,6 +45,6 @@ interface NodeListProps {
 /**
  * We only need get visible content items to play the animation.
  */
-export declare function getMinimumRangeTransitionRange(list: FlattenNode[], virtual: boolean, height: number, itemHeight: number): FlattenNode[];
-declare const NodeList: FC<NodeListProps>;
+export declare function getMinimumRangeTransitionRange(list: FlattenNode[], virtual: boolean, height: number, itemHeight: number): FlattenNode<DataNode>[];
+declare const NodeList: React.ForwardRefExoticComponent<NodeListProps<any> & React.RefAttributes<NodeListRef>>;
 export default NodeList;

package/dist/Tree/NodeList.js

@@ -35,9 +35,9 @@ __export(NodeList_exports, {
   getMinimumRangeTransitionRange: () => getMinimumRangeTransitionRange
 });
 module.exports = __toCommonJS(NodeList_exports);
-var import_react = __toESM(require("react"));
-var import_omit = __toESM(require("lodash/omit"));
-var import_VirtualList = require("../VirtualList");
+var import_useLayoutEffect = __toESM(require("rc-util/lib/hooks/useLayoutEffect"));
+var import_rc_virtual_list = __toESM(require("rc-virtual-list"));
+var React = __toESM(require("react"));
 var import_MotionTreeNode = __toESM(require("./MotionTreeNode"));
 var import_diffUtil = require("./utils/diffUtil");
 var import_treeUtil = require("./utils/treeUtil");
@@ -95,10 +95,11 @@ function getAccessibilityPath(item) {
   }
   return path;
 }
-var NodeList = (0, import_react.forwardRef)((props, ref) => {
+var NodeList = React.forwardRef((props, ref) => {
   const {
     prefixCls,
     data,
+    selectable,
     checkable,
     expandedKeys,
     selectedKeys,
@@ -115,6 +116,7 @@ var NodeList = (0, import_react.forwardRef)((props, ref) => {
     height,
     itemHeight,
     virtual,
+    scrollWidth,
     focusable,
     activeItem,
     focused,
@@ -127,27 +129,30 @@ var NodeList = (0, import_react.forwardRef)((props, ref) => {
     onListChangeEnd,
     ...domProps
   } = props;
-  const listRef = (0, import_react.useRef)(null);
-  const indentMeasurerRef = (0, import_react.useRef)(null);
-  (0, import_react.useImperativeHandle)(ref, () => ({
+  const listRef = React.useRef(null);
+  const indentMeasurerRef = React.useRef(null);
+  React.useImperativeHandle(ref, () => ({
     scrollTo: (scroll) => {
       listRef.current.scrollTo(scroll);
     },
     getIndentWidth: () => indentMeasurerRef.current.offsetWidth
   }));
-  const [prevExpandedKeys, setPrevExpandedKeys] = (0, import_react.useState)(expandedKeys);
-  const [prevData, setPrevData] = (0, import_react.useState)(data);
-  const [transitionData, setTransitionData] = (0, import_react.useState)(data);
-  const [transitionRange, setTransitionRange] = (0, import_react.useState)([]);
-  const [motionType, setMotionType] = (0, import_react.useState)(null);
+  const [prevExpandedKeys, setPrevExpandedKeys] = React.useState(expandedKeys);
+  const [prevData, setPrevData] = React.useState(data);
+  const [transitionData, setTransitionData] = React.useState(data);
+  const [transitionRange, setTransitionRange] = React.useState([]);
+  const [motionType, setMotionType] = React.useState(null);
+  const dataRef = React.useRef(data);
+  dataRef.current = data;
   function onMotionEnd() {
-    setPrevData(data);
-    setTransitionData(data);
+    const latestData = dataRef.current;
+    setPrevData(latestData);
+    setTransitionData(latestData);
     setTransitionRange([]);
     setMotionType(null);
     onListChangeEnd();
   }
-  (0, import_react.useEffect)(() => {
+  (0, import_useLayoutEffect.default)(() => {
     setPrevExpandedKeys(expandedKeys);
     const diffExpanded = (0, import_diffUtil.findExpandedKeys)(prevExpandedKeys, expandedKeys);
     if (diffExpanded.key !== null) {
@@ -173,7 +178,7 @@ var NodeList = (0, import_react.forwardRef)((props, ref) => {
       setTransitionData(data);
     }
   }, [expandedKeys, data]);
-  (0, import_react.useEffect)(() => {
+  React.useEffect(() => {
     if (!dragging) {
       onMotionEnd();
     }
@@ -190,7 +195,7 @@ var NodeList = (0, import_react.forwardRef)((props, ref) => {
     dropPosition,
     keyEntities
   };
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, focused && activeItem && /* @__PURE__ */ import_react.default.createElement("span", { style: HIDDEN_STYLE, "aria-live": "assertive" }, getAccessibilityPath(activeItem)), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, focused && activeItem && /* @__PURE__ */ React.createElement("span", { style: HIDDEN_STYLE, "aria-live": "assertive" }, getAccessibilityPath(activeItem)), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
     "input",
     {
       style: HIDDEN_STYLE,
@@ -203,7 +208,7 @@ var NodeList = (0, import_react.forwardRef)((props, ref) => {
       onChange: noop,
       "aria-label": "for screen reader"
     }
-  )), /* @__PURE__ */ import_react.default.createElement(
+  )), /* @__PURE__ */ React.createElement(
     "div",
     {
       className: `${prefixCls}-treenode`,
@@ -213,12 +218,14 @@ var NodeList = (0, import_react.forwardRef)((props, ref) => {
         pointerEvents: "none",
         visibility: "hidden",
         height: 0,
-        overflow: "hidden"
+        overflow: "hidden",
+        border: 0,
+        padding: 0
       }
     },
-    /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-indent` }, /* @__PURE__ */ import_react.default.createElement("div", { ref: indentMeasurerRef, className: `${prefixCls}-indent-unit` }))
-  ), /* @__PURE__ */ import_react.default.createElement(
-    import_VirtualList.VirtualList,
+    /* @__PURE__ */ React.createElement("div", { className: `${prefixCls}-indent` }, /* @__PURE__ */ React.createElement("div", { ref: indentMeasurerRef, className: `${prefixCls}-indent-unit` }))
+  ), /* @__PURE__ */ React.createElement(
+    import_rc_virtual_list.default,
     {
       ...domProps,
       data: mergedData,
@@ -227,12 +234,12 @@ var NodeList = (0, import_react.forwardRef)((props, ref) => {
       fullHeight: false,
       virtual,
       itemHeight,
+      scrollWidth,
       prefixCls: `${prefixCls}-list`,
       ref: listRef,
-      onVisibleChange: (originList, fullList) => {
-        const originSet = new Set(originList);
-        const restList = fullList.filter((item) => !originSet.has(item));
-        if (restList.some((item) => itemKey(item) === MOTION_KEY)) {
+      role: "tree",
+      onVisibleChange: (originList) => {
+        if (originList.every((item) => itemKey(item) !== MOTION_KEY)) {
           onMotionEnd();
         }
       }
@@ -250,10 +257,10 @@ var NodeList = (0, import_react.forwardRef)((props, ref) => {
       delete restProps.key;
       delete restProps.children;
       const treeNodeProps = (0, import_treeUtil.getTreeNodeProps)(mergedKey, treeNodeRequiredProps);
-      return /* @__PURE__ */ import_react.default.createElement(
+      return /* @__PURE__ */ React.createElement(
         import_MotionTreeNode.default,
         {
-          ...(0, import_omit.default)(restProps, "children"),
+          ...restProps,
           ...treeNodeProps,
           title,
           active: !!activeItem && key === activeItem.key,
@@ -275,7 +282,9 @@ var NodeList = (0, import_react.forwardRef)((props, ref) => {
     }
   ));
 });
-NodeList.displayName = "NodeList";
+if (process.env.NODE_ENV !== "production") {
+  NodeList.displayName = "NodeList";
+}
 var NodeList_default = NodeList;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {