@jetbrains/ring-ui 5.0.155 → 5.0.157

package/dist/list/list.js

@@ -1,4 +1,16 @@
-import React, { Component, cloneElement } from 'react';
+import { c as _defineProperty, j as _inherits, k as _createSuper, b as _classCallCheck, m as _assertThisInitialized, h as _objectWithoutProperties, _ as _createClass, a as _objectSpread2 } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.includes.js';
+import 'core-js/modules/es.string.includes.js';
+import 'core-js/modules/es.array.map.js';
+import 'core-js/modules/es.array.concat.js';
+import 'core-js/modules/es.symbol.js';
+import 'core-js/modules/es.symbol.description.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.array.find-index.js';
+import 'core-js/modules/es.object.assign.js';
+import 'core-js/modules/es.object.keys.js';
+import 'core-js/modules/es.array.find.js';
+import React, { cloneElement, Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import VirtualizedList from 'react-virtualized/dist/es/List';
@@ -22,17 +34,36 @@ import ListSeparator from './list__separator.js';
 import ListHint from './list__hint.js';
 import { Type, Dimension, DEFAULT_ITEM_TYPE } from './consts.js';
 import { m as modules_3b67a421 } from '../_helpers/list.js';
+import 'core-js/modules/es.array.reduce.js';
+import 'core-js/modules/es.object.entries.js';
+import 'core-js/modules/es.regexp.to-string.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.map.js';
+import 'core-js/modules/es.string.iterator.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.weak-map.js';
+import 'core-js/modules/web.dom-collections.for-each.js';
+import 'core-js/modules/es.array.filter.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.split.js';
+import 'core-js/modules/es.set.js';
 import '../shortcuts/core.js';
+import 'core-js/modules/es.array.slice.js';
+import 'core-js/modules/es.array.splice.js';
+import 'core-js/modules/es.string.match.js';
 import 'combokeys';
 import '../global/sniffer.js';
 import 'sniffr';
-import '../_helpers/_rollupPluginBabelHelpers.js';
 import '../link/link.js';
 import '../link/clickableLink.js';
 import '../_helpers/link.js';
+import 'core-js/modules/es.number.constructor.js';
+import 'core-js/modules/es.array.index-of.js';
 import '../avatar/avatar.js';
 import '../global/url.js';
+import 'core-js/modules/es.string.replace.js';
 import '../avatar/fallback-avatar.js';
+import 'core-js/modules/es.array.from.js';
 import '../checkbox/checkbox.js';
 import '@jetbrains/icons/checkmark-14px';
 import '@jetbrains/icons/remove-14px';
@@ -40,33 +71,39 @@ import '../icon/icon.js';
 import '../icon/icon__constants.js';
 import '../_helpers/icon.js';
 import '../icon/icon__svg.js';
+import 'core-js/modules/es.string.starts-with.js';
 import '../global/prop-types.js';
 import '../global/composeRefs.js';
 import '../_helpers/checkbox.js';
 import '../global/get-event-key.js';
 
+var _excluded = ["selectedLabel", "originalModel"];
 function noop() {}
-const warnEmptyKey = deprecate(() => {}, 'No key passed for list item with non-string label. It is considered as a bad practice and has been deprecated, please provide a key.');
+var warnEmptyKey = deprecate(function () {}, 'No key passed for list item with non-string label. It is considered as a bad practice and has been deprecated, please provide a key.');
 /**
  * @param {Type} listItemType
  * @param {Object} item list item
  */
 function isItemType(listItemType, item) {
-  let type = item.rgItemType;
+  var type = item.rgItemType;
   if (type == null) {
     type = DEFAULT_ITEM_TYPE;
   }
   return type === listItemType;
 }
-const nonActivatableTypes = [Type.SEPARATOR, Type.TITLE, Type.MARGIN];
+var nonActivatableTypes = [Type.SEPARATOR, Type.TITLE, Type.MARGIN];
 function isActivatable(item) {
   return item != null && !nonActivatableTypes.includes(item.rgItemType) && !item.disabled;
 }
 function getDataHash(data) {
-  return data.map(it => it.key).join('-');
+  return data.map(function (it) {
+    return it.key;
+  }).join('-');
 }
-const shouldActivateFirstItem = props => props.activateFirstItem || props.activateSingleItem && props.data.length === 1;
-const ActiveItemContext = createStatefulContext(undefined, 'ActiveItem');
+var shouldActivateFirstItem = function shouldActivateFirstItem(props) {
+  return props.activateFirstItem || props.activateSingleItem && props.data.length === 1;
+};
+var ActiveItemContext = createStatefulContext(undefined, 'ActiveItem');
 /**
  * @name List
  * @constructor
@@ -75,636 +112,693 @@ const ActiveItemContext = createStatefulContext(undefined, 'ActiveItem');
 /**
  * Displays a list of items.
  */
-class List extends Component {
-  static propTypes = {
-    id: PropTypes.string,
-    className: PropTypes.string,
-    hint: PropTypes.node,
-    hintOnSelection: PropTypes.string,
-    data: PropTypes.array,
-    maxHeight: PropTypes.number,
-    activeIndex: PropTypes.number,
-    restoreActiveIndex: PropTypes.bool,
-    activateSingleItem: PropTypes.bool,
-    activateFirstItem: PropTypes.bool,
-    shortcuts: PropTypes.bool,
-    onMouseOut: PropTypes.func,
-    onSelect: PropTypes.func,
-    onScrollToBottom: PropTypes.func,
-    onResize: PropTypes.func,
-    useMouseUp: PropTypes.bool,
-    visible: PropTypes.bool,
-    renderOptimization: PropTypes.bool,
-    disableMoveOverflow: PropTypes.bool,
-    disableMoveDownOverflow: PropTypes.bool,
-    compact: PropTypes.bool,
-    disableScrollToActive: PropTypes.bool,
-    hidden: PropTypes.bool,
-    ariaLabel: PropTypes.string
-  };
-  static defaultProps = {
-    data: [],
-    restoreActiveIndex: false,
-    activateSingleItem: false,
-    activateFirstItem: false,
-    onMouseOut: noop,
-    onSelect: noop,
-    onScrollToBottom: noop,
-    onResize: noop,
-    shortcuts: false,
-    renderOptimization: true,
-    disableMoveDownOverflow: false,
-    ariaLabel: 'List'
-  };
-  state = {
-    activeIndex: null,
-    prevActiveIndex: null,
-    prevData: [],
-    activeItem: null,
-    needScrollToActive: false,
-    scrolling: false,
-    hasOverflow: false,
-    disabledHover: false,
-    scrolledToBottom: false
-  };
-  static getDerivedStateFromProps(nextProps, prevState) {
-    const {
-      prevActiveIndex,
-      prevData,
-      activeItem
-    } = prevState;
-    const {
-      data,
-      activeIndex,
-      restoreActiveIndex
-    } = nextProps;
-    const nextState = {
-      prevActiveIndex: activeIndex,
-      prevData: data
-    };
-    if (data !== prevData) {
-      Object.assign(nextState, {
-        activeIndex: null,
-        activeItem: null
-      });
+var List = /*#__PURE__*/function (_Component) {
+  _inherits(List, _Component);
+  var _super = _createSuper(List);
+  function List() {
+    var _this;
+    _classCallCheck(this, List);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
     }
-    if (activeIndex != null && activeIndex !== prevActiveIndex && data[activeIndex] != null) {
-      Object.assign(nextState, {
-        activeIndex,
-        activeItem: data[activeIndex],
-        needScrollToActive: true
-      });
-    } else if (data !== prevData && restoreActiveIndex && activeItem != null && activeItem.key != null) {
-      // Restore active index if there is an item with the same "key" property
-      const index = data.findIndex(item => item.key === activeItem.key);
-      if (index >= 0) {
-        Object.assign(nextState, {
-          activeIndex: index,
-          activeItem: data[index]
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "state", {
+      activeIndex: null,
+      prevActiveIndex: null,
+      prevData: [],
+      activeItem: null,
+      needScrollToActive: false,
+      scrolling: false,
+      hasOverflow: false,
+      disabledHover: false,
+      scrolledToBottom: false
+    });
+    _defineProperty(_assertThisInitialized(_this), "scheduleScrollListener", scheduleRAF());
+    _defineProperty(_assertThisInitialized(_this), "scheduleHoverListener", scheduleRAF());
+    _defineProperty(_assertThisInitialized(_this), "virtualizedList", void 0);
+    _defineProperty(_assertThisInitialized(_this), "unmounted", void 0);
+    _defineProperty(_assertThisInitialized(_this), "container", void 0);
+    _defineProperty(_assertThisInitialized(_this), "hoverHandler", memoize(function (index) {
+      return function () {
+        return _this.scheduleHoverListener(function () {
+          if (_this.state.disabledHover) {
+            return;
+          }
+          if (_this.container) {
+            _this.setState({
+              activeIndex: index,
+              activeItem: _this.props.data[index],
+              needScrollToActive: false
+            });
+          }
         });
-      }
-    }
-    return nextState;
-  }
-  componentDidMount() {
-    document.addEventListener('mousemove', this.onDocumentMouseMove);
-    document.addEventListener('keydown', this.onDocumentKeyDown, true);
-    if (this.props.activeIndex == null && shouldActivateFirstItem(this.props)) {
-      this.activateFirst();
-    }
-  }
-  shouldComponentUpdate(nextProps, nextState) {
-    return nextProps !== this.props || Object.keys(nextState).some(key => nextState[key] !== this.state[key]);
-  }
-  componentDidUpdate(prevProps) {
-    if (this.virtualizedList && prevProps.data !== this.props.data) {
-      this.virtualizedList.recomputeRowHeights();
-    }
-    if (this.props.activeIndex == null && getDataHash(this.props.data) !== getDataHash(prevProps.data) && shouldActivateFirstItem(this.props)) {
-      this.activateFirst();
-    }
-    this.checkOverflow();
-  }
-  componentWillUnmount() {
-    this.unmounted = true;
-    document.removeEventListener('mousemove', this.onDocumentMouseMove);
-    document.removeEventListener('keydown', this.onDocumentKeyDown, true);
-  }
-  scheduleScrollListener = scheduleRAF();
-  scheduleHoverListener = scheduleRAF();
-  static isItemType = isItemType;
-  static ListHint = ListHint;
-  static ListProps = {
-    Type,
-    Dimension
-  };
-  virtualizedList;
-  unmounted;
-  container;
-  hoverHandler = memoize(index => () => this.scheduleHoverListener(() => {
-    if (this.state.disabledHover) {
-      return;
-    }
-    if (this.container) {
-      this.setState({
-        activeIndex: index,
-        activeItem: this.props.data[index],
-        needScrollToActive: false
-      });
-    }
-  }));
-  _activatableItems = false;
-  // eslint-disable-next-line @typescript-eslint/no-magic-numbers
-  _bufferSize = 10; // keep X items above and below of the visible area
-  // reuse size cache for similar items
-  sizeCacheKey = index => {
-    if (index === 0 || index === this.props.data.length + 1) {
-      return Type.MARGIN;
-    }
-    const item = this.props.data[index - 1];
-    const isFirst = index === 1;
-    switch (item.rgItemType) {
-      case Type.SEPARATOR:
-      case Type.TITLE:
-        return `${item.rgItemType}${isFirst ? '_first' : ''}${item.description ? '_desc' : ''}`;
-      case Type.MARGIN:
+      };
+    }));
+    _defineProperty(_assertThisInitialized(_this), "_activatableItems", false);
+    // eslint-disable-next-line @typescript-eslint/no-magic-numbers
+    _defineProperty(_assertThisInitialized(_this), "_bufferSize", 10);
+    // keep X items above and below of the visible area
+    // reuse size cache for similar items
+    _defineProperty(_assertThisInitialized(_this), "sizeCacheKey", function (index) {
+      if (index === 0 || index === _this.props.data.length + 1) {
         return Type.MARGIN;
-      case Type.CUSTOM:
-        return `${Type.CUSTOM}_${item.key}`;
-      case Type.ITEM:
-      case Type.LINK:
-      default:
-        if (item.details) {
-          return `${Type.ITEM}_${item.details}`;
-        }
-        return Type.ITEM;
-    }
-  };
-  _cache = new CellMeasurerCache({
-    defaultHeight: this.defaultItemHeight(),
-    fixedWidth: true,
-    keyMapper: this.sizeCacheKey
-  });
-  _hasActivatableItems = memoizeOne(items => items.some(isActivatable));
-  hasActivatableItems() {
-    return this._hasActivatableItems(this.props.data);
-  }
-  activateFirst = () => {
-    const firstActivatableIndex = this.props.data.findIndex(isActivatable);
-    if (firstActivatableIndex >= 0) {
-      this.setState({
-        activeIndex: firstActivatableIndex,
-        activeItem: this.props.data[firstActivatableIndex],
-        needScrollToActive: true
-      });
-    }
-  };
-  selectHandler = memoize(index => {
-    var _this = this;
-    return function (event) {
-      let tryKeepOpen = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-      const item = _this.props.data[index];
-      if (!_this.props.useMouseUp && item.onClick) {
-        item.onClick(item, event);
-      } else if (_this.props.useMouseUp && item.onMouseUp) {
-        item.onMouseUp(item, event);
       }
-      if (_this.props.onSelect) {
-        _this.props.onSelect(item, event, {
-          tryKeepOpen
+      var item = _this.props.data[index - 1];
+      var isFirst = index === 1;
+      switch (item.rgItemType) {
+        case Type.SEPARATOR:
+        case Type.TITLE:
+          return "".concat(item.rgItemType).concat(isFirst ? '_first' : '').concat(item.description ? '_desc' : '');
+        case Type.MARGIN:
+          return Type.MARGIN;
+        case Type.CUSTOM:
+          return "".concat(Type.CUSTOM, "_").concat(item.key);
+        case Type.ITEM:
+        case Type.LINK:
+        default:
+          if (item.details) {
+            return "".concat(Type.ITEM, "_").concat(item.details);
+          }
+          return Type.ITEM;
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "_cache", new CellMeasurerCache({
+      defaultHeight: _this.defaultItemHeight(),
+      fixedWidth: true,
+      keyMapper: _this.sizeCacheKey
+    }));
+    _defineProperty(_assertThisInitialized(_this), "_hasActivatableItems", memoizeOne(function (items) {
+      return items.some(isActivatable);
+    }));
+    _defineProperty(_assertThisInitialized(_this), "activateFirst", function () {
+      var firstActivatableIndex = _this.props.data.findIndex(isActivatable);
+      if (firstActivatableIndex >= 0) {
+        _this.setState({
+          activeIndex: firstActivatableIndex,
+          activeItem: _this.props.data[firstActivatableIndex],
+          needScrollToActive: true
         });
       }
-    };
-  });
-  checkboxHandler = memoize(index => event => this.selectHandler(index)(event, true));
-  upHandler = e => {
-    const {
-      data,
-      disableMoveOverflow
-    } = this.props;
-    const index = this.state.activeIndex;
-    let newIndex;
-    if (index === null || index === 0) {
-      if (!disableMoveOverflow) {
-        newIndex = data.length - 1;
+    });
+    _defineProperty(_assertThisInitialized(_this), "selectHandler", memoize(function (index) {
+      return function (event) {
+        var tryKeepOpen = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+        var item = _this.props.data[index];
+        if (!_this.props.useMouseUp && item.onClick) {
+          item.onClick(item, event);
+        } else if (_this.props.useMouseUp && item.onMouseUp) {
+          item.onMouseUp(item, event);
+        }
+        if (_this.props.onSelect) {
+          _this.props.onSelect(item, event, {
+            tryKeepOpen: tryKeepOpen
+          });
+        }
+      };
+    }));
+    _defineProperty(_assertThisInitialized(_this), "checkboxHandler", memoize(function (index) {
+      return function (event) {
+        return _this.selectHandler(index)(event, true);
+      };
+    }));
+    _defineProperty(_assertThisInitialized(_this), "upHandler", function (e) {
+      var _this$props = _this.props,
+        data = _this$props.data,
+        disableMoveOverflow = _this$props.disableMoveOverflow;
+      var index = _this.state.activeIndex;
+      var newIndex;
+      if (index === null || index === 0) {
+        if (!disableMoveOverflow) {
+          newIndex = data.length - 1;
+        } else {
+          return;
+        }
       } else {
-        return;
+        newIndex = index - 1;
       }
-    } else {
-      newIndex = index - 1;
-    }
-    this.moveHandler(newIndex, this.upHandler, e);
-  };
-  downHandler = e => {
-    const {
-      data,
-      disableMoveOverflow,
-      disableMoveDownOverflow
-    } = this.props;
-    const index = this.state.activeIndex;
-    let newIndex;
-    if (index === null) {
-      newIndex = 0;
-    } else if (index + 1 === data.length) {
-      if (!disableMoveOverflow && !disableMoveDownOverflow) {
+      _this.moveHandler(newIndex, _this.upHandler, e);
+    });
+    _defineProperty(_assertThisInitialized(_this), "downHandler", function (e) {
+      var _this$props2 = _this.props,
+        data = _this$props2.data,
+        disableMoveOverflow = _this$props2.disableMoveOverflow,
+        disableMoveDownOverflow = _this$props2.disableMoveDownOverflow;
+      var index = _this.state.activeIndex;
+      var newIndex;
+      if (index === null) {
         newIndex = 0;
+      } else if (index + 1 === data.length) {
+        if (!disableMoveOverflow && !disableMoveDownOverflow) {
+          newIndex = 0;
+        } else {
+          return;
+        }
       } else {
-        return;
+        newIndex = index + 1;
       }
-    } else {
-      newIndex = index + 1;
-    }
-    this.moveHandler(newIndex, this.downHandler, e);
-  };
-  homeHandler = e => {
-    this.moveHandler(0, this.downHandler, e);
-  };
-  endHandler = e => {
-    this.moveHandler(this.props.data.length - 1, this.upHandler, e);
-  };
-  onDocumentMouseMove = () => {
-    if (this.state.disabledHover) {
-      this.setState({
-        disabledHover: false
-      });
-    }
-  };
-  onDocumentKeyDown = e => {
-    const metaKeys = [16, 17, 18, 19, 20, 91]; // eslint-disable-line @typescript-eslint/no-magic-numbers
-    if (!this.state.disabledHover && !metaKeys.includes(e.keyCode)) {
-      this.setState({
-        disabledHover: true
-      });
-    }
-  };
-  moveHandler(index, retryCallback, e) {
-    let correctedIndex;
-    if (this.props.data.length === 0 || !this.hasActivatableItems()) {
-      return;
-    } else if (this.props.data.length < index) {
-      correctedIndex = 0;
-    } else {
-      correctedIndex = index;
-    }
-    const item = this.props.data[correctedIndex];
-    this.setState({
-      activeIndex: correctedIndex,
-      activeItem: item,
-      needScrollToActive: true
-    }, function onSet() {
-      if (!isActivatable(item)) {
-        retryCallback(e);
-        return;
+      _this.moveHandler(newIndex, _this.downHandler, e);
+    });
+    _defineProperty(_assertThisInitialized(_this), "homeHandler", function (e) {
+      _this.moveHandler(0, _this.downHandler, e);
+    });
+    _defineProperty(_assertThisInitialized(_this), "endHandler", function (e) {
+      _this.moveHandler(_this.props.data.length - 1, _this.upHandler, e);
+    });
+    _defineProperty(_assertThisInitialized(_this), "onDocumentMouseMove", function () {
+      if (_this.state.disabledHover) {
+        _this.setState({
+          disabledHover: false
+        });
       }
-      if (e.key !== 'Home' && e.key !== 'End') {
-        preventDefault(e);
+    });
+    _defineProperty(_assertThisInitialized(_this), "onDocumentKeyDown", function (e) {
+      var metaKeys = [16, 17, 18, 19, 20, 91]; // eslint-disable-line @typescript-eslint/no-magic-numbers
+      if (!_this.state.disabledHover && !metaKeys.includes(e.keyCode)) {
+        _this.setState({
+          disabledHover: true
+        });
       }
     });
-  }
-  mouseHandler = () => {
-    this.setState({
-      scrolling: false
+    _defineProperty(_assertThisInitialized(_this), "mouseHandler", function () {
+      _this.setState({
+        scrolling: false
+      });
     });
-  };
-  scrollHandler = () => {
-    this.setState({
-      scrolling: true
-    }, this.scrollEndHandler);
-  };
-  enterHandler = (event, shortcut) => {
-    if (this.state.activeIndex !== null) {
-      const item = this.props.data[this.state.activeIndex];
-      this.selectHandler(this.state.activeIndex)(event);
-      if (item.href && !event.defaultPrevented) {
-        if (shortcut != null && ['command+enter', 'ctrl+enter'].includes(shortcut)) {
-          window.open(item.href, '_blank');
-        } else if (shortcut === 'shift+enter') {
-          window.open(item.href);
-        } else {
-          window.location.href = item.href;
+    _defineProperty(_assertThisInitialized(_this), "scrollHandler", function () {
+      _this.setState({
+        scrolling: true
+      }, _this.scrollEndHandler);
+    });
+    _defineProperty(_assertThisInitialized(_this), "enterHandler", function (event, shortcut) {
+      if (_this.state.activeIndex !== null) {
+        var item = _this.props.data[_this.state.activeIndex];
+        _this.selectHandler(_this.state.activeIndex)(event);
+        if (item.href && !event.defaultPrevented) {
+          if (shortcut != null && ['command+enter', 'ctrl+enter'].includes(shortcut)) {
+            window.open(item.href, '_blank');
+          } else if (shortcut === 'shift+enter') {
+            window.open(item.href);
+          } else {
+            window.location.href = item.href;
+          }
         }
+        return false; // do not propagate event
+      } else {
+        return true; // propagate event to the parent component (e.g., QueryAssist)
       }
-      return false; // do not propagate event
-    } else {
-      return true; // propagate event to the parent component (e.g., QueryAssist)
-    }
-  };
-
-  getFirst() {
-    return this.props.data.find(item => item.rgItemType === Type.ITEM || item.rgItemType === Type.CUSTOM);
-  }
-  getSelected() {
-    return this.state.activeIndex != null ? this.props.data[this.state.activeIndex] : null;
-  }
-  clearSelected = () => {
-    this.setState({
-      activeIndex: null,
-      needScrollToActive: false
     });
-  };
-  defaultItemHeight() {
-    return this.props.compact ? Dimension.COMPACT_ITEM_HEIGHT : Dimension.ITEM_HEIGHT;
-  }
-  scrollEndHandler = () => this.scheduleScrollListener(() => {
-    const innerContainer = this.inner;
-    if (innerContainer) {
-      const maxScrollingPosition = innerContainer.scrollHeight;
-      const sensitivity = this.defaultItemHeight() / 2;
-      const currentScrollingPosition = innerContainer.scrollTop + innerContainer.clientHeight + sensitivity;
-      const scrolledToBottom = maxScrollingPosition > 0 && currentScrollingPosition >= maxScrollingPosition;
-      if (!this.unmounted) {
-        this.setState({
-          scrolledToBottom
+    _defineProperty(_assertThisInitialized(_this), "clearSelected", function () {
+      _this.setState({
+        activeIndex: null,
+        needScrollToActive: false
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "scrollEndHandler", function () {
+      return _this.scheduleScrollListener(function () {
+        var innerContainer = _this.inner;
+        if (innerContainer) {
+          var maxScrollingPosition = innerContainer.scrollHeight;
+          var sensitivity = _this.defaultItemHeight() / 2;
+          var currentScrollingPosition = innerContainer.scrollTop + innerContainer.clientHeight + sensitivity;
+          var scrolledToBottom = maxScrollingPosition > 0 && currentScrollingPosition >= maxScrollingPosition;
+          if (!_this.unmounted) {
+            _this.setState({
+              scrolledToBottom: scrolledToBottom
+            });
+          }
+          if (scrolledToBottom) {
+            _this.props.onScrollToBottom();
+          }
+        }
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "checkOverflow", function () {
+      if (_this.inner) {
+        _this.setState({
+          hasOverflow: _this.inner.scrollHeight - _this.inner.clientHeight > 1
         });
       }
-      if (scrolledToBottom) {
-        this.props.onScrollToBottom();
+    });
+    _defineProperty(_assertThisInitialized(_this), "renderItem", function (_ref) {
+      var _ref$index = _ref.index,
+        index = _ref$index === void 0 ? 1 : _ref$index,
+        style = _ref.style,
+        _ref$isScrolling = _ref.isScrolling,
+        isScrolling = _ref$isScrolling === void 0 ? false : _ref$isScrolling,
+        parent = _ref.parent,
+        key = _ref.key;
+      var itemKey;
+      var el;
+      var realIndex = index - 1;
+      var item = _this.props.data[realIndex];
+      var itemId = _this.getId(item);
+      // top and bottom margins
+      if (index === 0 || index === _this.props.data.length + 1 || item.rgItemType === Type.MARGIN) {
+        itemKey = key || "".concat(Type.MARGIN, "_").concat(index);
+        el = /*#__PURE__*/React.createElement("div", {
+          style: {
+            height: Dimension.MARGIN
+          }
+        });
+      } else {
+        // Hack around SelectNG implementation
+        item.selectedLabel;
+          item.originalModel;
+          var restProps = _objectWithoutProperties(item, _excluded);
+        var cleanedProps = restProps;
+        if (cleanedProps.url) {
+          cleanedProps.href = cleanedProps.url;
+        }
+        if (cleanedProps.href) {
+          cleanedProps.rgItemType = Type.LINK;
+        }
+        var itemProps = Object.assign({
+          rgItemType: DEFAULT_ITEM_TYPE
+        }, restProps);
+        itemKey = key || itemId;
+        itemProps.hover = realIndex === _this.state.activeIndex;
+        if (itemProps.hoverClassName != null && itemProps.hover) {
+          itemProps.className = classNames(itemProps.className, itemProps.hoverClassName);
+        }
+        itemProps.onMouseOver = _this.hoverHandler(realIndex);
+        itemProps.tabIndex = -1;
+        itemProps.scrolling = isScrolling;
+        var selectHandler = _this.selectHandler(realIndex);
+        if (_this.props.useMouseUp) {
+          itemProps.onMouseUp = selectHandler;
+        } else {
+          itemProps.onClick = selectHandler;
+        }
+        itemProps.onCheckboxChange = _this.checkboxHandler(realIndex);
+        if (itemProps.compact == null) {
+          itemProps.compact = _this.props.compact;
+        }
+        var ItemComponent;
+        var isFirst = index === 1;
+        switch (itemProps.rgItemType) {
+          case Type.SEPARATOR:
+            ItemComponent = ListSeparator;
+            itemProps.isFirst = isFirst;
+            break;
+          case Type.LINK:
+            ItemComponent = ListLink;
+            _this.addItemDataTestToProp(itemProps);
+            break;
+          case Type.ITEM:
+            ItemComponent = ListItem;
+            _this.addItemDataTestToProp(itemProps);
+            break;
+          case Type.CUSTOM:
+            ItemComponent = ListCustom;
+            _this.addItemDataTestToProp(itemProps);
+            break;
+          case Type.TITLE:
+            itemProps.isFirst = isFirst;
+            ItemComponent = ListTitle;
+            break;
+          default:
+            throw new Error("Unknown menu element type: ".concat(itemProps.rgItemType));
+        }
+        el = /*#__PURE__*/React.createElement(ItemComponent, itemProps);
       }
-    }
-  });
-  checkOverflow = () => {
-    if (this.inner) {
-      this.setState({
-        hasOverflow: this.inner.scrollHeight - this.inner.clientHeight > 1
-      });
-    }
-  };
-  getVisibleListHeight(maxHeight) {
-    return maxHeight - this.defaultItemHeight() - Dimension.INNER_PADDING;
+      return parent ? /*#__PURE__*/React.createElement(CellMeasurer, {
+        cache: _this._cache,
+        key: itemKey,
+        parent: parent,
+        rowIndex: index,
+        columnIndex: 0
+      }, function (_ref2) {
+        var registerChild = _ref2.registerChild;
+        return /*#__PURE__*/React.createElement("div", {
+          ref: registerChild,
+          style: style,
+          role: "row",
+          id: itemId
+        }, /*#__PURE__*/React.createElement("div", {
+          role: "cell"
+        }, el));
+      }) : /*#__PURE__*/React.createElement("div", {
+        role: "row",
+        id: itemId,
+        key: itemKey
+      }, /*#__PURE__*/React.createElement("div", {
+        role: "cell"
+      }, /*#__PURE__*/cloneElement(el)));
+    });
+    _defineProperty(_assertThisInitialized(_this), "addItemDataTestToProp", function (props) {
+      props['data-test'] = joinDataTestAttributes('ring-list-item', props['data-test']);
+      return props;
+    });
+    _defineProperty(_assertThisInitialized(_this), "virtualizedListRef", function (el) {
+      _this.virtualizedList = el;
+    });
+    _defineProperty(_assertThisInitialized(_this), "containerRef", function (el) {
+      _this.container = el;
+    });
+    _defineProperty(_assertThisInitialized(_this), "_inner", void 0);
+    _defineProperty(_assertThisInitialized(_this), "id", getUID('list-'));
+    _defineProperty(_assertThisInitialized(_this), "shortcutsScope", _this.id);
+    _defineProperty(_assertThisInitialized(_this), "shortcutsMap", {
+      up: _this.upHandler,
+      down: _this.downHandler,
+      home: _this.homeHandler,
+      end: _this.endHandler,
+      enter: _this.enterHandler,
+      'meta+enter': _this.enterHandler,
+      'ctrl+enter': _this.enterHandler,
+      'command+enter': _this.enterHandler,
+      'shift+enter': _this.enterHandler
+    });
+    return _this;
   }
-  _deprecatedGenerateKeyFromContent(itemProps) {
-    const identificator = itemProps.label || itemProps.description;
-    const isString = typeof identificator === 'string' || identificator instanceof String;
-    if (identificator && !isString) {
-      warnEmptyKey();
-      `${itemProps.rgItemType}_${JSON.stringify(identificator)}`;
+  _createClass(List, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      document.addEventListener('mousemove', this.onDocumentMouseMove);
+      document.addEventListener('keydown', this.onDocumentKeyDown, true);
+      if (this.props.activeIndex == null && shouldActivateFirstItem(this.props)) {
+        this.activateFirst();
+      }
     }
-    return `${itemProps.rgItemType}_${identificator}`;
-  }
-  getId(item) {
-    return item != null ? `${this.id}:${item.key || this._deprecatedGenerateKeyFromContent(item)}` : undefined;
-  }
-  renderItem = _ref => {
-    let {
-      index = 1,
-      style,
-      isScrolling = false,
-      parent,
-      key
-    } = _ref;
-    let itemKey;
-    let el;
-    const realIndex = index - 1;
-    const item = this.props.data[realIndex];
-    const itemId = this.getId(item);
-    // top and bottom margins
-    if (index === 0 || index === this.props.data.length + 1 || item.rgItemType === Type.MARGIN) {
-      itemKey = key || `${Type.MARGIN}_${index}`;
-      el = /*#__PURE__*/React.createElement("div", {
-        style: {
-          height: Dimension.MARGIN
-        }
+  }, {
+    key: "shouldComponentUpdate",
+    value: function shouldComponentUpdate(nextProps, nextState) {
+      var _this2 = this;
+      return nextProps !== this.props || Object.keys(nextState).some(function (key) {
+        return nextState[key] !== _this2.state[key];
       });
-    } else {
-      // Hack around SelectNG implementation
-      const {
-        selectedLabel,
-        originalModel,
-        ...restProps
-      } = item;
-      const cleanedProps = restProps;
-      if (cleanedProps.url) {
-        cleanedProps.href = cleanedProps.url;
-      }
-      if (cleanedProps.href) {
-        cleanedProps.rgItemType = Type.LINK;
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      if (this.virtualizedList && prevProps.data !== this.props.data) {
+        this.virtualizedList.recomputeRowHeights();
       }
-      const itemProps = Object.assign({
-        rgItemType: DEFAULT_ITEM_TYPE
-      }, restProps);
-      itemKey = key || itemId;
-      itemProps.hover = realIndex === this.state.activeIndex;
-      if (itemProps.hoverClassName != null && itemProps.hover) {
-        itemProps.className = classNames(itemProps.className, itemProps.hoverClassName);
+      if (this.props.activeIndex == null && getDataHash(this.props.data) !== getDataHash(prevProps.data) && shouldActivateFirstItem(this.props)) {
+        this.activateFirst();
       }
-      itemProps.onMouseOver = this.hoverHandler(realIndex);
-      itemProps.tabIndex = -1;
-      itemProps.scrolling = isScrolling;
-      const selectHandler = this.selectHandler(realIndex);
-      if (this.props.useMouseUp) {
-        itemProps.onMouseUp = selectHandler;
+      this.checkOverflow();
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.unmounted = true;
+      document.removeEventListener('mousemove', this.onDocumentMouseMove);
+      document.removeEventListener('keydown', this.onDocumentKeyDown, true);
+    }
+  }, {
+    key: "hasActivatableItems",
+    value: function hasActivatableItems() {
+      return this._hasActivatableItems(this.props.data);
+    }
+  }, {
+    key: "moveHandler",
+    value: function moveHandler(index, retryCallback, e) {
+      var correctedIndex;
+      if (this.props.data.length === 0 || !this.hasActivatableItems()) {
+        return;
+      } else if (this.props.data.length < index) {
+        correctedIndex = 0;
       } else {
-        itemProps.onClick = selectHandler;
+        correctedIndex = index;
       }
-      itemProps.onCheckboxChange = this.checkboxHandler(realIndex);
-      if (itemProps.compact == null) {
-        itemProps.compact = this.props.compact;
+      var item = this.props.data[correctedIndex];
+      this.setState({
+        activeIndex: correctedIndex,
+        activeItem: item,
+        needScrollToActive: true
+      }, function onSet() {
+        if (!isActivatable(item)) {
+          retryCallback(e);
+          return;
+        }
+        if (e.key !== 'Home' && e.key !== 'End') {
+          preventDefault(e);
+        }
+      });
+    }
+  }, {
+    key: "getFirst",
+    value: function getFirst() {
+      return this.props.data.find(function (item) {
+        return item.rgItemType === Type.ITEM || item.rgItemType === Type.CUSTOM;
+      });
+    }
+  }, {
+    key: "getSelected",
+    value: function getSelected() {
+      return this.state.activeIndex != null ? this.props.data[this.state.activeIndex] : null;
+    }
+  }, {
+    key: "defaultItemHeight",
+    value: function defaultItemHeight() {
+      return this.props.compact ? Dimension.COMPACT_ITEM_HEIGHT : Dimension.ITEM_HEIGHT;
+    }
+  }, {
+    key: "getVisibleListHeight",
+    value: function getVisibleListHeight(maxHeight) {
+      return maxHeight - this.defaultItemHeight() - Dimension.INNER_PADDING;
+    }
+  }, {
+    key: "_deprecatedGenerateKeyFromContent",
+    value: function _deprecatedGenerateKeyFromContent(itemProps) {
+      var identificator = itemProps.label || itemProps.description;
+      var isString = typeof identificator === 'string' || identificator instanceof String;
+      if (identificator && !isString) {
+        warnEmptyKey();
+        "".concat(itemProps.rgItemType, "_").concat(JSON.stringify(identificator));
       }
-      let ItemComponent;
-      const isFirst = index === 1;
-      switch (itemProps.rgItemType) {
-        case Type.SEPARATOR:
-          ItemComponent = ListSeparator;
-          itemProps.isFirst = isFirst;
-          break;
-        case Type.LINK:
-          ItemComponent = ListLink;
-          this.addItemDataTestToProp(itemProps);
-          break;
-        case Type.ITEM:
-          ItemComponent = ListItem;
-          this.addItemDataTestToProp(itemProps);
-          break;
-        case Type.CUSTOM:
-          ItemComponent = ListCustom;
-          this.addItemDataTestToProp(itemProps);
-          break;
-        case Type.TITLE:
-          itemProps.isFirst = isFirst;
-          ItemComponent = ListTitle;
-          break;
-        default:
-          throw new Error(`Unknown menu element type: ${itemProps.rgItemType}`);
+      return "".concat(itemProps.rgItemType, "_").concat(identificator);
+    }
+  }, {
+    key: "getId",
+    value: function getId(item) {
+      return item != null ? "".concat(this.id, ":").concat(item.key || this._deprecatedGenerateKeyFromContent(item)) : undefined;
+    }
+  }, {
+    key: "inner",
+    get: function get() {
+      if (!this._inner) {
+        this._inner = this.container && this.container.querySelector('.ring-list__i');
       }
-      el = /*#__PURE__*/React.createElement(ItemComponent, itemProps);
+      return this._inner;
     }
-    return parent ? /*#__PURE__*/React.createElement(CellMeasurer, {
-      cache: this._cache,
-      key: itemKey,
-      parent: parent,
-      rowIndex: index,
-      columnIndex: 0
-    }, _ref2 => {
-      let {
-        registerChild
-      } = _ref2;
-      return /*#__PURE__*/React.createElement("div", {
-        ref: registerChild,
-        style: style,
-        role: "row",
-        id: itemId
-      }, /*#__PURE__*/React.createElement("div", {
-        role: "cell"
-      }, el));
-    }) : /*#__PURE__*/React.createElement("div", {
-      role: "row",
-      id: itemId,
-      key: itemKey
-    }, /*#__PURE__*/React.createElement("div", {
-      role: "cell"
-    }, /*#__PURE__*/cloneElement(el)));
-  };
-  addItemDataTestToProp = props => {
-    props['data-test'] = joinDataTestAttributes('ring-list-item', props['data-test']);
-    return props;
-  };
-  virtualizedListRef = el => {
-    this.virtualizedList = el;
-  };
-  containerRef = el => {
-    this.container = el;
-  };
-  _inner;
-  get inner() {
-    if (!this._inner) {
-      this._inner = this.container && this.container.querySelector('.ring-list__i');
+  }, {
+    key: "renderVirtualizedInner",
+    value: function renderVirtualizedInner(_ref3) {
+      var _this3 = this;
+      var height = _ref3.height,
+        maxHeight = _ref3.maxHeight,
+        _ref3$autoHeight = _ref3.autoHeight,
+        autoHeight = _ref3$autoHeight === void 0 ? false : _ref3$autoHeight,
+        rowCount = _ref3.rowCount,
+        isScrolling = _ref3.isScrolling,
+        _ref3$onChildScroll = _ref3.onChildScroll,
+        onChildScroll = _ref3$onChildScroll === void 0 ? noop : _ref3$onChildScroll,
+        scrollTop = _ref3.scrollTop,
+        registerChild = _ref3.registerChild;
+      var dirOverride = {
+        direction: 'inherit'
+      }; // Virtualized sets "direction: ltr" by default https://github.com/bvaughn/react-virtualized/issues/457
+      return /*#__PURE__*/React.createElement(AutoSizer, {
+        disableHeight: true,
+        onResize: this.props.onResize
+      }, function (_ref4) {
+        var width = _ref4.width;
+        return /*#__PURE__*/React.createElement("div", {
+          ref: registerChild
+        }, /*#__PURE__*/React.createElement(VirtualizedList, {
+          "aria-label": _this3.props.ariaLabel,
+          ref: _this3.virtualizedListRef,
+          className: "ring-list__i",
+          autoHeight: autoHeight,
+          style: maxHeight ? _objectSpread2({
+            maxHeight: maxHeight,
+            height: 'auto'
+          }, dirOverride) : dirOverride,
+          autoContainerWidth: true,
+          height: height,
+          width: width,
+          isScrolling: isScrolling,
+          onScroll: function onScroll(e) {
+            onChildScroll(e);
+            _this3.scrollEndHandler();
+          },
+          scrollTop: scrollTop,
+          rowCount: rowCount,
+          estimatedRowSize: _this3.defaultItemHeight(),
+          rowHeight: _this3._cache.rowHeight,
+          rowRenderer: _this3.renderItem,
+          overscanRowCount: _this3._bufferSize
+          // ensure rerendering
+          ,
+          noop: function noop() {},
+          scrollToIndex: !_this3.props.disableScrollToActive && _this3.state.needScrollToActive && _this3.state.activeIndex != null ? _this3.state.activeIndex + 1 : undefined,
+          scrollToAlignment: "center",
+          deferredMeasurementCache: _this3._cache,
+          onRowsRendered: _this3.checkOverflow
+        }));
+      });
     }
-    return this._inner;
-  }
-  renderVirtualizedInner(_ref3) {
-    let {
-      height,
-      maxHeight,
-      autoHeight = false,
-      rowCount,
-      isScrolling,
-      onChildScroll = noop,
-      scrollTop,
-      registerChild
-    } = _ref3;
-    const dirOverride = {
-      direction: 'inherit'
-    }; // Virtualized sets "direction: ltr" by default https://github.com/bvaughn/react-virtualized/issues/457
-    return /*#__PURE__*/React.createElement(AutoSizer, {
-      disableHeight: true,
-      onResize: this.props.onResize
-    }, _ref4 => {
-      let {
-        width
-      } = _ref4;
+  }, {
+    key: "renderVirtualized",
+    value: function renderVirtualized(maxHeight, rowCount) {
+      var _this4 = this;
+      if (maxHeight) {
+        return this.renderVirtualizedInner({
+          height: maxHeight,
+          maxHeight: maxHeight,
+          rowCount: rowCount
+        });
+      }
+      return /*#__PURE__*/React.createElement(WindowScroller, null, function (props) {
+        return _this4.renderVirtualizedInner(_objectSpread2(_objectSpread2({}, props), {}, {
+          rowCount: rowCount,
+          autoHeight: true
+        }));
+      });
+    }
+  }, {
+    key: "renderSimple",
+    value: function renderSimple(maxHeight, rowCount) {
+      var items = [];
+      for (var index = 0; index < rowCount; index++) {
+        items.push(this.renderItem({
+          index: index,
+          isScrolling: this.state.scrolling
+        }));
+      }
       return /*#__PURE__*/React.createElement("div", {
-        ref: registerChild
-      }, /*#__PURE__*/React.createElement(VirtualizedList, {
+        className: classNames('ring-list__i', modules_3b67a421.simpleInner),
+        onScroll: this.scrollHandler,
+        onMouseMove: this.mouseHandler
+      }, /*#__PURE__*/React.createElement("div", {
         "aria-label": this.props.ariaLabel,
-        ref: this.virtualizedListRef,
-        className: "ring-list__i",
-        autoHeight: autoHeight,
+        role: "grid",
         style: maxHeight ? {
-          maxHeight,
-          height: 'auto',
-          ...dirOverride
-        } : dirOverride,
-        autoContainerWidth: true,
-        height: height,
-        width: width,
-        isScrolling: isScrolling,
-        onScroll: e => {
-          onChildScroll(e);
-          this.scrollEndHandler();
-        },
-        scrollTop: scrollTop,
-        rowCount: rowCount,
-        estimatedRowSize: this.defaultItemHeight(),
-        rowHeight: this._cache.rowHeight,
-        rowRenderer: this.renderItem,
-        overscanRowCount: this._bufferSize
-        // ensure rerendering
-        ,
-        noop: () => {},
-        scrollToIndex: !this.props.disableScrollToActive && this.state.needScrollToActive && this.state.activeIndex != null ? this.state.activeIndex + 1 : undefined,
-        scrollToAlignment: "center",
-        deferredMeasurementCache: this._cache,
-        onRowsRendered: this.checkOverflow
-      }));
-    });
-  }
-  renderVirtualized(maxHeight, rowCount) {
-    if (maxHeight) {
-      return this.renderVirtualizedInner({
-        height: maxHeight,
-        maxHeight,
-        rowCount
-      });
+          maxHeight: this.getVisibleListHeight(maxHeight)
+        } : undefined
+      }, items));
     }
-    return /*#__PURE__*/React.createElement(WindowScroller, null, props => this.renderVirtualizedInner({
-      ...props,
-      rowCount,
-      autoHeight: true
-    }));
-  }
-  renderSimple(maxHeight, rowCount) {
-    const items = [];
-    for (let index = 0; index < rowCount; index++) {
-      items.push(this.renderItem({
-        index,
-        isScrolling: this.state.scrolling
-      }));
+  }, {
+    key: "render",
+    value: /** @override */
+    function render() {
+      var hint = this.getSelected() && this.props.hintOnSelection || this.props.hint;
+      var fadeStyles = hint ? {
+        bottom: Dimension.ITEM_HEIGHT
+      } : undefined;
+      var rowCount = this.props.data.length + 2;
+      var maxHeight = this.props.maxHeight && this.getVisibleListHeight(this.props.maxHeight);
+      var classes = classNames(modules_3b67a421.list, this.props.className);
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ActiveItemContext.Updater, {
+        value: this.getId(this.state.activeItem),
+        skipUpdate: this.props.hidden || !isActivatable(this.state.activeItem)
+      }), /*#__PURE__*/React.createElement("div", {
+        id: this.props.id,
+        ref: this.containerRef,
+        className: classes,
+        onMouseOut: this.props.onMouseOut,
+        onBlur: this.props.onMouseOut,
+        onMouseLeave: this.clearSelected,
+        "data-test": "ring-list"
+      }, this.props.shortcuts && /*#__PURE__*/React.createElement(Shortcuts, {
+        map: this.shortcutsMap,
+        scope: this.shortcutsScope
+      }), this.props.renderOptimization ? this.renderVirtualized(maxHeight, rowCount) : this.renderSimple(maxHeight, rowCount), this.state.hasOverflow && !this.state.scrolledToBottom && /*#__PURE__*/React.createElement("div", {
+        className: modules_3b67a421.fade,
+        style: fadeStyles
+      }), hint && /*#__PURE__*/React.createElement(ListHint, {
+        label: hint
+      })));
     }
-    return /*#__PURE__*/React.createElement("div", {
-      className: classNames('ring-list__i', modules_3b67a421.simpleInner),
-      onScroll: this.scrollHandler,
-      onMouseMove: this.mouseHandler
-    }, /*#__PURE__*/React.createElement("div", {
-      "aria-label": this.props.ariaLabel,
-      role: "grid",
-      style: maxHeight ? {
-        maxHeight: this.getVisibleListHeight(maxHeight)
-      } : undefined
-    }, items));
-  }
-  id = getUID('list-');
-  shortcutsScope = this.id;
-  shortcutsMap = {
-    up: this.upHandler,
-    down: this.downHandler,
-    home: this.homeHandler,
-    end: this.endHandler,
-    enter: this.enterHandler,
-    'meta+enter': this.enterHandler,
-    'ctrl+enter': this.enterHandler,
-    'command+enter': this.enterHandler,
-    'shift+enter': this.enterHandler
-  };
-  /** @override */
-  render() {
-    const hint = this.getSelected() && this.props.hintOnSelection || this.props.hint;
-    const fadeStyles = hint ? {
-      bottom: Dimension.ITEM_HEIGHT
-    } : undefined;
-    const rowCount = this.props.data.length + 2;
-    const maxHeight = this.props.maxHeight && this.getVisibleListHeight(this.props.maxHeight);
-    const classes = classNames(modules_3b67a421.list, this.props.className);
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ActiveItemContext.Updater, {
-      value: this.getId(this.state.activeItem),
-      skipUpdate: this.props.hidden || !isActivatable(this.state.activeItem)
-    }), /*#__PURE__*/React.createElement("div", {
-      id: this.props.id,
-      ref: this.containerRef,
-      className: classes,
-      onMouseOut: this.props.onMouseOut,
-      onBlur: this.props.onMouseOut,
-      onMouseLeave: this.clearSelected,
-      "data-test": "ring-list"
-    }, this.props.shortcuts && /*#__PURE__*/React.createElement(Shortcuts, {
-      map: this.shortcutsMap,
-      scope: this.shortcutsScope
-    }), this.props.renderOptimization ? this.renderVirtualized(maxHeight, rowCount) : this.renderSimple(maxHeight, rowCount), this.state.hasOverflow && !this.state.scrolledToBottom && /*#__PURE__*/React.createElement("div", {
-      className: modules_3b67a421.fade,
-      style: fadeStyles
-    }), hint && /*#__PURE__*/React.createElement(ListHint, {
-      label: hint
-    })));
-  }
-}
+  }], [{
+    key: "getDerivedStateFromProps",
+    value: function getDerivedStateFromProps(nextProps, prevState) {
+      var prevActiveIndex = prevState.prevActiveIndex,
+        prevData = prevState.prevData,
+        activeItem = prevState.activeItem;
+      var data = nextProps.data,
+        activeIndex = nextProps.activeIndex,
+        restoreActiveIndex = nextProps.restoreActiveIndex;
+      var nextState = {
+        prevActiveIndex: activeIndex,
+        prevData: data
+      };
+      if (data !== prevData) {
+        Object.assign(nextState, {
+          activeIndex: null,
+          activeItem: null
+        });
+      }
+      if (activeIndex != null && activeIndex !== prevActiveIndex && data[activeIndex] != null) {
+        Object.assign(nextState, {
+          activeIndex: activeIndex,
+          activeItem: data[activeIndex],
+          needScrollToActive: true
+        });
+      } else if (data !== prevData && restoreActiveIndex && activeItem != null && activeItem.key != null) {
+        // Restore active index if there is an item with the same "key" property
+        var index = data.findIndex(function (item) {
+          return item.key === activeItem.key;
+        });
+        if (index >= 0) {
+          Object.assign(nextState, {
+            activeIndex: index,
+            activeItem: data[index]
+          });
+        }
+      }
+      return nextState;
+    }
+  }]);
+  return List;
+}(Component);
+_defineProperty(List, "propTypes", {
+  id: PropTypes.string,
+  className: PropTypes.string,
+  hint: PropTypes.node,
+  hintOnSelection: PropTypes.string,
+  data: PropTypes.array,
+  maxHeight: PropTypes.number,
+  activeIndex: PropTypes.number,
+  restoreActiveIndex: PropTypes.bool,
+  activateSingleItem: PropTypes.bool,
+  activateFirstItem: PropTypes.bool,
+  shortcuts: PropTypes.bool,
+  onMouseOut: PropTypes.func,
+  onSelect: PropTypes.func,
+  onScrollToBottom: PropTypes.func,
+  onResize: PropTypes.func,
+  useMouseUp: PropTypes.bool,
+  visible: PropTypes.bool,
+  renderOptimization: PropTypes.bool,
+  disableMoveOverflow: PropTypes.bool,
+  disableMoveDownOverflow: PropTypes.bool,
+  compact: PropTypes.bool,
+  disableScrollToActive: PropTypes.bool,
+  hidden: PropTypes.bool,
+  ariaLabel: PropTypes.string
+});
+_defineProperty(List, "defaultProps", {
+  data: [],
+  restoreActiveIndex: false,
+  activateSingleItem: false,
+  activateFirstItem: false,
+  onMouseOut: noop,
+  onSelect: noop,
+  onScrollToBottom: noop,
+  onResize: noop,
+  shortcuts: false,
+  renderOptimization: true,
+  disableMoveDownOverflow: false,
+  ariaLabel: 'List'
+});
+_defineProperty(List, "isItemType", isItemType);
+_defineProperty(List, "ListHint", ListHint);
+_defineProperty(List, "ListProps", {
+  Type: Type,
+  Dimension: Dimension
+});
 
 export { ActiveItemContext, List as default };