@carbon/ibm-products 2.43.2-canary.32 → 2.43.2-canary.321

package/es/components/Tearsheet/Tearsheet.js

@@ -5,15 +5,15 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectSpread2 as _objectSpread2, objectWithoutProperties as _objectWithoutProperties } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { Button } from '@carbon/react';
 import React__default from 'react';
-import PropTypes from '../../node_modules/prop-types/index.js';
-import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
+import { tearsheetHasCloseIcon, portalType, TearsheetShell } from './TearsheetShell.js';
+import { ActionSet } from '../ActionSet/ActionSet.js';
+import PropTypes from '../../_virtual/index.js';
 import { allPropTypes } from '../../global/js/utils/props-helper.js';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
-import { Button } from '@carbon/react';
-import { TearsheetShell, tearsheetHasCloseIcon, portalType } from './TearsheetShell.js';
-import { ActionSet } from '../ActionSet/ActionSet.js';
 
 var _excluded = ["influencerPosition", "influencerWidth"];
 var componentName = 'Tearsheet';
@@ -144,6 +144,13 @@ Tearsheet.propTypes = _objectSpread2({
    */
   /**@ts-ignore */
   hasCloseIcon: PropTypes.bool,
+  /**
+   * The content for the header actions area, displayed alongside the title in
+   * the header area of the tearsheet. This is typically a drop-down, or a set
+   * of small buttons, or similar. NB the headerActions is only applicable for
+   * wide tearsheets.
+   */
+  headerActions: PropTypes.element,
   /**
    * The content for the influencer section of the tearsheet, displayed
    * alongside the main content. This is typically a menu, or filter, or

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

@@ -5,10 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  */
 /// <reference path="../../../src/custom-typings/index.d.ts" />
-import React, { ReactNode, PropsWithChildren } from 'react';
-import PropTypes from 'prop-types';
 import { ButtonProps } from '@carbon/react';
 import { CloseIconDescriptionTypes } from './TearsheetShell';
+import React, { PropsWithChildren, ReactNode } from 'react';
+import PropTypes from 'prop-types';
 interface TearsheetNarrowBaseProps extends PropsWithChildren {
     /**
      * The navigation actions to be shown as buttons in the action area at the
@@ -23,7 +23,7 @@ interface TearsheetNarrowBaseProps extends PropsWithChildren {
      *
      * See https://react.carbondesignsystem.com/?path=/docs/components-button--default#component-api
      */
-    actions?: ButtonProps[];
+    actions?: ButtonProps<'button'>[];
     /**
      * The aria-label for the tearsheet, which is optional.
      * if it is not passed, the title will be used as the aria-label.
@@ -90,7 +90,7 @@ interface TearsheetNarrowBaseProps extends PropsWithChildren {
      */
     verticalPosition?: 'normal' | 'lower';
 }
-type TearsheetNarrowProps = TearsheetNarrowBaseProps & CloseIconDescriptionTypes;
+export 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

package/es/components/Tearsheet/TearsheetNarrow.js

@@ -5,15 +5,15 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectSpread2 as _objectSpread2, objectWithoutProperties as _objectWithoutProperties } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { Button } from '@carbon/react';
+import { tearsheetHasCloseIcon, portalType, TearsheetShell, tearsheetShellWideProps } from './TearsheetShell.js';
 import React__default from 'react';
-import PropTypes from '../../node_modules/prop-types/index.js';
+import { allPropTypes, prepareProps } from '../../global/js/utils/props-helper.js';
+import { ActionSet } from '../ActionSet/ActionSet.js';
+import PropTypes from '../../_virtual/index.js';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
-import { prepareProps, allPropTypes } from '../../global/js/utils/props-helper.js';
 import { pkg } from '../../settings.js';
-import { Button } from '@carbon/react';
-import { TearsheetShell, tearsheetHasCloseIcon, portalType, tearsheetShellWideProps } from './TearsheetShell.js';
-import { ActionSet } from '../ActionSet/ActionSet.js';
 
 var _excluded = ["verticalPosition"];
 var componentName = 'TearsheetNarrow';

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

@@ -9,7 +9,12 @@ import React, { PropsWithChildren, ReactNode, RefObject } from 'react';
 import PropTypes from 'prop-types';
 import { type ButtonProps } from '@carbon/react';
 interface TearsheetShellProps extends PropsWithChildren {
-    actions?: ButtonProps[];
+    actions?: ButtonProps<'button'>[];
+    /**
+     * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency,
+     * accountability, and explainability at the UI level.
+     */
+    aiLabel?: ReactNode;
     ariaLabel?: string;
     /**
      * An optional class or classes to be added to the outermost element.
@@ -96,15 +101,15 @@ interface TearsheetShellProps extends PropsWithChildren {
      * Specifies the width of the tearsheet, 'narrow' or 'wide'.
      */
     size: 'narrow' | 'wide';
-    /**
-     *  **Experimental:** Provide a `Slug` component to be rendered inside the `Tearsheet` component
-     */
-    slug?: ReactNode;
     /**
      * The main title of the tearsheet, displayed in the header area.
      */
     title?: ReactNode;
     verticalPosition?: 'normal' | 'lower';
+    /**
+     * @deprecated Property replaced by `aiLabel`
+     */
+    slug?: ReactNode;
 }
 export type CloseIconDescriptionTypes = {
     hasCloseIcon?: false;
@@ -126,6 +131,10 @@ export declare const tearsheetHasCloseIcon: (actions: any, hasCloseIcon: any) =>
 export declare const TearsheetShell: React.ForwardRefExoticComponent<(TearsheetShellProps & CloseIconDescriptionTypes) & React.RefAttributes<HTMLDivElement>>;
 export declare const portalType: PropTypes.Requireable<object>;
 export declare const deprecatedProps: {
+    /**
+     *  @deprecated Property replaced by `aiLabel`
+     */
+    slug: (props: any, propName: any, comp: any, loc: any, propFullName: any, secret: any) => any;
     /**
      * **Deprecated**
      *

package/es/components/Tearsheet/TearsheetShell.js

@@ -6,21 +6,22 @@
  */
 
 import { objectSpread2 as _objectSpread2, objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty, toConsumableArray as _toConsumableArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default, { useRef, useState, useEffect } from 'react';
+import React__default, { useRef, useCallback, useState, useEffect } from 'react';
 import { useResizeObserver } from '../../global/js/hooks/useResizeObserver.js';
-import PropTypes from '../../node_modules/prop-types/index.js';
+import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
 import { pkg } from '../../settings.js';
 import pconsole from '../../global/js/utils/pconsole.js';
 import { getNodeTextContent } from '../../global/js/utils/getNodeTextContent.js';
-import { Button, usePrefix, ComposedModal, ModalHeader, Layer } from '@carbon/react';
+import { deprecateProp } from '../../global/js/utils/props-helper.js';
+import { Button, usePrefix, unstable_FeatureFlags, ComposedModal, ModalHeader, Layer } from '@carbon/react';
+import { ActionSet } from '../ActionSet/ActionSet.js';
 import { Wrap } from '../../global/js/utils/Wrap.js';
 import { usePortalTarget } from '../../global/js/hooks/usePortalTarget.js';
-import { useFocus } from '../../global/js/hooks/useFocus.js';
+import { useFocus, getSpecificElement } from '../../global/js/hooks/useFocus.js';
 import { usePreviousValue } from '../../global/js/hooks/usePreviousValue.js';
-import { ActionSet } from '../ActionSet/ActionSet.js';
 
-var _excluded = ["actions", "ariaLabel", "children", "className", "closeIconDescription", "description", "hasCloseIcon", "headerActions", "influencer", "influencerPosition", "influencerWidth", "label", "navigation", "onClose", "open", "portalTarget", "selectorPrimaryFocus", "selectorsFloatingMenus", "size", "slug", "title", "verticalPosition", "launcherButtonRef"];
+var _excluded = ["actions", "aiLabel", "ariaLabel", "children", "className", "closeIconDescription", "description", "hasCloseIcon", "headerActions", "influencer", "influencerPosition", "influencerWidth", "label", "navigation", "onClose", "open", "portalTarget", "selectorPrimaryFocus", "selectorsFloatingMenus", "size", "slug", "title", "verticalPosition", "launcherButtonRef"];
 
 // The block part of our conventional BEM class names (bc__E--M).
 var bc = "".concat(pkg.prefix, "--tearsheet");
@@ -63,6 +64,7 @@ var tearsheetHasCloseIcon = function tearsheetHasCloseIcon(actions, hasCloseIcon
  * */
 var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var actions = _ref.actions,
+    aiLabel = _ref.aiLabel,
     ariaLabel = _ref.ariaLabel,
     children = _ref.children,
     className = _ref.className,
@@ -82,7 +84,7 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     _ref$selectorsFloatin = _ref.selectorsFloatingMenus,
     selectorsFloatingMenus = _ref$selectorsFloatin === void 0 ? [] : _ref$selectorsFloatin,
     size = _ref.size,
-    slug = _ref.slug,
+    deprecated_slug = _ref.slug,
     title = _ref.title,
     verticalPosition = _ref.verticalPosition,
     launcherButtonRef = _ref.launcherButtonRef,
@@ -90,7 +92,7 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
   var carbonPrefix = usePrefix();
   var bcModalHeader = "".concat(carbonPrefix, "--modal-header");
   var renderPortalUse = usePortalTarget(portalTargetIn);
-  var localRef = useRef();
+  var localRef = useRef(undefined);
   var resizer = useRef(null);
   var modalBodyRef = useRef(null);
   var modalRef = ref || localRef;
@@ -102,6 +104,12 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     keyDownListener = _useFocus.keyDownListener,
     specifiedElement = _useFocus.specifiedElement;
   var modalRefValue = modalRef.current;
+
+  // Function to strip html tags out of a string.
+  var stripTags = useCallback(function (input) {
+    return input.replace(/<\/?[^>]+(>|$)/g, '');
+  }, []);
+  var titleText = stripTags(String(description));
   var wide = size === 'wide';
 
   // Keep track of the stack depth and our position in it (1-based, 0=closed)
@@ -115,7 +123,7 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     setPosition = _useState4[1];
 
   // Keep a record of the previous value of depth.
-  var prevDepth = useRef();
+  var prevDepth = useRef(undefined);
   useEffect(function () {
     prevDepth.current = depth;
   });
@@ -139,23 +147,35 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
 
   // Callback to give the tearsheet the opportunity to claim focus
   handleStackChange.claimFocus = function () {
-    if (selectorPrimaryFocus) {
-      return specifiedElement === null || specifiedElement === void 0 ? void 0 : specifiedElement.focus();
+    if (selectorPrimaryFocus && getSpecificElement(modalRef === null || modalRef === void 0 ? void 0 : modalRef.current, selectorPrimaryFocus)) {
+      var _window;
+      var specifiedEl = getSpecificElement(modalRef === null || modalRef === void 0 ? void 0 : modalRef.current, selectorPrimaryFocus);
+      if (specifiedEl && ((_window = window) === null || _window === void 0 || (_window = _window.getComputedStyle(specifiedEl)) === null || _window === void 0 ? void 0 : _window.display) !== 'none') {
+        return specifiedEl.focus();
+      }
     }
-    firstElement === null || firstElement === void 0 || firstElement.focus();
+    setTimeout(function () {
+      return firstElement === null || firstElement === void 0 ? void 0 : firstElement.focus();
+    }, 0);
   };
   useEffect(function () {
     if (open) {
       // Focusing the first element or selectorPrimaryFocus element
-      setTimeout(function () {
-        if (selectorPrimaryFocus) {
-          return specifiedElement === null || specifiedElement === void 0 ? void 0 : specifiedElement.focus();
+      if (selectorPrimaryFocus && getSpecificElement(modalRef === null || modalRef === void 0 ? void 0 : modalRef.current, selectorPrimaryFocus)) {
+        var _window2;
+        var specifiedEl = getSpecificElement(modalRef === null || modalRef === void 0 ? void 0 : modalRef.current, selectorPrimaryFocus);
+        if (specifiedEl && ((_window2 = window) === null || _window2 === void 0 || (_window2 = _window2.getComputedStyle(specifiedEl)) === null || _window2 === void 0 ? void 0 : _window2.display) !== 'none') {
+          setTimeout(function () {
+            return specifiedEl.focus();
+          }, 0);
+          return;
         }
-        firstElement === null || firstElement === void 0 || firstElement.focus();
+      }
+      setTimeout(function () {
+        return firstElement === null || firstElement === void 0 ? void 0 : firstElement.focus();
       }, 0);
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [open]);
+  }, [firstElement, modalRef, open, selectorPrimaryFocus]);
   useEffect(function () {
     if (prevOpen && !open && launcherButtonRef) {
       setTimeout(function () {
@@ -166,10 +186,13 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
   useEffect(function () {
     if (open && position !== depth) {
       setTimeout(function () {
+        if (selectorPrimaryFocus) {
+          return specifiedElement === null || specifiedElement === void 0 ? void 0 : specifiedElement.focus();
+        }
         firstElement === null || firstElement === void 0 || firstElement.focus();
       }, 0);
     }
-  }, [position, depth, firstElement, open]);
+  }, [position, depth, firstElement, open, specifiedElement, selectorPrimaryFocus]);
   useEffect(function () {
     var notify = function notify() {
       return stack.all.forEach(function (handler) {
@@ -236,12 +259,14 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
       }
       return _defineProperty(_defineProperty({}, "--".concat(bc, "--stacking-scale-factor-single"), (width - 32) / width), "--".concat(bc, "--stacking-scale-factor-double"), (width - 64) / width);
     };
-    return renderPortalUse( /*#__PURE__*/React__default.createElement(ComposedModal, _extends({}, rest, {
+    return renderPortalUse( /*#__PURE__*/React__default.createElement(unstable_FeatureFlags, {
+      enableExperimentalFocusWrapWithoutSentinels: true
+    }, /*#__PURE__*/React__default.createElement(ComposedModal, _extends({}, rest, {
       "aria-label": ariaLabel || getNodeTextContent(title),
-      className: cx(bc, className, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(bc, "--stacked-").concat(position, "-of-").concat(depth),
+      className: cx(bc, className, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(bc, "--stacked-").concat(position, "-of-").concat(depth),
       // Don't apply this on the initial open of a single tearsheet.
-      depth > 1 || depth === 1 && ((_prevDepth$current = prevDepth === null || prevDepth === void 0 ? void 0 : prevDepth.current) !== null && _prevDepth$current !== void 0 ? _prevDepth$current : 0) > 1), "".concat(bc, "--wide"), wide), "".concat(bc, "--narrow"), !wide), "".concat(bc, "--has-slug"), slug), "".concat(bc, "--has-close"), effectiveHasCloseIcon)),
-      slug: slug,
+      depth > 1 || depth === 1 && ((_prevDepth$current = prevDepth === null || prevDepth === void 0 ? void 0 : prevDepth.current) !== null && _prevDepth$current !== void 0 ? _prevDepth$current : 0) > 1), "".concat(bc, "--wide"), wide), "".concat(bc, "--narrow"), !wide), "".concat(bc, "--has-slug"), deprecated_slug), "".concat(bc, "--has-ai-label"), aiLabel), "".concat(bc, "--has-close"), effectiveHasCloseIcon)),
+      slug: aiLabel || deprecated_slug,
       style: setScaleValues(),
       containerClassName: cx("".concat(bc, "__container"), _defineProperty(_defineProperty({}, "".concat(bc, "__container--lower"), verticalPosition === 'lower'), "".concat(bc, "__container--mixed-size-stacking"), !areAllSameSizeVariant())),
       onClose: onClose,
@@ -270,7 +295,8 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
       element: "h3",
       className: cx("".concat(bcModalHeader, "__heading"), "".concat(bc, "__heading"))
     }, title), /*#__PURE__*/React__default.createElement(Wrap, {
-      className: "".concat(bc, "__header-description")
+      className: "".concat(bc, "__header-description"),
+      title: titleText
     }, description)), /*#__PURE__*/React__default.createElement(Wrap, {
       className: "".concat(bc, "__header-actions")
     }, headerActions)), /*#__PURE__*/React__default.createElement(Wrap, {
@@ -288,7 +314,8 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
       alwaysRender: includeActions
     }, /*#__PURE__*/React__default.createElement(Wrap, {
       className: "".concat(bc, "__content"),
-      alwaysRender: !!(influencer && influencerPosition === 'right')
+      alwaysRender: !!(influencer && influencerPosition === 'right'),
+      tabIndex: -1
     }, children), /*#__PURE__*/React__default.createElement(Wrap, {
       className: cx(_defineProperty(_defineProperty({}, "".concat(bc, "__influencer"), true), "".concat(bc, "__influencer--wide"), influencerWidth === 'wide')),
       neverRender: influencerPosition !== 'right'
@@ -303,7 +330,7 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     })))), /*#__PURE__*/React__default.createElement("div", {
       className: "".concat(bc, "__resize-detector"),
       ref: resizer
-    })));
+    }))));
   } else {
     pconsole.warn('Tearsheet not rendered: maximum stacking depth exceeded.');
     return null;
@@ -313,8 +340,14 @@ var TearsheetShell = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
 // The display name of the component, used by React. Note that displayName
 // is used in preference to relying on function.name.
 TearsheetShell.displayName = componentName;
-var portalType = typeof Element === 'undefined' ? PropTypes.object : PropTypes.instanceOf(Element);
+var portalType = typeof Element === 'undefined' ? PropTypes.object :
+// eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope
+PropTypes.instanceOf(Element);
 var deprecatedProps = {
+  /**
+   *  @deprecated Property replaced by `aiLabel`
+   */
+  slug: deprecateProp(PropTypes.node, 'Property replaced by `aiLabel`'),
   /**
    * **Deprecated**
    *
@@ -356,8 +389,14 @@ TearsheetShell.propTypes = _objectSpread2({
     label: PropTypes.string,
     loading: PropTypes.bool,
     // we duplicate this Button prop to improve the DocGen here
+    /**@ts-ignore*/
     onClick: Button.propTypes.onClick
   }))),
+  /**
+   * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency,
+   * accountability, and explainability at the UI level.
+   */
+  aiLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]),
   /**
    * The main content of the tearsheet.
    */
@@ -464,10 +503,6 @@ TearsheetShell.propTypes = _objectSpread2({
    */
   /**@ts-ignore*/
   size: PropTypes.oneOf(['narrow', 'wide']).isRequired,
-  /**
-   *  **Experimental:** Provide a `Slug` component to be rendered inside the `Tearsheet` component
-   */
-  slug: PropTypes.node,
   /**
    * The main title of the tearsheet, displayed in the header area.
    */

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

@@ -1,2 +1,10 @@
-export { Tearsheet } from "./Tearsheet";
-export { TearsheetNarrow } from "./TearsheetNarrow";
+/**
+ * Copyright IBM Corp. 2020, 2021
+ *
+ * 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 { Tearsheet } from './Tearsheet';
+export { TearsheetNarrow } from './TearsheetNarrow';
+export type { TearsheetProps } from './Tearsheet';
+export type { TearsheetNarrowProps } from './TearsheetNarrow';

package/es/components/Toolbar/Toolbar.d.ts

@@ -6,7 +6,7 @@
  */
 import React from 'react';
 declare const blockClass: string;
-interface ToolbarProps {
+export interface ToolbarProps {
     /** Provide an optional class to be applied to the containing node */
     className?: string;
     /** Determines whether the `Toolbar` is rendered vertically */

package/es/components/Toolbar/Toolbar.js

@@ -6,11 +6,11 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import cx from 'classnames';
-import { p as propTypesExports } from '../../node_modules/prop-types/index.js';
 import React__default, { forwardRef, useRef, useCallback, useState, useEffect, createContext } from 'react';
-import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
+import { p as propTypesExports } from '../../_virtual/index.js';
 import { getFocusableElements } from '../../global/js/utils/getFocusableElements.js';
+import cx from 'classnames';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
 
 var _excluded = ["children", "className", "vertical"];
@@ -25,7 +25,7 @@ var Toolbar = /*#__PURE__*/forwardRef(function (_ref, r) {
     className = _ref.className,
     vertical = _ref.vertical,
     rest = _objectWithoutProperties(_ref, _excluded);
-  var focusableElements = useRef();
+  var focusableElements = useRef(undefined);
   var getFocusableElements$1 = useCallback(function () {
     return focusableElements.current;
   }, [focusableElements]);

package/es/components/Toolbar/ToolbarButton.d.ts

@@ -5,16 +5,20 @@
  * LICENSE file in the root directory of this source tree.
  */
 /// <reference path="../../../src/custom-typings/index.d.ts" />
-import { IconButton } from '@carbon/react';
 import React from 'react';
+import { IconButton } from '@carbon/react';
 export declare const blockClass: string;
-interface ToolbarButtonProps extends React.ComponentProps<typeof IconButton> {
+export interface ToolbarButtonProps extends React.ComponentProps<typeof IconButton> {
     /** Determines whether the caret is rendered */
     caret?: boolean;
     /** Provide an optional class to be applied to the containing node */
     className?: string;
+    /**
+     * @deprecated use `label` instead
+     * Specifies the label for the icon button */
+    iconDescription?: string;
     /** Specifies the label for the icon button */
-    iconDescription: string;
+    label: string;
     /** Specifies the icon to be used by the ToolbarButton component */
     renderIcon: React.ElementType;
 }
@@ -22,4 +26,10 @@ interface ToolbarButtonProps extends React.ComponentProps<typeof IconButton> {
 export declare let ToolbarButton: React.ForwardRefExoticComponent<ToolbarButtonProps & {
     children?: React.ReactNode;
 } & React.RefAttributes<unknown>>;
-export {};
+export declare const deprecatedProps: {
+    /**
+     * **Deprecated**
+     * Specifies the label for the icon button
+     *  */
+    iconDescription: import("prop-types").Requireable<string>;
+};

package/es/components/Toolbar/ToolbarButton.js

@@ -5,15 +5,15 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectSpread2 as _objectSpread2, objectWithoutProperties as _objectWithoutProperties, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default, { forwardRef, useContext } from 'react';
+import { ToolbarContext, blockClass as blockClass$1 } from './Toolbar.js';
+import { p as propTypesExports } from '../../_virtual/index.js';
 import { IconButton } from '@carbon/react';
 import cx from 'classnames';
-import { p as propTypesExports } from '../../node_modules/prop-types/index.js';
-import React__default, { forwardRef, useContext } from 'react';
 import { pkg } from '../../settings.js';
-import { ToolbarContext, blockClass as blockClass$1 } from './Toolbar.js';
 
-var _excluded = ["caret", "children", "className", "renderIcon", "iconDescription"];
+var _excluded = ["caret", "children", "className", "renderIcon", "iconDescription", "label"];
 var blockClass = "".concat(blockClass$1, "__button");
 /** Toolbar buttons are common functions performed as part of a products interface or an open window.  */
 var ToolbarButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
@@ -24,13 +24,14 @@ var ToolbarButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
     className = _ref.className,
     renderIcon = _ref.renderIcon,
     _ref$iconDescription = _ref.iconDescription,
-    iconDescription = _ref$iconDescription === void 0 ? '' : _ref$iconDescription,
+    deprecated_iconDescription = _ref$iconDescription === void 0 ? '' : _ref$iconDescription,
+    label = _ref.label,
     rest = _objectWithoutProperties(_ref, _excluded);
   var Icon = renderIcon;
   return /*#__PURE__*/React__default.createElement(IconButton, _extends({
-    align: ((_useContext = useContext(ToolbarContext)) === null || _useContext === void 0 ? void 0 : _useContext.vertical) && 'right'
+    align: (_useContext = useContext(ToolbarContext)) !== null && _useContext !== void 0 && _useContext.vertical ? 'right' : 'top'
   }, rest, {
-    label: iconDescription,
+    label: label !== null && label !== void 0 ? label : deprecated_iconDescription,
     ref: ref,
     className: cx(className, _defineProperty({}, "".concat(blockClass, "--caret"), caret)),
     kind: "ghost",
@@ -41,7 +42,14 @@ var ToolbarButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
 });
 var componentName = 'ToolbarButton';
 ToolbarButton.displayName = componentName;
-ToolbarButton.propTypes = {
+var deprecatedProps = {
+  /**
+   * **Deprecated**
+   * Specifies the label for the icon button
+   *  */
+  iconDescription: propTypesExports.string
+};
+ToolbarButton.propTypes = _objectSpread2({
   /** Determines whether the caret is rendered */
   caret: propTypesExports.bool,
   /** Provide the content of the `ToolbarButton` */
@@ -49,10 +57,10 @@ ToolbarButton.propTypes = {
   /** Provide an optional class to be applied to the containing node */
   className: propTypesExports.string,
   /** Specifies the label for the icon button */
-  iconDescription: propTypesExports.string.isRequired,
+  label: propTypesExports.string.isRequired,
   /** Specifies the icon to be used by the ToolbarButton component */
   renderIcon: propTypesExports.func.isRequired
-};
+}, deprecatedProps);
 ToolbarButton = pkg.checkComponentEnabled(ToolbarButton, componentName);
 
-export { ToolbarButton, blockClass };
+export { ToolbarButton, blockClass, deprecatedProps };

package/es/components/Toolbar/ToolbarGroup.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ReactNode } from 'react';
-interface ToolbarGroupProps {
+export interface ToolbarGroupProps {
     /** Provide the content of the `ToolbarGroup` */
     children?: ReactNode;
     /** Provide an optional class to be applied to the containing node */
@@ -15,4 +15,3 @@ interface ToolbarGroupProps {
 export declare let ToolbarGroup: React.ForwardRefExoticComponent<ToolbarGroupProps & {
     children?: React.ReactNode;
 } & React.RefAttributes<HTMLDivElement>>;
-export {};

package/es/components/Toolbar/ToolbarGroup.js

@@ -6,11 +6,11 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import cx from 'classnames';
-import { p as propTypesExports } from '../../node_modules/prop-types/index.js';
 import React__default, { forwardRef } from 'react';
-import { pkg } from '../../settings.js';
+import { p as propTypesExports } from '../../_virtual/index.js';
 import { blockClass } from './Toolbar.js';
+import cx from 'classnames';
+import { pkg } from '../../settings.js';
 
 var _excluded = ["className", "children"];
 /** Toolbar groups organize the commands within a toolbar into related groups. */

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

@@ -1,3 +1,12 @@
-export { Toolbar } from "./Toolbar";
-export { ToolbarButton } from "./ToolbarButton";
-export { ToolbarGroup } from "./ToolbarGroup";
+/**
+ * Copyright IBM Corp. 2021, 2021
+ *
+ * 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 { Toolbar } from './Toolbar';
+export { ToolbarButton } from './ToolbarButton';
+export { ToolbarGroup } from './ToolbarGroup';
+export type { ToolbarProps } from './Toolbar';
+export type { ToolbarButtonProps } from './ToolbarButton';
+export type { ToolbarGroupProps } from './ToolbarGroup';

package/es/components/TooltipTrigger/TooltipTrigger.d.ts

@@ -2,7 +2,7 @@ export function TooltipTrigger({ children, className, ...rest }: {
     [x: string]: any;
     children: any;
     className: any;
-}): import("react/jsx-runtime").JSX.Element;
+}): React.JSX.Element;
 export namespace TooltipTrigger {
     export { componentName as displayName };
     export namespace propTypes {
@@ -10,6 +10,7 @@ export namespace TooltipTrigger {
         let className: PropTypes.Requireable<string>;
     }
 }
+import React from 'react';
 declare const componentName: "TooltipTrigger";
 import PropTypes from 'prop-types';
 export {};

package/es/components/TooltipTrigger/TooltipTrigger.js

@@ -7,7 +7,7 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import PropTypes from '../../node_modules/prop-types/index.js';
+import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
 import { pkg } from '../../settings.js';
 

package/es/components/TruncatedList/TruncatedList.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { PropsWithChildren, ReactNode } from 'react';
-interface TruncatedListProps extends PropsWithChildren {
+export interface TruncatedListProps extends PropsWithChildren {
     as?: React.ElementType | string;
     /**
      * Optional class name for expand/collapse button.
@@ -49,4 +49,3 @@ interface TruncatedListProps extends PropsWithChildren {
  * and see the entire list.
  */
 export declare let TruncatedList: React.ForwardRefExoticComponent<TruncatedListProps & React.RefAttributes<HTMLDivElement>>;
-export {};

package/es/components/TruncatedList/TruncatedList.js

@@ -7,11 +7,11 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { Children, useState, useRef, useEffect } from 'react';
-import PropTypes from '../../node_modules/prop-types/index.js';
-import cx from 'classnames';
-import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg, carbon } from '../../settings.js';
 import { Button } from '@carbon/react';
+import PropTypes from '../../_virtual/index.js';
+import cx from 'classnames';
+import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 
 var _excluded = ["children", "className", "as", "buttonClassName", "collapsedItemsLimit", "expandedItemsLimit", "onClick", "viewLessLabel", "viewMoreLabel"];
 
@@ -67,7 +67,7 @@ var TruncatedList = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     _useState4 = _slicedToArray(_useState3, 2),
     listHeight = _useState4[0],
     setListHeight = _useState4[1];
-  var listRef = useRef();
+  var listRef = useRef(undefined);
   var handleToggle = function handleToggle() {
     setIsCollapsed(function (prev) {
       return !prev;

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

@@ -1 +1,8 @@
-export { TruncatedList } from "./TruncatedList";
+/**
+ * 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.
+ */
+export { TruncatedList } from './TruncatedList';
+export type { TruncatedListProps } from './TruncatedList';