@micromag/screen-image 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.
- package/assets/css/styles.css +1 -1
- package/es/index.js +13 -17
- package/lib/index.js +13 -17
- package/package.json +11 -11
package/assets/css/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.micromag-screen-image-container .micromag-screen-image-
|
|
1
|
+
.micromag-screen-image-container .micromag-screen-image-image{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-image-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-image-disabled.micromag-screen-image-container{overflow:hidden;pointer-events:none}.micromag-screen-image-hidden.micromag-screen-image-container{display:none;visibility:hidden}.micromag-screen-image-placeholder.micromag-screen-image-container .micromag-screen-image-content{position:relative;padding:6px}.micromag-screen-image-container .micromag-screen-image-emptyImage,.micromag-screen-image-container .micromag-screen-image-emptyLegend,.micromag-screen-image-container .micromag-screen-image-emptyText,.micromag-screen-image-container .micromag-screen-image-emptyTitle{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-image-container .micromag-screen-image-content{position:relative;height:100%}.micromag-screen-image-container .micromag-screen-image-emptyImage,.micromag-screen-image-container .micromag-screen-image-emptyLegend,.micromag-screen-image-container .micromag-screen-image-emptyText,.micromag-screen-image-container .micromag-screen-image-emptyTitle{width:100%;margin:10px auto}.micromag-screen-image-container .micromag-screen-image-emptyImage{height:100%}.micromag-screen-image-container .micromag-screen-image-emptyTitle{height:100px}.micromag-screen-image-container .micromag-screen-image-emptyText{height:80px}.micromag-screen-image-container .micromag-screen-image-emptyLegend{height:50px}.micromag-screen-image-container .micromag-screen-image-imageContainer{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-screen-image-container .micromag-screen-image-placeholderImage{height:100%}.micromag-screen-image-container.micromag-screen-image-isPlaceholder .micromag-screen-image-layout{padding:10px}.micromag-screen-image-container.micromag-screen-image-isCard .micromag-screen-image-placeholderImage{margin:-10px -10px 0}.micromag-screen-image-container.micromag-screen-image-isCardReverse .micromag-screen-image-placeholderImage{margin:10px -10px 0}.micromag-screen-image-container.micromag-screen-image-isCardReverse .micromag-screen-image-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-image-container.micromag-screen-image-isFullscreen .micromag-screen-image-layout{padding:0}.micromag-screen-image-container.micromag-screen-image-isFullscreen .micromag-screen-image-callToAction{position:absolute;bottom:0;width:100%;margin-top:0}
|
package/es/index.js
CHANGED
|
@@ -21,7 +21,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
|
|
|
21
21
|
import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
|
|
22
22
|
import { Image, Heading1, Text as Text$1, Container as Container$1 } from '@micromag/transforms/apple-news';
|
|
23
23
|
|
|
24
|
-
var styles = {"container":"micromag-screen-image-container","
|
|
24
|
+
var styles = {"container":"micromag-screen-image-container","image":"micromag-screen-image-image","disabled":"micromag-screen-image-disabled","hidden":"micromag-screen-image-hidden","placeholder":"micromag-screen-image-placeholder","content":"micromag-screen-image-content","emptyImage":"micromag-screen-image-emptyImage","emptyLegend":"micromag-screen-image-emptyLegend","emptyText":"micromag-screen-image-emptyText","emptyTitle":"micromag-screen-image-emptyTitle","imageContainer":"micromag-screen-image-imageContainer","placeholderImage":"micromag-screen-image-placeholderImage","isPlaceholder":"micromag-screen-image-isPlaceholder","layout":"micromag-screen-image-layout","isCard":"micromag-screen-image-isCard","isCardReverse":"micromag-screen-image-isCardReverse","callToAction":"micromag-screen-image-callToAction","isFullscreen":"micromag-screen-image-isFullscreen"};
|
|
25
25
|
|
|
26
26
|
var propTypes = {
|
|
27
27
|
layout: PropTypes.oneOf(['normal', 'fullscreen', 'reverse', 'card', 'card-reverse', 'title-top']),
|
|
@@ -182,7 +182,6 @@ var ImageScreen = function ImageScreen(_ref) {
|
|
|
182
182
|
muted: muted,
|
|
183
183
|
active: active,
|
|
184
184
|
shouldLoad: mediaShouldLoad,
|
|
185
|
-
withoutVideo: isPreview,
|
|
186
185
|
onLoaded: onImageLoaded
|
|
187
186
|
})) : null)), withTitle && /*#__PURE__*/React.createElement(ScreenElement, {
|
|
188
187
|
key: "title",
|
|
@@ -280,7 +279,7 @@ var ImageScreen = function ImageScreen(_ref) {
|
|
|
280
279
|
}
|
|
281
280
|
|
|
282
281
|
var paddingBottom = (current && !isPreview ? viewerBottomHeight : 0) + finalSpacing / 2;
|
|
283
|
-
var paddingTop = (!isPreview ? viewerTopHeight : 0) + finalSpacing / 2;
|
|
282
|
+
var paddingTop = (current && !isPreview ? viewerTopHeight : 0) + finalSpacing / 2;
|
|
284
283
|
|
|
285
284
|
if (isCard || isFullscreen) {
|
|
286
285
|
paddingTop = 0;
|
|
@@ -295,10 +294,18 @@ var ImageScreen = function ImageScreen(_ref) {
|
|
|
295
294
|
return /*#__PURE__*/React.createElement("div", {
|
|
296
295
|
className: classNames([styles.container, (_ref2 = {}, _defineProperty(_ref2, className, className !== null), _defineProperty(_ref2, styles.isReversed, isReversed), _defineProperty(_ref2, styles.isPlaceholder, isPlaceholder), _defineProperty(_ref2, styles.isCard, isCard), _defineProperty(_ref2, styles.isCardReverse, isCardReverse), _defineProperty(_ref2, styles.isFullscreen, isFullscreen), _ref2)]),
|
|
297
296
|
"data-screen-ready": ready
|
|
298
|
-
}, /*#__PURE__*/React.createElement(
|
|
297
|
+
}, !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
298
|
+
background: background,
|
|
299
299
|
width: width,
|
|
300
300
|
height: height,
|
|
301
|
-
|
|
301
|
+
resolution: resolution,
|
|
302
|
+
playing: backgroundPlaying,
|
|
303
|
+
muted: muted,
|
|
304
|
+
shouldLoad: mediaShouldLoad,
|
|
305
|
+
mediaRef: mediaRef
|
|
306
|
+
}) : null, /*#__PURE__*/React.createElement(Container, {
|
|
307
|
+
width: width,
|
|
308
|
+
height: height
|
|
302
309
|
}, /*#__PURE__*/React.createElement(Layout, {
|
|
303
310
|
className: styles.layout,
|
|
304
311
|
fullscreen: true,
|
|
@@ -307,18 +314,7 @@ var ImageScreen = function ImageScreen(_ref) {
|
|
|
307
314
|
paddingTop: paddingTop,
|
|
308
315
|
paddingBottom: paddingBottom
|
|
309
316
|
} : null
|
|
310
|
-
}, items))
|
|
311
|
-
background: background,
|
|
312
|
-
width: width,
|
|
313
|
-
height: height,
|
|
314
|
-
resolution: resolution,
|
|
315
|
-
playing: backgroundPlaying,
|
|
316
|
-
muted: muted,
|
|
317
|
-
shouldLoad: mediaShouldLoad,
|
|
318
|
-
mediaRef: mediaRef,
|
|
319
|
-
withoutVideo: isPreview,
|
|
320
|
-
className: styles.background
|
|
321
|
-
}) : null);
|
|
317
|
+
}, items)));
|
|
322
318
|
};
|
|
323
319
|
|
|
324
320
|
ImageScreen.propTypes = propTypes;
|
package/lib/index.js
CHANGED
|
@@ -43,7 +43,7 @@ var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
|
|
|
43
43
|
var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
|
|
44
44
|
var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
|
|
45
45
|
|
|
46
|
-
var styles = {"container":"micromag-screen-image-container","
|
|
46
|
+
var styles = {"container":"micromag-screen-image-container","image":"micromag-screen-image-image","disabled":"micromag-screen-image-disabled","hidden":"micromag-screen-image-hidden","placeholder":"micromag-screen-image-placeholder","content":"micromag-screen-image-content","emptyImage":"micromag-screen-image-emptyImage","emptyLegend":"micromag-screen-image-emptyLegend","emptyText":"micromag-screen-image-emptyText","emptyTitle":"micromag-screen-image-emptyTitle","imageContainer":"micromag-screen-image-imageContainer","placeholderImage":"micromag-screen-image-placeholderImage","isPlaceholder":"micromag-screen-image-isPlaceholder","layout":"micromag-screen-image-layout","isCard":"micromag-screen-image-isCard","isCardReverse":"micromag-screen-image-isCardReverse","callToAction":"micromag-screen-image-callToAction","isFullscreen":"micromag-screen-image-isFullscreen"};
|
|
47
47
|
|
|
48
48
|
var propTypes = {
|
|
49
49
|
layout: PropTypes__default["default"].oneOf(['normal', 'fullscreen', 'reverse', 'card', 'card-reverse', 'title-top']),
|
|
@@ -204,7 +204,6 @@ var ImageScreen = function ImageScreen(_ref) {
|
|
|
204
204
|
muted: muted,
|
|
205
205
|
active: active,
|
|
206
206
|
shouldLoad: mediaShouldLoad,
|
|
207
|
-
withoutVideo: isPreview,
|
|
208
207
|
onLoaded: onImageLoaded
|
|
209
208
|
})) : null)), withTitle && /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
210
209
|
key: "title",
|
|
@@ -302,7 +301,7 @@ var ImageScreen = function ImageScreen(_ref) {
|
|
|
302
301
|
}
|
|
303
302
|
|
|
304
303
|
var paddingBottom = (current && !isPreview ? viewerBottomHeight : 0) + finalSpacing / 2;
|
|
305
|
-
var paddingTop = (!isPreview ? viewerTopHeight : 0) + finalSpacing / 2;
|
|
304
|
+
var paddingTop = (current && !isPreview ? viewerTopHeight : 0) + finalSpacing / 2;
|
|
306
305
|
|
|
307
306
|
if (isCard || isFullscreen) {
|
|
308
307
|
paddingTop = 0;
|
|
@@ -317,10 +316,18 @@ var ImageScreen = function ImageScreen(_ref) {
|
|
|
317
316
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
318
317
|
className: classNames__default["default"]([styles.container, (_ref2 = {}, _defineProperty__default["default"](_ref2, className, className !== null), _defineProperty__default["default"](_ref2, styles.isReversed, isReversed), _defineProperty__default["default"](_ref2, styles.isPlaceholder, isPlaceholder), _defineProperty__default["default"](_ref2, styles.isCard, isCard), _defineProperty__default["default"](_ref2, styles.isCardReverse, isCardReverse), _defineProperty__default["default"](_ref2, styles.isFullscreen, isFullscreen), _ref2)]),
|
|
319
318
|
"data-screen-ready": ready
|
|
320
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
319
|
+
}, !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
|
|
320
|
+
background: background,
|
|
321
321
|
width: width,
|
|
322
322
|
height: height,
|
|
323
|
-
|
|
323
|
+
resolution: resolution,
|
|
324
|
+
playing: backgroundPlaying,
|
|
325
|
+
muted: muted,
|
|
326
|
+
shouldLoad: mediaShouldLoad,
|
|
327
|
+
mediaRef: mediaRef
|
|
328
|
+
}) : null, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
329
|
+
width: width,
|
|
330
|
+
height: height
|
|
324
331
|
}, /*#__PURE__*/React__default["default"].createElement(Layout__default["default"], {
|
|
325
332
|
className: styles.layout,
|
|
326
333
|
fullscreen: true,
|
|
@@ -329,18 +336,7 @@ var ImageScreen = function ImageScreen(_ref) {
|
|
|
329
336
|
paddingTop: paddingTop,
|
|
330
337
|
paddingBottom: paddingBottom
|
|
331
338
|
} : null
|
|
332
|
-
}, items))
|
|
333
|
-
background: background,
|
|
334
|
-
width: width,
|
|
335
|
-
height: height,
|
|
336
|
-
resolution: resolution,
|
|
337
|
-
playing: backgroundPlaying,
|
|
338
|
-
muted: muted,
|
|
339
|
-
shouldLoad: mediaShouldLoad,
|
|
340
|
-
mediaRef: mediaRef,
|
|
341
|
-
withoutVideo: isPreview,
|
|
342
|
-
className: styles.background
|
|
343
|
-
}) : null);
|
|
339
|
+
}, items)));
|
|
344
340
|
};
|
|
345
341
|
|
|
346
342
|
ImageScreen.propTypes = propTypes;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-image",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.251",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -49,15 +49,15 @@
|
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@babel/runtime": "^7.13.10",
|
|
52
|
-
"@micromag/core": "^0.3.
|
|
53
|
-
"@micromag/element-background": "^0.3.
|
|
54
|
-
"@micromag/element-call-to-action": "^0.3.
|
|
55
|
-
"@micromag/element-container": "^0.3.
|
|
56
|
-
"@micromag/element-heading": "^0.3.
|
|
57
|
-
"@micromag/element-layout": "^0.3.
|
|
58
|
-
"@micromag/element-text": "^0.3.
|
|
59
|
-
"@micromag/element-visual": "^0.3.
|
|
60
|
-
"@micromag/transforms": "^0.3.
|
|
52
|
+
"@micromag/core": "^0.3.251",
|
|
53
|
+
"@micromag/element-background": "^0.3.251",
|
|
54
|
+
"@micromag/element-call-to-action": "^0.3.251",
|
|
55
|
+
"@micromag/element-container": "^0.3.251",
|
|
56
|
+
"@micromag/element-heading": "^0.3.251",
|
|
57
|
+
"@micromag/element-layout": "^0.3.251",
|
|
58
|
+
"@micromag/element-text": "^0.3.251",
|
|
59
|
+
"@micromag/element-visual": "^0.3.251",
|
|
60
|
+
"@micromag/transforms": "^0.3.251",
|
|
61
61
|
"classnames": "^2.2.6",
|
|
62
62
|
"lodash": "^4.17.21",
|
|
63
63
|
"prop-types": "^15.7.2",
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"publishConfig": {
|
|
68
68
|
"access": "public"
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "3b6fb00baaa7f3ab90684a88cbe4c30929b6b27d"
|
|
71
71
|
}
|