@alfalab/core-components-select 14.3.4 → 15.0.0

package/esm/presets/useSelectWithApply/hook.js

@@ -1,41 +1,15 @@
 import 'tslib';
 import 'react';
-import '../../Component.js';
-import 'classnames';
-import '@alfalab/icons-glyph/ChevronDownMIcon';
-import '../../components/base-select/Component.js';
-export { b as SELECT_ALL_KEY, u as useSelectWithApply } from '../../Component-5e2bc757.js';
-import '@alfalab/core-components-form-control/esm';
-import '@alfalab/hooks';
 import '../../utils.js';
-import '@alfalab/core-components-badge/esm';
-import '@alfalab/core-components-checkbox/esm';
-import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
-import '@alfalab/icons-glyph/CheckmarkMIcon';
+export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../../hook-326a5cea.js';
 import '../../components/options-list/Component.js';
-import '../../components/virtual-options-list/Component.js';
-import '@alfalab/core-components-skeleton/esm';
-import '../../intersection-observer-6768cbd0.js';
-import '../../components/arrow/Component.js';
-import '../../components/field/Component.js';
-import '../../components/optgroup/Component.js';
-import '../../components/option/Component.js';
-import '../../components/checkmark/Component.js';
-import '../../components/checkmark-mobile/Component.js';
 import 'react-merge-refs';
-import '@juggle/resize-observer';
-import 'downshift';
-import '@alfalab/core-components-popover/esm';
-import '../../getDataTestId-fc7d4653.js';
-import '../../components/native-select/Component.js';
+import 'classnames';
 import '@alfalab/core-components-scrollbar/esm';
+import '@alfalab/hooks';
 import '../../consts.js';
-import './options-list-with-apply/header/Component.js';
-import '../../components/base-select-mobile/Component.js';
-import '@alfalab/core-components-bottom-sheet/esm';
-import '@alfalab/core-components-modal/esm/mobile';
-import '../../components/base-select-mobile/footer/Component.js';
-import '@alfalab/core-components-base-modal/esm';
-import '@alfalab/core-components-button/esm';
+import '../../components/optgroup/Component.js';
 import './options-list-with-apply/footer/Component.js';
-import 'react-virtual';
+import '@alfalab/core-components-button/esm/desktop';
+import './options-list-with-apply/header/Component.js';
+import '@alfalab/core-components-checkbox/esm';

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

@@ -2,7 +2,7 @@ import 'tslib';
 import 'react';
 import '../../../components/options-list/Component.js';
 import '../../../consts.js';
-export { O as OptionsListWithApply } from '../../../Component-5e2bc757.js';
+export { O as OptionsListWithApply } from '../../../hook-326a5cea.js';
 import './footer/Component.js';
 import './header/Component.js';
 import 'react-merge-refs';
@@ -11,31 +11,5 @@ import '@alfalab/core-components-scrollbar/esm';
 import '@alfalab/hooks';
 import '../../../utils.js';
 import '../../../components/optgroup/Component.js';
-import '../../../Component.js';
-import '../../../components/arrow/Component.js';
-import '@alfalab/icons-glyph/ChevronDownMIcon';
-import '../../../components/base-select/Component.js';
-import '@juggle/resize-observer';
-import 'downshift';
-import '@alfalab/core-components-popover/esm';
-import '../../../getDataTestId-fc7d4653.js';
-import '../../../components/native-select/Component.js';
-import '../../../components/field/Component.js';
-import '@alfalab/core-components-form-control/esm';
-import '../../../components/option/Component.js';
-import '../../../components/checkmark/Component.js';
-import '@alfalab/core-components-badge/esm';
+import '@alfalab/core-components-button/esm/desktop';
 import '@alfalab/core-components-checkbox/esm';
-import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
-import '@alfalab/icons-glyph/CheckmarkMIcon';
-import '../../../components/checkmark-mobile/Component.js';
-import '../../../components/base-select-mobile/Component.js';
-import '@alfalab/core-components-bottom-sheet/esm';
-import '@alfalab/core-components-modal/esm/mobile';
-import '../../../components/base-select-mobile/footer/Component.js';
-import '@alfalab/core-components-base-modal/esm';
-import '@alfalab/core-components-button/esm';
-import '../../../components/virtual-options-list/Component.js';
-import 'react-virtual';
-import '@alfalab/core-components-skeleton/esm';
-import '../../../intersection-observer-6768cbd0.js';

package/esm/presets/useSelectWithApply/options-list-with-apply/footer/Component.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import React from 'react';
 import { OptionShape } from "../../../../typings";
 type FooterProps = {
     handleClear?: () => void;
@@ -6,5 +7,5 @@ type FooterProps = {
     showClear?: boolean;
     selectedDraft?: OptionShape[];
 };
-declare const Footer: ({ handleApply, handleClear, showClear, selectedDraft, }: FooterProps) => JSX.Element;
+declare const Footer: ({ handleApply, handleClear, showClear, selectedDraft, }: FooterProps) => React.JSX.Element;
 export { FooterProps, Footer };

package/esm/presets/useSelectWithApply/options-list-with-apply/footer/Component.js

@@ -1,7 +1,7 @@
 import React from 'react';
-import { Button } from '@alfalab/core-components-button/esm';
+import { ButtonDesktop } from '@alfalab/core-components-button/esm/desktop';
 
-var styles = {"footer":"select__footer_1i4dv"};
+var styles = {"footer":"select__footer_1qxo7"};
 require('./index.css')
 
 var Footer = function (_a) {
@@ -9,8 +9,8 @@ var Footer = function (_a) {
     return (React.createElement("div", { 
         // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
         tabIndex: 0, className: styles.footer },
-        React.createElement(Button, { size: 'xxs', view: 'primary', onClick: handleApply }, "\u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C"),
-        showClear && selectedDraft.length > 0 && (React.createElement(Button, { size: 'xxs', view: 'secondary', onClick: handleClear }, "\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C"))));
+        React.createElement(ButtonDesktop, { size: 'xxs', view: 'primary', onClick: handleApply }, "\u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C"),
+        showClear && selectedDraft.length > 0 && (React.createElement(ButtonDesktop, { size: 'xxs', view: 'secondary', onClick: handleClear }, "\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C"))));
 };
 
 export { Footer };

package/esm/presets/useSelectWithApply/options-list-with-apply/footer/index.css

@@ -1,4 +1,4 @@
-/* hash: ix8ku */
+/* hash: 1gkfz */
 :root {
 } /* deprecated */ :root {
     --color-light-bg-primary: #fff; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -17,10 +17,10 @@
     --gap-s: 12px;
 } :root {
 } :root {
-} .select__footer_1i4dv {
+} .select__footer_1qxo7 {
     background-color: var(--color-light-bg-primary);
     padding: var(--gap-s);
     outline: none
-} .select__footer_1i4dv > * + * {
+} .select__footer_1qxo7 > * + * {
         margin-left: var(--gap-xs);
     }

package/esm/presets/useSelectWithApply/options-list-with-apply/header/Component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { Checkbox } from '@alfalab/core-components-checkbox/esm';
 
-var styles = {"desktop":"select__desktop_1quue","mobile":"select__mobile_1quue"};
+var styles = {"desktop":"select__desktop_12ysm","mobile":"select__mobile_12ysm"};
 require('./index.css')
 
 var Header = function (_a) {

package/esm/presets/useSelectWithApply/options-list-with-apply/header/index.css

@@ -1,4 +1,4 @@
-/* hash: 102hh */
+/* hash: h8ahs */
 :root {
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,8 +16,8 @@
     --gap-s: 12px;
 } :root {
 } :root {
-} .select__desktop_1quue {
+} .select__desktop_12ysm {
     padding: var(--gap-s);
-} .select__mobile_1quue {
+} .select__mobile_12ysm {
     padding: var(--gap-s) var(--gap-xs);
 }

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

@@ -1 +1 @@
-export * from "../../../Component-5e2bc757";
+export * from "../../../hook-326a5cea";

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

@@ -1,41 +1,15 @@
-export { O as OptionsListWithApply } from '../../../Component-5e2bc757.js';
+export { O as OptionsListWithApply } from '../../../hook-326a5cea.js';
 import 'tslib';
 import 'react';
-import '../../../Component.js';
-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 'downshift';
-import '@alfalab/core-components-popover/esm';
-import '@alfalab/hooks';
-import '../../../getDataTestId-fc7d4653.js';
 import '../../../utils.js';
-import '../../../components/native-select/Component.js';
-import '../../../components/field/Component.js';
-import '@alfalab/core-components-form-control/esm';
-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 'react-merge-refs';
+import 'classnames';
 import '@alfalab/core-components-scrollbar/esm';
+import '@alfalab/hooks';
 import '../../../consts.js';
-import './header/Component.js';
-import '../../../components/base-select-mobile/Component.js';
-import '@alfalab/core-components-bottom-sheet/esm';
-import '@alfalab/core-components-modal/esm/mobile';
-import '../../../components/base-select-mobile/footer/Component.js';
-import '@alfalab/core-components-base-modal/esm';
-import '@alfalab/core-components-button/esm';
-import '../../../components/virtual-options-list/Component.js';
-import 'react-virtual';
-import '@alfalab/core-components-skeleton/esm';
-import '../../../intersection-observer-6768cbd0.js';
+import '../../../components/optgroup/Component.js';
 import './footer/Component.js';
+import '@alfalab/core-components-button/esm/desktop';
+import './header/Component.js';
+import '@alfalab/core-components-checkbox/esm';

package/esm/presets/useSelectWithLoading/hook.d.ts

@@ -7,7 +7,7 @@ type useSelectWithLoadingProps = {
     Option?: React.FC<OptionProps>;
 };
 declare function useSelectWithLoading({ loading, visibleOptions, Option, }: useSelectWithLoadingProps): {
-    Option: (props: OptionProps) => JSX.Element;
+    Option: (props: OptionProps) => React.JSX.Element;
     options: OptionShape[];
 } | null;
 export { useSelectWithLoading };

package/esm/presets/useSelectWithLoading/hook.js

@@ -10,7 +10,7 @@ import '@alfalab/icons-glyph/CheckmarkCircleMIcon';
 import '@alfalab/icons-glyph/CheckmarkMIcon';
 import '../../components/checkmark-mobile/Component.js';
 
-var styles = {"skeleton":"select__skeleton_192cd"};
+var styles = {"skeleton":"select__skeleton_1xtgg"};
 require('./index.css')
 
 function useSelectWithLoading(_a) {

package/esm/presets/useSelectWithLoading/index.css

@@ -1,5 +1,5 @@
-/* hash: 1c03p */
-.select__skeleton_192cd {
+/* hash: 1if7p */
+.select__skeleton_1xtgg {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);

package/esm/shared.d.ts

@@ -0,0 +1,5 @@
+export * from "./components/index";
+export * from "./presets/index";
+export * from "./typings";
+export * from "./utils";
+export type { AdditionalMobileProps } from "./Component.mobile";

package/esm/shared.js

@@ -0,0 +1,37 @@
+export { Arrow } from './components/arrow/Component.js';
+export { BaseSelect } from './components/base-select/Component.js';
+export { Field } from './components/field/Component.js';
+export { Optgroup } from './components/optgroup/Component.js';
+export { Option } from './components/option/Component.js';
+export { OptionsList } from './components/options-list/Component.js';
+export { VirtualOptionsList } from './components/virtual-options-list/Component.js';
+export { BaseOption } from './components/base-option/Component.js';
+export { useSelectWithLoading } from './presets/useSelectWithLoading/hook.js';
+export { useLazyLoading } from './presets/useLazyLoading/hook.js';
+export { S as SELECT_ALL_KEY, u as useSelectWithApply } from './hook-326a5cea.js';
+export { isGroup, isOptionShape, joinOptions, lastIndexOf, processOptions, usePrevious, useVisibleOptions } from './utils.js';
+import 'react';
+import 'classnames';
+import '@alfalab/icons-glyph/ChevronDownMIcon';
+import 'tslib';
+import 'react-merge-refs';
+import '@juggle/resize-observer';
+import 'downshift';
+import '@alfalab/core-components-popover/esm';
+import '@alfalab/core-components-shared/esm';
+import '@alfalab/hooks';
+import './components/native-select/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 '@alfalab/core-components-scrollbar/esm';
+import './consts.js';
+import 'react-virtual';
+import './components/base-checkmark/Component.js';
+import '@alfalab/core-components-skeleton/esm';
+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';

package/esm/typings-9211a437.d.ts

@@ -0,0 +1,95 @@
+import { AnchorHTMLAttributes, ButtonHTMLAttributes, ElementType, ReactNode } from 'react';
+type StyleColors = {
+    default: {
+        [key: string]: string;
+    };
+    inverted: {
+        [key: string]: string;
+    };
+};
+type ComponentProps = {
+    /**
+     * Тип кнопки
+     * @default secondary
+     */
+    view?: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'outlined' | 'filled' | 'transparent' | 'link' | 'ghost';
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Размер компонента
+     * @default m
+     */
+    size?: 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
+    /**
+     * Растягивает компонент на ширину контейнера
+     * @default false
+     */
+    block?: boolean;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для спиннера
+     */
+    spinnerClassName?: string;
+    /**
+     * Выводит ссылку в виде кнопки
+     */
+    href?: string;
+    /**
+     * Позволяет использовать кастомный компонент для кнопки (например Link из роутера)
+     */
+    Component?: ElementType;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Показать лоадер
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Не переносить текст кнопки на новую строку
+     * @default false
+     */
+    nowrap?: boolean;
+    /**
+     * Набор цветов для компонента
+     */
+    colors?: 'default' | 'inverted';
+    /**
+     * Дочерние элементы.
+     */
+    children?: ReactNode;
+    /**
+     * Основные стили компонента.
+     */
+    styles: {
+        [key: string]: string;
+    };
+    /**
+     * Стили компонента для default и inverted режима.
+     */
+    colorStylesMap: StyleColors;
+};
+type AnchorBaseButtonProps = ComponentProps & AnchorHTMLAttributes<HTMLAnchorElement>;
+type NativeBaseButtonProps = ComponentProps & ButtonHTMLAttributes<HTMLButtonElement>;
+type BaseButtonProps = Partial<AnchorBaseButtonProps | NativeBaseButtonProps>;
+type AnchorButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & AnchorHTMLAttributes<HTMLAnchorElement>;
+type NativeButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & ButtonHTMLAttributes<HTMLButtonElement>;
+type ButtonProps = Partial<AnchorButtonProps | NativeButtonProps> & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+};
+export { StyleColors, ComponentProps, AnchorBaseButtonProps, NativeBaseButtonProps, BaseButtonProps, AnchorButtonProps, NativeButtonProps, ButtonProps };

package/esm/typings-baf4875b.d.ts

@@ -0,0 +1,52 @@
+import { ReactNode } from 'react';
+import { BaseModalProps } from "@alfalab/core-components-base-modal";
+type ModalDesktopProps = BaseModalProps & {
+    /**
+     * Ширина модального окна
+     * @default "m"
+     */
+    size?: 's' | 'm' | 'l' | 'xl' | 'fullscreen';
+    /**
+     * Растягивает модальное окно на весь экран
+     * @deprecated Используйте размер fullscreen
+     */
+    fullscreen?: boolean;
+    /**
+     * Фиксирует позицию модального окна после открытия,
+     * предотвращая скачки, если контент внутри будет меняться
+     */
+    fixedPosition?: boolean;
+    /**
+     * Управление наличием закрывающего крестика
+     * @default false
+     */
+    hasCloser?: boolean;
+};
+type ModalMobileProps = Omit<ModalDesktopProps, 'size' | 'fixedPosition' | 'fullscreen'>;
+type ModalResponsiveProps = ModalDesktopProps & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+};
+type View = 'desktop' | 'mobile';
+type TResponsiveModalContext = {
+    view: View;
+    size: NonNullable<ModalDesktopProps['size']>;
+};
+type ContentProps = {
+    /**
+     * Контент
+     */
+    children?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Растягивает контент на всю высоту
+     */
+    flex?: boolean;
+};
+export { ModalDesktopProps, ModalMobileProps, ModalResponsiveProps, View, TResponsiveModalContext, ContentProps };

package/hook-6e94be9c.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import React from 'react';
+import { OptionShape, OptionsListProps } from "./typings";
+import { FooterProps } from "./presets/useSelectWithApply/options-list-with-apply/footer/Component";
+import { HeaderProps } from "./presets/useSelectWithApply/options-list-with-apply/header/Component";
+declare const OptionsListWithApply: React.ForwardRefExoticComponent<OptionsListProps & {
+    showClear?: boolean | undefined;
+    onClose?: (() => void) | undefined;
+    selectedDraft?: OptionShape[] | undefined;
+    OptionsList?: React.FC<OptionsListProps & React.RefAttributes<HTMLDivElement>> | undefined;
+    Footer?: React.FC<FooterProps> | undefined;
+    Header?: React.FC<HeaderProps> | undefined;
+    headerProps?: HeaderProps | undefined;
+    showHeaderWithSelectAll?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { OptionsListWithApply };

package/hook-6e94be9c.js

@@ -0,0 +1,110 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var utils = require('./utils.js');
+var components_optionsList_Component = require('./components/options-list/Component.js');
+var consts = require('./consts.js');
+var presets_useSelectWithApply_optionsListWithApply_footer_Component = require('./presets/useSelectWithApply/options-list-with-apply/footer/Component.js');
+var presets_useSelectWithApply_optionsListWithApply_header_Component = require('./presets/useSelectWithApply/options-list-with-apply/header/Component.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var OptionsListWithApply = React.forwardRef(function (_a, ref) {
+    var toggleMenu = _a.toggleMenu, defaultGetOptionProps = _a.getOptionProps, _b = _a.showClear, showClear = _b === void 0 ? true : _b, showHeaderWithSelectAll = _a.showHeaderWithSelectAll, _c = _a.selectedDraft, selectedDraft = _c === void 0 ? [] : _c, _d = _a.flatOptions, flatOptions = _d === void 0 ? [] : _d, _e = _a.OptionsList, OptionsList = _e === void 0 ? components_optionsList_Component.OptionsList : _e, _f = _a.onApply, onApply = _f === void 0 ? function () { return null; } : _f, _g = _a.onClear, onClear = _g === void 0 ? function () { return null; } : _g, _h = _a.onClose, onClose = _h === void 0 ? function () { return null; } : _h, _j = _a.visibleOptions, visibleOptions = _j === void 0 ? consts.DEFAULT_VISIBLE_OPTIONS : _j, _k = _a.Footer, Footer = _k === void 0 ? presets_useSelectWithApply_optionsListWithApply_footer_Component.Footer : _k, _l = _a.Header, Header = _l === void 0 ? presets_useSelectWithApply_optionsListWithApply_header_Component.Header : _l, headerProps = _a.headerProps, restProps = tslib.__rest(_a, ["toggleMenu", "getOptionProps", "showClear", "showHeaderWithSelectAll", "selectedDraft", "flatOptions", "OptionsList", "onApply", "onClear", "onClose", "visibleOptions", "Footer", "Header", "headerProps"]);
+    var getOptionProps = React.useCallback(function (option, index) {
+        var optionProps = defaultGetOptionProps(option, index);
+        var selected = option.key === SELECT_ALL_KEY
+            ? selectedDraft.length === flatOptions.length - 1
+            : selectedDraft.includes(option);
+        return tslib.__assign(tslib.__assign({}, optionProps), { selected: selected });
+    }, [defaultGetOptionProps, flatOptions.length, selectedDraft]);
+    var handleApply = React.useCallback(function () {
+        onApply();
+        toggleMenu();
+    }, [onApply, toggleMenu]);
+    var handleClear = React.useCallback(function () {
+        onClear();
+        toggleMenu();
+    }, [onClear, toggleMenu]);
+    React.useEffect(function () {
+        var activeElement = document.activeElement;
+        return function () {
+            onClose();
+            if (activeElement) {
+                activeElement.focus();
+            }
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    return (React__default.default.createElement(OptionsList, tslib.__assign({}, restProps, { ref: ref, visibleOptions: visibleOptions, toggleMenu: toggleMenu, flatOptions: flatOptions, getOptionProps: getOptionProps, onApply: handleApply, onClear: handleClear, header: showHeaderWithSelectAll ? React__default.default.createElement(Header, tslib.__assign({}, headerProps)) : undefined, footer: React__default.default.createElement(Footer, { handleApply: handleApply, handleClear: handleClear, showClear: showClear, selectedDraft: selectedDraft }) })));
+});
+
+var SELECT_ALL_KEY = 'select_all';
+var selectAllOption = { key: SELECT_ALL_KEY, content: 'Выбрать все' };
+function useSelectWithApply(_a) {
+    var options = _a.options, selected = _a.selected, _b = _a.onChange, onChange = _b === void 0 ? function () { return null; } : _b, OptionsList = _a.OptionsList, _c = _a.optionsListProps, optionsListProps = _c === void 0 ? {} : _c, _d = _a.showClear, showClear = _d === void 0 ? true : _d, _e = _a.showSelectAll, showSelectAll = _e === void 0 ? false : _e, _f = _a.showHeaderWithSelectAll, showHeaderWithSelectAll = _f === void 0 ? false : _f;
+    var _g = React.useMemo(function () { return utils.processOptions(options, selected); }, [options, selected]), flatOptions = _g.flatOptions, selectedOptions = _g.selectedOptions;
+    var _h = React.useState(selectedOptions), selectedDraft = _h[0], setSelectedDraft = _h[1];
+    var selectedOptionsRef = React.useRef(selectedOptions);
+    var handleApply = function () {
+        onChange({
+            selected: selectedDraft[0],
+            selectedMultiple: selectedDraft,
+            initiator: null,
+        });
+    };
+    var handleClear = function () {
+        setSelectedDraft([]);
+        onChange({
+            selected: null,
+            selectedMultiple: [],
+            initiator: null,
+        });
+    };
+    var handleToggleAll = function () {
+        setSelectedDraft(flatOptions.length === selectedDraft.length ? [] : flatOptions);
+    };
+    var handleChange = function (_a) {
+        var initiator = _a.initiator, restArgs = tslib.__rest(_a, ["initiator"]);
+        if (!initiator) {
+            onChange(tslib.__assign({ initiator: null }, restArgs));
+            return;
+        }
+        var initiatorSelected = selectedDraft.includes(initiator) ||
+            (initiator.key === SELECT_ALL_KEY && selectedDraft.length === flatOptions.length);
+        if (initiator.key === SELECT_ALL_KEY) {
+            setSelectedDraft(initiatorSelected ? [] : flatOptions);
+        }
+        else {
+            setSelectedDraft(initiatorSelected
+                ? selectedDraft.filter(function (o) { return o !== initiator; })
+                : selectedDraft.concat(initiator));
+        }
+    };
+    var handleClose = function () { return setSelectedDraft(selectedOptionsRef.current); };
+    React.useEffect(function () {
+        setSelectedDraft(selectedOptions);
+        selectedOptionsRef.current = selectedOptions;
+    }, [selectedOptions]);
+    var memoizedOptions = React.useMemo(function () { return (showSelectAll ? tslib.__spreadArray([selectAllOption], options, true) : options); }, [options, showSelectAll]);
+    return {
+        OptionsList: OptionsListWithApply,
+        optionsListProps: tslib.__assign(tslib.__assign({}, optionsListProps), { OptionsList: OptionsList, showClear: showClear, onClear: handleClear, onApply: handleApply, onClose: handleClose, selectedDraft: selectedDraft, showHeaderWithSelectAll: showHeaderWithSelectAll, headerProps: {
+                indeterminate: !!selectedDraft.length && selectedDraft.length < flatOptions.length,
+                checked: selectedDraft.length === flatOptions.length,
+                onChange: handleToggleAll,
+            } }),
+        allowUnselect: true,
+        multiple: true,
+        options: memoizedOptions,
+        onChange: handleChange,
+        selected: selected,
+    };
+}
+
+exports.OptionsListWithApply = OptionsListWithApply;
+exports.SELECT_ALL_KEY = SELECT_ALL_KEY;
+exports.useSelectWithApply = useSelectWithApply;

package/{hook-b4e70cb0.d.ts → hook-9ea9e32c.d.ts}

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { BaseSelectProps, OptionShape } from "./index";
+import { BaseSelectProps, OptionShape } from "./typings";
 type UseSelectWithApplyProps = {
     /**
      * Список выбранных пунктов
@@ -36,18 +36,20 @@ type UseSelectWithApplyProps = {
 };
 declare const SELECT_ALL_KEY = "select_all";
 declare function useSelectWithApply({ options, selected, onChange, OptionsList, optionsListProps, showClear, showSelectAll, showHeaderWithSelectAll, }: UseSelectWithApplyProps): {
-    OptionsList: import("react").ForwardRefExoticComponent<import("./index").OptionsListProps & {
+    OptionsList: import("react").ForwardRefExoticComponent<import("./typings").OptionsListProps & {
         showClear?: boolean | undefined;
         onClose?: (() => void) | undefined;
         selectedDraft?: OptionShape[] | undefined;
-        OptionsList?: import("react").FC<import("./index").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
+        OptionsList?: import("react").FC<import("./typings").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
         Footer?: import("react").FC<import("./presets/useSelectWithApply/options-list-with-apply/footer/Component").FooterProps> | undefined;
         Header?: import("react").FC<import("./presets/useSelectWithApply/options-list-with-apply/header/Component").HeaderProps> | undefined;
-        headerProps?: import("./presets/useSelectWithApply/options-list-with-apply/header/Component").HeaderProps | undefined;
+        headerProps?: import("./presets/useSelectWithApply/options-list-with-apply/header/Component").HeaderProps | undefined; /**
+         * Показывать кнопку очистки
+         */
         showHeaderWithSelectAll?: boolean | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
     optionsListProps: {
-        OptionsList: import("react").FC<import("./index").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
+        OptionsList: import("react").FC<import("./typings").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
         showClear: boolean;
         onClear: () => void;
         onApply: () => void;
@@ -62,11 +64,11 @@ declare function useSelectWithApply({ options, selected, onChange, OptionsList,
     };
     allowUnselect: boolean;
     multiple: boolean;
-    options: (OptionShape | import("./index").GroupShape | {
+    options: (OptionShape | import("./typings").GroupShape | {
         key: string;
         content: string;
     })[];
-    onChange: (payload: import("./index").BaseSelectChangePayload) => void;
+    onChange: (payload: import("./typings").BaseSelectChangePayload) => void;
     selected: string | OptionShape | (string | OptionShape)[] | null | undefined;
 };
 export { UseSelectWithApplyProps, SELECT_ALL_KEY, useSelectWithApply };