@redneckz/wildless-cms-uni-blocks 0.3.84 → 0.3.86

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

@@ -1,75 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { Icon } from '../Icon/Icon';
-import { getIconVersion } from './getIconVersion';
-import type { ImgSource, Picture } from '../../model/Picture';
+import { ImgInner } from './ImgInner';
 
 import type { Image, ImageProps } from './ImgProps';
 
-export const Img = JSX<ImageProps<Image>>(
-  ({ className = '', image, imageClassName = '', ...iconProps }) => {
-    // backwards compatibility with existing icons in usage
-    const icon = typeof image === 'string' ? image : image?.icon;
-    if (icon || icon === '') {
-      return (
-        <Icon
-          className={className}
-          imageClassName={imageClassName}
-          iconVersion={getIconVersion(image)}
-          name={icon}
-          {...iconProps}
-        />
-      );
-    }
-
-    return (
-      <ImgAsPicture
-        className={className}
-        imageClassName={imageClassName}
-        image={image as Picture}
-      />
-    );
-  },
-);
-
-export const ImgAsPicture = JSX<ImageProps<Picture>>(
-  ({ className = '', image, imageClassName = '' }) => {
-    if (!image) {
-      return null;
-    }
-
-    return (
-      <picture className={className}>
-        {image?.sources?.length
-          ? image.sources.map(({ src, format }, index) => (
-              <source key={`${index}_${src}`} srcSet={src} type={formatToMimeType(format)} />
-            ))
-          : null}
-        {renderImg(image, imageClassName)}
-      </picture>
-    );
-  },
-);
-
-const renderImg = (image: Picture, imageClassName = '') => {
-  const style = {
-    width: image.size?.width ? `${image.size?.width}px` : '100%',
-    height: image.size?.height ? `${image.size?.height}px` : '100%',
-  };
-  const title = image.title || '';
-  const alt = image.alt || image.title;
-
-  return (
-    <img
-      src={image.src}
-      className={`m-auto ${imageClassName}`}
-      alt={alt}
-      title={title}
-      style={style}
-      {...image.size}
-    />
-  );
-};
-
-export function formatToMimeType(format: ImgSource['format']): string | undefined {
-  return format ? `image/${String(format)}` : undefined;
-}
+export const Img = JSX<ImageProps<Image>>(({ className = '', image }) => {
+  return <ImgInner className={className} image={image} isMobile={true} />;
+});

package/mobile/src/ui-kit/Img/ImgAsPicture.tsx

@@ -0,0 +1,60 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { ImgSource, Picture } from '../../model/Picture';
+import type { ImageProps } from './ImgProps';
+
+const sourcesComparator = (a: Picture, b: Picture) => {
+  if (a.media && b.media) {
+    return a.media - b.media;
+  }
+
+  return 0;
+};
+
+export const ImgAsPicture = JSX<ImageProps<Picture>>(
+  ({ className = '', image, imageClassName = '', isMobile = false }) => {
+    if (!image) {
+      return null;
+    }
+
+    const pictureStyles = isMobile ? 'flex' : 'flex-none';
+
+    return (
+      <picture className={`${pictureStyles} ${className}`}>
+        {image?.sources?.length
+          ? image.sources
+              .sort(sourcesComparator)
+              .map(({ src, format, media, size }, index) => (
+                <source
+                  key={`${index}_${src}`}
+                  srcSet={src}
+                  type={formatToMimeType(format)}
+                  media={media ? `(max-width: ${media}px)` : ''}
+                  {...size}
+                />
+              ))
+          : null}
+        {renderImg(image, imageClassName, isMobile)}
+      </picture>
+    );
+  },
+);
+
+const renderImg = (image: Picture, imageClassName = '', isMobile = false) => {
+  const title = image.title || '';
+  const alt = image.alt || image.title;
+  const imgStyle = isMobile ? 'm-auto' : 'm-0';
+
+  return (
+    <img
+      src={image.src}
+      className={`${imgStyle} ${imageClassName}`}
+      alt={alt}
+      title={title}
+      {...image.size}
+    />
+  );
+};
+
+export function formatToMimeType(format: ImgSource['format']): string | undefined {
+  return format ? `image/${String(format)}` : undefined;
+}

package/mobile/src/ui-kit/Img/ImgInner.tsx

@@ -0,0 +1,37 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { Picture } from '../../model/Picture';
+import { Icon } from '../Icon/Icon';
+import { getIconVersion } from './getIconVersion';
+import { ImgAsPicture } from './ImgAsPicture';
+import type { Image, ImageProps } from './ImgProps';
+
+export const ImgInner = JSX<ImageProps<Image>>(
+  ({ className = '', image, imageClassName = '', isMobile, ...iconProps }) => {
+    if (!image) {
+      return null;
+    }
+
+    // backwards compatibility with existing icons in usage
+    const icon = typeof image === 'string' ? image : image.icon;
+    if (icon || icon === '') {
+      return icon.length ? (
+        <Icon
+          className={className}
+          imageClassName={imageClassName}
+          iconVersion={getIconVersion(image)}
+          name={icon}
+          {...iconProps}
+        />
+      ) : null;
+    }
+
+    return (
+      <ImgAsPicture
+        className={className}
+        imageClassName={imageClassName}
+        image={image as Picture}
+        isMobile={isMobile}
+      />
+    );
+  },
+);

package/mobile/src/ui-kit/Img/ImgProps.ts

@@ -9,4 +9,5 @@ export interface ImageContent<T = Picture> {
 export interface ImageProps<T> extends ImageContent<T>, IconCompatibilityFields {
   className?: string;
   imageClassName?: string;
+  isMobile?: boolean;
 }

package/mobile/src/ui-kit/InputRange/InputRangeProps.ts

@@ -1,5 +1,3 @@
-import type { FuncReturnVoid } from '../../types';
-
 export interface InputRangeProps {
   className?: string;
   items?: string[];
@@ -8,5 +6,5 @@ export interface InputRangeProps {
   step?: number;
   value?: number;
   title?: string;
-  onChange?: FuncReturnVoid<number>;
+  onChange?: (value: number) => void;
 }

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

@@ -1,6 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { BgColorVersion } from '../../model/BgColorVersion';
-import { SVG } from '../SVG';
+import { Img } from '../Img/Img';
 
 export interface LogoProps {
   className: string;
@@ -10,13 +10,6 @@ export interface LogoProps {
   hideTitle?: boolean;
 }
 
-const LOGO_PATHS = [
-  'm13.72 25.51 4.42-4.33v-2.95l-4.42 4.32v2.96Zm0-10.98 4.42-4.35V7.41l-4.42 4.31v2.8Zm0 3.63 4.42-4.33v-2.78l-4.42 4.32v2.8ZM12.46 7.44l-.6-.56V0h-.66v6.22l-.58-.57V0h-.67v5l-.59-.58V0H8.7v6.56l4.44 4.33V0h-.67v7.44Zm1.26 14.35 4.42-4.33v-2.78L13.72 19v2.8Zm-5.03-.61 4.44 4.33v-2.96l-4.44-4.32v2.95Zm8.79-16.76-.59.58V0h-.66v5.66l-.6.56V0h-.66v6.87l-.58.57V0h-.67v10.9l4.42-4.34V0h-.66v4.42Zm-8.79 5.76 4.44 4.35v-2.8L8.69 7.4v2.77Zm0 3.65 4.44 4.33v-2.8l-4.44-4.3v2.77Zm0 3.63 4.44 4.33V19l-4.44-4.31v2.78Zm26.37 2.29H24.3a2.25 2.25 0 0 0 .36-1.22 2.32 2.32 0 0 0-2.33-2.31 2.32 2.32 0 0 0-2.31 2.31c0 .5.16.96.43 1.34a.74.74 0 0 0-.33.61c0 .26.14.49.33.62a2.32 2.32 0 0 0-.43 1.34 2.31 2.31 0 0 0 2.31 2.31 2.32 2.32 0 0 0 2.33-2.31c0-.45-.13-.87-.36-1.22h8.01v.49h-.8v.68h.8v.7h-.8v1.3h.8v-.58h1.17v.58h.79v-1.3h-.79v-.7h.79v-.68h-.79v-.5h1.58a.56.56 0 0 0 .56-.56v-.34a.57.57 0 0 0-.56-.56Zm-11.53 2.7a1.2 1.2 0 0 1-2.4 0c0-.24.08-.47.2-.66l.34-.56a.97.97 0 0 1-.34-.75c0-.3.13-.56.33-.74l-.32-.56a1.13 1.13 0 0 1-.2-.66 1.2 1.2 0 0 1 2.4 0c0 .49-.56 1.65-.56 1.65v.62c-.01.01.55 1.17.55 1.66ZM4.67 18.34v2.89c0 2.75 1.2 4.53 1.9 5.21l4.58 4.5c1.28 1.25 1.5 1.66 1.79 2.37v-3.2c0-2.84-1.44-3.94-2.19-4.67-1.73-1.68-2.89-2.8-3.82-3.73a8.98 8.98 0 0 1-2.26-3.37Zm6.08 14.24c-1.73-1.7-2.89-2.8-3.82-3.73a10 10 0 0 1-2.25-2.98v2.49a7.87 7.87 0 0 0 1.89 5.24l4.58 4.47c1.28 1.25 1.5 1.85 1.79 2.55v-3.37c0-2.85-1.45-3.95-2.19-4.67Z',
-  'M19.88 5.34c-.32 0-.64 0-.96.02V6.7a18.5 18.5 0 1 1 .95 36.94A18.5 18.5 0 0 1 1.35 25.17c0-5.67 2.55-10.73 6.58-14.13V9.32A19.78 19.78 0 0 0 0 25.17C0 36.12 8.9 45 19.88 45a19.85 19.85 0 0 0 19.86-19.83c0-10.95-8.9-19.83-19.87-19.83Z',
-  'M33.93 35.53c.3-.41.6-.85.87-1.3v-2.66h-.87v3.96Zm2.54-4.92c.12-.4.24-.78.34-1.16h-2.88v.7h.43c.77-.02 1.63-.03 2.11.46Zm-19.19-1.27h-.78v7.91h.78v-7.9Z',
-  'M14.7 27.83h2.58c.67 0 1.14.14 1.4.4.27.25.4.72.4 1.38v7.4c0 .66-.12 1.12-.4 1.38-.4.41-1.16.41-1.78.41l-.4-.01v3.5l.78.14v-2.88c1.2 0 1.97-.4 2.34-1.22v4.29h.26l.5-.01V29.74c0-.68.13-1.16.4-1.43.25-.27.72-.4 1.37-.4.67 0 1.65-.1 2.16.4.26.27.38.76.38 1.43v3.8h-1.77v-4.06h-.77v12.99c.26-.03.5-.07.77-.12V34.3h1.77v7.64c.36-.1.72-.21 1.08-.34v-7c0-.8.19-1.4 1-1.67l-.9-4.87h1.8l.3 5.31h.22l.3-5.31h1.88l-1.01 4.87c.84.3 1.01.81 1.01 1.66v4.53a16.63 16.63 0 0 0 1.5-1.27v-9.83h5.25l.1-.72H24.93l.17.89c-.38-.72-1.12-1.08-2.2-1.08h-.77c-1.3 0-2.1.52-2.4 1.55-.27-1.08-1.1-1.62-2.46-1.62h-3.36v14.52c.26.09.52.18.78.25V27.84Zm16.29 5.58-.85-.8.85-4.37v5.17Z',
-  'M27.66 40.79c.27-.14.55-.28.8-.43v-5.98h-.8v6.4Z',
-];
 const SVG_COLOR: Record<BgColorVersion, string> = {
   'bg-white': 'text-primary-main',
   transparent: 'text-white',
@@ -35,11 +28,7 @@ export const Logo = JSX<Partial<LogoProps>>(
         target={targetBlank ? '_blank' : '_self'}
         aria-label="Россельхозбанк"
       >
-        <SVG
-          className={`${SVG_COLOR[bgColor]} w-10 h-[38px]`}
-          viewBox="0 0 40 45"
-          paths={LOGO_PATHS.map((d) => ({ d }))}
-        />
+        <Img image={{ icon: 'Logo' }} className={`${SVG_COLOR[bgColor]} w-10 h-[38px]`} asSVG />
         {hideTitle ? null : (
           <span className={`${TEXT_COLOR[bgColor]} text-sm font-medium ml-2.5`}>
             {children || 'Россельхозбанк'}

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

@@ -0,0 +1,32 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { UniBlockProps } from '../../types';
+import { Checkbox } from '../Checkbox/Checkbox';
+
+interface RadioButtonItem {
+  id: string;
+  text: string;
+}
+
+interface RadioButtonGroupProps extends UniBlockProps {
+  items: RadioButtonItem[];
+  checkedItem?: string;
+  onChangeCheckedItem: (id: string) => void;
+}
+
+export const RadioButtonGroup = JSX<RadioButtonGroupProps>(
+  ({ items, checkedItem, onChangeCheckedItem }) => {
+    return (
+      <div>
+        {items?.map(({ id, text }) => (
+          <Checkbox
+            key={id}
+            isRadio
+            text={text}
+            checked={checkedItem === id}
+            onChange={() => onChangeCheckedItem(id)}
+          />
+        ))}
+      </div>
+    );
+  },
+);

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

@@ -3,8 +3,8 @@ import { JSX } from '@redneckz/uni-jsx';
 interface SVGPathOptions {
   fill?: string;
   stroke?: string;
-  strokeLinecap?: string;
-  strokeLinejoin?: string;
+  strokeLinecap?: 'inherit' | 'butt' | 'round' | 'square';
+  strokeLinejoin?: 'inherit' | 'round' | 'miter' | 'bevel';
   strokeWidth?: string;
   strokeMiterlimit?: string;
 }

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

@@ -1,45 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { UniBlockProps } from '../../types';
-import { Img } from '../Img/Img';
+import { SearchBarInner } from './SearchBarInner';
 
-export const SearchBar = JSX<UniBlockProps>(({ className, context }) => {
-  const { term, setTerm } = context.useSearch();
-
-  return (
-    <form className={`relative ${className || ''}`}>
-      <div className="absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none">
-        <div className="w-[20px] h-[20px]">
-          <Img image="LoupeIcon" width="24" height="24" />
-        </div>
-        {term ? null : (
-          <label
-            htmlFor="search-bar-input"
-            className="font-sans font-normal text-sm text-secondary-text"
-          >
-            Поиск по сайту
-          </label>
-        )}
-      </div>
-      <input
-        id="search-bar-input"
-        className={
-          'h-12 pl-12 w-full peer placeholder-transparent font-sans font-normal text-base text-black border border-solid rounded box-border outline-none pr-[6%] border-main-divider focus:border-primary-text'
-        }
-        value={term}
-        onChange={(e) => setTerm(e.target.value)}
-        type="text"
-        name="search-bar-input"
-        placeholder="some search"
-      />
-      <button
-        className="visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none"
-        onClick={(e) => {
-          e.preventDefault();
-          setTerm('');
-        }}
-      >
-        <Img image="CloseIcon" width="24" height="24" />
-      </button>
-    </form>
-  );
+export const SearchBar = JSX<UniBlockProps>(({ className = '', context }) => {
+  return <SearchBarInner context={context} className={className} isMobile={true} />;
 });

package/mobile/src/ui-kit/SearchBar/SearchBarInner.tsx

@@ -0,0 +1,72 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { UniBlockProps } from '../../types';
+import { Button } from '../Button/Button';
+import { Img } from '../Img/Img';
+
+export interface SearchBarInnerProps extends UniBlockProps {
+  isMobile?: boolean;
+}
+
+export const SearchBarInner = JSX<SearchBarInnerProps>(
+  ({ className, context, isMobile = false }) => {
+    const { term, setTerm } = context.useSearch();
+
+    const LoupeIconClassName = isMobile ? 'w-[20px] h-[20px]' : 'w-[24px] h-[24px]';
+    const SearchBarLabelClassName = isMobile ? 'font-normal text-sm' : 'font-light text-base';
+    const SearchBarInputClassName = isMobile
+      ? ' placeholder-transparent font-normal'
+      : 'font-light h-full';
+    const inputPlaceholder = isMobile ? 'some search' : undefined;
+
+    return (
+      <form className={`font-sans relative ${className}`}>
+        <div className="absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none">
+          <div className={LoupeIconClassName}>
+            <Img image="LoupeIcon" width="24" height="24" />
+          </div>
+          {term ? null : (
+            <label
+              htmlFor="search-bar-input"
+              className={`text-secondary-text ${SearchBarLabelClassName}`}
+            >
+              Поиск по сайту
+            </label>
+          )}
+        </div>
+        <input
+          id="search-bar-input"
+          className={`h-12 pl-12 w-full peer text-base text-black border border-solid rounded box-border
+              outline-none pr-[6%] border-main-divider focus:border-primary-text ${SearchBarInputClassName}`}
+          value={term}
+          onChange={(e) => setTerm(e.target.value)}
+          type="text"
+          name="search-bar-input"
+          placeholder={inputPlaceholder}
+        />
+        {isMobile ? (
+          <button
+            className="visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none"
+            onClick={(e) => {
+              e.preventDefault();
+              setTerm('');
+            }}
+          >
+            <Img image="CloseIcon" width="24" height="24" />
+          </button>
+        ) : (
+          <Button
+            version="primary"
+            text="Найти"
+            className="invisible peer-focus:visible absolute top-1 right-1"
+            onClick={(ev) => {
+              ev?.preventDefault();
+              console.log('click');
+            }}
+          >
+            <div className="font-normal text-sm px-9 py-[9px]">Найти</div>
+          </Button>
+        )}
+      </form>
+    );
+  },
+);

package/mobile/src/ui-kit/TableArrowScrollControl/TableArrowScrollControlProps.ts

@@ -1,9 +1,7 @@
-import { FuncReturnVoid } from '../../types';
-
 export interface TableArrowScrollControlProps {
   isScrollAvailable?: boolean;
-  handleNextClick: FuncReturnVoid<MouseEvent>;
-  handlePrevClick: FuncReturnVoid<MouseEvent>;
+  handleNextClick: () => void;
+  handlePrevClick: () => void;
   showNextButton: boolean;
   showPrevButton: boolean;
 }

package/mobile/src/ui-kit/Tabs/TabsProps.ts

@@ -1,5 +1,4 @@
 import type { Picture } from '../../model/Picture';
-import { FuncReturnVoid } from '../../types';
 
 /**
  * @title Вкладка
@@ -12,7 +11,7 @@ export interface Tab {
   icon?: Picture;
 }
 
-export type TabClickHandler = FuncReturnVoid<number>;
+export type TabClickHandler = (tabIndex: number) => void;
 
 export interface TabsProps {
   tabs?: Tab[];

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

@@ -10,7 +10,7 @@ export interface TopItemProps extends TopItemContent {
   className?: string;
   flat?: boolean;
   ariaLabel?: string;
-  onClick?: (ev: MouseEvent) => any;
+  onClick?: () => void;
   bgColor?: BgColorVersion;
   dataItemName?: string;
 }

package/mobile/src/utils/url.ts

@@ -24,3 +24,5 @@ export const getHash = (href?: string) => {
 
   return hashIndex !== -1 ? href.substring(hashIndex, href.length) : undefined;
 };
+
+export const isHash = (href?: string) => href?.startsWith('#');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.3.84",
+  "version": "0.3.86",
   "private": false,
   "license": "MIT",
   "author": "ЦК",
@@ -104,6 +104,7 @@
     "clean:actual": "rimraf ./cypress/snapshots/actual || exit 0"
   },
   "peerDependencies": {
+    "@testing-library/react": "^12.1.5",
     "cypress": "^10.6.0",
     "cypress-visual-regression": "^1.7.0",
     "react": ">=16.8.0",
@@ -133,9 +134,11 @@
     "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-local-eslint-rules": "./eslint-rules",
     "eslint-plugin-react": "^7.30.1",
+    "eslint-plugin-sonarjs": "^0.15.0",
     "html-webpack-plugin": "^5.5.0",
     "husky": "^8.0.1",
     "jest": "^28.1.3",
+    "jest-environment-jsdom": "^29.0.3",
     "lint-staged": "^13.0.1",
     "postcss": "^8.4.14",
     "postcss-cli": "^9.1.0",

package/src/components/Accordion/useActiveHandler.ts

@@ -6,17 +6,17 @@ export const useActiveHandler = ({ context, blocks, initialState = false }: Acti
   const hasContent = blocks?.length;
   const icon: IconName = isActive ? 'MinusIcon' : 'PlusIcon';
 
-  const getContentBlock = ({ currentTarget }) => currentTarget.nextSibling;
+  const handleToggle = (e) => {
+    const currentTarget = e.currentTarget as HTMLElement;
 
-  const handleToggle = (e: MouseEvent) => {
-    if (!hasContent) {
+    if (!currentTarget) {
       return;
     }
 
     setIsActive(!isActive);
-    const contentBlock = getContentBlock(e);
+    const contentBlock = currentTarget.nextSibling as HTMLElement;
     contentBlock.style.maxHeight = contentBlock.style.maxHeight
-      ? null
+      ? ''
       : `${contentBlock.scrollHeight}px`;
   };
 

package/src/components/BaseTile/BaseTile.tsx

@@ -5,7 +5,7 @@ import type { BaseTileCommonProps } from './BaseTileProps';
 export interface BaseTileProps extends BaseTileCommonProps, UniBlockProps {}
 
 export const BaseTile = JSX<BaseTileProps>(
-  ({ className = '', title, children, buttons, image }) => {
+  ({ className = '', title = '', children, buttons, image }) => {
     return (
       <div className={`font-sans flex flex-col grow h-full items-start ${className}`}>
         {title}

package/src/components/BaseTile/BaseTileProps.ts

@@ -1,39 +1,16 @@
-import type { BlockVersion } from '../../model/BlockVersion';
-import type { Picture } from '../../model/Picture';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-import type { HeadingType } from '../../ui-kit/Heading/HeadingContent';
 import type { AlignType } from '../../model/AlignType';
+import type { BlockVersion } from '../../model/BlockVersion';
+import type { HeadingType } from '../../ui-kit/Heading/HeadingProps';
+import type { VNode } from '../../model/VNode';
 
-/**
- * @title Общий компонент плиток
- */
-export type BaseTileCommonProps = BaseTileTitleProps & BaseTileMainProps;
-
-/**
- * @title Заголовк плитки
- */
-export interface BaseTileTitleProps {
-  /** @title Заголовок */
-  title?: string;
-  /**
-   * @title Тип заголовка
-   */
+export interface BaseTileCommonProps {
+  title?: VNode;
   headingType?: HeadingType;
-}
-
-export interface BaseTileMainProps {
   description?: string;
-  image?: Picture;
-  /** @title Список */
+  image?: VNode;
   items?: string[];
-
   list?: string;
-
-  /**
-   * @title Кнопки
-   * @maxItems 4
-   */
-  buttons?: ButtonWithIconProps[];
+  buttons?: VNode;
   version?: BlockVersion;
   align?: AlignType;
 }

package/src/components/BaseTile/getTileHeadingType.ts

@@ -3,10 +3,10 @@ import { getColSpan } from '../../utils/getColSpan';
 export function getTileHeadingType(className = '') {
   const colSpan = getColSpan(className);
   if (colSpan <= 4) {
-    return 'h4';
+    return 'S';
   } else if (colSpan <= 8) {
-    return 'h3';
+    return 'M';
   } else {
-    return 'h2';
+    return 'L';
   }
 }

package/src/components/BenefitsBlock/BenefitsBlockContent.ts

@@ -1,5 +1,5 @@
 import type { Picture } from '../../model/Picture';
-import type { HeadingContent, HeadingTypeContent } from '../../ui-kit/Heading/HeadingContent';
+import type { HeadingCommonProps } from '../../ui-kit/Heading/HeadingProps';
 import type { EmptyOption } from '../../model/EmptyOptionType';
 
 /**
@@ -48,11 +48,10 @@ export interface BenefitItem {
 /**
  * @title Блок преимущества
  */
-export type BenefitsBlockContent = HeadingContent &
-  HeadingTypeContent & {
-    /**
-     * @title Список преимуществ
-     * @maxItems 6
-     */
-    benefitList?: BenefitItem[];
-  };
+export type BenefitsBlockContent = HeadingCommonProps & {
+  /**
+   * @title Список преимуществ
+   * @maxItems 6
+   */
+  benefitList?: BenefitItem[];
+};