rsuite 6.0.0-canary-2025011413 → 6.0.0-canary-2025031415

package/cjs/internals/Overlay/Overlay.d.ts

@@ -1,22 +1,21 @@
 import React from 'react';
-import { PositionChildProps } from './Position';
 import type { Placement, AnimationEventProps } from '../types';
-import type { CursorPosition } from './types';
+import type { CursorPosition, PositionChildProps } from './types';
 export interface OverlayProps extends AnimationEventProps {
     container?: HTMLElement | (() => HTMLElement | null) | null;
     children: React.ReactElement | ((props: PositionChildProps & React.HTMLAttributes<HTMLElement>, ref: React.RefCallback<HTMLElement>) => React.ReactElement);
     childrenProps?: React.HTMLAttributes<HTMLElement>;
     className?: string;
+    cursorPosition?: CursorPosition | null;
     containerPadding?: number;
+    followCursor?: boolean;
+    open?: boolean;
     placement?: Placement;
     preventOverflow?: boolean;
-    open?: boolean;
     rootClose?: boolean;
-    transition?: React.ElementType;
     triggerTarget?: React.RefObject<any>;
+    transition?: React.ElementType;
     onClose?: React.ReactEventHandler;
-    followCursor?: boolean;
-    cursorPosition?: CursorPosition | null;
 }
 /**
  * Overlay is a powerful component that helps you create floating components.

package/cjs/internals/Overlay/Overlay.js

@@ -8,8 +8,8 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _Fade = _interopRequireDefault(require("../../Animation/Fade"));
-var _OverlayContext = _interopRequireDefault(require("./OverlayContext"));
-var _Position = _interopRequireDefault(require("./Position"));
+var _Position = _interopRequireWildcard(require("./Position"));
+var _OverlayProvider = require("./OverlayProvider");
 var _hooks = require("../hooks");
 var _utils = require("../utils");
 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); }
@@ -21,7 +21,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 const Overlay = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const {
     overlayContainer
-  } = (0, _react.useContext)(_OverlayContext.default);
+  } = (0, _OverlayProvider.useOverlay)();
   const {
     container = overlayContainer,
     containerPadding,
@@ -73,29 +73,34 @@ const Overlay = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     cursorPosition
   };
   const renderChildWithPosition = (transitionProps, transitionRef) => {
+    const {
+      className
+    } = transitionProps || {};
     return /*#__PURE__*/_react.default.createElement(_Position.default, (0, _extends2.default)({}, positionProps, transitionProps, {
       ref: (0, _utils.mergeRefs)(ref, transitionRef)
-    }), (childProps, childRef) => {
-      // overlayTarget is the ref on the DOM of the Overlay.
-      if (typeof children === 'function') {
-        return children(Object.assign(childProps, childrenProps), (0, _utils.mergeRefs)(childRef, overlayTarget));
-      }
-
+    }), (positionChildProps, childRef) => {
       // Position will return coordinates and className
       const {
         left,
-        top,
-        className
-      } = childProps;
-      return /*#__PURE__*/_react.default.cloneElement(children, {
+        top
+      } = positionChildProps;
+
+      // Components returned by function children need to control their own positioning information. For example: Picker
+      if (typeof children === 'function') {
+        return children({
+          className,
+          //dataAttributes,
+          ...positionChildProps,
+          ...childrenProps
+        }, (0, _utils.mergeRefs)(childRef, overlayTarget));
+      }
+      const childElement = children;
+      const childStyles = (0, _utils.mergeStyles)((0, _Position.getPositionStyle)(left, top), childElement.props.style);
+      return /*#__PURE__*/_react.default.cloneElement(childElement, {
         ...childrenProps,
-        ...children.props,
-        className: (0, _classnames.default)(className, children.props.className),
-        style: {
-          left,
-          top,
-          ...children.props.style
-        },
+        ...childElement.props,
+        className: (0, _classnames.default)(childElement.props.className, className),
+        style: childStyles,
         ref: (0, _utils.mergeRefs)(childRef, overlayTarget)
       });
     });

package/cjs/internals/Overlay/OverlayProvider.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export interface OverlayContextProps {
+    overlayContainer?: () => HTMLElement | null;
+}
+interface OverlayProviderProps extends OverlayContextProps {
+    children: React.ReactNode;
+}
+export declare const OverlayProvider: {
+    (props: OverlayProviderProps): React.JSX.Element;
+    displayName: string;
+};
+export declare const useOverlay: () => OverlayContextProps;
+export {};

package/cjs/internals/Overlay/OverlayProvider.js

@@ -0,0 +1,24 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.useOverlay = exports.OverlayProvider = void 0;
+var _react = _interopRequireWildcard(require("react"));
+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; }
+const OverlayContext = /*#__PURE__*/_react.default.createContext({});
+const OverlayProvider = props => {
+  const {
+    overlayContainer,
+    children
+  } = props;
+  return /*#__PURE__*/_react.default.createElement(OverlayContext.Provider, {
+    value: {
+      overlayContainer
+    }
+  }, children);
+};
+exports.OverlayProvider = OverlayProvider;
+const useOverlay = () => (0, _react.useContext)(OverlayContext);
+exports.useOverlay = useOverlay;
+OverlayProvider.displayName = 'OverlayProvider';

package/cjs/internals/Overlay/OverlayTrigger.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="node" />
 import React from 'react';
 import type { AnimationEventProps, StandardProps, Placement } from '../types';
-import type { PositionChildProps } from './Position';
+import type { OverlayTriggerHandle, PositionChildProps } from './types';
 export type OverlayTriggerType = 'click' | 'hover' | 'focus' | 'active' | 'contextMenu' | 'none';
 export interface OverlayTriggerProps extends Omit<StandardProps, 'children'>, AnimationEventProps {
     /** Triggering events */
@@ -72,15 +72,6 @@ export declare enum OverlayCloseCause {
     ClickOutside = 0,
     ImperativeHandle = 1
 }
-export interface OverlayTriggerHandle {
-    root?: HTMLElement | null;
-    updatePosition: () => void;
-    open: (delay?: number) => void;
-    close: (delay?: number) => void;
-    getState: () => {
-        open?: boolean;
-    };
-}
 /**
  * OverlayTrigger is used to display floating elements on another component.
  * @private

package/cjs/internals/Overlay/OverlayTrigger.js

@@ -10,8 +10,8 @@ var _get = _interopRequireDefault(require("lodash/get"));
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
 var _isUndefined = _interopRequireDefault(require("lodash/isUndefined"));
 var _contains = _interopRequireDefault(require("dom-lib/contains"));
-var _OverlayContext = _interopRequireDefault(require("./OverlayContext"));
 var _Overlay = _interopRequireDefault(require("./Overlay"));
+var _OverlayProvider = require("./OverlayProvider");
 var _hooks = require("../hooks");
 var _utils = require("../utils");
 var _ReactChildren = require("../utils/ReactChildren");
@@ -66,7 +66,7 @@ const defaultTrigger = ['hover', 'focus'];
 const OverlayTrigger = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const {
     overlayContainer
-  } = (0, _react.useContext)(_OverlayContext.default);
+  } = (0, _OverlayProvider.useOverlay)();
   const {
     children,
     container = overlayContainer,
@@ -104,7 +104,7 @@ const OverlayTrigger = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     container
   });
   const triggerRef = (0, _react.useRef)(null);
-  const overlayRef = (0, _react.useRef)();
+  const overlayRef = (0, _react.useRef)(null);
   const [open, setOpen] = (0, _hooks.useControlled)(openProp, defaultOpen);
   const [cursorPosition, setCursorPosition] = (0, _react.useState)(null);
 
@@ -363,10 +363,11 @@ const OverlayTrigger = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
         "aria-describedby": controlId
       }, triggerEvents), children);
     }
-    return /*#__PURE__*/(0, _react.cloneElement)(children, {
+    const childElement = children;
+    return /*#__PURE__*/(0, _react.cloneElement)(childElement, {
       ref: triggerRef,
       'aria-describedby': controlId,
-      ...mergeEvents(triggerEvents, children.props)
+      ...mergeEvents(triggerEvents, childElement.props)
     });
   }, [children, controlId, triggerEvents]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, triggerElement, /*#__PURE__*/_react.default.createElement(Portal, null, renderOverlay()));

package/cjs/internals/Overlay/Position.d.ts

@@ -1,16 +1,12 @@
 import React from 'react';
 import type { Placement } from '../types';
-import type { CursorPosition } from './types';
-export interface PositionChildProps {
-    className: string;
-    left?: number;
-    top?: number;
-    arrowOffsetLeft?: number;
-    arrowOffsetTop?: number;
-}
+import type { CursorPosition, PositionChildProps } from './types';
+export declare const getPositionStyle: (x?: number, y?: number) => {
+    "--rs-position-x": string | undefined;
+    "--rs-position-y": string | undefined;
+};
 export interface PositionProps {
-    children: (props: PositionChildProps, ref: React.RefObject<HTMLElement>) => React.ReactElement;
-    className?: string;
+    children: (props: PositionChildProps, ref: React.RefObject<HTMLElement | null>) => React.ReactElement;
     container?: HTMLElement | (() => HTMLElement | null) | null;
     containerPadding?: number;
     placement?: Placement;

package/cjs/internals/Overlay/Position.js

@@ -3,14 +3,11 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
-exports.default = void 0;
+exports.getPositionStyle = exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
 var _getContainer = _interopRequireDefault(require("dom-lib/getContainer"));
 var _ownerDocument = _interopRequireDefault(require("dom-lib/ownerDocument"));
-var _removeClass = _interopRequireDefault(require("dom-lib/removeClass"));
 var _on = _interopRequireDefault(require("dom-lib/on"));
-var _addClass = _interopRequireDefault(require("dom-lib/addClass"));
 var _addStyle = _interopRequireDefault(require("dom-lib/addStyle"));
 var _isElement = _interopRequireDefault(require("../../DOMHelper/isElement"));
 var _positionUtils = _interopRequireDefault(require("./positionUtils"));
@@ -19,6 +16,15 @@ var _utils = require("../utils");
 var _hooks = require("../hooks");
 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; }
+const CSS_POSITION_X = '--rs-position-x';
+const CSS_POSITION_Y = '--rs-position-y';
+const getPositionStyle = (x, y) => {
+  return {
+    [CSS_POSITION_X]: x !== undefined ? `${x}px` : undefined,
+    [CSS_POSITION_Y]: y !== undefined ? `${y}px` : undefined
+  };
+};
+exports.getPositionStyle = getPositionStyle;
 const usePosition = (props, ref) => {
   const {
     placement = 'right',
@@ -31,8 +37,9 @@ const usePosition = (props, ref) => {
   } = props;
   const containerRef = (0, _react.useRef)(null);
   const lastTargetRef = (0, _react.useRef)(null);
-  const overlayResizeObserver = (0, _react.useRef)();
+  const overlayResizeObserver = (0, _react.useRef)(null);
   const defaultPosition = {
+    placement,
     positionLeft: 0,
     positionTop: 0,
     arrowOffsetLeft: undefined,
@@ -70,16 +77,10 @@ const usePosition = (props, ref) => {
     const containerElement = (0, _getContainer.default)(typeof container === 'function' ? container() : container !== null && container !== void 0 ? container : null, (0, _ownerDocument.default)(ref.current).body);
     const posi = utils.calcOverlayPosition(overlay, targetElement, containerElement, followCursor ? cursorPosition : undefined);
     if (forceUpdateDOM && overlay) {
-      var _overlay$className;
-      const preClassName = overlay === null || overlay === void 0 || (_overlay$className = overlay.className) === null || _overlay$className === void 0 || (_overlay$className = _overlay$className.match(/(placement-\S+)/)) === null || _overlay$className === void 0 ? void 0 : _overlay$className[0];
-      (0, _removeClass.default)(overlay, preClassName);
-      if (posi.positionClassName) {
-        (0, _addClass.default)(overlay, posi.positionClassName);
+      (0, _addStyle.default)(overlay, getPositionStyle(posi.positionLeft, posi.positionTop));
+      if (posi.placement) {
+        overlay.dataset.placement = (0, _utils.kebabPlace)(posi.placement);
       }
-      (0, _addStyle.default)(overlay, {
-        left: `${posi.positionLeft}px`,
-        top: `${posi.positionTop}px`
-      });
     } else {
       setPosition(posi);
     }
@@ -121,18 +122,17 @@ const usePosition = (props, ref) => {
 const Position = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const {
     children,
-    className,
     followCursor,
     cursorPosition
   } = props;
   const childRef = _react.default.useRef(null);
   const [position, updatePosition] = usePosition(props, childRef);
   const {
-    positionClassName,
     arrowOffsetLeft,
     arrowOffsetTop,
     positionLeft,
-    positionTop
+    positionTop,
+    placement
   } = position;
   (0, _react.useImperativeHandle)(ref, () => ({
     get child() {
@@ -146,7 +146,7 @@ const Position = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
   }, [followCursor, cursorPosition, updatePosition]);
   if (typeof children === 'function') {
     const childProps = {
-      className: (0, _classnames.default)(className, positionClassName),
+      placement,
       arrowOffsetLeft,
       arrowOffsetTop,
       left: positionLeft,

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

@@ -1,3 +1,5 @@
 import Overlay from './Overlay';
 export type { OverlayProps } from './Overlay';
+export * from './types';
+export { Overlay };
 export default Overlay;

package/cjs/internals/Overlay/index.js

@@ -3,6 +3,19 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
+var _exportNames = {
+  Overlay: true
+};
 exports.default = void 0;
 var _Overlay = _interopRequireDefault(require("./Overlay"));
+exports.Overlay = _Overlay.default;
+var _types = require("./types");
+Object.keys(_types).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _types[key]) return;
+  exports[key] = _types[key];
+});
+// export types
+// export components
 var _default = exports.default = _Overlay.default;

package/cjs/internals/Overlay/positionUtils.d.ts

@@ -1,29 +1,11 @@
-import type { Offset, Placement } from '../types';
-import type { CursorPosition } from './types';
-export interface PositionType {
-    positionLeft?: number;
-    positionTop?: number;
-    arrowOffsetLeft?: number;
-    arrowOffsetTop?: number;
-    positionClassName?: string;
-}
-export interface UtilProps {
-    placement: Placement;
-    preventOverflow: boolean;
-    padding: number;
-}
+import type { Offset } from '../types';
+import type { CursorPosition, UtilProps, PositionType } from './types';
 export declare const AutoPlacement: {
     left: string;
     right: string;
     top: string;
     bottom: string;
 };
-export interface Dimensions {
-    width: number;
-    height: number;
-    scrollX: number;
-    scrollY: number;
-}
 declare const _default: (props: UtilProps) => {
     getPosition(target: HTMLElement, container: HTMLElement): import("dom-lib/getOffset").Offset | DOMRect | null;
     getCursorOffsetPosition(target: HTMLElement, container: HTMLElement, cursorPosition: CursorPosition): Offset;

package/cjs/internals/Overlay/positionUtils.js

@@ -6,7 +6,6 @@ exports.__esModule = true;
 exports.default = exports.AutoPlacement = void 0;
 var _maxBy = _interopRequireDefault(require("lodash/maxBy"));
 var _minBy = _interopRequireDefault(require("lodash/minBy"));
-var _kebabCase = _interopRequireDefault(require("lodash/kebabCase"));
 var _ownerDocument = _interopRequireDefault(require("dom-lib/ownerDocument"));
 var _getOffset = _interopRequireDefault(require("dom-lib/getOffset"));
 var _scrollTop = _interopRequireDefault(require("dom-lib/scrollTop"));
@@ -20,6 +19,7 @@ const AutoPlacement = exports.AutoPlacement = {
   top: 'Start',
   bottom: 'End'
 };
+
 /**
  * Get the external dimensions of the container
  * @param containerNode
@@ -299,11 +299,11 @@ var _default = props => {
         positionTop = nextTop + getTopDelta(nextTop, overlayHeight, container);
       }
       return {
+        placement: nextPlacement,
         positionLeft,
         positionTop,
         arrowOffsetLeft,
-        arrowOffsetTop,
-        positionClassName: `placement-${(0, _kebabCase.default)(nextPlacement)}`
+        arrowOffsetTop
       };
     }
   };

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

@@ -1,6 +1,43 @@
+import type { Placement } from '../types';
 export type CursorPosition = {
     top: number;
     left: number;
     clientTop: number;
     clientLeft: number;
 };
+export interface PositionType {
+    placement: Placement;
+    positionLeft?: number;
+    positionTop?: number;
+    arrowOffsetLeft?: number;
+    arrowOffsetTop?: number;
+}
+export interface UtilProps {
+    placement: Placement;
+    preventOverflow: boolean;
+    padding: number;
+}
+export interface Dimensions {
+    width: number;
+    height: number;
+    scrollX: number;
+    scrollY: number;
+}
+export interface OverlayTriggerHandle {
+    root?: HTMLElement | null;
+    updatePosition: () => void;
+    open: (delay?: number) => void;
+    close: (delay?: number) => void;
+    getState: () => {
+        open?: boolean;
+    };
+}
+export interface PositionChildProps {
+    className?: string;
+    dataAttributes?: Record<string, string>;
+    placement: Placement;
+    left?: number;
+    top?: number;
+    arrowOffsetLeft?: number;
+    arrowOffsetTop?: number;
+}

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { CheckboxProps } from '../../Checkbox';
-import type { WithAsProps } from '../types';
-export interface ListCheckItemProps extends WithAsProps, Omit<CheckboxProps, 'onSelect'> {
+import type { WithAsProps, PropsWithoutSelect } from '../types';
+export interface ListCheckItemProps extends WithAsProps, PropsWithoutSelect<CheckboxProps> {
     active?: boolean;
     checkboxAs?: React.ElementType | string;
     focus?: boolean;

package/cjs/internals/Picker/ListCheckItem.js

@@ -48,11 +48,11 @@ const ListCheckItem = (0, _utils.forwardRef)((props, ref) => {
     id
   } = (0, _useCombobox.default)();
   const {
-    withClassPrefix,
+    withPrefix,
     merge,
     rootPrefix
-  } = (0, _hooks.useClassNames)(classPrefix);
-  const checkboxItemClasses = withClassPrefix({
+  } = (0, _hooks.useStyles)(classPrefix);
+  const checkboxItemClasses = withPrefix({
     focus
   });
   const checkboxProps = {

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

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { WithAsProps } from '../types';
-export interface ListItemProps extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
+import type { WithAsProps, HTMLPropsWithoutSelect } from '../types';
+export interface ListItemProps extends WithAsProps, HTMLPropsWithoutSelect {
     active?: boolean;
     disabled?: boolean;
     value?: string | number;

package/cjs/internals/Picker/ListItem.js

@@ -35,11 +35,11 @@ const ListItem = (0, _utils.forwardRef)((props, ref) => {
     }
   });
   const {
-    withClassPrefix,
+    withPrefix,
     merge,
     rootPrefix
-  } = (0, _hooks.useClassNames)(classPrefix);
-  const classes = withClassPrefix({
+  } = (0, _hooks.useStyles)(classPrefix);
+  const classes = withPrefix({
     active,
     focus,
     disabled

package/cjs/internals/Picker/ListItemGroup.js

@@ -17,11 +17,11 @@ const ListItemGroup = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     ...rest
   } = props;
   const {
-    withClassPrefix,
+    withPrefix,
     prefix,
     merge
-  } = (0, _hooks.useClassNames)(classPrefix);
-  const classes = merge(className, withClassPrefix());
+  } = (0, _hooks.useStyles)(classPrefix);
+  const classes = merge(className, withPrefix());
   return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
     role: "group"
   }, rest, {

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

@@ -1,8 +1,8 @@
 import React from 'react';
 import { ListProps, ListHandle } from '../Windowing';
 import { RSUITE_PICKER_GROUP_KEY } from '../symbols';
-import { StandardProps, ItemDataType, DataProps } from '../types';
-interface InnerItemDataType extends ItemDataType {
+import type { StandardProps, Option, DataProps, HTMLPropsWithoutSelect } from '../types';
+interface InnerOption extends Option {
     [RSUITE_PICKER_GROUP_KEY]?: boolean;
 }
 /**
@@ -12,7 +12,7 @@ interface InnerItemDataType extends ItemDataType {
  * Props for the Listbox component.
  * @template Multiple - Whether multiple selection is enabled.
  */
-export interface ListboxProps<Multiple = false> extends StandardProps, Partial<DataProps<InnerItemDataType>>, Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {
+export interface ListboxProps<Multiple = false> extends StandardProps, Partial<DataProps<InnerOption>>, HTMLPropsWithoutSelect {
     groupBy?: string;
     disabledItemValues?: any[];
     activeItemValues?: any[];
@@ -40,14 +40,14 @@ export interface ListboxProps<Multiple = false> extends StandardProps, Partial<D
      * @param item - The selected item.
      * @returns The rendered React node.
      */
-    renderMenuItem?: (itemLabel: React.ReactNode, item: any) => React.ReactNode;
+    renderOption?: (itemLabel: React.ReactNode, item: any) => React.ReactNode;
     /**
      * Custom function to render a menu group.
      * @param title - The title of the group.
      * @param item - The group item.
      * @returns The rendered React node.
      */
-    renderMenuGroup?: (title: React.ReactNode, item: any) => React.ReactNode;
+    renderOptionGroup?: (title: React.ReactNode, item: any) => React.ReactNode;
     /**
      * Event handler for selecting an option.
      * @param value - The selected value.

package/cjs/internals/Picker/Listbox.js

@@ -16,14 +16,14 @@ var _scrollTop = _interopRequireDefault(require("dom-lib/scrollTop"));
 var _getHeight = _interopRequireDefault(require("dom-lib/getHeight"));
 var _get = _interopRequireDefault(require("lodash/get"));
 var _classnames = _interopRequireDefault(require("classnames"));
+var _ListItemGroup = _interopRequireDefault(require("./ListItemGroup"));
+var _useCombobox = _interopRequireDefault(require("./hooks/useCombobox"));
+var _Highlight = _interopRequireDefault(require("../../Highlight"));
 var _Windowing = require("../Windowing");
 var _symbols = require("../symbols");
 var _hooks = require("../hooks");
 var _utils = require("../utils");
 var _getDataGroupBy = require("../utils/getDataGroupBy");
-var _ListItemGroup = _interopRequireDefault(require("./ListItemGroup"));
-var _useCombobox = _interopRequireDefault(require("./hooks/useCombobox"));
-var _Highlight = _interopRequireDefault(require("../../Highlight"));
 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; }
 /**
@@ -56,20 +56,20 @@ const Listbox = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     rowHeight = 36,
     rowGroupHeight = 48,
     query,
-    renderMenuGroup,
-    renderMenuItem,
+    renderOptionGroup,
+    renderOption,
     onGroupTitleClick,
     onSelect,
     ...rest
   } = props;
   const {
-    withClassPrefix,
+    withPrefix,
     prefix,
     merge,
     rootPrefix
-  } = (0, _hooks.useClassNames)(classPrefix);
+  } = (0, _hooks.useStyles)(classPrefix);
   const groupable = typeof groupBy !== 'undefined';
-  const classes = merge(className, withClassPrefix('items', {
+  const classes = merge(className, withPrefix('items', {
     grouped: groupable
   }));
   const {
@@ -166,7 +166,7 @@ const Listbox = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
         }),
         key: `group-${groupValue}`,
         onClick: handleGroupTitleClick.bind(null, groupValue)
-      }, renderMenuGroup ? renderMenuGroup(groupValue, item) : groupValue);
+      }, renderOptionGroup ? renderOptionGroup(groupValue, item) : groupValue);
     } else if ((0, _isUndefined.default)(value) && !(0, _isUndefined.default)(item[_symbols.RSUITE_PICKER_GROUP_KEY])) {
       throw Error(`valueKey "${valueKey}" is not defined in "data" : ${index} `);
     }
@@ -184,7 +184,7 @@ const Listbox = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
       value: value,
       classPrefix: listItemClassPrefix,
       onSelect: handleSelect.bind(null, item)
-    }, (0, _pickBy.default)(listItemProps, v => v !== undefined)), renderMenuItem ? renderMenuItem(label, item) : label);
+    }, (0, _pickBy.default)(listItemProps, v => v !== undefined)), renderOption ? renderOption(label, item) : label);
   };
   (0, _hooks.useMount)(() => {
     var _listRef$current, _listRef$current$scro;

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

@@ -1,11 +1,13 @@
 import React from 'react';
+import type { Size } from '../types';
 interface PickerIndicatorProps {
     loading?: boolean;
     caretAs?: React.ElementType | null;
     onClose?: (event: React.MouseEvent<HTMLElement>) => void;
     showCleanButton?: boolean;
     disabled?: boolean;
+    size?: Size;
     as?: React.ElementType;
 }
-declare const PickerIndicator: ({ loading, caretAs, onClose, showCleanButton, as: Component, disabled }: PickerIndicatorProps) => React.JSX.Element;
+declare const PickerIndicator: ({ loading, caretAs, onClose, showCleanButton, as: Component, disabled, size }: PickerIndicatorProps) => React.JSX.Element;
 export default PickerIndicator;