downshift 6.1.6 → 6.1.9

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.
@@ -2,10 +2,6 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var _objectWithoutPropertiesLoose = require('@babel/runtime/helpers/objectWithoutPropertiesLoose');
6
- var _extends = require('@babel/runtime/helpers/extends');
7
- var _assertThisInitialized = require('@babel/runtime/helpers/assertThisInitialized');
8
- var _inheritsLoose = require('@babel/runtime/helpers/inheritsLoose');
9
5
  var PropTypes = require('prop-types');
10
6
  var react = require('react');
11
7
  var reactIs = require('react-is');
@@ -14,14 +10,10 @@ var tslib = require('tslib');
14
10
 
15
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
16
12
 
17
- var _objectWithoutPropertiesLoose__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutPropertiesLoose);
18
- var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
19
- var _assertThisInitialized__default = /*#__PURE__*/_interopDefaultLegacy(_assertThisInitialized);
20
- var _inheritsLoose__default = /*#__PURE__*/_interopDefaultLegacy(_inheritsLoose);
21
13
  var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
22
14
  var computeScrollIntoView__default = /*#__PURE__*/_interopDefaultLegacy(computeScrollIntoView);
23
15
 
24
- var idCounter = 0;
16
+ let idCounter = 0;
25
17
  /**
26
18
  * Accepts a parameter and returns it if it's a function
27
19
  * or a noop function if it's not. This allows us to
@@ -48,15 +40,17 @@ function scrollIntoView(node, menuNode) {
48
40
  return;
49
41
  }
50
42
 
51
- var actions = computeScrollIntoView__default['default'](node, {
43
+ const actions = computeScrollIntoView__default["default"](node, {
52
44
  boundary: menuNode,
53
45
  block: 'nearest',
54
46
  scrollMode: 'if-needed'
55
47
  });
56
- actions.forEach(function (_ref) {
57
- var el = _ref.el,
58
- top = _ref.top,
59
- left = _ref.left;
48
+ actions.forEach(_ref => {
49
+ let {
50
+ el,
51
+ top,
52
+ left
53
+ } = _ref;
60
54
  el.scrollTop = top;
61
55
  el.scrollLeft = left;
62
56
  });
@@ -70,7 +64,7 @@ function scrollIntoView(node, menuNode) {
70
64
 
71
65
 
72
66
  function isOrContainsNode(parent, child, environment) {
73
- var result = parent === child || child instanceof environment.Node && parent.contains && parent.contains(child);
67
+ const result = parent === child || child instanceof environment.Node && parent.contains && parent.contains(child);
74
68
  return result;
75
69
  }
76
70
  /**
@@ -84,7 +78,7 @@ function isOrContainsNode(parent, child, environment) {
84
78
 
85
79
 
86
80
  function debounce(fn, time) {
87
- var timeoutId;
81
+ let timeoutId;
88
82
 
89
83
  function cancel() {
90
84
  if (timeoutId) {
@@ -98,9 +92,9 @@ function debounce(fn, time) {
98
92
  }
99
93
 
100
94
  cancel();
101
- timeoutId = setTimeout(function () {
95
+ timeoutId = setTimeout(() => {
102
96
  timeoutId = null;
103
- fn.apply(void 0, args);
97
+ fn(...args);
104
98
  }, time);
105
99
  }
106
100
 
@@ -126,9 +120,9 @@ function callAllEventHandlers() {
126
120
  args[_key3 - 1] = arguments[_key3];
127
121
  }
128
122
 
129
- return fns.some(function (fn) {
123
+ return fns.some(fn => {
130
124
  if (fn) {
131
- fn.apply(void 0, [event].concat(args));
125
+ fn(event, ...args);
132
126
  }
133
127
 
134
128
  return event.preventDownshiftDefault || event.hasOwnProperty('nativeEvent') && event.nativeEvent.preventDownshiftDefault;
@@ -141,8 +135,8 @@ function handleRefs() {
141
135
  refs[_key4] = arguments[_key4];
142
136
  }
143
137
 
144
- return function (node) {
145
- refs.forEach(function (ref) {
138
+ return node => {
139
+ refs.forEach(ref => {
146
140
  if (typeof ref === 'function') {
147
141
  ref(node);
148
142
  } else if (ref) {
@@ -179,9 +173,11 @@ function resetIdCounter() {
179
173
 
180
174
 
181
175
  function getA11yStatusMessage$1(_ref2) {
182
- var isOpen = _ref2.isOpen,
183
- resultCount = _ref2.resultCount,
184
- previousResultCount = _ref2.previousResultCount;
176
+ let {
177
+ isOpen,
178
+ resultCount,
179
+ previousResultCount
180
+ } = _ref2;
185
181
 
186
182
  if (!isOpen) {
187
183
  return '';
@@ -251,7 +247,7 @@ function requiredProp(fnName, propName) {
251
247
  console.error("The property \"" + propName + "\" is required in \"" + fnName + "\"");
252
248
  }
253
249
 
254
- var stateKeys = ['highlightedIndex', 'inputValue', 'isOpen', 'selectedItem', 'type'];
250
+ const stateKeys = ['highlightedIndex', 'inputValue', 'isOpen', 'selectedItem', 'type'];
255
251
  /**
256
252
  * @param {Object} state the state object
257
253
  * @return {Object} state that is relevant to downshift
@@ -262,8 +258,8 @@ function pickState(state) {
262
258
  state = {};
263
259
  }
264
260
 
265
- var result = {};
266
- stateKeys.forEach(function (k) {
261
+ const result = {};
262
+ stateKeys.forEach(k => {
267
263
  if (state.hasOwnProperty(k)) {
268
264
  result[k] = state[k];
269
265
  }
@@ -284,7 +280,7 @@ function pickState(state) {
284
280
 
285
281
 
286
282
  function getState(state, props) {
287
- return Object.keys(state).reduce(function (prevState, key) {
283
+ return Object.keys(state).reduce((prevState, key) => {
288
284
  prevState[key] = isControlledProp(props, key) ? props[key] : state[key];
289
285
  return prevState;
290
286
  }, {});
@@ -311,8 +307,10 @@ function isControlledProp(props, key) {
311
307
 
312
308
 
313
309
  function normalizeArrowKey(event) {
314
- var key = event.key,
315
- keyCode = event.keyCode;
310
+ const {
311
+ key,
312
+ keyCode
313
+ } = event;
316
314
  /* istanbul ignore next (ie) */
317
315
 
318
316
  if (keyCode >= 37 && keyCode <= 40 && key.indexOf('Arrow') !== 0) {
@@ -353,13 +351,13 @@ function getNextWrappingIndex(moveAmount, baseIndex, itemCount, getItemNodeFromI
353
351
  return -1;
354
352
  }
355
353
 
356
- var itemsLastIndex = itemCount - 1;
354
+ const itemsLastIndex = itemCount - 1;
357
355
 
358
356
  if (typeof baseIndex !== 'number' || baseIndex < 0 || baseIndex >= itemCount) {
359
357
  baseIndex = moveAmount > 0 ? -1 : itemsLastIndex + 1;
360
358
  }
361
359
 
362
- var newIndex = baseIndex + moveAmount;
360
+ let newIndex = baseIndex + moveAmount;
363
361
 
364
362
  if (newIndex < 0) {
365
363
  newIndex = circular ? itemsLastIndex : 0;
@@ -367,7 +365,7 @@ function getNextWrappingIndex(moveAmount, baseIndex, itemCount, getItemNodeFromI
367
365
  newIndex = circular ? 0 : itemsLastIndex;
368
366
  }
369
367
 
370
- var nonDisabledNewIndex = getNextNonDisabledIndex(moveAmount, newIndex, itemCount, getItemNodeFromIndex, circular);
368
+ const nonDisabledNewIndex = getNextNonDisabledIndex(moveAmount, newIndex, itemCount, getItemNodeFromIndex, circular);
371
369
 
372
370
  if (nonDisabledNewIndex === -1) {
373
371
  return baseIndex >= itemCount ? -1 : baseIndex;
@@ -388,22 +386,22 @@ function getNextWrappingIndex(moveAmount, baseIndex, itemCount, getItemNodeFromI
388
386
 
389
387
 
390
388
  function getNextNonDisabledIndex(moveAmount, baseIndex, itemCount, getItemNodeFromIndex, circular) {
391
- var currentElementNode = getItemNodeFromIndex(baseIndex);
389
+ const currentElementNode = getItemNodeFromIndex(baseIndex);
392
390
 
393
391
  if (!currentElementNode || !currentElementNode.hasAttribute('disabled')) {
394
392
  return baseIndex;
395
393
  }
396
394
 
397
395
  if (moveAmount > 0) {
398
- for (var index = baseIndex + 1; index < itemCount; index++) {
396
+ for (let index = baseIndex + 1; index < itemCount; index++) {
399
397
  if (!getItemNodeFromIndex(index).hasAttribute('disabled')) {
400
398
  return index;
401
399
  }
402
400
  }
403
401
  } else {
404
- for (var _index = baseIndex - 1; _index >= 0; _index--) {
405
- if (!getItemNodeFromIndex(_index).hasAttribute('disabled')) {
406
- return _index;
402
+ for (let index = baseIndex - 1; index >= 0; index--) {
403
+ if (!getItemNodeFromIndex(index).hasAttribute('disabled')) {
404
+ return index;
407
405
  }
408
406
  }
409
407
  }
@@ -431,19 +429,17 @@ function targetWithinDownshift(target, downshiftElements, environment, checkActi
431
429
  checkActiveElement = true;
432
430
  }
433
431
 
434
- return downshiftElements.some(function (contextNode) {
435
- return contextNode && (isOrContainsNode(contextNode, target, environment) || checkActiveElement && isOrContainsNode(contextNode, environment.document.activeElement, environment));
436
- });
432
+ return downshiftElements.some(contextNode => contextNode && (isOrContainsNode(contextNode, target, environment) || checkActiveElement && isOrContainsNode(contextNode, environment.document.activeElement, environment)));
437
433
  } // eslint-disable-next-line import/no-mutable-exports
438
434
 
439
435
 
440
- var validateControlledUnchanged = noop;
436
+ let validateControlledUnchanged = noop;
441
437
  /* istanbul ignore next */
442
438
 
443
439
  if (process.env.NODE_ENV !== 'production') {
444
- validateControlledUnchanged = function validateControlledUnchanged(state, prevProps, nextProps) {
445
- var warningDescription = "This prop should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled Downshift element for the lifetime of the component. More info: https://github.com/downshift-js/downshift#control-props";
446
- Object.keys(state).forEach(function (propKey) {
440
+ validateControlledUnchanged = (state, prevProps, nextProps) => {
441
+ const warningDescription = "This prop should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled Downshift element for the lifetime of the component. More info: https://github.com/downshift-js/downshift#control-props";
442
+ Object.keys(state).forEach(propKey => {
447
443
  if (prevProps[propKey] !== undefined && nextProps[propKey] === undefined) {
448
444
  // eslint-disable-next-line no-console
449
445
  console.error("downshift: A component has changed the controlled prop \"" + propKey + "\" to be uncontrolled. " + warningDescription);
@@ -455,7 +451,7 @@ if (process.env.NODE_ENV !== 'production') {
455
451
  };
456
452
  }
457
453
 
458
- var cleanupStatus = debounce(function (documentProp) {
454
+ const cleanupStatus = debounce(documentProp => {
459
455
  getStatusDiv(documentProp).textContent = '';
460
456
  }, 500);
461
457
  /**
@@ -464,7 +460,7 @@ var cleanupStatus = debounce(function (documentProp) {
464
460
  */
465
461
 
466
462
  function setStatus(status, documentProp) {
467
- var div = getStatusDiv(documentProp);
463
+ const div = getStatusDiv(documentProp);
468
464
 
469
465
  if (!status) {
470
466
  return;
@@ -485,7 +481,7 @@ function getStatusDiv(documentProp) {
485
481
  documentProp = document;
486
482
  }
487
483
 
488
- var statusDiv = documentProp.getElementById('a11y-status-message');
484
+ let statusDiv = documentProp.getElementById('a11y-status-message');
489
485
 
490
486
  if (statusDiv) {
491
487
  return statusDiv;
@@ -510,23 +506,23 @@ function getStatusDiv(documentProp) {
510
506
  return statusDiv;
511
507
  }
512
508
 
513
- var unknown = process.env.NODE_ENV !== "production" ? '__autocomplete_unknown__' : 0;
514
- var mouseUp = process.env.NODE_ENV !== "production" ? '__autocomplete_mouseup__' : 1;
515
- var itemMouseEnter = process.env.NODE_ENV !== "production" ? '__autocomplete_item_mouseenter__' : 2;
516
- var keyDownArrowUp = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_arrow_up__' : 3;
517
- var keyDownArrowDown = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_arrow_down__' : 4;
518
- var keyDownEscape = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_escape__' : 5;
519
- var keyDownEnter = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_enter__' : 6;
520
- var keyDownHome = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_home__' : 7;
521
- var keyDownEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_end__' : 8;
522
- var clickItem = process.env.NODE_ENV !== "production" ? '__autocomplete_click_item__' : 9;
523
- var blurInput = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_input__' : 10;
524
- var changeInput = process.env.NODE_ENV !== "production" ? '__autocomplete_change_input__' : 11;
525
- var keyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_space_button__' : 12;
526
- var clickButton = process.env.NODE_ENV !== "production" ? '__autocomplete_click_button__' : 13;
527
- var blurButton = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_button__' : 14;
528
- var controlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__autocomplete_controlled_prop_updated_selected_item__' : 15;
529
- var touchEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_touchend__' : 16;
509
+ const unknown = process.env.NODE_ENV !== "production" ? '__autocomplete_unknown__' : 0;
510
+ const mouseUp = process.env.NODE_ENV !== "production" ? '__autocomplete_mouseup__' : 1;
511
+ const itemMouseEnter = process.env.NODE_ENV !== "production" ? '__autocomplete_item_mouseenter__' : 2;
512
+ const keyDownArrowUp = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_arrow_up__' : 3;
513
+ const keyDownArrowDown = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_arrow_down__' : 4;
514
+ const keyDownEscape = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_escape__' : 5;
515
+ const keyDownEnter = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_enter__' : 6;
516
+ const keyDownHome = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_home__' : 7;
517
+ const keyDownEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_end__' : 8;
518
+ const clickItem = process.env.NODE_ENV !== "production" ? '__autocomplete_click_item__' : 9;
519
+ const blurInput = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_input__' : 10;
520
+ const changeInput = process.env.NODE_ENV !== "production" ? '__autocomplete_change_input__' : 11;
521
+ const keyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__autocomplete_keydown_space_button__' : 12;
522
+ const clickButton = process.env.NODE_ENV !== "production" ? '__autocomplete_click_button__' : 13;
523
+ const blurButton = process.env.NODE_ENV !== "production" ? '__autocomplete_blur_button__' : 14;
524
+ const controlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__autocomplete_controlled_prop_updated_selected_item__' : 15;
525
+ const touchEnd = process.env.NODE_ENV !== "production" ? '__autocomplete_touchend__' : 16;
530
526
 
531
527
  var stateChangeTypes$3 = /*#__PURE__*/Object.freeze({
532
528
  __proto__: null,
@@ -549,58 +545,45 @@ var stateChangeTypes$3 = /*#__PURE__*/Object.freeze({
549
545
  touchEnd: touchEnd
550
546
  });
551
547
 
552
- var _excluded$4 = ["refKey", "ref"],
553
- _excluded2$3 = ["onClick", "onPress", "onKeyDown", "onKeyUp", "onBlur"],
554
- _excluded3$2 = ["onKeyDown", "onBlur", "onChange", "onInput", "onChangeText"],
555
- _excluded4$1 = ["refKey", "ref"],
556
- _excluded5$1 = ["onMouseMove", "onMouseDown", "onClick", "onPress", "index", "item"];
548
+ /* eslint camelcase:0 */
557
549
 
558
- var Downshift = /*#__PURE__*/function () {
559
- var Downshift = /*#__PURE__*/function (_Component) {
560
- _inheritsLoose__default['default'](Downshift, _Component);
561
-
562
- function Downshift(_props) {
550
+ const Downshift = /*#__PURE__*/(() => {
551
+ class Downshift extends react.Component {
552
+ constructor(_props) {
563
553
  var _this;
564
554
 
565
- _this = _Component.call(this, _props) || this; // fancy destructuring + defaults + aliases
566
- // this basically says each value of state should either be set to
567
- // the initial value or the default value if the initial value is not provided
568
-
569
- _this.id = _this.props.id || "downshift-" + generateId();
570
- _this.menuId = _this.props.menuId || _this.id + "-menu";
571
- _this.labelId = _this.props.labelId || _this.id + "-label";
572
- _this.inputId = _this.props.inputId || _this.id + "-input";
555
+ super(_props);
556
+ _this = this;
557
+ this.id = this.props.id || "downshift-" + generateId();
558
+ this.menuId = this.props.menuId || this.id + "-menu";
559
+ this.labelId = this.props.labelId || this.id + "-label";
560
+ this.inputId = this.props.inputId || this.id + "-input";
573
561
 
574
- _this.getItemId = _this.props.getItemId || function (index) {
575
- return _this.id + "-item-" + index;
576
- };
562
+ this.getItemId = this.props.getItemId || (index => this.id + "-item-" + index);
577
563
 
578
- _this.input = null;
579
- _this.items = [];
580
- _this.itemCount = null;
581
- _this.previousResultCount = 0;
582
- _this.timeoutIds = [];
564
+ this.input = null;
565
+ this.items = [];
566
+ this.itemCount = null;
567
+ this.previousResultCount = 0;
568
+ this.timeoutIds = [];
583
569
 
584
- _this.internalSetTimeout = function (fn, time) {
585
- var id = setTimeout(function () {
586
- _this.timeoutIds = _this.timeoutIds.filter(function (i) {
587
- return i !== id;
588
- });
570
+ this.internalSetTimeout = (fn, time) => {
571
+ const id = setTimeout(() => {
572
+ this.timeoutIds = this.timeoutIds.filter(i => i !== id);
589
573
  fn();
590
574
  }, time);
591
-
592
- _this.timeoutIds.push(id);
575
+ this.timeoutIds.push(id);
593
576
  };
594
577
 
595
- _this.setItemCount = function (count) {
596
- _this.itemCount = count;
578
+ this.setItemCount = count => {
579
+ this.itemCount = count;
597
580
  };
598
581
 
599
- _this.unsetItemCount = function () {
600
- _this.itemCount = null;
582
+ this.unsetItemCount = () => {
583
+ this.itemCount = null;
601
584
  };
602
585
 
603
- _this.setHighlightedIndex = function (highlightedIndex, otherStateToSet) {
586
+ this.setHighlightedIndex = function (highlightedIndex, otherStateToSet) {
604
587
  if (highlightedIndex === void 0) {
605
588
  highlightedIndex = _this.props.defaultHighlightedIndex;
606
589
  }
@@ -611,71 +594,72 @@ var Downshift = /*#__PURE__*/function () {
611
594
 
612
595
  otherStateToSet = pickState(otherStateToSet);
613
596
 
614
- _this.internalSetState(_extends__default['default']({
615
- highlightedIndex: highlightedIndex
616
- }, otherStateToSet));
597
+ _this.internalSetState({
598
+ highlightedIndex,
599
+ ...otherStateToSet
600
+ });
617
601
  };
618
602
 
619
- _this.clearSelection = function (cb) {
620
- _this.internalSetState({
603
+ this.clearSelection = cb => {
604
+ this.internalSetState({
621
605
  selectedItem: null,
622
606
  inputValue: '',
623
- highlightedIndex: _this.props.defaultHighlightedIndex,
624
- isOpen: _this.props.defaultIsOpen
607
+ highlightedIndex: this.props.defaultHighlightedIndex,
608
+ isOpen: this.props.defaultIsOpen
625
609
  }, cb);
626
610
  };
627
611
 
628
- _this.selectItem = function (item, otherStateToSet, cb) {
612
+ this.selectItem = (item, otherStateToSet, cb) => {
629
613
  otherStateToSet = pickState(otherStateToSet);
630
-
631
- _this.internalSetState(_extends__default['default']({
632
- isOpen: _this.props.defaultIsOpen,
633
- highlightedIndex: _this.props.defaultHighlightedIndex,
614
+ this.internalSetState({
615
+ isOpen: this.props.defaultIsOpen,
616
+ highlightedIndex: this.props.defaultHighlightedIndex,
634
617
  selectedItem: item,
635
- inputValue: _this.props.itemToString(item)
636
- }, otherStateToSet), cb);
618
+ inputValue: this.props.itemToString(item),
619
+ ...otherStateToSet
620
+ }, cb);
637
621
  };
638
622
 
639
- _this.selectItemAtIndex = function (itemIndex, otherStateToSet, cb) {
640
- var item = _this.items[itemIndex];
623
+ this.selectItemAtIndex = (itemIndex, otherStateToSet, cb) => {
624
+ const item = this.items[itemIndex];
641
625
 
642
626
  if (item == null) {
643
627
  return;
644
628
  }
645
629
 
646
- _this.selectItem(item, otherStateToSet, cb);
630
+ this.selectItem(item, otherStateToSet, cb);
647
631
  };
648
632
 
649
- _this.selectHighlightedItem = function (otherStateToSet, cb) {
650
- return _this.selectItemAtIndex(_this.getState().highlightedIndex, otherStateToSet, cb);
633
+ this.selectHighlightedItem = (otherStateToSet, cb) => {
634
+ return this.selectItemAtIndex(this.getState().highlightedIndex, otherStateToSet, cb);
651
635
  };
652
636
 
653
- _this.internalSetState = function (stateToSet, cb) {
654
- var isItemSelected, onChangeArg;
655
- var onStateChangeArg = {};
656
- var isStateToSetFunction = typeof stateToSet === 'function'; // we want to call `onInputValueChange` before the `setState` call
637
+ this.internalSetState = (stateToSet, cb) => {
638
+ let isItemSelected, onChangeArg;
639
+ const onStateChangeArg = {};
640
+ const isStateToSetFunction = typeof stateToSet === 'function'; // we want to call `onInputValueChange` before the `setState` call
657
641
  // so someone controlling the `inputValue` state gets notified of
658
642
  // the input change as soon as possible. This avoids issues with
659
643
  // preserving the cursor position.
660
644
  // See https://github.com/downshift-js/downshift/issues/217 for more info.
661
645
 
662
646
  if (!isStateToSetFunction && stateToSet.hasOwnProperty('inputValue')) {
663
- _this.props.onInputValueChange(stateToSet.inputValue, _extends__default['default']({}, _this.getStateAndHelpers(), stateToSet));
647
+ this.props.onInputValueChange(stateToSet.inputValue, { ...this.getStateAndHelpers(),
648
+ ...stateToSet
649
+ });
664
650
  }
665
651
 
666
- return _this.setState(function (state) {
667
- state = _this.getState(state);
668
- var newStateToSet = isStateToSetFunction ? stateToSet(state) : stateToSet; // Your own function that could modify the state that will be set.
652
+ return this.setState(state => {
653
+ state = this.getState(state);
654
+ let newStateToSet = isStateToSetFunction ? stateToSet(state) : stateToSet; // Your own function that could modify the state that will be set.
669
655
 
670
- newStateToSet = _this.props.stateReducer(state, newStateToSet); // checks if an item is selected, regardless of if it's different from
656
+ newStateToSet = this.props.stateReducer(state, newStateToSet); // checks if an item is selected, regardless of if it's different from
671
657
  // what was selected before
672
658
  // used to determine if onSelect and onChange callbacks should be called
673
659
 
674
660
  isItemSelected = newStateToSet.hasOwnProperty('selectedItem'); // this keeps track of the object we want to call with setState
675
661
 
676
- var nextState = {}; // this is just used to tell whether the state changed
677
-
678
- var nextFullState = {}; // we need to call on change if the outside world is controlling any of our state
662
+ const nextState = {}; // this is just used to tell whether the state changed
679
663
  // and we're trying to update that state. OR if the selection has changed and we're
680
664
  // trying to update the selection
681
665
 
@@ -684,7 +668,7 @@ var Downshift = /*#__PURE__*/function () {
684
668
  }
685
669
 
686
670
  newStateToSet.type = newStateToSet.type || unknown;
687
- Object.keys(newStateToSet).forEach(function (key) {
671
+ Object.keys(newStateToSet).forEach(key => {
688
672
  // onStateChangeArg should only have the state that is
689
673
  // actually changing
690
674
  if (state[key] !== newStateToSet[key]) {
@@ -701,81 +685,84 @@ var Downshift = /*#__PURE__*/function () {
701
685
  return;
702
686
  }
703
687
 
704
- nextFullState[key] = newStateToSet[key]; // if it's coming from props, then we don't care to set it internally
688
+ newStateToSet[key]; // if it's coming from props, then we don't care to set it internally
705
689
 
706
- if (!isControlledProp(_this.props, key)) {
690
+ if (!isControlledProp(this.props, key)) {
707
691
  nextState[key] = newStateToSet[key];
708
692
  }
709
693
  }); // if stateToSet is a function, then we weren't able to call onInputValueChange
710
694
  // earlier, so we'll call it now that we know what the inputValue state will be.
711
695
 
712
696
  if (isStateToSetFunction && newStateToSet.hasOwnProperty('inputValue')) {
713
- _this.props.onInputValueChange(newStateToSet.inputValue, _extends__default['default']({}, _this.getStateAndHelpers(), newStateToSet));
697
+ this.props.onInputValueChange(newStateToSet.inputValue, { ...this.getStateAndHelpers(),
698
+ ...newStateToSet
699
+ });
714
700
  }
715
701
 
716
702
  return nextState;
717
- }, function () {
703
+ }, () => {
718
704
  // call the provided callback if it's a function
719
705
  cbToCb(cb)(); // only call the onStateChange and onChange callbacks if
720
706
  // we have relevant information to pass them.
721
707
 
722
- var hasMoreStateThanType = Object.keys(onStateChangeArg).length > 1;
708
+ const hasMoreStateThanType = Object.keys(onStateChangeArg).length > 1;
723
709
 
724
710
  if (hasMoreStateThanType) {
725
- _this.props.onStateChange(onStateChangeArg, _this.getStateAndHelpers());
711
+ this.props.onStateChange(onStateChangeArg, this.getStateAndHelpers());
726
712
  }
727
713
 
728
714
  if (isItemSelected) {
729
- _this.props.onSelect(stateToSet.selectedItem, _this.getStateAndHelpers());
715
+ this.props.onSelect(stateToSet.selectedItem, this.getStateAndHelpers());
730
716
  }
731
717
 
732
718
  if (onChangeArg !== undefined) {
733
- _this.props.onChange(onChangeArg, _this.getStateAndHelpers());
719
+ this.props.onChange(onChangeArg, this.getStateAndHelpers());
734
720
  } // this is currently undocumented and therefore subject to change
735
721
  // We'll try to not break it, but just be warned.
736
722
 
737
723
 
738
- _this.props.onUserAction(onStateChangeArg, _this.getStateAndHelpers());
724
+ this.props.onUserAction(onStateChangeArg, this.getStateAndHelpers());
739
725
  });
740
726
  };
741
727
 
742
- _this.rootRef = function (node) {
743
- return _this._rootNode = node;
744
- };
745
-
746
- _this.getRootProps = function (_temp, _temp2) {
747
- var _extends2;
748
-
749
- var _ref = _temp === void 0 ? {} : _temp,
750
- _ref$refKey = _ref.refKey,
751
- refKey = _ref$refKey === void 0 ? 'ref' : _ref$refKey,
752
- ref = _ref.ref,
753
- rest = _objectWithoutPropertiesLoose__default['default'](_ref, _excluded$4);
754
-
755
- var _ref2 = _temp2 === void 0 ? {} : _temp2,
756
- _ref2$suppressRefErro = _ref2.suppressRefError,
757
- suppressRefError = _ref2$suppressRefErro === void 0 ? false : _ref2$suppressRefErro;
758
-
728
+ this.rootRef = node => this._rootNode = node;
729
+
730
+ this.getRootProps = function (_temp, _temp2) {
731
+ let {
732
+ refKey = 'ref',
733
+ ref,
734
+ ...rest
735
+ } = _temp === void 0 ? {} : _temp;
736
+ let {
737
+ suppressRefError = false
738
+ } = _temp2 === void 0 ? {} : _temp2;
759
739
  // this is used in the render to know whether the user has called getRootProps.
760
740
  // It uses that to know whether to apply the props automatically
761
741
  _this.getRootProps.called = true;
762
742
  _this.getRootProps.refKey = refKey;
763
743
  _this.getRootProps.suppressRefError = suppressRefError;
764
744
 
765
- var _this$getState = _this.getState(),
766
- isOpen = _this$getState.isOpen;
745
+ const {
746
+ isOpen
747
+ } = _this.getState();
767
748
 
768
- return _extends__default['default']((_extends2 = {}, _extends2[refKey] = handleRefs(ref, _this.rootRef), _extends2.role = 'combobox', _extends2['aria-expanded'] = isOpen, _extends2['aria-haspopup'] = 'listbox', _extends2['aria-owns'] = isOpen ? _this.menuId : null, _extends2['aria-labelledby'] = _this.labelId, _extends2), rest);
749
+ return {
750
+ [refKey]: handleRefs(ref, _this.rootRef),
751
+ role: 'combobox',
752
+ 'aria-expanded': isOpen,
753
+ 'aria-haspopup': 'listbox',
754
+ 'aria-owns': isOpen ? _this.menuId : null,
755
+ 'aria-labelledby': _this.labelId,
756
+ ...rest
757
+ };
769
758
  };
770
759
 
771
- _this.keyDownHandlers = {
772
- ArrowDown: function ArrowDown(event) {
773
- var _this2 = this;
774
-
760
+ this.keyDownHandlers = {
761
+ ArrowDown(event) {
775
762
  event.preventDefault();
776
763
 
777
764
  if (this.getState().isOpen) {
778
- var amount = event.shiftKey ? 5 : 1;
765
+ const amount = event.shiftKey ? 5 : 1;
779
766
  this.moveHighlightedIndex(amount, {
780
767
  type: keyDownArrowDown
781
768
  });
@@ -783,31 +770,27 @@ var Downshift = /*#__PURE__*/function () {
783
770
  this.internalSetState({
784
771
  isOpen: true,
785
772
  type: keyDownArrowDown
786
- }, function () {
787
- var itemCount = _this2.getItemCount();
773
+ }, () => {
774
+ const itemCount = this.getItemCount();
788
775
 
789
776
  if (itemCount > 0) {
790
- var _this2$getState = _this2.getState(),
791
- highlightedIndex = _this2$getState.highlightedIndex;
792
-
793
- var nextHighlightedIndex = getNextWrappingIndex(1, highlightedIndex, itemCount, function (index) {
794
- return _this2.getItemNodeFromIndex(index);
795
- });
796
-
797
- _this2.setHighlightedIndex(nextHighlightedIndex, {
777
+ const {
778
+ highlightedIndex
779
+ } = this.getState();
780
+ const nextHighlightedIndex = getNextWrappingIndex(1, highlightedIndex, itemCount, index => this.getItemNodeFromIndex(index));
781
+ this.setHighlightedIndex(nextHighlightedIndex, {
798
782
  type: keyDownArrowDown
799
783
  });
800
784
  }
801
785
  });
802
786
  }
803
787
  },
804
- ArrowUp: function ArrowUp(event) {
805
- var _this3 = this;
806
788
 
789
+ ArrowUp(event) {
807
790
  event.preventDefault();
808
791
 
809
792
  if (this.getState().isOpen) {
810
- var amount = event.shiftKey ? -5 : -1;
793
+ const amount = event.shiftKey ? -5 : -1;
811
794
  this.moveHighlightedIndex(amount, {
812
795
  type: keyDownArrowUp
813
796
  });
@@ -815,37 +798,36 @@ var Downshift = /*#__PURE__*/function () {
815
798
  this.internalSetState({
816
799
  isOpen: true,
817
800
  type: keyDownArrowUp
818
- }, function () {
819
- var itemCount = _this3.getItemCount();
801
+ }, () => {
802
+ const itemCount = this.getItemCount();
820
803
 
821
804
  if (itemCount > 0) {
822
- var _this3$getState = _this3.getState(),
823
- highlightedIndex = _this3$getState.highlightedIndex;
824
-
825
- var nextHighlightedIndex = getNextWrappingIndex(-1, highlightedIndex, itemCount, function (index) {
826
- return _this3.getItemNodeFromIndex(index);
827
- });
828
-
829
- _this3.setHighlightedIndex(nextHighlightedIndex, {
805
+ const {
806
+ highlightedIndex
807
+ } = this.getState();
808
+ const nextHighlightedIndex = getNextWrappingIndex(-1, highlightedIndex, itemCount, index => this.getItemNodeFromIndex(index));
809
+ this.setHighlightedIndex(nextHighlightedIndex, {
830
810
  type: keyDownArrowUp
831
811
  });
832
812
  }
833
813
  });
834
814
  }
835
815
  },
836
- Enter: function Enter(event) {
816
+
817
+ Enter(event) {
837
818
  if (event.which === 229) {
838
819
  return;
839
820
  }
840
821
 
841
- var _this$getState2 = this.getState(),
842
- isOpen = _this$getState2.isOpen,
843
- highlightedIndex = _this$getState2.highlightedIndex;
822
+ const {
823
+ isOpen,
824
+ highlightedIndex
825
+ } = this.getState();
844
826
 
845
827
  if (isOpen && highlightedIndex != null) {
846
828
  event.preventDefault();
847
- var item = this.items[highlightedIndex];
848
- var itemNode = this.getItemNodeFromIndex(highlightedIndex);
829
+ const item = this.items[highlightedIndex];
830
+ const itemNode = this.getItemNodeFromIndex(highlightedIndex);
849
831
 
850
832
  if (item == null || itemNode && itemNode.hasAttribute('disabled')) {
851
833
  return;
@@ -856,183 +838,191 @@ var Downshift = /*#__PURE__*/function () {
856
838
  });
857
839
  }
858
840
  },
859
- Escape: function Escape(event) {
841
+
842
+ Escape(event) {
860
843
  event.preventDefault();
861
- this.reset(_extends__default['default']({
862
- type: keyDownEscape
863
- }, !this.state.isOpen && {
864
- selectedItem: null,
865
- inputValue: ''
866
- }));
844
+ this.reset({
845
+ type: keyDownEscape,
846
+ ...(!this.state.isOpen && {
847
+ selectedItem: null,
848
+ inputValue: ''
849
+ })
850
+ });
867
851
  }
852
+
868
853
  };
869
- _this.buttonKeyDownHandlers = _extends__default['default']({}, _this.keyDownHandlers, {
870
- ' ': function _(event) {
854
+ this.buttonKeyDownHandlers = { ...this.keyDownHandlers,
855
+
856
+ ' '(event) {
871
857
  event.preventDefault();
872
858
  this.toggleMenu({
873
859
  type: keyDownSpaceButton
874
860
  });
875
861
  }
876
- });
877
- _this.inputKeyDownHandlers = _extends__default['default']({}, _this.keyDownHandlers, {
878
- Home: function Home(event) {
879
- var _this4 = this;
880
862
 
881
- var _this$getState3 = this.getState(),
882
- isOpen = _this$getState3.isOpen;
863
+ };
864
+ this.inputKeyDownHandlers = { ...this.keyDownHandlers,
865
+
866
+ Home(event) {
867
+ const {
868
+ isOpen
869
+ } = this.getState();
883
870
 
884
871
  if (!isOpen) {
885
872
  return;
886
873
  }
887
874
 
888
875
  event.preventDefault();
889
- var itemCount = this.getItemCount();
876
+ const itemCount = this.getItemCount();
890
877
 
891
878
  if (itemCount <= 0 || !isOpen) {
892
879
  return;
893
880
  } // get next non-disabled starting downwards from 0 if that's disabled.
894
881
 
895
882
 
896
- var newHighlightedIndex = getNextNonDisabledIndex(1, 0, itemCount, function (index) {
897
- return _this4.getItemNodeFromIndex(index);
898
- }, false);
883
+ const newHighlightedIndex = getNextNonDisabledIndex(1, 0, itemCount, index => this.getItemNodeFromIndex(index), false);
899
884
  this.setHighlightedIndex(newHighlightedIndex, {
900
885
  type: keyDownHome
901
886
  });
902
887
  },
903
- End: function End(event) {
904
- var _this5 = this;
905
888
 
906
- var _this$getState4 = this.getState(),
907
- isOpen = _this$getState4.isOpen;
889
+ End(event) {
890
+ const {
891
+ isOpen
892
+ } = this.getState();
908
893
 
909
894
  if (!isOpen) {
910
895
  return;
911
896
  }
912
897
 
913
898
  event.preventDefault();
914
- var itemCount = this.getItemCount();
899
+ const itemCount = this.getItemCount();
915
900
 
916
901
  if (itemCount <= 0 || !isOpen) {
917
902
  return;
918
903
  } // get next non-disabled starting upwards from last index if that's disabled.
919
904
 
920
905
 
921
- var newHighlightedIndex = getNextNonDisabledIndex(-1, itemCount - 1, itemCount, function (index) {
922
- return _this5.getItemNodeFromIndex(index);
923
- }, false);
906
+ const newHighlightedIndex = getNextNonDisabledIndex(-1, itemCount - 1, itemCount, index => this.getItemNodeFromIndex(index), false);
924
907
  this.setHighlightedIndex(newHighlightedIndex, {
925
908
  type: keyDownEnd
926
909
  });
927
910
  }
928
- });
929
911
 
930
- _this.getToggleButtonProps = function (_temp3) {
931
- var _ref3 = _temp3 === void 0 ? {} : _temp3;
932
- _ref3.onClick;
933
- var onPress = _ref3.onPress;
934
- _ref3.onKeyDown;
935
- _ref3.onKeyUp;
936
- _ref3.onBlur;
937
- var rest = _objectWithoutPropertiesLoose__default['default'](_ref3, _excluded2$3);
938
-
939
- var _this$getState5 = _this.getState(),
940
- isOpen = _this$getState5.isOpen;
912
+ };
941
913
 
942
- var enabledEventHandlers = /* istanbul ignore next (react-native) */
914
+ this.getToggleButtonProps = function (_temp3) {
915
+ let {
916
+ onClick,
917
+ onPress,
918
+ onKeyDown,
919
+ onKeyUp,
920
+ onBlur,
921
+ ...rest
922
+ } = _temp3 === void 0 ? {} : _temp3;
923
+
924
+ const {
925
+ isOpen
926
+ } = _this.getState();
927
+
928
+ const enabledEventHandlers = /* istanbul ignore next (react-native) */
943
929
  {
944
930
  onPress: callAllEventHandlers(onPress, _this.buttonHandleClick)
945
931
  } ;
946
- var eventHandlers = rest.disabled ? {} : enabledEventHandlers;
947
- return _extends__default['default']({
932
+ const eventHandlers = rest.disabled ? {} : enabledEventHandlers;
933
+ return {
948
934
  type: 'button',
949
935
  role: 'button',
950
936
  'aria-label': isOpen ? 'close menu' : 'open menu',
951
937
  'aria-haspopup': true,
952
- 'data-toggle': true
953
- }, eventHandlers, rest);
938
+ 'data-toggle': true,
939
+ ...eventHandlers,
940
+ ...rest
941
+ };
954
942
  };
955
943
 
956
- _this.buttonHandleKeyUp = function (event) {
944
+ this.buttonHandleKeyUp = event => {
957
945
  // Prevent click event from emitting in Firefox
958
946
  event.preventDefault();
959
947
  };
960
948
 
961
- _this.buttonHandleKeyDown = function (event) {
962
- var key = normalizeArrowKey(event);
949
+ this.buttonHandleKeyDown = event => {
950
+ const key = normalizeArrowKey(event);
963
951
 
964
- if (_this.buttonKeyDownHandlers[key]) {
965
- _this.buttonKeyDownHandlers[key].call(_assertThisInitialized__default['default'](_this), event);
952
+ if (this.buttonKeyDownHandlers[key]) {
953
+ this.buttonKeyDownHandlers[key].call(this, event);
966
954
  }
967
955
  };
968
956
 
969
- _this.buttonHandleClick = function (event) {
957
+ this.buttonHandleClick = event => {
970
958
  event.preventDefault(); // handle odd case for Safari and Firefox which
971
959
  // if the NODE_ENV is test. With the proper build system, this should be dead code eliminated
972
960
  // when building for production and should therefore have no impact on production code.
973
961
 
974
962
 
975
963
  if (process.env.NODE_ENV === 'test') {
976
- _this.toggleMenu({
964
+ this.toggleMenu({
977
965
  type: clickButton
978
966
  });
979
967
  } else {
980
968
  // Ensure that toggle of menu occurs after the potential blur event in iOS
981
- _this.internalSetTimeout(function () {
982
- return _this.toggleMenu({
983
- type: clickButton
984
- });
985
- });
969
+ this.internalSetTimeout(() => this.toggleMenu({
970
+ type: clickButton
971
+ }));
986
972
  }
987
973
  };
988
974
 
989
- _this.buttonHandleBlur = function (event) {
990
- var blurTarget = event.target; // Save blur target for comparison with activeElement later
975
+ this.buttonHandleBlur = event => {
976
+ const blurTarget = event.target; // Save blur target for comparison with activeElement later
991
977
  // Need setTimeout, so that when the user presses Tab, the activeElement is the next focused element, not body element
992
978
 
993
- _this.internalSetTimeout(function () {
994
- if (!_this.isMouseDown && (_this.props.environment.document.activeElement == null || _this.props.environment.document.activeElement.id !== _this.inputId) && _this.props.environment.document.activeElement !== blurTarget // Do nothing if we refocus the same element again (to solve issue in Safari on iOS)
979
+ this.internalSetTimeout(() => {
980
+ if (!this.isMouseDown && (this.props.environment.document.activeElement == null || this.props.environment.document.activeElement.id !== this.inputId) && this.props.environment.document.activeElement !== blurTarget // Do nothing if we refocus the same element again (to solve issue in Safari on iOS)
995
981
  ) {
996
- _this.reset({
982
+ this.reset({
997
983
  type: blurButton
998
984
  });
999
985
  }
1000
986
  });
1001
987
  };
1002
988
 
1003
- _this.getLabelProps = function (props) {
1004
- return _extends__default['default']({
1005
- htmlFor: _this.inputId,
1006
- id: _this.labelId
1007
- }, props);
989
+ this.getLabelProps = props => {
990
+ return {
991
+ htmlFor: this.inputId,
992
+ id: this.labelId,
993
+ ...props
994
+ };
1008
995
  };
1009
996
 
1010
- _this.getInputProps = function (_temp4) {
1011
- var _ref4 = _temp4 === void 0 ? {} : _temp4,
1012
- onKeyDown = _ref4.onKeyDown,
1013
- onBlur = _ref4.onBlur,
1014
- onChange = _ref4.onChange,
1015
- onInput = _ref4.onInput,
1016
- onChangeText = _ref4.onChangeText,
1017
- rest = _objectWithoutPropertiesLoose__default['default'](_ref4, _excluded3$2);
1018
-
1019
- var onChangeKey;
1020
- var eventHandlers = {};
997
+ this.getInputProps = function (_temp4) {
998
+ let {
999
+ onKeyDown,
1000
+ onBlur,
1001
+ onChange,
1002
+ onInput,
1003
+ onChangeText,
1004
+ ...rest
1005
+ } = _temp4 === void 0 ? {} : _temp4;
1006
+ let onChangeKey;
1007
+ let eventHandlers = {};
1021
1008
  /* istanbul ignore next (preact) */
1022
1009
 
1023
1010
  {
1024
1011
  onChangeKey = 'onChange';
1025
1012
  }
1026
1013
 
1027
- var _this$getState6 = _this.getState(),
1028
- inputValue = _this$getState6.inputValue,
1029
- isOpen = _this$getState6.isOpen,
1030
- highlightedIndex = _this$getState6.highlightedIndex;
1014
+ const {
1015
+ inputValue,
1016
+ isOpen,
1017
+ highlightedIndex
1018
+ } = _this.getState();
1031
1019
 
1032
1020
  if (!rest.disabled) {
1033
- var _eventHandlers;
1034
-
1035
- eventHandlers = (_eventHandlers = {}, _eventHandlers[onChangeKey] = callAllEventHandlers(onChange, onInput, _this.inputHandleChange), _eventHandlers.onKeyDown = callAllEventHandlers(onKeyDown, _this.inputHandleKeyDown), _eventHandlers.onBlur = callAllEventHandlers(onBlur, _this.inputHandleBlur), _eventHandlers);
1021
+ eventHandlers = {
1022
+ [onChangeKey]: callAllEventHandlers(onChange, onInput, _this.inputHandleChange),
1023
+ onKeyDown: callAllEventHandlers(onKeyDown, _this.inputHandleKeyDown),
1024
+ onBlur: callAllEventHandlers(onBlur, _this.inputHandleBlur)
1025
+ };
1036
1026
  }
1037
1027
  /* istanbul ignore if (react-native) */
1038
1028
 
@@ -1040,18 +1030,16 @@ var Downshift = /*#__PURE__*/function () {
1040
1030
  {
1041
1031
  eventHandlers = {
1042
1032
  onChange: callAllEventHandlers(onChange, onInput, _this.inputHandleChange),
1043
- onChangeText: callAllEventHandlers(onChangeText, onInput, function (text) {
1044
- return _this.inputHandleChange({
1045
- nativeEvent: {
1046
- text: text
1047
- }
1048
- });
1049
- }),
1033
+ onChangeText: callAllEventHandlers(onChangeText, onInput, text => _this.inputHandleChange({
1034
+ nativeEvent: {
1035
+ text
1036
+ }
1037
+ })),
1050
1038
  onBlur: callAllEventHandlers(onBlur, _this.inputHandleBlur)
1051
1039
  };
1052
1040
  }
1053
1041
 
1054
- return _extends__default['default']({
1042
+ return {
1055
1043
  'aria-autocomplete': 'list',
1056
1044
  'aria-activedescendant': isOpen && typeof highlightedIndex === 'number' && highlightedIndex >= 0 ? _this.getItemId(highlightedIndex) : null,
1057
1045
  'aria-controls': isOpen ? _this.menuId : null,
@@ -1060,78 +1048,80 @@ var Downshift = /*#__PURE__*/function () {
1060
1048
  // revert back since autocomplete="nope" is ignored on latest Chrome and Opera
1061
1049
  autoComplete: 'off',
1062
1050
  value: inputValue,
1063
- id: _this.inputId
1064
- }, eventHandlers, rest);
1051
+ id: _this.inputId,
1052
+ ...eventHandlers,
1053
+ ...rest
1054
+ };
1065
1055
  };
1066
1056
 
1067
- _this.inputHandleKeyDown = function (event) {
1068
- var key = normalizeArrowKey(event);
1057
+ this.inputHandleKeyDown = event => {
1058
+ const key = normalizeArrowKey(event);
1069
1059
 
1070
- if (key && _this.inputKeyDownHandlers[key]) {
1071
- _this.inputKeyDownHandlers[key].call(_assertThisInitialized__default['default'](_this), event);
1060
+ if (key && this.inputKeyDownHandlers[key]) {
1061
+ this.inputKeyDownHandlers[key].call(this, event);
1072
1062
  }
1073
1063
  };
1074
1064
 
1075
- _this.inputHandleChange = function (event) {
1076
- _this.internalSetState({
1065
+ this.inputHandleChange = event => {
1066
+ this.internalSetState({
1077
1067
  type: changeInput,
1078
1068
  isOpen: true,
1079
1069
  inputValue: /* istanbul ignore next (react-native) */
1080
1070
  event.nativeEvent.text ,
1081
- highlightedIndex: _this.props.defaultHighlightedIndex
1071
+ highlightedIndex: this.props.defaultHighlightedIndex
1082
1072
  });
1083
1073
  };
1084
1074
 
1085
- _this.inputHandleBlur = function () {
1075
+ this.inputHandleBlur = () => {
1086
1076
  // Need setTimeout, so that when the user presses Tab, the activeElement is the next focused element, not the body element
1087
- _this.internalSetTimeout(function () {
1088
- var downshiftButtonIsActive = _this.props.environment.document && !!_this.props.environment.document.activeElement && !!_this.props.environment.document.activeElement.dataset && _this.props.environment.document.activeElement.dataset.toggle && _this._rootNode && _this._rootNode.contains(_this.props.environment.document.activeElement);
1077
+ this.internalSetTimeout(() => {
1078
+ const downshiftButtonIsActive = this.props.environment.document && !!this.props.environment.document.activeElement && !!this.props.environment.document.activeElement.dataset && this.props.environment.document.activeElement.dataset.toggle && this._rootNode && this._rootNode.contains(this.props.environment.document.activeElement);
1089
1079
 
1090
- if (!_this.isMouseDown && !downshiftButtonIsActive) {
1091
- _this.reset({
1080
+ if (!this.isMouseDown && !downshiftButtonIsActive) {
1081
+ this.reset({
1092
1082
  type: blurInput
1093
1083
  });
1094
1084
  }
1095
1085
  });
1096
1086
  };
1097
1087
 
1098
- _this.menuRef = function (node) {
1099
- _this._menuNode = node;
1088
+ this.menuRef = node => {
1089
+ this._menuNode = node;
1100
1090
  };
1101
1091
 
1102
- _this.getMenuProps = function (_temp5, _temp6) {
1103
- var _extends3;
1104
-
1105
- var _ref5 = _temp5 === void 0 ? {} : _temp5,
1106
- _ref5$refKey = _ref5.refKey,
1107
- refKey = _ref5$refKey === void 0 ? 'ref' : _ref5$refKey,
1108
- ref = _ref5.ref,
1109
- props = _objectWithoutPropertiesLoose__default['default'](_ref5, _excluded4$1);
1110
-
1111
- var _ref6 = _temp6 === void 0 ? {} : _temp6,
1112
- _ref6$suppressRefErro = _ref6.suppressRefError,
1113
- suppressRefError = _ref6$suppressRefErro === void 0 ? false : _ref6$suppressRefErro;
1114
-
1092
+ this.getMenuProps = function (_temp5, _temp6) {
1093
+ let {
1094
+ refKey = 'ref',
1095
+ ref,
1096
+ ...props
1097
+ } = _temp5 === void 0 ? {} : _temp5;
1098
+ let {
1099
+ suppressRefError = false
1100
+ } = _temp6 === void 0 ? {} : _temp6;
1115
1101
  _this.getMenuProps.called = true;
1116
1102
  _this.getMenuProps.refKey = refKey;
1117
1103
  _this.getMenuProps.suppressRefError = suppressRefError;
1118
- return _extends__default['default']((_extends3 = {}, _extends3[refKey] = handleRefs(ref, _this.menuRef), _extends3.role = 'listbox', _extends3['aria-labelledby'] = props && props['aria-label'] ? null : _this.labelId, _extends3.id = _this.menuId, _extends3), props);
1104
+ return {
1105
+ [refKey]: handleRefs(ref, _this.menuRef),
1106
+ role: 'listbox',
1107
+ 'aria-labelledby': props && props['aria-label'] ? null : _this.labelId,
1108
+ id: _this.menuId,
1109
+ ...props
1110
+ };
1119
1111
  };
1120
1112
 
1121
- _this.getItemProps = function (_temp7) {
1122
- var _enabledEventHandlers;
1123
-
1124
- var _ref7 = _temp7 === void 0 ? {} : _temp7,
1125
- onMouseMove = _ref7.onMouseMove,
1126
- onMouseDown = _ref7.onMouseDown;
1127
- _ref7.onClick;
1128
- var onPress = _ref7.onPress,
1129
- index = _ref7.index,
1130
- _ref7$item = _ref7.item,
1131
- item = _ref7$item === void 0 ? process.env.NODE_ENV === 'production' ?
1132
- /* istanbul ignore next */
1133
- undefined : requiredProp('getItemProps', 'item') : _ref7$item,
1134
- rest = _objectWithoutPropertiesLoose__default['default'](_ref7, _excluded5$1);
1113
+ this.getItemProps = function (_temp7) {
1114
+ let {
1115
+ onMouseMove,
1116
+ onMouseDown,
1117
+ onClick,
1118
+ onPress,
1119
+ index,
1120
+ item = process.env.NODE_ENV === 'production' ?
1121
+ /* istanbul ignore next */
1122
+ undefined : requiredProp('getItemProps', 'item'),
1123
+ ...rest
1124
+ } = _temp7 === void 0 ? {} : _temp7;
1135
1125
 
1136
1126
  if (index === undefined) {
1137
1127
  _this.items.push(item);
@@ -1141,15 +1131,15 @@ var Downshift = /*#__PURE__*/function () {
1141
1131
  _this.items[index] = item;
1142
1132
  }
1143
1133
 
1144
- var onSelectKey = /* istanbul ignore next (react-native) */
1134
+ const onSelectKey = /* istanbul ignore next (react-native) */
1145
1135
  'onPress' ;
1146
- var customClickHandler = /* istanbul ignore next (react-native) */
1136
+ const customClickHandler = /* istanbul ignore next (react-native) */
1147
1137
  onPress ;
1148
- var enabledEventHandlers = (_enabledEventHandlers = {
1138
+ const enabledEventHandlers = {
1149
1139
  // onMouseMove is used over onMouseEnter here. onMouseMove
1150
1140
  // is only triggered on actual mouse movement while onMouseEnter
1151
1141
  // can fire on DOM changes, interrupting keyboard navigation
1152
- onMouseMove: callAllEventHandlers(onMouseMove, function () {
1142
+ onMouseMove: callAllEventHandlers(onMouseMove, () => {
1153
1143
  if (index === _this.getState().highlightedIndex) {
1154
1144
  return;
1155
1145
  }
@@ -1164,72 +1154,81 @@ var Downshift = /*#__PURE__*/function () {
1164
1154
 
1165
1155
  _this.avoidScrolling = true;
1166
1156
 
1167
- _this.internalSetTimeout(function () {
1168
- return _this.avoidScrolling = false;
1169
- }, 250);
1157
+ _this.internalSetTimeout(() => _this.avoidScrolling = false, 250);
1170
1158
  }),
1171
- onMouseDown: callAllEventHandlers(onMouseDown, function (event) {
1159
+ onMouseDown: callAllEventHandlers(onMouseDown, event => {
1172
1160
  // This prevents the activeElement from being changed
1173
1161
  // to the item so it can remain with the current activeElement
1174
1162
  // which is a more common use case.
1175
1163
  event.preventDefault();
1164
+ }),
1165
+ [onSelectKey]: callAllEventHandlers(customClickHandler, () => {
1166
+ _this.selectItemAtIndex(index, {
1167
+ type: clickItem
1168
+ });
1176
1169
  })
1177
- }, _enabledEventHandlers[onSelectKey] = callAllEventHandlers(customClickHandler, function () {
1178
- _this.selectItemAtIndex(index, {
1179
- type: clickItem
1180
- });
1181
- }), _enabledEventHandlers); // Passing down the onMouseDown handler to prevent redirect
1170
+ }; // Passing down the onMouseDown handler to prevent redirect
1182
1171
  // of the activeElement if clicking on disabled items
1183
1172
 
1184
- var eventHandlers = rest.disabled ? {
1173
+ const eventHandlers = rest.disabled ? {
1185
1174
  onMouseDown: enabledEventHandlers.onMouseDown
1186
1175
  } : enabledEventHandlers;
1187
- return _extends__default['default']({
1176
+ return {
1188
1177
  id: _this.getItemId(index),
1189
1178
  role: 'option',
1190
- 'aria-selected': _this.getState().highlightedIndex === index
1191
- }, eventHandlers, rest);
1179
+ 'aria-selected': _this.getState().highlightedIndex === index,
1180
+ ...eventHandlers,
1181
+ ...rest
1182
+ };
1192
1183
  };
1193
1184
 
1194
- _this.clearItems = function () {
1195
- _this.items = [];
1185
+ this.clearItems = () => {
1186
+ this.items = [];
1196
1187
  };
1197
1188
 
1198
- _this.reset = function (otherStateToSet, cb) {
1189
+ this.reset = function (otherStateToSet, cb) {
1199
1190
  if (otherStateToSet === void 0) {
1200
1191
  otherStateToSet = {};
1201
1192
  }
1202
1193
 
1203
1194
  otherStateToSet = pickState(otherStateToSet);
1204
1195
 
1205
- _this.internalSetState(function (_ref8) {
1206
- var selectedItem = _ref8.selectedItem;
1207
- return _extends__default['default']({
1196
+ _this.internalSetState(_ref => {
1197
+ let {
1198
+ selectedItem
1199
+ } = _ref;
1200
+ return {
1208
1201
  isOpen: _this.props.defaultIsOpen,
1209
1202
  highlightedIndex: _this.props.defaultHighlightedIndex,
1210
- inputValue: _this.props.itemToString(selectedItem)
1211
- }, otherStateToSet);
1203
+ inputValue: _this.props.itemToString(selectedItem),
1204
+ ...otherStateToSet
1205
+ };
1212
1206
  }, cb);
1213
1207
  };
1214
1208
 
1215
- _this.toggleMenu = function (otherStateToSet, cb) {
1209
+ this.toggleMenu = function (otherStateToSet, cb) {
1216
1210
  if (otherStateToSet === void 0) {
1217
1211
  otherStateToSet = {};
1218
1212
  }
1219
1213
 
1220
1214
  otherStateToSet = pickState(otherStateToSet);
1221
1215
 
1222
- _this.internalSetState(function (_ref9) {
1223
- var isOpen = _ref9.isOpen;
1224
- return _extends__default['default']({
1225
- isOpen: !isOpen
1226
- }, isOpen && {
1227
- highlightedIndex: _this.props.defaultHighlightedIndex
1228
- }, otherStateToSet);
1229
- }, function () {
1230
- var _this$getState7 = _this.getState(),
1231
- isOpen = _this$getState7.isOpen,
1232
- highlightedIndex = _this$getState7.highlightedIndex;
1216
+ _this.internalSetState(_ref2 => {
1217
+ let {
1218
+ isOpen
1219
+ } = _ref2;
1220
+ return {
1221
+ isOpen: !isOpen,
1222
+ ...(isOpen && {
1223
+ highlightedIndex: _this.props.defaultHighlightedIndex
1224
+ }),
1225
+ ...otherStateToSet
1226
+ };
1227
+ }, () => {
1228
+ const {
1229
+ isOpen,
1230
+ highlightedIndex
1231
+ } = _this.getState();
1233
1232
 
1234
1233
  if (isOpen) {
1235
1234
  if (_this.getItemCount() > 0 && typeof highlightedIndex === 'number') {
@@ -1241,70 +1240,63 @@ var Downshift = /*#__PURE__*/function () {
1241
1240
  });
1242
1241
  };
1243
1242
 
1244
- _this.openMenu = function (cb) {
1245
- _this.internalSetState({
1243
+ this.openMenu = cb => {
1244
+ this.internalSetState({
1246
1245
  isOpen: true
1247
1246
  }, cb);
1248
1247
  };
1249
1248
 
1250
- _this.closeMenu = function (cb) {
1251
- _this.internalSetState({
1249
+ this.closeMenu = cb => {
1250
+ this.internalSetState({
1252
1251
  isOpen: false
1253
1252
  }, cb);
1254
1253
  };
1255
1254
 
1256
- _this.updateStatus = debounce(function () {
1257
- var state = _this.getState();
1258
-
1259
- var item = _this.items[state.highlightedIndex];
1260
-
1261
- var resultCount = _this.getItemCount();
1262
-
1263
- var status = _this.props.getA11yStatusMessage(_extends__default['default']({
1264
- itemToString: _this.props.itemToString,
1265
- previousResultCount: _this.previousResultCount,
1266
- resultCount: resultCount,
1267
- highlightedItem: item
1268
- }, state));
1269
-
1270
- _this.previousResultCount = resultCount;
1271
- setStatus(status, _this.props.environment.document);
1255
+ this.updateStatus = debounce(() => {
1256
+ const state = this.getState();
1257
+ const item = this.items[state.highlightedIndex];
1258
+ const resultCount = this.getItemCount();
1259
+ const status = this.props.getA11yStatusMessage({
1260
+ itemToString: this.props.itemToString,
1261
+ previousResultCount: this.previousResultCount,
1262
+ resultCount,
1263
+ highlightedItem: item,
1264
+ ...state
1265
+ });
1266
+ this.previousResultCount = resultCount;
1267
+ setStatus(status, this.props.environment.document);
1272
1268
  }, 200);
1273
-
1274
- var _this$props = _this.props,
1275
- defaultHighlightedIndex = _this$props.defaultHighlightedIndex,
1276
- _this$props$initialHi = _this$props.initialHighlightedIndex,
1277
- _highlightedIndex = _this$props$initialHi === void 0 ? defaultHighlightedIndex : _this$props$initialHi,
1278
- defaultIsOpen = _this$props.defaultIsOpen,
1279
- _this$props$initialIs = _this$props.initialIsOpen,
1280
- _isOpen = _this$props$initialIs === void 0 ? defaultIsOpen : _this$props$initialIs,
1281
- _this$props$initialIn = _this$props.initialInputValue,
1282
- _inputValue = _this$props$initialIn === void 0 ? '' : _this$props$initialIn,
1283
- _this$props$initialSe = _this$props.initialSelectedItem,
1284
- _selectedItem = _this$props$initialSe === void 0 ? null : _this$props$initialSe;
1285
-
1286
- var _state = _this.getState({
1269
+ // fancy destructuring + defaults + aliases
1270
+ // this basically says each value of state should either be set to
1271
+ // the initial value or the default value if the initial value is not provided
1272
+ const {
1273
+ defaultHighlightedIndex,
1274
+ initialHighlightedIndex: _highlightedIndex = defaultHighlightedIndex,
1275
+ defaultIsOpen,
1276
+ initialIsOpen: _isOpen = defaultIsOpen,
1277
+ initialInputValue: _inputValue = '',
1278
+ initialSelectedItem: _selectedItem = null
1279
+ } = this.props;
1280
+
1281
+ const _state = this.getState({
1287
1282
  highlightedIndex: _highlightedIndex,
1288
1283
  isOpen: _isOpen,
1289
1284
  inputValue: _inputValue,
1290
1285
  selectedItem: _selectedItem
1291
1286
  });
1292
1287
 
1293
- if (_state.selectedItem != null && _this.props.initialInputValue === undefined) {
1294
- _state.inputValue = _this.props.itemToString(_state.selectedItem);
1288
+ if (_state.selectedItem != null && this.props.initialInputValue === undefined) {
1289
+ _state.inputValue = this.props.itemToString(_state.selectedItem);
1295
1290
  }
1296
1291
 
1297
- _this.state = _state;
1298
- return _this;
1292
+ this.state = _state;
1299
1293
  }
1300
1294
 
1301
- var _proto = Downshift.prototype;
1302
-
1303
1295
  /**
1304
1296
  * Clear all running timeouts
1305
1297
  */
1306
- _proto.internalClearTimeouts = function internalClearTimeouts() {
1307
- this.timeoutIds.forEach(function (id) {
1298
+ internalClearTimeouts() {
1299
+ this.timeoutIds.forEach(id => {
1308
1300
  clearTimeout(id);
1309
1301
  });
1310
1302
  this.timeoutIds = [];
@@ -1318,22 +1310,22 @@ var Downshift = /*#__PURE__*/function () {
1318
1310
  * @param {Object} stateToMerge defaults to this.state
1319
1311
  * @return {Object} the state
1320
1312
  */
1321
- ;
1322
1313
 
1323
- _proto.getState = function getState$1(stateToMerge) {
1314
+
1315
+ getState(stateToMerge) {
1324
1316
  if (stateToMerge === void 0) {
1325
1317
  stateToMerge = this.state;
1326
1318
  }
1327
1319
 
1328
1320
  return getState(stateToMerge, this.props);
1329
- };
1321
+ }
1330
1322
 
1331
- _proto.getItemCount = function getItemCount() {
1323
+ getItemCount() {
1332
1324
  // things read better this way. They're in priority order:
1333
1325
  // 1. `this.itemCount`
1334
1326
  // 2. `this.props.itemCount`
1335
1327
  // 3. `this.items.length`
1336
- var itemCount = this.items.length;
1328
+ let itemCount = this.items.length;
1337
1329
 
1338
1330
  if (this.itemCount != null) {
1339
1331
  itemCount = this.itemCount;
@@ -1342,97 +1334,97 @@ var Downshift = /*#__PURE__*/function () {
1342
1334
  }
1343
1335
 
1344
1336
  return itemCount;
1345
- };
1337
+ }
1346
1338
 
1347
- _proto.getItemNodeFromIndex = function getItemNodeFromIndex(index) {
1339
+ getItemNodeFromIndex(index) {
1348
1340
  return this.props.environment.document.getElementById(this.getItemId(index));
1349
- };
1350
-
1351
- _proto.scrollHighlightedItemIntoView = function scrollHighlightedItemIntoView() {
1352
- };
1353
-
1354
- _proto.moveHighlightedIndex = function moveHighlightedIndex(amount, otherStateToSet) {
1355
- var _this6 = this;
1341
+ }
1356
1342
 
1357
- var itemCount = this.getItemCount();
1343
+ scrollHighlightedItemIntoView() {
1344
+ }
1358
1345
 
1359
- var _this$getState8 = this.getState(),
1360
- highlightedIndex = _this$getState8.highlightedIndex;
1346
+ moveHighlightedIndex(amount, otherStateToSet) {
1347
+ const itemCount = this.getItemCount();
1348
+ const {
1349
+ highlightedIndex
1350
+ } = this.getState();
1361
1351
 
1362
1352
  if (itemCount > 0) {
1363
- var nextHighlightedIndex = getNextWrappingIndex(amount, highlightedIndex, itemCount, function (index) {
1364
- return _this6.getItemNodeFromIndex(index);
1365
- });
1353
+ const nextHighlightedIndex = getNextWrappingIndex(amount, highlightedIndex, itemCount, index => this.getItemNodeFromIndex(index));
1366
1354
  this.setHighlightedIndex(nextHighlightedIndex, otherStateToSet);
1367
1355
  }
1368
- };
1356
+ }
1369
1357
 
1370
- _proto.getStateAndHelpers = function getStateAndHelpers() {
1371
- var _this$getState9 = this.getState(),
1372
- highlightedIndex = _this$getState9.highlightedIndex,
1373
- inputValue = _this$getState9.inputValue,
1374
- selectedItem = _this$getState9.selectedItem,
1375
- isOpen = _this$getState9.isOpen;
1376
-
1377
- var itemToString = this.props.itemToString;
1378
- var id = this.id;
1379
- var getRootProps = this.getRootProps,
1380
- getToggleButtonProps = this.getToggleButtonProps,
1381
- getLabelProps = this.getLabelProps,
1382
- getMenuProps = this.getMenuProps,
1383
- getInputProps = this.getInputProps,
1384
- getItemProps = this.getItemProps,
1385
- openMenu = this.openMenu,
1386
- closeMenu = this.closeMenu,
1387
- toggleMenu = this.toggleMenu,
1388
- selectItem = this.selectItem,
1389
- selectItemAtIndex = this.selectItemAtIndex,
1390
- selectHighlightedItem = this.selectHighlightedItem,
1391
- setHighlightedIndex = this.setHighlightedIndex,
1392
- clearSelection = this.clearSelection,
1393
- clearItems = this.clearItems,
1394
- reset = this.reset,
1395
- setItemCount = this.setItemCount,
1396
- unsetItemCount = this.unsetItemCount,
1397
- setState = this.internalSetState;
1358
+ getStateAndHelpers() {
1359
+ const {
1360
+ highlightedIndex,
1361
+ inputValue,
1362
+ selectedItem,
1363
+ isOpen
1364
+ } = this.getState();
1365
+ const {
1366
+ itemToString
1367
+ } = this.props;
1368
+ const {
1369
+ id
1370
+ } = this;
1371
+ const {
1372
+ getRootProps,
1373
+ getToggleButtonProps,
1374
+ getLabelProps,
1375
+ getMenuProps,
1376
+ getInputProps,
1377
+ getItemProps,
1378
+ openMenu,
1379
+ closeMenu,
1380
+ toggleMenu,
1381
+ selectItem,
1382
+ selectItemAtIndex,
1383
+ selectHighlightedItem,
1384
+ setHighlightedIndex,
1385
+ clearSelection,
1386
+ clearItems,
1387
+ reset,
1388
+ setItemCount,
1389
+ unsetItemCount,
1390
+ internalSetState: setState
1391
+ } = this;
1398
1392
  return {
1399
1393
  // prop getters
1400
- getRootProps: getRootProps,
1401
- getToggleButtonProps: getToggleButtonProps,
1402
- getLabelProps: getLabelProps,
1403
- getMenuProps: getMenuProps,
1404
- getInputProps: getInputProps,
1405
- getItemProps: getItemProps,
1394
+ getRootProps,
1395
+ getToggleButtonProps,
1396
+ getLabelProps,
1397
+ getMenuProps,
1398
+ getInputProps,
1399
+ getItemProps,
1406
1400
  // actions
1407
- reset: reset,
1408
- openMenu: openMenu,
1409
- closeMenu: closeMenu,
1410
- toggleMenu: toggleMenu,
1411
- selectItem: selectItem,
1412
- selectItemAtIndex: selectItemAtIndex,
1413
- selectHighlightedItem: selectHighlightedItem,
1414
- setHighlightedIndex: setHighlightedIndex,
1415
- clearSelection: clearSelection,
1416
- clearItems: clearItems,
1417
- setItemCount: setItemCount,
1418
- unsetItemCount: unsetItemCount,
1419
- setState: setState,
1401
+ reset,
1402
+ openMenu,
1403
+ closeMenu,
1404
+ toggleMenu,
1405
+ selectItem,
1406
+ selectItemAtIndex,
1407
+ selectHighlightedItem,
1408
+ setHighlightedIndex,
1409
+ clearSelection,
1410
+ clearItems,
1411
+ setItemCount,
1412
+ unsetItemCount,
1413
+ setState,
1420
1414
  // props
1421
- itemToString: itemToString,
1415
+ itemToString,
1422
1416
  // derived
1423
- id: id,
1417
+ id,
1424
1418
  // state
1425
- highlightedIndex: highlightedIndex,
1426
- inputValue: inputValue,
1427
- isOpen: isOpen,
1428
- selectedItem: selectedItem
1419
+ highlightedIndex,
1420
+ inputValue,
1421
+ isOpen,
1422
+ selectedItem
1429
1423
  };
1430
1424
  } //////////////////////////// ROOT
1431
- ;
1432
1425
 
1433
- _proto.componentDidMount = function componentDidMount() {
1434
- var _this7 = this;
1435
1426
 
1427
+ componentDidMount() {
1436
1428
  /* istanbul ignore if (react-native) */
1437
1429
  if (process.env.NODE_ENV !== 'production' && !true && this.getMenuProps.called && !this.getMenuProps.suppressRefError) {
1438
1430
  validateGetMenuPropsCalledCorrectly(this._menuNode, this.getMenuProps);
@@ -1441,25 +1433,25 @@ var Downshift = /*#__PURE__*/function () {
1441
1433
 
1442
1434
 
1443
1435
  {
1444
- this.cleanup = function () {
1445
- _this7.internalClearTimeouts();
1436
+ this.cleanup = () => {
1437
+ this.internalClearTimeouts();
1446
1438
  };
1447
1439
  }
1448
- };
1449
-
1450
- _proto.shouldScroll = function shouldScroll(prevState, prevProps) {
1451
- var _ref10 = this.props.highlightedIndex === undefined ? this.getState() : this.props,
1452
- currentHighlightedIndex = _ref10.highlightedIndex;
1453
-
1454
- var _ref11 = prevProps.highlightedIndex === undefined ? prevState : prevProps,
1455
- prevHighlightedIndex = _ref11.highlightedIndex;
1440
+ }
1456
1441
 
1457
- var scrollWhenOpen = currentHighlightedIndex && this.getState().isOpen && !prevState.isOpen;
1458
- var scrollWhenNavigating = currentHighlightedIndex !== prevHighlightedIndex;
1442
+ shouldScroll(prevState, prevProps) {
1443
+ const {
1444
+ highlightedIndex: currentHighlightedIndex
1445
+ } = this.props.highlightedIndex === undefined ? this.getState() : this.props;
1446
+ const {
1447
+ highlightedIndex: prevHighlightedIndex
1448
+ } = prevProps.highlightedIndex === undefined ? prevState : prevProps;
1449
+ const scrollWhenOpen = currentHighlightedIndex && this.getState().isOpen && !prevState.isOpen;
1450
+ const scrollWhenNavigating = currentHighlightedIndex !== prevHighlightedIndex;
1459
1451
  return scrollWhenOpen || scrollWhenNavigating;
1460
- };
1452
+ }
1461
1453
 
1462
- _proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
1454
+ componentDidUpdate(prevProps, prevState) {
1463
1455
  if (process.env.NODE_ENV !== 'production') {
1464
1456
  validateControlledUnchanged(this.state, prevProps, this.props);
1465
1457
  }
@@ -1474,14 +1466,14 @@ var Downshift = /*#__PURE__*/function () {
1474
1466
  if (!this.avoidScrolling && this.shouldScroll(prevState, prevProps)) {
1475
1467
  this.scrollHighlightedItemIntoView();
1476
1468
  }
1477
- };
1469
+ }
1478
1470
 
1479
- _proto.componentWillUnmount = function componentWillUnmount() {
1471
+ componentWillUnmount() {
1480
1472
  this.cleanup(); // avoids memory leak
1481
- };
1473
+ }
1482
1474
 
1483
- _proto.render = function render() {
1484
- var children = unwrapArray(this.props.children, noop); // because the items are rerendered every time we call the children
1475
+ render() {
1476
+ const children = unwrapArray(this.props.children, noop); // because the items are rerendered every time we call the children
1485
1477
  // we clear this out each render and it will be populated again as
1486
1478
  // getItemProps is called.
1487
1479
 
@@ -1501,7 +1493,7 @@ var Downshift = /*#__PURE__*/function () {
1501
1493
  this.getLabelProps.called = false; // and something similar for getInputProps
1502
1494
 
1503
1495
  this.getInputProps.called = false;
1504
- var element = unwrapArray(children(this.getStateAndHelpers()));
1496
+ const element = unwrapArray(children(this.getStateAndHelpers()));
1505
1497
 
1506
1498
  if (!element) {
1507
1499
  return null;
@@ -1530,16 +1522,15 @@ var Downshift = /*#__PURE__*/function () {
1530
1522
 
1531
1523
 
1532
1524
  return undefined;
1533
- };
1525
+ }
1534
1526
 
1535
- return Downshift;
1536
- }(react.Component);
1527
+ }
1537
1528
 
1538
1529
  Downshift.defaultProps = {
1539
1530
  defaultHighlightedIndex: null,
1540
1531
  defaultIsOpen: false,
1541
1532
  getA11yStatusMessage: getA11yStatusMessage$1,
1542
- itemToString: function itemToString(i) {
1533
+ itemToString: i => {
1543
1534
  if (i == null) {
1544
1535
  return '';
1545
1536
  }
@@ -1557,72 +1548,70 @@ var Downshift = /*#__PURE__*/function () {
1557
1548
  onChange: noop,
1558
1549
  onSelect: noop,
1559
1550
  onOuterClick: noop,
1560
- selectedItemChanged: function selectedItemChanged(prevItem, item) {
1561
- return prevItem !== item;
1562
- },
1551
+ selectedItemChanged: (prevItem, item) => prevItem !== item,
1563
1552
  environment:
1564
1553
  /* istanbul ignore next (ssr) */
1565
1554
  typeof window === 'undefined' ? {} : window,
1566
- stateReducer: function stateReducer(state, stateToSet) {
1567
- return stateToSet;
1568
- },
1555
+ stateReducer: (state, stateToSet) => stateToSet,
1569
1556
  suppressRefError: false,
1570
- scrollIntoView: scrollIntoView
1557
+ scrollIntoView
1571
1558
  };
1572
1559
  Downshift.stateChangeTypes = stateChangeTypes$3;
1573
1560
  return Downshift;
1574
- }();
1561
+ })();
1575
1562
 
1576
1563
  process.env.NODE_ENV !== "production" ? Downshift.propTypes = {
1577
- children: PropTypes__default['default'].func,
1578
- defaultHighlightedIndex: PropTypes__default['default'].number,
1579
- defaultIsOpen: PropTypes__default['default'].bool,
1580
- initialHighlightedIndex: PropTypes__default['default'].number,
1581
- initialSelectedItem: PropTypes__default['default'].any,
1582
- initialInputValue: PropTypes__default['default'].string,
1583
- initialIsOpen: PropTypes__default['default'].bool,
1584
- getA11yStatusMessage: PropTypes__default['default'].func,
1585
- itemToString: PropTypes__default['default'].func,
1586
- onChange: PropTypes__default['default'].func,
1587
- onSelect: PropTypes__default['default'].func,
1588
- onStateChange: PropTypes__default['default'].func,
1589
- onInputValueChange: PropTypes__default['default'].func,
1590
- onUserAction: PropTypes__default['default'].func,
1591
- onOuterClick: PropTypes__default['default'].func,
1592
- selectedItemChanged: PropTypes__default['default'].func,
1593
- stateReducer: PropTypes__default['default'].func,
1594
- itemCount: PropTypes__default['default'].number,
1595
- id: PropTypes__default['default'].string,
1596
- environment: PropTypes__default['default'].shape({
1597
- addEventListener: PropTypes__default['default'].func,
1598
- removeEventListener: PropTypes__default['default'].func,
1599
- document: PropTypes__default['default'].shape({
1600
- getElementById: PropTypes__default['default'].func,
1601
- activeElement: PropTypes__default['default'].any,
1602
- body: PropTypes__default['default'].any
1564
+ children: PropTypes__default["default"].func,
1565
+ defaultHighlightedIndex: PropTypes__default["default"].number,
1566
+ defaultIsOpen: PropTypes__default["default"].bool,
1567
+ initialHighlightedIndex: PropTypes__default["default"].number,
1568
+ initialSelectedItem: PropTypes__default["default"].any,
1569
+ initialInputValue: PropTypes__default["default"].string,
1570
+ initialIsOpen: PropTypes__default["default"].bool,
1571
+ getA11yStatusMessage: PropTypes__default["default"].func,
1572
+ itemToString: PropTypes__default["default"].func,
1573
+ onChange: PropTypes__default["default"].func,
1574
+ onSelect: PropTypes__default["default"].func,
1575
+ onStateChange: PropTypes__default["default"].func,
1576
+ onInputValueChange: PropTypes__default["default"].func,
1577
+ onUserAction: PropTypes__default["default"].func,
1578
+ onOuterClick: PropTypes__default["default"].func,
1579
+ selectedItemChanged: PropTypes__default["default"].func,
1580
+ stateReducer: PropTypes__default["default"].func,
1581
+ itemCount: PropTypes__default["default"].number,
1582
+ id: PropTypes__default["default"].string,
1583
+ environment: PropTypes__default["default"].shape({
1584
+ addEventListener: PropTypes__default["default"].func,
1585
+ removeEventListener: PropTypes__default["default"].func,
1586
+ document: PropTypes__default["default"].shape({
1587
+ getElementById: PropTypes__default["default"].func,
1588
+ activeElement: PropTypes__default["default"].any,
1589
+ body: PropTypes__default["default"].any
1603
1590
  })
1604
1591
  }),
1605
- suppressRefError: PropTypes__default['default'].bool,
1606
- scrollIntoView: PropTypes__default['default'].func,
1592
+ suppressRefError: PropTypes__default["default"].bool,
1593
+ scrollIntoView: PropTypes__default["default"].func,
1607
1594
  // things we keep in state for uncontrolled components
1608
1595
  // but can accept as props for controlled components
1609
1596
 
1610
1597
  /* eslint-disable react/no-unused-prop-types */
1611
- selectedItem: PropTypes__default['default'].any,
1612
- isOpen: PropTypes__default['default'].bool,
1613
- inputValue: PropTypes__default['default'].string,
1614
- highlightedIndex: PropTypes__default['default'].number,
1615
- labelId: PropTypes__default['default'].string,
1616
- inputId: PropTypes__default['default'].string,
1617
- menuId: PropTypes__default['default'].string,
1618
- getItemId: PropTypes__default['default'].func
1598
+ selectedItem: PropTypes__default["default"].any,
1599
+ isOpen: PropTypes__default["default"].bool,
1600
+ inputValue: PropTypes__default["default"].string,
1601
+ highlightedIndex: PropTypes__default["default"].number,
1602
+ labelId: PropTypes__default["default"].string,
1603
+ inputId: PropTypes__default["default"].string,
1604
+ menuId: PropTypes__default["default"].string,
1605
+ getItemId: PropTypes__default["default"].func
1619
1606
  /* eslint-enable react/no-unused-prop-types */
1620
1607
 
1621
1608
  } : void 0;
1622
1609
  var Downshift$1 = Downshift;
1623
1610
 
1624
- function validateGetMenuPropsCalledCorrectly(node, _ref12) {
1625
- var refKey = _ref12.refKey;
1611
+ function validateGetMenuPropsCalledCorrectly(node, _ref3) {
1612
+ let {
1613
+ refKey
1614
+ } = _ref3;
1626
1615
 
1627
1616
  if (!node) {
1628
1617
  // eslint-disable-next-line no-console
@@ -1630,10 +1619,12 @@ function validateGetMenuPropsCalledCorrectly(node, _ref12) {
1630
1619
  }
1631
1620
  }
1632
1621
 
1633
- function validateGetRootPropsCalledCorrectly(element, _ref13) {
1634
- var refKey = _ref13.refKey;
1635
- var refKeySpecified = refKey !== 'ref';
1636
- var isComposite = !isDOMElement(element);
1622
+ function validateGetRootPropsCalledCorrectly(element, _ref4) {
1623
+ let {
1624
+ refKey
1625
+ } = _ref4;
1626
+ const refKeySpecified = refKey !== 'ref';
1627
+ const isComposite = !isDOMElement(element);
1637
1628
 
1638
1629
  if (isComposite && !refKeySpecified && !reactIs.isForwardRef(element)) {
1639
1630
  // eslint-disable-next-line no-console
@@ -1649,8 +1640,7 @@ function validateGetRootPropsCalledCorrectly(element, _ref13) {
1649
1640
  }
1650
1641
  }
1651
1642
 
1652
- var _excluded$3 = ["isInitialMount", "highlightedIndex", "items", "environment"];
1653
- var dropdownDefaultStateValues = {
1643
+ const dropdownDefaultStateValues = {
1654
1644
  highlightedIndex: -1,
1655
1645
  isOpen: false,
1656
1646
  selectedItem: null,
@@ -1658,10 +1648,12 @@ var dropdownDefaultStateValues = {
1658
1648
  };
1659
1649
 
1660
1650
  function callOnChangeProps(action, state, newState) {
1661
- var props = action.props,
1662
- type = action.type;
1663
- var changes = {};
1664
- Object.keys(state).forEach(function (key) {
1651
+ const {
1652
+ props,
1653
+ type
1654
+ } = action;
1655
+ const changes = {};
1656
+ Object.keys(state).forEach(key => {
1665
1657
  invokeOnChangeHandler(key, action, state, newState);
1666
1658
 
1667
1659
  if (newState[key] !== state[key]) {
@@ -1670,21 +1662,25 @@ function callOnChangeProps(action, state, newState) {
1670
1662
  });
1671
1663
 
1672
1664
  if (props.onStateChange && Object.keys(changes).length) {
1673
- props.onStateChange(_extends__default['default']({
1674
- type: type
1675
- }, changes));
1665
+ props.onStateChange({
1666
+ type,
1667
+ ...changes
1668
+ });
1676
1669
  }
1677
1670
  }
1678
1671
 
1679
1672
  function invokeOnChangeHandler(key, action, state, newState) {
1680
- var props = action.props,
1681
- type = action.type;
1682
- var handler = "on" + capitalizeString(key) + "Change";
1673
+ const {
1674
+ props,
1675
+ type
1676
+ } = action;
1677
+ const handler = "on" + capitalizeString(key) + "Change";
1683
1678
 
1684
1679
  if (props[handler] && newState[key] !== undefined && newState[key] !== state[key]) {
1685
- props[handler](_extends__default['default']({
1686
- type: type
1687
- }, newState));
1680
+ props[handler]({
1681
+ type,
1682
+ ...newState
1683
+ });
1688
1684
  }
1689
1685
  }
1690
1686
  /**
@@ -1708,8 +1704,10 @@ function stateReducer(s, a) {
1708
1704
 
1709
1705
 
1710
1706
  function getA11ySelectionMessage(selectionParameters) {
1711
- var selectedItem = selectionParameters.selectedItem,
1712
- itemToStringLocal = selectionParameters.itemToString;
1707
+ const {
1708
+ selectedItem,
1709
+ itemToString: itemToStringLocal
1710
+ } = selectionParameters;
1713
1711
  return selectedItem ? itemToStringLocal(selectedItem) + " has been selected." : '';
1714
1712
  }
1715
1713
  /**
@@ -1717,26 +1715,25 @@ function getA11ySelectionMessage(selectionParameters) {
1717
1715
  */
1718
1716
 
1719
1717
 
1720
- var updateA11yStatus = debounce(function (getA11yMessage, document) {
1718
+ const updateA11yStatus = debounce((getA11yMessage, document) => {
1721
1719
  setStatus(getA11yMessage(), document);
1722
1720
  }, 200); // istanbul ignore next
1723
1721
 
1724
- var useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? react.useLayoutEffect : react.useEffect;
1722
+ const useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? react.useLayoutEffect : react.useEffect;
1725
1723
 
1726
1724
  function useElementIds(_ref) {
1727
- var _ref$id = _ref.id,
1728
- id = _ref$id === void 0 ? "downshift-" + generateId() : _ref$id,
1729
- labelId = _ref.labelId,
1730
- menuId = _ref.menuId,
1731
- getItemId = _ref.getItemId,
1732
- toggleButtonId = _ref.toggleButtonId,
1733
- inputId = _ref.inputId;
1734
- var elementIdsRef = react.useRef({
1725
+ let {
1726
+ id = "downshift-" + generateId(),
1727
+ labelId,
1728
+ menuId,
1729
+ getItemId,
1730
+ toggleButtonId,
1731
+ inputId
1732
+ } = _ref;
1733
+ const elementIdsRef = react.useRef({
1735
1734
  labelId: labelId || id + "-label",
1736
1735
  menuId: menuId || id + "-menu",
1737
- getItemId: getItemId || function (index) {
1738
- return id + "-item-" + index;
1739
- },
1736
+ getItemId: getItemId || (index => id + "-item-" + index),
1740
1737
  toggleButtonId: toggleButtonId || id + "-toggle-button",
1741
1738
  inputId: inputId || id + "-input"
1742
1739
  });
@@ -1768,7 +1765,7 @@ function capitalizeString(string) {
1768
1765
  }
1769
1766
 
1770
1767
  function useLatestRef(val) {
1771
- var ref = react.useRef(val); // technically this is not "concurrent mode safe" because we're manipulating
1768
+ const ref = react.useRef(val); // technically this is not "concurrent mode safe" because we're manipulating
1772
1769
  // the value during render (so it's not idempotent). However, the places this
1773
1770
  // hook is used is to support memoizing callbacks which will be called
1774
1771
  // *during* render, so we need the latest values *during* render.
@@ -1790,30 +1787,25 @@ function useLatestRef(val) {
1790
1787
 
1791
1788
 
1792
1789
  function useEnhancedReducer(reducer, initialState, props) {
1793
- var prevStateRef = react.useRef();
1794
- var actionRef = react.useRef();
1795
- var enhancedReducer = react.useCallback(function (state, action) {
1790
+ const prevStateRef = react.useRef();
1791
+ const actionRef = react.useRef();
1792
+ const enhancedReducer = react.useCallback((state, action) => {
1796
1793
  actionRef.current = action;
1797
1794
  state = getState(state, action.props);
1798
- var changes = reducer(state, action);
1799
- var newState = action.props.stateReducer(state, _extends__default['default']({}, action, {
1800
- changes: changes
1801
- }));
1795
+ const changes = reducer(state, action);
1796
+ const newState = action.props.stateReducer(state, { ...action,
1797
+ changes
1798
+ });
1802
1799
  return newState;
1803
1800
  }, [reducer]);
1804
-
1805
- var _useReducer = react.useReducer(enhancedReducer, initialState),
1806
- state = _useReducer[0],
1807
- dispatch = _useReducer[1];
1808
-
1809
- var propsRef = useLatestRef(props);
1810
- var dispatchWithProps = react.useCallback(function (action) {
1811
- return dispatch(_extends__default['default']({
1812
- props: propsRef.current
1813
- }, action));
1814
- }, [propsRef]);
1815
- var action = actionRef.current;
1816
- react.useEffect(function () {
1801
+ const [state, dispatch] = react.useReducer(enhancedReducer, initialState);
1802
+ const propsRef = useLatestRef(props);
1803
+ const dispatchWithProps = react.useCallback(action => dispatch({
1804
+ props: propsRef.current,
1805
+ ...action
1806
+ }), [propsRef]);
1807
+ const action = actionRef.current;
1808
+ react.useEffect(() => {
1817
1809
  if (action && prevStateRef.current && prevStateRef.current !== state) {
1818
1810
  callOnChangeProps(action, getState(prevStateRef.current, action.props), state);
1819
1811
  }
@@ -1834,18 +1826,15 @@ function useEnhancedReducer(reducer, initialState, props) {
1834
1826
 
1835
1827
 
1836
1828
  function useControlledReducer$1(reducer, initialState, props) {
1837
- var _useEnhancedReducer = useEnhancedReducer(reducer, initialState, props),
1838
- state = _useEnhancedReducer[0],
1839
- dispatch = _useEnhancedReducer[1];
1840
-
1829
+ const [state, dispatch] = useEnhancedReducer(reducer, initialState, props);
1841
1830
  return [getState(state, props), dispatch];
1842
1831
  }
1843
1832
 
1844
- var defaultProps$3 = {
1845
- itemToString: itemToString,
1846
- stateReducer: stateReducer,
1847
- getA11ySelectionMessage: getA11ySelectionMessage,
1848
- scrollIntoView: scrollIntoView,
1833
+ const defaultProps$3 = {
1834
+ itemToString,
1835
+ stateReducer,
1836
+ getA11ySelectionMessage,
1837
+ scrollIntoView,
1849
1838
  circularNavigation: false,
1850
1839
  environment:
1851
1840
  /* istanbul ignore next (ssr) */
@@ -1857,10 +1846,10 @@ function getDefaultValue$1(props, propKey, defaultStateValues) {
1857
1846
  defaultStateValues = dropdownDefaultStateValues;
1858
1847
  }
1859
1848
 
1860
- var defaultPropKey = "default" + capitalizeString(propKey);
1849
+ const defaultValue = props["default" + capitalizeString(propKey)];
1861
1850
 
1862
- if (defaultPropKey in props) {
1863
- return props[defaultPropKey];
1851
+ if (defaultValue !== undefined) {
1852
+ return defaultValue;
1864
1853
  }
1865
1854
 
1866
1855
  return defaultStateValues[propKey];
@@ -1871,38 +1860,44 @@ function getInitialValue$1(props, propKey, defaultStateValues) {
1871
1860
  defaultStateValues = dropdownDefaultStateValues;
1872
1861
  }
1873
1862
 
1874
- if (propKey in props) {
1875
- return props[propKey];
1863
+ const value = props[propKey];
1864
+
1865
+ if (value !== undefined) {
1866
+ return value;
1876
1867
  }
1877
1868
 
1878
- var initialPropKey = "initial" + capitalizeString(propKey);
1869
+ const initialValue = props["initial" + capitalizeString(propKey)];
1879
1870
 
1880
- if (initialPropKey in props) {
1881
- return props[initialPropKey];
1871
+ if (initialValue !== undefined) {
1872
+ return initialValue;
1882
1873
  }
1883
1874
 
1884
1875
  return getDefaultValue$1(props, propKey, defaultStateValues);
1885
1876
  }
1886
1877
 
1887
1878
  function getInitialState$2(props) {
1888
- var selectedItem = getInitialValue$1(props, 'selectedItem');
1889
- var isOpen = getInitialValue$1(props, 'isOpen');
1890
- var highlightedIndex = getInitialValue$1(props, 'highlightedIndex');
1891
- var inputValue = getInitialValue$1(props, 'inputValue');
1879
+ const selectedItem = getInitialValue$1(props, 'selectedItem');
1880
+ const isOpen = getInitialValue$1(props, 'isOpen');
1881
+ const highlightedIndex = getInitialValue$1(props, 'highlightedIndex');
1882
+ const inputValue = getInitialValue$1(props, 'inputValue');
1892
1883
  return {
1893
1884
  highlightedIndex: highlightedIndex < 0 && selectedItem && isOpen ? props.items.indexOf(selectedItem) : highlightedIndex,
1894
- isOpen: isOpen,
1895
- selectedItem: selectedItem,
1896
- inputValue: inputValue
1885
+ isOpen,
1886
+ selectedItem,
1887
+ inputValue
1897
1888
  };
1898
1889
  }
1899
1890
 
1900
1891
  function getHighlightedIndexOnOpen(props, state, offset, getItemNodeFromIndex) {
1901
- var items = props.items,
1902
- initialHighlightedIndex = props.initialHighlightedIndex,
1903
- defaultHighlightedIndex = props.defaultHighlightedIndex;
1904
- var selectedItem = state.selectedItem,
1905
- highlightedIndex = state.highlightedIndex;
1892
+ const {
1893
+ items,
1894
+ initialHighlightedIndex,
1895
+ defaultHighlightedIndex
1896
+ } = props;
1897
+ const {
1898
+ selectedItem,
1899
+ highlightedIndex
1900
+ } = state;
1906
1901
 
1907
1902
  if (items.length === 0) {
1908
1903
  return -1;
@@ -1943,39 +1938,35 @@ function getHighlightedIndexOnOpen(props, state, offset, getItemNodeFromIndex) {
1943
1938
 
1944
1939
 
1945
1940
  function useMouseAndTouchTracker(isOpen, downshiftElementRefs, environment, handleBlur) {
1946
- var mouseAndTouchTrackersRef = react.useRef({
1941
+ const mouseAndTouchTrackersRef = react.useRef({
1947
1942
  isMouseDown: false,
1948
1943
  isTouchMove: false
1949
1944
  });
1950
- react.useEffect(function () {
1945
+ react.useEffect(() => {
1951
1946
  // The same strategy for checking if a click occurred inside or outside downsift
1952
1947
  // as in downshift.js.
1953
- var onMouseDown = function onMouseDown() {
1948
+ const onMouseDown = () => {
1954
1949
  mouseAndTouchTrackersRef.current.isMouseDown = true;
1955
1950
  };
1956
1951
 
1957
- var onMouseUp = function onMouseUp(event) {
1952
+ const onMouseUp = event => {
1958
1953
  mouseAndTouchTrackersRef.current.isMouseDown = false;
1959
1954
 
1960
- if (isOpen && !targetWithinDownshift(event.target, downshiftElementRefs.map(function (ref) {
1961
- return ref.current;
1962
- }), environment)) {
1955
+ if (isOpen && !targetWithinDownshift(event.target, downshiftElementRefs.map(ref => ref.current), environment)) {
1963
1956
  handleBlur();
1964
1957
  }
1965
1958
  };
1966
1959
 
1967
- var onTouchStart = function onTouchStart() {
1960
+ const onTouchStart = () => {
1968
1961
  mouseAndTouchTrackersRef.current.isTouchMove = false;
1969
1962
  };
1970
1963
 
1971
- var onTouchMove = function onTouchMove() {
1964
+ const onTouchMove = () => {
1972
1965
  mouseAndTouchTrackersRef.current.isTouchMove = true;
1973
1966
  };
1974
1967
 
1975
- var onTouchEnd = function onTouchEnd(event) {
1976
- if (isOpen && !mouseAndTouchTrackersRef.current.isTouchMove && !targetWithinDownshift(event.target, downshiftElementRefs.map(function (ref) {
1977
- return ref.current;
1978
- }), environment, false)) {
1968
+ const onTouchEnd = event => {
1969
+ if (isOpen && !mouseAndTouchTrackersRef.current.isTouchMove && !targetWithinDownshift(event.target, downshiftElementRefs.map(ref => ref.current), environment, false)) {
1979
1970
  handleBlur();
1980
1971
  }
1981
1972
  };
@@ -1999,9 +1990,7 @@ function useMouseAndTouchTracker(isOpen, downshiftElementRefs, environment, hand
1999
1990
  // eslint-disable-next-line import/no-mutable-exports
2000
1991
 
2001
1992
 
2002
- var useGetterPropsCalledChecker = function useGetterPropsCalledChecker() {
2003
- return noop;
2004
- };
1993
+ let useGetterPropsCalledChecker = () => noop;
2005
1994
  /**
2006
1995
  * Custom hook that checks if getter props are called correctly.
2007
1996
  *
@@ -2013,20 +2002,20 @@ var useGetterPropsCalledChecker = function useGetterPropsCalledChecker() {
2013
2002
 
2014
2003
 
2015
2004
  if (process.env.NODE_ENV !== 'production') {
2016
- useGetterPropsCalledChecker = function useGetterPropsCalledChecker() {
2017
- var isInitialMountRef = react.useRef(true);
2005
+ useGetterPropsCalledChecker = function () {
2006
+ const isInitialMountRef = react.useRef(true);
2018
2007
 
2019
2008
  for (var _len = arguments.length, propKeys = new Array(_len), _key = 0; _key < _len; _key++) {
2020
2009
  propKeys[_key] = arguments[_key];
2021
2010
  }
2022
2011
 
2023
- var getterPropsCalledRef = react.useRef(propKeys.reduce(function (acc, propKey) {
2012
+ const getterPropsCalledRef = react.useRef(propKeys.reduce((acc, propKey) => {
2024
2013
  acc[propKey] = {};
2025
2014
  return acc;
2026
2015
  }, {}));
2027
- react.useEffect(function () {
2028
- Object.keys(getterPropsCalledRef.current).forEach(function (propKey) {
2029
- var propCallInfo = getterPropsCalledRef.current[propKey];
2016
+ react.useEffect(() => {
2017
+ Object.keys(getterPropsCalledRef.current).forEach(propKey => {
2018
+ const propCallInfo = getterPropsCalledRef.current[propKey];
2030
2019
 
2031
2020
  if (isInitialMountRef.current) {
2032
2021
  if (!Object.keys(propCallInfo).length) {
@@ -2036,9 +2025,11 @@ if (process.env.NODE_ENV !== 'production') {
2036
2025
  }
2037
2026
  }
2038
2027
 
2039
- var suppressRefError = propCallInfo.suppressRefError,
2040
- refKey = propCallInfo.refKey,
2041
- elementRef = propCallInfo.elementRef;
2028
+ const {
2029
+ suppressRefError,
2030
+ refKey,
2031
+ elementRef
2032
+ } = propCallInfo;
2042
2033
 
2043
2034
  if ((!elementRef || !elementRef.current) && !suppressRefError) {
2044
2035
  // eslint-disable-next-line no-console
@@ -2047,11 +2038,11 @@ if (process.env.NODE_ENV !== 'production') {
2047
2038
  });
2048
2039
  isInitialMountRef.current = false;
2049
2040
  });
2050
- var setGetterPropCallInfo = react.useCallback(function (propKey, suppressRefError, refKey, elementRef) {
2041
+ const setGetterPropCallInfo = react.useCallback((propKey, suppressRefError, refKey, elementRef) => {
2051
2042
  getterPropsCalledRef.current[propKey] = {
2052
- suppressRefError: suppressRefError,
2053
- refKey: refKey,
2054
- elementRef: elementRef
2043
+ suppressRefError,
2044
+ refKey,
2045
+ elementRef
2055
2046
  };
2056
2047
  }, []);
2057
2048
  return setGetterPropCallInfo;
@@ -2059,39 +2050,41 @@ if (process.env.NODE_ENV !== 'production') {
2059
2050
  }
2060
2051
 
2061
2052
  function useA11yMessageSetter(getA11yMessage, dependencyArray, _ref2) {
2062
- var isInitialMount = _ref2.isInitialMount,
2063
- highlightedIndex = _ref2.highlightedIndex,
2064
- items = _ref2.items,
2065
- environment = _ref2.environment,
2066
- rest = _objectWithoutPropertiesLoose__default['default'](_ref2, _excluded$3);
2067
-
2053
+ let {
2054
+ isInitialMount,
2055
+ highlightedIndex,
2056
+ items,
2057
+ environment,
2058
+ ...rest
2059
+ } = _ref2;
2068
2060
  // Sets a11y status message on changes in state.
2069
- react.useEffect(function () {
2061
+ react.useEffect(() => {
2070
2062
  if (isInitialMount || true) {
2071
2063
  return;
2072
2064
  }
2073
2065
 
2074
- updateA11yStatus(function () {
2075
- return getA11yMessage(_extends__default['default']({
2076
- highlightedIndex: highlightedIndex,
2077
- highlightedItem: items[highlightedIndex],
2078
- resultCount: items.length
2079
- }, rest));
2080
- }, environment.document); // eslint-disable-next-line react-hooks/exhaustive-deps
2066
+ updateA11yStatus(() => getA11yMessage({
2067
+ highlightedIndex,
2068
+ highlightedItem: items[highlightedIndex],
2069
+ resultCount: items.length,
2070
+ ...rest
2071
+ }), environment.document); // eslint-disable-next-line react-hooks/exhaustive-deps
2081
2072
  }, dependencyArray);
2082
2073
  }
2083
2074
 
2084
2075
  function useScrollIntoView(_ref3) {
2085
- var highlightedIndex = _ref3.highlightedIndex,
2086
- isOpen = _ref3.isOpen,
2087
- itemRefs = _ref3.itemRefs,
2088
- getItemNodeFromIndex = _ref3.getItemNodeFromIndex,
2089
- menuElement = _ref3.menuElement,
2090
- scrollIntoViewProp = _ref3.scrollIntoView;
2076
+ let {
2077
+ highlightedIndex,
2078
+ isOpen,
2079
+ itemRefs,
2080
+ getItemNodeFromIndex,
2081
+ menuElement,
2082
+ scrollIntoView: scrollIntoViewProp
2083
+ } = _ref3;
2091
2084
  // used not to scroll on highlight by mouse.
2092
- var shouldScrollRef = react.useRef(true); // Scroll on highlighted item if change comes from keyboard.
2085
+ const shouldScrollRef = react.useRef(true); // Scroll on highlighted item if change comes from keyboard.
2093
2086
 
2094
- useIsomorphicLayoutEffect(function () {
2087
+ useIsomorphicLayoutEffect(() => {
2095
2088
  if (highlightedIndex < 0 || !isOpen || !Object.keys(itemRefs.current).length) {
2096
2089
  return;
2097
2090
  }
@@ -2107,17 +2100,19 @@ function useScrollIntoView(_ref3) {
2107
2100
  } // eslint-disable-next-line import/no-mutable-exports
2108
2101
 
2109
2102
 
2110
- var useControlPropsValidator = noop;
2103
+ let useControlPropsValidator = noop;
2111
2104
  /* istanbul ignore next */
2112
2105
 
2113
2106
  if (process.env.NODE_ENV !== 'production') {
2114
- useControlPropsValidator = function useControlPropsValidator(_ref4) {
2115
- var isInitialMount = _ref4.isInitialMount,
2116
- props = _ref4.props,
2117
- state = _ref4.state;
2107
+ useControlPropsValidator = _ref4 => {
2108
+ let {
2109
+ isInitialMount,
2110
+ props,
2111
+ state
2112
+ } = _ref4;
2118
2113
  // used for checking when props are moving from controlled to uncontrolled.
2119
- var prevPropsRef = react.useRef(props);
2120
- react.useEffect(function () {
2114
+ const prevPropsRef = react.useRef(props);
2115
+ react.useEffect(() => {
2121
2116
  if (isInitialMount) {
2122
2117
  return;
2123
2118
  }
@@ -2131,9 +2126,11 @@ if (process.env.NODE_ENV !== 'production') {
2131
2126
  /* eslint-disable complexity */
2132
2127
 
2133
2128
  function downshiftCommonReducer(state, action, stateChangeTypes) {
2134
- var type = action.type,
2135
- props = action.props;
2136
- var changes;
2129
+ const {
2130
+ type,
2131
+ props
2132
+ } = action;
2133
+ let changes;
2137
2134
 
2138
2135
  switch (type) {
2139
2136
  case stateChangeTypes.ItemMouseMove:
@@ -2194,7 +2191,9 @@ function downshiftCommonReducer(state, action, stateChangeTypes) {
2194
2191
  throw new Error('Reducer called without proper action type.');
2195
2192
  }
2196
2193
 
2197
- return _extends__default['default']({}, state, changes);
2194
+ return { ...state,
2195
+ ...changes
2196
+ };
2198
2197
  }
2199
2198
  /* eslint-enable complexity */
2200
2199
 
@@ -2217,37 +2216,37 @@ function getItemIndexByCharacterKey(_a) {
2217
2216
  return highlightedIndex;
2218
2217
  }
2219
2218
  var propTypes$2 = {
2220
- items: PropTypes__default['default'].array.isRequired,
2221
- itemToString: PropTypes__default['default'].func,
2222
- getA11yStatusMessage: PropTypes__default['default'].func,
2223
- getA11ySelectionMessage: PropTypes__default['default'].func,
2224
- circularNavigation: PropTypes__default['default'].bool,
2225
- highlightedIndex: PropTypes__default['default'].number,
2226
- defaultHighlightedIndex: PropTypes__default['default'].number,
2227
- initialHighlightedIndex: PropTypes__default['default'].number,
2228
- isOpen: PropTypes__default['default'].bool,
2229
- defaultIsOpen: PropTypes__default['default'].bool,
2230
- initialIsOpen: PropTypes__default['default'].bool,
2231
- selectedItem: PropTypes__default['default'].any,
2232
- initialSelectedItem: PropTypes__default['default'].any,
2233
- defaultSelectedItem: PropTypes__default['default'].any,
2234
- id: PropTypes__default['default'].string,
2235
- labelId: PropTypes__default['default'].string,
2236
- menuId: PropTypes__default['default'].string,
2237
- getItemId: PropTypes__default['default'].func,
2238
- toggleButtonId: PropTypes__default['default'].string,
2239
- stateReducer: PropTypes__default['default'].func,
2240
- onSelectedItemChange: PropTypes__default['default'].func,
2241
- onHighlightedIndexChange: PropTypes__default['default'].func,
2242
- onStateChange: PropTypes__default['default'].func,
2243
- onIsOpenChange: PropTypes__default['default'].func,
2244
- environment: PropTypes__default['default'].shape({
2245
- addEventListener: PropTypes__default['default'].func,
2246
- removeEventListener: PropTypes__default['default'].func,
2247
- document: PropTypes__default['default'].shape({
2248
- getElementById: PropTypes__default['default'].func,
2249
- activeElement: PropTypes__default['default'].any,
2250
- body: PropTypes__default['default'].any
2219
+ items: PropTypes__default["default"].array.isRequired,
2220
+ itemToString: PropTypes__default["default"].func,
2221
+ getA11yStatusMessage: PropTypes__default["default"].func,
2222
+ getA11ySelectionMessage: PropTypes__default["default"].func,
2223
+ circularNavigation: PropTypes__default["default"].bool,
2224
+ highlightedIndex: PropTypes__default["default"].number,
2225
+ defaultHighlightedIndex: PropTypes__default["default"].number,
2226
+ initialHighlightedIndex: PropTypes__default["default"].number,
2227
+ isOpen: PropTypes__default["default"].bool,
2228
+ defaultIsOpen: PropTypes__default["default"].bool,
2229
+ initialIsOpen: PropTypes__default["default"].bool,
2230
+ selectedItem: PropTypes__default["default"].any,
2231
+ initialSelectedItem: PropTypes__default["default"].any,
2232
+ defaultSelectedItem: PropTypes__default["default"].any,
2233
+ id: PropTypes__default["default"].string,
2234
+ labelId: PropTypes__default["default"].string,
2235
+ menuId: PropTypes__default["default"].string,
2236
+ getItemId: PropTypes__default["default"].func,
2237
+ toggleButtonId: PropTypes__default["default"].string,
2238
+ stateReducer: PropTypes__default["default"].func,
2239
+ onSelectedItemChange: PropTypes__default["default"].func,
2240
+ onHighlightedIndexChange: PropTypes__default["default"].func,
2241
+ onStateChange: PropTypes__default["default"].func,
2242
+ onIsOpenChange: PropTypes__default["default"].func,
2243
+ environment: PropTypes__default["default"].shape({
2244
+ addEventListener: PropTypes__default["default"].func,
2245
+ removeEventListener: PropTypes__default["default"].func,
2246
+ document: PropTypes__default["default"].shape({
2247
+ getElementById: PropTypes__default["default"].func,
2248
+ activeElement: PropTypes__default["default"].any,
2249
+ body: PropTypes__default["default"].any
2251
2250
  })
2252
2251
  })
2253
2252
  };
@@ -2268,7 +2267,7 @@ function getA11yStatusMessage(_a) {
2268
2267
  return 'No results are available.';
2269
2268
  }
2270
2269
  if (resultCount !== previousResultCount) {
2271
- return resultCount + " result" + (resultCount === 1 ? ' is' : 's are') + " available, use up and down arrow keys to navigate. Press Enter or Space Bar keys to select.";
2270
+ return "".concat(resultCount, " result").concat(resultCount === 1 ? ' is' : 's are', " available, use up and down arrow keys to navigate. Press Enter or Space Bar keys to select.");
2272
2271
  }
2273
2272
  return '';
2274
2273
  }
@@ -2278,33 +2277,33 @@ var validatePropTypes$2 = noop;
2278
2277
  /* istanbul ignore next */
2279
2278
  if (process.env.NODE_ENV !== 'production') {
2280
2279
  validatePropTypes$2 = function (options, caller) {
2281
- PropTypes__default['default'].checkPropTypes(propTypes$2, options, 'prop', caller.name);
2280
+ PropTypes__default["default"].checkPropTypes(propTypes$2, options, 'prop', caller.name);
2282
2281
  };
2283
2282
  }
2284
2283
 
2285
- var MenuKeyDownArrowDown = process.env.NODE_ENV !== "production" ? '__menu_keydown_arrow_down__' : 0;
2286
- var MenuKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__menu_keydown_arrow_up__' : 1;
2287
- var MenuKeyDownEscape = process.env.NODE_ENV !== "production" ? '__menu_keydown_escape__' : 2;
2288
- var MenuKeyDownHome = process.env.NODE_ENV !== "production" ? '__menu_keydown_home__' : 3;
2289
- var MenuKeyDownEnd = process.env.NODE_ENV !== "production" ? '__menu_keydown_end__' : 4;
2290
- var MenuKeyDownEnter = process.env.NODE_ENV !== "production" ? '__menu_keydown_enter__' : 5;
2291
- var MenuKeyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__menu_keydown_space_button__' : 6;
2292
- var MenuKeyDownCharacter = process.env.NODE_ENV !== "production" ? '__menu_keydown_character__' : 7;
2293
- var MenuBlur = process.env.NODE_ENV !== "production" ? '__menu_blur__' : 8;
2294
- var MenuMouseLeave$1 = process.env.NODE_ENV !== "production" ? '__menu_mouse_leave__' : 9;
2295
- var ItemMouseMove$1 = process.env.NODE_ENV !== "production" ? '__item_mouse_move__' : 10;
2296
- var ItemClick$1 = process.env.NODE_ENV !== "production" ? '__item_click__' : 11;
2297
- var ToggleButtonClick$1 = process.env.NODE_ENV !== "production" ? '__togglebutton_click__' : 12;
2298
- var ToggleButtonKeyDownArrowDown = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_arrow_down__' : 13;
2299
- var ToggleButtonKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_arrow_up__' : 14;
2300
- var ToggleButtonKeyDownCharacter = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_character__' : 15;
2301
- var FunctionToggleMenu$1 = process.env.NODE_ENV !== "production" ? '__function_toggle_menu__' : 16;
2302
- var FunctionOpenMenu$1 = process.env.NODE_ENV !== "production" ? '__function_open_menu__' : 17;
2303
- var FunctionCloseMenu$1 = process.env.NODE_ENV !== "production" ? '__function_close_menu__' : 18;
2304
- var FunctionSetHighlightedIndex$1 = process.env.NODE_ENV !== "production" ? '__function_set_highlighted_index__' : 19;
2305
- var FunctionSelectItem$1 = process.env.NODE_ENV !== "production" ? '__function_select_item__' : 20;
2306
- var FunctionSetInputValue$1 = process.env.NODE_ENV !== "production" ? '__function_set_input_value__' : 21;
2307
- var FunctionReset$2 = process.env.NODE_ENV !== "production" ? '__function_reset__' : 22;
2284
+ const MenuKeyDownArrowDown = process.env.NODE_ENV !== "production" ? '__menu_keydown_arrow_down__' : 0;
2285
+ const MenuKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__menu_keydown_arrow_up__' : 1;
2286
+ const MenuKeyDownEscape = process.env.NODE_ENV !== "production" ? '__menu_keydown_escape__' : 2;
2287
+ const MenuKeyDownHome = process.env.NODE_ENV !== "production" ? '__menu_keydown_home__' : 3;
2288
+ const MenuKeyDownEnd = process.env.NODE_ENV !== "production" ? '__menu_keydown_end__' : 4;
2289
+ const MenuKeyDownEnter = process.env.NODE_ENV !== "production" ? '__menu_keydown_enter__' : 5;
2290
+ const MenuKeyDownSpaceButton = process.env.NODE_ENV !== "production" ? '__menu_keydown_space_button__' : 6;
2291
+ const MenuKeyDownCharacter = process.env.NODE_ENV !== "production" ? '__menu_keydown_character__' : 7;
2292
+ const MenuBlur = process.env.NODE_ENV !== "production" ? '__menu_blur__' : 8;
2293
+ const MenuMouseLeave$1 = process.env.NODE_ENV !== "production" ? '__menu_mouse_leave__' : 9;
2294
+ const ItemMouseMove$1 = process.env.NODE_ENV !== "production" ? '__item_mouse_move__' : 10;
2295
+ const ItemClick$1 = process.env.NODE_ENV !== "production" ? '__item_click__' : 11;
2296
+ const ToggleButtonClick$1 = process.env.NODE_ENV !== "production" ? '__togglebutton_click__' : 12;
2297
+ const ToggleButtonKeyDownArrowDown = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_arrow_down__' : 13;
2298
+ const ToggleButtonKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_arrow_up__' : 14;
2299
+ const ToggleButtonKeyDownCharacter = process.env.NODE_ENV !== "production" ? '__togglebutton_keydown_character__' : 15;
2300
+ const FunctionToggleMenu$1 = process.env.NODE_ENV !== "production" ? '__function_toggle_menu__' : 16;
2301
+ const FunctionOpenMenu$1 = process.env.NODE_ENV !== "production" ? '__function_open_menu__' : 17;
2302
+ const FunctionCloseMenu$1 = process.env.NODE_ENV !== "production" ? '__function_close_menu__' : 18;
2303
+ const FunctionSetHighlightedIndex$1 = process.env.NODE_ENV !== "production" ? '__function_set_highlighted_index__' : 19;
2304
+ const FunctionSelectItem$1 = process.env.NODE_ENV !== "production" ? '__function_select_item__' : 20;
2305
+ const FunctionSetInputValue$1 = process.env.NODE_ENV !== "production" ? '__function_set_input_value__' : 21;
2306
+ const FunctionReset$2 = process.env.NODE_ENV !== "production" ? '__function_reset__' : 22;
2308
2307
 
2309
2308
  var stateChangeTypes$2 = /*#__PURE__*/Object.freeze({
2310
2309
  __proto__: null,
@@ -2336,10 +2335,12 @@ var stateChangeTypes$2 = /*#__PURE__*/Object.freeze({
2336
2335
  /* eslint-disable complexity */
2337
2336
 
2338
2337
  function downshiftSelectReducer(state, action) {
2339
- var type = action.type,
2340
- props = action.props,
2341
- shiftKey = action.shiftKey;
2342
- var changes;
2338
+ const {
2339
+ type,
2340
+ props,
2341
+ shiftKey
2342
+ } = action;
2343
+ let changes;
2343
2344
 
2344
2345
  switch (type) {
2345
2346
  case ItemClick$1:
@@ -2352,20 +2353,21 @@ function downshiftSelectReducer(state, action) {
2352
2353
 
2353
2354
  case ToggleButtonKeyDownCharacter:
2354
2355
  {
2355
- var lowercasedKey = action.key;
2356
- var inputValue = "" + state.inputValue + lowercasedKey;
2357
- var itemIndex = getItemIndexByCharacterKey({
2356
+ const lowercasedKey = action.key;
2357
+ const inputValue = "" + state.inputValue + lowercasedKey;
2358
+ const itemIndex = getItemIndexByCharacterKey({
2358
2359
  keysSoFar: inputValue,
2359
2360
  highlightedIndex: state.selectedItem ? props.items.indexOf(state.selectedItem) : -1,
2360
2361
  items: props.items,
2361
2362
  itemToString: props.itemToString,
2362
2363
  getItemNodeFromIndex: action.getItemNodeFromIndex
2363
2364
  });
2364
- changes = _extends__default['default']({
2365
- inputValue: inputValue
2366
- }, itemIndex >= 0 && {
2367
- selectedItem: props.items[itemIndex]
2368
- });
2365
+ changes = {
2366
+ inputValue,
2367
+ ...(itemIndex >= 0 && {
2368
+ selectedItem: props.items[itemIndex]
2369
+ })
2370
+ };
2369
2371
  }
2370
2372
  break;
2371
2373
 
@@ -2385,12 +2387,13 @@ function downshiftSelectReducer(state, action) {
2385
2387
 
2386
2388
  case MenuKeyDownEnter:
2387
2389
  case MenuKeyDownSpaceButton:
2388
- changes = _extends__default['default']({
2390
+ changes = {
2389
2391
  isOpen: getDefaultValue$1(props, 'isOpen'),
2390
- highlightedIndex: getDefaultValue$1(props, 'highlightedIndex')
2391
- }, state.highlightedIndex >= 0 && {
2392
- selectedItem: props.items[state.highlightedIndex]
2393
- });
2392
+ highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'),
2393
+ ...(state.highlightedIndex >= 0 && {
2394
+ selectedItem: props.items[state.highlightedIndex]
2395
+ })
2396
+ };
2394
2397
  break;
2395
2398
 
2396
2399
  case MenuKeyDownHome:
@@ -2421,22 +2424,21 @@ function downshiftSelectReducer(state, action) {
2421
2424
 
2422
2425
  case MenuKeyDownCharacter:
2423
2426
  {
2424
- var _lowercasedKey = action.key;
2425
-
2426
- var _inputValue = "" + state.inputValue + _lowercasedKey;
2427
-
2428
- var highlightedIndex = getItemIndexByCharacterKey({
2429
- keysSoFar: _inputValue,
2427
+ const lowercasedKey = action.key;
2428
+ const inputValue = "" + state.inputValue + lowercasedKey;
2429
+ const highlightedIndex = getItemIndexByCharacterKey({
2430
+ keysSoFar: inputValue,
2430
2431
  highlightedIndex: state.highlightedIndex,
2431
2432
  items: props.items,
2432
2433
  itemToString: props.itemToString,
2433
2434
  getItemNodeFromIndex: action.getItemNodeFromIndex
2434
2435
  });
2435
- changes = _extends__default['default']({
2436
- inputValue: _inputValue
2437
- }, highlightedIndex >= 0 && {
2438
- highlightedIndex: highlightedIndex
2439
- });
2436
+ changes = {
2437
+ inputValue,
2438
+ ...(highlightedIndex >= 0 && {
2439
+ highlightedIndex
2440
+ })
2441
+ };
2440
2442
  }
2441
2443
  break;
2442
2444
 
@@ -2462,13 +2464,13 @@ function downshiftSelectReducer(state, action) {
2462
2464
  return downshiftCommonReducer(state, action, stateChangeTypes$2);
2463
2465
  }
2464
2466
 
2465
- return _extends__default['default']({}, state, changes);
2467
+ return { ...state,
2468
+ ...changes
2469
+ };
2466
2470
  }
2467
2471
  /* eslint-enable complexity */
2468
2472
 
2469
- var _excluded$2 = ["onMouseLeave", "refKey", "onKeyDown", "onBlur", "ref"],
2470
- _excluded2$2 = ["onClick", "onKeyDown", "refKey", "ref"],
2471
- _excluded3$1 = ["item", "index", "onMouseMove", "onClick", "refKey", "ref"];
2473
+ /* eslint-disable max-statements */
2472
2474
  useSelect.stateChangeTypes = stateChangeTypes$2;
2473
2475
 
2474
2476
  function useSelect(userProps) {
@@ -2478,91 +2480,92 @@ function useSelect(userProps) {
2478
2480
 
2479
2481
  validatePropTypes$2(userProps, useSelect); // Props defaults and destructuring.
2480
2482
 
2481
- var props = _extends__default['default']({}, defaultProps$2, userProps);
2482
-
2483
- var items = props.items,
2484
- scrollIntoView = props.scrollIntoView,
2485
- environment = props.environment,
2486
- initialIsOpen = props.initialIsOpen,
2487
- defaultIsOpen = props.defaultIsOpen,
2488
- itemToString = props.itemToString,
2489
- getA11ySelectionMessage = props.getA11ySelectionMessage,
2490
- getA11yStatusMessage = props.getA11yStatusMessage; // Initial state depending on controlled props.
2491
-
2492
- var initialState = getInitialState$2(props);
2493
-
2494
- var _useControlledReducer = useControlledReducer$1(downshiftSelectReducer, initialState, props),
2495
- state = _useControlledReducer[0],
2496
- dispatch = _useControlledReducer[1];
2497
-
2498
- var isOpen = state.isOpen,
2499
- highlightedIndex = state.highlightedIndex,
2500
- selectedItem = state.selectedItem,
2501
- inputValue = state.inputValue; // Element efs.
2502
-
2503
- var toggleButtonRef = react.useRef(null);
2504
- var menuRef = react.useRef(null);
2505
- var itemRefs = react.useRef({}); // used not to trigger menu blur action in some scenarios.
2506
-
2507
- var shouldBlurRef = react.useRef(true); // used to keep the inputValue clearTimeout object between renders.
2508
-
2509
- var clearTimeoutRef = react.useRef(null); // prevent id re-generation between renders.
2510
-
2511
- var elementIds = useElementIds(props); // used to keep track of how many items we had on previous cycle.
2512
-
2513
- var previousResultCountRef = react.useRef();
2514
- var isInitialMountRef = react.useRef(true); // utility callback to get item element.
2515
-
2516
- var latest = useLatestRef({
2517
- state: state,
2518
- props: props
2483
+ const props = { ...defaultProps$2,
2484
+ ...userProps
2485
+ };
2486
+ const {
2487
+ items,
2488
+ scrollIntoView,
2489
+ environment,
2490
+ initialIsOpen,
2491
+ defaultIsOpen,
2492
+ itemToString,
2493
+ getA11ySelectionMessage,
2494
+ getA11yStatusMessage
2495
+ } = props; // Initial state depending on controlled props.
2496
+
2497
+ const initialState = getInitialState$2(props);
2498
+ const [state, dispatch] = useControlledReducer$1(downshiftSelectReducer, initialState, props);
2499
+ const {
2500
+ isOpen,
2501
+ highlightedIndex,
2502
+ selectedItem,
2503
+ inputValue
2504
+ } = state; // Element efs.
2505
+
2506
+ const toggleButtonRef = react.useRef(null);
2507
+ const menuRef = react.useRef(null);
2508
+ const itemRefs = react.useRef({}); // used not to trigger menu blur action in some scenarios.
2509
+
2510
+ const shouldBlurRef = react.useRef(true); // used to keep the inputValue clearTimeout object between renders.
2511
+
2512
+ const clearTimeoutRef = react.useRef(null); // prevent id re-generation between renders.
2513
+
2514
+ const elementIds = useElementIds(props); // used to keep track of how many items we had on previous cycle.
2515
+
2516
+ const previousResultCountRef = react.useRef();
2517
+ const isInitialMountRef = react.useRef(true); // utility callback to get item element.
2518
+
2519
+ const latest = useLatestRef({
2520
+ state,
2521
+ props
2519
2522
  }); // Some utils.
2520
2523
 
2521
- var getItemNodeFromIndex = react.useCallback(function (index) {
2522
- return itemRefs.current[elementIds.getItemId(index)];
2523
- }, [elementIds]); // Effects.
2524
+ const getItemNodeFromIndex = react.useCallback(index => itemRefs.current[elementIds.getItemId(index)], [elementIds]); // Effects.
2524
2525
  // Sets a11y status message on changes in state.
2525
2526
 
2526
- useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], _extends__default['default']({
2527
+ useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], {
2527
2528
  isInitialMount: isInitialMountRef.current,
2528
2529
  previousResultCount: previousResultCountRef.current,
2529
- items: items,
2530
- environment: environment,
2531
- itemToString: itemToString
2532
- }, state)); // Sets a11y status message on changes in selectedItem.
2530
+ items,
2531
+ environment,
2532
+ itemToString,
2533
+ ...state
2534
+ }); // Sets a11y status message on changes in selectedItem.
2533
2535
 
2534
- useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], _extends__default['default']({
2536
+ useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], {
2535
2537
  isInitialMount: isInitialMountRef.current,
2536
2538
  previousResultCount: previousResultCountRef.current,
2537
- items: items,
2538
- environment: environment,
2539
- itemToString: itemToString
2540
- }, state)); // Scroll on highlighted item if change comes from keyboard.
2539
+ items,
2540
+ environment,
2541
+ itemToString,
2542
+ ...state
2543
+ }); // Scroll on highlighted item if change comes from keyboard.
2541
2544
 
2542
- var shouldScrollRef = useScrollIntoView({
2545
+ const shouldScrollRef = useScrollIntoView({
2543
2546
  menuElement: menuRef.current,
2544
- highlightedIndex: highlightedIndex,
2545
- isOpen: isOpen,
2546
- itemRefs: itemRefs,
2547
- scrollIntoView: scrollIntoView,
2548
- getItemNodeFromIndex: getItemNodeFromIndex
2547
+ highlightedIndex,
2548
+ isOpen,
2549
+ itemRefs,
2550
+ scrollIntoView,
2551
+ getItemNodeFromIndex
2549
2552
  }); // Sets cleanup for the keysSoFar callback, debounded after 500ms.
2550
2553
 
2551
- react.useEffect(function () {
2554
+ react.useEffect(() => {
2552
2555
  // init the clean function here as we need access to dispatch.
2553
- clearTimeoutRef.current = debounce(function (outerDispatch) {
2556
+ clearTimeoutRef.current = debounce(outerDispatch => {
2554
2557
  outerDispatch({
2555
2558
  type: FunctionSetInputValue$1,
2556
2559
  inputValue: ''
2557
2560
  });
2558
2561
  }, 500); // Cancel any pending debounced calls on mount
2559
2562
 
2560
- return function () {
2563
+ return () => {
2561
2564
  clearTimeoutRef.current.cancel();
2562
2565
  };
2563
2566
  }, []); // Invokes the keysSoFar callback set up above.
2564
2567
 
2565
- react.useEffect(function () {
2568
+ react.useEffect(() => {
2566
2569
  if (!inputValue) {
2567
2570
  return;
2568
2571
  }
@@ -2571,12 +2574,12 @@ function useSelect(userProps) {
2571
2574
  }, [dispatch, inputValue]);
2572
2575
  useControlPropsValidator({
2573
2576
  isInitialMount: isInitialMountRef.current,
2574
- props: props,
2575
- state: state
2577
+ props,
2578
+ state
2576
2579
  });
2577
2580
  /* Controls the focus on the menu or the toggle button. */
2578
2581
 
2579
- react.useEffect(function () {
2582
+ react.useEffect(() => {
2580
2583
  // Don't focus menu on first render.
2581
2584
  if (isInitialMountRef.current) {
2582
2585
  // Unless it was initialised as open.
@@ -2607,7 +2610,7 @@ function useSelect(userProps) {
2607
2610
  } // eslint-disable-next-line react-hooks/exhaustive-deps
2608
2611
 
2609
2612
  }, [isOpen]);
2610
- react.useEffect(function () {
2613
+ react.useEffect(() => {
2611
2614
  if (isInitialMountRef.current) {
2612
2615
  return;
2613
2616
  }
@@ -2615,180 +2618,180 @@ function useSelect(userProps) {
2615
2618
  previousResultCountRef.current = items.length;
2616
2619
  }); // Add mouse/touch events to document.
2617
2620
 
2618
- var mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [menuRef, toggleButtonRef], environment, function () {
2621
+ const mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [menuRef, toggleButtonRef], environment, () => {
2619
2622
  dispatch({
2620
2623
  type: MenuBlur
2621
2624
  });
2622
2625
  });
2623
- var setGetterPropCallInfo = useGetterPropsCalledChecker('getMenuProps', 'getToggleButtonProps'); // Make initial ref false.
2626
+ const setGetterPropCallInfo = useGetterPropsCalledChecker('getMenuProps', 'getToggleButtonProps'); // Make initial ref false.
2624
2627
 
2625
- react.useEffect(function () {
2628
+ react.useEffect(() => {
2626
2629
  isInitialMountRef.current = false;
2627
2630
  }, []); // Reset itemRefs on close.
2628
2631
 
2629
- react.useEffect(function () {
2632
+ react.useEffect(() => {
2630
2633
  if (!isOpen) {
2631
2634
  itemRefs.current = {};
2632
2635
  }
2633
2636
  }, [isOpen]); // Event handler functions.
2634
2637
 
2635
- var toggleButtonKeyDownHandlers = react.useMemo(function () {
2636
- return {
2637
- ArrowDown: function ArrowDown(event) {
2638
- event.preventDefault();
2639
- dispatch({
2640
- type: ToggleButtonKeyDownArrowDown,
2641
- getItemNodeFromIndex: getItemNodeFromIndex,
2642
- shiftKey: event.shiftKey
2643
- });
2644
- },
2645
- ArrowUp: function ArrowUp(event) {
2646
- event.preventDefault();
2647
- dispatch({
2648
- type: ToggleButtonKeyDownArrowUp,
2649
- getItemNodeFromIndex: getItemNodeFromIndex,
2650
- shiftKey: event.shiftKey
2651
- });
2652
- }
2653
- };
2654
- }, [dispatch, getItemNodeFromIndex]);
2655
- var menuKeyDownHandlers = react.useMemo(function () {
2656
- return {
2657
- ArrowDown: function ArrowDown(event) {
2658
- event.preventDefault();
2659
- dispatch({
2660
- type: MenuKeyDownArrowDown,
2661
- getItemNodeFromIndex: getItemNodeFromIndex,
2662
- shiftKey: event.shiftKey
2663
- });
2664
- },
2665
- ArrowUp: function ArrowUp(event) {
2666
- event.preventDefault();
2667
- dispatch({
2668
- type: MenuKeyDownArrowUp,
2669
- getItemNodeFromIndex: getItemNodeFromIndex,
2670
- shiftKey: event.shiftKey
2671
- });
2672
- },
2673
- Home: function Home(event) {
2674
- event.preventDefault();
2675
- dispatch({
2676
- type: MenuKeyDownHome,
2677
- getItemNodeFromIndex: getItemNodeFromIndex
2678
- });
2679
- },
2680
- End: function End(event) {
2681
- event.preventDefault();
2682
- dispatch({
2683
- type: MenuKeyDownEnd,
2684
- getItemNodeFromIndex: getItemNodeFromIndex
2685
- });
2686
- },
2687
- Escape: function Escape() {
2688
- dispatch({
2689
- type: MenuKeyDownEscape
2690
- });
2691
- },
2692
- Enter: function Enter(event) {
2693
- event.preventDefault();
2694
- dispatch({
2695
- type: MenuKeyDownEnter
2696
- });
2697
- },
2698
- ' ': function _(event) {
2699
- event.preventDefault();
2700
- dispatch({
2701
- type: MenuKeyDownSpaceButton
2702
- });
2703
- }
2704
- };
2705
- }, [dispatch, getItemNodeFromIndex]); // Action functions.
2638
+ const toggleButtonKeyDownHandlers = react.useMemo(() => ({
2639
+ ArrowDown(event) {
2640
+ event.preventDefault();
2641
+ dispatch({
2642
+ type: ToggleButtonKeyDownArrowDown,
2643
+ getItemNodeFromIndex,
2644
+ shiftKey: event.shiftKey
2645
+ });
2646
+ },
2706
2647
 
2707
- var toggleMenu = react.useCallback(function () {
2648
+ ArrowUp(event) {
2649
+ event.preventDefault();
2650
+ dispatch({
2651
+ type: ToggleButtonKeyDownArrowUp,
2652
+ getItemNodeFromIndex,
2653
+ shiftKey: event.shiftKey
2654
+ });
2655
+ }
2656
+
2657
+ }), [dispatch, getItemNodeFromIndex]);
2658
+ const menuKeyDownHandlers = react.useMemo(() => ({
2659
+ ArrowDown(event) {
2660
+ event.preventDefault();
2661
+ dispatch({
2662
+ type: MenuKeyDownArrowDown,
2663
+ getItemNodeFromIndex,
2664
+ shiftKey: event.shiftKey
2665
+ });
2666
+ },
2667
+
2668
+ ArrowUp(event) {
2669
+ event.preventDefault();
2670
+ dispatch({
2671
+ type: MenuKeyDownArrowUp,
2672
+ getItemNodeFromIndex,
2673
+ shiftKey: event.shiftKey
2674
+ });
2675
+ },
2676
+
2677
+ Home(event) {
2678
+ event.preventDefault();
2679
+ dispatch({
2680
+ type: MenuKeyDownHome,
2681
+ getItemNodeFromIndex
2682
+ });
2683
+ },
2684
+
2685
+ End(event) {
2686
+ event.preventDefault();
2687
+ dispatch({
2688
+ type: MenuKeyDownEnd,
2689
+ getItemNodeFromIndex
2690
+ });
2691
+ },
2692
+
2693
+ Escape() {
2694
+ dispatch({
2695
+ type: MenuKeyDownEscape
2696
+ });
2697
+ },
2698
+
2699
+ Enter(event) {
2700
+ event.preventDefault();
2701
+ dispatch({
2702
+ type: MenuKeyDownEnter
2703
+ });
2704
+ },
2705
+
2706
+ ' '(event) {
2707
+ event.preventDefault();
2708
+ dispatch({
2709
+ type: MenuKeyDownSpaceButton
2710
+ });
2711
+ }
2712
+
2713
+ }), [dispatch, getItemNodeFromIndex]); // Action functions.
2714
+
2715
+ const toggleMenu = react.useCallback(() => {
2708
2716
  dispatch({
2709
2717
  type: FunctionToggleMenu$1
2710
2718
  });
2711
2719
  }, [dispatch]);
2712
- var closeMenu = react.useCallback(function () {
2720
+ const closeMenu = react.useCallback(() => {
2713
2721
  dispatch({
2714
2722
  type: FunctionCloseMenu$1
2715
2723
  });
2716
2724
  }, [dispatch]);
2717
- var openMenu = react.useCallback(function () {
2725
+ const openMenu = react.useCallback(() => {
2718
2726
  dispatch({
2719
2727
  type: FunctionOpenMenu$1
2720
2728
  });
2721
2729
  }, [dispatch]);
2722
- var setHighlightedIndex = react.useCallback(function (newHighlightedIndex) {
2730
+ const setHighlightedIndex = react.useCallback(newHighlightedIndex => {
2723
2731
  dispatch({
2724
2732
  type: FunctionSetHighlightedIndex$1,
2725
2733
  highlightedIndex: newHighlightedIndex
2726
2734
  });
2727
2735
  }, [dispatch]);
2728
- var selectItem = react.useCallback(function (newSelectedItem) {
2736
+ const selectItem = react.useCallback(newSelectedItem => {
2729
2737
  dispatch({
2730
2738
  type: FunctionSelectItem$1,
2731
2739
  selectedItem: newSelectedItem
2732
2740
  });
2733
2741
  }, [dispatch]);
2734
- var reset = react.useCallback(function () {
2742
+ const reset = react.useCallback(() => {
2735
2743
  dispatch({
2736
2744
  type: FunctionReset$2
2737
2745
  });
2738
2746
  }, [dispatch]);
2739
- var setInputValue = react.useCallback(function (newInputValue) {
2747
+ const setInputValue = react.useCallback(newInputValue => {
2740
2748
  dispatch({
2741
2749
  type: FunctionSetInputValue$1,
2742
2750
  inputValue: newInputValue
2743
2751
  });
2744
2752
  }, [dispatch]); // Getter functions.
2745
2753
 
2746
- var getLabelProps = react.useCallback(function (labelProps) {
2747
- return _extends__default['default']({
2748
- id: elementIds.labelId,
2749
- htmlFor: elementIds.toggleButtonId
2750
- }, labelProps);
2751
- }, [elementIds]);
2752
- var getMenuProps = react.useCallback(function (_temp, _temp2) {
2753
- var _extends2;
2754
-
2755
- var _ref = _temp === void 0 ? {} : _temp,
2756
- onMouseLeave = _ref.onMouseLeave,
2757
- _ref$refKey = _ref.refKey,
2758
- refKey = _ref$refKey === void 0 ? 'ref' : _ref$refKey,
2759
- onKeyDown = _ref.onKeyDown,
2760
- onBlur = _ref.onBlur,
2761
- ref = _ref.ref,
2762
- rest = _objectWithoutPropertiesLoose__default['default'](_ref, _excluded$2);
2763
-
2764
- var _ref2 = _temp2 === void 0 ? {} : _temp2,
2765
- _ref2$suppressRefErro = _ref2.suppressRefError,
2766
- suppressRefError = _ref2$suppressRefErro === void 0 ? false : _ref2$suppressRefErro;
2767
-
2768
- var latestState = latest.current.state;
2769
-
2770
- var menuHandleKeyDown = function menuHandleKeyDown(event) {
2771
- var key = normalizeArrowKey(event);
2754
+ const getLabelProps = react.useCallback(labelProps => ({
2755
+ id: elementIds.labelId,
2756
+ htmlFor: elementIds.toggleButtonId,
2757
+ ...labelProps
2758
+ }), [elementIds]);
2759
+ const getMenuProps = react.useCallback(function (_temp, _temp2) {
2760
+ let {
2761
+ onMouseLeave,
2762
+ refKey = 'ref',
2763
+ onKeyDown,
2764
+ onBlur,
2765
+ ref,
2766
+ ...rest
2767
+ } = _temp === void 0 ? {} : _temp;
2768
+ let {
2769
+ suppressRefError = false
2770
+ } = _temp2 === void 0 ? {} : _temp2;
2771
+ const latestState = latest.current.state;
2772
+
2773
+ const menuHandleKeyDown = event => {
2774
+ const key = normalizeArrowKey(event);
2772
2775
 
2773
2776
  if (key && menuKeyDownHandlers[key]) {
2774
2777
  menuKeyDownHandlers[key](event);
2775
2778
  } else if (isAcceptedCharacterKey(key)) {
2776
2779
  dispatch({
2777
2780
  type: MenuKeyDownCharacter,
2778
- key: key,
2779
- getItemNodeFromIndex: getItemNodeFromIndex
2781
+ key,
2782
+ getItemNodeFromIndex
2780
2783
  });
2781
2784
  }
2782
2785
  };
2783
2786
 
2784
- var menuHandleBlur = function menuHandleBlur() {
2787
+ const menuHandleBlur = () => {
2785
2788
  // if the blur was a result of selection, we don't trigger this action.
2786
2789
  if (shouldBlurRef.current === false) {
2787
2790
  shouldBlurRef.current = true;
2788
2791
  return;
2789
2792
  }
2790
2793
 
2791
- var shouldBlur = !mouseAndTouchTrackersRef.current.isMouseDown;
2794
+ const shouldBlur = !mouseAndTouchTrackersRef.current.isMouseDown;
2792
2795
  /* istanbul ignore else */
2793
2796
 
2794
2797
  if (shouldBlur) {
@@ -2798,61 +2801,72 @@ function useSelect(userProps) {
2798
2801
  }
2799
2802
  };
2800
2803
 
2801
- var menuHandleMouseLeave = function menuHandleMouseLeave() {
2804
+ const menuHandleMouseLeave = () => {
2802
2805
  dispatch({
2803
2806
  type: MenuMouseLeave$1
2804
2807
  });
2805
2808
  };
2806
2809
 
2807
2810
  setGetterPropCallInfo('getMenuProps', suppressRefError, refKey, menuRef);
2808
- return _extends__default['default']((_extends2 = {}, _extends2[refKey] = handleRefs(ref, function (menuNode) {
2809
- menuRef.current = menuNode;
2810
- }), _extends2.id = elementIds.menuId, _extends2.role = 'listbox', _extends2['aria-labelledby'] = elementIds.labelId, _extends2.tabIndex = -1, _extends2), latestState.isOpen && latestState.highlightedIndex > -1 && {
2811
- 'aria-activedescendant': elementIds.getItemId(latestState.highlightedIndex)
2812
- }, {
2811
+ return {
2812
+ [refKey]: handleRefs(ref, menuNode => {
2813
+ menuRef.current = menuNode;
2814
+ }),
2815
+ id: elementIds.menuId,
2816
+ role: 'listbox',
2817
+ 'aria-labelledby': elementIds.labelId,
2818
+ tabIndex: -1,
2819
+ ...(latestState.isOpen && latestState.highlightedIndex > -1 && {
2820
+ 'aria-activedescendant': elementIds.getItemId(latestState.highlightedIndex)
2821
+ }),
2813
2822
  onMouseLeave: callAllEventHandlers(onMouseLeave, menuHandleMouseLeave),
2814
2823
  onKeyDown: callAllEventHandlers(onKeyDown, menuHandleKeyDown),
2815
- onBlur: callAllEventHandlers(onBlur, menuHandleBlur)
2816
- }, rest);
2824
+ onBlur: callAllEventHandlers(onBlur, menuHandleBlur),
2825
+ ...rest
2826
+ };
2817
2827
  }, [dispatch, latest, menuKeyDownHandlers, mouseAndTouchTrackersRef, setGetterPropCallInfo, elementIds, getItemNodeFromIndex]);
2818
- var getToggleButtonProps = react.useCallback(function (_temp3, _temp4) {
2819
- var _extends3;
2820
-
2821
- var _ref3 = _temp3 === void 0 ? {} : _temp3,
2822
- onClick = _ref3.onClick,
2823
- onKeyDown = _ref3.onKeyDown,
2824
- _ref3$refKey = _ref3.refKey,
2825
- refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey,
2826
- ref = _ref3.ref,
2827
- rest = _objectWithoutPropertiesLoose__default['default'](_ref3, _excluded2$2);
2828
-
2829
- var _ref4 = _temp4 === void 0 ? {} : _temp4,
2830
- _ref4$suppressRefErro = _ref4.suppressRefError,
2831
- suppressRefError = _ref4$suppressRefErro === void 0 ? false : _ref4$suppressRefErro;
2832
-
2833
- var toggleButtonHandleClick = function toggleButtonHandleClick() {
2828
+ const getToggleButtonProps = react.useCallback(function (_temp3, _temp4) {
2829
+ let {
2830
+ onClick,
2831
+ onKeyDown,
2832
+ refKey = 'ref',
2833
+ ref,
2834
+ ...rest
2835
+ } = _temp3 === void 0 ? {} : _temp3;
2836
+ let {
2837
+ suppressRefError = false
2838
+ } = _temp4 === void 0 ? {} : _temp4;
2839
+
2840
+ const toggleButtonHandleClick = () => {
2834
2841
  dispatch({
2835
2842
  type: ToggleButtonClick$1
2836
2843
  });
2837
2844
  };
2838
2845
 
2839
- var toggleButtonHandleKeyDown = function toggleButtonHandleKeyDown(event) {
2840
- var key = normalizeArrowKey(event);
2846
+ const toggleButtonHandleKeyDown = event => {
2847
+ const key = normalizeArrowKey(event);
2841
2848
 
2842
2849
  if (key && toggleButtonKeyDownHandlers[key]) {
2843
2850
  toggleButtonKeyDownHandlers[key](event);
2844
2851
  } else if (isAcceptedCharacterKey(key)) {
2845
2852
  dispatch({
2846
2853
  type: ToggleButtonKeyDownCharacter,
2847
- key: key,
2848
- getItemNodeFromIndex: getItemNodeFromIndex
2854
+ key,
2855
+ getItemNodeFromIndex
2849
2856
  });
2850
2857
  }
2851
2858
  };
2852
2859
 
2853
- var toggleProps = _extends__default['default']((_extends3 = {}, _extends3[refKey] = handleRefs(ref, function (toggleButtonNode) {
2854
- toggleButtonRef.current = toggleButtonNode;
2855
- }), _extends3.id = elementIds.toggleButtonId, _extends3['aria-haspopup'] = 'listbox', _extends3['aria-expanded'] = latest.current.state.isOpen, _extends3['aria-labelledby'] = elementIds.labelId + " " + elementIds.toggleButtonId, _extends3), rest);
2860
+ const toggleProps = {
2861
+ [refKey]: handleRefs(ref, toggleButtonNode => {
2862
+ toggleButtonRef.current = toggleButtonNode;
2863
+ }),
2864
+ id: elementIds.toggleButtonId,
2865
+ 'aria-haspopup': 'listbox',
2866
+ 'aria-expanded': latest.current.state.isOpen,
2867
+ 'aria-labelledby': elementIds.labelId + " " + elementIds.toggleButtonId,
2868
+ ...rest
2869
+ };
2856
2870
 
2857
2871
  if (!rest.disabled) {
2858
2872
  toggleProps.onClick = callAllEventHandlers(onClick, toggleButtonHandleClick);
@@ -2862,24 +2876,22 @@ function useSelect(userProps) {
2862
2876
  setGetterPropCallInfo('getToggleButtonProps', suppressRefError, refKey, toggleButtonRef);
2863
2877
  return toggleProps;
2864
2878
  }, [dispatch, latest, toggleButtonKeyDownHandlers, setGetterPropCallInfo, elementIds, getItemNodeFromIndex]);
2865
- var getItemProps = react.useCallback(function (_temp5) {
2866
- var _extends4;
2867
-
2868
- var _ref5 = _temp5 === void 0 ? {} : _temp5,
2869
- item = _ref5.item,
2870
- index = _ref5.index,
2871
- onMouseMove = _ref5.onMouseMove,
2872
- onClick = _ref5.onClick,
2873
- _ref5$refKey = _ref5.refKey,
2874
- refKey = _ref5$refKey === void 0 ? 'ref' : _ref5$refKey,
2875
- ref = _ref5.ref,
2876
- rest = _objectWithoutPropertiesLoose__default['default'](_ref5, _excluded3$1);
2877
-
2878
- var _latest$current = latest.current,
2879
- latestState = _latest$current.state,
2880
- latestProps = _latest$current.props;
2881
-
2882
- var itemHandleMouseMove = function itemHandleMouseMove() {
2879
+ const getItemProps = react.useCallback(function (_temp5) {
2880
+ let {
2881
+ item,
2882
+ index,
2883
+ onMouseMove,
2884
+ onClick,
2885
+ refKey = 'ref',
2886
+ ref,
2887
+ ...rest
2888
+ } = _temp5 === void 0 ? {} : _temp5;
2889
+ const {
2890
+ state: latestState,
2891
+ props: latestProps
2892
+ } = latest.current;
2893
+
2894
+ const itemHandleMouseMove = () => {
2883
2895
  if (index === latestState.highlightedIndex) {
2884
2896
  return;
2885
2897
  }
@@ -2887,32 +2899,34 @@ function useSelect(userProps) {
2887
2899
  shouldScrollRef.current = false;
2888
2900
  dispatch({
2889
2901
  type: ItemMouseMove$1,
2890
- index: index
2902
+ index
2891
2903
  });
2892
2904
  };
2893
2905
 
2894
- var itemHandleClick = function itemHandleClick() {
2906
+ const itemHandleClick = () => {
2895
2907
  dispatch({
2896
2908
  type: ItemClick$1,
2897
- index: index
2909
+ index
2898
2910
  });
2899
2911
  };
2900
2912
 
2901
- var itemIndex = getItemIndex(index, item, latestProps.items);
2913
+ const itemIndex = getItemIndex(index, item, latestProps.items);
2902
2914
 
2903
2915
  if (itemIndex < 0) {
2904
2916
  throw new Error('Pass either item or item index in getItemProps!');
2905
2917
  }
2906
2918
 
2907
- var itemProps = _extends__default['default']((_extends4 = {
2919
+ const itemProps = {
2908
2920
  role: 'option',
2909
2921
  'aria-selected': "" + (itemIndex === latestState.highlightedIndex),
2910
- id: elementIds.getItemId(itemIndex)
2911
- }, _extends4[refKey] = handleRefs(ref, function (itemNode) {
2912
- if (itemNode) {
2913
- itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode;
2914
- }
2915
- }), _extends4), rest);
2922
+ id: elementIds.getItemId(itemIndex),
2923
+ [refKey]: handleRefs(ref, itemNode => {
2924
+ if (itemNode) {
2925
+ itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode;
2926
+ }
2927
+ }),
2928
+ ...rest
2929
+ };
2916
2930
 
2917
2931
  if (!rest.disabled) {
2918
2932
  itemProps.onMouseMove = callAllEventHandlers(onMouseMove, itemHandleMouseMove);
@@ -2923,46 +2937,46 @@ function useSelect(userProps) {
2923
2937
  }, [dispatch, latest, shouldScrollRef, elementIds]);
2924
2938
  return {
2925
2939
  // prop getters.
2926
- getToggleButtonProps: getToggleButtonProps,
2927
- getLabelProps: getLabelProps,
2928
- getMenuProps: getMenuProps,
2929
- getItemProps: getItemProps,
2940
+ getToggleButtonProps,
2941
+ getLabelProps,
2942
+ getMenuProps,
2943
+ getItemProps,
2930
2944
  // actions.
2931
- toggleMenu: toggleMenu,
2932
- openMenu: openMenu,
2933
- closeMenu: closeMenu,
2934
- setHighlightedIndex: setHighlightedIndex,
2935
- selectItem: selectItem,
2936
- reset: reset,
2937
- setInputValue: setInputValue,
2945
+ toggleMenu,
2946
+ openMenu,
2947
+ closeMenu,
2948
+ setHighlightedIndex,
2949
+ selectItem,
2950
+ reset,
2951
+ setInputValue,
2938
2952
  // state.
2939
- highlightedIndex: highlightedIndex,
2940
- isOpen: isOpen,
2941
- selectedItem: selectedItem,
2942
- inputValue: inputValue
2953
+ highlightedIndex,
2954
+ isOpen,
2955
+ selectedItem,
2956
+ inputValue
2943
2957
  };
2944
2958
  }
2945
2959
 
2946
- var InputKeyDownArrowDown = process.env.NODE_ENV !== "production" ? '__input_keydown_arrow_down__' : 0;
2947
- var InputKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__input_keydown_arrow_up__' : 1;
2948
- var InputKeyDownEscape = process.env.NODE_ENV !== "production" ? '__input_keydown_escape__' : 2;
2949
- var InputKeyDownHome = process.env.NODE_ENV !== "production" ? '__input_keydown_home__' : 3;
2950
- var InputKeyDownEnd = process.env.NODE_ENV !== "production" ? '__input_keydown_end__' : 4;
2951
- var InputKeyDownEnter = process.env.NODE_ENV !== "production" ? '__input_keydown_enter__' : 5;
2952
- var InputChange = process.env.NODE_ENV !== "production" ? '__input_change__' : 6;
2953
- var InputBlur = process.env.NODE_ENV !== "production" ? '__input_blur__' : 7;
2954
- var MenuMouseLeave = process.env.NODE_ENV !== "production" ? '__menu_mouse_leave__' : 8;
2955
- var ItemMouseMove = process.env.NODE_ENV !== "production" ? '__item_mouse_move__' : 9;
2956
- var ItemClick = process.env.NODE_ENV !== "production" ? '__item_click__' : 10;
2957
- var ToggleButtonClick = process.env.NODE_ENV !== "production" ? '__togglebutton_click__' : 11;
2958
- var FunctionToggleMenu = process.env.NODE_ENV !== "production" ? '__function_toggle_menu__' : 12;
2959
- var FunctionOpenMenu = process.env.NODE_ENV !== "production" ? '__function_open_menu__' : 13;
2960
- var FunctionCloseMenu = process.env.NODE_ENV !== "production" ? '__function_close_menu__' : 14;
2961
- var FunctionSetHighlightedIndex = process.env.NODE_ENV !== "production" ? '__function_set_highlighted_index__' : 15;
2962
- var FunctionSelectItem = process.env.NODE_ENV !== "production" ? '__function_select_item__' : 16;
2963
- var FunctionSetInputValue = process.env.NODE_ENV !== "production" ? '__function_set_input_value__' : 17;
2964
- var FunctionReset$1 = process.env.NODE_ENV !== "production" ? '__function_reset__' : 18;
2965
- var ControlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__controlled_prop_updated_selected_item__' : 19;
2960
+ const InputKeyDownArrowDown = process.env.NODE_ENV !== "production" ? '__input_keydown_arrow_down__' : 0;
2961
+ const InputKeyDownArrowUp = process.env.NODE_ENV !== "production" ? '__input_keydown_arrow_up__' : 1;
2962
+ const InputKeyDownEscape = process.env.NODE_ENV !== "production" ? '__input_keydown_escape__' : 2;
2963
+ const InputKeyDownHome = process.env.NODE_ENV !== "production" ? '__input_keydown_home__' : 3;
2964
+ const InputKeyDownEnd = process.env.NODE_ENV !== "production" ? '__input_keydown_end__' : 4;
2965
+ const InputKeyDownEnter = process.env.NODE_ENV !== "production" ? '__input_keydown_enter__' : 5;
2966
+ const InputChange = process.env.NODE_ENV !== "production" ? '__input_change__' : 6;
2967
+ const InputBlur = process.env.NODE_ENV !== "production" ? '__input_blur__' : 7;
2968
+ const MenuMouseLeave = process.env.NODE_ENV !== "production" ? '__menu_mouse_leave__' : 8;
2969
+ const ItemMouseMove = process.env.NODE_ENV !== "production" ? '__item_mouse_move__' : 9;
2970
+ const ItemClick = process.env.NODE_ENV !== "production" ? '__item_click__' : 10;
2971
+ const ToggleButtonClick = process.env.NODE_ENV !== "production" ? '__togglebutton_click__' : 11;
2972
+ const FunctionToggleMenu = process.env.NODE_ENV !== "production" ? '__function_toggle_menu__' : 12;
2973
+ const FunctionOpenMenu = process.env.NODE_ENV !== "production" ? '__function_open_menu__' : 13;
2974
+ const FunctionCloseMenu = process.env.NODE_ENV !== "production" ? '__function_close_menu__' : 14;
2975
+ const FunctionSetHighlightedIndex = process.env.NODE_ENV !== "production" ? '__function_set_highlighted_index__' : 15;
2976
+ const FunctionSelectItem = process.env.NODE_ENV !== "production" ? '__function_select_item__' : 16;
2977
+ const FunctionSetInputValue = process.env.NODE_ENV !== "production" ? '__function_set_input_value__' : 17;
2978
+ const FunctionReset$1 = process.env.NODE_ENV !== "production" ? '__function_reset__' : 18;
2979
+ const ControlledPropUpdatedSelectedItem = process.env.NODE_ENV !== "production" ? '__controlled_prop_updated_selected_item__' : 19;
2966
2980
 
2967
2981
  var stateChangeTypes$1 = /*#__PURE__*/Object.freeze({
2968
2982
  __proto__: null,
@@ -2989,56 +3003,60 @@ var stateChangeTypes$1 = /*#__PURE__*/Object.freeze({
2989
3003
  });
2990
3004
 
2991
3005
  function getInitialState$1(props) {
2992
- var initialState = getInitialState$2(props);
2993
- var selectedItem = initialState.selectedItem;
2994
- var inputValue = initialState.inputValue;
3006
+ const initialState = getInitialState$2(props);
3007
+ const {
3008
+ selectedItem
3009
+ } = initialState;
3010
+ let {
3011
+ inputValue
3012
+ } = initialState;
2995
3013
 
2996
3014
  if (inputValue === '' && selectedItem && props.defaultInputValue === undefined && props.initialInputValue === undefined && props.inputValue === undefined) {
2997
3015
  inputValue = props.itemToString(selectedItem);
2998
3016
  }
2999
3017
 
3000
- return _extends__default['default']({}, initialState, {
3001
- inputValue: inputValue
3002
- });
3018
+ return { ...initialState,
3019
+ inputValue
3020
+ };
3003
3021
  }
3004
3022
 
3005
- var propTypes$1 = {
3006
- items: PropTypes__default['default'].array.isRequired,
3007
- itemToString: PropTypes__default['default'].func,
3008
- getA11yStatusMessage: PropTypes__default['default'].func,
3009
- getA11ySelectionMessage: PropTypes__default['default'].func,
3010
- circularNavigation: PropTypes__default['default'].bool,
3011
- highlightedIndex: PropTypes__default['default'].number,
3012
- defaultHighlightedIndex: PropTypes__default['default'].number,
3013
- initialHighlightedIndex: PropTypes__default['default'].number,
3014
- isOpen: PropTypes__default['default'].bool,
3015
- defaultIsOpen: PropTypes__default['default'].bool,
3016
- initialIsOpen: PropTypes__default['default'].bool,
3017
- selectedItem: PropTypes__default['default'].any,
3018
- initialSelectedItem: PropTypes__default['default'].any,
3019
- defaultSelectedItem: PropTypes__default['default'].any,
3020
- inputValue: PropTypes__default['default'].string,
3021
- defaultInputValue: PropTypes__default['default'].string,
3022
- initialInputValue: PropTypes__default['default'].string,
3023
- id: PropTypes__default['default'].string,
3024
- labelId: PropTypes__default['default'].string,
3025
- menuId: PropTypes__default['default'].string,
3026
- getItemId: PropTypes__default['default'].func,
3027
- inputId: PropTypes__default['default'].string,
3028
- toggleButtonId: PropTypes__default['default'].string,
3029
- stateReducer: PropTypes__default['default'].func,
3030
- onSelectedItemChange: PropTypes__default['default'].func,
3031
- onHighlightedIndexChange: PropTypes__default['default'].func,
3032
- onStateChange: PropTypes__default['default'].func,
3033
- onIsOpenChange: PropTypes__default['default'].func,
3034
- onInputValueChange: PropTypes__default['default'].func,
3035
- environment: PropTypes__default['default'].shape({
3036
- addEventListener: PropTypes__default['default'].func,
3037
- removeEventListener: PropTypes__default['default'].func,
3038
- document: PropTypes__default['default'].shape({
3039
- getElementById: PropTypes__default['default'].func,
3040
- activeElement: PropTypes__default['default'].any,
3041
- body: PropTypes__default['default'].any
3023
+ const propTypes$1 = {
3024
+ items: PropTypes__default["default"].array.isRequired,
3025
+ itemToString: PropTypes__default["default"].func,
3026
+ getA11yStatusMessage: PropTypes__default["default"].func,
3027
+ getA11ySelectionMessage: PropTypes__default["default"].func,
3028
+ circularNavigation: PropTypes__default["default"].bool,
3029
+ highlightedIndex: PropTypes__default["default"].number,
3030
+ defaultHighlightedIndex: PropTypes__default["default"].number,
3031
+ initialHighlightedIndex: PropTypes__default["default"].number,
3032
+ isOpen: PropTypes__default["default"].bool,
3033
+ defaultIsOpen: PropTypes__default["default"].bool,
3034
+ initialIsOpen: PropTypes__default["default"].bool,
3035
+ selectedItem: PropTypes__default["default"].any,
3036
+ initialSelectedItem: PropTypes__default["default"].any,
3037
+ defaultSelectedItem: PropTypes__default["default"].any,
3038
+ inputValue: PropTypes__default["default"].string,
3039
+ defaultInputValue: PropTypes__default["default"].string,
3040
+ initialInputValue: PropTypes__default["default"].string,
3041
+ id: PropTypes__default["default"].string,
3042
+ labelId: PropTypes__default["default"].string,
3043
+ menuId: PropTypes__default["default"].string,
3044
+ getItemId: PropTypes__default["default"].func,
3045
+ inputId: PropTypes__default["default"].string,
3046
+ toggleButtonId: PropTypes__default["default"].string,
3047
+ stateReducer: PropTypes__default["default"].func,
3048
+ onSelectedItemChange: PropTypes__default["default"].func,
3049
+ onHighlightedIndexChange: PropTypes__default["default"].func,
3050
+ onStateChange: PropTypes__default["default"].func,
3051
+ onIsOpenChange: PropTypes__default["default"].func,
3052
+ onInputValueChange: PropTypes__default["default"].func,
3053
+ environment: PropTypes__default["default"].shape({
3054
+ addEventListener: PropTypes__default["default"].func,
3055
+ removeEventListener: PropTypes__default["default"].func,
3056
+ document: PropTypes__default["default"].shape({
3057
+ getElementById: PropTypes__default["default"].func,
3058
+ activeElement: PropTypes__default["default"].any,
3059
+ body: PropTypes__default["default"].any
3042
3060
  })
3043
3061
  })
3044
3062
  };
@@ -3056,14 +3074,10 @@ var propTypes$1 = {
3056
3074
  */
3057
3075
 
3058
3076
  function useControlledReducer(reducer, initialState, props) {
3059
- var previousSelectedItemRef = react.useRef();
3077
+ const previousSelectedItemRef = react.useRef();
3078
+ const [state, dispatch] = useEnhancedReducer(reducer, initialState, props); // ToDo: if needed, make same approach as selectedItemChanged from Downshift.
3060
3079
 
3061
- var _useEnhancedReducer = useEnhancedReducer(reducer, initialState, props),
3062
- state = _useEnhancedReducer[0],
3063
- dispatch = _useEnhancedReducer[1]; // ToDo: if needed, make same approach as selectedItemChanged from Downshift.
3064
-
3065
-
3066
- react.useEffect(function () {
3080
+ react.useEffect(() => {
3067
3081
  if (isControlledProp(props, 'selectedItem')) {
3068
3082
  if (previousSelectedItemRef.current !== props.selectedItem) {
3069
3083
  dispatch({
@@ -3079,27 +3093,29 @@ function useControlledReducer(reducer, initialState, props) {
3079
3093
  } // eslint-disable-next-line import/no-mutable-exports
3080
3094
 
3081
3095
 
3082
- var validatePropTypes$1 = noop;
3096
+ let validatePropTypes$1 = noop;
3083
3097
  /* istanbul ignore next */
3084
3098
 
3085
3099
  if (process.env.NODE_ENV !== 'production') {
3086
- validatePropTypes$1 = function validatePropTypes(options, caller) {
3087
- PropTypes__default['default'].checkPropTypes(propTypes$1, options, 'prop', caller.name);
3100
+ validatePropTypes$1 = (options, caller) => {
3101
+ PropTypes__default["default"].checkPropTypes(propTypes$1, options, 'prop', caller.name);
3088
3102
  };
3089
3103
  }
3090
3104
 
3091
- var defaultProps$1 = _extends__default['default']({}, defaultProps$3, {
3105
+ const defaultProps$1 = { ...defaultProps$3,
3092
3106
  getA11yStatusMessage: getA11yStatusMessage$1,
3093
3107
  circularNavigation: true
3094
- });
3108
+ };
3095
3109
 
3096
3110
  /* eslint-disable complexity */
3097
3111
 
3098
3112
  function downshiftUseComboboxReducer(state, action) {
3099
- var type = action.type,
3100
- props = action.props,
3101
- shiftKey = action.shiftKey;
3102
- var changes;
3113
+ const {
3114
+ type,
3115
+ props,
3116
+ shiftKey
3117
+ } = action;
3118
+ let changes;
3103
3119
 
3104
3120
  switch (type) {
3105
3121
  case ItemClick:
@@ -3140,22 +3156,24 @@ function downshiftUseComboboxReducer(state, action) {
3140
3156
  break;
3141
3157
 
3142
3158
  case InputKeyDownEnter:
3143
- changes = _extends__default['default']({}, state.isOpen && state.highlightedIndex >= 0 && {
3144
- selectedItem: props.items[state.highlightedIndex],
3145
- isOpen: getDefaultValue$1(props, 'isOpen'),
3146
- highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'),
3147
- inputValue: props.itemToString(props.items[state.highlightedIndex])
3148
- });
3159
+ changes = { ...(state.isOpen && state.highlightedIndex >= 0 && {
3160
+ selectedItem: props.items[state.highlightedIndex],
3161
+ isOpen: getDefaultValue$1(props, 'isOpen'),
3162
+ highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'),
3163
+ inputValue: props.itemToString(props.items[state.highlightedIndex])
3164
+ })
3165
+ };
3149
3166
  break;
3150
3167
 
3151
3168
  case InputKeyDownEscape:
3152
- changes = _extends__default['default']({
3169
+ changes = {
3153
3170
  isOpen: false,
3154
- highlightedIndex: -1
3155
- }, !state.isOpen && {
3156
- selectedItem: null,
3157
- inputValue: ''
3158
- });
3171
+ highlightedIndex: -1,
3172
+ ...(!state.isOpen && {
3173
+ selectedItem: null,
3174
+ inputValue: ''
3175
+ })
3176
+ };
3159
3177
  break;
3160
3178
 
3161
3179
  case InputKeyDownHome:
@@ -3171,13 +3189,14 @@ function downshiftUseComboboxReducer(state, action) {
3171
3189
  break;
3172
3190
 
3173
3191
  case InputBlur:
3174
- changes = _extends__default['default']({
3192
+ changes = {
3175
3193
  isOpen: false,
3176
- highlightedIndex: -1
3177
- }, state.highlightedIndex >= 0 && action.selectItem && {
3178
- selectedItem: props.items[state.highlightedIndex],
3179
- inputValue: props.itemToString(props.items[state.highlightedIndex])
3180
- });
3194
+ highlightedIndex: -1,
3195
+ ...(state.highlightedIndex >= 0 && action.selectItem && {
3196
+ selectedItem: props.items[state.highlightedIndex],
3197
+ inputValue: props.itemToString(props.items[state.highlightedIndex])
3198
+ })
3199
+ };
3181
3200
  break;
3182
3201
 
3183
3202
  case InputChange:
@@ -3205,15 +3224,13 @@ function downshiftUseComboboxReducer(state, action) {
3205
3224
  return downshiftCommonReducer(state, action, stateChangeTypes$1);
3206
3225
  }
3207
3226
 
3208
- return _extends__default['default']({}, state, changes);
3227
+ return { ...state,
3228
+ ...changes
3229
+ };
3209
3230
  }
3210
3231
  /* eslint-enable complexity */
3211
3232
 
3212
- var _excluded$1 = ["onMouseLeave", "refKey", "ref"],
3213
- _excluded2$1 = ["item", "index", "refKey", "ref", "onMouseMove", "onClick", "onPress"],
3214
- _excluded3 = ["onClick", "onPress", "refKey", "ref"],
3215
- _excluded4 = ["onKeyDown", "onChange", "onInput", "onBlur", "onChangeText", "refKey", "ref"],
3216
- _excluded5 = ["refKey", "ref"];
3233
+ /* eslint-disable max-statements */
3217
3234
  useCombobox.stateChangeTypes = stateChangeTypes$1;
3218
3235
 
3219
3236
  function useCombobox(userProps) {
@@ -3223,87 +3240,88 @@ function useCombobox(userProps) {
3223
3240
 
3224
3241
  validatePropTypes$1(userProps, useCombobox); // Props defaults and destructuring.
3225
3242
 
3226
- var props = _extends__default['default']({}, defaultProps$1, userProps);
3227
-
3228
- var initialIsOpen = props.initialIsOpen,
3229
- defaultIsOpen = props.defaultIsOpen,
3230
- items = props.items,
3231
- scrollIntoView = props.scrollIntoView,
3232
- environment = props.environment,
3233
- getA11yStatusMessage = props.getA11yStatusMessage,
3234
- getA11ySelectionMessage = props.getA11ySelectionMessage,
3235
- itemToString = props.itemToString; // Initial state depending on controlled props.
3236
-
3237
- var initialState = getInitialState$1(props);
3238
-
3239
- var _useControlledReducer = useControlledReducer(downshiftUseComboboxReducer, initialState, props),
3240
- state = _useControlledReducer[0],
3241
- dispatch = _useControlledReducer[1];
3242
-
3243
- var isOpen = state.isOpen,
3244
- highlightedIndex = state.highlightedIndex,
3245
- selectedItem = state.selectedItem,
3246
- inputValue = state.inputValue; // Element refs.
3247
-
3248
- var menuRef = react.useRef(null);
3249
- var itemRefs = react.useRef({});
3250
- var inputRef = react.useRef(null);
3251
- var toggleButtonRef = react.useRef(null);
3252
- var comboboxRef = react.useRef(null);
3253
- var isInitialMountRef = react.useRef(true); // prevent id re-generation between renders.
3254
-
3255
- var elementIds = useElementIds(props); // used to keep track of how many items we had on previous cycle.
3256
-
3257
- var previousResultCountRef = react.useRef(); // utility callback to get item element.
3258
-
3259
- var latest = useLatestRef({
3260
- state: state,
3261
- props: props
3243
+ const props = { ...defaultProps$1,
3244
+ ...userProps
3245
+ };
3246
+ const {
3247
+ initialIsOpen,
3248
+ defaultIsOpen,
3249
+ items,
3250
+ scrollIntoView,
3251
+ environment,
3252
+ getA11yStatusMessage,
3253
+ getA11ySelectionMessage,
3254
+ itemToString
3255
+ } = props; // Initial state depending on controlled props.
3256
+
3257
+ const initialState = getInitialState$1(props);
3258
+ const [state, dispatch] = useControlledReducer(downshiftUseComboboxReducer, initialState, props);
3259
+ const {
3260
+ isOpen,
3261
+ highlightedIndex,
3262
+ selectedItem,
3263
+ inputValue
3264
+ } = state; // Element refs.
3265
+
3266
+ const menuRef = react.useRef(null);
3267
+ const itemRefs = react.useRef({});
3268
+ const inputRef = react.useRef(null);
3269
+ const toggleButtonRef = react.useRef(null);
3270
+ const comboboxRef = react.useRef(null);
3271
+ const isInitialMountRef = react.useRef(true); // prevent id re-generation between renders.
3272
+
3273
+ const elementIds = useElementIds(props); // used to keep track of how many items we had on previous cycle.
3274
+
3275
+ const previousResultCountRef = react.useRef(); // utility callback to get item element.
3276
+
3277
+ const latest = useLatestRef({
3278
+ state,
3279
+ props
3262
3280
  });
3263
- var getItemNodeFromIndex = react.useCallback(function (index) {
3264
- return itemRefs.current[elementIds.getItemId(index)];
3265
- }, [elementIds]); // Effects.
3281
+ const getItemNodeFromIndex = react.useCallback(index => itemRefs.current[elementIds.getItemId(index)], [elementIds]); // Effects.
3266
3282
  // Sets a11y status message on changes in state.
3267
3283
 
3268
- useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], _extends__default['default']({
3284
+ useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], {
3269
3285
  isInitialMount: isInitialMountRef.current,
3270
3286
  previousResultCount: previousResultCountRef.current,
3271
- items: items,
3272
- environment: environment,
3273
- itemToString: itemToString
3274
- }, state)); // Sets a11y status message on changes in selectedItem.
3287
+ items,
3288
+ environment,
3289
+ itemToString,
3290
+ ...state
3291
+ }); // Sets a11y status message on changes in selectedItem.
3275
3292
 
3276
- useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], _extends__default['default']({
3293
+ useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], {
3277
3294
  isInitialMount: isInitialMountRef.current,
3278
3295
  previousResultCount: previousResultCountRef.current,
3279
- items: items,
3280
- environment: environment,
3281
- itemToString: itemToString
3282
- }, state)); // Scroll on highlighted item if change comes from keyboard.
3296
+ items,
3297
+ environment,
3298
+ itemToString,
3299
+ ...state
3300
+ }); // Scroll on highlighted item if change comes from keyboard.
3283
3301
 
3284
- var shouldScrollRef = useScrollIntoView({
3302
+ const shouldScrollRef = useScrollIntoView({
3285
3303
  menuElement: menuRef.current,
3286
- highlightedIndex: highlightedIndex,
3287
- isOpen: isOpen,
3288
- itemRefs: itemRefs,
3289
- scrollIntoView: scrollIntoView,
3290
- getItemNodeFromIndex: getItemNodeFromIndex
3304
+ highlightedIndex,
3305
+ isOpen,
3306
+ itemRefs,
3307
+ scrollIntoView,
3308
+ getItemNodeFromIndex
3291
3309
  });
3292
3310
  useControlPropsValidator({
3293
3311
  isInitialMount: isInitialMountRef.current,
3294
- props: props,
3295
- state: state
3312
+ props,
3313
+ state
3296
3314
  }); // Focus the input on first render if required.
3297
3315
 
3298
- react.useEffect(function () {
3299
- var focusOnOpen = initialIsOpen || defaultIsOpen || isOpen;
3316
+ react.useEffect(() => {
3317
+ const focusOnOpen = initialIsOpen || defaultIsOpen || isOpen;
3300
3318
 
3301
3319
  if (focusOnOpen && inputRef.current) {
3302
3320
  inputRef.current.focus();
3303
3321
  } // eslint-disable-next-line react-hooks/exhaustive-deps
3304
3322
 
3305
3323
  }, []);
3306
- react.useEffect(function () {
3324
+ react.useEffect(() => {
3307
3325
  if (isInitialMountRef.current) {
3308
3326
  return;
3309
3327
  }
@@ -3311,149 +3329,153 @@ function useCombobox(userProps) {
3311
3329
  previousResultCountRef.current = items.length;
3312
3330
  }); // Add mouse/touch events to document.
3313
3331
 
3314
- var mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [comboboxRef, menuRef, toggleButtonRef], environment, function () {
3332
+ const mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [comboboxRef, menuRef, toggleButtonRef], environment, () => {
3315
3333
  dispatch({
3316
3334
  type: InputBlur,
3317
3335
  selectItem: false
3318
3336
  });
3319
3337
  });
3320
- var setGetterPropCallInfo = useGetterPropsCalledChecker('getInputProps', 'getComboboxProps', 'getMenuProps'); // Make initial ref false.
3338
+ const setGetterPropCallInfo = useGetterPropsCalledChecker('getInputProps', 'getComboboxProps', 'getMenuProps'); // Make initial ref false.
3321
3339
 
3322
- react.useEffect(function () {
3340
+ react.useEffect(() => {
3323
3341
  isInitialMountRef.current = false;
3324
3342
  }, []); // Reset itemRefs on close.
3325
3343
 
3326
- react.useEffect(function () {
3344
+ react.useEffect(() => {
3327
3345
  if (!isOpen) {
3328
3346
  itemRefs.current = {};
3329
3347
  }
3330
3348
  }, [isOpen]);
3331
3349
  /* Event handler functions */
3332
3350
 
3333
- var inputKeyDownHandlers = react.useMemo(function () {
3334
- return {
3335
- ArrowDown: function ArrowDown(event) {
3336
- event.preventDefault();
3337
- dispatch({
3338
- type: InputKeyDownArrowDown,
3339
- shiftKey: event.shiftKey,
3340
- getItemNodeFromIndex: getItemNodeFromIndex
3341
- });
3342
- },
3343
- ArrowUp: function ArrowUp(event) {
3344
- event.preventDefault();
3345
- dispatch({
3346
- type: InputKeyDownArrowUp,
3347
- shiftKey: event.shiftKey,
3348
- getItemNodeFromIndex: getItemNodeFromIndex
3349
- });
3350
- },
3351
- Home: function Home(event) {
3352
- if (!latest.current.state.isOpen) {
3353
- return;
3354
- }
3351
+ const inputKeyDownHandlers = react.useMemo(() => ({
3352
+ ArrowDown(event) {
3353
+ event.preventDefault();
3354
+ dispatch({
3355
+ type: InputKeyDownArrowDown,
3356
+ shiftKey: event.shiftKey,
3357
+ getItemNodeFromIndex
3358
+ });
3359
+ },
3355
3360
 
3356
- event.preventDefault();
3357
- dispatch({
3358
- type: InputKeyDownHome,
3359
- getItemNodeFromIndex: getItemNodeFromIndex
3360
- });
3361
- },
3362
- End: function End(event) {
3363
- if (!latest.current.state.isOpen) {
3364
- return;
3365
- }
3361
+ ArrowUp(event) {
3362
+ event.preventDefault();
3363
+ dispatch({
3364
+ type: InputKeyDownArrowUp,
3365
+ shiftKey: event.shiftKey,
3366
+ getItemNodeFromIndex
3367
+ });
3368
+ },
3366
3369
 
3367
- event.preventDefault();
3368
- dispatch({
3369
- type: InputKeyDownEnd,
3370
- getItemNodeFromIndex: getItemNodeFromIndex
3371
- });
3372
- },
3373
- Escape: function Escape() {
3374
- var latestState = latest.current.state;
3370
+ Home(event) {
3371
+ if (!latest.current.state.isOpen) {
3372
+ return;
3373
+ }
3375
3374
 
3376
- if (latestState.isOpen || latestState.inputValue || latestState.selectedItem || latestState.highlightedIndex > -1) {
3377
- dispatch({
3378
- type: InputKeyDownEscape
3379
- });
3380
- }
3381
- },
3382
- Enter: function Enter(event) {
3383
- var latestState = latest.current.state; // if closed or no highlighted index, do nothing.
3375
+ event.preventDefault();
3376
+ dispatch({
3377
+ type: InputKeyDownHome,
3378
+ getItemNodeFromIndex
3379
+ });
3380
+ },
3384
3381
 
3385
- if (!latestState.isOpen || latestState.highlightedIndex < 0 || event.which === 229 // if IME composing, wait for next Enter keydown event.
3386
- ) {
3387
- return;
3388
- }
3382
+ End(event) {
3383
+ if (!latest.current.state.isOpen) {
3384
+ return;
3385
+ }
3389
3386
 
3390
- event.preventDefault();
3387
+ event.preventDefault();
3388
+ dispatch({
3389
+ type: InputKeyDownEnd,
3390
+ getItemNodeFromIndex
3391
+ });
3392
+ },
3393
+
3394
+ Escape() {
3395
+ const latestState = latest.current.state;
3396
+
3397
+ if (latestState.isOpen || latestState.inputValue || latestState.selectedItem || latestState.highlightedIndex > -1) {
3391
3398
  dispatch({
3392
- type: InputKeyDownEnter,
3393
- getItemNodeFromIndex: getItemNodeFromIndex
3399
+ type: InputKeyDownEscape
3394
3400
  });
3395
3401
  }
3396
- };
3397
- }, [dispatch, latest, getItemNodeFromIndex]); // Getter props.
3398
-
3399
- var getLabelProps = react.useCallback(function (labelProps) {
3400
- return _extends__default['default']({
3401
- id: elementIds.labelId,
3402
- htmlFor: elementIds.inputId
3403
- }, labelProps);
3404
- }, [elementIds]);
3405
- var getMenuProps = react.useCallback(function (_temp, _temp2) {
3406
- var _extends2;
3407
-
3408
- var _ref = _temp === void 0 ? {} : _temp,
3409
- onMouseLeave = _ref.onMouseLeave,
3410
- _ref$refKey = _ref.refKey,
3411
- refKey = _ref$refKey === void 0 ? 'ref' : _ref$refKey,
3412
- ref = _ref.ref,
3413
- rest = _objectWithoutPropertiesLoose__default['default'](_ref, _excluded$1);
3414
-
3415
- var _ref2 = _temp2 === void 0 ? {} : _temp2,
3416
- _ref2$suppressRefErro = _ref2.suppressRefError,
3417
- suppressRefError = _ref2$suppressRefErro === void 0 ? false : _ref2$suppressRefErro;
3402
+ },
3418
3403
 
3419
- setGetterPropCallInfo('getMenuProps', suppressRefError, refKey, menuRef);
3420
- return _extends__default['default']((_extends2 = {}, _extends2[refKey] = handleRefs(ref, function (menuNode) {
3421
- menuRef.current = menuNode;
3422
- }), _extends2.id = elementIds.menuId, _extends2.role = 'listbox', _extends2['aria-labelledby'] = elementIds.labelId, _extends2.onMouseLeave = callAllEventHandlers(onMouseLeave, function () {
3404
+ Enter(event) {
3405
+ const latestState = latest.current.state; // if closed or no highlighted index, do nothing.
3406
+
3407
+ if (!latestState.isOpen || latestState.highlightedIndex < 0 || event.which === 229 // if IME composing, wait for next Enter keydown event.
3408
+ ) {
3409
+ return;
3410
+ }
3411
+
3412
+ event.preventDefault();
3423
3413
  dispatch({
3424
- type: MenuMouseLeave
3414
+ type: InputKeyDownEnter,
3415
+ getItemNodeFromIndex
3425
3416
  });
3426
- }), _extends2), rest);
3417
+ }
3418
+
3419
+ }), [dispatch, latest, getItemNodeFromIndex]); // Getter props.
3420
+
3421
+ const getLabelProps = react.useCallback(labelProps => ({
3422
+ id: elementIds.labelId,
3423
+ htmlFor: elementIds.inputId,
3424
+ ...labelProps
3425
+ }), [elementIds]);
3426
+ const getMenuProps = react.useCallback(function (_temp, _temp2) {
3427
+ let {
3428
+ onMouseLeave,
3429
+ refKey = 'ref',
3430
+ ref,
3431
+ ...rest
3432
+ } = _temp === void 0 ? {} : _temp;
3433
+ let {
3434
+ suppressRefError = false
3435
+ } = _temp2 === void 0 ? {} : _temp2;
3436
+ setGetterPropCallInfo('getMenuProps', suppressRefError, refKey, menuRef);
3437
+ return {
3438
+ [refKey]: handleRefs(ref, menuNode => {
3439
+ menuRef.current = menuNode;
3440
+ }),
3441
+ id: elementIds.menuId,
3442
+ role: 'listbox',
3443
+ 'aria-labelledby': elementIds.labelId,
3444
+ onMouseLeave: callAllEventHandlers(onMouseLeave, () => {
3445
+ dispatch({
3446
+ type: MenuMouseLeave
3447
+ });
3448
+ }),
3449
+ ...rest
3450
+ };
3427
3451
  }, [dispatch, setGetterPropCallInfo, elementIds]);
3428
- var getItemProps = react.useCallback(function (_temp3) {
3429
- var _extends3, _ref4;
3430
-
3431
- var _ref3 = _temp3 === void 0 ? {} : _temp3,
3432
- item = _ref3.item,
3433
- index = _ref3.index,
3434
- _ref3$refKey = _ref3.refKey,
3435
- refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey,
3436
- ref = _ref3.ref,
3437
- onMouseMove = _ref3.onMouseMove;
3438
- _ref3.onClick;
3439
- var onPress = _ref3.onPress,
3440
- rest = _objectWithoutPropertiesLoose__default['default'](_ref3, _excluded2$1);
3441
-
3442
- var _latest$current = latest.current,
3443
- latestProps = _latest$current.props,
3444
- latestState = _latest$current.state;
3445
- var itemIndex = getItemIndex(index, item, latestProps.items);
3452
+ const getItemProps = react.useCallback(function (_temp3) {
3453
+ let {
3454
+ item,
3455
+ index,
3456
+ refKey = 'ref',
3457
+ ref,
3458
+ onMouseMove,
3459
+ onClick,
3460
+ onPress,
3461
+ ...rest
3462
+ } = _temp3 === void 0 ? {} : _temp3;
3463
+ const {
3464
+ props: latestProps,
3465
+ state: latestState
3466
+ } = latest.current;
3467
+ const itemIndex = getItemIndex(index, item, latestProps.items);
3446
3468
 
3447
3469
  if (itemIndex < 0) {
3448
3470
  throw new Error('Pass either item or item index in getItemProps!');
3449
3471
  }
3450
3472
 
3451
- var onSelectKey = /* istanbul ignore next (react-native) */
3473
+ const onSelectKey = /* istanbul ignore next (react-native) */
3452
3474
  'onPress' ;
3453
- var customClickHandler = /* istanbul ignore next (react-native) */
3475
+ const customClickHandler = /* istanbul ignore next (react-native) */
3454
3476
  onPress ;
3455
3477
 
3456
- var itemHandleMouseMove = function itemHandleMouseMove() {
3478
+ const itemHandleMouseMove = () => {
3457
3479
  if (index === latestState.highlightedIndex) {
3458
3480
  return;
3459
3481
  }
@@ -3461,14 +3483,14 @@ function useCombobox(userProps) {
3461
3483
  shouldScrollRef.current = false;
3462
3484
  dispatch({
3463
3485
  type: ItemMouseMove,
3464
- index: index
3486
+ index
3465
3487
  });
3466
3488
  };
3467
3489
 
3468
- var itemHandleClick = function itemHandleClick() {
3490
+ const itemHandleClick = () => {
3469
3491
  dispatch({
3470
3492
  type: ItemClick,
3471
- index: index
3493
+ index
3472
3494
  });
3473
3495
 
3474
3496
  if (inputRef.current) {
@@ -3476,26 +3498,32 @@ function useCombobox(userProps) {
3476
3498
  }
3477
3499
  };
3478
3500
 
3479
- return _extends__default['default']((_extends3 = {}, _extends3[refKey] = handleRefs(ref, function (itemNode) {
3480
- if (itemNode) {
3481
- itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode;
3482
- }
3483
- }), _extends3.role = 'option', _extends3['aria-selected'] = "" + (itemIndex === latestState.highlightedIndex), _extends3.id = elementIds.getItemId(itemIndex), _extends3), !rest.disabled && (_ref4 = {
3484
- onMouseMove: callAllEventHandlers(onMouseMove, itemHandleMouseMove)
3485
- }, _ref4[onSelectKey] = callAllEventHandlers(customClickHandler, itemHandleClick), _ref4), rest);
3501
+ return {
3502
+ [refKey]: handleRefs(ref, itemNode => {
3503
+ if (itemNode) {
3504
+ itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode;
3505
+ }
3506
+ }),
3507
+ role: 'option',
3508
+ 'aria-selected': "" + (itemIndex === latestState.highlightedIndex),
3509
+ id: elementIds.getItemId(itemIndex),
3510
+ ...(!rest.disabled && {
3511
+ onMouseMove: callAllEventHandlers(onMouseMove, itemHandleMouseMove),
3512
+ [onSelectKey]: callAllEventHandlers(customClickHandler, itemHandleClick)
3513
+ }),
3514
+ ...rest
3515
+ };
3486
3516
  }, [dispatch, latest, shouldScrollRef, elementIds]);
3487
- var getToggleButtonProps = react.useCallback(function (_temp4) {
3488
- var _extends4;
3489
-
3490
- var _ref5 = _temp4 === void 0 ? {} : _temp4;
3491
- _ref5.onClick;
3492
- var onPress = _ref5.onPress,
3493
- _ref5$refKey = _ref5.refKey,
3494
- refKey = _ref5$refKey === void 0 ? 'ref' : _ref5$refKey,
3495
- ref = _ref5.ref,
3496
- rest = _objectWithoutPropertiesLoose__default['default'](_ref5, _excluded3);
3497
-
3498
- var toggleButtonHandleClick = function toggleButtonHandleClick() {
3517
+ const getToggleButtonProps = react.useCallback(function (_temp4) {
3518
+ let {
3519
+ onClick,
3520
+ onPress,
3521
+ refKey = 'ref',
3522
+ ref,
3523
+ ...rest
3524
+ } = _temp4 === void 0 ? {} : _temp4;
3525
+
3526
+ const toggleButtonHandleClick = () => {
3499
3527
  dispatch({
3500
3528
  type: ToggleButtonClick
3501
3529
  });
@@ -3505,43 +3533,46 @@ function useCombobox(userProps) {
3505
3533
  }
3506
3534
  };
3507
3535
 
3508
- return _extends__default['default']((_extends4 = {}, _extends4[refKey] = handleRefs(ref, function (toggleButtonNode) {
3509
- toggleButtonRef.current = toggleButtonNode;
3510
- }), _extends4.id = elementIds.toggleButtonId, _extends4.tabIndex = -1, _extends4), !rest.disabled && _extends__default['default']({}, /* istanbul ignore next (react-native) */
3511
- {
3512
- onPress: callAllEventHandlers(onPress, toggleButtonHandleClick)
3513
- } ), rest);
3536
+ return {
3537
+ [refKey]: handleRefs(ref, toggleButtonNode => {
3538
+ toggleButtonRef.current = toggleButtonNode;
3539
+ }),
3540
+ id: elementIds.toggleButtonId,
3541
+ tabIndex: -1,
3542
+ ...(!rest.disabled && { ...(/* istanbul ignore next (react-native) */
3543
+ {
3544
+ onPress: callAllEventHandlers(onPress, toggleButtonHandleClick)
3545
+ } )
3546
+ }),
3547
+ ...rest
3548
+ };
3514
3549
  }, [dispatch, latest, elementIds]);
3515
- var getInputProps = react.useCallback(function (_temp5, _temp6) {
3516
- var _extends5;
3517
-
3518
- var _ref6 = _temp5 === void 0 ? {} : _temp5,
3519
- onKeyDown = _ref6.onKeyDown,
3520
- onChange = _ref6.onChange,
3521
- onInput = _ref6.onInput,
3522
- onBlur = _ref6.onBlur,
3523
- onChangeText = _ref6.onChangeText,
3524
- _ref6$refKey = _ref6.refKey,
3525
- refKey = _ref6$refKey === void 0 ? 'ref' : _ref6$refKey,
3526
- ref = _ref6.ref,
3527
- rest = _objectWithoutPropertiesLoose__default['default'](_ref6, _excluded4);
3528
-
3529
- var _ref7 = _temp6 === void 0 ? {} : _temp6,
3530
- _ref7$suppressRefErro = _ref7.suppressRefError,
3531
- suppressRefError = _ref7$suppressRefErro === void 0 ? false : _ref7$suppressRefErro;
3532
-
3550
+ const getInputProps = react.useCallback(function (_temp5, _temp6) {
3551
+ let {
3552
+ onKeyDown,
3553
+ onChange,
3554
+ onInput,
3555
+ onBlur,
3556
+ onChangeText,
3557
+ refKey = 'ref',
3558
+ ref,
3559
+ ...rest
3560
+ } = _temp5 === void 0 ? {} : _temp5;
3561
+ let {
3562
+ suppressRefError = false
3563
+ } = _temp6 === void 0 ? {} : _temp6;
3533
3564
  setGetterPropCallInfo('getInputProps', suppressRefError, refKey, inputRef);
3534
- var latestState = latest.current.state;
3565
+ const latestState = latest.current.state;
3535
3566
 
3536
- var inputHandleKeyDown = function inputHandleKeyDown(event) {
3537
- var key = normalizeArrowKey(event);
3567
+ const inputHandleKeyDown = event => {
3568
+ const key = normalizeArrowKey(event);
3538
3569
 
3539
3570
  if (key && inputKeyDownHandlers[key]) {
3540
3571
  inputKeyDownHandlers[key](event);
3541
3572
  }
3542
3573
  };
3543
3574
 
3544
- var inputHandleChange = function inputHandleChange(event) {
3575
+ const inputHandleChange = event => {
3545
3576
  dispatch({
3546
3577
  type: InputChange,
3547
3578
  inputValue: /* istanbul ignore next (react-native) */
@@ -3549,7 +3580,7 @@ function useCombobox(userProps) {
3549
3580
  });
3550
3581
  };
3551
3582
 
3552
- var inputHandleBlur = function inputHandleBlur() {
3583
+ const inputHandleBlur = () => {
3553
3584
  /* istanbul ignore else */
3554
3585
  if (latestState.isOpen && !mouseAndTouchTrackersRef.current.isMouseDown) {
3555
3586
  dispatch({
@@ -3561,122 +3592,134 @@ function useCombobox(userProps) {
3561
3592
  /* istanbul ignore next (preact) */
3562
3593
 
3563
3594
 
3564
- var onChangeKey = 'onChange';
3565
- var eventHandlers = {};
3595
+ const onChangeKey = 'onChange';
3596
+ let eventHandlers = {};
3566
3597
 
3567
3598
  if (!rest.disabled) {
3568
- var _eventHandlers;
3569
-
3570
- eventHandlers = (_eventHandlers = {}, _eventHandlers[onChangeKey] = callAllEventHandlers(onChange, onInput, inputHandleChange), _eventHandlers.onKeyDown = callAllEventHandlers(onKeyDown, inputHandleKeyDown), _eventHandlers.onBlur = callAllEventHandlers(onBlur, inputHandleBlur), _eventHandlers);
3599
+ eventHandlers = {
3600
+ [onChangeKey]: callAllEventHandlers(onChange, onInput, inputHandleChange),
3601
+ onKeyDown: callAllEventHandlers(onKeyDown, inputHandleKeyDown),
3602
+ onBlur: callAllEventHandlers(onBlur, inputHandleBlur)
3603
+ };
3571
3604
  }
3572
3605
  /* istanbul ignore if (react-native) */
3573
3606
 
3574
3607
 
3575
3608
  {
3576
3609
  eventHandlers.onChange = callAllEventHandlers(onChange, onInput, inputHandleChange);
3577
- eventHandlers.onChangeText = callAllEventHandlers(onChangeText, onInput, function (text) {
3610
+ eventHandlers.onChangeText = callAllEventHandlers(onChangeText, onInput, text => {
3578
3611
  inputHandleChange({
3579
3612
  nativeEvent: {
3580
- text: text
3613
+ text
3581
3614
  }
3582
3615
  });
3583
3616
  });
3584
3617
  }
3585
3618
 
3586
- return _extends__default['default']((_extends5 = {}, _extends5[refKey] = handleRefs(ref, function (inputNode) {
3587
- inputRef.current = inputNode;
3588
- }), _extends5.id = elementIds.inputId, _extends5['aria-autocomplete'] = 'list', _extends5['aria-controls'] = elementIds.menuId, _extends5), latestState.isOpen && latestState.highlightedIndex > -1 && {
3589
- 'aria-activedescendant': elementIds.getItemId(latestState.highlightedIndex)
3590
- }, {
3619
+ return {
3620
+ [refKey]: handleRefs(ref, inputNode => {
3621
+ inputRef.current = inputNode;
3622
+ }),
3623
+ id: elementIds.inputId,
3624
+ 'aria-autocomplete': 'list',
3625
+ 'aria-controls': elementIds.menuId,
3626
+ ...(latestState.isOpen && latestState.highlightedIndex > -1 && {
3627
+ 'aria-activedescendant': elementIds.getItemId(latestState.highlightedIndex)
3628
+ }),
3591
3629
  'aria-labelledby': elementIds.labelId,
3592
3630
  // https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
3593
3631
  // revert back since autocomplete="nope" is ignored on latest Chrome and Opera
3594
3632
  autoComplete: 'off',
3595
- value: latestState.inputValue
3596
- }, eventHandlers, rest);
3633
+ value: latestState.inputValue,
3634
+ ...eventHandlers,
3635
+ ...rest
3636
+ };
3597
3637
  }, [dispatch, inputKeyDownHandlers, latest, mouseAndTouchTrackersRef, setGetterPropCallInfo, elementIds]);
3598
- var getComboboxProps = react.useCallback(function (_temp7, _temp8) {
3599
- var _extends6;
3600
-
3601
- var _ref8 = _temp7 === void 0 ? {} : _temp7,
3602
- _ref8$refKey = _ref8.refKey,
3603
- refKey = _ref8$refKey === void 0 ? 'ref' : _ref8$refKey,
3604
- ref = _ref8.ref,
3605
- rest = _objectWithoutPropertiesLoose__default['default'](_ref8, _excluded5);
3606
-
3607
- var _ref9 = _temp8 === void 0 ? {} : _temp8,
3608
- _ref9$suppressRefErro = _ref9.suppressRefError,
3609
- suppressRefError = _ref9$suppressRefErro === void 0 ? false : _ref9$suppressRefErro;
3610
-
3638
+ const getComboboxProps = react.useCallback(function (_temp7, _temp8) {
3639
+ let {
3640
+ refKey = 'ref',
3641
+ ref,
3642
+ ...rest
3643
+ } = _temp7 === void 0 ? {} : _temp7;
3644
+ let {
3645
+ suppressRefError = false
3646
+ } = _temp8 === void 0 ? {} : _temp8;
3611
3647
  setGetterPropCallInfo('getComboboxProps', suppressRefError, refKey, comboboxRef);
3612
- return _extends__default['default']((_extends6 = {}, _extends6[refKey] = handleRefs(ref, function (comboboxNode) {
3613
- comboboxRef.current = comboboxNode;
3614
- }), _extends6.role = 'combobox', _extends6['aria-haspopup'] = 'listbox', _extends6['aria-owns'] = elementIds.menuId, _extends6['aria-expanded'] = latest.current.state.isOpen, _extends6), rest);
3648
+ return {
3649
+ [refKey]: handleRefs(ref, comboboxNode => {
3650
+ comboboxRef.current = comboboxNode;
3651
+ }),
3652
+ role: 'combobox',
3653
+ 'aria-haspopup': 'listbox',
3654
+ 'aria-owns': elementIds.menuId,
3655
+ 'aria-expanded': latest.current.state.isOpen,
3656
+ ...rest
3657
+ };
3615
3658
  }, [latest, setGetterPropCallInfo, elementIds]); // returns
3616
3659
 
3617
- var toggleMenu = react.useCallback(function () {
3660
+ const toggleMenu = react.useCallback(() => {
3618
3661
  dispatch({
3619
3662
  type: FunctionToggleMenu
3620
3663
  });
3621
3664
  }, [dispatch]);
3622
- var closeMenu = react.useCallback(function () {
3665
+ const closeMenu = react.useCallback(() => {
3623
3666
  dispatch({
3624
3667
  type: FunctionCloseMenu
3625
3668
  });
3626
3669
  }, [dispatch]);
3627
- var openMenu = react.useCallback(function () {
3670
+ const openMenu = react.useCallback(() => {
3628
3671
  dispatch({
3629
3672
  type: FunctionOpenMenu
3630
3673
  });
3631
3674
  }, [dispatch]);
3632
- var setHighlightedIndex = react.useCallback(function (newHighlightedIndex) {
3675
+ const setHighlightedIndex = react.useCallback(newHighlightedIndex => {
3633
3676
  dispatch({
3634
3677
  type: FunctionSetHighlightedIndex,
3635
3678
  highlightedIndex: newHighlightedIndex
3636
3679
  });
3637
3680
  }, [dispatch]);
3638
- var selectItem = react.useCallback(function (newSelectedItem) {
3681
+ const selectItem = react.useCallback(newSelectedItem => {
3639
3682
  dispatch({
3640
3683
  type: FunctionSelectItem,
3641
3684
  selectedItem: newSelectedItem
3642
3685
  });
3643
3686
  }, [dispatch]);
3644
- var setInputValue = react.useCallback(function (newInputValue) {
3687
+ const setInputValue = react.useCallback(newInputValue => {
3645
3688
  dispatch({
3646
3689
  type: FunctionSetInputValue,
3647
3690
  inputValue: newInputValue
3648
3691
  });
3649
3692
  }, [dispatch]);
3650
- var reset = react.useCallback(function () {
3693
+ const reset = react.useCallback(() => {
3651
3694
  dispatch({
3652
3695
  type: FunctionReset$1
3653
3696
  });
3654
3697
  }, [dispatch]);
3655
3698
  return {
3656
3699
  // prop getters.
3657
- getItemProps: getItemProps,
3658
- getLabelProps: getLabelProps,
3659
- getMenuProps: getMenuProps,
3660
- getInputProps: getInputProps,
3661
- getComboboxProps: getComboboxProps,
3662
- getToggleButtonProps: getToggleButtonProps,
3700
+ getItemProps,
3701
+ getLabelProps,
3702
+ getMenuProps,
3703
+ getInputProps,
3704
+ getComboboxProps,
3705
+ getToggleButtonProps,
3663
3706
  // actions.
3664
- toggleMenu: toggleMenu,
3665
- openMenu: openMenu,
3666
- closeMenu: closeMenu,
3667
- setHighlightedIndex: setHighlightedIndex,
3668
- setInputValue: setInputValue,
3669
- selectItem: selectItem,
3670
- reset: reset,
3707
+ toggleMenu,
3708
+ openMenu,
3709
+ closeMenu,
3710
+ setHighlightedIndex,
3711
+ setInputValue,
3712
+ selectItem,
3713
+ reset,
3671
3714
  // state.
3672
- highlightedIndex: highlightedIndex,
3673
- isOpen: isOpen,
3674
- selectedItem: selectedItem,
3675
- inputValue: inputValue
3715
+ highlightedIndex,
3716
+ isOpen,
3717
+ selectedItem,
3718
+ inputValue
3676
3719
  };
3677
3720
  }
3678
3721
 
3679
- var defaultStateValues = {
3722
+ const defaultStateValues = {
3680
3723
  activeIndex: -1,
3681
3724
  selectedItems: []
3682
3725
  };
@@ -3716,11 +3759,11 @@ function getDefaultValue(props, propKey) {
3716
3759
 
3717
3760
 
3718
3761
  function getInitialState(props) {
3719
- var activeIndex = getInitialValue(props, 'activeIndex');
3720
- var selectedItems = getInitialValue(props, 'selectedItems');
3762
+ const activeIndex = getInitialValue(props, 'activeIndex');
3763
+ const selectedItems = getInitialValue(props, 'selectedItems');
3721
3764
  return {
3722
- activeIndex: activeIndex,
3723
- selectedItems: selectedItems
3765
+ activeIndex,
3766
+ selectedItems
3724
3767
  };
3725
3768
  }
3726
3769
  /**
@@ -3739,10 +3782,12 @@ function isKeyDownOperationPermitted(event) {
3739
3782
  return false;
3740
3783
  }
3741
3784
 
3742
- var element = event.target;
3785
+ const element = event.target;
3743
3786
 
3744
3787
  if (element instanceof HTMLInputElement && // if element is a text input
3745
- element.value !== '' && (element.selectionStart !== 0 || element.selectionEnd !== 0)) {
3788
+ element.value !== '' && ( // and we have text in it
3789
+ // and cursor is either not at the start or is currently highlighting text.
3790
+ element.selectionStart !== 0 || element.selectionEnd !== 0)) {
3746
3791
  return false;
3747
3792
  }
3748
3793
 
@@ -3757,66 +3802,68 @@ function isKeyDownOperationPermitted(event) {
3757
3802
 
3758
3803
 
3759
3804
  function getA11yRemovalMessage(selectionParameters) {
3760
- var removedSelectedItem = selectionParameters.removedSelectedItem,
3761
- itemToStringLocal = selectionParameters.itemToString;
3805
+ const {
3806
+ removedSelectedItem,
3807
+ itemToString: itemToStringLocal
3808
+ } = selectionParameters;
3762
3809
  return itemToStringLocal(removedSelectedItem) + " has been removed.";
3763
3810
  }
3764
3811
 
3765
- var propTypes = {
3766
- selectedItems: PropTypes__default['default'].array,
3767
- initialSelectedItems: PropTypes__default['default'].array,
3768
- defaultSelectedItems: PropTypes__default['default'].array,
3769
- itemToString: PropTypes__default['default'].func,
3770
- getA11yRemovalMessage: PropTypes__default['default'].func,
3771
- stateReducer: PropTypes__default['default'].func,
3772
- activeIndex: PropTypes__default['default'].number,
3773
- initialActiveIndex: PropTypes__default['default'].number,
3774
- defaultActiveIndex: PropTypes__default['default'].number,
3775
- onActiveIndexChange: PropTypes__default['default'].func,
3776
- onSelectedItemsChange: PropTypes__default['default'].func,
3777
- keyNavigationNext: PropTypes__default['default'].string,
3778
- keyNavigationPrevious: PropTypes__default['default'].string,
3779
- environment: PropTypes__default['default'].shape({
3780
- addEventListener: PropTypes__default['default'].func,
3781
- removeEventListener: PropTypes__default['default'].func,
3782
- document: PropTypes__default['default'].shape({
3783
- getElementById: PropTypes__default['default'].func,
3784
- activeElement: PropTypes__default['default'].any,
3785
- body: PropTypes__default['default'].any
3812
+ const propTypes = {
3813
+ selectedItems: PropTypes__default["default"].array,
3814
+ initialSelectedItems: PropTypes__default["default"].array,
3815
+ defaultSelectedItems: PropTypes__default["default"].array,
3816
+ itemToString: PropTypes__default["default"].func,
3817
+ getA11yRemovalMessage: PropTypes__default["default"].func,
3818
+ stateReducer: PropTypes__default["default"].func,
3819
+ activeIndex: PropTypes__default["default"].number,
3820
+ initialActiveIndex: PropTypes__default["default"].number,
3821
+ defaultActiveIndex: PropTypes__default["default"].number,
3822
+ onActiveIndexChange: PropTypes__default["default"].func,
3823
+ onSelectedItemsChange: PropTypes__default["default"].func,
3824
+ keyNavigationNext: PropTypes__default["default"].string,
3825
+ keyNavigationPrevious: PropTypes__default["default"].string,
3826
+ environment: PropTypes__default["default"].shape({
3827
+ addEventListener: PropTypes__default["default"].func,
3828
+ removeEventListener: PropTypes__default["default"].func,
3829
+ document: PropTypes__default["default"].shape({
3830
+ getElementById: PropTypes__default["default"].func,
3831
+ activeElement: PropTypes__default["default"].any,
3832
+ body: PropTypes__default["default"].any
3786
3833
  })
3787
3834
  })
3788
3835
  };
3789
- var defaultProps = {
3836
+ const defaultProps = {
3790
3837
  itemToString: defaultProps$3.itemToString,
3791
3838
  stateReducer: defaultProps$3.stateReducer,
3792
3839
  environment: defaultProps$3.environment,
3793
- getA11yRemovalMessage: getA11yRemovalMessage,
3840
+ getA11yRemovalMessage,
3794
3841
  keyNavigationNext: 'ArrowRight',
3795
3842
  keyNavigationPrevious: 'ArrowLeft'
3796
3843
  }; // eslint-disable-next-line import/no-mutable-exports
3797
3844
 
3798
- var validatePropTypes = noop;
3845
+ let validatePropTypes = noop;
3799
3846
  /* istanbul ignore next */
3800
3847
 
3801
3848
  if (process.env.NODE_ENV !== 'production') {
3802
- validatePropTypes = function validatePropTypes(options, caller) {
3803
- PropTypes__default['default'].checkPropTypes(propTypes, options, 'prop', caller.name);
3849
+ validatePropTypes = (options, caller) => {
3850
+ PropTypes__default["default"].checkPropTypes(propTypes, options, 'prop', caller.name);
3804
3851
  };
3805
3852
  }
3806
3853
 
3807
- var SelectedItemClick = process.env.NODE_ENV !== "production" ? '__selected_item_click__' : 0;
3808
- var SelectedItemKeyDownDelete = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_delete__' : 1;
3809
- var SelectedItemKeyDownBackspace = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_backspace__' : 2;
3810
- var SelectedItemKeyDownNavigationNext = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_navigation_next__' : 3;
3811
- var SelectedItemKeyDownNavigationPrevious = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_navigation_previous__' : 4;
3812
- var DropdownKeyDownNavigationPrevious = process.env.NODE_ENV !== "production" ? '__dropdown_keydown_navigation_previous__' : 5;
3813
- var DropdownKeyDownBackspace = process.env.NODE_ENV !== "production" ? '__dropdown_keydown_backspace__' : 6;
3814
- var DropdownClick = process.env.NODE_ENV !== "production" ? '__dropdown_click__' : 7;
3815
- var FunctionAddSelectedItem = process.env.NODE_ENV !== "production" ? '__function_add_selected_item__' : 8;
3816
- var FunctionRemoveSelectedItem = process.env.NODE_ENV !== "production" ? '__function_remove_selected_item__' : 9;
3817
- var FunctionSetSelectedItems = process.env.NODE_ENV !== "production" ? '__function_set_selected_items__' : 10;
3818
- var FunctionSetActiveIndex = process.env.NODE_ENV !== "production" ? '__function_set_active_index__' : 11;
3819
- var FunctionReset = process.env.NODE_ENV !== "production" ? '__function_reset__' : 12;
3854
+ const SelectedItemClick = process.env.NODE_ENV !== "production" ? '__selected_item_click__' : 0;
3855
+ const SelectedItemKeyDownDelete = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_delete__' : 1;
3856
+ const SelectedItemKeyDownBackspace = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_backspace__' : 2;
3857
+ const SelectedItemKeyDownNavigationNext = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_navigation_next__' : 3;
3858
+ const SelectedItemKeyDownNavigationPrevious = process.env.NODE_ENV !== "production" ? '__selected_item_keydown_navigation_previous__' : 4;
3859
+ const DropdownKeyDownNavigationPrevious = process.env.NODE_ENV !== "production" ? '__dropdown_keydown_navigation_previous__' : 5;
3860
+ const DropdownKeyDownBackspace = process.env.NODE_ENV !== "production" ? '__dropdown_keydown_backspace__' : 6;
3861
+ const DropdownClick = process.env.NODE_ENV !== "production" ? '__dropdown_click__' : 7;
3862
+ const FunctionAddSelectedItem = process.env.NODE_ENV !== "production" ? '__function_add_selected_item__' : 8;
3863
+ const FunctionRemoveSelectedItem = process.env.NODE_ENV !== "production" ? '__function_remove_selected_item__' : 9;
3864
+ const FunctionSetSelectedItems = process.env.NODE_ENV !== "production" ? '__function_set_selected_items__' : 10;
3865
+ const FunctionSetActiveIndex = process.env.NODE_ENV !== "production" ? '__function_set_active_index__' : 11;
3866
+ const FunctionReset = process.env.NODE_ENV !== "production" ? '__function_reset__' : 12;
3820
3867
 
3821
3868
  var stateChangeTypes = /*#__PURE__*/Object.freeze({
3822
3869
  __proto__: null,
@@ -3838,13 +3885,17 @@ var stateChangeTypes = /*#__PURE__*/Object.freeze({
3838
3885
  /* eslint-disable complexity */
3839
3886
 
3840
3887
  function downshiftMultipleSelectionReducer(state, action) {
3841
- var type = action.type,
3842
- index = action.index,
3843
- props = action.props,
3844
- selectedItem = action.selectedItem;
3845
- var activeIndex = state.activeIndex,
3846
- selectedItems = state.selectedItems;
3847
- var changes;
3888
+ const {
3889
+ type,
3890
+ index,
3891
+ props,
3892
+ selectedItem
3893
+ } = action;
3894
+ const {
3895
+ activeIndex,
3896
+ selectedItems
3897
+ } = state;
3898
+ let changes;
3848
3899
 
3849
3900
  switch (type) {
3850
3901
  case SelectedItemClick:
@@ -3868,7 +3919,7 @@ function downshiftMultipleSelectionReducer(state, action) {
3868
3919
  case SelectedItemKeyDownBackspace:
3869
3920
  case SelectedItemKeyDownDelete:
3870
3921
  {
3871
- var newActiveIndex = activeIndex;
3922
+ let newActiveIndex = activeIndex;
3872
3923
 
3873
3924
  if (selectedItems.length === 1) {
3874
3925
  newActiveIndex = -1;
@@ -3876,11 +3927,12 @@ function downshiftMultipleSelectionReducer(state, action) {
3876
3927
  newActiveIndex = selectedItems.length - 2;
3877
3928
  }
3878
3929
 
3879
- changes = _extends__default['default']({
3880
- selectedItems: [].concat(selectedItems.slice(0, activeIndex), selectedItems.slice(activeIndex + 1))
3881
- }, {
3882
- activeIndex: newActiveIndex
3883
- });
3930
+ changes = {
3931
+ selectedItems: [...selectedItems.slice(0, activeIndex), ...selectedItems.slice(activeIndex + 1)],
3932
+ ...{
3933
+ activeIndex: newActiveIndex
3934
+ }
3935
+ };
3884
3936
  break;
3885
3937
  }
3886
3938
 
@@ -3898,7 +3950,7 @@ function downshiftMultipleSelectionReducer(state, action) {
3898
3950
 
3899
3951
  case FunctionAddSelectedItem:
3900
3952
  changes = {
3901
- selectedItems: [].concat(selectedItems, [selectedItem])
3953
+ selectedItems: [...selectedItems, selectedItem]
3902
3954
  };
3903
3955
  break;
3904
3956
 
@@ -3910,26 +3962,30 @@ function downshiftMultipleSelectionReducer(state, action) {
3910
3962
 
3911
3963
  case FunctionRemoveSelectedItem:
3912
3964
  {
3913
- var _newActiveIndex = activeIndex;
3914
- var selectedItemIndex = selectedItems.indexOf(selectedItem);
3965
+ let newActiveIndex = activeIndex;
3966
+ const selectedItemIndex = selectedItems.indexOf(selectedItem);
3967
+
3968
+ if (selectedItemIndex >= 0) {
3969
+ if (selectedItems.length === 1) {
3970
+ newActiveIndex = -1;
3971
+ } else if (selectedItemIndex === selectedItems.length - 1) {
3972
+ newActiveIndex = selectedItems.length - 2;
3973
+ }
3915
3974
 
3916
- if (selectedItems.length === 1) {
3917
- _newActiveIndex = -1;
3918
- } else if (selectedItemIndex === selectedItems.length - 1) {
3919
- _newActiveIndex = selectedItems.length - 2;
3975
+ changes = {
3976
+ selectedItems: [...selectedItems.slice(0, selectedItemIndex), ...selectedItems.slice(selectedItemIndex + 1)],
3977
+ activeIndex: newActiveIndex
3978
+ };
3920
3979
  }
3921
3980
 
3922
- changes = _extends__default['default']({
3923
- selectedItems: [].concat(selectedItems.slice(0, selectedItemIndex), selectedItems.slice(selectedItemIndex + 1))
3924
- }, {
3925
- activeIndex: _newActiveIndex
3926
- });
3927
3981
  break;
3928
3982
  }
3929
3983
 
3930
3984
  case FunctionSetSelectedItems:
3931
3985
  {
3932
- var newSelectedItems = action.selectedItems;
3986
+ const {
3987
+ selectedItems: newSelectedItems
3988
+ } = action;
3933
3989
  changes = {
3934
3990
  selectedItems: newSelectedItems
3935
3991
  };
@@ -3938,9 +3994,11 @@ function downshiftMultipleSelectionReducer(state, action) {
3938
3994
 
3939
3995
  case FunctionSetActiveIndex:
3940
3996
  {
3941
- var _newActiveIndex2 = action.activeIndex;
3997
+ const {
3998
+ activeIndex: newActiveIndex
3999
+ } = action;
3942
4000
  changes = {
3943
- activeIndex: _newActiveIndex2
4001
+ activeIndex: newActiveIndex
3944
4002
  };
3945
4003
  break;
3946
4004
  }
@@ -3956,11 +4014,11 @@ function downshiftMultipleSelectionReducer(state, action) {
3956
4014
  throw new Error('Reducer called without proper action type.');
3957
4015
  }
3958
4016
 
3959
- return _extends__default['default']({}, state, changes);
4017
+ return { ...state,
4018
+ ...changes
4019
+ };
3960
4020
  }
3961
4021
 
3962
- var _excluded = ["refKey", "ref", "onClick", "onKeyDown", "selectedItem", "index"],
3963
- _excluded2 = ["refKey", "ref", "onKeyDown", "onClick", "preventKeyAction"];
3964
4022
  useMultipleSelection.stateChangeTypes = stateChangeTypes;
3965
4023
 
3966
4024
  function useMultipleSelection(userProps) {
@@ -3970,47 +4028,47 @@ function useMultipleSelection(userProps) {
3970
4028
 
3971
4029
  validatePropTypes(userProps, useMultipleSelection); // Props defaults and destructuring.
3972
4030
 
3973
- var props = _extends__default['default']({}, defaultProps, userProps);
3974
-
3975
- var getA11yRemovalMessage = props.getA11yRemovalMessage,
3976
- itemToString = props.itemToString,
3977
- environment = props.environment,
3978
- keyNavigationNext = props.keyNavigationNext,
3979
- keyNavigationPrevious = props.keyNavigationPrevious; // Reducer init.
3980
-
3981
- var _useControlledReducer = useControlledReducer$1(downshiftMultipleSelectionReducer, getInitialState(props), props),
3982
- state = _useControlledReducer[0],
3983
- dispatch = _useControlledReducer[1];
3984
-
3985
- var activeIndex = state.activeIndex,
3986
- selectedItems = state.selectedItems; // Refs.
3987
-
3988
- var isInitialMountRef = react.useRef(true);
3989
- var dropdownRef = react.useRef(null);
3990
- var previousSelectedItemsRef = react.useRef(selectedItems);
3991
- var selectedItemRefs = react.useRef();
4031
+ const props = { ...defaultProps,
4032
+ ...userProps
4033
+ };
4034
+ const {
4035
+ getA11yRemovalMessage,
4036
+ itemToString,
4037
+ environment,
4038
+ keyNavigationNext,
4039
+ keyNavigationPrevious
4040
+ } = props; // Reducer init.
4041
+
4042
+ const [state, dispatch] = useControlledReducer$1(downshiftMultipleSelectionReducer, getInitialState(props), props);
4043
+ const {
4044
+ activeIndex,
4045
+ selectedItems
4046
+ } = state; // Refs.
4047
+
4048
+ const isInitialMountRef = react.useRef(true);
4049
+ const dropdownRef = react.useRef(null);
4050
+ const previousSelectedItemsRef = react.useRef(selectedItems);
4051
+ const selectedItemRefs = react.useRef();
3992
4052
  selectedItemRefs.current = [];
3993
- var latest = useLatestRef({
3994
- state: state,
3995
- props: props
4053
+ const latest = useLatestRef({
4054
+ state,
4055
+ props
3996
4056
  }); // Effects.
3997
4057
 
3998
4058
  /* Sets a11y status message on changes in selectedItem. */
3999
4059
 
4000
- react.useEffect(function () {
4060
+ react.useEffect(() => {
4001
4061
  if (isInitialMountRef.current) {
4002
4062
  return;
4003
4063
  }
4004
4064
 
4005
4065
  if (selectedItems.length < previousSelectedItemsRef.current.length) {
4006
- var removedSelectedItem = previousSelectedItemsRef.current.find(function (item) {
4007
- return selectedItems.indexOf(item) < 0;
4008
- });
4066
+ const removedSelectedItem = previousSelectedItemsRef.current.find(item => selectedItems.indexOf(item) < 0);
4009
4067
  setStatus(getA11yRemovalMessage({
4010
- itemToString: itemToString,
4068
+ itemToString,
4011
4069
  resultCount: selectedItems.length,
4012
- removedSelectedItem: removedSelectedItem,
4013
- activeIndex: activeIndex,
4070
+ removedSelectedItem,
4071
+ activeIndex,
4014
4072
  activeSelectedItem: selectedItems[activeIndex]
4015
4073
  }), environment.document);
4016
4074
  }
@@ -4018,7 +4076,7 @@ function useMultipleSelection(userProps) {
4018
4076
  previousSelectedItemsRef.current = selectedItems; // eslint-disable-next-line react-hooks/exhaustive-deps
4019
4077
  }, [selectedItems.length]); // Sets focus on active item.
4020
4078
 
4021
- react.useEffect(function () {
4079
+ react.useEffect(() => {
4022
4080
  if (isInitialMountRef.current) {
4023
4081
  return;
4024
4082
  }
@@ -4031,181 +4089,191 @@ function useMultipleSelection(userProps) {
4031
4089
  }, [activeIndex]);
4032
4090
  useControlPropsValidator({
4033
4091
  isInitialMount: isInitialMountRef.current,
4034
- props: props,
4035
- state: state
4092
+ props,
4093
+ state
4036
4094
  });
4037
- var setGetterPropCallInfo = useGetterPropsCalledChecker('getDropdownProps'); // Make initial ref false.
4095
+ const setGetterPropCallInfo = useGetterPropsCalledChecker('getDropdownProps'); // Make initial ref false.
4038
4096
 
4039
- react.useEffect(function () {
4097
+ react.useEffect(() => {
4040
4098
  isInitialMountRef.current = false;
4041
4099
  }, []); // Event handler functions.
4042
4100
 
4043
- var selectedItemKeyDownHandlers = react.useMemo(function () {
4044
- var _ref;
4045
-
4046
- return _ref = {}, _ref[keyNavigationPrevious] = function () {
4101
+ const selectedItemKeyDownHandlers = react.useMemo(() => ({
4102
+ [keyNavigationPrevious]() {
4047
4103
  dispatch({
4048
4104
  type: SelectedItemKeyDownNavigationPrevious
4049
4105
  });
4050
- }, _ref[keyNavigationNext] = function () {
4106
+ },
4107
+
4108
+ [keyNavigationNext]() {
4051
4109
  dispatch({
4052
4110
  type: SelectedItemKeyDownNavigationNext
4053
4111
  });
4054
- }, _ref.Delete = function Delete() {
4112
+ },
4113
+
4114
+ Delete() {
4055
4115
  dispatch({
4056
4116
  type: SelectedItemKeyDownDelete
4057
4117
  });
4058
- }, _ref.Backspace = function Backspace() {
4118
+ },
4119
+
4120
+ Backspace() {
4059
4121
  dispatch({
4060
4122
  type: SelectedItemKeyDownBackspace
4061
4123
  });
4062
- }, _ref;
4063
- }, [dispatch, keyNavigationNext, keyNavigationPrevious]);
4064
- var dropdownKeyDownHandlers = react.useMemo(function () {
4065
- var _ref2;
4124
+ }
4066
4125
 
4067
- return _ref2 = {}, _ref2[keyNavigationPrevious] = function (event) {
4126
+ }), [dispatch, keyNavigationNext, keyNavigationPrevious]);
4127
+ const dropdownKeyDownHandlers = react.useMemo(() => ({
4128
+ [keyNavigationPrevious](event) {
4068
4129
  if (isKeyDownOperationPermitted(event)) {
4069
4130
  dispatch({
4070
4131
  type: DropdownKeyDownNavigationPrevious
4071
4132
  });
4072
4133
  }
4073
- }, _ref2.Backspace = function Backspace(event) {
4134
+ },
4135
+
4136
+ Backspace(event) {
4074
4137
  if (isKeyDownOperationPermitted(event)) {
4075
4138
  dispatch({
4076
4139
  type: DropdownKeyDownBackspace
4077
4140
  });
4078
4141
  }
4079
- }, _ref2;
4080
- }, [dispatch, keyNavigationPrevious]); // Getter props.
4081
-
4082
- var getSelectedItemProps = react.useCallback(function (_temp) {
4083
- var _extends2;
4084
-
4085
- var _ref3 = _temp === void 0 ? {} : _temp,
4086
- _ref3$refKey = _ref3.refKey,
4087
- refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey,
4088
- ref = _ref3.ref,
4089
- onClick = _ref3.onClick,
4090
- onKeyDown = _ref3.onKeyDown,
4091
- selectedItem = _ref3.selectedItem,
4092
- index = _ref3.index,
4093
- rest = _objectWithoutPropertiesLoose__default['default'](_ref3, _excluded);
4142
+ }
4094
4143
 
4095
- var latestState = latest.current.state;
4096
- var itemIndex = getItemIndex(index, selectedItem, latestState.selectedItems);
4144
+ }), [dispatch, keyNavigationPrevious]); // Getter props.
4145
+
4146
+ const getSelectedItemProps = react.useCallback(function (_temp) {
4147
+ let {
4148
+ refKey = 'ref',
4149
+ ref,
4150
+ onClick,
4151
+ onKeyDown,
4152
+ selectedItem,
4153
+ index,
4154
+ ...rest
4155
+ } = _temp === void 0 ? {} : _temp;
4156
+ const {
4157
+ state: latestState
4158
+ } = latest.current;
4159
+ const itemIndex = getItemIndex(index, selectedItem, latestState.selectedItems);
4097
4160
 
4098
4161
  if (itemIndex < 0) {
4099
4162
  throw new Error('Pass either selectedItem or index in getSelectedItemProps!');
4100
4163
  }
4101
4164
 
4102
- var selectedItemHandleClick = function selectedItemHandleClick() {
4165
+ const selectedItemHandleClick = () => {
4103
4166
  dispatch({
4104
4167
  type: SelectedItemClick,
4105
- index: index
4168
+ index
4106
4169
  });
4107
4170
  };
4108
4171
 
4109
- var selectedItemHandleKeyDown = function selectedItemHandleKeyDown(event) {
4110
- var key = normalizeArrowKey(event);
4172
+ const selectedItemHandleKeyDown = event => {
4173
+ const key = normalizeArrowKey(event);
4111
4174
 
4112
4175
  if (key && selectedItemKeyDownHandlers[key]) {
4113
4176
  selectedItemKeyDownHandlers[key](event);
4114
4177
  }
4115
4178
  };
4116
4179
 
4117
- return _extends__default['default']((_extends2 = {}, _extends2[refKey] = handleRefs(ref, function (selectedItemNode) {
4118
- if (selectedItemNode) {
4119
- selectedItemRefs.current.push(selectedItemNode);
4120
- }
4121
- }), _extends2.tabIndex = index === latestState.activeIndex ? 0 : -1, _extends2.onClick = callAllEventHandlers(onClick, selectedItemHandleClick), _extends2.onKeyDown = callAllEventHandlers(onKeyDown, selectedItemHandleKeyDown), _extends2), rest);
4180
+ return {
4181
+ [refKey]: handleRefs(ref, selectedItemNode => {
4182
+ if (selectedItemNode) {
4183
+ selectedItemRefs.current.push(selectedItemNode);
4184
+ }
4185
+ }),
4186
+ tabIndex: index === latestState.activeIndex ? 0 : -1,
4187
+ onClick: callAllEventHandlers(onClick, selectedItemHandleClick),
4188
+ onKeyDown: callAllEventHandlers(onKeyDown, selectedItemHandleKeyDown),
4189
+ ...rest
4190
+ };
4122
4191
  }, [dispatch, latest, selectedItemKeyDownHandlers]);
4123
- var getDropdownProps = react.useCallback(function (_temp2, _temp3) {
4124
- var _extends3;
4125
-
4126
- var _ref4 = _temp2 === void 0 ? {} : _temp2,
4127
- _ref4$refKey = _ref4.refKey,
4128
- refKey = _ref4$refKey === void 0 ? 'ref' : _ref4$refKey,
4129
- ref = _ref4.ref,
4130
- onKeyDown = _ref4.onKeyDown,
4131
- onClick = _ref4.onClick,
4132
- _ref4$preventKeyActio = _ref4.preventKeyAction,
4133
- preventKeyAction = _ref4$preventKeyActio === void 0 ? false : _ref4$preventKeyActio,
4134
- rest = _objectWithoutPropertiesLoose__default['default'](_ref4, _excluded2);
4135
-
4136
- var _ref5 = _temp3 === void 0 ? {} : _temp3,
4137
- _ref5$suppressRefErro = _ref5.suppressRefError,
4138
- suppressRefError = _ref5$suppressRefErro === void 0 ? false : _ref5$suppressRefErro;
4139
-
4192
+ const getDropdownProps = react.useCallback(function (_temp2, _temp3) {
4193
+ let {
4194
+ refKey = 'ref',
4195
+ ref,
4196
+ onKeyDown,
4197
+ onClick,
4198
+ preventKeyAction = false,
4199
+ ...rest
4200
+ } = _temp2 === void 0 ? {} : _temp2;
4201
+ let {
4202
+ suppressRefError = false
4203
+ } = _temp3 === void 0 ? {} : _temp3;
4140
4204
  setGetterPropCallInfo('getDropdownProps', suppressRefError, refKey, dropdownRef);
4141
4205
 
4142
- var dropdownHandleKeyDown = function dropdownHandleKeyDown(event) {
4143
- var key = normalizeArrowKey(event);
4206
+ const dropdownHandleKeyDown = event => {
4207
+ const key = normalizeArrowKey(event);
4144
4208
 
4145
4209
  if (key && dropdownKeyDownHandlers[key]) {
4146
4210
  dropdownKeyDownHandlers[key](event);
4147
4211
  }
4148
4212
  };
4149
4213
 
4150
- var dropdownHandleClick = function dropdownHandleClick() {
4214
+ const dropdownHandleClick = () => {
4151
4215
  dispatch({
4152
4216
  type: DropdownClick
4153
4217
  });
4154
4218
  };
4155
4219
 
4156
- return _extends__default['default']((_extends3 = {}, _extends3[refKey] = handleRefs(ref, function (dropdownNode) {
4157
- if (dropdownNode) {
4158
- dropdownRef.current = dropdownNode;
4159
- }
4160
- }), _extends3), !preventKeyAction && {
4161
- onKeyDown: callAllEventHandlers(onKeyDown, dropdownHandleKeyDown),
4162
- onClick: callAllEventHandlers(onClick, dropdownHandleClick)
4163
- }, rest);
4220
+ return {
4221
+ [refKey]: handleRefs(ref, dropdownNode => {
4222
+ if (dropdownNode) {
4223
+ dropdownRef.current = dropdownNode;
4224
+ }
4225
+ }),
4226
+ ...(!preventKeyAction && {
4227
+ onKeyDown: callAllEventHandlers(onKeyDown, dropdownHandleKeyDown),
4228
+ onClick: callAllEventHandlers(onClick, dropdownHandleClick)
4229
+ }),
4230
+ ...rest
4231
+ };
4164
4232
  }, [dispatch, dropdownKeyDownHandlers, setGetterPropCallInfo]); // returns
4165
4233
 
4166
- var addSelectedItem = react.useCallback(function (selectedItem) {
4234
+ const addSelectedItem = react.useCallback(selectedItem => {
4167
4235
  dispatch({
4168
4236
  type: FunctionAddSelectedItem,
4169
- selectedItem: selectedItem
4237
+ selectedItem
4170
4238
  });
4171
4239
  }, [dispatch]);
4172
- var removeSelectedItem = react.useCallback(function (selectedItem) {
4240
+ const removeSelectedItem = react.useCallback(selectedItem => {
4173
4241
  dispatch({
4174
4242
  type: FunctionRemoveSelectedItem,
4175
- selectedItem: selectedItem
4243
+ selectedItem
4176
4244
  });
4177
4245
  }, [dispatch]);
4178
- var setSelectedItems = react.useCallback(function (newSelectedItems) {
4246
+ const setSelectedItems = react.useCallback(newSelectedItems => {
4179
4247
  dispatch({
4180
4248
  type: FunctionSetSelectedItems,
4181
4249
  selectedItems: newSelectedItems
4182
4250
  });
4183
4251
  }, [dispatch]);
4184
- var setActiveIndex = react.useCallback(function (newActiveIndex) {
4252
+ const setActiveIndex = react.useCallback(newActiveIndex => {
4185
4253
  dispatch({
4186
4254
  type: FunctionSetActiveIndex,
4187
4255
  activeIndex: newActiveIndex
4188
4256
  });
4189
4257
  }, [dispatch]);
4190
- var reset = react.useCallback(function () {
4258
+ const reset = react.useCallback(() => {
4191
4259
  dispatch({
4192
4260
  type: FunctionReset
4193
4261
  });
4194
4262
  }, [dispatch]);
4195
4263
  return {
4196
- getSelectedItemProps: getSelectedItemProps,
4197
- getDropdownProps: getDropdownProps,
4198
- addSelectedItem: addSelectedItem,
4199
- removeSelectedItem: removeSelectedItem,
4200
- setSelectedItems: setSelectedItems,
4201
- setActiveIndex: setActiveIndex,
4202
- reset: reset,
4203
- selectedItems: selectedItems,
4204
- activeIndex: activeIndex
4264
+ getSelectedItemProps,
4265
+ getDropdownProps,
4266
+ addSelectedItem,
4267
+ removeSelectedItem,
4268
+ setSelectedItems,
4269
+ setActiveIndex,
4270
+ reset,
4271
+ selectedItems,
4272
+ activeIndex
4205
4273
  };
4206
4274
  }
4207
4275
 
4208
- exports['default'] = Downshift$1;
4276
+ exports["default"] = Downshift$1;
4209
4277
  exports.resetIdCounter = resetIdCounter;
4210
4278
  exports.useCombobox = useCombobox;
4211
4279
  exports.useMultipleSelection = useMultipleSelection;