@redneckz/wildless-cms-uni-blocks 0.12.12 → 0.12.14

package/src/components/ApplicationForm/ApplicationForm.tsx

@@ -4,29 +4,22 @@ import { CorporateLeadAPI } from '../../api/CorporateLeadAPI';
 import type { UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { Heading } from '../../ui-kit/Heading/Heading';
-import { ApplicationFormAcquiring } from './ApplicationFormAcquiring';
-import { ApplicationFormBusinessCard } from './ApplicationFormBusinessCard';
-import type { ApplicationFormContent } from './ApplicationFormContent';
-import { ApplicationFormCredit } from './ApplicationFormCredit';
-import { ApplicationFormDeposit } from './ApplicationFormDeposit';
-import type { ApplicationFormsProps } from './ApplicationFormsProps';
-import { ApplicationFormWed } from './ApplicationFormWed';
+import type { ApplicationFormBlockDef, ApplicationFormContent } from './ApplicationFormContent';
+import { EmbeddableForms } from './EmbeddableForms';
 import { ResponseNotification } from './ResponseNotification';
 
 export interface ApplicationFormProps extends ApplicationFormContent, UniBlockProps {}
 
-const COMPONENTS_MAP = {
-  credit: (props: ApplicationFormsProps) => <ApplicationFormCredit {...props} />,
-  acquiring: (props: ApplicationFormsProps) => <ApplicationFormAcquiring {...props} />,
-  'business-card': (props: ApplicationFormsProps) => <ApplicationFormBusinessCard {...props} />,
-  deposit: (props: ApplicationFormsProps) => <ApplicationFormDeposit {...props} />,
-  wed: (props: ApplicationFormsProps) => <ApplicationFormWed {...props} />,
-};
-
 const API = CorporateLeadAPI();
 
 export const ApplicationForm = JSX<ApplicationFormProps>((props) => {
-  const { className, title, typeForm = 'credit', button, link, ...rest } = props;
+  const { className, formBlock, ...rest } = props;
+
+  // const type = formBlock?.formType;
+  // if (!type || !(type in EmbeddableForms)) {
+  //   return null;
+  // }
+  // const EmbeddedForm = EmbeddableForms[type];
 
   const [responseType, setResponseType] = useState<'OK' | 'Fail' | ''>('');
 
@@ -40,12 +33,31 @@ export const ApplicationForm = JSX<ApplicationFormProps>((props) => {
   return (
     <BlockWrapper className={className} defaultPadding="p-6xl" {...rest}>
       <div className="container max-w-[978px]">
-        {title ? (
-          <Heading headingType="h3" title={title} className="mb-4 sm:mb-8 sm:text-center" />
+        {formBlock?.title ? (
+          <Heading
+            headingType="h3"
+            title={formBlock.title}
+            className="mb-4 sm:mb-8 sm:text-center"
+          />
         ) : null}
-        {COMPONENTS_MAP[typeForm]({ button, link, onSubmit: handleSubmit })}
+        {/* <EmbeddedForm {...formBlock} onSubmit={handleSubmit} /> */}
+        {formBlock ? renderEmbeddedForm(formBlock, handleSubmit) : null}
+        {/* {COMPONENTS_MAP[typeForm]({ button, link, onSubmit: handleSubmit })} */}
         {responseType ? <ResponseNotification responseType={responseType} /> : null}
       </div>
     </BlockWrapper>
   );
 });
+
+const renderEmbeddedForm = (
+  formBlock: ApplicationFormBlockDef,
+  handleSubmit: (data: Record<string, string>) => Promise<'OK' | 'Fail'>,
+) => {
+  const type = formBlock?.formType;
+  if (!type || !(type in EmbeddableForms)) {
+    return null;
+  }
+  const EmbeddedForm = EmbeddableForms[type];
+
+  return <EmbeddedForm {...formBlock} onSubmit={handleSubmit} />;
+};

package/src/components/ApplicationForm/ApplicationForm.ui.json

@@ -0,0 +1,12 @@
+{
+  "content": {
+    "formBlock": {
+      "formType": {
+        "ui:widget": "hidden"
+      },
+      "sourceBookDir": {
+        "ui:widget": "sourceBook"
+      }
+    }
+  }
+}

package/src/components/ApplicationForm/ApplicationFormContent.ts

@@ -2,28 +2,87 @@ import type { ButtonVersion } from '../../model/ButtonVersion';
 import type { TitleProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { LinkProps } from '../../model/LinkProps';
-import type { ButtonAdditionalProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Кнопка
  */
-export interface SubmitButtonProps extends ButtonAdditionalProps {
+export interface SubmitButtonProps extends ButtonContent {
   /** @title Текст */
   text?: string;
   version?: ButtonVersion;
 }
 
+export type CommonApplicationFormProps = TitleProps & {
+  button?: SubmitButtonProps;
+  /** @title Условия передачи данных */
+  link?: LinkProps;
+};
+
+export type ApplicationFormBlockDef =
+  | BusinessCardFormParamsDef
+  | WedFormParamsDef
+  | DepositFormParamsDef
+  | CreditFormParamsDef
+  | AcquiringFormParamsDef
+  | GrantSupportFormParamsDef;
+
+/**
+ * @title Бизнес-карта
+ * @default {"formType": "ApplicationFormBusinessCard"}
+ */
+export type BusinessCardFormParamsDef = CommonApplicationFormProps & {
+  formType: 'ApplicationFormBusinessCard';
+};
+
+/**
+ * @title ВЭД
+ * @default {"formType": "ApplicationFormWed"}
+ */
+export type WedFormParamsDef = CommonApplicationFormProps & {
+  formType: 'ApplicationFormWed';
+};
+
+/**
+ * @title Депозит
+ * @default {"formType": "ApplicationFormDeposit"}
+ */
+export type DepositFormParamsDef = CommonApplicationFormProps & {
+  formType: 'ApplicationFormDeposit';
+};
+
+/**
+ * @title Кредит
+ * @default {"formType": "ApplicationFormCredit"}
+ */
+export type CreditFormParamsDef = CommonApplicationFormProps & {
+  formType: 'ApplicationFormCredit';
+};
+
+/**
+ * @title Эквайринг
+ * @default {"formType": "ApplicationFormAcquiring"}
+ */
+export type AcquiringFormParamsDef = CommonApplicationFormProps & {
+  formType: 'ApplicationFormAcquiring';
+};
+
+/**
+ * @title Грантовая поддержка
+ * @default {"formType": "ApplicationFormGrantSupport"}
+ */
+export type GrantSupportFormParamsDef = CommonApplicationFormProps & {
+  formType: 'ApplicationFormGrantSupport';
+  /** @title Адрес справочника */
+  sourceBookDir?: string;
+};
+
 /**
  * @title Форма заявки
  */
-export type ApplicationFormContent = UniBlockContent &
-  TitleProps & {
-    /**
-     * @title Вид заявки
-     * @enumNames ["Бизнес-карта", "ВЭД", "Депозит", "Кредит", "Эквайринг"]
-     */
-    typeForm?: 'business-card' | 'wed' | 'deposit' | 'credit' | 'acquiring';
-    button?: SubmitButtonProps;
-    /** @title Условия передачи данных */
-    link?: LinkProps;
-  };
+export type ApplicationFormContent = UniBlockContent & {
+  /**
+   * @title Вид заявки
+   */
+  formBlock?: ApplicationFormBlockDef;
+};

package/src/components/ApplicationForm/ApplicationFormGrantSupport.tsx

@@ -0,0 +1,51 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { useState } from '@redneckz/uni-jsx/lib/hooks';
+import { useSWRResource } from '../../hooks/useSWRResource';
+import { RegionsGrantSupportData } from '../../services/regionsGrantSupport/RegionsGrantSupportData';
+import { Button } from '../../ui-kit/Button/Button';
+import { getRegularButtonClasses } from '../../ui-kit/Button/getRegularButtonClasses';
+import { style } from '../../utils/style';
+import type { ApplicationFormsProps } from './ApplicationFormsProps';
+import { SelectControl } from './SelectControl';
+
+export const ApplicationFormGrantSupport = JSX<ApplicationFormsProps>((props) => {
+  const { button, sourceBookDir } = props;
+
+  const { regions } = useSWRResource<RegionsGrantSupportData>(
+    sourceBookDir || 'regions-grant-support',
+  );
+
+  const [region, setRegion] = useState({ key: '' });
+
+  const buttonStyle = getRegularButtonClasses({
+    className: 'text-white',
+    version: button?.version,
+  });
+
+  const regionHref = regions?.find((_) => _.name === region.key)?.href;
+
+  return (
+    <div className="container space-y-s sm:space-y-lg">
+      {regions ? (
+        <SelectControl
+          label="Ваш регион"
+          placeholder="Выберите регион"
+          options={regions.map(({ name = '' }) => ({ key: name }))}
+          value={region}
+          onChange={setRegion}
+        />
+      ) : null}
+      {regionHref ? (
+        <div className="text-center">
+          <Button
+            href={regionHref}
+            target="_blank"
+            className={style('p-4 w-full sm:w-auto', buttonStyle)}
+          >
+            {button?.text ? button.text : 'Перейти'}
+          </Button>
+        </div>
+      ) : null}
+    </div>
+  );
+});

package/src/components/ApplicationForm/ApplicationFormsProps.ts

@@ -4,5 +4,6 @@ import type { SubmitButtonProps } from './ApplicationFormContent';
 export interface ApplicationFormsProps<S extends Record<string, any> = Record<string, any>> {
   button?: SubmitButtonProps;
   link?: LinkProps;
+  sourceBookDir?: string;
   onSubmit: (data: S) => void;
 }

package/src/components/ApplicationForm/EmbeddableForms.tsx

@@ -0,0 +1,15 @@
+import { ApplicationFormAcquiring } from './ApplicationFormAcquiring';
+import { ApplicationFormBusinessCard } from './ApplicationFormBusinessCard';
+import { ApplicationFormCredit } from './ApplicationFormCredit';
+import { ApplicationFormDeposit } from './ApplicationFormDeposit';
+import { ApplicationFormGrantSupport } from './ApplicationFormGrantSupport';
+import { ApplicationFormWed } from './ApplicationFormWed';
+
+export const EmbeddableForms = {
+  ApplicationFormBusinessCard,
+  ApplicationFormWed,
+  ApplicationFormDeposit,
+  ApplicationFormCredit,
+  ApplicationFormAcquiring,
+  ApplicationFormGrantSupport,
+};

package/src/components/BenefitsBlock/BenefitsBlock.tsx

@@ -31,7 +31,7 @@ export const BenefitsBlock = JSX<BenefitsBlockProps>(
 const renderBenefit = (benefit: BenefitBlockItemProps, i: number) => (
   <div
     key={String(i)}
-    className="flex gap-m items-center md:basis-1/2 md:max-w-[400px]"
+    className="flex gap-m items-center md:basis-1/2 md:max-w-[500px]"
     role="listitem"
   >
     {benefit?.icon?.icon ? (

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

@@ -0,0 +1,72 @@
+import '../../setup-fixture';
+
+import type { Picture } from '../../model/Picture';
+import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
+import { Bonus } from './Bonus';
+import type { BonusContent } from './BonusContent';
+
+const imageSize = {
+  height: 242,
+  width: 242,
+};
+
+const cardWithMoney: Picture = {
+  src: 'card-with-diamond.png',
+  alt: 'Кредиты в РСХБ',
+  format: 'webp',
+  size: imageSize,
+};
+
+const buttons: ButtonProps[] = [
+  {
+    text: 'Установить',
+    href: '/credit-cards',
+    version: 'secondary',
+  },
+];
+
+export const BONUS: BonusContent = {
+  title: 'Начисление баллов',
+  description:
+    /* eslint-disable max-len */
+    'Получайте 1% бонусными баллами с любых покупок и 1,5% баллами с покупок в категории «Путешествия». Обменивайте бонусные баллы на авиа и ж/д билеты, бронирование отелей и прокат автомобилей.',
+  bonusItems: [
+    {
+      title: '5 баллов за каждые 100 ₽',
+      description:
+        'Повышенное начисление баллов за операции оплаты товаров и услуг в сети АЗС Роснефть',
+      bonusItemContent: {
+        bonusType: 'count',
+        bonusCount: '5',
+        bonusName: 'баллов',
+      },
+    },
+    {
+      title: '1 балл за каждые 100 ₽',
+      description: 'За остальные операции оплаты товаров и услуг',
+      bonusItemContent: {
+        bonusType: 'count',
+        bonusCount: '1',
+        bonusName: 'балл',
+      },
+    },
+    {
+      title: '300 приветственных баллов',
+      description:
+        'За операции оплаты товаров и услуг на общую сумму 1 000 рублей и более в течение первых двух месяцев после получения карты',
+      bonusItemContent: {
+        bonusType: 'image',
+        image: cardWithMoney,
+      },
+      buttons,
+    },
+  ],
+};
+
+export default {
+  default: (
+    <div className="container grid grid-cols-12">
+      <Bonus className="col-span-12" {...BONUS} />
+    </div>
+  ),
+};

package/src/components/Bonus/Bonus.tsx

@@ -10,31 +10,39 @@ import type { BonusContent, BonusCountDef, BonusImageDef } from './BonusContent'
 
 export interface BonusProps extends BonusContent, UniBlockProps {}
 
-export const Bonus = JSX<BonusProps>((props) => {
-  const { className = '', title, description, bonusItems, ...rest } = props;
-
-  return (
-    <BlockWrapper className={className} defaultPadding="p-6xl" {...rest}>
+export const Bonus = JSX<BonusProps>(
+  ({ className = '', title, description, bonusItems = [], ...rest }) => (
+    <BlockWrapper className={className} defaultPadding="p-default" {...rest}>
       <div className="container">
-        <Headline title={title} description={description} headlineVersion="M" isPadding={false} />
-        <div className="flex flex-wrap w-full mt-9">
-          {bonusItems?.length
+        <Headline
+          className="mb-xl"
+          isPadding={false}
+          title={title}
+          description={description}
+          headlineVersion="M"
+        />
+        <div className="flex flex-wrap w-full">
+          {bonusItems.length > 0
             ? bonusItems.map((_, i) => (
                 <div
                   key={String(i)}
-                  className="flex-grow w-[49%] border border-gray p-9 mb-3 mx-2 even:mr-0 odd:ml-0 last:odd:mx-0"
+                  className="flex-grow w-full sm:w-[49%] border border-gray p-m mb-text mx-xs even:mr-0 odd:ml-0 last:odd:mx-0"
                 >
-                  {_?.title ? <Text size="text-h4">{_.title}</Text> : null}
+                  {_?.title ? (
+                    <div className="mb-xs last:mb-0">
+                      <Text size="text-h4">{_.title}</Text>
+                    </div>
+                  ) : null}
                   {_?.description ? (
-                    <div className="mt-xs">
+                    <div className="mb-text last:mb-0">
                       <Paragraph size="text-xl" font="font-light">
                         {_.description}
                       </Paragraph>
                     </div>
                   ) : null}
 
-                  <div className="flex justify-between items-end mt-3">
-                    {renderButtonsSection(_?.buttons)}
+                  <div className="flex justify-between items-end">
+                    <div className="hidden sm:block">{renderButtonsSection(_?.buttons)}</div>
                     {_.bonusItemContent?.bonusType
                       ? renderBonusItemContent(_.bonusItemContent)
                       : null}
@@ -45,31 +53,28 @@ export const Bonus = JSX<BonusProps>((props) => {
         </div>
       </div>
     </BlockWrapper>
-  );
-});
-
-const renderBonusItemContent = (bonusItemContent: BonusImageDef | BonusCountDef) => (
-  <div>
-    {bonusItemContent.bonusType === 'count'
-      ? renderBonusCount(bonusItemContent as BonusCountDef)
-      : renderBonusImage(bonusItemContent as BonusImageDef)}
-  </div>
+  ),
 );
 
+const renderBonusItemContent = (bonusItemContent: BonusImageDef | BonusCountDef) =>
+  bonusItemContent.bonusType === 'count'
+    ? renderBonusCount(bonusItemContent as BonusCountDef)
+    : renderBonusImage(bonusItemContent as BonusImageDef);
+
 const renderBonusCount = (_: BonusCountDef) => (
-  <div className="relative -bottom-3 h-auto flex items-end mt-14 shrink-0">
+  <div className="w-full pt-default mt-s flex items-end">
     {_.bonusCount ? (
-      <span className="font-mohave -tracking-[5px] text-title-extra bg-clip-text text-transparent bg-green-to-yellow -mb-7">
+      <span className="shrink-0 w-1/2 sm:w-auto font-mohave text-title-extra -tracking-[5px] bg-clip-text text-transparent bg-green-to-yellow mt-lg">
         {_.bonusCount}
       </span>
     ) : null}
     {_.bonusName ? (
-      <span className="text-h2 bg-clip-text text-transparent bg-green-to-yellow">
-        {_.bonusName}
-      </span>
+      <div className="w-1/2 sm:w-auto bg-clip-text text-transparent bg-green-to-yellow">
+        <Text size="text-h2">{_.bonusName}</Text>
+      </div>
     ) : null}
   </div>
 );
 
 const renderBonusImage = (_: BonusImageDef) =>
-  _.image ? <Img className={`w-12 h-12 min-w-12 p-3 rounded-icon`} image={_.image} /> : null;
+  _.image ? <Img className="min-w-12 p-xs rounded-icon shrink-0" image={_.image} /> : null;

package/src/components/Bonus/BonusContent.ts

@@ -1,8 +1,8 @@
 import type { EmptyOption } from '../../model/EmptyOptionType';
 import type { HeadlineCommonProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
+import type { ButtonsSectionContent } from '../../ui-kit/Button/ButtonsSectionContent';
 
 /**
  * @title Изображение
@@ -32,14 +32,10 @@ export type BonusItemContentDef = EmptyOption | BonusImageDef | BonusCountDef;
 /**
  * @title Плитка
  */
-export type BonusItem = HeadlineCommonProps & {
-  bonusItemContent?: BonusItemContentDef;
-  /**
-   * @title Кнопка
-   * @maxItems 1
-   */
-  buttons?: ButtonWithIconProps[];
-};
+export type BonusItem = HeadlineCommonProps &
+  ButtonsSectionContent & {
+    bonusItemContent?: BonusItemContentDef;
+  };
 
 /**
  * @title Блок Бонусы

package/src/components/BusinessBlock/BusinessBlock.fixture.tsx

@@ -1,14 +1,13 @@
 import '../../setup-fixture';
-
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 import { BusinessBlock } from './BusinessBlock';
 import type {
   BusinessBlockContent,
   BusinessCardItemProps,
   BusinessCardProps,
 } from './BusinessBlockContent';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
-const button: ButtonWithIconProps = {
+const button: ButtonContent = {
   href: '#',
   text: 'Подробнее',
   target: '_blank',

package/src/components/BusinessBlock/BusinessBlockContent.ts

@@ -1,8 +1,8 @@
-import type { ButtonCommonIconProps } from '../../model/Button';
 import type { TitleProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { IconProps } from '../../model/Picture';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 export type BusinessCardItemProps = IconProps & {
   /** @title Текст */
@@ -10,10 +10,10 @@ export type BusinessCardItemProps = IconProps & {
 };
 
 export type BusinessCardProps = TitleProps &
-  ImageContent &
-  ButtonCommonIconProps & {
+  ImageContent & {
     /** @title Список */
     cardItems?: BusinessCardItemProps[];
+    button?: ButtonContent;
   };
 
 /**

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

@@ -1,8 +1,8 @@
 import '../../setup-fixture';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 import { ButtonsBlock } from './ButtonsBlock';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
-const buttons: ButtonWithIconProps[] = [
+const buttons: ButtonContent[] = [
   {
     href: '/credit-cards',
     text: 'Оформить',

package/src/components/ButtonsBlock/ButtonsBlock.fixture.tsx

@@ -1,8 +1,8 @@
 import '../../setup-fixture';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 import { ButtonsBlock } from './ButtonsBlock';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
-const buttons: ButtonWithIconProps[] = [
+const buttons: ButtonContent[] = [
   {
     href: '/credit-cards',
     text: 'Оформить',

package/src/components/ButtonsBlock/ButtonsBlockContent.ts

@@ -1,9 +1,9 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Блок кнопок
  */
 export interface ButtonsBlockContent {
   /** @title Кнопки */
-  buttons?: ButtonWithIconProps[];
+  buttons?: ButtonContent[];
 }

package/src/components/Calculator/BusinessDepositCalculatorForm.tsx

@@ -4,13 +4,13 @@ import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
 import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
 import type { BusinessDepositCalculatorProps } from './CalculatorContent';
 import { CalculatorValueBlock } from './CalculatorValueBlock';
-import { BUSINESS_DEFAULT_DAYS, BUSINESS_DEFAULT_SUM } from './constants';
 import { Rate } from './Rate';
+import { UnknownRate } from './UnknownRate';
+import { BUSINESS_DEFAULT_DAYS, BUSINESS_DEFAULT_SUM } from './constants';
 import { renderDaysInput } from './renderDaysInput';
 import { renderFootnote } from './renderFootnote';
 import { renderInterestPayment } from './renderInterestPayment';
 import { renderWantedSumInput } from './renderWantedSumInput';
-import { UnknownRate } from './UnknownRate';
 import {
   BusinessDepositCalculatorParams,
   useBusinessDepositCalculatorParams,
@@ -39,20 +39,20 @@ export const BusinessDepositCalculatorForm = JSX<BusinessDepositCalculatorProp>(
         <div className="flex justify-between">
           <div className="w-2/5">
             {renderWantedSumInput({
-              title: 'Сумма вклада, ₽',
+              title: 'Сумма, ₽',
               min: calculatorParams.minSum,
               max: calculatorParams.maxSum,
               ...field('moneyValue'),
               value: calculatorParams.moneyValue,
             })}
             {renderDaysInput({
-              title: 'Срок вклада, дни',
+              title: 'Срок, дней',
               min: calculatorParams.minDays,
               max: calculatorParams.maxDays,
               ...field('daysValue'),
               value: calculatorParams.daysValue,
             })}
-            <div className="mt-7 flex justify-between">
+            <div className="mt-2xl flex justify-between">
               {renderBusinessDepositParamsForm(calculatorParams, field)}
               {renderInterestPayment({
                 title: 'Выплата процентов',
@@ -74,10 +74,15 @@ export const BusinessDepositCalculatorForm = JSX<BusinessDepositCalculatorProp>(
           )}
 
           <div className="w-96">
-            <CalculatorValueBlock title="Доход по вкладу" value={income} postfix="₽" prefix="+" />
+            <CalculatorValueBlock
+              title="Доход в конце срока"
+              value={income}
+              postfix="₽"
+              prefix="+"
+            />
             <CalculatorValueBlock title="Сумма в конце срока" value={finalSum} postfix="₽" />
-            {renderButtonsSection(buttons, { className: 'mt-7', isVertical: true })}
-            <div className="mt-7">{renderFootnote(footnote)}</div>
+            {renderButtonsSection(buttons, { className: 'mt-2xl', isVertical: true })}
+            <div className="mt-2xl">{renderFootnote(footnote)}</div>
           </div>
         </div>
         <div className="mt-5">{renderFootnote(bottomFootnote)}</div>
@@ -106,7 +111,7 @@ const renderBusinessDepositParamsForm = (
     />
     <Checkbox
       className="mt-3"
-      text="Являюсь малым предприятием"
+      text="ИП / малое предприятие"
       {...field('isSmallBusiness')}
       value={calculatorParams.isSmallBusiness}
     />

package/src/components/Calculator/Calculator.fixture.tsx

@@ -1,7 +1,7 @@
 import '../../setup-fixture';
 
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 import { Calculator } from './Calculator';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 import type {
   BonusCalculatorParamsDef,
   BusinessDepositCalculatorParamsDef,
@@ -10,7 +10,7 @@ import type {
   RefinancingCalculatorParamsDef,
 } from './CalculatorContent';
 
-const buttons: ButtonWithIconProps[] = [
+const buttons: ButtonContent[] = [
   {
     href: 'https://rshb.ru',
     text: 'Отправить заявку',

package/src/components/Calculator/CalculatorContent.ts

@@ -2,10 +2,10 @@ import type { EmptyOption } from '../../model/EmptyOptionType';
 import type { Footnote } from '../../model/Footnote';
 import type { HeadlineCommonProps, TitleProps } from '../../model/HeadlineType';
 import type { IconProps } from '../../model/Picture';
-import type { ButtonContent } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonsSectionContent } from '../../ui-kit/Button/ButtonsSectionContent';
 
 export type CommonCalculatorProps = Footnote &
-  ButtonContent & {
+  ButtonsSectionContent & {
     /** @title Адрес справочника */
     sourceBookDir?: string;
   };