@cloud-ru/uikit-product-fields-predefined 0.13.3 → 0.13.5

package/dist/cjs/components/FieldAi/components/WithPasswordValidation/WithPasswordValidation.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { ValidationPassword } from '../../utils';
+export type WithPasswordTooltipProps = WithLayoutType<{
+    showValidation?: boolean;
+    children: ReactNode;
+    passwordValidation: ValidationPassword;
+}>;
+export declare function WithPasswordValidation({ showValidation, passwordValidation, layoutType, children, }: WithPasswordTooltipProps): string | number | boolean | import("react/jsx-runtime").JSX.Element | Iterable<ReactNode> | null | undefined;

package/dist/cjs/components/FieldAi/components/WithPasswordValidation/WithPasswordValidation.js

@@ -0,0 +1,23 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WithPasswordValidation = WithPasswordValidation;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const uikit_product_mobile_tooltip_1 = require("@sbercloud/uikit-product-mobile-tooltip");
+const helpers_1 = require("../../../../helpers");
+const PasswordValidation_1 = require("../PasswordValidation");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function WithPasswordValidation({ showValidation, passwordValidation, layoutType, children, }) {
+    if ((0, helpers_1.isTouchDevice)(layoutType)) {
+        if (showValidation) {
+            return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.validationContainer, children: [(0, jsx_runtime_1.jsx)(PasswordValidation_1.PasswordValidation, { passwordValidation: passwordValidation, layoutType: layoutType }), children] }));
+        }
+        return children;
+    }
+    if (showValidation) {
+        return ((0, jsx_runtime_1.jsx)(uikit_product_mobile_tooltip_1.AdaptiveTooltip, { placement: 'left-end', layoutType: layoutType, tip: (0, jsx_runtime_1.jsx)(PasswordValidation_1.PasswordValidation, { passwordValidation: passwordValidation, layoutType: layoutType }), offset: 8, children: children }));
+    }
+    return children;
+}

package/dist/cjs/components/FieldAi/components/WithPasswordValidation/index.d.ts

@@ -0,0 +1 @@
+export * from './WithPasswordValidation';

package/dist/cjs/components/FieldAi/components/WithPasswordValidation/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./WithPasswordValidation"), exports);

package/dist/cjs/components/FieldAi/components/WithPasswordValidation/styles.module.css

@@ -0,0 +1,5 @@
+.validationContainer{
+  display:flex;
+  flex-direction:column;
+  gap:8px;
+}

package/dist/cjs/components/FieldAi/index.d.ts

@@ -0,0 +1 @@
+export * from './FieldAi';

package/dist/cjs/components/FieldAi/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./FieldAi"), exports);

package/dist/cjs/components/FieldAi/styles.module.css

@@ -0,0 +1,25 @@
+.wrapper{
+  display:flex;
+  flex-direction:column;
+  gap:var(--dimension-050m, 4px);
+}
+
+.secured textarea{
+  -webkit-text-security:disc;
+  text-security:disc;
+}
+
+.mobileSubmitButton{
+  position:relative !important;
+  flex-shrink:0 !important;
+}
+.mobileSubmitButton:after{
+  content:"";
+  display:flex;
+  width:48px;
+  height:48px;
+  position:absolute;
+  top:50%;
+  left:50%;
+  transform:translate(-50%, -50%);
+}

package/dist/cjs/components/FieldAi/utils.d.ts

@@ -0,0 +1,9 @@
+export type ValidationPassword = {
+    onlyLatin: boolean;
+    minLength: boolean;
+    hasLetterCases: boolean;
+    hasNumber: boolean;
+    hasSymbol: boolean;
+    noSpaces: boolean;
+};
+export declare const getValidationPassword: (password?: string) => ValidationPassword;

package/dist/cjs/components/FieldAi/utils.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getValidationPassword = void 0;
+const MIN_PASSWORD_LENGTH = 8;
+const NUMBER_REGEX = /[0-9]/;
+const CAPITAL_REGEX = /\p{Lu}/u;
+const LOWER_REGEX = /\p{Ll}/u;
+const SYMBOLS_REGEX = /[\p{P}\p{S}]/u;
+const NO_SPACES = /^\S*$/u;
+const LATIN_REGEX = /^[a-zA-Z0-9\p{P}\p{S}]+$/u;
+const getValidationPassword = (password = '') => ({
+    onlyLatin: Boolean(password.match(LATIN_REGEX)),
+    minLength: password.length >= MIN_PASSWORD_LENGTH,
+    hasLetterCases: Boolean(password.match(CAPITAL_REGEX)) && Boolean(password.match(LOWER_REGEX)),
+    hasNumber: Boolean(password.match(NUMBER_REGEX)),
+    hasSymbol: Boolean(password.match(SYMBOLS_REGEX)),
+    noSpaces: Boolean(password.match(NO_SPACES)),
+});
+exports.getValidationPassword = getValidationPassword;

package/dist/cjs/components/FieldChat/FieldChat.d.ts

@@ -0,0 +1,15 @@
+import { FieldTextAreaProps } from '@sbercloud/uikit-product-mobile-fields';
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { AttachmentSquareProps } from '@snack-uikit/attachment';
+import { FileUploadProps } from '@snack-uikit/drop-zone';
+export type FieldChatProps = WithLayoutType<Omit<FieldTextAreaProps, 'placeholder' | 'hint' | 'labelTooltip' | 'label' | 'required' | 'size' | 'spellCheck' | 'footer'> & {
+    /** Колбек действия при отправке */
+    handleSubmit(value: string): void;
+    attachment?: Pick<FileUploadProps, 'onFilesUpload' | 'accept'> & {
+        /** Список загруженных файлов */
+        files?: File[];
+        /** Колбек действия при удалении прикрепленного файла */
+        onFileDelete: AttachmentSquareProps['onDelete'];
+    };
+}>;
+export declare function FieldChat({ handleSubmit: handleSubmitProp, value, layoutType, attachment, ...props }: FieldChatProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/FieldChat/FieldChat.js

@@ -0,0 +1,55 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FieldChat = FieldChat;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const uikit_product_icons_1 = require("@sbercloud/uikit-product-icons");
+const uikit_product_locale_1 = require("@sbercloud/uikit-product-locale");
+const uikit_product_mobile_fields_1 = require("@sbercloud/uikit-product-mobile-fields");
+const button_1 = require("@snack-uikit/button");
+const drop_zone_1 = require("@snack-uikit/drop-zone");
+const tooltip_1 = require("@snack-uikit/tooltip");
+const FieldSubmitButton_1 = require("../../helperComponents/FieldSubmitButton");
+const TextAreaActionsFooter_1 = require("../../helperComponents/TextAreaActionsFooter");
+const Attachments_1 = require("./components/Attachments");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function FieldChat(_a) {
+    var { handleSubmit: handleSubmitProp, value, layoutType, attachment } = _a, props = __rest(_a, ["handleSubmit", "value", "layoutType", "attachment"]);
+    const { t } = (0, uikit_product_locale_1.useLocale)('FieldsPredefined');
+    const isMobile = layoutType === 'mobile';
+    const files = (0, react_1.useMemo)(() => {
+        var _a, _b;
+        return (_b = (_a = attachment === null || attachment === void 0 ? void 0 : attachment.files) === null || _a === void 0 ? void 0 : _a.map(file => ({
+            file,
+            onDelete: attachment === null || attachment === void 0 ? void 0 : attachment.onFileDelete,
+        }))) !== null && _b !== void 0 ? _b : [];
+    }, [attachment === null || attachment === void 0 ? void 0 : attachment.files, attachment === null || attachment === void 0 ? void 0 : attachment.onFileDelete]);
+    const isValueValid = (typeof value === 'string' && value.trim().length > 0) || files.length > 0;
+    const handleSubmit = () => {
+        if (isValueValid) {
+            handleSubmitProp(value !== null && value !== void 0 ? value : '');
+        }
+    };
+    const handleKeyDown = e => {
+        if (e.key === 'Enter' && !e.shiftKey) {
+            e.preventDefault();
+            handleSubmit();
+            return;
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.fieldChat, "data-layout-type": layoutType, children: [isMobile && (0, jsx_runtime_1.jsx)(Attachments_1.Attachments, { files: files, isMobile: isMobile }), (0, jsx_runtime_1.jsx)(uikit_product_mobile_fields_1.AdaptiveFieldTextArea, Object.assign({}, props, { layoutType: layoutType, size: isMobile ? 'l' : 'm', minRows: 1, maxRows: 4, placeholder: t('FieldChat.placeholder'), onKeyDown: handleKeyDown, footer: (0, jsx_runtime_1.jsx)(TextAreaActionsFooter_1.TextAreaActionsFooter, { right: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [attachment && ((0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { tip: t('FieldChat.attachFileTooltip'), hoverDelayOpen: 600, triggerClassName: styles_module_scss_1.default.uploadTooltip, children: (0, jsx_runtime_1.jsx)(drop_zone_1.FileUpload, { mode: 'multiple', onFilesUpload: attachment.onFilesUpload, accept: attachment.accept, children: (0, jsx_runtime_1.jsx)(button_1.ButtonFunction, { size: isMobile ? 's' : 'xs', icon: (0, jsx_runtime_1.jsx)(uikit_product_icons_1.AttachmentSVG, {}) }) }) })), (0, jsx_runtime_1.jsx)(FieldSubmitButton_1.FieldSubmitButton, { active: isValueValid, handleClick: handleSubmit, size: isMobile ? 's' : 'xs' })] }) }) })), !isMobile && (0, jsx_runtime_1.jsx)(Attachments_1.Attachments, { files: files })] }));
+}

package/dist/cjs/components/FieldChat/components/Attachments/Attachments.d.ts

@@ -0,0 +1,6 @@
+import { AttachmentSquareProps } from '@snack-uikit/attachment';
+export type AttachmentsProps = {
+    files: AttachmentSquareProps[];
+    isMobile?: boolean;
+};
+export declare function Attachments({ files, isMobile }: AttachmentsProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/cjs/components/FieldChat/components/Attachments/Attachments.js

@@ -0,0 +1,20 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Attachments = Attachments;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const attachment_1 = require("@snack-uikit/attachment");
+const scroll_1 = require("@snack-uikit/scroll");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function Attachments({ files, isMobile }) {
+    if (!files.length) {
+        return null;
+    }
+    const AttachmentComponent = isMobile ? attachment_1.Attachment : attachment_1.AttachmentSquare;
+    return ((0, jsx_runtime_1.jsx)(scroll_1.Scroll, { children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.attachments, children: files.map((file, index) => {
+                var _a;
+                return ((0, jsx_runtime_1.jsx)(AttachmentComponent, Object.assign({ size: 's' }, file, { className: isMobile ? styles_module_scss_1.default.attachment : undefined }), ((_a = file.file) === null || _a === void 0 ? void 0 : _a.name) || index));
+            }) }) }));
+}

package/dist/cjs/components/FieldChat/components/Attachments/index.d.ts

@@ -0,0 +1 @@
+export * from './Attachments';

package/dist/cjs/components/FieldChat/components/Attachments/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Attachments"), exports);

package/dist/cjs/components/FieldChat/components/Attachments/styles.module.css

@@ -0,0 +1,9 @@
+.attachments{
+  display:flex;
+  gap:8px;
+  padding:1px 0;
+}
+
+.attachment{
+  min-width:256px;
+}

package/dist/cjs/components/FieldChat/index.d.ts

@@ -0,0 +1 @@
+export * from './FieldChat';

package/dist/cjs/components/FieldChat/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./FieldChat"), exports);

package/dist/cjs/components/FieldChat/styles.module.css

@@ -0,0 +1,12 @@
+.fieldChat{
+  display:flex;
+  flex-direction:column;
+  gap:11px;
+}
+.fieldChat[data-layout-type=mobile]{
+  gap:7px;
+}
+
+.uploadTooltip{
+  display:flex;
+}

package/dist/cjs/components/FieldPhone/FieldPhone.d.ts

@@ -0,0 +1,25 @@
+import { FieldTextProps } from '@sbercloud/uikit-product-mobile-fields';
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { CountrySettings, FieldPhoneOptionsProps } from './types';
+export type FieldPhoneProps = WithLayoutType<Omit<FieldTextProps, 'prefix' | 'prefixIcon' | 'postfix' | 'placeholder' | 'autocomplete' | 'decoratorRef' | 'allowMoreThanMaxLength' | 'onKeyDown' | 'button' | 'maxLength' | 'inputMode'> & {
+    /** Включить скролл для основной части списка стран */
+    scrollList?: boolean;
+    onChange?(value: string): void;
+    searchPlaceholder?: string;
+    onChangeCountry?(country: FieldPhoneOptionsProps): void;
+} & {
+    /** options — объект конфигурации для изменения стандартного списка стран */
+    options?: CountrySettings;
+}>;
+export declare const FieldPhone: import("react").ForwardRefExoticComponent<Omit<FieldTextProps, "onKeyDown" | "maxLength" | "placeholder" | "inputMode" | "prefix" | "prefixIcon" | "postfix" | "autocomplete" | "decoratorRef" | "allowMoreThanMaxLength" | "button"> & {
+    /** Включить скролл для основной части списка стран */
+    scrollList?: boolean;
+    onChange?(value: string): void;
+    searchPlaceholder?: string;
+    onChangeCountry?(country: FieldPhoneOptionsProps): void;
+} & {
+    /** options — объект конфигурации для изменения стандартного списка стран */
+    options?: CountrySettings;
+} & {
+    layoutType: import("@sbercloud/uikit-product-utils").LayoutType;
+} & import("react").RefAttributes<HTMLInputElement>>;

package/dist/cjs/components/FieldPhone/FieldPhone.js

@@ -0,0 +1,131 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FieldPhone = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const merge_refs_1 = __importDefault(require("merge-refs"));
+const react_1 = require("react");
+const react_imask_1 = require("react-imask");
+const uikit_product_mobile_dropdown_1 = require("@sbercloud/uikit-product-mobile-dropdown");
+const uikit_product_mobile_fields_1 = require("@sbercloud/uikit-product-mobile-fields");
+const utils_1 = require("@snack-uikit/utils");
+const constants_1 = require("./constants");
+const hooks_1 = require("./hooks");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+const utils_2 = require("./utils");
+exports.FieldPhone = (0, react_1.forwardRef)((_a, ref) => {
+    var { value: valueProp, onChangeCountry, onChange: onChangeProp, showClearButton = true, searchPlaceholder, onPaste, className, scrollList, options: optionsProp } = _a, rest = __rest(_a, ["value", "onChangeCountry", "onChange", "showClearButton", "searchPlaceholder", "onPaste", "className", "scrollList", "options"]);
+    const [open, setOpen] = (0, react_1.useState)(false);
+    const localRef = (0, react_1.useRef)(null);
+    const options = (0, hooks_1.useCountries)(optionsProp);
+    const isOnlyOneCountryAvailable = options.length === 1;
+    const [country, setCountry] = (0, utils_1.useValueControl)({
+        defaultValue: options[0],
+        onChange: onChangeCountry,
+    });
+    const [dropdownSearch, setDropDownSearch] = (0, react_1.useState)('');
+    const items = (0, react_1.useMemo)(() => {
+        if (dropdownSearch.length) {
+            return options.filter(opt => [opt.content.option, opt.content.caption].some(val => String(val).toLowerCase().includes(dropdownSearch.toLowerCase())));
+        }
+        return options;
+    }, [options, dropdownSearch]);
+    const maskOptions = (0, react_1.useMemo)(() => ({
+        mask: country === null || country === void 0 ? void 0 : country.mask,
+        lazy: false,
+        placeholderChar: constants_1.PLACEHOLDER_CHAR,
+        definitions: {
+            X: /[0-9]/,
+        },
+    }), [country === null || country === void 0 ? void 0 : country.mask]);
+    const { ref: iMaskRef, value: iMaskValue, setValue, unmaskedValue, } = (0, react_imask_1.useIMask)(maskOptions, {
+        onAccept: (_, maskRef) => {
+            const unmasked = maskRef.unmaskedValue;
+            const requiredSymbols = country === null || country === void 0 ? void 0 : country.mask.replace(/[\D]/g, '');
+            const value = unmasked.length ? `${country === null || country === void 0 ? void 0 : country.content.caption}${requiredSymbols}${unmasked}` : '';
+            if (value !== valueProp) {
+                onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(value);
+            }
+        },
+    });
+    (0, react_1.useEffect)(() => {
+        var _a;
+        const requiredSymbols = country === null || country === void 0 ? void 0 : country.mask.replace(/[\D]/g, '');
+        const normalizedValue = valueProp === null || valueProp === void 0 ? void 0 : valueProp.replace(((_a = country === null || country === void 0 ? void 0 : country.content.caption) !== null && _a !== void 0 ? _a : '') + requiredSymbols, '');
+        if (normalizedValue !== undefined && normalizedValue !== unmaskedValue) {
+            setValue(normalizedValue);
+        }
+        // need to trigger update only on valueProp change
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [valueProp]);
+    const updateMaskView = (value) => {
+        var _a;
+        setValue((_a = value === null || value === void 0 ? void 0 : value.replaceAll(/\w/g, ' ')) !== null && _a !== void 0 ? _a : '');
+    };
+    const handlePaste = e => {
+        var _a, _b;
+        e.preventDefault();
+        const text = ((_a = e.clipboardData) === null || _a === void 0 ? void 0 : _a.getData('text')) || '';
+        const newCountry = (0, utils_2.detectCountryByPhone)(text, options);
+        const isCountryChanged = newCountry && newCountry.id !== (country === null || country === void 0 ? void 0 : country.id);
+        const currentCountry = isCountryChanged ? newCountry : country;
+        const prefixNumber = ((_b = currentCountry === null || currentCountry === void 0 ? void 0 : currentCountry.content.caption) !== null && _b !== void 0 ? _b : '').replace('+', '');
+        const prefixNumberWithOptionalPlus = RegExp(`^(\\+?${prefixNumber})`);
+        const valueWithoutPrefix = text.replace(prefixNumberWithOptionalPlus, '');
+        // костыль, чтобы всегда срабатывала маска
+        const newValue = `+${valueWithoutPrefix}`;
+        if (isCountryChanged) {
+            setCountry(newCountry);
+            updateMaskView(newCountry.mask);
+            setTimeout(() => setValue(newValue), 0);
+        }
+        else {
+            setValue(newValue);
+        }
+        onPaste === null || onPaste === void 0 ? void 0 : onPaste(e);
+    };
+    const handleChangeSelection = (selectedOption) => {
+        if (selectedOption && selectedOption !== (country === null || country === void 0 ? void 0 : country.content.option)) {
+            const selectedCountry = options.find(opt => opt.id === selectedOption);
+            updateMaskView(selectedCountry === null || selectedCountry === void 0 ? void 0 : selectedCountry.mask);
+            setCountry(selectedCountry);
+        }
+        setTimeout(() => { var _a; return (_a = localRef.current) === null || _a === void 0 ? void 0 : _a.focus(); }, 500);
+    };
+    const handleChange = (value) => {
+        var _a;
+        // needed only to clear value by clicking on clear button
+        if (unmaskedValue && !value) {
+            updateMaskView(country === null || country === void 0 ? void 0 : country.mask);
+            (_a = localRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+    };
+    const showClear = showClearButton && Boolean(unmaskedValue);
+    return ((0, jsx_runtime_1.jsx)(uikit_product_mobile_fields_1.AdaptiveFieldText, Object.assign({}, rest, { inputMode: 'tel', "data-test-id": 'field-phone', type: 'tel', ref: (0, merge_refs_1.default)(ref, localRef, iMaskRef), className: (0, classnames_1.default)(className, styles_module_scss_1.default.fieldPhone), "data-empty": !unmaskedValue || undefined, value: iMaskValue, onChange: handleChange, onPaste: handlePaste, showClearButton: showClear, prefix: country === null || country === void 0 ? void 0 : country.content.caption, button: isOnlyOneCountryAvailable
+            ? undefined
+            : {
+                variant: 'before',
+                hasArrow: true,
+                arrowOpen: open,
+                wrapper: button => ((0, jsx_runtime_1.jsx)("div", { role: 'presentation', onClick: e => e.stopPropagation(), children: (0, jsx_runtime_1.jsx)(uikit_product_mobile_dropdown_1.AdaptiveDroplist, { onOpenChange: setOpen, closeDroplistOnItemClick: true, layoutType: rest.layoutType, items: items, selection: { mode: 'single', onChange: handleChangeSelection, value: country === null || country === void 0 ? void 0 : country.id }, scroll: scrollList, search: {
+                            value: dropdownSearch,
+                            onChange: setDropDownSearch,
+                            placeholder: searchPlaceholder,
+                        }, children: button }) })),
+                content: country === null || country === void 0 ? void 0 : country.beforeContent,
+            } })));
+});

package/dist/cjs/components/FieldPhone/__tests__/constants.d.ts

@@ -0,0 +1,5 @@
+export declare const phoneFormatCases: {
+    country: string;
+    input: string;
+    expected: string;
+}[];

package/dist/cjs/components/FieldPhone/__tests__/constants.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.phoneFormatCases = void 0;
+exports.phoneFormatCases = [
+    { country: 'Russia', input: '+79878887879', expected: '+7 987 888-78-79' },
+    { country: 'Russia', input: '+7987****875', expected: '+7 987 ***-*8-75' },
+    { country: 'Belarus', input: '+375129876543', expected: '+375 12 987-65-43' },
+    { country: 'Kazakhstan', input: '+79878887879', expected: '+7 987 888-78-79' },
+    { country: 'Armenia', input: '+37412987654', expected: '+374 12 987-654' },
+    { country: 'Kyrgyzstan', input: '+996987888777', expected: '+996 987 888-777' },
+    { country: 'Georgia', input: '+995987888777', expected: '+995 987 88-87-77' },
+    { country: 'Brazil', input: '+5512345678901', expected: '+55 12 34567-8901' },
+    { country: 'India', input: '+911234567890', expected: '+91 12345-67890' },
+    { country: 'UnitedArabEmirates', input: '+971123456789', expected: '+971 12 345-6789' },
+    { country: 'SaudiArabia', input: '+966123456789', expected: '+966 1 2345-6789' },
+    { country: 'SouthAfrica', input: '+27123456789', expected: '+27 12 345-6789' },
+    { country: 'Egypt', input: '+201234567890', expected: '+20 12 3456-7890' },
+    { country: 'Iran', input: '+981234567890', expected: '+98 123 456-7890' },
+    { country: 'Ethiopia', input: '+251123456789', expected: '+251 12 345-6789' },
+    { country: 'Romania', input: '+40123456789', expected: '+40 12 345-6789' },
+    { country: 'Serbia', input: '+381123456789', expected: '+381 12 345-6789' },
+    { country: 'Netherlands', input: '+31123456789', expected: '+31 12 345-6789' },
+    { country: 'Azerbaijan', input: '+994123456789', expected: '+994 12 345-67-89' },
+    { country: 'Syria', input: '+963123456789', expected: '+963 12 345-6789' },
+    { country: 'Cyprus', input: '+35712345678', expected: '+357 12 345678' },
+    { country: 'Uzbekistan', input: '+998123456789', expected: '+998 12 345-67-89' },
+    { country: 'Tajikistan', input: '+992123456789', expected: '+992 12 345-6789' },
+    { country: 'Moldova', input: '+37312345678', expected: '+373 1234 5678' },
+];

package/dist/cjs/components/FieldPhone/__tests__/formatPhoneNumber.spec.d.ts

@@ -0,0 +1 @@
+import './matchMedia';

package/dist/cjs/components/FieldPhone/__tests__/formatPhoneNumber.spec.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+require("./matchMedia");
+const vitest_1 = require("vitest");
+const countries_1 = require("../countries");
+const utils_1 = require("../utils");
+const constants_1 = require("./constants");
+(0, vitest_1.describe)('Checking the mask overlay for each number', () => {
+    constants_1.phoneFormatCases.forEach(({ country, input, expected }) => {
+        (0, vitest_1.it)(`should format the number correctly for ${country}`, () => {
+            (0, vitest_1.expect)((0, utils_1.formatPhoneNumber)(input, countries_1.ALL_COUNTRY_CODES)).toBe(expected);
+        });
+    });
+});

package/dist/cjs/components/FieldPhone/__tests__/matchMedia.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/components/FieldPhone/__tests__/matchMedia.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const vitest_1 = require("vitest");
+Object.defineProperty(window, 'matchMedia', {
+    writable: true,
+    value: vitest_1.vi.fn().mockImplementation(query => ({
+        matches: false,
+        media: query,
+        onchange: null,
+        addListener: vitest_1.vi.fn(),
+        removeListener: vitest_1.vi.fn(),
+        addEventListener: vitest_1.vi.fn(),
+        removeEventListener: vitest_1.vi.fn(),
+        dispatchEvent: vitest_1.vi.fn(),
+    })),
+});

package/dist/cjs/components/FieldPhone/constants.d.ts

@@ -0,0 +1 @@
+export declare const PLACEHOLDER_CHAR = "_";

package/dist/cjs/components/FieldPhone/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PLACEHOLDER_CHAR = void 0;
+exports.PLACEHOLDER_CHAR = '_';