@redneckz/wildless-cms-uni-blocks 0.14.142 → 0.14.144

package/src/components/ApplicationForm/ApplicationFormCredit.tsx

@@ -2,11 +2,12 @@ import { JSX } from '@redneckz/uni-jsx';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { useBranches } from '../../hooks/useBranches';
 import { useForm } from '../../hooks/useForm';
+import { type Option } from '../../ui-kit/Select/Option';
+import { formatPhone } from '../../utils/formatPhone';
 import { objectValidator } from '../../validation/objectValidator';
 import { isValidationSuccess } from '../../validation/validator';
 import { useGetRegions } from '../SafeDepositRental/useGetRegions';
 import { type ApplicationFormsProps } from './ApplicationFormsProps';
-import { type CreditFormState } from './CreditFormState';
 import { MIN_CREDIT_AMOUNT } from './CreditParameters';
 import { Footnote } from './Footnote';
 import { formStyle } from './formStyle';
@@ -16,6 +17,19 @@ import { renderRegionDepartment } from './renderRegionDepartment';
 import { renderSubmitButton } from './renderSubmitButton';
 import { defaultValidator, innValidator, nameValidator, phoneValidator } from './validators';
 
+export interface CreditFormState {
+  amount: number;
+  term: number;
+  fullName: string;
+  inn: string;
+  name: string;
+  phone: string;
+  mail: string;
+  region?: Option;
+  department?: Option;
+  annualRevenue: string;
+}
+
 const initialFormState: CreditFormState = {
   amount: MIN_CREDIT_AMOUNT,
   term: 12,
@@ -49,7 +63,7 @@ export const ApplicationFormCredit = JSX<ApplicationFormsProps>(({ button, link,
           fullName,
           inn,
           name,
-          phone: phone.replace(/[^+\d]/g, ''),
+          phone: formatPhone(phone),
           mail,
           region: region?.text || '',
           department: department?.text || '',
@@ -60,7 +74,6 @@ export const ApplicationFormCredit = JSX<ApplicationFormsProps>(({ button, link,
   );
 
   const [formState, { field, ...formProps }] = useForm(initialFormState, handleSubmit);
-
   const regions = useGetRegions();
   const branches = useBranches(formState.region?.key).filter((branch) => branch?.address);
 

package/src/components/ApplicationForm/ApplicationFormDeposit.tsx

@@ -1,6 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
+import { formatPhone } from '../../utils/formatPhone';
 import { objectValidator } from '../../validation/objectValidator';
 import { isValidationSuccess } from '../../validation/validator';
 import { withValidator } from '../../validation/withValidator';
@@ -37,7 +38,7 @@ export const ApplicationFormDeposit = JSX<ApplicationFormsProps>(({ button, link
         onSubmit({
           typeForm: 'dpst',
           name,
-          phone: phone.replace(/[^+\d]/g, ''),
+          phone: formatPhone(phone),
         });
     },
     [onSubmit],

package/src/components/ApplicationForm/ApplicationFormFeedback.tsx

@@ -15,6 +15,7 @@ import { handleSubmitIndividual, handleSubmitLegal, handleSubmitQuestion } from
 import { InputControl } from './InputControl';
 import { PhoneInputControl } from './PhoneInputControl';
 import { renderAgreementWithSubmit } from './renderAgreementWithSubmit';
+import { renderRegion } from './renderRegion';
 import { initialUserFormState, renderUserData, type UserDataState } from './renderUserData';
 import { SelectControl } from './SelectControl';
 import { defaultValidator, innValidator, phoneValidator } from './validators';
@@ -68,8 +69,8 @@ export const ApplicationFormFeedback = JSX<ApplicationFormsProps>(({ button, lin
   );
 
   const [formState, { field, ...formProps }] = useForm(initialFormState, handleSubmit);
-  const branch = useGetRegions();
-  const regions = useBranches(formState?.region?.key).filter((region) => region?.address);
+  const regions = useGetRegions();
+  const addressByBranch = useBranches(formState?.region?.key).filter((branch) => branch?.address);
   const isQualityService = field('typeForm').value?.key === 'FEEDBACK_QS';
   const isLegalEntity = getLegalEntity(
     field('typeForm').value?.key,
@@ -95,18 +96,12 @@ export const ApplicationFormFeedback = JSX<ApplicationFormsProps>(({ button, lin
                 {...withValidator(field('serviceDirection'), defaultValidator)}
               />
             ) : null}
-            <SelectControl
-              label="Филиал обслуживания*"
-              placeholder="Выберите филиал"
-              isSearch={true}
-              options={branch.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
-              {...withValidator(field('region'), defaultValidator)}
-            />
+            {renderRegion(regions, field)}
             {isQualityService ? (
               <SelectControl
                 label="Адрес*"
                 placeholder="Выберите адрес"
-                options={regions.map(({ branchCode = '', address = '' }) => ({
+                options={addressByBranch.map(({ branchCode = '', address = '' }) => ({
                   key: branchCode,
                   text: address,
                 }))}

package/src/components/ApplicationForm/ApplicationFormIndividuals.tsx

@@ -1,6 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
+import { formatPhone } from '../../utils/formatPhone';
 import { objectValidator } from '../../validation/objectValidator';
 import { isValidationSuccess } from '../../validation/validator';
 import { withValidator } from '../../validation/withValidator';
@@ -53,7 +54,7 @@ export const ApplicationFormIndividuals = JSX<ApplicationFormsProps>((props) =>
             middleName,
             email,
             consentDataProcessing,
-            phoneNumber: phone.replace(/[^+\d]/g, ''),
+            phoneNumber: formatPhone(phone),
             birthday: birthday?.toISOString().slice(0, 10) || '',
             product: product || '',
           },

package/src/components/ApplicationForm/ApplicationFormSelfCollection.tsx

@@ -0,0 +1,81 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { useForm } from '../../hooks/useForm';
+import { type Option } from '../../ui-kit/Select/Option';
+import { formatPhone } from '../../utils/formatPhone';
+import { objectValidator } from '../../validation/objectValidator';
+import { isValidationSuccess } from '../../validation/validator';
+import { withValidator } from '../../validation/withValidator';
+import { useGetRegions } from '../SafeDepositRental/useGetRegions';
+import { ApplicationFieldsetLayout } from './ApplicationFieldsetLayout';
+import { type ApplicationFormsProps } from './ApplicationFormsProps';
+import { Footnote } from './Footnote';
+import { formStyle, oneColumnFormStyle } from './formStyle';
+import { InputControl } from './InputControl';
+import { PhoneInputControl } from './PhoneInputControl';
+import { renderRegion } from './renderRegion';
+import { renderSubmitButton } from './renderSubmitButton';
+import { initialUserFormState, type UserDataState } from './renderUserData';
+import { defaultValidator, phoneValidator } from './validators';
+
+export type SelfCollectionFormState = UserDataState & {
+  typeForm: Option;
+  fullName: string;
+  region?: Option;
+  phone: string;
+};
+
+const initialFormState: SelfCollectionFormState = {
+  ...initialUserFormState,
+  typeForm: { key: 'SELFCOLLECTION', text: 'Самоинкассация' }, // Уточнить key
+  fullName: '',
+  phone: '',
+};
+
+const feedbackValidator = objectValidator({
+  typeForm: defaultValidator,
+  region: defaultValidator,
+  fullName: defaultValidator,
+  phone: phoneValidator,
+});
+
+export const ApplicationFormSelfCollection = JSX<ApplicationFormsProps>(
+  ({ button, link, onSubmit }) => {
+    const handleSubmit = useCallback(
+      (formState: SelfCollectionFormState) => {
+        const { typeForm, region, fullName, phone } = formState;
+
+        const submitData = {
+          typeForm: typeForm.key,
+          region: region?.text,
+          name: fullName,
+          phone: formatPhone(phone),
+        };
+        isValidationSuccess(feedbackValidator(formState)) && onSubmit(submitData, true);
+      },
+      [onSubmit],
+    );
+
+    const [, { field, ...formProps }] = useForm(initialFormState, handleSubmit);
+    const regions = useGetRegions();
+
+    return (
+      <form className={formStyle} onSubmit={formProps.onSubmit}>
+        <ApplicationFieldsetLayout
+          firstChildren={
+            <div className={oneColumnFormStyle}>
+              <InputControl label="ФИО*" {...withValidator(field('fullName'), defaultValidator)} />
+              {renderRegion(regions, field)}
+              <PhoneInputControl
+                label="Телефон*"
+                {...withValidator(field('phone'), phoneValidator)}
+              />
+              {renderSubmitButton(button)}
+              <Footnote link={link} />
+            </div>
+          }
+        />
+      </form>
+    );
+  },
+);

package/src/components/ApplicationForm/ApplicationFormWed.tsx

@@ -3,6 +3,7 @@ import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { type Option } from '../../ui-kit/Select/Option';
+import { formatPhone } from '../../utils/formatPhone';
 import { objectValidator } from '../../validation/objectValidator';
 import { isValidationSuccess } from '../../validation/validator';
 import { useGetRegions } from '../SafeDepositRental/useGetRegions';
@@ -75,7 +76,7 @@ export const ApplicationFormWed = JSX<ApplicationFormsProps>((props) => {
         typeForm: 'KVED',
         fullName,
         name,
-        phone: phone.replace(/[^+\d]/g, ''),
+        phone: formatPhone(phone),
         text,
         vedTypes: getVedTypes(vedTypes),
         PartnerComments: text,

package/src/components/ApplicationForm/EmbeddableForms.tsx

@@ -7,6 +7,7 @@ import { ApplicationFormDeposit } from './ApplicationFormDeposit';
 import { ApplicationFormFeedback } from './ApplicationFormFeedback';
 import { ApplicationFormGrantSupport } from './ApplicationFormGrantSupport';
 import { ApplicationFormIndividuals } from './ApplicationFormIndividuals';
+import { ApplicationFormSelfCollection } from './ApplicationFormSelfCollection';
 import { ApplicationFormWed } from './ApplicationFormWed';
 
 export const EmbeddableForms = {
@@ -20,4 +21,5 @@ export const EmbeddableForms = {
   ApplicationFormFeedback,
   ApplicationFormAntiFraud,
   ApplicationFormCorruption,
+  ApplicationFormSelfCollection,
 };

package/src/components/ApplicationForm/acquiringTypes.ts

@@ -1,19 +1,21 @@
-import { type Select } from './models';
+import { type Option } from '../../ui-kit/Select/Option';
 
-export const ACQUIRING_TYPES: Select[] = [
+export const ACQUIRING_TYPES: Option[] = [
   {
-    name: 'Торговый эквайринг',
+    text: 'Торговый эквайринг',
+    key: 'trade',
   },
   {
-    name: 'Мобильный эквайринг',
+    text: 'СБП-эквайринг',
+    key: 'sbp',
   },
   {
-    name: 'Интернет-эквайринг',
-  },
-  {
-    name: 'QR-эквайринг (СБП)',
+    text: 'Интернет-эквайринг',
+    key: 'internet',
   },
+
   {
-    name: 'Все виды эквайринга',
+    text: 'Все виды эквайринга',
+    key: 'all',
   },
 ];

package/src/components/ApplicationForm/handleSubmit.tsx

@@ -1,3 +1,4 @@
+import { formatPhone } from '../../utils/formatPhone';
 import { objectValidator } from '../../validation/objectValidator';
 import { isValidationSuccess } from '../../validation/validator';
 import { type FeedbackFormState } from './ApplicationFormFeedback';
@@ -39,7 +40,7 @@ export const handleSubmitIndividual = (
     name: formState.name,
     middleName: formState.middleName,
     feedbackMethod: formState.feedbackMethod.text,
-    phoneNumber: formState.phone.replace(/[^+\d]/g, ''),
+    phoneNumber: formatPhone(formState.phone),
     secondaryPhoneNumber: formState.secondaryPhone?.replace(/[^+\d]/g, ''),
     email: formState.email,
     bankEmpolee: formState.bankEmpolee,
@@ -69,7 +70,7 @@ export const handleSubmitLegal = (
     inn: formState.inn,
     fullName: formState.fullName,
     feedbackMethod: formState.feedbackMethod.text,
-    phone: formState.phone.replace(/[^+\d]/g, ''),
+    phone: formatPhone(formState.phone),
     secondaryPhoneNumber: formState?.secondaryPhone,
     mail: formState.email,
     bankEmpolee: formState.bankEmpolee,
@@ -96,7 +97,7 @@ export const handleSubmitQuestion = (
     middleName: formState.middleName,
     birthday: formState.birthday,
     feedbackMethod: formState.feedbackMethod.text,
-    phoneNumber: formState.phone.replace(/[^+\d]/g, ''),
+    phoneNumber: formatPhone(formState.phone),
     email: formState.email,
     comment: formState.comment,
     consentDataProcessing: formState.consentDataProcessing,

package/src/components/ApplicationForm/renderAcquiringDataOrganization.tsx

@@ -15,16 +15,16 @@ export const renderAcquiringDataOrganization = (
     firstChildren={
       <div className={formChildrenStyle}>
         <InputControl
-          label="Наименование организации"
+          label="Наименование организации*"
           {...withValidator(field('fullName'), defaultValidator)}
         />
-        <InputControl label="Контактное лицо" {...withValidator(field('name'), nameValidator)} />
+        <InputControl label="Контактное лицо*" {...withValidator(field('name'), nameValidator)} />
       </div>
     }
     secondChildren={
       <div className={formChildrenStyle}>
-        <InputControl label="ИНН" {...withValidator(field('inn'), innValidator)} />
-        <PhoneInputControl label="Телефон" {...withValidator(field('phone'), phoneValidator)} />
+        <InputControl label="ИНН*" {...withValidator(field('inn'), innValidator)} />
+        <PhoneInputControl label="Телефон*" {...withValidator(field('phone'), phoneValidator)} />
       </div>
     }
   />

package/src/components/ApplicationForm/renderAcquiringRegion.tsx

@@ -4,6 +4,7 @@ import { ACQUIRING_TYPES } from './acquiringTypes';
 import { ApplicationFieldsetLayout, formChildrenStyle } from './ApplicationFieldsetLayout';
 import { type AcquiringFormState } from './ApplicationFormAcquiring';
 import { type Select } from './models';
+import { renderRegion } from './renderRegion';
 import { SelectControl } from './SelectControl';
 import { defaultValidator } from './validators';
 
@@ -13,7 +14,7 @@ interface AcquiringRegionProps {
   title?: string;
 }
 
-export const renderAcquiringRegion = ({ regions, field, title }: AcquiringRegionProps) => (
+export const renderAcquiringRegion = ({ field, title, regions }: AcquiringRegionProps) => (
   <ApplicationFieldsetLayout
     title={title}
     firstChildren={
@@ -21,20 +22,11 @@ export const renderAcquiringRegion = ({ regions, field, title }: AcquiringRegion
         <SelectControl
           label="Вид эквайринга"
           placeholder="Выберите эквайринг"
-          options={ACQUIRING_TYPES.map(({ name: key = '' }) => ({ key, text: key }))}
+          options={ACQUIRING_TYPES}
           {...withValidator(field('acquiringType'), defaultValidator)}
         />
       </div>
     }
-    secondChildren={
-      <div className={formChildrenStyle}>
-        <SelectControl
-          label="Адрес"
-          placeholder="Выберите адрес"
-          options={regions.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
-          {...withValidator(field('region'), defaultValidator)}
-        />
-      </div>
-    }
+    secondChildren={<div className={formChildrenStyle}>{renderRegion(regions, field)}</div>}
   />
 );

package/src/components/ApplicationForm/renderCreditDataOrganization.tsx

@@ -1,7 +1,7 @@
 import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { withValidator } from '../../validation/withValidator';
 import { ApplicationFieldsetLayout, formChildrenStyle } from './ApplicationFieldsetLayout';
-import { type CreditFormState } from './CreditFormState';
+import { type CreditFormState } from './ApplicationFormCredit';
 import { InputControl } from './InputControl';
 import { PhoneInputControl } from './PhoneInputControl';
 import { defaultValidator, innValidator, nameValidator, phoneValidator } from './validators';

package/src/components/ApplicationForm/renderCreditParameters.tsx

@@ -1,7 +1,7 @@
 import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { InputRange } from '../../ui-kit/InputRange/InputRange';
 import { ApplicationFieldsetLayout, formChildrenStyle } from './ApplicationFieldsetLayout';
-import { type CreditFormState } from './CreditFormState';
+import { type CreditFormState } from './ApplicationFormCredit';
 import {
   ITEMS_CREDIT_AMOUNT,
   ITEMS_CREDIT_TERM,

package/src/components/ApplicationForm/renderRegion.tsx

@@ -1,22 +1,36 @@
 import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { withValidator } from '../../validation/withValidator';
+import { type AcquiringFormState } from './ApplicationFormAcquiring';
 import { type BusinessCardFormState } from './ApplicationFormBusinessCard';
+import { type CorruptionFormState } from './ApplicationFormCorruption';
+import { type FeedbackFormState } from './ApplicationFormFeedback';
+import { type SelfCollectionFormState } from './ApplicationFormSelfCollection';
+import { type WedFormState } from './ApplicationFormWed';
 import { type Select } from './models';
 import { SelectControl } from './SelectControl';
 import { defaultValidator } from './validators';
 
-interface RegionProps {
-  regions: Select[];
-  field: FormFieldRegisterer<BusinessCardFormState>;
-}
-
-export const renderRegion = ({ regions, field }: RegionProps) => (
-  <SelectControl
-    className="w-full"
-    label="Филиал"
-    placeholder="Выберите филиал"
-    isSearch={true}
-    options={regions.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
-    {...withValidator(field('region'), defaultValidator)}
-  />
-);
+// eslint-disable-next-line react-hooks/exhaustive-deps
+export const renderRegion = <
+  T extends
+    | AcquiringFormState
+    | BusinessCardFormState
+    | CorruptionFormState
+    | FeedbackFormState
+    | SelfCollectionFormState
+    | WedFormState,
+>(
+  regions: Select[],
+  field: FormFieldRegisterer<T>,
+) => {
+  return (
+    <SelectControl
+      className="w-full"
+      label="Филиал"
+      placeholder="Выберите филиал"
+      isSearch={true}
+      options={regions.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
+      {...withValidator(field('region'), defaultValidator)}
+    />
+  );
+};

package/src/components/ApplicationForm/renderRegionDepartment.tsx

@@ -2,8 +2,9 @@ import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { withValidator } from '../../validation/withValidator';
 import { type Branch } from '../SafeDepositRental/useSafeBoxes';
 import { ApplicationFieldsetLayout, formChildrenStyle } from './ApplicationFieldsetLayout';
-import { type CreditFormState } from './CreditFormState';
+import { type CreditFormState } from './ApplicationFormCredit';
 import { type Select } from './models';
+import { renderRegion } from './renderRegion';
 import { SelectControl } from './SelectControl';
 import { defaultValidator } from './validators';
 
@@ -22,17 +23,7 @@ export const renderRegionDepartment = ({
 }: RegionDepartmentProps) => (
   <ApplicationFieldsetLayout
     title={title}
-    firstChildren={
-      <div className={formChildrenStyle}>
-        <SelectControl
-          label="Филиал"
-          placeholder="Выберите филиал"
-          isSearch={true}
-          options={regions.map(({ code = '', name = '' }) => ({ key: code, text: name }))}
-          {...withValidator(field('region'), defaultValidator)}
-        />
-      </div>
-    }
+    firstChildren={<div className={formChildrenStyle}>{renderRegion(regions, field)}</div>}
     secondChildren={
       <div className={formChildrenStyle}>
         <SelectControl

package/src/components/CarouselTariffsCard/CarouselTariffsCard.tsx

@@ -14,15 +14,27 @@ import { style } from '../../utils/style';
 import { type CarouselTariffsCardContent } from './CarouselTariffsCardContent';
 import { renderCardInfo } from './renderCardInfo';
 
-export interface CarouselTariffsCardProps extends CarouselTariffsCardContent, UniBlockProps {}
-
-const VISIBLE_CELLS_COUNT = 1;
+export interface CarouselTariffsCardProps extends CarouselTariffsCardContent, UniBlockProps {
+  visibleCellsCount?: number;
+}
 
 export const CarouselTariffsCard = JSX<CarouselTariffsCardProps>(
-  ({ className = '', title, align = 'text-center', icon, button, cardCells = [], ...rest }) => {
+  ({
+    className = '',
+    title,
+    align = 'text-center',
+    icon,
+    button,
+    visibleCellsCount = 1,
+    cardCells = [],
+    ...rest
+  }) => {
     const cellsNode = cardCells.map(renderCardInfo);
-    const visibleCells = cellsNode.slice(0, VISIBLE_CELLS_COUNT);
-    const hiddenCells = cellsNode.slice(VISIBLE_CELLS_COUNT);
+
+    const [visibleCells, hiddenCells] =
+      visibleCellsCount > 0
+        ? [cellsNode.slice(0, visibleCellsCount), cellsNode.slice(visibleCellsCount)]
+        : [cellsNode, []];
 
     return (
       <BlockWrapper className={style('flex flex-col', className)} defaultPadding="p-2xl" {...rest}>
@@ -34,8 +46,8 @@ export const CarouselTariffsCard = JSX<CarouselTariffsCardProps>(
         {title ? (
           <Heading className={style('pt-xs', align)} headingType="h5" title={title} />
         ) : null}
-        {button ? <LinkButton className="w-full mt-m mb-lg" {...button} /> : null}
-        {cardCells.length ? (
+        {button?.text ? <LinkButton className="w-full mt-m mb-lg" {...button} /> : null}
+        {hiddenCells.length ? (
           <Foldable
             renderFoldableSection={({ isUnfolded }) => (
               <div>
@@ -45,7 +57,9 @@ export const CarouselTariffsCard = JSX<CarouselTariffsCardProps>(
             )}
             renderFoldButton={cardCells.length > 1 ? renderFoldButton : null}
           />
-        ) : null}
+        ) : (
+          <div>{visibleCells}</div>
+        )}
       </BlockWrapper>
     );
   },

package/src/components/ContentPage/renderContentPageHead.tsx

@@ -24,7 +24,7 @@ export function renderContentPageHead(data: ContentPageMeta) {
 function renderOpenGraph(og: Record<string, string> | undefined) {
   return og
     ? Object.entries(og).map(([key, value]) => (
-        <meta key={key} property={`og:${key}`} content={value} />
+        <meta key={`og_${key}`} property={`og:${key}`} content={value} />
       ))
     : null;
 }
@@ -32,7 +32,7 @@ function renderOpenGraph(og: Record<string, string> | undefined) {
 function renderTwitter(twitter: Record<string, string> | undefined) {
   return twitter
     ? Object.entries(twitter).map(([key, value]) => (
-        <meta key={key} name={`twitter:${key}`} content={value} />
+        <meta key={`twitter_${key}`} name={`twitter:${key}`} content={value} />
       ))
     : null;
 }

package/src/components/ProductBlock/ProductBlock.tsx

@@ -1,5 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { type UniBlockProps } from '../../model/JSXBlock';
+import { type JSXBlock, type UniBlockProps } from '../../model/JSXBlock';
 import { BaseProductTile } from '../../ui-kit/BaseProductTile/BaseProductTile';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { style } from '../../utils/style';
@@ -7,12 +7,16 @@ import { type ProductBlockContent } from './ProductBlockContent';
 
 export interface ProductBlockProps extends UniBlockProps, ProductBlockContent {}
 
-export const ProductBlock = JSX<ProductBlockProps>(({ className, padding, ...rest }) => (
-  <BlockWrapper
-    className={style('overflow-hidden flex flex-col gap-3xl box-border', className)}
-    padding="p-0"
-    {...rest}
-  >
-    <BaseProductTile defaultPadding="p-6xl" padding={padding} className="grow h-full" {...rest} />
-  </BlockWrapper>
-));
+export const ProductBlock: JSXBlock<ProductBlockProps> = JSX<ProductBlockProps>(
+  ({ className, padding, ...rest }) => (
+    <BlockWrapper
+      className={style('overflow-hidden flex flex-col gap-3xl box-border', className)}
+      padding="p-0"
+      {...rest}
+    >
+      <BaseProductTile defaultPadding="p-6xl" padding={padding} className="grow h-full" {...rest} />
+    </BlockWrapper>
+  ),
+);
+
+ProductBlock.childrenTypes = ['UnitBlock'];

package/src/components/UnitBlock/UnitBlockContent.ts

@@ -3,5 +3,6 @@ import { type UnitProps } from '../../ui-kit/Unit/UnitProps';
 
 /**
  * @title Показатель
+ * @default { prefix: "префикс", unit: 1, suffix: "суффикс" }
  */
 export type UnitBlockContent = UniBlockContent & UnitProps;

package/src/ui-kit/BaseTile/BaseTile.tsx

@@ -4,7 +4,7 @@ import { renderChildren } from '../../BlockRenderer/renderChildren';
 import { renderBackwardButton } from '../../components/ProductBlock/renderBackwardButton';
 import { useRouter } from '../../hooks/useRouter';
 import { type Align } from '../../model/Align';
-import { type JSXBlock, type UniBlockProps } from '../../model/JSXBlock';
+import { type UniBlockProps } from '../../model/JSXBlock';
 import { type VNode } from '../../model/VNode';
 import { style } from '../../utils/style';
 import { type PreventableEvent } from '../PreventableEvent';
@@ -27,7 +27,7 @@ const imageAlignmentMap: Record<Align, string> = {
   end: '@xl:self-end',
 };
 
-export const BaseTile: JSXBlock<BaseTileProps> = JSX<BaseTileProps>(
+export const BaseTile = JSX<BaseTileProps>(
   ({
     className,
     version = 'primary',
@@ -95,8 +95,6 @@ export const BaseTile: JSXBlock<BaseTileProps> = JSX<BaseTileProps>(
   },
 );
 
-BaseTile.childrenTypes = ['UnitBlock'];
-
 const getStyle = (padding = '', defaultPadding = '', className = '') =>
   style('relative flex flex-col gap-3xl overflow-hidden', padding || defaultPadding, className);
 

package/src/ui-kit/InnerTable/InnerTableBody.tsx

@@ -16,12 +16,12 @@ export const InnerTableBody = JSX<InnerTableBodyProps>(({ activeTabIndex, items
 
         return (
           <div key={key} className="w-full @container">
-            <div className="flex p-m bg-white @4xl:bg-gray text-center justify-center relative">
-              <Text size="text-xl" font="font-light">
+            <div className="flex py-m sm:px-m bg-white @4xl:bg-gray relative">
+              <Text size="text-xl" align="text-left">
                 {_.title}
               </Text>
             </div>
-            <div className="w-full pl-xs overflow-hidden transition-height duration-500 ease-in-out">
+            <div className="w-full sm:pl-xs overflow-hidden transition-height duration-500 ease-in-out">
               <div className="relative">
                 <InnerTableBodyItem rows={_.rowsData} />
               </div>