@kids-reporter/draft-renderer 1.0.9 → 1.0.11
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.
- package/lib/block-render-maps/image-link.js +36 -0
- package/lib/block-render-maps/index.js +2 -0
- package/lib/block-renderer-fn.js +24 -33
- package/lib/block-renderers/image-block.js +2 -1
- package/lib/block-renderers/image-link.js +116 -0
- package/lib/block-renderers/index.js +2 -0
- package/lib/block-renderers/info-box-block.js +8 -5
- package/lib/block-renderers/slideshow-block.js +8 -78
- package/package.json +1 -1
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.blockRenderMap = void 0;
|
|
7
|
+
var _immutable = _interopRequireDefault(require("immutable"));
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
10
|
+
var _draftJs = require("draft-js");
|
|
11
|
+
var _articleContent = require("./article-content");
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
const ParagraphForImageLink = (0, _styledComponents.default)(_articleContent.Paragraph)`
|
|
14
|
+
/* overwrite css */
|
|
15
|
+
font-size: ${({
|
|
16
|
+
theme
|
|
17
|
+
}) => (theme === null || theme === void 0 ? void 0 : theme.fontSizeLevel) === 'large' ? '18px' : '14px'};
|
|
18
|
+
margin-left: auto;
|
|
19
|
+
margin-right: auto;
|
|
20
|
+
margin-top: 0.5em;
|
|
21
|
+
color: rgb(58, 79, 102);
|
|
22
|
+
letter-spacing: 0.7px;
|
|
23
|
+
line-height: 28px;
|
|
24
|
+
text-align: center;
|
|
25
|
+
`;
|
|
26
|
+
const _blockRenderMapForAnnotation = _immutable.default.Map({
|
|
27
|
+
atomic: {
|
|
28
|
+
element: 'div',
|
|
29
|
+
wrapper: /*#__PURE__*/_react.default.createElement(_articleContent.Atomic, null)
|
|
30
|
+
},
|
|
31
|
+
unstyled: {
|
|
32
|
+
element: 'div',
|
|
33
|
+
wrapper: /*#__PURE__*/_react.default.createElement(ParagraphForImageLink, null)
|
|
34
|
+
}
|
|
35
|
+
});
|
|
36
|
+
const blockRenderMap = exports.blockRenderMap = _draftJs.DefaultDraftBlockRenderMap.merge(_blockRenderMapForAnnotation);
|
|
@@ -8,6 +8,7 @@ var _annotation = require("./annotation");
|
|
|
8
8
|
var _articleBrief = require("./article-brief");
|
|
9
9
|
var _articleContent = require("./article-content");
|
|
10
10
|
var _infoBox = require("./info-box");
|
|
11
|
+
var _imageLink = require("./image-link");
|
|
11
12
|
var _projectContent = require("./project-content");
|
|
12
13
|
var _default = exports.default = {
|
|
13
14
|
annotation: _annotation.blockRenderMap,
|
|
@@ -19,6 +20,7 @@ var _default = exports.default = {
|
|
|
19
20
|
default: _infoBox.blockRenderMap,
|
|
20
21
|
headerBorder: _infoBox.blockRenderMapForInfoBoxWithHeaderBorder
|
|
21
22
|
},
|
|
23
|
+
imageLink: _imageLink.blockRenderMap,
|
|
22
24
|
// project page content
|
|
23
25
|
projectContent: _projectContent.blockRenderMap
|
|
24
26
|
};
|
package/lib/block-renderer-fn.js
CHANGED
|
@@ -10,6 +10,7 @@ const {
|
|
|
10
10
|
Divider,
|
|
11
11
|
EmbeddedCodeInArticleBody,
|
|
12
12
|
ImageInArticleBody,
|
|
13
|
+
ImageLinkInArticleBody,
|
|
13
14
|
InfoBoxInArticleBody,
|
|
14
15
|
SlideshowInArticleBody,
|
|
15
16
|
NewsReading
|
|
@@ -20,45 +21,35 @@ const AtomicBlock = props => {
|
|
|
20
21
|
const entityData = entity.getData();
|
|
21
22
|
switch (entityType) {
|
|
22
23
|
case 'BLOCKQUOTE':
|
|
23
|
-
{
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
});
|
|
27
|
-
}
|
|
24
|
+
return BlockquoteInArticleBody({
|
|
25
|
+
data: entityData
|
|
26
|
+
});
|
|
28
27
|
case 'DIVIDER':
|
|
29
|
-
|
|
30
|
-
return Divider();
|
|
31
|
-
}
|
|
28
|
+
return Divider();
|
|
32
29
|
case 'IMAGE':
|
|
33
|
-
{
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
30
|
+
return ImageInArticleBody({
|
|
31
|
+
data: entityData
|
|
32
|
+
});
|
|
33
|
+
case 'IMAGE_LINK':
|
|
34
|
+
return ImageLinkInArticleBody({
|
|
35
|
+
data: entityData
|
|
36
|
+
});
|
|
38
37
|
case 'SLIDESHOW':
|
|
39
|
-
{
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
});
|
|
43
|
-
}
|
|
38
|
+
return SlideshowInArticleBody({
|
|
39
|
+
data: entityData
|
|
40
|
+
});
|
|
44
41
|
case 'EMBEDDEDCODE':
|
|
45
|
-
{
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
});
|
|
49
|
-
}
|
|
42
|
+
return EmbeddedCodeInArticleBody({
|
|
43
|
+
data: entityData
|
|
44
|
+
});
|
|
50
45
|
case 'INFOBOX':
|
|
51
|
-
{
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
});
|
|
55
|
-
}
|
|
46
|
+
return InfoBoxInArticleBody({
|
|
47
|
+
data: entityData
|
|
48
|
+
});
|
|
56
49
|
case 'NEWS_READING':
|
|
57
|
-
{
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
});
|
|
61
|
-
}
|
|
50
|
+
return NewsReading({
|
|
51
|
+
data: entityData
|
|
52
|
+
});
|
|
62
53
|
}
|
|
63
54
|
return null;
|
|
64
55
|
};
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.ImageBlock = ImageBlock;
|
|
7
7
|
exports.ImageInArticleBody = ImageInArticleBody;
|
|
8
8
|
exports.ImageInInfoBox = ImageInInfoBox;
|
|
9
|
+
exports.InfoBoxContainer = void 0;
|
|
9
10
|
var _react = _interopRequireDefault(require("react"));
|
|
10
11
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
12
|
var _mediaQuery = require("../utils/media-query");
|
|
@@ -116,7 +117,7 @@ function ImageInArticleBody({
|
|
|
116
117
|
data: data
|
|
117
118
|
}));
|
|
118
119
|
}
|
|
119
|
-
const InfoBoxContainer = _styledComponents.default.div`
|
|
120
|
+
const InfoBoxContainer = exports.InfoBoxContainer = _styledComponents.default.div`
|
|
120
121
|
/* reset browser default styles */
|
|
121
122
|
figure {
|
|
122
123
|
margin: 0 0 27px 0;
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ImageLinkInInfoBox = exports.ImageLinkInArticleBody = exports.ImageLinkBlock = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
|
+
var _draftJs = require("draft-js");
|
|
10
|
+
var _imageBlock = require("./image-block");
|
|
11
|
+
var _index = _interopRequireDefault(require("../block-render-maps/index"));
|
|
12
|
+
var _index2 = require("../entity-decorators/index");
|
|
13
|
+
var _mediaQuery = require("../utils/media-query");
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
const fallbackImg = '/assets/images/image_placeholder.png';
|
|
16
|
+
const Figure = _styledComponents.default.figure`
|
|
17
|
+
width: 100%;
|
|
18
|
+
`;
|
|
19
|
+
const Img = _styledComponents.default.img`
|
|
20
|
+
width: 100%;
|
|
21
|
+
object-fit: contain;
|
|
22
|
+
`;
|
|
23
|
+
const ImageLinkBlock = ({
|
|
24
|
+
className = '',
|
|
25
|
+
data
|
|
26
|
+
}) => {
|
|
27
|
+
const {
|
|
28
|
+
url,
|
|
29
|
+
rawContentState
|
|
30
|
+
} = data;
|
|
31
|
+
const contentState = (0, _draftJs.convertFromRaw)(rawContentState);
|
|
32
|
+
const editorState = _draftJs.EditorState.createWithContent(contentState, _index2.decorator);
|
|
33
|
+
const blockRenderMap = _index.default.imageLink;
|
|
34
|
+
const imgBlock = /*#__PURE__*/_react.default.createElement(Figure, {
|
|
35
|
+
className: className
|
|
36
|
+
}, /*#__PURE__*/_react.default.createElement(Img, {
|
|
37
|
+
src: url ?? fallbackImg
|
|
38
|
+
}), /*#__PURE__*/_react.default.createElement(_draftJs.Editor, {
|
|
39
|
+
blockRenderMap: blockRenderMap,
|
|
40
|
+
editorState: editorState,
|
|
41
|
+
readOnly: true
|
|
42
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
43
|
+
,
|
|
44
|
+
onChange: () => {}
|
|
45
|
+
}));
|
|
46
|
+
return imgBlock;
|
|
47
|
+
};
|
|
48
|
+
exports.ImageLinkBlock = ImageLinkBlock;
|
|
49
|
+
const ArticleBodyContainer = _styledComponents.default.div`
|
|
50
|
+
/* reset browser default styles */
|
|
51
|
+
figure {
|
|
52
|
+
margin: 0;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
max-width: 72vw;
|
|
56
|
+
margin: 0 auto 27px auto;
|
|
57
|
+
|
|
58
|
+
${_mediaQuery.mediaQuery.smallOnly} {
|
|
59
|
+
max-width: 100%;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
${_mediaQuery.mediaQuery.largeOnly} {
|
|
63
|
+
max-width: 1000px;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
${props => {
|
|
67
|
+
switch (props.$alignment) {
|
|
68
|
+
case 'paragraph-width':
|
|
69
|
+
return `
|
|
70
|
+
${_mediaQuery.mediaQuery.mediumAbove} {
|
|
71
|
+
max-width: 700px;
|
|
72
|
+
}
|
|
73
|
+
`;
|
|
74
|
+
case 'right':
|
|
75
|
+
return `
|
|
76
|
+
${_mediaQuery.mediaQuery.mediumAbove} {
|
|
77
|
+
width: 361px;
|
|
78
|
+
float: right;
|
|
79
|
+
margin: 5px 0px 5px 27px;
|
|
80
|
+
}
|
|
81
|
+
`;
|
|
82
|
+
case 'left':
|
|
83
|
+
return `
|
|
84
|
+
${_mediaQuery.mediaQuery.mediumAbove} {
|
|
85
|
+
width: 361px;
|
|
86
|
+
float: left;
|
|
87
|
+
margin: 5px 27px 5px 0px;
|
|
88
|
+
}
|
|
89
|
+
`;
|
|
90
|
+
}
|
|
91
|
+
}}
|
|
92
|
+
`;
|
|
93
|
+
const ImageLinkInArticleBody = ({
|
|
94
|
+
className = '',
|
|
95
|
+
data
|
|
96
|
+
}) => {
|
|
97
|
+
return /*#__PURE__*/_react.default.createElement(ArticleBodyContainer, {
|
|
98
|
+
$alignment: data.alignment,
|
|
99
|
+
className: className
|
|
100
|
+
}, /*#__PURE__*/_react.default.createElement(ImageLinkBlock, {
|
|
101
|
+
data: data
|
|
102
|
+
}));
|
|
103
|
+
};
|
|
104
|
+
exports.ImageLinkInArticleBody = ImageLinkInArticleBody;
|
|
105
|
+
const ImageLinkInInfoBox = ({
|
|
106
|
+
className = '',
|
|
107
|
+
data
|
|
108
|
+
}) => {
|
|
109
|
+
return /*#__PURE__*/_react.default.createElement(_imageBlock.InfoBoxContainer, {
|
|
110
|
+
$alignment: data.alignment,
|
|
111
|
+
className: className
|
|
112
|
+
}, /*#__PURE__*/_react.default.createElement(ImageLinkBlock, {
|
|
113
|
+
data: data
|
|
114
|
+
}));
|
|
115
|
+
};
|
|
116
|
+
exports.ImageLinkInInfoBox = ImageLinkInInfoBox;
|
|
@@ -8,6 +8,7 @@ var _blockquote = require("./blockquote");
|
|
|
8
8
|
var _divider = require("./divider");
|
|
9
9
|
var _embeddedCodeBlock = require("./embedded-code-block");
|
|
10
10
|
var _imageBlock = require("./image-block");
|
|
11
|
+
var _imageLink = require("./image-link");
|
|
11
12
|
var _infoBoxBlock = require("./info-box-block");
|
|
12
13
|
var _slideshowBlock = require("./slideshow-block");
|
|
13
14
|
var _newsReading = require("./news-reading");
|
|
@@ -18,6 +19,7 @@ const blockRenderers = exports.blockRenderers = {
|
|
|
18
19
|
EmbeddedCodeInArticleBody: _embeddedCodeBlock.EmbeddedCodeInArticleBody,
|
|
19
20
|
ImageBlock: _imageBlock.ImageBlock,
|
|
20
21
|
ImageInArticleBody: _imageBlock.ImageInArticleBody,
|
|
22
|
+
ImageLinkInArticleBody: _imageLink.ImageLinkInArticleBody,
|
|
21
23
|
InfoBoxInArticleBody: _infoBoxBlock.InfoBoxInArticleBody,
|
|
22
24
|
NewsReading: _newsReading.NewsReading,
|
|
23
25
|
SlideshowBlock: _slideshowBlock.SlideshowBlock,
|
|
@@ -9,6 +9,7 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
10
10
|
var _index = _interopRequireDefault(require("../block-render-maps/index"));
|
|
11
11
|
var _imageBlock = require("../block-renderers/image-block");
|
|
12
|
+
var _imageLink = require("../block-renderers/image-link");
|
|
12
13
|
var _index2 = require("../utils/index");
|
|
13
14
|
var _index3 = require("../entity-decorators/index");
|
|
14
15
|
var _mediaQuery = require("../utils/media-query");
|
|
@@ -199,11 +200,13 @@ function AtomicBlock(props) {
|
|
|
199
200
|
const entityData = entity.getData();
|
|
200
201
|
switch (entityType) {
|
|
201
202
|
case 'IMAGE':
|
|
202
|
-
{
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
203
|
+
return (0, _imageBlock.ImageInInfoBox)({
|
|
204
|
+
data: entityData
|
|
205
|
+
});
|
|
206
|
+
case 'IMAGE_LINK':
|
|
207
|
+
return (0, _imageLink.ImageLinkInInfoBox)({
|
|
208
|
+
data: entityData
|
|
209
|
+
});
|
|
207
210
|
}
|
|
208
211
|
return null;
|
|
209
212
|
}
|
|
@@ -99,28 +99,12 @@ const SlidesSection = _styledComponents.default.div`
|
|
|
99
99
|
flex-basis: 100%;
|
|
100
100
|
overflow: hidden;
|
|
101
101
|
position: relative;
|
|
102
|
+
width: 100%;
|
|
103
|
+
aspect-ratio: 3 / 2;
|
|
102
104
|
|
|
103
105
|
${_mediaQuery.mediaQuery.smallOnly} {
|
|
104
106
|
order: 2;
|
|
105
107
|
}
|
|
106
|
-
|
|
107
|
-
${_mediaQuery.mediaQuery.smallOnly} {
|
|
108
|
-
padding-bottom: calc(
|
|
109
|
-
${mockup.mobile.slide.height} / ${mockup.mobile.container.width}*100%
|
|
110
|
-
);
|
|
111
|
-
}
|
|
112
|
-
|
|
113
|
-
${_mediaQuery.mediaQuery.mediumOnly} {
|
|
114
|
-
padding-bottom: calc(
|
|
115
|
-
${mockup.desktop.slide.height} / ${mockup.desktop.container.width}*100%
|
|
116
|
-
);
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
${_mediaQuery.mediaQuery.largeOnly} {
|
|
120
|
-
padding-bottom: calc(
|
|
121
|
-
${mockup.hd.slide.height} / ${mockup.hd.container.width}*100%
|
|
122
|
-
);
|
|
123
|
-
}
|
|
124
108
|
`;
|
|
125
109
|
const PrevNextSection = _styledComponents.default.div`
|
|
126
110
|
margin-top: 20px;
|
|
@@ -328,42 +312,6 @@ const SlideFlexItem = _styledComponents.default.div`
|
|
|
328
312
|
padding-right: ${mockup.hd.slide.paddingRight}px;
|
|
329
313
|
}
|
|
330
314
|
`;
|
|
331
|
-
const SlideMask = _styledComponents.default.div`
|
|
332
|
-
position: absolute;
|
|
333
|
-
top: 0;
|
|
334
|
-
height: 100%;
|
|
335
|
-
opacity: 0.55;
|
|
336
|
-
`;
|
|
337
|
-
const LeftSlideMask = (0, _styledComponents.default)(SlideMask)`
|
|
338
|
-
left: 0;
|
|
339
|
-
|
|
340
|
-
${_mediaQuery.mediaQuery.smallOnly} {
|
|
341
|
-
width: ${getLeftMaskWidth(mockup.mobile) / getContainerWidth(mockup.mobile) * 100}%;
|
|
342
|
-
}
|
|
343
|
-
|
|
344
|
-
${_mediaQuery.mediaQuery.mediumOnly} {
|
|
345
|
-
width: ${getLeftMaskWidth(mockup.desktop)}px;
|
|
346
|
-
}
|
|
347
|
-
|
|
348
|
-
${_mediaQuery.mediaQuery.largeOnly} {
|
|
349
|
-
width: ${getLeftMaskWidth(mockup.hd)}px;
|
|
350
|
-
}
|
|
351
|
-
`;
|
|
352
|
-
const RightSlideMask = (0, _styledComponents.default)(SlideMask)`
|
|
353
|
-
right: 0;
|
|
354
|
-
|
|
355
|
-
${_mediaQuery.mediaQuery.smallOnly} {
|
|
356
|
-
width: ${getRightMaskWidth(mockup.mobile) / getContainerWidth(mockup.mobile) * 100}%;
|
|
357
|
-
}
|
|
358
|
-
|
|
359
|
-
${_mediaQuery.mediaQuery.mediumOnly} {
|
|
360
|
-
width: ${getRightMaskWidth(mockup.desktop)}px;
|
|
361
|
-
}
|
|
362
|
-
|
|
363
|
-
${_mediaQuery.mediaQuery.largeOnly} {
|
|
364
|
-
width: ${getRightMaskWidth(mockup.hd)}px;
|
|
365
|
-
}
|
|
366
|
-
`;
|
|
367
315
|
const SlideshowFlexBox = _styledComponents.default.div`
|
|
368
316
|
${PrevButton} {
|
|
369
317
|
border-color: #d8d8d8;
|
|
@@ -379,11 +327,6 @@ const SlideshowFlexBox = _styledComponents.default.div`
|
|
|
379
327
|
${ImageNumber} {
|
|
380
328
|
color: #fff;
|
|
381
329
|
}
|
|
382
|
-
${SlideMask} {
|
|
383
|
-
background-color: ${({
|
|
384
|
-
theme
|
|
385
|
-
}) => (0, _index.getColorHex)(theme === null || theme === void 0 ? void 0 : theme.themeColor)};
|
|
386
|
-
}
|
|
387
330
|
|
|
388
331
|
width: 100%;
|
|
389
332
|
margin: 0 auto;
|
|
@@ -429,22 +372,6 @@ function getContainerWidth(deviceMockup) {
|
|
|
429
372
|
function getSlideWidth(deviceMockup) {
|
|
430
373
|
return deviceMockup.slide.width + deviceMockup.slide.paddingRight;
|
|
431
374
|
}
|
|
432
|
-
|
|
433
|
-
/**
|
|
434
|
-
* @param {DeviceMockup} deviceMockup
|
|
435
|
-
* @return {number}
|
|
436
|
-
*/
|
|
437
|
-
function getLeftMaskWidth(deviceMockup) {
|
|
438
|
-
return deviceMockup.offset.left - deviceMockup.slide.paddingRight; // px
|
|
439
|
-
}
|
|
440
|
-
|
|
441
|
-
/**
|
|
442
|
-
* @param {DeviceMockup} deviceMockup
|
|
443
|
-
* @return {number}
|
|
444
|
-
*/
|
|
445
|
-
function getRightMaskWidth(deviceMockup) {
|
|
446
|
-
return deviceMockup.container.width - deviceMockup.offset.left - getSlideWidth(deviceMockup); // px
|
|
447
|
-
}
|
|
448
375
|
function SlideshowBlock({
|
|
449
376
|
className = '',
|
|
450
377
|
data
|
|
@@ -494,15 +421,18 @@ function SlideshowBlock({
|
|
|
494
421
|
// hence, we append `index` on the key
|
|
495
422
|
_react.default.createElement(SlideFlexItem, {
|
|
496
423
|
key: `slide_${img.id}_${index}`
|
|
424
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
425
|
+
className: "w-full h-full relative overflow-hidden"
|
|
497
426
|
}, /*#__PURE__*/_react.default.createElement("img", {
|
|
498
427
|
srcSet: imgSrcSetArr.join(','),
|
|
499
428
|
src: imgSrc,
|
|
500
429
|
style: {
|
|
430
|
+
display: 'block',
|
|
501
431
|
objectFit,
|
|
502
|
-
|
|
432
|
+
height: '100%'
|
|
503
433
|
},
|
|
504
434
|
sizes: "(max-width: 768px) 100vw, (min-width: 1400px) 1000px, 500px"
|
|
505
|
-
}))
|
|
435
|
+
})))
|
|
506
436
|
);
|
|
507
437
|
});
|
|
508
438
|
}, [images]);
|
|
@@ -543,7 +473,7 @@ function SlideshowBlock({
|
|
|
543
473
|
translateXUint: translateXUnit,
|
|
544
474
|
duration: duration,
|
|
545
475
|
isSliding: isSliding
|
|
546
|
-
}, slides)
|
|
476
|
+
}, slides)), /*#__PURE__*/_react.default.createElement(PrevNextSection, null, /*#__PURE__*/_react.default.createElement(PrevButton, {
|
|
547
477
|
onClick: isSliding ? undefined : slideToPrev
|
|
548
478
|
}, /*#__PURE__*/_react.default.createElement(PreArrowSvg, null)), /*#__PURE__*/_react.default.createElement(NextButton, {
|
|
549
479
|
onClick: isSliding ? undefined : slideToNext
|