@carbon/ibm-products 1.39.0 → 1.41.0

package/es/components/Datagrid/Datagrid/DatagridContent.js

@@ -41,7 +41,8 @@ export var DatagridContent = function DatagridContent(_ref) {
     withInlineEdit = datagridState.withInlineEdit,
     tableId = datagridState.tableId,
     DatagridActions = datagridState.DatagridActions,
-    totalColumnsWidth = datagridState.totalColumnsWidth;
+    totalColumnsWidth = datagridState.totalColumnsWidth,
+    gridRef = datagridState.gridRef;
   var rows = DatagridPagination && datagridState.page || datagridState.rows;
   var gridActive = state.gridActive,
     editId = state.editId;
@@ -81,7 +82,7 @@ export var DatagridContent = function DatagridContent(_ref) {
       onFocus: withInlineEdit ? function () {
         return handleGridFocus(state, dispatch);
       } : null
-    }), /*#__PURE__*/React.createElement(DatagridHead, datagridState), /*#__PURE__*/React.createElement(DatagridBody, _extends({}, datagridState, {
+    }), !withVirtualScroll ? /*#__PURE__*/React.createElement(DatagridHead, datagridState) : null, /*#__PURE__*/React.createElement(DatagridBody, _extends({}, datagridState, {
       rows: rows
     })));
   };
@@ -116,6 +117,9 @@ export var DatagridContent = function DatagridContent(_ref) {
     className: "".concat(blockClass, "__datagridLeftPanel")
   }, leftPanel.panelContent), withInlineEdit ? /*#__PURE__*/React.createElement("div", {
     ref: multiKeyTrackingRef
+  }, renderTable()) : withVirtualScroll ? /*#__PURE__*/React.createElement("div", {
+    className: "".concat(blockClass, "__virtualScrollContainer"),
+    ref: gridRef
   }, renderTable()) : renderTable())), (rows === null || rows === void 0 ? void 0 : rows.length) > 0 && !isFetching && DatagridPagination && /*#__PURE__*/React.createElement(DatagridPagination, datagridState), CustomizeColumnsModal && /*#__PURE__*/React.createElement(CustomizeColumnsModal, {
     instance: datagridState
   }));
@@ -139,6 +143,7 @@ DatagridContent.propTypes = {
     page: PropTypes.arrayOf(PropTypes.object),
     rows: PropTypes.arrayOf(PropTypes.object),
     tableId: PropTypes.string,
-    totalColumnsWidth: PropTypes.number
+    totalColumnsWidth: PropTypes.number,
+    gridRef: PropTypes.object
   })
 };

package/es/components/Datagrid/Datagrid/DatagridEmptyBody.js

@@ -9,7 +9,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import { pkg } from '../../../settings';
 import { DataTable } from 'carbon-components-react';
-import { NoDataEmptyState } from '../../EmptyStates/NoDataEmptyState';
+import { NoDataEmptyState, ErrorEmptyState } from '../../EmptyStates';
 var blockClass = "".concat(pkg.prefix, "--datagrid");
 var TableBody = DataTable.TableBody,
   TableRow = DataTable.TableRow,
@@ -20,16 +20,29 @@ var DatagridEmptyBody = function DatagridEmptyBody(datagridState) {
     emptyStateTitle = datagridState.emptyStateTitle,
     emptyStateDescription = datagridState.emptyStateDescription,
     emptyStateSize = datagridState.emptyStateSize,
-    illustrationTheme = datagridState.illustrationTheme;
+    _datagridState$emptyS = datagridState.emptyStateType,
+    emptyStateType = _datagridState$emptyS === void 0 ? 'noData' : _datagridState$emptyS,
+    illustrationTheme = datagridState.illustrationTheme,
+    emptyStateAction = datagridState.emptyStateAction,
+    emptyStateLink = datagridState.emptyStateLink;
   return /*#__PURE__*/React.createElement(TableBody, _extends({}, getTableBodyProps(), {
     className: "".concat(blockClass, "__empty-state-body")
   }), /*#__PURE__*/React.createElement(TableRow, null, /*#__PURE__*/React.createElement(TableCell, {
     colSpan: headers.length
-  }, /*#__PURE__*/React.createElement(NoDataEmptyState, {
+  }, emptyStateType === 'error' && /*#__PURE__*/React.createElement(ErrorEmptyState, {
     illustrationTheme: illustrationTheme,
     size: emptyStateSize,
     title: emptyStateTitle,
-    subtitle: emptyStateDescription
+    subtitle: emptyStateDescription,
+    action: emptyStateAction,
+    link: emptyStateLink
+  }), emptyStateType === 'noData' && /*#__PURE__*/React.createElement(NoDataEmptyState, {
+    illustrationTheme: illustrationTheme,
+    size: emptyStateSize,
+    title: emptyStateTitle,
+    subtitle: emptyStateDescription,
+    action: emptyStateAction,
+    link: emptyStateLink
   }))));
 };
 export default DatagridEmptyBody;

package/es/components/Datagrid/Datagrid/DatagridRow.js

@@ -10,14 +10,12 @@ var _excluded = ["children"];
  * restricted by GSA ADP Schedule Contract with IBM Corp.
  */
 // @flow
-import React, { useContext } from 'react';
+import React from 'react';
 import { DataTable, SkeletonText } from 'carbon-components-react';
 import { px } from '@carbon/layout';
 import cx from 'classnames';
 import { selectionColumnId } from '../common-column-ids';
 import { pkg, carbon } from '../../../settings';
-import { InlineEditContext } from './addons/InlineEdit/InlineEditContext/InlineEditContext';
-import { getCellIdAsObject } from './addons/InlineEdit/InlineEditContext/getCellIdAsObject';
 var blockClass = "".concat(pkg.prefix, "--datagrid");
 var TableRow = DataTable.TableRow,
   TableCell = DataTable.TableCell;
@@ -35,10 +33,6 @@ var DatagridRow = function DatagridRow(datagridState) {
   var row = datagridState.row,
     rowSize = datagridState.rowSize,
     withNestedRows = datagridState.withNestedRows;
-  var _useContext = useContext(InlineEditContext),
-    state = _useContext.state;
-  var activeCellId = state.activeCellId;
-  var activeCellObject = activeCellId && getCellIdAsObject(activeCellId);
   var getVisibleNestedRowCount = function getVisibleNestedRowCount(_ref) {
     var isExpanded = _ref.isExpanded,
       subRows = _ref.subRows;
@@ -52,7 +46,7 @@ var DatagridRow = function DatagridRow(datagridState) {
     return size;
   };
   return /*#__PURE__*/React.createElement(TableRow, _extends({
-    className: cx("".concat(blockClass, "__carbon-row"), (_cx = {}, _defineProperty(_cx, "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded), _defineProperty(_cx, "".concat(blockClass, "__carbon-row-expandable"), row.canExpand), _defineProperty(_cx, "".concat(carbon.prefix, "--data-table--selected"), row.isSelected), _defineProperty(_cx, "".concat(blockClass, "__carbon-row-hover-active"), activeCellObject && row.index === activeCellObject.row), _cx))
+    className: cx("".concat(blockClass, "__carbon-row"), (_cx = {}, _defineProperty(_cx, "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded), _defineProperty(_cx, "".concat(blockClass, "__carbon-row-expandable"), row.canExpand), _defineProperty(_cx, "".concat(carbon.prefix, "--data-table--selected"), row.isSelected), _cx))
   }, row.getRowProps(), {
     key: row.id,
     onMouseEnter: function onMouseEnter(event) {

package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js

@@ -13,6 +13,8 @@ import React, { useEffect } from 'react';
 import { VariableSizeList } from 'react-window';
 import { DataTable } from 'carbon-components-react';
 import { pkg } from '../../../settings';
+import DatagridHead from './DatagridHead';
+import { px } from '@carbon/layout';
 var blockClass = "".concat(pkg.prefix, "--datagrid");
 var TableBody = DataTable.TableBody;
 var rowSizeMap = {
@@ -29,6 +31,7 @@ var rowSizeMap = {
 };
 var defaultRowHeight = rowSizeMap.lg;
 var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
+  var _gridRef$current, _gridRef$current2;
   var getTableBodyProps = datagridState.getTableBodyProps,
     rows = datagridState.rows,
     prepareRow = datagridState.prepareRow,
@@ -42,7 +45,14 @@ var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
     DatagridPagination = datagridState.DatagridPagination,
     page = datagridState.page,
     handleResize = datagridState.handleResize,
-    withOverflowRow = datagridState.withOverflowRow;
+    gridRef = datagridState.gridRef;
+  var syncScroll = function syncScroll(e) {
+    var virtualBody = e.target;
+    document.querySelector(".".concat(blockClass, "__head-warp")).scrollLeft = virtualBody.scrollLeft;
+    var spacerColumn = document.querySelector(".".concat(blockClass, "__head-warp thead th:last-child"));
+    spacerColumn.style.width = px(32 + (virtualBody.offsetWidth - virtualBody.clientWidth)); // scrollbar width to header column to fix header alignment
+  };
+
   useEffect(function () {
     handleResize();
   }, [handleResize]);
@@ -51,8 +61,16 @@ var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
     listRef.current.resetAfterIndex(0);
   }
   var visibleRows = DatagridPagination && page || rows;
-  return /*#__PURE__*/React.createElement(TableBody, _extends({}, getTableBodyProps(), {
-    onScroll: onScroll
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(blockClass, "__head-warp"),
+    style: {
+      width: (_gridRef$current = gridRef.current) === null || _gridRef$current === void 0 ? void 0 : _gridRef$current.clientWidth,
+      overflow: 'hidden'
+    }
+  }, /*#__PURE__*/React.createElement(DatagridHead, datagridState)), /*#__PURE__*/React.createElement(TableBody, _extends({}, getTableBodyProps(), {
+    onScroll: function onScroll(e) {
+      return syncScroll(e);
+    }
   }), /*#__PURE__*/React.createElement(VariableSizeList, {
     height: virtualHeight || tableHeight,
     itemCount: visibleRows.length,
@@ -63,19 +81,20 @@ var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
     onScroll: onScroll,
     innerRef: innerListRef,
     ref: listRef,
-    className: "".concat(blockClass, "__virtual-scrollbar")
+    className: "".concat(blockClass, "__virtual-scrollbar"),
+    style: {
+      width: (_gridRef$current2 = gridRef.current) === null || _gridRef$current2 === void 0 ? void 0 : _gridRef$current2.clientWidth
+    }
   }, function (_ref) {
     var index = _ref.index,
       style = _ref.style;
     var row = visibleRows[index];
     prepareRow(row);
     return /*#__PURE__*/React.createElement("div", {
-      style: _objectSpread(_objectSpread({}, style), {}, {
-        overflow: withOverflowRow ? 'visible' : 'hidden'
-      })
+      style: _objectSpread({}, style)
     }, row.RowRenderer(_objectSpread(_objectSpread({}, datagridState), {}, {
       row: row
     })));
-  }));
+  })));
 };
 export default DatagridVirtualBody;

package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js

@@ -48,12 +48,9 @@ var FilterFlyout = function FilterFlyout(_ref) {
     onApply = _ref$onApply === void 0 ? function () {} : _ref$onApply,
     _ref$onCancel = _ref.onCancel,
     onCancel = _ref$onCancel === void 0 ? function () {} : _ref$onCancel,
-    _ref$shouldClickOutsi = _ref.shouldClickOutsideToClose,
-    shouldClickOutsideToClose = _ref$shouldClickOutsi === void 0 ? false : _ref$shouldClickOutsi,
     _ref$secondaryActionL = _ref.secondaryActionLabel,
     secondaryActionLabel = _ref$secondaryActionL === void 0 ? 'Cancel' : _ref$secondaryActionL,
-    setAllFilters = _ref.setAllFilters,
-    setFilter = _ref.setFilter;
+    setAllFilters = _ref.setAllFilters;
   /** Context state and methods */
   var _useContext = useContext(FilterContext),
     EventEmitter = _useContext.EventEmitter;
@@ -100,8 +97,11 @@ var FilterFlyout = function FilterFlyout(_ref) {
     prevFiltersObjectArrayRef.current = JSON.stringify(filtersObjectArray);
   };
   var cancel = function cancel() {
-    revertToPreviousFilters();
-    onCancel();
+    // Reverting to previous filters only applies when using batch actions
+    if (updateMethod === BATCH) {
+      revertToPreviousFilters();
+      onCancel();
+    }
     closeFlyout();
   };
   var reset = function reset() {
@@ -133,34 +133,32 @@ var FilterFlyout = function FilterFlyout(_ref) {
     if (type === DATE && !value[1]) {
       return;
     }
-    if (updateMethod === BATCH) {
-      var filtersObjectArrayCopy = _toConsumableArray(filtersObjectArray);
-      // check if the filter already exists in the array
-      var filter = filtersObjectArrayCopy.find(function (item) {
-        return item.id === column;
+    var filtersObjectArrayCopy = _toConsumableArray(filtersObjectArray);
+    // check if the filter already exists in the array
+    var filter = filtersObjectArrayCopy.find(function (item) {
+      return item.id === column;
+    });
+
+    // if filter exists in array then update the filter's new value
+    if (filter) {
+      filter.value = value;
+    } else {
+      filtersObjectArrayCopy.push({
+        id: column,
+        value: value,
+        type: type
       });
+    }
+    setFiltersObjectArray(filtersObjectArrayCopy);
 
-      // if filter exists in array then update the filter's new value
-      if (filter) {
-        filter.value = value;
-      } else {
-        filtersObjectArrayCopy.push({
-          id: column,
-          value: value,
-          type: type
-        });
-      }
-      setFiltersObjectArray(filtersObjectArrayCopy);
-    } else if (updateMethod === INSTANT) {
-      setFilter(column, value);
+    // Automatically apply the filters if the updateMethod is instant
+    if (updateMethod === INSTANT) {
+      setAllFilters(filtersObjectArrayCopy);
     }
-  }, [setFilter, updateMethod, filtersObjectArray]);
+  }, [setAllFilters, updateMethod, filtersObjectArray]);
 
   /** Effects */
   useClickOutside(filterFlyoutRef, function (target) {
-    if (shouldClickOutsideToClose === false) {
-      return;
-    }
     var hasClickedOnDatePicker = target.closest('.flatpickr-calendar');
     if (!open || hasClickedOnDatePicker) {
       return;
@@ -222,7 +220,7 @@ var FilterFlyout = function FilterFlyout(_ref) {
           key: option.labelText
         }, option, {
           onChange: function onChange(isSelected) {
-            var _components$option$on, _components$option;
+            var _option$onChange;
             var checkboxCopy = filtersState[column];
             var foundCheckbox = checkboxCopy.find(function (checkbox) {
               return checkbox.value === option.value;
@@ -234,7 +232,7 @@ var FilterFlyout = function FilterFlyout(_ref) {
               value: _toConsumableArray(filtersState[column]),
               type: type
             });
-            (_components$option$on = (_components$option = components.option).onChange) === null || _components$option$on === void 0 ? void 0 : _components$option$on.call(_components$option, isSelected);
+            (_option$onChange = option.onChange) === null || _option$onChange === void 0 ? void 0 : _option$onChange.call(option, isSelected);
           },
           checked: option.selected
         }));
@@ -260,10 +258,11 @@ var FilterFlyout = function FilterFlyout(_ref) {
       })));
     } else if (type === DROPDOWN) {
       return /*#__PURE__*/React.createElement(Dropdown, _extends({}, components.Dropdown, {
+        selectedItem: filtersState[column],
         onChange: function onChange(_ref5) {
-          var _objectSpread6, _components$Dropdown$, _components$Dropdown;
+          var _components$Dropdown$, _components$Dropdown;
           var selectedItem = _ref5.selectedItem;
-          setFiltersState(_objectSpread(_objectSpread({}, filtersState), {}, (_objectSpread6 = {}, _defineProperty(_objectSpread6, column, selectedItem), _defineProperty(_objectSpread6, "type", type), _objectSpread6)));
+          setFiltersState(_objectSpread(_objectSpread({}, filtersState), {}, _defineProperty({}, column, selectedItem)));
           applyFilters({
             column: column,
             value: selectedItem,
@@ -320,10 +319,6 @@ var FilterFlyout = function FilterFlyout(_ref) {
   }, renderFilters())), renderActionSet()));
 };
 FilterFlyout.propTypes = {
-  /**
-   * React children of carbon filters
-   */
-  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,
   /**
    * Array of filters to render
    */
@@ -364,14 +359,6 @@ FilterFlyout.propTypes = {
    * Function that sets all the filters, this comes from the datagridState
    */
   setAllFilters: PropTypes.func.isRequired,
-  /**
-   * Function that sets an individual filter, this comes from the datagridState
-   */
-  setFilter: PropTypes.func.isRequired,
-  /**
-   * Boolean if you want the flyout to close when clicked outside of the parent
-   */
-  shouldClickOutsideToClose: PropTypes.bool,
   /**
    * Title of the filter flyout
    */

package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js

@@ -1,4 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
+import _typeof from "@babel/runtime/helpers/typeof";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -22,7 +23,7 @@ import { usePreviousValue } from '../../../../../../global/js/hooks';
 import { prepareProps } from '../../../../../../global/js/utils/props-helper';
 var blockClass = "".concat(pkg.prefix, "--datagrid");
 export var InlineEditCell = function InlineEditCell(_ref) {
-  var _config$validator, _cx3;
+  var _config$validator, _cx3, _value$text;
   var cell = _ref.cell,
     config = _ref.config,
     instance = _ref.instance,
@@ -248,6 +249,11 @@ export var InlineEditCell = function InlineEditCell(_ref) {
       className: cx("".concat(blockClass, "__inline-edit--select-item"))
     }, item === null || item === void 0 ? void 0 : item.text)) : item === null || item === void 0 ? void 0 : item.text;
   };
+  var handleTransformedItem = function handleTransformedItem(items) {
+    return items !== null && items !== void 0 && items.length && _typeof(items[0]) === 'object' ? function (item) {
+      return renderDropdownItem(item);
+    } : null;
+  };
   var renderSelectCell = function renderSelectCell() {
     var _ref5 = config || {},
       inputProps = _ref5.inputProps;
@@ -263,12 +269,8 @@ export var InlineEditCell = function InlineEditCell(_ref) {
       className: cx("".concat(blockClass, "__inline-edit--select"), _defineProperty({}, "".concat(blockClass, "__inline-edit--select-").concat(rowSize), rowSize)),
       items: (inputProps === null || inputProps === void 0 ? void 0 : inputProps.items) || [],
       initialSelectedItem: cell.value,
-      itemToElement: function itemToElement(item) {
-        return renderDropdownItem(item);
-      },
-      renderSelectedItem: function renderSelectedItem(item) {
-        return renderDropdownItem(item);
-      },
+      itemToElement: handleTransformedItem(inputProps === null || inputProps === void 0 ? void 0 : inputProps.items),
+      renderSelectedItem: handleTransformedItem(inputProps === null || inputProps === void 0 ? void 0 : inputProps.items),
       onChange: function onChange(item) {
         var _inputProps$onChange;
         var newCellId = getNewCellId('Enter');
@@ -432,7 +434,7 @@ export var InlineEditCell = function InlineEditCell(_ref) {
     }, !inEditMode && /*#__PURE__*/React.createElement(InlineEditButton, {
       isActiveCell: cellId === activeCellId,
       renderIcon: setRenderIcon(),
-      label: type === 'selection' ? value.text : type === 'date' ? buildDate(value) : value,
+      label: type === 'selection' ? (_value$text = value === null || value === void 0 ? void 0 : value.text) !== null && _value$text !== void 0 ? _value$text : value : type === 'date' ? buildDate(value) : value,
       labelIcon: (value === null || value === void 0 ? void 0 : value.icon) || null,
       placeholder: placeholder,
       tabIndex: tabIndex,

package/es/components/Datagrid/Datagrid.stories/index.js

@@ -2,4 +2,4 @@ export { story as CustomizeColumnStory } from './CustomizeColumnStory';
 export { default as StickyActionsColumn } from './StickyActionsColumnStory';
 export { story as RowSizeDropdownStory } from './RowSizeDropdownStory';
 export { story as LeftPanelStory } from './LeftPanelStory';
-export { story as SelectAllWitHToggle } from './SelectAllWithToggleStory';
+export { story as SelectAllWithToggle } from './SelectAllWithToggleStory';

package/es/components/Datagrid/useFiltering.js

@@ -61,7 +61,6 @@ var useFiltering = function useFiltering(hooks) {
   hooks.useInstance.push(function (instance) {
     var filterProps = instance.filterProps,
       setAllFilters = instance.setAllFilters,
-      setFilter = instance.setFilter,
       headers = instance.headers;
     var defaultProps = {
       variation: 'flyout'
@@ -69,7 +68,6 @@ var useFiltering = function useFiltering(hooks) {
     var getFilterFlyoutProps = function getFilterFlyoutProps() {
       return _objectSpread(_objectSpread(_objectSpread({}, defaultProps), filterProps), {}, {
         setAllFilters: setAllFilters,
-        setFilter: setFilter,
         headers: headers
       });
     };

package/es/components/Datagrid/useParentDimensions.js

@@ -12,6 +12,7 @@ var useParentDimensions = function useParentDimensions(hooks) {
   var headRef = useRef();
   var innerListRef = useRef();
   var listRef = useRef();
+  var gridRef = useRef();
   var _useState = useState(),
     _useState2 = _slicedToArray(_useState, 2),
     tableHeight = _useState2[0],
@@ -47,7 +48,8 @@ var useParentDimensions = function useParentDimensions(hooks) {
       headRef: headRef,
       innerListRef: innerListRef,
       handleResize: handleResize,
-      listRef: listRef
+      listRef: listRef,
+      gridRef: gridRef
     });
   };
   hooks.useInstance.push(useInstance);

package/es/components/Datagrid/utils/getArgTypes.js

@@ -46,6 +46,10 @@ export var ARG_TYPES = {
     control: 'select',
     options: ['sm', 'lg']
   },
+  emptyStateType: {
+    control: 'select',
+    options: ['error', 'noData']
+  },
   useDenseHeader: {
     control: {
       type: 'radio'
@@ -86,5 +90,10 @@ export var ARG_TYPES = {
   customizeColumnsProps: {
     control: 'object',
     description: 'This is an object containing all of the props used with the column customization extension. _This value is set/passed inside of the `datagridState` object._'
+  },
+  filterProps: {
+    name: 'Filter props',
+    control: 'object',
+    description: 'This is an object for all the props passed into the filter flyout and filter panel'
   }
 };

package/es/components/Datagrid/utils/getInlineEditColumns.js

@@ -74,8 +74,13 @@ export var getInlineEditColumns = function getInlineEditColumns() {
     accessor: 'visits',
     width: 120,
     inlineEdit: {
+      validator: function validator(n) {
+        return n && n < 10;
+      },
       type: 'number',
-      inputProps: {} // These props are passed to the Carbon component used for inline editing
+      inputProps: {
+        invalidText: 'Invalid number, must be 10 or greater'
+      } // These props are passed to the Carbon component used for inline editing
     }
   }, {
     Header: 'Active since',

package/es/components/InlineEditV1/InlineEditV1.js

@@ -18,6 +18,7 @@ import React, { useRef, useState } from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools';
+import pconsole from '../../global/js/utils/pconsole';
 import { pkg, carbon } from '../../settings';
 
 // Carbon and package components we use.
@@ -38,7 +39,6 @@ var defaults = {
   size: 'md'
 };
 var buttons = ['cancel', 'edit', 'save'];
-console.warn('the v1 version of this component is being deprecated. please switch to the v2 component as soon as possible.');
 
 /**
  * TODO: A description of the component.
@@ -83,6 +83,7 @@ export var InlineEditV1 = /*#__PURE__*/React.forwardRef(function (_ref, refIn) {
   var showValidation = invalid; // || warn;
   var validationText = invalidText; // || warnText;
   var validationIcon = showValidation ? /*#__PURE__*/React.createElement(WarningFilled16, null) : null;
+  pconsole.warn("".concat(componentName, ": the v1 version of this component is being deprecated. please switch to the v2 component as soon as possible."));
 
   // sanitize the tooltip values
   var alignIsObject = _typeof(buttonTooltipAlignment) === 'object';

package/es/components/PageHeader/PageHeader.js

@@ -421,7 +421,7 @@ export var PageHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     kind: "ghost",
     onClick: handleCollapseToggle,
     renderIcon: ChevronUp16,
-    size: "field",
+    size: "md",
     tooltipPosition: "bottom",
     tooltipAlignment: "end",
     type: "button"

package/es/components/RemoveModal/RemoveModal.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["body", "className", "iconDescription", "inputInvalidText", "inputLabelText", "inputPlaceholderText", "label", "onClose", "onRequestSubmit", "open", "preventCloseOnClickOutside", "primaryButtonText", "resourceName", "secondaryButtonText", "textConfirmation", "title"];
+var _excluded = ["body", "className", "iconDescription", "inputInvalidText", "inputLabelText", "inputPlaceholderText", "label", "onClose", "onRequestSubmit", "open", "preventCloseOnClickOutside", "primaryButtonDisabled", "primaryButtonText", "resourceName", "secondaryButtonText", "textConfirmation", "title"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 //
@@ -33,6 +33,7 @@ export var RemoveModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onRequestSubmit = _ref.onRequestSubmit,
     open = _ref.open,
     preventCloseOnClickOutside = _ref.preventCloseOnClickOutside,
+    primaryButtonDisabled = _ref.primaryButtonDisabled,
     primaryButtonText = _ref.primaryButtonText,
     resourceName = _ref.resourceName,
     secondaryButtonText = _ref.secondaryButtonText,
@@ -50,7 +51,16 @@ export var RemoveModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var onChangeHandler = function onChangeHandler(e) {
     setUserInput(e.target.value);
   };
-  var primaryButtonDisabled = textConfirmation && userInput !== resourceName;
+  var checkPrimaryButtonDisabled = function checkPrimaryButtonDisabled() {
+    // user control should be used primarily
+    if (primaryButtonDisabled) {
+      return true;
+    } else if (textConfirmation && userInput !== resourceName) {
+      return true;
+    }
+    return false;
+  };
+  var primaryButtonStatus = checkPrimaryButtonDisabled();
   var blockClass = "".concat(pkg.prefix, "--remove-modal");
 
   // Clear the user input this way so that if the onRequestSubmit handler fails for some reason
@@ -93,7 +103,7 @@ export var RemoveModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
     type: "submit",
     kind: "danger",
     onClick: onRequestSubmit,
-    disabled: primaryButtonDisabled
+    disabled: primaryButtonStatus
   }, primaryButtonText)));
 });
 
@@ -144,6 +154,10 @@ RemoveModal.propTypes = {
    * Prevent closing on click outside of modal
    */
   preventCloseOnClickOutside: PropTypes.bool,
+  /**
+   * Specify whether the primary button should be disabled. This value will override textConfirmation
+   */
+  primaryButtonDisabled: PropTypes.bool,
   /**
    * Specify the text for the primary button
    */

package/es/global/js/package-settings.js

@@ -68,7 +68,8 @@ var defaults = {
     EditTearsheet: false,
     EditTearsheetNarrow: false,
     EditFullPage: false,
-    EditUpdateCards: false
+    EditUpdateCards: false,
+    ButtonMenu: false
     /* new component flags here - comment used by generate CLI */
   },
 

package/lib/components/ButtonMenu/ButtonMenu.js

@@ -111,5 +111,5 @@ ButtonMenu.propTypes = {
    * The size of the button for the menu trigger. The values can be any valid
    * value for the carbon Button component 'size' prop.
    */
-  size: _carbonComponentsReact.Button.propTypes.size
+  size: _propTypes.default.oneOf(['sm', 'md', 'lg'])
 };

package/lib/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js

@@ -31,7 +31,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 var blockClass = "".concat(_settings.pkg.prefix, "--button-set-with-overflow");
 var componentName = 'ButtonSetWithOverflow';
-var buttonSize = 'field';
+var buttonSize = 'md';
 var ButtonSetWithOverflow = function ButtonSetWithOverflow(_ref) {
   var buttons = _ref.buttons,
     className = _ref.className,

package/lib/components/Card/Card.js

@@ -78,7 +78,7 @@ var Card = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     titleSize = _ref$titleSize === void 0 ? defaults.titleSize : _ref$titleSize,
     rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var blockClass = "".concat(_settings.pkg.prefix, "--card");
-  var hasActions = actionIcons.length > 0 || overflowActions.length > 0 || primaryButtonText && primaryButtonPlacement === 'top';
+  var hasActions = actionIcons.length > 0 || overflowActions.length > 0 || !!primaryButtonText && primaryButtonPlacement === 'top';
   var hasFooterActions = hasActions && actionsPlacement === 'bottom';
   var hasFooterButton = !!secondaryButtonText || !!primaryButtonText && primaryButtonPlacement === 'bottom';
   var hasBottomBar = hasFooterActions || hasFooterButton;

package/lib/components/DataSpreadsheet/DataSpreadsheet.js

@@ -186,9 +186,7 @@ var DataSpreadsheet = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref
   // Removes the active cell element
   var removeActiveCell = (0, _react.useCallback)(function () {
     var activeCellHighlight = spreadsheetRef.current.querySelector(".".concat(blockClass, "__active-cell--highlight"));
-    if (activeCellHighlight) {
-      activeCellHighlight.style.display = 'none';
-    }
+    activeCellHighlight.style.display = 'none';
   }, [spreadsheetRef]);
   var removeCellEditor = (0, _react.useCallback)(function () {
     setCellEditorValue('');

package/lib/components/DataSpreadsheet/utils/handleCellDeletion.js

@@ -14,6 +14,7 @@ var _rangeWithCallback = require("../../../global/js/utils/rangeWithCallback");
  */
 
 var handleCellDeletion = function handleCellDeletion(_ref) {
+  var _selectionAreaToEmpty, _selectionAreaToEmpty2, _selectionAreaToEmpty3, _selectionAreaToEmpty4, _selectionAreaToEmpty5, _selectionAreaToEmpty6, _selectionAreaToEmpty7, _selectionAreaToEmpty8;
   var activeCellCoordinates = _ref.activeCellCoordinates,
     selectionAreas = _ref.selectionAreas,
     currentMatcher = _ref.currentMatcher,
@@ -31,10 +32,10 @@ var handleCellDeletion = function handleCellDeletion(_ref) {
     return item.matcher === currentMatcher;
   });
   var selectionAreaToEmptyContents = selectionAreaClone[indexOfCurrentSelectionArea];
-  var lowestColumnIndex = Math.min(selectionAreaToEmptyContents.point1.column, selectionAreaToEmptyContents.point2.column);
-  var greatestColumnIndex = Math.max(selectionAreaToEmptyContents.point1.column, selectionAreaToEmptyContents.point2.column);
-  var lowestRowIndex = Math.min(selectionAreaToEmptyContents.point1.row, selectionAreaToEmptyContents.point2.row);
-  var greatestRowIndex = Math.max(selectionAreaToEmptyContents.point1.row, selectionAreaToEmptyContents.point2.row);
+  var lowestColumnIndex = Math.min(selectionAreaToEmptyContents === null || selectionAreaToEmptyContents === void 0 ? void 0 : (_selectionAreaToEmpty = selectionAreaToEmptyContents.point1) === null || _selectionAreaToEmpty === void 0 ? void 0 : _selectionAreaToEmpty.column, selectionAreaToEmptyContents === null || selectionAreaToEmptyContents === void 0 ? void 0 : (_selectionAreaToEmpty2 = selectionAreaToEmptyContents.point2) === null || _selectionAreaToEmpty2 === void 0 ? void 0 : _selectionAreaToEmpty2.column);
+  var greatestColumnIndex = Math.max(selectionAreaToEmptyContents === null || selectionAreaToEmptyContents === void 0 ? void 0 : (_selectionAreaToEmpty3 = selectionAreaToEmptyContents.point1) === null || _selectionAreaToEmpty3 === void 0 ? void 0 : _selectionAreaToEmpty3.column, selectionAreaToEmptyContents === null || selectionAreaToEmptyContents === void 0 ? void 0 : (_selectionAreaToEmpty4 = selectionAreaToEmptyContents.point2) === null || _selectionAreaToEmpty4 === void 0 ? void 0 : _selectionAreaToEmpty4.column);
+  var lowestRowIndex = Math.min(selectionAreaToEmptyContents === null || selectionAreaToEmptyContents === void 0 ? void 0 : (_selectionAreaToEmpty5 = selectionAreaToEmptyContents.point1) === null || _selectionAreaToEmpty5 === void 0 ? void 0 : _selectionAreaToEmpty5.row, selectionAreaToEmptyContents === null || selectionAreaToEmptyContents === void 0 ? void 0 : (_selectionAreaToEmpty6 = selectionAreaToEmptyContents.point2) === null || _selectionAreaToEmpty6 === void 0 ? void 0 : _selectionAreaToEmpty6.row);
+  var greatestRowIndex = Math.max(selectionAreaToEmptyContents === null || selectionAreaToEmptyContents === void 0 ? void 0 : (_selectionAreaToEmpty7 = selectionAreaToEmptyContents.point1) === null || _selectionAreaToEmpty7 === void 0 ? void 0 : _selectionAreaToEmpty7.row, selectionAreaToEmptyContents === null || selectionAreaToEmptyContents === void 0 ? void 0 : (_selectionAreaToEmpty8 = selectionAreaToEmptyContents.point2) === null || _selectionAreaToEmpty8 === void 0 ? void 0 : _selectionAreaToEmpty8.row);
   (0, _rangeWithCallback.rangeWithCallback)(lowestColumnIndex, greatestColumnIndex, function (columnIndex) {
     (0, _rangeWithCallback.rangeWithCallback)(lowestRowIndex, greatestRowIndex, function (rowIndex) {
       var cellProps = rows[rowIndex].cells[columnIndex];