@redneckz/wildless-cms-uni-blocks 0.14.938 → 0.14.940

package/src/components/CashbackCalculator/CashbackCalculator.tsx

@@ -21,15 +21,7 @@ const INFO_BLOCK_HTML = `<p>Полученные баллы можно конв
 interface CashbackCalculatorProps extends CashbackCalculatorContent, UniBlockProps {}
 
 export const CashbackCalculator = JSX<CashbackCalculatorProps>(
-  ({
-    maxInputRange = 300000,
-    image,
-    deleteImage,
-    infoImage,
-    isMultiple = false,
-    className = '',
-    ...rest
-  }) => {
+  ({ maxInputRange = 300000, image, deleteImage, infoImage, className = '', ...rest }) => {
     const {
       cashbacks,
       categories,
@@ -37,7 +29,7 @@ export const CashbackCalculator = JSX<CashbackCalculatorProps>(
       onChangeCashback,
       onDeleteCashback,
       onResetCashback,
-    } = useCashbackCalculator(isMultiple);
+    } = useCashbackCalculator();
 
     const img = image?.src ? (
       <Img image={image} className="hidden w-full @xl:block" imageClassName="justify-self-center" />
@@ -50,8 +42,8 @@ export const CashbackCalculator = JSX<CashbackCalculatorProps>(
         {...rest}
       >
         <Headline
-          title="Калькулятор кешбэка"
-          description="Выберите 5 категорий кешбэка, и вы получите общий расчет получаемого кешбэка"
+          title="Калькулятор расчета баллов"
+          description="Можно выбрать не более 5 категорий, одна из них из повышенной категории"
           headlineVersion="XL"
           isEmbedded={true}
         />

package/src/components/CashbackCalculator/CashbackCalculatorContent.ts

@@ -22,6 +22,4 @@ export type CashbackCalculatorContent = UniBlockContent &
     deleteImage?: Picture;
     /** @title Иконка информационного блока */
     infoImage?: Picture;
-    /** @title Предзаполнение дефолтного значения несколькими категориями */
-    isMultiple?: boolean;
   };

package/src/components/CashbackCalculator/CashbackCalculatorResult.tsx

@@ -1,8 +1,9 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { Heading } from '../../ui-kit/Heading/Heading';
+import { RichText } from '../../ui-kit/RichText/RichText';
 import { Text } from '../../ui-kit/Text/Text';
 import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
 import { toLocalNumberFormat } from '../../utils/toLocalNumberFormat';
-import { Headline } from '../Headline/Headline';
 import { type Cashback } from './CashbackCalculatorContent';
 
 const MAX_MONTH_CASHBACK = 5000;
@@ -22,9 +23,9 @@ const ResultText = JSX<ResultTextProps>(({ text, value }) => (
     <Text size="text-m" color="text-primary-text" font="font-light">
       {text}
     </Text>
-    <div className="w-full text-2xl bg-main-gray px-4 py-3 rounded-md">{`${toLocalNumberFormat()(
-      value,
-    )} ₽`}</div>
+    <div className="w-full text-2xl bg-main-gray px-4 py-3 rounded-md">
+      {toLocalNumberFormat()(value)}
+    </div>
   </div>
 ));
 
@@ -33,13 +34,8 @@ export const CashbackCalculatorResult = JSX<CashbackCalculatorResultProps>(({ ca
 
   return (
     <div className="w-full flex flex-col gap-lg">
-      <Headline
-        title="Результат расчета"
-        description="Категории кешбэка предварительно"
-        headlineVersion="XS"
-        isEmbedded={true}
-        align="text-left"
-      />
+      <Heading className="text-left" headingType="h5" as="h2" title="Результат расчета" />
+      <RichText __html='Категории покупок для расчета баллов предварительные.<br />Подробнее по условиям и начислениям можно узнать во вкладке <a href="#docs">документы</a>' />
       <div className="flex flex-col @xs:flex-row gap-lg">
         <ResultText text="Баллов в месяц" value={mounth} />
         <ResultText text="Баллов в год" value={year} />

package/src/components/CashbackCalculator/CashbackCategory.tsx

@@ -12,34 +12,34 @@ import { type Cashback } from './CashbackCalculatorContent';
 
 const AllPercentCategories: Option[] = [
   {
-    text: 'Категория на кешбэк 1,5%',
+    text: 'Категория 1,5%',
     key: '1.5',
   },
   {
-    text: 'Категория на кешбэк 3%',
+    text: 'Категория 3%',
     key: '3',
   },
   {
-    text: 'Категория на кешбэк 5%',
+    text: 'Категория 5%',
     key: '5',
   },
   {
-    text: 'Категория на кешбэк 10%',
+    text: 'Категория 10%',
     key: '10',
   },
   {
-    text: 'Категория на кешбэк 15%',
+    text: 'Категория 15%',
     key: '15',
   },
 ];
 
 const PercentCategoriesWithoutIncreased: Option[] = [
   {
-    text: 'Категория на кешбэк 1,5%',
+    text: 'Категория 1,5%',
     key: '1.5',
   },
   {
-    text: 'Категория на кешбэк 3%',
+    text: 'Категория 3%',
     key: '3',
   },
 ];
@@ -84,13 +84,13 @@ export const CashbackCategory = JSX<CashbackCategoryProps>(
       <div className="w-full space-y-m">
         <div className="space-y-xs">
           <Text size="text-m" color="text-primary-text" font="font-light">
-            Выберите категорию кешбэка
+            Выберите категорию
           </Text>
           <div className="flex gap-m">
             <Select
               className="w-full"
               isManualInput={isMainCashback}
-              placeholder="Выберите кэшбэк"
+              placeholder="Выберите категорию"
               options={getPercentCategories(isMainCashback, showIncreasedPercents)}
               value={cashback.percent}
               onChange={onChangePercent}
@@ -109,8 +109,8 @@ export const CashbackCategory = JSX<CashbackCategoryProps>(
         </div>
         {categories?.length && !isMainCashback ? (
           <Select
-            label="Выберите катеорию"
-            placeholder="Выберите катеорию"
+            label="Выберите категорию покупок"
+            placeholder="Выберите категорию покупок"
             options={categories}
             value={currentCategory}
             onChange={setCurrentCategory}

package/src/components/CashbackCalculator/useCashbackCalculator.ts

@@ -4,49 +4,20 @@ import { type DictionaryItem } from '../../retail/model/LeadFormData';
 import { type Option } from '../../ui-kit/Select/Option';
 import { type Cashback } from './CashbackCalculatorContent';
 
-const DEFAULT_MULTIPLE_CASHBACK: Cashback[] = [
-  {
-    id: 0,
-    percent: {
-      text: 'Категория на кешбэк 1%',
-      key: '1',
-    },
-    sum: 5000,
-  },
-  {
-    id: 1,
-    percent: {
-      text: 'Категория на кешбэк 1,5%',
-      key: '1.5',
-    },
-    sum: 5000,
-  },
-  {
-    id: 2,
-    percent: {
-      text: 'Категория на кешбэк 1,5%',
-      key: '1.5',
-    },
-    sum: 5000,
-  },
-];
-
 const DEFAULT_CASHBACK: Cashback[] = [
   {
     id: 0,
     percent: {
-      text: 'Категория на кешбэк 1%',
+      text: 'Категория 1% "На всё"',
       key: '1',
     },
     sum: 5000,
   },
 ];
 
-export const useCashbackCalculator = (isMultiple: boolean) => {
+export const useCashbackCalculator = () => {
   const { data } = useLeadFormData('CASHBACK_CATEGORY');
-  const [cashbacks, setCashbacks] = useState<Cashback[]>(
-    isMultiple ? DEFAULT_MULTIPLE_CASHBACK : DEFAULT_CASHBACK,
-  );
+  const [cashbacks, setCashbacks] = useState<Cashback[]>(DEFAULT_CASHBACK);
 
   const categories: Option[] =
     data?.map((_: DictionaryItem) => ({
@@ -60,7 +31,7 @@ export const useCashbackCalculator = (isMultiple: boolean) => {
       {
         id: _[_.length - 1].id + 1,
         percent: {
-          text: 'Категория на кешбэк 1,5%',
+          text: 'Категория 1,5%',
           key: '1.5',
         },
         sum: 5000,

package/src/components/ContentPage/ContentPage.tsx

@@ -46,8 +46,13 @@ export const ContentPage = JSX<ContentPageProps>(
     return (
       <div data-theme={data.colorPalette || 'pc'}>
         <section className={style('@container relative', data.style, className)}>
-          {!isFrame && slots?.[HEADER_SLOT]?.length ? (
-            <div className="relative z-10 mb-lg shadow-[0_8px_32px_0px_#00000014]">
+          {slots?.[HEADER_SLOT]?.length ? (
+            <div
+              className={style(
+                { hidden: isFrame },
+                'relative z-10 mb-lg shadow-[0_8px_32px_0px_#00000014]',
+              )}
+            >
               {renderBlocksList(slots?.[HEADER_SLOT], { ...options, slotName: HEADER_SLOT })}
             </div>
           ) : null}
@@ -61,8 +66,8 @@ export const ContentPage = JSX<ContentPageProps>(
               renderBlocksList(slots?.[FOOTER_SLOT], { ...options, slotName: FOOTER_SLOT })}
           </div>
         </section>
-        {!isFrame && slots?.[STICKY_FOOTER_SLOT]?.length ? (
-          <div className="fixed w-full bottom-0 left-0 z-[100]">
+        {slots?.[STICKY_FOOTER_SLOT]?.length ? (
+          <div className={style({ hidden: isFrame }, 'fixed w-full bottom-0 left-0 z-[100]')}>
             {renderBlocksList(slots?.[STICKY_FOOTER_SLOT], {
               ...options,
               slotName: STICKY_FOOTER_SLOT,
@@ -71,7 +76,7 @@ export const ContentPage = JSX<ContentPageProps>(
         ) : null}
         <DialogManager />
         <PopupManager />
-        <CookiePopup __html={resolvedPageContent?.cookieContent?.__html} />
+        {!isFrame ? <CookiePopup __html={resolvedPageContent?.cookieContent?.__html} /> : null}
       </div>
     );
   },

package/src/components/TabsLayout/TabsLayout.tsx

@@ -6,6 +6,7 @@ import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { type TabItemBase } from '../../ui-kit/TabsControl/TabItem';
 import { UniBlock } from '../../UniBlock/UniBlock';
 import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
+import { isIFrame } from '../../utils/isIFrame';
 import { style } from '../../utils/style';
 import { renderTabsLayout } from './renderTabsLayout';
 import { type GroupTab, type Tab, type TabsLayoutContent } from './TabsLayoutContent';
@@ -30,6 +31,7 @@ export const TabsLayout = UniBlock<TabsLayoutProps>(
   }) => {
     const id = getId(block || {});
     const router = useRouter();
+    const isFrame = isIFrame();
     const isEveryLink = tabs.every((_) => _?.type === 'link');
     const query = new URLSearchParams(decodeURIComponent(globalThis?.location?.search || ''));
     const tabId = getTabId(id);
@@ -75,7 +77,10 @@ export const TabsLayout = UniBlock<TabsLayoutProps>(
 
     return (
       <BlockWrapper
-        className={style({ [STICKY_STYLE]: [isSticky, isEveryLink].every(Boolean) }, className)} // Sticky is only used for type links
+        className={style(
+          { [STICKY_STYLE]: [isSticky, isEveryLink, !isFrame].every(Boolean) },
+          className,
+        )} // Sticky is only used for type links
         defaultPadding="p-0"
         block={block}
         {...rest}
@@ -83,7 +88,7 @@ export const TabsLayout = UniBlock<TabsLayoutProps>(
         {renderTabsLayout({
           className: style({
             'pb-1': [block?.slots, tabsType === 'default'].every(Boolean),
-            [STICKY_STYLE]: [isSticky, !isEveryLink].every(Boolean),
+            [STICKY_STYLE]: [isSticky, !isEveryLink, !isFrame].every(Boolean),
           }),
           items: getItems(tabs, tabsCounted),
           activeItem,