@carbon/ibm-products 2.36.0 → 2.37.0

package/es/components/ExpressiveCard/ExpressiveCard.d.ts

@@ -1,2 +1,97 @@
-export let ExpressiveCard: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+import React, { PropsWithChildren, ReactNode } from 'react';
+type ActionIcon = {
+    id?: string;
+    icon?: () => void | object;
+    onKeydown?: () => void;
+    onClick?: () => void;
+    iconDescription?: string;
+    href?: string;
+};
+interface ExpressiveCardProps extends PropsWithChildren {
+    /**
+     * Icons that are displayed on card. Refer to design documentation for implementation guidelines. Note- href will supersede onClick
+     */
+    actionIcons?: ActionIcon[];
+    /**
+     * Content that shows in the body of the card
+     */
+    /**
+     * Optional user provided class
+     */
+    className?: string;
+    /**
+     * Optional header description
+     */
+    description?: string | object | ReactNode;
+    /**
+     * Optional label for the top of the card
+     */
+    label?: string | object | ReactNode;
+    /**
+     * Optional media content like an image to be placed in the card
+     */
+    media?: ReactNode;
+    /**
+     * Establishes the position of the media in the card
+     */
+    mediaPosition?: 'top' | 'left';
+    /**
+     * Provides the callback for a clickable card
+     */
+    onClick?: () => void;
+    /**
+     * Function that's called from the primary button or action icon
+     */
+    onPrimaryButtonClick?: () => void;
+    /**
+     * Function that's called from the secondary button
+     */
+    onSecondaryButtonClick?: () => void;
+    /**
+     * Provides the icon that's displayed at the top of the card
+     */
+    pictogram?: () => void | object;
+    /**
+     * Optionally specify an href for your Button to become an <a> element
+     */
+    primaryButtonHref?: string;
+    /**
+     * Optional prop to allow overriding the icon rendering. Can be a React component class
+     */
+    primaryButtonIcon?: () => void | object;
+    /**
+     * Establishes the kind of button displayed for the primary button
+     */
+    primaryButtonKind?: 'primary' | 'ghost';
+    /**
+     * The text that's displayed in the primary button
+     */
+    primaryButtonText?: string;
+    /**
+     * Optionally specify an href for your Button to become an <a> element
+     */
+    secondaryButtonHref?: string;
+    /**
+     * Optional prop to allow overriding the icon rendering. Can be a React component class
+     */
+    secondaryButtonIcon?: () => void | object;
+    /**
+     * Establishes the kind of button displayed for the secondary button
+     */
+    secondaryButtonKind?: 'secondary' | 'ghost';
+    /**
+     * The text that's displayed in the secondary button
+     */
+    secondaryButtonText?: string;
+    /**
+     * **Experimental:** For all cases a `Slug` component can be provided.
+     * Clickable tiles only accept a boolean value of true and display a hollow slug.
+     */
+    slug?: ReactNode | boolean;
+    /**
+     * Title that's displayed at the top of the card
+     */
+    title?: string | object | ReactNode;
+}
+export declare let ExpressiveCard: React.ForwardRefExoticComponent<ExpressiveCardProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/es/components/ExpressiveCard/ExpressiveCard.js

@@ -27,6 +27,7 @@ ExpressiveCard.propTypes = {
   /**
    * Icons that are displayed on card. Refer to design documentation for implementation guidelines. Note- href will supersede onClick
    */
+  /**@ts-ignore */
   actionIcons: PropTypes.arrayOf(PropTypes.shape({
     id: PropTypes.string,
     icon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
@@ -74,6 +75,7 @@ ExpressiveCard.propTypes = {
   /**
    * Provides the icon that's displayed at the top of the card
    */
+  /**@ts-ignore */
   pictogram: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * Optionally specify an href for your Button to become an <a> element
@@ -82,6 +84,7 @@ ExpressiveCard.propTypes = {
   /**
    * Optional prop to allow overriding the icon rendering. Can be a React component class
    */
+  /**@ts-ignore */
   primaryButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * Establishes the kind of button displayed for the primary button
@@ -98,6 +101,7 @@ ExpressiveCard.propTypes = {
   /**
    * Optional prop to allow overriding the icon rendering. Can be a React component class
    */
+  /**@ts-ignore */
   secondaryButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * Establishes the kind of button displayed for the secondary button

package/es/components/InlineTip/InlineTipButton.d.ts

@@ -1,5 +1,24 @@
+/**
+ * Copyright IBM Corp. 2023, 2024
+ *
+ * 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, { ReactNode } from 'react';
+interface InlineTipButtonProps {
+    /**
+     * Provide an optional class to be applied to the containing node.
+     */
+    className?: string;
+    /**
+     * Provide the contents of the InlineTip.
+     */
+    children: ReactNode;
+}
 /**
  * This is a standard Carbon button, styled specifically for use inside InlineTip.
  */
-export let InlineTipButton: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+export declare let InlineTipButton: React.ForwardRefExoticComponent<InlineTipButtonProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLButtonElement>>;
+export {};

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

@@ -1,8 +1,106 @@
+/**
+ * Copyright IBM Corp. 2024, 2024
+ *
+ * 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, { PropsWithChildren, ReactNode } from 'react';
+type Media = {
+    breakpoints?: {
+        xlg?: number;
+        lg?: number;
+    };
+} & ({
+    render?: () => ReactNode;
+    filePaths?: never;
+} | {
+    render?: never;
+    filePaths?: string[];
+});
+interface InterstitialScreenProps extends PropsWithChildren {
+    /**
+     * Provide the contents of the InterstitialScreen.
+     */
+    children: ReactNode;
+    /**
+     * Provide an optional class to be applied to the containing node.
+     */
+    className?: string;
+    /**
+     * Tooltip text and aria label for the Close button icon.
+     */
+    closeIconDescription?: string;
+    /**
+     * The domain this app belongs to, e.g. "IBM Cloud Pak".
+     */
+    domainName?: string;
+    /**
+     * Provide an optional class to be applied to the <header> element >.
+     */
+    headerClassName?: string;
+    /**
+     * Provide an optional class to be applied to the <header> element >.
+     */
+    headerTitle?: string;
+    /**
+     * Optional parameter to hide the progress indicator when multiple steps are used.
+     */
+    hideProgressIndicator?: boolean;
+    /**
+     * The aria label applied to the Interstitial Screen component
+     */
+    interstitialAriaLabel?: string;
+    /**
+     * Specifies whether the component is shown as a full-screen
+     * experience, else it is shown as a modal by default.
+     */
+    isFullScreen?: boolean;
+    /**
+     * Specifies whether the component is currently open.
+     */
+    isOpen?: boolean;
+    /**
+     * The object describing an image in one of two shapes.
+     *
+     * If a single media element is required, use `{render}`.
+     *
+     * If a stepped animation is required, use `{filePaths}`.
+     *
+     * Breakpoints are used to set the media content column size as well as the remainder for the main content areas column size.
+     * Medium and small breakpoints will be set to 0 internally to focus on the main content area.
+     * @see {@link MEDIA_PROP_TYPE}.
+     */
+    media?: Media;
+    /**
+     * The label for the Next button.
+     */
+    nextButtonLabel?: string;
+    /**
+     * Function to call when the close button is clicked.
+     */
+    onClose?: () => void;
+    /**
+     * The label for the Previous button.
+     */
+    previousButtonLabel?: string;
+    /**
+     * The name of this app, e.g. "QRadar".
+     */
+    productName?: string;
+    /**
+     * The label for the skip button.
+     */
+    skipButtonLabel?: string;
+    /**
+     * The label for the start button.
+     */
+    startButtonLabel?: string;
+}
 /**
  * InterstitialScreen can be a full page or an overlay, and are
  * shown on the first time a user accesses a new experience
  * (e.g. upon first login or first time opening a page where a
  * newly purchased capability is presented).
  */
-export let InterstitialScreen: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+export declare let InterstitialScreen: React.ForwardRefExoticComponent<InterstitialScreenProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/es/components/InterstitialScreen/InterstitialScreen.js

@@ -6,7 +6,7 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default, { useRef, useState, Children, useCallback, useEffect } from 'react';
+import React__default, { useRef, useState, Children, useCallback, useEffect, isValidElement } from 'react';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
@@ -51,7 +51,6 @@ var defaults = {
   skipButtonLabel: '',
   startButtonLabel: 'Get started'
 };
-
 /**
  * InterstitialScreen can be a full page or an overlay, and are
  * shown on the first time a user accesses a new experience
@@ -106,7 +105,7 @@ var InterstitialScreen = /*#__PURE__*/React__default.forwardRef(function (_ref,
   var childArray = Children.toArray(children);
   var isMultiStep = childArray.length > 1;
   var mediaIsDefined = (media === null || media === void 0 ? void 0 : media.render) || (media === null || media === void 0 ? void 0 : media.filePaths);
-  var bodyScrollRef = useRef();
+  var bodyScrollRef = useRef(null);
   var mediaBreakpoints = {
     xlg: (media === null || media === void 0 || (_media$breakpoints = media.breakpoints) === null || _media$breakpoints === void 0 ? void 0 : _media$breakpoints.xlg) || 0,
     lg: (media === null || media === void 0 || (_media$breakpoints2 = media.breakpoints) === null || _media$breakpoints2 === void 0 ? void 0 : _media$breakpoints2.lg) || 0,
@@ -127,7 +126,8 @@ var InterstitialScreen = /*#__PURE__*/React__default.forwardRef(function (_ref,
     onClose();
   }, [onClose]);
   var scrollBodyToTop = function scrollBodyToTop() {
-    bodyScrollRef.current.scroll({
+    var _bodyScrollRef$curren;
+    (_bodyScrollRef$curren = bodyScrollRef.current) === null || _bodyScrollRef$curren === void 0 || _bodyScrollRef$curren.scroll({
       top: 0,
       behavior: 'smooth'
     });
@@ -197,10 +197,12 @@ var InterstitialScreen = /*#__PURE__*/React__default.forwardRef(function (_ref,
       vertical: false,
       currentIndex: progStep
     }, childArray.map(function (child, idx) {
-      return /*#__PURE__*/React__default.createElement(ProgressStep, {
-        key: idx,
-        label: child.props.stepTitle
-      });
+      if ( /*#__PURE__*/isValidElement(child)) {
+        return /*#__PURE__*/React__default.createElement(ProgressStep, {
+          key: idx,
+          label: child.props.stepTitle
+        });
+      }
     })))), /*#__PURE__*/React__default.createElement(ModalBody, {
       className: bodyBlockClass
     }, childElements), /*#__PURE__*/React__default.createElement(ModalFooter, null, renderFooter()));
@@ -226,10 +228,12 @@ var InterstitialScreen = /*#__PURE__*/React__default.forwardRef(function (_ref,
       vertical: false,
       currentIndex: progStep
     }, childArray.map(function (child, idx) {
-      return /*#__PURE__*/React__default.createElement(ProgressStep, {
-        key: idx,
-        label: child.props.stepTitle
-      });
+      if ( /*#__PURE__*/isValidElement(child)) {
+        return /*#__PURE__*/React__default.createElement(ProgressStep, {
+          key: idx,
+          label: child.props.stepTitle
+        });
+      }
     })))), childElements, renderFooter()));
   };
   var renderBody = function renderBody() {
@@ -252,7 +256,10 @@ var InterstitialScreen = /*#__PURE__*/React__default.forwardRef(function (_ref,
       className: "".concat(blockClass, "__carousel")
     }, /*#__PURE__*/React__default.createElement(Carousel, {
       disableArrowScroll: true,
-      ref: scrollRef
+      ref: scrollRef,
+      onScroll: function onScroll(scrollPercent) {
+        scrollPercent === 0 && setProgStep(0);
+      }
     }, children)) : childArray[0])), mediaIsDefined && /*#__PURE__*/React__default.createElement(Column, {
       xlg: mediaBreakpoints.xlg,
       lg: mediaBreakpoints.lg,
@@ -271,7 +278,10 @@ var InterstitialScreen = /*#__PURE__*/React__default.forwardRef(function (_ref,
       className: "".concat(blockClass, "__carousel")
     }, /*#__PURE__*/React__default.createElement(Carousel, {
       disableArrowScroll: true,
-      ref: scrollRef
+      ref: scrollRef,
+      onScroll: function onScroll(scrollPercent) {
+        scrollPercent === 0 && setProgStep(0);
+      }
     }, children)) : /*#__PURE__*/React__default.createElement("div", null, childArray[0])));
   };
   var renderFooter = function renderFooter() {
@@ -379,6 +389,7 @@ InterstitialScreen.propTypes = {
    * Medium and small breakpoints will be set to 0 internally to focus on the main content area.
    * @see {@link MEDIA_PROP_TYPE}.
    */
+  /**@ts-ignore */
   media: PropTypes.oneOfType([PropTypes.shape({
     render: PropTypes.func,
     breakpoints: PropTypes.shape({

package/es/components/Nav/NavItem.js

@@ -12,7 +12,7 @@ import cx from 'classnames';
 import { pkg } from '../../settings.js';
 import uuidv4 from '../../global/js/utils/uuidv4.js';
 import NavItemLink from './NavItemLink.js';
-import { Launch } from '../../node_modules/@carbon/icons-react/es/generated/bucket-8.js';
+import { Launch } from '../../node_modules/@carbon/icons-react/es/generated/bucket-9.js';
 
 var _excluded = ["activeHref", "children", "className", "current", "disabled", "element", "href", "id", "label", "onClick", "tabIndex"];
 

package/es/components/NotificationsPanel/NotificationsPanel.js

@@ -13,6 +13,7 @@ import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
 import { timeAgo } from './utils.js';
 import { prepareProps } from '../../global/js/utils/props-helper.js';
+import usePrefersReducedMotion from '../../global/js/hooks/usePrefersReducedMotion.js';
 import { Button, Toggle, Link, IconButton } from '@carbon/react';
 import { Settings, ErrorFilled, CheckmarkFilled, WarningAltFilled, InformationSquareFilled, Close, ChevronDown } from '@carbon/react/icons';
 import { usePreviousValue } from '../../global/js/hooks/usePreviousValue.js';
@@ -153,9 +154,7 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
   var previousState = usePreviousValue({
     open: open
   });
-  var reducedMotion = window && window.matchMedia ? window.matchMedia('(prefers-reduced-motion: reduce)') : {
-    matches: true
-  };
+  var reducedMotion = usePrefersReducedMotion();
   useEffect(function () {
     // Set the notifications passed to the state within this component
     setAllNotifications(data);
@@ -174,10 +173,10 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
     !open && setRender(false);
   };
   useEffect(function () {
-    if (!open && previousState !== null && previousState !== void 0 && previousState.open && reducedMotion.matches) {
+    if (!open && previousState !== null && previousState !== void 0 && previousState.open && reducedMotion) {
       setRender(false);
     }
-  }, [open, reducedMotion.matches, previousState === null || previousState === void 0 ? void 0 : previousState.open]);
+  }, [open, previousState === null || previousState === void 0 ? void 0 : previousState.open, reducedMotion]);
   var sortChronologically = function sortChronologically(arr) {
     if (!arr || arr && !arr.length) {
       return;
@@ -317,7 +316,7 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
     id: blockClass,
     className: cx(blockClass, className, "".concat(blockClass, "__container")),
     style: {
-      animation: !reducedMotion.matches ? "".concat(open ? 'fade-in 250ms' : 'fade-out forwards 250ms') : null
+      animation: !reducedMotion ? "".concat(open ? 'fade-in 250ms' : 'fade-out forwards 250ms') : null
     },
     onAnimationEnd: onAnimationEnd,
     ref: ref || notificationPanelRef

package/es/components/PageHeader/PageHeader.js

@@ -11,7 +11,7 @@ import PropTypes from '../../node_modules/prop-types/index.js';
 import { breakpoints, spacing10, baseFontSize } from '@carbon/layout';
 import cx from 'classnames';
 import { useResizeObserver } from '../../global/js/hooks/useResizeObserver.js';
-import { FlexGrid, Row, Column, Button, Tag } from '@carbon/react';
+import { FlexGrid, Row, Column, Button, Tooltip, Tag } from '@carbon/react';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { deprecateProp, prepareProps } from '../../global/js/utils/props-helper.js';
 import { pkg } from '../../settings.js';
@@ -25,13 +25,14 @@ import { BreadcrumbWithOverflow } from '../BreadcrumbWithOverflow/BreadcrumbWith
 import { ActionBar } from '../ActionBar/ActionBar.js';
 import { ButtonSetWithOverflow } from '../ButtonSetWithOverflow/ButtonSetWithOverflow.js';
 
-var _excluded = ["actionBarItems", "actionBarMenuOptionsClass", "actionBarOverflowAriaLabel", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "allTagsModalTitle", "hasBackgroundAlways", "breadcrumbOverflowAriaLabel", "breadcrumbs", "children", "className", "collapseHeader", "collapseHeaderIconDescription", "collapseTitle", "disableBreadcrumbScroll", "enableBreadcrumbScroll", "expandHeaderIconDescription", "fullWidthGrid", "hasCollapseHeaderToggle", "narrowGrid", "navigation", "pageActions", "pageActionsOverflowLabel", "pageActionsMenuOptionsClass", "showAllTagsLabel", "subtitle", "tags", "title", "withoutBackground"];
+var _excluded = ["actionBarItems", "actionBarMenuOptionsClass", "actionBarOverflowAriaLabel", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "allTagsModalTitle", "hasBackgroundAlways", "breadcrumbOverflowAriaLabel", "breadcrumbs", "children", "className", "collapseHeader", "collapseHeaderIconDescription", "collapseTitle", "disableBreadcrumbScroll", "enableBreadcrumbScroll", "expandHeaderIconDescription", "fullWidthGrid", "hasCollapseHeaderToggle", "narrowGrid", "navigation", "pageActions", "pageActionsOverflowLabel", "pageActionsMenuOptionsClass", "showAllTagsLabel", "subtitle", "tags", "title", "withoutBackground", "breadcrumbOverflowTooltipAlign"];
 var componentName = 'PageHeader';
 
 // Default values for props
 var defaults = {
   fullWidthGrid: false,
-  narrowGrid: false
+  narrowGrid: false,
+  breadcrumbOverflowTooltipAlign: 'right'
 };
 var PageHeader = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var _withoutBackground, _enableBreadcrumbScro;
@@ -66,6 +67,8 @@ var PageHeader = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     tags = _ref.tags,
     title = _ref.title,
     withoutBackground = _ref.withoutBackground,
+    _ref$breadcrumbOverfl = _ref.breadcrumbOverflowTooltipAlign,
+    breadcrumbOverflowTooltipAlign = _ref$breadcrumbOverfl === void 0 ? defaults.breadcrumbOverflowTooltipAlign : _ref$breadcrumbOverfl,
     rest = _objectWithoutProperties(_ref, _excluded);
   // handle deprecated props - START
   // if withoutBackground is nullish check deprecated_hasBackgroundAlways and default false
@@ -337,6 +340,8 @@ var PageHeader = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     noTrailingSlash: !!title,
     overflowAriaLabel: breadcrumbOverflowAriaLabel,
     breadcrumbs: breadcrumbs && breadcrumbItemForTitle ? breadcrumbs.concat(breadcrumbItemForTitle) : breadcrumbItemForTitle ? [breadcrumbItemForTitle] : breadcrumbs // breadcrumbs may be null or undefined
+    ,
+    overflowTooltipAlign: breadcrumbOverflowTooltipAlign
   }) : null), /*#__PURE__*/React__default.createElement(Column, {
     className: cx(["".concat(blockClass, "__action-bar-column ").concat(blockClass, "__action-bar-column--background"), _defineProperty(_defineProperty({}, "".concat(blockClass, "__action-bar-column--has-page-actions"), pageActions), "".concat(blockClass, "__action-bar-column--influenced-by-collapse-button"), spaceForCollapseButton)])
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -528,6 +533,10 @@ PageHeader.propTypes = _objectSpread2({
     var breadcrumbs = _ref11.breadcrumbs;
     return breadcrumbs && breadcrumbs.length > 0;
   }),
+  /**
+   * align breadcrumb overflow tooltip
+   */
+  breadcrumbOverflowTooltipAlign: Tooltip.propTypes.align,
   /**
    * Specifies the breadcrumb components to be shown in the breadcrumb area of
    * the page header. Each item is specified as an object with optional fields

package/es/components/SidePanel/SidePanel.js

@@ -151,7 +151,7 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
       titleItemsStyles(animationProgress);
     }
   }, [doAnimateTitle, panelRefValue === null || panelRefValue === void 0 ? void 0 : panelRefValue.style, scrollAnimationDistance, titleItemsStyles]);
-  var reducedMotion = typeof window !== 'undefined' && (_window = window) !== null && _window !== void 0 && _window.matchMedia ? window.matchMedia('(prefers-reduced-motion: reduce)') : {
+  var reducedMotion = typeof document !== 'undefined' && (_window = window) !== null && _window !== void 0 && _window.matchMedia ? window.matchMedia('(prefers-reduced-motion: reduce)') : {
     matches: true
   };
 

package/es/components/SimpleHeader/SimpleHeader.d.ts

@@ -16,7 +16,7 @@ export function SimpleHeader({ breadcrumbs, className, title, noTrailingSlash, m
     breadcrumbs: any;
     className: any;
     title: any;
-    noTrailingSlash: any;
+    noTrailingSlash?: boolean | undefined;
     maxVisible: any;
     overflowAriaLabel: any;
 }): import("react/jsx-runtime").JSX.Element;
@@ -40,9 +40,5 @@ export namespace SimpleHeader {
         export { overflowAriaLabel_required_if_breadcrumbs_exist as overflowAriaLabel };
         export let title: PropTypes.Requireable<string>;
     }
-    namespace defaultProps {
-        let noTrailingSlash_1: boolean;
-        export { noTrailingSlash_1 as noTrailingSlash };
-    }
 }
 import PropTypes from 'prop-types';

package/es/components/SimpleHeader/SimpleHeader.js

@@ -33,7 +33,8 @@ var SimpleHeader = function SimpleHeader(_ref) {
   var breadcrumbs = _ref.breadcrumbs,
     className = _ref.className,
     title = _ref.title,
-    noTrailingSlash = _ref.noTrailingSlash,
+    _ref$noTrailingSlash = _ref.noTrailingSlash,
+    noTrailingSlash = _ref$noTrailingSlash === void 0 ? true : _ref$noTrailingSlash,
     maxVisible = _ref.maxVisible,
     overflowAriaLabel = _ref.overflowAriaLabel,
     rest = _objectWithoutProperties(_ref, _excluded);
@@ -86,8 +87,5 @@ SimpleHeader.propTypes = {
   /** Header title */
   title: PropTypes.string
 };
-SimpleHeader.defaultProps = {
-  noTrailingSlash: true
-};
 
 export { SimpleHeader, overflowAriaLabel_required_if_breadcrumbs_exist };

package/es/components/Tearsheet/TearsheetNarrow.d.ts

@@ -8,11 +8,8 @@
 import React, { ReactNode, PropsWithChildren } from 'react';
 import PropTypes from 'prop-types';
 import { ButtonProps } from '@carbon/react';
-type closeIconDescriptionTypes = {
-    hasCloseIcon: true;
-    closeIconDescription: string;
-};
-interface TearsheetNarrowProps extends PropsWithChildren {
+import { CloseIconDescriptionTypes } from './TearsheetShell';
+interface TearsheetNarrowBaseProps extends PropsWithChildren {
     /**
      * The navigation actions to be shown as buttons in the action area at the
      * bottom of the tearsheet. Each action is specified as an object with
@@ -36,13 +33,6 @@ interface TearsheetNarrowProps extends PropsWithChildren {
      * An optional class or classes to be added to the outermost element.
      */
     className?: string;
-    /**
-     * The accessibility title for the close icon (if shown).
-     *
-     * **Note:** This prop is only required if a close icon is shown, i.e. if
-     * there are a no navigation actions and/or hasCloseIcon is true.
-     */
-    closeIconDescription?: closeIconDescriptionTypes;
     /**
      * A description of the flow, displayed in the header area of the tearsheet.
      */
@@ -89,6 +79,7 @@ interface TearsheetNarrowProps extends PropsWithChildren {
      */
     verticalPosition?: 'normal' | 'lower';
 }
+type TearsheetNarrowProps = TearsheetNarrowBaseProps & CloseIconDescriptionTypes;
 /**
  * A narrow tearsheet is a slimmer variant of the tearsheet, providing a dialog
  * that keeps users in-context and focused by bringing actionable content front
@@ -97,7 +88,7 @@ interface TearsheetNarrowProps extends PropsWithChildren {
  * A narrow tearsheet comprises 3 zones: a heading area including a title, the
  * main content area, and a set of action buttons.
  */
-export declare let TearsheetNarrow: React.ForwardRefExoticComponent<TearsheetNarrowProps & React.RefAttributes<unknown>>;
+export declare let TearsheetNarrow: React.ForwardRefExoticComponent<TearsheetNarrowProps & React.RefAttributes<HTMLDivElement>>;
 export declare const deprecatedProps: {
     /**
      * **Deprecated**