@megafon/ui-core 6.0.0-beta.4 → 6.0.0

package/dist/lib/components/Select/Select.js

@@ -1,54 +1,77 @@
 "use strict";
 
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.Verification = exports.SelectTypes = exports.SelectItemsPaddings = void 0;
+exports["default"] = exports.SelectTypes = exports.Verification = exports.SelectItemsPaddings = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-require("core-js/modules/es.array.concat.js");
-require("core-js/modules/es.array.filter.js");
-require("core-js/modules/es.array.find.js");
+
 require("core-js/modules/es.array.find-index.js");
-require("core-js/modules/es.array.map.js");
-require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/es.regexp.constructor.js");
+
 require("core-js/modules/es.regexp.exec.js");
-require("core-js/modules/es.regexp.sticky.js");
-require("core-js/modules/es.regexp.test.js");
-require("core-js/modules/es.regexp.to-string.js");
+
 require("core-js/modules/es.string.replace.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.regexp.constructor.js");
+
+require("core-js/modules/es.regexp.to-string.js");
+
+require("core-js/modules/es.array.find.js");
+
 require("core-js/modules/es.string.split.js");
+
+require("core-js/modules/es.array.map.js");
+
 require("core-js/modules/es.string.trim.js");
-var _react = _interopRequireWildcard(require("react"));
-var React = _react;
+
+require("core-js/modules/es.array.concat.js");
+
+require("core-js/modules/es.object.values.js");
+
+var React = _interopRequireWildcard(require("react"));
+
 var _uiHelpers = require("@megafon/ui-helpers");
+
 var _lodash = _interopRequireDefault(require("lodash.debounce"));
+
+var PropTypes = _interopRequireWildcard(require("prop-types"));
+
 var _selectReducer = _interopRequireWildcard(require("./reducer/selectReducer"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
 var UPDATE_ITEMS_LIST = _selectReducer.SelectActions.UPDATE_ITEMS_LIST,
-  UPDATE_VALUE_FROM_PROPS = _selectReducer.SelectActions.UPDATE_VALUE_FROM_PROPS,
-  COMBOBOX_VALUE_DEBOUNCE = _selectReducer.SelectActions.COMBOBOX_VALUE_DEBOUNCE,
-  COMBOBOX_INPUT_CHANGE = _selectReducer.SelectActions.COMBOBOX_INPUT_CHANGE,
-  TOGGLE_DROPDOWN = _selectReducer.SelectActions.TOGGLE_DROPDOWN,
-  UPDATE_SELECT_VALUE = _selectReducer.SelectActions.UPDATE_SELECT_VALUE,
-  SET_HOVERED_ITEM_INDEX = _selectReducer.SelectActions.SET_HOVERED_ITEM_INDEX;
-var SelectItemsPaddings = exports.SelectItemsPaddings = {
+    UPDATE_VALUE_FROM_PROPS = _selectReducer.SelectActions.UPDATE_VALUE_FROM_PROPS,
+    COMBOBOX_VALUE_DEBOUNCE = _selectReducer.SelectActions.COMBOBOX_VALUE_DEBOUNCE,
+    COMBOBOX_INPUT_CHANGE = _selectReducer.SelectActions.COMBOBOX_INPUT_CHANGE,
+    TOGGLE_DROPDOWN = _selectReducer.SelectActions.TOGGLE_DROPDOWN,
+    UPDATE_SELECT_VALUE = _selectReducer.SelectActions.UPDATE_SELECT_VALUE,
+    SET_HOVERED_ITEM_INDEX = _selectReducer.SelectActions.SET_HOVERED_ITEM_INDEX;
+var SelectItemsPaddings = {
   SMALL: 'small',
   LARGE: 'large'
 };
-var Verification = exports.Verification = {
+exports.SelectItemsPaddings = SelectItemsPaddings;
+var Verification = {
   VALID: 'valid',
   ERROR: 'error'
 };
-var SelectTypes = exports.SelectTypes = {
+exports.Verification = Verification;
+var SelectTypes = {
   CLASSIC: 'classic',
   COMBOBOX: 'combobox'
-};
-// List of cases to check on component change:
+}; // List of cases to check on component change:
 // - Should correctly choose value and trigger callbacks with correct arguments on click or touch.
 // - Should correctly choose value and trigger callbacks with correct arguments on choose via filtration in combobox.
 // - Should highlight chosen item with bold only in cases without view
@@ -60,68 +83,78 @@ var SelectTypes = exports.SelectTypes = {
 // - Should add event listener for outside of dropdown click on list open and remove it on list close.
 // - onClose callback shouldn't fire multiple times on outside click if dropdown was opened multiple times.
 // - If item with currentValue is not found in items, input value will not be displayed
+
+exports.SelectTypes = SelectTypes;
 var cn = (0, _uiHelpers.cnCreate)('mfui-select');
+
 var Select = function Select(_ref) {
   var _ref$type = _ref.type,
-    type = _ref$type === void 0 ? 'classic' : _ref$type,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    verification = _ref.verification,
-    noticeText = _ref.noticeText,
-    label = _ref.label,
-    labelId = _ref.labelId,
-    _ref$required = _ref.required,
-    required = _ref$required === void 0 ? false : _ref$required,
-    _ref$className = _ref.className,
-    className = _ref$className === void 0 ? '' : _ref$className,
-    _ref$classes = _ref.classes,
-    classes = _ref$classes === void 0 ? {} : _ref$classes,
-    dataAttrs = _ref.dataAttrs,
-    _ref$notFoundText = _ref.notFoundText,
-    notFoundText = _ref$notFoundText === void 0 ? 'Ничего не нашлось' : _ref$notFoundText,
-    items = _ref.items,
-    placeholder = _ref.placeholder,
-    currentValue = _ref.currentValue,
-    _ref$shortList = _ref.shortList,
-    shortList = _ref$shortList === void 0 ? false : _ref$shortList,
-    onClosed = _ref.onClosed,
-    onOpened = _ref.onOpened,
-    onSelect = _ref.onSelect;
-  var _useReducer = (0, _react.useReducer)(_selectReducer["default"], _selectReducer.initialState),
-    _useReducer2 = (0, _slicedToArray2["default"])(_useReducer, 2),
-    selectState = _useReducer2[0],
-    changeSelectState = _useReducer2[1];
+      type = _ref$type === void 0 ? 'classic' : _ref$type,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      verification = _ref.verification,
+      noticeText = _ref.noticeText,
+      label = _ref.label,
+      labelId = _ref.labelId,
+      _ref$required = _ref.required,
+      required = _ref$required === void 0 ? false : _ref$required,
+      _ref$className = _ref.className,
+      className = _ref$className === void 0 ? '' : _ref$className,
+      _ref$classes = _ref.classes,
+      classes = _ref$classes === void 0 ? {} : _ref$classes,
+      dataAttrs = _ref.dataAttrs,
+      _ref$notFoundText = _ref.notFoundText,
+      notFoundText = _ref$notFoundText === void 0 ? 'Ничего не нашлось' : _ref$notFoundText,
+      items = _ref.items,
+      placeholder = _ref.placeholder,
+      currentValue = _ref.currentValue,
+      _ref$shortList = _ref.shortList,
+      shortList = _ref$shortList === void 0 ? false : _ref$shortList,
+      onClosed = _ref.onClosed,
+      onOpened = _ref.onOpened,
+      onSelect = _ref.onSelect;
+
+  var _useReducer = (0, React.useReducer)(_selectReducer["default"], _selectReducer.initialState),
+      _useReducer2 = (0, _slicedToArray2["default"])(_useReducer, 2),
+      selectState = _useReducer2[0],
+      changeSelectState = _useReducer2[1];
+
   var itemWrapperNode = React.useRef(null);
   var itemsNodeList = React.useRef([]);
   var selectNode = React.useRef(null);
   var itemsList = selectState.itemsList,
-    filterValue = selectState.comparableInputValue,
-    isOpened = selectState.isOpened,
-    hoveredItemIndex = selectState.hoveredItemIndex,
-    inputValue = selectState.inputValue;
+      filterValue = selectState.comparableInputValue,
+      isOpened = selectState.isOpened,
+      hoveredItemIndex = selectState.hoveredItemIndex,
+      inputValue = selectState.inputValue;
   var isTouch = (0, _uiHelpers.detectTouch)();
   var currentIndex = itemsList.findIndex(function (elem) {
     return elem.value === currentValue;
   });
-  var handleClickOutside = (0, _react.useCallback)(function (e) {
+  var handleClickOutside = (0, React.useCallback)(function (e) {
     var _a;
+
     if (e.target instanceof Node && ((_a = selectNode.current) === null || _a === void 0 ? void 0 : _a.contains(e.target)) || !isOpened) {
       return;
     }
+
     onClosed === null || onClosed === void 0 ? void 0 : onClosed();
     changeSelectState({
       type: TOGGLE_DROPDOWN,
       isOpened: false
     });
   }, [onClosed, isOpened]);
+
   var scrollList = function scrollList(itemIndex) {
     var _a, _b;
+
     (_b = (_a = itemsNodeList.current[itemIndex]) === null || _a === void 0 ? void 0 : _a.scrollIntoView) === null || _b === void 0 ? void 0 : _b.call(_a, {
       behavior: 'smooth',
       block: 'nearest'
     });
   };
-  (0, _react.useEffect)(function () {
+
+  (0, React.useEffect)(function () {
     if (!isOpened) {
       // Changes hovered item on dropdown close to currently chosen to hover it on dropdown open
       changeSelectState({
@@ -130,6 +163,7 @@ var Select = function Select(_ref) {
       });
       return undefined;
     }
+
     onOpened === null || onOpened === void 0 ? void 0 : onOpened();
     scrollList(currentIndex);
     document.addEventListener('click', handleClickOutside);
@@ -137,16 +171,17 @@ var Select = function Select(_ref) {
       document.removeEventListener('click', handleClickOutside);
     };
   }, [isOpened, currentIndex, onOpened, handleClickOutside]);
-  (0, _react.useEffect)(function () {
+  (0, React.useEffect)(function () {
     changeSelectState({
       type: UPDATE_ITEMS_LIST,
       items: items
     });
   }, [items]);
-  (0, _react.useEffect)(function () {
+  (0, React.useEffect)(function () {
     if (currentIndex === -1) {
       return;
     }
+
     changeSelectState({
       type: UPDATE_VALUE_FROM_PROPS,
       hoveredItemIndex: currentIndex,
@@ -160,9 +195,11 @@ var Select = function Select(_ref) {
     });
     var debounceItemsList = items.filter(function (_ref2) {
       var title = _ref2.title;
+
       if (debounceFilterValue.length <= title.length) {
         return RegExp(query, 'ig').test(title);
       }
+
       return false;
     });
     changeSelectState({
@@ -171,6 +208,7 @@ var Select = function Select(_ref) {
       comparableInputValue: debounceFilterValue
     });
   }, 250);
+
   var handleSelectClick = function handleSelectClick() {
     var isCurrentlyOpened = isOpened;
     changeSelectState({
@@ -179,14 +217,17 @@ var Select = function Select(_ref) {
     });
     isCurrentlyOpened && (onClosed === null || onClosed === void 0 ? void 0 : onClosed());
   };
+
   var handleSelectItem = function handleSelectItem(e) {
     var currentItem = itemsList[hoveredItemIndex].value;
     var item = itemsList.find(function (elem) {
       return elem.value === currentItem;
     });
+
     if (!item) {
       return;
     }
+
     var title = item.title;
     changeSelectState({
       type: UPDATE_SELECT_VALUE,
@@ -198,6 +239,7 @@ var Select = function Select(_ref) {
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(e, item);
     onClosed === null || onClosed === void 0 ? void 0 : onClosed();
   };
+
   var handleHoverItem = function handleHoverItem(index) {
     return function (e) {
       e.preventDefault();
@@ -207,16 +249,19 @@ var Select = function Select(_ref) {
       });
     };
   };
+
   var handleComboboxFocus = function handleComboboxFocus(e) {
     e.stopPropagation();
     changeSelectState({
       type: TOGGLE_DROPDOWN,
       isOpened: true
     });
+
     if (!isOpened && itemsList) {
       e.target.select();
     }
   };
+
   var handleChangeCombobox = function handleChangeCombobox(e) {
     var comboboxValue = e.target.value;
     onSelect && onSelect(null);
@@ -226,10 +271,12 @@ var Select = function Select(_ref) {
     });
     debouncedComboboxChange(comboboxValue);
   };
+
   var handleKeyDown = function handleKeyDown(e) {
     if (itemsList.length === 0 || disabled) {
       return true;
     }
+
     if (e.key === 'ArrowDown' && isOpened && hoveredItemIndex < itemsList.length - 1) {
       var nextIndex = hoveredItemIndex + 1;
       e.preventDefault();
@@ -240,8 +287,10 @@ var Select = function Select(_ref) {
       scrollList(nextIndex);
       return false;
     }
+
     if (e.key === 'ArrowUp' && isOpened && hoveredItemIndex > 0) {
       var _nextIndex = hoveredItemIndex - 1;
+
       e.preventDefault();
       changeSelectState({
         type: SET_HOVERED_ITEM_INDEX,
@@ -250,10 +299,12 @@ var Select = function Select(_ref) {
       scrollList(_nextIndex);
       return false;
     }
+
     if (e.key === 'Enter' && isOpened) {
       handleSelectItem(e);
       return false;
     }
+
     if (e.key === 'Enter' && !isOpened) {
       changeSelectState({
         type: TOGGLE_DROPDOWN,
@@ -262,6 +313,7 @@ var Select = function Select(_ref) {
       onOpened === null || onOpened === void 0 ? void 0 : onOpened();
       return false;
     }
+
     if (e.key === 'Tab') {
       changeSelectState({
         type: TOGGLE_DROPDOWN,
@@ -269,8 +321,10 @@ var Select = function Select(_ref) {
       });
       return false;
     }
+
     return true;
   };
+
   var highlightString = function highlightString(title, isItemActive, view) {
     if (type === SelectTypes.CLASSIC) {
       if (typeof view === 'function' && ! /*#__PURE__*/React.isValidElement(view)) {
@@ -279,8 +333,10 @@ var Select = function Select(_ref) {
           isItemActive: isItemActive
         });
       }
+
       return view || title;
     }
+
     if (type === SelectTypes.COMBOBOX && view) {
       if (typeof view === 'function' && ! /*#__PURE__*/React.isValidElement(view)) {
         return view({
@@ -288,24 +344,29 @@ var Select = function Select(_ref) {
           isItemActive: isItemActive
         });
       }
+
       return view;
     }
+
     var stringFragments = title.split(RegExp("(".concat(filterValue, ")"), 'ig'));
     return /*#__PURE__*/React.createElement(React.Fragment, null, stringFragments.map(function (fragment, i) {
-      return /*#__PURE__*/React.createElement(_react.Fragment, {
+      return /*#__PURE__*/React.createElement(React.Fragment, {
         key: i
       }, fragment.toLowerCase() === filterValue.toLowerCase() && fragment !== '' ? /*#__PURE__*/React.createElement("span", {
         className: cn('highlighted-fragment')
       }, fragment) : fragment);
     }));
   };
-  var getNodeList = (0, _react.useCallback)(function (node) {
+
+  var getNodeList = (0, React.useCallback)(function (node) {
     if (filterValue.trim()) {
       itemsNodeList.current = [];
       return;
     }
+
     !filterValue && node && itemsNodeList.current.push(node);
   }, [filterValue]);
+
   var renderLabel = function renderLabel() {
     return /*#__PURE__*/React.createElement("label", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.label), {
       htmlFor: labelId,
@@ -314,14 +375,17 @@ var Select = function Select(_ref) {
       className: cn('require-mark')
     }, "*"));
   };
+
   var renderTitle = function renderTitle() {
     var item = items.find(function (elem) {
       return elem.value === currentValue;
     });
     var inputTitle = placeholder;
+
     if (item && item.title) {
       inputTitle = item.selectedView ? item.selectedView : item.title;
     }
+
     return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.title), {
       className: cn('title', [classes === null || classes === void 0 ? void 0 : classes.title]),
       role: "button",
@@ -335,6 +399,7 @@ var Select = function Select(_ref) {
       className: cn('title-value')
     }, inputTitle), label && renderLabel()));
   };
+
   var renderCombobox = function renderCombobox() {
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("input", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input), {
       className: cn('combobox', {
@@ -347,6 +412,7 @@ var Select = function Select(_ref) {
       placeholder: placeholder
     })), label && renderLabel());
   };
+
   var renderChildren = function renderChildren() {
     var currentItems = type === SelectTypes.COMBOBOX ? itemsList : items;
     return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.list), {
@@ -358,10 +424,10 @@ var Select = function Select(_ref) {
       ref: itemWrapperNode
     }), currentItems.map(function (_ref3, i) {
       var title = _ref3.title,
-        value = _ref3.value,
-        view = _ref3.view,
-        _ref3$paddings = _ref3.paddings,
-        paddings = _ref3$paddings === void 0 ? SelectItemsPaddings.LARGE : _ref3$paddings;
+          value = _ref3.value,
+          view = _ref3.view,
+          _ref3$paddings = _ref3.paddings,
+          paddings = _ref3$paddings === void 0 ? SelectItemsPaddings.LARGE : _ref3$paddings;
       var isItemActive = currentValue === value;
       return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.listItem, i + 1), {
         className: cn('list-item', {
@@ -381,6 +447,7 @@ var Select = function Select(_ref) {
       className: cn('not-found')
     }), notFoundText)));
   };
+
   return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       open: isOpened,
@@ -404,4 +471,54 @@ var Select = function Select(_ref) {
     })
   }), noticeText));
 };
-var _default = exports["default"] = Select;
+
+Select.propTypes = {
+  type: PropTypes.oneOf(Object.values(SelectTypes)),
+  label: PropTypes.string,
+  id: PropTypes.string,
+  currentValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  verification: PropTypes.oneOf(Object.values(Verification)),
+  noticeText: PropTypes.string,
+  disabled: PropTypes.bool,
+  required: PropTypes.bool,
+  placeholder: PropTypes.string,
+  notFoundText: PropTypes.string,
+  className: PropTypes.string,
+  classes: PropTypes.shape({
+    root: PropTypes.string,
+    control: PropTypes.string,
+    title: PropTypes.string,
+    titleInner: PropTypes.string,
+    list: PropTypes.string,
+    listInner: PropTypes.string,
+    listItem: PropTypes.string,
+    listItemTitle: PropTypes.string
+  }),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    label: PropTypes.objectOf(PropTypes.string.isRequired),
+    control: PropTypes.objectOf(PropTypes.string.isRequired),
+    title: PropTypes.objectOf(PropTypes.string.isRequired),
+    titleInner: PropTypes.objectOf(PropTypes.string.isRequired),
+    input: PropTypes.objectOf(PropTypes.string.isRequired),
+    noticeText: PropTypes.objectOf(PropTypes.string.isRequired),
+    list: PropTypes.objectOf(PropTypes.string.isRequired),
+    listInner: PropTypes.objectOf(PropTypes.string.isRequired),
+    listItem: PropTypes.objectOf(PropTypes.string.isRequired),
+    listItemTitle: PropTypes.objectOf(PropTypes.string.isRequired),
+    notFound: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
+  items: PropTypes.arrayOf(PropTypes.exact({
+    view: PropTypes.oneOfType([PropTypes.string, PropTypes.element, PropTypes.func]),
+    selectedView: PropTypes.oneOfType([PropTypes.string, PropTypes.element, PropTypes.func]),
+    title: PropTypes.string.isRequired,
+    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+    paddings: PropTypes.oneOf(Object.values(SelectItemsPaddings))
+  })).isRequired,
+  shortList: PropTypes.bool,
+  onSelect: PropTypes.func,
+  onOpened: PropTypes.func,
+  onClosed: PropTypes.func
+};
+var _default = Select;
+exports["default"] = _default;

package/dist/lib/components/Select/reducer/selectReducer.d.ts

@@ -30,5 +30,5 @@ export interface ISelectAction<T extends SelectItemValueType> {
     comparableInputValue?: string;
     isOpened?: boolean;
 }
-declare const selectReducer: <T extends SelectItemValueType>(state: ISelectState<T>, action: ISelectAction<T>) => ISelectState<T>;
+declare const selectReducer: <T extends string | number | undefined>(state: ISelectState<T>, action: ISelectAction<T>) => ISelectState<T>;
 export default selectReducer;

package/dist/lib/components/Select/reducer/selectReducer.js

@@ -3,29 +3,37 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.initialState = exports["default"] = exports.SelectActions = void 0;
+exports["default"] = exports.SelectActions = exports.initialState = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 require("core-js/modules/es.array.every.js");
-require("core-js/modules/es.object.to-string.js");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
 var isEqualItems = function isEqualItems(newItems, setItems) {
   if (newItems.length !== setItems.length) {
     return false;
   }
+
   return newItems.every(function (item, i) {
     var isEqualValue = item.value === setItems[i].value;
     var isEqualTitle = item.title === setItems[i].title;
     return isEqualValue && isEqualTitle;
   });
 };
-var initialState = exports.initialState = {
+
+var initialState = {
   isOpened: false,
   hoveredItemIndex: 0,
   itemsList: [],
   comparableInputValue: '',
   inputValue: ''
 };
+exports.initialState = initialState;
 var SelectActions;
+exports.SelectActions = SelectActions;
+
 (function (SelectActions) {
   SelectActions["TOGGLE_DROPDOWN"] = "TOGGLE_DROPDOWN";
   SelectActions["UPDATE_ITEMS_LIST"] = "UPDATE_ITEMS_LIST";
@@ -35,27 +43,30 @@ var SelectActions;
   SelectActions["COMBOBOX_VALUE_DEBOUNCE"] = "COMBOBOX_VALUE_DEBOUNCE";
   SelectActions["COMBOBOX_INPUT_CHANGE"] = "COMBOBOX_INPUT_CHANGE";
 })(SelectActions || (exports.SelectActions = SelectActions = {}));
+
 var _SelectActions = SelectActions,
-  TOGGLE_DROPDOWN = _SelectActions.TOGGLE_DROPDOWN,
-  UPDATE_ITEMS_LIST = _SelectActions.UPDATE_ITEMS_LIST,
-  UPDATE_VALUE_FROM_PROPS = _SelectActions.UPDATE_VALUE_FROM_PROPS,
-  UPDATE_SELECT_VALUE = _SelectActions.UPDATE_SELECT_VALUE,
-  SET_HOVERED_ITEM_INDEX = _SelectActions.SET_HOVERED_ITEM_INDEX,
-  COMBOBOX_VALUE_DEBOUNCE = _SelectActions.COMBOBOX_VALUE_DEBOUNCE,
-  COMBOBOX_INPUT_CHANGE = _SelectActions.COMBOBOX_INPUT_CHANGE;
+    TOGGLE_DROPDOWN = _SelectActions.TOGGLE_DROPDOWN,
+    UPDATE_ITEMS_LIST = _SelectActions.UPDATE_ITEMS_LIST,
+    UPDATE_VALUE_FROM_PROPS = _SelectActions.UPDATE_VALUE_FROM_PROPS,
+    UPDATE_SELECT_VALUE = _SelectActions.UPDATE_SELECT_VALUE,
+    SET_HOVERED_ITEM_INDEX = _SelectActions.SET_HOVERED_ITEM_INDEX,
+    COMBOBOX_VALUE_DEBOUNCE = _SelectActions.COMBOBOX_VALUE_DEBOUNCE,
+    COMBOBOX_INPUT_CHANGE = _SelectActions.COMBOBOX_INPUT_CHANGE;
+
 var selectReducer = function selectReducer(state, action) {
   var type = action.type,
-    _action$items = action.items,
-    items = _action$items === void 0 ? [] : _action$items,
-    _action$hoveredItemIn = action.hoveredItemIndex,
-    hoveredItemIndex = _action$hoveredItemIn === void 0 ? 0 : _action$hoveredItemIn,
-    _action$inputValue = action.inputValue,
-    inputValue = _action$inputValue === void 0 ? '' : _action$inputValue,
-    _action$comparableInp = action.comparableInputValue,
-    comparableInputValue = _action$comparableInp === void 0 ? '' : _action$comparableInp,
-    _action$isOpened = action.isOpened,
-    isOpened = _action$isOpened === void 0 ? false : _action$isOpened;
+      _action$items = action.items,
+      items = _action$items === void 0 ? [] : _action$items,
+      _action$hoveredItemIn = action.hoveredItemIndex,
+      hoveredItemIndex = _action$hoveredItemIn === void 0 ? 0 : _action$hoveredItemIn,
+      _action$inputValue = action.inputValue,
+      inputValue = _action$inputValue === void 0 ? '' : _action$inputValue,
+      _action$comparableInp = action.comparableInputValue,
+      comparableInputValue = _action$comparableInp === void 0 ? '' : _action$comparableInp,
+      _action$isOpened = action.isOpened,
+      isOpened = _action$isOpened === void 0 ? false : _action$isOpened;
   var prevItems = state.itemsList;
+
   switch (type) {
     case TOGGLE_DROPDOWN:
       {
@@ -63,6 +74,7 @@ var selectReducer = function selectReducer(state, action) {
           isOpened: isOpened
         });
       }
+
     case UPDATE_ITEMS_LIST:
       {
         var isItemsEqual = isEqualItems(items, prevItems);
@@ -70,6 +82,7 @@ var selectReducer = function selectReducer(state, action) {
           itemsList: items
         });
       }
+
     case UPDATE_VALUE_FROM_PROPS:
       {
         return (0, _extends2["default"])((0, _extends2["default"])({}, state), {
@@ -78,6 +91,7 @@ var selectReducer = function selectReducer(state, action) {
           comparableInputValue: ''
         });
       }
+
     case COMBOBOX_VALUE_DEBOUNCE:
       {
         return (0, _extends2["default"])((0, _extends2["default"])({}, state), {
@@ -87,6 +101,7 @@ var selectReducer = function selectReducer(state, action) {
           hoveredItemIndex: 0
         });
       }
+
     case UPDATE_SELECT_VALUE:
       {
         return (0, _extends2["default"])((0, _extends2["default"])({}, state), {
@@ -95,22 +110,27 @@ var selectReducer = function selectReducer(state, action) {
           hoveredItemIndex: hoveredItemIndex
         });
       }
+
     case SET_HOVERED_ITEM_INDEX:
       {
         return (0, _extends2["default"])((0, _extends2["default"])({}, state), {
           hoveredItemIndex: hoveredItemIndex
         });
       }
+
     case COMBOBOX_INPUT_CHANGE:
       {
         return (0, _extends2["default"])((0, _extends2["default"])({}, state), {
           inputValue: inputValue
         });
       }
+
     default:
       {
         return state;
       }
   }
 };
-var _default = exports["default"] = selectReducer;
+
+var _default = selectReducer;
+exports["default"] = _default;