@redneckz/wildless-cms-uni-blocks 0.6.30 → 0.6.31

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 (133) hide show
  1. package/bundle/blocks.schema.json +1 -1
  2. package/bundle/bundle.umd.js +15 -13
  3. package/bundle/bundle.umd.min.js +1 -1
  4. package/bundle/components/Carousel/CarouselContainer.d.ts +2 -1
  5. package/bundle/components/Carousel/CarouselContent.d.ts +9 -2
  6. package/bundle/components/ComparisonTable/ComparisonTableRows.d.ts +2 -2
  7. package/bundle/components/ProductBlock/ProductBlockContent.d.ts +6 -0
  8. package/bundle/hooks/useCarouselControls.d.ts +13 -0
  9. package/dist/components/Carousel/Carousel.js +3 -3
  10. package/dist/components/Carousel/Carousel.js.map +1 -1
  11. package/dist/components/Carousel/CarouselContainer.d.ts +2 -1
  12. package/dist/components/Carousel/CarouselContainer.js +1 -1
  13. package/dist/components/Carousel/CarouselContainer.js.map +1 -1
  14. package/dist/components/Carousel/CarouselContent.d.ts +9 -2
  15. package/dist/components/Carousel/CarouselContent.js +3 -0
  16. package/dist/components/Carousel/CarouselContent.js.map +1 -1
  17. package/dist/components/ComparisonTable/ComparisonTableBody.js +2 -2
  18. package/dist/components/ComparisonTable/ComparisonTableBody.js.map +1 -1
  19. package/dist/components/ComparisonTable/ComparisonTableRows.d.ts +2 -2
  20. package/dist/components/ComparisonTable/ComparisonTableRows.js +1 -1
  21. package/dist/components/ComparisonTable/ComparisonTableRows.js.map +1 -1
  22. package/dist/components/ProductBlock/ProductBlockContent.d.ts +6 -0
  23. package/dist/components/ProductBlock/ProductBlockInner.js +5 -3
  24. package/dist/components/ProductBlock/ProductBlockInner.js.map +1 -1
  25. package/dist/components/TariffsTable/TariffsTable.js +3 -3
  26. package/dist/components/TariffsTable/TariffsTable.js.map +1 -1
  27. package/dist/hooks/useCarouselControls.d.ts +13 -0
  28. package/{mobile/dist/hooks/useCarousel.js → dist/hooks/useCarouselControls.js} +6 -6
  29. package/dist/hooks/useCarouselControls.js.map +1 -0
  30. package/dist/ui-kit/InnerTable/InnerTableHeader.js +2 -2
  31. package/dist/ui-kit/InnerTable/InnerTableHeader.js.map +1 -1
  32. package/lib/common.css +1 -1
  33. package/lib/components/Carousel/Carousel.js +3 -3
  34. package/lib/components/Carousel/Carousel.js.map +1 -1
  35. package/lib/components/Carousel/CarouselContainer.d.ts +2 -1
  36. package/lib/components/Carousel/CarouselContainer.js +1 -1
  37. package/lib/components/Carousel/CarouselContainer.js.map +1 -1
  38. package/lib/components/Carousel/CarouselContent.d.ts +9 -2
  39. package/lib/components/Carousel/CarouselContent.js +3 -0
  40. package/lib/components/Carousel/CarouselContent.js.map +1 -1
  41. package/lib/components/ComparisonTable/ComparisonTableBody.js +2 -2
  42. package/lib/components/ComparisonTable/ComparisonTableBody.js.map +1 -1
  43. package/lib/components/ComparisonTable/ComparisonTableRows.d.ts +2 -2
  44. package/lib/components/ComparisonTable/ComparisonTableRows.js +1 -1
  45. package/lib/components/ComparisonTable/ComparisonTableRows.js.map +1 -1
  46. package/lib/components/ProductBlock/ProductBlockContent.d.ts +6 -0
  47. package/lib/components/ProductBlock/ProductBlockInner.js +5 -3
  48. package/lib/components/ProductBlock/ProductBlockInner.js.map +1 -1
  49. package/lib/components/TariffsTable/TariffsTable.js +3 -3
  50. package/lib/components/TariffsTable/TariffsTable.js.map +1 -1
  51. package/lib/hooks/useCarouselControls.d.ts +13 -0
  52. package/lib/hooks/{useCarousel.js → useCarouselControls.js} +4 -4
  53. package/lib/hooks/useCarouselControls.js.map +1 -0
  54. package/lib/ui-kit/InnerTable/InnerTableHeader.js +2 -2
  55. package/lib/ui-kit/InnerTable/InnerTableHeader.js.map +1 -1
  56. package/mobile/bundle/bundle.umd.js +1 -1
  57. package/mobile/bundle/bundle.umd.min.js +1 -1
  58. package/mobile/bundle/components/Carousel/CarouselContainer.d.ts +2 -1
  59. package/mobile/bundle/components/Carousel/CarouselContent.d.ts +9 -2
  60. package/mobile/bundle/components/ComparisonTable/ComparisonTableRows.d.ts +2 -2
  61. package/mobile/bundle/components/ProductBlock/ProductBlockContent.d.ts +6 -0
  62. package/mobile/bundle/hooks/useCarouselControls.d.ts +13 -0
  63. package/mobile/dist/components/Carousel/Carousel.js +3 -3
  64. package/mobile/dist/components/Carousel/Carousel.js.map +1 -1
  65. package/mobile/dist/components/Carousel/CarouselContainer.d.ts +2 -1
  66. package/mobile/dist/components/Carousel/CarouselContainer.js +1 -1
  67. package/mobile/dist/components/Carousel/CarouselContainer.js.map +1 -1
  68. package/mobile/dist/components/Carousel/CarouselContent.d.ts +9 -2
  69. package/mobile/dist/components/Carousel/CarouselContent.js +3 -0
  70. package/mobile/dist/components/Carousel/CarouselContent.js.map +1 -1
  71. package/mobile/dist/components/ComparisonTable/ComparisonTableBody.js +2 -2
  72. package/mobile/dist/components/ComparisonTable/ComparisonTableBody.js.map +1 -1
  73. package/mobile/dist/components/ComparisonTable/ComparisonTableRows.d.ts +2 -2
  74. package/mobile/dist/components/ComparisonTable/ComparisonTableRows.js +1 -1
  75. package/mobile/dist/components/ComparisonTable/ComparisonTableRows.js.map +1 -1
  76. package/mobile/dist/components/ProductBlock/ProductBlockContent.d.ts +6 -0
  77. package/mobile/dist/hooks/useCarouselControls.d.ts +13 -0
  78. package/{dist/hooks/useCarousel.js → mobile/dist/hooks/useCarouselControls.js} +6 -6
  79. package/mobile/dist/hooks/useCarouselControls.js.map +1 -0
  80. package/mobile/dist/ui-kit/InnerTable/InnerTableHeader.js +2 -2
  81. package/mobile/dist/ui-kit/InnerTable/InnerTableHeader.js.map +1 -1
  82. package/mobile/lib/components/Carousel/Carousel.js +3 -3
  83. package/mobile/lib/components/Carousel/Carousel.js.map +1 -1
  84. package/mobile/lib/components/Carousel/CarouselContainer.d.ts +2 -1
  85. package/mobile/lib/components/Carousel/CarouselContainer.js +1 -1
  86. package/mobile/lib/components/Carousel/CarouselContainer.js.map +1 -1
  87. package/mobile/lib/components/Carousel/CarouselContent.d.ts +9 -2
  88. package/mobile/lib/components/Carousel/CarouselContent.js +3 -0
  89. package/mobile/lib/components/Carousel/CarouselContent.js.map +1 -1
  90. package/mobile/lib/components/ComparisonTable/ComparisonTableBody.js +2 -2
  91. package/mobile/lib/components/ComparisonTable/ComparisonTableBody.js.map +1 -1
  92. package/mobile/lib/components/ComparisonTable/ComparisonTableRows.d.ts +2 -2
  93. package/mobile/lib/components/ComparisonTable/ComparisonTableRows.js +1 -1
  94. package/mobile/lib/components/ComparisonTable/ComparisonTableRows.js.map +1 -1
  95. package/mobile/lib/components/ProductBlock/ProductBlockContent.d.ts +6 -0
  96. package/mobile/lib/hooks/useCarouselControls.d.ts +13 -0
  97. package/mobile/lib/hooks/{useCarousel.js → useCarouselControls.js} +4 -4
  98. package/mobile/lib/hooks/useCarouselControls.js.map +1 -0
  99. package/mobile/lib/ui-kit/InnerTable/InnerTableHeader.js +2 -2
  100. package/mobile/lib/ui-kit/InnerTable/InnerTableHeader.js.map +1 -1
  101. package/mobile/src/components/Carousel/Carousel.tsx +3 -4
  102. package/mobile/src/components/Carousel/CarouselContainer.tsx +3 -2
  103. package/mobile/src/components/Carousel/CarouselContent.ts +10 -2
  104. package/mobile/src/components/ComparisonTable/ComparisonTableBody.tsx +2 -2
  105. package/mobile/src/components/ComparisonTable/ComparisonTableRows.tsx +3 -3
  106. package/mobile/src/components/ProductBlock/ProductBlockContent.ts +6 -0
  107. package/mobile/src/hooks/{useCarousel.ts → useCarouselControls.ts} +5 -9
  108. package/mobile/src/ui-kit/InnerTable/InnerTableHeader.tsx +9 -2
  109. package/package.json +1 -1
  110. package/src/components/Carousel/Carousel.fixture.tsx +3 -3
  111. package/src/components/Carousel/Carousel.tsx +3 -4
  112. package/src/components/Carousel/CarouselContainer.tsx +3 -2
  113. package/src/components/Carousel/CarouselContent.ts +10 -2
  114. package/src/components/CarouselCard/CarouselCard.fixture.tsx +3 -6
  115. package/src/components/ComparisonTable/ComparisonTableBody.tsx +2 -2
  116. package/src/components/ComparisonTable/ComparisonTableRows.tsx +3 -3
  117. package/src/components/ProductBlock/ProductBlock.fixture.tsx +1 -0
  118. package/src/components/ProductBlock/ProductBlockContent.ts +6 -0
  119. package/src/components/ProductBlock/ProductBlockInner.tsx +8 -3
  120. package/src/components/TariffsTable/TariffsTable.tsx +5 -7
  121. package/src/hooks/{useCarousel.ts → useCarouselControls.ts} +5 -9
  122. package/src/model/.CarouselCardVersion.ts.icloud +0 -0
  123. package/src/ui-kit/InnerTable/InnerTableHeader.tsx +9 -2
  124. package/bundle/hooks/useCarousel.d.ts +0 -14
  125. package/dist/hooks/useCarousel.d.ts +0 -14
  126. package/dist/hooks/useCarousel.js.map +0 -1
  127. package/lib/hooks/useCarousel.d.ts +0 -14
  128. package/lib/hooks/useCarousel.js.map +0 -1
  129. package/mobile/bundle/hooks/useCarousel.d.ts +0 -14
  130. package/mobile/dist/hooks/useCarousel.d.ts +0 -14
  131. package/mobile/dist/hooks/useCarousel.js.map +0 -1
  132. package/mobile/lib/hooks/useCarousel.d.ts +0 -14
  133. package/mobile/lib/hooks/useCarousel.js.map +0 -1
@@ -1,5 +1,5 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
- import { useCarouselControl } from '../../hooks/useCarousel';
2
+ import { useCarouselControls } from '../../hooks/useCarouselControls';
3
3
  import { ComparisonTableColumnHeaders } from './ComparisonTableColumnHeaders';
4
4
  import type { Column, RowHeader } from './ComparisonTableContent';
5
5
  import { ComparisonTableRows } from './ComparisonTableRows';
@@ -26,7 +26,7 @@ export const ComparisonTableBody = JSX<ComparisonTableBodyProps>(
26
26
 
27
27
  const isScrollAvailable = colData.length > COLS_LENGTH_FOR_SCROLL;
28
28
 
29
- const [activeIndex, controls] = useCarouselControl({
29
+ const [activeIndex, controls] = useCarouselControls({
30
30
  itemsCount: colData.length,
31
31
  visibleItemCount: COLS_LENGTH_FOR_SCROLL,
32
32
  });
@@ -1,15 +1,15 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
+ import type { CarouselControls } from '../../hooks/useCarouselControls';
2
3
  import type { TitleProps } from '../../model/HeadlineType';
4
+ import { renderArrows } from '../../ui-kit/Button/renderArrows';
3
5
  import type { CellData } from './ComparisonTableContent';
4
6
  import { TableRow } from './TableRow';
5
- import type { Controls } from '../../hooks/useCarousel';
6
- import { renderArrows } from '../../ui-kit/Button/renderArrows';
7
7
 
8
8
  type ComparisonTableRowsProps = {
9
9
  rowData: { header: TitleProps; data: CellData[][] }[];
10
10
  activeCardIndex: number;
11
11
  isColoredFirstColumn: boolean;
12
- controls: Controls;
12
+ controls: CarouselControls;
13
13
  isScrollAvailable: boolean;
14
14
  };
15
15
 
@@ -25,6 +25,12 @@ export type ProductBlockInnerContent = HeadlineProps &
25
25
  * }
26
26
  */
27
27
  image?: Picture;
28
+ /**
29
+ * @title Количество преимуществ в строке
30
+ * @default 3
31
+ * @enumNames ["2", "3"]
32
+ */
33
+ benefitsCountOfRow?: 2 | 3;
28
34
  /**
29
35
  * @title Список преимуществ
30
36
  * @minItems 2
@@ -1,8 +1,6 @@
1
1
  import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
2
2
 
3
- export type CarouselControlProps = [number, Controls];
4
-
5
- export interface Controls {
3
+ export interface CarouselControls {
6
4
  inc: () => void;
7
5
  dec: () => void;
8
6
  canInc: boolean;
@@ -15,23 +13,22 @@ interface CarouselProps {
15
13
  isCyclic?: boolean;
16
14
  }
17
15
 
18
- export const useCarouselControl = ({
16
+ export const useCarouselControls = ({
19
17
  itemsCount,
20
18
  visibleItemCount = itemsCount,
21
19
  isCyclic,
22
- }: CarouselProps): Required<CarouselControlProps> => {
20
+ }: CarouselProps): [number, CarouselControls] => {
23
21
  const [activeIndex, setActiveIndex] = useState(0);
24
22
 
25
23
  const inc = useCallback(
26
24
  () =>
27
25
  setActiveIndex((_) => (isCyclic ? (_ + 1) % itemsCount : Math.min(_ + 1, itemsCount - 1))),
28
- [],
26
+ [isCyclic, itemsCount],
29
27
  );
30
-
31
28
  const dec = useCallback(
32
29
  () =>
33
30
  setActiveIndex((_) => (isCyclic ? (itemsCount + _ - 1) % itemsCount : Math.max(_ - 1, 0))),
34
- [],
31
+ [isCyclic, itemsCount],
35
32
  );
36
33
 
37
34
  const isScrollAvailable = itemsCount > visibleItemCount;
@@ -40,7 +37,6 @@ export const useCarouselControl = ({
40
37
  const canInc =
41
38
  isCyclicAndScrollAvailable ||
42
39
  (isScrollAvailable && itemsCount - activeIndex > visibleItemCount);
43
-
44
40
  const canDec = isCyclicAndScrollAvailable || Boolean(isScrollAvailable && activeIndex > 0);
45
41
 
46
42
  return [
@@ -1,6 +1,6 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
2
  import { Button } from '../Button/Button';
3
- import { Img } from '../Img/Img';
3
+ import { Icon } from '../Icon/Icon';
4
4
 
5
5
  export interface InnerTableHeaderProps {
6
6
  currencies?: string[];
@@ -33,7 +33,14 @@ export const InnerTableHeader = JSX<InnerTableHeaderProps>(
33
33
  version="secondary"
34
34
  target="_blank"
35
35
  appendLeft={
36
- <Img image="DocDownloadIcon" className="mr-0.5" width="20" height="20" asSVG />
36
+ <Icon
37
+ name="DocDownloadIcon"
38
+ iconVersion="color"
39
+ className="mr-0.5"
40
+ width="20"
41
+ height="20"
42
+ asSVG
43
+ />
37
44
  }
38
45
  text="Скачать в PDF"
39
46
  />
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@redneckz/wildless-cms-uni-blocks",
3
- "version": "0.6.30",
3
+ "version": "0.6.31",
4
4
  "private": false,
5
5
  "license": "MIT",
6
6
  "author": "ЦК",
@@ -23,7 +23,7 @@ export default {
23
23
  <Carousel
24
24
  className="col-span-12"
25
25
  cardFullViewCount={1}
26
- cardWidth={1200}
26
+ cardWidth="1007"
27
27
  isBlur={false}
28
28
  isCyclic={true}
29
29
  block={{ type: 'Carousel', blocks: new Array(2).fill(CARD).flat() }}
@@ -37,7 +37,7 @@ export default {
37
37
  <Carousel
38
38
  className="col-span-12"
39
39
  cardFullViewCount={3}
40
- cardWidth={350}
40
+ cardWidth="350"
41
41
  isBlur={true}
42
42
  isCyclic={false}
43
43
  block={{ type: 'Carousel', blocks: new Array(5).fill(CARD_MINI).flat() }}
@@ -58,7 +58,7 @@ export default {
58
58
  <Carousel
59
59
  className="col-span-12"
60
60
  cardFullViewCount={3}
61
- cardWidth={322}
61
+ cardWidth="322"
62
62
  isBlur={true}
63
63
  isCyclic={false}
64
64
  block={{ type: 'Carousel', blocks: new Array(5).fill(TARIFFS_CARD).flat() }}
@@ -1,5 +1,5 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
- import { useCarouselControl } from '../../hooks/useCarousel';
2
+ import { useCarouselControls } from '../../hooks/useCarouselControls';
3
3
  import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
4
4
  import { BlockWrapper } from '../../ui-kit/BlockWrapper';
5
5
  import { renderArrows } from '../../ui-kit/Button/renderArrows';
@@ -12,7 +12,7 @@ export const Carousel: JSXBlock<CarouselProps> = JSX<CarouselProps>(
12
12
  ({
13
13
  cardFullViewCount = 1,
14
14
  children,
15
- cardWidth = 1007,
15
+ cardWidth = '1007',
16
16
  className = '',
17
17
  isBlur = true,
18
18
  isCyclic = false,
@@ -26,12 +26,11 @@ export const Carousel: JSXBlock<CarouselProps> = JSX<CarouselProps>(
26
26
 
27
27
  const isScrollAvailable = childBlocksLength > cardFullViewCount;
28
28
 
29
- const [activeIndex, controls] = useCarouselControl({
29
+ const [activeIndex, controls] = useCarouselControls({
30
30
  itemsCount: childBlocksLength,
31
31
  visibleItemCount: cardFullViewCount,
32
32
  isCyclic,
33
33
  });
34
-
35
34
  const { inc, dec, canDec, canInc } = controls;
36
35
 
37
36
  return (
@@ -1,9 +1,10 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
+ import type { CardWidth } from './CarouselContent';
2
3
 
3
4
  export interface CarouselContainerProps {
4
5
  activeItem: number;
5
6
  cardFullViewCount: number;
6
- cardWidth: number;
7
+ cardWidth: CardWidth;
7
8
  }
8
9
 
9
10
  export const CarouselContainer = JSX<CarouselContainerProps>(
@@ -11,7 +12,7 @@ export const CarouselContainer = JSX<CarouselContainerProps>(
11
12
  const cardFullViewStyles =
12
13
  cardFullViewCount === 1
13
14
  ? `translateX(-${activeItem}00%)`
14
- : `translateX(-${activeItem * cardWidth}px)`;
15
+ : `translateX(-${activeItem * Number(cardWidth)}px)`;
15
16
 
16
17
  return (
17
18
  <div
@@ -1,10 +1,18 @@
1
1
  /**
2
2
  * @title Карусель
3
3
  */
4
+
5
+ /**
6
+ * @title Ширина карточек
7
+ * @enumNames [ "1007", "833", "350", "322" ]
8
+ */
9
+ export type CardWidth = '322' | '350' | '832' | '1007';
4
10
  export interface CarouselContent {
5
- /** @title Блоки */
11
+ /** @title Количество видимых карточек */
6
12
  cardFullViewCount?: number;
7
- cardWidth?: number;
13
+ cardWidth?: CardWidth;
14
+ /** @title Добавление блюра */
8
15
  isBlur?: boolean;
16
+ /** @title Цикличность */
9
17
  isCyclic?: boolean;
10
18
  }
@@ -11,24 +11,21 @@ const button: ButtonProps = {
11
11
 
12
12
  export const CARD: CarouselCardContent = {
13
13
  title: 'Хочешь попасть на практику в РСХБ?',
14
- description:
15
- 'Стажировка в Россельхозбанке — это возможность реализовать смелые идеи и проекты под руководством опытных наставников, внести свой вклад в развитие перспективных цифровых продуктов.',
14
+ description: 'Стажировка в Россельхозбанке — это возможность реализовать смелые идеи и проекты.',
16
15
  button,
17
16
  version: 'normal',
18
17
  };
19
18
 
20
19
  export const CARD_NEW: CarouselCardContent = {
21
20
  title: 'РСХБ?',
22
- description:
23
- 'Стажировка в Россельхозбанке — это возможность реализовать смелые идеи и проекты под руководством опытных наставников, внести свой вклад в развитие перспективных цифровых продуктов.',
21
+ description: 'Стажировка в Россельхозбанке — это возможность реализовать смелые идеи и проекты.',
24
22
  button,
25
23
  version: 'normal',
26
24
  };
27
25
 
28
26
  export const CARD_MINI: CarouselCardContent = {
29
27
  title: 'Хочешь попасть на практику в РСХБ?',
30
- description:
31
- 'Стажировка в Россельхозбанке — это возможность реализовать смелые идеи и проекты под руководством опытных наставников, внести свой вклад в развитие перспективных цифровых продуктов.',
28
+ description: 'Стажировка в Россельхозбанке — это возможность реализовать смелые идеи и проекты.',
32
29
  button,
33
30
  version: 'mini',
34
31
  };
@@ -1,5 +1,5 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
- import { useCarouselControl } from '../../hooks/useCarousel';
2
+ import { useCarouselControls } from '../../hooks/useCarouselControls';
3
3
  import { ComparisonTableColumnHeaders } from './ComparisonTableColumnHeaders';
4
4
  import type { Column, RowHeader } from './ComparisonTableContent';
5
5
  import { ComparisonTableRows } from './ComparisonTableRows';
@@ -26,7 +26,7 @@ export const ComparisonTableBody = JSX<ComparisonTableBodyProps>(
26
26
 
27
27
  const isScrollAvailable = colData.length > COLS_LENGTH_FOR_SCROLL;
28
28
 
29
- const [activeIndex, controls] = useCarouselControl({
29
+ const [activeIndex, controls] = useCarouselControls({
30
30
  itemsCount: colData.length,
31
31
  visibleItemCount: COLS_LENGTH_FOR_SCROLL,
32
32
  });
@@ -1,15 +1,15 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
+ import type { CarouselControls } from '../../hooks/useCarouselControls';
2
3
  import type { TitleProps } from '../../model/HeadlineType';
4
+ import { renderArrows } from '../../ui-kit/Button/renderArrows';
3
5
  import type { CellData } from './ComparisonTableContent';
4
6
  import { TableRow } from './TableRow';
5
- import type { Controls } from '../../hooks/useCarousel';
6
- import { renderArrows } from '../../ui-kit/Button/renderArrows';
7
7
 
8
8
  type ComparisonTableRowsProps = {
9
9
  rowData: { header: TitleProps; data: CellData[][] }[];
10
10
  activeCardIndex: number;
11
11
  isColoredFirstColumn: boolean;
12
- controls: Controls;
12
+ controls: CarouselControls;
13
13
  isScrollAvailable: boolean;
14
14
  };
15
15
 
@@ -85,6 +85,7 @@ export default {
85
85
  headlineVersion="L"
86
86
  title="Потребительский кредит наличными"
87
87
  description="Кредит наличными без залога и поручительства. Потребительский кредит на любые цели. Нужен только паспорт."
88
+ benefitsCountOfRow={2}
88
89
  benefits={benefits}
89
90
  benefitsVersion="normal"
90
91
  buttons={buttons}
@@ -25,6 +25,12 @@ export type ProductBlockInnerContent = HeadlineProps &
25
25
  * }
26
26
  */
27
27
  image?: Picture;
28
+ /**
29
+ * @title Количество преимуществ в строке
30
+ * @default 3
31
+ * @enumNames ["2", "3"]
32
+ */
33
+ benefitsCountOfRow?: 2 | 3;
28
34
  /**
29
35
  * @title Список преимуществ
30
36
  * @minItems 2
@@ -16,6 +16,7 @@ export const ProductBlockInner = JSX<ProductBlockInnerProps>(
16
16
  title,
17
17
  headlineVersion = 'L',
18
18
  description,
19
+ benefitsCountOfRow = 3,
19
20
  benefits,
20
21
  benefitsVersion,
21
22
  buttons,
@@ -27,7 +28,7 @@ export const ProductBlockInner = JSX<ProductBlockInnerProps>(
27
28
  ...rest
28
29
  }) => {
29
30
  const benefitsCount = benefits?.filter((_) => _.label)?.length;
30
- const benefitsContainerStyles = getBenefitsContainerStyles(benefitsCount);
31
+ const benefitsContainerStyles = getBenefitsContainerStyles(benefitsCountOfRow);
31
32
 
32
33
  return (
33
34
  <div className={`flex grow justify-between items-stretch h-full ${className}`}>
@@ -70,5 +71,9 @@ export const ProductBlockInner = JSX<ProductBlockInnerProps>(
70
71
  },
71
72
  );
72
73
 
73
- const getBenefitsContainerStyles = (benefitsCount = 0) =>
74
- `gap-6 mt-6 ${benefitsCount > 3 ? 'inline-grid grid-cols-[auto_auto]' : 'flex'}`;
74
+ const getBenefitsContainerStyles = (benefitsCountOfRow = 2) =>
75
+ `gap-6 mt-6 ${
76
+ benefitsCountOfRow > 2
77
+ ? 'inline-grid grid-cols-[auto_auto_auto]'
78
+ : 'inline-grid grid-cols-[auto_auto]'
79
+ }`;
@@ -1,23 +1,21 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
- import { useCarouselControl } from '../../hooks/useCarousel';
2
+ import type { CarouselControls } from '../../hooks/useCarouselControls';
3
+ import { useCarouselControls } from '../../hooks/useCarouselControls';
3
4
  import type { UniBlockProps } from '../../model/JSXBlock';
4
5
  import { BlockWrapper } from '../../ui-kit/BlockWrapper';
6
+ import { renderArrows } from '../../ui-kit/Button/renderArrows';
5
7
  import { renderDefaultFoldButton } from '../../ui-kit/Foldable/DefaultFoldButton';
6
8
  import { Foldable } from '../../ui-kit/Foldable/Foldable';
7
9
  import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection';
8
10
  import { Heading } from '../../ui-kit/Heading/Heading';
9
- import { TableArrowScrollControl } from '../../ui-kit/TableArrowScrollControl/TableArrowScrollControl';
10
- import type { TableArrowScrollControlProps } from '../../ui-kit/TableArrowScrollControl/TableArrowScrollControlProps';
11
11
  import { COLS_LENGTH_FOR_SCROLL } from './constants';
12
12
  import type { TariffsTableContent } from './TariffsTableContent';
13
13
  import { TariffsTableRow } from './TariffsTableRow';
14
- import { renderArrows } from '../../ui-kit/Button/renderArrows';
15
- import type { Controls } from '../../hooks/useCarousel';
16
14
 
17
15
  export interface TariffsTableProps extends TariffsTableContent, UniBlockProps {}
18
16
 
19
17
  interface WrapperProps {
20
- controls: Controls;
18
+ controls: CarouselControls;
21
19
  isScrollAvailable: boolean;
22
20
  }
23
21
 
@@ -39,7 +37,7 @@ export const TariffsTable = JSX<TariffsTableProps>(
39
37
 
40
38
  const columnsLength = colData.length;
41
39
 
42
- const [activeIndex, controls] = useCarouselControl({
40
+ const [activeIndex, controls] = useCarouselControls({
43
41
  itemsCount: colData.length,
44
42
  visibleItemCount: COLS_LENGTH_FOR_SCROLL,
45
43
  });
@@ -1,8 +1,6 @@
1
1
  import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
2
2
 
3
- export type CarouselControlProps = [number, Controls];
4
-
5
- export interface Controls {
3
+ export interface CarouselControls {
6
4
  inc: () => void;
7
5
  dec: () => void;
8
6
  canInc: boolean;
@@ -15,23 +13,22 @@ interface CarouselProps {
15
13
  isCyclic?: boolean;
16
14
  }
17
15
 
18
- export const useCarouselControl = ({
16
+ export const useCarouselControls = ({
19
17
  itemsCount,
20
18
  visibleItemCount = itemsCount,
21
19
  isCyclic,
22
- }: CarouselProps): Required<CarouselControlProps> => {
20
+ }: CarouselProps): [number, CarouselControls] => {
23
21
  const [activeIndex, setActiveIndex] = useState(0);
24
22
 
25
23
  const inc = useCallback(
26
24
  () =>
27
25
  setActiveIndex((_) => (isCyclic ? (_ + 1) % itemsCount : Math.min(_ + 1, itemsCount - 1))),
28
- [],
26
+ [isCyclic, itemsCount],
29
27
  );
30
-
31
28
  const dec = useCallback(
32
29
  () =>
33
30
  setActiveIndex((_) => (isCyclic ? (itemsCount + _ - 1) % itemsCount : Math.max(_ - 1, 0))),
34
- [],
31
+ [isCyclic, itemsCount],
35
32
  );
36
33
 
37
34
  const isScrollAvailable = itemsCount > visibleItemCount;
@@ -40,7 +37,6 @@ export const useCarouselControl = ({
40
37
  const canInc =
41
38
  isCyclicAndScrollAvailable ||
42
39
  (isScrollAvailable && itemsCount - activeIndex > visibleItemCount);
43
-
44
40
  const canDec = isCyclicAndScrollAvailable || Boolean(isScrollAvailable && activeIndex > 0);
45
41
 
46
42
  return [
@@ -1,6 +1,6 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
2
  import { Button } from '../Button/Button';
3
- import { Img } from '../Img/Img';
3
+ import { Icon } from '../Icon/Icon';
4
4
 
5
5
  export interface InnerTableHeaderProps {
6
6
  currencies?: string[];
@@ -33,7 +33,14 @@ export const InnerTableHeader = JSX<InnerTableHeaderProps>(
33
33
  version="secondary"
34
34
  target="_blank"
35
35
  appendLeft={
36
- <Img image="DocDownloadIcon" className="mr-0.5" width="20" height="20" asSVG />
36
+ <Icon
37
+ name="DocDownloadIcon"
38
+ iconVersion="color"
39
+ className="mr-0.5"
40
+ width="20"
41
+ height="20"
42
+ asSVG
43
+ />
37
44
  }
38
45
  text="Скачать в PDF"
39
46
  />
@@ -1,14 +0,0 @@
1
- export declare type CarouselControlProps = [number, Controls];
2
- export interface Controls {
3
- inc: () => void;
4
- dec: () => void;
5
- canInc: boolean;
6
- canDec: boolean;
7
- }
8
- interface CarouselProps {
9
- itemsCount: number;
10
- visibleItemCount?: number;
11
- isCyclic?: boolean;
12
- }
13
- export declare const useCarouselControl: ({ itemsCount, visibleItemCount, isCyclic, }: CarouselProps) => [number, Controls];
14
- export {};
@@ -1,14 +0,0 @@
1
- export declare type CarouselControlProps = [number, Controls];
2
- export interface Controls {
3
- inc: () => void;
4
- dec: () => void;
5
- canInc: boolean;
6
- canDec: boolean;
7
- }
8
- interface CarouselProps {
9
- itemsCount: number;
10
- visibleItemCount?: number;
11
- isCyclic?: boolean;
12
- }
13
- export declare const useCarouselControl: ({ itemsCount, visibleItemCount, isCyclic, }: CarouselProps) => [number, Controls];
14
- export {};
@@ -1 +0,0 @@
1
- {"version":3,"file":"useCarousel.js","sourceRoot":"","sources":["../../src/hooks/useCarousel.ts"],"names":[],"mappings":";;AAAA,uDAAoE;AAiB7D,MAAM,kBAAkB,GAAG,CAAC,EACjC,UAAU,EACV,gBAAgB,GAAG,UAAU,EAC7B,QAAQ,GACM,EAAkC,EAAE;IAClD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,IAAA,gBAAQ,EAAC,CAAC,CAAC,CAAC;IAElD,MAAM,GAAG,GAAG,IAAA,mBAAW,EACrB,GAAG,EAAE,CACH,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,EAC5F,EAAE,CACH,CAAC;IAEF,MAAM,GAAG,GAAG,IAAA,mBAAW,EACrB,GAAG,EAAE,CACH,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,UAAU,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAC5F,EAAE,CACH,CAAC;IAEF,MAAM,iBAAiB,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACxD,MAAM,0BAA0B,GAAG,QAAQ,IAAI,iBAAiB,CAAC;IAEjE,MAAM,MAAM,GACV,0BAA0B;QAC1B,CAAC,iBAAiB,IAAI,UAAU,GAAG,WAAW,GAAG,gBAAgB,CAAC,CAAC;IAErE,MAAM,MAAM,GAAG,0BAA0B,IAAI,OAAO,CAAC,iBAAiB,IAAI,WAAW,GAAG,CAAC,CAAC,CAAC;IAE3F,OAAO;QACL,WAAW;QACX;YACE,GAAG;YACH,GAAG;YACH,MAAM;YACN,MAAM;SACP;KACF,CAAC;AACJ,CAAC,CAAC;AArCW,QAAA,kBAAkB,sBAqC7B"}
@@ -1,14 +0,0 @@
1
- export declare type CarouselControlProps = [number, Controls];
2
- export interface Controls {
3
- inc: () => void;
4
- dec: () => void;
5
- canInc: boolean;
6
- canDec: boolean;
7
- }
8
- interface CarouselProps {
9
- itemsCount: number;
10
- visibleItemCount?: number;
11
- isCyclic?: boolean;
12
- }
13
- export declare const useCarouselControl: ({ itemsCount, visibleItemCount, isCyclic, }: CarouselProps) => [number, Controls];
14
- export {};
@@ -1 +0,0 @@
1
- {"version":3,"file":"useCarousel.js","sourceRoot":"","sources":["../../src/hooks/useCarousel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAiBpE,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EACjC,UAAU,EACV,gBAAgB,GAAG,UAAU,EAC7B,QAAQ,GACM,EAAkC,EAAE;IAClD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElD,MAAM,GAAG,GAAG,WAAW,CACrB,GAAG,EAAE,CACH,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,EAC5F,EAAE,CACH,CAAC;IAEF,MAAM,GAAG,GAAG,WAAW,CACrB,GAAG,EAAE,CACH,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,UAAU,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAC5F,EAAE,CACH,CAAC;IAEF,MAAM,iBAAiB,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACxD,MAAM,0BAA0B,GAAG,QAAQ,IAAI,iBAAiB,CAAC;IAEjE,MAAM,MAAM,GACV,0BAA0B;QAC1B,CAAC,iBAAiB,IAAI,UAAU,GAAG,WAAW,GAAG,gBAAgB,CAAC,CAAC;IAErE,MAAM,MAAM,GAAG,0BAA0B,IAAI,OAAO,CAAC,iBAAiB,IAAI,WAAW,GAAG,CAAC,CAAC,CAAC;IAE3F,OAAO;QACL,WAAW;QACX;YACE,GAAG;YACH,GAAG;YACH,MAAM;YACN,MAAM;SACP;KACF,CAAC;AACJ,CAAC,CAAC"}
@@ -1,14 +0,0 @@
1
- export declare type CarouselControlProps = [number, Controls];
2
- export interface Controls {
3
- inc: () => void;
4
- dec: () => void;
5
- canInc: boolean;
6
- canDec: boolean;
7
- }
8
- interface CarouselProps {
9
- itemsCount: number;
10
- visibleItemCount?: number;
11
- isCyclic?: boolean;
12
- }
13
- export declare const useCarouselControl: ({ itemsCount, visibleItemCount, isCyclic, }: CarouselProps) => [number, Controls];
14
- export {};
@@ -1,14 +0,0 @@
1
- export declare type CarouselControlProps = [number, Controls];
2
- export interface Controls {
3
- inc: () => void;
4
- dec: () => void;
5
- canInc: boolean;
6
- canDec: boolean;
7
- }
8
- interface CarouselProps {
9
- itemsCount: number;
10
- visibleItemCount?: number;
11
- isCyclic?: boolean;
12
- }
13
- export declare const useCarouselControl: ({ itemsCount, visibleItemCount, isCyclic, }: CarouselProps) => [number, Controls];
14
- export {};
@@ -1 +0,0 @@
1
- {"version":3,"file":"useCarousel.js","sourceRoot":"","sources":["../../src/hooks/useCarousel.ts"],"names":[],"mappings":";;AAAA,uDAAoE;AAiB7D,MAAM,kBAAkB,GAAG,CAAC,EACjC,UAAU,EACV,gBAAgB,GAAG,UAAU,EAC7B,QAAQ,GACM,EAAkC,EAAE;IAClD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,IAAA,gBAAQ,EAAC,CAAC,CAAC,CAAC;IAElD,MAAM,GAAG,GAAG,IAAA,mBAAW,EACrB,GAAG,EAAE,CACH,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,EAC5F,EAAE,CACH,CAAC;IAEF,MAAM,GAAG,GAAG,IAAA,mBAAW,EACrB,GAAG,EAAE,CACH,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,UAAU,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAC5F,EAAE,CACH,CAAC;IAEF,MAAM,iBAAiB,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACxD,MAAM,0BAA0B,GAAG,QAAQ,IAAI,iBAAiB,CAAC;IAEjE,MAAM,MAAM,GACV,0BAA0B;QAC1B,CAAC,iBAAiB,IAAI,UAAU,GAAG,WAAW,GAAG,gBAAgB,CAAC,CAAC;IAErE,MAAM,MAAM,GAAG,0BAA0B,IAAI,OAAO,CAAC,iBAAiB,IAAI,WAAW,GAAG,CAAC,CAAC,CAAC;IAE3F,OAAO;QACL,WAAW;QACX;YACE,GAAG;YACH,GAAG;YACH,MAAM;YACN,MAAM;SACP;KACF,CAAC;AACJ,CAAC,CAAC;AArCW,QAAA,kBAAkB,sBAqC7B"}
@@ -1,14 +0,0 @@
1
- export declare type CarouselControlProps = [number, Controls];
2
- export interface Controls {
3
- inc: () => void;
4
- dec: () => void;
5
- canInc: boolean;
6
- canDec: boolean;
7
- }
8
- interface CarouselProps {
9
- itemsCount: number;
10
- visibleItemCount?: number;
11
- isCyclic?: boolean;
12
- }
13
- export declare const useCarouselControl: ({ itemsCount, visibleItemCount, isCyclic, }: CarouselProps) => [number, Controls];
14
- export {};
@@ -1 +0,0 @@
1
- {"version":3,"file":"useCarousel.js","sourceRoot":"","sources":["../../src/hooks/useCarousel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAiBpE,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EACjC,UAAU,EACV,gBAAgB,GAAG,UAAU,EAC7B,QAAQ,GACM,EAAkC,EAAE;IAClD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElD,MAAM,GAAG,GAAG,WAAW,CACrB,GAAG,EAAE,CACH,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,EAC5F,EAAE,CACH,CAAC;IAEF,MAAM,GAAG,GAAG,WAAW,CACrB,GAAG,EAAE,CACH,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,UAAU,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAC5F,EAAE,CACH,CAAC;IAEF,MAAM,iBAAiB,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACxD,MAAM,0BAA0B,GAAG,QAAQ,IAAI,iBAAiB,CAAC;IAEjE,MAAM,MAAM,GACV,0BAA0B;QAC1B,CAAC,iBAAiB,IAAI,UAAU,GAAG,WAAW,GAAG,gBAAgB,CAAC,CAAC;IAErE,MAAM,MAAM,GAAG,0BAA0B,IAAI,OAAO,CAAC,iBAAiB,IAAI,WAAW,GAAG,CAAC,CAAC,CAAC;IAE3F,OAAO;QACL,WAAW;QACX;YACE,GAAG;YACH,GAAG;YACH,MAAM;YACN,MAAM;SACP;KACF,CAAC;AACJ,CAAC,CAAC"}