@micromag/screen-image-360 0.3.230 → 0.3.235

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.
@@ -1 +1 @@
1
- .micromag-screen-image-360-container .micromag-screen-image-360-canvasButton{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-screen-image-360-container .micromag-screen-image-360-canvas,.micromag-screen-image-360-container .micromag-screen-image-360-canvasButton,.micromag-screen-image-360-container .micromag-screen-image-360-content,.micromag-screen-image-360-container .micromag-screen-image-360-placeholder,.micromag-screen-image-360-container .micromag-screen-image-360-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-image-360-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-image-360-disabled.micromag-screen-image-360-container{overflow:hidden;pointer-events:none}.micromag-screen-image-360-hidden.micromag-screen-image-360-container{display:none;visibility:hidden}.micromag-screen-image-360-placeholder.micromag-screen-image-360-container .micromag-screen-image-360-content{position:relative;padding:6px}.micromag-screen-image-360-container .micromag-screen-image-360-empty{margin:5px auto;border:2px dashed #343434;color:#343434;height:100%;margin:0}.micromag-screen-image-360-container .micromag-screen-image-360-canvasButton{-ms-touch-action:none;touch-action:none}.micromag-screen-image-360-container .micromag-screen-image-360-videoContainer{position:absolute}.micromag-screen-image-360-container .micromag-screen-image-360-video{visibility:hidden}.micromag-screen-image-360-container .micromag-screen-image-360-video video{height:100%}.micromag-screen-image-360-container .micromag-screen-image-360-mediaControls{padding:10px 20px 20px}.micromag-screen-image-360-container .micromag-screen-image-360-placeholder{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;height:100%}.micromag-screen-image-360-container .micromag-screen-image-360-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-image-360-container.micromag-screen-image-360-showVideo .micromag-screen-image-360-video{visibility:visible}
1
+ .micromag-screen-image-360-container .micromag-screen-image-360-canvasButton{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-screen-image-360-container .micromag-screen-image-360-background,.micromag-screen-image-360-container .micromag-screen-image-360-canvas,.micromag-screen-image-360-container .micromag-screen-image-360-canvasButton,.micromag-screen-image-360-container .micromag-screen-image-360-inner,.micromag-screen-image-360-container .micromag-screen-image-360-placeholder,.micromag-screen-image-360-container .micromag-screen-image-360-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-image-360-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-image-360-disabled.micromag-screen-image-360-container{overflow:hidden;pointer-events:none}.micromag-screen-image-360-hidden.micromag-screen-image-360-container{display:none;visibility:hidden}.micromag-screen-image-360-placeholder.micromag-screen-image-360-container .micromag-screen-image-360-content{position:relative;padding:6px}.micromag-screen-image-360-container .micromag-screen-image-360-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-image-360-container .micromag-screen-image-360-background{z-index:0}.micromag-screen-image-360-container .micromag-screen-image-360-content{z-index:1}.micromag-screen-image-360-container .micromag-screen-image-360-empty{height:100%;margin:0}.micromag-screen-image-360-container .micromag-screen-image-360-canvasButton{-ms-touch-action:none;touch-action:none}.micromag-screen-image-360-container .micromag-screen-image-360-videoContainer{position:absolute}.micromag-screen-image-360-container .micromag-screen-image-360-video{visibility:hidden}.micromag-screen-image-360-container .micromag-screen-image-360-video video{height:100%}.micromag-screen-image-360-container .micromag-screen-image-360-mediaControls{padding:10px 20px 20px}.micromag-screen-image-360-container .micromag-screen-image-360-placeholder{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;height:100%}.micromag-screen-image-360-container .micromag-screen-image-360-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-image-360-container.micromag-screen-image-360-showVideo .micromag-screen-image-360-video{visibility:visible}
package/es/index.js CHANGED
@@ -77,7 +77,7 @@ var useThree = function useThree() {
77
77
  return loadedPackage;
78
78
  };
79
79
 
80
- var styles = {"container":"micromag-screen-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","canvas":"micromag-screen-image-360-canvas","content":"micromag-screen-image-360-content","placeholder":"micromag-screen-image-360-placeholder","video":"micromag-screen-image-360-video","disabled":"micromag-screen-image-360-disabled","hidden":"micromag-screen-image-360-hidden","empty":"micromag-screen-image-360-empty","videoContainer":"micromag-screen-image-360-videoContainer","mediaControls":"micromag-screen-image-360-mediaControls","callToAction":"micromag-screen-image-360-callToAction","showVideo":"micromag-screen-image-360-showVideo"};
80
+ var styles = {"container":"micromag-screen-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","background":"micromag-screen-image-360-background","canvas":"micromag-screen-image-360-canvas","inner":"micromag-screen-image-360-inner","placeholder":"micromag-screen-image-360-placeholder","video":"micromag-screen-image-360-video","disabled":"micromag-screen-image-360-disabled","hidden":"micromag-screen-image-360-hidden","content":"micromag-screen-image-360-content","empty":"micromag-screen-image-360-empty","videoContainer":"micromag-screen-image-360-videoContainer","mediaControls":"micromag-screen-image-360-mediaControls","callToAction":"micromag-screen-image-360-callToAction","showVideo":"micromag-screen-image-360-showVideo"};
81
81
 
82
82
  var propTypes = {
83
83
  layout: PropTypes.oneOf(['full']),
@@ -457,19 +457,10 @@ var Image360Screen = function Image360Screen(_ref) {
457
457
  return /*#__PURE__*/React.createElement("div", {
458
458
  className: classNames([styles.container, (_ref7 = {}, _defineProperty(_ref7, className, className !== null), _defineProperty(_ref7, styles.showVideo, isPreview || isStatic || isCapture), _ref7)]),
459
459
  "data-screen-ready": (isStatic || isCapture) && posterReady || ready
460
- }, !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
461
- background: background,
460
+ }, /*#__PURE__*/React.createElement(Container, {
462
461
  width: width,
463
462
  height: height,
464
- resolution: resolution,
465
- playing: backgroundPlaying,
466
- muted: muted,
467
- shouldLoad: mediaShouldLoad,
468
- mediaRef: mediaRef,
469
- withoutVideo: isPreview
470
- }) : null, /*#__PURE__*/React.createElement(Container, {
471
- width: width,
472
- height: height
463
+ className: styles.content
473
464
  }, /*#__PURE__*/React.createElement("div", {
474
465
  ref: canvasContainerRef,
475
466
  className: styles.videoContainer,
@@ -480,8 +471,19 @@ var Image360Screen = function Image360Screen(_ref) {
480
471
  top: resizedImageTop
481
472
  }
482
473
  }), /*#__PURE__*/React.createElement("div", {
483
- className: styles.content
484
- }, items)));
474
+ className: styles.inner
475
+ }, items)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
476
+ background: background,
477
+ width: width,
478
+ height: height,
479
+ resolution: resolution,
480
+ playing: backgroundPlaying,
481
+ muted: muted,
482
+ shouldLoad: mediaShouldLoad,
483
+ mediaRef: mediaRef,
484
+ withoutVideo: isPreview,
485
+ className: styles.background
486
+ }) : null);
485
487
  };
486
488
 
487
489
  Image360Screen.propTypes = propTypes;
package/lib/index.js CHANGED
@@ -113,7 +113,7 @@ var useThree = function useThree() {
113
113
  return loadedPackage;
114
114
  };
115
115
 
116
- var styles = {"container":"micromag-screen-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","canvas":"micromag-screen-image-360-canvas","content":"micromag-screen-image-360-content","placeholder":"micromag-screen-image-360-placeholder","video":"micromag-screen-image-360-video","disabled":"micromag-screen-image-360-disabled","hidden":"micromag-screen-image-360-hidden","empty":"micromag-screen-image-360-empty","videoContainer":"micromag-screen-image-360-videoContainer","mediaControls":"micromag-screen-image-360-mediaControls","callToAction":"micromag-screen-image-360-callToAction","showVideo":"micromag-screen-image-360-showVideo"};
116
+ var styles = {"container":"micromag-screen-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","background":"micromag-screen-image-360-background","canvas":"micromag-screen-image-360-canvas","inner":"micromag-screen-image-360-inner","placeholder":"micromag-screen-image-360-placeholder","video":"micromag-screen-image-360-video","disabled":"micromag-screen-image-360-disabled","hidden":"micromag-screen-image-360-hidden","content":"micromag-screen-image-360-content","empty":"micromag-screen-image-360-empty","videoContainer":"micromag-screen-image-360-videoContainer","mediaControls":"micromag-screen-image-360-mediaControls","callToAction":"micromag-screen-image-360-callToAction","showVideo":"micromag-screen-image-360-showVideo"};
117
117
 
118
118
  var propTypes = {
119
119
  layout: PropTypes__default["default"].oneOf(['full']),
@@ -493,19 +493,10 @@ var Image360Screen = function Image360Screen(_ref) {
493
493
  return /*#__PURE__*/React__default["default"].createElement("div", {
494
494
  className: classNames__default["default"]([styles.container, (_ref7 = {}, _defineProperty__default["default"](_ref7, className, className !== null), _defineProperty__default["default"](_ref7, styles.showVideo, isPreview || isStatic || isCapture), _ref7)]),
495
495
  "data-screen-ready": (isStatic || isCapture) && posterReady || ready
496
- }, !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
497
- background: background,
496
+ }, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
498
497
  width: width,
499
498
  height: height,
500
- resolution: resolution,
501
- playing: backgroundPlaying,
502
- muted: muted,
503
- shouldLoad: mediaShouldLoad,
504
- mediaRef: mediaRef,
505
- withoutVideo: isPreview
506
- }) : null, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
507
- width: width,
508
- height: height
499
+ className: styles.content
509
500
  }, /*#__PURE__*/React__default["default"].createElement("div", {
510
501
  ref: canvasContainerRef,
511
502
  className: styles.videoContainer,
@@ -516,8 +507,19 @@ var Image360Screen = function Image360Screen(_ref) {
516
507
  top: resizedImageTop
517
508
  }
518
509
  }), /*#__PURE__*/React__default["default"].createElement("div", {
519
- className: styles.content
520
- }, items)));
510
+ className: styles.inner
511
+ }, items)), !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
512
+ background: background,
513
+ width: width,
514
+ height: height,
515
+ resolution: resolution,
516
+ playing: backgroundPlaying,
517
+ muted: muted,
518
+ shouldLoad: mediaShouldLoad,
519
+ mediaRef: mediaRef,
520
+ withoutVideo: isPreview,
521
+ className: styles.background
522
+ }) : null);
521
523
  };
522
524
 
523
525
  Image360Screen.propTypes = propTypes;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-image-360",
3
- "version": "0.3.230",
3
+ "version": "0.3.235",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -50,15 +50,15 @@
50
50
  "dependencies": {
51
51
  "@babel/runtime": "^7.13.10",
52
52
  "@folklore/size": "^0.1.20",
53
- "@micromag/core": "^0.3.230",
54
- "@micromag/element-background": "^0.3.230",
55
- "@micromag/element-call-to-action": "^0.3.230",
56
- "@micromag/element-closed-captions": "^0.3.230",
57
- "@micromag/element-container": "^0.3.230",
58
- "@micromag/element-image": "^0.3.230",
59
- "@micromag/element-media-controls": "^0.3.230",
60
- "@micromag/element-video": "^0.3.230",
61
- "@micromag/transforms": "^0.3.230",
53
+ "@micromag/core": "^0.3.235",
54
+ "@micromag/element-background": "^0.3.235",
55
+ "@micromag/element-call-to-action": "^0.3.235",
56
+ "@micromag/element-closed-captions": "^0.3.235",
57
+ "@micromag/element-container": "^0.3.235",
58
+ "@micromag/element-image": "^0.3.235",
59
+ "@micromag/element-media-controls": "^0.3.235",
60
+ "@micromag/element-video": "^0.3.235",
61
+ "@micromag/transforms": "^0.3.235",
62
62
  "classnames": "^2.2.6",
63
63
  "lodash": "^4.17.21",
64
64
  "prop-types": "^15.7.2",
@@ -70,5 +70,5 @@
70
70
  "publishConfig": {
71
71
  "access": "public"
72
72
  },
73
- "gitHead": "e69201dc3a0c466c0140d3f9d382c9873b1cead9"
73
+ "gitHead": "e1f899344bb55abf06daa6247d9adbd7401a765b"
74
74
  }