@carbon/react 1.31.2 → 1.32.0-rc.0

package/es/components/ContentSwitcher/ContentSwitcher.d.ts

@@ -0,0 +1,109 @@
+/**
+ * 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 PropTypes from 'prop-types';
+import React, { HTMLAttributes, ReactElement } from 'react';
+interface SwitchEventHandlersParams {
+    index?: number;
+    name?: string | number;
+    text?: string;
+    key?: string | number;
+}
+export interface ContentSwitcherProps extends Omit<HTMLAttributes<HTMLElement>, 'onChange'> {
+    /**
+     * Pass in Switch components to be rendered in the ContentSwitcher
+     */
+    children?: ReactElement[];
+    /**
+     * Specify an optional className to be added to the container node
+     */
+    className?: string;
+    /**
+     * `true` to use the light version.
+     *
+     * @deprecated The `light` prop for `ContentSwitcher` has
+     *     been deprecated in favor of the new `Layer` component. It will be removed in the next major release.
+     */
+    light?: boolean;
+    /**
+     * Specify an `onChange` handler that is called whenever the ContentSwitcher
+     * changes which item is selected
+     */
+    onChange: (params: SwitchEventHandlersParams) => void;
+    /**
+     * Specify a selected index for the initially selected content
+     */
+    selectedIndex: number;
+    /**
+     * Choose whether or not to automatically change selection on focus
+     */
+    selectionMode: 'automatic' | 'manual';
+    /**
+     * Specify the size of the Content Switcher. Currently supports either `sm`, 'md' (default) or 'lg` as an option.
+     */
+    size: 'sm' | 'md' | 'lg';
+}
+interface ContentSwitcherState {
+    selectedIndex?: number;
+}
+export default class ContentSwitcher extends React.Component<ContentSwitcherProps, ContentSwitcherState> {
+    /**
+     * The DOM references of child `<Switch>`.
+     * @type {Array<Element>}
+     * @private
+     */
+    _switchRefs: HTMLButtonElement[];
+    state: {
+        selectedIndex: undefined;
+    };
+    static propTypes: {
+        /**
+         * Pass in Switch components to be rendered in the ContentSwitcher
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify an optional className to be added to the container node
+         */
+        className: PropTypes.Requireable<string>;
+        /**
+         * `true` to use the light variant.
+         */
+        light: (props: any, propName: any, componentName: any, ...rest: any[]) => any;
+        /**
+         * Specify an `onChange` handler that is called whenever the ContentSwitcher
+         * changes which item is selected
+         */
+        onChange: PropTypes.Validator<(...args: any[]) => any>;
+        /**
+         * Specify a selected index for the initially selected content
+         */
+        selectedIndex: PropTypes.Requireable<number>;
+        /**
+         * Choose whether or not to automatically change selection on focus
+         */
+        selectionMode: PropTypes.Requireable<string>;
+        /**
+         * Specify the size of the Content Switcher. Currently supports either `sm`, 'md' (default) or 'lg` as an option.
+         */
+        size: PropTypes.Requireable<string>;
+    };
+    static contextType: React.Context<string>;
+    static defaultProps: {
+        selectedIndex: number;
+        selectionMode: string;
+        onChange: () => void;
+    };
+    static getDerivedStateFromProps({ selectedIndex }: {
+        selectedIndex: any;
+    }, state: any): {
+        selectedIndex: any;
+        prevSelectedIndex: any;
+    } | null;
+    handleItemRef: (index: any) => (ref: any) => void;
+    handleChildChange: (data: any) => void;
+    render(): JSX.Element;
+}
+export {};

package/es/components/ContentSwitcher/ContentSwitcher.js

@@ -21,7 +21,9 @@ class ContentSwitcher extends React__default.Component {
   constructor() {
     super(...arguments);
     _defineProperty(this, "_switchRefs", []);
-    _defineProperty(this, "state", {});
+    _defineProperty(this, "state", {
+      selectedIndex: undefined
+    });
     _defineProperty(this, "handleItemRef", index => ref => {
       this._switchRefs[index] = ref;
     });
@@ -41,7 +43,7 @@ class ContentSwitcher extends React__default.Component {
         key
       } = data;
       if (matches(data, [ArrowRight, ArrowLeft])) {
-        const nextIndex = getNextIndex(key, index, this.props.children.length);
+        const nextIndex = getNextIndex(key, index, this.props.children?.length);
         const children = React__default.Children.toArray(this.props.children);
         if (selectionMode === 'manual') {
           const switchRef = this._switchRefs[nextIndex];
@@ -50,6 +52,9 @@ class ContentSwitcher extends React__default.Component {
           this.setState({
             selectedIndex: nextIndex
           }, () => {
+            if (typeof this.state.selectedIndex !== 'number') {
+              return;
+            }
             const child = children[this.state.selectedIndex];
             const switchRef = this._switchRefs[this.state.selectedIndex];
             switchRef && switchRef.focus();
@@ -95,16 +100,18 @@ class ContentSwitcher extends React__default.Component {
       children,
       className,
       light,
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       selectedIndex,
       // eslint-disable-line no-unused-vars
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       selectionMode,
       // eslint-disable-line no-unused-vars
       size,
       ...other
     } = this.props;
-    const isIconOnly = React__default.Children.map(children, child => {
+    const isIconOnly = React__default.Children?.map(children, child => {
       return child.type.displayName === 'IconSwitch';
-    }).every(val => val === true);
+    })?.every(val => val === true);
     const classes = cx(`${prefix}--content-switcher`, className, {
       [`${prefix}--content-switcher--light`]: light,
       [`${prefix}--content-switcher--${size}`]: size,
@@ -120,8 +127,9 @@ class ContentSwitcher extends React__default.Component {
       }
     }, other, {
       className: classes,
-      role: "tablist"
-    }), React__default.Children.map(children, (child, index) => /*#__PURE__*/React__default.cloneElement(child, {
+      role: "tablist",
+      onChange: undefined
+    }), children && React__default.Children.map(children, (child, index) => /*#__PURE__*/React__default.cloneElement(child, {
       index,
       onClick: composeEventHandlers([this.handleChildChange, child.props.onClick]),
       onKeyDown: this.handleChildChange,

package/es/components/DangerButton/DangerButton.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 { ButtonComponent } from '../Button';
+declare const DangerButton: ButtonComponent;
+export default DangerButton;

package/es/components/DangerButton/DangerButton.js

@@ -8,10 +8,10 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
 import Button from '../Button/Button.js';
+import '../Button/Button.Skeleton.js';
 
 const DangerButton = props => /*#__PURE__*/React__default.createElement(Button, _extends({
   kind: "danger"
 }, props));
-var DangerButton$1 = DangerButton;
 
-export { DangerButton$1 as default };
+export { DangerButton as default };

package/es/components/DangerButton/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 DangerButton from './DangerButton';
+export default DangerButton;
+export { DangerButton };

package/es/components/DataTable/TableBatchAction.js

@@ -9,6 +9,7 @@ import PropTypes from 'prop-types';
 import React__default from 'react';
 import { AddFilled } from '@carbon/icons-react';
 import Button from '../Button/Button.js';
+import '../Button/Button.Skeleton.js';
 
 const TableBatchAction = props => /*#__PURE__*/React__default.createElement(Button, props);
 TableBatchAction.propTypes = {

package/es/components/DataTable/TableBatchActions.js

@@ -10,6 +10,7 @@ import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React__default from 'react';
 import Button from '../Button/Button.js';
+import '../Button/Button.Skeleton.js';
 import TableActionList from './TableActionList.js';
 import '../Text/index.js';
 import { usePrefix } from '../../internal/usePrefix.js';

package/es/components/DataTable/TableBody.d.ts

@@ -0,0 +1,29 @@
+/**
+ * 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 PropTypes from 'prop-types';
+import { ReactAttr } from '../../types/common';
+export interface TableBodyProps extends ReactAttr<HTMLTableSectionElement> {
+    /**
+     * `polite` Adjust the notification behavior of screen readers
+     */
+    'aria-live'?: 'polite' | 'assertive' | 'off';
+}
+declare const TableBody: {
+    ({ children, className, ...rest }: TableBodyProps): JSX.Element;
+    propTypes: {
+        /**
+         * `polite` Adjust the notification behavior of screen readers
+         */
+        'aria-live': PropTypes.Requireable<string>;
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        className: PropTypes.Requireable<string>;
+    };
+    defaultProps: {
+        'aria-live': string;
+    };
+};
+export default TableBody;

package/es/components/DataTable/TableBody.js

@@ -6,8 +6,8 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default from 'react';
 import PropTypes from 'prop-types';
+import React__default from 'react';
 
 const TableBody = _ref => {
   let {
@@ -30,6 +30,5 @@ TableBody.propTypes = {
 TableBody.defaultProps = {
   'aria-live': 'polite'
 };
-var TableBody$1 = TableBody;
 
-export { TableBody$1 as default };
+export { TableBody as default };

package/es/components/DataTable/TableContainer.d.ts

@@ -0,0 +1,51 @@
+/**
+ * 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 PropTypes from 'prop-types';
+import React from 'react';
+import { ReactAttr } from '../../types/common';
+export interface TableContainerProps extends Omit<ReactAttr<HTMLDivElement>, 'title'> {
+    /**
+     * Optional description text for the Table
+     */
+    description?: React.ReactNode;
+    /**
+     * Specify whether the table should have a sticky header
+     */
+    stickyHeader?: boolean;
+    /**
+     * If true, will use a width of 'fit-content' to match the inner table width
+     */
+    useStaticWidth?: boolean;
+    /**
+     * Provide a title for the Table
+     */
+    title?: React.ReactNode;
+}
+declare const TableContainer: {
+    ({ className, children, title, description, stickyHeader, useStaticWidth, ...rest }: TableContainerProps): JSX.Element;
+    propTypes: {
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        className: PropTypes.Requireable<string>;
+        /**
+         * Optional description text for the Table
+         */
+        description: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify whether the table should have a sticky header
+         */
+        stickyHeader: PropTypes.Requireable<boolean>;
+        /**
+         * Provide a title for the Table
+         */
+        title: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * If true, will use a width of 'fit-content' to match the inner table width
+         */
+        useStaticWidth: PropTypes.Requireable<boolean>;
+    };
+};
+export default TableContainer;

package/es/components/DataTable/TableContainer.js

@@ -33,8 +33,8 @@ const TableContainer = _ref => {
   });
   const value = useMemo(() => {
     return {
-      titleId: title ? titleId : null,
-      descriptionId: description ? descriptionId : null
+      titleId: title ? titleId : undefined,
+      descriptionId: description ? descriptionId : undefined
     };
   }, [title, description, titleId, descriptionId]);
   return /*#__PURE__*/React__default.createElement(TableContext.Provider, {
@@ -71,6 +71,5 @@ TableContainer.propTypes = {
    */
   useStaticWidth: PropTypes.bool
 };
-var TableContainer$1 = TableContainer;
 
-export { TableContainer$1 as default };
+export { TableContainer as default };

package/es/components/DataTable/TableExpandHeader.d.ts

@@ -0,0 +1,86 @@
+/**
+ * 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 PropTypes from 'prop-types';
+import React from 'react';
+import { ReactAttr } from '../../types/common';
+type TableExpandHeaderPropsBase = {
+    /**
+     * Specify the string read by a voice reader when the expand trigger is
+     * focused
+     */
+    ariaLabel?: string;
+    /**
+     * @deprecated The enableExpando prop is being replaced by `enableToggle`
+     */
+    enableExpando?: false | undefined;
+    /**
+     * Specify whether an expand all button should be displayed
+     */
+    enableToggle?: false | undefined;
+    /**
+     * The description of the chevron right icon, to be put in its SVG `<title>` element.
+     */
+    expandIconDescription?: string;
+    /**
+     * Specify whether this row is expanded or not. This helps coordinate data
+     * attributes so that `TableExpandRow` and `TableExpandedRow` work together
+     */
+    isExpanded?: boolean;
+    /**
+     * Hook for when a listener initiates a request to expand the given row
+     */
+    onExpand?(event: React.MouseEvent<HTMLButtonElement>): void;
+} & ReactAttr<HTMLTableCellElement>;
+type TableExpandHeaderPropsWithToggle = Omit<TableExpandHeaderPropsBase, 'ariaLabel' | 'enableToggle' | 'onExpand'> & {
+    enableToggle: true;
+    ariaLabel: string;
+    onExpand(event: React.MouseEvent<HTMLButtonElement>): void;
+};
+type TableExpandHeaderPropsWithExpando = Omit<TableExpandHeaderPropsBase, 'ariaLabel' | 'enableExpando' | 'onExpand'> & {
+    enableExpando: true;
+    ariaLabel: string;
+    onExpand(event: React.MouseEvent<HTMLButtonElement>): void;
+};
+export type TableExpandHeaderProps = TableExpandHeaderPropsWithToggle | TableExpandHeaderPropsWithExpando | TableExpandHeaderPropsBase;
+declare const TableExpandHeader: {
+    ({ ariaLabel, className: headerClassName, enableExpando, enableToggle, id, isExpanded, onExpand, expandIconDescription, children, ...rest }: TableExpandHeaderProps): JSX.Element;
+    propTypes: {
+        /**
+         * Specify the string read by a voice reader when the expand trigger is
+         * focused
+         */
+        ariaLabel: PropTypes.Requireable<any>;
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        className: PropTypes.Requireable<string>;
+        /**
+         * The enableExpando prop is being replaced by enableToggle
+         */
+        enableExpando: (props: any, propName: any, componentName: any, ...rest: any[]) => any;
+        /**
+         * Specify whether an expand all button should be displayed
+         */
+        enableToggle: PropTypes.Requireable<boolean>;
+        /**
+         * The description of the chevron right icon, to be put in its SVG `<title>` element.
+         */
+        expandIconDescription: PropTypes.Requireable<string>;
+        /**
+         * Supply an id to the th element.
+         */
+        id: PropTypes.Requireable<string>;
+        /**
+         * Specify whether this row is expanded or not. This helps coordinate data
+         * attributes so that `TableExpandRow` and `TableExpandedRow` work together
+         */
+        isExpanded: Function;
+        /**
+         * Hook for when a listener initiates a request to expand the given row
+         */
+        onExpand: PropTypes.Requireable<any>;
+    };
+};
+export default TableExpandHeader;

package/es/components/DataTable/TableExpandHeader.js

@@ -6,13 +6,13 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { ChevronRight } from '@carbon/icons-react';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import requiredIfGivenPropIsTruthy from '../../prop-types/requiredIfGivenPropIsTruthy.js';
-import deprecate from '../../prop-types/deprecate.js';
 import React__default from 'react';
-import { ChevronRight } from '@carbon/icons-react';
 import { usePrefix } from '../../internal/usePrefix.js';
+import deprecate from '../../prop-types/deprecate.js';
+import requiredIfGivenPropIsTruthy from '../../prop-types/requiredIfGivenPropIsTruthy.js';
 
 const TableExpandHeader = _ref => {
   let {
@@ -80,6 +80,5 @@ TableExpandHeader.propTypes = {
    */
   onExpand: PropTypes.oneOfType([requiredIfGivenPropIsTruthy('enableExpando', PropTypes.func), requiredIfGivenPropIsTruthy('enableToggle', PropTypes.func)])
 };
-var TableExpandHeader$1 = TableExpandHeader;
 
-export { TableExpandHeader$1 as default };
+export { TableExpandHeader as default };

package/es/components/DatePicker/plugins/fixEventsPlugin.js

@@ -13,14 +13,15 @@ import { Enter, ArrowLeft, ArrowRight, ArrowDown } from '../../../internal/keybo
  * @returns {Plugin} A Flatpickr plugin to fix Flatpickr's behavior of certain events.
  */
 var carbonFlatpickrFixEventsPlugin = (config => fp => {
+  const {
+    inputFrom,
+    inputTo,
+    lastStartValue
+  } = config;
   /**
    * Handles `keydown` event.
    */
   const handleKeydown = event => {
-    const {
-      inputFrom,
-      inputTo
-    } = config;
     const {
       target
     } = event;
@@ -41,6 +42,7 @@ var carbonFlatpickrFixEventsPlugin = (config => fp => {
       }
     }
   };
+  const parseDateWithFormat = dateStr => fp.parseDate(dateStr, fp.config.dateFormat);
 
   /**
    * Handles `blur` event.
@@ -50,11 +52,6 @@ var carbonFlatpickrFixEventsPlugin = (config => fp => {
    * set the date again, triggering the calendar to update.
    */
   const handleBlur = event => {
-    const {
-      inputFrom,
-      inputTo,
-      lastStartValue
-    } = config;
     const {
       target
     } = event;
@@ -64,8 +61,9 @@ var carbonFlatpickrFixEventsPlugin = (config => fp => {
     if (inputTo === target && fp.selectedDates[1]) {
       // Using getTime() enables the ability to more readily compare the date currently
       // selected in the calendar and the date currently in the value of the input
-      const selectedToDate = new Date(fp.selectedDates[1]).setHours(0, 0, 0, 0);
-      const currentValueToDate = new Date(inputTo.value).setHours(0, 0, 0, 0);
+      const withoutTime = date => date.setHours(0, 0, 0, 0);
+      const selectedToDate = withoutTime(new Date(fp.selectedDates[1]));
+      const currentValueToDate = withoutTime(parseDateWithFormat(inputTo.value));
 
       // The date should only be set if both dates are valid dates, and they don't match.
       // When they don't match, this indiciates that the date selected in the calendar is stale,
@@ -75,19 +73,17 @@ var carbonFlatpickrFixEventsPlugin = (config => fp => {
         fp.setDate([inputFrom.value, inputTo && inputTo.value], true, fp.config.dateFormat);
       }
     }
-
+    const isValidDate = date => date.toString() !== 'Invalid Date';
     // save end date in calendar inmediately after it's been written down
     if (inputTo === target && fp.selectedDates.length === 1 && inputTo.value) {
-      let currentEndDate = new Date(inputTo.value);
-      if (currentEndDate.toString() !== 'Invalid Date') {
+      if (isValidDate(parseDateWithFormat(inputTo.value))) {
         fp.setDate([inputFrom.value, inputTo.value], true, fp.config.dateFormat);
       }
     }
 
     // overriding the flatpickr bug where the startDate gets deleted on blur
     if (inputTo === target && !inputFrom.value && lastStartValue.current) {
-      let currentStartDate = new Date(lastStartValue.current);
-      if (currentStartDate.toString() !== 'Invalid Date') {
+      if (isValidDate(parseDateWithFormat(lastStartValue.current))) {
         inputFrom.value = lastStartValue.current;
         if (inputTo.value) {
           fp.setDate([inputFrom.value, inputTo.value], true, fp.config.dateFormat);

package/es/components/Dropdown/Dropdown.js

@@ -217,6 +217,7 @@ const Dropdown = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
     ,
     role: "combobox" // eslint-disable-line jsx-a11y/role-has-required-aria-props
     ,
+    "aria-owns": getMenuProps().id,
     "aria-controls": getMenuProps().id,
     className: `${prefix}--list-box__field`,
     disabled: disabled,

package/es/components/FluidTextInput/FluidTextInput.js

@@ -10,6 +10,7 @@ import PropTypes from 'prop-types';
 import React__default from 'react';
 import cx from 'classnames';
 import '../TextInput/index.js';
+import '../TextInput/ControlledPasswordInput.js';
 import PasswordInput from '../TextInput/PasswordInput.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';

package/es/components/FormGroup/FormGroup.d.ts

@@ -0,0 +1,80 @@
+/**
+ * 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 PropTypes from 'prop-types';
+import React from 'react';
+import { ReactAttr } from '../../types/common';
+export interface FormGroupProps extends ReactAttr<HTMLFieldSetElement> {
+    /**
+     * Provide the children form elements to be rendered inside of the <fieldset>
+     */
+    children: React.ReactNode;
+    /**
+     * Provide a custom className to be applied to the containing <fieldset> node
+     */
+    className?: string;
+    /**
+     * Specify whether the <FormGroup> is invalid
+     */
+    invalid?: boolean;
+    /**
+     * Provide id for the fieldset <legend> which corresponds to the fieldset
+     * `aria-labelledby`
+     */
+    legendId?: string;
+    /**
+     * Provide the text to be rendered inside of the fieldset <legend>
+     */
+    legendText: React.ReactNode;
+    /**
+     * Specify whether the message should be displayed in the <FormGroup>
+     */
+    message?: boolean;
+    /**
+     * Provide the text for the message in the <FormGroup>
+     */
+    messageText?: string;
+}
+declare const FormGroup: {
+    ({ legendId, legendText, invalid, children, className, message, messageText, ...rest }: FormGroupProps): JSX.Element;
+    propTypes: {
+        /**
+         * Provide the children form elements to be rendered inside of the <fieldset>
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Provide a custom className to be applied to the containing <fieldset> node
+         */
+        className: PropTypes.Requireable<string>;
+        /**
+         * Specify whether the <FormGroup> is invalid
+         */
+        invalid: PropTypes.Requireable<boolean>;
+        /**
+         * Provide id for the fieldset <legend> which corresponds to the fieldset
+         * `aria-labelledby`
+         */
+        legendId: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Provide the text to be rendered inside of the fieldset <legend>
+         */
+        legendText: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
+        /**
+         * Specify whether the message should be displayed in the <FormGroup>
+         */
+        message: PropTypes.Requireable<boolean>;
+        /**
+         * Provide the text for the message in the <FormGroup>
+         */
+        messageText: PropTypes.Requireable<string>;
+    };
+    defaultProps: {
+        invalid: boolean;
+        message: boolean;
+        messageText: string;
+    };
+};
+export default FormGroup;

package/es/components/IconButton/index.js

@@ -9,6 +9,7 @@ import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js
 import PropTypes from 'prop-types';
 import React__default from 'react';
 import Button from '../Button/Button.js';
+import '../Button/Button.Skeleton.js';
 import cx from 'classnames';
 import '../Tooltip/DefinitionTooltip.js';
 import { Tooltip } from '../Tooltip/Tooltip.js';
@@ -22,10 +23,10 @@ const IconButton = /*#__PURE__*/React__default.forwardRef(function IconButton(pr
     closeOnActivation = true,
     defaultOpen = false,
     disabled,
-    enterDelayMs,
+    enterDelayMs = 100,
     kind,
     label,
-    leaveDelayMs,
+    leaveDelayMs = 100,
     wrapperClasses,
     size,
     ...rest