@alfalab/core-components 42.12.0-beta.0 → 42.13.0-beta.0

package/international-phone-input/index-bdb4c6b9.d.ts

@@ -1,180 +1,2 @@
-/// <reference types="react" />
-/// <reference types="react-transition-group" />
-/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
-import React from "react";
-import { FC, KeyboardEvent, MouseEvent, MutableRefObject, ReactNode, Ref } from "react";
-import { TransitionProps } from "react-transition-group/Transition";
-import { BackdropProps, PortalProps } from "./index-ebda875c";
-type BaseModalProps = {
-    /**
-     * Контент
-     */
-    children?: ReactNode;
-    /**
-     * Компонент бэкдропа
-     */
-    Backdrop?: FC<BackdropProps>;
-    /**
-     * Свойства для Бэкдропа
-     */
-    backdropProps?: Partial<BackdropProps> & Record<string, unknown>;
-    /**
-     * Нода, компонент или функция возвращающая их
-     *
-     * Контейнер к которому будут добавляться порталы
-     */
-    container?: PortalProps["getPortalContainer"];
-    /**
-     * Отключает автоматический перевод фокуса на модалку при открытии
-     * @default false
-     */
-    disableAutoFocus?: boolean;
-    /**
-     * Отключает ловушку фокуса
-     * @default false
-     */
-    disableFocusLock?: boolean;
-    /**
-     * Отключает восстановление фокуса на предыдущем элементе после закрытия модалки
-     * @default false
-     */
-    disableRestoreFocus?: boolean;
-    /**
-     * Отключает вызов `callback` при нажатии Escape
-     * @default false
-     */
-    disableEscapeKeyDown?: boolean;
-    /**
-     * Отключает вызов `callback` при клике на бэкдроп
-     * @default false
-     */
-    disableBackdropClick?: boolean;
-    /**
-     * Отключает блокировку скролла при открытии модального окна
-     * @default false
-     */
-    disableBlockingScroll?: boolean;
-    /**
-     * Содержимое модалки всегда в DOM
-     * @default false
-     */
-    keepMounted?: boolean;
-    /**
-     * Управление видимостью модалки
-     */
-    open: boolean;
-    /**
-     * Дополнительный класс
-     */
-    className?: string;
-    /**
-     * Дополнительный класс
-     */
-    contentClassName?: string;
-    /**
-     * Дополнительные пропсы на обертку контента
-     */
-    contentProps?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
-    /**
-     * Дополнительные пропсы на компонентную обертку контента
-     */
-    componentDivProps?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
-    /**
-     * Дополнительный класс для обертки (Modal)
-     */
-    wrapperClassName?: string;
-    /**
-     * Обработчик скролла контента
-     */
-    scrollHandler?: "wrapper" | "content" | MutableRefObject<HTMLDivElement | null>;
-    /**
-     * Пропсы для анимации (CSSTransition)
-     */
-    transitionProps?: Partial<TransitionProps>;
-    /**
-     * Рендерить ли в контейнер через портал.
-     * @default true
-     */
-    usePortal?: boolean;
-    /**
-     * Обработчик события нажатия на бэкдроп
-     */
-    onBackdropClick?: (event: MouseEvent) => void;
-    /**
-     * Обработчик события нажатия на Escape
-     *
-     * Если `disableEscapeKeyDown` - false и модальное окно в фокусе
-     */
-    onEscapeKeyDown?: (event: KeyboardEvent) => void;
-    /**
-     * Обработчик закрытия
-     */
-    onClose?: (event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>, reason?: "backdropClick" | "escapeKeyDown" | "closerClick") => void;
-    /**
-     * Обработчик события onEntered компонента Transition
-     */
-    onMount?: () => void;
-    /**
-     * Обработчик события onExited компонента Transition
-     */
-    onUnmount?: () => void;
-    /**
-     * Идентификатор для систем автоматизированного тестирования
-     */
-    dataTestId?: string;
-    /**
-     * z-index компонента
-     */
-    zIndex?: number;
-    /**
-     * Реф, который должен быть установлен компонентной области
-     */
-    componentRef?: MutableRefObject<HTMLDivElement | null>;
-};
-type BaseModalContext = {
-    parentRef: React.RefObject<HTMLDivElement>;
-    componentRef: React.RefObject<HTMLDivElement>;
-    hasFooter?: boolean;
-    hasHeader?: boolean;
-    hasScroll?: boolean;
-    headerHighlighted?: boolean;
-    footerHighlighted?: boolean;
-    headerOffset?: number;
-    setHeaderOffset: (offset: number) => void;
-    contentRef: Ref<HTMLElement>;
-    setHasHeader: (exists: boolean) => void;
-    setHasFooter: (exists: boolean) => void;
-    onClose: Required<BaseModalProps>["onClose"];
-};
-// eslint-disable-next-line @typescript-eslint/no-redeclare
-declare const BaseModalContext: React.Context<BaseModalContext>;
-declare const BaseModal: React.ForwardRefExoticComponent<BaseModalProps & React.RefAttributes<HTMLDivElement>>;
-declare function isScrolledToTop(target: HTMLElement): boolean;
-declare function isScrolledToBottom(target: HTMLElement): boolean;
-declare function hasScrollbar(target: HTMLElement): boolean;
-declare const getScrollbarSize: () => number;
-declare const restoreContainerStyles: (container: HTMLElement) => void;
-declare const handleContainer: (container?: HTMLElement) => void;
-type SavedStyle = {
-    value: string;
-    key: string;
-    el: HTMLElement;
-};
-type RestoreStyle = {
-    container: HTMLElement;
-    modals: number;
-    styles: SavedStyle[];
-};
-declare class ModalStore {
-    private readonly restoreStyles;
-    constructor();
-    getRestoreStyles: () => RestoreStyle[];
-}
-declare const getModalStore: () => ModalStore;
-declare class GlobalStore {
-    private readonly modalStore;
-    constructor();
-    getModalStore: () => ModalStore;
-}
-export { BaseModalProps, BaseModalContext, BaseModal, isScrolledToTop, isScrolledToBottom, hasScrollbar, getScrollbarSize, restoreContainerStyles, handleContainer, getModalStore, GlobalStore };
-export type { SavedStyle };
+export * from "./Component-ebda875c";
+export * from "./utils-1574ad8b";

package/international-phone-input/index-c44170fe.d.ts

@@ -1,2 +1,2 @@
-export * from "./Component.responsive-d7e9f69d";
+export * from "./Component.responsive-785df74d";
 export {};

package/international-phone-input/index-c76d6398.d.ts

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 /* eslint-disable complexity */
 import React from "react";
-import { ReactNode, ButtonHTMLAttributes, ElementType, FC, ForwardRefExoticComponent, RefAttributes, HTMLAttributes } from "react";
-import { TextElementType, TextSkeletonProps } from "./types-1b036d4b";
+import { ReactNode, ButtonHTMLAttributes, ElementType } from "react";
 interface CloserProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     /**
      * Вид компонента
@@ -136,184 +135,7 @@ type NavigationBarProps = {
     scrollableParentRef?: React.RefObject<HTMLDivElement>;
 };
 declare const NavigationBar: React.ForwardRefExoticComponent<NavigationBarProps & React.RefAttributes<HTMLDivElement>>;
-interface BackArrowAddonProps extends React.HTMLAttributes<HTMLButtonElement> {
-    /**
-     * Текст после иконки
-     */
-    text?: string;
-    /**
-     * Дополнительный класс
-     */
-    className?: string;
-    /**
-     * Вид компонента
-     */
-    view: "mobile" | "desktop";
-    /**
-     * Прозрачность текста
-     */
-    textOpacity?: number;
-    /**
-     * Обработчик клика
-     */
-    onClick?: () => void;
-}
-declare const BackArrowAddon: React.FC<BackArrowAddonProps>;
-declare const colors: readonly [
-    "tertiary",
-    "disabled",
-    "accent",
-    "primary",
-    "attention",
-    "positive",
-    "secondary",
-    "tertiary-inverted",
-    "primary-inverted",
-    "secondary-inverted",
-    "link",
-    "negative",
-    "static-primary-light",
-    "static-secondary-light",
-    "static-tertiary-light",
-    "static-primary-dark",
-    "static-secondary-dark",
-    "static-tertiary-dark",
-    "static-accent"
-];
-type Color = (typeof colors)[number];
-type NativeProps = HTMLAttributes<HTMLSpanElement>;
-type TextBaseProps = {
-    /**
-     * [Вариант начертания](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";
-    /**
-     * Цвет текста
-     */
-    color?: Color;
-    /**
-     * Толщина шрифта
-     */
-    weight?: "regular" | "medium" | "bold";
-    /**
-     * Делает цифры моноширинными
-     */
-    monospaceNumbers?: boolean;
-    /**
-     * HTML тег
-     */
-    tag?: "span" | "div";
-    /**
-     * Css-класс для стилизации (native prop)
-     */
-    className?: string;
-    /**
-     * Id компонента для тестов
-     */
-    dataTestId?: string;
-    /**
-     * Контент (native prop)
-     */
-    children?: React.ReactNode;
-    /**
-     * Добавляет отступы к тэгу 'p'
-     */
-    defaultMargins?: never;
-    /**
-     * Количество строк (не поддерживает IE)
-     */
-    rowLimit?: 1 | 2 | 3;
-    /**
-     * Показать скелетон
-     */
-    showSkeleton?: boolean;
-    /**
-     * Пропы для скелетона
-     */
-    skeletonProps?: TextSkeletonProps;
-};
-type TextPTagProps = Omit<TextBaseProps, "tag" | "defaultMargins"> & {
-    tag?: "p";
-    defaultMargins?: boolean;
-};
-type TextProps = Omit<NativeProps, "color"> & (TextBaseProps | TextPTagProps);
-type NativeProps$0 = HTMLAttributes<HTMLHeadingElement>;
-type TitleProps = Omit<NativeProps$0, "color"> & {
-    /**
-     * HTML тег
-     */
-    tag: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div";
-    /**
-     * [Вариант начертания](https://core-ds.github.io/core-components/master/?path=/docs/guidelines-typography--page)
-     */
-    view?: "xlarge" | "large" | "medium" | "small" | "xsmall";
-    /**
-     * Цвет текста
-     */
-    color?: Color;
-    /**
-     * Толщина шрифта
-     */
-    weight?: "regular" | "medium" | "bold";
-    /**
-     * Шрифт текста
-     */
-    font?: "styrene" | "system";
-    /**
-     * Добавляет отступы
-     */
-    defaultMargins?: boolean;
-    /**
-     * Css-класс для стилизации (native prop)
-     */
-    className?: string;
-    /**
-     * Id компонента для тестов
-     */
-    dataTestId?: string;
-    /**
-     * Контент (native prop)
-     */
-    children?: React.ReactNode;
-    /**
-     * Количество строк (не поддерживает IE)
-     */
-    rowLimit?: 1 | 2 | 3;
-    /**
-     * Показать скелетон
-     */
-    showSkeleton?: boolean;
-    /**
-     * Пропы для скелетона
-     */
-    skeletonProps?: TextSkeletonProps;
-};
-type TitleMobileProps = Omit<TitleProps, "defaultMargins">;
-declare const Typography: {
-    Title: FC<TitleProps>;
-    Text: ForwardRefExoticComponent<TextProps & RefAttributes<TextElementType>>;
-    TitleResponsive: FC<TitleProps>;
-    TitleMobile: FC<TitleMobileProps>;
-};
-declare const typographyPresets: {
-    mobile: {
-        list: {
-            text: {
-                primary: {
-                    tag: string;
-                    view: string;
-                };
-                secondary: {
-                    tag: string;
-                    color: string;
-                    view: string;
-                };
-            };
-        };
-    };
-};
-declare const TitleResponsive: FC<TitleProps>;
-export { NavigationBar, BackArrowAddonProps, BackArrowAddon, Typography, typographyPresets, TitleResponsive };
-export type { TitleProps, TextProps, Color, NavigationBarProps };
-export * from "./useSkeleton-1b036d4b";
+export { NavigationBar };
+export * from "./Component-69921c40";
 export * from "./Component-8b2c2707";
+export type { NavigationBarProps };

package/international-phone-input/index-ebda875c.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 /// <reference types="react-transition-group" />
-export * from "./Component-0f4b9bed";
+export * from "./Component-4cd3936b";

package/international-phone-input/mobile-4c19bc40.d.ts

@@ -1,121 +1,3 @@
-/// <reference types="react" />
-import React from "react";
-import { ChangeEvent, ElementType } from "react";
-import { ButtonMobileProps } from "./mobile-511e54fa";
-import { AdditionalMobileProps, BaseSelectChangePayload, BaseSelectProps } from "./shared-4cd3936b";
-import { SelectModalMobileProps } from "./mobile-45dc17c6";
-type InputAutocompleteMobileProps = Omit<BaseSelectProps, "OptionsList" | "Checkmark" | "onScroll" | "nativeSelect" | "autocomplete" | "valueRenderer" | "searchProps" | "showSearch" | "Search"> & {
-    /**
-     * Обработчик выбора
-     */
-    onChange: (payload: string | BaseSelectChangePayload) => void;
-    /**
-     * Обработчик ввода фильтра.
-     */
-    onFilter: (event: ChangeEvent<HTMLInputElement>) => void;
-    /**
-     * Значение поля ввода
-     */
-    value?: string;
-    /**
-     * Значение фильтра.
-     */
-    filter?: string;
-    /**
-     * Обработчик нажатия на кнопку "Отмена".
-     */
-    onCancel?: () => void;
-    /**
-     * Обработчик нажатия на крестик в инпуте фильтра.
-     */
-    onClearFilter?: () => void;
-    /**
-     * Дополнительные пропсы компонента BottomSheet
-     */
-    bottomSheetProps?: AdditionalMobileProps["bottomSheetProps"];
-    /**
-     * Дополнительные пропсы на слот под заголовком компонента BottomSheet
-     */
-    bottomSheetHeaderAddonsProps?: Record<string, unknown>;
-    /**
-     * Дополнительные пропсы на кнопку "продолжить"
-     */
-    continueButtonProps?: ButtonMobileProps;
-    /**
-     * Дополнительные пропсы на кнопку "отмена"
-     */
-    cancelButtonProps?: ButtonMobileProps;
-    /**
-     * Кастомный инпут
-     */
-    Input?: ElementType;
-};
-declare const InputAutocompleteMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "autocomplete" | "valueRenderer" | "Checkmark" | "nativeSelect" | "OptionsList" | "showSearch" | "Search" | "searchProps"> & {
-    onChange: (payload: string | BaseSelectChangePayload) => void;
-    onFilter: (event: ChangeEvent<HTMLInputElement>) => void;
-    value?: string | undefined;
-    filter?: string | undefined;
-    onCancel?: (() => void) | undefined;
-    onClearFilter?: (() => void) | undefined;
-    bottomSheetProps?: AdditionalMobileProps["bottomSheetProps"];
-    bottomSheetHeaderAddonsProps?: Record<string, unknown> | undefined;
-    continueButtonProps?: ButtonMobileProps | undefined;
-    cancelButtonProps?: ButtonMobileProps | undefined;
-    Input?: React.ElementType<any> | undefined;
-} & React.RefAttributes<unknown>>;
-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?: ButtonMobileProps;
-    /**
-     * Дополнительные пропсы на кнопку "отмена"
-     */
-    cancelButtonProps?: ButtonMobileProps;
-    /**
-     * Кастомный инпут
-     */
-    Input?: ElementType;
-};
-declare const InputAutocompleteModalMobile: React.ForwardRefExoticComponent<Omit<SelectModalMobileProps, "onScroll" | "autocomplete" | "valueRenderer" | "Checkmark" | "nativeSelect" | "OptionsList"> & {
-    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?: ButtonMobileProps | undefined;
-    cancelButtonProps?: ButtonMobileProps | undefined;
-    Input?: React.ElementType<any> | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
-export { InputAutocompleteMobileProps, InputAutocompleteMobile, InputAutocompleteModalMobileProps, InputAutocompleteModalMobile };
-export * from "./Component-96988a65";
+export { InputAutocompleteMobile, InputAutocompleteMobileProps } from "./Component.mobile-4cd3936b";
+export { InputAutocompleteModalMobile, InputAutocompleteModalMobileProps } from "./Component.modal.mobile-4cd3936b";
+export {};

package/international-phone-input/mobile-96988a65.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
-export * from "./Component.mobile-d7e9f69d";
+export * from "./Component.mobile-ebda875c";
 export {};

package/international-phone-input/mobile-f28cbba0.d.ts

@@ -0,0 +1,5 @@
+export { SelectMobile } from "./Component.mobile-f28cbba0";
+export { SelectModalMobile } from "./Component.modal.mobile-0f4b9bed";
+export type { SelectMobileProps } from "./Component.mobile-f28cbba0";
+export type { SelectModalMobileProps } from "./Component.modal.mobile-0f4b9bed";
+export {};

package/international-phone-input/modern/components/base-international-phone-input/Component.js

@@ -15,7 +15,7 @@ import '../../consts.js';
 import '../../data/country-data.js';
 import '../flag-icon/flagSprite.js';
 
-const styles = {"component":"international-phone-input__component_1n025","addons":"international-phone-input__addons_1n025"};
+const styles = {"component":"international-phone-input__component_gub4x","addons":"international-phone-input__addons_gub4x"};
 require('./index.css');
 
 const BaseInternationalPhoneInput = forwardRef(({ clearableCountryCode, value, country, onChange, onCountryChange, countrySelectProps, countries, defaultIso2, disabled, options, size = 'm', Input, InputAutocomplete, SelectComponent, view, bottomSheetHeaderAddonsProps, countriesData, clear, ...restProps }, ref) => {

package/international-phone-input/modern/components/base-international-phone-input/index.css

@@ -1,5 +1,5 @@
-/* hash: 1nb04 */
+/* hash: 1vade */
 
-    .international-phone-input__component_1n025 .international-phone-input__addons_1n025 {
+    .international-phone-input__component_gub4x .international-phone-input__addons_gub4x {
         padding-left: 0;
     }

package/international-phone-input/modern/components/country-select/Component.js

@@ -9,7 +9,7 @@ import 'react-merge-refs';
 import '@alfalab/hooks';
 import '../flag-icon/flagSprite.js';
 
-const styles = {"component":"international-phone-input__component_1r31o","option":"international-phone-input__option_1r31o","flag":"international-phone-input__flag_1r31o","countryName":"international-phone-input__countryName_1r31o","dialCode":"international-phone-input__dialCode_1r31o","flagIconWrapper":"international-phone-input__flagIconWrapper_1r31o","emptyCountryIcon":"international-phone-input__emptyCountryIcon_1r31o"};
+const styles = {"component":"international-phone-input__component_1difn","option":"international-phone-input__option_1difn","flag":"international-phone-input__flag_1difn","countryName":"international-phone-input__countryName_1difn","dialCode":"international-phone-input__dialCode_1difn","flagIconWrapper":"international-phone-input__flagIconWrapper_1difn","emptyCountryIcon":"international-phone-input__emptyCountryIcon_1difn"};
 require('./index.css');
 
 const CountrySelect = ({ hideCountrySelect, countries, country, dataTestId, fieldWidth, onChange, view = 'desktop', SelectComponent, ...restProps }) => {

package/international-phone-input/modern/components/country-select/index.css

@@ -1,4 +1,4 @@
-/* hash: 52546 */
+/* hash: z45eq */
 :root {
 } /* deprecated */ :root {
     --color-light-graphic-secondary: #86868a;
@@ -19,29 +19,29 @@
 } :root {
 } :root {
     --text-secondary-color: var(--color-light-text-secondary);
-} .international-phone-input__component_1r31o {
+} .international-phone-input__component_1difn {
     position: static;
     display: flex;
     min-width: initial;
     height: 100%;
-} .international-phone-input__option_1r31o {
+} .international-phone-input__option_1difn {
     display: flex;
     align-items: flex-start;
     padding: var(--gap-s);
-} .international-phone-input__flag_1r31o {
+} .international-phone-input__flag_1difn {
     flex-shrink: 0;
     margin-right: var(--gap-xs);
-} .international-phone-input__countryName_1r31o {
+} .international-phone-input__countryName_1difn {
     margin-right: var(--gap-xs);
-} .international-phone-input__dialCode_1r31o {
+} .international-phone-input__dialCode_1difn {
     color: var(--text-secondary-color);
-} .international-phone-input__flagIconWrapper_1r31o {
+} .international-phone-input__flagIconWrapper_1difn {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 24px;
     height: 24px;
     margin-left: var(--gap-s);
-} .international-phone-input__emptyCountryIcon_1r31o {
+} .international-phone-input__emptyCountryIcon_1difn {
     color: var(--color-light-graphic-secondary);
 }

package/international-phone-input/modern/components/flag-icon/component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { flagSprite } from './flagSprite.js';
 
-const styles = {"flagIcon":"international-phone-input__flagIcon_52jpv","flagPlaceholder":"international-phone-input__flagPlaceholder_52jpv"};
+const styles = {"flagIcon":"international-phone-input__flagIcon_in5qt","flagPlaceholder":"international-phone-input__flagPlaceholder_in5qt"};
 require('./index.css');
 
 /**

package/international-phone-input/modern/components/flag-icon/index.css

@@ -1,4 +1,4 @@
-/* hash: xisrv */
+/* hash: 3gshb */
 :root {
 } /* deprecated */ :root {
     --color-light-specialbg-tertiary-transparent: rgba(11, 31, 53, 0.1); /* 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 */
@@ -17,10 +17,10 @@
     --gap-3xs: 2px;
 } :root {
 } :root {
-} .international-phone-input__flagIcon_52jpv {
+} .international-phone-input__flagIcon_in5qt {
     max-width: 24px;
     max-height: 24px;
-} .international-phone-input__flagPlaceholder_52jpv {
+} .international-phone-input__flagPlaceholder_in5qt {
     width: 24px;
     height: 16px;
     max-height: 16px;

package/international-phone-input/modern/components/select-field/component.js

@@ -6,7 +6,7 @@ import { WorldMagnifierMIcon } from '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import { FlagIcon } from '../flag-icon/component.js';
 import '../flag-icon/flagSprite.js';
 
-const styles = {"component":"international-phone-input__component_1f5zn","flagIconContainer":"international-phone-input__flagIconContainer_1f5zn","emptyCountryIcon":"international-phone-input__emptyCountryIcon_1f5zn","disabled":"international-phone-input__disabled_1f5zn","inner":"international-phone-input__inner_1f5zn","l":"international-phone-input__l_1f5zn","xl":"international-phone-input__xl_1f5zn","focusVisible":"international-phone-input__focusVisible_1f5zn"};
+const styles = {"component":"international-phone-input__component_1nypj","flagIconContainer":"international-phone-input__flagIconContainer_1nypj","emptyCountryIcon":"international-phone-input__emptyCountryIcon_1nypj","disabled":"international-phone-input__disabled_1nypj","inner":"international-phone-input__inner_1nypj","l":"international-phone-input__l_1nypj","xl":"international-phone-input__xl_1nypj","focusVisible":"international-phone-input__focusVisible_1nypj"};
 require('./index.css');
 
 const EMPTY_COUNTRY_SELECT_FIELD = {