@redneckz/wildless-cms-uni-blocks 0.14.1026 → 0.14.1028

package/bundle/bundle.umd.js

@@ -400,24 +400,28 @@
         className,
     ].join(' ');
 
-    /* eslint-disable @typescript-eslint/ban-types */
-    const handlerDecorator = (handler) => {
-        return handlerDecorator._impl(handler);
-    };
-    handlerDecorator._impl = (handler) => handler;
-    handlerDecorator.setup = (impl) => {
-        handlerDecorator._impl = impl;
-    };
+    function copy(source, target) {
+        for (const [k, v] of source.entries()) {
+            if (v !== null && v !== undefined) {
+                target.setItem(k, v);
+            }
+            else {
+                target.removeItem(k);
+            }
+        }
+    }
 
-    function useEmitterWithActions(eventBus, type) {
-        const cache = useRef({});
-        return useMemo(() => new Proxy({}, {
-            get(_, actionType) {
-                cache.current ||= {};
-                cache.current[actionType] ||= action => eventBus.fire(type, { ...(action ?? {}), type: actionType });
-                return cache.current[actionType];
+    function replicate(primary, secondary) {
+        copy(primary, secondary);
+        copy(secondary, primary);
+        return primary.bus.watch(({ type, event }) => {
+            if (event !== null && event !== undefined) {
+                secondary.setItem(type, event);
             }
-        }), [eventBus, type]);
+            else {
+                secondary.removeItem(type);
+            }
+        });
     }
 
     class EventBus {
@@ -469,6 +473,146 @@
         }
     }
 
+    class StorageAdapter {
+        storage;
+        bus;
+        get size() {
+            return this.storage?.length ?? 0;
+        }
+        constructor(storage, bus = new EventBus()) {
+            this.storage = storage;
+            this.bus = bus;
+        }
+        hasItem(key) {
+            return Boolean(this.storage?.getItem(String(key)));
+        }
+        getItem(key) {
+            const _ = this.storage?.getItem(String(key)) ?? null;
+            try {
+                return JSON.parse(String(_));
+            }
+            catch (ex) {
+                return null;
+            }
+        }
+        entries() {
+            return Array.from({ length: this.size }, (_, i) => {
+                const k = String(this.storage?.key(i));
+                return [k, this.getItem(k)];
+            });
+        }
+        setItem(key, value) {
+            if (value !== null) {
+                this.storage?.setItem(String(key), JSON.stringify(value));
+            }
+            else {
+                this.storage?.removeItem(String(key));
+            }
+            this.bus?.subject(key, value);
+        }
+        removeItem(key) {
+            this.storage?.removeItem(String(key));
+            this.bus?.subject(key, null);
+        }
+    }
+
+    class Store {
+        bus;
+        store = new Map();
+        get size() {
+            return this.store.size;
+        }
+        constructor(bus = new EventBus()) {
+            this.bus = bus;
+        }
+        hasItem(key) {
+            return this.store.has(key);
+        }
+        getItem(key) {
+            return this.store.get(key);
+        }
+        entries() {
+            return this.store.entries();
+        }
+        setItem(key, value) {
+            this.store.set(key, value);
+            this.bus.subject(key, value);
+        }
+        removeItem(key) {
+            this.store.delete(key);
+            this.bus.subject(key, null);
+        }
+    }
+
+    function useRerender() {
+        const [, setCount] = useState(0);
+        return useCallback(() => setCount(_ => (_ + 1) % (1 << 16)), []);
+    }
+
+    const DEFAULT_METHODS = {};
+    /**
+     * MobX like reactivity (simplified).
+     * Can be used to migrate from Redux/MobX or something else
+     *
+     * @param store
+     * @returns reactive proxy backed by store
+     */
+    function useStore(store, methods = DEFAULT_METHODS) {
+        const deps = useRef(null);
+        const render = useRerender();
+        useEffect(() => store.bus.watch(ev => {
+            if (deps.current?.has(String(ev.type))) {
+                render();
+            }
+        }), [store, render]);
+        return useMemo(() => new Proxy(methods, {
+            get(_, key) {
+                deps.current ||= new Set();
+                deps.current.add(key);
+                return store.getItem(key);
+            },
+            has(_, key) {
+                deps.current ||= new Set();
+                deps.current.add(key);
+                return store.hasItem(key);
+            },
+            set(_, key, value) {
+                store.setItem(key, value);
+                return true;
+            },
+            deleteProperty(_, key) {
+                store.removeItem(key);
+                return true;
+            }
+        }), [store]);
+    }
+
+    const localStore = new Store(); // localStorage cache
+    replicate(localStore, new StorageAdapter(globalThis?.localStorage));
+    function useLocalStore(methods) {
+        return useStore(localStore, methods);
+    }
+
+    /* eslint-disable @typescript-eslint/ban-types */
+    const handlerDecorator = (handler) => {
+        return handlerDecorator._impl(handler);
+    };
+    handlerDecorator._impl = (handler) => handler;
+    handlerDecorator.setup = (impl) => {
+        handlerDecorator._impl = impl;
+    };
+
+    function useEmitterWithActions(eventBus, type) {
+        const cache = useRef({});
+        return useMemo(() => new Proxy({}, {
+            get(_, actionType) {
+                cache.current ||= {};
+                cache.current[actionType] ||= action => eventBus.fire(type, { ...(action ?? {}), type: actionType });
+                return cache.current[actionType];
+            }
+        }), [eventBus, type]);
+    }
+
     const defaultEventBus = new EventBus();
 
     const useDialogManager = () => useEmitterWithActions(defaultEventBus.emitter, 'dialog');
@@ -562,15 +706,48 @@
     }, [method, href]);
 
     /** @deprecated */
-    const LinkButton = JSX(({ disabled, children, method = 'LINK', href, ...rest }) => {
+    const LinkButton = JSX(({ disabled, children, method = 'LINK', href, id, additionalHrefs, ...rest }) => {
         const handleFormSubmit = useFormSubmit({ method, href });
+        const linksStore = useLocalStore();
+        saveLinksToStore({ linksStore, href, id, additionalHrefs });
+        const adjustedHref = additionalHrefs
+            ? (linksStore.links || []).find((store) => store.id === id)?.lastLink
+            : href;
         const link = useLink();
-        const adjustedProps = link({ onClick: handleFormSubmit, href, ...rest });
+        const adjustedProps = link({ onClick: handleFormSubmit, href: adjustedHref, ...rest });
         const buttonInner = children ?? jsx(ButtonInner, { ...adjustedProps });
         return disabled ? (jsx(DisabledButton, { ...adjustedProps, children: buttonInner })) : (jsx(RegularButton, { ...adjustedProps, children: buttonInner }));
     });
     const RegularButton = JSX(({ className = '', href, rel, target, ariaLabel, version, rounded, onClick, type, data, children, text, }) => (jsx("a", { className: getRegularButtonClasses({ className, version, rounded }), href: href, rel: rel, target: target, "aria-label": ariaLabel || `Ссылка на ${text}`, role: href ? 'link' : 'button', onClick: onClick, type: type, ...getAspectsAttributes(data), children: children })));
     const DisabledButton = JSX(({ className, ariaLabel, version, rounded, children }) => (jsx("button", { type: "button", "aria-disabled": "true", "aria-label": ariaLabel, tabIndex: -1, className: getDisabledButtonClasses({ className, rounded, version }), children: children })));
+    const getRandomHref = (href = '', additionalHrefs = []) => {
+        const hrefs = [href, ...additionalHrefs];
+        return hrefs[Math.floor(Math.random() * hrefs.length)];
+    };
+    // Отсчитываем 7 длей с текущей даты
+    const getTimeAfter7days = () => Date.now() + 7 * 24 * 60 * 60 * 1000;
+    // Сохраняем или заменяем рандомную ссылку в localStorage
+    const saveLinksToStore = ({ linksStore, id, href, additionalHrefs }) => {
+        const buttonLinkStore = (linksStore.links || []).find((store) => store.id === id);
+        // Если хранилища вообще нет
+        if (!linksStore.links) {
+            linksStore.links = [];
+        }
+        if ((!buttonLinkStore || buttonLinkStore.nextDueAt <= Date.now()) && additionalHrefs) {
+            // Получаем рандомную ссылку
+            const randomHref = getRandomHref(href, additionalHrefs);
+            // При наличии ссылки для этой кнопки в хранилище удаляем этот элемент из массива ссылок
+            const updatedLinks = linksStore.links?.filter((item) => item.id !== id);
+            // Добавляем новый элемент
+            updatedLinks.push({
+                id: id ?? '',
+                lastLink: randomHref,
+                nextDueAt: getTimeAfter7days(),
+            });
+            // Добавляем это все в хранилище
+            linksStore.links = updatedLinks;
+        }
+    };
 
     // TODO Заменить LinkButton на Button и применить RoundedIcon
     function renderBackwardButton({ version, handleClick, text = 'Вернуться назад', alwaysVisible = false, }) {
@@ -1376,150 +1553,6 @@
         return (jsx(Dialog, { maxWidth: "lg", onClose: onClose, children: jsxs("div", { className: "flex flex-col gap-lg items-center rounded-md space-x-m", children: [jsx(Img, { image: { icon: statusIcon, iconVersion: 'normal' }, width: "136", height: "136" }), jsx(Headline, { className: "w-full", title: ok ? 'Ваша заявка отправлена' : 'Не удалось отправить заявку', description: ok ? responseOKDescription : responseFailDescription, headlineVersion: "XS", isEmbedded: true }), jsx(Button, { type: "button", onClick: onClose, children: "\u0425\u043E\u0440\u043E\u0448\u043E" })] }) }));
     });
 
-    function copy(source, target) {
-        for (const [k, v] of source.entries()) {
-            if (v !== null && v !== undefined) {
-                target.setItem(k, v);
-            }
-            else {
-                target.removeItem(k);
-            }
-        }
-    }
-
-    function replicate(primary, secondary) {
-        copy(primary, secondary);
-        copy(secondary, primary);
-        return primary.bus.watch(({ type, event }) => {
-            if (event !== null && event !== undefined) {
-                secondary.setItem(type, event);
-            }
-            else {
-                secondary.removeItem(type);
-            }
-        });
-    }
-
-    class StorageAdapter {
-        storage;
-        bus;
-        get size() {
-            return this.storage?.length ?? 0;
-        }
-        constructor(storage, bus = new EventBus()) {
-            this.storage = storage;
-            this.bus = bus;
-        }
-        hasItem(key) {
-            return Boolean(this.storage?.getItem(String(key)));
-        }
-        getItem(key) {
-            const _ = this.storage?.getItem(String(key)) ?? null;
-            try {
-                return JSON.parse(String(_));
-            }
-            catch (ex) {
-                return null;
-            }
-        }
-        entries() {
-            return Array.from({ length: this.size }, (_, i) => {
-                const k = String(this.storage?.key(i));
-                return [k, this.getItem(k)];
-            });
-        }
-        setItem(key, value) {
-            if (value !== null) {
-                this.storage?.setItem(String(key), JSON.stringify(value));
-            }
-            else {
-                this.storage?.removeItem(String(key));
-            }
-            this.bus?.subject(key, value);
-        }
-        removeItem(key) {
-            this.storage?.removeItem(String(key));
-            this.bus?.subject(key, null);
-        }
-    }
-
-    class Store {
-        bus;
-        store = new Map();
-        get size() {
-            return this.store.size;
-        }
-        constructor(bus = new EventBus()) {
-            this.bus = bus;
-        }
-        hasItem(key) {
-            return this.store.has(key);
-        }
-        getItem(key) {
-            return this.store.get(key);
-        }
-        entries() {
-            return this.store.entries();
-        }
-        setItem(key, value) {
-            this.store.set(key, value);
-            this.bus.subject(key, value);
-        }
-        removeItem(key) {
-            this.store.delete(key);
-            this.bus.subject(key, null);
-        }
-    }
-
-    function useRerender() {
-        const [, setCount] = useState(0);
-        return useCallback(() => setCount(_ => (_ + 1) % (1 << 16)), []);
-    }
-
-    const DEFAULT_METHODS = {};
-    /**
-     * MobX like reactivity (simplified).
-     * Can be used to migrate from Redux/MobX or something else
-     *
-     * @param store
-     * @returns reactive proxy backed by store
-     */
-    function useStore(store, methods = DEFAULT_METHODS) {
-        const deps = useRef(null);
-        const render = useRerender();
-        useEffect(() => store.bus.watch(ev => {
-            if (deps.current?.has(String(ev.type))) {
-                render();
-            }
-        }), [store, render]);
-        return useMemo(() => new Proxy(methods, {
-            get(_, key) {
-                deps.current ||= new Set();
-                deps.current.add(key);
-                return store.getItem(key);
-            },
-            has(_, key) {
-                deps.current ||= new Set();
-                deps.current.add(key);
-                return store.hasItem(key);
-            },
-            set(_, key, value) {
-                store.setItem(key, value);
-                return true;
-            },
-            deleteProperty(_, key) {
-                store.removeItem(key);
-                return true;
-            }
-        }), [store]);
-    }
-
-    const localStore = new Store(); // localStorage cache
-    replicate(localStore, new StorageAdapter(globalThis?.localStorage));
-    function useLocalStore(methods) {
-        return useStore(localStore, methods);
-    }
-
     const sessionStore = new Store(); // sessionStorage cache
     replicate(sessionStore, new StorageAdapter(globalThis?.sessionStorage));
     function useSessionStore() {
@@ -8759,11 +8792,11 @@
         return (jsx(BlockWrapper, { className: style('!bg-transparent', alignStyle, className), defaultPadding: "p-0", ...rest, children: renderButtonsSection(buttons) }));
     });
 
-    const Rate = JSX(({ rate = 0, title = 'Ставка', unit, fractionDigits = 2, depositeName, isShowDepositeName, color = 'text-secondary-text', }) => (jsxs("div", { children: [jsx(Text, { size: "text-l", font: "font-light", color: color, children: title }), jsxs("div", { className: "relative", children: [jsxs("div", { className: "flex @xl:justify-center gradient-color-text gap-xs", children: [jsx("span", { className: "font-mohave text-title-huge -mt-m tracking-[-15px]", children: toLocalNumberFormat(fractionDigits, { fixed: true })(rate) }), unit ? jsx("span", { className: "text-7xl mt-5", children: unit }) : null] }), depositeName && isShowDepositeName ? (jsx("div", { className: "absolute bottom-2 w-full text-left whitespace-nowrap", children: depositeName })) : null] })] })));
+    const Rate$1 = JSX(({ rate = 0, title = 'Ставка', unit, fractionDigits = 2, depositeName, isShowDepositeName, color = 'text-secondary-text', }) => (jsxs("div", { children: [jsx(Text, { size: "text-l", font: "font-light", color: color, children: title }), jsxs("div", { className: "relative", children: [jsxs("div", { className: "flex @xl:justify-center gradient-color-text gap-xs", children: [jsx("span", { className: "font-mohave text-title-huge -mt-m tracking-[-15px]", children: toLocalNumberFormat(fractionDigits, { fixed: true })(rate) }), unit ? jsx("span", { className: "text-7xl mt-5", children: unit }) : null] }), depositeName && isShowDepositeName ? (jsx("div", { className: "absolute bottom-2 w-full text-left whitespace-nowrap", children: depositeName })) : null] })] })));
 
     const UnknownRate = JSX(({ title = 'Ставка' }) => (jsxs("div", { className: "space-y-s lg:min-w-96", children: [jsx(Text, { size: "text-l", font: "font-light", color: "text-secondary-text", children: title }), jsx(Icon, { className: "w-10 h-auto lg:w-40", name: "PercentIcon" }), jsx("div", { className: "w-64", children: jsx(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 \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u0430, \u0432\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0434\u0440\u0443\u0433\u0438\u0435 \u043F\u0430\u0440\u0430\u043C\u0435\u0442\u0440\u044B" }) })] })));
 
-    const renderRate = ({ title = 'Ставка', rate = 0, unit = '%', fractionDigits = 2, color = 'text-secondary-text', children, ...rest }) => rate ? (jsxs("div", { className: "flex flex-col", children: [jsx("div", { className: "hidden lg:block min-w-96", children: jsx(Rate, { title: title, rate: rate, unit: unit, fractionDigits: fractionDigits, color: color, ...rest }) }), jsx(CalculatorValue, { className: "lg:hidden", title: title, value: rate, postfix: unit, fractionDigits: fractionDigits, fixed: true, color: color, ...rest }), children] })) : (jsx(UnknownRate, { title: title, ...rest }));
+    const renderRate = ({ title = 'Ставка', rate = 0, unit = '%', fractionDigits = 2, color = 'text-secondary-text', children, ...rest }) => rate ? (jsxs("div", { className: "flex flex-col", children: [jsx("div", { className: "hidden lg:block min-w-96", children: jsx(Rate$1, { title: title, rate: rate, unit: unit, fractionDigits: fractionDigits, color: color, ...rest }) }), jsx(CalculatorValue, { className: "lg:hidden", title: title, value: rate, postfix: unit, fractionDigits: fractionDigits, fixed: true, color: color, ...rest }), children] })) : (jsx(UnknownRate, { title: title, ...rest }));
 
     const DEFAULT_BONUS_CALCULATOR_PARAMS$1 = {
         minSumTravel: 6000,
@@ -13763,6 +13796,160 @@
         return (jsx(BlockWrapper, { version: "transparent", className: style(className), defaultPadding: "p-0", ...rest, children: dataType === 'offices' ? jsx(OfficesMap, {}) : jsx(AtmsMap, { descriptionData: data }) }));
     });
 
+    const RATES_URL = `${API_BASE_URI}/rates`;
+    const ARCHIVE_RATES_URL = `${API_BASE_URI}/historyrates`;
+    const EMPTY_RATES = [
+        [
+            {
+                currencyPair: 'Валютная пара',
+                buyRate: 0,
+                sellRate: 0,
+            },
+        ],
+    ];
+    function useRates(isArchive) {
+        const url = isArchive ? ARCHIVE_RATES_URL : RATES_URL;
+        const rateKey = isArchive ? 'archiveRates' : 'rates';
+        const ratesStore = useLocalStore();
+        // проверяем, надо ли обновлять значения ставок
+        const shouldUpdate = getShouldUpdate(isArchive, ratesStore);
+        // костыль, не отправлять запрос на бэк, если уже был запрос менее 15 мин назад
+        const { data } = useAsyncData(shouldUpdate ? url : '', fetchJSONUnsafe);
+        // если есть data и значение надо обновить, то обновляем локалсторадж
+        if (shouldUpdate && data) {
+            const nextUpdate = getTimeAfter15Minutes();
+            ratesStore[rateKey] = { rate: data, nextUpdate };
+        }
+        // берем данные из локалсторадж
+        const rates = ratesStore[rateKey]?.rate;
+        // возвращаем данные из локалсторадж или заглушку
+        return Array.isArray(rates) ? rates : EMPTY_RATES;
+    }
+    // Отсчитываем 15 минут с текущего момента
+    const getTimeAfter15Minutes = () => Date.now() + 15 * 60 * 1000;
+    const getShouldUpdate = (isArchive, ratesStore) => isArchive
+        ? !ratesStore?.archiveRates || ratesStore?.archiveRates.nextUpdate <= Date.now()
+        : !ratesStore?.rates || ratesStore?.rates.nextUpdate <= Date.now();
+
+    const useCarouselControls = (props, initialIndex = 0) => {
+        const { itemCount, visibleItemCount } = props;
+        const [activeIndex, setActiveIndex] = useState(initialIndex);
+        const inc = useCallback(() => setActiveIndex((_) => Math.min(_ + 1, itemCount - 1)), [itemCount]);
+        const dec = useCallback(() => setActiveIndex((_) => Math.max(_ - 1, 0)), [itemCount]);
+        const canInc = visibleItemCount
+            ? itemCount > visibleItemCount && activeIndex < itemCount - visibleItemCount
+            : activeIndex < itemCount - 1;
+        const canDec = activeIndex > 0;
+        const isScrollAvailable = canDec || canInc;
+        return [
+            activeIndex,
+            {
+                inc,
+                dec,
+                canInc,
+                canDec,
+                isScrollAvailable,
+            },
+        ];
+    };
+
+    /** @deprecated */
+    const renderArrows = ({ className, btnClass, canDec, canInc, dec, inc, }) => canDec || canInc ? (jsxs("div", { children: [canDec ? (jsx(ArrowLeftButton, { wcmsIgnore: true, className: style('absolute z-40', btnClass[0], className), onClick: dec })) : null, canInc ? (jsx(ArrowRightButton, { wcmsIgnore: true, className: style('absolute z-40', btnClass[1], className), onClick: inc })) : null] })) : null;
+
+    const COLUMN_WIDTH = 140;
+    const getHorizontalShift = (columns, activeColumnIndex) => sum(columns.slice(0, activeColumnIndex).map((_) => _?.cols?.length ?? 1)) * COLUMN_WIDTH;
+
+    const renderInnerTableRow = (activeColumnIndex) => (rowData, rowIdx) => {
+        if (!rowData?.length) {
+            return null;
+        }
+        const [headerColumn, ...columns] = rowData;
+        const columnsStyle = style('flex duration-1000 text-center', rowIdx !== 0 ? 'font-normal' : 'font-light');
+        return (jsxs("div", { className: "flex border-main-divider border-b border-solid h-full", children: [headerColumn?.data ? (jsx("div", { className: "whitespace-pre-wrap sm:whitespace-normal w-48 min-w-48 sm:w-56 sm:min-w-56 py-lg pr-lg sm:pr-0", children: jsx(Text, { size: "text-xl", font: "font-light", children: headerColumn.data }) })) : null, jsx("div", { className: "flex flex-grow overflow-hidden", children: jsx("div", { className: columnsStyle, style: {
+                            transform: `translateX(-${getHorizontalShift(columns, activeColumnIndex)}px)`,
+                        }, children: columns?.map((_, i) => (jsxs("div", { className: "flex flex-col flex-grow gap-s justify-center py-xl odd:bg-main-divider", children: [_?.data ? jsx(Text, { size: "text-xl", children: _.data }) : null, _?.cols ? renderCols(_.cols, activeColumnIndex) : null] }, `row${i}`))) }) })] }, String(rowIdx)));
+    };
+    const renderCols = (cols, rowIndex) => cols?.length > 0 ? (jsx("div", { className: style('flex', { 'text-secondary-text': rowIndex === 0 }), children: cols.map((data, i) => (jsx("div", { className: "w-20 mx-lg", children: jsx(Text, { size: "text-h6", font: "font-light", children: data }) }, String(i)))) })) : null;
+
+    const InnerTableBodyItem = JSX(({ rows }) => {
+        const rowsLength = rows?.[0]?.length ?? 0;
+        const CARD_VIEW_COUNT = 5;
+        const [activeIndex, controls] = useCarouselControls({
+            itemCount: rowsLength,
+            visibleItemCount: CARD_VIEW_COUNT,
+        });
+        return (jsxs("div", { children: [rows?.map(renderInnerTableRow(activeIndex)), renderArrows({
+                    ...controls,
+                    btnClass: ['left-3 top-20', 'right-3 top-20'],
+                    className: '',
+                })] }));
+    });
+
+    const InnerTableBody = JSX(({ activeTabIndex, items }) => (jsx("div", { children: items.map((_, tableIdx) => {
+            const key = `activeTabIdx:${activeTabIndex}-tableIdx:${tableIdx}`;
+            return (jsxs("div", { className: "w-full @container", children: [jsx("div", { className: "flex py-m px-m bg-white @4xl:bg-gray relative", children: jsx(Text, { size: "text-xl", align: "text-left", children: _.title }) }), jsx("div", { className: "w-full sm:pl-xs overflow-hidden transition-height duration-500 ease-in-out", children: jsx("div", { className: "relative", children: jsx(InnerTableBodyItem, { rows: _.rowsData }) }) })] }, key));
+        }) })));
+
+    const linkButtonVersion = 'secondary';
+
+    const TableColor = (isEqual = false) => `${isEqual ? 'text-white' : 'text-secondary-text'}`;
+    const InnerTableHeader = JSX(({ currencies, linkToPDF, activeTabIndex, setActiveTabIndex }) => (jsxs("div", { className: "flex justify-between items-center w-full py-lg", children: [currencies && currencies.length > 1 ? (jsx("div", { className: "flex bg-secondary-light p-2xs rounded-md", children: currencies.map((currency, idx) => (jsx("div", { className: style('rounded-md px-4 py-3 cursor-pointer', {
+                        'bg-primary-main': idx === activeTabIndex,
+                    }), onClick: () => setActiveTabIndex(idx), children: jsx(Text, { size: "text-xl", font: "font-light", color: TableColor(idx === activeTabIndex), children: currency || idx + 1 }) }, currency))) })) : null, linkToPDF ? (jsx(LinkButton, { className: "text-primary-main", href: linkToPDF, version: linkButtonVersion, target: "_blank", appendLeft: jsx(Icon, { name: "DocDownloadIcon", iconVersion: "color", className: "mr-3xs", width: "20", height: "20" }), text: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0432 PDF" })) : null] })));
+
+    const EMPTY_DATA$1 = 'Данных нет';
+    const InnerTable = UniBlock(({ tableSource }) => {
+        const tableData = tableSource?.tableData;
+        const [activeTabIndex, setActiveTabIndex] = useState(0);
+        const handleActiveTabIndex = useCallback((_) => setActiveTabIndex(_), []);
+        const items = tableData?.[activeTabIndex]?.items ?? [];
+        const currencies = tableData?.map((item) => item.currency ?? '');
+        return tableData ? (jsxs("div", { className: "bg-white z-10", children: [jsx(InnerTableHeader, { currencies: currencies, activeTabIndex: activeTabIndex, setActiveTabIndex: handleActiveTabIndex }), jsx(InnerTableBody, { activeTabIndex: activeTabIndex, items: items })] })) : (jsx("div", { className: "space-y-m text-center", children: jsx(Text, { size: "text-h6", children: EMPTY_DATA$1 }) }));
+    });
+
+    const DIVIDER_STYLE = 'border-main-divider lg:border-b w-full py-s lg:py-xl';
+    const TariffsTableRowContainer = JSX(({ children, tableInner, onClick }) => (jsxs("div", { className: style('self-start flex flex-col gap-xl', DIVIDER_STYLE), role: "row", children: [jsx("div", { className: style('flex flex-col lg:flex-row gap-x-5xl gap-y-xs'), children: children }), tableInner ? (jsx("div", { className: "origin-top animate-expansion", children: jsx(InnerTable, { ...tableInner, onClick: onClick }) })) : null] })));
+
+    const RATES_COLUMN_STYLE = `grid grid-cols-3 gap-s`;
+    const Rate = UniBlock(({ currencyPair = '', buyRate = 0, sellRate = 0 }) => (jsxs("div", { className: style('mb-s', RATES_COLUMN_STYLE, DIVIDER_STYLE), children: [jsx("div", { children: formatCurrencyPair(currencyPair) }), jsx("div", { children: formatRate(buyRate) }), jsx("div", { children: formatRate(sellRate) })] })));
+    const formatCurrencyPair = (currency) => currency.replace('_TOD', '');
+    const formatRate = (rate) => rate.toFixed(4);
+
+    const TIMEZONE = 'МСК';
+    const renderDate = ({ dateString, isArchive = false }) => {
+        const date = new Date(String(dateString));
+        const formatTime = date.toLocaleTimeString('ru-RU', {
+            timeZone: 'Europe/Moscow',
+            hour: '2-digit',
+            minute: '2-digit',
+            hour12: false,
+        });
+        const formatDate = date.toLocaleDateString('ru-RU', {
+            timeZone: 'Europe/Moscow',
+            day: 'numeric',
+            month: 'long',
+            year: 'numeric',
+        });
+        return isArchive ? (jsxs("div", { children: [jsx(Paragraph, { color: "text-secondary-text", font: "font-medium", children: formatDate }), jsxs(Paragraph, { color: "text-secondary-text", children: [formatTime, " (", TIMEZONE, ")"] })] })) : (jsxs(Text, { color: "text-secondary-text", children: ["\u041A\u0443\u0440\u0441\u044B \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043B\u044C\u043D\u044B \u043D\u0430 ", formatTime, " (", TIMEZONE, "), ", formatDate] }));
+    };
+
+    const RatesTableItem = JSX(({ isArchive = false, isRatesValid, list = [], infoMessage }) => {
+        const maxDate = isRatesValid
+            ? list.map((item) => item.lastUpdatedAt).reduce((a, b) => (String(a) > String(b) ? a : b))
+            : '';
+        return (jsxs("div", { className: "space-y-xl mb-3xl", children: [maxDate && renderDate({ dateString: maxDate, isArchive }), jsxs("div", { className: style(RATES_COLUMN_STYLE), children: [jsx(Text, { font: "font-medium", children: "\u0412\u0430\u043B\u044E\u0442\u0430" }), jsx(Text, { font: "font-medium", children: "\u041F\u043E\u043A\u0443\u043F\u043A\u0430" }), jsx(Text, { font: "font-medium", children: "\u041F\u0440\u043E\u0434\u0430\u0436\u0430" })] }), list.length > 0 ? (list.map((rate, i) => jsx(Rate, { ...rate }, String(i)))) : (jsx(Paragraph, { children: "\u041E\u0448\u0438\u0431\u043A\u0430 \u043F\u043E\u043B\u0443\u0447\u0435\u043D\u0438\u044F \u0434\u0430\u043D\u043D\u044B\u0445" })), jsx(Paragraph, { color: "text-secondary-text", children: infoMessage })] }));
+    });
+
+    const renderDataPickForm = () => (jsxs("div", { className: "flex justify-start items-end space-x-xl", children: [jsx(DatePicker, { label: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0434\u0435\u043D\u044C", maxDate: new Date() }), jsx(SubmitButton$1, { className: "h-fit", children: "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C" })] }));
+
+    const renderLink = (href) => (jsxs(Paragraph, { children: ["\u041F\u043E\u043B\u043D\u044B\u0439 \u0430\u0440\u0445\u0438\u0432 \u0432\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u043F\u043E\u0441\u043C\u043E\u0442\u0440\u0435\u0442\u044C ", jsx(Link, { href: href, children: "\u0437\u0434\u0435\u0441\u044C" })] }));
+
+    const RatesTable = JSX(({ href, className = '', infoMessage, title, isArchive = false, ...rest }) => {
+        const ratesList = useRates(isArchive);
+        const isRatesValid = ratesList[0].length > 0;
+        return (jsxs(BlockWrapper, { className: style('p-6xl space-y-xl', className), defaultPadding: "p-0", ...rest, children: [jsx(Heading, { className: "mb-xl", children: title }), isArchive ? renderDataPickForm() : null, ratesList.map((list, i) => (jsx(RatesTableItem, { list: list, isRatesValid: isRatesValid, isArchive: isArchive, infoMessage: infoMessage }, String(i)))), href ? renderLink(href) : null] }));
+    });
+
     const RichTextBlock = UniBlock((props) => {
         const { __html, dynamicQueryParamText = {}, dynamicTextSource, richVersion = '', ...rest } = props;
         const formatText = getFormatDynamicText(dynamicQueryParamText, dynamicTextSource?.list, __html);
@@ -14056,85 +14243,6 @@
                 : null }));
     });
 
-    const useCarouselControls = (props, initialIndex = 0) => {
-        const { itemCount, visibleItemCount } = props;
-        const [activeIndex, setActiveIndex] = useState(initialIndex);
-        const inc = useCallback(() => setActiveIndex((_) => Math.min(_ + 1, itemCount - 1)), [itemCount]);
-        const dec = useCallback(() => setActiveIndex((_) => Math.max(_ - 1, 0)), [itemCount]);
-        const canInc = visibleItemCount
-            ? itemCount > visibleItemCount && activeIndex < itemCount - visibleItemCount
-            : activeIndex < itemCount - 1;
-        const canDec = activeIndex > 0;
-        const isScrollAvailable = canDec || canInc;
-        return [
-            activeIndex,
-            {
-                inc,
-                dec,
-                canInc,
-                canDec,
-                isScrollAvailable,
-            },
-        ];
-    };
-
-    /** @deprecated */
-    const renderArrows = ({ className, btnClass, canDec, canInc, dec, inc, }) => canDec || canInc ? (jsxs("div", { children: [canDec ? (jsx(ArrowLeftButton, { wcmsIgnore: true, className: style('absolute z-40', btnClass[0], className), onClick: dec })) : null, canInc ? (jsx(ArrowRightButton, { wcmsIgnore: true, className: style('absolute z-40', btnClass[1], className), onClick: inc })) : null] })) : null;
-
-    const COLUMN_WIDTH = 140;
-    const getHorizontalShift = (columns, activeColumnIndex) => sum(columns.slice(0, activeColumnIndex).map((_) => _?.cols?.length ?? 1)) * COLUMN_WIDTH;
-
-    const renderInnerTableRow = (activeColumnIndex) => (rowData, rowIdx) => {
-        if (!rowData?.length) {
-            return null;
-        }
-        const [headerColumn, ...columns] = rowData;
-        const columnsStyle = style('flex duration-1000 text-center', rowIdx !== 0 ? 'font-normal' : 'font-light');
-        return (jsxs("div", { className: "flex border-main-divider border-b border-solid h-full", children: [headerColumn?.data ? (jsx("div", { className: "whitespace-pre-wrap sm:whitespace-normal w-48 min-w-48 sm:w-56 sm:min-w-56 py-lg pr-lg sm:pr-0", children: jsx(Text, { size: "text-xl", font: "font-light", children: headerColumn.data }) })) : null, jsx("div", { className: "flex flex-grow overflow-hidden", children: jsx("div", { className: columnsStyle, style: {
-                            transform: `translateX(-${getHorizontalShift(columns, activeColumnIndex)}px)`,
-                        }, children: columns?.map((_, i) => (jsxs("div", { className: "flex flex-col flex-grow gap-s justify-center py-xl odd:bg-main-divider", children: [_?.data ? jsx(Text, { size: "text-xl", children: _.data }) : null, _?.cols ? renderCols(_.cols, activeColumnIndex) : null] }, `row${i}`))) }) })] }, String(rowIdx)));
-    };
-    const renderCols = (cols, rowIndex) => cols?.length > 0 ? (jsx("div", { className: style('flex', { 'text-secondary-text': rowIndex === 0 }), children: cols.map((data, i) => (jsx("div", { className: "w-20 mx-lg", children: jsx(Text, { size: "text-h6", font: "font-light", children: data }) }, String(i)))) })) : null;
-
-    const InnerTableBodyItem = JSX(({ rows }) => {
-        const rowsLength = rows?.[0]?.length ?? 0;
-        const CARD_VIEW_COUNT = 5;
-        const [activeIndex, controls] = useCarouselControls({
-            itemCount: rowsLength,
-            visibleItemCount: CARD_VIEW_COUNT,
-        });
-        return (jsxs("div", { children: [rows?.map(renderInnerTableRow(activeIndex)), renderArrows({
-                    ...controls,
-                    btnClass: ['left-3 top-20', 'right-3 top-20'],
-                    className: '',
-                })] }));
-    });
-
-    const InnerTableBody = JSX(({ activeTabIndex, items }) => (jsx("div", { children: items.map((_, tableIdx) => {
-            const key = `activeTabIdx:${activeTabIndex}-tableIdx:${tableIdx}`;
-            return (jsxs("div", { className: "w-full @container", children: [jsx("div", { className: "flex py-m px-m bg-white @4xl:bg-gray relative", children: jsx(Text, { size: "text-xl", align: "text-left", children: _.title }) }), jsx("div", { className: "w-full sm:pl-xs overflow-hidden transition-height duration-500 ease-in-out", children: jsx("div", { className: "relative", children: jsx(InnerTableBodyItem, { rows: _.rowsData }) }) })] }, key));
-        }) })));
-
-    const linkButtonVersion = 'secondary';
-
-    const TableColor = (isEqual = false) => `${isEqual ? 'text-white' : 'text-secondary-text'}`;
-    const InnerTableHeader = JSX(({ currencies, linkToPDF, activeTabIndex, setActiveTabIndex }) => (jsxs("div", { className: "flex justify-between items-center w-full py-lg", children: [currencies && currencies.length > 1 ? (jsx("div", { className: "flex bg-secondary-light p-2xs rounded-md", children: currencies.map((currency, idx) => (jsx("div", { className: style('rounded-md px-4 py-3 cursor-pointer', {
-                        'bg-primary-main': idx === activeTabIndex,
-                    }), onClick: () => setActiveTabIndex(idx), children: jsx(Text, { size: "text-xl", font: "font-light", color: TableColor(idx === activeTabIndex), children: currency || idx + 1 }) }, currency))) })) : null, linkToPDF ? (jsx(LinkButton, { className: "text-primary-main", href: linkToPDF, version: linkButtonVersion, target: "_blank", appendLeft: jsx(Icon, { name: "DocDownloadIcon", iconVersion: "color", className: "mr-3xs", width: "20", height: "20" }), text: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0432 PDF" })) : null] })));
-
-    const EMPTY_DATA$1 = 'Данных нет';
-    const InnerTable = UniBlock(({ tableSource }) => {
-        const tableData = tableSource?.tableData;
-        const [activeTabIndex, setActiveTabIndex] = useState(0);
-        const handleActiveTabIndex = useCallback((_) => setActiveTabIndex(_), []);
-        const items = tableData?.[activeTabIndex]?.items ?? [];
-        const currencies = tableData?.map((item) => item.currency ?? '');
-        return tableData ? (jsxs("div", { className: "bg-white z-10", children: [jsx(InnerTableHeader, { currencies: currencies, activeTabIndex: activeTabIndex, setActiveTabIndex: handleActiveTabIndex }), jsx(InnerTableBody, { activeTabIndex: activeTabIndex, items: items })] })) : (jsx("div", { className: "space-y-m text-center", children: jsx(Text, { size: "text-h6", children: EMPTY_DATA$1 }) }));
-    });
-
-    const DIVIDER_STYLE = 'border-main-divider lg:border-b w-full py-s lg:py-xl';
-    const TariffsTableRowContainer = JSX(({ children, tableInner, onClick }) => (jsxs("div", { className: style('self-start flex flex-col gap-xl', DIVIDER_STYLE), role: "row", children: [jsx("div", { className: style('flex flex-col lg:flex-row gap-x-5xl gap-y-xs'), children: children }), tableInner ? (jsx("div", { className: "origin-top animate-expansion", children: jsx(InnerTable, { ...tableInner, onClick: onClick }) })) : null] })));
-
     const TariffsTableRow = JSX(({ row: { header, data = [] }, ...rest }) => {
         const [tableInner, setTableInner] = useState(undefined);
         const handleSetTableInner = useCallback((_) => {
@@ -14236,6 +14344,7 @@
         CashbackCalculator,
         CalculatorRko,
         RkoTariffCardsTable,
+        RatesTable,
     };
 
     const applyAspects = (aspects) => (ev) => {
@@ -14380,7 +14489,7 @@
         slots: () => [HEADER_SLOT, FOOTER_SLOT, STICKY_FOOTER_SLOT],
     });
 
-    const packageVersion = "0.14.1025";
+    const packageVersion = "0.14.1027";
 
     exports.Blocks = Blocks;
     exports.ContentPage = ContentPage;