@redneckz/wildless-cms-uni-blocks 0.3.83 → 0.3.85

package/lib/ui-kit/RadioButtonGroup/RadioButtonGroup.fixture.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    default: any;
+};
+export default _default;

package/lib/ui-kit/RadioButtonGroup/RadioButtonGroup.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
+import { JSX } from '@redneckz/uni-jsx';
+import { Checkbox } from '../Checkbox/Checkbox.js';
+export const RadioButtonGroup = JSX(({ items, checkedItem, onChangeCheckedItem }) => {
+    return (_jsx("div", { children: items?.map(({ id, text }) => (_jsx(Checkbox, { isRadio: true, text: text, checked: checkedItem === id, onChange: () => onChangeCheckedItem(id) }, id))) }));
+});
+//# sourceMappingURL=RadioButtonGroup.js.map

package/lib/ui-kit/RadioButtonGroup/RadioButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonGroup.js","sourceRoot":"","sources":["../../../src/ui-kit/RadioButtonGroup/RadioButtonGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAahD,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CACjC,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,mBAAmB,EAAE,EAAE,EAAE;IAC9C,OAAO,CACL,wBACG,KAAK,EAAE,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAC5B,KAAC,QAAQ,IAEP,OAAO,QACP,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,WAAW,KAAK,EAAE,EAC3B,QAAQ,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,EAAE,CAAC,IAJlC,EAAE,CAKP,CACH,CAAC,GACE,CACP,CAAC;AACJ,CAAC,CACF,CAAC"}

package/lib/ui-kit/SearchBar/SearchBar.js

@@ -1,12 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
+import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
 import { JSX } from '@redneckz/uni-jsx';
-import { Button } from '../Button/Button.js';
-import { Img } from '../Img/Img.js';
-export const SearchBar = JSX(({ className, context }) => {
-    const { term, setTerm } = context.useSearch();
-    return (_jsxs("form", { className: `relative ${className || ''}`, children: [_jsxs("div", { className: "absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none", children: [_jsx("div", { className: "w-[24px] h-[24px]", children: _jsx(Img, { image: "LoupeIcon", width: "24", height: "24" }) }), term ? null : (_jsx("label", { htmlFor: "search-bar-input", className: "font-sans font-light text-base text-secondary-text", children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443" }))] }), _jsx("input", { id: "search-bar-input", className: 'h-12 pl-12 w-full peer font-sans font-light text-base text-black border border-solid rounded h-full box-border outline-none pr-[6%] border-main-divider focus:border-primary-text', value: term, onChange: (e) => setTerm(e.target.value), type: "text", name: "search-bar-input" }), _jsx(Button, { version: "primary", text: "\u041D\u0430\u0439\u0442\u0438", className: "invisible peer-focus:visible absolute top-1 right-1", onClick: (e) => {
-                    e.preventDefault();
-                    console.log('click');
-                }, children: _jsx("div", { className: "font-normal text-sm px-9 py-[9px]", children: "\u041D\u0430\u0439\u0442\u0438" }) })] }));
+import { SearchBarInner } from './SearchBarInner.js';
+export const SearchBar = JSX(({ className = '', context }) => {
+    return _jsx(SearchBarInner, { context: context, className: className });
 });
 //# sourceMappingURL=SearchBar.js.map

package/lib/ui-kit/SearchBar/SearchBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../src/ui-kit/SearchBar/SearchBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AAEjC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAgB,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE;IACrE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,SAAS,EAAE,CAAC;IAE9C,OAAO,CACL,gBAAM,SAAS,EAAE,YAAY,SAAS,IAAI,EAAE,EAAE,aAC5C,eAAK,SAAS,EAAC,yGAAyG,aACtH,cAAK,SAAS,EAAC,mBAAmB,YAChC,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GAC5C,EACL,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACb,gBACE,OAAO,EAAC,kBAAkB,EAC1B,SAAS,EAAC,oDAAoD,2FAGxD,CACT,IACG,EACN,gBACE,EAAE,EAAC,kBAAkB,EACrB,SAAS,EACP,mLAAmL,EAErL,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACxC,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,kBAAkB,GACvB,EACF,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,gCAAO,EACZ,SAAS,EAAC,qDAAqD,EAC/D,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;gBACvB,CAAC,YAED,cAAK,SAAS,EAAC,mCAAmC,+CAAY,GACvD,IACJ,CACR,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../src/ui-kit/SearchBar/SearchBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAgB,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;IAC1E,OAAO,KAAC,cAAc,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;AACpE,CAAC,CAAC,CAAC"}

package/lib/ui-kit/SearchBar/SearchBar.mobile.js

@@ -1,11 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
+import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
 import { JSX } from '@redneckz/uni-jsx';
-import { Img } from '../Img/Img.js';
-export const SearchBar = JSX(({ className, context }) => {
-    const { term, setTerm } = context.useSearch();
-    return (_jsxs("form", { className: `relative ${className || ''}`, children: [_jsxs("div", { className: "absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none", children: [_jsx("div", { className: "w-[20px] h-[20px]", children: _jsx(Img, { image: "LoupeIcon", width: "24", height: "24" }) }), term ? null : (_jsx("label", { htmlFor: "search-bar-input", className: "font-sans font-normal text-sm text-secondary-text", children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443" }))] }), _jsx("input", { id: "search-bar-input", className: 'h-12 pl-12 w-full peer placeholder-transparent font-sans font-normal text-base text-black border border-solid rounded box-border outline-none pr-[6%] border-main-divider focus:border-primary-text', value: term, onChange: (e) => setTerm(e.target.value), type: "text", name: "search-bar-input", placeholder: "some search" }), _jsx("button", { className: "visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none", onClick: (e) => {
-                    e.preventDefault();
-                    setTerm('');
-                }, children: _jsx(Img, { image: "CloseIcon", width: "24", height: "24" }) })] }));
+import { SearchBarInner } from './SearchBarInner.js';
+export const SearchBar = JSX(({ className = '', context }) => {
+    return _jsx(SearchBarInner, { context: context, className: className, isMobile: true });
 });
 //# sourceMappingURL=SearchBar.mobile.js.map

package/lib/ui-kit/SearchBar/SearchBar.mobile.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.mobile.js","sourceRoot":"","sources":["../../../src/ui-kit/SearchBar/SearchBar.mobile.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AAEjC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAgB,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE;IACrE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,SAAS,EAAE,CAAC;IAE9C,OAAO,CACL,gBAAM,SAAS,EAAE,YAAY,SAAS,IAAI,EAAE,EAAE,aAC5C,eAAK,SAAS,EAAC,yGAAyG,aACtH,cAAK,SAAS,EAAC,mBAAmB,YAChC,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GAC5C,EACL,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACb,gBACE,OAAO,EAAC,kBAAkB,EAC1B,SAAS,EAAC,mDAAmD,2FAGvD,CACT,IACG,EACN,gBACE,EAAE,EAAC,kBAAkB,EACrB,SAAS,EACP,qMAAqM,EAEvM,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACxC,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,kBAAkB,EACvB,WAAW,EAAC,aAAa,GACzB,EACF,iBACE,SAAS,EAAC,uHAAuH,EACjI,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,OAAO,CAAC,EAAE,CAAC,CAAC;gBACd,CAAC,YAED,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GACzC,IACJ,CACR,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"SearchBar.mobile.js","sourceRoot":"","sources":["../../../src/ui-kit/SearchBar/SearchBar.mobile.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAgB,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;IAC1E,OAAO,KAAC,cAAc,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,GAAI,CAAC;AACpF,CAAC,CAAC,CAAC"}

package/lib/ui-kit/SearchBar/SearchBarInner.d.ts

@@ -0,0 +1,5 @@
+import type { UniBlockProps } from '../../types';
+export interface SearchBarInnerProps extends UniBlockProps {
+    isMobile?: boolean;
+}
+export declare const SearchBarInner: (props: import("@redneckz/uni-jsx").PropsWithChildren<SearchBarInnerProps, any>, context?: any) => any;

package/lib/ui-kit/SearchBar/SearchBarInner.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
+import { JSX } from '@redneckz/uni-jsx';
+import { Button } from '../Button/Button.js';
+import { Img } from '../Img/Img.js';
+export const SearchBarInner = JSX(({ className, context, isMobile = false }) => {
+    const { term, setTerm } = context.useSearch();
+    const LoupeIconClassName = isMobile ? 'w-[20px] h-[20px]' : 'w-[24px] h-[24px]';
+    const SearchBarLabelClassName = isMobile ? 'font-normal text-sm' : 'font-light text-base';
+    const SearchBarInputClassName = isMobile
+        ? ' placeholder-transparent font-normal'
+        : 'font-light h-full';
+    const inputPlaceholder = isMobile ? 'some search' : null;
+    return (_jsxs("form", { className: `font-sans relative ${className}`, children: [_jsxs("div", { className: "absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none", children: [_jsx("div", { className: LoupeIconClassName, children: _jsx(Img, { image: "LoupeIcon", width: "24", height: "24" }) }), term ? null : (_jsx("label", { htmlFor: "search-bar-input", className: `text-secondary-text ${SearchBarLabelClassName}`, children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443" }))] }), _jsx("input", { id: "search-bar-input", className: `h-12 pl-12 w-full peer text-base text-black border border-solid rounded box-border
+              outline-none pr-[6%] border-main-divider focus:border-primary-text ${SearchBarInputClassName}`, value: term, onChange: (e) => setTerm(e.target.value), type: "text", name: "search-bar-input", placeholder: inputPlaceholder }), isMobile ? (_jsx("button", { className: "visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none", onClick: (e) => {
+                    e.preventDefault();
+                    setTerm('');
+                }, children: _jsx(Img, { image: "CloseIcon", width: "24", height: "24" }) })) : (_jsx(Button, { version: "primary", text: "\u041D\u0430\u0439\u0442\u0438", className: "invisible peer-focus:visible absolute top-1 right-1", onClick: (e) => {
+                    e.preventDefault();
+                    console.log('click');
+                }, children: _jsx("div", { className: "font-normal text-sm px-9 py-[9px]", children: "\u041D\u0430\u0439\u0442\u0438" }) }))] }));
+});
+//# sourceMappingURL=SearchBarInner.js.map

package/lib/ui-kit/SearchBar/SearchBarInner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchBarInner.js","sourceRoot":"","sources":["../../../src/ui-kit/SearchBar/SearchBarInner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AAMjC,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAC/B,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,GAAG,KAAK,EAAE,EAAE,EAAE;IAC3C,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,SAAS,EAAE,CAAC;IAE9C,MAAM,kBAAkB,GAAG,QAAQ,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAChF,MAAM,uBAAuB,GAAG,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,sBAAsB,CAAC;IAC1F,MAAM,uBAAuB,GAAG,QAAQ;QACtC,CAAC,CAAC,sCAAsC;QACxC,CAAC,CAAC,mBAAmB,CAAC;IACxB,MAAM,gBAAgB,GAAG,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC;IAEzD,OAAO,CACL,gBAAM,SAAS,EAAE,sBAAsB,SAAS,EAAE,aAChD,eAAK,SAAS,EAAC,yGAAyG,aACtH,cAAK,SAAS,EAAE,kBAAkB,YAChC,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GAC5C,EACL,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACb,gBACE,OAAO,EAAC,kBAAkB,EAC1B,SAAS,EAAE,uBAAuB,uBAAuB,EAAE,2FAGrD,CACT,IACG,EACN,gBACE,EAAE,EAAC,kBAAkB,EACrB,SAAS,EAAE;mFAC8D,uBAAuB,EAAE,EAClG,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACxC,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,kBAAkB,EACvB,WAAW,EAAE,gBAAgB,GAC7B,EACD,QAAQ,CAAC,CAAC,CAAC,CACV,iBACE,SAAS,EAAC,uHAAuH,EACjI,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,OAAO,CAAC,EAAE,CAAC,CAAC;gBACd,CAAC,YAED,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GACzC,CACV,CAAC,CAAC,CAAC,CACF,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,gCAAO,EACZ,SAAS,EAAC,qDAAqD,EAC/D,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;gBACvB,CAAC,YAED,cAAK,SAAS,EAAC,mCAAmC,+CAAY,GACvD,CACV,IACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC"}

package/mobile/bundle/bundle.umd.js

@@ -197,7 +197,7 @@
   const Heading = JSX((props) => {
       const { className, headingType, title, as } = props;
       if (!headingType) {
-          return;
+          return null;
       }
       const Tag = as || headingType;
       return (jsx(Tag, { className: `font-sans font-medium m-0 ${HeadingClass[headingType]} ${className || ''}`, children: title }));
@@ -250,6 +250,7 @@
       IconMap["InterestGrowthIcon"] = "InterestGrowthIcon";
       IconMap["InterestIcon"] = "InterestIcon";
       IconMap["JCBIcon"] = "JCBIcon";
+      IconMap["Logo"] = "Logo";
       IconMap["LoupeIcon"] = "LoupeIcon";
       IconMap["MasterCardIcon"] = "MasterCardIcon";
       IconMap["MinusIcon"] = "MinusIcon";
@@ -332,6 +333,7 @@
       IconTitleMap["InterestGrowthIcon"] = "\u0414\u0438\u0430\u0433\u0440\u0430\u043C\u043C\u0430 \u0440\u043E\u0441\u0442\u0430";
       IconTitleMap["InterestIcon"] = "\u0421\u043A\u0438\u0434\u043A\u0430";
       IconTitleMap["JCBIcon"] = "JCB";
+      IconTitleMap["Logo"] = "Logo";
       IconTitleMap["LoupeIcon"] = "\u041B\u0443\u043F\u0430";
       IconTitleMap["MasterCardIcon"] = "MasterCard";
       IconTitleMap["MinusIcon"] = "\u041C\u0438\u043D\u0443\u0441";
@@ -418,35 +420,49 @@
       return typeof image === 'string' ? 'normal' : image.iconVersion || 'normal';
   }
 
-  const Img = JSX(({ className = '', image, imageClassName = '', ...iconProps }) => {
-      // backwards compatibility with existing icons in usage
-      const icon = typeof image === 'string' ? image : image?.icon;
-      if (icon || icon === '') {
-          return (jsx(Icon, { className: className, imageClassName: imageClassName, iconVersion: getIconVersion(image), name: icon, ...iconProps }));
+  const sourcesComparator = (a, b) => {
+      if (a.media && b.media) {
+          return a.media - b.media;
       }
-      return (jsx(ImgAsPicture, { className: className, imageClassName: imageClassName, image: image }));
-  });
-  const ImgAsPicture = JSX(({ className = '', image, imageClassName = '' }) => {
+      return 0;
+  };
+  const ImgAsPicture = JSX(({ className = '', image, imageClassName = '', isMobile = false }) => {
       if (!image) {
           return null;
       }
-      return (jsxs("picture", { className: className, children: [image?.sources?.length
-                  ? image.sources.map(({ src, format }, index) => (jsx("source", { srcSet: src, type: formatToMimeType(format) }, `${index}_${src}`)))
-                  : null, renderImg(image, imageClassName)] }));
+      const pictureStyles = isMobile ? 'flex' : 'flex-none';
+      return (jsxs("picture", { className: `${pictureStyles} ${className}`, children: [image?.sources?.length
+                  ? image.sources
+                      .sort(sourcesComparator)
+                      .map(({ src, format, media, size }, index) => (jsx("source", { srcSet: src, type: formatToMimeType(format), media: media ? `(max-width: ${media}px)` : '', ...size }, `${index}_${src}`)))
+                  : null, renderImg(image, imageClassName, isMobile)] }));
   });
-  const renderImg = (image, imageClassName = '') => {
-      const style = {
-          width: image.size?.width ? `${image.size?.width}px` : '100%',
-          height: image.size?.height ? `${image.size?.height}px` : '100%',
-      };
+  const renderImg = (image, imageClassName = '', isMobile = false) => {
       const title = image.title || '';
       const alt = image.alt || image.title;
-      return (jsx("img", { src: image.src, className: `m-auto ${imageClassName}`, alt: alt, title: title, style: style, ...image.size }));
+      const imgStyle = isMobile ? 'm-auto' : 'm-0';
+      return (jsx("img", { src: image.src, className: `${imgStyle} ${imageClassName}`, alt: alt, title: title, ...image.size }));
   };
   function formatToMimeType(format) {
       return format ? `image/${String(format)}` : undefined;
   }
 
+  const ImgInner = JSX(({ className = '', image, imageClassName = '', isMobile, ...iconProps }) => {
+      if (!image) {
+          return null;
+      }
+      // backwards compatibility with existing icons in usage
+      const icon = typeof image === 'string' ? image : image.icon;
+      if (icon || icon === '') {
+          return icon.length ? (jsx(Icon, { className: className, imageClassName: imageClassName, iconVersion: getIconVersion(image), name: icon, ...iconProps })) : null;
+      }
+      return (jsx(ImgAsPicture, { className: className, imageClassName: imageClassName, image: image, isMobile: isMobile }));
+  });
+
+  const Img = JSX(({ className = '', image }) => {
+      return jsx(ImgInner, { className: className, image: image, isMobile: true });
+  });
+
   function style2className(style) {
       return style ? style.filter(Boolean).join(' ') : '';
   }
@@ -763,7 +779,7 @@
   });
   function renderButton$3({ icon, iconRight, ...button }, i) {
       if (!button?.text) {
-          return;
+          return null;
       }
       return icon ? (jsx(Button, { appendLeft: jsx(Img, { image: icon, width: "24", height: "24", asSVG: true }), appendRight: jsx(Img, { image: iconRight, width: "24", height: "24", asSVG: true }), ...button }, String(i))) : (jsx(Button, { ...button }, String(i)));
   }
@@ -882,7 +898,8 @@
   };
   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, { className: "mt-1 text-m-md", items: items, isDotted: isDotted, version: blockVersion === 'secondary' ? 'secondary' : 'gray' })) : null] })] }));
+      const listBlockVersion = blockVersion === 'secondary' ? 'secondary' : 'gray';
+      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, { className: "mt-1 text-m-md", items: items, isDotted: isDotted, version: listBlockVersion })) : 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" }) }));
@@ -896,7 +913,8 @@
       secondary: 'bg-primary-main text-white',
   };
   const Gallery = JSX(({ context, title, description, cards = [], className, orientation = 'horizontal' }) => {
-      return (jsxs("section", { className: `relative font-sans text-primary-text bg-white px-4 py-6 overflow-hidden ${className}`, children: [jsxs("div", { className: "flex flex-col items-center mb-5", children: [title ? (jsx(Heading, { headingType: "h3", className: `text-center ${description ? 'mb-2' : 'mb-5'}`, title: title })) : null, description ? (jsx("div", { className: "font-normal text-m-md max-w-[600px] text-center mb-5", children: description })) : null] }), renderCardsLayout(orientation, cards, context)] }));
+      const headingClassName = description ? 'mb-2' : 'mb-5';
+      return (jsxs("section", { className: `relative font-sans text-primary-text bg-white px-4 py-6 overflow-hidden ${className}`, children: [jsxs("div", { className: "flex flex-col items-center mb-5", children: [title ? (jsx(Heading, { headingType: "h3", className: `text-center ${headingClassName}`, title: title })) : null, description ? (jsx("div", { className: "font-normal text-m-md max-w-[600px] text-center mb-5", children: description })) : null] }), renderCardsLayout(orientation, cards, context)] }));
   });
   function renderCardsLayout(orientation, cards, context) {
       return orientation === 'horizontal' ? (jsx(SwipeListControl, { context: context, children: cards?.map(renderCard) })) : (jsx("div", { className: "grid gap-[14px]", children: cards?.map(renderCard) }));
@@ -923,9 +941,9 @@
       if (entry.isIntersecting) ;
   };
 
-  const BlockWrapper = JSX(({ anchor, className, context, children, Tag = 'section', ...rest }) => {
+  const BlockWrapper = JSX(({ anchor, className, context, children, Tag = 'section' }) => {
       const { IntersectionObserverTag } = context;
-      return anchor ? (jsx(IntersectionObserverTag, { Tag: Tag, className: className, observerCallback: changeHashOnObserve, observerOptions: { threshold: 1 }, anchor: anchor, ...rest, children: children })) : (jsx(Tag, { className: className, ...rest, children: children }));
+      return anchor ? (jsx(IntersectionObserverTag, { Tag: Tag, className: className, observerCallback: changeHashOnObserve, observerOptions: { threshold: 1 }, anchor: anchor, children: children })) : (jsx(Tag, { className: className, children: children }));
   });
 
   const LinkList = JSX(({ className = '', documents, ...rest }) => {
@@ -949,11 +967,13 @@
 
   const renderBlocksList = ({ blocks, context, className = '' }) => blocks?.length ? blocks.map(renderBlock$1({ context, className })) : null;
   const renderBlock$1 = ({ context, className }) => (block, i) => {
-      const type = block?.blockListType;
+      if (!block) {
+          return null;
+      }
+      const { style, blockListType: type, ...rest } = block;
       if (!type || !(type in EmbeddableBlocks)) {
           return null;
       }
-      const { style, ...rest } = block;
       const classNameBlock = style2className(style);
       const EmbeddedBlock = EmbeddableBlocks[type];
       return (jsx(EmbeddedBlock, { className: `${className} ${classNameBlock}`, context: context, ...rest }, `block_${i}`));
@@ -1092,6 +1112,7 @@
       }
       catch (err) {
           console.error(err);
+          return Promise.resolve();
       }
   }
   const EXCHANGE_RATES_URL = 'https://coins.rshb.ru/api/catalog/vue_storefront_magento_1_currency_rates_average/currency_rates_average/_search?size=10000';
@@ -1123,39 +1144,17 @@
   };
   const getCurrencyListByRate = (currencyRates) => currencyRates.reduce((result, _) => {
       const currencyInfo = _['currency_first'];
-      if (!validateRate(_['rate_buy']) && !validateRate(_['rate_sell'])) {
-          return result;
-      }
-      const currencyCode = currencyInfo.code;
+      const currencyCode = currencyInfo?.code;
       if (!result.some((i) => i.code === currencyCode)) {
           result.push({
               code: currencyCode,
-              buy: Number(_.rate_buy),
-              sell: Number(_.rate_sell),
+              buy: roundRate(Number(_.rate_buy)),
+              sell: roundRate(Number(_.rate_sell)),
           });
       }
       return result;
   }, []);
-  const validateRate = (value) => Math.round(value) > 0;
-
-  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';
-      }
-  }
+  const roundRate = (value) => Math.round(value * 1000) / 1000;
 
   var Currency;
   (function (Currency) {
@@ -1170,7 +1169,7 @@
   });
   const formatCurrency = (value) => (value ? currencyNumberFormat.format(value) : '');
 
-  const TABLE_HEAD_STYLE = 'font-light text-left font-normal text-sm text-secondary-text';
+  const TABLE_HEAD_STYLE = 'text-left text-m text-secondary-text';
   const CURRENCY_ICONS_MAP = {
       USD: 'DollarIcon',
       EUR: 'EuroIcon',
@@ -1180,10 +1179,10 @@
   });
   const renderCurrencyRow = (exchangeCurrencyItem) => {
       const code = exchangeCurrencyItem?.code;
-      return (jsxs("tr", { className: "pb-1", children: [jsx("td", { className: "pt-4", children: jsxs("div", { className: "flex items-center", children: [code ? jsx(Img, { image: { icon: CURRENCY_ICONS_MAP[code] }, width: "24", height: "24" }) : null, jsx("span", { className: "text-m-title-md ml-2", children: code })] }) }), jsx("td", { className: "pt-4 pl-11 m-title-md font-light", children: formatCurrency(exchangeCurrencyItem.buy) }), jsx("td", { className: "pt-4 pl-11 m-title-md font-light", children: formatCurrency(exchangeCurrencyItem.sell) })] }, code));
+      return (jsxs("tr", { className: "pb-1 text-h6", children: [jsx("td", { className: "pt-4", children: jsxs("div", { className: "flex items-center", children: [code ? jsx(Img, { image: { icon: CURRENCY_ICONS_MAP[code] }, width: "24", height: "24" }) : null, jsx("span", { className: "ml-2", children: code })] }) }), jsx("td", { className: "pt-4 pl-11", children: formatCurrency(exchangeCurrencyItem?.sell) }), jsx("td", { className: "pt-4 pl-11", children: formatCurrency(exchangeCurrencyItem?.buy) })] }, code));
   };
 
-  const CurrentLocation = JSX(({ className = '', address, distance }) => (jsxs("div", { className: `flex text-sm ${className}`, children: [jsx(Img, { image: { icon: 'GpsIcon' }, width: "24", height: "24", asSVG: true }), jsxs("div", { className: "ml-3 font-light", children: [address ? jsx("p", { className: "m-0 mb-[3px]", children: address }) : null, distance ? (jsxs("p", { className: "text-secondary-text m-0", children: ["\u041A\u0443\u0440\u0441 \u0443\u043A\u0430\u0437\u0430\u043D \u0434\u043B\u044F \u0431\u043B\u0438\u0436\u0430\u0439\u0448\u0435\u0433\u043E \u043E\u0444\u0438\u0441\u0430 - ", distance] })) : null] })] })));
+  const CurrentLocation = JSX(({ className = '', address, distance }) => (jsxs("div", { className: `flex ${className}`, children: [jsx(Img, { image: { icon: 'GpsIcon' }, width: "24", height: "24", asSVG: true }), jsxs("div", { className: "ml-3", children: [address ? jsx("p", { className: "text-primary-main  m-0 mb-1 text-l", children: address }) : null, distance ? (jsxs("p", { className: "text-secondary-text m-0 text-m", children: ["\u041A\u0443\u0440\u0441 \u0443\u043A\u0430\u0437\u0430\u043D \u0434\u043B\u044F \u0431\u043B\u0438\u0436\u0430\u0439\u0448\u0435\u0433\u043E \u043E\u0444\u0438\u0441\u0430 - ", distance] })) : null] })] })));
 
   const roundTo = (value, precision = 2) => {
       const factor = Math.pow(10, precision);
@@ -1213,8 +1212,8 @@
       [() => true, () => props.handleConvert(props.value)],
   ])(props)?.();
 
-  function renderButton() {
-      return (jsx(Button, { className: "box-border mt-3.5 py-3 h-12 w-full", version: "primary", href: "https://coins.rshb.ru/exchange", target: "_blank", children: "\u041A\u0443\u043F\u0438\u0442\u044C \u0432\u0430\u043B\u044E\u0442\u0443" }));
+  function renderButton(button) {
+      return (jsx(Button, { className: "py-4 mr-1", version: button?.version, href: button?.href, target: "_blank", children: button?.text }));
   }
 
   const Input = JSX(({ className = '', id, name, type = 'text', placeholder, pattern, value, onChange }) => {
@@ -1235,10 +1234,10 @@
 
   function renderInput(props) {
       const { placeholder, rates, selected, value, setValue, setSelected } = props;
-      return (jsxs("div", { className: "relative flex items-center", children: [jsx(Input, { className: "h-10 border pl-4 pt-[7px] pb-[7px] rounded-md text-m-sm w-full appearance-none -mr-12", placeholder: placeholder, type: "text", value: value, onChange: setValue }), rates.length ? (jsx(Select, { className: "h-9 -translate-x-4", value: selected, onChange: (_) => setSelected(_), children: rates.map((_, i) => (jsx(SelectOption, { value: _.code, children: _.code }, String(i)))) })) : null] }));
+      return (jsxs("div", { className: "relative flex items-center", children: [jsx(Input, { className: "h-13 border pl-4 pt-4 pb-4 rounded-md text-l w-full appearance-none -mr-12", placeholder: placeholder, type: "text", value: value, onChange: setValue }), rates.length ? (jsx(Select, { className: "h-9 -translate-x-4 bg-transparent", value: selected, onChange: (_) => setSelected(_), children: rates.map((_, i) => (jsx(SelectOption, { value: _.code, children: _.code }, String(i)))) })) : null] }));
   }
 
-  const ExchangeCurrencyCalculator = JSX(({ context, className = '', currencyRatesBuy, currencyRatesSell }) => {
+  const ExchangeCurrencyCalculator = JSX(({ context, className = '', currencyRatesBuy, currencyRatesSell, button }) => {
       const [calcState, setCalcState] = context.useState({
           inputSell: '',
           inputBuy: '',
@@ -1248,7 +1247,7 @@
       const handleSetCalcState = (newState) => {
           setCalcState((oldState) => ({ ...oldState, ...newState }));
       };
-      return (jsxs("div", { className: `grid gap-3.5 ${className}`, children: [renderInput({
+      return (jsxs("div", { className: `grid gap-[18px] pt-2 ${className}`, children: [renderInput({
                   placeholder: 'Хочу продать',
                   rates: currencyRatesBuy,
                   selected: calcState.selectSell,
@@ -1262,7 +1261,7 @@
                   setSelected: handleSelectBuy(calcState, handleSetCalcState, currencyRatesBuy),
                   value: calcState.inputBuy,
                   setValue: (value) => handleInputBuy(handleSetCalcState, currencyRatesBuy)(value, calcState.selectBuy, calcState.selectSell),
-              }), renderButton()] }));
+              }), button?.text ? renderButton(button) : null] }));
   });
   const handleSelectSell = (calcState, setCalcState, currencyRatesSell) => (value) => {
       setCalcState({ selectSell: value });
@@ -1307,26 +1306,15 @@
       address: 'Москва, ул.Ленина д.28',
       distance: '6км',
   };
-  const ExchangeRateTile = JSX(({ className = '', context, title = 'Курсы обмена валют', ...rest }) => {
+  const ExchangeRateTile = JSX(({ className = '', context, title = 'Курсы обмена валют', button, ...rest }) => {
       const currencyRates = useExchangeRates(context.useAsyncData);
       const currencyRatesBuy = currencyRates.filter((_) => _.buy);
       currencyRatesBuy.unshift({ code: Currency.RUB });
       const currencyRatesSell = currencyRates.filter((_) => _.sell);
       currencyRatesSell.push({ code: Currency.RUB });
-      return (jsx(BlockWrapper, { context: context, className: `bg-white text-primary-text font-sans p-9 box-border ${className}`, ...rest, children: jsx(BaseTile, { context: context, title: jsx(Heading, { headingType: getTileHeadingType(className), title: title, className: "whitespace-pre-wrap" }), children: jsxs("div", { className: "flex", children: [jsxs("div", { className: "mr-[43px] pt-4", children: [currencyRates ? (jsx(CurrencyTable, { className: "mb-[31px]", exchangeCurrencyItems: currencyRates })) : null, jsx(CurrentLocation, { ...DEFAULT_LOCATION })] }), currencyRates.length && currencyRatesBuy.length && currencyRatesSell.length ? (jsx(ExchangeCurrencyCalculator, { className: "grow", context: context, currencyRatesBuy: currencyRatesBuy, currencyRatesSell: currencyRatesSell })) : null] }) }) }));
+      return (jsx(BlockWrapper, { context: context, className: `bg-white text-primary-text font-sans p-9 box-border ${className}`, ...rest, children: jsx(BaseTile, { context: context, title: jsx(Heading, { headingType: "h4", title: title, className: "whitespace-pre-wrap text-h4" }), children: jsxs("div", { className: "flex", children: [jsxs("div", { className: "mr-14 pt-4", children: [currencyRates ? (jsx(CurrencyTable, { className: "mb-[30px]", exchangeCurrencyItems: currencyRates })) : null, jsx(CurrentLocation, { ...DEFAULT_LOCATION })] }), currencyRates.length && currencyRatesBuy.length && currencyRatesSell.length ? (jsx(ExchangeCurrencyCalculator, { className: "grow", context: context, currencyRatesBuy: currencyRatesBuy, currencyRatesSell: currencyRatesSell, button: button })) : null] }) }) }));
   });
 
-  const SVG = JSX(({ className, viewBox, fill = 'none', width, height, paths, ...commonOptions }) => {
-      return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: className, viewBox: viewBox, fill: fill, width: width, height: height, children: paths.map(({ d, fill: pathFill, ...options }, i) => (jsx("path", { d: d, fill: pathFill || 'currentColor', ...commonOptions, ...options }, i))) }));
-  });
-
-  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',
-      'M33.93 35.53c.3-.41.6-.85.87-1.3v-2.66h-.87v3.96Zm2.54-4.92c.12-.4.24-.78.34-1.16h-2.88v.7h.43c.77-.02 1.63-.03 2.11.46Zm-19.19-1.27h-.78v7.91h.78v-7.9Z',
-      'M14.7 27.83h2.58c.67 0 1.14.14 1.4.4.27.25.4.72.4 1.38v7.4c0 .66-.12 1.12-.4 1.38-.4.41-1.16.41-1.78.41l-.4-.01v3.5l.78.14v-2.88c1.2 0 1.97-.4 2.34-1.22v4.29h.26l.5-.01V29.74c0-.68.13-1.16.4-1.43.25-.27.72-.4 1.37-.4.67 0 1.65-.1 2.16.4.26.27.38.76.38 1.43v3.8h-1.77v-4.06h-.77v12.99c.26-.03.5-.07.77-.12V34.3h1.77v7.64c.36-.1.72-.21 1.08-.34v-7c0-.8.19-1.4 1-1.67l-.9-4.87h1.8l.3 5.31h.22l.3-5.31h1.88l-1.01 4.87c.84.3 1.01.81 1.01 1.66v4.53a16.63 16.63 0 0 0 1.5-1.27v-9.83h5.25l.1-.72H24.93l.17.89c-.38-.72-1.12-1.08-2.2-1.08h-.77c-1.3 0-2.1.52-2.4 1.55-.27-1.08-1.1-1.62-2.46-1.62h-3.36v14.52c.26.09.52.18.78.25V27.84Zm16.29 5.58-.85-.8.85-4.37v5.17Z',
-      'M27.66 40.79c.27-.14.55-.28.8-.43v-5.98h-.8v6.4Z',
-  ];
   const SVG_COLOR = {
       'bg-white': 'text-primary-main',
       transparent: 'text-white',
@@ -1336,7 +1324,7 @@
       transparent: 'text-white',
   };
   const Logo = JSX(({ className = '', href, children, targetBlank, bgColor = 'bg-white', hideTitle }) => {
-      return (jsxs("a", { className: `inline-flex items-center font-sans no-underline ${className}`, href: href || 'https://rshb.ru/', target: targetBlank ? '_blank' : '_self', "aria-label": "\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A", children: [jsx(SVG, { className: `${SVG_COLOR[bgColor]} w-10 h-[38px]`, viewBox: "0 0 40 45", paths: LOGO_PATHS.map((d) => ({ d })) }), hideTitle ? null : (jsx("span", { className: `${TEXT_COLOR[bgColor]} text-sm font-medium ml-2.5`, children: children || 'Россельхозбанк' }))] }));
+      return (jsxs("a", { className: `inline-flex items-center font-sans no-underline ${className}`, href: href || 'https://rshb.ru/', target: targetBlank ? '_blank' : '_self', "aria-label": "\u0420\u043E\u0441\u0441\u0435\u043B\u044C\u0445\u043E\u0437\u0431\u0430\u043D\u043A", children: [jsx(Img, { image: { icon: 'Logo' }, className: `${SVG_COLOR[bgColor]} w-10 h-[38px]`, asSVG: true }), hideTitle ? null : (jsx("span", { className: `${TEXT_COLOR[bgColor]} text-sm font-medium ml-2.5`, children: children || 'Россельхозбанк' }))] }));
   });
 
   const MobileAppTile = JSX(({ className = '', title = 'Мобильное приложение', description, href = '#' }) => {
@@ -1368,12 +1356,13 @@
   };
   const formatTel = (s) => s.replaceAll(/\D/g, '');
 
+  const HorizontalNavigationLink = JSX(({ className = '', index, text, href, target, onClick }) => (jsx("a", { className: `font-sans text-secondary-text hover:text-primary-main inline-block no-underline ${className}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` })));
+
   const HorizontalNavigation = JSX(({ title, links, className = '', context }) => {
       const router = context.useRouter();
       const { handlerDecorator } = context;
-      return (jsxs("div", { className: className, children: [jsx("span", { className: "text-primary-text font-sans font-medium text-sm", children: title }), links?.length ? (jsx("div", { className: "flex flex-col gap-2 pt-3", children: links.map((_, i) => (jsx(HorizontalNavigationLink, { index: i, ...useLink({ router, handlerDecorator }, _) }, String(i)))) })) : null] }));
+      return (jsxs("div", { className: className, children: [jsx("span", { className: "text-primary-text font-sans font-medium text-sm", children: title }), links?.length ? (jsx("div", { className: "flex flex-col gap-2 pt-3", children: links.map((_, i) => (jsx(HorizontalNavigationLink, { index: i, className: "font-normal text-sm", ...useLink({ router, handlerDecorator }, _) }, String(i)))) })) : null] }));
   });
-  const HorizontalNavigationLink = JSX(({ className = '', index, text, href, target, onClick }) => (jsx("a", { className: `font-sans font-normal text-sm text-secondary-text hover:text-primary-main inline-block no-underline ${className}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` })));
 
   const ICONS_MAP = [
       {
@@ -1411,7 +1400,8 @@
           ? 'bg-secondary-light hover:bg-secondary-hover'
           : 'border-main-divider border-solid border-[1px] hover:bg-primary-main';
       const isPrimary = version === 'primary';
-      return (jsx("a", { className: `flex items-center justify-center rounded-md w-14 h-14 group box-border ${classes} ${isPrimary ? 'hover:text-black' : ''}`, href: href, "aria-label": label, target: "_blank", rel: "noopener noreferrer", children: icon ? (jsx(Img, { image: icon, imageClassName: isPrimary ? 'group-hover:text-white' : '', width: "24", height: "24", asSVG: true })) : null }));
+      const imageClassName = isPrimary ? 'group-hover:text-white' : '';
+      return (jsx("a", { className: `flex items-center justify-center rounded-md w-14 h-14 group box-border ${classes} ${isPrimary ? 'hover:text-black' : ''}`, href: href, "aria-label": label, target: "_blank", rel: "noopener noreferrer", children: icon ? (jsx(Img, { image: icon, imageClassName: imageClassName, width: "24", height: "24", asSVG: true })) : null }));
   });
 
   const SocialMedia = JSX(({ className, media, version, context }) => {
@@ -1420,12 +1410,13 @@
       return (jsx("div", { className: `flex gap-2 items-start justify-start pt-6 pb-6 ${className || ''}`, children: media?.map((_, index) => (jsx(MediaButton, { version: version, ...useLink({ router, handlerDecorator }, _) }, String(index)))) }));
   });
 
+  const TextInformationLink = JSX(({ className = '', index, text, href, target, onClick }) => (jsx("a", { className: `font-sans text-xs text-secondary-text visited:text-secondary-text hover:text-primary-text inline-block no-underline max-w-[292px] ${className}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` })));
+
   const TextInformation = JSX(({ className, links, context }) => {
       const router = context.useRouter();
       const { handlerDecorator } = context;
-      return (jsxs("div", { className: `${className || ''}`, children: [jsx("div", { className: "py-6", children: jsx("span", { className: "font-sans font-normal text-xs text-secondary-text", children: `\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.` }) }), links?.length ? (jsx("div", { className: `flex flex-col justify-start items-start gap-2`, children: links.map((_, i) => (jsx(TextInformationLink, { index: i, ...useLink({ router, handlerDecorator }, _) }, String(i)))) })) : null] }));
+      return (jsxs("div", { className: `${className || ''}`, children: [jsx("div", { className: "py-6", children: jsx("span", { className: "font-sans font-normal text-xs text-secondary-text", children: `\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.` }) }), links?.length ? (jsx("div", { className: `flex flex-col justify-start items-start gap-2`, children: links.map((_, i) => (jsx(TextInformationLink, { index: i, className: "font-normal", ...useLink({ router, handlerDecorator }, _) }, String(i)))) })) : null] }));
   });
-  const TextInformationLink = JSX(({ className, index, text, href, target, onClick }) => (jsx("a", { className: `font-sans font-normal text-xs text-secondary-text visited:text-secondary-text hover:text-primary-text inline-block no-underline max-w-[292px] ${className || ''}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` })));
 
   function useSitemap(useAsyncData) {
       const { data } = useAsyncData(sitemapURL(), fetchSitemap);
@@ -1439,12 +1430,26 @@
       return `/wcms-resources/${projectSettings.SITEMAP || 'sitemap'}.json`;
   }
 
-  const SearchBar = JSX(({ className, context }) => {
+  const SearchBarInner = JSX(({ className, context, isMobile = false }) => {
       const { term, setTerm } = context.useSearch();
-      return (jsxs("form", { className: `relative ${className || ''}`, children: [jsxs("div", { className: "absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none", children: [jsx("div", { className: "w-[20px] h-[20px]", children: jsx(Img, { image: "LoupeIcon", width: "24", height: "24" }) }), term ? null : (jsx("label", { htmlFor: "search-bar-input", className: "font-sans font-normal text-sm text-secondary-text", children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443" }))] }), jsx("input", { id: "search-bar-input", className: 'h-12 pl-12 w-full peer placeholder-transparent font-sans font-normal text-base text-black border border-solid rounded box-border outline-none pr-[6%] border-main-divider focus:border-primary-text', value: term, onChange: (e) => setTerm(e.target.value), type: "text", name: "search-bar-input", placeholder: "some search" }), jsx("button", { className: "visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none", onClick: (e) => {
+      const LoupeIconClassName = isMobile ? 'w-[20px] h-[20px]' : 'w-[24px] h-[24px]';
+      const SearchBarLabelClassName = isMobile ? 'font-normal text-sm' : 'font-light text-base';
+      const SearchBarInputClassName = isMobile
+          ? ' placeholder-transparent font-normal'
+          : 'font-light h-full';
+      const inputPlaceholder = isMobile ? 'some search' : null;
+      return (jsxs("form", { className: `font-sans relative ${className}`, children: [jsxs("div", { className: "absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none", children: [jsx("div", { className: LoupeIconClassName, children: jsx(Img, { image: "LoupeIcon", width: "24", height: "24" }) }), term ? null : (jsx("label", { htmlFor: "search-bar-input", className: `text-secondary-text ${SearchBarLabelClassName}`, children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443" }))] }), jsx("input", { id: "search-bar-input", className: `h-12 pl-12 w-full peer text-base text-black border border-solid rounded box-border
+              outline-none pr-[6%] border-main-divider focus:border-primary-text ${SearchBarInputClassName}`, value: term, onChange: (e) => setTerm(e.target.value), type: "text", name: "search-bar-input", placeholder: inputPlaceholder }), isMobile ? (jsx("button", { className: "visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none", onClick: (e) => {
                       e.preventDefault();
                       setTerm('');
-                  }, children: jsx(Img, { image: "CloseIcon", width: "24", height: "24" }) })] }));
+                  }, children: jsx(Img, { image: "CloseIcon", width: "24", height: "24" }) })) : (jsx(Button, { version: "primary", text: "\u041D\u0430\u0439\u0442\u0438", className: "invisible peer-focus:visible absolute top-1 right-1", onClick: (e) => {
+                      e.preventDefault();
+                      console.log('click');
+                  }, children: jsx("div", { className: "font-normal text-sm px-9 py-[9px]", children: "\u041D\u0430\u0439\u0442\u0438" }) }))] }));
+  });
+
+  const SearchBar = JSX(({ className = '', context }) => {
+      return jsx(SearchBarInner, { context: context, className: className, isMobile: true });
   });
 
   const getAccordionItems = (items) => items?.map((item) => ({
@@ -1477,10 +1482,9 @@
 
   const findActiveSubItem = (router) => (items = []) => {
       const possibleActiveSubItems = items?.filter(isSubItemActive(router));
-      const activeSubItem = possibleActiveSubItems?.length
+      return possibleActiveSubItems?.length
           ? maxBy((_) => _.href?.length || 0)(possibleActiveSubItems) // More specific item with max length
           : null;
-      return activeSubItem;
   };
 
   const checkIsHrefSameOrigin = (href, router) => getOrigin(href) === getOrigin(router.href);
@@ -1496,17 +1500,17 @@
 
   const TEXT_CLASSES = 'font-sans font-normal text-sm';
   const BORDER_CLASSES = 'absolute left-0 -bottom-3 w-full h-[2px]';
-  const HeaderItem = JSX(({ className, text, href, target, active, onClick, children, bgColor = 'bg-white' }) => {
-      return (jsxs("a", { className: `relative inline-block bg-transparent text-center no-underline ${className || ''}`, href: href, target: target, onClick: onClick, children: [jsx("span", { className: getTextClasses(bgColor, active), children: text || children }), active ? jsx("div", { className: getBorderClasses(bgColor, active) }) : null] }));
+  const HeaderItem = JSX(({ className = '', text, href, target, active, onClick, children, bgColor = 'bg-white' }) => {
+      return (jsxs("a", { className: `relative inline-block bg-transparent text-center no-underline ${className}`, href: href, target: target, onClick: onClick, children: [jsx("span", { className: getTextClasses(bgColor, active), children: text || children }), active ? jsx("div", { className: getBorderClasses(bgColor, active) }) : null] }));
   });
-  const getTextClasses = (bgColor, active) => {
+  const getTextClasses = (bgColor, active = false) => {
       let classes = 'text-white';
       if (bgColor === 'bg-white') {
           classes = active ? 'text-primary-main' : 'text-secondary-text hover:text-primary-main';
       }
       return `${classes} ${TEXT_CLASSES}`;
   };
-  const getBorderClasses = (bgColor, active) => {
+  const getBorderClasses = (bgColor, active = false) => {
       if (!active) {
           return BORDER_CLASSES;
       }
@@ -1543,6 +1547,25 @@
   });
   const renderSubItem = (item, i) => (jsx(HeaderItem, { className: "mr-8 whitespace-nowrap text-sm", ...item }, String(i)));
 
+  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) {
@@ -1585,7 +1608,7 @@
   };
   const ProductGalleryBlock = JSX(({ block, headingType, context, className = '' }) => {
       const version = block?.version ?? 'primary';
-      return (jsx("section", { className: `flex grow-0 shrink-0 basis-full px-4 pt-6 ${productGalleryStyleMap[version]} ${className}`, 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 ${productGalleryStyleMap[version]} ${className}`, role: "listitem", children: jsx("div", { className: "flex grow", children: jsx(ProductBlockInner, { context: context, headingType: headingType || 'h2', ...block }) }) }));
   });
 
   const ProductGallery = JSX(({ className, context, slides = [] }) => {
@@ -1630,7 +1653,7 @@
       const isLastStep = steps.length - 1 === i;
       const margin = size === 'normal' ? 'ml-[34px]' : 'ml-6';
       const styleMap = getStyleMap(version);
-      return (jsx("div", { children: jsxs("div", { className: "flex flex-row text-center relative", children: [jsxs("div", { className: "overflow-hidden", children: [renderIconArea(size, version), isLastStep ? null : (jsx("div", { className: `min-h-8 h-full w-[2px] ${showLines ? styleMap.iconConnector : ''} ${margin}` }))] }), jsxs("div", { className: `flex flex-col justify-center h-fit ${STEPS_TILE_DESCRIPTION_HEIGHT_MAP[size]}`, children: [step.label ? (jsx("div", { className: "font-medium text-m-title-xs m-0 text-left", children: step.label })) : null, step.description ? (jsx("div", { className: `font-normal text-sm ${styleMap.description} text-left ${step.label ? 'mt-1' : ''}`, children: step.description })) : null] })] }) }, String(i)));
+      return (jsx("div", { children: jsxs("div", { className: "flex flex-row text-center relative", children: [jsxs("div", { className: "overflow-hidden", children: [renderIconArea(size, version), isLastStep ? null : (jsx("div", { className: `min-h-8 h-full w-[2px] ${showLines ? styleMap.iconConnector : ''} ${margin}` }))] }), jsxs("div", { className: `flex flex-col justify-center h-fit ${STEPS_TILE_DESCRIPTION_HEIGHT_MAP[size]}`, children: [step.label ? (jsx("div", { className: "font-medium text-m-title-xs m-0 text-left mb-1", children: step.label })) : null, step.description ? (jsx("div", { className: `font-normal text-sm ${styleMap.description} text-left`, children: step.description })) : null] })] }) }, String(i)));
   };
   const renderIconArea = (size, version) => (step, i) => {
       const styleMap = getStyleMap(version);
@@ -1653,14 +1676,15 @@
   const renderList = (list) => (jsx(List, { className: "flex flex-col justify-between items-start text-m-sm", version: "gray", items: list.items, isDotted: list.isDotted ?? true }));
   const renderButtons = (buttons) => (jsx("div", { children: buttons.map(({ icon, rounded, ...buttonProps }, idx) => (jsx(Button, { className: `mt-3 ${idx > 0 && rounded ? 'ml-2.5' : ''} ${icon ? 'w-12 h-12' : ''}`, ariaLabel: getButtonAriaLabel(icon), rounded: rounded, appendLeft: icon ? jsx(Img, { image: icon, width: "24px", height: "24px", asSVG: true }) : null, ...buttonProps, "aria-label": icon }, String(idx)))) }));
 
-  const TariffsTableVertical = JSX(({ tiles }) => (jsx("div", { className: "flex flex-col gap-3.5", children: tiles.map((tile, i) => (jsx(TariffsTableTileCell, { ...tile }, String(i)))) })));
-
   const TariffsTableHorizontal = JSX(({ tiles, context }) => (jsx(SwipeListControl, { context: context, children: tiles.map((tile, i) => (jsx(TariffsTableTileCell, { ...tile }, String(i)))) })));
 
+  const TariffsTableVertical = JSX(({ tiles }) => (jsx("div", { className: "flex flex-col gap-3.5", children: tiles.map((tile, i) => (jsx(TariffsTableTileCell, { ...tile }, String(i)))) })));
+
   const TariffsTable = JSX(({ className, context, title, description, columns, rowHeaders, orientation = 'vertical' }) => {
       const colData = getColData(columns);
       const tiles = getTiles(rowHeaders, colData);
-      return (jsxs("section", { className: `px-4 py-6 bg-white font-sans text-primary-text overflow-x-hidden ${className}`, children: [title ? (jsx(Heading, { headingType: "h2", className: `text-center ${description ? 'mb-2' : 'mb-5'}`, title: title })) : null, description ? jsx("div", { className: "mb-5 text-center text-m-md", children: description }) : null, tiles?.length ? renderOrientationTable(orientation, tiles, context) : null] }));
+      const headingMargin = description ? 'mb-2' : 'mb-5';
+      return (jsxs("section", { className: `px-4 py-6 bg-white font-sans text-primary-text overflow-x-hidden ${className}`, children: [title ? (jsx(Heading, { headingType: "h2", className: `text-center ${headingMargin}`, title: title })) : null, description ? jsx("div", { className: "mb-5 text-center text-m-md", children: description }) : null, tiles?.length ? renderOrientationTable(orientation, tiles, context) : null] }));
   });
   function renderOrientationTable(orientation, tiles, context) {
       return orientation === 'vertical' ? (jsx(TariffsTableVertical, { tiles: tiles })) : (jsx(TariffsTableHorizontal, { context: context, tiles: tiles }));