rsuite 5.60.2 → 5.62.0

package/cjs/internals/Picker/hooks/useToggleKeyDownEvent.js

@@ -3,7 +3,8 @@
 
 exports.__esModule = true;
 exports.default = void 0;
-var _utils = require("../../../utils");
+var _constants = require("../../constants");
+var _hooks = require("../../hooks");
 /**
  * A hook to control the toggle keyboard operation
  * @param props
@@ -24,44 +25,44 @@ var useToggleKeyDownEvent = function useToggleKeyDownEvent(props) {
     onMenuKeyDown = props.onMenuKeyDown,
     onMenuPressEnter = props.onMenuPressEnter,
     onMenuPressBackspace = props.onMenuPressBackspace;
-  var handleClose = (0, _utils.useEventCallback)(function () {
+  var handleClose = (0, _hooks.useEventCallback)(function () {
     var _trigger$current, _trigger$current$clos, _trigger$current2, _trigger$current2$foc;
     (_trigger$current = trigger.current) === null || _trigger$current === void 0 ? void 0 : (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 ? void 0 : _trigger$current$clos.call(_trigger$current);
 
     // The focus is on the trigger button after closing
     (_trigger$current2 = trigger.current) === null || _trigger$current2 === void 0 ? void 0 : (_trigger$current2$foc = _trigger$current2.focus) === null || _trigger$current2$foc === void 0 ? void 0 : _trigger$current2$foc.call(_trigger$current2);
   });
-  var handleOpen = (0, _utils.useEventCallback)(function () {
+  var handleOpen = (0, _hooks.useEventCallback)(function () {
     var _trigger$current3, _trigger$current3$ope;
     (_trigger$current3 = trigger.current) === null || _trigger$current3 === void 0 ? void 0 : (_trigger$current3$ope = _trigger$current3.open) === null || _trigger$current3$ope === void 0 ? void 0 : _trigger$current3$ope.call(_trigger$current3);
   });
-  var handleToggleDropdown = (0, _utils.useEventCallback)(function () {
+  var handleToggleDropdown = (0, _hooks.useEventCallback)(function () {
     if (active) {
       handleClose();
       return;
     }
     handleOpen();
   });
-  var onToggle = (0, _utils.useEventCallback)(function (event) {
+  var onToggle = (0, _hooks.useEventCallback)(function (event) {
     // Keyboard events should not be processed when readOnly and disabled are set.
     if (readOnly || disabled || loading) {
       return;
     }
     if (event.target === (target === null || target === void 0 ? void 0 : target.current)) {
       // enter
-      if (toggle && event.key === _utils.KEY_VALUES.ENTER) {
+      if (toggle && event.key === _constants.KEY_VALUES.ENTER) {
         handleToggleDropdown();
       }
 
       // delete
-      if (event.key === _utils.KEY_VALUES.BACKSPACE) {
+      if (event.key === _constants.KEY_VALUES.BACKSPACE) {
         onExit === null || onExit === void 0 ? void 0 : onExit(event);
       }
     }
     if (overlay !== null && overlay !== void 0 && overlay.current) {
       // The keyboard operation callback on the menu.
       onMenuKeyDown === null || onMenuKeyDown === void 0 ? void 0 : onMenuKeyDown(event);
-      if (event.key === _utils.KEY_VALUES.ENTER) {
+      if (event.key === _constants.KEY_VALUES.ENTER) {
         onMenuPressEnter === null || onMenuPressEnter === void 0 ? void 0 : onMenuPressEnter(event);
       }
 
@@ -69,7 +70,7 @@ var useToggleKeyDownEvent = function useToggleKeyDownEvent(props) {
        * There is no callback when typing the Backspace key in the search box.
        * The default is to remove search keywords
        */
-      if (event.key === _utils.KEY_VALUES.BACKSPACE && event.target !== (searchInput === null || searchInput === void 0 ? void 0 : searchInput.current)) {
+      if (event.key === _constants.KEY_VALUES.BACKSPACE && event.target !== (searchInput === null || searchInput === void 0 ? void 0 : searchInput.current)) {
         onMenuPressBackspace === null || onMenuPressBackspace === void 0 ? void 0 : onMenuPressBackspace(event);
       }
 
@@ -84,7 +85,7 @@ var useToggleKeyDownEvent = function useToggleKeyDownEvent(props) {
         }
       }
     }
-    if (event.key === _utils.KEY_VALUES.ESC || event.key === _utils.KEY_VALUES.TAB) {
+    if (event.key === _constants.KEY_VALUES.ESC || event.key === _constants.KEY_VALUES.TAB) {
       handleClose();
     }
 

package/cjs/internals/Picker/index.d.ts

@@ -1,7 +1,6 @@
 import { pickTriggerPropKeys, omitTriggerPropKeys, OverlayTriggerHandle, PositionChildProps } from './PickerToggleTrigger';
 import { PickerToggleProps } from './PickerToggle';
 import { PickerHandle, PickerComponent } from './types';
-export { default as TreeView } from './TreeView';
 export { default as Listbox } from './Listbox';
 export { default as ListItem } from './ListItem';
 export { default as ListItemGroup } from './ListItemGroup';

package/cjs/internals/Picker/index.js

@@ -5,7 +5,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 exports.__esModule = true;
 var _exportNames = {
-  TreeView: true,
   Listbox: true,
   ListItem: true,
   ListItemGroup: true,
@@ -19,13 +18,11 @@ var _exportNames = {
   pickTriggerPropKeys: true,
   omitTriggerPropKeys: true
 };
-exports.SelectedElement = exports.PickerToggleTrigger = exports.PickerIndicator = exports.PickerLabel = exports.PickerToggle = exports.PickerPopup = exports.ListCheckItem = exports.ListItemGroup = exports.ListItem = exports.Listbox = exports.TreeView = void 0;
+exports.SelectedElement = exports.PickerToggleTrigger = exports.PickerIndicator = exports.PickerLabel = exports.PickerToggle = exports.PickerPopup = exports.ListCheckItem = exports.ListItemGroup = exports.ListItem = exports.Listbox = void 0;
 var _PickerToggleTrigger = _interopRequireWildcard(require("./PickerToggleTrigger"));
 exports.pickTriggerPropKeys = _PickerToggleTrigger.pickTriggerPropKeys;
 exports.omitTriggerPropKeys = _PickerToggleTrigger.omitTriggerPropKeys;
 exports.PickerToggleTrigger = _PickerToggleTrigger.default;
-var _TreeView = _interopRequireDefault(require("./TreeView"));
-exports.TreeView = _TreeView.default;
 var _Listbox = _interopRequireDefault(require("./Listbox"));
 exports.Listbox = _Listbox.default;
 var _ListItem = _interopRequireDefault(require("./ListItem"));

package/cjs/internals/Picker/propTypes.d.ts

@@ -12,7 +12,7 @@ export declare const pickerPropTypes: {
     menuClassName: PropTypes.Requireable<string>;
     menuStyle: PropTypes.Requireable<object>;
     placeholder: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-    placement: PropTypes.Requireable<"top" | "bottom" | "right" | "left" | "bottomStart" | "bottomEnd" | "topStart" | "topEnd" | "leftStart" | "rightStart" | "leftEnd" | "rightEnd" | "auto" | "autoVertical" | "autoVerticalStart" | "autoVerticalEnd" | "autoHorizontal" | "autoHorizontalStart" | "autoHorizontalEnd">;
+    placement: PropTypes.Requireable<"left" | "right" | "top" | "bottom" | "bottomStart" | "bottomEnd" | "topStart" | "topEnd" | "leftStart" | "rightStart" | "leftEnd" | "rightEnd" | "auto" | "autoVertical" | "autoVerticalStart" | "autoVerticalEnd" | "autoHorizontal" | "autoHorizontalStart" | "autoHorizontalEnd">;
     preventOverflow: PropTypes.Requireable<boolean>;
     open: PropTypes.Requireable<boolean>;
     defaultOpen: PropTypes.Requireable<boolean>;
@@ -51,7 +51,7 @@ export declare const listPickerPropTypes: {
     menuClassName: PropTypes.Requireable<string>;
     menuStyle: PropTypes.Requireable<object>;
     placeholder: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-    placement: PropTypes.Requireable<"top" | "bottom" | "right" | "left" | "bottomStart" | "bottomEnd" | "topStart" | "topEnd" | "leftStart" | "rightStart" | "leftEnd" | "rightEnd" | "auto" | "autoVertical" | "autoVerticalStart" | "autoVerticalEnd" | "autoHorizontal" | "autoHorizontalStart" | "autoHorizontalEnd">;
+    placement: PropTypes.Requireable<"left" | "right" | "top" | "bottom" | "bottomStart" | "bottomEnd" | "topStart" | "topEnd" | "leftStart" | "rightStart" | "leftEnd" | "rightEnd" | "auto" | "autoVertical" | "autoVerticalStart" | "autoVerticalEnd" | "autoHorizontal" | "autoHorizontalStart" | "autoHorizontalEnd">;
     preventOverflow: PropTypes.Requireable<boolean>;
     open: PropTypes.Requireable<boolean>;
     defaultOpen: PropTypes.Requireable<boolean>;

package/cjs/internals/Picker/propTypes.js

@@ -6,10 +6,10 @@ exports.__esModule = true;
 exports.listPickerPropTypes = exports.pickerPropTypes = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _utils = require("../../utils");
-var _utils2 = require("../../Animation/utils");
+var _constants = require("../constants");
+var _utils = require("../../Animation/utils");
 var _propTypes2 = require("../propTypes");
-var pickerPropTypes = (0, _extends2.default)({}, _utils2.animationPropTypes, {
+var pickerPropTypes = (0, _extends2.default)({}, _utils.animationPropTypes, {
   classPrefix: _propTypes.default.string,
   className: _propTypes.default.string,
   style: _propTypes.default.object,
@@ -22,7 +22,7 @@ var pickerPropTypes = (0, _extends2.default)({}, _utils2.animationPropTypes, {
   menuClassName: _propTypes.default.string,
   menuStyle: _propTypes.default.object,
   placeholder: _propTypes.default.node,
-  placement: (0, _propTypes2.oneOf)(_utils.PLACEMENT),
+  placement: (0, _propTypes2.oneOf)(_constants.PLACEMENT),
   preventOverflow: _propTypes.default.bool,
   open: _propTypes.default.bool,
   defaultOpen: _propTypes.default.bool,

package/cjs/internals/Picker/types.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { RsRefForwardingComponent } from '../../@types/common';
-import type { ListHandle } from '../../internals/Windowing';
-import { RSUITE_PICKER_TYPE } from '../../internals/symbols';
+import { RsRefForwardingComponent } from '@/internals/types';
+import type { ListHandle } from '@/internals/Windowing';
+import { RSUITE_PICKER_TYPE } from '@/internals/symbols';
 export interface PickerHandle {
     type?: typeof RSUITE_PICKER_TYPE;
     root: HTMLElement | null;

package/cjs/internals/Picker/utils.js

@@ -8,8 +8,9 @@ exports.shouldDisplay = shouldDisplay;
 exports.onMenuKeyDown = onMenuKeyDown;
 var _react = _interopRequireDefault(require("react"));
 var _trim = _interopRequireDefault(require("lodash/trim"));
-var _treeUtils = require("../../utils/treeUtils");
-var _utils = require("../../utils");
+var _constants = require("../constants");
+var _utils = require("../Tree/utils");
+var _utils2 = require("../utils");
 var defaultNodeKeys = {
   valueKey: 'value',
   childrenKey: 'children'
@@ -23,7 +24,7 @@ function createConcatChildrenFunction(node, nodeValue, nodeKeys) {
     childrenKey = _nodeKeys.childrenKey;
   return function (data, children) {
     if (nodeValue) {
-      node = (0, _treeUtils.findNodeOfTree)(data, function (item) {
+      node = (0, _utils.findNodeOfTree)(data, function (item) {
         return nodeValue === item[valueKey];
       });
     }
@@ -39,7 +40,7 @@ function shouldDisplay(label, searchKeyword) {
   if (typeof label === 'string' || typeof label === 'number') {
     return ("" + label).toLocaleLowerCase().indexOf(keyword) >= 0;
   } else if ( /*#__PURE__*/_react.default.isValidElement(label)) {
-    var nodes = (0, _utils.reactToString)(label);
+    var nodes = (0, _utils2.reactToString)(label);
     return nodes.join('').toLocaleLowerCase().indexOf(keyword) >= 0;
   }
   return false;
@@ -59,35 +60,35 @@ function onMenuKeyDown(event, events) {
     left = events.left;
   switch (event.key) {
     // down
-    case _utils.KEY_VALUES.DOWN:
+    case _constants.KEY_VALUES.DOWN:
       down === null || down === void 0 ? void 0 : down(event);
       event.preventDefault();
       break;
     // up
-    case _utils.KEY_VALUES.UP:
+    case _constants.KEY_VALUES.UP:
       up === null || up === void 0 ? void 0 : up(event);
       event.preventDefault();
       break;
     // enter
-    case _utils.KEY_VALUES.ENTER:
+    case _constants.KEY_VALUES.ENTER:
       enter === null || enter === void 0 ? void 0 : enter(event);
       event.preventDefault();
       break;
     // delete
-    case _utils.KEY_VALUES.BACKSPACE:
+    case _constants.KEY_VALUES.BACKSPACE:
       del === null || del === void 0 ? void 0 : del(event);
       break;
     // esc | tab
-    case _utils.KEY_VALUES.ESC:
-    case _utils.KEY_VALUES.TAB:
+    case _constants.KEY_VALUES.ESC:
+    case _constants.KEY_VALUES.TAB:
       esc === null || esc === void 0 ? void 0 : esc(event);
       break;
     // left arrow
-    case _utils.KEY_VALUES.LEFT:
+    case _constants.KEY_VALUES.LEFT:
       left === null || left === void 0 ? void 0 : left(event);
       break;
     // right arrow
-    case _utils.KEY_VALUES.RIGHT:
+    case _constants.KEY_VALUES.RIGHT:
       right === null || right === void 0 ? void 0 : right(event);
       break;
     default:

package/cjs/internals/Plaintext/Plaintext.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { WithAsProps } from '../../@types/common';
+import { WithAsProps } from '@/internals/types';
 declare type LocaleKey = 'unfilled' | 'notSelected' | 'notUploaded';
 export interface PlaintextProps extends WithAsProps {
     placeholder?: React.ReactNode;

package/cjs/internals/Plaintext/Plaintext.js

@@ -7,13 +7,13 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _react = _interopRequireDefault(require("react"));
-var _utils = require("../../utils");
+var _hooks = require("../hooks");
 /**
  * Make the component display in plain text, and display default characters when there is no children.
  * @private
  */
 var Plaintext = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var _useCustom = (0, _utils.useCustom)('Plaintext'),
+  var _useCustom = (0, _hooks.useCustom)('Plaintext'),
     locale = _useCustom.locale;
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,
@@ -26,7 +26,7 @@ var Plaintext = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     _props$placeholder = props.placeholder,
     placeholder = _props$placeholder === void 0 ? locale[localeKey] : _props$placeholder,
     rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "classPrefix", "className", "children", "localeKey", "placeholder"]);
-  var _useClassNames = (0, _utils.useClassNames)(classPrefix),
+  var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     merge = _useClassNames.merge;
   var classes = merge(className, withClassPrefix({

package/cjs/internals/Ripple/Ripple.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { WithAsProps } from '../../@types/common';
+import { WithAsProps } from '@/internals/types';
 export interface RippleProps extends WithAsProps {
     onMouseDown?: (position: any, event: React.MouseEvent) => void;
 }

package/cjs/internals/Ripple/Ripple.js

@@ -11,8 +11,9 @@ var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _getOffset = _interopRequireDefault(require("dom-lib/getOffset"));
 var _on = _interopRequireDefault(require("dom-lib/on"));
+var _hooks = require("../hooks");
 var _Transition = _interopRequireDefault(require("../../Animation/Transition"));
-var _utils = require("../../utils");
+var _utils = require("../utils");
 var getPosition = function getPosition(target, event) {
   var offset = (0, _getOffset.default)(target);
   var offsetX = (event.pageX || 0) - offset.left;
@@ -33,7 +34,7 @@ var getPosition = function getPosition(target, event) {
  * @private
  */
 var Ripple = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var _useCustom = (0, _utils.useCustom)(),
+  var _useCustom = (0, _hooks.useCustom)(),
     disableRipple = _useCustom.disableRipple;
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'span' : _props$as,
@@ -42,7 +43,7 @@ var Ripple = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     classPrefix = _props$classPrefix === void 0 ? 'ripple' : _props$classPrefix,
     onMouseDown = props.onMouseDown,
     rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "classPrefix", "onMouseDown"]);
-  var _useClassNames = (0, _utils.useClassNames)(classPrefix),
+  var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     merge = _useClassNames.merge,
     prefix = _useClassNames.prefix,
     withClassPrefix = _useClassNames.withClassPrefix;

package/cjs/internals/ScrollView/ScrollView.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { WithAsProps } from '@/internals/types';
+export interface ScrollViewProps extends WithAsProps, React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * The shadow of the content when scrolling
+     */
+    scrollShadow?: boolean;
+    /**
+     * Whether to customize the scrollbar
+     */
+    customScrollbar?: boolean;
+    /**
+     * The height of the scroll area
+     */
+    height?: number;
+    /**
+     * The width of the scroll area
+     */
+    width?: number;
+    /**
+     * Test ID
+     * @private
+     */
+    'data-testid'?: string;
+}
+declare const ScrollView: React.ForwardRefExoticComponent<ScrollViewProps & React.RefAttributes<HTMLDivElement>>;
+export default ScrollView;

package/cjs/internals/ScrollView/ScrollView.js

@@ -0,0 +1,56 @@
+'use client';
+"use strict";
+
+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 = _interopRequireDefault(require("react"));
+var _hooks = require("../hooks");
+var _utils = require("../utils");
+var _useScrollState2 = require("./hooks/useScrollState");
+var ScrollView = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var _props$as = props.as,
+    Component = _props$as === void 0 ? 'div' : _props$as,
+    _props$classPrefix = props.classPrefix,
+    classPrefix = _props$classPrefix === void 0 ? 'scroll-view' : _props$classPrefix,
+    className = props.className,
+    children = props.children,
+    scrollShadow = props.scrollShadow,
+    customScrollbar = props.customScrollbar,
+    height = props.height,
+    width = props.width,
+    style = props.style,
+    onScroll = props.onScroll,
+    dataTestId = props['data-testid'],
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "classPrefix", "className", "children", "scrollShadow", "customScrollbar", "height", "width", "style", "onScroll", "data-testid"]);
+  var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
+    merge = _useClassNames.merge,
+    withClassPrefix = _useClassNames.withClassPrefix;
+  var _useScrollState = (0, _useScrollState2.useScrollState)(scrollShadow),
+    scrollState = _useScrollState.scrollState,
+    handleScroll = _useScrollState.handleScroll,
+    bodyRef = _useScrollState.bodyRef;
+  var bodyStyles = (0, _extends2.default)({
+    height: height,
+    width: width
+  }, style);
+  var bodyClasses = merge(className, withClassPrefix({
+    shadow: scrollShadow,
+    'thumb-top': scrollState === 'top',
+    'thumb-middle': scrollState === 'middle',
+    'thumb-bottom': scrollState === 'bottom',
+    'custom-scrollbar': customScrollbar
+  }));
+  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
+    ref: (0, _utils.mergeRefs)(ref, bodyRef),
+    className: bodyClasses,
+    style: bodyStyles,
+    onScroll: (0, _utils.createChainedFunction)(handleScroll, onScroll),
+    "data-testid": dataTestId || 'scroll-view'
+  }), children);
+});
+ScrollView.displayName = 'ScrollView';
+var _default = ScrollView;
+exports.default = _default;

package/cjs/internals/ScrollView/hooks/useScrollState.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare function useScrollState(scrollShadow?: boolean): {
+    scrollState: "top" | "bottom" | "middle" | null;
+    handleScroll: ((...args: any[]) => any) | undefined;
+    bodyRef: import("react").RefObject<HTMLDivElement>;
+};

package/cjs/internals/ScrollView/hooks/useScrollState.js

@@ -0,0 +1,62 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.useScrollState = useScrollState;
+var _react = require("react");
+var _hooks = require("../../hooks");
+function getScrollState(target) {
+  var scrollTop = target.scrollTop;
+  var scrollHeight = target.scrollHeight;
+  var clientHeight = target.clientHeight;
+  if (scrollHeight <= clientHeight) {
+    return null;
+  } else if (scrollTop === 0) {
+    return 'top';
+  } else if (scrollTop + clientHeight === scrollHeight) {
+    return 'bottom';
+  } else {
+    return 'middle';
+  }
+}
+function useScrollState(scrollShadow) {
+  var bodyRef = (0, _react.useRef)(null);
+  var _useState = (0, _react.useState)(null),
+    scrollState = _useState[0],
+    setScrollState = _useState[1];
+  (0, _hooks.useMount)(function () {
+    var observer;
+    if (bodyRef.current && scrollShadow) {
+      var target = bodyRef.current;
+      setScrollState(getScrollState(target));
+      var lastScrollHeight = target.scrollHeight;
+
+      // Listen for changes in scrollHeight
+      observer = new MutationObserver(function () {
+        var newScrollHeight = target === null || target === void 0 ? void 0 : target.scrollHeight;
+        if (newScrollHeight && newScrollHeight !== lastScrollHeight) {
+          setScrollState(getScrollState(target));
+          lastScrollHeight = newScrollHeight;
+        }
+      });
+      observer.observe(target, {
+        attributes: true,
+        childList: true,
+        subtree: true
+      });
+    }
+    return function () {
+      var _observer;
+      (_observer = observer) === null || _observer === void 0 ? void 0 : _observer.disconnect();
+    };
+  });
+  var handleScroll = (0, _hooks.useEventCallback)(function (event) {
+    var target = event.currentTarget;
+    setScrollState(getScrollState(target));
+  });
+  return {
+    scrollState: scrollState,
+    handleScroll: scrollShadow ? handleScroll : undefined,
+    bodyRef: bodyRef
+  };
+}

package/cjs/internals/ScrollView/index.d.ts

@@ -0,0 +1,3 @@
+import ScrollView from './ScrollView';
+export type { ScrollViewProps } from './ScrollView';
+export default ScrollView;

package/cjs/internals/ScrollView/index.js

@@ -0,0 +1,9 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _ScrollView = _interopRequireDefault(require("./ScrollView"));
+var _default = _ScrollView.default;
+exports.default = _default;

package/cjs/internals/SearchBox/SearchBox.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { WithAsProps, RsRefForwardingComponent } from '../../@types/common';
+import { WithAsProps, RsRefForwardingComponent } from '@/internals/types';
 export interface SearchBoxProps extends WithAsProps {
     value?: string;
     placeholder?: string;

package/cjs/internals/SearchBox/SearchBox.js

@@ -9,9 +9,9 @@ var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtim
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _react = _interopRequireDefault(require("react"));
 var _Search = _interopRequireDefault(require("@rsuite/icons/legacy/Search"));
+var _hooks = require("../hooks");
 var _Input = _interopRequireDefault(require("../../Input"));
-var _InputGroup = _interopRequireDefault(require("../..//InputGroup"));
-var _utils = require("../../utils");
+var _InputGroup = _interopRequireDefault(require("../../InputGroup"));
 var _templateObject, _templateObject2;
 var SearchBox = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
@@ -24,7 +24,7 @@ var SearchBox = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     inputRef = props.inputRef,
     onChange = props.onChange,
     rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "classPrefix", "value", "className", "placeholder", "inputRef", "onChange"]);
-  var _useClassNames = (0, _utils.useClassNames)(classPrefix),
+  var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     merge = _useClassNames.merge,
     prefix = _useClassNames.prefix;

package/cjs/internals/Tree/TreeProvider.d.ts

@@ -0,0 +1,54 @@
+import React from 'react';
+import { TreeNode } from './types';
+interface RegisterMethods {
+    /**
+     * Focuses on the first node in the tree.
+     */
+    focusTreeFirstNode: () => void;
+    /**
+     * Focuses on the active node in the tree.
+     */
+    focusTreeActiveNode: () => void;
+}
+declare type Unregister = () => void;
+interface TreeContextValue {
+    register?: (methods: RegisterMethods) => Unregister;
+    props: {
+        labelKey: string;
+        valueKey: string;
+        childrenKey: string;
+        virtualized?: boolean;
+        scrollShadow?: boolean;
+        renderTreeNode?: (nodeData: TreeNode) => React.ReactNode;
+        renderTreeIcon?: (nodeData: TreeNode, expanded?: boolean) => React.ReactNode;
+    };
+}
+export declare const TreeProvider: React.Provider<TreeContextValue>;
+export declare const useRegisterTreeMethods: () => ((methods: RegisterMethods) => Unregister) | undefined;
+export declare const useTreeCustomRenderer: () => {
+    renderTreeIcon: ((nodeData: TreeNode, expanded?: boolean) => React.ReactNode) | undefined;
+    renderTreeNode: ((nodeData: TreeNode) => React.ReactNode) | undefined;
+};
+export declare const useItemDataKeys: () => {
+    labelKey: string;
+    valueKey: string;
+    childrenKey: string;
+};
+export declare const useTreeContextProps: () => {
+    labelKey: string;
+    valueKey: string;
+    childrenKey: string;
+    virtualized?: boolean | undefined;
+    scrollShadow?: boolean | undefined;
+    renderTreeNode?: ((nodeData: TreeNode) => React.ReactNode) | undefined;
+    renderTreeIcon?: ((nodeData: TreeNode, expanded?: boolean) => React.ReactNode) | undefined;
+};
+/**
+ * Custom hook that provides imperative handle for the Tree component.
+ */
+export declare const useTreeImperativeHandle: () => {
+    register: ({ focusTreeFirstNode, focusTreeActiveNode }: any) => () => void;
+    focusFirstNode: () => void | undefined;
+    focusActiveNode: () => void | undefined;
+};
+export {};

package/cjs/internals/Tree/TreeProvider.js

@@ -0,0 +1,84 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.useTreeImperativeHandle = exports.useTreeContextProps = exports.useItemDataKeys = exports.useTreeCustomRenderer = exports.useRegisterTreeMethods = exports.TreeProvider = void 0;
+var _react = require("react");
+var defaultItemDataKeys = {
+  labelKey: 'label',
+  valueKey: 'value',
+  childrenKey: 'children',
+  virtualized: false
+};
+var TreeContext = /*#__PURE__*/(0, _react.createContext)({
+  props: defaultItemDataKeys
+});
+var TreeProvider = TreeContext.Provider;
+exports.TreeProvider = TreeProvider;
+var useRegisterTreeMethods = function useRegisterTreeMethods() {
+  var _useContext = (0, _react.useContext)(TreeContext),
+    register = _useContext.register;
+  return register;
+};
+exports.useRegisterTreeMethods = useRegisterTreeMethods;
+var useTreeCustomRenderer = function useTreeCustomRenderer() {
+  var _useContext2 = (0, _react.useContext)(TreeContext),
+    _useContext2$props = _useContext2.props,
+    renderTreeIcon = _useContext2$props.renderTreeIcon,
+    renderTreeNode = _useContext2$props.renderTreeNode;
+  return {
+    renderTreeIcon: renderTreeIcon,
+    renderTreeNode: renderTreeNode
+  };
+};
+exports.useTreeCustomRenderer = useTreeCustomRenderer;
+var useItemDataKeys = function useItemDataKeys() {
+  var _useContext3 = (0, _react.useContext)(TreeContext),
+    _useContext3$props = _useContext3.props;
+  _useContext3$props = _useContext3$props === void 0 ? defaultItemDataKeys : _useContext3$props;
+  var labelKey = _useContext3$props.labelKey,
+    valueKey = _useContext3$props.valueKey,
+    childrenKey = _useContext3$props.childrenKey;
+  return {
+    labelKey: labelKey,
+    valueKey: valueKey,
+    childrenKey: childrenKey
+  };
+};
+exports.useItemDataKeys = useItemDataKeys;
+var useTreeContextProps = function useTreeContextProps() {
+  var _useContext4 = (0, _react.useContext)(TreeContext),
+    props = _useContext4.props;
+  return props;
+};
+
+/**
+ * Custom hook that provides imperative handle for the Tree component.
+ */
+exports.useTreeContextProps = useTreeContextProps;
+var useTreeImperativeHandle = function useTreeImperativeHandle() {
+  var focusFirstNodeRef = (0, _react.useRef)(null);
+  var focusActiveNodeRef = (0, _react.useRef)(null);
+  var register = (0, _react.useCallback)(function (_ref) {
+    var focusTreeFirstNode = _ref.focusTreeFirstNode,
+      focusTreeActiveNode = _ref.focusTreeActiveNode;
+    focusFirstNodeRef.current = focusTreeFirstNode;
+    focusActiveNodeRef.current = focusTreeActiveNode;
+    return function () {
+      focusFirstNodeRef.current = null;
+      focusActiveNodeRef.current = null;
+    };
+  }, []);
+  return {
+    register: register,
+    focusFirstNode: function focusFirstNode() {
+      var _focusFirstNodeRef$cu;
+      return (_focusFirstNodeRef$cu = focusFirstNodeRef.current) === null || _focusFirstNodeRef$cu === void 0 ? void 0 : _focusFirstNodeRef$cu.call(focusFirstNodeRef);
+    },
+    focusActiveNode: function focusActiveNode() {
+      var _focusActiveNodeRef$c;
+      return (_focusActiveNodeRef$c = focusActiveNodeRef.current) === null || _focusActiveNodeRef$c === void 0 ? void 0 : _focusActiveNodeRef$c.call(focusActiveNodeRef);
+    }
+  };
+};
+exports.useTreeImperativeHandle = useTreeImperativeHandle;