@redneckz/wildless-cms-uni-blocks 0.14.20 → 0.14.22

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

@@ -12,6 +12,9 @@
         },
         "buttons": {
           "items": {
+            "href": {
+              "ui:field": "attachmentHref"
+            },
             "icon": {
               "ui:field": "icon"
             },

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

@@ -3,7 +3,7 @@
     "title": "Вы можете оплатить бонусными баллами",
     "subtitle": "Удобный каталог с большим ассортиментом товаров и сервисов",
     "columnsCount": "4",
-    "cardTextAlign": "center",
+    "cardTextAlign": "text-center",
     "bonusBenefits": [
       {
         "title": "Верхний заголовок",

package/mobile/src/components/BonusBenefitsBlock/BonusBenefitsBlock.tsx

@@ -10,7 +10,7 @@ export interface BenefitsBlockProps extends BonusBenefitsBlockContent, UniBlockP
 export const BonusBenefitsBlock = JSX<BenefitsBlockProps>(
   ({
     bonusBenefits,
-    cardTextAlign = 'center',
+    cardTextAlign = 'text-center',
     className = '',
     columnsCount = '4',
     subtitle,

package/mobile/src/components/BonusBenefitsBlock/BonusBenefitsBlockContent.ts

@@ -1,4 +1,3 @@
-import { type AlignType } from '../../model/AlignType';
 import {
   type DescriptionProps,
   type SubtitleProps,
@@ -6,6 +5,7 @@ import {
 } from '../../model/HeadlineType';
 import { type UniBlockContent } from '../../model/JSXBlock';
 import { type IconProps } from '../../model/Picture';
+import { type TextAlign } from '../../ui-kit/Text/TextProps';
 
 /**
  * @title Количество элементов в строке
@@ -31,5 +31,5 @@ export type BonusBenefitsBlockContent = UniBlockContent &
     /** @title Список бонусов */
     bonusBenefits?: BonusBenefit[];
     columnsCount?: ColumnsCount;
-    cardTextAlign?: AlignType;
+    cardTextAlign?: TextAlign;
   };

package/mobile/src/components/BonusBenefitsBlock/renderBonusBenefit.tsx

@@ -1,29 +1,32 @@
-import { AlignStyles } from '../../model/AlignStyles';
 import { Img } from '../../ui-kit/Img/Img';
 import { Text } from '../../ui-kit/Text/Text';
+import { type TextAlign } from '../../ui-kit/Text/TextProps';
 import { style } from '../../utils/style';
 import { type BonusBenefit } from './BonusBenefitsBlockContent';
 import { bonusBenefitStyles } from './bonusBenefitStyles';
 
-export const renderBonusBenefit = ({ icon, title, description }: BonusBenefit, i: number) => (
-  <div
-    key={String(i)}
-    className={style(
-      'flex flex-col',
-      bonusBenefitStyles,
-      !description && !title ? 'justify-center' : '',
-    )}
-  >
-    {title ? (
-      <Text size="text-h6" font="font-normal" align={AlignStyles}>
-        {title}
-      </Text>
-    ) : null}
-    {icon ? <Img image={icon} height="180" className="w-auto" /> : null}
-    {description ? (
-      <Text size="text-h6" font="font-normal" align={AlignStyles}>
-        {description}
-      </Text>
-    ) : null}
-  </div>
-);
+export const renderBonusBenefit =
+  (cardTextAlign: TextAlign) =>
+  ({ icon, title, description }: BonusBenefit, i: number) =>
+    (
+      <div
+        key={String(i)}
+        className={style(
+          'flex flex-col gap-1',
+          bonusBenefitStyles,
+          !description && !title ? 'justify-center' : '',
+        )}
+      >
+        {title ? (
+          <Text size="text-h6" font="font-normal" align={cardTextAlign}>
+            {title}
+          </Text>
+        ) : null}
+        {icon ? <Img image={icon} height="180" className="w-auto" /> : null}
+        {description ? (
+          <Text size="text-h6" font="font-normal" align={cardTextAlign}>
+            {description}
+          </Text>
+        ) : null}
+      </div>
+    );

package/mobile/src/components/BonusBenefitsBlock/renderBonusBenefits.tsx

@@ -1,15 +1,10 @@
-/* eslint-disable @typescript-eslint/no-unused-vars */
-import { type AlignType } from '../../model/AlignType';
 import { SwipeListControl } from '../../ui-kit/SwipeListControl/SwipeListControl';
+import { type TextAlign } from '../../ui-kit/Text/TextProps';
 import { type BonusBenefit, type ColumnsCount } from './BonusBenefitsBlockContent';
 import { renderBonusBenefit } from './renderBonusBenefit';
 
 export const renderBonusBenefits = (
   bonusBenefits: BonusBenefit[],
   _columnsCount: ColumnsCount,
-  _cardTextAlign: AlignType,
-) => (
-  <SwipeListControl>
-    {bonusBenefits.map((_, i) => renderBonusBenefit({ ..._ }, i))}
-  </SwipeListControl>
-);
+  _cardTextAlign: TextAlign,
+) => <SwipeListControl>{bonusBenefits.map(renderBonusBenefit(_cardTextAlign))}</SwipeListControl>;

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

@@ -6,6 +6,9 @@
           "ui:field": "picture"
         },
         "button": {
+          "href": {
+            "ui:field": "attachmentHref"
+          },
           "icon": {
             "ui:field": "icon"
           },

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

@@ -2,6 +2,9 @@
   "content": {
     "buttons": {
       "items": {
+        "href": {
+          "ui:field": "attachmentHref"
+        },
         "icon": {
           "ui:field": "icon"
         },

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

@@ -24,6 +24,9 @@
           },
           "buttons": {
             "items": {
+              "href": {
+                "ui:field": "attachmentHref"
+              },
               "icon": {
                 "ui:field": "icon"
               },

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

@@ -7,6 +7,9 @@
       "ui:field": "picture"
     },
     "button": {
+      "href": {
+        "ui:field": "attachmentHref"
+      },
       "icon": {
         "ui:field": "icon"
       },

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

@@ -54,7 +54,9 @@ export const CarouselRecommendationCard = JSX<RecommendationCardProps>(
             }
             rightImage={icon?.icon || icon?.src ? <Img image={icon} /> : null}
             buttons={
-              socialMedia.length ? <SocialMedia media={socialMedia} showButtonText={true} /> : null
+              socialMedia.length ? (
+                <SocialMedia media={socialMedia} showButtonText={true} version={rest.version} />
+              ) : null
             }
             isImageAlwaysOnRight={isImageAlwaysOnRight}
           >

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

@@ -4,6 +4,9 @@
       "items": {
         "buttons": {
           "items": {
+            "href": {
+              "ui:field": "attachmentHref"
+            },
             "icon": {
               "ui:field": "icon"
             },

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

@@ -1,7 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
-import { type Picture } from '../../model/Picture';
-import { type ButtonContent } from '../../ui-kit/Button/ButtonContent';
+import type { ButtonVersion } from '../../model/ButtonVersion';
+import type { Picture } from '../../model/Picture';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
 import { Text } from '../../ui-kit/Text/Text';
 import { style } from '../../utils/style';
@@ -12,25 +13,27 @@ export interface SocialMediaProps {
   media?: ButtonContent[];
   showButtonText?: boolean;
   stretched?: boolean;
+  version?: ButtonVersion;
 }
 
 export const SocialMedia = JSX<SocialMediaProps>(
-  ({ className = '', media, showButtonText, stretched, children }) => {
+  ({ className = '', media, showButtonText, stretched, version = 'white', children }) => {
     const [hasText, setHasText] = useState<boolean | undefined>();
     const buttons: ButtonContent[] | undefined = media?.map((_) => {
       const { href, icon, text } = _;
       const { iconMapped } = findIconByHref(href);
       const iconCustom = getFilteredIcon(icon) ?? iconMapped;
-      const buttonText = showButtonText ? { text } : {};
+      const buttonText = showButtonText ? { text } : { text: '' };
 
       if (!hasText && text) {
         setHasText(true);
       }
 
       return {
+        ..._,
         ...buttonText,
         icon: { ...iconCustom, iconVersion: 'color' },
-        version: 'white',
+        version,
       };
     });
 

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

@@ -12,16 +12,23 @@ import { renderBackwardButton } from './renderBackwardButton';
 export interface ProductBlockProps extends UniBlockProps, ProductBlockContent {}
 
 export const ProductBlock = JSX<ProductBlockProps>(
-  ({ className, padding, backwardButton, ...rest }) => {
+  ({ className, padding, backwardButton, showBorder, ...rest }) => {
     const router = useRouter();
     const handleClick = useCallback((ev?: PreventableEvent) => {
       ev?.preventDefault();
       router.back();
     }, []);
+    const borderStyle = showBorder
+      ? 'border border-solid border-gray group-data-secondary:border-white/50 group-data-gray:border-main-divider'
+      : '';
 
     return (
       <BlockWrapper
-        className={style('overflow-hidden flex flex-col gap-3xl box-border', className)}
+        className={style(
+          'overflow-hidden flex flex-col gap-3xl box-border',
+          borderStyle,
+          className,
+        )}
         defaultPadding="p-6xl"
         padding={padding}
         {...rest}

package/mobile/src/components/ProductBlock/ProductBlockContent.ts

@@ -8,4 +8,6 @@ export type ProductBlockContent = UniBlockContent &
   BaseProductTileContent & {
     /** @title Отображать кнопку возврата (только для десктопной версии) */
     backwardButton?: boolean;
+    /** @title Показывать рамку вокруг блока */
+    showBorder?: boolean;
   };

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

@@ -15,6 +15,9 @@
           },
           "buttons": {
             "items": {
+              "href": {
+                "ui:field": "attachmentHref"
+              },
               "icon": {
                 "ui:field": "icon"
               },

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

@@ -4,6 +4,9 @@
       "ui:widget": "html"
     },
     "button": {
+      "href": {
+        "ui:field": "attachmentHref"
+      },
       "icon": {
         "ui:field": "icon"
       },

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

@@ -2,6 +2,9 @@
   "content": {
     "buttons": {
       "items": {
+        "href": {
+          "ui:field": "attachmentHref"
+        },
         "icon": {
           "ui:field": "icon"
         },
@@ -16,6 +19,9 @@
           "ui:field": "icon"
         },
         "button": {
+          "href": {
+            "ui:field": "attachmentHref"
+          },
           "icon": {
             "ui:field": "icon"
           },

package/mobile/src/components/StickyBottomMenu/StickyBottomMenu.tsx

@@ -40,7 +40,6 @@ export const StickyBottomMenu = JSX<StickyBottomMenuProps>(({ ...rest }) => {
       <BlockWrapper
         className="@container-normal fixed w-full h-[74px] bottom-0 left-0 my-0 mx-auto bg-transparent z-[100]"
         padding="p-0"
-        data-component="sticky-bottom-menu"
       >
         <RenderMenuItems menuItems={menuItemsWithButton} onClick={toggle} />
       </BlockWrapper>

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

@@ -16,6 +16,9 @@
               },
               "buttons": {
                 "items": {
+                  "href": {
+                    "ui:field": "attachmentHref"
+                  },
                   "icon": {
                     "ui:field": "icon"
                   },

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

@@ -0,0 +1,38 @@
+import fs from 'fs';
+import path from 'path';
+import util from 'util';
+import type { LinkProps } from '../model/LinkProps';
+import type { TransformationOptions } from './TransformationOptions';
+import { ATTACHMENT_PREFIX } from './transformContentPage';
+
+const copyFile = util.promisify(fs.copyFile);
+
+export async function transformAttachmentLink(
+  link: LinkProps,
+  pagePath: string,
+  options: TransformationOptions,
+): Promise<LinkProps> {
+  if (!link?.href) {
+    return link;
+  }
+
+  const { contentDir, publicDir } = options;
+  const input = link.href.replace(ATTACHMENT_PREFIX, '');
+  const docRelativePath = path.relative(contentDir, input);
+  const output = path.join(publicDir, docRelativePath);
+
+  try {
+    await copyFile(input, output);
+  } catch (e) {
+    console.info(`No "${input}" attachment found on page: "${pagePath}"`);
+
+    return link;
+  }
+
+  const href = path.join('/', docRelativePath);
+
+  return {
+    ...link,
+    href,
+  };
+}

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

@@ -2,11 +2,13 @@ import { fileResolver, resolveRef } from '@redneckz/json-ref';
 import { type JSONNode } from '@redneckz/json-ref/lib/JSONNode';
 import fs from 'fs';
 import util from 'util';
-import { type Attachment } from '../model/Attachment';
-import { type ContentPageDef } from '../model/ContentPageDef';
-import { type Picture } from '../model/Picture';
+import type { Attachment } from '../model/Attachment';
+import type { ContentPageDef } from '../model/ContentPageDef';
+import type { LinkProps } from '../model/LinkProps';
+import type { Picture } from '../model/Picture';
 import { mapJSON } from './mapJSON';
-import { type TransformationOptions } from './TransformationOptions';
+import type { TransformationOptions } from './TransformationOptions';
+import { transformAttachmentLink } from './transformAttachmentLink';
 import { transformDocument } from './transformDocument';
 import { transformHTML } from './transformHTML';
 import { transformMarkdown } from './transformMarkdown';
@@ -17,6 +19,8 @@ const writeFile = util.promisify(fs.writeFile);
 
 const OUTPUT_SUFFIX = '.static';
 
+export const ATTACHMENT_PREFIX = 'file://';
+
 const DOCUMENT_EXT_LIST = [
   '.txt',
   '.doc',
@@ -42,6 +46,8 @@ export async function transformContentPage(
         return await transformMarkdown(value as string);
       } else if (isHTML(key, value)) {
         return await transformHTML(value as string);
+      } else if (isAttachmentLink(value)) {
+        return await transformAttachmentLink(value, pagePath, options);
       } else if (isDocumentRef(value)) {
         return await transformDocument(value, pagePath, options);
       } else if (isPicture(value)) {
@@ -67,6 +73,9 @@ const isMarkdown = (key: string, value: any): value is string =>
 const isHTML = (key: string, value: any): value is string =>
   isString(value) && key?.endsWith('__html');
 
+const isAttachmentLink = (_: any): _ is LinkProps =>
+  isLocalPath(_?.href) && _.href.startsWith(ATTACHMENT_PREFIX);
+
 const isDocumentRef = (_: any): _ is Attachment =>
   isLocalPath(_?.src) && DOCUMENT_EXT_LIST.some((ext) => _.src.toLowerCase().endsWith(ext));
 

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

@@ -17,7 +17,7 @@ export async function transformDocument(
   }
 
   const { contentDir, publicDir } = options;
-  const input = path.join(path.dirname(pagePath), attachment.src);
+  const input = attachment.src;
   const docRelativePath = path.relative(contentDir, input);
   const output = path.join(publicDir, docRelativePath);
   const inputFileSize = (await stat(input)).size;

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

@@ -37,7 +37,7 @@ export function transformImg(
     return src || '';
   }
 
-  const input = path.join(path.dirname(pagePath), src);
+  const input = src;
   const output = computeImgOutputPath(input, options);
 
   const { cache = defaultTransformationCache } = options;

package/mobile/src/ui-kit/List/ListContent.ts

@@ -1,6 +1,5 @@
 /**
  * @title Размер пунктов списка
- * @default M
  * @enumNames ["Очень маленький", "Маленький", "Средний", "Большой"]
  */
 export type ListItemSize = 'XS' | 'S' | 'M' | 'L';

package/mobile/tailwind.config.cjs

@@ -0,0 +1,127 @@
+const config = require('../tailwind.config.cjs');
+
+const quadXL = '1.5rem 1.25rem'; // 24px 20px
+
+module.exports = {
+  ...config,
+  theme: {
+    ...config.theme,
+    extend: {
+      ...config.theme.extend,
+      borderRadius: {
+        icon: '0.375rem',
+      },
+      spacing: {
+        '6xl': '1.5rem', // 24px
+        '5xl': '1.5rem', // 24px
+        '4xl': '1.5rem', // 24px
+        '3xl': '1rem', // 16px
+        '2xl': '1rem', // 16px
+        xl: '1rem', // 16px
+        lg: '1rem', // 16px
+        m: '0.5rem', // 8px
+        s: '0.5rem', // 8px
+        xs: '0.5rem', // 8px
+        '2xs': '0.25rem', // 4px
+        '3xs': '0', // 0
+      },
+      padding: {
+        '6xl': quadXL,
+        '5xl': quadXL,
+        '4xl': quadXL,
+      },
+      fontSize: {
+        ...config.theme.extend.fontSize,
+        'title-extra': ['9.375rem', '13rem'], // 150px 208px
+        h0: [
+          '1.5rem',
+          {
+            // 24px 34px
+            lineHeight: '2.125rem',
+            fontWeight: '400',
+          },
+        ],
+        h1: [
+          '1.5rem',
+          {
+            // 24px 34px
+            lineHeight: '2.125rem',
+            fontWeight: '400',
+          },
+        ],
+        h2: [
+          '1.5rem',
+          {
+            // 24px 34px
+            lineHeight: '2.125rem',
+            fontWeight: '400',
+          },
+        ],
+        h3: [
+          '1.25rem',
+          {
+            // 20px 28px
+            lineHeight: '1.75rem',
+            fontWeight: '400',
+          },
+        ],
+        h4: [
+          '1.25rem',
+          {
+            // 20px 28px
+            lineHeight: '1.75rem',
+            fontWeight: '400',
+          },
+        ],
+        h5: [
+          '1rem',
+          {
+            // 16px 24px
+            lineHeight: '1.5rem',
+            fontWeight: '400',
+          },
+        ],
+        h6: [
+          '1rem',
+          {
+            // 16px 24px
+            lineHeight: '1.5rem',
+            fontWeight: '400',
+          },
+        ],
+        xl: [
+          '1rem',
+          {
+            // 16px 24px
+            lineHeight: '1.5rem',
+            fontWeight: '400',
+          },
+        ],
+        l: [
+          '1rem',
+          {
+            // 16px 24px
+            lineHeight: '1.5rem',
+            fontWeight: '400',
+          },
+        ],
+        s: [
+          '0.875rem',
+          {
+            // 14px 20px
+            lineHeight: '1.25rem',
+            fontWeight: '400',
+          },
+        ],
+        xs: [
+          '0.75rem',
+          {
+            // 12px 18px
+            lineHeight: '1.125rem',
+            fontWeight: '400',
+          },
+        ],
+      },
+    },
+  },
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.20",
+  "version": "0.14.22",
   "private": false,
   "license": "MIT",
   "author": "ЦК",
@@ -69,6 +69,7 @@
     "mobile/src",
     "cosmos-static/icons",
     "tailwind.config.cjs",
+    "mobile/tailwind.config.cjs",
     "!**/*.spec.*"
   ],
   "repository": {

package/src/api/CorporateLeadAPI.ts

@@ -22,6 +22,10 @@ export function CorporateLeadAPI() {
         body: JSON.stringify(body),
       });
 
+      if (!response?.ok) {
+        return null;
+      }
+
       const data = await response.json();
 
       return data;

package/src/components/Bonus/Bonus.ui.json

@@ -12,6 +12,9 @@
         },
         "buttons": {
           "items": {
+            "href": {
+              "ui:field": "attachmentHref"
+            },
             "icon": {
               "ui:field": "icon"
             },

package/src/components/BonusBenefitsBlock/BonusBenefitsBlock.example.json

@@ -3,7 +3,7 @@
     "title": "Вы можете оплатить бонусными баллами",
     "subtitle": "Удобный каталог с большим ассортиментом товаров и сервисов",
     "columnsCount": "4",
-    "cardTextAlign": "center",
+    "cardTextAlign": "text-center",
     "bonusBenefits": [
       {
         "title": "Верхний заголовок",

package/src/components/BonusBenefitsBlock/BonusBenefitsBlock.tsx

@@ -10,7 +10,7 @@ export interface BenefitsBlockProps extends BonusBenefitsBlockContent, UniBlockP
 export const BonusBenefitsBlock = JSX<BenefitsBlockProps>(
   ({
     bonusBenefits,
-    cardTextAlign = 'center',
+    cardTextAlign = 'text-center',
     className = '',
     columnsCount = '4',
     subtitle,

package/src/components/BonusBenefitsBlock/BonusBenefitsBlockContent.ts

@@ -1,4 +1,3 @@
-import { type AlignType } from '../../model/AlignType';
 import {
   type DescriptionProps,
   type SubtitleProps,
@@ -6,6 +5,7 @@ import {
 } from '../../model/HeadlineType';
 import { type UniBlockContent } from '../../model/JSXBlock';
 import { type IconProps } from '../../model/Picture';
+import { type TextAlign } from '../../ui-kit/Text/TextProps';
 
 /**
  * @title Количество элементов в строке
@@ -31,5 +31,5 @@ export type BonusBenefitsBlockContent = UniBlockContent &
     /** @title Список бонусов */
     bonusBenefits?: BonusBenefit[];
     columnsCount?: ColumnsCount;
-    cardTextAlign?: AlignType;
+    cardTextAlign?: TextAlign;
   };