@splunk/react-ui 4.16.3 → 4.17.1

package/Menu.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 166);
+/******/ 	return __webpack_require__(__webpack_require__.s = 171);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -101,7 +101,7 @@ module.exports = require("prop-types");
 
 /***/ }),
 
-/***/ 12:
+/***/ 11:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -128,28 +128,21 @@ function updateReactRef(ref, current) {
 
 /***/ }),
 
-/***/ 138:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/useForceUpdate");
-
-/***/ }),
-
-/***/ 139:
+/***/ 12:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-icons/TriangleRightSmall");
+module.exports = require("@splunk/react-ui/Clickable");
 
 /***/ }),
 
-/***/ 14:
+/***/ 142:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Clickable");
+module.exports = require("@splunk/react-icons/CaretSmallRight");
 
 /***/ }),
 
-/***/ 166:
+/***/ 171:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -176,16 +169,16 @@ var omit_ = __webpack_require__(5);
 var omit_default = /*#__PURE__*/__webpack_require__.n(omit_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Popover"
-var Popover_ = __webpack_require__(23);
+var Popover_ = __webpack_require__(21);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/focus"
-var focus_ = __webpack_require__(35);
+var focus_ = __webpack_require__(29);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/keyboard"
-var keyboard_ = __webpack_require__(9);
+var keyboard_ = __webpack_require__(7);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/useForceUpdate"
-var useForceUpdate_ = __webpack_require__(138);
+var useForceUpdate_ = __webpack_require__(45);
 var useForceUpdate_default = /*#__PURE__*/__webpack_require__.n(useForceUpdate_);
 
 // EXTERNAL MODULE: external "styled-components"
@@ -256,13 +249,16 @@ Divider.filterConsecutive = true;
 /* Remove the item if it is the last item after filtering. */
 
 Divider.filterLast = true;
+/* Tag the item as Divider */
+
+Divider.as = 'Divider';
 /* harmony default export */ var Menu_Divider = (Divider);
 // EXTERNAL MODULE: external "@splunk/react-ui/Heading"
-var Heading_ = __webpack_require__(77);
+var Heading_ = __webpack_require__(76);
 var Heading_default = /*#__PURE__*/__webpack_require__.n(Heading_);
 
 // EXTERNAL MODULE: external "@splunk/themes/useSplunkTheme"
-var useSplunkTheme_ = __webpack_require__(54);
+var useSplunkTheme_ = __webpack_require__(68);
 var useSplunkTheme_default = /*#__PURE__*/__webpack_require__.n(useSplunkTheme_);
 
 // CONCATENATED MODULE: ./src/Menu/HeadingStyles.ts
@@ -356,73 +352,43 @@ Heading.filterConsecutive = true;
 /* Remove the item if it is the last item after filtering. */
 
 Heading.filterLast = true;
+/* Tag the item as a Heading */
+
+Heading.as = 'Heading';
 /* harmony default export */ var Menu_Heading = (Heading);
 // EXTERNAL MODULE: external "lodash/isString"
-var isString_ = __webpack_require__(25);
+var isString_ = __webpack_require__(23);
 var isString_default = /*#__PURE__*/__webpack_require__.n(isString_);
 
-// EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
-var i18n_ = __webpack_require__(4);
-
-// EXTERNAL MODULE: ./src/icons/Check.tsx
-var Check = __webpack_require__(75);
-
-// EXTERNAL MODULE: external "@splunk/react-icons/TriangleRightSmall"
-var TriangleRightSmall_ = __webpack_require__(139);
-var TriangleRightSmall_default = /*#__PURE__*/__webpack_require__.n(TriangleRightSmall_);
-
-// EXTERNAL MODULE: ./src/icons/ThemedIcon.tsx
-var ThemedIcon = __webpack_require__(7);
-
-// EXTERNAL MODULE: ./src/icons/SVG.tsx
-var SVG = __webpack_require__(6);
-
-// CONCATENATED MODULE: ./src/icons/CaretRight.tsx
-function CaretRight_extends() { CaretRight_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return CaretRight_extends.apply(this, arguments); }
-
-
-
+// EXTERNAL MODULE: external "@splunk/react-icons/CaretSmallRight"
+var CaretSmallRight_ = __webpack_require__(142);
+var CaretSmallRight_default = /*#__PURE__*/__webpack_require__.n(CaretSmallRight_);
 
+// EXTERNAL MODULE: external "@splunk/react-icons/Checkmark"
+var Checkmark_ = __webpack_require__(86);
+var Checkmark_default = /*#__PURE__*/__webpack_require__.n(Checkmark_);
 
+// EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Check"
+var Check_ = __webpack_require__(95);
+var Check_default = /*#__PURE__*/__webpack_require__.n(Check_);
 
-function Prisma24(_ref) {
-  var otherProps = CaretRight_extends({}, _ref);
-
-  return /*#__PURE__*/external_react_default.a.createElement(SVG["a" /* default */], CaretRight_extends({
-    viewBox: "0 0 24 24"
-  }, otherProps), /*#__PURE__*/external_react_default.a.createElement("path", {
-    d: "M8.77004 16.4985C8.77004 16.9313 9.28241 17.1597 9.60425 16.8704L14.6126 12.3696C14.8337 12.1709 14.8336 11.8243 14.6125 11.6257L9.60412 7.12744C9.28225 6.83834 8.77002 7.06678 8.77002 7.49943L8.77004 16.4985Z",
-    fill: "currentColor"
-  }));
-}
-
-function CaretRight(props) {
-  return /*#__PURE__*/external_react_default.a.createElement(ThemedIcon["a" /* default */], CaretRight_extends({
-    Enterprise: TriangleRightSmall_default.a,
-    Prisma24: Prisma24
-  }, props));
-}
-// EXTERNAL MODULE: ./src/icons/ChevronRight.tsx
-var ChevronRight = __webpack_require__(37);
+// EXTERNAL MODULE: external "@splunk/react-icons/enterprise/ChevronRight"
+var ChevronRight_ = __webpack_require__(35);
+var ChevronRight_default = /*#__PURE__*/__webpack_require__.n(ChevronRight_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Clickable"
-var Clickable_ = __webpack_require__(14);
+var Clickable_ = __webpack_require__(12);
 var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Switch"
-var Switch_ = __webpack_require__(96);
+var Switch_ = __webpack_require__(58);
 var Switch_default = /*#__PURE__*/__webpack_require__.n(Switch_);
 
-// EXTERNAL MODULE: external "@splunk/react-icons/External"
-var External_ = __webpack_require__(60);
-var External_default = /*#__PURE__*/__webpack_require__.n(External_);
-
 // CONCATENATED MODULE: ./src/Menu/ItemStyles.ts
 
 
 
 
-
 var itemDescription = Object(external_styled_components_["css"])(["color:", ";font-size:", ";line-height:", ";overflow:inherit;white-space:inherit;text-overflow:inherit;"], Object(themes_["pick"])({
   prisma: themes_["variables"].contentColorDefault,
   enterprise: themes_["variables"].textGray
@@ -591,16 +557,59 @@ var StyledSubmenu = external_styled_components_default.a.span.withConfig({
   prisma: 'inherit',
   enterprise: themes_["variables"].textGray
 }));
-var StyledExternal = external_styled_components_default()(External_default.a).withConfig({
-  displayName: "ItemStyles__StyledExternal",
-  componentId: "sc-4kc053-11"
-})(["vertical-align:baseline;margin-left:", ";"], Object(themes_["pick"])({
-  enterprise: '3px',
-  prisma: '4px'
-}));
 
+// EXTERNAL MODULE: external "@splunk/react-icons/ArrowSquareTopRight"
+var ArrowSquareTopRight_ = __webpack_require__(94);
+var ArrowSquareTopRight_default = /*#__PURE__*/__webpack_require__.n(ArrowSquareTopRight_);
+
+// EXTERNAL MODULE: external "@splunk/react-icons/enterprise/External"
+var External_ = __webpack_require__(63);
+var External_default = /*#__PURE__*/__webpack_require__.n(External_);
+
+// EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
+var i18n_ = __webpack_require__(4);
+
+// CONCATENATED MODULE: ./src/Menu/icons/External.tsx
+
+
+
+
+
+
+
+var label = Object(i18n_["_"])('Open externally');
+
+var iconStyles = Object(external_styled_components_["css"])(["width:0.8em;height:0.8em;vertical-align:baseline;"]);
+var StyledEnterprise = external_styled_components_default()(External_default.a).withConfig({
+  displayName: "External__StyledEnterprise",
+  componentId: "sc-1turs2s-0"
+})(["", " margin:0 0 0 3px;"], iconStyles);
+var StyledPrisma = external_styled_components_default()(ArrowSquareTopRight_default.a).withConfig({
+  displayName: "External__StyledPrisma",
+  componentId: "sc-1turs2s-1"
+})(["", " margin:0 0 0 4px;"], iconStyles);
+
+function External() {
+  var _useSplunkTheme = Object(themes_["useSplunkTheme"])(),
+      isEnterprise = _useSplunkTheme.isEnterprise,
+      isCompact = _useSplunkTheme.isCompact;
+
+  var prismaSize = isCompact ? '20px' : '24px';
+  return isEnterprise ? /*#__PURE__*/external_react_default.a.createElement(StyledEnterprise, {
+    screenReaderText: label
+  }) : /*#__PURE__*/external_react_default.a.createElement(StyledPrisma, {
+    "aria-label": label,
+    height: prismaSize,
+    width: prismaSize
+  }, /*#__PURE__*/external_react_default.a.createElement("title", null, label));
+}
+
+/* harmony default export */ var icons_External = (External);
 // EXTERNAL MODULE: ./src/utils/updateReactRef.ts
-var updateReactRef = __webpack_require__(12);
+var updateReactRef = __webpack_require__(11);
+
+// EXTERNAL MODULE: ./src/utils/scrollIntoViewIfNeeded.ts
+var utils_scrollIntoViewIfNeeded = __webpack_require__(89);
 
 // CONCATENATED MODULE: ./src/Menu/Item.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); }
@@ -644,6 +653,8 @@ function Item_defineProperty(obj, key, value) { if (key in obj) { Object.defineP
 
 
 
+
+
 var Item_propTypes = {
   active: external_prop_types_default.a.bool,
   children: external_prop_types_default.a.node,
@@ -746,24 +757,7 @@ var Item_Item = /*#__PURE__*/function (_Component) {
   }, {
     key: "scrollIntoViewIfNeeded",
     value: function scrollIntoViewIfNeeded() {
-      var el = this.el;
-
-      if (!el) {
-        return;
-      }
-
-      var parentEl = el.offsetParent;
-
-      if (!parentEl) {
-        return;
-      } // Below the bottom of the container.
-
-
-      if (parentEl.scrollTop + parentEl.clientHeight < el.offsetTop + el.clientHeight) {
-        parentEl.scrollTop = el.offsetTop + el.clientHeight - parentEl.clientHeight; // Above the top of the container.
-      } else if (parentEl.scrollTop > el.offsetTop) {
-        parentEl.scrollTop = el.offsetTop;
-      }
+      Object(utils_scrollIntoViewIfNeeded["a" /* scrollIntoViewIfNeeded */])(this.el);
     }
   }, {
     key: "renderLabel",
@@ -819,7 +813,8 @@ var Item_Item = /*#__PURE__*/function (_Component) {
           openInNewContext = _this$props3.openInNewContext,
           otherProps = Item_objectWithoutProperties(_this$props3, ["active", "children", "hasSubmenu", "selectable", "selectableAppearance", "selected", "icon", "description", "disabled", "onClick", "preventFocus", "role", "splunkTheme", "to", "truncate", "descriptionPosition", "openInNewContext"]);
 
-      var isPrisma = splunkTheme.isPrisma;
+      var isEnterprise = splunkTheme.isEnterprise,
+          isPrisma = splunkTheme.isPrisma;
       var isSelectable = selectable || selected;
       var defaultRole = {
         nonselectable: 'menuitem',
@@ -834,16 +829,15 @@ var Item_Item = /*#__PURE__*/function (_Component) {
       var selectablePosition = isPrisma ? 'right' : 'left';
       var descriptionRight = description && descriptionPosition === 'right' && selectablePosition !== 'right';
       var descriptionBottom = description && !descriptionRight;
-      var selectableCheckmark = selected && selectableAppearance === 'checkmark' && /*#__PURE__*/external_react_default.a.createElement(StyledItemSelectedIcon, null, /*#__PURE__*/external_react_default.a.createElement(Check["a" /* default */], {
-        enterpriseSize: 0.85,
-        prismaSize: "small",
+      var selectableCheckmark = selected && selectableAppearance === 'checkmark' && /*#__PURE__*/external_react_default.a.createElement(StyledItemSelectedIcon, null, isPrisma ? /*#__PURE__*/external_react_default.a.createElement(Checkmark_default.a, {
+        inline: true,
+        height: "16",
+        width: "16"
+      }) : /*#__PURE__*/external_react_default.a.createElement(Check_default.a, {
+        hideDefaultTooltip: true,
         inline: true,
-        style: // eslint-disable-next-line no-nested-ternary
-        isPrisma ? icon ? {
-          verticalAlign: 'sub'
-        } : {
-          verticalAlign: 'text-top'
-        } : undefined
+        screenReaderText: null,
+        size: 0.85
       }));
       return /*#__PURE__*/external_react_default.a.createElement(StyledClickable, Item_extends({
         $isSelectable: isSelectable,
@@ -873,17 +867,20 @@ var Item_Item = /*#__PURE__*/function (_Component) {
         selected: selected,
         selectedLabel: "Selected",
         value: "menu-item"
-      }), hasSubmenu && /*#__PURE__*/external_react_default.a.createElement(StyledSubmenu, null, isPrisma ? /*#__PURE__*/external_react_default.a.createElement(CaretRight, null) : /*#__PURE__*/external_react_default.a.createElement(ChevronRight["a" /* default */], null)), descriptionRight && /*#__PURE__*/external_react_default.a.createElement(StyledItemDescriptionRight, {
+      }), hasSubmenu && /*#__PURE__*/external_react_default.a.createElement(StyledSubmenu, null, isEnterprise ? /*#__PURE__*/external_react_default.a.createElement(ChevronRight_default.a, {
+        hideDefaultTooltip: true,
+        screenReaderText: null
+      }) : /*#__PURE__*/external_react_default.a.createElement(CaretSmallRight_default.a, {
+        height: "24",
+        width: "24"
+      })), descriptionRight && /*#__PURE__*/external_react_default.a.createElement(StyledItemDescriptionRight, {
         "data-test": "description"
       }, description), /*#__PURE__*/external_react_default.a.createElement(StyledInnerWrapper, null, icon && /*#__PURE__*/external_react_default.a.createElement(StyledItemIcon, null, icon), /*#__PURE__*/external_react_default.a.createElement(StyledTitleAndDescriptionWrapper, {
         $truncate: truncate
       }, /*#__PURE__*/external_react_default.a.createElement(StyledLabel, {
         $truncate: truncate,
         "data-test": "label"
-      }, this.renderLabel(), openInNewContext && /*#__PURE__*/external_react_default.a.createElement(StyledExternal, {
-        screenReaderText: Object(i18n_["_"])('Open externally'),
-        size: 0.8
-      })), descriptionBottom && /*#__PURE__*/external_react_default.a.createElement(StyledItemDescriptionBottom, {
+      }, this.renderLabel(), openInNewContext && /*#__PURE__*/external_react_default.a.createElement(icons_External, null)), descriptionBottom && /*#__PURE__*/external_react_default.a.createElement(StyledItemDescriptionBottom, {
         "data-test": "description"
       }, description)), selectablePosition === 'right' && selectableCheckmark));
     }
@@ -896,11 +893,15 @@ Item_defineProperty(Item_Item, "propTypes", Item_propTypes);
 
 Item_defineProperty(Item_Item, "defaultProps", defaultProps);
 
-var ItemWithTheme = Object(themes_["withSplunkTheme"])(Item_Item);
+Item_defineProperty(Item_Item, "as", void 0);
+
+var ItemWithThemeBase = Object(themes_["withSplunkTheme"])(Item_Item);
+var ItemWithTheme = ItemWithThemeBase;
 ItemWithTheme.propTypes = Item_Item.propTypes;
+ItemWithTheme.as = 'Item';
 /* harmony default export */ var Menu_Item = (ItemWithTheme);
 // EXTERNAL MODULE: external "@splunk/react-ui/Scroll"
-var Scroll_ = __webpack_require__(90);
+var Scroll_ = __webpack_require__(87);
 var Scroll_default = /*#__PURE__*/__webpack_require__.n(Scroll_);
 
 // CONCATENATED MODULE: ./src/Menu/MenuStyles.ts
@@ -1028,44 +1029,45 @@ function Menu(_ref) {
     }
   };
 
+  var itemOnFocus = Object(external_react_["useCallback"])(function (e, data) {
+    var itemKey = data.itemKey;
+
+    if (itemKey != null) {
+      focusedItemKeyRef.current = itemKey;
+    }
+  }, []);
   var childrenCleaned = external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]).reduce(function (acc, item, index, original) {
     /* Filter out initial Dividers
      * Requires reduce() over filter() because a Heading may have been
      * before the Divider.
      */
-    if (item.type === Menu_Divider && item.type.filterFirst && acc.length === 0) {
+    if (item.type.as === 'Divider' && acc.length === 0) {
       return acc;
     } // Filter out consecutive Dividers and Headings
+    // If Divider is next to Heading then it will remove both Heading and Divider unless Heading has title prop set to it
 
 
-    if ((item.type === Menu_Divider || item.type === Menu_Heading) && item.type.filterConsecutive && !item.props.title && original.length > index + 1) {
+    if ((item.type.as === 'Heading' || item.type.as === 'Divider') && !item.props.title && item.type.filterConsecutive && original.length > index + 1) {
       var consec = original[index + 1];
 
-      if ((consec.type === Menu_Divider || consec.type === Menu_Heading) && consec.type.filterConsecutive) {
+      if (consec.type.as === 'Heading' || consec.type.as === 'Divider') {
         return acc;
       }
     } // Filter out last Dividers and Headings
 
 
-    if ((item.type === Menu_Divider || item.type === Menu_Heading) && item.type.filterLast && index === original.length - 1) {
+    if ((item.type.as === 'Divider' || item.type.as === 'Heading') && index === original.length - 1) {
       return acc;
-    } // the typeof check prevents props from being applied to HTML elements
+    } // the filterConsecutive check filters out Headings and Dividers whether styled or not
+    // the typeof check prevents props from being applied to HTML elements
     // such as the zero-height scroll bottom div in <ResultsMenu>
 
 
-    if (!(item.type === Menu_Divider || item.type === Menu_Heading) && typeof item.type !== 'string') {
+    if (!(item.type.as === 'Divider' || item.type.as === 'Heading') && typeof item.type !== 'string') {
       var _ref2 = /*#__PURE__*/external_react_default.a.createRef();
 
       itemRefs.push(_ref2);
 
-      var itemOnFocus = function itemOnFocus(e, data) {
-        var itemKey = data.itemKey;
-
-        if (itemKey != null) {
-          focusedItemKeyRef.current = itemKey;
-        }
-      };
-
       if (firstEnabledItemKey == null && (!('disabled' in item.props) || !item.props.disabled)) {
         firstEnabledItemKey = itemKeyCounter;
       }
@@ -1141,81 +1143,38 @@ module.exports = require("react");
 
 /***/ }),
 
-/***/ 23:
+/***/ 21:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Popover");
 
 /***/ }),
 
-/***/ 25:
+/***/ 23:
 /***/ (function(module, exports) {
 
 module.exports = require("lodash/isString");
 
 /***/ }),
 
-/***/ 3:
+/***/ 29:
 /***/ (function(module, exports) {
 
-module.exports = require("styled-components");
+module.exports = require("@splunk/ui-utils/focus");
 
 /***/ }),
 
-/***/ 35:
+/***/ 3:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/ui-utils/focus");
+module.exports = require("styled-components");
 
 /***/ }),
 
-/***/ 37:
-/***/ (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__(44);
-/* 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);
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-
-
-
-
-
-function Prisma24(_ref) {
-  var otherProps = _extends({}, _ref);
-
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVG__WEBPACK_IMPORTED_MODULE_3__[/* default */ "a"], _extends({
-    viewBox: "0 0 24 24"
-  }, otherProps), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("path", {
-    d: "M14.7861 11.9999L8.48587 5.69972C8.09534 5.3092 8.09534 4.67603 8.48587 4.28551C8.87639 3.89499 9.50956 3.89499 9.90008 4.28551L16.5538 10.9393C17.1396 11.525 17.1396 12.4748 16.5538 13.0606L9.90142 19.713C9.5109 20.1035 8.87773 20.1035 8.48721 19.713C8.09669 19.3224 8.09669 18.6893 8.48721 18.2988L14.7861 11.9999Z",
-    fill: "currentColor"
-  }));
-}
-
-function Prisma16(_ref2) {
-  var otherProps = _extends({}, _ref2);
-
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVG__WEBPACK_IMPORTED_MODULE_3__[/* default */ "a"], _extends({
-    viewBox: "0 0 16 16"
-  }, otherProps), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("path", {
-    d: "M11.7109 7.9976L5.71017 13.9983L4.29597 12.5841L8.88914 7.99095L4.34482 3.40363L5.76567 1.99609L11.7109 7.9976Z",
-    fill: "currentColor"
-  }));
-}
+/***/ 35:
+/***/ (function(module, exports) {
 
-function ChevronRight(props) {
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ThemedIcon__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"], _extends({
-    Enterprise: _splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1___default.a,
-    Prisma16: Prisma16,
-    Prisma24: Prisma24
-  }, props));
-}
+module.exports = require("@splunk/react-icons/enterprise/ChevronRight");
 
 /***/ }),
 
@@ -1226,10 +1185,10 @@ module.exports = require("@splunk/ui-utils/i18n");
 
 /***/ }),
 
-/***/ 44:
+/***/ 45:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-icons/ChevronRight");
+module.exports = require("@splunk/react-ui/useForceUpdate");
 
 /***/ }),
 
@@ -1240,13 +1199,6 @@ module.exports = require("lodash/omit");
 
 /***/ }),
 
-/***/ 54:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/themes/useSplunkTheme");
-
-/***/ }),
-
 /***/ 57:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
@@ -1286,238 +1238,95 @@ function getPrevListItem(refs, currentIndex, prevIndex) {
 
 /***/ }),
 
-/***/ 6:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SVG; });
-/* 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 styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3);
-/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-
+/***/ 58:
+/***/ (function(module, exports) {
 
-var Styled = styled_components__WEBPACK_IMPORTED_MODULE_1___default.a.svg.withConfig({
-  displayName: "SVG__Styled",
-  componentId: "sc-1bz0ryh-0"
-})(["flex:0 0 auto;"]);
-function SVG(props) {
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Styled, _extends({
-    xmlns: "http://www.w3.org/2000/svg"
-  }, props));
-}
+module.exports = require("@splunk/react-ui/Switch");
 
 /***/ }),
 
-/***/ 60:
+/***/ 63:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-icons/External");
+module.exports = require("@splunk/react-icons/enterprise/External");
 
 /***/ }),
 
-/***/ 65:
+/***/ 68:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-icons/Check");
+module.exports = require("@splunk/themes/useSplunkTheme");
 
 /***/ }),
 
 /***/ 7:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return Icon; });
-/* 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 prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(1);
-/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _splunk_themes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(0);
-/* harmony import */ var _splunk_themes__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_splunk_themes__WEBPACK_IMPORTED_MODULE_2__);
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-
+/***/ (function(module, exports) {
 
+module.exports = require("@splunk/ui-utils/keyboard");
 
-var inlineStyles = {
-  display: 'inline-block',
-  flex: '0 0 auto',
-  overflow: 'visible',
-  verticalAlign: 'middle'
-};
-var blockStyles = {
-  display: 'block',
-  flex: '0 0 auto',
-  margin: '0 auto',
-  overflow: 'visible'
-};
-var propTypes = {
-  Enterprise: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.func,
-  enterpriseSize: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.number, prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.string]),
-  enterpriseWidth: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.number, prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.string]),
-  enterpriseHeight: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.number, prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.string]),
-  Prisma24: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.func.isRequired,
-  Prisma20: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.func,
-  Prisma16: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.func,
-  prismaSize: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.oneOf(['medium', 'small']),
-  inline: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.bool,
-  screenReaderText: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.string
-};
-var defaultProps = {
-  inline: true,
-  prismaSize: 'medium'
-};
-function Icon(_ref) {
-  var Enterprise = _ref.Enterprise,
-      Prisma24 = _ref.Prisma24,
-      Prisma20 = _ref.Prisma20,
-      Prisma16 = _ref.Prisma16,
-      prismaSize = _ref.prismaSize,
-      inline = _ref.inline,
-      enterpriseSize = _ref.enterpriseSize,
-      enterpriseWidth = _ref.enterpriseWidth,
-      enterpriseHeight = _ref.enterpriseHeight,
-      screenReaderText = _ref.screenReaderText,
-      otherProps = _objectWithoutProperties(_ref, ["Enterprise", "Prisma24", "Prisma20", "Prisma16", "prismaSize", "inline", "enterpriseSize", "enterpriseWidth", "enterpriseHeight", "screenReaderText"]);
-
-  var _useSplunkTheme = Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_2__["useSplunkTheme"])(),
-      family = _useSplunkTheme.family,
-      density = _useSplunkTheme.density; // Enterprise - all variants
-
-
-  if (family === 'enterprise') {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Enterprise, _extends({
-      size: enterpriseSize,
-      width: enterpriseWidth,
-      height: enterpriseHeight,
-      screenReaderText: screenReaderText || null,
-      hideDefaultTooltip: true,
-      inline: inline
-    }, otherProps));
-  }
+/***/ }),
 
-  var prismaProps = _objectSpread({
-    'aria-label': screenReaderText,
-    style: inline ? inlineStyles : blockStyles
-  }, otherProps); // Prisma - small+compact, small+comfortable
+/***/ 76:
+/***/ (function(module, exports) {
 
+module.exports = require("@splunk/react-ui/Heading");
 
-  if (prismaSize === 'small') {
-    var SVG = Prisma16 || Prisma24;
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SVG, _extends({
-      width: "16",
-      height: "16"
-    }, prismaProps));
-  } // Prisma - medium+compact
+/***/ }),
 
+/***/ 86:
+/***/ (function(module, exports) {
 
-  if (density === 'compact') {
-    var _SVG = Prisma20 || Prisma24;
+module.exports = require("@splunk/react-icons/Checkmark");
 
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVG, _extends({
-      width: "20",
-      height: "20"
-    }, prismaProps));
-  } // Prisma - medium+comfortable
+/***/ }),
 
+/***/ 87:
+/***/ (function(module, exports) {
 
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Prisma24, _extends({
-    width: "24",
-    height: "24"
-  }, prismaProps));
-}
-Icon.propTypes = propTypes;
-Icon.defaultProps = defaultProps;
+module.exports = require("@splunk/react-ui/Scroll");
 
 /***/ }),
 
-/***/ 75:
+/***/ 89:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return Check; });
-/* 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_Check__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(65);
-/* harmony import */ var _splunk_react_icons_Check__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_Check__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);
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-
-
-
-
-
-function Prisma24(_ref) {
-  var otherProps = _extends({}, _ref);
-
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVG__WEBPACK_IMPORTED_MODULE_3__[/* default */ "a"], _extends({
-    viewBox: "0 0 24 24"
-  }, otherProps), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("path", {
-    d: "M20.7071 5.59294C21.0977 5.98347 21.0977 6.61663 20.7071 7.00716L10.1447 17.5695C9.55896 18.1553 8.60922 18.1553 8.02343 17.5695L3.29289 12.839C2.90237 12.4485 2.90237 11.8153 3.29289 11.4248C3.68342 11.0343 4.31658 11.0343 4.70711 11.4248L9.08409 15.8018L19.2929 5.59294C19.6835 5.20242 20.3166 5.20242 20.7071 5.59294Z",
-    fill: "currentColor"
-  }));
-}
-
-function Prisma16(_ref2) {
-  var otherProps = _extends({}, _ref2);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return scrollIntoViewIfNeeded; });
+// A utility that attempts to move an element into view by scrolling it's derived parent.
+var scrollIntoViewIfNeeded = function scrollIntoViewIfNeeded(el) {
+  if (!el) {
+    return;
+  }
 
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVG__WEBPACK_IMPORTED_MODULE_3__[/* default */ "a"], _extends({
-    viewBox: "0 0 16 16"
-  }, otherProps), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("path", {
-    d: "M13.999 4.75712L6.17736 12.5786L1.99561 8.39691L3.40981 6.98269L6.17737 9.75021L12.5848 3.3429L13.999 4.75712Z",
-    fill: "currentColor"
-  }));
-}
+  var parentEl = el.offsetParent;
 
-function Check(props) {
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ThemedIcon__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"], _extends({
-    Enterprise: _splunk_react_icons_Check__WEBPACK_IMPORTED_MODULE_1___default.a,
-    Prisma16: Prisma16,
-    Prisma24: Prisma24
-  }, props));
-}
+  if (!parentEl) {
+    return;
+  } // Below the bottom of the container.
 
-/***/ }),
 
-/***/ 77:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/Heading");
-
-/***/ }),
+  if (parentEl.scrollTop + parentEl.clientHeight < el.offsetTop + el.clientHeight) {
+    parentEl.scrollTop = el.offsetTop + el.clientHeight - parentEl.clientHeight; // Above the top of the container.
+  } else if (parentEl.scrollTop > el.offsetTop) {
+    parentEl.scrollTop = el.offsetTop;
+  }
+};
 
-/***/ 9:
-/***/ (function(module, exports) {
 
-module.exports = require("@splunk/ui-utils/keyboard");
 
 /***/ }),
 
-/***/ 90:
+/***/ 94:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Scroll");
+module.exports = require("@splunk/react-icons/ArrowSquareTopRight");
 
 /***/ }),
 
-/***/ 96:
+/***/ 95:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Switch");
+module.exports = require("@splunk/react-icons/enterprise/Check");
 
 /***/ })