@micromag/screen-gallery-feed 0.3.310 → 0.3.318

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 (4) hide show
  1. package/assets/css/styles.css +1 -1
  2. package/es/index.js +48 -75
  3. package/lib/index.js +49 -75
  4. package/package.json +13 -13
package/assets/css/styles.css CHANGED
@@ -1 +1 @@
1
- .micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-background{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyCaption,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyImage{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-gallery-feed-container{position:relative}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-background{z-index:0}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-content{z-index:1}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyCaption,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyImage{width:100%;margin:10px auto}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyImage{height:200px}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyCaption{height:50px}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-image,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-imageContainer,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-video{position:relative!important}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-imageContainer{overflow:hidden}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-callToAction{-webkit-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;transition:opacity .2s ease-out}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-callToAction a{padding:0}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-callToAction.micromag-screen-gallery-feed-disabled{opacity:0;pointer-events:none}.micromag-screen-gallery-feed-container.micromag-screen-gallery-feed-isPlaceholder .micromag-screen-gallery-feed-layout{padding:10px}
1
+ .micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-background{height:100%;left:0;position:absolute;top:0;width:100%}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyCaption,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyImage{border:2px dashed #343434;color:#343434;margin:5px auto}.micromag-screen-gallery-feed-container{position:relative}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-background{z-index:0}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-content{z-index:1}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyCaption,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyImage{margin:10px auto;width:100%}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyImage{height:200px}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyCaption{height:50px}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-image,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-imageContainer,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-video{position:relative!important}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-imageContainer{overflow:hidden}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-callToAction{-webkit-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;transition:opacity .2s ease-out}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-callToAction a{padding:0}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-callToAction.micromag-screen-gallery-feed-disabled{opacity:0;pointer-events:none}.micromag-screen-gallery-feed-container.micromag-screen-gallery-feed-isPlaceholder .micromag-screen-gallery-feed-layout{padding:10px}
package/es/index.js CHANGED
@@ -17,11 +17,12 @@ import Layout from '@micromag/element-layout';
17
17
  import Scroll from '@micromag/element-scroll';
18
18
  import Text from '@micromag/element-text';
19
19
  import Visual from '@micromag/element-visual';
20
+ import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
20
21
  import _extends from '@babel/runtime/helpers/extends';
21
22
  import _objectSpread from '@babel/runtime/helpers/objectSpread2';
22
23
  import { Gallery, Container as Container$1 } from '@micromag/transforms/apple-news';
23
24
 
24
- var styles = {"container":"micromag-screen-gallery-feed-container","background":"micromag-screen-gallery-feed-background","emptyCaption":"micromag-screen-gallery-feed-emptyCaption","emptyImage":"micromag-screen-gallery-feed-emptyImage","content":"micromag-screen-gallery-feed-content","image":"micromag-screen-gallery-feed-image","imageContainer":"micromag-screen-gallery-feed-imageContainer","video":"micromag-screen-gallery-feed-video","callToAction":"micromag-screen-gallery-feed-callToAction","disabled":"micromag-screen-gallery-feed-disabled","isPlaceholder":"micromag-screen-gallery-feed-isPlaceholder","layout":"micromag-screen-gallery-feed-layout"};
25
+ var styles = {"container":"micromag-screen-gallery-feed-container","background":"micromag-screen-gallery-feed-background","emptyImage":"micromag-screen-gallery-feed-emptyImage","emptyCaption":"micromag-screen-gallery-feed-emptyCaption","content":"micromag-screen-gallery-feed-content","image":"micromag-screen-gallery-feed-image","imageContainer":"micromag-screen-gallery-feed-imageContainer","video":"micromag-screen-gallery-feed-video","callToAction":"micromag-screen-gallery-feed-callToAction","disabled":"micromag-screen-gallery-feed-disabled","isPlaceholder":"micromag-screen-gallery-feed-isPlaceholder","layout":"micromag-screen-gallery-feed-layout"};
25
26
 
26
27
  var propTypes = {
27
28
  layout: PropTypes.oneOf(['normal', 'reverse']),
@@ -51,60 +52,49 @@ var defaultProps = {
51
52
  type: null,
52
53
  className: null
53
54
  };
54
-
55
55
  var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
56
56
  var _ref5;
57
-
58
57
  var layout = _ref.layout,
59
- images = _ref.images,
60
- withCaptions = _ref.withCaptions,
61
- spacing = _ref.spacing,
62
- background = _ref.background,
63
- callToAction = _ref.callToAction,
64
- current = _ref.current,
65
- active = _ref.active,
66
- transitions = _ref.transitions,
67
- transitionStagger = _ref.transitionStagger,
68
- type = _ref.type,
69
- className = _ref.className;
58
+ images = _ref.images,
59
+ withCaptions = _ref.withCaptions,
60
+ spacing = _ref.spacing,
61
+ background = _ref.background,
62
+ callToAction = _ref.callToAction,
63
+ current = _ref.current,
64
+ active = _ref.active,
65
+ transitions = _ref.transitions,
66
+ transitionStagger = _ref.transitionStagger,
67
+ type = _ref.type,
68
+ className = _ref.className;
70
69
  var trackScreenEvent = useTrackScreenEvent(type);
71
-
72
70
  var _useScreenSize = useScreenSize(),
73
- width = _useScreenSize.width,
74
- height = _useScreenSize.height,
75
- resolution = _useScreenSize.resolution;
76
-
71
+ width = _useScreenSize.width,
72
+ height = _useScreenSize.height,
73
+ resolution = _useScreenSize.resolution;
77
74
  var _useViewerContext = useViewerContext(),
78
- viewerTopHeight = _useViewerContext.topHeight,
79
- viewerBottomHeight = _useViewerContext.bottomHeight,
80
- viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
81
-
75
+ viewerTopHeight = _useViewerContext.topHeight,
76
+ viewerBottomHeight = _useViewerContext.bottomHeight,
77
+ viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
82
78
  var _useViewerWebView = useViewerWebView(),
83
- openWebView = _useViewerWebView.open;
84
-
79
+ openWebView = _useViewerWebView.open;
85
80
  var _usePlaybackContext = usePlaybackContext(),
86
- muted = _usePlaybackContext.muted;
87
-
81
+ muted = _usePlaybackContext.muted;
88
82
  var mediaRef = usePlaybackMediaRef(current);
89
-
90
83
  var _useScreenRenderConte = useScreenRenderContext(),
91
- isView = _useScreenRenderConte.isView,
92
- isPreview = _useScreenRenderConte.isPreview,
93
- isPlaceholder = _useScreenRenderConte.isPlaceholder,
94
- isEdit = _useScreenRenderConte.isEdit,
95
- isStatic = _useScreenRenderConte.isStatic,
96
- isCapture = _useScreenRenderConte.isCapture;
97
-
84
+ isView = _useScreenRenderConte.isView,
85
+ isPreview = _useScreenRenderConte.isPreview,
86
+ isPlaceholder = _useScreenRenderConte.isPlaceholder,
87
+ isEdit = _useScreenRenderConte.isEdit,
88
+ isStatic = _useScreenRenderConte.isStatic,
89
+ isCapture = _useScreenRenderConte.isCapture;
98
90
  var backgroundPlaying = current && (isView || isEdit);
99
91
  var mediaShouldLoad = current || active;
100
92
  var hasImages = images !== null;
101
93
  var imagesCount = hasImages ? images.length : 0;
102
-
103
94
  var _useState = useState(0),
104
- _useState2 = _slicedToArray(_useState, 2),
105
- imagesLoaded = _useState2[0],
106
- setImagesLoaded = _useState2[1];
107
-
95
+ _useState2 = _slicedToArray(_useState, 2),
96
+ imagesLoaded = _useState2[0],
97
+ setImagesLoaded = _useState2[1];
108
98
  var ready = imagesLoaded >= imagesCount;
109
99
  var transitionPlaying = current && ready;
110
100
  var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
@@ -116,20 +106,16 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
116
106
  var items = [];
117
107
  var editImages = isEdit && imagesCount === 0 ? [null] : images;
118
108
  var finalImages = isPlaceholder ? _toConsumableArray(Array(5)) : editImages;
119
-
120
109
  var _useDimensionObserver = useDimensionObserver(),
121
- firstImageRef = _useDimensionObserver.ref,
122
- firstImageRefWidth = _useDimensionObserver.width;
123
-
110
+ firstImageRef = _useDimensionObserver.ref,
111
+ firstImageRefWidth = _useDimensionObserver.width;
124
112
  (finalImages || []).forEach(function (image, index) {
125
113
  var finalImage = withCaptions ? image : {
126
114
  media: image
127
115
  };
128
-
129
116
  var _ref2 = finalImage || {},
130
- _ref2$caption = _ref2.caption,
131
- caption = _ref2$caption === void 0 ? null : _ref2$caption;
132
-
117
+ _ref2$caption = _ref2.caption,
118
+ caption = _ref2$caption === void 0 ? null : _ref2$caption;
133
119
  var hasImage = isImageFilled(finalImage);
134
120
  var hasCaption = isTextFilled(caption);
135
121
  var imageElement = /*#__PURE__*/React.createElement(ScreenElement, {
@@ -159,7 +145,6 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
159
145
  onLoaded: onImageLoaded
160
146
  }))));
161
147
  var captionElement = null;
162
-
163
148
  if (withCaptions) {
164
149
  var marginTop = !isReversed || index > 0 ? spacing / 2 : 0;
165
150
  var marginBottom = isReversed || index < (finalImages || []).length - 1 ? spacing / 2 : 0;
@@ -188,21 +173,17 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
188
173
  className: styles.captionText
189
174
  }))));
190
175
  }
191
-
192
176
  if (isReversed) {
193
177
  if (withCaptions) {
194
178
  items.push(captionElement);
195
179
  }
196
-
197
180
  items.push(imageElement);
198
181
  } else {
199
182
  items.push(imageElement);
200
-
201
183
  if (withCaptions) {
202
184
  items.push(captionElement);
203
185
  }
204
186
  }
205
-
206
187
  if (!isPlaceholder && index < (finalImages || []).length - 1) {
207
188
  items.push( /*#__PURE__*/React.createElement("div", {
208
189
  key: "spacing-".concat(index),
@@ -211,24 +192,21 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
211
192
  }
212
193
  }));
213
194
  }
214
- }); // Call to Action
195
+ });
215
196
 
197
+ // Call to Action
216
198
  var _ref3 = callToAction || {},
217
- _ref3$active = _ref3.active,
218
- hasCallToAction = _ref3$active === void 0 ? false : _ref3$active;
219
-
199
+ _ref3$active = _ref3.active,
200
+ hasCallToAction = _ref3$active === void 0 ? false : _ref3$active;
220
201
  var _useState3 = useState(false),
221
- _useState4 = _slicedToArray(_useState3, 2),
222
- scrolledBottom = _useState4[0],
223
- setScrolledBottom = _useState4[1];
224
-
202
+ _useState4 = _slicedToArray(_useState3, 2),
203
+ scrolledBottom = _useState4[0],
204
+ setScrolledBottom = _useState4[1];
225
205
  var onScrolledBottom = useCallback(function (_ref4) {
226
206
  var initial = _ref4.initial;
227
-
228
207
  if (initial) {
229
208
  trackScreenEvent('scroll', 'Screen');
230
209
  }
231
-
232
210
  setScrolledBottom(true);
233
211
  }, [trackScreenEvent]);
234
212
  var onScrolledNotBottom = useCallback(function () {
@@ -282,14 +260,12 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
282
260
  className: styles.background
283
261
  }) : null);
284
262
  };
285
-
286
263
  GalleryFeedScreen.propTypes = propTypes;
287
264
  GalleryFeedScreen.defaultProps = defaultProps;
288
265
  var GalleryFeedScreen$1 = /*#__PURE__*/React.memo(GalleryFeedScreen);
289
266
 
290
267
  var GalleryFeedCaptionsScreen = function GalleryFeedCaptionsScreen(_ref) {
291
- var props = _extends({}, _ref);
292
-
268
+ var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
293
269
  return /*#__PURE__*/React.createElement(GalleryFeedScreen$1, Object.assign({}, props, {
294
270
  withCaptions: true
295
271
  }));
@@ -297,17 +273,14 @@ var GalleryFeedCaptionsScreen = function GalleryFeedCaptionsScreen(_ref) {
297
273
 
298
274
  var transform = function transform(newStory, _ref) {
299
275
  var images = _ref.images;
300
-
301
276
  var _Gallery = Gallery(newStory, {
302
- images: images
303
- }),
304
- titleStory = _Gallery.story,
305
- titleComponent = _Gallery.component;
306
-
277
+ images: images
278
+ }),
279
+ titleStory = _Gallery.story,
280
+ titleComponent = _Gallery.component;
307
281
  var _Container = Container$1(titleStory, _toConsumableArray(titleComponent ? [titleComponent] : [])),
308
- containerStory = _Container.story,
309
- containerComponent = _Container.component;
310
-
282
+ containerStory = _Container.story,
283
+ containerComponent = _Container.component;
311
284
  return _objectSpread(_objectSpread({}, containerStory), {}, {
312
285
  components: [].concat(_toConsumableArray(newStory.components || []), _toConsumableArray(containerComponent ? [containerComponent] : []))
313
286
  });
package/lib/index.js CHANGED
@@ -21,6 +21,7 @@ var Layout = require('@micromag/element-layout');
21
21
  var Scroll = require('@micromag/element-scroll');
22
22
  var Text = require('@micromag/element-text');
23
23
  var Visual = require('@micromag/element-visual');
24
+ var _objectDestructuringEmpty = require('@babel/runtime/helpers/objectDestructuringEmpty');
24
25
  var _extends = require('@babel/runtime/helpers/extends');
25
26
  var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
26
27
  var appleNews = require('@micromag/transforms/apple-news');
@@ -40,10 +41,11 @@ var Layout__default = /*#__PURE__*/_interopDefaultLegacy(Layout);
40
41
  var Scroll__default = /*#__PURE__*/_interopDefaultLegacy(Scroll);
41
42
  var Text__default = /*#__PURE__*/_interopDefaultLegacy(Text);
42
43
  var Visual__default = /*#__PURE__*/_interopDefaultLegacy(Visual);
44
+ var _objectDestructuringEmpty__default = /*#__PURE__*/_interopDefaultLegacy(_objectDestructuringEmpty);
43
45
  var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
44
46
  var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
45
47
 
46
- var styles = {"container":"micromag-screen-gallery-feed-container","background":"micromag-screen-gallery-feed-background","emptyCaption":"micromag-screen-gallery-feed-emptyCaption","emptyImage":"micromag-screen-gallery-feed-emptyImage","content":"micromag-screen-gallery-feed-content","image":"micromag-screen-gallery-feed-image","imageContainer":"micromag-screen-gallery-feed-imageContainer","video":"micromag-screen-gallery-feed-video","callToAction":"micromag-screen-gallery-feed-callToAction","disabled":"micromag-screen-gallery-feed-disabled","isPlaceholder":"micromag-screen-gallery-feed-isPlaceholder","layout":"micromag-screen-gallery-feed-layout"};
48
+ var styles = {"container":"micromag-screen-gallery-feed-container","background":"micromag-screen-gallery-feed-background","emptyImage":"micromag-screen-gallery-feed-emptyImage","emptyCaption":"micromag-screen-gallery-feed-emptyCaption","content":"micromag-screen-gallery-feed-content","image":"micromag-screen-gallery-feed-image","imageContainer":"micromag-screen-gallery-feed-imageContainer","video":"micromag-screen-gallery-feed-video","callToAction":"micromag-screen-gallery-feed-callToAction","disabled":"micromag-screen-gallery-feed-disabled","isPlaceholder":"micromag-screen-gallery-feed-isPlaceholder","layout":"micromag-screen-gallery-feed-layout"};
47
49
 
48
50
  var propTypes = {
49
51
  layout: PropTypes__default["default"].oneOf(['normal', 'reverse']),
@@ -73,60 +75,49 @@ var defaultProps = {
73
75
  type: null,
74
76
  className: null
75
77
  };
76
-
77
78
  var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
78
79
  var _ref5;
79
-
80
80
  var layout = _ref.layout,
81
- images = _ref.images,
82
- withCaptions = _ref.withCaptions,
83
- spacing = _ref.spacing,
84
- background = _ref.background,
85
- callToAction = _ref.callToAction,
86
- current = _ref.current,
87
- active = _ref.active,
88
- transitions = _ref.transitions,
89
- transitionStagger = _ref.transitionStagger,
90
- type = _ref.type,
91
- className = _ref.className;
81
+ images = _ref.images,
82
+ withCaptions = _ref.withCaptions,
83
+ spacing = _ref.spacing,
84
+ background = _ref.background,
85
+ callToAction = _ref.callToAction,
86
+ current = _ref.current,
87
+ active = _ref.active,
88
+ transitions = _ref.transitions,
89
+ transitionStagger = _ref.transitionStagger,
90
+ type = _ref.type,
91
+ className = _ref.className;
92
92
  var trackScreenEvent = hooks.useTrackScreenEvent(type);
93
-
94
93
  var _useScreenSize = contexts.useScreenSize(),
95
- width = _useScreenSize.width,
96
- height = _useScreenSize.height,
97
- resolution = _useScreenSize.resolution;
98
-
94
+ width = _useScreenSize.width,
95
+ height = _useScreenSize.height,
96
+ resolution = _useScreenSize.resolution;
99
97
  var _useViewerContext = contexts.useViewerContext(),
100
- viewerTopHeight = _useViewerContext.topHeight,
101
- viewerBottomHeight = _useViewerContext.bottomHeight,
102
- viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
103
-
98
+ viewerTopHeight = _useViewerContext.topHeight,
99
+ viewerBottomHeight = _useViewerContext.bottomHeight,
100
+ viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
104
101
  var _useViewerWebView = contexts.useViewerWebView(),
105
- openWebView = _useViewerWebView.open;
106
-
102
+ openWebView = _useViewerWebView.open;
107
103
  var _usePlaybackContext = contexts.usePlaybackContext(),
108
- muted = _usePlaybackContext.muted;
109
-
104
+ muted = _usePlaybackContext.muted;
110
105
  var mediaRef = contexts.usePlaybackMediaRef(current);
111
-
112
106
  var _useScreenRenderConte = contexts.useScreenRenderContext(),
113
- isView = _useScreenRenderConte.isView,
114
- isPreview = _useScreenRenderConte.isPreview,
115
- isPlaceholder = _useScreenRenderConte.isPlaceholder,
116
- isEdit = _useScreenRenderConte.isEdit,
117
- isStatic = _useScreenRenderConte.isStatic,
118
- isCapture = _useScreenRenderConte.isCapture;
119
-
107
+ isView = _useScreenRenderConte.isView,
108
+ isPreview = _useScreenRenderConte.isPreview,
109
+ isPlaceholder = _useScreenRenderConte.isPlaceholder,
110
+ isEdit = _useScreenRenderConte.isEdit,
111
+ isStatic = _useScreenRenderConte.isStatic,
112
+ isCapture = _useScreenRenderConte.isCapture;
120
113
  var backgroundPlaying = current && (isView || isEdit);
121
114
  var mediaShouldLoad = current || active;
122
115
  var hasImages = images !== null;
123
116
  var imagesCount = hasImages ? images.length : 0;
124
-
125
117
  var _useState = React.useState(0),
126
- _useState2 = _slicedToArray__default["default"](_useState, 2),
127
- imagesLoaded = _useState2[0],
128
- setImagesLoaded = _useState2[1];
129
-
118
+ _useState2 = _slicedToArray__default["default"](_useState, 2),
119
+ imagesLoaded = _useState2[0],
120
+ setImagesLoaded = _useState2[1];
130
121
  var ready = imagesLoaded >= imagesCount;
131
122
  var transitionPlaying = current && ready;
132
123
  var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
@@ -138,20 +129,16 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
138
129
  var items = [];
139
130
  var editImages = isEdit && imagesCount === 0 ? [null] : images;
140
131
  var finalImages = isPlaceholder ? _toConsumableArray__default["default"](Array(5)) : editImages;
141
-
142
132
  var _useDimensionObserver = hooks.useDimensionObserver(),
143
- firstImageRef = _useDimensionObserver.ref,
144
- firstImageRefWidth = _useDimensionObserver.width;
145
-
133
+ firstImageRef = _useDimensionObserver.ref,
134
+ firstImageRefWidth = _useDimensionObserver.width;
146
135
  (finalImages || []).forEach(function (image, index) {
147
136
  var finalImage = withCaptions ? image : {
148
137
  media: image
149
138
  };
150
-
151
139
  var _ref2 = finalImage || {},
152
- _ref2$caption = _ref2.caption,
153
- caption = _ref2$caption === void 0 ? null : _ref2$caption;
154
-
140
+ _ref2$caption = _ref2.caption,
141
+ caption = _ref2$caption === void 0 ? null : _ref2$caption;
155
142
  var hasImage = utils.isImageFilled(finalImage);
156
143
  var hasCaption = utils.isTextFilled(caption);
157
144
  var imageElement = /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
@@ -181,7 +168,6 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
181
168
  onLoaded: onImageLoaded
182
169
  }))));
183
170
  var captionElement = null;
184
-
185
171
  if (withCaptions) {
186
172
  var marginTop = !isReversed || index > 0 ? spacing / 2 : 0;
187
173
  var marginBottom = isReversed || index < (finalImages || []).length - 1 ? spacing / 2 : 0;
@@ -210,21 +196,17 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
210
196
  className: styles.captionText
211
197
  }))));
212
198
  }
213
-
214
199
  if (isReversed) {
215
200
  if (withCaptions) {
216
201
  items.push(captionElement);
217
202
  }
218
-
219
203
  items.push(imageElement);
220
204
  } else {
221
205
  items.push(imageElement);
222
-
223
206
  if (withCaptions) {
224
207
  items.push(captionElement);
225
208
  }
226
209
  }
227
-
228
210
  if (!isPlaceholder && index < (finalImages || []).length - 1) {
229
211
  items.push( /*#__PURE__*/React__default["default"].createElement("div", {
230
212
  key: "spacing-".concat(index),
@@ -233,24 +215,21 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
233
215
  }
234
216
  }));
235
217
  }
236
- }); // Call to Action
218
+ });
237
219
 
220
+ // Call to Action
238
221
  var _ref3 = callToAction || {},
239
- _ref3$active = _ref3.active,
240
- hasCallToAction = _ref3$active === void 0 ? false : _ref3$active;
241
-
222
+ _ref3$active = _ref3.active,
223
+ hasCallToAction = _ref3$active === void 0 ? false : _ref3$active;
242
224
  var _useState3 = React.useState(false),
243
- _useState4 = _slicedToArray__default["default"](_useState3, 2),
244
- scrolledBottom = _useState4[0],
245
- setScrolledBottom = _useState4[1];
246
-
225
+ _useState4 = _slicedToArray__default["default"](_useState3, 2),
226
+ scrolledBottom = _useState4[0],
227
+ setScrolledBottom = _useState4[1];
247
228
  var onScrolledBottom = React.useCallback(function (_ref4) {
248
229
  var initial = _ref4.initial;
249
-
250
230
  if (initial) {
251
231
  trackScreenEvent('scroll', 'Screen');
252
232
  }
253
-
254
233
  setScrolledBottom(true);
255
234
  }, [trackScreenEvent]);
256
235
  var onScrolledNotBottom = React.useCallback(function () {
@@ -304,14 +283,12 @@ var GalleryFeedScreen = function GalleryFeedScreen(_ref) {
304
283
  className: styles.background
305
284
  }) : null);
306
285
  };
307
-
308
286
  GalleryFeedScreen.propTypes = propTypes;
309
287
  GalleryFeedScreen.defaultProps = defaultProps;
310
288
  var GalleryFeedScreen$1 = /*#__PURE__*/React__default["default"].memo(GalleryFeedScreen);
311
289
 
312
290
  var GalleryFeedCaptionsScreen = function GalleryFeedCaptionsScreen(_ref) {
313
- var props = _extends__default["default"]({}, _ref);
314
-
291
+ var props = _extends__default["default"]({}, (_objectDestructuringEmpty__default["default"](_ref), _ref));
315
292
  return /*#__PURE__*/React__default["default"].createElement(GalleryFeedScreen$1, Object.assign({}, props, {
316
293
  withCaptions: true
317
294
  }));
@@ -319,17 +296,14 @@ var GalleryFeedCaptionsScreen = function GalleryFeedCaptionsScreen(_ref) {
319
296
 
320
297
  var transform = function transform(newStory, _ref) {
321
298
  var images = _ref.images;
322
-
323
299
  var _Gallery = appleNews.Gallery(newStory, {
324
- images: images
325
- }),
326
- titleStory = _Gallery.story,
327
- titleComponent = _Gallery.component;
328
-
300
+ images: images
301
+ }),
302
+ titleStory = _Gallery.story,
303
+ titleComponent = _Gallery.component;
329
304
  var _Container = appleNews.Container(titleStory, _toConsumableArray__default["default"](titleComponent ? [titleComponent] : [])),
330
- containerStory = _Container.story,
331
- containerComponent = _Container.component;
332
-
305
+ containerStory = _Container.story,
306
+ containerComponent = _Container.component;
333
307
  return _objectSpread__default["default"](_objectSpread__default["default"]({}, containerStory), {}, {
334
308
  components: [].concat(_toConsumableArray__default["default"](newStory.components || []), _toConsumableArray__default["default"](containerComponent ? [containerComponent] : []))
335
309
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-gallery-feed",
3
- "version": "0.3.310",
3
+ "version": "0.3.318",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -49,24 +49,24 @@
49
49
  },
50
50
  "dependencies": {
51
51
  "@babel/runtime": "^7.13.10",
52
- "@micromag/core": "^0.3.307",
53
- "@micromag/element-background": "^0.3.307",
54
- "@micromag/element-call-to-action": "^0.3.310",
55
- "@micromag/element-container": "^0.3.307",
56
- "@micromag/element-layout": "^0.3.307",
57
- "@micromag/element-scroll": "^0.3.307",
58
- "@micromag/element-stack": "^0.3.307",
59
- "@micromag/element-text": "^0.3.307",
60
- "@micromag/element-visual": "^0.3.307",
61
- "@micromag/transforms": "^0.3.307",
52
+ "@micromag/core": "^0.3.318",
53
+ "@micromag/element-background": "^0.3.318",
54
+ "@micromag/element-call-to-action": "^0.3.318",
55
+ "@micromag/element-container": "^0.3.318",
56
+ "@micromag/element-layout": "^0.3.318",
57
+ "@micromag/element-scroll": "^0.3.318",
58
+ "@micromag/element-stack": "^0.3.318",
59
+ "@micromag/element-text": "^0.3.318",
60
+ "@micromag/element-visual": "^0.3.318",
61
+ "@micromag/transforms": "^0.3.318",
62
62
  "classnames": "^2.2.6",
63
63
  "lodash": "^4.17.21",
64
64
  "prop-types": "^15.7.2",
65
65
  "react-intl": "^5.12.1",
66
- "uuid": "^8.3.2"
66
+ "uuid": "^9.0.0"
67
67
  },
68
68
  "publishConfig": {
69
69
  "access": "public"
70
70
  },
71
- "gitHead": "c2f4fbfcf0f643737a77f99dccf4d353f7856c2c"
71
+ "gitHead": "7d1a296e0c0d410e1225279e1f19e3a7715bfa96"
72
72
  }