rsuite 5.0.0-beta.7 → 5.0.2

package/esm/InputNumber/InputNumber.js

@@ -75,19 +75,12 @@ function disableMinValue(value, min) {
   return false;
 }
 
-var defaultProps = {
-  as: InputGroup,
-  classPrefix: 'input-number',
-  min: -Infinity,
-  max: Infinity,
-  step: 1,
-  buttonAppearance: 'subtle',
-  scrollable: true
-};
 var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Component = props.as,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? InputGroup : _props$as,
       className = props.className,
-      classPrefix = props.classPrefix,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'input-number' : _props$classPrefix,
       disabled = props.disabled,
       readOnly = props.readOnly,
       plaintext = props.plaintext,
@@ -96,11 +89,16 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
       size = props.size,
       prefixElement = props.prefix,
       postfix = props.postfix,
-      step = props.step,
-      buttonAppearance = props.buttonAppearance,
-      min = props.min,
-      max = props.max,
-      scrollable = props.scrollable,
+      _props$step = props.step,
+      step = _props$step === void 0 ? 1 : _props$step,
+      _props$buttonAppearan = props.buttonAppearance,
+      buttonAppearance = _props$buttonAppearan === void 0 ? 'subtle' : _props$buttonAppearan,
+      _props$min = props.min,
+      min = _props$min === void 0 ? -Infinity : _props$min,
+      _props$max = props.max,
+      max = _props$max === void 0 ? Infinity : _props$max,
+      _props$scrollable = props.scrollable,
+      scrollable = _props$scrollable === void 0 ? true : _props$scrollable,
       onChange = props.onChange,
       onWheel = props.onWheel,
       restProps = _objectWithoutPropertiesLoose(props, ["as", "className", "classPrefix", "disabled", "readOnly", "plaintext", "value", "defaultValue", "size", "prefix", "postfix", "step", "buttonAppearance", "min", "max", "scrollable", "onChange", "onWheel"]);
@@ -246,7 +244,6 @@ var InputNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, /*#__PURE__*/React.createElement(AngleDownIcon, null))), postfix && /*#__PURE__*/React.createElement(InputGroupAddon, null, postfix));
 });
 InputNumber.displayName = 'InputNumber';
-InputNumber.defaultProps = defaultProps;
 InputNumber.propTypes = {
   className: PropTypes.string,
   classPrefix: PropTypes.string,

package/esm/InputPicker/InputAutosize.js

@@ -29,7 +29,8 @@ var copyStyles = function copyStyles(styles, node) {
  * @param placeholderRef
  */
 var useInputWidth = function useInputWidth(props, sizerRef, placeholderRef) {
-  var minWidth = props.minWidth,
+  var _props$minWidth = props.minWidth,
+      minWidth = _props$minWidth === void 0 ? 1 : _props$minWidth,
       placeholder = props.placeholder,
       value = props.value,
       onAutosize = props.onAutosize;
@@ -170,7 +171,4 @@ InputAutosize.propTypes = {
   value: PropTypes.any,
   onAutosize: PropTypes.func
 };
-InputAutosize.defaultProps = {
-  minWidth: 1
-};
 export default InputAutosize;

package/esm/InputPicker/InputPicker.js

@@ -24,51 +24,49 @@ import Tag from '../Tag';
 import InputAutosize from './InputAutosize';
 import InputSearch from './InputSearch';
 export var InputPickerContext = /*#__PURE__*/React.createContext({});
-var defaultProps = {
-  as: 'div',
-  appearance: 'default',
-  cleanable: true,
-  cacheData: [],
-  classPrefix: 'picker',
-  data: [],
-  disabledItemValues: [],
-  valueKey: 'value',
-  labelKey: 'label',
-  placement: 'bottomStart',
-  searchable: true,
-  menuAutoWidth: true,
-  menuMaxHeight: 320
-};
 var InputPicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _merge;
 
-  var Component = props.as,
-      cleanable = props.cleanable,
-      cacheData = props.cacheData,
-      classPrefix = props.classPrefix,
-      controlledData = props.data,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
+      _props$appearance = props.appearance,
+      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,
+      _props$cleanable = props.cleanable,
+      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,
+      _props$cacheData = props.cacheData,
+      cacheData = _props$cacheData === void 0 ? [] : _props$cacheData,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,
+      _props$data = props.data,
+      controlledData = _props$data === void 0 ? [] : _props$data,
       disabled = props.disabled,
       readOnly = props.readOnly,
       plaintext = props.plaintext,
       defaultValue = props.defaultValue,
       defaultOpen = props.defaultOpen,
-      disabledItemValues = props.disabledItemValues,
+      _props$disabledItemVa = props.disabledItemValues,
+      disabledItemValues = _props$disabledItemVa === void 0 ? [] : _props$disabledItemVa,
       overrideLocale = props.locale,
       toggleAs = props.toggleAs,
       style = props.style,
-      searchable = props.searchable,
+      _props$searchable = props.searchable,
+      searchable = _props$searchable === void 0 ? true : _props$searchable,
       controlledOpen = props.open,
       placeholder = props.placeholder,
       groupBy = props.groupBy,
       menuClassName = props.menuClassName,
       menuStyle = props.menuStyle,
-      menuAutoWidth = props.menuAutoWidth,
-      menuMaxHeight = props.menuMaxHeight,
+      _props$menuAutoWidth = props.menuAutoWidth,
+      menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,
+      _props$menuMaxHeight = props.menuMaxHeight,
+      menuMaxHeight = _props$menuMaxHeight === void 0 ? 320 : _props$menuMaxHeight,
       creatable = props.creatable,
       valueProp = props.value,
-      valueKey = props.valueKey,
+      _props$valueKey = props.valueKey,
+      valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,
       virtualized = props.virtualized,
-      labelKey = props.labelKey,
+      _props$labelKey = props.labelKey,
+      labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,
       listProps = props.listProps,
       id = props.id,
       tabIndex = props.tabIndex,
@@ -92,8 +90,9 @@ var InputPicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
       onBlur = props.onBlur,
       onFocus = props.onFocus,
       searchBy = props.searchBy,
-      placement = props.placement,
-      rest = _objectWithoutPropertiesLoose(props, ["as", "cleanable", "cacheData", "classPrefix", "data", "disabled", "readOnly", "plaintext", "defaultValue", "defaultOpen", "disabledItemValues", "locale", "toggleAs", "style", "searchable", "open", "placeholder", "groupBy", "menuClassName", "menuStyle", "menuAutoWidth", "menuMaxHeight", "creatable", "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"]);
+      _props$placement = props.placement,
+      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,
+      rest = _objectWithoutPropertiesLoose(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", "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 = useContext(InputPickerContext),
       multi = _useContext.multi,
@@ -642,8 +641,11 @@ var InputPicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var hasValue = multi ? !!(tagElements !== null && tagElements !== void 0 && tagElements.length) || hasMultiValue : isValid || hasSingleValue;
 
   var _usePickerClassName = usePickerClassName(_extends({}, props, {
+    classPrefix: classPrefix,
+    appearance: appearance,
     hasValue: hasValue,
-    name: 'input'
+    name: 'input',
+    cleanable: cleanable
   })),
       pickerClasses = _usePickerClassName[0],
       usedClassNamePropKeys = _usePickerClassName[1];
@@ -694,6 +696,7 @@ var InputPicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onKeyDown: onPickerKeyDown
   }, /*#__PURE__*/React.createElement(PickerToggle, _extends({}, omit(rest, [].concat(omitTriggerPropKeys, usedClassNamePropKeys)), {
     id: id,
+    appearance: appearance,
     readOnly: readOnly,
     plaintext: plaintext,
     ref: targetRef,
@@ -720,7 +723,6 @@ var InputPicker = /*#__PURE__*/React.forwardRef(function (props, ref) {
   })))));
 });
 InputPicker.displayName = 'InputPicker';
-InputPicker.defaultProps = defaultProps;
 InputPicker.propTypes = _extends({}, listPickerPropTypes, {
   locale: PropTypes.any,
   appearance: PropTypes.oneOf(['default', 'subtle']),

package/esm/List/List.js

@@ -6,25 +6,23 @@ import useSortHelper from './helper/useSortHelper';
 import { mergeRefs, useClassNames } from '../utils';
 import ListContext from './ListContext';
 import ListItem from './ListItem';
-var defaultProps = {
-  as: 'div',
-  classPrefix: 'list',
-  size: 'md',
-  autoScroll: true,
-  pressDelay: 0,
-  transitionDuration: 300
-};
 var List = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Component = props.as,
-      classPrefix = props.classPrefix,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'list' : _props$classPrefix,
       className = props.className,
       bordered = props.bordered,
       hover = props.hover,
-      size = props.size,
+      _props$size = props.size,
+      size = _props$size === void 0 ? 'md' : _props$size,
       sortable = props.sortable,
-      autoScroll = props.autoScroll,
-      pressDelay = props.pressDelay,
-      transitionDuration = props.transitionDuration,
+      _props$autoScroll = props.autoScroll,
+      autoScroll = _props$autoScroll === void 0 ? true : _props$autoScroll,
+      _props$pressDelay = props.pressDelay,
+      pressDelay = _props$pressDelay === void 0 ? 0 : _props$pressDelay,
+      _props$transitionDura = props.transitionDuration,
+      transitionDuration = _props$transitionDura === void 0 ? 300 : _props$transitionDura,
       children = props.children,
       onSort = props.onSort,
       onSortEnd = props.onSortEnd,
@@ -77,7 +75,6 @@ var List = /*#__PURE__*/React.forwardRef(function (props, ref) {
 });
 List.Item = ListItem;
 List.displayName = 'List';
-List.defaultProps = defaultProps;
 List.propTypes = {
   className: PropTypes.string,
   classPrefix: PropTypes.string,

package/esm/List/ListItem.js

@@ -5,17 +5,15 @@ import PropTypes from 'prop-types';
 import { useContext, useEffect, useRef } from 'react';
 import { mergeRefs, useClassNames } from '../utils';
 import ListContext from './ListContext';
-var defaultProps = {
-  as: 'div',
-  classPrefix: 'list-item',
-  collection: 0
-};
 var ListItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Component = props.as,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
       children = props.children,
       className = props.className,
-      classPrefix = props.classPrefix,
-      collection = props.collection,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'list-item' : _props$classPrefix,
+      _props$collection = props.collection,
+      collection = _props$collection === void 0 ? 0 : _props$collection,
       disabled = props.disabled,
       index = props.index,
       rest = _objectWithoutPropertiesLoose(props, ["as", "children", "className", "classPrefix", "collection", "disabled", "index"]);
@@ -57,7 +55,6 @@ var ListItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }), children);
 });
 ListItem.displayName = 'ListItem';
-ListItem.defaultProps = defaultProps;
 ListItem.propTypes = {
   index: PropTypes.number,
   collection: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

package/esm/Loader/Loader.js

@@ -3,18 +3,16 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames } from '../utils';
-var defaultProps = {
-  as: 'div',
-  classPrefix: 'loader',
-  speed: 'normal'
-};
 var Loader = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Component = props.as,
-      classPrefix = props.classPrefix,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'loader' : _props$classPrefix,
       className = props.className,
       inverse = props.inverse,
       backdrop = props.backdrop,
-      speed = props.speed,
+      _props$speed = props.speed,
+      speed = _props$speed === void 0 ? 'normal' : _props$speed,
       center = props.center,
       vertical = props.vertical,
       content = props.content,
@@ -51,7 +49,6 @@ var Loader = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, content)));
 });
 Loader.displayName = 'Loader';
-Loader.defaultProps = defaultProps;
 Loader.propTypes = {
   as: PropTypes.elementType,
   className: PropTypes.string,

package/esm/Menu/Menu.d.ts

@@ -29,7 +29,6 @@ export interface MenuHandle {
 declare function Menu(props: MenuProps & React.HTMLAttributes<HTMLUListElement>): React.ReactElement<React.HTMLAttributes<HTMLDivElement>, string | React.JSXElementConstructor<any>>;
 declare namespace Menu {
     var displayName: string;
-    var defaultProps: Partial<MenuProps>;
     var propTypes: {
         children: PropTypes.Validator<(...args: any[]) => any>;
     };

package/esm/Menu/Menu.js

@@ -9,9 +9,7 @@ import useFocus from '../utils/useFocus';
 import useClickOutside from '../utils/useClickOutside';
 import { isFocusLeaving } from '../utils/events';
 import { isFocusableElement } from '../utils/dom';
-var defaultProps = {
-  openMenuOn: ['click']
-};
+var defaultOpenMenuOn = ['click'];
 /**
  * Headless ARIA `menu`
  */
@@ -21,7 +19,8 @@ function Menu(props) {
 
   var disabled = props.disabled,
       children = props.children,
-      openMenuOn = props.openMenuOn,
+      _props$openMenuOn = props.openMenuOn,
+      openMenuOn = _props$openMenuOn === void 0 ? defaultOpenMenuOn : _props$openMenuOn,
       menuButtonText = props.menuButtonText,
       renderMenuButton = props.renderMenuButton,
       renderMenuPopup = props.renderMenuPopup,
@@ -368,7 +367,6 @@ function Menu(props) {
 }
 
 Menu.displayName = 'Menu';
-Menu.defaultProps = defaultProps;
 Menu.propTypes = {
   children: PropTypes.func.isRequired
 };

package/esm/Menu/MenuItem.js

@@ -22,7 +22,7 @@ function MenuItem(props) {
       dispatch = _ref[1]; // Whether this menuitem has focus (indicated by `aria-activedescendant` from parent menu)
 
 
-  var hasFocus = (menuState === null || menuState === void 0 ? void 0 : (_menuState$items$menu = menuState.items[menuState === null || menuState === void 0 ? void 0 : menuState.activeItemIndex]) === null || _menuState$items$menu === void 0 ? void 0 : _menuState$items$menu.element) === menuitemRef.current;
+  var hasFocus = (menuState === null || menuState === void 0 ? void 0 : (_menuState$items$menu = menuState.items[menuState === null || menuState === void 0 ? void 0 : menuState.activeItemIndex]) === null || _menuState$items$menu === void 0 ? void 0 : _menuState$items$menu.element) === menuitemRef.current && !!menuitemRef.current;
   var handleClick = useCallback(function (event) {
     if (disabled) {
       return;

package/esm/Message/Message.js

@@ -8,24 +8,22 @@ import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames, useTimeout, MESSAGE_STATUS_ICONS, STATUS } from '../utils';
 import CloseButton from '../CloseButton';
-var defaultProps = {
-  as: 'div',
-  classPrefix: 'message',
-  type: 'info',
-  duration: 2000
-};
 var Message = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _withClassPrefix;
 
-  var Component = props.as,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
       className = props.className,
-      classPrefix = props.classPrefix,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'message' : _props$classPrefix,
       children = props.children,
       closable = props.closable,
-      duration = props.duration,
+      _props$duration = props.duration,
+      duration = _props$duration === void 0 ? 2000 : _props$duration,
       full = props.full,
       header = props.header,
-      type = props.type,
+      _props$type = props.type,
+      type = _props$type === void 0 ? 'info' : _props$type,
       showIcon = props.showIcon,
       onClose = props.onClose,
       rest = _objectWithoutPropertiesLoose(props, ["as", "className", "classPrefix", "children", "closable", "duration", "full", "header", "type", "showIcon", "onClose"]);
@@ -80,7 +78,6 @@ var Message = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, children))));
 });
 Message.displayName = 'Message';
-Message.defaultProps = defaultProps;
 Message.propTypes = {
   type: PropTypes.oneOf(STATUS),
   className: PropTypes.string,

package/esm/Modal/Modal.d.ts

@@ -6,7 +6,7 @@ import ModalHeader from './ModalHeader';
 import ModalTitle from './ModalTitle';
 import ModalFooter from './ModalFooter';
 import { TypeAttributes, RsRefForwardingComponent } from '../@types/common';
-export interface ModalProps extends BaseModalProps {
+export interface ModalProps extends BaseModalProps, Pick<React.HTMLAttributes<HTMLElement>, 'role' | 'id' | 'aria-labelledby' | 'aria-describedby'> {
     /** A modal can have different sizes */
     size?: TypeAttributes.Size;
     /** Set the duration of the animation */
@@ -26,15 +26,6 @@ export interface ModalProps extends BaseModalProps {
     /** Render Modal as Drawer */
     drawer?: boolean;
 }
-export interface ModalContextProps {
-    /** Pass the close event callback to the header close button. */
-    onModalClose: (event: React.MouseEvent<Element, MouseEvent>) => void;
-    /** Pass the latest style to body. */
-    getBodyStyles?: () => React.CSSProperties;
-    /** Whether this Modal is a Drawer */
-    isDrawer: boolean;
-}
-export declare const ModalContext: React.Context<ModalContextProps>;
 interface ModalComponent extends RsRefForwardingComponent<'div', ModalProps> {
     Body: typeof ModalBody;
     Header: typeof ModalHeader;

package/esm/Modal/Modal.js

@@ -11,44 +11,48 @@ import BaseModal, { modalPropTypes } from '../Overlay/Modal';
 import Bounce from '../Animation/Bounce';
 import { useClassNames, mergeRefs, SIZE } from '../utils';
 import ModalDialog, { modalDialogPropTypes } from './ModalDialog';
+import { ModalContext } from './ModalContext';
 import ModalBody from './ModalBody';
 import ModalHeader from './ModalHeader';
 import ModalTitle from './ModalTitle';
 import ModalFooter from './ModalFooter';
 import helper from '../DOMHelper';
 import { useBodyStyles } from './utils';
-var defaultProps = {
-  classPrefix: 'modal',
-  size: 'sm',
-  animation: Bounce,
-  animationTimeout: 300,
-  dialogAs: ModalDialog,
-  backdrop: true,
-  overflow: true
-};
-export var ModalContext = /*#__PURE__*/React.createContext(null);
+import useUniqueId from '../utils/useUniqueId';
 var Modal = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var className = props.className,
       children = props.children,
-      classPrefix = props.classPrefix,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'modal' : _props$classPrefix,
       dialogClassName = props.dialogClassName,
       backdropClassName = props.backdropClassName,
-      backdrop = props.backdrop,
+      _props$backdrop = props.backdrop,
+      backdrop = _props$backdrop === void 0 ? true : _props$backdrop,
       dialogStyle = props.dialogStyle,
-      animation = props.animation,
+      _props$animation = props.animation,
+      animation = _props$animation === void 0 ? Bounce : _props$animation,
       open = props.open,
-      size = props.size,
+      _props$size = props.size,
+      size = _props$size === void 0 ? 'sm' : _props$size,
       full = props.full,
-      Dialog = props.dialogAs,
+      _props$dialogAs = props.dialogAs,
+      Dialog = _props$dialogAs === void 0 ? ModalDialog : _props$dialogAs,
       animationProps = props.animationProps,
-      animationTimeout = props.animationTimeout,
-      overflow = props.overflow,
+      _props$animationTimeo = props.animationTimeout,
+      animationTimeout = _props$animationTimeo === void 0 ? 300 : _props$animationTimeo,
+      _props$overflow = props.overflow,
+      overflow = _props$overflow === void 0 ? true : _props$overflow,
       drawer = props.drawer,
       onClose = props.onClose,
       onEntered = props.onEntered,
       onEntering = props.onEntering,
       onExited = props.onExited,
-      rest = _objectWithoutPropertiesLoose(props, ["className", "children", "classPrefix", "dialogClassName", "backdropClassName", "backdrop", "dialogStyle", "animation", "open", "size", "full", "dialogAs", "animationProps", "animationTimeout", "overflow", "drawer", "onClose", "onEntered", "onEntering", "onExited"]);
+      _props$role = props.role,
+      role = _props$role === void 0 ? 'dialog' : _props$role,
+      idProp = props.id,
+      ariaLabelledby = props['aria-labelledby'],
+      ariaDescribedby = props['aria-describedby'],
+      rest = _objectWithoutPropertiesLoose(props, ["className", "children", "classPrefix", "dialogClassName", "backdropClassName", "backdrop", "dialogStyle", "animation", "open", "size", "full", "dialogAs", "animationProps", "animationTimeout", "overflow", "drawer", "onClose", "onEntered", "onEntering", "onExited", "role", "id", "aria-labelledby", "aria-describedby"]);
 
   var inClass = {
     in: open && !animation
@@ -73,15 +77,17 @@ var Modal = /*#__PURE__*/React.forwardRef(function (props, ref) {
       onChangeBodyStyles = _useBodyStyles[1],
       onDestroyEvents = _useBodyStyles[2];
 
+  var dialogId = useUniqueId('dialog-', idProp);
   var modalContextValue = useMemo(function () {
     return {
+      dialogId: dialogId,
       onModalClose: onClose,
       getBodyStyles: function getBodyStyles() {
         return bodyStyles;
       },
       isDrawer: drawer
     };
-  }, [onClose, bodyStyles, drawer]);
+  }, [dialogId, onClose, bodyStyles, drawer]);
 
   var _useState = useState(false),
       shake = _useState[0],
@@ -141,7 +147,12 @@ var Modal = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var transitionClassName = transitionProps.className,
         transitionRest = _objectWithoutPropertiesLoose(transitionProps, ["className"]);
 
-    return /*#__PURE__*/React.createElement(Dialog, _extends({}, transitionRest, pick(rest, Object.keys(modalDialogPropTypes)), {
+    return /*#__PURE__*/React.createElement(Dialog, _extends({
+      role: role,
+      id: dialogId,
+      "aria-labelledby": ariaLabelledby !== null && ariaLabelledby !== void 0 ? ariaLabelledby : dialogId + "-title",
+      "aria-describedby": ariaDescribedby
+    }, transitionRest, pick(rest, Object.keys(modalDialogPropTypes)), {
       ref: mergeRefs(dialogRef, transitionRef),
       classPrefix: classPrefix,
       className: merge(classes, transitionClassName, prefix({
@@ -158,7 +169,6 @@ Modal.Title = ModalTitle;
 Modal.Footer = ModalFooter;
 Modal.Dialog = ModalDialog;
 Modal.displayName = 'Modal';
-Modal.defaultProps = defaultProps;
 Modal.propTypes = _extends({}, modalPropTypes, {
   animation: PropTypes.any,
   animationTimeout: PropTypes.number,

package/esm/Modal/ModalBody.js

@@ -3,16 +3,14 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useClassNames } from '../utils';
-import { ModalContext } from './Modal';
+import { ModalContext } from './ModalContext';
 import IconButton from '../IconButton';
 import Close from '@rsuite/icons/Close';
-var defaultProps = {
-  as: 'div',
-  classPrefix: 'modal-body'
-};
 var ModalBody = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Component = props.as,
-      classPrefix = props.classPrefix,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'modal-body' : _props$classPrefix,
       className = props.className,
       style = props.style,
       children = props.children,
@@ -42,7 +40,6 @@ var ModalBody = /*#__PURE__*/React.forwardRef(function (props, ref) {
   });
 });
 ModalBody.displayName = 'ModalBody';
-ModalBody.defaultProps = defaultProps;
 ModalBody.propTypes = {
   as: PropTypes.elementType,
   classPrefix: PropTypes.string,

package/esm/Modal/ModalContext.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface ModalContextProps {
+    /** ID of the dialog element */
+    dialogId: string;
+    /** Pass the close event callback to the header close button. */
+    onModalClose: (event: React.MouseEvent<Element, MouseEvent>) => void;
+    /** Pass the latest style to body. */
+    getBodyStyles?: () => React.CSSProperties;
+    /** Whether this Modal is a Drawer */
+    isDrawer: boolean;
+}
+export declare const ModalContext: React.Context<ModalContextProps>;

package/esm/Modal/ModalContext.js

@@ -0,0 +1,2 @@
+import React from 'react';
+export var ModalContext = /*#__PURE__*/React.createContext(null);

package/esm/Modal/ModalDialog.js

@@ -16,17 +16,15 @@ export var modalDialogPropTypes = {
   dialogStyle: PropTypes.object,
   children: PropTypes.node
 };
-var defaultProps = {
-  as: 'div',
-  classPrefix: 'modal'
-};
 var ModalDialog = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Component = props.as,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
       style = props.style,
       children = props.children,
       dialogClassName = props.dialogClassName,
       dialogStyle = props.dialogStyle,
-      classPrefix = props.classPrefix,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'modal' : _props$classPrefix,
       className = props.className,
       size = props.size,
       rest = _objectWithoutPropertiesLoose(props, ["as", "style", "children", "dialogClassName", "dialogStyle", "classPrefix", "className", "size"]);
@@ -42,7 +40,10 @@ var ModalDialog = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
   var classes = merge(className, withClassPrefix(size));
   var dialogClasses = merge(dialogClassName, prefix('dialog'));
-  return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
+  return /*#__PURE__*/React.createElement(Component, _extends({
+    role: "dialog",
+    "aria-modal": true
+  }, rest, {
     ref: ref,
     className: classes,
     style: modalStyle
@@ -55,6 +56,5 @@ var ModalDialog = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, children)));
 });
 ModalDialog.displayName = 'ModalDialog';
-ModalDialog.defaultProps = defaultProps;
 ModalDialog.propTypes = modalDialogPropTypes;
 export default ModalDialog;

package/esm/Modal/ModalHeader.js

@@ -3,20 +3,18 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
 import { createChainedFunction, useClassNames } from '../utils';
-import { ModalContext } from './Modal';
+import { ModalContext } from './ModalContext';
 import CloseButton from '../CloseButton';
 import Close from '@rsuite/icons/Close';
 import IconButton from '../IconButton';
-var defaultProps = {
-  as: 'div',
-  closeButton: true,
-  classPrefix: 'modal-header'
-};
 var ModalHeader = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Component = props.as,
-      classPrefix = props.classPrefix,
+  var _props$as = props.as,
+      Component = _props$as === void 0 ? 'div' : _props$as,
+      _props$classPrefix = props.classPrefix,
+      classPrefix = _props$classPrefix === void 0 ? 'modal-header' : _props$classPrefix,
       className = props.className,
-      closeButton = props.closeButton,
+      _props$closeButton = props.closeButton,
+      closeButton = _props$closeButton === void 0 ? true : _props$closeButton,
       children = props.children,
       onClose = props.onClose,
       rest = _objectWithoutPropertiesLoose(props, ["as", "classPrefix", "className", "closeButton", "children", "onClose"]);
@@ -44,7 +42,6 @@ var ModalHeader = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }), closeButton && buttonElement, children);
 });
 ModalHeader.displayName = 'ModalHeader';
-ModalHeader.defaultProps = defaultProps;
 ModalHeader.propTypes = {
   as: PropTypes.elementType,
   classPrefix: PropTypes.string,