@alfalab/core-components-input-autocomplete 11.1.0 → 11.3.0

package/autocomplete-field/Component.js

@@ -14,7 +14,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"arrow":"input-autocomplete__arrow_wt0tr","error":"input-autocomplete__error_wt0tr"};
+var styles = {"arrow":"input-autocomplete__arrow_ldg52","error":"input-autocomplete__error_ldg52"};
 require('./index.css')
 
 var AutocompleteField = function (_a) {

package/autocomplete-field/index.css

@@ -1,4 +1,4 @@
-/* hash: wsrha */
-.input-autocomplete__arrow_wt0tr.input-autocomplete__error_wt0tr ~ * {
+/* hash: 5vm6i */
+.input-autocomplete__arrow_ldg52.input-autocomplete__error_ldg52 ~ * {
     display: none;
 }

package/autocomplete-mobile-field/Component.js

@@ -15,7 +15,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"input-autocomplete__component_ymkry","field":"input-autocomplete__field_ymkry","disabled":"input-autocomplete__disabled_ymkry","placeholder":"input-autocomplete__placeholder_ymkry","contentWrapper":"input-autocomplete__contentWrapper_ymkry","value":"input-autocomplete__value_ymkry","focusVisible":"input-autocomplete__focusVisible_ymkry"};
+var styles = {"component":"input-autocomplete__component_3udw2","field":"input-autocomplete__field_3udw2","disabled":"input-autocomplete__disabled_3udw2","placeholder":"input-autocomplete__placeholder_3udw2","contentWrapper":"input-autocomplete__contentWrapper_3udw2","value":"input-autocomplete__value_3udw2","focusVisible":"input-autocomplete__focusVisible_3udw2"};
 require('./index.css')
 
 var AutocompleteMobileField = function (_a) {

package/autocomplete-mobile-field/index.css

@@ -1,4 +1,4 @@
-/* hash: ru4db */
+/* hash: 1yog3 */
 :root {
 } /* deprecated */ :root {
     --color-light-border-link: #2288fa;
@@ -18,16 +18,16 @@
 } :root {
     --focus-color: var(--color-light-border-link);
     --disabled-cursor: not-allowed;
-} .input-autocomplete__component_ymkry {
+} .input-autocomplete__component_3udw2 {
     width: 100%;
     outline: none;
-} .input-autocomplete__field_ymkry:not(.input-autocomplete__disabled_ymkry) {
+} .input-autocomplete__field_3udw2:not(.input-autocomplete__disabled_3udw2) {
     cursor: pointer;
-} .input-autocomplete__disabled_ymkry {
+} .input-autocomplete__disabled_3udw2 {
     cursor: var(--disabled-cursor);
-} .input-autocomplete__placeholder_ymkry {
+} .input-autocomplete__placeholder_3udw2 {
     color: var(--color-light-text-secondary);
-} .input-autocomplete__contentWrapper_ymkry {
+} .input-autocomplete__contentWrapper_3udw2 {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -36,11 +36,11 @@
     text-overflow: ellipsis;
     overflow: hidden;
     width: 100%;
-} .input-autocomplete__value_ymkry {
+} .input-autocomplete__value_3udw2 {
     overflow: hidden;
     text-overflow: ellipsis;
     text-align: left;
-} .input-autocomplete__focusVisible_ymkry {
+} .input-autocomplete__focusVisible_3udw2 {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }

package/cssm/mobile/Component.mobile.d.ts

@@ -4,5 +4,8 @@ import React from 'react';
 declare const InputAutocompleteMobile: React.ForwardRefExoticComponent<import("../types").InputAutocompleteCommonProps & {
     isBottomSheet?: boolean | undefined;
     transitionProps?: Partial<import("react-transition-group/Transition").TransitionProps<undefined>> | undefined;
+    onApply?: (() => void) | undefined;
+    onCancel?: (() => void) | undefined;
+    title?: string | undefined;
 } & React.RefAttributes<unknown>>;
 export { InputAutocompleteMobile };

package/cssm/mobile/Component.mobile.js

@@ -29,7 +29,7 @@ var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
 var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, ref) {
     var _b;
     var _c;
-    var Input = _a.Input, value = _a.value, name = _a.name, _d = _a.Arrow, Arrow = _d === void 0 ? null : _d, label = _a.label, _e = _a.placeholder, placeholder = _e === void 0 ? '' : _e, _f = _a.size, size = _f === void 0 ? 's' : _f, openProp = _a.open, onInput = _a.onInput, onOpen = _a.onOpen, multiple = _a.multiple, inputProps = _a.inputProps, _g = _a.isBottomSheet, isBottomSheet = _g === void 0 ? true : _g, dataTestId = _a.dataTestId, transitionProps = _a.transitionProps, restProps = tslib.__rest(_a, ["Input", "value", "name", "Arrow", "label", "placeholder", "size", "open", "onInput", "onOpen", "multiple", "inputProps", "isBottomSheet", "dataTestId", "transitionProps"]);
+    var Input = _a.Input, value = _a.value, name = _a.name, _d = _a.Arrow, Arrow = _d === void 0 ? null : _d, label = _a.label, _e = _a.placeholder, placeholder = _e === void 0 ? '' : _e, _f = _a.size, size = _f === void 0 ? 's' : _f, openProp = _a.open, onInput = _a.onInput, onOpen = _a.onOpen, multiple = _a.multiple, inputProps = _a.inputProps, _g = _a.isBottomSheet, isBottomSheet = _g === void 0 ? true : _g, dataTestId = _a.dataTestId, transitionProps = _a.transitionProps, onCancel = _a.onCancel, onApply = _a.onApply, title = _a.title, restProps = tslib.__rest(_a, ["Input", "value", "name", "Arrow", "label", "placeholder", "size", "open", "onInput", "onOpen", "multiple", "inputProps", "isBottomSheet", "dataTestId", "transitionProps", "onCancel", "onApply", "title"]);
     var _h = React.useState(false), open = _h[0], setOpen = _h[1];
     var frozenValue = React.useRef('');
     var searchInputRef = React.useRef(null);
@@ -55,12 +55,15 @@ var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, re
             }
         }, 300);
     }, []);
-    var handleApply = function () { return setModalVisibility(false); };
+    var handleApply = function () {
+        setModalVisibility(false);
+        onApply === null || onApply === void 0 ? void 0 : onApply();
+    };
     var handleCancel = function () {
         setModalVisibility(false);
         restorePrevValue();
+        onCancel === null || onCancel === void 0 ? void 0 : onCancel();
     };
-    var handleClear = function () { return onInput === null || onInput === void 0 ? void 0 : onInput(null, { value: '' }); };
     var handleExiting = function (node) {
         var _a, _b;
         (_a = targetRef.current) === null || _a === void 0 ? void 0 : _a.focus();
@@ -69,7 +72,7 @@ var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, re
     var isOpen = Boolean(open || openProp);
     var Component = isBottomSheet ? mobile.SelectMobile : mobile.SelectModalMobile;
     var componentProps = (_b = {
-            title: label || placeholder,
+            title: title || label || placeholder,
             onClose: restorePrevValue,
             transitionProps: tslib.__assign(tslib.__assign({}, transitionProps), { onExiting: handleExiting })
         },
@@ -80,11 +83,14 @@ var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, re
     var clear = (_c = inputProps === null || inputProps === void 0 ? void 0 : inputProps.clear) !== null && _c !== void 0 ? _c : false;
     return (React__default.default.createElement(Component, tslib.__assign({ Field: autocompleteMobileField_Component.AutocompleteMobileField }, restProps, (isBottomSheet
         ? { bottomSheetProps: componentProps }
-        : { modalProps: componentProps }), { dataTestId: dataTestId, useWithApplyHook: false, showSearch: true, searchProps: {
+        : {
+            modalProps: componentProps,
+            modalHeaderProps: { title: title },
+        }), { dataTestId: dataTestId, useWithApplyHook: false, showSearch: true, searchProps: {
             value: value,
             filterFn: utils.searchFilterStub,
             componentProps: tslib.__assign(tslib.__assign({ leftAddons: null, placeholder: placeholder }, inputProps), { className: cn__default.default(styles__default.default.input, inputProps === null || inputProps === void 0 ? void 0 : inputProps.className), clear: clear, ref: mergeRefs__default.default([searchInputRef, inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref]), onChange: onInput }),
-        }, Search: Input, ref: mergeRefs__default.default([targetRef, ref]), open: isOpen, onOpen: handleOpen, Arrow: Arrow, placeholder: placeholder, label: label, size: size, name: name, multiple: multiple, optionsListProps: tslib.__assign({ footer: (React__default.default.createElement(shared.Footer, { showClear: true, handleClear: handleCancel, handleApply: handleApply, clearText: '\u041E\u0442\u043C\u0435\u043D\u0430', applyText: '\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C', dataTestId: dataTestId })) }, restProps.optionsListProps), fieldProps: tslib.__assign({ value: isOpen ? frozenValue.current : value, clear: clear, onClear: clear ? handleClear : undefined }, restProps.fieldProps) })));
+        }, Search: Input, ref: mergeRefs__default.default([targetRef, ref]), open: isOpen, onOpen: handleOpen, Arrow: Arrow, placeholder: placeholder, label: label, size: size, name: name, multiple: multiple, optionsListProps: tslib.__assign({ footer: (React__default.default.createElement(shared.Footer, { showClear: true, handleClear: handleCancel, handleApply: handleApply, clearText: '\u041E\u0442\u043C\u0435\u043D\u0430', applyText: '\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C', dataTestId: dataTestId })) }, restProps.optionsListProps), fieldProps: tslib.__assign({ value: isOpen ? frozenValue.current : value, clear: clear, onClear: clear ? inputProps === null || inputProps === void 0 ? void 0 : inputProps.onClear : undefined }, restProps.fieldProps) })));
 });
 
 exports.InputAutocompleteMobile = InputAutocompleteMobile;

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

@@ -4,5 +4,8 @@ import React from 'react';
 declare const InputAutocompleteModalMobile: React.ForwardRefExoticComponent<import("../types").InputAutocompleteCommonProps & {
     isBottomSheet?: boolean | undefined;
     transitionProps?: Partial<import("react-transition-group/Transition").TransitionProps<undefined>> | undefined;
+    onApply?: (() => void) | undefined;
+    onCancel?: (() => void) | undefined;
+    title?: string | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 export { InputAutocompleteModalMobile };

package/cssm/types.d.ts

@@ -38,6 +38,19 @@ type MobileProps = {
      * Пропсы анимации контента (CSSTransition)
      */
     transitionProps?: NonNullable<BottomSheetSelectMobileProps['bottomSheetProps']>['transitionProps'];
+    /**
+     * Обработчик нажатия на кнопку «Продолжить» в BottomSheet или модальном окне
+     */
+    onApply?: () => void;
+    /**
+     * Обработчик нажатия на кнопку «Отмена» в BottomSheet или модальном окне
+     */
+    onCancel?: () => void;
+    /**
+     * Заголовок в модальном окне или шторке.
+     * Если не передан, то заголовок будет совпадать с label. Если не передан и label, то заголовок будет равен placeholder
+     */
+    title?: string;
 };
 type InputAutocompleteMobileProps = InputAutocompleteCommonProps & MobileProps;
 interface InputAutocompleteProps extends InputAutocompleteCommonProps {

package/esm/autocomplete-field/Component.js

@@ -4,7 +4,7 @@ import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { InputDesktop } from '@alfalab/core-components-input/esm/desktop';
 
-var styles = {"arrow":"input-autocomplete__arrow_wt0tr","error":"input-autocomplete__error_wt0tr"};
+var styles = {"arrow":"input-autocomplete__arrow_ldg52","error":"input-autocomplete__error_ldg52"};
 require('./index.css')
 
 var AutocompleteField = function (_a) {

package/esm/autocomplete-field/index.css

@@ -1,4 +1,4 @@
-/* hash: wsrha */
-.input-autocomplete__arrow_wt0tr.input-autocomplete__error_wt0tr ~ * {
+/* hash: 5vm6i */
+.input-autocomplete__arrow_ldg52.input-autocomplete__error_ldg52 ~ * {
     display: none;
 }

package/esm/autocomplete-mobile-field/Component.js

@@ -6,7 +6,7 @@ import { ClearButton } from '@alfalab/core-components-input/esm/shared';
 import { getDataTestId } from '@alfalab/core-components-shared/esm';
 import { useFocus } from '@alfalab/hooks';
 
-var styles = {"component":"input-autocomplete__component_ymkry","field":"input-autocomplete__field_ymkry","disabled":"input-autocomplete__disabled_ymkry","placeholder":"input-autocomplete__placeholder_ymkry","contentWrapper":"input-autocomplete__contentWrapper_ymkry","value":"input-autocomplete__value_ymkry","focusVisible":"input-autocomplete__focusVisible_ymkry"};
+var styles = {"component":"input-autocomplete__component_3udw2","field":"input-autocomplete__field_3udw2","disabled":"input-autocomplete__disabled_3udw2","placeholder":"input-autocomplete__placeholder_3udw2","contentWrapper":"input-autocomplete__contentWrapper_3udw2","value":"input-autocomplete__value_3udw2","focusVisible":"input-autocomplete__focusVisible_3udw2"};
 require('./index.css')
 
 var AutocompleteMobileField = function (_a) {

package/esm/autocomplete-mobile-field/index.css

@@ -1,4 +1,4 @@
-/* hash: ru4db */
+/* hash: 1yog3 */
 :root {
 } /* deprecated */ :root {
     --color-light-border-link: #2288fa;
@@ -18,16 +18,16 @@
 } :root {
     --focus-color: var(--color-light-border-link);
     --disabled-cursor: not-allowed;
-} .input-autocomplete__component_ymkry {
+} .input-autocomplete__component_3udw2 {
     width: 100%;
     outline: none;
-} .input-autocomplete__field_ymkry:not(.input-autocomplete__disabled_ymkry) {
+} .input-autocomplete__field_3udw2:not(.input-autocomplete__disabled_3udw2) {
     cursor: pointer;
-} .input-autocomplete__disabled_ymkry {
+} .input-autocomplete__disabled_3udw2 {
     cursor: var(--disabled-cursor);
-} .input-autocomplete__placeholder_ymkry {
+} .input-autocomplete__placeholder_3udw2 {
     color: var(--color-light-text-secondary);
-} .input-autocomplete__contentWrapper_ymkry {
+} .input-autocomplete__contentWrapper_3udw2 {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -36,11 +36,11 @@
     text-overflow: ellipsis;
     overflow: hidden;
     width: 100%;
-} .input-autocomplete__value_ymkry {
+} .input-autocomplete__value_3udw2 {
     overflow: hidden;
     text-overflow: ellipsis;
     text-align: left;
-} .input-autocomplete__focusVisible_ymkry {
+} .input-autocomplete__focusVisible_3udw2 {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }

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

@@ -4,5 +4,8 @@ import React from 'react';
 declare const InputAutocompleteMobile: React.ForwardRefExoticComponent<import("../types").InputAutocompleteCommonProps & {
     isBottomSheet?: boolean | undefined;
     transitionProps?: Partial<import("react-transition-group/Transition").TransitionProps<undefined>> | undefined;
+    onApply?: (() => void) | undefined;
+    onCancel?: (() => void) | undefined;
+    title?: string | undefined;
 } & React.RefAttributes<unknown>>;
 export { InputAutocompleteMobile };

package/esm/mobile/Component.mobile.js

@@ -12,13 +12,13 @@ import '@alfalab/core-components-input/esm/shared';
 import '@alfalab/core-components-shared/esm';
 import '@alfalab/hooks';
 
-var styles = {"input":"input-autocomplete__input_fjopa"};
+var styles = {"input":"input-autocomplete__input_qz9dz"};
 require('./mobile.css')
 
 var InputAutocompleteMobile = React.forwardRef(function (_a, ref) {
     var _b;
     var _c;
-    var Input = _a.Input, value = _a.value, name = _a.name, _d = _a.Arrow, Arrow = _d === void 0 ? null : _d, label = _a.label, _e = _a.placeholder, placeholder = _e === void 0 ? '' : _e, _f = _a.size, size = _f === void 0 ? 's' : _f, openProp = _a.open, onInput = _a.onInput, onOpen = _a.onOpen, multiple = _a.multiple, inputProps = _a.inputProps, _g = _a.isBottomSheet, isBottomSheet = _g === void 0 ? true : _g, dataTestId = _a.dataTestId, transitionProps = _a.transitionProps, restProps = __rest(_a, ["Input", "value", "name", "Arrow", "label", "placeholder", "size", "open", "onInput", "onOpen", "multiple", "inputProps", "isBottomSheet", "dataTestId", "transitionProps"]);
+    var Input = _a.Input, value = _a.value, name = _a.name, _d = _a.Arrow, Arrow = _d === void 0 ? null : _d, label = _a.label, _e = _a.placeholder, placeholder = _e === void 0 ? '' : _e, _f = _a.size, size = _f === void 0 ? 's' : _f, openProp = _a.open, onInput = _a.onInput, onOpen = _a.onOpen, multiple = _a.multiple, inputProps = _a.inputProps, _g = _a.isBottomSheet, isBottomSheet = _g === void 0 ? true : _g, dataTestId = _a.dataTestId, transitionProps = _a.transitionProps, onCancel = _a.onCancel, onApply = _a.onApply, title = _a.title, restProps = __rest(_a, ["Input", "value", "name", "Arrow", "label", "placeholder", "size", "open", "onInput", "onOpen", "multiple", "inputProps", "isBottomSheet", "dataTestId", "transitionProps", "onCancel", "onApply", "title"]);
     var _h = useState(false), open = _h[0], setOpen = _h[1];
     var frozenValue = useRef('');
     var searchInputRef = useRef(null);
@@ -44,12 +44,15 @@ var InputAutocompleteMobile = React.forwardRef(function (_a, ref) {
             }
         }, 300);
     }, []);
-    var handleApply = function () { return setModalVisibility(false); };
+    var handleApply = function () {
+        setModalVisibility(false);
+        onApply === null || onApply === void 0 ? void 0 : onApply();
+    };
     var handleCancel = function () {
         setModalVisibility(false);
         restorePrevValue();
+        onCancel === null || onCancel === void 0 ? void 0 : onCancel();
     };
-    var handleClear = function () { return onInput === null || onInput === void 0 ? void 0 : onInput(null, { value: '' }); };
     var handleExiting = function (node) {
         var _a, _b;
         (_a = targetRef.current) === null || _a === void 0 ? void 0 : _a.focus();
@@ -58,7 +61,7 @@ var InputAutocompleteMobile = React.forwardRef(function (_a, ref) {
     var isOpen = Boolean(open || openProp);
     var Component = isBottomSheet ? SelectMobile : SelectModalMobile;
     var componentProps = (_b = {
-            title: label || placeholder,
+            title: title || label || placeholder,
             onClose: restorePrevValue,
             transitionProps: __assign(__assign({}, transitionProps), { onExiting: handleExiting })
         },
@@ -69,11 +72,14 @@ var InputAutocompleteMobile = React.forwardRef(function (_a, ref) {
     var clear = (_c = inputProps === null || inputProps === void 0 ? void 0 : inputProps.clear) !== null && _c !== void 0 ? _c : false;
     return (React.createElement(Component, __assign({ Field: AutocompleteMobileField }, restProps, (isBottomSheet
         ? { bottomSheetProps: componentProps }
-        : { modalProps: componentProps }), { dataTestId: dataTestId, useWithApplyHook: false, showSearch: true, searchProps: {
+        : {
+            modalProps: componentProps,
+            modalHeaderProps: { title: title },
+        }), { dataTestId: dataTestId, useWithApplyHook: false, showSearch: true, searchProps: {
             value: value,
             filterFn: searchFilterStub,
             componentProps: __assign(__assign({ leftAddons: null, placeholder: placeholder }, inputProps), { className: cn(styles.input, inputProps === null || inputProps === void 0 ? void 0 : inputProps.className), clear: clear, ref: mergeRefs([searchInputRef, inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref]), onChange: onInput }),
-        }, Search: Input, ref: mergeRefs([targetRef, ref]), open: isOpen, onOpen: handleOpen, Arrow: Arrow, placeholder: placeholder, label: label, size: size, name: name, multiple: multiple, optionsListProps: __assign({ footer: (React.createElement(Footer, { showClear: true, handleClear: handleCancel, handleApply: handleApply, clearText: '\u041E\u0442\u043C\u0435\u043D\u0430', applyText: '\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C', dataTestId: dataTestId })) }, restProps.optionsListProps), fieldProps: __assign({ value: isOpen ? frozenValue.current : value, clear: clear, onClear: clear ? handleClear : undefined }, restProps.fieldProps) })));
+        }, Search: Input, ref: mergeRefs([targetRef, ref]), open: isOpen, onOpen: handleOpen, Arrow: Arrow, placeholder: placeholder, label: label, size: size, name: name, multiple: multiple, optionsListProps: __assign({ footer: (React.createElement(Footer, { showClear: true, handleClear: handleCancel, handleApply: handleApply, clearText: '\u041E\u0442\u043C\u0435\u043D\u0430', applyText: '\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C', dataTestId: dataTestId })) }, restProps.optionsListProps), fieldProps: __assign({ value: isOpen ? frozenValue.current : value, clear: clear, onClear: clear ? inputProps === null || inputProps === void 0 ? void 0 : inputProps.onClear : undefined }, restProps.fieldProps) })));
 });
 
 export { InputAutocompleteMobile };

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

@@ -4,5 +4,8 @@ import React from 'react';
 declare const InputAutocompleteModalMobile: React.ForwardRefExoticComponent<import("../types").InputAutocompleteCommonProps & {
     isBottomSheet?: boolean | undefined;
     transitionProps?: Partial<import("react-transition-group/Transition").TransitionProps<undefined>> | undefined;
+    onApply?: (() => void) | undefined;
+    onCancel?: (() => void) | undefined;
+    title?: string | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 export { InputAutocompleteModalMobile };

package/esm/mobile/mobile.css

@@ -1,4 +1,4 @@
-/* hash: 1otm4 */
+/* hash: x785z */
 :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 */
@@ -14,6 +14,6 @@
 } :root {
 } :root {
 } :root {
-} .input-autocomplete__input_fjopa {
+} .input-autocomplete__input_qz9dz {
     width: auto;
 }

package/esm/types.d.ts

@@ -38,6 +38,19 @@ type MobileProps = {
      * Пропсы анимации контента (CSSTransition)
      */
     transitionProps?: NonNullable<BottomSheetSelectMobileProps['bottomSheetProps']>['transitionProps'];
+    /**
+     * Обработчик нажатия на кнопку «Продолжить» в BottomSheet или модальном окне
+     */
+    onApply?: () => void;
+    /**
+     * Обработчик нажатия на кнопку «Отмена» в BottomSheet или модальном окне
+     */
+    onCancel?: () => void;
+    /**
+     * Заголовок в модальном окне или шторке.
+     * Если не передан, то заголовок будет совпадать с label. Если не передан и label, то заголовок будет равен placeholder
+     */
+    title?: string;
 };
 type InputAutocompleteMobileProps = InputAutocompleteCommonProps & MobileProps;
 interface InputAutocompleteProps extends InputAutocompleteCommonProps {

package/mobile/Component.mobile.d.ts

@@ -4,5 +4,8 @@ import React from 'react';
 declare const InputAutocompleteMobile: React.ForwardRefExoticComponent<import("../types").InputAutocompleteCommonProps & {
     isBottomSheet?: boolean | undefined;
     transitionProps?: Partial<import("react-transition-group/Transition").TransitionProps<undefined>> | undefined;
+    onApply?: (() => void) | undefined;
+    onCancel?: (() => void) | undefined;
+    title?: string | undefined;
 } & React.RefAttributes<unknown>>;
 export { InputAutocompleteMobile };

package/mobile/Component.mobile.js

@@ -23,13 +23,13 @@ var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 var throttle__default = /*#__PURE__*/_interopDefaultCompat(throttle);
 
-var styles = {"input":"input-autocomplete__input_fjopa"};
+var styles = {"input":"input-autocomplete__input_qz9dz"};
 require('./mobile.css')
 
 var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, ref) {
     var _b;
     var _c;
-    var Input = _a.Input, value = _a.value, name = _a.name, _d = _a.Arrow, Arrow = _d === void 0 ? null : _d, label = _a.label, _e = _a.placeholder, placeholder = _e === void 0 ? '' : _e, _f = _a.size, size = _f === void 0 ? 's' : _f, openProp = _a.open, onInput = _a.onInput, onOpen = _a.onOpen, multiple = _a.multiple, inputProps = _a.inputProps, _g = _a.isBottomSheet, isBottomSheet = _g === void 0 ? true : _g, dataTestId = _a.dataTestId, transitionProps = _a.transitionProps, restProps = tslib.__rest(_a, ["Input", "value", "name", "Arrow", "label", "placeholder", "size", "open", "onInput", "onOpen", "multiple", "inputProps", "isBottomSheet", "dataTestId", "transitionProps"]);
+    var Input = _a.Input, value = _a.value, name = _a.name, _d = _a.Arrow, Arrow = _d === void 0 ? null : _d, label = _a.label, _e = _a.placeholder, placeholder = _e === void 0 ? '' : _e, _f = _a.size, size = _f === void 0 ? 's' : _f, openProp = _a.open, onInput = _a.onInput, onOpen = _a.onOpen, multiple = _a.multiple, inputProps = _a.inputProps, _g = _a.isBottomSheet, isBottomSheet = _g === void 0 ? true : _g, dataTestId = _a.dataTestId, transitionProps = _a.transitionProps, onCancel = _a.onCancel, onApply = _a.onApply, title = _a.title, restProps = tslib.__rest(_a, ["Input", "value", "name", "Arrow", "label", "placeholder", "size", "open", "onInput", "onOpen", "multiple", "inputProps", "isBottomSheet", "dataTestId", "transitionProps", "onCancel", "onApply", "title"]);
     var _h = React.useState(false), open = _h[0], setOpen = _h[1];
     var frozenValue = React.useRef('');
     var searchInputRef = React.useRef(null);
@@ -55,12 +55,15 @@ var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, re
             }
         }, 300);
     }, []);
-    var handleApply = function () { return setModalVisibility(false); };
+    var handleApply = function () {
+        setModalVisibility(false);
+        onApply === null || onApply === void 0 ? void 0 : onApply();
+    };
     var handleCancel = function () {
         setModalVisibility(false);
         restorePrevValue();
+        onCancel === null || onCancel === void 0 ? void 0 : onCancel();
     };
-    var handleClear = function () { return onInput === null || onInput === void 0 ? void 0 : onInput(null, { value: '' }); };
     var handleExiting = function (node) {
         var _a, _b;
         (_a = targetRef.current) === null || _a === void 0 ? void 0 : _a.focus();
@@ -69,7 +72,7 @@ var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, re
     var isOpen = Boolean(open || openProp);
     var Component = isBottomSheet ? mobile.SelectMobile : mobile.SelectModalMobile;
     var componentProps = (_b = {
-            title: label || placeholder,
+            title: title || label || placeholder,
             onClose: restorePrevValue,
             transitionProps: tslib.__assign(tslib.__assign({}, transitionProps), { onExiting: handleExiting })
         },
@@ -80,11 +83,14 @@ var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, re
     var clear = (_c = inputProps === null || inputProps === void 0 ? void 0 : inputProps.clear) !== null && _c !== void 0 ? _c : false;
     return (React__default.default.createElement(Component, tslib.__assign({ Field: autocompleteMobileField_Component.AutocompleteMobileField }, restProps, (isBottomSheet
         ? { bottomSheetProps: componentProps }
-        : { modalProps: componentProps }), { dataTestId: dataTestId, useWithApplyHook: false, showSearch: true, searchProps: {
+        : {
+            modalProps: componentProps,
+            modalHeaderProps: { title: title },
+        }), { dataTestId: dataTestId, useWithApplyHook: false, showSearch: true, searchProps: {
             value: value,
             filterFn: utils.searchFilterStub,
             componentProps: tslib.__assign(tslib.__assign({ leftAddons: null, placeholder: placeholder }, inputProps), { className: cn__default.default(styles.input, inputProps === null || inputProps === void 0 ? void 0 : inputProps.className), clear: clear, ref: mergeRefs__default.default([searchInputRef, inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref]), onChange: onInput }),
-        }, Search: Input, ref: mergeRefs__default.default([targetRef, ref]), open: isOpen, onOpen: handleOpen, Arrow: Arrow, placeholder: placeholder, label: label, size: size, name: name, multiple: multiple, optionsListProps: tslib.__assign({ footer: (React__default.default.createElement(shared.Footer, { showClear: true, handleClear: handleCancel, handleApply: handleApply, clearText: '\u041E\u0442\u043C\u0435\u043D\u0430', applyText: '\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C', dataTestId: dataTestId })) }, restProps.optionsListProps), fieldProps: tslib.__assign({ value: isOpen ? frozenValue.current : value, clear: clear, onClear: clear ? handleClear : undefined }, restProps.fieldProps) })));
+        }, Search: Input, ref: mergeRefs__default.default([targetRef, ref]), open: isOpen, onOpen: handleOpen, Arrow: Arrow, placeholder: placeholder, label: label, size: size, name: name, multiple: multiple, optionsListProps: tslib.__assign({ footer: (React__default.default.createElement(shared.Footer, { showClear: true, handleClear: handleCancel, handleApply: handleApply, clearText: '\u041E\u0442\u043C\u0435\u043D\u0430', applyText: '\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C', dataTestId: dataTestId })) }, restProps.optionsListProps), fieldProps: tslib.__assign({ value: isOpen ? frozenValue.current : value, clear: clear, onClear: clear ? inputProps === null || inputProps === void 0 ? void 0 : inputProps.onClear : undefined }, restProps.fieldProps) })));
 });
 
 exports.InputAutocompleteMobile = InputAutocompleteMobile;

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

@@ -4,5 +4,8 @@ import React from 'react';
 declare const InputAutocompleteModalMobile: React.ForwardRefExoticComponent<import("../types").InputAutocompleteCommonProps & {
     isBottomSheet?: boolean | undefined;
     transitionProps?: Partial<import("react-transition-group/Transition").TransitionProps<undefined>> | undefined;
+    onApply?: (() => void) | undefined;
+    onCancel?: (() => void) | undefined;
+    title?: string | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 export { InputAutocompleteModalMobile };

package/mobile/mobile.css

@@ -1,4 +1,4 @@
-/* hash: 1otm4 */
+/* hash: x785z */
 :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 */
@@ -14,6 +14,6 @@
 } :root {
 } :root {
 } :root {
-} .input-autocomplete__input_fjopa {
+} .input-autocomplete__input_qz9dz {
     width: auto;
 }

package/modern/autocomplete-field/Component.js

@@ -3,7 +3,7 @@ import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { InputDesktop } from '@alfalab/core-components-input/modern/desktop';
 
-const styles = {"arrow":"input-autocomplete__arrow_wt0tr","error":"input-autocomplete__error_wt0tr"};
+const styles = {"arrow":"input-autocomplete__arrow_ldg52","error":"input-autocomplete__error_ldg52"};
 require('./index.css')
 
 const AutocompleteField = ({ label, labelView = 'inner', placeholder, size, Arrow, Input = InputDesktop, value, error, success, hint, disabled, readOnly, onInput, inputProps = {}, innerProps, }) => {

package/modern/autocomplete-field/index.css

@@ -1,4 +1,4 @@
-/* hash: wsrha */
-.input-autocomplete__arrow_wt0tr.input-autocomplete__error_wt0tr ~ * {
+/* hash: 5vm6i */
+.input-autocomplete__arrow_ldg52.input-autocomplete__error_ldg52 ~ * {
     display: none;
 }

package/modern/autocomplete-mobile-field/Component.js

@@ -5,7 +5,7 @@ import { ClearButton } from '@alfalab/core-components-input/modern/shared';
 import { getDataTestId } from '@alfalab/core-components-shared/modern';
 import { useFocus } from '@alfalab/hooks';
 
-const styles = {"component":"input-autocomplete__component_ymkry","field":"input-autocomplete__field_ymkry","disabled":"input-autocomplete__disabled_ymkry","placeholder":"input-autocomplete__placeholder_ymkry","contentWrapper":"input-autocomplete__contentWrapper_ymkry","value":"input-autocomplete__value_ymkry","focusVisible":"input-autocomplete__focusVisible_ymkry"};
+const styles = {"component":"input-autocomplete__component_3udw2","field":"input-autocomplete__field_3udw2","disabled":"input-autocomplete__disabled_3udw2","placeholder":"input-autocomplete__placeholder_3udw2","contentWrapper":"input-autocomplete__contentWrapper_3udw2","value":"input-autocomplete__value_3udw2","focusVisible":"input-autocomplete__focusVisible_3udw2"};
 require('./index.css')
 
 const AutocompleteMobileField = ({ size = 'm', open, disabled, value, innerProps, dataTestId, fieldClassName, labelView = 'inner', placeholder, Arrow, valueRenderer, toggleMenu, setSelectedItems, selectedMultiple, FormControlComponent, rightAddons, error, readOnly, clear, onClear, onInput, colors = 'default', ...restProps }) => {

package/modern/autocomplete-mobile-field/index.css

@@ -1,4 +1,4 @@
-/* hash: ru4db */
+/* hash: 1yog3 */
 :root {
 } /* deprecated */ :root {
     --color-light-border-link: #2288fa;
@@ -18,16 +18,16 @@
 } :root {
     --focus-color: var(--color-light-border-link);
     --disabled-cursor: not-allowed;
-} .input-autocomplete__component_ymkry {
+} .input-autocomplete__component_3udw2 {
     width: 100%;
     outline: none;
-} .input-autocomplete__field_ymkry:not(.input-autocomplete__disabled_ymkry) {
+} .input-autocomplete__field_3udw2:not(.input-autocomplete__disabled_3udw2) {
     cursor: pointer;
-} .input-autocomplete__disabled_ymkry {
+} .input-autocomplete__disabled_3udw2 {
     cursor: var(--disabled-cursor);
-} .input-autocomplete__placeholder_ymkry {
+} .input-autocomplete__placeholder_3udw2 {
     color: var(--color-light-text-secondary);
-} .input-autocomplete__contentWrapper_ymkry {
+} .input-autocomplete__contentWrapper_3udw2 {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -36,11 +36,11 @@
     text-overflow: ellipsis;
     overflow: hidden;
     width: 100%;
-} .input-autocomplete__value_ymkry {
+} .input-autocomplete__value_3udw2 {
     overflow: hidden;
     text-overflow: ellipsis;
     text-align: left;
-} .input-autocomplete__focusVisible_ymkry {
+} .input-autocomplete__focusVisible_3udw2 {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }

package/modern/mobile/Component.mobile.d.ts

@@ -4,5 +4,8 @@ import React from 'react';
 declare const InputAutocompleteMobile: React.ForwardRefExoticComponent<import("../types").InputAutocompleteCommonProps & {
     isBottomSheet?: boolean | undefined;
     transitionProps?: Partial<import("react-transition-group/Transition").TransitionProps<undefined>> | undefined;
+    onApply?: (() => void) | undefined;
+    onCancel?: (() => void) | undefined;
+    title?: string | undefined;
 } & React.RefAttributes<unknown>>;
 export { InputAutocompleteMobile };

package/modern/mobile/Component.mobile.js

@@ -11,10 +11,10 @@ import '@alfalab/core-components-input/modern/shared';
 import '@alfalab/core-components-shared/modern';
 import '@alfalab/hooks';
 
-const styles = {"input":"input-autocomplete__input_fjopa"};
+const styles = {"input":"input-autocomplete__input_qz9dz"};
 require('./mobile.css')
 
-const InputAutocompleteMobile = React.forwardRef(({ Input, value, name, Arrow = null, label, placeholder = '', size = 's', open: openProp, onInput, onOpen, multiple, inputProps, isBottomSheet = true, dataTestId, transitionProps, ...restProps }, ref) => {
+const InputAutocompleteMobile = React.forwardRef(({ Input, value, name, Arrow = null, label, placeholder = '', size = 's', open: openProp, onInput, onOpen, multiple, inputProps, isBottomSheet = true, dataTestId, transitionProps, onCancel, onApply, title, ...restProps }, ref) => {
     const [open, setOpen] = useState(false);
     const frozenValue = useRef('');
     const searchInputRef = useRef(null);
@@ -38,12 +38,15 @@ const InputAutocompleteMobile = React.forwardRef(({ Input, value, name, Arrow =
             input.blur();
         }
     }, 300), []);
-    const handleApply = () => setModalVisibility(false);
+    const handleApply = () => {
+        setModalVisibility(false);
+        onApply?.();
+    };
     const handleCancel = () => {
         setModalVisibility(false);
         restorePrevValue();
+        onCancel?.();
     };
-    const handleClear = () => onInput?.(null, { value: '' });
     const handleExiting = (node) => {
         targetRef.current?.focus();
         transitionProps?.onExiting?.(node);
@@ -51,7 +54,7 @@ const InputAutocompleteMobile = React.forwardRef(({ Input, value, name, Arrow =
     const isOpen = Boolean(open || openProp);
     const Component = isBottomSheet ? SelectMobile : SelectModalMobile;
     const componentProps = {
-        title: label || placeholder,
+        title: title || label || placeholder,
         onClose: restorePrevValue,
         transitionProps: {
             ...transitionProps,
@@ -64,7 +67,10 @@ const InputAutocompleteMobile = React.forwardRef(({ Input, value, name, Arrow =
     const clear = inputProps?.clear ?? false;
     return (React.createElement(Component, { Field: AutocompleteMobileField, ...restProps, ...(isBottomSheet
             ? { bottomSheetProps: componentProps }
-            : { modalProps: componentProps }), dataTestId: dataTestId, useWithApplyHook: false, showSearch: true, searchProps: {
+            : {
+                modalProps: componentProps,
+                modalHeaderProps: { title },
+            }), dataTestId: dataTestId, useWithApplyHook: false, showSearch: true, searchProps: {
             value,
             filterFn: searchFilterStub,
             componentProps: {
@@ -82,7 +88,7 @@ const InputAutocompleteMobile = React.forwardRef(({ Input, value, name, Arrow =
         }, fieldProps: {
             value: isOpen ? frozenValue.current : value,
             clear,
-            onClear: clear ? handleClear : undefined,
+            onClear: clear ? inputProps?.onClear : undefined,
             ...restProps.fieldProps,
         } }));
 });

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

@@ -4,5 +4,8 @@ import React from 'react';
 declare const InputAutocompleteModalMobile: React.ForwardRefExoticComponent<import("../types").InputAutocompleteCommonProps & {
     isBottomSheet?: boolean | undefined;
     transitionProps?: Partial<import("react-transition-group/Transition").TransitionProps<undefined>> | undefined;
+    onApply?: (() => void) | undefined;
+    onCancel?: (() => void) | undefined;
+    title?: string | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 export { InputAutocompleteModalMobile };

package/modern/mobile/mobile.css

@@ -1,4 +1,4 @@
-/* hash: 1otm4 */
+/* hash: x785z */
 :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 */
@@ -14,6 +14,6 @@
 } :root {
 } :root {
 } :root {
-} .input-autocomplete__input_fjopa {
+} .input-autocomplete__input_qz9dz {
     width: auto;
 }

package/modern/types.d.ts

@@ -38,6 +38,19 @@ type MobileProps = {
      * Пропсы анимации контента (CSSTransition)
      */
     transitionProps?: NonNullable<BottomSheetSelectMobileProps['bottomSheetProps']>['transitionProps'];
+    /**
+     * Обработчик нажатия на кнопку «Продолжить» в BottomSheet или модальном окне
+     */
+    onApply?: () => void;
+    /**
+     * Обработчик нажатия на кнопку «Отмена» в BottomSheet или модальном окне
+     */
+    onCancel?: () => void;
+    /**
+     * Заголовок в модальном окне или шторке.
+     * Если не передан, то заголовок будет совпадать с label. Если не передан и label, то заголовок будет равен placeholder
+     */
+    title?: string;
 };
 type InputAutocompleteMobileProps = InputAutocompleteCommonProps & MobileProps;
 interface InputAutocompleteProps extends InputAutocompleteCommonProps {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-input-autocomplete",
-    "version": "11.1.0",
+    "version": "11.3.0",
     "description": "",
     "keywords": [],
     "license": "MIT",

package/src/mobile/Component.mobile.tsx

@@ -39,6 +39,9 @@ export const InputAutocompleteMobile = React.forwardRef(
             isBottomSheet = true,
             dataTestId,
             transitionProps,
+            onCancel,
+            onApply,
+            title,
             ...restProps
         }: InputAutocompleteMobileProps,
         ref,
@@ -78,15 +81,17 @@ export const InputAutocompleteMobile = React.forwardRef(
             [],
         );
 
-        const handleApply = () => setModalVisibility(false);
+        const handleApply = () => {
+            setModalVisibility(false);
+            onApply?.();
+        };
 
         const handleCancel = () => {
             setModalVisibility(false);
             restorePrevValue();
+            onCancel?.();
         };
 
-        const handleClear = () => onInput?.(null, { value: '' });
-
         const handleExiting = (node: HTMLElement) => {
             targetRef.current?.focus();
             transitionProps?.onExiting?.(node);
@@ -99,7 +104,7 @@ export const InputAutocompleteMobile = React.forwardRef(
         const componentProps:
             | ModalSelectMobileProps['modalProps']
             | BottomSheetSelectMobileProps['bottomSheetProps'] = {
-            title: label || placeholder,
+            title: title || label || placeholder,
             onClose: restorePrevValue,
             transitionProps: {
                 ...transitionProps,
@@ -118,7 +123,10 @@ export const InputAutocompleteMobile = React.forwardRef(
                 {...restProps}
                 {...(isBottomSheet
                     ? { bottomSheetProps: componentProps }
-                    : { modalProps: componentProps })}
+                    : {
+                          modalProps: componentProps,
+                          modalHeaderProps: { title },
+                      })}
                 dataTestId={dataTestId}
                 useWithApplyHook={false}
                 showSearch={true}
@@ -161,7 +169,7 @@ export const InputAutocompleteMobile = React.forwardRef(
                 fieldProps={{
                     value: isOpen ? frozenValue.current : value,
                     clear,
-                    onClear: clear ? handleClear : undefined,
+                    onClear: clear ? inputProps?.onClear : undefined,
                     ...(restProps.fieldProps as AnyObject),
                 }}
             />

package/src/types.ts

@@ -54,6 +54,22 @@ type MobileProps = {
     transitionProps?: NonNullable<
         BottomSheetSelectMobileProps['bottomSheetProps']
     >['transitionProps'];
+
+    /**
+     * Обработчик нажатия на кнопку «Продолжить» в BottomSheet или модальном окне
+     */
+    onApply?: () => void;
+
+    /**
+     * Обработчик нажатия на кнопку «Отмена» в BottomSheet или модальном окне
+     */
+    onCancel?: () => void;
+
+    /**
+     * Заголовок в модальном окне или шторке.
+     * Если не передан, то заголовок будет совпадать с label. Если не передан и label, то заголовок будет равен placeholder
+     */
+    title?: string;
 };
 
 export type InputAutocompleteMobileProps = InputAutocompleteCommonProps & MobileProps;

package/types.d.ts

@@ -38,6 +38,19 @@ type MobileProps = {
      * Пропсы анимации контента (CSSTransition)
      */
     transitionProps?: NonNullable<BottomSheetSelectMobileProps['bottomSheetProps']>['transitionProps'];
+    /**
+     * Обработчик нажатия на кнопку «Продолжить» в BottomSheet или модальном окне
+     */
+    onApply?: () => void;
+    /**
+     * Обработчик нажатия на кнопку «Отмена» в BottomSheet или модальном окне
+     */
+    onCancel?: () => void;
+    /**
+     * Заголовок в модальном окне или шторке.
+     * Если не передан, то заголовок будет совпадать с label. Если не передан и label, то заголовок будет равен placeholder
+     */
+    title?: string;
 };
 type InputAutocompleteMobileProps = InputAutocompleteCommonProps & MobileProps;
 interface InputAutocompleteProps extends InputAutocompleteCommonProps {