rsuite 6.0.0-canary-2025032014 → 6.0.0-canary-20250416

package/cjs/AutoComplete/AutoComplete.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { BoxProps } from '../internals/Box';
 import type { FormControlPickerProps, Placement, Option, Size, ListboxProps, PopupProps } from '../internals/types';
+import type { BoxProps } from '../internals/Box';
 export interface AutoCompleteProps<T = string> extends BoxProps, FormControlPickerProps<T, any, Option | string>, ListboxProps, PopupProps {
     /** The placement of component */
     placement?: Placement;

package/cjs/AutoComplete/AutoComplete.js

@@ -10,12 +10,11 @@ var _pick = _interopRequireDefault(require("lodash/pick"));
 var _omit = _interopRequireDefault(require("lodash/omit"));
 var _Combobox = _interopRequireDefault(require("./Combobox"));
 var _Plaintext = _interopRequireDefault(require("../internals/Plaintext"));
-var _Box = _interopRequireDefault(require("../internals/Box"));
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
-var _Picker = require("../internals/Picker");
 var _utils2 = require("./utils");
 var _CustomProvider = require("../CustomProvider");
+var _Picker = require("../internals/Picker");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
@@ -154,7 +153,7 @@ const AutoComplete = (0, _utils.forwardRef)((props, ref) => {
   const classes = merge(className, withPrefix({
     disabled
   }));
-  const [htmlInputProps, restProps] = (0, _utils.partitionHTMLProps)((0, _omit.default)(rest, _Picker.pickTriggerPropKeys));
+  const [htmlInputProps, restProps] = (0, _utils.partitionHTMLProps)((0, _omit.default)(rest, _Picker.triggerPropKeys));
   const renderPopup = (positionProps, speakerRef) => {
     const {
       className
@@ -186,19 +185,22 @@ const AutoComplete = (0, _utils.forwardRef)((props, ref) => {
     }, typeof value === 'undefined' ? defaultValue : value);
   }
   const expanded = open || focus && hasItems;
-  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {
+  const triggerProps = {
+    ...(0, _pick.default)(props, _Picker.triggerPropKeys),
+    open: expanded
+  };
+  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, (0, _extends2.default)({
+    as: as,
     id: id,
     ref: trigger,
     placement: placement,
-    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),
+    triggerProps: triggerProps,
     trigger: ['click', 'focus'],
-    open: expanded,
-    speaker: renderPopup
-  }, /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({
-    as: as,
+    speaker: renderPopup,
     className: classes,
     style: style,
-    ref: root
+    rootRef: root,
+    responsive: false
   }, restProps), /*#__PURE__*/_react.default.createElement(_Combobox.default, (0, _extends2.default)({}, htmlInputProps, {
     disabled: disabled,
     value: value,
@@ -210,7 +212,7 @@ const AutoComplete = (0, _utils.forwardRef)((props, ref) => {
     onFocus: handleInputFocus,
     onChange: handleChange,
     onKeyDown: handleKeyDownEvent
-  }))));
+  })));
 });
 AutoComplete.displayName = 'AutoComplete';
 var _default = exports.default = AutoComplete;

package/cjs/Avatar/Avatar.d.ts

@@ -1,13 +1,12 @@
 import React, { CSSProperties } from 'react';
+import { StyledBoxProps } from '../internals/StyledBox';
 import type { BoxProps } from '../internals/Box';
-import type { ColorScheme, Size } from '../internals/types';
+import type { ColorScheme } from '../internals/types';
 export interface AvatarProps extends BoxProps {
     /**
      * A avatar can have different sizes.
-     *
-     * @default 'md'
      */
-    size?: Size;
+    size?: StyledBoxProps['size'];
     /**
      * The `src` attribute for the `img` element.
      */

package/cjs/Breadcrumb/Breadcrumb.js

@@ -53,8 +53,8 @@ const Breadcrumb = (0, _utils.forwardRef)((props, ref) => {
     onExpand === null || onExpand === void 0 || onExpand(event);
   });
   const content = (0, _react.useMemo)(() => {
-    const count = _utils.ReactChildren.count(children);
-    const items = _utils.ReactChildren.mapCloneElement(children, (item, index) => {
+    const count = _utils.rch.count(children);
+    const items = _utils.rch.mapCloneElement(children, (item, index) => {
       const isLast = index === count - 1;
       return {
         ...item.props,

package/cjs/Breadcrumb/BreadcrumbItem.js

@@ -6,7 +6,7 @@ exports.__esModule = true;
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
-var _SafeAnchor = _interopRequireDefault(require("../SafeAnchor"));
+var _SafeAnchor = _interopRequireDefault(require("../internals/SafeAnchor"));
 var _Box = _interopRequireDefault(require("../internals/Box"));
 var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");

package/cjs/Button/Button.js

@@ -8,7 +8,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _react = _interopRequireWildcard(require("react"));
 var _Ripple = _interopRequireDefault(require("../internals/Ripple"));
 var _Box = _interopRequireDefault(require("../internals/Box"));
-var _SafeAnchor = _interopRequireDefault(require("../SafeAnchor"));
+var _SafeAnchor = _interopRequireDefault(require("../internals/SafeAnchor"));
 var _ButtonGroup = require("../ButtonGroup");
 var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
@@ -20,7 +20,6 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  * @see https://rsuitejs.com/components/button
  */
 const Button = (0, _utils.forwardRef)((props, ref) => {
-  var _rest$role;
   const {
     propsWithDefaults
   } = (0, _CustomProvider.useCustom)('Button', props);
@@ -36,6 +35,7 @@ const Button = (0, _utils.forwardRef)((props, ref) => {
     color,
     disabled = buttonGroup === null || buttonGroup === void 0 ? void 0 : buttonGroup.disabled,
     loading,
+    role,
     ripple = true,
     size = (buttonGroup === null || buttonGroup === void 0 ? void 0 : buttonGroup.size) || 'md',
     startIcon,
@@ -79,18 +79,17 @@ const Button = (0, _utils.forwardRef)((props, ref) => {
   });
   const buttonAs = as || (rest.href ? _SafeAnchor.default : 'button');
   const isCustomElement = buttonAs !== 'button' && buttonAs !== _SafeAnchor.default;
-  const type = typeProp !== null && typeProp !== void 0 ? typeProp : buttonAs === 'button' ? 'button' : undefined;
-  const role = (_rest$role = rest.role) !== null && _rest$role !== void 0 ? _rest$role : isCustomElement ? 'button' : undefined;
-  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({}, rest, {
+  const uncertainProps = {
+    [(0, _utils.isDisableableElement)(buttonAs) || buttonAs === _SafeAnchor.default ? 'disabled' : 'aria-disabled']: disabled,
+    type: typeProp !== null && typeProp !== void 0 ? typeProp : buttonAs === 'button' ? 'button' : undefined,
+    role: role !== null && role !== void 0 ? role : isCustomElement ? 'button' : undefined
+  };
+  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({
     as: buttonAs,
-    role: role,
-    type: type,
     ref: ref,
-    disabled: disabled,
-    "aria-disabled": disabled,
     className: classes,
     onClick: handleClick
-  }), buttonContent);
+  }, uncertainProps, rest), buttonContent);
 });
 Button.displayName = 'Button';
 var _default = exports.default = Button;

package/cjs/Carousel/Carousel.js

@@ -43,7 +43,7 @@ const Carousel = (0, _utils.forwardRef)((props, ref) => {
     merge,
     withPrefix
   } = (0, _hooks.useStyles)(classPrefix);
-  const count = _utils.ReactChildren.count(children);
+  const count = _utils.rch.count(children);
   const labels = [];
   const vertical = placement === 'left' || placement === 'right';
   const lengthKey = vertical ? 'height' : 'width';
@@ -88,7 +88,7 @@ const Carousel = (0, _utils.forwardRef)((props, ref) => {
     onSlideEnd === null || onSlideEnd === void 0 || onSlideEnd(activeIndex, event);
   }, [activeIndex, onSlideEnd]);
   const uniqueId = (0, _react.useMemo)(() => (0, _utils.guid)(), []);
-  const items = _utils.ReactChildren.map(children, (child, index) => {
+  const items = _utils.rch.map(children, (child, index) => {
     var _child$props;
     if (!child) {
       return;

package/cjs/Cascader/Cascader.js

@@ -6,13 +6,11 @@ exports.__esModule = true;
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
-var _omit = _interopRequireDefault(require("lodash/omit"));
 var _pick = _interopRequireDefault(require("lodash/pick"));
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
 var _isFunction = _interopRequireDefault(require("lodash/isFunction"));
 var _TreeView = _interopRequireDefault(require("../CascadeTree/TreeView"));
 var _SearchView = _interopRequireDefault(require("../CascadeTree/SearchView"));
-var _Box = _interopRequireDefault(require("../internals/Box"));
 var _hooks = require("../CascadeTree/hooks");
 var _utils = require("../Tree/utils");
 var _utils2 = require("../internals/Tree/utils");
@@ -34,41 +32,43 @@ const Cascader = (0, _utils3.forwardRef)((props, ref) => {
     propsWithDefaults
   } = (0, _CustomProvider.useCustom)('Cascader', props);
   const {
+    appearance = 'default',
     as,
-    data = emptyArray,
+    block,
+    className,
+    cleanable = true,
     classPrefix = 'picker',
-    childrenKey = 'children',
-    valueKey = 'value',
-    labelKey = 'label',
+    columnHeight,
+    columnWidth,
+    data = emptyArray,
     defaultValue,
-    placeholder,
     disabled,
     disabledItemValues = emptyArray,
-    appearance = 'default',
-    cleanable = true,
+    childrenKey = 'children',
+    id,
+    labelKey = 'label',
     locale,
-    toggleAs,
-    style,
-    value: valueProp,
-    popupClassName,
-    popupStyle,
-    columnHeight,
-    columnWidth,
-    searchable = true,
     parentSelectable,
+    placeholder,
     placement = 'bottomStart',
-    id,
+    popupClassName,
+    popupStyle,
     renderColumn,
-    renderTreeNode,
+    renderExtraFooter,
     renderSearchItem,
+    renderTreeNode,
     renderValue,
-    renderExtraFooter,
-    onEntered,
-    onExited,
+    searchable = true,
+    style,
+    toggleAs,
+    value: valueProp,
+    valueKey = 'value',
     onClean,
     onChange,
-    onSelect,
+    onEnter,
+    onExit,
     onSearch,
+    onSelect,
     getChildren,
     ...rest
   } = propsWithDefaults;
@@ -211,11 +211,10 @@ const Cascader = (0, _utils3.forwardRef)((props, ref) => {
   });
   const {
     active,
-    handleEntered,
-    handleExited
+    events
   } = (0, _useActive.default)({
-    onEntered,
-    onExited,
+    onEnter,
+    onExit,
     target,
     setSearchKeyword
   });
@@ -348,29 +347,27 @@ const Cascader = (0, _utils3.forwardRef)((props, ref) => {
       hasValue = false;
     }
   }
-  const [classes, usedClassNamePropKeys] = (0, _Picker.usePickerClassName)({
-    ...props,
-    classPrefix,
-    hasValue,
-    name: 'cascader',
-    appearance,
-    cleanable
-  });
+  const triggerProps = {
+    ...(0, _pick.default)(props, _Picker.triggerPropKeys),
+    ...events
+  };
   return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {
+    as: as,
     id: id,
+    name: "cascader",
+    block: block,
+    disabled: disabled,
+    appearance: appearance,
     popupType: "tree",
-    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),
+    triggerProps: triggerProps,
     ref: trigger,
     placement: placement,
-    onEntered: handleEntered,
-    onExited: handleExited,
-    speaker: renderTreeView
-  }, /*#__PURE__*/_react.default.createElement(_Box.default, {
-    as: as,
-    className: classes,
+    speaker: renderTreeView,
+    rootRef: root,
     style: style,
-    ref: root
-  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [..._Picker.omitTriggerPropKeys, ...usedClassNamePropKeys]), {
+    classPrefix: classPrefix,
+    className: className
+  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({
     ref: target,
     as: toggleAs,
     appearance: appearance,
@@ -383,7 +380,7 @@ const Cascader = (0, _utils3.forwardRef)((props, ref) => {
     placement: placement,
     inputValue: value !== null && value !== void 0 ? value : '',
     focusItemValue: focusItemValue
-  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));
+  }, rest), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));
 });
 Cascader.displayName = 'Cascader';
 var _default = exports.default = Cascader;

package/cjs/Cascader/useActive.d.ts

@@ -3,13 +3,15 @@ interface UseActiveProps {
     target: React.RefObject<HTMLElement | null>;
     onOpen?: () => void;
     onClose?: () => void;
-    onEntered?: (node: HTMLElement) => void;
-    onExited?: (node: HTMLElement) => void;
+    onEnter?: (node: HTMLElement) => void;
+    onExit?: (node: HTMLElement) => void;
     setSearchKeyword: (keyword: string) => void;
 }
 declare const useActive: (props: UseActiveProps) => {
     active: boolean;
-    handleEntered: (...args: any[]) => any;
-    handleExited: (...args: any[]) => any;
+    events: {
+        onEnter: (...args: any[]) => any;
+        onExit: (...args: any[]) => any;
+    };
 };
 export default useActive;

package/cjs/Cascader/useActive.js

@@ -9,23 +9,23 @@ const useActive = props => {
   const {
     onOpen,
     onClose,
-    onEntered,
-    onExited,
     target,
     setSearchKeyword
   } = props;
   // Use component active state to support keyboard events.
   const [active, setActive] = (0, _react.useState)(false);
-  const handleEntered = (0, _hooks.useEventCallback)(node => {
-    onEntered === null || onEntered === void 0 || onEntered(node);
+  const onEnter = (0, _hooks.useEventCallback)(node => {
+    var _props$onEnter;
+    (_props$onEnter = props.onEnter) === null || _props$onEnter === void 0 || _props$onEnter.call(props, node);
     if (!target.current) {
       return;
     }
     onOpen === null || onOpen === void 0 || onOpen();
     setActive(true);
   });
-  const handleExited = (0, _hooks.useEventCallback)(node => {
-    onExited === null || onExited === void 0 || onExited(node);
+  const onExit = (0, _hooks.useEventCallback)(node => {
+    var _props$onExit;
+    (_props$onExit = props.onExit) === null || _props$onExit === void 0 || _props$onExit.call(props, node);
     if (!target.current) {
       return;
     }
@@ -35,8 +35,10 @@ const useActive = props => {
   });
   return {
     active,
-    handleEntered,
-    handleExited
+    events: {
+      onEnter,
+      onExit
+    }
   };
 };
 var _default = exports.default = useActive;

package/cjs/CheckPicker/CheckPicker.js

@@ -9,11 +9,9 @@ var _react = _interopRequireWildcard(require("react"));
 var _clone = _interopRequireDefault(require("lodash/clone"));
 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 _SearchBox = _interopRequireDefault(require("../internals/SearchBox"));
-var _Box = _interopRequireDefault(require("../internals/Box"));
 var _utils = require("../internals/Tree/utils");
 var _hooks = require("../internals/hooks");
 var _CustomProvider = require("../CustomProvider");
@@ -31,33 +29,35 @@ const CheckPicker = (0, _utils2.forwardRef)((props, ref) => {
     propsWithDefaults
   } = (0, _CustomProvider.useCustom)('CheckPicker', props);
   const {
-    as,
     appearance = 'default',
+    as,
+    block,
+    className,
+    cleanable = true,
     classPrefix = 'picker',
     countable = true,
     data = emptyArray,
+    defaultValue,
+    disabled,
     disabledItemValues = emptyArray,
-    valueKey = 'value',
+    groupBy,
+    id,
     labelKey = 'label',
-    searchable = true,
-    virtualized,
-    cleanable = true,
+    listProps,
+    listboxMaxHeight = 320,
+    locale,
+    placeholder,
     placement = 'bottomStart',
     popupAutoWidth = true,
-    listboxMaxHeight = 320,
     popupClassName,
     popupStyle,
-    locale,
-    placeholder,
-    disabled,
-    toggleAs,
-    style,
+    searchable = true,
     sticky,
+    style,
+    toggleAs,
     value: valueProp,
-    defaultValue,
-    groupBy,
-    listProps,
-    id,
+    valueKey = 'value',
+    virtualized,
     sort,
     searchBy,
     renderOption,
@@ -68,8 +68,7 @@ const CheckPicker = (0, _utils2.forwardRef)((props, ref) => {
     onGroupTitleClick,
     onSearch,
     onEnter,
-    onEntered,
-    onExited,
+    onExit,
     onClean,
     onChange,
     onSelect,
@@ -187,10 +186,10 @@ const CheckPicker = (0, _utils2.forwardRef)((props, ref) => {
     handleSelect(nextValue, item, event);
     handleChangeValue(nextValue, event);
   });
-  const handleEntered = (0, _hooks.useEventCallback)(() => {
+  const handleEnter = (0, _hooks.useEventCallback)(() => {
     setActive(true);
   });
-  const handleExited = (0, _hooks.useEventCallback)(() => {
+  const handleExit = (0, _hooks.useEventCallback)(() => {
     resetSearch();
     setFocusItemValue(null);
     setActive(false);
@@ -279,31 +278,28 @@ const CheckPicker = (0, _utils2.forwardRef)((props, ref) => {
       inputRef: searchInput
     }), renderListbox ? renderListbox(listbox) : listbox, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());
   };
-  const [classes, usedClassNamePropKeys] = (0, _Picker.usePickerClassName)({
-    ...props,
-    appearance,
-    classPrefix,
-    cleanable,
-    countable,
-    hasValue,
-    name: 'check'
-  });
+  const triggerProps = {
+    ...(0, _pick.default)(props, _Picker.triggerPropKeys),
+    onEnter: (0, _utils2.createChainedFunction)(initStickyItems, handleEnter, onEnter),
+    onExit: (0, _utils2.createChainedFunction)(handleExit, onExit)
+  };
   return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {
+    as: as,
     id: id,
     multiple: true,
-    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),
+    name: "check",
+    block: block,
+    disabled: disabled,
+    appearance: appearance,
+    triggerProps: triggerProps,
     ref: trigger,
     placement: placement,
-    onEnter: (0, _utils2.createChainedFunction)(initStickyItems, onEnter),
-    onEntered: (0, _utils2.createChainedFunction)(handleEntered, onEntered),
-    onExited: (0, _utils2.createChainedFunction)(handleExited, onExited),
-    speaker: renderPopup
-  }, /*#__PURE__*/_react.default.createElement(_Box.default, {
-    as: as,
-    className: classes,
+    speaker: renderPopup,
+    rootRef: root,
     style: style,
-    ref: root
-  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [..._Picker.omitTriggerPropKeys, ...usedClassNamePropKeys]), {
+    classPrefix: classPrefix,
+    className: className
+  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({
     ref: target,
     appearance: appearance,
     disabled: disabled,
@@ -311,12 +307,13 @@ const CheckPicker = (0, _utils2.forwardRef)((props, ref) => {
     onKeyDown: onPickerKeyDown,
     as: toggleAs,
     cleanable: cleanable && !disabled,
+    countable: countable,
     hasValue: hasValue,
     active: active,
     placement: placement,
     inputValue: value,
     focusItemValue: focusItemValue
-  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));
+  }, rest), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));
 });
 CheckPicker.displayName = 'CheckPicker';
 var _default = exports.default = CheckPicker;

package/cjs/CheckTreePicker/CheckTreePicker.js

@@ -8,7 +8,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _CheckTreeView = _interopRequireDefault(require("../CheckTree/CheckTreeView"));
-var _Box = _interopRequireDefault(require("../internals/Box"));
 var _useTreeValue = _interopRequireDefault(require("../CheckTree/hooks/useTreeValue"));
 var _useFlattenTree = _interopRequireDefault(require("../Tree/hooks/useFlattenTree"));
 var _useTreeWithChildren = _interopRequireDefault(require("../Tree/hooks/useTreeWithChildren"));
@@ -17,7 +16,6 @@ var _useFocusState = _interopRequireDefault(require("./hooks/useFocusState"));
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
 var _pick = _interopRequireDefault(require("lodash/pick"));
 var _isFunction = _interopRequireDefault(require("lodash/isFunction"));
-var _omit = _interopRequireDefault(require("lodash/omit"));
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
 var _Picker = require("../internals/Picker");
@@ -39,9 +37,11 @@ const CheckTreePicker = (0, _utils.forwardRef)((props, ref) => {
     as,
     id,
     appearance = 'default',
+    block,
     cleanable = true,
     countable = true,
     cascade = true,
+    className,
     classPrefix = 'picker',
     childrenKey = 'children',
     disabled,
@@ -58,11 +58,11 @@ const CheckTreePicker = (0, _utils.forwardRef)((props, ref) => {
     placement = 'bottomStart',
     treeHeight = 320,
     toggleAs,
-    style,
     searchBy,
     searchKeyword,
     showIndentLine,
     searchable = true,
+    style,
     valueKey = 'value',
     value: controlledValue,
     virtualized = false,
@@ -257,35 +257,33 @@ const CheckTreePicker = (0, _utils.forwardRef)((props, ref) => {
       }
     }
   }
-  const [classes, usedClassNamePropKeys] = (0, _Picker.usePickerClassName)({
-    ...props,
-    classPrefix,
-    appearance,
-    countable,
-    cleanable,
-    disabled,
-    hasValue: hasValidValue,
-    name: 'check-tree'
-  });
-  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {
+    as: as,
     id: id,
+    name: "check-tree",
+    block: block,
+    disabled: disabled,
+    appearance: appearance,
     popupType: "tree",
     multiple: true,
-    pickerProps: (0, _pick.default)(props, _Picker.pickTriggerPropKeys),
+    triggerProps: {
+      ...(0, _pick.default)(props, _Picker.triggerPropKeys),
+      ...triggerProps
+    },
     ref: trigger,
     placement: placement,
-    speaker: renderTreeView
-  }, triggerProps), /*#__PURE__*/_react.default.createElement(_Box.default, {
-    as: as,
-    className: classes,
+    speaker: renderTreeView,
+    rootRef: root,
     style: style,
-    ref: root
-  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({}, (0, _omit.default)(rest, [..._Picker.omitTriggerPropKeys, ...usedClassNamePropKeys]), {
+    classPrefix: classPrefix,
+    className: className
+  }, /*#__PURE__*/_react.default.createElement(_Picker.PickerToggle, (0, _extends2.default)({
     ref: target,
     appearance: appearance,
     onKeyDown: onPickerKeydown,
     onClean: (0, _utils.createChainedFunction)(handleClean, onClean),
     cleanable: cleanable && !disabled,
+    countable: countable,
     disabled: disabled,
     as: toggleAs,
     hasValue: hasValidValue,
@@ -293,7 +291,7 @@ const CheckTreePicker = (0, _utils.forwardRef)((props, ref) => {
     placement: placement,
     inputValue: value,
     focusItemValue: focusItemValue
-  }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));
+  }, rest), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));
 });
 CheckTreePicker.displayName = 'CheckTreePicker';
 var _default = exports.default = CheckTreePicker;

package/cjs/CustomProvider/CustomProvider.d.ts

@@ -267,10 +267,7 @@ export declare const CustomContext: React.Context<CustomProviderProps<{
     } | undefined;
     Toggle?: {
         on: string;
-        off: string; /**
-         * If true, the ripple effect is disabled.
-         * Affected components include: Button, Nav.Item, Pagination.
-         */
+        off: string;
     } | undefined;
 }>>;
 /**