@redneckz/wildless-cms-uni-blocks 0.2.53 → 0.2.56

package/src/BaseTile.tsx

@@ -0,0 +1,87 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { Img } from './Img';
+import type { BlockVersion, Picture, UniBlockProps } from './types';
+import { BlockItem } from './ui-kit/BlockItem';
+import type { ButtonProps } from './ui-kit/Button';
+import { Button } from './ui-kit/Button';
+import { useLink } from './useLink';
+
+export interface BaseTileContent {
+  title?: string;
+  description?: string;
+  image?: Picture;
+  items?: string[];
+  buttons?: ButtonProps[];
+  version?: BlockVersion;
+}
+
+export interface BaseTileProps extends BaseTileContent, UniBlockProps {}
+const TITLE_CLASSES = 'font-medium m-0 mb-4 whitespace-pre-wrap max-w-[600px]';
+
+export const BaseTile = JSX<BaseTileProps>(
+  ({
+    className,
+    context,
+    title,
+    description,
+    children,
+    buttons,
+    image,
+    items,
+    version = 'primary',
+  }) => {
+    const router = context.useRouter();
+    const { handlerDecorator } = context;
+    return (
+      <div className={`font-sans flex flex-col grow h-full`}>
+        {title && renderTitle(title, className)}
+        <div className="flex grow justify-between mt-4">
+          <div className="flex flex-col justify-between items-start">
+            <div>
+              {description ? (
+                <div className="font-normal text-base max-w-[600px] mb-6">{description}</div>
+              ) : null}
+              {children}
+              {items?.length ? renderItems(items, version) : null}
+            </div>
+            {buttons?.length ? (
+              <div className="flex mt-6 gap-4">
+                {buttons.map((button, index) =>
+                  renderButton(useLink({ router, handlerDecorator }, button), index),
+                )}
+              </div>
+            ) : null}
+          </div>
+          {image?.src && <Img className="mt-auto" image={image} />}
+        </div>
+      </div>
+    );
+  },
+);
+
+function renderTitle(title: string, className: string = '') {
+  const colSpanPrefix = 'col-span-';
+  const colSpanStr = className.split(/\s+/).find((_) => _.startsWith(colSpanPrefix));
+  const colSpan = colSpanStr ? parseInt(colSpanStr.substring(colSpanPrefix.length), 10) : 12;
+  if (colSpan <= 4) {
+    return <h3 className={`${TITLE_CLASSES} text-title-xs`}>{title}</h3>;
+  } else if (colSpan <= 8) {
+    return <h3 className={`${TITLE_CLASSES} text-title-sm`}>{title}</h3>;
+  } else {
+    return <h2 className={`${TITLE_CLASSES} text-title`}>{title}</h2>;
+  }
+}
+
+function renderItems(items: string[] = [], version?: BlockVersion) {
+  return (
+    <section className="max-w-[600px]" role="list">
+      {items.map((_, i) => (
+        <BlockItem key={String(i)} className={i ? 'mt-2.5' : ''} text={_} version={version} />
+      ))}
+    </section>
+  );
+}
+
+function renderButton(button: ButtonProps, i: number) {
+  return button?.text ? <Button key={String(i)} {...button} version={button.version} /> : null;
+}

package/src/Blocks.ts

@@ -9,7 +9,8 @@ import { ProductBlockInnerContent } from './ProductBlockInner';
 import { ProductGallery, ProductGalleryContent } from './ProductGallery';
 import { StepsBlock, StepsBlockContent } from './StepsBlock';
 import { ProductTile, ProductTileContent } from './ProductTile';
-import { Tile, TileContent } from './Tile';
+import { BaseTileContent } from './BaseTile';
+import { Tile } from './Tile';
 
 export const Blocks = {
   Header,
@@ -29,7 +30,7 @@ export type BlockContent =
   | HeaderContent
   | FooterContent
   | PlaceholderContent
-  | TileContent
+  | BaseTileContent
   | ProductTileContent
   | ProductBlockInnerContent
   | StepsBlockContent

package/src/ContentPage.fixture.tsx

@@ -1,6 +1,12 @@
 import { context } from './setup-fixture';
 
+import { Blocks } from './Blocks';
+import { toMobilePage } from './content-page-repository/toMobilePage';
 import { BlockDecorator, ContentPage } from './ContentPage';
+import { MobileBlocks } from './MobileBlocks';
+import type { ContentPageDef } from './types';
+
+const data = require('./ContentPage.page.json');
 
 const blockDecorator: BlockDecorator = ({ blockClassName, block, render }, i) => (
   <div
@@ -23,14 +29,28 @@ const blockDecorator: BlockDecorator = ({ blockClassName, block, render }, i) =>
 
 export default {
   default: (
-    <ContentPage context={context} className="bg-main" data={require('./ContentPage.page.json')} />
+    <ContentPage
+      className="bg-main"
+      context={context}
+      blocksRegistry={Blocks}
+      data={data as ContentPageDef}
+    />
+  ),
+  mobile: (
+    <ContentPage
+      className="bg-secondary-text"
+      context={context}
+      blocksRegistry={MobileBlocks}
+      data={toMobilePage(data as ContentPageDef)}
+    />
   ),
   editor: (
     <div style={{ background: "url('grid.svg')", height: '100%' }}>
       <ContentPage
-        context={context}
         className="bg-transparent"
-        data={require('./ContentPage.page.json')}
+        context={context}
+        blocksRegistry={Blocks}
+        data={data as ContentPageDef}
         blockDecorator={blockDecorator}
       />
     </div>

package/src/ContentPage.page.json

@@ -42,7 +42,6 @@
             },
             "productBlock": {
               "title": "Ставка от 12,5% годовых на срок до 5 лет!»",
-              "description": "Кредит наличными без залога и поручительства. Потребительский кредит на любые цели. Нужен только паспорт.",
               "items": [
                 "Потребительский кредит по специальной процентной ставке",
                 "Получите деньги без залога и поручительства",
@@ -62,8 +61,8 @@
                 "format": "webp",
                 "alt": "Кредит наличными",
                 "size": {
-                  "width": 220,
-                  "height": 220
+                  "width": 280,
+                  "height": 280
                 }
               }
             }
@@ -94,8 +93,8 @@
                 "title": "Рабочий",
                 "format": "webp",
                 "size": {
-                  "width": 220,
-                  "height": 220
+                  "width": 280,
+                  "height": 280
                 }
               }
             }
@@ -126,8 +125,8 @@
                 "title": "Кредитка",
                 "format": "webp",
                 "size": {
-                  "width": 220,
-                  "height": 220
+                  "width": 280,
+                  "height": 280
                 }
               }
             }
@@ -158,8 +157,8 @@
                 "title": "Кредитка",
                 "format": "webp",
                 "size": {
-                  "width": 220,
-                  "height": 220
+                  "width": 280,
+                  "height": 280
                 }
               }
             }
@@ -177,11 +176,13 @@
           "Кредиты наличными на любые цели",
           "Получите деньги без залога и поручителей"
         ],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credit-cards",
-          "version": "secondary"
-        },
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credit-cards",
+            "version": "secondary"
+          }
+        ],
         "image": {
           "src": "money-1.png",
           "title": "деньги",
@@ -191,6 +192,9 @@
             "height": 220
           }
         }
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -200,12 +204,17 @@
       "content": {
         "title": "Ипотека",
         "description": "Широкий выбор ипотечных программ с государственной поддержкой. Специальный предложения от 12,2 %",
-        "button": {
-          "text": "Подробнее",
-          "href": "/credits",
-          "version": "secondary"
-        },
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credits",
+            "version": "secondary"
+          }
+        ],
         "promo": true
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -214,11 +223,13 @@
       "content": {
         "title": "Банковские пластиковые карты",
         "items": ["Счета в разных валютах", "Бесплатное обслуживание", "Кэшбэк до 15% от покупок"],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credits",
-          "version": "secondary"
-        },
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credits",
+            "version": "secondary"
+          }
+        ],
         "image": {
           "src": "credit-card-1.png",
           "title": "Кредитка",
@@ -228,6 +239,9 @@
             "height": 220
           }
         }
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -236,11 +250,13 @@
       "content": {
         "title": "Премиальные продукты",
         "description": "Выделенные зоны обслуживания и персональный финансовый консультант. Полный спектр премиальных продуктов, подчеркивающих ваш статус",
-        "button": {
-          "text": "Подробнее",
-          "href": "/credits",
-          "version": "secondary"
-        },
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credits",
+            "version": "secondary"
+          }
+        ],
         "image": {
           "src": "column-1.png",
           "alt": "Column",
@@ -250,6 +266,9 @@
             "height": 220
           }
         }
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -263,11 +282,13 @@
           "Площадки для создания комфортной жизни за городом",
           "Подробная база вакансий для жителей сельской местности"
         ],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credits",
-          "version": "secondary"
-        },
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credits",
+            "version": "secondary"
+          }
+        ],
         "image": {
           "src": "globe-1.png",
           "title": "Глобус",
@@ -285,11 +306,16 @@
       "content": {
         "title": "Драгоценные металлы",
         "items": ["Счета в драгоценных металлах", "Слитки  и монеты из драгоценных металлов"],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credits",
-          "version": "secondary"
-        }
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credits",
+            "version": "secondary"
+          }
+        ]
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -298,11 +324,16 @@
       "content": {
         "title": "Банковские ячейки",
         "items": ["Полная конфиденциальность", "Разный размер ячеек", "Оформление доверенностей"],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credits",
-          "version": "secondary"
-        }
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credits",
+            "version": "secondary"
+          }
+        ]
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -315,11 +346,16 @@
           "Минимальная сумма вклада  от 3000 Р",
           "Минимальный срок вклада от 1 месяца"
         ],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credits",
-          "version": "secondary"
-        }
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credits",
+            "version": "secondary"
+          }
+        ]
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -329,16 +365,24 @@
         "title": "Акции и спецпредложения",
         "version": "secondary",
         "description": "Пенсионный кредит по специальной процентной ставке",
-        "button": {
-          "text": "Все акции",
-          "href": "/credits",
-          "version": "secondary"
-        }
+        "buttons": [
+          {
+            "text": "Все акции",
+            "href": "/credits",
+            "version": "secondary"
+          }
+        ]
+      },
+      "mobile": {
+        "hidden": true
       }
     },
     {
       "type": "ExchangeRateTile",
-      "style": ["col-span-4"]
+      "style": ["col-span-4"],
+      "mobile": {
+        "style": ["col-span-12"]
+      }
     },
     {
       "type": "MobileAppTile",
@@ -348,6 +392,9 @@
           "href": "https://rshbnaturaldbo.onelink.me/qhkF/f182074f?af_qr=true",
           "src": "data:image/png;base64,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"
         }
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -357,6 +404,67 @@
         "title": "Неизвестный блок"
       }
     },
+    {
+      "type": "ProductBlock",
+      "style": ["col-span-12"],
+      "content": {
+        "title": "Потребительский кредит наличными",
+        "description": "Кредит наличными без залога и поручительства. Потребительский кредит на любые цели. Нужен только паспорт.",
+        "breadcrumbs": [
+          {
+            "text": "Главная",
+            "href": "/"
+          },
+          {
+            "text": "Кредитные карты",
+            "href": "/credit"
+          },
+          {
+            "text": "Кредитная карта Своя Union Pay"
+          }
+        ],
+        "benefits": [
+          {
+            "label": "До 5 млн ₽",
+            "description": "Кредитный лимит",
+            "icon": "EmptyWalletIcon"
+          },
+          {
+            "label": "От 16,9%",
+            "description": "Ставка по кредиту",
+            "icon": "PercentageSquareIcon"
+          },
+          {
+            "label": "До 5 лет",
+            "description": "Срок кредитования",
+            "icon": "CalendarIcon"
+          }
+        ],
+        "buttons": [
+          {
+            "href": "https://rshb.ru",
+            "text": "Оформить карту",
+            "target": "_blank",
+            "version": "primary"
+          },
+          {
+            "href": "https://rshb.ru",
+            "text": "Подробнее",
+            "target": "_blank",
+            "version": "secondary"
+          }
+        ],
+        "image": {
+          "src": "money-1.png",
+          "alt": "Кредиты в РСХБ",
+          "format": "webp",
+          "size": {
+            "width": 280,
+            "height": 280
+          }
+        }
+      }
+    },
     {
       "type": "ProductTile",
       "style": ["col-span-6"],
@@ -377,11 +485,13 @@
             "description": "до 5 лет"
           }
         ],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credit-cards",
-          "version": "secondary"
-        },
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credit-cards",
+            "version": "secondary"
+          }
+        ],
         "image": {
           "src": "card-with-diamond.png",
           "alt": "Кредиты в РСХБ",
@@ -391,6 +501,9 @@
             "height": 220
           }
         }
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -413,12 +526,14 @@
             "description": "до 3 лет"
           }
         ],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credit-cards",
-          "target": "_blank",
-          "version": "secondary"
-        },
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credit-cards",
+            "target": "_blank",
+            "version": "secondary"
+          }
+        ],
         "image": {
           "src": "letter-with-money.png",
           "alt": "Пенсионный кредит в РСХБ",
@@ -428,6 +543,9 @@
             "height": 220
           }
         }
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -450,12 +568,14 @@
             "description": "до 10 лет"
           }
         ],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credit-cards",
-          "target": "_blank",
-          "version": "secondary"
-        },
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credit-cards",
+            "target": "_blank",
+            "version": "secondary"
+          }
+        ],
         "image": {
           "src": "building.png",
           "alt": "Кредит под залог недвижимости в РСХБ",
@@ -465,6 +585,9 @@
             "height": 220
           }
         }
+      },
+      "mobile": {
+        "style": ["col-span-12"]
       }
     },
     {
@@ -488,14 +611,69 @@
             "description": "до 150 лет"
           }
         ],
-        "button": {
-          "text": "Подробнее",
-          "href": "/credit-cards",
-          "target": "_blank",
-          "version": "secondary"
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credit-cards",
+            "target": "_blank",
+            "version": "secondary"
+          }
+        ]
+      },
+      "mobile": {
+        "style": ["col-span-12"]
+      }
+    },
+    {
+      "type": "Tile",
+      "style": ["col-span-12"],
+      "content": {
+        "title": "Рефинансирование кредитов",
+        "items": [
+          "Без справок и документов из других банков",
+          "Погашение ранее взятых кредитов в любых банках",
+          "Рефинансировать можно  кредит физического лица, кредитную карту, микрозайм или ипотеку"
+        ],
+        "buttons": [
+          {
+            "text": "Подробнее",
+            "href": "/credit-cards",
+            "target": "_blank",
+            "version": "secondary"
+          }
+        ],
+        "image": {
+          "src": "money-2.png",
+          "title": "Деньги",
+          "format": "webp",
+          "size": {
+            "width": 200,
+            "height": 200
+          }
         }
       }
     },
+    {
+      "type": "StepsBlock",
+      "style": ["col-span-12"],
+      "content": {
+        "title": "Рассчитайте условия на онлайн-калькуляторе и оставьте заявку на потребительский кредит",
+        "steps": [
+          {
+            "label": "Заявка на кредит",
+            "description": "Оставьте онлайн-заявку на потребительский кредит"
+          },
+          {
+            "label": "В случае одобрения",
+            "description": "Менеджер свяжется с вами и согласует встречу"
+          },
+          {
+            "label": "Получение наличных",
+            "description": "Получите наличные в отделении банка"
+          }
+        ]
+      }
+    },
     {
       "type": "Footer",
       "style": ["col-span-12"],