@redneckz/wildless-cms-uni-blocks 0.3.20 → 0.3.23

package/src/components/Accordion/Accordion.fixture.tsx

@@ -4,77 +4,60 @@ import { HEADLINE } from '../Headline/Headline.fixture';
 import { linkDocsContentExample } from '../LinkDocs/linkDocsContentExample';
 import { defaultProps as MINI_GALLERY } from '../MiniGallery/MiniGallery.fixture';
 import { PICTURE_TEXT } from '../PictureText/PictureText.fixture';
-import { PRODUCT_BLOCK } from '../ProductBlock/ProductBlock.fixture';
-import { PRODUCT_TILE, PRODUCT_PENSION_TILE } from '../ProductTile/ProductTile.fixture';
+import { PRODUCT_TILE } from '../ProductTile/ProductTile.fixture';
 import { TEXT_BLOCK } from '../TextBlock/TextBlock.fixture';
-import { TILE, TILE_PREMIUM } from '../Tile/Tile.fixture';
+import { TILE } from '../Tile/Tile.fixture';
 import type { AccordionProps } from './Accordion';
 import { Accordion } from './Accordion';
 import type {
-  GalleryAccordionBlockDef,
-  HeadlineAccordionBlockDef,
-  LinkDocsAccordionBlockDef,
-  MiniGalleryAccordionBlockDef,
-  PictureTextAccordionBlockDef,
-  ProductBlockAccordionBlockDef,
-  ProductTileAccordionBlockDef,
-  TextBlockAccordionBlockDef,
-  TileAccordionBlockDef,
-} from './AccordionContent';
-
-const TEXT_BLOCK_ACCORDION_BLOCK: TextBlockAccordionBlockDef = {
-  accordionBlockType: 'TextBlock',
+  GalleryBlockListDef,
+  HeadlineBlockListDef,
+  LinkDocsBlockListDef,
+  MiniGalleryBlockListDef,
+  PictureTextBlockListDef,
+  ProductTileBlockListDef,
+  TextBlockBlockListDef,
+  TileBlockListDef,
+} from '../../ui-kit/BlocksList/BlocksListProps';
+
+const TEXT_BLOCK_ACCORDION_BLOCK: TextBlockBlockListDef = {
+  blockListType: 'TextBlock',
   ...TEXT_BLOCK,
 };
 
-const HEADLINE_ACCORDION_BLOCK: HeadlineAccordionBlockDef = {
-  accordionBlockType: 'Headline',
+const HEADLINE_ACCORDION_BLOCK: HeadlineBlockListDef = {
+  blockListType: 'Headline',
   ...HEADLINE,
 };
 
-const PICTURE_TEXT_ACCORDION_BLOCK: PictureTextAccordionBlockDef = {
-  accordionBlockType: 'PictureText',
+const PICTURE_TEXT_ACCORDION_BLOCK: PictureTextBlockListDef = {
+  blockListType: 'PictureText',
   ...PICTURE_TEXT,
 };
 
-const PRODUCT_BLOCK_ACCORDION_BLOCK: ProductBlockAccordionBlockDef = {
-  accordionBlockType: 'ProductBlock',
-  ...PRODUCT_BLOCK,
-};
-
-const LINK_DOCS_ACCORDION_BLOCK: LinkDocsAccordionBlockDef = {
-  accordionBlockType: 'LinkDocs',
+const LINK_DOCS_ACCORDION_BLOCK: LinkDocsBlockListDef = {
+  blockListType: 'LinkDocs',
   ...linkDocsContentExample,
   title: '',
 };
 
-const TILES_ACCORDION_BLOCK: TileAccordionBlockDef = {
-  accordionBlockType: 'Tile',
+const TILES_ACCORDION_BLOCK: TileBlockListDef = {
+  blockListType: 'Tile',
   ...TILE,
 };
 
-const TILES_PREMIUM_ACCORDION_BLOCK: TileAccordionBlockDef = {
-  accordionBlockType: 'Tile',
-  ...TILE_PREMIUM,
-};
-
-const PRODUCT_TILES_ACCORDION_BLOCK: ProductTileAccordionBlockDef = {
-  accordionBlockType: 'ProductTile',
+const PRODUCT_TILES_ACCORDION_BLOCK: ProductTileBlockListDef = {
+  blockListType: 'ProductTile',
   ...PRODUCT_TILE,
 };
 
-const PRODUCT_PENSION_TILES__ACCORDION_BLOCK: ProductTileAccordionBlockDef = {
-  accordionBlockType: 'ProductTile',
-  ...PRODUCT_PENSION_TILE,
-};
-
-const GALLERY_ACCORDION_BLOCK: GalleryAccordionBlockDef = {
-  accordionBlockType: 'Gallery',
+const GALLERY_ACCORDION_BLOCK: GalleryBlockListDef = {
+  blockListType: 'Gallery',
   ...GALLERY,
 };
 
-const MINI_GALLERY_ACCORDION_BLOCK: MiniGalleryAccordionBlockDef = {
-  accordionBlockType: 'MiniGallery',
+const MINI_GALLERY_ACCORDION_BLOCK: MiniGalleryBlockListDef = {
+  blockListType: 'MiniGallery',
   ...MINI_GALLERY,
 };
 
@@ -116,58 +99,10 @@ const propsBlock: AccordionProps = {
   ],
 };
 
-const propsTwoColumns: AccordionProps = {
-  context,
-  accordionItems: [
-    {
-      label: 'Другие продукты Россельхозбанка 1',
-      blocks: [
-        TILES_PREMIUM_ACCORDION_BLOCK,
-        TILES_PREMIUM_ACCORDION_BLOCK,
-        TILES_ACCORDION_BLOCK,
-        TILES_ACCORDION_BLOCK,
-      ],
-      columns: 2,
-    },
-    {
-      label: 'Другие продукты Россельхозбанка 2',
-      blocks: [
-        PRODUCT_TILES_ACCORDION_BLOCK,
-        PRODUCT_TILES_ACCORDION_BLOCK,
-        PRODUCT_PENSION_TILES__ACCORDION_BLOCK,
-        PRODUCT_PENSION_TILES__ACCORDION_BLOCK,
-      ],
-      columns: 2,
-    },
-    {
-      label: 'Другие продукты Россельхозбанка 3',
-      blocks: [PRODUCT_BLOCK_ACCORDION_BLOCK, PRODUCT_BLOCK_ACCORDION_BLOCK],
-      columns: 2,
-    },
-
-    {
-      label: 'Другие продукты Россельхозбанка 4',
-      blocks: [
-        TEXT_BLOCK_ACCORDION_BLOCK,
-        TEXT_BLOCK_ACCORDION_BLOCK,
-        TEXT_BLOCK_ACCORDION_BLOCK,
-        TEXT_BLOCK_ACCORDION_BLOCK,
-      ],
-      columns: 2,
-    },
-  ],
-};
-
 export default {
   default: (
     <div className="container grid grid-cols-12">
       <Accordion className="col-span-12" {...propsBlock} />
     </div>
   ),
-
-  'two columns': (
-    <div className="container grid grid-cols-12">
-      <Accordion className="col-span-12" {...propsTwoColumns} />
-    </div>
-  ),
 };

package/src/components/Accordion/Accordion.tsx

@@ -1,4 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { BlockVersion } from '../../model/BlockVersion';
 import type { UniBlockProps } from '../../types';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import type { AccordionContent } from './AccordionContent';
@@ -6,17 +7,29 @@ import { AccordionItem } from './AccordionItem';
 
 export interface AccordionProps extends AccordionContent, UniBlockProps {}
 
-export const Accordion = JSX<AccordionProps>(({ title, accordionItems, context, className }) => {
-  return (
-    <section className={`p-[50px] font-sans bg-white text-primary-text ${className || ''}`}>
-      {title ? <Heading headingType="h4" className="mb-2.5" title={title} /> : null}
-      {accordionItems?.length ? (
-        <ul className="list-none m-0 p-0">
-          {accordionItems.map((item, i) => (
-            <AccordionItem key={`AccordionItem${i}`} {...item} context={context} />
-          ))}
-        </ul>
-      ) : null}
-    </section>
-  );
-});
+const accordionStyleMap: Record<BlockVersion, string> = {
+  primary: 'bg-white text-primary-text',
+  secondary: 'bg-primary-main text-white',
+};
+
+export const Accordion = JSX<AccordionProps>(
+  ({ title, accordionItems, context, className = '', version = 'primary' }) => {
+    return (
+      <section className={`p-[50px] font-sans ${className} ${accordionStyleMap[version]}`}>
+        {title ? <Heading headingType="h4" className="mb-2.5" title={title} /> : null}
+        {accordionItems?.length ? (
+          <ul className="list-none m-0 p-0">
+            {accordionItems.map((item, i) => (
+              <AccordionItem
+                key={`AccordionItem${i}`}
+                {...item}
+                version={version}
+                context={context}
+              />
+            ))}
+          </ul>
+        ) : null}
+      </section>
+    );
+  },
+);

package/src/components/Accordion/AccordionContent.ts

@@ -1,110 +1,5 @@
-import type { GalleryContent } from '../Gallery/GalleryContent';
-import type { HeadlineContent } from '../Headline/HeadlineContent';
-import type { LinkDocsContent } from '../LinkDocs/LinkDocsContent';
-import type { MiniGalleryContent } from '../MiniGallery/MiniGalleryContent';
-import type { PictureTextContent } from '../PictureText/PictureTextContent';
-import type { ProductBlockContent } from '../ProductBlock/ProductBlockContent';
-import type { ProductTileContent } from '../ProductTile/ProductTileContent';
-import type { TextBlockContent } from '../TextBlock/TextBlockContent';
-import type { TileContent } from '../Tile/TileContent';
-import type { LinkListContent } from '../LinkList/LinkListContent';
-
-/**
- * @title Тип блока
- */
-export type AccordionBlockType =
-  | 'Headline'
-  | 'LinkDocs'
-  | 'TextBlock'
-  | 'PictureText'
-  | 'Tile'
-  | 'ProductTile'
-  | 'ProductBlock'
-  | 'Gallery'
-  | 'MiniGallery'
-  | 'LinkList';
-
-interface AccordionBlockDef {
-  accordionBlockType: AccordionBlockType;
-}
-
-/**
- * @title Заголовок
- */
-export type HeadlineAccordionBlockDef = HeadlineContent & AccordionBlockDef;
-
-/**
- * @title Список документов
- */
-export type LinkDocsAccordionBlockDef = LinkDocsContent & AccordionBlockDef;
-
-/**
- * @title Текстовый блок
- */
-export type TextBlockAccordionBlockDef = TextBlockContent & AccordionBlockDef;
-
-/**
- * @title Картинка с текстом
- */
-export type PictureTextAccordionBlockDef = PictureTextContent & AccordionBlockDef;
-
-/**
- * @title Продуктовый блок
- */
-export type ProductBlockAccordionBlockDef = ProductBlockContent & AccordionBlockDef;
-
-/**
- * @title Плитка
- */
-export type TileAccordionBlockDef = TileContent & AccordionBlockDef;
-
-/**
- * @title Продуктовая плитка
- */
-export type ProductTileAccordionBlockDef = ProductTileContent & AccordionBlockDef;
-
-/**
- * @title Галлерея
- */
-export type GalleryAccordionBlockDef = GalleryContent & AccordionBlockDef;
-
-/**
- * @title Мини-галлерея
- */
-export type MiniGalleryAccordionBlockDef = MiniGalleryContent & AccordionBlockDef;
-
-/**
- * @title Список ссылок
- */
-export type LinkListAccordionBlockDef = LinkListContent & AccordionBlockDef;
-
-/**
- * @title Выберите блок
- */
-export type EmptyOption = null;
-
-/**
- * @title Содержимое аккордеона
- */
-export type AccordionBlockProps =
-  | EmptyOption
-  | HeadlineAccordionBlockDef
-  | LinkDocsAccordionBlockDef
-  | TextBlockAccordionBlockDef
-  | PictureTextAccordionBlockDef
-  | ProductBlockAccordionBlockDef
-  | TileAccordionBlockDef
-  | ProductTileAccordionBlockDef
-  | GalleryAccordionBlockDef
-  | MiniGalleryAccordionBlockDef
-  | LinkListAccordionBlockDef;
-
-/**
- * @title Количество колонок
- * @enumNames ["1 колонка", "2 колонки"]
- */
-export type ColumnsCount = 1 | 2;
-
+import type { BlockDef, ColumnsCount } from '../../ui-kit/BlocksList/BlocksListProps';
+import type { BlockVersion } from '../../model/BlockVersion';
 /**
  * @title Элемент списка
  */
@@ -114,13 +9,18 @@ export interface AccordionItemCommonProps {
    * @default Список
    */
   label?: string;
+  /**
+   * @title Отображать в раскрытом виде
+   */
+  isExpanded?: boolean;
   /** @title Блоки */
-  blocks?: AccordionBlockProps[];
+  blocks?: BlockDef[];
   /**
    * @title Отображать/скрывать обводку элемента
    * @default false
    */
   bordered?: boolean; // TODO: только для мобильной версии
+  version?: BlockVersion;
 
   columns?: ColumnsCount;
 }
@@ -131,9 +31,10 @@ export interface AccordionItemCommonProps {
 export interface AccordionContent {
   /** @title Заголовок */
   title?: string;
+  version?: BlockVersion;
   /** @title Список */
   accordionItems?: AccordionItemCommonProps[];
-  /** @title Подзаголовок */
+  /** @title Описание */
   description?: string; // TODO: только для мобильной версии
   /**
    * @title Отображать/скрывать обводку у элемента списка

package/src/components/Accordion/AccordionItem.mobile.tsx

@@ -3,12 +3,12 @@ import type { UniBlockProps } from '../../types';
 import { Icon } from '../../ui-kit/Icon/Icon';
 import type { AccordionItemCommonProps } from './AccordionContent';
 import { AccordionItemInner } from './AccordionItemInner';
-import { isActiveHandler } from './utils/isActiveHandler';
+import { useActiveHandler } from './useActiveHandler';
 
 export interface AccordionItemProps extends AccordionItemCommonProps, UniBlockProps {}
 
 export const AccordionItem = JSX<AccordionItemProps>(({ label, blocks, bordered, context }) => {
-  const { hasContent, icon, handleToggle } = isActiveHandler({
+  const { hasContent, icon, handleToggle } = useActiveHandler({
     context,
     blocks,
   });

package/src/components/Accordion/AccordionItem.tsx

@@ -1,37 +1,59 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { BlockVersion } from '../../model/BlockVersion';
 import type { UniBlockProps } from '../../types';
 import { Icon } from '../../ui-kit/Icon/Icon';
 import type { AccordionItemCommonProps } from './AccordionContent';
 import { AccordionItemInner } from './AccordionItemInner';
-import { isActiveHandler } from './utils/isActiveHandler';
+import { useActiveHandler } from './useActiveHandler';
 
 export interface AccordionItemProps extends AccordionItemCommonProps, UniBlockProps {}
 
-export const AccordionItem = JSX<AccordionItemProps>(({ label, blocks, columns, context }) => {
-  const { hasContent, icon, handleToggle } = isActiveHandler({
-    context,
-    blocks,
-  });
+const buttonStyleMap: Record<BlockVersion, string> = {
+  primary: 'text-primary-text',
+  secondary: 'text-white',
+};
 
-  return (
-    <li className="border-0 border-b border-solid border-main-divider last:border-b-0">
-      <button
-        className={`border-none bg-transparent px-0 py-5 flex justify-between text-left w-full font-sans text-primary-text
+const buttonHoverStyleMap: Record<BlockVersion, string> = {
+  primary: 'group-hover:text-primary-main',
+  secondary: 'group-hover:text-white',
+};
+
+export const AccordionItem = JSX<AccordionItemProps>(
+  ({ label, isExpanded, blocks, columns, context, version = 'primary' }) => {
+    const { isActive, hasContent, icon, handleToggle } = useActiveHandler({
+      context,
+      blocks,
+      initialState: isExpanded,
+    });
+
+    return (
+      <li className="border-0 border-b border-solid border-main-divider last:border-b-0">
+        <button
+          className={`border-none bg-transparent px-0 py-5 flex justify-between text-left w-full font-sans ${
+            buttonStyleMap[version]
+          }
         ${hasContent ? 'group cursor-pointer' : ''}`}
-        onClick={handleToggle}
-      >
-        <span
-          className={`text-xl pr-2.5 font-medium ${
-            hasContent ? 'group-hover:text-primary-main' : ''
-          }`}
+          onClick={handleToggle}
         >
-          {label}
-        </span>
-        {hasContent ? <Icon name={icon} width="24" height="24" asSVG /> : null}
-      </button>
-      {hasContent ? (
-        <AccordionItemInner columns={columns} blocks={blocks} context={context} />
-      ) : null}
-    </li>
-  );
-});
+          <span
+            className={`text-xl pr-2.5 font-medium ${
+              hasContent ? buttonHoverStyleMap[version] : ''
+            }`}
+          >
+            {label}
+          </span>
+          {hasContent ? <Icon name={icon} width="24" height="24" asSVG /> : null}
+        </button>
+        {hasContent ? (
+          <AccordionItemInner
+            isExpanded={isActive}
+            columns={columns}
+            blocks={blocks}
+            version={version}
+            context={context}
+          />
+        ) : null}
+      </li>
+    );
+  },
+);

package/src/components/Accordion/AccordionItemInner.mobile.tsx

@@ -1,28 +1,15 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { JSXBlock } from '../ContentPage/ContentPage';
-import type { ContentPageContext } from '../ContentPage/ContentPageContext';
-import { AccordionBlocks } from './AccordionBlocks';
-import type { AccordionBlockProps } from './AccordionContent';
 import type { AccordionItemProps } from './AccordionItem';
+import { renderBlocksList } from '../../ui-kit/BlocksList/renderBlocksList';
 
-export const AccordionItemInner = JSX<AccordionItemProps>(({ blocks, context }) => {
-  return (
-    <div className="transition-all duration-300 max-h-0 overflow-hidden group-last:last:pb-0">
-      {blocks?.length ? blocks.map(renderBlock(context)) : null}
-    </div>
-  );
-});
-
-const renderBlock = (context: ContentPageContext) => (block: AccordionBlockProps, i: number) => {
-  const type = block?.accordionBlockType;
-  if (!type || !(type in AccordionBlocks)) {
-    return null;
-  }
-
-  const AccordionBlock: JSXBlock = AccordionBlocks[type];
-  return (
-    <div className="mb-5 last:mb-0 first:mt-2" key={`block_${i}`}>
-      <AccordionBlock context={context} {...block} className="!p-0" />
-    </div>
-  );
-};
+export const AccordionItemInner = JSX<AccordionItemProps>(
+  ({ blocks, context, version = 'primary' }) => {
+    const className = 'mb-5 last:mb-0 first:mt-2';
+    const columns = 1;
+    return (
+      <div className="transition-all duration-300 max-h-0 overflow-hidden group-last:last:pb-0">
+        {renderBlocksList({ context, className, columns, blocks, version })}
+      </div>
+    );
+  },
+);

package/src/components/Accordion/AccordionItemInner.tsx

@@ -1,33 +1,14 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { JSXBlock } from '../ContentPage/ContentPage';
-import type { ContentPageContext } from '../ContentPage/ContentPageContext';
-import { AccordionBlocks } from './AccordionBlocks';
-import type { AccordionBlockProps } from './AccordionContent';
 import type { AccordionItemProps } from './AccordionItem';
+import { renderBlocksList } from '../../ui-kit/BlocksList/renderBlocksList';
 
-export const AccordionItemInner = JSX<AccordionItemProps>(({ blocks, columns = 1, context }) => {
-  return (
-    <div
-      className={
-        'transition-all duration-300 max-h-0 overflow-hidden group-last:last:pb-0 flex flex-wrap'
-      }
-    >
-      {blocks?.length ? blocks.map(renderBlock(context, columns)) : null}
-    </div>
-  );
-});
-
-const renderBlock =
-  (context: ContentPageContext, columns: number) => (block: AccordionBlockProps, i: number) => {
-    const type = block?.accordionBlockType;
-    if (!type || !(type in AccordionBlocks)) {
-      return null;
-    }
-    const columnsCountClass = columns === 2 ? 'w-1/2' : '';
-    const AccordionBlock: JSXBlock = AccordionBlocks[type];
+export const AccordionItemInner = JSX<AccordionItemProps>(
+  ({ blocks, columns = 1, context, version = 'primary' }) => {
+    const className = 'mb-5 last:mb-0 pb-5';
     return (
-      <div className={`mb-5 last:mb-0 pb-5 ${columnsCountClass}`} key={`block_${i}`}>
-        <AccordionBlock context={context} {...block} className="!p-0" />
+      <div className="transition-all duration-300 max-h-0 overflow-hidden">
+        {renderBlocksList({ context, className, columns, blocks, version })}
       </div>
     );
-  };
+  },
+);

package/src/components/Accordion/{utils/isActiveHandler.ts → useActiveHandler.ts}

@@ -1,7 +1,8 @@
-import type { IconName } from '../../../icons/IconName';
+import type { IconName } from '../../icons/IconName';
+import { ActiveHandler } from '../../ui-kit/BlocksList/BlocksListProps';
 
-export const isActiveHandler = ({ context, blocks }) => {
-  const [isActive, setIsActive] = context.useState(false);
+export const useActiveHandler = ({ context, blocks, initialState = false }: ActiveHandler) => {
+  const [isActive, setIsActive] = context.useState(initialState);
   const hasContent = blocks?.length;
   const icon: IconName = isActive ? 'MinusIcon' : 'PlusIcon';
 

package/src/components/Blocks.ts

@@ -18,6 +18,7 @@ import { ProductGallery } from './ProductGallery/ProductGallery';
 import { ProductGalleryGreen } from './ProductGalleryGreen/ProductGalleryGreen';
 import { ProductTile } from './ProductTile/ProductTile';
 import { PromoTile } from './PromoTile/PromoTile';
+import { OtherProducts } from './OtherProducts/OtherProducts';
 import { Recommendation } from './Recommendation/Recommendation';
 import { StepsBlock } from './StepsBlock/StepsBlock';
 import { TariffsTable } from './TariffsTable/TariffsTable';
@@ -43,6 +44,7 @@ export const Blocks = {
   ProductGalleryGreen,
   ProductTile,
   PromoTile,
+  OtherProducts,
   Recommendation,
   StepsBlock,
   TariffsTable,

package/src/components/ComparisonTable/ComparisonTableContent.ts

@@ -49,6 +49,24 @@ export interface RowHeader {
   /** @title Заголовок */
   title?: string;
 }
+
+/**
+ * @title Ячейка
+ */
+export interface TableColumnData {
+  rowHeader?: string;
+  cell: CellData[];
+}
+
+/**
+ * @title Параметр
+ */
+export interface TableColumnHeader {
+  /** @title Заголовок */
+  title?: string;
+  icon?: IconName;
+}
+
 /**
  * @title Сравнительная таблица
  */

package/src/components/ComparisonTable/HeaderCell.tsx

@@ -13,6 +13,7 @@ export interface HeaderCellProps {
   image?: Picture;
   title?: string;
   link?: LinkProps;
+  isFillGradient?: boolean;
 }
 
 export const HeaderCell = JSX<HeaderCellProps>(({ icon, image, title, link }) => (

package/src/components/ComparisonTable/TableColumn.tsx

@@ -5,10 +5,11 @@ import { Button } from '../../ui-kit/Button/Button';
 import { GRADIENT } from './constants';
 import { HeaderCell } from './HeaderCell';
 import { TableCell } from './TableCell';
+import type { TableColumnData, TableColumnHeader } from './ComparisonTableContent';
 
 export interface TableColumnProps extends UniBlockProps {
-  header: any;
-  columnData: any;
+  header: TableColumnHeader;
+  columnData: TableColumnData[];
   visibleRowLength: number;
   isFillGradient: boolean;
   showRow: boolean;

package/src/components/ContentPage/ContentPage.page.json

@@ -1394,7 +1394,7 @@
         "title": "Своя кредитная карта",
         "description": "Карта работает в 180 странах мира. Бесплатное снятие наличных в любых банкоматах.",
         "align": "center",
-        "bgColor": "transparent"
+        "bgColorHeadline": "transparent"
       }
     },
     {

package/src/components/Gallery/Gallery.example.json

@@ -6,8 +6,8 @@
       "image": {
         "format": "webp",
         "size": {
-          "width": 140,
-          "height": 140
+          "width": 150,
+          "height": 150
         }
       },
       "title": "Заголовок 1",
@@ -55,24 +55,6 @@
         {"text":"Элемент списка 2", "title": "Элемент заголовка 2"},
         {"text":"Элемент списка 3", "title": "Элемент заголовка 3"}
       ]
-    },
-    {
-      "image": {
-        "format": "webp",
-        "size": {
-          "width": 140,
-          "height": 140
-        }
-      },
-      "title": "Заголовок 4",
-      "description": "Описание 4",
-      "href": "/credit-cards",
-      "version": "primary",
-      "items": [
-        {"text":"Элемент списка 1", "title": "Элемент заголовка 1"},
-        {"text":"Элемент списка 2", "title": "Элемент заголовка 2"},
-        {"text":"Элемент списка 3", "title": "Элемент заголовка 3"}
-      ]
     }
   ]
 }