@alfalab/core-components-input-autocomplete 9.3.26 → 9.4.1

package/Component-3885b0d7.d.ts

@@ -51,7 +51,7 @@ type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
 type NativeProps = HTMLAttributes<HTMLSpanElement>;
 type TextBaseProps = {
     /**
-     * [Вариант начертания](https://core-ds.github.io/core-components/master/?path=/docs/guidelines-typography--page)
+     * [Вариант начертания](https://core-ds.github.io/core-components/master/?path=/docs/tokens-assets-типографика--docs)
      */
     view?: "primary-large" | "primary-medium" | "primary-small" | "secondary-large" | "secondary-medium" | "secondary-small" | "component" | "caps";
     /**

package/Component-425c8522.d.ts

@@ -0,0 +1,53 @@
+/// <reference types="react" />
+import React from 'react';
+import { BackgroundColorType, GraphicColorType } from "./index-425c8522";
+type IconColorType = Extract<GraphicColorType, 'positive' | 'attention' | 'link' | 'negative' | 'tertiary' | 'secondary' | 'primary'>;
+type BadgeProps = {
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     *  Вид компонента
+     */
+    view: 'icon' | 'count';
+    /**
+     * Размер компонента (только для view=icon)
+     * //deprecated(используйте height для view=count )
+     */
+    size?: 's' | 'm' | 'l' | 'xl';
+    /**
+     *  Видимость белой обводки вокруг иконки
+     */
+    visibleIconOutline?: boolean;
+    /**
+     *  Видимость цветной обводки вокруг иконки (только для view=icon)
+     */
+    visibleColorOutline?: boolean;
+    /**
+     * Контент компонента
+     */
+    content?: React.ReactElement | number;
+    /**
+     * Высота компонента, min = 16; max = 48 (только для view=count)
+     */
+    height?: number;
+    /**
+     * Цветовое оформление бейджа при view='count'
+     */
+    color?: Extract<BackgroundColorType, 'accent' | 'primary' | 'specialbg-secondary-transparent'>;
+    /**
+     * Цветовое оформление бейджа при view='icon'
+     */
+    iconColor?: IconColorType;
+    /**
+     * Цвет подложки под иконкой
+     */
+    iconUnderlayColor?: Extract<GraphicColorType, 'primary' | 'static-light'>;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+declare const Badge: ({ className, size, view, visibleIconOutline, visibleColorOutline, content, height, iconColor, color, iconUnderlayColor, dataTestId, }: BadgeProps) => JSX.Element;
+export { IconColorType, BadgeProps, Badge };

package/Component-5e1b8383.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import React from 'react';
+import { OptionsListProps } from "./typings-5e1b8383";
+declare const VirtualOptionsList: React.ForwardRefExoticComponent<OptionsListProps & React.RefAttributes<HTMLDivElement>>;
+export { VirtualOptionsList };

package/Component-aed0af6e.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import React from 'react';
+import { CheckboxProps } from "./index-ebda875c";
+type HeaderProps = {
+    checked?: boolean;
+    indeterminate?: boolean;
+    onChange?: CheckboxProps['onChange'];
+    mobile?: boolean;
+};
+declare const Header: React.FC<HeaderProps>;
+export { HeaderProps, Header };

package/Component-b4e70cb0.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { OptionShape, OptionsListProps } from "./typings-5e1b8383";
+import React from 'react';
+import { HeaderProps } from "./Component-aed0af6e";
+type FooterProps = {
+    handleClear?: () => void;
+    handleApply?: () => void;
+    showClear?: boolean;
+    selectedDraft?: OptionShape[];
+};
+declare const Footer: ({ handleApply, handleClear, showClear, selectedDraft }: FooterProps) => JSX.Element;
+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 { FooterProps, Footer, OptionsListWithApply };

package/Component-bdb4c6b9.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+type FooterProps = {
+    handleClear?: () => void;
+    handleApply?: () => void;
+    showClear?: boolean;
+};
+declare const Footer: ({ handleApply, handleClear, showClear }: FooterProps) => JSX.Element;
+export { FooterProps, Footer };

package/Component-ebda875c.d.ts

@@ -0,0 +1,101 @@
+/// <reference types="react-transition-group" />
+/// <reference types="react" />
+import React from 'react';
+import { CSSProperties, MutableRefObject, ReactNode } from "react";
+import { CSSTransitionProps } from 'react-transition-group/CSSTransition';
+import { BasePlacement, VariationPlacement } from '@popperjs/core';
+type RefElement = HTMLElement | null;
+type Position = BasePlacement | VariationPlacement;
+type PopoverProps = {
+    /**
+     * Управление состоянием поповера (открыт/закрыт)
+     */
+    open: boolean;
+    /**
+     * Элемент, относительного которого появляется поповер
+     */
+    anchorElement: RefElement;
+    /**
+     * Использовать ширину родительского элемента
+     */
+    useAnchorWidth?: boolean;
+    /**
+     * Позиционирование поповера
+     */
+    position?: Position;
+    /**
+     * Запрещает поповеру менять свою позицию.
+     * Например, если места снизу недостаточно,то он все равно будет показан снизу
+     */
+    preventFlip?: boolean;
+    /**
+     * Запрещает поповеру менять свою позицию, если он не влезает в видимую область.
+     */
+    preventOverflow?: boolean;
+    /**
+     *  Позволяет поповеру подствраивать свою высоту под границы экрана, если из-за величины контента он выходит за рамки видимой области экрана
+     */
+    availableHeight?: boolean;
+    /**
+     * Если `true`, будет отрисована стрелочка
+     */
+    withArrow?: boolean;
+    /**
+     * Смещение поповера.
+     * Если позиционирование top, bottom, то [x, y].
+     * Если позиционирование left, right то [y, x].
+     */
+    offset?: [number, number];
+    /**
+     * Дополнительный класс для поповера
+     */
+    popperClassName?: string;
+    /**
+     * Дополнительный класс для стрелочки
+     */
+    arrowClassName?: string;
+    /**
+     * Функция, возвращающая контейнер, в который будет рендериться поповер
+     */
+    getPortalContainer?: () => HTMLElement;
+    /**
+     * CSSTransitionProps, прокидываются в компонент CSSTransitionProps.
+     */
+    transition?: CSSTransitionProps;
+    /**
+     * Выставляет кастомное свойство transition-duration
+     */
+    transitionDuration?: CSSProperties['transitionDuration'];
+    /**
+     * Рендерит компонент, обернутый в Transition
+     */
+    withTransition?: boolean;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Хранит функцию, с помощью которой можно обновить положение компонента
+     */
+    update?: MutableRefObject<() => void>;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * z-index компонента
+     */
+    zIndex?: number;
+    /**
+     * Если поповер не помещается в переданной позиции (position), он попробует открыться в другой позиции,
+     * по очереди для каждой позиции из этого списка.
+     * Если не передавать, то поповер открывается в противоположном направлении от переданного position.
+     */
+    fallbackPlacements?: Position[];
+    /**
+     * Контент
+     */
+    children?: ReactNode;
+};
+declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
+export { Position, PopoverProps, Popover };

package/Component-f12ee135.d.ts

@@ -0,0 +1,71 @@
+/// <reference types="react" />
+import React from 'react';
+import { ReactNode } from "react";
+import { BottomSheetProps } from "./index-f12ee135";
+import { BaseSelectProps } from "./typings-5e1b8383";
+type SelectMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll'> & {
+    /**
+     * Футер
+     * @deprecated Используйте bottomSheetProps.actionButton
+     */
+    footer?: ReactNode;
+    /**
+     * Будет ли свайпаться шторка
+     * @deprecated Используйте bottomSheetProps.swipeable
+     */
+    swipeable?: boolean;
+    /**
+     * Отображать в BottomSheet
+     */
+    isBottomSheet?: boolean;
+    /**
+     * Дополнительные пропсы шторки
+     */
+    bottomSheetProps?: Partial<BottomSheetProps>;
+    /**
+     *  Дополнительные пропсы модалки
+     */
+    modalProps?: Partial<React.ComponentProps<typeof ModalMobile>>;
+    /**
+     *  Дополнительные пропсы шапки модалки
+     */
+    modalHeaderProps?: Partial<React.ComponentProps<typeof ModalMobile.Header>>;
+    /**
+     *  Дополнительные пропсы футера модалки
+     */
+    modalFooterProps?: Partial<React.ComponentProps<typeof ModalMobile.Footer>>;
+};
+declare const BaseSelectMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "Checkmark"> & {
+    /**
+     * Футер
+     * @deprecated Используйте bottomSheetProps.actionButton
+     */
+    footer?: ReactNode;
+    /**
+     * Будет ли свайпаться шторка
+     * @deprecated Используйте bottomSheetProps.swipeable
+     */
+    swipeable?: boolean | undefined;
+    /**
+     * Отображать в BottomSheet
+     */
+    isBottomSheet?: boolean | undefined;
+    /**
+     * Дополнительные пропсы шторки
+     */
+    bottomSheetProps?: Partial<BottomSheetProps> | undefined;
+    /**
+     *  Дополнительные пропсы модалки
+     */
+    modalProps?: Partial<import("./typings-bdb4c6b9").ModalMobileProps & React.RefAttributes<HTMLDivElement>> | undefined;
+    /**
+     *  Дополнительные пропсы шапки модалки
+     */
+    modalHeaderProps?: Partial<import("./Component.mobile-e81c389f").HeaderProps> | undefined;
+    /**
+     *  Дополнительные пропсы футера модалки
+     */
+    modalFooterProps?: Partial<import("./Component.mobile-e81c389f").FooterProps> | undefined;
+} & React.RefAttributes<unknown>>;
+export * from "./Component.mobile-e81c389f";
+export { SelectMobileProps, BaseSelectMobile };

package/Component.desktop.d.ts

@@ -2,7 +2,7 @@
 import React from 'react';
 import { ChangeEvent, FC, RefAttributes } from "react";
 import { InputProps } from "@alfalab/core-components-input";
-import { BaseSelectProps } from "@alfalab/core-components-select";
+import { BaseSelectProps } from "./index-3e68f8db";
 type InputAutocompleteDesktopProps = Omit<BaseSelectProps, 'Field' | 'nativeSelect'> & {
     /**
      * Компонент ввода значения

package/Component.mobile-e81c389f.d.ts

@@ -0,0 +1,38 @@
+/// <reference types="react" />
+import React from "react";
+import { FC, ReactNode } from "react";
+import { NavigationBarProps } from "./index-e81c389f";
+import { ContentProps, ModalMobileProps } from "./typings-bdb4c6b9";
+type HeaderProps = Omit<NavigationBarProps, "size" | "view" | "parentRef">;
+declare const Header: FC<HeaderProps>;
+declare const Content: FC<ContentProps>;
+type FooterProps = {
+    /**
+     * Контент футера
+     */
+    children?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Фиксирует футер
+     */
+    sticky?: boolean;
+    /**
+     * Выравнивание элементов футера
+     */
+    layout?: "start" | "center" | "space-between" | "column";
+    /**
+     * Отступы между элементами футера
+     */
+    gap?: 16 | 24 | 32;
+};
+declare const Footer: FC<FooterProps>;
+declare const ModalMobile: React.ForwardRefExoticComponent<ModalMobileProps & React.RefAttributes<HTMLDivElement>> & {
+    Content: React.FC<import("./typings-bdb4c6b9").ContentProps>;
+    Header: React.FC<HeaderProps>;
+    Footer: React.FC<FooterProps>;
+    Closer: React.FC<import("./index-e81c389f").CloserProps>;
+};
+export { HeaderProps, Header, Content, FooterProps, Footer, ModalMobile };

package/Component.mobile.d.ts

@@ -3,7 +3,7 @@ import React from 'react';
 import { ChangeEvent, ElementType } from "react";
 import { BottomSheetProps } from "./index-f12ee135";
 import { ButtonProps } from "@alfalab/core-components-button";
-import { BaseSelectChangePayload, BaseSelectProps } from "@alfalab/core-components-select";
+import { BaseSelectChangePayload, BaseSelectProps } from "./index-3e68f8db";
 type InputAutocompleteMobileProps = Omit<BaseSelectProps, 'OptionsList' | 'Checkmark' | 'onScroll' | 'nativeSelect' | 'autocomplete' | 'valueRenderer'> & {
     /**
      * Обработчик выбора

package/Component.mobile.js

@@ -11,6 +11,7 @@ var coreComponentsButton = require('@alfalab/core-components-button');
 var coreComponentsInput = require('@alfalab/core-components-input');
 var coreComponentsSelect = require('@alfalab/core-components-select');
 var autocompleteMobileField_Component = require('./autocomplete-mobile-field/Component.js');
+var mobile_module = require('./mobile.module-22ee5ba9.js');
 require('@alfalab/core-components-form-control');
 require('@alfalab/hooks');
 
@@ -21,9 +22,6 @@ var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 var throttle__default = /*#__PURE__*/_interopDefaultCompat(throttle);
 
-var styles = {"bottomSheetInput":"input-autocomplete__bottomSheetInput_8stne","footer":"input-autocomplete__footer_8stne"};
-require('./mobile.css')
-
 var SELECTED = [];
 var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, ref) {
     var Input = _a.Input, _b = _a.bottomSheetProps, bottomSheetProps = _b === void 0 ? {} : _b, _c = _a.bottomSheetHeaderAddonsProps, bottomSheetHeaderAddonsProps = _c === void 0 ? {} : _c, _d = _a.value, value = _d === void 0 ? '' : _d, _e = _a.filter, filter = _e === void 0 ? '' : _e, name = _a.name, _f = _a.Arrow, Arrow = _f === void 0 ? null : _f, label = _a.label, placeholder = _a.placeholder, _g = _a.size, size = _g === void 0 ? 's' : _g, openProp = _a.open, onFilter = _a.onFilter, onChange = _a.onChange, onOpen = _a.onOpen, onCancel = _a.onCancel, onClearFilter = _a.onClearFilter, continueButtonProps = _a.continueButtonProps, cancelButtonProps = _a.cancelButtonProps, selected = _a.selected, multiple = _a.multiple, restProps = tslib.__rest(_a, ["Input", "bottomSheetProps", "bottomSheetHeaderAddonsProps", "value", "filter", "name", "Arrow", "label", "placeholder", "size", "open", "onFilter", "onChange", "onOpen", "onCancel", "onClearFilter", "continueButtonProps", "cancelButtonProps", "selected", "multiple"]);
@@ -54,10 +52,11 @@ var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, re
         onChange(filter);
     };
     var handleChange = function (payload) {
+        var _a;
         onChange(payload);
         if (multiple) {
             // После выбора опции возвращаем фокус в поле ввода.
-            requestAnimationFrame(function () { var _a; return (_a = bottomSheetInputRef.current) === null || _a === void 0 ? void 0 : _a.focus(); });
+            (_a = bottomSheetInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
         }
     };
     var handleCancel = function () {
@@ -77,14 +76,14 @@ var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, re
     };
     var getBottomSheetProps = function () {
         var Component = Input || coreComponentsInput.Input;
-        return tslib.__assign(tslib.__assign({ actionButton: (React__default.default.createElement("div", { className: styles.footer },
-                React__default.default.createElement(coreComponentsButton.Button, tslib.__assign({ block: true, view: 'primary', size: 's', onClick: handleApply }, continueButtonProps), "\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C"),
-                React__default.default.createElement(coreComponentsButton.Button, tslib.__assign({ block: true, view: 'secondary', size: 's', onClick: handleCancel }, cancelButtonProps), "\u041E\u0442\u043C\u0435\u043D\u0430"))), title: label || placeholder, bottomAddons: (React__default.default.createElement(Component, tslib.__assign({ block: true, clear: !!onClearFilter, onClear: onClearFilter, value: filter, onInput: onFilter, placeholder: placeholder, onFocus: handleInputFocus }, bottomSheetHeaderAddonsProps, { className: cn__default.default(styles.bottomSheetInput, bottomSheetHeaderAddonsProps.className), ref: mergeRefs__default.default([
+        return tslib.__assign(tslib.__assign({ actionButton: (React__default.default.createElement("div", { className: mobile_module.styles.footer },
+                React__default.default.createElement(coreComponentsButton.Button, tslib.__assign({ block: true, view: 'secondary', size: 's', onClick: handleCancel }, cancelButtonProps), "\u041E\u0442\u043C\u0435\u043D\u0430"),
+                React__default.default.createElement(coreComponentsButton.Button, tslib.__assign({ block: true, view: 'primary', size: 's', onClick: handleApply }, continueButtonProps), "\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C"))), title: label || placeholder, bottomAddons: (React__default.default.createElement(Component, tslib.__assign({ block: true, clear: !!onClearFilter, onClear: onClearFilter, value: filter, onInput: onFilter, placeholder: placeholder, onFocus: handleInputFocus }, bottomSheetHeaderAddonsProps, { className: cn__default.default(mobile_module.styles.bottomAddonInput, bottomSheetHeaderAddonsProps.className), ref: mergeRefs__default.default([
                     bottomSheetInputRef,
                     bottomSheetHeaderAddonsProps.ref,
                 ]) }))), initialHeight: 'full' }, bottomSheetProps), { containerProps: tslib.__assign({ onTouchMove: handleOptionsListTouchMove }, bottomSheetProps.containerProps) });
     };
-    return (React__default.default.createElement(coreComponentsSelect.SelectMobile, tslib.__assign({ ref: mergeRefs__default.default([targetRef, ref]), selected: selected || SELECTED, open: Boolean(open || openProp), onOpen: handleOpen, onChange: handleChange, Arrow: Arrow, Field: autocompleteMobileField_Component.AutocompleteMobileField, fieldProps: { value: value }, placeholder: placeholder, label: label, size: size, name: name, multiple: multiple, bottomSheetProps: getBottomSheetProps(), optionsListProps: { showFooter: false } }, restProps)));
+    return (React__default.default.createElement(coreComponentsSelect.SelectMobile, tslib.__assign({ ref: mergeRefs__default.default([targetRef, ref]), selected: selected || SELECTED, open: Boolean(open || openProp), onOpen: handleOpen, onChange: handleChange, Arrow: Arrow, Field: autocompleteMobileField_Component.AutocompleteMobileField, fieldProps: { value: value }, placeholder: placeholder, label: label, size: size, name: name, multiple: multiple, useWithApplyHook: false, bottomSheetProps: getBottomSheetProps(), optionsListProps: { showFooter: false } }, restProps)));
 });
 
 exports.InputAutocompleteMobile = InputAutocompleteMobile;

package/Component.modal.mobile.d.ts

@@ -0,0 +1,123 @@
+/// <reference types="react" />
+import React from 'react';
+import { ChangeEvent, ElementType } from "react";
+import { ButtonProps } from "@alfalab/core-components-button";
+import { BaseSelectChangePayload } from "./index-3e68f8db";
+import { ModalMobile } from "./Component.mobile-e81c389f";
+import { UseSelectWithApplyProps } from "./hook-b4e70cb0";
+import { BaseSelectProps } from "./typings-5e1b8383";
+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;
+};
+type InputAutocompleteModalMobileProps = Omit<SelectModalMobileProps, 'OptionsList' | 'Checkmark' | 'onScroll' | 'nativeSelect' | 'autocomplete' | 'valueRenderer'> & {
+    /**
+     * Обработчик выбора
+     */
+    onChange: (payload: string | BaseSelectChangePayload) => void;
+    /**
+     * Обработчик ввода фильтра.
+     */
+    onFilter: (event: ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Значение поля ввода
+     */
+    value?: string;
+    /**
+     * Значение фильтра.
+     */
+    filter?: string;
+    /**
+     * Обработчик нажатия на кнопку "Отмена".
+     */
+    onCancel?: () => void;
+    /**
+     * Обработчик нажатия на крестик в инпуте фильтра.
+     */
+    onClearFilter?: () => void;
+    /**
+     * Дополнительные пропсы на слот под заголовком
+     */
+    bottomAddonProps?: Record<string, unknown>;
+    /**
+     * Дополнительные пропсы на кнопку "продолжить"
+     */
+    continueButtonProps?: ButtonProps;
+    /**
+     * Дополнительные пропсы на кнопку "отмена"
+     */
+    cancelButtonProps?: ButtonProps;
+    /**
+     * Кастомный инпут
+     */
+    Input?: ElementType;
+};
+declare const InputAutocompleteModalMobile: React.ForwardRefExoticComponent<Omit<SelectModalMobileProps, "onScroll" | "valueRenderer" | "autocomplete" | "nativeSelect" | "OptionsList" | "Checkmark"> & {
+    /**
+     * Обработчик выбора
+     */
+    onChange: (payload: string | BaseSelectChangePayload) => void;
+    /**
+     * Обработчик ввода фильтра.
+     */
+    onFilter: (event: ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Значение поля ввода
+     */
+    value?: string | undefined;
+    /**
+     * Значение фильтра.
+     */
+    filter?: string | undefined;
+    /**
+     * Обработчик нажатия на кнопку "Отмена".
+     */
+    onCancel?: (() => void) | undefined;
+    /**
+     * Обработчик нажатия на крестик в инпуте фильтра.
+     */
+    onClearFilter?: (() => void) | undefined;
+    /**
+     * Дополнительные пропсы на слот под заголовком
+     */
+    bottomAddonProps?: Record<string, unknown> | undefined;
+    /**
+     * Дополнительные пропсы на кнопку "продолжить"
+     */
+    continueButtonProps?: ButtonProps | undefined;
+    /**
+     * Дополнительные пропсы на кнопку "отмена"
+     */
+    cancelButtonProps?: ButtonProps | undefined;
+    /**
+     * Кастомный инпут
+     */
+    Input?: React.ElementType<any> | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { InputAutocompleteModalMobileProps, InputAutocompleteModalMobile };

package/Component.modal.mobile.js

@@ -0,0 +1,77 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var mergeRefs = require('react-merge-refs');
+var cn = require('classnames');
+var throttle = require('lodash.throttle');
+var coreComponentsButton = require('@alfalab/core-components-button');
+var coreComponentsInput = require('@alfalab/core-components-input');
+var mobile = require('@alfalab/core-components-select/mobile');
+var autocompleteMobileField_Component = require('./autocomplete-mobile-field/Component.js');
+var mobile_module = require('./mobile.module-22ee5ba9.js');
+require('@alfalab/core-components-form-control');
+require('@alfalab/hooks');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var throttle__default = /*#__PURE__*/_interopDefaultCompat(throttle);
+
+var InputAutocompleteModalMobile = React__default.default.forwardRef(function (_a, ref) {
+    var openProp = _a.open, onOpen = _a.onOpen, name = _a.name, _b = _a.size, size = _b === void 0 ? 's' : _b, _c = _a.Input, Input = _c === void 0 ? coreComponentsInput.Input : _c, _d = _a.Arrow, Arrow = _d === void 0 ? null : _d, onClearFilter = _a.onClearFilter, _e = _a.filter, filter = _e === void 0 ? '' : _e, onFilter = _a.onFilter, placeholder = _a.placeholder, bottomAddonProps = _a.bottomAddonProps, multiple = _a.multiple, onChange = _a.onChange, onCancel = _a.onCancel, value = _a.value, cancelButtonProps = _a.cancelButtonProps, continueButtonProps = _a.continueButtonProps, restProps = tslib.__rest(_a, ["open", "onOpen", "name", "size", "Input", "Arrow", "onClearFilter", "filter", "onFilter", "placeholder", "bottomAddonProps", "multiple", "onChange", "onCancel", "value", "cancelButtonProps", "continueButtonProps"]);
+    var _f = React__default.default.useState(false), open = _f[0], setOpen = _f[1];
+    var targetRef = React.useRef(null);
+    var modalScrollableRef = React.useRef(null);
+    var bottomAddonRef = React.useRef(null);
+    React.useEffect(function () {
+        var modalContentNode = modalScrollableRef.current;
+        var handleListTouchMove = throttle__default.default(function () {
+            var input = bottomAddonRef.current;
+            if (input && document.activeElement === input) {
+                input.blur();
+            }
+        }, 300);
+        modalContentNode === null || modalContentNode === void 0 ? void 0 : modalContentNode.addEventListener('touchmove', handleListTouchMove);
+        return function () { return modalContentNode === null || modalContentNode === void 0 ? void 0 : modalContentNode.removeEventListener('touchmove', handleListTouchMove); };
+    }, [open]);
+    var setOpenModalSelect = function (isOpen) {
+        if (openProp === undefined) {
+            setOpen(isOpen);
+        }
+        onOpen === null || onOpen === void 0 ? void 0 : onOpen({ open: isOpen, name: name });
+    };
+    var handleOpen = function (payload) {
+        setOpenModalSelect(Boolean(payload.open));
+    };
+    var handleApply = function () {
+        setOpenModalSelect(false);
+        onChange(filter);
+    };
+    var handleCancel = function () {
+        setOpenModalSelect(false);
+        onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+    };
+    var handleChange = function (payload) {
+        var _a;
+        onChange(payload);
+        if (multiple) {
+            // После выбора опции возвращаем фокус в поле ввода.
+            (_a = bottomAddonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+    };
+    var renderBottomAddon = function () { return (React__default.default.createElement(Input, tslib.__assign({ block: true, clear: !!onClearFilter, onClear: onClearFilter, value: filter, onInput: onFilter, placeholder: placeholder }, bottomAddonProps, { className: cn__default.default(mobile_module.styles.bottomAddonInput, bottomAddonProps === null || bottomAddonProps === void 0 ? void 0 : bottomAddonProps.className), ref: mergeRefs__default.default([
+            bottomAddonRef,
+            bottomAddonProps === null || bottomAddonProps === void 0 ? void 0 : bottomAddonProps.ref,
+        ]) }))); };
+    var renderFooter = function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(coreComponentsButton.Button, tslib.__assign({ block: true, view: 'primary', size: 's', onClick: handleApply }, continueButtonProps), "\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C"),
+        React__default.default.createElement(coreComponentsButton.Button, tslib.__assign({ block: true, view: 'secondary', size: 's', onClick: handleCancel }, cancelButtonProps), "\u041E\u0442\u043C\u0435\u043D\u0430"))); };
+    return (React__default.default.createElement(mobile.SelectModalMobile, tslib.__assign({}, restProps, { ref: mergeRefs__default.default([ref, targetRef]), name: name, Field: autocompleteMobileField_Component.AutocompleteMobileField, Arrow: Arrow, onOpen: handleOpen, onChange: handleChange, multiple: multiple, open: openProp !== null && openProp !== void 0 ? openProp : open, size: size, fieldProps: { value: value }, placeholder: placeholder, useWithApplyHook: false, modalProps: tslib.__assign(tslib.__assign({}, restProps.modalProps), { componentRef: modalScrollableRef }), modalHeaderProps: tslib.__assign(tslib.__assign({}, restProps.modalHeaderProps), { bottomAddons: renderBottomAddon() }), modalFooterProps: tslib.__assign(tslib.__assign({ sticky: true }, restProps.modalFooterProps), { children: renderFooter() }) })));
+});
+
+exports.InputAutocompleteModalMobile = InputAutocompleteModalMobile;

package/Component.responsive.d.ts

@@ -2,7 +2,7 @@
 import React from 'react';
 import { BottomSheetProps } from "./index-f12ee135";
 import { ButtonProps } from "@alfalab/core-components-button";
-import { BaseSelectProps } from "@alfalab/core-components-select";
+import { BaseSelectProps } from "./index-3e68f8db";
 import { InputAutocompleteDesktopProps } from "./Component.desktop";
 import { InputAutocompleteMobileProps } from "./Component.mobile";
 type InputAutocompleteResponsiveProps = InputAutocompleteDesktopProps & InputAutocompleteMobileProps & {
@@ -86,7 +86,7 @@ declare const InputAutocompleteResponsive: React.ForwardRefExoticComponent<Omit<
     onInput?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
     updatePopover?: React.MutableRefObject<() => void> | undefined;
 } & Omit<BaseSelectProps, "onScroll" | "valueRenderer" | "autocomplete" | "nativeSelect" | "OptionsList" | "Checkmark"> & {
-    onChange: (payload: string | import("@alfalab/core-components-select").BaseSelectChangePayload) => void;
+    onChange: (payload: string | import("./index-3e68f8db").BaseSelectChangePayload) => void;
     onFilter: (event: React.ChangeEvent<HTMLInputElement>) => void;
     value?: string | undefined;
     filter?: string | undefined;

package/Component.responsive.js

@@ -16,6 +16,7 @@ require('lodash.throttle');
 require('@alfalab/core-components-button');
 require('./autocomplete-mobile-field/Component.js');
 require('@alfalab/core-components-form-control');
+require('./mobile.module-22ee5ba9.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/Context-bdb4c6b9.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { BaseModalContext } from "./index-bdb4c6b9";
+declare const ModalContext: import("react").Context<BaseModalContext>;
+export { ModalContext };

package/ResponsiveContext-baf4875b.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import React from 'react';
+import { TResponsiveModalContext } from "./typings-bdb4c6b9";
+declare const ResponsiveContext: React.Context<TResponsiveModalContext>;
+export { ResponsiveContext };