@carbon/react 1.40.0 → 1.41.0

package/lib/components/FormLabel/FormLabel.js

@@ -14,6 +14,8 @@ var PropTypes = require('prop-types');
 var React = require('react');
 var cx = require('classnames');
 var usePrefix = require('../../internal/usePrefix.js');
+require('../Text/index.js');
+var Text = require('../Text/Text.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -30,7 +32,8 @@ function FormLabel(_ref) {
   } = _ref;
   const prefix = usePrefix.usePrefix();
   const className = cx__default["default"](`${prefix}--label`, `${prefix}--label--no-margin`, customClassName);
-  return /*#__PURE__*/React__default["default"].createElement("label", _rollupPluginBabelHelpers["extends"]({
+  return /*#__PURE__*/React__default["default"].createElement(Text.Text, _rollupPluginBabelHelpers["extends"]({
+    as: "label",
     htmlFor: id,
     className: className
   }, rest), children);

package/lib/components/ListBox/ListBox.js

@@ -42,8 +42,8 @@ const ListBox = /*#__PURE__*/React__default["default"].forwardRef(function ListB
   let {
     children,
     className: containerClassName,
-    disabled,
-    type,
+    disabled = false,
+    type = 'default',
     size,
     invalid,
     invalidText,
@@ -98,7 +98,7 @@ ListBox.propTypes = {
   /**
    * Specify whether the ListBox is currently disabled
    */
-  disabled: PropTypes__default["default"].bool.isRequired,
+  disabled: PropTypes__default["default"].bool,
   /**
    * Specify whether the control is currently invalid
    */
@@ -124,7 +124,7 @@ ListBox.propTypes = {
    * Specify the "type" of the ListBox. Currently supports either `default` or
    * `inline` as an option.
    */
-  type: ListBoxPropTypes.ListBoxType.isRequired,
+  type: ListBoxPropTypes.ListBoxType,
   /**
    * Specify whether the control is currently in warning state
    */
@@ -134,9 +134,5 @@ ListBox.propTypes = {
    */
   warnText: PropTypes__default["default"].node
 };
-ListBox.defaultProps = {
-  disabled: false,
-  type: 'default'
-};
 
 exports["default"] = ListBox;

package/lib/components/ListBox/ListBoxMenuIcon.js

@@ -62,10 +62,7 @@ ListBoxMenuIcon.propTypes = {
    * icon. This function takes in an id defined in `translationIds` and should
    * return a string message for that given message id.
    */
-  translateWithId: PropTypes__default["default"].func.isRequired
-};
-ListBoxMenuIcon.defaultProps = {
-  translateWithId: defaultTranslateWithId
+  translateWithId: PropTypes__default["default"].func
 };
 
 exports["default"] = ListBoxMenuIcon;

package/lib/components/ListBox/ListBoxMenuItem.js

@@ -41,8 +41,8 @@ function useIsTruncated(ref) {
 const ListBoxMenuItem = /*#__PURE__*/React__default["default"].forwardRef(function ListBoxMenuItem(_ref, forwardedRef) {
   let {
     children,
-    isActive,
-    isHighlighted,
+    isActive = false,
+    isHighlighted = false,
     title,
     ...rest
   } = _ref;
@@ -75,19 +75,15 @@ ListBoxMenuItem.propTypes = {
   /**
    * Specify whether the current menu item is "active".
    */
-  isActive: PropTypes__default["default"].bool.isRequired,
+  isActive: PropTypes__default["default"].bool,
   /**
    * Specify whether the current menu item is "highlighted".
    */
-  isHighlighted: PropTypes__default["default"].bool.isRequired,
+  isHighlighted: PropTypes__default["default"].bool,
   /**
    * Provide an optional tooltip for the ListBoxMenuItem
    */
   title: PropTypes__default["default"].string
 };
-ListBoxMenuItem.defaultProps = {
-  isActive: false,
-  isHighlighted: false
-};
 
 exports["default"] = ListBoxMenuItem;

package/lib/components/ListBox/ListBoxSelection.d.ts

@@ -35,17 +35,17 @@ export interface ListBoxSelectionProps {
      * icon. This function takes in an id defined in `translationIds` and should
      * return a string message for that given message id.
      */
-    translateWithId(messageId: string, args?: Record<string, unknown>): string;
+    translateWithId?(messageId: string, args?: Record<string, unknown>): string;
 }
 export type ListBoxSelectionComponent = React.FC<ListBoxSelectionProps>;
+export declare const translationIds: {
+    'clear.all': string;
+    'clear.selection': string;
+};
 /**
  * `ListBoxSelection` is used to provide controls for clearing a selection, in
  * addition to conditionally rendering a badge if the control has more than one
  * selection.
  */
 declare const ListBoxSelection: ListBoxSelectionComponent;
-export declare const translationIds: {
-    'clear.all': string;
-    'clear.selection': string;
-};
 export default ListBoxSelection;

package/lib/components/ListBox/ListBoxSelection.js

@@ -22,6 +22,16 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
 var _Close, _Close2;
+const translationIds = {
+  'clear.all': 'clear.all',
+  'clear.selection': 'clear.selection'
+};
+const defaultTranslations = {
+  [translationIds['clear.all']]: 'Clear all selected items',
+  [translationIds['clear.selection']]: 'Clear selected item'
+};
+const defaultTranslateWithId = id => defaultTranslations[id];
+
 /**
  * `ListBoxSelection` is used to provide controls for clearing a selection, in
  * addition to conditionally rendering a badge if the control has more than one
@@ -31,7 +41,7 @@ const ListBoxSelection = _ref => {
   let {
     clearSelection,
     selectionCount,
-    translateWithId: t,
+    translateWithId: t = defaultTranslateWithId,
     disabled,
     onClearSelection,
     readOnly
@@ -79,14 +89,6 @@ const ListBoxSelection = _ref => {
     title: description
   }, selectionCount, _Close2 || (_Close2 = /*#__PURE__*/React__default["default"].createElement(iconsReact.Close, null)));
 };
-const translationIds = {
-  'clear.all': 'clear.all',
-  'clear.selection': 'clear.selection'
-};
-const defaultTranslations = {
-  [translationIds['clear.all']]: 'Clear all selected items',
-  [translationIds['clear.selection']]: 'Clear selected item'
-};
 ListBoxSelection.propTypes = {
   /**
    * Specify a function to be invoked when a user interacts with the clear
@@ -116,10 +118,7 @@ ListBoxSelection.propTypes = {
    * icon. This function takes in an id defined in `translationIds` and should
    * return a string message for that given message id.
    */
-  translateWithId: PropTypes__default["default"].func.isRequired
-};
-ListBoxSelection.defaultProps = {
-  translateWithId: id => defaultTranslations[id]
+  translateWithId: PropTypes__default["default"].func
 };
 
 exports["default"] = ListBoxSelection;

package/lib/components/ListBox/next/ListBoxSelection.js

@@ -29,11 +29,21 @@ var _Close, _Close2;
  * addition to conditionally rendering a badge if the control has more than one
  * selection.
  */
+
+const translationIds = {
+  'clear.all': 'clear.all',
+  'clear.selection': 'clear.selection'
+};
+const defaultTranslations = {
+  [translationIds['clear.all']]: 'Clear all selected items',
+  [translationIds['clear.selection']]: 'Clear selected item'
+};
+const defaultTranslateWithId = id => defaultTranslations[id];
 function ListBoxSelection(_ref) {
   let {
     clearSelection,
     selectionCount,
-    translateWithId: t,
+    translateWithId: t = defaultTranslateWithId,
     disabled,
     onClearSelection,
     ...rest
@@ -83,14 +93,6 @@ function ListBoxSelection(_ref) {
     type: "button"
   }), _Close2 || (_Close2 = /*#__PURE__*/React__default["default"].createElement(iconsReact.Close, null)));
 }
-const translationIds = {
-  'clear.all': 'clear.all',
-  'clear.selection': 'clear.selection'
-};
-const defaultTranslations = {
-  [translationIds['clear.all']]: 'Clear all selected items',
-  [translationIds['clear.selection']]: 'Clear selected item'
-};
 ListBoxSelection.propTypes = {
   /**
    * Specify a function to be invoked when a user interacts with the clear
@@ -126,10 +128,7 @@ ListBoxSelection.propTypes = {
    * icon. This function takes in an id defined in `translationIds` and should
    * return a string message for that given message id.
    */
-  translateWithId: PropTypes__default["default"].func.isRequired
-};
-ListBoxSelection.defaultProps = {
-  translateWithId: id => defaultTranslations[id]
+  translateWithId: PropTypes__default["default"].func
 };
 
 exports["default"] = ListBoxSelection;

package/lib/components/ListBox/next/ListBoxTrigger.js

@@ -31,6 +31,7 @@ const defaultTranslations = {
   [translationIds['close.menu']]: 'Close',
   [translationIds['open.menu']]: 'Open'
 };
+const defaultTranslateWithId = id => defaultTranslations[id];
 
 /**
  * `ListBoxTrigger` is used to orient the icon up or down depending on the
@@ -39,7 +40,7 @@ const defaultTranslations = {
 const ListBoxTrigger = _ref => {
   let {
     isOpen,
-    translateWithId: t,
+    translateWithId: t = defaultTranslateWithId,
     ...rest
   } = _ref;
   const prefix = usePrefix.usePrefix();
@@ -67,10 +68,7 @@ ListBoxTrigger.propTypes = {
    * icon. This function takes in an id defined in `translationIds` and should
    * return a string message for that given message id.
    */
-  translateWithId: PropTypes__default["default"].func.isRequired
-};
-ListBoxTrigger.defaultProps = {
-  translateWithId: id => defaultTranslations[id]
+  translateWithId: PropTypes__default["default"].func
 };
 var ListBoxTrigger$1 = ListBoxTrigger;
 

package/lib/components/ListItem/ListItem.d.ts

@@ -7,7 +7,7 @@
 import PropTypes from 'prop-types';
 import { type ComponentProps } from 'react';
 type ListItemProps = ComponentProps<'li'>;
-declare function ListItem({ className, ...other }: ListItemProps): JSX.Element;
+declare function ListItem({ className, children, ...other }: ListItemProps): JSX.Element;
 declare namespace ListItem {
     var propTypes: {
         /**

package/lib/components/ListItem/ListItem.js

@@ -14,6 +14,8 @@ var PropTypes = require('prop-types');
 var React = require('react');
 var cx = require('classnames');
 var usePrefix = require('../../internal/usePrefix.js');
+require('../Text/index.js');
+var Text = require('../Text/Text.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -24,13 +26,15 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 function ListItem(_ref) {
   let {
     className,
+    children,
     ...other
   } = _ref;
   const prefix = usePrefix.usePrefix();
   const classNames = cx__default["default"](`${prefix}--list__item`, className);
-  return /*#__PURE__*/React__default["default"].createElement("li", _rollupPluginBabelHelpers["extends"]({
+  return /*#__PURE__*/React__default["default"].createElement(Text.Text, _rollupPluginBabelHelpers["extends"]({
+    as: "li",
     className: classNames
-  }, other));
+  }, other), children);
 }
 ListItem.propTypes = {
   /**

package/lib/components/Menu/MenuItem.js

@@ -19,7 +19,9 @@ var useMergedRefs = require('../../internal/useMergedRefs.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var Menu = require('./Menu.js');
 var MenuContext = require('./MenuContext.js');
+require('../Text/index.js');
 var useLayoutDirection = require('../LayoutDirection/useLayoutDirection.js');
+var Text = require('../Text/Text.js');
 var match = require('../../internal/keyboard/match.js');
 var keys = require('../../internal/keyboard/keys.js');
 
@@ -166,7 +168,8 @@ const MenuItem = /*#__PURE__*/React__default["default"].forwardRef(function Menu
     onKeyDown: handleKeyDown
   }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: `${prefix}--menu-item__icon`
-  }, IconElement && /*#__PURE__*/React__default["default"].createElement(IconElement, null)), /*#__PURE__*/React__default["default"].createElement("div", {
+  }, IconElement && /*#__PURE__*/React__default["default"].createElement(IconElement, null)), /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "div",
     className: `${prefix}--menu-item__label`
   }, label), shortcut && !hasChildren && /*#__PURE__*/React__default["default"].createElement("div", {
     className: `${prefix}--menu-item__shortcut`

package/lib/components/Modal/Modal.d.ts

@@ -0,0 +1,137 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import { ReactAttr } from '../../types/common';
+export declare const ModalSizes: readonly ["xs", "sm", "md", "lg"];
+export type ModalSize = (typeof ModalSizes)[number];
+export interface ModalSecondaryButton {
+    buttonText?: string;
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+}
+export interface ModalProps extends ReactAttr<HTMLDivElement> {
+    /**
+     * Specify whether the Modal is displaying an alert, error or warning
+     * Should go hand in hand with the danger prop.
+     */
+    alert?: boolean;
+    /**
+     * Required props for the accessibility label of the header
+     */
+    'aria-label'?: string;
+    /**
+     * Provide the contents of your Modal
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be applied to the modal root node
+     */
+    className?: string;
+    /**
+     * Specify an label for the close button of the modal; defaults to close
+     */
+    closeButtonLabel?: string;
+    /**
+     * Specify whether the Modal is for dangerous actions
+     */
+    danger?: boolean;
+    /**
+     * Specify whether the modal contains scrolling content
+     */
+    hasScrollingContent?: boolean;
+    /**
+     * Specify the DOM element ID of the top-level node.
+     */
+    id?: string;
+    /**
+     * Specify whether or not the Modal content should have any inner padding.
+     */
+    isFullWidth?: boolean;
+    /**
+     * Provide a ref to return focus to once the modal is closed.
+     */
+    launcherButtonRef?: any;
+    /**
+     * Specify a label to be read by screen readers on the modal root node
+     */
+    modalAriaLabel?: string;
+    /**
+     * Specify the content of the modal header title.
+     */
+    modalHeading?: React.ReactNode;
+    /**
+     * Specify the content of the modal header label.
+     */
+    modalLabel?: React.ReactNode;
+    /**
+     * Specify a handler for keypresses.
+     * @deprecated this property is unused
+     */
+    onKeyDown?: React.KeyboardEventHandler<HTMLElement>;
+    /**
+     * Specify a handler for closing modal.
+     * The handler should care of closing modal, e.g. changing `open` prop.
+     */
+    onRequestClose?: React.ReactEventHandler<HTMLElement>;
+    /**
+     * Specify a handler for "submitting" modal.
+     * The handler should care of closing modal, e.g. changing `open` prop, if necessary.
+     */
+    onRequestSubmit?: React.ReactEventHandler<HTMLElement>;
+    /**
+     * Specify a handler for the secondary button.
+     * Useful if separate handler from `onRequestClose` is desirable
+     */
+    onSecondarySubmit?: React.ReactEventHandler<HTMLElement>;
+    /**
+     * Specify whether the Modal is currently open
+     */
+    open?: boolean;
+    /**
+     * Specify whether the modal should be button-less
+     */
+    passiveModal?: boolean;
+    /**
+     * Prevent closing on click outside of modal
+     */
+    preventCloseOnClickOutside?: boolean;
+    /**
+     * Specify whether the Button should be disabled, or not
+     */
+    primaryButtonDisabled?: boolean;
+    /**
+     * Specify the text for the primary button
+     */
+    primaryButtonText?: React.ReactNode;
+    /**
+     * Specify the text for the secondary button
+     */
+    secondaryButtonText?: React.ReactNode;
+    /**
+     * Specify an array of config objects for secondary buttons
+     */
+    secondaryButtons?: ModalSecondaryButton[];
+    /**
+     * Specify a CSS selector that matches the DOM element that should
+     * be focused when the Modal opens
+     */
+    selectorPrimaryFocus?: string;
+    /**
+     * Specify CSS selectors that match DOM elements working as floating menus.
+     * Focusing on those elements won't trigger "focus-wrap" behavior
+     */
+    selectorsFloatingMenus?: string[];
+    /**
+     * Specify if Enter key should be used as "submit" action
+     */
+    shouldSubmitOnEnter?: boolean;
+    /**
+     * Specify the size variant.
+     */
+    size?: ModalSize;
+}
+declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
+export default Modal;

package/lib/components/Modal/Modal.js

@@ -22,6 +22,9 @@ var requiredIfGivenPropIsTruthy = require('../../prop-types/requiredIfGivenPropI
 var wrapFocus = require('../../internal/wrapFocus.js');
 var setupGetInstanceId = require('../../tools/setupGetInstanceId.js');
 var usePrefix = require('../../internal/usePrefix.js');
+var noopFn = require('../../internal/noopFn.js');
+require('../Text/index.js');
+var Text = require('../Text/Text.js');
 var match = require('../../internal/keyboard/match.js');
 var keys = require('../../internal/keyboard/keys.js');
 
@@ -32,46 +35,43 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 const getInstanceId = setupGetInstanceId["default"]();
+const ModalSizes = ['xs', 'sm', 'md', 'lg'];
 const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_ref, ref) {
   let {
     'aria-label': ariaLabelProp,
     children,
     className,
-    modalHeading,
-    modalLabel,
+    modalHeading = '',
+    modalLabel = '',
     modalAriaLabel,
-    passiveModal,
+    passiveModal = false,
     secondaryButtonText,
     primaryButtonText,
     open,
-    onRequestClose,
-    onRequestSubmit,
+    onRequestClose = noopFn.noopFn,
+    onRequestSubmit = noopFn.noopFn,
     onSecondarySubmit,
-    primaryButtonDisabled,
+    primaryButtonDisabled = false,
     danger,
     alert,
     secondaryButtons,
-    selectorPrimaryFocus,
-    // eslint-disable-line
+    selectorPrimaryFocus = '[data-modal-primary-focus]',
     selectorsFloatingMenus,
-    // eslint-disable-line
     shouldSubmitOnEnter,
-    // eslint-disable-line
     size,
-    hasScrollingContent,
+    hasScrollingContent = false,
     closeButtonLabel,
-    preventCloseOnClickOutside,
-    // eslint-disable-line
+    preventCloseOnClickOutside = false,
     isFullWidth,
     launcherButtonRef,
     ...rest
   } = _ref;
   const prefix = usePrefix.usePrefix();
-  const button = React.useRef();
+  const button = React.useRef(null);
   const secondaryButton = React.useRef();
-  const innerModal = React.useRef();
-  const startTrap = React.useRef();
-  const endTrap = React.useRef();
+  const innerModal = React.useRef(null);
+  const startTrap = React.useRef(null);
+  const endTrap = React.useRef(null);
   const modalInstanceId = `modal-${getInstanceId()}`;
   const modalLabelId = `${prefix}--modal-header__label--${modalInstanceId}`;
   const modalHeadingId = `${prefix}--modal-header__heading--${modalInstanceId}`;
@@ -91,7 +91,8 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     }
   }
   function handleMousedown(evt) {
-    if (innerModal.current && !innerModal.current.contains(evt.target) && !wrapFocus.elementOrParentIsFloatingMenu(evt.target, selectorsFloatingMenus) && !preventCloseOnClickOutside) {
+    const target = evt.target;
+    if (innerModal.current && !innerModal.current.contains(target) && !wrapFocus.elementOrParentIsFloatingMenu(target, selectorsFloatingMenus) && !preventCloseOnClickOutside) {
       onRequestClose(evt);
     }
   }
@@ -124,9 +125,8 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
   const modalClasses = cx__default["default"](`${prefix}--modal`, {
     [`${prefix}--modal-tall`]: !passiveModal,
     'is-visible': open,
-    [`${prefix}--modal--danger`]: danger,
-    [className]: className
-  });
+    [`${prefix}--modal--danger`]: danger
+  }, className);
   const containerClasses = cx__default["default"](`${prefix}--modal-container`, {
     [`${prefix}--modal-container--${size}`]: size,
     [`${prefix}--modal-container--full-width`]: isFullWidth
@@ -137,7 +137,12 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
   const footerClasses = cx__default["default"](`${prefix}--modal-footer`, {
     [`${prefix}--modal-footer--three-button`]: Array.isArray(secondaryButtons) && secondaryButtons.length === 2
   });
-  const ariaLabel = modalLabel || ariaLabelProp || modalAriaLabel || modalHeading;
+  const asStringOrUndefined = node => {
+    return typeof node === 'string' ? node : undefined;
+  };
+  const modalLabelStr = asStringOrUndefined(modalLabel);
+  const modalHeadingStr = asStringOrUndefined(modalHeading);
+  const ariaLabel = modalLabelStr || ariaLabelProp || modalAriaLabel || modalHeadingStr;
   const getAriaLabelledBy = modalLabel ? modalLabelId : modalHeadingId;
   const hasScrollingContentProps = hasScrollingContent ? {
     tabIndex: 0,
@@ -159,7 +164,7 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     };
   }, [prefix]);
   React.useEffect(() => {
-    toggleClass["default"](document.body, `${prefix}--body--with-modal-open`, open);
+    toggleClass["default"](document.body, `${prefix}--body--with-modal-open`, open ?? false);
   }, [open, prefix]);
   React.useEffect(() => {
     if (!open && launcherButtonRef) {
@@ -179,7 +184,7 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     };
     const focusButton = focusContainerElement => {
       const target = initialFocus(focusContainerElement);
-      if (target) {
+      if (target !== null) {
         target.focus();
       }
     };
@@ -207,13 +212,15 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     className: containerClasses,
     "aria-label": ariaLabel,
     "aria-modal": "true",
-    tabIndex: "-1"
+    tabIndex: -1
   }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: `${prefix}--modal-header`
-  }, passiveModal && modalButton, modalLabel && /*#__PURE__*/React__default["default"].createElement("h2", {
+  }, passiveModal && modalButton, modalLabel && /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "h2",
     id: modalLabelId,
     className: `${prefix}--modal-header__label`
-  }, modalLabel), /*#__PURE__*/React__default["default"].createElement("h3", {
+  }, modalLabel), /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "h3",
     id: modalHeadingId,
     className: `${prefix}--modal-header__heading`
   }, modalHeading), !passiveModal && modalButton), /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
@@ -252,12 +259,12 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     ref: ref
   }), /*#__PURE__*/React__default["default"].createElement("span", {
     ref: startTrap,
-    tabIndex: "0",
+    tabIndex: 0,
     role: "link",
     className: `${prefix}--visually-hidden`
   }, "Focus sentinel"), modalBody, /*#__PURE__*/React__default["default"].createElement("span", {
     ref: endTrap,
-    tabIndex: "0",
+    tabIndex: 0,
     role: "link",
     className: `${prefix}--visually-hidden`
   }, "Focus sentinel"));
@@ -392,7 +399,7 @@ Modal.propTypes = {
    * Specify CSS selectors that match DOM elements working as floating menus.
    * Focusing on those elements won't trigger "focus-wrap" behavior
    */
-  selectorsFloatingMenus: PropTypes__default["default"].arrayOf(PropTypes__default["default"].string),
+  selectorsFloatingMenus: PropTypes__default["default"].arrayOf(PropTypes__default["default"].string.isRequired),
   /**
    * Specify if Enter key should be used as "submit" action
    */
@@ -400,20 +407,8 @@ Modal.propTypes = {
   /**
    * Specify the size variant.
    */
-  size: PropTypes__default["default"].oneOf(['xs', 'sm', 'md', 'lg'])
-};
-Modal.defaultProps = {
-  onRequestClose: () => {},
-  onRequestSubmit: () => {},
-  primaryButtonDisabled: false,
-  onKeyDown: () => {},
-  passiveModal: false,
-  modalHeading: '',
-  modalLabel: '',
-  preventCloseOnClickOutside: false,
-  selectorPrimaryFocus: '[data-modal-primary-focus]',
-  hasScrollingContent: false
+  size: PropTypes__default["default"].oneOf(ModalSizes)
 };
-var Modal$1 = Modal;
 
-exports["default"] = Modal$1;
+exports.ModalSizes = ModalSizes;
+exports["default"] = Modal;

package/lib/components/Modal/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import Modal from './Modal';
+export default Modal;
+export { Modal };