rsuite 5.68.1 → 5.70.0

package/cjs/MultiCascadeTree/MultiCascadeTree.d.ts

@@ -5,5 +5,5 @@ import type { MultiCascadeTreeProps } from './types';
  * The `MultiCascadeTree` component is used to select multiple values from cascading options.
  * @see https://rsuitejs.com/components/multi-cascade-tree/
  */
-declare const MultiCascadeTree: React.ForwardRefExoticComponent<MultiCascadeTreeProps<DataItemValue, DataItemValue[]> & React.RefAttributes<unknown>>;
+declare const MultiCascadeTree: React.ForwardRefExoticComponent<MultiCascadeTreeProps<DataItemValue, DataItemValue[], any> & React.RefAttributes<unknown>>;
 export default MultiCascadeTree;

package/cjs/MultiCascadeTree/MultiCascadeTree.js

@@ -11,7 +11,7 @@ var _TreeView = _interopRequireDefault(require("./TreeView"));
 var _hooks = require("./hooks");
 var _hooks2 = require("../internals/hooks");
 var _SearchView = _interopRequireDefault(require("./SearchView"));
-var _excluded = ["as", "data", "defaultValue", "className", "classPrefix", "value", "valueKey", "labelKey", "childrenKey", "disabledItemValues", "cascade", "columnWidth", "columnHeight", "searchable", "uncheckableItemValues", "getChildren", "renderColumn", "renderTreeNode", "onSelect", "onCheck", "onChange", "onSearch"];
+var _excluded = ["as", "data", "defaultValue", "className", "classPrefix", "value", "valueKey", "labelKey", "locale", "childrenKey", "disabledItemValues", "cascade", "columnWidth", "columnHeight", "searchable", "uncheckableItemValues", "getChildren", "renderColumn", "renderTreeNode", "onSelect", "onCheck", "onChange", "onSearch"];
 var emptyArray = [];
 
 /**
@@ -32,6 +32,7 @@ var MultiCascadeTree = /*#__PURE__*/_react.default.forwardRef(function (props, r
     valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,
     _props$labelKey = props.labelKey,
     labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,
+    locale = props.locale,
     _props$childrenKey = props.childrenKey,
     childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,
     _props$disabledItemVa = props.disabledItemValues,
@@ -99,11 +100,13 @@ var MultiCascadeTree = /*#__PURE__*/_react.default.forwardRef(function (props, r
     ref: ref,
     className: classes
   }, rest), searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {
+    cascade: cascade,
     data: items,
     value: value,
     searchKeyword: searchKeyword,
     valueKey: valueKey,
     labelKey: labelKey,
+    locale: locale,
     childrenKey: childrenKey,
     disabledItemValues: disabledItemValues,
     onCheck: handleCheck,

package/cjs/MultiCascadeTree/SearchView.d.ts

@@ -9,6 +9,7 @@ interface SearchViewProps<T> extends WithAsProps {
     data: ItemDataType<T>[];
     disabledItemValues: any[];
     cascade?: boolean;
+    locale?: Record<string, string>;
     onSearch: (value: string, event: React.ChangeEvent<HTMLInputElement>) => void;
     onCheck: (item: ItemDataType<T>, event: React.SyntheticEvent, checked: boolean) => void;
     inputRef?: React.RefObject<HTMLInputElement>;

package/cjs/MultiCascadeTree/SearchView.js

@@ -12,7 +12,7 @@ var _SearchBox = _interopRequireDefault(require("../internals/SearchBox"));
 var _Checkbox = _interopRequireDefault(require("../Checkbox"));
 var _Highlight = _interopRequireDefault(require("../Highlight"));
 var _utils = require("./utils");
-var _excluded = ["as", "classPrefix", "className", "searchKeyword", "childrenKey", "labelKey", "valueKey", "value", "data", "disabledItemValues", "inputRef", "cascade", "onSearch", "onCheck"];
+var _excluded = ["as", "classPrefix", "className", "searchKeyword", "childrenKey", "labelKey", "valueKey", "value", "data", "disabledItemValues", "inputRef", "cascade", "locale", "onSearch", "onCheck"];
 function SearchView(props) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,
@@ -28,6 +28,7 @@ function SearchView(props) {
     disabledItemValues = props.disabledItemValues,
     inputRef = props.inputRef,
     cascade = props.cascade,
+    overrideLocale = props.locale,
     onSearch = props.onSearch,
     onCheck = props.onCheck,
     rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
@@ -37,7 +38,7 @@ function SearchView(props) {
     withClassPrefix = _useClassNames.withClassPrefix,
     rootPrefix = _useClassNames.rootPrefix;
   var classes = merge(className, withClassPrefix());
-  var _useCustom = (0, _hooks.useCustom)('Picker'),
+  var _useCustom = (0, _hooks.useCustom)('Picker', overrideLocale),
     locale = _useCustom.locale;
   var renderSearchRow = function renderSearchRow(item, key) {
     var _extends2;

package/cjs/MultiCascadeTree/types.d.ts

@@ -6,7 +6,7 @@ export interface ItemKeys {
     labelKey: string;
     childrenKey: string;
 }
-export interface MultiCascadeTreeProps<T, V = T[]> extends WithAsProps, CascadeTreeProps<T, V> {
+export interface MultiCascadeTreeProps<T, V = T[], L = any> extends WithAsProps, CascadeTreeProps<T, V> {
     /**
      * When set to true, selecting a child node will update the state of the parent node.
      */
@@ -19,6 +19,10 @@ export interface MultiCascadeTreeProps<T, V = T[]> extends WithAsProps, CascadeT
      * Set the option value for the check box not to be rendered
      */
     uncheckableItemValues?: T[];
+    /**
+     * A collection of localized strings.
+     */
+    locale?: Partial<L>;
     /**
      * Called after the checkbox state changes.
      */

package/cjs/MultiCascader/MultiCascader.d.ts

@@ -3,7 +3,7 @@ import { PickerLocale } from '../locales';
 import { PickerComponent, PickerToggleProps } from '../internals/Picker';
 import { FormControlPickerProps, ItemDataType, DataItemValue } from '../internals/types';
 import type { MultiCascadeTreeProps } from '../MultiCascadeTree';
-export interface MultiCascaderProps<T extends DataItemValue> extends FormControlPickerProps<T[], PickerLocale, ItemDataType<T>, T>, MultiCascadeTreeProps<T, T[]>, Pick<PickerToggleProps, 'loading'> {
+export interface MultiCascaderProps<T extends DataItemValue> extends FormControlPickerProps<T[], PickerLocale, ItemDataType<T>, T>, MultiCascadeTreeProps<T, T[], PickerLocale>, Pick<PickerToggleProps, 'loading'> {
     /**
      * A picker that can be counted
      */

package/cjs/MultiCascader/MultiCascader.js

@@ -273,6 +273,8 @@ var MultiCascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       target: trigger,
       onKeyDown: onPickerKeyDown
     }, searchable && /*#__PURE__*/_react.default.createElement(_SearchView.default, {
+      locale: locale,
+      cascade: cascade,
       data: items,
       value: value,
       searchKeyword: searchKeyword,
@@ -280,6 +282,7 @@ var MultiCascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       labelKey: labelKey,
       childrenKey: childrenKey,
       disabledItemValues: disabledItemValues,
+      inputRef: searchInput,
       onCheck: handleCheck,
       onSearch: handleSearch
     }), !searchKeyword && /*#__PURE__*/_react.default.createElement(_TreeView.default, {

package/cjs/TreePicker/TreePicker.js

@@ -223,6 +223,7 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     searchable: searchable,
     searchKeyword: searchKeyword,
     searchBy: searchBy,
+    searchInputRef: searchInput,
     loadingNodeValues: loadingNodeValues,
     flattenedNodes: flattenedNodes,
     listProps: listProps,

package/cjs/internals/Windowing/List.d.ts

@@ -1,7 +1,17 @@
-import { VariableSizeList, ListItemKeySelector, ListOnScrollProps, ListOnItemsRenderedProps } from 'react-window';
-import { WithAsProps, RsRefForwardingComponent } from '../types';
+import React from 'react';
+import { VariableSizeList, ListItemKeySelector, ListOnScrollProps, ListOnItemsRenderedProps, ListProps as BaseListProps } from 'react-window';
+import { RsRefForwardingComponent } from '../types';
 export declare const defaultItemSize: () => number;
-export interface ListProps<T = any> extends WithAsProps {
+export interface ListProps<T = any> extends Omit<BaseListProps, 'width'> {
+    ref?: React.Ref<ListHandle>;
+    /**
+     * Width of the list.
+     *
+     * For horizontal lists, this must be a number. It affects the number of columns that will be rendered (and displayed) at any given time.
+     *
+     * For vertical lists, this can be a number or a string (e.g. "50%").
+     */
+    width?: number | string;
     /**
      * @deprecated use itemSize instead
      * Either a fixed row height (number) or a function that returns the height of a row given its index: ({ index: number }): number

package/cjs/internals/Windowing/index.d.ts

@@ -1,5 +1,5 @@
 export { default as AutoSizer } from './AutoSizer';
 export { default as List, defaultItemSize } from './List';
 export { FixedSizeList, VariableSizeList } from 'react-window';
-export type { ListChildComponentProps } from 'react-window';
+export type { ListChildComponentProps, FixedSizeListProps } from 'react-window';
 export type { ListProps, ListHandle } from './List';

package/cjs/internals/hooks/useCustom.js

@@ -43,25 +43,38 @@ function useCustom(keys, overrideLocale) {
   if (overrideLocale) {
     componentLocale = mergeObject([componentLocale, overrideLocale]);
   }
-  var defaultFormatDate = (0, _react.useCallback)(function (date, formatStr) {
-    var _locale$Calendar;
-    return (0, _date.format)((0, _date.isValid)(date) ? date : new Date(), formatStr, {
-      locale: locale === null || locale === void 0 ? void 0 : (_locale$Calendar = locale.Calendar) === null || _locale$Calendar === void 0 ? void 0 : _locale$Calendar.dateLocale
-    });
-  }, [(_locale$Calendar2 = locale.Calendar) === null || _locale$Calendar2 === void 0 ? void 0 : _locale$Calendar2.dateLocale]);
-  var defaultParseDate = (0, _react.useCallback)(function (dateString, formatString) {
+  var _formatDate = (0, _react.useCallback)(function (date, formatStr, options) {
+    try {
+      var _locale$Calendar;
+      if (formatDate) {
+        return formatDate(date, formatStr, options);
+      }
+      return (0, _date.format)((0, _date.isValid)(date) ? date : new Date(), formatStr, (0, _extends2.default)({
+        locale: locale === null || locale === void 0 ? void 0 : (_locale$Calendar = locale.Calendar) === null || _locale$Calendar === void 0 ? void 0 : _locale$Calendar.dateLocale
+      }, options));
+    } catch (error) {
+      if (process.env.NODE_ENV === 'development') {
+        console.error('Error: Invalid date format', error);
+      }
+      return 'Error: Invalid date format';
+    }
+  }, [formatDate, locale === null || locale === void 0 ? void 0 : (_locale$Calendar2 = locale.Calendar) === null || _locale$Calendar2 === void 0 ? void 0 : _locale$Calendar2.dateLocale]);
+  var _parseDate = (0, _react.useCallback)(function (dateString, formatString, referenceDate, options) {
     var _locale$Calendar3;
-    return (0, _date.parse)(dateString, formatString, new Date(), {
+    if (parseDate) {
+      return parseDate(dateString, formatString, referenceDate, options);
+    }
+    return (0, _date.parse)(dateString, formatString, referenceDate || new Date(), (0, _extends2.default)({
       locale: locale === null || locale === void 0 ? void 0 : (_locale$Calendar3 = locale.Calendar) === null || _locale$Calendar3 === void 0 ? void 0 : _locale$Calendar3.dateLocale
-    });
-  }, [(_locale$Calendar4 = locale.Calendar) === null || _locale$Calendar4 === void 0 ? void 0 : _locale$Calendar4.dateLocale]);
+    }, options));
+  }, [parseDate, locale === null || locale === void 0 ? void 0 : (_locale$Calendar4 = locale.Calendar) === null || _locale$Calendar4 === void 0 ? void 0 : _locale$Calendar4.dateLocale]);
   return {
     locale: componentLocale,
     rtl: rtl,
     toasters: toasters,
     disableRipple: disableRipple,
-    formatDate: formatDate || defaultFormatDate,
-    parseDate: parseDate || defaultParseDate
+    formatDate: _formatDate,
+    parseDate: _parseDate
   };
 }
 var _default = exports.default = useCustom;

package/cjs/internals/hooks/useEventCallback.js

@@ -1,17 +1,24 @@
 'use client';
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
 exports.default = void 0;
 exports.useEventCallback = useEventCallback;
 var _react = require("react");
+var _useIsomorphicLayoutEffect = _interopRequireDefault(require("./useIsomorphicLayoutEffect"));
 /**
  * https://github.com/facebook/react/issues/14099#issuecomment-440013892
  * @param {function} fn
  */
 function useEventCallback(fn) {
   var ref = (0, _react.useRef)(fn);
-  (0, _react.useEffect)(function () {
+  /**
+   * use useLayoutEffect instead of useEffect.
+   * useLayoutEffect is earlier than useEffect, sometimes we use setState and then use callback immediately,
+   * However the state in callback is not the latest, because useEffect is not triggered.
+   */
+  (0, _useIsomorphicLayoutEffect.default)(function () {
     ref.current = fn;
   });
   return (0, _react.useCallback)(function () {

package/cjs/useMediaQuery/useMediaQuery.js

@@ -41,9 +41,12 @@ var matchMedia = function matchMedia(query) {
  */
 function useMediaQueryOld(query) {
   var queries = Array.isArray(query) ? query : [query];
-  var mediaQueries = queries.map(function (query) {
-    return mediaQuerySizeMap[query] || query;
-  });
+  var mediaQueries = (0, _react.useMemo)(function () {
+    return queries.map(function (query) {
+      return mediaQuerySizeMap[query] || query;
+    });
+  }, // eslint-disable-next-line react-hooks/exhaustive-deps
+  [].concat(queries));
   var _useState = (0, _react.useState)(function () {
       return mediaQueries.map(function (query) {
         return (0, _pick.default)(matchMedia(query), ['matches', 'media']);
@@ -87,9 +90,12 @@ function useMediaQueryOld(query) {
 function useMediaQuery(query) {
   var _React$useSyncExterna;
   var queries = Array.isArray(query) ? query : [query];
-  var mediaQueries = queries.map(function (query) {
-    return mediaQuerySizeMap[query] || query;
-  });
+  var mediaQueries = (0, _react.useMemo)(function () {
+    return queries.map(function (query) {
+      return mediaQuerySizeMap[query] || query;
+    });
+  }, // eslint-disable-next-line react-hooks/exhaustive-deps
+  [].concat(queries));
   var mediaQueryArray = (0, _react.useRef)(mediaQueries.map(function (query) {
     return matchMedia(query).matches;
   }));

package/dist/rsuite-no-reset-rtl.css

@@ -3317,7 +3317,7 @@ tbody.rs-anim-collapse.rs-anim-in {
 .rs-calendar-month-view .rs-calendar-month-dropdown {
   display: block;
 }
-.rs-calendar-month-view .rs-calendar-month-dropdown-content {
+.rs-calendar-month-view .rs-calendar-month-dropdown-scroll {
   -webkit-animation: 0.3s linear slideDown;
           animation: 0.3s linear slideDown;
 }
@@ -14106,7 +14106,7 @@ textarea.rs-inline-edit-sm .rs-plaintext {
   border-left: 1px solid #f2f2f5;
   border-left: 1px solid var(--rs-table-border-color);
 }
-.rs-table-row:not(.rs-table-row-rowspan) {
+.rs-table:not(.rs-table-has-rowspan) .rs-table-row {
   border-bottom: 1px solid #f2f2f5;
   border-bottom: 1px solid var(--rs-table-border-color);
 }