@alfalab/core-components 45.9.0-beta.0 → 45.9.0-beta.2

package/select/cssm/components/options-list/Component.js

@@ -1,72 +1,81 @@
-import React, { forwardRef, useState, useCallback, useRef } from 'react';
-import mergeRefs from 'react-merge-refs';
-import cn from 'classnames';
-import { useMatchMedia } from '../../../../mq/cssm';
-import { Scrollbar } from '../../../../scrollbar/cssm';
-import { isClient } from '../../../../shared/cssm';
-import { SIZE_TO_CLASSNAME_MAP, DEFAULT_VISIBLE_OPTIONS } from '../../consts.js';
-import { useVisibleOptions, isGroup } from '../../utils.js';
-import { Optgroup } from '../optgroup/Component.js';
-import styles from './index.module.css';
-import '../optgroup/index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const createCounter = () => {
-    let count = 0;
+var tslib = require('tslib');
+var React = require('react');
+var mergeRefs = require('react-merge-refs');
+var cn = require('classnames');
+var coreComponentsMq = require('../../../../mq/cssm');
+var coreComponentsScrollbar = require('../../../../scrollbar/cssm');
+var coreComponentsShared = require('../../../../shared/cssm');
+var consts = require('../../consts.js');
+var utils = require('../../utils.js');
+var components_optgroup_Component = require('../optgroup/Component.js');
+var styles = require('./index.module.css');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var createCounter = function () {
+    var count = 0;
     // eslint-disable-next-line no-plusplus
-    return () => count++;
+    return function () { return count++; };
 };
-const OptionsList = forwardRef(({ size = 48, className, optionGroupClassName, scrollbarClassName, Option, getOptionProps, options = [], Optgroup: Optgroup$1 = Optgroup, dataTestId, emptyPlaceholder, visibleOptions = DEFAULT_VISIBLE_OPTIONS, onScroll, open, header, footer, showFooter = true, optionsListWidth, nativeScrollbar: nativeScrollbarProp, flatOptions = [], setHighlightedIndex, }, ref) => {
-    const [scrollTop, setScrollTop] = useState(true);
-    const [scrollBottom, setScrollBottom] = useState(false);
-    const query = '(max-width: 1023px)';
-    let [nativeScrollbar] = useMatchMedia(query, () => isClient() ? window.matchMedia(query).matches : true);
-    nativeScrollbar = Boolean(nativeScrollbarProp ?? nativeScrollbar);
-    const handleScroll = useCallback((event) => {
-        const scrolledToHeader = event.currentTarget.scrollTop <= 0;
-        const scrolledToFooter = event.currentTarget.scrollHeight - event.currentTarget.offsetHeight <=
+var OptionsList = React.forwardRef(function (_a, ref) {
+    var _b, _c;
+    var _d = _a.size, size = _d === void 0 ? 48 : _d, className = _a.className, optionGroupClassName = _a.optionGroupClassName, scrollbarClassName = _a.scrollbarClassName, Option = _a.Option, getOptionProps = _a.getOptionProps, _e = _a.options, options = _e === void 0 ? [] : _e, _f = _a.Optgroup, Optgroup = _f === void 0 ? components_optgroup_Component.Optgroup : _f, dataTestId = _a.dataTestId, emptyPlaceholder = _a.emptyPlaceholder, _g = _a.visibleOptions, visibleOptions = _g === void 0 ? consts.DEFAULT_VISIBLE_OPTIONS : _g, onScroll = _a.onScroll, open = _a.open, header = _a.header, footer = _a.footer, _h = _a.showFooter, showFooter = _h === void 0 ? true : _h, optionsListWidth = _a.optionsListWidth, nativeScrollbarProp = _a.nativeScrollbar, _j = _a.flatOptions, flatOptions = _j === void 0 ? [] : _j, setHighlightedIndex = _a.setHighlightedIndex;
+    var _k = React.useState(true), scrollTop = _k[0], setScrollTop = _k[1];
+    var _l = React.useState(false), scrollBottom = _l[0], setScrollBottom = _l[1];
+    var query = '(max-width: 1023px)';
+    var nativeScrollbar = coreComponentsMq.useMatchMedia(query, function () {
+        return coreComponentsShared.isClient() ? window.matchMedia(query).matches : true;
+    })[0];
+    nativeScrollbar = Boolean(nativeScrollbarProp !== null && nativeScrollbarProp !== void 0 ? nativeScrollbarProp : nativeScrollbar);
+    var handleScroll = React.useCallback(function (event) {
+        var scrolledToHeader = event.currentTarget.scrollTop <= 0;
+        var scrolledToFooter = event.currentTarget.scrollHeight - event.currentTarget.offsetHeight <=
             event.currentTarget.scrollTop;
         setScrollTop(scrolledToHeader);
         setScrollBottom(scrolledToFooter);
-        onScroll?.(event);
+        onScroll === null || onScroll === void 0 ? void 0 : onScroll(event);
     }, [onScroll]);
-    const renderOption = (option, index) => (React.createElement(Option, { key: option.key, ...getOptionProps(option, index) }));
-    const listRef = useRef(null);
-    const scrollbarRef = useRef(null);
-    const counter = createCounter();
-    const renderGroup = (group) => (React.createElement(Optgroup$1, { className: optionGroupClassName, label: group.label, key: group.label, size: size }, group.options.map((option) => renderOption(option, counter()))));
-    useVisibleOptions({
-        ...(!nativeScrollbar && { styleTargetRef: scrollbarRef }),
-        visibleOptions,
-        listRef,
-        open,
-        invalidate: options,
-    });
+    var renderOption = function (option, index) { return (React__default.default.createElement(Option, tslib.__assign({ key: option.key }, getOptionProps(option, index)))); };
+    var listRef = React.useRef(null);
+    var scrollbarRef = React.useRef(null);
+    var counter = createCounter();
+    var renderGroup = function (group) { return (React__default.default.createElement(Optgroup, { className: optionGroupClassName, label: group.label, key: group.label, size: size }, group.options.map(function (option) { return renderOption(option, counter()); }))); };
+    utils.useVisibleOptions(tslib.__assign(tslib.__assign({}, (!nativeScrollbar && { styleTargetRef: scrollbarRef })), { visibleOptions: visibleOptions, listRef: listRef, open: open, invalidate: options }));
     if (options.length === 0 && !emptyPlaceholder && !header && !footer) {
         return null;
     }
-    const renderListItems = () => (React.createElement(React.Fragment, null,
-        options.map((option) => isGroup(option) ? renderGroup(option) : renderOption(option, counter())),
-        emptyPlaceholder && options.length === 0 && (React.createElement("div", { className: styles.emptyPlaceholder }, emptyPlaceholder))));
-    const renderWithCustomScrollbar = () => {
-        const scrollableNodeProps = {
+    var renderListItems = function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+        options.map(function (option) {
+            return utils.isGroup(option) ? renderGroup(option) : renderOption(option, counter());
+        }),
+        emptyPlaceholder && options.length === 0 && (React__default.default.createElement("div", { className: styles__default.default.emptyPlaceholder }, emptyPlaceholder)))); };
+    var renderWithCustomScrollbar = function () {
+        var scrollableNodeProps = {
             onScroll: handleScroll,
             'data-test-id': dataTestId,
             ref: ref,
         };
-        return (React.createElement(Scrollbar, { className: cn(styles.scrollable, scrollbarClassName), ref: scrollbarRef, horizontalAutoStretch: optionsListWidth === 'content', scrollableNodeProps: scrollableNodeProps, contentNodeProps: { ref: listRef } }, renderListItems()));
+        return (React__default.default.createElement(coreComponentsScrollbar.Scrollbar, { className: cn__default.default(styles__default.default.scrollable, scrollbarClassName), ref: scrollbarRef, horizontalAutoStretch: optionsListWidth === 'content', scrollableNodeProps: scrollableNodeProps, contentNodeProps: { ref: listRef } }, renderListItems()));
     };
-    const renderWithNativeScrollbar = () => (React.createElement("div", { className: cn(styles.scrollable, scrollbarClassName), ref: mergeRefs([listRef, ref]), onScroll: handleScroll }, renderListItems()));
-    const resetHighlightedIndex = () => setHighlightedIndex?.(-1);
-    return (React.createElement("div", { ...(nativeScrollbar && { 'data-test-id': dataTestId }), className: cn(styles.optionsList, styles[SIZE_TO_CLASSNAME_MAP[size]], className) },
-        header && (React.createElement("div", { className: cn(styles.optionsListHeader, {
-                [styles.headerHighlighted]: !scrollTop,
-            }), onMouseEnter: resetHighlightedIndex }, header)),
+    var renderWithNativeScrollbar = function () { return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.scrollable, scrollbarClassName), ref: mergeRefs__default.default([listRef, ref]), onScroll: handleScroll }, renderListItems())); };
+    var resetHighlightedIndex = function () { return setHighlightedIndex === null || setHighlightedIndex === void 0 ? void 0 : setHighlightedIndex(-1); };
+    return (React__default.default.createElement("div", tslib.__assign({}, (nativeScrollbar && { 'data-test-id': dataTestId }), { className: cn__default.default(styles__default.default.optionsList, styles__default.default[consts.SIZE_TO_CLASSNAME_MAP[size]], className) }),
+        header && (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.optionsListHeader, (_b = {},
+                _b[styles__default.default.headerHighlighted] = !scrollTop,
+                _b)), onMouseEnter: resetHighlightedIndex }, header)),
         nativeScrollbar ? renderWithNativeScrollbar() : renderWithCustomScrollbar(),
-        showFooter && footer && (React.createElement("div", { onMouseEnter: resetHighlightedIndex, className: cn(styles.optionsListFooter, {
-                [styles.withBorder]: visibleOptions &&
+        showFooter && footer && (React__default.default.createElement("div", { onMouseEnter: resetHighlightedIndex, className: cn__default.default(styles__default.default.optionsListFooter, (_c = {},
+                _c[styles__default.default.withBorder] = visibleOptions &&
                     flatOptions.length > visibleOptions &&
                     !scrollBottom,
-            }) }, footer))));
+                _c)) }, footer))));
 });
 
-export { OptionsList };
+exports.OptionsList = OptionsList;

package/select/cssm/components/options-list/index.js

@@ -1,12 +1,7 @@
-export { OptionsList } from './Component.js';
-import 'react';
-import 'react-merge-refs';
-import 'classnames';
-import '../../../../mq/cssm';
-import '../../../../scrollbar/cssm';
-import '../../../../shared/cssm';
-import '../../consts.js';
-import '../../utils.js';
-import '../optgroup/Component.js';
-import '../optgroup/index.module.css';
-import './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_optionsList_Component = require('./Component.js');
+
+
+
+exports.OptionsList = components_optionsList_Component.OptionsList;

package/select/cssm/components/search/Component.js

@@ -1,9 +1,21 @@
-import React, { forwardRef } from 'react';
-import cn from 'classnames';
-import { Input } from '../../../../input/cssm';
-import { MagnifierMIcon } from '@alfalab/icons-glyph/MagnifierMIcon';
-import styles from './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const Search = forwardRef(({ clear = true, placeholder = 'Поиск', className, leftAddons = React.createElement(MagnifierMIcon, { color: '#86868A' }), ...restProps }, ref) => (React.createElement(Input, { ref: ref, className: cn(styles.component, className), placeholder: placeholder, leftAddons: leftAddons, clear: clear, ...restProps })));
+var tslib = require('tslib');
+var React = require('react');
+var cn = require('classnames');
+var coreComponentsInput = require('../../../../input/cssm');
+var MagnifierMIcon = require('@alfalab/icons-glyph/MagnifierMIcon');
+var styles = require('./index.module.css');
 
-export { Search };
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var Search = React.forwardRef(function (_a, ref) {
+    var _b = _a.clear, clear = _b === void 0 ? true : _b, _c = _a.placeholder, placeholder = _c === void 0 ? 'Поиск' : _c, className = _a.className, _d = _a.leftAddons, leftAddons = _d === void 0 ? React__default.default.createElement(MagnifierMIcon.MagnifierMIcon, { color: '#86868A' }) : _d, restProps = tslib.__rest(_a, ["clear", "placeholder", "className", "leftAddons"]);
+    return (React__default.default.createElement(coreComponentsInput.Input, tslib.__assign({ ref: ref, className: cn__default.default(styles__default.default.component, className), placeholder: placeholder, leftAddons: leftAddons, clear: clear }, restProps)));
+});
+
+exports.Search = Search;

package/select/cssm/components/search/index.js

@@ -1,6 +1,7 @@
-export { Search } from './Component.js';
-import 'react';
-import 'classnames';
-import '../../../../input/cssm';
-import '@alfalab/icons-glyph/MagnifierMIcon';
-import './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_search_Component = require('./Component.js');
+
+
+
+exports.Search = components_search_Component.Search;

package/select/cssm/components/virtual-options-list/Component.js

@@ -1,52 +1,65 @@
-import React, { forwardRef, useRef, useState, useEffect, useMemo } from 'react';
-import mergeRefs from 'react-merge-refs';
-import { useVirtual } from 'react-virtual';
-import cn from 'classnames';
-import { useMatchMedia } from '../../../../mq/cssm';
-import { Scrollbar } from '../../../../scrollbar/cssm';
-import { isClient } from '../../../../shared/cssm';
-import { SIZE_TO_CLASSNAME_MAP, DEFAULT_VISIBLE_OPTIONS } from '../../consts.js';
-import { usePrevious, lastIndexOf, useVisibleOptions, isGroup } from '../../utils.js';
-import { Optgroup } from '../optgroup/Component.js';
-import styles from './index.module.css';
-import '../optgroup/index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const VirtualOptionsList = forwardRef(({ size = 48, flatOptions = [], highlightedIndex = -1, optionGroupClassName, className, getOptionProps, Option, open, options = [], Optgroup: Optgroup$1 = Optgroup, dataTestId, emptyPlaceholder, visibleOptions = DEFAULT_VISIBLE_OPTIONS, header, footer, showFooter = true, optionsListWidth, onScroll, nativeScrollbar: nativeScrollbarProp, setHighlightedIndex, }, ref) => {
-    const listRef = useRef(null);
-    const parentRef = useRef(null);
-    const scrollbarRef = useRef(null);
-    const [visibleOptionsInvalidateKey, setVisibleOptionsInvalidateKey] = useState('');
-    const prevHighlightedIndex = usePrevious(highlightedIndex) || -1;
-    const query = '(max-width: 1023px)';
-    let [nativeScrollbar] = useMatchMedia(query, () => isClient() ? window.matchMedia(query).matches : true);
-    const rowVirtualizer = useVirtual({
+var tslib = require('tslib');
+var React = require('react');
+var mergeRefs = require('react-merge-refs');
+var reactVirtual = require('react-virtual');
+var cn = require('classnames');
+var coreComponentsMq = require('../../../../mq/cssm');
+var coreComponentsScrollbar = require('../../../../scrollbar/cssm');
+var coreComponentsShared = require('../../../../shared/cssm');
+var consts = require('../../consts.js');
+var utils = require('../../utils.js');
+var components_optgroup_Component = require('../optgroup/Component.js');
+var styles = require('./index.module.css');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var VirtualOptionsList = React.forwardRef(function (_a, ref) {
+    var _b;
+    var _c = _a.size, size = _c === void 0 ? 48 : _c, _d = _a.flatOptions, flatOptions = _d === void 0 ? [] : _d, _e = _a.highlightedIndex, highlightedIndex = _e === void 0 ? -1 : _e, optionGroupClassName = _a.optionGroupClassName, className = _a.className, getOptionProps = _a.getOptionProps, Option = _a.Option, open = _a.open, _f = _a.options, options = _f === void 0 ? [] : _f, _g = _a.Optgroup, Optgroup = _g === void 0 ? components_optgroup_Component.Optgroup : _g, dataTestId = _a.dataTestId, emptyPlaceholder = _a.emptyPlaceholder, _h = _a.visibleOptions, visibleOptions = _h === void 0 ? consts.DEFAULT_VISIBLE_OPTIONS : _h, header = _a.header, footer = _a.footer, _j = _a.showFooter, showFooter = _j === void 0 ? true : _j, optionsListWidth = _a.optionsListWidth, onScroll = _a.onScroll, nativeScrollbarProp = _a.nativeScrollbar, setHighlightedIndex = _a.setHighlightedIndex;
+    var listRef = React.useRef(null);
+    var parentRef = React.useRef(null);
+    var scrollbarRef = React.useRef(null);
+    var _k = React.useState(''), visibleOptionsInvalidateKey = _k[0], setVisibleOptionsInvalidateKey = _k[1];
+    var prevHighlightedIndex = utils.usePrevious(highlightedIndex) || -1;
+    var query = '(max-width: 1023px)';
+    var nativeScrollbar = coreComponentsMq.useMatchMedia(query, function () {
+        return coreComponentsShared.isClient() ? window.matchMedia(query).matches : true;
+    })[0];
+    var rowVirtualizer = reactVirtual.useVirtual({
         size: flatOptions.length,
         parentRef: (ref || parentRef),
         overscan: 15,
     });
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    nativeScrollbar = Boolean(nativeScrollbarProp ?? nativeScrollbar);
+    nativeScrollbar = Boolean(nativeScrollbarProp !== null && nativeScrollbarProp !== void 0 ? nativeScrollbarProp : nativeScrollbar);
     // Сколл к выбранному пункту при открытии меню
-    useEffect(() => {
+    React.useEffect(function () {
         if (open) {
             rowVirtualizer.scrollToIndex(highlightedIndex, { align: 'end' });
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [open]);
     // Скролл к пункту, которого нет на экране
-    useEffect(() => {
+    React.useEffect(function () {
         if (highlightedIndex === -1)
             return;
-        if (!rowVirtualizer.virtualItems.some((option) => option.index === highlightedIndex)) {
+        if (!rowVirtualizer.virtualItems.some(function (option) { return option.index === highlightedIndex; })) {
             rowVirtualizer.scrollToIndex(highlightedIndex, { align: 'end' });
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [highlightedIndex]);
     // Циклическая навигация
-    useEffect(() => {
-        const notDisabled = (option) => !option.disabled;
-        const firstNonDisabled = flatOptions.findIndex(notDisabled);
-        const lastNonDisabled = lastIndexOf(flatOptions, notDisabled);
+    React.useEffect(function () {
+        var notDisabled = function (option) { return !option.disabled; };
+        var firstNonDisabled = flatOptions.findIndex(notDisabled);
+        var lastNonDisabled = utils.lastIndexOf(flatOptions, notDisabled);
         if (prevHighlightedIndex <= firstNonDisabled &&
             highlightedIndex === flatOptions.length - 1) {
             rowVirtualizer.scrollToIndex(lastNonDisabled);
@@ -56,7 +69,7 @@ const VirtualOptionsList = forwardRef(({ size = 48, flatOptions = [], highlighte
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [prevHighlightedIndex, highlightedIndex]);
-    useEffect(() => {
+    React.useEffect(function () {
         setVisibleOptionsInvalidateKey(
         /**
          * react-virtual может несколько раз отрендерить список с одним элементом,
@@ -65,22 +78,22 @@ const VirtualOptionsList = forwardRef(({ size = 48, flatOptions = [], highlighte
          */
         rowVirtualizer.virtualItems
             .slice(0, Math.min(rowVirtualizer.virtualItems.length, visibleOptions + 1))
-            .map((item) => flatOptions[item.index].key)
+            .map(function (item) { return flatOptions[item.index].key; })
             .join('_'));
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [rowVirtualizer.virtualItems.length, flatOptions]);
-    useVisibleOptions({
-        visibleOptions,
+    utils.useVisibleOptions({
+        visibleOptions: visibleOptions,
         invalidate: visibleOptionsInvalidateKey,
-        listRef,
+        listRef: listRef,
         styleTargetRef: nativeScrollbar ? parentRef : scrollbarRef,
-        open,
+        open: open,
     });
     // Т.к. рендерится плоский список, необходимо знать индекс, когда начинается новая группа
-    const groupStartIndexes = useMemo(() => {
-        let currentIndex = 0;
-        return options.reduce((acc, option, index) => {
-            if (isGroup(option)) {
+    var groupStartIndexes = React.useMemo(function () {
+        var currentIndex = 0;
+        return options.reduce(function (acc, option, index) {
+            if (utils.isGroup(option)) {
                 acc[currentIndex] = index;
                 currentIndex += option.options.length;
             }
@@ -90,41 +103,44 @@ const VirtualOptionsList = forwardRef(({ size = 48, flatOptions = [], highlighte
             return acc;
         }, {});
     }, [options]);
-    const renderList = () => rowVirtualizer.virtualItems.map((virtualRow) => {
-        const option = flatOptions[virtualRow.index];
-        const group = options[groupStartIndexes[virtualRow.index]];
-        return (React.createElement("div", { key: virtualRow.index, ref: virtualRow.measureRef, className: cn(styles.virtualRow, {
-                [styles.highlighted]: highlightedIndex === virtualRow.index,
-            }), style: {
-                transform: `translateY(${virtualRow.start}px)`,
-            } },
-            group && (React.createElement(Optgroup$1, { label: group.label, size: size, className: optionGroupClassName })),
-            !isGroup(option) && (React.createElement(Option, { ...getOptionProps(option, virtualRow.index) }))));
-    });
-    const contentNodeProps = {
-        className: styles.inner,
-        style: { height: `${rowVirtualizer.totalSize}px` },
+    var renderList = function () {
+        return rowVirtualizer.virtualItems.map(function (virtualRow) {
+            var _a;
+            var option = flatOptions[virtualRow.index];
+            var group = options[groupStartIndexes[virtualRow.index]];
+            return (React__default.default.createElement("div", { key: virtualRow.index, ref: virtualRow.measureRef, className: cn__default.default(styles__default.default.virtualRow, (_a = {},
+                    _a[styles__default.default.highlighted] = highlightedIndex === virtualRow.index,
+                    _a)), style: {
+                    transform: "translateY(".concat(virtualRow.start, "px)"),
+                } },
+                group && (React__default.default.createElement(Optgroup, { label: group.label, size: size, className: optionGroupClassName })),
+                !utils.isGroup(option) && (React__default.default.createElement(Option, tslib.__assign({}, getOptionProps(option, virtualRow.index))))));
+        });
+    };
+    var contentNodeProps = {
+        className: styles__default.default.inner,
+        style: { height: "".concat(rowVirtualizer.totalSize, "px") },
         ref: listRef,
     };
-    const renderWithCustomScrollbar = () => (React.createElement(Scrollbar, { className: styles.scrollable, ref: scrollbarRef, horizontalAutoStretch: optionsListWidth === 'content', scrollableNodeProps: { onScroll, ref: parentRef }, contentNodeProps: contentNodeProps }, renderList()));
-    const renderWithNativeScrollbar = () => {
+    var renderWithCustomScrollbar = function () { return (React__default.default.createElement(coreComponentsScrollbar.Scrollbar, { className: styles__default.default.scrollable, ref: scrollbarRef, horizontalAutoStretch: optionsListWidth === 'content', scrollableNodeProps: { onScroll: onScroll, ref: parentRef }, contentNodeProps: contentNodeProps }, renderList())); };
+    var renderWithNativeScrollbar = function () {
         if (visibleOptions) {
-            return (React.createElement("div", { className: styles.scrollable, ref: mergeRefs([parentRef, ref]), onScroll: onScroll },
-                React.createElement("div", { ...contentNodeProps }, renderList())));
+            return (React__default.default.createElement("div", { className: styles__default.default.scrollable, ref: mergeRefs__default.default([parentRef, ref]), onScroll: onScroll },
+                React__default.default.createElement("div", tslib.__assign({}, contentNodeProps), renderList())));
         }
-        return React.createElement("div", { ...contentNodeProps }, renderList());
+        return React__default.default.createElement("div", tslib.__assign({}, contentNodeProps), renderList());
     };
-    const resetHighlightedIndex = () => setHighlightedIndex?.(-1);
+    var resetHighlightedIndex = function () { return setHighlightedIndex === null || setHighlightedIndex === void 0 ? void 0 : setHighlightedIndex(-1); };
     if (options.length === 0 && !emptyPlaceholder) {
         return null;
     }
-    return (React.createElement("div", { className: cn(styles.virtualOptionsList, styles[SIZE_TO_CLASSNAME_MAP[size]], className), "data-test-id": dataTestId },
-        header && (React.createElement("div", { className: styles.virtualOptionsListHeader, onMouseEnter: resetHighlightedIndex }, header)),
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.virtualOptionsList, styles__default.default[consts.SIZE_TO_CLASSNAME_MAP[size]], className), "data-test-id": dataTestId },
+        header && (React__default.default.createElement("div", { className: styles__default.default.virtualOptionsListHeader, onMouseEnter: resetHighlightedIndex }, header)),
         nativeScrollbar ? renderWithNativeScrollbar() : renderWithCustomScrollbar(),
-        emptyPlaceholder && options.length === 0 && (React.createElement("div", { className: styles.emptyPlaceholder }, emptyPlaceholder)),
-        showFooter && footer && (React.createElement("div", { onMouseEnter: resetHighlightedIndex, className: cn(styles.virtualOptionsListFooter, {
-                [styles.withBorder]: visibleOptions && flatOptions.length > visibleOptions,
-            }) }, footer))));
+        emptyPlaceholder && options.length === 0 && (React__default.default.createElement("div", { className: styles__default.default.emptyPlaceholder }, emptyPlaceholder)),
+        showFooter && footer && (React__default.default.createElement("div", { onMouseEnter: resetHighlightedIndex, className: cn__default.default(styles__default.default.virtualOptionsListFooter, (_b = {},
+                _b[styles__default.default.withBorder] = visibleOptions && flatOptions.length > visibleOptions,
+                _b)) }, footer))));
 });
 
-export { VirtualOptionsList };
+exports.VirtualOptionsList = VirtualOptionsList;

package/select/cssm/components/virtual-options-list/index.js

@@ -1,13 +1,7 @@
-export { VirtualOptionsList } from './Component.js';
-import 'react';
-import 'react-merge-refs';
-import 'react-virtual';
-import 'classnames';
-import '../../../../mq/cssm';
-import '../../../../scrollbar/cssm';
-import '../../../../shared/cssm';
-import '../../consts.js';
-import '../../utils.js';
-import '../optgroup/Component.js';
-import '../optgroup/index.module.css';
-import './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_virtualOptionsList_Component = require('./Component.js');
+
+
+
+exports.VirtualOptionsList = components_virtualOptionsList_Component.VirtualOptionsList;

package/select/cssm/consts.js

@@ -1,5 +1,7 @@
-const DEFAULT_VISIBLE_OPTIONS = 5;
-const SIZE_TO_CLASSNAME_MAP = {
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var DEFAULT_VISIBLE_OPTIONS = 5;
+var SIZE_TO_CLASSNAME_MAP = {
     s: 'size-48',
     m: 'size-56',
     l: 'size-64',
@@ -10,4 +12,5 @@ const SIZE_TO_CLASSNAME_MAP = {
     72: 'size-72',
 };
 
-export { DEFAULT_VISIBLE_OPTIONS, SIZE_TO_CLASSNAME_MAP };
+exports.DEFAULT_VISIBLE_OPTIONS = DEFAULT_VISIBLE_OPTIONS;
+exports.SIZE_TO_CLASSNAME_MAP = SIZE_TO_CLASSNAME_MAP;

package/select/cssm/desktop/Component.desktop.js

@@ -1,48 +1,24 @@
-import React, { forwardRef } from 'react';
-import { FormControlDesktop } from '../../../form-control/cssm/desktop';
-import { Popover } from '../../../popover/cssm';
-import { Arrow } from '../components/arrow/Component.js';
-import { BaseSelect } from '../components/base-select/Component.js';
-import { Field } from '../components/field/Component.js';
-import { Optgroup } from '../components/optgroup/Component.js';
-import { Option } from '../components/option/Component.js';
-import { OptionsList } from '../components/options-list/Component.js';
-import { Search } from '../components/search/Component.js';
-import 'classnames';
-import '@alfalab/icons-glyph/ChevronDownMIcon';
-import '../components/arrow/index.module.css';
-import 'react-merge-refs';
-import '@juggle/resize-observer';
-import 'compute-scroll-into-view';
-import 'downshift';
-import '../../../shared/cssm';
-import '@alfalab/hooks';
-import '../utils.js';
-import '../components/native-select/Component.js';
-import '../components/base-select/index.module.css';
-import '../components/base-select/mobile.module.css';
-import '../components/field/index.module.css';
-import '../consts.js';
-import '../components/optgroup/index.module.css';
-import '../components/checkmark/Component.js';
-import '../../../badge/cssm';
-import '../../../checkbox/cssm';
-import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
-import '@alfalab/icons-glyph/CheckmarkMIcon';
-import '../components/checkmark/index.module.css';
-import '../components/checkmark-mobile/Component.js';
-import '../components/checkmark-mobile/index.module.css';
-import '../components/option/index.module.css';
-import '../../../mq/cssm';
-import '../../../scrollbar/cssm';
-import '../components/options-list/index.module.css';
-import '../../../input/cssm';
-import '@alfalab/icons-glyph/MagnifierMIcon';
-import '../components/search/index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const SelectDesktop = forwardRef(({ Arrow: Arrow$1 = Arrow, Field: Field$1 = Field, OptionsList: OptionsList$1 = OptionsList, Optgroup: Optgroup$1 = Optgroup, Option: Option$1 = Option, Search: Search$1 = Search, fieldProps = {}, ...restProps }, ref) => (React.createElement(BaseSelect, { ref: ref, view: 'desktop', Option: Option$1, Field: Field$1, fieldProps: {
-        FormControlComponent: FormControlDesktop,
-        ...fieldProps,
-    }, Search: Search$1, Optgroup: Optgroup$1, OptionsList: OptionsList$1, Arrow: Arrow$1, Popover: Popover, ...restProps })));
+var tslib = require('tslib');
+var React = require('react');
+var desktop = require('../../../form-control/cssm/desktop');
+var coreComponentsPopover = require('../../../popover/cssm');
+var components_arrow_Component = require('../components/arrow/Component.js');
+var components_baseSelect_Component = require('../components/base-select/Component.js');
+var components_field_Component = require('../components/field/Component.js');
+var components_optgroup_Component = require('../components/optgroup/Component.js');
+var components_option_Component = require('../components/option/Component.js');
+var components_optionsList_Component = require('../components/options-list/Component.js');
+var components_search_Component = require('../components/search/Component.js');
 
-export { SelectDesktop };
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var SelectDesktop = React.forwardRef(function (_a, ref) {
+    var _b = _a.Arrow, Arrow = _b === void 0 ? components_arrow_Component.Arrow : _b, _c = _a.Field, Field = _c === void 0 ? components_field_Component.Field : _c, _d = _a.OptionsList, OptionsList = _d === void 0 ? components_optionsList_Component.OptionsList : _d, _e = _a.Optgroup, Optgroup = _e === void 0 ? components_optgroup_Component.Optgroup : _e, _f = _a.Option, Option = _f === void 0 ? components_option_Component.Option : _f, _g = _a.Search, Search = _g === void 0 ? components_search_Component.Search : _g, _h = _a.fieldProps, fieldProps = _h === void 0 ? {} : _h, restProps = tslib.__rest(_a, ["Arrow", "Field", "OptionsList", "Optgroup", "Option", "Search", "fieldProps"]);
+    return (React__default.default.createElement(components_baseSelect_Component.BaseSelect, tslib.__assign({ ref: ref, view: 'desktop', Option: Option, Field: Field, fieldProps: tslib.__assign({ FormControlComponent: desktop.FormControlDesktop }, fieldProps), Search: Search, Optgroup: Optgroup, OptionsList: OptionsList, Arrow: Arrow, Popover: coreComponentsPopover.Popover }, restProps)));
+});
+
+exports.SelectDesktop = SelectDesktop;

package/select/cssm/desktop/index.js

@@ -1,42 +1,7 @@
-export { SelectDesktop } from './Component.desktop.js';
-import 'react';
-import '../../../form-control/cssm/desktop';
-import '../../../popover/cssm';
-import '../components/arrow/Component.js';
-import 'classnames';
-import '@alfalab/icons-glyph/ChevronDownMIcon';
-import '../components/arrow/index.module.css';
-import '../components/base-select/Component.js';
-import 'react-merge-refs';
-import '@juggle/resize-observer';
-import 'compute-scroll-into-view';
-import 'downshift';
-import '../../../shared/cssm';
-import '@alfalab/hooks';
-import '../utils.js';
-import '../components/native-select/Component.js';
-import '../components/base-select/index.module.css';
-import '../components/base-select/mobile.module.css';
-import '../components/field/Component.js';
-import '../components/field/index.module.css';
-import '../components/optgroup/Component.js';
-import '../consts.js';
-import '../components/optgroup/index.module.css';
-import '../components/option/Component.js';
-import '../components/checkmark/Component.js';
-import '../../../badge/cssm';
-import '../../../checkbox/cssm';
-import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
-import '@alfalab/icons-glyph/CheckmarkMIcon';
-import '../components/checkmark/index.module.css';
-import '../components/checkmark-mobile/Component.js';
-import '../components/checkmark-mobile/index.module.css';
-import '../components/option/index.module.css';
-import '../components/options-list/Component.js';
-import '../../../mq/cssm';
-import '../../../scrollbar/cssm';
-import '../components/options-list/index.module.css';
-import '../components/search/Component.js';
-import '../../../input/cssm';
-import '@alfalab/icons-glyph/MagnifierMIcon';
-import '../components/search/index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var desktop_Component_desktop = require('./Component.desktop.js');
+
+
+
+exports.SelectDesktop = desktop_Component_desktop.SelectDesktop;