@redneckz/wildless-cms-uni-blocks 0.14.57 → 0.14.59

package/bundle/bundle.umd.js

@@ -243,30 +243,10 @@
         return JSXTmpl;
     };
 
-    function LeadServiceAPI() {
-        async function send(body, isIndividualType) {
-            const url = isIndividualType ? '/api/v1/lead' : '/api/v1/sendcorporatelead';
-            try {
-                const response = await fetch(url, {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    mode: 'cors',
-                    body: JSON.stringify(body),
-                });
-                if (!response?.ok) {
-                    return null;
-                }
-                const data = await response.json();
-                return data;
-            }
-            catch (e) {
-                return null;
-            }
-        }
-        return {
-            send,
-        };
-    }
+    const isSSR = () => Boolean(typeof globalThis.process === 'object' && globalThis.process && globalThis.process.version);
+
+    const isClient = !isSSR();
+    const ClientOnly = JSX(({ children }) => (isClient ? children : null));
 
     class EventBus {
         subscribers = {};
@@ -374,154 +354,52 @@
         return (jsx(Tag, { className: style('font-sans m-0', styles$3[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 update = useCallback((_) => {
-            setFormState(_);
-            setDirtyFieldsMap(_);
-        }, []);
-        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,
-                update,
-                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 Paragraph = JSX(({ children, ...styleProps }) => (jsx("p", { className: style('font-sans', Object.values(styleProps)), children: children })));
 
-    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 headlineVersionStyles = {
+        XXL: {
+            title: { headingType: 'h0', as: 'h1' },
+            descriptionSize: 'text-h5',
+            descriptionWeight: 'font-normal',
+            descriptionStyle: 'mt-xl',
+        },
+        XL: {
+            title: { headingType: 'h1', as: 'h1' },
+            descriptionSize: 'text-xl',
+            descriptionWeight: 'font-light',
+            descriptionStyle: 'mt-m',
+        },
+        L: {
+            title: { headingType: 'h2', as: 'h2' },
+            descriptionSize: 'text-xl',
+            descriptionWeight: 'font-light',
+            descriptionStyle: 'mt-m',
+        },
+        M: {
+            title: { headingType: 'h3', as: 'h2' },
+            descriptionSize: 'text-xl',
+            descriptionWeight: 'font-light',
+            descriptionStyle: 'mt-s',
+        },
+        S: {
+            title: { headingType: 'h4', as: 'h2' },
+            descriptionSize: 'text-xl',
+            descriptionWeight: 'font-light',
+            descriptionStyle: 'mt-xs',
+        },
+        XS: {
+            title: { headingType: 'h5', as: 'h2' },
+            descriptionSize: 'text-m',
+            descriptionWeight: 'font-light',
+            descriptionStyle: 'mt-xs',
+        },
     };
 
-    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;
-            }
-            let canceled = false;
-            const setResult = (newData, err) => {
-                if (!canceled) {
-                    setData(newData);
-                    setError(err);
-                }
-            };
-            (async () => {
-                try {
-                    setResult(await (simpleKey ? applyCache(fetcher, cache)(simpleKey) : fetcher(...args)));
-                }
-                catch (err) {
-                    setResult(undefined, err);
-                }
-            })();
-            return () => {
-                canceled = true;
-            };
-        }, [fetcher, cache, args]);
-        const fallbackData = fallback && simpleKey && fallback[simpleKey];
-        return {
-            data: !data && fallbackData ? fallbackData : data,
-            error,
-            mutate: () => Promise.resolve(undefined) // TODO Clean up cache
-        };
-    }
-    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 response.json();
-    }
-
-    const REGIONS_URL$1 = '/api/v1/regions';
-    const EMPTY_VALUE$5 = [];
-    function useGetRegions() {
-        const { data } = useAsyncData(REGIONS_URL$1, fetchJSONUnsafe);
-        return data || EMPTY_VALUE$5;
-    }
+    const Headline = JSX(({ className, version = '', headlineVersion = 'XL', title, description, align = 'text-center', as, isEmbedded = false, isTheme = false, ...rest }) => {
+        const versionStyle = headlineVersionStyles[headlineVersion];
+        const descriptionStyle = { marginTop: versionStyle.descriptionStyle };
+        return (jsxs(BlockWrapper, { className: style(isEmbedded ? '@container-normal' : '', className), defaultPadding: isEmbedded ? '' : 'p-6xl', version: version, isTheme: isTheme, ...rest, children: [title ? (jsx(Heading, { className: style('whitespace-pre-wrap', align), ...versionStyle?.title, as: as || versionStyle?.title.as, title: title })) : null, description ? (jsx(Paragraph, { size: versionStyle.descriptionSize, font: versionStyle.descriptionWeight, align: align, ...descriptionStyle, children: description })) : null] }));
+    });
 
     const useDialogManager = () => ({
         open: (dialog, options = {}) => defaultEventBus.fire('dialog', { type: 'open', dialog, ...options }),
@@ -702,28 +580,416 @@
     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(({ text, link }) => (jsxs(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: [jsx(Text, { children: text || 'Нажимая кнопку, вы подтверждаете согласие с ' }), 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 isOnlyDigits = (str) => str && !/\D/.test(str);
 
-    const withValidator = (props, validator) => {
-        const { value, isDirty } = props;
-        const errors = isDirty ? validator(value) : [];
-        return {
-            ...props,
-            errors,
-            error: errors[0],
-        };
+    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', width, height, }) => {
+        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(width), svgUseStyleMap[iconVersion], iconVersion === 'white' ? 'invert' : '', imageClassName), width: width, height: height, "aria-hidden": "true", children: [title ? jsx("title", { children: title }) : null, alt ? jsx("desc", { children: alt }) : null, jsx("use", { href: `${href}#icon`, xlinkHref: `${href}#icon` })] }) }));
+        }
+        return (jsx("img", { className: className, src: href, alt: alt, title: title, "aria-hidden": "true", width: width, height: height, style: getInlineStyle(className, height) }));
+    });
+    const getInlineStyle = (className, height) => {
+        if (className?.includes('h-')) {
+            return {};
+        }
+        return { height: isOnlyDigits(height) ? `${height}px` : height, width: 'auto' };
     };
+    const getSvgSize = (width) => (width ? '' : 'w-full h-full');
+    const Background = JSX(({ className, children }) => className ? jsx("div", { className: className, children: children }) : children);
 
-    const Input = JSX(({ key, className = '', inputClassName = '', id, name, type = 'text', label, placeholder, value = '', valid = true, children, onChange, onFocus, onBlur, pattern, autoFocus = false, }) => {
-        const inputRef = useRef(null);
-        const handleChange = useCallback((e) => {
-            onChange && onChange(e.target?.value || '');
-        }, [onChange]);
-        useEffect(() => {
+    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)` : '', width: image.size?.width, height: image.size?.height }, `${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',
+        }, width: image.size?.width, height: image.size?.height }));
+    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 }));
+    });
+
+    function renderBackwardButton(version, handleClick) {
+        const iconVersion = version === 'primary' ? 'white' : 'black';
+        const className = 'w-12 h-12 min-h-12 min-w-12 flex items-center justify-center';
+        const text = 'Вернуться назад';
+        return (jsxs("div", { className: "hidden sm:flex items-center gap-s", children: [jsx("div", { className: getRegularButtonClasses({ className, version, rounded: true }), onClick: handleClick, children: jsx(Img, { className: "w-4 h-4", image: {
+                            icon: 'ArrowLeftIcon',
+                            iconVersion: iconVersion,
+                        } }) }), jsx(Button, { version: "link", className: "group-data-secondary:text-white/80", text: text, ariaLabel: text, onClick: handleClick })] }));
+    }
+
+    const imageAlignmentMap = {
+        start: '@xl:self-start',
+        center: '@xl:self-center',
+        end: '@xl:self-end',
+    };
+    const BaseTile = JSX(({ className, version = 'primary', defaultPadding, padding, title = '', insetTitle = '', buttons, leftImage, rightImage, imageAlign, isImageAlwaysOnRight = false, isImageSecondary = false, backwardButton, children, }) => {
+        const router = useRouter();
+        const handleClick = useCallback((ev) => {
+            ev?.preventDefault();
+            router.back();
+        }, []);
+        return (jsxs("div", { className: getStyle(padding, defaultPadding, className), children: [backwardButton ? renderBackwardButton(version, handleClick) : null, title ? jsx("div", { className: "relative", children: title }) : null, jsxs("div", { className: style('grow relative flex flex-col @xl:flex-row gap-3xl w-full', leftImage ? 'self-start @xl:w-auto' : ''), children: [renderImageContainer(leftImage, { imageAlign, className: 'mx-auto' }), jsxs("div", { className: style('grid gap-3xl h-full', rightImage ? '@xl:grid-cols-2' : '', leftImage ? '' : 'grow'), children: [jsxs("div", { className: "grow space-y-lg min-w-fit", children: [insetTitle, children] }), renderImageContainer(rightImage, {
+                                    className: style('@xl:justify-self-end @xl:col-start-2', buttons ? rowSpanStyle(isImageAlwaysOnRight) : '', positionStyle(isImageAlwaysOnRight), imageSecondaryStyle(isImageSecondary)),
+                                    imageAlign,
+                                }), renderButtons(buttons)] })] })] }));
+    });
+    const getStyle = (padding = '', defaultPadding = '', className = '') => style('relative flex flex-col gap-3xl overflow-hidden', padding || defaultPadding, className);
+    const rowSpanStyle = (isImageAlwaysOnRight) => isImageAlwaysOnRight ? 'row-span-2' : '@xl:row-span-2';
+    const positionStyle = (isImageAlwaysOnRight) => isImageAlwaysOnRight ? 'col-start-2 self-center' : '';
+    const renderButtons = (buttons) => buttons ? jsx("div", { className: "self-end", children: buttons }) : null;
+    const renderImageContainer = (image, { className, imageAlign }) => image ? (jsx("div", { className: style('shrink-1/2 justify-self-center', imageAlign && imageAlignmentMap[imageAlign], className), children: image })) : null;
+    const imageSecondaryStyle = (isImageSecondary) => isImageSecondary ? 'hidden @xl:block' : '';
+
+    const sum = (list = []) => list.reduce((a, b) => a + b, 0);
+
+    const avg = (items = []) => (items?.length ? sum(items) / items.length : 0);
+
+    const deviation = (items) => items?.length ? Math.sqrt(Math.abs(avg(items.map((_) => _ ** 2)) - avg(items) ** 2)) : 0;
+
+    const renderBenefitIcon = (icon, benefitsVersion = 'normal') => icon ? (jsx("div", { className: style('sm:w-12 sm:h-12 sm:min-w-12 w-11 h-11 min-w-11 box-border flex items-center justify-center rounded-icon', benefitsVersion === 'normal'
+            ? 'bg-secondary-light text-primary-main'
+            : 'bg-primary-main text-black group-data-secondary:bg-white/30 group-data-secondary:text-black'), children: jsx(Img, { className: "w-6 h-6", image: { ...icon, iconVersion: icon.iconVersion || benefitsVersion } }) })) : null;
+
+    const getHtmlText = (html) => html.replace(/<\/?[^>]+\/?>/g, '').trim();
+
+    const RichText = JSX((props) => {
+        const { __html = '', richVersion = '' } = props;
+        return getHtmlText(__html) ? (jsx("div", { className: style(richVersion, 'md-container'), dangerouslySetInnerHTML: { __html } })) : null;
+    });
+
+    const renderBenefitDescription = (description, i) => description ? (jsx(Paragraph, { font: "font-light", size: "text-m", color: "text-secondary-text group-data-secondary:text-white", children: description }, `description-${i}`)) : null;
+
+    const Text = JSX(({ children, ...styleProps }) => (jsx("span", { className: style('font-sans', Object.values(styleProps)), children: children })));
+
+    const renderBenefitLabel = (label, i) => label ? (jsx(Text, { color: "text-primary-text group-data-secondary:text-white", size: "text-h6", children: label }, `label-${i}`)) : null;
+
+    const renderBenefitText = (_, i) => _.type === 'rte' && '__html' in _ && _.__html ? (jsx(RichText, { ..._ }, `rte-${i}`)) : ([
+        'label' in _ ? renderBenefitLabel(_.label, i) : null,
+        'description' in _ ? (jsx("span", { className: _.descriptionClassName, children: renderBenefitDescription(_.description, i) }, String(i))) : null,
+    ]);
+
+    const BenefitItem = JSX(({ className, benefitsVersion, ..._ }) => (jsxs("div", { className: style('flex gap-m min-w-56 items-center', className), children: ['icon' in _ ? renderBenefitIcon(_.icon, benefitsVersion) : null, jsx("div", { children: renderBenefitText(_) })] })));
+
+    const MAX_BENEFITS_LEN_DEVIATION = 16;
+    const benefitLength = (_) => _.type === 'rte'
+        ? _?.__html?.length || 0
+        : Math.max(_?.label?.length || 0, _?.description?.length || 0);
+    const isDistortedBenefits = (benefits) => deviation(benefits.map(benefitLength)) > MAX_BENEFITS_LEN_DEVIATION;
+    const hasIcon = (_) => _ && 'icon' in _ && _.icon && (_.icon.icon || _.icon.src);
+    const isTextualBenefits = (benefits) => !benefits.some(hasIcon);
+    const DefaultBenefitsList = JSX(({ className, benefitsVersion = 'normal', benefits }) => benefits?.length ? (jsx("div", { className: style('flex gap-x-m gap-y-s', isDistortedBenefits(benefits) || isTextualBenefits(benefits) ? 'flex-col' : 'flex-wrap', className), children: benefits.map((_, i) => (jsx(BenefitItem, { benefitsVersion: benefitsVersion, ..._ }, String(i)))) })) : null);
+
+    const TabularBenefitsList = JSX(({ className, benefits }) => benefits?.length ? (jsx("div", { className: style('grid grid-cols-[max-content_1fr] auto-rows-auto items-baseline gap-x-m gap-y-xs', className), children: benefits.flatMap(renderBenefitText) })) : null);
+
+    const BenefitsList = JSX(({ isTabularBenefits, ...rest }) => isTabularBenefits ? jsx(TabularBenefitsList, { ...rest }) : jsx(DefaultBenefitsList, { ...rest }));
+
+    const isIcon = (icon) => Boolean(icon?.src || icon?.icon);
+
+    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 @xl:flex-nowrap gap-lg sm:gap-m', className), children: buttons.map(renderButton(buttonClassName)) })) : null;
+    const renderButton = (buttonClassName = '') => (button, index) => {
+        const { text, icon, iconRight, version, ...rest } = button || {};
+        const iconVersion = getIconVersion(icon, version);
+        const iconRightVersion = getIconVersion(iconRight, version);
+        return text || icon?.icon ? (jsx(Button, { className: style('basis-full @lg:basis-auto', buttonClassName), appendLeft: renderButtonIcon({ ...icon, iconVersion }), appendRight: renderButtonIcon({ ...iconRight, iconVersion: iconRightVersion }), version: version, text: text, ...rest }, index ? String(index) : '')) : null;
+    };
+    const DEFAULT_ICON_W = 24;
+    const getIconVersion = (icon, version = 'secondary') => {
+        const iconVersionDefault = version === 'secondary' ? 'color' : 'white';
+        return icon?.iconVersion ? icon?.iconVersion : iconVersionDefault;
+    };
+    const renderButtonIcon = (icon) => isIcon(icon) ? (jsx(Img, { image: icon, width: String(icon?.size?.width || DEFAULT_ICON_W), height: String(DEFAULT_ICON_W) })) : null;
+
+    const DOT_SIZE_MAP = {
+        L: 'w-1.5 h-1.5 mr-m',
+        M: 'w-1.5 h-1.5 mr-s',
+        S: 'w-1 h-1 mr-xs',
+        XS: 'w-1 h-1 mr-xs',
+    };
+    const ListItem = JSX(({ className, isDotted, children, size = 'M' }) => (jsxs("div", { className: style('font-sans flex', className), role: "listitem", children: [isDotted ? (jsx("div", { className: "shrink-0", children: jsx("div", { className: style('align-middle inline-block rounded-full bg-primary-text group-data-secondary:bg-white', DOT_SIZE_MAP[size]) }) })) : null, jsx("span", { children: children })] })));
+
+    const TEXT_SIZE_MAP = {
+        XS: 'text-m font-light',
+        S: 'text-l font-light',
+        M: 'text-h6',
+        L: 'text-h5',
+    };
+    const ITEM_INDENT_MAP = {
+        XS: 'ml-2xs',
+        S: 'ml-xs',
+        M: 'ml-s',
+        L: 'ml-m',
+    };
+    const List = JSX(({ className, hasIndent, isDotted = true, items = [], listItemSize = 'M' }) => items?.length ? (jsx("section", { className: style('flex flex-col gap-xs text-left text-primary-text group-data-secondary:text-white group-data-gray:text-secondary-text', TEXT_SIZE_MAP[listItemSize], hasIndent ? ITEM_INDENT_MAP[listItemSize] : '', className), role: "list", children: items.map((item, i) => (jsx(ListItem, { isDotted: isDotted, size: listItemSize, children: item }, String(i)))) })) : null);
+
+    const toLocalNumberFormat = (fractionDigits = 0) => (_ = 0) => new Intl.NumberFormat('ru-RU', {
+        minimumFractionDigits: 0,
+        maximumFractionDigits: fractionDigits,
+    }).format(Number(_) || 0);
+
+    const PriceList = JSX(({ priceList }) => priceList?.length ? (jsx("div", { className: "flex flex-wrap xl:flex-nowrap xl:bg-main-divider xl:rounded-md p-xs gap-xl", children: priceList.map(renderPriceListItem) })) : null);
+    const renderPriceListItem = ({ label, amount }) => (jsxs("div", { className: "basis-full flex flex-col-reverse sm:flex-row sm:justify-between sm:bg-main-divider sm:py-m sm:px-lg sm:rounded-md items-baseline whitespace-pre", children: [jsx(Text, { font: "font-light", size: "text-l", color: "text-secondary-text", children: label }), amount ? (jsxs("span", { className: "font-sans text-h6 sm:text-primary-main text-primary-text", children: [toLocalNumberFormat(2)(amount), " \u20BD"] })) : null] }));
+
+    const Tags = JSX(({ className, tags }) => tags?.length ? (jsx("div", { className: style('flex flex-wrap gap-xs', className), role: "list", children: tags.map(renderTag) })) : null);
+    const renderTag = (tag, key) => (jsx("div", { className: "p-xs border-solid border rounded-md border-gray", role: "listitem", children: jsx(Text, { size: "text-m", font: "font-light", children: tag }) }, String(key)));
+
+    const BaseProductTile = JSX(
+    // eslint-disable-next-line max-lines-per-function
+    ({ className, padding, defaultPadding, title, description, headlineVersion = 'L', align = 'text-left', benefitsVersion, isTabularBenefits, benefits, __html, isFullWidthTitle, items, isDotted = true, priceList = [], listItemSize, tags = [], buttons, image, imageOptions: { imageAlign = 'center', directionRight = true, isImageAlwaysOnRight, isImageSecondary = false, } = {}, backwardButton, children, ...rest }) => {
+        const img = image?.src ? jsx(Img, { image: image }) : null;
+        const headline = (jsx(Headline, { title: title, description: description, headlineVersion: headlineVersion, align: align, isEmbedded: true }));
+        const filteredBenefits = benefits?.filter((_) => _?.type === 'rte' || 'label' in _ || 'description' in _);
+        return (jsx(BaseTile, { className: className, padding: padding, defaultPadding: defaultPadding, ...(isFullWidthTitle ? { title: headline } : { insetTitle: headline }), ...leftOrRightImage(img, directionRight), isImageSecondary: isImageSecondary, imageAlign: imageAlign, isImageAlwaysOnRight: isImageAlwaysOnRight, buttons: renderButtonsSection(buttons), backwardButton: backwardButton, ...rest, children: jsxs("div", { className: "flex flex-col sm:gap-xl gap-4xl", children: [filteredBenefits?.length ? (jsx(BenefitsList, { benefitsVersion: benefitsVersion, isTabularBenefits: isTabularBenefits, benefits: filteredBenefits })) : null, __html ? jsx(RichText, { __html: __html }) : null, items?.length ? (jsx(List, { items: items, isDotted: isDotted, listItemSize: listItemSize })) : null, children, priceList?.length ? jsx(PriceList, { priceList: priceList }) : null, renderTags(tags)] }) }));
+    });
+    const leftOrRightImage = (img, directionRight) => directionRight ? { rightImage: img } : { leftImage: img };
+    const renderTags = (tags) => (tags?.length ? jsx(Tags, { tags: tags }) : null);
+
+    const getBorderStyle$1 = (showBorder) => showBorder
+        ? 'border border-solid border-gray group-data-secondary:border-white/50 group-data-gray:border-main-divider'
+        : '';
+
+    const ProductBlock = JSX(({ className, padding, showBorder, ...rest }) => (jsx(BlockWrapper, { className: style('overflow-hidden flex flex-col gap-3xl box-border', getBorderStyle$1(showBorder), className), padding: "p-0", ...rest, children: jsx(BaseProductTile, { defaultPadding: "p-6xl", padding: padding, className: "grow h-full", ...rest }) })));
+
+    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;
+            }
+            let canceled = false;
+            const setResult = (newData, err) => {
+                if (!canceled) {
+                    setData(newData);
+                    setError(err);
+                }
+            };
+            (async () => {
+                try {
+                    setResult(await (simpleKey ? applyCache(fetcher, cache)(simpleKey) : fetcher(...args)));
+                }
+                catch (err) {
+                    setResult(undefined, err);
+                }
+            })();
+            return () => {
+                canceled = true;
+            };
+        }, [fetcher, cache, args]);
+        const fallbackData = fallback && simpleKey && fallback[simpleKey];
+        return {
+            data: !data && fallbackData ? fallbackData : data,
+            error,
+            mutate: () => Promise.resolve(undefined) // TODO Clean up cache
+        };
+    }
+    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 response.json();
+    }
+
+    const EMPTY_VALUE$5 = {};
+    const DEFAULT_FOLDER_NAME = 'wcms-resources';
+    function useSWRResource(filename, options = {}) {
+        const { fallback = EMPTY_VALUE$5, folderName = DEFAULT_FOLDER_NAME, setBasePath = false } = options;
+        const path = joinPath('/', setBasePath ? projectSettings.BASE_PATH : '', folderName, `${filename}.json`);
+        const { data } = useAsyncData(filename ? path : null, fetchJSONUnsafe, {
+            fallback,
+        });
+        return data || EMPTY_VALUE$5;
+    }
+
+    const useAdTile = (sourceBook = 'reklamnaya-plitka') => {
+        const data = useSWRResource(sourceBook);
+        const tileIndex = useMemo(() => randomNumInRange(0, data?.items?.length), [data]);
+        return data?.items?.[tileIndex];
+    };
+    const randomNumInRange = (min = 0, max = 0) => Math.floor(Math.random() * (max - min) + min);
+
+    const AdTile = JSX((props) => {
+        const content = useAdTile(props.options?.page?.adSourceBook);
+        return content ? (jsx(ClientOnly, { children: jsx(ProductBlock, { ...content, ...props }) })) : null;
+    });
+
+    function LeadServiceAPI() {
+        async function send(body, isIndividualType) {
+            const url = isIndividualType ? '/api/v1/lead' : '/api/v1/sendcorporatelead';
+            try {
+                const response = await fetch(url, {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    mode: 'cors',
+                    body: JSON.stringify(body),
+                });
+                if (!response?.ok) {
+                    return null;
+                }
+                const data = await response.json();
+                return data;
+            }
+            catch (e) {
+                return null;
+            }
+        }
+        return {
+            send,
+        };
+    }
+
+    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 update = useCallback((_) => {
+            setFormState(_);
+            setDirtyFieldsMap(_);
+        }, []);
+        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,
+                update,
+                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 REGIONS_URL$1 = '/api/v1/regions';
+    const EMPTY_VALUE$4 = [];
+    function useGetRegions() {
+        const { data } = useAsyncData(REGIONS_URL$1, fetchJSONUnsafe);
+        return data || EMPTY_VALUE$4;
+    }
+
+    const Footnote = JSX(({ text, link }) => (jsxs(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: [jsx(Text, { children: text || 'Нажимая кнопку, вы подтверждаете согласие с ' }), 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, autoFocus = false, }) => {
+        const inputRef = useRef(null);
+        const handleChange = useCallback((e) => {
+            onChange && onChange(e.target?.value || '');
+        }, [onChange]);
+        useEffect(() => {
             if (autoFocus) {
                 inputRef.current?.focus();
             }
@@ -772,54 +1038,29 @@
 
     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 }];
-    }
-
-    const isOnlyDigits = (str) => str && !/\D/.test(str);
-
-    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', width, height, }) => {
-        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(width), svgUseStyleMap[iconVersion], iconVersion === 'white' ? 'invert' : '', imageClassName), width: width, height: height, "aria-hidden": "true", children: [title ? jsx("title", { children: title }) : null, alt ? jsx("desc", { children: alt }) : null, jsx("use", { href: `${href}#icon`, xlinkHref: `${href}#icon` })] }) }));
-        }
-        return (jsx("img", { className: className, src: href, alt: alt, title: title, "aria-hidden": "true", width: width, height: height, style: getInlineStyle(className, height) }));
-    });
-    const getInlineStyle = (className, height) => {
-        if (className?.includes('h-')) {
-            return {};
-        }
-        return { height: isOnlyDigits(height) ? `${height}px` : height, width: 'auto' };
-    };
-    const getSvgSize = (width) => (width ? '' : 'w-full h-full');
-    const Background = JSX(({ className, children }) => className ? jsx("div", { className: className, children: children }) : children);
+            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 }];
+    }
 
     const formatOption = (_) => _?.text || _?.key || '';
 
@@ -909,11 +1150,11 @@
             onClose: handleClose,
             iconVersion,
         });
-        return (jsxs("div", { className: className, children: [renderLabel(label), jsxs("div", { className: style('relative', isOpen ? 'z-20' : 'z-10'), ref: inputRef, children: [jsxs("div", { className: style('h-14 text-l flex justify-between items-center text-primary-text cursor-pointer relative z-10', getBorderStyle$1(isBorder, valid)), onClick: isOpen ? handleClose : open, children: [jsx("p", { className: "p-m pr-3xl flex items-center overflow-hidden text-ellipsis whitespace-nowrap", children: formatOption(value) || placeholder }), renderIcon$1(isOpen, iconVersion)] }), isSearch && isOpen ? (jsx("div", { className: style('absolute top-0 w-full z-20'), children: jsx(Input, { type: "text", autoFocus: true, value: query, onChange: setQuery }) })) : null] })] }));
+        return (jsxs("div", { className: className, children: [renderLabel(label), jsxs("div", { className: style('relative', isOpen ? 'z-20' : 'z-10'), ref: inputRef, children: [jsxs("div", { className: style('h-14 text-l flex justify-between items-center text-primary-text cursor-pointer relative z-10', getBorderStyle(isBorder, valid)), onClick: isOpen ? handleClose : open, children: [jsx("p", { className: "p-m pr-3xl flex items-center overflow-hidden text-ellipsis whitespace-nowrap", children: formatOption(value) || placeholder }), renderIcon$1(isOpen, iconVersion)] }), isSearch && isOpen ? (jsx("div", { className: style('absolute top-0 w-full z-20'), children: jsx(Input, { type: "text", autoFocus: true, value: query, onChange: setQuery }) })) : null] })] }));
     });
     const renderLabel = (label) => label ? (jsx("div", { className: "mb-xs", children: jsx(Text, { size: "text-m", color: "text-primary-text", font: "font-light", children: label }) })) : null;
     const renderIcon$1 = (isOpen, iconVersion) => (jsx(Icon, { className: style('absolute right-3', isOpen ? '' : 'rotate-180'), iconVersion: iconVersion, name: "ArrowUpIcon", width: "16", height: "16" }));
-    const getBorderStyle$1 = (isBorder, valid) => style(isBorder ? 'border rounded-md hover:border-primary-hover' : '', valid ? ' border-gray' : 'border-error');
+    const getBorderStyle = (isBorder, valid) => style(isBorder ? 'border rounded-md hover:border-primary-hover' : '', valid ? ' border-gray' : 'border-error');
 
     const SelectControl = JSX(({ className = '', error, ...rest }) => (jsxs("div", { className: className, children: [jsx(Select, { ...rest, valid: !error }), jsx("div", { className: "h-2", children: error ? (jsx(Text, { size: "text-xs", font: "font-light", color: "text-error", children: error })) : null })] })));
 
@@ -1005,14 +1246,14 @@
     });
 
     const BRANCHES_URL = '/api/v1/branches';
-    const EMPTY_VALUE$4 = [];
+    const EMPTY_VALUE$3 = [];
     function useBranches(regionCode) {
         const { data } = useAsyncData(regionCode ? `${BRANCHES_URL}?regionCode=${regionCode}` : null, fetchSafeBoxes$1);
-        return data || EMPTY_VALUE$4;
+        return data || EMPTY_VALUE$3;
     }
     const fetchSafeBoxes$1 = async (url) => {
         const result = await fetchJSON(url, { method: 'GET' });
-        return result || EMPTY_VALUE$4;
+        return result || EMPTY_VALUE$3;
     };
 
     const MIN_CREDIT_AMOUNT = 1000;
@@ -1045,11 +1286,6 @@
 
     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);
@@ -1157,17 +1393,6 @@
         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: "@xl:text-center mb-m" }), jsxs("div", { className: "max-w-[560px] m-auto space-y-s", children: [jsx(InputControl, { className: "shrink-0 w-full", label: "\u0418\u043C\u044F", ...withValidator(field('name'), nameValidator) }), jsx(PhoneInputControl, { className: "shrink-0 w-full", label: "\u0422\u0435\u043B\u0435\u0444\u043E\u043D", ...withValidator(field('phone'), phoneValidator) })] }), jsxs("div", { className: "flex justify-between flex-col-reverse @xl:items-center @xl:flex-row max-w-[560px] m-auto", children: [jsx("div", { className: "flex-1", children: jsx(Footnote, { link: link }) }), renderSubmitButton(button)] })] }));
     });
 
-    const EMPTY_VALUE$3 = {};
-    const DEFAULT_FOLDER_NAME = 'wcms-resources';
-    function useSWRResource(filename, options = {}) {
-        const { fallback = EMPTY_VALUE$3, folderName = DEFAULT_FOLDER_NAME, setBasePath = false } = options;
-        const path = joinPath('/', setBasePath ? projectSettings.BASE_PATH : '', folderName, `${filename}.json`);
-        const { data } = useAsyncData(filename ? path : null, fetchJSONUnsafe, {
-            fallback,
-        });
-        return data || EMPTY_VALUE$3;
-    }
-
     const ApplicationFormGrantSupport = JSX((props) => {
         const { button, sourceBookDir } = props;
         const { regions } = useSWRResource(sourceBookDir || 'regions-grant-support');
@@ -1403,32 +1628,6 @@
         return (jsxs("form", { className: "container space-y-s", onSubmit: formProps.onSubmit, children: [renderIndividualsFields(field), jsxs("div", { className: "@xl:flex justify-between items-center", children: [jsxs("div", { className: "@xl:mb-0 mb-2 flex items-center gap-3", children: [jsx(Checkbox, { ...withValidator(field('consentDataProcessing'), defaultValidator) }), jsx(Footnote, { text: "\u0421\u043E\u0433\u043B\u0430\u0441\u0435\u043D \u0441 ", 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)` : '', width: image.size?.width, height: image.size?.height }, `${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',
-        }, width: image.size?.width, height: image.size?.height }));
-    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 gap-xl", children: [jsxs("a", { className: "flex gap-s items-center text-primary-text no-underline", href: `tel:8 (800) 200-78-70`, "aria-label": "8 (800) 200-78-70", children: [jsx(Img, { image: { icon: 'PhoneIcon' }, width: "24", height: "24" }), jsx("span", { children: "8 (800) 200-78-70" })] }), jsxs("a", { className: "flex gap-s 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" }), jsx("span", { children: "ved@rshb.ru" })] })] }));
 
     const Radio = JSX(({ name, text, value, checked, onChange, className }) => (jsx("div", { className: className, children: jsxs("label", { className: "font-sans flex gap-s items-center relative cursor-pointer", children: [jsx("input", { className: "appearance-none flex justify-center items-center shrink-0 w-5 h-5 border border-gray hover:border-primary-hover\n        checked:border-2 checked:!border-primary-main focus:checked:border-primary-main focus:border-primary-text active:border-primary-text\n        after:block after:w-2.5 after:h-2.5 after:rounded-full checked:after:bg-primary-main outline-none rounded-full cursor-pointer", type: "radio", value: value, name: name, checked: checked, onChange: (_) => onChange(_.target.value) }), text ? jsx(Text, { color: "text-primary-text", children: text }) : null] }) })));
@@ -1552,28 +1751,6 @@
             }, 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 DOT_SIZE_MAP = {
-        L: 'w-1.5 h-1.5 mr-m',
-        M: 'w-1.5 h-1.5 mr-s',
-        S: 'w-1 h-1 mr-xs',
-        XS: 'w-1 h-1 mr-xs',
-    };
-    const ListItem = JSX(({ className, isDotted, children, size = 'M' }) => (jsxs("div", { className: style('font-sans flex', className), role: "listitem", children: [isDotted ? (jsx("div", { className: "shrink-0", children: jsx("div", { className: style('align-middle inline-block rounded-full bg-primary-text group-data-secondary:bg-white', DOT_SIZE_MAP[size]) }) })) : null, jsx("span", { children: children })] })));
-
-    const TEXT_SIZE_MAP = {
-        XS: 'text-m font-light',
-        S: 'text-l font-light',
-        M: 'text-h6',
-        L: 'text-h5',
-    };
-    const ITEM_INDENT_MAP = {
-        XS: 'ml-2xs',
-        S: 'ml-xs',
-        M: 'ml-s',
-        L: 'ml-m',
-    };
-    const List = JSX(({ className, hasIndent, isDotted = true, items = [], listItemSize = 'M' }) => items?.length ? (jsx("section", { className: style('flex flex-col gap-xs text-left text-primary-text group-data-secondary:text-white group-data-gray:text-secondary-text', TEXT_SIZE_MAP[listItemSize], hasIndent ? ITEM_INDENT_MAP[listItemSize] : '', className), role: "list", children: items.map((item, i) => (jsx(ListItem, { isDotted: isDotted, size: listItemSize, children: item }, String(i)))) })) : null);
-
     const defaultIconSize = 44;
 
     const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => (jsxs(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: [title ? jsx(Heading, { headingType: "h3", as: "h2", className: AlignStyles, title: title }) : null, benefitList?.length ? (jsx("div", { className: "flex flex-col @md:flex-row flex-wrap w-full @md:justify-center mt-xl gap-5xl", role: "list", children: benefitList.map(renderBenefit) })) : null] })));
@@ -1590,69 +1767,6 @@
         return description?.items && description.items.length > 0 ? (jsx("ul", { className: style(listStyleType, description.listItemSize ? TEXT_SIZE_MAP[description.listItemSize] : ''), children: description.items.map((_, i) => (jsx("li", { children: jsx(Text, { color: "text-secondary-text group-data-secondary:text-white/80", font: "font-light", children: _ }) }, `benefitListItem-${i}`))) })) : null;
     };
 
-    const isIcon = (icon) => Boolean(icon?.src || icon?.icon);
-
-    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 @xl:flex-nowrap gap-lg sm:gap-m', className), children: buttons.map(renderButton(buttonClassName)) })) : null;
-    const renderButton = (buttonClassName = '') => (button, index) => {
-        const { text, icon, iconRight, version, ...rest } = button || {};
-        const iconVersion = getIconVersion(icon, version);
-        const iconRightVersion = getIconVersion(iconRight, version);
-        return text || icon?.icon ? (jsx(Button, { className: style('basis-full @lg:basis-auto', buttonClassName), appendLeft: renderButtonIcon({ ...icon, iconVersion }), appendRight: renderButtonIcon({ ...iconRight, iconVersion: iconRightVersion }), version: version, text: text, ...rest }, index ? String(index) : '')) : null;
-    };
-    const DEFAULT_ICON_W = 24;
-    const getIconVersion = (icon, version = 'secondary') => {
-        const iconVersionDefault = version === 'secondary' ? 'color' : 'white';
-        return icon?.iconVersion ? icon?.iconVersion : iconVersionDefault;
-    };
-    const renderButtonIcon = (icon) => isIcon(icon) ? (jsx(Img, { image: icon, width: String(icon?.size?.width || DEFAULT_ICON_W), height: String(DEFAULT_ICON_W) })) : null;
-
-    const headlineVersionStyles = {
-        XXL: {
-            title: { headingType: 'h0', as: 'h1' },
-            descriptionSize: 'text-h5',
-            descriptionWeight: 'font-normal',
-            descriptionStyle: 'mt-xl',
-        },
-        XL: {
-            title: { headingType: 'h1', as: 'h1' },
-            descriptionSize: 'text-xl',
-            descriptionWeight: 'font-light',
-            descriptionStyle: 'mt-m',
-        },
-        L: {
-            title: { headingType: 'h2', as: 'h2' },
-            descriptionSize: 'text-xl',
-            descriptionWeight: 'font-light',
-            descriptionStyle: 'mt-m',
-        },
-        M: {
-            title: { headingType: 'h3', as: 'h2' },
-            descriptionSize: 'text-xl',
-            descriptionWeight: 'font-light',
-            descriptionStyle: 'mt-s',
-        },
-        S: {
-            title: { headingType: 'h4', as: 'h2' },
-            descriptionSize: 'text-xl',
-            descriptionWeight: 'font-light',
-            descriptionStyle: 'mt-xs',
-        },
-        XS: {
-            title: { headingType: 'h5', as: 'h2' },
-            descriptionSize: 'text-m',
-            descriptionWeight: 'font-light',
-            descriptionStyle: 'mt-xs',
-        },
-    };
-
-    const Headline = JSX(({ className, version = '', headlineVersion = 'XL', title, description, align = 'text-center', as, isEmbedded = false, isTheme = false, ...rest }) => {
-        const versionStyle = headlineVersionStyles[headlineVersion];
-        const descriptionStyle = { marginTop: versionStyle.descriptionStyle };
-        return (jsxs(BlockWrapper, { className: style(isEmbedded ? '@container-normal' : '', className), defaultPadding: isEmbedded ? '' : 'p-6xl', version: version, isTheme: isTheme, ...rest, children: [title ? (jsx(Heading, { className: style('whitespace-pre-wrap', align), ...versionStyle?.title, as: as || versionStyle?.title.as, title: title })) : null, description ? (jsx(Paragraph, { size: versionStyle.descriptionSize, font: versionStyle.descriptionWeight, align: align, ...descriptionStyle, children: description })) : null] }));
-    });
-
     const Bonus = JSX(({ className = '', title, description, bonusItems = [], align = AlignStyles, ...rest }) => (jsx(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: jsxs("div", { className: "container", children: [jsx(Headline, { className: "mb-xl", isEmbedded: true, title: title, description: description, headlineVersion: "M", align: align }), jsx("div", { className: "flex flex-wrap gap-3xl gap-x-m w-full", children: bonusItems.length > 0
                         ? bonusItems.map((_, i) => (jsxs("div", { className: "w-full @xl:w-[48%] sm:space-y-xs flex flex-col grow p-xl sm:p-m border border-gray", children: [jsx("div", { className: "grow", children: jsx(Headline, { title: _?.title, description: _?.description, headlineVersion: "S", isEmbedded: true, align: "text-left" }) }), jsxs("div", { className: "flex justify-center sm:justify-between sm:items-end", children: [jsx("div", { className: "hidden sm:block", children: renderButtonsSection(_?.buttons) }), _.bonusItemContent?.bonusType
                                             ? renderBonusItemContent(_.bonusItemContent)
@@ -2783,10 +2897,6 @@
             : null;
     }
 
-    const getBorderStyle = (showBorder) => showBorder
-        ? 'border border-solid border-gray group-data-secondary:border-white/50 group-data-gray:border-main-divider'
-        : '';
-
     const renderCardHighlight = ({ className, text = 'ХИТ' } = {}) => (jsxs("div", { className: style('w-14 h-14 bg-white flex flex-col items-center justify-center rounded-md shadow-main-black', className), children: [jsx(Icon, { iconVersion: "black", name: "HeartIcon", width: "24", height: "24" }), jsx(Paragraph, { size: "text-s", font: "font-normal", align: "text-center", color: "text-primary-text", children: text })] }));
 
     const cardBaseStyle = 'relative h-full';
@@ -2815,7 +2925,7 @@
     };
     const cardWrapperStyle = (_, { someCardsHighlighted }) => style(cardBaseStyle, someCardsHighlighted && (isCardHighlighted(_) ? 'pt-3xl' : 'pt-3xl sm:pt-16'));
     const cardStyle = (_, { someCardsHighlighted, showBorder, cardSize = 'normal', }) => style(cardBaseStyle, 'min-w-80', CARD_SIZE_MAP[cardSize], // TODO fix для RecommendationCard
-    someCardsHighlighted && (isCardHighlighted(_) ? 'pt-3xl sm:pt-16' : 'pt-3xl'), getBorderStyle(showBorder), showBorder && 'h-full');
+    someCardsHighlighted && (isCardHighlighted(_) ? 'pt-3xl sm:pt-16' : 'pt-3xl'), getBorderStyle$1(showBorder), showBorder && 'h-full');
     const isCardHighlighted = (_) => _?.content && 'isHighlighting' in _.content && _.content.isHighlighting;
 
     const VISIBLE_ITEM_COUNT = 1;
@@ -2870,39 +2980,6 @@
                             isVertical: true,
                         })] })] }) })));
 
-    function renderBackwardButton(version, handleClick) {
-        const iconVersion = version === 'primary' ? 'white' : 'black';
-        const className = 'w-12 h-12 min-h-12 min-w-12 flex items-center justify-center';
-        const text = 'Вернуться назад';
-        return (jsxs("div", { className: "hidden sm:flex items-center gap-s", children: [jsx("div", { className: getRegularButtonClasses({ className, version, rounded: true }), onClick: handleClick, children: jsx(Img, { className: "w-4 h-4", image: {
-                            icon: 'ArrowLeftIcon',
-                            iconVersion: iconVersion,
-                        } }) }), jsx(Button, { version: "link", className: "group-data-secondary:text-white/80", text: text, ariaLabel: text, onClick: handleClick })] }));
-    }
-
-    const imageAlignmentMap = {
-        start: '@xl:self-start',
-        center: '@xl:self-center',
-        end: '@xl:self-end',
-    };
-    const BaseTile = JSX(({ className, version = 'primary', defaultPadding, padding, title = '', insetTitle = '', buttons, leftImage, rightImage, imageAlign, isImageAlwaysOnRight = false, isImageSecondary = false, backwardButton, children, }) => {
-        const router = useRouter();
-        const handleClick = useCallback((ev) => {
-            ev?.preventDefault();
-            router.back();
-        }, []);
-        return (jsxs("div", { className: getStyle(padding, defaultPadding, className), children: [backwardButton ? renderBackwardButton(version, handleClick) : null, title ? jsx("div", { className: "relative", children: title }) : null, jsxs("div", { className: style('grow relative flex flex-col @xl:flex-row gap-3xl w-full', leftImage ? 'self-start @xl:w-auto' : ''), children: [renderImageContainer(leftImage, { imageAlign, className: 'mx-auto' }), jsxs("div", { className: style('grid gap-3xl h-full', rightImage ? '@xl:grid-cols-2' : '', leftImage ? '' : 'grow'), children: [jsxs("div", { className: "grow space-y-lg min-w-fit", children: [insetTitle, children] }), renderImageContainer(rightImage, {
-                                    className: style('@xl:justify-self-end @xl:col-start-2', buttons ? rowSpanStyle(isImageAlwaysOnRight) : '', positionStyle(isImageAlwaysOnRight), imageSecondaryStyle(isImageSecondary)),
-                                    imageAlign,
-                                }), renderButtons(buttons)] })] })] }));
-    });
-    const getStyle = (padding = '', defaultPadding = '', className = '') => style('relative flex flex-col gap-3xl overflow-hidden', padding || defaultPadding, className);
-    const rowSpanStyle = (isImageAlwaysOnRight) => isImageAlwaysOnRight ? 'row-span-2' : '@xl:row-span-2';
-    const positionStyle = (isImageAlwaysOnRight) => isImageAlwaysOnRight ? 'col-start-2 self-center' : '';
-    const renderButtons = (buttons) => buttons ? jsx("div", { className: "self-end", children: buttons }) : null;
-    const renderImageContainer = (image, { className, imageAlign }) => image ? (jsx("div", { className: style('shrink-1/2 justify-self-center', imageAlign && imageAlignmentMap[imageAlign], className), children: image })) : null;
-    const imageSecondaryStyle = (isImageSecondary) => isImageSecondary ? 'hidden @xl:block' : '';
-
     const cardStyleMap = {
         black: 'bg-black',
         white: 'bg-white',
@@ -2936,64 +3013,6 @@
                     .map((link, index) => (jsx(CarouselLinkButton, { ...link }, String(index)))) }, String(groupIndex)))) }));
     };
 
-    const sum = (list = []) => list.reduce((a, b) => a + b, 0);
-
-    const avg = (items = []) => (items?.length ? sum(items) / items.length : 0);
-
-    const deviation = (items) => items?.length ? Math.sqrt(Math.abs(avg(items.map((_) => _ ** 2)) - avg(items) ** 2)) : 0;
-
-    const renderBenefitIcon = (icon, benefitsVersion = 'normal') => icon ? (jsx("div", { className: style('sm:w-12 sm:h-12 sm:min-w-12 w-11 h-11 min-w-11 box-border flex items-center justify-center rounded-icon', benefitsVersion === 'normal'
-            ? 'bg-secondary-light text-primary-main'
-            : 'bg-primary-main text-black group-data-secondary:bg-white/30 group-data-secondary:text-black'), children: jsx(Img, { className: "w-6 h-6", image: { ...icon, iconVersion: icon.iconVersion || benefitsVersion } }) })) : null;
-
-    const getHtmlText = (html) => html.replace(/<\/?[^>]+\/?>/g, '').trim();
-
-    const RichText = JSX((props) => {
-        const { __html = '', richVersion = '' } = props;
-        return getHtmlText(__html) ? (jsx("div", { className: style(richVersion, 'md-container'), dangerouslySetInnerHTML: { __html } })) : null;
-    });
-
-    const renderBenefitDescription = (description, i) => description ? (jsx(Paragraph, { font: "font-light", size: "text-m", color: "text-secondary-text group-data-secondary:text-white", children: description }, `description-${i}`)) : null;
-
-    const renderBenefitLabel = (label, i) => label ? (jsx(Text, { color: "text-primary-text group-data-secondary:text-white", size: "text-h6", children: label }, `label-${i}`)) : null;
-
-    const renderBenefitText = (_, i) => _.type === 'rte' && '__html' in _ && _.__html ? (jsx(RichText, { ..._ }, `rte-${i}`)) : ([
-        'label' in _ ? renderBenefitLabel(_.label, i) : null,
-        'description' in _ ? (jsx("span", { className: _.descriptionClassName, children: renderBenefitDescription(_.description, i) }, String(i))) : null,
-    ]);
-
-    const BenefitItem = JSX(({ className, benefitsVersion, ..._ }) => (jsxs("div", { className: style('flex gap-m min-w-56 items-center', className), children: ['icon' in _ ? renderBenefitIcon(_.icon, benefitsVersion) : null, jsx("div", { children: renderBenefitText(_) })] })));
-
-    const MAX_BENEFITS_LEN_DEVIATION = 16;
-    const benefitLength = (_) => _.type === 'rte'
-        ? _?.__html?.length || 0
-        : Math.max(_?.label?.length || 0, _?.description?.length || 0);
-    const isDistortedBenefits = (benefits) => deviation(benefits.map(benefitLength)) > MAX_BENEFITS_LEN_DEVIATION;
-    const hasIcon = (_) => _ && 'icon' in _ && _.icon && (_.icon.icon || _.icon.src);
-    const isTextualBenefits = (benefits) => !benefits.some(hasIcon);
-    const DefaultBenefitsList = JSX(({ className, benefitsVersion = 'normal', benefits }) => benefits?.length ? (jsx("div", { className: style('flex gap-x-m gap-y-s', isDistortedBenefits(benefits) || isTextualBenefits(benefits) ? 'flex-col' : 'flex-wrap', className), children: benefits.map((_, i) => (jsx(BenefitItem, { benefitsVersion: benefitsVersion, ..._ }, String(i)))) })) : null);
-
-    const TabularBenefitsList = JSX(({ className, benefits }) => benefits?.length ? (jsx("div", { className: style('grid grid-cols-[max-content_1fr] auto-rows-auto items-baseline gap-x-m gap-y-xs', className), children: benefits.flatMap(renderBenefitText) })) : null);
-
-    const BenefitsList = JSX(({ isTabularBenefits, ...rest }) => isTabularBenefits ? jsx(TabularBenefitsList, { ...rest }) : jsx(DefaultBenefitsList, { ...rest }));
-
-    const PriceList = JSX(({ priceList }) => priceList?.length ? (jsx("div", { className: "flex flex-wrap xl:flex-nowrap xl:bg-main-divider xl:rounded-md p-xs gap-xl", children: priceList.map(renderPriceListItem) })) : null);
-    const renderPriceListItem = ({ label, amount }) => (jsxs("div", { className: "basis-full flex flex-col-reverse sm:flex-row sm:justify-between sm:bg-main-divider sm:py-m sm:px-lg sm:rounded-md items-baseline whitespace-pre", children: [jsx(Text, { font: "font-light", size: "text-l", color: "text-secondary-text", children: label }), amount ? (jsxs("span", { className: "font-sans text-h6 sm:text-primary-main text-primary-text", children: [toLocalNumberFormat(2)(amount), " \u20BD"] })) : null] }));
-
-    const Tags = JSX(({ className, tags }) => tags?.length ? (jsx("div", { className: style('flex flex-wrap gap-xs', className), role: "list", children: tags.map(renderTag) })) : null);
-    const renderTag = (tag, key) => (jsx("div", { className: "p-xs border-solid border rounded-md border-gray", role: "listitem", children: jsx(Text, { size: "text-m", font: "font-light", children: tag }) }, String(key)));
-
-    const BaseProductTile = JSX(
-    // eslint-disable-next-line max-lines-per-function
-    ({ className, padding, defaultPadding, title, description, headlineVersion = 'L', align = 'text-left', benefitsVersion, isTabularBenefits, benefits, __html, isFullWidthTitle, items, isDotted = true, priceList = [], listItemSize, tags = [], buttons, image, imageOptions: { imageAlign = 'center', directionRight = true, isImageAlwaysOnRight, isImageSecondary = false, } = {}, backwardButton, children, ...rest }) => {
-        const img = image?.src ? jsx(Img, { image: image }) : null;
-        const headline = (jsx(Headline, { title: title, description: description, headlineVersion: headlineVersion, align: align, isEmbedded: true }));
-        const filteredBenefits = benefits?.filter((_) => _?.type === 'rte' || 'label' in _ || 'description' in _);
-        return (jsx(BaseTile, { className: className, padding: padding, defaultPadding: defaultPadding, ...(isFullWidthTitle ? { title: headline } : { insetTitle: headline }), ...leftOrRightImage(img, directionRight), isImageSecondary: isImageSecondary, imageAlign: imageAlign, isImageAlwaysOnRight: isImageAlwaysOnRight, buttons: renderButtonsSection(buttons), backwardButton: backwardButton, ...rest, children: jsxs("div", { className: "flex flex-col sm:gap-xl gap-4xl", children: [filteredBenefits?.length ? (jsx(BenefitsList, { benefitsVersion: benefitsVersion, isTabularBenefits: isTabularBenefits, benefits: filteredBenefits })) : null, __html ? jsx(RichText, { __html: __html }) : null, items?.length ? (jsx(List, { items: items, isDotted: isDotted, listItemSize: listItemSize })) : null, children, priceList?.length ? jsx(PriceList, { priceList: priceList }) : null, renderTags(tags)] }) }));
-    });
-    const leftOrRightImage = (img, directionRight) => directionRight ? { rightImage: img } : { leftImage: img };
-    const renderTags = (tags) => (tags?.length ? jsx(Tags, { tags: tags }) : null);
-
     const LinkWrapper = JSX(({ className = '', href, target, isRemote = false, children }) => {
         const link = useLink({ isRemote });
         const linkProps = link({ href, target });
@@ -3146,7 +3165,7 @@
     const TableCell = JSX(({ cell, isFirstRow, isLastRow, isFillGradient }) => {
         const cellWrapperStyle = style('w-80 box-border flex flex-col', borderStyle, !isLastRow ? 'border-y-0' : 'border-t-0 rounded-b-md', isFillGradient ? gradientStyle : '');
         const cellStyle = style('mx-2xl h-full', dividerStyle$1, isFillGradient && isFirstRow ? 'border-t' : '', !isLastRow ? 'border-solid' : 'border-b-0');
-        return (jsx("div", { className: cellWrapperStyle, role: "cell", children: jsx("div", { className: cellStyle, children: cell.map((item, i) => renderCellInner(item, i, isFillGradient)) }) }));
+        return (jsx("div", { className: cellWrapperStyle, role: "cell", children: jsx("div", { className: cellStyle, children: cell ? cell.map((item, i) => renderCellInner(item, i, isFillGradient)) : null }) }));
     });
     const labelStyle = (isFillGradient = false) => `text-xl m-0 ${isFillGradient ? 'text-white' : ''}`;
     const descriptionStyle = (isFillGradient = false) => `text-s opacity-80 ${isFillGradient ? 'text-white' : 'text-secondary-text'}`;
@@ -3197,6 +3216,8 @@
     const renderBlocks = (info) => (jsx("div", { className: "flex gap-5xl grow basis-0", children: info.map((column, index) => renderBlocksColumn({ column, index })) }));
     const renderBlocksColumn = ({ column, index }) => column ? (jsx("div", { className: "flex flex-col gap-xl grow basis-0", children: column.map(({ title = '', description, additionalDescription, button }, key) => (jsxs("div", { children: [jsx(Headline, { title: title, description: description, headlineVersion: "XS", align: "text-left", isEmbedded: true }), additionalDescription ? (jsx("div", { className: "mt-xs opacity-80", children: jsx(Paragraph, { size: "text-m", font: "font-light", children: additionalDescription }) })) : null, button?.href ? jsx(Button, { className: "mt-xl", ...button }) : null] }, String(key)))) }, `col-${String(index)}`)) : null;
 
+    const isOdd = (n) => n % 2 !== 0;
+
     const TextWithIcon = JSX(({ textNode, iconNode, tag, onClick, justifyContent = 'between', className, ...rest }) => {
         const Tag = tag;
         return (jsxs(Tag, { tag: tag, className: style('flex items-center w-full gap-1', justifyContent === 'between' ? 'justify-between' : 'justify-center', className), onClick: onClick, ...rest, children: [textNode ? jsx("div", { children: textNode }) : null, iconNode ? jsx("div", { children: iconNode }) : null] }));
@@ -3222,8 +3243,8 @@
         const [visibleBlocks, hiddenBlocks] = topItemsCount > 0
             ? [blocksToRender.slice(0, topItemsCount), blocksToRender.slice(topItemsCount)]
             : [blocksToRender, []];
-        return (jsxs("div", { children: [jsx("div", { className: style(blocksToRender.length ? 'hidden' : 'block'), children: notFound ? jsx(NotFound, { ...notFound }) : null }), jsxs("div", { className: style('space-y-2xs', blocksToRender.length ? '' : 'hidden'), children: [jsx("div", { className: style(resultsGridStyle), children: renderBlocksList(visibleBlocks, { ...rest.options, parent: block }) }), jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => {
-                                return (jsx(FoldableSection, { className: style(resultsGridStyle), isUnfolded: isUnfolded, children: renderBlocksList(hiddenBlocks, { ...rest.options, parent: block }) }));
+        return (jsxs("div", { children: [jsx("div", { className: style(blocksToRender.length ? 'hidden' : 'block'), children: notFound ? jsx(NotFound, { ...notFound }) : null }), jsxs("div", { className: style('space-y-2xs', blocksToRender.length ? '' : 'hidden'), children: [jsxs("div", { className: style(resultsGridStyle), children: [renderBlocksList(visibleBlocks, { ...rest.options, parent: block }), isOdd(visibleBlocks.length) ? jsx(AdTile, { className: "col-span-6" }) : null] }), jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => {
+                                return (jsxs(FoldableSection, { className: style(resultsGridStyle), isUnfolded: isUnfolded, children: [renderBlocksList(hiddenBlocks, { ...rest.options, parent: block }), isOdd(hiddenBlocks.length) ? jsx(AdTile, { className: "col-span-6" }) : null] }));
                             }, renderFoldButton: ({ isUnfolded, onToggle }) => (jsx(DefaultFoldButton, { className: style(topItemsCount < 1 ? 'hidden' : ''), disabled: !hiddenBlocks?.length, label: label, icon: ICONS[Number(isUnfolded)], dataTheme: rest.options?.page?.colorPalette, onClick: onToggle })) })] })] }));
     });
 
@@ -4267,7 +4288,7 @@
     const HorizontalLayout = JSX(({ className = '', gap = 'XS', isPadding = false, version = 'transparent', isTheme = false, isCardBorder, ...rest }) => (jsx(BlockWrapper, { className: style('relative', 'grid grid-cols-12', gapStyles[gap], className), defaultPadding: isPadding ? 'p-6xl' : '', version: version, isTheme: isTheme, ...rest, children: renderChildren({
             ...rest,
             extraProps: {
-                className: getBorderStyle(isCardBorder),
+                className: getBorderStyle$1(isCardBorder),
             },
         }) })));
     HorizontalLayout.childrenTypes = {
@@ -4557,11 +4578,6 @@
     MortgageFiltration.childrenTypes = ['ProductTile'];
     MortgageFiltration.childSchema = (content) => content?.filtrationSchema || {};
 
-    const isSSR = () => Boolean(typeof globalThis.process === 'object' && globalThis.process && globalThis.process.version);
-
-    const isClient = !isSSR();
-    const ClientOnly = JSX(({ children }) => (isClient ? children : null));
-
     function renderClusterer(yandexMaps, map, points) {
         map.geoObjects.removeAll();
         const clusterIconContentLayout = yandexMaps.templateLayoutFactory.createClass('<div style="margin-top: -3px;">{{properties.geoObjects.length}}</div>');
@@ -4982,8 +4998,6 @@
     const renderShimmerItem = (width, index) => (jsx("div", { style: { width: `${width || 100}%` }, className: "h-4 mt-xs bg-secondary-light" }, String(index)));
     const goldenSequence = (first, size) => [first].concat(size > 0 ? goldenSequence(first / GOLDEN_RATIO, size - 1) : []);
 
-    const ProductBlock = JSX(({ className, padding, showBorder, ...rest }) => (jsx(BlockWrapper, { className: style('overflow-hidden flex flex-col gap-3xl box-border', getBorderStyle(showBorder), className), padding: "p-0", ...rest, children: jsx(BaseProductTile, { defaultPadding: "p-6xl", padding: padding, className: "grow h-full", ...rest }) })));
-
     const ProductGallery = JSX(({ className = '', padding, slides = [], ...rest }) => {
         const [activeSlideIndex, setActiveSlideIndex] = useState(0);
         return (jsxs(BlockWrapper, { className: style('box-border overflow-hidden', className), defaultPadding: "py-6xl", padding: padding, ...rest, children: [jsx("div", { className: "flex duration-1000", style: { transform: `translateX(-${activeSlideIndex * 100}%)` }, role: "list", children: slides.map(({ productBlock }, i) => (jsx("div", { className: "box-border grow-0 shrink-0 basis-full", role: "listitem", children: jsx(BaseProductTile, { className: "pl-6xl h-full", headlineVersion: "M", isFullWidthTitle: false, ...productBlock, ...rest }) }, String(i)))) }), jsx("div", { className: "h-28 px-xs mt-m -mb-m flex gap-xs box-border", children: slides.map(renderNavButton({ activeSlideIndex, onClick: setActiveSlideIndex })) })] }));
@@ -5507,7 +5521,7 @@
     const VerticalLayout = JSX(({ className = '', gap = '', isPadding = false, isInnerPadding = true, version = 'transparent', isTheme = false, isInnerBorder = false, ...rest }) => (jsx(BlockWrapper, { className: style('relative flex flex-col', gapStyles[gap], className), defaultPadding: isPadding ? 'p-6xl' : '', version: version, isTheme: isTheme, ...rest, children: renderChildren({
             ...rest,
             extraProps: {
-                className: style('w-full', getBorderStyle(isInnerBorder)),
+                className: style('w-full', getBorderStyle$1(isInnerBorder)),
                 padding: isInnerPadding ? '' : 'p-0',
             },
         }) })));
@@ -5528,6 +5542,7 @@
     });
 
     const Blocks = {
+        AdTile,
         ApplicationForm,
         BenefitsBlock,
         Bonus,
@@ -5545,8 +5560,8 @@
         CarouselTariffsCard,
         ComparisonTable,
         ContactsBlock,
-        Depository,
         DepositFiltration,
+        Depository,
         ErrorBlock,
         ExchangeRateTile,
         Footer,
@@ -5570,8 +5585,8 @@
         RollupItem,
         SafeDepositRental,
         StepsBlock,
-        SwipeListControlBlock,
         StickyBottomMenu,
+        SwipeListControlBlock,
         Tabs,
         TariffsTable,
         TextBlock,
@@ -5810,7 +5825,7 @@
         return (jsx("div", { className: "flex items-end absolute bottom-0 right-0 h-full pointer-events-none", children: jsx(LikeControl, { className: "rounded-tl-3xl sticky bottom-0 pointer-events-auto" }) }));
     }
 
-    const packageVersion = "0.14.56";
+    const packageVersion = "0.14.58";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;