@redneckz/wildless-cms-uni-blocks 0.14.752 → 0.14.753

package/mobile/bundle/bundle.umd.js

@@ -292,7 +292,7 @@
 
     const isOnlyDigits = (str) => str && !/\D/.test(str);
 
-    const svgUseStyleMap = {
+    const iconVersionStyle = {
         '': '',
         normal: '',
         color: 'text-primary-main',
@@ -300,25 +300,30 @@
         white: 'text-black',
         gray: 'text-gray',
     };
-    const Icon = JSX(({ className = '', imageClassName = '', name = '', alt = `Иконка ${name}`, title = alt, iconVersion = 'color', width, height, }) => {
+    const sizeStyle = {
+        small: '16',
+        medium: '24',
+        large: '48',
+        xl: '78',
+    };
+    const Icon = JSX(({ className = '', imageClassName = '', name = '', alt = `Иконка ${name}`, title = alt, iconVersion = 'color', size, width = size && sizeStyle[size], height = width, }) => {
         const router = useRouter();
         const iconName = iconVersion === 'normal' ? `${name}.svg` : `sprites.svg#${name}`;
         const href = adjustHref(router)(joinPath(projectSettings.CDN, '/icons/', iconName));
         if (iconVersion === 'normal') {
             // fix svg gradient color
-            return (jsx("img", { className: className, src: href, alt: alt, title: title, "aria-hidden": "true", width: width, height: height, style: getInlineStyle(className, height) }));
+            return (jsx("img", { className: className, style: getInlineStyle(className, height), src: href, alt: alt, title: title, "aria-hidden": "true", width: width, height: height }));
         }
-        return (jsx(Background, { className: className, children: jsxs("svg", { className: style(getSvgSize(width), svgUseStyleMap[iconVersion], {
+        return (jsx(Background, { className: className, children: jsxs("svg", { className: style(iconVersionStyle[iconVersion], {
+                    'w-full h-full': !width,
                     invert: iconVersion === 'white',
                 }, 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, xlinkHref: href })] }) }));
     });
-    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');
+    // TODO Что то совсем не очень
+    const getInlineStyle = (className, height) => className?.includes('h-')
+        ? {}
+        : { height: isOnlyDigits(height) ? `${height}px` : height, width: 'auto' };
+    // TODO И это тоже
     const Background = JSX(({ className, children }) => className ? (jsx("div", { role: "img", className: className, children: children })) : (children));
 
     const env = new Proxy({
@@ -1423,8 +1428,35 @@
 
     const usePopupManager = () => useEmitterWithActions(defaultEventBus.emitter, 'popup');
 
-    const InputPopup = JSX(({ options, onChange }) => (jsx("div", { className: "bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md shadow-2xl", role: "list", children: options?.map((item, key) => (jsx("div", { className: "flex px-m py-s cursor-pointer hover:bg-main-divider pr-5xl relative", role: "listitem", onMouseDown: () => onChange(item), children: jsx("span", { className: "min-h-6", children: item.processedValue }) }, key.toString()))) })));
+    const ARROW_DOWN_KEYBOARD_KEY_CODE = 'ArrowDown';
+    const ARROW_UP_KEYBOARD_KEY_CODE = 'ArrowUp';
+    const ENTER_KEYBOARD_KEY_CODE = 'Enter';
+    const INITIAL_LIST_ITEM_ACTIVE = -1;
+    const InputPopup = JSX(({ options, container, onChange }) => {
+        const [listItemActive, setListItemActive] = useState(INITIAL_LIST_ITEM_ACTIVE);
+        const onKeyDownHandler = (ev) => {
+            const hintsListMaxIndex = options.length - 1;
+            if (ev.key === ARROW_DOWN_KEYBOARD_KEY_CODE) {
+                setListItemActive(listItemActive < hintsListMaxIndex ? listItemActive + 1 : 0);
+            }
+            else if (ev.key === ARROW_UP_KEYBOARD_KEY_CODE) {
+                setListItemActive(listItemActive > 0 ? listItemActive - 1 : hintsListMaxIndex);
+            }
+            else if (ev.key === ENTER_KEYBOARD_KEY_CODE && options[listItemActive]) {
+                ev.preventDefault();
+                onChange(options[listItemActive]);
+            }
+        };
+        useEffect(() => {
+            container.addEventListener('keydown', onKeyDownHandler);
+            return () => container.removeEventListener('keydown', onKeyDownHandler);
+        }, [listItemActive]);
+        return (jsx("div", { className: "bg-white text-l overflow-y-auto overflow-x-hidden rounded-md shadow-2xl", role: "list", children: options?.map((item, key) => (jsx("div", { className: style('flex px-m py-s cursor-pointer hover:bg-main-divider pr-5xl relative', {
+                    'bg-main-divider': listItemActive === key,
+                }), role: "listitem", onMouseDown: () => onChange(item), children: jsx("span", { className: "min-h-6", children: item.processedValue }) }, key.toString()))) }));
+    });
 
+    // eslint-disable-next-line max-lines-per-function
     function useInputPopup({ isOpen, value, name, onChange, onDaDataChange, daDataQueryPrefix, }) {
         const prevInputValue = useRef(value);
         const currentInputValue = useRef(value);
@@ -1438,8 +1470,8 @@
         const handleChange = useCallback((option) => {
             close();
             currentInputValue.current = option.processedValue;
-            onChange && onChange(option.processedValue);
-            onDaDataChange && onDaDataChange(option);
+            onChange?.(option.processedValue);
+            onDaDataChange?.(option);
         }, [close, onChange]);
         const inputRef = useRef(null);
         const getHintsList = useMemo(() => async (searchValue) => {
@@ -1472,7 +1504,7 @@
                 prevInputValue.current = value;
             }
             popup.open({
-                popup: jsx(InputPopup, { options: hintsList, value: value, onChange: handleChange }),
+                popup: (jsx(InputPopup, { options: hintsList, container: inputElement, value: value, onChange: handleChange })),
                 top: top + globalThis.scrollY + height,
                 left,
                 width,
@@ -2826,40 +2858,21 @@
 
     const renderTitle = (title) => title ? (jsx("div", { className: "@xl:text-center @xl:col-span-2 mb-m", children: jsx(Text, { size: "text-h6", children: title }) })) : null;
 
-    const Loader = JSX(({ color = 'text-primary-main', position = 'absolute', blur = true, size = 'big' }) => (jsx("div", { className: style('flex justify-center items-center h-full w-full z-50', position, {
-            'backdrop-blur': blur,
-        }), children: jsx("div", { className: style('inline-block ', 'animate-spin rounded-full', 'border-solid border-current', 'border-r-transparent', size === 'small' ? 'border-4 h-8 w-8' : 'border-8 h-28 w-28', color), role: "status" }) })));
-
-    function useButton() {
-        return (props) => ({
-            ...props,
-            onClick: handlerDecorator(handleClick(props)),
-        });
-    }
-    function handleClick({ disabled, onClick }) {
-        return (ev) => {
-            !disabled && onClick && onClick(ev);
-        };
-    }
-
     const buttonStyleMap = {
-        primary: 'text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active',
-        secondary: 'text-primary-main bg-main-divider hover:text-white hover:bg-primary-hover active:bg-primary-active',
-    };
-    const secondaryButtonStyleMap = {
-        primary: style('group-data-secondary:text-primary-main group-data-secondary:bg-white', 'group-data-secondary:hover:text-white group-data-secondary:hover:bg-primary-hover', 'group-data-secondary:active:bg-primary-active'),
-        secondary: style('group-data-secondary:text-white group-data-secondary:bg-white/20', 'group-data-secondary:hover:bg-primary-hover', 'group-data-secondary:active:bg-primary-active'),
-    };
-    const Button = JSX(({ children, ...props }) => {
-        const button = useButton();
-        const { className, version = 'primary', active, disabled, isLoading, type = 'button', rounded = true, role, onClick, } = button(props);
-        return (jsxs("button", { className: style('font-sans px-9 py-4', 'flex justify-center items-center gap-xs relative', {
-                'text-white bg-primary-active': active,
-                'bg-main-gray text-main-disabled cursor-not-allowed': disabled || isLoading,
+        primary: style('justify-center px-9 py-4', 'text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active', 'group-data-secondary:text-primary-main group-data-secondary:bg-white', 'group-data-secondary:hover:text-white group-data-secondary:hover:bg-primary-hover', 'group-data-secondary:active:bg-primary-active'),
+        secondary: style('justify-center px-9 py-4', 'text-primary-main bg-main-divider hover:text-white hover:bg-primary-hover active:bg-primary-active', 'group-data-secondary:text-white group-data-secondary:bg-white/20', 'group-data-secondary:hover:bg-primary-hover', 'group-data-secondary:active:bg-primary-active'),
+    };
+    const embeddedStyle = style('group/btn-embedded', 'justify-between p-0', 'bg-transparent border border-transparent outline-none');
+    const Button = JSX(({ className, type = 'button', version = 'primary', embedded, rounded = true, disabled, role, data, dataTheme, children, onClick, }) => {
+        const handleClick = useCallback(handlerDecorator((ev) => {
+            !disabled && onClick?.(ev);
+        }), [disabled, onClick]);
+        const aspectsAttrs = useMemo(() => getAspectsAttributes(data), [data]);
+        return (jsx("button", { className: style('font-sans flex items-center gap-xs relative', !disabled && !embedded && buttonStyleMap[version], {
+                [embeddedStyle]: embedded,
                 'rounded-md': rounded,
-            }, !active && !disabled && !isLoading
-                ? style(buttonStyleMap[version], secondaryButtonStyleMap[version])
-                : '', className), type: type, role: role, onClick: onClick, children: [isLoading ? jsx(Loader, { blur: true, size: "small" }) : null, children] }));
+                'bg-main-gray text-main-disabled cursor-not-allowed': disabled,
+            }, className), type: type, role: role, "data-theme": dataTheme, ...aspectsAttrs, onClick: handleClick, children: children }));
     });
 
     const CloseButton = JSX(({ className, onClose }) => (jsx("button", { className: style('flex justify-center items-center w-12 h-12 p-2xs bg-transparent border-none', className), onClick: onClose, title: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C", type: "button", children: jsx(Icon, { name: "CloseIcon", width: "20", height: "20", iconVersion: "gray" }) })));
@@ -2944,12 +2957,16 @@
         return { ...formState, typeForm: { key: typeForm, text: '' } };
     };
 
-    const Footnote = JSX(({ text, link }) => (jsxs(Paragraph, { size: "text-l", font: "font-light", color: "text-secondary-text", children: [text ? jsx(Text, { children: text }) : null, link ? (jsx(LinkButton, { 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-left text-primary-main", children: jsx(Text, { children: link.text }) })) : null] })));
+    const Loader = JSX(({ color = 'text-primary-main', position = 'absolute', blur = true, size = 'big' }) => (jsx("div", { className: style('flex justify-center items-center h-full w-full z-50', position, {
+            'backdrop-blur': blur,
+        }), children: jsx("div", { className: style('inline-block', 'animate-spin rounded-full', 'border-solid border-current', 'border-r-transparent', size === 'small' ? 'border-4 h-8 w-8' : 'border-8 h-28 w-28', color), role: "status" }) })));
 
-    const renderSubmitButton$1 = (button, className) => (jsx(Button, { className: style('w-full @xl:w-auto', className), type: "submit", children: button?.text ? button.text : 'Отправить заявку' }));
+    const SubmitButton$1 = JSX(({ isLoading, disabled, children, ...rest }) => (jsxs(Button, { type: "submit", disabled: isLoading || disabled, ...rest, children: [isLoading ? jsx(Loader, { blur: true, size: "small" }) : null, children] })));
+
+    const Footnote = JSX(({ text, link }) => (jsxs(Paragraph, { size: "text-l", font: "font-light", color: "text-secondary-text", children: [text ? jsx(Text, { children: text }) : null, link ? (jsx(LinkButton, { 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-left text-primary-main", children: jsx(Text, { children: link.text }) })) : null] })));
 
     const agreementText = 'Нажимая кнопку, вы подтверждаете согласие с ';
-    const renderAgreementSubmit = (consentDataProcessing, link, button) => (jsxs("div", { className: "flex col-span-2 gap-xs flex-col w-full items-baseline", children: [consentDataProcessing ? (jsxs("div", { children: [jsxs("div", { className: "flex gap-3 items-center", children: [jsx(Checkbox, { ...consentDataProcessing }), jsx(Footnote, { link: link })] }), renderErrorText(withValidator(consentDataProcessing, agreementValidator).error)] })) : (jsx(Footnote, { text: agreementText, link: link })), renderSubmitButton$1(button)] }));
+    const renderAgreementSubmit = (consentDataProcessing, link, button) => (jsxs("div", { className: "flex col-span-2 gap-xs flex-col w-full items-baseline", children: [consentDataProcessing ? (jsxs("div", { children: [jsxs("div", { className: "flex gap-3 items-center", children: [jsx(Checkbox, { ...consentDataProcessing }), jsx(Footnote, { link: link })] }), renderErrorText(withValidator(consentDataProcessing, agreementValidator).error)] })) : (jsx(Footnote, { text: agreementText, link: link })), jsx(SubmitButton$1, { className: "w-full @xl:w-auto", children: button?.text ? button.text : 'Отправить заявку' })] }));
 
     const renderContacts = () => (jsxs("div", { className: "space-y-m", children: [jsx(Heading, { headingType: "h6", title: "\u0418\u043B\u0438 \u0441\u0432\u044F\u0436\u0438\u0442\u0435\u0441\u044C \u0441 \u043D\u0430\u043C\u0438 \u0443\u0434\u043E\u0431\u043D\u044B\u043C \u0441\u043F\u043E\u0441\u043E\u0431\u043E\u043C", className: "@xl:text-center" }), jsxs("div", { className: "flex sm:justify-center 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": "\u0442\u0435\u043B\u0435\u0444\u043E\u043D 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": "\u043F\u043E\u0447\u0442\u0430 ved@rshb.ru", href: `mailto:ved@rshb.ru`, children: [jsx(Img, { image: { icon: 'MailIcon' }, width: "24", height: "24" }), jsx("span", { children: "ved@rshb.ru" })] })] })] }));
 
@@ -3279,6 +3296,12 @@
     const mapByIndex = (points, index) => points.map((_) => _.coords?.[index]);
     const getArraySumAndAverage = (arr) => arr.length && arr.reduce((a, b) => a + b) / arr.length;
 
+    const getTraceId = () => {
+        const result = new Uint8Array(8);
+        globalThis.crypto.getRandomValues(result);
+        return result.reduce((acc, _) => `${acc}${_.toString(16).padStart(2, '0')}`, '');
+    };
+
     const fetchRetailJSON = async (url, method, body) => {
         try {
             const response = await doRequest(url, method, body);
@@ -3290,10 +3313,14 @@
         }
     };
     async function doRequest(url, method, body) {
+        const traceId = getTraceId();
         return globalThis?.fetch?.(`${RETAIL_API_BASE_URI}${url}`, {
             method,
             headers: {
                 'Content-Type': 'application/json',
+                'X-B3-Sampled': '1',
+                'X-B3-Spanid': traceId,
+                'X-B3-Traceid': traceId,
                 ...getAuthorizationHeaders(),
             },
             credentials: 'include',
@@ -3333,8 +3360,14 @@
 
     const CardRow = JSX(({ className, children }) => (jsx("div", { className: style('flex flex-col sm:flex-row sm:border-t sm:border-solid sm:border-main-divider py-xl gap-x-6xl gap-y-xl', className), children: children })));
 
+    const ButtonTitle = JSX(({ className, children }) => (jsx("span", { className: style('inline-flex items-center text-start gap-s group-hover/btn-embedded:text-primary-main', className), children: children })));
+
+    const ToggleIcon = JSX(({ isUnfolded, ...rest }) => (jsx(Icon, { name: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', size: "small", iconVersion: "", ...rest })));
+
+    const DefaultFoldButton = JSX(({ className, isUnfolded, label = isUnfolded ? 'Скрыть' : 'Развернуть', embedded, ...rest }) => (jsxs(Button, { className: style({ 'text-h4': !embedded }, className), rounded: false, embedded: embedded, ...rest, children: [jsx(ButtonTitle, { children: label }), jsx(ToggleIcon, { isUnfolded: isUnfolded, iconVersion: embedded ? 'color' : '' })] })));
+
     // TODO Не особо полезно, в итоге
-    const Foldable = JSX(({ className, children }) => (jsx("div", { className: style(className), role: "group", children: children })));
+    const Foldable = JSX(({ className, role = 'group', children }) => (jsx("div", { className: style(className), role: role, children: children })));
 
     function useResizeObserver(callback, deps) {
         const ref = useRef(null);
@@ -3366,16 +3399,9 @@
         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 IconButton = JSX(({ className, name, text, data, onClick }) => {
-        const aspectsAttrs = useMemo(() => getAspectsAttributes(data), [data]);
-        return (jsxs("button", { className: style('text-primary-main flex justify-between items-center border-none px-m', text ? 'pt-lg' : 'py-2xs', className), type: "button", ...aspectsAttrs, onClick: onClick, children: [text ? jsx("div", { className: "pr-m", children: text }) : null, jsx(Icon, { className: "text-primary-text", name: name, width: "16", height: "16" })] }));
-    });
-
-    const renderFoldButton$2 = ({ isUnfolded, onToggle }) => (jsx(IconButton, { className: "w-full border-b border-solid border-main-divider", name: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', text: isUnfolded ? 'Скрыть' : 'Подробнее', onClick: onToggle }));
-
     const FoldableCardContent = JSX(({ children }) => {
         const [isUnfolded, { toggle }] = useBool(false);
-        return (jsxs(Foldable, { className: "block sm:hidden", children: [jsx(FoldableSection, { isUnfolded: isUnfolded, children: children }), renderFoldButton$2({ isUnfolded, onToggle: toggle })] }));
+        return (jsxs("div", { children: [jsx("div", { className: "hidden sm:block", children: children }), jsxs(Foldable, { className: "block sm:hidden", children: [jsx(FoldableSection, { isUnfolded: isUnfolded, children: children }), jsx(DefaultFoldButton, { className: "w-full my-m mr-m border-b border-solid border-main-divider", label: isUnfolded ? 'Скрыть' : 'Подробнее', isUnfolded: isUnfolded, embedded: true, onClick: toggle })] })] }));
     });
 
     const getScheduleDescription = (workScheduleWeek) => {
@@ -3512,7 +3538,7 @@
             return null;
         }
         const workScheduleWeek = getWorkScheduleWeek(branch.workSchedule);
-        return (jsxs("div", { className: "bg-white col-span-12 p-3xl sm:border-green sm:border", children: [jsxs("div", { className: "sm:flex sm:justify-between", children: [jsxs("div", { children: [jsx(Text, { size: "text-h4", children: branch.name }), branch.address ? (jsxs("div", { className: "flex pb-xl pt-xs gap-2xs", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24" }), jsx(Text, { size: "text-l", children: branch.address })] })) : null] }), renderCurrentDaySchedule(workScheduleWeek)] }), jsx("div", { className: "hidden sm:block", children: renderCardContent$1(branch) }), jsx(FoldableCardContent, { children: renderCardContent$1(branch) })] }, String(i)));
+        return (jsxs("div", { className: "bg-white col-span-12 p-3xl sm:border-green sm:border", children: [jsxs("div", { className: "sm:flex sm:justify-between", children: [jsxs("div", { children: [jsx(Text, { size: "text-h4", children: branch.name }), branch.address ? (jsxs("div", { className: "flex pb-xl pt-xs gap-2xs", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24" }), jsx(Text, { size: "text-l", children: branch.address })] })) : null] }), renderCurrentDaySchedule(workScheduleWeek)] }), jsx(FoldableCardContent, { children: renderCardContent$1(branch) })] }, String(i)));
     };
     const renderCardContent$1 = ({ phone, fax, phoneBusiness, phoneNatural, phoneCallCentre, phoneCurrencyControl, workSchedule, exchangeRate, }) => {
         const workScheduleWeek = getWorkScheduleWeek(workSchedule);
@@ -4314,12 +4340,14 @@
 
     const GENDERS = ['male', 'female'];
     const getGenderFromName = async (name) => {
-        const res = await fetchRetailJSON('/suggestions/suggest/fio', 'POST', {
+        const res = await getDaDataHints({
+            url: '/suggest/fio',
+            requestData: {
+                parts: ['NAME'],
+            },
             query: name,
-            count: 1,
-            parts: ['NAME'],
         });
-        const gender = res?.suggestions[0]?.data?.gender?.toLowerCase() || '';
+        const gender = res[0]?.data?.gender?.toLowerCase() || '';
         return GENDERS.includes(gender) ? gender : '';
     };
 
@@ -4455,7 +4483,7 @@
             ?.filter((_) => _.required)
             ?.some((_) => Boolean(withValidator(field(_?.name), validatorObj[_?.name]).error)), [inputs]);
         const [isUnfolded, { toggle }] = useBool(true);
-        return (jsx("div", { className: "w-fit", children: jsxs(Foldable, { children: [jsxs("div", { className: "flex items-start", children: [jsxs("div", { children: [jsx(Checkbox, { text: CONSENT_ALL_DOCS_TEXT, value: isChecked, onChange: handleGeneralToggle }, key), renderErrorText(hasValidationErrors ? CONSENT_REQUIRED : '')] }), jsx(IconButton, { name: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', onClick: toggle })] }), jsx(FoldableSection, { className: "flex flex-col pl-2xl", isUnfolded: isUnfolded, children: inputs.map(getField(field, {}, InputsConsentsMap)) })] }) }));
+        return (jsx("div", { className: "w-fit", children: jsxs(Foldable, { children: [jsxs("div", { className: "flex items-start", children: [jsxs("div", { children: [jsx(Checkbox, { text: CONSENT_ALL_DOCS_TEXT, value: isChecked, onChange: handleGeneralToggle }, key), renderErrorText(hasValidationErrors ? CONSENT_REQUIRED : '')] }), jsx(Button, { embedded: true, onClick: toggle, children: jsx(ToggleIcon, { className: "p-2xs", iconVersion: "color", isUnfolded: isUnfolded }) })] }), jsx(FoldableSection, { className: "flex flex-col pl-2xl", isUnfolded: isUnfolded, children: inputs.map(getField(field, {}, InputsConsentsMap)) })] }) }));
     });
 
     const renderInputs$2 = ({ field, inputs }) => {
@@ -4467,7 +4495,7 @@
         restInputs: inputs.filter(({ name }) => !Object.keys(CONSENTS).includes(String(name))),
     });
 
-    const renderSubmitButton = (button, isSending) => (jsx(Button, { className: style('w-full @xl:w-auto'), type: "submit", isLoading: isSending, children: button?.text ? button.text : 'Отправить заявку' }));
+    const renderSubmitButton = (button, isSending) => (jsx(SubmitButton$1, { className: "w-full @xl:w-auto", isLoading: isSending, children: button?.text ? button.text : 'Отправить заявку' }));
 
     const createDraftTask = async (body) => {
         const res = await fetchRetailJSON('/user-data/createDraftTask', 'POST', body);
@@ -4574,7 +4602,7 @@
             (async () => setCaptcha(URL.createObjectURL(await createCaptcha(phoneNumber))))();
         }, []);
         useEffect(handleCreateCaptcha, []);
-        return (jsx(Dialog, { className: "my-6xl max-w-lg w-full min-h-fit mx-auto rounded-lg", head: jsx(Logo, {}), onClose: onClose, children: jsxs("div", { className: "flex flex-col gap-lg items-center rounded-md", children: [jsxs("div", { className: "flex h-36 w-72", children: [jsx("img", { className: "grow", src: captcha }), jsx("div", { onClick: handleCreateCaptcha, className: "flex w-8 items-center justify-center cursor-pointer", children: jsx(Icon, { iconVersion: "normal", name: "RefreshIcon" }) })] }), jsx(Input, { className: "w-[300px]", onChange: setCode, value: code, placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u043E\u0434 \u0441 \u043A\u0430\u0440\u0442\u0438\u043D\u043A\u0438" }), hasError ? jsx("div", { className: "text-error", children: "\u041D\u0435\u0432\u0435\u0440\u043D\u044B\u0439 \u043A\u043E\u0434" }) : null, jsxs("div", { className: "flex w-[310px] justify-between", children: [jsx(Button, { onClick: close, version: "secondary", children: "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F" }), jsx(Button, { type: "submit", disabled: !code, onClick: handleCheckCaptcha, version: "secondary", children: "\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C" })] }), isLoading ? jsx(Loader, { blur: false }) : null] }) }));
+        return (jsx(Dialog, { className: "my-6xl max-w-lg w-full min-h-fit mx-auto rounded-lg", head: jsx(Logo, {}), onClose: onClose, children: jsxs("div", { className: "flex flex-col gap-lg items-center rounded-md", children: [jsxs("div", { className: "flex h-36 w-72", children: [jsx("img", { className: "grow", src: captcha }), jsx(Button, { className: "w-8", embedded: true, onClick: handleCreateCaptcha, children: jsx(Icon, { iconVersion: "normal", name: "RefreshIcon" }) })] }), jsx(Input, { className: "w-[300px]", onChange: setCode, value: code, placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u043E\u0434 \u0441 \u043A\u0430\u0440\u0442\u0438\u043D\u043A\u0438" }), hasError ? jsx("div", { className: "text-error", children: "\u041D\u0435\u0432\u0435\u0440\u043D\u044B\u0439 \u043A\u043E\u0434" }) : null, jsxs("div", { className: "flex w-[310px] justify-between", children: [jsx(Button, { version: "secondary", onClick: close, children: "\u0412\u0435\u0440\u043D\u0443\u0442\u044C\u0441\u044F" }), jsx(SubmitButton$1, { version: "secondary", disabled: !code, onClick: handleCheckCaptcha, children: "\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C" })] }), isLoading ? jsx(Loader, { blur: false }) : null] }) }));
     });
 
     const Timer = JSX(({ time, setTime, className }) => {
@@ -5417,26 +5445,13 @@
 
     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 = 'pc', 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 }) => (jsx(DefaultFoldButton, { icon: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', label: isUnfolded ? 'Скрыть' : 'Развернуть', onClick: onToggle }));
-
     const resultsGridStyle = 'space-y-px lg:space-y-0 lg:grid lg:grid-cols-12 gap-2xs';
-    const GridBlocks = JSX(({ topItemsCount = 0, label = '', block, blocksToRender = [], ...rest }) => {
+    const GridBlocks = JSX(({ topItemsCount = 0, label, block, blocksToRender = [], ...rest }) => {
         const [visibleBlocks, hiddenBlocks] = topItemsCount > 0
             ? [blocksToRender.slice(0, topItemsCount), blocksToRender.slice(topItemsCount)]
             : [blocksToRender, []];
         const [isUnfolded, { toggle }] = useBool(false);
-        return (jsxs("div", { className: style('space-y-2xs', { hidden: !blocksToRender.length }), children: [jsxs("div", { className: style(resultsGridStyle), children: [renderBlocksList(visibleBlocks, { ...rest.options, parent: block }), isOdd(visibleBlocks.length) ? jsx(AdTile, { className: "col-span-6", ...rest }) : null] }), jsxs(Foldable, { children: [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] }), jsx(DefaultFoldButton, { className: style({ hidden: topItemsCount < 1 }), dataTheme: rest.options?.page?.colorPalette, disabled: !hiddenBlocks?.length, label: label, icon: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', onClick: toggle })] })] }));
+        return (jsxs("div", { className: style('space-y-2xs', { hidden: !blocksToRender.length }), children: [jsxs("div", { className: style(resultsGridStyle), children: [renderBlocksList(visibleBlocks, { ...rest.options, parent: block }), isOdd(visibleBlocks.length) ? jsx(AdTile, { className: "col-span-6", ...rest }) : null] }), jsxs(Foldable, { children: [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] }), jsx(DefaultFoldButton, { className: style('w-full', { hidden: topItemsCount < 1 }), label: label, isUnfolded: isUnfolded, disabled: !hiddenBlocks?.length, dataTheme: rest.options?.page?.colorPalette, onClick: toggle })] })] }));
     });
 
     const getBorderStyle = (showBorder = false) => showBorder
@@ -5837,7 +5852,7 @@
         return icon ? (jsx("div", { style: {
                 width: `${widthAndHeight}px`,
                 height: `${widthAndHeight}px`,
-            }, className: style('rounded-icon object-fit flex justify-center items-center', iconBgStyles[iconBgVersion], className), children: jsx(Icon, { ...rest, width: "54%", height: "54%", name: icon }) })) : null;
+            }, className: style('rounded-icon object-fit flex justify-center items-center', iconBgStyles[iconBgVersion], className), children: jsx(Icon, { ...rest, width: "54%", name: icon }) })) : null;
     });
 
     const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => {
@@ -6594,7 +6609,7 @@
         useEffect(() => {
             setDisabled(amount <= 0);
         }, [amount]);
-        return (jsxs(BlockWrapper, { className: style('flex flex-col items-center', className), defaultPadding: "p-6xl", ...rest, children: [title ? (jsx(Heading, { className: "pb-lg xl:pb-4xl self-start xl:self-center", headingType: "h3", title: title })) : null, jsxs("form", { className: "w-full xl:max-w-[468px]", method: "POST", onSubmit: onSubmit, children: [jsx(CurrencyInput, { valid: !isDisabled, label: label, max: MAX_AMOUNT, min: MIN_AMOUNT, ...field('amount', { parse: Number, format: String }) }), jsx("input", { type: "hidden", name: "amount", value: amount }), button?.text ? (jsx(Button, { className: "w-full mt-lg", type: "submit", disabled: isDisabled, children: button.text })) : null] })] }));
+        return (jsxs(BlockWrapper, { className: style('flex flex-col items-center', className), defaultPadding: "p-6xl", ...rest, children: [title ? (jsx(Heading, { className: "pb-lg xl:pb-4xl self-start xl:self-center", headingType: "h3", title: title })) : null, jsxs("form", { className: "w-full xl:max-w-[468px]", method: "POST", onSubmit: onSubmit, children: [jsx(CurrencyInput, { valid: !isDisabled, label: label, max: MAX_AMOUNT, min: MIN_AMOUNT, ...field('amount', { parse: Number, format: String }) }), jsx("input", { type: "hidden", name: "amount", value: amount }), button?.text ? (jsx(SubmitButton$1, { className: "w-full mt-lg", disabled: isDisabled, children: button.text })) : null] })] }));
     });
 
     const ITEMS_GAP = 16;
@@ -6792,10 +6807,10 @@
     };
 
     const CarouselTariffsCard = JSX(({ className = '', title, align = 'text-center', icon, button, visibleCellsCount = 1, cardCells = [], options, data, ...rest }) => {
-        const cellsNode = cardCells.map(renderCardInfo);
-        const [visibleCells, hiddenCells] = visibleCellsCount > 0
+        const cellsNode = useMemo(() => cardCells.map(renderCardInfo), [cardCells]);
+        const [visibleCells, hiddenCells] = useMemo(() => visibleCellsCount > 0
             ? [cellsNode.slice(0, visibleCellsCount), cellsNode.slice(visibleCellsCount)]
-            : [cellsNode, []];
+            : [cellsNode, []], [visibleCellsCount, cellsNode]);
         const [isVisible, setIsVisible] = useState(false);
         useEffect(() => carouselTariffsCardEventBus.subscribe('fold', (event) => {
             if (event && options?.parent && event.parent === options?.parent) {
@@ -6809,11 +6824,8 @@
                 parent: options?.parent,
             });
         }, [isVisible, options?.parent]);
-        return (jsxs(BlockWrapper, { className: style('flex flex-col', className), defaultPadding: "p-2xl", ...rest, children: [isIcon(icon) ? (jsx("div", { className: "self-center", children: jsx(Img, { image: icon }) })) : null, title ? (jsx(Heading, { className: style('pt-xs', align), headingType: "h5", title: title })) : null, button?.text ? jsx(LinkButton, { className: "w-full mt-m mb-lg", ...button }) : null, hiddenCells.length ? (jsxs(Foldable, { children: [jsxs("div", { children: [visibleCells, jsx(FoldableSection, { isUnfolded: isVisible, children: hiddenCells })] }), cardCells.length >= visibleCellsCount ? (jsx(FoldButton, { isUnfolded: isVisible, data: data, onClick: handleFold })) : null] })) : (jsx("div", { children: visibleCells }))] }));
+        return (jsxs(BlockWrapper, { className: style('flex flex-col', className), defaultPadding: "p-2xl", ...rest, children: [jsx(Img, { className: "self-center", image: icon }), title ? (jsx(Heading, { className: style('pt-xs', align), headingType: "h5", title: title })) : null, button?.text ? jsx(LinkButton, { className: "w-full mt-m mb-lg", ...button }) : null, hiddenCells.length ? (jsxs(Foldable, { children: [jsxs("div", { children: [visibleCells, jsx(FoldableSection, { isUnfolded: isVisible, children: hiddenCells })] }), cardCells.length >= visibleCellsCount ? (jsx(DefaultFoldButton, { className: "w-full mt-m", label: isVisible ? 'Скрыть' : 'Подробнее о тарифе', isUnfolded: isVisible, embedded: true, data: data, onClick: handleFold })) : null] })) : (jsx("div", { children: visibleCells }))] }));
     });
-    const FoldButton = JSX(({ data, isUnfolded, onClick }) => (jsx(IconButton, { className: "w-full", ...(isUnfolded
-            ? { name: 'ArrowUpIcon', text: 'Скрыть', data }
-            : { name: 'ArrowDownIcon', text: 'Подробнее о тарифе' }), onClick: onClick })));
 
     const PORTAL_NATURAL_URL = '/';
     const UPDATING_INTERVAL = 60000 * 4;
@@ -7052,7 +7064,7 @@
     const StepsNavigationButtons$1 = JSX(({ step, isSending, onPrevStep }) => {
         const isFirstStep = step === 0;
         const isFinalStep = step === 5;
-        return (jsxs("div", { className: "flex justify-between gap-m", children: [jsx(Button, { onClick: onPrevStep, type: "button", version: "secondary", disabled: isFirstStep, children: "\u041D\u0430\u0437\u0430\u0434" }), jsx(Button, { isLoading: isSending, type: "submit", children: isFinalStep ? 'Отправить заявку' : 'Далее' })] }));
+        return (jsxs("div", { className: "flex justify-between gap-m", children: [jsx(Button, { onClick: onPrevStep, type: "button", version: "secondary", disabled: isFirstStep, children: "\u041D\u0430\u0437\u0430\u0434" }), jsx(SubmitButton$1, { isLoading: isSending, children: isFinalStep ? 'Отправить заявку' : 'Далее' })] }));
     });
 
     const getAdditionalInfoData = (formData) => {
@@ -7929,7 +7941,7 @@
     const StepsNavigationButtons = JSX(({ step, onPrevStep, isSending }) => {
         const isFirstStep = step === 0;
         const isFinalStep = step === 5;
-        return (jsxs("div", { className: 'flex justify-between gap-m', children: [jsx(Button, { onClick: onPrevStep, type: "button", version: "secondary", disabled: isFirstStep, children: "\u041D\u0430\u0437\u0430\u0434" }), jsx(Button, { type: "submit", isLoading: isSending, children: isFinalStep ? 'Отправить заявку' : 'Далее' })] }));
+        return (jsxs("div", { className: 'flex justify-between gap-m', children: [jsx(Button, { onClick: onPrevStep, type: "button", version: "secondary", disabled: isFirstStep, children: "\u041D\u0430\u0437\u0430\u0434" }), jsx(SubmitButton$1, { isLoading: isSending, children: isFinalStep ? 'Отправить заявку' : 'Далее' })] }));
     });
 
     const PAYMENT_TYPE_DATA = {
@@ -8314,12 +8326,10 @@
 
     const DepositoryFilter = JSX(({ field, onClearFilter, filtrationState }) => (jsxs("div", { className: "grid grid-cols-12 mb-3xl @lg:space-x-xl", children: [jsx(SearchInput, { className: "col-span-12 @lg:col-span-4 mt-auto", placeholder: "\u041F\u043E\u0438\u0441\u043A", ...field('query') }), jsx(DatePicker, { className: "col-span-12 @lg:col-span-3 mt-4 @lg:mt-0", label: "\u041F\u0435\u0440\u0438\u043E\u0434 \u043E\u0442", maxDate: filtrationState.endDate, ...field('startDate') }), jsx(DatePicker, { className: "col-span-12 @lg:col-span-3 mt-4 @lg:mt-0", label: "\u041F\u0435\u0440\u0438\u043E\u0434 \u0434\u043E", minDate: filtrationState.startDate, ...field('endDate') }), jsx("div", { className: "col-span-12 @lg:col-span-2 mt-8 @lg:mt-auto", children: jsx(Button, { type: "reset", className: "w-full", version: "secondary", onClick: onClearFilter, children: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C" }) })] })));
 
-    const renderRoundedIcon = (icon, iconBgVersion) => (jsx(RoundedIcon, { ...icon, iconBgVersion: iconBgVersion, className: "shrink-0" }));
-
     const DepositoryItem = JSX(({ title, timestamp, publicId }) => {
         const link = useLink();
         const { href } = link({ href: `${API_BASE_URI}/depository/${publicId}/file` });
-        return (jsxs("div", { className: "flex gap-3 items-center py-lg border-gray border-opacity-50 border-b", children: [renderRoundedIcon({ icon: 'DocDownloadIcon', iconVersion: 'black' }), jsxs("div", { className: "flex flex-col gap-x-6xl lg:flex-row lg:items-center", children: [timestamp ? (jsx(Text, { size: "text-m", "font-weight": "font-light", children: formatDate(timestamp) })) : null, jsx("a", { className: "text-h6 hover:text-primary-active", href: href, download: true, "aria-label": "\u0421\u043A\u0430\u0447\u0430\u0442\u044C", children: title })] })] }, publicId));
+        return (jsxs("div", { className: "flex gap-3 items-center py-lg border-gray border-opacity-50 border-b", children: [jsx(RoundedIcon, { className: "shrink-0", icon: "DocDownloadIcon", iconVersion: "black" }), jsxs("div", { className: "flex flex-col gap-x-6xl lg:flex-row lg:items-center", children: [timestamp ? (jsx(Text, { size: "text-m", "font-weight": "font-light", children: formatDate(timestamp) })) : null, jsx("a", { className: "text-h6 hover:text-primary-active", href: href, download: true, "aria-label": "\u0421\u043A\u0430\u0447\u0430\u0442\u044C", children: title })] })] }, publicId));
     });
 
     const DEPOSITARY_URL = `${API_BASE_URI}/depository`;
@@ -8596,46 +8606,14 @@
         return (jsx("li", { className: "list-none", children: jsx("a", { className: "hover:text-primary-main font-light", role: "link", href: href, target: target || '_self', onClick: onClick, ...getAspectsAttributes(dataFooter), children: text ? text : null }) }, String(i)));
     };
 
-    const AccordionFoldButton = JSX(({ label, labelIconBgVersion, icon, onToggle, labelIcon }) => (jsx(TextWithIcon, { tag: "button", className: style('border-none bg-transparent items-center group/button', labelIcon?.icon ? 'py-xs' : 'py-lg'), onClick: onToggle, textNode: jsxs("div", { className: "flex items-center text-start group-hover/button:text-primary-main gap-s", children: [renderRoundedIcon(labelIcon, labelIconBgVersion), label ? (jsx(Text, { size: "text-h6", font: "font-normal", children: label })) : null] }), iconNode: icon ? jsx(Icon, { name: icon, iconVersion: "color", width: "24", height: "24" }) : null })));
-
-    const getFoldableStyles = (isMobile = false) => isMobile ? 'flex flex-wrap group-last:last:pb-0' : 'grid grid-cols-12 [&>*]:pb-m';
-
-    const getIconName = (isUnfolded = false, isMobile = false) => isMobile ? getMobileName(isUnfolded) : getDesktopName(isUnfolded);
-    const getDesktopName = (isUnfolded = false) => (isUnfolded ? 'MinusIcon' : 'PlusIcon');
-    const getMobileName = (isUnfolded = false) => isUnfolded ? 'ArrowUpSolidIcon' : 'ArrowDownSolidIcon';
-
-    const RollupItem = UniBlock(({ className = '', isExpanded, isFoldButtonOnTop = true, label = 'Развернуть', labelIcon, labelIconBgVersion, foldButtonVersion = 'default', 
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    version, role, ...rest }) => {
-        const isMobile = useMobileMode();
-        const [isUnfolded, { toggle }] = useBool(isExpanded);
-        const foldableSection = (jsx(FoldableSection, { className: style('gap-lg', getFoldableStyles(isMobile)), isUnfolded: isUnfolded, children: renderChildren({
-                ...rest,
-                extraProps: { className: 'w-full', padding: 'p-0' },
-            }) }));
-        const foldButton = renderFoldButton$1({
-            foldButtonVersion,
-            label,
-            labelIcon,
-            labelIconBgVersion,
-            isMobile,
-            isUnfolded,
-            onToggle: toggle,
-        });
-        return (jsx(BlockWrapper, { className: style('w-full border-0 border-b border-solid border-main-divider last:border-b-0', className), defaultPadding: "p-0", tag: "div", version: "transparent", role: role, ...rest, children: jsxs(Foldable, { children: [isFoldButtonOnTop ? foldButton : foldableSection, isFoldButtonOnTop ? foldableSection : foldButton] }) }));
-    }, {
-        childrenTypes: { exclude: ['RollupItem'] },
-    });
-    const renderFoldButton$1 = ({ foldButtonVersion, label: defaultLabel, labelIcon, labelIconBgVersion, isUnfolded, isMobile = false, onToggle, }) => {
-        const label = defaultLabel || (isUnfolded ? 'Скрыть' : 'Развернуть');
-        const icon = getIconName(isUnfolded, isMobile);
-        return foldButtonVersion === 'accordion' ? (jsx(AccordionFoldButton, { label: label, labelIcon: labelIcon, labelIconBgVersion: labelIconBgVersion, icon: icon, onToggle: onToggle })) : (jsx(DefaultFoldButton, { label: label, icon: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', onClick: onToggle }));
-    };
-
     const Sitemap = JSX(({ navigationItems }) => (jsx("div", { className: "w-full", role: "menu", children: renderTopItems(navigationItems) })));
     const renderTopItems = (topItems) => topItems
         ?.filter((_) => _.icon?.icon)
-        .map((item, i) => (jsx(RollupItem, { foldButtonVersion: "accordion", label: item?.text, labelIcon: item?.icon, role: "menuitem", children: item.items ? jsx(LinkList, { items: item.items }) : null }, String(i))));
+        .map((item, i) => (jsx(MobileTopItem, { className: "w-full border-0 border-b border-solid border-main-divider last:border-b-0", item: item }, String(i))));
+    const MobileTopItem = JSX(({ className, item }) => {
+        const [isUnfolded, { toggle }] = useBool(false);
+        return (jsxs(Foldable, { className: className, role: "menuitem", children: [jsxs(Button, { className: style('w-full', item.icon?.icon ? 'py-xs' : 'py-lg'), embedded: true, onClick: toggle, children: [jsxs(ButtonTitle, { children: [jsx(RoundedIcon, { className: "shrink-0", ...item.icon }), jsx(Text, { size: "text-h6", font: "font-normal", children: item.text })] }), jsx(ToggleIcon, { iconVersion: "color", size: "medium", isUnfolded: isUnfolded })] }), jsx(FoldableSection, { className: "flex flex-wrap gap-lg group-last:last:pb-0", isUnfolded: isUnfolded, children: item.items ? jsx(LinkList, { items: item.items }) : null })] }));
+    });
 
     const Contacts = JSX(({ className = '', items = [] }) => items?.length ? (jsx("div", { className: style('space-y-m', className), children: items.map(renderContactsGroup) })) : null);
     const renderContactsGroup = (item, i) => (jsxs("div", { className: "space-y-m", children: [jsx("div", { children: jsx(Text, { size: "text-l", font: "font-medium", children: item?.title }) }), jsx("div", { className: "space-y-m", children: item.items?.map(renderContact) })] }, String(i)));
@@ -8999,10 +8977,8 @@
             ? [filtersCheckbox.slice(0, visibleFiltersNum), filtersCheckbox.slice(visibleFiltersNum)]
             : [filtersCheckbox, []];
         const [isUnfolded, { toggle }] = useBool(false);
-        return (jsx("div", { children: filters?.length ? (jsx("div", { children: jsxs(Foldable, { children: [jsxs("div", { children: [jsx("div", { className: COMMON_FILTERS_STYLES, children: visibleFilters }), jsx(FoldableSection, { className: COMMON_FILTERS_STYLES, isUnfolded: isUnfolded, children: hiddenFilters })] }), renderFoldButton(reset, onlyOffice)({ isUnfolded, onToggle: toggle })] }) })) : null }));
+        return (jsx("div", { children: filters?.length ? (jsx("div", { children: jsxs(Foldable, { children: [jsxs("div", { children: [jsx("div", { className: COMMON_FILTERS_STYLES, children: visibleFilters }), jsx(FoldableSection, { className: COMMON_FILTERS_STYLES, isUnfolded: isUnfolded, children: hiddenFilters })] }), jsxs("div", { className: "flex space-x-lg", children: [onlyOffice ? (jsx(DefaultFoldButton, { label: isUnfolded ? 'Меньше фильтров' : 'Больше фильтров', isUnfolded: isUnfolded, embedded: true, onClick: toggle })) : null, jsxs(Button, { embedded: true, onClick: reset, children: [jsx(ButtonTitle, { children: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440" }), jsx(Icon, { name: "CloseIcon", size: "small" })] })] })] }) })) : null }));
     });
-    // TODO Столько разных кнопок с иконками, но эта самая творчески-ударённая реализация))
-    const renderFoldButton = (reset, onlyOffice = false) => ({ isUnfolded, onToggle }) => (jsxs("div", { className: "flex space-x-lg", children: [onlyOffice ? (jsx(LinkButton, { version: "transparent", className: "text-secondary-text [&>*]:p-0", appendRight: jsx(Icon, { name: isUnfolded ? 'ArrowUpIcon' : 'ArrowDownIcon', width: "16", height: "16" }), text: isUnfolded ? 'Меньше фильтров' : 'Больше фильтров', onClick: onToggle })) : null, jsx(LinkButton, { version: "transparent", className: "text-secondary-text [&>*]:p-0", onClick: reset, children: jsxs("div", { className: "flex items-center", children: ["\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440", jsx(Icon, { name: "CloseIcon", width: "16", height: "16", className: "ml-2xs" })] }) })] }));
 
     const renderButtonsGroup = (data, activeButton, onButtonClick) => {
         const allButtonVersion = getVersion(activeButton === 'all');
@@ -9058,14 +9034,13 @@
             },
             { label: 'Регистрационный номер', value: atmCode },
         ];
-        return (jsxs("div", { className: "bg-white col-span-12 p-3xl sm:border-green sm:border", children: [jsxs("div", { className: "sm:flex sm:justify-between", children: [jsxs("div", { children: [jsx(Text, { size: "text-h4", children: capitalize(location) }), address ? (jsxs("div", { className: "flex pb-xl pt-xs gap-2xs", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24" }), jsx(Text, { size: "text-l", children: address })] })) : null] }), jsx("div", { className: "whitespace-nowrap", children: jsx(Badge$1, { color: "green", children: capitalize(workTime) }) })] }), jsx("div", { className: "hidden sm:block", children: jsx(CardRow, { className: "flex-wrap", children: additionalInfo?.map(renderInfo) }) }), jsx(FoldableCardContent, { children: jsx(CardRow, { className: "flex-wrap", children: additionalInfo?.map(renderInfo) }) })] }, String(i)));
+        return (jsxs("div", { className: "bg-white col-span-12 p-3xl sm:border-green sm:border", children: [jsxs("div", { className: "sm:flex sm:justify-between", children: [jsxs("div", { children: [jsx(Text, { size: "text-h4", children: capitalize(location) }), address ? (jsxs("div", { className: "flex pb-xl pt-xs gap-2xs", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24" }), jsx(Text, { size: "text-l", children: address })] })) : null] }), jsx("div", { className: "whitespace-nowrap", children: jsx(Badge$1, { color: "green", children: capitalize(workTime) }) })] }), jsx(FoldableCardContent, { children: jsx(CardRow, { className: "flex-wrap", children: additionalInfo?.map((item, key) => (jsx(CardCell, { ...item }, String(key)))) }) })] }, String(i)));
     };
     const getAtmPoint = ({ address = '', terminalType, atmCode = '' }) => {
         const header = `${capitalize(terminalType)} №${atmCode}`;
         const body = address.toUpperCase();
         return { header, body };
     };
-    const renderInfo = (item, i) => jsx(CardCell, { ...item }, String(i));
 
     const EMPTY_VALUE$2 = [];
     function useAtms(regionCode) {
@@ -9117,7 +9092,7 @@
         if (!workScheduleDescription) {
             return null;
         }
-        return (jsxs("div", { className: "bg-white col-span-12 p-3xl sm:border-yellow sm:border", children: [jsx("div", { className: "sm:flex sm:justify-between", children: jsxs("div", { children: [jsx(Text, { size: "text-h4", children: "\u0423\u0434\u0430\u043B\u0435\u043D\u043D\u043E\u0435 \u0440\u0430\u0431\u043E\u0447\u0435\u0435 \u043C\u0435\u0441\u0442\u043E" }), address ? (jsxs("div", { className: "flex pb-xl pt-xs gap-2xs", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24" }), jsx(Text, { size: "text-l", children: address })] })) : null] }) }), jsx("div", { className: "hidden sm:block", children: renderCardContent(workScheduleDescription) }), jsx(FoldableCardContent, { children: renderCardContent(workScheduleDescription) })] }, String(i)));
+        return (jsxs("div", { className: "bg-white col-span-12 p-3xl sm:border-yellow sm:border", children: [jsx("div", { className: "sm:flex sm:justify-between", children: jsxs("div", { children: [jsx(Text, { size: "text-h4", children: "\u0423\u0434\u0430\u043B\u0435\u043D\u043D\u043E\u0435 \u0440\u0430\u0431\u043E\u0447\u0435\u0435 \u043C\u0435\u0441\u0442\u043E" }), address ? (jsxs("div", { className: "flex pb-xl pt-xs gap-2xs", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24" }), jsx(Text, { size: "text-l", children: address })] })) : null] }) }), jsx(FoldableCardContent, { children: renderCardContent(workScheduleDescription) })] }, String(i)));
     };
     const renderCardContent = (workScheduleDescription) => {
         return (jsxs("div", { children: [jsxs(CardRow, { className: "flex", children: [jsx(CardCell, { label: "\u041E\u043F\u0435\u0440\u0430\u0446\u0438\u0438 \u0434\u043B\u044F \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", children: jsx(Text, { children: "\u041E\u0444\u043E\u0440\u043C\u043B\u0435\u043D\u0438\u0435 \u0438 \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u0435 \u043A\u0440\u0435\u0434\u0438\u0442\u043E\u0432, \u0441\u0447\u0435\u0442\u043E\u0432, \u0432\u043A\u043B\u0430\u0434\u043E\u0432" }) }), jsx(CardCell, { label: "\u041E\u043F\u0435\u0440\u0430\u0446\u0438\u0438 \u0434\u043B\u044F \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", children: jsx(Text, { children: "\u041E\u0444\u043E\u0440\u043C\u043B\u0435\u043D\u0438\u0435 \u0438 \u043E\u0431\u0441\u043B\u0443\u0436\u0438\u0432\u0430\u043D\u0438\u0435 \u0431\u0430\u043D\u043A\u043E\u0432\u0441\u043A\u0438\u0445 \u043A\u0430\u0440\u0442" }) }), jsx(CardCell, { label: "\u041E\u043F\u0435\u0440\u0430\u0446\u0438\u0438 \u0434\u043B\u044F \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", children: jsx(Text, { children: "\u0418\u043D\u0432\u0435\u0441\u0442\u0438\u0446\u0438\u043E\u043D\u043D\u043E\u0435 \u0438 \u043D\u0430\u043A\u043E\u043F\u0438\u0442\u0435\u043B\u044C\u043D\u043E\u0435 \u0441\u0442\u0440\u0430\u0445\u043E\u0432\u0430\u043D\u0438\u0435" }) }), jsx(CardCell, { label: "\u041E\u043F\u0435\u0440\u0430\u0446\u0438\u0438 \u0434\u043B\u044F \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043A\u0438\u0445 \u043B\u0438\u0446", children: jsx(Text, { children: "\u0411\u0435\u0437\u043D\u0430\u043B\u0438\u0447\u043D\u044B\u0435 \u043E\u043F\u0435\u0440\u0430\u0446\u0438\u0438 \u0432 \u0440\u0443\u0431\u043B\u044F\u0445, \u043F\u0435\u0440\u0435\u0432\u043E\u0434\u044B \u0431\u0435\u0437 \u043E\u0442\u043A\u0440\u044B\u0442\u0438\u044F \u0441\u0447\u0451\u0442\u0430" }) })] }), jsx("hr", { className: "text-main-divider pb-xl" }), jsx(CardCell, { label: "\u0420\u0435\u0436\u0438\u043C \u0440\u0430\u0431\u043E\u0442\u044B", className: "max-w-none", children: jsx(Text, { children: workScheduleDescription }) })] }));
@@ -9177,6 +9152,22 @@
         return (jsx(BlockWrapper, { defaultPadding: "p-0", ...rest, children: jsx(RichText, { __html: __html, richVersion: richVersion }) }));
     });
 
+    const getFoldableStyles = (isMobile = false) => isMobile ? 'flex flex-wrap group-last:last:pb-0' : 'grid grid-cols-12 [&>*]:pb-m';
+
+    const RollupItem = UniBlock(({ className = '', isExpanded, isFoldButtonOnTop = true, foldButtonVersion = 'default', label, 
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    version, role, ...rest }) => {
+        const isMobile = useMobileMode();
+        const [isUnfolded, { toggle }] = useBool(isExpanded);
+        const foldableSection = (jsx(FoldableSection, { className: style('gap-lg', getFoldableStyles(isMobile)), isUnfolded: isUnfolded, children: renderChildren({
+                ...rest,
+                extraProps: { className: 'w-full', padding: 'p-0' },
+            }) }));
+        const isAccordion = foldButtonVersion === 'accordion';
+        const foldButton = (jsx(DefaultFoldButton, { className: style('w-full', { 'text-h6 my-lg': isAccordion }), label: label, isUnfolded: isUnfolded, embedded: isAccordion, onClick: toggle }));
+        return (jsx(BlockWrapper, { className: style('w-full border-0 border-b border-solid border-main-divider last:border-b-0', className), defaultPadding: "p-0", tag: "div", version: "transparent", role: role, ...rest, children: jsxs(Foldable, { children: [isFoldButtonOnTop ? foldButton : foldableSection, isFoldButtonOnTop ? foldableSection : foldButton] }) }));
+    }, { childrenTypes: { exclude: ['RollupItem'] } });
+
     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: style(inputValidStyle.split(' ').filter((_) => _ !== 'rounded'), defaultCheckStyle, 'flex justify-center items-center after:block after:w-2.5 after:h-2.5 after:rounded-full rounded-full', 'checked:border-2 checked:!border-primary-main focus:checked:border-primary-main checked:after:bg-primary-main'), type: "radio", value: value, name: name, checked: checked, onChange: (_) => onChange?.(_.target.value), role: "radio" }), text ? jsx(Text, { color: "text-primary-text", children: text }) : null] }) })));
 
     const RadioButtons = JSX(({ className = '' }) => {
@@ -9213,7 +9204,7 @@
     const SafeDepositRentalTotal = JSX(({ days, tariffs = [] }) => {
         const price = calculatePrice(days, tariffs);
         const imageDescription = 'На рисунке изображена пачка листов\nформата А4';
-        return (jsxs("div", { className: "contents @xl:flex flex-col justify-between gap-xl order-2", children: [jsxs("div", { className: "flex flex-col @xl:flex-row gap-x-6xl gap-y-2xl order-5 @xl:order-none py-2xl @xl:py-0 border-t border-main-divider @xl:border-none", children: [renderTotal('Аренда за', days), renderTotal('Цена', price + ' ₽')] }), jsx("div", { className: "@xl:hidden order-3 mb-xs", children: jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: imageDescription }) }), jsxs("div", { className: "flex flex-col items-center gap-s order-3 @xl:order-none mb-xl @xl:mb-0 bg-primary-main py-s @xl:p-3xl text-center", children: [jsx(Img, { image: { icon: 'PackA4Icon' }, className: "@xl:h-60" }), jsx("div", { className: "hidden @xl:inline opacity-80 whitespace-pre-line", children: jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-white", children: imageDescription }) })] })] }));
+        return (jsxs("div", { className: "contents @xl:flex flex-col justify-between gap-xl order-2", children: [jsxs("div", { className: "flex flex-col @xl:flex-row gap-x-6xl gap-y-2xl order-5 @xl:order-none py-2xl @xl:py-0 border-t border-main-divider @xl:border-none", children: [renderTotal('Аренда за', days), renderTotal('Цена', price + ' ₽')] }), jsx("div", { className: "@xl:hidden order-3 mb-xs", children: jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-secondary-text", children: imageDescription }) }), jsxs("div", { className: "flex flex-col items-center gap-s order-3 @xl:order-none mb-xl @xl:mb-0 bg-primary-main py-s @xl:p-3xl text-center", children: [jsx(Icon, { className: "@xl:h-60", name: "PackA4Icon" }), jsx("div", { className: "hidden @xl:inline opacity-80 whitespace-pre-line", children: jsx(Paragraph, { size: "text-s", font: "font-light", color: "text-white", children: imageDescription }) })] })] }));
     });
     const renderTotal = (label, total) => (jsxs("div", { className: "flex justify-between items-center gap-y-xs @xl:flex-col @xl:items-start", children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: label }), jsx("span", { className: "text-l @xl:text-h3 text-primary-text", children: total })] }));
     const calculatePrice = (days, tariffs) => {
@@ -9915,7 +9906,7 @@
         const rows = (rowData || []).map((row, i) => (jsx(TariffsTableRow, { row: row, activeIndex: activeIndex, rowIdx: i, ...rest }, String(i))));
         const [visibleRows, hiddenRows] = hiddenRowsNum > 0 ? [rows.slice(0, -hiddenRowsNum), rows.slice(-hiddenRowsNum)] : [rows, []];
         const [isUnfolded, { toggle }] = useBool(false);
-        return (jsxs(BlockWrapper, { className: style('relative space-y-6xl @4xl:space-y-xl', className), defaultPadding: "p-6xl", ...rest, children: [jsx(Headline, { title: title, description: description, headlineVersion: "M", isEmbedded: true, align: "text-center" }), jsx("div", { className: "space-y-m overflow-hidden", children: hiddenRowsNum > 0 ? (jsxs(Foldable, { children: [jsxs(TariffsTableWrapper, { controls: controls, children: [visibleRows, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenRows })] }), renderDefaultFoldButton({ isUnfolded, onToggle: toggle })] })) : (jsx(TariffsTableWrapper, { controls: controls, children: rows })) })] }));
+        return (jsxs(BlockWrapper, { className: style('relative space-y-6xl @4xl:space-y-xl', className), defaultPadding: "p-6xl", ...rest, children: [jsx(Headline, { title: title, description: description, headlineVersion: "M", isEmbedded: true, align: "text-center" }), jsx("div", { className: "space-y-m overflow-hidden", children: hiddenRowsNum > 0 ? (jsxs(Foldable, { children: [jsxs(TariffsTableWrapper, { controls: controls, children: [visibleRows, jsx(FoldableSection, { isUnfolded: isUnfolded, children: hiddenRows })] }), jsx(DefaultFoldButton, { className: "w-full", isUnfolded: isUnfolded, onClick: toggle })] })) : (jsx(TariffsTableWrapper, { controls: controls, children: rows })) })] }));
     });
 
     const TextBlock = JSX(({ className = '', title, description, iconVersion, __html, richVersion, ...rest }) => (jsxs(BlockWrapper, { className: style('flex gap-s sm:gap-m group-data-secondary:bg-primary-main/10', className), ...rest, children: [iconVersion === 'small' ? renderIcon() : null, jsxs("div", { className: "flex flex-col w-fit gap-2xs sm:gap-xs", children: [title ? (jsx(Text, { size: "text-l", font: "font-normal", color: "text-primary-text group-data-secondary:text-white", children: title })) : null, description ? renderDescription(description) : null, __html ? jsx(RichText, { richVersion: richVersion, __html: __html }) : null] })] })));
@@ -10102,7 +10093,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
 
-    const packageVersion = "0.14.751";
+    const packageVersion = "0.14.752";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;