@carbon/ibm-products 2.84.0 → 2.85.0

package/es/components/Coachmark/next/Coachmark/ContentHeader.js

@@ -34,7 +34,8 @@ const ContentHeader = /*#__PURE__*/forwardRef((props, ref) => {
   const dragRef = useRef(null);
   const handleRef = ref || headerRef;
   const contentHeaderBlockClass = `${blockClass}--content-header`;
-  const closeBubble = () => {
+  const closeBubble = e => {
+    e?.stopPropagation();
     onClose?.();
     setOpen(false);
   };

package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js

@@ -190,7 +190,18 @@ const ConditionBuilderItem = _ref => {
     role: "gridcell",
     className: `${popOverClassName} ${blockClass}__popover`,
     ref: popoverRef,
-    onRequestClose: closePopover
+    onRequestClose: () => {
+      // Workaround: prevent closing the popover when a date is selected
+      // from the flatpickr calendar, which is rendered outside the popover DOM.
+      // The flatpickr calendar is appended outside the popover DOM, so clicks on it
+      // trigger onRequestClose. We use the global event object to check the click target.
+      // carbon issue: https://github.com/carbon-design-system/carbon/issues/21690
+      const target = event?.target;
+      if (target?.closest('.flatpickr-calendar')) {
+        return;
+      }
+      closePopover();
+    }
   }, /*#__PURE__*/React__default.createElement(ConditionBuilderButton, _extends({
     label: getLabel(),
     hideLabel: !label ? true : false,

package/es/components/CreateTearsheet/CreateTearsheet.d.ts

@@ -13,6 +13,7 @@ export interface StepsContextType {
     setOnPrevious: (fn: any) => void;
     setOnNext: (fn: any) => void;
     setOnMount: (fn: any) => void;
+    setSecondaryButtonDisabled?: Dispatch<SetStateAction<boolean>>;
     setStepData: Dispatch<SetStateAction<Step[]>>;
     stepData: Step[];
 }

package/es/components/CreateTearsheet/CreateTearsheet.js

@@ -72,6 +72,7 @@ const CreateTearsheet = /*#__PURE__*/forwardRef((_ref, ref) => {
   const [onPrevious, setOnPrevious] = useState();
   const [onNext, setOnNext] = useState();
   const [onMount, setOnMount] = useState();
+  const [secondaryButtonDisabled, setSecondaryButtonDisabled] = useState(false);
   const [stepData, setStepData] = useState([]);
   const [firstIncludedStep, setFirstIncludedStep] = useState(1);
   const [lastIncludedStep, setLastIncludedStep] = useState();
@@ -137,6 +138,7 @@ const CreateTearsheet = /*#__PURE__*/forwardRef((_ref, ref) => {
     submitButtonText,
     nextButtonText,
     isSubmitting,
+    secondaryButtonDisabled,
     componentBlockClass: blockClass,
     experimentalSecondarySubmit,
     experimentalSecondarySubmitText: experimentalSecondarySubmit?.labelText ? experimentalSecondarySubmit.labelText : experimentalSecondarySubmitText,
@@ -177,6 +179,7 @@ const CreateTearsheet = /*#__PURE__*/forwardRef((_ref, ref) => {
       setOnPrevious: fn => setOnPrevious(() => fn),
       setOnNext: fn => setOnNext(() => fn),
       setOnMount: fn => setOnMount(() => fn),
+      setSecondaryButtonDisabled,
       setStepData,
       stepData
     }

package/es/components/CreateTearsheet/CreateTearsheetStep.d.ts

@@ -89,6 +89,10 @@ interface CreateTearsheetStepBaseProps extends PropsWithChildren {
      * Optional function to be called when you move to the previous step.
      */
     onPrevious?: () => void;
+    /**
+     * This will conditionally disable the secondary (Back) button in the multi step Tearsheet
+     */
+    secondaryButtonDisabled?: boolean;
     /**
      * Sets the optional secondary label on the progress step component
      */

package/es/components/CreateTearsheet/CreateTearsheetStep.js

@@ -52,6 +52,7 @@ const CreateTearsheetStep = /*#__PURE__*/forwardRef((_ref, ref) => {
     onMount,
     onNext,
     onPrevious,
+    secondaryButtonDisabled,
     secondaryLabel,
     subtitle,
     title,
@@ -98,11 +99,12 @@ const CreateTearsheetStep = /*#__PURE__*/forwardRef((_ref, ref) => {
       stepsContext.setIsDisabled(!!disableSubmit);
       stepsContext?.setOnNext(onNext); // needs to be updated here otherwise there could be stale state values from only initially setting onNext
       stepsContext?.setOnPrevious(onPrevious);
+      stepsContext?.setSecondaryButtonDisabled?.(!!secondaryButtonDisabled);
 
       //Handle props for experimentalSecondarySubmit button, depending on state change
       stepsContext?.setExperimentalSecondarySubmit(experimentalSecondarySubmit);
     }
-  }, [stepsContext, stepNumber, disableSubmit, onNext, onPrevious, stepRef, stepRefValue, experimentalSecondarySubmit]);
+  }, [stepsContext, stepNumber, disableSubmit, onNext, onPrevious, secondaryButtonDisabled, stepRef, stepRefValue, experimentalSecondarySubmit]);
   const renderDescription = () => {
     if (description) {
       if (typeof description === 'string') {
@@ -222,6 +224,10 @@ CreateTearsheetStep.propTypes = {
    * Optional function to be called when you move to the previous step.
    */
   onPrevious: PropTypes.func,
+  /**
+   * This will conditionally disable the secondary (Back) button in the multi step Tearsheet
+   */
+  secondaryButtonDisabled: PropTypes.bool,
   /**
    * Sets the optional secondary label on the progress step component
    */

package/es/components/EditInPlace/EditInPlace.d.ts

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { PropsWithChildren } from 'react';
+import PropTypes from 'prop-types';
 type Size = 'sm' | 'md' | 'lg';
 type AlignPropType = 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right';
 type Shape = {
@@ -68,13 +69,23 @@ export interface EditInplaceProps extends PropsWithChildren {
     /**
      * determines if the input is in readOnly mode
      */
+    readOnly: PropTypes.bool;
     /**
-     * label for the edit button that displays when in read only mode
+     * label for the edit off button that displays when in read only mode
      */
+    readOnlyLabel?: PropTypes.string;
+    /**
+     * text for the toggletip that displays when in read only mode
+     */
+    readOnlyToggleTipText?: string;
     /**
      * label for save button
      */
     saveLabel: string;
+    /**
+     * alignment for the toggletip that displays when in read only mode
+     */
+    toggleTipAlignment?: AlignPropType;
     /**
      * vertical size of control
      */

package/es/components/EditInPlace/EditInPlace.js

@@ -6,15 +6,15 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import { WarningFilled, Close, Checkmark, Edit } from '@carbon/react/icons';
+import { WarningFilled, EditOff, Close, Checkmark, Edit } from '@carbon/react/icons';
 import React__default, { forwardRef, useState, useRef, useEffect } from 'react';
 import { pkg } from '../../settings.js';
-import { usePrefix, IconButton } from '@carbon/react';
+import { usePrefix, Toggletip, ToggletipButton, ToggletipContent, IconButton } from '@carbon/react';
 import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 
-var _Close, _Checkmark, _Edit;
+var _EditOff, _Close, _Checkmark, _Edit;
 const componentName = 'EditInPlace';
 const blockClass = `${pkg.prefix}--edit-in-place`;
 const defaults = {
@@ -34,10 +34,12 @@ const EditInPlace = /*#__PURE__*/forwardRef((_ref, ref) => {
     onChange,
     onSave,
     onBlur,
-    // readOnly,
-    // readOnlyLabel,
+    readOnly,
+    readOnlyLabel,
+    readOnlyToggleTipText,
     saveLabel,
     size = 'sm',
+    toggleTipAlignment,
     tooltipAlignment,
     value,
     placeholder,
@@ -77,10 +79,6 @@ const EditInPlace = /*#__PURE__*/forwardRef((_ref, ref) => {
     onChange(target.value);
   };
   const onFocusHandler = e => {
-    // if (readOnly) {
-    //   return;
-    // }
-
     if (!isTargetingChild(e)) {
       inputRef.current?.focus();
       setFocused(true);
@@ -143,37 +141,49 @@ const EditInPlace = /*#__PURE__*/forwardRef((_ref, ref) => {
     }
     escaping.current = false;
   };
-  return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
-    ref: ref
-  }, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement("div", {
-    className: cx(blockClass, `${blockClass}--${size}`, {
-      [`${blockClass}--focused`]: focused,
-      [`${blockClass}--invalid`]: invalid,
-      [`${blockClass}--inherit-type`]: inheritTypography,
-      [`${blockClass}--overflows`]: inputRef.current && inputRef.current.scrollWidth > inputRef.current.offsetWidth
-      // [`${blockClass}--readonly`]: readOnly,
-    }),
-    onFocus: onFocusHandler,
-    onBlur: onBlurHandler
-  }, /*#__PURE__*/React__default.createElement("input", {
+  const inputElement = /*#__PURE__*/React__default.createElement("input", {
     id: id,
     className: cx(`${blockClass}__text-input`, `${carbonPrefix}--text-input`, `${carbonPrefix}--text-input--${size}`),
     type: "text",
     placeholder: placeholder,
     value: value,
     onChange: onChangeHandler,
-    ref: inputRef
-    // readOnly={readOnly}
-    ,
+    ref: inputRef,
+    readOnly: readOnly,
     onKeyDown: onKeyHandler,
     "aria-label": labelText,
     "aria-invalid": invalid
-  }), /*#__PURE__*/React__default.createElement("div", {
+  });
+  const inputContainer = /*#__PURE__*/React__default.createElement("div", {
+    className: cx(blockClass, `${blockClass}--${size}`, {
+      [`${blockClass}--focused`]: focused,
+      [`${blockClass}--invalid`]: invalid,
+      [`${blockClass}--inherit-type`]: inheritTypography,
+      [`${blockClass}--overflows`]: inputRef.current && inputRef.current.scrollWidth > inputRef.current.offsetWidth,
+      [`${blockClass}--readonly`]: readOnly
+    }),
+    onFocus: onFocusHandler,
+    onBlur: onBlurHandler
+  }, readOnly ? /*#__PURE__*/React__default.createElement(Toggletip, {
+    align: toggleTipAlignment,
+    className: `${blockClass}__toggletip-wrapper`
+  }, /*#__PURE__*/React__default.createElement(ToggletipButton, {
+    label: readOnlyLabel || 'Edit off'
+  }, inputElement), /*#__PURE__*/React__default.createElement(ToggletipContent, null, /*#__PURE__*/React__default.createElement("p", null, readOnlyToggleTipText || 'This field is read-only and cannot be edited'))) : inputElement, /*#__PURE__*/React__default.createElement("div", {
     className: `${blockClass}__toolbar`
   }, invalid && /*#__PURE__*/React__default.createElement(WarningFilled, {
     size: 16,
     className: `${blockClass}__warning-icon`
-  }), focused ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(IconButton, {
+  }), readOnly ? /*#__PURE__*/React__default.createElement(IconButton, {
+    className: `${blockClass}__btn-readonly`,
+    size: size,
+    label: readOnlyLabel || 'Edit off',
+    kind: "ghost",
+    key: "readonly",
+    onClick: onFocusHandler
+  }, _EditOff || (_EditOff = /*#__PURE__*/React__default.createElement(EditOff, {
+    size: 16
+  }))) : focused ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(IconButton, {
     align: tipAlignments.cancel,
     size: size,
     label: cancelLabel,
@@ -206,7 +216,10 @@ const EditInPlace = /*#__PURE__*/forwardRef((_ref, ref) => {
     key: "edit"
   }, _Edit || (_Edit = /*#__PURE__*/React__default.createElement(Edit, {
     size: 16
-  }))))), invalid && /*#__PURE__*/React__default.createElement("p", {
+  })))));
+  return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+    ref: ref
+  }, getDevtoolsProps(componentName)), inputContainer, invalid && /*#__PURE__*/React__default.createElement("p", {
     className: `${blockClass}__warning-text`
   }, invalidText ?? deprecated_invalidLabel));
 });
@@ -280,11 +293,15 @@ EditInPlace.propTypes = {
   /**
    * determines if the input is in readOnly mode
    */
-  // readOnly: PropTypes.bool,
+  readOnly: PropTypes.bool,
+  /**
+   * label for the edit off button that displays when in read only mode
+   */
+  readOnlyLabel: PropTypes.string,
   /**
-   * label for the edit button that displays when in read only mode
+   * text for the toggletip that displays when in read only mode
    */
-  // readOnlyLabel: PropTypes.string,
+  readOnlyToggleTipText: PropTypes.string,
   /**
    * label for save button
    */
@@ -293,6 +310,10 @@ EditInPlace.propTypes = {
    * vertical size of control
    */
   size: PropTypes.oneOf(['sm', 'md', 'lg']),
+  /**
+   * alignment for the toggletip that displays when in read only mode
+   */
+  toggleTipAlignment: alignPropType,
   /**
    * tooltipAlignment from the standard tooltip. Default center.
    *

package/es/components/ImportModal/ImportModal.d.ts

@@ -59,6 +59,10 @@ export interface ImportModalProps {
      * Label that appears when a file is uploaded to show number of files (1 / 1)
      */
     fileUploadLabel?: string;
+    /**
+     * Hide input label
+     */
+    hideInputLabel?: boolean;
     /**
      * Button icon for import by url button
      */
@@ -74,7 +78,7 @@ export interface ImportModalProps {
     /**
      * Header to display above import by url
      */
-    inputLabel?: string;
+    inputLabel: string;
     /**
      * Placeholder for text input
      */

package/es/components/ImportModal/ImportModal.js

@@ -31,6 +31,7 @@ const ImportModal = /*#__PURE__*/forwardRef((_ref, ref) => {
     fileDropHeader,
     fileDropLabel,
     fileUploadLabel,
+    hideInputLabel,
     inputButtonIcon,
     inputButtonText,
     inputId,
@@ -180,18 +181,19 @@ const ImportModal = /*#__PURE__*/forwardRef((_ref, ref) => {
     onAddFiles: onAddFile,
     disabled: hasFiles,
     "data-modal-primary-focus": true
-  }), inputLabel && /*#__PURE__*/React__default.createElement("p", {
-    className: `${blockClass}__label`
-  }, inputLabel), /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React__default.createElement("div", {
     className: `${blockClass}__input-group`
   }, /*#__PURE__*/React__default.createElement(TextInput, {
-    labelText: "",
+    labelText: /*#__PURE__*/React__default.createElement("p", {
+      className: `${blockClass}__label`
+    }, inputLabel),
     id: inputId || '',
     onChange: inputHandler,
     placeholder: inputPlaceholder,
     value: importUrl,
     disabled: hasFiles,
-    "aria-label": inputLabel
+    "aria-label": inputLabel,
+    hideLabel: hideInputLabel
   }), /*#__PURE__*/React__default.createElement(Button, {
     onClick: fetchFile,
     className: `${blockClass}__import-button`,
@@ -273,6 +275,10 @@ ImportModal.propTypes = {
    * Label that appears when a file is uploaded to show number of files (1 / 1)
    */
   fileUploadLabel: PropTypes.string,
+  /**
+   * Hide input label
+   */
+  hideInputLabel: PropTypes.bool,
   /**
    * Button icon for import by url button
    */
@@ -288,7 +294,7 @@ ImportModal.propTypes = {
   /**
    * Header to display above import by url
    */
-  inputLabel: PropTypes.string,
+  inputLabel: PropTypes.string.isRequired,
   /**
    * Placeholder for text input
    */

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

@@ -1,226 +1,30 @@
 /**
- * Copyright IBM Corp. 2025, 2025
+ * Copyright IBM Corp. 2025, 2026
  *
  * 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 { IconButtonProps, BreadcrumbItemProps, BreadcrumbProps } from '@carbon/react';
+import React from 'react';
+import { PageHeaderBreadcrumbBar, type PageHeaderBreadcrumbBarProps } from './PageHeaderBreadcrumbBar';
+import { PageHeaderContent, type PageHeaderContentProps } from './PageHeaderContent';
+import { PageHeaderContentPageActions, type PageHeaderContentPageActionsProps } from './PageHeaderContentPageActions';
+import { PageHeaderContentText, type PageHeaderContentTextProps } from './PageHeaderContentText';
+import { PageHeaderHeroImage, type PageHeaderHeroImageProps } from './PageHeaderHeroImage';
+import { PageHeaderTabBar, type PageHeaderTabBarProps } from './PageHeaderTabBar';
+import { PageHeaderTagOverflow, type PageHeaderTagOverflowProps } from './PageHeaderTagOverflow';
+import { PageHeaderScrollButton, type PageHeaderScrollButtonProps } from './PageHeaderScrollButton';
+import { PageHeaderTitleBreadcrumb } from './PageHeaderTitleBreadcrumb';
+import { PageHeaderBreadcrumbOverflow, type PageHeaderBreadcrumbOverflowProps } from './PageHeaderBreadcrumbOverflow';
 /**
  * ----------
  * PageHeader
  * ----------
  */
-interface PageHeaderProps {
+export 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 PageHeaderTabBarProps {
-    children?: React.ReactNode;
-    className?: string;
-    tags?: React.ReactNode;
-    scroller?: React.ReactNode;
-}
-declare const PageHeaderTabBar: React.ForwardRefExoticComponent<PageHeaderTabBarProps & React.RefAttributes<HTMLDivElement>>;
-interface PageHeaderTagOverflowProps {
-    children: React.ReactNode;
-    renderOverflowTag?: (hiddenBreadcrumbs: HTMLElement[], handleOverflowClick: (event: React.MouseEvent) => void, openPopover: boolean) => React.ReactElement;
-    renderPopoverContent?: (hiddenBreadcrumbs: HTMLElement[]) => React.ReactElement;
-}
-declare const PageHeaderTagOverflow: React.ForwardRefExoticComponent<PageHeaderTagOverflowProps & React.RefAttributes<HTMLDivElement>>;
-interface PageHeaderScrollButtonProps extends IconButtonProps {
-    collapseText?: string;
-    expandText?: string;
-}
-declare const PageHeaderScrollButton: React.ForwardRefExoticComponent<PageHeaderScrollButtonProps & React.RefAttributes<HTMLDivElement>>;
-declare const PageHeaderTitleBreadcrumb: React.ForwardRefExoticComponent<BreadcrumbItemProps & React.RefAttributes<HTMLLIElement>>;
-interface PageHeaderBreadcrumbOverflowProps extends BreadcrumbProps {
-    renderOverflowBreadcrumb?: (hiddenBreadcrumbs: HTMLElement[]) => React.ReactElement<BreadcrumbItemProps>;
-}
-declare const PageHeaderBreadcrumbOverflow: React.ForwardRefExoticComponent<PageHeaderBreadcrumbOverflowProps & React.RefAttributes<HTMLElement>>;
 /**
  * -------
  * Exports
@@ -233,21 +37,9 @@ 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;
     };
 };
@@ -255,17 +47,8 @@ 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;
     };
 };
@@ -273,20 +56,14 @@ 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>>;
 declare const ScrollButton: React.ForwardRefExoticComponent<PageHeaderScrollButtonProps & React.RefAttributes<HTMLDivElement>>;
-declare const TitleBreadcrumb: React.ForwardRefExoticComponent<BreadcrumbItemProps & React.RefAttributes<HTMLLIElement>>;
+declare const TitleBreadcrumb: React.ForwardRefExoticComponent<import("@carbon/react").BreadcrumbItemProps & React.RefAttributes<HTMLLIElement>>;
 declare const BreadcrumbOverflow: React.ForwardRefExoticComponent<PageHeaderBreadcrumbOverflowProps & React.RefAttributes<HTMLElement>>;
 declare const TagOverflow: React.ForwardRefExoticComponent<PageHeaderTagOverflowProps & React.RefAttributes<HTMLDivElement>>;
 export { PageHeader, PageHeaderBreadcrumbBar, PageHeaderContent, PageHeaderContentPageActions, PageHeaderContentText, PageHeaderHeroImage, PageHeaderTabBar, PageHeaderScrollButton, PageHeaderTitleBreadcrumb, PageHeaderBreadcrumbOverflow, PageHeaderTagOverflow, Root, BreadcrumbBar, Content, ContentPageActions, ContentText, HeroImage, TabBar, ScrollButton, TitleBreadcrumb, BreadcrumbOverflow, TagOverflow, };
-export type { PageHeaderProps, PageHeaderBreadcrumbBarProps, PageHeaderContentProps, PageHeaderContentPageActionsProps, PageHeaderContentTextProps, PageHeaderHeroImageProps, PageHeaderTabBarProps, PageHeaderScrollButtonProps, PageHeaderTagOverflowProps, };
+export type { PageHeaderBreadcrumbBarProps, PageHeaderContentProps, PageHeaderContentPageActionsProps, PageHeaderContentTextProps, PageHeaderHeroImageProps, PageHeaderTabBarProps, PageHeaderScrollButtonProps, PageHeaderTagOverflowProps, PageHeaderBreadcrumbOverflowProps, };