@alfalab/core-components 42.2.2 → 42.2.3

package/custom-picker-button/esm/Component-8b2c2707.d.ts

@@ -1,12 +1,268 @@
 /// <reference types="react" />
 import React from 'react';
-import { ButtonProps } from "./index-8b2c2707";
-import { FieldProps as BaseFieldProps } from "./typings-5e1b8383";
-import { PickerButtonSize, PickerButtonVariant } from "./types-4480ac4f";
-type FieldProps = Omit<BaseFieldProps, 'size' | 'hint' | 'success' | 'error' | 'placeholder'> & ButtonProps & {
-    buttonSize?: PickerButtonSize;
-    buttonVariant?: PickerButtonVariant;
-    showArrow?: boolean;
+import { ChangeEvent, ElementType, InputHTMLAttributes, MouseEvent, ReactNode } from "react";
+type StyleColors = {
+    default: {
+        [key: string]: string;
+    };
+    inverted: {
+        [key: string]: string;
+    };
 };
-declare const Field: ({ buttonSize, buttonVariant, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, setSelectedItems, toggleMenu, valueRenderer, showArrow, labelView, ...restProps }: FieldProps) => React.JSX.Element;
-export { Field };
+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;
+};
+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" | "password" | "card" | "money" | 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;
+} & React.RefAttributes<HTMLInputElement>>;
+export { StyleColors, BaseInputProps, BaseInput };

package/custom-picker-button/esm/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/custom-picker-button/esm/Component-ebda875c.d.ts

@@ -1,12 +1,101 @@
-/// <reference types="react" />
 /// <reference types="react-transition-group" />
+/// <reference types="react" />
 import React from 'react';
-import { CheckboxProps } from "./index-ebda875c";
-type HeaderProps = {
-    checked?: boolean;
-    indeterminate?: boolean;
-    onChange?: CheckboxProps['onChange'];
-    mobile?: boolean;
+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 Header: React.FC<HeaderProps>;
-export { HeaderProps, Header };
+declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
+export { Position, PopoverProps, Popover };

package/{intl-phone-input/esm/Component-50136800.d.ts → custom-picker-button/esm/Component-f12ee135.d.ts}

@@ -1,48 +1,17 @@
 /// <reference types="react" />
-import React from "react";
-import { FC, ReactNode, RefObject } from "react";
-import { NavigationBarProps } from "./index-c76d6398";
-import { SwipeableHandlers } from "react-swipeable";
-import { BackdropProps } from "./index-ebda875c";
-import { BottomSheetProps } from "./types-72dda473";
-type FooterProps = {
+import React from 'react';
+import { ReactNode } from "react";
+import { BottomSheetProps } from "./index-f12ee135";
+import { BaseSelectProps } from "./typings-5e1b8383";
+type SelectMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll'> & {
     /**
-     * Контент футера
-     */
-    children?: ReactNode;
-    /**
-     * Фиксирует футер
-     */
-    sticky?: boolean;
-    /**
-     * Дополнительный класс
-     */
-    className?: string;
-};
-declare const Footer: FC<FooterProps>;
-type HeaderProps = Omit<NavigationBarProps, "view" | "size"> & {
-    headerRef: RefObject<HTMLDivElement>;
-    headerOffset: number;
-};
-declare const Header: FC<HeaderProps>;
-type SwipeableBackdropProps = BackdropProps & {
-    /**
-     * Прозрачность бэкдропа
-     */
-    opacity?: number;
-    /**
-     * Обработчики свайпа
+     * Футер
+     * @deprecated Используйте bottomSheetProps.actionButton
      */
-    handlers?: SwipeableHandlers;
+    footer?: ReactNode;
     /**
-     * Время анимации opacity
-     */
-    opacityTimeout?: number;
-};
-declare const SwipeableBackdrop: FC<SwipeableBackdropProps>;
-declare const BottomSheet: React.ForwardRefExoticComponent<BottomSheetProps & React.RefAttributes<HTMLDivElement>>;
-export { FooterProps, Footer, HeaderProps, Header, SwipeableBackdropProps, SwipeableBackdrop, BottomSheet };
-ated Используйте bottomSheetProps.swipeable
+     * Будет ли свайпаться шторка
+     * @deprecated Используйте bottomSheetProps.swipeable
      */
     swipeable?: boolean;
     /**
@@ -96,7 +65,8 @@ declare const BaseSelectMobile: React.ForwardRefExoticComponent<Omit<BaseSelectP
     /**
      *  Дополнительные пропсы футера модалки
      */
-    modalFooterProps?: Partial<FooterProps> | undefined;
+    modalFooterProps?: Partial<import("./Component.mobile-f1f15074").FooterProps> | undefined;
 } & React.RefAttributes<unknown>>;
-export { ModalMobile, Content, SelectMobileProps, BaseSelectMobile };
+export * from "./Component.mobile-f1f15074";
 export { ModalMobileProps } from "./typings-bdb4c6b9";
+export { SelectMobileProps, BaseSelectMobile };

package/custom-picker-button/esm/Component.desktop-4cd3936b.d.ts

@@ -0,0 +1,49 @@
+/// <reference types="react" />
+import React from 'react';
+import { FC, SVGProps } from "react";
+import { ButtonProps } from "./index-9211a437";
+import { BaseSelectProps } from "./shared-4cd3936b";
+import { PickerButtonSize, PickerButtonVariant } from "./types-4480ac4f";
+type PickerButtonDesktopProps = Omit<BaseSelectProps, 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'hint' | 'allowUnselect' | 'options'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+    options: Array<BaseSelectProps['options'][0] & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    }>;
+    /**
+     * Размер кнопки
+     */
+    size?: PickerButtonSize;
+    /**
+     * Тип кнопки
+     */
+    variant?: PickerButtonVariant;
+    /**
+     * Показывать стрелку
+     * @default true
+     */
+    showArrow?: boolean;
+};
+declare const PickerButtonDesktop: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "size" | "placeholder" | "onFocus" | "selected" | "multiple" | "hint" | "options" | "Arrow" | "autocomplete" | "allowUnselect" | "closeOnSelect"> & Pick<ButtonProps, "view" | "leftAddons" | "rightAddons" | "loading"> & {
+    options: Array<BaseSelectProps['options'][0] & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    }>;
+    /**
+     * Размер кнопки
+     */
+    size?: PickerButtonSize | undefined;
+    /**
+     * Тип кнопки
+     */
+    variant?: PickerButtonVariant | undefined;
+    /**
+     * Показывать стрелку
+     * @default true
+     */
+    showArrow?: boolean | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+export { PickerButtonDesktopProps, PickerButtonDesktop };

package/custom-picker-button/esm/Component.mobile-96988a65.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import React from 'react';
+import { BaseInputProps } from "./index-ebda875c";
+type InputMobileProps = Omit<BaseInputProps, 'FormControlComponent' | 'colorStyles'>;
+declare const InputMobile: React.ForwardRefExoticComponent<InputMobileProps & React.RefAttributes<HTMLInputElement>>;
+export { InputMobileProps, InputMobile };

package/custom-picker-button/esm/Component.mobile.d.ts

@@ -1,7 +1,15 @@
 /// <reference types="react" />
 import React from 'react';
 import { CustomButtonProps } from "../../custom-button";
-import { PickerButtonMobileProps } from "./Component.mobile-d446ae02";
+import { AdditionalMobileProps } from "./shared-4cd3936b";
+import { PickerButtonDesktopProps } from "./desktop-d446ae02";
+type PickerButtonMobileProps = Omit<PickerButtonDesktopProps, "OptionsList" | "Checkmark" | "onScroll"> & AdditionalMobileProps & {
+    /**
+     * Контрольная точка для кнопки, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+};
 type CustomPickerButtonMobileProps = Omit<PickerButtonMobileProps, 'view' | 'colors'> & Pick<CustomButtonProps, 'backgroundColor' | 'contentColor' | 'stateType'>;
 declare const CustomPickerButtonMobile: React.ForwardRefExoticComponent<Omit<PickerButtonMobileProps, "view" | "colors"> & Pick<CustomButtonProps, "backgroundColor" | "contentColor" | "stateType"> & React.RefAttributes<HTMLInputElement>>;
 export { CustomPickerButtonMobileProps, CustomPickerButtonMobile };

package/custom-picker-button/esm/{index-8b2c2707.d.ts → Component.responsive-2e2b2125.d.ts}

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

package/custom-picker-button/esm/desktop-d446ae02.d.ts

@@ -1,39 +1,2 @@
-/// <reference types="react" />
-import React from "react";
-import { FC, SVGProps } from "react";
-import { ButtonProps } from "./index-8b2c2707";
-import { BaseSelectProps } from "./shared-4cd3936b";
-import { PickerButtonSize, PickerButtonVariant } from "./types-4480ac4f";
-type PickerButtonDesktopProps = Omit<BaseSelectProps, "placeholder" | "Arrow" | "autocomplete" | "size" | "onFocus" | "selected" | "closeOnSelect" | "multiple" | "hint" | "allowUnselect" | "options"> & Pick<ButtonProps, "view" | "loading" | "leftAddons" | "rightAddons"> & {
-    options: Array<BaseSelectProps["options"][0] & {
-        /**
-         * Иконка, отображающаяся слева от текстового представления пункта
-         */
-        icon?: FC<SVGProps<SVGSVGElement>>;
-    }>;
-    /**
-     * Размер кнопки
-     */
-    size?: PickerButtonSize;
-    /**
-     * Тип кнопки
-     */
-    variant?: PickerButtonVariant;
-    /**
-     * Показывать стрелку
-     * @default true
-     */
-    showArrow?: boolean;
-};
-declare const PickerButtonDesktop: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "size" | "placeholder" | "onFocus" | "selected" | "multiple" | "hint" | "options" | "autocomplete" | "allowUnselect" | "closeOnSelect" | "Arrow"> & Pick<ButtonProps, "view" | "leftAddons" | "rightAddons" | "loading"> & {
-    options: Array<BaseSelectProps["options"][0] & {
-        /**
-         * Иконка, отображающаяся слева от текстового представления пункта
-         */
-        icon?: FC<SVGProps<SVGSVGElement>>;
-    }>;
-    size?: PickerButtonSize | undefined;
-    variant?: PickerButtonVariant | undefined;
-    showArrow?: boolean | undefined;
-} & React.RefAttributes<HTMLInputElement>>;
-export { PickerButtonDesktopProps, PickerButtonDesktop };
+export { PickerButtonDesktop, PickerButtonDesktopProps } from "./Component.desktop-4cd3936b";
+export {};

package/custom-picker-button/esm/hook-9ea9e32c.d.ts

@@ -41,9 +41,9 @@ declare function useSelectWithApply({ options, selected, onChange, OptionsList,
         onClose?: (() => void) | undefined;
         selectedDraft?: OptionShape[] | undefined;
         OptionsList?: import("react").FC<import("./typings-5e1b8383").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
-        Footer?: import("react").FC<import("./Component-5e1b8383").FooterProps> | undefined;
-        Header?: import("react").FC<import("./Component-ebda875c").HeaderProps> | undefined;
-        headerProps?: import("./Component-ebda875c").HeaderProps | undefined; /**
+        Footer?: import("react").FC<import("./Component-ebda875c").FooterProps> | undefined;
+        Header?: import("react").FC<import("./Component-aed0af6e").HeaderProps> | undefined;
+        headerProps?: import("./Component-aed0af6e").HeaderProps | undefined; /**
          * Показывать кнопку очистки
          */
         showHeaderWithSelectAll?: boolean | undefined;
@@ -71,5 +71,5 @@ declare function useSelectWithApply({ options, selected, onChange, OptionsList,
     onChange: (payload: import("./typings-5e1b8383").BaseSelectChangePayload) => void;
     selected: string | OptionShape | (string | OptionShape)[] | null | undefined;
 };
-export * from "./Component-5e1b8383";
+export * from "./Component-ebda875c";
 export { UseSelectWithApplyProps, SELECT_ALL_KEY, useSelectWithApply };

package/custom-picker-button/esm/index-9211a437.d.ts

@@ -0,0 +1,2 @@
+export { Button } from "./Component.responsive-2e2b2125";
+export type { ButtonProps } from "./typings-9211a437";