rsuite 5.46.0 → 5.47.0

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+# [5.47.0](https://github.com/rsuite/rsuite/compare/v5.46.1...v5.47.0) (2023-12-08)
+
+### Bug Fixes
+
+- **CloseButton:** fix close label translation string ([#3483](https://github.com/rsuite/rsuite/issues/3483)) ([feedbde](https://github.com/rsuite/rsuite/commit/feedbde550d96d207d6be690b89c3d12247b87d9))
+- **CloseButton:** improve CloseButton accessibility ([#3488](https://github.com/rsuite/rsuite/issues/3488)) ([92ed9a5](https://github.com/rsuite/rsuite/commit/92ed9a5080e241f7e4057cbbc6e971240fb464fe))
+
+### Features
+
+- **TagPicker:** add support for renderMenuItemCheckbox ([#3481](https://github.com/rsuite/rsuite/issues/3481)) ([6b044e9](https://github.com/rsuite/rsuite/commit/6b044e9621db421ea75dc549da27d63493a91261))
+
+## [5.46.1](https://github.com/rsuite/rsuite/compare/v5.46.0...v5.46.1) (2023-12-01)
+
+### Bug Fixes
+
+- **Calendar:** fix incorrect week numbers calculation ([#3471](https://github.com/rsuite/rsuite/issues/3471)) ([646e728](https://github.com/rsuite/rsuite/commit/646e72874595ee7c0a8d8596175c974ff67e146a))
+- **CSS:** fix CSS calc syntax compatibility issue ([#3474](https://github.com/rsuite/rsuite/issues/3474)) ([88021ee](https://github.com/rsuite/rsuite/commit/88021eeaa0f7e720f6511616c0e2413570700159))
+- **Slider,RangeSlider:** fix onChangeCommitted not triggered when the… ([#3472](https://github.com/rsuite/rsuite/issues/3472)) ([18a6e17](https://github.com/rsuite/rsuite/commit/18a6e17417bcb516701340b335c10ee3c7efa15a))
+
 # [5.46.0](https://github.com/rsuite/rsuite/compare/v5.45.0...v5.46.0) (2023-11-24)
 
 ### Bug Fixes

package/CloseButton/styles/index.less

@@ -2,18 +2,24 @@
 
 // Close button
 .rs-btn-close {
-  background: transparent;
-  position: absolute;
-  top: 0;
-  right: 0;
-  padding: @message-close-btn-padding;
-  font-size: @message-close-btn-size;
-  line-height: 1;
   border: none;
   outline: none !important;
+  background: transparent;
+  line-height: 1;
+
   cursor: pointer;
 
   .rs-icon {
     vertical-align: bottom;
   }
+
+  &:hover,
+  &:focus {
+    color: var(--rs-close-button-hover-color);
+
+    svg path {
+      stroke: var(--rs-close-button-hover-color);
+      stroke-width: 1;
+    }
+  }
 }

package/Message/styles/mixin.less

@@ -11,6 +11,14 @@
     color: @text-color;
   }
 
+  .rs-btn-close {
+    position: absolute;
+    right: 0;
+    top: 0;
+    padding: 8px;
+    font-size: 12px;
+  }
+
   .rs-message-icon-wrapper > .rs-icon,
   .rs-btn-close {
     color: @icon-color;

package/Notification/styles/index.less

@@ -79,6 +79,14 @@
       margin-top: 0;
     }
   }
+
+  .rs-btn-close {
+    position: absolute;
+    right: 0;
+    top: 0;
+    padding: 8px;
+    font-size: 12px;
+  }
 }
 
 // Alternate styles

package/Picker/styles/index.less

@@ -245,15 +245,6 @@
     padding: 4px 0;
   }
 
-  &:hover {
-    color: var(--rs-state-error);
-  }
-
-  &:hover svg path {
-    stroke: var(--rs-state-error);
-    stroke-width: 1;
-  }
-
   .rs-@{date-picker-prefix} &,
   .rs-@{date-range-picker-prefix} & {
     right: (@picker-toggle-clean-right + @picker-item-content-padding-vertical);

package/Tag/styles/index.less

@@ -17,11 +17,8 @@
 
   &-icon-close {
     position: absolute;
-    font-size: 12px;
-  }
-
-  &-default &-icon-close:hover {
-    color: var(--rs-tag-close);
+    top: 0;
+    right: 0;
   }
 
   &-group {

package/Uploader/styles/index.less

@@ -109,8 +109,7 @@
 
     &-btn-remove {
       position: absolute;
-      font-size: 12px;
-      // (36px -  font-size)/2
+      font-size: 14px;
       top: 12px;
       right: @padding-x;
       color: var(--rs-text-secondary);

package/cjs/Calendar/Table.js

@@ -32,7 +32,8 @@ var Table = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }), /*#__PURE__*/_react.default.createElement(_TableHeaderRow.default, null), rows.map(function (week, index) {
     return /*#__PURE__*/_react.default.createElement(_TableRow.default, {
       key: index,
-      weekendDate: week
+      weekendDate: week,
+      rowIndex: index + 1
     });
   }));
 });

package/cjs/Calendar/TableRow.d.ts

@@ -1,6 +1,7 @@
 import { RsRefForwardingComponent, WithAsProps } from '../@types/common';
 export interface TableRowProps extends WithAsProps {
     weekendDate?: Date;
+    rowIndex?: number;
 }
 declare const TableRow: RsRefForwardingComponent<'div', TableRowProps>;
 export default TableRow;

package/cjs/Calendar/TableRow.js

@@ -21,7 +21,8 @@ var TableRow = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     classPrefix = _props$classPrefix === void 0 ? 'calendar-table' : _props$classPrefix,
     _props$weekendDate = props.weekendDate,
     weekendDate = _props$weekendDate === void 0 ? new Date() : _props$weekendDate,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "classPrefix", "weekendDate"]);
+    rowIndex = props.rowIndex,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "className", "classPrefix", "weekendDate", "rowIndex"]);
   var _useCalendarContext = (0, _CalendarContext.useCalendarContext)(),
     _useCalendarContext$d = _useCalendarContext.date,
     selected = _useCalendarContext$d === void 0 ? new Date() : _useCalendarContext$d,
@@ -95,14 +96,19 @@ var TableRow = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     return days;
   };
   var classes = merge(className, prefix('row'));
+  var week = (0, _dateUtils.format)(weekendDate, isoWeek ? 'I' : 'w', {
+    firstWeekContainsDate: 4
+  });
   return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
     ref: ref,
     role: "row",
+    "aria-rowindex": rowIndex,
     className: classes
   }), showWeekNumbers && /*#__PURE__*/_react.default.createElement("div", {
-    className: prefix('cell-week-number'),
-    role: "rowheader"
-  }, (0, _dateUtils.format)(weekendDate, isoWeek ? 'I' : 'w')), renderDays());
+    role: "rowheader",
+    "aria-label": "Week " + week,
+    className: prefix('cell-week-number')
+  }, week), renderDays());
 });
 TableRow.displayName = 'CalendarTableRow';
 TableRow.propTypes = {

package/cjs/Checkbox/Checkbox.d.ts

@@ -36,6 +36,8 @@ export interface CheckboxProps<V = ValueType> extends WithAsProps {
     onClick?: (event: React.SyntheticEvent) => void;
     /** Called when the checkbox is clicked. */
     onCheckboxClick?: (event: React.SyntheticEvent) => void;
+    /** Called when the user presses down a key. */
+    onKeyDown?: (event: React.KeyboardEvent) => void;
 }
 declare const Checkbox: RsRefForwardingComponent<'div', CheckboxProps>;
 export default Checkbox;

package/cjs/CloseButton/CloseButton.js

@@ -14,7 +14,7 @@ var _utils = require("../utils");
  */
 var CloseButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
-    Component = _props$as === void 0 ? 'span' : _props$as,
+    Component = _props$as === void 0 ? 'button' : _props$as,
     _props$classPrefix = props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'btn-close' : _props$classPrefix,
     className = props.className,
@@ -27,13 +27,11 @@ var CloseButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     locale = _useCustom.locale;
   var classes = merge(className, withClassPrefix());
   return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
-    role: "button"
-  }, rest, {
+    type: "button",
     ref: ref,
     className: classes,
-    title: locale === null || locale === void 0 ? void 0 : locale.closeLabel,
     "aria-label": locale === null || locale === void 0 ? void 0 : locale.closeLabel
-  }), /*#__PURE__*/_react.default.createElement(_Close.default, null));
+  }, rest), /*#__PURE__*/_react.default.createElement(_Close.default, null));
 });
 CloseButton.displayName = 'CloseButton';
 var _default = CloseButton;

package/cjs/CustomProvider/CustomProvider.d.ts

@@ -55,6 +55,8 @@ declare const CustomContext: React.Context<CustomProviderProps<{
     common?: {
         loading: string;
         emptyMessage: string;
+        remove: string;
+        clear: string;
     } | undefined;
     Plaintext?: {
         unfilled: string;
@@ -134,9 +136,6 @@ declare const CustomContext: React.Context<CustomProviderProps<{
     } | undefined;
     InputPicker?: {
         newItem: string;
-        /**
-         * A Map of toast containers
-         */
         createOption: string;
     } | undefined;
     Uploader?: {
@@ -146,6 +145,7 @@ declare const CustomContext: React.Context<CustomProviderProps<{
         complete: string;
         emptyFile: string;
         upload: string;
+        removeFile: string;
     } | undefined;
     CloseButton?: {
         closeLabel: string;

package/cjs/InputPicker/InputPicker.d.ts

@@ -1,27 +1,8 @@
 import React from 'react';
-import { InputPickerLocale } from '../locales';
 import { PickerComponent, PickerToggleProps } from '../Picker';
-import { TagProps } from '../Tag';
-import { ItemDataType, FormControlPickerProps } from '../@types/common';
-import { SelectProps } from '../SelectPicker';
-export declare type TriggerType = 'Enter' | 'Space' | 'Comma';
-export interface InputPickerContextProps {
-    /** Multiple selections are allowed */
-    multi?: boolean;
-    /** Tag related props. */
-    tagProps: TagProps;
-    /**
-     * Set the trigger for creating tags. only valid when creatable
-     */
-    trigger: TriggerType | TriggerType[];
-    /**
-     * No overlay provides options
-     */
-    disabledOptions?: boolean;
-    /** Callback fired when a tag is removed. */
-    onTagRemove?: (tag: string, event: React.MouseEvent) => void;
-}
-export declare const InputPickerContext: React.Context<InputPickerContextProps>;
+import type { ItemDataType, FormControlPickerProps } from '../@types/common';
+import type { InputPickerLocale } from '../locales';
+import type { SelectProps } from '../SelectPicker';
 interface InputItemDataType extends ItemDataType {
     create?: boolean;
 }

package/cjs/InputPicker/InputPicker.js

@@ -4,7 +4,7 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 exports.__esModule = true;
-exports.default = exports.InputPickerContext = void 0;
+exports.default = void 0;
 var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
@@ -28,12 +28,8 @@ var _Picker = require("../Picker");
 var _Tag = _interopRequireDefault(require("../Tag"));
 var _InputAutosize = _interopRequireDefault(require("./InputAutosize"));
 var _InputSearch = _interopRequireDefault(require("./InputSearch"));
+var _InputPickerContext = _interopRequireDefault(require("./InputPickerContext"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-var InputPickerContext = /*#__PURE__*/_react.default.createContext({
-  tagProps: {},
-  trigger: 'Enter'
-});
-exports.InputPickerContext = InputPickerContext;
 var InputPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _merge;
   var _props$as = props.as,
@@ -104,12 +100,13 @@ var InputPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     _props$placement = props.placement,
     placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,
     rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "appearance", "cleanable", "cacheData", "classPrefix", "data", "disabled", "readOnly", "plaintext", "defaultValue", "defaultOpen", "disabledItemValues", "locale", "toggleAs", "style", "searchable", "open", "placeholder", "groupBy", "menuClassName", "menuStyle", "menuAutoWidth", "menuMaxHeight", "creatable", "shouldDisplayCreateOption", "value", "valueKey", "virtualized", "labelKey", "listProps", "id", "tabIndex", "sort", "renderMenu", "renderExtraFooter", "renderValue", "renderMenuItem", "renderMenuGroup", "onEnter", "onEntered", "onExit", "onExited", "onChange", "onClean", "onCreate", "onSearch", "onSelect", "onOpen", "onClose", "onBlur", "onFocus", "searchBy", "placement"]);
-  var _useContext = (0, _react.useContext)(InputPickerContext),
+  var _useContext = (0, _react.useContext)(_InputPickerContext.default),
     multi = _useContext.multi,
     tagProps = _useContext.tagProps,
     trigger = _useContext.trigger,
     disabledOptions = _useContext.disabledOptions,
-    onTagRemove = _useContext.onTagRemove;
+    onTagRemove = _useContext.onTagRemove,
+    renderMenuItemCheckbox = _useContext.renderMenuItemCheckbox;
   if (groupBy === valueKey || groupBy === labelKey) {
     throw Error('`groupBy` can not be equal to `valueKey` and `labelKey`');
   }
@@ -564,6 +561,9 @@ var InputPicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       classPrefix: menuClassPrefix,
       dropdownMenuItemClassPrefix: multi ? undefined : menuClassPrefix + "-item",
       dropdownMenuItemAs: multi ? _Picker.DropdownMenuCheckItem : _Picker.DropdownMenuItem,
+      dropdownMenuItemProps: {
+        renderMenuItemCheckbox: renderMenuItemCheckbox
+      },
       activeItemValues: multi ? value : [value],
       focusItemValue: focusItemValue,
       maxHeight: menuMaxHeight,

package/cjs/InputPicker/InputPickerContext.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import type { TagProps } from '../Tag';
+import type { CheckboxProps } from '../Checkbox';
+export declare type TriggerType = 'Enter' | 'Space' | 'Comma';
+export interface TagOnlyProps {
+    /**  Tag related props. */
+    tagProps: TagProps;
+    /**
+     * Set the trigger for creating tags. only valid when creatable
+     */
+    trigger: TriggerType | TriggerType[];
+    /** Callback fired when a tag is removed. */
+    onTagRemove?: (tag: string, event: React.MouseEvent) => void;
+}
+export interface InputPickerContextProps extends TagOnlyProps {
+    /** Multiple selections are allowed */
+    multi?: boolean;
+    /**
+     * No overlay provides options
+     */
+    disabledOptions?: boolean;
+    /** Custom render checkbox on menu item */
+    renderMenuItemCheckbox?: (checkboxProps: CheckboxProps) => React.ReactNode;
+}
+declare const InputPickerContext: React.Context<InputPickerContextProps>;
+export default InputPickerContext;

package/cjs/InputPicker/InputPickerContext.js

@@ -0,0 +1,13 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var InputPickerContext = /*#__PURE__*/_react.default.createContext({
+  tagProps: {},
+  trigger: 'Enter'
+});
+var _default = InputPickerContext;
+exports.default = _default;

package/cjs/Picker/DropdownMenu.d.ts

@@ -17,6 +17,7 @@ export interface DropdownMenuProps<Multiple = false> extends StandardProps, Omit
     style?: React.CSSProperties;
     dropdownMenuItemAs: React.ElementType | string;
     dropdownMenuItemClassPrefix?: string;
+    dropdownMenuItemProps?: any;
     rowHeight?: number;
     rowGroupHeight?: number;
     virtualized?: boolean;

package/cjs/Picker/DropdownMenu.js

@@ -14,6 +14,7 @@ var _isUndefined = _interopRequireDefault(require("lodash/isUndefined"));
 var _isString = _interopRequireDefault(require("lodash/isString"));
 var _isNumber = _interopRequireDefault(require("lodash/isNumber"));
 var _findIndex = _interopRequireDefault(require("lodash/findIndex"));
+var _pickBy = _interopRequireDefault(require("lodash/pickBy"));
 var _getPosition = _interopRequireDefault(require("dom-lib/getPosition"));
 var _scrollTop = _interopRequireDefault(require("dom-lib/scrollTop"));
 var _getHeight = _interopRequireDefault(require("dom-lib/getHeight"));
@@ -49,6 +50,7 @@ var DropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     focusItemValue = props.focusItemValue,
     dropdownMenuItemClassPrefix = props.dropdownMenuItemClassPrefix,
     DropdownMenuItem = props.dropdownMenuItemAs,
+    dropdownMenuItemProps = props.dropdownMenuItemProps,
     _props$rowHeight = props.rowHeight,
     rowHeight = _props$rowHeight === void 0 ? 36 : _props$rowHeight,
     _props$rowGroupHeight = props.rowGroupHeight,
@@ -57,7 +59,7 @@ var DropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     renderMenuItem = props.renderMenuItem,
     onGroupTitleClick = props.onGroupTitleClick,
     onSelect = props.onSelect,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["data", "group", "groupBy", "maxHeight", "activeItemValues", "disabledItemValues", "classPrefix", "valueKey", "labelKey", "virtualized", "listProps", "listRef", "className", "style", "focusItemValue", "dropdownMenuItemClassPrefix", "dropdownMenuItemAs", "rowHeight", "rowGroupHeight", "renderMenuGroup", "renderMenuItem", "onGroupTitleClick", "onSelect"]);
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["data", "group", "groupBy", "maxHeight", "activeItemValues", "disabledItemValues", "classPrefix", "valueKey", "labelKey", "virtualized", "listProps", "listRef", "className", "style", "focusItemValue", "dropdownMenuItemClassPrefix", "dropdownMenuItemAs", "dropdownMenuItemProps", "rowHeight", "rowGroupHeight", "renderMenuGroup", "renderMenuItem", "onGroupTitleClick", "onSelect"]);
   var _useClassNames = (0, _utils.useClassNames)(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     prefix = _useClassNames.prefix,
@@ -155,7 +157,7 @@ var DropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       return (0, _shallowEqual.default)(v, value);
     });
     var focus = !(0, _isUndefined.default)(focusItemValue) && (0, _shallowEqual.default)(focusItemValue, value);
-    return /*#__PURE__*/_react.default.createElement(DropdownMenuItem, {
+    return /*#__PURE__*/_react.default.createElement(DropdownMenuItem, (0, _extends2.default)({
       style: style,
       key: itemKey,
       disabled: disabled,
@@ -164,7 +166,9 @@ var DropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       value: value,
       classPrefix: dropdownMenuItemClassPrefix,
       onSelect: handleSelect.bind(null, item)
-    }, renderMenuItem ? renderMenuItem(label, item) : label);
+    }, (0, _pickBy.default)(dropdownMenuItemProps, function (v) {
+      return v !== undefined;
+    })), renderMenuItem ? renderMenuItem(label, item) : label);
   };
   var filteredItems = group ? data.filter(function (item) {
     var _item$parent;

package/cjs/Picker/DropdownMenuCheckItem.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { CheckboxProps } from '../Checkbox';
 import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
 export interface DropdownMenuCheckItemProps extends WithAsProps {
     active?: boolean;
@@ -16,6 +17,7 @@ export interface DropdownMenuCheckItemProps extends WithAsProps {
     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;
 }
 declare const DropdownMenuCheckItem: RsRefForwardingComponent<'div', DropdownMenuCheckItemProps>;
 export default DropdownMenuCheckItem;

package/cjs/Picker/DropdownMenuCheckItem.js

@@ -32,7 +32,8 @@ var DropdownMenuCheckItem = /*#__PURE__*/_react.default.forwardRef(function (pro
     onSelect = props.onSelect,
     onCheck = props.onCheck,
     onSelectItem = props.onSelectItem,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["active", "as", "checkboxAs", "classPrefix", "checkable", "disabled", "value", "focus", "children", "className", "indeterminate", "onKeyDown", "onSelect", "onCheck", "onSelectItem"]);
+    renderMenuItemCheckbox = props.renderMenuItemCheckbox,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["active", "as", "checkboxAs", "classPrefix", "checkable", "disabled", "value", "focus", "children", "className", "indeterminate", "onKeyDown", "onSelect", "onCheck", "onSelectItem", "renderMenuItemCheckbox"]);
   var handleChange = (0, _react.useCallback)(function (value, checked, event) {
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, event, checked);
   }, [onSelect]);
@@ -51,6 +52,19 @@ var DropdownMenuCheckItem = /*#__PURE__*/_react.default.forwardRef(function (pro
   var checkboxItemClasses = withClassPrefix({
     focus: focus
   });
+  var checkboxProps = {
+    value: value,
+    disabled: disabled,
+    indeterminate: indeterminate,
+    checkable: checkable,
+    children: children,
+    checked: active,
+    className: checkboxItemClasses,
+    onKeyDown: disabled ? undefined : onKeyDown,
+    onChange: handleChange,
+    onClick: handleSelectItem,
+    onCheckboxClick: handleCheck
+  };
   return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
     role: "option",
     "aria-selected": active,
@@ -60,19 +74,9 @@ var DropdownMenuCheckItem = /*#__PURE__*/_react.default.forwardRef(function (pro
     ref: ref,
     className: className,
     tabIndex: -1
-  }), /*#__PURE__*/_react.default.createElement(CheckboxItem, {
-    value: value,
-    role: "checkbox",
-    disabled: disabled,
-    checked: active,
-    checkable: checkable,
-    indeterminate: indeterminate,
-    className: checkboxItemClasses,
-    onKeyDown: disabled ? null : onKeyDown,
-    onChange: handleChange,
-    onClick: handleSelectItem,
-    onCheckboxClick: handleCheck
-  }, children));
+  }), renderMenuItemCheckbox ? renderMenuItemCheckbox(checkboxProps) : /*#__PURE__*/_react.default.createElement(CheckboxItem, (0, _extends2.default)({
+    role: "checkbox"
+  }, checkboxProps)));
 });
 DropdownMenuCheckItem.displayName = 'DropdownMenuCheckItem';
 DropdownMenuCheckItem.propTypes = {

package/cjs/Picker/PickerToggle.js

@@ -64,6 +64,8 @@ var PickerToggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     label = props.label,
     name = props.name,
     rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["active", "as", "classPrefix", "children", "caret", "className", "disabled", "readOnly", "plaintext", "hasValue", "editable", "loading", "cleanable", "tabIndex", "id", "value", "inputPlaceholder", "inputValue", "inputMask", "onInputChange", "onInputPressEnter", "onInputBackspace", "onInputBlur", "onInputFocus", "onClean", "onFocus", "onBlur", "placement", "caretComponent", "caretAs", "label", "name"]);
+  var _useCustom = (0, _utils.useCustom)(),
+    locale = _useCustom.locale;
   var inputRef = (0, _react.useRef)(null);
   var comboboxRef = (0, _react.useRef)(null);
   var _useState = (0, _react.useState)(false),
@@ -224,7 +226,7 @@ var PickerToggle = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["clean"]))),
     tabIndex: -1,
     locale: {
-      closeLabel: 'Clear'
+      closeLabel: locale === null || locale === void 0 ? void 0 : locale.clear
     },
     onClick: handleClean
   }), caret && !showCleanButton && /*#__PURE__*/_react.default.createElement(Caret, {

package/cjs/RadioTile/RadioTile.d.ts

@@ -21,5 +21,10 @@ export interface RadioTileProps<T = ValueType> extends WithAsProps, Omit<React.H
     /** Callback function with value changed */
     onChange?: (value?: T, event?: React.ChangeEvent<HTMLInputElement>) => void;
 }
+/**
+ * A series of selectable tile components that behave like Radio.
+ * @version 5.35.0
+ * @see https://rsuitejs.com/components/radio-tile/
+ */
 declare const RadioTile: React.ForwardRefExoticComponent<RadioTileProps<ValueType> & React.RefAttributes<unknown>>;
 export default RadioTile;

package/cjs/RadioTile/RadioTile.js

@@ -14,6 +14,11 @@ var _Stack = _interopRequireDefault(require("../Stack"));
 var _RadioTileGroup = require("../RadioTileGroup/RadioTileGroup");
 var _utils = require("../utils");
 var _useUniqueId = _interopRequireDefault(require("../utils/useUniqueId"));
+/**
+ * A series of selectable tile components that behave like Radio.
+ * @version 5.35.0
+ * @see https://rsuitejs.com/components/radio-tile/
+ */
 var RadioTile = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _useContext = (0, _react.useContext)(_RadioTileGroup.RadioTileContext),
     groupValue = _useContext.value,

package/cjs/RangeSlider/RangeSlider.js

@@ -36,6 +36,7 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     progress = _props$progress === void 0 ? true : _props$progress,
     vertical = props.vertical,
     disabled = props.disabled,
+    readOnly = props.readOnly,
     _props$classPrefix = props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'slider' : _props$classPrefix,
     _props$min = props.min,
@@ -55,7 +56,7 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     renderMark = props.renderMark,
     onChange = props.onChange,
     onChangeCommitted = props.onChangeCommitted,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(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"]);
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["aria-label", "aria-labelledby", "aria-valuetext", "as", "barClassName", "className", "constraint", "defaultValue", "graduated", "progress", "vertical", "disabled", "readOnly", "classPrefix", "min", "max", "step", "value", "handleClassName", "handleStyle", "handleTitle", "tooltip", "getAriaValueText", "renderTooltip", "renderMark", "onChange", "onChangeCommitted"]);
   var barRef = (0, _react.useRef)(null);
 
   // Define the parameter position of the handle
@@ -168,6 +169,9 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
    * Callback function that is fired when the mousemove is triggered
    */
   var handleDragMove = (0, _utils.useEventCallback)(function (event, dataset) {
+    if (disabled || readOnly) {
+      return;
+    }
     var nextValue = getNextValue(event, dataset);
     if (isRangeMatchingConstraint(nextValue)) {
       setValue(nextValue);
@@ -179,12 +183,15 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
    * Callback function that is fired when the mouseup is triggered
    */
   var handleChangeCommitted = (0, _react.useCallback)(function (event, dataset) {
+    if (disabled || readOnly) {
+      return;
+    }
     var nextValue = getNextValue(event, dataset);
     if (isRangeMatchingConstraint(nextValue)) {
       setValue(nextValue);
       onChangeCommitted === null || onChangeCommitted === void 0 ? void 0 : onChangeCommitted(nextValue, event);
     }
-  }, [getNextValue, onChangeCommitted, isRangeMatchingConstraint, setValue]);
+  }, [disabled, readOnly, getNextValue, isRangeMatchingConstraint, setValue, onChangeCommitted]);
   var handleKeyDown = (0, _react.useCallback)(function (event) {
     var _event$target;
     var _event$target$dataset = (_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target['dataset'],
@@ -225,8 +232,8 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
     }
   }, [max, min, onChange, rtl, isRangeMatchingConstraint, setValue, step, value]);
-  var handleClick = (0, _react.useCallback)(function (event) {
-    if (disabled) {
+  var handleBarClick = (0, _react.useCallback)(function (event) {
+    if (disabled || readOnly) {
       return;
     }
     var start = value[0],
@@ -245,8 +252,9 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     if (isRangeMatchingConstraint(nextValue)) {
       setValue(nextValue);
       onChange === null || onChange === void 0 ? void 0 : onChange(nextValue, event);
+      onChangeCommitted === null || onChangeCommitted === void 0 ? void 0 : onChangeCommitted(nextValue, event);
     }
-  }, [disabled, getValidValue, getValueByPosition, isRangeMatchingConstraint, onChange, setValue, value]);
+  }, [disabled, readOnly, getValidValue, getValueByPosition, isRangeMatchingConstraint, onChange, onChangeCommitted, setValue, value]);
   var handleProps = (0, _react.useMemo)(function () {
     return [{
       value: value[0],
@@ -287,7 +295,7 @@ var RangeSlider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: merge(barClassName, prefix('bar')),
     ref: barRef,
-    onClick: handleClick
+    onClick: handleBarClick
   }, progress && /*#__PURE__*/_react.default.createElement(_ProgressBar.default, {
     rtl: rtl,
     vertical: vertical,

package/cjs/Slider/Slider.js

@@ -90,9 +90,9 @@ var Slider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var classes = merge(className, withClassPrefix({
     vertical: vertical,
     disabled: disabled,
-    readOnly: readOnly,
     graduated: graduated,
-    'with-mark': renderMark
+    'with-mark': renderMark,
+    readonly: readOnly
   }));
   var max = (0, _react.useMemo)(function () {
     return (0, _utils2.precisionMath)(Math.floor((maxProp - min) / step) * step + min);
@@ -166,6 +166,10 @@ var Slider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     var nextValue = getValidValue(getValueByPosition(event));
     onChangeCommitted === null || onChangeCommitted === void 0 ? void 0 : onChangeCommitted(nextValue, event);
   }, [disabled, getValidValue, getValueByPosition, onChangeCommitted, readOnly]);
+  var handleClickBar = (0, _react.useCallback)(function (event) {
+    handleChangeValue(event);
+    handleChangeCommitted(event);
+  }, [handleChangeCommitted, handleChangeValue]);
   var handleKeyDown = (0, _react.useCallback)(function (event) {
     var nextValue;
     var increaseKey = rtl ? 'ArrowLeft' : 'ArrowRight';
@@ -207,7 +211,7 @@ var Slider = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }), /*#__PURE__*/_react.default.createElement("div", {
     ref: barRef,
     className: merge(barClassName, prefix('bar')),
-    onClick: handleChangeValue
+    onClick: handleClickBar
   }, progress && /*#__PURE__*/_react.default.createElement(_ProgressBar.default, {
     rtl: rtl,
     vertical: vertical,