@redneckz/wildless-cms-uni-blocks 0.14.666 → 0.14.667

package/bundle/bundle.umd.js

@@ -1504,6 +1504,7 @@
         feedbackMethod: defaultSelectValidator(),
         serviceType: defaultSelectValidator(),
         serviceDirection: defaultSelectValidator(),
+        regionRetail: defaultSelectValidator('Выберите регион'),
         meetingDay: defaultValidator(),
         product: defaultValidator(),
         localities: defaultValidator(),
@@ -1538,7 +1539,6 @@
         legalEntityName: defaultValidator(),
         bankEmployeeCode: defaultValidator(),
         partInBusiness: defaultValidator(),
-        regionRetail: defaultSelectValidator('Выберите филиал банка'),
         addressRetail: defaultSelectValidator('Выберите адрес банка'),
         addressMatch: defaultValidator(),
         codeWord: codeWordValidator('Необходимо ввести кодовое слово'),
@@ -1796,1458 +1796,1474 @@
         return (jsx(CheckboxWithError, { text: "\u0410\u0434\u0440\u0435\u0441 \u0444\u0430\u043A\u0442\u0438\u0447\u0435\u0441\u043A\u043E\u0433\u043E \u043C\u0435\u0441\u0442\u0430 \u0436\u0438\u0442\u0435\u043B\u044C\u0441\u0442\u0432\u0430 \u0441\u043E\u0432\u043F\u0430\u0434\u0430\u0435\u0442 \u0441 \u0430\u0434\u0440\u0435\u0441\u043E\u043C \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438", ...getValidation(field('addressMatch'), validatorObj.addressMatch, input?.required) }));
     });
 
-    const useNormalizedInput = (props, { normalize, format }) => {
-        const { value, onFocus, onBlur, onChange } = props;
-        const [isFocused, setIsFocused] = useState(false);
-        const handleFocus = useCallback((ev) => {
-            setIsFocused(true);
-            onFocus && onFocus(ev);
-        }, []);
-        const handleBlur = useCallback(() => {
-            setIsFocused(false);
-            onChange && onChange(normalize(value));
-            onBlur && onBlur();
-        }, [onChange, value]);
-        return {
-            value: (isFocused || !format ? value : format(value)),
-            onFocus: handleFocus,
-            onBlur: handleBlur,
-        };
-    };
-
-    const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
-
-    function parseDecimal(value) {
-        const rawValue = (value || '').replace(/\D/g, '');
-        const unsafeDecimal = parseInt(rawValue, 10);
-        return Number.isNaN(unsafeDecimal) ? 0 : unsafeDecimal;
-    }
+    const Loader = JSX(({ color = 'text-primary-main', position = 'absolute', blur = true }) => (jsx("div", { className: style('flex justify-center items-center h-full w-full z-50', position, {
+            'backdrop-blur': blur,
+        }), children: jsx("div", { className: style('inline-block h-28 w-28', 'animate-spin rounded-full', 'border-8 border-solid border-current', 'border-r-transparent', color), role: "status" }) })));
 
-    function renderRangeWithTicks({ list = [], min, max, step, value = list[0] || min, disabled, onChange, }) {
-        const rangeValue = list.length ? list.indexOf(value) : value;
-        const rangeValueShift = rangeValue > min ? rangeValue - min : 0;
-        const percentage = (rangeValueShift * 100) / (max - min);
-        const inputStyle = {
-            backgroundSize: `${percentage.toFixed(2)}% 100%`,
-        };
-        return (jsxs("div", { children: [list.length ? (jsx("div", { className: "absolute w-full flex justify-between -bottom-[3px] px-m", children: list.map((_, i) => (jsx("div", { className: style('w-2 h-2 rounded-full', rangeValue <= i || disabled ? 'bg-gray' : 'bg-primary-main') }, String(i)))) })) : null, jsx("div", { className: "absolute inset-x-0 -bottom-1 px-m leading-[18px]", children: jsx("input", { className: "box-border w-full m-0 cursor-pointer slider relative z-10", style: inputStyle, type: "range", min: min, max: max, step: step, value: rangeValue, disabled: disabled, onChange: ((ev) => {
-                            const rawValue = parseDecimal(ev.target?.value);
-                            const newValue = list.length ? list[rawValue] : rawValue;
-                            onChange && onChange(newValue || 0);
-                        }) }) })] }));
+    const MapMarkerClusterIcon = '/icons/MapMarkerClusterIcon.svg';
+    const MapMarkerClusterYellowIcon = '/icons/MapMarkerClusterYellowIcon.svg';
+    function renderClusterer({ yandexMaps, map, points, isLoad, }) {
+        if (isLoad || !points) {
+            return;
+        }
+        map.geoObjects.removeAll();
+        if (!points.length) {
+            return;
+        }
+        const clusterIconContentLayout = yandexMaps.templateLayoutFactory.createClass('<div style="margin-top: -3px;">{{properties.geoObjects.length}}</div>');
+        const officeClusterer = defineClusterer('offices', yandexMaps, clusterIconContentLayout);
+        if (points.length && points.every((_) => 'type' in _)) {
+            const remoteWorkplaceClusterer = defineClusterer('workplaces', yandexMaps, clusterIconContentLayout);
+            const remoteWorkplaceGeoObjects = defineGeoObjects(points.filter((_) => _.type === 'workplaces'), 'workplaces', yandexMaps);
+            const officesGeoObjects = defineGeoObjects(points.filter((_) => _.type === 'offices'), 'offices', yandexMaps);
+            officeClusterer.add(officesGeoObjects);
+            remoteWorkplaceClusterer.add(remoteWorkplaceGeoObjects);
+            map.geoObjects.add(remoteWorkplaceClusterer);
+            map.geoObjects.add(officeClusterer);
+        }
+        else {
+            const geoObjects = defineGeoObjects(points, 'offices', yandexMaps);
+            officeClusterer.add(geoObjects);
+            map.geoObjects.add(officeClusterer);
+        }
+        map.setBounds(yandexMaps.util.bounds.fromPoints(points.map((_) => _.coords))).then(() => {
+            if (map.getZoom() > 10) {
+                map.setZoom(10);
+            }
+        });
     }
-
-    const inputDisabledStyle = 'disabled:border-gray disabled:bg-main-divider';
-    const DEFAULT_MIN = 1;
-    const DEFAULT_MAX = 100;
-    const InputRange = JSX((props) => {
-        const { className, title, items = [], list = [], min = list.length ? 0 : DEFAULT_MIN, max = list.length ? list.length - 1 : DEFAULT_MAX, step = 1, value = list[0] || min, disabled = false, onChange, } = props;
-        const normalizedProps = useNormalizedInput(props, {
-            normalize: (_ = 0) => list.length ? closestValue(list)(_) : clamp(_, min, max),
-            format: toLocalNumberFormat(),
+    const defineClusterer = (type, yandexMaps, clusterIconContentLayout) => {
+        return new yandexMaps.Clusterer({
+            clusterIcons: [
+                {
+                    href: type === 'offices' ? MapMarkerClusterIcon : MapMarkerClusterYellowIcon,
+                    size: [78, 84],
+                    offset: [-35, -50],
+                },
+            ],
+            clusterIconContentLayout,
+            clusterHideIconOnBalloonOpen: false,
+            geoObjectHideIconOnBalloonOpen: false,
         });
-        const handleChange = useCallback((ev) => {
-            onChange && onChange(parseDecimal(ev.target?.value));
-        }, [onChange]);
-        return (jsxs("div", { className: className, children: [jsxs("label", { className: "block relative", children: [title ? (jsx(Text, { size: "text-m", font: "font-light", color: "text-primary-text", children: title })) : null, jsx("input", { className: style('text-h3 w-full h-14', 'pl-m mt-xs box-border', 'text-primary-text', inputValidStyle, inputDisabledStyle), disabled: disabled, onChange: handleChange, ...normalizedProps }), renderRangeWithTicks({ list, min, max, step, disabled, value, onChange })] }), renderRangeCaption(items)] }));
-    });
-    const closestValue = (list) => (_) => list.reduce((prev, curr) => (Math.abs(curr - _) < Math.abs(prev - _) ? curr : prev));
-    const renderRangeCaption = (items) => (jsx("div", { className: "flex justify-between my-xs", children: items.map((item, i) => (jsx(Text, { size: "text-s", font: "font-light", color: "text-secondary-text", children: item }, String(i)))) }));
-
-    const MIN_CREDIT_AMOUNT = 1000;
-    const MAX_CREDIT_AMOUNT = 1000000000;
-    const ITEMS_CREDIT_AMOUNT = ['От 1 000 ₽', 'До 1 000 000 000 ₽'];
-    const AmountField = JSX(({ field }) => (jsx(InputRange, { title: "\u0421\u0443\u043C\u043C\u0430, \u20BD", items: ITEMS_CREDIT_AMOUNT, min: MIN_CREDIT_AMOUNT, max: MAX_CREDIT_AMOUNT, ...field('amount') })));
-
-    const useLeadFormData = (typeField) => {
-        const { data, error } = useAsyncData(`/api/v1/dictionary?dictionaryType=${encodeURIComponent(typeField)}`, fetchData);
-        if (data && 'errorMessage' in data) {
-            return { error };
-        }
-        return { data: data, error };
     };
-    const fetchData = async (url) => {
-        const result = await fetchJSON(url, { method: 'POST' });
-        return result || [];
+    const defineGeoObjects = (pointArr, type, yandexMaps) => {
+        return pointArr.map(({ coords, content }) => new yandexMaps.Placemark(coords, {
+            balloonContentHeader: content?.header,
+            balloonContentBody: content?.body,
+            balloonContentFooter: content?.footer,
+            hintContent: content?.hint,
+        }, {
+            iconLayout: 'default#image',
+            iconImageHref: type === 'offices' ? MapMarkerClusterIcon : MapMarkerClusterYellowIcon,
+            iconImageSize: [78, 84],
+            iconImageOffset: [-35, -50],
+        }));
     };
 
-    const SelectField = UniBlock(({ field, source, label, fieldName, input }) => {
-        const leadOptions = (source &&
-            source?.map((_) => ({
-                key: _.key || '',
-                text: _.value,
-            }))) ||
-            [];
-        return (jsx(SelectControl, { placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0438\u0437 \u0441\u043F\u0438\u0441\u043A\u0430", label: label, options: leadOptions, ...getValidation(field(fieldName), validatorObj[fieldName], input?.required) }));
-    });
-
-    const AmountWorkersField = JSX(({ field, input }) => {
-        const { data: amountWorkers } = useLeadFormData('EMPLOYEES_NUMBER');
-        return (jsx(SelectField, { field: field, source: amountWorkers, label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0440\u0430\u0431\u043E\u0442\u0430\u044E\u0449\u0438\u0445 \u0432 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", fieldName: "amountWorkers", input: input }));
-    });
-
-    const AnnualRevenueField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0413\u043E\u0434\u043E\u0432\u0430\u044F \u0432\u044B\u0440\u0443\u0447\u043A\u0430, \u20BD", ...getValidation(field('annualRevenue'), validatorObj.annualRevenue, input?.required) })));
-
-    const ArmyIdFlgField = JSX(({ field, input }) => (jsx(CheckboxWithError, { text: "\u041D\u0430\u043B\u0438\u0447\u0438\u0435 \u0432\u043E\u0435\u043D\u043D\u043E\u0433\u043E \u0431\u0438\u043B\u0435\u0442\u0430", ...getValidation(field('armyIdFlg'), validatorObj.armyIdFlg, input?.required) })));
-
-    const BankEmpoleeCodeField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u0434 \u043F\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u0435\u043B\u044F \u0411\u0430\u043D\u043A\u0430", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u043E\u0434", type: "number", ...getValidation(field('bankEmployeeCode'), validatorObj.bankEmployeeCode, input?.required), ...input })));
-
-    const BankEmpoleeField = JSX(({ field }) => (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') })));
+    const defaultStyle = {
+        focus: 'focus:border-primary-text focus:border',
+        hover: 'hover:bg-primary-hover',
+        active: 'active:bg-primary-active',
+        font: 'text-center font-sans',
+    };
 
-    const BankruptcyFlgField = JSX(({ field, input }) => (jsx(CheckboxWithError, { text: "\u0412 \u043E\u0442\u043D\u043E\u0448\u0435\u043D\u0438\u0438 \u043C\u0435\u043D\u044F \u0432\u0435\u0434\u0451\u0442\u0441\u044F \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u0434\u0441\u0442\u0432\u043E \u043F\u043E \u0434\u0435\u043B\u0443 \u043E \u0431\u0430\u043D\u043A\u0440\u043E\u0442\u0441\u0442\u0432\u0435", ...getValidation(field('bankruptcyFlg'), validatorObj.bankruptcyFlg, input?.required) })));
+    const styles$1 = {
+        ...defaultStyle,
+        border: 'border border-transparent rounded-md',
+        position: 'absolute flex items-center justify-center',
+    };
+    const renderUserGeolocation = (map, yandexMaps, className) => {
+        const setUserGeoLocation = () => {
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            yandexMaps.geolocation
+                .get({
+                provider: 'yandex',
+                autoReverseGeocode: true,
+                mapStateAutoApply: true,
+            })
+                .then(function (result) {
+                map.current.geoObjects.add(result.geoObjects);
+            });
+        };
+        return (jsx("div", { className: `select-none cursor-pointer py-m w-12 bg-white ${Object.values(styles$1).join(' ')} ${className}`, onClick: setUserGeoLocation, children: jsx(Icon, { name: "UserGeoLocationIcon", width: "20", height: "16" }) }));
+    };
 
-    const useElementSpace = (ref, heightEl) => {
-        const [spaceAbove, setSpaceAbove] = useState(false);
+    const getNS = (_) => globalThis[_];
+    const initializeExternalNS = (namespaceName, url) => {
+        const script = document.getElementById(url);
+        if (script) {
+            const ns = getNS(namespaceName);
+            if (ns) {
+                return Promise.resolve(ns);
+            }
+            else {
+                return new Promise((resolve) => {
+                    script.addEventListener('load', () => {
+                        resolve(getNS(namespaceName));
+                    });
+                });
+            }
+        }
+        else {
+            return new Promise((resolve, reject) => {
+                const newScript = document.createElement('script');
+                newScript.src = url;
+                newScript.async = true;
+                newScript.id = url;
+                newScript.addEventListener('load', () => {
+                    resolve(getNS(namespaceName));
+                });
+                newScript.addEventListener('error', (error) => {
+                    reject(error);
+                });
+                document.head.appendChild(newScript);
+            });
+        }
+    };
+    function useExternalNS(namespaceName, url, unmountNS = true) {
+        const [externalNS, setExternalNS] = useState(undefined);
         useEffect(() => {
-            const handleResize = () => {
-                if (ref?.current) {
-                    const { top } = ref.current.getBoundingClientRect();
-                    const hasSpaceAbove = top > heightEl;
-                    setSpaceAbove(hasSpaceAbove);
+            let isMounted = true;
+            initializeExternalNS(namespaceName, url)
+                .then((ns) => {
+                if (isMounted) {
+                    setExternalNS(ns);
+                }
+            })
+                .catch((error) => {
+                console.error(`Failed to initialize external namespace: ${error}`);
+            });
+            return () => {
+                isMounted = false;
+                if (unmountNS) {
+                    const script = document.getElementById(url);
+                    if (script) {
+                        document.head.removeChild(script);
+                    }
+                    setExternalNS(undefined);
                 }
             };
-            handleResize();
-            window.addEventListener('resize', handleResize);
-            return () => window.removeEventListener('resize', handleResize);
-        }, [ref]);
-        return spaceAbove;
+        }, [namespaceName, url, unmountNS]);
+        return externalNS;
+    }
+
+    const YMAPS_NAMESPACE = 'ymaps';
+    const useYandexMaps = () => {
+        const url = `https://api-maps.yandex.ru/2.1/?apikey=${projectSettings.YANDEX_MAP_API_KEY || ''}&lang=ru_RU`;
+        return useExternalNS(YMAPS_NAMESPACE, url, false);
     };
 
-    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 styles = {
+        ...defaultStyle,
+        border: 'border-b border-b-2 border-gray last:border-0',
+        position: 'relative flex items-center justify-center',
     };
-    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 = false, isDisabled = false) => style('p-s text-center rounded-md border', {
-        'border-transparent hover:bg-gray': !isToday,
-    }, isDisabled ? 'text-gray hover:bg-transparent' : 'cursor-pointer');
-
-    const WEEK_DAYS = ['Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб', 'Вс'];
-    const Calendar = JSX(({ today, currentMonth, currentYear, min, max, onDateSelect = noop, setValue = noop }) => {
-        const handleDateClick = useCallback((date) => {
-            onDateSelect(date);
-            setValue(false);
-        }, []);
-        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,
-                    }) })] }));
+    // TODO: Добавить метод определения центральной точки
+    const ZoomButton = JSX(({ yandexMaps, direction = 'in' }) => {
+        const iconName = direction === 'in' ? 'PlusIcon' : 'MinusIcon';
+        const changeZoom = () => {
+            const currentZoom = yandexMaps.current.getZoom();
+            const newZoom = direction === 'in' ? currentZoom + 1 : currentZoom - 1;
+            yandexMaps.current.setZoom(newZoom, { checkZoomRange: true });
+        };
+        return (jsx("div", { onClick: changeZoom, className: `${Object.values(styles).join(' ')} bg-white select-none cursor-pointer w-12 h-12`, children: jsx(Icon, { name: iconName, width: "20", height: "16" }) }));
     });
 
-    const months = [
-        'Январь',
-        'Февраль',
-        'Март',
-        'Апрель',
-        'Май',
-        'Июнь',
-        'Июль',
-        'Август',
-        'Сентябрь',
-        'Октябрь',
-        'Ноябрь',
-        'Декабрь',
-    ];
-
-    function normalizeWithMask(value, pattern) {
-        const valueNumbers = value.replace(/\D/g, '');
-        if (valueNumbers === '' || value?.length === pattern.length) {
-            return value;
-        }
-        const patternInArr = [...pattern];
-        const firstPlaceholderIndex = patternInArr.findIndex(isPlaceholder$1);
-        const valueWildcardIndicies = patternInArr.map((_, i) => isWildcard$1(_) ? patternInArr.slice(0, i).filter(isWildcard$1).length : -1);
-        const applyPlaceholder = (_, i) => isDigit$1(_) ? _ : valueNumbers.charAt(valueWildcardIndicies[i]) || _;
-        const resultInArr = patternInArr.map(applyPlaceholder);
-        const resultLength = valueWildcardIndicies.indexOf(valueNumbers.length - 1) + 1;
-        return resultInArr.slice(0, Math.max(firstPlaceholderIndex, resultLength)).join('');
-    }
-    const isPlaceholder$1 = (_) => _ === '_';
-    const isDigit$1 = (_) => /\d/.test(_);
-    const isWildcard$1 = (_) => isPlaceholder$1(_) || isDigit$1(_);
-
-    const START_YEAR = 1940;
-    const getYears = () => Array.from({ length: new Date().getFullYear() - START_YEAR + 1 }, (_, i) => START_YEAR + i);
-
-    const ICON_PROPS$1 = {
-        name: 'CalendarIcon',
-        iconVersion: 'black',
-        width: '24',
-        height: '24',
-    };
-    const DatePickerInput = JSX(({ setSelectedMonth, setSelectedYear, className, value, disabled, onChange, onClick }) => {
-        const ref = useRef(null);
-        const [inputValue, setInputValue] = useState(value || '');
-        const handleChange = (ev) => {
-            const val = ev.target?.value;
-            if (typeof val === 'string' && val?.length < 11) {
-                setInputValue(normalizeWithMask(val, '__.__.____'));
-            }
-        };
-        const onBlur = () => {
-            if (checkIsValidDate(inputValue)) {
-                const [day, month, year] = inputValue.split('.');
-                onChange?.(new Date(Number(year), Number(month) - 1, Number(day)));
-                setSelectedMonth(Number(month) - 1);
-                setSelectedYear(Number(year));
+    const DEFAULT_CENTER_COORDS = [55.753995, 37.614069];
+    // TODO: Поле для поиска: невыяснено среди каких данных делать поиск (искать в имени офиса, в адресе, метро и т.д.).
+    //       Сейчас реализован поиск среди тестовых данных
+    // TODO: Также выяснить что делать когда ничего не найдено
+    // TODO: На макетах также когда есть поле поиска нет кнопки открыть на карте.
+    const YandexMap = JSX(({ points, className = '', zoom = 5, isLoad, selectedAddress }) => {
+        const map = useRef(null);
+        const yandexMaps = useYandexMaps();
+        useEffect(() => {
+            if (map.current) {
+                renderClusterer({ yandexMaps, map: map.current, points, isLoad, selectedAddress });
             }
             else {
-                setInputValue(value || '');
-            }
-        };
-        const onInputClick = () => {
-            if (ref.current !== null) {
-                ref.current.focus();
+                yandexMaps?.ready(() => {
+                    // Ready function may be called few times, but must be called once
+                    if (map.current) {
+                        renderClusterer({ yandexMaps, map: map.current, points, isLoad });
+                        return;
+                    }
+                    map.current = new yandexMaps.Map('map', {
+                        center: getCenterPoint(points),
+                        zoom,
+                        controls: [],
+                        suppressMapOpenBlock: true,
+                    });
+                    renderClusterer({ yandexMaps, map: map.current, points, isLoad });
+                });
             }
-            onClick?.();
-        };
+        }, [yandexMaps, points, zoom, isLoad, selectedAddress]);
         useEffect(() => {
-            setInputValue(value || '');
-        }, [value]);
-        return (jsxs("div", { onClick: onInputClick, className: style('relative', className), children: [jsx("input", { ref: ref, className: "h-full w-full px-m text-l text-black focus-visible:outline-none", value: inputValue, type: "text", onChange: handleChange, onBlur: onBlur, disabled: disabled }), disabled ? null : jsx(Icon, { className: "mr-s", ...ICON_PROPS$1 })] }));
-    });
-    const isValidYear = (year) => Number(year) >= START_YEAR && Number(year) <= new Date().getFullYear();
-    const isValidMonth = (month) => Number(month) > 0 && Number(month) < 13;
-    const checkIsValidDate = (date) => {
-        const [day, month, year] = date.split('.');
-        if (isValidYear(year)) {
-            if (isValidMonth(month)) {
-                const currentDate = new Date(Number(year), Number(month) - 1, 1);
-                let maxDateOfMonth = 0;
-                while (currentDate.getMonth() === Number(month) - 1) {
-                    currentDate.setDate(currentDate.getDate() + 1);
-                    maxDateOfMonth++;
-                }
-                if (Number(day) > 0 && Number(day) <= maxDateOfMonth) {
-                    return true;
-                }
+            if (map.current && selectedAddress) {
+                yandexMaps?.geocode(selectedAddress).then((res) => {
+                    const firstGeoObject = res.geoObjects.get(0);
+                    const coords = firstGeoObject.geometry.getCoordinates();
+                    map.current.setCenter(coords);
+                    map.current.setZoom(18);
+                });
             }
+        }, [selectedAddress]);
+        if (!yandexMaps) {
+            return null;
         }
-        return false;
+        const zIndex = 'z-10';
+        return (jsxs("div", { id: "map", className: style('relative', 'w-full', className), children: [isLoad ? jsx(Loader, {}) : null, jsxs("div", { className: style('absolute right-2 top-52 z-10 w-12 overflow-hidden border border-transparent rounded-md', zIndex), children: [jsx(ZoomButton, { yandexMaps: map }), jsx(ZoomButton, { yandexMaps: map, direction: "out" })] }), renderUserGeolocation(map, yandexMaps, style('right-2 top-80', zIndex))] }));
+    });
+    const getCenterPoint = (points) => {
+        const centerCoords = [
+            getArraySumAndAverage(mapByIndex(points, 0)),
+            getArraySumAndAverage(mapByIndex(points, 1)),
+        ];
+        return centerCoords.every((_) => _) ? centerCoords : DEFAULT_CENTER_COORDS;
     };
+    const mapByIndex = (points, index) => points.map((_) => _.coords?.[index]);
+    const getArraySumAndAverage = (arr) => arr.length && arr.reduce((a, b) => a + b) / arr.length;
 
-    const formStyle = 'flex justify-between items-center h-14 border rounded-md cursor-pointer ' +
-        'hover:border-black active:border-black focus:border-black';
-    const renderDatePickerForm = ({ handleChangeVisibleCalendar, value, valid, onChange, setSelectedMonth, setSelectedYear, disabled = false, }) => (jsx(DatePickerInput, { onChange: onChange, disabled: disabled, onClick: handleChangeVisibleCalendar, value: value && formatDate(value), setSelectedMonth: setSelectedMonth, setSelectedYear: setSelectedYear, className: style(formStyle, valid ? 'border-gray' : 'border-error') }));
+    async function doRequest(url, method, body) {
+        const response = await fetch(`${API_BASE_URI}${url}`, {
+            method,
+            headers: {
+                'Content-Type': 'application/json',
+                ...getAuthorizationHeaders(),
+            },
+            credentials: 'include',
+            body: body ? JSON.stringify(body) : null,
+        });
+        // TODO: add error handling
+        return isJSON(response) ? response.json() : response;
+    }
+    // TODO: Need delete isJSON
+    const isJSON = (response) => response.headers.get('Content-Type') === 'application/json';
+    const getAuthorizationHeaders = () => {
+        const token = sessionStorage.getItem('accessToken');
+        return token ? { Authorization: `Bearer ${token}` } : null;
+    };
 
-    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, onChange, value, }) => {
-        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);
+    const regionOffices = async (regionKey) => {
+        const response = await doRequest('/public-data/regionOffices', 'POST', {
+            regionRfCd: {
+                key: regionKey,
+            },
+            cashCardFlg: true,
+        });
+        return await response.json().then((_) => _?.offices?.map((office) => ({
+            ...office,
+            gpsLatitude: (office.latitude ?? DEFAULT_CENTER_COORDS[0]).toString().replace(',', '.'),
+            gpsLongitude: (office.longitude ?? DEFAULT_CENTER_COORDS[1]).toString().replace(',', '.'),
+        })));
+    };
+
+    const Foldable = JSX(({ className = '', isFoldButtonOnTop = false, unfoldedByDefault = false, renderFoldableSection, renderFoldButton, }) => {
+        const [isUnfolded, setIsUnfolded] = useState(unfoldedByDefault);
+        const onToggle = useCallback(() => {
+            setIsUnfolded((_) => !_);
+        }, []);
+        const sectionNode = renderFoldableSection({ isUnfolded, onToggle });
+        const buttonNode = renderFoldButton ? renderFoldButton({ isUnfolded, onToggle }) : null;
+        return isFoldButtonOnTop ? (jsxs("div", { className: className, role: "group", children: [buttonNode, sectionNode] })) : (jsxs("div", { className: className, role: "group", children: [sectionNode, buttonNode] }));
+    });
+
+    function useResizeObserver(callback, deps) {
+        const ref = useRef(null);
+        useEffect(() => {
+            const element = ref?.current;
+            if (!element) {
+                return undefined;
             }
-        }, [selectedMonth]);
-        const handleSelectMonth = useCallback(({ key }) => {
-            onMonthSelect(months.indexOf(key));
-            const maxDateOfMonth = calculateMaxDaysOfMonth(selectedYear, months.indexOf(key));
-            handleChangeMonth({
-                maxDateOfMonth,
-                selectedYear,
-                selectedMonth: months.indexOf(key),
-                value,
-                onChange,
+            const observer = new ResizeObserver((entries) => {
+                callback(element, entries[0]);
             });
-        }, [value]);
-        const handleSelectYear = useCallback(({ key }) => {
-            onYearSelect(Number(key));
-            value && onChange?.(new Date(Number(key), selectedMonth, value?.getDate()));
-        }, [value]);
-        return {
-            handleChangeVisibleCalendar,
-            handleNextMonth,
-            handlePrevMonth,
-            handleSelectMonth,
-            handleSelectYear,
-            monthsOptions: MONTHS_OPTIONS,
-            yearsOptions: YEARS_OPTIONS,
-            ref,
-        };
+            observer.observe(element);
+            return () => {
+                observer.disconnect();
+            };
+        }, [callback, ...deps]);
+        return ref;
+    }
+
+    const FoldableSection = JSX(({ className = '', isUnfolded, children }) => {
+        const containerRef = useRef(null);
+        const childrenWrapperRef = useResizeObserver((childrenWrapperEl) => {
+            if (containerRef.current) {
+                containerRef.current.style.maxHeight = isUnfolded
+                    ? `${childrenWrapperEl.scrollHeight}px`
+                    : '';
+            }
+        }, [isUnfolded]);
+        return (jsx("div", { ref: containerRef, className: `transition-max-h duration-300 overflow-hidden ${containerRef.current || !isUnfolded ? 'max-h-0' : ''} `, children: jsx("div", { className: className, ref: childrenWrapperRef, children: children }) }));
+    });
+
+    const CardCell = JSX(({ value, subText, children, isPhone, ...props }) => {
+        const textItems = (Array.isArray(value) ? value : value?.split(',') ?? []).filter(Boolean);
+        if ([textItems.length, children, subText].every((_) => !_)) {
+            return null;
+        }
+        return renderCardCell({ textItems, subText, children, isPhone, ...props });
+    });
+    const renderCardCell = ({ label, labelSize = 'text-m', textItems, subColor, subText, className, children, isPhone = false, }) => (jsxs("div", { className: style('flex gap-2xs flex-col h-full max-w-[300px]', className), children: [label ? (jsx(Text, { color: "text-secondary-text", font: "font-light", size: labelSize, children: label })) : null, children || renderTextItems(textItems, isPhone), subText ? (jsx(Text, { color: subColor, size: "text-m", children: subText })) : null] }));
+    const renderTextItems = (textItems, isPhone) => textItems.filter(Boolean).map((text, i) => (jsx(Text, { size: "text-l", children: isPhone ? jsx("a", { href: `tel:${cleanPhoneNumber(text)}`, children: text.trim() }) : text.trim() }, String(i))));
+    const cleanPhoneNumber = (phone) => phone.replace(/\D/g, '');
+
+    const CardRow = JSX(({ className, children }) => (jsx("div", { className: style('flex flex-col sm:flex-row sm:border-t sm:border-solid sm:border-main-divider py-xl gap-x-6xl gap-y-xl', className), children: children })));
+
+    const getScheduleDescription = (workScheduleWeek) => {
+        const rows = getDateDescription(workScheduleWeek);
+        return jsx(CardCell, { label: "\u0420\u0435\u0436\u0438\u043C \u0440\u0430\u0431\u043E\u0442\u044B", value: rows, className: "max-w-none" });
     };
-    const calculateMaxDaysOfMonth = (selectedYear, selectedMonth) => {
-        const date = new Date(selectedYear, selectedMonth, 1);
-        let maxDateOfMonth = 0;
-        while (date.getMonth() === selectedMonth) {
-            maxDateOfMonth++;
-            date.setDate(date.getDate() + 1);
+    const buildScheduleText = ({ workTime = '', lunchHour = '', daysOff = '' }, isSaturday = false) => {
+        if (!workTime) {
+            return '';
         }
-        return maxDateOfMonth;
+        return [
+            `${isSaturday ? 'Суббота' : 'Будние дни'}: ${workTime}`,
+            lunchHour ? `перерыв: ${lunchHour}` : '',
+            daysOff ? `не работает: ${daysOff}` : '',
+        ]
+            .filter(Boolean)
+            .join('; ');
     };
-    const handleChangeMonth = ({ maxDateOfMonth, selectedYear, selectedMonth, value, onChange, }) => {
-        value &&
-            onChange?.(new Date(selectedYear, selectedMonth, Math.min(maxDateOfMonth, value.getDate())));
+    const getDateDescription = (workScheduleWeek) => {
+        const workingWeekday = workScheduleWeek.find((_) => _.key !== 'workingSaturday' && Boolean(_.status) && Boolean(_.workTime));
+        const workingSaturday = workScheduleWeek.find((_) => _.key === 'workingSaturday' && Boolean(_.status) && Boolean(_.workTime));
+        const daysOff = workScheduleWeek
+            .filter((_) => !_.status)
+            .map((_) => _.short?.toLowerCase())
+            .join(', ');
+        const rows = [
+            buildScheduleText({
+                workTime: workingWeekday?.workTime,
+                lunchHour: workingWeekday?.lunchHour,
+                daysOff: workingSaturday ? '' : daysOff,
+            }),
+            buildScheduleText({ workTime: workingSaturday?.workTime, lunchHour: workingSaturday?.lunchHour, daysOff }, true),
+        ].filter(Boolean);
+        return rows;
     };
 
-    const ICON_PROPS = {
-        name: 'ArrowUpIcon',
-        iconVersion: 'black',
-        width: '24',
-        height: '24',
+    const WEEKDAY_MAP = [
+        ['workingMonday', 'Пн', 'Понедельник'],
+        ['workingTuesday', 'Вт', 'Вторник'],
+        ['workingWednesday', 'Ср', 'Среда'],
+        ['workingThursday', 'Чт', 'Четверг'],
+        ['workingFriday', 'Пт', 'Пятница'],
+        ['workingSaturday', 'Сб', 'Суббота'],
+        ['workingSunday', 'Вс', 'Воскресенье'],
+    ];
+    const getWorkScheduleWeek = (workSchedule) => WEEKDAY_MAP.map(([key, short, title]) => ({
+        key,
+        title,
+        short,
+        status: Boolean(workSchedule?.[key]),
+        get workTime() {
+            return key === 'workingSaturday' ? workSchedule?.workTimeSaturday : workSchedule?.workTime;
+        },
+        get lunchHour() {
+            return key === 'workingSaturday' ? workSchedule?.lunchHourSaturday : workSchedule?.lunchHour;
+        },
+        get hasLunch() {
+            return /\d+/.test(this.lunchHour ?? '');
+        },
+    }));
+
+    const renderBusinessSchedule = (scheduleDescription) => {
+        if (!scheduleDescription) {
+            return null;
+        }
+        const businessSchedule = getBusinessSchedule(scheduleDescription);
+        return (jsxs(CardRow, { className: "border-none", children: [jsx(CardCell, { label: "\u0414\u043B\u044F \u044E\u0440\u0438\u0434\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", labelSize: "text-l", children: jsx("div", { className: "flex gap-1", children: businessSchedule.map(renderAlternativeDay) }) }), jsx(CardCell, { label: "\u0420\u0435\u0436\u0438\u043C \u0440\u0430\u0431\u043E\u0442\u044B", className: "max-w-none", children: jsx(Text, { children: scheduleDescription }) })] }));
     };
-    const SELECT_PROPS = {
-        className: 'min-w-32',
-        iconVersion: 'black',
-        isBorder: false,
+    const getBusinessSchedule = (scheduleDescription) => {
+        const weekDayMap = WEEKDAY_MAP.map(([, short]) => ({ short, status: true }));
+        const splittedScheduleDescription = scheduleDescription.split('/') ?? [];
+        const lastPartScheduleDescription = splittedScheduleDescription[splittedScheduleDescription.length - 1]?.toLowerCase();
+        if (!lastPartScheduleDescription?.includes('выходной')) {
+            return weekDayMap;
+        }
+        return weekDayMap.map((_) => ({
+            ..._,
+            status: !lastPartScheduleDescription?.includes(_.short.toLowerCase()),
+        }));
     };
-    const DatePicker = JSX(
-    // eslint-disable-next-line max-lines-per-function
-    ({ className = '', label = '', value, valid = true, minDate, maxDate, disabled, 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,
-            onChange,
-            value,
-        });
-        const spaceAbove = useElementSpace(ref, 370);
-        return (jsxs("div", { className: style('space-y-xs', className), ref: ref, children: [renderLabel(label), jsxs("div", { className: "relative", children: [renderDatePickerForm({
-                            handleChangeVisibleCalendar,
-                            value,
-                            valid,
-                            onChange,
-                            disabled,
-                            setSelectedMonth,
-                            setSelectedYear,
-                        }), showCalendar && !disabled ? (jsxs("div", { className: style('absolute bg-white z-20 select-none', {
-                                'bottom-full': spaceAbove,
-                            }), 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, setValue: setValue })] })) : null] })] }));
-    });
+    const renderAlternativeDay = ({ short, status }, i) => (jsx("div", { className: style('w-9 h-9 rounded-md flex items-center justify-center', status ? 'bg-green-more-light text-green-dark' : 'bg-error/30 text-error'), children: jsx(Text, { size: "text-xs", children: short }) }, String(i)));
 
-    const DatePickerControl = JSX(({ className, label, error, errors, ...rest }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(DatePicker, { label: getRequiredLabel({ label, errors }), valid: Boolean(!error), ...rest }), renderErrorText(error)] })));
+    const renderCurrency = ({ currency, buyExchangeRate, saleExchangeRate }, i) => (jsxs("div", { className: "flex gap-lg h-full", children: [currency?.currency ? jsx(CardCell, { label: "\u0412\u0430\u043B\u044E\u0442\u0430", value: currency.currency }) : null, buyExchangeRate ? jsx(CardCell, { label: "\u041A\u0443\u043F\u0438\u0442\u044C", value: String(buyExchangeRate) }) : null, saleExchangeRate ? jsx(CardCell, { label: "\u041F\u0440\u043E\u0434\u0430\u0442\u044C", value: String(saleExchangeRate) }) : null] }, String(i)));
 
-    const BeginDateField = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u043D\u0430\u0447\u0430\u043B\u0430 \u0440\u0430\u0431\u043E\u0442\u044B \u043D\u0430 \u0442\u0435\u043A\u0443\u0449\u0435\u043C \u043C\u0435\u0441\u0442\u0435", ...getValidation(field('beginDate'), validatorObj.beginDate, input?.required), ...input })));
+    const colorStyle = {
+        yellow: { border: 'border-yellow-light', text: 'text-yellow' },
+        green: { border: 'border-green-more-light', text: 'text-green-dark' },
+        gray: { border: 'border-gray', text: 'text-secondary-text' },
+        red: { border: 'border-error/30', text: 'text-error' },
+    };
+    const Badge$1 = JSX(({ className, children, color = 'gray' }) => (jsxs("div", { className: style('sm:p-s sm:border sm:border-green rounded-md flex items-center h-fit', colorStyle[color].border, className), children: [jsx("div", { className: "block pr-m sm:pr-0 sm:hidden", children: jsx(Img, { image: { icon: 'SmallClockIcon' }, width: "24", height: "24" }) }), jsx(Text, { size: "text-m", color: colorStyle[color].text, children: children })] })));
 
-    const MIN_AGE = 23;
-    const MAX_AGE = 75;
-    const AGE_ERROR_MESSAGE = 'Допустимый возраст заёмщика - от 23 до 75 лет';
-    const FIELD_NAME$8 = 'birthday';
-    const BirthdayField = JSX(({ field, input, isRetailForm = false }) => {
-        const { value } = field(FIELD_NAME$8);
-        return (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F", ...getValidation(field(FIELD_NAME$8), validatorObj.birthday, input?.required), error: isRetailForm && value && !birthdayValidate(value) ? AGE_ERROR_MESSAGE : '', disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$8) }));
-    });
-    const birthdayValidate = (date) => {
-        const today = new Date();
-        const minDate = new Date(today.getFullYear() - MIN_AGE, today.getMonth(), today.getDate());
-        const maxDate = new Date(today.getFullYear() - MAX_AGE, today.getMonth(), today.getDate());
-        if (!date || date > minDate || date < maxDate) {
-            return false;
+    const currentWeekDayIdx = new Date().getDay();
+    //TODO: Add logic time https://github.com/redneckz/wildless-cms-uni-blocks/pull/1549
+    const renderCurrentDaySchedule = (workScheduleWeek) => {
+        const [currentWeekDay] = workScheduleWeek?.slice(currentWeekDayIdx - 1) ?? [];
+        if (!currentWeekDay) {
+            return null;
         }
-        return true;
+        const { lunchHour, status, workTime, hasLunch } = currentWeekDay;
+        return status ? (jsxs("div", { className: "flex gap-s items-start whitespace-nowrap", children: [workTime ? jsx(Badge$1, { color: "green", children: workTime }) : null, lunchHour && hasLunch ? jsx(Badge$1, { color: "yellow", children: `перерыв: ${lunchHour}` }) : null] })) : (jsx(Badge$1, { color: "red", children: "\u0412\u044B\u0445\u043E\u0434\u043D\u043E\u0439" }));
     };
 
-    const FIELD_NAME$7 = 'birthPlace';
-    const BirthPlaceField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041C\u0435\u0441\u0442\u043E \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F", ...getValidation(field('birthPlace'), validatorObj.birthPlace, input?.required), ...input, disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$7) })));
-
-    const CardCategoryField = JSX(({ field, input }) => {
-        const { data: cardCategory } = useLeadFormData('CARD_TYPE');
-        return (jsx(SelectField, { field: field, source: cardCategory, label: "\u041A\u0430\u0442\u0435\u0433\u043E\u0440\u0438\u044F \u043A\u0430\u0440\u0442\u044B", fieldName: "cardCategory", input: input }));
-    });
-
-    const ChildrenField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0434\u0435\u0442\u0435\u0439 \u0434\u043E 18 \u043B\u0435\u0442", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", ...getValidation(field('children'), validatorObj.children, input?.required), ...input })));
-
-    const CodeWordField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u0434\u043E\u0432\u043E\u0435 \u0441\u043B\u043E\u0432\u043E", ...getValidation(field('codeWord'), validatorObj.codeWord, input?.required), ...input })));
-
-    const CollectionCountField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043E\u0431\u044A\u0435\u043A\u0442\u043E\u0432 \u0438\u043D\u043A\u0430\u0441\u0441\u0430\u0446\u0438\u0438", type: "number", ...getValidation(field('collectionCount'), validatorObj.collectionCount, input?.required) })));
+    const getSubTextLunch = ({ lunchHour, hasLunch = false, status = false }) => {
+        if (!status) {
+            return 'Не работает';
+        }
+        return lunchHour && hasLunch ? `Перерыв ${lunchHour}` : lunchHour;
+    };
+    const renderDay = ({ title, status, workTime, lunchHour, hasLunch }, i) => (jsx(CardCell, { label: title, value: status && workTime ? workTime : '', subText: getSubTextLunch({ lunchHour, hasLunch, status }), subColor: !status || hasLunch ? 'text-error' : 'text-green-dark' }, String(i)));
 
-    const CommentField = JSX(({ field, input }) => (jsx(InputControl, { className: "col-span-2", ...getValidation(field('comment'), validatorObj.comment, input?.required), placeholder: "\u0412\u0430\u0448\u0435 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435", isTextarea: true })));
+    const ICONS$1 = ['ArrowDownIcon', 'ArrowUpIcon'];
+    const labels = ['Подробнее', 'Скрыть'];
+    const renderFoldButton$3 = ({ isUnfolded, onToggle }) => (jsxs("button", { className: "w-full py-2xl cursor-pointer text-primary-main flex items-center border-b border-solid border-main-divider", onClick: onToggle, type: "button", children: [jsx("div", { className: "pr-m", children: labels[Number(isUnfolded)] }), jsx(Icon, { className: "text-primary-text", name: ICONS$1[Number(isUnfolded)], width: "16", height: "16" })] }));
 
-    const ConfirmationIncomeField = JSX(({ field, input }) => {
-        const { data: confirmationIncome } = useLeadFormData('INCOME_CERT_UNITED');
-        return (jsx(SelectField, { field: field, source: confirmationIncome, label: "\u0421\u043F\u043E\u0441\u043E\u0431 \u043F\u043E\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0435\u043D\u0438\u044F \u0434\u043E\u0445\u043E\u0434\u0430", fieldName: "confirmationIncome", input: input }));
-    });
+    const renderWorkSchedule = (workSchedule) => {
+        const workScheduleWeek = getWorkScheduleWeek(workSchedule);
+        const timeOfWork = workSchedule ? getDateDescription(workScheduleWeek) : '';
+        const businessTimeOfWork = workSchedule ? workSchedule.businessScheduleDescription : '';
+        if (!workSchedule) {
+            return '';
+        }
+        if (!workSchedule.businessScheduleVisibleTag) {
+            return renderMatchingTimeOfWork(timeOfWork);
+        }
+        if (workSchedule.businessScheduleVisibleTag &&
+            workSchedule.businessScheduleDescription === null) {
+            return renderIndividualTimeOfWork(timeOfWork);
+        }
+        return renderDefaultTimeOfWork(timeOfWork, businessTimeOfWork);
+    };
+    const renderIndividualTimeOfWork = (timeOfWork) => `<p><b>Режим обслуживания физ.лиц:<br/></b>${timeOfWork}</p>`;
+    const renderMatchingTimeOfWork = (timeOfWork) => `<p><b>Режим обслуживания физ. и юр. лиц:<br/></b> ${timeOfWork}</p>`;
+    const renderDefaultTimeOfWork = (timeOfWork, businessTimeOfWork) => `<p><b>Режим обслуживания физ.лиц:<br/></b>${timeOfWork}</p> <p><b>Режим обслуживания юр.лиц:<br/></b>${businessTimeOfWork}</p>`;
 
-    const ConscriptionField = JSX(({ field, input }) => {
-        const { data: conscription } = useLeadFormData('MILITARY_STATUS');
-        return (jsx(SelectField, { field: field, source: conscription, label: "\u0421\u0442\u0430\u0442\u0443\u0441 \u0432\u043E\u0435\u043D\u043D\u043E\u043E\u0431\u044F\u0437\u0430\u043D\u043D\u043E\u0433\u043E", fieldName: "conscription", input: input }));
-    });
-
-    const CONSENTS = {
-        processPersonalDataFlg: {
-            text: 'Согласие на обработку персональных данных',
-            docId: 4,
-        },
-        consentInformFlg: {
-            text: 'Согласие на информирование о продуктах и услугах Банка',
-            docId: 14,
-        },
-        consentProviderFlg: {
-            text: 'Согласие об использовании простой электронной подписи',
-            docId: 5,
-        },
-        consentOthersFlg: {
-            text: 'Прочие согласия',
-            docId: 1,
-        },
-        consentPfrFlg: {
-            text: 'Согласие на запрос в ПФР',
-            docId: 3,
-        },
-        consentToReceiveMaterials: {
-            text: 'Согласен на получение информационных и аналитических материалов по электронной почте',
-        },
-    };
-
-    async function doRequest(url, method, body) {
-        const response = await fetch(`${API_BASE_URI}${url}`, {
-            method,
-            headers: {
-                'Content-Type': 'application/json',
-                ...getAuthorizationHeaders(),
-            },
-            credentials: 'include',
-            body: body ? JSON.stringify(body) : null,
-        });
-        // TODO: add error handling
-        return isJSON(response) ? response.json() : response;
-    }
-    // TODO: Need delete isJSON
-    const isJSON = (response) => response.headers.get('Content-Type') === 'application/json';
-    const getAuthorizationHeaders = () => {
-        const token = sessionStorage.getItem('accessToken');
-        return token ? { Authorization: `Bearer ${token}` } : null;
+    const renderOfficeCard = ({ name, address, phone, fax, phoneBusiness, phoneNatural, phoneCallCentre, phoneCurrencyControl, workSchedule, exchangeRate, }, i) => {
+        if (!workSchedule) {
+            return null;
+        }
+        const workScheduleWeek = getWorkScheduleWeek(workSchedule);
+        return (jsxs("div", { className: "bg-white col-span-12 p-3xl sm:border-green sm:border", children: [jsxs("div", { className: "sm:flex sm:justify-between", children: [jsxs("div", { children: [jsx(Text, { size: "text-h4", children: name }), address ? (jsxs("div", { className: "flex pb-xl pt-xs gap-2xs", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24" }), jsx(Text, { size: "text-l", children: address })] })) : null] }), renderCurrentDaySchedule(workScheduleWeek)] }), jsx("div", { className: "hidden sm:block", children: renderCardContent$1({
+                        phone,
+                        fax,
+                        phoneBusiness,
+                        phoneNatural,
+                        phoneCallCentre,
+                        phoneCurrencyControl,
+                        workSchedule,
+                        exchangeRate,
+                    }) }), jsx(Foldable, { className: "block sm:hidden", renderFoldableSection: ({ isUnfolded }) => {
+                        return (jsx(FoldableSection, { isUnfolded: isUnfolded, children: renderCardContent$1({
+                                phone,
+                                fax,
+                                phoneBusiness,
+                                phoneNatural,
+                                phoneCallCentre,
+                                phoneCurrencyControl,
+                                workSchedule,
+                                exchangeRate,
+                            }) }));
+                    }, 
+                    //** TODO: remove styles with refactoring  DefaultFoldButton*/
+                    renderFoldButton: ({ isUnfolded, onToggle }) => renderFoldButton$3({ isUnfolded, onToggle }) })] }, String(i)));
     };
-
-    const feedbackById = async (id, convertToPng = false) => {
-        const response = await doRequest(`/feedback/file?id=${encodeURIComponent(id)}&convertToPngFlg=${convertToPng}`, 'GET');
-        return await response.blob();
+    const renderCardContent$1 = ({ phone, fax, phoneBusiness, phoneNatural, phoneCallCentre, phoneCurrencyControl, workSchedule, exchangeRate, }) => {
+        const workScheduleWeek = getWorkScheduleWeek(workSchedule);
+        const labelSchedule = workSchedule?.businessScheduleVisibleTag
+            ? 'Для физических лиц'
+            : 'Для физических и юридических лиц';
+        return (jsxs("div", { children: [jsxs(CardRow, { className: "flex-wrap border-b border-solid border-main-divider", children: [jsx(CardCell, { label: "\u0424\u0430\u043A\u0441", value: fax, isPhone: true }), jsx(CardCell, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D \u0444\u0438\u043B\u0438\u0430\u043B\u0430", value: phone, isPhone: true }), jsx(CardCell, { label: "\u0414\u043B\u044F \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0439 \u044E\u0440\u0438\u0434\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", value: phoneBusiness, isPhone: true }), jsx(CardCell, { label: "\u041E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u0435 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", value: phoneNatural, isPhone: true }), jsx(CardCell, { label: "\u0414\u043B\u044F \u043A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u0439 \u043F\u043E \u0432\u0430\u043B\u044E\u0442\u043D\u043E\u043C\u0443 \u043A\u043E\u043D\u0442\u0440\u043E\u043B\u044E", value: phoneCurrencyControl, isPhone: true }), jsx(CardCell, { label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442-\u0446\u0435\u043D\u0442\u0440", value: phoneCallCentre, isPhone: true })] }), workSchedule?.isMatchesPattern ? (jsx(CardRow, { children: jsx(CardCell, { label: labelSchedule, labelSize: "text-l", className: "w-full max-w-none", children: jsx("div", { className: "flex flex-wrap gap-xs sm:justify-between pt-xs", children: workScheduleWeek?.map(renderDay) }) }) })) : (jsxs(CardRow, { children: [jsx(CardCell, { label: labelSchedule, labelSize: "text-l", children: jsx("div", { className: "flex gap-1", children: workScheduleWeek?.map(renderAlternativeDay) }) }), getScheduleDescription(workScheduleWeek)] })), workSchedule?.businessScheduleVisibleTag
+                    ? renderBusinessSchedule(workSchedule?.businessScheduleDescription)
+                    : null, exchangeRate?.currencies?.length ? (jsx(CardRow, { className: "flex-wrap", children: exchangeRate?.currencies?.map(renderCurrency) })) : null] }));
     };
-
-    const getDocument = async (id, convertToPng = false) => {
-        const response = await feedbackById(id, convertToPng);
-        return URL.createObjectURL(response);
+    const capitalizedFirstLetter$1 = (text) => text ? `${text?.charAt(0)?.toUpperCase()}${text?.slice(1)}` : '';
+    const getOfficePoint = ({ name = '', address = '', workSchedule }) => {
+        const header = capitalizedFirstLetter$1(name);
+        const body = `${address} ${renderWorkSchedule(workSchedule)}`;
+        return { header, body };
     };
 
-    const CloseButton = JSX(({ className, onClose }) => (jsx("button", { className: style('flex justify-center items-center w-12 h-12 p-2xs bg-transparent border-none', className), onClick: onClose, title: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C", type: "button", children: jsx(Icon, { name: "CloseIcon", width: "20", height: "20", iconVersion: "gray" }) })));
+    const isSSR = () => Boolean(typeof globalThis.process === 'object' && globalThis.process && globalThis.process.version);
 
-    const Dialog = JSX(({ className, head, children, onClose, onClick }) => {
-        const { close } = useDialogManager();
-        const handleClose = useCallback(() => {
-            close();
-            onClose && onClose();
-        }, [onClose]);
-        return (jsxs("div", { onClick: onClick, className: style('relative min-h-full bg-white pt-0 p-lg', className), role: "dialog", children: [jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-0 right-0", onClose: handleClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] }));
-    });
+    const isClient = !isSSR();
+    const ClientOnly = JSX(({ children }) => (isClient ? children : null));
 
-    const openDocument = async (open, id, convertToPng = false) => {
-        const document = await getDocument(id, convertToPng);
-        open(jsx(Dialog, { className: "my-6xl max-w-4xl mx-auto px-0 min-h-0 pb-0", children: convertToPng ? (jsx("img", { src: document })) : (jsx("iframe", { src: `${document}#toolbar=0`, className: "w-full h-[80vh]", id: "iframe-dialog" })) }));
+    const INITIAL_FILTRATION_STATE$1 = {
+        workingSaturday: false,
+        premiumService: false,
+        privateBanking: false,
+        remoteWorkplace: false,
+        serviceDisabledPeople: false,
+        sellingCoins: false,
+        buyingCoins: false,
+        bullionOperations: false,
+        preciousMetalsOperations: false,
+        transferringDataToBiometricSystem: false,
     };
-
-    const OPEN_DOC_BUTTON_TEXT = 'Ознакомиться';
-    const CheckboxWithDoc = JSX(({ className, error, docId, ...props }) => {
-        const { open } = useDialogManager();
-        const isMobile = useMobileMode();
-        return (jsxs("div", { className: className, children: [jsxs("div", { className: "flex flex-wrap gap-x-m", children: [jsx(Checkbox, { ...props }), docId ? (jsx(LinkButton, { className: "text-primary-main", onClick: () => openDocument(open, docId, isMobile), children: jsx(Text, { children: OPEN_DOC_BUTTON_TEXT }) })) : null] }), renderErrorText(error)] }));
-    });
-
-    const ConsentField = JSX(({ field, input }) => input && input.name ? (jsx(CheckboxWithDoc, { text: CONSENTS[input.name]?.text, docId: CONSENTS[input.name]?.docId, ...getValidation(field(input.name), validatorObj[input.name], input?.required) })) : null);
-
-    const LABEL_TEXT = `Имеет ли юридическое лицо, акционером / участником / членом / пайщиком / 
-    вкладчиком с долей участия более 20% уставного капитала руководителем, 
-    которого Вы являетесь, кредит в АО «Россельхозбанк»`;
-    const CreditInRshbCdField = JSX(({ field, input }) => {
-        const { data: creditInRshbCd } = useLeadFormData('CREDIT_IN_RSHB');
-        return (jsx(SelectField, { field: field, source: creditInRshbCd, label: LABEL_TEXT, fieldName: "creditInRshbCd", input: input }));
-    });
-
-    const orientationStyleMap = {
-        horizontal: '@lg:flex-row',
-        vertical: '',
+    const FILTRATION_LABELS = {
+        safeBoxCaseVolumes: 'Аренда индивидуальных сейфовых ячеек',
+        workingSaturday: 'Открыты по субботам',
+        terminalTypeAtms: 'Банкоматы',
+        terminalTypeTerm: 'Терминалы',
+        workAllTime: 'Круглосуточно',
+        billAcceptorEnable: 'Прием наличных',
+        premiumService: 'Премиальное обслуживание',
+        privateBanking: 'Услуга Private banking',
+        sellingCoins: 'Продажа монет из драгоценных металлов',
+        buyingCoins: 'Покупка монет из драгоценных металлов',
+        bullionOperations: 'Операции со слитками',
+        preciousMetalsOperations: 'Операции с драгоценными металлами',
+        transferringDataToBiometricSystem: 'Передача фото и голоса в Единую биометрическую систему',
+        locationDisabledPeople: 'Для маломобильных',
+        designDisabledPeople: 'Для слабовидящих',
+        remoteWorkplace: 'Удаленное рабочее место',
+        serviceDisabledPeople: 'Для маломобильных граждан',
+    };
+    const FILTRATION_PREDICATES$1 = {
+        workingSaturday: (item) => Boolean('workSchedule' in item && item.workSchedule?.workingSaturday),
+        premiumService: (item) => Boolean('premiumService' in item && item.premiumService),
+        privateBanking: (item) => Boolean('privateBanking' in item && item.privateBanking),
+        remoteWorkplace: (item) => Boolean('workScheduleDescription' in item),
+        serviceDisabledPeople: (item) => Boolean('serviceDisabledPeople' in item && item.serviceDisabledPeople),
+        sellingCoins: (item) => Boolean('sellingCoins' in item && item.sellingCoins),
+        buyingCoins: (item) => Boolean('buyingCoins' in item && item.buyingCoins),
+        bullionOperations: (item) => Boolean('bullionOperations' in item && item.bullionOperations),
+        preciousMetalsOperations: (item) => Boolean('preciousMetalsOperations' in item && item.preciousMetalsOperations),
+        transferringDataToBiometricSystem: (item) => Boolean('transferringDataToBiometricSystem' in item && item.transferringDataToBiometricSystem),
     };
-    const RadioButtonGroup = JSX(({ label, items, value, className, onChange: onChangeCheckedItem, disabled = false, orientation = 'horizontal', }) => (jsxs("div", { className: "grid gap-xs whitespace-nowrap", children: [label ? (jsx("div", { role: "radiogroup", "aria-label": label, children: jsx(Text, { color: "text-secondary-text", font: "font-light", children: label }) })) : null, jsx("div", { className: style('flex flex-col gap-s', orientationStyleMap[orientation], className), role: "radiogroup", "aria-label": "\u0413\u0440\u0443\u043F\u043F\u0430 \u043A\u043D\u043E\u043F\u043E\u043A", children: items?.map(({ id, text }) => (jsx(Checkbox, { isRadio: true, text: text, value: value === id, onChange: () => onChangeCheckedItem && onChangeCheckedItem(id), disabled: disabled }, String(id)))) })] })));
 
-    const RadioButtonGroupControl = JSX(({ className, label, onChange, error, ...rest }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(RadioButtonGroup, { label: getRequiredLabel({ label, errors: rest?.errors }), onChange: (_) => onChange && onChange(_), ...rest }), renderErrorText(error)] })));
+    function useButton() {
+        return (props) => ({
+            ...props,
+            onClick: handlerDecorator(handleClick(props)),
+        });
+    }
+    function handleClick({ disabled, onClick }) {
+        return (ev) => {
+            !disabled && onClick && onClick(ev);
+        };
+    }
 
-    const CURRENCY_TYPES = [{ id: 'rub', text: 'Рубль' }];
-    const CurrencyField = JSX(({ field, input }) => {
-        const { value, onChange } = field('currency');
-        return (jsx(RadioButtonGroupControl, { label: "\u0412\u0430\u043B\u044E\u0442\u0430", orientation: "horizontal", items: CURRENCY_TYPES, value: value, onChange: (_) => onChange?.(_), ...getValidation(field('currency'), validatorObj.currency, input?.required) }));
+    const buttonStyleMap = {
+        primary: 'text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active',
+        secondary: 'text-primary-main bg-main-divider hover:text-white hover:bg-primary-hover active:bg-primary-active',
+    };
+    const secondaryButtonStyleMap = {
+        primary: style('group-data-secondary:text-primary-main group-data-secondary:bg-white', 'group-data-secondary:hover:text-white group-data-secondary:hover:bg-primary-hover', 'group-data-secondary:active:bg-primary-active'),
+        secondary: style('group-data-secondary:text-white group-data-secondary:bg-white/20', 'group-data-secondary:hover:bg-primary-hover', 'group-data-secondary:active:bg-primary-active'),
+    };
+    const Button = JSX(({ children, ...props }) => {
+        const button = useButton();
+        const { className, version = 'primary', active, disabled, type = 'button', rounded = true, role, onClick, } = button(props);
+        return (jsx("button", { className: style('font-sans px-9 py-4', 'flex justify-center items-center gap-xs', {
+                'text-white bg-primary-active': active,
+                'bg-main-gray text-main-disabled cursor-not-allowed': disabled,
+                'rounded-md': rounded,
+            }, !active && !disabled
+                ? style(buttonStyleMap[version], secondaryButtonStyleMap[version])
+                : '', className), type: type, role: role, onClick: onClick, children: children }));
     });
 
-    const DeliveryDateFiels = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0434\u043E\u0441\u0442\u0430\u0432\u043A\u0438", ...getValidation(field('deliveryDate'), validatorObj.deliveryDate, input?.required) })));
-
-    const DependentsField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0438\u0436\u0434\u0438\u0432\u0435\u043D\u0446\u0435\u0432", placeholder: "\u0417\u0430 \u0438\u0441\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u0435 \u0434\u0435\u0442\u0435\u0439 \u0434\u043E 18 \u043B\u0435\u0442", type: "number", maxLength: 2, ...getValidation(field('dependents'), validatorObj.dependents, input?.required), ...input })));
+    const getVersion = (isPrimary, type) => isPrimary && type !== 'underlined' ? 'primary' : 'secondary';
 
-    const DesiredMeetingDateField = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0416\u0435\u043B\u0430\u0435\u043C\u0430\u044F \u0434\u0430\u0442\u0430 \u0432\u0441\u0442\u0440\u0435\u0447\u0438", ...getValidation(field('desiredMeetingDate'), validatorObj.meetingDay, input?.required) })));
+    const renderButtonsGroup = (data, activeButton, onButtonClick) => {
+        const allButtonVersion = getVersion(activeButton === 'all');
+        const businessButtonVersion = getVersion(activeButton === 'business');
+        const handleClick = (e, key, branches) => {
+            const filteredBranches = e.currentTarget === e.target && key === 'business' ? filterBranches(branches) : branches;
+            onButtonClick(key);
+            return filteredBranches;
+        };
+        const filterBranches = (branches) => branches.filter((branch) => branch.workSchedule &&
+            branch.workSchedule.businessScheduleVisibleTag &&
+            !branch.workSchedule.businessScheduleDescription);
+        return (jsxs("div", { className: "flex gap-lg flex-col sm:flex-row pb-lg", children: [jsx(Button, { "data-id": "all", onClick: (e) => handleClick(e, 'all', data), version: allButtonVersion, children: "\u0414\u043B\u044F \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446" }), jsx(Button, { "data-id": "business", onClick: (e) => handleClick(e, 'business', data), version: businessButtonVersion, children: "\u0414\u043B\u044F \u044E\u0440\u0438\u0434\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446" })] }));
+    };
 
-    const DisablePeopleFlgField = JSX(({ field, input }) => (jsx(CheckboxWithError, { text: "\u042F\u0432\u043B\u044F\u044E\u0441\u044C \u0438\u043D\u0432\u0430\u043B\u0438\u0434\u043E\u043C", ...getValidation(field('disablePeopleFlg'), validatorObj.disablePeopleFlg, input?.required) })));
+    const renderDescriptionBlock$1 = ({ __html, list, richVersion }) => __html || list?.length ? (jsxs("div", { className: "mb-2xl border-b sm:border border-main-divider sm:rounded-md", children: [__html ? (jsx("div", { className: "mb-2xl", children: jsx(RichText, { __html: __html, richVersion: richVersion }) })) : null, list?.length ? (jsx("div", { className: "flex flex-col sm:flex-row gap-2xl sm:flex-wrap pb-2xl sm:pb-xl", children: list.map((item, i) => (jsxs("div", { className: "flex gap-xs items-center", children: [item?.image ? jsx(Img, { image: item.image }) : null, item?.text ? (jsx(Text, { size: "text-m", font: "font-light", children: item.text })) : null] }, String(i)))) })) : null] })) : null;
 
-    const FIELD_NAME$6 = 'dulIssueDateField';
-    const DulIssueDateField = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0432\u044B\u0434\u0430\u0447\u0438", ...getValidation(field(FIELD_NAME$6), validatorObj.dulIssueDateField, input?.required), disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$6) })));
+    const COMMON_FILTERS_STYLES = 'flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb-2xl';
+    const renderFiltrationForm = ({ filters, field: { field, reset }, onlyOffice, labels, }) => {
+        const visibleFiltersNum = onlyOffice ? 5 : 6;
+        const filtersCheckbox = (filters || []).map((key) => (jsx(Checkbox, { text: labels[key], ...field(key) }, key)));
+        const [visibleFilters, hiddenFilters] = visibleFiltersNum > 0
+            ? [filtersCheckbox.slice(0, visibleFiltersNum), filtersCheckbox.slice(visibleFiltersNum)]
+            : [filtersCheckbox, []];
+        return (jsx("div", { children: filters?.length ? (jsx("div", { children: jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs("div", { children: [jsx("div", { className: COMMON_FILTERS_STYLES, children: visibleFilters }), jsx(FoldableSection, { className: COMMON_FILTERS_STYLES, isUnfolded: isUnfolded, children: hiddenFilters })] })), renderFoldButton: renderFoldButton$2(reset, onlyOffice) }) })) : null }));
+    };
+    const renderFoldButton$2 = (reset, onlyOffice = false) => ({ isUnfolded, onToggle }) => {
+        const labels = ['Больше фильтров', 'Меньше фильтров'];
+        const icons = ['ArrowDownIcon', 'ArrowUpIcon'];
+        return (jsxs("div", { className: "flex space-x-lg", children: [onlyOffice ? (jsx(LinkButton, { version: "transparent", className: "text-secondary-text [&>*]:p-0", appendRight: jsx(Icon, { name: icons[Number(isUnfolded)], width: "16", height: "16" }), text: labels[Number(isUnfolded)], onClick: onToggle })) : null, jsx(LinkButton, { version: "transparent", className: "text-secondary-text [&>*]:p-0", onClick: reset, children: renderBtnInner() })] }));
+    };
+    const renderBtnInner = () => (jsxs("div", { className: "flex items-center", children: ["\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440", jsx(Icon, { name: "CloseIcon", width: "16", height: "16", className: "ml-2xs" })] }));
 
-    const FIELD_NAME$5 = 'dulIssuedBy';
-    const DulIssuedByField = JSX(({ field, input }) => {
-        const { value: dulSubdivisionCode, onChange: changeDulSubdivisionCode } = field('dulSubdivisionCode');
-        const onDaDataChange = useCallback((item) => {
-            changeDulSubdivisionCode?.(item?.data?.code?.replace('-', ''));
-        }, []);
-        return (jsx(InputControl, { disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$5), label: "\u041A\u0435\u043C \u0432\u044B\u0434\u0430\u043D", ...input, ...getValidation(field(FIELD_NAME$5), validatorObj.dulIssuedBy, input?.required), onDaDataChange: onDaDataChange, daDataQueryPrefix: dulSubdivisionCode }));
-    });
+    const renderHeading = (title, lengthItems) => (jsx("div", { className: "flex flex-col sm:flex-row gap-xs mb-2xl", children: jsxs(Heading, { headingType: "h3", children: [jsx("span", { suppressHydrationWarning: true, children: title }), lengthItems ? (jsx(Text, { size: "text-h2", color: "text-secondary-text", children: jsx("span", { suppressHydrationWarning: true, children: ` (${lengthItems})` }) })) : null] }) }));
 
-    const FIELD_NAME$4 = 'dulNumber';
-    const DulNumberField = JSX(({ field, input }) => (jsx(InputControl, { disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$4), label: "\u041D\u043E\u043C\u0435\u0440 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0430", type: "number", maxLength: 6, ...getValidation(field('dulNumber'), validatorObj.dulNumber, input?.required) })));
-
-    const FIELD_NAME$3 = 'dulSerie';
-    const DulSerieField = JSX(({ field, input }) => (jsx(InputControl, { disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$3), label: "\u0421\u0435\u0440\u0438\u044F \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0430", type: "number", maxLength: 4, ...getValidation(field('dulSerie'), validatorObj.dulSerie, input?.required) })));
-
-    const FIELD_NAME$2 = 'dulSubdivisionCode';
-    const DulSubdivisionCodeField = JSX(({ field, input }) => {
-        const onDaDataChange = useCallback((item) => {
-            field?.('dulIssuedBy')?.onChange?.(item?.data?.name);
-        }, []);
-        return (jsx(InputControl, { disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$2), label: "\u041A\u043E\u0434 \u043F\u043E\u0434\u0440\u0430\u0437\u0434\u0435\u043B\u0435\u043D\u0438\u044F", type: "number", maxLength: 6, ...input, ...getValidation(field(FIELD_NAME$2), validatorObj.dulSubdivisionCode, input?.required), onDaDataChange: onDaDataChange }));
-    });
-
-    const EducationField = JSX(({ field, input }) => {
-        const { data: education } = useLeadFormData('EDUCATION_LEVEL');
-        return (jsx(SelectField, { field: field, source: education, label: "\u041E\u0431\u0440\u0430\u0437\u043E\u0432\u0430\u043D\u0438\u0435", fieldName: "education", input: input }));
+    const defaultEmptyFunction$1 = () => void 0;
+    const filtersVisibleStyles = (activeButton) => activeButton === 'all' ? 'block' : 'hidden';
+    const OfficesAtmsMapLayout = JSX(({ className, data = [], isLoad, remoteWorkplaces = [], renderCard = defaultEmptyFunction$1, renderRemoteWorkplaceCard = defaultEmptyFunction$1, getBalloon = defaultEmptyFunction$1, getBalloonRemoteWorkplaces = defaultEmptyFunction$1, descriptionData, title, }) => {
+        const onlyOffice = title?.includes('Офис');
+        const [filtrationState, { field, reset }] = useForm(INITIAL_FILTRATION_STATE$1);
+        const { filteredItems, points, filteredRemoteWorkplaces, lengthItems } = useOfficesAtmsMapData({
+            data,
+            remoteWorkplaces,
+            filtrationState,
+            getBalloon,
+            getBalloonRemoteWorkplaces,
+        });
+        const [activeButton, setActiveButton] = useState('all');
+        const filterOptions = {
+            filters: getFiltersWithNonEmptyData([...data, ...remoteWorkplaces]),
+            field: { field, reset },
+            onlyOffice,
+            labels: FILTRATION_LABELS,
+        };
+        return (jsxs("div", { className: style('space-y-1', className), children: [jsxs("div", { className: "bg-white", children: [jsxs("div", { className: "p-3xl pb-0", children: [renderHeading(title, lengthItems), descriptionData ? renderDescriptionBlock$1(descriptionData) : null, onlyOffice && renderButtonsGroup(data, activeButton, setActiveButton), jsx("div", { className: style('pb-3xl', filtersVisibleStyles(activeButton)), children: renderFiltrationForm(filterOptions) })] }), jsx("div", { className: "h-[600px]", children: jsx(ClientOnly, { children: jsx(YandexMap, { points: points, isLoad: isLoad, className: "h-full" }) }) })] }), jsxs(ClientOnly, { children: [filteredItems.map(renderCard), filteredRemoteWorkplaces.map(renderRemoteWorkplaceCard)] })] }));
     });
+    const filterItems$1 = (data, filtrationState) => {
+        const truthyFilters = Object.keys(filtrationState).filter((key) => filtrationState[key]);
+        return data.filter((item) => truthyFilters.every((_) => FILTRATION_PREDICATES$1[_](item)));
+    };
+    const getFiltersWithNonEmptyData = (data) => Object.keys(INITIAL_FILTRATION_STATE$1).filter((_) => data.filter((item) => FILTRATION_PREDICATES$1[_](item)).length);
 
-    const EmailField = JSX(({ field, input }) => {
-        const { required, ...rest } = input;
-        return (jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...getValidation(field('email'), validatorObj.email, required), ...rest }));
-    });
+    const defaultEmptyFunction = () => void 0;
+    const useOfficesAtmsMapData = ({ data, remoteWorkplaces = [], filtrationState = {}, getBalloon = defaultEmptyFunction, getBalloonRemoteWorkplaces = defaultEmptyFunction, }) => {
+        const [filteredItems, points, filteredRemoteWorkplaces, lengthItems] = useMemo(() => {
+            const _filteredItems = filterItems$1(data, filtrationState);
+            const _filteredRemoteWorkplaces = filterItems$1(remoteWorkplaces, filtrationState);
+            const _points = [
+                ..._filteredItems.map((_) => ({
+                    type: 'offices',
+                    coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)]?.filter(Boolean),
+                    content: getBalloon(_),
+                })),
+                ..._filteredRemoteWorkplaces.map((_) => ({
+                    type: 'workplaces',
+                    coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)]?.filter(Boolean),
+                    content: getBalloonRemoteWorkplaces({
+                        address: _.address,
+                        workScheduleDescription: _.workScheduleDescription,
+                    }),
+                })),
+            ].filter((_) => _.coords && _.coords.length === 2);
+            const itemsLength = _filteredItems.length + _filteredRemoteWorkplaces?.length;
+            return [_filteredItems, _points, _filteredRemoteWorkplaces, itemsLength];
+        }, [data, remoteWorkplaces, filtrationState, getBalloon, getBalloonRemoteWorkplaces]);
+        return { filteredItems, points, filteredRemoteWorkplaces, lengthItems };
+    };
 
-    const EmployerActivitiesField = JSX(({ field, input }) => {
-        const { data: employerActivities } = useLeadFormData('ORGANIZATION_ACTIVITY_TYPE');
-        return (jsx(SelectField, { field: field, source: employerActivities, label: "\u0412\u0438\u0434 \u0434\u0435\u044F\u0442\u0435\u043B\u044C\u043D\u043E\u0441\u0442\u0438 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438-\u0440\u0430\u0431\u043E\u0442\u043E\u0434\u0430\u0442\u0435\u043B\u044F", fieldName: "employerActivities", input: input }));
-    });
+    const useLeadFormData = (typeField) => {
+        const { data, error } = useAsyncData(`/api/v1/dictionary?dictionaryType=${encodeURIComponent(typeField)}`, fetchData);
+        if (data && 'errorMessage' in data) {
+            return { error };
+        }
+        return { data: data, error };
+    };
+    const fetchData = async (url) => {
+        const result = await fetchJSON(url, { method: 'POST' });
+        return result || [];
+    };
 
-    const EmployerOrganizationField = JSX(({ field, input }) => {
-        const { data: employerOrganization } = useLeadFormData('ORGANIZATION_KIND');
-        return (jsx(SelectField, { field: field, source: employerOrganization, label: "\u0412\u0438\u0434 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438 \u0440\u0430\u0431\u043E\u0442\u043E\u0434\u0430\u0442\u0435\u043B\u044F", fieldName: "employerOrganization", input: input }));
+    const AddressRetailField = JSX(({ field, input }) => {
+        const [offices, setOffices] = useState([]);
+        const { data } = useLeadFormData('REGION_RF');
+        const regionValue = field('regionRetail')?.value || {};
+        const fieldBranch = field('addressRetail');
+        useEffect(() => {
+            (async () => {
+                const officesList = await regionOffices(regionValue?.key ?? '');
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+                setOffices(officesList || []);
+            })();
+            if (regionValue?.key) {
+                field?.('addressRetail')?.onChange?.('');
+            }
+        }, [regionValue.key]);
+        const { points } = useOfficesAtmsMapData({
+            data: offices,
+            filtrationState: {},
+            getBalloon: getOfficePoint,
+        });
+        const isRegionSelected = Boolean(regionValue?.key);
+        return (jsxs("div", { children: [jsx(SelectControl, { label: "\u0410\u0434\u0440\u0435\u0441 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u044F", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435", options: offices.map(({ id, address = '' }) => ({
+                        key: id?.toString() || '',
+                        text: address,
+                    })), ...getValidation(field('addressRetail'), validatorObj.addressRetail, input?.required && isRegionSelected), isSearch: true }), jsx("div", { className: "h-[600px]", children: jsx(ClientOnly, { children: jsx(YandexMap, { points: points, isLoad: !data, className: "h-full", selectedAddress: fieldBranch?.value?.text }) }) })] }));
     });
 
-    const EmploymentField = JSX(({ field, input }) => {
-        const { data: employment } = useLeadFormData('EMPLOYMENT_INFO_UNITED');
-        return (jsx(SelectField, { field: field, source: employment, label: "\u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u044F \u043E \u0442\u0440\u0443\u0434\u043E\u0443\u0441\u0442\u0440\u043E\u0439\u0441\u0442\u0432\u0435", fieldName: "employment", input: input }));
-    });
+    const useNormalizedInput = (props, { normalize, format }) => {
+        const { value, onFocus, onBlur, onChange } = props;
+        const [isFocused, setIsFocused] = useState(false);
+        const handleFocus = useCallback((ev) => {
+            setIsFocused(true);
+            onFocus && onFocus(ev);
+        }, []);
+        const handleBlur = useCallback(() => {
+            setIsFocused(false);
+            onChange && onChange(normalize(value));
+            onBlur && onBlur();
+        }, [onChange, value]);
+        return {
+            value: (isFocused || !format ? value : format(value)),
+            onFocus: handleFocus,
+            onBlur: handleBlur,
+        };
+    };
 
-    const ExpensesField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u044B\u0435 \u0440\u0430\u0441\u0445\u043E\u0434\u044B \u0432 \u043C\u0435\u0441\u044F\u0446", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", ...getValidation(field('expenses'), validatorObj.expenses, input?.required), ...input })));
+    const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
 
-    const Experience5YearsField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0421\u0442\u0430\u0436", placeholder: "\u0417\u0430 \u043F\u043E\u0441\u043B\u0435\u0434\u043D\u0438\u0435 5 \u043B\u0435\u0442", type: "number", maxLength: 2, ...getValidation(field('experience5Years'), validatorObj.experience5Years, input?.required), ...input })));
+    function parseDecimal(value) {
+        const rawValue = (value || '').replace(/\D/g, '');
+        const unsafeDecimal = parseInt(rawValue, 10);
+        return Number.isNaN(unsafeDecimal) ? 0 : unsafeDecimal;
+    }
 
-    const FamilyMembersField = JSX(({ field }) => {
-        const { value, onChange } = field('familyMembers');
-        const familyStatusKey = field('familyStatus')?.value?.key;
-        const adultsCount = familyStatusKey === 'MARRIED' ? 2 : 1;
-        const childrenCount = Number(field('children')?.value);
-        const dependentsCount = Number(field('dependents')?.value);
-        const totalCount = adultsCount + childrenCount + dependentsCount;
-        useEffect(() => {
-            field?.('familyMembers')?.onChange?.(totalCount);
-        }, [familyStatusKey, childrenCount, dependentsCount]);
-        return (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0447\u043B\u0435\u043D\u043E\u0432 \u0441\u0435\u043C\u044C\u0438", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", disabled: true, value: value, onChange: (_) => onChange?.(_) }));
-    });
+    function renderRangeWithTicks({ list = [], min, max, step, value = list[0] || min, disabled, onChange, }) {
+        const rangeValue = list.length ? list.indexOf(value) : value;
+        const rangeValueShift = rangeValue > min ? rangeValue - min : 0;
+        const percentage = (rangeValueShift * 100) / (max - min);
+        const inputStyle = {
+            backgroundSize: `${percentage.toFixed(2)}% 100%`,
+        };
+        return (jsxs("div", { children: [list.length ? (jsx("div", { className: "absolute w-full flex justify-between -bottom-[3px] px-m", children: list.map((_, i) => (jsx("div", { className: style('w-2 h-2 rounded-full', rangeValue <= i || disabled ? 'bg-gray' : 'bg-primary-main') }, String(i)))) })) : null, jsx("div", { className: "absolute inset-x-0 -bottom-1 px-m leading-[18px]", children: jsx("input", { className: "box-border w-full m-0 cursor-pointer slider relative z-10", style: inputStyle, type: "range", min: min, max: max, step: step, value: rangeValue, disabled: disabled, onChange: ((ev) => {
+                            const rawValue = parseDecimal(ev.target?.value);
+                            const newValue = list.length ? list[rawValue] : rawValue;
+                            onChange && onChange(newValue || 0);
+                        }) }) })] }));
+    }
 
-    const FamilyStatusField = JSX(({ field, input }) => {
-        const { data: familyStatus } = useLeadFormData('MARITAL_STATUS');
-        return (jsx(SelectField, { field: field, source: familyStatus, label: "\u0421\u0435\u043C\u0435\u0439\u043D\u043E\u0435 \u043F\u043E\u043B\u043E\u0436\u0435\u043D\u0438\u0435", fieldName: "familyStatus", input: input }));
+    const inputDisabledStyle = 'disabled:border-gray disabled:bg-main-divider';
+    const DEFAULT_MIN = 1;
+    const DEFAULT_MAX = 100;
+    const InputRange = JSX((props) => {
+        const { className, title, items = [], list = [], min = list.length ? 0 : DEFAULT_MIN, max = list.length ? list.length - 1 : DEFAULT_MAX, step = 1, value = list[0] || min, disabled = false, onChange, } = props;
+        const normalizedProps = useNormalizedInput(props, {
+            normalize: (_ = 0) => list.length ? closestValue(list)(_) : clamp(_, min, max),
+            format: toLocalNumberFormat(),
+        });
+        const handleChange = useCallback((ev) => {
+            onChange && onChange(parseDecimal(ev.target?.value));
+        }, [onChange]);
+        return (jsxs("div", { className: className, children: [jsxs("label", { className: "block relative", children: [title ? (jsx(Text, { size: "text-m", font: "font-light", color: "text-primary-text", children: title })) : null, jsx("input", { className: style('text-h3 w-full h-14', 'pl-m mt-xs box-border', 'text-primary-text', inputValidStyle, inputDisabledStyle), disabled: disabled, onChange: handleChange, ...normalizedProps }), renderRangeWithTicks({ list, min, max, step, disabled, value, onChange })] }), renderRangeCaption(items)] }));
     });
+    const closestValue = (list) => (_) => list.reduce((prev, curr) => (Math.abs(curr - _) < Math.abs(prev - _) ? curr : prev));
+    const renderRangeCaption = (items) => (jsx("div", { className: "flex justify-between my-xs", children: items.map((item, i) => (jsx(Text, { size: "text-s", font: "font-light", color: "text-secondary-text", children: item }, String(i)))) }));
 
-    const SERVICE_TYPES = [
-        { key: 'ULTRASERVICE', text: 'Ультра' },
-        { key: 'PREMIUMSERVICE', text: 'Премиум' },
-    ];
-    const SERVICE_DIRECTIONS = [
-        { key: 'Физическое лицо' },
-        { key: 'Юридическое лицо / ИП' },
-    ];
-    const FEEDBACK_METHOD = [
-        { key: 'phone', text: 'Телефонный звонок' },
-        { key: 'email', text: 'Электронное сообщение' },
-    ];
-
-    const FeedbackMethodField = JSX(({ field, input }) => (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, ...getValidation(field('feedbackMethod'), validatorObj.feedbackMethod, input?.required) })));
-
-    const FullNameField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0424\u0418\u041E", ...getValidation(field('fullName'), validatorObj.fullName, input?.required), ...input })));
-
-    const GeneralSeniorityField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041E\u0431\u0449\u0438\u0439 \u0441\u0442\u0430\u0436", type: "number", maxLength: 2, placeholder: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043B\u0435\u0442", ...getValidation(field('generalSeniority'), validatorObj.generalSeniority, input?.required), ...input })));
+    const MIN_CREDIT_AMOUNT = 1000;
+    const MAX_CREDIT_AMOUNT = 1000000000;
+    const ITEMS_CREDIT_AMOUNT = ['От 1 000 ₽', 'До 1 000 000 000 ₽'];
+    const AmountField = JSX(({ field }) => (jsx(InputRange, { title: "\u0421\u0443\u043C\u043C\u0430, \u20BD", items: ITEMS_CREDIT_AMOUNT, min: MIN_CREDIT_AMOUNT, max: MAX_CREDIT_AMOUNT, ...field('amount') })));
 
-    const HousingField = JSX(({ field, input }) => {
-        const { data: housing } = useLeadFormData('HOUSE_TYPE');
-        return (jsx(SelectField, { field: field, source: housing, label: "\u0422\u0438\u043F \u0436\u0438\u043B\u044C\u044F", fieldName: "housing", input: input }));
+    const SelectField = UniBlock(({ field, source, label, fieldName, input, placeholder = 'Выберите из списка', isSearch = false, }) => {
+        const leadOptions = (source &&
+            source?.map((_) => ({
+                key: _.key || '',
+                text: _.value,
+            }))) ||
+            [];
+        return (jsx(SelectControl, { placeholder: placeholder, label: label, options: leadOptions, isSearch: isSearch, ...getValidation(field(fieldName), validatorObj[fieldName], input?.required) }));
     });
 
-    const InnField = JSX(({ field, input }) => {
-        const onDaDataChange = useCallback((item) => {
-            field?.('organizationName')?.onChange?.(item.data?.name?.short_with_opf);
-            field?.('legalForm')?.onChange?.(item.data?.opf?.short);
-        }, []);
-        return (jsx(InputControl, { label: "\u0418\u041D\u041D", type: "number", maxLength: 12, ...input, ...getValidation(field('inn'), validatorObj.inn, input?.required), onDaDataChange: onDaDataChange }));
+    const AmountWorkersField = JSX(({ field, input }) => {
+        const { data: amountWorkers } = useLeadFormData('EMPLOYEES_NUMBER');
+        return (jsx(SelectField, { field: field, source: amountWorkers, label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0440\u0430\u0431\u043E\u0442\u0430\u044E\u0449\u0438\u0445 \u0432 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", fieldName: "amountWorkers", input: input }));
     });
 
-    const IsClientField = JSX(({ field }) => (jsx(CheckboxWithError, { ...field('isClient'), text: '\u042F\u0432\u043B\u044F\u044E\u0441\u044C \u043A\u043B\u0438\u0435\u043D\u0442\u043E\u043C \u0431\u0430\u043D\u043A\u0430 \u0410\u041E "\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A"' })));
-
-    const JobsNumberField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043C\u0435\u0441\u0442 \u0440\u0430\u0431\u043E\u0442\u044B \u0437\u0430 \u043F\u043E\u0441\u043B\u0435\u0434\u043D\u0438\u0435 5 \u043B\u0435\u0442", placeholder: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043C\u0435\u0441\u0442", type: "number", maxLength: 2, ...getValidation(field('jobsNumber'), validatorObj.jobsNumber, input?.required), ...input })));
+    const AnnualRevenueField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0413\u043E\u0434\u043E\u0432\u0430\u044F \u0432\u044B\u0440\u0443\u0447\u043A\u0430, \u20BD", ...getValidation(field('annualRevenue'), validatorObj.annualRevenue, input?.required) })));
 
-    const LastJobExperienceField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0421\u0442\u0430\u0436 \u043D\u0430 \u043F\u043E\u0441\u043B\u0435\u0434\u043D\u0435\u043C \u0440\u0430\u0431\u043E\u0447\u0435\u043C \u043C\u0435\u0441\u0442\u0435", placeholder: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043B\u0435\u0442", type: "number", maxLength: 2, ...getValidation(field('lastJobExperience'), validatorObj.lastJobExperience, input?.required), ...input })));
+    const ArmyIdFlgField = JSX(({ field, input }) => (jsx(CheckboxWithError, { text: "\u041D\u0430\u043B\u0438\u0447\u0438\u0435 \u0432\u043E\u0435\u043D\u043D\u043E\u0433\u043E \u0431\u0438\u043B\u0435\u0442\u0430", ...getValidation(field('armyIdFlg'), validatorObj.armyIdFlg, input?.required) })));
 
-    const LegalEntityNameField = JSX(({ field, input }) => {
-        return (jsx(InputControl, { label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u044E\u0440\u0438\u0434\u0438\u0447\u0435\u0441\u043A\u043E\u0433\u043E \u043B\u0438\u0446\u0430", ...input, ...getValidation(field('legalEntityName'), validatorObj.legalEntityName, input?.required) }));
-    });
+    const BankEmpoleeCodeField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u0434 \u043F\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u0435\u043B\u044F \u0411\u0430\u043D\u043A\u0430", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u043E\u0434", type: "number", ...getValidation(field('bankEmployeeCode'), validatorObj.bankEmployeeCode, input?.required), ...input })));
 
-    const LegalFormField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041E\u041F\u0424", placeholder: "\u041E\u041E\u041E, \u041F\u0410\u041E  \u0438 \u0434\u0440.", ...getValidation(field('legalForm'), validatorObj.legalForm, input?.required), ...input })));
+    const BankEmpoleeField = JSX(({ field }) => (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') })));
 
-    const OUT_SERVICE_BASE_URL = `${API_BASE_URI}/outservice`;
-    const EMPTY_REGIONS = [];
-    async function getOutServiceRegions() {
-        const data = await fetchJSON(`${OUT_SERVICE_BASE_URL}/outserviceregions`);
-        return data && Array.isArray(data) ? data : EMPTY_REGIONS;
-    }
+    const BankruptcyFlgField = JSX(({ field, input }) => (jsx(CheckboxWithError, { text: "\u0412 \u043E\u0442\u043D\u043E\u0448\u0435\u043D\u0438\u0438 \u043C\u0435\u043D\u044F \u0432\u0435\u0434\u0451\u0442\u0441\u044F \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u0434\u0441\u0442\u0432\u043E \u043F\u043E \u0434\u0435\u043B\u0443 \u043E \u0431\u0430\u043D\u043A\u0440\u043E\u0442\u0441\u0442\u0432\u0435", ...getValidation(field('bankruptcyFlg'), validatorObj.bankruptcyFlg, input?.required) })));
 
-    const LocalitiesField = JSX(({ field, input }) => {
-        const fieldRegion = field('region');
-        const regionKey = fieldRegion?.value?.key;
-        const { data: regions } = useAsyncData('outServiceRegions', getOutServiceRegions);
-        const localities = regions
-            ?.find((_) => _.code === regionKey)
-            ?.localities?.map((_) => ({ key: _, text: _ }));
+    const useElementSpace = (ref, heightEl) => {
+        const [spaceAbove, setSpaceAbove] = useState(false);
         useEffect(() => {
-            if (regionKey !== '') {
-                field?.('localities')?.onChange?.('');
-            }
-        }, [regionKey]);
-        return (jsx(SelectControl, { label: "\u041D\u0430\u0441\u0435\u043B\u0435\u043D\u043D\u044B\u0439 \u043F\u0443\u043D\u043A\u0442", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0433\u043E\u0440\u043E\u0434, \u0433\u0434\u0435 \u0434\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0441\u0435\u0440\u0432\u0438\u0441", options: localities, ...getValidation(field('localities'), validatorObj.localities, input?.required), isSearch: true }));
-    });
-
-    const MandatoryPaymentsField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u044B\u0435 \u0432\u044B\u043F\u043B\u0430\u0442\u044B", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", ...getValidation(field('mandatoryPayments'), validatorObj.mandatoryPayments, input?.required), ...input })));
-
-    const METHODS_OF_OBTAIN = [
-        { id: 'office', text: 'В отделении Банка' },
-        { id: 'courier', text: 'Курьерская доставка' },
-    ];
-    const MethodObtainField = JSX(({ field, input }) => (jsx(RadioButtonGroupControl, { orientation: "horizontal", items: METHODS_OF_OBTAIN, ...getValidation(field('methodObtain'), validatorObj.methodObtain, input?.required) })));
-
-    const FIELD_NAME$1 = 'middleName';
-    const MiddleNameField = JSX(({ field, input }) => (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)", maxLength: 60, disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$1), ...getValidation(field(FIELD_NAME$1), validatorObj.middleName, input?.required), ...input })));
-
-    const NameField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0418\u043C\u044F", maxLength: 60, disabled: input?.filledByEsia && isEsiaAuthorize(field, input.name ?? ''), ...getValidation(field('name'), validatorObj.name, input?.required), ...input })));
-
-    const SlideCheckbox = JSX(({ value = false, text, type = 'checkbox', onChange }) => (jsxs("div", { role: type, "aria-checked": value, className: "flex justify-start items-center w-full cursor-pointer mb-s", onClick: () => onChange && onChange(!value), children: [jsx("div", { className: style('relative flex-shrink-0 duration-300 w-9 h-5 mr-s rounded-2xl', value ? 'bg-primary-main' : 'bg-main-divider'), children: jsx("div", { className: style('absolute opacity-80 duration-500 top-0.5 w-4 h-4 bg-white rounded-full', value ? 'left-1/2' : 'left-[5%]') }) }), text ? (jsx(Text, { size: "text-l", font: "font-light", color: "text-primary-text", children: text })) : null] })));
-
-    const OnlineCheckoutField = JSX(({ field }) => isAcquiringTrade(field('acquiringType')?.value?.key) ? (jsx(SlideCheckbox, { type: "radio", text: "\u0425\u043E\u0447\u0443 \u043E\u043D\u043B\u0430\u0439\u043D-\u043A\u0430\u0441\u0441\u0443", ...field('onlineCheckout') })) : null);
+            const handleResize = () => {
+                if (ref?.current) {
+                    const { top } = ref.current.getBoundingClientRect();
+                    const hasSpaceAbove = top > heightEl;
+                    setSpaceAbove(hasSpaceAbove);
+                }
+            };
+            handleResize();
+            window.addEventListener('resize', handleResize);
+            return () => window.removeEventListener('resize', handleResize);
+        }, [ref]);
+        return spaceAbove;
+    };
 
-    const OrganizationField = JSX(({ field, input }) => {
-        const { data: organization } = useLeadFormData('ORGANIZATION_TYPE');
-        return (jsx(SelectField, { field: field, source: organization, label: "\u0422\u0438\u043F \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", fieldName: "organization", input: input }));
-    });
+    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 = false, isDisabled = false) => style('p-s text-center rounded-md border', {
+        'border-transparent hover:bg-gray': !isToday,
+    }, isDisabled ? 'text-gray hover:bg-transparent' : 'cursor-pointer');
 
-    const OrganizationNameField = JSX(({ field, input }) => {
-        const onDaDataChange = useCallback((item) => {
-            field?.('inn')?.onChange?.(item.data?.inn);
-            field?.('legalForm')?.onChange?.(item.data?.opf?.short);
+    const WEEK_DAYS = ['Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб', 'Вс'];
+    const Calendar = JSX(({ today, currentMonth, currentYear, min, max, onDateSelect = noop, setValue = noop }) => {
+        const handleDateClick = useCallback((date) => {
+            onDateSelect(date);
+            setValue(false);
         }, []);
-        return (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", ...input, ...getValidation(field('organizationName'), validatorObj.organizationName, input?.required), onDaDataChange: onDaDataChange }));
-    });
-
-    const OtherIncomeField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0418\u043D\u044B\u0435 \u0434\u043E\u0445\u043E\u0434\u044B", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", ...getValidation(field('otherIncome'), validatorObj.otherIncome, input?.required), ...input })));
-
-    const ParticipantDateRegistrationField = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u043F\u043E \u043C\u0435\u0441\u0442\u0443 \u0436\u0438\u0442\u0435\u043B\u044C\u0441\u0442\u0432\u0430", ...getValidation(field('participantDateRegistration'), validatorObj.participantDateRegistration, input?.required) })));
-
-    const MAX_PART = 100;
-    const PartInBusinessField = JSX(({ field, input }) => {
-        const isBusinessOwner = field('positionOrganization')?.value?.key === 'BUSINESS_OWNER';
-        const partInBusinessField = {
-            ...getValidation(field('partInBusiness'), validatorObj.partInBusiness, input?.required),
-        };
-        const handleChange = (value) => partInBusinessField?.onChange &&
-            partInBusinessField?.onChange(String(Number(value) > MAX_PART ? MAX_PART : Number(value) || ''));
-        return (jsx(InputControl, { label: "\u0414\u043E\u043B\u044F \u0443\u0447\u0430\u0441\u0442\u0438\u044F \u0432 \u0431\u0438\u0437\u043D\u0435\u0441\u0435", placeholder: "\u0432 %", type: "number", maxLength: 3, ...partInBusinessField, ...input, onChange: handleChange, value: isBusinessOwner ? partInBusinessField?.value : '', disabled: !isBusinessOwner }));
-    });
-
-    const PartnerCommentsField = JSX(({ field, input }) => {
-        const { required, ...rest } = input;
-        return (jsx(InputControl, { ...getValidation(field('partnerComments'), validatorObj.partnerComments, required), placeholder: "\u0423\u043A\u0430\u0436\u0438\u0442\u0435 \u0438\u043D\u0442\u0435\u0440\u0435\u0441\u0443\u044E\u0449\u0438\u0439 \u0432\u0430\u0441 \u0432\u043E\u043F\u0440\u043E\u0441", isTextarea: true, ...rest }));
+        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 PAYMENT_SYSTEM_TYPES = [
-        { id: 'mir', text: 'Карта МИР' },
-        { id: 'union_pay', text: 'UnionPay' },
+    const months = [
+        'Январь',
+        'Февраль',
+        'Март',
+        'Апрель',
+        'Май',
+        'Июнь',
+        'Июль',
+        'Август',
+        'Сентябрь',
+        'Октябрь',
+        'Ноябрь',
+        'Декабрь',
     ];
-    const PaymentSystemField = JSX(({ field, input }) => {
-        const { value, onChange } = field('paymentSystem');
-        return (jsx(RadioButtonGroupControl, { label: "\u041F\u043B\u0430\u0442\u0435\u0436\u043D\u0430\u044F \u0441\u0438\u0441\u0442\u0435\u043C\u0430", orientation: "horizontal", items: PAYMENT_SYSTEM_TYPES, value: value, onChange: (_) => onChange?.(_), ...getValidation(field('paymentSystem'), validatorObj.paymentSystem, input?.required) }));
-    });
-
-    const isPlaceholder = (_) => _ === '_';
-    const isDigit = (_) => /\d/.test(_);
-    const isWildcard = (_) => isPlaceholder(_) || isDigit(_);
-    const phonePattern = [...'+7 (___) ___-__-__'];
-    const firstPlaceholderIndex = phonePattern.findIndex(isPlaceholder);
-    const phoneWildcardIndicies = phonePattern.map((_, i) => isWildcard(_) ? phonePattern.slice(0, i).filter(isWildcard).length : -1);
-    function normalizePhone(phone) {
-        const phoneNumbers = phone.replace(/\D/g, '');
-        const applyPlaceholder = (_, i) => isDigit(_) ? _ : phoneNumbers.charAt(phoneWildcardIndicies[i]) || _;
-        const result = phonePattern.map(applyPlaceholder);
-        const resultLength = phoneWildcardIndicies.indexOf(phoneNumbers.length - 1) + 1;
-        return (resultLength ? result.slice(0, Math.max(firstPlaceholderIndex, resultLength)) : result).join('');
-    }
-
-    const PhoneInput = JSX(({ children, onChange, ...inputProps }) => {
-        const handleChange = useCallback((v) => onChange && onChange(normalizePhone(v)), [onChange]);
-        const handleBlur = useCallback((v) => {
-            if (v === '+7 (') {
-                onChange && onChange('');
-            }
-        }, []);
-        return (jsx(Input, { ...inputProps, onChange: handleChange, onFocus: (ev) => handleChange(ev?.target?.value || ''), onBlur: (ev) => handleBlur(ev?.target?.value || ''), children: children }));
-    });
-
-    const InputPhoneControl = JSX(({ className, label, error, ...rest }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(PhoneInput, { "aria-label": label, label: getRequiredLabel({ label, errors: rest?.errors }), valid: Boolean(!error), placeholder: "+7 (___) ___-__-__", ...rest }), renderErrorText(error)] })));
-
-    const PhoneField = JSX(({ field, input }) => {
-        const fieldName = input?.name || 'phone';
-        return (jsx(InputPhoneControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...getValidation(field(fieldName), validatorObj.phone, input?.required), disabled: input?.filledByEsia && isEsiaAuthorize(field, fieldName), ...input }));
-    });
-
-    const PositionOrganizationField = JSX(({ field, input }) => {
-        const { data: positionOrganization } = useLeadFormData('POSITION');
-        return (jsx(SelectField, { field: field, source: positionOrganization, label: "\u0414\u043E\u043B\u0436\u043D\u043E\u0441\u0442\u044C \u0432 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", fieldName: "positionOrganization", input: input }));
-    });
-
-    const PosTerminalField = JSX(({ field }) => isAcquiringTrade(field('acquiringType')?.value?.key) ? (jsx(SlideCheckbox, { type: "radio", text: "\u0425\u043E\u0447\u0443 POS-\u0442\u0435\u0440\u043C\u0438\u043D\u0430\u043B", ...field('posTerminal') })) : null);
-
-    const ProductField = UniBlock(({ field, source }) => (jsx(SelectControl, { placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043F\u0440\u043E\u0434\u0443\u043A\u0442", label: "\u041F\u0440\u043E\u0434\u0443\u043A\u0442", options: arrayToOptions(source?.productList), ...withValidator(field('product'), validatorObj.product) })));
-    const arrayToOptions = (array) => (array ?? []).map((_) => ({ key: _, value: _ }));
 
-    const REGIONS_URL = `${API_BASE_URI}/regions`;
-    function useRegions(url = REGIONS_URL) {
-        const { data } = useAsyncData(url, fetchJSONUnsafe);
-        return Array.isArray(data) ? data : [];
+    function normalizeWithMask(value, pattern) {
+        const valueNumbers = value.replace(/\D/g, '');
+        if (valueNumbers === '' || value?.length === pattern.length) {
+            return value;
+        }
+        const patternInArr = [...pattern];
+        const firstPlaceholderIndex = patternInArr.findIndex(isPlaceholder$1);
+        const valueWildcardIndicies = patternInArr.map((_, i) => isWildcard$1(_) ? patternInArr.slice(0, i).filter(isWildcard$1).length : -1);
+        const applyPlaceholder = (_, i) => isDigit$1(_) ? _ : valueNumbers.charAt(valueWildcardIndicies[i]) || _;
+        const resultInArr = patternInArr.map(applyPlaceholder);
+        const resultLength = valueWildcardIndicies.indexOf(valueNumbers.length - 1) + 1;
+        return resultInArr.slice(0, Math.max(firstPlaceholderIndex, resultLength)).join('');
     }
+    const isPlaceholder$1 = (_) => _ === '_';
+    const isDigit$1 = (_) => /\d/.test(_);
+    const isWildcard$1 = (_) => isPlaceholder$1(_) || isDigit$1(_);
 
-    const RegionField = JSX(({ field, input, url }) => {
-        const regions = useRegions(url);
-        return (jsx(SelectControl, { 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: useMemo(() => regions?.map(({ code = '', name = '' }) => ({ key: code, text: name })), [regions]), ...getValidation(field('region'), validatorObj.region, input?.required) }));
-    });
-
-    const RegionPremiumField = JSX(({ field, input }) => {
-        const branchByRegions = useBranchesByRegions(true);
-        const regions = useMemo(() => branchByRegions?.map(({ region }) => ({
-            key: region,
-            text: region,
-        })), [branchByRegions]);
-        return (jsx(SelectControl, { label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", options: regions, ...getValidation(field('region'), validatorObj.region, input?.required) }));
-    });
-
-    const Foldable = JSX(({ className = '', isFoldButtonOnTop = false, unfoldedByDefault = false, renderFoldableSection, renderFoldButton, }) => {
-        const [isUnfolded, setIsUnfolded] = useState(unfoldedByDefault);
-        const onToggle = useCallback(() => {
-            setIsUnfolded((_) => !_);
-        }, []);
-        const sectionNode = renderFoldableSection({ isUnfolded, onToggle });
-        const buttonNode = renderFoldButton ? renderFoldButton({ isUnfolded, onToggle }) : null;
-        return isFoldButtonOnTop ? (jsxs("div", { className: className, role: "group", children: [buttonNode, sectionNode] })) : (jsxs("div", { className: className, role: "group", children: [sectionNode, buttonNode] }));
-    });
+    const START_YEAR = 1940;
+    const getYears = () => Array.from({ length: new Date().getFullYear() - START_YEAR + 1 }, (_, i) => START_YEAR + i);
 
-    function useResizeObserver(callback, deps) {
+    const ICON_PROPS$1 = {
+        name: 'CalendarIcon',
+        iconVersion: 'black',
+        width: '24',
+        height: '24',
+    };
+    const DatePickerInput = JSX(({ setSelectedMonth, setSelectedYear, className, value, disabled, onChange, onClick }) => {
         const ref = useRef(null);
-        useEffect(() => {
-            const element = ref?.current;
-            if (!element) {
-                return undefined;
+        const [inputValue, setInputValue] = useState(value || '');
+        const handleChange = (ev) => {
+            const val = ev.target?.value;
+            if (typeof val === 'string' && val?.length < 11) {
+                setInputValue(normalizeWithMask(val, '__.__.____'));
             }
-            const observer = new ResizeObserver((entries) => {
-                callback(element, entries[0]);
-            });
-            observer.observe(element);
-            return () => {
-                observer.disconnect();
-            };
-        }, [callback, ...deps]);
-        return ref;
-    }
-
-    const FoldableSection = JSX(({ className = '', isUnfolded, children }) => {
-        const containerRef = useRef(null);
-        const childrenWrapperRef = useResizeObserver((childrenWrapperEl) => {
-            if (containerRef.current) {
-                containerRef.current.style.maxHeight = isUnfolded
-                    ? `${childrenWrapperEl.scrollHeight}px`
-                    : '';
+        };
+        const onBlur = () => {
+            if (checkIsValidDate(inputValue)) {
+                const [day, month, year] = inputValue.split('.');
+                onChange?.(new Date(Number(year), Number(month) - 1, Number(day)));
+                setSelectedMonth(Number(month) - 1);
+                setSelectedYear(Number(year));
             }
-        }, [isUnfolded]);
-        return (jsx("div", { ref: containerRef, className: `transition-max-h duration-300 overflow-hidden ${containerRef.current || !isUnfolded ? 'max-h-0' : ''} `, children: jsx("div", { className: className, ref: childrenWrapperRef, children: children }) }));
-    });
-
-    const CardCell = JSX(({ value, subText, children, isPhone, ...props }) => {
-        const textItems = (Array.isArray(value) ? value : value?.split(',') ?? []).filter(Boolean);
-        if ([textItems.length, children, subText].every((_) => !_)) {
-            return null;
-        }
-        return renderCardCell({ textItems, subText, children, isPhone, ...props });
+            else {
+                setInputValue(value || '');
+            }
+        };
+        const onInputClick = () => {
+            if (ref.current !== null) {
+                ref.current.focus();
+            }
+            onClick?.();
+        };
+        useEffect(() => {
+            setInputValue(value || '');
+        }, [value]);
+        return (jsxs("div", { onClick: onInputClick, className: style('relative', className), children: [jsx("input", { ref: ref, className: "h-full w-full px-m text-l text-black focus-visible:outline-none", value: inputValue, type: "text", onChange: handleChange, onBlur: onBlur, disabled: disabled }), disabled ? null : jsx(Icon, { className: "mr-s", ...ICON_PROPS$1 })] }));
     });
-    const renderCardCell = ({ label, labelSize = 'text-m', textItems, subColor, subText, className, children, isPhone = false, }) => (jsxs("div", { className: style('flex gap-2xs flex-col h-full max-w-[300px]', className), children: [label ? (jsx(Text, { color: "text-secondary-text", font: "font-light", size: labelSize, children: label })) : null, children || renderTextItems(textItems, isPhone), subText ? (jsx(Text, { color: subColor, size: "text-m", children: subText })) : null] }));
-    const renderTextItems = (textItems, isPhone) => textItems.filter(Boolean).map((text, i) => (jsx(Text, { size: "text-l", children: isPhone ? jsx("a", { href: `tel:${cleanPhoneNumber(text)}`, children: text.trim() }) : text.trim() }, String(i))));
-    const cleanPhoneNumber = (phone) => phone.replace(/\D/g, '');
+    const isValidYear = (year) => Number(year) >= START_YEAR && Number(year) <= new Date().getFullYear();
+    const isValidMonth = (month) => Number(month) > 0 && Number(month) < 13;
+    const checkIsValidDate = (date) => {
+        const [day, month, year] = date.split('.');
+        if (isValidYear(year)) {
+            if (isValidMonth(month)) {
+                const currentDate = new Date(Number(year), Number(month) - 1, 1);
+                let maxDateOfMonth = 0;
+                while (currentDate.getMonth() === Number(month) - 1) {
+                    currentDate.setDate(currentDate.getDate() + 1);
+                    maxDateOfMonth++;
+                }
+                if (Number(day) > 0 && Number(day) <= maxDateOfMonth) {
+                    return true;
+                }
+            }
+        }
+        return false;
+    };
 
-    const CardRow = JSX(({ className, children }) => (jsx("div", { className: style('flex flex-col sm:flex-row sm:border-t sm:border-solid sm:border-main-divider py-xl gap-x-6xl gap-y-xl', className), children: children })));
+    const formStyle = 'flex justify-between items-center h-14 border rounded-md cursor-pointer ' +
+        'hover:border-black active:border-black focus:border-black';
+    const renderDatePickerForm = ({ handleChangeVisibleCalendar, value, valid, onChange, setSelectedMonth, setSelectedYear, disabled = false, }) => (jsx(DatePickerInput, { onChange: onChange, disabled: disabled, onClick: handleChangeVisibleCalendar, value: value && formatDate(value), setSelectedMonth: setSelectedMonth, setSelectedYear: setSelectedYear, className: style(formStyle, valid ? 'border-gray' : 'border-error') }));
 
-    const getScheduleDescription = (workScheduleWeek) => {
-        const rows = getDateDescription(workScheduleWeek);
-        return jsx(CardCell, { label: "\u0420\u0435\u0436\u0438\u043C \u0440\u0430\u0431\u043E\u0442\u044B", value: rows, className: "max-w-none" });
+    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, onChange, value, }) => {
+        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 maxDateOfMonth = calculateMaxDaysOfMonth(selectedYear, months.indexOf(key));
+            handleChangeMonth({
+                maxDateOfMonth,
+                selectedYear,
+                selectedMonth: months.indexOf(key),
+                value,
+                onChange,
+            });
+        }, [value]);
+        const handleSelectYear = useCallback(({ key }) => {
+            onYearSelect(Number(key));
+            value && onChange?.(new Date(Number(key), selectedMonth, value?.getDate()));
+        }, [value]);
+        return {
+            handleChangeVisibleCalendar,
+            handleNextMonth,
+            handlePrevMonth,
+            handleSelectMonth,
+            handleSelectYear,
+            monthsOptions: MONTHS_OPTIONS,
+            yearsOptions: YEARS_OPTIONS,
+            ref,
+        };
     };
-    const buildScheduleText = ({ workTime = '', lunchHour = '', daysOff = '' }, isSaturday = false) => {
-        if (!workTime) {
-            return '';
+    const calculateMaxDaysOfMonth = (selectedYear, selectedMonth) => {
+        const date = new Date(selectedYear, selectedMonth, 1);
+        let maxDateOfMonth = 0;
+        while (date.getMonth() === selectedMonth) {
+            maxDateOfMonth++;
+            date.setDate(date.getDate() + 1);
         }
-        return [
-            `${isSaturday ? 'Суббота' : 'Будние дни'}: ${workTime}`,
-            lunchHour ? `перерыв: ${lunchHour}` : '',
-            daysOff ? `не работает: ${daysOff}` : '',
-        ]
-            .filter(Boolean)
-            .join('; ');
+        return maxDateOfMonth;
     };
-    const getDateDescription = (workScheduleWeek) => {
-        const workingWeekday = workScheduleWeek.find((_) => _.key !== 'workingSaturday' && Boolean(_.status) && Boolean(_.workTime));
-        const workingSaturday = workScheduleWeek.find((_) => _.key === 'workingSaturday' && Boolean(_.status) && Boolean(_.workTime));
-        const daysOff = workScheduleWeek
-            .filter((_) => !_.status)
-            .map((_) => _.short?.toLowerCase())
-            .join(', ');
-        const rows = [
-            buildScheduleText({
-                workTime: workingWeekday?.workTime,
-                lunchHour: workingWeekday?.lunchHour,
-                daysOff: workingSaturday ? '' : daysOff,
-            }),
-            buildScheduleText({ workTime: workingSaturday?.workTime, lunchHour: workingSaturday?.lunchHour, daysOff }, true),
-        ].filter(Boolean);
-        return rows;
+    const handleChangeMonth = ({ maxDateOfMonth, selectedYear, selectedMonth, value, onChange, }) => {
+        value &&
+            onChange?.(new Date(selectedYear, selectedMonth, Math.min(maxDateOfMonth, value.getDate())));
     };
 
-    const WEEKDAY_MAP = [
-        ['workingMonday', 'Пн', 'Понедельник'],
-        ['workingTuesday', 'Вт', 'Вторник'],
-        ['workingWednesday', 'Ср', 'Среда'],
-        ['workingThursday', 'Чт', 'Четверг'],
-        ['workingFriday', 'Пт', 'Пятница'],
-        ['workingSaturday', 'Сб', 'Суббота'],
-        ['workingSunday', 'Вс', 'Воскресенье'],
-    ];
-    const getWorkScheduleWeek = (workSchedule) => WEEKDAY_MAP.map(([key, short, title]) => ({
-        key,
-        title,
-        short,
-        status: Boolean(workSchedule?.[key]),
-        get workTime() {
-            return key === 'workingSaturday' ? workSchedule?.workTimeSaturday : workSchedule?.workTime;
-        },
-        get lunchHour() {
-            return key === 'workingSaturday' ? workSchedule?.lunchHourSaturday : workSchedule?.lunchHour;
-        },
-        get hasLunch() {
-            return /\d+/.test(this.lunchHour ?? '');
-        },
-    }));
-
-    const renderBusinessSchedule = (scheduleDescription) => {
-        if (!scheduleDescription) {
-            return null;
-        }
-        const businessSchedule = getBusinessSchedule(scheduleDescription);
-        return (jsxs(CardRow, { className: "border-none", children: [jsx(CardCell, { label: "\u0414\u043B\u044F \u044E\u0440\u0438\u0434\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", labelSize: "text-l", children: jsx("div", { className: "flex gap-1", children: businessSchedule.map(renderAlternativeDay) }) }), jsx(CardCell, { label: "\u0420\u0435\u0436\u0438\u043C \u0440\u0430\u0431\u043E\u0442\u044B", className: "max-w-none", children: jsx(Text, { children: scheduleDescription }) })] }));
+    const ICON_PROPS = {
+        name: 'ArrowUpIcon',
+        iconVersion: 'black',
+        width: '24',
+        height: '24',
     };
-    const getBusinessSchedule = (scheduleDescription) => {
-        const weekDayMap = WEEKDAY_MAP.map(([, short]) => ({ short, status: true }));
-        const splittedScheduleDescription = scheduleDescription.split('/') ?? [];
-        const lastPartScheduleDescription = splittedScheduleDescription[splittedScheduleDescription.length - 1]?.toLowerCase();
-        if (!lastPartScheduleDescription?.includes('выходной')) {
-            return weekDayMap;
-        }
-        return weekDayMap.map((_) => ({
-            ..._,
-            status: !lastPartScheduleDescription?.includes(_.short.toLowerCase()),
-        }));
+    const SELECT_PROPS = {
+        className: 'min-w-32',
+        iconVersion: 'black',
+        isBorder: false,
     };
-    const renderAlternativeDay = ({ short, status }, i) => (jsx("div", { className: style('w-9 h-9 rounded-md flex items-center justify-center', status ? 'bg-green-more-light text-green-dark' : 'bg-error/30 text-error'), children: jsx(Text, { size: "text-xs", children: short }) }, String(i)));
+    const DatePicker = JSX(
+    // eslint-disable-next-line max-lines-per-function
+    ({ className = '', label = '', value, valid = true, minDate, maxDate, disabled, 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,
+            onChange,
+            value,
+        });
+        const spaceAbove = useElementSpace(ref, 370);
+        return (jsxs("div", { className: style('space-y-xs', className), ref: ref, children: [renderLabel(label), jsxs("div", { className: "relative", children: [renderDatePickerForm({
+                            handleChangeVisibleCalendar,
+                            value,
+                            valid,
+                            onChange,
+                            disabled,
+                            setSelectedMonth,
+                            setSelectedYear,
+                        }), showCalendar && !disabled ? (jsxs("div", { className: style('absolute bg-white z-20 select-none', {
+                                'bottom-full': spaceAbove,
+                            }), 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, setValue: setValue })] })) : null] })] }));
+    });
 
-    const renderCurrency = ({ currency, buyExchangeRate, saleExchangeRate }, i) => (jsxs("div", { className: "flex gap-lg h-full", children: [currency?.currency ? jsx(CardCell, { label: "\u0412\u0430\u043B\u044E\u0442\u0430", value: currency.currency }) : null, buyExchangeRate ? jsx(CardCell, { label: "\u041A\u0443\u043F\u0438\u0442\u044C", value: String(buyExchangeRate) }) : null, saleExchangeRate ? jsx(CardCell, { label: "\u041F\u0440\u043E\u0434\u0430\u0442\u044C", value: String(saleExchangeRate) }) : null] }, String(i)));
+    const DatePickerControl = JSX(({ className, label, error, errors, ...rest }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(DatePicker, { label: getRequiredLabel({ label, errors }), valid: Boolean(!error), ...rest }), renderErrorText(error)] })));
 
-    const colorStyle = {
-        yellow: { border: 'border-yellow-light', text: 'text-yellow' },
-        green: { border: 'border-green-more-light', text: 'text-green-dark' },
-        gray: { border: 'border-gray', text: 'text-secondary-text' },
-        red: { border: 'border-error/30', text: 'text-error' },
-    };
-    const Badge$1 = JSX(({ className, children, color = 'gray' }) => (jsxs("div", { className: style('sm:p-s sm:border sm:border-green rounded-md flex items-center h-fit', colorStyle[color].border, className), children: [jsx("div", { className: "block pr-m sm:pr-0 sm:hidden", children: jsx(Img, { image: { icon: 'SmallClockIcon' }, width: "24", height: "24" }) }), jsx(Text, { size: "text-m", color: colorStyle[color].text, children: children })] })));
+    const BeginDateField = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u043D\u0430\u0447\u0430\u043B\u0430 \u0440\u0430\u0431\u043E\u0442\u044B \u043D\u0430 \u0442\u0435\u043A\u0443\u0449\u0435\u043C \u043C\u0435\u0441\u0442\u0435", ...getValidation(field('beginDate'), validatorObj.beginDate, input?.required), ...input })));
 
-    const currentWeekDayIdx = new Date().getDay();
-    //TODO: Add logic time https://github.com/redneckz/wildless-cms-uni-blocks/pull/1549
-    const renderCurrentDaySchedule = (workScheduleWeek) => {
-        const [currentWeekDay] = workScheduleWeek?.slice(currentWeekDayIdx - 1) ?? [];
-        if (!currentWeekDay) {
-            return null;
+    const MIN_AGE = 23;
+    const MAX_AGE = 75;
+    const AGE_ERROR_MESSAGE = 'Допустимый возраст заёмщика - от 23 до 75 лет';
+    const FIELD_NAME$8 = 'birthday';
+    const BirthdayField = JSX(({ field, input, isRetailForm = false }) => {
+        const { value } = field(FIELD_NAME$8);
+        return (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F", ...getValidation(field(FIELD_NAME$8), validatorObj.birthday, input?.required), error: isRetailForm && value && !birthdayValidate(value) ? AGE_ERROR_MESSAGE : '', disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$8) }));
+    });
+    const birthdayValidate = (date) => {
+        const today = new Date();
+        const minDate = new Date(today.getFullYear() - MIN_AGE, today.getMonth(), today.getDate());
+        const maxDate = new Date(today.getFullYear() - MAX_AGE, today.getMonth(), today.getDate());
+        if (!date || date > minDate || date < maxDate) {
+            return false;
         }
-        const { lunchHour, status, workTime, hasLunch } = currentWeekDay;
-        return status ? (jsxs("div", { className: "flex gap-s items-start whitespace-nowrap", children: [workTime ? jsx(Badge$1, { color: "green", children: workTime }) : null, lunchHour && hasLunch ? jsx(Badge$1, { color: "yellow", children: `перерыв: ${lunchHour}` }) : null] })) : (jsx(Badge$1, { color: "red", children: "\u0412\u044B\u0445\u043E\u0434\u043D\u043E\u0439" }));
+        return true;
     };
 
-    const getSubTextLunch = ({ lunchHour, hasLunch = false, status = false }) => {
-        if (!status) {
-            return 'Не работает';
-        }
-        return lunchHour && hasLunch ? `Перерыв ${lunchHour}` : lunchHour;
-    };
-    const renderDay = ({ title, status, workTime, lunchHour, hasLunch }, i) => (jsx(CardCell, { label: title, value: status && workTime ? workTime : '', subText: getSubTextLunch({ lunchHour, hasLunch, status }), subColor: !status || hasLunch ? 'text-error' : 'text-green-dark' }, String(i)));
+    const FIELD_NAME$7 = 'birthPlace';
+    const BirthPlaceField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041C\u0435\u0441\u0442\u043E \u0440\u043E\u0436\u0434\u0435\u043D\u0438\u044F", ...getValidation(field('birthPlace'), validatorObj.birthPlace, input?.required), ...input, disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$7) })));
 
-    const ICONS$1 = ['ArrowDownIcon', 'ArrowUpIcon'];
-    const labels = ['Подробнее', 'Скрыть'];
-    const renderFoldButton$3 = ({ isUnfolded, onToggle }) => (jsxs("button", { className: "w-full py-2xl cursor-pointer text-primary-main flex items-center border-b border-solid border-main-divider", onClick: onToggle, type: "button", children: [jsx("div", { className: "pr-m", children: labels[Number(isUnfolded)] }), jsx(Icon, { className: "text-primary-text", name: ICONS$1[Number(isUnfolded)], width: "16", height: "16" })] }));
+    const CardCategoryField = JSX(({ field, input }) => {
+        const { data: cardCategory } = useLeadFormData('CARD_TYPE');
+        return (jsx(SelectField, { field: field, source: cardCategory, label: "\u041A\u0430\u0442\u0435\u0433\u043E\u0440\u0438\u044F \u043A\u0430\u0440\u0442\u044B", fieldName: "cardCategory", input: input }));
+    });
 
-    const renderWorkSchedule = (workSchedule) => {
-        const workScheduleWeek = getWorkScheduleWeek(workSchedule);
-        const timeOfWork = workSchedule ? getDateDescription(workScheduleWeek) : '';
-        const businessTimeOfWork = workSchedule ? workSchedule.businessScheduleDescription : '';
-        if (!workSchedule) {
-            return null;
-        }
-        if (!workSchedule.businessScheduleVisibleTag) {
-            return renderMatchingTimeOfWork(timeOfWork);
-        }
-        if (workSchedule.businessScheduleVisibleTag &&
-            workSchedule.businessScheduleDescription === null) {
-            return renderIndividualTimeOfWork(timeOfWork);
-        }
-        return renderDefaultTimeOfWork(timeOfWork, businessTimeOfWork);
-    };
-    const renderIndividualTimeOfWork = (timeOfWork) => `<p><b>Режим обслуживания физ.лиц:<br/></b>${timeOfWork}</p>`;
-    const renderMatchingTimeOfWork = (timeOfWork) => `<p><b>Режим обслуживания физ. и юр. лиц:<br/></b> ${timeOfWork}</p>`;
-    const renderDefaultTimeOfWork = (timeOfWork, businessTimeOfWork) => `<p><b>Режим обслуживания физ.лиц:<br/></b>${timeOfWork}</p> <p><b>Режим обслуживания юр.лиц:<br/></b>${businessTimeOfWork}</p>`;
+    const ChildrenField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0434\u0435\u0442\u0435\u0439 \u0434\u043E 18 \u043B\u0435\u0442", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", ...getValidation(field('children'), validatorObj.children, input?.required), ...input })));
 
-    const renderOfficeCard = ({ name, address, phone, fax, phoneBusiness, phoneNatural, phoneCallCentre, phoneCurrencyControl, workSchedule, exchangeRate, }, i) => {
-        if (!workSchedule) {
-            return null;
-        }
-        const workScheduleWeek = getWorkScheduleWeek(workSchedule);
-        return (jsxs("div", { className: "bg-white col-span-12 p-3xl sm:border-green sm:border", children: [jsxs("div", { className: "sm:flex sm:justify-between", children: [jsxs("div", { children: [jsx(Text, { size: "text-h4", children: name }), address ? (jsxs("div", { className: "flex pb-xl pt-xs gap-2xs", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24" }), jsx(Text, { size: "text-l", children: address })] })) : null] }), renderCurrentDaySchedule(workScheduleWeek)] }), jsx("div", { className: "hidden sm:block", children: renderCardContent$1({
-                        phone,
-                        fax,
-                        phoneBusiness,
-                        phoneNatural,
-                        phoneCallCentre,
-                        phoneCurrencyControl,
-                        workSchedule,
-                        exchangeRate,
-                    }) }), jsx(Foldable, { className: "block sm:hidden", renderFoldableSection: ({ isUnfolded }) => {
-                        return (jsx(FoldableSection, { isUnfolded: isUnfolded, children: renderCardContent$1({
-                                phone,
-                                fax,
-                                phoneBusiness,
-                                phoneNatural,
-                                phoneCallCentre,
-                                phoneCurrencyControl,
-                                workSchedule,
-                                exchangeRate,
-                            }) }));
-                    }, 
-                    //** TODO: remove styles with refactoring  DefaultFoldButton*/
-                    renderFoldButton: ({ isUnfolded, onToggle }) => renderFoldButton$3({ isUnfolded, onToggle }) })] }, String(i)));
-    };
-    const renderCardContent$1 = ({ phone, fax, phoneBusiness, phoneNatural, phoneCallCentre, phoneCurrencyControl, workSchedule, exchangeRate, }) => {
-        const workScheduleWeek = getWorkScheduleWeek(workSchedule);
-        const labelSchedule = workSchedule?.businessScheduleVisibleTag
-            ? 'Для физических лиц'
-            : 'Для физических и юридических лиц';
-        return (jsxs("div", { children: [jsxs(CardRow, { className: "flex-wrap border-b border-solid border-main-divider", children: [jsx(CardCell, { label: "\u0424\u0430\u043A\u0441", value: fax, isPhone: true }), jsx(CardCell, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D \u0444\u0438\u043B\u0438\u0430\u043B\u0430", value: phone, isPhone: true }), jsx(CardCell, { label: "\u0414\u043B\u044F \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0439 \u044E\u0440\u0438\u0434\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", value: phoneBusiness, isPhone: true }), jsx(CardCell, { label: "\u041E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u0435 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", value: phoneNatural, isPhone: true }), jsx(CardCell, { label: "\u0414\u043B\u044F \u043A\u043E\u043D\u0441\u0443\u043B\u044C\u0442\u0430\u0446\u0438\u0439 \u043F\u043E \u0432\u0430\u043B\u044E\u0442\u043D\u043E\u043C\u0443 \u043A\u043E\u043D\u0442\u0440\u043E\u043B\u044E", value: phoneCurrencyControl, isPhone: true }), jsx(CardCell, { label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442-\u0446\u0435\u043D\u0442\u0440", value: phoneCallCentre, isPhone: true })] }), workSchedule?.isMatchesPattern ? (jsx(CardRow, { children: jsx(CardCell, { label: labelSchedule, labelSize: "text-l", className: "w-full max-w-none", children: jsx("div", { className: "flex flex-wrap gap-xs sm:justify-between pt-xs", children: workScheduleWeek?.map(renderDay) }) }) })) : (jsxs(CardRow, { children: [jsx(CardCell, { label: labelSchedule, labelSize: "text-l", children: jsx("div", { className: "flex gap-1", children: workScheduleWeek?.map(renderAlternativeDay) }) }), getScheduleDescription(workScheduleWeek)] })), workSchedule?.businessScheduleVisibleTag
-                    ? renderBusinessSchedule(workSchedule?.businessScheduleDescription)
-                    : null, exchangeRate?.currencies?.length ? (jsx(CardRow, { className: "flex-wrap", children: exchangeRate?.currencies?.map(renderCurrency) })) : null] }));
-    };
-    const capitalizedFirstLetter$1 = (text) => text ? `${text?.charAt(0)?.toUpperCase()}${text?.slice(1)}` : '';
-    const getOfficePoint = ({ name = '', address = '', workSchedule }) => {
-        const header = capitalizedFirstLetter$1(name);
-        const body = `${address} ${renderWorkSchedule(workSchedule)}`;
-        return { header, body };
-    };
+    const CodeWordField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u0434\u043E\u0432\u043E\u0435 \u0441\u043B\u043E\u0432\u043E", ...getValidation(field('codeWord'), validatorObj.codeWord, input?.required), ...input })));
 
-    const isSSR = () => Boolean(typeof globalThis.process === 'object' && globalThis.process && globalThis.process.version);
+    const CollectionCountField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043E\u0431\u044A\u0435\u043A\u0442\u043E\u0432 \u0438\u043D\u043A\u0430\u0441\u0441\u0430\u0446\u0438\u0438", type: "number", ...getValidation(field('collectionCount'), validatorObj.collectionCount, input?.required) })));
 
-    const isClient = !isSSR();
-    const ClientOnly = JSX(({ children }) => (isClient ? children : null));
+    const CommentField = JSX(({ field, input }) => (jsx(InputControl, { className: "col-span-2", ...getValidation(field('comment'), validatorObj.comment, input?.required), placeholder: "\u0412\u0430\u0448\u0435 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435", isTextarea: true })));
 
-    const Loader = JSX(({ color = 'text-primary-main', position = 'absolute', blur = true }) => (jsx("div", { className: style('flex justify-center items-center h-full w-full z-50', position, {
-            'backdrop-blur': blur,
-        }), children: jsx("div", { className: style('inline-block h-28 w-28', 'animate-spin rounded-full', 'border-8 border-solid border-current', 'border-r-transparent', color), role: "status" }) })));
+    const ConfirmationIncomeField = JSX(({ field, input }) => {
+        const { data: confirmationIncome } = useLeadFormData('INCOME_CERT_UNITED');
+        return (jsx(SelectField, { field: field, source: confirmationIncome, label: "\u0421\u043F\u043E\u0441\u043E\u0431 \u043F\u043E\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0435\u043D\u0438\u044F \u0434\u043E\u0445\u043E\u0434\u0430", fieldName: "confirmationIncome", input: input }));
+    });
 
-    const MapMarkerClusterIcon = '/icons/MapMarkerClusterIcon.svg';
-    const MapMarkerClusterYellowIcon = '/icons/MapMarkerClusterYellowIcon.svg';
-    function renderClusterer({ yandexMaps, map, points, isLoad, }) {
-        if (isLoad || !points) {
-            return;
-        }
-        map.geoObjects.removeAll();
-        if (!points.length) {
-            return;
-        }
-        const clusterIconContentLayout = yandexMaps.templateLayoutFactory.createClass('<div style="margin-top: -3px;">{{properties.geoObjects.length}}</div>');
-        const officeClusterer = defineClusterer('offices', yandexMaps, clusterIconContentLayout);
-        if (points.length && points.every((_) => 'type' in _)) {
-            const remoteWorkplaceClusterer = defineClusterer('workplaces', yandexMaps, clusterIconContentLayout);
-            const remoteWorkplaceGeoObjects = defineGeoObjects(points.filter((_) => _.type === 'workplaces'), 'workplaces', yandexMaps);
-            const officesGeoObjects = defineGeoObjects(points.filter((_) => _.type === 'offices'), 'offices', yandexMaps);
-            officeClusterer.add(officesGeoObjects);
-            remoteWorkplaceClusterer.add(remoteWorkplaceGeoObjects);
-            map.geoObjects.add(remoteWorkplaceClusterer);
-            map.geoObjects.add(officeClusterer);
-        }
-        else {
-            const geoObjects = defineGeoObjects(points, 'offices', yandexMaps);
-            officeClusterer.add(geoObjects);
-            map.geoObjects.add(officeClusterer);
-        }
-        map.setBounds(yandexMaps.util.bounds.fromPoints(points.map((_) => _.coords))).then(() => {
-            if (map.getZoom() > 10) {
-                map.setZoom(10);
-            }
-        });
-    }
-    const defineClusterer = (type, yandexMaps, clusterIconContentLayout) => {
-        return new yandexMaps.Clusterer({
-            clusterIcons: [
-                {
-                    href: type === 'offices' ? MapMarkerClusterIcon : MapMarkerClusterYellowIcon,
-                    size: [78, 84],
-                    offset: [-35, -50],
-                },
-            ],
-            clusterIconContentLayout,
-            clusterHideIconOnBalloonOpen: false,
-            geoObjectHideIconOnBalloonOpen: false,
-        });
+    const ConscriptionField = JSX(({ field, input }) => {
+        const { data: conscription } = useLeadFormData('MILITARY_STATUS');
+        return (jsx(SelectField, { field: field, source: conscription, label: "\u0421\u0442\u0430\u0442\u0443\u0441 \u0432\u043E\u0435\u043D\u043D\u043E\u043E\u0431\u044F\u0437\u0430\u043D\u043D\u043E\u0433\u043E", fieldName: "conscription", input: input }));
+    });
+
+    const CONSENTS = {
+        processPersonalDataFlg: {
+            text: 'Согласие на обработку персональных данных',
+            docId: 4,
+        },
+        consentInformFlg: {
+            text: 'Согласие на информирование о продуктах и услугах Банка',
+            docId: 14,
+        },
+        consentProviderFlg: {
+            text: 'Согласие об использовании простой электронной подписи',
+            docId: 5,
+        },
+        consentOthersFlg: {
+            text: 'Прочие согласия',
+            docId: 1,
+        },
+        consentPfrFlg: {
+            text: 'Согласие на запрос в ПФР',
+            docId: 3,
+        },
+        consentToReceiveMaterials: {
+            text: 'Согласен на получение информационных и аналитических материалов по электронной почте',
+        },
     };
-    const defineGeoObjects = (pointArr, type, yandexMaps) => {
-        return pointArr.map(({ coords, content }) => new yandexMaps.Placemark(coords, {
-            balloonContentHeader: content?.header,
-            balloonContentBody: content?.body,
-            balloonContentFooter: content?.footer,
-            hintContent: content?.hint,
-        }, {
-            iconLayout: 'default#image',
-            iconImageHref: type === 'offices' ? MapMarkerClusterIcon : MapMarkerClusterYellowIcon,
-            iconImageSize: [78, 84],
-            iconImageOffset: [-35, -50],
-        }));
+
+    const feedbackById = async (id, convertToPng = false) => {
+        const response = await doRequest(`/feedback/file?id=${encodeURIComponent(id)}&convertToPngFlg=${convertToPng}`, 'GET');
+        return await response.blob();
     };
 
-    const defaultStyle = {
-        focus: 'focus:border-primary-text focus:border',
-        hover: 'hover:bg-primary-hover',
-        active: 'active:bg-primary-active',
-        font: 'text-center font-sans',
+    const getDocument = async (id, convertToPng = false) => {
+        const response = await feedbackById(id, convertToPng);
+        return URL.createObjectURL(response);
     };
 
-    const styles$1 = {
-        ...defaultStyle,
-        border: 'border border-transparent rounded-md',
-        position: 'absolute flex items-center justify-center',
+    const CloseButton = JSX(({ className, onClose }) => (jsx("button", { className: style('flex justify-center items-center w-12 h-12 p-2xs bg-transparent border-none', className), onClick: onClose, title: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C", type: "button", children: jsx(Icon, { name: "CloseIcon", width: "20", height: "20", iconVersion: "gray" }) })));
+
+    const Dialog = JSX(({ className, head, children, onClose, onClick }) => {
+        const { close } = useDialogManager();
+        const handleClose = useCallback(() => {
+            close();
+            onClose && onClose();
+        }, [onClose]);
+        return (jsxs("div", { onClick: onClick, className: style('relative min-h-full bg-white pt-0 p-lg', className), role: "dialog", children: [jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [jsx(CloseButton, { className: "absolute top-0 right-0", onClose: handleClose }), jsx("div", { className: "container", children: head })] }), jsx("div", { className: "container pb-6xl", children: children })] }));
+    });
+
+    const openDocument = async (open, id, convertToPng = false) => {
+        const document = await getDocument(id, convertToPng);
+        open(jsx(Dialog, { className: "my-6xl max-w-4xl mx-auto px-0 min-h-0 pb-0", children: convertToPng ? (jsx("img", { src: document })) : (jsx("iframe", { src: `${document}#toolbar=0`, className: "w-full h-[80vh]", id: "iframe-dialog" })) }));
     };
-    const renderUserGeolocation = (map, yandexMaps, className) => {
-        const setUserGeoLocation = () => {
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
-            yandexMaps.geolocation
-                .get({
-                provider: 'yandex',
-                autoReverseGeocode: true,
-                mapStateAutoApply: true,
-            })
-                .then(function (result) {
-                map.current.geoObjects.add(result.geoObjects);
-            });
-        };
-        return (jsx("div", { className: `select-none cursor-pointer py-m w-12 bg-white ${Object.values(styles$1).join(' ')} ${className}`, onClick: setUserGeoLocation, children: jsx(Icon, { name: "UserGeoLocationIcon", width: "20", height: "16" }) }));
+
+    const OPEN_DOC_BUTTON_TEXT = 'Ознакомиться';
+    const CheckboxWithDoc = JSX(({ className, error, docId, ...props }) => {
+        const { open } = useDialogManager();
+        const isMobile = useMobileMode();
+        return (jsxs("div", { className: className, children: [jsxs("div", { className: "flex flex-wrap gap-x-m", children: [jsx(Checkbox, { ...props }), docId ? (jsx(LinkButton, { className: "text-primary-main", onClick: () => openDocument(open, docId, isMobile), children: jsx(Text, { children: OPEN_DOC_BUTTON_TEXT }) })) : null] }), renderErrorText(error)] }));
+    });
+
+    const ConsentField = JSX(({ field, input }) => input && input.name ? (jsx(CheckboxWithDoc, { text: CONSENTS[input.name]?.text, docId: CONSENTS[input.name]?.docId, ...getValidation(field(input.name), validatorObj[input.name], input?.required) })) : null);
+
+    const LABEL_TEXT = `Имеет ли юридическое лицо, акционером / участником / членом / пайщиком / 
+    вкладчиком с долей участия более 20% уставного капитала руководителем, 
+    которого Вы являетесь, кредит в АО «Россельхозбанк»`;
+    const CreditInRshbCdField = JSX(({ field, input }) => {
+        const { data: creditInRshbCd } = useLeadFormData('CREDIT_IN_RSHB');
+        return (jsx(SelectField, { field: field, source: creditInRshbCd, label: LABEL_TEXT, fieldName: "creditInRshbCd", input: input }));
+    });
+
+    const orientationStyleMap = {
+        horizontal: '@lg:flex-row',
+        vertical: '',
     };
+    const RadioButtonGroup = JSX(({ label, items, value, className, onChange: onChangeCheckedItem, disabled = false, orientation = 'horizontal', }) => (jsxs("div", { className: "grid gap-xs whitespace-nowrap", children: [label ? (jsx("div", { role: "radiogroup", "aria-label": label, children: jsx(Text, { color: "text-secondary-text", font: "font-light", children: label }) })) : null, jsx("div", { className: style('flex flex-col gap-s', orientationStyleMap[orientation], className), role: "radiogroup", "aria-label": "\u0413\u0440\u0443\u043F\u043F\u0430 \u043A\u043D\u043E\u043F\u043E\u043A", children: items?.map(({ id, text }) => (jsx(Checkbox, { isRadio: true, text: text, value: value === id, onChange: () => onChangeCheckedItem && onChangeCheckedItem(id), disabled: disabled }, String(id)))) })] })));
 
-    const getNS = (_) => globalThis[_];
-    const initializeExternalNS = (namespaceName, url) => {
-        const script = document.getElementById(url);
-        if (script) {
-            const ns = getNS(namespaceName);
-            if (ns) {
-                return Promise.resolve(ns);
-            }
-            else {
-                return new Promise((resolve) => {
-                    script.addEventListener('load', () => {
-                        resolve(getNS(namespaceName));
-                    });
-                });
-            }
-        }
-        else {
-            return new Promise((resolve, reject) => {
-                const newScript = document.createElement('script');
-                newScript.src = url;
-                newScript.async = true;
-                newScript.id = url;
-                newScript.addEventListener('load', () => {
-                    resolve(getNS(namespaceName));
-                });
-                newScript.addEventListener('error', (error) => {
-                    reject(error);
-                });
-                document.head.appendChild(newScript);
-            });
-        }
-    };
-    function useExternalNS(namespaceName, url, unmountNS = true) {
-        const [externalNS, setExternalNS] = useState(undefined);
-        useEffect(() => {
-            let isMounted = true;
-            initializeExternalNS(namespaceName, url)
-                .then((ns) => {
-                if (isMounted) {
-                    setExternalNS(ns);
-                }
-            })
-                .catch((error) => {
-                console.error(`Failed to initialize external namespace: ${error}`);
-            });
-            return () => {
-                isMounted = false;
-                if (unmountNS) {
-                    const script = document.getElementById(url);
-                    if (script) {
-                        document.head.removeChild(script);
-                    }
-                    setExternalNS(undefined);
-                }
-            };
-        }, [namespaceName, url, unmountNS]);
-        return externalNS;
-    }
+    const RadioButtonGroupControl = JSX(({ className, label, onChange, error, ...rest }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(RadioButtonGroup, { label: getRequiredLabel({ label, errors: rest?.errors }), onChange: (_) => onChange && onChange(_), ...rest }), renderErrorText(error)] })));
 
-    const YMAPS_NAMESPACE = 'ymaps';
-    const useYandexMaps = () => {
-        const url = `https://api-maps.yandex.ru/2.1/?apikey=${projectSettings.YANDEX_MAP_API_KEY || ''}&lang=ru_RU`;
-        return useExternalNS(YMAPS_NAMESPACE, url, false);
-    };
+    const CURRENCY_TYPES = [{ id: 'rub', text: 'Рубль' }];
+    const CurrencyField = JSX(({ field, input }) => {
+        const { value, onChange } = field('currency');
+        return (jsx(RadioButtonGroupControl, { label: "\u0412\u0430\u043B\u044E\u0442\u0430", orientation: "horizontal", items: CURRENCY_TYPES, value: value, onChange: (_) => onChange?.(_), ...getValidation(field('currency'), validatorObj.currency, input?.required) }));
+    });
 
-    const styles = {
-        ...defaultStyle,
-        border: 'border-b border-b-2 border-gray last:border-0',
-        position: 'relative flex items-center justify-center',
-    };
-    // TODO: Добавить метод определения центральной точки
-    const ZoomButton = JSX(({ yandexMaps, direction = 'in' }) => {
-        const iconName = direction === 'in' ? 'PlusIcon' : 'MinusIcon';
-        const changeZoom = () => {
-            const currentZoom = yandexMaps.current.getZoom();
-            const newZoom = direction === 'in' ? currentZoom + 1 : currentZoom - 1;
-            yandexMaps.current.setZoom(newZoom, { checkZoomRange: true });
-        };
-        return (jsx("div", { onClick: changeZoom, className: `${Object.values(styles).join(' ')} bg-white select-none cursor-pointer w-12 h-12`, children: jsx(Icon, { name: iconName, width: "20", height: "16" }) }));
+    const DeliveryDateFiels = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0434\u043E\u0441\u0442\u0430\u0432\u043A\u0438", ...getValidation(field('deliveryDate'), validatorObj.deliveryDate, input?.required) })));
+
+    const DependentsField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0438\u0436\u0434\u0438\u0432\u0435\u043D\u0446\u0435\u0432", placeholder: "\u0417\u0430 \u0438\u0441\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u0435 \u0434\u0435\u0442\u0435\u0439 \u0434\u043E 18 \u043B\u0435\u0442", type: "number", maxLength: 2, ...getValidation(field('dependents'), validatorObj.dependents, input?.required), ...input })));
+
+    const DesiredMeetingDateField = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0416\u0435\u043B\u0430\u0435\u043C\u0430\u044F \u0434\u0430\u0442\u0430 \u0432\u0441\u0442\u0440\u0435\u0447\u0438", ...getValidation(field('desiredMeetingDate'), validatorObj.meetingDay, input?.required) })));
+
+    const DisablePeopleFlgField = JSX(({ field, input }) => (jsx(CheckboxWithError, { text: "\u042F\u0432\u043B\u044F\u044E\u0441\u044C \u0438\u043D\u0432\u0430\u043B\u0438\u0434\u043E\u043C", ...getValidation(field('disablePeopleFlg'), validatorObj.disablePeopleFlg, input?.required) })));
+
+    const FIELD_NAME$6 = 'dulIssueDateField';
+    const DulIssueDateField = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0432\u044B\u0434\u0430\u0447\u0438", ...getValidation(field(FIELD_NAME$6), validatorObj.dulIssueDateField, input?.required), disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$6) })));
+
+    const FIELD_NAME$5 = 'dulIssuedBy';
+    const DulIssuedByField = JSX(({ field, input }) => {
+        const { value: dulSubdivisionCode, onChange: changeDulSubdivisionCode } = field('dulSubdivisionCode');
+        const onDaDataChange = useCallback((item) => {
+            changeDulSubdivisionCode?.(item?.data?.code?.replace('-', ''));
+        }, []);
+        return (jsx(InputControl, { disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$5), label: "\u041A\u0435\u043C \u0432\u044B\u0434\u0430\u043D", ...input, ...getValidation(field(FIELD_NAME$5), validatorObj.dulIssuedBy, input?.required), onDaDataChange: onDaDataChange, daDataQueryPrefix: dulSubdivisionCode }));
     });
 
-    const DEFAULT_CENTER_COORDS = [55.753995, 37.614069];
-    // TODO: Поле для поиска: невыяснено среди каких данных делать поиск (искать в имени офиса, в адресе, метро и т.д.).
-    //       Сейчас реализован поиск среди тестовых данных
-    // TODO: Также выяснить что делать когда ничего не найдено
-    // TODO: На макетах также когда есть поле поиска нет кнопки открыть на карте.
-    const YandexMap = JSX(({ points, className = '', zoom = 5, isLoad, selectedAddress }) => {
-        const map = useRef(null);
-        const yandexMaps = useYandexMaps();
-        useEffect(() => {
-            if (map.current) {
-                renderClusterer({ yandexMaps, map: map.current, points, isLoad });
-            }
-            else {
-                yandexMaps?.ready(() => {
-                    // Ready function may be called few times, but must be called once
-                    if (map.current) {
-                        renderClusterer({ yandexMaps, map: map.current, points, isLoad });
-                        return;
-                    }
-                    map.current = new yandexMaps.Map('map', {
-                        center: getCenterPoint(points),
-                        zoom,
-                        controls: [],
-                        suppressMapOpenBlock: true,
-                    });
-                    renderClusterer({ yandexMaps, map: map.current, points, isLoad });
-                });
-            }
-        }, [yandexMaps, points, zoom, isLoad, selectedAddress]);
+    const FIELD_NAME$4 = 'dulNumber';
+    const DulNumberField = JSX(({ field, input }) => (jsx(InputControl, { disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$4), label: "\u041D\u043E\u043C\u0435\u0440 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0430", type: "number", maxLength: 6, ...getValidation(field('dulNumber'), validatorObj.dulNumber, input?.required) })));
+
+    const FIELD_NAME$3 = 'dulSerie';
+    const DulSerieField = JSX(({ field, input }) => (jsx(InputControl, { disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$3), label: "\u0421\u0435\u0440\u0438\u044F \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0430", type: "number", maxLength: 4, ...getValidation(field('dulSerie'), validatorObj.dulSerie, input?.required) })));
+
+    const FIELD_NAME$2 = 'dulSubdivisionCode';
+    const DulSubdivisionCodeField = JSX(({ field, input }) => {
+        const onDaDataChange = useCallback((item) => {
+            field?.('dulIssuedBy')?.onChange?.(item?.data?.name);
+        }, []);
+        return (jsx(InputControl, { disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$2), label: "\u041A\u043E\u0434 \u043F\u043E\u0434\u0440\u0430\u0437\u0434\u0435\u043B\u0435\u043D\u0438\u044F", type: "number", maxLength: 6, ...input, ...getValidation(field(FIELD_NAME$2), validatorObj.dulSubdivisionCode, input?.required), onDaDataChange: onDaDataChange }));
+    });
+
+    const EducationField = JSX(({ field, input }) => {
+        const { data: education } = useLeadFormData('EDUCATION_LEVEL');
+        return (jsx(SelectField, { field: field, source: education, label: "\u041E\u0431\u0440\u0430\u0437\u043E\u0432\u0430\u043D\u0438\u0435", fieldName: "education", input: input }));
+    });
+
+    const EmailField = JSX(({ field, input }) => {
+        const { required, ...rest } = input;
+        return (jsx(InputControl, { label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...getValidation(field('email'), validatorObj.email, required), ...rest }));
+    });
+
+    const EmployerActivitiesField = JSX(({ field, input }) => {
+        const { data: employerActivities } = useLeadFormData('ORGANIZATION_ACTIVITY_TYPE');
+        return (jsx(SelectField, { field: field, source: employerActivities, label: "\u0412\u0438\u0434 \u0434\u0435\u044F\u0442\u0435\u043B\u044C\u043D\u043E\u0441\u0442\u0438 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438-\u0440\u0430\u0431\u043E\u0442\u043E\u0434\u0430\u0442\u0435\u043B\u044F", fieldName: "employerActivities", input: input }));
+    });
+
+    const EmployerOrganizationField = JSX(({ field, input }) => {
+        const { data: employerOrganization } = useLeadFormData('ORGANIZATION_KIND');
+        return (jsx(SelectField, { field: field, source: employerOrganization, label: "\u0412\u0438\u0434 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438 \u0440\u0430\u0431\u043E\u0442\u043E\u0434\u0430\u0442\u0435\u043B\u044F", fieldName: "employerOrganization", input: input }));
+    });
+
+    const EmploymentField = JSX(({ field, input }) => {
+        const { data: employment } = useLeadFormData('EMPLOYMENT_INFO_UNITED');
+        return (jsx(SelectField, { field: field, source: employment, label: "\u0418\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u044F \u043E \u0442\u0440\u0443\u0434\u043E\u0443\u0441\u0442\u0440\u043E\u0439\u0441\u0442\u0432\u0435", fieldName: "employment", input: input }));
+    });
+
+    const ExpensesField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u044B\u0435 \u0440\u0430\u0441\u0445\u043E\u0434\u044B \u0432 \u043C\u0435\u0441\u044F\u0446", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", ...getValidation(field('expenses'), validatorObj.expenses, input?.required), ...input })));
+
+    const Experience5YearsField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0421\u0442\u0430\u0436", placeholder: "\u0417\u0430 \u043F\u043E\u0441\u043B\u0435\u0434\u043D\u0438\u0435 5 \u043B\u0435\u0442", type: "number", maxLength: 2, ...getValidation(field('experience5Years'), validatorObj.experience5Years, input?.required), ...input })));
+
+    const FamilyMembersField = JSX(({ field }) => {
+        const { value, onChange } = field('familyMembers');
+        const familyStatusKey = field('familyStatus')?.value?.key;
+        const adultsCount = familyStatusKey === 'MARRIED' ? 2 : 1;
+        const childrenCount = Number(field('children')?.value);
+        const dependentsCount = Number(field('dependents')?.value);
+        const totalCount = adultsCount + childrenCount + dependentsCount;
         useEffect(() => {
-            if (map.current && selectedAddress) {
-                yandexMaps?.geocode(selectedAddress).then((res) => {
-                    const firstGeoObject = res.geoObjects.get(0);
-                    const coords = firstGeoObject.geometry.getCoordinates();
-                    map.current.setCenter(coords);
-                    map.current.setZoom(18);
-                });
-            }
-        }, [selectedAddress]);
-        if (!yandexMaps) {
-            return null;
-        }
-        const zIndex = 'z-10';
-        return (jsxs("div", { id: "map", className: style('relative', 'w-full', className), children: [isLoad ? jsx(Loader, {}) : null, jsxs("div", { className: style('absolute right-2 top-52 z-10 w-12 overflow-hidden border border-transparent rounded-md', zIndex), children: [jsx(ZoomButton, { yandexMaps: map }), jsx(ZoomButton, { yandexMaps: map, direction: "out" })] }), renderUserGeolocation(map, yandexMaps, style('right-2 top-80', zIndex))] }));
+            field?.('familyMembers')?.onChange?.(totalCount);
+        }, [familyStatusKey, childrenCount, dependentsCount]);
+        return (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u0447\u043B\u0435\u043D\u043E\u0432 \u0441\u0435\u043C\u044C\u0438", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", disabled: true, value: value, onChange: (_) => onChange?.(_) }));
     });
-    const getCenterPoint = (points) => {
-        const centerCoords = [
-            getArraySumAndAverage(mapByIndex(points, 0)),
-            getArraySumAndAverage(mapByIndex(points, 1)),
-        ];
-        return centerCoords.every((_) => _) ? centerCoords : DEFAULT_CENTER_COORDS;
-    };
-    const mapByIndex = (points, index) => points.map((_) => _.coords?.[index]);
-    const getArraySumAndAverage = (arr) => arr.length && arr.reduce((a, b) => a + b) / arr.length;
 
-    const INITIAL_FILTRATION_STATE$1 = {
-        workingSaturday: false,
-        premiumService: false,
-        privateBanking: false,
-        remoteWorkplace: false,
-        serviceDisabledPeople: false,
-        sellingCoins: false,
-        buyingCoins: false,
-        bullionOperations: false,
-        preciousMetalsOperations: false,
-        transferringDataToBiometricSystem: false,
-    };
-    const FILTRATION_LABELS = {
-        safeBoxCaseVolumes: 'Аренда индивидуальных сейфовых ячеек',
-        workingSaturday: 'Открыты по субботам',
-        terminalTypeAtms: 'Банкоматы',
-        terminalTypeTerm: 'Терминалы',
-        workAllTime: 'Круглосуточно',
-        billAcceptorEnable: 'Прием наличных',
-        premiumService: 'Премиальное обслуживание',
-        privateBanking: 'Услуга Private banking',
-        sellingCoins: 'Продажа монет из драгоценных металлов',
-        buyingCoins: 'Покупка монет из драгоценных металлов',
-        bullionOperations: 'Операции со слитками',
-        preciousMetalsOperations: 'Операции с драгоценными металлами',
-        transferringDataToBiometricSystem: 'Передача фото и голоса в Единую биометрическую систему',
-        locationDisabledPeople: 'Для маломобильных',
-        designDisabledPeople: 'Для слабовидящих',
-        remoteWorkplace: 'Удаленное рабочее место',
-        serviceDisabledPeople: 'Для маломобильных граждан',
-    };
-    const FILTRATION_PREDICATES$1 = {
-        workingSaturday: (item) => Boolean('workSchedule' in item && item.workSchedule?.workingSaturday),
-        premiumService: (item) => Boolean('premiumService' in item && item.premiumService),
-        privateBanking: (item) => Boolean('privateBanking' in item && item.privateBanking),
-        remoteWorkplace: (item) => Boolean('workScheduleDescription' in item),
-        serviceDisabledPeople: (item) => Boolean('serviceDisabledPeople' in item && item.serviceDisabledPeople),
-        sellingCoins: (item) => Boolean('sellingCoins' in item && item.sellingCoins),
-        buyingCoins: (item) => Boolean('buyingCoins' in item && item.buyingCoins),
-        bullionOperations: (item) => Boolean('bullionOperations' in item && item.bullionOperations),
-        preciousMetalsOperations: (item) => Boolean('preciousMetalsOperations' in item && item.preciousMetalsOperations),
-        transferringDataToBiometricSystem: (item) => Boolean('transferringDataToBiometricSystem' in item && item.transferringDataToBiometricSystem),
-    };
+    const FamilyStatusField = JSX(({ field, input }) => {
+        const { data: familyStatus } = useLeadFormData('MARITAL_STATUS');
+        return (jsx(SelectField, { field: field, source: familyStatus, label: "\u0421\u0435\u043C\u0435\u0439\u043D\u043E\u0435 \u043F\u043E\u043B\u043E\u0436\u0435\u043D\u0438\u0435", fieldName: "familyStatus", input: input }));
+    });
+
+    const SERVICE_TYPES = [
+        { key: 'ULTRASERVICE', text: 'Ультра' },
+        { key: 'PREMIUMSERVICE', text: 'Премиум' },
+    ];
+    const SERVICE_DIRECTIONS = [
+        { key: 'Физическое лицо' },
+        { key: 'Юридическое лицо / ИП' },
+    ];
+    const FEEDBACK_METHOD = [
+        { key: 'phone', text: 'Телефонный звонок' },
+        { key: 'email', text: 'Электронное сообщение' },
+    ];
+
+    const FeedbackMethodField = JSX(({ field, input }) => (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, ...getValidation(field('feedbackMethod'), validatorObj.feedbackMethod, input?.required) })));
+
+    const FullNameField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0424\u0418\u041E", ...getValidation(field('fullName'), validatorObj.fullName, input?.required), ...input })));
+
+    const GeneralSeniorityField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041E\u0431\u0449\u0438\u0439 \u0441\u0442\u0430\u0436", type: "number", maxLength: 2, placeholder: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043B\u0435\u0442", ...getValidation(field('generalSeniority'), validatorObj.generalSeniority, input?.required), ...input })));
+
+    const HousingField = JSX(({ field, input }) => {
+        const { data: housing } = useLeadFormData('HOUSE_TYPE');
+        return (jsx(SelectField, { field: field, source: housing, label: "\u0422\u0438\u043F \u0436\u0438\u043B\u044C\u044F", fieldName: "housing", input: input }));
+    });
+
+    const InnField = JSX(({ field, input }) => {
+        const onDaDataChange = useCallback((item) => {
+            field?.('organizationName')?.onChange?.(item.data?.name?.short_with_opf);
+            field?.('legalForm')?.onChange?.(item.data?.opf?.short);
+        }, []);
+        return (jsx(InputControl, { label: "\u0418\u041D\u041D", type: "number", maxLength: 12, ...input, ...getValidation(field('inn'), validatorObj.inn, input?.required), onDaDataChange: onDaDataChange }));
+    });
+
+    const IsClientField = JSX(({ field }) => (jsx(CheckboxWithError, { ...field('isClient'), text: '\u042F\u0432\u043B\u044F\u044E\u0441\u044C \u043A\u043B\u0438\u0435\u043D\u0442\u043E\u043C \u0431\u0430\u043D\u043A\u0430 \u0410\u041E "\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A"' })));
+
+    const JobsNumberField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043C\u0435\u0441\u0442 \u0440\u0430\u0431\u043E\u0442\u044B \u0437\u0430 \u043F\u043E\u0441\u043B\u0435\u0434\u043D\u0438\u0435 5 \u043B\u0435\u0442", placeholder: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043C\u0435\u0441\u0442", type: "number", maxLength: 2, ...getValidation(field('jobsNumber'), validatorObj.jobsNumber, input?.required), ...input })));
+
+    const LastJobExperienceField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0421\u0442\u0430\u0436 \u043D\u0430 \u043F\u043E\u0441\u043B\u0435\u0434\u043D\u0435\u043C \u0440\u0430\u0431\u043E\u0447\u0435\u043C \u043C\u0435\u0441\u0442\u0435", placeholder: "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043B\u0435\u0442", type: "number", maxLength: 2, ...getValidation(field('lastJobExperience'), validatorObj.lastJobExperience, input?.required), ...input })));
+
+    const LegalEntityNameField = JSX(({ field, input }) => {
+        return (jsx(InputControl, { label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u044E\u0440\u0438\u0434\u0438\u0447\u0435\u0441\u043A\u043E\u0433\u043E \u043B\u0438\u0446\u0430", ...input, ...getValidation(field('legalEntityName'), validatorObj.legalEntityName, input?.required) }));
+    });
 
-    function useButton() {
-        return (props) => ({
-            ...props,
-            onClick: handlerDecorator(handleClick(props)),
-        });
-    }
-    function handleClick({ disabled, onClick }) {
-        return (ev) => {
-            !disabled && onClick && onClick(ev);
-        };
+    const LegalFormField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041E\u041F\u0424", placeholder: "\u041E\u041E\u041E, \u041F\u0410\u041E  \u0438 \u0434\u0440.", ...getValidation(field('legalForm'), validatorObj.legalForm, input?.required), ...input })));
+
+    const OUT_SERVICE_BASE_URL = `${API_BASE_URI}/outservice`;
+    const EMPTY_REGIONS = [];
+    async function getOutServiceRegions() {
+        const data = await fetchJSON(`${OUT_SERVICE_BASE_URL}/outserviceregions`);
+        return data && Array.isArray(data) ? data : EMPTY_REGIONS;
     }
 
-    const buttonStyleMap = {
-        primary: 'text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active',
-        secondary: 'text-primary-main bg-main-divider hover:text-white hover:bg-primary-hover active:bg-primary-active',
-    };
-    const secondaryButtonStyleMap = {
-        primary: style('group-data-secondary:text-primary-main group-data-secondary:bg-white', 'group-data-secondary:hover:text-white group-data-secondary:hover:bg-primary-hover', 'group-data-secondary:active:bg-primary-active'),
-        secondary: style('group-data-secondary:text-white group-data-secondary:bg-white/20', 'group-data-secondary:hover:bg-primary-hover', 'group-data-secondary:active:bg-primary-active'),
-    };
-    const Button = JSX(({ children, ...props }) => {
-        const button = useButton();
-        const { className, version = 'primary', active, disabled, type = 'button', rounded = true, role, onClick, } = button(props);
-        return (jsx("button", { className: style('font-sans px-9 py-4', 'flex justify-center items-center gap-xs', {
-                'text-white bg-primary-active': active,
-                'bg-main-gray text-main-disabled cursor-not-allowed': disabled,
-                'rounded-md': rounded,
-            }, !active && !disabled
-                ? style(buttonStyleMap[version], secondaryButtonStyleMap[version])
-                : '', className), type: type, role: role, onClick: onClick, children: children }));
+    const LocalitiesField = JSX(({ field, input }) => {
+        const fieldRegion = field('region');
+        const regionKey = fieldRegion?.value?.key;
+        const { data: regions } = useAsyncData('outServiceRegions', getOutServiceRegions);
+        const localities = regions
+            ?.find((_) => _.code === regionKey)
+            ?.localities?.map((_) => ({ key: _, text: _ }));
+        useEffect(() => {
+            if (regionKey !== '') {
+                field?.('localities')?.onChange?.('');
+            }
+        }, [regionKey]);
+        return (jsx(SelectControl, { label: "\u041D\u0430\u0441\u0435\u043B\u0435\u043D\u043D\u044B\u0439 \u043F\u0443\u043D\u043A\u0442", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0433\u043E\u0440\u043E\u0434, \u0433\u0434\u0435 \u0434\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0441\u0435\u0440\u0432\u0438\u0441", options: localities, ...getValidation(field('localities'), validatorObj.localities, input?.required), isSearch: true }));
     });
 
-    const getVersion = (isPrimary, type) => isPrimary && type !== 'underlined' ? 'primary' : 'secondary';
+    const MandatoryPaymentsField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u041E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u044B\u0435 \u0432\u044B\u043F\u043B\u0430\u0442\u044B", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", ...getValidation(field('mandatoryPayments'), validatorObj.mandatoryPayments, input?.required), ...input })));
 
-    const renderButtonsGroup = (data, activeButton, onButtonClick) => {
-        const allButtonVersion = getVersion(activeButton === 'all');
-        const businessButtonVersion = getVersion(activeButton === 'business');
-        const handleClick = (e, key, branches) => {
-            const filteredBranches = e.currentTarget === e.target && key === 'business' ? filterBranches(branches) : branches;
-            onButtonClick(key);
-            return filteredBranches;
-        };
-        const filterBranches = (branches) => branches.filter((branch) => branch.workSchedule &&
-            branch.workSchedule.businessScheduleVisibleTag &&
-            !branch.workSchedule.businessScheduleDescription);
-        return (jsxs("div", { className: "flex gap-lg flex-col sm:flex-row pb-lg", children: [jsx(Button, { "data-id": "all", onClick: (e) => handleClick(e, 'all', data), version: allButtonVersion, children: "\u0414\u043B\u044F \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446" }), jsx(Button, { "data-id": "business", onClick: (e) => handleClick(e, 'business', data), version: businessButtonVersion, children: "\u0414\u043B\u044F \u044E\u0440\u0438\u0434\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446" })] }));
-    };
+    const METHODS_OF_OBTAIN = [
+        { id: 'office', text: 'В отделении Банка' },
+        { id: 'courier', text: 'Курьерская доставка' },
+    ];
+    const MethodObtainField = JSX(({ field, input }) => (jsx(RadioButtonGroupControl, { orientation: "horizontal", items: METHODS_OF_OBTAIN, ...getValidation(field('methodObtain'), validatorObj.methodObtain, input?.required) })));
 
-    const renderDescriptionBlock$1 = ({ __html, list, richVersion }) => __html || list?.length ? (jsxs("div", { className: "mb-2xl border-b sm:border border-main-divider sm:rounded-md", children: [__html ? (jsx("div", { className: "mb-2xl", children: jsx(RichText, { __html: __html, richVersion: richVersion }) })) : null, list?.length ? (jsx("div", { className: "flex flex-col sm:flex-row gap-2xl sm:flex-wrap pb-2xl sm:pb-xl", children: list.map((item, i) => (jsxs("div", { className: "flex gap-xs items-center", children: [item?.image ? jsx(Img, { image: item.image }) : null, item?.text ? (jsx(Text, { size: "text-m", font: "font-light", children: item.text })) : null] }, String(i)))) })) : null] })) : null;
+    const FIELD_NAME$1 = 'middleName';
+    const MiddleNameField = JSX(({ field, input }) => (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)", maxLength: 60, disabled: input?.filledByEsia && isEsiaAuthorize(field, FIELD_NAME$1), ...getValidation(field(FIELD_NAME$1), validatorObj.middleName, input?.required), ...input })));
 
-    const COMMON_FILTERS_STYLES = 'flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb-2xl';
-    const renderFiltrationForm = ({ filters, field: { field, reset }, onlyOffice, labels, }) => {
-        const visibleFiltersNum = onlyOffice ? 5 : 6;
-        const filtersCheckbox = (filters || []).map((key) => (jsx(Checkbox, { text: labels[key], ...field(key) }, key)));
-        const [visibleFilters, hiddenFilters] = visibleFiltersNum > 0
-            ? [filtersCheckbox.slice(0, visibleFiltersNum), filtersCheckbox.slice(visibleFiltersNum)]
-            : [filtersCheckbox, []];
-        return (jsx("div", { children: filters?.length ? (jsx("div", { children: jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs("div", { children: [jsx("div", { className: COMMON_FILTERS_STYLES, children: visibleFilters }), jsx(FoldableSection, { className: COMMON_FILTERS_STYLES, isUnfolded: isUnfolded, children: hiddenFilters })] })), renderFoldButton: renderFoldButton$2(reset, onlyOffice) }) })) : null }));
-    };
-    const renderFoldButton$2 = (reset, onlyOffice = false) => ({ isUnfolded, onToggle }) => {
-        const labels = ['Больше фильтров', 'Меньше фильтров'];
-        const icons = ['ArrowDownIcon', 'ArrowUpIcon'];
-        return (jsxs("div", { className: "flex space-x-lg", children: [onlyOffice ? (jsx(LinkButton, { version: "transparent", className: "text-secondary-text [&>*]:p-0", appendRight: jsx(Icon, { name: icons[Number(isUnfolded)], width: "16", height: "16" }), text: labels[Number(isUnfolded)], onClick: onToggle })) : null, jsx(LinkButton, { version: "transparent", className: "text-secondary-text [&>*]:p-0", onClick: reset, children: renderBtnInner() })] }));
-    };
-    const renderBtnInner = () => (jsxs("div", { className: "flex items-center", children: ["\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440", jsx(Icon, { name: "CloseIcon", width: "16", height: "16", className: "ml-2xs" })] }));
+    const NameField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0418\u043C\u044F", maxLength: 60, disabled: input?.filledByEsia && isEsiaAuthorize(field, input.name ?? ''), ...getValidation(field('name'), validatorObj.name, input?.required), ...input })));
 
-    const renderHeading = (title, lengthItems) => (jsx("div", { className: "flex flex-col sm:flex-row gap-xs mb-2xl", children: jsxs(Heading, { headingType: "h3", children: [jsx("span", { suppressHydrationWarning: true, children: title }), lengthItems ? (jsx(Text, { size: "text-h2", color: "text-secondary-text", children: jsx("span", { suppressHydrationWarning: true, children: ` (${lengthItems})` }) })) : null] }) }));
+    const SlideCheckbox = JSX(({ value = false, text, type = 'checkbox', onChange }) => (jsxs("div", { role: type, "aria-checked": value, className: "flex justify-start items-center w-full cursor-pointer mb-s", onClick: () => onChange && onChange(!value), children: [jsx("div", { className: style('relative flex-shrink-0 duration-300 w-9 h-5 mr-s rounded-2xl', value ? 'bg-primary-main' : 'bg-main-divider'), children: jsx("div", { className: style('absolute opacity-80 duration-500 top-0.5 w-4 h-4 bg-white rounded-full', value ? 'left-1/2' : 'left-[5%]') }) }), text ? (jsx(Text, { size: "text-l", font: "font-light", color: "text-primary-text", children: text })) : null] })));
 
-    const defaultEmptyFunction$1 = () => void 0;
-    const filtersVisibleStyles = (activeButton) => activeButton === 'all' ? 'block' : 'hidden';
-    const OfficesAtmsMapLayout = JSX(({ className, data = [], isLoad, remoteWorkplaces = [], renderCard = defaultEmptyFunction$1, renderRemoteWorkplaceCard = defaultEmptyFunction$1, getBalloon = defaultEmptyFunction$1, getBalloonRemoteWorkplaces = defaultEmptyFunction$1, descriptionData, title, }) => {
-        const onlyOffice = title?.includes('Офис');
-        const [filtrationState, { field, reset }] = useForm(INITIAL_FILTRATION_STATE$1);
-        const { filteredItems, points, filteredRemoteWorkplaces, lengthItems } = useOfficesAtmsMapData({
-            data,
-            remoteWorkplaces,
-            filtrationState,
-            getBalloon,
-            getBalloonRemoteWorkplaces,
-        });
-        const [activeButton, setActiveButton] = useState('all');
-        const filterOptions = {
-            filters: getFiltersWithNonEmptyData([...data, ...remoteWorkplaces]),
-            field: { field, reset },
-            onlyOffice,
-            labels: FILTRATION_LABELS,
+    const OnlineCheckoutField = JSX(({ field }) => isAcquiringTrade(field('acquiringType')?.value?.key) ? (jsx(SlideCheckbox, { type: "radio", text: "\u0425\u043E\u0447\u0443 \u043E\u043D\u043B\u0430\u0439\u043D-\u043A\u0430\u0441\u0441\u0443", ...field('onlineCheckout') })) : null);
+
+    const OrganizationField = JSX(({ field, input }) => {
+        const { data: organization } = useLeadFormData('ORGANIZATION_TYPE');
+        return (jsx(SelectField, { field: field, source: organization, label: "\u0422\u0438\u043F \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", fieldName: "organization", input: input }));
+    });
+
+    const OrganizationNameField = JSX(({ field, input }) => {
+        const onDaDataChange = useCallback((item) => {
+            field?.('inn')?.onChange?.(item.data?.inn);
+            field?.('legalForm')?.onChange?.(item.data?.opf?.short);
+        }, []);
+        return (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", ...input, ...getValidation(field('organizationName'), validatorObj.organizationName, input?.required), onDaDataChange: onDaDataChange }));
+    });
+
+    const OtherIncomeField = JSX(({ field, input }) => (jsx(InputControl, { label: "\u0418\u043D\u044B\u0435 \u0434\u043E\u0445\u043E\u0434\u044B", placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435", type: "number", ...getValidation(field('otherIncome'), validatorObj.otherIncome, input?.required), ...input })));
+
+    const ParticipantDateRegistrationField = JSX(({ field, input }) => (jsx(DatePickerControl, { label: "\u0414\u0430\u0442\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u043F\u043E \u043C\u0435\u0441\u0442\u0443 \u0436\u0438\u0442\u0435\u043B\u044C\u0441\u0442\u0432\u0430", ...getValidation(field('participantDateRegistration'), validatorObj.participantDateRegistration, input?.required) })));
+
+    const MAX_PART = 100;
+    const PartInBusinessField = JSX(({ field, input }) => {
+        const isBusinessOwner = field('positionOrganization')?.value?.key === 'BUSINESS_OWNER';
+        const partInBusinessField = {
+            ...getValidation(field('partInBusiness'), validatorObj.partInBusiness, input?.required),
         };
-        return (jsxs("div", { className: style('space-y-1', className), children: [jsxs("div", { className: "bg-white", children: [jsxs("div", { className: "p-3xl pb-0", children: [renderHeading(title, lengthItems), descriptionData ? renderDescriptionBlock$1(descriptionData) : null, onlyOffice && renderButtonsGroup(data, activeButton, setActiveButton), jsx("div", { className: style('pb-3xl', filtersVisibleStyles(activeButton)), children: renderFiltrationForm(filterOptions) })] }), jsx("div", { className: "h-[600px]", children: jsx(ClientOnly, { children: jsx(YandexMap, { points: points, isLoad: isLoad, className: "h-full" }) }) })] }), jsxs(ClientOnly, { children: [filteredItems.map(renderCard), filteredRemoteWorkplaces.map(renderRemoteWorkplaceCard)] })] }));
+        const handleChange = (value) => partInBusinessField?.onChange &&
+            partInBusinessField?.onChange(String(Number(value) > MAX_PART ? MAX_PART : Number(value) || ''));
+        return (jsx(InputControl, { label: "\u0414\u043E\u043B\u044F \u0443\u0447\u0430\u0441\u0442\u0438\u044F \u0432 \u0431\u0438\u0437\u043D\u0435\u0441\u0435", placeholder: "\u0432 %", type: "number", maxLength: 3, ...partInBusinessField, ...input, onChange: handleChange, value: isBusinessOwner ? partInBusinessField?.value : '', disabled: !isBusinessOwner }));
     });
-    const filterItems$1 = (data, filtrationState) => {
-        const truthyFilters = Object.keys(filtrationState).filter((key) => filtrationState[key]);
-        return data.filter((item) => truthyFilters.every((_) => FILTRATION_PREDICATES$1[_](item)));
-    };
-    const getFiltersWithNonEmptyData = (data) => Object.keys(INITIAL_FILTRATION_STATE$1).filter((_) => data.filter((item) => FILTRATION_PREDICATES$1[_](item)).length);
 
-    const defaultEmptyFunction = () => void 0;
-    const useOfficesAtmsMapData = ({ data, remoteWorkplaces = [], filtrationState = {}, getBalloon = defaultEmptyFunction, getBalloonRemoteWorkplaces = defaultEmptyFunction, }) => {
-        const [filteredItems, points, filteredRemoteWorkplaces, lengthItems] = useMemo(() => {
-            const _filteredItems = filterItems$1(data, filtrationState);
-            const _filteredRemoteWorkplaces = filterItems$1(remoteWorkplaces, filtrationState);
-            const _points = [
-                ..._filteredItems.map((_) => ({
-                    type: 'offices',
-                    coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)]?.filter(Boolean),
-                    content: getBalloon(_),
-                })),
-                ..._filteredRemoteWorkplaces.map((_) => ({
-                    type: 'workplaces',
-                    coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)]?.filter(Boolean),
-                    content: getBalloonRemoteWorkplaces({
-                        address: _.address,
-                        workScheduleDescription: _.workScheduleDescription,
-                    }),
-                })),
-            ].filter((_) => _.coords && _.coords.length === 2);
-            const itemsLength = _filteredItems.length + _filteredRemoteWorkplaces?.length;
-            return [_filteredItems, _points, _filteredRemoteWorkplaces, itemsLength];
-        }, [data, remoteWorkplaces, filtrationState, getBalloon, getBalloonRemoteWorkplaces]);
-        return { filteredItems, points, filteredRemoteWorkplaces, lengthItems };
-    };
+    const PartnerCommentsField = JSX(({ field, input }) => {
+        const { required, ...rest } = input;
+        return (jsx(InputControl, { ...getValidation(field('partnerComments'), validatorObj.partnerComments, required), placeholder: "\u0423\u043A\u0430\u0436\u0438\u0442\u0435 \u0438\u043D\u0442\u0435\u0440\u0435\u0441\u0443\u044E\u0449\u0438\u0439 \u0432\u0430\u0441 \u0432\u043E\u043F\u0440\u043E\u0441", isTextarea: true, ...rest }));
+    });
 
-    const RetailAddressField = JSX(({ field, input }) => {
-        const fieldRegion = field('regionRetail');
-        const fieldBranch = field('addressRetail');
-        const regions = useBranchesByRegions();
-        const regionKey = fieldRegion?.value?.key;
-        const selectedRegion = regions.find(({ region }) => region === regionKey);
-        const isLoad = !regions;
-        const regionText = fieldRegion?.value?.text;
-        const addressBranchRetail = useBranchesByRegions()?.find((_) => _?.region === regionText)?.branches;
-        useEffect(() => {
-            if (fieldRegion?.value?.key !== '') {
-                field?.('addressRetail')?.onChange?.('');
+    const PAYMENT_SYSTEM_TYPES = [
+        { id: 'mir', text: 'Карта МИР' },
+        { id: 'union_pay', text: 'UnionPay' },
+    ];
+    const PaymentSystemField = JSX(({ field, input }) => {
+        const { value, onChange } = field('paymentSystem');
+        return (jsx(RadioButtonGroupControl, { label: "\u041F\u043B\u0430\u0442\u0435\u0436\u043D\u0430\u044F \u0441\u0438\u0441\u0442\u0435\u043C\u0430", orientation: "horizontal", items: PAYMENT_SYSTEM_TYPES, value: value, onChange: (_) => onChange?.(_), ...getValidation(field('paymentSystem'), validatorObj.paymentSystem, input?.required) }));
+    });
+
+    const isPlaceholder = (_) => _ === '_';
+    const isDigit = (_) => /\d/.test(_);
+    const isWildcard = (_) => isPlaceholder(_) || isDigit(_);
+    const phonePattern = [...'+7 (___) ___-__-__'];
+    const firstPlaceholderIndex = phonePattern.findIndex(isPlaceholder);
+    const phoneWildcardIndicies = phonePattern.map((_, i) => isWildcard(_) ? phonePattern.slice(0, i).filter(isWildcard).length : -1);
+    function normalizePhone(phone) {
+        const phoneNumbers = phone.replace(/\D/g, '');
+        const applyPlaceholder = (_, i) => isDigit(_) ? _ : phoneNumbers.charAt(phoneWildcardIndicies[i]) || _;
+        const result = phonePattern.map(applyPlaceholder);
+        const resultLength = phoneWildcardIndicies.indexOf(phoneNumbers.length - 1) + 1;
+        return (resultLength ? result.slice(0, Math.max(firstPlaceholderIndex, resultLength)) : result).join('');
+    }
+
+    const PhoneInput = JSX(({ children, onChange, ...inputProps }) => {
+        const handleChange = useCallback((v) => onChange && onChange(normalizePhone(v)), [onChange]);
+        const handleBlur = useCallback((v) => {
+            if (v === '+7 (') {
+                onChange && onChange('');
             }
-        }, [fieldRegion?.value]);
-        const { points } = useOfficesAtmsMapData({
-            data: selectedRegion?.branches || [],
-            filtrationState: {},
-            getBalloon: getOfficePoint,
-        });
-        const isRegionSelected = Boolean(fieldRegion?.value?.key);
-        return (jsxs("div", { children: [jsx(SelectControl, { label: "\u0410\u0434\u0440\u0435\u0441 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u044F", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435", options: (addressBranchRetail || []).map(({ address = '' }) => ({
-                        key: address,
-                        text: address,
-                    })), ...getValidation(field('addressRetail'), validatorObj.addressRetail, input?.required && isRegionSelected), isSearch: true }), jsx("div", { className: "h-[600px]", children: jsx(ClientOnly, { children: jsx(YandexMap, { points: points, isLoad: isLoad, className: "h-full", selectedAddress: fieldBranch?.value?.text }) }) })] }));
+        }, []);
+        return (jsx(Input, { ...inputProps, onChange: handleChange, onFocus: (ev) => handleChange(ev?.target?.value || ''), onBlur: (ev) => handleBlur(ev?.target?.value || ''), children: children }));
+    });
+
+    const InputPhoneControl = JSX(({ className, label, error, ...rest }) => (jsxs("div", { className: style('shrink-0 w-full', className), children: [jsx(PhoneInput, { "aria-label": label, label: getRequiredLabel({ label, errors: rest?.errors }), valid: Boolean(!error), placeholder: "+7 (___) ___-__-__", ...rest }), renderErrorText(error)] })));
+
+    const PhoneField = JSX(({ field, input }) => {
+        const fieldName = input?.name || 'phone';
+        return (jsx(InputPhoneControl, { label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...getValidation(field(fieldName), validatorObj.phone, input?.required), disabled: input?.filledByEsia && isEsiaAuthorize(field, fieldName), ...input }));
+    });
+
+    const PositionOrganizationField = JSX(({ field, input }) => {
+        const { data: positionOrganization } = useLeadFormData('POSITION');
+        return (jsx(SelectField, { field: field, source: positionOrganization, label: "\u0414\u043E\u043B\u0436\u043D\u043E\u0441\u0442\u044C \u0432 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", fieldName: "positionOrganization", input: input }));
+    });
+
+    const PosTerminalField = JSX(({ field }) => isAcquiringTrade(field('acquiringType')?.value?.key) ? (jsx(SlideCheckbox, { type: "radio", text: "\u0425\u043E\u0447\u0443 POS-\u0442\u0435\u0440\u043C\u0438\u043D\u0430\u043B", ...field('posTerminal') })) : null);
+
+    const ProductField = UniBlock(({ field, source }) => (jsx(SelectControl, { placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043F\u0440\u043E\u0434\u0443\u043A\u0442", label: "\u041F\u0440\u043E\u0434\u0443\u043A\u0442", options: arrayToOptions(source?.productList), ...withValidator(field('product'), validatorObj.product) })));
+    const arrayToOptions = (array) => (array ?? []).map((_) => ({ key: _, value: _ }));
+
+    const REGIONS_URL = `${API_BASE_URI}/regions`;
+    function useRegions(url = REGIONS_URL) {
+        const { data } = useAsyncData(url, fetchJSONUnsafe);
+        return Array.isArray(data) ? data : [];
+    }
+
+    const RegionField = JSX(({ field, input, url }) => {
+        const regions = useRegions(url);
+        return (jsx(SelectControl, { 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: useMemo(() => regions?.map(({ code = '', name = '' }) => ({ key: code, text: name })), [regions]), ...getValidation(field('region'), validatorObj.region, input?.required) }));
+    });
+
+    const RegionPremiumField = JSX(({ field, input }) => {
+        const branchByRegions = useBranchesByRegions(true);
+        const regions = useMemo(() => branchByRegions?.map(({ region }) => ({
+            key: region,
+            text: region,
+        })), [branchByRegions]);
+        return (jsx(SelectControl, { label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", options: regions, ...getValidation(field('region'), validatorObj.region, input?.required) }));
     });
 
-    const RetailRegionField = JSX(({ field, input }) => {
-        const regions = useBranchesByRegions();
-        return (jsx(SelectControl, { label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", isSearch: true, options: useMemo(() => regions?.map(({ region = '' }) => ({ key: region, text: region })), [regions]), ...getValidation(field('regionRetail'), validatorObj.regionRetail, input?.required) }));
+    const RegionRetailField = JSX(({ field, input }) => {
+        const { data: regions } = useLeadFormData('REGION_RF');
+        const formatRegions = regions?.map(({ key, value }) => ({ key, text: value }));
+        return (jsx(SelectControl, { label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", isSearch: true, options: formatRegions, ...getValidation(field('regionRetail'), validatorObj.regionRetail, input?.required) }));
     });
 
     const RetirementIncomeField = JSX(({ field, input }) => {
@@ -3429,8 +3445,8 @@
             creditInRshbCd: jsx(CreditInRshbCdField, { field: field, input: input }),
             bankEmployeeCode: jsx(BankEmpoleeCodeField, { field: field, input: input }),
             partInBusiness: jsx(PartInBusinessField, { field: field, input: input }),
-            regionRetail: jsx(RetailRegionField, { field: field, input: input }),
-            addressRetail: jsx(RetailAddressField, { field: field, input: input }),
+            regionRetail: jsx(RegionRetailField, { field: field, input: input }),
+            addressRetail: jsx(AddressRetailField, { field: field, input: input }),
             addressMatch: jsx(AddressMatchField, { field: field, input: input }),
             paymentSystem: jsx(PaymentSystemField, { field: field, input: input }),
             currency: jsx(CurrencyField, { field: field, input: input }),
@@ -3531,6 +3547,7 @@
         posTerminal: false,
         consentToReceiveMaterials: false,
         consentDataProcessing: false,
+        addressRetail: { key: '', text: '' },
     };
     const getInitialFormState$3 = (inputs, typeForm = '') => {
         const formState = Object.fromEntries(inputs.map((_) => [
@@ -3668,6 +3685,7 @@
         paymentSystem: '',
         cardCategory: { key: '', text: '' },
         codeWord: '',
+        addressRetail: { key: '', text: '' },
     };
     const getInitialFormState$2 = (inputs, savedForm, typeForm = '') => {
         if (savedForm) {
@@ -6244,8 +6262,8 @@
         {
             regionRetail: '',
             addressRetail: {
-                fullAddress: '',
-                fiasCode: '',
+                key: '',
+                text: '',
             },
             bankEmployeeCode: undefined,
             addressCourier: {
@@ -6325,7 +6343,7 @@
         return (jsxs("div", { className: "flex justify-between gap-m", children: [jsx(Button, { onClick: onPrevStep, className: style('w-full @xl:w-auto'), type: "button", version: "secondary", disabled: isFirstStep, children: "\u041D\u0430\u0437\u0430\u0434" }), jsx(Button, { className: "w-full @xl:w-auto", type: "submit", children: "\u0414\u0430\u043B\u0435\u0435" })] }));
     });
 
-    const getFifthStepData = (formData) => {
+    const getFifthStepData$1 = (formData) => {
         const { bankruptcyFlg, shareholderFlg, legalEntityName, creditInRshbCd } = formData;
         return {
             bankruptcyFlg,
@@ -6473,7 +6491,7 @@
             case 3:
                 return getFourthStepData$1(formData);
             case 4:
-                return getFifthStepData(formData);
+                return getFifthStepData$1(formData);
             case 5:
                 return getSixthStepData(formData);
             default:
@@ -7182,6 +7200,13 @@
         return (jsxs("div", { className: 'flex justify-between', children: [jsx(Button, { onClick: onPrevStep, className: style('w-full @xl:w-auto'), type: "button", version: "secondary", disabled: isFirstStep, children: "\u041D\u0430\u0437\u0430\u0434" }), jsx(Button, { className: style('w-full @xl:w-auto'), type: "submit", children: "\u0414\u0430\u043B\u0435\u0435" })] }));
     });
 
+    const getFifthStepData = (formData) => {
+        const { addressRetail } = formData;
+        return {
+            office: addressRetail?.key ? { id: addressRetail.key } : undefined,
+        };
+    };
+
     const getFirstStepData = (formData) => {
         const { name, surname, middleName, birthday = '', phone = '', email, sex, birthPlace, dulIssueDateField = '', dulIssuedBy, dulNumber, dulSerie, dulSubdivisionCode, education, participantDateRegistration = '', housing, addressRegistration, addressFact, } = formData;
         return {
@@ -7287,7 +7312,7 @@
             taskSource: globalThis.location.origin,
             id: taskId,
             office: {
-                id: '650', // TODO: Remove hardcode
+                id: '',
             },
             authorizedAgentId: formData?.bankEmployeeCode,
             participants: [
@@ -7304,6 +7329,7 @@
                 },
             ],
             ...getZeroStepData(formData),
+            ...getFifthStepData(formData),
             esiaAccountTypeCd: {
                 key: formData?.esiaAccountTypeCd?.key,
             },
@@ -9952,7 +9978,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
 
-    const packageVersion = "0.14.665";
+    const packageVersion = "0.14.666";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;