rsuite 5.60.1 → 5.61.0

package/cjs/Cascader/Cascader.js

@@ -16,9 +16,10 @@ var _isFunction = _interopRequireDefault(require("lodash/isFunction"));
 var _TreeView = _interopRequireDefault(require("../CascadeTree/TreeView"));
 var _SearchView = _interopRequireDefault(require("../CascadeTree/SearchView"));
 var _hooks = require("../CascadeTree/hooks");
-var _treeUtils = require("../utils/treeUtils");
+var _utils = require("../Tree/utils");
+var _utils2 = require("../internals/Tree/utils");
 var _propTypes2 = require("../internals/propTypes");
-var _utils = require("../utils");
+var _utils3 = require("../utils");
 var _Picker = require("../internals/Picker");
 var _useMap = require("../utils/useMap");
 var _useActive2 = _interopRequireDefault(require("./useActive"));
@@ -89,14 +90,14 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     target = _usePickerRef.target,
     overlay = _usePickerRef.overlay,
     searchInput = _usePickerRef.searchInput;
-  var _ref = (0, _utils.useControlled)(valueProp, defaultValue),
+  var _ref = (0, _utils3.useControlled)(valueProp, defaultValue),
     value = _ref[0],
     setValue = _ref[1]; // Store the children of each node
   var childrenMap = (0, _useMap.useMap)();
 
   // Store the parent of each node
   var parentMap = (0, _react.useMemo)(function () {
-    return (0, _treeUtils.getParentMap)(data, function (item) {
+    return (0, _utils2.getParentMap)(data, function (item) {
       var _childrenMap$get;
       return (_childrenMap$get = childrenMap.get(item)) !== null && _childrenMap$get !== void 0 ? _childrenMap$get : item[childrenKey];
     });
@@ -104,7 +105,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 
   // Flatten the tree data
   var flattenedData = (0, _react.useMemo)(function () {
-    return (0, _treeUtils.flattenTree)(data, function (item) {
+    return (0, _utils.flattenTree)(data, function (item) {
       var _childrenMap$get2;
       return (_childrenMap$get2 = childrenMap.get(item)) !== null && _childrenMap$get2 !== void 0 ? _childrenMap$get2 : item[childrenKey];
     });
@@ -131,7 +132,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     }
 
     //  When the parent is optional, the value and the displayed path are updated.
-    if (parentSelectable && !(0, _utils.shallowEqual)(value, nextValue)) {
+    if (parentSelectable && !(0, _utils3.shallowEqual)(value, nextValue)) {
       setValue(nextValue);
       onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
     }
@@ -168,7 +169,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     columns = _usePaths.columns,
     pathTowardsActiveItem = _usePaths.pathTowardsActiveItem,
     pathTowardsSelectedItem = _usePaths.pathTowardsSelectedItem;
-  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),
+  var _useCustom = (0, _utils3.useCustom)('Picker', overrideLocale),
     locale = _useCustom.locale,
     rtl = _useCustom.rtl;
   /**
@@ -176,7 +177,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
    * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.
    */
   var hasValue = pathTowardsSelectedItem.length > 0 || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);
-  var _useClassNames = (0, _utils.useClassNames)(classPrefix),
+  var _useClassNames = (0, _utils3.useClassNames)(classPrefix),
     prefix = _useClassNames.prefix,
     merge = _useClassNames.merge;
   var onFocusItemCallback = (0, _react.useCallback)(function (value) {
@@ -237,22 +238,22 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     active = _useActive.active,
     handleEntered = _useActive.handleEntered,
     handleExited = _useActive.handleExited;
-  var handleClose = (0, _utils.useEventCallback)(function () {
+  var handleClose = (0, _utils3.useEventCallback)(function () {
     var _trigger$current2, _target$current, _target$current$focus;
     (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : _trigger$current2.close();
 
     // The focus is on the trigger button after closing
     (_target$current = target.current) === null || _target$current === void 0 ? void 0 : (_target$current$focus = _target$current.focus) === null || _target$current$focus === void 0 ? void 0 : _target$current$focus.call(_target$current);
   });
-  var handleClean = (0, _utils.useEventCallback)(function (event) {
+  var handleClean = (0, _utils3.useEventCallback)(function (event) {
     if (disabled || !target.current) {
       return;
     }
     setValue(null);
     onChange === null || onChange === void 0 ? void 0 : onChange(null, event);
   });
-  var handleMenuPressEnter = (0, _utils.useEventCallback)(function (event) {
-    var focusItem = (0, _treeUtils.findNodeOfTree)(data, function (item) {
+  var handleMenuPressEnter = (0, _utils3.useEventCallback)(function (event) {
+    var focusItem = (0, _utils2.findNodeOfTree)(data, function (item) {
       return item[valueKey] === focusItemValue;
     });
     var isLeafNode = focusItem && !focusItem[childrenKey];
@@ -261,7 +262,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       if (pathTowardsActiveItem.length) {
         setLayer(pathTowardsActiveItem.length - 1);
       }
-      if (!(0, _utils.shallowEqual)(value, focusItemValue)) {
+      if (!(0, _utils3.shallowEqual)(value, focusItemValue)) {
         onSelect === null || onSelect === void 0 ? void 0 : onSelect(focusItem, pathTowardsActiveItem, event);
         onChange === null || onChange === void 0 ? void 0 : onChange(focusItemValue !== null && focusItemValue !== void 0 ? focusItemValue : null, event);
       }
@@ -283,7 +284,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   /**
    * The search structure option is processed after being selected.
    */
-  var handleSearchRowSelect = (0, _utils.useEventCallback)(function (itemData, nodes, event) {
+  var handleSearchRowSelect = (0, _utils3.useEventCallback)(function (itemData, nodes, event) {
     var nextValue = itemData[valueKey];
     handleClose();
     setSearchKeyword('');
@@ -320,7 +321,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     });
     var classes = merge(className, DEPRECATED_menuClassName, popupClassName, prefix('popup-cascader'));
     return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {
-      ref: (0, _utils.mergeRefs)(overlay, speakerRef),
+      ref: (0, _utils3.mergeRefs)(overlay, speakerRef),
       className: classes,
       style: styles,
       target: trigger,
@@ -404,7 +405,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     as: toggleAs,
     appearance: appearance,
     disabled: disabled,
-    onClean: (0, _utils.createChainedFunction)(handleClean, onClean),
+    onClean: (0, _utils3.createChainedFunction)(handleClean, onClean),
     onKeyDown: onPickerKeyDown,
     cleanable: cleanable && !disabled,
     hasValue: hasValue,

package/cjs/CheckPicker/CheckPicker.js

@@ -11,14 +11,13 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clone = _interopRequireDefault(require("lodash/clone"));
-var _isUndefined = _interopRequireDefault(require("lodash/isUndefined"));
 var _isFunction = _interopRequireDefault(require("lodash/isFunction"));
 var _remove = _interopRequireDefault(require("lodash/remove"));
 var _omit = _interopRequireDefault(require("lodash/omit"));
 var _pick = _interopRequireDefault(require("lodash/pick"));
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
-var _treeUtils = require("../utils/treeUtils");
-var _utils = require("../utils");
+var _utils = require("../internals/Tree/utils");
+var _utils2 = require("../utils");
 var _getDataGroupBy = require("../utils/getDataGroupBy");
 var _Picker = require("../internals/Picker");
 var _SearchBox = _interopRequireDefault(require("../internals/SearchBox"));
@@ -93,9 +92,9 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     overlay = _usePickerRef.overlay,
     list = _usePickerRef.list,
     searchInput = _usePickerRef.searchInput;
-  var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),
+  var _useCustom = (0, _utils2.useCustom)('Picker', overrideLocale),
     locale = _useCustom.locale;
-  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue || []),
+  var _useControlled = (0, _utils2.useControlled)(valueProp, defaultValue || []),
     value = _useControlled[0],
     setValue = _useControlled[1]; // Used to hover the focuse item  when trigger `onKeydown`
   var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value === null || value === void 0 ? void 0 : value[0], {
@@ -108,7 +107,7 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     focusItemValue = _useFocusItemValue.focusItemValue,
     setFocusItemValue = _useFocusItemValue.setFocusItemValue,
     onFocusItem = _useFocusItemValue.onKeyDown;
-  var handleSearchCallback = (0, _utils.useEventCallback)(function (searchKeyword, filteredData, event) {
+  var handleSearchCallback = (0, _utils2.useEventCallback)(function (searchKeyword, filteredData, event) {
     var _filteredData$;
     // The first option after filtering is the focus.
     setFocusItemValue(filteredData === null || filteredData === void 0 ? void 0 : (_filteredData$ = filteredData[0]) === null || _filteredData$ === void 0 ? void 0 : _filteredData$[valueKey]);
@@ -147,10 +146,10 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     }
     setStickyItems(nextStickyItems);
   };
-  var handleChangeValue = (0, _utils.useEventCallback)(function (value, event) {
+  var handleChangeValue = (0, _utils2.useEventCallback)(function (value, event) {
     onChange === null || onChange === void 0 ? void 0 : onChange(value, event);
   });
-  var handleClean = (0, _utils.useEventCallback)(function (event) {
+  var handleClean = (0, _utils2.useEventCallback)(function (event) {
     if (disabled || !cleanable) {
       return;
     }
@@ -164,16 +163,16 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       return;
     }
     if (!nextValue.some(function (v) {
-      return (0, _utils.shallowEqual)(v, focusItemValue);
+      return (0, _utils2.shallowEqual)(v, focusItemValue);
     })) {
       nextValue.push(focusItemValue);
     } else {
       (0, _remove.default)(nextValue, function (itemVal) {
-        return (0, _utils.shallowEqual)(itemVal, focusItemValue);
+        return (0, _utils2.shallowEqual)(itemVal, focusItemValue);
       });
     }
     var focusItem = data.find(function (item) {
-      return (0, _utils.shallowEqual)(item === null || item === void 0 ? void 0 : item[valueKey], focusItemValue);
+      return (0, _utils2.shallowEqual)(item === null || item === void 0 ? void 0 : item[valueKey], focusItemValue);
     });
     setValue(nextValue);
     handleSelect(nextValue, focusItem, event);
@@ -191,16 +190,16 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     onMenuPressEnter: handleMenuPressEnter,
     onMenuPressBackspace: handleClean
   }, rest));
-  var handleSelect = (0, _utils.useEventCallback)(function (nextItemValue, item, event) {
+  var handleSelect = (0, _utils2.useEventCallback)(function (nextItemValue, item, event) {
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextItemValue, item, event);
   });
-  var handleItemSelect = (0, _utils.useEventCallback)(function (nextItemValue, item, event, checked) {
+  var handleItemSelect = (0, _utils2.useEventCallback)(function (nextItemValue, item, event, checked) {
     var nextValue = (0, _clone.default)(value);
     if (checked) {
       nextValue.push(nextItemValue);
     } else {
       (0, _remove.default)(nextValue, function (itemVal) {
-        return (0, _utils.shallowEqual)(itemVal, nextItemValue);
+        return (0, _utils2.shallowEqual)(itemVal, nextItemValue);
       });
     }
     setValue(nextValue);
@@ -208,17 +207,17 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     handleSelect(nextValue, item, event);
     handleChangeValue(nextValue, event);
   });
-  var handleEntered = (0, _utils.useEventCallback)(function () {
+  var handleEntered = (0, _utils2.useEventCallback)(function () {
     setActive(true);
   });
-  var handleExited = (0, _utils.useEventCallback)(function () {
+  var handleExited = (0, _utils2.useEventCallback)(function () {
     resetSearch();
     setFocusItemValue(null);
     setActive(false);
   });
   var selectedItems = data.filter(function (item) {
     return value === null || value === void 0 ? void 0 : value.some(function (val) {
-      return (0, _utils.shallowEqual)(item[valueKey], val);
+      return (0, _utils2.shallowEqual)(item[valueKey], val);
     });
   }) || [];
 
@@ -227,7 +226,7 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
    * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.
    */
   var hasValue = selectedItems.length > 0 || (value === null || value === void 0 ? void 0 : value.length) > 0 && (0, _isFunction.default)(renderValue);
-  var _useClassNames = (0, _utils.useClassNames)(classPrefix),
+  var _useClassNames = (0, _utils2.useClassNames)(classPrefix),
     prefix = _useClassNames.prefix,
     merge = _useClassNames.merge;
   var selectedElement = placeholder;
@@ -259,10 +258,10 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     var items = filteredData;
     var filteredStickyItems = [];
     if (stickyItems) {
-      filteredStickyItems = (0, _treeUtils.filterNodesOfTree)(stickyItems, function (item) {
+      filteredStickyItems = (0, _utils.filterNodesOfTree)(stickyItems, function (item) {
         return checkShouldDisplay(item);
       });
-      items = (0, _treeUtils.filterNodesOfTree)(data, function (item) {
+      items = (0, _utils.filterNodesOfTree)(data, function (item) {
         return checkShouldDisplay(item) && !stickyItems.some(function (v) {
           return v[valueKey] === item[valueKey];
         });
@@ -288,19 +287,17 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       listItemAs: _Picker.ListCheckItem,
       activeItemValues: value,
       focusItemValue: focusItemValue,
-      data: [].concat(filteredStickyItems, items)
-      // `group` is redundant so long as `groupBy` exists
-      ,
-      group: !(0, _isUndefined.default)(groupBy),
+      data: [].concat(filteredStickyItems, items),
       groupBy: groupBy,
       onSelect: handleItemSelect,
       onGroupTitleClick: onGroupTitleClick,
-      virtualized: virtualized
+      virtualized: virtualized,
+      query: searchKeyword
     }) : /*#__PURE__*/_react.default.createElement("div", {
       className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["none"])))
     }, locale === null || locale === void 0 ? void 0 : locale.noResultsText);
     return /*#__PURE__*/_react.default.createElement(_Picker.PickerPopup, {
-      ref: (0, _utils.mergeRefs)(overlay, speakerRef),
+      ref: (0, _utils2.mergeRefs)(overlay, speakerRef),
       autoWidth: menuAutoWidth,
       className: classes,
       style: styles,
@@ -329,9 +326,9 @@ var CheckPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),
     ref: trigger,
     placement: placement,
-    onEnter: (0, _utils.createChainedFunction)(initStickyItems, onEnter),
-    onEntered: (0, _utils.createChainedFunction)(handleEntered, onEntered),
-    onExited: (0, _utils.createChainedFunction)(handleExited, onExited),
+    onEnter: (0, _utils2.createChainedFunction)(initStickyItems, onEnter),
+    onEntered: (0, _utils2.createChainedFunction)(handleEntered, onEntered),
+    onExited: (0, _utils2.createChainedFunction)(handleExited, onExited),
     speaker: renderPopup
   }, /*#__PURE__*/_react.default.createElement(Component, {
     className: classes,

package/cjs/CheckTree/CheckTree.d.ts

@@ -0,0 +1,16 @@
+import { type CheckTreeViewProps } from './CheckTreeView';
+import type { RsRefForwardingComponent } from '../@types/common';
+import type { TreeExtraProps } from '../Tree/types';
+export declare type ValueType = (string | number)[];
+export interface CheckTreeProps<T = ValueType> extends CheckTreeViewProps<T>, TreeExtraProps {
+    /**
+     * Default selected Value
+     */
+    defaultValue?: T;
+}
+/**
+ * The `CheckTree` component is used for selecting multiple options which are organized in a tree structure.
+ * @see https://rsuitejs.com/components/check-tree
+ */
+declare const CheckTree: RsRefForwardingComponent<'div', CheckTreeProps>;
+export default CheckTree;

package/cjs/CheckTree/CheckTree.js

@@ -0,0 +1,112 @@
+'use client';
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _react = _interopRequireWildcard(require("react"));
+var _utils = require("../utils");
+var _useTreeValue2 = _interopRequireDefault(require("./hooks/useTreeValue"));
+var _CheckTreeView = _interopRequireDefault(require("./CheckTreeView"));
+var _useFlattenTree = _interopRequireDefault(require("../Tree/hooks/useFlattenTree"));
+var _useTreeWithChildren2 = _interopRequireDefault(require("../Tree/hooks/useTreeWithChildren"));
+var _useExpandTree2 = _interopRequireDefault(require("../Tree/hooks/useExpandTree"));
+var _TreeProvider = require("../Tree/TreeProvider");
+/**
+ * The `CheckTree` component is used for selecting multiple options which are organized in a tree structure.
+ * @see https://rsuitejs.com/components/check-tree
+ */
+var CheckTree = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var controlledValue = props.value,
+    data = props.data,
+    defaultValue = props.defaultValue,
+    _props$defaultExpandA = props.defaultExpandAll,
+    defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,
+    _props$defaultExpandI = props.defaultExpandItemValues,
+    defaultExpandItemValues = _props$defaultExpandI === void 0 ? [] : _props$defaultExpandI,
+    uncheckableItemValues = props.uncheckableItemValues,
+    controlledExpandItemValues = props.expandItemValues,
+    _props$childrenKey = props.childrenKey,
+    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,
+    _props$labelKey = props.labelKey,
+    labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,
+    _props$valueKey = props.valueKey,
+    valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,
+    virtualized = props.virtualized,
+    _props$cascade = props.cascade,
+    cascade = _props$cascade === void 0 ? true : _props$cascade,
+    renderTreeIcon = props.renderTreeIcon,
+    renderTreeNode = props.renderTreeNode,
+    getChildren = props.getChildren,
+    onExpand = props.onExpand,
+    onChange = props.onChange,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["value", "data", "defaultValue", "defaultExpandAll", "defaultExpandItemValues", "uncheckableItemValues", "expandItemValues", "childrenKey", "labelKey", "valueKey", "virtualized", "cascade", "renderTreeIcon", "renderTreeNode", "getChildren", "onExpand", "onChange"]);
+  var _useTreeValue = (0, _useTreeValue2.default)(controlledValue, {
+      defaultValue: defaultValue,
+      uncheckableItemValues: uncheckableItemValues
+    }),
+    value = _useTreeValue[0],
+    setValue = _useTreeValue[1];
+  var itemDataKeys = {
+    childrenKey: childrenKey,
+    labelKey: labelKey,
+    valueKey: valueKey
+  };
+  var _useTreeWithChildren = (0, _useTreeWithChildren2.default)(data, itemDataKeys),
+    treeData = _useTreeWithChildren.treeData,
+    loadingNodeValues = _useTreeWithChildren.loadingNodeValues,
+    appendChild = _useTreeWithChildren.appendChild;
+  var _useExpandTree = (0, _useExpandTree2.default)(data, (0, _extends2.default)({}, itemDataKeys, {
+      defaultExpandAll: defaultExpandAll,
+      defaultExpandItemValues: defaultExpandItemValues,
+      controlledExpandItemValues: controlledExpandItemValues,
+      onExpand: onExpand,
+      getChildren: getChildren,
+      appendChild: appendChild
+    })),
+    expandItemValues = _useExpandTree.expandItemValues,
+    handleExpandTreeNode = _useExpandTree.handleExpandTreeNode;
+  var flattenedNodes = (0, _useFlattenTree.default)(treeData, (0, _extends2.default)({}, itemDataKeys, {
+    uncheckableItemValues: uncheckableItemValues,
+    multiple: true,
+    cascade: cascade,
+    value: value
+  }));
+  var handleChange = (0, _utils.useEventCallback)(function (nextValue, event) {
+    setValue(nextValue);
+    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
+  });
+  var treeContext = (0, _react.useMemo)(function () {
+    return {
+      props: {
+        labelKey: labelKey,
+        valueKey: valueKey,
+        childrenKey: childrenKey,
+        virtualized: virtualized,
+        renderTreeIcon: renderTreeIcon,
+        renderTreeNode: renderTreeNode
+      }
+    };
+  }, [childrenKey, labelKey, valueKey, virtualized, renderTreeIcon, renderTreeNode]);
+  return /*#__PURE__*/_react.default.createElement(_TreeProvider.TreeProvider, {
+    value: treeContext
+  }, /*#__PURE__*/_react.default.createElement(_CheckTreeView.default, (0, _extends2.default)({}, rest, {
+    ref: ref,
+    value: value,
+    cascade: cascade,
+    data: treeData,
+    virtualized: virtualized,
+    loadingNodeValues: loadingNodeValues,
+    flattenedNodes: flattenedNodes,
+    uncheckableItemValues: uncheckableItemValues,
+    expandItemValues: expandItemValues,
+    onChange: handleChange,
+    onExpand: handleExpandTreeNode
+  })));
+});
+CheckTree.displayName = 'CheckTree';
+var _default = CheckTree;
+exports.default = _default;

package/cjs/CheckTree/CheckTreeNode.d.ts

@@ -0,0 +1,72 @@
+import React from 'react';
+import { RsRefForwardingComponent, WithAsProps } from '../@types/common';
+import { CheckStateType } from '../utils';
+import type { TreeNode as TreeNodeData } from '../Tree/types';
+export interface CheckTreeNodeProps extends WithAsProps {
+    /**
+     * The label of the node.
+     */
+    label?: any;
+    /**
+     * The layer of the node in the tree hierarchy.
+     */
+    layer: number;
+    /**
+     * The value of the node.
+     */
+    value?: any;
+    /**
+     * Whether the node should be focused.
+     */
+    focus?: boolean;
+    /**
+     * Whether the node should be expanded.
+     */
+    expanded?: boolean;
+    /**
+     * Whether the node is in a loading state.
+     */
+    loading?: boolean;
+    /**
+     * Whether the node is visible.
+     */
+    visible?: boolean;
+    /**
+     * Additional data associated with the node.
+     */
+    nodeData?: any;
+    /**
+     * Whether the node is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * The check state of the node.
+     */
+    checkState?: CheckStateType;
+    /**
+     * Whether the node has children.
+     */
+    hasChildren?: boolean;
+    /**
+     * Whether the node is uncheckable.
+     */
+    uncheckable?: boolean;
+    /**
+     * Whether all nodes are uncheckable.
+     */
+    allUncheckable?: boolean;
+    /**
+     * Reference to the tree item.
+     */
+    treeItemRef?: React.Ref<any>;
+    /**
+     * Callback function called when the node is expanded.
+     */
+    onExpand?: (nodeData: TreeNodeData, expanded?: boolean) => void;
+    /**
+     * Callback function called when the node is selected.
+     */
+    onSelect?: (nodeData: TreeNodeData, event: React.SyntheticEvent) => void;
+}
+declare const CheckTreeNode: RsRefForwardingComponent<'div', CheckTreeNodeProps>;
+export default CheckTreeNode;

package/cjs/CheckTree/CheckTreeNode.js

@@ -0,0 +1,117 @@
+'use client';
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _react = _interopRequireWildcard(require("react"));
+var _ListCheckItem = _interopRequireDefault(require("../internals/Picker/ListCheckItem"));
+var _utils = require("../internals/utils");
+var _hooks = require("../internals/hooks");
+var _utils2 = require("../Tree/utils");
+var _utils3 = require("../utils");
+var _TreeProvider = require("../Tree/TreeProvider");
+var _TreeNodeToggle = _interopRequireDefault(require("../Tree/TreeNodeToggle"));
+var CheckTreeNode = /*#__PURE__*/(0, _react.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 = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "style", "className", "classPrefix", "visible", "layer", "disabled", "allUncheckable", "loading", "expanded", "hasChildren", "nodeData", "focus", "label", "uncheckable", "checkState", "value", "treeItemRef", "onExpand", "onSelect"]);
+  var _useCustom = (0, _utils3.useCustom)(),
+    rtl = _useCustom.rtl;
+  var _useTreeContextProps = (0, _TreeProvider.useTreeContextProps)(),
+    renderTreeNode = _useTreeContextProps.renderTreeNode,
+    virtualized = _useTreeContextProps.virtualized;
+  var _useClassNames = (0, _utils3.useClassNames)(classPrefix),
+    prefix = _useClassNames.prefix,
+    merge = _useClassNames.merge,
+    withClassPrefix = _useClassNames.withClassPrefix;
+  var labelStr = (0, _react.useMemo)(function () {
+    return (0, _utils.stringifyReactNode)(label);
+  }, [label]);
+  var handleExpand = (0, _utils3.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 = (0, _utils3.useEventCallback)(function (_value, event) {
+    var isChecked = false;
+    if (checkState === _utils3.CHECK_STATE.UNCHECK || checkState === _utils3.CHECK_STATE.INDETERMINATE) {
+      isChecked = true;
+    }
+    if (checkState === _utils3.CHECK_STATE.CHECK) {
+      isChecked = false;
+    }
+    var nextNodeData = (0, _extends2.default)({}, 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 ? (0, _extends2.default)({}, style, (0, _utils2.indentTreeNode)(rtl, layer - 1)) : style;
+  var itemRef = (0, _hooks.useFoucsVirtualListItem)(focus);
+  return visible ? /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
+    style: styles,
+    className: classes,
+    ref: ref
+  }), /*#__PURE__*/_react.default.createElement(_TreeNodeToggle.default, {
+    "aria-label": (expanded ? 'Collapse' : 'Expand') + (" " + labelStr),
+    data: nodeData,
+    expanded: expanded,
+    loading: loading,
+    hasChildren: hasChildren,
+    onClick: handleExpand
+  }), /*#__PURE__*/_react.default.createElement(_ListCheckItem.default, {
+    as: "div",
+    role: "treeitem",
+    ref: (0, _utils3.mergeRefs)(itemRef, treeItemRef),
+    "aria-label": labelStr,
+    "aria-expanded": expanded,
+    "aria-checked": checkState === _utils3.CHECK_STATE.CHECK,
+    "aria-selected": focus,
+    "aria-disabled": disabled,
+    "aria-level": layer,
+    "data-layer": layer,
+    active: checkState === _utils3.CHECK_STATE.CHECK,
+    indeterminate: checkState === _utils3.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';
+var _default = CheckTreeNode;
+exports.default = _default;