@micromag/screen-gallery 0.3.429 → 0.3.432

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 +9 -29
  2. package/lib/index.js +8 -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,9 @@ 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;
264
+ _useScreenRenderConte.isStatic;
265
+ _useScreenRenderConte.isCapture;
272
266
  var backgroundPlaying = current && (isView || isEdit);
273
267
  var mediaShouldLoad = current || active;
274
268
  var finalSpacing = isPlaceholder ? 5 : spacing;
@@ -288,8 +282,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
288
282
  setImagesLoaded = _useState2[1];
289
283
  var imagesCount = images !== null ? Math.min(gridSpaces, images.length) : 0;
290
284
  var ready = imagesLoaded >= imagesCount;
291
- var transitionPlaying = current && ready;
292
- var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
293
285
  var onImageLoaded = useCallback(function () {
294
286
  setImagesLoaded(function (count) {
295
287
  return count + 1;
@@ -355,12 +347,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
355
347
  ref: function ref(el) {
356
348
  imagesEl.current[itemI] = el;
357
349
  }
358
- }, /*#__PURE__*/React.createElement(Transitions, {
359
- transitions: transitions,
360
- delay: itemI * transitionStagger,
361
- playing: transitionPlaying,
362
- disabled: transitionDisabled,
363
- fullscreen: true
364
350
  }, /*#__PURE__*/React.createElement(ScreenElement, {
365
351
  placeholder: "image",
366
352
  placeholderProps: {
@@ -388,12 +374,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
388
374
  shouldLoad: mediaShouldLoad,
389
375
  withoutVideo: isPreview,
390
376
  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, {
377
+ })) : null)), withCaptions ? /*#__PURE__*/React.createElement(ScreenElement, {
397
378
  placeholder: "line",
398
379
  emptyLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
399
380
  id: "6tIigB",
@@ -409,7 +390,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
409
390
  }, /*#__PURE__*/React.createElement(Text, Object.assign({}, caption, {
410
391
  className: styles.captionText,
411
392
  lineClamp: captionMaxLines
412
- }))))) : null);
393
+ })))) : null);
413
394
  });
414
395
  return /*#__PURE__*/React.createElement("div", {
415
396
  className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.isPlaceholder, isPlaceholder)]),
@@ -463,11 +444,10 @@ var GalleryScreen = function GalleryScreen(_ref) {
463
444
  };
464
445
  GalleryScreen.propTypes = propTypes;
465
446
  GalleryScreen.defaultProps = defaultProps;
466
- var GalleryScreen$1 = /*#__PURE__*/React.memo(GalleryScreen);
467
447
 
468
448
  function GalleryCaptionsScreen(_ref) {
469
449
  var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
470
- return /*#__PURE__*/React.createElement(GalleryScreen$1, Object.assign({}, props, {
450
+ return /*#__PURE__*/React.createElement(GalleryScreen, Object.assign({}, props, {
471
451
  withCaptions: true
472
452
  }));
473
453
  }
@@ -514,7 +494,7 @@ var definition = [{
514
494
  "value": "Gallery"
515
495
  }]
516
496
  }),
517
- component: GalleryScreen$1,
497
+ component: GalleryScreen,
518
498
  layouts: [
519
499
  // 2
520
500
  'two-vertical-equal', 'two-vertical-top', 'two-vertical-bottom',
@@ -703,4 +683,4 @@ var definition = [{
703
683
  }]
704
684
  }];
705
685
 
706
- export { GalleryCaptionsScreen, GalleryScreen$1 as GalleryScreen, definition as default };
686
+ 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,9 @@ 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;
268
+ _useScreenRenderConte.isStatic;
269
+ _useScreenRenderConte.isCapture;
276
270
  var backgroundPlaying = current && (isView || isEdit);
277
271
  var mediaShouldLoad = current || active;
278
272
  var finalSpacing = isPlaceholder ? 5 : spacing;
@@ -292,8 +286,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
292
286
  setImagesLoaded = _useState2[1];
293
287
  var imagesCount = images !== null ? Math.min(gridSpaces, images.length) : 0;
294
288
  var ready = imagesLoaded >= imagesCount;
295
- var transitionPlaying = current && ready;
296
- var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
297
289
  var onImageLoaded = React.useCallback(function () {
298
290
  setImagesLoaded(function (count) {
299
291
  return count + 1;
@@ -359,12 +351,6 @@ var GalleryScreen = function GalleryScreen(_ref) {
359
351
  ref: function ref(el) {
360
352
  imagesEl.current[itemI] = el;
361
353
  }
362
- }, /*#__PURE__*/React.createElement(components.Transitions, {
363
- transitions: transitions,
364
- delay: itemI * transitionStagger,
365
- playing: transitionPlaying,
366
- disabled: transitionDisabled,
367
- fullscreen: true
368
354
  }, /*#__PURE__*/React.createElement(components.ScreenElement, {
369
355
  placeholder: "image",
370
356
  placeholderProps: {
@@ -392,12 +378,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
392
378
  shouldLoad: mediaShouldLoad,
393
379
  withoutVideo: isPreview,
394
380
  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, {
381
+ })) : null)), withCaptions ? /*#__PURE__*/React.createElement(components.ScreenElement, {
401
382
  placeholder: "line",
402
383
  emptyLabel: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
403
384
  id: "6tIigB",
@@ -413,7 +394,7 @@ var GalleryScreen = function GalleryScreen(_ref) {
413
394
  }, /*#__PURE__*/React.createElement(Text, Object.assign({}, caption, {
414
395
  className: styles.captionText,
415
396
  lineClamp: captionMaxLines
416
- }))))) : null);
397
+ })))) : null);
417
398
  });
418
399
  return /*#__PURE__*/React.createElement("div", {
419
400
  className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.isPlaceholder, isPlaceholder)]),
@@ -467,11 +448,10 @@ var GalleryScreen = function GalleryScreen(_ref) {
467
448
  };
468
449
  GalleryScreen.propTypes = propTypes;
469
450
  GalleryScreen.defaultProps = defaultProps;
470
- var GalleryScreen$1 = /*#__PURE__*/React.memo(GalleryScreen);
471
451
 
472
452
  function GalleryCaptionsScreen(_ref) {
473
453
  var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
474
- return /*#__PURE__*/React.createElement(GalleryScreen$1, Object.assign({}, props, {
454
+ return /*#__PURE__*/React.createElement(GalleryScreen, Object.assign({}, props, {
475
455
  withCaptions: true
476
456
  }));
477
457
  }
@@ -518,7 +498,7 @@ var definition = [{
518
498
  "value": "Gallery"
519
499
  }]
520
500
  }),
521
- component: GalleryScreen$1,
501
+ component: GalleryScreen,
522
502
  layouts: [
523
503
  // 2
524
504
  'two-vertical-equal', 'two-vertical-top', 'two-vertical-bottom',
@@ -708,5 +688,5 @@ var definition = [{
708
688
  }];
709
689
 
710
690
  exports.GalleryCaptionsScreen = GalleryCaptionsScreen;
711
- exports.GalleryScreen = GalleryScreen$1;
691
+ exports.GalleryScreen = GalleryScreen;
712
692
  exports.default = definition;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-gallery",
3
- "version": "0.3.429",
3
+ "version": "0.3.432",
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.429",
62
- "@micromag/element-background": "^0.3.429",
63
- "@micromag/element-container": "^0.3.429",
64
- "@micromag/element-footer": "^0.3.429",
65
- "@micromag/element-grid": "^0.3.429",
66
- "@micromag/element-header": "^0.3.429",
67
- "@micromag/element-layout": "^0.3.429",
68
- "@micromag/element-text": "^0.3.429",
69
- "@micromag/element-visual": "^0.3.429",
70
- "@micromag/transforms": "^0.3.429",
61
+ "@micromag/core": "^0.3.432",
62
+ "@micromag/element-background": "^0.3.432",
63
+ "@micromag/element-container": "^0.3.432",
64
+ "@micromag/element-footer": "^0.3.432",
65
+ "@micromag/element-grid": "^0.3.432",
66
+ "@micromag/element-header": "^0.3.432",
67
+ "@micromag/element-layout": "^0.3.432",
68
+ "@micromag/element-text": "^0.3.432",
69
+ "@micromag/element-visual": "^0.3.432",
70
+ "@micromag/transforms": "^0.3.432",
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": "f15e72b88ecfda4c54b87626513149b58572c52b"
81
+ "gitHead": "01df977a7eb5166425c0078c2369ea240549f386"
82
82
  }