@redneckz/wildless-cms-uni-blocks 0.14.840 → 0.14.842

package/mobile/src/components/InsuranceAmountBlock/InsuranceAmountBlockInner.tsx

@@ -1,145 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
-import { useCarouselControls } from '../../hooks/useCarouselControls';
-import { type ComponentType } from '../../model/ComponentType';
-import { Img } from '../../ui-kit/Img/Img';
-import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
-import { type ButtonCommonContent } from '../../ui-kit/LinkButton/LinkButtonContent';
-import { renderArrows } from '../../ui-kit/LinkButton/renderArrows';
-import { Text } from '../../ui-kit/Text/Text';
-import { toLocalNumberFormat } from '../../utils/toLocalNumberFormat';
-import { type CardItem, type InsuranceAmountBlockTab } from './InsuranceAmountBlockContent';
-
-export interface InsuranceAmountBlockInnerProps extends InsuranceAmountBlockTab, ComponentType {
-  button?: ButtonCommonContent;
-}
-
-type InsuranceGalleryProps = {
-  activeIndex: number;
-  cards: CardItem[];
-  selectedCardIndex: number;
-  onClick: (index: number) => void;
-};
-
-type NavButtonProps = {
-  slide: CardItem;
-  i: number;
-  isActive: boolean;
-  onClick: () => void;
-};
-
-export const InsuranceAmountBlockInner = JSX<InsuranceAmountBlockInnerProps>(
-  ({ className = '', cards = [], button }) => {
-    const [selectedCardIndex, setSelectedCardIndex] = useState(0);
-    const handleSelectedCardIndex = useCallback((_: number) => setSelectedCardIndex(_), []);
-    const galleryLength = cards.length;
-    const CARD_VIEW_COUNT = 2;
-    const [activeIndex, controls] = useCarouselControls({
-      itemCount: galleryLength,
-      visibleItemCount: CARD_VIEW_COUNT,
-    });
-    const { canDec, canInc } = controls;
-    const activeHref = cards[activeIndex]?.href;
-
-    return (
-      <section role="listitem" className={`min-w-full text-center ${className}`}>
-        <div className="relative overflow-hidden" aria-label="Страховые программы">
-          {galleryLength
-            ? renderGallery({
-                activeIndex,
-                cards,
-                selectedCardIndex,
-                onClick: handleSelectedCardIndex,
-              })
-            : null}
-          {renderArrows({
-            ...controls,
-            btnClass: ['left-12', 'right-12'],
-            className: 'top-16',
-          })}
-          {canDec ? (
-            <div className="absolute top-0 left-0 h-full w-32 bg-opacity-from-white" />
-          ) : null}
-          {canInc ? (
-            <div className="absolute top-0 right-0 h-full w-32 bg-opacity-to-white" />
-          ) : null}
-        </div>
-        <LinkButton className="w-60 text-center" version="primary" {...button} href={activeHref} />
-      </section>
-    );
-  },
-);
-
-function renderGallery({ activeIndex, cards, selectedCardIndex, onClick }: InsuranceGalleryProps) {
-  const tabsShiftWidth = activeIndex * 460;
-  const cardsAlignStyle = cards.length > 2 ? 'justify-start' : 'justify-center';
-
-  return (
-    <div style={{ transform: `translateX(-${tabsShiftWidth}px)` }} className="duration-1000 px-6xl">
-      <div className={`w-full flex flex-nowrap gap-s pb-6xl ${cardsAlignStyle}`}>
-        {cards.map((slide, i) =>
-          renderNavButton({
-            slide,
-            i,
-            isActive: Boolean(i === selectedCardIndex),
-            onClick: () => onClick(i),
-          }),
-        )}
-      </div>
-    </div>
-  );
-}
-
-function renderNavButton({ slide, i, isActive, onClick }: NavButtonProps) {
-  const btnClassName = isActive
-    ? 'shadow-dark-blue border-primary-main'
-    : `ease-in duration-300 border-gray`;
-
-  return (
-    <button
-      type="button"
-      key={String(i)}
-      onClick={onClick}
-      className={`p-3xl min-w-fit flex items-center gap-2xl bg-white border-solid border relative ${btnClassName}`}
-    >
-      {slide?.icon ? (
-        <Img
-          className="p-lg rounded-full bg-secondary-light"
-          image={slide.icon}
-          width="108"
-          height="108"
-        />
-      ) : null}
-
-      <div className="flex gap-s">
-        {slide?.sum ? renderValueBlock('страховая сумма', slide.sum) : null}
-        {slide?.fee ? renderValueBlock('страховой взнос', slide.fee) : null}
-      </div>
-      {renderDoneIcon(isActive)}
-    </button>
-  );
-}
-
-function renderValueBlock(title: string, sum: number) {
-  return (
-    <div className="flex flex-col text-left whitespace-pre">
-      <Text size="text-h6">{toLocalNumberFormat(2)(sum)} ₽</Text>
-      <div className="mt-2xs">
-        <Text size="text-l" color="text-secondary-text">
-          {title}
-        </Text>
-      </div>
-    </div>
-  );
-}
-
-function renderDoneIcon(isActive: boolean) {
-  return isActive ? (
-    <Img
-      className={`h-6 w-6 min-w-6 min-h-6 absolute right-4 top-4`}
-      image={{ icon: 'DoneIcon' }}
-      width="24"
-      height="24"
-    />
-  ) : null;
-}

package/mobile/src/ui-kit/Rating/Rating.tsx

@@ -1,39 +0,0 @@
-import { useState } from '@redneckz/uni-jsx/lib/hooks';
-import { Icon } from '../Icon/Icon';
-
-export const Rating = () => {
-  const [rating, setRating] = useState(0);
-  const [hoverRating, setHoverRating] = useState(0);
-
-  const handleClick = (event: { currentTarget: { id: string } }) => {
-    setRating(parseInt(event.currentTarget.id));
-  };
-
-  const handleMouseEnter = (event: { currentTarget: { id: string } }) => {
-    setHoverRating(parseInt(event.currentTarget.id));
-  };
-
-  const handleMouseLeave = () => {
-    setHoverRating(0);
-  };
-
-  return (
-    <div className="flex justify-center">
-      {[...Array(5)].map((_, i) => (
-        <span
-          key={i}
-          onClick={handleClick}
-          onMouseEnter={handleMouseEnter}
-          onMouseLeave={handleMouseLeave}
-          id={`${i + 1}`}
-        >
-          <Icon
-            name="StarIcon"
-            iconVersion={rating >= i + 1 || hoverRating >= i + 1 ? 'color' : 'gray'}
-            className="cursor-pointer w-14 h-14"
-          />
-        </span>
-      ))}
-    </div>
-  );
-};

package/src/components/CarouselLinks/CarouselLinkButton.tsx

@@ -1,36 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { useLink } from '../../hooks/useLink';
-import { type ComponentType } from '../../model/ComponentType';
-import { Img } from '../../ui-kit/Img/Img';
-import { style } from '../../utils/style';
-import { type CarouselLinkProps } from './CarouselLinksContent';
-
-export type CarouselLinkButtonProps = CarouselLinkProps & ComponentType;
-
-export const CarouselLinkButton = JSX<CarouselLinkButtonProps>(({ icon, ...linkProps }) => {
-  const link = useLink();
-  const { text, href, target, onClick } = link(linkProps);
-
-  const textStyle =
-    'font-light md:font-normal text-primary-text text-center text-xs md:text-sm whitespace-wrap';
-
-  return text ? (
-    <div className={style('p-3 rounded-lg bg-white text-secondary-text flex justify-center')}>
-      <a role="link" href={href} target={target} onClick={onClick}>
-        <div className="flex flex-col items-center gap-3 break-words max-w-[150px]">
-          {icon ? (
-            <Img
-              className="w-7 h-7 md:w-12 md:h-12"
-              image={{
-                ...icon,
-                iconVersion: icon?.iconVersion,
-              }}
-              alt={text}
-            />
-          ) : null}
-          <div className={textStyle}>{text}</div>
-        </div>
-      </a>
-    </div>
-  ) : null;
-});

package/src/components/CarouselLinks/CarouselLinks.example.json

@@ -1,31 +0,0 @@
-{
-  "content": {
-    "version": "secondary",
-    "padding": "",
-    "title": "Заголовок",
-    "description": "Описание 1",
-    "additionalDescription": "Описание 2",
-    "links": [
-      {
-        "text": "Текст",
-        "href": "#"
-      },
-      {
-        "text": "Текст",
-        "href": "#"
-      },
-      {
-        "text": "Текст",
-        "href": "#"
-      },
-      {
-        "text": "Текст",
-        "href": "#"
-      },
-      {
-        "text": "Текст",
-        "href": "#"
-      }
-    ]
-  }
-}

package/src/components/CarouselLinks/CarouselLinks.fixture.mobile.tsx

@@ -1,83 +0,0 @@
-import '../../setup-fixture';
-
-import { CarouselLinks } from './CarouselLinks';
-import { type CarouselLinkProps } from './CarouselLinksContent';
-
-const links = [
-  {
-    text: 'Миссия и Стратегия',
-    href: '#',
-    icon: { icon: 'AchievementIcon' },
-  },
-  {
-    text: 'Контакты и реквизиты',
-    href: '#',
-    icon: { icon: 'PhoneCallingIcon' },
-  },
-  {
-    text: 'Новости',
-    href: '#',
-    icon: { icon: 'BankIcon' },
-  },
-  {
-    text: 'Карьера в Банке',
-    href: '#',
-    icon: { icon: 'BriefcaseIcon' },
-  },
-  {
-    text: 'Меры безопасности',
-    href: '#',
-    icon: { icon: 'ShieldTickIcon' },
-  },
-  {
-    text: 'Награды и рейтинги',
-    href: '#',
-    icon: { icon: 'CupIcon' },
-  },
-  {
-    text: 'Агротех стартапы',
-    href: '#',
-    icon: { icon: 'DevIcon' },
-  },
-  {
-    text: 'Залоговое имущество',
-    href: '#',
-    icon: { icon: 'PercentageRoundIcon' },
-  },
-  {
-    text: 'Меры безопасности',
-    href: '#',
-    icon: { icon: 'LockIcon' },
-  },
-  {
-    text: 'Непрофильные активы',
-    href: '#',
-    icon: { icon: 'ChartRoundIcon' },
-  },
-  {
-    text: 'Меры безопасности',
-    href: '#',
-    icon: { icon: 'CopyIcon' },
-  },
-] as CarouselLinkProps[];
-
-const description = `Акционерное общество «Российский Сельскохозяйственный банк»* —
-  один из крупнейших банков в России. Был основан в 2000 году в целях развития
-  национальной кредитно-финансовой системы агропромышленного сектора и
-  сельских территорий Российской Федерации.`;
-
-const additionalDescription = `Сегодня это универсальный коммерческий банк,
-  предоставляющий все виды банковских услуг и занимающий лидирующие позиции
-  в финансировании агропромышленного комплекса России.`;
-
-export default {
-  default: (
-    <CarouselLinks
-      links={links}
-      title="О Банке"
-      description={description}
-      additionalDescription={additionalDescription}
-      version="secondary"
-    />
-  ),
-};

package/src/components/CarouselLinks/CarouselLinks.fixture.tsx

@@ -1,40 +0,0 @@
-import '../../setup-fixture';
-
-import { CarouselLinks } from './CarouselLinks';
-import { type CarouselLinkProps } from './CarouselLinksContent';
-
-const link = {
-  text: 'Заключения',
-  href: '#',
-  icon: {
-    icon: 'BankIcon',
-  },
-};
-
-const links = Array.from<CarouselLinkProps>({ length: 11 })
-  .fill(link as CarouselLinkProps)
-  .map((_) => ({ ..._, text: `${_.text}`, icon: _.icon }));
-
-const description = `Акционерное общество «Российский Сельскохозяйственный банк»* —
-  один из крупнейших банков в России. Был основан в 2000 году в целях развития
-  национальной кредитно-финансовой системы агропромышленного сектора и
-  сельских территорий Российской Федерации.`;
-
-const additionalDescription = `Сегодня это универсальный коммерческий банк,
-  предоставляющий все виды банковских услуг и занимающий лидирующие позиции
-  в финансировании агропромышленного комплекса России.`;
-
-export default {
-  default: (
-    <div className="container grid grid-cols-12">
-      <CarouselLinks
-        links={links}
-        title="О Банке"
-        description={description}
-        additionalDescription={additionalDescription}
-        version="secondary"
-        className="col-span-12"
-      />
-    </div>
-  ),
-};

package/src/components/CarouselLinks/CarouselLinks.tsx

@@ -1,50 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
-import { style } from '../../utils/style';
-import { Headline } from '../Headline/Headline';
-import { CarouselLinkButton } from './CarouselLinkButton';
-import { type CarouselLinkProps, type CarouselLinksContent } from './CarouselLinksContent';
-
-interface CarouselLinksProps extends CarouselLinksContent, UniBlockProps {}
-
-export const CarouselLinks = JSX<CarouselLinksProps>(
-  ({ className, additionalDescription, description, links, title, ...rest }) => (
-    <BlockWrapper defaultPadding="p-5xl" className={style('overflow-hidden', className)} {...rest}>
-      <div className="flex flex-col lg:flex-row gap-5 justify-between">
-        <div className="flex-1">
-          <Headline
-            isEmbedded={true}
-            title={title}
-            description={description}
-            as="h1"
-            align="text-left"
-            headlineVersion="XL"
-          />
-          <Headline
-            className="pt-m"
-            description={additionalDescription}
-            align="text-left"
-            isEmbedded={true}
-          />
-        </div>
-        {links?.length ? renderLinks(links) : null}
-      </div>
-    </BlockWrapper>
-  ),
-);
-
-const renderLinks = (links: CarouselLinkProps[]) => (
-  <div
-    className={style(
-      'lg:grid-cols-9 lg:[&>*]:col-span-2 lg:[&>*:nth-child(14n+2)]:col-span-3 lg:[&>*:nth-child(7n+5)]:col-span-3',
-      'lg:[&>*:nth-child(7n+6)]:col-span-3 lg:[&>*:nth-child(7n+7)]:col-span-3 lg:[&>*:nth-child(14n+10)]:col-span-3 lg:w-3/6',
-      'grid-cols-3 max-lg:[&>*:not(:nth-child(-n+3)):nth-child(4n+3)]:col-span-2 max-lg:[&>*:not(:nth-child(-n+3)):nth-child(4n+4)]:col-span-2',
-      'grid gap-3 lg:gap-5',
-    )}
-  >
-    {links.map((link, i) => (
-      <CarouselLinkButton key={String(i)} {...link} />
-    ))}
-  </div>
-);

package/src/components/CarouselLinks/CarouselLinks.ui.json

@@ -1,16 +0,0 @@
-{
-  "content": {
-    "links": {
-      "items": {
-        "icon": {
-          "ui:field": "icon"
-        }
-      }
-    }
-  },
-  "style": {
-    "ui:options": {
-      "minCols": 12
-    }
-  }
-}

package/src/components/CarouselLinks/CarouselLinksContent.ts

@@ -1,22 +0,0 @@
-import {
-  type AdditionalDescriptionProps,
-  type HeadlineCommonProps,
-} from '../../model/HeadlineType';
-import { type LinkProps } from '../../model/LinkProps';
-import { type IconProps } from '../../model/Picture';
-import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
-
-/**
- * @title Шапка колонки
- */
-export type CarouselLinkProps = IconProps & LinkProps;
-
-/** @title Карусель с ссылками */
-export type CarouselLinksContent = UniBlockContent &
-  HeadlineCommonProps &
-  AdditionalDescriptionProps & {
-    /** @title Ссылки */
-    links?: CarouselLinkProps[];
-    /** @title Отступы вложенных компонентов */
-    isInnerPadding?: boolean;
-  };

package/src/components/ExchangeRateTile/CurrencyProps.ts

@@ -1,6 +0,0 @@
-export enum Currency {
-  RUB = 'RUB',
-  EUR = 'EUR',
-  USD = 'USD',
-  CNY = 'CNY',
-}

package/src/components/ExchangeRateTile/CurrencyTable.tsx

@@ -1,64 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { type ComponentType } from '../../model/ComponentType';
-import { Img } from '../../ui-kit/Img/Img';
-import { Text } from '../../ui-kit/Text/Text';
-import { style } from '../../utils/style';
-import { type ExchangeCurrencyItem } from './ExchangeCurrencyCalculator';
-import { formatCurrency } from './formatCurrency';
-
-const TABLE_STYLE_BASE = 'text-m font-light text-secondary-text ';
-const TABLE_HEAD_STYLE = `${TABLE_STYLE_BASE} text-left`;
-const TABLE_HEAD_STYLE_CENTER = `${TABLE_STYLE_BASE} pl-5xl text-center`;
-const TABLE_HEAD_STYLE_RIGHT = `${TABLE_STYLE_BASE} pl-5xl text-right`;
-
-const CURRENCY_ICONS_MAP = {
-  USD: 'DollarIcon',
-  EUR: 'EuroIcon',
-  CNY: 'ChineseYuanRenminbiIcon',
-};
-
-interface CurrencyTableProps extends ComponentType {
-  exchangeCurrencyItems: ExchangeCurrencyItem[];
-}
-
-export const CurrencyTable = JSX<CurrencyTableProps>(({ className, exchangeCurrencyItems }) => (
-  <table className={style('h-fit w-full', className)}>
-    <thead>
-      <tr>
-        <th className={TABLE_HEAD_STYLE}>
-          <Text size="text-m">Валюта</Text>
-        </th>
-        <th className={TABLE_HEAD_STYLE_CENTER}>
-          <Text size="text-m">Купить</Text>
-        </th>
-        <th className={TABLE_HEAD_STYLE_RIGHT}>
-          <Text size="text-m">Продать</Text>
-        </th>
-      </tr>
-    </thead>
-    <tbody>{exchangeCurrencyItems.map(renderCurrencyRow)}</tbody>
-  </table>
-));
-
-const renderCurrencyRow = (exchangeCurrencyItem: ExchangeCurrencyItem) => {
-  const currency = exchangeCurrencyItem?.currency?.currency;
-
-  return (
-    <tr key={currency} className="pb-2xs text-h6">
-      <td className="pt-m m-auto flex text-left">
-        <div className="flex items-center gap-xs">
-          {currency ? (
-            <Img image={{ icon: CURRENCY_ICONS_MAP[currency] }} width="24" height="24" />
-          ) : null}
-          <Text size="text-h6">{currency}</Text>
-        </div>
-      </td>
-      <td className="pt-m pl-5xl text-center">
-        <Text size="text-h6">{formatCurrency(exchangeCurrencyItem?.saleExchangeRate)}</Text>
-      </td>
-      <td className="pt-m pl-5xl text-right">
-        <Text size="text-h6">{formatCurrency(exchangeCurrencyItem?.buyExchangeRate)}</Text>
-      </td>
-    </tr>
-  );
-};

package/src/components/ExchangeRateTile/CurrentLocation.tsx

@@ -1,28 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { type ComponentType } from '../../model/ComponentType';
-import { type Picture } from '../../model/Picture';
-import { RoundedIcon } from '../../ui-kit/Icon/RoundedIcon';
-import { Paragraph } from '../../ui-kit/Paragraph/Paragraph';
-import { style } from '../../utils/style';
-
-interface CurrentLocationProps extends ComponentType {
-  address?: string;
-}
-
-const icon: Picture = { icon: 'GpsIcon' };
-
-export const CurrentLocation = JSX<CurrentLocationProps>(({ className = '', address }) => (
-  <div className={style('flex gap-s w-full justify-between @sm:justify-center', className)}>
-    <RoundedIcon {...icon} iconBgVersion="primary" className="shrink-0" />
-    <div className="space-y-2xs whitespace-pre-wrap">
-      {address ? (
-        <Paragraph size="text-l" color="text-primary-main">
-          {address}
-        </Paragraph>
-      ) : null}
-      <Paragraph size="text-m" color="text-secondary-text">
-        Курс указан для заданного офиса
-      </Paragraph>
-    </div>
-  </div>
-));