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

package/cjs/DateRangePicker/DateRangePicker.js

@@ -55,7 +55,6 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
     defaultValue,
     plaintext,
     disabled,
-    disabledDate: DEPRECATED_disabledDate,
     shouldDisableDate,
     shouldDisableHour,
     shouldDisableMinute,
@@ -70,8 +69,8 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
     locale,
     loading,
     label,
-    menuClassName,
-    menuStyle,
+    popupClassName,
+    popupStyle,
     oneTap,
     placeholder = '',
     placement = 'bottomStart',
@@ -79,8 +78,7 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
     readOnly,
     showOneCalendar = false,
     showWeekNumbers,
-    showMeridian: DEPRECATED_showMeridian,
-    showMeridiem = DEPRECATED_showMeridian,
+    showMeridiem,
     showHeader = true,
     style,
     size,
@@ -99,6 +97,7 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
     onShortcutClick,
     renderTitle,
     renderValue,
+    renderCell,
     ...restProps
   } = propsWithDefaults;
   const id = (0, _hooks.useUniqueId)('rs-', idProp);
@@ -111,7 +110,7 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
   const {
     merge,
     prefix
-  } = (0, _hooks.useClassNames)(classPrefix);
+  } = (0, _hooks.useStyles)(classPrefix);
   const formatStr = format || (locale === null || locale === void 0 ? void 0 : locale.shortDateFormat) || 'yyyy-MM-dd';
   const rangeFormatStr = `${formatStr}${character}${formatStr}`;
   const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
@@ -502,8 +501,7 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
    * Check if the date is disabled
    */
   const isDateDisabled = (0, _useDateDisabled.default)({
-    shouldDisableDate,
-    DEPRECATED_disabledDate
+    shouldDisableDate
   });
 
   /**
@@ -556,6 +554,9 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
     if (selectedDates === void 0) {
       selectedDates = [];
     }
+    if (selectedDates === null) {
+      return false;
+    }
     const [startDate, endDate] = selectedDates;
 
     // Disable if either start or end date is missing
@@ -594,11 +595,9 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
   } : undefined;
   const renderCalendarOverlay = (positionProps, speakerRef) => {
     const {
-      left,
-      top,
       className
     } = positionProps;
-    const classes = merge(className, menuClassName, prefix('popup-daterange'));
+    const classes = merge(className, popupClassName, prefix('popup-daterange'));
     const panelClasses = prefix('daterange-panel', {
       'daterange-panel-show-one-calendar': showOneCalendar,
       'daterange-panel-only-time': onlyShowTime
@@ -611,11 +610,6 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
     const panelStyles = {
       minWidth: showOneCalendar || onlyShowTime ? 'auto' : 528
     };
-    const styles = {
-      ...menuStyle,
-      left,
-      top
-    };
     const calendarProps = {
       locale,
       isoWeek,
@@ -640,7 +634,8 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
       onChangeCalendarMonth,
       onChangeCalendarTime,
       onMouseMove,
-      renderTitle
+      renderTitle,
+      renderCellOnPicker: renderCell
     };
     const getCalendars = () => {
       if (showOneCalendar) {
@@ -663,12 +658,12 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
       className: classes,
       ref: (0, _utils2.mergeRefs)(overlay, speakerRef),
       target: trigger,
-      style: styles
+      style: popupStyle
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: panelClasses,
       style: panelStyles
     }, /*#__PURE__*/_react.default.createElement(_Stack.default, {
-      alignItems: "flex-start"
+      align: "flex-start"
     }, sideRanges.length > 0 && /*#__PURE__*/_react.default.createElement(_PredefinedRanges.default, {
       direction: "column",
       spacing: 0,
@@ -709,6 +704,7 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
   const [classes, usedClassNamePropKeys] = (0, _Picker.usePickerClassName)({
     ...props,
     classPrefix,
+    className,
     name: 'daterange',
     appearance,
     hasValue,
@@ -776,7 +772,7 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
     speaker: renderCalendarOverlay
   }, /*#__PURE__*/_react.default.createElement(Component, {
     ref: root,
-    className: merge(className, classes, {
+    className: merge(classes, {
       [prefix('error')]: invalidValue
     }),
     style: style
@@ -809,6 +805,7 @@ const DateRangePicker = (0, _utils2.forwardRef)((props, ref) => {
     onChange: handleInputChange,
     onKeyDown: handleInputKeyDown
   })), /*#__PURE__*/_react.default.createElement(_Picker.PickerIndicator, {
+    size: size,
     loading: loading,
     caretAs: caretAs,
     onClose: handleClean,

package/cjs/DateRangePicker/Header.js

@@ -12,7 +12,7 @@ var _Button = _interopRequireDefault(require("../Button"));
 function Header(props) {
   const {
     prefix
-  } = (0, _hooks.useClassNames)('picker');
+  } = (0, _hooks.useStyles)('picker');
   const {
     formatStr,
     character,

package/cjs/DateRangePicker/hooks/useDateDisabled.d.ts

@@ -2,7 +2,6 @@ import { DATERANGE_DISABLED_TARGET as TARGET } from '../../internals/constants';
 import { DisabledDateFunction, SelectedDatesState } from '../types';
 interface UseDateDisabledProps {
     shouldDisableDate?: DisabledDateFunction;
-    DEPRECATED_disabledDate?: DisabledDateFunction;
 }
 interface DateDisabledOptions {
     selectDate?: SelectedDatesState;

package/cjs/DateRangePicker/hooks/useDateDisabled.js

@@ -10,8 +10,7 @@ var _react = require("react");
  */
 function useDateDisabled(props) {
   const {
-    shouldDisableDate,
-    DEPRECATED_disabledDate
+    shouldDisableDate
   } = props;
   const isDateDisabled = (0, _react.useCallback)((date, options) => {
     const {
@@ -22,12 +21,9 @@ function useDateDisabled(props) {
     if (typeof shouldDisableDate === 'function') {
       return shouldDisableDate(date, selectDate, selectedDone, target);
     }
-    if (typeof DEPRECATED_disabledDate === 'function') {
-      return DEPRECATED_disabledDate(date, selectDate, selectedDone, target);
-    }
     return false;
-  }, [shouldDisableDate, DEPRECATED_disabledDate]);
-  if (shouldDisableDate || DEPRECATED_disabledDate) {
+  }, [shouldDisableDate]);
+  if (shouldDisableDate) {
     return isDateDisabled;
   }
   return undefined;

package/cjs/DateRangePicker/types.d.ts

@@ -1,5 +1,5 @@
 import { DATERANGE_DISABLED_TARGET } from '../internals/constants';
-export type ValueType = [Date?, Date?];
+export type ValueType = [Date?, Date?] | null;
 export type DateRange = [Date, Date];
 export type DisabledDateFunction = (
 /**

package/cjs/Divider/Divider.d.ts

@@ -1,9 +1,34 @@
-import { WithAsProps } from '../internals/types';
+import React from 'react';
+import type { WithAsProps, Size, Color } from '../internals/types';
 export interface DividerProps extends WithAsProps {
     /**
-     * Vertical dividing line. Cannot be used with text.
+     * The appearance of the divider.
+     */
+    appearance?: 'solid' | 'dashed' | 'dotted';
+    /**
+     * The content of the label.
+     */
+    label?: React.ReactNode;
+    /**
+     * The position of the label.
+     */
+    labelPosition?: 'left' | 'right' | 'center';
+    /**
+     * Vertical dividing line. Cannot be used with label.
      */
     vertical?: boolean;
+    /**
+     * The size of the divider.
+     */
+    size?: Size | number | string;
+    /**
+     * The color of the divider.
+     */
+    color?: Color | React.CSSProperties['color'];
+    /**
+     * The spacing between the divider and its content.
+     */
+    spacing?: Size | number | string;
 }
 /**
  * The Divider component is used to separate content.

package/cjs/Divider/Divider.js

@@ -6,6 +6,7 @@ exports.__esModule = true;
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
+var _StyledBox = _interopRequireDefault(require("../internals/StyledBox"));
 var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
 var _CustomProvider = require("../CustomProvider");
@@ -18,30 +19,40 @@ const Divider = (0, _utils.forwardRef)((props, ref) => {
     propsWithDefaults
   } = (0, _CustomProvider.useCustom)('Divider', props);
   const {
-    as: Component = 'div',
+    as,
+    appearance,
     className,
     classPrefix = 'divider',
     children,
+    color,
+    label = children,
+    labelPosition,
     vertical,
+    spacing,
+    style,
+    size,
     ...rest
   } = propsWithDefaults;
   const {
-    prefix,
-    withClassPrefix,
+    withPrefix,
     merge
-  } = (0, _hooks.useClassNames)(classPrefix);
-  const classes = merge(className, withClassPrefix(vertical ? 'vertical' : 'horizontal', {
-    'with-text': children
-  }));
-  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
-    role: "separator"
-  }, rest, {
+  } = (0, _hooks.useStyles)(classPrefix);
+  const classes = merge(className, withPrefix());
+  const styles = (0, _utils.mergeStyles)(style, (0, _utils.getSizeStyle)(spacing, 'divider', 'spacing'));
+  return /*#__PURE__*/_react.default.createElement(_StyledBox.default, (0, _extends2.default)({
+    as: as,
+    name: "divider",
+    role: "separator",
     ref: ref,
     className: classes,
-    "aria-orientation": vertical ? 'vertical' : 'horizontal'
-  }), children && /*#__PURE__*/_react.default.createElement("span", {
-    className: prefix('inner-text')
-  }, children));
+    style: styles,
+    size: size,
+    color: color,
+    "data-appearance": appearance,
+    "data-orientation": vertical ? 'vertical' : 'horizontal',
+    "data-with-label": label ? 'true' : undefined,
+    "data-position": labelPosition
+  }, rest), label);
 });
 Divider.displayName = 'Divider';
 var _default = exports.default = Divider;

package/cjs/Drawer/Drawer.js

@@ -46,7 +46,7 @@ const Drawer = (0, _utils.forwardRef)((props, ref) => {
   const {
     merge,
     prefix
-  } = (0, _hooks.useClassNames)(classPrefix);
+  } = (0, _hooks.useStyles)(classPrefix);
   const classes = merge(className, prefix(placement));
   const animationProps = {
     placement

package/cjs/Dropdown/Dropdown.d.ts

@@ -4,59 +4,58 @@ import DropdownMenu from './DropdownMenu';
 import DropdownItem from './DropdownItem';
 import DropdownSeparator from './DropdownSeparator';
 import { IconProps } from '@rsuite/icons/Icon';
-import type { PlacementCorners, WithAsProps, InternalRefForwardingComponent } from '../internals/types';
+import type { PlacementCorners, WithAsProps, InternalRefForwardingComponent, SanitizedHTMListProps } from '../internals/types';
 export type DropdownTrigger = 'click' | 'hover' | 'contextMenu';
-export interface DropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect' | 'onToggle' | 'title'> {
-    /** Define the title as a submenu */
-    title?: React.ReactNode;
-    /** Set the icon */
-    icon?: React.ReactElement<IconProps>;
-    /** The option to activate the state, corresponding to the eventkey in the Dropdown.item */
+interface DeprecatedDropdownProps {
+    /**
+     * Deprecated. Use `renderToggle` instead.
+     * @deprecated
+     */
+    renderTitle?: (children: React.ReactNode) => React.ReactNode;
+}
+export interface DropdownProps<T = any> extends WithAsProps, DeprecatedDropdownProps, SanitizedHTMListProps {
+    /** The active option, corresponding to the eventKey in Dropdown.Item */
     activeKey?: T;
-    /** Triggering events */
-    trigger?: DropdownTrigger | DropdownTrigger[];
-    /** The placement of Menu */
-    placement?: PlacementCorners;
-    /** Whether or not component is disabled */
+    /** Default open state */
+    defaultOpen?: boolean;
+    /** Whether to disable the component */
     disabled?: boolean;
-    /** The style of the menu */
-    menuStyle?: React.CSSProperties;
-    /** A css class to apply to the Toggle DOM node */
-    toggleClassName?: string;
     /** The value of the current option */
     eventKey?: T;
-    /** You can use a custom element type for this toggle component */
-    toggleAs?: React.ElementType;
-    /** No caret variation */
+    /** Set icon */
+    icon?: React.ReactElement<IconProps>;
+    /** Menu style */
+    menuStyle?: React.CSSProperties;
+    /** Do not display caret */
     noCaret?: boolean;
-    /**
-     * Controlled open state
-     */
+    /** Controlled open state */
     open?: boolean;
-    /**
-     * Whether dropdown is initially open
-     */
-    defaultOpen?: boolean;
-    /**
-     * @deprecated
-     */
-    renderTitle?: (children: React.ReactNode) => React.ReactNode;
-    /** Custom Toggle */
+    /** Menu position */
+    placement?: PlacementCorners;
+    /** Define the title of the submenu */
+    title?: React.ReactNode;
+    /** Toggle component class name */
+    toggleClassName?: string;
+    /** Custom element type can be used for this toggle component */
+    toggleAs?: React.ElementType;
+    /** Trigger event */
+    trigger?: DropdownTrigger | DropdownTrigger[];
+    /** Custom toggle component */
     renderToggle?: (props: WithAsProps, ref: React.Ref<any>) => any;
-    /** The callback function that the menu closes */
+    /** Callback function for closing the menu */
     onClose?: () => void;
-    /** Menu Pop-up callback function */
+    /** Callback function for opening the menu */
     onOpen?: () => void;
-    /** Callback function for menu state switching */
-    onToggle?: (open?: boolean) => void;
-    /** Selected callback function */
+    /** Selection callback function */
     onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
+    /** Callback function for menu state toggle */
+    onToggle?: (open?: boolean) => void;
 }
 export interface DropdownComponent extends InternalRefForwardingComponent<'div', DropdownProps> {
     <ToggleAs extends React.ElementType = typeof Button>(props: DropdownProps & {
         ref?: React.Ref<any>;
         toggleAs?: ToggleAs;
-    } & React.ComponentProps<ToggleAs>, context: any): JSX.Element | null;
+    } & React.ComponentProps<ToggleAs>, context: any): React.ReactElement | null;
     Item: typeof DropdownItem;
     Menu: typeof DropdownMenu;
     Separator: typeof DropdownSeparator;

package/cjs/Dropdown/Dropdown.js

@@ -14,7 +14,6 @@ var _DropdownSeparator = _interopRequireDefault(require("./DropdownSeparator"));
 var _DropdownContext = _interopRequireDefault(require("./DropdownContext"));
 var _Menu = _interopRequireDefault(require("../internals/Menu/Menu"));
 var _DropdownToggle = _interopRequireDefault(require("./DropdownToggle"));
-var _kebabCase = _interopRequireDefault(require("lodash/kebabCase"));
 var _NavContext = _interopRequireDefault(require("../Nav/NavContext"));
 var _Nav = _interopRequireDefault(require("../Nav"));
 var _hooks = require("../internals/hooks");
@@ -65,12 +64,12 @@ const Dropdown = (0, _utils.forwardRef)((props, ref) => {
   const nav = (0, _react.useContext)(_NavContext.default);
   const {
     merge,
-    withClassPrefix
-  } = (0, _hooks.useClassNames)(classPrefix);
+    withPrefix
+  } = (0, _hooks.useStyles)(classPrefix);
   const {
-    withClassPrefix: withMenuClassPrefix,
+    withPrefix: withMenuClassPrefix,
     merge: mergeMenuClassName
-  } = (0, _hooks.useClassNames)('dropdown-menu');
+  } = (0, _hooks.useStyles)('dropdown-menu');
   const menuButtonTriggers = (0, _react.useMemo)(() => {
     if (!trigger) {
       return undefined;
@@ -150,18 +149,17 @@ const Dropdown = (0, _utils.forwardRef)((props, ref) => {
       open,
       ...menuContainer
     } = _ref2;
-    const classes = merge(className, withClassPrefix({
-      [`placement-${(0, _kebabCase.default)((0, _utils.placementPolyfill)(placement))}`]: !!placement,
+    const classes = merge(className, withPrefix({
       disabled,
-      open,
-      'selected-within': hasSelectedItem
+      open
     }));
     return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
       ref: (0, _utils.mergeRefs)(ref, menuContainerRef),
-      className: classes
-    }, menuContainer, (0, _pick.default)(toggleProps, ['data-testid']), {
-      style: style
-    }));
+      className: classes,
+      style: style,
+      "data-placement": (0, _utils.kebabPlace)(placement),
+      "data-active-descendant": hasSelectedItem
+    }, menuContainer, (0, _pick.default)(toggleProps, ['data-testid'])));
   }));
 }, Subcomponents);
 Dropdown.displayName = 'Dropdown';

package/cjs/Dropdown/DropdownItem.d.ts

@@ -1,21 +1,22 @@
 import React from 'react';
 import type { IconProps } from '@rsuite/icons/Icon';
-import type { WithAsProps } from '../internals/types';
-export interface DropdownMenuItemProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
-    /** Active the current option */
-    active?: boolean;
-    /** Primary content */
-    children?: React.ReactNode;
-    /** You can use a custom element for this component */
-    as?: React.ElementType;
+import type { WithAsProps, HTMLPropsWithoutSelect } from '../internals/types';
+import type { DeprecatedDropdownItemProps } from './types';
+interface DeprecatedDropdownMenuItemProps extends DeprecatedDropdownItemProps {
     /**
      * Whether to display the divider
      *
      * @deprecated Use dedicated <Dropdown.Separator> component instead
      */
     divider?: boolean;
+}
+export interface DropdownMenuItemProps<T = any> extends WithAsProps, DeprecatedDropdownMenuItemProps, HTMLPropsWithoutSelect {
+    /** Active the current option */
+    active?: boolean;
     /** Disable the current option */
     disabled?: boolean;
+    /** The description of the current option */
+    description?: React.ReactNode;
     /** The value of the current option */
     eventKey?: T;
     /** Displays a custom panel */
@@ -24,17 +25,6 @@ export interface DropdownMenuItemProps<T = any> extends WithAsProps, Omit<React.
     icon?: React.ReactElement<IconProps>;
     /** The submenu that this menuitem controls (if exists) */
     submenu?: React.ReactElement;
-    /**
-     * The sub-level menu appears from the right side by default, and when `pullLeft` is set, it appears from the left.
-     * @deprecated Submenus are now pointing the same direction.
-     */
-    pullLeft?: boolean;
-    /**
-     * Whether the submenu is opened.
-     * @deprecated
-     * @internal
-     */
-    open?: boolean;
     /**
      * The dropdown item keyboard shortcut.
      *

package/cjs/Dropdown/DropdownItem.js

@@ -15,10 +15,10 @@ var _Nav = _interopRequireDefault(require("../Nav"));
 var _NavContext = _interopRequireDefault(require("../Nav/NavContext"));
 var _Text = _interopRequireDefault(require("../Text"));
 var _DropdownSeparator = _interopRequireDefault(require("./DropdownSeparator"));
+var _useRenderMenuItem = require("../internals/Menu/useRenderMenuItem");
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
 var _DropdownState = require("./DropdownState");
-var _useRenderDropdownItem = require("./useRenderDropdownItem");
 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; }
 /**
@@ -28,18 +28,19 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  */
 const DropdownItem = (0, _utils.forwardRef)((props, ref) => {
   const {
+    as: Component = 'li',
+    active: activeProp,
     classPrefix = 'dropdown-item',
     className,
+    children,
     shortcut,
-    active: activeProp,
+    disabled,
+    description,
+    divider,
     eventKey,
-    onSelect,
     icon,
-    as: Component = 'li',
-    divider,
     panel,
-    children,
-    disabled,
+    onSelect,
     ...restProps
   } = props;
   const internalId = (0, _hooks.useInternalId)('DropdownItem');
@@ -47,9 +48,9 @@ const DropdownItem = (0, _utils.forwardRef)((props, ref) => {
   const dropdown = (0, _react.useContext)(_DropdownContext.default);
   const {
     merge,
-    withClassPrefix,
+    withPrefix,
     prefix
-  } = (0, _hooks.useClassNames)(classPrefix);
+  } = (0, _hooks.useStyles)(classPrefix);
   const handleSelectItem = (0, _react.useCallback)(event => {
     var _dropdown$onSelect;
     onSelect === null || onSelect === void 0 || onSelect(eventKey, event);
@@ -78,7 +79,7 @@ const DropdownItem = (0, _utils.forwardRef)((props, ref) => {
       };
     }
   }, [internalId, selected, dispatch]);
-  const renderDropdownItem = (0, _useRenderDropdownItem.useRenderDropdownItem)(Component);
+  const renderDropdownItem = (0, _useRenderMenuItem.useRenderMenuItem)(Component);
 
   // If using <Dropdown.Item> within <Nav>
   // Suggest <Nav.Item>
@@ -111,7 +112,7 @@ const DropdownItem = (0, _utils.forwardRef)((props, ref) => {
       active,
       ...menuitem
     } = _ref;
-    const classes = merge(className, withClassPrefix({
+    const classes = merge(className, withPrefix({
       'with-icon': icon,
       active: selected,
       disabled,
@@ -133,10 +134,14 @@ const DropdownItem = (0, _utils.forwardRef)((props, ref) => {
       ...restProps,
       children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, icon && /*#__PURE__*/_react.default.cloneElement(icon, {
         className: (0, _classnames.default)(prefix('menu-icon'), icon.props.className)
-      }), /*#__PURE__*/_react.default.createElement(_Text.default, {
-        as: "span",
+      }), /*#__PURE__*/_react.default.createElement("div", {
         className: prefix('content')
-      }, children), shortcut && /*#__PURE__*/_react.default.createElement(_Text.default, {
+      }, /*#__PURE__*/_react.default.createElement(_Text.default, {
+        as: "span"
+      }, children), /*#__PURE__*/_react.default.createElement(_Text.default, {
+        as: "span",
+        muted: true
+      }, description)), shortcut && /*#__PURE__*/_react.default.createElement(_Text.default, {
         as: "kbd",
         className: prefix('shortcut'),
         muted: true

package/cjs/Dropdown/DropdownMenu.d.ts

@@ -1,25 +1,24 @@
 import React from 'react';
-import type { StandardProps } from '../internals/types';
+import type { StandardProps, SanitizedHTMListProps } from '../internals/types';
 import type { IconProps } from '@rsuite/icons/Icon';
 export interface DropdownMenuProps<T = string | number> extends StandardProps {
     /** Define the title as a submenu */
     title?: React.ReactNode;
-    /** The submenu expands from the left and defaults to the right */
-    pullLeft?: boolean;
-    /**
-     *  Only used for setting the default expand state when it's a submenu.
-     */
+    /** Only used for setting the default expand state when it's a submenu */
     eventKey?: T;
-    /** Set the icon */
+    /** Set the icon for the dropdown menu */
     icon?: React.ReactElement<IconProps>;
-    open?: boolean;
-    collapsible?: boolean;
-    expanded?: boolean;
+    /** Set the active state of the dropdown menu */
     active?: boolean;
+    /** Disable the dropdown menu */
     disabled?: boolean;
+    /** Set the active key for the dropdown menu */
     activeKey?: T;
+    /** Define the trigger action for the dropdown menu */
     trigger?: 'hover' | 'click';
+    /** Callback function when an item is selected */
     onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
+    /** Callback function when the dropdown menu is toggled */
     onToggle?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
 }
 /**
@@ -40,5 +39,5 @@ export interface DropdownMenuProps<T = string | number> extends StandardProps {
  *   </Dropdown.Menu>
  * </Dropdown>
  */
-declare const DropdownMenu: React.ForwardRefExoticComponent<DropdownMenuProps<string | number> & Omit<React.HTMLAttributes<HTMLUListElement>, "title" | "onSelect"> & React.RefAttributes<HTMLElement>>;
+declare const DropdownMenu: React.ForwardRefExoticComponent<DropdownMenuProps<string | number> & SanitizedHTMListProps<HTMLElement, React.HTMLAttributes<HTMLElement>> & React.RefAttributes<HTMLElement>>;
 export default DropdownMenu;