@micromag/element-background 0.3.246 → 0.3.251

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 +10 -17
  3. package/lib/index.js +10 -17
  4. package/package.json +4 -4
package/assets/css/styles.css CHANGED
@@ -1 +1 @@
1
- .micromag-element-background-layer,.micromag-element-background-layers,.micromag-element-background-video,.micromag-element-background-videoContainer{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-element-background-container{position:relative;overflow:hidden}.micromag-element-background-layer,.micromag-element-background-layers{z-index:0}.micromag-element-background-right .micromag-element-background-background{right:0;left:auto}.micromag-element-background-bottom .micromag-element-background-background{top:auto;bottom:0}
1
+ .micromag-element-background-container,.micromag-element-background-layer,.micromag-element-background-layers,.micromag-element-background-video,.micromag-element-background-videoContainer{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-element-background-container{z-index:0;overflow:hidden}.micromag-element-background-layer,.micromag-element-background-layers{z-index:0}.micromag-element-background-right .micromag-element-background-background{right:0;left:auto}.micromag-element-background-bottom .micromag-element-background-background{top:auto;bottom:0}
package/es/index.js CHANGED
@@ -9,7 +9,7 @@ import { getStyleFromColor, getOptimalImageUrl, getLayersFromBackground } from '
9
9
  import { getSizeWithinBounds } from '@folklore/size';
10
10
  import Video from '@micromag/element-video';
11
11
 
12
- var styles = {"layer":"micromag-element-background-layer","layers":"micromag-element-background-layers","video":"micromag-element-background-video","videoContainer":"micromag-element-background-videoContainer","container":"micromag-element-background-container","right":"micromag-element-background-right","background":"micromag-element-background-background","bottom":"micromag-element-background-bottom"};
12
+ var styles = {"container":"micromag-element-background-container","layer":"micromag-element-background-layer","layers":"micromag-element-background-layers","video":"micromag-element-background-video","videoContainer":"micromag-element-background-videoContainer","right":"micromag-element-background-right","background":"micromag-element-background-background","bottom":"micromag-element-background-bottom"};
13
13
 
14
14
  var propTypes$1 = {
15
15
  width: PropTypes.number,
@@ -30,8 +30,7 @@ var propTypes$1 = {
30
30
  muted: PropTypes.bool,
31
31
  children: PropTypes.node,
32
32
  loadingMode: PropTypes.string,
33
- shouldLoad: PropTypes.bool,
34
- withoutVideo: PropTypes.bool
33
+ shouldLoad: PropTypes.bool
35
34
  };
36
35
  var defaultProps$1 = {
37
36
  width: null,
@@ -49,8 +48,7 @@ var defaultProps$1 = {
49
48
  muted: false,
50
49
  children: null,
51
50
  loadingMode: 'lazy',
52
- shouldLoad: true,
53
- withoutVideo: false
51
+ shouldLoad: true
54
52
  };
55
53
 
56
54
  var Background = function Background(_ref) {
@@ -69,8 +67,7 @@ var Background = function Background(_ref) {
69
67
  muted = _ref.muted,
70
68
  children = _ref.children,
71
69
  loadingMode = _ref.loadingMode,
72
- shouldLoad = _ref.shouldLoad,
73
- withoutVideo = _ref.withoutVideo;
70
+ shouldLoad = _ref.shouldLoad;
74
71
 
75
72
  var _ref2 = media || {},
76
73
  _ref2$type = _ref2.type,
@@ -103,7 +100,7 @@ var Background = function Background(_ref) {
103
100
  }, getStyleFromColor(color)); // image
104
101
 
105
102
 
106
- if (media !== null && (isImage || isVideo && (!shouldLoad || withoutVideo))) {
103
+ if (media !== null && (isImage || isVideo && !shouldLoad)) {
107
104
  var finalUrl = getOptimalImageUrl(isVideo ? {
108
105
  url: mediaThumbnailUrl
109
106
  } : media, width, height, {
@@ -145,7 +142,7 @@ var Background = function Background(_ref) {
145
142
  return /*#__PURE__*/React.createElement("div", {
146
143
  className: classNames([styles.container, _defineProperty({}, className, className !== null)]),
147
144
  style: containerStyle
148
- }, isVideo && shouldLoad && !withoutVideo ? /*#__PURE__*/React.createElement("div", {
145
+ }, isVideo && shouldLoad ? /*#__PURE__*/React.createElement("div", {
149
146
  className: styles.videoContainer,
150
147
  style: videoContainerStyle
151
148
  }, /*#__PURE__*/React.createElement(Video, {
@@ -183,8 +180,7 @@ var propTypes = {
183
180
  // eslint-disable-next-line react/forbid-prop-types
184
181
  current: PropTypes.any
185
182
  })]),
186
- shouldLoad: PropTypes.bool,
187
- withoutVideo: PropTypes.bool
183
+ shouldLoad: PropTypes.bool
188
184
  };
189
185
  var defaultProps = {
190
186
  width: null,
@@ -199,8 +195,7 @@ var defaultProps = {
199
195
  backgroundClassName: null,
200
196
  loadingMode: 'lazy',
201
197
  mediaRef: null,
202
- shouldLoad: true,
203
- withoutVideo: false
198
+ shouldLoad: true
204
199
  };
205
200
 
206
201
  var BackgroundLayers = function BackgroundLayers(_ref) {
@@ -216,8 +211,7 @@ var BackgroundLayers = function BackgroundLayers(_ref) {
216
211
  backgroundClassName = _ref.backgroundClassName,
217
212
  loadingMode = _ref.loadingMode,
218
213
  mediaRef = _ref.mediaRef,
219
- shouldLoad = _ref.shouldLoad,
220
- withoutVideo = _ref.withoutVideo;
214
+ shouldLoad = _ref.shouldLoad;
221
215
  var hasSize = width > 0 && height > 0;
222
216
  var layers = useMemo(function () {
223
217
  return getLayersFromBackground(background);
@@ -260,8 +254,7 @@ var BackgroundLayers = function BackgroundLayers(_ref) {
260
254
  verticalAlign: verticalAlign,
261
255
  loadingMode: loadingMode,
262
256
  shouldLoad: shouldLoad,
263
- mediaRef: mediaRef,
264
- withoutVideo: withoutVideo
257
+ mediaRef: mediaRef
265
258
  }, layer)));
266
259
  })), /*#__PURE__*/React.createElement("div", {
267
260
  className: styles.content
package/lib/index.js CHANGED
@@ -23,7 +23,7 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
23
23
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
24
24
  var Video__default = /*#__PURE__*/_interopDefaultLegacy(Video);
25
25
 
26
- var styles = {"layer":"micromag-element-background-layer","layers":"micromag-element-background-layers","video":"micromag-element-background-video","videoContainer":"micromag-element-background-videoContainer","container":"micromag-element-background-container","right":"micromag-element-background-right","background":"micromag-element-background-background","bottom":"micromag-element-background-bottom"};
26
+ var styles = {"container":"micromag-element-background-container","layer":"micromag-element-background-layer","layers":"micromag-element-background-layers","video":"micromag-element-background-video","videoContainer":"micromag-element-background-videoContainer","right":"micromag-element-background-right","background":"micromag-element-background-background","bottom":"micromag-element-background-bottom"};
27
27
 
28
28
  var propTypes$1 = {
29
29
  width: PropTypes__default["default"].number,
@@ -44,8 +44,7 @@ var propTypes$1 = {
44
44
  muted: PropTypes__default["default"].bool,
45
45
  children: PropTypes__default["default"].node,
46
46
  loadingMode: PropTypes__default["default"].string,
47
- shouldLoad: PropTypes__default["default"].bool,
48
- withoutVideo: PropTypes__default["default"].bool
47
+ shouldLoad: PropTypes__default["default"].bool
49
48
  };
50
49
  var defaultProps$1 = {
51
50
  width: null,
@@ -63,8 +62,7 @@ var defaultProps$1 = {
63
62
  muted: false,
64
63
  children: null,
65
64
  loadingMode: 'lazy',
66
- shouldLoad: true,
67
- withoutVideo: false
65
+ shouldLoad: true
68
66
  };
69
67
 
70
68
  var Background = function Background(_ref) {
@@ -83,8 +81,7 @@ var Background = function Background(_ref) {
83
81
  muted = _ref.muted,
84
82
  children = _ref.children,
85
83
  loadingMode = _ref.loadingMode,
86
- shouldLoad = _ref.shouldLoad,
87
- withoutVideo = _ref.withoutVideo;
84
+ shouldLoad = _ref.shouldLoad;
88
85
 
89
86
  var _ref2 = media || {},
90
87
  _ref2$type = _ref2.type,
@@ -117,7 +114,7 @@ var Background = function Background(_ref) {
117
114
  }, utils.getStyleFromColor(color)); // image
118
115
 
119
116
 
120
- if (media !== null && (isImage || isVideo && (!shouldLoad || withoutVideo))) {
117
+ if (media !== null && (isImage || isVideo && !shouldLoad)) {
121
118
  var finalUrl = utils.getOptimalImageUrl(isVideo ? {
122
119
  url: mediaThumbnailUrl
123
120
  } : media, width, height, {
@@ -159,7 +156,7 @@ var Background = function Background(_ref) {
159
156
  return /*#__PURE__*/React__default["default"].createElement("div", {
160
157
  className: classNames__default["default"]([styles.container, _defineProperty__default["default"]({}, className, className !== null)]),
161
158
  style: containerStyle
162
- }, isVideo && shouldLoad && !withoutVideo ? /*#__PURE__*/React__default["default"].createElement("div", {
159
+ }, isVideo && shouldLoad ? /*#__PURE__*/React__default["default"].createElement("div", {
163
160
  className: styles.videoContainer,
164
161
  style: videoContainerStyle
165
162
  }, /*#__PURE__*/React__default["default"].createElement(Video__default["default"], {
@@ -197,8 +194,7 @@ var propTypes = {
197
194
  // eslint-disable-next-line react/forbid-prop-types
198
195
  current: PropTypes__default["default"].any
199
196
  })]),
200
- shouldLoad: PropTypes__default["default"].bool,
201
- withoutVideo: PropTypes__default["default"].bool
197
+ shouldLoad: PropTypes__default["default"].bool
202
198
  };
203
199
  var defaultProps = {
204
200
  width: null,
@@ -213,8 +209,7 @@ var defaultProps = {
213
209
  backgroundClassName: null,
214
210
  loadingMode: 'lazy',
215
211
  mediaRef: null,
216
- shouldLoad: true,
217
- withoutVideo: false
212
+ shouldLoad: true
218
213
  };
219
214
 
220
215
  var BackgroundLayers = function BackgroundLayers(_ref) {
@@ -230,8 +225,7 @@ var BackgroundLayers = function BackgroundLayers(_ref) {
230
225
  backgroundClassName = _ref.backgroundClassName,
231
226
  loadingMode = _ref.loadingMode,
232
227
  mediaRef = _ref.mediaRef,
233
- shouldLoad = _ref.shouldLoad,
234
- withoutVideo = _ref.withoutVideo;
228
+ shouldLoad = _ref.shouldLoad;
235
229
  var hasSize = width > 0 && height > 0;
236
230
  var layers = React.useMemo(function () {
237
231
  return utils.getLayersFromBackground(background);
@@ -274,8 +268,7 @@ var BackgroundLayers = function BackgroundLayers(_ref) {
274
268
  verticalAlign: verticalAlign,
275
269
  loadingMode: loadingMode,
276
270
  shouldLoad: shouldLoad,
277
- mediaRef: mediaRef,
278
- withoutVideo: withoutVideo
271
+ mediaRef: mediaRef
279
272
  }, layer)));
280
273
  })), /*#__PURE__*/React__default["default"].createElement("div", {
281
274
  className: styles.content
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/element-background",
3
- "version": "0.3.246",
3
+ "version": "0.3.251",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -48,8 +48,8 @@
48
48
  "dependencies": {
49
49
  "@babel/runtime": "^7.13.10",
50
50
  "@folklore/size": "^0.1.20",
51
- "@micromag/core": "^0.3.246",
52
- "@micromag/element-video": "^0.3.246",
51
+ "@micromag/core": "^0.3.251",
52
+ "@micromag/element-video": "^0.3.251",
53
53
  "classnames": "^2.2.6",
54
54
  "lodash": "^4.17.21",
55
55
  "prop-types": "^15.7.2",
@@ -59,5 +59,5 @@
59
59
  "publishConfig": {
60
60
  "access": "public"
61
61
  },
62
- "gitHead": "473a4ad55684e54d3f1e62e760792ed6e003f8e7"
62
+ "gitHead": "3b6fb00baaa7f3ab90684a88cbe4c30929b6b27d"
63
63
  }