@carbon/react 1.47.0 → 1.48.0

package/lib/components/Modal/Modal.js

@@ -23,6 +23,7 @@ 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 index = require('../IconButton/index.js');
 var noopFn = require('../../internal/noopFn.js');
 require('../Text/index.js');
 var Text = require('../Text/Text.js');
@@ -61,7 +62,7 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     shouldSubmitOnEnter,
     size,
     hasScrollingContent = false,
-    closeButtonLabel,
+    closeButtonLabel = 'Close',
     preventCloseOnClickOutside = false,
     isFullWidth,
     launcherButtonRef,
@@ -211,19 +212,22 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
       size: 'lg'
     });
   }
-  const modalButton = /*#__PURE__*/React__default["default"].createElement("button", {
+  const modalButton = /*#__PURE__*/React__default["default"].createElement("div", {
+    className: `${prefix}--modal-close-button`
+  }, /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
     className: modalCloseButtonClass,
-    type: "button",
+    label: closeButtonLabel,
     onClick: onRequestClose,
-    title: ariaLabel,
-    "aria-label": closeButtonLabel ? closeButtonLabel : 'close',
+    title: closeButtonLabel,
+    "aria-label": closeButtonLabel,
+    align: "left",
     ref: button
   }, /*#__PURE__*/React__default["default"].createElement(iconsReact.Close, {
     size: 20,
     "aria-hidden": "true",
     tabIndex: "-1",
     className: `${modalCloseButtonClass}__icon`
-  }));
+  })));
   const modalBody = /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     ref: innerModal,
     role: "dialog"

package/lib/components/OverflowMenu/next/index.js

@@ -16,6 +16,7 @@ var cx = require('classnames');
 var iconsReact = require('@carbon/icons-react');
 var index = require('../../IconButton/index.js');
 var Menu = require('../../Menu/Menu.js');
+require('../../Menu/MenuItem.js');
 var useId = require('../../../internal/useId.js');
 var usePrefix = require('../../../internal/usePrefix.js');
 var useAttachedMenu = require('../../../internal/useAttachedMenu.js');

package/lib/components/Slug/index.js

@@ -32,14 +32,17 @@ const SlugContent = /*#__PURE__*/React__default["default"].forwardRef(function S
     className
   } = _ref;
   const prefix = usePrefix.usePrefix();
+  const hasSlugActions = React__default["default"].Children.toArray(children).some(child => child.type?.displayName === 'SlugActions');
   const slugContentClasses = cx__default["default"](className, {
-    [`${prefix}--slug-content`]: true
+    [`${prefix}--slug-content`]: true,
+    [`${prefix}--slug-content--with-actions`]: hasSlugActions
   });
   return /*#__PURE__*/React__default["default"].createElement(index.ToggletipContent, {
     className: slugContentClasses,
     ref: ref
   }, children);
 });
+SlugContent.displayName = 'SlugContent';
 SlugContent.propTypes = {
   /**
    * Specify the content you want rendered inside the slug ToggleTip
@@ -64,6 +67,7 @@ const SlugActions = /*#__PURE__*/React__default["default"].forwardRef(function S
     ref: ref
   }, children);
 });
+SlugActions.displayName = 'SlugActions';
 SlugActions.propTypes = {
   /**
    * Specify the content you want rendered inside the slug callout toolbar

package/lib/components/Tooltip/Tooltip.js

@@ -120,14 +120,6 @@ function Tooltip(_ref) {
     }
   }, [isPointerIntersecting, leaveDelayMs, setOpen]);
   useNoInteractiveChildren.useNoInteractiveChildren(tooltipRef, 'The Tooltip component must have no interactive content rendered by the' + '`label` or `description` prop');
-  React.useEffect(() => {
-    if (containerRef !== null && containerRef.current) {
-      const interactiveContent = useNoInteractiveChildren.getInteractiveContent(containerRef.current);
-      if (!interactiveContent) {
-        setOpen(false);
-      }
-    }
-  });
   React.useEffect(() => {
     if (isDragging) {
       // Register drag stop handlers.

package/lib/components/TreeView/TreeNode.js

@@ -32,6 +32,7 @@ const TreeNode = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) =
     className,
     depth,
     disabled,
+    id: nodeId,
     isExpanded,
     label,
     onNodeFocusEvent,
@@ -45,7 +46,7 @@ const TreeNode = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) =
   } = _ref;
   const {
     current: id
-  } = React.useRef(rest.id || uniqueId["default"]());
+  } = React.useRef(nodeId || uniqueId["default"]());
   const [expanded, setExpanded] = React.useState(isExpanded);
   const currentNode = React.useRef(null);
   const currentNodeLabel = React.useRef(null);
@@ -256,7 +257,8 @@ const TreeNode = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) =
 });
 TreeNode.propTypes = {
   /**
-   * The value of the active node in the tree
+   * **Note:** this is controlled by the parent TreeView component, do not set manually.
+   * The ID of the active node in the tree
    */
   active: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
   /**
@@ -268,13 +270,18 @@ TreeNode.propTypes = {
    */
   className: PropTypes__default["default"].string,
   /**
-   * TreeNode depth to determine spacing, automatically calculated by default
+   * * **Note:** this is controlled by the parent TreeView component, do not set manually.
+   * TreeNode depth to determine spacing
    */
   depth: PropTypes__default["default"].number,
   /**
    * Specify if the TreeNode is disabled
    */
   disabled: PropTypes__default["default"].bool,
+  /**
+   * Specify the TreeNode's ID. Must be unique in the DOM and is used for props.active and props.selected
+   */
+  id: PropTypes__default["default"].string,
   /**
    * Specify if the TreeNode is expanded (only applicable to parent nodes)
    */
@@ -305,6 +312,7 @@ TreeNode.propTypes = {
    */
   renderIcon: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object]),
   /**
+   * **Note:** this is controlled by the parent TreeView component, do not set manually.
    * Array containing all selected node IDs in the tree
    */
   selected: PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number])),

package/lib/components/TreeView/TreeView.js

@@ -202,7 +202,7 @@ function TreeView(_ref) {
 }
 TreeView.propTypes = {
   /**
-   * Mark the active node in the tree, represented by its value
+   * Mark the active node in the tree, represented by its ID
    */
   active: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
   /**

package/lib/components/UIShell/HeaderMenu.js

@@ -158,7 +158,7 @@ class HeaderMenu extends React__default["default"].Component {
       onKeyDown,
       ...rest
     } = this.props;
-    const hasActiveDescendant = childrenArg => React__default["default"].Children.toArray(childrenArg).some(child => child.props.isActive || child.props.isCurrentPage || child.props.children instanceof Array && hasActiveDescendant(child.props.children));
+    const hasActiveDescendant = childrenArg => React__default["default"].Children.toArray(childrenArg).some(child => child.props && (child.props.isActive || child.props.isCurrentPage || child.props.children instanceof Array && hasActiveDescendant(child.props.children)));
     const accessibilityLabel = {
       'aria-label': ariaLabel,
       'aria-labelledby': ariaLabelledBy

package/lib/components/UIShell/SwitcherItem.d.ts

@@ -23,6 +23,10 @@ interface BaseSwitcherItemProps {
      * event handlers
      */
     onKeyDown?: (event: KeyboardEvent) => void;
+    /**
+     * event handlers
+     */
+    onClick?: (event: MouseEvent) => void;
     /**
      * Specify the tab index of the Link
      */

package/lib/components/UIShell/SwitcherItem.js

@@ -98,6 +98,10 @@ SwitcherItem.propTypes = {
    * Specify the index of the SwitcherItem
    */
   index: PropTypes__default["default"].number,
+  /**
+   * event handlers
+   */
+  onClick: PropTypes__default["default"].func,
   /**
    * event handlers
    */

package/lib/index.js

@@ -64,6 +64,8 @@ var InlineLoading = require('./components/InlineLoading/InlineLoading.js');
 var Link = require('./components/Link/Link.js');
 var ListItem = require('./components/ListItem/ListItem.js');
 var Loading = require('./components/Loading/Loading.js');
+var Menu = require('./components/Menu/Menu.js');
+var MenuItem = require('./components/Menu/MenuItem.js');
 var index$8 = require('./components/MenuButton/index.js');
 var Modal = require('./components/Modal/Modal.js');
 var ModalWrapper = require('./components/ModalWrapper/ModalWrapper.js');
@@ -216,8 +218,6 @@ var TableToolbarContent = require('./components/DataTable/TableToolbarContent.js
 var TableToolbarSearch = require('./components/DataTable/TableToolbarSearch.js');
 var TableToolbarMenu = require('./components/DataTable/TableToolbarMenu.js');
 var FilterableMultiSelect = require('./components/MultiSelect/FilterableMultiSelect.js');
-var Menu = require('./components/Menu/Menu.js');
-var MenuItem = require('./components/Menu/MenuItem.js');
 var MultiSelect = require('./components/MultiSelect/MultiSelect.js');
 var Pagination$1 = require('./components/Pagination/Pagination.js');
 var PaginationNav = require('./components/PaginationNav/PaginationNav.js');
@@ -287,6 +287,12 @@ exports.InlineLoading = InlineLoading["default"];
 exports.Link = Link["default"];
 exports.ListItem = ListItem["default"];
 exports.Loading = Loading["default"];
+exports.Menu = Menu.Menu;
+exports.MenuItem = MenuItem.MenuItem;
+exports.MenuItemDivider = MenuItem.MenuItemDivider;
+exports.MenuItemGroup = MenuItem.MenuItemGroup;
+exports.MenuItemRadioGroup = MenuItem.MenuItemRadioGroup;
+exports.MenuItemSelectable = MenuItem.MenuItemSelectable;
 exports.MenuButton = index$8.MenuButton;
 exports.Modal = Modal["default"];
 exports.ModalWrapper = ModalWrapper["default"];
@@ -394,6 +400,7 @@ exports.unstable_useFeatureFlags = index.useFeatureFlags;
 exports.Heading = index$d.Heading;
 exports.Section = index$d.Section;
 exports.IconButton = index$e.IconButton;
+exports.IconButtonKinds = index$e.IconButtonKinds;
 exports.Layer = index$f.Layer;
 exports.useLayer = index$f.useLayer;
 exports.unstable_Layout = index$1.Layout;
@@ -474,12 +481,6 @@ exports.TableToolbarContent = TableToolbarContent["default"];
 exports.TableToolbarSearch = TableToolbarSearch["default"];
 exports.TableToolbarMenu = TableToolbarMenu["default"];
 exports.FilterableMultiSelect = FilterableMultiSelect["default"];
-exports.Menu = Menu.Menu;
-exports.MenuItem = MenuItem.MenuItem;
-exports.MenuItemDivider = MenuItem.MenuItemDivider;
-exports.MenuItemGroup = MenuItem.MenuItemGroup;
-exports.MenuItemRadioGroup = MenuItem.MenuItemRadioGroup;
-exports.MenuItemSelectable = MenuItem.MenuItemSelectable;
 exports.MultiSelect = MultiSelect["default"];
 exports.Pagination = Pagination$1["default"];
 exports.PaginationNav = PaginationNav["default"];

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.47.0",
+  "version": "1.48.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -49,13 +49,13 @@
   "dependencies": {
     "@babel/runtime": "^7.18.3",
     "@carbon/feature-flags": "^0.16.0",
-    "@carbon/icons-react": "^11.33.0",
+    "@carbon/icons-react": "^11.34.0",
     "@carbon/layout": "^11.20.0",
-    "@carbon/styles": "^1.47.0",
+    "@carbon/styles": "^1.48.0",
     "@ibm/telemetry-js": "^1.1.0",
-    "classnames": "2.5.0",
+    "classnames": "2.5.1",
     "copy-to-clipboard": "^3.3.1",
-    "downshift": "8.2.4",
+    "downshift": "8.3.1",
     "flatpickr": "4.6.9",
     "invariant": "^2.2.3",
     "lodash.debounce": "^4.0.8",
@@ -79,7 +79,7 @@
     "@babel/preset-react": "^7.22.3",
     "@babel/preset-typescript": "^7.21.5",
     "@carbon/test-utils": "^10.30.0",
-    "@carbon/themes": "^11.28.0",
+    "@carbon/themes": "^11.29.0",
     "@rollup/plugin-babel": "^6.0.0",
     "@rollup/plugin-commonjs": "^25.0.0",
     "@rollup/plugin-node-resolve": "^15.0.0",
@@ -139,5 +139,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "978a93a33268170634ff6e4c20565a62cc220774"
+  "gitHead": "6d133d4f920b7c01f6ea2221938a339c14a85b42"
 }