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

package/src/components/Accordion/AccordionContent.ts

@@ -1,109 +1,4 @@
-import type { GalleryContent } from '../Gallery/GalleryContent';
-import type { HeadlineContent } from '../Headline/HeadlineContent';
-import type { LinkDocsContent } from '../LinkDocs/LinkDocsContent';
-import type { MiniGalleryContent } from '../MiniGallery/MiniGalleryContent';
-import type { PictureTextContent } from '../PictureText/PictureTextContent';
-import type { ProductBlockContent } from '../ProductBlock/ProductBlockContent';
-import type { ProductTileContent } from '../ProductTile/ProductTileContent';
-import type { TextBlockContent } from '../TextBlock/TextBlockContent';
-import type { TileContent } from '../Tile/TileContent';
-import type { LinkListContent } from '../LinkList/LinkListContent';
-
-/**
- * @title Тип блока
- */
-export type AccordionBlockType =
-  | 'Headline'
-  | 'LinkDocs'
-  | 'TextBlock'
-  | 'PictureText'
-  | 'Tile'
-  | 'ProductTile'
-  | 'ProductBlock'
-  | 'Gallery'
-  | 'MiniGallery'
-  | 'LinkList';
-
-interface AccordionBlockDef {
-  accordionBlockType: AccordionBlockType;
-}
-
-/**
- * @title Заголовок
- */
-export type HeadlineAccordionBlockDef = HeadlineContent & AccordionBlockDef;
-
-/**
- * @title Список документов
- */
-export type LinkDocsAccordionBlockDef = LinkDocsContent & AccordionBlockDef;
-
-/**
- * @title Текстовый блок
- */
-export type TextBlockAccordionBlockDef = TextBlockContent & AccordionBlockDef;
-
-/**
- * @title Картинка с текстом
- */
-export type PictureTextAccordionBlockDef = PictureTextContent & AccordionBlockDef;
-
-/**
- * @title Продуктовый блок
- */
-export type ProductBlockAccordionBlockDef = ProductBlockContent & AccordionBlockDef;
-
-/**
- * @title Плитка
- */
-export type TileAccordionBlockDef = TileContent & AccordionBlockDef;
-
-/**
- * @title Продуктовая плитка
- */
-export type ProductTileAccordionBlockDef = ProductTileContent & AccordionBlockDef;
-
-/**
- * @title Галлерея
- */
-export type GalleryAccordionBlockDef = GalleryContent & AccordionBlockDef;
-
-/**
- * @title Мини-галлерея
- */
-export type MiniGalleryAccordionBlockDef = MiniGalleryContent & AccordionBlockDef;
-
-/**
- * @title Список ссылок
- */
-export type LinkListAccordionBlockDef = LinkListContent & AccordionBlockDef;
-
-/**
- * @title Выберите блок
- */
-export type EmptyOption = null;
-
-/**
- * @title Содержимое аккордеона
- */
-export type AccordionBlockProps =
-  | EmptyOption
-  | HeadlineAccordionBlockDef
-  | LinkDocsAccordionBlockDef
-  | TextBlockAccordionBlockDef
-  | PictureTextAccordionBlockDef
-  | ProductBlockAccordionBlockDef
-  | TileAccordionBlockDef
-  | ProductTileAccordionBlockDef
-  | GalleryAccordionBlockDef
-  | MiniGalleryAccordionBlockDef
-  | LinkListAccordionBlockDef;
-
-/**
- * @title Количество колонок
- * @enumNames ["1 колонка", "2 колонки"]
- */
-export type ColumnsCount = 1 | 2;
+import type { BlockDef, ColumnsCount } from '../../ui-kit/BlocksList/BlocksListProps';
 
 /**
  * @title Элемент списка
@@ -115,13 +10,12 @@ export interface AccordionItemCommonProps {
    */
   label?: string;
   /** @title Блоки */
-  blocks?: AccordionBlockProps[];
+  blocks?: BlockDef[];
   /**
    * @title Отображать/скрывать обводку элемента
    * @default false
    */
   bordered?: boolean; // TODO: только для мобильной версии
-
   columns?: ColumnsCount;
 }
 

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

@@ -3,12 +3,12 @@ import type { UniBlockProps } from '../../types';
 import { Icon } from '../../ui-kit/Icon/Icon';
 import type { AccordionItemCommonProps } from './AccordionContent';
 import { AccordionItemInner } from './AccordionItemInner';
-import { isActiveHandler } from './utils/isActiveHandler';
+import { useActiveHandler } from './utils/useActiveHandler';
 
 export interface AccordionItemProps extends AccordionItemCommonProps, UniBlockProps {}
 
 export const AccordionItem = JSX<AccordionItemProps>(({ label, blocks, bordered, context }) => {
-  const { hasContent, icon, handleToggle } = isActiveHandler({
+  const { hasContent, icon, handleToggle } = useActiveHandler({
     context,
     blocks,
   });

package/src/components/Accordion/AccordionItem.tsx

@@ -3,12 +3,12 @@ import type { UniBlockProps } from '../../types';
 import { Icon } from '../../ui-kit/Icon/Icon';
 import type { AccordionItemCommonProps } from './AccordionContent';
 import { AccordionItemInner } from './AccordionItemInner';
-import { isActiveHandler } from './utils/isActiveHandler';
+import { useActiveHandler } from './utils/useActiveHandler';
 
 export interface AccordionItemProps extends AccordionItemCommonProps, UniBlockProps {}
 
 export const AccordionItem = JSX<AccordionItemProps>(({ label, blocks, columns, context }) => {
-  const { hasContent, icon, handleToggle } = isActiveHandler({
+  const { hasContent, icon, handleToggle } = useActiveHandler({
     context,
     blocks,
   });

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

@@ -1,28 +1,13 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { JSXBlock } from '../ContentPage/ContentPage';
-import type { ContentPageContext } from '../ContentPage/ContentPageContext';
-import { AccordionBlocks } from './AccordionBlocks';
-import type { AccordionBlockProps } from './AccordionContent';
 import type { AccordionItemProps } from './AccordionItem';
+import { renderBlocksList } from '../../ui-kit/BlocksList/renderBlocksList';
 
 export const AccordionItemInner = JSX<AccordionItemProps>(({ blocks, context }) => {
+  const className = 'mb-5 last:mb-0 first:mt-2';
+  const columns = 1;
   return (
     <div className="transition-all duration-300 max-h-0 overflow-hidden group-last:last:pb-0">
-      {blocks?.length ? blocks.map(renderBlock(context)) : null}
+      {renderBlocksList({ context, className, columns, blocks })}
     </div>
   );
 });
-
-const renderBlock = (context: ContentPageContext) => (block: AccordionBlockProps, i: number) => {
-  const type = block?.accordionBlockType;
-  if (!type || !(type in AccordionBlocks)) {
-    return null;
-  }
-
-  const AccordionBlock: JSXBlock = AccordionBlocks[type];
-  return (
-    <div className="mb-5 last:mb-0 first:mt-2" key={`block_${i}`}>
-      <AccordionBlock context={context} {...block} className="!p-0" />
-    </div>
-  );
-};

package/src/components/Accordion/AccordionItemInner.tsx

@@ -1,33 +1,12 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { JSXBlock } from '../ContentPage/ContentPage';
-import type { ContentPageContext } from '../ContentPage/ContentPageContext';
-import { AccordionBlocks } from './AccordionBlocks';
-import type { AccordionBlockProps } from './AccordionContent';
 import type { AccordionItemProps } from './AccordionItem';
+import { renderBlocksList } from '../../ui-kit/BlocksList/renderBlocksList';
 
 export const AccordionItemInner = JSX<AccordionItemProps>(({ blocks, columns = 1, context }) => {
+  const className = 'mb-5 last:mb-0 pb-5';
   return (
-    <div
-      className={
-        'transition-all duration-300 max-h-0 overflow-hidden group-last:last:pb-0 flex flex-wrap'
-      }
-    >
-      {blocks?.length ? blocks.map(renderBlock(context, columns)) : null}
+    <div className="transition-all duration-300 max-h-0 overflow-hidden">
+      {renderBlocksList({ context, className, columns, blocks })}
     </div>
   );
 });
-
-const renderBlock =
-  (context: ContentPageContext, columns: number) => (block: AccordionBlockProps, i: number) => {
-    const type = block?.accordionBlockType;
-    if (!type || !(type in AccordionBlocks)) {
-      return null;
-    }
-    const columnsCountClass = columns === 2 ? 'w-1/2' : '';
-    const AccordionBlock: JSXBlock = AccordionBlocks[type];
-    return (
-      <div className={`mb-5 last:mb-0 pb-5 ${columnsCountClass}`} key={`block_${i}`}>
-        <AccordionBlock context={context} {...block} className="!p-0" />
-      </div>
-    );
-  };

package/src/components/Accordion/utils/{isActiveHandler.ts → useActiveHandler.ts}

@@ -1,6 +1,6 @@
 import type { IconName } from '../../../icons/IconName';
 
-export const isActiveHandler = ({ context, blocks }) => {
+export const useActiveHandler = ({ context, blocks }) => {
   const [isActive, setIsActive] = context.useState(false);
   const hasContent = blocks?.length;
   const icon: IconName = isActive ? 'MinusIcon' : 'PlusIcon';

package/src/components/Blocks.ts

@@ -18,6 +18,7 @@ import { ProductGallery } from './ProductGallery/ProductGallery';
 import { ProductGalleryGreen } from './ProductGalleryGreen/ProductGalleryGreen';
 import { ProductTile } from './ProductTile/ProductTile';
 import { PromoTile } from './PromoTile/PromoTile';
+import { OtherProducts } from './OtherProducts/OtherProducts';
 import { Recommendation } from './Recommendation/Recommendation';
 import { StepsBlock } from './StepsBlock/StepsBlock';
 import { TariffsTable } from './TariffsTable/TariffsTable';
@@ -43,6 +44,7 @@ export const Blocks = {
   ProductGalleryGreen,
   ProductTile,
   PromoTile,
+  OtherProducts,
   Recommendation,
   StepsBlock,
   TariffsTable,

package/src/components/OtherProducts/OtherProducts.example.json

@@ -0,0 +1,50 @@
+{
+  "title": "Другие продукты",
+  "blockItems": [
+    {
+      "label": "Другие продукты 1",
+      "blocks": [
+        {
+          "blockListType": "TextBlock",
+          "title": "Текстовый блок",
+          "description": "Описание текстового блока"
+        },
+        {
+          "blockListType": "TextBlock",
+          "title": "Текстовый блок №2",
+          "description": "Описание текстового блока №2"
+        }
+      ]
+    },
+    {
+      "label": "Другие продукты 2",
+      "blocks": [
+        {
+          "blockListType": "TextBlock",
+          "title": "Текстовый блок",
+          "description": "Описание текстового блока"
+        },
+        {
+          "blockListType": "TextBlock",
+          "title": "Текстовый блок №2",
+          "description": "Описание текстового блока №2"
+        }
+      ]
+    },
+    {
+      "label": "Другие продукты 3",
+      "blocks": [
+        {
+          "blockListType": "TextBlock",
+          "title": "Текстовый блок",
+          "description": "Описание текстового блока"
+        },
+        {
+          "blockListType": "TextBlock",
+          "title": "Текстовый блок №2",
+          "description": "Описание текстового блока №2"
+        }
+      ]
+    }
+  ]
+}

package/src/components/OtherProducts/OtherProducts.fixture.tsx

@@ -0,0 +1,137 @@
+import { context } from '../../setup-fixture';
+import { PRODUCT_BLOCK } from '../ProductBlock/ProductBlock.fixture';
+import { PRODUCT_TILE, PRODUCT_PENSION_TILE } from '../ProductTile/ProductTile.fixture';
+import { TEXT_BLOCK } from '../TextBlock/TextBlock.fixture';
+import { TILE, TILE_PREMIUM } from '../Tile/Tile.fixture';
+import type { OtherProductsProps } from './OtherProducts';
+import { OtherProducts } from './OtherProducts';
+import type {
+  ProductBlockBlockListDef,
+  ProductTileBlockListDef,
+  TextBlockBlockListDef,
+  TileBlockListDef,
+} from '../../ui-kit/BlocksList/BlocksListProps';
+
+const TEXT_BLOCK_OTHER_BLOCK: TextBlockBlockListDef = {
+  blockListType: 'TextBlock',
+  ...TEXT_BLOCK,
+};
+
+const PRODUCT_BLOCK_OTHER_BLOCK: ProductBlockBlockListDef = {
+  blockListType: 'ProductBlock',
+  ...PRODUCT_BLOCK,
+};
+
+const TILES_OTHER_BLOCK: TileBlockListDef = {
+  blockListType: 'Tile',
+  ...TILE,
+};
+
+const TILES_PREMIUM_OTHER_BLOCK: TileBlockListDef = {
+  blockListType: 'Tile',
+  ...TILE_PREMIUM,
+};
+
+const PRODUCT_TILES_OTHER_BLOCK: ProductTileBlockListDef = {
+  blockListType: 'ProductTile',
+  ...PRODUCT_TILE,
+};
+
+const PRODUCT_PENSION_TILES__OTHER_BLOCK: ProductTileBlockListDef = {
+  blockListType: 'ProductTile',
+  ...PRODUCT_PENSION_TILE,
+};
+
+const propsBlock: OtherProductsProps = {
+  context,
+  blockItems: [
+    {
+      label: 'Другие кредитные карты Россельхозбанка 1',
+      blocks: [
+        TILES_PREMIUM_OTHER_BLOCK,
+        TILES_PREMIUM_OTHER_BLOCK,
+        TILES_OTHER_BLOCK,
+        TILES_OTHER_BLOCK,
+      ],
+    },
+    {
+      label: 'Другие кредитные карты Россельхозбанка 2',
+      blocks: [
+        PRODUCT_TILES_OTHER_BLOCK,
+        PRODUCT_TILES_OTHER_BLOCK,
+        PRODUCT_PENSION_TILES__OTHER_BLOCK,
+        PRODUCT_PENSION_TILES__OTHER_BLOCK,
+      ],
+    },
+    {
+      label: 'Другие кредитные карты Россельхозбанка 3',
+      blocks: [PRODUCT_BLOCK_OTHER_BLOCK, PRODUCT_BLOCK_OTHER_BLOCK],
+    },
+
+    {
+      label: 'Другие кредитные карты Россельхозбанка 4',
+      blocks: [
+        TEXT_BLOCK_OTHER_BLOCK,
+        TEXT_BLOCK_OTHER_BLOCK,
+        TEXT_BLOCK_OTHER_BLOCK,
+        TEXT_BLOCK_OTHER_BLOCK,
+      ],
+    },
+  ],
+};
+
+const propsTwoColumns: OtherProductsProps = {
+  context,
+  blockItems: [
+    {
+      label: 'Другие кредитные карты Россельхозбанка 1',
+      blocks: [
+        TILES_PREMIUM_OTHER_BLOCK,
+        TILES_PREMIUM_OTHER_BLOCK,
+        TILES_OTHER_BLOCK,
+        TILES_OTHER_BLOCK,
+      ],
+      columns: 2,
+    },
+    {
+      label: 'Другие кредитные карты Россельхозбанка 2',
+      blocks: [
+        PRODUCT_TILES_OTHER_BLOCK,
+        PRODUCT_TILES_OTHER_BLOCK,
+        PRODUCT_PENSION_TILES__OTHER_BLOCK,
+        PRODUCT_PENSION_TILES__OTHER_BLOCK,
+      ],
+      columns: 2,
+    },
+    {
+      label: 'Другие кредитные карты Россельхозбанка 3',
+      blocks: [PRODUCT_BLOCK_OTHER_BLOCK, PRODUCT_BLOCK_OTHER_BLOCK],
+      columns: 2,
+    },
+
+    {
+      label: 'Другие кредитные карты Россельхозбанка 4',
+      blocks: [
+        TEXT_BLOCK_OTHER_BLOCK,
+        TEXT_BLOCK_OTHER_BLOCK,
+        TEXT_BLOCK_OTHER_BLOCK,
+        TEXT_BLOCK_OTHER_BLOCK,
+      ],
+      columns: 2,
+    },
+  ],
+};
+
+export default {
+  default: (
+    <div className="container grid grid-cols-12">
+      <OtherProducts className="col-span-12" {...propsBlock} />
+    </div>
+  ),
+
+  'two columns': (
+    <div className="container grid grid-cols-12">
+      <OtherProducts className="col-span-12" {...propsTwoColumns} />
+    </div>
+  ),
+};

package/src/components/OtherProducts/OtherProducts.tsx

@@ -0,0 +1,20 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { UniBlockProps } from '../../types';
+import type { OtherProductsContent } from './OtherProductsContent';
+import { OtherProductsItem } from './OtherProductsItem';
+
+export interface OtherProductsProps extends OtherProductsContent, UniBlockProps {}
+
+export const OtherProducts = JSX<OtherProductsProps>(({ blockItems, context, className }) => {
+  return (
+    <section className={`font-sans bg-white text-primary-text ${className || ''}`}>
+      {blockItems?.length ? (
+        <div className="list-none m-0 p-0">
+          {blockItems.map((item, i) => (
+            <OtherProductsItem key={`BlockItem${i}`} {...item} context={context} />
+          ))}
+        </div>
+      ) : null}
+    </section>
+  );
+});

package/src/components/OtherProducts/OtherProductsContent.ts

@@ -0,0 +1,38 @@
+import type { BlockDef, ColumnsCount } from '../../ui-kit/BlocksList/BlocksListProps';
+
+/**
+ * @title Элемент списка
+ */
+export interface blockItemCommonProps {
+  /**
+   * @title Название
+   * @default Список
+   */
+  label?: string;
+  /** @title Блоки */
+  blocks?: BlockDef[];
+  /**
+   * @title Отображать/скрывать обводку элемента
+   * @default false
+   */
+  bordered?: boolean; // TODO: только для мобильной версии
+  columns?: ColumnsCount;
+  isActive?: boolean;
+}
+
+/**
+ * @title Другие продукты
+ */
+export interface OtherProductsContent {
+  /** @title Заголовок */
+  title?: string;
+  /** @title Список */
+  blockItems?: blockItemCommonProps[];
+  /** @title Подзаголовок */
+  description?: string; // TODO: только для мобильной версии
+  /**
+   * @title Отображать/скрывать обводку у элемента списка
+   * @default false
+   */
+  bordered?: boolean; // TODO: только для мобильной версии
+}

package/src/components/OtherProducts/OtherProductsItem.tsx

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

package/src/components/OtherProducts/OtherProductsItemInner.tsx

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

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

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

package/src/icons/ArrowDownIcon.svg

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

package/src/icons/ArrowUpIcon.svg

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

package/src/icons/IconName.ts

@@ -1,9 +1,12 @@
 // Generated. Do not touch
+/* eslint-disable max-lines */
 
 export enum IconMap {
   ActualBalanceIcon = 'ActualBalanceIcon',
   AppleIcon = 'AppleIcon',
+  ArrowDownIcon = 'ArrowDownIcon',
   ArrowsRewindRight = 'ArrowsRewindRight',
+  ArrowUpIcon = 'ArrowUpIcon',
   AtmIcon = 'AtmIcon',
   BankIcon = 'BankIcon',
   BurgerIcon = 'BurgerIcon',
@@ -81,14 +84,16 @@ export enum IconMap {
  * @title Иконка
  * @enumNames [
  *   "",
- *   "Деньги", "Лого «Apple»", "ArrowsRewindRight", "Банкомат", "Банк", "Бургер", "Бургер (белый)", "Календарь 2", "Скруглённый календарь", "Календарь", "Календарь с галочкой", "Календарь белый", "Кред. карта", "Кред. карта под наклоном", "Кред. карта с галочкой", "Карта с драгоценностями", "Деньги внутри кошелька", "Часы", "Крестик", "Кресло", "Кредитные карты", "Скидка", "Документ", "Документ (одноцветный)", "Документ с текстом", "Доллар", "Земля", "Пустой кошелёк с возвратом", "Пустой кошелёк", "Пустой кошелёк (белый)", "Евро", "Геолокация", "Зеркало", "Глобус", "Gps", "Сетка", "Сетка (белая)", "Диаграмма роста", "Скидка", "JCB", "Лупа", "MasterCard", "Минус", "МИР", "Деньги", "Денежное страхование", "Монитор и мобильный", "Новый документ", "Офис", "Лого «Одноклассники»", "Бизнес", "Проценты (круг.)", "Проценты", "Проценты белые", "Персональная карта", "Лого «PlayMarket»", "Плюс", "Профиль, 2 персоны", "Профиль", "Рубль (круг.)", "Сейф", "Безопасность", "Подписанные документы", "Маленькие часы", "Лого «Telegram»", "UnionPay", "Пользователь", "Visa", "Лого «VK»", "Пополнение карты", "Кошелёк с плюсом", "Кошелёк", "Кошелёк с деньгами"
+ *   "Деньги", "Лого «Apple»", "ArrowDownIcon", "ArrowsRewindRight", "ArrowUpIcon", "Банкомат", "Банк", "Бургер", "Бургер (белый)", "Календарь 2", "Скруглённый календарь", "Календарь", "Календарь с галочкой", "Календарь белый", "Кред. карта", "Кред. карта под наклоном", "Кред. карта с галочкой", "Карта с драгоценностями", "Деньги внутри кошелька", "Часы", "Крестик", "Кресло", "Кредитные карты", "Скидка", "Документ", "Документ (одноцветный)", "Документ с текстом", "Доллар", "Земля", "Пустой кошелёк с возвратом", "Пустой кошелёк", "Пустой кошелёк (белый)", "Евро", "Геолокация", "Зеркало", "Глобус", "Gps", "Сетка", "Сетка (белая)", "Диаграмма роста", "Скидка", "JCB", "Лупа", "MasterCard", "Минус", "МИР", "Деньги", "Денежное страхование", "Монитор и мобильный", "Новый документ", "Офис", "Лого «Одноклассники»", "Бизнес", "Проценты (круг.)", "Проценты", "Проценты белые", "Персональная карта", "Лого «PlayMarket»", "Плюс", "Профиль, 2 персоны", "Профиль", "Рубль (круг.)", "Сейф", "Безопасность", "Подписанные документы", "Маленькие часы", "Лого «Telegram»", "UnionPay", "Пользователь", "Visa", "Лого «VK»", "Пополнение карты", "Кошелёк с плюсом", "Кошелёк", "Кошелёк с деньгами"
  * ]
  */
 export type IconName =
   | ''
   | 'ActualBalanceIcon'
   | 'AppleIcon'
+  | 'ArrowDownIcon'
   | 'ArrowsRewindRight'
+  | 'ArrowUpIcon'
   | 'AtmIcon'
   | 'BankIcon'
   | 'BurgerIcon'