@prom-ui/core 0.0.24 → 0.0.32

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 (221) hide show
  1. package/Body/cjs/index.development.js +14 -0
  2. package/Body/cjs/index.production.js +1 -0
  3. package/Body/cjs/style.development.css +1 -0
  4. package/Body/cjs/style.production.css +1 -0
  5. package/Body/index.js +5 -12
  6. package/Body/package.json +1 -1
  7. package/Box/cjs/index.development.js +20 -0
  8. package/Box/cjs/index.production.js +1 -0
  9. package/Box/cjs/style.development.css +1 -0
  10. package/Box/cjs/style.production.css +1 -0
  11. package/Box/index.js +5 -18
  12. package/Box/package.json +1 -1
  13. package/Button/cjs/index.development.js +95 -0
  14. package/Button/cjs/index.production.js +1 -0
  15. package/Button/cjs/style.development.css +1 -0
  16. package/Button/cjs/style.production.css +1 -0
  17. package/Button/index.d.ts +5 -4
  18. package/Button/index.js +4 -81
  19. package/Button/package.json +1 -1
  20. package/ButtonPageUp/cjs/index.development.js +170 -0
  21. package/ButtonPageUp/cjs/index.production.js +1 -0
  22. package/ButtonPageUp/index.d.ts +12 -5
  23. package/ButtonPageUp/index.js +4 -169
  24. package/ButtonPageUp/package.json +1 -2
  25. package/Checkbox/cjs/index.development.js +111 -0
  26. package/Checkbox/cjs/index.production.js +1 -0
  27. package/Checkbox/cjs/style.development.css +1 -0
  28. package/Checkbox/cjs/style.production.css +1 -0
  29. package/Checkbox/index.d.ts +4 -4
  30. package/Checkbox/index.js +4 -96
  31. package/Checkbox/package.json +1 -1
  32. package/Flex/cjs/index.development.js +25 -0
  33. package/Flex/cjs/index.production.js +1 -0
  34. package/Flex/cjs/style.development.css +1 -0
  35. package/Flex/cjs/style.production.css +1 -0
  36. package/Flex/index.js +5 -23
  37. package/Flex/package.json +1 -1
  38. package/Grid/cjs/index.development.js +25 -0
  39. package/Grid/cjs/index.production.js +1 -0
  40. package/Grid/cjs/style.development.css +1 -0
  41. package/Grid/cjs/style.production.css +1 -0
  42. package/Grid/index.js +5 -23
  43. package/Grid/package.json +1 -1
  44. package/Icon/cjs/index.development.js +41 -0
  45. package/Icon/cjs/index.production.js +1 -0
  46. package/Icon/cjs/style.development.css +1 -0
  47. package/Icon/cjs/style.production.css +1 -0
  48. package/Icon/index.d.ts +7 -12
  49. package/Icon/index.js +4 -76
  50. package/Icon/package.json +1 -1
  51. package/Image/cjs/index.development.js +20 -0
  52. package/Image/cjs/index.production.js +1 -0
  53. package/Image/cjs/style.development.css +1 -0
  54. package/Image/cjs/style.production.css +1 -0
  55. package/Image/index.js +5 -18
  56. package/Image/package.json +1 -1
  57. package/ImageEmoji/cjs/index.development.js +90 -0
  58. package/ImageEmoji/cjs/index.production.js +1 -0
  59. package/ImageEmoji/index.d.ts +6 -4
  60. package/ImageEmoji/index.js +4 -86
  61. package/ImageEmoji/package.json +1 -1
  62. package/Input/cjs/index.development.js +39 -0
  63. package/Input/cjs/index.production.js +1 -0
  64. package/Input/cjs/style.development.css +1 -0
  65. package/Input/cjs/style.production.css +1 -0
  66. package/Input/index.d.ts +23 -23
  67. package/Input/index.js +4 -81
  68. package/Input/package.json +1 -1
  69. package/KeyPress/cjs/index.development.js +56 -0
  70. package/KeyPress/cjs/index.production.js +1 -0
  71. package/KeyPress/index.d.ts +8 -7
  72. package/KeyPress/index.js +5 -53
  73. package/KeyPress/package.json +2 -5
  74. package/Line/cjs/index.development.js +20 -0
  75. package/Line/cjs/index.production.js +1 -0
  76. package/Line/cjs/style.development.css +1 -0
  77. package/Line/cjs/style.production.css +1 -0
  78. package/Line/index.js +5 -18
  79. package/Line/package.json +1 -1
  80. package/Link/cjs/index.development.js +22 -0
  81. package/Link/cjs/index.production.js +1 -0
  82. package/Link/cjs/style.development.css +1 -0
  83. package/Link/cjs/style.production.css +1 -0
  84. package/Link/index.js +5 -20
  85. package/Link/package.json +1 -1
  86. package/List/cjs/index.development.js +25 -0
  87. package/List/cjs/index.production.js +1 -0
  88. package/List/cjs/style.development.css +1 -0
  89. package/List/cjs/style.production.css +1 -0
  90. package/List/index.js +5 -23
  91. package/List/package.json +1 -1
  92. package/Media/cjs/index.development.js +98 -0
  93. package/Media/cjs/index.production.js +1 -0
  94. package/Media/context.d.ts +2 -2
  95. package/Media/index.d.ts +9 -11
  96. package/Media/index.js +5 -73
  97. package/Media/package.json +1 -1
  98. package/Media/useMedia.d.ts +7 -0
  99. package/OutsideClick/cjs/index.development.js +84 -0
  100. package/OutsideClick/cjs/index.production.js +1 -0
  101. package/OutsideClick/index.d.ts +6 -3
  102. package/OutsideClick/index.js +4 -74
  103. package/OutsideClick/package.json +2 -5
  104. package/Picture/cjs/index.development.js +25 -0
  105. package/Picture/cjs/index.production.js +1 -0
  106. package/Picture/cjs/style.development.css +1 -0
  107. package/Picture/cjs/style.production.css +1 -0
  108. package/Picture/index.js +5 -23
  109. package/Picture/package.json +1 -1
  110. package/PortableOverlay/cjs/index.development.js +111 -0
  111. package/PortableOverlay/cjs/index.production.js +1 -0
  112. package/PortableOverlay/cjs/style.development.css +1 -0
  113. package/PortableOverlay/cjs/style.production.css +1 -0
  114. package/PortableOverlay/index.d.ts +6 -4
  115. package/PortableOverlay/index.js +5 -112
  116. package/PortableOverlay/package.json +1 -2
  117. package/Portal/cjs/index.development.js +57 -0
  118. package/Portal/cjs/index.production.js +1 -0
  119. package/Portal/index.d.ts +6 -4
  120. package/Portal/index.js +5 -52
  121. package/Portal/package.json +2 -5
  122. package/Rating/cjs/index.development.js +105 -0
  123. package/Rating/cjs/index.production.js +1 -0
  124. package/Rating/cjs/style.development.css +1 -0
  125. package/Rating/cjs/style.production.css +1 -0
  126. package/Rating/index.d.ts +6 -5
  127. package/Rating/index.js +4 -98
  128. package/Rating/package.json +1 -1
  129. package/SafeQuery/cjs/index.development.js +181 -0
  130. package/SafeQuery/cjs/index.production.js +1 -0
  131. package/SafeQuery/cjs/style.development.css +1 -0
  132. package/SafeQuery/cjs/style.production.css +1 -0
  133. package/SafeQuery/components/Error.d.ts +2 -2
  134. package/SafeQuery/index.d.ts +7 -4
  135. package/SafeQuery/index.js +4 -173
  136. package/SafeQuery/package.json +1 -1
  137. package/Scroll/cjs/index.development.js +40 -0
  138. package/Scroll/cjs/index.production.js +1 -0
  139. package/Scroll/cjs/style.development.css +1 -0
  140. package/Scroll/cjs/style.production.css +1 -0
  141. package/Scroll/index.d.ts +18 -16
  142. package/Scroll/index.js +4 -76
  143. package/Scroll/package.json +1 -1
  144. package/ScrollControls/cjs/index.development.js +243 -0
  145. package/ScrollControls/cjs/index.production.js +1 -0
  146. package/ScrollControls/cjs/style.development.css +1 -0
  147. package/ScrollControls/cjs/style.production.css +1 -0
  148. package/ScrollControls/index.d.ts +16 -6
  149. package/ScrollControls/index.js +4 -244
  150. package/ScrollControls/package.json +1 -2
  151. package/SideOverlay/cjs/index.development.js +210 -0
  152. package/SideOverlay/cjs/index.production.js +1 -0
  153. package/SideOverlay/cjs/style.development.css +1 -0
  154. package/SideOverlay/cjs/style.production.css +1 -0
  155. package/SideOverlay/index.d.ts +29 -14
  156. package/SideOverlay/index.js +4 -251
  157. package/SideOverlay/package.json +1 -1
  158. package/SimpleSlider/cjs/index.development.js +433 -0
  159. package/SimpleSlider/cjs/index.production.js +1 -0
  160. package/SimpleSlider/cjs/style.development.css +1 -0
  161. package/SimpleSlider/cjs/style.production.css +1 -0
  162. package/SimpleSlider/index.d.ts +17 -3
  163. package/SimpleSlider/index.js +4 -477
  164. package/SimpleSlider/package.json +1 -1
  165. package/Skeleton/cjs/index.development.js +103 -0
  166. package/Skeleton/cjs/index.production.js +1 -0
  167. package/Skeleton/cjs/style.development.css +1 -0
  168. package/Skeleton/cjs/style.production.css +1 -0
  169. package/Skeleton/index.d.ts +9 -5
  170. package/Skeleton/index.js +4 -110
  171. package/Skeleton/package.json +1 -1
  172. package/Spinner/cjs/index.development.js +85 -0
  173. package/Spinner/cjs/index.production.js +1 -0
  174. package/Spinner/cjs/style.development.css +1 -0
  175. package/Spinner/cjs/style.production.css +1 -0
  176. package/Spinner/index.d.ts +7 -6
  177. package/Spinner/index.js +5 -76
  178. package/Spinner/package.json +1 -1
  179. package/Text/cjs/index.development.js +20 -0
  180. package/Text/cjs/index.production.js +1 -0
  181. package/Text/cjs/style.development.css +1 -0
  182. package/Text/cjs/style.production.css +1 -0
  183. package/Text/index.js +5 -18
  184. package/Text/package.json +1 -1
  185. package/TextEmoji/cjs/index.development.js +94 -0
  186. package/TextEmoji/cjs/index.production.js +1 -0
  187. package/TextEmoji/index.d.ts +4 -4
  188. package/TextEmoji/index.js +4 -84
  189. package/TextEmoji/package.json +1 -1
  190. package/Tumbler/cjs/index.development.js +110 -0
  191. package/Tumbler/cjs/index.production.js +1 -0
  192. package/Tumbler/cjs/style.development.css +1 -0
  193. package/Tumbler/cjs/style.production.css +1 -0
  194. package/Tumbler/index.d.ts +4 -4
  195. package/Tumbler/index.js +4 -95
  196. package/Tumbler/package.json +1 -1
  197. package/package.json +7 -10
  198. package/Body/style.css +0 -741
  199. package/Box/style.css +0 -9676
  200. package/Button/style.css +0 -3393
  201. package/Checkbox/style.css +0 -133
  202. package/Flex/style.css +0 -786
  203. package/Grid/style.css +0 -7350
  204. package/Icon/style.css +0 -46
  205. package/Image/style.css +0 -664
  206. package/Input/style.css +0 -345
  207. package/Line/style.css +0 -138
  208. package/Link/style.css +0 -259
  209. package/List/style.css +0 -312
  210. package/Picture/style.css +0 -1426
  211. package/PortableOverlay/style.css +0 -44
  212. package/Rating/style.css +0 -26
  213. package/SafeQuery/style.css +0 -4
  214. package/Scroll/style.css +0 -169
  215. package/ScrollControls/style.css +0 -67
  216. package/SideOverlay/style.css +0 -208
  217. package/SimpleSlider/style.css +0 -134
  218. package/Skeleton/style.css +0 -145
  219. package/Spinner/style.css +0 -80
  220. package/Text/style.css +0 -840
  221. package/Tumbler/style.css +0 -118
@@ -1,254 +1,7 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
- var ttag = require('ttag');
7
- var PropTypes = require('prop-types');
8
- var ScrollLock = require('react-scrolllock');
9
- var Portal = require('@prom-ui/core/Portal');
10
- var KeyPress = require('@prom-ui/core/KeyPress');
11
- var evokit = require('evokit');
12
- var reactTransitionGroup = require('react-transition-group');
13
-
14
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
-
16
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
17
- var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
18
- var ScrollLock__default = /*#__PURE__*/_interopDefaultLegacy(ScrollLock);
19
-
20
- /******************************************************************************
21
- Copyright (c) Microsoft Corporation.
22
-
23
- Permission to use, copy, modify, and/or distribute this software for any
24
- purpose with or without fee is hereby granted.
25
-
26
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
27
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
28
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
29
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
30
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
31
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
32
- PERFORMANCE OF THIS SOFTWARE.
33
- ***************************************************************************** */
34
-
35
- var __assign = function() {
36
- __assign = Object.assign || function __assign(t) {
37
- for (var s, i = 1, n = arguments.length; i < n; i++) {
38
- s = arguments[i];
39
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
40
- }
41
- return t;
42
- };
43
- return __assign.apply(this, arguments);
44
- };
45
-
46
- function __rest(s, e) {
47
- var t = {};
48
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
49
- t[p] = s[p];
50
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
51
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
52
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
53
- t[p[i]] = s[p[i]];
54
- }
55
- return t;
56
- }
57
-
58
- function __makeTemplateObject(cooked, raw) {
59
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
60
- return cooked;
3
+ if (process.env.NODE_ENV === 'production') {
4
+ module.exports = require('./cjs/index.production.js');
5
+ } else {
6
+ module.exports = require('./cjs/index.development.js');
61
7
  }
62
-
63
- var css = {"root":"SideOverlay__root___zoSc7","backdrop":"SideOverlay__backdrop___v5Neh","popup":"SideOverlay__popup___LsB4w","content":"SideOverlay__content___D9ezA","close":"SideOverlay__close___aiN5k","popup_placement_top":"SideOverlay__popup_placement_top___BSFf7","popup_placement_bottom":"SideOverlay__popup_placement_bottom___k1gGY","popup_placement_right":"SideOverlay__popup_placement_right___w9HUr","popup_placement_left":"SideOverlay__popup_placement_left___DWBxa","enter":"SideOverlay__enter___ukL-B","exit":"SideOverlay__exit___QE5yq","enterActive":"SideOverlay__enterActive___VPRAq","exitActive":"SideOverlay__exitActive___FhiSX"};
64
-
65
- var BLOCKS_PRESET = {
66
- css: css,
67
- b: ''
68
- };
69
- var Root = evokit.createBlock('div', 'root', [], BLOCKS_PRESET);
70
- var Backdrop = evokit.createBlock('div', 'backdrop', [], BLOCKS_PRESET);
71
- var Popup = evokit.createBlock('div', 'popup', ['placement'], BLOCKS_PRESET);
72
- var Content = evokit.createBlock('div', 'content', [], BLOCKS_PRESET);
73
- var Close = evokit.createBlock('button', 'close', [], BLOCKS_PRESET);
74
- var Animate = function (_a) {
75
- var _b = _a.open,
76
- open = _b === void 0 ? false : _b,
77
- children = _a.children,
78
- _c = _a.enabled,
79
- enabled = _c === void 0 ? true : _c,
80
- onEnter = _a.onEnter;
81
- return React__default["default"].createElement(reactTransitionGroup.CSSTransition, {
82
- in: open,
83
- timeout: enabled ? 225 : 0,
84
- classNames: css,
85
- unmountOnExit: true,
86
- onEnter: onEnter
87
- }, children);
88
- };
89
-
90
- var getPopupStyle = function (placement, size) {
91
- if (['top', 'bottom'].includes(placement)) {
92
- return {
93
- height: size
94
- };
95
- }
96
-
97
- return {
98
- width: size
99
- };
100
- };
101
-
102
- var SideOverlay = function (_a) {
103
- var children = _a.children,
104
- _b = _a.classNames,
105
- classNames = _b === void 0 ? {} : _b,
106
- onClose = _a.onClose,
107
- onOpen = _a.onOpen,
108
- _c = _a.open,
109
- open = _c === void 0 ? false : _c,
110
- _d = _a.padding,
111
- padding = _d === void 0 ? '45px 30px 30px 30px' : _d,
112
- _e = _a.placement,
113
- placement = _e === void 0 ? 'left' : _e,
114
- _f = _a.size,
115
- size = _f === void 0 ? 400 : _f,
116
- _g = _a.useCloseButton,
117
- useCloseButton = _g === void 0 ? true : _g,
118
- _h = _a.useEscapeClose,
119
- useEscapeClose = _h === void 0 ? true : _h,
120
- _j = _a.useOutsideClose,
121
- useOutsideClose = _j === void 0 ? true : _j,
122
- _k = _a.usePortal,
123
- usePortal = _k === void 0 ? true : _k,
124
- _l = _a.useScrollLock,
125
- useScrollLock = _l === void 0 ? true : _l,
126
- _m = _a.useTouchScrollable,
127
- useTouchScrollable = _m === void 0 ? true : _m,
128
- _o = _a.zIndex,
129
- zIndex = _o === void 0 ? 5000 : _o,
130
- dataQaId = _a.dataQaId,
131
- contentRef = _a.contentRef,
132
- _p = _a.animationEnabled,
133
- animationEnabled = _p === void 0 ? true : _p,
134
- props = __rest(_a, ["children", "classNames", "onClose", "onOpen", "open", "padding", "placement", "size", "useCloseButton", "useEscapeClose", "useOutsideClose", "usePortal", "useScrollLock", "useTouchScrollable", "zIndex", "dataQaId", "contentRef", "animationEnabled"]);
135
-
136
- return React__default["default"].createElement(Animate, {
137
- open: open,
138
- onEnter: function () {
139
- onOpen && onOpen();
140
- },
141
- enabled: animationEnabled
142
- }, React__default["default"].createElement(Portal.Portal, {
143
- isActive: usePortal
144
- }, React__default["default"].createElement(Root, __assign({
145
- role: 'presentation',
146
- style: {
147
- zIndex: zIndex
148
- },
149
- className: classNames.Root
150
- }, props), React__default["default"].createElement(ScrollLock__default["default"], {
151
- isActive: useScrollLock
152
- }), React__default["default"].createElement(KeyPress.KeyPress, {
153
- isActive: useEscapeClose,
154
- code: 'Escape',
155
- onKeyDown: onClose
156
- }), React__default["default"].createElement(Backdrop, {
157
- className: classNames.Backdrop,
158
- "aria-hidden": true,
159
- onClick: function () {
160
- if (useOutsideClose && onClose) {
161
- onClose();
162
- }
163
- }
164
- }), React__default["default"].createElement(Popup, {
165
- "popup-placement": placement,
166
- className: classNames.Popup,
167
- style: getPopupStyle(placement, size),
168
- "data-qaid": dataQaId
169
- }, useCloseButton && onClose && React__default["default"].createElement(Close, {
170
- className: classNames.Close,
171
- type: 'button',
172
- onClick: onClose,
173
- "aria-label": ttag.t(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\u0417\u0430\u043A\u0440\u044B\u0442\u044C"], ["\u0417\u0430\u043A\u0440\u044B\u0442\u044C"]))),
174
- "data-qaid": 'close'
175
- }), useTouchScrollable ? React__default["default"].createElement(ScrollLock.TouchScrollable, null, React__default["default"].createElement(Content, {
176
- ref: contentRef,
177
- className: classNames.Content,
178
- style: {
179
- padding: padding
180
- }
181
- }, children)) : React__default["default"].createElement(Content, {
182
- ref: contentRef,
183
- className: classNames.Content,
184
- style: {
185
- padding: padding
186
- }
187
- }, children)))));
188
- };
189
- SideOverlay.propTypes = {
190
- /** React children */
191
- // children: PropTypes.node,
192
-
193
- /** Кастомные классы */
194
- // classNames: PropTypes.shape({
195
- // Root: PropTypes.string,
196
- // Backdrop: PropTypes.string,
197
- // Popup: PropTypes.string,
198
- // Content: PropTypes.string,
199
- // Close: PropTypes.string,
200
- // }),
201
-
202
- /** Handle для закрытия попапа */
203
- onClose: PropTypes__default["default"].func,
204
-
205
- /** Срабатывает когда попап открыт */
206
- onOpen: PropTypes__default["default"].func,
207
-
208
- /** Состояние, открыто или нет */
209
- open: PropTypes__default["default"].bool,
210
-
211
- /** Внутренние отступы */
212
- padding: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
213
-
214
- /** Расположение */
215
- placement: PropTypes__default["default"].oneOf(['top', 'right', 'bottom', 'left']),
216
-
217
- /** Ширина или высота взависимости от placement */
218
- size: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
219
-
220
- /** Отображение кнопки закрытия (крестик) */
221
- useCloseButton: PropTypes__default["default"].bool,
222
-
223
- /** Разрешает закрыть попап по клавише `Escape` */
224
- useEscapeClose: PropTypes__default["default"].bool,
225
-
226
- /** Разрешает закрытие при клике на свободное пространство (затемнение документа) */
227
- useOutsideClose: PropTypes__default["default"].bool,
228
-
229
- /** Рендер в конец `<body>` */
230
- usePortal: PropTypes__default["default"].bool,
231
-
232
- /** Запрещает прокрутку `<body>` */
233
- useScrollLock: PropTypes__default["default"].bool,
234
-
235
- /** Запрещает прокрутку `<body>` для ios */
236
- useTouchScrollable: PropTypes__default["default"].bool,
237
-
238
- /** Размещением по z-оси */
239
- zIndex: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
240
-
241
- /** HTML Атрибут `data-qaid` для автотестов */
242
- dataQaId: PropTypes__default["default"].string,
243
-
244
- /** `ref` для блока с контентом */
245
- // contentRef: PropTypes.shape({ current: PropTypes.any }),
246
-
247
- /** Включает/отключает анимацию открытия/скрытия шторки */
248
- animationEnabled: PropTypes__default["default"].bool
249
- };
250
- var templateObject_1;
251
-
252
- exports.SideOverlay = SideOverlay;
253
-
254
- require('./style.css');
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@prom-ui/core/SideOverlay",
3
- "version": "0.0.24",
3
+ "version": "0.0.32",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -0,0 +1,433 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var React = require('react');
6
+ var ttag = require('ttag');
7
+ var Swipe = require('react-easy-swipe');
8
+ var classNames = require('classnames');
9
+ require('intersection-observer');
10
+ var Button = require('@prom-ui/core/Button');
11
+
12
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
13
+
14
+ function _interopNamespace(e) {
15
+ if (e && e.__esModule) return e;
16
+ var n = Object.create(null);
17
+ if (e) {
18
+ Object.keys(e).forEach(function (k) {
19
+ if (k !== 'default') {
20
+ var d = Object.getOwnPropertyDescriptor(e, k);
21
+ Object.defineProperty(n, k, d.get ? d : {
22
+ enumerable: true,
23
+ get: function () { return e[k]; }
24
+ });
25
+ }
26
+ });
27
+ }
28
+ n["default"] = e;
29
+ return Object.freeze(n);
30
+ }
31
+
32
+ var React__namespace = /*#__PURE__*/_interopNamespace(React);
33
+ var Swipe__default = /*#__PURE__*/_interopDefaultLegacy(Swipe);
34
+ var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
35
+
36
+ /******************************************************************************
37
+ Copyright (c) Microsoft Corporation.
38
+
39
+ Permission to use, copy, modify, and/or distribute this software for any
40
+ purpose with or without fee is hereby granted.
41
+
42
+ THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
43
+ REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
44
+ AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
45
+ INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
46
+ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
47
+ OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
48
+ PERFORMANCE OF THIS SOFTWARE.
49
+ ***************************************************************************** */
50
+
51
+ var __assign = function() {
52
+ __assign = Object.assign || function __assign(t) {
53
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
54
+ s = arguments[i];
55
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
56
+ }
57
+ return t;
58
+ };
59
+ return __assign.apply(this, arguments);
60
+ };
61
+
62
+ function __rest(s, e) {
63
+ var t = {};
64
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
65
+ t[p] = s[p];
66
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
67
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
68
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
69
+ t[p[i]] = s[p[i]];
70
+ }
71
+ return t;
72
+ }
73
+
74
+ function __makeTemplateObject(cooked, raw) {
75
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
76
+ return cooked;
77
+ }
78
+
79
+ var useAutoPlay = function (callback, delay) {
80
+ var timeout = React.useRef(null);
81
+
82
+ var stop = function () {
83
+ clearTimeout(timeout.current);
84
+ };
85
+
86
+ var start = function () {
87
+ stop();
88
+ timeout.current = setTimeout(callback, delay);
89
+ };
90
+
91
+ return [start, stop];
92
+ };
93
+
94
+ var isValidRatio = function (ratio) {
95
+ return !!ratio && /\d\/\d/.test(ratio);
96
+ };
97
+ var getInfiniteIndex = function (index, count) {
98
+ return Math.abs((index % count + count) % count);
99
+ };
100
+ var getRatioHolderStyle = function (ratio) {
101
+ return {
102
+ paddingTop: "calc(".concat(ratio.split('/').reverse().join('/'), " * 100%)")
103
+ };
104
+ };
105
+ var getRootStyle = function (_a) {
106
+ var width = _a.width,
107
+ height = _a.height,
108
+ ratio = _a.ratio,
109
+ style = _a.style;
110
+ var hasRatio = isValidRatio(ratio);
111
+ return __assign({
112
+ width: width,
113
+ height: hasRatio ? 'auto' : height,
114
+ maxWidth: hasRatio ? '100%' : 'none',
115
+ aspectRatio: hasRatio ? ratio : undefined
116
+ }, style);
117
+ };
118
+ var getTrackStyle = function (_a) {
119
+ var index = _a.index,
120
+ childrenCount = _a.childrenCount,
121
+ duration = _a.duration,
122
+ offset = _a.offset;
123
+ var hasOffset = typeof offset === 'number';
124
+ var currentOffset = hasOffset ? offset : 0;
125
+ return {
126
+ transform: "translateX(calc(".concat(index * (100 / childrenCount) * -1, "% + ").concat(currentOffset, "px))"),
127
+ transition: hasOffset ? undefined : "transform ".concat(duration, "ms ease"),
128
+ width: "".concat(childrenCount * 100, "%") // willChange: 'transform',
129
+
130
+ };
131
+ };
132
+
133
+ var css = {"root":"SimpleSlider__root___WuTIM","track":"SimpleSlider__track___G8BYu","trackItem":"SimpleSlider__trackItem___94Eq7","buttonCommon":"SimpleSlider__buttonCommon___I5yQD","buttonPrev":"SimpleSlider__buttonPrev___UqTOk SimpleSlider__buttonCommon___I5yQD","buttonNext":"SimpleSlider__buttonNext___BbLNv SimpleSlider__buttonCommon___I5yQD","buttonIcon":"SimpleSlider__buttonIcon___89h6n","showOnHoverButtons":"SimpleSlider__showOnHoverButtons___yssoj","dots":"SimpleSlider__dots___E7g4J","dotsItem":"SimpleSlider__dotsItem___cbWCu","dotsButton":"SimpleSlider__dotsButton___7N4yb","showOnHoverDots":"SimpleSlider__showOnHoverDots___ig5DV"};
134
+
135
+ var SimpleSlider = React__namespace.forwardRef(function (_a, ref) {
136
+ var _b;
137
+
138
+ var _c = _a.autoPlay,
139
+ autoPlay = _c === void 0 ? 0 : _c,
140
+ children = _a.children,
141
+ className = _a.className,
142
+ _d = _a.duration,
143
+ duration = _d === void 0 ? 500 : _d,
144
+ height = _a.height,
145
+ _e = _a.infinite,
146
+ infinite = _e === void 0 ? false : _e,
147
+ ratio = _a.ratio,
148
+ style = _a.style,
149
+ width = _a.width,
150
+ onChangeIndex = _a.onChangeIndex,
151
+ onClickDot = _a.onClickDot,
152
+ onClickItem = _a.onClickItem,
153
+ onClickButtonNext = _a.onClickButtonNext,
154
+ onClickButtonPrev = _a.onClickButtonPrev,
155
+ onSwipeNext = _a.onSwipeNext,
156
+ onSwipePrev = _a.onSwipePrev,
157
+ _f = _a.showOnHoverButtons,
158
+ showOnHoverButtons = _f === void 0 ? false : _f,
159
+ _g = _a.showOnHoverDots,
160
+ showOnHoverDots = _g === void 0 ? false : _g,
161
+ props = __rest(_a, ["autoPlay", "children", "className", "duration", "height", "infinite", "ratio", "style", "width", "onChangeIndex", "onClickDot", "onClickItem", "onClickButtonNext", "onClickButtonPrev", "onSwipeNext", "onSwipePrev", "showOnHoverButtons", "showOnHoverDots"]);
162
+
163
+ var refTrack = React__namespace.useRef(null);
164
+ var transitionRunning = React__namespace.useRef(false);
165
+
166
+ var _h = React__namespace.useState(false),
167
+ disableAutoPlay = _h[0],
168
+ setDisableAutoPlay = _h[1];
169
+
170
+ var _j = React__namespace.useState({
171
+ index: 0,
172
+ offset: undefined
173
+ }),
174
+ position = _j[0],
175
+ setPosition = _j[1];
176
+
177
+ var childrenCount = React__namespace.Children.count(children);
178
+ var childrenArray = React__namespace.Children.toArray(children);
179
+ var isDisablePrev = !infinite && position.index === 0;
180
+ var isDisableNext = !infinite && position.index === childrenCount - 1;
181
+ var isShowNavi = childrenCount > 1;
182
+ var isShowDots = childrenCount > 1;
183
+ var isAutoPlay = !disableAutoPlay && autoPlay > 0;
184
+ var prevIndex = position.index - 1;
185
+ var nextIndex = position.index + 1;
186
+ var infiniteIndex = getInfiniteIndex(position.index, childrenCount);
187
+ var infinitePrevIndex = getInfiniteIndex(prevIndex, childrenCount);
188
+ var infiniteNextIndex = getInfiniteIndex(nextIndex, childrenCount);
189
+
190
+ var handleClickButtonNext = function () {
191
+ if (transitionRunning.current || isDisableNext) return;
192
+
193
+ if (typeof onClickButtonNext === 'function') {
194
+ onClickButtonNext(infiniteNextIndex);
195
+ }
196
+
197
+ setPosition({
198
+ index: nextIndex,
199
+ offset: undefined
200
+ });
201
+ };
202
+
203
+ var handleClickButtonPrev = function () {
204
+ if (transitionRunning.current || isDisablePrev) return;
205
+
206
+ if (typeof onClickButtonPrev === 'function') {
207
+ onClickButtonPrev(infinitePrevIndex);
208
+ }
209
+
210
+ setPosition({
211
+ index: prevIndex,
212
+ offset: undefined
213
+ });
214
+ };
215
+
216
+ var handleClickDot = function (i) {
217
+ if (transitionRunning.current) return;
218
+
219
+ if (typeof onClickDot === 'function') {
220
+ onClickDot(i);
221
+ }
222
+
223
+ setPosition({
224
+ index: i,
225
+ offset: undefined
226
+ });
227
+ };
228
+
229
+ var handleSwipeNext = function () {
230
+ if (transitionRunning.current || isDisableNext) return;
231
+
232
+ if (typeof onSwipeNext === 'function') {
233
+ onSwipeNext(infiniteNextIndex);
234
+ }
235
+
236
+ setPosition({
237
+ index: nextIndex,
238
+ offset: undefined
239
+ });
240
+ };
241
+
242
+ var handleSwipePrev = function () {
243
+ if (transitionRunning.current || isDisablePrev) return;
244
+
245
+ if (typeof onSwipePrev === 'function') {
246
+ onSwipePrev(infinitePrevIndex);
247
+ }
248
+
249
+ setPosition({
250
+ index: prevIndex,
251
+ offset: undefined
252
+ });
253
+ };
254
+
255
+ var handleSwipeMove = function (_a, event) {
256
+ var x = _a.x;
257
+ if (transitionRunning.current || event.touches && event.touches.length > 1) return;
258
+ var offset = x;
259
+
260
+ if (isDisablePrev && x > 0 || isDisableNext && x < 0) {
261
+ offset = 0;
262
+ }
263
+
264
+ setPosition({
265
+ index: position.index,
266
+ offset: offset
267
+ });
268
+ };
269
+
270
+ var _k = useAutoPlay(function () {
271
+ if (transitionRunning.current || isDisableNext) return;
272
+ setPosition({
273
+ index: nextIndex,
274
+ offset: undefined
275
+ });
276
+ }, autoPlay),
277
+ startAutoPlay = _k[0],
278
+ stopAutoPlay = _k[1];
279
+
280
+ var handleTransitionStart = function () {
281
+ transitionRunning.current = true;
282
+ stopAutoPlay();
283
+ };
284
+
285
+ var handleTransitionEnd = function () {
286
+ transitionRunning.current = false;
287
+
288
+ if (isAutoPlay) {
289
+ startAutoPlay();
290
+ }
291
+
292
+ if (!(position.index in childrenArray)) {
293
+ setPosition({
294
+ index: infiniteIndex,
295
+ offset: 0
296
+ });
297
+ }
298
+
299
+ if (typeof onChangeIndex === 'function') {
300
+ onChangeIndex(infiniteIndex);
301
+ }
302
+ };
303
+
304
+ React__namespace.useEffect(function () {
305
+ var _a, _b;
306
+
307
+ var autoPlayObserver = new IntersectionObserver(function (entries) {
308
+ if (entries[0].isIntersecting) {
309
+ startAutoPlay();
310
+ } else {
311
+ stopAutoPlay();
312
+ }
313
+ });
314
+ (_a = refTrack.current) === null || _a === void 0 ? void 0 : _a.addEventListener('transitionstart', handleTransitionStart);
315
+ (_b = refTrack.current) === null || _b === void 0 ? void 0 : _b.addEventListener('transitionend', handleTransitionEnd);
316
+
317
+ if (isAutoPlay && refTrack.current) {
318
+ autoPlayObserver.observe(refTrack.current);
319
+ }
320
+
321
+ return function () {
322
+ var _a, _b;
323
+
324
+ (_a = refTrack.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('transitionstart', handleTransitionStart);
325
+ (_b = refTrack.current) === null || _b === void 0 ? void 0 : _b.removeEventListener('transitionend', handleTransitionEnd);
326
+ stopAutoPlay();
327
+ autoPlayObserver.disconnect();
328
+ };
329
+ }, [position.index, isAutoPlay]);
330
+ return React__namespace.createElement(Swipe__default["default"], __assign({
331
+ ref: ref,
332
+ onSwipeLeft: handleSwipeNext,
333
+ onSwipeRight: handleSwipePrev,
334
+ onSwipeMove: handleSwipeMove,
335
+ className: classNames__default["default"](css.root, className, (_b = {}, _b[css.showOnHoverButtons] = showOnHoverButtons, _b[css.showOnHoverDots] = showOnHoverDots, _b)),
336
+ style: getRootStyle({
337
+ width: width,
338
+ height: height,
339
+ ratio: ratio,
340
+ style: style
341
+ }),
342
+ onSwipeStart: function () {
343
+ return setDisableAutoPlay(true);
344
+ },
345
+ onSwipeEnd: function () {
346
+ return setDisableAutoPlay(false);
347
+ },
348
+ onMouseEnter: function () {
349
+ return setDisableAutoPlay(true);
350
+ },
351
+ onMouseLeave: function () {
352
+ return setDisableAutoPlay(false);
353
+ }
354
+ }, props), isValidRatio(ratio) && React__namespace.createElement("div", {
355
+ style: getRatioHolderStyle(ratio)
356
+ }), React__namespace.createElement("ul", {
357
+ ref: refTrack,
358
+ className: css.track,
359
+ style: getTrackStyle({
360
+ index: infinite ? position.index + 1 : position.index,
361
+ childrenCount: infinite ? childrenCount + 2 : childrenCount,
362
+ duration: duration,
363
+ offset: position.offset
364
+ })
365
+ }, infinite && React__namespace.createElement("li", {
366
+ className: css.trackItem
367
+ }, childrenArray[childrenArray.length - 1]), childrenArray.map(function (child, index) {
368
+ return React__namespace.createElement("li", {
369
+ key: child.key,
370
+ className: css.trackItem,
371
+ onClick: function () {
372
+ if (typeof onClickItem === 'function') {
373
+ onClickItem(index);
374
+ }
375
+ },
376
+ "data-qaid": "image_slider_".concat(index)
377
+ }, child);
378
+ }), infinite && React__namespace.createElement("li", {
379
+ className: css.trackItem
380
+ }, childrenArray[0])), isShowNavi && React__namespace.createElement(React__namespace.Fragment, null, React__namespace.createElement(Button.Button, {
381
+ type: 'button',
382
+ className: css.buttonPrev,
383
+ onClick: handleClickButtonPrev,
384
+ disabled: isDisablePrev,
385
+ "aria-label": ttag.t(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043F\u0440\u0435\u0434\u044B\u0434\u0443\u0449\u0438\u0439 \u0431\u0430\u043D\u043D\u0435\u0440"], ["\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043F\u0440\u0435\u0434\u044B\u0434\u0443\u0449\u0438\u0439 \u0431\u0430\u043D\u043D\u0435\u0440"]))),
386
+ "data-qaid": 'prev_image'
387
+ }, React__namespace.createElement("svg", {
388
+ className: css.buttonIcon,
389
+ width: 18,
390
+ height: 18,
391
+ viewBox: '0 0 64 64',
392
+ xmlns: 'http://www.w3.org/2000/svg'
393
+ }, React__namespace.createElement("path", {
394
+ d: 'M41.625 60.375L16 32 41.625 3.625 48.5 10 28.375 32 48.5 54z'
395
+ }))), React__namespace.createElement(Button.Button, {
396
+ type: 'button',
397
+ className: css.buttonNext,
398
+ onClick: handleClickButtonNext,
399
+ disabled: isDisableNext,
400
+ "aria-label": ttag.t(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0441\u043B\u0435\u0434\u0443\u044E\u0449\u0438\u0439 \u0431\u0430\u043D\u043D\u0435\u0440"], ["\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0441\u043B\u0435\u0434\u0443\u044E\u0449\u0438\u0439 \u0431\u0430\u043D\u043D\u0435\u0440"]))),
401
+ "data-qaid": 'next_image'
402
+ }, React__namespace.createElement("svg", {
403
+ className: css.buttonIcon,
404
+ width: 18,
405
+ height: 18,
406
+ viewBox: '0 0 64 64',
407
+ xmlns: 'http://www.w3.org/2000/svg'
408
+ }, React__namespace.createElement("path", {
409
+ d: 'M22.875 60.375L16 54l20.125-22L16 10l6.875-6.375L48.5 32z'
410
+ })))), isShowDots && React__namespace.createElement("ul", {
411
+ className: css.dots
412
+ }, childrenArray.map(function (child, index) {
413
+ var viewIndex = index + 1;
414
+ return React__namespace.createElement("li", {
415
+ className: css.dotsItem,
416
+ key: child.key
417
+ }, React__namespace.createElement(Button.Button, {
418
+ className: css.dotsButton,
419
+ type: 'button',
420
+ onClick: function () {
421
+ return handleClickDot(index);
422
+ },
423
+ disabled: index === infiniteIndex,
424
+ "aria-label": ttag.t(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0431\u0430\u043D\u043D\u0435\u0440 \u043D\u043E\u043C\u0435\u0440 ", ""], ["\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0431\u0430\u043D\u043D\u0435\u0440 \u043D\u043E\u043C\u0435\u0440 ", ""])), viewIndex),
425
+ "data-qaid": "view_image_".concat(viewIndex)
426
+ }, viewIndex));
427
+ })));
428
+ });
429
+ var templateObject_1, templateObject_2, templateObject_3;
430
+
431
+ exports.SimpleSlider = SimpleSlider;
432
+
433
+ require('./style.development.css');