@alfalab/core-components-international-phone-input 1.2.2 → 1.2.4

package/cssm/index-ebda875c.d.ts

@@ -1,20 +1,148 @@
 /// <reference types="react" />
 /// <reference types="react-transition-group" />
-import { ReactNode, RefObject } from "react";
-type PortalProps = {
-    /** Контент */
+import React from "react";
+import { HTMLAttributes, ReactNode } from "react";
+type StyleColors = {
+    default: {
+        [key: string]: string;
+    };
+    inverted: {
+        [key: string]: string;
+    };
+};
+type BaseFormControlProps = HTMLAttributes<HTMLDivElement> & {
+    /**
+     * Растягивает компонент на ширину контейнера
+     */
+    block?: boolean;
+    /**
+     * Размер компонента
+     */
+    size?: "s" | "m" | "l" | "xl";
+    /**
+     * Набор цветов для компонента
+     */
+    colors?: "default" | "inverted";
+    /**
+     * Заблокированное состояние
+     */
+    disabled?: boolean;
+    /**
+     * Cостояние только для чтения
+     */
+    readOnly?: boolean;
+    /**
+     * Заполненное состояние
+     */
+    filled?: boolean;
+    /**
+     * Выбранное (фокус) состояние
+     */
+    focused?: boolean;
+    /**
+     * Отображение ошибки
+     */
+    error?: ReactNode | boolean;
+    /**
+     * Текст подсказки
+     */
+    hint?: ReactNode;
+    /**
+     * Лейбл компонента
+     */
+    label?: ReactNode;
+    /**
+     * Вид лейбла внутри / снаружи
+     */
+    labelView?: "inner" | "outer";
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Слот под полем
+     */
+    bottomAddons?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для поля
+     */
+    fieldClassName?: string;
+    /**
+     * Дополнительный класс для поля
+     */
+    inputWrapperClassName?: string;
+    /**
+     * Дополнительный класс для лейбла
+     */
+    labelClassName?: string;
+    /**
+     * Дополнительный класс для аддонов
+     */
+    addonsClassName?: string;
+    /**
+     * Свойства для обертки левых аддонов
+     */
+    leftAddonsProps?: HTMLAttributes<HTMLDivElement>;
+    /**
+     * Свойства для обертки правых аддонов
+     */
+    rightAddonsProps?: HTMLAttributes<HTMLDivElement>;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Для слота слева используется модификатор -left-addons, слота справа -right-addons,
+     * ошибки -error-message, текста подсказки -hint
+     */
+    dataTestId?: string;
+    /**
+     * Компонент поля (инпут, textarea и пр.)
+     */
     children?: ReactNode;
     /**
-     * Функция, возвращающая контейнер, в который будут рендериться дочерние элементы
+     * Основные стили компонента.
      */
-    getPortalContainer?: () => Element;
+    styles: {
+        [key: string]: string;
+    };
     /**
-     * Немедленно отрендерить дочерние элементы (false - контент будет отрендерен на след. рендер).
+     * Стили компонента для default и inverted режима.
      */
-    immediateMount?: boolean;
+    colorStyles?: StyleColors;
 };
-declare const Portal: import("react").ForwardRefExoticComponent<PortalProps & import("react").RefAttributes<Element>>;
-declare const PORTAL_CONTAINER_ATTRIBUTE = "alfa-portal-container";
-declare const getDefaultPortalContainer: () => Element;
-declare function setRef<T>(ref: RefObject<T> | ((instance: T | null) => void) | null | undefined, value: T | null): void;
-export { PortalProps, Portal, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef };
+declare const BaseFormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    block?: boolean | undefined;
+    size?: "s" | "m" | "l" | "xl" | undefined;
+    colors?: "default" | "inverted" | undefined;
+    disabled?: boolean | undefined;
+    readOnly?: boolean | undefined;
+    filled?: boolean | undefined;
+    focused?: boolean | undefined;
+    error?: ReactNode | boolean;
+    hint?: ReactNode;
+    label?: ReactNode;
+    labelView?: "inner" | "outer" | undefined;
+    leftAddons?: ReactNode;
+    rightAddons?: ReactNode;
+    bottomAddons?: ReactNode;
+    className?: string | undefined;
+    fieldClassName?: string | undefined;
+    inputWrapperClassName?: string | undefined;
+    labelClassName?: string | undefined;
+    addonsClassName?: string | undefined;
+    leftAddonsProps?: React.HTMLAttributes<HTMLDivElement> | undefined;
+    rightAddonsProps?: React.HTMLAttributes<HTMLDivElement> | undefined;
+    dataTestId?: string | undefined;
+    children?: ReactNode;
+    styles: {
+        [key: string]: string;
+    };
+    colorStyles?: StyleColors | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { StyleColors, BaseFormControlProps, BaseFormControl };

package/cssm/index.js

@@ -6,8 +6,8 @@ var Component_responsive = require('./Component.responsive.js');
 require('tslib');
 require('react');
 require('@alfalab/core-components-mq/cssm');
-require('./Component.desktop.js');
-require('@alfalab/core-components-input/cssm/Component.desktop');
+require('./desktop/Component.desktop.js');
+require('@alfalab/core-components-input/cssm/desktop');
 require('@alfalab/core-components-input-autocomplete/cssm/desktop');
 require('@alfalab/core-components-select/cssm/desktop');
 require('./components/base-international-phone-input/Component.js');
@@ -30,7 +30,7 @@ require('@alfalab/hooks');
 require('./components/select-field/index.module.css');
 require('./components/country-select/index.module.css');
 require('./components/base-international-phone-input/index.module.css');
-require('./Component.mobile.js');
+require('./mobile/Component.mobile.js');
 require('@alfalab/core-components-input/cssm/mobile');
 require('@alfalab/core-components-input-autocomplete/cssm/mobile');
 require('@alfalab/core-components-select/cssm/mobile');

package/cssm/{Component.mobile.d.ts → mobile/Component.mobile.d.ts}

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
-import { InternationalPhoneInputMobileProps } from "./types";
+import { InternationalPhoneInputMobileProps } from "../types";
 declare const InternationalPhoneInputMobile: React.ForwardRefExoticComponent<InternationalPhoneInputMobileProps & React.RefAttributes<HTMLInputElement>>;
 export { InternationalPhoneInputMobile };

package/cssm/{Component.mobile.js → mobile/Component.mobile.js}

@@ -7,26 +7,26 @@ var React = require('react');
 var mobile$1 = require('@alfalab/core-components-input/cssm/mobile');
 var mobile$2 = require('@alfalab/core-components-input-autocomplete/cssm/mobile');
 var mobile = require('@alfalab/core-components-select/cssm/mobile');
-var components_baseInternationalPhoneInput_Component = require('./components/base-international-phone-input/Component.js');
+var components_baseInternationalPhoneInput_Component = require('../components/base-international-phone-input/Component.js');
 require('react-merge-refs');
 require('@maskito/core');
 require('@maskito/react');
 require('@alfalab/core-components-select/cssm/shared');
-require('./utils/index.js');
+require('../utils/index.js');
 require('@alfalab/core-components-shared/cssm');
-require('./consts.js');
-require('./data/country-data.js');
-require('./components/country-select/Component.js');
+require('../consts.js');
+require('../data/country-data.js');
+require('../components/country-select/Component.js');
 require('@alfalab/icons-glyph/WorldMagnifierMIcon');
-require('./components/flag-icon/component.js');
+require('../components/flag-icon/component.js');
 require('classnames');
-require('./components/flag-icon/flagSprite.js');
-require('./components/flag-icon/index.module.css');
-require('./components/select-field/component.js');
+require('../components/flag-icon/flagSprite.js');
+require('../components/flag-icon/index.module.css');
+require('../components/select-field/component.js');
 require('@alfalab/hooks');
-require('./components/select-field/index.module.css');
-require('./components/country-select/index.module.css');
-require('./components/base-international-phone-input/index.module.css');
+require('../components/select-field/index.module.css');
+require('../components/country-select/index.module.css');
+require('../components/base-international-phone-input/index.module.css');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/cssm/mobile/index.d.ts

@@ -1,2 +1,2 @@
-export { InternationalPhoneInputMobile } from "../Component.mobile";
+export { InternationalPhoneInputMobile } from "./Component.mobile";
 export type { InternationalPhoneInputMobileProps } from "../types";

package/cssm/mobile/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Component_mobile = require('../Component.mobile.js');
+var mobile_Component_mobile = require('./Component.mobile.js');
 require('tslib');
 require('react');
 require('@alfalab/core-components-input/cssm/mobile');
@@ -31,4 +31,4 @@ require('../components/base-international-phone-input/index.module.css');
 
 
 
-exports.InternationalPhoneInputMobile = Component_mobile.InternationalPhoneInputMobile;
+exports.InternationalPhoneInputMobile = mobile_Component_mobile.InternationalPhoneInputMobile;

package/cssm/types.d.ts

@@ -5,7 +5,7 @@ import { InputMobileProps } from "@alfalab/core-components-input/mobile";
 import { InputAutocompleteProps } from "@alfalab/core-components-input-autocomplete";
 import { InputAutocompleteDesktopProps } from "@alfalab/core-components-input-autocomplete/desktop";
 import { InputAutocompleteMobileProps } from "@alfalab/core-components-input-autocomplete/mobile";
-import { OptionShape } from "./typings-0816e61d";
+import { OptionShape } from "./typings-c29389e5";
 import { SharedCountrySelectProps } from "./components/country-select/index";
 type Country = {
     name: string;

package/cssm/typings-08e5596c.d.ts

@@ -0,0 +1,56 @@
+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;
+    /**
+     * Значение по-умолчанию для хука useMatchMedia
+     */
+    defaultMatchMediaValue?: boolean | (() => boolean);
+};
+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 };

package/cssm/{typings-89f0cb07.d.ts → typings-553146b2.d.ts}

@@ -48,7 +48,8 @@ type ComponentProps = {
      */
     Component?: ElementType;
     /**
-     * Идентификатор для систем автоматизированного тестирования
+     * Идентификатор для систем автоматизированного тестирования.
+     * Для спиннера используется модификатор -loader
      */
     dataTestId?: string;
     /**