rsuite 5.51.0 → 5.52.0

package/esm/Navbar/NavbarDropdown.js

@@ -6,10 +6,10 @@ import PropTypes from 'prop-types';
 import castArray from 'lodash/castArray';
 import omit from 'lodash/omit';
 import { mergeRefs, PLACEMENT_8, placementPolyfill, useClassNames } from '../utils';
-import deprecatePropType from '../utils/deprecatePropType';
+import { deprecatePropType, oneOf } from '../internals/propTypes';
 import kebabCase from 'lodash/kebabCase';
 import { NavbarContext } from '.';
-import Disclosure from '../Disclosure/Disclosure';
+import Disclosure from '../internals/Disclosure/Disclosure';
 import NavDropdownItem from '../Nav/NavDropdownItem';
 import NavDropdownMenu from '../Nav/NavDropdownMenu';
 import NavbarDropdownToggle from './NavbarDropdownToggle';
@@ -92,8 +92,8 @@ NavbarDropdown.Menu = NavDropdownMenu;
 NavbarDropdown.displayName = 'Navbar.Dropdown';
 NavbarDropdown.propTypes = {
   classPrefix: PropTypes.string,
-  trigger: PropTypes.oneOfType([PropTypes.array, PropTypes.oneOf(['click', 'hover', 'contextMenu'])]),
-  placement: PropTypes.oneOf(PLACEMENT_8),
+  trigger: PropTypes.oneOfType([PropTypes.array, oneOf(['click', 'hover', 'contextMenu'])]),
+  placement: oneOf(PLACEMENT_8),
   title: PropTypes.node,
   disabled: PropTypes.bool,
   icon: PropTypes.node,

package/esm/Navbar/NavbarDropdownItem.js

@@ -3,13 +3,14 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import React, { useCallback, useContext } from 'react';
 import PropTypes from 'prop-types';
-import deprecatePropType from '../utils/deprecatePropType';
+import { deprecatePropType, oneOf } from '../internals/propTypes';
 import isNil from 'lodash/isNil';
 import { createChainedFunction, shallowEqual, useClassNames } from '../utils';
 import { NavbarContext } from './Navbar';
-import DisclosureContext, { DisclosureActionTypes } from '../Disclosure/DisclosureContext';
+import DisclosureContext, { DisclosureActionTypes } from '../internals/Disclosure/DisclosureContext';
 import { useRenderDropdownItem } from '../Dropdown/useRenderDropdownItem';
 import NavContext from '../Nav/NavContext';
+import classNames from 'classnames';
 /**
  * @private
  */
@@ -88,7 +89,7 @@ var NavbarDropdownItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, dataAttributes, restProps, {
     onClick: createChainedFunction(handleClickNavbarDropdownItem, restProps.onClick),
     children: /*#__PURE__*/React.createElement(React.Fragment, null, icon && /*#__PURE__*/React.cloneElement(icon, {
-      className: prefix('menu-icon')
+      className: classNames(prefix('menu-icon'), icon.props.className)
     }), children)
   }));
 });
@@ -97,7 +98,7 @@ NavbarDropdownItem.propTypes = {
   as: PropTypes.elementType,
   divider: PropTypes.bool,
   panel: PropTypes.bool,
-  trigger: PropTypes.oneOfType([PropTypes.array, PropTypes.oneOf(['click', 'hover'])]),
+  trigger: PropTypes.oneOfType([PropTypes.array, oneOf(['click', 'hover'])]),
   open: deprecatePropType(PropTypes.bool),
   active: PropTypes.bool,
   disabled: PropTypes.bool,

package/esm/Navbar/NavbarDropdownMenu.js

@@ -11,9 +11,9 @@ import AngleLeft from '@rsuite/icons/legacy/AngleLeft';
 import AngleRight from '@rsuite/icons/legacy/AngleRight';
 import { mergeRefs, useClassNames, useCustom } from '../utils';
 import { NavbarContext } from '.';
-import Disclosure from '../Disclosure';
+import Disclosure from '../internals/Disclosure';
 import NavContext from '../Nav/NavContext';
-import deprecatePropType from '../utils/deprecatePropType';
+import { deprecatePropType, oneOf } from '../internals/propTypes';
 /**
  * @private this component is not supposed to be used directly
  *          Instead it's rendered by a <Nav.Menu> within a <Navbar>
@@ -120,7 +120,7 @@ NavbarDropdownMenu.propTypes = {
   icon: PropTypes.any,
   classPrefix: PropTypes.string,
   pullLeft: deprecatePropType(PropTypes.bool, 'Use openDirection="start" instead.'),
-  openDirection: PropTypes.oneOf(['start', 'end']),
+  openDirection: oneOf(['start', 'end']),
   title: PropTypes.node,
   open: PropTypes.bool,
   eventKey: PropTypes.any,

package/esm/Navbar/NavbarDropdownToggle.js

@@ -6,6 +6,7 @@ import PropTypes from 'prop-types';
 import ArrowDownLineIcon from '@rsuite/icons/ArrowDownLine';
 import { useClassNames } from '../utils';
 import NavbarItem from './NavbarItem';
+import { oneOf } from '../internals/propTypes';
 /**
  * @private this component is not supposed to be used directly
  *          Instead it's rendered by a <Nav.Menu> call
@@ -48,6 +49,6 @@ NavbarDropdownToggle.propTypes = {
   noCaret: PropTypes.bool,
   as: PropTypes.elementType,
   renderToggle: PropTypes.func,
-  placement: PropTypes.oneOf(['bottomStart', 'bottomEnd', 'topStart', 'topEnd', 'leftStart', 'rightStart', 'leftEnd', 'rightEnd'])
+  placement: oneOf(['bottomStart', 'bottomEnd', 'topStart', 'topEnd', 'leftStart', 'rightStart', 'leftEnd', 'rightEnd'])
 };
 export default NavbarDropdownToggle;

package/esm/Navbar/NavbarItem.js

@@ -4,10 +4,11 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React, { useCallback, useContext } from 'react';
 import PropTypes from 'prop-types';
 import isNil from 'lodash/isNil';
-import Ripple from '../Ripple';
+import Ripple from '../internals/Ripple';
 import SafeAnchor from '../SafeAnchor';
 import { shallowEqual, useClassNames } from '../utils';
 import NavContext from '../Nav/NavContext';
+import classNames from 'classnames';
 /**
  * @private
  */
@@ -56,7 +57,7 @@ var NavbarItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onClick: handleClick,
     style: style
   }), icon && /*#__PURE__*/React.cloneElement(icon, {
-    className: prefix('icon')
+    className: classNames(prefix('icon'), icon.props.className)
   }), children, /*#__PURE__*/React.createElement(Ripple, null));
 });
 NavbarItem.displayName = 'Navbar.Item';

package/esm/Notification/Notification.js

@@ -3,10 +3,11 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 var _templateObject, _templateObject2;
-import React, { useCallback, useState, useContext } from 'react';
+import React, { useState, useContext } from 'react';
 import PropTypes from 'prop-types';
-import { useClassNames, useTimeout, MESSAGE_STATUS_ICONS, useIsMounted } from '../utils';
-import CloseButton from '../CloseButton';
+import { useClassNames, useTimeout, MESSAGE_STATUS_ICONS, useIsMounted, useEventCallback } from '../utils';
+import { oneOf } from '../internals/propTypes';
+import CloseButton from '../internals/CloseButton';
 import ToastContext from '../toaster/ToastContext';
 /**
  * The `Notification` component is used to display global messages and notifications.
@@ -39,7 +40,7 @@ var Notification = /*#__PURE__*/React.forwardRef(function (props, ref) {
     usedToaster = _useContext.usedToaster; // Timed close message
   var _useTimeout = useTimeout(onClose, duration, usedToaster && duration > 0),
     clear = _useTimeout.clear; // Click to trigger to close the message
-  var handleClose = useCallback(function (event) {
+  var handleClose = useEventCallback(function (event) {
     setDisplay('hiding');
     onClose === null || onClose === void 0 ? void 0 : onClose(event);
     clear();
@@ -48,8 +49,8 @@ var Notification = /*#__PURE__*/React.forwardRef(function (props, ref) {
         setDisplay('hide');
       }
     }, 1000);
-  }, [onClose, clear, isMounted]);
-  var renderHeader = useCallback(function () {
+  });
+  var renderHeader = function renderHeader() {
     if (!header) {
       return null;
     }
@@ -60,7 +61,7 @@ var Notification = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }, MESSAGE_STATUS_ICONS[type], header) : /*#__PURE__*/React.createElement("div", {
       className: prefix('title')
     }, header));
-  }, [header, type, prefix]);
+  };
   if (display === 'hide') {
     return null;
   }
@@ -88,7 +89,7 @@ Notification.propTypes = {
   closable: PropTypes.bool,
   classPrefix: PropTypes.string,
   className: PropTypes.string,
-  type: PropTypes.oneOf(['info', 'success', 'warning', 'error']),
+  type: oneOf(['info', 'success', 'warning', 'error']),
   onClose: PropTypes.func
 };
 export default Notification;

package/esm/Pagination/PaginationButton.js

@@ -3,7 +3,7 @@ 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 Ripple from '../Ripple';
+import Ripple from '../internals/Ripple';
 import { useClassNames, createChainedFunction } from '../utils';
 var PaginationButton = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$as = props.as,

package/esm/Panel/AccordionButton.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface AccordionButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
+    expanded?: boolean;
+    controlId?: string;
+    classPrefix?: string;
+    caretAs?: React.ElementType;
+    disabled?: boolean;
+}
+declare const AccordionButton: (props: AccordionButtonProps) => JSX.Element;
+export default AccordionButton;

package/esm/Panel/AccordionButton.js

@@ -0,0 +1,40 @@
+'use client';
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _templateObject;
+import React from 'react';
+import { Icon } from '@rsuite/icons';
+import AngleDownIcon from '@rsuite/icons/legacy/AngleDown';
+import { useClassNames } from '../utils';
+var AccordionButton = function AccordionButton(props) {
+  var _props$classPrefix = props.classPrefix,
+    classPrefix = _props$classPrefix === void 0 ? 'panel-btn' : _props$classPrefix,
+    expanded = props.expanded,
+    id = props.id,
+    className = props.className,
+    controlId = props.controlId,
+    children = props.children,
+    disabled = props.disabled,
+    _props$caretAs = props.caretAs,
+    caretAs = _props$caretAs === void 0 ? AngleDownIcon : _props$caretAs,
+    rest = _objectWithoutPropertiesLoose(props, ["classPrefix", "expanded", "id", "className", "controlId", "children", "disabled", "caretAs"]);
+  var _useClassNames = useClassNames(classPrefix),
+    prefix = _useClassNames.prefix,
+    withClassPrefix = _useClassNames.withClassPrefix;
+  return /*#__PURE__*/React.createElement("button", _extends({
+    id: id,
+    "aria-controls": controlId,
+    "aria-expanded": expanded,
+    "aria-disabled": disabled,
+    className: withClassPrefix(className),
+    disabled: disabled
+  }, rest), children, /*#__PURE__*/React.createElement(Icon, {
+    as: caretAs,
+    "aria-hidden": "true",
+    className: prefix(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["icon"]))),
+    rotate: expanded ? 180 : 0,
+    "data-testid": "caret icon"
+  }));
+};
+export default AccordionButton;

package/esm/Panel/Panel.d.ts

@@ -1,28 +1,36 @@
 import React from 'react';
 import { AnimationEventProps, RsRefForwardingComponent, WithAsProps } from '../@types/common';
 export interface PanelProps<T = string | number> extends WithAsProps, AnimationEventProps {
-    /** Whether it is a collapsible panel */
-    collapsible?: boolean;
     /** Show border */
     bordered?: boolean;
-    /** With shadow */
-    shaded?: boolean;
     /** Content area filled with containers */
     bodyFill?: boolean;
-    /** The head displays information. */
-    header?: React.ReactNode;
-    /** ID */
-    id?: string | number;
+    /** Whether it is a collapsible panel */
+    collapsible?: boolean;
+    /**
+     * The icon on the right side of the title.
+     */
+    caretAs?: React.ElementType;
     /** Expand then panel by default */
     defaultExpanded?: boolean;
+    /** Whether the panel is disabled */
+    disabled?: boolean;
     /** Expand then panel */
     expanded?: boolean;
     /** The event key corresponding to the panel. */
     eventKey?: T;
-    /** Role of header */
+    /** The head displays information. */
+    header?: React.ReactNode;
+    /** ID */
+    id?: string;
+    /**
+     * Role of header
+     */
     headerRole?: string;
     /** Role of Panel */
     panelRole?: string;
+    /** With shadow */
+    shaded?: boolean;
     /** callback function for the panel clicked */
     onSelect?: (eventKey: T | undefined, event: React.SyntheticEvent) => void;
 }

package/esm/Panel/Panel.js

@@ -1,13 +1,13 @@
 'use client';
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useCallback, useContext } from 'react';
+import React, { useContext, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import get from 'lodash/get';
-import AngleDownIcon from '@rsuite/icons/legacy/AngleDown';
 import Collapse from '../Animation/Collapse';
-import { useClassNames, useControlled } from '../utils';
+import { useClassNames, useControlled, useUniqueId, useEventCallback } from '../utils';
 import { PanelGroupContext } from '../PanelGroup';
+import AccordionButton from './AccordionButton';
 /**
  * The `Panel` component is used to display content that can be collapsed.
  * @see https://rsuitejs.com/components/panel
@@ -15,22 +15,24 @@ import { PanelGroupContext } from '../PanelGroup';
 var Panel = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,
+    bodyFill = props.bodyFill,
+    bordered = props.bordered,
     children = props.children,
     className = props.className,
     _props$classPrefix = props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'panel' : _props$classPrefix,
-    bodyFill = props.bodyFill,
-    bordered = props.bordered,
+    caretAs = props.caretAs,
     collapsibleProp = props.collapsible,
     defaultExpanded = props.defaultExpanded,
+    disabled = props.disabled,
     eventKey = props.eventKey,
     expandedProp = props.expanded,
     header = props.header,
-    headerRoleProp = props.headerRole,
+    headerRole = props.headerRole,
     _props$panelRole = props.panelRole,
     panelRole = _props$panelRole === void 0 ? 'region' : _props$panelRole,
     shaded = props.shaded,
-    id = props.id,
+    idProp = props.id,
     onEnter = props.onEnter,
     onEntered = props.onEntered,
     onEntering = props.onEntering,
@@ -38,7 +40,10 @@ var Panel = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onExited = props.onExited,
     onExiting = props.onExiting,
     onSelect = props.onSelect,
-    rest = _objectWithoutPropertiesLoose(props, ["as", "children", "className", "classPrefix", "bodyFill", "bordered", "collapsible", "defaultExpanded", "eventKey", "expanded", "header", "headerRole", "panelRole", "shaded", "id", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "onSelect"]);
+    rest = _objectWithoutPropertiesLoose(props, ["as", "bodyFill", "bordered", "children", "className", "classPrefix", "caretAs", "collapsible", "defaultExpanded", "disabled", "eventKey", "expanded", "header", "headerRole", "panelRole", "shaded", "id", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "onSelect"]);
+  var id = useUniqueId('rs-', idProp);
+  var panelId = id + "-panel";
+  var btnId = id + "-btn";
   var _useClassNames = useClassNames(classPrefix),
     merge = _useClassNames.merge,
     prefix = _useClassNames.prefix,
@@ -51,31 +56,33 @@ var Panel = /*#__PURE__*/React.forwardRef(function (props, ref) {
     expandedState = _useControlled[0],
     setExpanded = _useControlled[1];
   var collapsible = collapsibleProp;
-  var headerRole = headerRoleProp;
   var expanded = expandedState;
   if (accordion) {
     collapsible = true;
-    headerRole = 'button';
-
-    // Collapses all inactive panels.
+  }
+  if (collapsible) {
     if (typeof activeKey !== 'undefined' && activeKey !== eventKey) {
       expanded = false;
     }
   }
-  var handleSelect = useCallback(function (event) {
+  useEffect(function () {
+    if (accordion && typeof activeKey !== 'undefined') {
+      setExpanded(activeKey === eventKey);
+    }
+  }, [accordion, activeKey, eventKey, setExpanded]);
+  var handleSelect = useEventCallback(function (event) {
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(eventKey, event);
     onGroupSelect === null || onGroupSelect === void 0 ? void 0 : onGroupSelect(eventKey, event);
     setExpanded(!expanded);
-  }, [eventKey, expanded, onGroupSelect, onSelect, setExpanded]);
-  var renderBody = useCallback(function () {
+  });
+  var renderBody = useEventCallback(function (bodyProps) {
     var classes = prefix('body', {
       'body-fill': bodyFill
     });
-    return /*#__PURE__*/React.createElement("div", {
-      role: panelRole,
+    return /*#__PURE__*/React.createElement("div", _extends({}, bodyProps, {
       className: classes
-    }, children);
-  }, [bodyFill, children, panelRole, prefix]);
+    }), children);
+  });
   var renderCollapsibleBody = function renderCollapsibleBody() {
     return /*#__PURE__*/React.createElement(Collapse, {
       in: expanded,
@@ -89,42 +96,41 @@ var Panel = /*#__PURE__*/React.forwardRef(function (props, ref) {
       var className = transitionProps.className,
         rest = _objectWithoutPropertiesLoose(transitionProps, ["className"]);
       return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
-        id: id ? "" + id : null,
-        "aria-expanded": expanded,
         className: merge(className, prefix('collapse')),
         ref: ref
-      }), renderBody());
+      }), renderBody({
+        role: panelRole,
+        id: panelId,
+        'aria-labelledby': btnId
+      }));
     });
   };
   var renderHeading = function renderHeading() {
     if (!header) {
       return null;
     }
-    var panelTitleElement;
+    var headerElement;
     if (! /*#__PURE__*/React.isValidElement(header) || Array.isArray(header)) {
-      panelTitleElement = /*#__PURE__*/React.createElement("span", {
-        className: prefix('title'),
-        role: "presentation"
-      }, /*#__PURE__*/React.createElement("span", {
-        className: expanded ? undefined : 'collapsed'
-      }, header));
+      headerElement = /*#__PURE__*/React.createElement("span", {
+        className: prefix('title')
+      }, header);
     } else {
       var _className = merge(prefix('title'), get(header, 'props.className'));
-      panelTitleElement = /*#__PURE__*/React.cloneElement(header, {
+      headerElement = /*#__PURE__*/React.cloneElement(header, {
         className: _className
       });
     }
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React.createElement("h2", {
+      className: prefix('header')
+    }, collapsible ? /*#__PURE__*/React.createElement(AccordionButton, {
+      id: btnId,
       role: headerRole,
-      "aria-controls": collapsible && id ? "" + id : undefined,
-      "aria-expanded": expanded,
-      className: prefix('header'),
-      onClick: collapsible ? handleSelect : undefined,
-      tabIndex: -1
-    }, panelTitleElement, collapsible && /*#__PURE__*/React.createElement(AngleDownIcon, {
-      rotate: expanded ? 180 : 0,
-      "data-testid": "caret icon"
-    }));
+      caretAs: caretAs,
+      controlId: panelId,
+      disabled: disabled,
+      expanded: expanded,
+      onClick: handleSelect
+    }, headerElement) : headerElement);
   };
   var classes = merge(className, withClassPrefix({
     in: expanded,
@@ -135,7 +141,7 @@ var Panel = /*#__PURE__*/React.forwardRef(function (props, ref) {
   return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
     ref: ref,
     className: classes,
-    id: collapsible ? null : id
+    id: idProp
   }), renderHeading(), collapsible ? renderCollapsibleBody() : renderBody());
 });
 Panel.displayName = 'Panel';
@@ -148,7 +154,6 @@ Panel.propTypes = {
   defaultExpanded: PropTypes.bool,
   expanded: PropTypes.bool,
   eventKey: PropTypes.any,
-  headerRole: PropTypes.string,
   panelRole: PropTypes.string,
   classPrefix: PropTypes.string,
   children: PropTypes.node,

package/esm/PanelGroup/PanelGroup.js

@@ -1,9 +1,9 @@
 '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';
 export var PanelGroupContext = /*#__PURE__*/React.createContext({});
 
 /**
@@ -33,10 +33,10 @@ var PanelGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
     accordion: accordion,
     bordered: bordered
   }));
-  var handleSelect = useCallback(function (activeKey, event) {
+  var handleSelect = useEventCallback(function (activeKey, event) {
     setActiveKey(activeKey);
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(activeKey, event);
-  }, [onSelect, setActiveKey]);
+  });
   var contextValue = useMemo(function () {
     return {
       accordion: accordion,
@@ -46,7 +46,6 @@ var PanelGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, [accordion, activeKey, handleSelect]);
   return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
     ref: ref,
-    role: accordion ? 'tablist' : undefined,
     className: classes
   }), /*#__PURE__*/React.createElement(PanelGroupContext.Provider, {
     value: contextValue

package/esm/Placeholder/PlaceholderParagraph.js

@@ -4,6 +4,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames } from '../utils';
+import { oneOf } from '../internals/propTypes';
 /**
  * The `Placeholder.Paragraph` component is used to display the loading state of the block.
  * @see https://rsuitejs.com/components/placeholder
@@ -65,7 +66,7 @@ PlaceholderParagraph.propTypes = {
   rows: PropTypes.number,
   rowHeight: PropTypes.number,
   rowMargin: PropTypes.number,
-  graph: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['circle', 'square', 'image'])]),
+  graph: PropTypes.oneOfType([PropTypes.bool, oneOf(['circle', 'square', 'image'])]),
   active: PropTypes.bool
 };
 export default PlaceholderParagraph;

package/esm/Progress/ProgressCircle.js

@@ -4,6 +4,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React, { useCallback } from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames, PROGRESS_STATUS_ICON } from '../utils';
+import { oneOf } from '../internals/propTypes';
 /**
  * The `Progress.Circle` component is used to display the progress of current operation.
  * @see https://rsuitejs.com/components/progress/#circle
@@ -124,15 +125,15 @@ ProgressCircle.displayName = 'ProgressCircle';
 ProgressCircle.propTypes = {
   className: PropTypes.string,
   strokeColor: PropTypes.string,
-  strokeLinecap: PropTypes.oneOf(['butt', 'round', 'square']),
+  strokeLinecap: oneOf(['butt', 'round', 'square']),
   trailColor: PropTypes.string,
   percent: PropTypes.number,
   strokeWidth: PropTypes.number,
   trailWidth: PropTypes.number,
   gapDegree: PropTypes.number,
-  gapPosition: PropTypes.oneOf(['top', 'bottom', 'left', 'right']),
+  gapPosition: oneOf(['top', 'bottom', 'left', 'right']),
   showInfo: PropTypes.bool,
-  status: PropTypes.oneOf(['success', 'fail', 'active']),
+  status: oneOf(['success', 'fail', 'active']),
   classPrefix: PropTypes.string
 };
 export default ProgressCircle;

package/esm/Progress/ProgressLine.js

@@ -4,6 +4,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames, PROGRESS_STATUS_ICON } from '../utils';
+import { oneOf } from '../internals/propTypes';
 /**
  * The `Progress.Line` component is used to display the progress of current operation.
  * @see https://rsuitejs.com/components/progress/#line
@@ -74,6 +75,6 @@ ProgressLine.propTypes = {
   trailWidth: PropTypes.number,
   showInfo: PropTypes.bool,
   vertical: PropTypes.bool,
-  status: PropTypes.oneOf(['success', 'fail', 'active'])
+  status: oneOf(['success', 'fail', 'active'])
 };
 export default ProgressLine;

package/esm/Radio/Radio.js

@@ -4,7 +4,8 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React, { useCallback, useContext } from 'react';
 import PropTypes from 'prop-types';
 import { RadioContext } from '../RadioGroup/RadioGroup';
-import { useClassNames, useControlled, partitionHTMLProps, TypeChecker } from '../utils';
+import { useClassNames, useControlled, partitionHTMLProps } from '../utils';
+import { refType } from '../internals/propTypes';
 /**
  * The `Radio` component is a simple radio button.
  * @see https://rsuitejs.com/components/radio
@@ -122,7 +123,7 @@ Radio.propTypes = {
   className: PropTypes.string,
   classPrefix: PropTypes.string,
   value: PropTypes.any,
-  inputRef: TypeChecker.refType,
+  inputRef: refType,
   onChange: PropTypes.func,
   onClick: PropTypes.func,
   tabIndex: PropTypes.number

package/esm/RadioGroup/RadioGroup.js

@@ -4,7 +4,8 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React, { useCallback, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames, useControlled } from '../utils';
-import Plaintext from '../Plaintext';
+import { oneOf } from '../internals/propTypes';
+import Plaintext from '../internals/Plaintext';
 export var RadioContext = /*#__PURE__*/React.createContext({});
 
 /**
@@ -69,7 +70,7 @@ var RadioGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
 });
 RadioGroup.displayName = 'RadioGroup';
 RadioGroup.propTypes = {
-  appearance: PropTypes.oneOf(['default', 'picker']),
+  appearance: oneOf(['default', 'picker']),
   name: PropTypes.string,
   inline: PropTypes.bool,
   value: PropTypes.any,

package/esm/RangeSlider/RangeSlider.js

@@ -12,7 +12,7 @@ import ProgressBar from '../Slider/ProgressBar';
 import Handle from '../Slider/Handle';
 import Graduated from '../Slider/Graduated';
 import { precisionMath, checkValue } from '../Slider/utils';
-import { tupleType } from '../utils/propTypeChecker';
+import { tupleType } from '../internals/propTypes';
 var defaultDefaultValue = [0, 0];
 
 /**

package/esm/Rate/Rate.js

@@ -5,10 +5,11 @@ import React, { useCallback, useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import isNil from 'lodash/isNil';
 import Star from '@rsuite/icons/legacy/Star';
+import { oneOf } from '../internals/propTypes';
 import { useClassNames, useControlled, shallowEqualArray, SIZE, KEY_VALUES } from '../utils';
 import { transformValueToCharacterMap, transformCharacterMapToValue } from './utils';
 import Character from './Character';
-import Plaintext from '../Plaintext';
+import Plaintext from '../internals/Plaintext';
 /**
  * The `Rate` component is used for rating. It can be used to evaluate the quality of the content.
  * @see https://rsuitejs.com/components/rate/
@@ -156,7 +157,7 @@ Rate.propTypes = {
   max: PropTypes.number,
   renderCharacter: PropTypes.func,
   readOnly: PropTypes.bool,
-  size: PropTypes.oneOf(SIZE),
+  size: oneOf(SIZE),
   value: PropTypes.number,
   vertical: PropTypes.bool,
   onChange: PropTypes.func,

package/esm/SelectPicker/SelectPicker.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { PickerLocale } from '../locales';
-import { PickerHandle, PickerToggleProps } from '../Picker';
-import { ListProps } from '../Windowing';
+import { PickerHandle, PickerToggleProps } from '../internals/Picker';
+import { ListProps } from '../internals/Windowing';
 import { FormControlPickerProps, ItemDataType } from '../@types/common';
 export interface SelectProps<T> {
     /** Set group condition key in data */