rsuite 5.23.3 → 5.24.1

package/CHANGELOG.md

@@ -1,3 +1,28 @@
+## [5.24.1](https://github.com/rsuite/rsuite/compare/v5.24.0...v5.24.1) (2023-01-12)
+
+### Bug Fixes
+
+- **DatePicker,DateRangePicker:** fix the background color error when the cell is hovered ([#3018](https://github.com/rsuite/rsuite/issues/3018)) ([9d6f43e](https://github.com/rsuite/rsuite/commit/9d6f43e6db6049b7fdcc8514e071d870b785ecbb))
+- **MultiCascader:** fix load async data error in inline mode ([#3015](https://github.com/rsuite/rsuite/issues/3015)) ([081eb14](https://github.com/rsuite/rsuite/commit/081eb14de9fb37d80a95324a669b8089e29ef03c)), closes [#3014](https://github.com/rsuite/rsuite/issues/3014)
+- **Navbar.Brand:** fix missing href prop ([#3007](https://github.com/rsuite/rsuite/issues/3007)) ([d0a1f27](https://github.com/rsuite/rsuite/commit/d0a1f276d63e25c295fbef94f82559333ba4c148))
+- **Tree:** fix Tree drag preview style error ([#3003](https://github.com/rsuite/rsuite/issues/3003)) ([4830148](https://github.com/rsuite/rsuite/commit/4830148b9e325bee926a2bfefe0786c08952ec79))
+
+### Performance Improvements
+
+- **CSS transitions:** improved duration of transitions ([#3016](https://github.com/rsuite/rsuite/issues/3016)) ([d1829da](https://github.com/rsuite/rsuite/commit/d1829da2e77131e031479ef9aa4f6d00d6307a52))
+
+# [5.24.0](https://github.com/rsuite/rsuite/compare/v5.23.3...v5.24.0) (2022-12-30)
+
+### Bug Fixes
+
+- **AutoComplete:** fix AutoComplete size property not working ([#2990](https://github.com/rsuite/rsuite/issues/2990)) ([add665b](https://github.com/rsuite/rsuite/commit/add665b82b9d2cbd21e07576bf77f74e18991e21))
+- **DatePicker:** fix inconsistency between month selectable state and ok button clickable state ([#2984](https://github.com/rsuite/rsuite/issues/2984)) ([70e6aba](https://github.com/rsuite/rsuite/commit/70e6aba0b7a3216c9f8b59b033826e55bebac1a1))
+- **Sidenav:** fix Sidenav multilevel Nav.Menu arrow icon exception ([#2986](https://github.com/rsuite/rsuite/issues/2986)) ([87f6748](https://github.com/rsuite/rsuite/commit/87f67482b60eae4ed445246fe3e6ac9b0cad0385))
+
+### Features
+
+- **Dropdown:** add Dropdown.Separator component ([#2979](https://github.com/rsuite/rsuite/issues/2979)) ([db6fcbb](https://github.com/rsuite/rsuite/commit/db6fcbbd88961e3506f6b2d2146cf43717d1e1db))
+
 ## [5.23.3](https://github.com/rsuite/rsuite/compare/v5.23.2...v5.23.3) (2022-12-16)
 
 ### Bug Fixes

package/Calendar/styles/index.less

@@ -370,7 +370,8 @@
   }
 }
 
-.rs-calendar-table-cell {
+.rs-calendar-table-cell,
+.rs-calendar-table-header-cell {
   display: table-cell;
   width: 1%;
   padding: @calendar-table-cell-padding 0;
@@ -418,21 +419,19 @@
 }
 
 // Table header row
-.rs-calendar-table-header-row {
-  .rs-calendar-table-cell-content {
-    color: var(--rs-text-secondary);
-    font-size: @font-size-small;
-    line-height: @line-height-small;
-    padding-top: 2px;
-    padding-bottom: 2px;
-
-    &,
-    &:hover,
-    &:focus,
-    &:hover:focus {
-      background: none;
-      cursor: auto;
-    }
+.rs-calendar-table-header-cell-content {
+  color: var(--rs-text-secondary);
+  font-size: @font-size-small;
+  line-height: @line-height-small;
+  padding-top: 2px;
+  padding-bottom: 2px;
+
+  &,
+  &:hover,
+  &:focus,
+  &:hover:focus {
+    background: none;
+    cursor: auto;
   }
 }
 

package/DatePicker/styles/index.less

@@ -2,6 +2,7 @@
 @import '../../styles/mixins/listbox';
 @import '../../Button/styles/mixin';
 @import '../../Picker/styles/mixin';
+@import 'mixin';
 
 // DatePicker Picker
 // ----------------------
@@ -91,6 +92,10 @@
       .listbox-option-active();
     }
 
+    .rs-calendar-month-dropdown-cell-active .rs-calendar-month-dropdown-cell-content:hover {
+      .calendar-cell-selected-hover();
+    }
+
     .rs-calendar-table-header-row .rs-calendar-table-cell-content {
       height: 24px;
       padding-top: 0;
@@ -109,6 +114,10 @@
       .listbox-option-active();
     }
 
+    .rs-calendar-table-cell-selected:hover .rs-calendar-table-cell-content {
+      .calendar-cell-selected-hover();
+    }
+
     .rs-calendar-month-dropdown-scroll {
       height: 227px;
     }

package/DatePicker/styles/mixin.less

@@ -0,0 +1,8 @@
+.calendar-cell-selected-hover() {
+  background-color: var(--rs-calendar-cell-selected-hover-bg);
+  color: var(--rs-calendar-date-selected-text);
+
+  .high-contrast-mode({
+    color: var(--rs-calendar-date-selected-text);
+  });
+}

package/Picker/styles/index.less

@@ -382,7 +382,6 @@
       display: block;
       padding: @picker-item-content-padding-vertical @picker-item-content-padding-horizontal
         @picker-item-content-padding-vertical @picker-check-item-content-padding-left;
-      transition: @picker-item-transition;
       line-height: @line-height-computed;
 
       .high-contrast-mode({

package/Picker/styles/mixin.less

@@ -31,21 +31,15 @@
     padding: @picker-item-content-padding-vertical @picker-item-content-padding-horizontal;
     padding-right: (@padding-x + @dropdown-caret-width + @dropdown-caret-padding);
     position: relative;
-    cursor: default;
-    transition: @picker-item-transition;
+    cursor: pointer;
     color: var(--rs-text-heading);
 
-    &:hover {
-      background-color: var(--rs-state-hover-bg);
-    }
-
     .rs-@{prefix}-menu-group-caret {
       display: inline-block;
       margin-left: 2px;
       position: absolute;
       top: @padding-y;
       right: @padding-x;
-      transition: transform 0.3s linear;
       padding: 3px;
     }
   }
@@ -60,19 +54,6 @@
   }
 }
 
-.picker-select-item() {
-  display: block;
-  padding: @picker-item-content-padding-vertical @picker-item-content-padding-horizontal;
-  clear: both;
-  font-weight: normal;
-  line-height: @line-height-base;
-  color: var(--rs-text-primary);
-  cursor: pointer; //fixed link has not [href] style
-  transition: @picker-item-transition;
-  text-decoration: none;
-  width: 100%;
-}
-
 .picker-item-hover() {
   color: var(--rs-text-primary);
   background-color: var(--rs-state-hover-bg);

package/Sidenav/styles/index.less

@@ -76,14 +76,19 @@
         top: @sidenav-children-padding-vertical;
         // width: auto;
         // height: @sidenav-dropdown-toggle-caret-width;
-        transform: rotate(90deg);
+        // transform: rotate(90deg);
       }
     }
 
     // Expanded submenu toggle icon
-    .rs-dropdown-item-expand .rs-dropdown-item-toggle-icon {
+    .rs-dropdown-item-expand-icon {
       transform: rotate(270deg);
     }
+
+    // Collapse submenu toggle icon
+    .rs-dropdown-item-collapse-icon {
+      transform: rotate(90deg);
+    }
   }
 
   .high-contrast-mode({

package/TreePicker/styles/index.less

@@ -16,6 +16,19 @@
   &.rs-tree-virtualized {
     overflow: hidden;
   }
+
+  &-drag-preview {
+    position: absolute;
+    top: 0;
+    color: var(--rs-text-primary);
+    background-color: var(--rs-bg-overlay);
+    display: inline-block;
+    margin: 0;
+    padding: @picker-tree-node-padding-vertical @picker-tree-node-padding-horizontal;
+    border-radius: 6px;
+    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.12);
+    z-index: -1;
+  }
 }
 
 .rs-tree-node {

package/cjs/AutoComplete/AutoComplete.d.ts

@@ -9,6 +9,8 @@ export interface AutoCompleteProps<T = ValueType> extends WithAsProps, FormContr
     placement?: TypeAttributes.Placement;
     /** When set to false, the Enter key selection function is invalid */
     selectOnEnter?: boolean;
+    /** A component can have different sizes */
+    size?: TypeAttributes.Size;
     /** Open the menu and control it */
     open?: boolean;
     /** Placeholder text */

package/cjs/AutoComplete/AutoComplete.js

@@ -52,6 +52,7 @@ var AutoComplete = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       valueProp = props.value,
       open = props.open,
       style = props.style,
+      size = props.size,
       menuClassName = props.menuClassName,
       id = props.id,
       renderMenu = props.renderMenu,
@@ -65,7 +66,7 @@ var AutoComplete = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       onFocus = props.onFocus,
       onBlur = props.onBlur,
       onMenuFocus = props.onMenuFocus,
-      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "disabled", "className", "placement", "selectOnEnter", "classPrefix", "defaultValue", "menuAutoWidth", "data", "value", "open", "style", "menuClassName", "id", "renderMenu", "renderMenuItem", "onSelect", "filterBy", "onKeyDown", "onChange", "onClose", "onOpen", "onFocus", "onBlur", "onMenuFocus"]);
+      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "disabled", "className", "placement", "selectOnEnter", "classPrefix", "defaultValue", "menuAutoWidth", "data", "value", "open", "style", "size", "menuClassName", "id", "renderMenu", "renderMenuItem", "onSelect", "filterBy", "onKeyDown", "onChange", "onClose", "onOpen", "onFocus", "onBlur", "onMenuFocus"]);
   var datalist = (0, _utils3.transformData)(data);
 
   var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),
@@ -231,6 +232,7 @@ var AutoComplete = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     id: id,
     disabled: disabled,
     value: value,
+    size: size,
     onBlur: handleInputBlur,
     onFocus: handleInputFocus,
     onChange: handleChange,
@@ -260,6 +262,7 @@ AutoComplete.propTypes = (0, _extends2.default)({}, _utils2.animationPropTypes,
   renderMenu: _propTypes.default.func,
   renderMenuItem: _propTypes.default.func,
   style: _propTypes.default.object,
+  size: _propTypes.default.oneOf(['lg', 'md', 'sm', 'xs']),
   open: _propTypes.default.bool,
   selectOnEnter: _propTypes.default.bool,
   filterBy: _propTypes.default.func

package/cjs/Calendar/MonthDropdown.d.ts

@@ -22,5 +22,6 @@ export interface RowProps {
     /** Style object to be applied to row (to position it); */
     style?: React.CSSProperties;
 }
+export declare function isEveryDateInMonth(year: number, month: number, predicate: (date: Date) => boolean): boolean;
 declare const MonthDropdown: RsRefForwardingComponent<'div', MonthDropdownProps>;
 export default MonthDropdown;

package/cjs/Calendar/MonthDropdown.js

@@ -5,6 +5,7 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
+exports.isEveryDateInMonth = isEveryDateInMonth;
 exports.default = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
@@ -25,6 +26,18 @@ var _CalendarContext = require("./CalendarContext");
 
 var monthMap = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
 
+function isEveryDateInMonth(year, month, predicate) {
+  var days = _utils.DateUtils.getDaysInMonth(new Date(year, month));
+
+  for (var i = 1; i <= days; i++) {
+    if (!predicate(new Date(year, month, i))) {
+      return false;
+    }
+  }
+
+  return true;
+}
+
 var MonthDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
       Component = _props$as === void 0 ? 'div' : _props$as,
@@ -60,16 +73,7 @@ var MonthDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
   }, [limitEndYear, startYear, thisYear]);
   var isMonthDisabled = (0, _react.useCallback)(function (year, month) {
     if (disabledMonth) {
-      var days = _utils.DateUtils.getDaysInMonth(new Date(year, month)); // If all dates in a month are disabled, disable the current month
-
-
-      for (var i = 1; i <= days; i++) {
-        if (!disabledMonth(new Date(year, month, i))) {
-          return false;
-        }
-      }
-
-      return true;
+      return isEveryDateInMonth(year, month, disabledMonth);
     }
 
     return false;

package/cjs/Calendar/TableHeaderRow.js

@@ -52,15 +52,15 @@ var TableHeaderRow = /*#__PURE__*/_react.default.forwardRef(function (props, ref
     ref: ref,
     className: classes
   }), showWeekNumbers && /*#__PURE__*/_react.default.createElement("div", {
-    className: prefix('cell'),
+    className: prefix('header-cell'),
     role: "columnheader"
   }), items.map(function (key) {
     return /*#__PURE__*/_react.default.createElement("div", {
       key: key,
-      className: prefix('cell'),
+      className: prefix('header-cell'),
       role: "columnheader"
     }, /*#__PURE__*/_react.default.createElement("span", {
-      className: prefix('cell-content')
+      className: prefix('header-cell-content')
     }, locale === null || locale === void 0 ? void 0 : locale[key]));
   }));
 });

package/cjs/Cascader/Cascader.js

@@ -117,7 +117,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       valueToPaths = _usePaths.valueToPaths,
       columnData = _usePaths.columnData,
       addColumn = _usePaths.addColumn,
-      romoveColumnByIndex = _usePaths.romoveColumnByIndex,
+      removeColumnByIndex = _usePaths.removeColumnByIndex,
       setValueToPaths = _usePaths.setValueToPaths,
       setColumnData = _usePaths.setColumnData,
       setSelectedPaths = _usePaths.setSelectedPaths,
@@ -308,7 +308,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       addColumn(node[childrenKey], columnIndex);
     } else {
       // Removes subsequent columns of the current column when the clicked node is a leaf node.
-      romoveColumnByIndex(columnIndex);
+      removeColumnByIndex(columnIndex);
     }
 
     if (isLeafNode) {

package/cjs/Cascader/utils.d.ts

@@ -18,6 +18,6 @@ export declare function usePaths<T extends Record<string, unknown>>(params: UseP
     setColumnData: import("react").Dispatch<import("react").SetStateAction<T[][]>>;
     setSelectedPaths: import("react").Dispatch<import("react").SetStateAction<T[]>>;
     addColumn: (column: T[], index: number) => void;
-    romoveColumnByIndex: (index: number) => void;
+    removeColumnByIndex: (index: number) => void;
 };
 export {};

package/cjs/Cascader/utils.js

@@ -131,7 +131,7 @@ function usePaths(params) {
    */
 
 
-  function romoveColumnByIndex(index) {
+  function removeColumnByIndex(index) {
     setColumnData([].concat((0, _slice.default)(columnData, 0, index)));
   }
   /**
@@ -170,6 +170,6 @@ function usePaths(params) {
     setColumnData: setColumnData,
     setSelectedPaths: setSelectedPaths,
     addColumn: addColumn,
-    romoveColumnByIndex: romoveColumnByIndex
+    removeColumnByIndex: removeColumnByIndex
   };
 }

package/cjs/Content/Content.d.ts

@@ -4,5 +4,5 @@ export declare type ContentProps = ComponentProps;
  * For Internet Explorer 11 and lower, it's suggested that an ARIA role of "main"
  * be added to the <main> element to ensure it is accessible
  */
-declare const Content: import("../@types/common").RsRefForwardingComponent<"div", ComponentProps>;
+declare const Content: import("../@types/common").RsRefForwardingComponent<"main", ComponentProps>;
 export default Content;

package/cjs/DatePicker/DatePicker.d.ts

@@ -29,7 +29,11 @@ export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, Form
     showMeridian?: boolean;
     /** one tap to select */
     oneTap?: boolean;
-    /** Disabled date */
+    /**
+     * Whether to disable a date on the calendar view
+     *
+     * @returns date should be disabled (not selectable)
+     */
     disabledDate?: (date?: Date) => boolean;
     /** Disabled hours */
     disabledHours?: (hour: number, date: Date) => boolean;

package/cjs/DatePicker/DatePicker.js

@@ -29,6 +29,8 @@ var _CalendarContainer = _interopRequireDefault(require("../Calendar/CalendarCon
 
 var _useCalendarDate2 = _interopRequireDefault(require("../Calendar/useCalendarDate"));
 
+var _MonthDropdown = require("../Calendar/MonthDropdown");
+
 var _Toolbar = _interopRequireDefault(require("./Toolbar"));
 
 var _Stack = _interopRequireDefault(require("../Stack"));
@@ -336,6 +338,20 @@ var DatePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 
     return allowDate || allowTime;
   }, [disabledDateProp, props]);
+  /**
+   * Whether "OK" button is disabled
+   *
+   * - If format is date, disable ok button if selected date is disabled
+   * - If format is month, disable ok button if all dates in the month of selected date are disabled
+   */
+
+  var isOKButtonDisabled = (0, _react.useCallback)(function (selectedDate) {
+    if (_utils.DateUtils.shouldRenderMonth(formatStr) && !_utils.DateUtils.shouldRenderDate(formatStr)) {
+      return (0, _MonthDropdown.isEveryDateInMonth)(selectedDate.getFullYear(), selectedDate.getMonth(), disabledToolbarHandle);
+    }
+
+    return disabledToolbarHandle(selectedDate);
+  }, [disabledToolbarHandle, formatStr]);
   var calendarProps = (0, _react.useMemo)(function () {
     return (0, _mapValues.default)((0, _pick.default)(props, _utils.DateUtils.calendarOnlyProps), function (disabledOrHiddenTimeFunc) {
       return function (next, date) {
@@ -406,7 +422,7 @@ var DatePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       locale: locale,
       ranges: bottomRanges,
       calendarDate: calendarDate,
-      disabledOkBtn: disabledToolbarHandle,
+      disabledOkBtn: isOKButtonDisabled,
       disabledShortcut: disabledToolbarHandle,
       onClickShortcut: handleShortcutPageDate,
       onOk: handleOK,

package/cjs/Dropdown/Dropdown.d.ts

@@ -4,6 +4,7 @@ import { TypeAttributes, WithAsProps, RsRefForwardingComponent } from '../@types
 import { IconProps } from '@rsuite/icons/lib/Icon';
 import DropdownItem from './DropdownItem';
 import Button from '../Button';
+import DropdownSeparator from './DropdownSeparator';
 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 */
@@ -58,6 +59,7 @@ export interface DropdownComponent extends RsRefForwardingComponent<'div', Dropd
     } & React.ComponentProps<ToggleAs>, context: any): JSX.Element | null;
     Item: typeof DropdownItem;
     Menu: typeof DropdownMenu;
+    Separator: typeof DropdownSeparator;
 }
 /**
  * The <Dropdown> API

package/cjs/Dropdown/Dropdown.js

@@ -43,6 +43,8 @@ var _warnOnce = _interopRequireDefault(require("../utils/warnOnce"));
 
 var _Nav = _interopRequireDefault(require("../Nav"));
 
+var _DropdownSeparator = _interopRequireDefault(require("./DropdownSeparator"));
+
 /**
  * The <Dropdown> API
  * When used inside <Sidenav>, renders a <TreeviewRootItem>;
@@ -186,6 +188,7 @@ var Dropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 
 Dropdown.Item = _DropdownItem.default;
 Dropdown.Menu = _DropdownMenu.default;
+Dropdown.Separator = _DropdownSeparator.default;
 Dropdown.displayName = 'Dropdown';
 Dropdown.propTypes = {
   activeKey: _propTypes.default.any,

package/cjs/Dropdown/DropdownItem.d.ts

@@ -8,7 +8,11 @@ export interface DropdownMenuItemProps<T = any> extends WithAsProps, Omit<React.
     children?: React.ReactNode;
     /** You can use a custom element for this component */
     as?: React.ElementType;
-    /** Whether to display the divider */
+    /**
+     * Whether to display the divider
+     *
+     * @deprecated Use dedicated <Dropdown.Separator> component instead
+     */
     divider?: boolean;
     /** Disable the current option */
     disabled?: boolean;

package/cjs/Dropdown/DropdownItem.js

@@ -11,11 +11,13 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
+var _pick2 = _interopRequireDefault(require("lodash/pick"));
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _deprecatePropType = _interopRequireDefault(require("../utils/deprecatePropType"));
+var _deprecatePropType = _interopRequireWildcard(require("../utils/deprecatePropType"));
 
 var _MenuItem = _interopRequireDefault(require("../Menu/MenuItem"));
 
@@ -37,6 +39,8 @@ var _warnOnce = _interopRequireDefault(require("../utils/warnOnce"));
 
 var _Nav = _interopRequireDefault(require("../Nav"));
 
+var _DropdownSeparator = _interopRequireDefault(require("./DropdownSeparator"));
+
 /**
  * The <Dropdown.Item> API
  * When used inside <Sidenav>, renders a <TreeviewItem>
@@ -106,11 +110,7 @@ var DropdownItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
   }
 
   if (divider) {
-    return renderDropdownItem((0, _extends2.default)({
-      ref: ref,
-      role: 'separator',
-      className: merge(prefix('divider'), className)
-    }, restProps));
+    return /*#__PURE__*/_react.default.createElement(_DropdownSeparator.default, (0, _pick2.default)(props, ['data-testid']));
   }
 
   if (panel) {
@@ -159,7 +159,7 @@ var DropdownItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
 DropdownItem.displayName = 'Dropdown.Item';
 DropdownItem.propTypes = {
   as: _propTypes.default.elementType,
-  divider: _propTypes.default.bool,
+  divider: (0, _deprecatePropType.deprecatePropTypeNew)(_propTypes.default.bool, 'Use Dropdown.Separator component instead.'),
   panel: _propTypes.default.bool,
   trigger: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.oneOf(['click', 'hover'])]),
   open: (0, _deprecatePropType.default)(_propTypes.default.bool),

package/cjs/Dropdown/DropdownSeparator.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { RsRefForwardingComponent, WithAsProps } from '../@types/common';
+export interface DropdownSeparatorProps extends WithAsProps, React.HTMLAttributes<HTMLElement> {
+    /** You can use a custom element for this component */
+    as?: React.ElementType;
+}
+/**
+ * The <Dropdown.Separator> API
+ *
+ * Renders a non-focusable and non-interactive `separator`
+ * Per ARIA APG https://www.w3.org/WAI/ARIA/apg/patterns/menu/
+ */
+declare const DropdownSeparator: RsRefForwardingComponent<'li', DropdownSeparatorProps>;
+export default DropdownSeparator;

package/cjs/Dropdown/DropdownSeparator.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _utils = require("../utils");
+
+/**
+ * The <Dropdown.Separator> API
+ *
+ * Renders a non-focusable and non-interactive `separator`
+ * Per ARIA APG https://www.w3.org/WAI/ARIA/apg/patterns/menu/
+ */
+var DropdownSeparator = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'dropdown-item-divider' : _props$classPrefix,
+      className = props.className,
+      _props$as = props.as,
+      Component = _props$as === void 0 ? 'li' : _props$as,
+      restProps = (0, _objectWithoutPropertiesLoose2.default)(props, ["classPrefix", "className", "as"]);
+
+  var _useClassNames = (0, _utils.useClassNames)(classPrefix),
+      merge = _useClassNames.merge,
+      withClassPrefix = _useClassNames.withClassPrefix;
+
+  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
+    ref: ref,
+    role: "separator",
+    className: merge(withClassPrefix(), className)
+  }, restProps));
+});
+
+DropdownSeparator.displayName = 'Dropdown.Separator';
+DropdownSeparator.propTypes = {
+  as: _propTypes.default.elementType
+};
+var _default = DropdownSeparator;
+exports.default = _default;

package/cjs/Footer/Footer.d.ts

@@ -1,4 +1,4 @@
 import { ComponentProps } from '../utils/createComponent';
 export declare type FooterProps = ComponentProps;
-declare const Footer: import("../@types/common").RsRefForwardingComponent<"div", ComponentProps>;
+declare const Footer: import("../@types/common").RsRefForwardingComponent<"footer", ComponentProps>;
 export default Footer;

package/cjs/Header/Header.d.ts

@@ -1,4 +1,4 @@
 import { ComponentProps } from '../utils/createComponent';
 export declare type HeaderProps = ComponentProps;
-declare const Header: import("../@types/common").RsRefForwardingComponent<"div", ComponentProps>;
+declare const Header: import("../@types/common").RsRefForwardingComponent<"header", ComponentProps>;
 export default Header;

package/cjs/MultiCascader/MultiCascader.js

@@ -127,7 +127,7 @@ var MultiCascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       columnData = _useColumnData.columnData,
       setColumnData = _useColumnData.setColumnData,
       addColumn = _useColumnData.addColumn,
-      romoveColumnByIndex = _useColumnData.romoveColumnByIndex,
+      removeColumnByIndex = _useColumnData.removeColumnByIndex,
       enforceUpdateColumnData = _useColumnData.enforceUpdateColumnData;
 
   (0, _utils3.useUpdateEffect)(function () {
@@ -223,7 +223,7 @@ var MultiCascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
           node.loading = false;
           node[childrenKey] = data;
 
-          if (targetRef.current) {
+          if (targetRef.current || inline) {
             addFlattenData(data, node);
             addColumn(data, columnIndex);
           }
@@ -238,11 +238,11 @@ var MultiCascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       addColumn(node[childrenKey], columnIndex);
     } else {
       // Removes subsequent columns of the current column when the clicked node is a leaf node.
-      romoveColumnByIndex(columnIndex);
+      removeColumnByIndex(columnIndex);
     }
 
     (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : (_triggerRef$current$u = _triggerRef$current.updatePosition) === null || _triggerRef$current$u === void 0 ? void 0 : _triggerRef$current$u.call(_triggerRef$current);
-  }, [onSelect, getChildren, childrenKey, addFlattenData, addColumn, romoveColumnByIndex]);
+  }, [onSelect, getChildren, childrenKey, inline, addFlattenData, addColumn, removeColumnByIndex]);
   var handleCheck = (0, _react.useCallback)(function (node, event, checked) {
     var nodeValue = node[valueKey];
     var nextValue = [];

package/cjs/MultiCascader/utils.d.ts

@@ -51,7 +51,7 @@ export declare function useFlattenData<T>(data: T[], itemKeys: ItemKeys): {
 export declare function useColumnData<T extends MayHasParent<Record<string, unknown>>>(flattenData: T[]): {
     columnData: T[][];
     addColumn: (column: T[], index: number) => void;
-    romoveColumnByIndex: (index: number) => void;
+    removeColumnByIndex: (index: number) => void;
     setColumnData: import("react").Dispatch<import("react").SetStateAction<T[][]>>;
     enforceUpdateColumnData: (nextData: T[]) => void;
 };