@micromag/screen-urbania-recommendation 0.3.105 → 0.3.108

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 +34 -12
  2. package/lib/index.js +33 -11
  3. package/package.json +11 -11
package/es/index.js CHANGED
@@ -4,7 +4,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
4
4
  import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
5
5
  import classNames from 'classnames';
6
6
  import PropTypes$1 from 'prop-types';
7
- import React, { useState, useCallback, useMemo } from 'react';
7
+ import React, { useState, useEffect, useCallback, useMemo } from 'react';
8
8
  import { PropTypes } from '@micromag/core';
9
9
  import { ScreenElement, PlaceholderTitle, PlaceholderText, TransitionsStagger } from '@micromag/core/components';
10
10
  import { useScreenSize, useViewer, useScreenRenderContext } from '@micromag/core/contexts';
@@ -95,6 +95,13 @@ var Recommendation = function Recommendation(_ref) {
95
95
  isStatic = _useScreenRenderConte.isStatic,
96
96
  isCapture = _useScreenRenderConte.isCapture;
97
97
 
98
+ var finalAnimateBackground = current && animateBackground && !isPlaceholder && !isStatic && !isPreview && !isEdit;
99
+
100
+ var _useState = useState(finalAnimateBackground),
101
+ _useState2 = _slicedToArray(_useState, 2),
102
+ animationStarted = _useState2[0],
103
+ setAnimationStarted = _useState2[1];
104
+
98
105
  var hasCategory = isTextFilled(category);
99
106
  var hasDate = isTextFilled(date);
100
107
  var hasTitle = isTextFilled(title);
@@ -103,22 +110,37 @@ var Recommendation = function Recommendation(_ref) {
103
110
  var onlyCategory = hasCategory && !hasDate && !hasTitle && !hasSponsor && !hasDescription;
104
111
  var hasTextCard = hasCategory || hasDate || hasTitle || hasSponsor || hasDescription;
105
112
  var backgroundPlaying = current && (isView || isEdit);
106
- var backgroundShouldLoad = current || active || !isView;
107
- var finalAnimateBackground = current && animateBackground && !isPlaceholder && !isStatic && !isPreview && !isEdit;
113
+ var backgroundShouldLoad = current || active;
108
114
  var transitionPlaying = current;
109
115
  var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
110
116
  var scrollingDisabled = !isEdit && transitionDisabled || !current;
111
- var scrollTimein = setTimeout(function () {
112
- return true;
113
- }, 3000);
114
- var finalScrollTimein = finalAnimateBackground && scrollTimein;
115
117
  var hasCallToAction = callToAction !== null && callToAction.active === true;
116
118
 
117
- var _useState = useState(false),
118
- _useState2 = _slicedToArray(_useState, 2),
119
- scrolledBottom = _useState2[0],
120
- setScrolledBottom = _useState2[1];
119
+ var _useState3 = useState(false),
120
+ _useState4 = _slicedToArray(_useState3, 2),
121
+ scrolledBottom = _useState4[0],
122
+ setScrolledBottom = _useState4[1];
123
+
124
+ useEffect(function () {
125
+ var id = null;
121
126
 
127
+ if (animationStarted) {
128
+ id = setTimeout(function () {
129
+ setAnimationStarted(false);
130
+ }, 3000);
131
+ }
132
+
133
+ return function () {
134
+ clearTimeout(id);
135
+ };
136
+ }, [animationStarted, finalAnimateBackground, setAnimationStarted]);
137
+ useEffect(function () {
138
+ if (!isView) {
139
+ setAnimationStarted(false);
140
+ } else {
141
+ setAnimationStarted(true);
142
+ }
143
+ }, [isView, setAnimationStarted]);
122
144
  var onScrolledBottom = useCallback(function (_ref2) {
123
145
  var initial = _ref2.initial;
124
146
 
@@ -263,7 +285,7 @@ var Recommendation = function Recommendation(_ref) {
263
285
  width: width,
264
286
  height: height
265
287
  }, /*#__PURE__*/React.createElement(Scroll, {
266
- disabled: finalScrollTimein && scrollingDisabled,
288
+ disabled: animationStarted || scrollingDisabled,
267
289
  onScrolledBottom: onScrolledBottom,
268
290
  onScrolledNotBottom: onScrolledNotBottom,
269
291
  verticalAlign: "top"
package/lib/index.js CHANGED
@@ -115,6 +115,13 @@ var Recommendation = function Recommendation(_ref) {
115
115
  isStatic = _useScreenRenderConte.isStatic,
116
116
  isCapture = _useScreenRenderConte.isCapture;
117
117
 
118
+ var finalAnimateBackground = current && animateBackground && !isPlaceholder && !isStatic && !isPreview && !isEdit;
119
+
120
+ var _useState = React.useState(finalAnimateBackground),
121
+ _useState2 = _slicedToArray__default["default"](_useState, 2),
122
+ animationStarted = _useState2[0],
123
+ setAnimationStarted = _useState2[1];
124
+
118
125
  var hasCategory = utils.isTextFilled(category);
119
126
  var hasDate = utils.isTextFilled(date);
120
127
  var hasTitle = utils.isTextFilled(title);
@@ -123,22 +130,37 @@ var Recommendation = function Recommendation(_ref) {
123
130
  var onlyCategory = hasCategory && !hasDate && !hasTitle && !hasSponsor && !hasDescription;
124
131
  var hasTextCard = hasCategory || hasDate || hasTitle || hasSponsor || hasDescription;
125
132
  var backgroundPlaying = current && (isView || isEdit);
126
- var backgroundShouldLoad = current || active || !isView;
127
- var finalAnimateBackground = current && animateBackground && !isPlaceholder && !isStatic && !isPreview && !isEdit;
133
+ var backgroundShouldLoad = current || active;
128
134
  var transitionPlaying = current;
129
135
  var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
130
136
  var scrollingDisabled = !isEdit && transitionDisabled || !current;
131
- var scrollTimein = setTimeout(function () {
132
- return true;
133
- }, 3000);
134
- var finalScrollTimein = finalAnimateBackground && scrollTimein;
135
137
  var hasCallToAction = callToAction !== null && callToAction.active === true;
136
138
 
137
- var _useState = React.useState(false),
138
- _useState2 = _slicedToArray__default["default"](_useState, 2),
139
- scrolledBottom = _useState2[0],
140
- setScrolledBottom = _useState2[1];
139
+ var _useState3 = React.useState(false),
140
+ _useState4 = _slicedToArray__default["default"](_useState3, 2),
141
+ scrolledBottom = _useState4[0],
142
+ setScrolledBottom = _useState4[1];
143
+
144
+ React.useEffect(function () {
145
+ var id = null;
141
146
 
147
+ if (animationStarted) {
148
+ id = setTimeout(function () {
149
+ setAnimationStarted(false);
150
+ }, 3000);
151
+ }
152
+
153
+ return function () {
154
+ clearTimeout(id);
155
+ };
156
+ }, [animationStarted, finalAnimateBackground, setAnimationStarted]);
157
+ React.useEffect(function () {
158
+ if (!isView) {
159
+ setAnimationStarted(false);
160
+ } else {
161
+ setAnimationStarted(true);
162
+ }
163
+ }, [isView, setAnimationStarted]);
142
164
  var onScrolledBottom = React.useCallback(function (_ref2) {
143
165
  var initial = _ref2.initial;
144
166
 
@@ -283,7 +305,7 @@ var Recommendation = function Recommendation(_ref) {
283
305
  width: width,
284
306
  height: height
285
307
  }, /*#__PURE__*/React__default["default"].createElement(Scroll__default["default"], {
286
- disabled: finalScrollTimein && scrollingDisabled,
308
+ disabled: animationStarted || scrollingDisabled,
287
309
  onScrolledBottom: onScrolledBottom,
288
310
  onScrolledNotBottom: onScrolledNotBottom,
289
311
  verticalAlign: "top"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-urbania-recommendation",
3
- "version": "0.3.105",
3
+ "version": "0.3.108",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -49,15 +49,15 @@
49
49
  },
50
50
  "dependencies": {
51
51
  "@babel/runtime": "^7.13.10",
52
- "@micromag/core": "^0.3.105",
53
- "@micromag/element-background": "^0.3.105",
54
- "@micromag/element-call-to-action": "^0.3.105",
55
- "@micromag/element-container": "^0.3.105",
56
- "@micromag/element-heading": "^0.3.105",
57
- "@micromag/element-layout": "^0.3.105",
58
- "@micromag/element-scroll": "^0.3.105",
59
- "@micromag/element-text": "^0.3.105",
60
- "@micromag/transforms": "^0.3.105",
52
+ "@micromag/core": "^0.3.108",
53
+ "@micromag/element-background": "^0.3.108",
54
+ "@micromag/element-call-to-action": "^0.3.108",
55
+ "@micromag/element-container": "^0.3.108",
56
+ "@micromag/element-heading": "^0.3.108",
57
+ "@micromag/element-layout": "^0.3.108",
58
+ "@micromag/element-scroll": "^0.3.108",
59
+ "@micromag/element-text": "^0.3.108",
60
+ "@micromag/transforms": "^0.3.108",
61
61
  "classnames": "^2.2.6",
62
62
  "lodash": "^4.17.21",
63
63
  "prop-types": "^15.7.2",
@@ -67,5 +67,5 @@
67
67
  "publishConfig": {
68
68
  "access": "public"
69
69
  },
70
- "gitHead": "fb6c28846c08f30c035ebbc162a4135b8b4d42a5"
70
+ "gitHead": "d7681b84be82b08eff5ed444f910ed367f235f4e"
71
71
  }