@redneckz/wildless-cms-uni-blocks 0.2.71 → 0.2.74

package/src/PromoTile.tsx

@@ -1,12 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { BaseTileContent } from './BaseTile';
+import type { PromoTileContent } from './PromoTileContent';
 import { Tile } from './Tile';
 import type { UniBlockProps } from './types';
 
-export interface PromoTileContent extends BaseTileContent {
-  date?: string;
-}
-
 export interface PromoTileProps extends PromoTileContent, UniBlockProps {}
 
 export const PromoTile = JSX<PromoTileProps>(

package/src/PromoTileContent.ts

@@ -0,0 +1,5 @@
+import type { BaseTileContent } from './BaseTileContent';
+
+export interface PromoTileContent extends BaseTileContent {
+  date?: string;
+}

package/src/StepsBlock.tsx

@@ -1,20 +1,10 @@
 import { JSX } from '@redneckz/uni-jsx';
+import type { Step, StepsBlockContent } from './StepsBlockContent';
 import type { UniBlockProps } from './types';
-import { Icon, IconName } from './ui-kit/Icon';
+import { Icon } from './ui-kit/Icon';
 import { Title } from './ui-kit/Title';
 import { joinList } from './utils/joinList';
 
-export interface Step {
-  label: string;
-  description?: string;
-  icon?: IconName;
-}
-
-export interface StepsBlockContent {
-  title?: string;
-  steps?: Step[];
-}
-
 export interface StepsBlockProps extends StepsBlockContent, UniBlockProps {}
 
 export const StepsBlock = JSX<StepsBlockProps>(({ className, title, steps }) => {

package/src/StepsBlockContent.ts

@@ -0,0 +1,12 @@
+import type { IconName } from './ui-kit/IconProps';
+
+export interface Step {
+  label: string;
+  description?: string;
+  icon?: IconName;
+}
+
+export interface StepsBlockContent {
+  title?: string;
+  steps?: Step[];
+}

package/src/TextBlock.fixture.tsx

@@ -1,6 +1,6 @@
 import { context } from './setup-fixture';
 import { TextBlock } from './TextBlock';
-import { Picture } from './types';
+import type { Picture } from './model/Picture';
 
 const image: Picture = {
   src: 'bank-card.png',

package/src/TextBlock.tsx

@@ -1,17 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps, Picture } from './types';
-import { Img } from './Img';
-
-type TextBlockVersion = 'primary' | 'secondary' | 'secondary-light';
-type TextBlockIconVersion = 'none' | 'small' | 'big';
-
-export interface TextBlockContent {
-  title?: string;
-  description?: string;
-  blockVersion?: TextBlockVersion;
-  iconVersion?: TextBlockIconVersion;
-  image?: Picture;
-}
+import type { Picture } from './model/Picture';
+import type { TextBlockContent, TextBlockVersion } from './TextBlockContent';
+import type { UniBlockProps } from './types';
+import { Img } from './ui-kit/Img';
 
 export interface TextBlockProps extends TextBlockContent, UniBlockProps {}
 
@@ -22,7 +13,7 @@ const textBlockStyleMaps: Record<
   primary: {
     background: 'bg-white',
     icon: 'bg-primary-main text-white',
-    title: 'text-base',
+    title: 'text-primary-text',
     description: 'text-secondary-text',
   },
   secondary: {
@@ -34,7 +25,7 @@ const textBlockStyleMaps: Record<
   'secondary-light': {
     background: 'bg-primary-main/10',
     icon: 'bg-primary-main text-white',
-    title: 'text-base',
+    title: 'text-primary-text',
     description: 'text-secondary-text',
   },
 };
@@ -49,7 +40,9 @@ export const TextBlock = JSX<TextBlockProps>(
         {iconVersion && iconVersion === 'small' ? renderIcon(textBlockStyleMap.icon) : null}
         {iconVersion && iconVersion === 'big' ? renderImage(image) : null}
         <div className="py-0.5">
-          {title && <div className={`font-medium mb-1 ${textBlockStyleMap.title}`}>{title}</div>}
+          {title && (
+            <div className={`font-medium text-base mb-1 ${textBlockStyleMap.title}`}>{title}</div>
+          )}
           {description && (
             <div className={`text-sm ${textBlockStyleMap.description}`}>{description}</div>
           )}

package/src/TextBlockContent.ts

@@ -0,0 +1,12 @@
+import type { Picture } from './model/Picture';
+
+export type TextBlockVersion = 'primary' | 'secondary' | 'secondary-light';
+export type TextBlockIconVersion = 'none' | 'small' | 'big';
+
+export interface TextBlockContent {
+  title?: string;
+  description?: string;
+  blockVersion?: TextBlockVersion;
+  iconVersion?: TextBlockIconVersion;
+  image?: Picture;
+}

package/src/Tile.fixture.tsx

@@ -1,7 +1,7 @@
 import { context } from './setup-fixture';
 
 import { Tile } from './Tile';
-import { Picture } from './types';
+import type { Picture } from './model/Picture';
 
 const image: Picture = {
   src: 'money-1.png',

package/src/Tile.tsx

@@ -1,10 +1,11 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { BlockVersion, UniBlockProps } from './types';
 import { BaseTile } from './BaseTile';
-import type { BaseTileContent } from './BaseTile';
+import type { BlockVersion } from './model/BlockVersion';
+import type { TileContent } from './TileContent';
+import type { UniBlockProps } from './types';
 import { getColSpan } from './utils/getColSpan';
 
-export interface TileProps extends BaseTileContent, UniBlockProps {}
+export interface TileProps extends TileContent, UniBlockProps {}
 
 const tileStyleMap: Record<BlockVersion, string> = {
   primary: 'bg-white text-primary-text',

package/src/TileContent.ts

@@ -0,0 +1,3 @@
+import type { BaseTileContent } from './BaseTileContent';
+
+export type TileContent = BaseTileContent;

package/src/common.css

@@ -7,6 +7,8 @@
   --color-primary-active: 36, 95, 52;
   --color-secondary-hover: 216, 242, 217;
   --color-secondary-active: 197, 226, 198;
+  --color-gradient-from: 141, 189, 76;
+  --color-gradient-to: 69, 172, 69;
 }
 /* Business clients | Light-Green */
 [data-theme='bc'] {
@@ -15,6 +17,8 @@
   --color-primary-active: 60, 94, 16;
   --color-secondary-hover: 232, 244, 217;
   --color-secondary-active: 216, 227, 202;
+  --color-gradient-from: 141, 189, 76; /* TODO: change color to theme bc */
+  --color-gradient-to: 69, 172, 69; /* TODO: change color to theme bc */
 }
 /* Ecosystem own | Yellow */
 [data-theme='eo'] {
@@ -23,6 +27,8 @@
   --color-primary-active: 126, 99, 12;
   --color-secondary-hover: 241, 236, 221;
   --color-secondary-active: 229, 222, 199;
+  --color-gradient-from: 141, 189, 76; /* TODO: change color to theme eo */
+  --color-gradient-to: 69, 172, 69; /* TODO: change color to theme eo */
 }
 
 @tailwind components;

package/src/content-page-repository/transformContentPage.ts

@@ -1,6 +1,7 @@
 import fs from 'fs';
 import util from 'util';
-import type { ContentPageDef, Picture } from '../types';
+import type { Picture } from '../model/Picture';
+import type { ContentPageDef } from '../types';
 import { mapJSON } from './mapJSON';
 import type { TransformationOptions } from './TransformationOptions';
 import { transformMarkdown } from './transformMarkdown';

package/src/content-page-repository/transformPicture.ts

@@ -2,7 +2,7 @@ import fs from 'fs';
 import path from 'path';
 import sharp from 'sharp';
 import util from 'util';
-import type { ImgSource, Picture } from '../types';
+import type { ImgSource, Picture } from '../model/Picture';
 import type { TransformationOptions } from './TransformationOptions';
 
 const mkdir = util.promisify(fs.mkdir);

package/src/icons/AppleIcon.svg

@@ -1,13 +1 @@
-<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <g clip-path="url(#a)">
-    <path
-      d="M19.406 12.761c-.023-3.028 2.793-4.511 2.93-4.572-1.603-2.073-4.075-2.357-4.968-2.377-2.083-.204-4.098 1.117-5.174 1.117-1.076 0-2.725-1.097-4.488-1.056-2.266.04-4.395 1.198-5.563 3.007-2.404 3.698-.618 9.124 1.694 12.09 1.145 1.464 2.496 3.09 4.259 3.028 1.717-.06 2.358-.975 4.441-.975 2.06 0 2.656.975 4.465.935 1.854-.02 3.022-1.463 4.12-2.947 1.329-1.666 1.855-3.332 1.878-3.413 0 0-3.549-1.2-3.594-4.837Zm-3.389-8.92c.916-1.037 1.557-2.419 1.374-3.841-1.35.061-3.022.833-3.984 1.829-.847.894-1.625 2.337-1.42 3.698 1.512.102 3.069-.67 4.03-1.686Z"
-      fill="#42AB44"
-    />
-  </g>
-  <defs>
-    <clipPath id="a">
-      <rect width="24" height="24" rx="6" fill="#fff" />
-    </clipPath>
-  </defs>
-</svg>
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 24"><path d="M18.406 12.761c-.023-3.028 2.793-4.511 2.93-4.572-1.603-2.073-4.075-2.357-4.968-2.377-2.083-.204-4.098 1.117-5.174 1.117-1.076 0-2.725-1.097-4.488-1.056-2.266.04-4.395 1.198-5.563 3.007-2.404 3.698-.618 9.124 1.694 12.09 1.145 1.464 2.496 3.09 4.259 3.028 1.717-.06 2.358-.975 4.441-.975 2.06 0 2.656.975 4.465.935 1.854-.02 3.022-1.463 4.12-2.947 1.329-1.666 1.855-3.332 1.878-3.413 0 0-3.549-1.2-3.594-4.837Zm-3.389-8.92c.916-1.037 1.557-2.419 1.374-3.841-1.35.061-3.022.833-3.984 1.829-.847.894-1.625 2.337-1.42 3.698 1.512.102 3.069-.67 4.03-1.686Z" fill="#42AB44"/></svg>

package/src/icons/GlassIcon.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 63 63"><g clip-path="url(#a)"><path d="M63 60.987c0-.13-.172-.259-.505-.382-3.072-.812-12.836-1.398-24.405-1.398-14.04 0-25.427.873-25.427 1.944 0 .13.172.26.505.382 3.083.812 12.837 1.399 24.406 1.399 14.04 0 25.426-.873 25.426-1.945Z" fill="#050304"/><path d="M63 60.987c0-.13-.172-.259-.505-.382-3.072-.812-12.836-1.398-24.405-1.398-14.04 0-25.427.873-25.427 1.944 0 .13.172.26.505.382 3.083.812 12.837 1.399 24.406 1.399 14.04 0 25.426-.873 25.426-1.945Z" fill="url(#b)"/><path d="M63 60.987c0-.13-.172-.259-.505-.382-3.072-.812-12.836-1.398-24.405-1.398-14.04 0-25.427.873-25.427 1.944 0 .13.172.26.505.382 3.083.812 12.837 1.399 24.406 1.399 14.04 0 25.426-.873 25.426-1.945Z" fill="#050304"/><path d="M63 60.987c0-.13-.172-.259-.505-.382-3.072-.812-12.836-1.398-24.405-1.398-14.04 0-25.427.873-25.427 1.944 0 .13.172.26.505.382 3.083.812 12.837 1.399 24.406 1.399 14.04 0 25.426-.873 25.426-1.945Z" fill="url(#c)"/><path d="M53.554 40.447a.31.31 0 0 0-.609 0l-.269 1.279a1.153 1.153 0 0 1-.89.89l-1.28.27a.31.31 0 0 0 0 .608l1.28.27c.447.093.796.443.89.89l.27 1.28a.31.31 0 0 0 .608 0l.269-1.28c.094-.447.443-.797.89-.89l1.28-.27a.31.31 0 0 0 0-.608l-1.28-.27a1.153 1.153 0 0 1-.89-.89l-.27-1.279Z" fill="#FFCA42"/><path d="M48.658 53.298H15.076a.827.827 0 0 1-.824-.824v-2.213c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213c0 .453-.371.824-.824.824Z" fill="#FA552D"/><path d="M48.658 53.298H15.076a.827.827 0 0 1-.824-.824v-2.213c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213c0 .453-.371.824-.824.824Z" fill="#42AB44"/><path d="M26.19 52.168h-.597v.552h.597v-.552Zm1.196-.42h-.598v.972h.598v-.972Zm1.195-.643h-.598v1.615h.598v-1.615Zm1.195.26h-.598v1.355h.598v-1.356Zm1.191-1.357h-.598v2.436h.598v-2.436Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.597v2.712h.597v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v1.904h.598v-1.904Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.191 0H44.7v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.597v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Z" fill="#5F1A58"/><path d="M26.19 52.168h-.597v.552h.597v-.552Zm1.196-.42h-.598v.972h.598v-.972Zm1.195-.643h-.598v1.615h.598v-1.615Zm1.195.26h-.598v1.355h.598v-1.356Zm1.191-1.357h-.598v2.436h.598v-2.436Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.597v2.712h.597v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v1.904h.598v-1.904Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.191 0H44.7v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.597v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Z" fill="#050304"/><path d="M26.19 52.168h-.597v.552h.597v-.552Zm1.196-.42h-.598v.972h.598v-.972Zm1.195-.643h-.598v1.615h.598v-1.615Zm1.195.26h-.598v1.355h.598v-1.356Zm1.191-1.357h-.598v2.436h.598v-2.436Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.597v2.712h.597v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v1.904h.598v-1.904Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.191 0H44.7v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.597v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Z" fill="url(#d)"/><path d="M48.657 53.298H40.11v-3.862h8.544c.453 0 .824.371.824.824v2.214a.82.82 0 0 1-.82.824Z" fill="#050304"/><path d="M48.657 53.298H40.11v-3.862h8.544c.453 0 .824.371.824.824v2.214a.82.82 0 0 1-.82.824Z" fill="url(#e)"/><path d="M48.657 53.298H40.11v-3.862h8.544c.453 0 .824.371.824.824v2.214a.82.82 0 0 1-.82.824Z" fill="#050304"/><path d="M48.657 53.298H40.11v-3.862h8.544c.453 0 .824.371.824.824v2.214a.82.82 0 0 1-.82.824Z" fill="url(#f)"/><path d="M54.117 57.162H20.54a.827.827 0 0 1-.824-.824v-2.213c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213a.83.83 0 0 1-.829.824Z" fill="#42AB44"/><path d="M54.117 57.162H40.43l-20.714-2.176v-.861c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213a.83.83 0 0 1-.829.824Z" fill="#050304"/><path d="M54.117 57.162H40.43l-20.714-2.176v-.861c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213a.83.83 0 0 1-.829.824Z" fill="url(#g)"/><path d="M51.198 61.021H17.616a.827.827 0 0 1-.824-.824v-2.214c0-.453.37-.824.824-.824h33.582c.453 0 .824.371.824.825v2.213a.824.824 0 0 1-.824.824Z" fill="#050304"/><path d="M51.198 61.021H17.616a.827.827 0 0 1-.824-.824v-2.214c0-.453.37-.824.824-.824h33.582c.453 0 .824.371.824.825v2.213a.824.824 0 0 1-.824.824Z" fill="url(#h)"/><path d="M51.198 61.021H17.616a.827.827 0 0 1-.824-.824v-2.214c0-.453.37-.824.824-.824h33.582c.453 0 .824.371.824.825v2.213a.824.824 0 0 1-.824.824Z" fill="#050304"/><path d="M51.198 61.021H17.616a.827.827 0 0 1-.824-.824v-2.214c0-.453.37-.824.824-.824h33.582c.453 0 .824.371.824.825v2.213a.824.824 0 0 1-.824.824Z" fill="url(#i)"/><path d="M51.198 61.021h-8.544v-3.862h8.544c.453 0 .824.371.824.825v2.213c0 .457-.37.824-.824.824Z" fill="#050304"/><path d="M51.198 61.021h-8.544v-3.862h8.544c.453 0 .824.371.824.825v2.213c0 .457-.37.824-.824.824Z" fill="url(#j)"/><path d="M51.198 61.021h-8.544v-3.862h8.544c.453 0 .824.371.824.825v2.213c0 .457-.37.824-.824.824Z" fill="#050304"/><path d="M51.198 61.021h-8.544v-3.862h8.544c.453 0 .824.371.824.825v2.213c0 .457-.37.824-.824.824Z" fill="url(#k)"/><path d="M24.704 57.763h-.598v2.658h.598v-2.658Zm1.195.334h-.597v1.99h.597v-1.99Zm1.191.614h-.597v.762h.597v-.762Zm1.196.56h-.598v1.15h.598v-1.15Zm1.195-1.137h-.598v.956h.598v-.956Zm2.386.383h-.598v1.15h.598v-1.15Z" fill="#5F1A58"/><path d="M24.704 57.763h-.598v2.658h.598v-2.658Zm1.195.334h-.597v1.99h.597v-1.99Zm1.191.614h-.597v.762h.597v-.762Zm1.196.56h-.598v1.15h.598v-1.15Zm1.195-1.137h-.598v.956h.598v-.956Zm2.386.383h-.598v1.15h.598v-1.15Z" fill="#050304"/><path d="M24.704 57.763h-.598v2.658h.598v-2.658Zm1.195.334h-.597v1.99h.597v-1.99Zm1.191.614h-.597v.762h.597v-.762Zm1.196.56h-.598v1.15h.598v-1.15Zm1.195-1.137h-.598v.956h.598v-.956Zm2.386.383h-.598v1.15h.598v-1.15Z" fill="url(#l)"/><path d="M32.922 49.437c9.144 0 16.556-7.412 16.556-16.556 0-9.143-7.413-16.556-16.556-16.556s-16.556 7.413-16.556 16.556c0 9.144 7.413 16.556 16.556 16.556Z" fill="#050304"/><path d="M32.922 49.437c9.144 0 16.556-7.412 16.556-16.556 0-9.143-7.413-16.556-16.556-16.556s-16.556 7.413-16.556 16.556c0 9.144 7.413 16.556 16.556 16.556Z" fill="url(#m)"/><mask id="n" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="14" y="16" width="34" height="34"><path d="M30.804 49.436c9.143 0 16.556-7.412 16.556-16.556 0-9.143-7.413-16.555-16.556-16.555-9.144 0-16.556 7.412-16.556 16.555 0 9.144 7.412 16.556 16.556 16.556Z" fill="#91BD65"/></mask><g mask="url(#n)"><path d="M30.804 49.436c9.143 0 16.556-7.412 16.556-16.556 0-9.143-7.413-16.555-16.556-16.555-9.144 0-16.556 7.412-16.556 16.555 0 9.144 7.412 16.556 16.556 16.556Z" fill="url(#o)"/><path d="m24.416 27.667-7.386-8.172-2.827 1.636 6.256 6.714 3.957-.178Z" fill="#FFCA42"/><path d="m24.416 27.667-7.386-8.172-2.827 1.636 6.256 6.714 3.957-.178Z" fill="url(#p)"/><mask id="q" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="17" y="19" width="28" height="28"><path d="M30.803 46.495c7.519 0 13.614-6.095 13.614-13.613S38.322 19.27 30.803 19.27c-7.518 0-13.613 6.095-13.613 13.613s6.095 13.613 13.613 13.613Z" fill="#91BD65"/></mask><g mask="url(#q)"><path d="M30.803 46.495c7.519 0 13.614-6.095 13.614-13.613S38.322 19.27 30.803 19.27c-7.518 0-13.613 6.095-13.613 13.613s6.095 13.613 13.613 13.613Z" fill="#FA552D"/><path d="M30.803 46.495c7.519 0 13.614-6.095 13.614-13.613S38.322 19.27 30.803 19.27c-7.518 0-13.613 6.095-13.613 13.613s6.095 13.613 13.613 13.613Z" fill="url(#r)"/><path d="M30.803 46.495c7.519 0 13.614-6.095 13.614-13.613S38.322 19.27 30.803 19.27c-7.518 0-13.613 6.095-13.613 13.613s6.095 13.613 13.613 13.613Z" fill="url(#s)"/><path d="M15.888 49.14h29.369l-2.3-11.803a3.147 3.147 0 0 0-3.087-2.543H21.274a3.147 3.147 0 0 0-3.087 2.543l-2.3 11.804Z" fill="#FFCA42"/><path d="M15.888 49.14h29.369l-2.3-11.803a3.147 3.147 0 0 0-3.087-2.543H21.274a3.147 3.147 0 0 0-3.087 2.543l-2.3 11.804Z" fill="url(#t)"/></g><path d="M27.029 27.451c2.39-1.986.944-5.06-2.477-2.72-3.825 2.622-.532 5.222 2.477 2.72Z" fill="#FFCA42"/><path d="M27.029 27.451c2.39-1.986.944-5.06-2.477-2.72-3.825 2.622-.532 5.222 2.477 2.72Z" fill="url(#u)"/><path d="M31.34 20.876c-7.517 0-13.613 6.096-13.613 13.613 0 1.204.157 2.37.45 3.483a13.57 13.57 0 0 1-.986-5.09c0-7.517 6.096-13.613 13.614-13.613 6.313 0 11.622 4.303 13.163 10.135-2.02-5-6.911-8.528-12.628-8.528Z" fill="#FA552D"/><path d="M31.34 20.876c-7.517 0-13.613 6.096-13.613 13.613 0 1.204.157 2.37.45 3.483a13.57 13.57 0 0 1-.986-5.09c0-7.517 6.096-13.613 13.614-13.613 6.313 0 11.622 4.303 13.163 10.135-2.02-5-6.911-8.528-12.628-8.528Z" fill="url(#v)"/><path d="M31.34 20.876c-7.517 0-13.613 6.096-13.613 13.613 0 1.204.157 2.37.45 3.483a13.57 13.57 0 0 1-.986-5.09c0-7.517 6.096-13.613 13.614-13.613 6.313 0 11.622 4.303 13.163 10.135-2.02-5-6.911-8.528-12.628-8.528Z" fill="#050304"/><path d="M31.34 20.876c-7.517 0-13.613 6.096-13.613 13.613 0 1.204.157 2.37.45 3.483a13.57 13.57 0 0 1-.986-5.09c0-7.517 6.096-13.613 13.614-13.613 6.313 0 11.622 4.303 13.163 10.135-2.02-5-6.911-8.528-12.628-8.528Z" fill="url(#w)"/></g><path d="M21.614 6.16a.425.425 0 0 0-.833 0l-.368 1.75a1.578 1.578 0 0 1-1.22 1.22l-1.75.368a.425.425 0 0 0 0 .832l1.75.368c.613.13 1.091.607 1.22 1.22l.368 1.75a.425.425 0 0 0 .833 0l.368-1.75a1.578 1.578 0 0 1 1.219-1.22l1.75-.368a.425.425 0 0 0 0-.832l-1.75-.368a1.578 1.578 0 0 1-1.22-1.22l-.367-1.75ZM8.279 39.569a.64.64 0 0 0-1.252 0l-.553 2.632a2.372 2.372 0 0 1-1.833 1.833l-2.632.553a.64.64 0 0 0 0 1.252l2.632.553c.92.194 1.64.913 1.833 1.833l.553 2.633a.64.64 0 0 0 1.252 0l.553-2.633c.194-.92.913-1.64 1.833-1.833l2.632-.553a.64.64 0 0 0 0-1.252l-2.632-.553A2.372 2.372 0 0 1 8.832 42.2l-.553-2.632Z" fill="#FFCA42"/></g><defs><linearGradient id="b" x1="12.663" y1="61.069" x2="63" y2="61.069" gradientUnits="userSpaceOnUse"><stop stop-color="#FA552D"/><stop offset=".104" stop-color="#FA552D" stop-opacity="0"/><stop offset=".81" stop-color="#5F1A58" stop-opacity="0"/><stop offset="1" stop-color="#5F1A58"/></linearGradient><linearGradient id="c" x1="63" y1="62.932" x2="12.717" y2="62.932" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".297" stop-color="#00D63C" stop-opacity="0"/><stop offset=".833" stop-color="#FA552D" stop-opacity="0"/><stop offset="1" stop-color="#FA552D"/></linearGradient><linearGradient id="d" x1="62.165" y1="54.392" x2="15.354" y2="51.029" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="e" x1="46.244" y1="51.847" x2="40.039" y2="51.847" gradientUnits="userSpaceOnUse"><stop stop-color="#5F1A58"/><stop offset="1" stop-color="#5F1A58" stop-opacity="0"/></linearGradient><linearGradient id="f" x1="54.82" y1="55.679" x2="35.901" y2="55.295" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="g" x1="75.037" y1="59.543" x2="4.274" y2="54.143" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="h" x1="16.792" y1="59.265" x2="21.944" y2="59.265" gradientUnits="userSpaceOnUse"><stop stop-color="#FA552D"/><stop offset="1" stop-color="#FA552D" stop-opacity="0"/></linearGradient><linearGradient id="i" x1="72.113" y1="63.402" x2="1.35" y2="58.002" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="j" x1="42.757" y1="59.059" x2="48.94" y2="59.059" gradientUnits="userSpaceOnUse"><stop stop-color="#5F1A58"/><stop offset="1" stop-color="#5F1A58" stop-opacity="0"/></linearGradient><linearGradient id="k" x1="57.365" y1="63.402" x2="38.447" y2="63.018" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="l" x1="36.293" y1="62.06" x2="20.623" y2="61.677" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="m" x1="55.687" y1="41.093" x2="29.024" y2="16.325" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".297" stop-color="#00D63C" stop-opacity="0"/><stop offset=".833" stop-color="#FA552D" stop-opacity="0"/><stop offset="1" stop-color="#FA552D"/></linearGradient><linearGradient id="o" x1="23.849" y1="45.931" x2="26.662" y2="14.768" gradientUnits="userSpaceOnUse"><stop stop-color="#7DC15D"/><stop offset="1" stop-color="#FEE54F"/></linearGradient><linearGradient id="p" x1="18.119" y1="22.174" x2="19.561" y2="25.265" gradientUnits="userSpaceOnUse"><stop stop-color="#FEFFCF"/><stop offset="1" stop-color="#FEFFCF" stop-opacity="0"/></linearGradient><linearGradient id="r" x1="28.215" y1="46.697" x2="28.215" y2="21.144" gradientUnits="userSpaceOnUse"><stop stop-color="#FFCA42"/><stop offset="1" stop-color="#FFCA42" stop-opacity="0"/></linearGradient><linearGradient id="s" x1="24.794" y1="25.705" x2="30.803" y2="46.495" gradientUnits="userSpaceOnUse"><stop stop-color="#7DC15D"/><stop offset="1" stop-color="#FEE54F"/></linearGradient><linearGradient id="t" x1="30.572" y1="34.794" x2="30.572" y2="40.927" gradientUnits="userSpaceOnUse"><stop stop-color="#FEFFCF"/><stop offset="1" stop-color="#FEFFCF" stop-opacity="0"/></linearGradient><linearGradient id="u" x1="24.301" y1="28.354" x2="24.919" y2="25.469" gradientUnits="userSpaceOnUse"><stop stop-color="#FEFFCF"/><stop offset="1" stop-color="#FEFFCF" stop-opacity="0"/></linearGradient><linearGradient id="v" x1="24.301" y1="20.32" x2="26.98" y2="30.005" gradientUnits="userSpaceOnUse"><stop stop-color="#5F1A58"/><stop offset="1" stop-color="#5F1A58" stop-opacity="0"/></linearGradient><linearGradient id="w" x1="59.239" y1="49.504" x2="5.149" y2="48.856" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><clipPath id="a"><path fill="#fff" d="M0 0h63v63H0z"/></clipPath></defs></svg>

package/src/icons/PlayMarketIcon.svg

@@ -1,6 +1 @@
-<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="M1 22.427V2.576C1 1.883 1.447 1.284 2.094 1L14.85 12.498 2.089 24a1.89 1.89 0 0 1-.795-.646A1.625 1.625 0 0 1 1 22.427Zm17.899-6.282-13.95 7.259 11.002-9.915 2.948 2.656Zm4.335-5.035c.237.162.428.37.561.61.133.239.203.502.205.77.002.267-.064.53-.193.771s-.317.452-.551.617l-2.964 1.542-3.241-2.922 3.24-2.92 2.944 1.532ZM4.959 1.598l13.938 7.253-2.945 2.654L4.958 1.598Z"
-    fill="#42AB44"
-  />
-</svg>
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23 23"><path d="M0 21.427V1.576C0 .883.447.284 1.094 0L13.85 11.498 1.089 23a1.89 1.89 0 0 1-.795-.646A1.625 1.625 0 0 1 0 21.427Zm17.899-6.282-13.95 7.259 11.002-9.915 2.948 2.656Zm4.335-5.035c.237.162.428.37.561.61.133.239.203.502.205.77.002.267-.064.53-.193.771s-.317.452-.551.617l-2.964 1.542-3.241-2.922 3.24-2.92 2.944 1.532ZM3.959.598l13.938 7.253-2.945 2.654L3.958.598Z" fill="#42AB44"/></svg>

package/src/index.ts

@@ -6,17 +6,10 @@ export { projectSettings } from './ProjectSettings';
 export { LikeAPI } from './api/LikeAPI';
 export { DaDataAPI } from './api/DaDataAPI';
 
-export type { HeaderContent as SitemapContent } from './Header';
+export type { SitemapContent } from './model/SitemapContent';
 
-export type {
-  BlockDef,
-  UniBlockProps,
-  ContentPageMeta,
-  ContentPageDef,
-  Img,
-  ImgSource,
-  Picture,
-} from './types';
+export type { Img, ImgSource, Picture } from './model/Picture';
+export type { BlockDef, UniBlockProps, ContentPageMeta, ContentPageDef } from './types';
 export type {
   ContentPageContext,
   Router,
@@ -33,7 +26,7 @@ export { ContentPage } from './ContentPage';
 export { toMobilePage } from './toMobilePage';
 
 export { Blocks } from './Blocks';
-export type { BlockContent } from './Blocks';
+export type { BlockContent } from './BlockContent';
 export { MobileBlocks } from './MobileBlocks';
 
 export * as url from './utils/url';

package/src/mergeTopItems.ts

@@ -1,13 +1,13 @@
-import type { TopMenuItem } from './types';
+import type { LinkContent } from './model/LinkContent';
 
-const cmp = (a?: TopMenuItem) => (b?: TopMenuItem) => a?.href === b?.href;
+const cmp = (a?: LinkContent) => (b?: LinkContent) => a?.href === b?.href;
 
-const substitute = (items?: TopMenuItem[], substitution?: TopMenuItem[]) =>
+const substitute = <L extends LinkContent>(items?: L[], substitution?: L[]): L[] =>
   (items || []).map((_) => substitution?.find(cmp(_)) || _);
 
-const subtract = (minuend?: TopMenuItem[], subtrahend?: TopMenuItem[]) =>
+const subtract = <L extends LinkContent>(minuend?: L[], subtrahend?: L[]): L[] =>
   (minuend || []).filter((_) => !subtrahend?.find(cmp(_)));
 
-export function mergeTopItems(left?: TopMenuItem[], right?: TopMenuItem[]): TopMenuItem[] {
+export function mergeTopItems<L extends LinkContent>(left?: L[], right?: L[]): L[] {
   return substitute(left, right).concat(subtract(right, left));
 }

package/src/model/BlockVersion.ts

@@ -0,0 +1 @@
+export type BlockVersion = 'primary' | 'secondary';

package/src/model/ButtonVersion.ts

@@ -0,0 +1 @@
+export type ButtonVersion = 'primary' | 'secondary';

package/src/model/GalleryVersion.ts

@@ -0,0 +1 @@
+export type GalleryVersion = 'normal' | 'mini';

package/src/model/LinkContent.ts

@@ -0,0 +1,5 @@
+export interface LinkContent {
+  text?: string;
+  href?: string;
+  target?: '_blank' | '_self' | '_parent' | '_top' | string;
+}

package/src/model/Picture.ts

@@ -0,0 +1,19 @@
+export interface Img {
+  src: string;
+  alt?: string;
+  title?: string;
+}
+
+export interface ImgSource {
+  src: string;
+  format?: 'jpeg' | 'jpg' | 'png' | 'gif' | 'webp' | 'heif' | 'avif';
+  options?: Record<string, any>;
+  size?: {
+    width?: number;
+    height?: number;
+  };
+}
+
+export interface Picture extends Img, ImgSource {
+  sources?: ImgSource[];
+}

package/src/model/SitemapContent.ts

@@ -0,0 +1,9 @@
+import { LinkContent } from '../model/LinkContent';
+
+export interface TopMenuItem extends LinkContent {
+  items?: LinkContent[];
+}
+
+export interface SitemapContent {
+  topItems?: TopMenuItem[];
+}

package/src/types.ts

@@ -1,21 +1,9 @@
-import type {
-  AvifOptions,
-  FormatEnum,
-  GifOptions,
-  HeifOptions,
-  JpegOptions,
-  PngOptions,
-  ResizeOptions,
-  TiffOptions,
-  WebpOptions,
-} from 'sharp';
-import type { BlockContent } from './Blocks';
+import type { BlockContent } from './BlockContent';
 import type { ContentPageContext } from './ContentPageContext';
+import type { BlockVersion } from './model/BlockVersion';
 
 export type ColorPalette = 'pc' | 'bc' | 'eo';
 
-export type BlockVersion = 'primary' | 'secondary';
-export type ButtonVersion = 'primary' | 'secondary';
 export interface BlockDef {
   type: string;
   style?: string[];
@@ -43,53 +31,11 @@ export interface ContentPageDef extends ContentPageMeta {
   colorPalette?: ColorPalette;
 }
 
-export interface Img {
-  src: string;
-  alt?: string;
-  title?: string;
-}
-
-export interface ImgSource {
-  src: string;
-  format?: keyof FormatEnum;
-  options?:
-    | JpegOptions
-    | PngOptions
-    | WebpOptions
-    | AvifOptions
-    | HeifOptions
-    | GifOptions
-    | TiffOptions;
-  size?: ResizeOptions;
-}
-
-export interface Picture extends Img, ImgSource {
-  sources?: ImgSource[];
-}
-
 export interface UniBlockProps {
   className?: string;
   context: ContentPageContext;
 }
 
-export interface ContactInfo {
-  text: string;
-  type: 'tel' | 'email';
-  description: string;
-}
-
-export interface LinkContent {
-  text?: string;
-  href?: string;
-  target?: '_blank' | '_self' | '_parent' | '_top' | string;
-}
-
-export type NavMenuItem = LinkContent;
-
-export interface TopMenuItem extends NavMenuItem {
-  items?: NavMenuItem[];
-}
-
 export interface DaDataResult {
   suggestions?: DaDataSuggestion<DaDataAddress>[];
 }

package/src/ui-kit/ArrowButton.tsx

@@ -1,33 +1,32 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { Button } from './Button';
+import { ButtonProps } from './ButtonProps';
+import { SVG } from './SVG';
 
-export interface ArrowButtonProps {
-  onClick?: () => void;
-  ariaLabel?: string;
-  className?: string;
-}
+const ARROW_PATHS = [
+  {
+    d: 'm9 12 4-4-4-4',
+    stroke: 'currentColor',
+    strokeWidth: '2',
+    strokeLinecap: 'round',
+    fill: 'none',
+  },
+  {
+    d: 'M2 9a1 1 0 0 1 0-2v2Zm6-2a1 1 0 0 1 0 2V7ZM2 7h6v2H2V7Z',
+  },
+];
 
-export const ArrowButton = JSX<ArrowButtonProps>(({ className, onClick, ariaLabel }) => {
-  return (
-    <button
-      className={`${className} border-none no-underline w-12 h-12 rounded-3xl bg-white flex text-black hover:text-primary-main`}
-      style={{ boxShadow: '0px 4px 25px rgba(0, 0, 0, 0.07)' }}
-      onClick={onClick}
-      aria-label={ariaLabel}
-    >
-      <svg
-        className="m-auto"
-        width="16"
-        height="16"
-        viewBox="0 0 16 16"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <path d="M7 12L3 8L7 4" stroke="currentColor" strokeWidth="2" strokeLinecap="round" />
-        <path
-          d="M14 9C14.5523 9 15 8.55228 15 8C15 7.44772 14.5523 7 14 7L14 9ZM8 7C7.44772 7 7 7.44772 7 8C7 8.55229 7.44772 9 8 9L8 7ZM14 7L8 7L8 9L14 9L14 7Z"
-          fill="currentColor"
-        />
-      </svg>
-    </button>
-  );
-});
+export const ArrowButton = JSX<ButtonProps>(({ className, disabled, ...rest }) => (
+  <Button
+    rounded
+    className={`shadow-[0_4px_25px_rgba(0,0,0,0.07)] w-12 h-12 min-h-12 max-h-12 flex items-center justify-center ${
+      disabled
+        ? 'bg-secondary-light text-secondary-text'
+        : 'bg-white text-primary-text hover:text-primary-main'
+    } ${className || ''}`}
+    disabled={disabled}
+    {...rest}
+  >
+    <SVG paths={ARROW_PATHS} viewBox="0 0 16 16" fill="none" width="16" height="16" />
+  </Button>
+));

package/src/ui-kit/Breadcrumb.tsx

@@ -1,5 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { LinkContent } from '../types';
+import type { LinkContent } from '../model/LinkContent';
 
 export interface BreadcrumbProps extends LinkContent {
   className?: string;

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

@@ -1,7 +1,7 @@
 import '../setup-fixture';
 
 import { Button } from './Button';
-import { IconButton } from './IconButton';
+import { Icon } from './Icon';
 
 export default {
   all: (
@@ -64,21 +64,49 @@ export default {
       <div>
         <p>With Icon</p>
         <div className="flex gap-6" data-theme="pc">
-          <IconButton
+          <Button
             href="https://www.rshb.ru/"
             target="_blank"
             aboveText="Доступно в"
+            appendLeft={
+              /** Div need for perfect pixel */
+              <div>
+                <Icon name="PlayMarketIcon" width="24" height="24" />
+              </div>
+            }
             text="Google Play"
             version="secondary"
-            icon="PlayMarketIcon"
           />
-          <IconButton
+          <Button
             href="https://www.rshb.ru/"
             target="_blank"
             aboveText="Загрузите в"
+            appendLeft={
+              <div>
+                <Icon name="AppleIcon" width="24" height="24" />
+              </div>
+            }
             text="App Store"
             version="secondary"
-            icon="AppleIcon"
+          />
+        </div>
+      </div>
+      <div>
+        <p>Rounded with only Icon</p>
+        <div className="flex gap-6" data-theme="pc">
+          <Button
+            rounded
+            href="https://www.rshb.ru/"
+            target="_blank"
+            version="secondary"
+            appendLeft={<Icon name="PlayMarketIcon" width="20" height="21" />}
+          />
+          <Button
+            rounded
+            href="https://www.rshb.ru/"
+            target="_blank"
+            version="secondary"
+            appendLeft={<Icon name="AppleIcon" width="18" height="20" />}
           />
         </div>
       </div>