@redneckz/wildless-cms-uni-blocks 0.14.609 → 0.14.616

package/mobile/src/ui-kit/FormField/Fields/Experience5YearsField.tsx

@@ -1,13 +1,14 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { InputControl } from '../../Input/InputControl';
+import { InputNumberControl } from '../../Input/InputNumberControl';
 import { type CustomFieldProps } from '../CustomFieldProps';
 import { validatorObj } from '../getObjectValidator';
 import { getValidation } from '../getValidation';
 
 export const Experience5YearsField = JSX<CustomFieldProps>(({ field, input }) => (
-  <InputControl
+  <InputNumberControl
     label="Стаж"
     placeholder="За последние 5 лет"
+    inputLength={2}
     {...getValidation(field('experience5Years'), validatorObj.experience5Years, input?.required)}
     {...input}
   />

package/mobile/src/ui-kit/FormField/Fields/FamilyMembersField.tsx

@@ -1,14 +1,14 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { InputControl } from '../../Input/InputControl';
+import { InputNumberControl } from '../../Input/InputNumberControl';
 import { type CustomFieldProps } from '../CustomFieldProps';
 import { validatorObj } from '../getObjectValidator';
 import { getValidation } from '../getValidation';
 
 export const FamilyMembersField = JSX<CustomFieldProps>(({ field, input }) => (
-  <InputControl
+  <InputNumberControl
     label="Количество членов семьи"
     placeholder="Введите значение"
-    type="number"
+    inputLength={2}
     {...getValidation(field('familyMembers'), validatorObj.familyMembers, input?.required)}
     {...input}
   />

package/mobile/src/ui-kit/FormField/Fields/GeneralSeniorityField.tsx

@@ -1,12 +1,13 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { InputControl } from '../../Input/InputControl';
+import { InputNumberControl } from '../../Input/InputNumberControl';
 import { type CustomFieldProps } from '../CustomFieldProps';
 import { validatorObj } from '../getObjectValidator';
 import { getValidation } from '../getValidation';
 
 export const GeneralSeniorityField = JSX<CustomFieldProps>(({ field, input }) => (
-  <InputControl
+  <InputNumberControl
     label="Общий стаж"
+    inputLength={2}
     placeholder="Количество лет"
     {...getValidation(field('generalSeniority'), validatorObj.generalSeniority, input?.required)}
     {...input}

package/mobile/src/ui-kit/FormField/Fields/InnField.tsx

@@ -1,7 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { type DaDataSuggestion } from '../../../api/dadataHints/dadataHintsType';
-import { InputControl } from '../../Input/InputControl';
+import { InputNumberControl } from '../../Input/InputNumberControl';
 import { type CustomFieldProps } from '../CustomFieldProps';
 import { validatorObj } from '../getObjectValidator';
 import { getValidation } from '../getValidation';
@@ -13,9 +13,9 @@ export const InnField = JSX<CustomFieldProps>(({ field, input }) => {
   }, []);
 
   return (
-    <InputControl
+    <InputNumberControl
       label="ИНН"
-      type="number"
+      inputLength={12}
       {...input}
       {...getValidation(field('inn'), validatorObj.inn, input?.required)}
       onDaDataChange={onDaDataChange}

package/mobile/src/ui-kit/FormField/Fields/JobsNumberField.tsx

@@ -1,14 +1,14 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { InputControl } from '../../Input/InputControl';
+import { InputNumberControl } from '../../Input/InputNumberControl';
 import { type CustomFieldProps } from '../CustomFieldProps';
 import { validatorObj } from '../getObjectValidator';
 import { getValidation } from '../getValidation';
 
 export const JobsNumberField = JSX<CustomFieldProps>(({ field, input }) => (
-  <InputControl
-    label="Общий стаж"
-    placeholder="Количество лет"
-    type="number"
+  <InputNumberControl
+    label="Количество мест работы за последние 5 лет"
+    placeholder="Количество мест"
+    inputLength={2}
     {...getValidation(field('jobsNumber'), validatorObj.jobsNumber, input?.required)}
     {...input}
   />

package/mobile/src/ui-kit/FormField/Fields/LastJobExperienceField.tsx

@@ -1,13 +1,14 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { InputControl } from '../../Input/InputControl';
+import { InputNumberControl } from '../../Input/InputNumberControl';
 import { type CustomFieldProps } from '../CustomFieldProps';
 import { validatorObj } from '../getObjectValidator';
 import { getValidation } from '../getValidation';
 
 export const LastJobExperienceField = JSX<CustomFieldProps>(({ field, input }) => (
-  <InputControl
+  <InputNumberControl
     label="Стаж на последнем рабочем месте"
     placeholder="Количество лет"
+    inputLength={2}
     {...getValidation(field('lastJobExperience'), validatorObj.lastJobExperience, input?.required)}
     {...input}
   />

package/mobile/src/ui-kit/FormField/Fields/PartInBusinessField.tsx

@@ -0,0 +1,15 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { InputNumberControl } from '../../Input/InputNumberControl';
+import { type CustomFieldProps } from '../CustomFieldProps';
+import { validatorObj } from '../getObjectValidator';
+import { getValidation } from '../getValidation';
+
+export const PartInBusinessField = JSX<CustomFieldProps>(({ field, input }) => (
+  <InputNumberControl
+    label="Доля участия в бизнесе"
+    placeholder="в %"
+    inputLength={2}
+    {...getValidation(field('partInBusiness'), validatorObj.partInBusiness, input?.required)}
+    {...input}
+  />
+));

package/mobile/src/ui-kit/FormField/NameFieldDef.ts

@@ -81,4 +81,5 @@ export type NameFieldDef =
   | 'bankruptcyFlg'
   | 'shareholderFlg'
   | 'legalEntityName'
-  | 'bankEmployeeCode';
+  | 'bankEmployeeCode'
+  | 'partInBusiness';

package/mobile/src/ui-kit/FormField/SelectField.tsx

@@ -1,5 +1,6 @@
 import { UniBlock } from '../../UniBlock/UniBlock';
 import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
+import { type Option } from '../Select/Option';
 import { SelectControl } from '../Select/SelectControl';
 import { type CustomFieldProps } from './CustomFieldProps';
 import { validatorObj } from './getObjectValidator';
@@ -34,4 +35,5 @@ export const SelectField = UniBlock<SelectFieldProps>(
   },
 );
 
-const arrayToOptions = (array?: string[]) => (array ?? []).map((_) => ({ key: _, value: _ }));
+const arrayToOptions = (array?: string[]): Option[] =>
+  (array ?? []).map((_) => ({ key: _, text: _ }));

package/mobile/src/ui-kit/FormField/getField.tsx

@@ -60,6 +60,7 @@ import { OtherIncomeField } from './Fields/OtherIncomeField';
 import { OtherPaymentsField } from './Fields/OtherPayments';
 import { ParticipantAddressField } from './Fields/ParticipantAddressField';
 import { ParticipantDateRegistrationField } from './Fields/ParticipantDateRegistrationField';
+import { PartInBusinessField } from './Fields/PartInBusinessField';
 import { PartnerCommentsField } from './Fields/PartnerCommentsField';
 import { PhoneField } from './Fields/PhoneField';
 import { PositionOrganizationField } from './Fields/PositionOrganizationField';
@@ -178,6 +179,7 @@ export const getField =
       legalEntityName: <LegalEntityNameField field={field} input={input} />,
       creditInRshbCd: <CreditInRshbCdField field={field} input={input} />,
       bankEmployeeCode: <BankEmpoleeCodeField field={field} input={input} />,
+      partInBusiness: <PartInBusinessField field={field} input={input} />,
     };
 
     return isRenderField({ input, field }) ? (

package/mobile/src/ui-kit/FormField/getObjectValidator.tsx

@@ -7,6 +7,7 @@ import {
   defaultValidator,
   emailValidator,
   innValidator,
+  jobNumberValidator,
   lengthStringValidator,
   nameValidator,
   numberValidator,
@@ -44,10 +45,10 @@ export const validatorObj: Record<string, Validator> = {
   inn: innValidator('Укажите ИНН'),
   legalForm: defaultValidator('Укажите ОПФ'),
   organizationName: defaultValidator('Укажите наименование организации'),
-  generalSeniority: defaultValidator(),
-  lastJobExperience: defaultValidator('Укажите стаж на последнем месте работы'),
-  experience5Years: defaultValidator('Укажите общий стаж за последние 5 лет'),
-  jobsNumber: defaultValidator('Укажите количество лет стажа'),
+  generalSeniority: jobNumberValidator('Укажите количество лет стажа'),
+  lastJobExperience: jobNumberValidator('Укажите стаж на последнем месте работы'),
+  experience5Years: jobNumberValidator('Укажите общий стаж за последние 5 лет'),
+  jobsNumber: jobNumberValidator('Укажите количество мест работы за последние 5 лет'),
   beginDate: defaultValidator('Укажите дату заключения трудового договора'),
   fullAddress: defaultValidator(),
   partnerComments: defaultValidator(),
@@ -89,12 +90,11 @@ export const validatorObj: Record<string, Validator> = {
   shareholderFlg: defaultValidator(),
   legalEntityName: defaultValidator(),
   bankEmployeeCode: defaultValidator(),
+  partInBusiness: defaultValidator(),
 };
 
 export const getObjectValidator = (inputs: FieldDef[]): Record<string, Validator> => {
-  const requiredInputs = getNamesFromInput(
-    inputs.filter((_: FieldDef) => ('required' in _ ? _.required : false)),
-  );
+  const requiredInputs = getNamesFromInput(inputs.filter((_: FieldDef) => Boolean(_?.required)));
 
   return Object.fromEntries(requiredInputs.map((_) => [_, validatorObj?.[_]]));
 };

package/mobile/src/ui-kit/FormField/validators.ts

@@ -9,6 +9,11 @@ export const defaultValidator = (errorMsg?: string) =>
 
 export const defaultSelectValidator = validator((_) => _?.key && _?.key !== '')(ERROR_MESSAGE);
 
+export const jobNumberValidator = (errorMsg?: string) =>
+  validator((_) => typeof _ === 'string' && _.length > 0 && _.length <= 2)(
+    errorMsg ? errorMsg : ERROR_MESSAGE,
+  );
+
 export const nameValidator = (errorMsg?: string) =>
   validator((_) => typeof _ === 'string' && _.length > 1)(errorMsg ? errorMsg : ERROR_MESSAGE);
 

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

@@ -2,21 +2,27 @@ import { JSX } from '@redneckz/uni-jsx';
 import { type IconVersion } from '../../model/IconVersion';
 import { Icon } from '../Icon/Icon';
 import { type IconName } from '../Icon/IconProps';
+import { LinkButton } from '../LinkButton/LinkButton';
+import { type LinkButtonProps } from '../LinkButton/LinkButtonProps';
 import { RichText } from '../RichText/RichText';
 
-interface InfoCardProps {
+export interface InfoCardProps {
   __html?: string;
   icon?: IconName;
   iconVersion?: IconVersion;
+  link?: LinkButtonProps;
 }
 
 export const InfoCard = JSX<InfoCardProps>(
-  ({ __html, icon = 'InfoCircleIcon', iconVersion = 'black' }) => (
+  ({ __html, icon = 'InfoCircleIcon', iconVersion = 'black', link }) => (
     <div className="flex flex-row items-center w-full min-h-14 bg-main-gray rounded-lg gap-m p-m">
       <div className="rounded-full bg-white p-xs">
         <Icon name={icon} width="24" height="24" iconVersion={iconVersion} />
       </div>
-      <RichText __html={__html} />
+      <div className="">
+        <RichText __html={__html} />
+        {link?.text ? <LinkButton className="text-primary-main">{link.text}</LinkButton> : null}
+      </div>
     </div>
   ),
 );

package/mobile/src/ui-kit/Input/InputNumberControl.tsx

@@ -0,0 +1,18 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { getRequiredLabel } from '../../utils/getRequiredLabel';
+import { style } from '../../utils/style';
+import { InputNumber } from '../InputNumber/InputNumber';
+import { type InputProps } from './InputProps';
+import { renderErrorText } from './renderErrorText';
+
+export const InputNumberControl = JSX<InputProps>(({ className, label, error, ...rest }) => (
+  <div className={style('shrink-0 w-full', className)}>
+    <InputNumber
+      aria-label={label}
+      label={getRequiredLabel({ label, errors: rest?.errors })}
+      valid={Boolean(!error)}
+      {...rest}
+    />
+    {renderErrorText(error)}
+  </div>
+));

package/mobile/src/ui-kit/Input/InputProps.ts

@@ -1,5 +1,5 @@
-import { type DefaultControlType } from '../../model/DefaultControlType';
 import { type DaDataSuggestion } from '../../api/dadataHints/dadataHintsType';
+import { type DefaultControlType } from '../../model/DefaultControlType';
 import { type InputTypes } from '../../model/InputTypes';
 import { type ControlProps } from '../ControlProps';
 import { type PreventableEventWithTarget } from '../PreventableEvent';
@@ -18,4 +18,5 @@ export interface InputProps<V = string> extends DefaultControlType, ControlProps
   autoFocus?: boolean;
   isTextarea?: boolean;
   dadata?: boolean;
+  inputLength?: number;
 }

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

@@ -0,0 +1,24 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { Input } from '../Input/Input';
+import { type InputProps } from '../Input/InputProps';
+
+export const InputNumber = JSX<InputProps>(({ children, onChange, inputLength, ...inputProps }) => {
+  const handleChange = useCallback(
+    (v: string) =>
+      onChange && inputLength && v.length <= inputLength && onChange(normalizeInput(v)),
+    [onChange],
+  );
+
+  return (
+    <Input
+      {...inputProps}
+      onChange={handleChange}
+      onFocus={(ev) => handleChange((ev?.target as HTMLInputElement)?.value || '')}
+    >
+      {children}
+    </Input>
+  );
+});
+
+const normalizeInput = (value: string) => value.replace(/\D/g, '');

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

@@ -1,12 +1,12 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { normalizeWithMask } from '../../utils/normalizeWithMask';
 import { Input } from '../Input/Input';
 import { type InputProps } from '../Input/InputProps';
-import { normalizeSnils } from './normalizeSnils';
 
 export const SnilsInput = JSX<InputProps>(({ children, onChange, ...inputProps }) => {
   const handleChange = useCallback(
-    (v: string) => onChange && onChange(normalizeSnils(v)),
+    (v: string) => onChange && onChange(normalizeWithMask(v, '___-___-___ __')),
     [onChange],
   );
   const handleBlur = useCallback((v: string) => {

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

@@ -1,6 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
 import { Headline } from '../../components/Headline/Headline';
+import { style } from '../../utils/style';
 import { RichText } from '../RichText/RichText';
 import { Timer } from './Timer';
 
@@ -17,20 +18,24 @@ export const TimerCircle = JSX<TimerCircleProps>(({ interval = 0, title, __html
 
   return (
     <div>
-      <Headline title={title} headlineVersion="S" />
+      {title ? <Headline title={title} headlineVersion="S" /> : null}
       <div className="flex justify-center items-center flex-col">
-        <div className="relative flex items-center justify-center w-60 h-60 rounded-full bg-gray text-transparent mb-5">
+        <div
+          className={style(
+            `relative flex items-center justify-center w-24 h-24 rounded-full bg-gray text-transparent mb-5`,
+          )}
+        >
           <div
             className="absolute inset-0 rounded-full"
             style={{
               background: `conic-gradient(rgb(66, 171, 68) ${gradientPercentage}%, rgb(125, 126, 127) 0deg)`,
             }}
           />
-          <div className="z-10 flex items-center justify-center px-4 py-2 rounded-full w-56 h-56 bg-white text-3xl text-primary-text">
+          <div className="z-10 flex items-center justify-center px-4 py-2 rounded-full w-20 h-20 bg-white text-primary-text text-m">
             <Timer interval={interval} time={time} setTime={setTime} />
           </div>
         </div>
-        <RichText __html={__html} />
+        {__html ? <RichText __html={__html} /> : null}
       </div>
     </div>
   );

package/mobile/src/utils/normalizeWithMask.ts

@@ -0,0 +1,23 @@
+export function normalizeWithMask(value: string, pattern: string): string {
+  const valueNumbers = value.replace(/\D/g, '');
+  if (valueNumbers === '' || value?.length === pattern.length) {
+    return value;
+  }
+
+  const patternInArr = [...pattern];
+  const firstPlaceholderIndex = patternInArr.findIndex(isPlaceholder);
+  const valueWildcardIndicies = patternInArr.map((_, i) =>
+    isWildcard(_) ? patternInArr.slice(0, i).filter(isWildcard).length : -1,
+  );
+  const applyPlaceholder = (_: string, i: number) =>
+    isDigit(_) ? _ : valueNumbers.charAt(valueWildcardIndicies[i]) || _;
+
+  const resultInArr = patternInArr.map(applyPlaceholder);
+  const resultLength = valueWildcardIndicies.indexOf(valueNumbers.length - 1) + 1;
+
+  return resultInArr.slice(0, Math.max(firstPlaceholderIndex, resultLength)).join('');
+}
+
+const isPlaceholder = (_: string) => _ === '_';
+const isDigit = (_: string) => /\d/.test(_);
+const isWildcard = (_: string) => isPlaceholder(_) || isDigit(_);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.609",
+  "version": "0.14.616",
   "private": false,
   "license": "MIT",
   "author": "ЦК",
@@ -210,7 +210,7 @@
       "path": "lib/common.css"
     },
     {
-      "limit": "79 kB",
+      "limit": "81 kB",
       "path": "bundle/bundle.umd.min.js"
     }
   ],

package/src/api/RetailAPI/utils/getUpdateUserTask.ts

@@ -1,10 +1,13 @@
+import { type FormState } from '../../../components/ApplicationLeadForm/getInitialFormState';
+import { formatDate } from '../../../utils/formatDate';
+import { formatPhone } from '../../../utils/formatPhone';
 import { type UpdateUserTaskBody } from '../updateUserTask';
 
 type getUpdateUserTaskDataType = {
   participantId: number;
   taskId: number;
   profileId: number;
-  formData?: Record<string, any>;
+  formData: FormState;
 };
 
 export const getUpdateUserTaskData = ({
@@ -12,41 +15,52 @@ export const getUpdateUserTaskData = ({
   taskId,
   profileId,
   formData,
-}: getUpdateUserTaskDataType): UpdateUserTaskBody => ({
-  sendToBank: true,
-  taskKind: 'SHORT',
-  task: {
-    taskSource: globalThis.location.origin,
-    id: taskId,
-    participants: [
-      {
-        birthDate: formData?.birthDate,
-        id: participantId,
-        midname: formData?.midname,
-        name: formData?.name,
-        surname: formData?.surname,
-        profile: {
-          id: profileId,
-        },
-        participantContacts: [
-          {
-            contactTypeCd: {
-              key: 'EMAIL',
-            },
-            value: formData?.email,
+}: getUpdateUserTaskDataType): UpdateUserTaskBody => {
+  const {
+    name = '',
+    surname = '',
+    middleName = '',
+    birthday = '',
+    phone = '',
+    email = '',
+  } = formData;
+
+  return {
+    sendToBank: true,
+    taskKind: 'SHORT',
+    task: {
+      taskSource: globalThis.location.origin,
+      id: taskId,
+      participants: [
+        {
+          birthDate: formatDate(birthday, true),
+          id: participantId,
+          midname: middleName,
+          name: name,
+          surname: surname,
+          profile: {
+            id: profileId,
           },
-          {
-            contactTypeCd: {
-              key: 'MAIN_PHONE',
+          participantContacts: [
+            {
+              contactTypeCd: {
+                key: 'EMAIL',
+              },
+              value: email,
             },
-            value: formData?.phone,
+            {
+              contactTypeCd: {
+                key: 'MAIN_PHONE',
+              },
+              value: formatPhone(phone),
+            },
+          ],
+          roleCd: {
+            key: 'BORROWER',
+            value: 'Заемщик',
           },
-        ],
-        roleCd: {
-          key: 'BORROWER',
-          value: 'Заемщик',
         },
-      },
-    ],
-  },
-});
+      ],
+    },
+  };
+};

package/src/components/ApplicationLeadForm/ApplicationLeadForm.tsx

@@ -57,7 +57,7 @@ export const ApplicationLeadForm = JSX<ApplicationLeadFormProps>(
               className={style(inputColumnStyles(_.columns), 'grid gap-x-m')}
             >
               {renderTitle(_.title)}
-              {renderInputs({ field, typeForm, inputs: _?.inputs })}
+              {renderInputs({ field, inputs: _?.inputs })}
             </div>
           ))}
           {renderSubmitButton(button)}

package/src/components/ApplicationLeadForm/getInitialFormState.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable max-lines */
 import {
   FEEDBACK_METHOD,
   SERVICE_DIRECTIONS,
@@ -98,6 +99,7 @@ export interface FormState extends FormConsents {
   shareholderFlg?: boolean;
   legalEntityName?: string;
   bankEmployeeCode?: number;
+  partInBusiness?: number;
 }
 
 const initialFormState = {
@@ -139,7 +141,8 @@ export const getInitialFormState = (
   typeForm = '',
 ): FormState => {
   if (savedForm) {
-    const formState = JSON.parse(savedForm) as FormState;
+    const formState =
+      typeof savedForm === 'string' ? (JSON.parse(savedForm) as FormState) : savedForm;
     formState.birthday = new Date(formState?.birthday || 0);
 
     return formState;

package/src/components/ApplicationStatus/ApplicationStatus.example.json

@@ -0,0 +1,6 @@
+{
+  "content": {
+    "version": "primary",
+    "padding": ""
+  }
+}