mediacube-ui-v2 0.0.32 → 0.0.34

package/dist/src/components/elements/McFieldText/McFieldText.vue.js

@@ -1,1401 +0,0 @@
-import { IMaskComponent, IMask } from 'vue-imask';
-import { McTitle, McButton, McSvgIcon, McTooltip } from '@/components';
-import { Spaces } from '@/types/styles/Spaces';
-import { computed, onMounted, ref, useAttrs, useSlots } from 'vue';
-import { Directions } from '@/enums/ui/Directions';
-import { useFieldErrors } from '@/composables';
-import { InputTypes, Autocomplete } from '@/enums/Input';
-import { useTextareaAutosize } from '@vueuse/core';
-import { ButtonSize, ButtonType, HorizontalAlignment, TitleVariations, Weights } from '@/enums';
-const { defineProps, defineSlots, defineEmits, defineExpose, defineModel, defineOptions, withDefaults, } = await import('vue');
-const { textarea } = useTextareaAutosize();
-const emit = defineEmits();
-const slots = useSlots();
-const attrs = useAttrs();
-const props = defineProps({
-    /**
-     *  Значение
-     *
-     */
-    modelValue: {
-        type: [String, Number],
-        default: null
-    },
-    /**
-     *  Тип:
-     * `textarea, textarea-autosize и
-     * нативные как text, password, email и т.д.`
-     *
-     * кастомный num - разрешает ввод только цифр и дробных чисел, без ислчений ввиде буквы 'E'
-     * кастомный int - разрешает ввод только целочисленных значений
-     * кастомный amount_format - форматирует ввод числовых данных разделяя на разряды(1 000 000)
-     * date - добавляет placeholder, маску и ограничения ввода
-     * uppercase\lowercase - форматирует текст согласну значению (верхний\нижний регистр)
-     * phone_number - добавляет '+' к номеру телефона при фокусе без возможности удалить его
-     */
-    type: {
-        type: String,
-        default: InputTypes.Text
-    },
-    /**
-     *  Заголовок поля:
-     *
-     */
-    title: {
-        type: String,
-        default: null
-    },
-    /**
-     *  Маска поля:
-     *
-     * tokens - https://imask.js.org/guide.html
-     *
-     */
-    mask: {
-        type: String,
-        default: null
-    },
-    /**
-     *  Вспомогательный текст под инпутом:
-     *
-     */
-    helpText: {
-        type: String,
-        default: null
-    },
-    /**
-     *  Отключенное состояние
-     *
-     */
-    disabled: {
-        type: Boolean,
-        default: false
-    },
-    /**
-     *  Ошибки
-     *
-     */
-    errors: {
-        type: Array,
-        default: null
-    },
-    /**
-     *  Placeholder
-     *
-     */
-    placeholder: {
-        type: String,
-        default: null
-    },
-    /**
-     *  Name
-     *
-     */
-    name: {
-        type: String,
-        required: true
-    },
-    /**
-     *  плейсхолдеры для короткого обозначения даты (для маски dd.mm.yyyy)
-     *  {
-     *      date: 'd',
-     *      month: 'm',
-     *      year: 'y',
-     *  }
-     *
-     */
-    dateMaskPlaceholder: {
-        type: Object,
-        default: () => ({})
-    },
-    /**
-     *  Максимальная длина строки в инпуте
-     *
-     */
-    maxLength: {
-        type: Number,
-        default: null
-    },
-    /**
-     *  Состояние копирования
-     *
-     */
-    copy: {
-        type: Boolean,
-        default: false
-    },
-    /**
-     *  Автокомплит введённого ранее текста: on, off
-     *
-     */
-    autocomplete: {
-        type: String,
-        default: Autocomplete.On
-    },
-    /**
-     *  только чтение текста
-     *
-     */
-    readOnly: {
-        type: Boolean,
-        default: false
-    },
-    /**
-     * Атрибут tabindex для главного элемента
-     *
-     */
-    tabindex: {
-        type: [String, Number]
-    },
-    /**
-     * Tooltip для кнопка "показать пароль"
-     *
-     */
-    passwordTooltip: {
-        type: String,
-        default: 'Show/Hide'
-    },
-    /**
-     * Tooltip для кнопка "Скрыть пароль", если не указывать, то будет аналогичен "показать"
-     *
-     */
-    passwordHideTooltip: {
-        type: String,
-        default: null
-    },
-    /**
-     * Очищаем данные от маски на выходе
-     */
-    clearOutput: {
-        type: Boolean,
-        default: false
-    },
-    /**
-     * Кастомные настройки для маски
-     * См. https://imask.js.org/guide.html
-     *
-     * Например:
-     *  {
-     *   autofix: true,
-     *    blocks: {
-     *      d: {mask: IMask.MaskedRange, placeholderChar: 'd', from: 1, to: 31, maxLength: 2},
-     *      m: {mask: IMask.MaskedRange, placeholderChar: 'm', from: 1, to: 12, maxLength: 2},
-     *      Y: {mask: IMask.MaskedRange, placeholderChar: 'y', from: 1900, to: 2999, maxLength: 4}
-     *    }
-     *  }
-     */
-    maskOptions: {
-        type: Object,
-        default: null
-    },
-    required: {
-        type: Boolean,
-        default: false
-    },
-    /**
-     * Для какого языка поле ввода
-     */
-    locale: {
-        type: String,
-        default: null
-    },
-    /**
-     * Мобильное ли разрешение
-     * (Используется для триггера тултипа в кнопке с паролем)
-     */
-    isMobile: {
-        type: Boolean,
-        default: false
-    },
-    /**
-     * Свойство на ограничение количества символов после точки для числовых типов (num || amount_format)
-     */
-    maxDecimals: {
-        type: Number,
-        default: 2
-    },
-    dir: {
-        type: String,
-        default: Directions.Ltr
-    }
-});
-const prependWidth = ref(0);
-const appendWidth = ref(0);
-const prettyType = ref(props.type);
-const fieldErrors = useFieldErrors(props.errors);
-const isRtl = computed(() => {
-    return props.dir === Directions.Rtl;
-});
-const classes = computed(() => {
-    return {
-        'mc-field-text': true,
-        'mc-field-text--error': !!fieldErrors.errorText.value,
-        'mc-field-text--textarea': isTextarea.value,
-        'mc-field-text--textarea-autosize': isTextareaAutosize.value,
-        'mc-field-text--disabled': props.disabled,
-        'mc-field-text--copy': props.copy,
-        'mc-field-text--rtl': isRtl.value
-    };
-});
-const computedTitle = computed(() => {
-    return `${props.title}${props.required ? ' *' : ''}`;
-});
-const isDate = computed(() => {
-    return prettyType.value === InputTypes.Date;
-});
-const isMaskVisible = computed(() => {
-    return !!props.mask || !!props.maskOptions || isDate.value;
-});
-const isTextarea = computed(() => {
-    return props.type === InputTypes.Textarea;
-});
-const isTextareaAutosize = computed(() => {
-    return props.type === InputTypes.TextareaAutosize;
-});
-const isPassword = computed(() => {
-    return props.type === InputTypes.Password;
-});
-const isAmountFormat = computed(() => {
-    return props.type === InputTypes.AmountFormat;
-});
-const hasCharCounter = computed(() => {
-    return !!props.maxLength && (isTextarea.value || isTextareaAutosize.value);
-});
-const isPasswordType = computed(() => {
-    return prettyType.value === InputTypes.Password;
-});
-const passwordIcon = computed(() => {
-    return isPasswordType.value ? 'visibility' : 'visibility_off';
-});
-const charCounter = computed(() => {
-    return props.modelValue ? String(props.modelValue).length : 0;
-});
-const charCounterTitle = computed(() => {
-    return `${charCounter.value}/${props.maxLength}`;
-});
-const charCounterColor = computed(() => {
-    return props.maxLength < +charCounter.value ? 'red' : 'dark-gray';
-});
-const dateMask = computed(() => {
-    return {
-        mask: Date,
-        autofix: true,
-        blocks: {
-            d: {
-                mask: IMask.MaskedRange,
-                placeholderChar: props.dateMaskPlaceholder.date || 'd',
-                from: 1,
-                to: 31,
-                maxLength: 2
-            },
-            m: {
-                mask: IMask.MaskedRange,
-                placeholderChar: props.dateMaskPlaceholder.month || 'm',
-                from: 1,
-                to: 12,
-                maxLength: 2
-            },
-            Y: {
-                mask: IMask.MaskedRange,
-                placeholderChar: props.dateMaskPlaceholder.year || 'y',
-                from: 1900,
-                to: 2999,
-                maxLength: 4
-            }
-        }
-    };
-});
-const maskInputAttrs = computed(() => {
-    return {
-        ...inputAttrs.value,
-        mask: props.mask,
-        lazy: false,
-        overwrite: false,
-        unmask: props.clearOutput,
-        definitions: {
-            '#': /./
-        },
-        readonly: props.readOnly,
-        maxlength: props.maxLength,
-        type: 'tel',
-        ...attrs,
-        ...(props.maskOptions ?? {}),
-        ...(isDate.value ? dateMask.value : {})
-    };
-});
-const computedValue = computed({
-    get() {
-        if (isAmountFormat.value && !isRtl.value) {
-            return getAmountFormat(String(props.modelValue));
-        }
-        else
-            return props.modelValue;
-    },
-    set(value) {
-        fieldErrors.toggleErrorVisible();
-        emit('update:modelValue', value);
-    }
-});
-const handleInput = (e) => {
-    computedValue.value = getPreparedInputValue(e);
-};
-const inputAttrs = computed(() => {
-    return {
-        style: inputStyles.value,
-        placeholder: props.placeholder,
-        disabled: props.disabled,
-        name: props.name,
-        id: props.name,
-        autocomplete: props.autocomplete,
-        tabindex: props.tabindex,
-        ...attrs,
-        class: ['mc-field-text__input', attrs.class || ''].join(' ')
-    };
-});
-const inputStyles = computed(() => {
-    const space = parseInt(Spaces['150']);
-    let bottomStyle = {};
-    if (isTextarea.value || isTextareaAutosize.value) {
-        const spaceBottomToken = hasCharCounter.value ? '400' : '150';
-        const spaceBottomValue = Spaces[spaceBottomToken];
-        bottomStyle = { paddingBottom: `${+spaceBottomValue.replace('px', '') - 1}px` };
-    }
-    return {
-        paddingInlineStart: prependWidth.value && `${prependWidth.value + space}px`,
-        paddingInlineEnd: appendWidth.value && `${appendWidth.value + space}px`,
-        ...(!isTextarea.value && !isTextareaAutosize.value ? { boxSizing: 'border-box' } : {}),
-        ...bottomStyle
-    };
-});
-onMounted(() => {
-    calculatePadding();
-});
-const setDecimalsLimit = (val) => {
-    if (val && props.maxDecimals) {
-        const [integerPart, decimalPart] = val.split('.');
-        if (decimalPart?.length > props.maxDecimals) {
-            return `${integerPart}.${decimalPart.slice(0, props.maxDecimals)}`;
-        }
-    }
-    return val;
-};
-/**
- * Remove leading zero from input if length > 1 && number isn't decimal
- * */
-const removeLeadingZero = (val) => {
-    let result = val;
-    const [first_char] = val || [];
-    if (val.length > 1 && +first_char === 0 && val.indexOf('.') === -1)
-        result = val.slice(1);
-    return result;
-};
-const getPreparedInputValue = (e) => {
-    const target = e.target;
-    let value = isDate.value && target && target.value ? target.value?.substring(0, 10) : target.value;
-    let cursor_position = getCaretPos(target)?.start;
-    let prepared_value = formattedToNumber(value);
-    switch (props.type) {
-        case InputTypes.Num: {
-            //eslint-disable-next-line
-            let [num] = /-?\d*[\.]?\d*/.exec(String(value)) || [];
-            num = setDecimalsLimit(num);
-            num = removeLeadingZero(num);
-            value = num;
-            target.value = num;
-            break;
-        }
-        case InputTypes.Int: {
-            let [int] = /-?\d*/.exec(String(target.value)) || [];
-            int = removeLeadingZero(int);
-            value = int;
-            target.value = int;
-            break;
-        }
-        case InputTypes.AmountFormat: {
-            value = setDecimalsLimit(value);
-            value = removeLeadingZero(value);
-            prepared_value = formattedToNumber(value);
-            const float_value = parseFloat(prepared_value);
-            const without_spaces_value = prepared_value.replace(/ /gm, '');
-            value = prepared_value
-                ? String(float_value) === without_spaces_value
-                    ? float_value
-                    : without_spaces_value || float_value || prepared_value
-                : null;
-            const formatted_value = getAmountFormat(prepared_value);
-            target.value = isRtl.value ? formatted_value.replace(/ /gm, '') : formatted_value;
-            const space_length = target.value?.slice(0, cursor_position).replace(/[^ ]/gm, '')?.length || 0;
-            setCaretPos(target, cursor_position + space_length, cursor_position + space_length);
-            break;
-        }
-        case InputTypes.Uppercase: {
-            value = value?.toUpperCase();
-            target.value = value;
-            setCaretPos(target, cursor_position, cursor_position);
-            break;
-        }
-        case InputTypes.Lowercase: {
-            value = value?.toLowerCase();
-            target.value = value;
-            setCaretPos(target, cursor_position, cursor_position);
-            break;
-        }
-        case InputTypes.Password:
-            value = value?.replace(/ /gm, '');
-            target.value = value;
-            setCaretPos(target, cursor_position, cursor_position);
-            break;
-        case InputTypes.PhoneNumber:
-            if (value.length === 0)
-                value = '+';
-            if (value.charAt(0) !== '+')
-                value = '+' + value;
-            value = value.replace(/(?!^)\D/g, '');
-            target.value = value;
-            break;
-    }
-    return value;
-};
-const prepareHandleKeyDown = (e) => {
-    switch (props.type) {
-        case InputTypes.AmountFormat:
-        case InputTypes.Num: {
-            if (e.key === '.' && typeof props.modelValue === 'string' && props.modelValue?.includes('.')) {
-                e.preventDefault();
-            }
-            break;
-        }
-    }
-    emit('keydown', e);
-};
-const formattedToNumber = (value) => {
-    if (!value)
-        return value;
-    //eslint-disable-next-line
-    const [first] = /-?\d*[\.]?\d*/.exec(String(value)?.replace(/ /gm, '')?.trim()) || [];
-    return first;
-};
-const setCaretPos = (ctrl, start, end) => {
-    if (ctrl.setSelectionRange) {
-        ctrl.focus();
-        ctrl.setSelectionRange(start, end);
-    }
-};
-const getCaretPos = (ctrl) => {
-    if (ctrl.selectionStart || ctrl.selectionStart === 0) {
-        return { start: ctrl.selectionStart, end: ctrl.selectionEnd };
-    }
-    else {
-        return { start: 0, end: 0 };
-    }
-};
-const getAmountFormat = (value) => {
-    const formatted_number = formattedToNumber(value);
-    const has_fraction = !!String(formatted_number)?.match(/\./);
-    const [int, fraction] = String(formatted_number)
-        //eslint-disable-next-line
-        .replace(/[^\d\.-]/g, '')
-        .replace(/\B(?=(?:\d{3})+(?!\d))/g, ' ')
-        .split('.');
-    const formatted_values = [int, fraction?.replace(/ /gm, '') || ''];
-    if (has_fraction) {
-        return formatted_values.join('.');
-    }
-    return formatted_values.filter((v) => !!v).join('.');
-};
-const calculatePadding = () => {
-    prependWidth.value = +calculateSlotPadding('prepend');
-    appendWidth.value = +calculateSlotPadding('append');
-};
-const calculateSlotPadding = (name) => {
-    const tokenSpace = parseInt(Spaces['50']);
-    let result = slots[name]
-        ? //@ts-ignore
-            (slots[name] || []).reduce((acc) => {
-                return acc + tokenSpace;
-            }, 0) + tokenSpace
-        : tokenSpace;
-    if (name === 'prepend')
-        return result;
-    /**
-     *  Также увеличиваем padding при наличии кнопки копирования и если тип password
-     */
-    const iconSpace = parseInt(Spaces['300']);
-    result = result ? result + tokenSpace : tokenSpace;
-    props.copy && (result += iconSpace);
-    isPassword.value && (result += iconSpace);
-    return result;
-};
-const handlerCopy = () => {
-    /**
-     * Событие по кнопке копирования
-     */
-    emit('copy', props.modelValue);
-};
-const togglePasswordVisibility = () => {
-    prettyType.value = isPasswordType.value ? InputTypes.Text : InputTypes.Password;
-}; /* PartiallyEnd: #3632/scriptSetup.vue */
-const __VLS_fnComponent = (await import('vue')).defineComponent({
-    props: {
-        /**
-         *  Значение
-         *
-         */
-        modelValue: {
-            type: [String, Number],
-            default: null
-        },
-        /**
-         *  Тип:
-         * `textarea, textarea-autosize и
-         * нативные как text, password, email и т.д.`
-         *
-         * кастомный num - разрешает ввод только цифр и дробных чисел, без ислчений ввиде буквы 'E'
-         * кастомный int - разрешает ввод только целочисленных значений
-         * кастомный amount_format - форматирует ввод числовых данных разделяя на разряды(1 000 000)
-         * date - добавляет placeholder, маску и ограничения ввода
-         * uppercase\lowercase - форматирует текст согласну значению (верхний\нижний регистр)
-         * phone_number - добавляет '+' к номеру телефона при фокусе без возможности удалить его
-         */
-        type: {
-            type: String,
-            default: InputTypes.Text
-        },
-        /**
-         *  Заголовок поля:
-         *
-         */
-        title: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Маска поля:
-         *
-         * tokens - https://imask.js.org/guide.html
-         *
-         */
-        mask: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Вспомогательный текст под инпутом:
-         *
-         */
-        helpText: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Отключенное состояние
-         *
-         */
-        disabled: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         *  Ошибки
-         *
-         */
-        errors: {
-            type: Array,
-            default: null
-        },
-        /**
-         *  Placeholder
-         *
-         */
-        placeholder: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Name
-         *
-         */
-        name: {
-            type: String,
-            required: true
-        },
-        /**
-         *  плейсхолдеры для короткого обозначения даты (для маски dd.mm.yyyy)
-         *  {
-         *      date: 'd',
-         *      month: 'm',
-         *      year: 'y',
-         *  }
-         *
-         */
-        dateMaskPlaceholder: {
-            type: Object,
-            default: () => ({})
-        },
-        /**
-         *  Максимальная длина строки в инпуте
-         *
-         */
-        maxLength: {
-            type: Number,
-            default: null
-        },
-        /**
-         *  Состояние копирования
-         *
-         */
-        copy: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         *  Автокомплит введённого ранее текста: on, off
-         *
-         */
-        autocomplete: {
-            type: String,
-            default: Autocomplete.On
-        },
-        /**
-         *  только чтение текста
-         *
-         */
-        readOnly: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Атрибут tabindex для главного элемента
-         *
-         */
-        tabindex: {
-            type: [String, Number]
-        },
-        /**
-         * Tooltip для кнопка "показать пароль"
-         *
-         */
-        passwordTooltip: {
-            type: String,
-            default: 'Show/Hide'
-        },
-        /**
-         * Tooltip для кнопка "Скрыть пароль", если не указывать, то будет аналогичен "показать"
-         *
-         */
-        passwordHideTooltip: {
-            type: String,
-            default: null
-        },
-        /**
-         * Очищаем данные от маски на выходе
-         */
-        clearOutput: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Кастомные настройки для маски
-         * См. https://imask.js.org/guide.html
-         *
-         * Например:
-         *  {
-         *   autofix: true,
-         *    blocks: {
-         *      d: {mask: IMask.MaskedRange, placeholderChar: 'd', from: 1, to: 31, maxLength: 2},
-         *      m: {mask: IMask.MaskedRange, placeholderChar: 'm', from: 1, to: 12, maxLength: 2},
-         *      Y: {mask: IMask.MaskedRange, placeholderChar: 'y', from: 1900, to: 2999, maxLength: 4}
-         *    }
-         *  }
-         */
-        maskOptions: {
-            type: Object,
-            default: null
-        },
-        required: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Для какого языка поле ввода
-         */
-        locale: {
-            type: String,
-            default: null
-        },
-        /**
-         * Мобильное ли разрешение
-         * (Используется для триггера тултипа в кнопке с паролем)
-         */
-        isMobile: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Свойство на ограничение количества символов после точки для числовых типов (num || amount_format)
-         */
-        maxDecimals: {
-            type: Number,
-            default: 2
-        },
-        dir: {
-            type: String,
-            default: Directions.Ltr
-        }
-    },
-    __typeEmits: {},
-});
-;
-let __VLS_functionalComponentProps;
-function __VLS_template() {
-    const __VLS_ctx = {};
-    const __VLS_localComponents = {
-        ...{},
-        ...{},
-        ...__VLS_ctx,
-    };
-    let __VLS_components;
-    const __VLS_localDirectives = {
-        ...{},
-        ...__VLS_ctx,
-    };
-    let __VLS_directives;
-    let __VLS_styleScopedClasses;
-    // CSS variable injection 
-    // CSS variable injection end 
-    let __VLS_resolvedLocalAndGlobalComponents;
-    __VLS_elementAsFunction(__VLS_intrinsicElements.div, __VLS_intrinsicElements.div)({ ref: ("field"), dir: ((props.dir)), ...{ class: ((__VLS_ctx.classes)) }, });
-    // @ts-ignore navigation for `const field = ref()`
-    __VLS_ctx.field;
-    __VLS_elementAsFunction(__VLS_intrinsicElements.label, __VLS_intrinsicElements.label)({ for: ((__VLS_ctx.name)), ...{ class: ("mc-field-text__header") }, });
-    var __VLS_0 = {};
-    if (__VLS_ctx.title) {
-        const __VLS_1 = __VLS_resolvedLocalAndGlobalComponents.McTitle;
-        /** @type { [typeof __VLS_components.McTitle, typeof __VLS_components.mcTitle, typeof __VLS_components.McTitle, typeof __VLS_components.mcTitle, ] } */
-        // @ts-ignore
-        const __VLS_2 = __VLS_asFunctionalComponent(__VLS_1, new __VLS_1({ maxWidth: ("100%"), weight: ((__VLS_ctx.Weights.Medium)), }));
-        const __VLS_3 = __VLS_2({ maxWidth: ("100%"), weight: ((__VLS_ctx.Weights.Medium)), }, ...__VLS_functionalComponentArgsRest(__VLS_2));
-        (__VLS_ctx.computedTitle);
-        __VLS_nonNullable(__VLS_6.slots).default;
-        var __VLS_6;
-    }
-    __VLS_elementAsFunction(__VLS_intrinsicElements.div, __VLS_intrinsicElements.div)({ ...{ class: ("mc-field-text__inner") }, });
-    __VLS_elementAsFunction(__VLS_intrinsicElements.div, __VLS_intrinsicElements.div)({ ...{ class: ("mc-field-text__main") }, });
-    if (__VLS_ctx.$slots.prepend) {
-        __VLS_elementAsFunction(__VLS_intrinsicElements.div, __VLS_intrinsicElements.div)({ ...{ class: ("mc-field-text__prepend") }, });
-        var __VLS_7 = {};
-    }
-    __VLS_elementAsFunction(__VLS_intrinsicElements.label, __VLS_intrinsicElements.label)({ ...{ class: ("mc-field-text__input-wrapper") }, });
-    if (__VLS_ctx.isTextarea) {
-        __VLS_elementAsFunction(__VLS_intrinsicElements.textarea)({ ...{ onInput: (__VLS_ctx.handleInput) }, value: ((__VLS_ctx.computedValue)), ...(__VLS_ctx.inputAttrs), maxlength: ((__VLS_ctx.maxLength)), rows: ("1"), });
-    }
-    else if (__VLS_ctx.isTextareaAutosize) {
-        __VLS_elementAsFunction(__VLS_intrinsicElements.textarea)({ ...{ onInput: (__VLS_ctx.handleInput) }, value: ((__VLS_ctx.computedValue)), ref: ("textarea"), ...(__VLS_ctx.inputAttrs), });
-        // @ts-ignore navigation for `const textarea = ref()`
-        __VLS_ctx.textarea;
-    }
-    else {
-        if (__VLS_ctx.isMaskVisible) {
-            const __VLS_8 = __VLS_resolvedLocalAndGlobalComponents.IMaskComponent;
-            /** @type { [typeof __VLS_components.IMaskComponent, typeof __VLS_components.iMaskComponent, ] } */
-            // @ts-ignore
-            const __VLS_9 = __VLS_asFunctionalComponent(__VLS_8, new __VLS_8({ ...{ 'onInput': {} }, value: ((__VLS_ctx.computedValue)), ...(__VLS_ctx.maskInputAttrs), }));
-            const __VLS_10 = __VLS_9({ ...{ 'onInput': {} }, value: ((__VLS_ctx.computedValue)), ...(__VLS_ctx.maskInputAttrs), }, ...__VLS_functionalComponentArgsRest(__VLS_9));
-            let __VLS_14;
-            const __VLS_15 = {
-                onInput: (__VLS_ctx.handleInput)
-            };
-            let __VLS_11;
-            let __VLS_12;
-            var __VLS_13;
-        }
-        else {
-            __VLS_elementAsFunction(__VLS_intrinsicElements.input)({ ...{ onKeydown: (__VLS_ctx.prepareHandleKeyDown) }, ...{ onInput: (__VLS_ctx.handleInput) }, value: ((__VLS_ctx.computedValue)), ref: ("input"), ...(__VLS_ctx.inputAttrs), type: ((__VLS_ctx.prettyType)), readonly: ((props.readOnly)), maxlength: ((__VLS_ctx.maxLength)), });
-            // @ts-ignore navigation for `const input = ref()`
-            __VLS_ctx.input;
-        }
-    }
-    if (__VLS_ctx.$slots.append || __VLS_ctx.copy || __VLS_ctx.isPassword) {
-        __VLS_elementAsFunction(__VLS_intrinsicElements.div, __VLS_intrinsicElements.div)({ ...{ class: ("mc-field-text__append") }, ...{ class: (({ 'mc-field-text__append--indent-bottom': __VLS_ctx.hasCharCounter })) }, });
-        var __VLS_16 = {};
-        if (__VLS_ctx.copy) {
-            const __VLS_17 = __VLS_resolvedLocalAndGlobalComponents.McButton;
-            /** @type { [typeof __VLS_components.McButton, typeof __VLS_components.mcButton, typeof __VLS_components.McButton, typeof __VLS_components.mcButton, ] } */
-            // @ts-ignore
-            const __VLS_18 = __VLS_asFunctionalComponent(__VLS_17, new __VLS_17({ ...{ 'onClick': {} }, variation: ("black-link"), size: ((__VLS_ctx.ButtonSize.MCompact)), }));
-            const __VLS_19 = __VLS_18({ ...{ 'onClick': {} }, variation: ("black-link"), size: ((__VLS_ctx.ButtonSize.MCompact)), }, ...__VLS_functionalComponentArgsRest(__VLS_18));
-            let __VLS_23;
-            const __VLS_24 = {
-                onClick: (__VLS_ctx.handlerCopy)
-            };
-            let __VLS_20;
-            let __VLS_21;
-            __VLS_elementAsFunction(__VLS_intrinsicElements.template, __VLS_intrinsicElements.template)({});
-            {
-                const { "icon-append": __VLS_thisSlot } = __VLS_nonNullable(__VLS_22.slots);
-                const __VLS_25 = __VLS_resolvedLocalAndGlobalComponents.McSvgIcon;
-                /** @type { [typeof __VLS_components.McSvgIcon, typeof __VLS_components.mcSvgIcon, ] } */
-                // @ts-ignore
-                const __VLS_26 = __VLS_asFunctionalComponent(__VLS_25, new __VLS_25({ name: ("copy"), }));
-                const __VLS_27 = __VLS_26({ name: ("copy"), }, ...__VLS_functionalComponentArgsRest(__VLS_26));
-            }
-            var __VLS_22;
-        }
-        if (__VLS_ctx.isPassword) {
-            const __VLS_31 = __VLS_resolvedLocalAndGlobalComponents.McTooltip;
-            /** @type { [typeof __VLS_components.McTooltip, typeof __VLS_components.mcTooltip, typeof __VLS_components.McTooltip, typeof __VLS_components.mcTooltip, ] } */
-            // @ts-ignore
-            const __VLS_32 = __VLS_asFunctionalComponent(__VLS_31, new __VLS_31({ content: ((__VLS_ctx.isPasswordType ? props.passwordTooltip : props.passwordHideTooltip || props.passwordTooltip)), }));
-            const __VLS_33 = __VLS_32({ content: ((__VLS_ctx.isPasswordType ? props.passwordTooltip : props.passwordHideTooltip || props.passwordTooltip)), }, ...__VLS_functionalComponentArgsRest(__VLS_32));
-            const __VLS_37 = __VLS_resolvedLocalAndGlobalComponents.McButton;
-            /** @type { [typeof __VLS_components.McButton, typeof __VLS_components.mcButton, typeof __VLS_components.McButton, typeof __VLS_components.mcButton, ] } */
-            // @ts-ignore
-            const __VLS_38 = __VLS_asFunctionalComponent(__VLS_37, new __VLS_37({ ...{ 'onClick': {} }, variation: ("black-link"), size: ((__VLS_ctx.ButtonSize.MCompact)), tabindex: ("-1"), type: ((__VLS_ctx.ButtonType.Button)), }));
-            const __VLS_39 = __VLS_38({ ...{ 'onClick': {} }, variation: ("black-link"), size: ((__VLS_ctx.ButtonSize.MCompact)), tabindex: ("-1"), type: ((__VLS_ctx.ButtonType.Button)), }, ...__VLS_functionalComponentArgsRest(__VLS_38));
-            let __VLS_43;
-            const __VLS_44 = {
-                onClick: (__VLS_ctx.togglePasswordVisibility)
-            };
-            let __VLS_40;
-            let __VLS_41;
-            __VLS_elementAsFunction(__VLS_intrinsicElements.template, __VLS_intrinsicElements.template)({});
-            {
-                const { "icon-append": __VLS_thisSlot } = __VLS_nonNullable(__VLS_42.slots);
-                const __VLS_45 = __VLS_resolvedLocalAndGlobalComponents.McSvgIcon;
-                /** @type { [typeof __VLS_components.McSvgIcon, typeof __VLS_components.mcSvgIcon, ] } */
-                // @ts-ignore
-                const __VLS_46 = __VLS_asFunctionalComponent(__VLS_45, new __VLS_45({ name: ((__VLS_ctx.passwordIcon)), }));
-                const __VLS_47 = __VLS_46({ name: ((__VLS_ctx.passwordIcon)), }, ...__VLS_functionalComponentArgsRest(__VLS_46));
-            }
-            var __VLS_42;
-            __VLS_nonNullable(__VLS_36.slots).default;
-            var __VLS_36;
-        }
-    }
-    if (__VLS_ctx.hasCharCounter) {
-        const __VLS_51 = __VLS_resolvedLocalAndGlobalComponents.McTitle;
-        /** @type { [typeof __VLS_components.McTitle, typeof __VLS_components.mcTitle, typeof __VLS_components.McTitle, typeof __VLS_components.mcTitle, ] } */
-        // @ts-ignore
-        const __VLS_52 = __VLS_asFunctionalComponent(__VLS_51, new __VLS_51({ ...{ class: ("mc-field-text__char-counter") }, variation: ((__VLS_ctx.TitleVariations.Overline)), textAlign: ((__VLS_ctx.HorizontalAlignment.Right)), color: ((__VLS_ctx.charCounterColor)), }));
-        const __VLS_53 = __VLS_52({ ...{ class: ("mc-field-text__char-counter") }, variation: ((__VLS_ctx.TitleVariations.Overline)), textAlign: ((__VLS_ctx.HorizontalAlignment.Right)), color: ((__VLS_ctx.charCounterColor)), }, ...__VLS_functionalComponentArgsRest(__VLS_52));
-        (__VLS_ctx.charCounterTitle);
-        __VLS_nonNullable(__VLS_56.slots).default;
-        var __VLS_56;
-    }
-    if (__VLS_ctx.$slots.right) {
-        __VLS_elementAsFunction(__VLS_intrinsicElements.div, __VLS_intrinsicElements.div)({ ...{ class: ("mc-field-text__right") }, });
-        var __VLS_57 = {};
-    }
-    if (__VLS_ctx.fieldErrors.errorText.value || props.helpText || __VLS_ctx.$slots.footer) {
-        __VLS_elementAsFunction(__VLS_intrinsicElements.div, __VLS_intrinsicElements.div)({ ...{ class: ("mc-field-text__footer") }, });
-        if (__VLS_ctx.fieldErrors.errorText.value) {
-            const __VLS_58 = __VLS_resolvedLocalAndGlobalComponents.McTitle;
-            /** @type { [typeof __VLS_components.McTitle, typeof __VLS_components.mcTitle, ] } */
-            // @ts-ignore
-            const __VLS_59 = __VLS_asFunctionalComponent(__VLS_58, new __VLS_58({ tagName: ("div"), color: ("red"), variation: ((__VLS_ctx.TitleVariations.Overline)), ...{ class: ("mc-field-text__error-text") }, htmlData: ((__VLS_ctx.fieldErrors.errorText.value)), }));
-            const __VLS_60 = __VLS_59({ tagName: ("div"), color: ("red"), variation: ((__VLS_ctx.TitleVariations.Overline)), ...{ class: ("mc-field-text__error-text") }, htmlData: ((__VLS_ctx.fieldErrors.errorText.value)), }, ...__VLS_functionalComponentArgsRest(__VLS_59));
-        }
-        if (__VLS_ctx.fieldErrors.errorText.value) {
-            __VLS_elementAsFunction(__VLS_intrinsicElements.br)({});
-        }
-        var __VLS_64 = {};
-        if (props.helpText) {
-            const __VLS_65 = __VLS_resolvedLocalAndGlobalComponents.McTitle;
-            /** @type { [typeof __VLS_components.McTitle, typeof __VLS_components.mcTitle, typeof __VLS_components.McTitle, typeof __VLS_components.mcTitle, ] } */
-            // @ts-ignore
-            const __VLS_66 = __VLS_asFunctionalComponent(__VLS_65, new __VLS_65({ tagName: ("div"), variation: ((__VLS_ctx.TitleVariations.Overline)), color: ("gray"), maxWidth: ("100%"), }));
-            const __VLS_67 = __VLS_66({ tagName: ("div"), variation: ((__VLS_ctx.TitleVariations.Overline)), color: ("gray"), maxWidth: ("100%"), }, ...__VLS_functionalComponentArgsRest(__VLS_66));
-            (props.helpText);
-            __VLS_nonNullable(__VLS_70.slots).default;
-            var __VLS_70;
-        }
-    }
-    __VLS_styleScopedClasses['mc-field-text__header'];
-    __VLS_styleScopedClasses['mc-field-text__inner'];
-    __VLS_styleScopedClasses['mc-field-text__main'];
-    __VLS_styleScopedClasses['mc-field-text__prepend'];
-    __VLS_styleScopedClasses['mc-field-text__input-wrapper'];
-    __VLS_styleScopedClasses['mc-field-text__append'];
-    __VLS_styleScopedClasses['mc-field-text__append--indent-bottom'];
-    __VLS_styleScopedClasses['mc-field-text__char-counter'];
-    __VLS_styleScopedClasses['mc-field-text__right'];
-    __VLS_styleScopedClasses['mc-field-text__footer'];
-    __VLS_styleScopedClasses['mc-field-text__error-text'];
-    var __VLS_slots;
-    var __VLS_inheritedAttrs;
-    const __VLS_refs = {
-        "field": __VLS_nativeElements['div'],
-        "textarea": __VLS_nativeElements['textarea'],
-        "input": __VLS_nativeElements['input'],
-    };
-    var $refs;
-    var $el;
-    return {
-        attrs: {},
-        slots: __VLS_slots,
-        refs: $refs,
-        rootEl: $el,
-    };
-}
-;
-const __VLS_self = (await import('vue')).defineComponent({
-    setup() {
-        return {
-            IMaskComponent: IMaskComponent,
-            McTitle: McTitle,
-            McButton: McButton,
-            McSvgIcon: McSvgIcon,
-            McTooltip: McTooltip,
-            ButtonSize: ButtonSize,
-            ButtonType: ButtonType,
-            HorizontalAlignment: HorizontalAlignment,
-            TitleVariations: TitleVariations,
-            Weights: Weights,
-            textarea: textarea,
-            prettyType: prettyType,
-            fieldErrors: fieldErrors,
-            classes: classes,
-            computedTitle: computedTitle,
-            isMaskVisible: isMaskVisible,
-            isTextarea: isTextarea,
-            isTextareaAutosize: isTextareaAutosize,
-            isPassword: isPassword,
-            hasCharCounter: hasCharCounter,
-            isPasswordType: isPasswordType,
-            passwordIcon: passwordIcon,
-            charCounterTitle: charCounterTitle,
-            charCounterColor: charCounterColor,
-            maskInputAttrs: maskInputAttrs,
-            computedValue: computedValue,
-            handleInput: handleInput,
-            inputAttrs: inputAttrs,
-            prepareHandleKeyDown: prepareHandleKeyDown,
-            handlerCopy: handlerCopy,
-            togglePasswordVisibility: togglePasswordVisibility,
-        };
-    },
-    __typeEmits: {},
-    props: {
-        /**
-         *  Значение
-         *
-         */
-        modelValue: {
-            type: [String, Number],
-            default: null
-        },
-        /**
-         *  Тип:
-         * `textarea, textarea-autosize и
-         * нативные как text, password, email и т.д.`
-         *
-         * кастомный num - разрешает ввод только цифр и дробных чисел, без ислчений ввиде буквы 'E'
-         * кастомный int - разрешает ввод только целочисленных значений
-         * кастомный amount_format - форматирует ввод числовых данных разделяя на разряды(1 000 000)
-         * date - добавляет placeholder, маску и ограничения ввода
-         * uppercase\lowercase - форматирует текст согласну значению (верхний\нижний регистр)
-         * phone_number - добавляет '+' к номеру телефона при фокусе без возможности удалить его
-         */
-        type: {
-            type: String,
-            default: InputTypes.Text
-        },
-        /**
-         *  Заголовок поля:
-         *
-         */
-        title: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Маска поля:
-         *
-         * tokens - https://imask.js.org/guide.html
-         *
-         */
-        mask: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Вспомогательный текст под инпутом:
-         *
-         */
-        helpText: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Отключенное состояние
-         *
-         */
-        disabled: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         *  Ошибки
-         *
-         */
-        errors: {
-            type: Array,
-            default: null
-        },
-        /**
-         *  Placeholder
-         *
-         */
-        placeholder: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Name
-         *
-         */
-        name: {
-            type: String,
-            required: true
-        },
-        /**
-         *  плейсхолдеры для короткого обозначения даты (для маски dd.mm.yyyy)
-         *  {
-         *      date: 'd',
-         *      month: 'm',
-         *      year: 'y',
-         *  }
-         *
-         */
-        dateMaskPlaceholder: {
-            type: Object,
-            default: () => ({})
-        },
-        /**
-         *  Максимальная длина строки в инпуте
-         *
-         */
-        maxLength: {
-            type: Number,
-            default: null
-        },
-        /**
-         *  Состояние копирования
-         *
-         */
-        copy: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         *  Автокомплит введённого ранее текста: on, off
-         *
-         */
-        autocomplete: {
-            type: String,
-            default: Autocomplete.On
-        },
-        /**
-         *  только чтение текста
-         *
-         */
-        readOnly: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Атрибут tabindex для главного элемента
-         *
-         */
-        tabindex: {
-            type: [String, Number]
-        },
-        /**
-         * Tooltip для кнопка "показать пароль"
-         *
-         */
-        passwordTooltip: {
-            type: String,
-            default: 'Show/Hide'
-        },
-        /**
-         * Tooltip для кнопка "Скрыть пароль", если не указывать, то будет аналогичен "показать"
-         *
-         */
-        passwordHideTooltip: {
-            type: String,
-            default: null
-        },
-        /**
-         * Очищаем данные от маски на выходе
-         */
-        clearOutput: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Кастомные настройки для маски
-         * См. https://imask.js.org/guide.html
-         *
-         * Например:
-         *  {
-         *   autofix: true,
-         *    blocks: {
-         *      d: {mask: IMask.MaskedRange, placeholderChar: 'd', from: 1, to: 31, maxLength: 2},
-         *      m: {mask: IMask.MaskedRange, placeholderChar: 'm', from: 1, to: 12, maxLength: 2},
-         *      Y: {mask: IMask.MaskedRange, placeholderChar: 'y', from: 1900, to: 2999, maxLength: 4}
-         *    }
-         *  }
-         */
-        maskOptions: {
-            type: Object,
-            default: null
-        },
-        required: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Для какого языка поле ввода
-         */
-        locale: {
-            type: String,
-            default: null
-        },
-        /**
-         * Мобильное ли разрешение
-         * (Используется для триггера тултипа в кнопке с паролем)
-         */
-        isMobile: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Свойство на ограничение количества символов после точки для числовых типов (num || amount_format)
-         */
-        maxDecimals: {
-            type: Number,
-            default: 2
-        },
-        dir: {
-            type: String,
-            default: Directions.Ltr
-        }
-    },
-});
-const __VLS_component = (await import('vue')).defineComponent({
-    setup() {
-        return {};
-    },
-    __typeEmits: {},
-    props: {
-        /**
-         *  Значение
-         *
-         */
-        modelValue: {
-            type: [String, Number],
-            default: null
-        },
-        /**
-         *  Тип:
-         * `textarea, textarea-autosize и
-         * нативные как text, password, email и т.д.`
-         *
-         * кастомный num - разрешает ввод только цифр и дробных чисел, без ислчений ввиде буквы 'E'
-         * кастомный int - разрешает ввод только целочисленных значений
-         * кастомный amount_format - форматирует ввод числовых данных разделяя на разряды(1 000 000)
-         * date - добавляет placeholder, маску и ограничения ввода
-         * uppercase\lowercase - форматирует текст согласну значению (верхний\нижний регистр)
-         * phone_number - добавляет '+' к номеру телефона при фокусе без возможности удалить его
-         */
-        type: {
-            type: String,
-            default: InputTypes.Text
-        },
-        /**
-         *  Заголовок поля:
-         *
-         */
-        title: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Маска поля:
-         *
-         * tokens - https://imask.js.org/guide.html
-         *
-         */
-        mask: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Вспомогательный текст под инпутом:
-         *
-         */
-        helpText: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Отключенное состояние
-         *
-         */
-        disabled: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         *  Ошибки
-         *
-         */
-        errors: {
-            type: Array,
-            default: null
-        },
-        /**
-         *  Placeholder
-         *
-         */
-        placeholder: {
-            type: String,
-            default: null
-        },
-        /**
-         *  Name
-         *
-         */
-        name: {
-            type: String,
-            required: true
-        },
-        /**
-         *  плейсхолдеры для короткого обозначения даты (для маски dd.mm.yyyy)
-         *  {
-         *      date: 'd',
-         *      month: 'm',
-         *      year: 'y',
-         *  }
-         *
-         */
-        dateMaskPlaceholder: {
-            type: Object,
-            default: () => ({})
-        },
-        /**
-         *  Максимальная длина строки в инпуте
-         *
-         */
-        maxLength: {
-            type: Number,
-            default: null
-        },
-        /**
-         *  Состояние копирования
-         *
-         */
-        copy: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         *  Автокомплит введённого ранее текста: on, off
-         *
-         */
-        autocomplete: {
-            type: String,
-            default: Autocomplete.On
-        },
-        /**
-         *  только чтение текста
-         *
-         */
-        readOnly: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Атрибут tabindex для главного элемента
-         *
-         */
-        tabindex: {
-            type: [String, Number]
-        },
-        /**
-         * Tooltip для кнопка "показать пароль"
-         *
-         */
-        passwordTooltip: {
-            type: String,
-            default: 'Show/Hide'
-        },
-        /**
-         * Tooltip для кнопка "Скрыть пароль", если не указывать, то будет аналогичен "показать"
-         *
-         */
-        passwordHideTooltip: {
-            type: String,
-            default: null
-        },
-        /**
-         * Очищаем данные от маски на выходе
-         */
-        clearOutput: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Кастомные настройки для маски
-         * См. https://imask.js.org/guide.html
-         *
-         * Например:
-         *  {
-         *   autofix: true,
-         *    blocks: {
-         *      d: {mask: IMask.MaskedRange, placeholderChar: 'd', from: 1, to: 31, maxLength: 2},
-         *      m: {mask: IMask.MaskedRange, placeholderChar: 'm', from: 1, to: 12, maxLength: 2},
-         *      Y: {mask: IMask.MaskedRange, placeholderChar: 'y', from: 1900, to: 2999, maxLength: 4}
-         *    }
-         *  }
-         */
-        maskOptions: {
-            type: Object,
-            default: null
-        },
-        required: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Для какого языка поле ввода
-         */
-        locale: {
-            type: String,
-            default: null
-        },
-        /**
-         * Мобильное ли разрешение
-         * (Используется для триггера тултипа в кнопке с паролем)
-         */
-        isMobile: {
-            type: Boolean,
-            default: false
-        },
-        /**
-         * Свойство на ограничение количества символов после точки для числовых типов (num || amount_format)
-         */
-        maxDecimals: {
-            type: Number,
-            default: 2
-        },
-        dir: {
-            type: String,
-            default: Directions.Ltr
-        }
-    },
-    __typeEl: {},
-});
-export default {};
-; /* PartiallyEnd: #4569/main.vue */