@splunk/react-ui 4.9.0 → 4.12.0

package/Table.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 114);
+/******/ 	return __webpack_require__(__webpack_require__.s = 110);
 /******/ })
 /************************************************************************/
 /******/ ([
@@ -276,8 +276,7 @@ module.exports = require("@splunk/ui-utils/keyboard");
 module.exports = require("@splunk/ui-utils/id");
 
 /***/ }),
-/* 11 */,
-/* 12 */
+/* 11 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -303,6 +302,7 @@ function updateReactRef(ref, current) {
 
 
 /***/ }),
+/* 12 */,
 /* 13 */,
 /* 14 */
 /***/ (function(module, exports) {
@@ -319,23 +319,23 @@ module.exports = require("@splunk/react-ui/EventListener");
 /* 16 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Popover");
+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 */,
-/* 19 */
+/* 19 */,
+/* 20 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Dropdown");
 
 /***/ }),
-/* 20 */,
 /* 21 */,
 /* 22 */,
 /* 23 */,
@@ -349,7 +349,7 @@ module.exports = require("@splunk/react-ui/Dropdown");
 /* 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__(31);
+/* harmony import */ var _splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(32);
 /* 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);
@@ -394,29 +394,31 @@ function ChevronRight(props) {
 /* 28 */,
 /* 29 */,
 /* 30 */,
-/* 31 */
+/* 31 */,
+/* 32 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/ChevronRight");
 
 /***/ }),
-/* 32 */,
 /* 33 */,
 /* 34 */,
-/* 35 */
+/* 35 */,
+/* 36 */,
+/* 37 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/ScrollContainerContext");
 
 /***/ }),
-/* 36 */
+/* 38 */
 /***/ (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__(37);
+/* harmony import */ var _splunk_react_icons_Caret__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(39);
 /* 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);
@@ -446,14 +448,12 @@ function CaretDown(props) {
 }
 
 /***/ }),
-/* 37 */
+/* 39 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/Caret");
 
 /***/ }),
-/* 38 */,
-/* 39 */,
 /* 40 */,
 /* 41 */,
 /* 42 */,
@@ -462,13 +462,13 @@ module.exports = require("@splunk/react-icons/Caret");
 /* 45 */,
 /* 46 */,
 /* 47 */,
-/* 48 */
+/* 48 */,
+/* 49 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Tooltip");
 
 /***/ }),
-/* 49 */,
 /* 50 */,
 /* 51 */,
 /* 52 */,
@@ -503,15 +503,14 @@ function assertDefined(val, msg) {
 /* 59 */,
 /* 60 */,
 /* 61 */,
-/* 62 */,
-/* 63 */
+/* 62 */
 /***/ (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__(64);
+/* harmony import */ var _splunk_react_icons_MoreVertical__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(63);
 /* 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);
@@ -541,21 +540,20 @@ function MoreVertical(props) {
 }
 
 /***/ }),
-/* 64 */
+/* 63 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/MoreVertical");
 
 /***/ }),
-/* 65 */,
-/* 66 */
+/* 64 */
 /***/ (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__(67);
+/* harmony import */ var _splunk_react_icons_ChevronDown__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(65);
 /* 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);
@@ -597,21 +595,23 @@ function ChevronDown(props) {
 }
 
 /***/ }),
-/* 67 */
+/* 65 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/ChevronDown");
 
 /***/ }),
+/* 66 */,
+/* 67 */,
 /* 68 */,
 /* 69 */,
-/* 70 */,
-/* 71 */
+/* 70 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Switch");
 
 /***/ }),
+/* 71 */,
 /* 72 */,
 /* 73 */,
 /* 74 */,
@@ -643,43 +643,39 @@ module.exports = require("@splunk/react-ui/Switch");
 /* 100 */,
 /* 101 */,
 /* 102 */,
-/* 103 */,
-/* 104 */,
-/* 105 */,
-/* 106 */
+/* 103 */
 /***/ (function(module, exports) {
 
 module.exports = require("react-resize-detector");
 
 /***/ }),
-/* 107 */
+/* 104 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/SortedDown");
 
 /***/ }),
-/* 108 */
+/* 105 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/SortedUp");
 
 /***/ }),
-/* 109 */
+/* 106 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/Sort");
 
 /***/ }),
-/* 110 */
+/* 107 */
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/Info");
 
 /***/ }),
-/* 111 */,
-/* 112 */,
-/* 113 */,
-/* 114 */
+/* 108 */,
+/* 109 */,
+/* 110 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -708,7 +704,7 @@ var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_pr
 var external_lodash_ = __webpack_require__(4);
 
 // EXTERNAL MODULE: external "react-resize-detector"
-var external_react_resize_detector_ = __webpack_require__(106);
+var external_react_resize_detector_ = __webpack_require__(103);
 var external_react_resize_detector_default = /*#__PURE__*/__webpack_require__.n(external_react_resize_detector_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/EventListener"
@@ -719,7 +715,7 @@ var EventListener_default = /*#__PURE__*/__webpack_require__.n(EventListener_);
 var keyboard_ = __webpack_require__(9);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ScrollContainerContext"
-var ScrollContainerContext_ = __webpack_require__(35);
+var ScrollContainerContext_ = __webpack_require__(37);
 
 // EXTERNAL MODULE: external "styled-components"
 var external_styled_components_ = __webpack_require__(3);
@@ -734,10 +730,10 @@ var themes_ = __webpack_require__(0);
 var Styled = external_styled_components_default.a.tbody.withConfig({
   displayName: "BodyStyles__Styled",
   componentId: "sc-1k5p6pq-0"
-})(["", ""], themes_["mixins"].reset('table-row-group'));
+})(["", " z-index:0;"], themes_["mixins"].reset('table-row-group'));
 
 // EXTERNAL MODULE: ./src/utils/updateReactRef.ts
-var updateReactRef = __webpack_require__(12);
+var updateReactRef = __webpack_require__(11);
 
 // CONCATENATED MODULE: ./src/Table/Body.tsx
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
@@ -1120,15 +1116,15 @@ _defineProperty(Body_Body, "defaultProps", defaultProps);
 var TableStyles_Styled = external_styled_components_default.a.div.withConfig({
   displayName: "TableStyles__Styled",
   componentId: "sc-1cmfss7-0"
-})(["", ";max-width:100%;position:relative;@media print{max-height:none !important;}"], themes_["mixins"].reset('block'));
+})(["", ";max-width:100%;position:relative;z-index:1;@media print{max-height:none !important;}"], themes_["mixins"].reset('block'));
 var StyledTableContainer = external_styled_components_default.a.div.withConfig({
   displayName: "TableStyles__StyledTableContainer",
   componentId: "sc-1cmfss7-1"
-})(["overflow:auto;"]);
+})(["overflow:auto;&::before{content:'';width:100%;height:0;top:0;position:absolute;}"]);
 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'), function (_ref) {
+})(["", ";position:relative;border-collapse:collapse;border-spacing:0;min-width:100%;z-index:0;&[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;"]);
 });
@@ -1412,7 +1408,7 @@ Cell_defineProperty(Cell_Cell, "defaultProps", Cell_defaultProps);
 var i18n_ = __webpack_require__(5);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/SortedDown"
-var SortedDown_ = __webpack_require__(107);
+var SortedDown_ = __webpack_require__(104);
 var SortedDown_default = /*#__PURE__*/__webpack_require__.n(SortedDown_);
 
 // EXTERNAL MODULE: ./src/icons/ThemedIcon.tsx
@@ -1459,7 +1455,7 @@ function SortedDown(props) {
   }, props));
 }
 // EXTERNAL MODULE: external "@splunk/react-icons/SortedUp"
-var SortedUp_ = __webpack_require__(108);
+var SortedUp_ = __webpack_require__(105);
 var SortedUp_default = /*#__PURE__*/__webpack_require__.n(SortedUp_);
 
 // CONCATENATED MODULE: ./src/icons/SortedUp.tsx
@@ -1500,7 +1496,7 @@ function SortedUp(props) {
   }, props));
 }
 // EXTERNAL MODULE: external "@splunk/react-icons/Sort"
-var Sort_ = __webpack_require__(109);
+var Sort_ = __webpack_require__(106);
 var Sort_default = /*#__PURE__*/__webpack_require__.n(Sort_);
 
 // CONCATENATED MODULE: ./src/icons/Sort.tsx
@@ -1541,7 +1537,7 @@ function CaretDown(props) {
   }, props));
 }
 // EXTERNAL MODULE: ./src/icons/CaretDown.tsx
-var icons_CaretDown = __webpack_require__(36);
+var icons_CaretDown = __webpack_require__(38);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ScreenReaderContent"
 var ScreenReaderContent_ = __webpack_require__(14);
@@ -1675,7 +1671,7 @@ HeadInnerStyles_Styled, themes_["variables"].focusColor, themes_["variables"].fo
 var HeadCellStyles_Styled = external_styled_components_default.a.th.withConfig({
   displayName: "HeadCellStyles__Styled",
   componentId: "sc-1hj81sa-0"
-})(["", ";background-color:", ";box-sizing:content-box;text-align:left;vertical-align:", ";& + &{border-left:1px solid ", ";}", " ", " ", ""], themes_["mixins"].reset('table-cell'), Object(themes_["pick"])({
+})(["", ";background-color:", ";box-sizing:content-box;text-align:left;vertical-align:", ";& + &{border-left:1px solid ", ";}", " ", " ", " ", ""], themes_["mixins"].reset('table-cell'), Object(themes_["pick"])({
   enterprise: {
     light: themes_["variables"].gray92,
     dark: themes_["variables"].black
@@ -1688,8 +1684,18 @@ var HeadCellStyles_Styled = external_styled_components_default.a.th.withConfig({
   enterprise: themes_["variables"].backgroundColor,
   prisma: themes_["variables"].backgroundColorPage
 }), function (_ref2) {
-  var $clickable = _ref2.$clickable;
-  return $clickable && Object(external_styled_components_["css"])(["&:focus{box-shadow:", ";outline:none;& > ", "{color:", ";background-color:", ";}}&:hover{outline:none;& > ", "{color:", ";background-color:", ";}}&:active{& > ", "{background-color:", ";}}"], themes_["variables"].focusShadowInset,
+  var $isFixed = _ref2.$isFixed,
+      $zIndex = _ref2.$zIndex;
+  return $isFixed && Object(external_styled_components_["css"])(["position:sticky;top:0;z-index:", ";&:not(:first-child)::before{content:'';height:100%;position:absolute;top:0;bottom:0;box-shadow:-1px 0 0 0 ", ";width:2px;border:0;left:0;margin-right:-2px;color:transparent;}&:not(:last-child)::after{content:'';height:100%;position:absolute;top:0;bottom:0;box-shadow:1px 0 0 0 ", ";width:2px;border:0;right:0;margin-left:-2px;color:transparent;}"], $zIndex, Object(themes_["pick"])({
+    enterprise: themes_["variables"].backgroundColor,
+    prisma: themes_["variables"].backgroundColorPage
+  }), Object(themes_["pick"])({
+    enterprise: themes_["variables"].backgroundColor,
+    prisma: themes_["variables"].backgroundColorPage
+  }));
+}, function (_ref3) {
+  var $clickable = _ref3.$clickable;
+  return $clickable && Object(external_styled_components_["css"])(["cursor:pointer;&:focus{box-shadow:", ";outline:none;& > ", "{color:", ";background-color:", ";}}&:hover{outline:none;& > ", "{color:", ";background-color:", ";}}&:active{& > ", "{background-color:", ";}}"], themes_["variables"].focusShadowInset,
   /* sc-sel */
   HeadInnerStyles_Styled, Object(themes_["pick"])({
     enterprise: {
@@ -1712,8 +1718,8 @@ var HeadCellStyles_Styled = external_styled_components_default.a.th.withConfig({
   HeadInnerStyles_Styled, Object(themes_["pick"])({
     prisma: themes_["variables"].interactiveColorOverlayActive
   }));
-}, function (_ref3) {
-  var $dragging = _ref3.$dragging;
+}, function (_ref4) {
+  var $dragging = _ref4.$dragging;
   return $dragging && Object(external_styled_components_["css"])(["background-color:", ";&:focus{box-shadow:none;}"], Object(themes_["pick"])({
     enterprise: {
       light: themes_["variables"].gray80,
@@ -2168,6 +2174,11 @@ function HeadInner(_ref) {
 
 HeadInner.propTypes = HeadInner_propTypes;
 /* harmony default export */ var Table_HeadInner = (HeadInner);
+// CONCATENATED MODULE: ./src/Table/TableContext.ts
+
+var TableContext = /*#__PURE__*/Object(external_react_["createContext"])({});
+TableContext.displayName = 'Table';
+/* harmony default export */ var Table_TableContext = (TableContext);
 // CONCATENATED MODULE: ./src/Table/HeadCell.tsx
 function HeadCell_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { HeadCell_typeof = function _typeof(obj) { return typeof obj; }; } else { HeadCell_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return HeadCell_typeof(obj); }
 
@@ -2213,6 +2224,7 @@ function HeadCell_defineProperty(obj, key, value) { if (key in obj) { Object.def
 
 
 
+
 var HeadCell_propTypes = {
   align: external_prop_types_default.a.oneOf(['left', 'center', 'right']),
   children: external_prop_types_default.a.node,
@@ -2262,7 +2274,8 @@ var HeadCell_propTypes = {
   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'])
+  variant: external_prop_types_default.a.oneOf(['toggleAll', 'info', 'actions']),
+  zIndex: external_prop_types_default.a.number
 };
 var HeadCell_defaultProps = {
   align: 'left',
@@ -2270,7 +2283,8 @@ var HeadCell_defaultProps = {
   showGuideline: 'none',
   sortDir: 'none',
   truncate: true,
-  visible: true
+  visible: true,
+  zIndex: 1
 };
 
 var HeadCell_HeadCell = /*#__PURE__*/function (_Component) {
@@ -2394,7 +2408,8 @@ var HeadCell_HeadCell = /*#__PURE__*/function (_Component) {
           variant = _this$props5.variant,
           truncateProp = _this$props5.truncate,
           visible = _this$props5.visible,
-          width = _this$props5.width;
+          width = _this$props5.width,
+          zIndex = _this$props5.zIndex;
       var draggable = !!onDragStart;
       var sortable = !!onSort && !!sortDir;
       var hasOnClick = onClick !== undefined;
@@ -2402,6 +2417,7 @@ var HeadCell_HeadCell = /*#__PURE__*/function (_Component) {
         width: width
       });
       var truncate = hasActionsHead ? false : truncateProp;
+      var headType = this.context.headType;
       /* eslint-disable jsx-a11y/no-static-element-interactions */
 
       return /*#__PURE__*/external_react_default.a.createElement(HeadCellStyles_Styled, HeadCell_extends({
@@ -2416,7 +2432,9 @@ var HeadCell_HeadCell = /*#__PURE__*/function (_Component) {
         tabIndex: visible && (draggable || onSort || hasOnClick) ? 0 : undefined,
         $dragging: this.state.isDragging || undefined,
         $clickable: draggable || sortable || hasOnClick,
-        $variant: variant
+        $variant: variant,
+        $zIndex: zIndex,
+        $isFixed: headType === 'fixed'
       }, Object(external_lodash_["omit"])(this.props, [].concat(HeadCell_toConsumableArray(Object.keys(HeadCell.propTypes)), ['id', 'style'])), {
         onKeyDown: draggable || onSort || hasOnClick ? this.handleKeyDown : undefined
       }), /*#__PURE__*/external_react_default.a.createElement(Table_HeadInner, {
@@ -2450,9 +2468,11 @@ HeadCell_defineProperty(HeadCell_HeadCell, "propTypes", HeadCell_propTypes);
 
 HeadCell_defineProperty(HeadCell_HeadCell, "defaultProps", HeadCell_defaultProps);
 
+HeadCell_defineProperty(HeadCell_HeadCell, "contextType", Table_TableContext);
+
 /* harmony default export */ var Table_HeadCell = (HeadCell_HeadCell);
 // EXTERNAL MODULE: external "@splunk/react-icons/Info"
-var Info_ = __webpack_require__(110);
+var Info_ = __webpack_require__(107);
 var Info_default = /*#__PURE__*/__webpack_require__.n(Info_);
 
 // EXTERNAL MODULE: ./src/icons/ChevronRight.tsx
@@ -2480,22 +2500,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__(19);
+var Dropdown_ = __webpack_require__(20);
 var Dropdown_default = /*#__PURE__*/__webpack_require__.n(Dropdown_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Tooltip"
-var Tooltip_ = __webpack_require__(48);
+var Tooltip_ = __webpack_require__(49);
 var Tooltip_default = /*#__PURE__*/__webpack_require__.n(Tooltip_);
 
 // EXTERNAL MODULE: ./src/icons/ChevronDown.tsx
-var ChevronDown = __webpack_require__(66);
+var ChevronDown = __webpack_require__(64);
 
 // EXTERNAL MODULE: ./src/icons/MoreVertical.tsx
-var MoreVertical = __webpack_require__(63);
+var MoreVertical = __webpack_require__(62);
 
 // 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); }
@@ -2777,7 +2797,7 @@ var StyledCellExpansionDisabled = external_styled_components_default()(Table_Cel
 }));
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Switch"
-var Switch_ = __webpack_require__(71);
+var Switch_ = __webpack_require__(70);
 var Switch_default = /*#__PURE__*/__webpack_require__.n(Switch_);
 
 // CONCATENATED MODULE: ./src/Table/ToggleStyles.ts
@@ -3325,6 +3345,9 @@ var Head_propTypes = {
 var Head_defaultProps = {
   actions: []
 };
+var columnOneIndexOffset = 3;
+var columnTwoIndexOffset = 2;
+var columnThreeIndexOffset = 1;
 
 var Head_Head = /*#__PURE__*/function (_Component) {
   Head_inherits(Head, _Component);
@@ -3501,7 +3524,9 @@ var Head_Head = /*#__PURE__*/function (_Component) {
           onRequestToggleAllRows = _this$props5.onRequestToggleAllRows,
           rowSelection = _this$props5.rowSelection;
       var guidelineIndex = this.calculateGuideIndex();
-      var clonedChildren = external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]).map(function (child, index, original) {
+      var validChildren = external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]);
+      var minimumIndex = validChildren.length + (actions.length || actionsColumnWidth ? 1 : 0);
+      var clonedChildren = validChildren.map(function (child, index, original) {
         var showGuideline = 'none';
 
         if (guidelineIndex === original.length && index + 1 === original.length) {
@@ -3517,7 +3542,8 @@ var Head_Head = /*#__PURE__*/function (_Component) {
           onDragStart: onRequestMoveColumn ? _this2.handleDragStart : undefined,
           onRequestMoveColumn: onRequestMoveColumn ? _this2.onRequestMoveColumn : undefined,
           onAutosizeColumn: onAutosizeColumn,
-          key: child.key || child.props.columnId || index
+          key: child.key || child.props.columnId || index,
+          zIndex: minimumIndex - index
         });
       });
       var toggleStateMap = {
@@ -3535,7 +3561,8 @@ var Head_Head = /*#__PURE__*/function (_Component) {
         key: "drag_rows_head_cell",
         "data-test": "drag-rows-head-cell",
         align: "center",
-        resizable: false
+        resizable: false,
+        zIndex: minimumIndex + columnOneIndexOffset
       }), onRequestToggleAllRows && /*#__PURE__*/external_react_default.a.createElement(StyledToggleAll, {
         key: "toggle_all",
         "data-test": "toggle-all",
@@ -3545,7 +3572,8 @@ var Head_Head = /*#__PURE__*/function (_Component) {
         variant: "toggleAll",
         truncate: false,
         role: "checkbox",
-        "aria-checked": ariaChecked
+        "aria-checked": ariaChecked,
+        zIndex: minimumIndex + columnTwoIndexOffset
       }, /*#__PURE__*/external_react_default.a.createElement(Table_Toggle, {
         selected: toggleState,
         allRows: true
@@ -3554,7 +3582,8 @@ var Head_Head = /*#__PURE__*/function (_Component) {
         "data-test": "more-info-head-cell",
         align: "center",
         resizable: false,
-        variant: "info"
+        variant: "info",
+        zIndex: minimumIndex + columnThreeIndexOffset
       }, /*#__PURE__*/external_react_default.a.createElement(HeadExpandRowsIcon, null)), clonedChildren, actions.length > 0 && /*#__PURE__*/external_react_default.a.createElement(Table_HeadCell, {
         hasActionsHead: true,
         key: "actions_head_cell",
@@ -3565,7 +3594,8 @@ var Head_Head = /*#__PURE__*/function (_Component) {
         style: {
           minWidth: defaultActionsColumnWidth
         },
-        variant: "actions"
+        variant: "actions",
+        zIndex: 1
       }, actions), actions.length === 0 && actionsColumnWidth && /*#__PURE__*/external_react_default.a.createElement(Table_HeadCell, {
         key: "actions_head_cell",
         "data-test": "actions-head-cell",
@@ -3575,7 +3605,8 @@ var Head_Head = /*#__PURE__*/function (_Component) {
         style: {
           minWidth: actionsColumnWidth
         },
-        variant: "actions"
+        variant: "actions",
+        zIndex: 1
       }, ' ')));
     }
   }], [{
@@ -3599,7 +3630,7 @@ Head_defineProperty(Head_Head, "defaultProps", Head_defaultProps);
 var id_ = __webpack_require__(10);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Popover"
-var Popover_ = __webpack_require__(16);
+var Popover_ = __webpack_require__(17);
 var Popover_default = /*#__PURE__*/__webpack_require__.n(Popover_);
 
 // CONCATENATED MODULE: ./src/Table/HeadDropdownCell.tsx
@@ -4288,6 +4319,7 @@ function Table_defineProperty(obj, key, value) { if (key in obj) { Object.define
 
 
 
+
 /** @public */
 
 var Table_propTypes = {
@@ -4744,11 +4776,6 @@ var Table_Table = /*#__PURE__*/function (_Component) {
       var rect = this.tableContainer.getBoundingClientRect();
       return rect.bottom > window.innerHeight && rect.top < window.innerHeight;
     }
-  }, {
-    key: "showFixed",
-    value: function showFixed() {
-      return this.head && this.isFixed();
-    }
   }, {
     key: "updateDragPositionImpl",
     value: function updateDragPositionImpl(dragPosition) {
@@ -4768,16 +4795,11 @@ var Table_Table = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderHeadTable",
     value: function renderHeadTable(tHead, isFixedColumn) {
-      var showDockedHeader = this.showDockedHeader();
-
-      if ((this.showFixed() || showDockedHeader) && this.props.headType !== 'inline') {
+      if (this.showDockedHeader()) {
         // 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.
-          this.headFocusState = Table.getHeadFocusState(this.head);
-        }
-
+        // Save the current head focus state so that it can be applied to the docked version
+        // after the `HeadTable` mounts.
+        this.headFocusState = Table.getHeadFocusState(this.head);
         var _this$state = this.state,
             cellWidths = _this$state.cellWidths,
             dragIndex = _this$state.dragIndex,
@@ -4791,7 +4813,7 @@ var Table_Table = /*#__PURE__*/function (_Component) {
         }
 
         return /*#__PURE__*/external_react_default.a.createElement(Table_HeadTable, {
-          headType: this.props.headType,
+          headType: "docked",
           tHead: tHead,
           cellWidths: cellWidths,
           dragIndex: dragIndex,
@@ -4855,6 +4877,7 @@ var Table_Table = /*#__PURE__*/function (_Component) {
       var _this$props4 = this.props,
           children = _this$props4.children,
           elementRef = _this$props4.elementRef,
+          headType = _this$props4.headType,
           innerStyle = _this$props4.innerStyle,
           onRequestResizeColumn = _this$props4.onRequestResizeColumn,
           onRequestToggleAllRows = _this$props4.onRequestToggleAllRows,
@@ -4925,7 +4948,11 @@ var Table_Table = /*#__PURE__*/function (_Component) {
       }), /*#__PURE__*/external_react_default.a.createElement(external_react_resize_detector_default.a, {
         handleWidth: true,
         onResize: this.handleResize
-      }), headTable, /*#__PURE__*/external_react_default.a.createElement(StyledTableContainer, {
+      }), /*#__PURE__*/external_react_default.a.createElement(Table_TableContext.Provider, {
+        value: {
+          headType: headType
+        }
+      }, headTable, /*#__PURE__*/external_react_default.a.createElement(StyledTableContainer, {
         onScroll: this.handleContainerScroll,
         ref: function ref(el) {
           _this3.tableContainer = el;
@@ -4941,7 +4968,7 @@ var Table_Table = /*#__PURE__*/function (_Component) {
         style: tableStyle,
         "data-fixed-column": isFixedColumn ? 'true' : undefined,
         $resizableFillLayout: resizableFillLayout
-      }, tCaption, tHead, tBody))), this.renderDockedScrollbar());
+      }, tCaption, tHead, tBody))), this.renderDockedScrollbar()));
     }
   }]);