@micromag/screen-timeline 0.2.401 → 0.2.406
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/es/index.js +72 -68
- package/lib/index.js +78 -74
- package/package.json +12 -12
package/es/index.js
CHANGED
|
@@ -3,22 +3,22 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
|
|
|
3
3
|
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
4
4
|
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
5
5
|
import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
|
|
6
|
-
import React, { useState, useCallback, useRef, useEffect } from 'react';
|
|
7
|
-
import PropTypes from 'prop-types';
|
|
8
|
-
import classNames from 'classnames';
|
|
9
6
|
import { PropTypes as PropTypes$1 } from '@micromag/core';
|
|
10
7
|
import { Transitions, ScreenElement } from '@micromag/core/components';
|
|
11
8
|
import { useScreenSize, useViewer, useScreenRenderContext } from '@micromag/core/contexts';
|
|
12
9
|
import { useTrackScreenEvent, useResizeObserver } from '@micromag/core/hooks';
|
|
13
10
|
import { isTextFilled, getStyleFromColor } from '@micromag/core/utils';
|
|
14
11
|
import Background from '@micromag/element-background';
|
|
12
|
+
import CallToAction from '@micromag/element-call-to-action';
|
|
15
13
|
import Container from '@micromag/element-container';
|
|
14
|
+
import Heading from '@micromag/element-heading';
|
|
16
15
|
import Layout from '@micromag/element-layout';
|
|
16
|
+
import Scroll from '@micromag/element-scroll';
|
|
17
17
|
import Text from '@micromag/element-text';
|
|
18
18
|
import Visual from '@micromag/element-visual';
|
|
19
|
-
import
|
|
20
|
-
import
|
|
21
|
-
import
|
|
19
|
+
import classNames from 'classnames';
|
|
20
|
+
import PropTypes from 'prop-types';
|
|
21
|
+
import React, { useState, useCallback, useRef, useEffect } from 'react';
|
|
22
22
|
import _extends from '@babel/runtime/helpers/extends';
|
|
23
23
|
import { Text as Text$1, Container as Container$1 } from '@micromag/transforms/apple-news';
|
|
24
24
|
|
|
@@ -36,6 +36,7 @@ var propTypes = {
|
|
|
36
36
|
background: PropTypes$1.backgroundElement,
|
|
37
37
|
callToAction: PropTypes$1.callToAction,
|
|
38
38
|
current: PropTypes.bool,
|
|
39
|
+
active: PropTypes.bool,
|
|
39
40
|
transitions: PropTypes$1.transitions,
|
|
40
41
|
transitionStagger: PropTypes.number,
|
|
41
42
|
type: PropTypes.string,
|
|
@@ -53,6 +54,7 @@ var defaultProps = {
|
|
|
53
54
|
background: null,
|
|
54
55
|
callToAction: null,
|
|
55
56
|
current: true,
|
|
57
|
+
active: true,
|
|
56
58
|
transitions: null,
|
|
57
59
|
transitionStagger: 75,
|
|
58
60
|
type: null,
|
|
@@ -73,6 +75,7 @@ var Timeline = function Timeline(_ref) {
|
|
|
73
75
|
background = _ref.background,
|
|
74
76
|
callToAction = _ref.callToAction,
|
|
75
77
|
current = _ref.current,
|
|
78
|
+
active = _ref.active,
|
|
76
79
|
transitions = _ref.transitions,
|
|
77
80
|
transitionStagger = _ref.transitionStagger,
|
|
78
81
|
type = _ref.type,
|
|
@@ -184,25 +187,6 @@ var Timeline = function Timeline(_ref) {
|
|
|
184
187
|
}, hasElement ? /*#__PURE__*/React.createElement(Heading, title) : null));
|
|
185
188
|
break;
|
|
186
189
|
|
|
187
|
-
case 'description':
|
|
188
|
-
default:
|
|
189
|
-
hasElement = hasDescription;
|
|
190
|
-
elementContent = /*#__PURE__*/React.createElement("div", {
|
|
191
|
-
className: styles.description
|
|
192
|
-
}, /*#__PURE__*/React.createElement(ScreenElement, {
|
|
193
|
-
placeholder: "text",
|
|
194
|
-
emptyLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
195
|
-
id: "507VAi",
|
|
196
|
-
defaultMessage: [{
|
|
197
|
-
"type": 0,
|
|
198
|
-
"value": "Description"
|
|
199
|
-
}]
|
|
200
|
-
}),
|
|
201
|
-
emptyClassName: styles.empty,
|
|
202
|
-
isEmpty: !hasDescription
|
|
203
|
-
}, hasElement ? /*#__PURE__*/React.createElement(Text, description) : null));
|
|
204
|
-
break;
|
|
205
|
-
|
|
206
190
|
case 'image':
|
|
207
191
|
hasElement = hasImage;
|
|
208
192
|
elementContent = /*#__PURE__*/React.createElement("div", {
|
|
@@ -227,6 +211,25 @@ var Timeline = function Timeline(_ref) {
|
|
|
227
211
|
onLoaded: onImageLoaded
|
|
228
212
|
}) : null));
|
|
229
213
|
break;
|
|
214
|
+
|
|
215
|
+
case 'description':
|
|
216
|
+
default:
|
|
217
|
+
hasElement = hasDescription;
|
|
218
|
+
elementContent = /*#__PURE__*/React.createElement("div", {
|
|
219
|
+
className: styles.description
|
|
220
|
+
}, /*#__PURE__*/React.createElement(ScreenElement, {
|
|
221
|
+
placeholder: "text",
|
|
222
|
+
emptyLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
223
|
+
id: "507VAi",
|
|
224
|
+
defaultMessage: [{
|
|
225
|
+
"type": 0,
|
|
226
|
+
"value": "Description"
|
|
227
|
+
}]
|
|
228
|
+
}),
|
|
229
|
+
emptyClassName: styles.empty,
|
|
230
|
+
isEmpty: !hasDescription
|
|
231
|
+
}, hasElement ? /*#__PURE__*/React.createElement(Text, description) : null));
|
|
232
|
+
break;
|
|
230
233
|
}
|
|
231
234
|
|
|
232
235
|
var firstItem = itemI === 0;
|
|
@@ -290,7 +293,8 @@ var Timeline = function Timeline(_ref) {
|
|
|
290
293
|
background: background,
|
|
291
294
|
width: width,
|
|
292
295
|
height: height,
|
|
293
|
-
playing: backgroundPlaying
|
|
296
|
+
playing: backgroundPlaying,
|
|
297
|
+
shouldLoad: current || active
|
|
294
298
|
}) : null, /*#__PURE__*/React.createElement(Container, {
|
|
295
299
|
width: width,
|
|
296
300
|
height: height
|
|
@@ -382,8 +386,8 @@ var definition = [{
|
|
|
382
386
|
type: 'screen',
|
|
383
387
|
group: {
|
|
384
388
|
label: defineMessage({
|
|
385
|
-
|
|
386
|
-
|
|
389
|
+
id: "cGItoy",
|
|
390
|
+
defaultMessage: [{
|
|
387
391
|
"type": 0,
|
|
388
392
|
"value": "List"
|
|
389
393
|
}]
|
|
@@ -391,8 +395,8 @@ var definition = [{
|
|
|
391
395
|
order: 8
|
|
392
396
|
},
|
|
393
397
|
title: defineMessage({
|
|
394
|
-
|
|
395
|
-
|
|
398
|
+
id: "GzoKNb",
|
|
399
|
+
defaultMessage: [{
|
|
396
400
|
"type": 0,
|
|
397
401
|
"value": "Timeline"
|
|
398
402
|
}]
|
|
@@ -412,8 +416,8 @@ var definition = [{
|
|
|
412
416
|
}
|
|
413
417
|
},
|
|
414
418
|
label: defineMessage({
|
|
415
|
-
|
|
416
|
-
|
|
419
|
+
id: "3ifj0j",
|
|
420
|
+
defaultMessage: [{
|
|
417
421
|
"type": 0,
|
|
418
422
|
"value": "Entries"
|
|
419
423
|
}]
|
|
@@ -425,8 +429,8 @@ var definition = [{
|
|
|
425
429
|
options: [{
|
|
426
430
|
value: 'circle',
|
|
427
431
|
label: defineMessage({
|
|
428
|
-
|
|
429
|
-
|
|
432
|
+
id: "+uInZz",
|
|
433
|
+
defaultMessage: [{
|
|
430
434
|
"type": 0,
|
|
431
435
|
"value": "Circle"
|
|
432
436
|
}]
|
|
@@ -434,16 +438,16 @@ var definition = [{
|
|
|
434
438
|
}, {
|
|
435
439
|
value: 'square',
|
|
436
440
|
label: defineMessage({
|
|
437
|
-
|
|
438
|
-
|
|
441
|
+
id: "fusnxf",
|
|
442
|
+
defaultMessage: [{
|
|
439
443
|
"type": 0,
|
|
440
444
|
"value": "Square"
|
|
441
445
|
}]
|
|
442
446
|
})
|
|
443
447
|
}],
|
|
444
448
|
label: defineMessage({
|
|
445
|
-
|
|
446
|
-
|
|
449
|
+
id: "twTaAZ",
|
|
450
|
+
defaultMessage: [{
|
|
447
451
|
"type": 0,
|
|
448
452
|
"value": "Bullet shape"
|
|
449
453
|
}]
|
|
@@ -453,8 +457,8 @@ var definition = [{
|
|
|
453
457
|
type: 'toggle',
|
|
454
458
|
defaultValue: false,
|
|
455
459
|
label: defineMessage({
|
|
456
|
-
|
|
457
|
-
|
|
460
|
+
id: "YWcp4v",
|
|
461
|
+
defaultMessage: [{
|
|
458
462
|
"type": 0,
|
|
459
463
|
"value": "Bullet filled"
|
|
460
464
|
}]
|
|
@@ -467,8 +471,8 @@ var definition = [{
|
|
|
467
471
|
color: '#FFFFFF'
|
|
468
472
|
},
|
|
469
473
|
label: defineMessage({
|
|
470
|
-
|
|
471
|
-
|
|
474
|
+
id: "uNpHnA",
|
|
475
|
+
defaultMessage: [{
|
|
472
476
|
"type": 0,
|
|
473
477
|
"value": "Bullet color"
|
|
474
478
|
}]
|
|
@@ -481,8 +485,8 @@ var definition = [{
|
|
|
481
485
|
color: '#FFFFFF'
|
|
482
486
|
},
|
|
483
487
|
label: defineMessage({
|
|
484
|
-
|
|
485
|
-
|
|
488
|
+
id: "RHMS2f",
|
|
489
|
+
defaultMessage: [{
|
|
486
490
|
"type": 0,
|
|
487
491
|
"value": "Line color"
|
|
488
492
|
}]
|
|
@@ -491,8 +495,8 @@ var definition = [{
|
|
|
491
495
|
name: 'background',
|
|
492
496
|
type: 'background',
|
|
493
497
|
label: defineMessage({
|
|
494
|
-
|
|
495
|
-
|
|
498
|
+
id: "+MPZRu",
|
|
499
|
+
defaultMessage: [{
|
|
496
500
|
"type": 0,
|
|
497
501
|
"value": "Background"
|
|
498
502
|
}]
|
|
@@ -511,8 +515,8 @@ var definition = [{
|
|
|
511
515
|
type: 'screen',
|
|
512
516
|
group: {
|
|
513
517
|
label: defineMessage({
|
|
514
|
-
|
|
515
|
-
|
|
518
|
+
id: "cGItoy",
|
|
519
|
+
defaultMessage: [{
|
|
516
520
|
"type": 0,
|
|
517
521
|
"value": "List"
|
|
518
522
|
}]
|
|
@@ -520,8 +524,8 @@ var definition = [{
|
|
|
520
524
|
order: 8
|
|
521
525
|
},
|
|
522
526
|
title: defineMessage({
|
|
523
|
-
|
|
524
|
-
|
|
527
|
+
id: "33UbSd",
|
|
528
|
+
defaultMessage: [{
|
|
525
529
|
"type": 0,
|
|
526
530
|
"value": "Timeline with images"
|
|
527
531
|
}]
|
|
@@ -533,8 +537,8 @@ var definition = [{
|
|
|
533
537
|
type: 'screen-layout',
|
|
534
538
|
defaultValue: 'title-image-description',
|
|
535
539
|
label: defineMessage({
|
|
536
|
-
|
|
537
|
-
|
|
540
|
+
id: "4iBXj2",
|
|
541
|
+
defaultMessage: [{
|
|
538
542
|
"type": 0,
|
|
539
543
|
"value": "Layout"
|
|
540
544
|
}]
|
|
@@ -551,8 +555,8 @@ var definition = [{
|
|
|
551
555
|
}
|
|
552
556
|
},
|
|
553
557
|
label: defineMessage({
|
|
554
|
-
|
|
555
|
-
|
|
558
|
+
id: "3ifj0j",
|
|
559
|
+
defaultMessage: [{
|
|
556
560
|
"type": 0,
|
|
557
561
|
"value": "Entries"
|
|
558
562
|
}]
|
|
@@ -564,8 +568,8 @@ var definition = [{
|
|
|
564
568
|
options: [{
|
|
565
569
|
value: 'circle',
|
|
566
570
|
label: defineMessage({
|
|
567
|
-
|
|
568
|
-
|
|
571
|
+
id: "+uInZz",
|
|
572
|
+
defaultMessage: [{
|
|
569
573
|
"type": 0,
|
|
570
574
|
"value": "Circle"
|
|
571
575
|
}]
|
|
@@ -573,16 +577,16 @@ var definition = [{
|
|
|
573
577
|
}, {
|
|
574
578
|
value: 'square',
|
|
575
579
|
label: defineMessage({
|
|
576
|
-
|
|
577
|
-
|
|
580
|
+
id: "fusnxf",
|
|
581
|
+
defaultMessage: [{
|
|
578
582
|
"type": 0,
|
|
579
583
|
"value": "Square"
|
|
580
584
|
}]
|
|
581
585
|
})
|
|
582
586
|
}],
|
|
583
587
|
label: defineMessage({
|
|
584
|
-
|
|
585
|
-
|
|
588
|
+
id: "twTaAZ",
|
|
589
|
+
defaultMessage: [{
|
|
586
590
|
"type": 0,
|
|
587
591
|
"value": "Bullet shape"
|
|
588
592
|
}]
|
|
@@ -592,8 +596,8 @@ var definition = [{
|
|
|
592
596
|
type: 'toggle',
|
|
593
597
|
defaultValue: false,
|
|
594
598
|
label: defineMessage({
|
|
595
|
-
|
|
596
|
-
|
|
599
|
+
id: "YWcp4v",
|
|
600
|
+
defaultMessage: [{
|
|
597
601
|
"type": 0,
|
|
598
602
|
"value": "Bullet filled"
|
|
599
603
|
}]
|
|
@@ -606,8 +610,8 @@ var definition = [{
|
|
|
606
610
|
color: '#FFFFFF'
|
|
607
611
|
},
|
|
608
612
|
label: defineMessage({
|
|
609
|
-
|
|
610
|
-
|
|
613
|
+
id: "uNpHnA",
|
|
614
|
+
defaultMessage: [{
|
|
611
615
|
"type": 0,
|
|
612
616
|
"value": "Bullet color"
|
|
613
617
|
}]
|
|
@@ -620,8 +624,8 @@ var definition = [{
|
|
|
620
624
|
color: '#FFFFFF'
|
|
621
625
|
},
|
|
622
626
|
label: defineMessage({
|
|
623
|
-
|
|
624
|
-
|
|
627
|
+
id: "RHMS2f",
|
|
628
|
+
defaultMessage: [{
|
|
625
629
|
"type": 0,
|
|
626
630
|
"value": "Line color"
|
|
627
631
|
}]
|
|
@@ -630,8 +634,8 @@ var definition = [{
|
|
|
630
634
|
name: 'background',
|
|
631
635
|
type: 'background',
|
|
632
636
|
label: defineMessage({
|
|
633
|
-
|
|
634
|
-
|
|
637
|
+
id: "+MPZRu",
|
|
638
|
+
defaultMessage: [{
|
|
635
639
|
"type": 0,
|
|
636
640
|
"value": "Background"
|
|
637
641
|
}]
|
package/lib/index.js
CHANGED
|
@@ -7,22 +7,22 @@ var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
|
|
|
7
7
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
8
8
|
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
|
|
9
9
|
var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
|
|
10
|
-
var React = require('react');
|
|
11
|
-
var PropTypes = require('prop-types');
|
|
12
|
-
var classNames = require('classnames');
|
|
13
10
|
var core = require('@micromag/core');
|
|
14
11
|
var components = require('@micromag/core/components');
|
|
15
12
|
var contexts = require('@micromag/core/contexts');
|
|
16
13
|
var hooks = require('@micromag/core/hooks');
|
|
17
14
|
var utils = require('@micromag/core/utils');
|
|
18
15
|
var Background = require('@micromag/element-background');
|
|
16
|
+
var CallToAction = require('@micromag/element-call-to-action');
|
|
19
17
|
var Container = require('@micromag/element-container');
|
|
18
|
+
var Heading = require('@micromag/element-heading');
|
|
20
19
|
var Layout = require('@micromag/element-layout');
|
|
20
|
+
var Scroll = require('@micromag/element-scroll');
|
|
21
21
|
var Text = require('@micromag/element-text');
|
|
22
22
|
var Visual = require('@micromag/element-visual');
|
|
23
|
-
var
|
|
24
|
-
var
|
|
25
|
-
var
|
|
23
|
+
var classNames = require('classnames');
|
|
24
|
+
var PropTypes = require('prop-types');
|
|
25
|
+
var React = require('react');
|
|
26
26
|
var _extends = require('@babel/runtime/helpers/extends');
|
|
27
27
|
var appleNews = require('@micromag/transforms/apple-news');
|
|
28
28
|
|
|
@@ -32,17 +32,17 @@ var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
|
|
|
32
32
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
33
33
|
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
|
|
34
34
|
var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
|
|
35
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
36
|
-
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
37
|
-
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
38
35
|
var Background__default = /*#__PURE__*/_interopDefaultLegacy(Background);
|
|
36
|
+
var CallToAction__default = /*#__PURE__*/_interopDefaultLegacy(CallToAction);
|
|
39
37
|
var Container__default = /*#__PURE__*/_interopDefaultLegacy(Container);
|
|
38
|
+
var Heading__default = /*#__PURE__*/_interopDefaultLegacy(Heading);
|
|
40
39
|
var Layout__default = /*#__PURE__*/_interopDefaultLegacy(Layout);
|
|
40
|
+
var Scroll__default = /*#__PURE__*/_interopDefaultLegacy(Scroll);
|
|
41
41
|
var Text__default = /*#__PURE__*/_interopDefaultLegacy(Text);
|
|
42
42
|
var Visual__default = /*#__PURE__*/_interopDefaultLegacy(Visual);
|
|
43
|
-
var
|
|
44
|
-
var
|
|
45
|
-
var
|
|
43
|
+
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
44
|
+
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
45
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
46
46
|
var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
|
|
47
47
|
|
|
48
48
|
var styles = {"container":"micromag-screen-timeline-container","empty":"micromag-screen-timeline-empty","item":"micromag-screen-timeline-item","element":"micromag-screen-timeline-element","timeline":"micromag-screen-timeline-timeline","line":"micromag-screen-timeline-line","hidden":"micromag-screen-timeline-hidden","bullet":"micromag-screen-timeline-bullet","content":"micromag-screen-timeline-content","lastContent":"micromag-screen-timeline-lastContent","description":"micromag-screen-timeline-description","imageContainer":"micromag-screen-timeline-imageContainer","title":"micromag-screen-timeline-title","image":"micromag-screen-timeline-image","video":"micromag-screen-timeline-video","callToAction":"micromag-screen-timeline-callToAction","isPlaceholder":"micromag-screen-timeline-isPlaceholder","scroll":"micromag-screen-timeline-scroll","circleBulletShape":"micromag-screen-timeline-circleBulletShape","withoutLines":"micromag-screen-timeline-withoutLines"};
|
|
@@ -59,6 +59,7 @@ var propTypes = {
|
|
|
59
59
|
background: core.PropTypes.backgroundElement,
|
|
60
60
|
callToAction: core.PropTypes.callToAction,
|
|
61
61
|
current: PropTypes__default["default"].bool,
|
|
62
|
+
active: PropTypes__default["default"].bool,
|
|
62
63
|
transitions: core.PropTypes.transitions,
|
|
63
64
|
transitionStagger: PropTypes__default["default"].number,
|
|
64
65
|
type: PropTypes__default["default"].string,
|
|
@@ -76,6 +77,7 @@ var defaultProps = {
|
|
|
76
77
|
background: null,
|
|
77
78
|
callToAction: null,
|
|
78
79
|
current: true,
|
|
80
|
+
active: true,
|
|
79
81
|
transitions: null,
|
|
80
82
|
transitionStagger: 75,
|
|
81
83
|
type: null,
|
|
@@ -96,6 +98,7 @@ var Timeline = function Timeline(_ref) {
|
|
|
96
98
|
background = _ref.background,
|
|
97
99
|
callToAction = _ref.callToAction,
|
|
98
100
|
current = _ref.current,
|
|
101
|
+
active = _ref.active,
|
|
99
102
|
transitions = _ref.transitions,
|
|
100
103
|
transitionStagger = _ref.transitionStagger,
|
|
101
104
|
type = _ref.type,
|
|
@@ -207,25 +210,6 @@ var Timeline = function Timeline(_ref) {
|
|
|
207
210
|
}, hasElement ? /*#__PURE__*/React__default["default"].createElement(Heading__default["default"], title) : null));
|
|
208
211
|
break;
|
|
209
212
|
|
|
210
|
-
case 'description':
|
|
211
|
-
default:
|
|
212
|
-
hasElement = hasDescription;
|
|
213
|
-
elementContent = /*#__PURE__*/React__default["default"].createElement("div", {
|
|
214
|
-
className: styles.description
|
|
215
|
-
}, /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
216
|
-
placeholder: "text",
|
|
217
|
-
emptyLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
|
|
218
|
-
id: "507VAi",
|
|
219
|
-
defaultMessage: [{
|
|
220
|
-
"type": 0,
|
|
221
|
-
"value": "Description"
|
|
222
|
-
}]
|
|
223
|
-
}),
|
|
224
|
-
emptyClassName: styles.empty,
|
|
225
|
-
isEmpty: !hasDescription
|
|
226
|
-
}, hasElement ? /*#__PURE__*/React__default["default"].createElement(Text__default["default"], description) : null));
|
|
227
|
-
break;
|
|
228
|
-
|
|
229
213
|
case 'image':
|
|
230
214
|
hasElement = hasImage;
|
|
231
215
|
elementContent = /*#__PURE__*/React__default["default"].createElement("div", {
|
|
@@ -250,6 +234,25 @@ var Timeline = function Timeline(_ref) {
|
|
|
250
234
|
onLoaded: onImageLoaded
|
|
251
235
|
}) : null));
|
|
252
236
|
break;
|
|
237
|
+
|
|
238
|
+
case 'description':
|
|
239
|
+
default:
|
|
240
|
+
hasElement = hasDescription;
|
|
241
|
+
elementContent = /*#__PURE__*/React__default["default"].createElement("div", {
|
|
242
|
+
className: styles.description
|
|
243
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
244
|
+
placeholder: "text",
|
|
245
|
+
emptyLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
|
|
246
|
+
id: "507VAi",
|
|
247
|
+
defaultMessage: [{
|
|
248
|
+
"type": 0,
|
|
249
|
+
"value": "Description"
|
|
250
|
+
}]
|
|
251
|
+
}),
|
|
252
|
+
emptyClassName: styles.empty,
|
|
253
|
+
isEmpty: !hasDescription
|
|
254
|
+
}, hasElement ? /*#__PURE__*/React__default["default"].createElement(Text__default["default"], description) : null));
|
|
255
|
+
break;
|
|
253
256
|
}
|
|
254
257
|
|
|
255
258
|
var firstItem = itemI === 0;
|
|
@@ -313,7 +316,8 @@ var Timeline = function Timeline(_ref) {
|
|
|
313
316
|
background: background,
|
|
314
317
|
width: width,
|
|
315
318
|
height: height,
|
|
316
|
-
playing: backgroundPlaying
|
|
319
|
+
playing: backgroundPlaying,
|
|
320
|
+
shouldLoad: current || active
|
|
317
321
|
}) : null, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
318
322
|
width: width,
|
|
319
323
|
height: height
|
|
@@ -405,8 +409,8 @@ var definition = [{
|
|
|
405
409
|
type: 'screen',
|
|
406
410
|
group: {
|
|
407
411
|
label: reactIntl.defineMessage({
|
|
408
|
-
|
|
409
|
-
|
|
412
|
+
id: "cGItoy",
|
|
413
|
+
defaultMessage: [{
|
|
410
414
|
"type": 0,
|
|
411
415
|
"value": "List"
|
|
412
416
|
}]
|
|
@@ -414,8 +418,8 @@ var definition = [{
|
|
|
414
418
|
order: 8
|
|
415
419
|
},
|
|
416
420
|
title: reactIntl.defineMessage({
|
|
417
|
-
|
|
418
|
-
|
|
421
|
+
id: "GzoKNb",
|
|
422
|
+
defaultMessage: [{
|
|
419
423
|
"type": 0,
|
|
420
424
|
"value": "Timeline"
|
|
421
425
|
}]
|
|
@@ -435,8 +439,8 @@ var definition = [{
|
|
|
435
439
|
}
|
|
436
440
|
},
|
|
437
441
|
label: reactIntl.defineMessage({
|
|
438
|
-
|
|
439
|
-
|
|
442
|
+
id: "3ifj0j",
|
|
443
|
+
defaultMessage: [{
|
|
440
444
|
"type": 0,
|
|
441
445
|
"value": "Entries"
|
|
442
446
|
}]
|
|
@@ -448,8 +452,8 @@ var definition = [{
|
|
|
448
452
|
options: [{
|
|
449
453
|
value: 'circle',
|
|
450
454
|
label: reactIntl.defineMessage({
|
|
451
|
-
|
|
452
|
-
|
|
455
|
+
id: "+uInZz",
|
|
456
|
+
defaultMessage: [{
|
|
453
457
|
"type": 0,
|
|
454
458
|
"value": "Circle"
|
|
455
459
|
}]
|
|
@@ -457,16 +461,16 @@ var definition = [{
|
|
|
457
461
|
}, {
|
|
458
462
|
value: 'square',
|
|
459
463
|
label: reactIntl.defineMessage({
|
|
460
|
-
|
|
461
|
-
|
|
464
|
+
id: "fusnxf",
|
|
465
|
+
defaultMessage: [{
|
|
462
466
|
"type": 0,
|
|
463
467
|
"value": "Square"
|
|
464
468
|
}]
|
|
465
469
|
})
|
|
466
470
|
}],
|
|
467
471
|
label: reactIntl.defineMessage({
|
|
468
|
-
|
|
469
|
-
|
|
472
|
+
id: "twTaAZ",
|
|
473
|
+
defaultMessage: [{
|
|
470
474
|
"type": 0,
|
|
471
475
|
"value": "Bullet shape"
|
|
472
476
|
}]
|
|
@@ -476,8 +480,8 @@ var definition = [{
|
|
|
476
480
|
type: 'toggle',
|
|
477
481
|
defaultValue: false,
|
|
478
482
|
label: reactIntl.defineMessage({
|
|
479
|
-
|
|
480
|
-
|
|
483
|
+
id: "YWcp4v",
|
|
484
|
+
defaultMessage: [{
|
|
481
485
|
"type": 0,
|
|
482
486
|
"value": "Bullet filled"
|
|
483
487
|
}]
|
|
@@ -490,8 +494,8 @@ var definition = [{
|
|
|
490
494
|
color: '#FFFFFF'
|
|
491
495
|
},
|
|
492
496
|
label: reactIntl.defineMessage({
|
|
493
|
-
|
|
494
|
-
|
|
497
|
+
id: "uNpHnA",
|
|
498
|
+
defaultMessage: [{
|
|
495
499
|
"type": 0,
|
|
496
500
|
"value": "Bullet color"
|
|
497
501
|
}]
|
|
@@ -504,8 +508,8 @@ var definition = [{
|
|
|
504
508
|
color: '#FFFFFF'
|
|
505
509
|
},
|
|
506
510
|
label: reactIntl.defineMessage({
|
|
507
|
-
|
|
508
|
-
|
|
511
|
+
id: "RHMS2f",
|
|
512
|
+
defaultMessage: [{
|
|
509
513
|
"type": 0,
|
|
510
514
|
"value": "Line color"
|
|
511
515
|
}]
|
|
@@ -514,8 +518,8 @@ var definition = [{
|
|
|
514
518
|
name: 'background',
|
|
515
519
|
type: 'background',
|
|
516
520
|
label: reactIntl.defineMessage({
|
|
517
|
-
|
|
518
|
-
|
|
521
|
+
id: "+MPZRu",
|
|
522
|
+
defaultMessage: [{
|
|
519
523
|
"type": 0,
|
|
520
524
|
"value": "Background"
|
|
521
525
|
}]
|
|
@@ -534,8 +538,8 @@ var definition = [{
|
|
|
534
538
|
type: 'screen',
|
|
535
539
|
group: {
|
|
536
540
|
label: reactIntl.defineMessage({
|
|
537
|
-
|
|
538
|
-
|
|
541
|
+
id: "cGItoy",
|
|
542
|
+
defaultMessage: [{
|
|
539
543
|
"type": 0,
|
|
540
544
|
"value": "List"
|
|
541
545
|
}]
|
|
@@ -543,8 +547,8 @@ var definition = [{
|
|
|
543
547
|
order: 8
|
|
544
548
|
},
|
|
545
549
|
title: reactIntl.defineMessage({
|
|
546
|
-
|
|
547
|
-
|
|
550
|
+
id: "33UbSd",
|
|
551
|
+
defaultMessage: [{
|
|
548
552
|
"type": 0,
|
|
549
553
|
"value": "Timeline with images"
|
|
550
554
|
}]
|
|
@@ -556,8 +560,8 @@ var definition = [{
|
|
|
556
560
|
type: 'screen-layout',
|
|
557
561
|
defaultValue: 'title-image-description',
|
|
558
562
|
label: reactIntl.defineMessage({
|
|
559
|
-
|
|
560
|
-
|
|
563
|
+
id: "4iBXj2",
|
|
564
|
+
defaultMessage: [{
|
|
561
565
|
"type": 0,
|
|
562
566
|
"value": "Layout"
|
|
563
567
|
}]
|
|
@@ -574,8 +578,8 @@ var definition = [{
|
|
|
574
578
|
}
|
|
575
579
|
},
|
|
576
580
|
label: reactIntl.defineMessage({
|
|
577
|
-
|
|
578
|
-
|
|
581
|
+
id: "3ifj0j",
|
|
582
|
+
defaultMessage: [{
|
|
579
583
|
"type": 0,
|
|
580
584
|
"value": "Entries"
|
|
581
585
|
}]
|
|
@@ -587,8 +591,8 @@ var definition = [{
|
|
|
587
591
|
options: [{
|
|
588
592
|
value: 'circle',
|
|
589
593
|
label: reactIntl.defineMessage({
|
|
590
|
-
|
|
591
|
-
|
|
594
|
+
id: "+uInZz",
|
|
595
|
+
defaultMessage: [{
|
|
592
596
|
"type": 0,
|
|
593
597
|
"value": "Circle"
|
|
594
598
|
}]
|
|
@@ -596,16 +600,16 @@ var definition = [{
|
|
|
596
600
|
}, {
|
|
597
601
|
value: 'square',
|
|
598
602
|
label: reactIntl.defineMessage({
|
|
599
|
-
|
|
600
|
-
|
|
603
|
+
id: "fusnxf",
|
|
604
|
+
defaultMessage: [{
|
|
601
605
|
"type": 0,
|
|
602
606
|
"value": "Square"
|
|
603
607
|
}]
|
|
604
608
|
})
|
|
605
609
|
}],
|
|
606
610
|
label: reactIntl.defineMessage({
|
|
607
|
-
|
|
608
|
-
|
|
611
|
+
id: "twTaAZ",
|
|
612
|
+
defaultMessage: [{
|
|
609
613
|
"type": 0,
|
|
610
614
|
"value": "Bullet shape"
|
|
611
615
|
}]
|
|
@@ -615,8 +619,8 @@ var definition = [{
|
|
|
615
619
|
type: 'toggle',
|
|
616
620
|
defaultValue: false,
|
|
617
621
|
label: reactIntl.defineMessage({
|
|
618
|
-
|
|
619
|
-
|
|
622
|
+
id: "YWcp4v",
|
|
623
|
+
defaultMessage: [{
|
|
620
624
|
"type": 0,
|
|
621
625
|
"value": "Bullet filled"
|
|
622
626
|
}]
|
|
@@ -629,8 +633,8 @@ var definition = [{
|
|
|
629
633
|
color: '#FFFFFF'
|
|
630
634
|
},
|
|
631
635
|
label: reactIntl.defineMessage({
|
|
632
|
-
|
|
633
|
-
|
|
636
|
+
id: "uNpHnA",
|
|
637
|
+
defaultMessage: [{
|
|
634
638
|
"type": 0,
|
|
635
639
|
"value": "Bullet color"
|
|
636
640
|
}]
|
|
@@ -643,8 +647,8 @@ var definition = [{
|
|
|
643
647
|
color: '#FFFFFF'
|
|
644
648
|
},
|
|
645
649
|
label: reactIntl.defineMessage({
|
|
646
|
-
|
|
647
|
-
|
|
650
|
+
id: "RHMS2f",
|
|
651
|
+
defaultMessage: [{
|
|
648
652
|
"type": 0,
|
|
649
653
|
"value": "Line color"
|
|
650
654
|
}]
|
|
@@ -653,8 +657,8 @@ var definition = [{
|
|
|
653
657
|
name: 'background',
|
|
654
658
|
type: 'background',
|
|
655
659
|
label: reactIntl.defineMessage({
|
|
656
|
-
|
|
657
|
-
|
|
660
|
+
id: "+MPZRu",
|
|
661
|
+
defaultMessage: [{
|
|
658
662
|
"type": 0,
|
|
659
663
|
"value": "Background"
|
|
660
664
|
}]
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-timeline",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.406",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -49,16 +49,16 @@
|
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@babel/runtime": "^7.13.10",
|
|
52
|
-
"@micromag/core": "^0.2.
|
|
53
|
-
"@micromag/element-background": "^0.2.
|
|
54
|
-
"@micromag/element-call-to-action": "^0.2.
|
|
55
|
-
"@micromag/element-container": "^0.2.
|
|
56
|
-
"@micromag/element-heading": "^0.2.
|
|
57
|
-
"@micromag/element-layout": "^0.2.
|
|
58
|
-
"@micromag/element-scroll": "^0.2.
|
|
59
|
-
"@micromag/element-text": "^0.2.
|
|
60
|
-
"@micromag/element-visual": "^0.2.
|
|
61
|
-
"@micromag/transforms": "^0.2.
|
|
52
|
+
"@micromag/core": "^0.2.405",
|
|
53
|
+
"@micromag/element-background": "^0.2.406",
|
|
54
|
+
"@micromag/element-call-to-action": "^0.2.405",
|
|
55
|
+
"@micromag/element-container": "^0.2.405",
|
|
56
|
+
"@micromag/element-heading": "^0.2.405",
|
|
57
|
+
"@micromag/element-layout": "^0.2.405",
|
|
58
|
+
"@micromag/element-scroll": "^0.2.405",
|
|
59
|
+
"@micromag/element-text": "^0.2.405",
|
|
60
|
+
"@micromag/element-visual": "^0.2.406",
|
|
61
|
+
"@micromag/transforms": "^0.2.405",
|
|
62
62
|
"classnames": "^2.2.6",
|
|
63
63
|
"lodash": "^4.17.21",
|
|
64
64
|
"prop-types": "^15.7.2",
|
|
@@ -68,5 +68,5 @@
|
|
|
68
68
|
"publishConfig": {
|
|
69
69
|
"access": "public"
|
|
70
70
|
},
|
|
71
|
-
"gitHead": "
|
|
71
|
+
"gitHead": "5e1a6de73674624b0cb3f9701140ea8850e6f35e"
|
|
72
72
|
}
|