@redneckz/wildless-cms-uni-blocks 0.12.8 → 0.12.9

package/mobile/bundle/bundle.umd.js

@@ -237,6 +237,27 @@
         return JSXTmpl;
     };
 
+    function CorporateLeadAPI() {
+        async function send(body) {
+            try {
+                const response = await fetch('/api/v1/sendcorporatelead', {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    mode: 'cors',
+                    body: JSON.stringify(body),
+                });
+                const data = await response.json();
+                return data;
+            }
+            catch (e) {
+                return null;
+            }
+        }
+        return {
+            send,
+        };
+    }
+
     class EventBus {
         subscribers = {};
         subjectsStateMap = {};
@@ -309,49 +330,878 @@
         .filter(Boolean)
         .join(' ');
 
-    const blockStyles = {
-        primary: 'bg-white text-primary-text',
-        secondary: 'bg-primary-main text-white',
-        gray: 'bg-main-divider text-primary-text',
-        transparent: 'bg-transparent text-primary-text',
-        '': '',
-    };
-    const BlockWrapper = JSX(({ className, version = 'primary', isTheme = true, defaultPadding = 'p-m', padding, block, tag = 'section', role, children, }) => {
-        const Tag = tag;
-        const ref = useBlockIntersectionObserver(block);
-        const [isHidden, setHidden] = useState(false);
-        useEffect(() => defaultEventBus.subscribe('tab', (event) => {
-            setHidden(Boolean(event.label && block?.labels?.length && !block.labels.includes(event.label)));
-        }), [block]);
-        const isGroup = version && isTheme;
-        return (jsx(Tag, { className: style('font-sans', isGroup ? 'group' : '', blockStyles[version], isHidden ? 'hidden' : '', padding || defaultPadding, className), ...(isGroup ? { 'data-ver': version } : {}), ...(block?.anchor ? { id: block.anchor, ref } : {}), role: role, children: children }));
+    const blockStyles = {
+        primary: 'bg-white text-primary-text',
+        secondary: 'bg-primary-main text-white',
+        gray: 'bg-main-divider text-primary-text',
+        transparent: 'bg-transparent text-primary-text',
+        '': '',
+    };
+    const BlockWrapper = JSX(({ className, version = 'primary', isTheme = true, defaultPadding = 'p-m', padding, block, tag = 'section', role, children, }) => {
+        const Tag = tag;
+        const ref = useBlockIntersectionObserver(block);
+        const [isHidden, setHidden] = useState(false);
+        useEffect(() => defaultEventBus.subscribe('tab', (event) => {
+            setHidden(Boolean(event.label && block?.labels?.length && !block.labels.includes(event.label)));
+        }), [block]);
+        const isGroup = version && isTheme;
+        return (jsx(Tag, { className: style('font-sans', isGroup ? 'group' : '', blockStyles[version], isHidden ? 'hidden' : '', padding || defaultPadding, className), ...(isGroup ? { 'data-ver': version } : {}), ...(block?.anchor ? { id: block.anchor, ref } : {}), role: role, children: children }));
+    });
+
+    const mobileHeadingTagMap = {
+        h1: 'h1',
+        h2: 'h1',
+        h3: 'h2',
+        h4: 'h2',
+        h5: 'h3',
+        h6: 'h3',
+    };
+    const headingTag = (tag) => mobileHeadingTagMap[tag] || 'h3';
+
+    const styles = {
+        h0: 'text-h0',
+        h1: 'text-h1',
+        h2: 'text-h2',
+        h3: 'text-h3',
+        h4: 'text-h4',
+        h5: 'text-h5',
+        h6: 'text-h6', // 20
+    };
+    const Heading = JSX(({ className = '', headingType = 'h3', as = 'h3', title, children }) => {
+        const Tag = headingTag(as);
+        return (jsx(Tag, { className: style('font-sans m-0', styles[headingType], className), children: title || children }));
+    });
+
+    const identity = (_) => _;
+
+    const useForm = (initialState, onSubmit) => {
+        const [formState, setFormState] = useState(initialState);
+        const [isDirtyForm, setDirtyForm] = useState(false);
+        const [dirtyFieldsMap, setDirtyFieldsMap] = useState({});
+        const handlersMap = useRef({});
+        const field = useCallback((fieldName, options) => {
+            const { parse = identity, format = identity } = options || {};
+            if (!handlersMap.current) {
+                handlersMap.current = {};
+            }
+            handlersMap.current[fieldName] ||= (value) => {
+                setFormState((prev) => ({ ...prev, [fieldName]: parse(value) }));
+                setDirtyFieldsMap((prev) => ({ ...prev, [fieldName]: true }));
+            };
+            return {
+                value: format(formState[fieldName]),
+                isDirty: isDirtyForm || dirtyFieldsMap[fieldName],
+                onChange: handlersMap.current[fieldName],
+            };
+        }, [formState, isDirtyForm, dirtyFieldsMap]);
+        const reset = useCallback(() => {
+            setFormState(initialState);
+            setDirtyForm(false);
+            setDirtyFieldsMap({});
+        }, [initialState]);
+        const handleSubmit = useCallback((e) => {
+            e.preventDefault();
+            setDirtyForm(true);
+            onSubmit && onSubmit(formState);
+        }, [onSubmit, formState]);
+        return [
+            formState,
+            {
+                isDirty: isDirtyForm || Object.values(dirtyFieldsMap).some(Boolean),
+                field,
+                reset,
+                onSubmit: handleSubmit,
+            },
+        ];
+    };
+
+    const objectValidator = (validatorsMap) => (o) => (o &&
+        Object.entries(validatorsMap).flatMap(([key, validator]) => validator(o[key]))) ||
+        [];
+
+    const isValidationSuccess = (info) => !info?.length;
+    const validator = (predicate) => (message) => (_) => predicate(_) ? [] : [message];
+
+    const isFilled = (_) => _ !== null && _ !== undefined;
+
+    const defaultCache = new Map();
+    const applyCache = (fetcher, cache = defaultCache) => (key) => {
+        const cachedData = cache.get(key);
+        if (isFilled(cachedData)) {
+            return cachedData;
+        }
+        const data = fetcher(key);
+        if (isFilled(data)) {
+            cache.set(key, Promise.resolve(data));
+        }
+        else {
+            cache.delete(key);
+        }
+        return data;
+    };
+
+    const isSimpleKey = (args) => Boolean(args && Array.isArray(args) && args.length === 1 && typeof args[0] === 'string');
+    function useAsyncData(key, fetcher, { fallback, cache } = {}) {
+        const args = useMemo(() => keyToArgs(key), [key]);
+        const [simpleKey] = isSimpleKey(args) ? args : [];
+        const [data, setData] = useState(undefined);
+        const [error, setError] = useState(undefined);
+        useEffect(() => {
+            const isEmptyKey = !args.some(isFilled);
+            if (isEmptyKey) {
+                return;
+            }
+            (async () => {
+                try {
+                    const newData = await (simpleKey
+                        ? applyCache(fetcher, cache)(simpleKey)
+                        : fetcher(...args));
+                    setData(newData);
+                    setError(undefined);
+                }
+                catch (err) {
+                    setData(undefined);
+                    setError(err);
+                }
+            })();
+        }, [fetcher, cache, args]);
+        const fallbackData = fallback && simpleKey && fallback[simpleKey];
+        return {
+            data: !data && fallbackData ? fallbackData : data,
+            error,
+            mutate: () => Promise.resolve(undefined),
+            isValidating: false
+        };
+    }
+    function keyToArgs(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 url ? await fetchJSONUnsafe(url, options) : null;
+        }
+        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 = '/api/v1/regions';
+    const EMPTY_VALUE$2 = [];
+    function useGetRegions() {
+        const { data } = useAsyncData(REGIONS_URL, fetchJSONUnsafe);
+        return data || EMPTY_VALUE$2;
+    }
+
+    const useDialog = (id = '') => ({
+        open: (message) => defaultEventBus.fire('dialog', { type: 'open', id, message }),
+        close: () => defaultEventBus.fire('dialog', { type: 'close' }),
+    });
+
+    const dirname = (path) => path?.split('/').slice(0, -1).join('/');
+
+    const isURL = (href) => Boolean(href?.includes(':'));
+    const isLocalURL = (href, target) => Boolean(href && !isURL(href) && (!target || target === '_self'));
+    const isHash = (href) => Boolean(href?.startsWith('#'));
+    const withoutQuery = (href) => (href || '').replace(/\?.*/, '').replace(/\/$/, '');
+    const joinPath = (...path) => path.filter(Boolean).join('/').replace(/\/+/g, '/');
+
+    var url = /*#__PURE__*/Object.freeze({
+        __proto__: null,
+        isURL: isURL,
+        isLocalURL: isLocalURL,
+        isHash: isHash,
+        withoutQuery: withoutQuery,
+        joinPath: joinPath
+    });
+
+    const adjustHref = (router) => (href, basePath = projectSettings.BASE_PATH) => {
+        if (!href || isURL(href) || hasPrefix(href, projectSettings.CDN)) {
+            return href;
+        }
+        const isRelativeToBase = href.startsWith('/');
+        return joinPath(hasPrefix(href, basePath) ? '' : basePath, isRelativeToBase ? '/' : dirname(router.pathname), href);
+    };
+    const hasPrefix = (href, prefix) => prefix && href && href.startsWith(prefix);
+
+    /* eslint-disable @typescript-eslint/ban-types */
+    const handlerDecorator = (handler, targetContent) => {
+        return handlerDecorator._impl(handler, targetContent);
+    };
+    handlerDecorator._impl = (handler) => handler;
+    handlerDecorator.setup = (impl) => {
+        handlerDecorator._impl = impl;
+    };
+
+    function useRouter() {
+        return useRouter._impl();
+    }
+    useRouter._impl = () => ({
+        href: globalThis.location?.href || '/',
+        pathname: globalThis.location?.pathname || '/',
+        query: {},
+        push: () => {
+            // Do nothing
+        },
+        replace: () => {
+            // Do nothing
+        },
+        back: () => {
+            // Do nothing
+        },
+    });
+    useRouter.setup = (impl) => {
+        useRouter._impl = impl;
+    };
+
+    function useLink(params = {}) {
+        const { isRemote, basePath } = params;
+        const router = useRouter();
+        const { close } = useDialog();
+        return (props) => ({
+            ...props,
+            href: isRemote && !basePath ? props.href : adjustHref(router)(props.href, basePath),
+            'aria-label': props.text,
+            onClick: handlerDecorator(handleHref(props), props),
+        });
+        function handleHref({ href, target, onClick }) {
+            return (ev) => {
+                onClick && onClick(ev);
+                if (!href || isRemote || !isLocalURL(href, target)) {
+                    // Default routing
+                    return;
+                }
+                close();
+                // Client routing
+                ev?.preventDefault();
+                router.push(href);
+            };
+        }
+    }
+
+    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',
+        white: 'text-primary-main bg-white hover:text-white hover:bg-primary-hover active:bg-white active:text-primary-main',
+        link: '',
+        transparent: '',
+        gray: 'text-primary-main bg-main-divider hover:text-white hover:bg-primary-hover active:bg-primary-active',
+        '': '',
+    };
+    const DisabledStyle = 'bg-main-divider text-main-disabled';
+    const buttonDisabledStyleMap = {
+        primary: DisabledStyle,
+        secondary: DisabledStyle,
+        white: DisabledStyle,
+        link: '',
+        transparent: '',
+        gray: DisabledStyle,
+        '': '',
+    };
+    const buttonStyle = 'text-center font-sans select-none';
+    const iconStyleMap = {
+        primary: 'group-hover/btn:brightness-0 group-hover/btn:invert',
+        secondary: 'group-hover/btn:brightness-0 group-hover/btn:invert',
+        white: 'group-hover/btn:brightness-0 group-hover/btn:invert',
+        link: '',
+        transparent: '',
+        gray: 'group-hover/btn:brightness-0 group-hover/btn:invert',
+        '': '',
+    };
+
+    const ButtonInner = JSX((props) => {
+        const { text, aboveText, appendLeft, appendRight, version = 'primary' } = props;
+        return (jsxs("div", { className: style(getButtonStyle(props), 'flex gap-2'), children: [appendLeft ? jsx("div", { className: iconStyleMap[version], children: appendLeft }) : null, isWithText(props) ? (jsxs("div", { children: [aboveText ? jsx("div", { className: "text-xs font-light text-left", children: aboveText }) : null, jsx("div", { className: `text-left ${aboveText ? 'text-s -mt-0.5' : 'text-l'}`, children: text })] })) : null, appendRight ? jsx("div", { className: iconStyleMap[version], children: appendRight }) : null] }));
+    });
+    const getButtonStyle = (props) => {
+        const { version, aboveText, rounded } = props;
+        if (version === 'link') {
+            return '';
+        }
+        const withTextStyle = `${aboveText ? 'py-2.5 px-9' : 'py-4 px-9'}`;
+        return [
+            'group/btn items-center justify-center',
+            isWithText(props) ? withTextStyle : 'h-12 w-12',
+            rounded ? 'rounded-full' : '',
+        ].join(' ');
+    };
+    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 getRegularButtonClasses = ({ className, rounded, version, }) => [
+        buttonStyle,
+        'border border-transparent inline-block cursor-pointer no-underline focus:border-primary-text focus:border h-fit',
+        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 Paragraph = JSX(({ children, ...styleProps }) => (jsx("p", { className: style('font-sans', Object.values(styleProps)), children: children })));
+
+    const Text = JSX(({ children, ...styleProps }) => (jsx("span", { className: style('font-sans', Object.values(styleProps)), children: children })));
+
+    const Footnote = JSX(({ link }) => (jsxs(Paragraph, { size: "text-s", font: "font-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 withValidator = (props, validator) => {
+        const { value, isDirty } = props;
+        const errors = isDirty ? validator(value) : [];
+        return {
+            ...props,
+            errors,
+            error: errors[0],
+        };
+    };
+
+    const Input = JSX(({ key, className = '', inputClassName = '', id, name, type = 'text', label, placeholder, value = '', valid = true, children, onChange, onFocus, onBlur, pattern, }) => {
+        const handleChange = useCallback((e) => {
+            onChange && onChange(e.target?.value || '');
+        }, [onChange]);
+        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: style('relative', className), children: [jsxs("label", { children: [label ? (jsx("div", { className: "mb-2", children: jsx(Text, { size: "text-m", font: "font-light", children: label }) })) : null, jsx("input", { className: style('w-full border rounded-md text-primary-text outline-none p-4', paddingStyle, validStyle, inputClassName), id: id, name: name || id, placeholder: placeholder, type: type, value: value, onInput: handleChange, onFocus: onFocus, onBlur: onBlur, pattern: pattern }, key)] }), children] }));
+    });
+
+    const InputControl = JSX(({ className, label, value = '', error, onChange, onBlur }) => (jsxs("div", { className: className, children: [jsx(Input, { type: "text", "aria-label": label, label: label, valid: Boolean(!error), value: value, onChange: onChange, onBlur: onBlur }), jsx("div", { className: "h-2", children: error ? (jsx(Text, { size: "text-xs", font: "font-light", color: "text-error", children: error })) : null })] })));
+
+    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((value) => onChange && onChange(normalizePhone(value)), [onChange]);
+        return (jsx(Input, { onChange: handleChange, onFocus: (event) => handleChange(event?.target?.value || ''), ...inputProps, children: children }));
+    });
+
+    const PhoneInputControl = JSX(({ className, label, value, error, onChange, onBlur }) => (jsxs("div", { className: className, children: [jsx(PhoneInput, { "aria-label": label, label: label, valid: Boolean(!error), value: value, onChange: onChange, onBlur: onBlur }), jsx("div", { className: "h-2", children: error ? (jsx(Text, { size: "text-xs", font: "font-light", color: "text-error", children: error })) : null })] })));
+
+    const pattern = (regexp) => validator((_) => typeof _ === 'string' && regexp.test(_));
+
+    const required = validator((_) => _ !== null && _ !== undefined && _ !== '');
+
+    const ERROR_MESSAGE = 'Некорректно заполненное поле';
+    const defaultValidator = required(ERROR_MESSAGE);
+    const nameValidator = validator((_) => typeof _ === 'string' && _.length > 1)(ERROR_MESSAGE);
+    const innValidator = validator((_) => typeof _ === 'string' && (_.length === 10 || _.length === 12))(ERROR_MESSAGE);
+    const phoneValidator = pattern(/^(\+7)?[\s-]?\(?[0-9]{3}\)?[\s-]?[0-9]{3}[\s-]?[0-9]{2}[\s-]?[0-9]{2}$/)(ERROR_MESSAGE);
+
+    const renderAcquiringDataOrganization = (field) => (jsxs("div", { className: "mb-4 sm:flex sm:justify-between sm:gap-5 sm:mb-7", children: [jsxs("div", { className: "sm:w-1/2", children: [jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", ...withValidator(field('fullName'), defaultValidator) }), jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", ...withValidator(field('name'), nameValidator) })] }), jsxs("div", { className: "sm:w-1/2", children: [jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) }), jsx(PhoneInputControl, { className: "shrink-0 w-full mb-3", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) })] })] }));
+
+    const ACQUIRING_TYPES = [
+        {
+            name: 'Торговый эквайринг',
+        },
+        {
+            name: 'Мобильный эквайринг',
+        },
+        {
+            name: 'Интернет-эквайринг',
+        },
+        {
+            name: 'QR-эквайринг (СБП)',
+        },
+        {
+            name: 'Все виды эквайринга',
+        },
+    ];
+
+    function useBool(defaultValue = false) {
+        const [value, setValue] = useState(defaultValue);
+        const setTrue = useCallback(() => setValue(true), []);
+        const setFalse = useCallback(() => setValue(false), []);
+        const toggle = useCallback(() => setValue((_) => !_), []);
+        return [value, { setValue, setTrue, setFalse, toggle }];
+    }
+
+    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 svgUseStyleMap = {
+        normal: '',
+        color: 'text-primary-main',
+        black: 'text-black',
+        white: 'text-black',
+    };
+    const Icon = JSX(({ className = '', imageClassName = '', name = '', alt = `Иконка ${name}`, title = alt, iconVersion = 'color', ...imgProps }) => {
+        const router = useRouter();
+        const href = adjustHref(router)(joinPath(projectSettings.CDN, '/icons', `${name}.svg`));
+        if (iconVersion !== 'normal') {
+            return (jsx(Background, { className: className, children: jsxs("svg", { className: style(getSvgSize(imgProps.width), svgUseStyleMap[iconVersion], iconVersion === 'white' ? 'invert' : '', imageClassName), ...imgProps, "aria-hidden": "true", children: [title ? jsx("title", { children: title }) : null, alt ? jsx("desc", { children: alt }) : null, jsx("use", { href: `${href}#icon`, xlinkHref: `${href}#icon` })] }) }));
+        }
+        if (!className.includes('h-')) {
+            imgProps['style'] = { height: `${imgProps.height}px` };
+        }
+        return (jsx("img", { className: className, src: href, alt: alt, title: title, "aria-hidden": "true", ...imgProps }));
+    });
+    const getSvgSize = (width) => (width ? '' : 'w-full h-full');
+    const Background = JSX(({ className, children }) => className ? jsx("div", { className: className, children: children }) : children);
+
+    const Select = JSX(({ className = '', label, options = [], value, valid = true, isBorder = true, placeholder = '', onChange, }) => {
+        const [isOpen, { setFalse: close, toggle }] = useBool();
+        const wrapperRef = useOutsideClick(close);
+        const handleChange = useCallback((option) => {
+            close();
+            onChange && onChange(option);
+        }, [onChange]);
+        const isSelected = (option) => option.key === value?.key;
+        return (jsxs("div", { className: className, ref: wrapperRef, children: [label ? (jsx("div", { className: "mb-2", children: jsx(Text, { size: "text-m", color: "text-primary-text", font: "font-light", children: label }) })) : null, jsxs("div", { className: style('relative', isOpen ? 'z-20' : 'z-10'), children: [jsxs("div", { className: style('text-l flex justify-between items-center text-primary-text cursor-pointer', getBorderStyle(isBorder, valid)), onClick: toggle, children: [jsx("p", { className: "p-4 pr-8 h-14 overflow-hidden text-ellipsis whitespace-nowrap", children: formatOption(value) || placeholder }), jsx(Icon, { className: style('absolute right-3', isOpen ? '' : 'rotate-180'), name: "ArrowUpIcon", width: "16", height: "16" })] }), options?.length ? (jsx("div", { className: style('h-0', isOpen ? '' : 'overflow-hidden'), 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(handleChange, isOpen, isSelected)) }) })) : null] })] }));
+    });
+    const renderOption = (handleChange, isOpen, isSelected) => (option, i) => (jsxs("div", { onClick: () => {
+            handleChange(option);
+        }, className: "flex px-4 py-3 cursor-pointer hover:bg-main-divider pr-11 relative", children: [jsx("span", { className: "min-h-6", children: formatOption(option) }), jsx(Icon, { name: "DoneSimpleIcon", width: "16", height: "16", className: style('absolute right-4 pt-0.5', isSelected(option) && isOpen ? '' : 'hidden') })] }, String(i)));
+    const formatOption = (_) => _?.text || _?.key || '';
+    const getBorderStyle = (isBorder, valid) => style(isBorder ? 'border rounded-md hover:border-primary-hover' : '', valid ? ' border-gray' : 'border-error');
+
+    const SelectControl = JSX((props) => (jsxs("div", { children: [jsx(Select, { ...props, valid: !props.error }), jsx("div", { className: "h-2", children: props.error ? (jsx(Text, { size: "text-xs", font: "font-light", color: "text-error", children: props.error })) : null })] })));
+
+    const renderAcquiringRegion = ({ regions, field }) => (jsxs("div", { className: "mb-4 pb-1 border-b border-b-main-divider sm:flex sm:justify-between sm:gap-5 sm:mb-7 sm:border-none sm:pb-0", children: [jsx("div", { className: "mb-3 sm:mb-0 sm:w-1/2", children: jsx(SelectControl, { 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", options: ACQUIRING_TYPES.map(({ name: key = '' }) => ({ key, text: key })), ...withValidator(field('acquiringType'), defaultValidator) }) }), jsx("div", { className: "mb-3 sm:mb-0 sm:w-1/2", children: jsx(SelectControl, { label: "\u0410\u0434\u0440\u0435\u0441", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0430\u0434\u0440\u0435\u0441", options: regions.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }) })] }));
+
+    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-3", onClick: () => onChange && onChange(!value), children: [jsx("div", { className: style('relative flex-shrink-0 duration-300 w-9 h-5 mr-3 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-[50%]' : 'left-[5%]') }) }), jsx(Text, { size: "text-l", font: "font-light", color: "text-primary-text", children: text })] })));
+
+    const renderSlideCheckboxes = (field) => (jsxs("div", { className: "sm:mb-5", children: [jsx(SlideCheckbox, { text: "\u0425\u043E\u0447\u0443 \u043A\u0443\u043F\u0438\u0442\u044C \u043E\u043D\u043B\u0430\u0439\u043D-\u043A\u0430\u0441\u0441\u0443", ...field('onlineCheckout') }), jsx(SlideCheckbox, { text: "\u0425\u043E\u0447\u0443 \u043A\u0443\u043F\u0438\u0442\u044C POS-\u0442\u0435\u0440\u043C\u0438\u043D\u0430\u043B", ...field('posTerminal') })] }));
+
+    const renderSubmitButton = (button, className) => {
+        const buttonStyle = getRegularButtonClasses({
+            className: 'text-white',
+            version: button?.version,
+        });
+        return (jsx("button", { type: "submit", className: style('p-4 mt-3 w-full sm:mt-0 sm:w-auto', buttonStyle, className), children: button?.text ? button.text : 'Отправить заявку' }));
+    };
+
+    const initialFormState$4 = {
+        acquiringType: { key: 'Торговый эквайринг' },
+        fullName: '',
+        inn: '',
+        name: '',
+        phone: '',
+        onlineCheckout: false,
+        posTerminal: false,
+    };
+    const acquiringValidator = objectValidator({
+        acquiringType: defaultValidator,
+        region: defaultValidator,
+        fullName: defaultValidator,
+        inn: innValidator,
+        name: nameValidator,
+        phone: phoneValidator,
+    });
+    const ApplicationFormAcquiring = JSX((props) => {
+        const { button, link, onSubmit } = props;
+        const handleSubmit = useCallback((formState) => {
+            const { acquiringType, region, fullName, inn, name, phone, onlineCheckout, posTerminal } = formState;
+            isValidationSuccess(acquiringValidator(formState)) &&
+                onSubmit({
+                    typeForm: 'acqr',
+                    region: region?.text || '',
+                    partnerComments: `Вид эквайринга=${acquiringType?.key || ''}/Онлайн касса=${onlineCheckout}/POS-терминал=${posTerminal}`,
+                    fullName,
+                    inn,
+                    name,
+                    phone,
+                });
+        }, [onSubmit]);
+        const [, { field, ...formProps }] = useForm(initialFormState$4, handleSubmit);
+        const regions = useGetRegions();
+        return (jsxs("form", { className: "container", onSubmit: formProps.onSubmit, 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: "sm:text-center mb-4" }), renderAcquiringRegion({ regions, field }), jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "sm:text-center mb-4" }), renderAcquiringDataOrganization(field), renderSlideCheckboxes(field), renderSubmitButton(button, 'mb-4'), jsx(Footnote, { link: link })] }));
+    });
+
+    const renderBusinessCardDataOrganization = (field) => (jsxs("div", { className: "sm:flex sm:justify-between sm:gap-5", children: [jsxs("div", { className: "sm:w-1/2", children: [jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) })] }), jsxs("div", { className: "sm:w-1/2", children: [jsx(PhoneInputControl, { className: "shrink-0 w-full mb-3", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) }), jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('mail'), defaultValidator) })] })] }));
+
+    const renderRegion = ({ regions, field }) => (jsx("div", { className: "w-full mb-3 sm:mb-5", children: 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.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }) }));
+
+    const initialFormState$3 = {
+        name: '',
+        phone: '',
+        inn: '',
+        mail: '',
+    };
+    const businessCardValidator = objectValidator({
+        region: defaultValidator,
+        name: nameValidator,
+        phone: phoneValidator,
+        inn: innValidator,
+        mail: defaultValidator,
+    });
+    const ApplicationFormBusinessCard = JSX((props) => {
+        const { button, link, onSubmit } = props;
+        const handleSubmit = useCallback((formState) => {
+            const { region, name, phone, inn, mail } = formState;
+            isValidationSuccess(businessCardValidator(formState)) &&
+                onSubmit({
+                    typeForm: 'bcrd',
+                    region: region?.text || '',
+                    name,
+                    phone,
+                    inn,
+                    mail,
+                });
+        }, [onSubmit]);
+        const [, { field, ...formProps }] = useForm(initialFormState$3, handleSubmit);
+        const regions = useGetRegions();
+        return (jsxs("form", { className: "container", onSubmit: formProps.onSubmit, children: [renderRegion({ regions, field }), renderBusinessCardDataOrganization(field), renderSubmitButton(button, 'mb-4'), jsx(Footnote, { link: link })] }));
+    });
+
+    const BRANCHES_URL = '/api/v1/branches';
+    const EMPTY_VALUE$1 = [];
+    function useBranches(regionCode) {
+        const { data } = useAsyncData(regionCode ? `${BRANCHES_URL}?regionCode=${regionCode}` : null, fetchSafeBoxes);
+        return data || EMPTY_VALUE$1;
+    }
+    const fetchSafeBoxes = async (url) => {
+        const result = await fetchJSON(url, { method: 'GET' });
+        return result || EMPTY_VALUE$1;
+    };
+
+    const MIN_CREDIT_AMOUNT = 1000;
+    const MAX_CREDIT_AMOUNT = 1000000000;
+    const ITEMS_CREDIT_AMOUNT = ['От 1 000 ₽', 'До 1 000 000 000 ₽'];
+    const MIN_CREDIT_TERM = 1;
+    const MAX_CREDIT_TERM = 180;
+    const ITEMS_CREDIT_TERM = ['От 1 мес', 'До 15 лет'];
+
+    const renderCreditDataOrganization = (field) => (jsxs("div", { className: "mb-4 pb-1 border-b border-b-main-divider sm:flex sm:justify-between sm:gap-5 sm:mb-7 sm:border-none sm:pb-0", children: [jsxs("div", { className: "sm:w-1/2", children: [jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", ...field('fullName') }), jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u0418\u041D\u041D", ...withValidator(field('inn'), innValidator) }), jsx(PhoneInputControl, { className: "shrink-0 w-full mb-3", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) })] }), jsxs("div", { className: "sm:w-1/2", children: [jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u0413\u043E\u0434\u043E\u0432\u0430\u044F \u0432\u044B\u0440\u0443\u0447\u043A\u0430, \u20BD", ...withValidator(field('annualRevenue'), defaultValidator) }), jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u043D\u043E\u0435 \u043B\u0438\u0446\u043E", ...withValidator(field('name'), nameValidator) }), jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...field('mail') })] })] }));
+
+    const useNormalizedInput = (props, { normalize, format }) => {
+        const { value, onFocus, onBlur, onChange } = props;
+        const [isFocused, setIsFocused] = useState(false);
+        const handleFocus = useCallback((e) => {
+            setIsFocused(true);
+            onFocus && onFocus(e);
+        }, []);
+        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));
+
+    const toLocalNumberFormat = (fractionDigits = 0) => (_ = 0) => new Intl.NumberFormat('ru-RU', {
+        minimumFractionDigits: 0,
+        maximumFractionDigits: fractionDigits,
+    }).format(Number(_) || 0);
+
+    function parseDecimal(value) {
+        const rawValue = (value || '').replace(/\D/g, '');
+        const unsafeDecimal = parseInt(rawValue, 10);
+        return Number.isNaN(unsafeDecimal) ? 0 : unsafeDecimal;
+    }
+
+    function renderRangeWithTicks({ list = [], min, max, step, value = list[0] || min, disabled, onChange, }) {
+        const rangeValue = list.length ? list.indexOf(value) : value;
+        const inputStyle = {
+            backgroundSize: `${(((rangeValue - min) * 100) / (max - min)).toFixed(2)}% 100%`,
+        };
+        return (jsxs("div", { children: [list.length ? (jsx("div", { className: "absolute w-full flex justify-between -bottom-[3px] px-4", children: list.map((_, i) => (jsx("div", { className: `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-4 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, onInput: ((e) => {
+                            const rawValue = parseDecimal(e.target?.value);
+                            const newValue = list.length ? list[rawValue] : rawValue;
+                            onChange && onChange(newValue || 0);
+                        }) }) })] }));
+    }
+
+    const DISABLED_INPUT_CLASSES = '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((e) => {
+            onChange && onChange(parseDecimal(e.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('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), disabled: disabled, onInput: 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-2", children: items.map((item, i) => (jsx(Text, { size: "text-s", font: "font-light", color: "text-secondary-text", children: item }, String(i)))) }));
+
+    const renderCreditParameters = (field) => (jsxs("div", { className: "mb-4 pb-1 border-b border-b-main-divider sm:flex sm:justify-between sm:gap-5 sm:mb-7 sm:border-none sm:pb-0", children: [jsxs("div", { className: "mb-3 sm:mb-0 sm:w-1/2", children: [jsx("label", { children: jsx(Text, { size: "text-m", font: "font-light", children: "\u0421\u0443\u043C\u043C\u0430 \u043A\u0440\u0435\u0434\u0438\u0442\u0430, \u20BD" }) }), jsx(InputRange, { items: ITEMS_CREDIT_AMOUNT, min: MIN_CREDIT_AMOUNT, max: MAX_CREDIT_AMOUNT, ...field('amount') })] }), jsxs("div", { className: "sm:w-1/2", children: [jsx("label", { children: jsx(Text, { size: "text-m", font: "font-light", children: "\u0421\u0440\u043E\u043A \u043A\u0440\u0435\u0434\u0438\u0442\u0430, \u043C\u0435\u0441\u044F\u0446\u0435\u0432" }) }), jsx(InputRange, { items: ITEMS_CREDIT_TERM, min: MIN_CREDIT_TERM, max: MAX_CREDIT_TERM, ...field('term') })] })] }));
+
+    const renderRegionDepartment = ({ regions, branches, field }) => (jsxs("div", { className: "mb-4  sm:flex sm:justify-between sm:gap-5 sm:mb-7 sm:border-none sm:pb-0", children: [jsx("div", { className: "mb-3 sm:mb-0 sm:w-1/2", children: 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.map(({ code = '', name = '' }) => ({ key: code, text: name })), ...withValidator(field('region'), defaultValidator) }) }), jsx("div", { className: "mb-3 sm:mb-0 sm:w-1/2", children: jsx(SelectControl, { label: "\u0410\u0434\u0440\u0435\u0441", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0430\u0434\u0440\u0435\u0441", options: branches.map(({ branchCode = '', address = '' }) => ({
+                        key: branchCode,
+                        text: address,
+                    })), ...withValidator(field('department'), defaultValidator) }) })] }));
+
+    const initialFormState$2 = {
+        amount: MIN_CREDIT_AMOUNT,
+        term: 12,
+        fullName: '',
+        inn: '',
+        name: '',
+        phone: '',
+        mail: '',
+        annualRevenue: '',
+    };
+    const creditValidator = objectValidator({
+        annualRevenue: defaultValidator,
+        inn: innValidator,
+        name: nameValidator,
+        phone: phoneValidator,
+        region: defaultValidator,
+        department: defaultValidator,
+    });
+    const ApplicationFormCredit = JSX(({ button, link, onSubmit }) => {
+        const handleSubmit = useCallback((formState) => {
+            const { amount, term, fullName, inn, name, phone, mail, region, department, annualRevenue } = formState;
+            isValidationSuccess(creditValidator(formState)) &&
+                onSubmit({
+                    typeForm: 'cred',
+                    fullName,
+                    inn,
+                    name,
+                    phone,
+                    mail,
+                    region: region?.text || '',
+                    department: department?.text || '',
+                    partnerComments: `Сумма=${amount}/Срок=${term}/Выручка=${annualRevenue}`,
+                });
+        }, [onSubmit]);
+        const [formState, { field, ...formProps }] = useForm(initialFormState$2, handleSubmit);
+        const regions = useGetRegions();
+        const branches = useBranches(formState.region?.key).filter((branch) => branch?.address);
+        return (jsxs("form", { className: "container", onSubmit: formProps.onSubmit, children: [jsx(Heading, { headingType: "h6", title: "\u041F\u0430\u0440\u0430\u043C\u0435\u0442\u0440\u044B \u043A\u0440\u0435\u0434\u0438\u0442\u0430", className: "sm:text-center mb-4" }), renderCreditParameters(field), jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "sm:text-center mb-4" }), renderCreditDataOrganization(field), jsx(Heading, { headingType: "h6", title: "\u041E\u0444\u0438\u0441 \u0431\u0430\u043D\u043A\u0430", className: "sm:text-center mb-4" }), renderRegionDepartment({ regions, branches, field }), renderSubmitButton(button, 'mb-4'), jsx(Footnote, { link: link })] }));
+    });
+
+    const initialFormState$1 = {
+        name: '',
+        phone: '',
+    };
+    const depositValidator = objectValidator({
+        name: nameValidator,
+        phone: phoneValidator,
+    });
+    const ApplicationFormDeposit = JSX((props) => {
+        const { button, link, onSubmit } = props;
+        const handleSubmit = useCallback((formState) => {
+            const { name, phone } = formState;
+            isValidationSuccess(depositValidator(formState)) &&
+                onSubmit({
+                    typeForm: 'dpst',
+                    name,
+                    phone,
+                });
+        }, [onSubmit]);
+        const [, { field, ...formProps }] = useForm(initialFormState$1, handleSubmit);
+        return (jsxs("form", { className: "container", onSubmit: formProps.onSubmit, 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: "sm:text-center mb-4" }), jsxs("div", { className: "max-w-[560px] m-auto", children: [jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u0418\u043C\u044F", ...withValidator(field('name'), nameValidator) }), jsx(PhoneInputControl, { className: "shrink-0 w-full mb-3", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) })] }), jsxs("div", { className: "flex justify-between flex-col-reverse sm:items-center sm:flex-row max-w-[560px] m-auto", children: [jsx("div", { className: "flex-1 mt-4 sm:mt-0", children: jsx(Footnote, { link: link }) }), renderSubmitButton(button)] })] }));
+    });
+
+    const sourcesComparator = (a, b) => a?.media && b?.media ? a.media - b.media : 0;
+    const ImgAsPicture = JSX(({ className = '', image, imageClassName = '', pathPrefix }) => {
+        const router = useRouter();
+        return (jsxs("picture", { className: className, children: [image?.sources?.length
+                    ? image.sources
+                        .filter((_) => _?.src)
+                        .sort(sourcesComparator)
+                        .map(({ src, format, media }, index) => (jsx("source", { srcSet: adjustSrc(router, pathPrefix)(src), type: formatToMimeType(format), media: media ? `(max-width: ${media}px)` : '', ...image.size }, `${index}_${src}`)))
+                    : null, image?.src
+                    ? renderImg({ ...image, src: adjustSrc(router, pathPrefix)(image.src) }, imageClassName)
+                    : null] }));
+    });
+    const renderImg = (image, imageClassName = '') => (jsx("img", { src: image.src, className: style('object-contain', imageClassName), alt: image.alt || image.title, title: image.title || '', style: {
+            width: image.size?.width ? `${image.size?.width}px` : '100%',
+            height: image.size?.height ? `${image.size?.height}px` : 'auto',
+        }, ...image.size }));
+    const adjustSrc = (router, pathPrefix) => (src) => src && !isURL(src) ? adjustHref(router)(joinPath(pathPrefix, src)) : src;
+    const formatToMimeType = (format) => format ? `image/${String(format)}` : undefined;
+
+    const Img = JSX(({ className = '', image, imageClassName = '', pathPrefix, ...iconProps }) => {
+        if (!image?.src && !image?.icon) {
+            return null;
+        }
+        return image.icon ? (jsx(Icon, { className: className, imageClassName: imageClassName, iconVersion: image?.iconVersion, name: image.icon, ...iconProps })) : (jsx(ImgAsPicture, { className: className, imageClassName: imageClassName, image: image, pathPrefix: pathPrefix }));
+    });
+
+    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(Img, { 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(Img, { 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, value, text, disabled, isRadio, onChange }) => {
+        const handleChange = useCallback((e) => {
+            if (disabled) {
+                return;
+            }
+            e.preventDefault();
+            onChange && onChange(!value);
+        }, [onChange, disabled, value]);
+        const icon = isRadio ? (jsx("div", { className: "absolute left-1 w-3 h-3 rounded-full bg-primary-main" })) : (jsx(SVG, { paths: CHECK_PATHS, className: "absolute left-1 ml-px block", width: "11", height: "9", fill: "white", viewBox: "0 0 11 9" }));
+        return (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer group/box", onClick: handleChange, children: [jsx("div", { className: style('appearance-none w-5 h-5 border-solid cursor-pointer m-0', isRadio ? 'rounded-full border-2' : checkboxStyle(value), value ? 'border-primary-main' : 'border-gray', disabled ? 'bg-main-disabled' : 'group-hover/box:border-primary-hover'), role: "checkbox", "aria-checked": Boolean(value), "aria-disabled": Boolean(disabled) }), value ? icon : null, text ? (jsx("div", { className: "ml-3", children: jsx(Text, { size: "text-l", font: "font-light", children: text }) })) : null] }) }));
+    });
+    const checkboxStyle = (value) => style('rounded border', value ? 'bg-primary-main' : '');
+
+    const renderQuestionsInterested = (field) => {
+        const textField = field('text');
+        return (jsxs("div", { className: "mb-3 sm:mb-6", children: [jsxs("div", { className: "mb-4 sm:flex sm:items-center sm:gap-6", children: [jsx(Checkbox, { className: "mb-3 sm:mb-0", text: "\u0412\u0430\u043B\u044E\u0442\u043D\u044B\u0439 \u043A\u043E\u043D\u0442\u0440\u043E\u043B\u044C", ...field('currencyControl') }), jsx(Checkbox, { className: "mb-3 sm:mb-0", text: "\u0414\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0430\u0440\u043D\u044B\u0435 \u043E\u043F\u0435\u0440\u0430\u0446\u0438\u0438", ...field('documentaryOperations') }), jsx(Checkbox, { className: "mb-3 sm:mb-0", text: "\u041A\u043E\u043D\u0432\u0435\u0440\u0441\u0438\u043E\u043D\u043D\u044B\u0435 \u043E\u043F\u0435\u0440\u0430\u0446\u0438\u0438", ...field('conversionOperations') })] }), jsx("textarea", { 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, \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:focus:border-primary-text", value: textField.value, onInput: ((e) => textField.onChange && textField.onChange(e.target?.value || '')) })] }));
+    };
+
+    const renderWedDataOrganization = (field) => (jsxs("div", { children: [jsxs("div", { className: "sm:flex sm:justify-between sm:gap-5", children: [jsx("div", { className: "sm:w-1/2", children: jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u041D\u0430\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0438\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", ...withValidator(field('fullName'), defaultValidator) }) }), jsx("div", { className: "sm:w-1/2", children: jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u0424\u0418\u041E", ...withValidator(field('name'), nameValidator) }) })] }), jsxs("div", { className: "sm:flex sm:justify-between sm:gap-5 sm:mb-7", children: [jsx("div", { className: "sm:w-1/2", children: jsx(PhoneInputControl, { className: "shrink-0 w-full mb-3", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) }) }), jsx("div", { className: "sm:w-1/2", children: jsx(InputControl, { className: "shrink-0 w-full mb-3", label: "\u042D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430\u044F \u043F\u043E\u0447\u0442\u0430", ...withValidator(field('mail'), defaultValidator) }) })] })] }));
+
+    const initialFormState = {
+        fullName: '',
+        name: '',
+        phone: '',
+        mail: '',
+        currencyControl: false,
+        documentaryOperations: false,
+        conversionOperations: false,
+        text: '',
+    };
+    const webValidator = objectValidator({
+        fullName: defaultValidator,
+        name: nameValidator,
+        phone: phoneValidator,
+        mail: defaultValidator,
+    });
+    const ApplicationFormWed = JSX((props) => {
+        const { button, link, onSubmit } = props;
+        const handleSubmit = useCallback((formState) => {
+            const { fullName, name, phone, mail, currencyControl, documentaryOperations, conversionOperations, text, } = formState;
+            isValidationSuccess(webValidator(formState)) &&
+                onSubmit({
+                    typeForm: 'kved',
+                    fullName,
+                    name,
+                    phone,
+                    mail,
+                    partnerComments: `Валютный контроль=${currencyControl}/Документарные операции=${documentaryOperations}/Конверсионные операции=${conversionOperations}/Доп инф=${text}`,
+                });
+        }, [onSubmit]);
+        const [, { field, ...formProps }] = useForm(initialFormState, handleSubmit);
+        return (jsxs("form", { className: "container", onSubmit: formProps.onSubmit, children: [jsx(Heading, { headingType: "h6", title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043E\u0440\u0433\u0430\u043D\u0438\u0437\u0430\u0446\u0438\u0438", className: "sm:text-center mb-4" }), renderWedDataOrganization(field), jsx(Heading, { headingType: "h6", title: "\u0418\u043D\u0442\u0435\u0440\u0435\u0441\u0443\u044E\u0449\u0438\u0439 \u0432\u043E\u043F\u0440\u043E\u0441", className: "sm:text-center mb-4" }), renderQuestionsInterested(field), jsxs("div", { className: "flex flex-col border-b border-main-divider mb-5 pb-5 sm:items-center sm:flex-row sm:mb-9 sm:pb-9", children: [renderSubmitButton(button, 'mb-4 sm:mr-5 sm:mb-0'), 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: "sm:text-center mb-4" }), renderContacts()] }));
+    });
+
+    const ResponseNotification = JSX(({ responseType }) => {
+        const responseOK = responseType === 'OK';
+        const backgroundColor = responseOK ? 'bg-ok' : 'bg-fail';
+        return (jsxs("div", { className: `flex items-center mt-5 p-5 rounded-md ${backgroundColor}`, children: [responseOK ? (jsx(Img, { image: { icon: 'ResponceOKIcon' }, width: "42", height: "42", className: "mr-4" })) : (jsx(Img, { image: { icon: 'ResponceFailIcon' }, width: "37", height: "34", className: "mr-4" })), jsxs("div", { children: [jsx(Heading, { headingType: "h6", title: responseOK ? 'Ваша заявка отправлена' : 'Не удалось отправить заявку', className: "mb-1" }), jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: responseOK ? 'Совсем скоро мы с вами свяжемся' : 'Пожалуйста, повторите позднее' })] })] }));
     });
 
-    const mobileHeadingTagMap = {
-        h1: 'h1',
-        h2: 'h1',
-        h3: 'h2',
-        h4: 'h2',
-        h5: 'h3',
-        h6: 'h3',
-    };
-    const headingTag = (tag) => mobileHeadingTagMap[tag] || 'h3';
+    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 API = CorporateLeadAPI();
+    const ApplicationForm = JSX((props) => {
+        const { className, title, typeForm = 'credit', button, link, ...rest } = props;
+        const [responseType, setResponseType] = useState('');
+        const handleSubmit = useCallback(async (data) => {
+            const status = (await API.send(data)) ? 'OK' : 'Fail';
+            setResponseType(status);
+            return status;
+        }, []);
+        return (jsx(BlockWrapper, { className: className, defaultPadding: "p-default", ...rest, children: jsxs("div", { className: "container max-w-[978px]", children: [title ? (jsx(Heading, { headingType: "h3", title: title, className: "mb-4 sm:mb-8 sm:text-center" })) : null, COMPONENTS_MAP[typeForm]({ button, link, onSubmit: handleSubmit }), responseType ? jsx(ResponseNotification, { responseType: responseType }) : null] }) }));
+    });
 
-    const styles = {
-        h0: 'text-h0',
-        h1: 'text-h1',
-        h2: 'text-h2',
-        h3: 'text-h3',
-        h4: 'text-h4',
-        h5: 'text-h5',
-        h6: 'text-h6', // 20
-    };
-    const Heading = JSX(({ className = '', headingType = 'h3', as = 'h3', title, children }) => {
-        const Tag = headingTag(as);
-        return (jsx(Tag, { className: style('font-sans m-0', styles[headingType], className), children: title || children }));
+    const iconBgStyles = {
+        '': 'bg-main-divider group-data-secondary:bg-white/30',
+        primary: 'bg-main-divider',
+        secondary: 'bg-secondary-light',
+        opacity: 'bg-white/30',
+    };
+    const RoundedIcon = JSX(({ className, defaultIconSize = 44, iconBgVersion = 'primary', size, icon, ...rest }) => {
+        const widthAndHeight = String(size?.width || defaultIconSize);
+        return icon ? (jsx("div", { style: {
+                width: `${widthAndHeight}px`,
+                height: `${widthAndHeight}px`,
+            }, className: style('rounded-icon object-fit flex justify-center items-center ', iconBgStyles[iconBgVersion], className), children: jsx(Icon, { ...rest, width: "54%", height: "54%", name: icon }) })) : null;
     });
 
-    const Paragraph = JSX(({ children, ...styleProps }) => (jsx("p", { className: style('font-sans', Object.values(styleProps)), children: children })));
+    const defaultIconSize = 56;
+
+    const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => (jsxs(BlockWrapper, { className: className, defaultPadding: "p-default", ...rest, children: [title ? jsx(Heading, { headingType: "h3", as: "h2", className: "text-center", title: title }) : null, benefitList?.length ? (jsx("div", { className: "flex flex-wrap w-full sm:justify-center mt-m gap-xl", role: "list", children: benefitList.map(renderBenefit) })) : null] })));
+    const renderBenefit = (benefit, i) => (jsxs("div", { className: "flex gap-s items-center md:basis-1/2 md:max-w-[400px]", role: "listitem", children: [benefit?.icon?.icon ? (jsx(RoundedIcon, { className: "shrink-0", defaultIconSize: defaultIconSize, iconBgVersion: benefit?.iconBgVersion || '', ...benefit?.icon })) : null, benefit?.icon?.src ? jsx(Img, { className: "shrink-0", image: benefit.icon }) : null, benefit?.label ? (jsxs("div", { className: "sm:h-full", children: [jsx(Heading, { headingType: "h6", children: benefit.label }), renderDescription$3(benefit.description)] })) : null] }, String(i)));
+    const renderDescription$3 = (description) => {
+        const benefitType = description?.benefitType || null;
+        return description && benefitType ? (jsx("div", { className: "mt-2 text-l font-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 headlineVersionStyles = {
         XXL: {
@@ -548,257 +1398,50 @@
                 scrollBy(containerRef.current)(itemCount, 1);
             }
         }, [itemCount, isCyclic, canScrollRight]);
-        return [
-            containerRef,
-            {
-                scrollLeft,
-                scrollRight,
-                canScrollLeft: isCyclic || canScrollLeft,
-                canScrollRight: isCyclic || canScrollRight,
-                visibleIndicesRange: [minIndex, maxIndex],
-                handleVisibleIndicesChange,
-            },
-        ];
-    };
-
-    const DEFAULT_GAP = 14;
-    /*
-      Horizontal padding used on a container above SwipeListControl.
-      Same value used on a SwipeListControlChildren container to compensate it
-      and get rid of a clipping effect caused by overflow: hidden.
-     */
-    const DEFAULT_PADDING = 16;
-    const SwipeListControl = JSX(({ className, version, gap = DEFAULT_GAP, padding = DEFAULT_PADDING, showDots = true, minHeight, children, onVisibleIndicesChange, listType = 'horizontal-list', }) => {
-        const itemCount = Array.isArray(children) ? children.length : 0;
-        const [containerRef, scroll] = useSwipeListScroll({
-            itemCount,
-            onVisibleIndicesChange,
-        });
-        const [activeIndex] = scroll.visibleIndicesRange;
-        return (jsxs("div", { className: style(className, listType === 'vertical-list' ? 'relative h-full' : ''), children: [jsx(SwipeListContainer, { containerRef: containerRef, activeIndex: activeIndex, visibleItemCount: 1, gap: gap, padding: padding, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, listType: listType, minHeight: minHeight, children: children }), showDots ? (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: activeIndex, dotCount: itemCount, listType: listType, version: version })) : null] }));
-    });
-
-    function useRouter() {
-        return useRouter._impl();
-    }
-    useRouter._impl = () => ({
-        href: globalThis.location?.href || '/',
-        pathname: globalThis.location?.pathname || '/',
-        query: {},
-        push: () => {
-            // Do nothing
-        },
-        replace: () => {
-            // Do nothing
-        },
-        back: () => {
-            // Do nothing
-        },
-    });
-    useRouter.setup = (impl) => {
-        useRouter._impl = impl;
-    };
-
-    const dirname = (path) => path?.split('/').slice(0, -1).join('/');
-
-    const isURL = (href) => Boolean(href?.includes(':'));
-    const isLocalURL = (href, target) => Boolean(href && !isURL(href) && (!target || target === '_self'));
-    const isHash = (href) => Boolean(href?.startsWith('#'));
-    const withoutQuery = (href) => (href || '').replace(/\?.*/, '').replace(/\/$/, '');
-    const joinPath = (...path) => path.filter(Boolean).join('/').replace(/\/+/g, '/');
-
-    var url = /*#__PURE__*/Object.freeze({
-        __proto__: null,
-        isURL: isURL,
-        isLocalURL: isLocalURL,
-        isHash: isHash,
-        withoutQuery: withoutQuery,
-        joinPath: joinPath
-    });
-
-    const adjustHref = (router) => (href, basePath = projectSettings.BASE_PATH) => {
-        if (!href || isURL(href) || hasPrefix(href, projectSettings.CDN)) {
-            return href;
-        }
-        const isRelativeToBase = href.startsWith('/');
-        return joinPath(hasPrefix(href, basePath) ? '' : basePath, isRelativeToBase ? '/' : dirname(router.pathname), href);
-    };
-    const hasPrefix = (href, prefix) => prefix && href && href.startsWith(prefix);
-
-    const svgUseStyleMap = {
-        normal: '',
-        color: 'text-primary-main',
-        black: 'text-black',
-        white: 'text-black',
-    };
-    const Icon = JSX(({ className = '', imageClassName = '', name = '', alt = `Иконка ${name}`, title = alt, iconVersion = 'color', ...imgProps }) => {
-        const router = useRouter();
-        const href = adjustHref(router)(joinPath(projectSettings.CDN, '/icons', `${name}.svg`));
-        if (iconVersion !== 'normal') {
-            return (jsx(Background, { className: className, children: jsxs("svg", { className: style(getSvgSize(imgProps.width), svgUseStyleMap[iconVersion], iconVersion === 'white' ? 'invert' : '', imageClassName), ...imgProps, "aria-hidden": "true", children: [title ? jsx("title", { children: title }) : null, alt ? jsx("desc", { children: alt }) : null, jsx("use", { href: `${href}#icon`, xlinkHref: `${href}#icon` })] }) }));
-        }
-        if (!className.includes('h-')) {
-            imgProps['style'] = { height: `${imgProps.height}px` };
-        }
-        return (jsx("img", { className: className, src: href, alt: alt, title: title, "aria-hidden": "true", ...imgProps }));
-    });
-    const getSvgSize = (width) => (width ? '' : 'w-full h-full');
-    const Background = JSX(({ className, children }) => className ? jsx("div", { className: className, children: children }) : children);
-
-    const sourcesComparator = (a, b) => a?.media && b?.media ? a.media - b.media : 0;
-    const ImgAsPicture = JSX(({ className = '', image, imageClassName = '', pathPrefix }) => {
-        const router = useRouter();
-        return (jsxs("picture", { className: className, children: [image?.sources?.length
-                    ? image.sources
-                        .filter((_) => _?.src)
-                        .sort(sourcesComparator)
-                        .map(({ src, format, media }, index) => (jsx("source", { srcSet: adjustSrc(router, pathPrefix)(src), type: formatToMimeType(format), media: media ? `(max-width: ${media}px)` : '', ...image.size }, `${index}_${src}`)))
-                    : null, image?.src
-                    ? renderImg({ ...image, src: adjustSrc(router, pathPrefix)(image.src) }, imageClassName)
-                    : null] }));
-    });
-    const renderImg = (image, imageClassName = '') => (jsx("img", { src: image.src, className: style('object-contain', imageClassName), alt: image.alt || image.title, title: image.title || '', style: {
-            width: image.size?.width ? `${image.size?.width}px` : '100%',
-            height: image.size?.height ? `${image.size?.height}px` : 'auto',
-        }, ...image.size }));
-    const adjustSrc = (router, pathPrefix) => (src) => src && !isURL(src) ? adjustHref(router)(joinPath(pathPrefix, src)) : src;
-    const formatToMimeType = (format) => format ? `image/${String(format)}` : undefined;
-
-    const Img = JSX(({ className = '', image, imageClassName = '', pathPrefix, ...iconProps }) => {
-        if (!image?.src && !image?.icon) {
-            return null;
-        }
-        return image.icon ? (jsx(Icon, { className: className, imageClassName: imageClassName, iconVersion: image?.iconVersion, name: image.icon, ...iconProps })) : (jsx(ImgAsPicture, { className: className, imageClassName: imageClassName, image: image, pathPrefix: pathPrefix }));
-    });
-
-    const Text = JSX(({ children, ...styleProps }) => (jsx("span", { className: style('font-sans', Object.values(styleProps)), children: children })));
-
-    const bonusBenefitAlign = 'text-left';
-
-    const bonusBenefitStyles = 'justify-between p-4 h-full border border-gray';
-
-    const renderBonusBenefit = ({ icon, title, description }, i) => (jsxs("div", { className: style('flex flex-col', bonusBenefitStyles, !description && !title ? 'justify-center' : ''), children: [title ? (jsx(Text, { size: "text-h6", font: "font-normal", align: bonusBenefitAlign, children: title })) : null, icon ? jsx(Img, { image: icon, height: "180", className: "w-auto" }) : null, description ? (jsx(Text, { size: "text-h6", font: "font-normal", align: bonusBenefitAlign, children: description })) : null] }, String(i)));
-
-    const renderBonusBenefits = (bonusBenefits, columnsCount, cardTextAlign) => (jsx(SwipeListControl, { children: bonusBenefits.map((_, i) => renderBonusBenefit({ ..._ }, i)) }));
-
-    const BonusBenefitsBlock = JSX(({ bonusBenefits, cardTextAlign = 'center', className = '', columnsCount = '4', subtitle, title, ...rest }) => (jsxs(BlockWrapper, { className: style('p-default', className), defaultPadding: "p-default", ...rest, children: [jsx(Headline, { className: "mb-4 sm:mb-8", isPadding: false, title: title, description: subtitle, headlineVersion: "M" }), bonusBenefits?.length
-                ? renderBonusBenefits(bonusBenefits)
-                : null] })));
-
-    const useDialog = (id = '') => ({
-        open: (message) => defaultEventBus.fire('dialog', { type: 'open', id, message }),
-        close: () => defaultEventBus.fire('dialog', { type: 'close' }),
-    });
-
-    /* eslint-disable @typescript-eslint/ban-types */
-    const handlerDecorator = (handler, targetContent) => {
-        return handlerDecorator._impl(handler, targetContent);
-    };
-    handlerDecorator._impl = (handler) => handler;
-    handlerDecorator.setup = (impl) => {
-        handlerDecorator._impl = impl;
-    };
-
-    function useLink(params = {}) {
-        const { isRemote, basePath } = params;
-        const router = useRouter();
-        const { close } = useDialog();
-        return (props) => ({
-            ...props,
-            href: isRemote && !basePath ? props.href : adjustHref(router)(props.href, basePath),
-            'aria-label': props.text,
-            onClick: handlerDecorator(handleHref(props), props),
-        });
-        function handleHref({ href, target, onClick }) {
-            return (ev) => {
-                onClick && onClick(ev);
-                if (!href || isRemote || !isLocalURL(href, target)) {
-                    // Default routing
-                    return;
-                }
-                close();
-                // Client routing
-                ev?.preventDefault();
-                router.push(href);
-            };
-        }
-    }
-
-    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',
-        white: 'text-primary-main bg-white hover:text-white hover:bg-primary-hover active:bg-white active:text-primary-main',
-        link: '',
-        transparent: '',
-        gray: 'text-primary-main bg-main-divider hover:text-white hover:bg-primary-hover active:bg-primary-active',
-        '': '',
-    };
-    const DisabledStyle = 'bg-main-divider text-main-disabled';
-    const buttonDisabledStyleMap = {
-        primary: DisabledStyle,
-        secondary: DisabledStyle,
-        white: DisabledStyle,
-        link: '',
-        transparent: '',
-        gray: DisabledStyle,
-        '': '',
-    };
-    const buttonStyle = 'text-center font-sans select-none';
-    const iconStyleMap = {
-        primary: 'group-hover/btn:brightness-0 group-hover/btn:invert',
-        secondary: 'group-hover/btn:brightness-0 group-hover/btn:invert',
-        white: 'group-hover/btn:brightness-0 group-hover/btn:invert',
-        link: '',
-        transparent: '',
-        gray: 'group-hover/btn:brightness-0 group-hover/btn:invert',
-        '': '',
+        return [
+            containerRef,
+            {
+                scrollLeft,
+                scrollRight,
+                canScrollLeft: isCyclic || canScrollLeft,
+                canScrollRight: isCyclic || canScrollRight,
+                visibleIndicesRange: [minIndex, maxIndex],
+                handleVisibleIndicesChange,
+            },
+        ];
     };
 
-    const ButtonInner = JSX((props) => {
-        const { text, aboveText, appendLeft, appendRight, version = 'primary' } = props;
-        return (jsxs("div", { className: style(getButtonStyle(props), 'flex gap-2'), children: [appendLeft ? jsx("div", { className: iconStyleMap[version], children: appendLeft }) : null, isWithText(props) ? (jsxs("div", { children: [aboveText ? jsx("div", { className: "text-xs font-light text-left", children: aboveText }) : null, jsx("div", { className: `text-left ${aboveText ? 'text-s -mt-0.5' : 'text-l'}`, children: text })] })) : null, appendRight ? jsx("div", { className: iconStyleMap[version], children: appendRight }) : null] }));
+    const DEFAULT_GAP = 14;
+    /*
+      Horizontal padding used on a container above SwipeListControl.
+      Same value used on a SwipeListControlChildren container to compensate it
+      and get rid of a clipping effect caused by overflow: hidden.
+     */
+    const DEFAULT_PADDING = 16;
+    const SwipeListControl = JSX(({ className, version, gap = DEFAULT_GAP, padding = DEFAULT_PADDING, showDots = true, minHeight, children, onVisibleIndicesChange, listType = 'horizontal-list', }) => {
+        const itemCount = Array.isArray(children) ? children.length : 0;
+        const [containerRef, scroll] = useSwipeListScroll({
+            itemCount,
+            onVisibleIndicesChange,
+        });
+        const [activeIndex] = scroll.visibleIndicesRange;
+        return (jsxs("div", { className: style(className, listType === 'vertical-list' ? 'relative h-full' : ''), children: [jsx(SwipeListContainer, { containerRef: containerRef, activeIndex: activeIndex, visibleItemCount: 1, gap: gap, padding: padding, onVisibleIndicesChange: scroll.handleVisibleIndicesChange, listType: listType, minHeight: minHeight, children: children }), showDots ? (jsx(SwipeListControlDots, { containerRef: containerRef, activeIndex: activeIndex, dotCount: itemCount, listType: listType, version: version })) : null] }));
     });
-    const getButtonStyle = (props) => {
-        const { version, aboveText, rounded } = props;
-        if (version === 'link') {
-            return '';
-        }
-        const withTextStyle = `${aboveText ? 'py-2.5 px-9' : 'py-4 px-9'}`;
-        return [
-            'group/btn items-center justify-center',
-            isWithText(props) ? withTextStyle : 'h-12 w-12',
-            rounded ? 'rounded-full' : '',
-        ].join(' ');
-    };
-    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 bonusBenefitAlign = 'text-left';
 
-    const getRegularButtonClasses = ({ className, rounded, version, }) => [
-        buttonStyle,
-        'border border-transparent inline-block cursor-pointer no-underline focus:border-primary-text focus:border h-fit',
-        version ? buttonStyleMap[version] : '',
-        rounded ? 'rounded-full' : 'rounded-md',
-        className,
-    ].join(' ');
+    const bonusBenefitStyles = 'justify-between p-4 h-full border border-gray';
 
-    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 renderBonusBenefit = ({ icon, title, description }, i) => (jsxs("div", { className: style('flex flex-col', bonusBenefitStyles, !description && !title ? 'justify-center' : ''), children: [title ? (jsx(Text, { size: "text-h6", font: "font-normal", align: bonusBenefitAlign, children: title })) : null, icon ? jsx(Img, { image: icon, height: "180", className: "w-auto" }) : null, description ? (jsx(Text, { size: "text-h6", font: "font-normal", align: bonusBenefitAlign, children: description })) : null] }, String(i)));
+
+    const renderBonusBenefits = (bonusBenefits, _columnsCount, _cardTextAlign) => (jsx(SwipeListControl, { children: bonusBenefits.map((_, i) => renderBonusBenefit({ ..._ }, i)) }));
+
+    const BonusBenefitsBlock = JSX(({ bonusBenefits, cardTextAlign = 'center', className = '', columnsCount = '4', subtitle, title, ...rest }) => (jsxs(BlockWrapper, { className: style('p-default', className), defaultPadding: "p-default", ...rest, children: [jsx(Headline, { className: "mb-4 sm:mb-8", isPadding: false, title: title, description: subtitle, headlineVersion: "M" }), bonusBenefits?.length
+                ? renderBonusBenefits(bonusBenefits)
+                : null] })));
 
-    const renderButtonsSection = (buttons, { className, buttonClassName, isVertical } = {}) => buttons?.length && buttons.some((_) => _?.text || _?.icon?.icon) ? (jsx("div", { className: style('flex', isVertical ? 'flex-col gap-xs justify-items-stretch' : 'flex-wrap gap-s', className), children: buttons.map(renderButton(buttonClassName)) })) : null;
-    const renderButton = (buttonClassName = '') => (button, index) => {
+    const renderButtonsSection = (buttons, { className, buttonClassName, isVertical } = {}) => buttons?.length && buttons.some((_) => _?.text || _?.icon?.icon) ? (jsx("div", { className: style('flex', isVertical ? 'flex-col gap-xs justify-items-stretch' : 'flex-wrap gap-s', className), children: buttons.map(renderButton$1(buttonClassName)) })) : null;
+    const renderButton$1 = (buttonClassName = '') => (button, index) => {
         const { text, icon, iconRight, version, ...rest } = button || {};
         const iconVersionDefault = version === 'secondary' ? 'color' : 'white';
         const iconVersion = icon?.iconVersion ? icon?.iconVersion : iconVersionDefault;
@@ -809,86 +1452,6 @@
 
     const ButtonsBlock = JSX(({ buttons, className, ...rest }) => (jsx(BlockWrapper, { className: style('!bg-transparent', className), defaultPadding: "p-0", ...rest, children: renderButtonsSection(buttons) })));
 
-    const identity = (_) => _;
-
-    const useForm = (initialState, onSubmit) => {
-        const [formState, setFormState] = useState(initialState);
-        const [isDirtyForm, setDirtyForm] = useState(false);
-        const [dirtyFieldsMap, setDirtyFieldsMap] = useState({});
-        const handlersMap = useRef({});
-        const field = useCallback((fieldName, options) => {
-            const { parse = identity, format = identity } = options || {};
-            if (!handlersMap.current) {
-                handlersMap.current = {};
-            }
-            handlersMap.current[fieldName] ||= (value) => {
-                setFormState((prev) => ({ ...prev, [fieldName]: parse(value) }));
-                setDirtyFieldsMap((prev) => ({ ...prev, [fieldName]: true }));
-            };
-            return {
-                value: format(formState[fieldName]),
-                isDirty: isDirtyForm || dirtyFieldsMap[fieldName],
-                onChange: handlersMap.current[fieldName],
-            };
-        }, [formState, isDirtyForm, dirtyFieldsMap]);
-        const reset = useCallback(() => {
-            setFormState(initialState);
-            setDirtyForm(false);
-            setDirtyFieldsMap({});
-        }, [initialState]);
-        const handleSubmit = useCallback((e) => {
-            e.preventDefault();
-            setDirtyForm(true);
-            onSubmit && onSubmit(formState);
-        }, [onSubmit, formState]);
-        return [
-            formState,
-            {
-                isDirty: isDirtyForm || Object.values(dirtyFieldsMap).some(Boolean),
-                field,
-                reset,
-                onSubmit: handleSubmit,
-            },
-        ];
-    };
-
-    const useNormalizedInput = (props, { normalize, format }) => {
-        const { value, onFocus, onBlur, onChange } = props;
-        const [isFocused, setIsFocused] = useState(false);
-        const handleFocus = useCallback((e) => {
-            setIsFocused(true);
-            onFocus && onFocus(e);
-        }, []);
-        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));
-
-    const toLocalNumberFormat = (fractionDigits = 0) => (_ = 0) => new Intl.NumberFormat('ru-RU', {
-        minimumFractionDigits: 0,
-        maximumFractionDigits: fractionDigits,
-    }).format(Number(_) || 0);
-
-    const Input = JSX(({ key, className = '', inputClassName = '', id, name, type = 'text', label, placeholder, value = '', valid = true, children, onChange, onFocus, onBlur, pattern, }) => {
-        const handleChange = useCallback((e) => {
-            onChange && onChange(e.target?.value || '');
-        }, [onChange]);
-        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: style('relative', className), children: [jsxs("label", { children: [label ? (jsx("div", { className: "mb-2", children: jsx(Text, { size: "text-m", font: "font-light", children: label }) })) : null, jsx("input", { className: style('w-full border rounded-md text-primary-text outline-none p-4', paddingStyle, validStyle, inputClassName), id: id, name: name || id, placeholder: placeholder, type: type, value: value, onInput: handleChange, onFocus: onFocus, onBlur: onBlur, pattern: pattern }, key)] }), children] }));
-    });
-
     const NumberInput = JSX((props) => {
         const { onChange, min, max, defaultValue = '0', fractionDigits = 0, ...inputProps } = props;
         const normalizedProps = useNormalizedInput(props, {
@@ -1137,9 +1700,12 @@
             label: 'Youtube',
         },
     ];
+
+    const findIconByHref = (href) => ICONS_MAP.find(({ origins }) => origins?.some((_) => href?.includes(_))) || {};
+
     const MediaButton = JSX(({ buttonSize = 'default', rounded = false, icon, ...rest }) => {
         const { href, version, text = '' } = rest;
-        const { iconMapped, label } = ICONS_MAP.find(({ origins }) => origins.some((_) => href?.includes(_))) || {};
+        const { iconMapped, label } = findIconByHref(href);
         const iconCustom = getFilteredIcon(icon) ?? iconMapped;
         return (jsx(Button, { className: style(rounded ? 'rounded-full' : 'rounded-md', 'border border-solid hover:border-transparent', 'group-data-primary:border-main-divider', 'hover:bg-primary-main hover:text-black', 'group-data-secondary:bg-white border-main-divider group-data-secondary:hover:bg-secondary-hover', 'group-data-gray:border-green', buttonStylesWithText(text, buttonSize)), "aria-label": label, rel: "noopener noreferrer", target: "_blank", text: text, version: version, ...rest, children: iconCustom && !text ? (jsx(Img, { image: iconCustom, imageClassName: "group-hover/media:text-white", width: "24", height: "24" })) : null }));
     });
@@ -1178,19 +1744,17 @@
 
     const getPaddingStyle = (isHighlighting = false) => isHighlighting ? 'p-default mt-6' : 'mt-6 p-default'; // Хак для мобильной версии т.к. контракт должен быть идентичный
 
-    const descriptionSize = 'text-l';
-
     const renderCardInfo = (cell, i) => {
         const { title, description, buttons } = cell;
-        return (jsxs("div", { className: "py-5 border-b border-main-divider", children: [title ? (jsx("div", { className: "opacity-80", children: jsx(Text, { size: "text-m", color: "text-secondary-text", children: title }) })) : null, description ? (jsx("div", { className: "mt-1", children: jsx(Text, { size: descriptionSize, color: "text-primary-text", children: description }) })) : null, buttons?.length ? (jsx("div", { className: "text-primary-main", children: renderButtonsSection(buttons) })) : null] }, String(i)));
+        return (jsxs("div", { className: "py-5 border-b border-main-divider", children: [title ? (jsx("div", { className: "opacity-80", children: jsx(Text, { size: "text-m", color: "text-secondary-text", children: title }) })) : null, description ? (jsx("div", { className: "mt-1", children: jsx(Text, { size: "text-xl", color: "text-primary-text", children: description }) })) : null, buttons?.length ? (jsx("div", { className: "text-primary-main", children: renderButtonsSection(buttons) })) : null] }, String(i)));
     };
 
     const VISIBLE_CELLS_COUNT = 1;
-    const CarouselTariffsCard = JSX(({ className = '', title, icon, isHighlighting = false, button, cardCells = [], ...rest }) => {
+    const CarouselTariffsCard = JSX(({ className = '', title, align = 'text-center', icon, isHighlighting = false, button, cardCells = [], ...rest }) => {
         const cellsNode = cardCells.map(renderCardInfo);
         const visibleCells = cellsNode.slice(0, VISIBLE_CELLS_COUNT);
         const hiddenCells = cellsNode.slice(VISIBLE_CELLS_COUNT);
-        return (jsxs(BlockWrapper, { className: style('relative border border-gray flex flex-col', className), defaultPadding: getPaddingStyle(isHighlighting), ...rest, children: [isHighlighting ? renderHitIcon() : null, renderIconBlock(icon), title ? jsx(Heading, { className: "text-center pt-2", headingType: "h5", title: title }) : null, button ? jsx(Button, { className: "w-full mt-4", ...button }) : null, cardCells.length ? (jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs("div", { children: [visibleCells, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenCells })] })), renderFoldButton: cardCells.length > 1 ? renderFoldButton$1 : null })) : null] }));
+        return (jsxs(BlockWrapper, { className: style('relative border border-gray flex flex-col', className), defaultPadding: getPaddingStyle(isHighlighting), ...rest, children: [isHighlighting ? renderHitIcon() : null, renderIconBlock(icon), title ? (jsx(Heading, { className: style('pt-xs', align), headingType: "h5", title: title })) : null, button ? jsx(Button, { className: "w-full mt-4", ...button }) : null, cardCells.length ? (jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs("div", { children: [visibleCells, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenCells })] })), renderFoldButton: cardCells.length > 1 ? renderFoldButton$1 : null })) : null] }));
     });
     const renderIconBlock = (icon) => (jsx("div", { className: "w-[267px] min-w-[267px] self-center", children: icon?.src || icon?.icon ? jsx(Img, { image: icon }) : null }));
     const renderFoldButton$1 = ({ isUnfolded, onToggle }) => (jsxs("button", { className: "w-full cursor-pointer text-primary-main pt-5 flex justify-between items-center", onClick: onToggle, children: [jsx("div", { children: isUnfolded ? 'Скрыть' : 'Подробнее о тарифе' }), jsx(Icon, { className: "text-primary-text", name: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', width: "16", height: "16" })] }));
@@ -1232,16 +1796,16 @@
     const renderColorOption = (color, i) => (jsx("div", { role: "figure", className: `w-6 h-6 ml-1 sm:ml-3 border border-solid border-main-divider rounded-full ${cardStyleMap[color]}` }, String(i)));
 
     const CarouselProductCard = JSX(({ additionalDescription, align = 'text-center', button = {}, className = '', description, headlineSmallVersion = 'H6', href, icon, isDotted = true, isFullWidth = true, items = [], target, title, version = 'primary', ...rest }) => {
-        return (jsxs(BlockWrapper, { className: style('h-full flex flex-col justify-between min-w-[260px]', 'box-border border-solid border border-gray', align, className), defaultPadding: "p-0", version: version, ...rest, children: [jsxs(LinkWrapper, { className: "p-s", href: href, target: target, children: [renderImage$2(icon), renderCardTitle(headlineSmallVersion, title), renderDescription$3(description, title), renderItems(items, isDotted, version), renderAdditionalDescription(additionalDescription)] }), renderButtonsSection([button], {
+        return (jsxs(BlockWrapper, { className: style('h-full flex flex-col justify-between min-w-[260px]', 'box-border border-solid border border-gray', align, className), defaultPadding: "p-0", version: version, ...rest, children: [jsxs(LinkWrapper, { className: "p-s", href: href, target: target, children: [renderImage$2(icon), renderCardTitle(headlineSmallVersion, title), renderDescription$2(description, title), renderItems(items, isDotted, version), renderAdditionalDescription(additionalDescription)] }), renderButtonsSection([button], {
                     className: style('p-s pt-0', isFullWidth ? '' : 'self-center min-w-[158px]'),
                     isVertical: isFullWidth,
                 })] }));
     });
     const renderImage$2 = (image) => (jsxs("div", { className: "flex justify-center", children: [image?.src ? jsx(Img, { className: "mb-5", image: image }) : null, image?.icon ? jsx(Img, { className: `w-8 h-8 min-w-8 mb-5`, image: image }) : null] }));
     const renderCardTitle = (headlineSmallVersion, title) => title ? (jsx("div", { children: jsx(Text, { size: HEADLINE_SMALL_VERSION[headlineSmallVersion], children: title }) })) : null;
-    const renderDescription$3 = (description, title) => description ? (jsx("div", { className: title ? 'mt-2' : '', children: jsx(Paragraph, { size: "text-l", children: description }) })) : null;
+    const renderDescription$2 = (description, title) => description ? (jsx("div", { className: title ? 'mt-2' : '', children: jsx(Paragraph, { size: "text-l", children: description }) })) : null;
     const renderAdditionalDescription = (additionalDescription) => additionalDescription ? (jsx("div", { className: "mt-auto", children: jsx(Text, { size: "text-m", font: "font-light", color: "text-secondary-text group-data-secondary:text-white/80", children: additionalDescription }) })) : null;
-    const renderItems = (items, isDotted, version = 'primary') => items?.length ? (jsx(List, { className: style('max-w-[308px] mt-2 text-s', version === 'primary' ? '!text-secondary-text' : ''), items: items.filter((item) => item?.text).map((item) => item.text), isDotted: isDotted })) : null;
+    const renderItems = (items, isDotted, version = 'primary') => items?.length ? (jsx(List, { className: style('max-w-[308px] mt-2', version === 'primary' ? '!text-secondary-text' : ''), items: items.filter((item) => item?.text).map((item) => item.text), isDotted: isDotted, listItemSize: "S" })) : null;
 
     const GRADIENT = 'bg-gradient-to-r from-main-gradient-start to-main-gradient-end';
     const DIVIDER_CLASSES = 'border-main-divider border border-t-0 border-x-0';
@@ -1283,80 +1847,6 @@
         return orientation === 'horizontal' ? (jsx(SwipeListControl, { onVisibleIndicesChange: handleSlideChange, children: tableColumns })) : (tableColumns);
     });
 
-    const isFilled = (_) => _ !== null && _ !== undefined;
-
-    const defaultCache = new Map();
-    const applyCache = (fetcher, cache = defaultCache) => (key) => {
-        const cachedData = cache.get(key);
-        if (isFilled(cachedData)) {
-            return cachedData;
-        }
-        const data = fetcher(key);
-        if (isFilled(data)) {
-            cache.set(key, Promise.resolve(data));
-        }
-        else {
-            cache.delete(key);
-        }
-        return data;
-    };
-
-    const isSimpleKey = (args) => Boolean(args && Array.isArray(args) && args.length === 1 && typeof args[0] === 'string');
-    function useAsyncData(key, fetcher, { fallback, cache } = {}) {
-        const args = useMemo(() => keyToArgs(key), [key]);
-        const [simpleKey] = isSimpleKey(args) ? args : [];
-        const [data, setData] = useState(undefined);
-        const [error, setError] = useState(undefined);
-        useEffect(() => {
-            const isEmptyKey = !args.some(isFilled);
-            if (isEmptyKey) {
-                return;
-            }
-            (async () => {
-                try {
-                    const newData = await (simpleKey
-                        ? applyCache(fetcher, cache)(simpleKey)
-                        : fetcher(...args));
-                    setData(newData);
-                    setError(undefined);
-                }
-                catch (err) {
-                    setData(undefined);
-                    setError(err);
-                }
-            })();
-        }, [fetcher, cache, args]);
-        const fallbackData = fallback && simpleKey && fallback[simpleKey];
-        return {
-            data: !data && fallbackData ? fallbackData : data,
-            error,
-            mutate: () => Promise.resolve(undefined),
-            isValidating: false
-        };
-    }
-    function keyToArgs(key) {
-        if (Array.isArray(key)) {
-            return key;
-        }
-        else if (key instanceof Function) {
-            return keyToArgs(key());
-        }
-        else {
-            return [key];
-        }
-    }
-
-    async function fetchJSONUnsafe(url, options) {
-        const response = await fetch(url, {
-            ...options,
-            headers: {
-                ...options?.headers,
-                'Content-Type': 'application/json',
-            },
-        });
-        return await response.json();
-    }
-
     const EMPTY_VALUE = {};
     function useSWRResource(filename, fallback = {}) {
         const { data } = useAsyncData(`/wcms-resources/${filename}.json`, fetchJSONUnsafe, {
@@ -1386,19 +1876,6 @@
 
     const getIconName = (isUnfolded) => isUnfolded ? 'ArrowUpSolidIcon' : 'ArrowDownSolidIcon';
 
-    const labelSize = 'text-l';
-
-    const iconBgStyles = {
-        primary: 'bg-main-divider',
-        secondary: 'bg-white/30',
-        'secondary-light': 'bg-secondary-light',
-    };
-    const RoundedIcon = JSX(({ iconBgVersion = 'primary', size, icon, ...rest }) => {
-        const width = String(size?.width || 24);
-        const height = String(size?.height || 24);
-        return icon ? (jsx("div", { className: style('rounded-icon p-2.5', iconBgStyles[iconBgVersion]), children: jsx(Icon, { ...rest, width: width, height: height, name: icon }) })) : null;
-    });
-
     const renderRoundedIcon = (icon, iconBgVersion) => (jsx(RoundedIcon, { ...icon, iconBgVersion: iconBgVersion }));
 
     const rollupIconVersion = 'normal';
@@ -1429,7 +1906,7 @@
         })) : (jsx(DefaultFoldButton, { label: label, icon: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', onClick: onToggle }));
     };
     const renderPrimaryFoldButton = ({ label, labelIconBgVersion, icon, onToggle, labelIcon, }) => {
-        return (jsxs("button", { className: style('border-none bg-transparent px-0 flex justify-between items-center w-full group/button', labelIcon?.icon ? 'py-2' : 'py-5'), onClick: onToggle, children: [jsxs("div", { className: "flex items-center group-hover/button:text-primary-main", children: [renderRoundedIcon(labelIcon, labelIconBgVersion), label ? (jsx(Text, { size: labelSize, font: "font-normal", children: label })) : null] }), icon ? jsx(Icon, { name: icon, iconVersion: rollupIconVersion, width: "24", height: "24" }) : null] }));
+        return (jsxs("button", { className: style('border-none bg-transparent px-0 flex justify-between items-center w-full group/button', labelIcon?.icon ? 'py-2' : 'py-5'), onClick: onToggle, children: [jsxs("div", { className: "flex items-center group-hover/button:text-primary-main gap-3", children: [renderRoundedIcon(labelIcon, labelIconBgVersion), label ? (jsx(Text, { size: "text-h6", font: "font-normal", children: label })) : null] }), icon ? jsx(Icon, { name: icon, iconVersion: rollupIconVersion, width: "24", height: "24" }) : null] }));
     };
 
     const Contacts = JSX(({ className = '', items, hasButton }) => (jsxs("div", { className: className, children: [items?.length ? items.map(renderContactsGroup) : null, hasButton ? (jsx(Button, { version: "primary", className: "mb-6 w-full", href: "https://www.rshb.ru/feedback/question/", target: "_blank", ariaLabel: "\u041E\u0431\u0440\u0430\u0442\u043D\u0430\u044F \u0441\u0432\u044F\u0437\u044C", text: "\u041E\u0431\u0440\u0430\u0442\u043D\u0430\u044F \u0441\u0432\u044F\u0437\u044C" })) : null] })));
@@ -1468,9 +1945,13 @@
     const Footer = JSX(({ className = '', ...rest }) => {
         const fallback = rest.options?.page?.fallback;
         const sitemap = useSWRResource(projectSettings.SITEMAP || 'sitemap', fallback);
-        const { relatedEnterprises, contacts, socialMedia, horizontalNavigationTitle } = useSWRResource(projectSettings.FOOTER || 'footer', fallback);
-        return (jsxs(BlockWrapper, { tag: "footer", className: className, defaultPadding: "px-4 py-6", ...rest, children: [jsx("div", { className: "mb-4 pb-5 border-b border-main-divider", children: sitemap.topItems?.map((item, i) => (jsx(RollupItem, { label: item?.text, labelIcon: item?.icon, children: jsx(LinkList, { items: item.items, className: "my-3" }) }, String(i)))) }), jsx(Contacts, { className: "overflow-hidden", items: contacts }), jsx(SocialMedia, { className: "mb-4", media: socialMedia }), jsx(Button, { className: "w-full mb-4", text: "Google Play", version: "secondary", href: "/", target: "_blank" }), jsx(HorizontalNavigation, { className: "pt-4 pb-7 border-y border-main-divider", title: horizontalNavigationTitle, links: relatedEnterprises }), jsx(TextInformation, {})] }));
+        const { relatedEnterprises, contacts, socialMedia, mobileApps, horizontalNavigationTitle } = useSWRResource(projectSettings.FOOTER || 'footer', fallback);
+        return (jsxs(BlockWrapper, { tag: "footer", className: className, defaultPadding: "px-4 py-6", ...rest, children: [jsx("div", { className: "mb-4 pb-5 border-b border-main-divider", children: sitemap.topItems?.map((item, i) => (jsx(RollupItem, { label: item?.text, labelIcon: item?.icon, children: jsx(LinkList, { items: item.items, className: "my-3" }) }, String(i)))) }), jsx(Contacts, { className: "overflow-hidden", items: contacts }), jsx(SocialMedia, { className: "mb-4", media: socialMedia }), mobileApps?.map(renderButton), jsx(HorizontalNavigation, { className: "pt-4 pb-7 border-y border-main-divider", title: horizontalNavigationTitle, links: relatedEnterprises }), jsx(TextInformation, {})] }));
     });
+    const renderButton = ({ href = '/' }, i) => {
+        const { label } = findIconByHref(href);
+        return (jsx(Button, { className: "w-full mb-4", text: label, version: "secondary", href: href, target: "_blank" }, String(i)));
+    };
 
     const ICON_VERSION_MAP = {
         'bg-white': 'color',
@@ -1579,7 +2060,7 @@
     const BaseTile = JSX(({ className, defaultPadding, padding, title = '', insetTitle = '', buttons, leftImage, rightImage, imageAlign, backImage, children, }) => (jsxs("div", { className: style('relative flex flex-col gap-lg font-sans overflow-hidden', padding || defaultPadding, className), children: [backImage ? jsx("div", { className: "absolute bottom-0 right-0 z-0", children: backImage }) : null, title ? jsx("div", { className: "relative", children: title }) : null, jsxs("div", { className: "grow relative flex flex-wrap sm:flex-nowrap justify-between items-stretch gap-lg", children: [renderImageContainer(leftImage, { imageAlign }), jsxs("div", { className: style('flex flex-col gap-lg max-w-[600px] xl:max-w-[728px]', leftImage ? '' : 'grow'), children: [insetTitle, jsx("div", { className: "grow", children: children }), buttons] }), renderImageContainer(rightImage, { className: '-order-1 sm:order-1', imageAlign })] })] })));
     const renderImageContainer = (image, { className, imageAlign }) => image ? (jsx("div", { className: style('flex-shrink-0', imageAlign && imageAlignmentMap[imageAlign], className), children: image })) : null;
 
-    const renderDescription$2 = (description) => description ? (jsx("div", { className: "mb-5 pt-0.5 sm:mb-0 sm:pt-0", children: jsx(Text, { size: "text-xl", "font-weight": "light", children: description }) })) : null;
+    const renderDescription$1 = (description) => description ? (jsx("div", { className: "mb-5 pt-0.5 sm:mb-0 sm:pt-0", children: jsx(Text, { size: "text-xl", "font-weight": "light", children: description }) })) : null;
 
     const renderList$1 = (items) => {
         return items?.length ? (jsx(List, { items: items, className: "text-l font-light mb-2 last:mb-0" })) : (jsx("span", { className: "text-m font-light text-secondary-text", children: "\u041D\u0430\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u0430\u043C\u0435\u0440\u0443 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430 \u043D\u0430 QR-\u043A\u043E\u0434 \u0438 \u0441\u043A\u0430\u0447\u0430\u0439\u0442\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" }));
@@ -1587,7 +2068,7 @@
 
     const MobileAppTile = JSX(({ className, padding, alignTitle = 'left', buttons = [], description, headingType = 'h4', image, items, qr, title = 'Мобильное приложение', version = 'primary', ...rest }) => {
         const containerStyle = version === 'secondary' ? 'p-3.5 min-w-[120px]' : 'min-w-[92px]';
-        return (jsx(BlockWrapper, { className: style('min-h-80', className), padding: "p-0", version: version, ...rest, children: jsxs(BaseTile, { className: "h-full", padding: padding, defaultPadding: "p-default", title: title ? (jsx(Heading, { headingType: headingType, title: title, className: style('whitespace-pre-wrap', AlignText[alignTitle]) })) : null, backImage: image?.src ? jsx(Img, { image: image }) : null, buttons: renderButtonsSection(buttons, { isVertical: buttons.length > 3 }), children: [renderDescription$2(description), jsxs("div", { className: "flex flex-1 gap-s items-center", children: [qr?.src ? (jsx("div", { className: style('flex justify-center bg-white rounded-md', containerStyle), children: jsx(Img, { className: "w-fit", image: qr }) })) : null, renderList$1(items)] })] }) }));
+        return (jsx(BlockWrapper, { className: style('min-h-80', className), padding: "p-0", version: version, ...rest, children: jsxs(BaseTile, { className: "h-full", padding: padding, defaultPadding: "p-default", title: title ? (jsx(Heading, { headingType: headingType, title: title, className: style('whitespace-pre-wrap', AlignText[alignTitle]) })) : null, backImage: image?.src ? jsx(Img, { image: image }) : null, buttons: renderButtonsSection(buttons, { isVertical: buttons.length > 3 }), children: [renderDescription$1(description), jsxs("div", { className: "flex flex-1 gap-s items-center", children: [qr?.src ? (jsx("div", { className: style('flex justify-center bg-white rounded-md', containerStyle), children: jsx(Img, { className: "w-fit", image: qr }) })) : null, renderList$1(items)] })] }) }));
     });
 
     const sum = (list = []) => list.reduce((a, b) => a + b, 0);
@@ -1905,10 +2386,10 @@
         data: colData?.[i] || [{}],
     }));
 
-    const TextBlock = JSX(({ className = '', title, description, iconVersion, image, __html, items = [], ...rest }) => (jsxs(BlockWrapper, { className: style('flex gap-3 bg-white group-data-secondary:bg-primary-main/10', className), ...rest, children: [iconVersion === 'small' ? jsx("div", { className: "mt-1", children: renderIcon() }) : null, iconVersion === 'big' ? renderImage(image) : null, jsxs("div", { className: "flex flex-col w-fit gap-3", children: [title ? (jsx(Text, { size: "text-l", font: "font-medium", color: "text-primary-text group-data-secondary:text-white", children: title })) : null, description ? renderDescription$1(description) : null, items?.length ? renderList(items, true) : null, __html ? jsx(RichText, { __html: __html }) : null] })] })));
+    const TextBlock = JSX(({ className = '', title, description, iconVersion, image, __html, items = [], ...rest }) => (jsxs(BlockWrapper, { className: style('flex gap-3 sm:gap-4 bg-white group-data-secondary:bg-primary-main/10', className), ...rest, children: [iconVersion === 'small' ? jsx("div", { className: "mt-1", children: renderIcon() }) : null, iconVersion === 'big' ? renderImage(image) : null, jsxs("div", { className: "flex flex-col w-fit gap-1 sm:gap-2", children: [title ? (jsx(Text, { size: "text-l", font: "font-normal", color: "text-primary-text group-data-secondary:text-white", children: title })) : null, description ? renderDescription(description) : null, items?.length ? renderList(items, true) : null, __html ? jsx(RichText, { __html: __html }) : null] })] })));
     const renderIcon = () => (jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs font-light bg-primary-main text-white group-data-secondary:bg-white group-data-secondary:text-primary-main`, children: "i" }));
-    const renderImage = (image) => image?.src ? jsx(Img, { className: "h-fit", image: image }) : null;
-    const renderDescription$1 = (description) => (jsx(Paragraph, { size: "text-s", color: "text-secondary-text group-data-secondary:text-white", children: description }));
+    const renderImage = (image) => image?.src ? jsx(Img, { className: "h-fit flex-shrink-0", image: image }) : null;
+    const renderDescription = (description) => (jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text group-data-secondary:text-white", children: description }));
     const renderList = (items, bullets) => {
         const listStyle = bullets ? 'list-disc pl-6' : '';
         return (jsx("ul", { className: style('text-secondary-text group-data-secondary:text-white/80', listStyle), children: items.map((_, i) => (jsx("li", { children: jsx(Text, { size: "text-s", font: "font-light", children: _ }) }, `listItem-${i}`))) }));
@@ -1939,23 +2420,8 @@
     });
     VerticalLayout.childrenTypes = [];
 
-    const benefitImageStyles = 'w-56 h-56 min-w-56';
-
-    const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => (jsxs(BlockWrapper, { className: className, defaultPadding: "p-default", ...rest, children: [title ? jsx(Heading, { headingType: "h3", as: "h2", className: "text-center", title: title }) : null, benefitList?.length ? (jsx("div", { className: "sm:flex sm:flex-wrap w-full sm:justify-center sm:gap-x-m gap-y-lg sm:gap-y-0 mt-8", role: "list", children: benefitList.map(renderBenefit) })) : null] })));
-    const renderBenefit = (benefit, i) => (jsxs("div", { className: "flex items-center sm:basis-1/2 sm:max-w-[400px] mb-14", role: "listitem", children: [benefit?.icon?.icon ? (jsx(Img, { className: style('p-3 mr-5 shrink-0 bg-main-divider text-primary-main group-data-secondary:bg-white/30 group-data-secondary:text-black', benefitImageStyles), image: benefit.icon })) : null, benefit?.icon?.src ? jsx(Img, { className: "mr-5 shrink-0", image: benefit.icon }) : null, benefit?.label ? (jsxs("div", { className: "sm:h-full", children: [jsx(Heading, { headingType: "h6", children: benefit.label }), renderDescription(benefit.description)] })) : null] }, String(i)));
-    const renderDescription = (description) => {
-        const benefitType = description?.benefitType || null;
-        return description && benefitType ? (jsx("div", { className: "mt-2 text-l font-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 Blocks = {
+        ApplicationForm,
         ButtonsBlock,
         BonusBenefitsBlock,
         CardTransfer,
@@ -1988,14 +2454,6 @@
         BenefitsBlock,
     };
 
-    function useBool(defaultValue = false) {
-        const [value, setValue] = useState(defaultValue);
-        const setTrue = useCallback(() => setValue(true), []);
-        const setFalse = useCallback(() => setValue(false), []);
-        const toggle = useCallback(() => setValue((_) => !_), []);
-        return [value, { setValue, setTrue, setFalse, toggle }];
-    }
-
     const debounce = (fn, delay = 600) => {
         let timerId;
         const debouncedCallback = (...args) => {
@@ -2120,7 +2578,7 @@
             globalThis.localStorage?.setItem(COOKIE_DIALOG_ID, 'true');
             close();
         }, [close]);
-        return isOpened ? (jsx("div", { className: "container z-40 fixed bottom-0 left-0 right-0 pointer-events-none", children: jsxs("div", { className: "bg-white m-6 p-6 rounded-md flex items-center pointer-events-auto shadow-[0_4px_25px_rgba(0,0,0,0.07)]", children: [jsx("div", { className: "flex-1", children: jsxs(Paragraph, { size: "text-s", font: "font-light", color: "text-primary-text", children: ["\u0410\u041E \u00AB\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u00BB \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442", jsx(LinkWrapper, { isRemote: true, className: style(getStyleLinkWrapper(termLink?.href)), ...termLink, children: "cookie" }), "(\u0444\u0430\u0439\u043B\u044B \u0441 \u0434\u0430\u043D\u043D\u044B\u043C\u0438 \u043E \u043F\u0440\u043E\u0448\u043B\u044B\u0445 \u043F\u043E\u0441\u0435\u0449\u0435\u043D\u0438\u044F\u0445 \u0441\u0430\u0439\u0442\u0430) \u0434\u043B\u044F \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u043E\u0432 \u0438 \u0443\u0434\u043E\u0431\u0441\u0442\u0432\u0430 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u0435\u0439. \u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0437\u0430\u043F\u0440\u0435\u0442\u0438\u0442\u044C \u0441\u043E\u0445\u0440\u0430\u043D\u0435\u043D\u0438\u0435 cookie \u0432 \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0430\u0445 \u0441\u0432\u043E\u0435\u0433\u043E \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.", jsx(LinkWrapper, { isRemote: true, className: style(getStyleLinkWrapper(personalDataPolicyLink?.href)), ...personalDataPolicyLink, children: "\u041E\u0431\u0440\u0430\u0431\u043E\u0442\u043A\u0430 \u0412\u0430\u0448\u0438\u0445 \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445" }), "\u043F\u0440\u043E\u0438\u0437\u0432\u043E\u0434\u0438\u0442\u0441\u044F \u0432 \u0441\u043E\u043E\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u0442\u0440\u0435\u0431\u043E\u0432\u0430\u043D\u0438\u044F\u043C\u0438 \u0424\u0435\u0434\u0435\u0440\u0430\u043B\u044C\u043D\u043E\u0433\u043E \u0437\u0430\u043A\u043E\u043D\u0430 \u043E\u0442 27.07.2006 \u2116 152-\u04243 \u00AB\u041E \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445\u00BB."] }) }), jsx("div", { className: "w-24 flex justify-end", children: jsx(CloseButton, { className: "bg-main-gray rounded-md", onClick: handleClose }) })] }) })) : null;
+        return isOpened ? (jsx("div", { className: "container z-40 fixed bottom-0 left-0 right-0 pointer-events-none", children: jsxs("div", { className: "bg-white m-5 p-5 sm:m-6 sm:p-6 rounded-md flex sm:items-center pointer-events-auto shadow-[0_4px_25px_rgba(0,0,0,0.07)]", children: [jsx("div", { className: "sm:flex-1", children: jsxs(Paragraph, { size: "text-s", font: "font-light", color: "text-primary-text", children: ["\u0410\u041E \u00AB\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A\u00BB \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442", jsx(LinkWrapper, { isRemote: true, className: style(getStyleLinkWrapper(termLink?.href)), ...termLink, children: "cookie" }), "(\u0444\u0430\u0439\u043B\u044B \u0441 \u0434\u0430\u043D\u043D\u044B\u043C\u0438 \u043E \u043F\u0440\u043E\u0448\u043B\u044B\u0445 \u043F\u043E\u0441\u0435\u0449\u0435\u043D\u0438\u044F\u0445 \u0441\u0430\u0439\u0442\u0430) \u0434\u043B\u044F \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u043E\u0432 \u0438 \u0443\u0434\u043E\u0431\u0441\u0442\u0432\u0430 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u0435\u0439. \u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0437\u0430\u043F\u0440\u0435\u0442\u0438\u0442\u044C \u0441\u043E\u0445\u0440\u0430\u043D\u0435\u043D\u0438\u0435 cookie \u0432 \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0430\u0445 \u0441\u0432\u043E\u0435\u0433\u043E \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.", jsx(LinkWrapper, { isRemote: true, className: style(getStyleLinkWrapper(personalDataPolicyLink?.href)), ...personalDataPolicyLink, children: "\u041E\u0431\u0440\u0430\u0431\u043E\u0442\u043A\u0430 \u0412\u0430\u0448\u0438\u0445 \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445" }), "\u043F\u0440\u043E\u0438\u0437\u0432\u043E\u0434\u0438\u0442\u0441\u044F \u0432 \u0441\u043E\u043E\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u0442\u0440\u0435\u0431\u043E\u0432\u0430\u043D\u0438\u044F\u043C\u0438 \u0424\u0435\u0434\u0435\u0440\u0430\u043B\u044C\u043D\u043E\u0433\u043E \u0437\u0430\u043A\u043E\u043D\u0430 \u043E\u0442 27.07.2006 \u2116 152-\u04243 \u00AB\u041E \u043F\u0435\u0440\u0441\u043E\u043D\u0430\u043B\u044C\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445\u00BB."] }) }), jsx("div", { className: "ml-3 sm:ml-0 w-24 flex justify-end", children: jsx(CloseButton, { className: "bg-main-gray rounded-md", onClick: handleClose }) })] }) })) : null;
     });
     const getStyleLinkWrapper = (href) => ['inline mx-1', href ? 'text-green-dark' : ''];
 
@@ -2199,7 +2657,7 @@
 
     const joinList = (sep) => (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: `sep-${i}` }, el) : [el]), []);
 
-    const packageVersion = "0.12.8";
+    const packageVersion = "0.12.9";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;