@geekapps/silo-elements-nextjs 0.2.47 → 0.2.49

package/dist/VideoPlayer.d.ts

@@ -9,7 +9,13 @@ type SourceProps = {
     default?: boolean;
 };
 type CaptionsProps = {
-    src: string;
+    src?: string;
+    data?: Array<{
+        src: string;
+        srclang: string;
+        label: string;
+        default?: boolean;
+    }>;
 };
 type ThumbnailProps = {
     src: string;

package/dist/VideoPlayer.js

@@ -43,22 +43,33 @@ function Video({
   const [captions, setCaptions] = useState([]);
   const [poster, setPoster] = useState(void 0);
   useEffect(() => {
+    function applyResolved(data) {
+      const resolved = data.map((c, i) => ({ ...c, default: c.default ?? i === 0 }));
+      setCaptions(resolved);
+      const defaultTrack = resolved.find((c) => c.default);
+      if (defaultTrack) {
+        setSubtitleMode(defaultTrack.srclang);
+        setSubtitleStyle((st) => ({ ...st, track: defaultTrack.srclang }));
+      }
+    }
+    if (parsed.captionsData) {
+      applyResolved(parsed.captionsData);
+      return;
+    }
     if (!parsed.captionsSrc) {
       setCaptions([]);
       return;
     }
     let cancelled = false;
     fetch(parsed.captionsSrc, { cache: "no-store" }).then((r) => r.json()).then((data) => {
-      if (!cancelled && Array.isArray(data)) {
-        setCaptions(data.map((c, i) => ({ ...c, default: i === 0 })));
-      }
+      if (!cancelled && Array.isArray(data)) applyResolved(data);
     }).catch(() => {
       if (!cancelled) setCaptions([]);
     });
     return () => {
       cancelled = true;
     };
-  }, [parsed.captionsSrc]);
+  }, [parsed.captionsSrc, parsed.captionsData]);
   useEffect(() => {
     if (!parsed.thumbnailSrc) {
       setPoster(void 0);
@@ -182,12 +193,6 @@ function Video({
       setSubtitleMode(initialSubtitleMode);
     }
   }, [subtitleMode, captions, initialSubtitleMode]);
-  useEffect(() => {
-    if (subtitleMode === "off" && initialSubtitleMode !== "off") {
-      setSubtitleMode(initialSubtitleMode);
-      setSubtitleStyle((st) => ({ ...st, track: initialSubtitleMode }));
-    }
-  }, [initialSubtitleMode]);
   useEffect(() => {
     const video = videoRef.current;
     if (!video) return;
@@ -1630,7 +1635,11 @@ function parseVideoChildren(children) {
     }
     if (child.type === Captions || name === "SiloCaptions") {
       const element = child;
-      parsed.captionsSrc = element.props.src;
+      if (element.props.data) {
+        parsed.captionsData = element.props.data;
+      } else if (element.props.src) {
+        parsed.captionsSrc = element.props.src;
+      }
     }
     if (child.type === VideoThumbnail || name === "SiloVideoThumbnail") {
       const element = child;