@redneckz/wildless-cms-uni-blocks 0.14.201 → 0.14.202

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

@@ -2,8 +2,8 @@ import { JSX } from '@redneckz/uni-jsx';
 import { useBranches } from '../../hooks/useBranches';
 import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { usePremiumBranchesByRegions } from '../../hooks/usePremiumBranchesByRegions';
+import { SelectControl } from '../../ui-kit/Select/SelectControl';
 import { withValidator } from '../../validation/withValidator';
-import { SelectControl } from './SelectControl';
 import { defaultSelectValidator } from './validators';
 
 interface RegionFieldProps {
@@ -12,22 +12,21 @@ interface RegionFieldProps {
   isPremium?: boolean;
 }
 
-export const AddressBranchField = JSX<RegionFieldProps>(
-  ({ field, regionKey, isPremium = false }) => {
-    const addressBranch = isPremium
-      ? usePremiumBranchesByRegions().find((_) => _?.region === regionKey)?.branches
-      : useBranches(regionKey).filter((branch) => branch?.address);
+export const AddressBranchField = JSX<RegionFieldProps>(({ field, isPremium = false }) => {
+  const regionKey = field('region')?.value?.key as string;
+  const addressBranch = isPremium
+    ? usePremiumBranchesByRegions().find((_) => _?.region === regionKey)?.branches
+    : useBranches(regionKey).filter((branch) => branch?.address);
 
-    return (
-      <SelectControl
-        label="Адрес"
-        placeholder="Выберите адрес"
-        options={(addressBranch || []).map(({ address = '' }) => ({
-          key: address,
-          text: address,
-        }))}
-        {...withValidator(field('addressBranch'), defaultSelectValidator)}
-      />
-    );
-  },
-);
+  return (
+    <SelectControl
+      label="Адрес"
+      placeholder="Выберите адрес"
+      options={(addressBranch || []).map(({ address = '' }) => ({
+        key: address,
+        text: address,
+      }))}
+      {...withValidator(field('addressBranch'), defaultSelectValidator)}
+    />
+  );
+});

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

@@ -7,7 +7,7 @@ export interface ApplicationFieldsetLayoutProp {
 
 export const ApplicationFieldsetLayout = JSX<ApplicationFieldsetLayoutProp>(
   ({ title, children }) => (
-    <fieldset className="grid @xl:flex @xl:justify-between gap-lg border-b border-b-main-divider @xl:border-none">
+    <fieldset className="grid @xl:flex @xl:justify-between gap-m border-b border-b-main-divider @xl:border-none">
       {title ? (
         <legend className="w-full">
           <Heading title={title} headingType="h6" className="@xl:text-center" />

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

@@ -5,7 +5,7 @@
         "text": "Отправить заявку",
         "version": "primary"
       },
-      "formType": "ApplicationFormBusinessCard"
+      "formType": "ApplicationFormFeedbackCard"
     },
     "version": "primary"
   }

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

@@ -32,7 +32,7 @@ export const ApplicationForm = UniBlock<ApplicationFormProps>(
 
     return (
       <BlockWrapper className={className} defaultPadding="p-6xl" {...rest}>
-        <div className="container max-w-[978px] space-y-lg">
+        <div className="container max-w-[978px] space-y-m">
           {formBlock?.title ? (
             <Heading headingType="h3" title={formBlock.title} className="@xl:text-center" />
           ) : null}

package/mobile/src/components/ApplicationForm/ApplicationFormContent.ts

@@ -25,15 +25,6 @@ export type CommonApplicationFormProps = TitleProps & {
  */
 export type UltraPremiumTypeProps = 'ULTRASERVICE' | 'PREMIUMSERVICE';
 
-/**
- * @title Бизнес-карта
- */
-export type BusinessCardFormParamsDef = TitleProps &
-  CommonApplicationFormProps & {
-    /** @default ApplicationFormBusinessCard */
-    formType: 'ApplicationFormBusinessCard';
-  };
-
 /**
  * @title ВЭД
  */
@@ -101,15 +92,6 @@ export type FeedbackFormParamsDef = TitleProps &
     formType: 'ApplicationFormFeedback';
   };
 
-/**
- * @title Самоинкассация (ЮЛ)
- */
-export type SelfCollectionFormParamsDef = TitleProps &
-  CommonApplicationFormProps & {
-    /** @default ApplicationSelfCollection */
-    formType: 'ApplicationFormSelfCollection';
-  };
-
 /**
  * @title Заявка Ультра и Премиум
  */
@@ -124,7 +106,6 @@ export type UltraPremiumFormParamsDef = TitleProps &
  * @title Настройки формы
  */
 export type ApplicationFormBlockDef =
-  | BusinessCardFormParamsDef
   | WedFormParamsDef
   | DepositFormParamsDef
   | CreditFormParamsDef
@@ -132,7 +113,6 @@ export type ApplicationFormBlockDef =
   | GrantSupportFormParamsDef
   | IndividualsFormParamsDef
   | FeedbackFormParamsDef
-  | SelfCollectionFormParamsDef
   | UltraPremiumFormParamsDef;
 
 /**

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

@@ -5,6 +5,7 @@ import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
 import { InputControl } from '../../ui-kit/Input/InputControl';
 import { type Option } from '../../ui-kit/Select/Option';
+import { SelectControl } from '../../ui-kit/Select/SelectControl';
 import { objectValidator } from '../../validation/objectValidator';
 import { isValidationSuccess, type Validator } from '../../validation/validator';
 import { withValidator } from '../../validation/withValidator';
@@ -17,7 +18,6 @@ import { PhoneInputControl } from './PhoneInputControl';
 import { RegionField } from './RegionField';
 import { renderAgreementSubmit } from './renderAgreementSubmit';
 import { initialUserFormState, renderUserData, type UserDataState } from './renderUserData';
-import { SelectControl } from './SelectControl';
 import {
   checkboxValidator,
   defaultValidator,

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

@@ -2,9 +2,9 @@ import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
 import { getRegularButtonClasses } from '../../ui-kit/LinkButton/getRegularButtonClasses';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
+import { SelectControl } from '../../ui-kit/Select/SelectControl';
 import { style } from '../../utils/style';
 import { type ApplicationFormsProps } from './ApplicationFormsProps';
-import { SelectControl } from './SelectControl';
 
 export const ApplicationFormGrantSupport = JSX<ApplicationFormsProps>((props) => {
   const { button, regionSource } = props;

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

@@ -1,13 +1,13 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
+import { DatePickerControl } from '../../ui-kit/DatePicker/DatePickerControl';
 import { InputControl } from '../../ui-kit/Input/InputControl';
 import { objectValidator } from '../../validation/objectValidator';
 import { isValidationSuccess } from '../../validation/validator';
 import { withValidator } from '../../validation/withValidator';
 import { ApplicationFieldsetLayout, formChildrenStyle } from './ApplicationFieldsetLayout';
 import { type ApplicationFormsProps } from './ApplicationFormsProps';
-import { DatePickerControl } from './DatePickerControl';
 import { formStyle } from './formStyle';
 import { PhoneInputControl } from './PhoneInputControl';
 import { renderAgreementSubmit } from './renderAgreementSubmit';

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

@@ -3,6 +3,7 @@ import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
 import { InputControl } from '../../ui-kit/Input/InputControl';
 import { type Option } from '../../ui-kit/Select/Option';
+import { SelectControl } from '../../ui-kit/Select/SelectControl';
 import { objectValidator } from '../../validation/objectValidator';
 import { isValidationSuccess } from '../../validation/validator';
 import { withValidator } from '../../validation/withValidator';
@@ -14,7 +15,6 @@ import { PhoneInputControl } from './PhoneInputControl';
 import { RegionPremiumField } from './RegionPremiumField';
 import { renderAgreementSubmit } from './renderAgreementSubmit';
 import { initialUserFormState, type UserDataState } from './renderUserData';
-import { SelectControl } from './SelectControl';
 import { checkboxValidator, defaultValidator, nameValidator, phoneValidator } from './validators';
 
 export const SERVICE_TYPES: Option[] = [

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

@@ -91,7 +91,7 @@ export const ApplicationFormWed = JSX<ApplicationFormsProps>((props) => {
   const [, { field, ...formProps }] = useForm(initialFormState, { onSubmit: handleSubmit });
 
   return (
-    <form className="container space-y-lg" onSubmit={formProps.onSubmit}>
+    <form className="container space-y-m" onSubmit={formProps.onSubmit}>
       {renderQuestionsInterested(field)}
       <Heading headingType="h6" title="Данные организации" className="@xl:text-center" />
       {renderWedDataOrganization({ field })}

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

@@ -1,16 +1,13 @@
 import { ApplicationFormAcquiring } from './ApplicationFormAcquiring';
-import { ApplicationFormBusinessCard } from './ApplicationFormBusinessCard';
 import { ApplicationFormCredit } from './ApplicationFormCredit';
 import { ApplicationFormDeposit } from './ApplicationFormDeposit';
 import { ApplicationFormFeedback } from './ApplicationFormFeedback';
 import { ApplicationFormGrantSupport } from './ApplicationFormGrantSupport';
 import { ApplicationFormIndividuals } from './ApplicationFormIndividuals';
-import { ApplicationFormSelfCollection } from './ApplicationFormSelfCollection';
 import { ApplicationFormUltraPremium } from './ApplicationFormUltraPremium';
 import { ApplicationFormWed } from './ApplicationFormWed';
 
 export const EmbeddableForms = {
-  ApplicationFormBusinessCard,
   ApplicationFormWed,
   ApplicationFormDeposit,
   ApplicationFormCredit,
@@ -18,6 +15,5 @@ export const EmbeddableForms = {
   ApplicationFormGrantSupport,
   ApplicationFormIndividuals,
   ApplicationFormFeedback,
-  ApplicationFormSelfCollection,
   ApplicationFormUltraPremium,
 };

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

@@ -1,12 +1,14 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { useRegions } from '../../hooks/useRegions';
+import { SelectControl } from '../../ui-kit/Select/SelectControl';
 import { withValidator } from '../../validation/withValidator';
-import { SelectControl } from './SelectControl';
-import { defaultSelectValidator } from './validators';
+import { type FieldDef } from '../ApplicationFormCustom/ApplicationFormCustomContent';
+import { validatorObj } from '../ApplicationFormCustom/getObjectValidator';
 
 interface RegionFieldProps {
   field: FormFieldRegisterer<any>;
+  input?: FieldDef;
 }
 
 export const RegionField = JSX<RegionFieldProps>(({ field }) => {
@@ -19,7 +21,7 @@ export const RegionField = JSX<RegionFieldProps>(({ field }) => {
       placeholder="Выберите филиал"
       isSearch={true}
       options={regions.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
-      {...withValidator(field('region'), defaultSelectValidator)}
+      {...withValidator(field('region'), validatorObj.region)}
     />
   );
 });

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

@@ -2,8 +2,8 @@ import { JSX } from '@redneckz/uni-jsx';
 import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { usePremiumBranchesByRegions } from '../../hooks/usePremiumBranchesByRegions';
 import { type Option } from '../../ui-kit/Select/Option';
+import { SelectControl } from '../../ui-kit/Select/SelectControl';
 import { withValidator } from '../../validation/withValidator';
-import { SelectControl } from './SelectControl';
 import { defaultValidator } from './validators';
 
 interface RegionFieldProps {

package/mobile/src/components/ApplicationForm/formStyle.ts

@@ -1,3 +1,3 @@
-export const formStyle = 'container space-y-lg';
+export const formStyle = 'container space-y-m';
 
 export const oneColumnFormStyle = 'w-full max-w-xl space-y-s m-auto';

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

@@ -1,10 +1,10 @@
 import { type FormFieldRegisterer } from '../../hooks/useForm';
+import { SelectControl } from '../../ui-kit/Select/SelectControl';
 import { withValidator } from '../../validation/withValidator';
 import { ACQUIRING_TYPES } from './acquiringTypes';
 import { ApplicationFieldsetLayout, formChildrenStyle } from './ApplicationFieldsetLayout';
 import { type AcquiringFormState } from './ApplicationFormAcquiring';
 import { RegionField } from './RegionField';
-import { SelectControl } from './SelectControl';
 import { defaultValidator } from './validators';
 
 interface AcquiringRegionProps {

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

@@ -8,7 +8,7 @@ import { Footnote } from './Footnote';
 import { renderSubmitButton } from './renderSubmitButton';
 import { checkboxValidator } from './validators';
 
-const agreementText = 'Нажимая кнопку, вы подтверждаете согласие с';
+const agreementText = 'Нажимая кнопку, вы подтверждаете согласие с ';
 export const renderAgreementSubmit = (
   consentDataProcessing?: FieldProps<boolean>,
   link?: LinkProps,

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

@@ -8,7 +8,7 @@ export const renderQuestionsInterested = (field: FormFieldRegisterer<WedFormStat
 
   return (
     <ApplicationFieldsetLayout>
-      <div className="gap-xl grid @xl:flex @xl:items-center">
+      <div className="gap-m grid @xl:flex @xl:items-center">
         <Radio
           name="vedTypes"
           text="Валютный контроль"

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

@@ -1,8 +1,8 @@
 import { type FormFieldRegisterer } from '../../hooks/useForm';
+import { DatePickerControl } from '../../ui-kit/DatePicker/DatePickerControl';
 import { InputControl } from '../../ui-kit/Input/InputControl';
 import { withValidator } from '../../validation/withValidator';
 import { type FeedbackFormState } from './ApplicationFormFeedback';
-import { DatePickerControl } from './DatePickerControl';
 import { defaultValidator, nameValidator } from './validators';
 
 export interface UserDataState {

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

@@ -16,7 +16,7 @@ export const renderWedDataOrganization = ({ field }: WedDataOrganizationProps) =
   return (
     <div className="space-y-s">
       {isCurrencyControl ? <RegionField field={field} /> : null}
-      <div className="grid @xl:grid-cols-2 @xl:gap-x-lg gap-s">
+      <div className="grid @xl:grid-cols-2 @xl:gap-x-m gap-s">
         {isCurrencyControl ? (
           <InputControl label="ИНН" {...withValidator(field('inn'), innValidator)} />
         ) : null}

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

@@ -1,4 +1,102 @@
 [
+  [
+    "Мошенничество",
+    {
+      "content": {
+        "title": "Сообщить о возможных мошеннических действиях",
+        "typeForm": "ANTIFRAUD",
+        "endpoint": "lead",
+        "sections": [
+          {
+            "inputs": [
+              {
+                "name": "surname",
+                "required": true
+              },
+              {
+                "name": "name",
+                "required": true
+              },
+              {
+                "name": "middleName"
+              },
+              {
+                "name": "phone",
+                "required": true
+              },
+              {
+                "name": "birthday",
+                "required": true
+              },
+              {
+                "name": "client"
+              },
+              {
+                "name": "comment",
+                "required": true
+              },
+              {
+                "name": "consentDataProcessing",
+                "required": true
+              }
+            ]
+          }
+        ],
+        "button": {
+          "text": "Отправить заявку",
+          "version": "primary"
+        },
+        "link": {
+          "text": "Согласен на обработку персональных данных",
+          "href": "/privacy-policy",
+          "target": "_blank"
+        }
+      }
+    }
+  ],
+  [
+    "Бизнес-карта",
+    {
+      "content": {
+        "title": "Заявка на выпуск бизнес-карты",
+        "typeForm": "BCRD",
+        "endpoint": "sendcorporatelead",
+        "sections": [
+          { "inputs": [{ "name": "region", "required": true }] },
+          {
+            "columns": 2,
+            "inputs": [
+              {
+                "name": "name",
+                "required": true
+              },
+              {
+                "name": "phone",
+                "required": true
+              },
+              {
+                "name": "inn",
+                "required": true
+              },
+              {
+                "name": "email",
+                "required": true
+              }
+            ]
+          }
+        ],
+        "button": {
+          "text": "Отправить заявку",
+          "version": "primary"
+        },
+        "link": {
+          "text": "условиями передачи данных",
+          "href": "/privacy-policy",
+          "target": "_blank"
+        }
+      }
+    }
+  ],
   [
     "Коррупция",
     {
@@ -6,37 +104,40 @@
         "title": "Сообщить о коррупции",
         "typeForm": "CORRUPTION",
         "endpoint": "lead",
-        "formColumns": 1,
-        "inputs": [
-          {
-            "name": "surname",
-            "required": true
-          },
-          {
-            "name": "name",
-            "required": true
-          },
-          {
-            "name": "middleName"
-          },
-          {
-            "name": "phone",
-            "required": true
-          },
-          {
-            "name": "region",
-            "required": true
-          },
-          {
-            "name": "email"
-          },
-          {
-            "name": "comment",
-            "required": true
-          },
-          {
-            "name": "consentDataProcessing",
-            "required": true
+        "sections": [
+          {
+            "inputs": [
+              {
+                "name": "surname",
+                "required": true
+              },
+              {
+                "name": "name",
+                "required": true
+              },
+              {
+                "name": "middleName"
+              },
+              {
+                "name": "phone",
+                "required": true
+              },
+              {
+                "name": "region",
+                "required": true
+              },
+              {
+                "name": "email"
+              },
+              {
+                "name": "comment",
+                "required": true
+              },
+              {
+                "name": "consentDataProcessing",
+                "required": true
+              }
+            ]
           }
         ],
         "button": {
@@ -52,47 +153,36 @@
     }
   ],
   [
-    "Мошенничество",
+    "Самоинкассация",
     {
       "content": {
-        "title": "Сообщить о возможных мошеннических действиях",
-        "typeForm": "ANTIFRAUD",
-        "endpoint": "lead",
-        "inputs": [
-          {
-            "name": "surname",
-            "required": true
-          },
-          {
-            "name": "name",
-            "required": true
-          },
-          {
-            "name": "middleName"
-          },
-          {
-            "name": "phone",
-            "required": true
-          },
-          {
-            "name": "birthday",
-            "required": true
-          },
-          {
-            "name": "client"
-          },
-          {
-            "name": "comment",
-            "required": true
-          },
-          {
-            "name": "consentDataProcessing",
-            "required": true
+        "title": "Заполните заявку на консультацию",
+        "typeForm": "SELFCOLLECTION",
+        "endpoint": "sendcorporatelead",
+        "sections": [
+          {
+            "inputs": [
+              {
+                "name": "fullName",
+                "required": true
+              },
+              {
+                "name": "region",
+                "required": true
+              },
+              {
+                "name": "phone",
+                "required": true
+              },
+              {
+                "name": "consentDataProcessing",
+                "required": true
+              }
+            ]
           }
         ],
-        "formColumns": 1,
         "button": {
-          "text": "Отправить",
+          "text": "Отправить заявку",
           "version": "primary"
         },
         "link": {
@@ -103,4 +193,4 @@
       }
     }
   ]
-]
+]

package/mobile/src/components/ApplicationFormCustom/ApplicationFormCustom.tsx

@@ -10,8 +10,11 @@ import { isValidationSuccess } from '../../validation/validator';
 import { formStyle } from '../ApplicationForm/formStyle';
 import { getFormatData } from '../ApplicationForm/getFormatData';
 import { renderAgreementSubmit } from '../ApplicationForm/renderAgreementSubmit';
-import { type ApplicationFormCustomContent, type FieldDef } from './ApplicationFormCustomContent';
-import { columnStyle } from './columnStyle';
+import {
+  type ApplicationFormCustomContent,
+  type FieldDef,
+  type FormColumnsCount,
+} from './ApplicationFormCustomContent';
 import { getField } from './getField';
 import { getInitialFormState } from './getInitialFormState';
 import { getObjectValidator } from './getObjectValidator';
@@ -20,11 +23,10 @@ interface ApplicationFormCustomProps extends ApplicationFormCustomContent, UniBl
 const API = LeadServiceAPI();
 
 export const ApplicationFormCustom = JSX<ApplicationFormCustomProps>(
-  ({ className, title, typeForm = '', inputs = [], button, link, formColumns = 2, endpoint }) => {
+  ({ className, title, typeForm = '', sections = [], button, link, endpoint }) => {
+    const inputs = (sections?.flatMap((_) => _?.inputs) || []) as FieldDef[];
     const initialFormState = getInitialFormState(inputs, typeForm);
-
     const [responseType, setResponseType] = useState<'OK' | 'Fail' | ''>('');
-
     const feedbackValidator = objectValidator(getObjectValidator(inputs));
 
     const handleSubmit = useCallback(async (data: Record<string, any>) => {
@@ -47,9 +49,15 @@ export const ApplicationFormCustom = JSX<ApplicationFormCustomProps>(
         title={title}
         responseType={responseType}
       >
-        <form className={columnStyle[formColumns]} onSubmit={onSubmit}>
-          {inputs.map((_, index) => (
-            <div key={String(index)}>{getField(_, field)}</div>
+        <form className="" onSubmit={onSubmit}>
+          {sections.map((_, i) => (
+            <div
+              key={`section-${i}`}
+              className={style(inputColumnStyles(_.columns), 'grid gap-x-m')}
+            >
+              {_?.title ? <div className="@xl:text-center @xl:col-span-2">{_.title}</div> : null}
+              {_?.inputs?.map(getField(field))}
+            </div>
           ))}
           {renderAgreementSubmit(
             fieldName ? field('consentDataProcessing') : undefined,
@@ -62,5 +70,8 @@ export const ApplicationFormCustom = JSX<ApplicationFormCustomProps>(
   },
 );
 
+const inputColumnStyles = (column: FormColumnsCount | undefined) =>
+  column === 2 ? '@xl:grid-cols-2' : '';
+
 const getConsentDataProcessing = (inputs: FieldDef[]) =>
   inputs.find((_) => _?.name === 'consentDataProcessing');

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

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