@splunk/react-ui 4.1.0 → 4.4.1

package/Table.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 102);
+/******/ 	return __webpack_require__(__webpack_require__.s = 104);
 /******/ })
 /************************************************************************/
 /******/ ([
@@ -319,35 +319,37 @@ module.exports = require("react-event-listener");
 /* 16 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Dropdown");
+module.exports = require("@splunk/react-ui/Button");
 
 /***/ }),
 /* 17 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Button");
+module.exports = require("@splunk/react-ui/Popover");
 
 /***/ }),
-/* 18 */
+/* 18 */,
+/* 19 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Popover");
+module.exports = require("@splunk/react-ui/Dropdown");
 
 /***/ }),
-/* 19 */,
 /* 20 */,
 /* 21 */,
 /* 22 */,
 /* 23 */,
 /* 24 */,
-/* 25 */
+/* 25 */,
+/* 26 */,
+/* 27 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return ChevronRight; });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(28);
+/* harmony import */ var _splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(31);
 /* harmony import */ var _splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
 /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
@@ -389,37 +391,32 @@ function ChevronRight(props) {
 }
 
 /***/ }),
-/* 26 */,
-/* 27 */,
-/* 28 */
+/* 28 */,
+/* 29 */,
+/* 30 */,
+/* 31 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/ChevronRight");
 
 /***/ }),
-/* 29 */,
-/* 30 */,
-/* 31 */,
 /* 32 */,
-/* 33 */
+/* 33 */,
+/* 34 */,
+/* 35 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/ScrollContainerContext");
 
 /***/ }),
-/* 34 */,
-/* 35 */,
-/* 36 */,
-/* 37 */,
-/* 38 */,
-/* 39 */
+/* 36 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return CaretDown; });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_react_icons_Caret__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(40);
+/* harmony import */ var _splunk_react_icons_Caret__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(37);
 /* harmony import */ var _splunk_react_icons_Caret__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_Caret__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
 /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
@@ -449,23 +446,28 @@ function CaretDown(props) {
 }
 
 /***/ }),
-/* 40 */
+/* 37 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/Caret");
 
 /***/ }),
+/* 38 */,
+/* 39 */,
+/* 40 */,
 /* 41 */,
 /* 42 */,
-/* 43 */
+/* 43 */,
+/* 44 */,
+/* 45 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Tooltip");
 
 /***/ }),
-/* 44 */,
-/* 45 */,
-/* 46 */
+/* 46 */,
+/* 47 */,
+/* 48 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -488,19 +490,19 @@ function assertDefined(val, msg) {
 
 
 /***/ }),
-/* 47 */,
-/* 48 */,
 /* 49 */,
 /* 50 */,
 /* 51 */,
-/* 52 */
+/* 52 */,
+/* 53 */,
+/* 54 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MoreVertical; });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_react_icons_MoreVertical__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(53);
+/* harmony import */ var _splunk_react_icons_MoreVertical__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(55);
 /* harmony import */ var _splunk_react_icons_MoreVertical__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_MoreVertical__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
 /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
@@ -530,20 +532,20 @@ function MoreVertical(props) {
 }
 
 /***/ }),
-/* 53 */
+/* 55 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/MoreVertical");
 
 /***/ }),
-/* 54 */
+/* 56 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return ChevronDown; });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_react_icons_ChevronDown__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(55);
+/* harmony import */ var _splunk_react_icons_ChevronDown__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(57);
 /* harmony import */ var _splunk_react_icons_ChevronDown__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_ChevronDown__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
 /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
@@ -585,24 +587,22 @@ function ChevronDown(props) {
 }
 
 /***/ }),
-/* 55 */
+/* 57 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/ChevronDown");
 
 /***/ }),
-/* 56 */,
-/* 57 */,
 /* 58 */,
 /* 59 */,
-/* 60 */
+/* 60 */,
+/* 61 */,
+/* 62 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Switch");
 
 /***/ }),
-/* 61 */,
-/* 62 */,
 /* 63 */,
 /* 64 */,
 /* 65 */,
@@ -633,41 +633,43 @@ module.exports = require("@splunk/react-ui/Switch");
 /* 90 */,
 /* 91 */,
 /* 92 */,
-/* 93 */
+/* 93 */,
+/* 94 */,
+/* 95 */
 /***/ (function(module, exports) {
 
 module.exports = require("react-resize-detector");
 
 /***/ }),
-/* 94 */
+/* 96 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/Sort");
 
 /***/ }),
-/* 95 */
+/* 97 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/SortedDown");
 
 /***/ }),
-/* 96 */
+/* 98 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/SortedUp");
 
 /***/ }),
-/* 97 */
+/* 99 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/Info");
 
 /***/ }),
-/* 98 */,
-/* 99 */,
 /* 100 */,
 /* 101 */,
-/* 102 */
+/* 102 */,
+/* 103 */,
+/* 104 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -700,14 +702,14 @@ var external_react_event_listener_ = __webpack_require__(15);
 var external_react_event_listener_default = /*#__PURE__*/__webpack_require__.n(external_react_event_listener_);
 
 // EXTERNAL MODULE: external "react-resize-detector"
-var external_react_resize_detector_ = __webpack_require__(93);
+var external_react_resize_detector_ = __webpack_require__(95);
 var external_react_resize_detector_default = /*#__PURE__*/__webpack_require__.n(external_react_resize_detector_);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/keyboard"
 var keyboard_ = __webpack_require__(9);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ScrollContainerContext"
-var ScrollContainerContext_ = __webpack_require__(33);
+var ScrollContainerContext_ = __webpack_require__(35);
 
 // EXTERNAL MODULE: external "styled-components"
 var external_styled_components_ = __webpack_require__(3);
@@ -1111,7 +1113,10 @@ var StyledTableContainer = external_styled_components_default.a.div.withConfig({
 var StyledTable = external_styled_components_default.a.table.withConfig({
   displayName: "TableStyles__StyledTable",
   componentId: "sc-1cmfss7-2"
-})(["", ";position:relative;border-collapse:collapse;border-spacing:0;min-width:100%;&[data-fixed-column='true']{table-layout:fixed;min-width:0;width:0;}@media print{width:100%;max-width:100%;table-layout:auto;}"], themes_["mixins"].reset('table'));
+})(["", ";position:relative;border-collapse:collapse;border-spacing:0;min-width:100%;&[data-fixed-column='true']{table-layout:fixed;min-width:0;width:0;}", " @media print{width:100%;max-width:100%;table-layout:auto;}"], themes_["mixins"].reset('table'), function (_ref) {
+  var $resizableFillLayout = _ref.$resizableFillLayout;
+  return $resizableFillLayout && Object(external_styled_components_["css"])(["width:100%;min-width:100%;table-layout:fixed;"]);
+});
 var StyledDockedScrollbar = external_styled_components_default.a.div.withConfig({
   displayName: "TableStyles__StyledDockedScrollbar",
   componentId: "sc-1cmfss7-3"
@@ -1126,8 +1131,8 @@ var StyledTableCaption = external_styled_components_default.a.caption.withConfig
 })(["padding:", ";font-size:", ";caption-side:", ";"], Object(themes_["pick"])({
   enterprise: "".concat(themes_["variables"].spacingQuarter, " 0"),
   prisma: "5px 0"
-}), themes_["variables"].fontSizeLarge, function (_ref) {
-  var side = _ref.side;
+}), themes_["variables"].fontSizeLarge, function (_ref2) {
+  var side = _ref2.side;
   return side;
 });
 
@@ -1392,11 +1397,11 @@ Cell_defineProperty(Cell_Cell, "defaultProps", Cell_defaultProps);
 var i18n_ = __webpack_require__(5);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/Sort"
-var Sort_ = __webpack_require__(94);
+var Sort_ = __webpack_require__(96);
 var Sort_default = /*#__PURE__*/__webpack_require__.n(Sort_);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/SortedDown"
-var SortedDown_ = __webpack_require__(95);
+var SortedDown_ = __webpack_require__(97);
 var SortedDown_default = /*#__PURE__*/__webpack_require__.n(SortedDown_);
 
 // EXTERNAL MODULE: ./src/icons/ThemedIcon.tsx
@@ -1443,7 +1448,7 @@ function SortedDown(props) {
   }, props));
 }
 // EXTERNAL MODULE: external "@splunk/react-icons/SortedUp"
-var SortedUp_ = __webpack_require__(96);
+var SortedUp_ = __webpack_require__(98);
 var SortedUp_default = /*#__PURE__*/__webpack_require__.n(SortedUp_);
 
 // CONCATENATED MODULE: ./src/icons/SortedUp.tsx
@@ -1484,7 +1489,7 @@ function SortedUp(props) {
   }, props));
 }
 // EXTERNAL MODULE: ./src/icons/CaretDown.tsx
-var CaretDown = __webpack_require__(39);
+var CaretDown = __webpack_require__(36);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ScreenReaderContent"
 var ScreenReaderContent_ = __webpack_require__(14);
@@ -1684,8 +1689,8 @@ var HeadCellStyles_Styled = external_styled_components_default.a.th.withConfig({
   HeadInnerStyles_Styled, Object(themes_["pick"])({
     enterprise: Object(external_styled_components_["css"])(["padding-top:7px;"]),
     prisma: {
-      comfortable: Object(external_styled_components_["css"])(["padding-top:12px;padding-bottom:12px;"]),
-      compact: Object(external_styled_components_["css"])(["padding-top:6px;padding-bottom:6px;"])
+      comfortable: Object(external_styled_components_["css"])(["padding:16px 12px;"]),
+      compact: Object(external_styled_components_["css"])(["padding:6px 12px;"])
     }
   })),
   toggleAll: Object(external_styled_components_["css"])(["& > ", "{padding-top:", ";}"],
@@ -1760,8 +1765,8 @@ var StyledDrag = external_styled_components_default.a.div.withConfig({
   return $draggable && Object(external_styled_components_["css"])(["padding:", ";-webkit-user-drag:element;user-select:none;"], Object(themes_["pick"])({
     enterprise: '9px 0',
     prisma: {
-      comfortable: '16px 0 15px',
-      compact: '9px 0 6px'
+      comfortable: '16px 17px 15px',
+      compact: '9px 17px 6px'
     }
   }));
 }, Object(themes_["pick"])({
@@ -1868,14 +1873,14 @@ var HeadInner_propTypes = {
   resizable: external_prop_types_default.a.bool,
   sortDir: external_prop_types_default.a.string,
   truncate: external_prop_types_default.a.bool,
-  width: external_prop_types_default.a.number
+  width: external_prop_types_default.a.oneOfType([external_prop_types_default.a.number, external_prop_types_default.a.oneOf(['auto'])])
 };
 
 function HeadInner(_ref) {
   var index = _ref.index,
       columnId = _ref.columnId,
       id = _ref.id,
-      width = _ref.width,
+      widthProp = _ref.width,
       onDragEnd = _ref.onDragEnd,
       onAutosizeColumn = _ref.onAutosizeColumn,
       _ref$align = _ref.align,
@@ -1934,15 +1939,44 @@ function HeadInner(_ref) {
       family = _useSplunkTheme.family;
 
   var isPrisma = family === 'prisma';
+  var width;
+
+  if (widthProp === 'auto') {
+    var _el$parentElement;
+
+    var el = ref.current;
+    var rect = el === null || el === void 0 ? void 0 : (_el$parentElement = el.parentElement) === null || _el$parentElement === void 0 ? void 0 : _el$parentElement.getBoundingClientRect();
+    width = rect === null || rect === void 0 ? void 0 : rect.width;
+  } else {
+    width = widthProp;
+  }
 
   var handleResizeKeyDown = function handleResizeKeyDown(e) {
     var key = Object(keyboard_["keycode"])(e.nativeEvent);
 
-    if (onRequestResize === undefined || width === undefined || index === undefined) {
+    if (onRequestResize === undefined || index === undefined) {
+      return;
+    }
+
+    if (widthProp === 'auto') {
+      var _el$parentElement2;
+
+      var _el = ref.current;
+
+      var _rect = _el === null || _el === void 0 ? void 0 : (_el$parentElement2 = _el.parentElement) === null || _el$parentElement2 === void 0 ? void 0 : _el$parentElement2.getBoundingClientRect();
+
+      width = _rect === null || _rect === void 0 ? void 0 : _rect.width;
+    } else {
+      width = widthProp;
+    }
+
+    if (width === undefined) {
       return;
     }
 
     if (key === 'left') {
+      e.preventDefault(); // prevent text selection
+
       var newWidth = Math.max(width - 10, 20);
       onRequestResize(e, {
         index: index,
@@ -1953,6 +1987,8 @@ function HeadInner(_ref) {
     }
 
     if (key === 'right') {
+      e.preventDefault(); // prevent text selection
+
       var _newWidth = width + 10;
 
       onRequestResize(e, {
@@ -1965,6 +2001,22 @@ function HeadInner(_ref) {
   };
 
   var handleStartResize = function handleStartResize(e) {
+    if (widthProp === 'auto') {
+      var _el2$parentElement;
+
+      var _el2 = ref.current;
+
+      var _rect2 = _el2 === null || _el2 === void 0 ? void 0 : (_el2$parentElement = _el2.parentElement) === null || _el2$parentElement === void 0 ? void 0 : _el2$parentElement.getBoundingClientRect();
+
+      width = _rect2 === null || _rect2 === void 0 ? void 0 : _rect2.width;
+    } else {
+      width = widthProp;
+    }
+
+    if (width === undefined) {
+      return;
+    }
+
     e.preventDefault(); // prevent text selection
 
     setStartClientX(e.clientX);
@@ -1996,13 +2048,14 @@ function HeadInner(_ref) {
     var el = ref.current;
 
     if (e.dataTransfer.setDragImage && (el === null || el === void 0 ? void 0 : el.parentElement)) {
-      var rect = el.parentElement.getBoundingClientRect();
+      var _rect3 = el.parentElement.getBoundingClientRect();
+
       var clone = el.cloneNode(true);
-      clone.style.width = "".concat(rect.width, "px");
-      clone.style.height = "".concat(rect.height, "px");
+      clone.style.width = "".concat(_rect3.width, "px");
+      clone.style.height = "".concat(_rect3.height, "px");
       clone.setAttribute('data-helper', 'true');
       document.body.appendChild(clone);
-      e.dataTransfer.setDragImage(clone, e.clientX - rect.left, e.clientY - rect.top);
+      e.dataTransfer.setDragImage(clone, e.clientX - _rect3.left, e.clientY - _rect3.top);
       setIsDragging(true);
       setCloneEl(clone);
     }
@@ -2172,7 +2225,7 @@ var HeadCell_propTypes = {
    * @private
    */
   visible: external_prop_types_default.a.bool,
-  width: external_prop_types_default.a.number,
+  width: external_prop_types_default.a.oneOfType([external_prop_types_default.a.number, external_prop_types_default.a.oneOf(['auto'])]),
 
   /** @private. */
   variant: external_prop_types_default.a.oneOf(['toggleAll', 'info', 'actions'])
@@ -2365,11 +2418,11 @@ HeadCell_defineProperty(HeadCell_HeadCell, "defaultProps", HeadCell_defaultProps
 
 /* harmony default export */ var Table_HeadCell = (HeadCell_HeadCell);
 // EXTERNAL MODULE: external "@splunk/react-icons/Info"
-var Info_ = __webpack_require__(97);
+var Info_ = __webpack_require__(99);
 var Info_default = /*#__PURE__*/__webpack_require__.n(Info_);
 
 // EXTERNAL MODULE: ./src/icons/ChevronRight.tsx
-var ChevronRight = __webpack_require__(25);
+var ChevronRight = __webpack_require__(27);
 
 // CONCATENATED MODULE: ./src/Table/HeadExpandRowsIcon.tsx
 
@@ -2393,22 +2446,22 @@ function HeadExpandRowsIcon() {
   });
 }
 // EXTERNAL MODULE: external "@splunk/react-ui/Button"
-var Button_ = __webpack_require__(17);
+var Button_ = __webpack_require__(16);
 var Button_default = /*#__PURE__*/__webpack_require__.n(Button_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Dropdown"
-var Dropdown_ = __webpack_require__(16);
+var Dropdown_ = __webpack_require__(19);
 var Dropdown_default = /*#__PURE__*/__webpack_require__.n(Dropdown_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Tooltip"
-var Tooltip_ = __webpack_require__(43);
+var Tooltip_ = __webpack_require__(45);
 var Tooltip_default = /*#__PURE__*/__webpack_require__.n(Tooltip_);
 
 // EXTERNAL MODULE: ./src/icons/ChevronDown.tsx
-var ChevronDown = __webpack_require__(54);
+var ChevronDown = __webpack_require__(56);
 
 // EXTERNAL MODULE: ./src/icons/MoreVertical.tsx
-var MoreVertical = __webpack_require__(52);
+var MoreVertical = __webpack_require__(54);
 
 // CONCATENATED MODULE: ./src/Table/RowDragCell.tsx
 function RowDragCell_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { RowDragCell_typeof = function _typeof(obj) { return typeof obj; }; } else { RowDragCell_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return RowDragCell_typeof(obj); }
@@ -2690,7 +2743,7 @@ var StyledCellExpansionDisabled = external_styled_components_default()(Table_Cel
 }));
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Switch"
-var Switch_ = __webpack_require__(60);
+var Switch_ = __webpack_require__(62);
 var Switch_default = /*#__PURE__*/__webpack_require__.n(Switch_);
 
 // CONCATENATED MODULE: ./src/Table/ToggleStyles.ts
@@ -3320,10 +3373,11 @@ var Head_Head = /*#__PURE__*/function (_Component) {
       var _this$el$firstElement, _this$el, _this$el$firstElement2;
 
       var headRowCells = Array.from((_this$el$firstElement = (_this$el = this.el) === null || _this$el === void 0 ? void 0 : (_this$el$firstElement2 = _this$el.firstElementChild) === null || _this$el$firstElement2 === void 0 ? void 0 : _this$el$firstElement2.children) !== null && _this$el$firstElement !== void 0 ? _this$el$firstElement : []);
-      return headRowCells.map(function (el) {
+      var result = headRowCells.map(function (el) {
         var computedStyle = window.getComputedStyle(el);
         return el.clientWidth - parseFloat(computedStyle.getPropertyValue('padding-right')) - parseFloat(computedStyle.getPropertyValue('padding-left'));
       });
+      return result;
     }
   }, {
     key: "getClientHeight",
@@ -3492,7 +3546,7 @@ Head_defineProperty(Head_Head, "defaultProps", Head_defaultProps);
 var id_ = __webpack_require__(10);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Popover"
-var Popover_ = __webpack_require__(18);
+var Popover_ = __webpack_require__(17);
 var Popover_default = /*#__PURE__*/__webpack_require__.n(Popover_);
 
 // CONCATENATED MODULE: ./src/Table/HeadDropdownCell.tsx
@@ -3543,7 +3597,7 @@ function HeadDropdownCell_defineProperty(obj, key, value) { if (key in obj) { Ob
 
 
 
-var possibleCloseReasons = ['clickAway', 'contentClick', 'escapeKey', 'offScreen', 'toggleClick'];
+var possibleCloseReasons = ['clickAway', 'contentClick', 'escapeKey', 'offScreen', 'tabKey', 'toggleClick'];
 var HeadDropdownCell_propTypes = {
   align: external_prop_types_default.a.oneOf(['left', 'center', 'right']),
   canCoverHead: external_prop_types_default.a.bool,
@@ -4103,11 +4157,11 @@ var HeadTable_HeadTable = /*#__PURE__*/function (_Component) {
         ref: elementRef
       }, /*#__PURE__*/external_react_default.a.createElement(HeadTableStyles_Styled, HeadTable_extends({
         "data-test": "".concat(headType, "-head-table"),
+        "data-fixed-column": isFixedColumn ? 'true' : undefined,
         style: Object(external_lodash_["extend"])({}, tableStyle, {
           marginLeft: horizontalOffset,
           width: isFixedColumn ? undefined : tableWidth
-        }),
-        "data-fixed-column": isFixedColumn ? 'true' : undefined
+        })
       }, Object(external_lodash_["omit"])(otherProps, 'dragIndex')), clonedTHead));
     }
   }]);
@@ -4121,7 +4175,7 @@ HeadTable_defineProperty(HeadTable_HeadTable, "defaultProps", HeadTable_defaultP
 
 /* harmony default export */ var Table_HeadTable = (HeadTable_HeadTable);
 // EXTERNAL MODULE: ./src/utils/types.ts
-var types = __webpack_require__(46);
+var types = __webpack_require__(48);
 
 // CONCATENATED MODULE: ./src/Table/Table.tsx
 function Table_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { Table_typeof = function _typeof(obj) { return typeof obj; }; } else { Table_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return Table_typeof(obj); }
@@ -4208,7 +4262,8 @@ var Table_defaultProps = {
   dockOffset: 0,
   headType: 'inline',
   rowExpansion: 'none',
-  rowSelection: 'none'
+  rowSelection: 'none',
+  resizableFillLayout: false
 };
 
 var Table_Table = /*#__PURE__*/function (_Component) {
@@ -4663,6 +4718,7 @@ var Table_Table = /*#__PURE__*/function (_Component) {
       var showDockedHeader = this.showDockedHeader();
 
       if ((this.showFixed() || showDockedHeader) && this.props.headType !== 'inline') {
+        // FIXME: handle inline
         if (showDockedHeader) {
           // Save the current head focus state so that it can be applied to the docked version
           // after the `HeadTable` mounts.
@@ -4750,6 +4806,7 @@ var Table_Table = /*#__PURE__*/function (_Component) {
           onRequestResizeColumn = _this$props4.onRequestResizeColumn,
           onRequestToggleAllRows = _this$props4.onRequestToggleAllRows,
           outerStyle = _this$props4.outerStyle,
+          resizableFillLayout = _this$props4.resizableFillLayout,
           rowSelection = _this$props4.rowSelection,
           tableStyle = _this$props4.tableStyle;
       var tHead;
@@ -4794,6 +4851,11 @@ var Table_Table = /*#__PURE__*/function (_Component) {
       tHead = /*#__PURE__*/Object(external_react_["cloneElement"])(tHead, {}, headCells);
       var defaultScrollContainer = this.context || 'window';
       var scrollContainer = this.isFixed() ? this.tableContainer : defaultScrollContainer;
+
+      if (resizableFillLayout) {
+        isFixedColumn = false;
+      }
+
       return /*#__PURE__*/external_react_default.a.createElement(TableStyles_Styled, Table_extends({
         "data-test": "table",
         ref: elementRef,
@@ -4819,7 +4881,8 @@ var Table_Table = /*#__PURE__*/function (_Component) {
         },
         "data-test": "main-table",
         style: tableStyle,
-        "data-fixed-column": isFixedColumn ? 'true' : undefined
+        "data-fixed-column": isFixedColumn ? 'true' : undefined,
+        $resizableFillLayout: resizableFillLayout
       }, tCaption, tHead, tBody))), this.renderDockedScrollbar());
     }
   }]);