@redneckz/wildless-cms-uni-blocks 0.4.3 → 0.4.5

package/mobile/src/components/Tile/TileContent.ts

@@ -1,15 +1,16 @@
 import type { BlockVersion } from '../../model/BlockVersion';
+import type { DescriptionProps } from '../../model/HeadlineType';
 import type { ButtonContent } from '../../ui-kit/Button/ButtonProps';
-import type { DescriptionProp } from '../../model/HeadlineType';
 import type { HeadingCommonProps } from '../../ui-kit/Heading/HeadingProps';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
 import type { ListContent } from '../../ui-kit/List/ListContent';
+import type { ListItemSize } from '../../ui-kit/List/ListProps';
 
 /**
  * @title Плитка
  */
 export type TileContent = HeadingCommonProps &
-  DescriptionProp &
+  DescriptionProps &
   ListContent &
   ButtonContent &
   ImageContent & {
@@ -18,5 +19,6 @@ export type TileContent = HeadingCommonProps &
      *  @default true
      */
     isDotted?: boolean;
+    listItemSize?: ListItemSize;
     version?: BlockVersion;
   };

package/mobile/src/components/__snapshots__/Blocks.spec.tsx.snap

@@ -8,7 +8,7 @@ exports[`Blocks Accordion should render block "Accordion" without content 1`] =
 
 exports[`Blocks BenefitsBlock should render block "BenefitsBlock" without content 1`] = `
 <section
-  class="font-sans text-primary-text bg-white p-12 flex flex-col items-center "
+  class="font-sans text-primary-text p-12 flex flex-col items-center  bg-white"
 />
 `;
 
@@ -109,7 +109,7 @@ exports[`Blocks ExchangeRateTile should render block "ExchangeRateTile" without
       class="flex grow w-full justify-between"
     >
       <div
-        class="flex flex-col w-full"
+        class="flex flex-col justify-between w-full"
       >
         <div>
           <div
@@ -220,7 +220,7 @@ exports[`Blocks Footer should render block "Footer" without content 1`] = `
         />
       </svg>
       <span
-        class="text-black font-medium ml-2.5"
+        class="text-black font-light ml-2.5"
       >
         Россельхозбанк
       </span>
@@ -260,7 +260,7 @@ exports[`Blocks Footer should render block "Footer" without content 1`] = `
         value=""
       />
       <a
-        class="text-center font-sans select-none inline-block cursor-pointer no-underline focus:border-primary-focus focus:border text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active rounded-md invisible peer-focus:visible absolute top-1 right-1"
+        class="text-center font-sans select-none border border-transparent inline-block cursor-pointer no-underline focus:border-primary-focus focus:border text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active rounded-md invisible peer-focus:visible absolute top-1 right-1"
         role="button"
       >
         <div
@@ -282,7 +282,7 @@ exports[`Blocks Footer should render block "Footer" without content 1`] = `
       >
         <a
           aria-label="Обратная связь"
-          class="text-center font-sans select-none inline-block cursor-pointer no-underline focus:border-primary-focus focus:border text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active rounded-md mb-6 w-full"
+          class="text-center font-sans select-none border border-transparent inline-block cursor-pointer no-underline focus:border-primary-focus focus:border text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active rounded-md mb-6 w-full"
           href="/"
           role="link"
           target="_blank"
@@ -388,12 +388,6 @@ exports[`Blocks GracePeriod should render block "GracePeriod" without content 1`
 </section>
 `;
 
-exports[`Blocks GroupBlock should render block "GroupBlock" without content 1`] = `
-<section
-  class="box-border "
-/>
-`;
-
 exports[`Blocks Header should render block "Header" without content 1`] = `
 <header
   class="pt-6 pb-5 px-20 bg-white "
@@ -429,7 +423,7 @@ exports[`Blocks Header should render block "Header" without content 1`] = `
           />
         </svg>
         <span
-          class="text-black font-medium ml-2.5"
+          class="text-black font-light ml-2.5"
         >
           Россельхозбанк
         </span>
@@ -478,7 +472,7 @@ exports[`Blocks Header should render block "Header" without content 1`] = `
               Иконка Лупа
             </desc>
             <use
-              class="text-black group-hover:text-primary-main pointer-events-none"
+              class="text-black group-hover:text-primary-hover group-hover:invert-0 pointer-events-none"
               href="icons/LoupeIcon.svg#icon"
               xlink:href="icons/LoupeIcon.svg#icon"
             />
@@ -492,7 +486,7 @@ exports[`Blocks Header should render block "Header" without content 1`] = `
         >
           <svg
             aria-hidden="true"
-            class="h-full bg-main-divider rounded-full pointer-events-none"
+            class="h-full bg-main-divider/20 rounded-full pointer-events-none"
           >
             <title>
               Иконка Сетка (белая)
@@ -501,7 +495,7 @@ exports[`Blocks Header should render block "Header" without content 1`] = `
               Иконка Сетка (белая)
             </desc>
             <use
-              class="text-black group-hover:text-primary-main"
+              class="text-black group-hover:text-primary-hover group-hover:invert-0"
               href="icons/GridIcon.svg#icon"
               xlink:href="icons/GridIcon.svg#icon"
             />
@@ -591,7 +585,7 @@ exports[`Blocks MobileAppTile should render block "MobileAppTile" without conten
       class="flex grow w-full justify-between"
     >
       <div
-        class="flex flex-col w-full"
+        class="flex flex-col justify-between w-full"
       >
         <div>
           <div
@@ -620,12 +614,6 @@ exports[`Blocks Navigation should render block "Navigation" without content 1`]
 </section>
 `;
 
-exports[`Blocks NavigatorTabs should render block "NavigatorTabs" without content 1`] = `
-<section
-  class="sticky top-0 z-20 box-border flex gap-x-1 h-14 "
-/>
-`;
-
 exports[`Blocks OtherProducts should render block "OtherProducts" without content 1`] = `
 <section
   class="font-sans text-primary-text "
@@ -687,7 +675,7 @@ exports[`Blocks Placeholder should render block "Placeholder" without content 1`
 
 exports[`Blocks ProductBlock should render block "ProductBlock" without content 1`] = `
 <section
-  class="font-sans overflow-hidden p-[50px] flex flex-col box-border min-h-[528px] bg-white text-primary-text "
+  class="font-sans overflow-hidden p-[50px] flex flex-col box-border min-h-[454px] bg-white text-primary-text "
 >
   <div
     class="flex grow justify-between items-stretch h-full "
@@ -706,7 +694,7 @@ exports[`Blocks ProductBlock should render block "ProductBlock" without content
           class="flex grow w-full justify-between"
         >
           <div
-            class="flex flex-col w-full"
+            class="flex flex-col justify-between w-full"
           >
             <div />
           </div>
@@ -735,18 +723,14 @@ exports[`Blocks ProductGallery should render block "ProductGallery" without cont
 
 exports[`Blocks ProductTile should render block "ProductTile" without content 1`] = `
 <section
-  class="bg-white overflow-hidden text-primary-text font-sans p-9 box-border min-h-[364px] relative justify-between grid  bg-white text-primary-text pr-[9.4rem] min-h-[360px] "
+  class="overflow-hidden font-sans p-9 box-border relative justify-between grid  bg-white text-primary-text pr-[9.4rem] min-h-[360px]"
 >
+  <section
+    class="font-sans flex flex-col p-[50px] gap-2 bg-white !p-0 z-10 "
+  />
   <div
-    class="z-[1]"
-  >
-    <section
-      class="font-sans flex flex-col p-[50px] gap-2 bg-white !p-0"
-    />
-    <div
-      class="flex mt-3.5"
-    />
-  </div>
+    class="z-10 grid grid-cols-[max-content_1fr] auto-rows-auto gap-x-6 gap-y-2.5 items-baseline max-w-[calc(100%-186px)]"
+  />
 </section>
 `;
 
@@ -757,22 +741,20 @@ exports[`Blocks PromoTile should render block "PromoTile" without content 1`] =
   <div
     class="font-sans flex flex-col grow h-full items-start "
   >
-    <div>
-      <section
-        class="font-sans flex flex-col p-[50px] gap-4 bg-white !p-0 max-w-[600px]"
+    <section
+      class="font-sans flex flex-col p-[50px] gap-4 bg-white !p-0 max-w-[600px]"
+    >
+      <h2
+        class="font-sans m-0 text-h2 whitespace-pre-wrap text-primary-text text-left"
       >
-        <h2
-          class="font-sans m-0 text-h2 whitespace-pre-wrap text-primary-text text-left"
-        >
-          Акции и спецпредложения
-        </h2>
-      </section>
-    </div>
+        Акции и спецпредложения
+      </h2>
+    </section>
     <div
       class="flex grow w-full justify-between"
     >
       <div
-        class="flex flex-col w-full"
+        class="flex flex-col justify-between w-full"
       >
         <div>
           <div
@@ -866,6 +848,12 @@ exports[`Blocks SafeDepositRental should render block "SafeDepositRental" withou
               class="appearance-none h-14 border border-gray p-4 rounded-md text-s w-full cursor-pointer"
               style="background: url(/icons/ArrowDownIcon.svg) no-repeat 50%;"
             >
+              <option
+                class=""
+                value="выберите отделение"
+              >
+                выберите отделение
+              </option>
               <option
                 class=""
                 value="МоскваОфис1"
@@ -1023,7 +1011,6 @@ exports[`Blocks SafeDepositRental should render block "SafeDepositRental" withou
               class="flex items-center relative cursor-pointer"
             >
               <input
-                checked=""
                 class="appearance-none flex justify-center items-center w-5 h-5 border-2 border-primary-main rounded-full cursor-pointer after:block after:w-2.5 after:h-2.5 after:rounded-full checked:after:bg-primary-main"
                 name="contractType"
                 type="radio"
@@ -1041,6 +1028,7 @@ exports[`Blocks SafeDepositRental should render block "SafeDepositRental" withou
               class="flex items-center relative cursor-pointer"
             >
               <input
+                checked=""
                 class="appearance-none flex justify-center items-center w-5 h-5 border-2 border-primary-main rounded-full cursor-pointer after:block after:w-2.5 after:h-2.5 after:rounded-full checked:after:bg-primary-main"
                 name="contractType"
                 type="radio"
@@ -1055,7 +1043,7 @@ exports[`Blocks SafeDepositRental should render block "SafeDepositRental" withou
           </div>
         </div>
         <a
-          class="text-center font-sans select-none inline-block cursor-pointer no-underline focus:border-primary-focus focus:border text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active rounded-md "
+          class="text-center font-sans select-none border border-transparent inline-block cursor-pointer no-underline focus:border-primary-focus focus:border text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active rounded-md "
           role="button"
         >
           <div
@@ -1163,7 +1151,7 @@ exports[`Blocks Tabs should render block "Tabs" without content 1`] = `
 
 exports[`Blocks TariffsTable should render block "TariffsTable" without content 1`] = `
 <section
-  class="bg-white font-sans py-[50px] pl-[50px] overflow-hidden text-primary-text relative "
+  class="bg-white font-sans p-[50px] overflow-hidden text-primary-text relative  "
 />
 `;
 
@@ -1188,7 +1176,7 @@ exports[`Blocks Tile should render block "Tile" without content 1`] = `
       class="flex grow w-full justify-between"
     >
       <div
-        class="flex flex-col w-full"
+        class="flex flex-col justify-between w-full"
       >
         <div />
       </div>

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

@@ -18,11 +18,16 @@ export async function transformContentPage(
   // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
   return mapJSON<ContentPageDef>(JSON.parse(content), async (value: any, [key]) => {
     const isMarkdown = typeof value === 'string' && key?.endsWith('__md');
-    const isPicture = value && isLocalPath(value?.src);
+
     if (isMarkdown) {
       return await transformMarkdown(value);
-    } else if (isPicture) {
-      return await transformPicture(pagePath, value as Picture, options);
+    } else if (isPicture(value)) {
+      try {
+        return await transformPicture(pagePath, value, options);
+      } catch (ex) {
+        console.warn('Error while transforming picture on page: %s', pagePath);
+        console.error(ex);
+      }
     }
 
     return value;
@@ -34,3 +39,5 @@ const isLocalPath = (_: any): boolean => isString(_) && _.length < 512 && !isURL
 const isString = (_: any): _ is string => Boolean(_ && typeof _ === 'string');
 
 const isURL = (src: string) => ['data:', 'https:', 'http:'].some((proto) => src.startsWith(proto));
+
+const isPicture = (_: any): _ is Picture => Boolean(_ && isLocalPath(_?.src));

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

@@ -0,0 +1,157 @@
+import fs from 'fs';
+import path from 'path';
+import util from 'util';
+import sharp from 'sharp';
+import type { ResizeOptions, Sharp } from 'sharp';
+import type { ImageSize } from '../model/ImageSize';
+import type { TransformationOptions } from './TransformationOptions';
+import type { ImgAlignment, ImgSource, Picture } from '../model/Picture';
+import { transformSrc } from './transformSrc';
+import { isPictureSizeEmpty } from '../utils/isPictureSizeEmpty';
+
+const mkdir = util.promisify(fs.mkdir);
+
+type TransformImgParams = {
+  pagePath: string;
+  src: string;
+  containerSize?: ImageSize;
+  transformationOptions: TransformationOptions & ImgSource;
+};
+
+export async function transformImg({
+  pagePath,
+  src,
+  containerSize,
+  transformationOptions,
+}: TransformImgParams): Promise<string> {
+  if (!src) {
+    return '';
+  }
+
+  const { contentDir, publicDir, format, options, size, alignment } = transformationOptions;
+
+  const pageDir = path.dirname(pagePath);
+  const imgPath = `${pageDir}/${src}`;
+  let chain = sharp(imgPath);
+
+  const targetSize = getPictureSize(size, containerSize);
+
+  if (targetSize) {
+    chain = resizeImg(chain, targetSize, getResizeFit(targetSize));
+  }
+
+  if (containerSize) {
+    chain = resizeImg(chain, containerSize);
+
+    // Save intermediate transform result to modify further
+    const { data } = await chain.toBuffer({ resolveWithObject: true });
+
+    chain = resizeImg(
+      sharp(data),
+      getCompositionResizeSize(containerSize, targetSize),
+      getResizeFit(targetSize),
+    );
+
+    chain = await compositeImg({ chain, containerSize, alignment });
+  }
+
+  if (format) {
+    chain = chain.toFormat(format, options);
+  }
+
+  const transformedSrc = transformSrc(src, transformationOptions);
+  const transformedImgPath = `${publicDir}/${path.relative(
+    contentDir,
+    `${path.dirname(pagePath)}/${transformedSrc}`,
+  )}`;
+
+  await mkdir(path.dirname(transformedImgPath), { recursive: true });
+
+  try {
+    await chain.toFile(transformedImgPath);
+  } catch (e) {
+    console.error(e);
+  }
+
+  return transformedSrc;
+}
+
+function createBackgroundImageChain({ width, height }: ImageSize) {
+  const channels = 4;
+  const rgbaColor = 0x00000000;
+
+  const canvas = Buffer.alloc(width * height * channels, rgbaColor);
+
+  return sharp(canvas, { raw: { width, height, channels } });
+}
+
+function resizeImg(chain: Sharp, size: Picture['size'], options?: ResizeOptions) {
+  return chain.resize(size?.width, size?.height, {
+    fit: sharp.fit.fill,
+    background: { r: 0, g: 0, b: 0, alpha: 0 },
+    ...options,
+  });
+}
+
+type CompositeImgParams = {
+  chain: Sharp;
+  containerSize: ImageSize;
+  alignment?: ImgAlignment;
+};
+
+async function compositeImg({
+  chain,
+  containerSize,
+  alignment,
+}: CompositeImgParams): Promise<Sharp> {
+  const { data } = await chain.toBuffer({ resolveWithObject: true });
+
+  return createBackgroundImageChain(containerSize).composite([
+    {
+      input: data,
+      gravity: alignment,
+    },
+  ]);
+}
+
+function getPictureSize(size: Picture['size'], containerSize?: ImageSize) {
+  // If containerSize is undefined intrinsic dimensions of image will be used then.
+  return isPictureSizeEmpty(size) ? containerSize : size;
+}
+
+function getCompositionResizeSize(
+  containerSize: ImageSize,
+  size: Picture['size'] = {},
+): Picture['size'] {
+  const { width, height } = size;
+  const { width: containerWidth, height: containerHeight } = containerSize;
+
+  let widthRatio = 0;
+  let heightRatio = 0;
+
+  if (!(width || height)) {
+    return undefined;
+  }
+
+  if (width) {
+    widthRatio = containerWidth / width;
+  }
+
+  if (height) {
+    heightRatio = containerHeight / height;
+  }
+
+  return widthRatio > heightRatio
+    ? { width: Math.min(Number(width), containerWidth) }
+    : { height: Math.min(Number(height), containerHeight) };
+}
+
+function getResizeFit(size: Picture['size']): ResizeOptions {
+  /*
+    Editor behaviour with one dimension present: resize by given dimension maintaining aspect ratio. (fit: contain)
+    With two dimensions present: resize trying to fill given dimensions (fit: fill)
+   */
+  return {
+    fit: size?.width && size?.height ? sharp.fit.fill : sharp.fit.contain,
+  };
+}

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

@@ -1,11 +1,8 @@
-import fs from 'fs';
 import path from 'path';
 import sharp from 'sharp';
-import util from 'util';
-import type { ImgSource, Picture } from '../model/Picture';
+import type { Picture } from '../model/Picture';
 import type { TransformationOptions } from './TransformationOptions';
-
-const mkdir = util.promisify(fs.mkdir);
+import { transformImg } from './transformImg';
 
 export async function transformPicture(
   pagePath: string,
@@ -14,8 +11,27 @@ export async function transformPicture(
 ): Promise<Picture> {
   const sources = picture.sources || [];
   const src = picture?.src || '';
-  const [transformedPicture, ...transformedSources] = await Promise.all(
-    [picture].concat(sources).map((_) => transformImg(pagePath, src, { ...options, ..._ })),
+
+  const transformedPicture = await transformImg({
+    pagePath,
+    src,
+    transformationOptions: { ...options, ...picture },
+  });
+
+  const { width, height } = await sharp(
+    path.resolve(options.publicDir, transformedPicture),
+  ).metadata();
+  const containerSize = width && height ? { width, height } : undefined;
+
+  const transformedSources = await Promise.all(
+    sources.map((_) =>
+      transformImg({
+        pagePath,
+        src,
+        containerSize,
+        transformationOptions: { ...options, ..._ },
+      }),
+    ),
   );
 
   return {
@@ -24,57 +40,7 @@ export async function transformPicture(
     sources: transformedSources.map((_, i) => ({
       ...sources[i],
       src: _,
+      size: { width, height },
     })),
   };
 }
-
-async function transformImg(
-  pagePath: string,
-  src: string,
-  transformationOptions: TransformationOptions & ImgSource,
-): Promise<string> {
-  const { contentDir, publicDir, format, options, size } = transformationOptions;
-
-  const pageDir = path.dirname(pagePath);
-  const imgPath = `${pageDir}/${src}`;
-  let chain = sharp(imgPath);
-  if (size) {
-    chain = chain.resize(size?.width, size?.height, {
-      fit: sharp.fit.contain,
-      background: [0, 0, 0, 0],
-    });
-  }
-  if (format) {
-    chain = chain.toFormat(format, options);
-  }
-
-  const transformedSrc = transformSrc(src, transformationOptions);
-  const transformedImgPath = `${publicDir}/${path.relative(
-    contentDir,
-    `${path.dirname(pagePath)}/${transformedSrc}`,
-  )}`;
-
-  await mkdir(path.dirname(transformedImgPath), { recursive: true });
-
-  try {
-    await chain.toFile(transformedImgPath);
-  } catch (e) {
-    console.error(e);
-  }
-
-  return transformedSrc;
-}
-
-function transformSrc(src: string, { format, size }: TransformationOptions & ImgSource): string {
-  const noTransform = !format && !size;
-  if (noTransform) {
-    return src;
-  }
-
-  const fileName = path.basename(src, path.extname(src));
-  const fileSizes = [size?.width, size?.height].filter(Boolean);
-  const suffix = fileSizes.length ? `-${fileSizes.join('-')}` : '';
-  const ext = String(format) || path.extname(src);
-
-  return `${fileName}${suffix}.${ext}`;
-}

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

@@ -0,0 +1,21 @@
+import path from 'path';
+import type { ImgSource } from '../model/Picture';
+import type { TransformationOptions } from './TransformationOptions';
+import { isPictureSizeEmpty } from '../utils/isPictureSizeEmpty';
+
+export function transformSrc(
+  src: string,
+  { format, size }: TransformationOptions & ImgSource,
+): string {
+  const noTransform = isPictureSizeEmpty(size) && !format;
+  if (noTransform) {
+    return src;
+  }
+
+  const fileName = path.basename(src, path.extname(src));
+  const fileSizes = [size?.width, size?.height].filter(Boolean);
+  const suffix = fileSizes.length ? `-${fileSizes.join('-')}` : '';
+  const ext = format ? String(format) : 'webp';
+
+  return `${fileName}${suffix}.${ext}`;
+}

package/mobile/src/hooks/useExchangeRates.ts

@@ -1,5 +1,7 @@
 import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
 import type { ExchangeCurrencyItem } from '../components/ExchangeRateTile/ExchangeCurrencyCalculator';
+import { fetchJSON } from '../utils/fetchJSON';
+import { roundTo } from '../utils/roundTo';
 
 interface RatesData {
   code: string;
@@ -15,22 +17,11 @@ export function useExchangeRates(): ExchangeCurrencyItem[] {
   return result.length ? getCurrencyListByRate(result as RatesData[]) : result;
 }
 
-async function fetchExchangeRates(): Promise<any | undefined> {
-  try {
-    const response = await fetch(EXCHANGE_RATES_URL, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify(EXCHANGE_RATES_BODY),
-    });
-
-    return await response.json();
-  } catch (err) {
-    console.error(err);
-
-    return Promise.resolve();
-  }
+function fetchExchangeRates(): Promise<any | undefined> {
+  return fetchJSON(EXCHANGE_RATES_URL, {
+    method: 'POST',
+    body: JSON.stringify(EXCHANGE_RATES_BODY),
+  });
 }
 
 const EXCHANGE_RATES_URL =
@@ -76,12 +67,10 @@ const getCurrencyListByRate = (currencyRates: RatesData[]) =>
     if (!result.some((i) => i.code === currencyCode)) {
       result.push({
         code: currencyCode,
-        buy: roundRate(Number(_.rate_buy)),
-        sell: roundRate(Number(_.rate_sell)),
+        buy: roundTo(Number(_.rate_buy), 3),
+        sell: roundTo(Number(_.rate_sell), 3),
       });
     }
 
     return result;
   }, []);
-
-const roundRate = (value) => Math.round(value * 1000) / 1000;

package/mobile/src/hooks/useTariffsInnerTableData.ts

@@ -0,0 +1,20 @@
+import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
+
+export function useTariffsInnerTableData(directoryName?: string): any {
+  const { data } = useAsyncData(
+    tariffsInnerTableDataUrl(directoryName),
+    fetchTariffsInnerTableData,
+  );
+
+  return data || {};
+}
+
+async function fetchTariffsInnerTableData(url: string): Promise<any> {
+  const response = await fetch(url);
+
+  return await response.json();
+}
+
+function tariffsInnerTableDataUrl(directoryName?: string) {
+  return `/wcms-resources/${directoryName || 'tariffs-inner-table-data'}.json`;
+}

package/mobile/src/icons/CardTickIcon.svg

@@ -1 +1,7 @@
-<svg title="Кред. карта с галочкой" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2 8.5h11.5M6 16.5h2M10.5 16.5h4" stroke="#000000" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/><path d="M2 11.01V7.89c0-3.51.89-4.39 4.44-4.39h7.06M22 11.03v5.08c0 3.51-.89 4.39-4.44 4.39H6.44C2.89 20.5 2 19.62 2 16.11v-1.1" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.5 6 18 7.5l4-4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
+<svg title="Кред. карта с галочкой" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 10H22" stroke="#1C1C1C" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M11.5502 20.4998H6.44025C2.89025 20.4998 1.99023 19.6198 1.99023 16.1098V7.88977C1.99023 4.70977 2.73026 3.68977 5.52026 3.52977C5.80026 3.51977 6.11025 3.50977 6.44025 3.50977H17.5502C21.1002 3.50977 22.0002 4.38977 22.0002 7.89977V12.3098" stroke="#1C1C1C" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6 16H10" stroke="#1C1C1C" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M22 18C22 18.75 21.79 19.46 21.42 20.06C20.73 21.22 19.46 22 18 22C16.54 22 15.27 21.22 14.58 20.06C14.21 19.46 14 18.75 14 18C14 15.79 15.79 14 18 14C20.21 14 22 15.79 22 18Z" stroke="#42AB44" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16.4395 18L17.4294 18.99L19.5594 17.02" stroke="#42AB44" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/mobile/src/icons/DocDownload.svg

@@ -0,0 +1,8 @@
+<svg title="Скачать документ" width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.59766 11.959V14.1673L9.26432 12.5007" stroke="#42AB44" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7.59766 9.16602V9.99935" stroke="#42AB44" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7.59635 14.1667L5.92969 12.5" stroke="#42AB44" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M1.76562 7.49935C1.76562 3.33268 3.43229 1.66602 7.59896 1.66602H11.7656" stroke="#42AB44" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M18.4323 8.33398V12.5007C18.4323 16.6673 16.7656 18.334 12.599 18.334H7.59896C3.43229 18.334 1.76562 16.6673 1.76562 12.5007V10.8173" stroke="#42AB44" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M15.099 8.33268C12.599 8.33268 11.7656 7.49935 11.7656 4.99935V1.66602L18.4323 8.33268" stroke="#42AB44" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>