@alfalab/core-components-select 15.2.3 → 16.0.0

package/cssm/shared/index.js

@@ -0,0 +1,87 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var presets_useSelectWithLoading_hook = require('../presets/useSelectWithLoading/hook.js');
+var presets_useLazyLoading_hook = require('../presets/useLazyLoading/hook.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../hook-2f9ec939.js');
+var utils = require('../utils.js');
+var components_option_Component = require('../components/option/Component.js');
+var components_baseOption_Component = require('../components/base-option/Component.js');
+var components_optionsList_Component = require('../components/options-list/Component.js');
+var components_virtualOptionsList_Component = require('../components/virtual-options-list/Component.js');
+var components_field_Component = require('../components/field/Component.js');
+var components_arrow_Component = require('../components/arrow/Component.js');
+var components_baseSelect_Component = require('../components/base-select/Component.js');
+var components_optgroup_Component = require('../components/optgroup/Component.js');
+var components_footer_Component = require('../components/footer/Component.js');
+require('tslib');
+require('react');
+require('@alfalab/core-components-skeleton/cssm');
+require('../presets/useSelectWithLoading/index.module.css');
+require('intersection-observer');
+require('../consts.js');
+require('../presets/useSelectWithApply/options-list-with-apply/footer/Component.js');
+require('@alfalab/core-components-button/cssm/desktop');
+require('../presets/useSelectWithApply/options-list-with-apply/footer/index.module.css');
+require('../presets/useSelectWithApply/options-list-with-apply/header/Component.js');
+require('classnames');
+require('@alfalab/core-components-checkbox/cssm');
+require('../presets/useSelectWithApply/options-list-with-apply/header/index.module.css');
+require('../components/checkmark/Component.js');
+require('@alfalab/core-components-badge/cssm');
+require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
+require('@alfalab/icons-glyph/CheckmarkMIcon');
+require('../components/checkmark/index.module.css');
+require('../components/checkmark-mobile/Component.js');
+require('../components/checkmark-mobile/index.module.css');
+require('../components/option/index.module.css');
+require('../components/base-checkmark/Component.js');
+require('../components/base-checkmark/index.module.css');
+require('../components/base-option/index.module.css');
+require('react-merge-refs');
+require('@alfalab/core-components-mq/cssm');
+require('@alfalab/core-components-scrollbar/cssm');
+require('@alfalab/core-components-shared/cssm');
+require('../components/options-list/index.module.css');
+require('react-virtual');
+require('../components/virtual-options-list/index.module.css');
+require('@alfalab/hooks');
+require('../components/field/index.module.css');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
+require('../components/arrow/index.module.css');
+require('@juggle/resize-observer');
+require('compute-scroll-into-view');
+require('downshift');
+require('../components/native-select/Component.js');
+require('../components/base-select/index.module.css');
+require('../components/base-select/mobile.module.css');
+require('../components/optgroup/index.module.css');
+require('@alfalab/core-components-base-modal/cssm');
+require('@alfalab/core-components-button/cssm/mobile');
+require('../components/footer/index.module.css');
+
+
+
+exports.useSelectWithLoading = presets_useSelectWithLoading_hook.useSelectWithLoading;
+exports.useLazyLoading = presets_useLazyLoading_hook.useLazyLoading;
+exports.SELECT_ALL_KEY = presets_useSelectWithApply_optionsListWithApply_Component.SELECT_ALL_KEY;
+exports.useSelectWithApply = presets_useSelectWithApply_optionsListWithApply_Component.useSelectWithApply;
+exports.defaultAccessor = utils.defaultAccessor;
+exports.defaultFilterFn = utils.defaultFilterFn;
+exports.isGroup = utils.isGroup;
+exports.isOptionShape = utils.isOptionShape;
+exports.joinOptions = utils.joinOptions;
+exports.lastIndexOf = utils.lastIndexOf;
+exports.processOptions = utils.processOptions;
+exports.usePrevious = utils.usePrevious;
+exports.useVisibleOptions = utils.useVisibleOptions;
+exports.Option = components_option_Component.Option;
+exports.BaseOption = components_baseOption_Component.BaseOption;
+exports.OptionsList = components_optionsList_Component.OptionsList;
+exports.VirtualOptionsList = components_virtualOptionsList_Component.VirtualOptionsList;
+exports.Field = components_field_Component.Field;
+exports.Arrow = components_arrow_Component.Arrow;
+exports.BaseSelect = components_baseSelect_Component.BaseSelect;
+exports.Optgroup = components_optgroup_Component.Optgroup;
+exports.Footer = components_footer_Component.Footer;

package/cssm/typings.d.ts

@@ -1,6 +1,11 @@
 import { AriaAttributes, FC, FocusEvent, MouseEvent, ReactElement, ReactNode, RefAttributes, SVGProps } from 'react';
+import { BottomSheetProps } from "@alfalab/core-components-bottom-sheet";
+import { FormControlProps } from "@alfalab/core-components-form-control";
 import { InputProps } from "@alfalab/core-components-input";
+import { ModalProps } from "@alfalab/core-components-modal";
+import { ModalFooterProps, ModalHeaderProps } from "@alfalab/core-components-modal/shared";
 import { PopoverProps } from "@alfalab/core-components-popover";
+import { UseSelectWithApplyProps } from "./hook-ad89c253";
 type AnyObject = Record<string, any>;
 type OptionShape = {
     /**
@@ -217,13 +222,14 @@ type BaseSelectProps = {
     /**
      * Компонент поиска
      */
-    Search?: FC<SearchProps & RefAttributes<HTMLInputElement>>;
+    Search?: FC<SearchProps>;
     /**
      * Настройки поиска
      */
     searchProps?: {
         componentProps?: SearchProps;
         accessor?: (option: OptionShape) => string;
+        filterFn?: (optionText: string, search: string) => boolean;
         value?: string;
         onChange?: (value: string) => void;
     };
@@ -528,10 +534,10 @@ type OptionProps = {
      */
     innerProps: {
         id: string;
-        onClick: (event: MouseEvent<HTMLDivElement>) => void;
-        onMouseDown: (event: MouseEvent<HTMLDivElement>) => void;
-        onMouseMove: (event: MouseEvent<HTMLDivElement>) => void;
-        role: string;
+        onClick?: (event: MouseEvent<HTMLDivElement>) => void;
+        onMouseDown?: (event: MouseEvent<HTMLDivElement>) => void;
+        onMouseMove?: (event: MouseEvent<HTMLDivElement>) => void;
+        role?: string;
     } & RefAttributes<HTMLDivElement> & AriaAttributes;
     /**
      * Идентификатор для систем автоматизированного тестирования
@@ -572,5 +578,78 @@ type CheckmarkProps = {
      */
     icon?: FC<SVGProps<SVGSVGElement>>;
 };
-type SearchProps = InputProps;
-export { AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps, SearchProps };
+type SearchProps = InputProps & RefAttributes<HTMLInputElement>;
+type SelectFieldProps = Omit<FormControlProps, 'size'> & Record<string, unknown>;
+type AdditionalMobileProps = {
+    /**
+     * Показывать кнопку 'Сбросить' в футере мобильного компонента
+     */
+    showClear?: UseSelectWithApplyProps['showClear'];
+    /**
+     * Показывать пункт "Выбрать все"
+     */
+    showSelectAll?: UseSelectWithApplyProps['showSelectAll'];
+    /**
+     * Показывать пункт "Выбрать все" в заголовке списка у мобильного компонента
+     */
+    showHeaderWithSelectAll?: UseSelectWithApplyProps['showHeaderWithSelectAll'];
+    /**
+     * Использовать ли хук useSelectWithApply в мобильном компоненте
+     */
+    useWithApplyHook?: boolean;
+};
+type BottomSheetSelectMobileProps = {
+    /**
+     * Футер
+     * @deprecated Используйте bottomSheetProps.actionButton
+     */
+    footer?: ReactNode;
+    /**
+     * Будет ли свайпаться шторка
+     * @deprecated Используйте bottomSheetProps.swipeable
+     */
+    swipeable?: boolean;
+    /**
+     * Дополнительные пропсы шторки
+     */
+    bottomSheetProps?: Partial<BottomSheetProps>;
+};
+type ModalSelectMobileProps = {
+    /**
+     *  Дополнительные пропсы шапки модалки
+     */
+    modalHeaderProps?: Partial<ModalHeaderProps>;
+    /**
+     *  Дополнительные пропсы модалки
+     */
+    modalProps?: Partial<ModalProps & RefAttributes<HTMLDivElement>>;
+    /**
+     *  Дополнительные пропсы футера модалки
+     */
+    modalFooterProps?: Partial<ModalFooterProps>;
+};
+type ConditionalMobileProps = ({
+    isBottomSheet?: true;
+} & BottomSheetSelectMobileProps) | ({
+    isBottomSheet: false;
+} & ModalSelectMobileProps);
+type SelectModalMobileProps = Omit<BaseSelectProps, 'Checkmark'> & AdditionalMobileProps & ModalSelectMobileProps;
+type SelectMobileProps = Omit<BaseSelectProps, 'Checkmark'> & AdditionalMobileProps & ConditionalMobileProps;
+type SelectDesktopProps = Omit<BaseSelectProps, 'fieldProps'> & {
+    /**
+     * Пропсы, которые будут прокинуты в компонент поля
+     */
+    fieldProps?: SelectFieldProps;
+};
+type SelectProps = BaseSelectProps & AdditionalMobileProps & ConditionalMobileProps & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+    /**
+     * Значение по-умолчанию для хука useMatchMedia
+     */
+    defaultMatchMediaValue?: boolean | (() => boolean);
+};
+export { AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps, SearchProps, SelectFieldProps, AdditionalMobileProps, BottomSheetSelectMobileProps, ModalSelectMobileProps, SelectModalMobileProps, SelectMobileProps, SelectDesktopProps, SelectProps };

package/desktop/index.d.ts

@@ -0,0 +1,2 @@
+export { SelectDesktop } from "../Component.desktop";
+export type { SelectDesktopProps } from "../typings";

package/{desktop.js → desktop/index.js}

@@ -2,35 +2,37 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Component_desktop = require('./Component.desktop.js');
+var Component_desktop = require('../Component.desktop.js');
 require('tslib');
 require('react');
 require('@alfalab/core-components-form-control/desktop');
-require('./components/arrow/Component.js');
+require('@alfalab/core-components-popover');
+require('../components/arrow/Component.js');
 require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
-require('./components/base-select/Component.js');
+require('../components/base-select/Component.js');
 require('react-merge-refs');
 require('@juggle/resize-observer');
+require('compute-scroll-into-view');
 require('downshift');
-require('@alfalab/core-components-popover');
 require('@alfalab/core-components-shared');
 require('@alfalab/hooks');
-require('./utils.js');
-require('./components/native-select/Component.js');
-require('./components/field/Component.js');
-require('./components/optgroup/Component.js');
-require('./components/option/Component.js');
-require('./components/checkmark/Component.js');
+require('../utils.js');
+require('../components/native-select/Component.js');
+require('../components/field/Component.js');
+require('../components/optgroup/Component.js');
+require('../components/option/Component.js');
+require('../components/checkmark/Component.js');
 require('@alfalab/core-components-badge');
 require('@alfalab/core-components-checkbox');
 require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
 require('@alfalab/icons-glyph/CheckmarkMIcon');
-require('./components/checkmark-mobile/Component.js');
-require('./components/options-list/Component.js');
+require('../components/checkmark-mobile/Component.js');
+require('../components/options-list/Component.js');
+require('@alfalab/core-components-mq');
 require('@alfalab/core-components-scrollbar');
-require('./consts.js');
-require('./components/search/Component.js');
+require('../consts.js');
+require('../components/search/Component.js');
 require('@alfalab/core-components-input');
 require('@alfalab/icons-glyph/MagnifierMIcon');
 

package/desktop/package.json

@@ -0,0 +1,3 @@
+{
+    "module": "../esm/desktop/index.js"
+}

package/esm/Component.desktop.d.ts

@@ -1,19 +1,6 @@
 /// <reference types="react" />
 import React from 'react';
-import { BaseFormControlProps } from "./index-ebda875c";
-import { BaseSelectProps } from "./typings";
-type FormControlDesktopProps = Omit<BaseFormControlProps, "styles" | "colorStyles">;
-type SelectFieldProps = Omit<FormControlDesktopProps, 'size'> & Record<string, unknown>;
-type SelectDesktopProps = Omit<BaseSelectProps, 'fieldProps'> & {
-    /**
-     * Пропсы, которые будут прокинуты в компонент поля
-     */
-    fieldProps?: SelectFieldProps;
-};
-declare const SelectDesktop: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "fieldProps"> & {
-    /**
-     * Пропсы, которые будут прокинуты в компонент поля
-     */
-    fieldProps?: SelectFieldProps | undefined;
+declare const SelectDesktop: React.ForwardRefExoticComponent<Omit<import("./typings").BaseSelectProps, "fieldProps"> & {
+    fieldProps?: import("./typings").SelectFieldProps | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
-export { SelectFieldProps, SelectDesktopProps, SelectDesktop };
+export { SelectDesktop };

package/esm/Component.desktop.js

@@ -1,6 +1,7 @@
 import { __rest, __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import { FormControlDesktop } from '@alfalab/core-components-form-control/esm/desktop';
+import { Popover } from '@alfalab/core-components-popover/esm';
 import { Arrow } from './components/arrow/Component.js';
 import { BaseSelect } from './components/base-select/Component.js';
 import { Field } from './components/field/Component.js';
@@ -12,8 +13,8 @@ import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import 'react-merge-refs';
 import '@juggle/resize-observer';
+import 'compute-scroll-into-view';
 import 'downshift';
-import '@alfalab/core-components-popover/esm';
 import '@alfalab/core-components-shared/esm';
 import '@alfalab/hooks';
 import './utils.js';
@@ -24,6 +25,7 @@ import '@alfalab/core-components-checkbox/esm';
 import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
 import '@alfalab/icons-glyph/CheckmarkMIcon';
 import './components/checkmark-mobile/Component.js';
+import '@alfalab/core-components-mq/esm';
 import '@alfalab/core-components-scrollbar/esm';
 import './consts.js';
 import '@alfalab/core-components-input/esm';
@@ -31,7 +33,7 @@ import '@alfalab/icons-glyph/MagnifierMIcon';
 
 var SelectDesktop = forwardRef(function (_a, ref) {
     var _b = _a.Arrow, Arrow$1 = _b === void 0 ? Arrow : _b, _c = _a.Field, Field$1 = _c === void 0 ? Field : _c, _d = _a.OptionsList, OptionsList$1 = _d === void 0 ? OptionsList : _d, _e = _a.Optgroup, Optgroup$1 = _e === void 0 ? Optgroup : _e, _f = _a.Option, Option$1 = _f === void 0 ? Option : _f, _g = _a.Search, Search$1 = _g === void 0 ? Search : _g, _h = _a.fieldProps, fieldProps = _h === void 0 ? {} : _h, restProps = __rest(_a, ["Arrow", "Field", "OptionsList", "Optgroup", "Option", "Search", "fieldProps"]);
-    return (React.createElement(BaseSelect, __assign({ ref: ref, Option: Option$1, Field: Field$1, fieldProps: __assign({ FormControlComponent: FormControlDesktop }, fieldProps), Search: Search$1, Optgroup: Optgroup$1, OptionsList: OptionsList$1, Arrow: Arrow$1 }, restProps)));
+    return (React.createElement(BaseSelect, __assign({ ref: ref, view: 'desktop', Option: Option$1, Field: Field$1, fieldProps: __assign({ FormControlComponent: FormControlDesktop }, fieldProps), Search: Search$1, Optgroup: Optgroup$1, OptionsList: OptionsList$1, Arrow: Arrow$1, Popover: Popover }, restProps)));
 });
 
 export { SelectDesktop };

package/esm/Component.mobile.d.ts

@@ -1,41 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
-import { ReactNode } from "react";
-import { BottomSheetProps } from "@alfalab/core-components-bottom-sheet";
-import { UseSelectWithApplyProps } from "./hook-8abfea97";
-import { BaseSelectProps } from "./typings";
-type AdditionalMobileProps = {
-    /**
-     * Футер
-     * @deprecated Используйте bottomSheetProps.actionButton
-     */
-    footer?: ReactNode;
-    /**
-     * Будет ли свайпаться шторка
-     * @deprecated Используйте bottomSheetProps.swipeable
-     */
-    swipeable?: boolean;
-    /**
-     * Дополнительные пропсы шторки
-     */
-    bottomSheetProps?: Partial<BottomSheetProps>;
-    /**
-     * Показывать кнопку очистки
-     */
-    showClear?: UseSelectWithApplyProps['showClear'];
-    /**
-     * Показывать пункт "Выбрать все"
-     */
-    showSelectAll?: UseSelectWithApplyProps['showSelectAll'];
-    /**
-     * Показывать пункт "Выбрать все" в заголовке списка
-     */
-    showHeaderWithSelectAll?: UseSelectWithApplyProps['showHeaderWithSelectAll'];
-    /**
-     * Использовать ли хук useSelectWithApply
-     */
-    useWithApplyHook?: boolean;
-};
-type SelectMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll'> & AdditionalMobileProps;
-declare const SelectMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "Checkmark"> & AdditionalMobileProps & React.RefAttributes<unknown>>;
-export { AdditionalMobileProps, SelectMobileProps, SelectMobile };
+import { SelectMobileProps } from "./typings";
+declare const SelectMobile: React.ForwardRefExoticComponent<SelectMobileProps & React.RefAttributes<unknown>>;
+export { SelectMobile };

package/esm/Component.mobile.js

@@ -1,34 +1,38 @@
 import { __rest, __assign } from 'tslib';
 import React, { forwardRef } from 'react';
+import { BottomSheet } from '@alfalab/core-components-bottom-sheet/esm';
 import { FormControlMobile } from '@alfalab/core-components-form-control/esm/mobile';
+import { ModalMobile } from '@alfalab/core-components-modal/esm/Component.mobile';
 import { Arrow } from './components/arrow/Component.js';
-import { BaseSelectMobile } from './components/base-select-mobile/Component.js';
-import { Footer } from './components/base-select-mobile/footer/Component.js';
+import { BaseSelect } from './components/base-select/Component.js';
 import { Field } from './components/field/Component.js';
+import { Footer } from './components/footer/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 { VirtualOptionsList } from './components/virtual-options-list/Component.js';
-import { u as useSelectWithApply } from './hook-e63a15d0.js';
+import { u as useSelectWithApply } from './hook-8209d0d1.js';
 import { Header } from './presets/useSelectWithApply/options-list-with-apply/header/Component.js';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import 'react-merge-refs';
+import '@juggle/resize-observer';
+import 'compute-scroll-into-view';
 import 'downshift';
-import '@alfalab/core-components-bottom-sheet/esm';
-import '@alfalab/core-components-modal/esm/mobile';
 import '@alfalab/core-components-shared/esm';
+import '@alfalab/hooks';
 import './utils.js';
+import './components/native-select/Component.js';
 import '@alfalab/core-components-base-modal/esm';
 import '@alfalab/core-components-button/esm/mobile';
-import '@alfalab/hooks';
 import './components/checkmark/Component.js';
 import '@alfalab/core-components-badge/esm';
 import '@alfalab/core-components-checkbox/esm';
 import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
 import '@alfalab/icons-glyph/CheckmarkMIcon';
 import './components/checkmark-mobile/Component.js';
+import '@alfalab/core-components-mq/esm';
 import '@alfalab/core-components-scrollbar/esm';
 import './consts.js';
 import '@alfalab/core-components-input/esm';
@@ -39,9 +43,11 @@ import '@alfalab/core-components-button/esm/desktop';
 
 var VIRTUAL_OPTIONS_LIST_THRESHOLD = 30;
 var SelectMobile = forwardRef(function (_a, ref) {
-    var _b = _a.autocomplete, autocomplete = _b === void 0 ? false : _b, _c = _a.multiple, multiple = _c === void 0 ? false : _c, _d = _a.allowUnselect, allowUnselect = _d === void 0 ? false : _d, _e = _a.disabled, disabled = _e === void 0 ? false : _e, _f = _a.closeOnSelect, closeOnSelect = _f === void 0 ? !multiple : _f, _g = _a.circularNavigation, circularNavigation = _g === void 0 ? false : _g, _h = _a.defaultOpen, defaultOpen = _h === void 0 ? false : _h, openProp = _a.open, _j = _a.size, size = _j === void 0 ? 'm' : _j, _k = _a.optionsSize, optionsSize = _k === void 0 ? 'm' : _k, _l = _a.fieldProps, fieldProps = _l === void 0 ? {} : _l, _m = _a.optionProps, optionProps = _m === void 0 ? {} : _m, _o = _a.optionsListProps, optionsListProps = _o === void 0 ? {} : _o, _p = _a.Arrow, Arrow$1 = _p === void 0 ? Arrow : _p, _q = _a.Field, Field$1 = _q === void 0 ? Field : _q, _r = _a.Optgroup, Optgroup$1 = _r === void 0 ? Optgroup : _r, _s = _a.Option, Option$1 = _s === void 0 ? Option : _s, _t = _a.Search, Search$1 = _t === void 0 ? Search : _t, selected = _a.selected, options = _a.options, _u = _a.OptionsList, OptionsList$1 = _u === void 0 ? options.length > VIRTUAL_OPTIONS_LIST_THRESHOLD
+    var _b = _a.autocomplete, autocomplete = _b === void 0 ? false : _b, _c = _a.multiple, multiple = _c === void 0 ? false : _c, _d = _a.allowUnselect, allowUnselect = _d === void 0 ? false : _d, _e = _a.disabled, disabled = _e === void 0 ? false : _e, _f = _a.closeOnSelect, closeOnSelect = _f === void 0 ? !multiple : _f, _g = _a.circularNavigation, circularNavigation = _g === void 0 ? false : _g, _h = _a.defaultOpen, defaultOpen = _h === void 0 ? false : _h, openProp = _a.open, _j = _a.size, size = _j === void 0 ? 'm' : _j, _k = _a.optionsSize, optionsSize = _k === void 0 ? 'm' : _k, _l = _a.fieldProps, fieldProps = _l === void 0 ? {} : _l, _m = _a.optionProps, optionProps = _m === void 0 ? {} : _m, _o = _a.optionsListProps, optionsListProps = _o === void 0 ? {} : _o, _p = _a.Arrow, Arrow$1 = _p === void 0 ? Arrow : _p, _q = _a.Field, Field$1 = _q === void 0 ? Field : _q, _r = _a.Optgroup, Optgroup$1 = _r === void 0 ? Optgroup : _r, _s = _a.Option, Option$1 = _s === void 0 ? Option : _s, _t = _a.Search, Search$1 = _t === void 0 ? Search : _t, selected = _a.selected, _u = _a.isBottomSheet, isBottomSheet = _u === void 0 ? true : _u, options = _a.options, _v = _a.OptionsList, OptionsList$1 = _v === void 0 ? options.length > VIRTUAL_OPTIONS_LIST_THRESHOLD
         ? VirtualOptionsList
-        : OptionsList : _u, onChange = _a.onChange, bottomSheetProps = _a.bottomSheetProps, _v = _a.showClear, showClear = _v === void 0 ? true : _v, showSelectAll = _a.showSelectAll, showHeaderWithSelectAll = _a.showHeaderWithSelectAll, _w = _a.useWithApplyHook, useWithApplyHook = _w === void 0 ? multiple : _w, showSearch = _a.showSearch, searchProps = _a.searchProps, restProps = __rest(_a, ["autocomplete", "multiple", "allowUnselect", "disabled", "closeOnSelect", "circularNavigation", "defaultOpen", "open", "size", "optionsSize", "fieldProps", "optionProps", "optionsListProps", "Arrow", "Field", "Optgroup", "Option", "Search", "selected", "options", "OptionsList", "onChange", "bottomSheetProps", "showClear", "showSelectAll", "showHeaderWithSelectAll", "useWithApplyHook", "showSearch", "searchProps"]);
+        : OptionsList : _v, onChange = _a.onChange, _w = _a.showClear, showClear = _w === void 0 ? true : _w, showSelectAll = _a.showSelectAll, showHeaderWithSelectAll = _a.showHeaderWithSelectAll, _x = _a.useWithApplyHook, useWithApplyHook = _x === void 0 ? multiple : _x, showSearch = _a.showSearch, searchProps = _a.searchProps, restProps = __rest(_a, ["autocomplete", "multiple", "allowUnselect", "disabled", "closeOnSelect", "circularNavigation", "defaultOpen", "open", "size", "optionsSize", "fieldProps", "optionProps", "optionsListProps", "Arrow", "Field", "Optgroup", "Option", "Search", "selected", "isBottomSheet", "options", "OptionsList", "onChange", "showClear", "showSelectAll", "showHeaderWithSelectAll", "useWithApplyHook", "showSearch", "searchProps"]);
+    var typedRestBottomSheetProps = restProps;
+    var typedRestModalProps = restProps;
     var applyProps = useSelectWithApply({
         optionsListProps: __assign(__assign({}, optionsListProps), { Footer: Footer }),
         OptionsList: OptionsList$1,
@@ -53,7 +59,14 @@ var SelectMobile = forwardRef(function (_a, ref) {
         showClear: showClear,
         showSelectAll: showSelectAll,
     });
-    return (React.createElement(BaseSelectMobile, __assign({ ref: ref, autocomplete: autocomplete, multiple: multiple, allowUnselect: allowUnselect, disabled: disabled, closeOnSelect: closeOnSelect, circularNavigation: circularNavigation, defaultOpen: defaultOpen, open: openProp, size: size, optionsSize: optionsSize, fieldProps: __assign({ FormControlComponent: FormControlMobile }, fieldProps), optionProps: optionProps, Arrow: Arrow$1, Field: Field$1, Optgroup: Optgroup$1, Option: Option$1, Search: Search$1, isBottomSheet: true, options: options, selected: selected, onChange: onChange, OptionsList: OptionsList$1, showSearch: showSearch, searchProps: searchProps, bottomSheetProps: __assign({ bottomAddons: useWithApplyHook && showHeaderWithSelectAll && (React.createElement(Header, __assign({}, applyProps.optionsListProps.headerProps, { mobile: true }))) }, bottomSheetProps), optionsListProps: optionsListProps }, restProps, (useWithApplyHook && applyProps))));
+    var bottomAddons = useWithApplyHook && showHeaderWithSelectAll && (React.createElement(Header, __assign({}, applyProps.optionsListProps.headerProps, { mobile: true })));
+    return (React.createElement(BaseSelect, __assign({ ref: ref, view: 'mobile', autocomplete: autocomplete, multiple: multiple, allowUnselect: allowUnselect, disabled: disabled, closeOnSelect: closeOnSelect, circularNavigation: circularNavigation, defaultOpen: defaultOpen, open: openProp, size: size, optionsSize: optionsSize, fieldProps: __assign({ FormControlComponent: FormControlMobile }, fieldProps), optionProps: optionProps, Arrow: Arrow$1, Field: Field$1, Optgroup: Optgroup$1, Option: Option$1, Search: Search$1, isBottomSheet: isBottomSheet, options: options, selected: selected, onChange: onChange, OptionsList: OptionsList$1, showSearch: showSearch, searchProps: searchProps, BottomSheet: BottomSheet, ModalMobile: ModalMobile }, (isBottomSheet
+        ? {
+            bottomSheetProps: __assign({ bottomAddons: bottomAddons }, typedRestBottomSheetProps.bottomSheetProps),
+        }
+        : {
+            modalHeaderProps: __assign({ bottomAddons: bottomAddons }, typedRestModalProps.modalHeaderProps),
+        }), { optionsListProps: optionsListProps }, restProps, (useWithApplyHook && applyProps))));
 });
 
 export { SelectMobile };

package/esm/Component.modal.mobile.d.ts

@@ -1,60 +1,4 @@
 /// <reference types="react" />
 import React from 'react';
-import { ModalMobile } from "./Component.mobile-f1f15074";
-import { UseSelectWithApplyProps } from "./hook-8abfea97";
-import { BaseSelectProps } from "./typings";
-type SelectModalMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll'> & {
-    /**
-     * Показывать кнопку очистки
-     */
-    showClear?: UseSelectWithApplyProps['showClear'];
-    /**
-     * Показывать пункт "Выбрать все"
-     */
-    showSelectAll?: UseSelectWithApplyProps['showSelectAll'];
-    /**
-     *  Дополнительные пропсы шапки модалки
-     */
-    modalHeaderProps?: Partial<React.ComponentProps<typeof ModalMobile.Header>>;
-    /**
-     *  Дополнительные пропсы модалки
-     */
-    modalProps?: Partial<React.ComponentProps<typeof ModalMobile>>;
-    /**
-     *  Дополнительные пропсы футера модалки
-     */
-    modalFooterProps?: Partial<React.ComponentProps<typeof ModalMobile.Footer>>;
-    showHeaderWithSelectAll?: UseSelectWithApplyProps['showHeaderWithSelectAll'];
-    /**
-     * Использовать ли хук useSelectWithApply
-     */
-    useWithApplyHook?: boolean;
-};
-declare const SelectModalMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "Checkmark"> & {
-    /**
-     * Показывать кнопку очистки
-     */
-    showClear?: UseSelectWithApplyProps['showClear'];
-    /**
-     * Показывать пункт "Выбрать все"
-     */
-    showSelectAll?: UseSelectWithApplyProps['showSelectAll'];
-    /**
-     *  Дополнительные пропсы шапки модалки
-     */
-    modalHeaderProps?: Partial<import("./Component.mobile-f1f15074").HeaderProps> | undefined;
-    /**
-     *  Дополнительные пропсы модалки
-     */
-    modalProps?: Partial<import("./typings-baf4875b").ModalMobileProps & React.RefAttributes<HTMLDivElement>> | undefined;
-    /**
-     *  Дополнительные пропсы футера модалки
-     */
-    modalFooterProps?: Partial<import("./Component.mobile-f1f15074").FooterProps> | undefined;
-    showHeaderWithSelectAll?: UseSelectWithApplyProps['showHeaderWithSelectAll'];
-    /**
-     * Использовать ли хук useSelectWithApply
-     */
-    useWithApplyHook?: boolean | undefined;
-} & React.RefAttributes<unknown>>;
-export { SelectModalMobileProps, SelectModalMobile };
+declare const SelectModalMobile: React.ForwardRefExoticComponent<Omit<import("./typings").BaseSelectProps, "Checkmark"> & import("./typings").AdditionalMobileProps & import("./typings").ModalSelectMobileProps & React.RefAttributes<unknown>>;
+export { SelectModalMobile };

package/esm/Component.modal.mobile.js

@@ -1,59 +1,47 @@
-import { __rest, __assign } from 'tslib';
+import { __assign } from 'tslib';
 import React, { forwardRef } from 'react';
-import { FormControlMobile } from '@alfalab/core-components-form-control/esm/mobile';
-import { Arrow } from './components/arrow/Component.js';
-import { BaseSelectMobile } from './components/base-select-mobile/Component.js';
-import { Footer } from './components/base-select-mobile/footer/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 { VirtualOptionsList } from './components/virtual-options-list/Component.js';
-import { u as useSelectWithApply } from './hook-e63a15d0.js';
-import { Header } from './presets/useSelectWithApply/options-list-with-apply/header/Component.js';
+import { SelectMobile } from './Component.mobile.js';
+import '@alfalab/core-components-bottom-sheet/esm';
+import '@alfalab/core-components-form-control/esm/mobile';
+import '@alfalab/core-components-modal/esm/Component.mobile';
+import './components/arrow/Component.js';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import './components/base-select/Component.js';
 import 'react-merge-refs';
+import '@juggle/resize-observer';
+import 'compute-scroll-into-view';
 import 'downshift';
-import '@alfalab/core-components-bottom-sheet/esm';
-import '@alfalab/core-components-modal/esm/mobile';
 import '@alfalab/core-components-shared/esm';
+import '@alfalab/hooks';
 import './utils.js';
-import './components/search/Component.js';
-import '@alfalab/core-components-input/esm';
-import '@alfalab/icons-glyph/MagnifierMIcon';
+import './components/native-select/Component.js';
+import './components/field/Component.js';
+import './components/footer/Component.js';
 import '@alfalab/core-components-base-modal/esm';
 import '@alfalab/core-components-button/esm/mobile';
-import '@alfalab/hooks';
+import './components/optgroup/Component.js';
+import './components/option/Component.js';
 import './components/checkmark/Component.js';
 import '@alfalab/core-components-badge/esm';
 import '@alfalab/core-components-checkbox/esm';
 import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
 import '@alfalab/icons-glyph/CheckmarkMIcon';
 import './components/checkmark-mobile/Component.js';
+import './components/options-list/Component.js';
+import '@alfalab/core-components-mq/esm';
 import '@alfalab/core-components-scrollbar/esm';
 import './consts.js';
+import './components/search/Component.js';
+import '@alfalab/core-components-input/esm';
+import '@alfalab/icons-glyph/MagnifierMIcon';
+import './components/virtual-options-list/Component.js';
 import 'react-virtual';
+import './hook-8209d0d1.js';
 import './presets/useSelectWithApply/options-list-with-apply/footer/Component.js';
 import '@alfalab/core-components-button/esm/desktop';
+import './presets/useSelectWithApply/options-list-with-apply/header/Component.js';
 
-var VIRTUAL_OPTIONS_LIST_THRESHOLD = 30;
-var SelectModalMobile = forwardRef(function (_a, ref) {
-    var _b = _a.autocomplete, autocomplete = _b === void 0 ? false : _b, _c = _a.multiple, multiple = _c === void 0 ? false : _c, _d = _a.allowUnselect, allowUnselect = _d === void 0 ? false : _d, _e = _a.disabled, disabled = _e === void 0 ? false : _e, _f = _a.closeOnSelect, closeOnSelect = _f === void 0 ? !multiple : _f, _g = _a.circularNavigation, circularNavigation = _g === void 0 ? false : _g, _h = _a.defaultOpen, defaultOpen = _h === void 0 ? false : _h, openProp = _a.open, _j = _a.size, size = _j === void 0 ? 'm' : _j, _k = _a.optionsSize, optionsSize = _k === void 0 ? 'm' : _k, _l = _a.fieldProps, fieldProps = _l === void 0 ? {} : _l, _m = _a.optionProps, optionProps = _m === void 0 ? {} : _m, _o = _a.optionsListProps, optionsListProps = _o === void 0 ? {} : _o, _p = _a.Arrow, Arrow$1 = _p === void 0 ? Arrow : _p, _q = _a.Field, Field$1 = _q === void 0 ? Field : _q, _r = _a.Optgroup, Optgroup$1 = _r === void 0 ? Optgroup : _r, _s = _a.Option, Option$1 = _s === void 0 ? Option : _s, selected = _a.selected, options = _a.options, _t = _a.OptionsList, OptionsList$1 = _t === void 0 ? options.length > VIRTUAL_OPTIONS_LIST_THRESHOLD
-        ? VirtualOptionsList
-        : OptionsList : _t, onChange = _a.onChange, _u = _a.showClear, showClear = _u === void 0 ? true : _u, showSelectAll = _a.showSelectAll, _v = _a.useWithApplyHook, useWithApplyHook = _v === void 0 ? multiple : _v, modalHeaderProps = _a.modalHeaderProps, showHeaderWithSelectAll = _a.showHeaderWithSelectAll, showSearch = _a.showSearch, searchProps = _a.searchProps, restProps = __rest(_a, ["autocomplete", "multiple", "allowUnselect", "disabled", "closeOnSelect", "circularNavigation", "defaultOpen", "open", "size", "optionsSize", "fieldProps", "optionProps", "optionsListProps", "Arrow", "Field", "Optgroup", "Option", "selected", "options", "OptionsList", "onChange", "showClear", "showSelectAll", "useWithApplyHook", "modalHeaderProps", "showHeaderWithSelectAll", "showSearch", "searchProps"]);
-    var applyProps = useSelectWithApply({
-        optionsListProps: __assign(__assign({}, optionsListProps), { Footer: Footer }),
-        OptionsList: OptionsList$1,
-        selected: selected,
-        options: options,
-        onChange: onChange,
-        showSearch: showSearch,
-        searchProps: searchProps,
-        showClear: showClear,
-        showSelectAll: showSelectAll,
-    });
-    return (React.createElement(BaseSelectMobile, __assign({ ref: ref, autocomplete: autocomplete, multiple: multiple, allowUnselect: allowUnselect, disabled: disabled, closeOnSelect: closeOnSelect, circularNavigation: circularNavigation, defaultOpen: defaultOpen, open: openProp, size: size, optionsSize: optionsSize, fieldProps: __assign({ FormControlComponent: FormControlMobile }, fieldProps), optionProps: optionProps, Arrow: Arrow$1, Field: Field$1, Optgroup: Optgroup$1, Option: Option$1, isBottomSheet: false, options: options, selected: selected, onChange: onChange, OptionsList: OptionsList$1, optionsListProps: optionsListProps, showSearch: showSearch, searchProps: searchProps, modalHeaderProps: __assign({ bottomAddons: useWithApplyHook && showHeaderWithSelectAll && (React.createElement(Header, __assign({}, applyProps.optionsListProps.headerProps, { mobile: true }))) }, modalHeaderProps) }, restProps, (useWithApplyHook && applyProps))));
-});
+var SelectModalMobile = forwardRef(function (props, ref) { return (React.createElement(SelectMobile, __assign({}, props, { isBottomSheet: false, ref: ref }))); });
 
 export { SelectModalMobile };

package/esm/Component.responsive.d.ts

@@ -1,19 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
-import { AdditionalMobileProps } from "./Component.mobile";
-import { BaseSelectProps } from "./typings";
-type SelectResponsiveProps = BaseSelectProps & AdditionalMobileProps & {
-    /**
-     * Контрольная точка, с нее начинается desktop версия
-     * @default 1024
-     */
-    breakpoint?: number;
-};
-declare const SelectResponsive: React.ForwardRefExoticComponent<BaseSelectProps & AdditionalMobileProps & {
-    /**
-     * Контрольная точка, с нее начинается desktop версия
-     * @default 1024
-     */
-    breakpoint?: number | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
-export { SelectResponsiveProps, SelectResponsive };
+import { SelectProps } from "./typings";
+declare const SelectResponsive: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLDivElement>>;
+export { SelectResponsive };