@redneckz/wildless-cms-uni-blocks 0.3.32 → 0.3.33

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

@@ -1,8 +1,14 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../types';
 import { HeadingType } from '../../ui-kit/Heading/HeadingContent';
-import type { ProductBlockInnerContent } from '../ProductBlock/ProductBlockContent';
 import { ProductBlockInner } from '../ProductBlock/ProductBlockInner';
+import type { BlockVersion } from '../../model/BlockVersion';
+import type { ProductBlockInnerContent } from '../ProductBlock/ProductBlockContent';
+import type { UniBlockProps } from '../../types';
+
+const productGalleryStyleMap: Record<BlockVersion, string> = {
+  primary: 'bg-white text-primary-text',
+  secondary: 'bg-primary-main text-white',
+};
 
 export interface ProductGalleryBlockProps extends UniBlockProps {
   headingType?: HeadingType;
@@ -10,9 +16,13 @@ export interface ProductGalleryBlockProps extends UniBlockProps {
 }
 
 export const ProductGalleryBlock = JSX<ProductGalleryBlockProps>(
-  ({ block, headingType, context }) => {
+  ({ block, headingType, context, className = '' }) => {
+    const version = block?.version ?? 'primary';
+
     return (
-      <section className="flex grow-0 shrink-0 basis-full px-4 pt-6">
+      <section
+        className={`flex grow-0 shrink-0 basis-full px-4 pt-6 ${productGalleryStyleMap[version]} ${className}`}
+      >
         <div className="flex grow">
           <ProductBlockInner context={context} headingType={headingType || 'h2'} {...block} />
         </div>

package/mobile/src/components/ProductGalleryGreen/ProductGalleryGreen.tsx

@@ -1,21 +1,25 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { UniBlockProps } from '../../types';
 import type { BlockVersion } from '../../model/BlockVersion';
-import { Icon } from '../../ui-kit/Icon/Icon';
 import type { ProductBlockInnerContent } from '../ProductBlock/ProductBlockContent';
 import { ProductBlockInner } from '../ProductBlock/ProductBlockInner';
 import type { ProductGalleryGreenContent } from './ProductGalleryGreenContent';
 
 export interface ProductGalleryProps extends ProductGalleryGreenContent, UniBlockProps {}
 
+type StyleType = {
+  title: string;
+  text: string;
+};
+
 const productGalleryGreenStyleMap: Record<BlockVersion, string> = {
   primary: 'bg-white text-primary-text',
   secondary: 'bg-primary-main text-white',
 };
 
-const productBlockStyleMap: Record<BlockVersion, string> = {
-  primary: 'text-secondary-text',
-  secondary: 'text-white/80',
+const productBlockStyleMap: Record<BlockVersion, StyleType> = {
+  primary: { title: 'text-secondary-text', text: 'text-secondary-text' },
+  secondary: { title: 'text-white', text: 'text-white/80' },
 };
 
 const productSlideStyleMap: Record<BlockVersion, string> = {
@@ -32,7 +36,7 @@ export const ProductGalleryGreen = JSX<ProductGalleryProps>(
     return (
       <section
         id={anchor}
-        className={`box-border pt-[70px] overflow-hidden relative font-sans w-100 ${className}
+        className={`box-border pt-[50px] overflow-hidden relative font-sans w-100 ${className}
         ${productGalleryGreenStyleMap[version]}`}
       >
         <div
@@ -43,7 +47,7 @@ export const ProductGalleryGreen = JSX<ProductGalleryProps>(
           {galleryBlocks.map((_, i) => renderProductBlock({ ..._, version }, i, context))}
         </div>
 
-        <div className="flex items-center absolute bottom-6 left-0 right-0 px-9 box-border">
+        <div className="flex items-center absolute bottom-6 left-0 right-0 px-[26px] box-border">
           {galleryNav.map((slide, i) =>
             renderNavButton({
               slide,
@@ -62,32 +66,21 @@ export const ProductGalleryGreen = JSX<ProductGalleryProps>(
 
 function renderProductBlock(block: ProductBlockInnerContent, i: number, context) {
   const { version } = block;
-  const additionalClass = version ? productBlockStyleMap[version] : '';
+  const additionalClass = version ? productBlockStyleMap[version].title : '';
 
   return (
     <section
       key={String(i)}
-      className="box-border relative flex grow-0 shrink-0 basis-full px-9"
+      className="box-border relative flex grow-0 shrink-0 basis-full"
       role="listitem"
     >
       <div className="flex grow">
-        {block.backgroundText ? (
-          <div className="absolute text-[454px] font-bold text-white tracking-[-10px] leading-[299px] opacity-[.1] right-12 top-20 z-0">
-            {block.backgroundText}
-          </div>
-        ) : null}
         <ProductBlockInner
-          className={`pl-2.5 pt-2.5 pb-1.5 pr-[6.25rem] z-[1] ${additionalClass}`}
+          className={`pl-[50px] pr-2 z-[1] ${additionalClass}`}
           context={context}
           textBlockClassName="mb-[154px]"
           {...block}
         />
-        <Icon
-          className="absolute right-[460px] top-[200px] z-0 mb-4"
-          name="ArrowsRewindRight"
-          width="230"
-          height="187"
-        />
       </div>
     </section>
   );
@@ -95,14 +88,21 @@ function renderProductBlock(block: ProductBlockInnerContent, i: number, context)
 
 function renderNavButton({ slide, i, activeSlideIndex, onClick, version, duration }) {
   const isActiveBtn = i === activeSlideIndex;
+
   const btnClassName = isActiveBtn
     ? 'bg-white shadow-dark-blue/42 h-[102px] w-[354px] min-w-[354px] max-w-[354px] p-0 border-none'
-    : `min-w-[277px] px-0 pt-4 pb-[23px] hover:py-[26px] hover:py-[26px] ease-in duration-300 
+    : `min-w-[277px] px-0 pt-4 pb-[23px] hover:py-[26px] hover:py-[26px] ease-in duration-300
       ${productSlideStyleMap[version]}`;
-  const btnTitleClassName = isActiveBtn ? 'text-primary-text' : productBlockStyleMap[version];
-  const btnDescClassName = isActiveBtn ? 'text-secondary-text' : productBlockStyleMap[version];
+  const btnTitleClassName = isActiveBtn
+    ? 'text-primary-text text-title-2xs'
+    : `text-base ${productBlockStyleMap[version].title}`;
+  const btnDescClassName = isActiveBtn
+    ? 'text-secondary-text text-m-title-xs mt-2.5'
+    : `text-m-md mt-1.5 ${productBlockStyleMap[version].text}`;
+
   const additionalBorder = version === 'secondary' ? 'border-white/50' : '';
   const progressBarClassName = isActiveBtn ? 'animate-slide' : '';
+
   return (
     <button
       type="button"

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

@@ -10,7 +10,12 @@
         }
       },
       "title": "Заголовок 1",
-      "description": "Описание 1"
+      "description": "Описание 1",
+      "socialMedia": [
+        { "href":  "https://t.me" },
+        { "href":  "https://vk.com" },
+        { "href":  "https://ok.ru" }
+      ]
     },
     {
       "image": {
@@ -21,7 +26,12 @@
         }
       },
       "title": "Заголовок 2",
-      "description": "Описание 2"
+      "description": "Описание 2",
+      "socialMedia": [
+        { "href":  "https://t.me" },
+        { "href":  "https://vk.com" },
+        { "href":  "https://ok.ru" }
+      ]
     },
     {
       "image": {
@@ -32,7 +42,12 @@
         }
       },
       "title": "Заголовок 3",
-      "description": "Описание 3"
+      "description": "Описание 3",
+      "socialMedia": [
+        { "href":  "https://t.me" },
+        { "href":  "https://vk.com" },
+        { "href":  "https://ok.ru" }
+      ]
     }
   ]
 }

package/mobile/src/components/Recommendation/Recommendation.tsx

@@ -3,7 +3,7 @@ import type { UniBlockProps } from '../../types';
 import { ArrowButton } from '../../ui-kit/Button/ArrowButton';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { RecommendationCard } from './RecommendationCard';
-import type { RecommendationCardContent, RecommendationContent } from './RecommendationContent';
+import type { RecommendationCardTypes, RecommendationContent } from './RecommendationContent';
 
 const BLUR_BLOCK_CLASSES = 'absolute top-0 bottom-0 w-[84px]';
 const CARD_FULL_VIEW_COUNT = 2;
@@ -17,16 +17,16 @@ export const Recommendation = JSX<RecommendationProps>(
 
     const blockClassName =
       version === 'secondary' ? 'bg-primary-main text-white' : 'bg-white text-primary-text';
-    const cardClassName = version === 'secondary' ? 'border-main-divider' : 'border-main-stroke';
+    const cardClassName = version === 'secondary' ? 'border-white/50' : 'border-main-stroke';
 
     return (
       <section
-        className={`relative font-sans p-[50px] overflow-hidden ${blockClassName} ${className}`}
+        className={`relative font-sans p-9 overflow-hidden text-center ${blockClassName} ${className}`}
         id={anchor}
       >
-        {title ? <Heading headingType="h2" className="mb-8" title={title} /> : null}
+        {title ? <Heading headingType="h2" className="mb-6" title={title} /> : null}
         <div
-          className="flex duration-1000 gap-4"
+          className="flex duration-1000 gap-3.5"
           style={{ transform: `translateX(-${activeCardIndex * CARD_SHIFT}px)` }}
           role="list"
         >
@@ -58,7 +58,7 @@ export const Recommendation = JSX<RecommendationProps>(
 
 const renderRecommendationCard =
   ({ context, version, className }) =>
-  (card: RecommendationCardContent, i: number) => {
+  (card: RecommendationCardTypes, i: number) => {
     return (
       <RecommendationCard
         key={String(i)}

package/mobile/src/components/Recommendation/RecommendationCard.tsx

@@ -1,31 +1,40 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { BlockVersion } from '../../model/BlockVersion';
-import type { UniBlockProps } from '../../types';
 import { Description } from '../../ui-kit/Description/Description';
-import { Heading } from '../../ui-kit/Heading/Heading';
 import { Img } from '../../ui-kit/Img/Img';
 import { List } from '../../ui-kit/List/List';
 import { BaseTile } from '../BaseTile/BaseTile';
-import type { RecommendationCardContent } from './RecommendationContent';
+import { SocialMedia } from '../Footer/SocialMedia';
+import type { UniBlockProps } from '../../types';
+import type { RecommendationCardTypes } from './RecommendationContent';
 
-export interface RecommendationCardProps extends RecommendationCardContent, UniBlockProps {
-  version?: BlockVersion;
-}
+export interface RecommendationCardProps extends RecommendationCardTypes, UniBlockProps {}
 
 export const RecommendationCard = JSX<RecommendationCardProps>(
-  ({ context, className = '', title, description, items, image, version }) => {
+  ({ context, className = '', title, description, items, image, version, socialMedia }) => {
     return (
       <section
-        className={`border border-solid box-border rounded-md p-7 min-w-[515px] max-w-[515px] ${className}`}
+        className={`border border-solid box-border py-[30px] px-9 min-w-[515px] max-w-[515px] ${className}`}
         role="listitem"
       >
         <BaseTile
           context={context}
-          title={title && <Heading headingType="h4" title={title} className="mb-4" />}
+          className="flex justify-between"
+          title={
+            title ? (
+              <h4 className={`font-sans text-title-xs font-normal m-0 mb-3.5`}>{title}</h4>
+            ) : null
+          }
           image={image?.src && <Img className="mt-auto ml-7" image={image} />}
         >
-          {description ? <Description description={description} /> : null}
-          {items?.length ? <List className="text-m-base" items={items} version={version} /> : null}
+          {description ? <Description className="text-left" description={description} /> : null}
+          {items?.length ? (
+            <List
+              className="text-md font-light flex flex-col gap-2"
+              items={items}
+              version={version}
+            />
+          ) : null}
+          <SocialMedia className="pt-[42px] pb-0" media={socialMedia} context={context} />
         </BaseTile>
       </section>
     );

package/mobile/src/components/Recommendation/RecommendationContent.ts

@@ -1,19 +1,21 @@
 import type { BlockVersion } from '../../model/BlockVersion';
+import type { LinkProps } from '../../model/LinkProps';
 import type { DescriptionContent } from '../../ui-kit/Description/DescriptionContent';
 import type { HeadingContent } from '../../ui-kit/Heading/HeadingContent';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
 import type { ListContent } from '../../ui-kit/List/ListContent';
 
-export type RecommendationCardContent = HeadingContent &
+export type RecommendationCardTypes = HeadingContent &
   DescriptionContent &
   ListContent &
-  ImageContent;
-
+  ImageContent &
+  RecommendationContent;
 /**
  * @title Рекомендации
  */
 export interface RecommendationContent extends HeadingContent {
   /** @title Карточки */
-  recommendations?: RecommendationCardContent[];
+  recommendations?: RecommendationCardTypes[];
   version?: BlockVersion;
+  socialMedia?: LinkProps[];
 }

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

@@ -7,15 +7,21 @@
     {
       "label": "Шаг №1",
       "description": "Описание шага №1",
-      "icon": "NewDocIcon"
+      "icon": {
+        "icon": "NewDocIcon"
+      }
     },
     {
       "label": "Шаг №2",
-      "icon": "PassSendIcon"
+      "icon": {
+        "icon": "PassSendIcon"
+      }
     },
     {
       "description": "Шаг №3 без заголовка",
-      "icon": "ActualBalanceIcon"
+      "icon": {
+        "icon": "ActualBalanceIcon"
+      }
     }
   ]
 }

package/mobile/src/components/StepsBlock/StepsBlock.tsx

@@ -1,10 +1,10 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { Heading } from '../../ui-kit/Heading/Heading';
-import { Icon } from '../../ui-kit/Icon/Icon';
+import type { BlockVersion } from '../../model/BlockVersion';
 import type { SizeVersion } from '../../model/SizeVersion';
 import type { UniBlockProps } from '../../types';
+import { Heading } from '../../ui-kit/Heading/Heading';
+import { Img } from '../../ui-kit/Img/Img';
 import type { Step, StepsBlockContent } from './StepsBlockContent';
-import type { BlockVersion } from '../../model/BlockVersion';
 
 export interface StepsBlockProps extends StepsBlockContent, UniBlockProps {}
 
@@ -132,7 +132,8 @@ const renderIconArea = (params: RenderStepTitleParams) => {
       className={`${iconAreaSize} ${style.iconBackground} rounded-full z-10 mr-3 flex justify-center content-center`}
     >
       <span className={`font-medium flex self-center ${style.title} ${iconTextSize}`}>
-        {(step.icon && <Icon name={step.icon} width={iconSize} height={iconSize} asSVG />) || i + 1}
+        {(step.icon?.icon && <Img image={step.icon} width={iconSize} height={iconSize} asSVG />) ||
+          i + 1}
       </span>
     </div>
   );

package/mobile/src/components/StepsBlock/StepsBlockContent.ts

@@ -1,6 +1,6 @@
-import type { IconName } from '../../icons/IconName';
 import type { SizeVersion } from '../../model/SizeVersion';
 import type { BlockVersion } from '../../model/BlockVersion';
+import type { Picture } from '../../model/Picture';
 
 /**
  * @title Шаг
@@ -10,7 +10,7 @@ export interface Step {
   label?: string;
   /** @title Описание */
   description?: string;
-  icon?: IconName;
+  icon?: Picture;
 }
 
 /**

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

@@ -1,6 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { Heading } from '../../ui-kit/Heading/Heading';
-import { Icon } from '../../ui-kit/Icon/Icon';
+import { Img } from '../../ui-kit/Img/Img';
 import type { TariffsTableRowHeader } from './TariffsTableContent';
 
 export const TableTileHeader = JSX<TariffsTableRowHeader>(({ title, icon }) => {
@@ -8,7 +8,7 @@ export const TableTileHeader = JSX<TariffsTableRowHeader>(({ title, icon }) => {
     <div className="flex gap-2.5 mb-2">
       {title ? <Heading headingType="h3" className="font-medium" title={title} /> : null}
       {icon ? (
-        <Icon className="ml-auto max-w-6 max-h-6" name={icon} width="24px" height="24px" />
+        <Img className="ml-auto max-w-6 max-h-6" image={icon} width="24px" height="24px" />
       ) : null}
     </div>
   );

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

@@ -5,11 +5,15 @@
   "rowHeaders": [
     {
       "title": "Параметр 1",
-      "icon": "MoneyIcon"
+      "icon": {
+        "icon": "MoneyIcon"
+      }
     },
     {
       "title": "Параметр 2",
-      "icon": "DollarIcon"
+      "icon": {
+        "icon": "DollarIcon"
+      }
     },
     {
       "title": "Параметр 3"
@@ -45,7 +49,9 @@
             "label": "Ячейка 3-2",
             "buttons": [
               {
-                "icon": "AppleIcon",
+                "icon": {
+                  "icon": "AppleIcon"
+                },
                 "rounded": true,
                 "version": "secondary",
                 "href": "/",
@@ -53,7 +59,9 @@
                 "text": ""
               },
               {
-                "icon": "PlayMarketIcon",
+                "icon": {
+                  "icon": "PlayMarketIcon"
+                },
                 "rounded": true,
                 "version": "secondary",
                 "href": "/",

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

@@ -1,10 +1,9 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { Button } from '../../ui-kit/Button/Button';
-import { Icon } from '../../ui-kit/Icon/Icon';
+import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 import { Img } from '../../ui-kit/Img/Img';
 import { List } from '../../ui-kit/List/List';
 import type { TariffsTableCellData, TariffsTableList } from './TariffsTableContent';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 
 export interface TariffsTableCellProps {
   cell: TariffsTableCellData[];
@@ -55,7 +54,7 @@ const renderButtons = (buttons: ButtonWithIconProps[]) => (
         className={`${idx > 0 && rounded ? 'ml-3' : ''} w-12 h-12`}
         key={String(idx)}
         rounded={rounded}
-        appendLeft={icon && <Icon name={icon} width="24px" height="24px" asSVG />}
+        appendLeft={icon ? <Img image={icon} width="24px" height="24px" asSVG /> : null}
         {...buttonProps}
       />
     ))}

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

@@ -1,4 +1,3 @@
-import type { IconName } from '../../icons/IconName';
 import type { CellData } from '../ComparisonTable/ComparisonTableContent';
 import type { ListOrientation } from '../../model/ListOrientation';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
@@ -6,6 +5,7 @@ import type { ButtonContent } from '../../ui-kit/Button/ButtonProps';
 import type { ListContent } from '../../ui-kit/List/ListContent';
 import type { HeadingContent } from '../../ui-kit/Heading/HeadingContent';
 import type { DescriptionContent } from '../../ui-kit/Description/DescriptionContent';
+import { Picture } from '../../model/Picture';
 
 /**
  * @title Ряд
@@ -44,7 +44,7 @@ export type TariffsTableCellData = CellData &
  * @title Параметр
  */
 export type TariffsTableRowHeader = HeadingContent & {
-  icon?: IconName;
+  icon?: Picture;
 };
 
 /**

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

@@ -1,9 +1,9 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { Img } from '../../ui-kit/Img/Img';
+import { TableCarouselContainer } from '../ComparisonTable/TableCarouselContainer';
+import { TableRowContainer } from '../ComparisonTable/TableRowContainer';
 import { COLUMN_WIDTH, DIVIDER_CLASSES, FIRST_CELL_CLASSES } from './constants';
-import { Icon } from '../../ui-kit/Icon/Icon';
 import { TariffsTableCell } from './TariffsTableCell';
-import { TableRowContainer } from '../ComparisonTable/TableRowContainer';
-import { TableCarouselContainer } from '../ComparisonTable/TableCarouselContainer';
 import type { TariffsTableRowData } from './TariffsTableContent';
 
 export interface TariffsTableRowProps {
@@ -23,15 +23,15 @@ export const TariffsTableRow = JSX<TariffsTableRowProps>(
           }`}
         >
           <div className="flex items-center text-primary-text">
-            {header?.icon && (
-              <Icon
+            {header?.icon ? (
+              <Img
                 className="mr-[14px] max-w-6 max-h-6"
-                name={header.icon}
+                image={header.icon}
                 width="24px"
                 height="24px"
                 asSVG
               />
-            )}
+            ) : null}
             {header?.title}
           </div>
         </div>

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

@@ -1,15 +1,14 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { TableTileHeader } from './TableTileHeader';
-import { Img } from '../../ui-kit/Img/Img';
 import { Button } from '../../ui-kit/Button/Button';
-import { Icon } from '../../ui-kit/Icon/Icon';
+import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import { Img } from '../../ui-kit/Img/Img';
 import { List } from '../../ui-kit/List/List';
+import { TableTileHeader } from './TableTileHeader';
 import type {
   TariffsTableCellData,
   TariffsTableList,
   TariffsTableTileCellProps,
 } from './TariffsTableContent';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 
 export const TariffsTableTileCell = JSX<TariffsTableTileCellProps>(({ header, data }) => {
   return (
@@ -54,7 +53,7 @@ const renderButtons = (buttons: ButtonWithIconProps[]) => (
         className={`mt-3 ${idx > 0 && rounded ? 'ml-2.5' : ''} ${icon ? 'w-12 h-12' : ''}`}
         key={String(idx)}
         rounded={rounded}
-        appendLeft={icon && <Icon name={icon} width="24px" height="24px" asSVG />}
+        appendLeft={icon ? <Img image={icon} width="24px" height="24px" asSVG /> : null}
         {...buttonProps}
         aria-label={icon}
       />

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

@@ -16,7 +16,7 @@ export async function transformContentPage(
   const content = await readFile(pagePath, 'utf8');
   return mapJSON<ContentPageDef>(JSON.parse(content), async (value: any, [key]) => {
     const isMarkdown = typeof value === 'string' && key?.endsWith('__md');
-    const isPicture = value && isLocalPath(value.src);
+    const isPicture = value && isLocalPath(value?.src);
     if (isMarkdown) {
       return await transformMarkdown(value);
     } else if (isPicture) {

package/mobile/src/model/Picture.ts

@@ -1,3 +1,5 @@
+import type { IconName } from '../icons/IconName';
+
 export interface Img {
   /** @title Картинка */
   src?: string;
@@ -8,6 +10,8 @@ export interface Img {
 }
 
 export interface ImgSource {
+  /** @title Иконка */
+  icon?: IconName;
   /** @title Картинка */
   src?: string;
   /** @title Формат */

package/mobile/src/model/SitemapProps.ts

@@ -1,5 +1,5 @@
 import type { LinkProps } from './LinkProps';
-import { IconName } from '../icons/IconName';
+import type { Picture } from './Picture';
 
 /**
  * @title Меню
@@ -16,7 +16,7 @@ export interface TopMenuItem extends LinkProps {
  */
 export interface DispositionItem extends LinkProps {
   /** @hidden */
-  icon?: IconName;
+  icon?: Picture;
 }
 
 export interface SitemapProps {

package/mobile/src/services/sitemap/SitemapProps.ts

@@ -1,5 +1,5 @@
 import type { LinkProps } from '../../model/LinkProps';
-import { IconName } from '../../icons/IconName';
+import type { Picture } from '../../model/Picture';
 
 /**
  * @title Ссылка
@@ -16,7 +16,7 @@ export interface TopMenuItem extends LinkProps {
  */
 export interface DispositionItem extends LinkProps {
   /** @hidden */
-  icon?: IconName;
+  icon?: Picture;
 }
 
 export interface SitemapProps {

package/mobile/src/ui-kit/Button/ButtonInner.tsx

@@ -14,7 +14,7 @@ export const ButtonInner = JSX<ButtonInnerProps>((props) => {
       {isWithText(props) ? (
         <div>
           <div className="text-m-2xs font-light text-left">{aboveText}</div>
-          <div className="text-m-button text-left">{text}</div>
+          <div className="text-base text-left">{text}</div>
         </div>
       ) : null}
     </div>
@@ -28,7 +28,7 @@ const getButtonStyle = (props: ButtonInnerProps) => {
     return '';
   }
 
-  const withTextStyle = `px-8 gap-2 ${aboveText ? 'py-2' : 'py-3.5'}`;
+  const withTextStyle = `px-8 gap-2 ${aboveText ? 'py-2' : 'py-4'}`;
 
   return [
     'flex items-center justify-center',

package/mobile/src/ui-kit/Button/ButtonProps.ts

@@ -1,6 +1,6 @@
 import type { ButtonVersion } from '../../model/ButtonVersion';
 import type { LinkProps } from '../../model/LinkProps';
-import type { IconName } from '../Icon/IconProps';
+import type { Picture } from '../../model/Picture';
 
 /**
  * @hidden
@@ -24,7 +24,7 @@ export interface ButtonProps extends ButtonAdditionalProps, LinkProps {
 
 export interface ButtonWithIconProps extends ButtonProps {
   /** @title Иконка */
-  icon?: IconName;
+  icon?: Picture;
   /** @title Верхний текст */
   aboveText?: string;
   /** @hidden */

package/mobile/src/ui-kit/Button/ButtonSection.tsx

@@ -1,7 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useLink } from '../../hooks/useLink';
 import { UniBlockProps } from '../../types';
-import { Icon } from '../Icon/Icon';
+import { Img } from '../Img/Img';
 import { Button } from './Button';
 import type { ButtonContent, ButtonWithIconProps } from './ButtonProps';
 
@@ -25,7 +25,7 @@ function renderButton({ icon, ...button }: ButtonWithIconProps, i: number) {
   return icon ? (
     <Button
       key={String(i)}
-      appendLeft={<Icon name={icon} width="24" height="24" asSVG />}
+      appendLeft={<Img image={icon} width="24" height="24" asSVG />}
       {...button}
     />
   ) : (