@redneckz/wildless-cms-uni-blocks 0.7.8 → 0.8.0

package/bundle/bundle.umd.js

@@ -53,11 +53,9 @@
         };
     }
 
+    const DEFAULT_PROJECT_SETTINGS = { PROD_BRANCH: 'master' };
     const projectSettings = new (class {
-        _ = {
-            PROD_BRANCH: 'master',
-            FORCED_DRAFT_FLOW: false,
-        };
+        _ = DEFAULT_PROJECT_SETTINGS;
         setup(_) {
             this._ = _;
         }
@@ -68,7 +66,7 @@
             return this._.RC_BRANCH;
         }
         get PROD_BRANCH() {
-            return this._.PROD_BRANCH;
+            return this._.PROD_BRANCH || DEFAULT_PROJECT_SETTINGS.PROD_BRANCH;
         }
         get FORCED_DRAFT_FLOW() {
             return this._.FORCED_DRAFT_FLOW;
@@ -525,73 +523,165 @@
     AccordionItem.childrenTypes = [];
     const FoldButton = JSX(({ label, icon, onClick }) => (jsxs("button", { className: "border-none bg-transparent px-0 pt-5 pb-3.5 flex justify-between text-left w-full font-sans text-h6 cursor-pointer", onClick: onClick, children: [jsx(Text, { size: "text-xl", font: "font-medium", children: label }), jsx(ImgInner, { image: { icon }, className: "text-primary-main flex-shrink-0", width: "24", height: "24", asSVG: true })] })));
 
-    const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => (jsxs(BlockWrapper, { className: `p-12 flex flex-col items-center ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", as: "h2", className: "max-w-[47rem] text-center", title: title })) : null, benefitList?.length ? (jsx("div", { className: "flex flex-wrap w-full justify-center gap-x-20 mt-8", children: benefitList.map(renderStep) })) : null] })));
-    const renderStep = (benefit, i) => {
-        const description = benefit.description;
-        return (jsxs("div", { className: "flex items-center basis-1/2 max-w-[500px] mb-14", children: [benefit?.icon?.icon ? (jsx(ImgInner, { className: "w-12 h-12 min-w-12 p-3 rounded-full bg-main-divider text-primary-main group-data-secondary:bg-white/30 group-data-secondary:text-black", image: benefit.icon, asSVG: true })) : null, benefit?.icon?.src ? jsx(ImgInner, { image: benefit.icon }) : null, jsxs("div", { className: "ml-5", children: [benefit?.label ? jsx(Heading, { headingType: "h6", children: benefit.label }) : null, renderDescription$5(description)] })] }, String(i)));
-    };
-    const renderDescription$5 = (description) => {
-        const benefitType = description?.benefitType || null;
-        return description && benefitType ? (jsx("div", { className: "mt-2 text-l-light text-secondary-text group-data-secondary:text-white/80", children: benefitType === 'list'
-                ? renderListBenefit(description)
-                : renderTextBenefit(description) })) : null;
-    };
-    const renderTextBenefit = (description) => description?.name || null;
-    const renderListBenefit = (description) => {
-        const listStyleType = description?.bullets ? 'list-disc pl-6' : '';
-        return description?.items && description.items.length > 0 ? (jsx("ul", { className: listStyleType, children: description.items.map((_, i) => (jsx("li", { children: _ }, `benefitListItem-${i}`))) })) : null;
-    };
+    const Input = JSX(({ className = '', inputClassName = '', id, name, type = 'text', label, value = '', valid = true, children, onChange, onBlur, ...inputProps }) => {
+        const handleChange = useCallback((e) => {
+            const validInputValue = e.target.validity.valid ? e.target.value : value;
+            onChange(validInputValue);
+        }, [onChange]);
+        const handleBlur = useCallback((e) => {
+            if (!onBlur) {
+                return;
+            }
+            const validInputValue = e.target.validity.valid ? e.target.value : value;
+            onBlur(validInputValue);
+        }, [onBlur]);
+        const paddingStyle = children ? 'pr-8' : '';
+        const validStyle = valid
+            ? 'border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text'
+            : 'border-error';
+        return (jsxs("div", { className: `relative ${className}`, children: [label ? jsx("label", { className: "block text-m-light mb-2", children: label }) : null, jsx("input", { className: `w-full border rounded-md text-primary-text outline-none p-4 ${paddingStyle} ${validStyle} ${inputClassName}`, id: id, name: name || id, type: type, value: value, onChange: handleChange, onBlur: handleBlur, ...inputProps }), children] }));
+    });
+
+    const consistentDataMap = new Map();
+    function useAsyncData(key, fetcher, { fallback } = {}) {
+        const args = useMemo(() => keyToArgs(key), [key]);
+        const [data, setData] = useState();
+        const [error, setError] = useState();
+        const updateData = (_) => {
+            setData(_);
+            setError(undefined);
+        };
+        const updateError = (_) => {
+            setData(undefined);
+            setError(_);
+        };
+        const chainToConsistentResult = (_) => {
+            _.then(rawData => consistentDataMap.get(args) || rawData)
+                .then(updateData)
+                .catch(updateError);
+        };
+        useEffect(() => {
+            const isEmptyKey = args.every(_ => _ === null);
+            if (isEmptyKey) {
+                return;
+            }
+            try {
+                const _ = fetcher(...args);
+                if ('then' in _) {
+                    chainToConsistentResult(_);
+                }
+                else {
+                    updateData(_);
+                }
+            }
+            catch (err) {
+                updateError(err);
+            }
+        }, [fetcher, ...args]);
+        const simpleKey = args[0];
+        const fallbackData = fallback && typeof simpleKey === 'string' && fallback[simpleKey];
+        return {
+            data: !data && !error && fallbackData ? fallbackData : data,
+            error,
+            mutate: () => Promise.resolve(undefined),
+            isValidating: false
+        };
+    }
+    function keyToArgs(key) {
+        if (!key) {
+            return [key];
+        }
+        if (Array.isArray(key)) {
+            return key;
+        }
+        else if (key instanceof Function) {
+            return keyToArgs(key());
+        }
+        else {
+            return [key];
+        }
+    }
+
+    async function fetchJSON(url, options) {
+        try {
+            return await fetchJSONUnsafe(url, options);
+        }
+        catch (err) {
+            console.error(err);
+        }
+        return null;
+    }
+    async function fetchJSONUnsafe(url, options) {
+        const response = await fetch(url, {
+            ...options,
+            headers: {
+                ...options?.headers,
+                'Content-Type': 'application/json',
+            },
+        });
+        return await response.json();
+    }
+
+    const REGIONS_URL$1 = '/api/v1/regions';
+    function useGetRegions() {
+        const { data } = useAsyncData(REGIONS_URL$1, fetchJSONUnsafe);
+        return data || [];
+    }
+
+    const ACQUIRING_TYPES = [
+        {
+            code: '1',
+            name: 'Торговый эквайринг',
+        },
+        {
+            code: '2',
+            name: 'Мобильный эквайринг',
+        },
+        {
+            code: '3',
+            name: 'Интернет-эквайринг',
+        },
+        {
+            code: '4',
+            name: 'QR-эквайринг (СБП)',
+        },
+        {
+            code: '5',
+            name: 'Все виды эквайринга',
+        },
+    ];
 
     function useBlockRouter() {
         return BlockRouter.inst;
     }
 
-    const isURL = (href) => href?.includes('//');
+    const isURL = (href) => Boolean(href?.includes('//'));
+    const isLocalURL = (href, target) => Boolean(href &&
+        !isURL(href) &&
+        (projectSettings.BASE_PATH
+            ? href.startsWith(projectSettings.BASE_PATH)
+            : !href.startsWith('/')) &&
+        (!target || target === '_self'));
+    const isHash = (href) => Boolean(href?.startsWith('#'));
     const withoutQuery = (href) => (href || '').replace(/\/?\?.*/, '');
-    const getOrigin = (href) => {
-        if (!href || !isURL(href)) {
-            return undefined;
-        }
-        const url = href;
-        const protoSeparator = '//';
-        const endOfProto = url.indexOf(protoSeparator);
-        const endOfOrigin = url.indexOf('/', endOfProto + protoSeparator.length);
-        return endOfOrigin !== -1 ? url.substring(0, endOfOrigin) : url;
-    };
-    const getPathname = (href) => {
-        if (!href || !isURL(href)) {
-            return undefined;
-        }
-        const url = new URL(href);
-        return url.pathname;
-    };
-    const getHash = (href) => {
-        if (!href || !isURL(href)) {
-            return undefined;
-        }
-        const hashIndex = href.indexOf('#');
-        return hashIndex !== -1 ? href.substring(hashIndex, href.length) : undefined;
-    };
-    const isHash = (href) => href?.startsWith('#');
+    const getOrigin = (href) => (isURL(href) ? new URL(href).origin : undefined);
+    const getPathname = (href) => (isURL(href) ? new URL(href).pathname : undefined);
+    const getHash = (href) => (isURL(href) ? new URL(href).hash : undefined);
 
     var url = /*#__PURE__*/Object.freeze({
         __proto__: null,
         isURL: isURL,
+        isLocalURL: isLocalURL,
+        isHash: isHash,
         withoutQuery: withoutQuery,
         getOrigin: getOrigin,
         getPathname: getPathname,
-        getHash: getHash,
-        isHash: isHash
+        getHash: getHash
     });
 
-    const adjustHref = (href, router) => {
-        if (!href) {
-            return href;
-        }
-        const origin = getOrigin(router?.href);
-        // Relative URL
-        return origin ? href.replace(origin, '') || '/' : href;
-    };
+    const adjustHref = (href) => href && projectSettings.BASE_PATH && !(isURL(href) || href.startsWith('/'))
+        ? `${projectSettings.BASE_PATH}${href}`
+        : href;
 
     /* eslint-disable @typescript-eslint/ban-types */
     const handlerDecorator = (handler, targetContent) => {
@@ -623,29 +713,33 @@
     function useLink() {
         const router = useRouter();
         const blockRouter = useBlockRouter();
+        const handleLocalURL = (href, target) => (ev) => {
+            if (!isLocalURL(href, target)) {
+                // Proceed with native handle
+                return;
+            }
+            // Client routing
+            ev?.preventDefault();
+            if (isHash(href)) {
+                blockRouter.goto(href);
+            }
+            else if (href) {
+                router.push(href);
+            }
+        };
         return (props) => {
-            const href = adjustHref(props.href, router);
+            const href = adjustHref(props.href);
             return {
                 ...props,
                 href,
                 'aria-label': props.text,
                 onClick: handlerDecorator((ev) => {
                     props.onClick && props.onClick(ev);
-                    if (isRemoteHref(href, props.target)) {
-                        return;
-                    }
-                    ev?.preventDefault();
-                    if (isHash(href)) {
-                        blockRouter.goto(href);
-                    }
-                    else {
-                        href && router.push(href);
-                    }
+                    handleLocalURL(href, props.target)(ev);
                 }, props),
             };
         };
     }
-    const isRemoteHref = (href, target) => isURL(href) || (target && target !== '_self') || href?.startsWith('/');
 
     const buttonStyleMap = {
         primary: 'text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active',
@@ -695,30 +789,386 @@
     };
     const isWithText = ({ text, aboveText, appendLeft }) => Boolean(text || aboveText || !appendLeft);
 
-    const getDisabledButtonClasses = ({ className, rounded, version, }) => [
-        'inline-block',
-        buttonStyle,
-        version ? buttonDisabledStyleMap[version] : '',
-        rounded ? 'rounded-full' : 'rounded-md',
-        className,
-    ].join(' ');
+    const getDisabledButtonClasses = ({ className, rounded, version, }) => [
+        'inline-block',
+        buttonStyle,
+        version ? buttonDisabledStyleMap[version] : '',
+        rounded ? 'rounded-full' : 'rounded-md',
+        className,
+    ].join(' ');
+
+    const getRegularButtonClasses = ({ className, rounded, version, }) => [
+        buttonStyle,
+        'border border-transparent inline-block cursor-pointer no-underline focus:border-primary-text focus:border',
+        version ? buttonStyleMap[version] : '',
+        rounded ? 'rounded-full' : 'rounded-md',
+        className,
+    ].join(' ');
+
+    const Button = JSX(({ disabled, children, ...rest }) => {
+        const link = useLink();
+        const adjustedProps = link(rest);
+        const buttonInner = children ?? jsx(ButtonInner, { ...adjustedProps });
+        return disabled ? (jsx(DisabledButton, { ...adjustedProps, children: buttonInner })) : (jsx(RegularButton, { ...adjustedProps, children: buttonInner }));
+    });
+    const RegularButton = JSX(({ className = '', href, rel, target, ariaLabel, version, rounded, onClick, children }) => (jsx("a", { className: getRegularButtonClasses({ className, version, rounded }), href: href, rel: rel, target: target, "aria-label": ariaLabel, role: href ? 'link' : 'button', onClick: onClick, children: children })));
+    const DisabledButton = JSX(({ className, ariaLabel, version, rounded, children }) => (jsx("div", { role: "button", "aria-disabled": "true", "aria-label": ariaLabel, tabIndex: -1, className: getDisabledButtonClasses({ className, rounded, version }), children: children })));
+
+    const Footnote = JSX(({ link }) => (jsxs(Paragraph, { size: "text-s-light", color: "text-secondary-text", children: [jsx(Text, { children: "\u041D\u0430\u0436\u0438\u043C\u0430\u044F \u043A\u043D\u043E\u043F\u043A\u0443 \u0432\u044B \u043F\u043E\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0430\u0435\u0442\u0435 \u0441\u043E\u0433\u043B\u0430\u0441\u0438\u0435 \u0441 " }), link ? (jsx(Button, { href: link.href, ariaLabel: "\u0443\u0441\u043B\u043E\u0432\u0438\u044F \u043F\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0434\u0430\u043D\u043D\u044B\u0445", target: link.target, className: "text-primary-main", children: jsx(Text, { children: link.text }) })) : null] })));
+
+    const normalizeSelectedRegion$1 = (selectedRegion, regions) => !selectedRegion && regions?.length && regions[0]?.code ? regions[0].code : selectedRegion;
+
+    function useOutsideClick(onClick) {
+        const targetRef = useRef(null);
+        useEffect(() => {
+            const handleClickOutside = (event) => {
+                if (targetRef &&
+                    targetRef.current &&
+                    event.target instanceof Node &&
+                    !targetRef.current.contains(event.target)) {
+                    onClick();
+                }
+            };
+            document.addEventListener('click', handleClickOutside);
+            return () => {
+                document.removeEventListener('click', handleClickOutside);
+            };
+        }, [onClick]);
+        return targetRef;
+    }
+
+    const Select = JSX(({ className = '', isBorder = true, label, options = [], value, onChange, placeholder = '' }) => {
+        const [selectedItem, setSelectedItem] = useState(options[0] || { key: '', text: '' });
+        const [isOpen, setIsOpen] = useState(false);
+        const handleClickOutside = useCallback(() => setIsOpen(false), []);
+        const wrapperRef = useOutsideClick(handleClickOutside);
+        const choiceOption = (option) => {
+            setSelectedItem(option);
+            setIsOpen(false);
+            onChange(option);
+        };
+        const isSelected = (option) => Boolean(option.key === selectedItem.key);
+        useEffect(() => {
+            setSelectedItem(value || { key: '', text: '' });
+        }, [value]);
+        return (jsxs("div", { className: `${className}`, ref: wrapperRef, children: [label ? jsx("span", { className: "mb-2 flex text-primary-text", children: label }) : null, jsxs("div", { className: `relative ${isOpen ? 'z-20' : 'z-10'}`, children: [jsxs("div", { className: `text-l flex justify-between items-center mb-0.5 text-primary-text cursor-pointer
+            ${getBorderStyle(isBorder)}`, onClick: () => setIsOpen(!isOpen), children: [jsx("p", { className: "p-4 pr-8 h-14 overflow-hidden text-ellipsis whitespace-nowrap", children: selectedItem?.text || placeholder }), jsx(Icon, { name: "ArrowUpIcon", width: "16", height: "16", className: `absolute right-3 ${isOpen ? '' : 'rotate-180'}` })] }), options?.length ? (jsx("div", { className: `h-0 ${renderOptionsStyle(isOpen)}`, children: jsx("div", { className: `bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md shadow-[0_4px_25px_rgba(0,0,0,0.07)]`, children: options.map(renderOption(choiceOption, isOpen, isSelected)) }) })) : null] })] }));
+    });
+    const renderOptionsStyle = (isOpen) => (isOpen ? '' : 'overflow-hidden');
+    const renderOption = (choiceOption, isOpen, isSelected) => (option, i) => {
+        return (jsxs("div", { onClick: () => {
+                choiceOption(option);
+            }, className: "flex px-4 py-3 cursor-pointer hover:bg-main-divider pr-11 relative", children: [jsx("span", { className: "min-h-6", children: option.text }), jsx(Icon, { name: "DoneSimpleIcon", width: "16", height: "16", className: ['absolute right-4 pt-0.5', isSelected(option) && isOpen ? '' : 'hidden'].join(' ') })] }, String(i)));
+    };
+    const getBorderStyle = (isBorder) => isBorder ? 'border border-gray rounded-md hover:border-primary-hover' : '';
+
+    const WrapperSelect$1 = JSX(({ data, fieldLabel, fieldValue, selected, placeholder = '', setSelected, label }) => {
+        const dataFormat = data
+            .filter(Boolean)
+            .map((_) => ({ key: _?.[fieldValue || fieldLabel], text: _?.[fieldLabel] }));
+        const selectedObj = dataFormat.find((_) => _.key === selected);
+        return (jsx(Select, { options: dataFormat, label: label, placeholder: placeholder || selected, onChange: (_) => setSelected(_.key), value: selectedObj }));
+    });
+
+    const renderSelects = ({ acquiringType, regions, region, handleChange }) => (jsxs("div", { className: "flex justify-between gap-5 mb-7", children: [jsx("div", { className: "w-1/2", children: jsx(WrapperSelect$1, { data: ACQUIRING_TYPES, fieldValue: "code", fieldLabel: "name", selected: acquiringType, setSelected: (value) => handleChange({ acquiringType: value }), label: "\u0412\u0438\u0434 \u044D\u043A\u0432\u0430\u0439\u0440\u0438\u043D\u0433\u0430", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u044D\u043A\u0432\u0430\u0439\u0440\u0438\u043D\u0433" }) }), jsx("div", { className: "w-1/2", children: jsx(WrapperSelect$1, { data: regions, fieldValue: "code", fieldLabel: "name", selected: region, setSelected: (value) => handleChange({ region: value }), label: "\u0410\u0434\u0440\u0435\u0441", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0430\u0434\u0440\u0435\u0441" }) })] }));
+
+    const SlideCheckbox = JSX(({ checked, text, onClick }) => (jsxs("div", { role: "checkbox", "aria-checked": checked, className: "flex justify-start items-center w-full cursor-pointer mb-4", onClick: () => onClick && onClick(), children: [jsx("div", { className: `relative duration-300 w-9 h-5 mr-3 rounded rounded-2xl ${checked ? 'bg-primary-main' : 'bg-main-divider'}`, children: jsx("div", { className: `absolute opacity-80 duration-500 top-0.5 w-4 h-4 bg-white rounded rounded-full ${checked ? 'left-[50%]' : 'left-[5%]'}` }) }), jsx("div", { children: jsx(Text, { size: "text-m", font: "font-light", color: "text-primary-text", children: text }) })] })));
+
+    const renderSlideCheckboxes = ({ onlineСheckout, posTerminal, handleChange, }) => (jsxs("div", { className: "mb-5", children: [jsx(SlideCheckbox, { checked: onlineСheckout, text: "\u0425\u043E\u0447\u0443 \u043A\u0443\u043F\u0438\u0442\u044C \u043E\u043D\u043B\u0430\u0439\u043D-\u043A\u0430\u0441\u0441\u0443", onClick: () => handleChange({ onlineСheckout: !onlineСheckout }) }), jsx(SlideCheckbox, { checked: posTerminal, text: "\u0425\u043E\u0447\u0443 \u043A\u0443\u043F\u0438\u0442\u044C POS-\u0442\u0435\u0440\u043C\u0438\u043D\u0430\u043B", onClick: () => handleChange({ posTerminal: !posTerminal }) })] }));
+
+    const renderSubmitButton = (button, className) => {
+        const buttonStyle = getRegularButtonClasses({
+            className: 'text-white',
+            version: button?.version,
+        });
+        return (jsx("button", { type: "submit", className: `p-4 ${buttonStyle} ${className}`, children: button?.text ? button.text : 'Отправить заявку' }));
+    };
+
+    const useFormHandlers = ({ formState, handleSubmit, setFormState, typeForm, }) => {
+        const handleChange = useCallback((state) => setFormState((oldState) => ({ ...oldState, ...state })), []);
+        const onSubmit = useCallback(async (e) => {
+            e.preventDefault();
+            handleSubmit && (await handleSubmit({ ...formState, typeForm }));
+        }, []);
+        return {
+            handleChange,
+            onSubmit,
+        };
+    };
+
+    const ApplicationFormAcquiring = JSX((props) => {
+        const { button, link, handleSubmit } = props;
+        const [formState, setFormState] = useState({
+            acquiringType: '',
+            region: '',
+            fullName: '',
+            inn: '',
+            name: '',
+            phone: '',
+            onlineСheckout: false,
+            posTerminal: false,
+        });
+        const { acquiringType, region, fullName, inn, name, phone, onlineСheckout, posTerminal } = formState;
+        const regions = useGetRegions();
+        const { handleChange, onSubmit } = useFormHandlers({
+            formState,
+            handleSubmit,
+            setFormState,
+            typeForm: 'acqr',
+        });
+        const selectedRegion = normalizeSelectedRegion$1(region, regions);
+        useEffect(() => {
+            setFormState((oldState) => ({
+                ...oldState,
+                acquiringType: ACQUIRING_TYPES?.length && ACQUIRING_TYPES[0]?.code ? ACQUIRING_TYPES[0].code : '',
+            }));
+        }, []);
+        return (jsxs("form", { onSubmit: onSubmit, className: "container", children: [jsx(Heading, { headingType: "h6", title: "\u0412\u0438\u0434 \u044D\u043A\u0432\u0430\u0439\u0440\u0438\u043D\u0433\u0430 \u0438 \u0440\u0435\u0433\u0438\u043E\u043D", className: "text-center mb-4" }), renderSelects({
+                    acquiringType,
+                    regions,
+                    region: selectedRegion,
+                    handleChange,
+                }), jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "text-center mb-4" }), renderDataOrganization$4({ fullName, inn, name, phone, handleChange }), renderSlideCheckboxes({
+                    onlineСheckout,
+                    posTerminal,
+                    handleChange,
+                }), renderSubmitButton(button, 'mb-4'), jsx(Footnote, { link: link })] }));
+    });
+    const renderDataOrganization$4 = ({ fullName, inn, name, phone, handleChange, }) => (jsxs("div", { className: "flex justify-between gap-5 mb-5", children: [jsxs("div", { className: "w-1/2", children: [jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", value: fullName, onChange: (value) => handleChange({ fullName: value }) }), jsx(Input, { className: "shrink-0 text-l w-full", type: "text", "aria-label": "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", value: name, onChange: (value) => handleChange({ name: value }) })] }), jsxs("div", { className: "w-1/2", children: [jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", label: "\u0418\u041D\u041D", "aria-label": "\u0418\u041D\u041D", value: inn, onChange: (value) => handleChange({ inn: value }) }), jsx(Input, { className: "shrink-0 text-l w-full", type: "text", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", "aria-label": "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", value: phone, onChange: (value) => handleChange({ phone: value }) })] })] }));
+
+    const ApplicationFormBusinessCard = JSX((props) => {
+        const { button, link, handleSubmit } = props;
+        const [formState, setFormState] = useState({
+            region: '',
+            name: '',
+            phone: '',
+            inn: '',
+            mail: '',
+        });
+        const { name, phone, inn, mail } = formState;
+        const regions = useGetRegions();
+        const { handleChange, onSubmit } = useFormHandlers({
+            formState,
+            handleSubmit,
+            setFormState,
+            typeForm: 'bcrd',
+        });
+        const selectedRegion = normalizeSelectedRegion$1(formState.region, regions);
+        return (jsxs("form", { onSubmit: onSubmit, className: "container", children: [renderRegion$1({
+                    regions,
+                    region: selectedRegion,
+                    handleChange,
+                }), renderDataOrganization$3({ name, phone, inn, mail, handleChange }), renderSubmitButton(button, 'mb-4'), jsx(Footnote, { link: link })] }));
+    });
+    const renderDataOrganization$3 = ({ name, phone, mail, inn, handleChange, }) => (jsxs("div", { className: "flex justify-between gap-5", children: [jsxs("div", { className: "w-1/2", children: [jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", value: name, onChange: (value) => handleChange({ name: value }) }), jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u0418\u041D\u041D", label: "\u0418\u041D\u041D", value: inn, onChange: (value) => handleChange({ inn: value }) })] }), jsxs("div", { className: "w-1/2", children: [jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", value: phone, onChange: (value) => handleChange({ phone: value }) }), jsx(Input, { className: "shrink-0 text-l w-full ", type: "text", "aria-label": "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", value: mail, onChange: (value) => handleChange({ mail: value }) })] })] }));
+    const renderRegion$1 = ({ regions, region, handleChange }) => (jsx("div", { className: "flex justify-between gap-5 mb-5", children: jsx("div", { className: "w-full", children: jsx(WrapperSelect$1, { data: regions, fieldValue: "code", fieldLabel: "name", selected: region, setSelected: (value) => handleChange({ region: value }), label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D" }) }) }));
+
+    const SAFEBOXES_URL = '/api/v1/safeboxes';
+    const EMPTY_VALUE = [];
+    function useSafeBoxes(regionCode) {
+        const { data } = useAsyncData(regionCode ? `${SAFEBOXES_URL}?regionCode=${regionCode}` : null, fetchSafeBoxes);
+        return data || EMPTY_VALUE;
+    }
+    const fetchSafeBoxes = async (url) => {
+        const result = await fetchJSON(url, { method: 'GET' });
+        return result || EMPTY_VALUE;
+    };
+
+    const renderBankOffices = ({ regions, region, branches, department, handleChange, }) => (jsxs("div", { className: "flex justify-between gap-5 mb-7", children: [jsx("div", { className: "w-1/2", children: jsx(WrapperSelect$1, { data: regions, fieldValue: "code", fieldLabel: "name", selected: region, setSelected: (value) => handleChange({ region: value }), label: "\u0420\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D" }) }), jsx("div", { className: "w-1/2", children: jsx(WrapperSelect$1, { data: branches, fieldValue: "branchCode", fieldLabel: "address", selected: department, setSelected: (value) => handleChange({ department: value }), label: "\u0410\u0434\u0440\u0435\u0441", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0430\u0434\u0440\u0435\u0441" }) })] }));
+
+    const addSpacesBetweenNumbers = (number) => new Intl.NumberFormat('ru-RU', {}).format(number);
+
+    const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
+
+    const getSanitizedValue = (_) => _.split(/\s+/).join('');
+
+    const DISABLED_INPUT_CLASSES = 'disabled:border-gray disabled:bg-main-divider';
+    const InputRange = JSX(({ className, title, items = [], min = 1, max = 100, step = 1, value = min, disabled = false, onChange, }) => {
+        const handleChange = (e) => {
+            if (!onChange) {
+                return;
+            }
+            onChange(clamp(Number(getSanitizedValue(e.target.value)), min, max));
+        };
+        const inputStyle = {
+            backgroundSize: `${(((value - min) * 100) / (max - min)).toFixed(2)}% 100%`,
+        };
+        return (jsxs("div", { className: className, children: [jsxs("label", { className: "block relative", children: [title ? jsx("span", { className: "text-m-light text-primary-text", children: title }) : null, jsx("input", { className: `m-0 mt-2 font-sans text-h3 w-full h-14 border border-solid border-gray rounded-md
+            outline-none p-0 pl-4 box-border text-primary-text hover:border-primary-hover focus:border-primary-text ${DISABLED_INPUT_CLASSES}`, value: addSpacesBetweenNumbers(value), disabled: disabled, onChange: handleChange, onBlur: handleChange }), jsx("div", { className: "absolute inset-x-0 -bottom-1 px-4 leading-[18px]", children: jsx("input", { className: "box-border w-full m-0 cursor-pointer slider", type: "range", min: min, max: max, step: step, value: value, disabled: disabled, onChange: handleChange, style: inputStyle }) })] }), renderRangeCaption(items)] }));
+    });
+    function renderRangeCaption(items) {
+        return (jsx("div", { className: "flex justify-between my-2", children: items.map((item, i) => (jsx("span", { className: "text-s-light text-secondary-text", children: item }, String(i)))) }));
+    }
+
+    const renderCreditParameters = ({ amount, term, handleChange, }) => (jsxs("div", { className: "flex justify-between gap-5 mb-7", children: [renderInputRange({
+                label: 'Сумма кредита, ₽',
+                value: amount,
+                onChange: (value) => handleChange({ amount: value }),
+                min: MIN_CREDIT_AMOUNT,
+                max: MAX_CREDIT_AMOUNT,
+                items: ITEMS_CREDIT_AMOUNT,
+            }), renderInputRange({
+                label: 'Срок кредита, месяцев',
+                value: term,
+                onChange: (value) => handleChange({ term: value }),
+                min: MIN_CREDIT_TERM,
+                max: MAX_CREDIT_TERM,
+                items: ITEMS_CREDIT_TERM,
+            })] }));
+    const renderInputRange = (props) => (jsxs("div", { className: "w-1/2", children: [jsx("label", { children: jsx(Text, { size: "text-m-light", children: props.label }) }), jsx(InputRange, { ...props })] }));
+
+    const renderDataOrganization$2 = ({ fullName, inn, name, phone, mail, annualRevenue, handleChange, }) => (jsxs("div", { className: "flex justify-between gap-5 mb-7", children: [jsxs("div", { className: "w-1/2", children: [jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", value: fullName, onChange: (value) => handleChange({ fullName: value }) }), jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u0418\u041D\u041D", label: "\u0418\u041D\u041D", value: inn, onChange: (value) => handleChange({ inn: value }) }), jsx(Input, { className: "shrink-0 text-l w-full ", type: "text", "aria-label": "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", value: phone, onChange: (value) => handleChange({ phone: value }) })] }), jsxs("div", { className: "w-1/2", children: [jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u0413\u043E\u0434\u043E\u0432\u0430\u044F \u0432\u044B\u0440\u0443\u0447\u043A\u0430, \u20BD", label: "\u0413\u043E\u0434\u043E\u0432\u0430\u044F \u0432\u044B\u0440\u0443\u0447\u043A\u0430, \u20BD", value: annualRevenue, onChange: (value) => handleChange({ annualRevenue: value }) }), jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", value: name, onChange: (value) => handleChange({ name: value }) }), jsx(Input, { className: "shrink-0 text-l w-full ", type: "text", "aria-label": "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", value: mail, onChange: (value) => handleChange({ mail: value }) })] })] }));
+
+    const MIN_CREDIT_AMOUNT = 50000;
+    const MAX_CREDIT_AMOUNT = 3000000;
+    const ITEMS_CREDIT_AMOUNT = ['От 50 000 ₽', 'До 3 000 000 ₽'];
+    const MIN_CREDIT_TERM = 1;
+    const MAX_CREDIT_TERM = 60;
+    const ITEMS_CREDIT_TERM = ['От 1 года', 'До 5 лет'];
+    const ApplicationFormCredit = JSX((props) => {
+        const { button, link, handleSubmit } = props;
+        const [formState, setFormState] = useState({
+            amount: MIN_CREDIT_AMOUNT,
+            term: MIN_CREDIT_TERM,
+            fullName: '',
+            inn: '',
+            name: '',
+            phone: '',
+            mail: '',
+            region: '',
+            department: '',
+            annualRevenue: '',
+        });
+        const { amount, term, fullName, inn, name, phone, mail, region, department, annualRevenue } = formState;
+        const regions = useGetRegions();
+        const { handleChange, onSubmit } = useFormHandlers({
+            formState,
+            handleSubmit,
+            setFormState,
+            typeForm: 'cred',
+        });
+        const selectedRegion = normalizeSelectedRegion$1(formState.region, regions);
+        const branches = useSafeBoxes(region);
+        useEffect(() => {
+            handleChange({
+                department: '',
+            });
+        }, [formState.region, handleChange]);
+        return (jsxs("form", { onSubmit: onSubmit, className: "container", children: [jsx(Heading, { headingType: "h6", title: "\u041F\u0430\u0440\u0430\u043C\u0435\u0442\u0440\u044B \u043A\u0440\u0435\u0434\u0438\u0442\u0430", className: "text-center mb-4" }), renderCreditParameters({ amount, term, handleChange }), jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "text-center mb-4" }), renderDataOrganization$2({ fullName, inn, name, phone, mail, annualRevenue, handleChange }), jsx(Heading, { headingType: "h6", title: "\u041E\u0444\u0438\u0441 \u0431\u0430\u043D\u043A\u0430", className: "text-center mb-4" }), renderBankOffices({
+                    regions,
+                    region: selectedRegion,
+                    branches,
+                    department,
+                    handleChange,
+                }), renderSubmitButton(button, 'mb-4'), jsx(Footnote, { link: link })] }));
+    });
+
+    const ApplicationFormDeposit = JSX((props) => {
+        const { button, link, handleSubmit } = props;
+        const [formState, setFormState] = useState({
+            name: '',
+            phone: '',
+        });
+        const { handleChange, onSubmit } = useFormHandlers({
+            formState,
+            handleSubmit,
+            setFormState,
+            typeForm: 'dpst',
+        });
+        return (jsxs("form", { onSubmit: onSubmit, className: "container", children: [jsx(Heading, { headingType: "h6", title: "\u041E\u0441\u0442\u0430\u0432\u044C\u0442\u0435 \u0437\u0430\u044F\u0432\u043A\u0443 \u0438 \u043C\u044B \u043E\u0442\u0432\u0435\u0442\u0438\u043C \u043D\u0430 \u043B\u044E\u0431\u044B\u0435 \u0432\u043E\u043F\u0440\u043E\u0441\u044B \u043F\u043E \u0434\u0435\u043F\u043E\u0437\u0438\u0442\u0430\u043C", className: "text-center mb-4" }), renderDataOrganization$1({ name: formState.name, phone: formState.phone, handleChange }), jsxs("div", { className: "flex justify-between items-center max-w-[560px] m-auto", children: [jsx("div", { className: "flex-1", children: jsx(Footnote, { link: link }) }), renderSubmitButton(button)] })] }));
+    });
+    const renderDataOrganization$1 = ({ name, phone, handleChange }) => (jsxs("div", { className: "max-w-[560px] m-auto", children: [jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u0418\u043C\u044F", label: "\u0418\u043C\u044F", value: name, onChange: (value) => handleChange({ name: value }) }), jsx(Input, { className: "shrink-0 text-l w-full mb-5", type: "text", "aria-label": "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", value: phone, onChange: (value) => handleChange({ phone: value }) })] }));
+
+    const renderContacts = () => (jsxs("div", { className: "flex", children: [jsxs("a", { className: "flex items-center text-primary-text no-underline mr-6", href: `tel:8 (800) 200-78-70`, "aria-label": "8 (800) 200-78-70", children: [jsx(ImgInner, { image: { icon: 'PhoneIcon' }, width: "24", height: "24", className: "mr-3" }), jsx("span", { children: "8 (800) 200-78-70" })] }), jsxs("a", { className: "flex items-center text-primary-text no-underline", "aria-label": "ved@rshb.ru", href: `mailto:ved@rshb.ru`, children: [jsx(ImgInner, { image: { icon: 'MailIcon' }, width: "24", height: "24", className: "mr-3" }), jsx("span", { children: "ved@rshb.ru" })] })] }));
+
+    const SVG = JSX(({ className, viewBox, fill = 'none', width, height, paths, ...commonOptions }) => {
+        return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: className, viewBox: viewBox, fill: fill, width: width, height: height, children: paths.map(({ d, fill: pathFill, ...options }, i) => (jsx("path", { d: d, fill: pathFill || 'currentColor', ...commonOptions, ...options }, i))) }));
+    });
+
+    const CHECK_PATHS = [
+        {
+            d: 'M10.207.793a1 1 0 0 1 0 1.414l-6 6a1 1 0 0 1-1.414 0l-2.5-2.5a1 1 0 0 1 1.414-1.414L3.5 6.086 8.793.793a1 1 0 0 1 1.414 0Z',
+            fillRule: 'evenodd',
+            clipRule: 'evenodd',
+            fill: 'white',
+        },
+    ];
+    const Checkbox = JSX(({ className, text, checked, disabled, isRadio, onChange }) => {
+        return (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer group/box", children: [jsx("input", { className: style('peer appearance-none w-5 h-5 border-solid cursor-pointer checked:border-primary-main m-0', isRadio
+                            ? 'rounded-full border-2'
+                            : 'rounded checked:bg-primary-main disabled:bg-main-disabled border', checked ? 'border-black' : 'border-gray', disabled ? '' : 'group-hover/box:border-primary-hover'), type: "checkbox", onChange: (e) => onChange && onChange(e.target.checked), checked: checked, disabled: disabled }), isRadio ? (jsx("div", { className: "left-1 w-3 h-3 rounded-full bg-primary-main hidden absolute peer-checked:block" })) : (jsx(SVG, { paths: CHECK_PATHS, className: "hidden absolute left-1 ml-px peer-checked:block", width: "11", height: "9", fill: "white", viewBox: "0 0 11 9" })), text ? jsx("span", { className: "font-sans ml-3 text-l-light", children: text }) : null] }) }));
+    });
+
+    const renderQuestionsInterested = ({ currencyControl, documentaryOperations, conversionOperations, text, handleChange, }) => (jsxs("div", { className: "mb-6", children: [jsxs("div", { className: "flex items-center mb-4 gap-6", children: [jsx(Checkbox, { text: "\u0412\u0430\u043B\u044E\u0442\u043D\u044B\u0439 \u043A\u043E\u043D\u0442\u0440\u043E\u043B\u044C", checked: currencyControl, onChange: (value) => handleChange({ currencyControl: value }) }), jsx(Checkbox, { text: "\u0414\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0430\u0440\u043D\u044B\u0435 \u043E\u043F\u0435\u0440\u0430\u0446\u0438\u0438", checked: documentaryOperations, onChange: (value) => handleChange({ documentaryOperations: value }) }), jsx(Checkbox, { text: "\u041A\u043E\u043D\u0432\u0435\u0440\u0441\u0438\u043E\u043D\u043D\u044B\u0435 \u043E\u043F\u0435\u0440\u0430\u0446\u0438\u0438", checked: conversionOperations, onChange: (value) => handleChange({ conversionOperations: value }) })] }), jsx("textarea", { placeholder: "\u0423\u043A\u0430\u0436\u0438\u0442\u0435 \u0438\u043D\u0442\u0435\u0440\u0435\u0441\u0443\u044E\u0449\u0438\u0439 \u0412\u0430\u0441 \u0432\u043E\u043F\u0440\u043E\u0441, \u043C\u0435\u0441\u0442\u043E \u0432\u0435\u0434\u0435\u043D\u0438\u044F \u0431\u0438\u0437\u043D\u0435\u0441\u0430 \u0438 \u0443\u0434\u043E\u0431\u043D\u043E\u0435 \u0432\u0440\u0435\u043C\u044F \u0434\u043B\u044F \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u043D\u043E\u0433\u043E \u0437\u0432\u043E\u043D\u043A\u0430", className: "block w-full resize-y min-h-24 p-4 outline-none border rounded-md border-main-stroke hover:border-primary-hover active:border-primary-text focus:border-primary-text", value: text, onChange: (e) => handleChange({ text: e.target.value }) })] }));
+
+    const ApplicationFormWed = JSX((props) => {
+        const { button, link, handleSubmit } = props;
+        const [formState, setFormState] = useState({
+            fullName: '',
+            name: '',
+            phone: '',
+            mail: '',
+            currencyControl: false,
+            documentaryOperations: false,
+            conversionOperations: false,
+            text: '',
+        });
+        const { fullName, name, phone, mail, currencyControl, documentaryOperations, conversionOperations, text, } = formState;
+        const { handleChange, onSubmit } = useFormHandlers({
+            formState,
+            handleSubmit,
+            setFormState,
+            typeForm: 'kved',
+        });
+        return (jsxs("form", { onSubmit: onSubmit, className: "container", children: [jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "text-center mb-4" }), renderDataOrganization({ fullName, name, phone, mail, handleChange }), jsx(Heading, { headingType: "h6", title: "\u0418\u043D\u0442\u0435\u0440\u0435\u0441\u0443\u044E\u0449\u0438\u0439 \u0432\u043E\u043F\u0440\u043E\u0441", className: "text-center mb-4" }), renderQuestionsInterested({
+                    currencyControl,
+                    documentaryOperations,
+                    conversionOperations,
+                    text,
+                    handleChange,
+                }), jsxs("div", { className: "flex items-center pb-9 mb-9 border-b border-main-divider", children: [renderSubmitButton(button, 'mr-5'), jsx(Footnote, { link: link })] }), jsx(Heading, { headingType: "h6", title: "\u0418\u043B\u0438 \u0441\u0432\u044F\u0436\u0438\u0442\u0435\u0441\u044C \u0441 \u043D\u0430\u043C\u0438 \u0443\u0434\u043E\u0431\u043D\u044B\u043C \u0441\u043F\u043E\u0441\u043E\u0431\u043E\u043C", className: "text-center mb-4" }), renderContacts()] }));
+    });
+    const renderDataOrganization = ({ fullName, name, phone, mail, handleChange, }) => (jsxs("div", { children: [jsxs("div", { className: "flex justify-between gap-5 mb-5", children: [jsx("div", { className: "w-1/2", children: jsx(Input, { className: "shrink-0 text-l w-full", type: "text", "aria-label": "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", value: fullName, onChange: (value) => handleChange({ fullName: value }) }) }), jsx("div", { className: "w-1/2", children: jsx(Input, { className: "shrink-0 text-l w-full", type: "text", "aria-label": "\u0424\u0418\u041E", label: "\u0424\u0418\u041E", value: name, onChange: (value) => handleChange({ name: value }) }) })] }), jsxs("div", { className: "flex justify-between gap-5 mb-7", children: [jsx("div", { className: "w-1/2", children: jsx(Input, { className: "shrink-0 text-l w-full", type: "text", "aria-label": "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", value: phone, onChange: (value) => handleChange({ phone: value }) }) }), jsx("div", { className: "w-1/2", children: jsx(Input, { className: "shrink-0 text-l w-full", type: "text", "aria-label": "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", value: mail, onChange: (value) => handleChange({ mail: value }) }) })] })] }));
 
-    const getRegularButtonClasses = ({ className, rounded, version, }) => [
-        buttonStyle,
-        'border border-transparent inline-block cursor-pointer no-underline focus:border-primary-text focus:border',
-        version ? buttonStyleMap[version] : '',
-        rounded ? 'rounded-full' : 'rounded-md',
-        className,
-    ].join(' ');
+    const ResponseNotification = JSX(({ responceType }) => {
+        const responceOK = responceType === 'OK';
+        const backgroundColor = responceOK ? 'bg-responce-ok' : 'bg-responce-fail';
+        return (jsxs("div", { className: `flex items-center mt-5 p-5 rounded-md ${backgroundColor}`, children: [responceOK ? (jsx(ImgInner, { image: { icon: 'ResponceOKIcon' }, width: "42", height: "42", className: "mr-4" })) : (jsx(ImgInner, { image: { icon: 'ResponceFailIcon' }, width: "37", height: "34", className: "mr-4" })), jsxs("div", { children: [jsx(Heading, { headingType: "h6", title: responceOK ? 'Ваша заявка отправлена' : 'Не удалось отправить заявку', className: "mb-1" }), jsx(Text, { size: "text-l-light", color: "text-secondary-text", children: responceOK ? 'Совсем скоро мы с вами свяжемся' : 'Пожалуйста, повторите позднее' })] })] }));
+    });
 
-    const Button = JSX(({ disabled, children, ...rest }) => {
-        const link = useLink();
-        const adjustedProps = link(rest);
-        const buttonInner = children ?? jsx(ButtonInner, { ...adjustedProps });
-        return disabled ? (jsx(DisabledButton, { ...adjustedProps, children: buttonInner })) : (jsx(RegularButton, { ...adjustedProps, children: buttonInner }));
+    const COMPONENTS_MAP = {
+        credit: (props) => jsx(ApplicationFormCredit, { ...props }),
+        acquiring: (props) => jsx(ApplicationFormAcquiring, { ...props }),
+        'business-card': (props) => jsx(ApplicationFormBusinessCard, { ...props }),
+        deposit: (props) => jsx(ApplicationFormDeposit, { ...props }),
+        wed: (props) => jsx(ApplicationFormWed, { ...props }),
+    };
+    const ApplicationForm = JSX((props) => {
+        const { className = '', title, typeForm = 'credit', button, link, ...rest } = props;
+        const [responceType, setResponceType] = useState('');
+        const handleSubmit = useCallback(() => {
+            setResponceType('OK');
+            return 'OK';
+        }, []);
+        return (jsx(BlockWrapper, { className: `font-sans bg-white p-[50px] pb-9 ${className}`, ...rest, children: jsxs("div", { className: "container max-w-[978px]", children: [title ? jsx(Heading, { headingType: "h3", title: title, className: "text-center mb-8" }) : null, COMPONENTS_MAP[typeForm]({ button, link, handleSubmit }), responceType ? jsx(ResponseNotification, { responceType: responceType }) : null] }) }));
     });
-    const RegularButton = JSX(({ className = '', href, rel, target, ariaLabel, version, rounded, onClick, children }) => (jsx("a", { className: getRegularButtonClasses({ className, version, rounded }), href: href, rel: rel, target: target, "aria-label": ariaLabel, role: href ? 'link' : 'button', onClick: onClick, children: children })));
-    const DisabledButton = JSX(({ className, ariaLabel, version, rounded, children }) => (jsx("div", { role: "button", "aria-disabled": "true", "aria-label": ariaLabel, tabIndex: -1, className: getDisabledButtonClasses({ className, rounded, version }), children: children })));
+
+    const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => (jsxs(BlockWrapper, { className: `p-12 flex flex-col items-center ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", as: "h2", className: "max-w-[47rem] text-center", title: title })) : null, benefitList?.length ? (jsx("div", { className: "flex flex-wrap w-full justify-center gap-x-20 mt-8", children: benefitList.map(renderStep) })) : null] })));
+    const renderStep = (benefit, i) => {
+        const description = benefit.description;
+        return (jsxs("div", { className: "flex items-center basis-1/2 max-w-[500px] mb-14", children: [benefit?.icon?.icon ? (jsx(ImgInner, { className: "w-12 h-12 min-w-12 p-3 rounded-full bg-main-divider text-primary-main group-data-secondary:bg-white/30 group-data-secondary:text-black", image: benefit.icon, asSVG: true })) : null, benefit?.icon?.src ? jsx(ImgInner, { image: benefit.icon }) : null, jsxs("div", { className: "ml-5", children: [benefit?.label ? jsx(Heading, { headingType: "h6", children: benefit.label }) : null, renderDescription$5(description)] })] }, String(i)));
+    };
+    const renderDescription$5 = (description) => {
+        const benefitType = description?.benefitType || null;
+        return description && benefitType ? (jsx("div", { className: "mt-2 text-l-light text-secondary-text group-data-secondary:text-white/80", children: benefitType === 'list'
+                ? renderListBenefit(description)
+                : renderTextBenefit(description) })) : null;
+    };
+    const renderTextBenefit = (description) => description?.name || null;
+    const renderListBenefit = (description) => {
+        const listStyleType = description?.bullets ? 'list-disc pl-6' : '';
+        return description?.items && description.items.length > 0 ? (jsx("ul", { className: listStyleType, children: description.items.map((_, i) => (jsx("li", { children: _ }, `benefitListItem-${i}`))) })) : null;
+    };
 
     const renderButtonsSection = (buttons, { className = '', buttonClassName, isVertical } = {}) => buttons?.length && buttons.some((_) => _?.text) ? (jsx("div", { className: style('flex', isVertical ? 'flex-col gap-2' : 'gap-4', className), children: buttons.map(renderButton(buttonClassName)) })) : null;
     const renderButton = (buttonClassName = '') => (button, index) => {
@@ -864,8 +1314,6 @@
         return isVisible ? (jsxs("div", { children: [canDec ? (jsx(ArrowButton, { className: `absolute z-50 ${btnClass[0]} ${className}`, onClick: dec, ariaLabel: "\u041F\u0440\u043E\u043B\u0438\u0441\u0442\u0430\u0442\u044C \u0432\u043B\u0435\u0432\u043E", "data-block-control": "scroll-left", disabled: !canDec })) : null, canInc ? (jsx(ArrowButton, { className: `absolute z-50 rotate-180 ${btnClass[1]} ${className}`, onClick: inc, ariaLabel: "\u041F\u0440\u043E\u043B\u0438\u0441\u0442\u0430\u0442\u044C \u0432\u043F\u0440\u0430\u0432\u043E", "data-block-control": "scroll-right", disabled: !canInc })) : null] })) : null;
     }
 
-    const addSpacesBetweenNumbers = (number) => new Intl.NumberFormat('ru-RU', {}).format(number);
-
     const CalculatorValueBlock = JSX(({ title, value, postfix = '', prefix, className = '' }) => (jsxs("div", { className: style('mb-7', className), children: [title ? (jsx(Text, { size: "text-l-light", color: "text-secondary-text", children: title })) : null, value ? (jsx("div", { children: jsxs(Text, { size: "text-h3", children: [prefix, " ", addSpacesBetweenNumbers(Math.round(value)), " ", postfix] }) })) : (jsx("div", { children: jsx(Text, { size: "text-h3", children: "-" }) }))] })));
 
     const DEFAULT_MIN_SUM = 60000;
@@ -938,28 +1386,6 @@
 
     const renderFootnote = (text) => text ? (jsx(Paragraph, { size: "text-s-light", color: "text-secondary-text", children: text })) : null;
 
-    const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
-
-    const getSanitizedValue = (_) => _.split(/\s+/).join('');
-
-    const DISABLED_INPUT_CLASSES = 'disabled:border-gray disabled:bg-main-divider';
-    const InputRange = JSX(({ className, title, items = [], min = 1, max = 100, step = 1, value = min, disabled = false, onChange, }) => {
-        const handleChange = (e) => {
-            if (!onChange) {
-                return;
-            }
-            onChange(clamp(Number(getSanitizedValue(e.target.value)), min, max));
-        };
-        const inputStyle = {
-            backgroundSize: `${(((value - min) * 100) / (max - min)).toFixed(2)}% 100%`,
-        };
-        return (jsxs("div", { className: className, children: [jsxs("label", { className: "block relative", children: [title ? jsx("span", { className: "text-m-light text-primary-text", children: title }) : null, jsx("input", { className: `m-0 mt-2 font-sans text-h3 w-full h-14 border border-solid border-gray rounded-md
-            outline-none p-0 pl-4 box-border text-primary-text hover:border-primary-hover focus:border-primary-text ${DISABLED_INPUT_CLASSES}`, value: addSpacesBetweenNumbers(value), disabled: disabled, onChange: handleChange, onBlur: handleChange }), jsx("div", { className: "absolute inset-x-0 -bottom-1 px-4 leading-[18px]", children: jsx("input", { className: "box-border w-full m-0 cursor-pointer slider", type: "range", min: min, max: max, step: step, value: value, disabled: disabled, onChange: handleChange, style: inputStyle }) })] }), renderRangeCaption(items)] }));
-    });
-    function renderRangeCaption(items) {
-        return (jsx("div", { className: "flex justify-between my-2", children: items.map((item, i) => (jsx("span", { className: "text-s-light text-secondary-text", children: item }, String(i)))) }));
-    }
-
     const DEFAULT_MONEY_STEP = 1000;
     function renderWantedSumInput(title, params, callback) {
         const { moneyValue, minSum, maxSum, step = DEFAULT_MONEY_STEP, isShowItems = true } = params;
@@ -982,86 +1408,6 @@
         return [prefBonus, yearBonus];
     };
 
-    const consistentDataMap = new Map();
-    function useAsyncData(key, fetcher, { fallback } = {}) {
-        const args = useMemo(() => keyToArgs(key), [key]);
-        const [data, setData] = useState();
-        const [error, setError] = useState();
-        const updateData = (_) => {
-            setData(_);
-            setError(undefined);
-        };
-        const updateError = (_) => {
-            setData(undefined);
-            setError(_);
-        };
-        const chainToConsistentResult = (_) => {
-            _.then(rawData => consistentDataMap.get(args) || rawData)
-                .then(updateData)
-                .catch(updateError);
-        };
-        useEffect(() => {
-            const isEmptyKey = args.every(_ => _ === null);
-            if (isEmptyKey) {
-                return;
-            }
-            try {
-                const _ = fetcher(...args);
-                if ('then' in _) {
-                    chainToConsistentResult(_);
-                }
-                else {
-                    updateData(_);
-                }
-            }
-            catch (err) {
-                updateError(err);
-            }
-        }, [fetcher, ...args]);
-        const simpleKey = args[0];
-        const fallbackData = fallback && typeof simpleKey === 'string' && fallback[simpleKey];
-        return {
-            data: !data && !error && fallbackData ? fallbackData : data,
-            error,
-            mutate: () => Promise.resolve(undefined),
-            isValidating: false
-        };
-    }
-    function keyToArgs(key) {
-        if (!key) {
-            return [key];
-        }
-        if (Array.isArray(key)) {
-            return key;
-        }
-        else if (key instanceof Function) {
-            return keyToArgs(key());
-        }
-        else {
-            return [key];
-        }
-    }
-
-    async function fetchJSON(url, options) {
-        try {
-            return await fetchJSONUnsafe(url, options);
-        }
-        catch (err) {
-            console.error(err);
-        }
-        return null;
-    }
-    async function fetchJSONUnsafe(url, options) {
-        const response = await fetch(url, {
-            ...options,
-            headers: {
-                ...options?.headers,
-                'Content-Type': 'application/json',
-            },
-        });
-        return await response.json();
-    }
-
     function useCalculatorParams(dir) {
         const { data } = useAsyncData(`/wcms-resources/${dir}.json`, fetchJSONUnsafe);
         return data;
@@ -1106,24 +1452,6 @@
                         }, handleRestExpenseValue)] }), jsx("div", { children: monthBonus >= 0 ? (jsx(Rate, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u043C\u0435\u0441\u044F\u0446", rate: monthBonus, rateBlockClassName: "tracking-[-14px]" })) : null }), jsxs("div", { className: "w-full max-w-[350px]", children: [yearBonus >= 0 ? jsx(CalculatorValueBlock, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u0433\u043E\u0434", value: yearBonus }) : null, renderButtonsSection(buttons, { className: 'mt-7', isVertical: true }), renderFootnote(footnote)] })] }));
     });
 
-    const SVG = JSX(({ className, viewBox, fill = 'none', width, height, paths, ...commonOptions }) => {
-        return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: className, viewBox: viewBox, fill: fill, width: width, height: height, children: paths.map(({ d, fill: pathFill, ...options }, i) => (jsx("path", { d: d, fill: pathFill || 'currentColor', ...commonOptions, ...options }, i))) }));
-    });
-
-    const CHECK_PATHS = [
-        {
-            d: 'M10.207.793a1 1 0 0 1 0 1.414l-6 6a1 1 0 0 1-1.414 0l-2.5-2.5a1 1 0 0 1 1.414-1.414L3.5 6.086 8.793.793a1 1 0 0 1 1.414 0Z',
-            fillRule: 'evenodd',
-            clipRule: 'evenodd',
-            fill: 'white',
-        },
-    ];
-    const Checkbox = JSX(({ className, text, checked, disabled, isRadio, onChange }) => {
-        return (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer group/box", children: [jsx("input", { className: style('peer appearance-none w-5 h-5 border-solid cursor-pointer checked:border-primary-main m-0', isRadio
-                            ? 'rounded-full border-2'
-                            : 'rounded checked:bg-primary-main disabled:bg-main-disabled border', checked ? 'border-black' : 'border-gray', disabled ? '' : 'group-hover/box:border-primary-hover'), type: "checkbox", onChange: (e) => onChange && onChange(e.target.checked), checked: checked, disabled: disabled }), isRadio ? (jsx("div", { className: "left-1 w-3 h-3 rounded-full bg-primary-main hidden absolute peer-checked:block" })) : (jsx(SVG, { paths: CHECK_PATHS, className: "hidden absolute left-1 ml-px peer-checked:block", width: "11", height: "9", fill: "white", viewBox: "0 0 11 9" })), text ? jsx("span", { className: "font-sans ml-3 text-l-light", children: text }) : null] }) }));
-    });
-
     const STEP_DAYS = 1;
     function renderDaysInput(title, params, callback) {
         const { minDays, maxDays, daysValue } = params;
@@ -1430,25 +1758,6 @@
     };
     const replaceCommaToDot = (val) => String(val.replace(',', '.').replace(/[^.\d]/g, ''));
 
-    const Input = JSX(({ className = '', inputClassName = '', id, name, type = 'text', label, value = '', valid = true, children, onChange, onBlur, ...inputProps }) => {
-        const handleChange = useCallback((e) => {
-            const validInputValue = e.target.validity.valid ? e.target.value : value;
-            onChange(validInputValue);
-        }, [onChange]);
-        const handleBlur = useCallback((e) => {
-            if (!onBlur) {
-                return;
-            }
-            const validInputValue = e.target.validity.valid ? e.target.value : value;
-            onBlur(validInputValue);
-        }, [onBlur]);
-        const paddingStyle = children ? 'pr-8' : '';
-        const validStyle = valid
-            ? 'border-gray hover:border-primary-hover active:border-primary-text focus:border-primary-text'
-            : 'border-error';
-        return (jsxs("div", { className: `relative ${className}`, children: [label ? jsx("label", { className: "block text-m-light mb-2", children: label }) : null, jsx("input", { className: `w-full border rounded-md text-primary-text outline-none p-4 ${paddingStyle} ${validStyle} ${inputClassName}`, id: id, name: name || id, type: type, value: value, onChange: handleChange, onBlur: handleBlur, ...inputProps }), children] }));
-    });
-
     const CurrencyInput = JSX(({ className = '', onChange, minValue = 0, maxValue = 300000, ...inputProps }) => {
         const handleChange = useCallback((inputValue) => {
             if (!onChange) {
@@ -1775,7 +2084,7 @@
         const tileTitle = title ? (jsx(Heading, { headingType: "h5", as: "h3", className: "mb-3.5 z-10", title: title })) : null;
         const tileImage = image?.src ? (jsx(ImgInner, { className: "absolute bottom-0 right-0 m-0", image: image })) : null;
         const BORDER_STYLE = 'border border-solid border-gray group-data-secondary:border-white/50 group-data-gray:border-main-divider';
-        return (jsx(BlockWrapper, { className: style('relative p-7 min-w-[524px] text-left box-border group-data-gray:bg-main-divider/50', BORDER_STYLE, className), version: version, ...rest, children: jsx(BaseTile, { className: "flex justify-between", title: tileTitle, image: tileImage, children: jsxs("div", { className: "h-full flex flex-col justify-between", children: [description ? jsx("span", { className: "mb-2", children: description }) : null, items.length ? (jsx(List, { className: "text-xl-light flex flex-col flex-1 gap-2 max-w-[236px]", items: items })) : null, socialMedia.length ? jsx(SocialMedia, { className: "pt-10 pb-0", media: socialMedia }) : null, renderButtonsSection([button], { className: 'pt-2 mt-16' })] }) }) }));
+        return (jsx(BlockWrapper, { className: style('relative p-7 min-w-[524px] text-left box-border group-data-gray:bg-main-divider/50', BORDER_STYLE, className), version: version, ...rest, children: jsx(BaseTile, { className: "flex justify-between", title: tileTitle, image: tileImage, children: jsxs("div", { className: "h-full flex flex-col justify-between", children: [description ? (jsx("span", { className: "mb-2 group-data-gray:text-secondary-text group-data-gray:max-w-[265px]", children: description })) : null, items.length ? (jsx(List, { className: "text-xl-light flex flex-col flex-1 gap-2 max-w-[236px]", items: items })) : null, socialMedia.length ? jsx(SocialMedia, { className: "pt-10 pb-0", media: socialMedia }) : null, renderButtonsSection([button], { className: 'pt-2 mt-16' })] }) }) }));
     });
 
     const VISIBLE_CELLS_COUNT = 1;
@@ -1895,7 +2204,8 @@
         }
         return null;
     };
-    const ErrorBlock = JSX(({ className = '', title, subtitle, error, button }) => (jsxs("section", { className: `flex flex-col justify-center items-center mt-12 ${className}`, children: [jsx("div", { className: "flex justify-center py-20", children: renderErrorContent(error) }), title ? jsx(Heading, { headingType: "h1", className: "text-left mb-4", title: title }) : null, subtitle ? (jsx("div", { className: "font-sans text-xl-light mb-7 max-w-[613px] text-center", children: subtitle })) : null, button?.text ? (jsx(Button, { className: "py-4 px-9", version: button?.version, ...button, children: button.text })) : null] })));
+    const getErrorBlockStyle = (text) => (text ? 'py-20 pt-3 pb-1' : 'mb-16 pb-2 mt-24 pt-3');
+    const ErrorBlock = JSX(({ className = '', title, subtitle, error, button }) => (jsxs("section", { className: style('flex flex-col justify-center items-center', getErrorBlockStyle(button?.text), className), children: [jsx("div", { className: "flex justify-center py-20", children: renderErrorContent(error) }), title ? jsx(Heading, { headingType: "h1", className: "text-left mb-4", title: title }) : null, subtitle ? (jsx("div", { className: "font-sans text-xl-light mb-7 max-w-[613px] text-center", children: subtitle })) : null, button?.text ? (jsx(Button, { className: "py-4 px-9", version: button?.version, ...button, children: button.text })) : null] })));
 
     var Currency;
     (function (Currency) {
@@ -1952,50 +2262,6 @@
         [() => true, () => props.handleConvert(props.value)],
     ])(props)?.();
 
-    function useOutsideClick(onClick) {
-        const targetRef = useRef(null);
-        useEffect(() => {
-            const handleClickOutside = (event) => {
-                if (targetRef &&
-                    targetRef.current &&
-                    event.target instanceof Node &&
-                    !targetRef.current.contains(event.target)) {
-                    onClick();
-                }
-            };
-            document.addEventListener('click', handleClickOutside);
-            return () => {
-                document.removeEventListener('click', handleClickOutside);
-            };
-        }, [onClick]);
-        return targetRef;
-    }
-
-    const Select = JSX(({ className = '', isBorder = true, label, options = [], value, onChange, placeholder = '' }) => {
-        const [selectedItem, setSelectedItem] = useState(options[0] || { key: '', text: '' });
-        const [isOpen, setIsOpen] = useState(false);
-        const handleClickOutside = useCallback(() => setIsOpen(false), []);
-        const wrapperRef = useOutsideClick(handleClickOutside);
-        const choiceOption = (option) => {
-            setSelectedItem(option);
-            setIsOpen(false);
-            onChange(option);
-        };
-        const isSelected = (option) => Boolean(option.key === selectedItem.key);
-        useEffect(() => {
-            setSelectedItem(value || { key: '', text: '' });
-        }, [value]);
-        return (jsxs("div", { className: `${className}`, ref: wrapperRef, children: [label ? jsx("span", { className: "mb-2 flex text-primary-text", children: label }) : null, jsxs("div", { className: `relative ${isOpen ? 'z-20' : 'z-10'}`, children: [jsxs("div", { className: `text-l flex justify-between items-center mb-0.5 text-primary-text cursor-pointer
-            ${getBorderStyle$1(isBorder)}`, onClick: () => setIsOpen(!isOpen), children: [jsx("p", { className: "p-4 pr-8 h-14 overflow-hidden text-ellipsis whitespace-nowrap", children: selectedItem?.text || placeholder }), jsx(Icon, { name: "ArrowUpIcon", width: "16", height: "16", className: `absolute right-3 ${isOpen ? '' : 'rotate-180'}` })] }), options?.length ? (jsx("div", { className: `h-0 ${renderOptionsStyle(isOpen)}`, children: jsx("div", { className: `bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md shadow-[0_4px_25px_rgba(0,0,0,0.07)]`, children: options.map(renderOption(choiceOption, isOpen, isSelected)) }) })) : null] })] }));
-    });
-    const renderOptionsStyle = (isOpen) => (isOpen ? '' : 'overflow-hidden');
-    const renderOption = (choiceOption, isOpen, isSelected) => (option, i) => {
-        return (jsxs("div", { onClick: () => {
-                choiceOption(option);
-            }, className: "flex px-4 py-3 cursor-pointer hover:bg-main-divider pr-11 relative", children: [jsx("span", { className: "min-h-6", children: option.text }), jsx(Icon, { name: "DoneSimpleIcon", width: "16", height: "16", className: ['absolute right-4 pt-0.5', isSelected(option) && isOpen ? '' : 'hidden'].join(' ') })] }, String(i)));
-    };
-    const getBorderStyle$1 = (isBorder) => isBorder ? 'border border-gray rounded-md hover:border-primary-hover' : '';
-
     function renderInput(props) {
         const { placeholder, rates, selected, value, setValue, setSelected } = props;
         const ratesOptions = rates.map((_) => ({
@@ -2298,28 +2564,16 @@
     const renderMonthNames = (item, colSize) => item.month?.map((_, i) => (jsx("div", { style: { flexBasis: `${colSize}%` }, children: _.text }, `monthName-${i}`)));
     const renderMonthImages = (item) => item.month?.map((_) => _.image?.src ? (jsx("div", { className: "h-[207px] border-r pr-3 mr-3 border-main-divider last:border-r-0 last:pr-0 last:mr-0", children: jsx(ImgInner, { image: _.image, className: "flex" }) }, `monthImage-${_.image.src}`)) : null);
 
-    const checkIsHrefSameOrigin = (href, router) => [getOrigin(href), getOrigin(router.href)].every((link, _, arr) => Boolean(link) && link === arr[0]);
-
-    const normalizeURLPath = (href) => {
-        if (isURL(href) || href?.startsWith('/')) {
-            return href;
-        }
-        return `${projectSettings.BASE_PATH || ''}${href}`;
-    };
-
-    const isHrefActive = (href, router, cmp = (targetHref, baseHref) => baseHref.startsWith(targetHref)) => cmp(withoutQuery(normalizeURLPath(href)), withoutQuery(isURL(href) ? router.href : getPathname(router.href)));
+    const isHrefActive = (href, router) => withoutQuery(isURL(href) ? router.href : getPathname(router.href)).startsWith(withoutQuery(adjustHref(href)));
 
     const isSubItemActive = (router) => (subItem) => isHrefActive(subItem.href, router);
 
-    const isTopItemActive = (router) => (topItem) => topItem.items?.some(isSubItemActive(router)) ||
-        isHrefActive(topItem.href, router) ||
-        checkIsHrefSameOrigin(topItem.href, router) ||
-        Boolean(projectSettings.BASE_PATH?.startsWith(topItem.href || '/'));
+    const isTopItemActive = (router) => (topItem) => topItem.items?.some(isSubItemActive(router)) || isHrefActive(topItem.href, router);
 
-    const TopItem = JSX(({ className = '', active, flat, ariaLabel, children, ...rest }) => {
+    const TopItem = JSX(({ className = '', active, flat, children, ...rest }) => {
         const link = useLink();
         const { href, target, text, onClick } = link(rest);
-        return (jsx("a", { className: `${getLinkStyle(active, flat)} ${className}`, href: href, target: target, onClick: onClick, rel: "noopener noreferrer", "aria-label": ariaLabel, children: jsx("span", { className: getTextStyle$1(active, flat), children: text || children }) }));
+        return (jsx("a", { className: style(getLinkStyle(active, flat), className), href: href, target: target, onClick: onClick, rel: "noopener noreferrer", "aria-label": text, children: jsx("span", { className: getTextStyle$1(active, flat), children: text || children }) }));
     });
     const getLinkStyle = (active = false, flat = false) => style('inline-block border border-solid bg-transparent text-center no-underline', active
         ? 'rounded-md border-primary-main group-data-transparent:border-white'
@@ -2382,9 +2636,9 @@
         }
     };
 
-    const REGIONS_URL$1 = '/api/v1/regions';
+    const REGIONS_URL = '/api/v1/regions';
     function useRegions() {
-        const { data } = useAsyncData(REGIONS_URL$1, fetchJSONUnsafe);
+        const { data } = useAsyncData(REGIONS_URL, fetchJSONUnsafe);
         return data || [];
     }
 
@@ -2498,7 +2752,7 @@
         const [isShowLocationModal, { setTrue: showLocationModal, setFalse: hideLocationModal }] = useBool();
         const [location, onChangeLocation] = useLocation(defaultLocation);
         const iconVersion = version === 'transparent' ? 'white' : 'black';
-        return (jsxs("div", { className: style('flex items-center', className), children: [jsx(TopItem, { className: "mr-5", flat: true, href: "#", text: location.name, ariaLabel: "\u041C\u0435\u0441\u0442\u043E\u043F\u043E\u043B\u043E\u0436\u0435\u043D\u0438\u0435", onClick: showLocationModal }), officesLink ? (jsx(TopItem, { className: "mr-7", flat: true, href: officesLink, text: "\u041E\u0444\u0438\u0441\u044B \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u044B", ariaLabel: "\u0421\u043F\u0438\u0441\u043E\u043A \u0432\u0441\u0435\u0445 \u0434\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0445 \u043E\u0444\u0438\u0441\u043E\u0432 \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u043E\u0432" })) : null, chat ? (jsx(HeaderChatBotButton, { className: "mr-5", iconVersion: iconVersion, chat: chat })) : null, jsx(HeaderSecondaryMenuButton, { className: "mr-5", image: { icon: 'LoupeIcon', iconVersion }, ariaLabel: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443", disabled: true }), jsx(HeaderSecondaryMenuButton, { image: { icon: 'GridIcon', iconVersion }, ariaLabel: "\u0414\u043E\u043F\u043E\u043B\u043D\u0438\u0442\u0435\u043B\u044C\u043D\u044B\u0435 \u0441\u0441\u044B\u043B\u043A\u0438", isRounded: true, disabled: true }), isShowLocationModal ? (jsx(Location, { currentLocation: location, foreignOffices: foreignOffices, onChangeLocation: onChangeLocation, close: hideLocationModal })) : null] }));
+        return (jsxs("div", { className: style('flex items-center', className), children: [jsx(TopItem, { className: "mr-5", flat: true, href: "#", text: location.name, onClick: showLocationModal }), officesLink ? (jsx(TopItem, { className: "mr-7", flat: true, href: officesLink, text: "\u041E\u0444\u0438\u0441\u044B \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u044B" })) : null, chat ? (jsx(HeaderChatBotButton, { className: "mr-5", iconVersion: iconVersion, chat: chat })) : null, isShowLocationModal ? (jsx(Location, { currentLocation: location, foreignOffices: foreignOffices, onChangeLocation: onChangeLocation, close: hideLocationModal })) : null] }));
     });
 
     const findActiveSubItem = (router) => (items = []) => {
@@ -2516,18 +2770,20 @@
         const ref = useOutsideClick(handleClickOutside);
         return (jsxs("div", { className: style(visible ? 'bg-white rounded-md shadow-blue-gray' : '', className), ref: ref, children: [jsx("button", { className: "group/btn flex justify-between items-center h-6 ml-6", "aria-label": `${visible ? 'Скрыть другие разделы' : 'Показать другие разделы'}`, onClick: handleToggle, children: Array(3)
                         .fill(null)
-                        .map((_, i) => (jsx("div", { className: "w-[3px] h-[3px] rounded mr-1 bg-primary-text group-hover/btn:bg-primary-hover group-data-transparent:bg-white" }, String(i)))) }), jsx("div", { className: style('flex flex-col rounded-md bg-white p-6 pb-2', visible ? '' : 'hidden'), "aria-hidden": !visible, children: items?.map((item, i) => (jsx("a", { className: style('text-l-light pb-4 hover:text-primary-main', item === activeItem ? 'text-primary-main' : ''), ...link(item), children: item.text }, item.href || String(i)))) })] }));
+                        .map((_, i) => (jsx("div", { className: "w-[3px] h-[3px] rounded mr-1 bg-primary-text group-hover/btn:bg-primary-hover group-data-transparent:bg-white" }, String(i)))) }), jsx("div", { className: style('flex flex-col rounded-md bg-white p-6 pb-2', visible ? '' : 'hidden'), "aria-hidden": !visible, children: items?.map((item, i) => {
+                        const { text, ...linkProps } = item;
+                        return (jsx("a", { className: style('text-l-light pb-4 hover:text-primary-main', item === activeItem ? 'text-primary-main' : ''), ...link(linkProps), children: text }, item.href || String(i)));
+                    }) })] }));
     });
 
     const HeaderItem = JSX(({ className = '', active, dataItemName, children, ...rest }) => {
         const link = useLink();
         const { href, target, text, onClick } = link(rest);
-        return (jsxs("a", { className: `relative inline-block bg-transparent text-center no-underline ${className}`, href: href, target: target, "data-item-name": dataItemName, onClick: onClick, children: [jsx("span", { className: getTextStyle(active), children: text || children }), active ? jsx("div", { className: getBorderStyle(active) }) : null] }));
+        return (jsxs("a", { className: style('relative inline-block bg-transparent text-center no-underline', className), href: href, target: target, "data-item-name": dataItemName, onClick: onClick, children: [jsx("span", { className: getTextStyle(active), children: text || children }), active ? (jsx("div", { className: "absolute left-0 right-0 -bottom-3 h-0.5 bg-primary-main group-data-transparent:bg-transparent" })) : null] }));
     });
     const getTextStyle = (active = false) => style('font-sans text-l-light', active ? 'text-primary-main' : 'text-primary-text hover:text-primary-main', 'group-data-transparent:text-white group-data-transparent:hover:text-primary-hover');
-    const getBorderStyle = (active = false) => style('absolute left-0 -bottom-3 w-full h-0.5', active ? 'bg-primary-main group-data-transparent:bg-transparent' : '');
 
-    const HeaderSubMenuItem = JSX(({ className, active, observerOptions, onVisibilityChange, children, ...linkProps }) => {
+    const HeaderSubMenuItem = JSX(({ observerOptions, onVisibilityChange, children, ...rest }) => {
         const observerCallback = useCallback((entries) => {
             if (!entries.length || !onVisibilityChange) {
                 return;
@@ -2537,7 +2793,7 @@
             onVisibilityChange(entry.isIntersecting);
         }, [onVisibilityChange]);
         const ref = useIntersectionObserver(observerCallback, observerOptions);
-        return (jsx("span", { ref: ref, children: jsx(HeaderItem, { className: className, active: active, ...linkProps, children: children }) }));
+        return (jsx("span", { ref: ref, children: jsx(HeaderItem, { ...rest, children: children }) }));
     });
 
     const HeaderSubMenu = JSX(({ subItems = [] }) => {
@@ -2552,7 +2808,7 @@
                 ? handleIntersectionActivation(index)
                 : handleIntersectionDeactivation(index));
         }), [subItems]);
-        return (jsxs("nav", { className: "relative mt-6", children: [jsx("div", { ref: subItemsListRef, className: "overflow-hidden whitespace-nowrap mr-52 pb-3", children: subItems.map((_, i) => (jsx(HeaderSubMenuItem, { className: `mr-8 ${visibleItemsCount - 1 < i ? 'invisible' : ''}`, active: _ === activeSubItem, observerOptions: observerOptions, onVisibilityChange: subItemsVisibilityHandlers[i], ..._ }, String(i)))) }), dropDownMenuItems.length ? (jsx(DropdownMenu, { className: "absolute w-52 -top-4 right-0 pt-4 z-40", items: dropDownMenuItems, activeItem: activeSubItem })) : null] }));
+        return (jsxs("nav", { className: "relative mt-6", children: [jsx("div", { ref: subItemsListRef, className: "overflow-hidden whitespace-nowrap mr-52 pb-3", children: subItems.map((_, i) => (jsx(HeaderSubMenuItem, { className: style('mr-8', visibleItemsCount - 1 < i ? 'invisible' : ''), active: _ === activeSubItem, observerOptions: observerOptions, onVisibilityChange: subItemsVisibilityHandlers[i], ..._ }, String(i)))) }), dropDownMenuItems.length ? (jsx(DropdownMenu, { className: "absolute w-52 -top-4 right-0 pt-4 z-40", items: dropDownMenuItems, activeItem: activeSubItem })) : null] }));
     });
     const handleIntersectionActivation = (index) => (prev) => Math.max(prev, index + 1);
     const handleIntersectionDeactivation = (index) => (prev) => Math.min(prev, index);
@@ -2565,8 +2821,7 @@
         const router = useRouter();
         const { topItems, logo, defaultLocation, foreignOffices, officesLink } = useSWRResource(projectSettings.SITEMAP || 'sitemap', rest.options?.page?.fallback);
         const activeTopItem = topItems?.find(isTopItemActive(router));
-        const topMenu = topItems?.map((_, i) => (jsx(TopItem, { active: _ === activeTopItem, "aria-label": _.text, ..._ }, String(i))));
-        return (jsx(BlockWrapper, { tag: "header", className: style('pt-6 px-20', showSubMenu && activeTopItem?.items?.length ? 'pb-4' : 'pb-5', className), version: version, ...rest, children: jsxs("div", { className: "container", children: [jsxs("div", { className: "flex items-center", children: [jsx(Logo, { className: "mr-8", bgColor: bgColor, logo: logo }), topMenu, jsx(HeaderSecondaryMenu, { version: version, className: "ml-auto", foreignOffices: foreignOffices, defaultLocation: defaultLocation, officesLink: officesLink, chat: chat })] }), jsx("div", { className: style('mt-6 h-px bg-main-divider', version === 'transparent' ? 'opacity-30' : '') }), showSubMenu && activeTopItem?.items?.length ? (jsx(HeaderSubMenu, { subItems: activeTopItem.items })) : null] }) }));
+        return (jsx(BlockWrapper, { tag: "header", className: style('pt-6 px-20', showSubMenu && activeTopItem?.items?.length ? 'pb-4' : 'pb-5', className), version: version, ...rest, children: jsxs("div", { className: "container", children: [jsxs("div", { className: "flex items-center", children: [jsx(Logo, { className: "mr-8", bgColor: bgColor, logo: logo }), topItems?.map((_, i) => (jsx(TopItem, { active: _ === activeTopItem, ..._ }, String(i)))), jsx(HeaderSecondaryMenu, { version: version, className: "ml-auto", foreignOffices: foreignOffices, defaultLocation: defaultLocation, officesLink: officesLink, chat: chat })] }), jsx("div", { className: style('mt-6 h-px bg-main-divider', version === 'transparent' ? 'opacity-30' : '') }), showSubMenu && activeTopItem?.items?.length ? (jsx(HeaderSubMenu, { subItems: activeTopItem.items })) : null] }) }));
     });
 
     const gapStyles = {
@@ -3176,7 +3431,9 @@
         const { colorPalette } = getParentBlockContent(rest.options, {});
         return (jsx("div", { className: `border-0 border-b border-solid border-main-divider ${className}`, children: jsx(Foldable, { unfoldedByDefault: unfoldedByDefault, renderFoldableSection: ({ isUnfolded }) => (jsx("div", { className: "box-border", children: jsx(FoldableSection, { className: "grid grid-cols-12 gap-1 border-box", isUnfolded: isUnfolded, children: renderChildren(rest) }) })), renderFoldButton: ({ isUnfolded, onToggle }) => (jsx(DefaultFoldButton, { label: label, icon: icons[Number(isUnfolded)], dataTheme: colorPalette || rest.options?.page?.colorPalette, onClick: onToggle })) }) }));
     });
-    OtherProductsItem.childrenTypes = []; // All types of blocks are suitable
+    OtherProductsItem.childrenTypes = {
+        exclude: ['OtherProductsItem'],
+    };
 
     const ParagraphBlock = JSX(({ text, size, align, font, children, ...rest }) => (jsx(BlockWrapper, { ...rest, children: jsx(Paragraph, { size: size, align: align, font: font, children: text || children }) })));
 
@@ -3430,17 +3687,6 @@
     };
     const renderPrimaryFoldButton = ({ label, icon, onToggle }) => (jsxs("button", { className: "border-none bg-transparent px-9 pt-5 pb-3.5 flex justify-between text-left w-full font-sans text-h6 cursor-pointer", onClick: onToggle, children: [jsx("span", { className: "text-xl font-medium pr-2.5", children: label }), icon ? jsx(ImgInner, { image: getIconWithVersion({ icon }), width: "24", height: "24", asSVG: true }) : null] }));
 
-    const SAFEBOXES_URL = '/api/v1/safeboxes';
-    const EMPTY_VALUE = [];
-    function useSafeBoxes(regionCode) {
-        const { data } = useAsyncData(regionCode ? `${SAFEBOXES_URL}?regionCode=${regionCode}` : null, fetchSafeBoxes);
-        return data || EMPTY_VALUE;
-    }
-    const fetchSafeBoxes = async (url) => {
-        const result = await fetchJSON(url, { method: 'GET' });
-        return result || EMPTY_VALUE;
-    };
-
     const WrapperSelect = JSX(({ data, fieldLabel, fieldValue, selected, placeholder = '', setSelected, label }) => {
         const dataFormat = data
             .filter(Boolean)
@@ -3536,12 +3782,6 @@
     const getCaseVolume = (caseVolumes, selectedCaseVolume) => caseVolumes?.find((_) => _.volume === selectedCaseVolume);
     const getTariffs = (safeBoxCases, selectedBoxSize) => safeBoxCases?.find((_) => _.safeBoxCasesSize === selectedBoxSize)?.tariffs;
 
-    const REGIONS_URL = '/api/v1/regions';
-    function useGetRegions() {
-        const { data } = useAsyncData(REGIONS_URL, fetchJSONUnsafe);
-        return data || [];
-    }
-
     const DEFAULT_DAYS = 26;
     const SafeDepositRental = JSX(({ title, footnote, className = '', ...rest }) => {
         const [showMap, setShowMap] = useState(false);
@@ -3643,7 +3883,7 @@
         'horizontal-list': 'w-6',
         'vertical-list': 'h-6',
     };
-    const dotStyle = 'cursor-pointer bg-primary-main rounded-full transition-width duration-300 group-data-secondary:bg-white';
+    const dotStyle = 'cursor-pointer bg-primary-main rounded-full transition-width duration-300 group-data-secondary:bg-white group-data-transparent:bg-white';
     const inactiveDotStyle = 'w-2 h-2 opacity-30';
     const SwipeListControlDots = JSX(({ containerRef, activeIndex, dotCount = 0, listType = 'horizontal-list' }) => {
         const handleClick = (idx) => {
@@ -4059,6 +4299,7 @@
     const Blocks = {
         Accordion,
         AccordionItem,
+        ApplicationForm,
         BenefitsBlock,
         Bonus,
         BonusBenefitsBlock,
@@ -4242,7 +4483,7 @@
         return (jsx("div", { className: "flex items-end absolute bottom-0 right-0 h-full pointer-events-none", children: jsx(LikeControl, { className: "rounded-tl-lg sticky bottom-0 pointer-events-auto" }) }));
     }
 
-    const packageVersion = "0.7.8";
+    const packageVersion = "0.8.0";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;