@micromag/element-background 0.2.330 → 0.2.335

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 +13 -10
  2. package/lib/index.js +12 -9
  3. package/package.json +2 -2
package/es/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import _defineProperty from '@babel/runtime/helpers/defineProperty';
2
2
  import _objectSpread from '@babel/runtime/helpers/objectSpread2';
3
- import React from 'react';
3
+ import React, { useMemo } from 'react';
4
4
  import PropTypes from 'prop-types';
5
5
  import classNames from 'classnames';
6
6
  import { PropTypes as PropTypes$1 } from '@micromag/core';
@@ -70,20 +70,23 @@ var Background = function Background(_ref) {
70
70
 
71
71
  var _ref3 = image || {},
72
72
  imageMetadata = _ref3.metadata,
73
- imageThumbnailUrl = _ref3.thumbnail_url;
73
+ imageThumbnailUrl = _ref3.thumbnail_url,
74
+ imageUrl = _ref3.url;
74
75
 
75
76
  var _ref4 = imageMetadata || {},
76
77
  imageMIME = _ref4.mime;
77
78
 
78
79
  var isImageGIF = imageMIME === 'image/gif';
79
- var videoImage = hasVideo && !playing && videoThumbnail !== null ? {
80
- url: videoThumbnail
81
- } : image;
82
- var finalImage = isImageGIF && !playing ? {
83
- url: imageThumbnailUrl
84
- } : videoImage; // image
85
-
86
- if (finalImage !== null) {
80
+ var finalImage = useMemo(function () {
81
+ var tmpImage = isImageGIF ? {
82
+ url: playing ? imageUrl : imageThumbnailUrl
83
+ } : image;
84
+ return hasVideo && !playing && videoThumbnail !== null ? {
85
+ url: videoThumbnail
86
+ } : tmpImage;
87
+ }, [isImageGIF, playing, imageUrl, imageThumbnailUrl, image, hasVideo, videoThumbnail]); // image
88
+
89
+ if (finalImage !== null && (!hasVideo || !playing)) {
87
90
  var finalUrl = getOptimalImageUrl(finalImage, width, height);
88
91
  finalStyle.backgroundImage = "url(\"".concat(finalUrl, "\")");
89
92
  finalStyle.backgroundRepeat = repeat ? 'repeat' : 'no-repeat';
package/lib/index.js CHANGED
@@ -81,20 +81,23 @@ var Background = function Background(_ref) {
81
81
 
82
82
  var _ref3 = image || {},
83
83
  imageMetadata = _ref3.metadata,
84
- imageThumbnailUrl = _ref3.thumbnail_url;
84
+ imageThumbnailUrl = _ref3.thumbnail_url,
85
+ imageUrl = _ref3.url;
85
86
 
86
87
  var _ref4 = imageMetadata || {},
87
88
  imageMIME = _ref4.mime;
88
89
 
89
90
  var isImageGIF = imageMIME === 'image/gif';
90
- var videoImage = hasVideo && !playing && videoThumbnail !== null ? {
91
- url: videoThumbnail
92
- } : image;
93
- var finalImage = isImageGIF && !playing ? {
94
- url: imageThumbnailUrl
95
- } : videoImage; // image
96
-
97
- if (finalImage !== null) {
91
+ var finalImage = React.useMemo(function () {
92
+ var tmpImage = isImageGIF ? {
93
+ url: playing ? imageUrl : imageThumbnailUrl
94
+ } : image;
95
+ return hasVideo && !playing && videoThumbnail !== null ? {
96
+ url: videoThumbnail
97
+ } : tmpImage;
98
+ }, [isImageGIF, playing, imageUrl, imageThumbnailUrl, image, hasVideo, videoThumbnail]); // image
99
+
100
+ if (finalImage !== null && (!hasVideo || !playing)) {
98
101
  var finalUrl = utils.getOptimalImageUrl(finalImage, width, height);
99
102
  finalStyle.backgroundImage = "url(\"".concat(finalUrl, "\")");
100
103
  finalStyle.backgroundRepeat = repeat ? 'repeat' : 'no-repeat';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/element-background",
3
- "version": "0.2.330",
3
+ "version": "0.2.335",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -59,5 +59,5 @@
59
59
  "publishConfig": {
60
60
  "access": "public"
61
61
  },
62
- "gitHead": "50961991e440527adbc1b4f59a21a4f195186b8a"
62
+ "gitHead": "18c0cdcdefbb844eff89561822c471514f017c54"
63
63
  }