rsuite 5.0.0-beta.8 → 5.0.0

package/esm/@types/common.d.ts

@@ -72,6 +72,8 @@ export interface PickerBaseProps<LocaleType = any> extends WithAsProps, Animatio
     defaultOpen?: boolean;
     /** A picker that can clear values */
     cleanable?: boolean;
+    /** A picker can have different sizes */
+    size?: TypeAttributes.Size;
     /** Called when Modal is displayed */
     onOpen?: () => void;
     /** Called when Modal is closed */

package/esm/DateRangePicker/Calendar.d.ts

@@ -13,7 +13,8 @@ export interface CalendarProps extends WithAsProps, Omit<CalendarCoreProps, Omit
     isoWeek?: boolean;
     limitEndYear?: number;
     locale?: DatePickerLocale;
-    onChangeCalendarDate?: (index: number, nextPageDate: Date) => void;
+    onChangeCalendarDate?: (index: number, date: Date) => void;
+    onChangeCalendarTime?: (index: number, date: Date) => void;
     onMouseMove?: (date: Date) => void;
     onSelect?: (date: Date, event?: React.SyntheticEvent<any>) => void;
     showOneCalendar?: boolean;

package/esm/DateRangePicker/Calendar.js

@@ -19,9 +19,10 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
       index = props.index,
       limitEndYear = props.limitEndYear,
       onChangeCalendarDate = props.onChangeCalendarDate,
+      onChangeCalendarTime = props.onChangeCalendarTime,
       showOneCalendar = props.showOneCalendar,
       value = props.value,
-      rest = _objectWithoutPropertiesLoose(props, ["as", "calendarDate", "disabledDate", "index", "limitEndYear", "onChangeCalendarDate", "showOneCalendar", "value"]);
+      rest = _objectWithoutPropertiesLoose(props, ["as", "calendarDate", "disabledDate", "index", "limitEndYear", "onChangeCalendarDate", "onChangeCalendarTime", "showOneCalendar", "value"]);
 
   var _useState = useState(),
       calendarState = _useState[0],
@@ -38,8 +39,8 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (props, ref) {
     setCalendarState(undefined);
   }, [index, onChangeCalendarDate]);
   var handleChangePageTime = useCallback(function (nextPageDate) {
-    onChangeCalendarDate(index, nextPageDate);
-  }, [index, onChangeCalendarDate]);
+    onChangeCalendarTime(index, nextPageDate);
+  }, [index, onChangeCalendarTime]);
   var toggleMonthDropdown = useCallback(function () {
     setCalendarState(calendarState === CalendarState.DROP_MONTH ? undefined : CalendarState.DROP_MONTH);
   }, [calendarState]);

package/esm/DateRangePicker/DateRangePicker.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { PickerComponent } from '../Picker';
 import { FormControlBaseProps, PickerBaseProps } from '../@types/common';
+import { PickerComponent } from '../Picker';
 import { DisabledDateFunction, RangeType, ValueType } from './types';
 export interface DateRangePickerProps extends PickerBaseProps, FormControlBaseProps<ValueType> {
     /** Configure shortcut options */

package/esm/DateRangePicker/DateRangePicker.js

@@ -1,20 +1,20 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-import React, { useCallback, useEffect, useRef, useState } from 'react';
-import PropTypes from 'prop-types';
+import IconCalendar from '@rsuite/icons/legacy/Calendar';
+import isUndefined from 'lodash/isUndefined';
 import omit from 'lodash/omit';
+import partial from 'lodash/partial';
 import pick from 'lodash/pick';
-import isUndefined from 'lodash/isUndefined';
-import { addMonths, compareAsc, isSameDay, isSameMonth } from '../utils/dateUtils';
-import * as disabledDateUtils from './disabledDateUtils';
+import PropTypes from 'prop-types';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { FormattedDate } from '../CustomProvider';
 import Toolbar from '../DatePicker/Toolbar';
-import Calendar from './Calendar';
-import { getCalendarDate, getMonthHoverRange, getWeekHoverRange, setTimingMargin } from './utils';
+import { omitTriggerPropKeys, pickerDefaultProps, PickerOverlay, pickerPropTypes, PickerToggle, PickerToggleTrigger, pickTriggerPropKeys, usePickerClassName, usePublicMethods, useToggleKeyDownEvent } from '../Picker';
 import { createChainedFunction, DATERANGE_DISABLED_TARGET, DateUtils, mergeRefs, useClassNames, useControlled, useCustom } from '../utils';
-import { PickerOverlay, pickerDefaultProps, pickerPropTypes, usePublicMethods, useToggleKeyDownEvent, PickerToggle, PickerToggleTrigger, pickTriggerPropKeys, omitTriggerPropKeys, usePickerClassName } from '../Picker';
-import partial from 'lodash/partial';
-import IconCalendar from '@rsuite/icons/legacy/Calendar';
+import { addMonths, compareAsc, isSameMonth } from '../utils/dateUtils';
+import Calendar from './Calendar';
+import * as disabledDateUtils from './disabledDateUtils';
+import { getCalendarDate, getMonthHoverRange, getWeekHoverRange, isSameRange, setTimingMargin } from './utils';
 
 var defaultProps = _extends({}, pickerDefaultProps, {
   as: 'div',
@@ -234,7 +234,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var nextValue = !isUndefined(nextSelectValue) ? nextSelectValue : selectValue;
     setSelectValue(nextValue || []);
 
-    if (!isSameDay(nextValue[0], value[0]) || !isSameDay(nextValue[1], value[1])) {
+    if (!isSameRange(nextValue, value, formatStr)) {
       setValue(nextValue);
       onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
     } // `closeOverlay` default value is `true`
@@ -243,7 +243,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     if (closeOverlay !== false) {
       handleCloseDropdown();
     }
-  }, [handleCloseDropdown, onChange, selectValue, setSelectValue, setValue, value]);
+  }, [formatStr, handleCloseDropdown, onChange, selectValue, setValue, value]);
   /**
    * Select the date range. If oneTap is not set, you need to click twice to select the start time and end time.
    * The MouseMove event is called between the first click and the second click to update the selection state.
@@ -332,6 +332,20 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     nextCalendarDate[index] = date;
     updateCalendarDate(nextCalendarDate);
   }, [calendarDate, updateCalendarDate]);
+  var handleChangeCalendarTime = useCallback(function (index, date) {
+    setSelectValue(function (prev) {
+      var next = [].concat(prev);
+      var clonedDate = new Date(date.valueOf()); // if next[index] is not empty, only update the time after aligning the year, month and day
+
+      if (next[index]) {
+        clonedDate.setFullYear(next[index].getFullYear(), next[index].getMonth(), next[index].getDate());
+      }
+
+      next[index] = clonedDate;
+      return next;
+    });
+    handleChangeCalendarDate(index, date);
+  }, [handleChangeCalendarDate]);
   /**
    * Toolbar operation callback function
    */
@@ -496,6 +510,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       showWeekNumbers: showWeekNumbers,
       value: selectValue,
       onChangeCalendarDate: handleChangeCalendarDate,
+      onChangeCalendarTime: handleChangeCalendarTime,
       onMouseMove: handleMouseMove,
       onSelect: handleSelectValueChange
     };

package/esm/DateRangePicker/utils.d.ts

@@ -4,6 +4,6 @@ export declare function getCalendarDate({ value }: {
     value?: ValueType;
 }): ValueType;
 export declare const getDefaultRanges: () => RangeType[];
-export declare const isSameValueType: (source: ValueType, dest: ValueType) => boolean;
+export declare const isSameRange: (source: ValueType, dest: ValueType, format: string) => boolean;
 export declare const getMonthHoverRange: (date: Date) => ValueType;
 export declare const getWeekHoverRange: (isoWeek: boolean, date: Date) => ValueType;

package/esm/DateRangePicker/utils.js

@@ -36,10 +36,14 @@ export var getDefaultRanges = function getDefaultRanges() {
     value: [setTimingMargin(DateUtils.subDays(todayDate, 6)), setTimingMargin(todayDate, 'right')]
   }];
 };
-export var isSameValueType = function isSameValueType(source, dest) {
-  var _source$, _dest$, _source$2, _dest$2;
+export var isSameRange = function isSameRange(source, dest, format) {
+  var result = DateUtils.isSameDay(source === null || source === void 0 ? void 0 : source[0], dest === null || dest === void 0 ? void 0 : dest[0]) && DateUtils.isSameDay(source === null || source === void 0 ? void 0 : source[1], dest === null || dest === void 0 ? void 0 : dest[1]);
 
-  return (source === null || source === void 0 ? void 0 : (_source$ = source[0]) === null || _source$ === void 0 ? void 0 : _source$.valueOf()) === (dest === null || dest === void 0 ? void 0 : (_dest$ = dest[0]) === null || _dest$ === void 0 ? void 0 : _dest$.valueOf()) && (source === null || source === void 0 ? void 0 : (_source$2 = source[1]) === null || _source$2 === void 0 ? void 0 : _source$2.valueOf()) === (dest === null || dest === void 0 ? void 0 : (_dest$2 = dest[1]) === null || _dest$2 === void 0 ? void 0 : _dest$2.valueOf());
+  if (DateUtils.shouldTime(format)) {
+    result && (result = DateUtils.isSameSecond(source === null || source === void 0 ? void 0 : source[0], dest === null || dest === void 0 ? void 0 : dest[0]) && DateUtils.isSameSecond(source === null || source === void 0 ? void 0 : source[1], dest === null || dest === void 0 ? void 0 : dest[1]));
+  }
+
+  return result;
 };
 export var getMonthHoverRange = function getMonthHoverRange(date) {
   return [DateUtils.startOfMonth(date), DateUtils.endOfMonth(date)];

package/esm/Dropdown/Dropdown.js

@@ -1,8 +1,9 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useCallback, useContext, useMemo } from 'react';
+import React, { useCallback, useContext, useMemo, useReducer } from 'react';
 import PropTypes from 'prop-types';
 import omit from 'lodash/omit';
+import pick from 'lodash/pick';
 import DropdownMenu from './DropdownMenu';
 import { mergeRefs, PLACEMENT_8, placementPolyfill, useClassNames } from '../utils';
 import { SidenavContext } from '../Sidenav/Sidenav';
@@ -18,6 +19,7 @@ import { NavbarContext } from '../Navbar/Navbar';
 import Disclosure from '../Disclosure/Disclosure';
 import SidenavDropdown from '../Sidenav/SidenavDropdown';
 import NavContext from '../Nav/NavContext';
+import { initialState, reducer } from './DropdownState';
 var defaultProps = {
   as: 'div',
   classPrefix: 'dropdown',
@@ -96,14 +98,29 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, [trigger]);
   var parentMenu = useContext(MenuContext);
   var sidenav = useContext(SidenavContext);
-  var navbar = useContext(NavbarContext); // Render a disclosure when inside expanded <Sidenav>
+  var navbar = useContext(NavbarContext);
+
+  var _useReducer = useReducer(reducer, initialState),
+      items = _useReducer[0].items,
+      dispatch = _useReducer[1];
+
+  var hasSelectedItem = useMemo(function () {
+    return items.some(function (item) {
+      return item.props.selected;
+    });
+  }, [items]);
+  var dropdownContextValue = useMemo(function () {
+    return {
+      activeKey: activeKey,
+      onSelect: emitSelect,
+      hasSelectedItem: hasSelectedItem,
+      dispatch: dispatch
+    };
+  }, [activeKey, emitSelect, hasSelectedItem, dispatch]); // Render a disclosure when inside expanded <Sidenav>
 
   if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {
     return /*#__PURE__*/React.createElement(DropdownContext.Provider, {
-      value: {
-        activeKey: activeKey,
-        onSelect: emitSelect
-      }
+      value: dropdownContextValue
     }, /*#__PURE__*/React.createElement(SidenavDropdown, _extends({
       ref: ref
     }, rest)));
@@ -112,10 +129,7 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
   if (navbar) {
     return /*#__PURE__*/React.createElement(DropdownContext.Provider, {
-      value: {
-        activeKey: activeKey,
-        onSelect: emitSelect
-      }
+      value: dropdownContextValue
     }, /*#__PURE__*/React.createElement(Disclosure, {
       hideOnClickOutside: true
     }, function (_ref, containerRef) {
@@ -155,7 +169,7 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       className: toggleClassName,
       placement: placement,
       disabled: disabled
-    }, omit(menuButtonProps, ['open']), toggleProps), title);
+    }, omit(menuButtonProps, ['open']), omit(toggleProps, ['data-testid'])), title);
   };
 
   if (parentMenu) {
@@ -172,16 +186,13 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
           className: mergeNavItemClassNames(toggleClassName, withNavItemClassPrefix({
             focus: active
           }))
-        }, menuButtonProps, omit(menuitemProps, ['onClick']), toggleProps), title);
+        }, menuButtonProps, omit(menuitemProps, ['onClick']), omit(toggleProps, 'data-testid')), title);
       });
     };
   }
 
   return /*#__PURE__*/React.createElement(DropdownContext.Provider, {
-    value: {
-      activeKey: activeKey,
-      onSelect: emitSelect
-    }
+    value: dropdownContextValue
   }, /*#__PURE__*/React.createElement(Menu, {
     menuButtonText: title,
     renderMenuButton: renderMenuButton,
@@ -190,7 +201,7 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       var open = _ref4.open,
           popupProps = _objectWithoutPropertiesLoose(_ref4, ["open"]);
 
-      var menuClassName = mergeMenuClassName(className, withMenuClassPrefix()); // When inside a collapsed <Sidenav>, render a header in menu
+      var menuClassName = mergeMenuClassName(className, withMenuClassPrefix({})); // When inside a collapsed <Sidenav>, render a header in menu
 
       var showHeader = !!sidenav;
       return /*#__PURE__*/React.createElement("ul", _extends({
@@ -218,11 +229,11 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var open = _ref5.open,
         menuContainer = _objectWithoutPropertiesLoose(_ref5, ["open"]);
 
-    var classes = merge(className, withClassPrefix((_withClassPrefix2 = {}, _withClassPrefix2["placement-" + kebabCase(placementPolyfill(placement))] = !!placement, _withClassPrefix2.disabled = disabled, _withClassPrefix2.open = open, _withClassPrefix2.submenu = !!parentMenu, _withClassPrefix2)));
+    var classes = merge(className, withClassPrefix((_withClassPrefix2 = {}, _withClassPrefix2["placement-" + kebabCase(placementPolyfill(placement))] = !!placement, _withClassPrefix2.disabled = disabled, _withClassPrefix2.open = open, _withClassPrefix2.submenu = !!parentMenu, _withClassPrefix2['selected-within'] = hasSelectedItem, _withClassPrefix2)));
     return /*#__PURE__*/React.createElement(Component, _extends({
       ref: mergeRefs(ref, menuContainerRef),
       className: classes
-    }, menuContainer, {
+    }, menuContainer, pick(toggleProps, ['data-testid']), {
       style: style
     }));
   }));

package/esm/Dropdown/DropdownContext.d.ts

@@ -1,7 +1,10 @@
-import React from 'react';
+import React, { Dispatch } from 'react';
+import { DropdownAction } from './DropdownState';
 export interface DropdownContextProps {
     activeKey?: string;
     onSelect: (eventKey: string, event: React.SyntheticEvent) => void;
+    hasSelectedItem?: boolean;
+    dispatch?: Dispatch<DropdownAction>;
 }
 declare const DropdownContext: React.Context<DropdownContextProps>;
 export default DropdownContext;

package/esm/Dropdown/DropdownItem.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useCallback, useContext } from 'react';
+import React, { useCallback, useContext, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { SidenavContext } from '../Sidenav/Sidenav';
 import deprecatePropType from '../utils/deprecatePropType';
@@ -13,6 +13,8 @@ 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';
 var defaultProps = {
   as: 'li',
   classPrefix: 'dropdown-item'
@@ -32,6 +34,7 @@ var DropdownItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
       icon = props.icon,
       rest = _objectWithoutPropertiesLoose(props, ["classPrefix", "className", "active", "eventKey", "onSelect", "icon"]);
 
+  var internalId = useInternalId('DropdownItem');
   var nav = useContext(NavContext);
   var dropdown = useContext(DropdownContext);
 
@@ -59,6 +62,29 @@ var DropdownItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     });
     handleSelectItem === null || handleSelectItem === void 0 ? void 0 : handleSelectItem(event);
   }, [dispatchDisclosure, handleSelectItem]);
+  var selected = activeProp || !isNil(eventKey) && (shallowEqual(dropdown === null || dropdown === void 0 ? void 0 : dropdown.activeKey, eventKey) || shallowEqual(nav === null || nav === void 0 ? void 0 : nav.activeKey, eventKey));
+  var dispatch = dropdown === null || dropdown === void 0 ? void 0 : dropdown.dispatch;
+  useEffect(function () {
+    if (dispatch) {
+      dispatch({
+        type: DropdownActionType.RegisterItem,
+        payload: {
+          id: internalId,
+          props: {
+            selected: selected
+          }
+        }
+      });
+      return function () {
+        dispatch({
+          type: DropdownActionType.UnregisterItem,
+          payload: {
+            id: internalId
+          }
+        });
+      };
+    }
+  }, [internalId, selected, dispatch]);
 
   if (sidenav !== null && sidenav !== void 0 && sidenav.expanded) {
     return /*#__PURE__*/React.createElement(SidenavDropdownItem, _extends({
@@ -66,8 +92,6 @@ var DropdownItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }, props));
   }
 
-  var menuitemSelected = activeProp || !isNil(eventKey) && (shallowEqual(dropdown === null || dropdown === void 0 ? void 0 : dropdown.activeKey, eventKey) || shallowEqual(nav === null || nav === void 0 ? void 0 : nav.activeKey, eventKey));
-
   var Component = rest.as,
       divider = rest.divider,
       panel = rest.panel,
@@ -97,7 +121,7 @@ var DropdownItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
       disabled: disabled,
       divider: divider,
       panel: panel,
-      active: menuitemSelected
+      active: selected
     }));
     var dataAttributes = {
       'data-event-key': eventKey
@@ -110,7 +134,7 @@ var DropdownItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(SafeAnchor, _extends({
       ref: ref,
       className: classes,
-      "aria-current": menuitemSelected || undefined
+      "aria-current": selected || undefined
     }, dataAttributes, restProps, {
       onClick: createChainedFunction(handleClickNavbarDropdownItem, restProps.onClick)
     }), icon && /*#__PURE__*/React.cloneElement(icon, {
@@ -119,7 +143,7 @@ var DropdownItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }
 
   return /*#__PURE__*/React.createElement(MenuItem, {
-    selected: menuitemSelected,
+    selected: selected,
     disabled: disabled,
     onActivate: handleSelectItem
   }, function (_ref2, menuitemRef) {

package/esm/Dropdown/DropdownState.d.ts

@@ -0,0 +1,37 @@
+interface DropdownItemState {
+    /**
+     * Internal ID
+     */
+    id: string;
+    /**
+     *
+     */
+    props: {
+        selected: boolean;
+    };
+}
+interface DropdownState {
+    items: DropdownItemState[];
+}
+export declare const initialState: DropdownState;
+export declare enum DropdownActionType {
+    RegisterItem = 0,
+    UnregisterItem = 1,
+    UpdateItem = 2
+}
+export declare type DropdownAction = {
+    type: DropdownActionType.RegisterItem;
+    payload: {
+        id: string;
+        props: {
+            selected: boolean;
+        };
+    };
+} | {
+    type: DropdownActionType.UnregisterItem;
+    payload: {
+        id: string;
+    };
+};
+export declare function reducer(state: DropdownState, action: DropdownAction): DropdownState;
+export {};

package/esm/Dropdown/DropdownState.js

@@ -0,0 +1,55 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+export var initialState = {
+  items: []
+};
+export var DropdownActionType;
+
+(function (DropdownActionType) {
+  DropdownActionType[DropdownActionType["RegisterItem"] = 0] = "RegisterItem";
+  DropdownActionType[DropdownActionType["UnregisterItem"] = 1] = "UnregisterItem";
+  DropdownActionType[DropdownActionType["UpdateItem"] = 2] = "UpdateItem";
+})(DropdownActionType || (DropdownActionType = {}));
+
+export function reducer(state, action) {
+  if (state === void 0) {
+    state = initialState;
+  }
+
+  switch (action.type) {
+    case DropdownActionType.RegisterItem:
+      if (state.items.find(function (item) {
+        return item.id === action.payload.id;
+      })) {
+        return _extends({}, state, {
+          items: state.items.map(function (item) {
+            if (item.id === action.payload.id) {
+              return _extends({}, item, {
+                props: _extends({}, item.props, {
+                  selected: action.payload.props.selected
+                })
+              });
+            }
+
+            return item;
+          })
+        });
+      }
+
+      return _extends({}, state, {
+        items: [].concat(state.items, [{
+          id: action.payload.id,
+          props: action.payload.props
+        }])
+      });
+
+    case DropdownActionType.UnregisterItem:
+      return _extends({}, state, {
+        items: state.items.filter(function (item) {
+          return item.id !== action.payload.id;
+        })
+      });
+
+    default:
+      return state;
+  }
+}

package/esm/SelectPicker/SelectPicker.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { PickerLocale } from '../locales';
 import { PickerComponent } from '../Picker';
-import { TypeAttributes, FormControlPickerProps, ItemDataType } from '../@types/common';
+import { FormControlPickerProps, ItemDataType } from '../@types/common';
 import { ListProps } from 'react-virtualized/dist/commonjs/List';
 export declare type ValueType = number | string;
 export interface SelectProps<T = ValueType> {
@@ -16,8 +16,6 @@ export interface SelectProps<T = ValueType> {
      * https://github.com/bvaughn/react-virtualized/blob/master/docs/List.md#prop-types
      */
     listProps?: ListProps;
-    /** A picker can have different sizes */
-    size?: TypeAttributes.Size;
     /** Custom search rules. */
     searchBy?: (keyword: string, label: React.ReactNode, item: ItemDataType) => boolean;
     /** Sort options */

package/esm/Sidenav/SidenavDropdown.js

@@ -11,6 +11,7 @@ import { SidenavContext } from './Sidenav';
 import deprecatePropType from '../utils/deprecatePropType';
 import SidenavDropdownCollapse from './SidenavDropdownCollapse';
 import Disclosure from '../Disclosure/Disclosure';
+import DropdownContext from '../Dropdown/DropdownContext';
 var defaultProps = {
   as: 'div',
   classPrefix: 'dropdown',
@@ -43,6 +44,9 @@ var SidenavDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       openKeys = _useContext$openKeys === void 0 ? [] : _useContext$openKeys,
       onOpenChange = _useContext.onOpenChange;
 
+  var _useContext2 = useContext(DropdownContext),
+      hasSelectedItem = _useContext2.hasSelectedItem;
+
   var _useClassNames = useClassNames(classPrefix),
       merge = _useClassNames.merge,
       withClassPrefix = _useClassNames.withClassPrefix;
@@ -65,7 +69,7 @@ var SidenavDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var _withClassPrefix;
 
     var open = _ref.open;
-    var classes = merge(className, withClassPrefix((_withClassPrefix = {}, _withClassPrefix["placement-" + kebabCase(placementPolyfill(placement))] = placement, _withClassPrefix[open ? 'expand' : 'collapse'] = true, _withClassPrefix.disabled = disabled, _withClassPrefix['no-caret'] = noCaret, _withClassPrefix)));
+    var classes = merge(className, withClassPrefix((_withClassPrefix = {}, _withClassPrefix["placement-" + kebabCase(placementPolyfill(placement))] = placement, _withClassPrefix[open ? 'expand' : 'collapse'] = true, _withClassPrefix.disabled = disabled, _withClassPrefix['selected-within'] = hasSelectedItem, _withClassPrefix['no-caret'] = noCaret, _withClassPrefix)));
     return /*#__PURE__*/React.createElement(Component, _extends({
       ref: mergeRefs(ref, containerRef),
       style: style,

package/esm/Sidenav/SidenavItem.js

@@ -61,26 +61,20 @@ var SidenavItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
         focus: active,
         active: selected,
         disabled: disabled
-      }));
-      var item = /*#__PURE__*/React.createElement(Component, _extends({
-        ref: mergeRefs(ref, menuitemRef),
-        disabled: Component === SafeAnchor ? disabled : undefined,
-        className: classes,
-        "data-event-key": eventKey
-      }, menuitem, omit(rest, ['divider', 'panel'])), icon, _children, /*#__PURE__*/React.createElement(Ripple, null)); // Show tooltip when inside a collapse <Sidenav>
+      })); // Show tooltip when inside a collapse <Sidenav>
 
-      return sidenav ? appendTooltip({
+      return appendTooltip({
         children: function children(triggerProps, triggerRef) {
           return /*#__PURE__*/React.createElement(Component, _extends({
             ref: mergeRefs(mergeRefs(ref, menuitemRef), triggerRef),
             disabled: Component === SafeAnchor ? disabled : undefined,
             className: classes,
             "data-event-key": eventKey
-          }, menuitem, omit(rest, ['divider', 'panel']), triggerProps), icon, _children, /*#__PURE__*/React.createElement(Ripple, null));
+          }, omit(rest, ['divider', 'panel']), triggerProps, menuitem), icon, _children, /*#__PURE__*/React.createElement(Ripple, null));
         },
         message: _children,
         placement: 'right'
-      }) : item;
+      });
     });
   }
 

package/esm/utils/dateUtils.d.ts

@@ -19,6 +19,7 @@ export { default as isBefore } from 'date-fns/isBefore';
 export { default as isEqual } from 'date-fns/isEqual';
 export { default as isSameDay } from 'date-fns/isSameDay';
 export { default as isSameMonth } from 'date-fns/isSameMonth';
+export { default as isSameSecond } from 'date-fns/isSameSecond';
 export { default as parse } from 'date-fns/parse';
 export { default as parseISO } from 'date-fns/parseISO';
 export { default as setDate } from 'date-fns/setDate';

package/esm/utils/dateUtils.js

@@ -26,6 +26,7 @@ export { default as isBefore } from 'date-fns/isBefore';
 export { default as isEqual } from 'date-fns/isEqual';
 export { default as isSameDay } from 'date-fns/isSameDay';
 export { default as isSameMonth } from 'date-fns/isSameMonth';
+export { default as isSameSecond } from 'date-fns/isSameSecond';
 export { default as parse } from 'date-fns/parse';
 export { default as parseISO } from 'date-fns/parseISO';
 export { default as setDate } from 'date-fns/setDate';

package/esm/utils/useInternalId.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Used for generating unique ID for DOM elements
+ */
+export default function useInternalId(prefix?: string): string;

package/esm/utils/useInternalId.js

@@ -0,0 +1,16 @@
+import { useDebugValue, useRef } from 'react';
+import uniqueId from 'lodash/uniqueId';
+/**
+ * Used for generating unique ID for DOM elements
+ */
+
+export default function useInternalId(prefix) {
+  var idRef = useRef();
+
+  if (!idRef.current) {
+    idRef.current = uniqueId("internal://" + prefix);
+  }
+
+  useDebugValue(idRef.current);
+  return idRef.current;
+}

package/esm/utils/useUniqueId.d.ts

@@ -1,4 +1,4 @@
 /**
- * Used for generating unique ID for elements
+ * Used for generating unique ID for DOM elements
  */
 export default function useUniqueId(prefix?: string): string;

package/esm/utils/useUniqueId.js

@@ -1,7 +1,7 @@
 import { useRef } from 'react';
 import uniqueId from 'lodash/uniqueId';
 /**
- * Used for generating unique ID for elements
+ * Used for generating unique ID for DOM elements
  */
 
 export default function useUniqueId(prefix) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rsuite",
-  "version": "5.0.0-beta.8",
+  "version": "5.0.0",
   "description": "A suite of react components",
   "main": "cjs/index.js",
   "module": "esm/index.js",
@@ -39,7 +39,7 @@
     "prop-types": "^15.7.2",
     "react-text-mask": "^5.4.3",
     "react-virtualized": "^9.22.3",
-    "rsuite-table": "^5.0.0-beta.3",
+    "rsuite-table": "^5.0.0",
     "schema-typed": "^2.0.1"
   },
   "peerDependencies": {

package/styles/color-modes/dark.less

@@ -159,6 +159,22 @@
   --rs-navbar-subtle-hover-bg: @B700;
   --rs-navbar-subtle-hover-text: @B050;
 
+  // Sidenav
+  --rs-sidenav-default-bg: @B800;
+  --rs-sidenav-default-text: @B200;
+  --rs-sidenav-default-selected-text: @H500;
+  --rs-sidenav-default-hover-bg: @B700;
+  --rs-sidenav-default-hover-text: @B050;
+  --rs-sidenav-inverse-bg: @H700;
+  --rs-sidenav-inverse-text: #fff;
+  --rs-sidenav-inverse-selected-bg: @H400;
+  --rs-sidenav-inverse-hover-bg: @H600;
+  --rs-sidenav-subtle-bg: transparent;
+  --rs-sidenav-subtle-text: @B200;
+  --rs-sidenav-subtle-selected-text: @H500;
+  --rs-sidenav-subtle-hover-bg: @B700;
+  --rs-sidenav-subtle-hover-text: @B050;
+
   // Input
   --rs-input-bg: @B800;
   --rs-input-focus-border: @H500;