@redneckz/wildless-cms-uni-blocks 0.15.341 → 0.16.1

package/mobile/src/ui-kit/Calculator/renderBinaryRadioButtonGroup.tsx

@@ -4,7 +4,6 @@ import {
   type RadioButtonItem,
 } from '../../ui-kit/RadioButtonGroup/RadioButtonGroup';
 import { Text } from '../../ui-kit/Text/Text';
-import { style } from '../../utils/style';
 
 export interface BinaryRadioButtonGroupProps {
   items: [truthy: RadioButtonItem, falsy: RadioButtonItem];
@@ -12,8 +11,9 @@ export interface BinaryRadioButtonGroupProps {
   mobileTitle?: string;
   orientation?: ListOrientation;
   value?: boolean;
-  radioGroupClassName?: string;
+  className?: string;
   onChange?: (value: boolean) => void;
+  disabled?: boolean;
 }
 
 export const renderBinaryRadioButtonGroup = ({
@@ -22,19 +22,19 @@ export const renderBinaryRadioButtonGroup = ({
   mobileTitle = title,
   orientation = 'horizontal',
   value,
-  radioGroupClassName,
   onChange,
+  ...rest
 }: BinaryRadioButtonGroupProps) => (
-  <div className="space-y-s">
+  <div className="grid gap-s whitespace-nowrap">
     {title ? (
-      <div className="hidden @5xl:block">
+      <div className="hidden @5xl:block" role="radiogroup" aria-label={title}>
         <Text color="text-secondary-text" font="font-light">
           {title}
         </Text>
       </div>
     ) : null}
     {mobileTitle ? (
-      <div className="@5xl:hidden">
+      <div className="@5xl:hidden" role="radiogroup" aria-label={mobileTitle}>
         <Text color="text-secondary-text" font="font-light">
           {mobileTitle}
         </Text>
@@ -45,8 +45,8 @@ export const renderBinaryRadioButtonGroup = ({
       orientation={orientation}
       items={items}
       checkedItem={items[value ? 0 : 1].id}
-      className={style('flex-col sm:flex-row', radioGroupClassName)}
       onChange={(_) => onChange && onChange(_ === items[0].id)}
+      {...rest}
     />
   </div>
 );

package/mobile/src/ui-kit/Calculator/renderFootnote.tsx

@@ -1,8 +1,8 @@
 import { Paragraph } from '../Paragraph/Paragraph';
 
-export const renderFootnote = (text?: string) =>
+export const renderFootnote = (text?: string, key?: number) =>
   text ? (
-    <Paragraph size="text-s" font="font-light" color="text-secondary-text">
+    <Paragraph key={String(key)} size="text-xs" font="font-light" color="text-secondary-text">
       {text}
     </Paragraph>
   ) : null;

package/mobile/src/ui-kit/Calculator/renderPaymentType.tsx

@@ -6,7 +6,7 @@ import {
 export const renderPaymentType = (props: Partial<BinaryRadioButtonGroupProps>) =>
   renderBinaryRadioButtonGroup({
     ...props,
-    radioGroupClassName: 'sm:flex-col',
+    className: 'sm:flex-col',
     items: [
       { id: 'annuity', text: 'Аннуитетный' },
       { id: 'differential', text: 'Дифференцированный' },

package/mobile/src/ui-kit/Calculator/renderRate.tsx

@@ -1,9 +1,11 @@
-import { CalculatorValueBlock } from './CalculatorValueBlock';
+import { type VNode } from '../../model/VNode';
+import { CalculatorValue } from './CalculatorValue';
 import { Rate, type RateProps } from './Rate';
 import { UnknownRate, type UnknownRateProps } from './UnknownRate';
 
 interface RenderRateProps extends RateProps, UnknownRateProps {
   isUnknownRateShown?: boolean;
+  children?: VNode;
 }
 
 export const renderRate = ({
@@ -12,24 +14,34 @@ export const renderRate = ({
   unit = '%',
   fractionDigits = 2,
   isUnknownRateShown = true,
+  color = 'text-secondary-text',
+  children,
   ...rest
 }: RenderRateProps) =>
   isUnknownRateShown && rate === 0 ? (
     <UnknownRate title={title} {...rest} />
   ) : (
-    <div>
-      <div className="hidden @xl:block">
-        <Rate title={title} rate={rate} unit={unit} fractionDigits={fractionDigits} {...rest} />
-      </div>
-      <div className="@xl:hidden">
-        <CalculatorValueBlock
+    <div className="flex flex-col">
+      <div className="hidden @xl:block min-w-96">
+        <Rate
           title={title}
-          value={rate}
-          postfix={unit}
+          rate={rate}
+          unit={unit}
           fractionDigits={fractionDigits}
-          fixed={true}
+          color={color}
           {...rest}
         />
       </div>
+      <CalculatorValue
+        className="@xl:hidden"
+        title={title}
+        value={rate}
+        postfix={unit}
+        fractionDigits={fractionDigits}
+        fixed={true}
+        color={color}
+        {...rest}
+      />
+      {children}
     </div>
   );

package/mobile/src/ui-kit/Calculator/renderWantedSumInput.tsx

@@ -6,17 +6,25 @@ const DEFAULT_MONEY_STEP = 1000;
 
 interface RenderWantedSumParams extends InputRangeProps {
   isShowItems?: boolean;
+  postfix?: string;
 }
 
-export function renderWantedSumInput({
+export const renderWantedSumInput = ({
   isShowItems = true,
   step = DEFAULT_MONEY_STEP,
+  postfix = '₽',
   ...rest
-}: RenderWantedSumParams) {
-  const items = [
-    `От ${toLocalNumberFormat(2)(rest.min || 0)} ₽`,
-    `До ${toLocalNumberFormat(2)(rest.max || 0)} ₽`,
-  ];
-
-  return <InputRange items={isShowItems ? items : []} step={step} {...rest} />;
-}
+}: RenderWantedSumParams) => (
+  <InputRange
+    items={
+      isShowItems
+        ? [
+            `От ${toLocalNumberFormat(1)(rest.min || 0)} ${postfix}`,
+            `До ${toLocalNumberFormat(1)(rest.max || 0)} ${postfix}`,
+          ]
+        : []
+    }
+    step={step}
+    {...rest}
+  />
+);

package/mobile/src/ui-kit/Calculator/setDefaultParamsCalc.tsx

@@ -0,0 +1,33 @@
+import {
+  type CreditCalculatorParams,
+  type CreditCalculatorSourceBookParams,
+} from '../../components/CalculatorCredit/CalculatorCreditContent';
+import {
+  type DepositCalculatorParams,
+  type DepositCalculatorSourceBookParams,
+} from '../../components/CalculatorDeposit/getDepositCalculatorParams';
+import { type FormFieldRegisterer } from '../../hooks/useForm';
+import { clamp } from '../../utils/clamp';
+
+interface ParamsCalcProps {
+  field: FormFieldRegisterer<any>;
+  defParams: CreditCalculatorSourceBookParams | DepositCalculatorSourceBookParams;
+  calcParams: CreditCalculatorParams | DepositCalculatorParams;
+  map: Record<string, string>;
+  monthsValue: 'maxMonths' | 'minMonths';
+}
+
+export const setDefaultParamsCalc = ({
+  field,
+  defParams,
+  calcParams,
+  map,
+  monthsValue = 'maxMonths',
+}: ParamsCalcProps) => {
+  Object.entries(map).forEach(([key, value]) => {
+    field?.(key)?.onChange?.(defParams?.[value]);
+  });
+  field?.('monthsValue')?.onChange?.(
+    clamp(defParams?.[monthsValue], calcParams.minMonths, calcParams.maxMonths),
+  );
+};

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

@@ -5,6 +5,7 @@ import { type PreventableEvent } from '../PreventableEvent';
 import { SVG } from '../SVG';
 import { Text } from '../Text/Text';
 import { type CheckboxProps } from './CheckboxProps';
+import { defaultCheckStyle } from './checkboxStyle';
 
 const CHECK_PATHS = [
   {
@@ -45,33 +46,41 @@ export const Checkbox = JSX<CheckboxProps>(
     return (
       <div className={className}>
         <label
-          className="flex items-center relative cursor-pointer group/box"
+          className={style('flex items-center relative group/box', getCursorStyle(disabled))}
           onClick={handleChange}
         >
           <div
             className={style(
-              'appearance-none w-5 h-5 border-solid cursor-pointer m-0',
+              defaultCheckStyle,
+              'm-0',
               isRadio ? 'rounded-full border-2' : checkboxStyle(value),
-              value ? 'border-primary-main' : 'border-gray',
+              !disabled && value ? 'border-primary-main' : 'border-gray',
               disabled ? 'bg-main-disabled' : 'group-hover/box:border-primary-hover',
             )}
             role={role(isRadio)}
             aria-checked={Boolean(value)}
             aria-disabled={Boolean(disabled)}
+            aria-label={text}
           />
           {value ? icon : null}
-          {text ? (
-            <div className="ml-s">
-              <Text size="text-l" font="font-light">
-                {text}
-              </Text>
-            </div>
-          ) : null}
+          {renderText(text)}
         </label>
       </div>
     );
   },
 );
 
-const role = (isRadio?: boolean) => (isRadio ? 'radio' : 'checkbox');
-const checkboxStyle = (value?: boolean) => style('rounded border', value ? 'bg-primary-main' : '');
+const renderText = (text?: string) =>
+  text ? (
+    <div className="ml-s">
+      <Text size="text-l" font="font-light">
+        {text}
+      </Text>
+    </div>
+  ) : null;
+
+const getCursorStyle = (disabled = false) => (disabled ? 'cursor-not-allowed' : 'cursor-pointer');
+
+const role = (isRadio = false) => (isRadio ? 'radio' : 'checkbox');
+
+const checkboxStyle = (value = false) => style('rounded border', { 'bg-primary-main': value });

package/mobile/src/ui-kit/Checkbox/CheckboxWithError.tsx

@@ -6,7 +6,7 @@ import { type CheckboxProps } from './CheckboxProps';
 
 export const CheckboxWithError = JSX<CheckboxProps>(
   ({ className, text, value, key, disabled, error, onChange }) => (
-    <div className={style('shrink-0 w-full', className)}>
+    <div className={style('shrink-0', className)}>
       <Checkbox key={key} text={text} value={value} disabled={disabled} onChange={onChange} />
       {renderErrorText(error)}
     </div>

package/mobile/src/ui-kit/Checkbox/checkboxStyle.tsx

@@ -0,0 +1 @@
+export const defaultCheckStyle = 'appearance-none w-5 h-5 border-solid flex-none';

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

@@ -2,76 +2,44 @@ import { JSX } from '@redneckz/uni-jsx';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
 import { useDebouncedEffect } from '@redneckz/uni-jsx/lib/hooks/useDebouncedEffect';
-import { type LinkCommonProps } from '../../model/LinkProps';
-import { style } from '../../utils/style';
-import { CloseButton } from '../DialogManager/CloseButton';
-import { LinkWrapper } from '../LinkWrapper/LinkWrapper';
-import { Paragraph } from '../Paragraph/Paragraph';
+import { CloseButton } from '../../ui-kit/DialogManager/CloseButton';
+import { RichText } from '../../ui-kit/RichText/RichText';
+import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
 
 interface CookiePopupProps {
-  termLink?: LinkCommonProps;
-  personalDataPolicyLink?: LinkCommonProps;
-  recommendationLink?: LinkCommonProps;
+  __html?: string;
 }
 
 const COOKIE_DIALOG_ID = 'cookie';
 const DIALOG_INITIAL_DELAY = 3 * 1000;
 
-export const CookiePopup = JSX<CookiePopupProps>(
-  ({ termLink, personalDataPolicyLink, recommendationLink }) => {
-    const [opened, { setTrue: open, setFalse: close }] = useBool();
+export const CookiePopup = JSX<CookiePopupProps & UniBlockProps>(({ __html }) => {
+  const [opened, { setTrue: open, setFalse: close }] = useBool();
+  useDebouncedEffect(
+    () => {
+      if (!globalThis.localStorage?.getItem(COOKIE_DIALOG_ID)) {
+        open();
+      }
+    },
+    [],
+    DIALOG_INITIAL_DELAY,
+  );
 
-    useDebouncedEffect(
-      () => {
-        if (!globalThis.localStorage?.getItem(COOKIE_DIALOG_ID)) {
-          open();
-        }
-      },
-      [],
-      DIALOG_INITIAL_DELAY,
-    );
+  const handleClose = useCallback(() => {
+    globalThis.localStorage?.setItem(COOKIE_DIALOG_ID, 'true');
+    close();
+  }, []);
 
-    const handleClose = useCallback(() => {
-      globalThis.localStorage?.setItem(COOKIE_DIALOG_ID, 'true');
-      close();
-    }, []);
-
-    return opened ? (
-      <div className="container fixed left-0 right-0 bottom-0 z-50" role="dialog">
-        <div className="bg-white m-xl p-xl rounded-md flex sm:items-center shadow-main-black">
-          <div className="sm:flex-1">
-            <Paragraph size="text-s" font="font-light" color="text-primary-text">
-              АО «Россельхозбанк» использует
-              <LinkWrapper isRemote className={linkWrapperStyle(termLink?.href)} {...termLink}>
-                cookie
-              </LinkWrapper>
-              (файлы с данными о прошлых посещениях сайта) для персонализации сервисов и удобства
-              пользователей. Вы можете запретить сохранение cookie в настройках своего браузера.
-              <LinkWrapper
-                isRemote
-                className={linkWrapperStyle(personalDataPolicyLink?.href)}
-                {...personalDataPolicyLink}
-              >
-                Обработка Ваших персональных данных
-              </LinkWrapper>
-              производится в соответствии с требованиями Федерального закона от 27.07.2006 № 152-Ф3
-              «О персональных данных». На сайте используются рекомендательные технологии согласно
-              <LinkWrapper
-                isRemote
-                className={linkWrapperStyle(recommendationLink?.href)}
-                {...recommendationLink}
-              >
-                Правилам применения рекомендательных технологий.
-              </LinkWrapper>
-            </Paragraph>
-          </div>
-          <div className="ml-s sm:ml-0 w-24 flex justify-end">
-            <CloseButton className="bg-main-gray rounded-md" onClose={handleClose} />
-          </div>
+  return opened && __html ? (
+    <div className="container fixed left-0 right-0 bottom-0 z-50" role="dialog">
+      <div className="bg-white m-xl p-xl rounded-md flex sm:items-center shadow-main-black">
+        <div className="sm:flex-1">
+          <RichText __html={__html} />
+        </div>
+        <div className="ml-s sm:ml-0 w-36 flex justify-end">
+          <CloseButton className="bg-main-gray rounded-md w-11 h-11" onClose={handleClose} />
         </div>
       </div>
-    ) : null;
-  },
-);
-
-const linkWrapperStyle = (href?: string) => style('inline mx-2xs', href ? 'text-green-dark' : '');
+    </div>
+  ) : null;
+});

package/mobile/src/ui-kit/DatePicker/Calendar.tsx

@@ -12,11 +12,15 @@ interface CalendarProps {
   min?: Date;
   max?: Date;
   onDateSelect?: (date: Date) => void;
+  setValue?: (value: boolean) => void;
 }
 
 export const Calendar = JSX<CalendarProps>(
-  ({ today, currentMonth, currentYear, min, max, onDateSelect = noop }) => {
-    const handleDateClick = useCallback((date: Date) => onDateSelect(date), []);
+  ({ today, currentMonth, currentYear, min, max, onDateSelect = noop, setValue = noop }) => {
+    const handleDateClick = useCallback((date: Date) => {
+      onDateSelect(date);
+      setValue(false);
+    }, []);
 
     const { firstDayOfWeek, totalDays } = useMemo(
       () => ({

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

@@ -71,7 +71,7 @@ export const DatePicker = JSX<DatePickerProps>(
         <div className="relative">
           {renderDatePickerForm(handleChangeVisibleCalendar, value, valid)}
           {showCalendar ? (
-            <div className="absolute bg-white z-20 select-none">
+            <div className="absolute bg-white z-20 select-none bottom-full">
               <div className="flex gap-s">
                 <div className="my-auto" onClick={handlePrevMonth}>
                   <Icon {...ICON_PROPS} className="-rotate-90 cursor-pointer" />

package/mobile/src/ui-kit/DatePicker/renderCalendarCells.tsx

@@ -71,6 +71,8 @@ const checkIsDisabled = (currentDate: Date, min: Date | undefined, max: Date | u
 const getDayStyles = (isToday: boolean | undefined, isDisabled: boolean | undefined) =>
   style(
     'p-s text-center rounded-md border',
-    isToday ? '' : 'border-transparent hover:bg-gray',
+    {
+      'border-transparent hover:bg-gray': !isToday,
+    },
     isDisabled ? 'text-gray hover:bg-transparent' : 'cursor-pointer',
   );

package/mobile/src/ui-kit/DialogManager/CloseButton.tsx

@@ -1,6 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { style } from '../../utils/style';
-import { Img } from '../Img/Img';
+import { Icon } from '../Icon/Icon';
 import { type PreventableEvent } from '../PreventableEvent';
 
 interface CloseButtonProps {
@@ -18,6 +18,6 @@ export const CloseButton = JSX<CloseButtonProps>(({ className, onClose }) => (
     title="Закрыть"
     type="button"
   >
-    <Img image={{ icon: 'CloseIcon' }} width="24" height="24" />
+    <Icon name="CloseIcon" width="20" height="20" iconVersion="gray" />
   </button>
 ));

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

@@ -45,8 +45,10 @@ export const DialogManager = JSX(() => {
         <div
           key={String(id || i)}
           className={style(
-            'absolute inset-0 overflow-x-hidden overflow-y-scroll no-scrollbar',
-            i === dialogs.length - 1 ? '' : 'hidden',
+            'absolute inset-0 overflow-x-hidden overflow-y-scroll no-scrollbar bg-black/50',
+            {
+              hidden: i !== dialogs.length - 1,
+            },
           )}
         >
           {dialog}

package/mobile/src/ui-kit/Foldable/DefaultFoldButton.tsx

@@ -17,7 +17,7 @@ interface DefaultFoldButtonProps {
 }
 
 export const DefaultFoldButton = JSX<DefaultFoldButtonProps>(
-  ({ className = '', label, icon, dataTheme = '', disabled = false, onClick }) => (
+  ({ className = '', label, icon, dataTheme = 'pc', disabled = false, onClick }) => (
     <TextWithIcon
       tag="button"
       onClick={onClick}

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

@@ -0,0 +1,8 @@
+import { type FieldDef } from '../../components/ApplicationForm/ApplicationFormContent';
+import { type FormFieldRegisterer } from '../../hooks/useForm';
+
+export interface CustomFieldProps {
+  field: FormFieldRegisterer<any>;
+  input?: FieldDef;
+  url?: string;
+}

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

@@ -0,0 +1,36 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { type Option } from '../../Select/Option';
+import { SelectControl } from '../../Select/SelectControl';
+import { type CustomFieldProps } from '../CustomFieldProps';
+import { validatorObj } from '../getObjectValidator';
+import { getValidation } from '../getValidation';
+
+export const ACQUIRING_TYPES: Option[] = [
+  {
+    text: 'Торговый эквайринг',
+    key: 'trade',
+  },
+  {
+    text: 'СБП-эквайринг',
+    key: 'sbp',
+  },
+  {
+    text: 'Интернет-эквайринг',
+    key: 'internet',
+  },
+  {
+    text: 'Все виды эквайринга',
+    key: 'all',
+  },
+];
+
+export const AcquiringField = JSX<CustomFieldProps>(({ field, input }) => (
+  <SelectControl
+    label="Вид эквайринга"
+    placeholder="Выберите эквайринг"
+    options={ACQUIRING_TYPES}
+    {...getValidation(field('acquiringType'), validatorObj.acquiringType, input?.required)}
+  />
+));
+
+export const isAcquiringTrade = (key = ''): boolean => Boolean(key === 'trade' || key === 'all');

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

@@ -0,0 +1,39 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { useEffect } from '@redneckz/uni-jsx/lib/hooks';
+import { useBranches } from '../../../hooks/useBranches';
+import { useBranchesByRegions } from '../../../hooks/useBranchesByRegions';
+import { SelectControl } from '../../Select/SelectControl';
+import { type CustomFieldProps } from '../CustomFieldProps';
+import { validatorObj } from '../getObjectValidator';
+import { getValidation } from '../getValidation';
+
+interface RegionFieldProps extends CustomFieldProps {
+  isPremium?: boolean;
+}
+
+export const AddressBranchField = JSX<RegionFieldProps>(({ field, input, isPremium = false }) => {
+  const fieldRegion = field('region');
+  const regionKey = fieldRegion?.value?.key as string;
+  const regionText = fieldRegion?.value?.text as string;
+  const addressBranch = isPremium
+    ? useBranchesByRegions()?.find((_) => _?.region === regionText)?.branches
+    : useBranches(regionKey)?.filter((branch) => branch?.address);
+  useEffect(() => {
+    if (fieldRegion?.value?.key !== '') {
+      field?.('addressBranch')?.onChange?.('');
+    }
+  }, [fieldRegion?.value]);
+
+  return (
+    <SelectControl
+      label="Отделение"
+      placeholder="Выберите отделение"
+      options={(addressBranch || []).map(({ address = '' }) => ({
+        key: address,
+        text: address,
+      }))}
+      {...getValidation(field('addressBranch'), validatorObj.addressBranch, input?.required)}
+      isSearch={true}
+    />
+  );
+});

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

@@ -0,0 +1,17 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { InputRange } from '../../InputRange/InputRange';
+import { type CustomFieldProps } from '../CustomFieldProps';
+
+const MIN_CREDIT_AMOUNT = 1000;
+const MAX_CREDIT_AMOUNT = 1000000000;
+const ITEMS_CREDIT_AMOUNT = ['От 1 000 ₽', 'До 1 000 000 000 ₽'];
+
+export const AmountField = JSX<CustomFieldProps>(({ field }) => (
+  <InputRange
+    title="Сумма, ₽"
+    items={ITEMS_CREDIT_AMOUNT}
+    min={MIN_CREDIT_AMOUNT}
+    max={MAX_CREDIT_AMOUNT}
+    {...field('amount')}
+  />
+));

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

@@ -0,0 +1,14 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { InputControl } from '../../Input/InputControl';
+import { type CustomFieldProps } from '../CustomFieldProps';
+import { validatorObj } from '../getObjectValidator';
+import { getValidation } from '../getValidation';
+
+export const CommentField = JSX<CustomFieldProps>(({ field, input }) => (
+  <InputControl
+    className="col-span-2"
+    {...getValidation(field('comment'), validatorObj.comment, input?.required)}
+    placeholder="Ваше сообщение"
+    isTextarea={true}
+  />
+));

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

@@ -0,0 +1,12 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { withValidator } from '../../../validation/withValidator';
+import { CheckboxWithError } from '../../Checkbox/CheckboxWithError';
+import { type CustomFieldProps } from '../CustomFieldProps';
+import { validatorObj } from '../getObjectValidator';
+
+export const ConsentAssignmentField = JSX<CustomFieldProps>(({ field }) => (
+  <CheckboxWithError
+    text="Прочие согласия (согласие на уступку прав требований)"
+    {...withValidator(field('consentAssignmentClaimsFlg'), validatorObj.consentAssignmentClaimsFlg)}
+  />
+));

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

@@ -0,0 +1,12 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { withValidator } from '../../../validation/withValidator';
+import { CheckboxWithError } from '../../Checkbox/CheckboxWithError';
+import { type CustomFieldProps } from '../CustomFieldProps';
+import { validatorObj } from '../getObjectValidator';
+
+export const ConsentCollectionField = JSX<CustomFieldProps>(({ field }) => (
+  <CheckboxWithError
+    text="Прочие согласия (согласие на взыскание по исполнительной надписи нотариуса)"
+    {...withValidator(field('consentCollectionFlg'), validatorObj.consentCollectionFlg)}
+  />
+));

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

@@ -0,0 +1,12 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { withValidator } from '../../../validation/withValidator';
+import { CheckboxWithError } from '../../Checkbox/CheckboxWithError';
+import { type CustomFieldProps } from '../CustomFieldProps';
+import { validatorObj } from '../getObjectValidator';
+
+export const ConsentInformField = JSX<CustomFieldProps>(({ field }) => (
+  <CheckboxWithError
+    text="Согласие на информирование о продуктах и услугах Банка"
+    {...withValidator(field('consentInformFlg'), validatorObj.consentInformFlg)}
+  />
+));

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

@@ -0,0 +1,12 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { withValidator } from '../../../validation/withValidator';
+import { CheckboxWithError } from '../../Checkbox/CheckboxWithError';
+import { type CustomFieldProps } from '../CustomFieldProps';
+import { validatorObj } from '../getObjectValidator';
+
+export const ConsentPhotoFlg = JSX<CustomFieldProps>(({ field }) => (
+  <CheckboxWithError
+    text="Прочие согласия (согласие на фотографирование)"
+    {...withValidator(field('consentPhotoFlg'), validatorObj.consentPhotoFlg)}
+  />
+));