@carbon/react 1.81.0 → 1.82.0-rc.0

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

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -9,6 +9,6 @@ declare const listBoxTypes: readonly ["default", "inline"];
 declare const listBoxSizes: readonly ["sm", "md", "lg"];
 export type ListBoxType = (typeof listBoxTypes)[number];
 export type ListBoxSize = (typeof listBoxSizes)[number];
-export declare const ListBoxType: PropTypes.Requireable<"default" | "inline">;
-export declare const ListBoxSize: PropTypes.Requireable<"sm" | "md" | "lg">;
+export declare const ListBoxTypePropType: PropTypes.Requireable<"default" | "inline">;
+export declare const ListBoxSizePropType: PropTypes.Requireable<"sm" | "md" | "lg">;
 export {};

package/lib/components/ListBox/ListBoxPropTypes.js

@@ -17,8 +17,8 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
 const listBoxTypes = ['default', 'inline'];
 const listBoxSizes = ['sm', 'md', 'lg'];
-const ListBoxType = PropTypes__default["default"].oneOf(listBoxTypes);
-const ListBoxSize = PropTypes__default["default"].oneOf(listBoxSizes);
+const ListBoxTypePropType = PropTypes__default["default"].oneOf(listBoxTypes);
+const ListBoxSizePropType = PropTypes__default["default"].oneOf(listBoxSizes);
 
-exports.ListBoxSize = ListBoxSize;
-exports.ListBoxType = ListBoxType;
+exports.ListBoxSizePropType = ListBoxSizePropType;
+exports.ListBoxTypePropType = ListBoxTypePropType;

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

@@ -1,17 +1,19 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-export * as PropTypes from './ListBoxPropTypes';
 export * from './ListBoxPropTypes';
-import { ListBoxComponent as ListBoxPartialComponent } from './ListBox';
+import ListBoxInternal from './ListBox';
 import { ListBoxFieldComponent } from './ListBoxField';
-import { ListBoxMenuComponent } from './ListBoxMenu';
+import ListBoxMenu from './ListBoxMenu';
 import { ListBoxMenuIconComponent } from './ListBoxMenuIcon';
-import { ListBoxMenuItemComponent } from './ListBoxMenuItem';
+import ListBoxMenuItem from './ListBoxMenuItem';
 import { ListBoxSelectionComponent } from './ListBoxSelection';
+type ListBoxMenuComponent = typeof ListBoxMenu;
+type ListBoxMenuItemComponent = typeof ListBoxMenuItem;
+type ListBoxPartialComponent = typeof ListBoxInternal;
 export interface ListBoxComponent extends ListBoxPartialComponent {
     readonly Field: ListBoxFieldComponent;
     readonly Menu: ListBoxMenuComponent;

package/lib/components/ListBox/index.js

@@ -25,6 +25,6 @@ const ListBox = Object.assign(ListBox$1["default"], {
   Selection: ListBoxSelection["default"]
 });
 
-exports.ListBoxSize = ListBoxPropTypes.ListBoxSize;
-exports.ListBoxType = ListBoxPropTypes.ListBoxType;
+exports.ListBoxSizePropType = ListBoxPropTypes.ListBoxSizePropType;
+exports.ListBoxTypePropType = ListBoxPropTypes.ListBoxTypePropType;
 exports["default"] = ListBox;

package/lib/components/Menu/Menu.js

@@ -44,7 +44,12 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(_ref, forwardRef) {
     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 = environment.canUseDOM && document.body,
     x = 0,
     y = 0,

package/lib/components/Modal/Modal.js

@@ -109,28 +109,28 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
       target
     } = evt;
     evt.stopPropagation();
-    if (open) {
+    if (open && target instanceof HTMLElement) {
       if (match.match(evt, keys.Escape)) {
         onRequestClose(evt);
       }
-      if (match.match(evt, keys.Enter) && shouldSubmitOnEnter && target instanceof Element && !isCloseButton(target) && document.activeElement !== button.current) {
+      if (match.match(evt, keys.Enter) && shouldSubmitOnEnter && !isCloseButton(target) && document.activeElement !== button.current) {
         onRequestSubmit(evt);
       }
       if (focusTrapWithoutSentinels && !enableDialogElement && match.match(evt, keys.Tab) && innerModal.current) {
         wrapFocus.wrapFocusWithoutSentinels({
           containerNode: innerModal.current,
-          currentActiveNode: evt.target,
-          // TODO: Delete type assertion following util rewrite.
-          // https://github.com/carbon-design-system/carbon/pull/18913
+          currentActiveNode: target,
           event: evt
         });
       }
     }
   }
   function handleOnClick(evt) {
-    const target = evt.target;
+    const {
+      target
+    } = evt;
     evt.stopPropagation();
-    if (!preventCloseOnClickOutside && !wrapFocus.elementOrParentIsFloatingMenu(target, selectorsFloatingMenus) && innerModal.current && !innerModal.current.contains(target)) {
+    if (!preventCloseOnClickOutside && target instanceof Node && !wrapFocus.elementOrParentIsFloatingMenu(target, selectorsFloatingMenus) && innerModal.current && !innerModal.current.contains(target)) {
       onRequestClose(evt);
     }
   }
@@ -139,7 +139,7 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
       target: oldActiveNode,
       relatedTarget: currentActiveNode
     } = _ref2;
-    if (open && currentActiveNode && oldActiveNode) {
+    if (open && oldActiveNode instanceof HTMLElement && currentActiveNode instanceof HTMLElement) {
       const {
         current: bodyNode
       } = innerModal;
@@ -149,7 +149,7 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
       const {
         current: endTrapNode
       } = endTrap;
-      wrapFocus["default"]({
+      wrapFocus.wrapFocus({
         bodyNode,
         startTrapNode,
         endTrapNode,

package/lib/components/MultiSelect/FilterableMultiSelect.d.ts

@@ -7,6 +7,7 @@
 import { type UseComboboxProps, type UseMultipleSelectionProps } from 'downshift';
 import React, { ReactNode, FunctionComponent, ReactElement } from 'react';
 import { type MultiSelectSortingProps } from './MultiSelectPropTypes';
+import { type ListBoxSize, type ListBoxType } from '../ListBox';
 import { TranslateWithId } from '../../types/common';
 /**
  * Message ids that will be passed to translateWithId().
@@ -166,7 +167,7 @@ export interface FilterableMultiSelectProps<ItemType> extends MultiSelectSorting
      * Specify the size of the ListBox.
      * Currently, supports either `sm`, `md` or `lg` as an option.
      */
-    size?: 'sm' | 'md' | 'lg';
+    size?: ListBoxSize;
     /**
      * @deprecated please use decorator instead.
      * **Experimental**: Provide a `Slug` component to be rendered inside the `Checkbox` component
@@ -177,7 +178,7 @@ export interface FilterableMultiSelectProps<ItemType> extends MultiSelectSorting
      * combobox via ARIA attributes.
      */
     titleText?: ReactNode;
-    type?: 'default' | 'inline';
+    type?: ListBoxType;
     /**
      * Specify title to show title on hover
      */

package/lib/components/MultiSelect/FilterableMultiSelect.js

@@ -787,7 +787,7 @@ FilterableMultiSelect.propTypes = {
   /**
    * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
    */
-  size: ListBoxPropTypes.ListBoxSize,
+  size: ListBoxPropTypes.ListBoxSizePropType,
   slug: deprecate["default"](PropTypes__default["default"].node, 'The `slug` prop has been deprecated and will be removed in the next major version. Use the decorator prop instead.'),
   ...MultiSelectPropTypes.sortingPropTypes,
   /**
@@ -799,6 +799,7 @@ FilterableMultiSelect.propTypes = {
    * Callback function for translating ListBoxMenuIcon SVG title
    */
   translateWithId: PropTypes__default["default"].func,
+  type: ListBoxPropTypes.ListBoxTypePropType,
   /**
    * Specify title to show title on hover
    */

package/lib/components/MultiSelect/MultiSelect.d.ts

@@ -6,7 +6,7 @@
  */
 import { UseSelectProps } from 'downshift';
 import React, { ReactNode } from 'react';
-import { ListBoxSize, ListBoxType } from '../ListBox';
+import { type ListBoxSize, type ListBoxType } from '../ListBox';
 import { MultiSelectSortingProps } from './MultiSelectPropTypes';
 import { ListBoxProps } from '../ListBox/ListBox';
 import type { TranslateWithId } from '../../types/common';
@@ -173,5 +173,11 @@ export interface MultiSelectProps<ItemType> extends MultiSelectSortingProps<Item
      */
     warnText?: ReactNode;
 }
-export declare const MultiSelect: React.ForwardRefExoticComponent<MultiSelectProps<unknown> & React.RefAttributes<HTMLButtonElement>>;
+export declare const MultiSelect: MultiSelectComponent;
+type MultiSelectComponentProps<ItemType> = React.PropsWithChildren<MultiSelectProps<ItemType>> & React.RefAttributes<HTMLButtonElement>;
+interface MultiSelectComponent {
+    propTypes: Record<string, any>;
+    displayName: string;
+    <ItemType>(props: MultiSelectComponentProps<ItemType>): React.ReactElement<any> | null;
+}
 export {};

package/lib/components/MultiSelect/MultiSelect.js

@@ -680,7 +680,7 @@ MultiSelect.propTypes = {
   /**
    * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
    */
-  size: ListBoxPropTypes.ListBoxSize,
+  size: ListBoxPropTypes.ListBoxSizePropType,
   slug: deprecate["default"](PropTypes__default["default"].node, 'The `slug` prop has been deprecated and will be removed in the next major version. Use the decorator prop instead.'),
   /**
    * Provide a method that sorts all options in the control. Overriding this
@@ -715,7 +715,7 @@ MultiSelect.propTypes = {
   /**
    * Specify 'inline' to create an inline multi-select.
    */
-  type: PropTypes__default["default"].oneOf(['default', 'inline']),
+  type: ListBoxPropTypes.ListBoxTypePropType,
   /**
    * Specify title to show title on hover
    */

package/lib/components/Notification/Notification.js

@@ -543,7 +543,7 @@ function ActionableNotification(_ref6) {
       const {
         current: endTrapNode
       } = endTrap;
-      wrapFocus["default"]({
+      wrapFocus.wrapFocus({
         bodyNode,
         startTrapNode,
         endTrapNode,

package/lib/components/OverflowMenu/OverflowMenu.js

@@ -26,6 +26,7 @@ var setupGetInstanceId = require('../../tools/setupGetInstanceId.js');
 var index = require('../IconButton/index.js');
 var useOutsideClick = require('../../internal/useOutsideClick.js');
 var deprecateValuesWithin = require('../../prop-types/deprecateValuesWithin.js');
+var mapPopoverAlign = require('../../tools/mapPopoverAlign.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -101,22 +102,6 @@ const getMenuOffset = (menuBody, direction, trigger, flip) => {
       };
   }
 };
-
-// TODO: Replace this code when align mapping is consolidated.
-// https://github.com/carbon-design-system/carbon/pull/19081
-const propMappingFunction = deprecatedValue => {
-  const mapping = {
-    'top-left': 'top-start',
-    'top-right': 'top-end',
-    'bottom-left': 'bottom-start',
-    'bottom-right': 'bottom-end',
-    'left-bottom': 'left-end',
-    'left-top': 'left-start',
-    'right-bottom': 'right-end',
-    'right-top': 'right-start'
-  };
-  return mapping[deprecatedValue];
-};
 const OverflowMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     align,
@@ -396,11 +381,7 @@ OverflowMenu.propTypes = {
   // deprecated use right-start instead
 
   // new values to match floating-ui
-  'top-start', 'top-end', 'bottom-start', 'bottom-end', 'left-end', 'left-start', 'right-end', 'right-start']),
-  //allowed prop values
-  ['top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end', 'left', 'left-start', 'left-end', 'right', 'right-start', 'right-end'],
-  //optional mapper function
-  propMappingFunction),
+  'top-start', 'top-end', 'bottom-start', 'bottom-end', 'left-end', 'left-start', 'right-end', 'right-start']), ['top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end', 'left', 'left-start', 'left-end', 'right', 'right-start', 'right-end'], mapPopoverAlign.mapPopoverAlign),
   /**
    * Specify a label to be read by screen readers on the container node
    */

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

@@ -24,6 +24,7 @@ var useId = require('../../../internal/useId.js');
 var usePrefix = require('../../../internal/usePrefix.js');
 var useAttachedMenu = require('../../../internal/useAttachedMenu.js');
 var deprecateValuesWithin = require('../../../prop-types/deprecateValuesWithin.js');
+var mapPopoverAlign = require('../../../tools/mapPopoverAlign.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -32,19 +33,6 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 const defaultSize = 'md';
-const propMappingFunction = deprecatedValue => {
-  const mapping = {
-    'top-left': 'top-start',
-    'top-right': 'top-end',
-    'bottom-left': 'bottom-start',
-    'bottom-right': 'bottom-end',
-    'left-bottom': 'left-end',
-    'left-top': 'left-start',
-    'right-bottom': 'right-end',
-    'right-top': 'right-start'
-  };
-  return mapping[deprecatedValue];
-};
 const OverflowMenu = /*#__PURE__*/React__default["default"].forwardRef(function OverflowMenu(_ref, forwardRef) {
   let {
     autoAlign = false,
@@ -206,11 +194,7 @@ OverflowMenu.propTypes = {
   // deprecated use right-start instead
 
   // new values to match floating-ui
-  'top-start', 'top-end', 'bottom-start', 'bottom-end', 'left-end', 'left-start', 'right-end', 'right-start']),
-  //allowed prop values
-  ['top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end', 'left', 'left-start', 'left-end', 'right', 'right-start', 'right-end'],
-  //optional mapper function
-  propMappingFunction),
+  'top-start', 'top-end', 'bottom-start', 'bottom-end', 'left-end', 'left-start', 'right-end', 'right-start']), ['top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end', 'left', 'left-start', 'left-end', 'right', 'right-start', 'right-end'], mapPopoverAlign.mapPopoverAlign),
   /**
    * Specify a DOM node where the Menu should be rendered in. Defaults to document.body.
    */

package/lib/components/OverflowMenuItem/OverflowMenuItem.d.ts

@@ -1,11 +1,10 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * 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 { ForwardRefReturn } from '../../types/common';
 export interface OverflowMenuItemProps extends React.HTMLAttributes<HTMLElement> {
     /**
      * The CSS class name to be placed on the button element
@@ -57,6 +56,5 @@ export interface OverflowMenuItemProps extends React.HTMLAttributes<HTMLElement>
      */
     wrapperClassName?: string;
 }
-export type OverflowMenuItemComponent = ForwardRefReturn<HTMLElement, OverflowMenuItemProps>;
-declare const OverflowMenuItem: OverflowMenuItemComponent;
+declare const OverflowMenuItem: React.ForwardRefExoticComponent<Omit<OverflowMenuItemProps, "ref"> & React.RefAttributes<HTMLElement>>;
 export default OverflowMenuItem;

package/lib/components/OverflowMenuItem/OverflowMenuItem.js

@@ -26,8 +26,9 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const OverflowMenuItem = /*#__PURE__*/React__default["default"].forwardRef(function OverflowMenuItem(_ref, ref) {
-  let {
+const frFn = React.forwardRef;
+const OverflowMenuItem = frFn((props, ref) => {
+  const {
     className,
     closeMenu,
     disabled = false,
@@ -43,7 +44,7 @@ const OverflowMenuItem = /*#__PURE__*/React__default["default"].forwardRef(funct
     title,
     wrapperClassName,
     ...rest
-  } = _ref;
+  } = props;
   const prefix = usePrefix.usePrefix();
   function setTabFocus(evt) {
     if (match.match(evt, keys.ArrowDown)) {

package/lib/components/PageHeader/PageHeader.d.ts

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { type ComponentType, type FunctionComponent } from 'react';
+import PropTypes from 'prop-types';
 import { Tabs as BaseTabs } from '../Tabs/Tabs';
 /**
  * ----------
@@ -48,10 +49,6 @@ interface PageHeaderContentProps {
      * The PageHeaderContent's title
      */
     title: string;
-    /**
-     * The PageHeaderContent's subtitle
-     */
-    subtitle?: string;
     /**
      * The PageHeaderContent's contextual actions
      */
@@ -62,6 +59,88 @@ interface PageHeaderContentProps {
     pageActions?: React.ReactNode;
 }
 declare const PageHeaderContent: React.ForwardRefExoticComponent<PageHeaderContentProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * ----------------
+ * PageHeaderContentPageActions
+ * ----------------
+ */
+interface PageHeaderContentPageActionsProps {
+    /**
+     * Provide child elements to be rendered inside PageHeaderContentPageActions.
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be added to your PageHeaderContentPageActions
+     */
+    className?: string;
+    /**
+     * The PageHeaderContent's page actions collapsible Menu button label
+     */
+    menuButtonLabel?: string;
+    /**
+     * The PageHeaderContent's page actions
+     */
+    pageActions?: React.ReactNode;
+}
+declare const PageHeaderContentPageActions: {
+    ({ className, children, menuButtonLabel, pageActions, ...other }: PageHeaderContentPageActionsProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderContentPageActions.
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify an optional className to be added to your PageHeaderContentPageActions
+         */
+        className: PropTypes.Requireable<string>;
+        /**
+         * The PageHeaderContent's collapsible Menu button label
+         */
+        menuButtonLabel: PropTypes.Requireable<string>;
+        /**
+         * The PageHeaderContent's page actions
+         */
+        pageActions: PropTypes.Requireable<NonNullable<any[] | PropTypes.ReactNodeLike>>;
+    };
+};
+/**
+ * ----------------
+ * PageHeaderContentText
+ * ----------------
+ */
+interface PageHeaderContentTextProps {
+    /**
+     * Provide child elements to be rendered inside PageHeaderContentText.
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be added to your PageHeaderContentText
+     */
+    className?: string;
+    /**
+     * The PageHeaderContent's subtitle
+     */
+    subtitle?: string;
+}
+declare const PageHeaderContentText: {
+    ({ className, children, subtitle, ...other }: PageHeaderContentTextProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderContentText.
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify an optional className to be added to your PageHeaderContentText
+         */
+        className: PropTypes.Requireable<string>;
+        /**
+         * The PageHeaderContent's subtitle
+         */
+        subtitle: PropTypes.Requireable<string>;
+    };
+};
 /**
  * ----------------
  * PageHeaderHeroImage
@@ -77,7 +156,20 @@ interface PageHeaderHeroImageProps {
      */
     className?: string;
 }
-declare const PageHeaderHeroImage: React.ForwardRefExoticComponent<PageHeaderHeroImageProps & React.RefAttributes<HTMLDivElement>>;
+declare const PageHeaderHeroImage: {
+    ({ className, children, ...other }: PageHeaderHeroImageProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderHeroImage.
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify an optional className to be added to your PageHeaderHeroImage
+         */
+        className: PropTypes.Requireable<string>;
+    };
+};
 /**
  * ----------------
  * PageHeaderTabBar
@@ -101,8 +193,61 @@ declare const PageHeaderTabs: React.ForwardRefExoticComponent<PageHeaderTabsProp
 declare const Root: React.ForwardRefExoticComponent<PageHeaderProps & React.RefAttributes<HTMLDivElement>>;
 declare const BreadcrumbBar: React.ForwardRefExoticComponent<PageHeaderBreadcrumbBarProps & React.RefAttributes<HTMLDivElement>>;
 declare const Content: React.ForwardRefExoticComponent<PageHeaderContentProps & React.RefAttributes<HTMLDivElement>>;
-declare const HeroImage: React.ForwardRefExoticComponent<PageHeaderHeroImageProps & React.RefAttributes<HTMLDivElement>>;
+declare const ContentPageActions: {
+    ({ className, children, menuButtonLabel, pageActions, ...other }: PageHeaderContentPageActionsProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderContentPageActions.
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify an optional className to be added to your PageHeaderContentPageActions
+         */
+        className: PropTypes.Requireable<string>;
+        /**
+         * The PageHeaderContent's collapsible Menu button label
+         */
+        menuButtonLabel: PropTypes.Requireable<string>;
+        /**
+         * The PageHeaderContent's page actions
+         */
+        pageActions: PropTypes.Requireable<NonNullable<any[] | PropTypes.ReactNodeLike>>;
+    };
+};
+declare const ContentText: {
+    ({ className, children, subtitle, ...other }: PageHeaderContentTextProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderContentText.
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify an optional className to be added to your PageHeaderContentText
+         */
+        className: PropTypes.Requireable<string>;
+        /**
+         * The PageHeaderContent's subtitle
+         */
+        subtitle: PropTypes.Requireable<string>;
+    };
+};
+declare const HeroImage: {
+    ({ className, children, ...other }: PageHeaderHeroImageProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderHeroImage.
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify an optional className to be added to your PageHeaderHeroImage
+         */
+        className: PropTypes.Requireable<string>;
+    };
+};
 declare const TabBar: React.ForwardRefExoticComponent<PageHeaderTabBarProps & React.RefAttributes<HTMLDivElement>>;
 declare const Tabs: React.ForwardRefExoticComponent<PageHeaderTabsProps & React.RefAttributes<HTMLDivElement>>;
-export { PageHeader, PageHeaderBreadcrumbBar, PageHeaderContent, PageHeaderHeroImage, PageHeaderTabBar, PageHeaderTabs, Root, BreadcrumbBar, Content, HeroImage, TabBar, Tabs, };
-export type { PageHeaderProps, PageHeaderBreadcrumbBarProps, PageHeaderContentProps, PageHeaderHeroImageProps, PageHeaderTabBarProps, PageHeaderTabsProps, };
+export { PageHeader, PageHeaderBreadcrumbBar, PageHeaderContent, PageHeaderContentPageActions, PageHeaderContentText, PageHeaderHeroImage, PageHeaderTabBar, PageHeaderTabs, Root, BreadcrumbBar, Content, ContentPageActions, ContentText, HeroImage, TabBar, Tabs, };
+export type { PageHeaderProps, PageHeaderBreadcrumbBarProps, PageHeaderContentProps, PageHeaderContentPageActionsProps, PageHeaderContentTextProps, PageHeaderHeroImageProps, PageHeaderTabBarProps, PageHeaderTabsProps, };