@fle-ui/next 2.0.0-alpha.9 → 3.0.0-alpha.1

package/es/locale/en_US.js

@@ -1,2 +1,137 @@
-import defaultLocale from "./default";
-export default defaultLocale;
+/* eslint-disable no-template-curly-in-string */
+import Pagination from "rc-pagination/es/locale/en_US";
+import Calendar from "../calendar/locale/en_US";
+import DatePicker from "../date-picker/locale/en_US";
+import TimePicker from "../time-picker/locale/en_US";
+var typeTemplate = '${label} is not a valid ${type}';
+var localeValues = {
+  locale: 'en',
+  Pagination: Pagination,
+  DatePicker: DatePicker,
+  TimePicker: TimePicker,
+  Calendar: Calendar,
+  global: {
+    placeholder: 'Please select'
+  },
+  Table: {
+    filterTitle: 'Filter menu',
+    filterConfirm: 'OK',
+    filterReset: 'Reset',
+    filterEmptyText: 'No filters',
+    filterCheckall: 'Select all items',
+    filterSearchPlaceholder: 'Search in filters',
+    emptyText: 'No data',
+    selectAll: 'Select current page',
+    selectInvert: 'Invert current page',
+    selectNone: 'Clear all data',
+    selectionAll: 'Select all data',
+    sortTitle: 'Sort',
+    expand: 'Expand row',
+    collapse: 'Collapse row',
+    triggerDesc: 'Click to sort descending',
+    triggerAsc: 'Click to sort ascending',
+    cancelSort: 'Click to cancel sorting'
+  },
+  Tour: {
+    Next: 'Next',
+    Previous: 'Previous',
+    Finish: 'Finish'
+  },
+  Modal: {
+    okText: 'OK',
+    cancelText: 'Cancel',
+    justOkText: 'OK'
+  },
+  Popconfirm: {
+    okText: 'OK',
+    cancelText: 'Cancel'
+  },
+  Transfer: {
+    titles: ['', ''],
+    searchPlaceholder: 'Search here',
+    itemUnit: 'item',
+    itemsUnit: 'items',
+    remove: 'Remove',
+    selectCurrent: 'Select current page',
+    removeCurrent: 'Remove current page',
+    selectAll: 'Select all data',
+    removeAll: 'Remove all data',
+    selectInvert: 'Invert current page'
+  },
+  Upload: {
+    uploading: 'Uploading...',
+    removeFile: 'Remove file',
+    uploadError: 'Upload error',
+    previewFile: 'Preview file',
+    downloadFile: 'Download file'
+  },
+  Empty: {
+    description: 'No data'
+  },
+  Icon: {
+    icon: 'icon'
+  },
+  Text: {
+    edit: 'Edit',
+    copy: 'Copy',
+    copied: 'Copied',
+    expand: 'Expand'
+  },
+  PageHeader: {
+    back: 'Back'
+  },
+  Form: {
+    optional: '(optional)',
+    defaultValidateMessages: {
+      "default": 'Field validation error for ${label}',
+      required: 'Please enter ${label}',
+      "enum": '${label} must be one of [${enum}]',
+      whitespace: '${label} cannot be a blank character',
+      date: {
+        format: '${label} date format is invalid',
+        parse: '${label} cannot be converted to a date',
+        invalid: '${label} is an invalid date'
+      },
+      types: {
+        string: typeTemplate,
+        method: typeTemplate,
+        array: typeTemplate,
+        object: typeTemplate,
+        number: typeTemplate,
+        date: typeTemplate,
+        "boolean": typeTemplate,
+        integer: typeTemplate,
+        "float": typeTemplate,
+        regexp: typeTemplate,
+        email: typeTemplate,
+        url: typeTemplate,
+        hex: typeTemplate
+      },
+      string: {
+        len: '${label} must be ${len} characters',
+        min: '${label} must be at least ${min} characters',
+        max: '${label} must be up to ${max} characters',
+        range: '${label} must be between ${min}-${max} characters'
+      },
+      number: {
+        len: '${label} must be equal to ${len}',
+        min: '${label} must be minimum ${min}',
+        max: '${label} must be maximum ${max}',
+        range: '${label} must be between ${min}-${max}'
+      },
+      array: {
+        len: 'Must be ${len} ${label}',
+        min: 'At least ${min} ${label}',
+        max: 'At most ${max} ${label}',
+        range: 'The amount of ${label} must be between ${min}-${max}'
+      },
+      pattern: {
+        mismatch: '${label} does not match the pattern ${pattern}'
+      }
+    }
+  },
+  Image: {
+    preview: 'Preview'
+  }
+};
+export default localeValues;

package/es/locale/ku_IQ.js

@@ -1,7 +1,7 @@
 import Pagination from "rc-pagination/es/locale/kmr_IQ";
 import Calendar from "../calendar/locale/kmr_IQ";
 import DatePicker from "../date-picker/locale/kmr_IQ";
-import TimePicker from "../time-picker/locale/kmr_IQ"; // please use antd/lib/locale/kmr_IQ instead
+import TimePicker from "../time-picker/locale/kmr_IQ"; // please use antd/locale/kmr_IQ instead
 // keep this file for compatibility
 // https://github.com/ant-design/ant-design/issues/25778
 

package/es/locale/zh_CN.js

@@ -37,6 +37,11 @@ var localeValues = {
     cancelText: '取消',
     justOkText: '知道了'
   },
+  Tour: {
+    Next: '下一步',
+    Previous: '上一步',
+    Finish: '结束导览'
+  },
   Popconfirm: {
     cancelText: '取消',
     okText: '确定'

package/es/locale/zh_HK.js

@@ -34,6 +34,11 @@ var localeValues = {
     cancelText: '取消',
     justOkText: '知道了'
   },
+  Tour: {
+    Next: '下一步',
+    Previous: '上一步',
+    Finish: '結束導覽'
+  },
   Popconfirm: {
     okText: '確定',
     cancelText: '取消'

package/es/locale/zh_TW.js

@@ -34,6 +34,11 @@ var localeValues = {
     cancelText: '取消',
     justOkText: '知道了'
   },
+  Tour: {
+    Next: '下一步',
+    Previous: '上一步',
+    Finish: '結束導覽'
+  },
   Popconfirm: {
     okText: '確定',
     cancelText: '取消'

package/es/locale-provider/LocaleReceiver.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import LocaleContext from "./context";
-import defaultLocaleData from "./default";
+import defaultLocaleData from "../locale/en_US";
 
 var LocaleReceiver = function LocaleReceiver(props) {
   var _props$componentName = props.componentName,

package/es/locale-provider/index.d.ts

@@ -3,6 +3,7 @@ import * as React from 'react';
 import type { PickerLocale as DatePickerLocale } from '../date-picker/generatePicker';
 import type { TransferLocale as TransferLocaleForEmpty } from '../empty';
 import type { ModalLocale } from '../modal/locale';
+import type { TourLocale } from '../tour/interface';
 import type { PaginationLocale } from '../pagination/Pagination';
 import type { PopconfirmLocale } from '../popconfirm/PurePanel';
 import type { TableLocale } from '../table/interface';
@@ -17,6 +18,7 @@ export interface Locale {
     Calendar?: Record<string, any>;
     Table?: TableLocale;
     Modal?: ModalLocale;
+    Tour?: TourLocale;
     Popconfirm?: PopconfirmLocale;
     Transfer?: TransferLocale;
     Select?: Record<string, any>;

package/es/mentions/index.d.ts

@@ -13,6 +13,7 @@ export interface MentionProps extends RcMentionsProps {
     loading?: boolean;
     status?: InputStatus;
     options?: MentionsOptionProps[];
+    popupClassName?: string;
 }
 export interface MentionsRef extends RcMentionsRef {
 }
@@ -27,9 +28,11 @@ interface MentionsEntity {
     prefix: string;
     value: string;
 }
-interface CompoundedComponent extends React.ForwardRefExoticComponent<MentionProps & React.RefAttributes<MentionsRef>> {
+type CompoundedComponent = React.ForwardRefExoticComponent<MentionProps & React.RefAttributes<MentionsRef>> & {
     Option: typeof Option;
+    _InternalPanelDoNotUseOrYouWillBeFired: typeof PurePanel;
     getMentions: (value: string, config?: MentionsConfig) => MentionsEntity[];
-}
+};
 declare const Mentions: CompoundedComponent;
+declare const PurePanel: any;
 export default Mentions;

package/es/mentions/index.js

@@ -17,14 +17,16 @@ var __rest = this && this.__rest || function (s, e) {
 
 import classNames from 'classnames';
 import RcMentions from 'rc-mentions';
-import { composeRef } from "rc-util/es/ref";
+import { composeRef } from "rc-util/es/ref"; // eslint-disable-next-line import/no-named-as-default
+
 import * as React from 'react';
 import { ConfigContext } from "../config-provider";
 import defaultRenderEmpty from "../config-provider/defaultRenderEmpty";
 import { FormItemInputContext } from "../form/context";
+import genPurePanel from "../_util/PurePanel";
 import Spin from "../spin";
 import { getMergedStatus, getStatusClassNames } from "../_util/statusUtils";
-import warning from "../_util/warning";
+import useStyle from "./style";
 var Option = RcMentions.Option;
 export { Option };
 
@@ -44,7 +46,8 @@ var InternalMentions = function InternalMentions(_a, ref) {
       notFoundContent = _a.notFoundContent,
       options = _a.options,
       customStatus = _a.status,
-      restProps = __rest(_a, ["prefixCls", "className", "disabled", "loading", "filterOption", "children", "notFoundContent", "options", "status"]);
+      popupClassName = _a.popupClassName,
+      restProps = __rest(_a, ["prefixCls", "className", "disabled", "loading", "filterOption", "children", "notFoundContent", "options", "status", "popupClassName"]);
 
   var _React$useState = React.useState(false),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -52,11 +55,7 @@ var InternalMentions = function InternalMentions(_a, ref) {
       setFocused = _React$useState2[1];
 
   var innerRef = React.useRef();
-  var mergedRef = composeRef(ref, innerRef); // =================== Warning =====================
-
-  if (process.env.NODE_ENV !== 'production') {
-    process.env.NODE_ENV !== "production" ? warning(!children, 'Mentions', '`Mentions.Option` is deprecated. Please use `options` instead.') : void 0;
-  }
+  var mergedRef = composeRef(ref, innerRef);
 
   var _React$useContext = React.useContext(ConfigContext),
       getPrefixCls = _React$useContext.getPrefixCls,
@@ -123,8 +122,14 @@ var InternalMentions = function InternalMentions(_a, ref) {
     return filterOption;
   };
 
-  var prefixCls = getPrefixCls('mentions', customizePrefixCls);
-  var mergedClassName = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-disabled"), disabled), _defineProperty(_classNames, "".concat(prefixCls, "-focused"), focused), _defineProperty(_classNames, "".concat(prefixCls, "-rtl"), direction === 'rtl'), _classNames), getStatusClassNames(prefixCls, mergedStatus), !hasFeedback && className);
+  var prefixCls = getPrefixCls('mentions', customizePrefixCls); // Style
+
+  var _useStyle = useStyle(prefixCls),
+      _useStyle2 = _slicedToArray(_useStyle, 2),
+      wrapSSR = _useStyle2[0],
+      hashId = _useStyle2[1];
+
+  var mergedClassName = classNames((_classNames = {}, _defineProperty(_classNames, prefixCls + "-disabled", disabled), _defineProperty(_classNames, prefixCls + "-focused", focused), _defineProperty(_classNames, prefixCls + "-rtl", direction === 'rtl'), _classNames), getStatusClassNames(prefixCls, mergedStatus), !hasFeedback && className, hashId);
   var mentions = /*#__PURE__*/React.createElement(RcMentions, _extends({
     prefixCls: prefixCls,
     notFoundContent: getNotFoundContent(),
@@ -135,19 +140,20 @@ var InternalMentions = function InternalMentions(_a, ref) {
     filterOption: getFilterOption(),
     onFocus: onFocus,
     onBlur: onBlur,
+    dropdownClassName: classNames(popupClassName, hashId),
     ref: mergedRef,
     options: mergedOptions
   }), getOptions());
 
   if (hasFeedback) {
     return /*#__PURE__*/React.createElement("div", {
-      className: classNames("".concat(prefixCls, "-affix-wrapper"), getStatusClassNames("".concat(prefixCls, "-affix-wrapper"), mergedStatus, hasFeedback), className)
+      className: classNames(prefixCls + "-affix-wrapper", getStatusClassNames(prefixCls + "-affix-wrapper", mergedStatus, hasFeedback), className, hashId)
     }, mentions, /*#__PURE__*/React.createElement("span", {
-      className: "".concat(prefixCls, "-suffix")
+      className: prefixCls + "-suffix"
     }, feedbackIcon));
   }
 
-  return mentions;
+  return wrapSSR(mentions);
 };
 
 var Mentions = /*#__PURE__*/React.forwardRef(InternalMentions);
@@ -156,7 +162,12 @@ if (process.env.NODE_ENV !== 'production') {
   Mentions.displayName = 'Mentions';
 }
 
-Mentions.Option = Option;
+Mentions.Option = Option; // We don't care debug panel
+
+/* istanbul ignore next */
+
+var PurePanel = genPurePanel(Mentions, 'mentions');
+Mentions._InternalPanelDoNotUseOrYouWillBeFired = PurePanel;
 
 Mentions.getMentions = function () {
   var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';

package/es/mentions/style/index.d.ts

@@ -1,3 +1,7 @@
-import './index.less';
-import '../../empty/style';
-import '../../spin/style';
+export interface ComponentToken {
+    zIndexPopup: number;
+    dropdownHeight: number;
+    controlItemWidth: number;
+}
+declare const _default: (prefixCls: string) => import("../../theme/internal").UseComponentStyleResult;
+export default _default;

package/es/mentions/style/index.js

@@ -1,4 +1,170 @@
-import "./index.less"; // style dependencies
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { genActiveStyle, genBasicInputStyle, genDisabledStyle, genPlaceholderStyle, genStatusStyle, initInputToken } from "../../input/style";
+import { genComponentStyleHook } from "../../theme/internal";
+import { resetComponent, textEllipsis } from "../../style";
 
-import "../../empty/style";
-import "../../spin/style"; // deps-lint-skip: form
+var genMentionsStyle = function genMentionsStyle(token) {
+  var _extends3;
+
+  var componentCls = token.componentCls,
+      colorTextDisabled = token.colorTextDisabled,
+      controlItemBgHover = token.controlItemBgHover,
+      controlPaddingHorizontal = token.controlPaddingHorizontal,
+      colorText = token.colorText,
+      motionDurationSlow = token.motionDurationSlow,
+      lineHeight = token.lineHeight,
+      controlHeight = token.controlHeight,
+      inputPaddingHorizontal = token.inputPaddingHorizontal,
+      inputPaddingVertical = token.inputPaddingVertical,
+      fontSize = token.fontSize,
+      colorBgElevated = token.colorBgElevated,
+      borderRadiusLG = token.borderRadiusLG,
+      boxShadowSecondary = token.boxShadowSecondary;
+  var itemPaddingVertical = Math.round((token.controlHeight - token.fontSize * token.lineHeight) / 2);
+  return _defineProperty({}, "" + componentCls, _extends(_extends(_extends(_extends(_extends({}, resetComponent(token)), genBasicInputStyle(token)), {
+    position: 'relative',
+    display: 'inline-block',
+    height: 'auto',
+    padding: 0,
+    overflow: 'hidden',
+    lineHeight: lineHeight,
+    whiteSpace: 'pre-wrap',
+    verticalAlign: 'bottom'
+  }), genStatusStyle(token)), (_extends3 = {
+    '&-disabled': {
+      '> textarea': _extends({}, genDisabledStyle(token))
+    },
+    '&-focused': _extends({}, genActiveStyle(token))
+  }, _defineProperty(_extends3, "&-affix-wrapper " + componentCls + "-suffix", {
+    position: 'absolute',
+    top: 0,
+    insetInlineEnd: inputPaddingHorizontal,
+    bottom: 0,
+    zIndex: 1,
+    display: 'inline-flex',
+    alignItems: 'center',
+    margin: 'auto'
+  }), _defineProperty(_extends3, "> textarea, " + componentCls + "-measure", {
+    color: colorText,
+    boxSizing: 'border-box',
+    minHeight: controlHeight - 2,
+    margin: 0,
+    padding: inputPaddingVertical + "px " + inputPaddingHorizontal + "px",
+    overflow: 'inherit',
+    overflowX: 'hidden',
+    overflowY: 'auto',
+    fontWeight: 'inherit',
+    fontSize: 'inherit',
+    fontFamily: 'inherit',
+    fontStyle: 'inherit',
+    fontVariant: 'inherit',
+    fontSizeAdjust: 'inherit',
+    fontStretch: 'inherit',
+    lineHeight: 'inherit',
+    direction: 'inherit',
+    letterSpacing: 'inherit',
+    whiteSpace: 'inherit',
+    textAlign: 'inherit',
+    verticalAlign: 'top',
+    wordWrap: 'break-word',
+    wordBreak: 'inherit',
+    tabSize: 'inherit'
+  }), _defineProperty(_extends3, '> textarea', _extends({
+    width: '100%',
+    border: 'none',
+    outline: 'none',
+    resize: 'none',
+    backgroundColor: 'inherit'
+  }, genPlaceholderStyle(token.colorTextPlaceholder))), _defineProperty(_extends3, componentCls + "-measure", {
+    position: 'absolute',
+    top: 0,
+    insetInlineEnd: 0,
+    bottom: 0,
+    insetInlineStart: 0,
+    zIndex: -1,
+    color: 'transparent',
+    pointerEvents: 'none',
+    '> span': {
+      display: 'inline-block',
+      minHeight: '1em'
+    }
+  }), _defineProperty(_extends3, '&-dropdown', _extends(_extends({}, resetComponent(token)), _defineProperty({
+    position: 'absolute',
+    top: -9999,
+    insetInlineStart: -9999,
+    zIndex: token.zIndexPopup,
+    boxSizing: 'border-box',
+    fontSize: fontSize,
+    fontVariant: 'initial',
+    backgroundColor: colorBgElevated,
+    borderRadius: borderRadiusLG,
+    outline: 'none',
+    boxShadow: boxShadowSecondary,
+    '&-hidden': {
+      display: 'none'
+    }
+  }, componentCls + "-dropdown-menu", {
+    maxHeight: token.dropdownHeight,
+    marginBottom: 0,
+    paddingInlineStart: 0,
+    overflow: 'auto',
+    listStyle: 'none',
+    outline: 'none',
+    '&-item': _extends(_extends({}, textEllipsis), {
+      position: 'relative',
+      display: 'block',
+      minWidth: token.controlItemWidth,
+      padding: itemPaddingVertical + "px " + controlPaddingHorizontal + "px",
+      color: colorText,
+      fontWeight: 'normal',
+      lineHeight: lineHeight,
+      cursor: 'pointer',
+      transition: "background " + motionDurationSlow + " ease",
+      '&:hover': {
+        backgroundColor: controlItemBgHover
+      },
+      '&:first-child': {
+        borderStartStartRadius: borderRadiusLG,
+        borderStartEndRadius: borderRadiusLG,
+        borderEndStartRadius: 0,
+        borderEndEndRadius: 0
+      },
+      '&:last-child': {
+        borderStartStartRadius: 0,
+        borderStartEndRadius: 0,
+        borderEndStartRadius: borderRadiusLG,
+        borderEndEndRadius: borderRadiusLG
+      },
+      '&-disabled': {
+        color: colorTextDisabled,
+        cursor: 'not-allowed',
+        '&:hover': {
+          color: colorTextDisabled,
+          backgroundColor: controlItemBgHover,
+          cursor: 'not-allowed'
+        }
+      },
+      '&-selected': {
+        color: colorText,
+        fontWeight: token.fontWeightStrong,
+        backgroundColor: controlItemBgHover
+      },
+      '&-active': {
+        backgroundColor: controlItemBgHover
+      }
+    })
+  }))), _extends3)));
+}; // ============================== Export ==============================
+
+
+export default genComponentStyleHook('Mentions', function (token) {
+  var mentionsToken = initInputToken(token);
+  return [genMentionsStyle(mentionsToken)];
+}, function (token) {
+  return {
+    dropdownHeight: 250,
+    controlItemWidth: 100,
+    zIndexPopup: token.zIndexPopupBase + 50
+  };
+});

package/es/menu/MenuContext.d.ts

@@ -1,11 +1,13 @@
 /// <reference types="react" />
+import type { MenuProps } from 'rc-menu';
 import type { DirectionType } from '../config-provider';
 export type MenuTheme = 'light' | 'dark';
 export interface MenuContextProps {
     prefixCls: string;
     inlineCollapsed: boolean;
-    antdMenuTheme?: MenuTheme;
     direction?: DirectionType;
+    mode?: MenuProps['mode'];
+    theme?: MenuTheme;
     firstLevel: boolean;
 }
 declare const MenuContext: import("react").Context<MenuContextProps>;

package/es/menu/MenuDivider.js

@@ -29,7 +29,7 @@ var MenuDivider = function MenuDivider(_a) {
       getPrefixCls = _React$useContext.getPrefixCls;
 
   var prefixCls = getPrefixCls('menu', customizePrefixCls);
-  var classString = classNames(_defineProperty({}, "".concat(prefixCls, "-item-divider-dashed"), !!dashed), className);
+  var classString = classNames(_defineProperty({}, prefixCls + "-item-divider-dashed", !!dashed), className);
   return /*#__PURE__*/React.createElement(Divider, _extends({
     className: classString
   }, restProps));

package/es/menu/MenuItem.js

@@ -83,16 +83,16 @@ var MenuItem = /*#__PURE__*/function (_React$Component) {
 
       var childrenLength = toArray(children).length;
       var returnNode = /*#__PURE__*/React.createElement(Item, _extends({}, rest, {
-        className: classNames((_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-item-danger"), danger), _defineProperty(_classNames, "".concat(prefixCls, "-item-only-child"), (icon ? childrenLength + 1 : childrenLength) === 1), _classNames), className),
+        className: classNames((_classNames = {}, _defineProperty(_classNames, prefixCls + "-item-danger", danger), _defineProperty(_classNames, prefixCls + "-item-only-child", (icon ? childrenLength + 1 : childrenLength) === 1), _classNames), className),
         title: typeof title === 'string' ? title : undefined
       }), cloneElement(icon, {
-        className: classNames(isValidElement(icon) ? (_a = icon.props) === null || _a === void 0 ? void 0 : _a.className : '', "".concat(prefixCls, "-item-icon"))
+        className: classNames(isValidElement(icon) ? (_a = icon.props) === null || _a === void 0 ? void 0 : _a.className : '', prefixCls + "-item-icon")
       }), _this.renderItemChildren(inlineCollapsed));
 
       if (!disableMenuItemTitleTooltip) {
         returnNode = /*#__PURE__*/React.createElement(Tooltip, _extends({}, tooltipProps, {
           placement: direction === 'rtl' ? 'left' : 'right',
-          overlayClassName: "".concat(prefixCls, "-inline-collapsed-tooltip")
+          overlayClassName: prefixCls + "-inline-collapsed-tooltip"
         }), returnNode);
       }
 
@@ -112,14 +112,14 @@ var MenuItem = /*#__PURE__*/function (_React$Component) {
           icon = _this$props2.icon,
           children = _this$props2.children;
       var wrapNode = /*#__PURE__*/React.createElement("span", {
-        className: "".concat(prefixCls, "-title-content")
+        className: prefixCls + "-title-content"
       }, children); // inline-collapsed.md demo 依赖 span 来隐藏文字,有 icon 属性，则内部包裹一个 span
       // ref: https://github.com/ant-design/ant-design/pull/23456
 
       if (!icon || isValidElement(children) && children.type === 'span') {
         if (children && inlineCollapsed && firstLevel && typeof children === 'string') {
           return /*#__PURE__*/React.createElement("div", {
-            className: "".concat(prefixCls, "-inline-collapsed-noicon")
+            className: prefixCls + "-inline-collapsed-noicon"
           }, children.charAt(0));
         }
       }

package/es/menu/OverrideContext.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { MenuProps } from '.';
+import type { MenuProps } from './menu';
 export interface OverrideContextProps {
     prefixCls?: string;
     expandIcon?: React.ReactNode;

package/es/menu/SubMenu.js

@@ -12,28 +12,29 @@ function SubMenu(props) {
   var popupClassName = props.popupClassName,
       icon = props.icon,
       title = props.title,
-      theme = props.theme;
+      customTheme = props.theme;
   var context = React.useContext(MenuContext);
   var prefixCls = context.prefixCls,
       inlineCollapsed = context.inlineCollapsed,
-      antdMenuTheme = context.antdMenuTheme;
+      contextTheme = context.theme,
+      mode = context.mode;
   var parentPath = useFullPath();
   var titleNode;
 
   if (!icon) {
     titleNode = inlineCollapsed && !parentPath.length && title && typeof title === 'string' ? /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-inline-collapsed-noicon")
+      className: prefixCls + "-inline-collapsed-noicon"
     }, title.charAt(0)) : /*#__PURE__*/React.createElement("span", {
-      className: "".concat(prefixCls, "-title-content")
+      className: prefixCls + "-title-content"
     }, title);
   } else {
     // inline-collapsed.md demo 依赖 span 来隐藏文字,有 icon 属性，则内部包裹一个 span
     // ref: https://github.com/ant-design/ant-design/pull/23456
     var titleIsSpan = isValidElement(title) && title.type === 'span';
     titleNode = /*#__PURE__*/React.createElement(React.Fragment, null, cloneElement(icon, {
-      className: classNames(isValidElement(icon) ? (_a = icon.props) === null || _a === void 0 ? void 0 : _a.className : '', "".concat(prefixCls, "-item-icon"))
+      className: classNames(isValidElement(icon) ? (_a = icon.props) === null || _a === void 0 ? void 0 : _a.className : '', prefixCls + "-item-icon")
     }), titleIsSpan ? title : /*#__PURE__*/React.createElement("span", {
-      className: "".concat(prefixCls, "-title-content")
+      className: prefixCls + "-title-content"
     }, title));
   }
 
@@ -42,11 +43,14 @@ function SubMenu(props) {
       firstLevel: false
     });
   }, [context]);
+  var popupOffset = mode === 'horizontal' ? [0, 8] : [10, 0];
   return /*#__PURE__*/React.createElement(MenuContext.Provider, {
     value: contextValue
-  }, /*#__PURE__*/React.createElement(RcSubMenu, _extends({}, omit(props, ['icon']), {
+  }, /*#__PURE__*/React.createElement(RcSubMenu, _extends({
+    popupOffset: popupOffset
+  }, omit(props, ['icon']), {
     title: titleNode,
-    popupClassName: classNames(prefixCls, "".concat(prefixCls, "-").concat(theme || antdMenuTheme), popupClassName)
+    popupClassName: classNames(prefixCls, popupClassName, prefixCls + "-" + (customTheme || contextTheme))
   })));
 }
 

package/es/menu/hooks/useItems.js

@@ -30,7 +30,7 @@ function convertItemsToNodes(list) {
           type = _a.type,
           restProps = __rest(_a, ["label", "children", "key", "type"]);
 
-      var mergedKey = key !== null && key !== void 0 ? key : "tmp-".concat(index); // MenuItemGroup & SubMenuItem
+      var mergedKey = key !== null && key !== void 0 ? key : "tmp-" + index; // MenuItemGroup & SubMenuItem
 
       if (children || type === 'group') {
         if (type === 'group') {