@carbon/ibm-products 2.70.1 → 2.71.0

package/es/components/InterstitialScreen/InterstitialScreen.js

@@ -47,9 +47,9 @@ let InterstitialScreen = /*#__PURE__*/React__default.forwardRef((props, ref) =>
   const {
     children,
     className,
-    interstitialAriaLabel = 'Interstitial screen',
+    ariaLabel = 'Interstitial screen',
     isFullScreen = false,
-    isOpen = false,
+    open = false,
     launcherButtonRef,
     onClose,
     ...rest
@@ -76,21 +76,21 @@ let InterstitialScreen = /*#__PURE__*/React__default.forwardRef((props, ref) =>
     onClose?.(actionName ?? 'close');
   }, [onClose]);
   useEffect(() => {
-    if (!isOpen) {
+    if (!open) {
       setProgStep(0);
     }
     startButtonRef.current?.focus();
-  }, [isOpen, progStep, onClose]);
+  }, [open, progStep, onClose]);
   useEffect(() => {
     // for modal only, "is-visible" triggers animation
-    setIsVisibleClass(!isFullScreen && isOpen ? 'is-visible' : null);
+    setIsVisibleClass(!isFullScreen && open ? 'is-visible' : null);
     nextButtonRef?.current?.focus();
-    if (!isOpen && launcherButtonRef) {
+    if (!open && launcherButtonRef) {
       setTimeout(() => {
         launcherButtonRef.current.focus();
       }, 0);
     }
-  }, [launcherButtonRef, isFullScreen, isOpen]);
+  }, [launcherButtonRef, isFullScreen, open]);
 
   // hitting escape key also closes this component
   useEffect(() => {
@@ -105,7 +105,7 @@ let InterstitialScreen = /*#__PURE__*/React__default.forwardRef((props, ref) =>
     window.addEventListener('keydown', close);
     return () => window.removeEventListener('keydown', close);
   }, [handleClose]);
-  if (!isOpen) {
+  if (!open) {
     return null;
   }
   const renderModal = () => {
@@ -119,9 +119,9 @@ let InterstitialScreen = /*#__PURE__*/React__default.forwardRef((props, ref) =>
       ),
       size: "lg",
       onClose: handleClose,
-      open: isOpen,
+      open: open,
       ref: _forwardedRef,
-      "aria-label": interstitialAriaLabel
+      "aria-label": ariaLabel
     }, getDevtoolsProps(componentName)), children));
   };
   const renderFullScreen = () => {
@@ -132,7 +132,7 @@ let InterstitialScreen = /*#__PURE__*/React__default.forwardRef((props, ref) =>
       // Apply any supplied class names to the main HTML element.
       variantClass, isVisibleClass),
       role: "main",
-      "aria-label": interstitialAriaLabel,
+      "aria-label": ariaLabel,
       ref: ref
     }, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement("div", {
       className: `${blockClass}--container`
@@ -181,6 +181,10 @@ InterstitialScreen.displayName = componentName;
 // in alphabetical order (for consistency).
 // See https://www.npmjs.com/package/prop-types#usage.
 InterstitialScreen.propTypes = {
+  /**
+   * The aria label applied to the Interstitial Screen component
+   */
+  ariaLabel: PropTypes.string,
   children: PropTypes.node,
   /**
    * Provide an optional class to be applied to the containing node.
@@ -190,19 +194,11 @@ InterstitialScreen.propTypes = {
    * Tooltip text and aria label for the Close button icon.
    */
   closeIconDescription: PropTypes.string,
-  /**
-   * The aria label applied to the Interstitial Screen component
-   */
-  interstitialAriaLabel: PropTypes.string,
   /**
    * Specifies whether the component is shown as a full-screen
    * experience, else it is shown as a modal by default.
    */
   isFullScreen: PropTypes.bool,
-  /**
-   * Specifies whether the component is currently open.
-   */
-  isOpen: PropTypes.bool,
   /**
    * Provide a ref to return focus to once the interstitial is closed.
    */
@@ -210,7 +206,11 @@ InterstitialScreen.propTypes = {
   /**
    * Function to call when the close button is clicked.
    */
-  onClose: PropTypes.func
+  onClose: PropTypes.func,
+  /**
+   * Specifies whether the component is currently open.
+   */
+  open: PropTypes.bool
 };
 
-export { InterstitialScreen, InterstitialScreenContext };
+export { InterstitialScreen, InterstitialScreenContext, blockClass };

package/es/components/InterstitialScreen/InterstitialScreenBody.d.ts

@@ -13,15 +13,21 @@ type contentRendererArgs = {
     disableActionButton: (value: disableButtonConfigType) => void;
 };
 export interface InterstitialScreenBodyProps {
+    /**
+     * Optional static content for body
+     */
+    children?: ReactNode;
     /**
      * Provide an optional class to be applied to the containing node.
      */
     className?: string;
     /**
-     * This is a required callback that has to return the content to render in the body section.
-     * It can be a single child or an array of children depending on your need
+     *You can provide content either through a callback (contentRenderer) or as static children—but not both.
+     * If both are provided, contentRenderer always takes precedence. This optional callback should return the content
+     * to be rendered in the body section, which can be either a single element or an array of elements based on your needs.
+     * If internal state access isn’t required, you can simply use static children instead
      */
-    contentRenderer: (config: contentRendererArgs) => ReactElement<EnrichedChildren> | ReactNode;
+    contentRenderer?: (config: contentRendererArgs) => ReactElement<EnrichedChildren> | ReactNode;
 }
 declare const InterstitialScreenBody: React.ForwardRefExoticComponent<InterstitialScreenBodyProps & React.RefAttributes<HTMLDivElement>>;
 export default InterstitialScreenBody;

package/es/components/InterstitialScreen/InterstitialScreenBody.js

@@ -8,11 +8,11 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useState, useContext, useEffect, isValidElement } from 'react';
 import PropTypes from '../../_virtual/index.js';
-import { InterstitialScreenContext } from './InterstitialScreen.js';
+import { InterstitialScreenContext, blockClass } from './InterstitialScreen.js';
 import { ModalBody } from '@carbon/react';
-import { pkg } from '../../settings.js';
 import { Carousel } from '../Carousel/Carousel.js';
 import '../Carousel/CarouselItem.js';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 
 const InterstitialScreenBody = /*#__PURE__*/React__default.forwardRef((props, ref) => {
   const {
@@ -20,7 +20,6 @@ const InterstitialScreenBody = /*#__PURE__*/React__default.forwardRef((props, re
     contentRenderer,
     ...rest
   } = props;
-  const blockClass = `${pkg.prefix}--interstitial-screen`;
   const bodyBlockClass = `${blockClass}--internal-body`;
   const [stepType, setStepType] = useState();
   const {
@@ -38,11 +37,11 @@ const InterstitialScreenBody = /*#__PURE__*/React__default.forwardRef((props, re
   } = useContext(InterstitialScreenContext);
   const [scrollPercent, setScrollPercent] = useState(-1);
   useEffect(() => {
-    const _bodyContent = contentRenderer({
+    const _bodyContent = contentRenderer?.({
       handleGotoStep,
       progStep,
       disableActionButton
-    });
+    }) ?? props.children;
     const isElement = /*#__PURE__*/isValidElement(_bodyContent);
     const children = isElement ? _bodyContent.props.children : _bodyContent;
 
@@ -76,7 +75,7 @@ const InterstitialScreenBody = /*#__PURE__*/React__default.forwardRef((props, re
   const renderBody = () => /*#__PURE__*/React__default.createElement("div", _extends({
     className: `${blockClass}--body ${className}`,
     ref: bodyScrollRef ?? ref
-  }, rest), /*#__PURE__*/React__default.createElement("div", {
+  }, getDevtoolsProps('InterstitialScreenBody'), isFullScreen ? rest : {}), /*#__PURE__*/React__default.createElement("div", {
     className: `${blockClass}--content`
   }, stepType === 'multi' ? /*#__PURE__*/React__default.createElement("div", {
     className: `${blockClass}__carousel`
@@ -85,21 +84,27 @@ const InterstitialScreenBody = /*#__PURE__*/React__default.forwardRef((props, re
     ref: scrollRef,
     onScroll: onScrollHandler
   }, bodyChildrenData)) : stepType === 'single' ? bodyChildrenData : ''));
-  return isFullScreen ? renderBody() : /*#__PURE__*/React__default.createElement(ModalBody, {
+  return isFullScreen ? renderBody() : /*#__PURE__*/React__default.createElement(ModalBody, _extends({
     ref: ref,
     className: bodyBlockClass
-  }, renderBody());
+  }, rest), renderBody());
 });
 InterstitialScreenBody.propTypes = {
+  /**
+   * Optional static content for body
+   */
+  children: PropTypes.node,
   /**
    * Provide an optional class to be applied to the containing node.
    */
   className: PropTypes.string,
   /**
-   * This is a required callback that has to return the content to render in the body section.
-   * It can be a single child or an array of children depending on your need
+   *You can provide content either through a callback (contentRenderer) or as static children—but not both.
+   * If both are provided, contentRenderer always takes precedence. This optional callback should return the content
+   * to be rendered in the body section, which can be either a single element or an array of elements based on your needs.
+   * If internal state access isn’t required, you can simply use static children instead
    */
-  contentRenderer: PropTypes.func.isRequired
+  contentRenderer: PropTypes.func
 };
 
 export { InterstitialScreenBody as default };

package/es/components/InterstitialScreen/InterstitialScreenFooter.js

@@ -7,12 +7,12 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useContext, useRef, useState, useEffect, useMemo } from 'react';
-import { pkg } from '../../settings.js';
 import PropTypes from '../../_virtual/index.js';
-import { InterstitialScreenContext } from './InterstitialScreen.js';
+import { InterstitialScreenContext, blockClass } from './InterstitialScreen.js';
 import { ModalFooter, Button, InlineLoading } from '@carbon/react';
 import { clamp } from '../../global/js/utils/clamp.js';
 import { ArrowRight } from '@carbon/react/icons';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 
 var _InlineLoading, _InlineLoading2, _InlineLoading3, _InlineLoading4;
 const InterstitialScreenFooter = /*#__PURE__*/React__default.forwardRef((props, ref) => {
@@ -23,9 +23,10 @@ const InterstitialScreenFooter = /*#__PURE__*/React__default.forwardRef((props,
     nextButtonLabel = 'Next',
     startButtonLabel = 'Get Started',
     actionButtonRenderer,
-    onAction
+    onAction,
+    ...rest
   } = props;
-  const blockClass = `${pkg.prefix}--interstitial-screen`;
+  const footerBlockClass = `${blockClass}--footer`;
   const {
     handleClose,
     progStep,
@@ -34,8 +35,8 @@ const InterstitialScreenFooter = /*#__PURE__*/React__default.forwardRef((props,
     disableButtonConfig,
     isFullScreen
   } = useContext(InterstitialScreenContext);
-  const startButtonRef = useRef(undefined);
-  const nextButtonRef = useRef(undefined);
+  const startButtonRef = useRef(null);
+  const nextButtonRef = useRef(null);
   const [loadingAction, setLoadingAction] = useState('');
   const isMultiStep = !!stepCount;
   const progStepFloor = 0;
@@ -78,10 +79,7 @@ const InterstitialScreenFooter = /*#__PURE__*/React__default.forwardRef((props,
     }
     return {};
   }, [loadingAction, isMultiStep, progStep, progStepCeil]);
-  const getFooterContent = () => /*#__PURE__*/React__default.createElement("div", {
-    ref: ref,
-    className: `${blockClass}--footer ${className}`
-  }, isMultiStep && skipButtonLabel !== '' && /*#__PURE__*/React__default.createElement(Button, {
+  const getFooterContent = () => /*#__PURE__*/React__default.createElement(React__default.Fragment, null, isMultiStep && skipButtonLabel !== '' && /*#__PURE__*/React__default.createElement(Button, {
     className: `${blockClass}--skip-btn`,
     kind: "ghost",
     size: "lg",
@@ -99,7 +97,7 @@ const InterstitialScreenFooter = /*#__PURE__*/React__default.forwardRef((props,
     onClick: handleClickPrev
   }, previousButtonLabel, loadingAction === 'back' && (_InlineLoading2 || (_InlineLoading2 = /*#__PURE__*/React__default.createElement(InlineLoading, null)))), isMultiStep && progStep < progStepCeil && /*#__PURE__*/React__default.createElement(Button, {
     className: `${blockClass}--next-btn`,
-    renderIcon: loadingAction !== 'next' ? ArrowRight : null,
+    renderIcon: loadingAction !== 'next' ? ArrowRight : undefined,
     ref: nextButtonRef,
     size: "lg",
     title: nextButtonLabel,
@@ -123,9 +121,13 @@ const InterstitialScreenFooter = /*#__PURE__*/React__default.forwardRef((props,
       disableButtonConfig
     }));
   }
-  return isFullScreen ? getFooterContent() : /*#__PURE__*/React__default.createElement(ModalFooter, {
+  return isFullScreen ? /*#__PURE__*/React__default.createElement("div", _extends({
+    ref: ref,
+    className: `${footerBlockClass} ${className}`
+  }, getDevtoolsProps('InterstitialScreenFooter'), isFullScreen ? rest : {}), getFooterContent()) : /*#__PURE__*/React__default.createElement(ModalFooter, _extends({
+    className: footerBlockClass,
     ref: ref
-  }, getFooterContent());
+  }, rest), getFooterContent());
 });
 InterstitialScreenFooter.propTypes = {
   /**

package/es/components/InterstitialScreen/InterstitialScreenHeader.js

@@ -5,13 +5,14 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { usePrefix, ModalHeader, ProgressIndicator, ProgressStep } from '@carbon/react';
 import React__default from 'react';
 import PropTypes from '../../_virtual/index.js';
-import { pkg } from '../../settings.js';
 import cx from 'classnames';
-import { InterstitialScreenContext } from './InterstitialScreen.js';
+import { InterstitialScreenContext, blockClass } from './InterstitialScreen.js';
 import { useId } from '../../global/js/utils/useId.js';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 
 const InterstitialScreenHeader = /*#__PURE__*/React__default.forwardRef((props, ref) => {
   var _h, _h2;
@@ -21,7 +22,8 @@ const InterstitialScreenHeader = /*#__PURE__*/React__default.forwardRef((props,
     headerSubTitle,
     closeIconDescription,
     hideProgressIndicator,
-    children
+    children,
+    ...rest
   } = props;
   const {
     bodyChildrenData,
@@ -30,7 +32,6 @@ const InterstitialScreenHeader = /*#__PURE__*/React__default.forwardRef((props,
     handleClose,
     stepCount
   } = React__default.useContext(InterstitialScreenContext);
-  const blockClass = `${pkg.prefix}--interstitial-screen`;
   const headerBlockClass = `${blockClass}--internal-header`;
   const _useId = useId();
   const carbonPrefix = usePrefix();
@@ -57,19 +58,23 @@ const InterstitialScreenHeader = /*#__PURE__*/React__default.forwardRef((props,
       className: `${carbonPrefix}--visually-hidden`
     }, "Step ", progStep + 1, " of ", stepCount)));
   };
-  return isFullScreen ? /*#__PURE__*/React__default.createElement("header", {
+  const closeModal = () => {
+    handleClose?.('close');
+  };
+  return isFullScreen ? /*#__PURE__*/React__default.createElement("header", _extends({
     ref: ref,
+    role: "presentation",
     className: cx(headerBlockClass, className, {
       [`${headerBlockClass}--has-title`]: headerTitle || headerSubTitle || children
     })
-  }, headerContent()) : /*#__PURE__*/React__default.createElement(ModalHeader, {
+  }, getDevtoolsProps('InterstitialScreenHeader'), rest), headerContent()) : /*#__PURE__*/React__default.createElement(ModalHeader, _extends({
     ref: ref,
     className: cx(headerBlockClass, className, {
       [`${headerBlockClass}--has-title`]: headerTitle || headerSubTitle || children
     }),
-    closeModal: handleClose,
+    closeModal: closeModal,
     iconDescription: closeIconDescription
-  }, headerContent());
+  }, getDevtoolsProps('InterstitialScreenHeader'), rest), headerContent());
 });
 InterstitialScreenHeader.propTypes = {
   /**

package/es/components/InterstitialScreen/index.d.ts

@@ -5,4 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 export { InterstitialScreen } from './InterstitialScreen';
-export type { InterstitialScreenProps } from './InterstitialScreen';
+export type { InterstitialScreenProps, InterstitialScreenComponent, disableButtonConfigType, ActionType, } from './InterstitialScreen';
+export type { InterstitialScreenBodyProps } from './InterstitialScreenBody';
+export type { InterstitialScreenFooterProps } from './InterstitialScreenFooter';
+export type { InterstitialScreenHeaderProps } from './InterstitialScreenHeader';

package/es/components/Nav/NavItemLink.js

@@ -10,7 +10,7 @@ import React__default from 'react';
 
 const NavItemLink = /*#__PURE__*/React__default.forwardRef(function NavItemLink(props, ref) {
   const {
-    element,
+    element = 'a',
     ...rest
   } = props;
   return /*#__PURE__*/React__default.createElement(element, {
@@ -23,8 +23,5 @@ NavItemLink.propTypes = {
   /** @type {elementType} The base element to use to build the link. Defaults to `a`, can also accept alternative tag names or custom components like `Link` from `react-router`. */
   element: PropTypes.elementType
 };
-NavItemLink.defaultProps = {
-  element: 'a'
-};
 
 export { NavItemLink as default };

package/es/components/PageHeader/PageHeaderTitle.js

@@ -45,7 +45,7 @@ const PageHeaderTitle = _ref => {
   } = title;
   let titleText;
   let isEditable = !!onSave;
-  const titleRef = useRef();
+  const titleRef = useRef(undefined);
   const isEllipsisApplied = useOverflowStringWidth(titleRef);
   if (text || !content) {
     if (text === undefined && typeof title === 'string') {

package/es/components/PageHeader/next/PageHeader.d.ts

@@ -0,0 +1,277 @@
+/**
+ * Copyright IBM Corp. 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, { type ComponentType, type FunctionComponent } from 'react';
+import { TYPES } from '@carbon/react/es/components/Tag/Tag';
+/**
+ * ----------
+ * PageHeader
+ * ----------
+ */
+interface PageHeaderProps {
+    children?: React.ReactNode;
+    className?: string;
+}
+declare const PageHeader: React.ForwardRefExoticComponent<PageHeaderProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * -----------------------
+ * PageHeaderBreadcrumbBar
+ * -----------------------
+ */
+interface PageHeaderBreadcrumbBarProps {
+    /**
+     * `true` by default to render BreadcrumbBar bottom border.
+     */
+    border?: boolean;
+    children?: React.ReactNode;
+    className?: string;
+    /**
+     * Provide an optional icon to render in front of the PageHeaderContent's title.
+     */
+    renderIcon?: ComponentType | FunctionComponent;
+    /**
+     * The PageHeaderBreadcrumbBar's content actions
+     */
+    contentActions?: React.ReactNode;
+    /**
+     * `true` to set content actions flush against page actions
+     */
+    contentActionsFlush?: boolean;
+    /**
+     * The PageHeaderContent's page actions
+     */
+    pageActions?: React.ReactNode;
+    /**
+     * `true` to set page actions flush with page
+     */
+    pageActionsFlush?: boolean;
+}
+declare const PageHeaderBreadcrumbBar: React.ForwardRefExoticComponent<PageHeaderBreadcrumbBarProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * -----------------
+ * PageHeaderContent
+ * -----------------
+ */
+interface PageHeaderContentProps {
+    /**
+     * Provide child elements to be rendered inside PageHeaderContent.
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be added to your PageHeaderContent
+     */
+    className?: string;
+    /**
+     * Provide an optional icon to render in front of the PageHeaderContent's title.
+     */
+    renderIcon?: ComponentType | FunctionComponent;
+    /**
+     * The PageHeaderContent's title
+     */
+    title: string;
+    /**
+     * The PageHeaderContent's contextual actions
+     */
+    contextualActions?: React.ReactNode;
+    /**
+     * The PageHeaderContent's page actions
+     */
+    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
+     */
+    actions?: React.ReactNode;
+}
+declare const PageHeaderContentPageActions: {
+    ({ className, children, menuButtonLabel, actions, ...other }: PageHeaderContentPageActionsProps): React.JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * The PageHeaderContent's page actions
+         */
+        actions: any;
+        /**
+         * Provide child elements to be rendered inside PageHeaderContentPageActions.
+         */
+        children: any;
+        /**
+         * Specify an optional className to be added to your PageHeaderContentPageActions
+         */
+        className: any;
+        /**
+         * The PageHeaderContent's collapsible Menu button label
+         */
+        menuButtonLabel: any;
+    };
+};
+/**
+ * ----------------
+ * 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): React.JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderContentText.
+         */
+        children: any;
+        /**
+         * Specify an optional className to be added to your PageHeaderContentText
+         */
+        className: any;
+        /**
+         * The PageHeaderContent's subtitle
+         */
+        subtitle: any;
+    };
+};
+/**
+ * ----------------
+ * PageHeaderHeroImage
+ * ----------------
+ */
+interface PageHeaderHeroImageProps {
+    /**
+     * Provide child elements to be rendered inside PageHeaderHeroImage.
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be added to your PageHeaderHeroImage
+     */
+    className?: string;
+}
+declare const PageHeaderHeroImage: {
+    ({ className, children, ...other }: PageHeaderHeroImageProps): React.JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderHeroImage.
+         */
+        children: any;
+        /**
+         * Specify an optional className to be added to your PageHeaderHeroImage
+         */
+        className: any;
+    };
+};
+/**
+ * ----------------
+ * PageHeaderTabBar
+ * ----------------
+ */
+interface TagItem {
+    type: keyof typeof TYPES;
+    text: string;
+    size?: 'sm' | 'md' | 'lg';
+    id: string;
+}
+interface PageHeaderTabBarProps {
+    children?: React.ReactNode;
+    className?: string;
+    tags?: TagItem[];
+}
+declare const PageHeaderTabBar: React.ForwardRefExoticComponent<PageHeaderTabBarProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * -------
+ * Exports
+ * -------
+ */
+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 ContentPageActions: {
+    ({ className, children, menuButtonLabel, actions, ...other }: PageHeaderContentPageActionsProps): React.JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * The PageHeaderContent's page actions
+         */
+        actions: any;
+        /**
+         * Provide child elements to be rendered inside PageHeaderContentPageActions.
+         */
+        children: any;
+        /**
+         * Specify an optional className to be added to your PageHeaderContentPageActions
+         */
+        className: any;
+        /**
+         * The PageHeaderContent's collapsible Menu button label
+         */
+        menuButtonLabel: any;
+    };
+};
+declare const ContentText: {
+    ({ className, children, subtitle, ...other }: PageHeaderContentTextProps): React.JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderContentText.
+         */
+        children: any;
+        /**
+         * Specify an optional className to be added to your PageHeaderContentText
+         */
+        className: any;
+        /**
+         * The PageHeaderContent's subtitle
+         */
+        subtitle: any;
+    };
+};
+declare const HeroImage: {
+    ({ className, children, ...other }: PageHeaderHeroImageProps): React.JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Provide child elements to be rendered inside PageHeaderHeroImage.
+         */
+        children: any;
+        /**
+         * Specify an optional className to be added to your PageHeaderHeroImage
+         */
+        className: any;
+    };
+};
+declare const TabBar: React.ForwardRefExoticComponent<PageHeaderTabBarProps & React.RefAttributes<HTMLDivElement>>;
+export { PageHeader, PageHeaderBreadcrumbBar, PageHeaderContent, PageHeaderContentPageActions, PageHeaderContentText, PageHeaderHeroImage, PageHeaderTabBar, Root, BreadcrumbBar, Content, ContentPageActions, ContentText, HeroImage, TabBar, };
+export type { PageHeaderProps, PageHeaderBreadcrumbBarProps, PageHeaderContentProps, PageHeaderContentPageActionsProps, PageHeaderContentTextProps, PageHeaderHeroImageProps, PageHeaderTabBarProps, };