rsuite 5.2.4 → 5.4.2

package/cjs/RadioGroup/RadioGroup.d.ts

@@ -4,12 +4,12 @@ import { ValueType } from '../Radio';
 export interface RadioContextProps {
     inline?: boolean;
     name?: string;
-    value?: ValueType;
+    value?: ValueType | null;
     controlled?: boolean;
     disabled?: boolean;
     readOnly?: boolean;
     plaintext?: boolean;
-    onChange?: (value: ValueType, event: React.ChangeEvent<HTMLInputElement>) => void;
+    onChange?: (value: ValueType | undefined, event: React.ChangeEvent<HTMLInputElement>) => void;
 }
 export interface RadioGroupProps<T = ValueType> extends WithAsProps, FormControlBaseProps<T> {
     /** A radio group can have different appearances */

package/cjs/RadioGroup/RadioGroup.js

@@ -57,7 +57,7 @@ var RadioGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 
   var handleChange = (0, _react.useCallback)(function (nextValue, event) {
     setValue(nextValue);
-    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
+    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue !== null && nextValue !== void 0 ? nextValue : '', event);
   }, [onChange, setValue]);
   var contextValue = (0, _react.useMemo)(function () {
     return {

package/cjs/RangeSlider/RangeSlider.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { SliderProps } from '../Slider';
-export declare type ValueType = number[];
-export declare type RangeSliderProps = SliderProps<ValueType>;
+export declare type Range = [number, number];
+export declare type RangeSliderProps = SliderProps<Range>;
 declare const RangeSlider: React.ForwardRefExoticComponent<RangeSliderProps & React.RefAttributes<unknown>>;
 export default RangeSlider;

package/cjs/RangeSlider/RangeSlider.js

@@ -33,6 +33,8 @@ var _Graduated = _interopRequireDefault(require("../Slider/Graduated"));
 
 var _utils2 = require("../Slider/utils");
 
+var _propTypeChecker = require("../utils/propTypeChecker");
+
 var defaultDefaultValue = [0, 0];
 
 var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
@@ -70,7 +72,7 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       onChange = props.onChange,
       onChangeCommitted = props.onChangeCommitted,
       rest = (0, _objectWithoutPropertiesLoose2.default)(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"]);
-  var barRef = (0, _react.useRef)(); // Define the parameter position of the handle
+  var barRef = (0, _react.useRef)(null); // Define the parameter position of the handle
 
   var handleIndexs = (0, _react.useRef)([0, 1]);
 
@@ -286,7 +288,7 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     onDragMove: handleDragMove,
     onDragEnd: handleChangeCommitted,
     onKeyDown: handleKeyDown,
-    tabIndex: disabled ? null : 0,
+    tabIndex: disabled ? undefined : 0,
     'aria-orientation': vertical ? 'vertical' : 'horizontal',
     'aria-disabled': disabled,
     'aria-valuemax': max,
@@ -322,8 +324,8 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 
 RangeSlider.displayName = 'RangeSlider';
 RangeSlider.propTypes = (0, _extends2.default)({}, _Slider.sliderPropTypes, {
-  value: _propTypes.default.arrayOf(_propTypes.default.number),
-  defaultValue: _propTypes.default.arrayOf(_propTypes.default.number)
+  value: (0, _propTypeChecker.tupleType)(_propTypes.default.number.isRequired, _propTypes.default.number.isRequired),
+  defaultValue: (0, _propTypeChecker.tupleType)(_propTypes.default.number.isRequired, _propTypes.default.number.isRequired)
 });
 var _default = RangeSlider;
 exports.default = _default;

package/cjs/Rate/Character.js

@@ -11,6 +11,8 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
+var _isNil2 = _interopRequireDefault(require("lodash/isNil"));
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -47,8 +49,8 @@ var Character = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       prefix = _useClassNames.prefix,
       withClassPrefix = _useClassNames.withClassPrefix;
 
-  var beforeRef = (0, _react.useRef)();
-  var classes = merge(className, withClassPrefix(characterStatus[status]));
+  var beforeRef = (0, _react.useRef)(null);
+  var classes = merge(className, withClassPrefix(!(0, _isNil2.default)(status) && characterStatus[status]));
   var handleMouseMove = (0, _react.useCallback)(function (event) {
     onMouseMove === null || onMouseMove === void 0 ? void 0 : onMouseMove(getKey(beforeRef.current, event.target), event);
   }, [onMouseMove]);

package/cjs/Rate/Rate.js

@@ -43,7 +43,8 @@ var Rate = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       _props$size = props.size,
       size = _props$size === void 0 ? 'md' : _props$size,
       color = props.color,
-      allowHalf = props.allowHalf,
+      _props$allowHalf = props.allowHalf,
+      allowHalf = _props$allowHalf === void 0 ? false : _props$allowHalf,
       valueProp = props.value,
       _props$defaultValue = props.defaultValue,
       defaultValue = _props$defaultValue === void 0 ? 0 : _props$defaultValue,

package/cjs/Ripple/Ripple.js

@@ -53,7 +53,7 @@ var Ripple = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       withClassPrefix = _useClassNames.withClassPrefix;
 
   var classes = merge(className, prefix('pond'));
-  var triggerRef = (0, _react.useRef)();
+  var triggerRef = (0, _react.useRef)(null);
 
   var _useState = (0, _react.useState)(false),
       rippling = _useState[0],

package/cjs/SelectPicker/SelectPicker.d.ts

@@ -1,10 +1,8 @@
 import React from 'react';
 import { PickerLocale } from '../locales';
-import { PickerComponent } from '../Picker';
 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> {
+export interface SelectProps<T> {
     /** Set group condition key in data */
     groupBy?: string;
     /** Whether dispaly search input box */
@@ -37,7 +35,16 @@ export interface SelectProps<T = ValueType> {
     /** Called when clean */
     onClean?: (event: React.SyntheticEvent) => void;
 }
-export interface SelectPickerProps<T = ValueType> extends FormControlPickerProps<T, PickerLocale, ItemDataType>, SelectProps<T> {
+export interface MultipleSelectProps<T> extends Omit<SelectProps<T>, 'renderValue'> {
+    /** Custom render selected items */
+    renderValue?: (value: T[], item: ItemDataType<T>[], selectedElement: React.ReactNode) => React.ReactNode;
+}
+export interface SelectPickerProps<T> extends FormControlPickerProps<T, PickerLocale, ItemDataType<T>>, SelectProps<T> {
+}
+export interface SelectPickerComponent {
+    <T>(props: SelectPickerProps<T>): JSX.Element | null;
+    displayName?: string;
+    propTypes?: React.WeakValidationMap<SelectPickerProps<any>>;
 }
-declare const SelectPicker: PickerComponent<SelectPickerProps>;
+declare const SelectPicker: SelectPickerComponent;
 export default SelectPicker;

package/cjs/SelectPicker/SelectPicker.js

@@ -90,17 +90,17 @@ var SelectPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       renderMenuItem = props.renderMenuItem,
       renderExtraFooter = props.renderExtraFooter,
       rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "appearance", "data", "valueKey", "labelKey", "value", "classPrefix", "placeholder", "defaultValue", "disabled", "cleanable", "placement", "menuClassName", "menuAutoWidth", "menuMaxHeight", "menuStyle", "groupBy", "locale", "toggleAs", "style", "searchable", "disabledItemValues", "virtualized", "listProps", "id", "onGroupTitleClick", "searchBy", "onEntered", "onExited", "onClean", "onChange", "onSelect", "onSearch", "onClose", "onOpen", "sort", "renderValue", "renderMenu", "renderMenuGroup", "renderMenuItem", "renderExtraFooter"]);
-  var triggerRef = (0, _react.useRef)();
-  var targetRef = (0, _react.useRef)();
-  var overlayRef = (0, _react.useRef)();
-  var searchInputRef = (0, _react.useRef)();
+  var triggerRef = (0, _react.useRef)(null);
+  var targetRef = (0, _react.useRef)(null);
+  var overlayRef = (0, _react.useRef)(null);
+  var searchInputRef = (0, _react.useRef)(null);
 
   var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),
       locale = _useCustom.locale;
 
-  var _useControlled = (0, _utils.useControlled)(valueProp, defaultValue),
-      value = _useControlled[0],
-      setValue = _useControlled[1]; // Used to hover the focus item  when trigger `onKeydown`
+  var _ref = (0, _utils.useControlled)(valueProp, defaultValue),
+      value = _ref[0],
+      setValue = _ref[1]; // Used to hover the focus item  when trigger `onKeydown`
 
 
   var _useFocusItemValue = (0, _Picker.useFocusItemValue)(value, {
@@ -327,7 +327,7 @@ var SelectPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     disabled: disabled,
     cleanable: cleanable && !disabled,
     hasValue: hasValue,
-    inputValue: value,
+    inputValue: value !== null && value !== void 0 ? value : '',
     active: active,
     placement: placement
   }), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder))));

package/cjs/SelectPicker/index.d.ts

@@ -1,3 +1,3 @@
 import SelectPicker from './SelectPicker';
-export type { SelectProps, SelectPickerProps } from './SelectPicker';
+export type { SelectProps, MultipleSelectProps, SelectPickerProps } from './SelectPicker';
 export default SelectPicker;

package/cjs/SelectPicker/test/SelectPicker.test.d.ts

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

package/cjs/SelectPicker/test/SelectPicker.test.js

@@ -0,0 +1,62 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _tsExpect = require("ts-expect");
+
+var _SelectPicker = _interopRequireDefault(require("../SelectPicker"));
+
+// Infer value and onChange types from data
+var numberValuedData = [{
+  label: 'One',
+  value: 1
+}];
+
+/*#__PURE__*/
+_react.default.createElement(_SelectPicker.default, {
+  data: numberValuedData,
+  value: 1
+}); // @ts-expect-error should not accept string value
+
+
+/*#__PURE__*/
+_react.default.createElement(_SelectPicker.default, {
+  data: numberValuedData,
+  value: "1"
+});
+
+/*#__PURE__*/
+_react.default.createElement(_SelectPicker.default, {
+  data: numberValuedData,
+  onChange: function onChange(newValue) {
+    (0, _tsExpect.expectType)(newValue);
+  }
+});
+
+var stringValuedData = [{
+  label: 'One',
+  value: 'One'
+}];
+
+/*#__PURE__*/
+_react.default.createElement(_SelectPicker.default, {
+  data: stringValuedData,
+  value: "1"
+}); // @ts-expect-error should not accept number value
+
+
+/*#__PURE__*/
+_react.default.createElement(_SelectPicker.default, {
+  data: stringValuedData,
+  value: 1
+});
+
+/*#__PURE__*/
+_react.default.createElement(_SelectPicker.default, {
+  data: stringValuedData,
+  onChange: function onChange(newValue) {
+    (0, _tsExpect.expectType)(newValue);
+  }
+});

package/cjs/Sidenav/Node.d.ts

@@ -4,7 +4,7 @@
  * Ref: https://developer.mozilla.org/zh-CN/docs/Web/API/Node
  */
 export declare class Node {
-    id: string;
+    id: string | null;
     nodeValue: string | null;
     parent: string | null;
     parentNode: Node | null;

package/cjs/Sidenav/Sidenav.d.ts

@@ -23,16 +23,16 @@ export interface SidenavProps<T = string> extends WithAsProps {
      * Select the callback function for the menu
      * @deprecated Use <Sidenav onSelect> instead
      */
-    onSelect?: (eventKey: T, event: React.SyntheticEvent) => void;
+    onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
 }
-export declare const SidenavContext: React.Context<SidenavContextType<string>>;
+export declare const SidenavContext: React.Context<SidenavContextType<string> | null>;
 export interface SidenavContextType<T = string> {
     openKeys: T[];
-    activeKey: T;
+    activeKey: T | null;
     sidenav: boolean;
     expanded: boolean;
     onOpenChange: (eventKey: T, event: React.SyntheticEvent) => void;
-    onSelect?: (eventKey: T, event: React.SyntheticEvent) => void;
+    onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
 }
 export interface SidenavComponent extends RsRefForwardingComponent<'div', SidenavProps> {
     Header: typeof SidenavHeader;

package/cjs/Sidenav/Sidenav.js

@@ -34,6 +34,7 @@ var _deprecatePropType = _interopRequireDefault(require("../utils/deprecatePropT
 var SidenavContext = /*#__PURE__*/_react.default.createContext(null);
 
 exports.SidenavContext = SidenavContext;
+var emptyArray = [];
 
 var Sidenav = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
@@ -45,8 +46,10 @@ var Sidenav = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       appearance = _props$appearance === void 0 ? 'default' : _props$appearance,
       _props$expanded = props.expanded,
       expanded = _props$expanded === void 0 ? true : _props$expanded,
-      activeKey = props.activeKey,
-      defaultOpenKeys = props.defaultOpenKeys,
+      _props$activeKey = props.activeKey,
+      activeKey = _props$activeKey === void 0 ? null : _props$activeKey,
+      _props$defaultOpenKey = props.defaultOpenKeys,
+      defaultOpenKeys = _props$defaultOpenKey === void 0 ? emptyArray : _props$defaultOpenKey,
       openKeysProp = props.openKeys,
       onSelect = props.onSelect,
       onOpenChange = props.onOpenChange,

package/cjs/Sidenav/SidenavDropdown.js

@@ -60,14 +60,8 @@ var SidenavDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, re
       openProp = props.open,
       onToggle = props.onToggle,
       rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "title", "children", "className", "menuStyle", "disabled", "renderTitle", "renderToggle", "classPrefix", "placement", "toggleClassName", "icon", "eventKey", "toggleAs", "noCaret", "style", "onOpen", "onClose", "open", "onToggle"]);
-
-  var _useContext = (0, _react.useContext)(_Sidenav.SidenavContext),
-      _useContext$openKeys = _useContext.openKeys,
-      openKeys = _useContext$openKeys === void 0 ? [] : _useContext$openKeys,
-      onOpenChange = _useContext.onOpenChange;
-
-  var _useContext2 = (0, _react.useContext)(_DropdownContext.default),
-      hasSelectedItem = _useContext2.hasSelectedItem;
+  var sidenavContext = (0, _react.useContext)(_Sidenav.SidenavContext);
+  var dropdownContext = (0, _react.useContext)(_DropdownContext.default);
 
   var _useClassNames = (0, _utils.useClassNames)(classPrefix),
       merge = _useClassNames.merge,
@@ -75,6 +69,15 @@ var SidenavDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, re
 
   var internalId = (0, _useInternalId.default)('SidenavDropdown');
   var uniqueKey = eventKey !== null && eventKey !== void 0 ? eventKey : internalId;
+
+  if (!sidenavContext || !dropdownContext) {
+    throw new Error('<SidenavDropdown> component is not supposed to be used standalone. Use <Dropdown> inside <Sidenav> instead.');
+  }
+
+  var _sidenavContext$openK = sidenavContext.openKeys,
+      openKeys = _sidenavContext$openK === void 0 ? [] : _sidenavContext$openK,
+      onOpenChange = sidenavContext.onOpenChange;
+  var hasSelectedItem = dropdownContext.hasSelectedItem;
   var handleToggleDisclosure = (0, _react.useCallback)(function (open, event) {
     if (open) {
       onClose === null || onClose === void 0 ? void 0 : onClose();

package/cjs/Sidenav/SidenavDropdownItem.js

@@ -52,13 +52,16 @@ var SidenavDropdownItem = /*#__PURE__*/_react.default.forwardRef(function (props
       onClick = props.onClick,
       onSelect = props.onSelect,
       rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "active", "children", "disabled", "divider", "panel", "className", "style", "classPrefix", "icon", "eventKey", "onClick", "onSelect"]);
+  var sidenavContext = (0, _react.useContext)(_Sidenav.SidenavContext);
+  var dropdown = (0, _react.useContext)(_DropdownContext.default);
 
-  var _useContext = (0, _react.useContext)(_Sidenav.SidenavContext),
-      activeKey = _useContext.activeKey,
-      onSidenavSelect = _useContext.onSelect;
+  if (!sidenavContext || !dropdown) {
+    throw new Error('<SidenavDropdownItem> component is not supposed to be used standalone. Use <Dropdown.Item> within <Sidenav> instead.');
+  }
 
+  var activeKey = sidenavContext.activeKey,
+      onSidenavSelect = sidenavContext.onSelect;
   var nav = (0, _react.useContext)(_NavContext.default);
-  var dropdown = (0, _react.useContext)(_DropdownContext.default);
 
   var _useClassNames = (0, _utils.useClassNames)(classPrefix),
       merge = _useClassNames.merge,
@@ -72,9 +75,11 @@ var SidenavDropdownItem = /*#__PURE__*/_react.default.forwardRef(function (props
     disabled: disabled
   }));
   var handleClick = (0, _react.useCallback)(function (event) {
+    var _dropdown$onSelect;
+
     if (disabled) return;
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(eventKey, event);
-    dropdown === null || dropdown === void 0 ? void 0 : dropdown.onSelect(eventKey, event);
+    (_dropdown$onSelect = dropdown.onSelect) === null || _dropdown$onSelect === void 0 ? void 0 : _dropdown$onSelect.call(dropdown, eventKey, event);
     onSidenavSelect === null || onSidenavSelect === void 0 ? void 0 : onSidenavSelect(eventKey, event);
   }, [disabled, onSelect, onSidenavSelect, eventKey, dropdown]);
   var menuitemEventHandlers = {

package/cjs/Sidenav/SidenavDropdownMenu.js

@@ -68,12 +68,16 @@ var SidenavDropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props
       withClassPrefix = _useClassNames.withClassPrefix,
       prefix = _useClassNames.prefix;
 
-  var _useContext = (0, _react.useContext)(_Sidenav.SidenavContext),
-      _useContext$openKeys = _useContext.openKeys,
-      openKeys = _useContext$openKeys === void 0 ? [] : _useContext$openKeys,
-      onOpenChange = _useContext.onOpenChange,
-      onSidenavSelect = _useContext.onSelect;
+  var sidenavContext = (0, _react.useContext)(_Sidenav.SidenavContext);
 
+  if (!sidenavContext) {
+    throw new Error('<SidenavDropdownMenu> component is not supposed to be used standalone. Use <Dropdown.Item> inside <Sidenav> instead.');
+  }
+
+  var _sidenavContext$openK = sidenavContext.openKeys,
+      openKeys = _sidenavContext$openK === void 0 ? [] : _sidenavContext$openK,
+      onOpenChange = sidenavContext.onOpenChange,
+      onSidenavSelect = sidenavContext.onSelect;
   var handleClick = (0, _react.useCallback)(function (event) {
     if (disabled) return;
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(eventKey, event);

package/cjs/Sidenav/SidenavItem.d.ts

@@ -11,7 +11,7 @@ export interface SidenavItemProps<T = any> extends WithAsProps, Omit<React.HTMLA
     /** The value of the current option */
     eventKey?: T;
     /** Selected callback function */
-    onSelect?: (eventKey: T, event: React.MouseEvent<HTMLElement>) => void;
+    onSelect?: (eventKey: T, event: React.MouseEvent) => void;
     divider?: boolean;
     panel?: boolean;
 }

package/cjs/Sidenav/SidenavItem.js

@@ -50,6 +50,10 @@ var SidenavItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "active", "children", "className", "disabled", "classPrefix", "icon", "eventKey", "style", "onClick", "onSelect", "divider", "panel"]);
   var sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);
 
+  if (!sidenav) {
+    throw new Error('<SidenavItem> component is not supposed to be used standalone. Use <Nav.Item> inside <Sidenav> instead.');
+  }
+
   var _useContext = (0, _react.useContext)(_NavContext.default),
       activeKey = _useContext.activeKey,
       onSelectFromNav = _useContext.onSelect;

package/cjs/Slider/Graduated.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
 import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
 export interface GraduatedProps extends WithAsProps {
-    step?: number;
-    min?: number;
-    max?: number;
-    count?: number;
-    value?: number | number[];
+    step: number;
+    min: number;
+    max: number;
+    count: number;
+    value: number | number[];
     renderMark?: (mark: number) => React.ReactNode;
 }
 declare const Graduated: RsRefForwardingComponent<'div', GraduatedProps>;

package/cjs/Slider/Handle.d.ts

@@ -7,7 +7,7 @@ export interface HandleProps extends WithAsProps, React.HTMLAttributes<HTMLDivEl
     rtl?: boolean;
     position?: number;
     value?: number;
-    renderTooltip?: (value: number) => React.ReactNode;
+    renderTooltip?: (value: number | undefined) => React.ReactNode;
     onDragMove?: (event: React.DragEvent, dataset?: DOMStringMap) => void;
     onDragStart?: (event: React.MouseEvent) => void;
     onDragEnd?: (event: React.MouseEvent, dataset?: DOMStringMap) => void;

package/cjs/Slider/Handle.js

@@ -58,7 +58,7 @@ var Handle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       active = _useState[0],
       setActive = _useState[1];
 
-  var rootRef = (0, _react.useRef)();
+  var rootRef = (0, _react.useRef)(null);
   var horizontalKey = rtl ? 'right' : 'left';
   var direction = vertical ? 'bottom' : horizontalKey;
   var styles = (0, _extends3.default)({}, style, (_extends2 = {}, _extends2[direction] = position + "%", _extends2));
@@ -70,7 +70,7 @@ var Handle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var handleClasses = merge(className, prefix('handle'), {
     active: active
   });
-  var tooltipRef = (0, _react.useRef)();
+  var tooltipRef = (0, _react.useRef)(null);
   var mouseMoveTracker = (0, _react.useRef)();
   var releaseMouseMoves = (0, _react.useCallback)(function () {
     var _mouseMoveTracker$cur;
@@ -90,20 +90,24 @@ var Handle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     var _mouseMoveTracker$cur2;
 
     if ((_mouseMoveTracker$cur2 = mouseMoveTracker.current) !== null && _mouseMoveTracker$cur2 !== void 0 && _mouseMoveTracker$cur2.isDragging()) {
-      onDragMove === null || onDragMove === void 0 ? void 0 : onDragMove(event, rootRef.current.dataset);
+      var _rootRef$current;
+
+      onDragMove === null || onDragMove === void 0 ? void 0 : onDragMove(event, (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.dataset);
       setTooltipPosition();
     }
   }, [onDragMove, setTooltipPosition]);
   var handleDragEnd = (0, _react.useCallback)(function (event) {
+    var _rootRef$current2;
+
     setActive(false);
     releaseMouseMoves();
-    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(event, rootRef.current.dataset);
+    onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd(event, (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.dataset);
   }, [onDragEnd, releaseMouseMoves]);
   var getMouseMoveTracker = (0, _react.useCallback)(function () {
     return mouseMoveTracker.current || new _DOMMouseMoveTracker.default(handleDragMove, handleDragEnd, document.body);
   }, [handleDragEnd, handleDragMove]);
   var handleMouseDown = (0, _react.useCallback)(function (event) {
-    var _mouseMoveTracker$cur3, _rootRef$current;
+    var _mouseMoveTracker$cur3, _rootRef$current3;
 
     if (disabled) {
       return;
@@ -111,7 +115,7 @@ var Handle = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
 
     mouseMoveTracker.current = getMouseMoveTracker();
     (_mouseMoveTracker$cur3 = mouseMoveTracker.current) === null || _mouseMoveTracker$cur3 === void 0 ? void 0 : _mouseMoveTracker$cur3.captureMouseMoves(event);
-    (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.focus();
+    (_rootRef$current3 = rootRef.current) === null || _rootRef$current3 === void 0 ? void 0 : _rootRef$current3.focus();
     setActive(true);
     onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(event);
   }, [disabled, getMouseMoveTracker, onDragStart]);

package/cjs/Slider/Mark.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
 export interface MarkProps extends WithAsProps {
-    mark?: number;
+    mark: number;
     last?: boolean;
     renderMark?: (mark: number) => React.ReactNode;
 }

package/cjs/Slider/Slider.d.ts

@@ -45,7 +45,7 @@ export interface SliderProps<T = number> extends WithAsProps, FormControlBasePro
     /** Customize labels on the render ruler */
     renderMark?: (mark: number) => React.ReactNode;
     /** Customize the content of the rendered Tooltip. */
-    renderTooltip?: (value: number) => React.ReactNode;
+    renderTooltip?: (value: number | undefined) => React.ReactNode;
     /** Accepts a function which returns a string value that provides a user-friendly name for the current value of the slider. */
     getAriaValueText?: (value: number, eventKey?: 'start' | 'end') => string;
     /** Callback function that is fired when the mouseup is triggered. */

package/cjs/Slider/Slider.js

@@ -96,7 +96,7 @@ var Slider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       onChange = props.onChange,
       onChangeCommitted = props.onChangeCommitted,
       rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["aria-label", "aria-labelledby", "aria-valuetext", "as", "graduated", "className", "barClassName", "progress", "vertical", "disabled", "readOnly", "plaintext", "classPrefix", "min", "handleClassName", "handleStyle", "handleTitle", "tooltip", "step", "defaultValue", "value", "max", "getAriaValueText", "renderTooltip", "renderMark", "onChange", "onChangeCommitted"]);
-  var barRef = (0, _react.useRef)();
+  var barRef = (0, _react.useRef)(null);
 
   var _useClassNames = (0, _utils.useClassNames)(classPrefix),
       merge = _useClassNames.merge,
@@ -265,7 +265,7 @@ var Slider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     onDragMove: handleChangeValue,
     onKeyDown: handleKeyDown,
     onDragEnd: handleChangeCommitted,
-    tabIndex: disabled || readOnly ? null : 0,
+    tabIndex: disabled || readOnly ? undefined : 0,
     "aria-orientation": vertical ? 'vertical' : 'horizontal',
     "aria-valuenow": value,
     "aria-disabled": disabled,

package/cjs/Slider/utils.d.ts

@@ -1,2 +1,3 @@
 export declare const precisionMath: (value: any) => number;
-export declare const checkValue: (value: number, min: number, max: number) => number;
+declare function checkValue<T extends number | undefined>(value: T, min: number, max: number): T extends undefined ? undefined : number;
+export { checkValue };

package/cjs/Slider/utils.js

@@ -1,7 +1,8 @@
 "use strict";
 
 exports.__esModule = true;
-exports.checkValue = exports.precisionMath = void 0;
+exports.checkValue = checkValue;
+exports.precisionMath = void 0;
 
 var precisionMath = function precisionMath(value) {
   return parseFloat(value.toFixed(10));
@@ -9,7 +10,7 @@ var precisionMath = function precisionMath(value) {
 
 exports.precisionMath = precisionMath;
 
-var checkValue = function checkValue(value, min, max) {
+function checkValue(value, min, max) {
   if (typeof value === 'undefined') {
     return value;
   }
@@ -23,6 +24,4 @@ var checkValue = function checkValue(value, min, max) {
   }
 
   return value;
-};
-
-exports.checkValue = checkValue;
+}

package/cjs/Stack/Stack.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import { WithAsProps } from '../@types/common';
+export interface StackProps extends WithAsProps {
+    /**
+     * The direction of the children in the stack.
+     */
+    direction?: 'row' | 'row-reverse' | 'column' | 'column-reverse';
+    /**
+     * Define the alignment of the children in the stack on the cross axis
+     */
+    alignItems?: 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+    /**
+     *  Define the alignment of the children in the stack on the inline axis
+     */
+    justifyContent?: 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around';
+    /** Define the spacing between immediate children */
+    spacing?: number | string | (number | string)[];
+    /** Add an element between each child */
+    divider?: React.ReactNode;
+    /**
+     * Define whether the children in the stack are forced onto one line or can wrap onto multiple lines
+     */
+    wrap?: boolean;
+}
+declare const Stack: React.ForwardRefExoticComponent<StackProps & React.RefAttributes<HTMLDivElement>>;
+export default Stack;