@splunk/react-ui 4.4.0 → 4.5.1

package/Monogram.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 141);
+/******/ 	return __webpack_require__(__webpack_require__.s = 156);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -101,14 +101,14 @@ module.exports = require("prop-types");
 
 /***/ }),
 
-/***/ 11:
+/***/ 12:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Clickable");
 
 /***/ }),
 
-/***/ 141:
+/***/ 156:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -127,16 +127,15 @@ var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_)
 var external_prop_types_ = __webpack_require__(1);
 var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
 
-// EXTERNAL MODULE: external "lodash/omit"
-var omit_ = __webpack_require__(32);
-var omit_default = /*#__PURE__*/__webpack_require__.n(omit_);
+// EXTERNAL MODULE: external "lodash"
+var external_lodash_ = __webpack_require__(4);
 
 // 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: external "@splunk/react-ui/Clickable"
-var Clickable_ = __webpack_require__(11);
+var Clickable_ = __webpack_require__(12);
 var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_);
 
 // EXTERNAL MODULE: external "@splunk/themes"
@@ -300,7 +299,7 @@ function MonogramInteractive(props) {
   return /*#__PURE__*/external_react_default.a.createElement(StyledClickable, _extends({
     elementRef: elementRef,
     onClick: handleClick
-  }, sharedProps, omit_default()(otherProps, Object.keys(propTypes))), children);
+  }, sharedProps, Object(external_lodash_["omit"])(otherProps, Object.keys(propTypes))), children);
 }
 
 function MonogramNonInteractive(props) {
@@ -315,11 +314,13 @@ function MonogramNonInteractive(props) {
 
   return /*#__PURE__*/external_react_default.a.createElement(Styled, _extends({
     ref: elementRef
-  }, sharedProps, omit_default()(otherProps, Object.keys(propTypes))), children);
+  }, sharedProps, Object(external_lodash_["omit"])(otherProps, Object.keys(propTypes))), children);
 }
 
 function Monogram(props) {
   // @docs-props-type MonogramPropsBase
+  if (false) {}
+
   var children = /*#__PURE__*/external_react_default.a.createElement(Initials, {
     "data-test": "initials"
   }, props.initials);
@@ -350,10 +351,10 @@ module.exports = require("styled-components");
 
 /***/ }),
 
-/***/ 32:
+/***/ 4:
 /***/ (function(module, exports) {
 
-module.exports = require("lodash/omit");
+module.exports = require("lodash");
 
 /***/ })
 

package/Multiselect.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 118);
+/******/ 	return __webpack_require__(__webpack_require__.s = 122);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -108,7 +108,34 @@ module.exports = require("@splunk/ui-utils/id");
 
 /***/ }),
 
-/***/ 118:
+/***/ 11:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return updateReactRef; });
+/**
+ * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
+ *
+ * @param ref - The React callback or object ref. Can be `null` or `undefined`.
+ * @param current - The new value of the ref.
+ */
+function updateReactRef(ref, current) {
+  if (ref) {
+    if (typeof ref === 'function') {
+      ref(current);
+    } else {
+      // the public signature of this util uses React.Ref<T> to mirror the way React types refs.
+      // the intention here is to signal "we will take care of setting 'current', not you".
+      ref.current = current; // eslint-disable-line no-param-reassign
+    }
+  }
+}
+
+
+
+/***/ }),
+
+/***/ 122:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -285,7 +312,7 @@ _defineProperty(Option_Option, "defaultProps", defaultProps);
 
 /* harmony default export */ var Multiselect_Option = (Option_Option);
 // EXTERNAL MODULE: ./src/Select/SelectBase.tsx + 1 modules
-var SelectBase = __webpack_require__(42);
+var SelectBase = __webpack_require__(41);
 
 // CONCATENATED MODULE: ./src/Multiselect/Compact.tsx
 function Compact_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { Compact_typeof = function _typeof(obj) { return typeof obj; }; } else { Compact_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return Compact_typeof(obj); }
@@ -352,6 +379,8 @@ var Compact_propTypes = {
   onOpen: external_prop_types_default.a.func,
   onScrollBottom: external_prop_types_default.a.func,
   placeholder: external_prop_types_default.a.string,
+  repositionMode: external_prop_types_default.a.oneOf(['none', 'flip']),
+  showSelectedValuesFirst: external_prop_types_default.a.oneOf(['nextOpen', 'immediately', 'never']),
   tabConfirmsNewValue: external_prop_types_default.a.bool,
   values: external_prop_types_default.a.array
 };
@@ -365,6 +394,7 @@ var Compact_defaultProps = {
   menuStyle: {},
   noOptionsMessage: Object(i18n_["_"])('No matches'),
   placeholder: Object(i18n_["_"])('Select...'),
+  showSelectedValuesFirst: 'nextOpen',
   tabConfirmsNewValue: false
 }; // TS: not typed controlled/uncontrolled, handled by Multiselect wrapper component
 
@@ -432,7 +462,7 @@ Compact_defineProperty(Compact_Compact, "Heading", Menu_["Heading"]);
 
 /* harmony default export */ var Multiselect_Compact = (Compact_Compact);
 // EXTERNAL MODULE: external "@splunk/ui-utils/filter"
-var filter_ = __webpack_require__(23);
+var filter_ = __webpack_require__(24);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/id"
 var id_ = __webpack_require__(10);
@@ -441,19 +471,19 @@ var id_ = __webpack_require__(10);
 var keyboard_ = __webpack_require__(9);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Chip"
-var Chip_ = __webpack_require__(89);
+var Chip_ = __webpack_require__(92);
 var Chip_default = /*#__PURE__*/__webpack_require__.n(Chip_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ResultsMenu"
-var ResultsMenu_ = __webpack_require__(39);
+var ResultsMenu_ = __webpack_require__(32);
 var ResultsMenu_default = /*#__PURE__*/__webpack_require__.n(ResultsMenu_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Popover"
-var Popover_ = __webpack_require__(17);
+var Popover_ = __webpack_require__(16);
 var Popover_default = /*#__PURE__*/__webpack_require__.n(Popover_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ScreenReaderContent"
-var ScreenReaderContent_ = __webpack_require__(14);
+var ScreenReaderContent_ = __webpack_require__(15);
 var ScreenReaderContent_default = /*#__PURE__*/__webpack_require__.n(ScreenReaderContent_);
 
 // EXTERNAL MODULE: external "styled-components"
@@ -543,7 +573,7 @@ var StyledOverlay = external_styled_components_default.a.div.withConfig({
 });
 
 // EXTERNAL MODULE: ./src/utils/updateReactRef.ts
-var updateReactRef = __webpack_require__(12);
+var updateReactRef = __webpack_require__(11);
 
 // CONCATENATED MODULE: ./src/Multiselect/Normal.tsx
 function Normal_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { Normal_typeof = function _typeof(obj) { return typeof obj; }; } else { Normal_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return Normal_typeof(obj); }
@@ -634,6 +664,7 @@ var Normal_propTypes = {
   onOpen: external_prop_types_default.a.func,
   onScrollBottom: external_prop_types_default.a.func,
   placeholder: external_prop_types_default.a.string,
+  repositionMode: external_prop_types_default.a.oneOf(['none', 'flip']),
   tabConfirmsNewValue: external_prop_types_default.a.bool,
   useClickawayOverlay: external_prop_types_default.a.bool,
   values: external_prop_types_default.a.array
@@ -679,6 +710,8 @@ var Normal_Normal = /*#__PURE__*/function (_Component) {
 
     Normal_defineProperty(Normal_assertThisInitialized(_this), "popoverId", void 0);
 
+    Normal_defineProperty(Normal_assertThisInitialized(_this), "previousActiveIndex", null);
+
     Normal_defineProperty(Normal_assertThisInitialized(_this), "handleClick", function () {
       var _this$input;
 
@@ -869,6 +902,7 @@ var Normal_Normal = /*#__PURE__*/function (_Component) {
           }, function () {
             var _this$props$onClose, _this$props6;
 
+            _this.previousActiveIndex = null;
             (_this$props$onClose = (_this$props6 = _this.props).onClose) === null || _this$props$onClose === void 0 ? void 0 : _this$props$onClose.call(_this$props6);
           });
         }
@@ -906,7 +940,9 @@ var Normal_Normal = /*#__PURE__*/function (_Component) {
     });
 
     Normal_defineProperty(Normal_assertThisInitialized(_this), "handleActiveOptionMount", function (c) {
-      c === null || c === void 0 ? void 0 : c.scrollIntoViewIfNeeded();
+      if (_this.previousActiveIndex !== _this.state.activeIndex) {
+        c === null || c === void 0 ? void 0 : c.scrollIntoViewIfNeeded();
+      }
     });
 
     Normal_defineProperty(Normal_assertThisInitialized(_this), "renderMenu", function (_ref4) {
@@ -950,11 +986,13 @@ var Normal_Normal = /*#__PURE__*/function (_Component) {
 
   Normal_createClass(Normal, [{
     key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps) {
+    value: function componentDidUpdate(prevProps, prevState) {
       if (false) {}
 
       if (false) {}
 
+      this.previousActiveIndex = prevState.activeIndex;
+
       if (this.isControlled() && prevProps.values !== this.props.values) {
         // eslint-disable-next-line react/no-did-update-set-state
         this.setState({
@@ -1067,8 +1105,9 @@ var Normal_Normal = /*#__PURE__*/function (_Component) {
           inputId = _this$props10.inputId,
           labelledBy = _this$props10.labelledBy,
           placeholder = _this$props10.placeholder,
+          repositionMode = _this$props10.repositionMode,
           useClickawayOverlay = _this$props10.useClickawayOverlay,
-          otherProps = Normal_objectWithoutProperties(_this$props10, ["allowNewValues", "children", "controlledFilter", "defaultPlacement", "describedBy", "disabled", "error", "inline", "inputId", "labelledBy", "placeholder", "useClickawayOverlay"]);
+          otherProps = Normal_objectWithoutProperties(_this$props10, ["allowNewValues", "children", "controlledFilter", "defaultPlacement", "describedBy", "disabled", "error", "inline", "inputId", "labelledBy", "placeholder", "repositionMode", "useClickawayOverlay"]);
 
       var ariaProps = _objectSpread(_objectSpread({}, Object(external_lodash_["pickBy"])(otherProps, function (val, key) {
         return key === 'role' || key.indexOf('aria-') === 0;
@@ -1235,7 +1274,7 @@ var Normal_Normal = /*#__PURE__*/function (_Component) {
         onRequestClose: this.handleRequestClose,
         canCoverAnchor: false,
         defaultPlacement: defaultPlacement,
-        repositionMode: "flip",
+        repositionMode: repositionMode,
         id: this.popoverId
       }, this.renderMenu)), useClickawayOverlay && this.state.open ? /*#__PURE__*/external_react_default.a.createElement(StyledOverlay, {
         key: "overlay",
@@ -1322,6 +1361,8 @@ var Multiselect_propTypes = {
   onOpen: external_prop_types_default.a.func,
   onScrollBottom: external_prop_types_default.a.func,
   placeholder: external_prop_types_default.a.string,
+  repositionMode: external_prop_types_default.a.oneOf(['none', 'flip']),
+  showSelectedValuesFirst: external_prop_types_default.a.oneOf(['nextOpen', 'immediately', 'never']),
   tabConfirmsNewValue: external_prop_types_default.a.bool,
   useClickawayOverlay: external_prop_types_default.a.bool,
   values: external_prop_types_default.a.array
@@ -1337,6 +1378,7 @@ var Multiselect_defaultProps = {
   menuStyle: {},
   noOptionsMessage: Object(i18n_["_"])('No matches'),
   placeholder: Object(i18n_["_"])('Select...'),
+  repositionMode: 'flip',
   tabConfirmsNewValue: false,
   useClickawayOverlay: false
 };
@@ -1366,6 +1408,8 @@ var Multiselect_Multiselect = /*#__PURE__*/function (_Component) {
         }, Object(external_lodash_["omit"])(this.props, 'compact')));
       }
 
+      if (false) {}
+
       return /*#__PURE__*/external_react_default.a.createElement(Multiselect_Normal, Multiselect_extends({
         "data-test": "multiselect"
       }, Object(external_lodash_["omit"])(this.props, 'compact')));
@@ -1391,33 +1435,6 @@ Multiselect_defineProperty(Multiselect_Multiselect, "Divider", Menu_["Divider"])
 
 
 
-/***/ }),
-
-/***/ 12:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return updateReactRef; });
-/**
- * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
- *
- * @param ref - The React callback or object ref. Can be `null` or `undefined`.
- * @param current - The new value of the ref.
- */
-function updateReactRef(ref, current) {
-  if (ref) {
-    if (typeof ref === 'function') {
-      ref(current);
-    } else {
-      // the public signature of this util uses React.Ref<T> to mirror the way React types refs.
-      // the intention here is to signal "we will take care of setting 'current', not you".
-      ref.current = current; // eslint-disable-line no-param-reassign
-    }
-  }
-}
-
-
-
 /***/ }),
 
 /***/ 13:
@@ -1427,7 +1444,7 @@ module.exports = require("@splunk/react-ui/Menu");
 
 /***/ }),
 
-/***/ 14:
+/***/ 15:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/ScreenReaderContent");
@@ -1437,14 +1454,14 @@ module.exports = require("@splunk/react-ui/ScreenReaderContent");
 /***/ 16:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Button");
+module.exports = require("@splunk/react-ui/Popover");
 
 /***/ }),
 
 /***/ 17:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Popover");
+module.exports = require("@splunk/react-ui/Button");
 
 /***/ }),
 
@@ -1462,17 +1479,17 @@ module.exports = require("react");
 
 /***/ }),
 
-/***/ 23:
+/***/ 21:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/ui-utils/filter");
+module.exports = require("@splunk/react-ui/Text");
 
 /***/ }),
 
-/***/ 26:
+/***/ 24:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Text");
+module.exports = require("@splunk/ui-utils/filter");
 
 /***/ }),
 
@@ -1666,6 +1683,13 @@ module.exports = require("styled-components");
 
 /***/ }),
 
+/***/ 32:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/react-ui/ResultsMenu");
+
+/***/ }),
+
 /***/ 36:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
@@ -1711,13 +1735,6 @@ module.exports = require("@splunk/react-icons/Caret");
 
 /***/ }),
 
-/***/ 39:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/ResultsMenu");
-
-/***/ }),
-
 /***/ 4:
 /***/ (function(module, exports) {
 
@@ -1725,7 +1742,7 @@ module.exports = require("lodash");
 
 /***/ }),
 
-/***/ 42:
+/***/ 41:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -1749,7 +1766,7 @@ var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_pr
 var external_lodash_ = __webpack_require__(4);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/filter"
-var filter_ = __webpack_require__(23);
+var filter_ = __webpack_require__(24);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/id"
 var id_ = __webpack_require__(10);
@@ -1772,11 +1789,11 @@ var Link_default = /*#__PURE__*/__webpack_require__.n(Link_);
 var Menu_ = __webpack_require__(13);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ResultsMenu"
-var ResultsMenu_ = __webpack_require__(39);
+var ResultsMenu_ = __webpack_require__(32);
 var ResultsMenu_default = /*#__PURE__*/__webpack_require__.n(ResultsMenu_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Text"
-var Text_ = __webpack_require__(26);
+var Text_ = __webpack_require__(21);
 var Text_default = /*#__PURE__*/__webpack_require__.n(Text_);
 
 // EXTERNAL MODULE: ./src/icons/CaretDown.tsx
@@ -1790,7 +1807,7 @@ var external_styled_components_ = __webpack_require__(3);
 var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Button"
-var Button_ = __webpack_require__(16);
+var Button_ = __webpack_require__(17);
 var Button_default = /*#__PURE__*/__webpack_require__.n(Button_);
 
 // EXTERNAL MODULE: external "@splunk/themes"
@@ -1956,6 +1973,8 @@ var propTypes = {
   placeholder: external_prop_types_default.a.string,
   prefixLabel: external_prop_types_default.a.string,
   prepend: external_prop_types_default.a.bool,
+  repositionMode: external_prop_types_default.a.oneOf(['none', 'flip']),
+  showSelectedValuesFirst: external_prop_types_default.a.oneOf(['nextOpen', 'immediately', 'never']),
   suffixLabel: external_prop_types_default.a.string,
   tabConfirmsNewValue: external_prop_types_default.a.bool,
   values: external_prop_types_default.a.array
@@ -1975,6 +1994,7 @@ var defaultProps = {
   noOptionsMessage: Object(i18n_["_"])('No matches'),
   placeholder: Object(i18n_["_"])('Select...'),
   prepend: false,
+  repositionMode: 'flip',
   tabConfirmsNewValue: false
 };
 
@@ -2020,6 +2040,8 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
 
     _defineProperty(_assertThisInitialized(_this), "menuId", void 0);
 
+    _defineProperty(_assertThisInitialized(_this), "previousActiveIndex", null);
+
     _defineProperty(_assertThisInitialized(_this), "selectedOptionCount", void 0);
 
     _defineProperty(_assertThisInitialized(_this), "handleSelectAll", function (e) {
@@ -2170,15 +2192,18 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "handleRequestOpen", function (e) {
-      var _this$getCurrentValue3, _this$props$onFilterC2, _this$props7;
+      var newState = {
+        open: true,
+        topValues: _this.getTopValues()
+      }; // SUI-3234: preserve existing behavior difference between <Select> and <Multiselect.Compact>
+
+      if (_this.props.multiple) {
+        newState.filterKeyword = '';
+      }
 
-      var multiple = _this.props.multiple;
+      var oldFilterKeyword = _this.state.filterKeyword;
 
-      _this.setState({
-        open: true,
-        // in non-multiple mode, don't move values to the top of the list
-        topValues: multiple ? (_this$getCurrentValue3 = _this.getCurrentValues()) !== null && _this$getCurrentValue3 !== void 0 ? _this$getCurrentValue3 : [] : []
-      }, function () {
+      _this.setState(newState, function () {
         var _this$props$onOpen, _this$props6;
 
         (_this$props$onOpen = (_this$props6 = _this.props).onOpen) === null || _this$props$onOpen === void 0 ? void 0 : _this$props$onOpen.call(_this$props6);
@@ -2192,10 +2217,14 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
             activeIndex: (_this$firstSelectedOp = _this.firstSelectedOptionIndex) !== null && _this$firstSelectedOp !== void 0 ? _this$firstSelectedOp : 0
           });
         }
-      });
 
-      (_this$props$onFilterC2 = (_this$props7 = _this.props).onFilterChange) === null || _this$props$onFilterC2 === void 0 ? void 0 : _this$props$onFilterC2.call(_this$props7, e, {
-        keyword: ''
+        if (oldFilterKeyword !== _this.state.filterKeyword) {
+          var _this$props$onFilterC2, _this$props7;
+
+          (_this$props$onFilterC2 = (_this$props7 = _this.props).onFilterChange) === null || _this$props$onFilterC2 === void 0 ? void 0 : _this$props$onFilterC2.call(_this$props7, e, {
+            keyword: _this.state.filterKeyword
+          });
+        }
       });
     });
 
@@ -2206,6 +2235,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       }, function () {
         var _this$props$onClose, _this$props8;
 
+        _this.previousActiveIndex = null;
         (_this$props$onClose = (_this$props8 = _this.props).onClose) === null || _this$props$onClose === void 0 ? void 0 : _this$props$onClose.call(_this$props8);
       });
     });
@@ -2219,7 +2249,9 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "handleActiveOptionMount", function (c) {
-      c === null || c === void 0 ? void 0 : c.scrollIntoViewIfNeeded();
+      if (_this.previousActiveIndex !== _this.state.activeIndex) {
+        c === null || c === void 0 ? void 0 : c.scrollIntoViewIfNeeded();
+      }
     });
 
     _defineProperty(_assertThisInitialized(_this), "handleSelectedItemMount", function (c) {
@@ -2230,11 +2262,12 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       var _this$state = _this.state,
           filterKeyword = _this$state.filterKeyword,
           textHasFocus = _this$state.textHasFocus,
-          topValues = _this$state.topValues;
+          topValuesState = _this$state.topValues;
       var _this$props10 = _this.props,
           allowNewValues = _this$props10.allowNewValues,
           filter = _this$props10.filter,
-          multiple = _this$props10.multiple;
+          multiple = _this$props10.multiple,
+          showSelectedValuesFirst = _this$props10.showSelectedValuesFirst;
 
       var currentValues = _this.getCurrentValues();
 
@@ -2247,6 +2280,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       var hasDivider = false; // used to avoid overwriting the selected item ref in multiple mode
 
       var foundSelected;
+      var topValues = showSelectedValuesFirst === 'immediately' ? _this.getTopValues() : topValuesState;
       var children = external_react_["Children"].toArray(_this.props.children).reduce(function (acc, item, i) {
         // ignore Headings and Dividers
         if (!isOption(item)) {
@@ -2453,12 +2487,13 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
 
   _createClass(SelectBase, [{
     key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps) {
+    value: function componentDidUpdate(prevProps, prevState) {
       if (false) {}
 
       if (false) {}
 
       SelectBase.validateAppearance(this.props);
+      this.previousActiveIndex = prevState.activeIndex;
     }
   }, {
     key: "getCurrentValues",
@@ -2466,6 +2501,14 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
       var values = this.isControlled() ? this.props.values : this.state.values;
       return this.props.multiple || values == null ? values : values.slice(0, 1);
     }
+  }, {
+    key: "getTopValues",
+    value: function getTopValues() {
+      var _this$getCurrentValue3;
+
+      // in non-multiple mode, don't move values to the top of the list
+      return this.props.multiple && this.props.showSelectedValuesFirst !== 'never' ? (_this$getCurrentValue3 = this.getCurrentValues()) !== null && _this$getCurrentValue3 !== void 0 ? _this$getCurrentValue3 : [] : [];
+    }
   }, {
     key: "isControlled",
     value: function isControlled() {
@@ -2612,6 +2655,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
           multiple = _this$props14.multiple,
           placeholder = _this$props14.placeholder,
           prefixLabel = _this$props14.prefixLabel,
+          repositionMode = _this$props14.repositionMode,
           suffixLabel = _this$props14.suffixLabel;
       var icon;
       var label;
@@ -2751,7 +2795,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
         onRequestOpen: this.handleRequestOpen,
         onRequestClose: this.handleRequestClose,
         open: this.state.open,
-        repositionMode: "flip",
+        repositionMode: repositionMode,
         defaultPlacement: filterEnabled ? defaultPlacement : undefined,
         canCoverAnchor: window.innerHeight < 500,
         ref: function ref(c) {
@@ -2940,17 +2984,17 @@ module.exports = require("@splunk/react-ui/Box");
 
 /***/ }),
 
-/***/ 89:
+/***/ 9:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Chip");
+module.exports = require("@splunk/ui-utils/keyboard");
 
 /***/ }),
 
-/***/ 9:
+/***/ 92:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/ui-utils/keyboard");
+module.exports = require("@splunk/react-ui/Chip");
 
 /***/ })