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

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

@@ -0,0 +1,38 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { useActiveHandler } from './useActiveHandler';
+import type { UniBlockProps } from '../../types';
+import type { blockItemCommonProps } from './OtherProductsContent';
+import { Icon } from '../../ui-kit/Icon/Icon';
+import { OtherProductsItemInner } from './OtherProductsItemInner';
+
+export interface BlockItemProps extends blockItemCommonProps, UniBlockProps {}
+
+export const OtherProductsItem = JSX<BlockItemProps>(
+  ({ label, isExpanded, blocks, columns, context }) => {
+    const { hasContent, icon, handleToggle, isActive } = useActiveHandler({
+      context,
+      blocks,
+      initialState: isExpanded,
+    });
+
+    return (
+      <div className="border-0 border-b border-solid border-main-divider">
+        {hasContent ? (
+          <OtherProductsItemInner
+            isExpanded={isActive}
+            columns={columns}
+            blocks={blocks}
+            context={context}
+          />
+        ) : null}
+        <button
+          className="border-none bg-primary-main px-0 py-[25px] w-full font-sans text-white text-base flex justify-center cursor-pointer"
+          onClick={handleToggle}
+        >
+          <span className="pr-3">{isActive ? 'Скрыть' : label}</span>
+          {hasContent ? <Icon name={icon} width="20" height="20" asSVG /> : null}
+        </button>
+      </div>
+    );
+  },
+);

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

@@ -0,0 +1,14 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { BlockItemProps } from './OtherProductsItem';
+import { renderBlocksList } from '../../ui-kit/BlocksList/renderBlocksList';
+
+export const OtherProductsItemInner = JSX<BlockItemProps>(({ blocks, columns = 1, context }) => {
+  const className = 'box-border p-5';
+  return (
+    <div className="transition-all duration-300 max-h-0 overflow-hidden">
+      <div className={`box-border w-full p-9 ${columns > 1 ? 'flex flex-wrap' : ''}`}>
+        {renderBlocksList({ context, className, columns, blocks })}
+      </div>
+    </div>
+  );
+});

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

@@ -0,0 +1,24 @@
+import type { IconName } from '../../icons/IconName';
+import { ActiveHandler } from '../../ui-kit/BlocksList/BlocksListProps';
+
+export const useActiveHandler = ({ context, blocks, initialState = false }: ActiveHandler) => {
+  const [isActive, setIsActive] = context.useState(initialState);
+  const hasContent = blocks?.length;
+  const icon: IconName = isActive ? 'ArrowUpIcon' : 'ArrowDownIcon';
+
+  const getContentBlock = ({ currentTarget }) => currentTarget.previousSibling;
+
+  const handleToggle = (e: MouseEvent) => {
+    if (!hasContent) {
+      return;
+    }
+
+    setIsActive(!isActive);
+    const contentBlock = getContentBlock(e);
+    contentBlock.style.maxHeight = contentBlock.style.maxHeight
+      ? null
+      : `${contentBlock.scrollHeight}px`;
+  };
+
+  return { isActive, hasContent, icon, handleToggle };
+};

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

@@ -4,7 +4,8 @@
   "image": {
     "format": "webp",
     "size": {
-      "width": 300
+      "width": 234,
+      "height": 234
     }
   },
   "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"],

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

@@ -10,7 +10,8 @@
         "image": {
           "format": "webp",
           "size": {
-            "width": 280
+            "width": 234,
+            "height": 234
           }
         },
         "description": "Описание",

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

@@ -1,4 +1,5 @@
 {
+  "version": "primary",
   "title": "Шаги",
   "description": "Описание",
   "showLines": true,

package/mobile/src/components/TariffsTable/TariffsTable.tsx

@@ -18,7 +18,9 @@ export const TariffsTable = JSX<TariffsTableProps>(
     const tiles = getTiles(rowHeaders, colData);
 
     return (
-      <section className={`px-4 py-6 bg-white font-sans text-primary-text ${className}`}>
+      <section
+        className={`px-4 py-6 bg-white font-sans text-primary-text overflow-x-hidden ${className}`}
+      >
         {title ? (
           <Heading
             headingType="h2"

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

@@ -6,8 +6,8 @@
   "image": {
     "format": "webp",
     "size": {
-      "width": 48,
-      "height": 48
+      "width": 43,
+      "height": 43
     }
   }
 }

package/mobile/src/components/TextBlock/TextBlockContent.ts

@@ -1,7 +1,7 @@
 import type { Picture } from '../../model/Picture';
 
 /**
- * @title Цвет плитки
+ * @title Цвет блока
  * @enumNames ["Основная", "Второстепенная", "Второстепенная прозрачная"]
  */
 export type TextBlockVersion = 'primary' | 'secondary' | 'secondary-light';

package/mobile/src/content-page-repository/transformPicture.ts

@@ -13,8 +13,9 @@ export async function transformPicture(
   options: TransformationOptions,
 ): Promise<Picture> {
   const sources = picture.sources || [];
+  const src = picture?.src || '';
   const [transformedPicture, ...transformedSources] = await Promise.all(
-    [picture].concat(sources).map((_) => transformImg(pagePath, picture.src, { ...options, ..._ })),
+    [picture].concat(sources).map((_) => transformImg(pagePath, src, { ...options, ..._ })),
   );
   return {
     ...picture,

package/mobile/src/icons/ArrowDownIcon.svg

@@ -0,0 +1,4 @@
+<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.8416 10.709L11.6582 12.8923C11.0166 13.534 9.96657 13.534 9.3249 12.8923L3.8999 7.45898" stroke="white" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M17.1001 7.45898L16.2334 8.32565" stroke="white" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/mobile/src/icons/ArrowUpIcon.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.3416 9.29163L11.1582 7.10829C10.5166 6.46662 9.46657 6.46662 8.8249 7.10829L3.3999 12.5416" stroke="white" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16.6001 12.5416L15.7334 11.675" stroke="white" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/mobile/src/icons/IconName.ts

@@ -1,8 +1,13 @@
 
 // Generated. Do not touch
+/* eslint-disable max-lines */
 
 export enum IconMap {
-  ActualBalanceIcon = "ActualBalanceIcon", AppleIcon = "AppleIcon", ArrowsRewindRight = "ArrowsRewindRight", AtmIcon = "AtmIcon", BankIcon = "BankIcon", BurgerIcon = "BurgerIcon", BurgerIconWhite = "BurgerIconWhite", Calendar2Icon = "Calendar2Icon", CalendarCircleIcon = "CalendarCircleIcon", CalendarIcon = "CalendarIcon", CalendarTickIcon = "CalendarTickIcon", CalendarWhiteIcon = "CalendarWhiteIcon", CardIcon = "CardIcon", CardPosIcon = "CardPosIcon", CardTickIcon = "CardTickIcon", CardWithGemIcon = "CardWithGemIcon", ChartSquareIcon = "ChartSquareIcon", ClockIcon = "ClockIcon", CloseIcon = "CloseIcon", ComfortableCompIcon = "ComfortableCompIcon", CreditCardsIcon = "CreditCardsIcon", DiscountShapeIcon = "DiscountShapeIcon", DocIcon = "DocIcon", DocIconMonoColor = "DocIconMonoColor", DocumentTextIcon = "DocumentTextIcon", DollarIcon = "DollarIcon", EarthIcon = "EarthIcon", EmptyWalletChangeIcon = "EmptyWalletChangeIcon", EmptyWalletIcon = "EmptyWalletIcon", EmptyWalletWhiteIcon = "EmptyWalletWhiteIcon", EuroIcon = "EuroIcon", GeolocationIcon = "GeolocationIcon", GlassIcon = "GlassIcon", GlobalIcon = "GlobalIcon", GpsIcon = "GpsIcon", GridIcon = "GridIcon", GridIconWhite = "GridIconWhite", InterestGrowthIcon = "InterestGrowthIcon", InterestIcon = "InterestIcon", JCBIcon = "JCBIcon", LoupeIcon = "LoupeIcon", MasterCardIcon = "MasterCardIcon", MinusIcon = "MinusIcon", MirIcon = "MirIcon", MoneyIcon = "MoneyIcon", MoneyInsuranceIcon = "MoneyInsuranceIcon", MonitorMobileIcon = "MonitorMobileIcon", NewDocIcon = "NewDocIcon", OfficeIcon = "OfficeIcon", OkIcon = "OkIcon", PassSendIcon = "PassSendIcon", PercentageRoundIcon = "PercentageRoundIcon", PercentageSquareIcon = "PercentageSquareIcon", PercentageSquareWhiteIcon = "PercentageSquareWhiteIcon", PersonalCardIcon = "PersonalCardIcon", PlayMarketIcon = "PlayMarketIcon", PlusIcon = "PlusIcon", Profile2UserIcon = "Profile2UserIcon", ProfileIcon = "ProfileIcon", RoundRubleIcon = "RoundRubleIcon", SafeIcon = "SafeIcon", ShieldTickIcon = "ShieldTickIcon", SignDocsIcon = "SignDocsIcon", SmallClockIcon = "SmallClockIcon", TelegramIcon = "TelegramIcon", UnionPayIcon = "UnionPayIcon", UserTickIcon = "UserTickIcon", VisaIcon = "VisaIcon", VKIcon = "VKIcon", WalletAdd2Icon = "WalletAdd2Icon", WalletAddIcon = "WalletAddIcon", WalletIcon = "WalletIcon", WalletWithMoneyIcon = "WalletWithMoneyIcon"
+  ActualBalanceIcon = "ActualBalanceIcon", AppleIcon = "AppleIcon", ArrowDownIcon = "ArrowDownIcon", ArrowsRewindRight = "ArrowsRewindRight", ArrowUpIcon = "ArrowUpIcon", AtmIcon = "AtmIcon", BankIcon = "BankIcon", BurgerIcon = "BurgerIcon", BurgerIconWhite = "BurgerIconWhite", Calendar2Icon = "Calendar2Icon", CalendarCircleIcon = "CalendarCircleIcon", CalendarIcon = "CalendarIcon", CalendarTickIcon = "CalendarTickIcon", CalendarWhiteIcon = "CalendarWhiteIcon", CardIcon = "CardIcon", CardPosIcon = "CardPosIcon", CardTickIcon = "CardTickIcon", CardWithGemIcon = "CardWithGemIcon", ChartSquareIcon = "ChartSquareIcon", ClockIcon = "ClockIcon", CloseIcon = "CloseIcon", ComfortableCompIcon = "ComfortableCompIcon", CreditCardsIcon = "CreditCardsIcon", DiscountShapeIcon = "DiscountShapeIcon", DocIcon = "DocIcon", DocIconMonoColor = "DocIconMonoColor", DocumentTextIcon = "DocumentTextIcon", DollarIcon = "DollarIcon", EarthIcon = "EarthIcon", EmptyWalletChangeIcon = "EmptyWalletChangeIcon", EmptyWalletIcon = "EmptyWalletIcon", EmptyWalletWhiteIcon = "EmptyWalletWhiteIcon", EuroIcon = "EuroIcon", GeolocationIcon = "GeolocationIcon", GlassIcon = "GlassIcon", GlobalIcon = "GlobalIcon", GpsIcon = "GpsIcon", GridIcon = "GridIcon", GridIconWhite = "GridIconWhite", InterestGrowthIcon = "InterestGrowthIcon", InterestIcon = "InterestIcon", JCBIcon = "JCBIcon", LoupeIcon = "LoupeIcon", MasterCardIcon = "MasterCardIcon", MinusIcon = "MinusIcon", MirIcon = "MirIcon", MoneyIcon = "MoneyIcon", MoneyInsuranceIcon = "MoneyInsuranceIcon", MonitorMobileIcon = "MonitorMobileIcon", NewDocIcon = "NewDocIcon", OfficeIcon = "OfficeIcon", OkIcon = "OkIcon", PassSendIcon = "PassSendIcon", PercentageRoundIcon = "PercentageRoundIcon", PercentageSquareIcon = "PercentageSquareIcon", PercentageSquareWhiteIcon = "PercentageSquareWhiteIcon", PersonalCardIcon = "PersonalCardIcon", PlayMarketIcon = "PlayMarketIcon", PlusIcon = "PlusIcon", Profile2UserIcon = "Profile2UserIcon", ProfileIcon = "ProfileIcon", RoundRubleIcon = "RoundRubleIcon", SafeIcon = "SafeIcon", ShieldTickIcon = "ShieldTickIcon", SignDocsIcon = "SignDocsIcon", SmallClockIcon = "SmallClockIcon", TelegramIcon = "TelegramIcon", UnionPayIcon = "UnionPayIcon", UserTickIcon = "UserTickIcon", VisaIcon = "VisaIcon", VKIcon = "VKIcon", WalletAdd2Icon = "WalletAdd2Icon", WalletAddIcon = "WalletAddIcon", WalletIcon = "WalletIcon", WalletWithMoneyIcon = "WalletWithMoneyIcon"
+}
+
+export enum IconTitleMap {
+  ActualBalanceIcon = "Деньги", AppleIcon = "Лого «Apple»", ArrowDownIcon = "ArrowDownIcon", ArrowsRewindRight = "ArrowsRewindRight", ArrowUpIcon = "ArrowUpIcon", AtmIcon = "Банкомат", BankIcon = "Банк", BurgerIcon = "Бургер", BurgerIconWhite = "Бургер (белый)", Calendar2Icon = "Календарь 2", CalendarCircleIcon = "Скруглённый календарь", CalendarIcon = "Календарь", CalendarTickIcon = "Календарь с галочкой", CalendarWhiteIcon = "Календарь белый", CardIcon = "Кред. карта", CardPosIcon = "Кред. карта под наклоном", CardTickIcon = "Кред. карта с галочкой", CardWithGemIcon = "Карта с драгоценностями", ChartSquareIcon = "Деньги внутри кошелька", ClockIcon = "Часы", CloseIcon = "Крестик", ComfortableCompIcon = "Кресло", CreditCardsIcon = "Кредитные карты", DiscountShapeIcon = "Скидка", DocIcon = "Документ", DocIconMonoColor = "Документ (одноцветный)", DocumentTextIcon = "Документ с текстом", DollarIcon = "Доллар", EarthIcon = "Земля", EmptyWalletChangeIcon = "Пустой кошелёк с возвратом", EmptyWalletIcon = "Пустой кошелёк", EmptyWalletWhiteIcon = "Пустой кошелёк (белый)", EuroIcon = "Евро", GeolocationIcon = "Геолокация", GlassIcon = "Зеркало", GlobalIcon = "Глобус", GpsIcon = "Gps", GridIcon = "Сетка", GridIconWhite = "Сетка (белая)", InterestGrowthIcon = "Диаграмма роста", InterestIcon = "Скидка", JCBIcon = "JCB", LoupeIcon = "Лупа", MasterCardIcon = "MasterCard", MinusIcon = "Минус", MirIcon = "МИР", MoneyIcon = "Деньги", MoneyInsuranceIcon = "Денежное страхование", MonitorMobileIcon = "Монитор и мобильный", NewDocIcon = "Новый документ", OfficeIcon = "Офис", OkIcon = "Лого «Одноклассники»", PassSendIcon = "Бизнес", PercentageRoundIcon = "Проценты (круг.)", PercentageSquareIcon = "Проценты", PercentageSquareWhiteIcon = "Проценты белые", PersonalCardIcon = "Персональная карта", PlayMarketIcon = "Лого «PlayMarket»", PlusIcon = "Плюс", Profile2UserIcon = "Профиль, 2 персоны", ProfileIcon = "Профиль", RoundRubleIcon = "Рубль (круг.)", SafeIcon = "Сейф", ShieldTickIcon = "Безопасность", SignDocsIcon = "Подписанные документы", SmallClockIcon = "Маленькие часы", TelegramIcon = "Лого «Telegram»", UnionPayIcon = "UnionPay", UserTickIcon = "Пользователь", VisaIcon = "Visa", VKIcon = "Лого «VK»", WalletAdd2Icon = "Пополнение карты", WalletAddIcon = "Кошелёк с плюсом", WalletIcon = "Кошелёк", WalletWithMoneyIcon = "Кошелёк с деньгами"
 }
 
 /**
@@ -10,7 +15,7 @@ export enum IconMap {
  * @title Иконка
  * @enumNames [
  *   "",
- *   "Деньги", "Лого «Apple»", "ArrowsRewindRight", "Банкомат", "Банк", "Бургер", "Бургер (белый)", "Календарь 2", "Скруглённый календарь", "Календарь", "Календарь с галочкой", "Календарь белый", "Кред. карта", "Кред. карта под наклоном", "Кред. карта с галочкой", "Карта с драгоценностями", "Деньги внутри кошелька", "Часы", "Крестик", "Кресло", "Кредитные карты", "Скидка", "Документ", "Документ (одноцветный)", "Документ с текстом", "Доллар", "Земля", "Пустой кошелёк с возвратом", "Пустой кошелёк", "Пустой кошелёк (белый)", "Евро", "Геолокация", "Зеркало", "Глобус", "Gps", "Сетка", "Сетка (белая)", "Диаграмма роста", "Скидка", "JCB", "Лупа", "MasterCard", "Минус", "МИР", "Деньги", "Денежное страхование", "Монитор и мобильный", "Новый документ", "Офис", "Лого «Одноклассники»", "Бизнес", "Проценты (круг.)", "Проценты", "Проценты белые", "Персональная карта", "Лого «PlayMarket»", "Плюс", "Профиль, 2 персоны", "Профиль", "Рубль (круг.)", "Сейф", "Безопасность", "Подписанные документы", "Маленькие часы", "Лого «Telegram»", "UnionPay", "Пользователь", "Visa", "Лого «VK»", "Пополнение карты", "Кошелёк с плюсом", "Кошелёк", "Кошелёк с деньгами"
+ *   "Деньги", "Лого «Apple»", "ArrowDownIcon", "ArrowsRewindRight", "ArrowUpIcon", "Банкомат", "Банк", "Бургер", "Бургер (белый)", "Календарь 2", "Скруглённый календарь", "Календарь", "Календарь с галочкой", "Календарь белый", "Кред. карта", "Кред. карта под наклоном", "Кред. карта с галочкой", "Карта с драгоценностями", "Деньги внутри кошелька", "Часы", "Крестик", "Кресло", "Кредитные карты", "Скидка", "Документ", "Документ (одноцветный)", "Документ с текстом", "Доллар", "Земля", "Пустой кошелёк с возвратом", "Пустой кошелёк", "Пустой кошелёк (белый)", "Евро", "Геолокация", "Зеркало", "Глобус", "Gps", "Сетка", "Сетка (белая)", "Диаграмма роста", "Скидка", "JCB", "Лупа", "MasterCard", "Минус", "МИР", "Деньги", "Денежное страхование", "Монитор и мобильный", "Новый документ", "Офис", "Лого «Одноклассники»", "Бизнес", "Проценты (круг.)", "Проценты", "Проценты белые", "Персональная карта", "Лого «PlayMarket»", "Плюс", "Профиль, 2 персоны", "Профиль", "Рубль (круг.)", "Сейф", "Безопасность", "Подписанные документы", "Маленькие часы", "Лого «Telegram»", "UnionPay", "Пользователь", "Visa", "Лого «VK»", "Пополнение карты", "Кошелёк с плюсом", "Кошелёк", "Кошелёк с деньгами"
  * ]
  */
-export type IconName = "" | "ActualBalanceIcon" | "AppleIcon" | "ArrowsRewindRight" | "AtmIcon" | "BankIcon" | "BurgerIcon" | "BurgerIconWhite" | "Calendar2Icon" | "CalendarCircleIcon" | "CalendarIcon" | "CalendarTickIcon" | "CalendarWhiteIcon" | "CardIcon" | "CardPosIcon" | "CardTickIcon" | "CardWithGemIcon" | "ChartSquareIcon" | "ClockIcon" | "CloseIcon" | "ComfortableCompIcon" | "CreditCardsIcon" | "DiscountShapeIcon" | "DocIcon" | "DocIconMonoColor" | "DocumentTextIcon" | "DollarIcon" | "EarthIcon" | "EmptyWalletChangeIcon" | "EmptyWalletIcon" | "EmptyWalletWhiteIcon" | "EuroIcon" | "GeolocationIcon" | "GlassIcon" | "GlobalIcon" | "GpsIcon" | "GridIcon" | "GridIconWhite" | "InterestGrowthIcon" | "InterestIcon" | "JCBIcon" | "LoupeIcon" | "MasterCardIcon" | "MinusIcon" | "MirIcon" | "MoneyIcon" | "MoneyInsuranceIcon" | "MonitorMobileIcon" | "NewDocIcon" | "OfficeIcon" | "OkIcon" | "PassSendIcon" | "PercentageRoundIcon" | "PercentageSquareIcon" | "PercentageSquareWhiteIcon" | "PersonalCardIcon" | "PlayMarketIcon" | "PlusIcon" | "Profile2UserIcon" | "ProfileIcon" | "RoundRubleIcon" | "SafeIcon" | "ShieldTickIcon" | "SignDocsIcon" | "SmallClockIcon" | "TelegramIcon" | "UnionPayIcon" | "UserTickIcon" | "VisaIcon" | "VKIcon" | "WalletAdd2Icon" | "WalletAddIcon" | "WalletIcon" | "WalletWithMoneyIcon";
+export type IconName = "" | "ActualBalanceIcon" | "AppleIcon" | "ArrowDownIcon" | "ArrowsRewindRight" | "ArrowUpIcon" | "AtmIcon" | "BankIcon" | "BurgerIcon" | "BurgerIconWhite" | "Calendar2Icon" | "CalendarCircleIcon" | "CalendarIcon" | "CalendarTickIcon" | "CalendarWhiteIcon" | "CardIcon" | "CardPosIcon" | "CardTickIcon" | "CardWithGemIcon" | "ChartSquareIcon" | "ClockIcon" | "CloseIcon" | "ComfortableCompIcon" | "CreditCardsIcon" | "DiscountShapeIcon" | "DocIcon" | "DocIconMonoColor" | "DocumentTextIcon" | "DollarIcon" | "EarthIcon" | "EmptyWalletChangeIcon" | "EmptyWalletIcon" | "EmptyWalletWhiteIcon" | "EuroIcon" | "GeolocationIcon" | "GlassIcon" | "GlobalIcon" | "GpsIcon" | "GridIcon" | "GridIconWhite" | "InterestGrowthIcon" | "InterestIcon" | "JCBIcon" | "LoupeIcon" | "MasterCardIcon" | "MinusIcon" | "MirIcon" | "MoneyIcon" | "MoneyInsuranceIcon" | "MonitorMobileIcon" | "NewDocIcon" | "OfficeIcon" | "OkIcon" | "PassSendIcon" | "PercentageRoundIcon" | "PercentageSquareIcon" | "PercentageSquareWhiteIcon" | "PersonalCardIcon" | "PlayMarketIcon" | "PlusIcon" | "Profile2UserIcon" | "ProfileIcon" | "RoundRubleIcon" | "SafeIcon" | "ShieldTickIcon" | "SignDocsIcon" | "SmallClockIcon" | "TelegramIcon" | "UnionPayIcon" | "UserTickIcon" | "VisaIcon" | "VKIcon" | "WalletAdd2Icon" | "WalletAddIcon" | "WalletIcon" | "WalletWithMoneyIcon";

package/mobile/src/model/BlockVersion.ts

@@ -6,6 +6,6 @@ export type BlockVersion = 'primary' | 'secondary';
 
 /**
  * @title Цвет блока
- * @enumNames ["Прозрачная", Основная", "Второстепенная"]
+ * @enumNames ["Прозрачная", "Основная", "Второстепенная"]
  */
 export type BlockVersionWithTransparent = 'transparent' | 'primary' | 'secondary';

package/mobile/src/model/Picture.ts

@@ -1,6 +1,6 @@
 export interface Img {
   /** @title Картинка */
-  src: string;
+  src?: string;
   /** @title Альтернативный текст (alt) */
   alt?: string;
   /** @title Текст подсказки (title) */
@@ -9,7 +9,7 @@ export interface Img {
 
 export interface ImgSource {
   /** @title Картинка */
-  src: string;
+  src?: string;
   /** @title Формат */
   format?: 'jpeg' | 'jpg' | 'png' | 'gif' | 'webp' | 'heif' | 'avif';
   /** @hidden */

package/mobile/src/ui-kit/BlocksList/BlocksListProps.ts

@@ -0,0 +1,104 @@
+import type { GalleryContent } from '../../components/Gallery/GalleryContent';
+import type { HeadlineContent } from '../../components/Headline/HeadlineContent';
+import type { LinkDocsContent } from '../../components/LinkDocs/LinkDocsContent';
+import type { MiniGalleryContent } from '../../components/MiniGallery/MiniGalleryContent';
+import type { PictureTextContent } from '../../components/PictureText/PictureTextContent';
+import type { ProductBlockContent } from '../../components/ProductBlock/ProductBlockContent';
+import type { ProductTileContent } from '../../components/ProductTile/ProductTileContent';
+import type { TextBlockContent } from '../../components/TextBlock/TextBlockContent';
+import type { TileContent } from '../../components/Tile/TileContent';
+import type { LinkListContent } from '../../components/LinkList/LinkListContent';
+import { ContentPageContext } from '../../components/ContentPage/ContentPageContext';
+
+export interface ActiveHandler {
+  context: ContentPageContext;
+  blocks?: BlockDef[];
+  initialState?: boolean;
+}
+
+/**
+ * @title Количество колонок
+ * @enumNames ["1 колонка", "2 колонки"]
+ */
+export type ColumnsCount = 1 | 2;
+
+/**
+ * @title Заголовок
+ * @default {"blockListType": "Headline"}
+ */
+export type HeadlineBlockListDef = HeadlineContent & { blockListType: 'Headline' };
+
+/**
+ * @title Список документов
+ * @default {"blockListType": "LinkDocs"}
+ */
+export type LinkDocsBlockListDef = LinkDocsContent & { blockListType: 'LinkDocs' };
+
+/**
+ * @title Текстовый блок
+ * @default {"blockListType": "TextBlock"}
+ */
+export type TextBlockBlockListDef = TextBlockContent & { blockListType: 'TextBlock' };
+
+/**
+ * @title Картинка с текстом
+ * @default {"blockListType": "PictureText"}
+ */
+export type PictureTextBlockListDef = PictureTextContent & { blockListType: 'PictureText' };
+
+/**
+ * @title Продуктовый блок
+ * @default {"blockListType": "ProductBlock"}
+ */
+export type ProductBlockBlockListDef = ProductBlockContent & { blockListType: 'ProductBlock' };
+
+/**
+ * @title Плитка
+ * @default {"blockListType": "Tile"}
+ */
+export type TileBlockListDef = TileContent & { blockListType: 'Tile' };
+
+/**
+ * @title Продуктовая плитка
+ * @default {"blockListType": "ProductTile"}
+ */
+export type ProductTileBlockListDef = ProductTileContent & { blockListType: 'ProductTile' };
+
+/**
+ * @title Галлерея
+ * @default {"blockListType": "Gallery"}
+ */
+export type GalleryBlockListDef = GalleryContent & { blockListType: 'Gallery' };
+
+/**
+ * @title Мини-галлерея
+ * @default {"blockListType": "MiniGallery"}
+ */
+export type MiniGalleryBlockListDef = MiniGalleryContent & { blockListType: 'MiniGallery' };
+
+/**
+ * @title Список ссылок
+ * @default {"blockListType": "LinkList"}
+ */
+export type LinkListBlockListDef = LinkListContent & { blockListType: 'LinkList' };
+
+/**
+ * @title Выберите блок
+ */
+export type EmptyOption = null;
+
+/**
+ * @title Содержимое блока
+ */
+export type BlockDef =
+  | EmptyOption
+  | HeadlineBlockListDef
+  | LinkDocsBlockListDef
+  | TextBlockBlockListDef
+  | PictureTextBlockListDef
+  | ProductBlockBlockListDef
+  | TileBlockListDef
+  | ProductTileBlockListDef
+  | GalleryBlockListDef
+  | MiniGalleryBlockListDef
+  | LinkListBlockListDef;

package/mobile/src/ui-kit/BlocksList/EmbeddableBlocks.tsx

@@ -0,0 +1,23 @@
+import { Headline } from '../../components/Headline/Headline';
+import { LinkDocs } from '../../components/LinkDocs/LinkDocs';
+import { PictureText } from '../../components/PictureText/PictureText';
+import { ProductBlock } from '../../components/ProductBlock/ProductBlock';
+import { TextBlock } from '../../components/TextBlock/TextBlock';
+import { Tile } from '../../components/Tile/Tile';
+import { ProductTile } from '../../components/ProductTile/ProductTile';
+import { Gallery } from '../../components/Gallery/Gallery';
+import { MiniGallery } from '../../components/MiniGallery/MiniGallery';
+import { LinkList } from '../../components/LinkList/LinkList';
+
+export const EmbeddableBlocks = {
+  Headline,
+  LinkDocs,
+  TextBlock,
+  PictureText,
+  ProductBlock,
+  Tile,
+  ProductTile,
+  Gallery,
+  MiniGallery,
+  LinkList,
+};

package/mobile/src/ui-kit/BlocksList/renderBlocksList.tsx

@@ -0,0 +1,38 @@
+import type { JSXBlock } from '../../components/ContentPage/ContentPage';
+import type { ContentPageContext } from '../../components/ContentPage/ContentPageContext';
+import type { BlockDef, ColumnsCount } from './BlocksListProps';
+import { EmbeddableBlocks } from './EmbeddableBlocks';
+import { BlockVersion } from '../../model/BlockVersion';
+
+type EmbeddableBlocksProps = {
+  blocks?: BlockDef[];
+  context: ContentPageContext;
+  columns?: ColumnsCount;
+  className?: string;
+  version?: BlockVersion;
+};
+
+export const renderBlocksList = ({
+  blocks,
+  context,
+  className,
+  columns,
+  version,
+}: EmbeddableBlocksProps) =>
+  blocks?.length ? blocks.map(renderBlock({ context, className, columns, version })) : null;
+
+export const renderBlock =
+  ({ context, columns, className, version }: EmbeddableBlocksProps) =>
+  (block: BlockDef, i: number) => {
+    const type = block?.blockListType;
+    if (!type || !(type in EmbeddableBlocks)) {
+      return null;
+    }
+    const columnsCountClass = columns === 2 ? 'w-1/2' : '';
+    const EmbeddedBlock: JSXBlock = EmbeddableBlocks[type];
+    return (
+      <div className={`${className} ${columnsCountClass}`} key={`block_${i}`}>
+        <EmbeddedBlock context={context} {...block} blockVersion={version} className="!p-0" />
+      </div>
+    );
+  };

package/mobile/src/ui-kit/Icon/Icon.tsx

@@ -1,6 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { projectSettings } from '../../ProjectSettings';
 import type { IconColor, IconProps } from './IconProps';
+import { IconTitleMap } from '../../icons/IconName';
 
 const svgColorsMap: Record<IconColor, string> = {
   none: '',
@@ -11,7 +12,7 @@ export const Icon = JSX<IconProps>(
   ({
     className = '',
     name,
-    alt = `Icon ${name}`,
+    alt = `Иконка ${IconTitleMap[name] || name}`,
     title = alt,
     asSVG,
     color = 'primary',

package/mobile/src/ui-kit/SearchBar/SearchBar.tsx

@@ -31,7 +31,7 @@ export const SearchBar = JSX<UniBlockProps>(({ className, context }) => {
         placeholder="some search"
       />
       <button
-        className="visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer"
+        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('');

package/package.json

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

package/src/components/Accordion/Accordion.example.json

@@ -5,12 +5,12 @@
       "label": "Аккордеон 1",
       "blocks": [
         {
-          "accordionBlockType": "TextBlock",
+          "blockListType": "TextBlock",
           "title": "Текстовый блок",
           "description": "Описание текстового блока"
         },
         {
-          "accordionBlockType": "TextBlock",
+          "blockListType": "TextBlock",
           "title": "Текстовый блок №2",
           "description": "Описание текстового блока №2"
         }
@@ -20,12 +20,12 @@
       "label": "Аккордеон 2",
       "blocks": [
         {
-          "accordionBlockType": "TextBlock",
+          "blockListType": "TextBlock",
           "title": "Текстовый блок",
           "description": "Описание текстового блока"
         },
         {
-          "accordionBlockType": "TextBlock",
+          "blockListType": "TextBlock",
           "title": "Текстовый блок №2",
           "description": "Описание текстового блока №2"
         }
@@ -35,12 +35,12 @@
       "label": "Аккордеон 3",
       "blocks": [
         {
-          "accordionBlockType": "TextBlock",
+          "blockListType": "TextBlock",
           "title": "Текстовый блок",
           "description": "Описание текстового блока"
         },
         {
-          "accordionBlockType": "TextBlock",
+          "blockListType": "TextBlock",
           "title": "Текстовый блок №2",
           "description": "Описание текстового блока №2"
         }

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

@@ -6,29 +6,29 @@ import { TEXT_BLOCK } from '../TextBlock/TextBlock.fixture';
 import type { AccordionProps } from './Accordion';
 import { Accordion } from './Accordion';
 import type {
-  HeadlineAccordionBlockDef,
-  LinkDocsAccordionBlockDef,
-  PictureTextAccordionBlockDef,
-  TextBlockAccordionBlockDef,
-} from './AccordionContent';
+  HeadlineBlockListDef,
+  LinkDocsBlockListDef,
+  PictureTextBlockListDef,
+  TextBlockBlockListDef,
+} from '../../ui-kit/BlocksList/BlocksListProps';
 
-const TEXT_BLOCK_ACCORDION_BLOCK: TextBlockAccordionBlockDef = {
-  accordionBlockType: 'TextBlock',
+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 LINK_DOCS_ACCORDION_BLOCK: LinkDocsAccordionBlockDef = {
-  accordionBlockType: 'LinkDocs',
+const LINK_DOCS_ACCORDION_BLOCK: LinkDocsBlockListDef = {
+  blockListType: 'LinkDocs',
   ...linkDocsContentExample,
   title: '',
 };