@alfalab/core-components-international-phone-input 1.0.0

package/cssm/types.d.ts

@@ -0,0 +1,100 @@
+import { ChangeEvent, ElementType, FC, FocusEvent } from 'react';
+import { InputProps } from "@alfalab/core-components-input";
+import { InputDesktopProps } from "./desktop-63dec22f";
+import { InputMobileProps } from "./mobile-96988a65";
+import { InputAutocompleteProps } from "@alfalab/core-components-input-autocomplete";
+import { InputAutocompleteDesktopProps } from "./desktop-232828f7";
+import { InputAutocompleteMobileProps } from "./mobile-4c19bc40";
+import { OptionShape } from "./typings-dd8ca091";
+import { SharedCountrySelectProps } from "./components/country-select/index";
+type Country = {
+    name: string;
+    regions?: string[];
+    iso2: string;
+    countryCode: string;
+    dialCode: string;
+    format?: string;
+    priority: number;
+    mainCode?: boolean;
+};
+type AreaItem = Country & {
+    isAreaCode: boolean;
+    areaCodeLength: number;
+};
+type CommonPhoneInputProps = {
+    /**
+     *  Выбранная страна
+     */
+    country?: Country;
+    /**
+     * Список необходимых iso2 стран
+     */
+    countries?: string[];
+    /**
+     * Дефолтный код страны
+     */
+    defaultIso2?: string;
+    /**
+     * Возможность стереть код страны
+     */
+    clearableCountryCode?: boolean;
+    /**
+     *  Свойства селекта выбора стран
+     */
+    countrySelectProps?: SharedCountrySelectProps;
+    /**
+     *Показывать крестик очистки
+     */
+    clear?: boolean;
+    /**
+     * Функция фильтрации номеров для автокомплита
+     */
+    filterFn?: (value: string | undefined, option: OptionShape) => boolean;
+    /**
+     * Обработчик события изменения страны
+     */
+    onCountryChange?: (country?: Country) => void;
+    /**
+     *  Обработчик изменения номера
+     */
+    onChange?: (e: ChangeEvent<HTMLInputElement> | null, { value }: {
+        value: string;
+    }) => void;
+    /**
+     * Обработчик блюра поля
+     */
+    onBlur?: (event: FocusEvent<HTMLDivElement | HTMLInputElement>) => void;
+    /**
+     * Обработчик фокуса поля
+     */
+    onFocus?: (event: FocusEvent<HTMLDivElement | HTMLInputElement>) => void;
+};
+type BaseInternationalPhoneInputProps = CommonPhoneInputProps & {
+    Input: FC<InputProps>;
+    InputAutocomplete: FC<InputAutocompleteProps>;
+    SelectComponent: ElementType;
+    view: 'desktop' | 'mobile';
+    countriesData: Country[][];
+} & Omit<InputProps, 'onFocus' | 'onBlur' | 'onScroll'> & Partial<Omit<InputAutocompleteProps, 'onChange' | 'leftAddons' | 'onScroll'>>;
+type InternationalPhoneInputDesktopProps = CommonPhoneInputProps & (({
+    options?: never;
+} & Omit<InputDesktopProps, 'onFocus' | 'onBlur' | 'clear' | 'onClear' | 'onChange'>) | ({
+    options: InputAutocompleteDesktopProps['options'];
+} & Omit<InputAutocompleteDesktopProps, 'onChange'>));
+type InternationalPhoneInputMobileProps = CommonPhoneInputProps & (({
+    options?: never;
+} & Omit<InputMobileProps, 'onFocus' | 'onBlur' | 'clear' | 'onClear' | 'onChange'>) | ({
+    options: InputAutocompleteMobileProps['options'];
+} & Omit<InputAutocompleteMobileProps, 'onChange' | 'onFilter' | 'filter' | 'onClearFilter'>));
+type InternationalPhoneInputProps = InternationalPhoneInputDesktopProps & InternationalPhoneInputMobileProps & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+    /**
+     * Значение по-умолчанию для хука useMatchMedia
+     */
+    defaultMatchMediaValue?: boolean | (() => boolean);
+};
+export { Country, AreaItem, BaseInternationalPhoneInputProps, InternationalPhoneInputDesktopProps, InternationalPhoneInputMobileProps, InternationalPhoneInputProps };

package/cssm/types.js

@@ -0,0 +1,2 @@
+'use strict';
+

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

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

package/cssm/typings-bdb4c6b9.d.ts

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