rsuite 5.60.2 → 5.62.0

package/esm/CheckTree/CheckTreeNode.js

@@ -0,0 +1,110 @@
+'use client';
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import React, { forwardRef, useMemo } from 'react';
+import ListCheckItem from "../internals/Picker/ListCheckItem";
+import { stringifyReactNode, mergeRefs } from "../internals/utils";
+import { CHECK_STATE } from "../internals/constants";
+import { indentTreeNode } from "../Tree/utils";
+import { useClassNames, useEventCallback, useCustom, useFocusVirtualListItem } from "../internals/hooks";
+import { useTreeContextProps } from "../internals/Tree/TreeProvider";
+import TreeNodeToggle from "../Tree/TreeNodeToggle";
+var CheckTreeNode = /*#__PURE__*/forwardRef(function (props, ref) {
+  var _props$as = props.as,
+    Component = _props$as === void 0 ? 'div' : _props$as,
+    style = props.style,
+    className = props.className,
+    _props$classPrefix = props.classPrefix,
+    classPrefix = _props$classPrefix === void 0 ? 'check-tree-node' : _props$classPrefix,
+    _props$visible = props.visible,
+    visible = _props$visible === void 0 ? true : _props$visible,
+    layer = props.layer,
+    disabled = props.disabled,
+    allUncheckable = props.allUncheckable,
+    loading = props.loading,
+    expanded = props.expanded,
+    hasChildren = props.hasChildren,
+    nodeData = props.nodeData,
+    focus = props.focus,
+    label = props.label,
+    uncheckable = props.uncheckable,
+    checkState = props.checkState,
+    value = props.value,
+    treeItemRef = props.treeItemRef,
+    onExpand = props.onExpand,
+    onSelect = props.onSelect,
+    rest = _objectWithoutPropertiesLoose(props, ["as", "style", "className", "classPrefix", "visible", "layer", "disabled", "allUncheckable", "loading", "expanded", "hasChildren", "nodeData", "focus", "label", "uncheckable", "checkState", "value", "treeItemRef", "onExpand", "onSelect"]);
+  var _useCustom = useCustom(),
+    rtl = _useCustom.rtl;
+  var _useTreeContextProps = useTreeContextProps(),
+    renderTreeNode = _useTreeContextProps.renderTreeNode,
+    virtualized = _useTreeContextProps.virtualized;
+  var _useClassNames = useClassNames(classPrefix),
+    prefix = _useClassNames.prefix,
+    merge = _useClassNames.merge,
+    withClassPrefix = _useClassNames.withClassPrefix;
+  var labelStr = useMemo(function () {
+    return stringifyReactNode(label);
+  }, [label]);
+  var handleExpand = useEventCallback(function (event) {
+    var _event$nativeEvent, _event$nativeEvent$st;
+    // stop propagation when using custom loading icon
+    event === null || event === void 0 ? void 0 : (_event$nativeEvent = event.nativeEvent) === null || _event$nativeEvent === void 0 ? void 0 : (_event$nativeEvent$st = _event$nativeEvent.stopImmediatePropagation) === null || _event$nativeEvent$st === void 0 ? void 0 : _event$nativeEvent$st.call(_event$nativeEvent);
+    onExpand === null || onExpand === void 0 ? void 0 : onExpand(nodeData, expanded);
+  });
+  var handleSelect = useEventCallback(function (_value, event) {
+    var isChecked = false;
+    if (checkState === CHECK_STATE.UNCHECK || checkState === CHECK_STATE.INDETERMINATE) {
+      isChecked = true;
+    }
+    if (checkState === CHECK_STATE.CHECK) {
+      isChecked = false;
+    }
+    var nextNodeData = _extends({}, nodeData, {
+      check: isChecked
+    });
+    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextNodeData, event);
+  });
+  var classes = merge(className, withClassPrefix({
+    disabled: disabled,
+    'all-uncheckable': !!allUncheckable,
+    'text-muted': disabled,
+    focus: focus
+  }));
+  var styles = virtualized ? _extends({}, style, indentTreeNode(rtl, layer - 1)) : style;
+  var itemRef = useFocusVirtualListItem(focus);
+  return visible ? /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
+    style: styles,
+    className: classes,
+    ref: ref
+  }), /*#__PURE__*/React.createElement(TreeNodeToggle, {
+    "aria-label": (expanded ? 'Collapse' : 'Expand') + (" " + labelStr),
+    data: nodeData,
+    expanded: expanded,
+    loading: loading,
+    hasChildren: hasChildren,
+    onClick: handleExpand
+  }), /*#__PURE__*/React.createElement(ListCheckItem, {
+    as: "div",
+    role: "treeitem",
+    ref: mergeRefs(itemRef, treeItemRef),
+    "aria-label": labelStr,
+    "aria-expanded": expanded,
+    "aria-checked": checkState === CHECK_STATE.CHECK,
+    "aria-selected": focus,
+    "aria-disabled": disabled,
+    "aria-level": layer,
+    "data-layer": layer,
+    active: checkState === CHECK_STATE.CHECK,
+    indeterminate: checkState === CHECK_STATE.INDETERMINATE,
+    focus: focus,
+    checkable: !uncheckable,
+    disabled: disabled,
+    value: nodeData.refKey || value,
+    className: prefix('content'),
+    title: labelStr,
+    onSelect: handleSelect
+  }, typeof renderTreeNode === 'function' ? renderTreeNode(nodeData) : label)) : null;
+});
+CheckTreeNode.displayName = 'CheckTreeNode';
+export default CheckTreeNode;

package/esm/CheckTree/CheckTreeView.d.ts

@@ -0,0 +1,67 @@
+import React from 'react';
+import type { TreeNode, TreeNodeMap } from '@/internals/Tree/types';
+import type { RsRefForwardingComponent, ToArray, DataProps } from '@/internals/types';
+import type { TreeViewBaseProps } from '../Tree/types';
+/**
+ * Props for the CheckTreeView component.
+ */
+export interface CheckTreeViewProps<V = (string | number)[]> extends TreeViewBaseProps<V>, DataProps<TreeNode> {
+    /**
+     * Selected value.
+     */
+    value?: V;
+    /**
+     * Virtualized list ref object.
+     */
+    listRef?: React.RefObject<any>;
+    /**
+     * Searchbox input ref object.
+     */
+    searchInputRef?: React.RefObject<HTMLInputElement>;
+    /**
+     * Whether display search input box.
+     */
+    searchable?: boolean;
+    /**
+     * Tree node cascade.
+     */
+    cascade?: boolean;
+    /**
+     * Set the option value for the check box not to be rendered.
+     */
+    uncheckableItemValues?: V;
+    /**
+     * Disabled tree node.
+     */
+    disabledItemValues?: ToArray<NonNullable<V>>;
+    /**
+     * Called when scrolling.
+     */
+    onScroll?: (event: React.SyntheticEvent) => void;
+    /**
+     * Called after the value has been changed.
+     */
+    onChange?: (value: V, event: React.SyntheticEvent) => void;
+}
+interface CheckTreeViewInnerProps<V = (string | number)[]> extends Omit<CheckTreeViewProps<V>, 'onExpand'> {
+    /**
+     * Loading node values.
+     */
+    loadingNodeValues?: V;
+    /**
+     * Flattened nodes.
+     */
+    flattenedNodes?: TreeNodeMap;
+    /**
+     * Callback function triggered when an item is focused.
+     */
+    onFocusItem?: (value?: TreeNode['value']) => void;
+    /**
+     * A callback function that is called when a node is expanded.
+     *
+     * @param nodeData - The data of the expanded node.
+     */
+    onExpand?: (nodeData: TreeNode, expanded?: boolean) => void;
+}
+declare const CheckTreeView: RsRefForwardingComponent<'div', CheckTreeViewInnerProps>;
+export default CheckTreeView;

package/esm/CheckTree/CheckTreeView.js

@@ -0,0 +1,303 @@
+'use client';
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import React, { useEffect, useMemo } from 'react';
+import isNil from 'lodash/isNil';
+import { List, AutoSizer, defaultItemSize } from "../internals/Windowing";
+import CheckTreeNode from "./CheckTreeNode";
+import IndentLine from "../Tree/IndentLine";
+import { useCustom, useClassNames, useEventCallback } from "../internals/hooks";
+import { getPathTowardsItem, getKeyParentMap } from "../internals/Tree/utils";
+import { onMenuKeyDown } from "../internals/Picker";
+import { TreeView } from "../internals/Tree";
+import SearchBox from "../internals/SearchBox";
+import { hasGrandchild, isEveryFirstLevelNodeUncheckable, getFormattedTree, isNodeUncheckable } from "./utils";
+import { hasVisibleChildren, getActiveItem, isExpand } from "../Tree/utils";
+import useTreeSearch from "../Tree/hooks/useTreeSearch";
+import useFocusTree from "../Tree/hooks/useFocusTree";
+import useVirtualizedTreeData from "../Tree/hooks/useVirtualizedTreeData";
+import useTreeCheckState from "./hooks/useTreeCheckState";
+import useTreeNodeProps from "./hooks/useTreeNodeProps";
+import { useTreeContextProps } from "../internals/Tree/TreeProvider";
+
+/**
+ * Props for the CheckTreeView component.
+ */
+
+var CheckTreeView = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var _merge2;
+  var _props$as = props.as,
+    Component = _props$as === void 0 ? 'div' : _props$as,
+    className = props.className,
+    _props$classPrefix = props.classPrefix,
+    classPrefix = _props$classPrefix === void 0 ? 'check-tree' : _props$classPrefix,
+    _props$cascade = props.cascade,
+    cascade = _props$cascade === void 0 ? true : _props$cascade,
+    _props$data = props.data,
+    data = _props$data === void 0 ? [] : _props$data,
+    _props$disabledItemVa = props.disabledItemValues,
+    disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,
+    _props$expandItemValu = props.expandItemValues,
+    expandItemValues = _props$expandItemValu === void 0 ? [] : _props$expandItemValu,
+    _props$height = props.height,
+    height = _props$height === void 0 ? 360 : _props$height,
+    overrideLocale = props.locale,
+    listProps = props.listProps,
+    listRef = props.listRef,
+    style = props.style,
+    searchKeyword = props.searchKeyword,
+    showIndentLine = props.showIndentLine,
+    searchable = props.searchable,
+    searchInputRef = props.searchInputRef,
+    _props$uncheckableIte = props.uncheckableItemValues,
+    uncheckableItemValues = _props$uncheckableIte === void 0 ? [] : _props$uncheckableIte,
+    _props$loadingNodeVal = props.loadingNodeValues,
+    loadingNodeValues = _props$loadingNodeVal === void 0 ? [] : _props$loadingNodeVal,
+    _props$flattenedNodes = props.flattenedNodes,
+    flattenedNodes = _props$flattenedNodes === void 0 ? {} : _props$flattenedNodes,
+    searchBy = props.searchBy,
+    onChange = props.onChange,
+    onSearch = props.onSearch,
+    onSelect = props.onSelect,
+    onSelectItem = props.onSelectItem,
+    onScroll = props.onScroll,
+    onExpand = props.onExpand,
+    onFocusItem = props.onFocusItem,
+    rest = _objectWithoutPropertiesLoose(props, ["as", "className", "classPrefix", "cascade", "data", "disabledItemValues", "expandItemValues", "height", "locale", "listProps", "listRef", "style", "searchKeyword", "showIndentLine", "searchable", "searchInputRef", "uncheckableItemValues", "loadingNodeValues", "flattenedNodes", "searchBy", "onChange", "onSearch", "onSelect", "onSelectItem", "onScroll", "onExpand", "onFocusItem"]);
+  var _useCustom = useCustom('Picker', overrideLocale),
+    locale = _useCustom.locale;
+  var _useTreeContextProps = useTreeContextProps(),
+    childrenKey = _useTreeContextProps.childrenKey,
+    valueKey = _useTreeContextProps.valueKey,
+    virtualized = _useTreeContextProps.virtualized,
+    scrollShadow = _useTreeContextProps.scrollShadow;
+  var _useClassNames = useClassNames(classPrefix),
+    prefix = _useClassNames.prefix,
+    merge = _useClassNames.merge,
+    withClassPrefix = _useClassNames.withClassPrefix;
+  var _useTreeCheckState = useTreeCheckState({
+      cascade: cascade,
+      flattenedNodes: flattenedNodes,
+      uncheckableItemValues: uncheckableItemValues
+    }),
+    getCheckedValues = _useTreeCheckState.getCheckedValues;
+  var handleSearchCallback = function handleSearchCallback(value, _data, event) {
+    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value, event);
+  };
+  var _useTreeSearch = useTreeSearch({
+      callback: handleSearchCallback,
+      data: data,
+      searchKeyword: searchKeyword,
+      searchBy: searchBy
+    }),
+    filteredData = _useTreeSearch.filteredData,
+    keyword = _useTreeSearch.keyword,
+    setFilteredData = _useTreeSearch.setFilteredData,
+    handleSearch = _useTreeSearch.handleSearch;
+  var _useFocusTree = useFocusTree({
+      filteredData: filteredData,
+      disabledItemValues: disabledItemValues,
+      expandItemValues: expandItemValues,
+      searchKeyword: keyword,
+      flattenedNodes: flattenedNodes,
+      onFocused: onFocusItem,
+      onExpand: onExpand
+    }),
+    focusItemValue = _useFocusTree.focusItemValue,
+    setFocusItemValue = _useFocusTree.setFocusItemValue,
+    onTreeKeydown = _useFocusTree.onTreeKeydown,
+    saveTreeNodeRef = _useFocusTree.saveTreeNodeRef;
+  var transformation = useVirtualizedTreeData(flattenedNodes, filteredData, {
+    cascade: cascade,
+    expandItemValues: expandItemValues,
+    searchKeyword: keyword
+  });
+
+  /**
+   * Get formatted nodes for render tree
+   * @params render - renderNode function. only used when virtualized setting false
+   */
+  var getFormattedNodes = function getFormattedNodes(render) {
+    if (virtualized) {
+      return transformation().filter(function (item) {
+        return item.visible;
+      });
+    }
+    return getFormattedTree(flattenedNodes, filteredData, {
+      childrenKey: childrenKey,
+      cascade: cascade
+    }).map(function (node) {
+      return render === null || render === void 0 ? void 0 : render(node, 1);
+    }).filter(function (item) {
+      return item;
+    });
+  };
+  var getTreeNodeProps = useTreeNodeProps({
+    uncheckableItemValues: uncheckableItemValues,
+    disabledItemValues: disabledItemValues,
+    loadingNodeValues: loadingNodeValues,
+    focusItemValue: focusItemValue,
+    flattenedNodes: flattenedNodes,
+    keyword: keyword
+  });
+  useEffect(function () {
+    setFilteredData(data, keyword);
+  }, [data, keyword, setFilteredData]);
+
+  // TODO-Doma
+  // Replace `getKeyParentMap` with `getParentMap`
+  var itemParentMap = useMemo(function () {
+    return getKeyParentMap(data, function (node) {
+      return node[valueKey];
+    }, function (node) {
+      return node[childrenKey];
+    });
+  }, [childrenKey, data, valueKey]);
+  var handleSelect = useEventCallback(function (node, event) {
+    var currentNode = node.refKey ? flattenedNodes[node.refKey] : null;
+    if (!node || !currentNode) {
+      return;
+    }
+    var checkedValues = getCheckedValues(node, !currentNode.check);
+    var path = getPathTowardsItem(node, function (item) {
+      return itemParentMap.get(item[valueKey]);
+    });
+    setFocusItemValue(node[valueKey]);
+    onChange === null || onChange === void 0 ? void 0 : onChange(checkedValues, event);
+    onSelect === null || onSelect === void 0 ? void 0 : onSelect(node, checkedValues, event);
+    onSelectItem === null || onSelectItem === void 0 ? void 0 : onSelectItem(node, path);
+  });
+  var selectActiveItem = function selectActiveItem(event) {
+    if (isNil(focusItemValue)) return;
+    var activeItem = getActiveItem(focusItemValue, flattenedNodes, valueKey);
+    if (!isNodeUncheckable(activeItem, {
+      uncheckableItemValues: uncheckableItemValues,
+      valueKey: valueKey
+    }) && activeItem !== null) {
+      handleSelect(activeItem, event);
+    }
+  };
+  var handleTreeKeyDown = useEventCallback(function (event) {
+    onTreeKeydown(event);
+    onMenuKeyDown(event, {
+      enter: selectActiveItem
+    });
+  });
+  var renderNode = function renderNode(node, layer) {
+    var visible = node.visible,
+      refKey = node.refKey,
+      parent = node.parent; // when searching, all nodes should be expand
+    var expanded = isExpand(keyword, expandItemValues.includes(node[valueKey]));
+    if (!visible) {
+      return null;
+    }
+    var children = node[childrenKey];
+    var hasChildren = keyword ? hasVisibleChildren(node, childrenKey) : Boolean(children);
+    var treeNodeProps = _extends({}, getTreeNodeProps(_extends({}, node, {
+      parent: parent
+    })), {
+      layer: layer,
+      expanded: expanded,
+      hasChildren: hasChildren,
+      onSelect: handleSelect,
+      onExpand: onExpand
+    });
+    if (hasChildren) {
+      var _merge;
+      layer += 1;
+      var childClassName = merge(prefix('node-children'), (_merge = {}, _merge[prefix('node-expanded')] = expanded, _merge));
+      var nodes = children || [];
+      return /*#__PURE__*/React.createElement("div", {
+        className: childClassName,
+        key: node[valueKey]
+      }, /*#__PURE__*/React.createElement(CheckTreeNode, _extends({}, treeNodeProps, {
+        treeItemRef: function treeItemRef(ref) {
+          return saveTreeNodeRef(ref, refKey);
+        }
+      })), /*#__PURE__*/React.createElement("div", {
+        className: prefix('group'),
+        role: "group"
+      }, nodes.map(function (child) {
+        return renderNode(child, layer);
+      }), showIndentLine && /*#__PURE__*/React.createElement(IndentLine, null)));
+    }
+    return /*#__PURE__*/React.createElement(CheckTreeNode, _extends({
+      key: node[valueKey],
+      treeItemRef: function treeItemRef(ref) {
+        return saveTreeNodeRef(ref, refKey);
+      }
+    }, treeNodeProps));
+  };
+  var renderVirtualListNode = function renderVirtualListNode(_ref) {
+    var index = _ref.index,
+      style = _ref.style,
+      data = _ref.data;
+    var node = data[index];
+    var layer = node.layer,
+      refKey = node.refKey,
+      visible = node.visible,
+      hasChildren = node.hasChildren,
+      parent = node.parent;
+    var expanded = isExpand(keyword, expandItemValues.includes(node[valueKey]));
+    var treeNodeProps = _extends({}, getTreeNodeProps(_extends({}, node, {
+      parent: parent
+    })), {
+      onSelect: handleSelect,
+      onExpand: onExpand,
+      expanded: expanded,
+      layer: layer,
+      hasChildren: hasChildren
+    });
+    return visible && /*#__PURE__*/React.createElement(CheckTreeNode, _extends({
+      style: style,
+      ref: function ref(_ref2) {
+        return saveTreeNodeRef(_ref2, refKey);
+      }
+    }, treeNodeProps));
+  };
+  var classes = merge(className, withClassPrefix({
+    'without-children': !hasGrandchild(data, childrenKey),
+    virtualized: virtualized
+  }));
+  var formattedNodes = getFormattedNodes(renderNode);
+  var treeNodesClass = merge(prefix('root'), (_merge2 = {}, _merge2[prefix('all-uncheckable')] = isEveryFirstLevelNodeUncheckable(flattenedNodes, uncheckableItemValues, valueKey), _merge2));
+  return /*#__PURE__*/React.createElement(Component, {
+    ref: ref,
+    className: classes,
+    style: style
+  }, searchable ? /*#__PURE__*/React.createElement(SearchBox, {
+    placeholder: locale.searchPlaceholder,
+    onChange: handleSearch,
+    value: keyword,
+    inputRef: searchInputRef
+  }) : null, keyword && formattedNodes.length === 0 ? /*#__PURE__*/React.createElement("div", {
+    className: prefix('empty')
+  }, locale.noResultsText) : null, /*#__PURE__*/React.createElement(TreeView, _extends({}, rest, {
+    multiselectable: true,
+    treeRootClassName: treeNodesClass,
+    className: prefix('view'),
+    onScroll: onScroll,
+    onKeyDown: handleTreeKeyDown,
+    height: height
+  }), virtualized ? /*#__PURE__*/React.createElement(AutoSizer, {
+    defaultHeight: height,
+    style: {
+      width: 'auto',
+      height: 'auto'
+    },
+    className: prefix('virt-auto-sizer')
+  }, function (_ref3) {
+    var height = _ref3.height;
+    return /*#__PURE__*/React.createElement(List, _extends({
+      ref: listRef,
+      height: height,
+      itemSize: defaultItemSize,
+      itemCount: formattedNodes.length,
+      itemData: formattedNodes,
+      className: prefix('virt-list'),
+      scrollShadow: scrollShadow
+    }, listProps), renderVirtualListNode);
+  }) : formattedNodes));
+});
+CheckTreeView.displayName = 'CheckTreeView';
+export default CheckTreeView;

package/esm/CheckTree/hooks/useTreeCheckState.d.ts

@@ -0,0 +1,10 @@
+import type { TreeNodeMap } from '@/internals/Tree/types';
+interface Props {
+    cascade?: boolean;
+    flattenedNodes: TreeNodeMap;
+    uncheckableItemValues: (string | number)[];
+}
+declare function useTreeCheckState(props: Props): {
+    getCheckedValues: (...args: any[]) => any;
+};
+export default useTreeCheckState;

package/esm/CheckTree/hooks/useTreeCheckState.js

@@ -0,0 +1,87 @@
+'use client';
+import { useCallback } from 'react';
+import isNil from 'lodash/isNil';
+import cloneDeep from 'lodash/cloneDeep';
+import { useEventCallback } from "../../internals/hooks";
+import { useItemDataKeys } from "../../internals/Tree/TreeProvider";
+import { isEveryChildChecked } from "../utils";
+function useTreeCheckState(props) {
+  var cascade = props.cascade,
+    flattenedNodes = props.flattenedNodes,
+    uncheckableItemValues = props.uncheckableItemValues;
+  var _useItemDataKeys = useItemDataKeys(),
+    valueKey = _useItemDataKeys.valueKey,
+    childrenKey = _useItemDataKeys.childrenKey;
+  var checkParentNode = useEventCallback(function (nodes, node, checked) {
+    var currentNode = node.refKey ? nodes[node.refKey] : null;
+    if (cascade && currentNode) {
+      if (!checked) {
+        currentNode.check = checked;
+        currentNode.checkAll = checked;
+      } else {
+        if (isEveryChildChecked(currentNode, {
+          nodes: nodes,
+          childrenKey: childrenKey
+        })) {
+          currentNode.check = true;
+          currentNode.checkAll = true;
+        } else {
+          currentNode.check = false;
+          currentNode.checkAll = false;
+        }
+      }
+      if (currentNode.parent) {
+        checkParentNode(nodes, currentNode.parent, checked);
+      }
+    }
+  });
+  var checkChildNode = useEventCallback(function (nodes, node, isChecked) {
+    var currentNode = node.refKey ? nodes[node.refKey] : null;
+    if (!currentNode) {
+      return;
+    }
+    currentNode.check = isChecked;
+    if (!currentNode[childrenKey] || !currentNode[childrenKey].length || !cascade) {
+      currentNode.checkAll = false;
+    } else {
+      currentNode.checkAll = isChecked;
+      currentNode[childrenKey].forEach(function (child) {
+        checkChildNode(nodes, child, isChecked);
+      });
+    }
+  });
+  var getCheckedValuesByParent = useCallback(function (nodes) {
+    var values = [];
+    for (var key in nodes) {
+      var currentNode = nodes[key];
+      if (!isNil(currentNode.parent) && !isNil(currentNode.parent.refKey)) {
+        var parentNode = nodes[currentNode.parent.refKey];
+        if (currentNode.check) {
+          if (!(parentNode !== null && parentNode !== void 0 && parentNode.checkAll)) {
+            values.push(currentNode[valueKey]);
+          } else if (parentNode !== null && parentNode !== void 0 && parentNode.uncheckable) {
+            values.push(currentNode[valueKey]);
+          }
+        }
+      } else if (currentNode.check) {
+        values.push(currentNode[valueKey]);
+      }
+    }
+    return values;
+  }, [valueKey]);
+  var getCheckedValues = useEventCallback(function (node, isChecked) {
+    var nodes = cloneDeep(flattenedNodes);
+    checkChildNode(nodes, node, isChecked);
+    if (node.parent) {
+      checkParentNode(nodes, node.parent, isChecked);
+    }
+    var values = getCheckedValuesByParent(nodes);
+    return values.filter(function (v) {
+      return !uncheckableItemValues.includes(v);
+    });
+  });
+  return {
+    getCheckedValues: getCheckedValues
+  };
+}
+export default useTreeCheckState;

package/esm/CheckTree/hooks/useTreeNodeProps.d.ts

@@ -0,0 +1,22 @@
+import type { TreeNode } from '@/internals/Tree/types';
+interface Props {
+    uncheckableItemValues: any[];
+    disabledItemValues: any[];
+    loadingNodeValues: any[];
+    focusItemValue: any;
+    flattenedNodes: any;
+    keyword: string;
+}
+declare function useTreeNodeProps(props: Props): (nodeData: TreeNode) => {
+    value: any;
+    label: any;
+    visible: boolean | undefined;
+    loading: boolean;
+    disabled: boolean;
+    nodeData: TreeNode;
+    checkState: import("../../internals/constants").CheckStateType | undefined;
+    uncheckable: boolean;
+    allUncheckable: boolean;
+    focus: boolean;
+};
+export default useTreeNodeProps;

package/esm/CheckTree/hooks/useTreeNodeProps.js

@@ -0,0 +1,52 @@
+'use client';
+import React, { useCallback } from 'react';
+import { isAllSiblingNodeUncheckable, getDisabledState, isNodeUncheckable } from "../utils";
+import { useItemDataKeys } from "../../internals/Tree/TreeProvider";
+import Highlight from "../../Highlight";
+function useTreeNodeProps(props) {
+  var _useItemDataKeys = useItemDataKeys(),
+    valueKey = _useItemDataKeys.valueKey,
+    labelKey = _useItemDataKeys.labelKey;
+  var uncheckableItemValues = props.uncheckableItemValues,
+    disabledItemValues = props.disabledItemValues,
+    loadingNodeValues = props.loadingNodeValues,
+    focusItemValue = props.focusItemValue,
+    flattenedNodes = props.flattenedNodes,
+    keyword = props.keyword;
+  return useCallback(function (nodeData) {
+    var visible = nodeData.visible,
+      checkState = nodeData.checkState;
+    var value = nodeData[valueKey];
+    var nodeLabel = nodeData[labelKey];
+    var allUncheckable = isAllSiblingNodeUncheckable(nodeData, flattenedNodes, uncheckableItemValues, valueKey);
+    var label = keyword ? /*#__PURE__*/React.createElement(Highlight, {
+      as: "span",
+      query: keyword
+    }, nodeLabel) : nodeLabel;
+    var disabled = getDisabledState(flattenedNodes, nodeData, {
+      disabledItemValues: disabledItemValues,
+      valueKey: valueKey
+    });
+    var uncheckable = isNodeUncheckable(nodeData, {
+      uncheckableItemValues: uncheckableItemValues,
+      valueKey: valueKey
+    });
+    var loading = loadingNodeValues.some(function (item) {
+      return item === nodeData[valueKey];
+    });
+    var focus = focusItemValue === value;
+    return {
+      value: value,
+      label: label,
+      visible: visible,
+      loading: loading,
+      disabled: disabled,
+      nodeData: nodeData,
+      checkState: checkState,
+      uncheckable: uncheckable,
+      allUncheckable: allUncheckable,
+      focus: focus
+    };
+  }, [valueKey, flattenedNodes, uncheckableItemValues, keyword, labelKey, disabledItemValues, loadingNodeValues, focusItemValue]);
+}
+export default useTreeNodeProps;

package/esm/CheckTree/hooks/useTreeValue.d.ts

@@ -0,0 +1,5 @@
+declare function useTreeValue(controlledValue: any, { defaultValue, uncheckableItemValues }: {
+    defaultValue: any;
+    uncheckableItemValues: any;
+}): any[];
+export default useTreeValue;

package/esm/CheckTree/hooks/useTreeValue.js

@@ -0,0 +1,16 @@
+'use client';
+import { useControlled, useMount } from "../../internals/hooks";
+import { getCheckTreeDefaultValue } from "../utils";
+function useTreeValue(controlledValue, _ref) {
+  var defaultValue = _ref.defaultValue,
+    uncheckableItemValues = _ref.uncheckableItemValues;
+  var _useControlled = useControlled(controlledValue, defaultValue),
+    value = _useControlled[0],
+    setValue = _useControlled[1],
+    isControlled = _useControlled[2];
+  useMount(function () {
+    setValue(getCheckTreeDefaultValue(value, uncheckableItemValues));
+  });
+  return [value, setValue, isControlled];
+}
+export default useTreeValue;