@atlaskit/react-select 1.5.2 → 1.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (66) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/cjs/components/group.js +2 -7
  3. package/dist/cjs/components/index.js +0 -3
  4. package/dist/cjs/components/indicators.js +54 -133
  5. package/dist/cjs/components/input.js +5 -8
  6. package/dist/cjs/components/internal/dummy-input.js +1 -0
  7. package/dist/cjs/components/menu.js +16 -18
  8. package/dist/cjs/components/multi-value.js +48 -10
  9. package/dist/cjs/components/option.js +1 -0
  10. package/dist/cjs/components/single-value.js +1 -2
  11. package/dist/cjs/index.js +0 -7
  12. package/dist/cjs/select.js +96 -135
  13. package/dist/cjs/styles.js +0 -1
  14. package/dist/cjs/utils.js +1 -2
  15. package/dist/es2019/components/group.js +2 -7
  16. package/dist/es2019/components/index.js +1 -4
  17. package/dist/es2019/components/indicators.js +39 -113
  18. package/dist/es2019/components/input.js +5 -9
  19. package/dist/es2019/components/internal/dummy-input.js +1 -0
  20. package/dist/es2019/components/menu.js +16 -26
  21. package/dist/es2019/components/multi-value.js +49 -12
  22. package/dist/es2019/components/option.js +1 -0
  23. package/dist/es2019/components/single-value.js +1 -4
  24. package/dist/es2019/index.js +0 -1
  25. package/dist/es2019/select.js +15 -56
  26. package/dist/es2019/styles.js +1 -2
  27. package/dist/es2019/utils.js +0 -2
  28. package/dist/esm/components/group.js +2 -7
  29. package/dist/esm/components/index.js +1 -4
  30. package/dist/esm/components/indicators.js +54 -133
  31. package/dist/esm/components/input.js +5 -8
  32. package/dist/esm/components/internal/dummy-input.js +1 -0
  33. package/dist/esm/components/menu.js +16 -18
  34. package/dist/esm/components/multi-value.js +49 -11
  35. package/dist/esm/components/option.js +1 -0
  36. package/dist/esm/components/single-value.js +1 -2
  37. package/dist/esm/index.js +0 -1
  38. package/dist/esm/select.js +96 -135
  39. package/dist/esm/styles.js +1 -2
  40. package/dist/esm/utils.js +1 -2
  41. package/dist/types/components/group.d.ts +1 -2
  42. package/dist/types/components/index.d.ts +16 -22
  43. package/dist/types/components/indicators.d.ts +1 -16
  44. package/dist/types/components/input.d.ts +1 -1
  45. package/dist/types/components/menu.d.ts +3 -3
  46. package/dist/types/components/multi-value.d.ts +3 -2
  47. package/dist/types/components/single-value.d.ts +1 -1
  48. package/dist/types/index.d.ts +1 -3
  49. package/dist/types/select.d.ts +15 -28
  50. package/dist/types/styles.d.ts +1 -3
  51. package/dist/types/theme.d.ts +0 -1
  52. package/dist/types/types.d.ts +0 -1
  53. package/dist/types-ts4.5/components/group.d.ts +1 -2
  54. package/dist/types-ts4.5/components/index.d.ts +16 -22
  55. package/dist/types-ts4.5/components/indicators.d.ts +1 -16
  56. package/dist/types-ts4.5/components/input.d.ts +1 -1
  57. package/dist/types-ts4.5/components/menu.d.ts +3 -3
  58. package/dist/types-ts4.5/components/multi-value.d.ts +3 -2
  59. package/dist/types-ts4.5/components/single-value.d.ts +1 -1
  60. package/dist/types-ts4.5/index.d.ts +1 -3
  61. package/dist/types-ts4.5/select.d.ts +15 -28
  62. package/dist/types-ts4.5/styles.d.ts +1 -3
  63. package/dist/types-ts4.5/theme.d.ts +0 -1
  64. package/dist/types-ts4.5/types.d.ts +0 -1
  65. package/package.json +9 -3
  66. package/types/package.json +17 -0
@@ -9,10 +9,9 @@ exports.defaultProps = exports.default = void 0;
9
9
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
10
10
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
11
11
  var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
12
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
13
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
14
12
  var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
15
13
  var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
14
+ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
16
15
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
17
16
  var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
18
17
  var _react = _interopRequireWildcard(require("react"));
@@ -25,16 +24,16 @@ var _liveRegion = _interopRequireDefault(require("./components/live-region"));
25
24
  var _menu = require("./components/menu");
26
25
  var _filters = require("./filters");
27
26
  var _styles = require("./styles");
28
- var _theme = require("./theme");
29
27
  var _utils = require("./utils");
30
28
  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); }
31
29
  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; }
32
30
  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; }
33
31
  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; }
34
- 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); }; }
32
+ 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)); }
35
33
  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 */
36
34
  var defaultProps = exports.defaultProps = {
37
35
  // aria-live is by default with the live region so we don't need it
36
+ // eslint-disable-next-line @atlaskit/platform/no-module-level-eval
38
37
  'aria-live': (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? undefined : 'polite',
39
38
  backspaceRemovesValue: true,
40
39
  blurInputOnSelect: (0, _utils.isTouchCapable)(),
@@ -226,16 +225,14 @@ var instanceId = 1;
226
225
 
227
226
  // eslint-disable-next-line @repo/internal/react/no-class-components
228
227
  var Select = exports.default = /*#__PURE__*/function (_Component) {
229
- (0, _inherits2.default)(Select, _Component);
230
- var _super = _createSuper(Select);
231
228
  // Lifecycle
232
229
  // ------------------------------
233
230
 
234
231
  function Select(_props) {
235
232
  var _this;
236
233
  (0, _classCallCheck2.default)(this, Select);
237
- _this = _super.call(this, _props);
238
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
234
+ _this = _callSuper(this, Select, [_props]);
235
+ (0, _defineProperty2.default)(_this, "state", {
239
236
  ariaSelection: null,
240
237
  focusedOption: null,
241
238
  focusedOptionId: null,
@@ -252,36 +249,36 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
252
249
  });
253
250
  // Misc. Instance Properties
254
251
  // ------------------------------
255
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "blockOptionHover", false);
256
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isComposing", false);
252
+ (0, _defineProperty2.default)(_this, "blockOptionHover", false);
253
+ (0, _defineProperty2.default)(_this, "isComposing", false);
257
254
  // TODO
258
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "initialTouchX", 0);
259
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "initialTouchY", 0);
260
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "openAfterFocus", false);
261
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "scrollToFocusedOptionOnUpdate", false);
262
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isVoiceOver", (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') && (0, _helpers.isAppleDevice)());
255
+ (0, _defineProperty2.default)(_this, "initialTouchX", 0);
256
+ (0, _defineProperty2.default)(_this, "initialTouchY", 0);
257
+ (0, _defineProperty2.default)(_this, "openAfterFocus", false);
258
+ (0, _defineProperty2.default)(_this, "scrollToFocusedOptionOnUpdate", false);
259
+ (0, _defineProperty2.default)(_this, "isVoiceOver", (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') && (0, _helpers.isAppleDevice)());
263
260
  // Refs
264
261
  // ------------------------------
265
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "controlRef", null);
266
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getControlRef", function (ref) {
262
+ (0, _defineProperty2.default)(_this, "controlRef", null);
263
+ (0, _defineProperty2.default)(_this, "getControlRef", function (ref) {
267
264
  _this.controlRef = ref;
268
265
  });
269
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "focusedOptionRef", null);
270
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFocusedOptionRef", function (ref) {
266
+ (0, _defineProperty2.default)(_this, "focusedOptionRef", null);
267
+ (0, _defineProperty2.default)(_this, "getFocusedOptionRef", function (ref) {
271
268
  _this.focusedOptionRef = ref;
272
269
  });
273
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "menuListRef", null);
274
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getMenuListRef", function (ref) {
270
+ (0, _defineProperty2.default)(_this, "menuListRef", null);
271
+ (0, _defineProperty2.default)(_this, "getMenuListRef", function (ref) {
275
272
  _this.menuListRef = ref;
276
273
  });
277
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "inputRef", null);
278
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getInputRef", function (ref) {
274
+ (0, _defineProperty2.default)(_this, "inputRef", null);
275
+ (0, _defineProperty2.default)(_this, "getInputRef", function (ref) {
279
276
  _this.inputRef = ref;
280
277
  });
281
278
  // aliased for consumers
282
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "focus", _this.focusInput);
283
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "blur", _this.blurInput);
284
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onChange", function (newValue, actionMeta) {
279
+ (0, _defineProperty2.default)(_this, "focus", _this.focusInput);
280
+ (0, _defineProperty2.default)(_this, "blur", _this.blurInput);
281
+ (0, _defineProperty2.default)(_this, "onChange", function (newValue, actionMeta) {
285
282
  var _this$props = _this.props,
286
283
  onChange = _this$props.onChange,
287
284
  name = _this$props.name;
@@ -289,7 +286,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
289
286
  _this.ariaOnChange(newValue, actionMeta);
290
287
  onChange(newValue, actionMeta);
291
288
  });
292
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setValue", function (newValue, action, option) {
289
+ (0, _defineProperty2.default)(_this, "setValue", function (newValue, action, option) {
293
290
  var _this$props2 = _this.props,
294
291
  closeMenuOnSelect = _this$props2.closeMenuOnSelect,
295
292
  isMulti = _this$props2.isMulti,
@@ -313,7 +310,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
313
310
  option: option
314
311
  });
315
312
  });
316
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "selectOption", function (newValue) {
313
+ (0, _defineProperty2.default)(_this, "selectOption", function (newValue) {
317
314
  var _this$props3 = _this.props,
318
315
  blurInputOnSelect = _this$props3.blurInputOnSelect,
319
316
  isMulti = _this$props3.isMulti,
@@ -345,7 +342,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
345
342
  _this.blurInput();
346
343
  }
347
344
  });
348
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "removeValue", function (removedValue) {
345
+ (0, _defineProperty2.default)(_this, "removeValue", function (removedValue) {
349
346
  var isMulti = _this.props.isMulti;
350
347
  var selectValue = _this.state.selectValue;
351
348
  var candidate = _this.getOptionValue(removedValue);
@@ -359,14 +356,14 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
359
356
  });
360
357
  _this.focusInput();
361
358
  });
362
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "clearValue", function () {
359
+ (0, _defineProperty2.default)(_this, "clearValue", function () {
363
360
  var selectValue = _this.state.selectValue;
364
361
  _this.onChange((0, _utils.valueTernary)(_this.props.isMulti, [], null), {
365
362
  action: 'clear',
366
363
  removedValues: selectValue
367
364
  });
368
365
  });
369
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "popValue", function () {
366
+ (0, _defineProperty2.default)(_this, "popValue", function () {
370
367
  var isMulti = _this.props.isMulti;
371
368
  var selectValue = _this.state.selectValue;
372
369
  var lastSelectedValue = selectValue[selectValue.length - 1];
@@ -377,59 +374,62 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
377
374
  removedValue: lastSelectedValue
378
375
  });
379
376
  });
380
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFocusedOptionId", function (focusedOption) {
377
+ // ==============================
378
+ // Getters
379
+ // ==============================
380
+ (0, _defineProperty2.default)(_this, "getFocusedOptionId", function (focusedOption) {
381
381
  return getFocusedOptionId(_this.state.focusableOptionsWithIds, focusedOption);
382
382
  });
383
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFocusableOptionsWithIds", function () {
383
+ (0, _defineProperty2.default)(_this, "getFocusableOptionsWithIds", function () {
384
384
  return buildFocusableOptionsWithIds(buildCategorizedOptions(_this.props, _this.state.selectValue), _this.getElementId('option'));
385
385
  });
386
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getValue", function () {
386
+ (0, _defineProperty2.default)(_this, "getValue", function () {
387
387
  return _this.state.selectValue;
388
388
  });
389
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "cx", function () {
389
+ (0, _defineProperty2.default)(_this, "cx", function () {
390
390
  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
391
391
  args[_key] = arguments[_key];
392
392
  }
393
393
  return _utils.classNames.apply(void 0, [_this.props.classNamePrefix].concat(args));
394
394
  });
395
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getOptionLabel", function (data) {
395
+ (0, _defineProperty2.default)(_this, "getOptionLabel", function (data) {
396
396
  return getOptionLabel(_this.props, data);
397
397
  });
398
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getOptionValue", function (data) {
398
+ (0, _defineProperty2.default)(_this, "getOptionValue", function (data) {
399
399
  return getOptionValue(_this.props, data);
400
400
  });
401
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getStyles", function (key, props) {
401
+ (0, _defineProperty2.default)(_this, "getStyles", function (key, props) {
402
402
  var base = _styles.defaultStyles[key](props);
403
403
  base.boxSizing = 'border-box';
404
404
  var custom = _this.props.styles[key];
405
405
  return custom ? custom(base, props) : base;
406
406
  });
407
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getClassNames", function (key, props) {
407
+ (0, _defineProperty2.default)(_this, "getClassNames", function (key, props) {
408
408
  var _this$props$className, _this$props$className2;
409
409
  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);
410
410
  });
411
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getElementId", function (element) {
411
+ (0, _defineProperty2.default)(_this, "getElementId", function (element) {
412
412
  return "".concat(_this.state.instancePrefix, "-").concat(element);
413
413
  });
414
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getComponents", function () {
414
+ (0, _defineProperty2.default)(_this, "getComponents", function () {
415
415
  return (0, _components.defaultComponents)(_this.props);
416
416
  });
417
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "buildCategorizedOptions", function () {
417
+ (0, _defineProperty2.default)(_this, "buildCategorizedOptions", function () {
418
418
  return buildCategorizedOptions(_this.props, _this.state.selectValue);
419
419
  });
420
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getCategorizedOptions", function () {
420
+ (0, _defineProperty2.default)(_this, "getCategorizedOptions", function () {
421
421
  return _this.props.menuIsOpen ? _this.buildCategorizedOptions() : [];
422
422
  });
423
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "buildFocusableOptions", function () {
423
+ (0, _defineProperty2.default)(_this, "buildFocusableOptions", function () {
424
424
  return buildFocusableOptionsFromCategorizedOptions(_this.buildCategorizedOptions());
425
425
  });
426
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFocusableOptions", function () {
426
+ (0, _defineProperty2.default)(_this, "getFocusableOptions", function () {
427
427
  return _this.props.menuIsOpen ? _this.buildFocusableOptions() : [];
428
428
  });
429
429
  // ==============================
430
430
  // Helpers
431
431
  // ==============================
432
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "ariaOnChange", function (value, actionMeta) {
432
+ (0, _defineProperty2.default)(_this, "ariaOnChange", function (value, actionMeta) {
433
433
  _this.setState({
434
434
  ariaSelection: _objectSpread({
435
435
  value: value
@@ -439,7 +439,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
439
439
  // ==============================
440
440
  // Mouse Handlers
441
441
  // ==============================
442
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onMenuMouseDown", function (event) {
442
+ (0, _defineProperty2.default)(_this, "onMenuMouseDown", function (event) {
443
443
  if (event.button !== 0) {
444
444
  return;
445
445
  }
@@ -447,10 +447,10 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
447
447
  event.preventDefault();
448
448
  _this.focusInput();
449
449
  });
450
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onMenuMouseMove", function (event) {
450
+ (0, _defineProperty2.default)(_this, "onMenuMouseMove", function (event) {
451
451
  _this.blockOptionHover = false;
452
452
  });
453
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onControlMouseDown", function (event) {
453
+ (0, _defineProperty2.default)(_this, "onControlMouseDown", function (event) {
454
454
  // Event captured by dropdown indicator
455
455
  if (event.defaultPrevented) {
456
456
  var _this$controlRef;
@@ -479,7 +479,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
479
479
  event.preventDefault();
480
480
  }
481
481
  });
482
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onDropdownIndicatorMouseDown", function (event) {
482
+ (0, _defineProperty2.default)(_this, "onDropdownIndicatorMouseDown", function (event) {
483
483
  // ignore mouse events that weren't triggered by the primary button
484
484
  if (event && event.type === 'mousedown' && event.button !== 0) {
485
485
  return;
@@ -501,7 +501,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
501
501
  }
502
502
  event.preventDefault();
503
503
  });
504
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onClearIndicatorMouseDown", function (event) {
504
+ (0, _defineProperty2.default)(_this, "onClearIndicatorMouseDown", function (event) {
505
505
  // ignore mouse events that weren't triggered by the primary button
506
506
  if (event && event.type === 'mousedown' && event.button !== 0) {
507
507
  return;
@@ -517,7 +517,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
517
517
  });
518
518
  }
519
519
  });
520
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onScroll", function (event) {
520
+ (0, _defineProperty2.default)(_this, "onScroll", function (event) {
521
521
  if (typeof _this.props.closeMenuOnScroll === 'boolean') {
522
522
  if (event.target instanceof HTMLElement && (0, _utils.isDocumentElement)(event.target)) {
523
523
  _this.props.onMenuClose();
@@ -528,13 +528,13 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
528
528
  }
529
529
  }
530
530
  });
531
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onCompositionStart", function () {
531
+ (0, _defineProperty2.default)(_this, "onCompositionStart", function () {
532
532
  _this.isComposing = true;
533
533
  });
534
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onCompositionEnd", function () {
534
+ (0, _defineProperty2.default)(_this, "onCompositionEnd", function () {
535
535
  _this.isComposing = false;
536
536
  });
537
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onTouchStart", function (_ref2) {
537
+ (0, _defineProperty2.default)(_this, "onTouchStart", function (_ref2) {
538
538
  var touches = _ref2.touches;
539
539
  var touch = touches && touches.item(0);
540
540
  if (!touch) {
@@ -544,7 +544,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
544
544
  _this.initialTouchY = touch.clientY;
545
545
  _this.userIsDragging = false;
546
546
  });
547
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onTouchMove", function (_ref3) {
547
+ (0, _defineProperty2.default)(_this, "onTouchMove", function (_ref3) {
548
548
  var touches = _ref3.touches;
549
549
  var touch = touches && touches.item(0);
550
550
  if (!touch) {
@@ -555,7 +555,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
555
555
  var moveThreshold = 5;
556
556
  _this.userIsDragging = deltaX > moveThreshold || deltaY > moveThreshold;
557
557
  });
558
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onTouchEnd", function (event) {
558
+ (0, _defineProperty2.default)(_this, "onTouchEnd", function (event) {
559
559
  if (_this.userIsDragging) {
560
560
  return;
561
561
  }
@@ -571,19 +571,19 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
571
571
  _this.initialTouchX = 0;
572
572
  _this.initialTouchY = 0;
573
573
  });
574
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onControlTouchEnd", function (event) {
574
+ (0, _defineProperty2.default)(_this, "onControlTouchEnd", function (event) {
575
575
  if (_this.userIsDragging) {
576
576
  return;
577
577
  }
578
578
  _this.onControlMouseDown(event);
579
579
  });
580
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onClearIndicatorTouchEnd", function (event) {
580
+ (0, _defineProperty2.default)(_this, "onClearIndicatorTouchEnd", function (event) {
581
581
  if (_this.userIsDragging) {
582
582
  return;
583
583
  }
584
584
  _this.onClearIndicatorMouseDown(event);
585
585
  });
586
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onDropdownIndicatorTouchEnd", function (event) {
586
+ (0, _defineProperty2.default)(_this, "onDropdownIndicatorTouchEnd", function (event) {
587
587
  if (_this.userIsDragging) {
588
588
  return;
589
589
  }
@@ -592,7 +592,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
592
592
  // ==============================
593
593
  // Focus Handlers
594
594
  // ==============================
595
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleInputChange", function (event) {
595
+ (0, _defineProperty2.default)(_this, "handleInputChange", function (event) {
596
596
  var prevInputValue = _this.props.inputValue;
597
597
  var inputValue = event.currentTarget.value;
598
598
  _this.setState({
@@ -606,7 +606,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
606
606
  _this.onMenuOpen();
607
607
  }
608
608
  });
609
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onInputFocus", function (event) {
609
+ (0, _defineProperty2.default)(_this, "onInputFocus", function (event) {
610
610
  if (_this.props.onFocus) {
611
611
  _this.props.onFocus(event);
612
612
  }
@@ -619,7 +619,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
619
619
  }
620
620
  _this.openAfterFocus = false;
621
621
  });
622
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onInputBlur", function (event) {
622
+ (0, _defineProperty2.default)(_this, "onInputBlur", function (event) {
623
623
  var prevInputValue = _this.props.inputValue;
624
624
  if (_this.menuListRef && _this.menuListRef.contains(document.activeElement)) {
625
625
  _this.inputRef.focus();
@@ -638,7 +638,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
638
638
  isFocused: false
639
639
  });
640
640
  });
641
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onOptionHover", function (focusedOption) {
641
+ (0, _defineProperty2.default)(_this, "onOptionHover", function (focusedOption) {
642
642
  if (_this.blockOptionHover || _this.state.focusedOption === focusedOption) {
643
643
  return;
644
644
  }
@@ -649,12 +649,12 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
649
649
  focusedOptionId: focusedOptionIndex > -1 ? _this.getFocusedOptionId(focusedOption) : null
650
650
  });
651
651
  });
652
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "shouldHideSelectedOptions", function () {
652
+ (0, _defineProperty2.default)(_this, "shouldHideSelectedOptions", function () {
653
653
  return shouldHideSelectedOptions(_this.props);
654
654
  });
655
655
  // If the hidden input gets focus through form submit,
656
656
  // redirect focus to focusable input.
657
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onValueInputFocus", function (e) {
657
+ (0, _defineProperty2.default)(_this, "onValueInputFocus", function (e) {
658
658
  e.preventDefault();
659
659
  e.stopPropagation();
660
660
  _this.focus();
@@ -662,7 +662,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
662
662
  // ==============================
663
663
  // Keyboard Handlers
664
664
  // ==============================
665
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onKeyDown", function (event) {
665
+ (0, _defineProperty2.default)(_this, "onKeyDown", function (event) {
666
666
  var _this$props5 = _this.props,
667
667
  isMulti = _this$props5.isMulti,
668
668
  backspaceRemovesValue = _this$props5.backspaceRemovesValue,
@@ -835,7 +835,8 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
835
835
  }
836
836
  return _this;
837
837
  }
838
- (0, _createClass2.default)(Select, [{
838
+ (0, _inherits2.default)(Select, _Component);
839
+ return (0, _createClass2.default)(Select, [{
839
840
  key: "componentDidMount",
840
841
  value: function componentDidMount() {
841
842
  this.startListeningComposition();
@@ -1051,28 +1052,6 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1051
1052
  focusedOptionId: this.getFocusedOptionId(options[nextFocus])
1052
1053
  });
1053
1054
  }
1054
- }, {
1055
- key: "getTheme",
1056
- value:
1057
- // ==============================
1058
- // Getters
1059
- // ==============================
1060
-
1061
- function getTheme() {
1062
- // Use the default theme if there are no customisations.
1063
- if (!this.props.theme) {
1064
- return _theme.defaultTheme;
1065
- }
1066
- // If the theme prop is a function, assume the function
1067
- // knows how to merge the passed-in default theme with
1068
- // its own modifications.
1069
- if (typeof this.props.theme === 'function') {
1070
- return this.props.theme(_theme.defaultTheme);
1071
- }
1072
- // Otherwise, if a plain theme object was passed in,
1073
- // overlay it with the default theme.
1074
- return _objectSpread(_objectSpread({}, _theme.defaultTheme), this.props.theme);
1075
- }
1076
1055
  }, {
1077
1056
  key: "getCommonProps",
1078
1057
  value: function getCommonProps() {
@@ -1100,8 +1079,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1100
1079
  options: options,
1101
1080
  selectOption: selectOption,
1102
1081
  selectProps: props,
1103
- setValue: setValue,
1104
- theme: this.getTheme()
1082
+ setValue: setValue
1105
1083
  };
1106
1084
  }
1107
1085
  }, {
@@ -1410,8 +1388,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1410
1388
  }
1411
1389
  var innerProps = {
1412
1390
  onMouseDown: this.onClearIndicatorMouseDown,
1413
- onTouchEnd: this.onClearIndicatorTouchEnd,
1414
- 'aria-hidden': 'true'
1391
+ onTouchEnd: this.onClearIndicatorTouchEnd
1415
1392
  };
1416
1393
  var isCompact = spacing === 'compact';
1417
1394
  return /*#__PURE__*/_react.default.createElement(ClearIndicator, (0, _extends2.default)({
@@ -1447,30 +1424,11 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1447
1424
  isCompact: isCompact
1448
1425
  }));
1449
1426
  }
1450
- }, {
1451
- key: "renderIndicatorSeparator",
1452
- value: function renderIndicatorSeparator() {
1453
- var _this$getComponents5 = this.getComponents(),
1454
- DropdownIndicator = _this$getComponents5.DropdownIndicator,
1455
- IndicatorSeparator = _this$getComponents5.IndicatorSeparator;
1456
-
1457
- // separator doesn't make sense without the dropdown indicator
1458
- if (!DropdownIndicator || !IndicatorSeparator) {
1459
- return null;
1460
- }
1461
- var commonProps = this.commonProps;
1462
- var isDisabled = this.props.isDisabled;
1463
- var isFocused = this.state.isFocused;
1464
- return /*#__PURE__*/_react.default.createElement(IndicatorSeparator, (0, _extends2.default)({}, commonProps, {
1465
- isDisabled: isDisabled,
1466
- isFocused: isFocused
1467
- }));
1468
- }
1469
1427
  }, {
1470
1428
  key: "renderDropdownIndicator",
1471
1429
  value: function renderDropdownIndicator() {
1472
- var _this$getComponents6 = this.getComponents(),
1473
- DropdownIndicator = _this$getComponents6.DropdownIndicator;
1430
+ var _this$getComponents5 = this.getComponents(),
1431
+ DropdownIndicator = _this$getComponents5.DropdownIndicator;
1474
1432
  if (!DropdownIndicator) {
1475
1433
  return null;
1476
1434
  }
@@ -1496,15 +1454,15 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1496
1454
  key: "renderMenu",
1497
1455
  value: function renderMenu() {
1498
1456
  var _this4 = this;
1499
- var _this$getComponents7 = this.getComponents(),
1500
- Group = _this$getComponents7.Group,
1501
- GroupHeading = _this$getComponents7.GroupHeading,
1502
- Menu = _this$getComponents7.Menu,
1503
- MenuList = _this$getComponents7.MenuList,
1504
- MenuPortal = _this$getComponents7.MenuPortal,
1505
- LoadingMessage = _this$getComponents7.LoadingMessage,
1506
- NoOptionsMessage = _this$getComponents7.NoOptionsMessage,
1507
- Option = _this$getComponents7.Option;
1457
+ var _this$getComponents6 = this.getComponents(),
1458
+ Group = _this$getComponents6.Group,
1459
+ GroupHeading = _this$getComponents6.GroupHeading,
1460
+ Menu = _this$getComponents6.Menu,
1461
+ MenuList = _this$getComponents6.MenuList,
1462
+ MenuPortal = _this$getComponents6.MenuPortal,
1463
+ LoadingMessage = _this$getComponents6.LoadingMessage,
1464
+ NoOptionsMessage = _this$getComponents6.NoOptionsMessage,
1465
+ Option = _this$getComponents6.Option;
1508
1466
  var commonProps = this.commonProps;
1509
1467
  var focusedOption = this.state.focusedOption;
1510
1468
  var _this$props13 = this.props,
@@ -1751,19 +1709,23 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1751
1709
  }, {
1752
1710
  key: "renderMultiselectMessage",
1753
1711
  value: function renderMultiselectMessage() {
1754
- return /*#__PURE__*/_react.default.createElement("span", {
1755
- id: this.getElementId('multi-message'),
1756
- hidden: true
1757
- }, ", multiple selections available,");
1712
+ return (
1713
+ /*#__PURE__*/
1714
+ // eslint-disable-next-line @atlaskit/design-system/use-primitives-text
1715
+ _react.default.createElement("span", {
1716
+ id: this.getElementId('multi-message'),
1717
+ hidden: true
1718
+ }, ", multiple selections available,")
1719
+ );
1758
1720
  }
1759
1721
  }, {
1760
1722
  key: "render",
1761
1723
  value: function render() {
1762
- var _this$getComponents8 = this.getComponents(),
1763
- Control = _this$getComponents8.Control,
1764
- IndicatorsContainer = _this$getComponents8.IndicatorsContainer,
1765
- SelectContainer = _this$getComponents8.SelectContainer,
1766
- ValueContainer = _this$getComponents8.ValueContainer;
1724
+ var _this$getComponents7 = this.getComponents(),
1725
+ Control = _this$getComponents7.Control,
1726
+ IndicatorsContainer = _this$getComponents7.IndicatorsContainer,
1727
+ SelectContainer = _this$getComponents7.SelectContainer,
1728
+ ValueContainer = _this$getComponents7.ValueContainer;
1767
1729
  var _this$props15 = this.props,
1768
1730
  className = _this$props15.className,
1769
1731
  id = _this$props15.id,
@@ -1803,7 +1765,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1803
1765
  isCompact: isCompact
1804
1766
  }), this.renderPlaceholderOrValue(), this.renderInput()), /*#__PURE__*/_react.default.createElement(IndicatorsContainer, (0, _extends2.default)({}, commonProps, {
1805
1767
  isDisabled: isDisabled
1806
- }), this.renderClearIndicator(), this.renderLoadingIndicator(), this.renderIndicatorSeparator(), this.renderDropdownIndicator())), this.renderMenu(), this.renderFormField());
1768
+ }), this.renderClearIndicator(), this.renderLoadingIndicator(), this.renderDropdownIndicator())), this.renderMenu(), this.renderFormField());
1807
1769
  }
1808
1770
  }], [{
1809
1771
  key: "getDerivedStateFromProps",
@@ -1867,6 +1829,5 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1867
1829
  });
1868
1830
  }
1869
1831
  }]);
1870
- return Select;
1871
1832
  }(_react.Component);
1872
1833
  (0, _defineProperty2.default)(Select, "defaultProps", defaultProps);
@@ -27,7 +27,6 @@ var defaultStyles = exports.defaultStyles = {
27
27
  group: _group.groupCSS,
28
28
  groupHeading: _group.groupHeadingCSS,
29
29
  indicatorsContainer: _containers.indicatorsContainerCSS,
30
- indicatorSeparator: _indicators.indicatorSeparatorCSS,
31
30
  input: _input.inputCSS,
32
31
  loadingIndicator: _indicators.loadingIndicatorCSS,
33
32
  loadingMessage: _menu.loadingMessageCSS,
package/dist/cjs/utils.js CHANGED
@@ -31,7 +31,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
31
31
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
32
32
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
33
33
  var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
34
- var _excluded = ["className", "clearValue", "cx", "getStyles", "getClassNames", "getValue", "hasValue", "isMulti", "isRtl", "options", "selectOption", "selectProps", "setValue", "theme"];
34
+ var _excluded = ["className", "clearValue", "cx", "getStyles", "getClassNames", "getValue", "hasValue", "isMulti", "isRtl", "options", "selectOption", "selectProps", "setValue"];
35
35
  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; }
36
36
  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; }
37
37
  // ==============================
@@ -116,7 +116,6 @@ var cleanCommonProps = exports.cleanCommonProps = function cleanCommonProps(prop
116
116
  selectOption = props.selectOption,
117
117
  selectProps = props.selectProps,
118
118
  setValue = props.setValue,
119
- theme = props.theme,
120
119
  innerProps = (0, _objectWithoutProperties2.default)(props, _excluded);
121
120
  return _objectSpread({}, innerProps);
122
121
  };
@@ -20,16 +20,12 @@ const Group = props => {
20
20
  headingProps,
21
21
  innerProps,
22
22
  label,
23
- theme,
24
23
  selectProps
25
24
  } = props;
26
25
  return jsx("div", _extends({}, getStyleProps(props, 'group', {
27
26
  group: true
28
27
  }), innerProps), jsx(Heading, _extends({}, headingProps, {
29
- selectProps: selectProps
30
- // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
31
- ,
32
- theme: theme,
28
+ selectProps: selectProps,
33
29
  getStyles: getStyles,
34
30
  getClassNames: getClassNames,
35
31
  cx: cx
@@ -39,13 +35,12 @@ export const groupHeadingCSS = ({}) => ({
39
35
  label: 'group',
40
36
  cursor: 'default',
41
37
  display: 'block',
42
- fontSize: '75%',
43
38
  marginBottom: '0.25em',
44
39
  paddingLeft: "var(--ds-space-150, 12px)",
45
40
  paddingRight: "var(--ds-space-150, 12px)",
46
41
  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)",
47
42
  color: "var(--ds-text-subtle, #44546F)",
48
- fontWeight: `${"var(--ds-font-weight-bold, 700)"} !important`,
43
+ fontWeight: "var(--ds-font-weight-bold, 700)",
49
44
  textTransform: 'none'
50
45
  });
51
46
 
@@ -1,7 +1,7 @@
1
1
  import { IndicatorsContainer, SelectContainer, ValueContainer } from './containers';
2
2
  import Control from './control';
3
3
  import Group, { GroupHeading } from './group';
4
- import { ClearIndicator, CrossIcon, DownChevron, DropdownIndicator, IndicatorSeparator, LoadingIndicator } from './indicators';
4
+ import { ClearIndicator, DropdownIndicator, LoadingIndicator } from './indicators';
5
5
  import Input from './input';
6
6
  import Menu, { LoadingMessage, MenuList, MenuPortal, NoOptionsMessage } from './menu';
7
7
  import MultiValue, { MultiValueContainer, MultiValueLabel, MultiValueRemove } from './multi-value';
@@ -12,12 +12,9 @@ export const components = {
12
12
  ClearIndicator: ClearIndicator,
13
13
  Control: Control,
14
14
  DropdownIndicator: DropdownIndicator,
15
- DownChevron: DownChevron,
16
- CrossIcon: CrossIcon,
17
15
  Group: Group,
18
16
  GroupHeading: GroupHeading,
19
17
  IndicatorsContainer: IndicatorsContainer,
20
- IndicatorSeparator: IndicatorSeparator,
21
18
  Input: Input,
22
19
  LoadingIndicator: LoadingIndicator,
23
20
  Menu: Menu,