rsuite 5.6.0 → 5.6.1

package/esm/DatePicker/DatePicker.d.ts

@@ -1,9 +1,10 @@
 import React from 'react';
 import { RangeType } from './Toolbar';
 import { DatePickerLocale } from '../locales';
+import { PickerToggleProps } from '../Picker';
 import { FormControlBaseProps, PickerBaseProps, RsRefForwardingComponent } from '../@types/common';
 export type { RangeType } from './Toolbar';
-export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, FormControlBaseProps<Date | null> {
+export interface DatePickerProps extends PickerBaseProps<DatePickerLocale>, FormControlBaseProps<Date | null>, Pick<PickerToggleProps, 'caretAs' | 'readOnly' | 'plaintext'> {
     /** Configure shortcut options */
     ranges?: RangeType<Date>[];
     /** Calendar panel default presentation date and time */

package/esm/DatePicker/DatePicker.js

@@ -44,6 +44,7 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       showWeekNumbers = props.showWeekNumbers,
       style = props.style,
       toggleAs = props.toggleAs,
+      caretAsProp = props.caretAs,
       disabledDateProp = props.disabledDate,
       renderValue = props.renderValue,
       onChange = props.onChange,
@@ -59,7 +60,7 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       onSelect = props.onSelect,
       onToggleMonthDropdown = props.onToggleMonthDropdown,
       onToggleTimeDropdown = props.onToggleTimeDropdown,
-      rest = _objectWithoutPropertiesLoose(props, ["as", "className", "classPrefix", "calendarDefaultDate", "cleanable", "defaultValue", "disabled", "format", "isoWeek", "limitEndYear", "locale", "menuClassName", "appearance", "placement", "oneTap", "placeholder", "ranges", "value", "showMeridian", "showWeekNumbers", "style", "toggleAs", "disabledDate", "renderValue", "onChange", "onChangeCalendarDate", "onClean", "onClose", "onEntered", "onExited", "onNextMonth", "onOk", "onOpen", "onPrevMonth", "onSelect", "onToggleMonthDropdown", "onToggleTimeDropdown"]);
+      rest = _objectWithoutPropertiesLoose(props, ["as", "className", "classPrefix", "calendarDefaultDate", "cleanable", "defaultValue", "disabled", "format", "isoWeek", "limitEndYear", "locale", "menuClassName", "appearance", "placement", "oneTap", "placeholder", "ranges", "value", "showMeridian", "showWeekNumbers", "style", "toggleAs", "caretAs", "disabledDate", "renderValue", "onChange", "onChangeCalendarDate", "onClean", "onClose", "onEntered", "onExited", "onNextMonth", "onOk", "onOpen", "onPrevMonth", "onSelect", "onToggleMonthDropdown", "onToggleTimeDropdown"]);
 
   var _useCustom = useCustom('DatePicker', overrideLocale),
       locale = _useCustom.locale,
@@ -415,8 +416,8 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     return (_renderValue = renderValue === null || renderValue === void 0 ? void 0 : renderValue(value, formatStr)) !== null && _renderValue !== void 0 ? _renderValue : formatDate(value, formatStr);
   }, [formatStr, formatDate, placeholder, renderValue, value]);
   var caretAs = useMemo(function () {
-    return DateUtils.shouldOnlyTime(formatStr) ? IconClockO : IconCalendar;
-  }, [formatStr]);
+    return caretAsProp || (DateUtils.shouldOnlyTime(formatStr) ? IconClockO : IconCalendar);
+  }, [caretAsProp, formatStr]);
   return /*#__PURE__*/React.createElement(PickerToggleTrigger, {
     trigger: "active",
     pickerProps: pick(props, pickTriggerPropKeys),

package/esm/DateRangePicker/DateRangePicker.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 import { FormControlBaseProps, PickerBaseProps } from '../@types/common';
-import { PickerComponent } from '../Picker';
+import { PickerComponent, PickerToggleProps } from '../Picker';
 import { DisabledDateFunction, RangeType, DateRange } from './types';
-export interface DateRangePickerProps extends PickerBaseProps, FormControlBaseProps<DateRange | null> {
+export interface DateRangePickerProps extends PickerBaseProps, FormControlBaseProps<DateRange | null>, Pick<PickerToggleProps, 'caretAs' | 'readOnly' | 'plaintext'> {
     /** Configure shortcut options */
     ranges?: RangeType[];
     /** Format date */

package/esm/DateRangePicker/DateRangePicker.js

@@ -56,6 +56,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       showMeridian = props.showMeridian,
       style = props.style,
       toggleAs = props.toggleAs,
+      caretAs = props.caretAs,
       valueProp = props.value,
       onChange = props.onChange,
       onClean = props.onClean,
@@ -66,7 +67,7 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       onOk = props.onOk,
       onOpen = props.onOpen,
       onSelect = props.onSelect,
-      rest = _objectWithoutPropertiesLoose(props, ["as", "classPrefix", "className", "appearance", "cleanable", "character", "defaultCalendarValue", "defaultValue", "disabled", "disabledDate", "format", "hoverRange", "isoWeek", "limitEndYear", "locale", "menuClassName", "menuStyle", "oneTap", "placeholder", "placement", "ranges", "renderValue", "showOneCalendar", "showWeekNumbers", "showMeridian", "style", "toggleAs", "value", "onChange", "onClean", "onClose", "onEnter", "onEntered", "onExited", "onOk", "onOpen", "onSelect"]);
+      rest = _objectWithoutPropertiesLoose(props, ["as", "classPrefix", "className", "appearance", "cleanable", "character", "defaultCalendarValue", "defaultValue", "disabled", "disabledDate", "format", "hoverRange", "isoWeek", "limitEndYear", "locale", "menuClassName", "menuStyle", "oneTap", "placeholder", "placement", "ranges", "renderValue", "showOneCalendar", "showWeekNumbers", "showMeridian", "style", "toggleAs", "caretAs", "value", "onChange", "onClean", "onClose", "onEnter", "onEntered", "onExited", "onOk", "onOpen", "onSelect"]);
 
   var _useClassNames = useClassNames(classPrefix),
       merge = _useClassNames.merge,
@@ -606,8 +607,8 @@ var DateRangePicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     hasValue: hasValue,
     active: isPickerToggleActive,
     placement: placement,
-    caretAs: IconCalendar,
-    disabled: disabled
+    disabled: disabled,
+    caretAs: caretAs || IconCalendar
   }), getDisplayString(value))));
 });
 DateRangePicker.after = disabledDateUtils.after;

package/esm/IconButton/IconButton.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
-import { ButtonProps } from '../Button';
 import { IconProps } from '@rsuite/icons/lib/Icon';
+import { RsRefForwardingComponent } from '../@types/common';
+import Button, { ButtonProps } from '../Button';
 export interface IconButtonProps extends ButtonProps {
     /** Set the icon */
     icon?: React.ReactElement<IconProps>;
@@ -9,5 +10,7 @@ export interface IconButtonProps extends ButtonProps {
     /** The placement of icon */
     placement?: 'left' | 'right';
 }
-declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<unknown>>;
+declare const IconButton: RsRefForwardingComponent<typeof Button, IconButtonProps & {
+    ref?: React.Ref<HTMLElement>;
+}>;
 export default IconButton;

package/esm/IconButton/IconButton.js

@@ -2,8 +2,8 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import React from 'react';
 import PropTypes from 'prop-types';
-import Button from '../Button';
 import { useClassNames } from '../utils';
+import Button from '../Button';
 var IconButton = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var icon = props.icon,
       _props$placement = props.placement,

package/esm/IconButton/test/IconButton.test.d.ts

@@ -0,0 +1 @@
+export {};

package/esm/IconButton/test/IconButton.test.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import IconButton from '../IconButton';
+
+var Link = function Link(_ref) {
+  var to = _ref.to;
+  return /*#__PURE__*/React.createElement("a", {
+    href: to
+  });
+};
+
+var ref = /*#__PURE__*/React.createRef(); // Infer `as` component props
+
+/*#__PURE__*/
+React.createElement(IconButton, {
+  ref: ref,
+  as: Link,
+  to: "/home"
+});

package/esm/Picker/index.d.ts

@@ -1,4 +1,5 @@
 import { pickTriggerPropKeys, omitTriggerPropKeys, OverlayTriggerInstance, PositionChildProps } from './PickerToggleTrigger';
+import { PickerToggleProps } from './PickerToggle';
 import { PickerInstance, PickerComponent } from './types';
 export { default as DropdownMenu } from './DropdownMenu';
 export { default as DropdownMenuCheckItem } from './DropdownMenuCheckItem';
@@ -10,6 +11,6 @@ export { default as PickerToggleTrigger } from './PickerToggleTrigger';
 export { default as SearchBar } from './SearchBar';
 export { default as SelectedElement } from './SelectedElement';
 export { pickTriggerPropKeys, omitTriggerPropKeys };
-export type { OverlayTriggerInstance, PositionChildProps, PickerInstance, PickerComponent };
+export type { OverlayTriggerInstance, PositionChildProps, PickerInstance, PickerComponent, PickerToggleProps };
 export * from './utils';
 export * from './propTypes';

package/esm/toaster/toaster.d.ts

@@ -8,7 +8,7 @@ export interface Toaster {
      * @param message
      * @param options
      */
-    push(message: React.ReactNode, options?: ToastContainerProps): string;
+    push(message: React.ReactNode, options?: ToastContainerProps): string | undefined;
     /**
      * Remove a message by key
      * @param key

package/esm/toaster/toaster.js

@@ -33,6 +33,8 @@ var toaster = function toaster(message) {
 };
 
 toaster.push = function (message, options) {
+  var _container$current;
+
   if (options === void 0) {
     options = {};
   }
@@ -45,18 +47,22 @@ toaster.push = function (message, options) {
     container = createContainer((_options$placement = options.placement) !== null && _options$placement !== void 0 ? _options$placement : '', options);
   }
 
-  return container.current.push(message);
+  return (_container$current = container.current) === null || _container$current === void 0 ? void 0 : _container$current.push(message);
 };
 
 toaster.remove = function (key) {
   containers.forEach(function (c) {
-    return c.current.remove(key);
+    var _c$current;
+
+    return (_c$current = c.current) === null || _c$current === void 0 ? void 0 : _c$current.remove(key);
   });
 };
 
 toaster.clear = function () {
   containers.forEach(function (c) {
-    return c.current.clear();
+    var _c$current2;
+
+    return (_c$current2 = c.current) === null || _c$current2 === void 0 ? void 0 : _c$current2.clear();
   });
 };
 

package/esm/utils/useTimeout.d.ts

@@ -6,7 +6,7 @@ export interface UseTimeoutFnReturn {
  * A timer hook
  * @param fn Timer callback function
  * @param ms Milliseconds of the timer
- * @param open Whether to open the timer
+ * @param enabled Whether to open the timer
  */
-declare function useTimeout(fn: (() => void) | undefined, ms?: number, open?: boolean): UseTimeoutFnReturn;
+declare function useTimeout(fn: (() => void) | undefined, ms?: number, enabled?: boolean): UseTimeoutFnReturn;
 export default useTimeout;

package/esm/utils/useTimeout.js

@@ -4,32 +4,41 @@ import { useEffect, useRef, useCallback } from 'react';
  * A timer hook
  * @param fn Timer callback function
  * @param ms Milliseconds of the timer
- * @param open Whether to open the timer
+ * @param enabled Whether to open the timer
  */
-function useTimeout(fn, ms, open) {
+function useTimeout(fn, ms, enabled) {
   if (ms === void 0) {
     ms = 0;
   }
 
-  if (open === void 0) {
-    open = true;
+  if (enabled === void 0) {
+    enabled = true;
   }
 
   var timeout = useRef();
+  var callback = useRef(fn);
   var clear = useCallback(function () {
     timeout.current && clearTimeout(timeout.current);
   }, []);
   var set = useCallback(function () {
-    if (open) {
+    timeout.current && clearTimeout(timeout.current);
+
+    if (enabled) {
       timeout.current = setTimeout(function () {
-        return fn === null || fn === void 0 ? void 0 : fn();
+        var _callback$current;
+
+        (_callback$current = callback.current) === null || _callback$current === void 0 ? void 0 : _callback$current.call(callback);
       }, ms);
     }
-  }, [ms, fn, open]);
+  }, [ms, enabled]); // update ref when function changes
+
+  useEffect(function () {
+    callback.current = fn;
+  }, [fn]);
   useEffect(function () {
     set();
     return clear;
-  }, [fn, ms, open, clear, set]);
+  }, [ms, enabled, set, clear]);
   return {
     clear: clear,
     reset: set

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rsuite",
-  "version": "5.6.0",
+  "version": "5.6.1",
   "description": "A suite of react components",
   "main": "cjs/index.js",
   "module": "esm/index.js",