@redneckz/wildless-cms-uni-blocks 0.14.839 → 0.14.840

package/mobile/src/ui-kit/TabsControl/TabsControlProps.ts

@@ -1,3 +1,4 @@
+import { type ComponentType } from '../../model/ComponentType';
 import { type TabItemBase } from './TabItem';
 
 /**
@@ -16,7 +17,6 @@ interface ListControlProps<T> {
   onChange?: (value: T) => void;
 }
 
-export interface TabsControlProps extends ListControlProps<TabItemBase> {
-  className?: string;
+export interface TabsControlProps extends ListControlProps<TabItemBase>, ComponentType {
   tabsType?: TabsType;
 }

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

@@ -1,11 +1,10 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
 import { Text } from '../../ui-kit/Text/Text';
 import { style } from '../../utils/style';
 import { type TagsContent } from './TagsContent';
 
-interface TagsProps extends TagsContent {
-  className?: string;
-}
+interface TagsProps extends TagsContent, ComponentType {}
 
 export const Tags = JSX<TagsProps>(({ className, tags }) =>
   tags?.length ? (

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

@@ -1,7 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
 
-interface TimerProps {
-  className?: string;
+interface TimerProps extends ComponentType {
   seconds: number;
 }
 

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

@@ -1,5 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useLink } from '../../hooks/useLink';
+import { type ComponentType } from '../../model/ComponentType';
 import { type LinkProps } from '../../model/LinkProps';
 import { getAspectsAttributes } from '../../utils/dataAttributes';
 import { style } from '../../utils/style';
@@ -8,8 +9,7 @@ export interface TopItemContent extends LinkProps {
   active?: boolean;
 }
 
-export interface TopItemProps extends TopItemContent {
-  className?: string;
+export interface TopItemProps extends TopItemContent, ComponentType {
   flat?: boolean;
   dataItemName?: string;
   onClick?: () => void;

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

@@ -4,6 +4,7 @@ import { JSX } from '@redneckz/uni-jsx';
 import { useEffect, useRef } from '@redneckz/uni-jsx/lib/hooks';
 import type ymaps from 'yandex-maps';
 import { type BalloonPoints } from '../../components/OfficesAtmsMap/YandexMapProps';
+import { type ComponentType } from '../../model/ComponentType';
 import { style } from '../../utils/style';
 import { Loader } from '../Loader/Loader';
 import { renderClusterer } from './renderClusterer';
@@ -11,9 +12,8 @@ import { renderUserGeolocation } from './renderUserGeolocation';
 import { useYandexMaps } from './useYandexMaps';
 import { ZoomButton } from './ZoomButton';
 
-interface YandexMapProps {
+interface YandexMapProps extends ComponentType {
   points?: BalloonPoints[];
-  className?: string;
   zoom?: number;
   isLoad?: boolean;
   selectedAddress?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.839",
+  "version": "0.14.840",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/UniBlock/UniBlockProps.ts

@@ -1,5 +1,6 @@
 import { type BlockRendererOptions } from '../BlockRenderer/BlockRendererOptions';
 import { type BlockVersion } from '../model/BlockVersion';
+import { type ComponentType } from '../model/ComponentType';
 import { type BlockDef } from '../model/ContentPageDef';
 
 /**
@@ -19,8 +20,7 @@ export interface UniBlockContent {
   padding?: UniBlockPadding;
 }
 
-export interface UniBlockProps extends UniBlockContent {
-  className?: string;
+export interface UniBlockProps extends UniBlockContent, ComponentType {
   defaultPadding?: string;
   block?: BlockDef;
   options?: BlockRendererOptions;

package/src/components/CalculatorBonus/CalculatorBonus.tsx

@@ -17,7 +17,6 @@ const DEFAULT_TRAVEL_MIN_SUM = 6000;
 const DEFAULT_REST_MIN_SUM = 6000;
 
 export interface CalculatorBonusProps extends CalculatorBonusContent, UniBlockProps {
-  className?: string;
   calcSource?: BonusCalculatorData & JSONRefObject;
 }
 

package/src/components/CalculatorBusinessDeposit/CalculatorBusinessDeposit.tsx

@@ -1,4 +1,5 @@
 import { useForm, type FormFieldRegisterer } from '../../hooks/useForm/useForm';
+import { type ComponentType } from '../../model/ComponentType';
 import { CalculatorLayout } from '../../ui-kit/Calculator/CalculatorLayout';
 import { CalculatorStyle } from '../../ui-kit/Calculator/CalculatorStyle';
 import {
@@ -30,9 +31,8 @@ const BUSINESS_DEFAULT_DAYS = 60;
 
 export interface CalculatorBusinessDepositProp
   extends CalculatorBusinessDepositProps,
-    CalculatorBusinessDepositContent {
-  className?: string;
-}
+    CalculatorBusinessDepositContent,
+    ComponentType {}
 
 export const CalculatorBusinessDeposit = UniBlock<CalculatorBusinessDepositProp>(
   ({

package/src/components/CalculatorCredit/CalculatorCredit.tsx

@@ -44,7 +44,6 @@ const MAP = {
 };
 
 export interface CalculatorDepositProps extends CalculatorCreditContent, UniBlockProps {
-  className?: string;
   calcSource?: CreditCalculatorData & JSONRefObject;
   onChange?: (params: CreditCalculatorUserInputParams) => void;
 }

package/src/components/CalculatorDeposit/CalculatorDeposit.tsx

@@ -52,7 +52,6 @@ const DEPOSIT_DEFAULT_MONTHS = 1;
 const DEPOSIT_DEFAULT_EXTRA_PERCENT = { text: 'Без учета надбавки', key: '0' };
 
 export interface CalculatorDepositProps extends CalculatorDepositContent, UniBlockProps {
-  className?: string;
   calcSource?: DepositCalculatorData & JSONRefObject;
 }
 

package/src/components/CalculatorDeposit/renderDepositResult.tsx

@@ -11,7 +11,6 @@ type DepositResultProps = {
   buttons?: LinkButtonContent[];
   footnotes?: string[];
   isCapitalization?: boolean;
-  isDisabled?: boolean;
 };
 
 const CAPITALIZATION = ' (c капитализацией)';

package/src/components/CalculatorRefinancing/CalculatorRefinancing.tsx

@@ -27,7 +27,6 @@ const REFINANCING_DEFAULT_SUM = 700000;
 const DEFAULT_REFINANCING_MONTHS = 48;
 
 export interface RefinancingCalculatorProp extends CalculatorRefinancingContent, UniBlockProps {
-  className?: string;
   calcSource?: JSONRefObject & RefinancingCalculatorData;
 }
 

package/src/components/Carousel/renderCardHighlight.tsx

@@ -1,11 +1,10 @@
+import { type ComponentType } from '../../model/ComponentType';
 import { type TextProps } from '../../model/HeadlineType';
 import { Icon } from '../../ui-kit/Icon/Icon';
 import { Paragraph } from '../../ui-kit/Paragraph/Paragraph';
 import { style } from '../../utils/style';
 
-type CardHighlightProps = TextProps & {
-  className?: string;
-};
+type CardHighlightProps = TextProps & ComponentType;
 
 export const renderCardHighlight = ({ className, text = 'ХИТ' }: CardHighlightProps = {}) => (
   <div

package/src/components/CarouselLinks/CarouselLinkButton.tsx

@@ -1,12 +1,11 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useLink } from '../../hooks/useLink';
+import { type ComponentType } from '../../model/ComponentType';
 import { Img } from '../../ui-kit/Img/Img';
 import { style } from '../../utils/style';
 import { type CarouselLinkProps } from './CarouselLinksContent';
 
-export type CarouselLinkButtonProps = CarouselLinkProps & {
-  className?: string;
-};
+export type CarouselLinkButtonProps = CarouselLinkProps & ComponentType;
 
 export const CarouselLinkButton = JSX<CarouselLinkButtonProps>(({ icon, ...linkProps }) => {
   const link = useLink();

package/src/components/ContentPage/ContentPage.tsx

@@ -7,6 +7,7 @@ import { useJSONRef } from '../../hooks/useJSONRef/useJSONRef';
 import { useDefaultLocation } from '../../hooks/useLocation';
 import { type BlockDecorator } from '../../model/BlockDecorator';
 import { type BlocksRegistry } from '../../model/BlocksRegistry';
+import { type ComponentType } from '../../model/ComponentType';
 import { type ContentPageDef } from '../../model/ContentPageDef';
 import { CookiePopup } from '../../ui-kit/CookiePopup/CookiePopup';
 import { DialogManager } from '../../ui-kit/DialogManager/DialogManager';
@@ -14,8 +15,7 @@ import { PopupManager } from '../../ui-kit/PopupManager/PopupManager';
 import { type UniBlockMeta } from '../../UniBlock/UniBlock';
 import { style } from '../../utils/style';
 
-interface ContentPageProps {
-  className?: string;
+interface ContentPageProps extends ComponentType {
   data?: ContentPageDef;
   blocksRegistry: BlocksRegistry;
   blockDecorator?: BlockDecorator;

package/src/components/ExchangeRateTile/CurrencyTable.tsx

@@ -1,4 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
 import { Img } from '../../ui-kit/Img/Img';
 import { Text } from '../../ui-kit/Text/Text';
 import { style } from '../../utils/style';
@@ -16,8 +17,7 @@ const CURRENCY_ICONS_MAP = {
   CNY: 'ChineseYuanRenminbiIcon',
 };
 
-interface CurrencyTableProps {
-  className?: string;
+interface CurrencyTableProps extends ComponentType {
   exchangeCurrencyItems: ExchangeCurrencyItem[];
 }
 

package/src/components/ExchangeRateTile/CurrentLocation.tsx

@@ -1,11 +1,11 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
 import { type Picture } from '../../model/Picture';
 import { RoundedIcon } from '../../ui-kit/Icon/RoundedIcon';
 import { Paragraph } from '../../ui-kit/Paragraph/Paragraph';
 import { style } from '../../utils/style';
 
-interface CurrentLocationProps {
-  className?: string;
+interface CurrentLocationProps extends ComponentType {
   address?: string;
 }
 

package/src/components/ExchangeRateTile/ExchangeCurrencyCalculator.tsx

@@ -1,5 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { type ComponentType } from '../../model/ComponentType';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
 import { type ButtonCommonContent } from '../../ui-kit/LinkButton/LinkButtonContent';
 import { calculateResult, formatValue } from './calculateResult';
@@ -16,12 +17,13 @@ export interface ExchangeCurrencyItem {
   buyExchangeRate?: number;
   saleExchangeRate?: number;
 }
-export interface ExchangeCurrencyCalculatorProps {
-  className?: string;
+
+export interface ExchangeCurrencyCalculatorProps extends ComponentType {
   currencyRatesBuy: ExchangeCurrencyItem[];
   currencyRatesSell: ExchangeCurrencyItem[];
   button?: ButtonCommonContent;
 }
+
 export interface CalcState {
   inputSell: string;
   inputBuy: string;
@@ -53,7 +55,7 @@ export const ExchangeCurrencyCalculator = JSX<ExchangeCurrencyCalculatorProps>(
               selected: calcState.selectSell,
               setSelected: handleSelectSell(calcState, handleSetCalcState, currencyRatesSell),
               value: calcState.inputSell,
-              setValue: (value) =>
+              onChange: (value) =>
                 handleInputSell(handleSetCalcState, currencyRatesSell)(
                   value,
                   calcState.selectSell,
@@ -66,7 +68,7 @@ export const ExchangeCurrencyCalculator = JSX<ExchangeCurrencyCalculatorProps>(
               selected: calcState.selectBuy,
               setSelected: handleSelectBuy(calcState, handleSetCalcState, currencyRatesBuy),
               value: calcState.inputBuy,
-              setValue: (value) =>
+              onChange: (value) =>
                 handleInputBuy(handleSetCalcState, currencyRatesBuy)(
                   value,
                   calcState.selectBuy,

package/src/components/ExchangeRateTile/renderInput.tsx

@@ -1,20 +1,19 @@
+import { type ControlProps } from '../../model/ControlProps';
+import { type PlaceholderProps } from '../../model/PlaceholderProps';
 import { Input } from '../../ui-kit/Input/Input';
 import { type Option } from '../../ui-kit/Select/Option';
 import { Select } from '../../ui-kit/Select/Select';
 import { type Currency } from './CurrencyProps';
 import { type ExchangeCurrencyItem } from './ExchangeCurrencyCalculator';
 
-interface InputProps {
-  placeholder: string;
+interface InputProps extends PlaceholderProps, ControlProps<string> {
   rates: ExchangeCurrencyItem[];
   selected: string;
   setSelected: (value: Currency) => void;
-  value: string;
-  setValue: (value: string) => void;
 }
 
 export function renderInput(props: InputProps) {
-  const { placeholder, rates, selected, value, setValue, setSelected } = props;
+  const { placeholder, rates, selected, value, onChange, setSelected } = props;
   const ratesOptions: Option[] = rates.map((_) => ({
     key: _?.currency?.currency ?? '',
     text: _?.currency?.currency ?? '',
@@ -28,7 +27,7 @@ export function renderInput(props: InputProps) {
         placeholder={placeholder}
         type="text"
         value={value}
-        onChange={setValue}
+        onChange={onChange}
       />
       {ratesOptions.length ? (
         <Select

package/src/components/Footer/Contacts.tsx

@@ -1,11 +1,11 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { type ContactGroup, type ContactInfo } from '../../data/FooterData';
+import { type ComponentType } from '../../model/ComponentType';
 import { Paragraph } from '../../ui-kit/Paragraph/Paragraph';
 import { Text } from '../../ui-kit/Text/Text';
 import { style } from '../../utils/style';
 
-export interface ContactsProps {
-  className?: string;
+export interface ContactsProps extends ComponentType {
   items?: ContactGroup[];
 }
 

package/src/components/Footer/FooterLink.ts

@@ -1,7 +1,7 @@
+import { type ComponentType } from '../../model/ComponentType';
 import { type LinkProps } from '../../model/LinkProps';
 
-export interface FooterLink {
-  className?: string;
+export interface FooterLink extends ComponentType {
   links?: LinkProps[];
   license?: string;
 }

package/src/components/Footer/LinkList.tsx

@@ -1,13 +1,13 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { type NavigationLinkProps } from '../../data/NavigationData';
 import { useLink } from '../../hooks/useLink';
+import { type ComponentType } from '../../model/ComponentType';
 import { type LinkProps } from '../../model/LinkProps';
 import { getAspectsAttributes } from '../../utils/dataAttributes';
 import { style } from '../../utils/style';
 
-interface LinkListProps {
+interface LinkListProps extends ComponentType {
   items?: LinkProps[];
-  className?: string;
 }
 
 export const LinkList = JSX<LinkListProps>(({ className = '', items }) => {

package/src/components/Footer/SocialMedia.tsx

@@ -1,5 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
+import { type ComponentType } from '../../model/ComponentType';
 import { type LinkButtonVersion } from '../../model/LinkButtonVersion';
 import { type LinkButtonContent } from '../../ui-kit/LinkButton/LinkButtonContent';
 import { renderButtonsSection } from '../../ui-kit/LinkButton/renderButtonsSection';
@@ -8,8 +9,7 @@ import { isIcon } from '../../utils/isIcon';
 import { style } from '../../utils/style';
 import { findIconByHref } from './findIconByHref';
 
-export interface SocialMediaProps {
-  className?: string;
+export interface SocialMediaProps extends ComponentType {
   media?: LinkButtonContent[];
   showButtonText?: boolean;
   stretched?: boolean;

package/src/components/Header/DropdownMenu.tsx

@@ -4,12 +4,12 @@ import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
 import { useEventListener } from '@redneckz/uni-jsx/lib/hooks/useEventListener';
 import { useOutsideClick } from '@redneckz/uni-jsx/lib/hooks/useOutsideClick';
 import { useLink } from '../../hooks/useLink';
+import { type ComponentType } from '../../model/ComponentType';
 import { type LinkProps } from '../../model/LinkProps';
 import { getAspectsAttributes } from '../../utils/dataAttributes';
 import { style } from '../../utils/style';
 
-interface DropdownMenuProps {
-  className?: string;
+interface DropdownMenuProps extends ComponentType {
   items: LinkProps[];
   activeItem?: LinkProps;
   ariaLabel?: string;

package/src/components/Header/HeaderChatBotButton.tsx

@@ -1,12 +1,12 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { type BlockVersion } from '../../model/BlockVersion';
+import { type ComponentType } from '../../model/ComponentType';
 import { type IconVersion } from '../../model/IconVersion';
 import { type PreventableEventWithTarget } from '../../ui-kit/PreventableEvent';
 import { HeaderSecondaryMenuButton } from './HeaderSecondaryMenuButton';
 import { useChatBot } from './useChatBot';
 
-interface HeaderChatBotButtonProps {
-  className?: string;
+interface HeaderChatBotButtonProps extends ComponentType {
   iconVersion?: IconVersion;
   chat?: string;
   onClick?: (ev: PreventableEventWithTarget) => void;

package/src/components/Header/HeaderSecondaryMenu.tsx

@@ -6,6 +6,7 @@ import { type NavigationData } from '../../data/NavigationData';
 import { getAspectsWithInclude } from '../../hooks/useAspects/aspects/getAspectsWithInclude';
 import { useLocation } from '../../hooks/useLocation';
 import { type BlockVersion } from '../../model/BlockVersion';
+import { type ComponentType } from '../../model/ComponentType';
 import { type IconVersion } from '../../model/IconVersion';
 import { ClientOnly } from '../../ui-kit/ClientOnly';
 import { useDialog } from '../../ui-kit/DialogManager/useDialog';
@@ -14,8 +15,8 @@ import { SearchDialog } from '../../ui-kit/SearchDialog/SearchDialog';
 import { TopItem } from '../../ui-kit/TopItem/TopItem';
 import { style } from '../../utils/style';
 import { HeaderSecondaryMenuButton } from './HeaderSecondaryMenuButton';
-export interface HeaderSecondaryMenuProps extends HeaderData, NavigationData {
-  className?: string;
+
+export interface HeaderSecondaryMenuProps extends HeaderData, NavigationData, ComponentType {
   search?: SearchHeaderProps;
   version?: BlockVersion;
 }

package/src/components/Header/HeaderSecondaryMenuButton.tsx

@@ -1,18 +1,22 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { type AspectsProps } from '../../model/AspectsProps';
 import { type BlockVersion } from '../../model/BlockVersion';
+import { type ComponentType } from '../../model/ComponentType';
+import { type DisabledProps } from '../../model/DisabledProps';
 import { Img } from '../../ui-kit/Img/Img';
 import { type ImageContent } from '../../ui-kit/Img/ImgProps';
 import { type PreventableEventWithTarget } from '../../ui-kit/PreventableEvent';
 import { getAspectsAttributes } from '../../utils/dataAttributes';
 import { style } from '../../utils/style';
 
-export interface HeaderSecondaryMenuButtonProps extends ImageContent, AspectsProps {
-  className?: string;
+export interface HeaderSecondaryMenuButtonProps
+  extends ImageContent,
+    AspectsProps,
+    ComponentType,
+    DisabledProps {
   isRounded?: boolean;
   buttonSize?: 'default' | 'medium' | 'large';
   isGrayBg?: boolean;
-  disabled?: boolean;
   ariaLabel?: string;
   onClick?: (ev: PreventableEventWithTarget) => void;
   version?: BlockVersion;

package/src/components/Header/HeaderSubMenuItem.tsx

@@ -4,11 +4,11 @@ import {
   useIntersectionObserver,
   type IntersectionObserverOptions,
 } from '../../hooks/useIntersectionObserver';
+import { type ComponentType } from '../../model/ComponentType';
 import { type LinkProps } from '../../model/LinkProps';
 import { HeaderItem } from '../../ui-kit/HeaderItem/HeaderItem';
 
-export interface HeaderSubMenuItemProps extends LinkProps {
-  className?: string;
+export interface HeaderSubMenuItemProps extends LinkProps, ComponentType {
   active?: boolean;
   observerOptions?: IntersectionObserverOptions;
   onVisibilityChange?: (isIntersecting: boolean) => void;

package/src/components/Header/HeaderTopMenu.tsx

@@ -7,14 +7,14 @@ import { type TopMenuItemProps } from '../../data/NavigationData';
 import { type IntersectionObserverOptions } from '../../hooks/useIntersectionObserver';
 import { type BgColorVersion } from '../../model/BgColorVersion';
 import { type BlockVersion } from '../../model/BlockVersion';
+import { type ComponentType } from '../../model/ComponentType';
 import { type LogoType } from '../../model/LogoType';
 import { Logo } from '../../ui-kit/Logo/Logo';
 import { DropdownMenu } from './DropdownMenu';
 import { HeaderSecondaryMenu } from './HeaderSecondaryMenu';
 import { HeaderTopMenuItem } from './HeaderTopMenuItem';
 
-export interface HeaderMenuProps {
-  className?: string;
+export interface HeaderMenuProps extends ComponentType {
   navigationItems?: TopMenuItemProps[];
   activeTopItem?: TopMenuItemProps;
   dropdownMenuAriaLabel?: string;

package/src/components/Header/HeaderTopMenuItem.tsx

@@ -4,11 +4,11 @@ import {
   useIntersectionObserver,
   type IntersectionObserverOptions,
 } from '../../hooks/useIntersectionObserver';
+import { type ComponentType } from '../../model/ComponentType';
 import { type LinkProps } from '../../model/LinkProps';
 import { TopItem } from '../../ui-kit/TopItem/TopItem';
 
-export interface HeaderTopMenuItemProps extends LinkProps {
-  className?: string;
+export interface HeaderTopMenuItemProps extends LinkProps, ComponentType {
   active?: boolean;
   observerOptions?: IntersectionObserverOptions;
   onVisibilityChange?: (isIntersecting: boolean) => void;

package/src/components/InsuranceAmountBlock/InsuranceAmountBlockInner.tsx

@@ -1,6 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useCarouselControls } from '../../hooks/useCarouselControls';
+import { type ComponentType } from '../../model/ComponentType';
 import { Img } from '../../ui-kit/Img/Img';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
 import { type ButtonCommonContent } from '../../ui-kit/LinkButton/LinkButtonContent';
@@ -9,8 +10,7 @@ import { Text } from '../../ui-kit/Text/Text';
 import { toLocalNumberFormat } from '../../utils/toLocalNumberFormat';
 import { type CardItem, type InsuranceAmountBlockTab } from './InsuranceAmountBlockContent';
 
-export interface InsuranceAmountBlockInnerProps extends InsuranceAmountBlockTab {
-  className?: string;
+export interface InsuranceAmountBlockInnerProps extends InsuranceAmountBlockTab, ComponentType {
   button?: ButtonCommonContent;
 }
 

package/src/components/OfficesAtmsMap/AtmsMap.tsx

@@ -1,5 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useLocation } from '../../hooks/useLocation';
+import { type ComponentType } from '../../model/ComponentType';
 import { type AtmsDef } from './OfficesAtmsMapContent';
 import { OfficesAtmsMapLayout } from './OfficesAtmsMapLayout';
 import { type Atm } from './OfficesAtmsMapProps';
@@ -24,9 +25,8 @@ const FILTRATION_PREDICATES = {
   designDisabledPeople: (item: Atm) => Boolean(item.designDisabledPeople),
 };
 
-export interface AtmsMapProps {
+export interface AtmsMapProps extends ComponentType {
   descriptionData?: AtmsDef;
-  className?: string;
 }
 
 export const AtmsMap = JSX<AtmsMapProps>(({ descriptionData, className }) => {

package/src/components/OfficesAtmsMap/Badge.tsx

@@ -1,4 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
 import { Img } from '../../ui-kit/Img/Img';
 import { Text } from '../../ui-kit/Text/Text';
 import { type TextColor } from '../../ui-kit/Text/TextProps';
@@ -11,8 +12,7 @@ const colorStyle: Record<string, { border: string; text: TextColor }> = {
   red: { border: 'border-error/30', text: 'text-error' },
 };
 
-export interface BadgeProps {
-  className?: string;
+export interface BadgeProps extends ComponentType {
   color?: keyof typeof colorStyle;
 }
 

package/src/components/OfficesAtmsMap/CardCell.tsx

@@ -1,11 +1,11 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
+import { type LabelProps } from '../../model/HeadlineType';
 import { Text } from '../../ui-kit/Text/Text';
 import { type TextColor, type TextSize } from '../../ui-kit/Text/TextProps';
 import { style } from '../../utils/style';
 
-export interface CardCellProps {
-  className?: string;
-  label?: string;
+export interface CardCellProps extends ComponentType, LabelProps {
   labelSize?: TextSize;
   value?: string | string[];
   subText?: string;

package/src/components/OfficesAtmsMap/CardRow.tsx

@@ -1,11 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
 import { style } from '../../utils/style';
 
-export interface CardRowProps {
-  className?: string;
-}
-
-export const CardRow = JSX<CardRowProps>(({ className, children }) => (
+export const CardRow = JSX<ComponentType>(({ className, children }) => (
   <div
     className={style(
       'flex flex-col sm:flex-row sm:border-t sm:border-solid sm:border-main-divider py-xl gap-x-6xl gap-y-xl',

package/src/components/OfficesAtmsMap/OfficesAtmsMapLayout.tsx

@@ -1,6 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm/useForm';
+import { type ComponentType } from '../../model/ComponentType';
 import { type VNode } from '../../model/VNode';
 import { ClientOnly } from '../../ui-kit/ClientOnly';
 import { YandexMap } from '../../ui-kit/YandexMap/YandexMap';
@@ -19,8 +20,7 @@ const defaultEmptyFunction = () => void 0;
 
 export type InitFilterState = Record<string, boolean>;
 
-export interface OfficesAtmsMapLayoutProps<T> {
-  className?: string;
+export interface OfficesAtmsMapLayoutProps<T> extends ComponentType {
   data?: T[];
   isLoad: boolean;
   remoteWorkplaces?: T[];

package/src/components/OfficesAtmsMap/OfficesMap.tsx

@@ -1,15 +1,12 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useLocation } from '../../hooks/useLocation';
+import { type ComponentType } from '../../model/ComponentType';
 import { OfficesAtmsMapLayout } from './OfficesAtmsMapLayout';
 import { getOfficePoint, renderOfficeCard } from './renderOfficeCard';
 import { getRemoteWorkplacePoint, renderRemoteWorkplaceCard } from './renderRemoteWorkplaceCard';
 import { useOffices } from './useOffices';
 
-export interface OfficesMapProps {
-  className?: string;
-}
-
-export const OfficesMap = JSX<OfficesMapProps>(({ className }) => {
+export const OfficesMap = JSX<ComponentType>(({ className }) => {
   const currentLocation = useLocation();
   const regionCode = currentLocation?.code ?? '000';
   const { data, isLoad } = useOffices(regionCode);