@redneckz/wildless-cms-uni-blocks 0.11.1 → 0.11.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (169) hide show
  1. package/bundle/blocks.schema.json +1 -1
  2. package/bundle/bundle.umd.js +15 -9
  3. package/bundle/bundle.umd.min.js +1 -1
  4. package/bundle/components/Header/Header.mobile.d.ts +2 -2
  5. package/bundle/components/Header/HeaderContent.d.ts +13 -1
  6. package/bundle/components/Header/HeaderTop.d.ts +6 -2
  7. package/bundle/components/ProductGallery/ProductGallery.mobile.d.ts +5 -0
  8. package/bundle/icons/IconName.d.ts +4 -2
  9. package/bundle/ui-kit/Heading/headingTag.d.ts +2 -0
  10. package/bundle/ui-kit/Heading/headingTag.mobile.d.ts +2 -0
  11. package/cosmos-static/icons/ChevronLeft.svg +1 -0
  12. package/dist/components/BaseTile/BaseTile.js +2 -1
  13. package/dist/components/BaseTile/BaseTile.js.map +1 -1
  14. package/dist/components/Blocks.mobile.js +4 -0
  15. package/dist/components/Blocks.mobile.js.map +1 -1
  16. package/dist/components/Header/Header.mobile.d.ts +2 -2
  17. package/dist/components/Header/Header.mobile.js +3 -17
  18. package/dist/components/Header/Header.mobile.js.map +1 -1
  19. package/dist/components/Header/HeaderContent.d.ts +13 -1
  20. package/dist/components/Header/HeaderTop.d.ts +6 -2
  21. package/dist/components/Header/HeaderTop.js +15 -2
  22. package/dist/components/Header/HeaderTop.js.map +1 -1
  23. package/dist/components/Headline/headlineVersionStyles.js +6 -6
  24. package/dist/components/Headline/headlineVersionStyles.js.map +1 -1
  25. package/dist/components/ProductGallery/ProductGallery.mobile.d.ts +5 -0
  26. package/dist/components/ProductGallery/ProductGallery.mobile.js +13 -0
  27. package/dist/components/ProductGallery/ProductGallery.mobile.js.map +1 -0
  28. package/dist/content-page-repository/transformImg.js +1 -1
  29. package/dist/content-page-repository/transformImg.js.map +1 -1
  30. package/dist/icons/IconName.d.ts +4 -2
  31. package/dist/icons/IconName.js +3 -1
  32. package/dist/icons/IconName.js.map +1 -1
  33. package/dist/ui-kit/Heading/Heading.js +5 -1
  34. package/dist/ui-kit/Heading/Heading.js.map +1 -1
  35. package/dist/ui-kit/Heading/headingTag.d.ts +2 -0
  36. package/dist/ui-kit/Heading/headingTag.js +5 -0
  37. package/dist/ui-kit/Heading/headingTag.js.map +1 -0
  38. package/dist/ui-kit/Heading/headingTag.mobile.d.ts +2 -0
  39. package/dist/ui-kit/Heading/headingTag.mobile.js +13 -0
  40. package/dist/ui-kit/Heading/headingTag.mobile.js.map +1 -0
  41. package/lib/common.css +1 -1
  42. package/lib/components/BaseTile/BaseTile.js +2 -1
  43. package/lib/components/BaseTile/BaseTile.js.map +1 -1
  44. package/lib/components/Blocks.mobile.js +4 -0
  45. package/lib/components/Blocks.mobile.js.map +1 -1
  46. package/lib/components/Header/Header.fixture.mobile.d.ts +2 -0
  47. package/lib/components/Header/Header.mobile.d.ts +2 -2
  48. package/lib/components/Header/Header.mobile.js +4 -18
  49. package/lib/components/Header/Header.mobile.js.map +1 -1
  50. package/lib/components/Header/HeaderContent.d.ts +13 -1
  51. package/lib/components/Header/HeaderTop.d.ts +6 -2
  52. package/lib/components/Header/HeaderTop.js +15 -2
  53. package/lib/components/Header/HeaderTop.js.map +1 -1
  54. package/lib/components/Headline/headlineVersionStyles.js +6 -6
  55. package/lib/components/Headline/headlineVersionStyles.js.map +1 -1
  56. package/lib/components/ProductGallery/ProductGallery.fixture.mobile.d.ts +7 -0
  57. package/lib/components/ProductGallery/ProductGallery.mobile.d.ts +5 -0
  58. package/lib/components/ProductGallery/ProductGallery.mobile.js +11 -0
  59. package/lib/components/ProductGallery/ProductGallery.mobile.js.map +1 -0
  60. package/lib/content-page-repository/transformImg.js +1 -1
  61. package/lib/content-page-repository/transformImg.js.map +1 -1
  62. package/lib/icons/IconName.d.ts +4 -2
  63. package/lib/icons/IconName.js +3 -1
  64. package/lib/icons/IconName.js.map +1 -1
  65. package/lib/ui-kit/Heading/Heading.js +5 -1
  66. package/lib/ui-kit/Heading/Heading.js.map +1 -1
  67. package/lib/ui-kit/Heading/headingTag.d.ts +2 -0
  68. package/lib/ui-kit/Heading/headingTag.js +2 -0
  69. package/lib/ui-kit/Heading/headingTag.js.map +1 -0
  70. package/lib/ui-kit/Heading/headingTag.mobile.d.ts +2 -0
  71. package/lib/ui-kit/Heading/headingTag.mobile.js +10 -0
  72. package/lib/ui-kit/Heading/headingTag.mobile.js.map +1 -0
  73. package/mobile/bundle/bundle.umd.js +120 -407
  74. package/mobile/bundle/bundle.umd.min.js +1 -1
  75. package/mobile/bundle/components/Header/Header.d.ts +2 -2
  76. package/mobile/bundle/components/Header/HeaderContent.d.ts +13 -1
  77. package/mobile/bundle/components/Header/HeaderTop.d.ts +6 -2
  78. package/mobile/bundle/icons/IconName.d.ts +4 -2
  79. package/mobile/bundle/ui-kit/Heading/headingTag.d.ts +2 -0
  80. package/mobile/dist/components/BaseTile/BaseTile.js +2 -1
  81. package/mobile/dist/components/BaseTile/BaseTile.js.map +1 -1
  82. package/mobile/dist/components/Blocks.js +4 -0
  83. package/mobile/dist/components/Blocks.js.map +1 -1
  84. package/mobile/dist/components/Header/Header.d.ts +2 -2
  85. package/mobile/dist/components/Header/Header.js +3 -17
  86. package/mobile/dist/components/Header/Header.js.map +1 -1
  87. package/mobile/dist/components/Header/HeaderContent.d.ts +13 -1
  88. package/mobile/dist/components/Header/HeaderTop.d.ts +6 -2
  89. package/mobile/dist/components/Header/HeaderTop.js +15 -2
  90. package/mobile/dist/components/Header/HeaderTop.js.map +1 -1
  91. package/mobile/dist/components/Headline/headlineVersionStyles.js +6 -6
  92. package/mobile/dist/components/Headline/headlineVersionStyles.js.map +1 -1
  93. package/mobile/dist/components/ProductGallery/ProductGallery.js +4 -17
  94. package/mobile/dist/components/ProductGallery/ProductGallery.js.map +1 -1
  95. package/mobile/dist/content-page-repository/transformImg.js +1 -1
  96. package/mobile/dist/content-page-repository/transformImg.js.map +1 -1
  97. package/mobile/dist/icons/IconName.d.ts +4 -2
  98. package/mobile/dist/icons/IconName.js +3 -1
  99. package/mobile/dist/icons/IconName.js.map +1 -1
  100. package/mobile/dist/ui-kit/Heading/Heading.js +12 -11
  101. package/mobile/dist/ui-kit/Heading/Heading.js.map +1 -1
  102. package/mobile/dist/ui-kit/Heading/headingTag.d.ts +2 -0
  103. package/mobile/dist/ui-kit/Heading/headingTag.js +13 -0
  104. package/mobile/dist/ui-kit/Heading/headingTag.js.map +1 -0
  105. package/mobile/lib/common.css +1 -1
  106. package/mobile/lib/components/BaseTile/BaseTile.js +2 -1
  107. package/mobile/lib/components/BaseTile/BaseTile.js.map +1 -1
  108. package/mobile/lib/components/Blocks.js +4 -0
  109. package/mobile/lib/components/Blocks.js.map +1 -1
  110. package/mobile/lib/components/Header/Header.d.ts +2 -2
  111. package/mobile/lib/components/Header/Header.js +4 -18
  112. package/mobile/lib/components/Header/Header.js.map +1 -1
  113. package/mobile/lib/components/Header/HeaderContent.d.ts +13 -1
  114. package/mobile/lib/components/Header/HeaderTop.d.ts +6 -2
  115. package/mobile/lib/components/Header/HeaderTop.js +15 -2
  116. package/mobile/lib/components/Header/HeaderTop.js.map +1 -1
  117. package/mobile/lib/components/Headline/headlineVersionStyles.js +6 -6
  118. package/mobile/lib/components/Headline/headlineVersionStyles.js.map +1 -1
  119. package/mobile/lib/components/ProductGallery/ProductGallery.js +5 -18
  120. package/mobile/lib/components/ProductGallery/ProductGallery.js.map +1 -1
  121. package/mobile/lib/content-page-repository/transformImg.js +1 -1
  122. package/mobile/lib/content-page-repository/transformImg.js.map +1 -1
  123. package/mobile/lib/icons/IconName.d.ts +4 -2
  124. package/mobile/lib/icons/IconName.js +3 -1
  125. package/mobile/lib/icons/IconName.js.map +1 -1
  126. package/mobile/lib/ui-kit/Heading/Heading.js +12 -11
  127. package/mobile/lib/ui-kit/Heading/Heading.js.map +1 -1
  128. package/mobile/lib/ui-kit/Heading/headingTag.d.ts +2 -0
  129. package/mobile/lib/ui-kit/Heading/headingTag.js +10 -0
  130. package/mobile/lib/ui-kit/Heading/headingTag.js.map +1 -0
  131. package/mobile/src/components/BaseTile/BaseTile.tsx +6 -3
  132. package/mobile/src/components/Blocks.ts +4 -0
  133. package/mobile/src/components/Header/Header.tsx +19 -50
  134. package/mobile/src/components/Header/HeaderContent.ts +15 -1
  135. package/mobile/src/components/Header/HeaderTop.tsx +62 -25
  136. package/mobile/src/components/Headline/headlineVersionStyles.ts +6 -6
  137. package/mobile/src/components/ProductGallery/ProductGallery.tsx +18 -59
  138. package/mobile/src/content-page-repository/transformImg.ts +1 -1
  139. package/mobile/src/icons/ChevronLeft.svg +3 -0
  140. package/mobile/src/icons/IconName.ts +5 -5
  141. package/mobile/src/ui-kit/Heading/Heading.tsx +17 -16
  142. package/mobile/src/ui-kit/Heading/headingTag.ts +12 -0
  143. package/package.json +1 -1
  144. package/src/components/BaseTile/BaseTile.tsx +6 -3
  145. package/src/components/Blocks.mobile.ts +4 -0
  146. package/src/components/Header/Header.fixture.mobile.tsx +4 -0
  147. package/src/components/Header/Header.mobile.tsx +19 -50
  148. package/src/components/Header/HeaderContent.ts +15 -1
  149. package/src/components/Header/HeaderTop.tsx +62 -25
  150. package/src/components/Headline/headlineVersionStyles.ts +6 -6
  151. package/src/components/ProductGallery/ProductGallery.fixture.mobile.tsx +142 -0
  152. package/src/components/ProductGallery/ProductGallery.mobile.tsx +34 -0
  153. package/src/content-page-repository/transformImg.ts +1 -1
  154. package/src/icons/ChevronLeft.svg +3 -0
  155. package/src/icons/IconName.ts +5 -1
  156. package/src/ui-kit/Heading/Heading.fixture.mobile.tsx +6 -6
  157. package/src/ui-kit/Heading/Heading.fixture.tsx +6 -6
  158. package/src/ui-kit/Heading/Heading.tsx +8 -3
  159. package/src/ui-kit/Heading/headingTag.mobile.ts +12 -0
  160. package/src/ui-kit/Heading/headingTag.ts +3 -0
  161. package/tailwind.config.cjs +10 -4
  162. package/bundle/ui-kit/Heading/Heading.mobile.d.ts +0 -2
  163. package/dist/ui-kit/Heading/Heading.mobile.d.ts +0 -2
  164. package/dist/ui-kit/Heading/Heading.mobile.js +0 -18
  165. package/dist/ui-kit/Heading/Heading.mobile.js.map +0 -1
  166. package/lib/ui-kit/Heading/Heading.mobile.d.ts +0 -2
  167. package/lib/ui-kit/Heading/Heading.mobile.js +0 -16
  168. package/lib/ui-kit/Heading/Heading.mobile.js.map +0 -1
  169. package/src/ui-kit/Heading/Heading.mobile.tsx +0 -22
@@ -1,34 +1,71 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
2
  import type { BgColorVersion } from '../../model/BgColorVersion';
3
3
  import type { LogoType } from '../../model/LogoType';
4
- import { Img } from '../../ui-kit/Img/Img';
5
4
  import { Logo } from '../../ui-kit/Logo/Logo';
5
+ import { Button } from '../../ui-kit/Button/Button';
6
+ import { style } from '../../utils/style';
7
+ import type { BlockVersion } from '../../model/BlockVersion';
8
+ import type { MobileHeaderProps, MobileHeaderType } from './HeaderContent';
9
+ import { Img } from '../../ui-kit/Img/Img';
6
10
 
7
- export interface HeaderTopProps {
8
- onClick: () => void;
11
+ export interface HeaderTopProps extends MobileHeaderProps {
9
12
  bgColor?: BgColorVersion;
10
13
  logo?: LogoType;
14
+ internetBankUrl?: string;
15
+ version?: BlockVersion;
16
+ mobileHeaderType?: MobileHeaderType;
11
17
  }
12
18
 
13
- export const HeaderTop = JSX<HeaderTopProps>(({ onClick, bgColor, logo }) => (
14
- <div className="flex items-center justify-between border-0 border-b border-main-divider h-12">
15
- <div className="flex items-center">
16
- <button
17
- className="pl-0 pr-4 border-0 bg-transparent cursor-pointer"
18
- onClick={onClick}
19
- aria-label="Открыть меню"
20
- >
21
- <Img
22
- image={{ icon: 'BurgerIcon', iconVersion: bgColor === 'bg-white' ? 'black' : 'white' }}
23
- className="text-primary-text w-6 h-6"
24
- width="24"
25
- height="24"
26
- />
27
- </button>
28
- <Logo className="mr-8" bgColor={bgColor} logo={logo} />
29
- </div>
30
- <button className="text-primary-main group-data-transparent:text-white group-data-transparent:hover:text-primary-hover text-s border-0 bg-transparent">
31
- Войти
32
- </button>
33
- </div>
34
- ));
19
+ const BUTTON_STYLE = {
20
+ default: 'px-5 bg-main-divider rounded hover:text-primary-main',
21
+ transparent: 'text-white hover:text-primary-hover',
22
+ };
23
+
24
+ export const HeaderTop = JSX<HeaderTopProps>(
25
+ ({
26
+ bgColor,
27
+ logo,
28
+ internetBankUrl,
29
+ version,
30
+ mobileHeaderType,
31
+ mobileTitle,
32
+ mobileBackwardButtonTitle,
33
+ }) => {
34
+ const isTypeNone = mobileHeaderType === 'none';
35
+ const isTypeWithTitle = mobileHeaderType === 'withTitle';
36
+
37
+ return (
38
+ <div className="flex items-center justify-between w-full">
39
+ {isTypeNone || isTypeWithTitle ? (
40
+ <Logo bgColor={bgColor} logo={logo} showTitle={isTypeNone} />
41
+ ) : null}
42
+ {isTypeWithTitle ? mobileTitle : null}
43
+ {mobileHeaderType === 'backwardButton' ? (
44
+ <Button className="flex items-center text-l">
45
+ <Img
46
+ className="w-6 h-6"
47
+ image={{
48
+ icon: 'ChevronLeft',
49
+ iconVersion: 'black',
50
+ }}
51
+ />
52
+ {mobileBackwardButtonTitle}
53
+ </Button>
54
+ ) : null}
55
+ {internetBankUrl ? (
56
+ <Button
57
+ href={internetBankUrl}
58
+ ariaLabel="Войти"
59
+ target="_blank"
60
+ className={style(
61
+ 'p-3 my-1 text-s whitespace-nowrap text-primary-main hover:text-primary-hover',
62
+ BUTTON_STYLE[version === 'transparent' ? 'transparent' : 'default'],
63
+ )}
64
+ >
65
+ Войти
66
+ </Button>
67
+ ) : null}
68
+ </div>
69
+ );
70
+ },
71
+ );
@@ -13,32 +13,32 @@ export const headlineVersionStyles: Record<
13
13
  XXL: {
14
14
  title: { headingType: 'h0', as: 'h1' },
15
15
  descriptionSize: 'text-h5',
16
- descriptionStyle: 'mt-5',
16
+ descriptionStyle: 'mt-headline-xxl',
17
17
  },
18
18
  XL: {
19
19
  title: { headingType: 'h1', as: 'h1' },
20
20
  descriptionSize: 'text-xl-light',
21
- descriptionStyle: 'mt-4',
21
+ descriptionStyle: 'mt-headline-l',
22
22
  },
23
23
  L: {
24
24
  title: { headingType: 'h2', as: 'h2' },
25
25
  descriptionSize: 'text-xl-light',
26
- descriptionStyle: 'mt-4',
26
+ descriptionStyle: 'mt-headline-l',
27
27
  },
28
28
  M: {
29
29
  title: { headingType: 'h3', as: 'h3' },
30
30
  descriptionSize: 'text-xl-light',
31
- descriptionStyle: 'mt-3',
31
+ descriptionStyle: 'mt-headline-m',
32
32
  },
33
33
  S: {
34
34
  title: { headingType: 'h4', as: 'h4' },
35
35
  descriptionSize: 'text-xl-light',
36
- descriptionStyle: 'mt-2',
36
+ descriptionStyle: 'mt-headline-s',
37
37
  },
38
38
  XS: {
39
39
  title: { headingType: 'h5', as: 'h5' },
40
40
  descriptionSize: 'text-l-light',
41
- descriptionStyle: 'mt-2',
41
+ descriptionStyle: 'mt-headline-s',
42
42
  },
43
43
  };
44
44
 
@@ -0,0 +1,142 @@
1
+ import type { Picture } from '../../model/Picture';
2
+ import '../../setup-fixture';
3
+ import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
4
+ import { ProductGallery } from './ProductGallery';
5
+
6
+ const percentImage: Picture = {
7
+ src: '3-6-percent.png',
8
+ format: 'webp',
9
+ size: {
10
+ width: 338,
11
+ height: 420,
12
+ },
13
+ alt: 'Ставка от 3,6% годовых',
14
+ };
15
+
16
+ const creditCard: Picture = {
17
+ src: 'credit-card-1.png',
18
+ format: 'webp',
19
+ size: {
20
+ width: 280,
21
+ height: 280,
22
+ },
23
+ };
24
+
25
+ const items = [
26
+ 'Потребительский кредит по специальной процентной ставке',
27
+ 'Получите деньги без залога и поручительства',
28
+ 'Кредитный лимит до 5 млн рублей',
29
+ ];
30
+ const buttons: ButtonWithIconProps[] = [
31
+ {
32
+ href: 'https://rshb.ru',
33
+ text: 'Подробнее',
34
+ target: '_blank',
35
+ version: 'primary',
36
+ },
37
+ ];
38
+
39
+ const buttonsSecondary: ButtonWithIconProps[] = [
40
+ {
41
+ href: 'https://rshb.ru',
42
+ text: 'Подробнее',
43
+ target: '_blank',
44
+ version: 'white',
45
+ },
46
+ ];
47
+
48
+ export default {
49
+ default: (
50
+ <div className="container grid grid-cols-12">
51
+ <ProductGallery
52
+ className="col-span-12"
53
+ slides={[
54
+ {
55
+ productBlock: {
56
+ title: 'Кредит по одному документу',
57
+ description: 'Ставка от 5,5% годовых',
58
+ headlineVersion: 'L',
59
+ items,
60
+ buttons,
61
+ image: percentImage,
62
+ },
63
+ },
64
+ {
65
+ productBlock: {
66
+ title: 'Ставка от 12,5% годовых на срок до 3 лет!',
67
+ headlineVersion: 'L',
68
+ items,
69
+ buttons,
70
+ image: creditCard,
71
+ },
72
+ },
73
+ {
74
+ productBlock: {
75
+ title: 'Дополнительные бонусные баллы за покупки!',
76
+ headlineVersion: 'L',
77
+ items,
78
+ buttons,
79
+ image: creditCard,
80
+ },
81
+ },
82
+ {
83
+ productBlock: {
84
+ title: 'Карты Unionpay',
85
+ headlineVersion: 'L',
86
+ items,
87
+ buttons,
88
+ image: creditCard,
89
+ },
90
+ },
91
+ ]}
92
+ />
93
+ </div>
94
+ ),
95
+ primary: (
96
+ <div className="container grid grid-cols-12">
97
+ <ProductGallery
98
+ className="col-span-12"
99
+ version={'secondary'}
100
+ slides={[
101
+ {
102
+ productBlock: {
103
+ title: 'Кредит по одному документу',
104
+ description: 'Кредит наличными без залога и поручительства, только по паспорту',
105
+ headlineVersion: 'L',
106
+ items,
107
+ buttons: buttonsSecondary,
108
+ image: percentImage,
109
+ },
110
+ },
111
+ {
112
+ productBlock: {
113
+ title: 'Ставка от 12,5% годовых на срок до 3 лет!',
114
+ headlineVersion: 'L',
115
+ items,
116
+ buttons: buttonsSecondary,
117
+ image: creditCard,
118
+ },
119
+ },
120
+ {
121
+ productBlock: {
122
+ title: 'Дополнительные бонусные баллы за покупки!',
123
+ headlineVersion: 'L',
124
+ items,
125
+ buttons: buttonsSecondary,
126
+ image: creditCard,
127
+ },
128
+ },
129
+ {
130
+ productBlock: {
131
+ title: 'Карты Unionpay',
132
+ headlineVersion: 'L',
133
+ items,
134
+ buttons: buttonsSecondary,
135
+ image: creditCard,
136
+ },
137
+ },
138
+ ]}
139
+ />
140
+ </div>
141
+ ),
142
+ };
@@ -0,0 +1,34 @@
1
+ import { JSX } from '@redneckz/uni-jsx';
2
+ import type { UniBlockProps } from '../../model/JSXBlock';
3
+ import { BlockWrapper } from '../../ui-kit/BlockWrapper';
4
+ import { SwipeListControl } from '../../ui-kit/SwipeListControl/SwipeListControl';
5
+ import type { ProductBlockInnerContent } from '../ProductBlock/ProductBlockContent';
6
+ import { ProductBlockInner } from '../ProductBlock/ProductBlockInner';
7
+ import type { ProductGalleryContent } from './ProductGalleryContent';
8
+
9
+ export interface ProductGalleryProps extends ProductGalleryContent, UniBlockProps {}
10
+
11
+ export const ProductGallery = JSX<ProductGalleryProps>(
12
+ ({ className = '', slides = [], ...rest }) => {
13
+ const galleryBlocks = slides.map((s) => s.productBlock);
14
+
15
+ return (
16
+ <BlockWrapper
17
+ className={`box-border py-6 overflow-hidden relative w-100 mb-6 ${className}`}
18
+ {...rest}
19
+ >
20
+ <SwipeListControl gap={0} padding={0}>
21
+ {galleryBlocks.map((_, i) => renderProductBlock({ ..._, ...rest }, i))}
22
+ </SwipeListControl>
23
+ </BlockWrapper>
24
+ );
25
+ },
26
+ );
27
+
28
+ const renderProductBlock = (block: ProductBlockInnerContent, i: number) => (
29
+ <ProductBlockInner
30
+ key={String(i)}
31
+ className="z-10 px-5 group-data-secondary:text-white"
32
+ {...block}
33
+ />
34
+ );
@@ -77,7 +77,7 @@ const computeTransformationChain = ({
77
77
  pipe(
78
78
  resizeImg(isPictureSizeEmpty(size) ? containerSize : size),
79
79
  alignImg({ containerSize, alignment }),
80
- (_) => (format ? _.toFormat(format, options) : _),
80
+ (_) => (format ? _.toFormat(format, { ...options, nearLossless: true }) : _),
81
81
  );
82
82
 
83
83
  const pipe = (...operations: Array<(chain: Sharp) => Promise<Sharp> | Sharp>) =>
@@ -0,0 +1,3 @@
1
+ <svg title="Стрелка 'Вправо'" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M14.7071 6.29289C15.0976 6.68342 15.0976 7.31658 14.7071 7.70711L10.4142 12L14.7071 16.2929C15.0976 16.6834 15.0976 17.3166 14.7071 17.7071C14.3166 18.0976 13.6834 18.0976 13.2929 17.7071L8.29289 12.7071C7.90237 12.3166 7.90237 11.6834 8.29289 11.2929L13.2929 6.29289C13.6834 5.90237 14.3166 5.90237 14.7071 6.29289Z" fill="currentColor"/>
3
+ </svg>
@@ -8,6 +8,7 @@ export const IconsWithoutInversion = new Set([
8
8
  'BriefcaseIcon',
9
9
  'CardWithGemIcon',
10
10
  'CarIcon',
11
+ 'ChevronLeft',
11
12
  'CinemaIcon',
12
13
  'ClientIcon',
13
14
  'ClockIcon',
@@ -77,6 +78,7 @@ export enum IconMap {
77
78
  CardWithGemIcon = 'CardWithGemIcon',
78
79
  CarIcon = 'CarIcon',
79
80
  ChartSquareIcon = 'ChartSquareIcon',
81
+ ChevronLeft = 'ChevronLeft',
80
82
  CinemaIcon = 'CinemaIcon',
81
83
  ClientIcon = 'ClientIcon',
82
84
  ClockIcon = 'ClockIcon',
@@ -190,6 +192,7 @@ export enum IconTitleMap {
190
192
  CardWithGemIcon = 'Карта с драгоценностями',
191
193
  CarIcon = 'Машина',
192
194
  ChartSquareIcon = 'Деньги внутри кошелька',
195
+ ChevronLeft = "Стрелка 'Вправо'",
193
196
  CinemaIcon = 'Кинотеатр',
194
197
  ClientIcon = 'Клиент',
195
198
  ClockIcon = 'Часы',
@@ -280,7 +283,7 @@ export enum IconTitleMap {
280
283
  * @title Иконка
281
284
  * @enumNames [
282
285
  * "",
283
- * 'Деньги', 'Самолёт', 'Лого «Apple»', 'Стрелка \'Вниз\'', 'Стрелка сплошная \'Вниз\'', 'Стрелка \'Влево\'', 'Стрелка \'Вправо\'', 'Стрелка \'Вверх-право\'', 'Стрелка \'Вверх\'', 'Стрелка сплошная \'Вверх\'', 'Банкомат', 'Сумка', 'Банк', 'BriefcaseIcon', 'Здание с деревом', 'Бургер', 'Календарь 2', 'Скруглённый календарь', 'Календарь', 'Календарь с галочкой', 'Машина2', 'Кред. карта', 'Кред. карта под наклоном', 'Кред. карта с галочкой', 'Карта с драгоценностями', 'Машина', 'Деньги внутри кошелька', 'Кинотеатр', 'Клиент', 'Часы', 'Крестик', 'Кресло', 'Кредитные карты', 'Скидка', 'Скачать документ', 'Документ', 'Документ (одноцветный)', 'Документы', 'Документы-2', 'Документ с текстом', 'Доллар', 'Зелёная \'галочка\' в круге', 'Зелёная \'галочка\'', 'Земля', 'Пустой кошелёк с возвратом', 'Пустой кошелёк', 'Евро', 'FullScreenIcon', 'Геолокация', 'Зеркало', 'Глобус', 'Gps', 'Сетка (белая)', 'HeadphonesIcon', 'Сердце', 'Лого «Huawei»', 'Диаграмма роста', 'Скидка', 'JCB', 'Logo', 'Лупа', 'E-mail', 'Маркер карты', 'Маркер карты РСХБ', 'MasterCard', 'Лого Метро', 'Минус', 'МИР', 'Деньги', 'Денежное страхование', 'Купюры', 'Монитор и мобильный', 'Новый документ', 'Офис', 'Лого «Одноклассники»', 'Пачка бумаги А4', 'Бизнес', 'Проценты (круг.)', 'Проценты', 'PercentIcon', 'Персональная карта', 'Телефон', 'Лого «PlayMarket»', 'Плюс', 'Щит', 'Профиль, 2 персоны', 'Профиль', 'Тыква', 'Ошибка', 'Ок', 'Рубль (круг.)', 'Сейф', 'Безопасность', 'Подписанные документы', 'Маленькие часы', 'Звук', 'Ящик с замочной скважиной', 'Лого «Telegram»', 'UnionPay', 'UserGeoLocationIcon', 'Пользователь в рамке', 'Пользователь', 'Visa', 'Лого «VK»', 'Пополнение карты', 'Кошелёк с плюсом', 'Кошелёк', 'Кошелёк с деньгами', 'Добавить продукт', 'Лого «Youtube»'
286
+ * 'Деньги', 'Самолёт', 'Лого «Apple»', 'Стрелка \'Вниз\'', 'Стрелка сплошная \'Вниз\'', 'Стрелка \'Влево\'', 'Стрелка \'Вправо\'', 'Стрелка \'Вверх-право\'', 'Стрелка \'Вверх\'', 'Стрелка сплошная \'Вверх\'', 'Банкомат', 'Сумка', 'Банк', 'BriefcaseIcon', 'Здание с деревом', 'Бургер', 'Календарь 2', 'Скруглённый календарь', 'Календарь', 'Календарь с галочкой', 'Машина2', 'Кред. карта', 'Кред. карта под наклоном', 'Кред. карта с галочкой', 'Карта с драгоценностями', 'Машина', 'Деньги внутри кошелька', 'Стрелка \'Вправо\'', 'Кинотеатр', 'Клиент', 'Часы', 'Крестик', 'Кресло', 'Кредитные карты', 'Скидка', 'Скачать документ', 'Документ', 'Документ (одноцветный)', 'Документы', 'Документы-2', 'Документ с текстом', 'Доллар', 'Зелёная \'галочка\' в круге', 'Зелёная \'галочка\'', 'Земля', 'Пустой кошелёк с возвратом', 'Пустой кошелёк', 'Евро', 'FullScreenIcon', 'Геолокация', 'Зеркало', 'Глобус', 'Gps', 'Сетка (белая)', 'HeadphonesIcon', 'Сердце', 'Лого «Huawei»', 'Диаграмма роста', 'Скидка', 'JCB', 'Logo', 'Лупа', 'E-mail', 'Маркер карты', 'Маркер карты РСХБ', 'MasterCard', 'Лого Метро', 'Минус', 'МИР', 'Деньги', 'Денежное страхование', 'Купюры', 'Монитор и мобильный', 'Новый документ', 'Офис', 'Лого «Одноклассники»', 'Пачка бумаги А4', 'Бизнес', 'Проценты (круг.)', 'Проценты', 'PercentIcon', 'Персональная карта', 'Телефон', 'Лого «PlayMarket»', 'Плюс', 'Щит', 'Профиль, 2 персоны', 'Профиль', 'Тыква', 'Ошибка', 'Ок', 'Рубль (круг.)', 'Сейф', 'Безопасность', 'Подписанные документы', 'Маленькие часы', 'Звук', 'Ящик с замочной скважиной', 'Лого «Telegram»', 'UnionPay', 'UserGeoLocationIcon', 'Пользователь в рамке', 'Пользователь', 'Visa', 'Лого «VK»', 'Пополнение карты', 'Кошелёк с плюсом', 'Кошелёк', 'Кошелёк с деньгами', 'Добавить продукт', 'Лого «Youtube»'
284
287
  * ]
285
288
  */
286
289
  export type IconName =
@@ -312,6 +315,7 @@ export type IconName =
312
315
  | 'CardWithGemIcon'
313
316
  | 'CarIcon'
314
317
  | 'ChartSquareIcon'
318
+ | 'ChevronLeft'
315
319
  | 'CinemaIcon'
316
320
  | 'ClientIcon'
317
321
  | 'ClockIcon'
@@ -7,22 +7,22 @@ export default {
7
7
  <div className="p-2 w-full h-full">
8
8
  <div className="bg-slate-100 w-full h-full">
9
9
  <div className="pb-3">
10
- <Heading headingType="h1" title="Копите в нескольких валютах" />
10
+ <Heading headingType="h1" as="h1" title="Копите в нескольких валютах" />
11
11
  </div>
12
12
  <div className="pb-3">
13
- <Heading headingType="h2" title="Копите в нескольких валютах" />
13
+ <Heading headingType="h2" as="h2" title="Копите в нескольких валютах" />
14
14
  </div>
15
15
  <div className="pb-3">
16
- <Heading headingType="h3" title="Дополнительные документы" />
16
+ <Heading headingType="h3" as="h3" title="Дополнительные документы" />
17
17
  </div>
18
18
  <div className="pb-3">
19
- <Heading headingType="h4" title="Вклады в любой валюте" />
19
+ <Heading headingType="h4" as="h4" title="Вклады в любой валюте" />
20
20
  </div>
21
21
  <div className="pb-3">
22
- <Heading headingType="h5" title="Вклады в любой валюте" />
22
+ <Heading headingType="h5" as="h5" title="Вклады в любой валюте" />
23
23
  </div>
24
24
  <div className="pb-3">
25
- <Heading headingType="h6" title="Вклады в любой валюте" />
25
+ <Heading headingType="h6" as="h6" title="Вклады в любой валюте" />
26
26
  </div>
27
27
  </div>
28
28
  </div>
@@ -7,22 +7,22 @@ export default {
7
7
  <div className="p-2 w-full h-full">
8
8
  <div className="bg-slate-100 w-full h-full">
9
9
  <div className="pb-3">
10
- <Heading headingType="h1" title="«Своя» дебетовая карта" />
10
+ <Heading headingType="h1" as="h1" title="«Своя» дебетовая карта" />
11
11
  </div>
12
12
  <div className="pb-3">
13
- <Heading headingType="h2" title="Рефинансирование кредитов" />
13
+ <Heading headingType="h2" as="h2" title="Рефинансирование кредитов" />
14
14
  </div>
15
15
  <div className="pb-3">
16
- <Heading headingType="h3" title="Потребительский кредит" />
16
+ <Heading headingType="h3" as="h3" title="Потребительский кредит" />
17
17
  </div>
18
18
  <div className="pb-3">
19
- <Heading headingType="h4" title="Курсы обмена валют" />
19
+ <Heading headingType="h4" as="h4" title="Курсы обмена валют" />
20
20
  </div>
21
21
  <div className="pb-3">
22
- <Heading headingType="h5" title="Своё Родное" />
22
+ <Heading headingType="h5" as="h5" title="Своё Родное" />
23
23
  </div>
24
24
  <div className="pb-3">
25
- <Heading headingType="h6" title="Своё Родное" />
25
+ <Heading headingType="h6" as="h6" title="Своё Родное" />
26
26
  </div>
27
27
  </div>
28
28
  </div>
@@ -1,5 +1,6 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
2
  import type { HeadingProps, HeadingType } from './HeadingProps';
3
+ import { headingTag } from './headingTag';
3
4
 
4
5
  const styles: Record<HeadingType, string> = {
5
6
  h0: 'text-h0', // 56
@@ -12,7 +13,11 @@ const styles: Record<HeadingType, string> = {
12
13
  };
13
14
 
14
15
  export const Heading = JSX<HeadingProps>(
15
- ({ className = '', headingType = 'h3', as: Tag = 'h3', title, children }) => (
16
- <Tag className={`font-sans m-0 ${styles[headingType]} ${className}`}>{title || children}</Tag>
17
- ),
16
+ ({ className = '', headingType = 'h3', as = 'h3', title, children }) => {
17
+ const Tag = headingTag(as);
18
+
19
+ return (
20
+ <Tag className={`font-sans m-0 ${styles[headingType]} ${className}`}>{title || children}</Tag>
21
+ );
22
+ },
18
23
  );
@@ -0,0 +1,12 @@
1
+ import { HeadingTagType } from './HeadingProps';
2
+
3
+ const mobileHeadingTagMap: Record<HeadingTagType, HeadingTagType> = {
4
+ h1: 'h1',
5
+ h2: 'h1',
6
+ h3: 'h2',
7
+ h4: 'h2',
8
+ h5: 'h3',
9
+ h6: 'h3',
10
+ };
11
+
12
+ export const headingTag = (tag: HeadingTagType): HeadingTagType => mobileHeadingTagMap[tag] || 'h3';
@@ -0,0 +1,3 @@
1
+ import { HeadingTagType } from './HeadingProps';
2
+
3
+ export const headingTag = (tag: HeadingTagType): HeadingTagType => tag;
@@ -42,6 +42,12 @@ module.exports = {
42
42
  sans: ['Ubuntu', ...defaultTheme.fontFamily.sans],
43
43
  mohave: ['Mohave', ...defaultTheme.fontFamily.sans],
44
44
  },
45
+ margin: {
46
+ 'headline-xxl': '1.25rem',
47
+ 'headline-l': '1rem',
48
+ 'headline-m': '0.75rem',
49
+ 'headline-s': '0.5rem',
50
+ },
45
51
  padding: {
46
52
  default: '3rem',
47
53
  },
@@ -95,16 +101,16 @@ module.exports = {
95
101
  h5: [
96
102
  '1.5rem',
97
103
  {
98
- // 24px 30px
99
- lineHeight: '1.875rem',
104
+ // 24px 34px
105
+ lineHeight: '2.125rem',
100
106
  fontWeight: '400',
101
107
  },
102
108
  ],
103
109
  'h5-light': [
104
110
  '1.5rem',
105
111
  {
106
- // 24px 30px
107
- lineHeight: '1.875rem',
112
+ // 24px 34px
113
+ lineHeight: '2.125rem',
108
114
  fontWeight: '300',
109
115
  },
110
116
  ],
@@ -1,2 +0,0 @@
1
- import type { HeadingProps } from './HeadingProps';
2
- export declare const Heading: import("@redneckz/uni-jsx").UNIComponent<HeadingProps, any, any>;
@@ -1,2 +0,0 @@
1
- import type { HeadingProps } from './HeadingProps';
2
- export declare const Heading: import("@redneckz/uni-jsx").UNIComponent<HeadingProps, any, any>;
@@ -1,18 +0,0 @@
1
- Object.defineProperty(exports, "__esModule", { value: true });
2
- exports.Heading = void 0;
3
- const jsx_runtime_1 = require("@redneckz/uni-jsx/jsx-runtime");
4
- const uni_jsx_1 = require("@redneckz/uni-jsx");
5
- const HeadingClass = {
6
- h0: 'text-m-title',
7
- h1: 'text-m-title',
8
- h2: 'text-m-title',
9
- h3: 'text-h6',
10
- h4: 'text-m-title-xs',
11
- h5: 'text-m-title-xs',
12
- h6: 'text-m-title-xs',
13
- };
14
- exports.Heading = (0, uni_jsx_1.JSX)((props) => {
15
- const { className, headingType = 'h3', title, as: Tag = 'h3' } = props;
16
- return ((0, jsx_runtime_1.jsx)(Tag, { className: `font-sans font-medium m-0 ${HeadingClass[headingType]} ${className || ''}`, children: title }));
17
- });
18
- //# sourceMappingURL=Heading.mobile.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Heading.mobile.js","sourceRoot":"","sources":["../../../src/ui-kit/Heading/Heading.mobile.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AAGxC,MAAM,YAAY,GAAgC;IAChD,EAAE,EAAE,cAAc;IAClB,EAAE,EAAE,cAAc;IAClB,EAAE,EAAE,cAAc;IAClB,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;CACtB,CAAC;AAEW,QAAA,OAAO,GAAG,IAAA,aAAG,EAAe,CAAC,KAAK,EAAE,EAAE;IACjD,MAAM,EAAE,SAAS,EAAE,WAAW,GAAG,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,GAAG,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEvE,OAAO,CACL,uBAAC,GAAG,IAAC,SAAS,EAAE,6BAA6B,YAAY,CAAC,WAAW,CAAC,IAAI,SAAS,IAAI,EAAE,EAAE,YACxF,KAAK,GACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}
@@ -1,2 +0,0 @@
1
- import type { HeadingProps } from './HeadingProps';
2
- export declare const Heading: import("@redneckz/uni-jsx").UNIComponent<HeadingProps, any, any>;
@@ -1,16 +0,0 @@
1
- import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
2
- import { JSX } from '@redneckz/uni-jsx';
3
- const HeadingClass = {
4
- h0: 'text-m-title',
5
- h1: 'text-m-title',
6
- h2: 'text-m-title',
7
- h3: 'text-h6',
8
- h4: 'text-m-title-xs',
9
- h5: 'text-m-title-xs',
10
- h6: 'text-m-title-xs',
11
- };
12
- export const Heading = JSX((props) => {
13
- const { className, headingType = 'h3', title, as: Tag = 'h3' } = props;
14
- return (_jsx(Tag, { className: `font-sans font-medium m-0 ${HeadingClass[headingType]} ${className || ''}`, children: title }));
15
- });
16
- //# sourceMappingURL=Heading.mobile.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Heading.mobile.js","sourceRoot":"","sources":["../../../src/ui-kit/Heading/Heading.mobile.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAGxC,MAAM,YAAY,GAAgC;IAChD,EAAE,EAAE,cAAc;IAClB,EAAE,EAAE,cAAc;IAClB,EAAE,EAAE,cAAc;IAClB,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,CAAe,CAAC,KAAK,EAAE,EAAE;IACjD,MAAM,EAAE,SAAS,EAAE,WAAW,GAAG,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,GAAG,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEvE,OAAO,CACL,KAAC,GAAG,IAAC,SAAS,EAAE,6BAA6B,YAAY,CAAC,WAAW,CAAC,IAAI,SAAS,IAAI,EAAE,EAAE,YACxF,KAAK,GACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}
@@ -1,22 +0,0 @@
1
- import { JSX } from '@redneckz/uni-jsx';
2
- import type { HeadingProps, HeadingType } from './HeadingProps';
3
-
4
- const HeadingClass: Record<HeadingType, string> = {
5
- h0: 'text-m-title',
6
- h1: 'text-m-title',
7
- h2: 'text-m-title',
8
- h3: 'text-h6',
9
- h4: 'text-m-title-xs',
10
- h5: 'text-m-title-xs',
11
- h6: 'text-m-title-xs',
12
- };
13
-
14
- export const Heading = JSX<HeadingProps>((props) => {
15
- const { className, headingType = 'h3', title, as: Tag = 'h3' } = props;
16
-
17
- return (
18
- <Tag className={`font-sans font-medium m-0 ${HeadingClass[headingType]} ${className || ''}`}>
19
- {title}
20
- </Tag>
21
- );
22
- });