@redneckz/wildless-cms-uni-blocks 0.3.3 → 0.3.6

package/mobile/bundle/bundle.umd.js

@@ -186,62 +186,22 @@
       };
   }
 
-  const isURL = (href) => href?.includes('//');
-  const withoutQuery = (href) => (href || '').replace(/\/?\?.*/, '');
-  const getOrigin = (href) => {
-      if (!href || !isURL(href)) {
-          return undefined;
-      }
-      const url = href;
-      const protoSeparator = '//';
-      const endOfProto = url.indexOf(protoSeparator);
-      const endOfOrigin = url.indexOf('/', endOfProto + protoSeparator.length);
-      return endOfOrigin !== -1 ? url.substring(0, endOfOrigin) : url;
-  };
-
-  var url = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    isURL: isURL,
-    withoutQuery: withoutQuery,
-    getOrigin: getOrigin
-  });
-
-  const MOBILE_URL_PATH = '/mobile';
-  const withoutMobilePath = (href) => (href || '').replace(MOBILE_URL_PATH, '');
-
-  const adjustHref = (href, router) => {
-      if (!href) {
-          return href;
-      }
-      const relativeHref = toRelativeHref(href, router) || '';
-      const isMobilePage = router?.pathname.startsWith(MOBILE_URL_PATH);
-      return isMobilePage && !isURL(relativeHref) ? `${MOBILE_URL_PATH}${relativeHref}` : relativeHref;
+  const HeadingClass = {
+      h1: 'text-m-title',
+      h2: 'text-m-title',
+      h3: 'text-m-title-md',
+      h4: 'text-m-title-xs',
+      h5: 'text-m-title-xs',
+      h6: 'text-m-title-xs',
   };
-  const toRelativeHref = (href, router) => {
-      if (!href) {
-          return href;
+  const Heading = JSX((props) => {
+      const { className, headingType, title } = props;
+      if (!headingType) {
+          return;
       }
-      const origin = getOrigin(router?.href);
-      return origin ? href.replace(origin, '') || '/' : href;
-  };
-
-  const defaultHandlerDecorator = (handler) => handler;
-  function useLink({ router, handlerDecorator = defaultHandlerDecorator, }, link) {
-      const href = adjustHref(link.href, router);
-      return {
-          ...link,
-          href,
-          ariaLabel: link.text,
-          onClick: handlerDecorator((ev) => {
-              const isLocalHref = href && !isURL(href);
-              const isLocalTarget = !link.target || link.target === '_self';
-              if (isLocalHref && isLocalTarget) {
-                  ev.preventDefault();
-                  router.push(href);
-              }
-          }, link),
-      };
-  }
+      const Tag = headingType;
+      return (jsx(Tag, { className: `font-sans font-medium m-0 ${HeadingClass[headingType]} ${className || ''}`, children: title }));
+  });
 
   const projectSettings = new (class {
       _ = {
@@ -286,144 +246,6 @@
       return (jsx("img", { className: className, src: href, alt: alt, title: title, ...imgProps, "aria-hidden": "true" }));
   });
 
-  const ButtonInner = JSX(({ text, aboveText, appendLeft, rounded, version }) => {
-      const withoutText = !text && !aboveText && Boolean(appendLeft);
-      const buttonInnerClasses = version !== 'link'
-          ? `flex items-center justify-center
-          ${withoutText ? 'h-12 w-12' : `px-8 gap-2 ${aboveText ? 'py-2' : 'py-3.5'}`} ${rounded ? 'rounded-full' : ''}`
-          : null;
-      return renderButtonInner({ buttonInnerClasses, appendLeft, withoutText, aboveText, text });
-  });
-  function renderButtonInner({ buttonInnerClasses, appendLeft, withoutText, aboveText, text }) {
-      return (jsxs("div", { className: buttonInnerClasses, children: [appendLeft ? appendLeft : null, withoutText ? null : (jsxs("div", { children: [jsx("div", { className: "text-m-2xs text-left", children: aboveText }), jsx("div", { className: "text-m-button font-medium text-left", children: text })] }))] }));
-  }
-
-  const buttonStyleMap = {
-      primary: 'text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active',
-      secondary: 'text-primary-main bg-secondary-light hover:bg-secondary-hover active:bg-secondary-active',
-      link: 'text-primary-main',
-  };
-  const buttonDisabledStyleMap = {
-      primary: 'bg-secondary-dark text-secondary-text',
-      secondary: 'bg-secondary-light text-secondary-text',
-      link: '',
-  };
-  const styleButton = 'w-full text-center font-sans select-none';
-  const Button = JSX(({ className, text, aboveText, appendLeft, href, target, onClick, children, disabled, rounded, version = 'primary', ariaLabel, ...rest }) => {
-      const buttonInner = children ?? (jsx(ButtonInner, { text: text, aboveText: aboveText, appendLeft: appendLeft, rounded: rounded, version: version }));
-      if (disabled) {
-          return (jsx("div", { role: "button", "aria-disabled": "true", "aria-label": ariaLabel, tabIndex: "-1", className: `inline-block ${styleButton} ${buttonDisabledStyleMap[version] || ''} ${rounded ? 'rounded-full' : 'rounded-md'} ${className || ''}`, children: buttonInner }));
-      }
-      return (jsx("a", { className: `${styleButton} inline-block cursor-pointer no-underline ${buttonStyleMap[version] || ''} ${rounded ? 'rounded-full' : 'rounded-md'} ${className || ''}`, href: href, target: target, onClick: onClick, "aria-label": ariaLabel, role: !href ? 'button' : 'link', ...rest, children: buttonInner }));
-  });
-
-  const ButtonSection = JSX(({ context, className = '', buttons }) => {
-      const { handlerDecorator } = context;
-      const router = context.useRouter();
-      return buttons?.length ? (jsx("div", { className: `${className}`, children: buttons.map((button, index) => renderButton(useLink({ router, handlerDecorator }, button), index)) })) : null;
-  });
-  function renderButton({ icon, ...button }, i) {
-      if (!button?.text)
-          return;
-      return icon ? (jsx(Button, { appendLeft: jsx(Icon, { name: icon, width: "24", height: "24", asSVG: true }), ...button }, String(i))) : (jsx(Button, { ...button }, String(i)));
-  }
-
-  const HeadingClass = {
-      h1: 'text-m-title',
-      h2: 'text-m-title',
-      h3: 'text-m-title-md',
-      h4: 'text-m-title-xs',
-      h5: 'text-m-title-xs',
-      h6: 'text-m-title-xs',
-  };
-  const Heading = JSX((props) => {
-      const { className, headingType, title } = props;
-      if (!headingType) {
-          return;
-      }
-      const Tag = headingType;
-      return (jsx(Tag, { className: `font-sans font-medium ${HeadingClass[headingType]} ${className || ''}`, children: title }));
-  });
-
-  const BaseTile = JSX(({ className = '', title, children, buttons, image }) => {
-      return (jsxs("div", { className: `font-sans flex flex-col grow h-full items-start ${className}`, children: [title, jsxs("div", { className: `flex grow w-full justify-between`, children: [jsxs("div", { className: `flex flex-col justify-between`, children: [jsx("div", { children: children }), jsx("div", { children: buttons })] }), image] })] }));
-  });
-
-  const getColSpan = (className) => {
-      const colSpanPrefix = 'col-span-';
-      const colSpanStr = className.split(/\s+/).find((_) => _.startsWith(colSpanPrefix));
-      return colSpanStr ? parseInt(colSpanStr.substring(colSpanPrefix.length), 10) : 12;
-  };
-
-  function getTileHeadingType(className = '') {
-      const colSpan = getColSpan(className);
-      if (colSpan <= 4) {
-          return 'h4';
-      }
-      else if (colSpan <= 8) {
-          return 'h3';
-      }
-      else {
-          return 'h2';
-      }
-  }
-
-  function getTileMinHeight(className = '') {
-      const colSpan = getColSpan(className);
-      if (colSpan <= 6) {
-          return 'min-h-[300px]';
-      }
-      else if (colSpan <= 8) {
-          return 'min-h-[320px]';
-      }
-      else {
-          return 'min-h-[360px]';
-      }
-  }
-
-  function getTileRightPadding(className = '') {
-      const colSpan = getColSpan(className);
-      if (colSpan <= 6) {
-          return 'pr-9';
-      }
-      else if (colSpan <= 8) {
-          return 'pr-[4.75rem]';
-      }
-      else {
-          return 'pr-[9.4rem]';
-      }
-  }
-
-  const CBR_EXCHANGE_RATE_URL = 'https://www.cbr-xml-daily.ru/daily_json.js';
-  const CURRENCY_CODES = ['USD', 'EUR'];
-  const CURRENCY_ICONS_MAP = {
-      USD: 'DollarIcon',
-      EUR: 'EuroIcon',
-  };
-  const buttons = [
-      {
-          text: 'Все показатели',
-          href: 'https://cbr.ru/currency_base/daily/',
-          version: 'secondary',
-      },
-  ];
-  const ExchangeRateTile = JSX(({ className = '', context, title = 'Курсы обмена валют' }) => {
-      const { data } = context.useAsyncData(CBR_EXCHANGE_RATE_URL, fetchExchangeRate);
-      return (jsx("section", { className: `bg-white text-primary-text font-sans p-9 box-border ${className}  ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, children: jsx(BaseTile, { context: context, title: title && (jsx(Heading, { headingType: getTileHeadingType(className), title: title, className: `whitespace-pre-wrap max-w-[600px]` })), buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex mt-9 gap-3" })) : null, children: jsxs("table", { children: [jsx("thead", { children: jsxs("tr", { children: [jsx(CurrencyTH, { children: "\u0412\u0430\u043B\u044E\u0442\u0430" }), jsx(CurrencyTH, { className: "pl-11", children: "\u041A\u0443\u0440\u0441" })] }) }), jsx("tbody", { children: CURRENCY_CODES.map(renderCurrencyRow(data)) })] }) }) }));
-  });
-  const CurrencyTH = JSX(({ className = '', children }) => (jsx("th", { className: `text-left font-normal text-sm text-secondary-text ${className}`, children: children })));
-  const CurrencyTD = JSX(({ className = '', children }) => (jsx("td", { className: `text-left font-normal text-base text-primary-text ${className}`, children: children })));
-  async function fetchExchangeRate() {
-      const response = await fetch(CBR_EXCHANGE_RATE_URL);
-      return await response.json();
-  }
-  const currencyNumberFormat = new Intl.NumberFormat('ru', { style: 'currency', currency: 'RUB' });
-  const formatCurrency = (value) => (value ? currencyNumberFormat.format(value) : '');
-  const renderCurrencyRow = (data) => (code) => {
-      const value = (data?.Valute || {})[code]?.Value;
-      return (jsxs("tr", { children: [jsx(CurrencyTD, { className: "pt-4", children: jsxs("div", { className: "flex items-center", children: [jsx(Icon, { name: CURRENCY_ICONS_MAP[code], width: "24", height: "24" }), jsx("span", { className: "ml-2", children: code })] }) }), jsx(CurrencyTD, { className: "pt-4 pl-11", children: formatCurrency(value) })] }, code));
-  };
-
   const Img = JSX(({ className = '', image }) => {
       if (!image) {
           return null;
@@ -484,7 +306,7 @@
   };
 
   const SwipeListControlItem = JSX(({ className = '', children, ...rest }) => {
-      return (jsx("div", { className: `snap-center snap-always min-w-full ${className}`, role: "listitem", ...rest, children: children }));
+      return (jsx("div", { className: `snap-center snap-always min-w-full box-border ${className}`, role: "listitem", ...rest, children: children }));
   });
 
   // styles used to compensate outer container padding to get rid of clipping effect
@@ -517,7 +339,7 @@
   const BASE_DOT_OPACITY = 0.3;
   const ACTIVE_DOT_OPACITY_CHANGE = 0.7;
   const SwipeListControlDots = JSX(({ children, activeIndex, indexFraction, showDots }) => {
-      return showDots && children?.length ? (jsx("div", { className: "flex gap-2 mx-auto mt-[22px] w-fit", children: children?.map((_, idx) => (jsx("div", { className: `${DOT_STYLES}`, style: getDotStyles(idx, activeIndex, indexFraction), "aria-hidden": true }, String(idx)))) })) : null;
+      return showDots && children?.length ? (jsx("div", { className: "flex gap-2 mx-auto mt-5 w-fit", children: children?.map((_, idx) => (jsx("div", { className: `${DOT_STYLES}`, style: getDotStyles(idx, activeIndex, indexFraction), "aria-hidden": true }, String(idx)))) })) : null;
   });
   const getDotStyles = (currentIdx, activeIndex, indexFraction) => {
       if (currentIdx < activeIndex || currentIdx > activeIndex + 1)
@@ -575,7 +397,7 @@
       return index !== -1 ? href.substring(index + 1) : '';
   };
 
-  const LinkDocsListItem = JSX(({ className = '', doc, icon }) => (jsx(LinkDocsListItemBase, { className: `flex h-full ${className}`, iconClassName: "mr-3 min-w-6 min-h-6", doc: doc, icon: icon })));
+  const LinkDocsListItem = JSX(({ className = '', doc, icon }) => (jsx(LinkDocsListItemBase, { className: `flex h-full box-border ${className}`, iconClassName: "mr-3 min-w-6 min-h-6", doc: doc, icon: icon })));
 
   const LinkDocsHorizontalList = JSX(({ context, hasBorder = true, documents, icon }) => {
       return (jsx(SwipeListControl, { context: context, className: "text-m-sm text-primary-main", children: documents?.length
@@ -600,7 +422,7 @@
       return (jsxs("div", { className: "flex flex-row mb-8", children: [benefit.icon && (jsx(Icon, { className: "w-[48px] h-[48px] bg-main rounded-full box-border p-[12px]", name: benefit.icon, width: "48", height: "48", asSVG: true })), jsxs("div", { className: "flex gap-1 flex-col h-full ml-5 max-w-[490px]", children: [benefit.label && (jsx("div", { className: "font-medium text-primary-text text-xl m-0", children: benefit.label })), benefit.description && (jsx("div", { className: "font-normal text-sm text-secondary-text", children: benefit.description }))] })] }, String(i)));
   }
 
-  const LIST_STYLE_CLASSES$1 = 'rounded-full inline-block mr-3';
+  const LIST_STYLE_CLASSES$1 = 'rounded-full inline-block mr-3 mt-2';
   const TEXT_STYLE_MAP$1 = {
       primary: 'text-primary-text',
       secondary: 'text-white',
@@ -612,7 +434,7 @@
       gray: 'bg-secondary-text',
   };
   const ListItem = JSX(({ className = '', isDotted = true, children, version = 'primary' }) => {
-      return (jsxs("div", { className: `font-sans flex items-center ${className}`, role: "listitem", children: [isDotted && jsx("div", { className: getListStyle$1(version) }), jsx("span", { className: TEXT_STYLE_MAP$1[version], children: children })] }));
+      return (jsxs("div", { className: `font-sans flex items-start ${className}`, role: "listitem", children: [isDotted && jsx("div", { className: getListStyle$1(version) }), jsx("span", { className: `text-m-md ${TEXT_STYLE_MAP$1[version]}`, children: children })] }));
   });
   const getListStyle$1 = (version) => {
       const size = version === 'gray' ? 'w-[6px] h-[6px] min-w-[6px] min-h-[6px]' : 'w-2 h-2 min-w-2 min-h-2';
@@ -648,28 +470,180 @@
   };
   const TextBlock = JSX(({ title, description, blockVersion = 'primary', iconVersion, image, className = '', items, isDotted = true, }) => {
       const textBlockStyleMap = textBlockStyleMaps[blockVersion];
-      return (jsxs("section", { className: `font-sans px-4 py-[18px] flex flex-col ${textBlockStyleMap.background} ${className}`, children: [iconVersion === 'small' ? renderIcon(textBlockStyleMap.icon) : null, iconVersion === 'big' ? renderImage(image) : null, jsxs("div", { className: "py-0.5", children: [title ? (jsx("div", { className: `font-medium text-base mb-1 ${textBlockStyleMap.title}`, children: title })) : null, description ? (jsx("div", { className: `text-sm ${textBlockStyleMap.description}`, children: description })) : null, items?.length ? (jsx(List, { items: items, isDotted: isDotted, version: "gray", className: "mt-1 text-m-sm text-secondary-text" })) : null] })] }));
+      return (jsxs("section", { className: `font-sans px-4 py-[18px] flex flex-col ${textBlockStyleMap.background} ${className}`, children: [iconVersion === 'small' ? renderIcon(textBlockStyleMap.icon) : null, iconVersion === 'big' ? renderImage$1(image) : null, jsxs("div", { className: "py-0.5", children: [title ? (jsx("div", { className: `font-medium text-base mb-1 ${textBlockStyleMap.title}`, children: title })) : null, description ? (jsx("div", { className: `text-sm ${textBlockStyleMap.description}`, children: description })) : null, items?.length ? (jsx(List, { items: items, isDotted: isDotted, version: "gray", className: "mt-1 text-m-sm text-secondary-text" })) : null] })] }));
   });
   function renderIcon(className) {
       return (jsx("div", { className: "mb-3", children: jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs ${className}`, children: "i" }) }));
   }
-  function renderImage(image) {
+  function renderImage$1(image) {
       return image?.src ? jsx(Img, { className: "pb-3 mr-auto", image: image }) : null;
   }
 
+  const isURL = (href) => href?.includes('//');
+  const withoutQuery = (href) => (href || '').replace(/\/?\?.*/, '');
+  const getOrigin = (href) => {
+      if (!href || !isURL(href)) {
+          return undefined;
+      }
+      const url = href;
+      const protoSeparator = '//';
+      const endOfProto = url.indexOf(protoSeparator);
+      const endOfOrigin = url.indexOf('/', endOfProto + protoSeparator.length);
+      return endOfOrigin !== -1 ? url.substring(0, endOfOrigin) : url;
+  };
+
+  var url = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    isURL: isURL,
+    withoutQuery: withoutQuery,
+    getOrigin: getOrigin
+  });
+
+  const MOBILE_URL_PATH = '/mobile';
+  const withoutMobilePath = (href) => (href || '').replace(MOBILE_URL_PATH, '');
+
+  const adjustHref = (href, router) => {
+      if (!href) {
+          return href;
+      }
+      const relativeHref = toRelativeHref(href, router) || '';
+      const isMobilePage = router?.pathname.startsWith(MOBILE_URL_PATH);
+      return isMobilePage && !isURL(relativeHref) ? `${MOBILE_URL_PATH}${relativeHref}` : relativeHref;
+  };
+  const toRelativeHref = (href, router) => {
+      if (!href) {
+          return href;
+      }
+      const origin = getOrigin(router?.href);
+      return origin ? href.replace(origin, '') || '/' : href;
+  };
+
+  const defaultHandlerDecorator = (handler) => handler;
+  function useLink({ router, handlerDecorator = defaultHandlerDecorator, }, link) {
+      const href = adjustHref(link.href, router);
+      return {
+          ...link,
+          href,
+          ariaLabel: link.text,
+          onClick: handlerDecorator((ev) => {
+              const isLocalHref = href && !isURL(href);
+              const isLocalTarget = !link.target || link.target === '_self';
+              if (isLocalHref && isLocalTarget) {
+                  ev.preventDefault();
+                  router.push(href);
+              }
+          }, link),
+      };
+  }
+
+  const ButtonInner = JSX(({ text, aboveText, appendLeft, rounded, version }) => {
+      const withoutText = !text && !aboveText && Boolean(appendLeft);
+      const buttonInnerClasses = version !== 'link'
+          ? `flex items-center justify-center
+          ${withoutText ? 'h-12 w-12' : `px-8 gap-2 ${aboveText ? 'py-2' : 'py-3.5'}`} ${rounded ? 'rounded-full' : ''}`
+          : null;
+      return renderButtonInner({ buttonInnerClasses, appendLeft, withoutText, aboveText, text });
+  });
+  function renderButtonInner({ buttonInnerClasses, appendLeft, withoutText, aboveText, text }) {
+      return (jsxs("div", { className: buttonInnerClasses, children: [appendLeft ? appendLeft : null, withoutText ? null : (jsxs("div", { children: [jsx("div", { className: "text-m-2xs text-left", children: aboveText }), jsx("div", { className: "text-m-button font-medium text-left", children: text })] }))] }));
+  }
+
+  const buttonStyleMap = {
+      primary: 'text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active',
+      secondary: 'text-primary-main bg-secondary-light hover:bg-secondary-hover active:bg-secondary-active',
+      link: 'text-primary-main',
+  };
+  const buttonDisabledStyleMap = {
+      primary: 'bg-secondary-dark text-secondary-text',
+      secondary: 'bg-secondary-light text-secondary-text',
+      link: '',
+  };
+  const styleButton = 'w-full text-center font-sans select-none';
+  const Button = JSX(({ className, text, aboveText, appendLeft, href, target, onClick, children, disabled, rounded, version = 'primary', ariaLabel, ...rest }) => {
+      const buttonInner = children ?? (jsx(ButtonInner, { text: text, aboveText: aboveText, appendLeft: appendLeft, rounded: rounded, version: version }));
+      if (disabled) {
+          return (jsx("div", { role: "button", "aria-disabled": "true", "aria-label": ariaLabel, tabIndex: "-1", className: `inline-block ${styleButton} ${buttonDisabledStyleMap[version] || ''} ${rounded ? 'rounded-full' : 'rounded-md'} ${className || ''}`, children: buttonInner }));
+      }
+      return (jsx("a", { className: `${styleButton} inline-block cursor-pointer no-underline ${buttonStyleMap[version] || ''} ${rounded ? 'rounded-full' : 'rounded-md'} ${className || ''}`, href: href, target: target, onClick: onClick, "aria-label": ariaLabel, role: !href ? 'button' : 'link', ...rest, children: buttonInner }));
+  });
+
+  const ButtonSection = JSX(({ context, className = '', buttons }) => {
+      const { handlerDecorator } = context;
+      const router = context.useRouter();
+      return buttons?.length ? (jsx("div", { className: `${className}`, children: buttons.map((button, index) => renderButton(useLink({ router, handlerDecorator }, button), index)) })) : null;
+  });
+  function renderButton({ icon, ...button }, i) {
+      if (!button?.text)
+          return;
+      return icon ? (jsx(Button, { appendLeft: jsx(Icon, { name: icon, width: "24", height: "24", asSVG: true }), ...button }, String(i))) : (jsx(Button, { ...button }, String(i)));
+  }
+
   const Description = JSX((props) => {
       const { className, description } = props;
-      return jsx("div", { className: `font-normal text-base ${className || ''}`, children: description });
+      return jsx("div", { className: `font-normal text-m-md ${className || ''}`, children: description });
+  });
+
+  const BaseTile = JSX(({ className = '', title, children, buttons, image }) => {
+      return (jsxs("div", { className: `font-sans flex flex-col grow h-full items-start ${className}`, children: [title, jsxs("div", { className: "flex grow w-full justify-between", children: [jsxs("div", { className: "flex flex-col justify-between w-full", children: [jsx("div", { children: children }), jsx("div", { children: buttons })] }), image] })] }));
   });
 
+  const getColSpan = (className) => {
+      const colSpanPrefix = 'col-span-';
+      const colSpanStr = className.split(/\s+/).find((_) => _.startsWith(colSpanPrefix));
+      return colSpanStr ? parseInt(colSpanStr.substring(colSpanPrefix.length), 10) : 12;
+  };
+
+  function getTileHeadingType(className = '') {
+      const colSpan = getColSpan(className);
+      if (colSpan <= 4) {
+          return 'h4';
+      }
+      else if (colSpan <= 8) {
+          return 'h3';
+      }
+      else {
+          return 'h2';
+      }
+  }
+
+  function getTileMinHeight(className = '') {
+      const colSpan = getColSpan(className);
+      if (colSpan <= 6) {
+          return 'min-h-[300px]';
+      }
+      else if (colSpan <= 8) {
+          return 'min-h-[320px]';
+      }
+      else {
+          return 'min-h-[360px]';
+      }
+  }
+
+  function getTileRightPadding(className = '') {
+      const colSpan = getColSpan(className);
+      if (colSpan <= 6) {
+          return 'pr-9';
+      }
+      else if (colSpan <= 8) {
+          return 'pr-[4.75rem]';
+      }
+      else {
+          return 'pr-[9.4rem]';
+      }
+  }
+
   const tileStyleMap = {
       primary: 'bg-white text-primary-text',
       secondary: 'bg-primary-main text-white',
   };
   const Tile = JSX((props) => {
       const { context, title, description, items, children, buttons, image, className = '', version = 'primary', role, } = props;
-      return (jsx("section", { className: `font-sans p-9 box-border ${className} ${tileStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, role: role, children: jsxs(BaseTile, { context: context, title: title && (jsx(Heading, { headingType: getTileHeadingType(className), title: title, className: `whitespace-pre-wrap max-w-[600px] ${version === 'primary' ? 'text-primary-text' : ''}` })), buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex mt-9 gap-3" })) : null, image: image?.src && jsx(Img, { className: "mt-auto ml-7", image: image }), children: [description && jsx(Description, { className: "mt-4 max-w-[600px]", description: description }), children, items?.length ? jsx(List, { items: items }) : null] }) }));
+      return (jsx("section", { className: `font-sans p-9 box-border ${className} ${tileStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, role: role, children: jsxs(BaseTile, { context: context, title: title && (jsx(Heading, { headingType: getTileHeadingType(className), title: title, className: `whitespace-pre-wrap max-w-[600px] ${title ? 'mb-3' : ''}
+              ${version === 'primary' ? 'text-primary-text' : ''}` })), buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex mt-9 gap-3" })) : null, image: image?.src && jsx(Img, { className: "mt-auto ml-7", image: image }), children: [description && jsx(Description, { className: "mt-4 max-w-[600px]", description: description }), children, renderList(items, version)] }) }));
   });
+  function renderList(items, version) {
+      return items?.length ? jsx(List, { items: items, version: version }) : null;
+  }
 
   const productTileStyleMap = {
       primary: 'bg-white text-primary-text',
@@ -701,12 +675,12 @@
   }
   function renderCard$1(card, key) {
       return (jsxs("div", { className: `box-border horizontal-list-item border-solid border rounded-md border-main-stroke p-4 flex flex-col
-      ${blockStyle[card.version ?? 'primary']}`, role: "listitem", children: [jsxs("div", { children: [card.image?.src ? (jsx("div", { className: "flex justify-center", children: jsx(Img, { className: "mb-6", image: card.image }) })) : null, card.title ? jsx("h4", { className: `font-medium text-m-title-xs m-0`, children: card.title }) : null, card.description ? renderDescription(card) : null, card.items?.length ? renderItems(card.items) : null] }), card?.button?.href ? jsx(Button, { className: "mt-3", ...card.button }) : null] }, key));
+      ${blockStyle[card.version ?? 'primary']}`, role: "listitem", children: [jsxs("div", { children: [card.image?.src ? (jsx("div", { className: "flex justify-center", children: jsx(Img, { className: "mb-6", image: card.image }) })) : null, card.title ? jsx("h4", { className: `font-medium text-m-title-xs m-0`, children: card.title }) : null, card.description ? renderDescription(card) : null, card.items?.length ? renderItems$1(card.items) : null] }), card?.button?.href ? jsx(Button, { className: "mt-3", ...card.button }) : null] }, key));
   }
   function renderDescription(card) {
       return (jsx("div", { className: `text-secondary-text mt-2 ${card.version === 'secondary' ? 'text-white opacity-80' : ''}`, children: card.description }));
   }
-  function renderItems(items) {
+  function renderItems$1(items) {
       return (jsx("section", { className: "mt-3", children: items.map((item) => (jsxs("div", { children: [jsx("span", { className: "text-m-md font-medium", children: item.title }), jsx("span", { className: "text-m-sm text-secondary-text pl-2", children: item.text })] }))) }));
   }
 
@@ -747,9 +721,9 @@
       mini: 276,
   };
 
-  const LIST_STYLE_CLASSES = 'rounded-full inline-block mr-3';
+  const LIST_STYLE_CLASSES = 'rounded-full inline-block mr-3 mt-2';
   const TEXT_STYLE_MAP = {
-      primary: 'text-primary-text',
+      primary: 'text-secondary-text',
       secondary: 'text-white',
       gray: 'text-secondary-text',
   };
@@ -759,7 +733,7 @@
       gray: 'bg-secondary-text',
   };
   const BlockItem = JSX(({ className = '', isDotted = true, text, children, version = 'primary' }) => {
-      return (jsxs("div", { className: `font-sans flex items-center ${className}`, role: "listitem", children: [isDotted && jsx("div", { className: getListStyle(version) }), jsx("span", { className: TEXT_STYLE_MAP[version], children: text || children })] }));
+      return (jsxs("div", { className: `font-sans flex items-start ${className}`, role: "listitem", children: [isDotted && jsx("div", { className: getListStyle(version) }), "!!!!!", jsx("span", { className: TEXT_STYLE_MAP[version], children: text || children })] }));
   });
   const getListStyle = (version) => {
       const size = version === 'gray' ? 'w-[6px] h-[6px] min-w-[6px] min-h-[6px]' : 'w-2 h-2 min-w-2 min-h-2';
@@ -767,16 +741,26 @@
   };
 
   const GalleryCardInner = JSX(({ title, description, image, items, button, version }) => {
-      return (jsxs("div", { children: [jsxs("div", { children: [image?.src ? (jsx("div", { className: "flex justify-center", children: jsx(Img, { className: "mb-6", image: image }) })) : null, title && renderCardTitle(title, description, items), description ? jsx("div", { className: `font-normal text-sm mt-2`, children: description }) : null, items?.length ? (jsx("section", { className: `max-w-[308px] mt-2`, role: "list", children: items
-                              .filter((item) => item?.text)
-                              .map((item, i) => renderItem(item.text, i, version)) })) : null] }), button?.text && jsx(Button, { className: "mt-6", ...button })] }));
+      const titleStyleClasses = getTitleStyle(version, description, items);
+      return (jsxs("div", { children: [jsxs("div", { children: [image?.src ? (jsx("div", { className: "flex justify-center", children: jsx(Img, { className: "mb-6", image: image }) })) : null, title ? renderCardTitle(title, titleStyleClasses) : null, description ? (jsx("div", { className: `font-normal text-sm ${title ? 'mt-2' : ''}`, children: description })) : null, items?.length ? renderItems(items, version) : null] }), button?.text && jsx(Button, { className: "mt-6", ...button })] }));
   });
-  function renderCardTitle(title, description, items) {
-      return (jsx("div", { className: `font-medium text-xl m-0 ${!description && !items?.length ? 'text-center' : ''}`, children: title }));
+  function renderCardTitle(title, className) {
+      return jsx("div", { className: `font-medium text-xl m-0 ${className}`, children: title });
+  }
+  function renderItems(items, version) {
+      return (jsx("section", { className: `max-w-[308px] mt-2`, role: "list", children: items
+              .filter((item) => item?.text)
+              .map((item, i) => renderItem(item.text, i, version)) }));
   }
   function renderItem(item, i, version) {
       return (jsx(BlockItem, { version: version ?? 'primary', children: jsx("span", { className: "text-sm", children: item }) }, String(i)));
   }
+  function getTitleStyle(version, description, items) {
+      return `font-medium text-xl m-0
+        ${version !== 'secondary' ? 'text-primary-text' : ''}
+        ${!description && !items?.length ? 'text-center' : ''}
+      `;
+  }
 
   const GalleryContainer = JSX(({ context, title, description, cards = [], version = 'normal', activeCardIndex }) => {
       return (jsxs("div", { children: [jsx("div", { className: "absolute top-0 left-0 bottom-0 w-[84px] bg-gradient-to-r from-white to-transparent" }), jsxs("div", { className: "flex flex-col items-center mb-8", children: [title ? jsx(Heading, { headingType: "h2", className: "text-center", title: title }) : null, description ? (jsx("div", { className: "font-normal text-base max-w-[600px] mt-2.5", children: description })) : null] }), jsx("div", { className: `flex ${cards?.length <= galleryLengthForScrollMap[version] ? 'justify-center' : ''} duration-1000`, style: { transform: `translateX(-${activeCardIndex * cardWidthMap[version]}px)` }, role: "list", children: cards?.map((card, i) => renderCard({ card, version, context }, i)) })] }));
@@ -826,7 +810,7 @@
       const [isActive, setIsActive] = context.useState(false);
       const hasContent = blocks?.length;
       const icon = isActive ? 'MinusIcon' : 'PlusIcon';
-      const getContentBlock = ({ target }) => target.tagName === 'BUTTON' ? target.nextSibling : target.parentNode.nextSibling;
+      const getContentBlock = ({ currentTarget }) => currentTarget.nextSibling;
       const handleToggle = (e) => {
           if (!hasContent) {
               return;
@@ -853,6 +837,36 @@
       return (jsxs("section", { className: `py-6 font-sans bg-white text-primary-text ${bordered ? 'px-4' : ''} ${className}`, children: [title ? jsx(Heading, { headingType: "h3", className: "mb-2 text-center", title: title }) : null, description ? jsx("div", { className: "mb-5 text-m-md text-center", children: description }) : null, accordionItems?.length ? (jsx("ul", { className: "list-none m-0 p-0", children: accordionItems.map((item, i) => (jsx(AccordionItem, { ...item, context: context, bordered: bordered }, `AccordionItem${i}`))) })) : null] }));
   });
 
+  const CBR_EXCHANGE_RATE_URL = 'https://www.cbr-xml-daily.ru/daily_json.js';
+  const CURRENCY_CODES = ['USD', 'EUR'];
+  const CURRENCY_ICONS_MAP = {
+      USD: 'DollarIcon',
+      EUR: 'EuroIcon',
+  };
+  const buttons = [
+      {
+          text: 'Все показатели',
+          href: 'https://cbr.ru/currency_base/daily/',
+          version: 'secondary',
+      },
+  ];
+  const ExchangeRateTile = JSX(({ className = '', context, title = 'Курсы обмена валют' }) => {
+      const { data } = context.useAsyncData(CBR_EXCHANGE_RATE_URL, fetchExchangeRate);
+      return (jsx("section", { className: `bg-white text-primary-text font-sans p-9 box-border ${className}  ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, children: jsx(BaseTile, { context: context, title: title && (jsx(Heading, { headingType: getTileHeadingType(className), title: title, className: `whitespace-pre-wrap max-w-[600px] ${title ? 'mb-3' : ''}` })), buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex mt-9 gap-3" })) : null, children: jsxs("table", { children: [jsx("thead", { children: jsxs("tr", { children: [jsx(CurrencyTH, { children: "\u0412\u0430\u043B\u044E\u0442\u0430" }), jsx(CurrencyTH, { className: "pl-11", children: "\u041A\u0443\u0440\u0441" })] }) }), jsx("tbody", { children: CURRENCY_CODES.map(renderCurrencyRow(data)) })] }) }) }));
+  });
+  const CurrencyTH = JSX(({ className = '', children }) => (jsx("th", { className: `text-left font-normal text-sm text-secondary-text ${className}`, children: children })));
+  const CurrencyTD = JSX(({ className = '', children }) => (jsx("td", { className: `text-left font-normal text-base text-primary-text ${className}`, children: children })));
+  async function fetchExchangeRate() {
+      const response = await fetch(CBR_EXCHANGE_RATE_URL);
+      return await response.json();
+  }
+  const currencyNumberFormat = new Intl.NumberFormat('ru', { style: 'currency', currency: 'RUB' });
+  const formatCurrency = (value) => (value ? currencyNumberFormat.format(value) : '');
+  const renderCurrencyRow = (data) => (code) => {
+      const value = (data?.Valute || {})[code]?.Value;
+      return (jsxs("tr", { children: [jsx(CurrencyTD, { className: "pt-4", children: jsxs("div", { className: "flex items-center", children: [jsx(Icon, { name: CURRENCY_ICONS_MAP[code], width: "24", height: "24" }), jsx("span", { className: "ml-2", children: code })] }) }), jsx(CurrencyTD, { className: "pt-4 pl-11", children: formatCurrency(value) })] }, code));
+  };
+
   const LOGO_PATHS = [
       'm13.72 25.51 4.42-4.33v-2.95l-4.42 4.32v2.96Zm0-10.98 4.42-4.35V7.41l-4.42 4.31v2.8Zm0 3.63 4.42-4.33v-2.78l-4.42 4.32v2.8ZM12.46 7.44l-.6-.56V0h-.66v6.22l-.58-.57V0h-.67v5l-.59-.58V0H8.7v6.56l4.44 4.33V0h-.67v7.44Zm1.26 14.35 4.42-4.33v-2.78L13.72 19v2.8Zm-5.03-.61 4.44 4.33v-2.96l-4.44-4.32v2.95Zm8.79-16.76-.59.58V0h-.66v5.66l-.6.56V0h-.66v6.87l-.58.57V0h-.67v10.9l4.42-4.34V0h-.66v4.42Zm-8.79 5.76 4.44 4.35v-2.8L8.69 7.4v2.77Zm0 3.65 4.44 4.33v-2.8l-4.44-4.3v2.77Zm0 3.63 4.44 4.33V19l-4.44-4.31v2.78Zm26.37 2.29H24.3a2.25 2.25 0 0 0 .36-1.22 2.32 2.32 0 0 0-2.33-2.31 2.32 2.32 0 0 0-2.31 2.31c0 .5.16.96.43 1.34a.74.74 0 0 0-.33.61c0 .26.14.49.33.62a2.32 2.32 0 0 0-.43 1.34 2.31 2.31 0 0 0 2.31 2.31 2.32 2.32 0 0 0 2.33-2.31c0-.45-.13-.87-.36-1.22h8.01v.49h-.8v.68h.8v.7h-.8v1.3h.8v-.58h1.17v.58h.79v-1.3h-.79v-.7h.79v-.68h-.79v-.5h1.58a.56.56 0 0 0 .56-.56v-.34a.57.57 0 0 0-.56-.56Zm-11.53 2.7a1.2 1.2 0 0 1-2.4 0c0-.24.08-.47.2-.66l.34-.56a.97.97 0 0 1-.34-.75c0-.3.13-.56.33-.74l-.32-.56a1.13 1.13 0 0 1-.2-.66 1.2 1.2 0 0 1 2.4 0c0 .49-.56 1.65-.56 1.65v.62c-.01.01.55 1.17.55 1.66ZM4.67 18.34v2.89c0 2.75 1.2 4.53 1.9 5.21l4.58 4.5c1.28 1.25 1.5 1.66 1.79 2.37v-3.2c0-2.84-1.44-3.94-2.19-4.67-1.73-1.68-2.89-2.8-3.82-3.73a8.98 8.98 0 0 1-2.26-3.37Zm6.08 14.24c-1.73-1.7-2.89-2.8-3.82-3.73a10 10 0 0 1-2.25-2.98v2.49a7.87 7.87 0 0 0 1.89 5.24l4.58 4.47c1.28 1.25 1.5 1.85 1.79 2.55v-3.37c0-2.85-1.45-3.95-2.19-4.67Z',
       'M19.88 5.34c-.32 0-.64 0-.96.02V6.7a18.5 18.5 0 1 1 .95 36.94A18.5 18.5 0 0 1 1.35 25.17c0-5.67 2.55-10.73 6.58-14.13V9.32A19.78 19.78 0 0 0 0 25.17C0 36.12 8.9 45 19.88 45a19.85 19.85 0 0 0 19.86-19.83c0-10.95-8.9-19.83-19.87-19.83Z',
@@ -1029,14 +1043,14 @@
 
   const HeaderBurger = JSX(({ context, burgerSubMenu, onClick, defaultLocation = '', children }) => {
       const [city, getCity] = context.useGeolocation(defaultLocation);
-      return (jsxs("div", { className: "absolute top-0 left-0 w-full h-full bg-white p-4", children: [jsx("button", { className: "absolute top-4 right-4", onClick: onClick, children: jsx(Icon, { name: "CloseIcon", width: "24", height: "24", asSVG: true }) }), jsxs(Button, { onClick: getCity, className: "flex items-center text-sm text-secondary-text mb-4", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24", className: "box-border mr-2", asSVG: true }), city] }), children, jsx("div", { className: "mb-7", children: burgerSubMenu?.map(renderBurgerSubMenuItem) }), jsx(SearchBar, { context: context, className: "grow" })] }));
+      return (jsxs("div", { className: "absolute top-0 left-0 w-full h-full bg-white p-4 box-border z-20", children: [jsx("button", { className: "absolute top-4 right-4 border-none bg-transparent", onClick: onClick, children: jsx(Icon, { name: "CloseIcon", width: "24", height: "24", asSVG: true }) }), jsxs(Button, { onClick: getCity, className: "flex items-center text-sm text-secondary-text mb-4", children: [jsx(Icon, { name: "GeolocationIcon", width: "24", height: "24", className: "box-border mr-2", asSVG: true }), city] }), children, jsx("div", { className: "mb-7", children: burgerSubMenu?.map(renderBurgerSubMenuItem) }), jsx(SearchBar, { context: context, className: "grow" })] }));
   });
   const renderBurgerSubMenuItem = (menu, i) => {
       const { icon, href, text } = menu;
       return (jsxs(Button, { href: href, className: "flex text-sm mb-4", children: [icon ? jsx(Icon, { className: "pr-1", name: icon, width: "24", height: "24", asSVG: true }) : null, jsx("span", { className: "pl-0.5 font-medium", children: text })] }, `headerSubMenu-${i}`));
   };
 
-  const HeaderTop = JSX(({ onClick, bgColor }) => (jsxs("div", { className: "flex items-center justify-between border-0 border-b border-main-divider h-[50px]", children: [jsxs("div", { className: "flex items-center", children: [jsx("button", { className: "pr-4", onClick: onClick, "aria-label": "\u041E\u0442\u043A\u0440\u044B\u0442\u044C \u043C\u0435\u043D\u044E", children: jsx(Icon, { name: bgColor === 'bg-white' ? 'BurgerIcon' : 'BurgerIconWhite', width: "24", height: "24", asSVG: true }) }), jsx(Logo, { bgColor: bgColor })] }), jsx("button", { className: `${bgColor === 'bg-white' ? 'text-primary-main' : 'text-white'} text-sm`, children: "\u0412\u043E\u0439\u0442\u0438" })] })));
+  const HeaderTop = JSX(({ onClick, bgColor }) => (jsxs("div", { className: "flex items-center justify-between border-0 border-b border-main-divider h-[50px]", children: [jsxs("div", { className: "flex items-center", children: [jsx("button", { className: "pr-4 border-0 bg-transparent", onClick: onClick, "aria-label": "\u041E\u0442\u043A\u0440\u044B\u0442\u044C \u043C\u0435\u043D\u044E", children: jsx(Icon, { name: bgColor === 'bg-white' ? 'BurgerIcon' : 'BurgerIconWhite', width: "24", height: "24", asSVG: true }) }), jsx(Logo, { bgColor: bgColor })] }), jsx("button", { className: `${bgColor === 'bg-white' ? 'text-primary-main' : 'text-white'} text-sm  border-0 bg-transparent`, children: "\u0412\u043E\u0439\u0442\u0438" })] })));
 
   const Header = JSX(({ className = '', defaultLocation, bgColor = 'bg-white', context, topItems, burgerSubMenu }) => {
       const router = context.useRouter();
@@ -1048,7 +1062,7 @@
       const activeSubItem = findActiveSubItem(router)(subItems);
       const [burgerMenuShow, setBurgerMenuShow] = context.useState(false);
       const toggleBurgerMenu = () => setBurgerMenuShow(!burgerMenuShow);
-      return (jsxs("header", { className: `${bgColor} ${className}`, children: [jsxs("div", { className: "container px-4 py-0", children: [jsx(HeaderTop, { onClick: toggleBurgerMenu, bgColor: bgColor }), jsx("nav", { className: "flex items-center m-0 p-0 overflow-y-hidden w-full h-[50px]", children: jsx("div", { className: "flex", children: subItems?.map((_, i) => renderSubItem({
+      return (jsxs("header", { className: `${bgColor} ${className}`, children: [jsxs("div", { className: "container px-4 py-0 box-border", children: [jsx(HeaderTop, { onClick: toggleBurgerMenu, bgColor: bgColor }), jsx("nav", { className: "flex items-center m-0 p-0 overflow-y-hidden w-full h-[50px]", children: jsx("div", { className: "flex", children: subItems?.map((_, i) => renderSubItem({
                                   ...useLink({ router, handlerDecorator }, _),
                                   active: _ === activeSubItem,
                                   bgColor,
@@ -1056,16 +1070,6 @@
   });
   const renderSubItem = (item, i) => (jsx(HeaderItem, { className: "mr-8 whitespace-nowrap text-sm", ...item }, String(i)));
 
-  const GOLDEN_RATIO = 1.618;
-  const Placeholder = JSX(({ className = '', context, title }) => {
-      return (jsx(Tile, { className: `pr-0 min-h-0 ${className}`, context: context, title: title, description: "\u0411\u043B\u043E\u043A \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043E\u0442\u043A\u0435...", children: jsx("figure", { className: "m-0", children: renderShimmer() }) }));
-  });
-  const renderShimmer = (size = 3) => goldenSequence(100, size)
-      .map((_) => Math.floor(_))
-      .map(renderShimmerItem);
-  const renderShimmerItem = (width = 100, index) => (jsx("div", { style: { width: `${width}%` }, className: "h-4 mt-2 bg-secondary-light" }, String(index)));
-  const goldenSequence = (first, size) => [first].concat(size > 0 ? goldenSequence(first / GOLDEN_RATIO, size - 1) : []);
-
   const benefitTitleStyleMap = {
       primary: 'text-primary-text',
       secondary: 'text-white',
@@ -1075,12 +1079,15 @@
       secondary: 'text-white',
   };
   function renderBenefit(benefit, i, version) {
-      return (jsxs("div", { className: "flex gap-3 items-center mb-2.5 last:mb-0", children: [benefit.icon && (jsx(Icon, { className: "w-[25px] h-[25px] rounded-full box-border", name: benefit.icon, width: "24", height: "24", asSVG: true })), jsx("div", { className: `font-medium text-m-base m-0 ${benefitTitleStyleMap[version]}`, children: benefit.label }), benefit.description && (jsx("div", { className: `font-normal text-m-sm ${benefitDescStyleMap[version]}`, children: benefit.description }))] }, String(i)));
+      return (jsxs("div", { className: "flex gap-3 items-center mb-2.5 last:mb-0", children: [benefit.icon && (jsx(Icon, { className: "w-6 h-6 rounded-full box-border", name: benefit.icon, width: "24", height: "24", asSVG: true })), jsx("div", { className: `font-medium text-m-title-xs m-0 ${benefitTitleStyleMap[version]}`, children: benefit.label }), benefit.description && (jsx("div", { className: `font-normal text-m-sm ${benefitDescStyleMap[version]}`, children: benefit.description }))] }, String(i)));
   }
 
   const ProductBlockInner = JSX(({ className = '', context, title, headingType = 'h2', description, benefits, buttons, image, items, version = 'primary', }) => {
-      return (jsxs("div", { className: `${className}`, children: [jsx("div", { children: jsxs(BaseTile, { context: context, title: title && (jsx(Heading, { headingType: headingType, title: title, className: `whitespace-pre-wrap max-w-[600px]` })), buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex mt-9 gap-3" })) : null, children: [description && jsx(Description, { description: description }), benefits?.length ? (jsx("div", { className: "mt-[19px]", children: benefits.map((_, i) => renderBenefit(_, i, version)) })) : null, items?.length ? jsx(List, { items: items }) : null] }) }), image?.src && (jsx("div", { className: "mt-5", children: jsx(Img, { image: { className: 'block', ...image } }) }))] }));
+      return (jsxs("div", { className: `w-full text-primary-text ${className}`, children: [jsx("div", { children: jsxs(BaseTile, { context: context, title: title && (jsx(Heading, { headingType: headingType, title: title, className: `whitespace-pre-wrap max-w-[600px] ${title ? 'mb-3' : ''}` })), buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex flex-col mt-5 gap-2.5" })) : null, children: [description && jsx(Description, { description: description }), benefits?.length ? (jsx("div", { className: "mt-5", children: benefits.map((_, i) => renderBenefit(_, i, version)) })) : null, items?.length ? jsx(List, { items: items }) : null] }) }), renderImage(image)] }));
   });
+  function renderImage(image) {
+      return image?.src ? (jsx("div", { className: "mt-5", children: jsx(Img, { image: { className: 'block', ...image } }) })) : null;
+  }
 
   const ProductBlock = JSX(
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -1090,25 +1097,13 @@
   });
 
   const ProductGalleryBlock = JSX(({ block, headingType, context }) => {
-      return (jsx("section", { className: "flex grow-0 shrink-0 basis-full px-4 py-6", role: "listitem", children: jsx("div", { className: "flex grow", children: jsx(ProductBlockInner, { context: context, headingType: headingType || 'h2', ...block }) }) }));
+      return (jsx("section", { className: "flex grow-0 shrink-0 basis-full px-4 pt-6", role: "listitem", children: jsx("div", { className: "flex grow", children: jsx(ProductBlockInner, { context: context, headingType: headingType || 'h2', ...block }) }) }));
   });
 
-  const ProductGallery = JSX(({ className, context, duration = 0, slides = [] }) => {
+  const ProductGallery = JSX(({ className, context, slides = [] }) => {
       const galleryBlocks = slides.map((s) => s.productBlock);
-      const [activeSlideIndex, setActiveSlideIndex] = context.useState(0);
-      return (jsxs("section", { className: `font-sans bg-white overflow-hidden w-100 ${className || ''}`, children: [jsx("div", { className: `flex duration-1000`, style: { transform: `translateX(-${activeSlideIndex}00%)` }, role: "list", children: galleryBlocks.map((block, i) => (jsx(ProductGalleryBlock, { block: block, context: context }, String(i)))) }), jsx("div", { className: "flex px-4 py-6", children: slides.map((_, i) => renderNavButton({
-                      slide: _.productBlock,
-                      i,
-                      activeSlideIndex,
-                      onClick: () => setActiveSlideIndex(i),
-                      duration,
-                  })) })] }));
+      return (jsx("section", { className: `font-sans bg-white overflow-hidden w-100 pb-6 ${className || ''}`, children: jsx(SwipeListControl, { context: context, children: galleryBlocks.map((block, i) => (jsx(ProductGalleryBlock, { block: block, context: context }, String(i)))) }) }));
   });
-  function renderNavButton({ slide, i, activeSlideIndex, onClick, duration }) {
-      const isActiveBtn = i === activeSlideIndex;
-      const progressBarClassName = isActiveBtn ? 'animate-slide bg-primary-main' : 'bg-main-divider';
-      return (jsx("button", { type: "button", onClick: onClick, "aria-label": slide?.title, className: `relative overflow-hidden border-0 bg-inherit cursor-pointer pl-0 mr-1.5 pt-4 pb-5 last:mr-0 grow basis-0`, children: jsx("div", { className: `absolute bottom-0 left-0 w-full h-[3px] ${progressBarClassName}`, style: { animationDuration: `${duration}s`, animationFillMode: 'forwards' } }) }, String(i)));
-  }
 
   const StepsBlock = JSX(({ className, title, description, steps, size = 'normal' }) => {
       return (jsxs("section", { className: `box-border font-sans text-primary-text bg-white px-4 py-6 flex flex-col ${className || ''}`, children: [title && jsx(Heading, { headingType: "h3", className: "text-center", title: title }), description && jsx("p", { className: `text-m-md text-center ${title && 'mt-2'}`, children: description }), steps?.length ? (jsx("div", { className: `box-border py-0.5 mb-0.5 mt-5`, children: jsx("div", { className: "flex flex-col justify-between gap-x-[101px]", children: steps.map((step, i) => renderStepTitle({ step, size, i, length: steps.length })) }) })) : null] }));
@@ -1117,7 +1112,7 @@
       const { step, size, i, length } = params;
       const isLastStep = length - 1 === i;
       const margin = size === 'normal' ? 'ml-[34px]' : 'ml-[24px]';
-      return (jsx("div", { children: jsxs("div", { className: "flex flex-row text-center relative", children: [jsxs("div", { children: [renderIconArea(step, size, i), !isLastStep && jsx("div", { className: `min-h-8 h-full w-[2px] bg-secondary-light ${margin}` })] }), jsxs("div", { className: "flex flex-col justify-center relative", children: [step.label && (jsx("div", { className: "font-medium text-m-title-xs m-0 text-left", children: step.label })), step.description && (jsx("div", { className: `font-normal text-sm text-secondary-text text-left ${step.label ? 'mt-1' : ''}`, children: step.description }))] })] }, String(i)) }, String(i)));
+      return (jsx("div", { children: jsxs("div", { className: "flex flex-row text-center relative", children: [jsxs("div", { children: [renderIconArea(step, size, i), !isLastStep && jsx("div", { className: `min-h-8 h-full w-[2px] bg-secondary-light ${margin}` })] }), jsxs("div", { className: "flex flex-col justify-start relative", children: [step.label && (jsx("div", { className: "font-medium text-m-title-xs m-0 text-left", children: step.label })), step.description && (jsx("div", { className: `font-normal text-sm text-secondary-text text-left ${step.label ? 'mt-1' : ''}`, children: step.description }))] })] }, String(i)) }, String(i)));
   };
   const renderIconArea = (step, size, i) => {
       const iconAreaSize = size === 'normal'
@@ -1129,16 +1124,18 @@
   };
 
   const Blocks = {
+      Accordion,
       ExchangeRateTile,
       Footer,
+      Gallery,
       Header,
       Headline,
       LinkDocs,
-      Placeholder,
+      MobileAppTile,
       ProductBlock,
       ProductGallery,
-      TextBlock,
       StepsBlock,
+      TextBlock,
   };
 
   const LikeButton = JSX(({ className, onClick, ariaLabel }) => (jsx("button", { type: "button", className: `border-0 w-[36px] bg-inherit cursor-pointer ${className || ''}`, onClick: onClick, "aria-label": ariaLabel, children: renderLikeIcon() })));
@@ -1157,6 +1154,16 @@
       return (jsxs("div", { className: `border-main border-2 border-solid bg-white flex w-[125px] items-center justify-center gap-3 p-2 font-sans ${className || ''}`, children: [jsx(LikeButton, { onClick: likeService.like, ariaLabel: "\u041F\u043E\u0441\u0442\u0430\u0432\u0438\u0442\u044C \u043E\u0442\u043C\u0435\u0442\u043A\u0443 \u00AB\u043B\u0430\u0439\u043A\u00BB" }), jsx(LikeButton, { onClick: likeService.dislike, className: "rotate-180", ariaLabel: "\u041F\u043E\u0441\u0442\u0430\u0432\u0438\u0442\u044C \u043E\u0442\u043C\u0435\u0442\u043A\u0443 \u00AB\u0434\u0438\u0437\u043B\u0430\u0439\u043A\u00BB" }), jsx("span", { className: "select-none", children: likeService.likeCount })] }));
   });
 
+  const GOLDEN_RATIO = 1.618;
+  const Placeholder = JSX(({ className, context, title, description = 'Блок в разработке...' }) => {
+      return (jsx("section", { className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, children: jsxs(BaseTile, { context: context, title: title ? (jsx(Heading, { headingType: getTileHeadingType(className), title: title, className: `whitespace-pre-wrap max-w-[600px]` })) : null, children: [description ? (jsx(Description, { className: "mt-4 max-w-[600px]", description: description })) : null, jsx("figure", { className: "m-0 min-w-[600px]", children: renderShimmer() })] }) }));
+  });
+  const renderShimmer = (size = 3) => goldenSequence(100, size)
+      .map((_) => Math.floor(_))
+      .map(renderShimmerItem);
+  const renderShimmerItem = (width = 100, index) => (jsx("div", { style: { width: `${width}%` }, className: "h-4 mt-2 bg-secondary-light" }, String(index)));
+  const goldenSequence = (first, size) => [first].concat(size > 0 ? goldenSequence(first / GOLDEN_RATIO, size - 1) : []);
+
   const defaultBlockDecorator = ({ blockClassName, block, render }) => render({ blockClassName, block });
   const ContentPage = JSX(({ className, context, blocksRegistry, data: { style: pageStyle, blocks, slots = {}, likeControl, colorPalette = 'pc' }, blockDecorator = defaultBlockDecorator, }) => {
       const { header } = slots;
@@ -1164,10 +1171,10 @@
   });
   function renderBlock({ block, blockDecorator, blocksRegistry, context }, i) {
       const { type } = block;
-      if (!(type in blocksRegistry)) {
+      if (!(type && type in blocksRegistry)) {
           console.warn(`No block with "${type}" is registered`);
       }
-      const BlockComponent = blocksRegistry[type] || Placeholder;
+      const BlockComponent = blocksRegistry[type || 'Placeholder'] || Placeholder;
       return blockDecorator({
           blockClassName: style2className(block.style),
           block,
@@ -1182,14 +1189,16 @@
   }
 
   const ContentPageHead = JSX(({ HeadComponent, data, children }) => {
-      const { title, description, keywords, robots, og } = data;
+      const { title, main: { description, keywords, canonical, robots }, og, twitter, jsonLd, } = data;
       return (jsxs(HeadComponent, { children: [jsx("title", { children: title }), jsx("meta", { name: "viewport", content: "width=device-width, initial-scale=1" }), description && jsx("meta", { name: "description", content: description }), keywords && jsx("meta", { name: "keywords", content: keywords.join(',') }), robots && jsx("meta", { name: "robots", content: robots.join(',') }), og
                   ? Object.entries(og).map(([key, value]) => (jsx("meta", { name: `og:${key}`, content: value }, key)))
-                  : null, children] }));
+                  : null, twitter
+                  ? Object.entries(twitter).map(([key, value]) => (jsx("meta", { name: `twitter:${key}`, content: value }, key)))
+                  : null, canonical && jsx("link", { rel: "canonical", href: canonical }), jsonLd && jsx("script", { type: "application/ld+json", children: jsonLd }), children] }));
   });
 
-  function isBlockInRegistry(block, registry) {
-      return block.type in registry;
+  function isBlockInRegistry(blockType, registry) {
+      return (blockType || '') in registry;
   }
 
   function normalizeBlock(block) {
@@ -1217,7 +1226,7 @@
   }
   function getMobileBlocks(blocks) {
       return blocks
-          ?.filter((block) => isBlockInRegistry(block, Blocks) && !block.mobile?.hidden)
+          ?.filter((block) => isBlockInRegistry(block?.type || block?.mobile?.type, Blocks) && !block.mobile?.hidden)
           .map(normalizeBlock);
   }