@alfalab/core-components-gallery 5.2.13 → 5.3.0

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 (125) hide show
  1. package/Component-89a3cf4c.d.ts +38 -0
  2. package/Component.js +4 -4
  3. package/buttons-5bf80e8b.d.ts +336 -0
  4. package/{buttons-a0cf7676.js → buttons-5bf80e8b.js} +5 -5
  5. package/components/header/Component.js +2 -2
  6. package/components/header/buttons.js +2 -2
  7. package/components/header/index.css +6 -6
  8. package/components/header/index.js +2 -2
  9. package/components/header-info-block/Component.js +1 -1
  10. package/components/header-info-block/index.css +5 -5
  11. package/components/image-preview/Component.js +1 -1
  12. package/components/image-preview/index.css +13 -13
  13. package/components/image-viewer/component.js +1 -1
  14. package/components/image-viewer/index.css +19 -19
  15. package/components/image-viewer/index.js +1 -1
  16. package/components/image-viewer/slide.js +1 -1
  17. package/components/index.js +3 -3
  18. package/components/navigation-bar/Component.js +1 -1
  19. package/components/navigation-bar/index.css +6 -6
  20. package/cssm/Component-89a3cf4c.d.ts +38 -0
  21. package/cssm/Component.js +1 -1
  22. package/cssm/components/header/Component.js +1 -1
  23. package/cssm/components/header/buttons.js +4 -4
  24. package/cssm/components/header/index.js +1 -1
  25. package/cssm/components/index.js +1 -1
  26. package/cssm/index-89a3cf4c.d.ts +3 -0
  27. package/cssm/index-ebda875c.d.ts +35 -0
  28. package/cssm/index.js +1 -1
  29. package/cssm/types-ebda875c.d.ts +113 -0
  30. package/cssm/typings-9211a437.d.ts +95 -0
  31. package/esm/Component-89a3cf4c.d.ts +38 -0
  32. package/esm/Component.js +4 -4
  33. package/esm/buttons-d8c2f203.d.ts +336 -0
  34. package/esm/{buttons-8138e150.js → buttons-d8c2f203.js} +5 -5
  35. package/esm/components/header/Component.js +2 -2
  36. package/esm/components/header/buttons.js +2 -2
  37. package/esm/components/header/index.css +6 -6
  38. package/esm/components/header/index.js +2 -2
  39. package/esm/components/header-info-block/Component.js +1 -1
  40. package/esm/components/header-info-block/index.css +5 -5
  41. package/esm/components/image-preview/Component.js +1 -1
  42. package/esm/components/image-preview/index.css +13 -13
  43. package/esm/components/image-viewer/component.js +1 -1
  44. package/esm/components/image-viewer/index.css +19 -19
  45. package/esm/components/image-viewer/index.js +1 -1
  46. package/esm/components/image-viewer/slide.js +1 -1
  47. package/esm/components/index.js +3 -3
  48. package/esm/components/navigation-bar/Component.js +1 -1
  49. package/esm/components/navigation-bar/index.css +6 -6
  50. package/esm/index-89a3cf4c.d.ts +3 -0
  51. package/esm/index-ebda875c.d.ts +35 -0
  52. package/esm/index.css +3 -3
  53. package/esm/index.js +3 -3
  54. package/esm/{slide-7040503f.js → slide-7de3e914.js} +1 -1
  55. package/esm/types-ebda875c.d.ts +113 -0
  56. package/esm/typings-9211a437.d.ts +95 -0
  57. package/index-89a3cf4c.d.ts +3 -0
  58. package/index-ebda875c.d.ts +35 -0
  59. package/index.css +3 -3
  60. package/index.js +3 -3
  61. package/modern/Component-89a3cf4c.d.ts +38 -0
  62. package/modern/Component.js +4 -4
  63. package/modern/buttons-c09a58e5.d.ts +336 -0
  64. package/modern/{buttons-c69fcb71.js → buttons-c09a58e5.js} +5 -5
  65. package/modern/components/header/Component.js +2 -2
  66. package/modern/components/header/buttons.js +2 -2
  67. package/modern/components/header/index.css +6 -6
  68. package/modern/components/header/index.js +2 -2
  69. package/modern/components/header-info-block/Component.js +1 -1
  70. package/modern/components/header-info-block/index.css +5 -5
  71. package/modern/components/image-preview/Component.js +1 -1
  72. package/modern/components/image-preview/index.css +13 -13
  73. package/modern/components/image-viewer/component.js +1 -1
  74. package/modern/components/image-viewer/index.css +19 -19
  75. package/modern/components/image-viewer/index.js +1 -1
  76. package/modern/components/image-viewer/slide.js +1 -1
  77. package/modern/components/index.js +3 -3
  78. package/modern/components/navigation-bar/Component.js +1 -1
  79. package/modern/components/navigation-bar/index.css +6 -6
  80. package/modern/index-89a3cf4c.d.ts +3 -0
  81. package/modern/index-ebda875c.d.ts +35 -0
  82. package/modern/index.css +3 -3
  83. package/modern/index.js +3 -3
  84. package/modern/{slide-b249a536.js → slide-0c0b76a4.js} +1 -1
  85. package/modern/types-ebda875c.d.ts +113 -0
  86. package/modern/typings-9211a437.d.ts +95 -0
  87. package/package.json +5 -5
  88. package/{slide-97bdc786.js → slide-346fa78d.js} +1 -1
  89. package/src/Component.tsx +185 -0
  90. package/src/components/header/Component.tsx +86 -0
  91. package/src/components/header/buttons.tsx +78 -0
  92. package/src/components/header/index.module.css +30 -0
  93. package/src/components/header/index.tsx +1 -0
  94. package/src/components/header-info-block/Component.tsx +47 -0
  95. package/src/components/header-info-block/index.module.css +29 -0
  96. package/src/components/header-info-block/index.ts +1 -0
  97. package/src/components/image-preview/Component.tsx +88 -0
  98. package/src/components/image-preview/index.module.css +68 -0
  99. package/src/components/image-preview/index.tsx +1 -0
  100. package/src/components/image-preview/paths.ts +5 -0
  101. package/src/components/image-viewer/component.tsx +232 -0
  102. package/src/components/image-viewer/index.module.css +126 -0
  103. package/src/components/image-viewer/index.ts +1 -0
  104. package/src/components/image-viewer/paths.ts +5 -0
  105. package/src/components/image-viewer/slide.tsx +113 -0
  106. package/src/components/index.ts +4 -0
  107. package/src/components/navigation-bar/Component.tsx +96 -0
  108. package/src/components/navigation-bar/index.module.css +31 -0
  109. package/src/components/navigation-bar/index.ts +1 -0
  110. package/src/context.ts +47 -0
  111. package/src/index.module.css +17 -0
  112. package/src/index.ts +2 -0
  113. package/src/types.ts +13 -0
  114. package/src/utils/constants.ts +10 -0
  115. package/src/utils/index.ts +3 -0
  116. package/src/utils/split-filename.ts +17 -0
  117. package/src/utils/utils.ts +18 -0
  118. package/types-ebda875c.d.ts +113 -0
  119. package/typings-9211a437.d.ts +95 -0
  120. package/buttons-a0cf7676.d.ts +0 -11
  121. package/esm/buttons-8138e150.d.ts +0 -11
  122. package/modern/buttons-c69fcb71.d.ts +0 -11
  123. /package/esm/{slide-7040503f.d.ts → slide-7de3e914.d.ts} +0 -0
  124. /package/modern/{slide-b249a536.d.ts → slide-0c0b76a4.d.ts} +0 -0
  125. /package/{slide-97bdc786.d.ts → slide-346fa78d.d.ts} +0 -0
@@ -1,4 +1,4 @@
1
- /* hash: 1jj9u */
1
+ /* hash: 1k986 */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-bg-primary: #fff;
@@ -27,13 +27,13 @@
27
27
  } :root {
28
28
  } :root {
29
29
  --focus-color: var(--color-light-border-link);
30
- } .gallery__component_1cxw3 {
30
+ } .gallery__component_1fi6a {
31
31
  display: flex;
32
32
  flex-grow: 1;
33
33
  justify-content: center;
34
34
  align-items: center;
35
35
  background-color: var(--color-static-bg-primary-dark);
36
- } .gallery__swiper_1cxw3 {
36
+ } .gallery__swiper_1fi6a {
37
37
  display: flex;
38
38
  width: 100%;
39
39
  height: 100%;
@@ -42,42 +42,42 @@
42
42
  max-height: calc(100vh - 168px);
43
43
  padding: var(--gap-2xl) var(--gap-m);
44
44
  box-sizing: border-box;
45
- } .gallery__singleSlide_1cxw3 .gallery__swiper_1cxw3 {
45
+ } .gallery__singleSlide_1fi6a .gallery__swiper_1fi6a {
46
46
  max-height: calc(100vh - 80px);
47
47
  padding: var(--gap-2xl);
48
- } .gallery__hidden_1cxw3 {
48
+ } .gallery__hidden_1fi6a {
49
49
  display: none;
50
- } .gallery__slide_1cxw3 {
50
+ } .gallery__slide_1fi6a {
51
51
  position: relative;
52
52
  display: flex;
53
53
  justify-content: center;
54
54
  align-items: center;
55
55
  width: 100%;
56
56
  height: 100%;
57
- } .gallery__slideLoading_1cxw3 {
57
+ } .gallery__slideLoading_1fi6a {
58
58
  background-color: var(--color-static-bg-secondary-dark);
59
59
  border-radius: var(--border-radius-m);
60
- } .gallery__image_1cxw3 {
60
+ } .gallery__image_1fi6a {
61
61
  width: 0;
62
62
  height: 0;
63
63
  -webkit-user-select: none;
64
64
  user-select: none;
65
65
  background-color: var(--color-light-bg-primary);
66
66
  border-radius: var(--border-radius-m);
67
- } .gallery__smallImage_1cxw3 {
67
+ } .gallery__smallImage_1fi6a {
68
68
  position: relative;
69
69
  width: auto;
70
70
  height: auto;
71
71
  -webkit-user-select: none;
72
72
  user-select: none;
73
73
  background-color: var(--color-light-bg-primary);
74
- } .gallery__verticalImageFit_1cxw3 {
74
+ } .gallery__verticalImageFit_1fi6a {
75
75
  width: auto;
76
76
  height: 100%;
77
- } .gallery__horizontalImageFit_1cxw3 {
77
+ } .gallery__horizontalImageFit_1fi6a {
78
78
  width: 100%;
79
79
  height: auto;
80
- } .gallery__arrow_1cxw3 {
80
+ } .gallery__arrow_1fi6a {
81
81
  display: flex;
82
82
  flex-direction: column;
83
83
  justify-content: center;
@@ -89,14 +89,14 @@
89
89
  color: var(--color-static-graphic-light);
90
90
  transition: background-color 0.15s ease-in-out;
91
91
  outline: none
92
- } .gallery__arrow_1cxw3:hover {
92
+ } .gallery__arrow_1fi6a:hover {
93
93
  background-color: var(--color-static-bg-primary-dark-tint-15);
94
- } .gallery__arrow_1cxw3:active {
94
+ } .gallery__arrow_1fi6a:active {
95
95
  background-color: var(--color-static-bg-primary-dark-tint-20);
96
- } .gallery__focused_1cxw3 {
96
+ } .gallery__focused_1fi6a {
97
97
  outline: 2px solid var(--focus-color);
98
98
  outline-offset: 2px;
99
- } .gallery__placeholder_1cxw3 {
99
+ } .gallery__placeholder_1fi6a {
100
100
  display: flex;
101
101
  justify-content: center;
102
102
  align-items: center;
@@ -104,18 +104,18 @@
104
104
  height: 300px;
105
105
  border-radius: var(--border-radius-m);
106
106
  background-color: var(--color-static-bg-quaternary-dark);
107
- } .gallery__brokenImgWrapper_1cxw3 {
107
+ } .gallery__brokenImgWrapper_1fi6a {
108
108
  position: relative;
109
109
  display: flex;
110
110
  flex-direction: column;
111
111
  align-items: center;
112
112
  width: 150px;
113
113
  text-align: center;
114
- } .gallery__brokenImgIcon_1cxw3 {
114
+ } .gallery__brokenImgIcon_1fi6a {
115
115
  width: 80px;
116
116
  height: 80px;
117
117
  margin-bottom: var(--gap-2xs);
118
- } .gallery__fullScreenImage_1cxw3 {
118
+ } .gallery__fullScreenImage_1fi6a {
119
119
  width: 100%;
120
120
  height: auto;
121
121
  background-color: var(--color-light-bg-primary);
@@ -10,7 +10,7 @@ import '@alfalab/icons-glyph/ChevronForwardHeavyMIcon';
10
10
  import '../../context.js';
11
11
  import '../../utils/utils.js';
12
12
  import '../../utils/constants.js';
13
- import '../../slide-b249a536.js';
13
+ import '../../slide-0c0b76a4.js';
14
14
  import '@alfalab/core-components-typography/modern';
15
15
  import './paths.js';
16
16
  import 'swiper/swiper.min.css';
@@ -4,4 +4,4 @@ import '@alfalab/core-components-typography/modern';
4
4
  import '../../utils/utils.js';
5
5
  import '../../utils/constants.js';
6
6
  import './paths.js';
7
- export { S as Slide } from '../../slide-b249a536.js';
7
+ export { S as Slide } from '../../slide-0c0b76a4.js';
@@ -9,9 +9,9 @@ import '../utils/constants.js';
9
9
  import './header-info-block/Component.js';
10
10
  import '@alfalab/core-components-typography/modern';
11
11
  import '../utils/split-filename.js';
12
- import '../buttons-c69fcb71.js';
12
+ import '../buttons-c09a58e5.js';
13
13
  import '@alfalab/core-components-icon-button/modern';
14
- import '@alfalab/core-components-tooltip/modern';
14
+ import '@alfalab/core-components-tooltip/modern/desktop';
15
15
  import '@alfalab/icons-glyph/ArrowsInwardMIcon';
16
16
  import '@alfalab/icons-glyph/ArrowsOutwardMIcon';
17
17
  import '@alfalab/icons-glyph/CrossMIcon';
@@ -24,6 +24,6 @@ import 'swiper';
24
24
  import 'swiper/react';
25
25
  import '@alfalab/icons-glyph/ChevronBackHeavyMIcon';
26
26
  import '@alfalab/icons-glyph/ChevronForwardHeavyMIcon';
27
- import '../slide-b249a536.js';
27
+ import '../slide-0c0b76a4.js';
28
28
  import './image-viewer/paths.js';
29
29
  import 'swiper/swiper.min.css';
@@ -7,7 +7,7 @@ import 'classnames';
7
7
  import '@alfalab/hooks';
8
8
  import '../image-preview/paths.js';
9
9
 
10
- const styles = {"component":"gallery__component_15nle","preview":"gallery__preview_15nle"};
10
+ const styles = {"component":"gallery__component_1lb5k","preview":"gallery__preview_1lb5k"};
11
11
  require('./index.css')
12
12
 
13
13
  const MIN_SCROLL_STEP = 24;
@@ -1,4 +1,4 @@
1
- /* hash: xuyyx */
1
+ /* hash: x4qr1 */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,7 +16,7 @@
16
16
  --gap-xl: 24px;
17
17
  } :root {
18
18
  } :root {
19
- } .gallery__component_15nle {
19
+ } .gallery__component_1lb5k {
20
20
  display: flex;
21
21
  flex-wrap: nowrap;
22
22
  align-content: center;
@@ -27,13 +27,13 @@
27
27
  padding: 10px var(--gap-xl);
28
28
  -ms-overflow-style: none;
29
29
  scrollbar-width: none
30
- } .gallery__component_15nle::-webkit-scrollbar {
30
+ } .gallery__component_1lb5k::-webkit-scrollbar {
31
31
  display: none;
32
- } .gallery__preview_15nle {
32
+ } .gallery__preview_1lb5k {
33
33
  flex-shrink: 0;
34
34
  margin: 0 var(--gap-3xs)
35
- } .gallery__preview_15nle:first-child {
35
+ } .gallery__preview_1lb5k:first-child {
36
36
  margin-left: auto;
37
- } .gallery__preview_15nle:last-child {
37
+ } .gallery__preview_1lb5k:last-child {
38
38
  margin-right: auto;
39
39
  }
@@ -0,0 +1,3 @@
1
+ declare const isClient: () => boolean;
2
+ declare const getDataTestId: (dataTestId?: string, element?: string) => string | undefined;
3
+ export { isClient, getDataTestId };
@@ -0,0 +1,35 @@
1
+ /// <reference types="react" />
2
+ import React from "react";
3
+ import { ButtonHTMLAttributes, ElementType, FC } from "react";
4
+ interface CloserProps extends ButtonHTMLAttributes<HTMLButtonElement> {
5
+ /**
6
+ * Вид компонента
7
+ */
8
+ view: "desktop" | "mobile";
9
+ /**
10
+ * Дополнительный класс
11
+ */
12
+ className?: string;
13
+ /**
14
+ * Позиция крестика
15
+ */
16
+ align?: "left" | "right";
17
+ /**
18
+ * Фиксирует крестик
19
+ */
20
+ sticky?: boolean;
21
+ /**
22
+ * Иконка
23
+ */
24
+ icon?: ElementType;
25
+ /**
26
+ * Идентификатор для систем автоматизированного тестирования
27
+ */
28
+ dataTestId?: string;
29
+ /**
30
+ * Коллбэк закрытия.
31
+ */
32
+ onClose?: (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, reason?: "backdropClick" | "escapeKeyDown" | "closerClick") => void;
33
+ }
34
+ declare const Closer: FC<CloserProps>;
35
+ export { CloserProps, Closer };
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: tu9zm */
1
+ /* hash: 1hul4 */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-static-bg-primary-dark: #121212; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -15,14 +15,14 @@
15
15
  } :root {
16
16
  } :root {
17
17
  } :root {
18
- } .gallery__container_1segf {
18
+ } .gallery__container_1iwsa {
19
19
  display: flex;
20
20
  flex-direction: column;
21
21
  justify-content: space-between;
22
22
  height: 100%;
23
23
  width: 100%;
24
24
  background-color: var(--color-static-bg-primary-dark);
25
- } .gallery__modal_1segf {
25
+ } .gallery__modal_1iwsa {
26
26
  flex-grow: 1;
27
27
  width: 100%;
28
28
  height: 100%;
package/modern/index.js CHANGED
@@ -13,9 +13,9 @@ import './components/image-preview/paths.js';
13
13
  import './components/header/Component.js';
14
14
  import './components/header-info-block/Component.js';
15
15
  import '@alfalab/core-components-typography/modern';
16
- import './buttons-c69fcb71.js';
16
+ import './buttons-c09a58e5.js';
17
17
  import '@alfalab/core-components-icon-button/modern';
18
- import '@alfalab/core-components-tooltip/modern';
18
+ import '@alfalab/core-components-tooltip/modern/desktop';
19
19
  import '@alfalab/icons-glyph/ArrowsInwardMIcon';
20
20
  import '@alfalab/icons-glyph/ArrowsOutwardMIcon';
21
21
  import '@alfalab/icons-glyph/CrossMIcon';
@@ -26,6 +26,6 @@ import 'swiper';
26
26
  import 'swiper/react';
27
27
  import '@alfalab/icons-glyph/ChevronBackHeavyMIcon';
28
28
  import '@alfalab/icons-glyph/ChevronForwardHeavyMIcon';
29
- import './slide-b249a536.js';
29
+ import './slide-0c0b76a4.js';
30
30
  import './components/image-viewer/paths.js';
31
31
  import 'swiper/swiper.min.css';
@@ -5,7 +5,7 @@ import { isSmallImage, getImageAlt } from './utils/utils.js';
5
5
  import { TestIds } from './utils/constants.js';
6
6
  import { NoImagePaths } from './components/image-viewer/paths.js';
7
7
 
8
- const styles = {"component":"gallery__component_1cxw3","swiper":"gallery__swiper_1cxw3","singleSlide":"gallery__singleSlide_1cxw3","hidden":"gallery__hidden_1cxw3","slide":"gallery__slide_1cxw3","slideLoading":"gallery__slideLoading_1cxw3","image":"gallery__image_1cxw3","smallImage":"gallery__smallImage_1cxw3","verticalImageFit":"gallery__verticalImageFit_1cxw3","horizontalImageFit":"gallery__horizontalImageFit_1cxw3","arrow":"gallery__arrow_1cxw3","focused":"gallery__focused_1cxw3","placeholder":"gallery__placeholder_1cxw3","brokenImgWrapper":"gallery__brokenImgWrapper_1cxw3","brokenImgIcon":"gallery__brokenImgIcon_1cxw3","fullScreenImage":"gallery__fullScreenImage_1cxw3"};
8
+ const styles = {"component":"gallery__component_1fi6a","swiper":"gallery__swiper_1fi6a","singleSlide":"gallery__singleSlide_1fi6a","hidden":"gallery__hidden_1fi6a","slide":"gallery__slide_1fi6a","slideLoading":"gallery__slideLoading_1fi6a","image":"gallery__image_1fi6a","smallImage":"gallery__smallImage_1fi6a","verticalImageFit":"gallery__verticalImageFit_1fi6a","horizontalImageFit":"gallery__horizontalImageFit_1fi6a","arrow":"gallery__arrow_1fi6a","focused":"gallery__focused_1fi6a","placeholder":"gallery__placeholder_1fi6a","brokenImgWrapper":"gallery__brokenImgWrapper_1fi6a","brokenImgIcon":"gallery__brokenImgIcon_1fi6a","fullScreenImage":"gallery__fullScreenImage_1fi6a"};
9
9
  require('./components/image-viewer/index.css')
10
10
 
11
11
  const SlideInner = ({ children, broken, loading, withPlaceholder }) => {
@@ -0,0 +1,113 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { ReactNode } from "react";
4
+ import { CloserProps } from "./index-ebda875c";
5
+ type NavigationBarProps = {
6
+ /**
7
+ * Контент шапки
8
+ */
9
+ children?: ReactNode;
10
+ /**
11
+ * Заголовок шапки
12
+ */
13
+ title?: string;
14
+ /**
15
+ * Подзаголовок (доступен только в мобильной версии)
16
+ */
17
+ subtitle?: string;
18
+ /**
19
+ * Размер заголовка (compact доступен только в мобильной версии)
20
+ */
21
+ titleSize?: 'default' | 'compact';
22
+ /**
23
+ * Доп. класс для аддонов
24
+ */
25
+ addonClassName?: string;
26
+ /**
27
+ * Слот слева
28
+ */
29
+ leftAddons?: ReactNode;
30
+ /**
31
+ * Слот справа
32
+ */
33
+ rightAddons?: ReactNode;
34
+ /**
35
+ * Дополнительный класс для closer
36
+ */
37
+ closerClassName?: string;
38
+ /**
39
+ * Слот снизу
40
+ */
41
+ bottomAddons?: ReactNode;
42
+ /**
43
+ * Наличие компонента крестика
44
+ */
45
+ hasCloser?: boolean;
46
+ /**
47
+ * Наличие кнопки "Назад"
48
+ */
49
+ hasBackButton?: boolean;
50
+ /**
51
+ * Дополнительный класс для правого аддона
52
+ */
53
+ backButtonClassName?: string;
54
+ /**
55
+ * Дополнительный класс
56
+ */
57
+ className?: string;
58
+ /**
59
+ * Дополнительный класс для контента
60
+ */
61
+ contentClassName?: string;
62
+ /**
63
+ * Дополнительный класс для нижнего аддона
64
+ */
65
+ bottomAddonsClassName?: string;
66
+ /**
67
+ * Выравнивание заголовка
68
+ */
69
+ align?: 'left' | 'center';
70
+ /**
71
+ * Обрезать ли заголовок
72
+ */
73
+ trim?: boolean;
74
+ /**
75
+ * Фиксирует шапку
76
+ */
77
+ sticky?: boolean;
78
+ /**
79
+ * Идентификатор для систем автоматизированного тестирования
80
+ */
81
+ dataTestId?: string;
82
+ /**
83
+ * Фоновое изображение
84
+ */
85
+ imageUrl?: string;
86
+ /**
87
+ * Иконка closer.
88
+ */
89
+ closerIcon?: React.ElementType;
90
+ /**
91
+ * Обработчик закрытия
92
+ */
93
+ onClose?: CloserProps['onClose'];
94
+ /**
95
+ * обработчик клика по кнопке "назад"
96
+ */
97
+ onBack?: () => void;
98
+ /**
99
+ * Вид шапки - мобильный или десктоп
100
+ */
101
+ view: 'desktop' | 'mobile';
102
+ /**
103
+ * Ссылка на родительскую ноду overflow: auto
104
+ */
105
+ scrollableParentRef?: React.RefObject<HTMLDivElement>;
106
+ };
107
+ type ContentParams = {
108
+ extraClassName?: string;
109
+ wrapperRef?: React.RefObject<HTMLDivElement>;
110
+ style?: React.CSSProperties;
111
+ hidden?: boolean;
112
+ };
113
+ export { NavigationBarProps, ContentParams };
@@ -0,0 +1,95 @@
1
+ import { AnchorHTMLAttributes, ButtonHTMLAttributes, ElementType, ReactNode } from 'react';
2
+ type StyleColors = {
3
+ default: {
4
+ [key: string]: string;
5
+ };
6
+ inverted: {
7
+ [key: string]: string;
8
+ };
9
+ };
10
+ type ComponentProps = {
11
+ /**
12
+ * Тип кнопки
13
+ * @default secondary
14
+ */
15
+ view?: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'outlined' | 'filled' | 'transparent' | 'link' | 'ghost';
16
+ /**
17
+ * Слот слева
18
+ */
19
+ leftAddons?: ReactNode;
20
+ /**
21
+ * Слот справа
22
+ */
23
+ rightAddons?: ReactNode;
24
+ /**
25
+ * Размер компонента
26
+ * @default m
27
+ */
28
+ size?: 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
29
+ /**
30
+ * Растягивает компонент на ширину контейнера
31
+ * @default false
32
+ */
33
+ block?: boolean;
34
+ /**
35
+ * Дополнительный класс
36
+ */
37
+ className?: string;
38
+ /**
39
+ * Дополнительный класс для спиннера
40
+ */
41
+ spinnerClassName?: string;
42
+ /**
43
+ * Выводит ссылку в виде кнопки
44
+ */
45
+ href?: string;
46
+ /**
47
+ * Позволяет использовать кастомный компонент для кнопки (например Link из роутера)
48
+ */
49
+ Component?: ElementType;
50
+ /**
51
+ * Идентификатор для систем автоматизированного тестирования
52
+ */
53
+ dataTestId?: string;
54
+ /**
55
+ * Показать лоадер
56
+ * @default false
57
+ */
58
+ loading?: boolean;
59
+ /**
60
+ * Не переносить текст кнопки на новую строку
61
+ * @default false
62
+ */
63
+ nowrap?: boolean;
64
+ /**
65
+ * Набор цветов для компонента
66
+ */
67
+ colors?: 'default' | 'inverted';
68
+ /**
69
+ * Дочерние элементы.
70
+ */
71
+ children?: ReactNode;
72
+ /**
73
+ * Основные стили компонента.
74
+ */
75
+ styles: {
76
+ [key: string]: string;
77
+ };
78
+ /**
79
+ * Стили компонента для default и inverted режима.
80
+ */
81
+ colorStylesMap: StyleColors;
82
+ };
83
+ type AnchorBaseButtonProps = ComponentProps & AnchorHTMLAttributes<HTMLAnchorElement>;
84
+ type NativeBaseButtonProps = ComponentProps & ButtonHTMLAttributes<HTMLButtonElement>;
85
+ type BaseButtonProps = Partial<AnchorBaseButtonProps | NativeBaseButtonProps>;
86
+ type AnchorButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & AnchorHTMLAttributes<HTMLAnchorElement>;
87
+ type NativeButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & ButtonHTMLAttributes<HTMLButtonElement>;
88
+ type ButtonProps = Partial<AnchorButtonProps | NativeButtonProps> & {
89
+ /**
90
+ * Контрольная точка, с нее начинается desktop версия
91
+ * @default 1024
92
+ */
93
+ breakpoint?: number;
94
+ };
95
+ export { StyleColors, ComponentProps, AnchorBaseButtonProps, NativeBaseButtonProps, BaseButtonProps, AnchorButtonProps, NativeButtonProps, ButtonProps };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-gallery",
3
- "version": "5.2.13",
3
+ "version": "5.3.0",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -14,10 +14,10 @@
14
14
  "react": "^16.9.0 || ^17.0.1 || ^18.0.0"
15
15
  },
16
16
  "dependencies": {
17
- "@alfalab/core-components-base-modal": "^5.2.1",
18
- "@alfalab/core-components-icon-button": "^6.1.3",
19
- "@alfalab/core-components-tooltip": "^6.2.28",
20
- "@alfalab/core-components-typography": "^3.2.2",
17
+ "@alfalab/core-components-base-modal": "^5.3.0",
18
+ "@alfalab/core-components-icon-button": "^6.2.0",
19
+ "@alfalab/core-components-tooltip": "^7.0.0",
20
+ "@alfalab/core-components-typography": "^4.0.0",
21
21
  "@alfalab/hooks": "^1.13.0",
22
22
  "@alfalab/icons-glyph": "^2.108.0",
23
23
  "classnames": "^2.3.1",
@@ -12,7 +12,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
12
12
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
13
13
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
14
14
 
15
- var styles = {"component":"gallery__component_1cxw3","swiper":"gallery__swiper_1cxw3","singleSlide":"gallery__singleSlide_1cxw3","hidden":"gallery__hidden_1cxw3","slide":"gallery__slide_1cxw3","slideLoading":"gallery__slideLoading_1cxw3","image":"gallery__image_1cxw3","smallImage":"gallery__smallImage_1cxw3","verticalImageFit":"gallery__verticalImageFit_1cxw3","horizontalImageFit":"gallery__horizontalImageFit_1cxw3","arrow":"gallery__arrow_1cxw3","focused":"gallery__focused_1cxw3","placeholder":"gallery__placeholder_1cxw3","brokenImgWrapper":"gallery__brokenImgWrapper_1cxw3","brokenImgIcon":"gallery__brokenImgIcon_1cxw3","fullScreenImage":"gallery__fullScreenImage_1cxw3"};
15
+ var styles = {"component":"gallery__component_1fi6a","swiper":"gallery__swiper_1fi6a","singleSlide":"gallery__singleSlide_1fi6a","hidden":"gallery__hidden_1fi6a","slide":"gallery__slide_1fi6a","slideLoading":"gallery__slideLoading_1fi6a","image":"gallery__image_1fi6a","smallImage":"gallery__smallImage_1fi6a","verticalImageFit":"gallery__verticalImageFit_1fi6a","horizontalImageFit":"gallery__horizontalImageFit_1fi6a","arrow":"gallery__arrow_1fi6a","focused":"gallery__focused_1fi6a","placeholder":"gallery__placeholder_1fi6a","brokenImgWrapper":"gallery__brokenImgWrapper_1fi6a","brokenImgIcon":"gallery__brokenImgIcon_1fi6a","fullScreenImage":"gallery__fullScreenImage_1fi6a"};
16
16
  require('./components/image-viewer/index.css')
17
17
 
18
18
  var SlideInner = function (_a) {