@redneckz/wildless-cms-uni-blocks 0.14.292 → 0.14.294

package/bundle/bundle.umd.js

@@ -468,6 +468,9 @@
     }
 
     const getAspectsAttributes = (data) => {
+        if (!Array.isArray(data) || !data.length) {
+            return {};
+        }
         try {
             return {
                 'data-aspects': JSON.stringify(data),
@@ -1904,110 +1907,11 @@
         return (jsx(BlockWrapper, { className: className, defaultPadding: "p-6xl", ...rest, children: jsxs("div", { className: "container max-w-[978px] space-y-m", children: [title ? jsx(Heading, { headingType: "h3", title: title, className: "@xl:text-center" }) : null, regions ? (jsx(SelectControl, { label: "\u0412\u0430\u0448 \u0440\u0435\u0433\u0438\u043E\u043D", placeholder: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0440\u0435\u0433\u0438\u043E\u043D", isSearch: true, options: regions.map(({ name = '' }) => ({ key: name, text: name })), value: region, onChange: setRegion })) : null, regionHref ? (jsx("div", { className: "text-center", children: jsx(LinkButton, { href: regionHref, target: "_blank", className: style('p-m w-full @xl:w-auto', buttonStyle), data: data, children: buttonText }) })) : null] }) }));
     });
 
-    const joinList = (sep) => (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: `sep-${i}` }, el) : [el]), []);
-
-    const SlideCheckboxGroup = JSX(({ value, onChange, items = [], multiple }) => {
-        const handleChange = (newValue) => {
-            if (!onChange) {
-                return;
-            }
-            const hasAlready = value?.includes(newValue);
-            if (multiple) {
-                onChange(hasAlready ? (value || []).filter((v) => v !== newValue) : [...(value || []), newValue]);
-            }
-            else {
-                onChange(hasAlready ? [] : [newValue]);
-            }
-        };
-        return items.map((item) => (jsx(SlideCheckbox, { text: item?.title, value: [value].flatMap((_) => _).includes(item.value), onChange: () => handleChange(item.value), type: multiple ? 'checkbox' : 'radio' }, item.value)));
-    });
-
-    const FiltrationForm = JSX(({ children, filtrationSchema, resetButton, field, reset }) => (jsxs("form", { className: "flex flex-col @4xl:flex-row justify-between bg-white p-4xl gap-s @4xl:gap-0", children: [jsxs("div", { className: "flex flex-col @4xl:flex-row gap-xl", children: [children, joinList(jsx("div", { className: "h-full w-px bg-gray" }))(
-                    // TS can't correctly refine array's type after filter
-                    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-                    Object.entries(filtrationSchema).map(renderFormItem(field)).filter(Boolean))] }), resetButton ? (jsx("div", { children: jsx(Button, { type: "reset", className: "w-full @4xl:w-56 @4xl:ml-s", onClick: reset, children: resetButton?.text }) })) : null] })));
-    const renderFormItem = (field) => ([key, item]) => {
-        const type = item?.type;
-        switch (type) {
-            case 'array':
-                return renderArrayFormItem(key, field)(item);
-            default:
-                return null;
-        }
-    };
-    const renderArrayFormItem = (key, field) => (item) => item?.ui !== 'dropdown' ? renderCheckboxes(key, field)(item) : null;
-    const renderCheckboxes = (key, field) => (item) => {
-        const options = item?.items?.enum?.map((e, i) => ({ value: e, title: item?.items?.enumNames?.[i] || '' })) ||
-            [];
-        return (jsxs("div", { className: "flex-1", children: [item?.title ? (jsx("div", { className: "mb-m", children: jsx(Text, { size: "text-m", font: "font-medium", color: "text-primary-text", children: item.title }) })) : null, jsx(SlideCheckboxGroup, { items: options, multiple: !item?.single, ...field(key) })] }, key));
-    };
-
-    function zip(firstCol, ...restCols) {
-        return firstCol.map((firstEl, rowIndex) => [firstEl, ...restCols.map((col) => col[rowIndex])]);
-    }
-
-    const isEmpty = (v) => v === null ||
-        v === undefined ||
-        v === '' ||
-        (Array.isArray(v) && v.length === 0) ||
-        (typeof v === 'object' && Object.keys(v).length === 0);
-
-    const isSingularFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) || isEmpty(target[key]) || pattern[key] === target[key];
-    const isMultipleFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) ||
-        isEmpty(target[key]) ||
-        pattern[key]?.every((_) => target[key]?.includes(_));
-    const isNumberFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) ||
-        isEmpty(target[key]) ||
-        naturalNumber(pattern[key]) <= naturalNumber(target[key]);
-    const isMultipleNumberFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) || isEmpty(target[key]) || target[key]?.includes(pattern[key]);
-    const isValueInRange = (key, pattern) => (target) => isEmpty(pattern[key]) ||
-        isEmpty(target[key]) ||
-        (naturalNumber(pattern[key]?.min) >= naturalNumber(target[key]?.min) &&
-            naturalNumber(pattern[key]?.min) <= naturalNumber(target[key]?.max));
-    const targetMatchPattern = (pattern, target) => Object.entries(pattern)
-        .map(([key, subPattern]) => {
-        if (typeof subPattern === 'number') {
-            return Array.isArray(target[key])
-                ? isMultipleNumberFieldMatch(key, pattern)
-                : isNumberFieldMatch(key, pattern);
-        }
-        if (typeof subPattern === 'object' && 'min' in subPattern && 'max' in subPattern) {
-            return isValueInRange(key, pattern);
-        }
-        return Array.isArray(subPattern)
-            ? isMultipleFieldMatch(key, pattern)
-            : isSingularFieldMatch(key, pattern);
-    })
-        .every((predicate) => predicate(target));
-    const naturalNumber = (n) => Number(n || 0);
-
-    const filterBlocks = (blocksWithProps, filtrationState) => (normalize = identity) => blocksWithProps
-        ?.filter(([, content]) => targetMatchPattern(filtrationState, normalize(content) || {}))
-        .map(([block]) => block);
-
-    const useFiltrationForm = (initialFormState, { block, page, normalize = identity, }) => {
-        const blocks = block?.blocks || [];
-        const [filtrationState, { field, reset, update: replaceFiltrationState }] = useForm(initialFormState);
-        const blocksWithProps = useMemo(() => zip(blocks, blocks.map((b) => resolveBlockProps(b.content, page?.fallback))), [blocks, page?.fallback]);
-        const blocksToRender = filtrationState === initialFormState
-            ? blocks
-            : filterBlocks(blocksWithProps, filtrationState)(normalize);
-        return [
-            filtrationState,
-            { blocksToRender, blocksWithProps },
-            { field, reset, update: replaceFiltrationState },
-        ];
-    };
-
     /** @deprecated */
     const AlignStyles = 'text-center';
 
     const NotFound = JSX(({ title, description }) => (jsxs("div", { className: "bg-white p-6xl py-20 flex gap-s flex-col @xl:items-center", children: [jsx(Img, { image: { icon: 'MagnifierIcon', iconVersion: 'normal' }, width: "120", height: "120" }), jsx(Headline, { title: title, description: description, headlineVersion: "S", isEmbedded: true, align: AlignStyles })] })));
 
-    const getBorderStyle = (showBorder = false) => showBorder
-        ? 'border border-solid border-gray group-data-secondary:border-white/50 group-data-gray:border-main-divider'
-        : '';
-
     const useCarouselControls = (props, initialIndex = 0) => {
         const { itemCount, visibleItemCount } = props;
         const [activeIndex, setActiveIndex] = useState(initialIndex);
@@ -2259,6 +2163,10 @@
 
     const ITEMS_GAP = 16;
 
+    const getBorderStyle = (showBorder = false) => 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';
@@ -2322,31 +2230,191 @@
         }),
     });
 
+    const renderCarouselBlocks = ({ blocksToRender, ...rest }) => (jsx(Carousel, { padding: "p-0", isEmbedded: true, itemCount: blocksToRender?.length, visibleItemCount: 0, isAlignCenter: true, isGap: false, children: renderBlocksList(blocksToRender, {
+            ...rest.options,
+            parent: rest.block,
+            renderProps: (block, options, i) => (jsx("div", { className: style('relative min-w-80', getBorderStyle(true)), children: renderBlock$1(block, options) }, String(i))),
+        }) }));
+
+    const isOdd = (n) => n % 2 !== 0;
+
+    const TextWithIcon = JSX(({ textNode, iconNode, tag, onClick, justifyContent = 'between', className, role, ...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, role: role, ...rest, children: [textNode ? jsx("div", { children: textNode }) : null, iconNode ? jsx("div", { children: iconNode }) : null] }));
+    });
+
+    const DefaultFoldButton = JSX(({ className = '', label, icon, dataTheme = '', disabled = false, onClick }) => (jsx(TextWithIcon, { tag: "button", onClick: onClick, disabled: disabled, "data-theme": dataTheme, justifyContent: "center", role: "button", className: style('py-4 border border-transparent outline-none focus:border-primary-text space-x-s', disabled
+            ? 'bg-main-divider text-main-disabled hover:bg-main-divider'
+            : 'bg-primary-main text-white hover:bg-primary-hove', className), textNode: jsx(Text, { size: "text-h4", children: label }), iconNode: icon ? (jsx(Img, { image: {
+                icon,
+                iconVersion: 'white',
+            }, className: "my-auto", width: "20", height: "20" })) : null })));
+    const renderDefaultFoldButton = ({ isUnfolded, onToggle }) => {
+        const labels = ['Развернуть', 'Скрыть'];
+        const icons = ['ArrowDownIcon', 'ArrowUpIcon'];
+        return (jsx(DefaultFoldButton, { icon: icons[Number(isUnfolded)], label: labels[Number(isUnfolded)], onClick: onToggle }));
+    };
+
+    const Foldable = JSX(({ className = '', isFoldButtonOnTop = false, unfoldedByDefault = false, renderFoldableSection, renderFoldButton, }) => {
+        const [isUnfolded, setIsUnfolded] = useState(unfoldedByDefault);
+        const onToggle = useCallback(() => {
+            setIsUnfolded((_) => !_);
+        }, []);
+        const sectionNode = renderFoldableSection({ isUnfolded, onToggle });
+        const buttonNode = renderFoldButton ? renderFoldButton({ isUnfolded, onToggle }) : null;
+        return isFoldButtonOnTop ? (jsxs("div", { className: className, role: "group", children: [buttonNode, sectionNode] })) : (jsxs("div", { className: className, role: "group", children: [sectionNode, buttonNode] }));
+    });
+
+    function useResizeObserver(callback, deps) {
+        const ref = useRef(null);
+        useEffect(() => {
+            const element = ref?.current;
+            if (!element) {
+                return undefined;
+            }
+            const observer = new ResizeObserver((entries) => {
+                callback(element, entries[0]);
+            });
+            observer.observe(element);
+            return () => {
+                observer.disconnect();
+            };
+        }, [callback, ...deps]);
+        return ref;
+    }
+
+    const FoldableSection = JSX(({ className = '', isUnfolded, children }) => {
+        const containerRef = useRef(null);
+        const childrenWrapperRef = useResizeObserver((childrenWrapperEl) => {
+            if (containerRef.current) {
+                containerRef.current.style.maxHeight = isUnfolded
+                    ? `${childrenWrapperEl.scrollHeight}px`
+                    : '';
+            }
+        }, [isUnfolded]);
+        return (jsx("div", { ref: containerRef, className: `transition-max-h duration-300 overflow-hidden ${containerRef.current || !isUnfolded ? 'max-h-0' : ''} `, children: jsx("div", { className: className, ref: childrenWrapperRef, children: children }) }));
+    });
+
+    const ICONS$1 = ['ArrowDownIcon', 'ArrowUpIcon'];
+    const resultsGridStyle = 'space-y-px lg:space-y-0 lg:grid lg:grid-cols-12 gap-2xs';
+    const renderGridBlocks = ({ topItemsCount = 0, label = '', block, blocksToRender = [], ...rest }) => {
+        const [visibleBlocks, hiddenBlocks] = topItemsCount > 0
+            ? [blocksToRender.slice(0, topItemsCount), blocksToRender.slice(topItemsCount)]
+            : [blocksToRender, []];
+        return (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", ...rest }) : null] }), jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (jsxs(FoldableSection, { className: style(resultsGridStyle), isUnfolded: isUnfolded, children: [renderBlocksList(hiddenBlocks, { ...rest.options, parent: block }), isOdd(hiddenBlocks.length) ? jsx(AdTile, { className: "col-span-6", ...rest }) : null] })), renderFoldButton: ({ isUnfolded, onToggle }) => (jsx(DefaultFoldButton, { className: style(topItemsCount < 1 ? 'hidden' : ''), disabled: !hiddenBlocks?.length, label: label, icon: ICONS$1[Number(isUnfolded)], dataTheme: rest.options?.page?.colorPalette, onClick: onToggle })) })] }));
+    };
+
+    const FilteredBlocks = JSX(({ blocksSection, blocksToRender = [], notFound, ...rest }) => {
+        switch (blocksSection?.view) {
+            case 'grid':
+                return (jsxs("div", { children: [renderNotFound(notFound, blocksToRender), renderGridBlocks({ ...blocksSection, ...rest, blocksToRender })] }));
+            case 'carousel':
+                return (jsxs("div", { children: [renderNotFound(notFound, blocksToRender), renderCarouselBlocks({ ...rest, blocksToRender })] }));
+            default:
+                return null;
+        }
+    });
+    const renderNotFound = (notFound, blocksToRender) => notFound && !blocksToRender.length ? jsx(NotFound, { ...notFound }) : null;
+
+    const joinList = (sep) => (list) => list.reduce((acc, el, i) => (acc.length ? acc.concat({ ...sep, key: `sep-${i}` }, el) : [el]), []);
+
+    const SlideCheckboxGroup = JSX(({ value, onChange, items = [], multiple }) => {
+        const handleChange = (newValue) => {
+            if (!onChange) {
+                return;
+            }
+            const hasAlready = value?.includes(newValue);
+            if (multiple) {
+                onChange(hasAlready ? (value || []).filter((v) => v !== newValue) : [...(value || []), newValue]);
+            }
+            else {
+                onChange(hasAlready ? [] : [newValue]);
+            }
+        };
+        return items.map((item) => (jsx(SlideCheckbox, { text: item?.title, value: [value].flatMap((_) => _).includes(item.value), onChange: () => handleChange(item.value), type: multiple ? 'checkbox' : 'radio' }, item.value)));
+    });
+
+    const FiltrationForm = JSX(({ children, filtrationSchema, resetButton, field, reset }) => (jsxs("form", { className: "flex flex-col @4xl:flex-row justify-between bg-white p-4xl gap-s @4xl:gap-0", children: [jsxs("div", { className: "flex flex-col @4xl:flex-row gap-xl", children: [children, joinList((jsx("div", { className: "h-full w-px bg-gray" })))(Object.entries(filtrationSchema).map(renderFormItem(field)).filter(Boolean))] }), resetButton ? (jsx("div", { children: jsx(Button, { type: "reset", className: "w-full @4xl:w-56 @4xl:ml-s", onClick: reset, children: resetButton?.text }) })) : null] })));
+    const renderFormItem = (field) => ([key, item]) => {
+        const type = item?.type;
+        switch (type) {
+            case 'array':
+                return renderCheckboxes(key, field)(item);
+            default:
+                return null;
+        }
+    };
+    const renderCheckboxes = (key, field) => (item) => {
+        const options = item?.items?.enum?.map((e, i) => ({ value: e, title: item?.items?.enumNames?.[i] || '' })) ||
+            [];
+        return (jsxs("div", { className: "flex-1", children: [item?.title ? (jsx("div", { className: "mb-m", children: jsx(Text, { size: "text-m", font: "font-medium", color: "text-primary-text", children: item.title }) })) : null, jsx(SlideCheckboxGroup, { items: options, multiple: !item?.single, ...field(key) })] }, key));
+    };
+
+    function zip(firstCol, ...restCols) {
+        return firstCol.map((firstEl, rowIndex) => [firstEl, ...restCols.map((col) => col[rowIndex])]);
+    }
+
+    const isEmpty = (v) => v === null ||
+        v === undefined ||
+        v === '' ||
+        (Array.isArray(v) && v.length === 0) ||
+        (typeof v === 'object' && Object.keys(v).length === 0);
+
+    const isSingularFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) || isEmpty(target[key]) || pattern[key] === target[key];
+    const isMultipleFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) ||
+        isEmpty(target[key]) ||
+        pattern[key]?.every((_) => target[key]?.includes(_));
+    const isNumberFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) ||
+        isEmpty(target[key]) ||
+        naturalNumber(pattern[key]) <= naturalNumber(target[key]);
+    const isMultipleNumberFieldMatch = (key, pattern) => (target) => isEmpty(pattern[key]) || isEmpty(target[key]) || target[key]?.includes(pattern[key]);
+    const isValueInRange = (key, pattern) => (target) => isEmpty(pattern[key]) ||
+        isEmpty(target[key]) ||
+        (naturalNumber(pattern[key]?.min) >= naturalNumber(target[key]?.min) &&
+            naturalNumber(pattern[key]?.min) <= naturalNumber(target[key]?.max));
+    const targetMatchPattern = (pattern, target) => Object.entries(pattern)
+        .map(([key, subPattern]) => {
+        if (typeof subPattern === 'number') {
+            return Array.isArray(target[key])
+                ? isMultipleNumberFieldMatch(key, pattern)
+                : isNumberFieldMatch(key, pattern);
+        }
+        if (typeof subPattern === 'object' && 'min' in subPattern && 'max' in subPattern) {
+            return isValueInRange(key, pattern);
+        }
+        return Array.isArray(subPattern)
+            ? isMultipleFieldMatch(key, pattern)
+            : isSingularFieldMatch(key, pattern);
+    })
+        .every((predicate) => predicate(target));
+    const naturalNumber = (n) => Number(n || 0);
+
+    const filterBlocks = (blocksWithProps, filtrationState) => (normalize = identity) => blocksWithProps
+        ?.filter(([, content]) => targetMatchPattern(filtrationState, normalize(content) || {}))
+        .map(([block]) => block);
+
+    const useFiltrationForm = (initialFormState, { block, page, normalize = identity }) => {
+        const blocks = block?.blocks || [];
+        const [filtrationState, { field, reset, update }] = useForm(initialFormState);
+        const blocksWithProps = useMemo(() => zip(blocks, blocks.map((b) => resolveBlockProps(b.content, page?.fallback))), [blocks, page?.fallback]);
+        const blocksToRender = filtrationState === initialFormState
+            ? blocks
+            : filterBlocks(blocksWithProps, filtrationState)(normalize);
+        return [filtrationState, { blocksToRender, blocksWithProps }, { field, reset, update }];
+    };
+
     const EMPTY_SCHEMA = {};
     const initialFiltrationState$3 = {};
-    const BankAccountFiltration = UniBlock(({ className, filtrationSchema = EMPTY_SCHEMA, resetButton, notFound, ...rest }) => {
+    const BankAccountFiltration = UniBlock(({ className, filtrationSchema = EMPTY_SCHEMA, consumerField = {}, resetButton, ...rest }) => {
         const [, { blocksToRender }, { field, reset }] = useFiltrationForm(initialFiltrationState$3, {
             block: rest.block,
             page: rest.options?.page,
         });
-        const selectArrProps = Object.entries(filtrationSchema)
-            // Only StringArray
-            .filter(([, schema]) => schema.type === 'array' && schema.ui === 'dropdown')
-            .map(([name, schema]) => ({
-            className: 'w-64',
-            label: schema.title,
-            options: stringArrayToOptions(schema),
-            ...field(name, {
+        const ConsumerSelect = (jsx(Select, { className: "w-64", label: consumerField?.title, options: stringArrayToOptions(consumerField), ...field('consumer', {
                 parse: ({ key }) => [key],
-                format: ([value] = []) => stringArrayToOptions(schema).find((_) => _.key === value) || { key: '' },
-            }),
-        }));
-        const Selects = selectArrProps.map((props, i) => jsx(Select, { ...props }, String(i)));
-        return (jsxs(BlockWrapper, { className: style(className), defaultPadding: "p-0", version: "transparent", ...rest, children: [jsx(FiltrationForm, { filtrationSchema: filtrationSchema, field: field, reset: reset, children: jsxs("div", { children: [Selects, jsx("div", { children: jsx(Button, { type: "reset", className: "mt-lg w-64", onClick: reset, version: resetButton?.version, children: resetButton?.text }) })] }) }), jsx("div", { className: style(blocksToRender?.length ? 'hidden' : 'block'), children: notFound ? jsx(NotFound, { ...notFound }) : null }), jsx(Carousel, { padding: "p-0", isEmbedded: true, itemCount: blocksToRender?.length, visibleItemCount: 0, isAlignCenter: true, isGap: false, children: renderBlocksList(blocksToRender, {
-                        ...rest.options,
-                        parent: rest.block,
-                        renderProps: (block, options, i) => (jsx("div", { className: style('relative min-w-80', getBorderStyle(true)), children: renderBlock$1(block, options) }, String(i))),
-                    }) })] }));
+                format: ([value] = []) => stringArrayToOptions(consumerField).find((_) => _.key === value) || { key: '' },
+            }) }));
+        return (jsxs(BlockWrapper, { className: style(className), defaultPadding: "p-0", version: "transparent", ...rest, children: [jsx(FiltrationForm, { filtrationSchema: filtrationSchema, field: field, reset: reset, children: jsxs("div", { children: [ConsumerSelect, jsx("div", { children: jsx(Button, { type: "reset", className: "mt-lg w-64", onClick: reset, version: resetButton?.version, children: resetButton?.text }) })] }) }), jsx(FilteredBlocks, { blocksToRender: blocksToRender, ...rest })] }));
     }, {
         childrenTypes: ['CarouselTariffsCard'],
         childSchema: (content) => content?.filtrationSchema || {},
@@ -2422,6 +2490,25 @@
                         .filter(Boolean)
                         .join(' ') }) })) : (jsx("div", { children: jsx(Text, { size: "text-h3", children: "-" }) }))] })));
 
+    const renderFootnote = (text) => text ? (jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: text })) : null;
+
+    const UnknownRate = JSX(({ title = 'Ставка', isUnavailableByTerm = false }) => (jsxs("div", { className: "space-y-s", children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title }), jsx(Icon, { className: "w-10 h-10 @5xl:h-auto @5xl:w-40", name: "PercentIcon" }), jsx("div", { className: "w-64", children: isUnavailableByTerm ? (jsxs(Paragraph, { size: "text-xl", font: "font-light", color: "text-primary-text", children: ["\u041F\u0440\u043E\u0446\u0435\u043D\u0442\u043D\u0430\u044F \u0441\u0442\u0430\u0432\u043A\u0430 \u0434\u043B\u044F \u0441\u0440\u043E\u043A\u0430 ", jsx("strong", { children: "1-30 \u0434\u043D\u0435\u0439" }), " \u0443\u0441\u0442\u0430\u043D\u0430\u0432\u043B\u0438\u0432\u0430\u0435\u0442\u0441\u044F \u043F\u0440\u0438 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0438 \u0432 \u0411\u0430\u043D\u043A"] })) : (jsx(Paragraph, { size: "text-xl", font: "font-light", color: "text-primary-text", children: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0434\u0440\u0443\u0433\u0443\u044E \u0441\u0443\u043C\u043C\u0443 \u0438\u043B\u0438 \u0441\u0440\u043E\u043A" })) })] })));
+
+    const Rate = JSX(({ rate = 0, title = 'Ставка', unit, fractionDigits = 2, depositeName, isShowDepositeName }) => (jsxs("div", { children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title }), jsxs("div", { className: "relative", children: [jsxs("div", { className: "flex justify-start gradient-color-text", children: [jsx("span", { className: "font-mohave text-title-huge pr-xl -mt-m tracking-[-15px]", children: toLocalNumberFormat(fractionDigits, { fixed: true })(rate) }), unit ? jsx("span", { className: "text-7xl", children: unit }) : null] }), depositeName && isShowDepositeName ? (jsx("div", { className: "absolute bottom-2 w-full text-left whitespace-nowrap", children: depositeName })) : null] })] })));
+
+    const renderRate = ({ title = 'Ставка', rate = 0, unit = '%', fractionDigits = 2, isUnknownRateShown = true, ...rest }) => isUnknownRateShown && rate === 0 ? (jsx(UnknownRate, { title: title, ...rest })) : (jsxs("div", { children: [jsx("div", { className: "hidden @xl:block", children: jsx(Rate, { title: title, rate: rate, unit: unit, fractionDigits: fractionDigits, ...rest }) }), jsx("div", { className: "@xl:hidden", children: jsx(CalculatorValueBlock, { title: title, value: rate, postfix: unit, fractionDigits: fractionDigits, fixed: true, ...rest }) })] }));
+
+    const DEFAULT_MONEY_STEP = 1000;
+    function renderWantedSumInput({ isShowItems = true, step = DEFAULT_MONEY_STEP, ...rest }) {
+        const items = [
+            `От ${toLocalNumberFormat(2)(rest.min || 0)} ₽`,
+            `До ${toLocalNumberFormat(2)(rest.max || 0)} ₽`,
+        ];
+        return jsx(InputRange, { items: isShowItems ? items : [], step: step, ...rest });
+    }
+
+    const CalculatorFormLayout = JSX(({ className, inputChildren, rateChildren, resultChildren }) => (jsxs("section", { className: style('flex flex-col justify-between @5xl:flex-row gap-m', className), children: [jsx("div", { className: "flex flex-col gap-y-m sm:max-w-md gap-2xl", children: inputChildren }), jsx("div", { className: "border-b border-main-divider md:hidden" }), rateChildren, jsx("div", { className: "flex flex-col gap-2xl sm:w-96 max-w-full", children: resultChildren })] })));
+
     const DEFAULT_MIN_SUM$1 = 10000;
     const DEFAULT_MAX_SUM$1 = 5000000;
     const CREDIT_DEFAULT_SUM = 200000;
@@ -2445,8 +2532,8 @@
     const BUSINESS_OPERATING_MIN_DAYS = 90;
     const BUSINESS_OPERATING_MAX_DAYS = 730;
     const BUSINESS_DEFAULT_DAYS = 60;
-    const MONTHS_IN_YEAR = 12;
-    const MONTHLY_INTEREST_RATE = MONTHS_IN_YEAR * 100;
+    const MONTHS_IN_YEAR$1 = 12;
+    const MONTHLY_INTEREST_RATE = MONTHS_IN_YEAR$1 * 100;
     const DEFAULT_CREDIT_CALCULATOR_PARAMS = {
         minSum: DEFAULT_MIN_SUM$1,
         maxSum: DEFAULT_MAX_SUM$1,
@@ -2472,20 +2559,6 @@
         isSalaryClient: false,
         isInsurance: true,
     };
-    const DEFAULT_TRAVEL_MIN_SUM = 6000;
-    const DEFAULT_REST_MIN_SUM = 6000;
-    const DEFAULT_BONUS_CALCULATOR_PARAMS = {
-        minSumTravel: 6000,
-        maxSumTravel: 200000,
-        minSumOther: 6000,
-        maxSumOther: 200000,
-        maxBonus: 5000,
-        prefMonthsNum: 2,
-        prefTravelBonusRate: 0.015,
-        prefRestBonusRate: 0.01,
-        travelBonusRate: 0.015,
-        restBonusRate: 0.01,
-    };
     const DEFAULT_DEPOSIT_CALCULATOR_PARAMS = {
         minSum: 50000,
         maxSum: 100000001,
@@ -2507,76 +2580,6 @@
         depositeName: "Депозит 'Стабильный'",
     };
 
-    const getBonus = (params, bonusTravelValue, bonusOtherValue) => {
-        const { maxBonus = 5000, prefMonthsNum = DEFAULT_BONUS_CALCULATOR_PARAMS.prefMonthsNum, prefTravelBonusRate = DEFAULT_BONUS_CALCULATOR_PARAMS.prefTravelBonusRate, prefRestBonusRate = 0.01, travelBonusRate = 0.015, restBonusRate = 0.01, } = params;
-        const prefBonus = Math.min(Math.round(prefTravelBonusRate * bonusTravelValue) +
-            Math.round(prefRestBonusRate * bonusOtherValue), maxBonus);
-        const bonus = Math.min(Math.round(travelBonusRate * bonusTravelValue) + Math.round(restBonusRate * bonusOtherValue), maxBonus);
-        const yearBonus = prefBonus * prefMonthsNum + bonus * (MONTHS_IN_YEAR - prefMonthsNum);
-        return [prefBonus, yearBonus];
-    };
-
-    const getBonusCalculatorParams = (userInputParams, calcSource) => {
-        const { travelExpenseValue, restExpenseValue } = userInputParams;
-        const [monthBonus, yearBonus] = getBonus(calcSource || DEFAULT_BONUS_CALCULATOR_PARAMS, travelExpenseValue, restExpenseValue);
-        return {
-            ...calcSource,
-            ...userInputParams,
-            monthBonus,
-            yearBonus,
-        };
-    };
-
-    const renderFootnote = (text) => text ? (jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: text })) : null;
-
-    const Rate = JSX(({ rate = 0, title = 'Ставка', unit, fractionDigits = 2, depositeName, isShowDepositeName }) => (jsxs("div", { children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title }), jsxs("div", { className: "relative", children: [jsxs("div", { className: "flex justify-start gradient-color-text", children: [jsx("span", { className: "font-mohave text-title-huge pr-xl -mt-m tracking-[-15px]", children: toLocalNumberFormat(fractionDigits, { fixed: true })(rate) }), unit ? jsx("span", { className: "text-7xl", children: unit }) : null] }), depositeName && isShowDepositeName ? (jsx("div", { className: "absolute bottom-2 w-full text-left whitespace-nowrap", children: depositeName })) : null] })] })));
-
-    const UnknownRate = JSX(({ title = 'Ставка', isUnavailableByTerm = false }) => (jsxs("div", { className: "space-y-s", children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title }), jsx(Icon, { className: "w-10 h-10 @5xl:h-auto @5xl:w-40", name: "PercentIcon" }), jsx("div", { className: "w-64", children: isUnavailableByTerm ? (jsxs(Paragraph, { size: "text-xl", font: "font-light", color: "text-primary-text", children: ["\u041F\u0440\u043E\u0446\u0435\u043D\u0442\u043D\u0430\u044F \u0441\u0442\u0430\u0432\u043A\u0430 \u0434\u043B\u044F \u0441\u0440\u043E\u043A\u0430 ", jsx("strong", { children: "1-30 \u0434\u043D\u0435\u0439" }), " \u0443\u0441\u0442\u0430\u043D\u0430\u0432\u043B\u0438\u0432\u0430\u0435\u0442\u0441\u044F \u043F\u0440\u0438 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0438 \u0432 \u0411\u0430\u043D\u043A"] })) : (jsx(Paragraph, { size: "text-xl", font: "font-light", color: "text-primary-text", children: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0434\u0440\u0443\u0433\u0443\u044E \u0441\u0443\u043C\u043C\u0443 \u0438\u043B\u0438 \u0441\u0440\u043E\u043A" })) })] })));
-
-    const renderRate = ({ title = 'Ставка', rate = 0, unit = '%', fractionDigits = 2, isUnknownRateShown = true, ...rest }) => isUnknownRateShown && rate === 0 ? (jsx(UnknownRate, { title: title, ...rest })) : (jsxs("div", { children: [jsx("div", { className: "hidden @xl:block", children: jsx(Rate, { title: title, rate: rate, unit: unit, fractionDigits: fractionDigits, ...rest }) }), jsx("div", { className: "@xl:hidden", children: jsx(CalculatorValueBlock, { title: title, value: rate, postfix: unit, fractionDigits: fractionDigits, fixed: true, ...rest }) })] }));
-
-    const DEFAULT_MONEY_STEP = 1000;
-    function renderWantedSumInput({ isShowItems = true, step = DEFAULT_MONEY_STEP, ...rest }) {
-        const items = [
-            `От ${toLocalNumberFormat(2)(rest.min || 0)} ₽`,
-            `До ${toLocalNumberFormat(2)(rest.max || 0)} ₽`,
-        ];
-        return jsx(InputRange, { items: isShowItems ? items : [], step: step, ...rest });
-    }
-
-    const BonusCalculatorForm = JSX(({ className = '', calcSource, buttons, footnote }) => {
-        const [userInputParams, { field }] = useForm({
-            travelExpenseValue: DEFAULT_TRAVEL_MIN_SUM,
-            restExpenseValue: DEFAULT_REST_MIN_SUM,
-        });
-        const { minSumTravel, maxSumTravel, minSumOther, maxSumOther, monthBonus, yearBonus } = getBonusCalculatorParams(userInputParams, calcSource);
-        return (jsxs("section", { className: style('flex flex-col justify-between @5xl:flex-row gap-y-4xl', className), children: [jsxs("div", { className: "flex flex-col @xl:max-w-md gap-2xl border-b border-b-main-divider @xl:border-none pb-3xl @xl:pb-0", children: [renderWantedSumInput({
-                            title: 'Сумма покупок в категории путешествия, ₽',
-                            min: minSumTravel,
-                            max: maxSumTravel,
-                            step: 500,
-                            isShowItems: false,
-                            ...field('travelExpenseValue'),
-                        }), renderWantedSumInput({
-                            title: 'Сумма покупок в остальных категориях, ₽',
-                            min: minSumOther,
-                            max: maxSumOther,
-                            step: 500,
-                            isShowItems: false,
-                            ...field('restExpenseValue'),
-                        })] }), monthBonus >= 0
-                    ? renderRate({
-                        title: 'Баллов за месяц',
-                        rate: monthBonus,
-                        fractionDigits: 0,
-                        isUnknownRateShown: false,
-                        unit: '',
-                    })
-                    : null, jsxs("div", { className: "flex flex-col gap-y-xl @xl:w-96", children: [yearBonus >= 0 ? jsx(CalculatorValueBlock, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u0433\u043E\u0434", value: yearBonus }) : null, renderButtonsSection(buttons, { isVertical: true }), renderFootnote(footnote)] })] }));
-    });
-
-    const CalculatorFormLayout = JSX(({ className, inputChildren, rateChildren, resultChildren }) => (jsxs("section", { className: style('flex flex-col justify-between @5xl:flex-row gap-m', className), children: [jsx("div", { className: "flex flex-col gap-y-m sm:max-w-md gap-2xl", children: inputChildren }), jsx("div", { className: "border-b border-main-divider md:hidden" }), rateChildren, jsx("div", { className: "flex flex-col gap-2xl sm:w-96 max-w-full", children: resultChildren })] })));
-
     const getMoneyDefaultValue = (defaultParams, defaultMoney = 0) => defaultParams?.sum ? defaultParams.sum : defaultMoney;
     const getMonthsDefaultValue = (defaultParams, defaultMonth = 0) => defaultParams?.period &&
         defaultParams.period >= DEFAULT_MIN_MONTHS &&
@@ -2774,7 +2777,7 @@
             }
         }
         else {
-            return Math.round(moneyValue / monthsValue) + moneyValue * (rate / (MONTHS_IN_YEAR * 100)); // Используется значение ставки (rate) в процентах, делённое на сто.
+            return Math.round(moneyValue / monthsValue) + moneyValue * (rate / (MONTHS_IN_YEAR$1 * 100)); // Используется значение ставки (rate) в процентах, делённое на сто.
         }
     };
 
@@ -3126,7 +3129,6 @@
         CreditCalculatorForm,
         DepositCalculatorForm,
         BusinessDepositCalculatorForm,
-        BonusCalculatorForm,
         RefinancingCalculatorForm,
     };
 
@@ -3190,6 +3192,86 @@
                         })) }) }), jsx("div", { className: "w-full h-2 bg-primary-main" })] }));
     }
 
+    const CalculatorLayout = JSX(({ className, title, children, ...rest }) => (jsxs(BlockWrapper, { className: style('space-y-xl', className), defaultPadding: "p-4xl", ...rest, children: [title ? jsx(Heading, { className: "text-center", title: title }) : null, children] })));
+
+    const DEFAULT_BONUS_CALCULATOR_PARAMS$1 = {
+        minSumTravel: 6000,
+        maxSumTravel: 200000,
+        minSumOther: 6000,
+        maxSumOther: 200000,
+        maxBonus: 5000,
+        prefMonthsNum: 2,
+        prefTravelBonusRate: 0.015,
+        prefRestBonusRate: 0.01,
+        travelBonusRate: 0.015,
+        restBonusRate: 0.01,
+    };
+    const MONTHS_IN_YEAR = 12;
+    const getBonus = (params, bonusTravelValue, bonusOtherValue) => {
+        const { maxBonus = 5000, prefMonthsNum = DEFAULT_BONUS_CALCULATOR_PARAMS$1.prefMonthsNum, prefTravelBonusRate = DEFAULT_BONUS_CALCULATOR_PARAMS$1.prefTravelBonusRate, prefRestBonusRate = 0.01, travelBonusRate = 0.015, restBonusRate = 0.01, } = params;
+        const prefBonus = Math.min(Math.round(prefTravelBonusRate * bonusTravelValue) +
+            Math.round(prefRestBonusRate * bonusOtherValue), maxBonus);
+        const bonus = Math.min(Math.round(travelBonusRate * bonusTravelValue) + Math.round(restBonusRate * bonusOtherValue), maxBonus);
+        const yearBonus = prefBonus * prefMonthsNum + bonus * (MONTHS_IN_YEAR - prefMonthsNum);
+        return [prefBonus, yearBonus];
+    };
+
+    const DEFAULT_BONUS_CALCULATOR_PARAMS = {
+        minSumTravel: 6000,
+        maxSumTravel: 200000,
+        minSumOther: 6000,
+        maxSumOther: 200000,
+        maxBonus: 5000,
+        prefMonthsNum: 2,
+        prefTravelBonusRate: 0.015,
+        prefRestBonusRate: 0.01,
+        travelBonusRate: 0.015,
+        restBonusRate: 0.01,
+    };
+    const getBonusCalculatorParams = (userInputParams, calcSource) => {
+        const { travelExpenseValue, restExpenseValue } = userInputParams;
+        const [monthBonus, yearBonus] = getBonus(calcSource || DEFAULT_BONUS_CALCULATOR_PARAMS, travelExpenseValue, restExpenseValue);
+        return {
+            ...calcSource,
+            ...userInputParams,
+            monthBonus,
+            yearBonus,
+        };
+    };
+
+    const DEFAULT_TRAVEL_MIN_SUM = 6000;
+    const DEFAULT_REST_MIN_SUM = 6000;
+    const CalculatorBonus = UniBlock(({ className = '', title, calcSource, buttons, footnote, ...rest }) => {
+        const [userInputParams, { field }] = useForm({
+            travelExpenseValue: DEFAULT_TRAVEL_MIN_SUM,
+            restExpenseValue: DEFAULT_REST_MIN_SUM,
+        });
+        const { minSumTravel, maxSumTravel, minSumOther, maxSumOther, monthBonus, yearBonus } = getBonusCalculatorParams(userInputParams, calcSource);
+        return (jsx(CalculatorLayout, { className: className, title: title, ...rest, children: jsxs("section", { className: style('flex flex-col justify-between @4xl:flex-row gap-y-4xl', className), children: [jsxs("div", { className: "flex flex-col @xl:max-w-md gap-2xl border-b border-b-main-divider @xl:border-none pb-3xl @xl:pb-0", children: [renderWantedSumInput({
+                                title: 'Сумма покупок в категории путешествия, ₽',
+                                min: minSumTravel,
+                                max: maxSumTravel,
+                                step: 500,
+                                isShowItems: false,
+                                ...field('travelExpenseValue'),
+                            }), renderWantedSumInput({
+                                title: 'Сумма покупок в остальных категориях, ₽',
+                                min: minSumOther,
+                                max: maxSumOther,
+                                step: 500,
+                                isShowItems: false,
+                                ...field('restExpenseValue'),
+                            })] }), monthBonus >= 0
+                        ? renderRate({
+                            title: 'Баллов за месяц',
+                            rate: monthBonus,
+                            fractionDigits: 0,
+                            isUnknownRateShown: false,
+                            unit: '',
+                        })
+                        : null, jsxs("div", { className: "flex flex-col gap-y-xl @xl:w-96", children: [yearBonus >= 0 ? (jsx(CalculatorValueBlock, { title: "\u0411\u0430\u043B\u043B\u043E\u0432 \u0437\u0430 \u0433\u043E\u0434", value: yearBonus })) : null, renderButtonsSection(buttons, { isVertical: true }), renderFootnote(footnote)] })] }) }));
+    });
+
     const NumberInput = JSX((props) => {
         const { onChange, min, max, defaultValue = '0', fractionDigits = 0, ...inputProps } = props;
         const normalizedProps = useNormalizedInput(props, {
@@ -3352,46 +3434,6 @@
     const CarouselRecommendationCard = JSX(({ className, padding, description, additionalDescription, href, icon, items = [], isDotted, socialMedia = [], target, title, align = 'text-left', benefits, imageOptions: { directionRight = true, isImageAlwaysOnRight = ImageAlwaysOnRight, isImageSecondary = false, } = {}, ...rest }) => (jsx(BlockWrapper, { className: style('relative min-h-28 group-data-gray:bg-main-divider/50', className), defaultPadding: "p-0", ...rest, children: jsx(LinkWrapper, { href: href, target: target, className: "h-full", children: jsxs(BaseTile, { className: "h-full", defaultPadding: "p-2xl", padding: padding, insetTitle: jsx(Headline, { title: title, description: description, headlineVersion: "XS", isEmbedded: true, align: align }), ...leftOrRightImage(isIcon(icon) ? jsx(Img, { image: icon }) : null, directionRight), buttons: socialMedia.length ? (jsx(SocialMedia, { media: socialMedia, showButtonText: true, version: rest?.version })) : null, isImageAlwaysOnRight: isImageAlwaysOnRight, isImageSecondary: isImageSecondary, imageAlign: "center", children: [jsx(BenefitsList, { benefits: benefits }), jsx(List, { items: items, isDotted: isDotted, listItemSize: "S" }), renderAdditionalDescription(additionalDescription, align)] }) }) })));
     const renderAdditionalDescription = (additionalDescription, align) => additionalDescription ? (jsx(Paragraph, { size: "text-m", font: "font-light", color: "text-secondary-text group-data-secondary:text-white/80", align: align, children: additionalDescription })) : null;
 
-    const Foldable = JSX(({ className = '', isFoldButtonOnTop = false, unfoldedByDefault = false, renderFoldableSection, renderFoldButton, }) => {
-        const [isUnfolded, setIsUnfolded] = useState(unfoldedByDefault);
-        const onToggle = useCallback(() => {
-            setIsUnfolded((_) => !_);
-        }, []);
-        const sectionNode = renderFoldableSection({ isUnfolded, onToggle });
-        const buttonNode = renderFoldButton ? renderFoldButton({ isUnfolded, onToggle }) : null;
-        return isFoldButtonOnTop ? (jsxs("div", { className: className, role: "group", children: [buttonNode, sectionNode] })) : (jsxs("div", { className: className, role: "group", children: [sectionNode, buttonNode] }));
-    });
-
-    function useResizeObserver(callback, deps) {
-        const ref = useRef(null);
-        useEffect(() => {
-            const element = ref?.current;
-            if (!element) {
-                return undefined;
-            }
-            const observer = new ResizeObserver((entries) => {
-                callback(element, entries[0]);
-            });
-            observer.observe(element);
-            return () => {
-                observer.disconnect();
-            };
-        }, [callback, ...deps]);
-        return ref;
-    }
-
-    const FoldableSection = JSX(({ className = '', isUnfolded, children }) => {
-        const containerRef = useRef(null);
-        const childrenWrapperRef = useResizeObserver((childrenWrapperEl) => {
-            if (containerRef.current) {
-                containerRef.current.style.maxHeight = isUnfolded
-                    ? `${childrenWrapperEl.scrollHeight}px`
-                    : '';
-            }
-        }, [isUnfolded]);
-        return (jsx("div", { ref: containerRef, className: `transition-max-h duration-300 overflow-hidden ${containerRef.current || !isUnfolded ? 'max-h-0' : ''} `, children: jsx("div", { className: className, ref: childrenWrapperRef, children: children }) }));
-    });
-
     const renderCardInfo = (cell, i) => {
         const { title, description, buttons } = cell;
         return (jsxs("div", { className: "py-lg 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-2xs", 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)));
@@ -3489,36 +3531,6 @@
     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(LinkButton, { 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, role, ...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, role: role, ...rest, children: [textNode ? jsx("div", { children: textNode }) : null, iconNode ? jsx("div", { children: iconNode }) : null] }));
-    });
-
-    const DefaultFoldButton = JSX(({ className = '', label, icon, dataTheme = '', disabled = false, onClick }) => (jsx(TextWithIcon, { tag: "button", onClick: onClick, disabled: disabled, "data-theme": dataTheme, justifyContent: "center", role: "button", className: style('py-4 border border-transparent outline-none focus:border-primary-text space-x-s', disabled
-            ? 'bg-main-divider text-main-disabled hover:bg-main-divider'
-            : 'bg-primary-main text-white hover:bg-primary-hove', className), textNode: jsx(Text, { size: "text-h4", children: label }), iconNode: icon ? (jsx(Img, { image: {
-                icon,
-                iconVersion: 'white',
-            }, className: "my-auto", width: "20", height: "20" })) : null })));
-    const renderDefaultFoldButton = ({ isUnfolded, onToggle }) => {
-        const labels = ['Развернуть', 'Скрыть'];
-        const icons = ['ArrowDownIcon', 'ArrowUpIcon'];
-        return (jsx(DefaultFoldButton, { icon: icons[Number(isUnfolded)], label: labels[Number(isUnfolded)], onClick: onToggle }));
-    };
-
-    const ICONS$1 = ['ArrowDownIcon', 'ArrowUpIcon'];
-    const resultsGridStyle = 'space-y-px lg:space-y-0 lg:grid lg:grid-cols-12 gap-2xs border-box';
-    const BaseFiltrationInner = JSX(({ label = '', blocksToRender = [], topItemsCount = 0, block, notFound, ...rest }) => {
-        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: [jsxs("div", { className: style(resultsGridStyle), children: [renderBlocksList(visibleBlocks, { ...rest.options, parent: block }), isOdd(visibleBlocks.length) ? jsx(AdTile, { className: "col-span-6", ...rest }) : 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", ...rest }) : null] }));
-                            }, renderFoldButton: ({ isUnfolded, onToggle }) => (jsx(DefaultFoldButton, { className: style(topItemsCount < 1 ? 'hidden' : ''), disabled: !hiddenBlocks?.length, label: label, icon: ICONS$1[Number(isUnfolded)], dataTheme: rest.options?.page?.colorPalette, onClick: onToggle })) })] })] }));
-    });
-
     const isRateRow = (rateRow) => {
         return typeof rateRow?.minMonths === 'number' && typeof rateRow?.maxMonths === 'number';
     };
@@ -3545,7 +3557,7 @@
         return (jsxs(BlockWrapper, { className: style('space-y-2xs', className), defaultPadding: "p-0", version: "transparent", ...rest, children: [jsx(FiltrationForm, { filtrationSchema: filtrationSchema, resetButton: resetButton, field: field, reset: reset, children: jsxs("div", { className: "@4xl:max-w-xs", children: [jsx(CurrencyInput, { label: sumInput?.title, min: DEFAULT_MIN_SUM, max: DEFAULT_MAX_SUM, ...field('sum', {
                                     parse: (min) => ({ min: Number(min), max: DEFAULT_MAX_SUM }),
                                     format: ({ min }) => String(min),
-                                }) }), jsx(InputRange, { title: periodInput?.title, items: ['От 3 мес', 'До 5 лет'], list: months, ...field('period') })] }) }), jsx(BaseFiltrationInner, { blocksToRender: blocksToRender, ...rest })] }));
+                                }) }), jsx(InputRange, { title: periodInput?.title, items: ['От 3 мес', 'До 5 лет'], list: months, ...field('period') })] }) }), jsx(FilteredBlocks, { blocksToRender: blocksToRender, ...rest })] }));
     }, {
         childrenTypes: ['ProductBlock'],
         childSchema: (content) => ({
@@ -4254,8 +4266,8 @@
     });
 
     const SEARCH_TERM_MIN_LENGTH = 3;
-    const LocationDialog = JSX(({ foreignOffices, defaultLocation }) => {
-        const [currentLocation, selectCurrentLocation] = useLocation(defaultLocation);
+    const LocationDialog = JSX(({ foreignOffices, branches }) => {
+        const [currentLocation, selectCurrentLocation] = useLocation(branches?.default);
         const link = useLink({ isRemote: true });
         const { href } = link({ href: `/branches/${currentLocation.slug}` });
         const [query, setQuery] = useState('');
@@ -4298,10 +4310,12 @@
     const MINDBOX_EVENT_SEARCH_CLICK = 'headerSearchClick';
     const HeaderSecondaryMenu = JSX(({ className, version, ...rest }) => {
         const iconVersion = version === 'transparent' ? 'white' : 'black';
-        const [currentLocation] = useLocation(rest.defaultLocation);
+        const [currentLocation] = useLocation(rest?.branches?.default);
         const searchDialog = useSearchDialog(rest);
         const locationDialog = useLocationDialog(rest);
-        return (jsxs("div", { className: style('flex items-center gap-lg', className), role: "navigation", children: [jsx(TopItem, { flat: true, href: "#", text: currentLocation?.name, data: [
+        const openSearchDialog = useCallback(() => searchDialog.open(), [searchDialog]);
+        const openLocationDialog = useCallback(() => locationDialog.open(), [locationDialog]);
+        return (jsxs("div", { className: style('flex items-center gap-lg', className), role: "navigation", children: [rest?.branches?.visible ? (jsx(TopItem, { flat: true, href: "#", text: currentLocation?.name, data: [
                         {
                             aspectName: MINDBOX_ASPECT,
                             params: {
@@ -4310,7 +4324,7 @@
                                 eventValueText: currentLocation?.name ?? '',
                             },
                         },
-                    ], onClick: () => locationDialog.open() }), rest.officesAtms?.href ? (jsx(TopItem, { flat: true, text: "\u041E\u0444\u0438\u0441\u044B \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u044B", ...rest.officesAtms })) : null, jsx(HeaderSecondaryMenuButton, { image: { icon: 'LoupeIcon', iconVersion }, ariaLabel: "\u041F\u043E\u0438\u0441\u043A", onClick: () => searchDialog.open(), data: [
+                    ], onClick: openLocationDialog })) : null, rest?.officesAtms?.href ? jsx(TopItem, { flat: true, ...rest.officesAtms }) : null, jsx(HeaderSecondaryMenuButton, { image: { icon: 'LoupeIcon', iconVersion }, ariaLabel: "\u041F\u043E\u0438\u0441\u043A", onClick: openSearchDialog, data: [
                         {
                             aspectName: MINDBOX_ASPECT,
                             params: {
@@ -4790,18 +4804,18 @@
         stage: [],
     };
     const MortgageFiltration = UniBlock(({ className, hotFilters, filtrationSchema = {}, resetButton, ...rest }) => {
-        const [filtrationState, { blocksToRender }, { field, reset, update }] = useFiltrationForm(initialFiltrationState, {
+        const [filtrationState, { blocksToRender }, { field, reset, update: replaceFiltrationState }] = useFiltrationForm(initialFiltrationState, {
             block: rest.block,
             page: rest.options?.page,
         });
-        const handleFiltrationStateChange = useCallback((_ = initialFiltrationState) => update(_), []);
+        const handleFiltrationStateChange = useCallback((_ = initialFiltrationState) => replaceFiltrationState(_), []);
         const tabsControlProps = useHotFilters({
             hotFilters,
             filtrationState,
             blocks: rest.block?.blocks,
             onFiltrationStateChange: handleFiltrationStateChange,
         });
-        return (jsxs(BlockWrapper, { className: style('space-y-2xs', className), defaultPadding: "p-0", version: "transparent", ...rest, children: [jsx(TabsControl, { ...tabsControlProps }), jsx(FiltrationForm, { filtrationSchema: filtrationSchema, resetButton: resetButton, field: field, reset: reset }), jsx(BaseFiltrationInner, { blocksToRender: blocksToRender, ...rest })] }));
+        return (jsxs(BlockWrapper, { className: style('space-y-2xs', className), defaultPadding: "p-0", version: "transparent", ...rest, children: [jsx(TabsControl, { ...tabsControlProps }), jsx(FiltrationForm, { filtrationSchema: filtrationSchema, resetButton: resetButton, field: field, reset: reset }), jsx(FilteredBlocks, { blocksToRender: blocksToRender, ...rest })] }));
     }, {
         childrenTypes: ['ProductBlock'],
         childSchema: (content) => content?.filtrationSchema || {},
@@ -5939,6 +5953,7 @@
         BonusBenefitsBlock,
         ButtonsBlock,
         Calculator,
+        CalculatorBonus,
         CardTransfer,
         Carousel,
         CarouselBankHistoryCard,
@@ -6155,7 +6170,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
 
-    const packageVersion = "0.14.291";
+    const packageVersion = "0.14.293";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;