@redneckz/wildless-cms-uni-blocks 0.6.22 → 0.6.23

package/src/components/Catalog/Catalog.example.json

@@ -1,57 +1,59 @@
 {
-  "title": "Каталог",
-  "description": "Описание",
-  "cards": [
-    {
-      "title": "Заголовок карточки 1",
-      "description": "Описание карточки",
-      "image": {
-        "format": "webp",
-        "size": {
-          "width": 230,
-          "height": 230
+  "content": {
+    "title": "Каталог",
+    "description": "Описание",
+    "cards": [
+      {
+        "title": "Заголовок карточки 1",
+        "description": "Описание карточки",
+        "image": {
+          "format": "webp",
+          "size": {
+            "width": 230,
+            "height": 230
+          }
+        },
+        "button": {
+          "href": "",
+          "text": "Подробнее",
+          "target": "_self",
+          "version": "primary"
         }
       },
-      "button": {
-        "href": "",
-        "text": "Подробнее",
-        "target": "_self",
-        "version": "primary"
-      }
-    },
-    {
-      "title": "Заголовок карточки 2",
-      "description": "Описание карточки",
-      "image": {
-        "format": "webp",
-        "size": {
-          "width": 230,
-          "height": 230
+      {
+        "title": "Заголовок карточки 2",
+        "description": "Описание карточки",
+        "image": {
+          "format": "webp",
+          "size": {
+            "width": 230,
+            "height": 230
+          }
+        },
+        "button": {
+          "href": "",
+          "text": "Подробнее",
+          "target": "_self",
+          "version": "primary"
         }
       },
-      "button": {
-        "href": "",
-        "text": "Подробнее",
-        "target": "_self",
-        "version": "primary"
-      }
-    },
-    {
-      "title": "Заголовок карточки 3",
-      "description": "Описание карточки",
-      "image": {
-        "format": "webp",
-        "size": {
-          "width": 230,
-          "height": 230
+      {
+        "title": "Заголовок карточки 3",
+        "description": "Описание карточки",
+        "image": {
+          "format": "webp",
+          "size": {
+            "width": 230,
+            "height": 230
+          }
+        },
+        "button": {
+          "href": "",
+          "text": "Подробнее",
+          "target": "_self",
+          "version": "primary"
         }
-      },
-      "button": {
-        "href": "",
-        "text": "Подробнее",
-        "target": "_self",
-        "version": "primary"
       }
-    }
-  ]
+    ]
+  }
 }

package/src/components/Catalog/Catalog.tsx

@@ -21,7 +21,7 @@ export const Catalog = JSX<CatalogProps>(
     return (
       <BlockWrapper
         context={context}
-        className={`bg-white relative font-sans p-12 overflow-hidden text-center ${className}`}
+        className={`bg-white relative font-sans p-[50px] overflow-hidden text-center ${className}`}
         {...rest}
       >
         <Headline

package/src/components/Catalog/CatalogCard.tsx

@@ -29,7 +29,7 @@ export const CatalogCard = JSX<CatalogCardProps>(
         ) : null}
         {description ? <div className="text-m-light text-left mb-4">{description}</div> : null}
         {colors?.length ? (
-          <div className="flex mb-4 text-m-light text-secondary-text">
+          <div className="flex mb-4 text-s-light text-secondary-text">
             <div className="mr-1.5">Доступные цвета: </div>
             {colors.map(renderColorOption)}
           </div>

package/src/components/ComparisonTable/ComparisonTable.example.json

@@ -1,85 +1,87 @@
 {
-  "title": "Сравнительная таблица",
-  "orientation": "horizontal",
-  "rowHeaders": [
-    {
-      "title": "Параметр 1"
-    },
-    {
-      "title": "Параметр 2"
-    },
-    {
-      "title": "Параметр 3"
-    }
-  ],
-  "columns": [
-    {
-      "header": {
-        "title": "Продукт 1",
-        "image": {
-          "format": "webp",
-          "size": {
-            "width": 100,
-            "height": 63
-          }
-        }
+  "content": {
+    "title": "Сравнительная таблица",
+    "orientation": "horizontal",
+    "rowHeaders": [
+      {
+        "title": "Параметр 1"
       },
-      "data": [
-        [
-          {
-            "label": "Ячейка 1"
-          }
-        ],
-        [
-          {
-            "label": "Ячейка 2-1",
-            "description": "Описание для ячейки 2-1"
-          },
-          {
-            "label": "Ячейка 2-2",
-            "description": "Описание для ячейки 2-2"
-          }
-        ],
-        [
-          {
-            "label": "Ячейка 3"
+      {
+        "title": "Параметр 2"
+      },
+      {
+        "title": "Параметр 3"
+      }
+    ],
+    "columns": [
+      {
+        "header": {
+          "title": "Продукт 1",
+          "image": {
+            "format": "webp",
+            "size": {
+              "width": 100,
+              "height": 63
+            }
           }
+        },
+        "data": [
+          [
+            {
+              "label": "Ячейка 1"
+            }
+          ],
+          [
+            {
+              "label": "Ячейка 2-1",
+              "description": "Описание для ячейки 2-1"
+            },
+            {
+              "label": "Ячейка 2-2",
+              "description": "Описание для ячейки 2-2"
+            }
+          ],
+          [
+            {
+              "label": "Ячейка 3"
+            }
+          ]
         ]
-      ]
-    },
-    {
-      "header": {
-        "title": "Продукт 2",
-        "image": {
-          "format": "webp",
-          "size": {
-            "width": 100,
-            "height": 63
-          }
-        }
       },
-      "data": [
-        [
-          {
-            "label": "Ячейка 1"
-          }
-        ],
-        [
-          {
-            "label": "Ячейка 2-1",
-            "description": "Описание для ячейки 2-1"
-          },
-          {
-            "label": "Ячейка 2-2",
-            "description": "Описание для ячейки 2-2"
-          }
-        ],
-        [
-          {
-            "label": "Ячейка 3"
+      {
+        "header": {
+          "title": "Продукт 2",
+          "image": {
+            "format": "webp",
+            "size": {
+              "width": 100,
+              "height": 63
+            }
           }
+        },
+        "data": [
+          [
+            {
+              "label": "Ячейка 1"
+            }
+          ],
+          [
+            {
+              "label": "Ячейка 2-1",
+              "description": "Описание для ячейки 2-1"
+            },
+            {
+              "label": "Ячейка 2-2",
+              "description": "Описание для ячейки 2-2"
+            }
+          ],
+          [
+            {
+              "label": "Ячейка 3"
+            }
+          ]
         ]
-      ]
-    }
-  ]
+      }
+    ]
+  }
 }

package/src/components/ContactsBlock/ContactsBlock.example.json

@@ -1,51 +1,53 @@
 {
-  "contactsBlockVersion": "secondary",
-  "info": [
-    {
-      "title": "Заголовок 1",
-      "description": "Описание 1",
-      "button": {
-        "href": "#",
-        "text": "Кнопка 1",
-        "target": "_blank",
-        "version": "secondary"
-      }
-    },
-    {
-      "title": "Заголовок 2",
-      "description": "Описание 2",
-      "button": {
-        "href": "#",
-        "text": "Кнопка 2",
-        "target": "_blank",
-        "version": "secondary"
-      }
-    }
-  ],
-  "contacts": [
-    [
+  "content": {
+    "version": "secondary",
+    "info": [
       {
-        "title": "Заголовок 3",
-        "description": "Описание 3",
-        "additionalDescription": "Доп описание 3"
+        "title": "Заголовок 1",
+        "description": "Описание 1",
+        "button": {
+          "href": "#",
+          "text": "Кнопка 1",
+          "target": "_blank",
+          "version": "secondary"
+        }
       },
       {
-        "title": "Заголовок 4",
-        "description": "Описание 4",
-        "additionalDescription": "Доп описание 4"
+        "title": "Заголовок 2",
+        "description": "Описание 2",
+        "button": {
+          "href": "#",
+          "text": "Кнопка 2",
+          "target": "_blank",
+          "version": "secondary"
+        }
       }
     ],
-    [
-      {
-        "title": "Заголовок 5",
-        "description": "Описание 5",
-        "additionalDescription": "Доп описание 5"
-      },
-      {
-        "title": "Заголовок 6",
-        "description": "Описание 6",
-        "additionalDescription": "Доп описание 6"
-      }
+    "contacts": [
+      [
+        {
+          "title": "Заголовок 3",
+          "description": "Описание 3",
+          "additionalDescription": "Доп описание 3"
+        },
+        {
+          "title": "Заголовок 4",
+          "description": "Описание 4",
+          "additionalDescription": "Доп описание 4"
+        }
+      ],
+      [
+        {
+          "title": "Заголовок 5",
+          "description": "Описание 5",
+          "additionalDescription": "Доп описание 5"
+        },
+        {
+          "title": "Заголовок 6",
+          "description": "Описание 6",
+          "additionalDescription": "Доп описание 6"
+        }
+      ]
     ]
-  ]
+  }
 }

package/src/components/ContactsBlock/ContactsBlock.fixture.tsx

@@ -9,48 +9,55 @@ const button: ButtonProps = {
   version: 'secondary',
 };
 
+const info = [
+  {
+    title: 'Телеграм-канал РСХБ Инвестиции',
+    description:
+      'Всегда вовремя: главные новости, инвестиционные идеи, анонсы размещения облигаций',
+    button,
+  },
+  {
+    title: 'Подписка на аналитику',
+    description: 'E-mail рассылка: главное за неделю',
+    button,
+  },
+];
+const contacts = [
+  [
+    {
+      title: '8 (800) 100-40-40',
+      description: 'Для консультаций',
+    },
+    {
+      title: '8 (800) 100-40-60',
+      description: 'Для подачи торговых поручений',
+      additionalDescription: 'Потребуется назвать уникальный код клиента и кодовое слово',
+    },
+  ],
+  [
+    {
+      title: 'invest@rshb.ru',
+      description: 'По брокерскому обслуживанию',
+      additionalDescription: 'Восстановление логина и номера соглашения',
+    },
+    {
+      title: 'broker@rshb.ru',
+      description: 'По брокерскому обслуживанию',
+      additionalDescription: 'Получение расчета финансового результата и справки 2-НДФЛ',
+    },
+  ],
+];
+
 export default {
-  default: (
+  secondary: (
+    <ContactsBlock className="col-span-12" info={info} contacts={contacts} context={context} />
+  ),
+  primary: (
     <ContactsBlock
       className="col-span-12"
-      info={[
-        {
-          title: 'Телеграм-канал РСХБ Инвестиции',
-          description:
-            'Всегда вовремя: главные новости, инвестиционные идеи, анонсы размещения облигаций',
-          button,
-        },
-        {
-          title: 'Подписка на аналитику',
-          description: 'E-mail рассылка: главное за неделю',
-          button,
-        },
-      ]}
-      contacts={[
-        [
-          {
-            title: '8 (800) 100-40-40',
-            description: 'Для консультаций',
-          },
-          {
-            title: '8 (800) 100-40-60',
-            description: 'Для подачи торговых поручений',
-            additionalDescription: 'Потребуется назвать уникальный код клиента и кодовое слово',
-          },
-        ],
-        [
-          {
-            title: 'invest@rshb.ru',
-            description: 'По брокерскому обслуживанию',
-            additionalDescription: 'Восстановление логина и номера соглашения',
-          },
-          {
-            title: 'broker@rshb.ru',
-            description: 'По брокерскому обслуживанию',
-            additionalDescription: 'Получение расчета финансового результата и справки 2-НДФЛ',
-          },
-        ],
-      ]}
+      version="primary"
+      info={info}
+      contacts={contacts}
       context={context}
     />
   ),

package/src/components/ContactsBlock/ContactsBlock.tsx

@@ -19,11 +19,11 @@ const contactsBlockStyleMap = {
 };
 
 export const ContactsBlock = JSX<ContactsBlockProps>(
-  ({ className = '', contacts, context, info, contactsBlockVersion = 'secondary', ...rest }) => {
+  ({ className = '', contacts, context, info, version = 'secondary', ...rest }) => {
     return (
       <BlockWrapper
         context={context}
-        className={`${contactsBlockStyleMap[contactsBlockVersion]} flex p-12 ${className}`}
+        className={`${contactsBlockStyleMap[version]} flex p-12 ${className}`}
         {...rest}
       >
         {info ? renderInfo(info) : null}

package/src/components/ContactsBlock/ContactsBlockContent.ts

@@ -1,3 +1,4 @@
+import type { BlockVersion } from '../../model/BlockVersion';
 import type { HeadlineCommonProps } from '../../model/HeadlineType';
 import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
 
@@ -15,7 +16,7 @@ export interface ContactsBlockContent {
    * @maxItems 2
    * */
   contacts?: ContactItemProps[][];
-  contactsBlockVersion?: 'secondary';
+  version?: BlockVersion;
 }
 
 /**

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

@@ -1,19 +1,22 @@
+/* eslint-disable react-hooks/rules-of-hooks */
 import { mobileContext } from '../../react/setup-fixture';
 
 import type { ContentPageDef } from '../../model/ContentPageDef';
 import { Blocks } from '../Blocks';
 import { ContentPage } from './ContentPage';
 import { normalizePage } from './normalizePage';
-
-import data from './ContentPage.page.json';
+import { useContentPageData } from './useContentPageData';
 
 export default {
-  default: (
-    <ContentPage
-      className="bg-secondary-text"
-      context={mobileContext}
-      blocksRegistry={Blocks}
-      data={normalizePage(Blocks)(data as ContentPageDef)}
-    />
-  ),
+  default: () => {
+    const data = useContentPageData(Blocks);
+
+    return (
+      <ContentPage
+        context={mobileContext}
+        blocksRegistry={Blocks}
+        data={normalizePage(Blocks)(data as ContentPageDef)}
+      />
+    );
+  },
 };

package/src/components/ContentPage/ContentPage.fixture.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable react-hooks/rules-of-hooks */
 import { context } from '../../react/setup-fixture';
 
 import type { BlockDecorator } from '../../model/BlockDecorator';
@@ -5,8 +6,7 @@ import type { ContentPageDef } from '../../model/ContentPageDef';
 import { Blocks } from '../Blocks';
 import { ContentPage } from './ContentPage';
 import { normalizePage } from './normalizePage';
-
-import data from './ContentPage.page.json';
+import { useContentPageData } from './useContentPageData';
 
 const blockDecorator: BlockDecorator = ({ blockClassName, block, render }, i) => (
   <div
@@ -28,23 +28,31 @@ const blockDecorator: BlockDecorator = ({ blockClassName, block, render }, i) =>
 );
 
 export default {
-  default: (
-    <ContentPage
-      className="bg-main"
-      context={context}
-      blocksRegistry={Blocks}
-      data={normalizePage(Blocks)(data as ContentPageDef)}
-    />
-  ),
-  editor: (
-    <div style={{ background: "url('grid.svg')", height: '100%' }}>
+  default: () => {
+    const data = useContentPageData(Blocks);
+
+    return (
       <ContentPage
-        className="bg-transparent"
+        className="bg-main"
         context={context}
         blocksRegistry={Blocks}
         data={normalizePage(Blocks)(data as ContentPageDef)}
-        blockDecorator={blockDecorator}
       />
-    </div>
-  ),
+    );
+  },
+  editor: () => {
+    const data = useContentPageData(Blocks);
+
+    return (
+      <div style={{ background: "url('grid.svg')", height: '100%' }}>
+        <ContentPage
+          className="bg-transparent"
+          context={context}
+          blocksRegistry={Blocks}
+          data={normalizePage(Blocks)(data as ContentPageDef)}
+          blockDecorator={blockDecorator}
+        />
+      </div>
+    );
+  },
 };