@redneckz/wildless-cms-uni-blocks 0.14.832 → 0.14.833

package/mobile/src/components/InvestmentInfo/InvestmentInfo.tsx

@@ -1,131 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { RichText } from '../../ui-kit/RichText/RichText';
-import { Text } from '../../ui-kit/Text/Text';
-import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
-import { joinList } from '../../utils/joinList';
-import {
-  type InvestmentCell,
-  type InvestmentCellColor,
-  type InvestmentCellSize,
-  type InvestmentColumn,
-  type InvestmentInfoContent,
-  type InvestmentZeroColumn,
-} from './InvestmentInfoContent';
-
-const investmentCellColorMap: Record<InvestmentCellColor, string> = {
-  yellow: 'bg-yellow',
-  green: 'bg-green',
-  'green-light': 'bg-green-light',
-  'green-dark': 'bg-green-dark',
-};
-
-const investmentCellSizeMap: Record<InvestmentCellSize, string> = {
-  XS: 'h-10',
-  S: 'h-16',
-  M: 'h-24',
-  L: 'h-32',
-  XL: 'h-52',
-};
-
-export interface InvestmentInfoProps extends InvestmentInfoContent, UniBlockProps {}
-
-export const InvestmentInfo = JSX<InvestmentInfoProps>((props) => {
-  const {
-    className = '',
-    __html,
-    isDotted,
-    investmentZeroColumn,
-    investmentColumns,
-    ...rest
-  } = props;
-  const columns = investmentColumns ? [...investmentColumns] : [];
-  if (investmentZeroColumn) {
-    columns.unshift(investmentZeroColumn);
-  }
-
-  return (
-    <BlockWrapper className={className} defaultPadding="p-4xl" {...rest}>
-      <div className="container text-m font-light space-y-4xl">
-        {columns?.length ? (
-          <div>
-            <div className="flex items-end relative pl-3xl pr-lg text-white">
-              {joinList(<div className="w-px h-4 bg-gray" />)(columns.map(renderInvestmentColumn))}
-              <div className="absolute right-3xl w-px h-4 bg-gray" />
-            </div>
-            <div className="border-t border-gray -mt-xs mx-3xl" />
-            <div className="flex justify-between text-primary-text mt-s -mx-5xl">
-              {columns.map(renderInvestmentColumnTitle)}
-            </div>
-          </div>
-        ) : null}
-        {__html ? (
-          <div className="max-w-2xl font-light text-base">
-            <RichText __html={__html} isDotted={isDotted} itemSize="list-s" />
-          </div>
-        ) : null}
-      </div>
-    </BlockWrapper>
-  );
-});
-
-const renderInvestmentColumn = (
-  column: InvestmentColumn | InvestmentZeroColumn,
-  i: number,
-  arr: Array<InvestmentColumn>,
-) => {
-  const isSecondColumn = i === 1;
-  const isLastColumn = i === arr.length - 1;
-  const reversedCells = column.cells?.reverse() || [];
-
-  return (
-    <div
-      key={`column_${i}`}
-      className={`${getColumnClasses(isSecondColumn, isLastColumn, column.cells)}`}
-    >
-      {reversedCells.length ? (
-        <div
-          className={`w-full ${
-            isLastColumn ? 'border-4 border-green-more-dark p-1.5 min-w-72' : ''
-          }`}
-        >
-          {reversedCells.map(renderInvestmentCell)}
-        </div>
-      ) : null}
-    </div>
-  );
-};
-
-const getColumnClasses = (
-  isSecondColumn: boolean,
-  isLastColumn: boolean,
-  cells: InvestmentCell[] = [],
-): string =>
-  [
-    cells.length ? 'flex-1' : 'flex-0',
-    cells.length && !isSecondColumn && !isLastColumn ? 'pl-s' : '',
-    cells.length && !isLastColumn ? 'pr-s pb-3xl' : 'pb-xl',
-  ].join(' ');
-
-const renderInvestmentCell = (cell: InvestmentCell, i: number) => {
-  const cellSize = cell.cellSize || 'XS';
-  const cellColor = cell.cellColor || 'green';
-
-  return cell.text ? (
-    <div
-      key={`cell_${i}`}
-      className={`flex-1 flex items-center justify-center relative py-xs ${
-        investmentCellSizeMap[cellSize]
-      } ${investmentCellColorMap[cellColor]} ${cellSize === 'XS' ? 'px-s' : 'px-5xl'}`}
-    >
-      <Text align="text-center">{cell.text}</Text>
-    </div>
-  ) : null;
-};
-
-const renderInvestmentColumnTitle = (column: InvestmentColumn | InvestmentZeroColumn, i: number) =>
-  column?.title ? (
-    <div key={`title_${i}`} className="flex-1 max-w-44 text-center px-xs last:pr-4xl last:max-w-52">
-      {column.title}
-    </div>
-  ) : null;

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

@@ -1,13 +0,0 @@
-{
-  "content": {
-    "__html": {
-      "ui:widget": "html"
-    }
-  },
-  "style": {
-    "ui:options": {
-      "minCols": 12,
-      "maxCols": 12
-    }
-  }
-}

package/mobile/src/components/InvestmentInfo/InvestmentInfoContent.ts

@@ -1,51 +0,0 @@
-import { type BulletsProps } from '../../model/Bullets';
-import { type TextProps, type TitleProps } from '../../model/HeadlineType';
-import { type RichTextProps } from '../../ui-kit/RichText/RichTextProps';
-import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
-
-/**
- * @title Цвет
- * @enumNames ["Оранжевый", "Светло-зеленый", "Зеленый", "Тёмно-зеленый"]
- */
-export type InvestmentCellColor = 'yellow' | 'green-light' | 'green' | 'green-dark';
-
-/**
- * @title Высота
- */
-export type InvestmentCellSize = 'XL' | 'L' | 'M' | 'S' | 'XS';
-
-/**
- * @title Ячейка
- */
-export type InvestmentCell = TextProps & {
-  cellColor?: InvestmentCellColor;
-  cellSize?: InvestmentCellSize;
-};
-
-/**
- * @title Элемент данных 1
- */
-export type InvestmentZeroColumn = TitleProps & {
-  /** @hidden */
-  cells?: InvestmentCell[];
-};
-
-/**
- * @title Элемент данных
- */
-export type InvestmentColumn = TitleProps & {
-  /** @title Ячейки */
-  cells?: InvestmentCell[];
-};
-
-/**
- * @title Блок инвестиций
- */
-export type InvestmentInfoContent = UniBlockContent &
-  RichTextProps &
-  BulletsProps & {
-    /** @title Элемент данных 1 */
-    investmentZeroColumn?: InvestmentZeroColumn;
-    /** @title Остальные элементы данных */
-    investmentColumns?: InvestmentColumn[];
-  };

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

@@ -1,14 +0,0 @@
-{
-  "content": {
-    "version": "primary",
-    "padding": "",
-    "title": "Заголовок",
-    "description": "Описание",
-    "__html": "<p>Описание</p>",
-    "richVersion": "",
-    "button": {
-      "text": "Информация о регионе",
-      "version": "link"
-    }
-  }
-}

package/mobile/src/components/RepresentativeOfficeInfo/RepresentativeOfficeInfo.tsx

@@ -1,94 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { type IconName } from '../../icons/IconName';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { Heading } from '../../ui-kit/Heading/Heading';
-import { Icon } from '../../ui-kit/Icon/Icon';
-import { Img } from '../../ui-kit/Img/Img';
-import { renderButtonsSection } from '../../ui-kit/LinkButton/renderButtonsSection';
-import { RichText } from '../../ui-kit/RichText/RichText';
-import { type RichTextProps } from '../../ui-kit/RichText/RichTextProps';
-import { Text } from '../../ui-kit/Text/Text';
-import { type TextColor } from '../../ui-kit/Text/TextProps';
-import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
-import { isIcon } from '../../utils/isIcon';
-import { style } from '../../utils/style';
-import { type RepresentativeOfficeInfoContent } from './RepresentativeOfficeInfoContent';
-
-export interface RepresentativeOfficeInfoProps
-  extends RepresentativeOfficeInfoContent,
-    UniBlockProps {}
-
-export const RepresentativeOfficeInfo = JSX<RepresentativeOfficeInfoProps>(
-  ({
-    address,
-    email,
-    telephone,
-    button,
-    className = '',
-    __html,
-    richVersion,
-    icon,
-    title,
-    version = 'primary',
-    ...rest
-  }) => (
-    <BlockWrapper
-      className={style('box-border text-left space-y-s', className)}
-      version={version}
-      {...rest}
-    >
-      <div className="w-full flex justify-between flex-row-reverse">
-        {isIcon(icon) ? (
-          <div className={'w-10 h-7 sm:w-24 sm:h-16'}>
-            <Img image={icon} />
-          </div>
-        ) : null}
-        {title ? <Heading headingType="h3" as="h3" title={title} /> : null}
-      </div>
-      <div className="w-full space-y-m">
-        {__html ? renderDescriptionBlock({ __html, richVersion }) : null}
-        {renderBlock({
-          label: 'Адрес',
-          data: address,
-          iconName: 'GeolocationIcon',
-        })}
-        {renderBlock({ label: 'Телефон(факс)', data: telephone, iconName: 'PhoneIcon' })}
-        {renderBlock({
-          label: 'E-mail',
-          data: email,
-          iconName: 'MailIcon',
-          dataColor: 'text-primary-main',
-        })}
-        {button?.text ? renderButtonsSection([button]) : null}
-      </div>
-    </BlockWrapper>
-  ),
-);
-
-const renderDescriptionBlock = (props: RichTextProps) => (
-  <div className="border-b border-main-divider pb-lg">
-    <RichText {...props} itemSize="list-s" />
-  </div>
-);
-
-interface renderBlockProps {
-  label?: string;
-  data?: string;
-  iconName?: IconName;
-  dataColor?: TextColor;
-}
-
-const renderBlock = ({ label, data, iconName, dataColor = '' }: renderBlockProps) =>
-  data ? (
-    <div className="flex gap-s">
-      <Icon iconVersion="black" name={iconName} width="24" height="24" />
-      <div className="flex flex-col gap-2xs">
-        <Text size="text-m" font="font-light" color="text-secondary-text">
-          {label}
-        </Text>
-        <Text size="text-xl" color={dataColor}>
-          {data}
-        </Text>
-      </div>
-    </div>
-  ) : null;

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

@@ -1,24 +0,0 @@
-{
-  "content": {
-    "__html": {
-      "ui:widget": "html"
-    },
-    "button": {
-      "href": {
-        "ui:field": "attachmentHref"
-      },
-      "icon": {
-        "ui:field": "icon"
-      },
-      "iconRight": {
-        "ui:field": "icon"
-      }
-    }
-  },
-  "style": {
-    "ui:options": {
-      "minCols": 6,
-      "maxCols": 6
-    }
-  }
-}

package/mobile/src/components/RepresentativeOfficeInfo/RepresentativeOfficeInfoContent.ts

@@ -1,22 +0,0 @@
-import { type TitleProps } from '../../model/HeadlineType';
-import { type IconProps } from '../../model/Picture';
-import { type LinkButtonContent } from '../../ui-kit/LinkButton/LinkButtonContent';
-import { type RichTextProps } from '../../ui-kit/RichText/RichTextProps';
-import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
-
-/**
- * @title Блок с информацией о представительстве
- */
-export type RepresentativeOfficeInfoContent = UniBlockContent &
-  TitleProps &
-  RichTextProps &
-  IconProps & {
-    /** @title Адрес */
-    address?: string;
-    /** @title Телефон (факс) */
-    telephone?: string;
-    /** @title E-mail */
-    email?: string;
-    /** @title Кнопка */
-    button?: LinkButtonContent;
-  };

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

@@ -1,9 +0,0 @@
-{
-  "content": {
-    "version": "primary",
-    "padding": "",
-    "prefix": "префикс",
-    "unit": 1,
-    "suffix": "суффикс"
-  }
-}

package/mobile/src/components/UnitBlock/UnitBlock.tsx

@@ -1,17 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { Unit } from '../../ui-kit/Unit/Unit';
-import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
-import { type UnitBlockContent } from './UnitBlockContent';
-
-interface UnitBlockProps extends UnitBlockContent, UniBlockProps {}
-
-export const UnitBlock = JSX<UnitBlockProps>((props) => {
-  const { prefix, unit, suffix, ...rest } = props;
-
-  return (
-    <BlockWrapper defaultPadding="p-0" {...rest}>
-      <Unit prefix={prefix} unit={unit} suffix={suffix} />
-    </BlockWrapper>
-  );
-});

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

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

package/mobile/src/components/UnitBlock/UnitBlockContent.ts

@@ -1,7 +0,0 @@
-import { type UnitProps } from '../../ui-kit/Unit/UnitProps';
-import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
-
-/**
- * @title Показатель
- */
-export type UnitBlockContent = UniBlockContent & UnitProps;

package/src/components/InvestmentInfo/InvestmentInfo.example.json

@@ -1,53 +0,0 @@
-{
-  "content": {
-    "version": "primary",
-    "padding": "",
-    "__html": "<ul><li>Пункт 1</li><li>Пункт 2</li><li>Пункт 3</li></ul>",
-    "isDotted": true,
-    "investmentZeroColumn": {
-      "title": "Название 1"
-    },
-    "investmentColumns": [
-      {
-        "title": "Название 2",
-        "cells": [
-          {
-            "text": "Ячейка 2-1",
-            "cellColor": "green-dark",
-            "cellSize": "S"
-          }
-        ]
-      },
-      {
-        "title": "Название 3",
-        "cells": [
-          {
-            "text": "Ячейка 3-1",
-            "cellColor": "green-dark",
-            "cellSize": "S"
-          }
-        ]
-      },
-      {
-        "title": "Название 4",
-        "cells": [
-          {
-            "text": "Ячейка 4-1",
-            "cellColor": "green-dark",
-            "cellSize": "L"
-          }
-        ]
-      },
-      {
-        "title": "Название 5",
-        "cells": [
-          {
-            "text": "Ячейка 5-1",
-            "cellColor": "green-dark",
-            "cellSize": "XL"
-          }
-        ]
-      }
-    ]
-  }
-}

package/src/components/InvestmentInfo/InvestmentInfo.fixture.tsx

@@ -1,109 +0,0 @@
-import '../../setup-fixture';
-
-import { InvestmentInfo } from './InvestmentInfo';
-import { type InvestmentInfoContent } from './InvestmentInfoContent';
-
-export const INVESTMENT_INFO: InvestmentInfoContent = {
-  __html: `
-    <ul>
-      <li>Пример с ежегодным взносом 400 000 ₽</li>
-      <li>Срок использования ИИС вы определяете сами. Но для получения налоговых вычетов он должен быть открыт не менее 3 лет</li>
-      <li>Вы можете возвращать до 52 000 ₽ каждый год</li>
-    </ul>
-  `,
-  investmentZeroColumn: {
-    title: 'Открытие ИИС',
-  },
-  investmentColumns: [
-    {
-      title: '1 января года, следующего за годом открытия ИИС',
-      cells: [
-        {
-          text: 'Потенциальный доход инвестиций',
-          cellColor: 'green-light',
-        },
-        {
-          text: 'Первый взнос 400 000 ₽',
-          cellColor: 'green-dark',
-          cellSize: 'S',
-        },
-      ],
-    },
-    {
-      title: '1 января второго года после открытия ИИС',
-      cells: [
-        {
-          text: 'Налоговый вычет за 1 год 52 000 ₽',
-          cellColor: 'yellow',
-        },
-        {
-          text: 'Потенциальный доход инвестиций за 2 года',
-          cellColor: 'green-light',
-          cellSize: 'S',
-        },
-        {
-          text: 'Второй взнос 400 000 ₽',
-          cellColor: 'green',
-          cellSize: 'S',
-        },
-        {
-          text: 'Первый взнос 400 000 ₽',
-          cellColor: 'green-dark',
-          cellSize: 'S',
-        },
-      ],
-    },
-    {
-      title: '1 января третьего года после открытия ИИС',
-      cells: [
-        {
-          text: 'Налоговый вычет за 2 год 52 000 ₽',
-          cellColor: 'yellow',
-        },
-        {
-          text: 'Потенциальный доход инвестиций за 3 года',
-          cellColor: 'green-light',
-          cellSize: 'M',
-        },
-        {
-          text: 'Третий взнос — 0 ₽',
-          cellColor: 'green',
-          cellSize: 'S',
-        },
-        {
-          text: 'Первый и второй взносы 800 000 ₽',
-          cellColor: 'green-dark',
-          cellSize: 'L',
-        },
-      ],
-    },
-    {
-      title: 'Возможный вывод средств, закрытие ИИС',
-      cells: [
-        {
-          text: 'Налоговый вычет за 3 года 156 000 ₽',
-          cellColor: 'yellow',
-          cellSize: 'S',
-        },
-        {
-          text: 'Потенциальный доход инвестиций за 3 года',
-          cellColor: 'green-light',
-          cellSize: 'M',
-        },
-        {
-          text: 'Сумма инвестиций за 3 года 1 200 000 ₽',
-          cellColor: 'green-dark',
-          cellSize: 'XL',
-        },
-      ],
-    },
-  ],
-};
-
-export default {
-  default: (
-    <div className="container grid grid-cols-12">
-      <InvestmentInfo className="col-span-12" {...INVESTMENT_INFO} />
-    </div>
-  ),
-};

package/src/components/InvestmentInfo/InvestmentInfo.tsx

@@ -1,131 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { RichText } from '../../ui-kit/RichText/RichText';
-import { Text } from '../../ui-kit/Text/Text';
-import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
-import { joinList } from '../../utils/joinList';
-import {
-  type InvestmentCell,
-  type InvestmentCellColor,
-  type InvestmentCellSize,
-  type InvestmentColumn,
-  type InvestmentInfoContent,
-  type InvestmentZeroColumn,
-} from './InvestmentInfoContent';
-
-const investmentCellColorMap: Record<InvestmentCellColor, string> = {
-  yellow: 'bg-yellow',
-  green: 'bg-green',
-  'green-light': 'bg-green-light',
-  'green-dark': 'bg-green-dark',
-};
-
-const investmentCellSizeMap: Record<InvestmentCellSize, string> = {
-  XS: 'h-10',
-  S: 'h-16',
-  M: 'h-24',
-  L: 'h-32',
-  XL: 'h-52',
-};
-
-export interface InvestmentInfoProps extends InvestmentInfoContent, UniBlockProps {}
-
-export const InvestmentInfo = JSX<InvestmentInfoProps>((props) => {
-  const {
-    className = '',
-    __html,
-    isDotted,
-    investmentZeroColumn,
-    investmentColumns,
-    ...rest
-  } = props;
-  const columns = investmentColumns ? [...investmentColumns] : [];
-  if (investmentZeroColumn) {
-    columns.unshift(investmentZeroColumn);
-  }
-
-  return (
-    <BlockWrapper className={className} defaultPadding="p-4xl" {...rest}>
-      <div className="container text-m font-light space-y-4xl">
-        {columns?.length ? (
-          <div>
-            <div className="flex items-end relative pl-3xl pr-lg text-white">
-              {joinList(<div className="w-px h-4 bg-gray" />)(columns.map(renderInvestmentColumn))}
-              <div className="absolute right-3xl w-px h-4 bg-gray" />
-            </div>
-            <div className="border-t border-gray -mt-xs mx-3xl" />
-            <div className="flex justify-between text-primary-text mt-s -mx-5xl">
-              {columns.map(renderInvestmentColumnTitle)}
-            </div>
-          </div>
-        ) : null}
-        {__html ? (
-          <div className="max-w-2xl font-light text-base">
-            <RichText __html={__html} isDotted={isDotted} itemSize="list-s" />
-          </div>
-        ) : null}
-      </div>
-    </BlockWrapper>
-  );
-});
-
-const renderInvestmentColumn = (
-  column: InvestmentColumn | InvestmentZeroColumn,
-  i: number,
-  arr: Array<InvestmentColumn>,
-) => {
-  const isSecondColumn = i === 1;
-  const isLastColumn = i === arr.length - 1;
-  const reversedCells = column.cells?.reverse() || [];
-
-  return (
-    <div
-      key={`column_${i}`}
-      className={`${getColumnClasses(isSecondColumn, isLastColumn, column.cells)}`}
-    >
-      {reversedCells.length ? (
-        <div
-          className={`w-full ${
-            isLastColumn ? 'border-4 border-green-more-dark p-1.5 min-w-72' : ''
-          }`}
-        >
-          {reversedCells.map(renderInvestmentCell)}
-        </div>
-      ) : null}
-    </div>
-  );
-};
-
-const getColumnClasses = (
-  isSecondColumn: boolean,
-  isLastColumn: boolean,
-  cells: InvestmentCell[] = [],
-): string =>
-  [
-    cells.length ? 'flex-1' : 'flex-0',
-    cells.length && !isSecondColumn && !isLastColumn ? 'pl-s' : '',
-    cells.length && !isLastColumn ? 'pr-s pb-3xl' : 'pb-xl',
-  ].join(' ');
-
-const renderInvestmentCell = (cell: InvestmentCell, i: number) => {
-  const cellSize = cell.cellSize || 'XS';
-  const cellColor = cell.cellColor || 'green';
-
-  return cell.text ? (
-    <div
-      key={`cell_${i}`}
-      className={`flex-1 flex items-center justify-center relative py-xs ${
-        investmentCellSizeMap[cellSize]
-      } ${investmentCellColorMap[cellColor]} ${cellSize === 'XS' ? 'px-s' : 'px-5xl'}`}
-    >
-      <Text align="text-center">{cell.text}</Text>
-    </div>
-  ) : null;
-};
-
-const renderInvestmentColumnTitle = (column: InvestmentColumn | InvestmentZeroColumn, i: number) =>
-  column?.title ? (
-    <div key={`title_${i}`} className="flex-1 max-w-44 text-center px-xs last:pr-4xl last:max-w-52">
-      {column.title}
-    </div>
-  ) : null;