@carbon/ibm-products 2.38.0 → 2.40.0

package/es/components/AddSelect/AddSelectBody.d.ts

@@ -1,2 +1,44 @@
-export let AddSelectBody: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+import React, { ReactNode } from 'react';
+import { Item, Theme } from './types';
+export interface AddSelectBodyProps {
+    className?: string;
+    clearFiltersText?: string;
+    closeIconDescription?: string;
+    columnInputPlaceholder?: string;
+    defaultModifiers?: Array<any>;
+    description?: string;
+    filterByLabel?: string;
+    globalFilterOpts?: Array<any>;
+    globalFiltersIconDescription?: string;
+    globalFiltersLabel?: string;
+    globalFiltersPlaceholderText?: string;
+    globalFiltersPrimaryButtonText?: string;
+    globalFiltersSecondaryButtonText?: string;
+    globalSearchLabel: string;
+    globalSearchPlaceholder?: string;
+    globalSortBy?: Array<any>;
+    illustrationTheme?: Theme;
+    influencerTitle?: string;
+    items?: Item;
+    itemsLabel?: string;
+    metaIconDescription?: string;
+    metaPanelTitle?: string;
+    multi?: boolean;
+    navIconDescription?: string;
+    noResultsDescription?: string;
+    noResultsTitle?: string;
+    noSelectionDescription?: string;
+    noSelectionTitle?: string;
+    normalizedItems?: object;
+    onClose?: () => void;
+    onCloseButtonText?: string;
+    onSubmit?: (selection: any) => void;
+    onSubmitButtonText?: string;
+    open?: boolean;
+    portalTarget?: ReactNode;
+    searchResultsTitle?: string;
+    sortByLabel?: string;
+    title?: string;
+    useNormalizedItems?: boolean;
+}
+export declare const AddSelectBody: React.ForwardRefExoticComponent<AddSelectBodyProps & React.RefAttributes<HTMLDivElement>>;

package/es/components/AddSelect/AddSelectBody.js

@@ -122,7 +122,7 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
   };
   var onCloseHandler = function onCloseHandler() {
     resetState();
-    onClose();
+    onClose === null || onClose === void 0 || onClose();
   };
   var tearsheetClassnames = cx(className, blockClass, _defineProperty(_defineProperty({}, "".concat(blockClass, "__single"), !multi), "".concat(blockClass, "__multi"), multi));
   var globalFilterKeys = Object.keys(appliedGlobalFilters);
@@ -136,17 +136,17 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
     setAppliedGlobalFilters(filters);
   };
   var submitHandler = function submitHandler() {
-    if (multi && appliedModifiers.length > 0) {
+    if (multi && appliedModifiers && (appliedModifiers === null || appliedModifiers === void 0 ? void 0 : appliedModifiers.length) > 0) {
       var selections = multiSelection.map(function (item) {
         return appliedModifiers.find(function (mod) {
           return mod.id === item;
         });
       });
-      onSubmit(selections);
-    } else if (multi && appliedModifiers.length === 0) {
-      onSubmit(multiSelection);
+      onSubmit === null || onSubmit === void 0 || onSubmit(selections);
+    } else if (multi && (appliedModifiers === null || appliedModifiers === void 0 ? void 0 : appliedModifiers.length) === 0) {
+      onSubmit === null || onSubmit === void 0 || onSubmit(multiSelection);
     } else {
-      onSubmit(singleSelection);
+      onSubmit === null || onSubmit === void 0 || onSubmit(singleSelection);
     }
     onCloseHandler();
   };
@@ -213,9 +213,9 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
     displayMetalPanel: displayMetalPanel,
     illustrationTheme: illustrationTheme,
     influencerTitle: influencerTitle,
-    items: useNormalizedItems ? normalizedItems : items.entries,
+    items: useNormalizedItems ? normalizedItems : items === null || items === void 0 ? void 0 : items.entries,
     metaPanelTitle: metaPanelTitle,
-    modifiers: items.modifiers,
+    modifiers: items === null || items === void 0 ? void 0 : items.modifiers,
     multiSelection: multiSelection,
     noSelectionDescription: noSelectionDescription,
     noSelectionTitle: noSelectionTitle,
@@ -257,11 +257,8 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
     type: "gray",
     size: "sm"
   }, itemsToDisplay.length)), showSort && /*#__PURE__*/React__default.createElement(AddSelectSort, {
-    items: itemsToDisplay,
     setSortAttribute: setSortAttribute,
     setSortDirection: setSortDirection,
-    sortAttribute: sortAttribute,
-    sortDirection: sortDirection,
     sortBy: globalSortBy
   }))), displayColumnView ? /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__columns")
@@ -273,7 +270,7 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
     sortByLabel: sortByLabel
   }))) : /*#__PURE__*/React__default.createElement("div", null, hasResults ? /*#__PURE__*/React__default.createElement(AddSelectList, _extends({}, commonListProps, {
     filteredItems: itemsToDisplay,
-    modifiers: items.modifiers,
+    modifiers: items === null || items === void 0 ? void 0 : items.modifiers,
     appliedModifiers: appliedModifiers,
     setAppliedModifiers: setAppliedModifiers,
     setParentSelected: parentSelectionHandler,
@@ -313,6 +310,7 @@ AddSelectBody.propTypes = {
   globalSortBy: PropTypes.array,
   illustrationTheme: PropTypes.oneOf(['light', 'dark']),
   influencerTitle: PropTypes.string,
+  /**@ts-ignore */
   items: PropTypes.shape({
     modifiers: PropTypes.shape({
       id: PropTypes.string,

package/es/components/AddSelect/AddSelectSort.d.ts

@@ -1,18 +1,17 @@
-export function AddSelectSort({ setSortAttribute, setSortDirection, sortBy, sortByLabel, }: {
-    setSortAttribute: any;
-    setSortDirection: any;
-    sortBy: any;
-    sortByLabel: any;
-}): import("react/jsx-runtime").JSX.Element;
-export namespace AddSelectSort {
-    export namespace propTypes {
-        let setSortAttribute: PropTypes.Requireable<(...args: any[]) => any>;
-        let setSortDirection: PropTypes.Requireable<(...args: any[]) => any>;
-        let sortBy: PropTypes.Requireable<any[]>;
-        let sortByLabel: PropTypes.Requireable<string>;
-    }
-    export { componentName as displayName };
-}
 import PropTypes from 'prop-types';
-declare const componentName: "AddSelectSort";
-export {};
+export interface AddSelectSortProps {
+    setSortAttribute?: (attribute: any) => void;
+    setSortDirection?: (direction: any) => void;
+    sortBy?: Array<string>;
+    sortByLabel?: string;
+}
+export declare const AddSelectSort: {
+    ({ setSortAttribute, setSortDirection, sortBy, sortByLabel, }: AddSelectSortProps): import("react/jsx-runtime").JSX.Element;
+    propTypes: {
+        setSortAttribute: PropTypes.Requireable<(...args: any[]) => any>;
+        setSortDirection: PropTypes.Requireable<(...args: any[]) => any>;
+        sortBy: PropTypes.Requireable<any[]>;
+        sortByLabel: PropTypes.Requireable<string>;
+    };
+    displayName: string;
+};

package/es/components/AddSelect/AddSelectSort.js

@@ -20,7 +20,7 @@ var AddSelectSort = function AddSelectSort(_ref) {
     setSortDirection = _ref.setSortDirection,
     sortBy = _ref.sortBy,
     sortByLabel = _ref.sortByLabel;
-  var sortByOpts = sortBy ? sortBy.reduce(function (acc, cur) {
+  var sortByOpts = sortBy ? sortBy === null || sortBy === void 0 ? void 0 : sortBy.reduce(function (acc, cur) {
     var opts = [{
       id: "".concat(cur, "-asc"),
       itemText: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, _ArrowUp || (_ArrowUp = /*#__PURE__*/React__default.createElement(ArrowUp, {
@@ -43,8 +43,8 @@ var AddSelectSort = function AddSelectSort(_ref) {
   var sortHandler = function sortHandler(_ref2) {
     var direction = _ref2.direction,
       attribute = _ref2.attribute;
-    setSortAttribute(attribute);
-    setSortDirection(direction);
+    setSortAttribute === null || setSortAttribute === void 0 || setSortAttribute(attribute);
+    setSortDirection === null || setSortDirection === void 0 || setSortDirection(direction);
   };
   return /*#__PURE__*/React__default.createElement("div", {
     className: blockClass
@@ -61,8 +61,8 @@ var AddSelectSort = function AddSelectSort(_ref) {
   }, sortByOpts.map(function (opt) {
     return /*#__PURE__*/React__default.createElement(OverflowMenuItem, {
       className: "".concat(blockClass, "_overflow-item"),
-      key: opt.id,
-      itemText: opt.itemText,
+      key: opt === null || opt === void 0 ? void 0 : opt.id,
+      itemText: opt === null || opt === void 0 ? void 0 : opt.itemText,
       onClick: function onClick() {
         return sortHandler(opt);
       }

package/es/components/AddSelect/types/index.d.ts

@@ -0,0 +1,44 @@
+import { ReactNode } from 'react';
+export type Theme = 'light' | 'dark';
+export interface Filter {
+    id?: string;
+    label?: string;
+}
+export interface Modifier {
+    id?: string;
+    label?: string;
+    options?: string[];
+}
+export interface Avatar {
+    alt?: string;
+    icon?: () => void;
+    src?: string;
+    theme?: Theme;
+}
+export interface Meta {
+    id?: string;
+    title?: string;
+    value?: string;
+}
+export interface Entry {
+    id: string;
+    title: string;
+    value: string;
+    avatar?: Avatar;
+    children?: ReactNode;
+    icon?: () => void | object;
+    meta?: Meta[] | ReactNode;
+    subtitle?: string;
+}
+export interface Item {
+    entries: Entry[];
+    modifiers?: Modifier;
+    sortBy?: string[];
+    filterBy?: string[];
+}
+export interface SortOption {
+    id?: string;
+    direction?: string;
+    attribute?: string;
+    itemText?: object;
+}

package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.d.ts

@@ -27,7 +27,11 @@ export namespace BreadcrumbWithOverflow {
              */
             label: PropTypes.Requireable<PropTypes.ReactNodeLike>;
             /**
-             * A string based alternative to the children, required only if children is not of type string.
+             * An optional title label for extra long breadcrumb
+             */
+            shortTitle: PropTypes.Requireable<string>;
+            /**
+             * A string based alternative to the children, required only if children is not of type string
              */
             title: any;
         }> | null | undefined)[]>;

package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js

@@ -19,8 +19,8 @@ import { TooltipTrigger } from '../TooltipTrigger/TooltipTrigger.js';
 
 var _TooltipTrigger;
 var _excluded = ["breadcrumbs", "className", "maxVisible", "noTrailingSlash", "overflowAriaLabel", "overflowTooltipAlign"],
-  _excluded2 = ["label", "key", "title", "id"],
-  _excluded3 = ["className", "key", "label", "title"];
+  _excluded2 = ["label", "key", "title", "id", "shortTitle"],
+  _excluded3 = ["className", "key", "label", "shortTitle", "title"];
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 var blockClass = "".concat(pkg.prefix, "--breadcrumb-with-overflow");
@@ -106,8 +106,9 @@ var BreadcrumbWithOverflow = function BreadcrumbWithOverflow(_ref) {
       var label = _ref3.label,
         key = _ref3.key,
         title = _ref3.title,
-        id = _ref3.id,
-        rest = _objectWithoutProperties(_ref3, _excluded2);
+        id = _ref3.id;
+        _ref3.shortTitle;
+        var rest = _objectWithoutProperties(_ref3, _excluded2);
       return /*#__PURE__*/React__default.createElement(BreadcrumbItem, _extends({
         key: key
       }, rest, {
@@ -128,13 +129,14 @@ var BreadcrumbWithOverflow = function BreadcrumbWithOverflow(_ref) {
       var className = _ref4.className,
         key = _ref4.key,
         label = _ref4.label,
+        shortTitle = _ref4.shortTitle,
         title = _ref4.title,
         rest = _objectWithoutProperties(_ref4, _excluded3);
       return /*#__PURE__*/React__default.createElement(BreadcrumbItem, _extends({
         key: key,
         className: index > 0 || displayCount > 1 ? cx([className, "".concat(blockClass, "__displayed-breadcrumb")]) : className,
         title: index + 1 === breadcrumbs.length ? title : null
-      }, rest), label);
+      }, rest), shortTitle || label);
     });
 
     // The breadcrumb has the form [first item] [overflow] [items 2...(n-1)] [last item].
@@ -296,7 +298,11 @@ BreadcrumbWithOverflow.propTypes = {
      */
     label: PropTypes.node,
     /**
-     * A string based alternative to the children, required only if children is not of type string.
+     * An optional title label for extra long breadcrumb
+     */
+    shortTitle: PropTypes.string,
+    /**
+     * A string based alternative to the children, required only if children is not of type string
      */
     title: PropTypes.string.isRequired.if(function (_ref5) {
       var label = _ref5.label;

package/es/components/Card/Card.js

@@ -9,12 +9,14 @@ import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _
 import React__default, { forwardRef } from 'react';
 import cx from 'classnames';
 import { Layer, OverflowMenu, OverflowMenuItem, Button, IconButton } from '@carbon/react';
+import { Incomplete, CheckmarkOutline } from '@carbon/react/icons';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import { CardHeader } from './CardHeader.js';
 import { CardFooter } from './CardFooter.js';
 import { pkg } from '../../settings.js';
 
-var _excluded = ["actionIcons", "actionsPlacement", "children", "className", "clickZone", "description", "label", "media", "mediaPosition", "onClick", "onKeyDown", "onPrimaryButtonClick", "overflowActions", "overflowAriaLabel", "onSecondaryButtonClick", "pictogram", "primaryButtonDisabled", "primaryButtonHref", "primaryButtonIcon", "primaryButtonKind", "primaryButtonPlacement", "primaryButtonText", "productive", "secondaryButtonDisabled", "secondaryButtonHref", "secondaryButtonIcon", "secondaryButtonKind", "secondaryButtonPlacement", "secondaryButtonText", "slug", "title", "titleSize"],
+var _Incomplete, _CheckmarkOutline;
+var _excluded = ["actionIcons", "actionsPlacement", "metadata", "children", "className", "clickZone", "description", "disabled", "footerActionIcon", "getStarted", "label", "media", "mediaPosition", "onClick", "onKeyDown", "onPrimaryButtonClick", "overflowActions", "overflowAriaLabel", "onSecondaryButtonClick", "pictogram", "primaryButtonDisabled", "primaryButtonHref", "primaryButtonIcon", "primaryButtonKind", "primaryButtonPlacement", "primaryButtonText", "productive", "secondaryButtonDisabled", "secondaryButtonHref", "secondaryButtonIcon", "secondaryButtonKind", "secondaryButtonPlacement", "secondaryButtonText", "slug", "status", "sequence", "title", "titleSize"],
   _excluded2 = ["id"],
   _excluded3 = ["id", "icon", "onClick", "iconDescription", "href"];
 var componentName = 'Card';
@@ -38,11 +40,16 @@ var Card = /*#__PURE__*/forwardRef(function (_ref, ref) {
     actionIcons = _ref$actionIcons === void 0 ? defaults.actionIcons : _ref$actionIcons,
     _ref$actionsPlacement = _ref.actionsPlacement,
     actionsPlacement = _ref$actionsPlacement === void 0 ? defaults.actionsPlacement : _ref$actionsPlacement,
+    _ref$metadata = _ref.metadata,
+    metadata = _ref$metadata === void 0 ? defaults.actionIcons : _ref$metadata,
     children = _ref.children,
     className = _ref.className,
     _ref$clickZone = _ref.clickZone,
     clickZone = _ref$clickZone === void 0 ? defaults.clickZone : _ref$clickZone,
     description = _ref.description,
+    disabled = _ref.disabled,
+    footerActionIcon = _ref.footerActionIcon,
+    getStarted = _ref.getStarted,
     label = _ref.label,
     media = _ref.media,
     _ref$mediaPosition = _ref.mediaPosition,
@@ -74,12 +81,18 @@ var Card = /*#__PURE__*/forwardRef(function (_ref, ref) {
     secondaryButtonPlacement = _ref$secondaryButtonP === void 0 ? defaults.secondaryButtonPlacement : _ref$secondaryButtonP,
     secondaryButtonText = _ref.secondaryButtonText,
     slug = _ref.slug,
+    status = _ref.status,
+    sequence = _ref.sequence,
     title = _ref.title,
     _ref$titleSize = _ref.titleSize,
     titleSize = _ref$titleSize === void 0 ? defaults.titleSize : _ref$titleSize,
     rest = _objectWithoutProperties(_ref, _excluded);
+  var getIcons = function getIcons() {
+    return getStarted ? metadata : actionIcons;
+  };
   var blockClass = "".concat(pkg.prefix, "--card");
-  var hasActions = actionIcons.length > 0 || overflowActions.length > 0 || !!primaryButtonText && primaryButtonPlacement === 'top';
+  var hasActions = getIcons().length > 0 || overflowActions.length > 0 || !!primaryButtonText && primaryButtonPlacement === 'top';
+  var hasHeaderActions = hasActions && actionsPlacement === 'top';
   var hasFooterActions = hasActions && actionsPlacement === 'bottom';
   var hasFooterButton = !!secondaryButtonText || !!primaryButtonText && primaryButtonPlacement === 'bottom';
   var hasBottomBar = hasFooterActions || hasFooterButton;
@@ -111,13 +124,21 @@ var Card = /*#__PURE__*/forwardRef(function (_ref, ref) {
         }, rest));
       })));
     }
-    var icons = actionIcons.map(function (_ref3) {
+    var icons = getIcons().map(function (_ref3) {
       var id = _ref3.id,
         Icon = _ref3.icon,
         onClick = _ref3.onClick,
         iconDescription = _ref3.iconDescription,
         href = _ref3.href,
         rest = _objectWithoutProperties(_ref3, _excluded3);
+      if (getStarted) {
+        return /*#__PURE__*/React__default.createElement("span", {
+          key: id,
+          className: "".concat(blockClass, "__icon")
+        }, /*#__PURE__*/React__default.createElement(Icon, {
+          "aria-label": iconDescription
+        }), iconDescription);
+      }
       if (productive) {
         return /*#__PURE__*/React__default.createElement(Button, _extends({}, rest, {
           key: id,
@@ -157,7 +178,7 @@ var Card = /*#__PURE__*/forwardRef(function (_ref, ref) {
     var clickable = hasClickEvent && !productive || hasClickEvent && productive && clickZone === 'one';
     var cardProps = _objectSpread2(_objectSpread2({}, rest), {}, {
       ref: ref,
-      className: cx(blockClass, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(blockClass, "__productive"), productive), "".concat(blockClass, "__clickable"), clickable), "".concat(blockClass, "__media-left"), mediaPosition === 'left'), "".concat(blockClass, "--has-slug"), !!slug), className)
+      className: cx(blockClass, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(blockClass, "__disabled"), disabled), "".concat(blockClass, "__get-started"), getStarted), "".concat(blockClass, "__productive"), productive), "".concat(blockClass, "__clickable"), clickable), "".concat(blockClass, "__media-left"), mediaPosition === 'left'), "".concat(blockClass, "--has-slug"), !!slug), className)
     }, clickable && clickableProps);
     return cardProps;
   };
@@ -173,7 +194,7 @@ var Card = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var getHeaderProps = function getHeaderProps() {
     return {
       actions: actionsPlacement === 'top' ? getActions() : '',
-      noActionIcons: actionIcons.length > 0 && actionsPlacement === 'top' ? false : true,
+      noActionIcons: getIcons().length > 0 && actionsPlacement === 'top' ? false : true,
       actionsPlacement: actionsPlacement,
       onPrimaryButtonClick: onPrimaryButtonClick,
       onSecondaryButtonClick: onSecondaryButtonClick,
@@ -182,7 +203,7 @@ var Card = /*#__PURE__*/forwardRef(function (_ref, ref) {
       primaryButtonText: primaryButtonText,
       primaryButtonDisabled: primaryButtonDisabled,
       description: description,
-      hasActions: hasActions,
+      hasActions: hasHeaderActions,
       inClickableCard: hasClickEvent,
       label: label,
       secondaryButtonDisabled: secondaryButtonDisabled,
@@ -206,6 +227,8 @@ var Card = /*#__PURE__*/forwardRef(function (_ref, ref) {
     return {
       actions: actionsPlacement === 'bottom' ? getActions() : '',
       actionsPlacement: actionsPlacement,
+      disabled: disabled,
+      footerActionIcon: footerActionIcon,
       hasActions: hasFooterActions,
       hasButton: hasFooterButton,
       onPrimaryButtonClick: onPrimaryButtonClick,
@@ -225,13 +248,21 @@ var Card = /*#__PURE__*/forwardRef(function (_ref, ref) {
       secondaryButtonText: secondaryButtonText
     };
   };
-  return /*#__PURE__*/React__default.createElement("div", getCardProps(), media && /*#__PURE__*/React__default.createElement("div", {
+  return /*#__PURE__*/React__default.createElement("div", getCardProps(), !getStarted && media && /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__media")
   }, media), Pictogram && /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__pictogram")
-  }, /*#__PURE__*/React__default.createElement(Pictogram, null)), /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React__default.createElement(Pictogram, null)), getStarted && sequence && /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(blockClass, "__sequence")
+  }, sequence), getStarted && status && /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(blockClass, "__status")
+  }, status === 'incomplete' && (_Incomplete || (_Incomplete = /*#__PURE__*/React__default.createElement(Incomplete, null))), status === 'complete' && (_CheckmarkOutline || (_CheckmarkOutline = /*#__PURE__*/React__default.createElement(CheckmarkOutline, null)))), /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__content-container")
-  }, /*#__PURE__*/React__default.createElement("div", getHeaderBodyProps(), /*#__PURE__*/React__default.createElement(CardHeader, getHeaderProps()), /*#__PURE__*/React__default.createElement("div", getBodyProps(), children)), hasBottomBar && /*#__PURE__*/React__default.createElement(CardFooter, getFooterProps())));
+  }, /*#__PURE__*/React__default.createElement("div", getHeaderBodyProps(), /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(blockClass, "__header-wrapper")
+  }, /*#__PURE__*/React__default.createElement(CardHeader, getHeaderProps()), /*#__PURE__*/React__default.createElement("div", getBodyProps(), children)), getStarted && media && /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(blockClass, "__media")
+  }, media)), hasBottomBar && /*#__PURE__*/React__default.createElement(CardFooter, getFooterProps())));
 });
 Card.propTypes = {
   actionIcons: PropTypes.arrayOf(PropTypes.shape({
@@ -247,9 +278,17 @@ Card.propTypes = {
   className: PropTypes.string,
   clickZone: PropTypes.oneOf(['one', 'two', 'three']),
   description: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.node]),
+  disabled: PropTypes.bool,
+  footerActionIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+  getStarted: PropTypes.bool,
   label: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.node]),
   media: PropTypes.node,
   mediaPosition: PropTypes.oneOf(['top', 'left']),
+  metadata: PropTypes.arrayOf(PropTypes.shape({
+    id: PropTypes.string,
+    icon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    iconDescription: PropTypes.string
+  })),
   onClick: PropTypes.func,
   onKeyDown: PropTypes.func,
   onPrimaryButtonClick: PropTypes.func,
@@ -275,11 +314,13 @@ Card.propTypes = {
   secondaryButtonKind: PropTypes.oneOf(['secondary', 'ghost']),
   secondaryButtonPlacement: PropTypes.oneOf(['top', 'bottom']),
   secondaryButtonText: PropTypes.string,
+  sequence: PropTypes.number,
   /**
    * **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: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]),
+  status: PropTypes.oneOf(['complete', 'incomplete']),
   title: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.node]),
   titleSize: PropTypes.oneOf(['default', 'large'])
 };

package/es/components/Card/CardFooter.d.ts

@@ -1,5 +1,7 @@
-export function CardFooter({ actions, hasActions, hasButton, onPrimaryButtonClick, onSecondaryButtonClick, primaryButtonDisabled, primaryButtonHref, primaryButtonIcon, primaryButtonKind, primaryButtonPlacement, primaryButtonText, productive, secondaryButtonDisabled, secondaryButtonHref, secondaryButtonIcon, secondaryButtonKind, secondaryButtonPlacement, secondaryButtonText, }: {
+export function CardFooter({ actions, disabled, footerActionIcon: FooterActionIcon, hasActions, hasButton, onPrimaryButtonClick, onSecondaryButtonClick, primaryButtonDisabled, primaryButtonHref, primaryButtonIcon, primaryButtonKind, primaryButtonPlacement, primaryButtonText, productive, secondaryButtonDisabled, secondaryButtonHref, secondaryButtonIcon, secondaryButtonKind, secondaryButtonPlacement, secondaryButtonText, }: {
     actions?: any[] | undefined;
+    disabled: any;
+    footerActionIcon: any;
     hasActions: any;
     hasButton: any;
     onPrimaryButtonClick: any;
@@ -21,6 +23,8 @@ export function CardFooter({ actions, hasActions, hasButton, onPrimaryButtonClic
 export namespace CardFooter {
     export namespace propTypes {
         let actions: PropTypes.Requireable<NonNullable<any[] | PropTypes.ReactNodeLike>>;
+        let disabled: PropTypes.Requireable<boolean>;
+        let footerActionIcon: PropTypes.Requireable<object>;
         let hasActions: PropTypes.Requireable<boolean>;
         let hasButton: PropTypes.Requireable<boolean>;
         let onPrimaryButtonClick: PropTypes.Requireable<(...args: any[]) => any>;

package/es/components/Card/CardFooter.js

@@ -11,7 +11,9 @@ import cx from 'classnames';
 import { Button } from '@carbon/react';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import { pkg } from '../../settings.js';
+import { Error } from '@carbon/react/icons';
 
+var _Error;
 var componentName = 'CardFooter';
 var defaults = {
   actions: Object.freeze([]),
@@ -22,6 +24,8 @@ var defaults = {
 var CardFooter = function CardFooter(_ref) {
   var _ref$actions = _ref.actions,
     actions = _ref$actions === void 0 ? defaults.actions : _ref$actions,
+    disabled = _ref.disabled,
+    FooterActionIcon = _ref.footerActionIcon,
     hasActions = _ref.hasActions,
     hasButton = _ref.hasButton,
     onPrimaryButtonClick = _ref.onPrimaryButtonClick,
@@ -63,10 +67,16 @@ var CardFooter = function CardFooter(_ref) {
     disabled: primaryButtonDisabled
   }, primaryButtonText), hasActions && /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(blockClass, "__actions")
-  }, actions));
+  }, actions), FooterActionIcon && /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(blockClass, "__action-icon")
+  }, disabled ? _Error || (_Error = /*#__PURE__*/React__default.createElement(Error, {
+    size: 16
+  })) : /*#__PURE__*/React__default.createElement(FooterActionIcon, null)));
 };
 CardFooter.propTypes = {
   actions: PropTypes.oneOfType([PropTypes.array, PropTypes.node]),
+  disabled: PropTypes.bool,
+  footerActionIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   hasActions: PropTypes.bool,
   hasButton: PropTypes.bool,
   onPrimaryButtonClick: PropTypes.func,

package/es/components/Carousel/Carousel.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ReactNode } from 'react';
-interface CarouselProps {
+export interface CarouselProps {
     /**
      * Provide the contents of the Carousel.
      */
@@ -41,6 +41,10 @@ interface CarouselProps {
      * a value between 0 and 1.
      */
     onScroll?: (scrollPercent: number) => void;
+    /**
+     * Additional props passed to the component.
+     */
+    [key: string]: any;
 }
 /**
  * The Carousel acts as a scaffold for other Novice to Pro content.
@@ -58,5 +62,5 @@ interface CarouselProps {
  * 2. From the right-aligned position, when scrolling left,
  *      the left-most item should again be left-aligned.
  */
-declare const Carousel: React.ForwardRefExoticComponent<CarouselProps & React.RefAttributes<HTMLDivElement>>;
+declare const Carousel: React.ForwardRefExoticComponent<Omit<CarouselProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { Carousel };

package/es/components/Checklist/Checklist.d.ts

@@ -1,8 +1,106 @@
+/**
+ * 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.
+ */
+/// <reference path="../../../src/custom-typings/index.d.ts" />
+/**
+ * TODO: Breakdown titles, icons, clickable items into sub-components
+ * See
+ *   ModifiedTabs (ModifiedTabLabelNew, ModifiedTabLabelWithClose)
+ *   PageHeader (PageHeaderTitle, PageHeaderUtils)
+ */
+import React, { ReactNode } from 'react';
+import { IconButton } from '@carbon/react';
+import { Kind, Theme } from './Checklist.types';
+type Task = {
+    kind: Kind;
+    label: string;
+    onClick?(task?: Task): void;
+};
+type TaskList = {
+    title?: string;
+    tasks: Array<Task>;
+};
+interface ChecklistProps {
+    /**
+     * Define both `chartLabel` and `chartValue` to show the chart and its label together.
+     */
+    chartLabel?: string;
+    /**
+     * A number between 0 and 1.
+     *
+     * Define both `chartLabel` and `chartValue` to show the chart and its label together.
+     */
+    chartValue?: number;
+    /**
+     * Aria-label for the Checklist component.
+     */
+    checklistAriaLabel?: string;
+    /**
+     * Aria-label for the Checklist's toggle component.
+     */
+    checklistToggleAriaLabel?: string;
+    /**
+     * Provide an optional class to be applied to the containing node.
+     */
+    className?: string;
+    /**
+     * Whether or not to show the open/close toggle.
+     */
+    enableToggle?: boolean;
+    /**
+     * Callback for the "View all" button. See also `viewAllLabel`.
+     */
+    onClickViewAll?(): void;
+    /**
+     * Optional callback for when the list is opened/closed.
+     */
+    onToggle?(isOpen?: boolean): void;
+    /**
+     * Specifies whether the component is opened or closed.
+     * This can be set during initialization, or changed after being rendered.
+     */
+    open?: boolean;
+    /**
+     * The task list can be broken down into sub-lists.
+     *
+     * Each sub-list can include an optional `title`.
+     *
+     * Each task must specify the appropriate icon (`kind`) and `label`.
+     *
+     * If any task has an `onClick` callback function defined,
+     * then the `label` will be rendered as a button,
+     * else the `label` will be rendered as plain text.
+     */
+    taskLists: Array<TaskList>;
+    /**
+     * Determines the theme of the component.
+     */
+    theme?: Theme;
+    /**
+     * The title of the component.
+     */
+    title?: ReactNode;
+    /**
+     * The label for the toggle's tooltip.
+     */
+    toggleLabel?: string;
+    /**
+     * The alignment of the toggle's tooltip.
+     */
+    toggleLabelAlign?: React.ComponentProps<typeof IconButton>['align'];
+    /**
+     * If defined, will show and enable the "View all (#)" button at the bottom of the list.
+     */
+    viewAllLabel?: string;
+}
 /**
  * The Checklist tracks a user's progress much like Your Learning or
  * WalkMe. Each item in the list can be clickable, and each item has
  * an icon that defines the item's state as "not started", "in progress",
  * and "complete".
  */
-export let Checklist: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+export declare let Checklist: React.ForwardRefExoticComponent<ChecklistProps & React.RefAttributes<HTMLElement>>;
+export {};