@redneckz/wildless-cms-uni-blocks 0.14.135 → 0.14.136

package/mobile/bundle/bundle.umd.js

@@ -1207,7 +1207,7 @@
 
     const renderSubmitButton = (button, className) => (jsx(Button, { className: style('w-full @xl:w-auto', className), type: "submit", children: button?.text ? button.text : 'Отправить заявку' }));
 
-    const initialFormState$6 = {
+    const initialFormState$7 = {
         acquiringType: { key: 'Торговый эквайринг' },
         fullName: '',
         inn: '',
@@ -1239,11 +1239,231 @@
                     phone: phone.replace(/[^+\d]/g, ''),
                 });
         }, [onSubmit]);
-        const [, { field, ...formProps }] = useForm(initialFormState$6, handleSubmit);
+        const [, { field, ...formProps }] = useForm(initialFormState$7, handleSubmit);
         const regions = useGetRegions();
         return (jsxs("form", { className: formStyle$1, onSubmit: formProps.onSubmit, children: [renderAcquiringRegion({ regions, field, title: 'Вид эквайринга и регион' }), renderAcquiringDataOrganization(field, 'Данные организации'), renderSlideCheckboxes(field), renderSubmitButton(button), jsx(Footnote, { link: link })] }));
     });
 
+    const SVG = JSX(({ className, viewBox, fill = 'none', width, height, paths, ...commonOptions }) => {
+        return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: className, viewBox: viewBox, fill: fill, width: width, height: height, children: paths.map(({ d, fill: pathFill, ...options }, i) => {
+                const resultOptions = { ...commonOptions, ...options };
+                return (jsx("path", { d: d, fill: pathFill || 'currentColor', stroke: resultOptions.stroke, strokeLinecap: resultOptions.strokeLinecap, strokeLinejoin: resultOptions.strokeLinejoin, strokeWidth: resultOptions.strokeWidth, strokeMiterlimit: resultOptions.strokeMiterlimit }, i));
+            }) }));
+    });
+
+    const CHECK_PATHS = [
+        {
+            d: 'M10.207.793a1 1 0 0 1 0 1.414l-6 6a1 1 0 0 1-1.414 0l-2.5-2.5a1 1 0 0 1 1.414-1.414L3.5 6.086 8.793.793a1 1 0 0 1 1.414 0Z',
+            fillRule: 'evenodd',
+            clipRule: 'evenodd',
+            fill: 'white',
+        },
+    ];
+    const Checkbox = JSX(({ className, value, text, disabled, isRadio, onChange }) => {
+        const handleChange = useCallback((e) => {
+            if (disabled) {
+                return;
+            }
+            e.preventDefault();
+            onChange && onChange(!value);
+        }, [onChange, disabled, value]);
+        const icon = isRadio ? (jsx("div", { className: "absolute left-1 w-3 h-3 rounded-full bg-primary-main" })) : (jsx(SVG, { paths: CHECK_PATHS, className: "absolute left-1 ml-px block", width: "11", height: "9", fill: "white", viewBox: "0 0 11 9" }));
+        return (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer group/box", onClick: handleChange, children: [jsx("div", { className: style('appearance-none w-5 h-5 border-solid cursor-pointer m-0', isRadio ? 'rounded-full border-2' : checkboxStyle(value), value ? 'border-primary-main' : 'border-gray', disabled ? 'bg-main-disabled' : 'group-hover/box:border-primary-hover'), role: "checkbox", "aria-checked": Boolean(value), "aria-disabled": Boolean(disabled) }), value ? icon : null, text ? (jsx("div", { className: "ml-s", children: jsx(Text, { size: "text-l", font: "font-light", children: text }) })) : null] }) }));
+    });
+    const checkboxStyle = (value) => style('rounded border', value ? 'bg-primary-main' : '');
+
+    const renderAgreementWithSubmit = (consentDataProcessing, link, button) => (jsxs("div", { className: "flex flex-col lg:flex-row w-full justify-between items-baseline", children: [jsxs("div", { children: [jsxs("div", { className: "flex gap-3", children: [jsx(Checkbox, { ...consentDataProcessing }), jsx(Footnote, { text: "\u0421\u043E\u0433\u043B\u0430\u0441\u0435\u043D \u0441 ", link: link })] }), renderErrorText(withValidator(consentDataProcessing, consentDataProcessingValidator).error)] }), renderSubmitButton(button)] }));
+
+    const formatDate = (date, toTimeStamp = false) => {
+        if (typeof date === 'string') {
+            return date.split('-').reverse().join('.');
+        }
+        else {
+            const day = String(date.getDate()).padStart(2, '0');
+            const month = String(date.getMonth() + 1).padStart(2, '0');
+            const year = toTimeStamp ? String(date.getFullYear()) : String(date.getFullYear()).slice(-2);
+            return toTimeStamp ? `${year}-${month}-${day}` : `${day}.${month}.${year}`;
+        }
+    };
+
+    const noop = () => {
+        // Do nothing
+    };
+
+    const DAY_COUNT = 6;
+    const WEEK_COUNT = 7;
+    const renderCalendarCells = ({ today, firstDayOfWeek, totalDays, currentMonth, currentYear, min, max, onDateClick, }) => {
+        const calendarCells = [];
+        let dayCounter = 1;
+        for (let i = 0; i < DAY_COUNT; i++) {
+            const rowCells = [];
+            for (let j = 0; j < WEEK_COUNT; j++) {
+                if (i === 0 && j < firstDayOfWeek) {
+                    rowCells.push(jsx("td", {}, `empty-${j}`));
+                }
+                else if (dayCounter > totalDays) {
+                    rowCells.push(jsx("td", {}, `empty-${j}`));
+                }
+                else {
+                    const currentDate = new Date(currentYear, currentMonth, dayCounter);
+                    const isToday = checkIsToday(currentDate, today);
+                    const isDisabled = checkIsDisabled(currentDate, min, max);
+                    rowCells.push(jsx("td", { children: jsx("div", { className: getDayStyles(isToday, isDisabled), onClick: () => !isDisabled && onDateClick(currentDate), children: dayCounter }) }, `day-${dayCounter}`));
+                    dayCounter++;
+                }
+            }
+            calendarCells.push(jsx("tr", { children: rowCells }, `row-${i}`));
+        }
+        return calendarCells;
+    };
+    const checkIsToday = (currentDate, today) => today && currentDate.toDateString() === today.toDateString();
+    const checkIsDisabled = (currentDate, min, max) => (min && currentDate.getTime() < min.getTime()) || (max && currentDate.getTime() > max.getTime());
+    const getDayStyles = (isToday, isDisabled) => style('p-s text-center rounded-md border', isToday ? '' : 'border-transparent hover:bg-gray', isDisabled ? 'text-gray hover:bg-transparent' : 'cursor-pointer');
+
+    const WEEK_DAYS = ['Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб', 'Вс'];
+    const Calendar = JSX(({ today, currentMonth, currentYear, min, max, onDateSelect = noop }) => {
+        const handleDateClick = useCallback((date) => onDateSelect(date), []);
+        const { firstDayOfWeek, totalDays } = useMemo(() => ({
+            firstDayOfWeek: new Date(currentYear, currentMonth, 1).getDay() - 1,
+            totalDays: new Date(currentYear, currentMonth + 1, 0).getDate(),
+        }), [currentYear, currentMonth]);
+        return (jsxs("table", { className: "mx-auto", children: [jsx("thead", { className: "text-gray font-light", children: jsx("tr", { children: WEEK_DAYS.map((day, index) => (jsx("th", { className: "p-s", children: day }, String(index)))) }) }), jsx("tbody", { children: renderCalendarCells({
+                        firstDayOfWeek,
+                        today,
+                        totalDays,
+                        currentYear,
+                        currentMonth,
+                        min,
+                        max,
+                        onDateClick: handleDateClick,
+                    }) })] }));
+    });
+
+    const months = [
+        'Январь',
+        'Февраль',
+        'Март',
+        'Апрель',
+        'Май',
+        'Июнь',
+        'Июль',
+        'Август',
+        'Сентябрь',
+        'Октябрь',
+        'Ноябрь',
+        'Декабрь',
+    ];
+
+    const START_YEAR = 1940;
+    const getYears = () => Array.from({ length: new Date().getFullYear() - START_YEAR + 1 }, (_, i) => START_YEAR + i);
+
+    const MONTHS_COUNT = 11;
+    const MONTHS_OPTIONS = months.map((key) => ({ key }));
+    const YEARS_OPTIONS = getYears()
+        .reverse()
+        .map((key) => ({ key: String(key) }));
+    const useDatePickerManager = ({ onShowCalendar, showCalendar, selectedMonth, onMonthSelect, onYearSelect, selectedYear, }) => {
+        const close = useCallback(() => showCalendar && onShowCalendar(false), [showCalendar]);
+        const ref = useOutsideClick(close);
+        const handleChangeVisibleCalendar = useCallback(() => onShowCalendar(!showCalendar), [showCalendar]);
+        const handleNextMonth = useCallback(() => {
+            if (selectedMonth + 1 <= MONTHS_COUNT) {
+                onMonthSelect(selectedMonth + 1);
+            }
+            else {
+                onMonthSelect(0);
+                onYearSelect(selectedYear + 1);
+            }
+        }, [selectedMonth]);
+        const handlePrevMonth = useCallback(() => {
+            if (selectedMonth - 1 >= 0) {
+                onMonthSelect(selectedMonth - 1);
+            }
+            else {
+                onMonthSelect(11);
+                onYearSelect(selectedYear - 1);
+            }
+        }, [selectedMonth]);
+        const handleSelectMonth = useCallback(({ key }) => onMonthSelect(months.indexOf(key)), []);
+        const handleSelectYear = useCallback(({ key }) => onYearSelect(Number(key)), []);
+        return {
+            handleChangeVisibleCalendar,
+            handleNextMonth,
+            handlePrevMonth,
+            handleSelectMonth,
+            handleSelectYear,
+            monthsOptions: MONTHS_OPTIONS,
+            yearsOptions: YEARS_OPTIONS,
+            ref,
+        };
+    };
+
+    const ICON_PROPS = {
+        name: 'ArrowUpIcon',
+        iconVersion: 'black',
+        width: '24',
+        height: '24',
+    };
+    const SELECT_PROPS = {
+        className: 'min-w-32',
+        iconVersion: 'black',
+        isBorder: false,
+    };
+    const formStyle = 'flex justify-between items-center h-14 px-m py-s border rounded-md cursor-pointer ' +
+        'hover:border-black active:border-black focus:border-black';
+    const DatePicker = JSX(({ className = '', label = '', value, valid = true, minDate, maxDate, onChange }) => {
+        const [showCalendar, { setValue }] = useBool(false);
+        const [selectedMonth, setSelectedMonth] = useState(value?.getMonth() || new Date().getMonth());
+        const [selectedYear, setSelectedYear] = useState(value?.getFullYear() || new Date().getFullYear());
+        const { handlePrevMonth, handleNextMonth, handleSelectMonth, handleSelectYear, monthsOptions, yearsOptions, handleChangeVisibleCalendar, ref, } = useDatePickerManager({
+            onYearSelect: setSelectedYear,
+            onMonthSelect: setSelectedMonth,
+            onShowCalendar: setValue,
+            selectedYear,
+            selectedMonth,
+            showCalendar,
+        });
+        return (jsxs("div", { className: style(className, 'relative'), ref: ref, children: [jsx(Text, { size: "text-m", "font-weight": "font-light", children: label }), renderDatePickerForm(handleChangeVisibleCalendar, value, valid), showCalendar ? (jsxs("div", { className: "absolute bg-white z-20 select-none", children: [jsxs("div", { className: "flex gap-s", children: [jsx("div", { className: "my-auto", onClick: handlePrevMonth, children: jsx(Icon, { ...ICON_PROPS, className: "-rotate-90 cursor-pointer" }) }), jsx(Select, { onChange: handleSelectMonth, value: { key: months[selectedMonth] }, options: monthsOptions, ...SELECT_PROPS }), jsx(Select, { onChange: handleSelectYear, value: { key: String(selectedYear) }, options: yearsOptions, ...SELECT_PROPS }), jsx("div", { className: "my-auto", onClick: handleNextMonth, children: jsx(Icon, { ...ICON_PROPS, className: "rotate-90 cursor-pointer" }) })] }), jsx(Calendar, { today: value, currentMonth: selectedMonth, currentYear: selectedYear, onDateSelect: onChange, min: minDate, max: maxDate })] })) : null] }));
+    });
+    const renderDatePickerForm = (handleChangeVisibleCalendar, value, valid) => (jsxs("div", { onClick: handleChangeVisibleCalendar, className: style(formStyle, valid ? 'border-gray' : 'border-error'), children: [jsx(Paragraph, { children: value && formatDate(value) }), jsx(Icon, { ...ICON_PROPS, name: "CalendarIcon" })] }));
+
+    const DatePickerControl = JSX(({ className, label, value = undefined, error, onChange }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [label ? (jsx("div", { className: "mb-xs", children: jsx(Text, { size: "text-m", font: "font-light", children: label }) })) : null, jsx(DatePicker, { value: value, onChange: onChange, valid: Boolean(!error) }), renderErrorText(error)] })));
+
+    const renderUserData = (field) => (jsxs("div", { children: [jsx(InputControl, { label: "\u0424\u0430\u043C\u0438\u043B\u0438\u044F*", ...withValidator(field('surname'), nameValidator) }), jsx(InputControl, { label: "\u0418\u043C\u044F*", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { label: "\u041E\u0442\u0447\u0435\u0441\u0442\u0432\u043E (\u041E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E, \u043F\u0440\u0438 \u043D\u0430\u043B\u0438\u0447\u0438\u0438)", ...field('middleName') }), jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F*", ...withValidator(field('birthday'), defaultValidator) })] }));
+
+    const initialFormState$6 = {
+        typeForm: { key: 'ANTIFRAUD', text: 'Предупреждение о мошенничестве' },
+        surname: '',
+        name: '',
+        middleName: '',
+        phone: '',
+        birthday: undefined,
+        isClient: false,
+        comment: '',
+        consentDataProcessing: false,
+    };
+    const feedbackValidator = objectValidator({
+        typeForm: defaultValidator,
+        surname: defaultValidator,
+        name: nameValidator,
+        birthday: defaultValidator,
+        phone: phoneValidator,
+        consentDataProcessing: consentDataProcessingValidator,
+    });
+    const ApplicationFormAntiFraud = JSX(({ button, link, onSubmit }) => {
+        const handleSubmit = useCallback((formState) => {
+            const { typeForm, phone, ...usedFields } = formState;
+            const submitData = {
+                ...usedFields,
+                typeForm: typeForm.key,
+                phone: phone.replace(/[^+\d]/g, ''),
+            };
+            isValidationSuccess(feedbackValidator(formState)) && onSubmit(submitData);
+        }, [onSubmit]);
+        const [, { field, ...formProps }] = useForm(initialFormState$6, handleSubmit);
+        return (jsx("form", { className: formStyle$1, onSubmit: formProps.onSubmit, children: jsx(ApplicationFieldsetLayout, { firstChildren: jsxs("div", { className: "w-full max-w-xl space-y-s m-auto", children: [renderUserData(field), jsx(PhoneInputControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D*", ...withValidator(field('phone'), phoneValidator) }), renderAgreementWithSubmit(field('consentDataProcessing'), link, button)] }) }) }));
+    });
+
     const renderBusinessCardDataOrganization = (field) => (jsx(ApplicationFieldsetLayout, { firstChildren: jsxs("div", { className: formChildrenStyle, children: [jsx(InputControl, { label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) })] }), secondChildren: jsxs("div", { className: formChildrenStyle, children: [jsx(PhoneInputControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) }), jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('mail'), defaultValidator) })] }) }));
 
     const renderRegion$1 = ({ regions, field }) => (jsx(SelectControl, { className: "w-full", label: "\u0424\u0438\u043B\u0438\u0430\u043B", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0438\u043B\u0438\u0430\u043B", isSearch: true, options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }));
@@ -1447,192 +1667,68 @@
         { key: 'Юридическое лицо / ИП' },
     ];
 
-    const SVG = JSX(({ className, viewBox, fill = 'none', width, height, paths, ...commonOptions }) => {
-        return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: className, viewBox: viewBox, fill: fill, width: width, height: height, children: paths.map(({ d, fill: pathFill, ...options }, i) => {
-                const resultOptions = { ...commonOptions, ...options };
-                return (jsx("path", { d: d, fill: pathFill || 'currentColor', stroke: resultOptions.stroke, strokeLinecap: resultOptions.strokeLinecap, strokeLinejoin: resultOptions.strokeLinejoin, strokeWidth: resultOptions.strokeWidth, strokeMiterlimit: resultOptions.strokeMiterlimit }, i));
-            }) }));
-    });
-
-    const CHECK_PATHS = [
-        {
-            d: 'M10.207.793a1 1 0 0 1 0 1.414l-6 6a1 1 0 0 1-1.414 0l-2.5-2.5a1 1 0 0 1 1.414-1.414L3.5 6.086 8.793.793a1 1 0 0 1 1.414 0Z',
-            fillRule: 'evenodd',
-            clipRule: 'evenodd',
-            fill: 'white',
-        },
-    ];
-    const Checkbox = JSX(({ className, value, text, disabled, isRadio, onChange }) => {
-        const handleChange = useCallback((e) => {
-            if (disabled) {
-                return;
-            }
-            e.preventDefault();
-            onChange && onChange(!value);
-        }, [onChange, disabled, value]);
-        const icon = isRadio ? (jsx("div", { className: "absolute left-1 w-3 h-3 rounded-full bg-primary-main" })) : (jsx(SVG, { paths: CHECK_PATHS, className: "absolute left-1 ml-px block", width: "11", height: "9", fill: "white", viewBox: "0 0 11 9" }));
-        return (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer group/box", onClick: handleChange, children: [jsx("div", { className: style('appearance-none w-5 h-5 border-solid cursor-pointer m-0', isRadio ? 'rounded-full border-2' : checkboxStyle(value), value ? 'border-primary-main' : 'border-gray', disabled ? 'bg-main-disabled' : 'group-hover/box:border-primary-hover'), role: "checkbox", "aria-checked": Boolean(value), "aria-disabled": Boolean(disabled) }), value ? icon : null, text ? (jsx("div", { className: "ml-s", children: jsx(Text, { size: "text-l", font: "font-light", children: text }) })) : null] }) }));
-    });
-    const checkboxStyle = (value) => style('rounded border', value ? 'bg-primary-main' : '');
-
-    const renderAgreementWithSubmit = (consentDataProcessing, link, button) => (jsxs("div", { className: "flex flex-col lg:flex-row w-full justify-between items-baseline", children: [jsxs("div", { children: [jsxs("div", { className: "flex gap-3", children: [jsx(Checkbox, { ...consentDataProcessing }), jsx(Footnote, { text: "\u0421\u043E\u0433\u043B\u0430\u0441\u0435\u043D \u0441 ", link: link })] }), renderErrorText(withValidator(consentDataProcessing, consentDataProcessingValidator).error)] }), renderSubmitButton(button)] }));
-
-    const formatDate = (date, toTimeStamp = false) => {
-        if (typeof date === 'string') {
-            return date.split('-').reverse().join('.');
-        }
-        else {
-            const day = String(date.getDate()).padStart(2, '0');
-            const month = String(date.getMonth() + 1).padStart(2, '0');
-            const year = toTimeStamp ? String(date.getFullYear()) : String(date.getFullYear()).slice(-2);
-            return toTimeStamp ? `${year}-${month}-${day}` : `${day}.${month}.${year}`;
-        }
-    };
-
-    const noop = () => {
-        // Do nothing
-    };
-
-    const DAY_COUNT = 6;
-    const WEEK_COUNT = 7;
-    const renderCalendarCells = ({ today, firstDayOfWeek, totalDays, currentMonth, currentYear, min, max, onDateClick, }) => {
-        const calendarCells = [];
-        let dayCounter = 1;
-        for (let i = 0; i < DAY_COUNT; i++) {
-            const rowCells = [];
-            for (let j = 0; j < WEEK_COUNT; j++) {
-                if (i === 0 && j < firstDayOfWeek) {
-                    rowCells.push(jsx("td", {}, `empty-${j}`));
-                }
-                else if (dayCounter > totalDays) {
-                    rowCells.push(jsx("td", {}, `empty-${j}`));
-                }
-                else {
-                    const currentDate = new Date(currentYear, currentMonth, dayCounter);
-                    const isToday = checkIsToday(currentDate, today);
-                    const isDisabled = checkIsDisabled(currentDate, min, max);
-                    rowCells.push(jsx("td", { children: jsx("div", { className: getDayStyles(isToday, isDisabled), onClick: () => !isDisabled && onDateClick(currentDate), children: dayCounter }) }, `day-${dayCounter}`));
-                    dayCounter++;
-                }
-            }
-            calendarCells.push(jsx("tr", { children: rowCells }, `row-${i}`));
-        }
-        return calendarCells;
+    const feedbackValidatorDefaultObject = {
+        typeForm: defaultValidator,
+        region: defaultValidator,
+        surname: defaultValidator,
+        name: nameValidator,
+        feedbackMethod: defaultValidator,
+        phone: phoneValidator,
+        email: defaultValidator,
+        comment: defaultValidator,
+        consentDataProcessing: consentDataProcessingValidator,
     };
-    const checkIsToday = (currentDate, today) => today && currentDate.toDateString() === today.toDateString();
-    const checkIsDisabled = (currentDate, min, max) => (min && currentDate.getTime() < min.getTime()) || (max && currentDate.getTime() > max.getTime());
-    const getDayStyles = (isToday, isDisabled) => style('p-s text-center rounded-md border', isToday ? '' : 'border-transparent hover:bg-gray', isDisabled ? 'text-gray hover:bg-transparent' : 'cursor-pointer');
-
-    const WEEK_DAYS = ['Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб', 'Вс'];
-    const Calendar = JSX(({ today, currentMonth, currentYear, min, max, onDateSelect = noop }) => {
-        const handleDateClick = useCallback((date) => onDateSelect(date), []);
-        const { firstDayOfWeek, totalDays } = useMemo(() => ({
-            firstDayOfWeek: new Date(currentYear, currentMonth, 1).getDay() - 1,
-            totalDays: new Date(currentYear, currentMonth + 1, 0).getDate(),
-        }), [currentYear, currentMonth]);
-        return (jsxs("table", { className: "mx-auto", children: [jsx("thead", { className: "text-gray font-light", children: jsx("tr", { children: WEEK_DAYS.map((day, index) => (jsx("th", { className: "p-s", children: day }, String(index)))) }) }), jsx("tbody", { children: renderCalendarCells({
-                        firstDayOfWeek,
-                        today,
-                        totalDays,
-                        currentYear,
-                        currentMonth,
-                        min,
-                        max,
-                        onDateClick: handleDateClick,
-                    }) })] }));
-    });
-
-    const months = [
-        'Январь',
-        'Февраль',
-        'Март',
-        'Апрель',
-        'Май',
-        'Июнь',
-        'Июль',
-        'Август',
-        'Сентябрь',
-        'Октябрь',
-        'Ноябрь',
-        'Декабрь',
-    ];
-
-    const START_YEAR = 1940;
-    const getYears = () => Array.from({ length: new Date().getFullYear() - START_YEAR + 1 }, (_, i) => START_YEAR + i);
-
-    const MONTHS_COUNT = 11;
-    const MONTHS_OPTIONS = months.map((key) => ({ key }));
-    const YEARS_OPTIONS = getYears()
-        .reverse()
-        .map((key) => ({ key: String(key) }));
-    const useDatePickerManager = ({ onShowCalendar, showCalendar, selectedMonth, onMonthSelect, onYearSelect, selectedYear, }) => {
-        const close = useCallback(() => showCalendar && onShowCalendar(false), [showCalendar]);
-        const ref = useOutsideClick(close);
-        const handleChangeVisibleCalendar = useCallback(() => onShowCalendar(!showCalendar), [showCalendar]);
-        const handleNextMonth = useCallback(() => {
-            if (selectedMonth + 1 <= MONTHS_COUNT) {
-                onMonthSelect(selectedMonth + 1);
-            }
-            else {
-                onMonthSelect(0);
-                onYearSelect(selectedYear + 1);
-            }
-        }, [selectedMonth]);
-        const handlePrevMonth = useCallback(() => {
-            if (selectedMonth - 1 >= 0) {
-                onMonthSelect(selectedMonth - 1);
-            }
-            else {
-                onMonthSelect(11);
-                onYearSelect(selectedYear - 1);
-            }
-        }, [selectedMonth]);
-        const handleSelectMonth = useCallback(({ key }) => onMonthSelect(months.indexOf(key)), []);
-        const handleSelectYear = useCallback(({ key }) => onYearSelect(Number(key)), []);
-        return {
-            handleChangeVisibleCalendar,
-            handleNextMonth,
-            handlePrevMonth,
-            handleSelectMonth,
-            handleSelectYear,
-            monthsOptions: MONTHS_OPTIONS,
-            yearsOptions: YEARS_OPTIONS,
-            ref,
+    const handleSubmitIndividual = (formState, onSubmit) => {
+        const feedbackValidator = objectValidator({
+            ...feedbackValidatorDefaultObject,
+            addressBranch: defaultValidator,
+        });
+        const { region, phone, secondaryPhone } = formState;
+        const submitData = {
+            ...formState,
+            typeForm: formState.typeForm.key,
+            addressBranch: formState.addressBranch?.text || '',
+            feedbackMethod: formState.feedbackMethod.text,
+            regionBranch: region?.text,
+            phoneNumber: phone.replace(/[^+\d]/g, ''),
+            secondaryPhoneNumber: secondaryPhone,
         };
+        isValidationSuccess(feedbackValidator(formState)) && onSubmit(submitData);
     };
-
-    const ICON_PROPS = {
-        name: 'ArrowUpIcon',
-        iconVersion: 'black',
-        width: '24',
-        height: '24',
-    };
-    const SELECT_PROPS = {
-        className: 'min-w-32',
-        iconVersion: 'black',
-        isBorder: false,
+    const handleSubmitLegal = (formState, onSubmit) => {
+        const feedbackValidator = objectValidator({
+            ...feedbackValidatorDefaultObject,
+            addressBranch: defaultValidator,
+            inn: innValidator,
+        });
+        const { secondaryPhone, email } = formState;
+        const submitData = {
+            ...formState,
+            typeForm: formState.typeForm.key,
+            region: formState.region?.text,
+            addressBranch: formState.addressBranch?.text || '',
+            feedbackMethod: formState.feedbackMethod.text,
+            phone: formState.phone.replace(/[^+\d]/g, ''),
+            secondaryPhoneNumber: secondaryPhone,
+            mail: email,
+        };
+        isValidationSuccess(feedbackValidator(formState)) && onSubmit(submitData, true);
     };
-    const formStyle = 'flex justify-between items-center h-14 px-m py-s border rounded-md cursor-pointer ' +
-        'hover:border-black active:border-black focus:border-black';
-    const DatePicker = JSX(({ className = '', label = '', value, valid = true, minDate, maxDate, onChange }) => {
-        const [showCalendar, { setValue }] = useBool(false);
-        const [selectedMonth, setSelectedMonth] = useState(value?.getMonth() || new Date().getMonth());
-        const [selectedYear, setSelectedYear] = useState(value?.getFullYear() || new Date().getFullYear());
-        const { handlePrevMonth, handleNextMonth, handleSelectMonth, handleSelectYear, monthsOptions, yearsOptions, handleChangeVisibleCalendar, ref, } = useDatePickerManager({
-            onYearSelect: setSelectedYear,
-            onMonthSelect: setSelectedMonth,
-            onShowCalendar: setValue,
-            selectedYear,
-            selectedMonth,
-            showCalendar,
+    const handleSubmitQuestion = (formState, onSubmit) => {
+        const feedbackValidator = objectValidator({
+            ...feedbackValidatorDefaultObject,
+            birthday: defaultValidator,
         });
-        return (jsxs("div", { className: style(className, 'relative'), ref: ref, children: [jsx(Text, { size: "text-m", "font-weight": "font-light", children: label }), renderDatePickerForm(handleChangeVisibleCalendar, value, valid), showCalendar ? (jsxs("div", { className: "absolute bg-white z-20 select-none", children: [jsxs("div", { className: "flex gap-s", children: [jsx("div", { className: "my-auto", onClick: handlePrevMonth, children: jsx(Icon, { ...ICON_PROPS, className: "-rotate-90 cursor-pointer" }) }), jsx(Select, { onChange: handleSelectMonth, value: { key: months[selectedMonth] }, options: monthsOptions, ...SELECT_PROPS }), jsx(Select, { onChange: handleSelectYear, value: { key: String(selectedYear) }, options: yearsOptions, ...SELECT_PROPS }), jsx("div", { className: "my-auto", onClick: handleNextMonth, children: jsx(Icon, { ...ICON_PROPS, className: "rotate-90 cursor-pointer" }) })] }), jsx(Calendar, { today: value, currentMonth: selectedMonth, currentYear: selectedYear, onDateSelect: onChange, min: minDate, max: maxDate })] })) : null] }));
-    });
-    const renderDatePickerForm = (handleChangeVisibleCalendar, value, valid) => (jsxs("div", { onClick: handleChangeVisibleCalendar, className: style(formStyle, valid ? 'border-gray' : 'border-error'), children: [jsx(Paragraph, { children: value && formatDate(value) }), jsx(Icon, { ...ICON_PROPS, name: "CalendarIcon" })] }));
-
-    const DatePickerControl = JSX(({ className, label, value = undefined, error, onChange }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [label ? (jsx("div", { className: "mb-xs", children: jsx(Text, { size: "text-m", font: "font-light", children: label }) })) : null, jsx(DatePicker, { value: value, onChange: onChange, valid: Boolean(!error) }), renderErrorText(error)] })));
-
-    const renderUserData = (field) => (jsxs("div", { children: [jsx(InputControl, { label: "\u0424\u0430\u043C\u0438\u043B\u0438\u044F*", ...withValidator(field('surname'), nameValidator) }), jsx(InputControl, { label: "\u0418\u043C\u044F*", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { label: "\u041E\u0442\u0447\u0435\u0441\u0442\u0432\u043E (\u041E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E, \u043F\u0440\u0438 \u043D\u0430\u043B\u0438\u0447\u0438\u0438)", ...field('middleName') }), jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F*", ...withValidator(field('birthday'), defaultValidator) })] }));
+        const { region, phone } = formState;
+        const submitData = {
+            ...formState,
+            typeForm: formState.typeForm.key,
+            feedbackMethod: formState.feedbackMethod.text,
+            regionBranch: region?.text,
+            phoneNumber: phone.replace(/[^+\d]/g, ''),
+        };
+        isValidationSuccess(feedbackValidator(formState)) && onSubmit(submitData);
+    };
 
     const initialFormState$2 = {
         typeForm: { key: 'FEEDBACK', text: 'Задать вопрос по продуктам и услугам' },
@@ -1647,32 +1743,18 @@
         comment: '',
         consentDataProcessing: false,
     };
-    const feedbackValidator = objectValidator({
-        typeForm: defaultValidator,
-        region: defaultValidator,
-        department: defaultValidator,
-        name: nameValidator,
-        birthday: defaultValidator,
-        feedbackMethod: defaultValidator,
-        phone: phoneValidator,
-        email: defaultValidator,
-        consentDataProcessing: consentDataProcessingValidator,
-        inn: innValidator,
-    });
     const ApplicationFormFeedback = JSX(({ button, link, onSubmit }) => {
-        const handleSubmit = useCallback((formState) => {
-            const { typeForm, region, department, phone, email, inn, fullName, feedbackMethod, ...usedFields } = formState;
-            const submitData = {
-                ...usedFields,
-                typeForm: typeForm.key,
-                department: department?.text || '',
-                feedbackMethod: feedbackMethod.text,
-                [isLegalEntity ? 'region' : 'regionBranch']: region?.text,
-                [isLegalEntity ? 'phone' : 'phoneNumber']: phone.replace(/[^+\d]/g, ''),
-                [isLegalEntity ? 'mail' : 'email']: email,
-                ...(isLegalEntity ? { inn, fullName } : {}),
-            };
-            isValidationSuccess(feedbackValidator(formState)) && onSubmit(submitData, isLegalEntity);
+        const handleSubmit = useCallback((feedbackFormState) => {
+            const isLegal = getLegalEntity(feedbackFormState.typeForm.key, feedbackFormState.serviceDirection?.key);
+            if (isLegal) {
+                handleSubmitLegal(feedbackFormState, onSubmit);
+            }
+            else if (feedbackFormState.typeForm.key === 'FEEDBACK') {
+                handleSubmitQuestion(feedbackFormState, onSubmit);
+            }
+            else {
+                handleSubmitIndividual(feedbackFormState, onSubmit);
+            }
         }, [onSubmit]);
         const [formState, { field, ...formProps }] = useForm(initialFormState$2, handleSubmit);
         const branch = useGetRegions();
@@ -1682,7 +1764,7 @@
         return (jsx("form", { className: formStyle$1, onSubmit: formProps.onSubmit, children: jsx(ApplicationFieldsetLayout, { firstChildren: jsxs("div", { className: "w-full max-w-xl space-y-s m-auto", children: [jsx(SelectControl, { label: "\u0422\u0435\u043C\u0430*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0442\u0435\u043C\u0443", options: FEEDBACK_TYPES, ...withValidator(field('typeForm'), defaultValidator) }), isQualityService ? (jsx(SelectControl, { label: "\u041D\u0430\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u0438\u0435 \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u044F*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043D\u0430\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u0438\u0435", options: SERVICE_DIRECTIONS, ...withValidator(field('serviceDirection'), defaultValidator) })) : null, jsx(SelectControl, { label: "\u0424\u0438\u043B\u0438\u0430\u043B \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u044F*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0438\u043B\u0438\u0430\u043B", isSearch: true, options: branch.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }), isQualityService ? (jsx(SelectControl, { label: "\u0410\u0434\u0440\u0435\u0441*", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0430\u0434\u0440\u0435\u0441", options: regions.map(({ branchCode = '', address = '' }) => ({
                                 key: branchCode,
                                 text: address,
-                            })), ...withValidator(field('department'), defaultValidator) })) : null, renderUserData(field), isLegalEntity ? (jsxs("div", { children: [jsx(InputControl, { label: "\u0418\u041D\u041D*", ...withValidator(field('inn'), innValidator) }), jsx(InputControl, { label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", ...field('fullName') })] })) : null, jsx(SelectControl, { label: "\u0421\u043F\u043E\u0441\u043E\u0431 \u043F\u043E\u043B\u0443\u0447\u0435\u043D\u0438\u044F \u043E\u0442\u0432\u0435\u0442\u0430*", options: FEEDBACK_METHOD, ...withValidator(field('feedbackMethod'), defaultValidator) }), jsx(PhoneInputControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D*", ...withValidator(field('phone'), phoneValidator) }), isQualityService ? (jsxs("div", { children: [jsx(InputControl, { label: "\u0414\u043E\u043F\u043E\u043B\u043D\u0438\u0442\u0435\u043B\u044C\u043D\u044B\u0439 \u0442\u0435\u043B\u0435\u0444\u043E\u043D", ...field('secondaryPhoneNumber') }), jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430*", ...withValidator(field('email'), defaultValidator) }), jsx(InputControl, { label: "\u0424\u0418\u041E \u0438\u043B\u0438 \u0434\u043E\u043B\u0436\u043D\u043E\u0441\u0442\u044C \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u0432\u0448\u0435\u0433\u043E \u0412\u0430\u0441 \u0441\u043E\u0442\u0440\u0443\u0434\u043D\u0438\u043A\u0430 \u0411\u0430\u043D\u043A\u0430", ...field('bankEmpolee') }), jsx(InputControl, { label: "\u0414\u0430\u0442\u0430 \u0438 \u0432\u0440\u0435\u043C\u044F \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u044F \u0432 \u0411\u0430\u043D\u043A", ...field('applicationDate') })] })) : (jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430*", ...withValidator(field('email'), defaultValidator) })), jsx(InputControl, { ...withValidator(field('comment'), defaultValidator), placeholder: "\u0412\u0430\u0448\u0435 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435*", isTextarea: true }), renderAgreementWithSubmit(field('consentDataProcessing'), link, button)] }) }) }));
+                            })), ...withValidator(field('addressBranch'), defaultValidator) })) : null, renderUserData(field), isLegalEntity ? (jsxs("div", { children: [jsx(InputControl, { label: "\u0418\u041D\u041D*", ...withValidator(field('inn'), innValidator) }), jsx(InputControl, { label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", ...field('fullName') })] })) : null, jsx(SelectControl, { label: "\u0421\u043F\u043E\u0441\u043E\u0431 \u043F\u043E\u043B\u0443\u0447\u0435\u043D\u0438\u044F \u043E\u0442\u0432\u0435\u0442\u0430*", options: FEEDBACK_METHOD, ...withValidator(field('feedbackMethod'), defaultValidator) }), jsx(PhoneInputControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D*", ...withValidator(field('phone'), phoneValidator) }), isQualityService ? (jsxs("div", { children: [jsx(InputControl, { label: "\u0414\u043E\u043F\u043E\u043B\u043D\u0438\u0442\u0435\u043B\u044C\u043D\u044B\u0439 \u0442\u0435\u043B\u0435\u0444\u043E\u043D", ...field('secondaryPhone') }), jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430*", ...withValidator(field('email'), defaultValidator) }), jsx(InputControl, { label: "\u0424\u0418\u041E \u0438\u043B\u0438 \u0434\u043E\u043B\u0436\u043D\u043E\u0441\u0442\u044C \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u0432\u0448\u0435\u0433\u043E \u0412\u0430\u0441 \u0441\u043E\u0442\u0440\u0443\u0434\u043D\u0438\u043A\u0430 \u0411\u0430\u043D\u043A\u0430", ...field('bankEmpolee') }), jsx(InputControl, { label: "\u0414\u0430\u0442\u0430 \u0438 \u0432\u0440\u0435\u043C\u044F \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u044F \u0432 \u0411\u0430\u043D\u043A", ...field('applicationDate') })] })) : (jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430*", ...withValidator(field('email'), defaultValidator) })), jsx(InputControl, { ...withValidator(field('comment'), defaultValidator), placeholder: "\u0412\u0430\u0448\u0435 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435*", isTextarea: true }), renderAgreementWithSubmit(field('consentDataProcessing'), link, button)] }) }) }));
     });
     const getLegalEntity = (typeFormKey = '', serviceDirectionKey = '') => typeFormKey === 'FEEDBACK_QS' && serviceDirectionKey === 'Юридическое лицо / ИП';
 
@@ -1818,6 +1900,7 @@
         ApplicationFormGrantSupport,
         ApplicationFormIndividuals,
         ApplicationFormFeedback,
+        ApplicationFormAntiFraud,
     };
 
     const ResponseNotification = JSX(({ responseType }) => {
@@ -1831,7 +1914,7 @@
     const ApplicationForm = JSX((props) => {
         const { className, formBlock, ...rest } = props;
         const [responseType, setResponseType] = useState('');
-        const handleSubmit = useCallback(async (data, isIndividualType) => {
+        const handleSubmit = useCallback(async (data, isIndividualType = false) => {
             const status = (await API.send(data, isIndividualType)) ? 'OK' : 'Fail';
             setResponseType(status);
             return status;
@@ -5521,7 +5604,7 @@
 
     const joinList = (sep) => (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: `sep-${i}` }, el) : [el]), []);
 
-    const packageVersion = "0.14.134";
+    const packageVersion = "0.14.135";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;