@redneckz/wildless-cms-uni-blocks 0.14.28 → 0.14.30

package/src/components/Calculator/CreditCalculatorForm.tsx

@@ -26,7 +26,7 @@ export interface CreditCalculatorProp extends CreditCalculatorProps {
 }
 
 export const CreditCalculatorForm = JSX<CreditCalculatorProp>(
-  ({ className, sourceBookDir, buttons, footnote, paramsViewSettings, isMobile }) => {
+  ({ className, sourceBookDir, buttons, footnote, paramsViewSettings }) => {
     const [userInputParams, { field }] = useForm({
       isAnnuity: true,
       isInsurance: true,
@@ -44,7 +44,8 @@ export const CreditCalculatorForm = JSX<CreditCalculatorProp>(
     );
 
     const paymentTypeElement = renderPaymentType({
-      title: isMobile ? 'Тип платежа' : '',
+      title: '',
+      mobileTitle: 'Тип платежа',
       orientation: 'vertical',
       ...field('isAnnuity'),
     });

package/src/components/Calculator/RefinancingCalculatorForm.tsx

@@ -26,6 +26,7 @@ import {
 
 export interface RefinancingCalculatorProp extends RefinancingCalculatorProps {
   className?: string;
+  isMobile?: boolean;
 }
 
 export const RefinancingCalculatorForm = JSX<RefinancingCalculatorProp>(
@@ -47,6 +48,13 @@ export const RefinancingCalculatorForm = JSX<RefinancingCalculatorProp>(
       paramsViewSettings,
     );
 
+    const paymentTypeElement = renderPaymentType({
+      title: '',
+      mobileTitle: 'Тип платежа',
+      orientation: 'vertical',
+      ...field('isAnnuity'),
+    });
+
     return (
       <section className={style('flex flex-col justify-between @5xl:flex-row gap-m', className)}>
         <div className="flex flex-col gap-y-m sm:max-w-md gap-2xl">
@@ -84,12 +92,15 @@ export const RefinancingCalculatorForm = JSX<RefinancingCalculatorProp>(
                 value: calculatorParams.moneyExtra,
               })
             : null}
+          <div className="sm:hidden pt-1 pb-4 border-b border-main-divider">
+            {paymentTypeElement}
+          </div>
         </div>
         {renderRate({
           rate: calculatorParams.rate,
           fractionDigits: 1,
         })}
-        <div className="flex flex-col gap-2xl sm:w-96">
+        <div className="flex flex-col gap-2xl mt-2 sm:w-96 sm:mt-0">
           <CalculatorValueBlock
             title={'Ежемесячный платеж'}
             value={calculatorParams.monthlyPayment}
@@ -102,7 +113,7 @@ export const RefinancingCalculatorForm = JSX<RefinancingCalculatorProp>(
               postfix="₽"
             />
           ) : null}
-          {renderPaymentType({ orientation: 'vertical', ...field('isAnnuity') })}
+          <div className="hidden sm:block">{paymentTypeElement}</div>
           {renderButtonsSection(buttons, { isVertical: true })}
           {renderFootnote(footnote)}
         </div>
@@ -115,7 +126,7 @@ const renderCreditParamsForm = (
   params: RefinancingCalculatorParams & RefinancingCalculatorParamsViewSettings,
   field: FormFieldRegisterer<any>,
 ) => (
-  <div className="space-y-s">
+  <div className="space-y-lg sm:space-y-s">
     {params.isShowSalaryClient ? (
       <Checkbox
         text="Получаю зарплату на счёт в Россельхозбанке"

package/src/components/Calculator/renderBinaryRadioButtonGroup.tsx

@@ -9,6 +9,7 @@ import { style } from '../../utils/style';
 export interface BinaryRadioButtonGroupProps {
   items: [truthy: RadioButtonItem, falsy: RadioButtonItem];
   title?: string;
+  mobileTitle?: string;
   orientation?: ListOrientation;
   value?: boolean;
   radioGroupClassName?: string;
@@ -18,6 +19,7 @@ export interface BinaryRadioButtonGroupProps {
 export const renderBinaryRadioButtonGroup = ({
   items,
   title,
+  mobileTitle = title,
   orientation = 'horizontal',
   value,
   radioGroupClassName,
@@ -25,12 +27,20 @@ export const renderBinaryRadioButtonGroup = ({
 }: BinaryRadioButtonGroupProps) => (
   <div className="space-y-s">
     {title ? (
-      <div>
+      <div className="hidden @5xl:block">
         <Text color="text-secondary-text" font="font-light">
           {title}
         </Text>
       </div>
     ) : null}
+    {mobileTitle ? (
+      <div className="@5xl:hidden">
+        <Text color="text-secondary-text" font="font-light">
+          {mobileTitle}
+        </Text>
+      </div>
+    ) : null}
+
     <RadioButtonGroup
       orientation={orientation}
       items={items}

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

@@ -5,10 +5,6 @@ import { Blocks } from '../Blocks';
 import { BANK_HISTORY_CARD } from '../CarouselBankHistoryCard/CarouselBankHistoryCard.fixture';
 import { CARD } from '../CarouselCard/CarouselCard.fixture';
 import { CATALOG_CARD, CATALOG_CARD_NEW } from '../CarouselCatalogCard/CarouselCatalogCard.fixture';
-import {
-  PRODUCT_CARD,
-  PRODUCT_CARD_SMALL,
-} from '../CarouselProductCard/CarouselProductCard.fixture';
 import { CAROUSEL_RECOMMENDATION_CARD_BENEFITS } from '../CarouselRecommendationCard/CarouselRecommendationCard.fixture';
 import { CAROUSEL_RECOMMENDATION_CARD } from '../CarouselRecommendationCard/CarouselRecommendationCard.fixture.mobile';
 import { TARIFFS_CARD, TARIFFS_CARD_HIT } from '../CarouselTariffsCard/CarouselTariffsCard.fixture';
@@ -95,36 +91,6 @@ export default {
       />
     </div>
   ),
-  product: (
-    <div className="container grid grid-cols-12">
-      <Carousel
-        className="col-span-12"
-        block={{
-          type: 'Carousel',
-          blocks: new Array(3).fill({
-            type: 'CarouselProductCard',
-            content: PRODUCT_CARD,
-          }),
-        }}
-        options={options}
-      />
-    </div>
-  ),
-  'mini-product': (
-    <div className="container grid grid-cols-12">
-      <Carousel
-        className="col-span-12"
-        block={{
-          type: 'Carousel',
-          blocks: new Array(3).fill({
-            type: 'CarouselProductCard',
-            content: PRODUCT_CARD_SMALL,
-          }),
-        }}
-        options={options}
-      />
-    </div>
-  ),
   recommendations: (
     <div className="container grid grid-cols-12">
       <Carousel

package/src/components/Carousel/Carousel.fixture.tsx

@@ -6,17 +6,13 @@ import { BANK_HISTORY_CARD } from '../CarouselBankHistoryCard/CarouselBankHistor
 import { CARD, CARD_MINI, CARD_NEW } from '../CarouselCard/CarouselCard.fixture';
 import { CATALOG_CARD, CATALOG_CARD_NEW } from '../CarouselCatalogCard/CarouselCatalogCard.fixture';
 import { INVESTMENT_CARD_WITH_SINGLE_COLUMN } from '../CarouselInvestmentCard/CarouselInvestmentCard.fixture';
-import {
-  PRODUCT_CARD,
-  PRODUCT_CARD_SMALL,
-} from '../CarouselProductCard/CarouselProductCard.fixture';
 import {
   CAROUSEL_RECOMMENDATION_CARD_BENEFITS,
   CAROUSEL_RECOMMENDATION_CARD_SECONDARY,
   CAROUSEL_RECOMMENDATION_CARD_WITHOUT_LIST,
 } from '../CarouselRecommendationCard/CarouselRecommendationCard.fixture';
-import { RICH_CARD } from '../CarouselRichTextCard/CarouselRichTextCard.fixture';
 import { TARIFFS_CARD, TARIFFS_CARD_HIT } from '../CarouselTariffsCard/CarouselTariffsCard.fixture';
+import { RICH_CARD } from '../RichTextBlock/RichTextBlock.fixture';
 import { Carousel } from './Carousel';
 
 const catalogImage: Picture = {
@@ -114,52 +110,6 @@ export default {
       />
     </div>
   ),
-  product: (
-    <div className="container grid grid-cols-12">
-      <Carousel
-        className="col-span-12"
-        visibleItemCount={1}
-        block={{
-          type: 'Carousel',
-          blocks: new Array(6).fill({
-            type: 'CarouselProductCard',
-            content: PRODUCT_CARD,
-          }),
-        }}
-        options={options}
-      />
-    </div>
-  ),
-  'mini-product': (
-    <div className="container grid grid-cols-12">
-      <Carousel
-        className="col-span-12"
-        visibleItemCount={3}
-        block={{
-          type: 'Carousel',
-          blocks: [
-            {
-              type: 'CarouselProductCard',
-              content: PRODUCT_CARD,
-            },
-            {
-              type: 'CarouselProductCard',
-              content: PRODUCT_CARD_SMALL,
-            },
-            {
-              type: 'CarouselProductCard',
-              content: PRODUCT_CARD_SMALL,
-            },
-            {
-              type: 'CarouselProductCard',
-              content: PRODUCT_CARD_SMALL,
-            },
-          ],
-        }}
-        options={options}
-      />
-    </div>
-  ),
   investment: (
     <div className="container grid grid-cols-12">
       <Carousel
@@ -254,7 +204,7 @@ export default {
         block={{
           type: 'Carousel',
           blocks: new Array(6).fill({
-            type: 'CarouselRichTextCard',
+            type: 'RichTextBlock',
             content: RICH_CARD,
           }),
         }}

package/src/components/Carousel/Carousel.tsx

@@ -88,8 +88,8 @@ Carousel.childrenTypes = [
   'CarouselProgramsCard',
   'CarouselRecommendationCard',
   'CarouselTariffsCard',
-  'CarouselRichTextCard',
   'CarouselInvestmentCard',
+  'RichTextBlock',
   'ProductBlock',
 ];
 

package/src/components/CarouselCard/CarouselCard.tsx

@@ -26,7 +26,7 @@ export const CarouselCard = JSX<CarouselCardProps>(
         <div
           className={style(
             layerBaseStyle,
-            'relative p-xl sm:p-5xl bg-white border-transparent sm:border-green-light',
+            'relative p-xl sm:p-5xl bg-white border-transparent sm:border-green-more-light',
           )}
         >
           <Headline

package/src/components/CarouselRecommendationCard/CarouselRecommendationCard.fixture.tsx

@@ -178,4 +178,48 @@ export default {
       />
     </div>
   ),
+  additionalDescription: (
+    <div className="container grid grid-cols-12">
+      <CarouselRecommendationCard
+        className="col-span-6"
+        align="text-center"
+        title="Более 5000 товаров"
+        description="Время копить: ставка растет в зависимости от срока нахождения средств на Счете!"
+        items={items}
+        isDotted={false}
+        icon={iconCoin}
+        imageOptions={{ isImageAlwaysOnRight: false }}
+        additionalDescription="Дополнительное описание"
+        socialMedia={[
+          {
+            href: 'https://rshb.ru',
+            text: 'Подробнее',
+            version: 'gray',
+          },
+        ]}
+      />
+    </div>
+  ),
+  leftImage: (
+    <div className="container grid grid-cols-12">
+      <CarouselRecommendationCard
+        className="col-span-6"
+        align="text-center"
+        title="Более 5000 товаров"
+        description="Время копить: ставка растет в зависимости от срока нахождения средств на Счете!"
+        items={items}
+        isDotted={false}
+        icon={iconCoin}
+        imageOptions={{ isImageAlwaysOnRight: false, directionRight: false }}
+        additionalDescription="Дополнительное описание"
+        socialMedia={[
+          {
+            href: 'https://rshb.ru',
+            text: 'Подробнее',
+            version: 'gray',
+          },
+        ]}
+      />
+    </div>
+  ),
 };

package/src/components/CarouselRecommendationCard/CarouselRecommendationCard.tsx

@@ -7,6 +7,8 @@ import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { Img } from '../../ui-kit/Img/Img';
 import { LinkWrapper } from '../../ui-kit/LinkWrapper/LinkWrapper';
 import { List } from '../../ui-kit/List/List';
+import { Paragraph } from '../../ui-kit/Paragraph/Paragraph';
+import { type TextAlign } from '../../ui-kit/Text/TextProps';
 import { isIcon } from '../../utils/isIcon';
 import { style } from '../../utils/style';
 import { SocialMedia } from '../Footer/SocialMedia';
@@ -22,9 +24,11 @@ export const CarouselRecommendationCard = JSX<RecommendationCardProps>(
     className,
     padding,
     description,
+    additionalDescription,
     href,
     icon,
     items = [],
+    isDotted,
     listItemSize = 'S',
     socialMedia = [],
     target,
@@ -54,7 +58,7 @@ export const CarouselRecommendationCard = JSX<RecommendationCardProps>(
                 <Headline
                   title={title}
                   description={description}
-                  headlineVersion="S"
+                  headlineVersion="XS"
                   isEmbedded={true}
                   align={align}
                 />
@@ -68,12 +72,26 @@ export const CarouselRecommendationCard = JSX<RecommendationCardProps>(
             }
             isImageAlwaysOnRight={isImageAlwaysOnRight}
             isImageSecondary={isImageSecondary}
+            imageAlign="center"
           >
             <BenefitsList benefits={benefits} />
-            <List items={items} listItemSize={listItemSize} />
+            <List items={items} listItemSize={listItemSize} isDotted={isDotted} />
+            {renderAdditionalDescription(additionalDescription, align)}
           </BaseTile>
         </LinkWrapper>
       </BlockWrapper>
     );
   },
 );
+
+const renderAdditionalDescription = (additionalDescription?: string, align?: TextAlign) =>
+  additionalDescription ? (
+    <Paragraph
+      size="text-m"
+      font="font-light"
+      color="text-secondary-text group-data-secondary:text-white/80"
+      align={align}
+    >
+      {additionalDescription}
+    </Paragraph>
+  ) : null;

package/src/components/CarouselRecommendationCard/CarouselRecommendationCardContent.ts

@@ -1,4 +1,9 @@
-import { type AlignProps, type HeadlineCommonProps } from '../../model/HeadlineType';
+import { type BulletsProps } from '../../model/Bullets';
+import {
+  type AdditionalDescriptionProps,
+  type AlignProps,
+  type HeadlineCommonProps,
+} from '../../model/HeadlineType';
 import { type UniBlockContent } from '../../model/JSXBlock';
 import { type LinkCommonProps } from '../../model/LinkProps';
 import { type IconProps } from '../../model/Picture';
@@ -12,9 +17,11 @@ import { type ListContent } from '../../ui-kit/List/ListContent';
  */
 export type CarouselRecommendationCardContent = UniBlockContent &
   HeadlineCommonProps &
+  AdditionalDescriptionProps &
   ListContent &
   IconProps &
   LinkCommonProps &
+  BulletsProps &
   AlignProps &
   BenefitsListContent & {
     /** @title Соц сети */

package/src/components/Depository/Depository.tsx

@@ -5,6 +5,7 @@ import { type JSXBlock, type UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { NotFound } from '../../ui-kit/NotFound/NotFound';
 import { Pagination } from '../../ui-kit/Pagination/Pagination';
+import { Text } from '../../ui-kit/Text/Text';
 import { style } from '../../utils/style';
 import { type DepositoryContent } from './DepositoryContent';
 import { DepositoryFilter } from './DepositoryFilter';
@@ -33,32 +34,48 @@ export const Depository: JSXBlock<DepositoryProps> = JSX<DepositoryProps>(
     const [itemCount, setItemCount] = useState(DEFAULT_ITEMS_COUNT);
     const [filtrationState, { field, reset }] = useForm(initialFiltrationState);
 
-    const { totalPages = 0, items } = useDepository({
+    const { totalPages = 0, items = [] } = useDepository({
       size: itemCount,
       page: currentPage,
       ...filtrationState,
     });
 
     const handleChangePage = useCallback((page: number) => setCurrentPage(page - 1), []);
-    const handleItemCountChange = useCallback((count: number) => setItemCount(count), []);
+
+    const handleItemCountChange = useCallback((count: number) => {
+      if (itemCount !== count) {
+        setItemCount(count);
+        setCurrentPage(0);
+      } else {
+        setItemCount(count);
+      }
+    }, []);
 
     return (
-      <BlockWrapper className={style(className, 'container p-4xl')} {...rest}>
+      <BlockWrapper className={style(className, 'container p-6xl')} {...rest}>
         <DepositoryFilter filtrationState={filtrationState} field={field} onClearFilter={reset} />
         <div className="flex flex-col">
           <div className="grid grid-cols-12 pb-lg border-gray border-opacity-50 border-b">
-            <span className="col-span-2 text-gray text-m">Дата</span>
-            <span className="col-span-10 text-gray text-m">Тема</span>
+            <div className="col-span-2">
+              <Text size="text-m" color="text-secondary-text">
+                Дата
+              </Text>
+            </div>
+            <span className="col-span-10">
+              <Text size="text-m" color="text-secondary-text">
+                Тема
+              </Text>
+            </span>
           </div>
-          {items?.length ? (
-            items?.map((params) => <DepositoryItem key={String(params.publicId)} {...params} />)
+          {items.length ? (
+            items.map((params) => <DepositoryItem key={String(params.publicId)} {...params} />)
           ) : (
             <NotFound title="Ничего не найдено" description="Попробуйте очистить фильтры" />
           )}
           <Pagination
             currentPage={currentPage + 1}
             onPageChange={handleChangePage}
-            totalPages={totalPages + 1}
+            totalPages={totalPages}
             itemCount={itemCount}
             onItemCountChange={handleItemCountChange}
           />

package/src/components/Depository/DepositoryFilter.tsx

@@ -28,7 +28,7 @@ export const DepositoryFilter = JSX<DepositoryFilterProps>(
       />
       <div className="col-span-2 mt-auto">
         <button
-          className="px-m py-s rounded-md bg-main-gray text-green cursor-pointer w-full"
+          className="px-m py-s rounded-md bg-main-gray text-green hover:text-white hover:bg-primary-hover active:bg-primary-active cursor-pointer w-full"
           onClick={onClearFilter}
         >
           Очистить фильтр

package/src/components/Depository/DepositoryItem.tsx

@@ -9,8 +9,12 @@ export const DepositoryItem = ({ title, timestamp, publicId }: DepositoryDataIte
 
   return (
     <div className="grid grid-cols-12 py-lg border-gray border-opacity-50 border-b" key={publicId}>
-      <div className="col-span-2 text-m">
-        {timestamp ? <Text>{formatDate(timestamp)}</Text> : null}
+      <div className="col-span-2">
+        {timestamp ? (
+          <Text size="text-m" font-weight="font-light">
+            {formatDate(timestamp)}
+          </Text>
+        ) : null}
       </div>
       <div className="col-span-10 text-h6 hover:text-primary-active">
         <a href={href} download aria-label="Скачать">

package/src/components/Depository/useDepository.ts

@@ -19,14 +19,23 @@ interface UseDepositoryParams extends DepositoryFiltrationState {
   size: number;
   page: number;
 }
+const DEPOSITARY_URL = '/api/v1/depository';
 
 export const useDepository = ({ size, page, query, startDate, endDate }: UseDepositoryParams) => {
-  const { data } = useAsyncData<DepositoryData>(
-    `/api/v1/depository?page=${page}&size=${size}&query=${query}&timestampStart=${
-      startDate ? formatDate(startDate, true) : ''
-    }&timestampEnd=${endDate ? formatDate(endDate, true) : ''}`,
-    fetchJSONUnsafe,
-  );
+  const formatStartDate = startDate ? formatDate(startDate, true) : '';
+  const formatEndDate = endDate ? formatDate(endDate, true) : '';
+
+  const searchParams = new URLSearchParams(DEPOSITARY_URL);
+
+  searchParams.set('page', String(page));
+  searchParams.set('size', String(size));
+  searchParams.set('query', query);
+  searchParams.set('startDate', formatStartDate);
+  searchParams.set('endDate', formatEndDate);
+
+  const queryString = `?${searchParams.toString()}`;
+
+  const { data } = useAsyncData<DepositoryData>(DEPOSITARY_URL + queryString, fetchJSONUnsafe);
 
   return { items: data?.content, totalPages: data?.totalPages };
 };

package/src/components/Footer/SocialMedia.tsx

@@ -33,7 +33,7 @@ export const SocialMedia = JSX<SocialMediaProps>(
         ..._,
         ...buttonText,
         icon: { ...iconCustom, iconVersion: 'color' },
-        version,
+        version: _?.version ?? version,
       };
     });
 
@@ -47,7 +47,7 @@ export const SocialMedia = JSX<SocialMediaProps>(
       <div className={style('flex flex-col gap-xs', className)}>
         <div className="flex gap-xs">
           {renderButtonsSection(buttons, {
-            className: stretched ? 'w-full' : '',
+            className: style(stretched || hasText ? 'basis-full' : ''),
             buttonClassName,
           })}
         </div>

package/src/components/Headline/headlineVersionStyles.ts

@@ -1,4 +1,4 @@
-import { type HeadlineSmallVersion, type HeadlineVersion } from '../../model/HeadlineType';
+import { type HeadlineVersion } from '../../model/HeadlineType';
 import { type HeadingCommonProps } from '../../ui-kit/Heading/HeadingProps';
 import { type FontWeight, type TextSize, type TitleSize } from '../../ui-kit/Text/TextProps';
 
@@ -48,15 +48,3 @@ export const headlineVersionStyles: Record<
     descriptionStyle: 'mt-xs',
   },
 };
-
-// TODO: Move to Gallery and rename
-export const HEADLINE_SMALL_VERSION: Record<HeadlineSmallVersion, string> = {
-  H6: 'text-h6',
-  XL_L: 'text-xl-light',
-  XL_R: 'text-xl',
-  L_L: 'text-l-light',
-  L_R: 'text-l',
-  M: 'text-m-light',
-  S: 'text-s-light',
-  XS: 'text-xs-light',
-};

package/src/components/OfficesAtmsMap/Badge.tsx

@@ -5,9 +5,9 @@ import { style } from '../../utils/style';
 
 const colorStyle: Record<string, { border: string; text: TextColor }> = {
   yellow: { border: 'border-yellow-light', text: 'text-yellow' },
-  green: { border: 'border-green-light', text: 'text-green-dark' },
+  green: { border: 'border-green-more-light', text: 'text-green-dark' },
   gray: { border: 'border-gray', text: 'text-secondary-text' },
-  red: { border: 'border-error', text: 'text-error' },
+  red: { border: 'border-error/30', text: 'text-error' },
 };
 
 export interface BadgeProps {

package/src/components/OfficesAtmsMap/CardCell.tsx

@@ -1,40 +1,52 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { Text } from '../../ui-kit/Text/Text';
-import { type TextColor } from '../../ui-kit/Text/TextProps';
+import { type TextColor, type TextSize } from '../../ui-kit/Text/TextProps';
 import { style } from '../../utils/style';
 
 export interface CardCellProps {
   className?: string;
   label?: string;
-  value?: string;
+  labelSize?: TextSize;
+  value?: string | string[];
   subText?: string;
   subColor?: TextColor;
 }
 
-export const CardCell = JSX<CardCellProps>(({ className, label, value, subText, subColor }) => {
-  const textItems = value?.split(',') ?? [];
+export const CardCell = JSX<CardCellProps>(({ value, subText, children, ...props }) => {
+  const textItems = (Array.isArray(value) ? value : value?.split(',') ?? []).filter(Boolean);
 
-  if (!textItems.length && !subText) {
+  if ([textItems.length, children, subText].every((_) => !_)) {
     return null;
   }
 
-  return (
-    <div className={style('flex gap-2xs flex-col h-full max-w-[300px]', className)}>
-      {label ? (
-        <Text color="text-secondary-text" font="font-light" size="text-m">
-          {label}
-        </Text>
-      ) : null}
-      {textItems.filter(Boolean).map((text, i) => (
+  return renderCardCell({ textItems, subText, children, ...props });
+});
+
+const renderCardCell = ({
+  label,
+  labelSize = 'text-m',
+  textItems,
+  subColor,
+  subText,
+  className,
+  children,
+}: CardCellProps & { textItems: string[]; children: any }) => (
+  <div className={style('flex gap-2xs flex-col h-full max-w-[300px]', className)}>
+    {label ? (
+      <Text color="text-secondary-text" font="font-light" size={labelSize}>
+        {label}
+      </Text>
+    ) : null}
+    {children ||
+      textItems.filter(Boolean).map((text, i) => (
         <Text key={String(i)} size="text-l">
           {text.trim()}
         </Text>
       ))}
-      {subText ? (
-        <Text color={subColor} size="text-m">
-          {subText}
-        </Text>
-      ) : null}
-    </div>
-  );
-});
+    {subText ? (
+      <Text color={subColor} size="text-m">
+        {subText}
+      </Text>
+    ) : null}
+  </div>
+);

package/src/components/OfficesAtmsMap/OfficesAtmsMapProps.tsx

@@ -16,7 +16,9 @@ export interface ExchangeRate {
 }
 
 export type WorkScheduleWeek = {
+  key?: string;
   title?: string;
+  short?: string;
   status?: boolean;
   workTime?: string;
   lunchHour?: string;
@@ -42,6 +44,9 @@ export type WorkSchedule = {
   workingFriday?: boolean;
   workingSaturday?: boolean;
   workingSunday?: boolean;
+  isMatchesPattern?: boolean;
+  businessScheduleVisibleTag?: boolean;
+  businessScheduleDescription?: string;
 };
 
 export type SafeBoxCaseTariff = {