carbon-addons-iot-react 2.147.0-next.78 → 2.147.0-next.82

package/CHANGELOG.md

@@ -3,6 +3,40 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.147.0-next.82](https://github.com/carbon-design-system/carbon-addons-iot-react/compare/v2.147.0-next.81...v2.147.0-next.82) (2021-12-14)
+
+
+### Bug Fixes
+
+* **header:** add isSideNavExpanded prop to fix aria-label for button ([156c301](https://github.com/carbon-design-system/carbon-addons-iot-react/commit/156c3016c5639c61097f85780c047a2f9e32f6de))
+
+
+
+
+
+# [2.147.0-next.81](https://github.com/carbon-design-system/carbon-addons-iot-react/compare/v2.147.0-next.80...v2.147.0-next.81) (2021-12-13)
+
+
+### Bug Fixes
+
+* **table:** pass size to overflow menu in row actions ([9535a7c](https://github.com/carbon-design-system/carbon-addons-iot-react/commit/9535a7c2518f4536d755f10e4da9d5700b9346f3))
+* **table-view-dropdown:** fix [Object object] showing in title ([73a5efb](https://github.com/carbon-design-system/carbon-addons-iot-react/commit/73a5efb02cb7cd6b85e9e671bf51f6ba228b5303))
+
+
+
+
+
+# [2.147.0-next.79](https://github.com/carbon-design-system/carbon-addons-iot-react/compare/v2.147.0-next.78...v2.147.0-next.79) (2021-12-08)
+
+
+### Features
+
+* **table:** add search onBlur when hasFastSearch:false ([2db93b2](https://github.com/carbon-design-system/carbon-addons-iot-react/commit/2db93b21b6ac8455a0cbac8a2f26ccdfcd94cc7c))
+
+
+
+
+
 # [2.147.0-next.78](https://github.com/carbon-design-system/carbon-addons-iot-react/compare/v2.147.0-next.77...v2.147.0-next.78) (2021-12-08)
 
 

package/es/components/Header/Header.js

@@ -68,7 +68,10 @@ var propTypes = {
   testId: PropTypes.string,
 
   /** Returns true, if the icon should be shown. (actionItem) => {} */
-  isActionItemVisible: PropTypes.func
+  isActionItemVisible: PropTypes.func,
+
+  /** allows setting aria-label on side-nav menu button correctly */
+  isSideNavExpanded: PropTypes.bool
 };
 var defaultProps = {
   onClickSideNavExpand: null,
@@ -88,7 +91,8 @@ var defaultProps = {
   testId: 'header',
   isActionItemVisible: function isActionItemVisible() {
     return true;
-  }
+  },
+  isSideNavExpanded: false
 };
 /**
  * UI header with multiple side panels functionality and dropdowns
@@ -109,7 +113,8 @@ var Header = function Header(_ref) {
       appSwitcherLabel = _ref.appSwitcherLabel,
       i18n = _ref.i18n,
       testId = _ref.testId,
-      isActionItemVisible = _ref.isActionItemVisible;
+      isActionItemVisible = _ref.isActionItemVisible,
+      isSideNavExpanded = _ref.isSideNavExpanded;
 
   var mergedI18n = _objectSpread(_objectSpread({}, defaultProps.i18n), i18n);
 
@@ -138,7 +143,7 @@ var Header = function Header(_ref) {
     href: skipto
   }), hasSideNav && /*#__PURE__*/React__default.createElement(HeaderMenuButton, {
     "data-testid": "".concat(testId, "-menu-button"),
-    "aria-label": mergedI18n.openMenu,
+    "aria-label": isSideNavExpanded ? mergedI18n.closeMenu : mergedI18n.openMenu,
     onClick: onClickSideNavExpand
   }), /*#__PURE__*/React__default.createElement(HeaderName, {
     "data-testid": "".concat(testId, "-name"),
@@ -316,6 +321,17 @@ Header.__docgenInfo = {
       "required": false,
       "description": "Returns true, if the icon should be shown. (actionItem) => {}"
     },
+    "isSideNavExpanded": {
+      "defaultValue": {
+        "value": "false",
+        "computed": false
+      },
+      "type": {
+        "name": "bool"
+      },
+      "required": false,
+      "description": "allows setting aria-label on side-nav menu button correctly"
+    },
     "appName": {
       "type": {
         "name": "string"

package/es/components/Table/Table.js

@@ -626,7 +626,8 @@ var Table = function Table(props) {
       tooltip = _merge2.tooltip,
       error = _merge2.error,
       testId = _merge2.testId,
-      others = _objectWithoutProperties(_merge2, ["id", "columns", "columnGroups", "data", "expandedData", "locale", "view", "actions", "actions", "options", "lightweight", "className", "style", "i18n", "secondaryTitle", "tooltip", "error", "testId"]); // There is no way to access the current search value in the Table
+      size = _merge2.size,
+      others = _objectWithoutProperties(_merge2, ["id", "columns", "columnGroups", "data", "expandedData", "locale", "view", "actions", "actions", "options", "lightweight", "className", "style", "i18n", "secondaryTitle", "tooltip", "error", "testId", "size"]); // There is no way to access the current search value in the Table
   // so we need to track that for the save view functionality.
 
 
@@ -901,8 +902,11 @@ var Table = function Table(props) {
     id: id // TODO: remove id in v3
     ,
     "data-testid": id || testId,
-    className: classnames((_classnames2 = {}, _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--column-groups"), columnGroups.length), _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--column-groups--min-size-large"), columnGroups.length && minHeaderSizeIsLarge), _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--resize"), options.hasResize), _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--fixed"), options.hasResize && !options.useAutoTableLayoutForResize), _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--row-actions"), options.hasRowActions), _classnames2))
-  }, others), columns.length ? /*#__PURE__*/React__default.createElement(TableHead, _extends({}, others, {
+    className: classnames((_classnames2 = {}, _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--column-groups"), columnGroups.length), _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--column-groups--min-size-large"), columnGroups.length && minHeaderSizeIsLarge), _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--resize"), options.hasResize), _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--fixed"), options.hasResize && !options.useAutoTableLayoutForResize), _defineProperty(_classnames2, "".concat(iotPrefix, "--data-table--row-actions"), options.hasRowActions), _classnames2)),
+    size: size
+  }, others), columns.length ? /*#__PURE__*/React__default.createElement(TableHead, _extends({
+    size: size
+  }, others, {
     i18n: i18n,
     lightweight: lightweight,
     options: _objectSpread(_objectSpread({}, pick(options, 'hasAggregations', 'hasColumnSelectionConfig', 'hasResize', 'hasRowActions', 'hasRowNesting', 'hasSingleRowEdit', 'hasRowSelection', 'useAutoTableLayoutForResize', 'hasMultiSort', 'preserveColumnWidths')), {}, {
@@ -978,7 +982,8 @@ var Table = function Table(props) {
     actions: pick(actions.table, 'onRowSelected', 'onApplyRowAction', 'onClearRowError', 'onRowExpanded', 'onRowClicked', 'onRowLoadMore') // TODO: remove 'id' in v3.
     ,
     testId: "".concat(id || testId, "-table-body"),
-    showExpanderColumn: showExpanderColumn
+    showExpanderColumn: showExpanderColumn,
+    size: size
   })) : /*#__PURE__*/React__default.createElement(EmptyTable, {
     id: id,
     totalColumns: totalColumns,

package/es/components/Table/TableBody/RowActionsCell/RowActionsCell.js

@@ -13,6 +13,7 @@ import 'core-js/modules/es.array.concat.js';
 import 'core-js/modules/es.array.filter.js';
 import 'core-js/modules/es.array.find-index.js';
 import 'core-js/modules/es.array.map.js';
+import 'core-js/modules/es.array.includes.js';
 import React__default, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { DataTable, Loading, OverflowMenuItem } from 'carbon-components-react';
@@ -80,7 +81,12 @@ var propTypes = {
   /**
    * Direction of document. Passed in at Table
    */
-  langDir: PropTypes.oneOf(['ltr', 'rtl'])
+  langDir: PropTypes.oneOf(['ltr', 'rtl']),
+
+  /**
+   * the size passed to the table to set row height
+   */
+  size: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl'])
 };
 var defaultProps = {
   actions: null,
@@ -93,7 +99,8 @@ var defaultProps = {
   isDelete: false,
   showSingleRowEditButtons: false,
   singleRowEditButtons: null,
-  langDir: 'ltr'
+  langDir: 'ltr',
+  size: undefined
 };
 
 var RowActionsCell = /*#__PURE__*/function (_React$Component) {
@@ -167,7 +174,8 @@ var RowActionsCell = /*#__PURE__*/function (_React$Component) {
           inProgressText = _this$props.inProgressText,
           showSingleRowEditButtons = _this$props.showSingleRowEditButtons,
           singleRowEditButtons = _this$props.singleRowEditButtons,
-          langDir = _this$props.langDir;
+          langDir = _this$props.langDir,
+          size = _this$props.size;
       var isOpen = this.state.isOpen;
       var overflowActions = actions ? actions.filter(function (action) {
         return action.isOverflow;
@@ -230,7 +238,9 @@ var RowActionsCell = /*#__PURE__*/function (_React$Component) {
         },
         iconDescription: overflowMenuAria,
         onOpen: this.handleOpen,
-        onClose: this.handleClose,
+        onClose: this.handleClose // compact or xs rows need the `sm` overflow menu, everything else is default (md)
+        ,
+        size: ['compact', 'xs'].includes(size) ? 'sm' : undefined,
         className: "".concat(iotPrefix, "--row-actions-cell--overflow-menu"),
         selectorPrimaryFocus: ".".concat(iotPrefix, "--action-overflow-item--initialFocus"),
         useAutoPositioning: true
@@ -425,6 +435,33 @@ RowActionsCell.__docgenInfo = {
       "required": false,
       "description": "Direction of document. Passed in at Table"
     },
+    "size": {
+      "defaultValue": {
+        "value": "undefined",
+        "computed": true
+      },
+      "type": {
+        "name": "enum",
+        "value": [{
+          "value": "'xs'",
+          "computed": false
+        }, {
+          "value": "'sm'",
+          "computed": false
+        }, {
+          "value": "'md'",
+          "computed": false
+        }, {
+          "value": "'lg'",
+          "computed": false
+        }, {
+          "value": "'xl'",
+          "computed": false
+        }]
+      },
+      "required": false,
+      "description": "the size passed to the table to set row height"
+    },
     "id": {
       "type": {
         "name": "string"

package/es/components/Table/TableBody/TableBody.js

@@ -119,7 +119,12 @@ var propTypes = {
   loadingMoreIds: PropTypes.arrayOf(PropTypes.string),
 
   /** use white-space: pre; css when true */
-  preserveCellWhiteSpace: PropTypes.bool
+  preserveCellWhiteSpace: PropTypes.bool,
+
+  /**
+   * the size passed to the table to set row height
+   */
+  size: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl'])
 };
 var defaultProps = {
   expandedIds: [],
@@ -151,7 +156,8 @@ var defaultProps = {
   learnMoreText: 'Learn more',
   inProgressText: 'In progress',
   dismissText: 'Dismiss',
-  actionFailedText: 'Action failed'
+  actionFailedText: 'Action failed',
+  size: undefined
 };
 
 var TableBody = function TableBody(_ref) {
@@ -190,7 +196,8 @@ var TableBody = function TableBody(_ref) {
       testID = _ref.testID,
       testId = _ref.testId,
       showExpanderColumn = _ref.showExpanderColumn,
-      preserveCellWhiteSpace = _ref.preserveCellWhiteSpace;
+      preserveCellWhiteSpace = _ref.preserveCellWhiteSpace,
+      size = _ref.size;
   // Need to merge the ordering and the columns since the columns have the renderer function
   var orderingMap = useMemo(function () {
     return ordering.map(function (col) {
@@ -354,7 +361,8 @@ var TableBody = function TableBody(_ref) {
       }),
       rowActions: row.rowActions,
       values: row.values,
-      showExpanderColumn: showExpanderColumn
+      showExpanderColumn: showExpanderColumn,
+      size: size
     }) : /*#__PURE__*/React__default.createElement(TableBodyLoadMoreRow, {
       id: row.id,
       key: "".concat(row.id, "--load-more"),
@@ -767,6 +775,33 @@ TableBody.__docgenInfo = {
       "required": false,
       "description": "I18N label for action failed"
     },
+    "size": {
+      "defaultValue": {
+        "value": "undefined",
+        "computed": true
+      },
+      "type": {
+        "name": "enum",
+        "value": [{
+          "value": "'xs'",
+          "computed": false
+        }, {
+          "value": "'sm'",
+          "computed": false
+        }, {
+          "value": "'md'",
+          "computed": false
+        }, {
+          "value": "'lg'",
+          "computed": false
+        }, {
+          "value": "'xl'",
+          "computed": false
+        }]
+      },
+      "required": false,
+      "description": "the size passed to the table to set row height"
+    },
     "tableId": {
       "type": {
         "name": "string"

package/es/components/Table/TableBody/TableBodyRow/TableBodyRow.js

@@ -146,7 +146,12 @@ var propTypes = {
   langDir: PropTypes.oneOf(['ltr', 'rtl']),
 
   /** shows an additional column that can expand/shrink as the table is resized  */
-  showExpanderColumn: PropTypes.bool
+  showExpanderColumn: PropTypes.bool,
+
+  /**
+   * the size passed to the table to set row height
+   */
+  size: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl'])
 };
 var defaultProps = {
   isSelected: false,
@@ -173,7 +178,8 @@ var defaultProps = {
   showExpanderColumn: false,
   langDir: 'ltr',
   locale: 'en',
-  isSelectable: undefined
+  isSelectable: undefined,
+  size: undefined
 };
 var StyledTableRow = styled(function (_ref) {
   _ref.isSelectable;
@@ -298,7 +304,8 @@ var TableBodyRow = function TableBodyRow(_ref6) {
       rowEditMode = _ref6.rowEditMode,
       singleRowEditMode = _ref6.singleRowEditMode,
       singleRowEditButtons = _ref6.singleRowEditButtons,
-      showExpanderColumn = _ref6.showExpanderColumn;
+      showExpanderColumn = _ref6.showExpanderColumn,
+      size = _ref6.size;
   var isEditMode = rowEditMode || singleRowEditMode;
   var singleSelectionIndicatorWidth = hasRowSelection === 'single' ? 0 : 5; // if this a single hierarchy (i.e. only 1 level of nested children), do NOT show the gray offset
 
@@ -390,7 +397,8 @@ var TableBodyRow = function TableBodyRow(_ref6) {
     rowActionsError: rowActionsError,
     onClearError: onClearRowError ? function () {
       return onClearRowError(id);
-    } : null
+    } : null,
+    size: size
   }) : nestingLevel > 0 && hasRowActions ? /*#__PURE__*/React__default.createElement(TableCell, {
     key: "".concat(tableId, "-").concat(id, "-row-actions-cell")
   }) : undefined);
@@ -837,6 +845,33 @@ TableBodyRow.__docgenInfo = {
       "required": false,
       "description": ""
     },
+    "size": {
+      "defaultValue": {
+        "value": "undefined",
+        "computed": true
+      },
+      "type": {
+        "name": "enum",
+        "value": [{
+          "value": "'xs'",
+          "computed": false
+        }, {
+          "value": "'sm'",
+          "computed": false
+        }, {
+          "value": "'md'",
+          "computed": false
+        }, {
+          "value": "'lg'",
+          "computed": false
+        }, {
+          "value": "'xl'",
+          "computed": false
+        }]
+      },
+      "required": false,
+      "description": "the size passed to the table to set row height"
+    },
     "ordering": {
       "type": {
         "name": "arrayOf",

package/es/components/Table/TableToolbar/TableToolbar.js

@@ -355,11 +355,15 @@ var TableToolbar = function TableToolbar(_ref) {
     }),
     onClear: function onClear() {
       return onApplySearch('');
-    } // This can't be used yet b/c it prevents the search box from automatically
-    // closing on blur.
-    // https://github.com/carbon-design-system/carbon/issues/10077
-    // onBlur={!hasFastSearch ? (e) => onApplySearch(e.target.value) : undefined}
-    ,
+    },
+    onBlur: !hasFastSearch ? function (e, handleExpand) {
+      var value = e.target.value;
+      onApplySearch(value);
+
+      if (!value) {
+        handleExpand(e, false);
+      }
+    } : undefined,
     disabled: isDisabled // TODO: remove deprecated 'testID' in v3
     ,
     "data-testid": "".concat(testID || testId, "-search")

package/es/components/Table/TableViewDropdown/TableViewDropdown.js

@@ -1,20 +1,22 @@
 import _extends from '@babel/runtime/helpers/extends';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import 'core-js/modules/es.array.concat.js';
 import 'core-js/modules/es.array.find.js';
-import React__default, { useMemo } from 'react';
+import React__default, { useMemo, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { Dropdown } from 'carbon-components-react';
 import { Settings16 } from '@carbon/icons-react';
 import withSize from 'react-sizeme';
 import { settings } from '../../../constants/Settings.js';
 import { OverridePropTypes } from '../../../constants/SharedPropTypes.js';
+import { useDropdownTitleFixer } from '../../IconDropdown/dropdownHooks.js';
 import TableViewItemPropType from './TableViewItemPropTypes.js';
 import TableViewDropdownItem from './TableViewDropdownItem.js';
 
 var iotPrefix = settings.iotPrefix;
 var propTypes = {
-  /** Set to true if the user has modfied filters etc since the view was loaded */
+  /** Set to true if the user has modified filters etc since the view was loaded */
   selectedViewEdited: PropTypes.bool,
 
   /** The id of the view that is currently selected */
@@ -47,7 +49,7 @@ var propTypes = {
     onChangeView: PropTypes.func
   }).isRequired,
 
-  /** Used to overide the internal components and props of the TableViewDropdown */
+  /** Used to override the internal components and props of the TableViewDropdown */
   overrides: PropTypes.shape({
     dropdown: OverridePropTypes,
     dropdownItem: OverridePropTypes
@@ -112,7 +114,7 @@ var TableViewDropdown = function TableViewDropdown(_ref) {
       customAction: onManageViews,
       icon: Settings16
     }; // Save changes button show only appear if the view has been edited and the current view is not 'View all'
-    // 'View all' is equivalent to a "default view", which would not be able to get resaved. The user should supply
+    // 'View all' is equivalent to a "default view", which would not be able to get re-saved. The user should supply
     // their own default views that can be changed if they would like that functionality
 
     var dialogItems = selectedViewEdited && selectedViewId && selectedViewId !== 'view-all' ? [saveAsNewItem, saveItem, manageViewsItem] : [saveAsNewItem, manageViewsItem]; // move the action / dialog items to the top so that they are always easily accessible in the case that there are
@@ -126,6 +128,17 @@ var TableViewDropdown = function TableViewDropdown(_ref) {
   var MyDropDown = (overrides === null || overrides === void 0 ? void 0 : (_overrides$dropdown = overrides.dropdown) === null || _overrides$dropdown === void 0 ? void 0 : _overrides$dropdown.component) || Dropdown;
   var MyTableViewDropDownItem = (overrides === null || overrides === void 0 ? void 0 : (_overrides$dropdownIt = overrides.dropdownItem) === null || _overrides$dropdownIt === void 0 ? void 0 : _overrides$dropdownIt.component) || TableViewDropdownItem;
 
+  var _useDropdownTitleFixe = useDropdownTitleFixer(),
+      _useDropdownTitleFixe2 = _slicedToArray(_useDropdownTitleFixe, 2),
+      dropdownRef = _useDropdownTitleFixe2[0],
+      updateTitle = _useDropdownTitleFixe2[1];
+
+  useEffect(function () {
+    if (mySelectedItem !== null && mySelectedItem !== void 0 && mySelectedItem.text && dropdownRef !== null && dropdownRef !== void 0 && dropdownRef.current) {
+      updateTitle(selectedViewEdited ? "".concat(mySelectedItem.text, " - ").concat(i18n.edited) : mySelectedItem.text);
+    }
+  }, [dropdownRef, i18n.edited, mySelectedItem, selectedViewEdited, updateTitle]);
+
   var onSelectionChange = function onSelectionChange(change) {
     var item = change.selectedItem;
 
@@ -146,6 +159,7 @@ var TableViewDropdown = function TableViewDropdown(_ref) {
       className: "".concat(iotPrefix, "--view-dropdown__container"),
       style: style
     }, /*#__PURE__*/React__default.createElement(MyDropDown, _extends({
+      ref: dropdownRef,
       label: i18n.tableViewMenu,
       "data-testid": testID,
       selectedItem: mySelectedItem,
@@ -261,7 +275,7 @@ TableViewDropdown.__docgenInfo = {
         "name": "bool"
       },
       "required": false,
-      "description": "Set to true if the user has modfied filters etc since the view was loaded"
+      "description": "Set to true if the user has modified filters etc since the view was loaded"
     },
     "disabled": {
       "defaultValue": {
@@ -295,7 +309,7 @@ TableViewDropdown.__docgenInfo = {
         }
       },
       "required": false,
-      "description": "Used to overide the internal components and props of the TableViewDropdown"
+      "description": "Used to override the internal components and props of the TableViewDropdown"
     },
     "style": {
       "defaultValue": {

package/lib/components/Header/Header.js

@@ -77,7 +77,10 @@ var propTypes = {
   testId: PropTypes__default['default'].string,
 
   /** Returns true, if the icon should be shown. (actionItem) => {} */
-  isActionItemVisible: PropTypes__default['default'].func
+  isActionItemVisible: PropTypes__default['default'].func,
+
+  /** allows setting aria-label on side-nav menu button correctly */
+  isSideNavExpanded: PropTypes__default['default'].bool
 };
 var defaultProps = {
   onClickSideNavExpand: null,
@@ -97,7 +100,8 @@ var defaultProps = {
   testId: 'header',
   isActionItemVisible: function isActionItemVisible() {
     return true;
-  }
+  },
+  isSideNavExpanded: false
 };
 /**
  * UI header with multiple side panels functionality and dropdowns
@@ -118,7 +122,8 @@ var Header = function Header(_ref) {
       appSwitcherLabel = _ref.appSwitcherLabel,
       i18n = _ref.i18n,
       testId = _ref.testId,
-      isActionItemVisible = _ref.isActionItemVisible;
+      isActionItemVisible = _ref.isActionItemVisible,
+      isSideNavExpanded = _ref.isSideNavExpanded;
 
   var mergedI18n = _objectSpread(_objectSpread({}, defaultProps.i18n), i18n);
 
@@ -147,7 +152,7 @@ var Header = function Header(_ref) {
     href: skipto
   }), hasSideNav && /*#__PURE__*/React__default['default'].createElement(HeaderMenuButton, {
     "data-testid": "".concat(testId, "-menu-button"),
-    "aria-label": mergedI18n.openMenu,
+    "aria-label": isSideNavExpanded ? mergedI18n.closeMenu : mergedI18n.openMenu,
     onClick: onClickSideNavExpand
   }), /*#__PURE__*/React__default['default'].createElement(HeaderName, {
     "data-testid": "".concat(testId, "-name"),
@@ -325,6 +330,17 @@ Header.__docgenInfo = {
       "required": false,
       "description": "Returns true, if the icon should be shown. (actionItem) => {}"
     },
+    "isSideNavExpanded": {
+      "defaultValue": {
+        "value": "false",
+        "computed": false
+      },
+      "type": {
+        "name": "bool"
+      },
+      "required": false,
+      "description": "allows setting aria-label on side-nav menu button correctly"
+    },
     "appName": {
       "type": {
         "name": "string"

package/lib/components/Table/Table.js

@@ -643,7 +643,8 @@ var Table = function Table(props) {
       tooltip = _merge2.tooltip,
       error = _merge2.error,
       testId = _merge2.testId,
-      others = _objectWithoutProperties__default['default'](_merge2, ["id", "columns", "columnGroups", "data", "expandedData", "locale", "view", "actions", "actions", "options", "lightweight", "className", "style", "i18n", "secondaryTitle", "tooltip", "error", "testId"]); // There is no way to access the current search value in the Table
+      size = _merge2.size,
+      others = _objectWithoutProperties__default['default'](_merge2, ["id", "columns", "columnGroups", "data", "expandedData", "locale", "view", "actions", "actions", "options", "lightweight", "className", "style", "i18n", "secondaryTitle", "tooltip", "error", "testId", "size"]); // There is no way to access the current search value in the Table
   // so we need to track that for the save view functionality.
 
 
@@ -918,8 +919,11 @@ var Table = function Table(props) {
     id: id // TODO: remove id in v3
     ,
     "data-testid": id || testId,
-    className: classnames__default['default']((_classnames2 = {}, _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--column-groups"), columnGroups.length), _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--column-groups--min-size-large"), columnGroups.length && minHeaderSizeIsLarge), _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--resize"), options.hasResize), _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--fixed"), options.hasResize && !options.useAutoTableLayoutForResize), _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--row-actions"), options.hasRowActions), _classnames2))
-  }, others), columns.length ? /*#__PURE__*/React__default['default'].createElement(TableHead, _extends__default['default']({}, others, {
+    className: classnames__default['default']((_classnames2 = {}, _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--column-groups"), columnGroups.length), _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--column-groups--min-size-large"), columnGroups.length && minHeaderSizeIsLarge), _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--resize"), options.hasResize), _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--fixed"), options.hasResize && !options.useAutoTableLayoutForResize), _defineProperty__default['default'](_classnames2, "".concat(iotPrefix, "--data-table--row-actions"), options.hasRowActions), _classnames2)),
+    size: size
+  }, others), columns.length ? /*#__PURE__*/React__default['default'].createElement(TableHead, _extends__default['default']({
+    size: size
+  }, others, {
     i18n: i18n,
     lightweight: lightweight,
     options: _objectSpread(_objectSpread({}, pick(options, 'hasAggregations', 'hasColumnSelectionConfig', 'hasResize', 'hasRowActions', 'hasRowNesting', 'hasSingleRowEdit', 'hasRowSelection', 'useAutoTableLayoutForResize', 'hasMultiSort', 'preserveColumnWidths')), {}, {
@@ -995,7 +999,8 @@ var Table = function Table(props) {
     actions: pick(actions.table, 'onRowSelected', 'onApplyRowAction', 'onClearRowError', 'onRowExpanded', 'onRowClicked', 'onRowLoadMore') // TODO: remove 'id' in v3.
     ,
     testId: "".concat(id || testId, "-table-body"),
-    showExpanderColumn: showExpanderColumn
+    showExpanderColumn: showExpanderColumn,
+    size: size
   })) : /*#__PURE__*/React__default['default'].createElement(EmptyTable, {
     id: id,
     totalColumns: totalColumns,

package/lib/components/Table/TableBody/RowActionsCell/RowActionsCell.js

@@ -15,6 +15,7 @@ require('core-js/modules/es.array.concat.js');
 require('core-js/modules/es.array.filter.js');
 require('core-js/modules/es.array.find-index.js');
 require('core-js/modules/es.array.map.js');
+require('core-js/modules/es.array.includes.js');
 var React = require('react');
 var PropTypes = require('prop-types');
 var carbonComponentsReact = require('carbon-components-react');
@@ -97,7 +98,12 @@ var propTypes = {
   /**
    * Direction of document. Passed in at Table
    */
-  langDir: PropTypes__default['default'].oneOf(['ltr', 'rtl'])
+  langDir: PropTypes__default['default'].oneOf(['ltr', 'rtl']),
+
+  /**
+   * the size passed to the table to set row height
+   */
+  size: PropTypes__default['default'].oneOf(['xs', 'sm', 'md', 'lg', 'xl'])
 };
 var defaultProps = {
   actions: null,
@@ -110,7 +116,8 @@ var defaultProps = {
   isDelete: false,
   showSingleRowEditButtons: false,
   singleRowEditButtons: null,
-  langDir: 'ltr'
+  langDir: 'ltr',
+  size: undefined
 };
 
 var RowActionsCell = /*#__PURE__*/function (_React$Component) {
@@ -184,7 +191,8 @@ var RowActionsCell = /*#__PURE__*/function (_React$Component) {
           inProgressText = _this$props.inProgressText,
           showSingleRowEditButtons = _this$props.showSingleRowEditButtons,
           singleRowEditButtons = _this$props.singleRowEditButtons,
-          langDir = _this$props.langDir;
+          langDir = _this$props.langDir,
+          size = _this$props.size;
       var isOpen = this.state.isOpen;
       var overflowActions = actions ? actions.filter(function (action) {
         return action.isOverflow;
@@ -247,7 +255,9 @@ var RowActionsCell = /*#__PURE__*/function (_React$Component) {
         },
         iconDescription: overflowMenuAria,
         onOpen: this.handleOpen,
-        onClose: this.handleClose,
+        onClose: this.handleClose // compact or xs rows need the `sm` overflow menu, everything else is default (md)
+        ,
+        size: ['compact', 'xs'].includes(size) ? 'sm' : undefined,
         className: "".concat(iotPrefix, "--row-actions-cell--overflow-menu"),
         selectorPrimaryFocus: ".".concat(iotPrefix, "--action-overflow-item--initialFocus"),
         useAutoPositioning: true
@@ -442,6 +452,33 @@ RowActionsCell.__docgenInfo = {
       "required": false,
       "description": "Direction of document. Passed in at Table"
     },
+    "size": {
+      "defaultValue": {
+        "value": "undefined",
+        "computed": true
+      },
+      "type": {
+        "name": "enum",
+        "value": [{
+          "value": "'xs'",
+          "computed": false
+        }, {
+          "value": "'sm'",
+          "computed": false
+        }, {
+          "value": "'md'",
+          "computed": false
+        }, {
+          "value": "'lg'",
+          "computed": false
+        }, {
+          "value": "'xl'",
+          "computed": false
+        }]
+      },
+      "required": false,
+      "description": "the size passed to the table to set row height"
+    },
     "id": {
       "type": {
         "name": "string"