@micromag/screen-gallery 0.3.430 → 0.3.433

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 +7 -29
  2. package/lib/index.js +6 -28
  3. package/package.json +12 -12
package/es/index.js CHANGED
@@ -7,7 +7,7 @@ import isPlainObject from 'lodash/isPlainObject';
7
7
  import PropTypes from 'prop-types';
8
8
  import React, { useState, useCallback, useRef, useEffect } from 'react';
9
9
  import { PropTypes as PropTypes$1 } from '@micromag/core';
10
- import { Transitions, ScreenElement } from '@micromag/core/components';
10
+ import { ScreenElement } from '@micromag/core/components';
11
11
  import { useScreenSize, useViewerContext, useViewerWebView, usePlaybackContext, usePlaybackMediaRef, useScreenRenderContext } from '@micromag/core/contexts';
12
12
  import { useDimensionObserver } from '@micromag/core/hooks';
13
13
  import { isHeaderFilled, isFooterFilled, getFooterProps, isImageFilled, isTextFilled } from '@micromag/core/utils';
@@ -216,8 +216,6 @@ var propTypes = {
216
216
  footer: PropTypes$1.footer,
217
217
  current: PropTypes.bool,
218
218
  active: PropTypes.bool,
219
- transitions: PropTypes$1.transitions,
220
- transitionStagger: PropTypes.number,
221
219
  className: PropTypes.string
222
220
  };
223
221
  var defaultProps = {
@@ -231,8 +229,6 @@ var defaultProps = {
231
229
  footer: null,
232
230
  current: true,
233
231
  active: true,
234
- transitions: null,
235
- transitionStagger: 50,
236
232
  className: null
237
233
  };
238
234
  var GalleryScreen = function GalleryScreen(_ref) {
@@ -246,8 +242,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
246
242
  active = _ref.active,
247
243
  spacing = _ref.spacing,
248
244
  captionMaxLines = _ref.captionMaxLines,
249
- transitions = _ref.transitions,
250
- transitionStagger = _ref.transitionStagger,
251
245
  className = _ref.className;
252
246
  var _useScreenSize = useScreenSize(),
253
247
  width = _useScreenSize.width,
@@ -266,9 +260,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
266
260
  isView = _useScreenRenderConte.isView,
267
261
  isPreview = _useScreenRenderConte.isPreview,
268
262
  isPlaceholder = _useScreenRenderConte.isPlaceholder,
269
- isEdit = _useScreenRenderConte.isEdit,
270
- isStatic = _useScreenRenderConte.isStatic,
271
- isCapture = _useScreenRenderConte.isCapture;
263
+ isEdit = _useScreenRenderConte.isEdit;
272
264
  var backgroundPlaying = current && (isView || isEdit);
273
265
  var mediaShouldLoad = current || active;
274
266
  var finalSpacing = isPlaceholder ? 5 : spacing;
@@ -288,8 +280,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
288
280
  setImagesLoaded = _useState2[1];
289
281
  var imagesCount = images !== null ? Math.min(gridSpaces, images.length) : 0;
290
282
  var ready = imagesLoaded >= imagesCount;
291
- var transitionPlaying = current && ready;
292
- var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
293
283
  var onImageLoaded = useCallback(function () {
294
284
  setImagesLoaded(function (count) {
295
285
  return count + 1;
@@ -355,12 +345,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
355
345
  ref: function ref(el) {
356
346
  imagesEl.current[itemI] = el;
357
347
  }
358
- }, /*#__PURE__*/React.createElement(Transitions, {
359
- transitions: transitions,
360
- delay: itemI * transitionStagger,
361
- playing: transitionPlaying,
362
- disabled: transitionDisabled,
363
- fullscreen: true
364
348
  }, /*#__PURE__*/React.createElement(ScreenElement, {
365
349
  placeholder: "image",
366
350
  placeholderProps: {
@@ -388,12 +372,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
388
372
  shouldLoad: mediaShouldLoad,
389
373
  withoutVideo: isPreview,
390
374
  onLoaded: onImageLoaded
391
- })) : null))), withCaptions ? /*#__PURE__*/React.createElement(Transitions, {
392
- transitions: transitions,
393
- delay: itemI * transitionStagger,
394
- playing: transitionPlaying,
395
- disabled: transitionDisabled
396
- }, /*#__PURE__*/React.createElement(ScreenElement, {
375
+ })) : null)), withCaptions ? /*#__PURE__*/React.createElement(ScreenElement, {
397
376
  placeholder: "line",
398
377
  emptyLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
399
378
  id: "6tIigB",
@@ -409,7 +388,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
409
388
  }, /*#__PURE__*/React.createElement(Text, Object.assign({}, caption, {
410
389
  className: styles.captionText,
411
390
  lineClamp: captionMaxLines
412
- }))))) : null);
391
+ })))) : null);
413
392
  });
414
393
  return /*#__PURE__*/React.createElement("div", {
415
394
  className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.isPlaceholder, isPlaceholder)]),
@@ -463,11 +442,10 @@ var GalleryScreen = function GalleryScreen(_ref) {
463
442
  };
464
443
  GalleryScreen.propTypes = propTypes;
465
444
  GalleryScreen.defaultProps = defaultProps;
466
- var GalleryScreen$1 = /*#__PURE__*/React.memo(GalleryScreen);
467
445
 
468
446
  function GalleryCaptionsScreen(_ref) {
469
447
  var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
470
- return /*#__PURE__*/React.createElement(GalleryScreen$1, Object.assign({}, props, {
448
+ return /*#__PURE__*/React.createElement(GalleryScreen, Object.assign({}, props, {
471
449
  withCaptions: true
472
450
  }));
473
451
  }
@@ -514,7 +492,7 @@ var definition = [{
514
492
  "value": "Gallery"
515
493
  }]
516
494
  }),
517
- component: GalleryScreen$1,
495
+ component: GalleryScreen,
518
496
  layouts: [
519
497
  // 2
520
498
  'two-vertical-equal', 'two-vertical-top', 'two-vertical-bottom',
@@ -703,4 +681,4 @@ var definition = [{
703
681
  }]
704
682
  }];
705
683
 
706
- export { GalleryCaptionsScreen, GalleryScreen$1 as GalleryScreen, definition as default };
684
+ export { GalleryCaptionsScreen, GalleryScreen, definition as default };
package/lib/index.js CHANGED
@@ -220,8 +220,6 @@ var propTypes = {
220
220
  footer: core.PropTypes.footer,
221
221
  current: PropTypes.bool,
222
222
  active: PropTypes.bool,
223
- transitions: core.PropTypes.transitions,
224
- transitionStagger: PropTypes.number,
225
223
  className: PropTypes.string
226
224
  };
227
225
  var defaultProps = {
@@ -235,8 +233,6 @@ var defaultProps = {
235
233
  footer: null,
236
234
  current: true,
237
235
  active: true,
238
- transitions: null,
239
- transitionStagger: 50,
240
236
  className: null
241
237
  };
242
238
  var GalleryScreen = function GalleryScreen(_ref) {
@@ -250,8 +246,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
250
246
  active = _ref.active,
251
247
  spacing = _ref.spacing,
252
248
  captionMaxLines = _ref.captionMaxLines,
253
- transitions = _ref.transitions,
254
- transitionStagger = _ref.transitionStagger,
255
249
  className = _ref.className;
256
250
  var _useScreenSize = contexts.useScreenSize(),
257
251
  width = _useScreenSize.width,
@@ -270,9 +264,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
270
264
  isView = _useScreenRenderConte.isView,
271
265
  isPreview = _useScreenRenderConte.isPreview,
272
266
  isPlaceholder = _useScreenRenderConte.isPlaceholder,
273
- isEdit = _useScreenRenderConte.isEdit,
274
- isStatic = _useScreenRenderConte.isStatic,
275
- isCapture = _useScreenRenderConte.isCapture;
267
+ isEdit = _useScreenRenderConte.isEdit;
276
268
  var backgroundPlaying = current && (isView || isEdit);
277
269
  var mediaShouldLoad = current || active;
278
270
  var finalSpacing = isPlaceholder ? 5 : spacing;
@@ -292,8 +284,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
292
284
  setImagesLoaded = _useState2[1];
293
285
  var imagesCount = images !== null ? Math.min(gridSpaces, images.length) : 0;
294
286
  var ready = imagesLoaded >= imagesCount;
295
- var transitionPlaying = current && ready;
296
- var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
297
287
  var onImageLoaded = React.useCallback(function () {
298
288
  setImagesLoaded(function (count) {
299
289
  return count + 1;
@@ -359,12 +349,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
359
349
  ref: function ref(el) {
360
350
  imagesEl.current[itemI] = el;
361
351
  }
362
- }, /*#__PURE__*/React.createElement(components.Transitions, {
363
- transitions: transitions,
364
- delay: itemI * transitionStagger,
365
- playing: transitionPlaying,
366
- disabled: transitionDisabled,
367
- fullscreen: true
368
352
  }, /*#__PURE__*/React.createElement(components.ScreenElement, {
369
353
  placeholder: "image",
370
354
  placeholderProps: {
@@ -392,12 +376,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
392
376
  shouldLoad: mediaShouldLoad,
393
377
  withoutVideo: isPreview,
394
378
  onLoaded: onImageLoaded
395
- })) : null))), withCaptions ? /*#__PURE__*/React.createElement(components.Transitions, {
396
- transitions: transitions,
397
- delay: itemI * transitionStagger,
398
- playing: transitionPlaying,
399
- disabled: transitionDisabled
400
- }, /*#__PURE__*/React.createElement(components.ScreenElement, {
379
+ })) : null)), withCaptions ? /*#__PURE__*/React.createElement(components.ScreenElement, {
401
380
  placeholder: "line",
402
381
  emptyLabel: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
403
382
  id: "6tIigB",
@@ -413,7 +392,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
413
392
  }, /*#__PURE__*/React.createElement(Text, Object.assign({}, caption, {
414
393
  className: styles.captionText,
415
394
  lineClamp: captionMaxLines
416
- }))))) : null);
395
+ })))) : null);
417
396
  });
418
397
  return /*#__PURE__*/React.createElement("div", {
419
398
  className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.isPlaceholder, isPlaceholder)]),
@@ -467,11 +446,10 @@ var GalleryScreen = function GalleryScreen(_ref) {
467
446
  };
468
447
  GalleryScreen.propTypes = propTypes;
469
448
  GalleryScreen.defaultProps = defaultProps;
470
- var GalleryScreen$1 = /*#__PURE__*/React.memo(GalleryScreen);
471
449
 
472
450
  function GalleryCaptionsScreen(_ref) {
473
451
  var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
474
- return /*#__PURE__*/React.createElement(GalleryScreen$1, Object.assign({}, props, {
452
+ return /*#__PURE__*/React.createElement(GalleryScreen, Object.assign({}, props, {
475
453
  withCaptions: true
476
454
  }));
477
455
  }
@@ -518,7 +496,7 @@ var definition = [{
518
496
  "value": "Gallery"
519
497
  }]
520
498
  }),
521
- component: GalleryScreen$1,
499
+ component: GalleryScreen,
522
500
  layouts: [
523
501
  // 2
524
502
  'two-vertical-equal', 'two-vertical-top', 'two-vertical-bottom',
@@ -708,5 +686,5 @@ var definition = [{
708
686
  }];
709
687
 
710
688
  exports.GalleryCaptionsScreen = GalleryCaptionsScreen;
711
- exports.GalleryScreen = GalleryScreen$1;
689
+ exports.GalleryScreen = GalleryScreen;
712
690
  exports.default = definition;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-gallery",
3
- "version": "0.3.430",
3
+ "version": "0.3.433",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [
@@ -58,16 +58,16 @@
58
58
  },
59
59
  "dependencies": {
60
60
  "@babel/runtime": "^7.13.10",
61
- "@micromag/core": "^0.3.430",
62
- "@micromag/element-background": "^0.3.430",
63
- "@micromag/element-container": "^0.3.430",
64
- "@micromag/element-footer": "^0.3.430",
65
- "@micromag/element-grid": "^0.3.430",
66
- "@micromag/element-header": "^0.3.430",
67
- "@micromag/element-layout": "^0.3.430",
68
- "@micromag/element-text": "^0.3.430",
69
- "@micromag/element-visual": "^0.3.430",
70
- "@micromag/transforms": "^0.3.430",
61
+ "@micromag/core": "^0.3.433",
62
+ "@micromag/element-background": "^0.3.433",
63
+ "@micromag/element-container": "^0.3.433",
64
+ "@micromag/element-footer": "^0.3.433",
65
+ "@micromag/element-grid": "^0.3.433",
66
+ "@micromag/element-header": "^0.3.433",
67
+ "@micromag/element-layout": "^0.3.433",
68
+ "@micromag/element-text": "^0.3.433",
69
+ "@micromag/element-visual": "^0.3.433",
70
+ "@micromag/transforms": "^0.3.433",
71
71
  "classnames": "^2.2.6",
72
72
  "lodash": "^4.17.21",
73
73
  "prop-types": "^15.7.2",
@@ -78,5 +78,5 @@
78
78
  "access": "public",
79
79
  "registry": "https://registry.npmjs.org/"
80
80
  },
81
- "gitHead": "da790d76dba9d8e308d9f9c4e51d93a4a0e012a9"
81
+ "gitHead": "4fe51ffae9ebd9844db8014a1912df2df5122f28"
82
82
  }