@carbon/react 1.83.0-rc.0 → 1.84.0-rc.0

package/es/components/Menu/Menu.js

@@ -8,7 +8,7 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import React__default, { forwardRef, useRef, useContext, useReducer, useMemo, useState, useEffect } from 'react';
+import React, { forwardRef, useRef, useContext, useReducer, useMemo, useState, useEffect } from 'react';
 import { createPortal } from 'react-dom';
 import { Escape, ArrowLeft, ArrowUp, ArrowDown } from '../../internal/keyboard/keys.js';
 import { match } from '../../internal/keyboard/match.js';
@@ -22,30 +22,29 @@ import { canUseDOM } from '../../internal/environment.js';
 
 const spacing = 8; // distance to keep to window edges, in px
 
-const Menu = /*#__PURE__*/forwardRef(function Menu(_ref, forwardRef) {
-  let {
-    children,
-    className,
-    containerRef,
-    label,
-    menuAlignment,
-    mode,
-    onClose,
-    onOpen,
-    open,
-    size = 'sm',
-    legacyAutoalign = 'true',
-    // TODO: `ssr-friendly` doesn't support ESLint v9.
-    // https://github.com/kopiro/eslint-plugin-ssr-friendly/issues/30
-    // https://github.com/carbon-design-system/carbon/issues/18991
-    /*
-    // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
-    */
-    target = canUseDOM && document.body,
-    x = 0,
-    y = 0,
-    ...rest
-  } = _ref;
+const Menu = /*#__PURE__*/forwardRef(function Menu({
+  children,
+  className,
+  containerRef,
+  label,
+  menuAlignment,
+  mode,
+  onClose,
+  onOpen,
+  open,
+  size = 'sm',
+  legacyAutoalign = 'true',
+  // TODO: `ssr-friendly` doesn't support ESLint v9.
+  // https://github.com/kopiro/eslint-plugin-ssr-friendly/issues/30
+  // https://github.com/carbon-design-system/carbon/issues/18991
+  /*
+  // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
+  */
+  target = canUseDOM && document.body,
+  x = 0,
+  y = 0,
+  ...rest
+}, forwardRef) {
   const prefix = usePrefix();
   const focusReturn = useRef(null);
   const context = useContext(MenuContext);
@@ -278,9 +277,9 @@ const Menu = /*#__PURE__*/forwardRef(function Menu(_ref, forwardRef) {
     [`${prefix}--menu--with-selectable-items`]: childContext.state.hasSelectableItems,
     [`${prefix}--autoalign`]: !legacyAutoalign
   });
-  const rendered = /*#__PURE__*/React__default.createElement(MenuContext.Provider, {
+  const rendered = /*#__PURE__*/React.createElement(MenuContext.Provider, {
     value: childContext
-  }, /*#__PURE__*/React__default.createElement("ul", _extends({}, rest, {
+  }, /*#__PURE__*/React.createElement("ul", _extends({}, rest, {
     className: classNames,
     role: "menu",
     ref: ref,

package/es/components/Menu/MenuItem.js

@@ -8,7 +8,7 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import React__default, { forwardRef, useState, useContext, useRef, useEffect } from 'react';
+import React, { forwardRef, useState, useContext, useRef, useEffect } from 'react';
 import { useFloating, autoUpdate, offset, useInteractions, useHover, safePolygon, FloatingFocusManager } from '@floating-ui/react';
 import { Checkmark, CaretLeft, CaretRight } from '@carbon/icons-react';
 import { ArrowRight, Enter, Space } from '../../internal/keyboard/keys.js';
@@ -24,18 +24,17 @@ import '../Text/index.js';
 import { Text } from '../Text/Text.js';
 
 var _Checkmark, _CaretLeft, _CaretRight;
-const MenuItem = /*#__PURE__*/forwardRef(function MenuItem(_ref, forwardRef) {
-  let {
-    children,
-    className,
-    disabled,
-    kind = 'default',
-    label,
-    onClick,
-    renderIcon: IconElement,
-    shortcut,
-    ...rest
-  } = _ref;
+const MenuItem = /*#__PURE__*/forwardRef(function MenuItem({
+  children,
+  className,
+  disabled,
+  kind = 'default',
+  label,
+  onClick,
+  renderIcon: IconElement,
+  shortcut,
+  ...rest
+}, forwardRef) {
   const [submenuOpen, setSubmenuOpen] = useState(false);
   const [rtl, setRtl] = useState(false);
   const {
@@ -159,11 +158,11 @@ const MenuItem = /*#__PURE__*/forwardRef(function MenuItem(_ref, forwardRef) {
       }
     });
   }, [floatingStyles, refs.floating]);
-  return /*#__PURE__*/React__default.createElement(FloatingFocusManager, {
+  return /*#__PURE__*/React.createElement(FloatingFocusManager, {
     context: floatingContext,
     order: ['reference', 'floating'],
     modal: false
-  }, /*#__PURE__*/React__default.createElement("li", _extends({
+  }, /*#__PURE__*/React.createElement("li", _extends({
     role: "menuitem"
   }, rest, {
     ref: ref,
@@ -175,19 +174,19 @@ const MenuItem = /*#__PURE__*/forwardRef(function MenuItem(_ref, forwardRef) {
     onClick: handleClick,
     onKeyDown: handleKeyDown,
     onKeyUp: handleKeyUp
-  }, getReferenceProps()), /*#__PURE__*/React__default.createElement("div", {
+  }, getReferenceProps()), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--menu-item__selection-icon`
-  }, rest['aria-checked'] && (_Checkmark || (_Checkmark = /*#__PURE__*/React__default.createElement(Checkmark, null)))), /*#__PURE__*/React__default.createElement("div", {
+  }, rest['aria-checked'] && (_Checkmark || (_Checkmark = /*#__PURE__*/React.createElement(Checkmark, null)))), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--menu-item__icon`
-  }, IconElement && /*#__PURE__*/React__default.createElement(IconElement, null)), /*#__PURE__*/React__default.createElement(Text, {
+  }, IconElement && /*#__PURE__*/React.createElement(IconElement, null)), /*#__PURE__*/React.createElement(Text, {
     as: "div",
     className: `${prefix}--menu-item__label`,
     title: label
-  }, label), shortcut && !hasChildren && /*#__PURE__*/React__default.createElement("div", {
+  }, label), shortcut && !hasChildren && /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--menu-item__shortcut`
-  }, shortcut), hasChildren && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
+  }, shortcut), hasChildren && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--menu-item__shortcut`
-  }, rtl ? _CaretLeft || (_CaretLeft = /*#__PURE__*/React__default.createElement(CaretLeft, null)) : _CaretRight || (_CaretRight = /*#__PURE__*/React__default.createElement(CaretRight, null))), /*#__PURE__*/React__default.createElement(Menu, _extends({
+  }, rtl ? _CaretLeft || (_CaretLeft = /*#__PURE__*/React.createElement(CaretLeft, null)) : _CaretRight || (_CaretRight = /*#__PURE__*/React.createElement(CaretRight, null))), /*#__PURE__*/React.createElement(Menu, _extends({
     label: label,
     open: submenuOpen,
     onClose: () => {
@@ -234,15 +233,14 @@ MenuItem.propTypes = {
   // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
   shortcut: PropTypes.string
 };
-const MenuItemSelectable = /*#__PURE__*/forwardRef(function MenuItemSelectable(_ref2, forwardRef) {
-  let {
-    className,
-    defaultSelected,
-    label,
-    onChange,
-    selected,
-    ...rest
-  } = _ref2;
+const MenuItemSelectable = /*#__PURE__*/forwardRef(function MenuItemSelectable({
+  className,
+  defaultSelected,
+  label,
+  onChange,
+  selected,
+  ...rest
+}, forwardRef) {
   const prefix = usePrefix();
   const context = useContext(MenuContext);
   const [checked, setChecked] = useControllableState({
@@ -262,7 +260,7 @@ const MenuItemSelectable = /*#__PURE__*/forwardRef(function MenuItemSelectable(_
     }
   }, [context.state.hasSelectableItems, context]);
   const classNames = cx(className, `${prefix}--menu-item-selectable--selected`);
-  return /*#__PURE__*/React__default.createElement(MenuItem, _extends({}, rest, {
+  return /*#__PURE__*/React.createElement(MenuItem, _extends({}, rest, {
     ref: forwardRef,
     label: label,
     className: classNames,
@@ -296,20 +294,19 @@ MenuItemSelectable.propTypes = {
   // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
   selected: PropTypes.bool
 };
-const MenuItemGroup = /*#__PURE__*/forwardRef(function MenuItemGroup(_ref3, forwardRef) {
-  let {
-    children,
-    className,
-    label,
-    ...rest
-  } = _ref3;
+const MenuItemGroup = /*#__PURE__*/forwardRef(function MenuItemGroup({
+  children,
+  className,
+  label,
+  ...rest
+}, forwardRef) {
   const prefix = usePrefix();
   const classNames = cx(className, `${prefix}--menu-item-group`);
-  return /*#__PURE__*/React__default.createElement("li", {
+  return /*#__PURE__*/React.createElement("li", {
     className: classNames,
     role: "none",
     ref: forwardRef
-  }, /*#__PURE__*/React__default.createElement("ul", _extends({}, rest, {
+  }, /*#__PURE__*/React.createElement("ul", _extends({}, rest, {
     role: "group",
     "aria-label": label
   }), children));
@@ -329,17 +326,16 @@ MenuItemGroup.propTypes = {
   label: PropTypes.string.isRequired
 };
 const defaultItemToString = item => item.toString();
-const MenuItemRadioGroup = /*#__PURE__*/forwardRef(function MenuItemRadioGroup(_ref4, forwardRef) {
-  let {
-    className,
-    defaultSelectedItem,
-    items,
-    itemToString = defaultItemToString,
-    label,
-    onChange,
-    selectedItem,
-    ...rest
-  } = _ref4;
+const MenuItemRadioGroup = /*#__PURE__*/forwardRef(function MenuItemRadioGroup({
+  className,
+  defaultSelectedItem,
+  items,
+  itemToString = defaultItemToString,
+  label,
+  onChange,
+  selectedItem,
+  ...rest
+}, forwardRef) {
   const prefix = usePrefix();
   const context = useContext(MenuContext);
   const [selection, setSelection] = useControllableState({
@@ -359,14 +355,14 @@ const MenuItemRadioGroup = /*#__PURE__*/forwardRef(function MenuItemRadioGroup(_
     }
   }, [context.state.hasSelectableItems, context]);
   const classNames = cx(className, `${prefix}--menu-item-radio-group`);
-  return /*#__PURE__*/React__default.createElement("li", {
+  return /*#__PURE__*/React.createElement("li", {
     className: classNames,
     role: "none",
     ref: forwardRef
-  }, /*#__PURE__*/React__default.createElement("ul", _extends({}, rest, {
+  }, /*#__PURE__*/React.createElement("ul", _extends({}, rest, {
     role: "group",
     "aria-label": label
-  }), items.map((item, i) => /*#__PURE__*/React__default.createElement(MenuItem, {
+  }), items.map((item, i) => /*#__PURE__*/React.createElement(MenuItem, {
     key: i,
     label: itemToString(item),
     role: "menuitemradio",
@@ -409,14 +405,13 @@ MenuItemRadioGroup.propTypes = {
    */
   selectedItem: PropTypes.any
 };
-const MenuItemDivider = /*#__PURE__*/forwardRef(function MenuItemDivider(_ref5, forwardRef) {
-  let {
-    className,
-    ...rest
-  } = _ref5;
+const MenuItemDivider = /*#__PURE__*/forwardRef(function MenuItemDivider({
+  className,
+  ...rest
+}, forwardRef) {
   const prefix = usePrefix();
   const classNames = cx(className, `${prefix}--menu-item-divider`);
-  return /*#__PURE__*/React__default.createElement("li", _extends({}, rest, {
+  return /*#__PURE__*/React.createElement("li", _extends({}, rest, {
     className: classNames,
     role: "separator",
     ref: forwardRef

package/es/components/MenuButton/index.js

@@ -6,7 +6,7 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default, { forwardRef, useRef, useLayoutEffect } from 'react';
+import React, { forwardRef, useRef, useLayoutEffect } from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { ChevronDown } from '@carbon/icons-react';
@@ -23,19 +23,18 @@ import mergeRefs from '../../tools/mergeRefs.js';
 
 const validButtonKinds = ['primary', 'tertiary', 'ghost'];
 const defaultButtonKind = 'primary';
-const MenuButton = /*#__PURE__*/forwardRef(function MenuButton(_ref, forwardRef) {
-  let {
-    children,
-    className,
-    disabled,
-    kind = defaultButtonKind,
-    label,
-    size: size$1 = 'lg',
-    menuAlignment = 'bottom',
-    tabIndex = 0,
-    menuTarget,
-    ...rest
-  } = _ref;
+const MenuButton = /*#__PURE__*/forwardRef(function MenuButton({
+  children,
+  className,
+  disabled,
+  kind = defaultButtonKind,
+  label,
+  size: size$1 = 'lg',
+  menuAlignment = 'bottom',
+  tabIndex = 0,
+  menuTarget,
+  ...rest
+}, forwardRef) {
   // feature flag utilized to separate out only the dynamic styles from @floating-ui
   // flag is turned on when collision detection (ie. flip, hide) logic is not desired
   const enableOnlyFloatingStyles = useFeatureFlag('enable-v12-dynamic-floating-styles');
@@ -50,11 +49,10 @@ const MenuButton = /*#__PURE__*/forwardRef(function MenuButton(_ref, forwardRef)
   }
   if (menuAlignment === 'bottom' || menuAlignment === 'top') {
     middlewares.push(size({
-      apply(_ref2) {
-        let {
-          rects,
-          elements
-        } = _ref2;
+      apply({
+        rects,
+        elements
+      }) {
         Object.assign(elements.floating.style, {
           width: `${rects.reference.width}px`
         });
@@ -114,11 +112,11 @@ const MenuButton = /*#__PURE__*/forwardRef(function MenuButton(_ref, forwardRef)
     [`${prefix}--menu-button__trigger--open`]: open
   });
   const menuClasses = cx(`${prefix}--menu-button__${menuAlignment}`);
-  return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+  return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
     ref: ref,
     "aria-owns": open ? id : undefined,
     className: containerClasses
-  }), /*#__PURE__*/React__default.createElement(Button, {
+  }), /*#__PURE__*/React.createElement(Button, {
     ref: refs.setReference,
     className: triggerClasses,
     size: size$1,
@@ -131,7 +129,7 @@ const MenuButton = /*#__PURE__*/forwardRef(function MenuButton(_ref, forwardRef)
     onClick: handleClick,
     onMouseDown: handleMousedown,
     "aria-controls": open ? id : undefined
-  }, label), /*#__PURE__*/React__default.createElement(Menu, {
+  }, label), /*#__PURE__*/React.createElement(Menu, {
     containerRef: triggerRef,
     menuAlignment: menuAlignment,
     className: menuClasses,

package/es/components/Modal/Modal.d.ts

@@ -4,8 +4,7 @@
  * 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, { type ReactNode, type Ref } from 'react';
-import { ReactAttr } from '../../types/common';
+import React, { type HTMLAttributes, type ReactNode, type Ref } from 'react';
 import { InlineLoadingStatus } from '../InlineLoading/InlineLoading';
 export declare const ModalSizes: readonly ["xs", "sm", "md", "lg"];
 export type ModalSize = (typeof ModalSizes)[number];
@@ -13,7 +12,7 @@ export interface ModalSecondaryButton {
     buttonText?: string | ReactNode;
     onClick?: React.MouseEventHandler<HTMLButtonElement>;
 }
-export interface ModalProps extends ReactAttr<HTMLDivElement> {
+export interface ModalProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Specify whether the Modal is displaying an alert, error or warning
      * Should go hand in hand with the danger prop.