@micromag/screen-urbania-recommendation 0.3.311 → 0.3.322
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/assets/css/styles.css +1 -1
- package/es/index.js +42 -60
- package/lib/index.js +42 -60
- package/package.json +12 -12
package/assets/css/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-background{position:absolute;top:0;
|
|
1
|
+
.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-background{height:100%;left:0;position:absolute;top:0;width:100%}.micromag-screen-urbania-recommendation-container{height:100%;overflow:hidden;position:relative;width:100%}.micromag-screen-urbania-recommendation-disabled.micromag-screen-urbania-recommendation-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-recommendation-hidden.micromag-screen-urbania-recommendation-container{display:none;visibility:hidden}.micromag-screen-urbania-recommendation-placeholder.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-content{padding:6px;position:relative}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-emptyText,.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-emptyTitle{border:2px dashed #343434;color:#343434;margin:5px auto}.micromag-screen-urbania-recommendation-container{-ms-flex-align:start;align-items:flex-start}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-background{z-index:0}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-content{z-index:1}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-emptyText,.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-emptyTitle{margin:10px auto;width:100%}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-emptyTitle{height:100px}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-emptyText{height:50px}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-callToAction{-webkit-transition:opacity .2 ease-out;-o-transition:opacity .2 ease-out;transition:opacity .2 ease-out}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-callToAction.micromag-screen-urbania-recommendation-disabled{opacity:0}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-textCard{border:2px solid #000;border-radius:17px;-webkit-box-shadow:0 3px 34px rgba(0,0,0,.43);box-shadow:0 3px 34px rgba(0,0,0,.43);color:#000;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;text-align:center}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-textCard.micromag-screen-urbania-recommendation-isPlaceholder{background-color:#adadad;height:200px}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-textCard.micromag-screen-urbania-recommendation-appear{-webkit-animation:micromag-screen-urbania-recommendation-appear 1s ease-in-out;animation:micromag-screen-urbania-recommendation-appear 1s ease-in-out;-webkit-animation-delay:.9s;animation-delay:.9s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;opacity:0}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-category{background-color:#ff4f46;border-bottom:2px solid #000;color:#fff;font-family:Agrandir Tight,sans-serif;font-size:28px;font-weight:900;padding:12px 10px 6px;text-transform:uppercase}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-category.micromag-screen-urbania-recommendation-noBottomBorder{border-bottom:0}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-categoryPlaceholder{background-color:#343434;padding:10px}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-dateTitleRow{-ms-flex-align:center;-ms-flex-pack:center;align-items:center;background-color:#fff;display:-ms-flexbox;display:flex;justify-content:center;width:100%}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-dateTitleRow.micromag-screen-urbania-recommendation-bottomBorder{border-bottom:2px solid #000}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-dateTitleRow.micromag-screen-urbania-recommendation-isPlaceholder{background-color:#e9e9e9;margin-left:2px;padding:10px}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-dateContainer{-ms-flex-positive:1;flex-grow:1;height:inherit;max-width:50%;min-width:30%;overflow-wrap:break-word;padding:15px 10px;text-align:center}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-dateContainer.micromag-screen-urbania-recommendation-rightBorder{border-right:2px solid #000}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-dateContainer strong{white-space:nowrap}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-date{color:#ff4f46;font-family:Agrandir,sans-serif;font-size:12px;line-height:1}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-date.micromag-screen-urbania-recommendation-centerDate{text-align:center}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-titleContainer{max-width:70%;min-width:50%;overflow-wrap:break-word}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-titleContainer.micromag-screen-urbania-recommendation-leftBorder{border-left:2px solid #000;margin-left:-2px;margin-right:-2px}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-title{font-family:Agrandir Narrow,sans-serif;font-size:20px;font-weight:700;line-height:1;padding:15px 20px 11px;text-align:center;text-transform:uppercase}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-sponsor{background-color:#fffc00;font-family:Agrandir,sans-serif;font-size:10px;line-height:1;padding:5px 10px 3px;text-transform:uppercase}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-sponsor>p{margin-bottom:0;margin-top:0}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-sponsor.micromag-screen-urbania-recommendation-bottomBorder{border-bottom:2px solid #000}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-sponsorPlaceholder{padding:10px}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-description{background-color:#fff;font-family:Roboto,sans-serif;font-size:12px;padding:10px;text-align:left}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-description p{margin-bottom:1em}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-description p:last-child{margin-bottom:0}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-descriptionPlaceholder{padding:10px 10px 30px}.micromag-screen-urbania-recommendation-container .micromag-screen-urbania-recommendation-background{-webkit-animation:micromag-screen-urbania-recommendation-roll .9s ease-out;animation:micromag-screen-urbania-recommendation-roll .9s ease-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.micromag-screen-urbania-recommendation-container.micromag-screen-urbania-recommendation-isPlaceholder .micromag-screen-urbania-recommendation-layout{padding:10px}@-webkit-keyframes micromag-screen-urbania-recommendation-roll{0%{background-position-y:-50vh}to{background-position-y:0}}@keyframes micromag-screen-urbania-recommendation-roll{0%{background-position-y:-50vh}to{background-position-y:0}}@-webkit-keyframes micromag-screen-urbania-recommendation-appear{0%{opacity:0}66%{opacity:0}to{opacity:1}}@keyframes micromag-screen-urbania-recommendation-appear{0%{opacity:0}66%{opacity:0}to{opacity:1}}
|
package/es/index.js
CHANGED
|
@@ -18,7 +18,7 @@ import Layout, { Spacer } from '@micromag/element-layout';
|
|
|
18
18
|
import Scroll from '@micromag/element-scroll';
|
|
19
19
|
import Text from '@micromag/element-text';
|
|
20
20
|
|
|
21
|
-
var styles = {"container":"micromag-screen-urbania-recommendation-container","background":"micromag-screen-urbania-recommendation-background","disabled":"micromag-screen-urbania-recommendation-disabled","hidden":"micromag-screen-urbania-recommendation-hidden","placeholder":"micromag-screen-urbania-recommendation-placeholder","content":"micromag-screen-urbania-recommendation-content","
|
|
21
|
+
var styles = {"container":"micromag-screen-urbania-recommendation-container","background":"micromag-screen-urbania-recommendation-background","disabled":"micromag-screen-urbania-recommendation-disabled","hidden":"micromag-screen-urbania-recommendation-hidden","placeholder":"micromag-screen-urbania-recommendation-placeholder","content":"micromag-screen-urbania-recommendation-content","emptyTitle":"micromag-screen-urbania-recommendation-emptyTitle","emptyText":"micromag-screen-urbania-recommendation-emptyText","callToAction":"micromag-screen-urbania-recommendation-callToAction","textCard":"micromag-screen-urbania-recommendation-textCard","isPlaceholder":"micromag-screen-urbania-recommendation-isPlaceholder","appear":"micromag-screen-urbania-recommendation-appear","category":"micromag-screen-urbania-recommendation-category","noBottomBorder":"micromag-screen-urbania-recommendation-noBottomBorder","categoryPlaceholder":"micromag-screen-urbania-recommendation-categoryPlaceholder","dateTitleRow":"micromag-screen-urbania-recommendation-dateTitleRow","bottomBorder":"micromag-screen-urbania-recommendation-bottomBorder","dateContainer":"micromag-screen-urbania-recommendation-dateContainer","rightBorder":"micromag-screen-urbania-recommendation-rightBorder","date":"micromag-screen-urbania-recommendation-date","centerDate":"micromag-screen-urbania-recommendation-centerDate","titleContainer":"micromag-screen-urbania-recommendation-titleContainer","leftBorder":"micromag-screen-urbania-recommendation-leftBorder","title":"micromag-screen-urbania-recommendation-title","sponsor":"micromag-screen-urbania-recommendation-sponsor","sponsorPlaceholder":"micromag-screen-urbania-recommendation-sponsorPlaceholder","description":"micromag-screen-urbania-recommendation-description","descriptionPlaceholder":"micromag-screen-urbania-recommendation-descriptionPlaceholder","roll":"micromag-screen-urbania-recommendation-roll","layout":"micromag-screen-urbania-recommendation-layout"};
|
|
22
22
|
|
|
23
23
|
var propTypes = {
|
|
24
24
|
category: PropTypes.headingElement,
|
|
@@ -52,59 +52,48 @@ var defaultProps = {
|
|
|
52
52
|
transitionStagger: 100,
|
|
53
53
|
className: null
|
|
54
54
|
};
|
|
55
|
-
|
|
56
55
|
var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
57
56
|
var _ref4, _ref5, _ref6, _ref7, _ref8, _ref12;
|
|
58
|
-
|
|
59
57
|
var category = _ref.category,
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
58
|
+
date = _ref.date,
|
|
59
|
+
title = _ref.title,
|
|
60
|
+
sponsor = _ref.sponsor,
|
|
61
|
+
description = _ref.description,
|
|
62
|
+
spacing = _ref.spacing,
|
|
63
|
+
background = _ref.background,
|
|
64
|
+
callToAction = _ref.callToAction,
|
|
65
|
+
current = _ref.current,
|
|
66
|
+
active = _ref.active,
|
|
67
|
+
animateBackground = _ref.animateBackground,
|
|
68
|
+
transitions = _ref.transitions,
|
|
69
|
+
transitionStagger = _ref.transitionStagger,
|
|
70
|
+
className = _ref.className;
|
|
73
71
|
var trackScreenEvent = useTrackScreenEvent();
|
|
74
|
-
|
|
75
72
|
var _useScreenSize = useScreenSize(),
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
73
|
+
width = _useScreenSize.width,
|
|
74
|
+
height = _useScreenSize.height,
|
|
75
|
+
resolution = _useScreenSize.resolution;
|
|
80
76
|
var _useViewerContext = useViewerContext(),
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
77
|
+
viewerTopHeight = _useViewerContext.topHeight,
|
|
78
|
+
viewerBottomHeight = _useViewerContext.bottomHeight,
|
|
79
|
+
viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
|
|
85
80
|
var _useViewerWebView = useViewerWebView(),
|
|
86
|
-
|
|
87
|
-
|
|
81
|
+
openWebView = _useViewerWebView.open;
|
|
88
82
|
var _usePlaybackContext = usePlaybackContext(),
|
|
89
|
-
|
|
90
|
-
|
|
83
|
+
muted = _usePlaybackContext.muted;
|
|
91
84
|
var mediaRef = usePlaybackMediaRef(current);
|
|
92
|
-
|
|
93
85
|
var _useScreenRenderConte = useScreenRenderContext(),
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
86
|
+
isView = _useScreenRenderConte.isView,
|
|
87
|
+
isPreview = _useScreenRenderConte.isPreview,
|
|
88
|
+
isPlaceholder = _useScreenRenderConte.isPlaceholder,
|
|
89
|
+
isEdit = _useScreenRenderConte.isEdit,
|
|
90
|
+
isStatic = _useScreenRenderConte.isStatic,
|
|
91
|
+
isCapture = _useScreenRenderConte.isCapture;
|
|
101
92
|
var finalAnimateBackground = current && animateBackground && !isPlaceholder && !isStatic && !isPreview && !isEdit;
|
|
102
|
-
|
|
103
93
|
var _useState = useState(finalAnimateBackground),
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
94
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
95
|
+
animationStarted = _useState2[0],
|
|
96
|
+
setAnimationStarted = _useState2[1];
|
|
108
97
|
var hasCategory = isTextFilled(category);
|
|
109
98
|
var hasDate = isTextFilled(date);
|
|
110
99
|
var hasTitle = isTextFilled(title);
|
|
@@ -117,25 +106,20 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
117
106
|
var transitionPlaying = current;
|
|
118
107
|
var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
|
|
119
108
|
var scrollingDisabled = !isEdit && transitionDisabled || !current;
|
|
120
|
-
|
|
121
109
|
var _ref2 = callToAction || {},
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
110
|
+
_ref2$active = _ref2.active,
|
|
111
|
+
hasCallToAction = _ref2$active === void 0 ? false : _ref2$active;
|
|
125
112
|
var _useState3 = useState(false),
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
113
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
114
|
+
scrolledBottom = _useState4[0],
|
|
115
|
+
setScrolledBottom = _useState4[1];
|
|
130
116
|
useEffect(function () {
|
|
131
117
|
var id = null;
|
|
132
|
-
|
|
133
118
|
if (animationStarted) {
|
|
134
119
|
id = setTimeout(function () {
|
|
135
120
|
setAnimationStarted(false);
|
|
136
121
|
}, 3000);
|
|
137
122
|
}
|
|
138
|
-
|
|
139
123
|
return function () {
|
|
140
124
|
clearTimeout(id);
|
|
141
125
|
};
|
|
@@ -149,11 +133,9 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
149
133
|
}, [isView, setAnimationStarted]);
|
|
150
134
|
var onScrolledBottom = useCallback(function (_ref3) {
|
|
151
135
|
var initial = _ref3.initial;
|
|
152
|
-
|
|
153
136
|
if (initial) {
|
|
154
137
|
trackScreenEvent('scroll', 'Screen');
|
|
155
138
|
}
|
|
156
|
-
|
|
157
139
|
setScrolledBottom(true);
|
|
158
140
|
}, [trackScreenEvent]);
|
|
159
141
|
var onScrolledNotBottom = useCallback(function () {
|
|
@@ -166,8 +148,9 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
166
148
|
// verticalAlign: '-20%',
|
|
167
149
|
repeat: true
|
|
168
150
|
}, background);
|
|
169
|
-
}, [background]);
|
|
151
|
+
}, [background]);
|
|
170
152
|
|
|
153
|
+
// Create elements
|
|
171
154
|
var items = [!isPlaceholder ? /*#__PURE__*/React.createElement(Spacer, {
|
|
172
155
|
key: "spacer-cta-top"
|
|
173
156
|
}) : null, hasTextCard || isPlaceholder || isEdit ? /*#__PURE__*/React.createElement(Container, {
|
|
@@ -194,7 +177,8 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
194
177
|
key: "date",
|
|
195
178
|
placeholder: /*#__PURE__*/React.createElement(PlaceholderText, {
|
|
196
179
|
className: styles.datePlaceholder
|
|
197
|
-
})
|
|
180
|
+
})
|
|
181
|
+
// emptyLabel={
|
|
198
182
|
// <FormattedMessage
|
|
199
183
|
// defaultMessage="Date"
|
|
200
184
|
// description="Date placeholder"
|
|
@@ -202,14 +186,14 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
202
186
|
// }
|
|
203
187
|
// emptyClassName={styles.emptyText}
|
|
204
188
|
// isEmpty={!hasDate}
|
|
205
|
-
|
|
206
189
|
}, hasDate ? /*#__PURE__*/React.createElement("div", {
|
|
207
190
|
className: classNames([styles.dateContainer, (_ref7 = {}, _defineProperty(_ref7, className, className !== null), _defineProperty(_ref7, styles.rightBorder, hasTitle), _ref7)])
|
|
208
191
|
}, /*#__PURE__*/React.createElement(Text, Object.assign({
|
|
209
192
|
className: classNames([styles.date, (_ref8 = {}, _defineProperty(_ref8, className, className !== null), _defineProperty(_ref8, styles.centerDate, !hasTitle), _ref8)])
|
|
210
193
|
}, date))) : null), /*#__PURE__*/React.createElement(ScreenElement, {
|
|
211
194
|
key: "title",
|
|
212
|
-
placeholder: "title"
|
|
195
|
+
placeholder: "title"
|
|
196
|
+
// emptyLabel={
|
|
213
197
|
// <FormattedMessage
|
|
214
198
|
// defaultMessage="Title"
|
|
215
199
|
// description="Title placeholder"
|
|
@@ -217,7 +201,6 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
217
201
|
// }
|
|
218
202
|
// emptyClassName={styles.emptyTitle}
|
|
219
203
|
// isEmpty={!hasTitle}
|
|
220
|
-
|
|
221
204
|
}, hasTitle ? /*#__PURE__*/React.createElement("div", {
|
|
222
205
|
className: classNames([styles.titleContainer, _defineProperty({}, styles.leftBorder, hasDate)])
|
|
223
206
|
}, /*#__PURE__*/React.createElement(Heading, Object.assign({
|
|
@@ -309,7 +292,6 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
309
292
|
className: styles.background
|
|
310
293
|
}) : null);
|
|
311
294
|
};
|
|
312
|
-
|
|
313
295
|
UrbaniaRecommendation.propTypes = propTypes;
|
|
314
296
|
UrbaniaRecommendation.defaultProps = defaultProps;
|
|
315
297
|
var UrbaniaRecommendation$1 = /*#__PURE__*/React.memo(UrbaniaRecommendation);
|
package/lib/index.js
CHANGED
|
@@ -38,7 +38,7 @@ var Layout__default = /*#__PURE__*/_interopDefaultLegacy(Layout);
|
|
|
38
38
|
var Scroll__default = /*#__PURE__*/_interopDefaultLegacy(Scroll);
|
|
39
39
|
var Text__default = /*#__PURE__*/_interopDefaultLegacy(Text);
|
|
40
40
|
|
|
41
|
-
var styles = {"container":"micromag-screen-urbania-recommendation-container","background":"micromag-screen-urbania-recommendation-background","disabled":"micromag-screen-urbania-recommendation-disabled","hidden":"micromag-screen-urbania-recommendation-hidden","placeholder":"micromag-screen-urbania-recommendation-placeholder","content":"micromag-screen-urbania-recommendation-content","
|
|
41
|
+
var styles = {"container":"micromag-screen-urbania-recommendation-container","background":"micromag-screen-urbania-recommendation-background","disabled":"micromag-screen-urbania-recommendation-disabled","hidden":"micromag-screen-urbania-recommendation-hidden","placeholder":"micromag-screen-urbania-recommendation-placeholder","content":"micromag-screen-urbania-recommendation-content","emptyTitle":"micromag-screen-urbania-recommendation-emptyTitle","emptyText":"micromag-screen-urbania-recommendation-emptyText","callToAction":"micromag-screen-urbania-recommendation-callToAction","textCard":"micromag-screen-urbania-recommendation-textCard","isPlaceholder":"micromag-screen-urbania-recommendation-isPlaceholder","appear":"micromag-screen-urbania-recommendation-appear","category":"micromag-screen-urbania-recommendation-category","noBottomBorder":"micromag-screen-urbania-recommendation-noBottomBorder","categoryPlaceholder":"micromag-screen-urbania-recommendation-categoryPlaceholder","dateTitleRow":"micromag-screen-urbania-recommendation-dateTitleRow","bottomBorder":"micromag-screen-urbania-recommendation-bottomBorder","dateContainer":"micromag-screen-urbania-recommendation-dateContainer","rightBorder":"micromag-screen-urbania-recommendation-rightBorder","date":"micromag-screen-urbania-recommendation-date","centerDate":"micromag-screen-urbania-recommendation-centerDate","titleContainer":"micromag-screen-urbania-recommendation-titleContainer","leftBorder":"micromag-screen-urbania-recommendation-leftBorder","title":"micromag-screen-urbania-recommendation-title","sponsor":"micromag-screen-urbania-recommendation-sponsor","sponsorPlaceholder":"micromag-screen-urbania-recommendation-sponsorPlaceholder","description":"micromag-screen-urbania-recommendation-description","descriptionPlaceholder":"micromag-screen-urbania-recommendation-descriptionPlaceholder","roll":"micromag-screen-urbania-recommendation-roll","layout":"micromag-screen-urbania-recommendation-layout"};
|
|
42
42
|
|
|
43
43
|
var propTypes = {
|
|
44
44
|
category: core.PropTypes.headingElement,
|
|
@@ -72,59 +72,48 @@ var defaultProps = {
|
|
|
72
72
|
transitionStagger: 100,
|
|
73
73
|
className: null
|
|
74
74
|
};
|
|
75
|
-
|
|
76
75
|
var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
77
76
|
var _ref4, _ref5, _ref6, _ref7, _ref8, _ref12;
|
|
78
|
-
|
|
79
77
|
var category = _ref.category,
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
78
|
+
date = _ref.date,
|
|
79
|
+
title = _ref.title,
|
|
80
|
+
sponsor = _ref.sponsor,
|
|
81
|
+
description = _ref.description,
|
|
82
|
+
spacing = _ref.spacing,
|
|
83
|
+
background = _ref.background,
|
|
84
|
+
callToAction = _ref.callToAction,
|
|
85
|
+
current = _ref.current,
|
|
86
|
+
active = _ref.active,
|
|
87
|
+
animateBackground = _ref.animateBackground,
|
|
88
|
+
transitions = _ref.transitions,
|
|
89
|
+
transitionStagger = _ref.transitionStagger,
|
|
90
|
+
className = _ref.className;
|
|
93
91
|
var trackScreenEvent = hooks.useTrackScreenEvent();
|
|
94
|
-
|
|
95
92
|
var _useScreenSize = contexts.useScreenSize(),
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
93
|
+
width = _useScreenSize.width,
|
|
94
|
+
height = _useScreenSize.height,
|
|
95
|
+
resolution = _useScreenSize.resolution;
|
|
100
96
|
var _useViewerContext = contexts.useViewerContext(),
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
97
|
+
viewerTopHeight = _useViewerContext.topHeight,
|
|
98
|
+
viewerBottomHeight = _useViewerContext.bottomHeight,
|
|
99
|
+
viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
|
|
105
100
|
var _useViewerWebView = contexts.useViewerWebView(),
|
|
106
|
-
|
|
107
|
-
|
|
101
|
+
openWebView = _useViewerWebView.open;
|
|
108
102
|
var _usePlaybackContext = contexts.usePlaybackContext(),
|
|
109
|
-
|
|
110
|
-
|
|
103
|
+
muted = _usePlaybackContext.muted;
|
|
111
104
|
var mediaRef = contexts.usePlaybackMediaRef(current);
|
|
112
|
-
|
|
113
105
|
var _useScreenRenderConte = contexts.useScreenRenderContext(),
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
106
|
+
isView = _useScreenRenderConte.isView,
|
|
107
|
+
isPreview = _useScreenRenderConte.isPreview,
|
|
108
|
+
isPlaceholder = _useScreenRenderConte.isPlaceholder,
|
|
109
|
+
isEdit = _useScreenRenderConte.isEdit,
|
|
110
|
+
isStatic = _useScreenRenderConte.isStatic,
|
|
111
|
+
isCapture = _useScreenRenderConte.isCapture;
|
|
121
112
|
var finalAnimateBackground = current && animateBackground && !isPlaceholder && !isStatic && !isPreview && !isEdit;
|
|
122
|
-
|
|
123
113
|
var _useState = React.useState(finalAnimateBackground),
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
114
|
+
_useState2 = _slicedToArray__default["default"](_useState, 2),
|
|
115
|
+
animationStarted = _useState2[0],
|
|
116
|
+
setAnimationStarted = _useState2[1];
|
|
128
117
|
var hasCategory = utils.isTextFilled(category);
|
|
129
118
|
var hasDate = utils.isTextFilled(date);
|
|
130
119
|
var hasTitle = utils.isTextFilled(title);
|
|
@@ -137,25 +126,20 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
137
126
|
var transitionPlaying = current;
|
|
138
127
|
var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
|
|
139
128
|
var scrollingDisabled = !isEdit && transitionDisabled || !current;
|
|
140
|
-
|
|
141
129
|
var _ref2 = callToAction || {},
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
130
|
+
_ref2$active = _ref2.active,
|
|
131
|
+
hasCallToAction = _ref2$active === void 0 ? false : _ref2$active;
|
|
145
132
|
var _useState3 = React.useState(false),
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
133
|
+
_useState4 = _slicedToArray__default["default"](_useState3, 2),
|
|
134
|
+
scrolledBottom = _useState4[0],
|
|
135
|
+
setScrolledBottom = _useState4[1];
|
|
150
136
|
React.useEffect(function () {
|
|
151
137
|
var id = null;
|
|
152
|
-
|
|
153
138
|
if (animationStarted) {
|
|
154
139
|
id = setTimeout(function () {
|
|
155
140
|
setAnimationStarted(false);
|
|
156
141
|
}, 3000);
|
|
157
142
|
}
|
|
158
|
-
|
|
159
143
|
return function () {
|
|
160
144
|
clearTimeout(id);
|
|
161
145
|
};
|
|
@@ -169,11 +153,9 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
169
153
|
}, [isView, setAnimationStarted]);
|
|
170
154
|
var onScrolledBottom = React.useCallback(function (_ref3) {
|
|
171
155
|
var initial = _ref3.initial;
|
|
172
|
-
|
|
173
156
|
if (initial) {
|
|
174
157
|
trackScreenEvent('scroll', 'Screen');
|
|
175
158
|
}
|
|
176
|
-
|
|
177
159
|
setScrolledBottom(true);
|
|
178
160
|
}, [trackScreenEvent]);
|
|
179
161
|
var onScrolledNotBottom = React.useCallback(function () {
|
|
@@ -186,8 +168,9 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
186
168
|
// verticalAlign: '-20%',
|
|
187
169
|
repeat: true
|
|
188
170
|
}, background);
|
|
189
|
-
}, [background]);
|
|
171
|
+
}, [background]);
|
|
190
172
|
|
|
173
|
+
// Create elements
|
|
191
174
|
var items = [!isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
192
175
|
key: "spacer-cta-top"
|
|
193
176
|
}) : null, hasTextCard || isPlaceholder || isEdit ? /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
@@ -214,7 +197,8 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
214
197
|
key: "date",
|
|
215
198
|
placeholder: /*#__PURE__*/React__default["default"].createElement(components.PlaceholderText, {
|
|
216
199
|
className: styles.datePlaceholder
|
|
217
|
-
})
|
|
200
|
+
})
|
|
201
|
+
// emptyLabel={
|
|
218
202
|
// <FormattedMessage
|
|
219
203
|
// defaultMessage="Date"
|
|
220
204
|
// description="Date placeholder"
|
|
@@ -222,14 +206,14 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
222
206
|
// }
|
|
223
207
|
// emptyClassName={styles.emptyText}
|
|
224
208
|
// isEmpty={!hasDate}
|
|
225
|
-
|
|
226
209
|
}, hasDate ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
227
210
|
className: classNames__default["default"]([styles.dateContainer, (_ref7 = {}, _defineProperty__default["default"](_ref7, className, className !== null), _defineProperty__default["default"](_ref7, styles.rightBorder, hasTitle), _ref7)])
|
|
228
211
|
}, /*#__PURE__*/React__default["default"].createElement(Text__default["default"], Object.assign({
|
|
229
212
|
className: classNames__default["default"]([styles.date, (_ref8 = {}, _defineProperty__default["default"](_ref8, className, className !== null), _defineProperty__default["default"](_ref8, styles.centerDate, !hasTitle), _ref8)])
|
|
230
213
|
}, date))) : null), /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
231
214
|
key: "title",
|
|
232
|
-
placeholder: "title"
|
|
215
|
+
placeholder: "title"
|
|
216
|
+
// emptyLabel={
|
|
233
217
|
// <FormattedMessage
|
|
234
218
|
// defaultMessage="Title"
|
|
235
219
|
// description="Title placeholder"
|
|
@@ -237,7 +221,6 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
237
221
|
// }
|
|
238
222
|
// emptyClassName={styles.emptyTitle}
|
|
239
223
|
// isEmpty={!hasTitle}
|
|
240
|
-
|
|
241
224
|
}, hasTitle ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
242
225
|
className: classNames__default["default"]([styles.titleContainer, _defineProperty__default["default"]({}, styles.leftBorder, hasDate)])
|
|
243
226
|
}, /*#__PURE__*/React__default["default"].createElement(Heading__default["default"], Object.assign({
|
|
@@ -329,7 +312,6 @@ var UrbaniaRecommendation = function UrbaniaRecommendation(_ref) {
|
|
|
329
312
|
className: styles.background
|
|
330
313
|
}) : null);
|
|
331
314
|
};
|
|
332
|
-
|
|
333
315
|
UrbaniaRecommendation.propTypes = propTypes;
|
|
334
316
|
UrbaniaRecommendation.defaultProps = defaultProps;
|
|
335
317
|
var UrbaniaRecommendation$1 = /*#__PURE__*/React__default["default"].memo(UrbaniaRecommendation);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-urbania-recommendation",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.322",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -49,23 +49,23 @@
|
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@babel/runtime": "^7.13.10",
|
|
52
|
-
"@micromag/core": "^0.3.
|
|
53
|
-
"@micromag/element-background": "^0.3.
|
|
54
|
-
"@micromag/element-call-to-action": "^0.3.
|
|
55
|
-
"@micromag/element-container": "^0.3.
|
|
56
|
-
"@micromag/element-heading": "^0.3.
|
|
57
|
-
"@micromag/element-layout": "^0.3.
|
|
58
|
-
"@micromag/element-scroll": "^0.3.
|
|
59
|
-
"@micromag/element-text": "^0.3.
|
|
60
|
-
"@micromag/transforms": "^0.3.
|
|
52
|
+
"@micromag/core": "^0.3.322",
|
|
53
|
+
"@micromag/element-background": "^0.3.322",
|
|
54
|
+
"@micromag/element-call-to-action": "^0.3.322",
|
|
55
|
+
"@micromag/element-container": "^0.3.322",
|
|
56
|
+
"@micromag/element-heading": "^0.3.322",
|
|
57
|
+
"@micromag/element-layout": "^0.3.322",
|
|
58
|
+
"@micromag/element-scroll": "^0.3.322",
|
|
59
|
+
"@micromag/element-text": "^0.3.322",
|
|
60
|
+
"@micromag/transforms": "^0.3.322",
|
|
61
61
|
"classnames": "^2.2.6",
|
|
62
62
|
"lodash": "^4.17.21",
|
|
63
63
|
"prop-types": "^15.7.2",
|
|
64
64
|
"react-intl": "^5.12.1",
|
|
65
|
-
"uuid": "^
|
|
65
|
+
"uuid": "^9.0.0"
|
|
66
66
|
},
|
|
67
67
|
"publishConfig": {
|
|
68
68
|
"access": "public"
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "2dfe09ad5a9ac720e4bfbffcb6371fc31c24fa9f"
|
|
71
71
|
}
|