@vanillaskyai/video 0.10.7 → 0.10.8

package/dist/chunk-X4RGAEL5.js

@@ -1,207 +0,0 @@
-import {
-  BrandGradientOverlay,
-  SceneVideoBackdrop,
-  getBackgroundTransform,
-  resolveMediaPosition
-} from "./chunk-OBRKB7PL.js";
-import {
-  resolveMediaType
-} from "./chunk-224QNWRA.js";
-import {
-  useExternalVideoBackdrop
-} from "./chunk-OOBT4X46.js";
-
-// src/visual-system/scene-templates/scene-background.tsx
-import { useEffect, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-function resolveMediaTreatment(value) {
-  return value === "none" || value === "subtle" || value === "text-safe" ? value : "cinematic";
-}
-var SCRIM_STOP_COUNT = 7;
-function smoothstep(t) {
-  return t * t * (3 - 2 * t);
-}
-function easedStops(peakAlpha, start, end, direction) {
-  const alphaAt = (t) => {
-    const eased = direction === "fade-out" ? 1 - smoothstep(t) : smoothstep(t);
-    return `rgba(0,0,0,${Number((peakAlpha * eased).toFixed(3))})`;
-  };
-  const stops = [];
-  if (start > 0) stops.push(`${alphaAt(0)} 0%`);
-  for (let i = 0; i < SCRIM_STOP_COUNT; i += 1) {
-    const t = i / (SCRIM_STOP_COUNT - 1);
-    const position = Number((start + (end - start) * t).toFixed(2));
-    stops.push(`${alphaAt(t)} ${position}%`);
-  }
-  if (end < 100) stops.push(`${alphaAt(1)} 100%`);
-  return stops.join(", ");
-}
-function getMediaTreatmentLayers(value, anchor = "full") {
-  const treatment = resolveMediaTreatment(value);
-  if (treatment === "none") return [];
-  const vignette = {
-    id: "vignette",
-    background: treatment === "subtle" ? `radial-gradient(ellipse at center, ${easedStops(0.28, 45, 100, "fade-in")})` : `radial-gradient(ellipse at center, ${easedStops(0.72, 32, 100, "fade-in")})`
-  };
-  if (treatment === "subtle") return [vignette];
-  const textSafe = treatment === "text-safe";
-  const layers = [vignette];
-  if (anchor !== "bottom") {
-    layers.push({
-      id: "center-scrim",
-      background: textSafe ? `radial-gradient(ellipse 92% 58% at 50% 50%, ${easedStops(0.46, 34, 90, "fade-out")})` : `radial-gradient(ellipse 88% 52% at 50% 50%, ${easedStops(0.26, 30, 88, "fade-out")})`
-    });
-  }
-  if (anchor !== "center") {
-    layers.push({
-      id: "bottom-scrim",
-      background: `linear-gradient(to top, ${easedStops(textSafe ? 0.64 : 0.5, 8, 100, "fade-out")})`,
-      style: { top: "55%" }
-    });
-  }
-  return layers;
-}
-function initialMediaPaint(wantsMedia, resolved, mediaUrl, mediaPoster) {
-  if (typeof window === "undefined") return "ready";
-  if (!wantsMedia) return "ready";
-  if (resolved === "video") return mediaPoster ? "ready" : "pending";
-  if (typeof Image === "undefined") return "ready";
-  const cached = new Image();
-  cached.src = mediaUrl;
-  return cached.complete && cached.naturalWidth > 0 ? "ready" : "pending";
-}
-function getMediaBackgroundProps(variables) {
-  return {
-    mediaUrl: String(variables.mediaUrl || ""),
-    mediaType: String(variables.mediaType || "auto"),
-    mediaPoster: String(variables.mediaPoster || ""),
-    mediaPosition: String(variables.mediaPosition || "center"),
-    mediaTreatment: String(variables.mediaTreatment || "cinematic")
-  };
-}
-var SceneBackground = ({
-  style,
-  progress,
-  sceneDuration,
-  width: _width,
-  // accepted for symmetry; not currently used in render
-  height: _height,
-  mediaUrl = "",
-  mediaType = "auto",
-  mediaPoster,
-  mediaPosition = "center",
-  mediaTreatment = "cinematic",
-  textAnchor = "full",
-  backgroundEffect,
-  seed,
-  isPlaying = true,
-  beatIntensity = 0
-}) => {
-  void _width;
-  void _height;
-  const resolved = resolveMediaType(mediaType, mediaUrl);
-  const wantsMedia = resolved !== "gradient" && !!mediaUrl;
-  const externalVideoBackdrop = useExternalVideoBackdrop();
-  const hasExternalVideoBackdrop = externalVideoBackdrop !== false && resolved === "video";
-  const externalVideoFailed = externalVideoBackdrop === "fallback" && resolved === "video";
-  const externalVideoReady = externalVideoBackdrop === "ready" && resolved === "video";
-  const [mediaPaint, setMediaPaint] = useState(
-    () => initialMediaPaint(wantsMedia, resolved, mediaUrl, mediaPoster)
-  );
-  useEffect(() => {
-    setMediaPaint(initialMediaPaint(wantsMedia, resolved, mediaUrl, mediaPoster));
-    if (!wantsMedia || resolved !== "photo") return;
-    if (typeof Image === "undefined") return;
-    let cancelled = false;
-    const probe = new Image();
-    probe.onload = () => {
-      if (!cancelled) setMediaPaint("ready");
-    };
-    probe.onerror = () => {
-      if (!cancelled) setMediaPaint("failed");
-    };
-    probe.src = mediaUrl;
-    if (probe.complete) setMediaPaint(probe.naturalWidth > 0 ? "ready" : "failed");
-    return () => {
-      cancelled = true;
-      probe.onload = null;
-      probe.onerror = null;
-    };
-  }, [mediaUrl, mediaPoster, resolved, wantsMedia]);
-  const showMedia = wantsMedia && mediaPaint !== "failed";
-  const showTreatment = wantsMedia && mediaPaint === "ready";
-  const resolvedPosition = resolveMediaPosition(mediaPosition);
-  const resolvedTreatment = resolveMediaTreatment(mediaTreatment);
-  const treatmentLayers = getMediaTreatmentLayers(resolvedTreatment, textAnchor);
-  const gradSeed = typeof seed === "number" ? seed : typeof seed === "string" ? seed.split("").reduce((acc, c) => acc + c.charCodeAt(0), 0) : 0;
-  const bgTransform = getBackgroundTransform(
-    backgroundEffect,
-    progress,
-    beatIntensity
-  );
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    (!hasExternalVideoBackdrop || externalVideoFailed) && /* @__PURE__ */ jsx(
-      BrandGradientOverlay,
-      {
-        style,
-        progress,
-        sceneDuration,
-        seed: gradSeed
-      }
-    ),
-    showMedia && !hasExternalVideoBackdrop && (resolved === "video" ? /* @__PURE__ */ jsx(
-      SceneVideoBackdrop,
-      {
-        mediaUrl,
-        mediaPoster,
-        mediaPosition,
-        backgroundEffect,
-        progress,
-        sceneDuration,
-        beatIntensity,
-        isPlaying,
-        onReady: () => setMediaPaint("ready"),
-        onError: () => setMediaPaint("failed")
-      }
-    ) : /* @__PURE__ */ jsx(
-      "img",
-      {
-        src: mediaUrl,
-        alt: "",
-        "aria-hidden": "true",
-        draggable: false,
-        "data-media-position": mediaPosition,
-        style: {
-          position: "absolute",
-          inset: 0,
-          transform: bgTransform.transform,
-          transformOrigin: bgTransform.transformOrigin,
-          width: "100%",
-          height: "100%",
-          objectFit: "cover",
-          objectPosition: resolvedPosition
-        }
-      }
-    )),
-    (hasExternalVideoBackdrop ? externalVideoReady : showTreatment) && !externalVideoFailed && treatmentLayers.map((layer) => /* @__PURE__ */ jsx(
-      "div",
-      {
-        "data-media-treatment": resolvedTreatment,
-        "data-media-overlay": layer.id,
-        style: {
-          position: "absolute",
-          inset: 0,
-          background: layer.background,
-          pointerEvents: "none",
-          ...layer.style
-        }
-      },
-      layer.id
-    ))
-  ] });
-};
-
-export {
-  getMediaBackgroundProps,
-  SceneBackground
-};

package/dist/scene-video-backdrop-NK2XK3XE.js

@@ -1,7 +0,0 @@
-import {
-  SceneVideoBackdrop
-} from "./chunk-OBRKB7PL.js";
-import "./chunk-OOBT4X46.js";
-export {
-  SceneVideoBackdrop
-};

package/dist/{chunk-OOBT4X46.js → chunk-5JBMYQP6.js}

@@ -1,37 +1,3 @@
-// src/visual-system/scene-templates/external-video-backdrop.tsx
-import React from "react";
-import { jsx } from "react/jsx-runtime";
-var DEFAULT = { mode: false, audioMuted: true, audioVolume: 1 };
-var sharedContext = globalThis;
-var BackdropContext = sharedContext.__vanillaskyVideoBackdropContext ??= React.createContext(DEFAULT);
-function ExternalVideoBackdropProvider({
-  mode,
-  audioMuted = true,
-  audioVolume = 1,
-  preparingNarration = false,
-  onMediaError,
-  children
-}) {
-  const value = React.useMemo(
-    () => ({ mode, audioMuted, audioVolume, preparingNarration, onMediaError }),
-    [mode, audioMuted, audioVolume, preparingNarration, onMediaError]
-  );
-  return /* @__PURE__ */ jsx(BackdropContext.Provider, { value, children });
-}
-function useExternalVideoBackdrop() {
-  return React.useContext(BackdropContext).mode;
-}
-function useMediaAudio() {
-  const { audioMuted, audioVolume } = React.useContext(BackdropContext);
-  return { muted: audioMuted, volume: audioVolume };
-}
-function useNarrationPreroll() {
-  return React.useContext(BackdropContext).preparingNarration === true;
-}
-function useMediaFailure() {
-  return React.useContext(BackdropContext).onMediaError;
-}
-
 // src/visual-system/scene-templates/tokens.ts
 var STYLE_PRESETS = {
   bold: {
@@ -144,6 +110,40 @@ function darken(hex, factor) {
   return `#${ch(1)}${ch(3)}${ch(5)}`;
 }
 
+// src/visual-system/scene-templates/external-video-backdrop.tsx
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+var DEFAULT = { mode: false, audioMuted: true, audioVolume: 1 };
+var sharedContext = globalThis;
+var BackdropContext = sharedContext.__vanillaskyVideoBackdropContext ??= React.createContext(DEFAULT);
+function ExternalVideoBackdropProvider({
+  mode,
+  audioMuted = true,
+  audioVolume = 1,
+  preparingNarration = false,
+  onMediaError,
+  children
+}) {
+  const value = React.useMemo(
+    () => ({ mode, audioMuted, audioVolume, preparingNarration, onMediaError }),
+    [mode, audioMuted, audioVolume, preparingNarration, onMediaError]
+  );
+  return /* @__PURE__ */ jsx(BackdropContext.Provider, { value, children });
+}
+function useExternalVideoBackdrop() {
+  return React.useContext(BackdropContext).mode;
+}
+function useMediaAudio() {
+  const { audioMuted, audioVolume } = React.useContext(BackdropContext);
+  return { muted: audioMuted, volume: audioVolume };
+}
+function useNarrationPreroll() {
+  return React.useContext(BackdropContext).preparingNarration === true;
+}
+function useMediaFailure() {
+  return React.useContext(BackdropContext).onMediaError;
+}
+
 export {
   resolveDensity,
   resolveTokens,