@hanifhan1f/vidstack-react 1.12.13 → 1.12.15

package/server/chunks/vidstack-Dm1xEU9Q.js

@@ -0,0 +1,36 @@
+"use client"
+
+const videoIdRE = /(?:youtu\.be|youtube|youtube\.com|youtube-nocookie\.com)(?:\/shorts)?\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=|)((?:\w|-){11})/;
+const posterCache = /* @__PURE__ */ new Map();
+const pendingFetch = /* @__PURE__ */ new Map();
+function resolveYouTubeVideoId(src) {
+  return src.match(videoIdRE)?.[1];
+}
+async function findYouTubePoster(videoId, abort) {
+  if (posterCache.has(videoId)) return posterCache.get(videoId);
+  if (pendingFetch.has(videoId)) return pendingFetch.get(videoId);
+  const pending = new Promise(async (resolve) => {
+    const sizes = ["maxresdefault", "sddefault", "hqdefault"];
+    for (const size of sizes) {
+      for (const webp of [true, false]) {
+        const url = resolveYouTubePosterURL(videoId, size, webp), response = await fetch(url, {
+          mode: "no-cors",
+          signal: abort.signal
+        });
+        if (response.status < 400) {
+          posterCache.set(videoId, url);
+          resolve(url);
+          return;
+        }
+      }
+    }
+  }).catch(() => "").finally(() => pendingFetch.delete(videoId));
+  pendingFetch.set(videoId, pending);
+  return pending;
+}
+function resolveYouTubePosterURL(videoId, size, webp) {
+  const type = webp ? "webp" : "jpg";
+  return `https://i.ytimg.com/${webp ? "vi_webp" : "vi"}/${videoId}/${size}.${type}`;
+}
+
+export { findYouTubePoster, resolveYouTubeVideoId };

package/server/chunks/vidstack-DtQSvsQr.js

@@ -0,0 +1,189 @@
+"use client"
+
+import * as React from 'react';
+import { RadioGroupController, useMediaContext, menuContext, MediaRemoteControl, MediaPlayerInstance, sortVideoQualities } from './vidstack-Cm0qnRvu.js';
+import { useMediaContext as useMediaContext$1 } from './vidstack-CoGzBr_V.js';
+import { prop, method, Component, hasProvidedContext, useContext, effect, useSignal, isString } from './vidstack-D_bWd66h.js';
+
+const DEFAULT_PLAYBACK_RATES = [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2];
+class SpeedRadioGroup extends Component {
+  static props = {
+    normalLabel: "Normal",
+    rates: DEFAULT_PLAYBACK_RATES
+  };
+  #media;
+  #menu;
+  #controller;
+  get value() {
+    return this.#controller.value;
+  }
+  get disabled() {
+    const { rates } = this.$props, { canSetPlaybackRate } = this.#media.$state;
+    return !canSetPlaybackRate() || rates().length === 0;
+  }
+  constructor() {
+    super();
+    this.#controller = new RadioGroupController();
+    this.#controller.onValueChange = this.#onValueChange.bind(this);
+  }
+  onSetup() {
+    this.#media = useMediaContext();
+    if (hasProvidedContext(menuContext)) {
+      this.#menu = useContext(menuContext);
+    }
+  }
+  onConnect(el) {
+    effect(this.#watchValue.bind(this));
+    effect(this.#watchHintText.bind(this));
+    effect(this.#watchControllerDisabled.bind(this));
+  }
+  getOptions() {
+    const { rates, normalLabel } = this.$props;
+    return rates().map((rate) => ({
+      label: rate === 1 ? normalLabel : rate + "\xD7",
+      value: rate.toString()
+    }));
+  }
+  #watchValue() {
+    this.#controller.value = this.#getValue();
+  }
+  #watchHintText() {
+    const { normalLabel } = this.$props, { playbackRate } = this.#media.$state, rate = playbackRate();
+    this.#menu?.hint.set(rate === 1 ? normalLabel() : rate + "\xD7");
+  }
+  #watchControllerDisabled() {
+    this.#menu?.disable(this.disabled);
+  }
+  #getValue() {
+    const { playbackRate } = this.#media.$state;
+    return playbackRate().toString();
+  }
+  #onValueChange(value, trigger) {
+    if (this.disabled) return;
+    const rate = +value;
+    this.#media.remote.changePlaybackRate(rate, trigger);
+    this.dispatch("change", { detail: rate, trigger });
+  }
+}
+const speedradiogroup__proto = SpeedRadioGroup.prototype;
+prop(speedradiogroup__proto, "value");
+prop(speedradiogroup__proto, "disabled");
+method(speedradiogroup__proto, "getOptions");
+
+function useMediaRemote(target) {
+  const media = useMediaContext$1(), remote = React.useRef(null);
+  if (!remote.current) {
+    remote.current = new MediaRemoteControl();
+  }
+  React.useEffect(() => {
+    const ref = target && "current" in target ? target.current : target, isPlayerRef = ref instanceof MediaPlayerInstance, player = isPlayerRef ? ref : media?.player;
+    remote.current.setPlayer(player ?? null);
+    remote.current.setTarget(ref ?? null);
+  }, [media, target && "current" in target ? target.current : target]);
+  return remote.current;
+}
+
+function useVideoQualityOptions({
+  auto = true,
+  sort = "descending"
+} = {}) {
+  const media = useMediaContext$1(), { qualities, quality, autoQuality, canSetQuality } = media.$state, $qualities = useSignal(qualities);
+  useSignal(quality);
+  useSignal(autoQuality);
+  useSignal(canSetQuality);
+  return React.useMemo(() => {
+    const sortedQualities = sortVideoQualities($qualities, sort === "descending"), options = sortedQualities.map((q) => {
+      return {
+        quality: q,
+        label: q.height + "p",
+        value: getQualityValue(q),
+        bitrateText: q.bitrate && q.bitrate > 0 ? `${(q.bitrate / 1e6).toFixed(2)} Mbps` : null,
+        get selected() {
+          return q === quality();
+        },
+        get autoSelected() {
+          return autoQuality();
+        },
+        select(trigger) {
+          const index = qualities().indexOf(q);
+          if (index >= 0) media.remote.changeQuality(index, trigger);
+        }
+      };
+    });
+    if (auto) {
+      options.unshift({
+        quality: null,
+        label: isString(auto) ? auto : "Auto",
+        value: "auto",
+        bitrateText: null,
+        get selected() {
+          return autoQuality();
+        },
+        get autoSelected() {
+          return autoQuality();
+        },
+        select(trigger) {
+          media.remote.requestAutoQuality(trigger);
+        }
+      });
+    }
+    Object.defineProperty(options, "disabled", {
+      get() {
+        return !canSetQuality() || $qualities.length <= 1;
+      }
+    });
+    Object.defineProperty(options, "selectedQuality", {
+      get() {
+        return quality();
+      }
+    });
+    Object.defineProperty(options, "selectedValue", {
+      get() {
+        const $quality = quality();
+        return !autoQuality() && $quality ? getQualityValue($quality) : "auto";
+      }
+    });
+    return options;
+  }, [$qualities, sort]);
+}
+function getQualityValue(quality) {
+  return quality.height + "_" + quality.bitrate;
+}
+
+function usePlaybackRateOptions({
+  rates = DEFAULT_PLAYBACK_RATES,
+  normalLabel = "Normal"
+} = {}) {
+  const media = useMediaContext$1(), { playbackRate, canSetPlaybackRate } = media.$state;
+  useSignal(playbackRate);
+  useSignal(canSetPlaybackRate);
+  return React.useMemo(() => {
+    const options = rates.map((opt) => {
+      const label = typeof opt === "number" ? opt === 1 && normalLabel ? normalLabel : opt + "x" : opt.label, rate = typeof opt === "number" ? opt : opt.rate;
+      return {
+        label,
+        value: rate.toString(),
+        rate,
+        get selected() {
+          return playbackRate() === rate;
+        },
+        select(trigger) {
+          media.remote.changePlaybackRate(rate, trigger);
+        }
+      };
+    });
+    Object.defineProperty(options, "disabled", {
+      get() {
+        return !canSetPlaybackRate() || !options.length;
+      }
+    });
+    Object.defineProperty(options, "selectedValue", {
+      get() {
+        return playbackRate().toString();
+      }
+    });
+    return options;
+  }, [rates]);
+}
+
+export { DEFAULT_PLAYBACK_RATES, useMediaRemote, usePlaybackRateOptions, useVideoQualityOptions };

package/server/chunks/vidstack-jlaBqZq5.js

@@ -0,0 +1,61 @@
+"use client"
+
+import { appendParamsToURL, IS_SERVER } from './vidstack-Cm0qnRvu.js';
+import { signal, listenEvent, effect, peek, isString } from './vidstack-D_bWd66h.js';
+
+class EmbedProvider {
+  #iframe;
+  src = signal("");
+  /**
+   * Defines which referrer is sent when fetching the resource.
+   *
+   * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement/referrerPolicy}
+   */
+  referrerPolicy = null;
+  get iframe() {
+    return this.#iframe;
+  }
+  constructor(iframe) {
+    this.#iframe = iframe;
+    iframe.setAttribute("frameBorder", "0");
+    iframe.setAttribute("aria-hidden", "true");
+    iframe.setAttribute(
+      "allow",
+      "autoplay; fullscreen; encrypted-media; picture-in-picture; accelerometer; gyroscope"
+    );
+    if (this.referrerPolicy !== null) {
+      iframe.setAttribute("referrerpolicy", this.referrerPolicy);
+    }
+  }
+  setup() {
+    listenEvent(window, "message", this.#onWindowMessage.bind(this));
+    listenEvent(this.#iframe, "load", this.onLoad.bind(this));
+    effect(this.#watchSrc.bind(this));
+  }
+  #watchSrc() {
+    const src = this.src();
+    if (!src.length) {
+      this.#iframe.setAttribute("src", "");
+      return;
+    }
+    const params = peek(() => this.buildParams());
+    this.#iframe.setAttribute("src", appendParamsToURL(src, params));
+  }
+  postMessage(message, target) {
+    if (IS_SERVER) return;
+    this.#iframe.contentWindow?.postMessage(JSON.stringify(message), target ?? "*");
+  }
+  #onWindowMessage(event) {
+    const origin = this.getOrigin(), isOriginMatch = (event.source === null || event.source === this.#iframe?.contentWindow) && (!isString(origin) || origin === event.origin);
+    if (!isOriginMatch) return;
+    try {
+      const message = JSON.parse(event.data);
+      if (message) this.onMessage(message, event);
+      return;
+    } catch (e) {
+    }
+    if (event.data) this.onMessage(event.data, event);
+  }
+}
+
+export { EmbedProvider };

package/server/chunks/vidstack-krOAtKMi.js

@@ -0,0 +1,34 @@
+"use client"
+
+const videoIdRE = /(?:https:\/\/)?(?:player\.)?vimeo(?:\.com)?\/(?:video\/)?(\d+)(?:(?:\?hash=|\?h=|\/)(.*))?/;
+const infoCache = /* @__PURE__ */ new Map();
+const pendingFetch = /* @__PURE__ */ new Map();
+function resolveVimeoVideoId(src) {
+  const matches = src.match(videoIdRE);
+  return { videoId: matches?.[1], hash: matches?.[2] };
+}
+async function getVimeoVideoInfo(videoId, abort, videoHash) {
+  if (infoCache.has(videoId)) return infoCache.get(videoId);
+  if (pendingFetch.has(videoId)) return pendingFetch.get(videoId);
+  let oembedSrc = `https://vimeo.com/api/oembed.json?url=https://player.vimeo.com/video/${videoId}`;
+  if (videoHash) {
+    oembedSrc = oembedSrc.concat(`?h=${videoHash}`);
+  }
+  const promise = window.fetch(oembedSrc, {
+    mode: "cors",
+    signal: abort.signal
+  }).then((response) => response.json()).then((data) => {
+    const thumnailRegex = /vimeocdn.com\/video\/(.*)?_/, thumbnailId = data?.thumbnail_url?.match(thumnailRegex)?.[1], poster = thumbnailId ? `https://i.vimeocdn.com/video/${thumbnailId}_1920x1080.webp` : "", info = {
+      title: data?.title ?? "",
+      duration: data?.duration ?? 0,
+      poster,
+      pro: data.account_type !== "basic"
+    };
+    infoCache.set(videoId, info);
+    return info;
+  }).finally(() => pendingFetch.delete(videoId));
+  pendingFetch.set(videoId, promise);
+  return promise;
+}
+
+export { getVimeoVideoInfo, resolveVimeoVideoId };

package/server/chunks/vidstack-rWs25cS9.js

@@ -0,0 +1,159 @@
+"use client"
+
+import { IS_CHROME, IS_IOS, canGoogleCastSrc, IS_SERVER, loadScript } from './vidstack-Cm0qnRvu.js';
+import { listenEvent, peek } from './vidstack-D_bWd66h.js';
+
+function getCastFrameworkURL() {
+  return "https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1";
+}
+function hasLoadedCastFramework() {
+  return !!window.cast?.framework;
+}
+function isCastAvailable() {
+  return !!window.chrome?.cast?.isAvailable;
+}
+function isCastConnected() {
+  return getCastContext().getCastState() === cast.framework.CastState.CONNECTED;
+}
+function getCastContext() {
+  return window.cast.framework.CastContext.getInstance();
+}
+function getCastSession() {
+  return getCastContext().getCurrentSession();
+}
+function getCastSessionMedia() {
+  return getCastSession()?.getSessionObj().media[0];
+}
+function hasActiveCastSession(src) {
+  const contentId = getCastSessionMedia()?.media.contentId;
+  return contentId === src?.src;
+}
+function getDefaultCastOptions() {
+  return {
+    language: "en-US",
+    autoJoinPolicy: chrome.cast.AutoJoinPolicy.ORIGIN_SCOPED,
+    receiverApplicationId: chrome.cast.media.DEFAULT_MEDIA_RECEIVER_APP_ID,
+    resumeSavedSession: true,
+    androidReceiverCompatible: true
+  };
+}
+function getCastErrorMessage(code) {
+  const defaultMessage = `Google Cast Error Code: ${code}`;
+  return defaultMessage;
+}
+function listenCastContextEvent(type, handler) {
+  return listenEvent(getCastContext(), type, handler);
+}
+
+class GoogleCastLoader {
+  name = "google-cast";
+  target;
+  #player;
+  /**
+   * @see {@link https://developers.google.com/cast/docs/reference/web_sender/cast.framework.CastContext}
+   */
+  get cast() {
+    return getCastContext();
+  }
+  mediaType() {
+    return "video";
+  }
+  canPlay(src) {
+    return IS_CHROME && !IS_IOS && canGoogleCastSrc(src);
+  }
+  async prompt(ctx) {
+    let loadEvent, openEvent, errorEvent;
+    try {
+      loadEvent = await this.#loadCastFramework(ctx);
+      if (!this.#player) {
+        this.#player = new cast.framework.RemotePlayer();
+        new cast.framework.RemotePlayerController(this.#player);
+      }
+      openEvent = ctx.player.createEvent("google-cast-prompt-open", {
+        trigger: loadEvent
+      });
+      ctx.player.dispatchEvent(openEvent);
+      this.#notifyRemoteStateChange(ctx, "connecting", openEvent);
+      await this.#showPrompt(peek(ctx.$props.googleCast));
+      ctx.$state.remotePlaybackInfo.set({
+        deviceName: getCastSession()?.getCastDevice().friendlyName
+      });
+      if (isCastConnected()) this.#notifyRemoteStateChange(ctx, "connected", openEvent);
+    } catch (code) {
+      const error = code instanceof Error ? code : this.#createError(
+        (code + "").toUpperCase(),
+        "Prompt failed."
+      );
+      errorEvent = ctx.player.createEvent("google-cast-prompt-error", {
+        detail: error,
+        trigger: openEvent ?? loadEvent,
+        cancelable: true
+      });
+      ctx.player.dispatch(errorEvent);
+      this.#notifyRemoteStateChange(
+        ctx,
+        isCastConnected() ? "connected" : "disconnected",
+        errorEvent
+      );
+      throw error;
+    } finally {
+      ctx.player.dispatch("google-cast-prompt-close", {
+        trigger: errorEvent ?? openEvent ?? loadEvent
+      });
+    }
+  }
+  async load(ctx) {
+    if (IS_SERVER) {
+      throw Error("[vidstack] can not load google cast provider server-side");
+    }
+    if (!this.#player) {
+      throw Error("[vidstack] google cast player was not initialized");
+    }
+    return new (await import('./vidstack-CyFwkPiu.js')).GoogleCastProvider(this.#player, ctx);
+  }
+  async #loadCastFramework(ctx) {
+    if (hasLoadedCastFramework()) return;
+    const loadStartEvent = ctx.player.createEvent("google-cast-load-start");
+    ctx.player.dispatch(loadStartEvent);
+    await loadScript(getCastFrameworkURL());
+    await customElements.whenDefined("google-cast-launcher");
+    const loadedEvent = ctx.player.createEvent("google-cast-loaded", { trigger: loadStartEvent });
+    ctx.player.dispatch(loadedEvent);
+    if (!isCastAvailable()) {
+      throw this.#createError("CAST_NOT_AVAILABLE", "Google Cast not available on this platform.");
+    }
+    return loadedEvent;
+  }
+  async #showPrompt(options) {
+    this.#setOptions(options);
+    const errorCode = await this.cast.requestSession();
+    if (errorCode) {
+      throw this.#createError(
+        errorCode.toUpperCase(),
+        getCastErrorMessage(errorCode)
+      );
+    }
+  }
+  #setOptions(options) {
+    this.cast?.setOptions({
+      ...getDefaultCastOptions(),
+      ...options
+    });
+  }
+  #notifyRemoteStateChange(ctx, state, trigger) {
+    const detail = { type: "google-cast", state };
+    ctx.notify("remote-playback-change", detail, trigger);
+  }
+  #createError(code, message) {
+    const error = Error(message);
+    error.code = code;
+    return error;
+  }
+}
+
+var loader = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  GoogleCastLoader: GoogleCastLoader
+});
+
+export { getCastContext, getCastErrorMessage, getCastSession, getCastSessionMedia, hasActiveCastSession, listenCastContextEvent, loader };