@redneckz/wildless-cms-uni-blocks 0.3.10 → 0.3.11

package/src/components/ProductBlock/ProductBlock.fixture.tsx

@@ -1,6 +1,8 @@
 import type { Picture } from '../../model/Picture';
 import { context } from '../../setup-fixture';
 import { ProductBlock } from './ProductBlock';
+import type { Benefit } from '../BenefitsBlock/BenefitsBlockContent';
+import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 
 const image: Picture = {
   src: 'money-1.png',
@@ -12,6 +14,53 @@ const image: Picture = {
   },
 };
 
+const breadcrumbs = [
+  {
+    text: 'Главная',
+    href: '/',
+  },
+  {
+    text: 'Кредитные карты',
+    href: '/credit',
+  },
+  {
+    text: 'Кредитная карта Своя Union Pay',
+  },
+];
+
+const benefits = [
+  {
+    label: 'До 5 млн ₽',
+    description: 'Кредитный лимит',
+    icon: 'EmptyWalletIcon',
+  },
+  {
+    label: 'От 16,9%',
+    description: 'Ставка по кредиту',
+    icon: 'PercentageSquareIcon',
+  },
+  {
+    label: 'До 5 лет',
+    description: 'Срок кредитования',
+    icon: 'CalendarIcon',
+  },
+];
+
+const buttons = [
+  {
+    href: 'https://rshb.ru',
+    text: 'Оформить карту',
+    target: '_blank',
+    version: 'primary',
+  },
+  {
+    href: 'https://rshb.ru',
+    text: 'Подробнее',
+    target: '_blank',
+    version: 'secondary',
+  },
+];
+
 export default {
   default: (
     <div className="container grid grid-cols-12">
@@ -21,50 +70,9 @@ export default {
         title={'Потребительский кредит наличными'}
         headingType="h2"
         description="Кредит наличными без залога и поручительства. Потребительский кредит на любые цели. Нужен только паспорт."
-        breadcrumbs={[
-          {
-            text: 'Главная',
-            href: '/',
-          },
-          {
-            text: 'Кредитные карты',
-            href: '/credit',
-          },
-          {
-            text: 'Кредитная карта Своя Union Pay',
-          },
-        ]}
-        benefits={[
-          {
-            label: 'До 5 млн ₽',
-            description: 'Кредитный лимит',
-            icon: 'EmptyWalletIcon',
-          },
-          {
-            label: 'От 16,9%',
-            description: 'Ставка по кредиту',
-            icon: 'PercentageSquareIcon',
-          },
-          {
-            label: 'До 5 лет',
-            description: 'Срок кредитования',
-            icon: 'CalendarIcon',
-          },
-        ]}
-        buttons={[
-          {
-            href: 'https://rshb.ru',
-            text: 'Оформить карту',
-            target: '_blank',
-            version: 'primary',
-          },
-          {
-            href: 'https://rshb.ru',
-            text: 'Подробнее',
-            target: '_blank',
-            version: 'secondary',
-          },
-        ]}
+        breadcrumbs={breadcrumbs}
+        benefits={benefits as Benefit[]}
+        buttons={buttons as ButtonWithIconProps[]}
         image={image}
       />
     </div>
@@ -78,51 +86,9 @@ export default {
         headingType="h2"
         version={'secondary'}
         description="Кредит наличными без залога и поручительства. Потребительский кредит на любые цели. Нужен только паспорт."
-        breadcrumbs={[
-          {
-            text: 'Главная',
-            href: '/',
-          },
-          {
-            text: 'Кредитные карты',
-            href: '/credit',
-          },
-          {
-            text: 'Кредитная карта Своя Union Pay',
-            href: '#',
-          },
-        ]}
-        benefits={[
-          {
-            label: 'До 5 млн ₽',
-            description: 'Кредитный лимит',
-            icon: 'EmptyWalletWhiteIcon',
-          },
-          {
-            label: 'От 16,9%',
-            description: 'Ставка по кредиту',
-            icon: 'PercentageSquareWhiteIcon',
-          },
-          {
-            label: 'До 5 лет',
-            description: 'Срок кредитования',
-            icon: 'CalendarWhiteIcon',
-          },
-        ]}
-        buttons={[
-          {
-            href: 'https://rshb.ru',
-            text: 'Оформить карту',
-            target: '_blank',
-            version: 'secondary',
-          },
-          {
-            href: 'https://rshb.ru',
-            text: 'Подробнее',
-            target: '_blank',
-            version: 'primary',
-          },
-        ]}
+        breadcrumbs={breadcrumbs}
+        benefits={benefits as Benefit[]}
+        buttons={buttons as ButtonWithIconProps[]}
         image={image}
       />
     </div>
@@ -134,27 +100,14 @@ export default {
         context={context}
         title={'Оплата проходит \nв 180 странах мира'}
         headingType="h2"
-        breadcrumbs={[]}
+        breadcrumbs={breadcrumbs}
         description="Кредит наличными без залога и поручительства. Потребительский кредит на любые цели. Нужен только паспорт."
         items={[
           'Совершайте любые личные покупки',
           'Используйте корпоративную карту как обычную дебетовую, если вы ИП',
           'Расходы для бизнеса на УСН 15% позволят снизить налоговую базу',
         ]}
-        buttons={[
-          {
-            href: 'https://rshb.ru',
-            text: 'Оформить карту',
-            target: '_blank',
-            version: 'primary',
-          },
-          {
-            href: 'https://rshb.ru',
-            text: 'Подробнее',
-            target: '_blank',
-            version: 'secondary',
-          },
-        ]}
+        buttons={buttons as ButtonWithIconProps[]}
         image={image}
       />
     </div>

package/src/components/ProductBlock/ProductBlockInner.mobile.tsx

@@ -34,7 +34,7 @@ export const ProductBlockInner = JSX<ProductBlockInnerProps>(
                 <Heading
                   headingType={headingType}
                   title={title}
-                  className={`whitespace-pre-wrap max-w-[600px] ${title ? 'mb-3' : ''}`}
+                  className="whitespace-pre-wrap max-w-[600px]"
                 />
               )
             }
@@ -48,11 +48,11 @@ export const ProductBlockInner = JSX<ProductBlockInnerProps>(
               ) : null
             }
           >
-            {description ? <Description className="mb-5" description={description} /> : null}
-            {benefits?.length ? (
-              <div className="mt-5">{benefits.map((_, i) => renderBenefit(_, i, version))}</div>
+            {description ? <Description className="mt-3" description={description} /> : null}
+            {benefits?.filter((items) => items.label)?.length ? (
+              <div className="mt-3">{benefits.map((_, i) => renderBenefit(_, i, version))}</div>
             ) : null}
-            {items?.length ? <List items={items} /> : null}
+            {items?.length ? <List className="mt-3" items={items} /> : null}
           </BaseTile>
         </div>
         {renderImage(image)}

package/src/components/ProductBlock/ProductBlockInner.tsx

@@ -34,7 +34,7 @@ export const ProductBlockInner = JSX<ProductBlockInnerProps>(
                 <Heading
                   headingType={headingType}
                   title={title}
-                  className={`whitespace-pre-wrap mb-4 max-w-[600px]`}
+                  className="whitespace-pre-wrap max-w-[600px]"
                 />
               )
             }
@@ -45,10 +45,10 @@ export const ProductBlockInner = JSX<ProductBlockInnerProps>(
             }
           >
             {description && (
-              <Description className="text-m-base max-w-[600px]" description={description} />
+              <Description className="text-m-base mt-4 max-w-[600px]" description={description} />
             )}
-            {benefits?.length ? (
-              <div className="flex gap-6 mt-6 mb-3.5">
+            {benefits?.filter((items) => items.label)?.length ? (
+              <div className="flex gap-6 mt-6">
                 {benefits.map((_, i) => renderBenefit(_, i, version))}
               </div>
             ) : null}