@splunk/react-ui 4.18.0 → 4.20.0

package/Select.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 230);
+/******/ 	return __webpack_require__(__webpack_require__.s = 233);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -101,24 +101,31 @@ module.exports = require("prop-types");
 
 /***/ }),
 
-/***/ 10:
+/***/ 105:
 /***/ (function(module, exports) {
 
-module.exports = require("lodash/has");
+module.exports = require("lodash/forEachRight");
 
 /***/ }),
 
-/***/ 102:
+/***/ 106:
 /***/ (function(module, exports) {
 
-module.exports = require("lodash/forEachRight");
+module.exports = require("lodash/uniq");
 
 /***/ }),
 
-/***/ 103:
+/***/ 11:
 /***/ (function(module, exports) {
 
-module.exports = require("lodash/uniq");
+module.exports = require("lodash/has");
+
+/***/ }),
+
+/***/ 12:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/react-ui/Clickable");
 
 /***/ }),
 
@@ -149,7 +156,7 @@ module.exports = require("@splunk/react-ui/Button");
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return getWindow; });
 /* unused harmony export ssrWindow */
-/* harmony import */ var _ssrDocument__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(27);
+/* harmony import */ var _ssrDocument__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(28);
 /* eslint-disable @typescript-eslint/no-empty-function */
 
 var ssrWindow = {
@@ -233,7 +240,7 @@ module.exports = require("@splunk/react-ui/Dropdown");
 
 /***/ }),
 
-/***/ 230:
+/***/ 233:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -255,17 +262,17 @@ var external_prop_types_ = __webpack_require__(1);
 var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
 
 // EXTERNAL MODULE: external "lodash/has"
-var has_ = __webpack_require__(10);
+var has_ = __webpack_require__(11);
 var has_default = /*#__PURE__*/__webpack_require__.n(has_);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
 var i18n_ = __webpack_require__(4);
 
-// EXTERNAL MODULE: ./src/Select/SelectBase.tsx + 3 modules
-var SelectBase = __webpack_require__(60);
+// EXTERNAL MODULE: ./src/Select/SelectBase.tsx + 5 modules
+var SelectBase = __webpack_require__(62);
 
 // EXTERNAL MODULE: ./src/Select/OptionBase.tsx
-var OptionBase = __webpack_require__(36);
+var OptionBase = __webpack_require__(30);
 
 // CONCATENATED MODULE: ./src/Select/Option.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); }
@@ -579,7 +586,206 @@ Select_defineProperty(Select_Select, "Divider", SelectBase["a" /* Divider */]);
 
 /***/ }),
 
-/***/ 27:
+/***/ 25:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return StyledClickable; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return StyledInnerWrapper; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return StyledItemDescriptionBottom; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "d", function() { return StyledItemDescriptionRight; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "e", function() { return StyledItemIcon; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "f", function() { return StyledItemSelectedIcon; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "g", function() { return StyledLabel; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "h", function() { return StyledMatch; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "i", function() { return StyledSubmenu; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "j", function() { return StyledSwitch; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "k", function() { return StyledTitleAndDescriptionWrapper; });
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(3);
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _splunk_react_ui_Clickable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(12);
+/* harmony import */ var _splunk_react_ui_Clickable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_ui_Clickable__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _splunk_react_ui_Switch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(39);
+/* harmony import */ var _splunk_react_ui_Switch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_ui_Switch__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _splunk_themes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(0);
+/* harmony import */ var _splunk_themes__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__);
+
+
+
+
+var itemDescription = Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["color:", ";font-size:", ";line-height:", ";overflow:inherit;white-space:inherit;text-overflow:inherit;"], Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorDefault,
+  enterprise: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].textGray
+}), _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].fontSizeSmall, Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: '16px'
+}));
+var StyledItemDescriptionBottom = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.span.withConfig({
+  displayName: "ItemStyles__StyledItemDescriptionBottom",
+  componentId: "sc-4kc053-0"
+})(["", ";display:block;"], itemDescription);
+var StyledItemDescriptionRight = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.span.withConfig({
+  displayName: "ItemStyles__StyledItemDescriptionRight",
+  componentId: "sc-4kc053-1"
+})(["", ";float:right;padding-left:", ";max-width:50%;text-align:right;box-sizing:border-box;"], itemDescription, _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].spacing);
+var StyledItemSelectedIcon = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.div.withConfig({
+  displayName: "ItemStyles__StyledItemSelectedIcon",
+  componentId: "sc-4kc053-2"
+})(["position:absolute;", " color:", ";"], Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["right:16px;"]),
+  enterprise: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["top:5px;right:3px;left:8px;"])
+}), Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorActive,
+  enterprise: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].accentColorL10
+}));
+var StyledItemIcon = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.span.withConfig({
+  displayName: "ItemStyles__StyledItemIcon",
+  componentId: "sc-4kc053-3"
+})(["flex:0 0 auto;padding-right:", ";min-width:10px;display:inline-block;text-align:center;vertical-align:", ";", ""], Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: '8px',
+  enterprise: '3px'
+}), Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: 'initial',
+  enterprise: 'middle'
+}), Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["color:", ";display:inline-flex;align-items:center;min-width:20px;min-height:20px;& > svg{width:20px;height:20px;}"], _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorMuted),
+  enterprise: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["transform:translateY(-1px);"])
+}));
+var StyledClickable = styled_components__WEBPACK_IMPORTED_MODULE_0___default()(_splunk_react_ui_Clickable__WEBPACK_IMPORTED_MODULE_1___default.a).withConfig({
+  displayName: "ItemStyles__StyledClickable",
+  componentId: "sc-4kc053-4"
+})(["display:block;position:relative;cursor:pointer;color:", ";word-wrap:break-word;max-width:100%;width:100%;padding:", ";", " ", " ", " &:not([disabled]){&:hover{background:", ";", "}&:focus{outline:0;box-shadow:", ";", "}", " ", "}&[disabled]{color:", ";cursor:not-allowed;", ",", "{color:inherit;}", "{cursor:not-allowed;color:", ";}", "}", ""], Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorActive,
+  enterprise: {
+    dark: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].gray96,
+    light: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].gray22
+  }
+}), Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: {
+    comfortable: '10px 16px',
+    compact: '6px 16px'
+  },
+  enterprise: '6px 10px'
+}), function (_ref) {
+  var $isSelectable = _ref.$isSelectable,
+      $selectableAppearance = _ref.$selectableAppearance;
+  return $isSelectable && Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+    prisma: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["padding-right:44px;", ""], function () {
+      return $selectableAppearance === 'checkbox' && 'padding-left: 42px;';
+    }),
+    enterprise: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["padding-right:10px;padding-left:", ";"], function () {
+      return $selectableAppearance === 'checkbox' ? '32px' : '28px';
+    })
+  });
+}, function (_ref2) {
+  var $active = _ref2.$active,
+      $preventFocus = _ref2.$preventFocus;
+  return $active && !$preventFocus && Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["box-shadow:", ";"], _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].focusShadowInset);
+}, function (_ref3) {
+  var $active = _ref3.$active;
+  return $active && Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["background:", ";font-weight:", ";"], Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+    enterprise: {
+      light: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].gray92,
+      dark: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].gray22
+    },
+    prisma: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].neutral100
+  }), _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].fontWeightBold);
+}, Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].interactiveColorOverlayHover,
+  enterprise: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].backgroundColorHover
+}), function (_ref4) {
+  var $selected = _ref4.$selected;
+  return $selected && Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+    prisma: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["background:", ";"], _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["mixins"].overlayColors(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].interactiveColorOverlaySelected, _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].interactiveColorOverlayHover))
+  });
+}, _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].focusShadowInset, Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["background:", ";"], _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].interactiveColorOverlayHover)
+}), Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["&:active{background:", ";}"], _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].interactiveColorOverlayActive)
+}), function (_ref5) {
+  var $selected = _ref5.$selected;
+  return $selected && Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+    prisma: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["background:", ";&:active{background:", ";}"], _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].interactiveColorOverlaySelected, _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["mixins"].overlayColors(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].interactiveColorOverlaySelected, _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].interactiveColorOverlayActive))
+  });
+}, Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  enterprise: {
+    light: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].gray45,
+    dark: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorDisabled
+  },
+  prisma: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorDisabled
+}),
+/* sc-sel */
+StyledItemDescriptionBottom,
+/* sc-sel */
+StyledItemDescriptionRight,
+/* sc-sel */
+StyledItemSelectedIcon, Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorDisabled,
+  enterprise: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].gray80
+}), Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["& > * > ", "{color:", ";}"],
+  /* sc-sel */
+  StyledItemIcon, _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorDisabled)
+}), function (_ref6) {
+  var $selected = _ref6.$selected;
+  return $selected && Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+    prisma: Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["", "{color:", ";}"],
+    /* sc-sel */
+    StyledItemIcon, _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorActive)
+  });
+});
+var StyledSwitch = styled_components__WEBPACK_IMPORTED_MODULE_0___default()(_splunk_react_ui_Switch__WEBPACK_IMPORTED_MODULE_2___default.a).withConfig({
+  displayName: "ItemStyles__StyledSwitch",
+  componentId: "sc-4kc053-5"
+})(["position:absolute;left:", ";top:", ";"], Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: '16px',
+  enterprise: '8px'
+}), Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: '0px',
+  enterprise: {
+    comfortable: '-1px',
+    compact: '2px'
+  }
+}));
+var StyledInnerWrapper = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.span.withConfig({
+  displayName: "ItemStyles__StyledInnerWrapper",
+  componentId: "sc-4kc053-6"
+})(["display:flex;align-items:flex-start;"]);
+var StyledTitleAndDescriptionWrapper = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.span.withConfig({
+  displayName: "ItemStyles__StyledTitleAndDescriptionWrapper",
+  componentId: "sc-4kc053-7"
+})(["max-width:100%;width:100%;align-self:center;word-break:break-word;white-space:normal;", ""], function (_ref7) {
+  var $truncate = _ref7.$truncate;
+  return $truncate && Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"]);
+});
+var StyledLabel = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.div.withConfig({
+  displayName: "ItemStyles__StyledLabel",
+  componentId: "sc-4kc053-8"
+})(["overflow:inherit;white-space:inherit;text-overflow:inherit;max-width:100%;min-height:20px;", ""], function (_ref8) {
+  var $truncate = _ref8.$truncate;
+  return $truncate && Object(styled_components__WEBPACK_IMPORTED_MODULE_0__["css"])(["display:block;clear:both;"]);
+});
+var StyledMatch = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.span.withConfig({
+  displayName: "ItemStyles__StyledMatch",
+  componentId: "sc-4kc053-9"
+})(["border-bottom:1px solid ", ";"], Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].contentColorActive,
+  enterprise: {
+    dark: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].gray96,
+    light: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].gray45
+  }
+}));
+var StyledSubmenu = styled_components__WEBPACK_IMPORTED_MODULE_0___default.a.span.withConfig({
+  displayName: "ItemStyles__StyledSubmenu",
+  componentId: "sc-4kc053-10"
+})(["float:right;padding-left:", ";color:", ";"], _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].spacingSmall, Object(_splunk_themes__WEBPACK_IMPORTED_MODULE_3__["pick"])({
+  prisma: 'inherit',
+  enterprise: _splunk_themes__WEBPACK_IMPORTED_MODULE_3__["variables"].textGray
+}));
+
+
+/***/ }),
+
+/***/ 28:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -658,20 +864,6 @@ module.exports = require("styled-components");
 /***/ }),
 
 /***/ 30:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/Text");
-
-/***/ }),
-
-/***/ 33:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/ui-utils/filter");
-
-/***/ }),
-
-/***/ 36:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -849,20 +1041,34 @@ _defineProperty(Option, "type", _splunk_react_ui_Menu__WEBPACK_IMPORTED_MODULE_2
 
 /***/ }),
 
-/***/ 38:
+/***/ 32:
 /***/ (function(module, exports) {
 
-module.exports = require("lodash/isUndefined");
+module.exports = require("@splunk/react-ui/Text");
 
 /***/ }),
 
-/***/ 39:
+/***/ 35:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/ui-utils/filter");
+
+/***/ }),
+
+/***/ 37:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Link");
 
 /***/ }),
 
+/***/ 39:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/react-ui/Switch");
+
+/***/ }),
+
 /***/ 4:
 /***/ (function(module, exports) {
 
@@ -870,21 +1076,35 @@ module.exports = require("@splunk/ui-utils/i18n");
 
 /***/ }),
 
-/***/ 41:
+/***/ 40:
 /***/ (function(module, exports) {
 
-module.exports = require("lodash/pick");
+module.exports = require("lodash/memoize");
+
+/***/ }),
+
+/***/ 42:
+/***/ (function(module, exports) {
+
+module.exports = require("lodash/isUndefined");
 
 /***/ }),
 
 /***/ 44:
 /***/ (function(module, exports) {
 
+module.exports = require("lodash/pick");
+
+/***/ }),
+
+/***/ 47:
+/***/ (function(module, exports) {
+
 module.exports = require("@splunk/react-ui/ResultsMenu");
 
 /***/ }),
 
-/***/ 46:
+/***/ 49:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/Magnifier");
@@ -898,35 +1118,35 @@ module.exports = require("lodash/omit");
 
 /***/ }),
 
-/***/ 51:
+/***/ 54:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/enterprise/Search");
 
 /***/ }),
 
-/***/ 52:
+/***/ 55:
 /***/ (function(module, exports) {
 
 module.exports = require("lodash/find");
 
 /***/ }),
 
-/***/ 53:
+/***/ 56:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/CaretSmallDown");
 
 /***/ }),
 
-/***/ 54:
+/***/ 57:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/enterprise/Caret");
 
 /***/ }),
 
-/***/ 56:
+/***/ 59:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -979,14 +1199,14 @@ var fuzzyMatch = function fuzzyMatch(options, matchChar) {
 
 /***/ }),
 
-/***/ 59:
+/***/ 61:
 /***/ (function(module, exports) {
 
 module.exports = require("lodash/without");
 
 /***/ }),
 
-/***/ 60:
+/***/ 62:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -1007,19 +1227,19 @@ var external_prop_types_ = __webpack_require__(1);
 var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
 
 // EXTERNAL MODULE: external "lodash/castArray"
-var castArray_ = __webpack_require__(65);
+var castArray_ = __webpack_require__(67);
 var castArray_default = /*#__PURE__*/__webpack_require__.n(castArray_);
 
 // EXTERNAL MODULE: external "lodash/find"
-var find_ = __webpack_require__(52);
+var find_ = __webpack_require__(55);
 var find_default = /*#__PURE__*/__webpack_require__.n(find_);
 
 // EXTERNAL MODULE: external "lodash/forEachRight"
-var forEachRight_ = __webpack_require__(102);
+var forEachRight_ = __webpack_require__(105);
 var forEachRight_default = /*#__PURE__*/__webpack_require__.n(forEachRight_);
 
 // EXTERNAL MODULE: external "lodash/has"
-var has_ = __webpack_require__(10);
+var has_ = __webpack_require__(11);
 var has_default = /*#__PURE__*/__webpack_require__.n(has_);
 
 // EXTERNAL MODULE: external "lodash/includes"
@@ -1027,27 +1247,31 @@ var includes_ = __webpack_require__(15);
 var includes_default = /*#__PURE__*/__webpack_require__.n(includes_);
 
 // EXTERNAL MODULE: external "lodash/isUndefined"
-var isUndefined_ = __webpack_require__(38);
+var isUndefined_ = __webpack_require__(42);
 var isUndefined_default = /*#__PURE__*/__webpack_require__.n(isUndefined_);
 
 // EXTERNAL MODULE: external "lodash/keys"
 var keys_ = __webpack_require__(9);
 var keys_default = /*#__PURE__*/__webpack_require__.n(keys_);
 
+// EXTERNAL MODULE: external "lodash/memoize"
+var memoize_ = __webpack_require__(40);
+var memoize_default = /*#__PURE__*/__webpack_require__.n(memoize_);
+
 // EXTERNAL MODULE: external "lodash/omit"
 var omit_ = __webpack_require__(5);
 var omit_default = /*#__PURE__*/__webpack_require__.n(omit_);
 
 // EXTERNAL MODULE: external "lodash/pick"
-var pick_ = __webpack_require__(41);
+var pick_ = __webpack_require__(44);
 var pick_default = /*#__PURE__*/__webpack_require__.n(pick_);
 
 // EXTERNAL MODULE: external "lodash/uniq"
-var uniq_ = __webpack_require__(103);
+var uniq_ = __webpack_require__(106);
 var uniq_default = /*#__PURE__*/__webpack_require__.n(uniq_);
 
 // EXTERNAL MODULE: external "lodash/without"
-var without_ = __webpack_require__(59);
+var without_ = __webpack_require__(61);
 var without_default = /*#__PURE__*/__webpack_require__.n(without_);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/id"
@@ -1064,29 +1288,29 @@ var Dropdown_default = /*#__PURE__*/__webpack_require__.n(Dropdown_);
 var keyboard_ = __webpack_require__(7);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/filter"
-var filter_ = __webpack_require__(33);
+var filter_ = __webpack_require__(35);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Link"
-var Link_ = __webpack_require__(39);
+var Link_ = __webpack_require__(37);
 var Link_default = /*#__PURE__*/__webpack_require__.n(Link_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ResultsMenu"
-var ResultsMenu_ = __webpack_require__(44);
+var ResultsMenu_ = __webpack_require__(47);
 var ResultsMenu_default = /*#__PURE__*/__webpack_require__.n(ResultsMenu_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Text"
-var Text_ = __webpack_require__(30);
+var Text_ = __webpack_require__(32);
 var Text_default = /*#__PURE__*/__webpack_require__.n(Text_);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
 var i18n_ = __webpack_require__(4);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/CaretSmallDown"
-var CaretSmallDown_ = __webpack_require__(53);
+var CaretSmallDown_ = __webpack_require__(56);
 var CaretSmallDown_default = /*#__PURE__*/__webpack_require__.n(CaretSmallDown_);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Caret"
-var Caret_ = __webpack_require__(54);
+var Caret_ = __webpack_require__(57);
 var Caret_default = /*#__PURE__*/__webpack_require__.n(Caret_);
 
 // EXTERNAL MODULE: external "@splunk/themes"
@@ -1111,15 +1335,12 @@ var CaretSmallDown_CaretSmallDownIcon = function CaretSmallDownIcon() {
 };
 
 /* harmony default export */ var CaretSmallDown = (CaretSmallDown_CaretSmallDownIcon);
-// EXTERNAL MODULE: ./src/Select/OptionBase.tsx
-var OptionBase = __webpack_require__(36);
-
 // EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Search"
-var Search_ = __webpack_require__(51);
+var Search_ = __webpack_require__(54);
 var Search_default = /*#__PURE__*/__webpack_require__.n(Search_);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/Magnifier"
-var Magnifier_ = __webpack_require__(46);
+var Magnifier_ = __webpack_require__(49);
 var Magnifier_default = /*#__PURE__*/__webpack_require__.n(Magnifier_);
 
 // CONCATENATED MODULE: ./src/Select/icons/Search.tsx
@@ -1152,10 +1373,90 @@ var Search_Search = function Search() {
 };
 
 /* harmony default export */ var icons_Search = (Search_Search);
+// EXTERNAL MODULE: ./src/Select/OptionBase.tsx
+var OptionBase = __webpack_require__(30);
+
 // EXTERNAL MODULE: external "styled-components"
 var external_styled_components_ = __webpack_require__(3);
 var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
 
+// EXTERNAL MODULE: ./src/Menu/ItemStyles.ts
+var ItemStyles = __webpack_require__(25);
+
+// CONCATENATED MODULE: ./src/Select/SelectAllOptionStyles.ts
+
+
+
+
+var StyledSelectAllLabel = external_styled_components_default()(ItemStyles["g" /* StyledLabel */]).withConfig({
+  displayName: "SelectAllOptionStyles__StyledSelectAllLabel",
+  componentId: "y6bn08-0"
+})(["font-weight:", ";"], themes_["variables"].fontWeightBold);
+var StyledSelectAllOption = external_styled_components_default()(OptionBase["a" /* default */]).withConfig({
+  displayName: "SelectAllOptionStyles__StyledSelectAllOption",
+  componentId: "y6bn08-1"
+})(["padding-inline-start:", ";box-shadow:none;"], Object(themes_["pick"])({
+  prisma: '42px;',
+  enterprise: '32px;'
+}));
+
+// CONCATENATED MODULE: ./src/Select/SelectAllOption.tsx
+
+
+
+
+var propTypes = {
+  active: external_prop_types_default.a.bool,
+  elementRef: external_prop_types_default.a.oneOfType([external_prop_types_default.a.func, external_prop_types_default.a.object]),
+  id: external_prop_types_default.a.string,
+  onClick: external_prop_types_default.a.func,
+  selectAllLabel: external_prop_types_default.a.string,
+  totalCount: external_prop_types_default.a.number,
+  changedToggle: external_prop_types_default.a.bool,
+  selected: external_prop_types_default.a.oneOf([false, true, 'some'])
+};
+var SelectAllOption = /*#__PURE__*/external_react_default.a.forwardRef(function (_ref, ref) {
+  var active = _ref.active,
+      id = _ref.id,
+      onClick = _ref.onClick,
+      selectAllLabel = _ref.selectAllLabel,
+      totalCount = _ref.totalCount,
+      changedToggle = _ref.changedToggle,
+      selected = _ref.selected;
+  // When toggle is changed the total count is not displayed anymore so the count is now shown in the Select All menu item
+  var totalCountDisplay = changedToggle ? " (".concat(totalCount === null || totalCount === void 0 ? void 0 : totalCount.toString(), ")") : '';
+  return /*#__PURE__*/external_react_default.a.createElement(StyledSelectAllOption, {
+    label: selectAllLabel,
+    value: "selectAll",
+    key: "selectAll",
+    onClick: onClick,
+    "data-test": "select-all",
+    "aria-keyshortcuts": "Control+A",
+    id: id,
+    active: active,
+    ref: ref,
+    tabIndex: -1
+  }, /*#__PURE__*/external_react_default.a.createElement(ItemStyles["j" /* StyledSwitch */], {
+    interactive: false,
+    selected: selected === 'some' && 'some' || selected,
+    key: "main-checkbox",
+    value: "main-checkbox",
+    appearance: "checkbox",
+    "aria-label": !selected && Object(i18n_["_"])('No options selected') || selected === 'some' && Object(i18n_["_"])('Some options selected') || Object(i18n_["_"])('All options selected'),
+    "data-test": "select-all-switch",
+    selectedLabel: selected === true ? Object(i18n_["_"])('All options selected') : Object(i18n_["_"])('Option selected'),
+    unselectedLabel: selected === true ? Object(i18n_["_"])('No options selected') : Object(i18n_["_"])('Option unselected'),
+    someSelectedLabel: Object(i18n_["_"])('Some options selected')
+  }), /*#__PURE__*/external_react_default.a.createElement(ItemStyles["d" /* StyledItemDescriptionRight */], {
+    "data-test": "description"
+  }, "".concat(totalCountDisplay, " Ctrl-a")), /*#__PURE__*/external_react_default.a.createElement(ItemStyles["b" /* StyledInnerWrapper */], null, /*#__PURE__*/external_react_default.a.createElement(ItemStyles["k" /* StyledTitleAndDescriptionWrapper */], {
+    $truncate: false
+  }, /*#__PURE__*/external_react_default.a.createElement(StyledSelectAllLabel, {
+    $truncate: false
+  }, selectAllLabel))));
+});
+SelectAllOption.propTypes = propTypes;
+/* harmony default export */ var Select_SelectAllOption = (SelectAllOption);
 // EXTERNAL MODULE: external "@splunk/react-ui/Button"
 var Button_ = __webpack_require__(17);
 var Button_default = /*#__PURE__*/__webpack_require__.n(Button_);
@@ -1213,7 +1514,7 @@ var StyledCount = external_styled_components_default.a.span.withConfig({
 var StyledControlsLink = external_styled_components_default()(Link_default.a).withConfig({
   displayName: "SelectBaseStyles__StyledControlsLink",
   componentId: "sc-16cj7sk-6"
-})(["", ";"], function (_ref3) {
+})(["margin-right:20px;", ";"], function (_ref3) {
   var $disabled = _ref3.$disabled;
   return $disabled && Object(external_styled_components_["css"])(["color:", ";"], themes_["variables"].contentColorDisabled);
 });
@@ -1235,7 +1536,7 @@ var StyledToggleAllControls = external_styled_components_default.a.div.withConfi
 }));
 
 // EXTERNAL MODULE: ./src/utils/fuzzyMatch.ts
-var fuzzyMatch = __webpack_require__(56);
+var fuzzyMatch = __webpack_require__(59);
 
 // EXTERNAL MODULE: ./src/utils/ssrWindow.ts
 var ssrWindow = __webpack_require__(18);
@@ -1251,10 +1552,6 @@ function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-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 _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -1287,9 +1584,14 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
+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); }
+
+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 _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); }
 
 
 
@@ -1319,7 +1621,8 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 
 
 
-var propTypes = {
+
+var SelectBase_propTypes = {
   allowKeyMatching: external_prop_types_default.a.bool,
   allowNewValues: external_prop_types_default.a.bool,
   animateLoading: external_prop_types_default.a.bool,
@@ -1358,6 +1661,7 @@ var propTypes = {
   prefixLabel: external_prop_types_default.a.string,
   prepend: external_prop_types_default.a.bool,
   repositionMode: external_prop_types_default.a.oneOf(['none', 'flip']),
+  selectAllAppearance: external_prop_types_default.a.oneOf(['buttongroup', 'checkbox']),
   showSelectedValuesFirst: external_prop_types_default.a.oneOf(['nextOpen', 'immediately', 'never']),
   suffixLabel: external_prop_types_default.a.string,
   tabConfirmsNewValue: external_prop_types_default.a.bool,
@@ -1380,8 +1684,25 @@ var defaultProps = {
   placeholder: Object(i18n_["_"])('Select...'),
   prepend: false,
   repositionMode: 'flip',
+  selectAllAppearance: 'buttongroup',
   tabConfirmsNewValue: false
 };
+var getLabelFromPlaceholder = memoize_default()(function (placeholder) {
+  return [placeholder];
+}); // preserve separate widths for single vs. multi mode
+
+var getInlineMenuStyle = memoize_default()(function (_ref) {
+  var anchorWidth = _ref.anchorWidth,
+      isMultiple = _ref.isMultiple,
+      menuStyle = _ref.menuStyle;
+  return isMultiple ? _objectSpread({
+    width: Math.max(anchorWidth !== null && anchorWidth !== void 0 ? anchorWidth : 0, 200)
+  }, menuStyle) : _objectSpread({
+    minWidth: anchorWidth !== null && anchorWidth !== void 0 ? anchorWidth : undefined,
+    maxWidth: Math.max(anchorWidth !== null && anchorWidth !== void 0 ? anchorWidth : 0, 300)
+  }, menuStyle);
+});
+var dropdownCloseReasons = ['clickAway', 'escapeKey', 'offScreen', 'tabKey', 'toggleClick'];
 
 function isOption(child) {
   return child && has_default()(child.props, 'value');
@@ -1443,6 +1764,8 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
 
     _defineProperty(_assertThisInitialized(_this), "availableMatchOptions", void 0);
 
+    _defineProperty(_assertThisInitialized(_this), "optionSelection", void 0);
+
     _defineProperty(_assertThisInitialized(_this), "resetMatches", function () {
       _this.matchCharacter = null;
       _this.currentMatchOptions = [];
@@ -1480,7 +1803,8 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
 
       (_this$props$onChange = (_this$props2 = _this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props2, e, {
         values: values,
-        name: name
+        name: name,
+        reason: 'selectAll'
       });
     });
 
@@ -1513,7 +1837,8 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
 
       (_this$props$onChange2 = (_this$props4 = _this.props).onChange) === null || _this$props$onChange2 === void 0 ? void 0 : _this$props$onChange2.call(_this$props4, e, {
         values: values,
-        name: name
+        name: name,
+        reason: 'clearAll'
       });
     });
 
@@ -1533,6 +1858,15 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       }
 
       if (e.shiftKey || e.metaKey || e.ctrlKey) {
+        if (eventKeyCode === 'a' && (e.ctrlKey || e.metaKey)) {
+          // handle control + A
+          if (_this.optionSelection === 'all') {
+            _this.handleClearAll(e);
+          } else {
+            _this.handleSelectAll(e);
+          }
+        }
+
         return;
       }
 
@@ -1541,7 +1875,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
 
         _this.setState(function (state) {
           return {
-            activeIndex: Math.min(state.activeIndex + 1, _this.availableOptionCount - 1)
+            activeIndex: Math.min(state.activeIndex + 1, _this.props.selectAllAppearance === 'checkbox' ? _this.availableOptionCount : _this.availableOptionCount - 1)
           };
         });
 
@@ -1567,14 +1901,22 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       }
 
       if (eventKeyCode === 'enter' && !isUndefined_default()(_this.activeValue) && _this.state.open) {
-        e.preventDefault();
+        if (_this.activeValue === 'selectAll') {
+          if (_this.optionSelection === 'all') {
+            _this.handleClearAll(e);
+          } else {
+            _this.handleSelectAll(e);
+          }
+        } else {
+          e.preventDefault();
 
-        _this.toggleValue(e, _this.activeValue);
+          _this.toggleValue(e, _this.activeValue);
+        }
       }
     });
 
-    _defineProperty(_assertThisInitialized(_this), "handleMenuOptionClick", function (e, _ref) {
-      var value = _ref.value;
+    _defineProperty(_assertThisInitialized(_this), "handleMenuOptionClick", function (e, _ref2) {
+      var value = _ref2.value;
       e.preventDefault();
 
       if (!_this.state.open) {
@@ -1642,10 +1984,10 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       }
     });
 
-    _defineProperty(_assertThisInitialized(_this), "handleTextChange", function (e, _ref2) {
+    _defineProperty(_assertThisInitialized(_this), "handleTextChange", function (e, _ref3) {
       var _this$props$onFilterC, _this$props6;
 
-      var value = _ref2.value;
+      var value = _ref3.value;
 
       _this.setState({
         filterKeyword: value,
@@ -1806,7 +2148,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       if (label.length === 0 || !multiple && label.every(function (labelNode) {
         return labelNode === '';
       })) {
-        label = [placeholder];
+        label = getLabelFromPlaceholder(placeholder);
       }
 
       var ariaLabel = label; // If there's more than one item selected, read out the selected total
@@ -1879,6 +2221,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
           allowNewValues = _this$props12.allowNewValues,
           filter = _this$props12.filter,
           multiple = _this$props12.multiple,
+          selectAllAppearance = _this$props12.selectAllAppearance,
           showSelectedValuesFirst = _this$props12.showSelectedValuesFirst,
           isLoadingOptions = _this$props12.isLoadingOptions,
           onScrollBottom = _this$props12.onScrollBottom;
@@ -2028,8 +2371,11 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
           multiple: multiple,
           onClick: _this.handleMenuOptionClick
         }));
-      } // Highlight the selected Items and remove hidden
+      } // When selectAll is a menu item, add an offset so that activeItem accounts for the extra selectAll option.
+
 
+      var totalOptionCount = selectAllAppearance === 'checkbox' && multiple && children.length > 1 ? 1 : 0;
+      var allOptionsSelected = true; // Highlight the selected Items and remove hidden
 
       children = children.reduce(function (acc, item) {
         // ignore Dividers & Headings
@@ -2047,10 +2393,15 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
           _this.firstSelectedOptionIndex = _this.availableOptionCount;
         }
 
-        var active = _this.availableOptionCount === _this.state.activeIndex;
+        var active = totalOptionCount === _this.state.activeIndex;
+        totalOptionCount += 1;
         _this.availableOptionCount += 1;
         _this.selectedOptionCount += item.props.selected ? 1 : 0;
 
+        if (item.key !== 'newValue' && !item.props.disabled && !item.props.selected) {
+          allOptionsSelected = false;
+        }
+
         if (!active || !textHasFocus) {
           acc.push(item);
           return acc;
@@ -2068,6 +2419,45 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
         acc.push(clonedItem);
         return acc;
       }, []);
+      _this.optionSelection = _this.selectedOptionCount === 0 && 'none' || allOptionsSelected && 'all' || 'some'; // add select all option
+
+      if (selectAllAppearance === 'checkbox' && multiple && _this.availableOptionCount > 0) {
+        var _this$getCurrentValue5;
+
+        var selectAllLabel;
+
+        if (_this.optionSelection === 'all') {
+          if (filterKeyword === '') {
+            selectAllLabel = Object(i18n_["_"])('Clear all');
+          } else {
+            selectAllLabel = Object(i18n_["_"])('Clear all matches');
+          }
+        } else if (filterKeyword === '') {
+          selectAllLabel = Object(i18n_["_"])('Select all');
+        } else {
+          selectAllLabel = Object(i18n_["_"])('Select all matches');
+        }
+
+        if (_this.state.activeIndex === 0 && textHasFocus) {
+          _this.activeValue = 'selectAll';
+        }
+
+        children.unshift( /*#__PURE__*/external_react_default.a.createElement(Select_SelectAllOption, {
+          key: "selectAllOption",
+          selected: _this.optionSelection === 'all' || _this.optionSelection !== 'none' && 'some',
+          selectAllLabel: selectAllLabel,
+          totalCount: (_this$getCurrentValue5 = _this.getCurrentValues()) === null || _this$getCurrentValue5 === void 0 ? void 0 : _this$getCurrentValue5.length,
+          changedToggle: !!_this.props.toggle,
+          onClick: _this.optionSelection === 'all' ? _this.handleClearAll : _this.handleSelectAll,
+          id: _this.state.activeIndex === 0 ? _this.activeItemId : undefined,
+          active: _this.state.activeIndex === 0,
+          ref: _this.handleActiveOptionMount,
+          tabIndex: -1
+        }), /*#__PURE__*/external_react_default.a.createElement(Menu_["Divider"], {
+          key: "selectAllDivider"
+        }));
+      }
+
       _this.displayedValues = children.reduce(function (acc, item) {
         if (isOption(item)) {
           acc.push(item.props.value);
@@ -2078,10 +2468,10 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       return children;
     });
 
-    _defineProperty(_assertThisInitialized(_this), "wrapLabel", function (_ref3) {
-      var prefixLabel = _ref3.prefixLabel,
-          label = _ref3.label,
-          suffixLabel = _ref3.suffixLabel;
+    _defineProperty(_assertThisInitialized(_this), "wrapLabel", function (_ref4) {
+      var prefixLabel = _ref4.prefixLabel,
+          label = _ref4.label,
+          suffixLabel = _ref4.suffixLabel;
       var wrappedLabel = label;
 
       if (prefixLabel) {
@@ -2095,6 +2485,10 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       return wrappedLabel;
     });
 
+    _defineProperty(_assertThisInitialized(_this), "handleDropdownMount", function (c) {
+      _this.dropdown = c;
+    });
+
     _this.state = {
       activeIndex: 0,
       filterKeyword: '',
@@ -2113,6 +2507,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
     _this.currentMatchOptions = [];
     _this.availableMatchOptions = [];
     _this.optionRefsByKey = {};
+    _this.optionSelection = 'none';
 
     if (false) {}
 
@@ -2143,10 +2538,10 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
   }, {
     key: "getTopValues",
     value: function getTopValues() {
-      var _this$getCurrentValue5;
+      var _this$getCurrentValue6;
 
       // in non-multiple mode, don't move values to the top of the list
-      return this.props.multiple && this.props.showSelectedValuesFirst !== 'never' ? (_this$getCurrentValue5 = this.getCurrentValues()) !== null && _this$getCurrentValue5 !== void 0 ? _this$getCurrentValue5 : [] : [];
+      return this.props.multiple && this.props.showSelectedValuesFirst !== 'never' ? (_this$getCurrentValue6 = this.getCurrentValues()) !== null && _this$getCurrentValue6 !== void 0 ? _this$getCurrentValue6 : [] : [];
     }
   }, {
     key: "isControlled",
@@ -2161,9 +2556,9 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
   }, {
     key: "toggleValue",
     value: function toggleValue(e, value) {
-      var _this$getCurrentValue6, _this$props$onChange3, _this$props14;
+      var _this$getCurrentValue7, _this$props$onChange3, _this$props14;
 
-      var values = (_this$getCurrentValue6 = this.getCurrentValues()) !== null && _this$getCurrentValue6 !== void 0 ? _this$getCurrentValue6 : [];
+      var values = (_this$getCurrentValue7 = this.getCurrentValues()) !== null && _this$getCurrentValue7 !== void 0 ? _this$getCurrentValue7 : [];
       var currentIndex = values.indexOf(value);
       var _this$props13 = this.props,
           name = _this$props13.name,
@@ -2207,7 +2602,8 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
 
       (_this$props$onChange3 = (_this$props14 = this.props).onChange) === null || _this$props$onChange3 === void 0 ? void 0 : _this$props$onChange3.call(_this$props14, e, {
         values: newValues,
-        name: name
+        name: name,
+        reason: 'valueToggle'
       });
     }
     /**
@@ -2223,27 +2619,32 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
     }
   }, {
     key: "renderControls",
-    value: function renderControls(_ref4) {
-      var hasChildren = _ref4.hasChildren,
-          placement = _ref4.placement;
+    value: function renderControls(_ref5) {
+      var hasChildren = _ref5.hasChildren,
+          placement = _ref5.placement;
       var filterKeyword = this.state.filterKeyword;
       var _this$props15 = this.props,
           inputId = _this$props15.inputId,
           inputRef = _this$props15.inputRef,
-          multiple = _this$props15.multiple; // only visually disable these as opposed to fully disabling to avoid losing keyboard focus - see SUI-2731
+          multiple = _this$props15.multiple,
+          selectAllAppearance = _this$props15.selectAllAppearance;
+
+      var selectAllLabel = Object(i18n_["_"])("Select all options".concat(this.optionSelection === 'all' ? ' disabled' : ''));
+
+      var clearAllLabel = Object(i18n_["_"])("Clear all options".concat(this.optionSelection === 'none' ? ' disabled' : '')); // only visually disable these as opposed to fully disabling to avoid losing keyboard focus - see SUI-2731
+
 
       var selectControls = /*#__PURE__*/external_react_default.a.createElement(StyledToggleAllControls, {
         $placement: placement,
         key: "selectAll"
       }, /*#__PURE__*/external_react_default.a.createElement(StyledControlsLink, {
-        $disabled: !(this.availableOptionCount - this.selectedOptionCount),
+        $disabled: this.optionSelection === 'all',
+        "aria-label": selectAllLabel,
         onClick: this.handleSelectAll,
-        "data-test": "select-all",
-        style: {
-          marginRight: 20
-        }
+        "data-test": "select-all"
       }, filterKeyword ? Object(i18n_["_"])('Select All Matches') : Object(i18n_["_"])('Select All')), /*#__PURE__*/external_react_default.a.createElement(StyledControlsLink, {
-        $disabled: !this.selectedOptionCount,
+        $disabled: this.optionSelection === 'none',
+        "aria-label": clearAllLabel,
         onClick: this.handleClearAll,
         "data-test": "clear-all"
       }, filterKeyword ? Object(i18n_["_"])('Clear All Matches') : Object(i18n_["_"])('Clear All')));
@@ -2271,12 +2672,12 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
         inputId: inputId,
         canClear: true,
         startAdornment: /*#__PURE__*/external_react_default.a.createElement(StyledSearchIconWrapper, null, /*#__PURE__*/external_react_default.a.createElement(icons_Search, null))
-      })), multiple && hasChildren && selectControls);
+      })), multiple && hasChildren && selectAllAppearance === 'buttongroup' && selectControls);
     }
   }, {
     key: "render",
     value: function render() {
-      var _this$getCurrentValue7,
+      var _this$getCurrentValue8,
           _this2 = this;
 
       var _this$props16 = this.props,
@@ -2286,7 +2687,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
           multiple = _this$props16.multiple,
           repositionMode = _this$props16.repositionMode;
       var filterEnabled = this.hasFilter();
-      var currentValues = (_this$getCurrentValue7 = this.getCurrentValues()) !== null && _this$getCurrentValue7 !== void 0 ? _this$getCurrentValue7 : [];
+      var currentValues = (_this$getCurrentValue8 = this.getCurrentValues()) !== null && _this$getCurrentValue8 !== void 0 ? _this$getCurrentValue8 : [];
       var childrenArray = external_react_["Children"].toArray(children);
       var isAnyValueSelected = currentValues.some(function (value) {
         var matchedItem = find_default()(childrenArray, function (item) {
@@ -2297,17 +2698,15 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       var finalChildren = this.createChildren();
       var toggle = this.createToggle();
 
-      var createMenu = function createMenu(_ref5) {
-        var anchorWidth = _ref5.anchorWidth,
-            maxHeight = _ref5.maxHeight,
-            placement = _ref5.placement;
-        // preserve separate widths for single vs. multi mode
-        var internalMenuStyle = _this2.props.multiple ? {
-          width: Math.max(anchorWidth !== null && anchorWidth !== void 0 ? anchorWidth : 0, 200)
-        } : {
-          minWidth: anchorWidth !== null && anchorWidth !== void 0 ? anchorWidth : undefined,
-          maxWidth: Math.max(anchorWidth !== null && anchorWidth !== void 0 ? anchorWidth : 0, 300)
-        };
+      var createMenu = function createMenu(_ref6) {
+        var anchorWidth = _ref6.anchorWidth,
+            maxHeight = _ref6.maxHeight,
+            placement = _ref6.placement;
+        var internalMenuStyle = getInlineMenuStyle({
+          anchorWidth: anchorWidth,
+          isMultiple: _this2.props.multiple,
+          menuStyle: _this2.props.menuStyle
+        });
         var tabIndex = currentValues.length > 0 && !isAnyValueSelected && !_this2.hasFilter() ? 0 : undefined;
         return /*#__PURE__*/external_react_default.a.createElement(ResultsMenu_default.a, _extends({
           "aria-multiselectable": multiple || undefined,
@@ -2323,13 +2722,13 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
           isLoading: _this2.props.isLoadingOptions,
           id: _this2.menuId
         }, pick_default()(_this2.props, 'noOptionsMessage', 'footerMessage', 'animateLoading', 'loadingMessage', 'onScroll'), {
-          style: _objectSpread(_objectSpread({}, internalMenuStyle), _this2.props.menuStyle),
+          style: internalMenuStyle,
           tabIndex: tabIndex
         }), finalChildren);
       };
 
       return /*#__PURE__*/external_react_default.a.createElement(Dropdown_default.a, {
-        closeReasons: ['clickAway', 'escapeKey', 'offScreen', 'tabKey', 'toggleClick'],
+        closeReasons: dropdownCloseReasons,
         inputId: inputId,
         toggle: toggle,
         onRequestOpen: this.handleRequestOpen,
@@ -2339,9 +2738,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
         repositionMode: repositionMode,
         defaultPlacement: filterEnabled ? defaultPlacement : undefined,
         canCoverAnchor: Object(ssrWindow["a" /* getWindow */])().innerHeight < 500,
-        ref: function ref(c) {
-          _this2.dropdown = c;
-        },
+        ref: this.handleDropdownMount,
         retainFocus: false,
         takeFocus: currentValues.length === 0 || currentValues.length > 0 && !isAnyValueSelected || !!filterEnabled
       }, createMenu);
@@ -2351,7 +2748,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
   return SelectBase;
 }(external_react_["Component"]);
 
-_defineProperty(SelectBase_SelectBase, "propTypes", propTypes);
+_defineProperty(SelectBase_SelectBase, "propTypes", SelectBase_propTypes);
 
 _defineProperty(SelectBase_SelectBase, "defaultProps", defaultProps);
 
@@ -2368,7 +2765,7 @@ _defineProperty(SelectBase_SelectBase, "invalidLinkAppearanceProps", ['append',
 
 /***/ }),
 
-/***/ 65:
+/***/ 67:
 /***/ (function(module, exports) {
 
 module.exports = require("lodash/castArray");