@micromag/element-visual 0.3.443 → 0.3.445

package/assets/css/styles.css

@@ -1 +1 @@
-.micromag-element-visual-container{overflow:hidden;position:relative}.micromag-element-visual-container .micromag-element-visual-videoContainer{overflow:hidden;position:absolute}
+.micromag-element-visual-container{overflow:hidden;position:relative}.micromag-element-visual-container .micromag-element-visual-videoContainer{overflow:hidden;position:absolute}.micromag-element-visual-container .micromag-element-visual-videoTag{pointer-events:auto}.micromag-element-visual-container .micromag-element-visual-videoTouchOverlay{bottom:0;left:0;position:absolute;right:0;top:0}

package/es/index.js

@@ -9,7 +9,7 @@ import { PropTypes } from '@micromag/core';
 import Image from '@micromag/element-image';
 import Video from '@micromag/element-video';
 
-var styles = {"container":"micromag-element-visual-container","videoContainer":"micromag-element-visual-videoContainer"};
+var styles = {"container":"micromag-element-visual-container","videoContainer":"micromag-element-visual-videoContainer","videoTag":"micromag-element-visual-videoTag","videoTouchOverlay":"micromag-element-visual-videoTouchOverlay"};
 
 var _excluded = ["media", "mediaRef", "width", "height", "resolution", "objectFit", "playing", "muted", "shouldLoad", "videoLoop", "videoInitialMuted", "onLoaded", "className", "imageClassName", "videoClassName", "withoutVideo"];
 var propTypes = {
@@ -89,9 +89,9 @@ var Visual = function Visual(_ref) {
       }
     }) : elProps;
     return shouldLoad && !withoutVideo ? _objectSpread(_objectSpread({}, elProps), {}, {
-      media: {
+      media: _objectSpread(_objectSpread({}, media), {}, {
         url: url
-      }
+      })
     }) : tmpProps;
   }, [isVideo, elProps, thumbnailUrl, url, shouldLoad]);
   var videoContainerStyle = null;
@@ -145,6 +145,7 @@ var Visual = function Visual(_ref) {
     className: classNames([styles.videoContainer, _defineProperty({}, videoClassName, videoClassName !== null)]),
     style: videoContainerStyle
   }, /*#__PURE__*/React.createElement(Video, Object.assign({}, elProps, {
+    innerClassName: styles.videoTag,
     mediaRef: mediaRef,
     width: objectFit === null ? width : null,
     height: objectFit === null ? height : null,
@@ -154,7 +155,9 @@ var Visual = function Visual(_ref) {
     shouldLoad: shouldLoad,
     onReady: onLoaded,
     autoPlay: true
-  })))) : null) : null;
+  })), /*#__PURE__*/React.createElement("div", {
+    className: styles.videoTouchOverlay
+  }))) : null) : null;
 };
 Visual.propTypes = propTypes;
 Visual.defaultProps = defaultProps;

package/lib/index.js

@@ -11,7 +11,7 @@ var core = require('@micromag/core');
 var Image = require('@micromag/element-image');
 var Video = require('@micromag/element-video');
 
-var styles = {"container":"micromag-element-visual-container","videoContainer":"micromag-element-visual-videoContainer"};
+var styles = {"container":"micromag-element-visual-container","videoContainer":"micromag-element-visual-videoContainer","videoTag":"micromag-element-visual-videoTag","videoTouchOverlay":"micromag-element-visual-videoTouchOverlay"};
 
 var _excluded = ["media", "mediaRef", "width", "height", "resolution", "objectFit", "playing", "muted", "shouldLoad", "videoLoop", "videoInitialMuted", "onLoaded", "className", "imageClassName", "videoClassName", "withoutVideo"];
 var propTypes = {
@@ -91,9 +91,9 @@ var Visual = function Visual(_ref) {
       }
     }) : elProps;
     return shouldLoad && !withoutVideo ? _objectSpread(_objectSpread({}, elProps), {}, {
-      media: {
+      media: _objectSpread(_objectSpread({}, media), {}, {
         url: url
-      }
+      })
     }) : tmpProps;
   }, [isVideo, elProps, thumbnailUrl, url, shouldLoad]);
   var videoContainerStyle = null;
@@ -147,6 +147,7 @@ var Visual = function Visual(_ref) {
     className: classNames([styles.videoContainer, _defineProperty({}, videoClassName, videoClassName !== null)]),
     style: videoContainerStyle
   }, /*#__PURE__*/React.createElement(Video, Object.assign({}, elProps, {
+    innerClassName: styles.videoTag,
     mediaRef: mediaRef,
     width: objectFit === null ? width : null,
     height: objectFit === null ? height : null,
@@ -156,7 +157,9 @@ var Visual = function Visual(_ref) {
     shouldLoad: shouldLoad,
     onReady: onLoaded,
     autoPlay: true
-  })))) : null) : null;
+  })), /*#__PURE__*/React.createElement("div", {
+    className: styles.videoTouchOverlay
+  }))) : null) : null;
 };
 Visual.propTypes = propTypes;
 Visual.defaultProps = defaultProps;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/element-visual",
-    "version": "0.3.443",
+    "version": "0.3.445",
     "private": false,
     "description": "",
     "keywords": [
@@ -59,9 +59,9 @@
     "dependencies": {
         "@babel/runtime": "^7.13.10",
         "@folklore/size": "^0.1.20",
-        "@micromag/core": "^0.3.443",
-        "@micromag/element-image": "^0.3.443",
-        "@micromag/element-video": "^0.3.443",
+        "@micromag/core": "^0.3.444",
+        "@micromag/element-image": "^0.3.445",
+        "@micromag/element-video": "^0.3.444",
         "classnames": "^2.2.6",
         "prop-types": "^15.7.2",
         "uuid": "^9.0.0"
@@ -70,5 +70,5 @@
         "access": "public",
         "registry": "https://registry.npmjs.org/"
     },
-    "gitHead": "c6da9d6483b9fca577e875637405f35b2c480d05"
+    "gitHead": "15e070c18292ffd521c340a035bc8dc7395c3bc1"
 }