rsuite 5.55.1 → 5.57.0

package/esm/Radio/Radio.js

@@ -1,31 +1,34 @@
 'use client';
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useCallback, useContext } from 'react';
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
 import { RadioContext } from '../RadioGroup/RadioGroup';
-import { useClassNames, useControlled, partitionHTMLProps } from '../utils';
+import { useClassNames, useControlled, useEventCallback, useUniqueId, partitionHTMLProps } from '../utils';
 import { refType } from '../internals/propTypes';
 /**
  * The `Radio` component is a simple radio button.
  * @see https://rsuitejs.com/components/radio
  */
 var Radio = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _useContext = useContext(RadioContext),
-    groupValue = _useContext.value,
-    controlled = _useContext.controlled,
-    inlineContext = _useContext.inline,
-    nameContext = _useContext.name,
-    disabledContext = _useContext.disabled,
-    readOnlyContext = _useContext.readOnly,
-    plaintextContext = _useContext.plaintext,
-    onGroupChange = _useContext.onChange;
+  var radioContext = useContext(RadioContext);
+  var _ref = radioContext !== null && radioContext !== void 0 ? radioContext : {},
+    groupValue = _ref.value,
+    inlineContext = _ref.inline,
+    nameContext = _ref.name,
+    disabledContext = _ref.disabled,
+    readOnlyContext = _ref.readOnly,
+    plaintextContext = _ref.plaintext,
+    onGroupChange = _ref.onChange;
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,
     title = props.title,
     className = props.className,
     children = props.children,
     checkedProp = props.checked,
+    color = props.color,
     defaultChecked = props.defaultChecked,
     _props$classPrefix = props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'radio' : _props$classPrefix,
@@ -46,15 +49,16 @@ var Radio = /*#__PURE__*/React.forwardRef(function (props, ref) {
     value = props.value,
     onChange = props.onChange,
     onClick = props.onClick,
-    rest = _objectWithoutPropertiesLoose(props, ["as", "title", "className", "children", "checked", "defaultChecked", "classPrefix", "tabIndex", "inputRef", "inputProps", "disabled", "readOnly", "plaintext", "inline", "name", "value", "onChange", "onClick"]);
+    rest = _objectWithoutPropertiesLoose(props, ["as", "title", "className", "children", "checked", "color", "defaultChecked", "classPrefix", "tabIndex", "inputRef", "inputProps", "disabled", "readOnly", "plaintext", "inline", "name", "value", "onChange", "onClick"]);
   var _useControlled = useControlled(typeof groupValue !== 'undefined' ? groupValue === value : checkedProp, defaultChecked || false),
     checked = _useControlled[0],
-    setChecked = _useControlled[1];
+    setChecked = _useControlled[1],
+    selfControlled = _useControlled[2];
   var _useClassNames = useClassNames(classPrefix),
     merge = _useClassNames.merge,
     withClassPrefix = _useClassNames.withClassPrefix,
     prefix = _useClassNames.prefix;
-  var classes = merge(className, withClassPrefix({
+  var classes = merge(className, withClassPrefix(color, {
     inline: inline,
     disabled: disabled,
     checked: checked
@@ -62,59 +66,62 @@ var Radio = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _partitionHTMLProps = partitionHTMLProps(rest),
     htmlInputProps = _partitionHTMLProps[0],
     restProps = _partitionHTMLProps[1];
-  var handleChange = useCallback(function (event) {
+  var handleChange = useEventCallback(function (event) {
     if (disabled || readOnly) {
       return;
     }
     setChecked(true);
     onGroupChange === null || onGroupChange === void 0 ? void 0 : onGroupChange(value, event);
     onChange === null || onChange === void 0 ? void 0 : onChange(value, true, event);
-  }, [disabled, onChange, onGroupChange, readOnly, setChecked, value]);
+  });
+  var controlled = radioContext ? true : selfControlled;
   if (typeof controlled !== 'undefined') {
     // In uncontrolled situations, use defaultChecked instead of checked
     htmlInputProps[controlled ? 'checked' : 'defaultChecked'] = checked;
   }
-  var input = /*#__PURE__*/React.createElement("span", {
-    className: prefix('wrapper')
+  var labelId = useUniqueId('label-');
+  if (plaintext) {
+    return checked ? /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
+      ref: ref,
+      className: classes
+    }), children) : null;
+  }
+  var control = /*#__PURE__*/React.createElement("span", {
+    className: prefix(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["control"])))
   }, /*#__PURE__*/React.createElement("input", _extends({}, htmlInputProps, inputProps, {
+    "aria-labelledby": labelId,
+    "aria-checked": checked,
+    "aria-disabled": disabled,
     ref: inputRef,
     type: "radio",
     name: name,
     value: value,
     tabIndex: tabIndex,
+    readOnly: readOnly,
     disabled: disabled,
-    onChange: handleChange,
-    onClick: useCallback(function (event) {
-      return event.stopPropagation();
-    }, [])
+    onChange: handleChange
   })), /*#__PURE__*/React.createElement("span", {
-    className: prefix('inner'),
+    className: prefix(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["inner"]))),
     "aria-hidden": true
   }));
-  if (plaintext) {
-    return checked ? /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
-      ref: ref,
-      className: classes
-    }), children) : null;
-  }
   return /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
     ref: ref,
     onClick: onClick,
-    className: classes,
-    "aria-checked": checked,
-    "aria-disabled": disabled
+    className: classes
   }), /*#__PURE__*/React.createElement("div", {
-    className: prefix('checker')
+    className: prefix(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["checker"])))
   }, children ? /*#__PURE__*/React.createElement("label", {
     title: title
-  }, input, children) : input));
+  }, control, /*#__PURE__*/React.createElement("span", {
+    className: prefix(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["label"]))),
+    id: labelId
+  }, children)) : control));
 });
 Radio.displayName = 'Radio';
 Radio.propTypes = {
   id: PropTypes.string,
   name: PropTypes.string,
   inline: PropTypes.bool,
-  title: PropTypes.string,
   disabled: PropTypes.bool,
   checked: PropTypes.bool,
   defaultChecked: PropTypes.bool,
@@ -124,8 +131,6 @@ Radio.propTypes = {
   classPrefix: PropTypes.string,
   value: PropTypes.any,
   inputRef: refType,
-  onChange: PropTypes.func,
-  onClick: PropTypes.func,
-  tabIndex: PropTypes.number
+  onChange: PropTypes.func
 };
 export default Radio;

package/esm/RadioGroup/RadioGroup.d.ts

@@ -21,7 +21,7 @@ export interface RadioGroupProps<T = ValueType> extends WithAsProps, FormControl
     /** Primary content */
     children?: React.ReactNode;
 }
-export declare const RadioContext: React.Context<RadioContextProps>;
+export declare const RadioContext: React.Context<RadioContextProps | undefined>;
 /**
  * The `RadioGroup` component is used to group a collection of `Radio` components.
  * @see https://rsuitejs.com/components/radio/#radio-group

package/esm/RadioGroup/RadioGroup.js

@@ -1,12 +1,12 @@
 'use client';
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useCallback, useMemo } from 'react';
+import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
-import { useClassNames, useControlled } from '../utils';
+import { useClassNames, useControlled, useEventCallback } from '../utils';
 import { oneOf } from '../internals/propTypes';
 import Plaintext from '../internals/Plaintext';
-export var RadioContext = /*#__PURE__*/React.createContext({});
+export var RadioContext = /*#__PURE__*/React.createContext(void 0);
 
 /**
  * The `RadioGroup` component is used to group a collection of `Radio` components.
@@ -40,10 +40,10 @@ var RadioGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
     value = _useControlled[0],
     setValue = _useControlled[1],
     isControlled = _useControlled[2];
-  var handleChange = useCallback(function (nextValue, event) {
+  var handleChange = useEventCallback(function (nextValue, event) {
     setValue(nextValue);
     onChange === null || onChange === void 0 ? void 0 : onChange(nextValue !== null && nextValue !== void 0 ? nextValue : '', event);
-  }, [onChange, setValue]);
+  });
   var contextValue = useMemo(function () {
     return {
       inline: inline,

package/esm/TagPicker/index.js

@@ -23,7 +23,7 @@ var TagPicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       trigger: trigger,
       tagProps: tagProps,
       onTagRemove: onTagRemove,
-      renderMenuItemCheckbox: renderMenuItemCheckbox
+      renderCheckbox: renderMenuItemCheckbox
     };
   }, [onTagRemove, renderMenuItemCheckbox, tagProps, trigger]);
   return /*#__PURE__*/React.createElement(InputPickerContext.Provider, {

package/esm/Tree/Tree.d.ts

@@ -77,11 +77,11 @@ export interface TreeBaseProps<ValueType = string | number, ItemDataType = Recor
     /** load node children data asynchronously */
     getChildren?: (activeNode: ItemDataType) => ItemDataType[] | Promise<ItemDataType>;
 }
-export interface TreeProps<ValueType = string | number> extends TreeBaseProps<ValueType, ItemDataType>, TreeDragProps<ItemDataType> {
+export interface TreeProps<T = string | number> extends TreeBaseProps<T, ItemDataType<T>>, TreeDragProps<ItemDataType<T>> {
     /** Tree Data */
-    data: ItemDataType[];
+    data: ItemDataType<T>[];
     /** Selected value */
-    value?: ValueType;
+    value?: T;
     /** Whether using virtualized list */
     virtualized?: boolean;
     /** Tree data structure Label property name */
@@ -91,7 +91,7 @@ export interface TreeProps<ValueType = string | number> extends TreeBaseProps<Va
     /** Tree data structure Children property name */
     childrenKey?: string;
     /** Default selected Value  */
-    defaultValue?: ValueType;
+    defaultValue?: T;
 }
 /**
  * The `Tree` component is used to display hierarchical data.

package/esm/index.d.ts

@@ -32,8 +32,9 @@ export { default as Avatar } from './Avatar';
 export type { AvatarProps } from './Avatar';
 export { default as AvatarGroup } from './AvatarGroup';
 export type { AvatarGroupProps } from './AvatarGroup';
-export { default as toaster, useToaster } from './toaster';
+export { default as toaster } from './toaster';
 export type { Toaster } from './toaster';
+export { default as useToaster } from './useToaster';
 export { default as Dropdown } from './Dropdown';
 export type { DropdownProps, DropdownMenuItemProps, DropdownMenuProps } from './Dropdown';
 export { default as Nav } from './Nav';
@@ -114,6 +115,10 @@ export { default as Tree } from './Tree';
 export type { TreeProps } from './Tree';
 export { default as CheckTree } from './CheckTree';
 export type { CheckTreeProps } from './CheckTree';
+export { default as CascadeTree } from './CascadeTree';
+export type { CascadeTreeProps } from './CascadeTree';
+export { default as MultiCascadeTree } from './MultiCascadeTree';
+export type { MultiCascadeTreeProps } from './MultiCascadeTree';
 export { default as Panel } from './Panel';
 export type { PanelProps } from './Panel';
 export { default as Accordion } from './Accordion';

package/esm/index.js

@@ -17,7 +17,9 @@ export { default as Placeholder } from './Placeholder';
 export { default as Badge } from './Badge';
 export { default as Avatar } from './Avatar';
 export { default as AvatarGroup } from './AvatarGroup';
-export { default as toaster, useToaster } from './toaster';
+export { default as toaster } from './toaster';
+export { default as useToaster } from './useToaster';
+
 // Nav
 export { default as Dropdown } from './Dropdown';
 export { default as Nav } from './Nav';
@@ -61,6 +63,8 @@ export { default as InlineEdit } from './InlineEdit';
 // Data display
 export { default as Tree } from './Tree';
 export { default as CheckTree } from './CheckTree';
+export { default as CascadeTree } from './CascadeTree';
+export { default as MultiCascadeTree } from './MultiCascadeTree';
 export { default as Panel } from './Panel';
 export { default as Accordion } from './Accordion';
 export { default as PanelGroup } from './PanelGroup';

package/esm/internals/Picker/ListCheckItem.d.ts

@@ -1,23 +1,14 @@
 import React from 'react';
 import { CheckboxProps } from '../../Checkbox';
 import { WithAsProps, RsRefForwardingComponent } from '../../@types/common';
-export interface ListCheckItemProps extends WithAsProps {
+export interface ListCheckItemProps extends WithAsProps, Omit<CheckboxProps, 'onSelect'> {
     active?: boolean;
     checkboxAs?: React.ElementType | string;
-    classPrefix?: string;
-    disabled?: boolean;
-    checkable?: boolean;
-    indeterminate?: boolean;
-    value?: string | number;
     focus?: boolean;
-    title?: string;
-    className?: string;
-    children?: React.ReactNode;
     onSelect?: (value: any, event: React.SyntheticEvent, checked: boolean) => void;
     onCheck?: (value: any, event: React.SyntheticEvent, checked: boolean) => void;
     onSelectItem?: (value: any, event: React.SyntheticEvent, checked: boolean) => void;
-    onKeyDown?: (event: React.KeyboardEvent) => void;
-    renderMenuItemCheckbox?: (checkboxProps: CheckboxProps) => React.ReactNode;
+    renderCheckbox?: (checkboxProps: CheckboxProps) => React.ReactNode;
 }
 declare const ListCheckItem: RsRefForwardingComponent<'div', ListCheckItemProps>;
 export default ListCheckItem;

package/esm/internals/Picker/ListCheckItem.js

@@ -24,12 +24,13 @@ var ListCheckItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     children = props.children,
     className = props.className,
     indeterminate = props.indeterminate,
+    labelClickable = props.labelClickable,
     onKeyDown = props.onKeyDown,
     onSelect = props.onSelect,
     onCheck = props.onCheck,
     onSelectItem = props.onSelectItem,
-    renderMenuItemCheckbox = props.renderMenuItemCheckbox,
-    rest = _objectWithoutPropertiesLoose(props, ["active", "as", "checkboxAs", "classPrefix", "checkable", "disabled", "value", "focus", "children", "className", "indeterminate", "onKeyDown", "onSelect", "onCheck", "onSelectItem", "renderMenuItemCheckbox"]);
+    renderCheckbox = props.renderCheckbox,
+    rest = _objectWithoutPropertiesLoose(props, ["active", "as", "checkboxAs", "classPrefix", "checkable", "disabled", "value", "focus", "children", "className", "indeterminate", "labelClickable", "onKeyDown", "onSelect", "onCheck", "onSelectItem", "renderCheckbox"]);
   var handleChange = useEventCallback(function (value, checked, event) {
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, event, checked);
   });
@@ -53,13 +54,14 @@ var ListCheckItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     focus: focus
   });
   var checkboxProps = {
-    value: value,
-    disabled: disabled,
-    indeterminate: indeterminate,
     checkable: checkable,
     children: children,
     checked: active,
     className: checkboxItemClasses,
+    disabled: disabled,
+    value: value,
+    indeterminate: indeterminate,
+    labelClickable: labelClickable,
     onKeyDown: disabled ? undefined : onKeyDown,
     onChange: handleChange,
     onClick: handleSelectItem,
@@ -75,7 +77,7 @@ var ListCheckItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     ref: ref,
     className: merge(className, rootPrefix(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["picker-list-item"])))),
     tabIndex: -1
-  }), renderMenuItemCheckbox ? renderMenuItemCheckbox(checkboxProps) : /*#__PURE__*/React.createElement(CheckboxItem, _extends({
+  }), renderCheckbox ? renderCheckbox(checkboxProps) : /*#__PURE__*/React.createElement(CheckboxItem, _extends({
     role: "checkbox"
   }, checkboxProps)));
 });

package/esm/internals/Picker/PickerToggle.d.ts

@@ -1,9 +1,8 @@
 import React from 'react';
 import ToggleButton, { ToggleButtonProps } from './ToggleButton';
-import { RsRefForwardingComponent, TypeAttributes } from '../../@types/common';
+import { RsRefForwardingComponent, TypeAttributes, DataItemValue } from '../../@types/common';
 import { IconProps } from '@rsuite/icons/lib/Icon';
-declare type ValueType = string | number;
-export interface PickerToggleProps extends ToggleButtonProps {
+export interface PickerToggleProps<T = DataItemValue> extends ToggleButtonProps {
     active?: boolean;
     hasValue?: boolean;
     cleanable?: boolean;
@@ -28,8 +27,8 @@ export interface PickerToggleProps extends ToggleButtonProps {
     loading?: boolean;
     label?: React.ReactNode;
     name?: string;
-    inputValue?: ValueType | ValueType[];
-    focusItemValue?: ValueType | null;
+    inputValue?: T | T[];
+    focusItemValue?: T | null;
     onClean?: (event: React.MouseEvent) => void;
 }
 declare const PickerToggle: RsRefForwardingComponent<typeof ToggleButton, PickerToggleProps>;

package/esm/toaster/ToastContainer.d.ts

@@ -3,9 +3,16 @@ import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
 export declare type PlacementType = 'topCenter' | 'bottomCenter' | 'topStart' | 'topEnd' | 'bottomStart' | 'bottomEnd';
 export declare const toastPlacements: PlacementType[];
 export interface ToastContainerProps extends WithAsProps {
-    /** The placement of the message box */
+    /**
+     * The placement of the message box。
+     *
+     * @default 'topCenter'
+     */
     placement?: PlacementType;
-    /** Set the message to appear in the specified container */
+    /**
+     * Set the message to appear in the specified container
+     *
+     */
     container?: HTMLElement | (() => HTMLElement);
     /** The number of milliseconds to wait before automatically closing a message. */
     duration?: number;

package/esm/toaster/index.d.ts

@@ -1,4 +1,3 @@
 import toaster from './toaster';
 export type { Toaster } from './toaster';
-export { default as useToaster } from './useToaster';
 export default toaster;

package/esm/toaster/index.js

@@ -1,4 +1,3 @@
 'use client';
 import toaster from './toaster';
-export { default as useToaster } from './useToaster';
 export default toaster;

package/esm/useToaster/index.d.ts

@@ -0,0 +1,2 @@
+import useToaster from './useToaster';
+export default useToaster;

package/esm/useToaster/index.js

@@ -0,0 +1,3 @@
+'use client';
+import useToaster from './useToaster';
+export default useToaster;

package/esm/{toaster → useToaster}/useToaster.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
-import { ToastContainerProps } from './ToastContainer';
+import { ToastContainerProps } from '../toaster/ToastContainer';
 /**
- * The 'useToaster' hook is a wrapper for the 'toaster' module.
+ * Toaster display brief, temporary notifications of actions, errors, or other events in an application.
+ * It is often used with the Message and Notification components.
  * @returns toaster { push, remove, clear }
  *
- * @see https://rsuitejs.com/components/message/
- * @see https://rsuitejs.com/components/notification/
+ * @see https://rsuitejs.com/components/use-toaster/
  */
 declare const useToaster: () => {
     /**

package/esm/{toaster → useToaster}/useToaster.js

@@ -1,14 +1,14 @@
 'use client';
 import { useMemo } from 'react';
-import toaster from './toaster';
+import toaster from '../toaster';
 import { useCustom } from '../utils';
 
 /**
- * The 'useToaster' hook is a wrapper for the 'toaster' module.
+ * Toaster display brief, temporary notifications of actions, errors, or other events in an application.
+ * It is often used with the Message and Notification components.
  * @returns toaster { push, remove, clear }
  *
- * @see https://rsuitejs.com/components/message/
- * @see https://rsuitejs.com/components/notification/
+ * @see https://rsuitejs.com/components/use-toaster/
  */
 var useToaster = function useToaster() {
   var _useCustom = useCustom(),

package/esm/utils/index.d.ts

@@ -46,3 +46,4 @@ export { default as useUniqueId } from './useUniqueId';
 export { default as useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';
 export { default as useInternalId } from './useInternalId';
 export { default as useEnsuredRef } from './useEnsuredRef';
+export { useMap } from './useMap';

package/esm/utils/index.js

@@ -48,4 +48,5 @@ export { default as useMount } from './useMount';
 export { default as useUniqueId } from './useUniqueId';
 export { default as useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';
 export { default as useInternalId } from './useInternalId';
-export { default as useEnsuredRef } from './useEnsuredRef';
+export { default as useEnsuredRef } from './useEnsuredRef';
+export { useMap } from './useMap';

package/internals/Picker/styles/index.less

@@ -397,7 +397,7 @@
       }
     }
 
-    .rs-checkbox-wrapper {
+    .rs-checkbox-control {
       left: @picker-item-content-padding-horizontal;
 
       .grouped &,

package/package.json

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

package/styles/index.less

@@ -13,6 +13,7 @@
 @import '../Calendar/styles/index';
 @import '../Carousel/styles/index';
 @import '../Cascader/styles/index';
+@import '../CascadeTree/styles/index';
 @import '../Checkbox/styles/index';
 @import '../CheckboxGroup/styles/index';
 @import '../CheckPicker/styles/index';
@@ -46,6 +47,7 @@
 @import '../Loader/styles/index';
 @import '../Message/styles/index';
 @import '../Modal/styles/index';
+@import '../MultiCascadeTree/styles/index';
 @import '../MultiCascader/styles/index';
 @import '../Nav/styles/index';
 @import '../Navbar/styles/index';

package/useToaster/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "rsuite/useToaster",
+  "private": true,
+  "main": "../cjs/useToaster/index.js",
+  "module": "../esm/useToaster/index.js",
+  "types": "../esm/useToaster/index.d.ts"
+}