@redneckz/wildless-cms-uni-blocks 0.8.16 → 0.8.17

package/mobile/lib/model/AlignType.d.ts

@@ -7,3 +7,13 @@
  * ]
  */
 export declare type AlignType = 'left' | 'center' | 'right';
+/**
+ * @title Выравнивание
+ * @enumNames [
+ *    "Во всю ширину",
+ *    "По левому краю",
+ *    "По центру",
+ *    "По правому краю"
+ * ]
+ */
+export declare type AlignTypeWithStretch = 'stretch' | 'left' | 'center' | 'right';

package/mobile/lib/services/sitemap/isTopItemActive.d.ts

@@ -1,3 +1,4 @@
 import type { Router } from '../../hooks/useRouter';
-import { TopMenuItem } from './SitemapProps';
-export declare const isTopItemActive: (router: Router) => (topItem: TopMenuItem) => boolean;
+export declare const isTopItemActive: (router: Router) => ({ href }: {
+    href?: string | undefined;
+}) => boolean;

package/mobile/lib/services/sitemap/isTopItemActive.js

@@ -1,6 +1,4 @@
 import { projectSettings } from '../../ProjectSettings.js';
 import { isHrefActive } from './isHrefActive.js';
-export const isTopItemActive = (router) => (topItem) => projectSettings.BASE_PATH
-    ? isHrefActive({ pathname: projectSettings.BASE_PATH })(topItem)
-    : topItem.items?.some(isHrefActive(router)) || isHrefActive(router)(topItem);
+export const isTopItemActive = (router) => isHrefActive(projectSettings.BASE_PATH ? { pathname: projectSettings.BASE_PATH } : router);
 //# sourceMappingURL=isTopItemActive.js.map

package/mobile/lib/services/sitemap/isTopItemActive.js.map

@@ -1 +1 @@
-{"version":3,"file":"isTopItemActive.js","sourceRoot":"","sources":["../../../src/services/sitemap/isTopItemActive.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG9C,MAAM,CAAC,MAAM,eAAe,GAC1B,CAAC,MAAc,EAAE,EAAE,CACnB,CAAC,OAAoB,EAAW,EAAE,CAChC,eAAe,CAAC,SAAS;IACvB,CAAC,CAAC,YAAY,CAAC,EAAE,QAAQ,EAAE,eAAe,CAAC,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC;IAChE,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,IAAI,YAAY,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC"}
+{"version":3,"file":"isTopItemActive.js","sourceRoot":"","sources":["../../../src/services/sitemap/isTopItemActive.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,MAAc,EAAE,EAAE,CAChD,YAAY,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,eAAe,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC"}

package/mobile/lib/wlc.json

@@ -2,5 +2,7 @@
     "PROD_BRANCH": "master",
     "FORCED_DRAFT_FLOW": false,
     "YANDEX_MAP_API_KEY": "f4b40c1e-1891-45f2-b307-90c481af210b",
-    "SITEMAP": "sayt-rshb"
+    "SITEMAP": "sayt-rshb",
+    "CHAT_BOT": "personal",
+    "BASE_PATH": "/natural/"
 }

package/mobile/src/ProjectSettings.ts

@@ -6,6 +6,7 @@ export interface ProjectSettings {
   ASSIST_PROJECT_ID?: string;
   SITEMAP?: string;
   FOOTER?: string;
+  CHAT_BOT?: string; // "personal" or "business"
   CDN?: string; // Should ends with "/"
   BASE_PATH?: string; // Should ends with "/"
   YANDEX_MAP_API_KEY?: string;
@@ -42,6 +43,9 @@ export const projectSettings = new (class implements ProjectSettings {
   get FOOTER() {
     return this._.FOOTER;
   }
+  get CHAT_BOT() {
+    return this._.CHAT_BOT;
+  }
   get CDN() {
     return appendSlash(this._.CDN);
   }

package/mobile/src/components/Carousel/Carousel.tsx

@@ -91,6 +91,7 @@ Carousel.childrenTypes = [
   'CarouselRecommendationCard',
   'CarouselTariffsCard',
   'CarouselInvestmentCard',
+  'CarouselEventCard',
 ];
 
 const getPaddingStyle = (isPadding: boolean): string => (isPadding ? 'p-12' : '');

package/mobile/src/components/CarouselCard/CarouselCard.tsx

@@ -1,17 +1,17 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { CarouselCardVersion } from '../../model/CarouselCardVersion';
-import type { UniBlockProps } from '../../model/JSXBlock';
 import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
 import { Headline } from '../Headline/Headline';
+import type { UniBlockProps } from '../../model/JSXBlock';
 import type { CarouselCardContent } from './CarouselCardContent';
+import type { SizeVersion } from '../../model/SizeVersion';
 
 export interface CarouselCardProps extends CarouselCardContent, UniBlockProps {}
 
 const BLOCK_CLASSES = 'absolute border border-solid border-gray w-full h-full';
 
-const CARD_WIDTH_MAP: Record<CarouselCardVersion, string> = {
+const CARD_WIDTH_MAP: Record<SizeVersion, string> = {
   normal: 'min-w-[970px]',
-  mini: 'min-w-[355px]',
+  small: 'min-w-[355px]',
 };
 
 export const CarouselCard = JSX<CarouselCardProps>(

package/mobile/src/components/CarouselCard/CarouselCardContent.ts

@@ -1,4 +1,4 @@
-import type { CarouselCardVersion } from '../../model/CarouselCardVersion';
+import type { SizeVersion } from '../../model/SizeVersion';
 import type { HeadlineCommonProps } from '../../model/HeadlineType';
 import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 
@@ -14,5 +14,5 @@ export interface CarouselCardContent extends HeadlineCommonProps {
    * }
    */
   button?: ButtonWithIconProps;
-  carouselVersion?: CarouselCardVersion;
+  carouselVersion?: SizeVersion;
 }

package/mobile/src/components/CarouselCard/constants.ts

@@ -1,11 +1,11 @@
-import type { CarouselCardVersion } from '../../model/CarouselCardVersion';
+import type { SizeVersion } from '../../model/SizeVersion';
 
-export const cardStyleMap: Record<CarouselCardVersion, string> = {
+export const cardStyleMap: Record<SizeVersion, string> = {
   normal: 'min-w-[100%] justify-center items-center m-7 col-span-12',
-  mini: 'min-w-auto justify-center items-center m-9 col-span-4',
+  small: 'min-w-auto justify-center items-center m-9 col-span-4',
 };
 
-export const cardWidthMap: Record<CarouselCardVersion, string> = {
+export const cardWidthMap: Record<SizeVersion, string> = {
   normal: 'w-[1007px]',
-  mini: 'w-[350px]',
+  small: 'w-[350px]',
 };

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

@@ -0,0 +1,14 @@
+{
+  "icon": {
+    "icon": "SignDocsIcon",
+    "format": "webp",
+    "size": {
+      "width": 365,
+      "height": 195
+    }
+  },
+  "title": "Заголовок",
+  "description": "Описание",
+  "target": null,
+  "href": null
+}

package/mobile/src/components/CarouselEventCard/CarouselEventCard.tsx

@@ -0,0 +1,32 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { BlockWrapper } from '../../ui-kit/BlockWrapper';
+import { Heading } from '../../ui-kit/Heading/Heading';
+import { Img } from '../../ui-kit/Img/Img';
+import { Text } from '../../ui-kit/Text/Text';
+import { getIconWithVersion } from '../../utils/getIconWithVersion';
+import { style } from '../../utils/style';
+import type { UniBlockProps } from '../../model/JSXBlock';
+import type { CarouselEventCardContent } from './CarouselEventCardContent';
+
+export interface CarouselEventCardProps extends CarouselEventCardContent, UniBlockProps {}
+
+export const CarouselEventCard = JSX<CarouselEventCardProps>(
+  ({ className = '', icon, title, description, href, target, ...rest }) => (
+    <BlockWrapper className={style('flex flex-col w-[365px]', className)} {...rest}>
+      <a href={href} target={target} role="link">
+        {icon?.icon ? <Img image={getIconWithVersion(icon)} asSVG /> : null}
+        {icon?.src ? <Img image={icon} /> : null}
+        {title ? (
+          <Heading headingType="h6" as="h4" className="text-left mb-2" title={title} />
+        ) : null}
+        {description ? (
+          <div className="mb-4">
+            <Text font="font-light" size="text-s" color="text-secondary-text">
+              {description}
+            </Text>
+          </div>
+        ) : null}
+      </a>
+    </BlockWrapper>
+  ),
+);

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

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

package/mobile/src/components/CarouselEventCard/CarouselEventCardContent.ts

@@ -0,0 +1,12 @@
+import type { DescriptionProps, TitleProps } from '../../model/HeadlineType';
+import type { LinkCommonProps } from '../../model/LinkProps';
+import type { Picture } from '../../model/Picture';
+
+/**
+ * @title Карточка мероприятия в карусели
+ */
+export type CarouselEventCardContent = TitleProps &
+  DescriptionProps &
+  LinkCommonProps & {
+    icon?: Picture;
+  };

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

@@ -1,22 +1,22 @@
 {
   "content": {
-   "image": {
-    "format": "webp",
-    "size": {
-      "width": 180,
-      "height": 180
-    }
-  },
-  "title": "Заголовок 1",
-  "description": "Описание 1",
-  "socialMedia": [
-    {
-      "href": "https://t.me",
-      "target": "_blank",
-      "version": "gray",
-      "rounded": false
-    }
-  ],
-  "version": "primary"
+    "image": {
+      "format": "webp",
+      "size": {
+        "width": 180,
+        "height": 180
+      }
+    },
+    "title": "Заголовок 1",
+    "description": "Описание 1",
+    "socialMedia": [
+      {
+        "href": "https://t.me",
+        "target": "_blank",
+        "version": "gray",
+        "rounded": false
+      }
+    ],
+    "version": "primary"
   }
 }

package/mobile/src/components/CarouselRecommendationCard/CarouselRecommendationCard.tsx

@@ -1,20 +1,18 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { Img } from '../../ui-kit/Img/Img';
 import { List } from '../../ui-kit/List/List';
+import { style } from '../../utils/style';
 import { BaseTile } from '../BaseTile/BaseTile';
 import { SocialMedia } from '../Footer/SocialMedia';
 import type { CarouselRecommendationCardContent } from './CarouselRecommendationCardContent';
-import { style } from '../../utils/style';
 
 export interface RecommendationCardProps extends CarouselRecommendationCardContent, UniBlockProps {}
 
 export const CarouselRecommendationCard = JSX<RecommendationCardProps>(
   ({
-    button,
     className = '',
     description,
     image,
@@ -57,7 +55,6 @@ export const CarouselRecommendationCard = JSX<RecommendationCardProps>(
               />
             ) : null}
             {socialMedia.length ? <SocialMedia className="pt-10 pb-0" media={socialMedia} /> : null}
-            {renderButtonsSection([button], { className: 'pt-2 mt-16' })}
           </div>
         </BaseTile>
       </BlockWrapper>

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

@@ -2,14 +2,11 @@
   "content": {
     "image": {
       "ui:field": "picture"
-    }, 
+    },
     "socialMedia": {
       "items": {
         "icon": {
           "ui:field": "icon"
-        },
-        "iconRight": {
-          "ui:field": "icon"
         }
       }
     }

package/mobile/src/components/CarouselRecommendationCard/CarouselRecommendationCardContent.ts

@@ -1,9 +1,16 @@
 import type { BlockVersion } from '../../model/BlockVersion';
+import type { ButtonVersion } from '../../model/ButtonVersion';
 import type { HeadlineCommonProps } from '../../model/HeadlineType';
+import type { LinkCommonProps } from '../../model/LinkProps';
 import type { Picture } from '../../model/Picture';
-import type { ButtonWithIconProps, ButtonProps } from '../../ui-kit/Button/ButtonProps';
 import type { ListContent } from '../../ui-kit/List/ListContent';
 
+export type RecommendationSocialMedia = LinkCommonProps & {
+  version: ButtonVersion;
+  icon?: Picture;
+  rounded?: boolean;
+};
+
 /**
  * @title Карточка рекомендаций
  */
@@ -11,7 +18,7 @@ export interface CarouselRecommendationCardContent extends HeadlineCommonProps,
   /**
    * @title Соц сети
    */
-  socialMedia?: ButtonWithIconProps[];
+  socialMedia?: RecommendationSocialMedia[];
   /**
    * @default {
    *   "format": "webp",
@@ -27,12 +34,5 @@ export interface CarouselRecommendationCardContent extends HeadlineCommonProps,
    * }
    */
   image?: Picture;
-  /**
-   * @default {
-   * "text": "",
-   * "version": "secondary"
-   * }
-   */
-  button?: ButtonProps;
   version?: BlockVersion;
 }

package/mobile/src/components/Footer/MediaButton.tsx

@@ -1,45 +1,45 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { Img } from '../../ui-kit/Img/Img';
-import { getIconWithVersion } from '../../utils/getIconWithVersion';
-import { style } from '../../utils/style';
-import type { Picture } from '../../model/Picture';
 import type { IconVersion } from '../../model/IconVersion';
+import type { Picture } from '../../model/Picture';
 import { Button } from '../../ui-kit/Button/Button';
 import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import { Img } from '../../ui-kit/Img/Img';
+import { getIconWithVersion } from '../../utils/getIconWithVersion';
+import { style } from '../../utils/style';
 
 const ICONS_MAP: Array<{
   origins: string[];
-  icon: Picture;
+  iconMapped: Picture;
   label: string;
 }> = [
   {
     origins: ['t.me', 'telegram.org'],
-    icon: { icon: 'TelegramIcon' },
+    iconMapped: { icon: 'TelegramIcon' },
     label: 'Телеграм',
   },
   {
     origins: ['vk.com'],
-    icon: { icon: 'VKIcon' },
+    iconMapped: { icon: 'VKIcon' },
     label: 'ВКонтакте',
   },
   {
     origins: ['ok.ru'],
-    icon: { icon: 'OkIcon' },
+    iconMapped: { icon: 'OkIcon' },
     label: 'Одноклассники',
   },
   {
     origins: ['apps.apple.com'],
-    icon: { icon: 'AppleIcon' },
+    iconMapped: { icon: 'AppleIcon' },
     label: 'App Store',
   },
   {
     origins: ['play.google.com'],
-    icon: { icon: 'PlayMarketIcon' },
+    iconMapped: { icon: 'PlayMarketIcon' },
     label: 'Google Play',
   },
   {
     origins: ['youtube.com'],
-    icon: { icon: 'YoutubeIcon' },
+    iconMapped: { icon: 'YoutubeIcon' },
     label: 'Youtube',
   },
 ];
@@ -57,12 +57,17 @@ const buttonSizeStyles = {
 };
 
 export const MediaButton = JSX<MediaButtonProps>(
-  ({ iconVersion = 'color', buttonSize = 'default', rounded = false, ...rest }) => {
+  ({ iconVersion = 'color', buttonSize = 'default', rounded = false, icon, ...rest }) => {
     const { href, version } = rest;
 
-    const { icon, label } =
+    const { iconMapped, label } =
       ICONS_MAP.find(({ origins }) => origins.some((_) => href?.includes(_))) || {};
-    const iconWithVersion = icon ? { ...getIconWithVersion(icon), iconVersion } : null;
+
+    const iconCustom = icon ?? iconMapped;
+
+    const iconWithVersion = iconCustom
+      ? { ...getIconWithVersion(iconCustom), iconVersion }
+      : undefined;
 
     return (
       <Button

package/mobile/src/components/Header/HeaderChatBotButton.tsx

@@ -2,16 +2,13 @@ import { JSX } from '@redneckz/uni-jsx';
 import { useBool } from '../../hooks/useBool';
 import type { IconVersion } from '../../model/IconVersion';
 import { style } from '../../utils/style';
-import type { ChatBot as ChatBotWithEmptyOption } from './HeaderContent';
 import { HeaderSecondaryMenuButton } from './HeaderSecondaryMenuButton';
 import { useChatBot } from './useChatBot';
 
-export type ChatBot = Exclude<ChatBotWithEmptyOption, ''>;
-
 interface HeaderChatBotButtonProps {
   className?: string;
   iconVersion?: IconVersion;
-  chat?: ChatBot;
+  chat?: string;
   onClick?: () => void;
 }
 

package/mobile/src/components/Header/HeaderContent.ts

@@ -7,12 +7,6 @@ import type { IconProps, Picture } from '../../model/Picture';
  */
 export type SubMenuItem = LinkProps & IconProps;
 
-/**
- * @title Чат-бот
- * @enumNames ["", "Для физических лиц", "Для юридических лиц"]
- */
-export type ChatBot = '' | 'personal' | 'business';
-
 /**
  * @title Ссылка дополнительного меню
  * @required ["text", "href"]
@@ -40,5 +34,4 @@ export interface HeaderContent {
   showSubMenu?: boolean;
   /** @hidden */
   bgColor?: BgColorVersion;
-  chat?: ChatBot;
 }

package/mobile/src/components/Header/HeaderSecondaryMenu.tsx

@@ -8,14 +8,13 @@ import { Location } from '../../ui-kit/Location/Location';
 import { TopItem } from '../../ui-kit/TopItem/TopItem';
 import { style } from '../../utils/style';
 import { HeaderChatBotButton } from './HeaderChatBotButton';
-import type { ChatBot } from './HeaderContent';
+import { projectSettings } from '../../ProjectSettings';
 
 interface HeaderSecondaryMenuContent {
   version?: BlockVersion;
   defaultLocation?: string;
   officesLink?: string;
   foreignOffices?: ForeignOffice[];
-  chat?: ChatBot;
 }
 
 export interface HeaderSecondaryMenuProps extends HeaderSecondaryMenuContent {
@@ -23,7 +22,7 @@ export interface HeaderSecondaryMenuProps extends HeaderSecondaryMenuContent {
 }
 
 export const HeaderSecondaryMenu = JSX<HeaderSecondaryMenuProps>(
-  ({ version, className, officesLink, defaultLocation = 'Москва', foreignOffices, chat }) => {
+  ({ version, className, officesLink, defaultLocation = 'Москва', foreignOffices }) => {
     const [isShowLocationModal, { setTrue: showLocationModal, setFalse: hideLocationModal }] =
       useBool();
 
@@ -43,8 +42,12 @@ export const HeaderSecondaryMenu = JSX<HeaderSecondaryMenuProps>(
         {officesLink ? (
           <TopItem className="mr-7" flat={true} href={officesLink} text="Офисы и банкоматы" />
         ) : null}
-        {chat ? (
-          <HeaderChatBotButton className="mr-5" iconVersion={iconVersion} chat={chat} />
+        {projectSettings.CHAT_BOT ? (
+          <HeaderChatBotButton
+            className="mr-5"
+            iconVersion={iconVersion}
+            chat={projectSettings.CHAT_BOT}
+          />
         ) : null}
         {isShowLocationModal ? (
           <Location

package/mobile/src/components/Header/useChatBot.ts

@@ -1,15 +1,14 @@
 import { useEffect } from '@redneckz/uni-jsx/lib/hooks';
 import { useExternalNS } from '../../hooks/useExternalNS';
-import { ChatBot } from './HeaderChatBotButton';
 
 const CHATBOT_NAMESPACE = 'chatbot';
 
-const CHATBOT_URL: Record<ChatBot, string> = {
+const CHATBOT_URL: Record<string, string> = {
   personal: '//chat.mes.rshb.ru/assets/js/webchat_rshb',
   business: '', //TODO: add url business chat
 };
 
-export const useChatBot = (chat: ChatBot) => {
+export const useChatBot = (chat: string) => {
   useEffect(() => globalThis.localStorage?.setItem('webchat-keep-open', String(Date.now())), []);
 
   return useExternalNS(CHATBOT_NAMESPACE, CHATBOT_URL[chat]);

package/mobile/src/components/ProductBlock/renderBackwardButton.tsx

@@ -2,19 +2,19 @@ import type { ButtonVersion } from '../../model/ButtonVersion';
 import { Button } from '../../ui-kit/Button/Button';
 import type { BackwardButtonProps } from '../../ui-kit/Button/ButtonProps';
 import { Img } from '../../ui-kit/Img/Img';
+import { style } from '../../utils/style';
 
 export function renderBackwardButton(
   button: BackwardButtonProps,
   version: ButtonVersion,
   className: string,
 ) {
-  const { text, href, target, onClick } = button;
+  const { text, href, target } = button;
   const iconVersion = version === 'primary' ? 'white' : 'black';
   const backwardIcon = button?.icon || { icon: 'ArrowLeftIcon' };
 
-  // TODO Move click handler to Button
   return (
-    <div className={`flex items-center cursor-pointer ${className}`} onClick={onClick}>
+    <div className={style('flex items-center', className)}>
       <Button
         version={version}
         rounded
@@ -29,7 +29,9 @@ export function renderBackwardButton(
           asSVG
         />
       </Button>
-      {text ? <span className="text-m">{text}</span> : null}
+      {text ? (
+        <Button version="link" text={text} href={href} target={target} ariaLabel={text} />
+      ) : null}
     </div>
   );
 }

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

@@ -15,7 +15,6 @@
               "height": 299
             }
           },
-          "version": "primary",
           "description": "Описание",
           "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"],
           "benefits": [
@@ -50,7 +49,6 @@
               "height": 299
             }
           },
-          "version": "primary",
           "description": "Описание",
           "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"],
           "benefits": [
@@ -71,6 +69,7 @@
           ]
         }
       }
-    ]
+    ],
+    "version": "primary"
   }
 }

package/mobile/src/components/ProductGallery/ProductGallery.tsx

@@ -61,7 +61,7 @@ function renderProductBlock(block: ProductBlockInnerContent & UniBlockProps, i:
     >
       <div className="flex grow">
         <ProductBlockInner
-          className="pl-12 z-10 text-secondary-text group-data-secondary:text-white"
+          className="pl-12 z-10 group-data-secondary:text-white"
           textBlockClassName="mb-[154px]"
           headlineVersion="XXL"
           {...block}

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

@@ -35,6 +35,7 @@
             {
               "tableCellType": "List",
               "isDotted": true,
+              "listItemSize": "M",
               "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"]
             },
             {
@@ -45,6 +46,7 @@
             {
               "tableCellType": "List",
               "isDotted": false,
+              "listItemSize": "M",
               "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"]
             }
           ],
@@ -56,6 +58,7 @@
             {
               "tableCellType": "List",
               "isDotted": true,
+              "listItemSize": "M",
               "items": ["Элемент списка 1", "Элемент списка 2", "Элемент списка 3"]
             }
           ],

package/mobile/src/components/TariffsTable/TariffsTableContent.ts

@@ -80,6 +80,7 @@ export type LabelDescriptionCellDef = LabelDescriptionCell & {
 
 /**
  * @title Список
+ * @default { "listItemSize": "M", "isDotted": true  }
  */
 export type ListBlockDef = ListProps & {
   /** @default List */

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

@@ -3,7 +3,7 @@
     "version": "primary",
     "isPadding": false,
     "isInnerPadding": true,
-    "align": "left",
+    "align": "stretch",
     "gap": ""
   },
   "style": ["col-span-12"],

package/mobile/src/components/VerticalLayout/VerticalLayout.tsx

@@ -1,6 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { renderChildren } from '../../BlockRenderer/renderChildren';
-import type { AlignType } from '../../model/AlignType';
+import type { AlignTypeWithStretch } from '../../model/AlignType';
 import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { style } from '../../utils/style';
@@ -9,7 +9,8 @@ import type { VerticalLayoutContent } from './VerticalLayoutContent';
 
 export interface VerticalLayoutProps extends VerticalLayoutContent, UniBlockProps {}
 
-const alignStyle: Record<AlignType, string> = {
+const alignStyle: Record<AlignTypeWithStretch, string> = {
+  stretch: 'items-stretch',
   left: 'items-start',
   center: 'items-center',
   right: 'items-end',
@@ -19,7 +20,7 @@ export const VerticalLayout: JSXBlock<VerticalLayoutProps> = JSX<VerticalLayoutP
   ({
     className = '',
     gap = '',
-    align,
+    align = 'stretch',
     isPadding = false,
     isInnerPadding = true,
     version = 'transparent',