rsuite 5.4.1 → 5.5.0

package/esm/Affix/Affix.js

@@ -3,7 +3,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import PropTypes from 'prop-types';
 import getOffset from 'dom-lib/getOffset';
-import { mergeRefs, useClassNames, useElementResize, useEventListener } from '../utils';
+import { mergeRefs, useClassNames, useElementResize, useEventListener, useMount } from '../utils';
 
 /**
  * Get the layout size and offset of the mount element
@@ -21,7 +21,9 @@ function useOffset(mountRef) {
     return mountRef.current;
   }, updateOffset); // Initialize after the first render
 
-  useEffect(updateOffset, [updateOffset]);
+  useMount(updateOffset); // Update after window size changes
+
+  useEventListener(window, 'resize', updateOffset, false);
   return offset;
 }
 /**

package/esm/Calendar/useCalendarDate.d.ts

@@ -1,4 +1,4 @@
-declare const useCalendarDate: (value: Date | undefined, defaultDate: Date | undefined) => {
+declare const useCalendarDate: (value: Date | null | undefined, defaultDate: Date | undefined) => {
     calendarDate: Date;
     setCalendarDate: (date: Date | undefined) => void;
 };

package/esm/Calendar/useCalendarDate.js

@@ -19,7 +19,7 @@ var useCalendarDate = function useCalendarDate(value, defaultDate) {
     var _valueRef$current;
 
     if ((value === null || value === void 0 ? void 0 : value.valueOf()) !== ((_valueRef$current = valueRef.current) === null || _valueRef$current === void 0 ? void 0 : _valueRef$current.valueOf())) {
-      setCalendarDate(value);
+      setCalendarDate(value !== null && value !== void 0 ? value : new Date());
       valueRef.current = value;
     }
   }, [value]);

package/esm/Carousel/Carousel.js

@@ -1,9 +1,9 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useState, useMemo, useCallback } from 'react';
+import React, { useState, useMemo, useCallback, useRef } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import { useClassNames, useCustom, guid, ReactChildren, useTimeout } from '../utils';
+import { useClassNames, useCustom, guid, ReactChildren, useTimeout, mergeRefs } from '../utils';
 var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _sliderStyles, _ref;
 
@@ -46,7 +46,13 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
       lastIndex = _useState2[0],
       setLastIndex = _useState2[1];
 
+  var rootRef = useRef(null);
+
   var handleSlide = function handleSlide(nextActiveIndex, event) {
+    if (!rootRef.current) {
+      return;
+    }
+
     clear();
     var index = nextActiveIndex !== null && nextActiveIndex !== void 0 ? nextActiveIndex : activeIndex + 1; // When index is greater than count, start from 1 again.
 
@@ -111,7 +117,7 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var sliderStyles = (_sliderStyles = {}, _sliderStyles[lengthKey] = count * 100 + "%", _sliderStyles.transform = vertical ? "translate3d(0, " + activeRatio + " ,0)" : "translate3d(" + activeRatio + ", 0 ,0)", _sliderStyles);
   var showMask = count > 1 && activeIndex === 0 && activeIndex !== lastIndex;
   return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
-    ref: ref,
+    ref: mergeRefs(ref, rootRef),
     className: classes
   }), /*#__PURE__*/React.createElement("div", {
     className: prefix('content')

package/esm/Cascader/Cascader.js

@@ -188,10 +188,18 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }
   }, [getSearchResult, onSearch, setFocusItemValue, setKeys, setLayer, valueKey]);
   var handleEntered = useCallback(function () {
+    if (!targetRef.current) {
+      return;
+    }
+
     onOpen === null || onOpen === void 0 ? void 0 : onOpen();
     setActive(true);
   }, [onOpen]);
   var handleExited = useCallback(function () {
+    if (!targetRef.current) {
+      return;
+    }
+
     onClose === null || onClose === void 0 ? void 0 : onClose();
     setActive(false);
     setSearchKeyword('');
@@ -202,7 +210,7 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
     (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : _triggerRef$current.close();
   }, [triggerRef]);
   var handleClean = useCallback(function (event) {
-    if (disabled) {
+    if (disabled || !targetRef.current) {
       return;
     }
 
@@ -260,7 +268,10 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
         children.then(function (data) {
           node.loading = false;
           node[childrenKey] = data;
-          addColumn(data, cascadePaths.length);
+
+          if (targetRef.current) {
+            addColumn(data, cascadePaths.length);
+          }
         });
       } else {
         node.loading = false;

package/esm/CheckPicker/CheckPicker.d.ts

@@ -1,5 +1,6 @@
-import React from 'react';
+import React, { Ref } from 'react';
 import { PickerLocale } from '../locales';
+import { PickerInstance } from '../Picker';
 import { ItemDataType, FormControlPickerProps } from '../@types/common';
 import type { MultipleSelectProps } from '../SelectPicker';
 export declare type ValueType = (number | string)[];
@@ -10,7 +11,9 @@ export interface CheckPickerProps<T> extends FormControlPickerProps<T[], PickerL
     countable?: boolean;
 }
 export interface CheckPickerComponent {
-    <T>(props: CheckPickerProps<T>): JSX.Element | null;
+    <T>(props: CheckPickerProps<T> & {
+        ref?: Ref<PickerInstance>;
+    }): JSX.Element | null;
     displayName?: string;
     propTypes?: React.WeakValidationMap<CheckPickerProps<any>>;
 }

package/esm/CheckPicker/test/CheckPicker.test.js

@@ -61,4 +61,11 @@ React.createElement(CheckPicker, {
   onChange: function onChange(newValue) {
     expectType(newValue);
   }
+});
+var pickerRef = /*#__PURE__*/React.createRef();
+
+/*#__PURE__*/
+React.createElement(CheckPicker, {
+  ref: pickerRef,
+  data: []
 });

package/esm/CheckTreePicker/CheckTreePicker.js

@@ -621,7 +621,7 @@ var CheckTreePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var renderCheckTree = function renderCheckTree() {
     var _withCheckTreeClassPr, _merge2;
 
-    var classes = withCheckTreeClassPrefix((_withCheckTreeClassPr = {}, _withCheckTreeClassPr[className !== null && className !== void 0 ? className : ''] = inline, _withCheckTreeClassPr['without-children'] = !isSomeNodeHasChildren, _withCheckTreeClassPr.virtualized = virtualized, _withCheckTreeClassPr));
+    var classes = withCheckTreeClassPrefix((_withCheckTreeClassPr = {}, _withCheckTreeClassPr[className !== null && className !== void 0 ? className : ''] = inline, _withCheckTreeClassPr['without-children'] = !isSomeNodeHasChildren(data, childrenKey), _withCheckTreeClassPr.virtualized = virtualized, _withCheckTreeClassPr));
     var formattedNodes = getFormattedNodes(renderNode);
 
     if (!formattedNodes.some(function (v) {

package/esm/CheckTreePicker/utils.js

@@ -38,7 +38,7 @@ export function isSomeChildChecked(nodes, parent, childrenKey) {
 }
 export function isSomeNodeHasChildren(data, childrenKey) {
   return data.some(function (node) {
-    return node[childrenKey];
+    return Array.isArray(node[childrenKey]);
   });
 }
 /**

package/esm/CustomProvider/CustomProvider.d.ts

@@ -72,10 +72,10 @@ declare const CustomContext: React.Context<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -90,10 +90,10 @@ declare const CustomContext: React.Context<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -109,10 +109,10 @@ declare const CustomContext: React.Context<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -120,7 +120,7 @@ declare const CustomContext: React.Context<CustomProviderProps<{
     Picker?: {
         noResultsText: string;
         placeholder: string;
-        searchPlaceholder: string; /** Supported themes */
+        searchPlaceholder: string;
         checkAll: string;
     } | undefined;
     InputPicker?: {
@@ -176,10 +176,10 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -194,10 +194,10 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -213,10 +213,10 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
         saturday: string;
         ok: string;
         today: string;
-        yesterday: string; /** Language configuration */
+        yesterday: string;
         hours: string;
         minutes: string;
-        seconds: string;
+        seconds: string; /** Support right-to-left */
         formattedMonthPattern: string;
         formattedDayPattern: string;
         dateLocale: any;
@@ -224,7 +224,7 @@ declare const Consumer: React.Consumer<CustomProviderProps<{
     Picker?: {
         noResultsText: string;
         placeholder: string;
-        searchPlaceholder: string; /** Supported themes */
+        searchPlaceholder: string;
         checkAll: string;
     } | undefined;
     InputPicker?: {

package/esm/CustomProvider/CustomProvider.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
+import React, { useEffect } from 'react';
 import { getClassNamePrefix, prefix } from '../utils/prefix';
 import { addClass, removeClass, canUseDOM } from '../DOMHelper';
 var CustomContext = /*#__PURE__*/React.createContext({});
@@ -21,7 +21,7 @@ var CustomProvider = function CustomProvider(props) {
       theme: theme
     }, rest);
   }, [classPrefix, theme, rest]);
-  React.useEffect(function () {
+  useEffect(function () {
     if (canUseDOM && theme) {
       addClass(document.body, prefix(classPrefix, "theme-" + theme)); // Remove the className that will cause style conflicts
 

package/esm/DatePicker/DatePicker.d.ts

@@ -3,7 +3,7 @@ import { RangeType } from './Toolbar';
 import { DatePickerLocale } from '../locales';
 import { FormControlBaseProps, PickerBaseProps, RsRefForwardingComponent } from '../@types/common';
 export type { RangeType } from './Toolbar';
-export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, FormControlBaseProps<Date> {
+export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, FormControlBaseProps<Date | null> {
     /** Configure shortcut options */
     ranges?: RangeType<Date>[];
     /** Calendar panel default presentation date and time */

package/esm/DatePicker/DatePicker.js

@@ -2,7 +2,6 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 import PropTypes from 'prop-types';
-import isNil from 'lodash/isNil';
 import mapValues from 'lodash/mapValues';
 import pick from 'lodash/pick';
 import omit from 'lodash/omit';
@@ -166,11 +165,11 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       closeOverlay = true;
     }
 
-    var nextValue = !isNil(nextPageDate) ? nextPageDate : calendarDate;
+    var nextValue = typeof nextPageDate !== 'undefined' ? nextPageDate : calendarDate;
     setCalendarDate(nextValue || new Date());
     setValue(nextValue);
 
-    if (nextValue !== value || !DateUtils.isSameDay(nextValue, value)) {
+    if (nextValue !== value) {
       onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
     } // `closeOverlay` default value is `true`
 

package/esm/Disclosure/Disclosure.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import DisclosureButton from './DisclosureButton';
 import DisclosureContent from './DisclosureContent';
-export interface DisclosureRenderProps {
+export declare type DisclosureTrigger = 'click' | 'mouseover';
+export interface DisclosureRenderProps extends Pick<React.HTMLAttributes<HTMLElement>, 'onMouseOver' | 'onMouseOut'> {
     open: boolean;
 }
 export interface DisclosureProps {
@@ -13,10 +14,12 @@ export interface DisclosureProps {
     hideOnClickOutside?: boolean;
     /** Callback when disclosure button is being activated to update the open state */
     onToggle?: (open: boolean, event: React.SyntheticEvent) => void;
+    /** What mouse events should disclosure reacts to */
+    trigger?: DisclosureTrigger[];
 }
-declare function Disclosure(props: DisclosureProps): JSX.Element;
-declare namespace Disclosure {
-    var Button: typeof DisclosureButton;
-    var Content: typeof DisclosureContent;
+export interface DisclosureComponent extends React.FC<DisclosureProps> {
+    Button: typeof DisclosureButton;
+    Content: typeof DisclosureContent;
 }
+declare const Disclosure: DisclosureComponent;
 export default Disclosure;

package/esm/Disclosure/Disclosure.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 // Headless Disclosure
 // Ref: https://w3c.github.io/aria-practices/#disclosure
-import React, { useMemo, useReducer, useRef } from 'react';
+import React, { useMemo, useReducer, useRef, useCallback, useContext } from 'react';
 import DisclosureContext, { DisclosureActionTypes } from './DisclosureContext';
 import DisclosureButton from './DisclosureButton';
 import DisclosureContent from './DisclosureContent';
@@ -26,14 +26,17 @@ function disclosureReducer(state, action) {
   return state;
 }
 
-function Disclosure(props) {
+var Disclosure = /*#__PURE__*/React.memo(function (props) {
   var children = props.children,
       openProp = props.open,
       _props$defaultOpen = props.defaultOpen,
       defaultOpen = _props$defaultOpen === void 0 ? false : _props$defaultOpen,
       _props$hideOnClickOut = props.hideOnClickOutside,
       hideOnClickOutside = _props$hideOnClickOut === void 0 ? false : _props$hideOnClickOut,
-      onToggle = props.onToggle;
+      onToggle = props.onToggle,
+      _props$trigger = props.trigger,
+      trigger = _props$trigger === void 0 ? ['click'] : _props$trigger;
+  var parentDisclosure = useContext(DisclosureContext);
 
   var _useReducer = useReducer(disclosureReducer, _extends({}, initialDisclosureState, {
     open: defaultOpen
@@ -56,20 +59,56 @@ function Disclosure(props) {
       });
     }
   });
+  var onMouseOver = useCallback(function (event) {
+    if (!open) {
+      dispatch({
+        type: DisclosureActionTypes.Show
+      });
+      onToggle === null || onToggle === void 0 ? void 0 : onToggle(true, event);
+    }
+  }, [open, dispatch, onToggle]);
+  var onMouseOut = useCallback(function (event) {
+    if (open) {
+      dispatch({
+        type: DisclosureActionTypes.Hide
+      });
+      onToggle === null || onToggle === void 0 ? void 0 : onToggle(false, event);
+    }
+  }, [open, dispatch, onToggle]);
   var contextValue = useMemo(function () {
+    var cascadeDispatch = function cascadeDispatch(action) {
+      var result = dispatch(action);
+
+      if ('cascade' in action) {
+        parentDisclosure === null || parentDisclosure === void 0 ? void 0 : parentDisclosure[1](action);
+      }
+
+      return result;
+    };
+
     return [{
       open: open
-    }, dispatch, {
-      onToggle: onToggle
+    }, cascadeDispatch, {
+      onToggle: onToggle,
+      trigger: trigger
     }];
-  }, [open, dispatch, onToggle]);
+  }, [parentDisclosure, open, dispatch, onToggle, trigger]);
+  var renderProps = useMemo(function () {
+    var renderProps = {
+      open: open
+    };
+
+    if (trigger.includes('mouseover')) {
+      renderProps.onMouseOver = onMouseOver;
+      renderProps.onMouseOut = onMouseOut;
+    }
+
+    return renderProps;
+  }, [open, trigger, onMouseOver, onMouseOut]);
   return /*#__PURE__*/React.createElement(DisclosureContext.Provider, {
     value: contextValue
-  }, children({
-    open: open
-  }, containerElementRef));
-}
-
+  }, children(renderProps, containerElementRef));
+});
 Disclosure.Button = DisclosureButton;
 Disclosure.Content = DisclosureContent;
 export default Disclosure;

package/esm/Disclosure/DisclosureButton.d.ts

@@ -3,9 +3,9 @@ export interface DisclosureButtonRenderProps {
     open: boolean;
 }
 export interface DisclosureButtonProps {
-    children: (props: React.ButtonHTMLAttributes<HTMLButtonElement> & DisclosureButtonRenderProps, ref: React.Ref<HTMLButtonElement>) => React.ReactElement<React.HTMLAttributes<HTMLButtonElement>>;
+    children: (props: React.HTMLAttributes<HTMLElement> & DisclosureButtonRenderProps, ref: React.Ref<HTMLElement>) => React.ReactElement<React.HTMLAttributes<HTMLElement>>;
 }
-declare function DisclosureButton(props: DisclosureButtonProps): React.ReactElement<React.HTMLAttributes<HTMLButtonElement>, string | React.JSXElementConstructor<any>>;
+declare function DisclosureButton(props: DisclosureButtonProps): React.ReactElement<React.HTMLAttributes<HTMLElement>, string | React.JSXElementConstructor<any>>;
 declare namespace DisclosureButton {
     var displayName: string;
 }

package/esm/Disclosure/DisclosureContext.d.ts

@@ -1,4 +1,5 @@
 import React, { Dispatch } from 'react';
+import type { DisclosureTrigger } from './Disclosure';
 export interface DisclosureState {
     open: boolean;
 }
@@ -7,12 +8,16 @@ export declare enum DisclosureActionTypes {
     Hide = 1
 }
 export declare type DisclosureAction = {
-    type: DisclosureActionTypes;
+    type: DisclosureActionTypes.Show;
+} | {
+    type: DisclosureActionTypes.Hide;
+    cascade?: boolean;
 };
 export declare type DisclosureContextProps = [
     DisclosureState,
     Dispatch<DisclosureAction>,
     {
+        trigger: DisclosureTrigger[];
         onToggle?: (open: boolean, event: React.SyntheticEvent) => void;
     }
 ];

package/esm/Dropdown/Dropdown.d.ts

@@ -3,6 +3,7 @@ import DropdownMenu from './DropdownMenu';
 import { TypeAttributes, WithAsProps, RsRefForwardingComponent } from '../@types/common';
 import { IconProps } from '@rsuite/icons/lib/Icon';
 import DropdownItem from './DropdownItem';
+import Button from '../Button';
 export declare type DropdownTrigger = 'click' | 'hover' | 'contextMenu';
 export interface DropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttributes<HTMLElement>, 'onSelect' | 'title'> {
     /** Define the title as a submenu */
@@ -48,6 +49,10 @@ export interface DropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttr
     onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
 }
 export interface DropdownComponent extends RsRefForwardingComponent<'div', DropdownProps> {
+    <ToggleAs extends React.ElementType = typeof Button>(props: DropdownProps & {
+        ref?: React.Ref<any>;
+        toggleAs?: ToggleAs;
+    } & React.ComponentProps<ToggleAs>, context: any): JSX.Element | null;
     Item: typeof DropdownItem;
     Menu: typeof DropdownMenu;
 }

package/esm/Dropdown/Dropdown.js

@@ -15,7 +15,7 @@ import DropdownToggle from './DropdownToggle';
 import MenuContext from '../Menu/MenuContext';
 import MenuItem from '../Menu/MenuItem';
 import kebabCase from 'lodash/kebabCase';
-import { NavbarContext } from '../Navbar/Navbar';
+import { NavbarContext } from '../Navbar';
 import Disclosure from '../Disclosure/Disclosure';
 import SidenavDropdown from '../Sidenav/SidenavDropdown';
 import NavContext from '../Nav/NavContext';

package/esm/Dropdown/DropdownItem.js

@@ -11,7 +11,6 @@ import { createChainedFunction, mergeRefs, shallowEqual, useClassNames } from '.
 import { NavbarContext } from '../Navbar/Navbar';
 import SidenavDropdownItem from '../Sidenav/SidenavDropdownItem';
 import DisclosureContext, { DisclosureActionTypes } from '../Disclosure/DisclosureContext';
-import SafeAnchor from '../SafeAnchor';
 import NavContext from '../Nav/NavContext';
 import useInternalId from '../utils/useInternalId';
 import { DropdownActionType } from './DropdownState';
@@ -62,7 +61,8 @@ var DropdownItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
   var handleClickNavbarDropdownItem = useCallback(function (event) {
     dispatchDisclosure === null || dispatchDisclosure === void 0 ? void 0 : dispatchDisclosure({
-      type: DisclosureActionTypes.Hide
+      type: DisclosureActionTypes.Hide,
+      cascade: true
     });
     handleSelectItem === null || handleSelectItem === void 0 ? void 0 : handleSelectItem(event);
   }, [dispatchDisclosure, handleSelectItem]);
@@ -129,16 +129,16 @@ var DropdownItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
       dataAttributes['data-event-key-type'] = typeof eventKey;
     }
 
-    return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(SafeAnchor, _extends({
+    return renderDropdownItem(_extends({
       ref: ref,
       className: classes,
-      "aria-current": selected || undefined
+      'aria-current': selected || undefined
     }, dataAttributes, restProps, {
-      as: Component,
-      onClick: createChainedFunction(handleClickNavbarDropdownItem, restProps.onClick)
-    }), icon && /*#__PURE__*/React.cloneElement(icon, {
-      className: prefix('menu-icon')
-    }), children));
+      onClick: createChainedFunction(handleClickNavbarDropdownItem, restProps.onClick),
+      children: /*#__PURE__*/React.createElement(React.Fragment, null, icon && /*#__PURE__*/React.cloneElement(icon, {
+        className: prefix('menu-icon')
+      }), children)
+    }));
   }
 
   return /*#__PURE__*/React.createElement(MenuItem, {