@redneckz/wildless-cms-uni-blocks 0.3.46 → 0.3.49

package/src/components/ProductTile/ProductTile.fixture.tsx

@@ -1,9 +1,9 @@
 import { context } from '../../setup-fixture';
 
-import { ProductTile } from './ProductTile';
 import type { Picture } from '../../model/Picture';
-import type { ProductTileContent } from './ProductTileContent';
 import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
+import { ProductTile } from './ProductTile';
+import type { ProductTileContent } from './ProductTileContent';
 
 const cardWithMoney: Picture = {
   src: 'card-with-diamond.png',
@@ -57,6 +57,7 @@ const buttonsSecondary: ButtonProps[] = [
 
 export const PRODUCT_TILE: ProductTileContent = {
   title: 'Акция! “Кредит На все, что хочется!”',
+  headingType: 'h3',
   description: 'Потребительский кредит на любые цели, без залога и поручительства',
   benefits,
   buttons: buttons,
@@ -64,6 +65,7 @@ export const PRODUCT_TILE: ProductTileContent = {
 };
 export const PRODUCT_PENSION_TILE: ProductTileContent = {
   title: 'Кредит пенсионный',
+  headingType: 'h3',
   description: 'Для людей в возрасте до 75 лет',
   benefits,
   buttons: buttonsSecondary,
@@ -81,6 +83,7 @@ export default {
         context={context}
         className="col-span-6"
         title="Акция! “Пенсионный кредит”"
+        headingType="h3"
         description={'Потребительский кредит на любые цели, без залога и поручительства'}
         benefits={benefits}
         buttons={buttonsSecondary}
@@ -94,6 +97,7 @@ export default {
         context={context}
         className="col-span-8"
         title="Кредит под залог недвижимости"
+        headingType="h3"
         description={'Без переоформления залогой недвижимости на банк'}
         benefits={benefits}
         buttons={buttonsSecondary}
@@ -107,6 +111,7 @@ export default {
         context={context}
         className="col-span-4"
         title="Кредит пенсионный"
+        headingType="h3"
         description={'Для людей в возрасте до 75 лет'}
         benefits={benefits}
         buttons={buttonsSecondary}

package/src/components/ProductTile/ProductTile.tsx

@@ -6,7 +6,6 @@ import { Description } from '../../ui-kit/Description/Description';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { Img } from '../../ui-kit/Img/Img';
 import { BaseTile } from '../BaseTile/BaseTile';
-import { getTileHeadingType } from '../BaseTile/getTileHeadingType';
 import { getTileMinHeight } from '../BaseTile/getTileMinHeight';
 import { getTileRightPadding } from '../BaseTile/getTileRightPadding';
 import type { Benefit } from '../BenefitsBlock/BenefitsBlockContent';
@@ -24,6 +23,7 @@ export const ProductTile = JSX<ProductTileProps>(
     context,
     className = '',
     title,
+    headingType = 'h3',
     description,
     benefits,
     buttons,
@@ -43,7 +43,8 @@ export const ProductTile = JSX<ProductTileProps>(
           title={
             title && (
               <Heading
-                headingType={getTileHeadingType(className)}
+                headingType={headingType}
+                as="h3"
                 title={title}
                 className={`whitespace-pre-wrap max-w-[600px]`}
               />

package/src/components/ProductTile/ProductTileContent.ts

@@ -1,7 +1,7 @@
 import type { BlockVersion } from '../../model/BlockVersion';
 import type { ButtonContent } from '../../ui-kit/Button/ButtonProps';
 import type { DescriptionContent } from '../../ui-kit/Description/DescriptionContent';
-import type { HeadingContent } from '../../ui-kit/Heading/HeadingContent';
+import type { HeadingContent, HeadingTypeContent } from '../../ui-kit/Heading/HeadingContent';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
 import type { TextBenefit } from '../BenefitsBlock/BenefitsBlockContent';
 
@@ -9,6 +9,7 @@ import type { TextBenefit } from '../BenefitsBlock/BenefitsBlockContent';
  * @title Продуктовая плитка
  */
 export type ProductTileContent = HeadingContent &
+  HeadingTypeContent &
   DescriptionContent &
   ButtonContent &
   ImageContent & {

package/src/components/StepsBlock/StepsBlock.tsx

@@ -81,7 +81,7 @@ const renderStepTitle = (step: Step, i: number, isMainButton: boolean) => {
       </div>
       {step?.button?.text && !isMainButton ? (
         <Button
-          className="box-border mt-[38px] py-3 h-12 w-full max-w-[240px]"
+          className="box-border mt-8 py-3 h-12 w-full max-w-[240px]"
           version="primary"
           href="#"
         >

package/src/components/Tile/Tile.example.json

@@ -1,5 +1,6 @@
 {
   "title": "Плитка",
+  "headingType": "h3",
   "titleSize": "M",
   "description": "Описание",
   "image": {

package/src/components/Tile/Tile.fixture.tsx

@@ -29,7 +29,8 @@ const image4: Picture = {
 
 export const TILE: TileContent = {
   title: 'Кредиты',
-  items: ['до 3 млн ₽', 'до 5 лет'],
+  headingType: 'h3',
+  items: ['До 3 млн ₽', 'до 5 лет'],
   buttons: [
     {
       text: 'Подробнее',
@@ -42,6 +43,7 @@ export const TILE: TileContent = {
 
 export const TILE_PREMIUM: TileContent = {
   title: 'Премиальные продукты',
+  headingType: 'h3',
   description:
     'Выделенные зоны обслуживания и персональный финансовый консультант. Полный спектр премиальных продуктов, подчеркивающих ваш статус',
   buttons: [
@@ -68,6 +70,7 @@ export default {
         version="secondary"
         className="col-span-4"
         title="Ипотека"
+        headingType="h3"
         items={[
           'Качественные фермерские продукты напрямую от производителей',
           'Самая большая база сельских туров по России',
@@ -91,6 +94,7 @@ export default {
         context={context}
         className="col-span-6"
         title="Банковские пластиковые карты"
+        headingType="h3"
         items={['Счета в разных валютах', 'Бесплатное обслуживание', 'Кэшбэк до 15% от покупок']}
         buttons={[
           {
@@ -115,6 +119,7 @@ export default {
         context={context}
         className="col-span-12 pr-28"
         title="Экосистема «СВОЕ», созданная для людей"
+        headingType="h3"
         items={[
           'Качественные фермерские продукты напрямую от производителей',
           'Самая большая база сельских туров по России',

package/src/components/Tile/Tile.tsx

@@ -7,7 +7,6 @@ import { Heading } from '../../ui-kit/Heading/Heading';
 import { Img } from '../../ui-kit/Img/Img';
 import { List } from '../../ui-kit/List/List';
 import { BaseTile } from '../BaseTile/BaseTile';
-import { getTileHeadingType } from '../BaseTile/getTileHeadingType';
 import { getTileMinHeight } from '../BaseTile/getTileMinHeight';
 import { getTileRightPadding } from '../BaseTile/getTileRightPadding';
 import type { TileContent } from './TileContent';
@@ -25,6 +24,7 @@ export const Tile = JSX<TileProps>((props) => {
   const {
     context,
     title,
+    headingType = 'h3',
     description,
     items,
     children,
@@ -49,7 +49,7 @@ export const Tile = JSX<TileProps>((props) => {
         title={
           title && (
             <Heading
-              headingType={getTileHeadingType(className)}
+              headingType={headingType}
               as="h3"
               title={title}
               className={`whitespace-pre-wrap max-w-[600px] ${title ? 'mb-3' : ''}
@@ -66,7 +66,7 @@ export const Tile = JSX<TileProps>((props) => {
       >
         {description && (
           <Description
-            className="mt-4 max-w-[600px] text-title-new-sm font-light"
+            className="max-w-[600px] text-title-new-sm font-light"
             description={description}
           />
         )}
@@ -81,7 +81,7 @@ function renderList(items, version) {
   return items?.length ? (
     <List
       items={items}
-      itemClassName="text-title-new-sm font-light mt-2.5 first:mt-0"
+      itemClassName="text-title-2xs font-light mt-2"
       version={version === 'primary' ? 'tile' : 'tile-white'}
     />
   ) : null;

package/src/components/Tile/TileContent.ts

@@ -1,7 +1,7 @@
 import type { BlockVersion } from '../../model/BlockVersion';
 import type { ButtonContent } from '../../ui-kit/Button/ButtonProps';
 import type { DescriptionContent } from '../../ui-kit/Description/DescriptionContent';
-import type { HeadingContent } from '../../ui-kit/Heading/HeadingContent';
+import type { HeadingContent, HeadingTypeContent } from '../../ui-kit/Heading/HeadingContent';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
 import type { ListContent } from '../../ui-kit/List/ListContent';
 
@@ -9,6 +9,7 @@ import type { ListContent } from '../../ui-kit/List/ListContent';
  * @title Плитка
  */
 export type TileContent = HeadingContent &
+  HeadingTypeContent &
   DescriptionContent &
   ListContent &
   ButtonContent &

package/src/types.ts

@@ -2,7 +2,11 @@ import type { BlockContent } from './components/BlockContent';
 import type { ContentPageContext } from './components/ContentPage/ContentPageContext';
 import type { BlockVersion } from './model/BlockVersion';
 
-export type ColorPalette = 'pc' | 'bc' | 'eo' | 'eo2' | 'eo3' | 'eo4';
+/**
+ * @title Цветовая палитра
+ * @enumNames ["", "Частным клиентам", "Бизнес клиентам", "Экосистема Своё"]
+ */
+export type ColorPalette = '' | 'pc' | 'bc' | 'eo';
 
 export interface BaseBlockDef {
   type?: string;

package/src/ui-kit/Button/ButtonInner.tsx

@@ -14,7 +14,7 @@ export const ButtonInner = JSX<ButtonInnerProps>((props) => {
       {isWithText(props) ? (
         <div>
           <div className="text-m-2xs font-light text-left">{aboveText}</div>
-          <div className="text-button-sm text-left">{text}</div>
+          <div className="text-button text-left">{text}</div>
         </div>
       ) : null}
     </div>

package/src/ui-kit/List/List.fixture.tsx

@@ -34,4 +34,24 @@ export default {
       <List items={items} version="gray" isDotted={false} />
     </div>
   ),
+  'tile dotted': (
+    <div className="bg-white p-12">
+      <List items={items} version="tile" />
+    </div>
+  ),
+  'tile w/o dots': (
+    <div className="bg-white p-12">
+      <List items={items} version="tile" isDotted={false} />
+    </div>
+  ),
+  'tile white dotted': (
+    <div className="bg-primary-main p-12">
+      <List items={items} version="tile-white" />
+    </div>
+  ),
+  'tile white w/o dots': (
+    <div className="bg-primary-main p-12">
+      <List items={items} version="tile-white" isDotted={false} />
+    </div>
+  ),
 };

package/src/ui-kit/List/ListItem.tsx

@@ -15,8 +15,8 @@ const LIST_STYLE_CLASSES = {
   primary: 'rounded-full inline-block mr-3 mt-2',
   secondary: 'rounded-full inline-block mr-3 mt-2',
   gray: 'rounded-full inline-block mr-3 mt-2',
-  tile: 'rounded-full inline-block mr-4',
-  'tile-white': 'rounded-full inline-block mr-4',
+  tile: 'rounded-full inline-block mr-4 mt-3',
+  'tile-white': 'rounded-full inline-block mr-4 mt-3',
 };
 
 const LIST_DOT_STYLE_MAP: Record<ListItemVersion, string> = {