rsuite 5.49.0 → 5.51.0

package/esm/Picker/{DropdownMenuItem.js → ListItem.js}

@@ -1,15 +1,17 @@
 'use client';
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useCallback } from 'react';
-import PropTypes from 'prop-types';
-import { useClassNames } from '../utils';
-var DropdownMenuItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
+import React from 'react';
+import { useClassNames, useEventCallback } from '../utils';
+import useCombobox from './hooks/useCombobox';
+var ListItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,
-    active = props.active,
+    _props$role = props.role,
+    role = _props$role === void 0 ? 'option' : _props$role,
     _props$classPrefix = props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'dropdown-menu-item' : _props$classPrefix,
+    active = props.active,
     children = props.children,
     className = props.className,
     disabled = props.disabled,
@@ -18,13 +20,15 @@ var DropdownMenuItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onKeyDown = props.onKeyDown,
     onSelect = props.onSelect,
     renderItem = props.renderItem,
-    rest = _objectWithoutPropertiesLoose(props, ["as", "active", "classPrefix", "children", "className", "disabled", "focus", "value", "onKeyDown", "onSelect", "renderItem"]);
-  var handleClick = useCallback(function (event) {
+    rest = _objectWithoutPropertiesLoose(props, ["as", "role", "classPrefix", "active", "children", "className", "disabled", "focus", "value", "onKeyDown", "onSelect", "renderItem"]);
+  var _useCombobox = useCombobox(),
+    id = _useCombobox.id;
+  var handleClick = useEventCallback(function (event) {
     event.preventDefault();
     if (!disabled) {
       onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, event);
     }
-  }, [onSelect, disabled, value]);
+  });
   var _useClassNames = useClassNames(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix;
   var classes = withClassPrefix({
@@ -33,9 +37,10 @@ var DropdownMenuItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     disabled: disabled
   });
   return /*#__PURE__*/React.createElement(Component, _extends({
-    role: "option",
+    role: role,
     "aria-selected": active,
     "aria-disabled": disabled,
+    id: id ? id + "-opt-" + value : undefined,
     "data-key": value
   }, rest, {
     ref: ref,
@@ -47,18 +52,5 @@ var DropdownMenuItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     className: classes
   }, renderItem ? renderItem(value) : children));
 });
-DropdownMenuItem.displayName = 'DropdownMenuItem';
-DropdownMenuItem.propTypes = {
-  classPrefix: PropTypes.string,
-  active: PropTypes.bool,
-  disabled: PropTypes.bool,
-  value: PropTypes.any,
-  onSelect: PropTypes.func,
-  onKeyDown: PropTypes.func,
-  focus: PropTypes.bool,
-  title: PropTypes.string,
-  className: PropTypes.string,
-  children: PropTypes.node,
-  as: PropTypes.elementType
-};
-export default DropdownMenuItem;
+ListItem.displayName = 'ListItem';
+export default ListItem;

package/esm/Picker/ListItemGroup.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { WithAsProps } from '../@types/common';
+export interface ListItemGroupProps extends WithAsProps, React.HTMLAttributes<HTMLDivElement> {
+}
+declare const ListItemGroup: React.ForwardRefExoticComponent<ListItemGroupProps & React.RefAttributes<HTMLDivElement>>;
+export default ListItemGroup;

package/esm/Picker/{DropdownMenuGroup.js → ListItemGroup.js}

@@ -4,10 +4,9 @@ import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTempla
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 var _templateObject, _templateObject2;
 import React from 'react';
-import PropTypes from 'prop-types';
 import { useClassNames } from '../utils';
 import ArrowDown from '@rsuite/icons/legacy/ArrowDown';
-var DropdownMenuGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
+var ListItemGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,
     _props$classPrefix = props.classPrefix,
@@ -33,10 +32,5 @@ var DropdownMenuGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
     className: prefix(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["caret"])))
   })));
 });
-DropdownMenuGroup.displayName = 'DropdownMenuGroup';
-DropdownMenuGroup.propTypes = {
-  classPrefix: PropTypes.string,
-  className: PropTypes.string,
-  children: PropTypes.node
-};
-export default DropdownMenuGroup;
+ListItemGroup.displayName = 'ListItemGroup';
+export default ListItemGroup;

package/esm/Picker/Listbox.d.ts

@@ -0,0 +1,35 @@
+import React from 'react';
+import { ListProps, ListHandle } from '../Windowing';
+import { StandardProps, ItemDataType } from '../@types/common';
+export interface ListboxProps<Multiple = false> extends StandardProps, Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {
+    classPrefix: string;
+    data?: ItemDataType[];
+    group?: boolean;
+    groupBy?: string;
+    disabledItemValues?: any[];
+    activeItemValues?: any[];
+    focusItemValue?: any;
+    maxHeight?: number;
+    valueKey?: string;
+    labelKey?: string;
+    className?: string;
+    style?: React.CSSProperties;
+    listItemAs: React.ElementType | string;
+    listItemClassPrefix?: string;
+    listItemProps?: any;
+    rowHeight?: number;
+    rowGroupHeight?: number;
+    virtualized?: boolean;
+    listProps?: Partial<ListProps>;
+    listRef?: React.Ref<ListHandle>;
+    /** Custom selected option */
+    renderMenuItem?: (itemLabel: React.ReactNode, item: any) => React.ReactNode;
+    renderMenuGroup?: (title: React.ReactNode, item: any) => React.ReactNode;
+    onSelect?: Multiple extends true ? (value: any, item: any, event: React.MouseEvent, checked: boolean) => void : Multiple extends false ? (value: any, item: any, event: React.MouseEvent) => void : any;
+    onGroupTitleClick?: (event: React.MouseEvent) => void;
+}
+export declare type ListboxComponent = React.ForwardRefExoticComponent<ListboxProps> & {
+    <Multiple = false>(props: ListboxProps<Multiple>): React.ReactElement | null;
+};
+declare const Listbox: ListboxComponent;
+export default Listbox;

package/esm/Picker/{DropdownMenu.js → Listbox.js}

@@ -1,10 +1,8 @@
 'use client';
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _get from "lodash/get";
 var _this = this;
-import React, { useRef, useState, useEffect, useCallback } from 'react';
-import PropTypes from 'prop-types';
+import React, { useRef, useState, useEffect } from 'react';
 import isUndefined from 'lodash/isUndefined';
 import isString from 'lodash/isString';
 import isNumber from 'lodash/isNumber';
@@ -13,13 +11,15 @@ import pickBy from 'lodash/pickBy';
 import getPosition from 'dom-lib/getPosition';
 import scrollTop from 'dom-lib/scrollTop';
 import getHeight from 'dom-lib/getHeight';
+import get from 'lodash/get';
 import classNames from 'classnames';
 import { List, AutoSizer, VariableSizeList } from '../Windowing';
 import shallowEqual from '../utils/shallowEqual';
-import { mergeRefs, useClassNames, useMount } from '../utils';
-import DropdownMenuGroup from './DropdownMenuGroup';
+import { mergeRefs, useClassNames, useMount, useEventCallback } from '../utils';
+import ListItemGroup from './ListItemGroup';
 import { KEY_GROUP, KEY_GROUP_TITLE } from '../utils/getDataGroupBy';
-var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
+import useCombobox from './hooks/useCombobox';
+var Listbox = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$data = props.data,
     data = _props$data === void 0 ? [] : _props$data,
     group = props.group,
@@ -42,9 +42,9 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
     className = props.className,
     style = props.style,
     focusItemValue = props.focusItemValue,
-    dropdownMenuItemClassPrefix = props.dropdownMenuItemClassPrefix,
-    DropdownMenuItem = props.dropdownMenuItemAs,
-    dropdownMenuItemProps = props.dropdownMenuItemProps,
+    listItemClassPrefix = props.listItemClassPrefix,
+    ListItem = props.listItemAs,
+    listItemProps = props.listItemProps,
     _props$rowHeight = props.rowHeight,
     rowHeight = _props$rowHeight === void 0 ? 36 : _props$rowHeight,
     _props$rowGroupHeight = props.rowGroupHeight,
@@ -53,7 +53,7 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
     renderMenuItem = props.renderMenuItem,
     onGroupTitleClick = props.onGroupTitleClick,
     onSelect = props.onSelect,
-    rest = _objectWithoutPropertiesLoose(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"]);
+    rest = _objectWithoutPropertiesLoose(props, ["data", "group", "groupBy", "maxHeight", "activeItemValues", "disabledItemValues", "classPrefix", "valueKey", "labelKey", "virtualized", "listProps", "listRef", "className", "style", "focusItemValue", "listItemClassPrefix", "listItemAs", "listItemProps", "rowHeight", "rowGroupHeight", "renderMenuGroup", "renderMenuItem", "onGroupTitleClick", "onSelect"]);
   var _useClassNames = useClassNames(classPrefix),
     withClassPrefix = _useClassNames.withClassPrefix,
     prefix = _useClassNames.prefix,
@@ -61,12 +61,17 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var classes = merge(className, withClassPrefix('items', {
     grouped: group
   }));
+  var _useCombobox = useCombobox(),
+    id = _useCombobox.id,
+    labelId = _useCombobox.labelId,
+    popupType = _useCombobox.popupType,
+    multiple = _useCombobox.multiple;
   var menuBodyContainerRef = useRef(null);
   var listRef = useRef(null);
   var _useState = useState([]),
     foldedGroupKeys = _useState[0],
     setFoldedGroupKeys = _useState[1];
-  var handleGroupTitleClick = useCallback(function (key, event) {
+  var handleGroupTitleClick = useEventCallback(function (key, event) {
     var nextGroupKeys = foldedGroupKeys.filter(function (item) {
       return item !== key;
     });
@@ -75,10 +80,10 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }
     setFoldedGroupKeys(nextGroupKeys);
     onGroupTitleClick === null || onGroupTitleClick === void 0 ? void 0 : onGroupTitleClick(event);
-  }, [onGroupTitleClick, foldedGroupKeys]);
-  var handleSelect = useCallback(function (item, value, event, checked) {
+  });
+  var handleSelect = useEventCallback(function (item, value, event, checked) {
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(value, item, event, checked);
-  }, [onSelect]);
+  });
   var getRowHeight = function getRowHeight(list, index) {
     var item = list[index];
     if (group && item[KEY_GROUP] && index !== 0) {
@@ -107,6 +112,24 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
       scrollTop(container, Math.max(0, position.top - sHeight + 32));
     }
   }, [focusItemValue, menuBodyContainerRef, prefix]);
+  var filteredItems = group ? data.filter(function (item) {
+    var _item$parent;
+    // Display group title items
+    if (item[KEY_GROUP]) return true;
+
+    // Display items under the unfolded group
+    // FIXME-Doma
+    // `groupBy` is bound to be string when `group` is true
+    // because `group` is actually redundant as a prop
+    // It could simply be derived from `groupBy` value
+    var groupValue = get(item, groupBy, '') || ( // FIXME-Doma
+    // Usage of `item.parent` is strongly discouraged
+    // It's only here for legacy support
+    // Remove once `item.parent` is completely removed across related components
+    (_item$parent = item.parent) === null || _item$parent === void 0 ? void 0 : _item$parent[KEY_GROUP_TITLE]);
+    return !foldedGroupKeys.includes(groupValue);
+  }) : data;
+  var rowCount = filteredItems.length;
   var renderItem = function renderItem(_ref) {
     var _ref$index = _ref.index,
       index = _ref$index === void 0 ? 0 : _ref$index,
@@ -124,13 +147,13 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var itemKey = isString(value) || isNumber(value) ? value : index;
 
     /**
-     * Render <DropdownMenuGroup>
+     * Render <ListboxGroup>
      * when if `group` is enabled
      */
     if (group && item[KEY_GROUP]) {
       var groupValue = item[KEY_GROUP_TITLE];
       // TODO: grouped options should be owned by group
-      return /*#__PURE__*/React.createElement(DropdownMenuGroup, {
+      return /*#__PURE__*/React.createElement(ListItemGroup, {
         style: style,
         classPrefix: 'picker-menu-group',
         className: classNames({
@@ -151,37 +174,21 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
       return shallowEqual(v, value);
     });
     var focus = !isUndefined(focusItemValue) && shallowEqual(focusItemValue, value);
-    return /*#__PURE__*/React.createElement(DropdownMenuItem, _extends({
+    return /*#__PURE__*/React.createElement(ListItem, _extends({
+      "aria-posinset": index + 1,
+      "aria-setsize": rowCount,
       style: style,
       key: itemKey,
       disabled: disabled,
       active: active,
       focus: focus,
       value: value,
-      classPrefix: dropdownMenuItemClassPrefix,
+      classPrefix: listItemClassPrefix,
       onSelect: handleSelect.bind(null, item)
-    }, pickBy(dropdownMenuItemProps, function (v) {
+    }, pickBy(listItemProps, function (v) {
       return v !== undefined;
     })), renderMenuItem ? renderMenuItem(label, item) : label);
   };
-  var filteredItems = group ? data.filter(function (item) {
-    var _item$parent;
-    // Display group title items
-    if (item[KEY_GROUP]) return true;
-
-    // Display items under the unfolded group
-    // FIXME-Doma
-    // `groupBy` is bound to be string when `group` is true
-    // because `group` is actually redundant as a prop
-    // It could simply be derived from `groupBy` value
-    var groupValue = _get(item, groupBy, '') || ( // FIXME-Doma
-    // Usage of `item.parent` is strongly discouraged
-    // It's only here for legacy support
-    // Remove once `item.parent` is completely removed across related components
-    (_item$parent = item.parent) === null || _item$parent === void 0 ? void 0 : _item$parent[KEY_GROUP_TITLE]);
-    return !foldedGroupKeys.includes(groupValue);
-  }) : data;
-  var rowCount = filteredItems.length;
   useMount(function () {
     var _listRef$current, _listRef$current$scro;
     var itemIndex = findIndex(filteredItems, function (item) {
@@ -190,7 +197,10 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
     (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : (_listRef$current$scro = _listRef$current.scrollToItem) === null || _listRef$current$scro === void 0 ? void 0 : _listRef$current$scro.call(_listRef$current, itemIndex);
   });
   return /*#__PURE__*/React.createElement("div", _extends({
-    role: "listbox"
+    role: "listbox",
+    id: id + "-" + popupType,
+    "aria-labelledby": labelId,
+    "aria-multiselectable": multiple
   }, rest, {
     className: classes,
     ref: mergeRefs(menuBodyContainerRef, ref),
@@ -220,29 +230,5 @@ var DropdownMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
     });
   }));
 });
-export var dropdownMenuPropTypes = {
-  classPrefix: PropTypes.string.isRequired,
-  className: PropTypes.string,
-  dropdownMenuItemAs: PropTypes.elementType.isRequired,
-  dropdownMenuItemClassPrefix: PropTypes.string,
-  data: PropTypes.array,
-  group: PropTypes.bool,
-  disabledItemValues: PropTypes.array,
-  activeItemValues: PropTypes.array,
-  focusItemValue: PropTypes.any,
-  maxHeight: PropTypes.number,
-  valueKey: PropTypes.string,
-  labelKey: PropTypes.string,
-  style: PropTypes.object,
-  renderMenuItem: PropTypes.func,
-  renderMenuGroup: PropTypes.func,
-  onSelect: PropTypes.func,
-  onGroupTitleClick: PropTypes.func,
-  virtualized: PropTypes.bool,
-  listProps: PropTypes.any,
-  rowHeight: PropTypes.number,
-  rowGroupHeight: PropTypes.number
-};
-DropdownMenu.displayName = 'DropdownMenu';
-DropdownMenu.propTypes = dropdownMenuPropTypes;
-export default DropdownMenu;
+Listbox.displayName = 'Listbox';
+export default Listbox;

package/esm/{DatePicker → Picker}/PickerIndicator.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 interface PickerIndicatorProps {
     loading?: boolean;
     caretAs?: React.ElementType | null;
-    onClose?: () => void;
+    onClose?: (event: React.MouseEvent<HTMLElement>) => void;
     showCleanButton?: boolean;
     as?: React.ElementType;
 }

package/esm/{DatePicker → Picker}/PickerIndicator.js

@@ -34,7 +34,8 @@ var PickerIndicator = function PickerIndicator(_ref) {
       });
     }
     return caretAs && /*#__PURE__*/React.createElement(Icon, {
-      as: caretAs
+      as: caretAs,
+      className: prefix('caret-icon')
     });
   };
   return /*#__PURE__*/React.createElement(Component, null, addon());

package/esm/{DatePicker → Picker}/PickerLabel.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 interface PickerLabelProps {
-    id: string;
+    id?: string;
     className?: string;
     children?: React.ReactNode;
     as?: React.ElementType;

package/esm/Picker/{PickerOverlay.d.ts → PickerPopup.d.ts}

@@ -1,12 +1,12 @@
 import React from 'react';
 import { WithAsProps, RsRefForwardingComponent } from '../@types/common';
 import { OverlayTriggerHandle } from '../Picker';
-export interface PickerOverlayProps extends WithAsProps {
+export interface PickerPopupProps extends WithAsProps {
     placement?: string;
     autoWidth?: boolean;
     children?: React.ReactNode;
     target?: React.RefObject<OverlayTriggerHandle>;
     onKeyDown?: (event: React.KeyboardEvent) => void;
 }
-declare const PickerOverlay: RsRefForwardingComponent<'div', PickerOverlayProps>;
-export default PickerOverlay;
+declare const PickerPopup: RsRefForwardingComponent<'div', PickerPopupProps>;
+export default PickerPopup;

package/esm/Picker/{PickerOverlay.js → PickerPopup.js}

@@ -5,14 +5,14 @@ import React, { useRef, useCallback, useEffect } from 'react';
 import omit from 'lodash/omit';
 import addStyle from 'dom-lib/addStyle';
 import getWidth from 'dom-lib/getWidth';
-import { getDOMNode, mergeRefs, useElementResize, useClassNames } from '../utils';
+import { getDOMNode, mergeRefs, useElementResize, useClassNames, useEventCallback } from '../utils';
 var omitProps = ['placement', 'arrowOffsetLeft', 'arrowOffsetTop', 'positionLeft', 'positionTop', 'getPositionInstance', 'getToggleInstance', 'autoWidth'];
 var resizePlacement = ['topStart', 'topEnd', 'leftEnd', 'rightEnd', 'auto', 'autoVerticalStart', 'autoVerticalEnd', 'autoHorizontalEnd'];
-var PickerOverlay = /*#__PURE__*/React.forwardRef(function (props, ref) {
+var PickerPopup = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,
     _props$classPrefix = props.classPrefix,
-    classPrefix = _props$classPrefix === void 0 ? 'picker-menu' : _props$classPrefix,
+    classPrefix = _props$classPrefix === void 0 ? 'picker-popup' : _props$classPrefix,
     autoWidth = props.autoWidth,
     className = props.className,
     _props$placement = props.placement,
@@ -20,12 +20,12 @@ var PickerOverlay = /*#__PURE__*/React.forwardRef(function (props, ref) {
     target = props.target,
     rest = _objectWithoutPropertiesLoose(props, ["as", "classPrefix", "autoWidth", "className", "placement", "target"]);
   var overlayRef = useRef(null);
-  var handleResize = useCallback(function () {
+  var handleResize = useEventCallback(function () {
     var instance = target === null || target === void 0 ? void 0 : target.current;
     if (instance && resizePlacement.includes(placement)) {
       instance.updatePosition();
     }
-  }, [target, placement]);
+  });
   useElementResize(useCallback(function () {
     return overlayRef.current;
   }, []), handleResize);
@@ -44,10 +44,12 @@ var PickerOverlay = /*#__PURE__*/React.forwardRef(function (props, ref) {
     withClassPrefix = _useClassNames.withClassPrefix,
     merge = _useClassNames.merge;
   var classes = merge(className, withClassPrefix());
-  return /*#__PURE__*/React.createElement(Component, _extends({}, omit(rest, omitProps), {
+  return /*#__PURE__*/React.createElement(Component, _extends({
+    "data-testid": "picker-popup"
+  }, omit(rest, omitProps), {
     ref: mergeRefs(overlayRef, ref),
     className: classes
   }));
 });
-PickerOverlay.displayName = 'PickerOverlay';
-export default PickerOverlay;
+PickerPopup.displayName = 'PickerPopup';
+export default PickerPopup;

package/esm/Picker/PickerToggle.d.ts

@@ -4,38 +4,33 @@ import { RsRefForwardingComponent, TypeAttributes } from '../@types/common';
 import { IconProps } from '@rsuite/icons/lib/Icon';
 declare type ValueType = string | number;
 export interface PickerToggleProps extends ToggleButtonProps {
-    value?: ValueType | ValueType[];
-    inputValue?: ValueType | ValueType[];
-    id?: string;
+    active?: boolean;
     hasValue?: boolean;
     cleanable?: boolean;
     caret?: boolean;
-    active?: boolean;
-    disabled?: boolean;
-    readOnly?: boolean;
-    plaintext?: boolean;
-    tabIndex?: number;
-    /** Whether to display an loading indicator on toggle button */
-    loading?: boolean;
-    editable?: boolean;
-    name?: string;
-    inputPlaceholder?: string;
-    inputMask?: (string | RegExp)[];
-    onInputChange?: (value: string, event: React.ChangeEvent) => void;
-    onInputPressEnter?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
-    onInputBackspace?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
-    onInputBlur?: (event: React.FocusEvent<HTMLElement>) => void;
-    onInputFocus?: (event: React.FocusEvent<HTMLElement>) => void;
-    placement?: TypeAttributes.Placement;
     /**
      * Custom caret component
      * @deprecated Use `caretAs` instead
      */
     caretComponent?: React.FC<IconProps>;
-    /** Custom caret component */
+    /**
+     * Custom caret component
+     */
     caretAs?: React.ElementType;
-    onClean?: (event: React.MouseEvent) => void;
+    disabled?: boolean;
+    placement?: TypeAttributes.Placement;
+    readOnly?: boolean;
+    plaintext?: boolean;
+    tabIndex?: number;
+    /**
+     * Whether to display an loading indicator on toggle button
+     */
+    loading?: boolean;
     label?: React.ReactNode;
+    name?: string;
+    inputValue?: ValueType | ValueType[];
+    focusItemValue?: ValueType | null;
+    onClean?: (event: React.MouseEvent) => void;
 }
 declare const PickerToggle: RsRefForwardingComponent<typeof ToggleButton, PickerToggleProps>;
 export default PickerToggle;