@alfalab/core-components 37.4.0-beta.0 → 37.4.0-beta.1

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

@@ -16,7 +16,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
 
-var VirtualOptionsList = function (_a) {
+var VirtualOptionsList = React.forwardRef(function (_a, ref) {
     var _b;
     var _c = _a.flatOptions, flatOptions = _c === void 0 ? [] : _c, _d = _a.highlightedIndex, highlightedIndex = _d === void 0 ? -1 : _d, _e = _a.size, size = _e === void 0 ? 's' : _e, className = _a.className, Option = _a.Option, getOptionProps = _a.getOptionProps, _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, showFooter = _a.showFooter, open = _a.open, _h = _a.onApply, onApply = _h === void 0 ? function () { return null; } : _h, _j = _a.onClear, onClear = _j === void 0 ? function () { return null; } : _j;
     var _k = React.useContext(coreComponentsBaseModal.BaseModalContext), footerHighlighted = _k.footerHighlighted, setHasFooter = _k.setHasFooter;
@@ -24,8 +24,8 @@ var VirtualOptionsList = function (_a) {
         setHasFooter(true);
     }, [setHasFooter]);
     var listRef = React.useRef(null);
-    var parentRef = React.useRef(null);
     var prevHighlightedIndex = hooks.usePrevious(highlightedIndex) || -1;
+    var parentRef = ref && typeof ref === 'object' ? ref : listRef;
     var rowVirtualizer = reactVirtual.useVirtual({
         size: flatOptions.length,
         parentRef: parentRef,
@@ -91,20 +91,20 @@ var VirtualOptionsList = function (_a) {
                     transform: "translateY(".concat(virtualRow.start, "px)"),
                 } },
                 group && React__default.default.createElement(Optgroup, { label: group.label }),
-                !utils.isGroup(option) && React__default.default.createElement(Option, tslib_es6.__assign({}, getOptionProps(option, virtualRow.index)))));
+                !utils.isGroup(option) && (React__default.default.createElement(Option, tslib_es6.__assign({}, getOptionProps(option, virtualRow.index))))));
         });
     };
     if (options.length === 0 && !emptyPlaceholder) {
         return null;
     }
-    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.virtualOptionsList, styles__default.default[size], className), "data-test-id": dataTestId, ref: parentRef },
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.virtualOptionsList, styles__default.default[size], className), "data-test-id": dataTestId },
         React__default.default.createElement("div", tslib_es6.__assign({}, contentNodeProps), renderList()),
         emptyPlaceholder && options.length === 0 && (React__default.default.createElement("div", { className: styles__default.default.emptyPlaceholder }, emptyPlaceholder)),
         showFooter && (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.footer, className, (_b = {},
-                _b[styles__default.default.highlighted] = footerHighlighted,
+                _b[styles__default.default.footerHighlighted] = footerHighlighted,
                 _b)) },
             React__default.default.createElement(coreComponentsButton.Button, { size: 's', view: 'primary', onClick: onApply, className: styles__default.default.footerButton }, "\u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C"),
             React__default.default.createElement(coreComponentsButton.Button, { size: 's', view: 'secondary', onClick: onClear, className: styles__default.default.footerButton }, "\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C")))));
-};
+});
 
 exports.VirtualOptionsList = VirtualOptionsList;

package/select/cssm/components/base-select-mobile/virtual-options-list/index.module.css

@@ -41,7 +41,6 @@
     outline: none;
     box-sizing: border-box;
     position: relative;
-    overflow: auto;
 }
 .inner {
     position: relative;

package/select/cssm/components/index.js

@@ -1,6 +1,6 @@
 var components_arrow_Component = require('./arrow/Component.js');
 var components_baseSelect_Component = require('../Component-d0e84442.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-37ff9d21.js');
 var components_field_Component = require('./field/Component.js');
 var components_optgroup_Component = require('./optgroup/Component.js');
 var components_option_Component = require('./option/Component.js');

package/select/cssm/components/select-mobile/Component.js

@@ -1,7 +1,7 @@
 require('../../tslib.es6-0e9bf404.js');
 require('react');
 require('../arrow/Component.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-37ff9d21.js');
 require('../field/Component.js');
 require('../optgroup/Component.js');
 require('../option/Component.js');

package/select/cssm/components/select-mobile/index.d.ts

@@ -1 +1 @@
-export * from "../../Component-0f60a5df";
+export * from "../../Component-37ff9d21";

package/select/cssm/components/select-mobile/index.js

@@ -1,4 +1,4 @@
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-37ff9d21.js');
 require('../../tslib.es6-0e9bf404.js');
 require('react');
 require('../arrow/Component.js');

package/select/cssm/components/select-modal-mobile/Component.js

@@ -1,7 +1,7 @@
 require('../../tslib.es6-0e9bf404.js');
 require('react');
 require('../arrow/Component.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-37ff9d21.js');
 require('../field/Component.js');
 require('../optgroup/Component.js');
 require('../option/Component.js');

package/select/cssm/components/select-modal-mobile/index.d.ts

@@ -1 +1 @@
-export * from "../../Component-0f60a5df";
+export * from "../../Component-37ff9d21";

package/select/cssm/components/select-modal-mobile/index.js

@@ -1,4 +1,4 @@
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-37ff9d21.js');
 require('../../tslib.es6-0e9bf404.js');
 require('react');
 require('../arrow/Component.js');

package/select/cssm/index.js

@@ -1,7 +1,7 @@
 var Component = require('./Component.js');
 var components_arrow_Component = require('./components/arrow/Component.js');
 var components_baseSelect_Component = require('./Component-d0e84442.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('./Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('./Component-37ff9d21.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');

package/select/cssm/presets/index.js

@@ -1,6 +1,6 @@
 var presets_useSelectWithLoading_hook = require('./useSelectWithLoading/hook.js');
 var presets_useLazyLoading_hook = require('./useLazyLoading/hook.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-37ff9d21.js');
 require('../tslib.es6-0e9bf404.js');
 require('react');
 require('../../../skeleton/cssm');

package/select/cssm/presets/useSelectWithApply/hook.js

@@ -5,7 +5,7 @@ require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
 require('../../components/arrow/index.module.css');
 require('../../Component-d0e84442.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-37ff9d21.js');
 require('../../../../form-control/cssm');
 require('@alfalab/hooks');
 require('../../utils.js');

package/select/cssm/presets/useSelectWithApply/options-list-with-apply/Component.js

@@ -5,7 +5,7 @@ require('../../../../../button/cssm');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
 require('../../../components/arrow/index.module.css');
 require('../../../Component-d0e84442.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../Component-37ff9d21.js');
 require('../../../../../form-control/cssm');
 require('@alfalab/hooks');
 require('../../../components/field/index.module.css');

package/select/cssm/presets/useSelectWithApply/options-list-with-apply/index.d.ts

@@ -1 +1 @@
-export * from "../../../Component-0f60a5df";
+export * from "../../../Component-37ff9d21";

package/select/cssm/presets/useSelectWithApply/options-list-with-apply/index.js

@@ -1,4 +1,4 @@
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../Component-0f60a5df.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../Component-37ff9d21.js');
 require('../../../tslib.es6-0e9bf404.js');
 require('react');
 require('../../../components/arrow/Component.js');

package/select/cssm/responsive.js

@@ -33,7 +33,7 @@ require('./components/option/index.module.css');
 require('./components/options-list/Component.js');
 require('../../scrollbar/cssm');
 require('./components/options-list/index.module.css');
-require('./Component-0f60a5df.js');
+require('./Component-37ff9d21.js');
 require('../../bottom-sheet/cssm');
 require('../../modal/cssm/mobile');
 require('react-virtual');

package/select/esm/{Component-cd830f7b.js → Component-f6828aa2.js}

@@ -1,4 +1,4 @@
-import { a as __assign, b as __spreadArray } from './tslib.es6-a8aaa603.js';
+import { a as __assign, b as __spreadArray } from './tslib.es6-5b51821c.js';
 import React, { forwardRef, useRef, useMemo, useCallback, useEffect } from 'react';
 import mergeRefs from 'react-merge-refs';
 import { ResizeObserver } from '@juggle/resize-observer';

package/select/esm/{Component-18ad0d6b.d.ts → Component-f8ca7b7e.d.ts}

@@ -21,8 +21,8 @@ type AdditionalMobileProps = {
      */
     bottomSheetProps?: Partial<BottomSheetProps>;
 };
-type SelectMobileProps = Omit<BaseSelectProps, "Checkmark" | "onScroll" | "visibleOptions"> & AdditionalMobileProps;
-declare const SelectMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "visibleOptions" | "Checkmark"> & AdditionalMobileProps & React.RefAttributes<unknown>>;
+type SelectMobileProps = Omit<BaseSelectProps, "Checkmark" | "onScroll"> & AdditionalMobileProps;
+declare const SelectMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "Checkmark"> & AdditionalMobileProps & React.RefAttributes<unknown>>;
 type SelectMobileProps$0 = Omit<BaseSelectProps, "Checkmark" | "onScroll"> & {
     /**
      * Футер
@@ -236,6 +236,6 @@ declare const Modal: React.ForwardRefExoticComponent<import("../../base-modal").
 } & React.RefAttributes<HTMLDivElement>>;
 declare const ResponsiveContext: React.Context<TResponsiveModalContext>;
 declare const ModalContext: import("react").Context<BaseModalContext>;
-type SelectModalMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll' | 'visibleOptions'>;
+type SelectModalMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll'>;
 declare const SelectModalMobile: React.ForwardRefExoticComponent<SelectModalMobileProps & React.RefAttributes<unknown>>;
 export { AdditionalMobileProps, SelectMobileProps, SelectMobile, BaseSelectMobile, OptionsListWithApply, ModalMobile, Content, Modal, ResponsiveContext, ModalContext, SelectModalMobileProps, SelectModalMobile };

package/select/esm/{Component-18ad0d6b.js → Component-f8ca7b7e.js}

@@ -1,4 +1,4 @@
-import { _ as __rest, a as __assign, b as __spreadArray } from './tslib.es6-a8aaa603.js';
+import { _ as __rest, a as __assign, b as __spreadArray } from './tslib.es6-5b51821c.js';
 import React, { forwardRef, useRef, useCallback, useEffect, useMemo, useState } from 'react';
 import { Arrow } from './components/arrow/Component.js';
 import mergeRefs from 'react-merge-refs';
@@ -7,7 +7,7 @@ import { useMultipleSelection, useCombobox } from 'downshift';
 import { BottomSheet } from '../../bottom-sheet/esm';
 import { ModalMobile } from '../../modal/esm/mobile';
 import './Component.js';
-import { g as getDataTestId } from './Component-cd830f7b.js';
+import { g as getDataTestId } from './Component-f6828aa2.js';
 import { Field } from './components/field/Component.js';
 import { Optgroup } from './components/optgroup/Component.js';
 import { Option } from './components/option/Component.js';
@@ -18,7 +18,7 @@ import '@alfalab/hooks';
 import { processOptions } from './utils.js';
 import { BaseOption } from './components/base-option/Component.js';
 import '../../skeleton/esm';
-import './intersection-observer-b4b778a8.js';
+import './intersection-observer-66d0ef98.js';
 import { Button } from '../../button/esm';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '../../form-control/esm';
@@ -147,7 +147,7 @@ function useSelectWithApply(_a) {
     };
 }
 
-var styles = {"component":"select__component_1pm5k","popoverInner":"select__popoverInner_1pm5k","sheet":"select__sheet_1pm5k","sheetContent":"select__sheetContent_1pm5k","sheetContainer":"select__sheetContainer_1pm5k","modal":"select__modal_1pm5k","optionsListWrapper":"select__optionsListWrapper_1pm5k","block":"select__block_1pm5k","option":"select__option_1pm5k","optionGroup":"select__optionGroup_1pm5k"};
+var styles = {"component":"select__component_1pm5k","popoverInner":"select__popoverInner_1pm5k","sheet":"select__sheet_1pm5k","sheetContent":"select__sheetContent_1pm5k","sheetContainer":"select__sheetContainer_1pm5k","block":"select__block_1pm5k","option":"select__option_1pm5k","optionGroup":"select__optionGroup_1pm5k"};
 require('./components/base-select-mobile/index.css');
 
 var VIRTUAL_OPTIONS_LIST_THRESHOLD = 30;
@@ -163,6 +163,7 @@ var BaseSelectMobile = forwardRef(function (_a, ref) {
     var itemToString = function (option) { return (option ? option.key : ''); };
     var _u = useMemo(function () { return processOptions(options, selected); }, [options, selected]), flatOptions = _u.flatOptions, selectedOptions = _u.selectedOptions;
     var selectedOptionsRef = useRef(selectedOptions);
+    var scrollableContainerRef = useRef(null);
     var _v = useState(selectedOptions), selectedDraft = _v[0], setSelectedDraft = _v[1];
     var useMultipleSelectionProps = {
         itemToString: itemToString,
@@ -346,12 +347,12 @@ var BaseSelectMobile = forwardRef(function (_a, ref) {
                     : undefined,
             }, dataTestId: getDataTestId(dataTestId, 'field') }, fieldProps)),
         name && renderValue(),
-        isBottomSheet ? (React.createElement(BottomSheet, __assign({ open: open, onClose: handleClose, className: styles.sheet, contentClassName: styles.sheetContent, containerClassName: styles.sheetContainer, title: placeholder, actionButton: footer, stickyHeader: true, hasCloser: true, swipeable: swipeable }, bottomSheetProps),
-            React.createElement("div", __assign({}, menuProps, { className: cn(styles.optionsListWrapper, optionsListClassName) }),
-                React.createElement(OptionsListWithApply, __assign({ showFooter: multiple }, optionsListProps, { flatOptions: flatOptions, highlightedIndex: highlightedIndex, size: size, options: options, OptionsList: OptionsList$1, Optgroup: Optgroup$1, Option: Option$1, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, dataTestId: getDataTestId(dataTestId, 'options-list'), optionGroupClassName: cn(styles.optionGroup, optionGroupClassName), onApply: handleApply, onClear: handleClear }))))) : (React.createElement(ModalMobile, { open: open, onClose: handleClose, className: styles.modal, contentClassName: styles.sheetContent, hasCloser: true },
+        isBottomSheet ? (React.createElement(BottomSheet, __assign({ open: open, onClose: handleClose, className: styles.sheet, contentClassName: styles.sheetContent, containerClassName: styles.sheetContainer, title: placeholder, actionButton: footer, stickyHeader: true, hasCloser: true, swipeable: swipeable, scrollableContainerRef: scrollableContainerRef }, bottomSheetProps),
+            React.createElement("div", __assign({}, menuProps, { className: optionsListClassName }),
+                React.createElement(OptionsListWithApply, __assign({ showFooter: multiple }, optionsListProps, { flatOptions: flatOptions, highlightedIndex: highlightedIndex, size: size, options: options, OptionsList: OptionsList$1, Optgroup: Optgroup$1, Option: Option$1, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, dataTestId: getDataTestId(dataTestId, 'options-list'), optionGroupClassName: cn(styles.optionGroup, optionGroupClassName), onApply: handleApply, onClear: handleClear, ref: scrollableContainerRef }))))) : (React.createElement(ModalMobile, { open: open, onClose: handleClose, contentClassName: styles.sheetContent, hasCloser: true, ref: scrollableContainerRef },
             React.createElement(ModalMobile.Header, { hasCloser: true, title: placeholder, sticky: true }),
-            React.createElement("div", __assign({}, menuProps, { className: cn(styles.optionsListWrapper, optionsListClassName) }),
-                React.createElement(OptionsListWithApply, __assign({ showFooter: multiple }, optionsListProps, { flatOptions: flatOptions, highlightedIndex: highlightedIndex, size: size, options: options, OptionsList: OptionsList$1, Optgroup: Optgroup$1, Option: Option$1, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, dataTestId: getDataTestId(dataTestId, 'options-list'), optionGroupClassName: cn(styles.optionGroup, optionGroupClassName), onApply: handleApply, onClear: handleClear })))))));
+            React.createElement("div", __assign({}, menuProps, { className: optionsListClassName }),
+                React.createElement(OptionsListWithApply, __assign({ showFooter: multiple }, optionsListProps, { flatOptions: flatOptions, highlightedIndex: highlightedIndex, size: size, options: options, OptionsList: OptionsList$1, Optgroup: Optgroup$1, Option: Option$1, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, dataTestId: getDataTestId(dataTestId, 'options-list'), optionGroupClassName: cn(styles.optionGroup, optionGroupClassName), onApply: handleApply, onClear: handleClear, ref: scrollableContainerRef })))))));
 });
 
 var SelectMobile = forwardRef(function (_a, ref) {

package/select/esm/Component.js

@@ -1,7 +1,7 @@
-import { _ as __rest, a as __assign } from './tslib.es6-a8aaa603.js';
+import { _ as __rest, a as __assign } from './tslib.es6-5b51821c.js';
 import React, { forwardRef } from 'react';
 import { Arrow } from './components/arrow/Component.js';
-import { B as BaseSelect } from './Component-cd830f7b.js';
+import { B as BaseSelect } from './Component-f6828aa2.js';
 import { Field } from './components/field/Component.js';
 import { Optgroup } from './components/optgroup/Component.js';
 import { Option } from './components/option/Component.js';

package/select/esm/Component.responsive.js

@@ -1,11 +1,11 @@
-import { _ as __rest, a as __assign } from './tslib.es6-a8aaa603.js';
+import { _ as __rest, a as __assign } from './tslib.es6-5b51821c.js';
 import React, { forwardRef } from 'react';
 import { useMedia } from '@alfalab/hooks';
 import { Select } from './Component.js';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
-import './Component-cd830f7b.js';
-import { S as SelectMobile } from './Component-18ad0d6b.js';
+import './Component-f6828aa2.js';
+import { S as SelectMobile } from './Component-f8ca7b7e.js';
 import '../../form-control/esm';
 import '../../badge/esm';
 import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
@@ -30,7 +30,7 @@ import '../../modal/esm/mobile';
 import './components/base-option/Component.js';
 import './components/base-checkmark/Component.js';
 import '../../skeleton/esm';
-import './intersection-observer-b4b778a8.js';
+import './intersection-observer-66d0ef98.js';
 import '../../button/esm';
 import './components/base-select-mobile/options-list/Component.js';
 import '../../base-modal/esm';

package/select/esm/components/base-option/Component.js

@@ -1,4 +1,4 @@
-import { a as __assign } from '../../tslib.es6-a8aaa603.js';
+import { a as __assign } from '../../tslib.es6-5b51821c.js';
 import React, { isValidElement } from 'react';
 import cn from 'classnames';
 import { BaseCheckmark } from '../base-checkmark/Component.js';

package/select/esm/components/base-option/index.js

@@ -4,4 +4,4 @@ import 'classnames';
 import '../base-checkmark/Component.js';
 import '../../../../checkbox/esm';
 import '@alfalab/icons-glyph/CheckmarkMIcon';
-import '../../tslib.es6-a8aaa603.js';
+import '../../tslib.es6-5b51821c.js';

package/select/esm/components/base-select/Component.js

@@ -5,7 +5,7 @@ import 'classnames';
 import 'downshift';
 import '../../../../popover/esm';
 import '@alfalab/hooks';
-export { B as BaseSelect } from '../../Component-cd830f7b.js';
+export { B as BaseSelect } from '../../Component-f6828aa2.js';
 import '../native-select/Component.js';
-import '../../tslib.es6-a8aaa603.js';
+import '../../tslib.es6-5b51821c.js';
 import '../../utils.js';

package/select/esm/components/base-select/index.d.ts

@@ -1 +1 @@
-export * from "../../Component-cd830f7b";
+export * from "../../Component-f6828aa2";

package/select/esm/components/base-select/index.js

@@ -1,4 +1,4 @@
-export { B as BaseSelect } from '../../Component-cd830f7b.js';
+export { B as BaseSelect } from '../../Component-f6828aa2.js';
 import 'react';
 import 'react-merge-refs';
 import '@juggle/resize-observer';
@@ -7,5 +7,5 @@ import 'downshift';
 import '../../../../popover/esm';
 import '@alfalab/hooks';
 import '../native-select/Component.js';
-import '../../tslib.es6-a8aaa603.js';
+import '../../tslib.es6-5b51821c.js';
 import '../../utils.js';

package/select/esm/components/base-select-mobile/Component.js

@@ -6,8 +6,8 @@ import '../../../../bottom-sheet/esm';
 import '../../../../modal/esm/mobile';
 import '../../Component.js';
 import '../arrow/Component.js';
-import '../../Component-cd830f7b.js';
-export { B as BaseSelectMobile } from '../../Component-18ad0d6b.js';
+import '../../Component-f6828aa2.js';
+export { B as BaseSelectMobile } from '../../Component-f8ca7b7e.js';
 import '../field/Component.js';
 import '../optgroup/Component.js';
 import '../option/Component.js';
@@ -17,7 +17,7 @@ import '../../../../scrollbar/esm';
 import '@alfalab/hooks';
 import '../base-option/Component.js';
 import '../../../../skeleton/esm';
-import '../../intersection-observer-b4b778a8.js';
+import '../../intersection-observer-66d0ef98.js';
 import '../base-checkmark/Component.js';
 import './checkmark/Component.js';
 import './options-list/Component.js';
@@ -34,5 +34,5 @@ import '../checkmark/Component.js';
 import '../../../../checkbox/esm';
 import '../../../../button/esm';
 import '../../../../base-modal/esm';
-import '../../tslib.es6-a8aaa603.js';
+import '../../tslib.es6-5b51821c.js';
 import '../../utils.js';

package/select/esm/components/base-select-mobile/index.css

@@ -43,20 +43,10 @@
 }
 .select__sheetContent_1pm5k {
     padding: 0;
-    overflow: hidden;
 }
 .select__sheetContainer_1pm5k {
     padding: 0;
 }
-.select__modal_1pm5k {
-    overflow: hidden;
-}
-.select__optionsListWrapper_1pm5k {
-    overflow: hidden;
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-}
 .select__block_1pm5k {
     width: 100%;
 }

package/select/esm/components/base-select-mobile/index.d.ts

@@ -1 +1 @@
-export * from "../../Component-18ad0d6b";
+export * from "../../Component-f8ca7b7e";

package/select/esm/components/base-select-mobile/index.js

@@ -1,4 +1,4 @@
-export { B as BaseSelectMobile } from '../../Component-18ad0d6b.js';
+export { B as BaseSelectMobile } from '../../Component-f8ca7b7e.js';
 import 'react';
 import '../arrow/Component.js';
 import 'classnames';
@@ -8,7 +8,7 @@ import 'downshift';
 import '../../../../bottom-sheet/esm';
 import '../../../../modal/esm/mobile';
 import '../../Component.js';
-import '../../Component-cd830f7b.js';
+import '../../Component-f6828aa2.js';
 import '@juggle/resize-observer';
 import '../../../../popover/esm';
 import '@alfalab/hooks';
@@ -29,10 +29,10 @@ import 'react-virtual';
 import '../base-option/Component.js';
 import '../base-checkmark/Component.js';
 import '../../../../skeleton/esm';
-import '../../intersection-observer-b4b778a8.js';
+import '../../intersection-observer-66d0ef98.js';
 import '../../../../button/esm';
 import './options-list/Component.js';
 import '../../../../base-modal/esm';
 import './virtual-options-list/Component.js';
-import '../../tslib.es6-a8aaa603.js';
+import '../../tslib.es6-5b51821c.js';
 import '../../utils.js';

package/select/esm/components/base-select-mobile/options-list/Component.js

@@ -1,4 +1,4 @@
-import { a as __assign } from '../../../tslib.es6-a8aaa603.js';
+import { a as __assign } from '../../../tslib.es6-5b51821c.js';
 import React, { useContext, useEffect } from 'react';
 import cn from 'classnames';
 import { BaseModalContext } from '../../../../../base-modal/esm';

package/select/esm/components/base-select-mobile/options-list/index.css

@@ -36,7 +36,6 @@
     width: 100%;
     outline: none;
     box-sizing: border-box;
-    overflow: auto;
 }
 .select__emptyPlaceholder_u5r7f {
     padding: var(--gap-m) var(--gap-s);

package/select/esm/components/base-select-mobile/options-list/index.js

@@ -4,5 +4,5 @@ import 'classnames';
 import '../../../../../base-modal/esm';
 import '../../../../../button/esm';
 import '../../optgroup/Component.js';
-import '../../../tslib.es6-a8aaa603.js';
+import '../../../tslib.es6-5b51821c.js';
 import '../../../utils.js';

package/select/esm/components/base-select-mobile/virtual-options-list/Component.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import React from 'react';
 import { OptionsListProps } from "../../../typings";
-declare const VirtualOptionsList: ({ flatOptions, highlightedIndex, size, className, Option, getOptionProps, options, Optgroup, dataTestId, emptyPlaceholder, showFooter, open, onApply, onClear, }: OptionsListProps) => JSX.Element | null;
+declare const VirtualOptionsList: React.ForwardRefExoticComponent<OptionsListProps & React.RefAttributes<HTMLDivElement>>;
 export { VirtualOptionsList };

package/select/esm/components/base-select-mobile/virtual-options-list/Component.js

@@ -1,5 +1,5 @@
-import { a as __assign } from '../../../tslib.es6-a8aaa603.js';
-import React, { useContext, useEffect, useRef, useMemo } from 'react';
+import { a as __assign } from '../../../tslib.es6-5b51821c.js';
+import React, { forwardRef, useContext, useEffect, useRef, useMemo } from 'react';
 import { useVirtual } from 'react-virtual';
 import cn from 'classnames';
 import { BaseModalContext } from '../../../../../base-modal/esm';
@@ -11,7 +11,7 @@ import { Optgroup } from '../../optgroup/Component.js';
 var styles = {"virtualOptionsList":"select__virtualOptionsList_ux6q8","inner":"select__inner_ux6q8","virtualRow":"select__virtualRow_ux6q8","highlighted":"select__highlighted_ux6q8","emptyPlaceholder":"select__emptyPlaceholder_ux6q8","l":"select__l_ux6q8","xl":"select__xl_ux6q8","footer":"select__footer_ux6q8","footerButton":"select__footerButton_ux6q8","footerHighlighted":"select__footerHighlighted_ux6q8"};
 require('./index.css');
 
-var VirtualOptionsList = function (_a) {
+var VirtualOptionsList = forwardRef(function (_a, ref) {
     var _b;
     var _c = _a.flatOptions, flatOptions = _c === void 0 ? [] : _c, _d = _a.highlightedIndex, highlightedIndex = _d === void 0 ? -1 : _d, _e = _a.size, size = _e === void 0 ? 's' : _e, className = _a.className, Option = _a.Option, getOptionProps = _a.getOptionProps, _f = _a.options, options = _f === void 0 ? [] : _f, _g = _a.Optgroup, Optgroup$1 = _g === void 0 ? Optgroup : _g, dataTestId = _a.dataTestId, emptyPlaceholder = _a.emptyPlaceholder, showFooter = _a.showFooter, open = _a.open, _h = _a.onApply, onApply = _h === void 0 ? function () { return null; } : _h, _j = _a.onClear, onClear = _j === void 0 ? function () { return null; } : _j;
     var _k = useContext(BaseModalContext), footerHighlighted = _k.footerHighlighted, setHasFooter = _k.setHasFooter;
@@ -19,8 +19,8 @@ var VirtualOptionsList = function (_a) {
         setHasFooter(true);
     }, [setHasFooter]);
     var listRef = useRef(null);
-    var parentRef = useRef(null);
     var prevHighlightedIndex = usePrevious(highlightedIndex) || -1;
+    var parentRef = ref && typeof ref === 'object' ? ref : listRef;
     var rowVirtualizer = useVirtual({
         size: flatOptions.length,
         parentRef: parentRef,
@@ -86,20 +86,20 @@ var VirtualOptionsList = function (_a) {
                     transform: "translateY(".concat(virtualRow.start, "px)"),
                 } },
                 group && React.createElement(Optgroup$1, { label: group.label }),
-                !isGroup(option) && React.createElement(Option, __assign({}, getOptionProps(option, virtualRow.index)))));
+                !isGroup(option) && (React.createElement(Option, __assign({}, getOptionProps(option, virtualRow.index))))));
         });
     };
     if (options.length === 0 && !emptyPlaceholder) {
         return null;
     }
-    return (React.createElement("div", { className: cn(styles.virtualOptionsList, styles[size], className), "data-test-id": dataTestId, ref: parentRef },
+    return (React.createElement("div", { className: cn(styles.virtualOptionsList, styles[size], className), "data-test-id": dataTestId },
         React.createElement("div", __assign({}, contentNodeProps), renderList()),
         emptyPlaceholder && options.length === 0 && (React.createElement("div", { className: styles.emptyPlaceholder }, emptyPlaceholder)),
         showFooter && (React.createElement("div", { className: cn(styles.footer, className, (_b = {},
-                _b[styles.highlighted] = footerHighlighted,
+                _b[styles.footerHighlighted] = footerHighlighted,
                 _b)) },
             React.createElement(Button, { size: 's', view: 'primary', onClick: onApply, className: styles.footerButton }, "\u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C"),
             React.createElement(Button, { size: 's', view: 'secondary', onClick: onClear, className: styles.footerButton }, "\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C")))));
-};
+});
 
 export { VirtualOptionsList };

package/select/esm/components/base-select-mobile/virtual-options-list/index.css

@@ -42,7 +42,6 @@
     outline: none;
     box-sizing: border-box;
     position: relative;
-    overflow: auto;
 }
 .select__inner_ux6q8 {
     position: relative;

package/select/esm/components/base-select-mobile/virtual-options-list/index.js

@@ -6,5 +6,5 @@ import '../../../../../base-modal/esm';
 import '../../../../../button/esm';
 import '@alfalab/hooks';
 import '../../optgroup/Component.js';
-import '../../../tslib.es6-a8aaa603.js';
+import '../../../tslib.es6-5b51821c.js';
 import '../../../utils.js';

package/select/esm/components/field/Component.js

@@ -1,4 +1,4 @@
-import { _ as __rest, a as __assign } from '../../tslib.es6-a8aaa603.js';
+import { _ as __rest, a as __assign } from '../../tslib.es6-5b51821c.js';
 import React, { useState, useRef, useCallback } from 'react';
 import cn from 'classnames';
 import { FormControl } from '../../../../form-control/esm';

package/select/esm/components/field/index.js

@@ -3,5 +3,5 @@ import 'react';
 import 'classnames';
 import '../../../../form-control/esm';
 import '@alfalab/hooks';
-import '../../tslib.es6-a8aaa603.js';
+import '../../tslib.es6-5b51821c.js';
 import '../../utils.js';

package/select/esm/components/index.js

@@ -1,6 +1,6 @@
 export { Arrow } from './arrow/Component.js';
-export { B as BaseSelect } from '../Component-cd830f7b.js';
-export { S as SelectMobile, a as SelectModalMobile } from '../Component-18ad0d6b.js';
+export { B as BaseSelect } from '../Component-f6828aa2.js';
+export { S as SelectMobile, a as SelectModalMobile } from '../Component-f8ca7b7e.js';
 export { Field } from './field/Component.js';
 export { Optgroup } from './optgroup/Component.js';
 export { Option } from './option/Component.js';
@@ -29,11 +29,11 @@ import '../../../checkbox/esm';
 import '../../../scrollbar/esm';
 import 'react-virtual';
 import '../../../skeleton/esm';
-import '../intersection-observer-b4b778a8.js';
+import '../intersection-observer-66d0ef98.js';
 import '../../../button/esm';
 import './base-checkmark/Component.js';
 import './base-select-mobile/options-list/Component.js';
 import '../../../base-modal/esm';
 import './base-select-mobile/virtual-options-list/Component.js';
-import '../tslib.es6-a8aaa603.js';
+import '../tslib.es6-5b51821c.js';
 import '../utils.js';

package/select/esm/components/native-select/Component.js

@@ -1,4 +1,4 @@
-import { _ as __rest, a as __assign } from '../../tslib.es6-a8aaa603.js';
+import { _ as __rest, a as __assign } from '../../tslib.es6-5b51821c.js';
 import React, { forwardRef, useCallback } from 'react';
 import { isGroup } from '../../utils.js';
 

package/select/esm/components/native-select/index.js

@@ -1,4 +1,4 @@
 export { NativeSelect } from './Component.js';
 import 'react';
-import '../../tslib.es6-a8aaa603.js';
+import '../../tslib.es6-5b51821c.js';
 import '../../utils.js';

package/select/esm/components/option/Component.js

@@ -1,4 +1,4 @@
-import { a as __assign } from '../../tslib.es6-a8aaa603.js';
+import { a as __assign } from '../../tslib.es6-5b51821c.js';
 import React, { isValidElement } from 'react';
 import cn from 'classnames';
 import { Checkmark } from '../base-select-mobile/checkmark/Component.js';

package/select/esm/components/option/index.js

@@ -7,4 +7,4 @@ import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
 import '@alfalab/icons-glyph/CheckmarkMIcon';
 import '../checkmark/Component.js';
 import '../../../../checkbox/esm';
-import '../../tslib.es6-a8aaa603.js';
+import '../../tslib.es6-5b51821c.js';

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

@@ -1,4 +1,4 @@
-import { a as __assign } from '../../tslib.es6-a8aaa603.js';
+import { a as __assign } from '../../tslib.es6-5b51821c.js';
 import React, { forwardRef, useRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';