@alfalab/core-components-input-autocomplete 10.0.4 → 10.1.1

package/Component-2abb571d.d.ts

@@ -0,0 +1,276 @@
+/// <reference types="react" />
+import React from 'react';
+import { ChangeEvent, ElementType, InputHTMLAttributes, MouseEvent, ReactNode } from "react";
+type StyleColors = {
+    default: {
+        [key: string]: string;
+    };
+    inverted: {
+        [key: string]: string;
+    };
+};
+type BaseInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'value' | 'defaultValue' | 'onChange' | 'onClick' | 'onMouseDown' | 'enterKeyHint'> & {
+    /**
+     * Значение поля ввода
+     */
+    value?: string;
+    /**
+     * Начальное значение поля
+     */
+    defaultValue?: string;
+    /**
+     * Растягивает компонент на ширину контейнера
+     */
+    block?: boolean;
+    /**
+     * Крестик для очистки поля
+     */
+    clear?: boolean;
+    /**
+     * Размер компонента
+     */
+    size?: 's' | 'm' | 'l' | 'xl';
+    /**
+     * Набор цветов для компонента
+     */
+    colors?: 'default' | 'inverted';
+    /**
+     * Отображение ошибки
+     */
+    error?: ReactNode | boolean;
+    /**
+     * Отображение иконки успеха
+     */
+    success?: boolean;
+    /**
+     * Текст подсказки
+     */
+    hint?: ReactNode;
+    /**
+     * Лейбл компонента
+     */
+    label?: React.ReactNode;
+    /**
+     * Вид лейбла внутри / снаружи
+     */
+    labelView?: 'inner' | 'outer';
+    /**
+     * Атрибут type
+     */
+    type?: 'number' | 'card' | 'email' | 'money' | 'password' | 'tel' | 'text';
+    /**
+     * Ref для обертки input
+     */
+    wrapperRef?: React.Ref<HTMLDivElement> | null;
+    /**
+     * Слот слева
+     */
+    leftAddons?: React.ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: React.ReactNode;
+    /**
+     * Слот под инпутом
+     */
+    bottomAddons?: React.ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для поля
+     */
+    fieldClassName?: string;
+    /**
+     * Дополнительный класс инпута
+     */
+    inputClassName?: string;
+    /**
+     * Дополнительный класс для лейбла
+     */
+    labelClassName?: string;
+    /**
+     * Дополнительный класс для аддонов
+     */
+    addonsClassName?: string;
+    /**
+     * Класс, который будет установлен при фокусе
+     */
+    focusedClassName?: string;
+    /**
+     * Класс, который будет установлен, если в поле есть значение
+     */
+    filledClassName?: string;
+    /**
+     * Обработчик поля ввода
+     */
+    onChange?: (event: ChangeEvent<HTMLInputElement>, payload: {
+        value: string;
+    }) => void;
+    /**
+     * Обработчик нажатия на кнопку очистки
+     */
+    onClear?: (event: MouseEvent<HTMLButtonElement>) => void;
+    /**
+     * Обработчик клика по полю
+     */
+    onClick?: (event: MouseEvent<HTMLDivElement>) => void;
+    /**
+     * Обработчик MouseDown по полю
+     */
+    onMouseDown?: (event: MouseEvent<HTMLDivElement>) => void;
+    /**
+     * Обработчик MouseUp по полю
+     */
+    onMouseUp?: (event: MouseEvent<HTMLDivElement>) => void;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    FormControlComponent?: ElementType;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Стили компонента для default и inverted режима.
+     */
+    colorStyles?: StyleColors;
+    /**
+     * Запрещает ввод с клавиатуры
+     */
+    disableUserInput?: boolean;
+};
+declare const BaseInput: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "value" | "enterKeyHint"> & {
+    /**
+     * Значение поля ввода
+     */
+    value?: string | undefined;
+    /**
+     * Начальное значение поля
+     */
+    defaultValue?: string | undefined;
+    /**
+     * Растягивает компонент на ширину контейнера
+     */
+    block?: boolean | undefined;
+    /**
+     * Крестик для очистки поля
+     */
+    clear?: boolean | undefined;
+    /**
+     * Размер компонента
+     */
+    size?: "s" | "m" | "l" | "xl" | undefined;
+    /**
+     * Набор цветов для компонента
+     */
+    colors?: "default" | "inverted" | undefined;
+    /**
+     * Отображение ошибки
+     */
+    error?: ReactNode | boolean;
+    /**
+     * Отображение иконки успеха
+     */
+    success?: boolean | undefined;
+    /**
+     * Текст подсказки
+     */
+    hint?: ReactNode;
+    /**
+     * Лейбл компонента
+     */
+    label?: React.ReactNode;
+    /**
+     * Вид лейбла внутри / снаружи
+     */
+    labelView?: "inner" | "outer" | undefined;
+    /**
+     * Атрибут type
+     */
+    type?: "number" | "text" | "tel" | "email" | "card" | "money" | "password" | undefined;
+    /**
+     * Ref для обертки input
+     */
+    wrapperRef?: React.Ref<HTMLDivElement> | undefined;
+    /**
+     * Слот слева
+     */
+    leftAddons?: React.ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: React.ReactNode;
+    /**
+     * Слот под инпутом
+     */
+    bottomAddons?: React.ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string | undefined;
+    /**
+     * Дополнительный класс для поля
+     */
+    fieldClassName?: string | undefined;
+    /**
+     * Дополнительный класс инпута
+     */
+    inputClassName?: string | undefined;
+    /**
+     * Дополнительный класс для лейбла
+     */
+    labelClassName?: string | undefined;
+    /**
+     * Дополнительный класс для аддонов
+     */
+    addonsClassName?: string | undefined;
+    /**
+     * Класс, который будет установлен при фокусе
+     */
+    focusedClassName?: string | undefined;
+    /**
+     * Класс, который будет установлен, если в поле есть значение
+     */
+    filledClassName?: string | undefined;
+    /**
+     * Обработчик поля ввода
+     */
+    onChange?: ((event: ChangeEvent<HTMLInputElement>, payload: {
+        value: string;
+    }) => void) | undefined;
+    /**
+     * Обработчик нажатия на кнопку очистки
+     */
+    onClear?: ((event: MouseEvent<HTMLButtonElement>) => void) | undefined;
+    /**
+     * Обработчик клика по полю
+     */
+    onClick?: ((event: MouseEvent<HTMLDivElement>) => void) | undefined;
+    /**
+     * Обработчик MouseDown по полю
+     */
+    onMouseDown?: ((event: MouseEvent<HTMLDivElement>) => void) | undefined;
+    /**
+     * Обработчик MouseUp по полю
+     */
+    onMouseUp?: ((event: MouseEvent<HTMLDivElement>) => void) | undefined;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    FormControlComponent?: React.ElementType<any> | undefined;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string | undefined;
+    /**
+     * Стили компонента для default и inverted режима.
+     */
+    colorStyles?: StyleColors | undefined;
+    /**
+     * Запрещает ввод с клавиатуры
+     */
+    disableUserInput?: boolean | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+export { StyleColors, BaseInputProps, BaseInput };

package/{Component-50136800.d.ts → Component-dd8ca091.d.ts}

@@ -2,7 +2,7 @@
 import React from 'react';
 import { ReactNode } from "react";
 import { BottomSheetProps } from "./index-f12ee135";
-import { BaseSelectProps } from "./typings-5e1b8383";
+import { BaseSelectProps } from "./typings-dd8ca091";
 type SelectMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll'> & {
     /**
      * Футер

package/{esm/Component.mobile-06ffd24b.d.ts → Component.mobile-ade26e99.d.ts}

@@ -2,8 +2,8 @@
 import React from 'react';
 import { ReactNode } from "react";
 import { BottomSheetProps } from "./index-f12ee135";
-import { UseSelectWithApplyProps } from "./hook-9ea9e32c";
-import { BaseSelectProps } from "./typings-5e1b8383";
+import { UseSelectWithApplyProps } from "./hook-8abfea97";
+import { BaseSelectProps } from "./typings-dd8ca091";
 type AdditionalMobileProps = {
     /**
      * Футер

package/Component.mobile-ebda875c.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import React from 'react';
+import { AnchorButtonProps, NativeButtonProps } from "./typings-9211a437";
+type ButtonMobileProps = Partial<AnchorButtonProps | NativeButtonProps>;
+declare const ButtonMobile: React.ForwardRefExoticComponent<ButtonMobileProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
+export { ButtonMobileProps, ButtonMobile };

package/Component.mobile.js

@@ -11,7 +11,7 @@ var mobile$1 = require('@alfalab/core-components-button/mobile');
 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-0440a603.js');
+var mobile_module = require('./mobile.module-e6e04ea3.js');
 require('@alfalab/core-components-form-control/mobile');
 require('@alfalab/hooks');
 

package/{esm/Component.modal.mobile-5e1b8383.d.ts → Component.modal.mobile-dd8ca091.d.ts}

@@ -1,8 +1,8 @@
 /// <reference types="react" />
 import React from 'react';
 import { ModalMobile } from "./Component.mobile-f1f15074";
-import { UseSelectWithApplyProps } from "./hook-9ea9e32c";
-import { BaseSelectProps } from "./typings-5e1b8383";
+import { UseSelectWithApplyProps } from "./hook-8abfea97";
+import { BaseSelectProps } from "./typings-dd8ca091";
 type SelectModalMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll'> & {
     /**
      * Показывать кнопку очистки

package/Component.modal.mobile.d.ts

@@ -2,7 +2,7 @@
 import React from 'react';
 import { ChangeEvent, ElementType } from "react";
 import { ButtonMobileProps } from "./mobile-96988a65";
-import { SelectModalMobileProps } from "./mobile-06ffd24b";
+import { SelectModalMobileProps } from "./mobile-ade26e99";
 import { BaseSelectChangePayload } from "./shared-4cd3936b";
 type InputAutocompleteModalMobileProps = Omit<SelectModalMobileProps, 'OptionsList' | 'Checkmark' | 'onScroll' | 'nativeSelect' | 'autocomplete' | 'valueRenderer'> & {
     /**

package/Component.modal.mobile.js

@@ -11,7 +11,7 @@ var mobile$1 = require('@alfalab/core-components-button/mobile');
 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-0440a603.js');
+var mobile_module = require('./mobile.module-e6e04ea3.js');
 require('@alfalab/core-components-form-control/mobile');
 require('@alfalab/hooks');
 

package/Component.responsive.js

@@ -18,7 +18,7 @@ require('@alfalab/core-components-input');
 require('@alfalab/core-components-select/mobile');
 require('./autocomplete-mobile-field/Component.js');
 require('@alfalab/core-components-form-control/mobile');
-require('./mobile.module-0440a603.js');
+require('./mobile.module-e6e04ea3.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

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_8klvd","error":"input-autocomplete__error_8klvd"};
+var styles = {"arrow":"input-autocomplete__arrow_1j74k","error":"input-autocomplete__error_1j74k"};
 require('./index.css')
 
 var AutocompleteField = function (_a) {

package/autocomplete-field/index.css

@@ -1,4 +1,4 @@
-/* hash: 15489 */
-.input-autocomplete__arrow_8klvd.input-autocomplete__error_8klvd ~ * {
+/* hash: 1okxh */
+.input-autocomplete__arrow_1j74k.input-autocomplete__error_1j74k ~ * {
     display: none;
 }

package/autocomplete-mobile-field/Component.js

@@ -13,7 +13,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_1muzq","field":"input-autocomplete__field_1muzq","disabled":"input-autocomplete__disabled_1muzq","placeholder":"input-autocomplete__placeholder_1muzq","contentWrapper":"input-autocomplete__contentWrapper_1muzq","value":"input-autocomplete__value_1muzq","focusVisible":"input-autocomplete__focusVisible_1muzq"};
+var styles = {"component":"input-autocomplete__component_o9n8b","field":"input-autocomplete__field_o9n8b","disabled":"input-autocomplete__disabled_o9n8b","placeholder":"input-autocomplete__placeholder_o9n8b","contentWrapper":"input-autocomplete__contentWrapper_o9n8b","value":"input-autocomplete__value_o9n8b","focusVisible":"input-autocomplete__focusVisible_o9n8b"};
 require('./index.css')
 
 var AutocompleteMobileField = function (_a) {

package/autocomplete-mobile-field/index.css

@@ -1,4 +1,4 @@
-/* hash: jinkn */
+/* hash: 1nf4k */
 :root {
 } /* deprecated */ :root {
     --color-light-border-link: #0072ef;
@@ -18,16 +18,16 @@
 } :root {
     --focus-color: var(--color-light-border-link);
     --disabled-cursor: not-allowed;
-} .input-autocomplete__component_1muzq {
+} .input-autocomplete__component_o9n8b {
     width: 100%;
     outline: none;
-} .input-autocomplete__field_1muzq:not(.input-autocomplete__disabled_1muzq) {
+} .input-autocomplete__field_o9n8b:not(.input-autocomplete__disabled_o9n8b) {
     cursor: pointer;
-} .input-autocomplete__disabled_1muzq {
+} .input-autocomplete__disabled_o9n8b {
     cursor: var(--disabled-cursor);
-} .input-autocomplete__placeholder_1muzq {
+} .input-autocomplete__placeholder_o9n8b {
     color: var(--color-light-text-secondary);
-} .input-autocomplete__contentWrapper_1muzq {
+} .input-autocomplete__contentWrapper_o9n8b {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -36,11 +36,11 @@
     text-overflow: ellipsis;
     overflow: hidden;
     width: 100%;
-} .input-autocomplete__value_1muzq {
+} .input-autocomplete__value_o9n8b {
     overflow: hidden;
     text-overflow: ellipsis;
     text-align: left;
-} .input-autocomplete__focusVisible_1muzq {
+} .input-autocomplete__focusVisible_o9n8b {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }