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

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 = {

package/dist/Tree/RCTree.d.ts

@@ -1,11 +1,11 @@
-import React, { Component } from 'react';
-import DropIndicator from './DropIndicator';
-import { NodeListRef } from './NodeList';
+import * as React from 'react';
+import { DropIndicatorProps } from './DropIndicator';
+import { type NodeListRef } from './NodeList';
 import { NodeDragEventHandler, NodeDragEventParams, NodeMouseEventHandler, NodeMouseEventParams } from './contextTypes';
-import { BasicDataNode, DataEntity, DataNode, Direction, EventDataNode, FieldNames, FlattenNode, IconType, Key, NodeInstance, ScrollTo } from './typings';
+import type { BasicDataNode, DataNode, Direction, EventDataNode, FieldNames, FlattenNode, IconType, Key, KeyEntities, SafeKey, ScrollTo, TreeNodeProps } from './typings';
 export interface CheckInfo<TreeDataType extends BasicDataNode = DataNode> {
     event: 'check';
-    node: EventDataNode;
+    node: EventDataNode<TreeDataType>;
     checked: boolean;
     nativeEvent: MouseEvent;
     checkedNodes: TreeDataType[];
@@ -23,26 +23,31 @@ export interface AllowDropOptions<TreeDataType extends BasicDataNode = DataNode>
 export type AllowDrop<TreeDataType extends BasicDataNode = DataNode> = (options: AllowDropOptions<TreeDataType>) => boolean;
 export type DraggableFn = (node: DataNode) => boolean;
 export type DraggableConfig = {
-    icon?: React.ReactElement | false;
+    icon?: React.ReactNode | false;
     nodeDraggable?: DraggableFn;
 };
+export type ExpandAction = false | 'click' | 'doubleClick';
+export type SemanticName = 'itemIcon' | 'item' | 'itemTitle';
 export interface TreeProps<TreeDataType extends BasicDataNode = DataNode> {
-    prefixCls?: string;
+    prefixCls: string;
     className?: string;
     style?: React.CSSProperties;
+    styles?: Partial<Record<SemanticName, React.CSSProperties>>;
+    classNames?: Partial<Record<SemanticName, string>>;
     focusable?: boolean;
-    activeKey?: Key;
+    activeKey?: Key | null;
     tabIndex?: number;
-    children?: React.ReactElement;
+    children?: React.ReactNode;
     treeData?: TreeDataType[];
     fieldNames?: FieldNames;
     showLine?: boolean;
     showIcon?: boolean;
     icon?: IconType;
     selectable?: boolean;
+    expandAction?: ExpandAction;
     disabled?: boolean;
     multiple?: boolean;
-    checkable?: boolean | React.ReactElement;
+    checkable?: boolean | React.ReactNode;
     checkStrictly?: boolean;
     draggable?: DraggableFn | boolean | DraggableConfig;
     defaultExpandParent?: boolean;
@@ -58,23 +63,17 @@ export interface TreeProps<TreeDataType extends BasicDataNode = DataNode> {
     defaultSelectedKeys?: Key[];
     selectedKeys?: Key[];
     allowDrop?: AllowDrop<TreeDataType>;
-    titleRender?: (node: TreeDataType) => React.ReactElement | string;
-    dropIndicatorRender?: (props: {
-        dropPosition: -1 | 0 | 1;
-        dropLevelOffset: number;
-        indent: number;
-        prefixCls: string;
-        direction: Direction;
-    }) => React.ReactElement;
+    titleRender?: (node: TreeDataType) => React.ReactNode;
+    dropIndicatorRender?: (props: DropIndicatorProps) => React.ReactNode;
     onFocus?: React.FocusEventHandler<HTMLDivElement>;
     onBlur?: React.FocusEventHandler<HTMLDivElement>;
     onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
-    onContextMenu?: React.MouseEvent<HTMLDivElement>;
-    onClick?: NodeMouseEventHandler;
-    onDoubleClick?: NodeMouseEventHandler;
+    onContextMenu?: React.MouseEventHandler<HTMLDivElement>;
+    onClick?: NodeMouseEventHandler<TreeDataType>;
+    onDoubleClick?: NodeMouseEventHandler<TreeDataType>;
     onScroll?: React.UIEventHandler<HTMLElement>;
     onExpand?: (expandedKeys: Key[], info: {
-        node: EventDataNode;
+        node: EventDataNode<TreeDataType>;
         expanded: boolean;
         nativeEvent: MouseEvent;
     }) => void;
@@ -85,31 +84,31 @@ export interface TreeProps<TreeDataType extends BasicDataNode = DataNode> {
     onSelect?: (selectedKeys: Key[], info: {
         event: 'select';
         selected: boolean;
-        node: EventDataNode;
+        node: EventDataNode<TreeDataType>;
         selectedNodes: TreeDataType[];
         nativeEvent: MouseEvent;
     }) => void;
     onLoad?: (loadedKeys: Key[], info: {
         event: 'load';
-        node: EventDataNode;
+        node: EventDataNode<TreeDataType>;
     }) => void;
-    loadData?: (treeNode: EventDataNode) => Promise<void>;
+    loadData?: (treeNode: EventDataNode<TreeDataType>) => Promise<any>;
     loadedKeys?: Key[];
-    onMouseEnter?: (info: NodeMouseEventParams) => void;
-    onMouseLeave?: (info: NodeMouseEventParams) => void;
+    onMouseEnter?: (info: NodeMouseEventParams<TreeDataType>) => void;
+    onMouseLeave?: (info: NodeMouseEventParams<TreeDataType>) => void;
     onRightClick?: (info: {
         event: React.MouseEvent;
-        node: EventDataNode;
+        node: EventDataNode<TreeDataType>;
     }) => void;
-    onDragStart?: (info: NodeDragEventParams) => void;
-    onDragEnter?: (info: NodeDragEventParams & {
+    onDragStart?: (info: NodeDragEventParams<TreeDataType>) => void;
+    onDragEnter?: (info: NodeDragEventParams<TreeDataType> & {
         expandedKeys: Key[];
     }) => void;
-    onDragOver?: (info: NodeDragEventParams) => void;
-    onDragLeave?: (info: NodeDragEventParams) => void;
-    onDragEnd?: (info: NodeDragEventParams) => void;
-    onDrop?: (info: NodeDragEventParams & {
-        dragNode: EventDataNode;
+    onDragOver?: (info: NodeDragEventParams<TreeDataType>) => void;
+    onDragLeave?: (info: NodeDragEventParams<TreeDataType>) => void;
+    onDragEnd?: (info: NodeDragEventParams<TreeDataType>) => void;
+    onDrop?: (info: NodeDragEventParams<TreeDataType> & {
+        dragNode: EventDataNode<TreeDataType>;
         dragNodesKeys: Key[];
         dropPosition: number;
         dropToGap: boolean;
@@ -119,18 +118,20 @@ export interface TreeProps<TreeDataType extends BasicDataNode = DataNode> {
      * Do not use in your production code directly since this will be refactor.
      */
     onActiveChange?: (key: Key) => void;
-    filterTreeNode?: (treeNode: EventDataNode) => boolean;
+    filterTreeNode?: (treeNode: EventDataNode<TreeDataType>) => boolean;
     motion?: any;
     switcherIcon?: IconType;
     height?: number;
     itemHeight?: number;
+    scrollWidth?: number;
+    itemScrollOffset?: number;
     virtual?: boolean;
     direction?: Direction;
     rootClassName?: string;
     rootStyle?: React.CSSProperties;
 }
 interface TreeState<TreeDataType extends BasicDataNode = DataNode> {
-    keyEntities: Record<Key, DataEntity<TreeDataType>>;
+    keyEntities: KeyEntities<TreeDataType>;
     indent: number | null;
     selectedKeys: Key[];
     checkedKeys: Key[];
@@ -147,15 +148,15 @@ interface TreeState<TreeDataType extends BasicDataNode = DataNode> {
     dropTargetPos: string | null;
     dropAllowed: boolean;
     dragOverNodeKey: Key | null;
-    treeData: DataNode[];
-    flattenNodes: FlattenNode[];
+    treeData: TreeDataType[];
+    flattenNodes: FlattenNode<TreeDataType>[];
     focused: boolean;
-    activeKey: Key;
+    activeKey: Key | null;
     listChanging: boolean;
     prevProps: TreeProps;
     fieldNames: FieldNames;
 }
-declare class RCTree<TreeDataType extends BasicDataNode = DataNode> extends Component<TreeProps<TreeDataType>, TreeState<TreeDataType>> {
+declare class Tree<TreeDataType extends DataNode | BasicDataNode = DataNode> extends React.Component<TreeProps<TreeDataType>, TreeState<TreeDataType>> {
     static defaultProps: {
         prefixCls: string;
         showLine: boolean;
@@ -172,24 +173,25 @@ declare class RCTree<TreeDataType extends BasicDataNode = DataNode> extends Comp
         defaultExpandedKeys: any[];
         defaultCheckedKeys: any[];
         defaultSelectedKeys: any[];
-        dropIndicatorRender: typeof DropIndicator;
+        dropIndicatorRender: React.FC<Readonly<DropIndicatorProps>>;
         allowDrop: () => boolean;
+        expandAction: boolean;
     };
-    static TreeNode: React.FC<import("./TreeNode").TreeNodeProps<DataNode<any>>>;
+    static TreeNode: React.FC<Readonly<TreeNodeProps<DataNode>>>;
     destroyed: boolean;
-    delayedDragEnterLogic: Record<Key, number>;
-    loadingRetryTimes: Record<Key, number>;
+    delayedDragEnterLogic: Record<SafeKey, number>;
+    loadingRetryTimes: Record<SafeKey, number>;
     state: TreeState<TreeDataType>;
     dragStartMousePosition: any;
-    dragNode: NodeInstance<TreeDataType>;
+    dragNodeProps: TreeNodeProps<TreeDataType>;
     currentMouseOverDroppableNodeKey: any;
     listRef: React.RefObject<NodeListRef>;
     componentDidMount(): void;
     componentDidUpdate(): void;
     onUpdated(): void;
     componentWillUnmount(): void;
-    static getDerivedStateFromProps(props: TreeProps, prevState: TreeState): Partial<TreeState<DataNode<any>>>;
-    onNodeDragStart: NodeDragEventHandler<HTMLDivElement, TreeDataType>;
+    static getDerivedStateFromProps(props: TreeProps, prevState: TreeState): Partial<TreeState<DataNode>>;
+    onNodeDragStart: NodeDragEventHandler<TreeDataType, HTMLDivElement>;
     /**
      * [Legacy] Select handler is smaller than node,
      * so that this will trigger when drag enter node or select handler.
@@ -197,50 +199,50 @@ declare class RCTree<TreeDataType extends BasicDataNode = DataNode> extends Comp
      * Better for use mouse move event to refresh drag state.
      * But let's just keep it to avoid event trigger logic change.
      */
-    onNodeDragEnter: (event: any, node: NodeInstance<TreeDataType>) => void;
-    onNodeDragOver: (event: any, node: NodeInstance<TreeDataType>) => void;
-    onNodeDragLeave: NodeDragEventHandler;
+    onNodeDragEnter: (event: React.DragEvent<HTMLDivElement>, nodeProps: TreeNodeProps<TreeDataType>) => void;
+    onNodeDragOver: (event: React.DragEvent<HTMLDivElement>, nodeProps: TreeNodeProps<TreeDataType>) => void;
+    onNodeDragLeave: NodeDragEventHandler<TreeDataType>;
     onWindowDragEnd: (event: any) => void;
-    onNodeDragEnd: NodeDragEventHandler;
-    onNodeDrop: (event: any, node: any, outsideTree?: boolean) => void;
+    onNodeDragEnd: NodeDragEventHandler<TreeDataType>;
+    onNodeDrop: (event: React.DragEvent<HTMLDivElement>, _: TreeNodeProps<TreeDataType>, outsideTree?: boolean) => void;
     resetDragState(): void;
     cleanDragState: () => void;
-    onNodeClick: NodeMouseEventHandler;
-    onNodeDoubleClick: NodeMouseEventHandler;
-    onNodeSelect: NodeMouseEventHandler;
-    onNodeCheck: (e: any, treeNode: EventDataNode, checked: boolean) => void;
-    onNodeLoad: (treeNode: EventDataNode) => Promise<void>;
-    onNodeMouseEnter: NodeMouseEventHandler;
-    onNodeMouseLeave: NodeMouseEventHandler;
-    onNodeContextMenu: NodeMouseEventHandler;
+    triggerExpandActionExpand: NodeMouseEventHandler;
+    onNodeClick: NodeMouseEventHandler<TreeDataType>;
+    onNodeDoubleClick: NodeMouseEventHandler<TreeDataType>;
+    onNodeSelect: NodeMouseEventHandler<TreeDataType>;
+    onNodeCheck: (e: React.MouseEvent<HTMLSpanElement>, treeNode: EventDataNode<TreeDataType>, checked: boolean) => void;
+    onNodeLoad: (treeNode: EventDataNode<TreeDataType>) => Promise<void>;
+    onNodeMouseEnter: NodeMouseEventHandler<TreeDataType>;
+    onNodeMouseLeave: NodeMouseEventHandler<TreeDataType>;
+    onNodeContextMenu: NodeMouseEventHandler<TreeDataType>;
     onFocus: React.FocusEventHandler<HTMLDivElement>;
     onBlur: React.FocusEventHandler<HTMLDivElement>;
     getTreeNodeRequiredProps: () => {
-        expandedKeys: Key[];
-        selectedKeys: Key[];
-        loadedKeys: Key[];
-        loadingKeys: Key[];
-        checkedKeys: Key[];
-        halfCheckedKeys: Key[];
-        dragOverNodeKey: Key;
+        expandedKeys: React.Key[];
+        selectedKeys: React.Key[];
+        loadedKeys: React.Key[];
+        loadingKeys: React.Key[];
+        checkedKeys: React.Key[];
+        halfCheckedKeys: React.Key[];
+        dragOverNodeKey: React.Key;
         dropPosition: 0 | 1 | -1;
-        keyEntities: Record<Key, DataEntity<TreeDataType>>;
+        keyEntities: KeyEntities<TreeDataType>;
     };
     /** Set uncontrolled `expandedKeys`. This will also auto update `flattenNodes`. */
     setExpandedKeys: (expandedKeys: Key[]) => void;
-    flattenTreeData: (expandedKeys: Key[]) => FlattenNode[];
-    onNodeExpand: (e: any, treeNode: EventDataNode) => void;
+    onNodeExpand: (e: React.MouseEvent<HTMLDivElement>, treeNode: EventDataNode<TreeDataType>) => void;
     onListChangeStart: () => void;
     onListChangeEnd: () => void;
-    onActiveChange: (newActiveKey: Key) => void;
-    getActiveItem: () => FlattenNode;
+    onActiveChange: (newActiveKey: Key | null) => void;
+    getActiveItem: () => FlattenNode<TreeDataType>;
     offsetActiveKey: (offset: number) => void;
     onKeyDown: React.KeyboardEventHandler<HTMLDivElement>;
     /**
      * Only update the value which is not in props
      */
-    setUncontrolledState: (state: Partial<TreeState>, atomic?: boolean, forceState?: Partial<TreeState<TreeDataType>> | null) => void;
+    setUncontrolledState: (state: Partial<TreeState<TreeDataType>>, atomic?: boolean, forceState?: Partial<TreeState<TreeDataType>> | null) => void;
     scrollTo: ScrollTo;
     render(): React.JSX.Element;
 }
-export default RCTree;
+export default Tree;