@atlaskit/react-select 1.5.1 → 1.6.0

package/dist/cjs/select.js

@@ -9,10 +9,9 @@ exports.defaultProps = exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _react = _interopRequireWildcard(require("react"));
@@ -25,16 +24,16 @@ var _liveRegion = _interopRequireDefault(require("./components/live-region"));
 var _menu = require("./components/menu");
 var _filters = require("./filters");
 var _styles = require("./styles");
-var _theme = require("./theme");
 var _utils = require("./utils");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */
 var defaultProps = exports.defaultProps = {
   // aria-live is by default with the live region so we don't need it
+  // eslint-disable-next-line @atlaskit/platform/no-module-level-eval
   'aria-live': (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? undefined : 'polite',
   backspaceRemovesValue: true,
   blurInputOnSelect: (0, _utils.isTouchCapable)(),
@@ -226,16 +225,14 @@ var instanceId = 1;
 
 // eslint-disable-next-line @repo/internal/react/no-class-components
 var Select = exports.default = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(Select, _Component);
-  var _super = _createSuper(Select);
   // Lifecycle
   // ------------------------------
 
   function Select(_props) {
     var _this;
     (0, _classCallCheck2.default)(this, Select);
-    _this = _super.call(this, _props);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+    _this = _callSuper(this, Select, [_props]);
+    (0, _defineProperty2.default)(_this, "state", {
       ariaSelection: null,
       focusedOption: null,
       focusedOptionId: null,
@@ -252,36 +249,36 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
     });
     // Misc. Instance Properties
     // ------------------------------
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "blockOptionHover", false);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isComposing", false);
+    (0, _defineProperty2.default)(_this, "blockOptionHover", false);
+    (0, _defineProperty2.default)(_this, "isComposing", false);
     // TODO
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "initialTouchX", 0);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "initialTouchY", 0);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "openAfterFocus", false);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "scrollToFocusedOptionOnUpdate", false);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isVoiceOver", (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') && (0, _helpers.isAppleDevice)());
+    (0, _defineProperty2.default)(_this, "initialTouchX", 0);
+    (0, _defineProperty2.default)(_this, "initialTouchY", 0);
+    (0, _defineProperty2.default)(_this, "openAfterFocus", false);
+    (0, _defineProperty2.default)(_this, "scrollToFocusedOptionOnUpdate", false);
+    (0, _defineProperty2.default)(_this, "isVoiceOver", (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') && (0, _helpers.isAppleDevice)());
     // Refs
     // ------------------------------
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "controlRef", null);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getControlRef", function (ref) {
+    (0, _defineProperty2.default)(_this, "controlRef", null);
+    (0, _defineProperty2.default)(_this, "getControlRef", function (ref) {
       _this.controlRef = ref;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "focusedOptionRef", null);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFocusedOptionRef", function (ref) {
+    (0, _defineProperty2.default)(_this, "focusedOptionRef", null);
+    (0, _defineProperty2.default)(_this, "getFocusedOptionRef", function (ref) {
       _this.focusedOptionRef = ref;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "menuListRef", null);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getMenuListRef", function (ref) {
+    (0, _defineProperty2.default)(_this, "menuListRef", null);
+    (0, _defineProperty2.default)(_this, "getMenuListRef", function (ref) {
       _this.menuListRef = ref;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "inputRef", null);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getInputRef", function (ref) {
+    (0, _defineProperty2.default)(_this, "inputRef", null);
+    (0, _defineProperty2.default)(_this, "getInputRef", function (ref) {
       _this.inputRef = ref;
     });
     // aliased for consumers
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "focus", _this.focusInput);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "blur", _this.blurInput);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onChange", function (newValue, actionMeta) {
+    (0, _defineProperty2.default)(_this, "focus", _this.focusInput);
+    (0, _defineProperty2.default)(_this, "blur", _this.blurInput);
+    (0, _defineProperty2.default)(_this, "onChange", function (newValue, actionMeta) {
       var _this$props = _this.props,
         onChange = _this$props.onChange,
         name = _this$props.name;
@@ -289,7 +286,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       _this.ariaOnChange(newValue, actionMeta);
       onChange(newValue, actionMeta);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setValue", function (newValue, action, option) {
+    (0, _defineProperty2.default)(_this, "setValue", function (newValue, action, option) {
       var _this$props2 = _this.props,
         closeMenuOnSelect = _this$props2.closeMenuOnSelect,
         isMulti = _this$props2.isMulti,
@@ -313,7 +310,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         option: option
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "selectOption", function (newValue) {
+    (0, _defineProperty2.default)(_this, "selectOption", function (newValue) {
       var _this$props3 = _this.props,
         blurInputOnSelect = _this$props3.blurInputOnSelect,
         isMulti = _this$props3.isMulti,
@@ -345,7 +342,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         _this.blurInput();
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "removeValue", function (removedValue) {
+    (0, _defineProperty2.default)(_this, "removeValue", function (removedValue) {
       var isMulti = _this.props.isMulti;
       var selectValue = _this.state.selectValue;
       var candidate = _this.getOptionValue(removedValue);
@@ -359,14 +356,14 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       });
       _this.focusInput();
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "clearValue", function () {
+    (0, _defineProperty2.default)(_this, "clearValue", function () {
       var selectValue = _this.state.selectValue;
       _this.onChange((0, _utils.valueTernary)(_this.props.isMulti, [], null), {
         action: 'clear',
         removedValues: selectValue
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "popValue", function () {
+    (0, _defineProperty2.default)(_this, "popValue", function () {
       var isMulti = _this.props.isMulti;
       var selectValue = _this.state.selectValue;
       var lastSelectedValue = selectValue[selectValue.length - 1];
@@ -377,59 +374,62 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         removedValue: lastSelectedValue
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFocusedOptionId", function (focusedOption) {
+    // ==============================
+    // Getters
+    // ==============================
+    (0, _defineProperty2.default)(_this, "getFocusedOptionId", function (focusedOption) {
       return getFocusedOptionId(_this.state.focusableOptionsWithIds, focusedOption);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFocusableOptionsWithIds", function () {
+    (0, _defineProperty2.default)(_this, "getFocusableOptionsWithIds", function () {
       return buildFocusableOptionsWithIds(buildCategorizedOptions(_this.props, _this.state.selectValue), _this.getElementId('option'));
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getValue", function () {
+    (0, _defineProperty2.default)(_this, "getValue", function () {
       return _this.state.selectValue;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "cx", function () {
+    (0, _defineProperty2.default)(_this, "cx", function () {
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
       }
       return _utils.classNames.apply(void 0, [_this.props.classNamePrefix].concat(args));
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getOptionLabel", function (data) {
+    (0, _defineProperty2.default)(_this, "getOptionLabel", function (data) {
       return getOptionLabel(_this.props, data);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getOptionValue", function (data) {
+    (0, _defineProperty2.default)(_this, "getOptionValue", function (data) {
       return getOptionValue(_this.props, data);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getStyles", function (key, props) {
+    (0, _defineProperty2.default)(_this, "getStyles", function (key, props) {
       var base = _styles.defaultStyles[key](props);
       base.boxSizing = 'border-box';
       var custom = _this.props.styles[key];
       return custom ? custom(base, props) : base;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getClassNames", function (key, props) {
+    (0, _defineProperty2.default)(_this, "getClassNames", function (key, props) {
       var _this$props$className, _this$props$className2;
       return (_this$props$className = (_this$props$className2 = _this.props.classNames)[key]) === null || _this$props$className === void 0 ? void 0 : _this$props$className.call(_this$props$className2, props);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getElementId", function (element) {
+    (0, _defineProperty2.default)(_this, "getElementId", function (element) {
       return "".concat(_this.state.instancePrefix, "-").concat(element);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getComponents", function () {
+    (0, _defineProperty2.default)(_this, "getComponents", function () {
       return (0, _components.defaultComponents)(_this.props);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "buildCategorizedOptions", function () {
+    (0, _defineProperty2.default)(_this, "buildCategorizedOptions", function () {
       return buildCategorizedOptions(_this.props, _this.state.selectValue);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getCategorizedOptions", function () {
+    (0, _defineProperty2.default)(_this, "getCategorizedOptions", function () {
       return _this.props.menuIsOpen ? _this.buildCategorizedOptions() : [];
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "buildFocusableOptions", function () {
+    (0, _defineProperty2.default)(_this, "buildFocusableOptions", function () {
       return buildFocusableOptionsFromCategorizedOptions(_this.buildCategorizedOptions());
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFocusableOptions", function () {
+    (0, _defineProperty2.default)(_this, "getFocusableOptions", function () {
       return _this.props.menuIsOpen ? _this.buildFocusableOptions() : [];
     });
     // ==============================
     // Helpers
     // ==============================
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "ariaOnChange", function (value, actionMeta) {
+    (0, _defineProperty2.default)(_this, "ariaOnChange", function (value, actionMeta) {
       _this.setState({
         ariaSelection: _objectSpread({
           value: value
@@ -439,7 +439,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
     // ==============================
     // Mouse Handlers
     // ==============================
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onMenuMouseDown", function (event) {
+    (0, _defineProperty2.default)(_this, "onMenuMouseDown", function (event) {
       if (event.button !== 0) {
         return;
       }
@@ -447,10 +447,10 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       event.preventDefault();
       _this.focusInput();
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onMenuMouseMove", function (event) {
+    (0, _defineProperty2.default)(_this, "onMenuMouseMove", function (event) {
       _this.blockOptionHover = false;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onControlMouseDown", function (event) {
+    (0, _defineProperty2.default)(_this, "onControlMouseDown", function (event) {
       // Event captured by dropdown indicator
       if (event.defaultPrevented) {
         var _this$controlRef;
@@ -479,7 +479,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         event.preventDefault();
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onDropdownIndicatorMouseDown", function (event) {
+    (0, _defineProperty2.default)(_this, "onDropdownIndicatorMouseDown", function (event) {
       // ignore mouse events that weren't triggered by the primary button
       if (event && event.type === 'mousedown' && event.button !== 0) {
         return;
@@ -501,7 +501,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       }
       event.preventDefault();
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onClearIndicatorMouseDown", function (event) {
+    (0, _defineProperty2.default)(_this, "onClearIndicatorMouseDown", function (event) {
       // ignore mouse events that weren't triggered by the primary button
       if (event && event.type === 'mousedown' && event.button !== 0) {
         return;
@@ -517,7 +517,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         });
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onScroll", function (event) {
+    (0, _defineProperty2.default)(_this, "onScroll", function (event) {
       if (typeof _this.props.closeMenuOnScroll === 'boolean') {
         if (event.target instanceof HTMLElement && (0, _utils.isDocumentElement)(event.target)) {
           _this.props.onMenuClose();
@@ -528,13 +528,13 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         }
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onCompositionStart", function () {
+    (0, _defineProperty2.default)(_this, "onCompositionStart", function () {
       _this.isComposing = true;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onCompositionEnd", function () {
+    (0, _defineProperty2.default)(_this, "onCompositionEnd", function () {
       _this.isComposing = false;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onTouchStart", function (_ref2) {
+    (0, _defineProperty2.default)(_this, "onTouchStart", function (_ref2) {
       var touches = _ref2.touches;
       var touch = touches && touches.item(0);
       if (!touch) {
@@ -544,7 +544,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       _this.initialTouchY = touch.clientY;
       _this.userIsDragging = false;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onTouchMove", function (_ref3) {
+    (0, _defineProperty2.default)(_this, "onTouchMove", function (_ref3) {
       var touches = _ref3.touches;
       var touch = touches && touches.item(0);
       if (!touch) {
@@ -555,7 +555,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       var moveThreshold = 5;
       _this.userIsDragging = deltaX > moveThreshold || deltaY > moveThreshold;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onTouchEnd", function (event) {
+    (0, _defineProperty2.default)(_this, "onTouchEnd", function (event) {
       if (_this.userIsDragging) {
         return;
       }
@@ -571,19 +571,19 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       _this.initialTouchX = 0;
       _this.initialTouchY = 0;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onControlTouchEnd", function (event) {
+    (0, _defineProperty2.default)(_this, "onControlTouchEnd", function (event) {
       if (_this.userIsDragging) {
         return;
       }
       _this.onControlMouseDown(event);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onClearIndicatorTouchEnd", function (event) {
+    (0, _defineProperty2.default)(_this, "onClearIndicatorTouchEnd", function (event) {
       if (_this.userIsDragging) {
         return;
       }
       _this.onClearIndicatorMouseDown(event);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onDropdownIndicatorTouchEnd", function (event) {
+    (0, _defineProperty2.default)(_this, "onDropdownIndicatorTouchEnd", function (event) {
       if (_this.userIsDragging) {
         return;
       }
@@ -592,7 +592,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
     // ==============================
     // Focus Handlers
     // ==============================
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleInputChange", function (event) {
+    (0, _defineProperty2.default)(_this, "handleInputChange", function (event) {
       var prevInputValue = _this.props.inputValue;
       var inputValue = event.currentTarget.value;
       _this.setState({
@@ -606,7 +606,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         _this.onMenuOpen();
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onInputFocus", function (event) {
+    (0, _defineProperty2.default)(_this, "onInputFocus", function (event) {
       if (_this.props.onFocus) {
         _this.props.onFocus(event);
       }
@@ -619,7 +619,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       }
       _this.openAfterFocus = false;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onInputBlur", function (event) {
+    (0, _defineProperty2.default)(_this, "onInputBlur", function (event) {
       var prevInputValue = _this.props.inputValue;
       if (_this.menuListRef && _this.menuListRef.contains(document.activeElement)) {
         _this.inputRef.focus();
@@ -638,7 +638,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         isFocused: false
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onOptionHover", function (focusedOption) {
+    (0, _defineProperty2.default)(_this, "onOptionHover", function (focusedOption) {
       if (_this.blockOptionHover || _this.state.focusedOption === focusedOption) {
         return;
       }
@@ -649,12 +649,12 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         focusedOptionId: focusedOptionIndex > -1 ? _this.getFocusedOptionId(focusedOption) : null
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "shouldHideSelectedOptions", function () {
+    (0, _defineProperty2.default)(_this, "shouldHideSelectedOptions", function () {
       return shouldHideSelectedOptions(_this.props);
     });
     // If the hidden input gets focus through form submit,
     // redirect focus to focusable input.
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onValueInputFocus", function (e) {
+    (0, _defineProperty2.default)(_this, "onValueInputFocus", function (e) {
       e.preventDefault();
       e.stopPropagation();
       _this.focus();
@@ -662,7 +662,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
     // ==============================
     // Keyboard Handlers
     // ==============================
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onKeyDown", function (event) {
+    (0, _defineProperty2.default)(_this, "onKeyDown", function (event) {
       var _this$props5 = _this.props,
         isMulti = _this$props5.isMulti,
         backspaceRemovesValue = _this$props5.backspaceRemovesValue,
@@ -835,7 +835,8 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
     }
     return _this;
   }
-  (0, _createClass2.default)(Select, [{
+  (0, _inherits2.default)(Select, _Component);
+  return (0, _createClass2.default)(Select, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       this.startListeningComposition();
@@ -1051,28 +1052,6 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         focusedOptionId: this.getFocusedOptionId(options[nextFocus])
       });
     }
-  }, {
-    key: "getTheme",
-    value:
-    // ==============================
-    // Getters
-    // ==============================
-
-    function getTheme() {
-      // Use the default theme if there are no customisations.
-      if (!this.props.theme) {
-        return _theme.defaultTheme;
-      }
-      // If the theme prop is a function, assume the function
-      // knows how to merge the passed-in default theme with
-      // its own modifications.
-      if (typeof this.props.theme === 'function') {
-        return this.props.theme(_theme.defaultTheme);
-      }
-      // Otherwise, if a plain theme object was passed in,
-      // overlay it with the default theme.
-      return _objectSpread(_objectSpread({}, _theme.defaultTheme), this.props.theme);
-    }
   }, {
     key: "getCommonProps",
     value: function getCommonProps() {
@@ -1100,8 +1079,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         options: options,
         selectOption: selectOption,
         selectProps: props,
-        setValue: setValue,
-        theme: this.getTheme()
+        setValue: setValue
       };
     }
   }, {
@@ -1410,8 +1388,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       }
       var innerProps = {
         onMouseDown: this.onClearIndicatorMouseDown,
-        onTouchEnd: this.onClearIndicatorTouchEnd,
-        'aria-hidden': 'true'
+        onTouchEnd: this.onClearIndicatorTouchEnd
       };
       var isCompact = spacing === 'compact';
       return /*#__PURE__*/_react.default.createElement(ClearIndicator, (0, _extends2.default)({
@@ -1447,30 +1424,11 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         isCompact: isCompact
       }));
     }
-  }, {
-    key: "renderIndicatorSeparator",
-    value: function renderIndicatorSeparator() {
-      var _this$getComponents5 = this.getComponents(),
-        DropdownIndicator = _this$getComponents5.DropdownIndicator,
-        IndicatorSeparator = _this$getComponents5.IndicatorSeparator;
-
-      // separator doesn't make sense without the dropdown indicator
-      if (!DropdownIndicator || !IndicatorSeparator) {
-        return null;
-      }
-      var commonProps = this.commonProps;
-      var isDisabled = this.props.isDisabled;
-      var isFocused = this.state.isFocused;
-      return /*#__PURE__*/_react.default.createElement(IndicatorSeparator, (0, _extends2.default)({}, commonProps, {
-        isDisabled: isDisabled,
-        isFocused: isFocused
-      }));
-    }
   }, {
     key: "renderDropdownIndicator",
     value: function renderDropdownIndicator() {
-      var _this$getComponents6 = this.getComponents(),
-        DropdownIndicator = _this$getComponents6.DropdownIndicator;
+      var _this$getComponents5 = this.getComponents(),
+        DropdownIndicator = _this$getComponents5.DropdownIndicator;
       if (!DropdownIndicator) {
         return null;
       }
@@ -1496,15 +1454,15 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
     key: "renderMenu",
     value: function renderMenu() {
       var _this4 = this;
-      var _this$getComponents7 = this.getComponents(),
-        Group = _this$getComponents7.Group,
-        GroupHeading = _this$getComponents7.GroupHeading,
-        Menu = _this$getComponents7.Menu,
-        MenuList = _this$getComponents7.MenuList,
-        MenuPortal = _this$getComponents7.MenuPortal,
-        LoadingMessage = _this$getComponents7.LoadingMessage,
-        NoOptionsMessage = _this$getComponents7.NoOptionsMessage,
-        Option = _this$getComponents7.Option;
+      var _this$getComponents6 = this.getComponents(),
+        Group = _this$getComponents6.Group,
+        GroupHeading = _this$getComponents6.GroupHeading,
+        Menu = _this$getComponents6.Menu,
+        MenuList = _this$getComponents6.MenuList,
+        MenuPortal = _this$getComponents6.MenuPortal,
+        LoadingMessage = _this$getComponents6.LoadingMessage,
+        NoOptionsMessage = _this$getComponents6.NoOptionsMessage,
+        Option = _this$getComponents6.Option;
       var commonProps = this.commonProps;
       var focusedOption = this.state.focusedOption;
       var _this$props13 = this.props,
@@ -1759,11 +1717,11 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var _this$getComponents8 = this.getComponents(),
-        Control = _this$getComponents8.Control,
-        IndicatorsContainer = _this$getComponents8.IndicatorsContainer,
-        SelectContainer = _this$getComponents8.SelectContainer,
-        ValueContainer = _this$getComponents8.ValueContainer;
+      var _this$getComponents7 = this.getComponents(),
+        Control = _this$getComponents7.Control,
+        IndicatorsContainer = _this$getComponents7.IndicatorsContainer,
+        SelectContainer = _this$getComponents7.SelectContainer,
+        ValueContainer = _this$getComponents7.ValueContainer;
       var _this$props15 = this.props,
         className = _this$props15.className,
         id = _this$props15.id,
@@ -1803,7 +1761,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
         isCompact: isCompact
       }), this.renderPlaceholderOrValue(), this.renderInput()), /*#__PURE__*/_react.default.createElement(IndicatorsContainer, (0, _extends2.default)({}, commonProps, {
         isDisabled: isDisabled
-      }), this.renderClearIndicator(), this.renderLoadingIndicator(), this.renderIndicatorSeparator(), this.renderDropdownIndicator())), this.renderMenu(), this.renderFormField());
+      }), this.renderClearIndicator(), this.renderLoadingIndicator(), this.renderDropdownIndicator())), this.renderMenu(), this.renderFormField());
     }
   }], [{
     key: "getDerivedStateFromProps",
@@ -1867,6 +1825,5 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
       });
     }
   }]);
-  return Select;
 }(_react.Component);
 (0, _defineProperty2.default)(Select, "defaultProps", defaultProps);

package/dist/cjs/styles.js

@@ -27,7 +27,6 @@ var defaultStyles = exports.defaultStyles = {
   group: _group.groupCSS,
   groupHeading: _group.groupHeadingCSS,
   indicatorsContainer: _containers.indicatorsContainerCSS,
-  indicatorSeparator: _indicators.indicatorSeparatorCSS,
   input: _input.inputCSS,
   loadingIndicator: _indicators.loadingIndicatorCSS,
   loadingMessage: _menu.loadingMessageCSS,

package/dist/cjs/utils.js

@@ -31,7 +31,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-var _excluded = ["className", "clearValue", "cx", "getStyles", "getClassNames", "getValue", "hasValue", "isMulti", "isRtl", "options", "selectOption", "selectProps", "setValue", "theme"];
+var _excluded = ["className", "clearValue", "cx", "getStyles", "getClassNames", "getValue", "hasValue", "isMulti", "isRtl", "options", "selectOption", "selectProps", "setValue"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 // ==============================
@@ -116,7 +116,6 @@ var cleanCommonProps = exports.cleanCommonProps = function cleanCommonProps(prop
     selectOption = props.selectOption,
     selectProps = props.selectProps,
     setValue = props.setValue,
-    theme = props.theme,
     innerProps = (0, _objectWithoutProperties2.default)(props, _excluded);
   return _objectSpread({}, innerProps);
 };

package/dist/es2019/components/group.js

@@ -20,16 +20,12 @@ const Group = props => {
     headingProps,
     innerProps,
     label,
-    theme,
     selectProps
   } = props;
   return jsx("div", _extends({}, getStyleProps(props, 'group', {
     group: true
   }), innerProps), jsx(Heading, _extends({}, headingProps, {
-    selectProps: selectProps
-    // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
-    ,
-    theme: theme,
+    selectProps: selectProps,
     getStyles: getStyles,
     getClassNames: getClassNames,
     cx: cx
@@ -39,13 +35,12 @@ export const groupHeadingCSS = ({}) => ({
   label: 'group',
   cursor: 'default',
   display: 'block',
-  fontSize: '75%',
   marginBottom: '0.25em',
   paddingLeft: "var(--ds-space-150, 12px)",
   paddingRight: "var(--ds-space-150, 12px)",
   font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
   color: "var(--ds-text-subtle, #44546F)",
-  fontWeight: `${"var(--ds-font-weight-bold, 700)"} !important`,
+  fontWeight: "var(--ds-font-weight-bold, 700)",
   textTransform: 'none'
 });
 

package/dist/es2019/components/index.js

@@ -1,7 +1,7 @@
 import { IndicatorsContainer, SelectContainer, ValueContainer } from './containers';
 import Control from './control';
 import Group, { GroupHeading } from './group';
-import { ClearIndicator, CrossIcon, DownChevron, DropdownIndicator, IndicatorSeparator, LoadingIndicator } from './indicators';
+import { ClearIndicator, DropdownIndicator, LoadingIndicator } from './indicators';
 import Input from './input';
 import Menu, { LoadingMessage, MenuList, MenuPortal, NoOptionsMessage } from './menu';
 import MultiValue, { MultiValueContainer, MultiValueLabel, MultiValueRemove } from './multi-value';
@@ -12,12 +12,9 @@ export const components = {
   ClearIndicator: ClearIndicator,
   Control: Control,
   DropdownIndicator: DropdownIndicator,
-  DownChevron: DownChevron,
-  CrossIcon: CrossIcon,
   Group: Group,
   GroupHeading: GroupHeading,
   IndicatorsContainer: IndicatorsContainer,
-  IndicatorSeparator: IndicatorSeparator,
   Input: Input,
   LoadingIndicator: LoadingIndicator,
   Menu: Menu,