@redneckz/wildless-cms-uni-blocks 0.12.12 → 0.12.14

package/src/components/Calculator/CreditCalculatorForm.tsx

@@ -24,7 +24,7 @@ export interface CreditCalculatorProp extends CreditCalculatorProps {
 export const CreditCalculatorForm = JSX<CreditCalculatorProp>(
   ({ className, sourceBookDir, buttons, footnote, paramsViewSettings }) => {
     const [userInputParams, { field }] = useForm({
-      isAnnuity: false,
+      isAnnuity: true,
       isInsurance: true,
       isSalaryClient: false,
       isPensionClient: false,

package/src/components/Calculator/DepositCalculatorForm.tsx

@@ -43,14 +43,14 @@ export const DepositCalculatorForm = JSX<DepositCalculatorProp>(
       <section className={style('flex justify-between', className)}>
         <div className="w-2/5">
           {renderWantedSumInput({
-            title: 'Сумма вклада, ₽',
+            title: 'Сумма, ₽',
             min: calculatorParams.minSum,
             max: calculatorParams.maxSum,
             ...field('moneyValue'),
             value: calculatorParams.moneyValue,
           })}
           {renderMonthsInput({
-            title: 'Срок вклада, месяцев',
+            title: 'Срок, месяцев',
             min: calculatorParams.minMonths,
             max: calculatorParams.maxMonths,
             availableMonths: calculatorParams.availableMonths,
@@ -63,7 +63,7 @@ export const DepositCalculatorForm = JSX<DepositCalculatorProp>(
         </div>
         <Rate rate={rate} rateBlockClassName="tracking-[-25px]" unit="%" />
         <div className="w-96">
-          <CalculatorValueBlock title="Доход по вкладу" value={income} postfix="₽" prefix="+" />
+          <CalculatorValueBlock title="Доход в конце срока" value={income} postfix="₽" prefix="+" />
           <CalculatorValueBlock title="Сумма в конце срока" value={finalSum} postfix="₽" />
           {renderButtonsSection(buttons, { className: 'mt-2xl', isVertical: true })}
           {renderFootnote(footnote)}

package/src/components/CardTransfer/CardTransferContent.ts

@@ -1,6 +1,6 @@
 import type { LabelProps, TitleProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
-import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Перевод с карты на карту
@@ -10,5 +10,5 @@ export type CardTransferContent = UniBlockContent &
   TitleProps & {
     /** @title Плейсхолдер */
     placeholder?: string;
-    button?: ButtonProps;
+    button?: ButtonContent;
   };

package/src/components/Carousel/Carousel.tsx

@@ -2,15 +2,17 @@ import { JSX } from '@redneckz/uni-jsx';
 import { renderBlock } from '../../BlockRenderer/renderBlock';
 import { renderChildren } from '../../BlockRenderer/renderChildren';
 import { useCarouselControls } from '../../hooks/useCarouselControls';
-import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { SwipeListContainer } from '../../ui-kit/SwipeListControl/SwipeListContainer';
 import { SwipeListControlDots } from '../../ui-kit/SwipeListControl/SwipeListControlDots';
 import { useSwipeListScroll } from '../../ui-kit/SwipeListControl/useSwipeListScroll';
 import { style } from '../../utils/style';
-import type { CarouselContent } from './CarouselContent';
 import { CarouselScrollButtons } from './CarouselScrollButtons';
 import { ITEMS_GAP } from './itemsGap';
+import type { CarouselContent } from './CarouselContent';
+import type { BlockDef } from '../../model/ContentPageDef';
+import type { BlockRendererOptions } from '../../BlockRenderer/BlockRendererOptions';
+import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
 
 export interface CarouselProps extends CarouselContent, UniBlockProps {
   itemCount?: number;
@@ -58,7 +60,7 @@ export const Carousel: JSXBlock<CarouselProps> = JSX<CarouselProps>(
           >
             {renderChildren({
               ...rest,
-              renderProps: (block, options, blockIndex) =>
+              renderProps: (block: BlockDef, options: BlockRendererOptions, blockIndex) =>
                 renderBlock(block, options, {
                   className: style(
                     'h-full min-w-80 sm:min-w-96',

package/src/components/Carousel/CarouselScrollButtons.tsx

@@ -51,7 +51,7 @@ export const CarouselScrollButtons = JSX<CarouselScrollButtonsProps>(
     }, [scrollRight, onScrollRight, hasEdgeBlocks, canScrollLeft, activeIndex, itemCount]);
 
     return (
-      <div>
+      <div className="hidden @lg:block">
         {renderBlur(scroll)}
         {canMoveLeft ? (
           <ScrollLeftButton
@@ -73,10 +73,17 @@ export const CarouselScrollButtons = JSX<CarouselScrollButtonsProps>(
 const renderBlur = (scroll: SwipeListScroll) => (
   <div>
     {scroll.canScrollLeft ? (
-      <div className={style(blurBaseStyle, 'left-0 bg-opacity-from-white')} />
+      <div
+        className={style(
+          blurBaseStyle,
+          'left-0 bg-opacity-from-white group-data-secondary:bg-none',
+        )}
+      />
     ) : null}
     {scroll.canScrollRight ? (
-      <div className={style(blurBaseStyle, 'right-0 bg-opacity-to-white')} />
+      <div
+        className={style(blurBaseStyle, 'right-0 bg-opacity-to-white group-data-secondary:bg-none')}
+      />
     ) : null}
   </div>
 );

package/src/components/CarouselBankHistoryCard/CarouselBankHistoryCard.mobile.tsx

@@ -10,7 +10,7 @@ export const CarouselBankHistoryCard = JSX<CarouselBankHistoryCardProps>(
   ({ title, description, className }) => (
     <BlockWrapper className={className} defaultPadding="p-6xl">
       <Headline
-        headlineVersion="S"
+        headlineVersion="XS"
         title={title}
         description={description}
         align="text-left"

package/src/components/CarouselCard/CarouselCardContent.ts

@@ -1,13 +1,13 @@
-import type { ButtonCommonIconProps } from '../../model/Button';
 import type { HeadlineCommonProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { SizeVersion } from '../../model/SizeVersion';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Карточка карусели
  */
 export type CarouselCardContent = UniBlockContent &
-  HeadlineCommonProps &
-  ButtonCommonIconProps & {
+  HeadlineCommonProps & {
+    button?: ButtonContent;
     carouselVersion?: SizeVersion;
   };

package/src/components/CarouselCatalogCard/CarouselCatalogCard.tsx

@@ -19,20 +19,21 @@ const cardStyleMap: Record<ProductColorVersion, string> = {
 export const CarouselCatalogCard = JSX<CarouselCatalogCardProps>(
   ({ className = '', title, description, image, price, button, colors, ...rest }) => (
     <BlockWrapper
-      className={style('flex flex-col justify-left gap-m', className)}
-      defaultPadding="p-6xl sm:p-7"
+      className={style('flex flex-col justify-left', className)}
+      defaultPadding="p-2xl"
       {...rest}
     >
-      {image?.src ? <Img className="flex justify-center" image={image} /> : null}
+      {image?.src ? <Img className="flex justify-center mb-xl" image={image} /> : null}
       <Headline
         title={title}
         description={description}
         headlineVersion="XS"
         isPadding={false}
         align="text-left"
+        className="mb-m"
       />
       {colors?.length ? (
-        <div className="flex text-secondary-text">
+        <div className="flex text-secondary-text mb-m">
           <div className="mr-xs">
             <Text size="text-s" align="text-left" font="font-light">
               Цвета:
@@ -46,7 +47,7 @@ export const CarouselCatalogCard = JSX<CarouselCatalogCardProps>(
           {price}&nbsp;₽
         </Text>
       ) : null}
-      {renderButtonsSection([button], { buttonClassName: 'w-full' })}
+      {renderButtonsSection([button], { buttonClassName: 'w-full mt-lg' })}
     </BlockWrapper>
   ),
 );
@@ -55,6 +56,6 @@ const renderColorOption = (color: ProductColorVersion, i: number) => (
   <div
     role="figure"
     key={String(i)}
-    className={`w-6 h-6 ml-1 sm:ml-3 border border-solid border-main-divider rounded-full ${cardStyleMap[color]}`}
+    className={`w-6 h-6 ml-s border border-solid border-main-divider rounded-full ${cardStyleMap[color]}`}
   />
 );

package/src/components/CarouselCatalogCard/CarouselCatalogCardContent.ts

@@ -1,18 +1,18 @@
-import type { ButtonCommonIconProps } from '../../model/Button';
 import type { HeadlineCommonProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { ProductColorVersion } from '../../model/ProductColorVersion';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Карточка каталога
  */
 export type CarouselCatalogCardContent = UniBlockContent &
   HeadlineCommonProps &
-  ImageContent &
-  ButtonCommonIconProps & {
+  ImageContent & {
     /** @title Цена в рублях */
     price?: number;
     /** @title Доступные цвета */
     colors?: ProductColorVersion[];
+    button?: ButtonContent;
   };

package/src/components/CarouselCatalogCard/CatalogCard.ts

@@ -1,9 +1,9 @@
 import type { ProductColorVersion } from '../../model/ProductColorVersion';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 const colors: ProductColorVersion[] = ['black', 'white'];
 
-const buttonPrimary: ButtonWithIconProps = {
+const buttonPrimary: ButtonContent = {
   href: '/credit-cards',
   text: 'Подробнее',
   target: '_blank',

package/src/components/CarouselLinks/CarouselLinks.fixture.mobile.tsx

@@ -0,0 +1,34 @@
+import '../../setup-fixture';
+
+import { CarouselLinks } from './CarouselLinks';
+
+const link = {
+  text: 'Аудиторские заключения',
+  href: '#',
+};
+const links = Array(9).fill(link);
+
+const description = `Акционерное общество «Российский Сельскохозяйственный банк»* —
+  один из крупнейших банков в России. Был основан в 2000 году в целях развития
+  национальной кредитно-финансовой системы агропромышленного сектора и
+  сельских территорий Российской Федерации.`;
+
+const additionalDescription = `Сегодня это универсальный коммерческий банк,
+  предоставляющий все виды банковских услуг и занимающий лидирующие позиции
+  в финансировании агропромышленного комплекса России.`;
+
+const MAX_LINKS_COUNT_MOBILE = 3;
+
+export default {
+  default: (
+    <CarouselLinks
+      links={links}
+      title="О Банке"
+      description={description}
+      additionalDescription={additionalDescription}
+      maxLinksCount={MAX_LINKS_COUNT_MOBILE}
+      version="secondary"
+      block={{ type: 'Carousel', blocks: new Array(3).fill(link).flat() }}
+    />
+  ),
+};

package/src/components/CarouselLinks/CarouselLinks.fixture.tsx

@@ -17,6 +17,8 @@ const additionalDescription = `Сегодня это универсальный
   предоставляющий все виды банковских услуг и занимающий лидирующие позиции
   в финансировании агропромышленного комплекса России.`;
 
+const MAX_LINKS_COUNT = 10;
+
 export default {
   default: (
     <CarouselLinks
@@ -24,6 +26,7 @@ export default {
       title="О Банке"
       description={description}
       additionalDescription={additionalDescription}
+      maxLinksCount={MAX_LINKS_COUNT}
       version="secondary"
       block={{ type: 'Carousel', blocks: new Array(3).fill(link).flat() }}
     />

package/src/components/CarouselLinks/CarouselLinks.tsx

@@ -3,18 +3,29 @@ import type { UniBlockProps } from '../../model/JSXBlock';
 import type { LinkProps } from '../../model/LinkProps';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
-import { style } from '../../utils/style';
 import { Carousel } from '../Carousel/Carousel';
 import { Headline } from '../Headline/Headline';
 import type { CarouselLinksContent } from './CarouselLinksContent';
+import { style } from '../../utils/style';
 
-export interface CarouselLinksProps extends CarouselLinksContent, UniBlockProps {}
-
-const MAX_LINKS_COUNT = 10;
+export interface CarouselLinksProps extends CarouselLinksContent, UniBlockProps {
+  maxLinksCount?: number;
+}
 
 export const CarouselLinks = JSX<CarouselLinksProps>(
-  ({ className, additionalDescription, description, links, title, ...rest }) => (
-    <BlockWrapper className={style('flex w-full overflow-hidden', className)} {...rest}>
+  ({
+    className,
+    additionalDescription,
+    description,
+    links,
+    title,
+    maxLinksCount = 10,
+    ...rest
+  }) => (
+    <BlockWrapper
+      className={style('flex flex-col sm:flex-row w-full overflow-hidden', className)}
+      {...rest}
+    >
       <div className="mr-xl flex-auto">
         <Headline
           isPadding={false}
@@ -32,18 +43,18 @@ export const CarouselLinks = JSX<CarouselLinksProps>(
           />
         ) : null}
       </div>
-      {links?.length ? renderLinks(links) : null}
+      {links?.length ? renderLinks(links, maxLinksCount) : null}
     </BlockWrapper>
   ),
 );
 
-const renderLinks = (links: LinkProps[]) => {
-  const itemCount = Math.ceil(links.length / MAX_LINKS_COUNT);
+const renderLinks = (links: LinkProps[], maxLinksCount: number) => {
+  const itemCount = Math.ceil(links.length / maxLinksCount);
 
   return (
     <Carousel
-      className="min-w-[832px] w-[832px]"
-      version=""
+      className="sm:w-2/3 w-full p-0 sm:p-2xl"
+      version="secondary"
       itemCount={itemCount}
       arrowsPadded={false}
       showDots={true}
@@ -51,12 +62,12 @@ const renderLinks = (links: LinkProps[]) => {
       {new Array(itemCount).fill(null).map((_, groupIndex) => (
         <div
           key={String(groupIndex)}
-          className="w-[672px] min-w-[672px] ml-10 mr-10 flex flex-wrap self-start"
+          className={style('flex flex-wrap self-start sm:w-[672px] w-full sm:mx-5xl')}
         >
           {links
-            .slice(groupIndex * MAX_LINKS_COUNT, (groupIndex + 1) * MAX_LINKS_COUNT)
+            .slice(groupIndex * maxLinksCount, (groupIndex + 1) * maxLinksCount)
             .map((link, index) => (
-              <LinkButton key={String(index)} className="m-1" {...link} />
+              <LinkButton key={String(index)} className="sm:m-2xs" {...link} />
             ))}
         </div>
       ))}

package/src/components/CarouselLinks/CarouselLinksContent.ts

@@ -8,4 +8,6 @@ export type CarouselLinksContent = UniBlockContent &
   AdditionalDescriptionProps & {
     /** @title Ссылки */
     links?: LinkProps[];
+    /** @title Отступы вложенных компонентов */
+    isInnerPadding?: boolean;
   };

package/src/components/CarouselProductCard/CarouselProductCard.fixture.tsx

@@ -1,9 +1,9 @@
 import '../../setup-fixture';
 
 import type { Picture } from '../../model/Picture';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 import { CarouselProductCard } from './CarouselProductCard';
 import type { CarouselProductCardContent } from './CarouselProductCardContent';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 const isDotted = false;
 
@@ -17,14 +17,14 @@ const image: Picture = {
   title: 'money',
 };
 
-const buttonPrimary: ButtonWithIconProps = {
+const buttonPrimary: ButtonContent = {
   href: '/credit-cards',
   text: 'Подробнее',
   target: '_blank',
   version: 'secondary',
 };
 
-const buttonPrimaryIcon: ButtonWithIconProps = {
+const buttonPrimaryIcon: ButtonContent = {
   href: '/credit-cards',
   text: 'Подробнее',
   target: '_blank',

package/src/components/CarouselProductCard/CarouselProductCardContent.ts

@@ -1,10 +1,10 @@
 import type { BulletsProps } from '../../model/Bullets';
-import type { ButtonCommonIconProps } from '../../model/Button';
 import type { AdditionalDescriptionProps, HeadlineSmallProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { IconProps } from '../../model/Picture';
 import type { LinkCommonProps } from '../../model/LinkProps';
 import type { TextAlign } from '../../ui-kit/Text/TextProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Элемент списка
@@ -21,7 +21,6 @@ export type CarouselProductCardContent = UniBlockContent &
   HeadlineSmallProps &
   AdditionalDescriptionProps &
   IconProps &
-  ButtonCommonIconProps &
   BulletsProps &
   LinkCommonProps & {
     /** @title Список */
@@ -33,4 +32,5 @@ export type CarouselProductCardContent = UniBlockContent &
     isTopPosition?: boolean;
     /** @title Кнопка по всей ширине */
     isButtonFullWidth?: boolean;
+    button?: ButtonContent;
   };

package/src/components/CarouselRecommendationCard/CarouselRecommendationCard.tsx

@@ -32,7 +32,7 @@ export const CarouselRecommendationCard = JSX<RecommendationCardProps>(
         defaultPadding="p-0"
         {...rest}
       >
-        <LinkWrapper href={href} target={target}>
+        <LinkWrapper href={href} target={target} className="h-full">
           <BaseTile
             className="h-full"
             defaultPadding="p-m"

package/src/components/CarouselRecommendationCard/CarouselRecommendationCardContent.ts

@@ -2,11 +2,11 @@ import type { HeadlineCommonProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { LinkCommonProps } from '../../model/LinkProps';
 import type { IconProps } from '../../model/Picture';
-import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
 import type { ListContent } from '../../ui-kit/List/ListContent';
 import type { TextAlign } from '../../ui-kit/Text/TextProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
-export type RecommendationSocialMedia = LinkCommonProps & IconProps & ButtonProps;
+export type RecommendationSocialMedia = LinkCommonProps & IconProps & ButtonContent;
 
 /**
  * @title Карточка рекомендаций

package/src/components/CarouselTariffsCard/CarouselTariffsCard.fixture.mobile.tsx

@@ -1,9 +1,10 @@
 import '../../setup-fixture';
 
 import type { Picture } from '../../model/Picture';
-import type { ButtonProps, ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
 import { CarouselTariffsCard } from './CarouselTariffsCard';
 import type { CarouselTariffsCardContent } from './CarouselTariffsCardContent';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 const imageMonth: Picture = {
   src: 'monthly-payment.png',
@@ -29,7 +30,7 @@ const buttonSecondary: ButtonProps = {
   version: 'secondary',
 };
 
-const buttonIcon: ButtonWithIconProps = {
+const buttonIcon: ButtonContent = {
   text: 'App Store',
   icon: { icon: 'DocIconMonoColor', iconVersion: 'color' },
   href: 'rshb.ru',

package/src/components/CarouselTariffsCard/CarouselTariffsCard.fixture.tsx

@@ -1,7 +1,7 @@
 import '../../setup-fixture';
 
 import type { Picture } from '../../model/Picture';
-import type { ButtonProps, ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 import { CarouselTariffsCard } from './CarouselTariffsCard';
 import type { CarouselTariffsCardContent } from './CarouselTariffsCardContent';
 
@@ -15,21 +15,21 @@ const imageMonth: Picture = {
   title: 'money',
 };
 
-const button: ButtonProps = {
+const button: ButtonContent = {
   href: '/',
   text: 'Открыть расчетный счет',
   target: '_blank',
   version: 'primary',
 };
 
-const buttonSecondary: ButtonProps = {
+const buttonSecondary: ButtonContent = {
   href: '/',
   text: 'Открыть расчетный счет',
   target: '_blank',
   version: 'secondary',
 };
 
-const buttonIcon: ButtonWithIconProps = {
+const buttonIcon: ButtonContent = {
   text: 'App Store',
   icon: { icon: 'DocIconMonoColor', iconVersion: 'color' },
   href: 'rshb.ru',

package/src/components/CarouselTariffsCard/CarouselTariffsCardContent.ts

@@ -1,15 +1,10 @@
-import type { HeadlineCommonProps, TitleProps } from '../../model/HeadlineType';
-import { AlignProps } from '../../model/HeadlineType';
+import type { AlignProps, HeadlineCommonProps, TitleProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { IconProps } from '../../model/Picture';
-import type { ButtonProps, ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 export type TariffsCardCellProps = HeadlineCommonProps & {
-  /**
-   * @title Кнопка
-   * @maxItems 1
-   */
-  buttons?: ButtonWithIconProps[];
+  buttons?: ButtonContent[];
 };
 
 /**
@@ -22,7 +17,7 @@ export type CarouselTariffsCardContent = UniBlockContent &
     /** @title Выделить карточку */
     isHighlighting?: boolean;
     /** @title Кнопка */
-    button?: ButtonProps;
+    button?: ButtonContent;
     /** @title Ячейка */
     cardCells?: TariffsCardCellProps[];
   };

package/src/components/ContactsBlock/ContactsBlockContent.ts

@@ -1,6 +1,6 @@
 import type { AdditionalDescriptionProps, HeadlineCommonProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
-import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Элемент плитки
@@ -8,7 +8,7 @@ import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
 export type ContactBlockProps = HeadlineCommonProps &
   AdditionalDescriptionProps & {
     /** @title Кнопка */
-    button?: ButtonProps;
+    button?: ButtonContent;
   };
 
 /**

package/src/components/ContentPage/ContentPage.tsx

@@ -2,20 +2,13 @@ import { JSX } from '@redneckz/uni-jsx';
 import type { BlockRendererOptions } from '../../BlockRenderer/BlockRendererOptions';
 import { renderBlocksList } from '../../BlockRenderer/renderBlockList';
 import { renderChildren } from '../../BlockRenderer/renderChildren';
-import { useBool } from '../../hooks/useBool';
-import { useLocation } from '../../hooks/useLocation';
-import { useSWRResource } from '../../hooks/useSWRResource';
 import type { BlockDecorator } from '../../model/BlockDecorator';
 import type { BlocksRegistry } from '../../model/BlocksRegistry';
 import type { ContentPageDef } from '../../model/ContentPageDef';
 import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
-import { projectSettings } from '../../ProjectSettings';
 import { useBlockRouterProvider } from '../../services/BlockRouter/useBlockRouterProvider';
-import type { SitemapData } from '../../services/sitemap/SitemapData';
 import { CookiePopup } from '../../ui-kit/CookiePopup/CookiePopup';
-import { useDialogHandlers } from '../../ui-kit/Dialog/useDialogHandlers';
-import { LocationDialog } from '../../ui-kit/LocationDialog/LocationDialog';
-import { SearchDialog } from '../../ui-kit/SearchDialog/SearchDialog';
+import { DialogManager } from '../../ui-kit/DialogManager/DialogManager';
 import { style } from '../../utils/style';
 import { LikeControl } from '../LikeControl/LikeControl';
 
@@ -37,60 +30,31 @@ export const ContentPage: JSXBlock<ContentPageProps> = JSX<ContentPageProps>(
       parent: data,
     };
 
-    const sitemap = useSWRResource<SitemapData>(
-      projectSettings.SITEMAP || 'sitemap',
-      data?.fallback,
-    );
-    const [location, onChangeLocation] = useLocation(sitemap?.defaultLocation);
-
     useBlockRouterProvider();
-    const [isSomeDialogOpened, { setTrue: setSomeDialogOpened, setFalse: resetSomeDialogOpened }] =
-      useBool();
-
-    useDialogHandlers({
-      onOpen: setSomeDialogOpened,
-      onClose: resetSomeDialogOpened,
-    });
 
     return (
-      <section
-        className={style(
-          'relative',
-          pageStyle,
-          className,
-          isSomeDialogOpened ? 'overflow-hidden h-screen' : '',
-        )}
-        data-theme={colorPalette}
-      >
-        {slots?.header ? (
-          <div className="mb-5 shadow-[0_8px_32px_0px_#00000014]">
-            {renderBlocksList(slots?.header, {
-              ...options,
-              slotName: 'header',
-              extraProps: { sitemap, location },
-            })}
+      <div>
+        <section
+          className={style('relative @container', pageStyle, className)}
+          data-theme={colorPalette}
+        >
+          {slots?.header ? (
+            <div className="relative z-10 mb-5 shadow-[0_8px_32px_0px_#00000014]">
+              {renderBlocksList(slots?.header, { ...options, slotName: 'header' })}
+            </div>
+          ) : null}
+          <div className="container @lg:grid @lg:grid-cols-12 @lg:gap-1">
+            {renderChildren({ block: data, options, extraProps: { className: 'scroll-mt-12' } })}
+            {renderBlocksList(slots?.footer, { ...options, slotName: 'footer' })}
           </div>
-        ) : null}
-        <div className="container grid grid-cols-12 gap-1">
-          {renderChildren({ block: data, options, extraProps: { className: 'scroll-mt-12' } })}
-          {renderBlocksList(slots?.footer, {
-            ...options,
-            slotName: 'footer',
-            extraProps: { sitemap, location },
-          })}
-        </div>
-        {likeControl ? renderLikeControl() : null}
+          {likeControl ? renderLikeControl() : null}
+        </section>
+        <DialogManager />
         <CookiePopup
           termLink={{ href: '/pd-policy#cookie', target: '_blank' }}
           personalDataPolicyLink={{ href: '/pd-policy', target: '_blank' }}
         />
-        <SearchDialog topItems={sitemap?.topItems} />
-        <LocationDialog
-          currentLocation={location}
-          foreignOffices={sitemap?.foreignOffices}
-          onChangeLocation={onChangeLocation}
-        />
-      </section>
+      </div>
     );
   },
 );