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

package/mobile/src/components/Footer/HorizontalNavigation.tsx

@@ -9,11 +9,18 @@ export interface HorizontalNavigationProps extends FooterLink, TitleProps {}
 export const HorizontalNavigation = JSX<HorizontalNavigationProps>(
   ({ title, links, className = '' }) => (
     <div className={className}>
-      <Text size="text-h6">{title}</Text>
+      <Text size="text-l" font="font-normal">
+        {title}
+      </Text>
       {links?.length ? (
-        <div className="flex flex-col gap-6 mt-7">
+        <div className="flex flex-col gap-lg mt-lg">
           {links.map((_, i) => (
-            <HorizontalNavigationLink key={String(i)} index={i} {..._} />
+            <HorizontalNavigationLink
+              className="text-l font-light"
+              key={String(i)}
+              index={i}
+              {..._}
+            />
           ))}
         </div>
       ) : null}

package/mobile/src/components/Footer/MediaButton.tsx

@@ -7,7 +7,7 @@ import { style } from '../../utils/style';
 import { buttonStylesWithText } from './buttonStylesWithText';
 import { findIconByHref } from './findIconByHref';
 
-export type ButtonSize = 'default' | 'small';
+export type ButtonSize = 'default' | 'stretched';
 
 interface MediaButtonProps extends ButtonProps, IconProps {
   buttonSize?: ButtonSize;

package/mobile/src/components/Footer/SocialMedia.tsx

@@ -1,16 +1,29 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { LinkProps } from '../../model/LinkProps';
+import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import { Text } from '../../ui-kit/Text/Text';
 import { MediaButton } from './MediaButton';
+import type { ButtonSize } from './MediaButton';
+import { style } from '../../utils/style';
 
 export interface SocialMediaProps {
   className?: string;
-  media?: Omit<LinkProps, 'text'>[];
+  media?: ButtonWithIconProps[];
+  buttonSize?: ButtonSize;
 }
 
-export const SocialMedia = JSX<SocialMediaProps>(({ className = '', media }) => (
-  <div className={`flex gap-2 items-start justify-start ${className}`}>
-    {media?.map((_, index) => (
-      <MediaButton key={String(index)} {..._} />
-    ))}
-  </div>
-));
+export const SocialMedia = JSX<SocialMediaProps>(
+  ({ className = '', media, children, buttonSize }) => (
+    <div className="flex flex-col sm:flex-col-reverse gap-xs">
+      {children ? (
+        <Text size="text-s" font="font-light" color="text-secondary-text">
+          {children}
+        </Text>
+      ) : null}
+      <div className={style('flex gap-xs', className)}>
+        {media?.map((_, index) => (
+          <MediaButton key={String(index)} buttonSize={buttonSize} {..._} />
+        ))}
+      </div>
+    </div>
+  ),
+);

package/mobile/src/components/Footer/TextInformation.tsx

@@ -5,13 +5,13 @@ import { TextInformationLink } from './TextInformationLink';
 
 export const TextInformation = JSX<FooterLink>(({ className = '', links }) => (
   <div className={className}>
-    <div className="pt-4 xl:pt-5">
+    <div className="pt-lg">
       <Text size="text-xs" font="font-light" color="text-secondary-text">
         {`\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.`}
       </Text>
     </div>
     {links?.length ? (
-      <div className="flex justify-start items-start gap-5 pt-4">
+      <div className="flex flex-col sm:flex-row justify-start items-start gap-x-lg gap-y-xs pt-lg">
         {links.map((_, i) => (
           <TextInformationLink key={String(i)} index={i} {..._} />
         ))}

package/mobile/src/components/Footer/buttonSizeStyles.ts

@@ -0,0 +1,6 @@
+import { ButtonSize } from './MediaButton';
+
+export const buttonSizeStyles: { [key in ButtonSize]: string } = {
+  default: 'w-24 h-14',
+  stretched: 'flex-1 h-14',
+};

package/mobile/src/components/Footer/buttonStylesWithText.ts

@@ -1,10 +1,6 @@
 import { style } from '../../utils/style';
 import { ButtonSize } from './MediaButton';
-
-const buttonSizeStyles = {
-  default: 'w-24 h-14',
-  small: 'w-12 h-12',
-};
+import { buttonSizeStyles } from './buttonSizeStyles';
 
 export const buttonStylesWithText = (text: string, buttonSize: ButtonSize) =>
   text

package/mobile/src/components/MobileAppTile/renderDescription.tsx

@@ -2,7 +2,7 @@ import { Text } from '../../ui-kit/Text/Text';
 
 export const renderDescription = (description?: string) =>
   description ? (
-    <div className="mb-5 pt-3xs sm:mb-0 sm:pt-0">
+    <div className="mb-lg pt-3xs">
       <Text size="text-xl" font-weight="light">
         {description}
       </Text>

package/mobile/src/components/RollupItem/RollupItem.tsx

@@ -127,7 +127,7 @@ const renderPrimaryFoldButton = ({
   return (
     <button
       className={style(
-        'border-none bg-transparent px-0 flex justify-between items-center w-full group/button',
+        'border-none bg-transparent flex justify-between items-center w-full group/button',
         labelIcon?.icon ? 'py-xs' : 'py-lg',
       )}
       onClick={onToggle}

package/mobile/src/services/regionsGrantSupport/RegionsGrantSupportData.ts

@@ -0,0 +1,8 @@
+export interface RegionProps {
+  name?: string;
+  href?: string;
+}
+
+export interface RegionsGrantSupportData {
+  regions?: RegionProps[];
+}

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

@@ -2,9 +2,10 @@ import { JSX } from '@redneckz/uni-jsx';
 import { useLink } from '../../hooks/useLink';
 import type { LinkProps } from '../../model/LinkProps';
 import { Img } from '../Img/Img';
+import { style } from '../../utils/style';
 
-const LINK_CLASS_NAME = `absolute border border-primary-main ml-s px-xl py-lg
-  text-l font-light bg-white text-primary-text flex w-80
+const LINK_CLASS_NAME = `absolute border border-primary-main px-xl py-lg
+  text-l font-light bg-white text-primary-text flex
   justify-between items-center group-hover/link:text-primary-main z-10`;
 
 const LINK_BORDER_CLASS_NAME =
@@ -20,12 +21,24 @@ export const LinkButton = JSX<LinkButtonProps>(
     const adjustedProps = link({ href, target });
 
     return text ? (
-      <div className={`relative group/link cursor-pointer w-[328px] h-[82px] ${className}`}>
-        <a className={LINK_CLASS_NAME} role="link" {...adjustedProps}>
-          <div className="p-3xs">{text}</div>
-          <div className="w-6 h-6">
+      <div
+        className={style(
+          'flex max-w-sm relative group/link cursor-pointer w-64 h-16 sm:w-[47%] sm:h-20 sm:mr-m',
+          className,
+        )}
+      >
+        <a
+          className={style(
+            LINK_CLASS_NAME,
+            'rounded-md sm:rounded-none w-full h-12 sm:ml-s sm:w-full sm:h-auto',
+          )}
+          role="link"
+          {...adjustedProps}
+        >
+          <div className="p-0.5">{text}</div>
+          <div className="w-6 h-6 hidden sm:block">
             <Img
-              className="w-4 h-4 min-w-4 min-h-4 rounded-full box-border brightness-0 group-hover/link:brightness-100"
+              className="w-4 h-4 rounded-full box-border brightness-0 group-hover/link:brightness-100"
               image={{ icon: 'ArrowRightIcon', iconVersion: 'black' }}
               imageClassName="group-hover/link:text-primary-main"
               width="24"
@@ -33,8 +46,8 @@ export const LinkButton = JSX<LinkButtonProps>(
             />
           </div>
         </a>
-        <div className={`${LINK_BORDER_CLASS_NAME} mx-1.5 mt-1.5`} />
-        <div className={`${LINK_BORDER_CLASS_NAME} mt-3 mr-3`} />
+        <div className={LINK_BORDER_CLASS_NAME + ' hidden sm:block mx-1.5 mt-1.5'} />
+        <div className={LINK_BORDER_CLASS_NAME + ' hidden sm:block mt-3 mr-3'} />
       </div>
     ) : null;
   },

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

@@ -6,7 +6,7 @@ import { linkListStyles } from './linkListStyles';
 
 export const LinkList = JSX<LinkListProps>(({ className = '', items }) =>
   items?.length ? (
-    <ul className={style('flex flex-col p-0 gap-m sm:gap-xl', linkListStyles, className)}>
+    <ul className={style('flex flex-col', linkListStyles, className)}>
       {items.map(renderLinkListItem)}
     </ul>
   ) : null,
@@ -16,8 +16,8 @@ const renderLinkListItem = (item: LinkProps, i: number) => {
   const { text, ...linkProps } = item;
 
   return (
-    <li key={`list_item_${String(i)}`} className="list-none">
-      <a className="hover:text-primary-main sm:font-light" role="link" {...linkProps}>
+    <li key={`list_item_${String(i)}`} className="list-none my-xs">
+      <a className="hover:text-primary-main font-light" role="link" {...linkProps}>
         {text ? text : null}
       </a>
     </li>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.12.12",
+  "version": "0.12.13",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/common.css

@@ -249,7 +249,7 @@ html {
   }
 
   .md-container strong {
-    @apply font-bold;
+    @apply font-normal;
   }
 
   .striped.md-container table {

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

@@ -1,9 +1,9 @@
 import '../../setup-fixture';
 
 import { ApplicationForm } from './ApplicationForm';
-import type { ApplicationFormContent } from './ApplicationFormContent';
+import type { ApplicationFormBlockDef, ApplicationFormContent } from './ApplicationFormContent';
 
-const ApplicationFormProps: ApplicationFormContent = {
+const formBlockProps: ApplicationFormBlockDef = {
   title: 'Форма заявки',
   button: {
     text: 'Отправить заявку',
@@ -13,32 +13,66 @@ const ApplicationFormProps: ApplicationFormContent = {
     text: 'условиями передачи данных',
     href: '#',
   },
+  formType: 'ApplicationFormCredit',
+};
+
+const ApplicationFormCredit: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormCredit' },
+};
+
+const ApplicationFormAcquiring: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormAcquiring' },
+};
+
+const ApplicationFormBusinessCard: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormBusinessCard' },
+};
+
+const ApplicationFormDeposit: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormDeposit' },
+};
+
+const ApplicationFormWed: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormWed' },
+};
+
+const ApplicationFormGrantSupport: ApplicationFormContent = {
+  formBlock: {
+    ...formBlockProps,
+    formType: 'ApplicationFormGrantSupport',
+    sourceBookDir: 'regions-grant-support',
+  },
 };
 
 export default {
   credit: (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="credit" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormCredit} />
     </div>
   ),
   acquiring: (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="acquiring" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormAcquiring} />
     </div>
   ),
   'business-card': (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="business-card" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormBusinessCard} />
     </div>
   ),
   deposit: (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="deposit" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormDeposit} />
     </div>
   ),
   wed: (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="wed" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormWed} />
+    </div>
+  ),
+  'grant-support': (
+    <div className="container grid grid-cols-12">
+      <ApplicationForm className="col-span-12" {...ApplicationFormGrantSupport} />
     </div>
   ),
 };

package/src/components/ApplicationForm/ApplicationForm.fixture.tsx

@@ -1,9 +1,9 @@
 import '../../setup-fixture';
 
 import { ApplicationForm } from './ApplicationForm';
-import type { ApplicationFormContent } from './ApplicationFormContent';
+import type { ApplicationFormBlockDef, ApplicationFormContent } from './ApplicationFormContent';
 
-const ApplicationFormProps: ApplicationFormContent = {
+const formBlockProps: ApplicationFormBlockDef = {
   title: 'Форма заявки',
   button: {
     text: 'Отправить заявку',
@@ -13,32 +13,66 @@ const ApplicationFormProps: ApplicationFormContent = {
     text: 'условиями передачи данных',
     href: '#',
   },
+  formType: 'ApplicationFormCredit',
+};
+
+const ApplicationFormCredit: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormCredit' },
+};
+
+const ApplicationFormAcquiring: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormAcquiring' },
+};
+
+const ApplicationFormBusinessCard: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormBusinessCard' },
+};
+
+const ApplicationFormDeposit: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormDeposit' },
+};
+
+const ApplicationFormWed: ApplicationFormContent = {
+  formBlock: { ...formBlockProps, formType: 'ApplicationFormWed' },
+};
+
+const ApplicationFormGrantSupport: ApplicationFormContent = {
+  formBlock: {
+    ...formBlockProps,
+    formType: 'ApplicationFormGrantSupport',
+    sourceBookDir: 'regions-grant-support',
+  },
 };
 
 export default {
   credit: (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="credit" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormCredit} />
     </div>
   ),
   acquiring: (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="acquiring" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormAcquiring} />
     </div>
   ),
   'business-card': (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="business-card" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormBusinessCard} />
     </div>
   ),
   deposit: (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="deposit" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormDeposit} />
     </div>
   ),
   wed: (
     <div className="container grid grid-cols-12">
-      <ApplicationForm className="col-span-12" {...ApplicationFormProps} typeForm="wed" />
+      <ApplicationForm className="col-span-12" {...ApplicationFormWed} />
+    </div>
+  ),
+  'grant-support': (
+    <div className="container grid grid-cols-12">
+      <ApplicationForm className="col-span-12" {...ApplicationFormGrantSupport} />
     </div>
   ),
 };

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

@@ -13,17 +13,76 @@ export interface SubmitButtonProps extends ButtonAdditionalProps {
   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,
+};