@redneckz/wildless-cms-uni-blocks 0.5.13 → 0.5.14

package/mobile/lib/components/OtherProducts/OtherProductsContent.d.ts

@@ -1,25 +1,5 @@
-import type { ColorPalette } from '../../model/ContentPageDef';
 import type { TitleProps } from '../../model/HeadlineType';
-import type { BlockDef } from '../../ui-kit/BlocksList/BlocksListProps';
-/**
- * @title Элемент списка
- */
-export interface BlockItemCommonProps {
-    /**
-     * @title Название
-     * @default Список
-     */
-    label?: string;
-    /** @title Отображать в раскрытом виде */
-    isUnfolded?: boolean;
-    /** @title Блоки */
-    blocks?: BlockDef[];
-}
 /**
  * @title Другие продукты
  */
-export declare type OtherProductsContent = TitleProps & {
-    /** @title Список */
-    blockItems?: BlockItemCommonProps[];
-    colorPalette?: ColorPalette;
-};
+export declare type OtherProductsContent = TitleProps;

package/mobile/lib/components/OtherProductsItem/OtherProductsItem.d.ts

@@ -0,0 +1,6 @@
+import { JSXBlock } from '../../model/BlocksRegistry';
+import type { UniBlockProps } from '../../model/ContentPageDef';
+import type { OtherProductsItemContent } from './OtherProductsItemContent';
+export interface OtherProductsItemProps extends OtherProductsItemContent, UniBlockProps {
+}
+export declare const OtherProductsItem: JSXBlock<OtherProductsItemProps>;

package/mobile/lib/components/OtherProductsItem/OtherProductsItem.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
+import { JSX } from '@redneckz/uni-jsx';
+import { DefaultFoldButton } from '../../ui-kit/Foldable/DefaultFoldButton.js';
+import { Foldable } from '../../ui-kit/Foldable/Foldable.js';
+import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection.js';
+const icons = ['ArrowDownIcon', 'ArrowUpIcon'];
+export const OtherProductsItem = JSX(({ className, label = '', colorPalette, isUnfolded: unfoldedByDefault, children }) => (_jsx("div", { className: `border-0 border-b border-solid border-main-divider ${className}`, children: _jsx(Foldable, { unfoldedByDefault: unfoldedByDefault, renderFoldableSection: ({ isUnfolded }) => (_jsx("div", { className: "box-border", children: _jsx(FoldableSection, { className: "grid grid-cols-12 gap-1 border-box", isUnfolded: isUnfolded, children: children }) })), renderFoldButton: ({ isUnfolded, onToggle }) => (_jsx(DefaultFoldButton, { label: label, icon: icons[Number(isUnfolded)], dataTheme: colorPalette, onClick: onToggle })) }) })));
+OtherProductsItem.childrenTypes = []; // All types of blocks are suitable
+//# sourceMappingURL=OtherProductsItem.js.map

package/mobile/lib/components/OtherProductsItem/OtherProductsItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OtherProductsItem.js","sourceRoot":"","sources":["../../../src/components/OtherProductsItem/OtherProductsItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAGxC,OAAO,EAAE,iBAAiB,EAAE,MAAM,yCAAyC,CAAC;AAC5E,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AAMxE,MAAM,KAAK,GAAe,CAAC,eAAe,EAAE,aAAa,CAAC,CAAC;AAE3D,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAClC,CAAC,EAAE,SAAS,EAAE,KAAK,GAAG,EAAE,EAAE,YAAY,EAAE,UAAU,EAAE,iBAAiB,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CACpF,cAAK,SAAS,EAAE,sDAAsD,SAAS,EAAE,YAC/E,KAAC,QAAQ,IACP,iBAAiB,EAAE,iBAAiB,EACpC,qBAAqB,EAAE,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,CACzC,cAAK,SAAS,EAAC,YAAY,YACzB,KAAC,eAAe,IAAC,SAAS,EAAC,oCAAoC,EAAC,UAAU,EAAE,UAAU,YACnF,QAAQ,GACO,GACd,CACP,EACD,gBAAgB,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAC9C,KAAC,iBAAiB,IAChB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,EAC/B,SAAS,EAAE,YAAY,EACvB,OAAO,EAAE,QAAQ,GACjB,CACH,GACD,GACE,CACP,CACkC,CAAC;AAEtC,iBAAiB,CAAC,aAAa,GAAG,EAAE,CAAC,CAAC,mCAAmC"}

package/mobile/lib/components/OtherProductsItem/OtherProductsItemContent.d.ts

@@ -0,0 +1,14 @@
+import type { ColorPalette } from '../../model/ContentPageDef';
+/**
+ * @title Элемент списка
+ */
+export interface OtherProductsItemContent {
+    /**
+     * @title Название
+     * @default Список
+     */
+    label?: string;
+    /** @title Отображать в раскрытом виде */
+    isUnfolded?: boolean;
+    colorPalette?: ColorPalette;
+}

package/mobile/lib/components/OtherProductsItem/OtherProductsItemContent.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=OtherProductsItemContent.js.map

package/mobile/lib/components/OtherProductsItem/OtherProductsItemContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OtherProductsItemContent.js","sourceRoot":"","sources":["../../../src/components/OtherProductsItem/OtherProductsItemContent.ts"],"names":[],"mappings":""}

package/mobile/lib/ui-kit/Foldable/FoldableSection.js

@@ -9,7 +9,7 @@ export const FoldableSection = JSX(({ className = '', isUnfolded, children }) =>
                 ? `${containerRef.current.scrollHeight}px`
                 : '';
         }
-    }, [isUnfolded]);
+    }, [isUnfolded, children?.length]);
     return (_jsx("div", { ref: containerRef, className: `transition-max-h duration-300 overflow-hidden max-h-0 ${className}`, children: children }));
 });
 //# sourceMappingURL=FoldableSection.js.map

package/mobile/lib/ui-kit/Foldable/FoldableSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"FoldableSection.js","sourceRoot":"","sources":["../../../src/ui-kit/Foldable/FoldableSection.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAOhE,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAChC,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC3C,MAAM,YAAY,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAEzD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,YAAY,CAAC,OAAO,EAAE;YACxB,YAAY,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,UAAU;gBAC/C,CAAC,CAAC,GAAG,YAAY,CAAC,OAAO,CAAC,YAAY,IAAI;gBAC1C,CAAC,CAAC,EAAE,CAAC;SACR;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACL,cACE,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,yDAAyD,SAAS,EAAE,YAE9E,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"FoldableSection.js","sourceRoot":"","sources":["../../../src/ui-kit/Foldable/FoldableSection.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAOhE,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAChC,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC3C,MAAM,YAAY,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAEzD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,YAAY,CAAC,OAAO,EAAE;YACxB,YAAY,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,UAAU;gBAC/C,CAAC,CAAC,GAAG,YAAY,CAAC,OAAO,CAAC,YAAY,IAAI;gBAC1C,CAAC,CAAC,EAAE,CAAC;SACR;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC;IAEnC,OAAO,CACL,cACE,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,yDAAyD,SAAS,EAAE,YAE9E,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC"}

package/mobile/src/components/ContentPage/renderBlock.tsx

@@ -1,6 +1,7 @@
 import { BlockAncestors, BlockDecorator, DEFAULT_ANCESTORS } from '../../model/BlockDecorator';
 import type { BlocksRegistry } from '../../model/BlocksRegistry';
 import type { BlockDef, ContentPageDef } from '../../model/ContentPageDef';
+import type { VNode } from '../../model/VNode';
 import { style2className } from '../../utils/style2className';
 import type { ContentPageContext } from './ContentPageContext';
 
@@ -12,13 +13,15 @@ interface RenderBlockOptions {
   context: ContentPageContext;
 }
 
+const defaultChildRenderer = (_: VNode) => _;
+
 export function renderBlock(
   block: BlockDef,
   options: RenderBlockOptions,
   ancestors: BlockAncestors = DEFAULT_ANCESTORS, // Recursion context
 ) {
   const { key, page, blockDecorator, blocksRegistry, context } = options;
-  const { type } = block;
+  const { type, blocks: childBlocks } = block;
 
   if (!(type && type in blocksRegistry)) {
     console.warn(`No block with "${type}" is registered`);
@@ -26,6 +29,14 @@ export function renderBlock(
 
   const BlockComponent = type && blocksRegistry[type];
 
+  const { renderChild = defaultChildRenderer } = BlockComponent || {};
+  const renderChildBlock = (_: BlockDef, j: number) =>
+    renderChild(
+      renderBlock(_, { ...options, key: `${options.key}-${j}` }, [...ancestors, block]),
+      j,
+    );
+  const children = childBlocks?.length ? childBlocks.map(renderChildBlock) : null;
+
   return blockDecorator(
     {
       blockClassName: `scroll-mt-12 ${style2className(block.style)}`, // TODO scroll-mt-12 ? here?
@@ -33,21 +44,15 @@ export function renderBlock(
       ancestors,
       // Adjusted by decorator block and blockClassName
       render: ({ block: adjustedBlock, blockClassName: adjustedBlockClassName }) => {
-        const { version, content, anchor, labels, blocks: childBlocks } = adjustedBlock;
-
-        const children = childBlocks
-          ? childBlocks.map((_, j) =>
-              renderBlock(_, { ...options, key: `${options.key}-${j}` }, [...ancestors, block]),
-            )
-          : null;
+        const { version, anchor, labels, content } = adjustedBlock;
 
         return BlockComponent ? (
           <BlockComponent
             key={key}
             className={adjustedBlockClassName}
-            version={version}
             context={context}
             page={page}
+            version={version}
             anchor={anchor}
             labels={labels}
             {...content}

package/mobile/src/components/OtherProducts/OtherProducts.example.json

@@ -1,56 +1,3 @@
 {
-  "title": "Другие продукты",
-  "blockItems": [
-    {
-      "label": "Другие продукты 1",
-      "blocks": [
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок",
-          "description": "Описание текстового блока",
-          "style": ["col-span-12"]
-        },
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок №2",
-          "description": "Описание текстового блока №2",
-          "style": ["col-span-12"]
-        }
-      ]
-    },
-    {
-      "label": "Другие продукты 2",
-      "blocks": [
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок",
-          "description": "Описание текстового блока",
-          "style": ["col-span-12"]
-        },
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок №2",
-          "description": "Описание текстового блока №2",
-          "style": ["col-span-12"]
-        }
-      ]
-    },
-    {
-      "label": "Другие продукты 3",
-      "blocks": [
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок",
-          "description": "Описание текстового блока",
-          "style": ["col-span-12"]
-        },
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок №2",
-          "description": "Описание текстового блока №2",
-          "style": ["col-span-12"]
-        }
-      ]
-    }
-  ]
+  "title": "Другие продукты"
 }

package/mobile/src/components/OtherProducts/OtherProducts.tsx

@@ -1,32 +1,21 @@
 import { JSX } from '@redneckz/uni-jsx';
+import type { JSXBlock } from '../../model/BlocksRegistry';
 import type { UniBlockProps } from '../../model/ContentPageDef';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import type { OtherProductsContent } from './OtherProductsContent';
-import { OtherProductsItem } from './OtherProductsItem';
 
 export interface OtherProductsProps extends OtherProductsContent, UniBlockProps {}
 
 export const OtherProducts = JSX<OtherProductsProps>(
-  ({ blockItems, colorPalette, context, className = '', ...rest }) => {
-    return (
-      <BlockWrapper
-        context={context}
-        className={`font-sans text-primary-text ${className}`}
-        {...rest}
-      >
-        {blockItems?.length ? (
-          <div className="box-border1">
-            {blockItems.map((item, i) => (
-              <OtherProductsItem
-                key={`BlockItem${i}`}
-                {...item}
-                dataTheme={colorPalette}
-                context={context}
-              />
-            ))}
-          </div>
-        ) : null}
-      </BlockWrapper>
-    );
-  },
-);
+  ({ context, className = '', children, ...rest }) => (
+    <BlockWrapper
+      context={context}
+      className={`font-sans text-primary-text ${className}`}
+      {...rest}
+    >
+      {children ? <div className="box-border1">{children}</div> : null}
+    </BlockWrapper>
+  ),
+) as JSXBlock<OtherProductsProps>;
+
+OtherProducts.childrenTypes = ['OtherProductsItem'];

package/mobile/src/components/OtherProducts/OtherProducts.ui.json

@@ -1,76 +1 @@
-{
-  "content": {
-    "blockItems": {
-      "items": {
-        "blocks": {
-          "items": {
-            "blockListType": {
-              "ui:widget": "hidden"
-            },
-            "image": {
-              "ui:field": "picture"
-            },
-            "benefitList": {
-              "items": {
-                "description": {
-                  "benefitType": {
-                    "ui:widget": "hidden"
-                  }
-                },
-                "icon": {
-                  "ui:field": "icon"
-                }
-              }
-            },
-            "style": {
-              "ui:field": "style"
-            },
-            "benefits": {
-              "items": {
-                "icon": {
-                  "ui:field": "icon"
-                }
-              }
-            },
-            "buttons": {
-              "items": {
-                "icon": {
-                  "ui:field": "icon"
-                },
-                "iconRight": {
-                  "ui:field": "icon"
-                }
-              }
-            },
-            "icon": {
-              "ui:field": "icon"
-            },
-            "backwardButton": {
-              "icon": {
-                "ui:field": "icon"
-              },
-              "iconRight": {
-                "ui:field": "icon"
-              }
-            },
-            "cards": {
-              "items": {
-                "image": {
-                  "ui:field": "picture"
-                },
-                "button": {
-                  "icon": {
-                    "ui:field": "icon"
-                  },
-                  "iconRight": {
-                    "ui:field": "icon"
-                  }
-                }
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-}
+{}

package/mobile/src/components/OtherProducts/OtherProductsContent.ts

@@ -1,27 +1,6 @@
-import type { ColorPalette } from '../../model/ContentPageDef';
 import type { TitleProps } from '../../model/HeadlineType';
-import type { BlockDef } from '../../ui-kit/BlocksList/BlocksListProps';
-
-/**
- * @title Элемент списка
- */
-export interface BlockItemCommonProps {
-  /**
-   * @title Название
-   * @default Список
-   */
-  label?: string;
-  /** @title Отображать в раскрытом виде */
-  isUnfolded?: boolean;
-  /** @title Блоки */
-  blocks?: BlockDef[];
-}
 
 /**
  * @title Другие продукты
  */
-export type OtherProductsContent = TitleProps & {
-  /** @title Список */
-  blockItems?: BlockItemCommonProps[];
-  colorPalette?: ColorPalette;
-};
+export type OtherProductsContent = TitleProps;

package/mobile/src/components/OtherProductsItem/OtherProductsItem.example.json

@@ -0,0 +1,3 @@
+{
+  "label": "Другие продукты N"
+}

package/mobile/src/components/OtherProductsItem/OtherProductsItem.tsx

@@ -0,0 +1,39 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { JSXBlock } from '../../model/BlocksRegistry';
+import type { UniBlockProps } from '../../model/ContentPageDef';
+import { DefaultFoldButton } from '../../ui-kit/Foldable/DefaultFoldButton';
+import { Foldable } from '../../ui-kit/Foldable/Foldable';
+import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection';
+import type { IconName } from '../../ui-kit/Icon/IconProps';
+import type { OtherProductsItemContent } from './OtherProductsItemContent';
+
+export interface OtherProductsItemProps extends OtherProductsItemContent, UniBlockProps {}
+
+const icons: IconName[] = ['ArrowDownIcon', 'ArrowUpIcon'];
+
+export const OtherProductsItem = JSX<OtherProductsItemProps>(
+  ({ className, label = '', colorPalette, isUnfolded: unfoldedByDefault, children }) => (
+    <div className={`border-0 border-b border-solid border-main-divider ${className}`}>
+      <Foldable
+        unfoldedByDefault={unfoldedByDefault}
+        renderFoldableSection={({ isUnfolded }) => (
+          <div className="box-border">
+            <FoldableSection className="grid grid-cols-12 gap-1 border-box" isUnfolded={isUnfolded}>
+              {children}
+            </FoldableSection>
+          </div>
+        )}
+        renderFoldButton={({ isUnfolded, onToggle }) => (
+          <DefaultFoldButton
+            label={label}
+            icon={icons[Number(isUnfolded)]}
+            dataTheme={colorPalette}
+            onClick={onToggle}
+          />
+        )}
+      />
+    </div>
+  ),
+) as JSXBlock<OtherProductsItemProps>;
+
+OtherProductsItem.childrenTypes = []; // All types of blocks are suitable

package/mobile/src/components/OtherProductsItem/OtherProductsItem.ui.json

@@ -0,0 +1 @@
+{}

package/mobile/src/components/OtherProductsItem/OtherProductsItemContent.ts

@@ -0,0 +1,17 @@
+import type { ColorPalette } from '../../model/ContentPageDef';
+
+/**
+ * @title Элемент списка
+ */
+export interface OtherProductsItemContent {
+  /**
+   * @title Название
+   * @default Список
+   */
+  label?: string;
+
+  /** @title Отображать в раскрытом виде */
+  isUnfolded?: boolean;
+
+  colorPalette?: ColorPalette;
+}

package/mobile/src/ui-kit/Foldable/FoldableSection.tsx

@@ -16,7 +16,7 @@ export const FoldableSection = JSX<FoldableSectionProps>(
           ? `${containerRef.current.scrollHeight}px`
           : '';
       }
-    }, [isUnfolded]);
+    }, [isUnfolded, children?.length]);
 
     return (
       <div

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.5.13",
+  "version": "0.5.14",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/components/Blocks.ts

@@ -20,6 +20,7 @@ import { MiniGallery } from './MiniGallery/MiniGallery';
 import { MobileAppTile } from './MobileAppTile/MobileAppTile';
 import { OfficeServicesBlock } from './OfficeServicesBlock/OfficeServicesBlock';
 import { OtherProducts } from './OtherProducts/OtherProducts';
+import { OtherProductsItem } from './OtherProductsItem/OtherProductsItem';
 import { PictureText } from './PictureText/PictureText';
 import { Placeholder } from './Placeholder/Placeholder';
 import { ProductBlock } from './ProductBlock/ProductBlock';
@@ -59,6 +60,7 @@ export const Blocks = {
   ProductTile,
   PromoTile,
   OtherProducts,
+  OtherProductsItem,
   Recommendation,
   StepsBlock,
   TariffsTable,

package/src/components/ContentPage/renderBlock.tsx

@@ -1,6 +1,7 @@
 import { BlockAncestors, BlockDecorator, DEFAULT_ANCESTORS } from '../../model/BlockDecorator';
 import type { BlocksRegistry } from '../../model/BlocksRegistry';
 import type { BlockDef, ContentPageDef } from '../../model/ContentPageDef';
+import type { VNode } from '../../model/VNode';
 import { style2className } from '../../utils/style2className';
 import type { ContentPageContext } from './ContentPageContext';
 
@@ -12,13 +13,15 @@ interface RenderBlockOptions {
   context: ContentPageContext;
 }
 
+const defaultChildRenderer = (_: VNode) => _;
+
 export function renderBlock(
   block: BlockDef,
   options: RenderBlockOptions,
   ancestors: BlockAncestors = DEFAULT_ANCESTORS, // Recursion context
 ) {
   const { key, page, blockDecorator, blocksRegistry, context } = options;
-  const { type } = block;
+  const { type, blocks: childBlocks } = block;
 
   if (!(type && type in blocksRegistry)) {
     console.warn(`No block with "${type}" is registered`);
@@ -26,6 +29,14 @@ export function renderBlock(
 
   const BlockComponent = type && blocksRegistry[type];
 
+  const { renderChild = defaultChildRenderer } = BlockComponent || {};
+  const renderChildBlock = (_: BlockDef, j: number) =>
+    renderChild(
+      renderBlock(_, { ...options, key: `${options.key}-${j}` }, [...ancestors, block]),
+      j,
+    );
+  const children = childBlocks?.length ? childBlocks.map(renderChildBlock) : null;
+
   return blockDecorator(
     {
       blockClassName: `scroll-mt-12 ${style2className(block.style)}`, // TODO scroll-mt-12 ? here?
@@ -33,21 +44,15 @@ export function renderBlock(
       ancestors,
       // Adjusted by decorator block and blockClassName
       render: ({ block: adjustedBlock, blockClassName: adjustedBlockClassName }) => {
-        const { version, content, anchor, labels, blocks: childBlocks } = adjustedBlock;
-
-        const children = childBlocks
-          ? childBlocks.map((_, j) =>
-              renderBlock(_, { ...options, key: `${options.key}-${j}` }, [...ancestors, block]),
-            )
-          : null;
+        const { version, anchor, labels, content } = adjustedBlock;
 
         return BlockComponent ? (
           <BlockComponent
             key={key}
             className={adjustedBlockClassName}
-            version={version}
             context={context}
             page={page}
+            version={version}
             anchor={anchor}
             labels={labels}
             {...content}

package/src/components/OtherProducts/OtherProducts.example.json

@@ -1,56 +1,3 @@
 {
-  "title": "Другие продукты",
-  "blockItems": [
-    {
-      "label": "Другие продукты 1",
-      "blocks": [
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок",
-          "description": "Описание текстового блока",
-          "style": ["col-span-12"]
-        },
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок №2",
-          "description": "Описание текстового блока №2",
-          "style": ["col-span-12"]
-        }
-      ]
-    },
-    {
-      "label": "Другие продукты 2",
-      "blocks": [
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок",
-          "description": "Описание текстового блока",
-          "style": ["col-span-12"]
-        },
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок №2",
-          "description": "Описание текстового блока №2",
-          "style": ["col-span-12"]
-        }
-      ]
-    },
-    {
-      "label": "Другие продукты 3",
-      "blocks": [
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок",
-          "description": "Описание текстового блока",
-          "style": ["col-span-12"]
-        },
-        {
-          "blockListType": "TextBlock",
-          "title": "Текстовый блок №2",
-          "description": "Описание текстового блока №2",
-          "style": ["col-span-12"]
-        }
-      ]
-    }
-  ]
+  "title": "Другие продукты"
 }