@carbon/ibm-products 2.41.1-canary.8 → 2.42.0

package/lib/components/Datagrid/types/index.d.ts

@@ -0,0 +1,210 @@
+/// <reference path="../../../../src/custom-typings/index.d.ts" />
+import { MultiSelectProps } from '@carbon/react/lib/components/MultiSelect/MultiSelect';
+import { FormGroupProps } from '@carbon/react/lib/components/FormGroup/FormGroup';
+import { RadioButtonProps } from '@carbon/react/lib/components/RadioButton/RadioButton';
+import { RadioButtonGroupProps } from '@carbon/react/lib/components/RadioButtonGroup/RadioButtonGroup';
+import { CheckboxProps } from '@carbon/react/lib/components/Checkbox';
+import { NumberInputProps } from '@carbon/react/lib/components/NumberInput/NumberInput';
+import { CSSProperties, JSXElementConstructor, MutableRefObject, ReactNode, TouchEventHandler } from 'react';
+import { Cell, ColumnInstance, FilterValue, Filters, HeaderGroup, Row, TableCommonProps, TableDispatch, TableInstance, TableToggleAllRowsSelectedProps, UseExpandedRowProps, UseFiltersInstanceProps, UsePaginationInstanceProps, UseResizeColumnsColumnProps, UseResizeColumnsState, UseRowSelectInstanceProps, UseRowSelectRowProps, UseRowSelectState, UseSortByColumnProps, UseTableHooks } from 'react-table';
+import { CarbonIconType } from '@carbon/react/icons';
+import { type ButtonProps } from '@carbon/react';
+import { TableBatchActionsProps } from '@carbon/react/lib/components/DataTable/TableBatchActions';
+export type Size = 'xs' | 'sm' | 'md' | 'lg';
+export interface ResizerProps {
+    draggable?: boolean;
+    onMouseDown?: (evt: any) => void;
+    onTouchStart?: TouchEventHandler<HTMLElement>;
+    role?: string;
+    style?: CSSProperties;
+}
+export type DataGridFilter = ({
+    column?: string;
+} & {
+    type: 'date';
+    props: {
+        DatePicker?: any;
+        DatePickerInput?: any;
+    };
+}) | {
+    type: 'number';
+    props: {
+        NumberInput?: NumberInputProps;
+    };
+} | {
+    type: 'checkbox';
+    props: {
+        FormGroup?: FormGroupProps;
+        Checkbox?: CheckboxProps[];
+    };
+} | {
+    type: 'radio';
+    props: {
+        FormGroup?: FormGroupProps;
+        RadioButton?: RadioButtonProps[];
+        RadioButtonGroup?: RadioButtonGroupProps;
+    };
+} | {
+    type: 'multiSelect';
+    props: {
+        MultiSelect?: MultiSelectProps<any>;
+    };
+};
+export interface ReactTableFiltersState {
+    id: string;
+    type: string;
+    value: string;
+}
+interface Labels {
+    allPageRows?: object;
+    allRows?: object;
+}
+interface Section {
+    categoryTitle?: string;
+    filters?: DataGridFilter[];
+}
+export interface FilterFlyoutProps {
+    data?: any;
+    filters?: DataGridFilter[];
+    flyoutIconDescription?: string;
+    onFlyoutClose?: () => void;
+    onFlyoutOpen?: () => void;
+    panelIconDescription?: string;
+    primaryActionLabel?: string;
+    reactTableFiltersState?: ReactTableFiltersState[];
+    renderLabel?: () => void;
+    secondaryActionLabel?: string;
+    updateMethod?: string;
+    variation?: string;
+    panelTitle?: string;
+    sections?: Section[];
+    autoHideFilters: boolean;
+}
+export interface DataGridToggleAllRowsProps extends TableToggleAllRowsSelectedProps {
+    disabled?: boolean;
+}
+export interface DatagridTableHooks<T extends object = any> extends UseTableHooks<T> {
+}
+export interface DatagridColumn<T extends object = any> extends ColumnInstance<T> {
+    sticky?: 'left' | 'right';
+    className?: string;
+}
+export interface DataGridCell<T extends object = any> extends Omit<Cell<T>, 'column'> {
+    column: DatagridColumn<any>;
+}
+export interface DatagridRow<T extends object = any> extends Omit<Row<T>, 'cells'>, UseExpandedRowProps<T>, UseRowSelectRowProps<T> {
+    expandedContentHeight?: number;
+    RowRenderer?: (state?: DataGridState) => ReactNode;
+    RowExpansionRenderer?: (state?: DataGridState) => void;
+    cells: Array<DataGridCell>;
+    isSkeleton?: boolean;
+}
+export interface DataGridHeader<T extends object = any> extends ColumnInstance, UseResizeColumnsColumnProps<T>, UseSortByColumnProps<T> {
+    className(className: any, arg1: {
+        [x: string]: any;
+    }): unknown;
+    isAction?: boolean;
+    slug?: any;
+}
+export interface DataGridHeaderGroup<T extends object = any> extends HeaderGroup<T>, UseResizeColumnsColumnProps<T> {
+}
+export interface TableProps {
+    className?: string;
+    role?: string;
+    style?: CSSStyleDeclaration;
+}
+interface DataGridTableState extends UseResizeColumnsState<any>, UseRowSelectState<any> {
+    filters: Filters<DataGridFilter>;
+}
+export interface DataGridTableInstance<T extends object = any> extends TableInstance<T> {
+}
+export interface DataGridState<T extends object = any> extends TableCommonProps, UsePaginationInstanceProps<T>, Omit<TableInstance<T>, 'state' | 'headers' | 'rows' | 'columns'>, Omit<UseFiltersInstanceProps<T>, 'rows'>, UseRowSelectInstanceProps<T>, Pick<UseRowSelectInstanceProps<T>, 'toggleAllRowsSelected'> {
+    withVirtualScroll?: boolean;
+    DatagridPagination?: JSXElementConstructor<any>;
+    isFetching?: boolean;
+    tableId?: string;
+    filterProps?: FilterFlyoutProps;
+    state: DataGridTableState;
+    getFilterFlyoutProps?: () => FilterFlyoutProps;
+    DatagridActions?: JSXElementConstructor<any>;
+    CustomizeColumnsTearsheet?: JSXElementConstructor<any>;
+    fullHeightDatagrid?: boolean;
+    variableRowHeight?: boolean;
+    useDenseHeader?: boolean;
+    withInlineEdit?: boolean;
+    verticalAlign?: string;
+    gridTitle?: ReactNode;
+    gridDescription?: ReactNode;
+    gridRef?: MutableRefObject<HTMLDivElement>;
+    DatagridBatchActions?: (args: any) => ReactNode;
+    batchActions?: boolean;
+    row: DatagridRow;
+    rows: Array<DatagridRow<any>>;
+    columns: Array<DatagridColumn>;
+    key?: any;
+    rowSize?: Size;
+    headers?: Array<DataGridHeader<T>>;
+    headRef?: MutableRefObject<HTMLDivElement>;
+    HeaderRow?: (state?: object, ref?: MutableRefObject<HTMLDivElement>, group?: HeaderGroup<any>) => ReactNode;
+    withStickyColumn?: boolean;
+    emptyStateTitle?: string | ReactNode;
+    emptyStateDescription?: string;
+    emptyStateSize?: 'lg' | 'sm';
+    emptyStateType?: string;
+    illustrationTheme?: 'light' | 'dark';
+    emptyStateAction: {
+        kind?: 'primary' | 'secondary' | 'tertiary';
+        renderIcon?: CarbonIconType;
+        onClick?: ButtonProps<any>['onClick'];
+        text?: string;
+    };
+    emptyStateLink?: {
+        text?: string | ReactNode;
+        href?: string;
+    };
+    isTableSortable?: boolean;
+    resizerAriaLabel?: string;
+    onColResizeEnd?: () => void;
+    withNestedRows?: boolean;
+    withExpandedRows?: boolean;
+    withMouseHover?: boolean;
+    setMouseOverRowIndex?: (arg: any) => void;
+    hideSelectAll?: boolean;
+    radio?: boolean;
+    onAllRowSelect: (rows: DatagridRow[], evt: any) => void;
+    selectAllToggle?: {
+        onSelectAllRows?: (args: any) => void;
+        labels?: Labels;
+    };
+    allPageRowsLabel?: string | object;
+    allRowsLabel: string | object;
+    onSelectAllRows?: (val?: boolean) => void;
+    toolbarBatchActions?: ButtonProps<any>[];
+    setGlobalFilter?: (filterValue: FilterValue) => void;
+    batchActionMenuButtonLabel?: string;
+    translateWithIdBatchActions?: TableBatchActionsProps['translateWithId'];
+    onScroll?: (evt?: any) => void;
+    innerListRef?: MutableRefObject<HTMLDivElement>;
+    tableHeight?: number;
+    virtualHeight?: number;
+    listRef?: MutableRefObject<any>;
+    handleResize?: () => void;
+    onVirtualScroll?: (evt?: boolean) => void;
+    fetchMoreData?: () => void;
+    loadMoreThreshold?: number;
+}
+export interface ResizeHeaderProps {
+    resizerProps?: ResizerProps;
+    header: DataGridHeader;
+    originalCol?: DatagridColumn;
+    handleOnMouseDownResize?: (evt?: any, props?: ResizerProps) => void;
+    columnWidths?: any[];
+    datagridState: DataGridState;
+    incrementAmount: number;
+    minWidth?: number;
+    dispatch?: TableDispatch<any>;
+    onColResizeEnd?: () => void;
+    resizerAriaLabel?: string;
+    isFetching?: boolean;
+}
+export {};

package/lib/components/Datagrid/useColumnOrder.d.ts

@@ -1 +1,2 @@
 export default useColumnOrder;
+import { useColumnOrder } from 'react-table';

package/lib/components/Datagrid/useDatagrid.d.ts

@@ -1,2 +1,2 @@
 export default useDatagrid;
-declare function useDatagrid(params: any, ...plugins: any[]): any;
+declare function useDatagrid(params: any, ...plugins: any[]): import("react-table").TableInstance<any>;

package/lib/components/Datagrid/useFocusRowExpander.js

@@ -38,7 +38,7 @@ var useFocusRowExpander = function useFocusRowExpander(_ref) {
     });
     if (activeRow.length) {
       var rowExpander = activeRow[0].querySelector(".".concat(blockClass, "__row-expander"));
-      rowExpander.focus();
+      rowExpander === null || rowExpander === void 0 || rowExpander.focus();
     }
   }, [instance === null || instance === void 0 ? void 0 : instance.tableId, instance === null || instance === void 0 ? void 0 : instance.expandedRows, lastExpandedRowIndex, blockClass, activeElement]);
 };

package/lib/components/Datagrid/useInfiniteScroll.d.ts

@@ -1,2 +1,9 @@
+/**
+ * Copyright IBM Corp. 2020, 2023
+ *
+ * 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 { Hooks } from 'react-table';
+declare const useInfiniteScroll: (hooks: Hooks) => void;
 export default useInfiniteScroll;
-declare function useInfiniteScroll(hooks: any): void;

package/lib/components/Datagrid/useInfiniteScroll.js

@@ -23,12 +23,13 @@ var useInfiniteScroll = function useInfiniteScroll(hooks) {
   useResizeTable["default"](hooks);
   var useInstance = function useInstance(instance) {
     var _tableElement;
-    var isFetching = instance.isFetching,
-      tableHeight = instance.tableHeight,
-      innerListRef = instance.innerListRef,
-      fetchMoreData = instance.fetchMoreData,
-      tableId = instance.tableId,
-      loadMoreThreshold = instance.loadMoreThreshold;
+    var _ref = instance,
+      isFetching = _ref.isFetching,
+      tableHeight = _ref.tableHeight,
+      innerListRef = _ref.innerListRef,
+      fetchMoreData = _ref.fetchMoreData,
+      tableId = _ref.tableId,
+      loadMoreThreshold = _ref.loadMoreThreshold;
     var tableElement;
     if (typeof document !== 'undefined') {
       tableElement = document.querySelector("#".concat(tableId));
@@ -41,9 +42,9 @@ var useInfiniteScroll = function useInfiniteScroll(hooks) {
       leading: true,
       trailing: false
     }), [fetchMoreData]);
-    var onScroll = function onScroll(_ref) {
-      var scrollDirection = _ref.scrollDirection,
-        scrollOffset = _ref.scrollOffset;
+    var onScroll = function onScroll(_ref2) {
+      var scrollDirection = _ref2.scrollDirection,
+        scrollOffset = _ref2.scrollOffset;
       if (innerListRef && innerListRef.current) {
         if (!isFetching && scrollDirection === 'forward' && scrollOffset + totalTableHeight >= innerListRef.current.clientHeight - loadMoreThresholdValue) {
           if (fetchMoreData) {

package/lib/components/Datagrid/useSelectRows.js

@@ -128,7 +128,11 @@ var SelectRow = function SelectRow(datagridState) {
   var cellProps = cell.getCellProps();
   var isFirstColumnStickyLeft = ((_columns$ = columns[0]) === null || _columns$ === void 0 ? void 0 : _columns$.sticky) === 'left' && withStickyColumn;
   var rowId = "".concat(tableId, "-").concat(row.id, "-").concat(row.index);
-  return /*#__PURE__*/React__default["default"].createElement(react.TableSelectRow, _rollupPluginBabelHelpers["extends"]({}, cellProps, selectProps, {
+  var key = cellProps.key,
+    _cellProps = cellProps._cellProps;
+  return /*#__PURE__*/React__default["default"].createElement(react.TableSelectRow, _rollupPluginBabelHelpers["extends"]({
+    key: key
+  }, _cellProps, selectProps, {
     radio: radio,
     onSelect: onSelectHandler,
     id: rowId,

package/lib/components/EditUpdateCards/EditUpdateCards.d.ts

@@ -14,6 +14,7 @@ type ActionIcon = {
     iconDescription: string;
     href?: string;
 };
+type PlacementType = 'top' | 'bottom';
 interface EditUpdateCardsProps {
     /**
      * Icons that are displayed on card. Refer to design documentation for implementation guidelines
@@ -22,7 +23,7 @@ interface EditUpdateCardsProps {
     /**
      * Determines if the action icons are on the top or bottom of the card
      */
-    actionsPlacement?: 'top' | 'bottom';
+    actionsPlacement?: PlacementType;
     /**
      * Optional label for the top of the card.
      */
@@ -66,7 +67,7 @@ interface EditUpdateCardsProps {
     /**
      * Determines if the primary button is on the top or bottom of the card
      */
-    primaryButtonPlacement?: 'top' | 'bottom';
+    primaryButtonPlacement?: PlacementType;
     /**
      * The text that's displayed in the primary button
      */
@@ -86,7 +87,7 @@ interface EditUpdateCardsProps {
     /**
      * Determines if the secondary button is on the top or bottom of the card
      */
-    secondaryButtonPlacement?: 'top' | 'bottom';
+    secondaryButtonPlacement?: PlacementType;
     /**
      * The text that's displayed in the secondary button
      */

package/lib/components/FilterSummary/FilterSummary.d.ts

@@ -1,3 +1,22 @@
-export default FilterSummary;
-declare let FilterSummary: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+/**
+ * Copyright IBM Corp. 2022, 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 from 'react';
+export interface Filter {
+    key: string;
+    value: string;
+}
+interface FilterSummaryProps {
+    className?: string;
+    clearButtonInline?: boolean;
+    clearFilters: () => void;
+    clearFiltersText?: string;
+    filters: Filter[];
+    overflowType?: 'default' | 'tag';
+    renderLabel?: (key: any, value: any) => void;
+}
+declare const FilterSummary: React.ForwardRefExoticComponent<FilterSummaryProps & React.RefAttributes<HTMLDivElement>>;
+export default FilterSummary;

package/lib/components/FilterSummary/FilterSummary.js

@@ -42,8 +42,7 @@ var FilterSummary = /*#__PURE__*/React__default["default"].forwardRef(function (
     clearFiltersText = _ref$clearFiltersText === void 0 ? 'Clear filters' : _ref$clearFiltersText,
     clearFilters = _ref.clearFilters,
     filters = _ref.filters,
-    _ref$renderLabel = _ref.renderLabel,
-    renderLabel = _ref$renderLabel === void 0 ? null : _ref$renderLabel,
+    renderLabel = _ref.renderLabel,
     _ref$overflowType = _ref.overflowType,
     overflowType = _ref$overflowType === void 0 ? 'default' : _ref$overflowType,
     _ref$clearButtonInlin = _ref.clearButtonInline,
@@ -60,9 +59,9 @@ var FilterSummary = /*#__PURE__*/React__default["default"].forwardRef(function (
       label: (_renderLabel = renderLabel === null || renderLabel === void 0 ? void 0 : renderLabel(key, value)) !== null && _renderLabel !== void 0 ? _renderLabel : "".concat(key, ": ").concat(value)
     });
   });
-  var filterSummaryClearButton = React.useRef();
-  var viewAllButtonRef = React.useRef();
-  var filterSummaryRef = React.useRef();
+  var filterSummaryClearButton = React.useRef(null);
+  var viewAllButtonRef = React.useRef(null);
+  var filterSummaryRef = React.useRef(null);
   var localRef = filterSummaryRef || ref;
   var _useState = React.useState(0),
     _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
@@ -74,7 +73,7 @@ var FilterSummary = /*#__PURE__*/React__default["default"].forwardRef(function (
     setMultiline = _useState4[1];
   var previousState = usePreviousValue.usePreviousValue({
     multiline: multiline
-  });
+  }) || {};
   var handleViewAll = function handleViewAll() {
     if (overflowCount === 0) {
       setMultiline(false);
@@ -85,7 +84,7 @@ var FilterSummary = /*#__PURE__*/React__default["default"].forwardRef(function (
     });
   };
   var viewAllWidth = typeof (viewAllButtonRef === null || viewAllButtonRef === void 0 || (_viewAllButtonRef$cur = viewAllButtonRef.current) === null || _viewAllButtonRef$cur === void 0 ? void 0 : _viewAllButtonRef$cur.offsetWidth) === 'undefined' ? 0 : overflowCount > 0 ? 48 : 0;
-  var measurementOffset = (filterSummaryClearButton === null || filterSummaryClearButton === void 0 || (_filterSummaryClearBu = filterSummaryClearButton.current) === null || _filterSummaryClearBu === void 0 ? void 0 : _filterSummaryClearBu.offsetWidth) + viewAllWidth;
+  var measurementOffset = ((filterSummaryClearButton === null || filterSummaryClearButton === void 0 || (_filterSummaryClearBu = filterSummaryClearButton.current) === null || _filterSummaryClearBu === void 0 ? void 0 : _filterSummaryClearBu.offsetWidth) || 0) + viewAllWidth;
   var renderTagSet = function renderTagSet(type) {
     return /*#__PURE__*/React__default["default"].createElement(framerMotion.motion.div, {
       key: type,
@@ -116,15 +115,15 @@ var FilterSummary = /*#__PURE__*/React__default["default"].forwardRef(function (
       containingElementRef: localRef,
       measurementOffset: measurementOffset,
       onOverflowTagChange: function onOverflowTagChange(overflowTags) {
-        return setOverflowCount(overflowTags.length);
+        return setOverflowCount(overflowTags === null || overflowTags === void 0 ? void 0 : overflowTags.length);
       },
       multiline: multiline
     }));
   };
   useWindowResize.useWindowResize(function () {
     var handleFilterSummaryResize = function handleFilterSummaryResize() {
-      var _localRef$current;
-      if (multiline && (localRef === null || localRef === void 0 || (_localRef$current = localRef.current) === null || _localRef$current === void 0 ? void 0 : _localRef$current.offsetHeight) <= 50) {
+      var _localRef$current, _localRef$current2;
+      if (multiline && localRef !== null && localRef !== void 0 && (_localRef$current = localRef.current) !== null && _localRef$current !== void 0 && _localRef$current.offsetHeight && (localRef === null || localRef === void 0 || (_localRef$current2 = localRef.current) === null || _localRef$current2 === void 0 ? void 0 : _localRef$current2.offsetHeight) <= 50) {
         setMultiline(false);
       }
     };
@@ -137,7 +136,6 @@ var FilterSummary = /*#__PURE__*/React__default["default"].forwardRef(function (
     ref: localRef,
     className: cx__default["default"]([blockClass, className], _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__expanded"), multiline))
   }), /*#__PURE__*/React__default["default"].createElement(framerMotion.AnimatePresence, {
-    mode: "wait",
     exitBeforeEnter: true
   }, !multiline && renderTagSet('single'), multiline && renderTagSet('multiline')), /*#__PURE__*/React__default["default"].createElement(react.Button, {
     kind: "ghost",
@@ -166,6 +164,7 @@ FilterSummary.propTypes = {
   clearButtonInline: index["default"].bool,
   clearFilters: index["default"].func.isRequired,
   clearFiltersText: index["default"].string,
+  /**@ts-ignore */
   filters: index["default"].arrayOf(index["default"].object).isRequired,
   overflowType: index["default"].oneOf(['default', 'tag']),
   renderLabel: index["default"].func

package/lib/components/Guidebanner/Guidebanner.js

@@ -18,6 +18,7 @@ var icons = require('@carbon/react/icons');
 var react = require('@carbon/react');
 var devtools = require('../../global/js/utils/devtools.js');
 var settings = require('../../settings.js');
+var uuidv4 = require('../../global/js/utils/uuidv4.js');
 var Carousel = require('../Carousel/Carousel.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -85,8 +86,9 @@ exports.Guidebanner = /*#__PURE__*/React__default["default"].forwardRef(function
       return !prevState;
     });
   };
+  var carouselContentId = "".concat(uuidv4["default"](), "--carousel-content-id");
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
-    "aria-expanded": !isCollapsed,
+    "aria-owns": !isCollapsed ? carouselContentId : undefined,
     className: cx__default["default"](blockClass, className, collapsible && "".concat(blockClass, "__collapsible"), isCollapsed && "".concat(blockClass, "__collapsible-collapsed"), withLeftGutter && "".concat(blockClass, "__with-left-gutter")),
     ref: ref
   }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React__default["default"].createElement(icons.Idea, {
@@ -95,6 +97,7 @@ exports.Guidebanner = /*#__PURE__*/React__default["default"].forwardRef(function
   }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(blockClass, "__title")
   }, title), /*#__PURE__*/React__default["default"].createElement(Carousel.Carousel, {
+    id: carouselContentId,
     className: "".concat(blockClass, "__carousel")
     // These colors are to match the Carousel's faded edges
     // against the Guidebanner's gradient background.
@@ -117,7 +120,9 @@ exports.Guidebanner = /*#__PURE__*/React__default["default"].forwardRef(function
     size: "md",
     className: "".concat(blockClass, "__toggle-button"),
     onClick: handleClickToggle,
-    ref: toggleRef
+    ref: toggleRef,
+    "aria-controls": !isCollapsed ? carouselContentId : undefined,
+    "aria-expanded": !isCollapsed
   }, isCollapsed ? expandButtonLabel : collapseButtonLabel), showNavigation && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
     className: cx__default["default"]("".concat(blockClass, "__back-button"), [scrollPosition === 0 ? "".concat(blockClass, "__back-button--disabled") : null])
   }, /*#__PURE__*/React__default["default"].createElement(react.IconButton, {

package/lib/components/ProductiveCard/ProductiveCard.d.ts

@@ -1,2 +1,115 @@
-export let ProductiveCard: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+import React, { PropsWithChildren, ReactNode } from 'react';
+import { CarbonIconType } from '@carbon/icons-react/lib/CarbonIcon';
+type ActionIcon = {
+    id?: string;
+    icon?: CarbonIconType;
+    onKeyDown?(): void;
+    onClick?(): void;
+    iconDescription?: string;
+    href?: string;
+};
+type overflowAction = {
+    id?: string;
+    itemText?: string;
+    onClick?: () => void;
+    onKeydown?: () => void;
+};
+type PlacementType = 'top' | 'bottom';
+type ClickZoneType = 'one' | 'two' | 'three';
+interface ProductiveCardProps extends PropsWithChildren {
+    /**
+     * Icons that are displayed on card. Refer to design documentation for implementation guidelines. Note- href will supersede onClick
+     */
+    actionIcons?: ActionIcon[];
+    /**
+     * Determines if the action icons are on the top or bottom of the card
+     */
+    actionsPlacement?: PlacementType;
+    /**
+     * Content that shows in the body of the card
+     */
+    /**
+     * Optional user provided class
+     */
+    className?: string;
+    children: ReactNode;
+    /**
+     * Designates which zones of the card are clickable. Refer to design documentation for implementation guidelines
+     */
+    clickZone?: ClickZoneType;
+    /**
+     * Optional header description
+     */
+    description?: string | object | ReactNode;
+    /**
+     * Optional label for the top of the card
+     */
+    label?: string | object | ReactNode;
+    /**
+     * 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;
+    /**
+     * Use an overflow menu instead of action icons. Refer to design documentation for implementation guidelines
+     */
+    overflowActions?: overflowAction[];
+    /**
+     * Aria label prop required for OverflowMenu
+     */
+    overflowAriaLabel?: string;
+    /**
+     * 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?: CarbonIconType;
+    /**
+     * Determines if the primary button is on the top or bottom of the card
+     */
+    primaryButtonPlacement?: PlacementType;
+    /**
+     * 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?: CarbonIconType;
+    /**
+     * Determines if the secondary button is on the top or bottom of the card
+     */
+    secondaryButtonPlacement?: PlacementType;
+    /**
+     * 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;
+    /**
+     * Determines title size
+     */
+    titleSize?: 'default' | 'large';
+}
+export declare let ProductiveCard: React.ForwardRefExoticComponent<ProductiveCardProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/lib/components/ProductiveCard/ProductiveCard.js

@@ -23,22 +23,16 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var _excluded = ["actionsPlacement"];
 var componentName = 'ProductiveCard';
-
-// Default values for props
-var defaults = {
-  actionsPlacement: 'top'
-};
 exports.ProductiveCard = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$actionsPlacement = _ref.actionsPlacement,
-    actionsPlacement = _ref$actionsPlacement === void 0 ? defaults.actionsPlacement : _ref$actionsPlacement,
+    actionsPlacement = _ref$actionsPlacement === void 0 ? 'top' : _ref$actionsPlacement,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var validProps = propsHelper.prepareProps(rest, ['media', 'mediaPosition', 'pictogram', 'primaryButtonClick', 'productive', 'secondaryButtonKind']);
   return /*#__PURE__*/React__default["default"].createElement(Card.Card, _rollupPluginBabelHelpers["extends"]({}, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, validProps), {}, {
     actionsPlacement: actionsPlacement,
-    ref: ref
-  }), {
+    ref: ref,
     productive: true
-  }, devtools.getDevtoolsProps(componentName)));
+  }), devtools.getDevtoolsProps(componentName)));
 });
 
 // Return a placeholder if not released and not enabled by feature flag
@@ -47,6 +41,7 @@ exports.ProductiveCard.propTypes = {
   /**
    * Icons that are displayed on card. Refer to design documentation for implementation guidelines
    */
+  /**@ts-ignore */
   actionIcons: index["default"].arrayOf(index["default"].shape({
     id: index["default"].string,
     icon: index["default"].oneOfType([index["default"].func, index["default"].object]),
@@ -94,6 +89,7 @@ exports.ProductiveCard.propTypes = {
   /**
    * Use an overflow menu instead of action icons. Refer to design documentation for implementation guidelines
    */
+  /**@ts-ignore */
   overflowActions: index["default"].arrayOf(index["default"].shape({
     id: index["default"].string,
     itemText: index["default"].string,
@@ -111,6 +107,7 @@ exports.ProductiveCard.propTypes = {
   /**
    * Optional prop to allow overriding the icon rendering. Can be a React component class
    */
+  /**@ts-ignore */
   primaryButtonIcon: index["default"].oneOfType([index["default"].func, index["default"].object]),
   /**
    * Determines if the primary button is on the top or bottom of the card
@@ -119,6 +116,7 @@ exports.ProductiveCard.propTypes = {
   /**
    * The text that's displayed in the primary button
    */
+  /**@ts-ignore */
   primaryButtonText: index["default"].node,
   /**
    * Optionally specify an href for your Button to become an <a> element
@@ -127,6 +125,7 @@ exports.ProductiveCard.propTypes = {
   /**
    * Optional prop to allow overriding the icon rendering. Can be a React component class
    */
+  /**@ts-ignore */
   secondaryButtonIcon: index["default"].oneOfType([index["default"].func, index["default"].object]),
   /**
    * Determines if the secondary button is on the top or bottom of the card
@@ -135,6 +134,7 @@ exports.ProductiveCard.propTypes = {
   /**
    * The text that's displayed in the secondary button
    */
+  /**@ts-ignore */
   secondaryButtonText: index["default"].node,
   /**
    * **Experimental:** For all cases a `Slug` component can be provided.

package/lib/components/WebTerminal/WebTerminal.js

@@ -69,7 +69,7 @@ exports.WebTerminal = /*#__PURE__*/React__default["default"].forwardRef(function
       matches: true
     },
     prefersReducedMotion = _ref2.matches;
-  var webTerminalAnimationName = "".concat(open ? 'web-terminal-entrance' : 'web-terminal-exit', " ").concat(carbonMotion.moderate02);
+  var webTerminalAnimationName = "".concat(open ? 'web-terminal-entrance' : 'web-terminal-exit forwards', " ").concat(carbonMotion.moderate02);
   var showDocumentationLinks = React.useMemo(function () {
     return documentationLinks.length > 0;
   }, [documentationLinks]);

package/lib/global/js/hooks/usePreviousValue.d.ts

@@ -1 +1 @@
-export function usePreviousValue(value: object): undefined;
+export function usePreviousValue(value: object): T | undefined;