@micromag/screen-timeline 0.2.403 → 0.2.407

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 (3) hide show
  1. package/es/index.js +30 -26
  2. package/lib/index.js +36 -32
  3. 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 Heading from '@micromag/element-heading';
20
- import Scroll from '@micromag/element-scroll';
21
- import CallToAction from '@micromag/element-call-to-action';
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
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 Heading = require('@micromag/element-heading');
24
- var Scroll = require('@micromag/element-scroll');
25
- var CallToAction = require('@micromag/element-call-to-action');
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 Heading__default = /*#__PURE__*/_interopDefaultLegacy(Heading);
44
- var Scroll__default = /*#__PURE__*/_interopDefaultLegacy(Scroll);
45
- var CallToAction__default = /*#__PURE__*/_interopDefaultLegacy(CallToAction);
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
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-timeline",
3
- "version": "0.2.403",
3
+ "version": "0.2.407",
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.403",
53
- "@micromag/element-background": "^0.2.403",
54
- "@micromag/element-call-to-action": "^0.2.403",
55
- "@micromag/element-container": "^0.2.403",
56
- "@micromag/element-heading": "^0.2.403",
57
- "@micromag/element-layout": "^0.2.403",
58
- "@micromag/element-scroll": "^0.2.403",
59
- "@micromag/element-text": "^0.2.403",
60
- "@micromag/element-visual": "^0.2.403",
61
- "@micromag/transforms": "^0.2.403",
52
+ "@micromag/core": "^0.2.405",
53
+ "@micromag/element-background": "^0.2.407",
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.407",
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": "7a6604651c990286e594350ef730d40772937195"
71
+ "gitHead": "6e9f2acd39ad4982b571b91c406d30c59f4be473"
72
72
  }