@micromag/element-video 0.4.55 → 0.4.63

package/es/index.js

@@ -14,8 +14,10 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 // Disabled webm for now
 // const defaultPossibleMimes = ['video/mp4', 'video/webm', 'video/ogg', 'application/vnd.apple.mpegurl'];
 
-function useSources(media) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+function useSources() {
+  var media = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  var _ref = options || {},
     _ref$possibleMimes = _ref.possibleMimes,
     possibleMimes = _ref$possibleMimes === void 0 ? null : _ref$possibleMimes;
   var _ref2 = media || {},
@@ -27,7 +29,9 @@ function useSources(media) {
     _ref3$mime = _ref3.mime,
     mediaMime = _ref3$mime === void 0 ? null : _ref3$mime;
   var settingsPossibleMimes = useSetting('supportedVideoMimes');
-  var finalPossibleMimes = possibleMimes || settingsPossibleMimes || ['video/mp4'];
+  var finalPossibleMimes = useMemo(function () {
+    return possibleMimes || settingsPossibleMimes || ['video/mp4'];
+  }, [possibleMimes, settingsPossibleMimes]);
   var files = useMemo(function () {
     return getMediaFilesAsArray(mediaFiles);
   }, [mediaFiles]);
@@ -165,6 +169,8 @@ function Video(_ref) {
   var _useSources = useSources(media),
     sources = _useSources.sources,
     isImage = _useSources.isImage;
+  // console.log('media', media, sources, isImage);
+
   var isImageWithoutSourceFile = isImage && (sources === null || sources.length === 0);
   var _ref6 = useRef(null);
   var currentTime = useMediaCurrentTime(_ref6.current, {
@@ -245,9 +251,23 @@ function Video(_ref) {
     }
   }, [ready, onReady]);
   var finalPreload = shouldLoad ? preload : 'none';
+  var _useState5 = useState(finalPreload === 'auto' || finalPreload === 'metadata'),
+    _useState6 = _slicedToArray(_useState5, 2),
+    wasPreloaded = _useState6[0],
+    setWasPreloaded = _useState6[1];
   useEffect(function () {
     var _ref$current2 = _ref6.current,
       element = _ref$current2 === void 0 ? null : _ref$current2;
+    if (shouldLoad && !wasPreloaded && element !== null) {
+      try {
+        element.load();
+      } catch (_unused) {}
+      setWasPreloaded(true);
+    }
+  }, [shouldLoad, wasPreloaded]);
+  useEffect(function () {
+    var _ref$current3 = _ref6.current,
+      element = _ref$current3 === void 0 ? null : _ref$current3;
     if (element === null || mediaUrl === null) {
       return;
     }
@@ -288,7 +308,7 @@ function Video(_ref) {
           mediaRef.current = newRef;
         }
       },
-      src: sources === null && shouldLoad ? "".concat(mediaUrl, "#t=0.001") : null,
+      src: sources === null && shouldLoad ? "".concat(mediaUrl, "#t=0.001") : undefined,
       autoPlay: autoPlay && !paused,
       loop: loop,
       muted: muted,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/element-video",
-    "version": "0.4.55",
+    "version": "0.4.63",
     "private": false,
     "description": "",
     "keywords": [
@@ -60,8 +60,8 @@
     },
     "dependencies": {
         "@babel/runtime": "^7.28.6",
-        "@micromag/core": "^0.4.55",
-        "@micromag/element-closed-captions": "^0.4.55",
+        "@micromag/core": "^0.4.63",
+        "@micromag/element-closed-captions": "^0.4.63",
         "classnames": "^2.2.6",
         "hls.js": "^1.5.15",
         "lodash": "^4.17.23",
@@ -72,6 +72,6 @@
         "access": "public",
         "registry": "https://registry.npmjs.org/"
     },
-    "gitHead": "9708f0016de0cf18dcd6a6aa5bc70d7f00b86d9f",
+    "gitHead": "0a6df1a5352c067c3296377d26fadb9b71244345",
     "types": "es/index.d.ts"
 }