rsuite 5.4.4 → 5.5.0

package/esm/Dropdown/Dropdown.d.ts

@@ -3,6 +3,7 @@ import DropdownMenu from './DropdownMenu';
 import { TypeAttributes, WithAsProps, RsRefForwardingComponent } from '../@types/common';
 import { IconProps } from '@rsuite/icons/lib/Icon';
 import DropdownItem from './DropdownItem';
+import Button from '../Button';
 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 */
@@ -48,6 +49,10 @@ export interface DropdownProps<T = any> extends WithAsProps, Omit<React.HTMLAttr
     onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
 }
 export interface DropdownComponent extends RsRefForwardingComponent<'div', DropdownProps> {
+    <ToggleAs extends React.ElementType = typeof Button>(props: DropdownProps & {
+        ref?: React.Ref<any>;
+        toggleAs?: ToggleAs;
+    } & React.ComponentProps<ToggleAs>, context: any): JSX.Element | null;
     Item: typeof DropdownItem;
     Menu: typeof DropdownMenu;
 }

package/esm/Dropdown/test/Dropdown.test.d.ts

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

package/esm/Dropdown/test/Dropdown.test.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import Dropdown from '../Dropdown';
+var ref = /*#__PURE__*/React.createRef(); // Infer `toggleAs` props (defaults to Button)
+
+/*#__PURE__*/
+React.createElement(Dropdown, {
+  ref: ref,
+  appearance: "subtle",
+  size: "sm"
+});
+/* eslint-disable @typescript-eslint/no-unused-vars */
+
+var CustomToggle = function CustomToggle(_props) {
+  return null;
+};
+
+/*#__PURE__*/
+React.createElement(Dropdown, {
+  ref: ref,
+  toggleAs: CustomToggle,
+  myProp: "myValue"
+});

package/esm/InputNumber/InputNumber.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { WithAsProps, TypeAttributes, FormControlBaseProps } from '../@types/common';
-export interface InputNumberProps<T = number | string> extends WithAsProps, FormControlBaseProps<T> {
+export interface InputNumberProps<T = number | string> extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange' | 'size' | 'prefix'>, WithAsProps, FormControlBaseProps<T> {
     /** Button can have different appearances */
     buttonAppearance?: TypeAttributes.Appearance;
     /** An input can show that it is disabled */

package/esm/InputNumber/InputNumber.js

@@ -10,7 +10,7 @@ import InputGroup from '../InputGroup/InputGroup';
 import InputGroupAddon from '../InputGroup/InputGroupAddon';
 import Input from '../Input';
 import Button from '../Button';
-import { partitionHTMLProps, createChainedFunction, useClassNames, useControlled } from '../utils';
+import { partitionHTMLProps, createChainedFunction, useClassNames, useControlled, KEY_VALUES } from '../utils';
 
 /**
  * Check if the value is a number.
@@ -93,16 +93,17 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
       step = _props$step === void 0 ? 1 : _props$step,
       _props$buttonAppearan = props.buttonAppearance,
       buttonAppearance = _props$buttonAppearan === void 0 ? 'subtle' : _props$buttonAppearan,
-      _props$min = props.min,
-      min = _props$min === void 0 ? -Infinity : _props$min,
-      _props$max = props.max,
-      max = _props$max === void 0 ? Infinity : _props$max,
+      minProp = props.min,
+      maxProp = props.max,
       _props$scrollable = props.scrollable,
       scrollable = _props$scrollable === void 0 ? true : _props$scrollable,
       onChange = props.onChange,
       onWheel = props.onWheel,
       restProps = _objectWithoutPropertiesLoose(props, ["as", "className", "classPrefix", "disabled", "readOnly", "plaintext", "value", "defaultValue", "size", "prefix", "postfix", "step", "buttonAppearance", "min", "max", "scrollable", "onChange", "onWheel"]);
 
+  var min = minProp !== null && minProp !== void 0 ? minProp : -Infinity;
+  var max = maxProp !== null && maxProp !== void 0 ? maxProp : Infinity;
+
   var _useControlled = useControlled(valueProp, defaultValue),
       value = _useControlled[0],
       setValue = _useControlled[1];
@@ -166,6 +167,35 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var bit = decimals(val, step);
     handleChangeValue(getSafeValue((val - step).toFixed(bit)), event);
   }, [getSafeValue, handleChangeValue, step, value]);
+  var handleKeyDown = useCallback(function (event) {
+    switch (event.key) {
+      case KEY_VALUES.UP:
+        event.preventDefault();
+        handlePlus(event);
+        break;
+
+      case KEY_VALUES.DOWN:
+        event.preventDefault();
+        handleMinus(event);
+        break;
+
+      case KEY_VALUES.HOME:
+        if (typeof minProp !== 'undefined') {
+          event.preventDefault();
+          handleChangeValue(getSafeValue(minProp), event);
+        }
+
+        break;
+
+      case KEY_VALUES.END:
+        if (typeof maxProp !== 'undefined') {
+          event.preventDefault();
+          handleChangeValue(getSafeValue(maxProp), event);
+        }
+
+        break;
+    }
+  }, [handlePlus, handleMinus, minProp, maxProp, handleChangeValue, getSafeValue]);
   var handleWheel = useCallback(function (event) {
     if (!disabled && !readOnly && event.target === document.activeElement) {
       event.preventDefault();
@@ -211,7 +241,7 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
     };
   }, [handleWheel, scrollable]);
   var input = /*#__PURE__*/React.createElement(Input, _extends({}, htmlInputProps, {
-    type: "text",
+    type: "number",
     autoComplete: "off",
     step: step,
     inputRef: inputRef,
@@ -221,7 +251,8 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
     disabled: disabled,
     readOnly: readOnly,
     plaintext: plaintext,
-    ref: plaintext ? ref : undefined
+    ref: plaintext ? ref : undefined,
+    onKeyDown: handleKeyDown
   }));
 
   if (plaintext) {

package/esm/InputNumber/test/InputNumber.test.d.ts

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

package/esm/InputNumber/test/InputNumber.test.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import InputNumber from '../InputNumber'; // Inherits <input type="number" /> attributes
+
+/*#__PURE__*/
+React.createElement(InputNumber, {
+  placeholder: "Enter number"
+});

package/esm/MultiCascader/MultiCascader.js

@@ -459,6 +459,7 @@ var MultiCascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _usePickerClassName = usePickerClassName(_extends({}, props, {
     classPrefix: classPrefix,
     hasValue: hasValue,
+    countable: countable,
     name: 'cascader',
     appearance: appearance,
     cleanable: cleanable

package/esm/RangeSlider/RangeSlider.d.ts

@@ -1,6 +1,16 @@
 import React from 'react';
 import { SliderProps } from '../Slider';
 export declare type Range = [number, number];
-export declare type RangeSliderProps = SliderProps<Range>;
-declare const RangeSlider: React.ForwardRefExoticComponent<RangeSliderProps & React.RefAttributes<unknown>>;
+export declare type RangeSliderProps = SliderProps<Range> & {
+    /**
+     * Add constraint to validate before onChange is dispatched
+     */
+    constraint?: (range: Range) => boolean;
+};
+declare const RangeSlider: React.ForwardRefExoticComponent<SliderProps<Range> & {
+    /**
+     * Add constraint to validate before onChange is dispatched
+     */
+    constraint?: ((range: Range) => boolean) | undefined;
+} & React.RefAttributes<unknown>>;
 export default RangeSlider;

package/esm/RangeSlider/RangeSlider.js

@@ -21,6 +21,7 @@ var RangeSlider = /*#__PURE__*/React.forwardRef(function (props, ref) {
       Component = _props$as === void 0 ? 'div' : _props$as,
       barClassName = props.barClassName,
       className = props.className,
+      constraint = props.constraint,
       _props$defaultValue = props.defaultValue,
       defaultValue = _props$defaultValue === void 0 ? defaultDefaultValue : _props$defaultValue,
       graduated = props.graduated,
@@ -47,7 +48,7 @@ var RangeSlider = /*#__PURE__*/React.forwardRef(function (props, ref) {
       renderMark = props.renderMark,
       onChange = props.onChange,
       onChangeCommitted = props.onChangeCommitted,
-      rest = _objectWithoutPropertiesLoose(props, ["aria-label", "aria-labelledby", "aria-valuetext", "as", "barClassName", "className", "defaultValue", "graduated", "progress", "vertical", "disabled", "classPrefix", "min", "max", "step", "value", "handleClassName", "handleStyle", "handleTitle", "tooltip", "getAriaValueText", "renderTooltip", "renderMark", "onChange", "onChangeCommitted"]);
+      rest = _objectWithoutPropertiesLoose(props, ["aria-label", "aria-labelledby", "aria-valuetext", "as", "barClassName", "className", "constraint", "defaultValue", "graduated", "progress", "vertical", "disabled", "classPrefix", "min", "max", "step", "value", "handleClassName", "handleStyle", "handleTitle", "tooltip", "getAriaValueText", "renderTooltip", "renderMark", "onChange", "onChangeCommitted"]);
 
   var barRef = useRef(null); // Define the parameter position of the handle
 
@@ -157,14 +158,27 @@ var RangeSlider = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
     return nextValue;
   }, [getRangeValue, getValidValue]);
+  /**
+   * Whether a range is valid against given constraint (if any)
+   * Should check before every `setValue` calls
+   */
+
+  var isRangeMatchingConstraint = useCallback(function (range) {
+    // If no constraint is defined, any range is valid
+    if (!constraint) return true;
+    return constraint(range);
+  }, [constraint]);
   /**
    * Callback function that is fired when the mousemove is triggered
    */
 
   var handleDragMove = useEventCallback(function (event, dataset) {
     var nextValue = getNextValue(event, dataset);
-    setValue(nextValue);
-    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
+
+    if (isRangeMatchingConstraint(nextValue)) {
+      setValue(nextValue);
+      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
+    }
   });
   /**
    * Callback function that is fired when the mouseup is triggered
@@ -172,9 +186,12 @@ var RangeSlider = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
   var handleChangeCommitted = useCallback(function (event, dataset) {
     var nextValue = getNextValue(event, dataset);
-    setValue(nextValue);
-    onChangeCommitted === null || onChangeCommitted === void 0 ? void 0 : onChangeCommitted(nextValue, event);
-  }, [getNextValue, onChangeCommitted, setValue]);
+
+    if (isRangeMatchingConstraint(nextValue)) {
+      setValue(nextValue);
+      onChangeCommitted === null || onChangeCommitted === void 0 ? void 0 : onChangeCommitted(nextValue, event);
+    }
+  }, [getNextValue, onChangeCommitted, isRangeMatchingConstraint, setValue]);
   var handleKeyDown = useCallback(function (event) {
     var _event$target;
 
@@ -217,9 +234,12 @@ var RangeSlider = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
 
     event.preventDefault();
-    setValue(nextValue);
-    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
-  }, [max, min, onChange, rtl, setValue, step, value]);
+
+    if (isRangeMatchingConstraint(nextValue)) {
+      setValue(nextValue);
+      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
+    }
+  }, [max, min, onChange, rtl, isRangeMatchingConstraint, setValue, step, value]);
   var handleClick = useCallback(function (event) {
     if (disabled) {
       return;
@@ -236,9 +256,12 @@ var RangeSlider = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }
 
     var nextValue = getValidValue([start, end].sort());
-    setValue(nextValue);
-    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
-  }, [disabled, getValidValue, getValueByPosition, onChange, setValue, value]);
+
+    if (isRangeMatchingConstraint(nextValue)) {
+      setValue(nextValue);
+      onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
+    }
+  }, [disabled, getValidValue, getValueByPosition, isRangeMatchingConstraint, onChange, setValue, value]);
   var handleProps = useMemo(function () {
     return [{
       value: value[0],

package/esm/utils/treeUtils.js

@@ -258,6 +258,9 @@ export function createUpdateTreeDataFunction(params, _ref2) {
     var dragNode = params.dragNode,
         dropNode = params.dropNode,
         dropNodePosition = params.dropNodePosition;
+
+    var cloneDragNode = _extends({}, dragNode);
+
     removeDragNode(data, params, {
       valueKey: valueKey,
       childrenKey: childrenKey
@@ -272,16 +275,16 @@ export function createUpdateTreeDataFunction(params, _ref2) {
           if (dropNodePosition === TREE_NODE_DROP_POSITION.DRAG_OVER) {
             _item2[childrenKey] = _isNil(_item2[childrenKey]) ? [] : _item2[childrenKey];
 
-            _item2[childrenKey].push(dragNode);
+            _item2[childrenKey].push(cloneDragNode);
 
             break;
           } else if (dropNodePosition === TREE_NODE_DROP_POSITION.DRAG_OVER_TOP) {
             // drag to top of node
-            items.splice(_index2, 0, dragNode);
+            items.splice(_index2, 0, cloneDragNode);
             break;
           } else if (dropNodePosition === TREE_NODE_DROP_POSITION.DRAG_OVER_BOTTOM) {
             // drag to bottom of node
-            items.splice(_index2 + 1, 0, dragNode);
+            items.splice(_index2 + 1, 0, cloneDragNode);
             break;
           }
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rsuite",
-  "version": "5.4.4",
+  "version": "5.5.0",
   "description": "A suite of react components",
   "main": "cjs/index.js",
   "module": "esm/index.js",
@@ -37,7 +37,7 @@
     "lodash": "^4.17.11",
     "prop-types": "^15.7.2",
     "react-virtualized": "^9.22.3",
-    "rsuite-table": "^5.3.1",
+    "rsuite-table": "^5.3.2",
     "schema-typed": "^2.0.2"
   },
   "peerDependencies": {