@vanillaskyai/video 0.8.8 → 0.9.0

package/dist/chunk-77VY4O7A.js

@@ -0,0 +1,390 @@
+import {
+  darken,
+  resolveTokens,
+  useMediaAudio
+} from "./chunk-TVIU23OM.js";
+
+// src/visual-system/scene-templates/scene-video-backdrop.tsx
+import { useEffect, useRef, useState } from "react";
+
+// src/visual-system/scene-templates/color-utils.ts
+import React from "react";
+
+// src/visual-system/theme/colors.ts
+function orderDarkToLight(a, b) {
+  const luminance = (hex) => {
+    const match = hex.match(/^#([0-9a-f]{6})$/i);
+    if (!match) return 0;
+    const h = match[1];
+    return 0.299 * parseInt(h.slice(0, 2), 16) + 0.587 * parseInt(h.slice(2, 4), 16) + 0.114 * parseInt(h.slice(4, 6), 16);
+  };
+  return luminance(a) <= luminance(b) ? [a, b] : [b, a];
+}
+
+// src/visual-system/scene-templates/color-utils.ts
+function gradientBackground({
+  colorA,
+  colorB,
+  solidBg,
+  progress,
+  sceneDuration,
+  seed,
+  family
+}) {
+  if (solidBg) return solidBg;
+  const normalizedProgress = Math.max(0, Math.min(1, progress));
+  const atBoundary = normalizedProgress === 0 || normalizedProgress === 1;
+  const easedLoop = normalizedProgress * normalizedProgress * (3 - 2 * normalizedProgress);
+  const seedEnvelope = atBoundary ? 0 : Math.sin(normalizedProgress * Math.PI) ** 2;
+  void sceneDuration;
+  const seededRandom = (s) => {
+    const x = Math.sin(s * 12.9898 + s * 78.233) * 43758.5453;
+    return x - Math.floor(x);
+  };
+  const phase = seededRandom(seed) * Math.PI * 2 * seedEnvelope;
+  const t = (atBoundary ? 0 : easedLoop * Math.PI * 2) + phase;
+  const [topColor, bottomColor] = orderDarkToLight(colorA, colorB);
+  if (family === "wash") {
+    const shift = Math.sin(t) * 6;
+    return `linear-gradient(${175 + shift}deg, ${topColor} 0%, ${bottomColor} 100%)`;
+  }
+  if (family === "spotlight") {
+    const x = 50 + Math.sin(t) * 8;
+    const y = 28 + Math.cos(t + 1) * 5;
+    return `
+      radial-gradient(ellipse 70% 55% at ${x}% ${y}%, ${colorA}66 0%, ${colorA}1a 45%, transparent 72%),
+      linear-gradient(180deg, ${darken(topColor, 0.55)} 0%, ${darken(bottomColor, 0.7)} 100%)
+    `;
+  }
+  const x1 = 25 + Math.sin(t) * 25;
+  const y1 = 30 + Math.cos(t + 1) * 25;
+  const x2 = 75 + Math.sin(t + 2) * 25;
+  const y2 = 70 + Math.cos(t + 3.5) * 25;
+  return `
+    radial-gradient(ellipse 60% 60% at ${x1}% ${y1}%, ${colorA}4d 0%, transparent 65%),
+    radial-gradient(ellipse 60% 60% at ${x2}% ${y2}%, ${colorB}4d 0%, transparent 65%),
+    linear-gradient(180deg, ${topColor} 0%, ${bottomColor} 100%)
+  `;
+}
+var BrandGradientOverlay = ({ style: globalStyle, progress, sceneDuration, seed }) => {
+  const tokens = resolveTokens(globalStyle);
+  const [first, second] = tokens.background.type === "gradient" ? tokens.background.colors : [tokens.background.color, tokens.background.color];
+  const solidBg = tokens.background.type === "solid" ? tokens.background.color : void 0;
+  return React.createElement("div", {
+    "data-brand-gradient": "true",
+    style: {
+      position: "absolute",
+      inset: 0,
+      background: gradientBackground({ colorA: first, colorB: second, solidBg, progress, sceneDuration, seed, family: tokens.preset.background }),
+      pointerEvents: "none"
+    }
+  });
+};
+
+// src/visual-system/motion/curves.ts
+function interpolate(value, inputRange, outputRange, options) {
+  const { easing, extrapolateLeft = "extend", extrapolateRight = "extend" } = options ?? {};
+  let i = 0;
+  for (; i < inputRange.length - 2; i++) {
+    if (value < inputRange[i + 1]) break;
+  }
+  const inputMin = inputRange[i];
+  const inputMax = inputRange[i + 1];
+  const outputMin = outputRange[i];
+  const outputMax = outputRange[i + 1];
+  let t = inputMax === inputMin ? 0 : (value - inputMin) / (inputMax - inputMin);
+  if (t < 0 && extrapolateLeft === "clamp") t = 0;
+  if (t > 1 && extrapolateRight === "clamp") t = 1;
+  if (easing && t >= 0 && t <= 1) {
+    t = easing(t);
+  }
+  return outputMin + t * (outputMax - outputMin);
+}
+function spring(progress, config) {
+  if (progress <= 0) return 0;
+  if (progress >= 1) {
+    const { damping: damping2 = 26 } = config ?? {};
+    if (damping2 >= 20) return 1;
+  }
+  const { damping = 26, stiffness = 170, mass = 1 } = config ?? {};
+  const omega = Math.sqrt(stiffness / mass);
+  const zeta = damping / (2 * Math.sqrt(stiffness * mass));
+  const t = progress * 3.5;
+  let value;
+  if (zeta < 1) {
+    const omegaD = omega * Math.sqrt(1 - zeta * zeta);
+    value = 1 - Math.exp(-zeta * omega * t) * (Math.cos(omegaD * t) + zeta * omega / omegaD * Math.sin(omegaD * t));
+  } else if (zeta === 1) {
+    value = 1 - Math.exp(-omega * t) * (1 + omega * t);
+  } else {
+    const s1 = -omega * (zeta + Math.sqrt(zeta * zeta - 1));
+    const s2 = -omega * (zeta - Math.sqrt(zeta * zeta - 1));
+    value = 1 + (s1 * Math.exp(s2 * t) - s2 * Math.exp(s1 * t)) / (s2 - s1);
+  }
+  return value;
+}
+
+// src/visual-system/scene-templates/background-effect.ts
+var DIRECTIONS = ["right", "left", "up", "down"];
+function getKenBurnsTransform(progress, direction) {
+  const scale = interpolate(progress, [0, 1], [1.05, 1.15]);
+  const mainAxis = direction === "right" || direction === "left";
+  const sign = direction === "right" || direction === "down" ? 1 : -1;
+  const primary = interpolate(progress, [0, 1], [-2 * sign, 2 * sign]);
+  const secondary = interpolate(progress, [0, 1], [-0.5, 0.5]);
+  const x = mainAxis ? primary : secondary;
+  const y = mainAxis ? secondary : primary;
+  return {
+    transform: `scale(${scale}) translate(${x}%, ${y}%)`,
+    transformOrigin: "center"
+  };
+}
+function getDriftTransform(progress, direction) {
+  const horizontal = direction === "right" || direction === "left";
+  const sign = direction === "right" || direction === "down" ? 1 : -1;
+  const offset = interpolate(progress, [0, 1], [-2 * sign, 2 * sign]);
+  return {
+    transform: horizontal ? `scale(1.1) translateX(${offset}%)` : `scale(1.1) translateY(${offset}%)`,
+    transformOrigin: "center"
+  };
+}
+function getBackgroundTransform(effect, progress, beatIntensity = 0, sceneIndex = 0) {
+  const dir = DIRECTIONS[sceneIndex % DIRECTIONS.length];
+  const resolved = effect ?? "static";
+  switch (resolved) {
+    case "slow-zoom-in":
+      return {
+        transform: `scale(${interpolate(progress, [0, 1], [1, 1.12])})`,
+        transformOrigin: "center"
+      };
+    case "slow-zoom-out":
+      return {
+        transform: `scale(${interpolate(progress, [0, 1], [1.12, 1])})`,
+        transformOrigin: "center"
+      };
+    case "ken-burns":
+      return getKenBurnsTransform(progress, dir);
+    case "drift":
+      return getDriftTransform(progress, dir);
+    case "pulse": {
+      const base = 1 + beatIntensity * 0.04;
+      const breathe = 1 + Math.sin(progress * Math.PI * 2) * 0.02;
+      return {
+        transform: `scale(${base * breathe})`,
+        transformOrigin: "center"
+      };
+    }
+    case "breathe": {
+      const s = 1 + Math.sin(progress * Math.PI) * 0.03;
+      const y = Math.sin(progress * Math.PI) * 0.5;
+      return {
+        transform: `scale(${s}) translateY(${y}%)`,
+        transformOrigin: "center"
+      };
+    }
+    case "slow-tilt": {
+      const angle = interpolate(progress, [0, 1], [0, 2.5]);
+      return {
+        transform: `scale(1.08) rotate(${angle}deg)`,
+        transformOrigin: "center"
+      };
+    }
+    case "camera-shake": {
+      const t = progress * 40;
+      const sx = Math.sin(t * 2.3) * 0.4 + Math.sin(t * 5.7) * 0.2;
+      const sy = Math.cos(t * 3.1) * 0.3 + Math.cos(t * 4.9) * 0.15;
+      const sr = Math.sin(t * 1.7) * 0.3;
+      return {
+        transform: `scale(1.05) translate(${sx}%, ${sy}%) rotate(${sr}deg)`,
+        transformOrigin: "center"
+      };
+    }
+    case "static":
+    default:
+      return {
+        transform: "none",
+        transformOrigin: "center"
+      };
+  }
+}
+
+// src/visual-system/scene-templates/media-position.ts
+var MEDIA_POSITIONS = {
+  center: "center center",
+  top: "center top",
+  bottom: "center bottom",
+  left: "left center",
+  right: "right center"
+};
+function resolveMediaPosition(value) {
+  return MEDIA_POSITIONS[value] ?? MEDIA_POSITIONS.center;
+}
+
+// src/visual-system/scene-templates/scene-video-backdrop.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var SceneVideoBackdrop = ({
+  mediaUrl,
+  mediaPoster,
+  mediaPosition = "center",
+  backgroundEffect,
+  progress,
+  beatIntensity = 0,
+  isPlaying,
+  muted,
+  volume,
+  playbackId = mediaUrl,
+  retainPoster = false,
+  persistent = false,
+  preparedPoster,
+  onReady,
+  onError
+}) => {
+  const inheritedAudio = useMediaAudio();
+  const resolvedMuted = muted ?? inheritedAudio.muted;
+  const resolvedVolume = volume ?? inheritedAudio.volume;
+  const resolvedPosition = resolveMediaPosition(mediaPosition);
+  const bgTransform = getBackgroundTransform(backgroundEffect, progress, beatIntensity);
+  const [decodedVideoUrl, setDecodedVideoUrl] = useState();
+  const videoRef = useRef(null);
+  const startedVideoUrl = useRef(void 0);
+  const startedPlaybackId = useRef(void 0);
+  const videoPresentationKey = `${playbackId}\0${mediaUrl}`;
+  useEffect(() => {
+    const video = videoRef.current;
+    if (!video) return;
+    if (video.getAttribute("src") !== mediaUrl) {
+      video.setAttribute("src", mediaUrl);
+      video.load();
+    }
+    return () => {
+      video.pause();
+      video.removeAttribute("src");
+      video.load();
+      startedVideoUrl.current = void 0;
+      startedPlaybackId.current = void 0;
+    };
+  }, [mediaUrl]);
+  useEffect(() => {
+    const video = videoRef.current;
+    if (video) video.volume = resolvedVolume;
+  }, [resolvedVolume]);
+  useEffect(() => {
+    const video = videoRef.current;
+    if (!video) return;
+    if (!isPlaying) {
+      video.pause();
+      return;
+    }
+    if (startedPlaybackId.current === playbackId) {
+      if (!video.ended) void video.play().catch(() => {
+      });
+      return;
+    }
+    const changingSource = startedVideoUrl.current !== void 0 && startedVideoUrl.current !== mediaUrl;
+    video.playbackRate = 1;
+    if (!changingSource && video.currentTime > 0) video.currentTime = 0;
+    video.play().catch(() => {
+    });
+    startedVideoUrl.current = mediaUrl;
+    startedPlaybackId.current = playbackId;
+  }, [isPlaying, mediaUrl, playbackId]);
+  const mediaStyle = {
+    position: "absolute",
+    inset: 0,
+    width: "100%",
+    height: "100%",
+    objectFit: "cover",
+    objectPosition: resolvedPosition,
+    transform: bgTransform.transform,
+    transformOrigin: bgTransform.transformOrigin,
+    zIndex: persistent ? 1 : void 0
+  };
+  const preparedPosition = preparedPoster ? resolveMediaPosition(preparedPoster.mediaPosition) : resolvedPosition;
+  const preparedTransform = getBackgroundTransform(preparedPoster?.backgroundEffect, 0, 0);
+  const posterPlanes = [
+    ...persistent && mediaPoster ? [{
+      presentationKey: videoPresentationKey,
+      mediaPoster,
+      mediaPosition: resolvedPosition,
+      transform: bgTransform.transform,
+      transformOrigin: bgTransform.transformOrigin,
+      opacity: 1,
+      zIndex: 0,
+      role: "current"
+    }] : [],
+    ...preparedPoster && preparedPoster.presentationKey !== videoPresentationKey ? [{
+      presentationKey: preparedPoster.presentationKey,
+      mediaPoster: preparedPoster.mediaPoster,
+      mediaPosition: preparedPosition,
+      transform: preparedTransform.transform,
+      transformOrigin: preparedTransform.transformOrigin,
+      opacity: preparedPoster.opacity ?? 0,
+      zIndex: 2,
+      role: "prepared"
+    }] : []
+  ];
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    posterPlanes.map((posterPlane) => /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: posterPlane.mediaPoster,
+        alt: "",
+        "aria-hidden": "true",
+        draggable: false,
+        "data-video-poster-plane": posterPlane.role,
+        "data-video-poster-visible": posterPlane.opacity > 0 ? "true" : "false",
+        style: {
+          position: "absolute",
+          inset: 0,
+          width: "100%",
+          height: "100%",
+          objectFit: "cover",
+          objectPosition: posterPlane.mediaPosition,
+          transform: posterPlane.transform,
+          transformOrigin: posterPlane.transformOrigin,
+          zIndex: posterPlane.zIndex,
+          opacity: posterPlane.opacity,
+          pointerEvents: "none"
+        }
+      },
+      posterPlane.presentationKey
+    )),
+    /* @__PURE__ */ jsx(
+      "video",
+      {
+        ref: videoRef,
+        src: mediaUrl,
+        poster: retainPoster || decodedVideoUrl !== mediaUrl ? mediaPoster || void 0 : void 0,
+        muted: resolvedMuted,
+        loop: false,
+        playsInline: true,
+        preload: "auto",
+        onLoadedData: (event) => {
+          const video = event.currentTarget;
+          const markPresented = () => {
+            if (!video.isConnected) return;
+            onReady?.();
+            if (!retainPoster) setDecodedVideoUrl(mediaUrl);
+          };
+          if (video.requestVideoFrameCallback) {
+            video.requestVideoFrameCallback(markPresented);
+            return;
+          }
+          markPresented();
+        },
+        onError,
+        "data-media-position": mediaPosition,
+        "data-video-backdrop": persistent ? "persistent" : "scene",
+        style: mediaStyle
+      }
+    )
+  ] });
+};
+
+export {
+  BrandGradientOverlay,
+  spring,
+  getBackgroundTransform,
+  resolveMediaPosition,
+  SceneVideoBackdrop
+};

package/dist/{chunk-MMUXVA47.js → chunk-7M56IUUX.js}

@@ -1,10 +1,9 @@
 import {
   VIDEO_PROTOCOL_VERSION,
-  VIDEO_SCHEMA_VERSION
-} from "./chunk-AOWSXU2K.js";
-import {
-  validateVideoBrand
-} from "./chunk-XGRA2MUV.js";
+  VIDEO_SCHEMA_VERSION,
+  validateNarrationGroup,
+  validateNarrationGroups
+} from "./chunk-7NZOMTAL.js";
 
 // src/protocol/warnings.ts
 var VIDEO_WARNING_CATEGORIES = {
@@ -144,7 +143,8 @@ function scene(value, path) {
     "textArchetype",
     "backgroundEffect",
     "timing",
-    "narration"
+    "narration",
+    "narrationGroup"
   ], path);
   string(result.id, `${path}.id`);
   string(result.templateId, `${path}.templateId`);
@@ -154,6 +154,7 @@ function scene(value, path) {
   if (result.textArchetype != null) string(result.textArchetype, `${path}.textArchetype`);
   if (result.backgroundEffect != null) string(result.backgroundEffect, `${path}.backgroundEffect`);
   if (result.narration != null) string(result.narration, `${path}.narration`);
+  if (result.narrationGroup !== void 0) validateNarrationGroup(result.narrationGroup);
   return result;
 }
 function capabilities(value, path) {
@@ -175,7 +176,6 @@ function capabilities(value, path) {
 function style(value, path) {
   const result = record(value, path);
   allowedKeys(result, [
-    "brand",
     "preset",
     "defaultBackgroundEffect",
     "defaultTextArchetype",
@@ -184,7 +184,6 @@ function style(value, path) {
     "motion",
     "generatedLook"
   ], path);
-  validateVideoBrand(result.brand, `${path}.brand`);
   if (result.generatedLook != null) string(result.generatedLook, `${path}.generatedLook`);
   return result;
 }
@@ -247,6 +246,7 @@ function config(value, path) {
   }
   if (!Array.isArray(result.scenes)) throw new Error(`${path}.scenes must be an array`);
   result.scenes.forEach((item, index) => scene(item, `${path}.scenes[${index}]`));
+  validateNarrationGroups(result.scenes);
   style(result.style, `${path}.style`);
   if (result.orientation != null && result.orientation !== "portrait" && result.orientation !== "landscape") {
     throw new Error(`${path}.orientation is unsupported`);
@@ -347,6 +347,7 @@ function parseVideoPlanPart(value) {
       throw new Error("plan part.placement is unsupported");
     }
     scene(part.scene, "plan part.scene");
+    if (part.scene.narrationGroup !== void 0) throw new Error("narrationGroup is host-authored and cannot be emitted by a planner");
   } else if (type === "plan.complete") {
     allowedKeys(part, ["type", "finishReason"], "plan part");
     if (part.finishReason != null && !["stop", "length", "content-filter", "other"].includes(String(part.finishReason))) {

package/dist/chunk-7NZOMTAL.js

@@ -0,0 +1,63 @@
+// src/protocol/narration-group.ts
+var close = (a, b) => Math.abs(a - b) <= 0.02;
+var normalized = (text) => text.trim().replace(/\s+/gu, " ");
+function validateNarrationGroup(value) {
+  if (!value || typeof value !== "object" || Array.isArray(value)) throw new Error("Invalid narrationGroup");
+  const group = value;
+  if (Object.keys(group).some((key) => !["id", "text", "offsetSeconds", "durationSeconds", "totalSeconds"].includes(key))) throw new Error("Unknown narrationGroup field");
+  for (const [key, maximum] of [["id", 128], ["text", 4e3]]) {
+    if (typeof group[key] !== "string" || !group[key].trim() || group[key].length > maximum) throw new Error(`Invalid narrationGroup.${key}`);
+  }
+  for (const key of ["offsetSeconds", "durationSeconds", "totalSeconds"]) {
+    const number = group[key];
+    if (typeof number !== "number" || !Number.isFinite(number) || number < 0 || number > 1800 || key !== "offsetSeconds" && number === 0) throw new Error(`Invalid narrationGroup.${key}`);
+  }
+  if (group.offsetSeconds + group.durationSeconds > group.totalSeconds + 0.02) throw new Error("Narration group segment exceeds its audio");
+}
+function validateNarrationGroups(scenes) {
+  const seen = /* @__PURE__ */ new Set();
+  for (let index = 0; index < scenes.length; ) {
+    const first = scenes[index]?.narrationGroup;
+    if (!first) {
+      index++;
+      continue;
+    }
+    validateNarrationGroup(first);
+    if (seen.has(first.id) || !close(first.offsetSeconds, 0)) throw new Error("Narration groups must be contiguous and start at zero");
+    seen.add(first.id);
+    let offset = 0;
+    const fragments = [];
+    while (index < scenes.length && scenes[index]?.narrationGroup?.id === first.id) {
+      const scene = scenes[index];
+      const group = scene.narrationGroup;
+      validateNarrationGroup(group);
+      if (group.text !== first.text || !close(group.totalSeconds, first.totalSeconds) || !close(group.offsetSeconds, offset)) throw new Error("Narration group segments must share audio and contiguous offsets");
+      if (!close(scene.timing.fixedDuration ?? -1, group.durationSeconds)) throw new Error("Narration group duration must match fixed scene duration");
+      fragments.push(scene.narration ?? "");
+      offset += group.durationSeconds;
+      index++;
+    }
+    if (!close(offset, first.totalSeconds) || normalized(fragments.join(" ")) !== normalized(first.text)) throw new Error("Narration group must cover its complete spoken paragraph");
+  }
+}
+
+// src/protocol/types.ts
+var VIDEO_PROTOCOL_VERSION = "0.6";
+var VIDEO_SCHEMA_VERSION = "0.2";
+function createVideoRequest(input, options) {
+  return {
+    protocolVersion: VIDEO_PROTOCOL_VERSION,
+    requestId: options.requestId,
+    input,
+    ...options.capabilities ? { capabilities: options.capabilities } : {},
+    ...options.resume ? { resume: options.resume } : {}
+  };
+}
+
+export {
+  validateNarrationGroup,
+  validateNarrationGroups,
+  VIDEO_PROTOCOL_VERSION,
+  VIDEO_SCHEMA_VERSION,
+  createVideoRequest
+};

package/dist/{chunk-2DOLF4QN.js → chunk-AUPC6MDK.js}

@@ -1,9 +1,8 @@
 import {
-  VIDEO_SCHEMA_VERSION
-} from "./chunk-AOWSXU2K.js";
-import {
-  validateVideoBrand
-} from "./chunk-XGRA2MUV.js";
+  VIDEO_SCHEMA_VERSION,
+  validateNarrationGroup,
+  validateNarrationGroups
+} from "./chunk-7NZOMTAL.js";
 
 // src/protocol/persistence.ts
 var MAX_RETAINED_SOURCE_LENGTH = 16384;
@@ -274,7 +273,8 @@ function validateScene(value, path) {
     "textArchetype",
     "backgroundEffect",
     "timing",
-    "narration"
+    "narration",
+    "narrationGroup"
   ], path);
   nonEmptyString(requiredField(result, "id", `${path}.id`), `${path}.id`, 128);
   nonEmptyString(requiredField(result, "templateId", `${path}.templateId`), `${path}.templateId`, 128);
@@ -288,12 +288,12 @@ function validateScene(value, path) {
   }
   const narration = ownField(result, "narration", `${path}.narration`);
   if (narration.present) nonEmptyString(narration.value, `${path}.narration`, 4e3);
+  if (result.narrationGroup !== void 0) validateNarrationGroup(result.narrationGroup);
   return result;
 }
 function validateStyle(value, path) {
   const result = record(value, path);
   allowedKeys(result, [
-    "brand",
     "preset",
     "defaultBackgroundEffect",
     "defaultTextArchetype",
@@ -302,13 +302,6 @@ function validateStyle(value, path) {
     "motion",
     "generatedLook"
   ], path);
-  const brandValue = requiredField(result, "brand", `${path}.brand`);
-  const brand = record(brandValue, `${path}.brand`);
-  for (const key of ["name", "logoUrl"]) {
-    const field = ownField(brand, key, `${path}.brand.${key}`);
-    if (field.present) nonEmptyString(field.value, `${path}.brand.${key}`);
-  }
-  validateVideoBrand(brandValue, `${path}.brand`);
   const look = ownField(result, "generatedLook", `${path}.generatedLook`);
   if (look.present) nonEmptyString(look.value, `${path}.generatedLook`, 1e3);
   for (const key of [
@@ -450,6 +443,11 @@ function validateCurrentVideo(value) {
   for (let index = 0; index < sceneItems.length; index += 1) {
     scenes[index] = validateScene(sceneItems[index], `video.scenes[${index}]`);
   }
+  try {
+    validateNarrationGroups(scenes);
+  } catch (error) {
+    fail(error instanceof Error ? error.message : "Invalid narration groups");
+  }
   const ids = /* @__PURE__ */ new Set();
   let cursor = 0;
   for (let index = 0; index < scenes.length; index += 1) {

package/dist/{chunk-352ZZCET.js → chunk-EGVQODKU.js}

@@ -1,7 +1,7 @@
 // src/visual-system/catalog/value-validation.ts
 var STRING_FORMATS = /* @__PURE__ */ new Set(["uri", "supplied-image", "grounded-quote", "stock-media-keyword", "emoji"]);
 function isTemplatePropertyFormatSupported(format, type) {
-  return format === "grounded-stat" ? type === "number" || type === "integer" : STRING_FORMATS.has(format) && type === "string";
+  return format === "grounded-stat" ? type === "string" || type === "number" || type === "integer" : STRING_FORMATS.has(format) && type === "string";
 }
 function validUrl(value) {
   try {
@@ -25,7 +25,7 @@ function validateTemplateSchemaValue(schema, value, path, options = {}) {
     const text = value;
     if (schema.minLength != null && text.length < schema.minLength) fail(`must contain at least ${schema.minLength} characters`);
     if (schema.maxLength != null && text.length > schema.maxLength) fail(`must contain at most ${schema.maxLength} characters`);
-    if (schema.format === "uri" || schema.format === "supplied-image") {
+    if (!options.deferMediaUrls && (schema.format === "uri" || schema.format === "supplied-image")) {
       const emptySentinel = options.allowEmptyOptionalMedia && options.optional && text === "";
       if (!emptySentinel && !validUrl(text)) fail("must be a valid URL");
     }

package/dist/chunk-EWWCQFTI.js

@@ -0,0 +1,18 @@
+import {
+  editorialFont,
+  fade
+} from "./chunk-4YM2M62S.js";
+
+// src/visual-system/scene-templates/chapter-title.tsx
+import { jsx } from "react/jsx-runtime";
+function TitleScene({ variables, width, height, progress }) {
+  const title = String(variables.title ?? "A different perspective");
+  const unit = Math.min(width, height);
+  const opacity = fade(progress / 0.22) * (1 - fade((progress - 0.76) / 0.24));
+  return /* @__PURE__ */ jsx("div", { "data-template": "title", "data-title-treatment": "quiet-fade", style: { position: "absolute", inset: 0, background: "#000", color: "#fff", display: "flex", alignItems: "center", justifyContent: "center" }, children: /* @__PURE__ */ jsx("div", { "data-title-composition": "centered", style: { width: "76%", textAlign: "center", opacity, fontFamily: editorialFont, fontWeight: 500, fontSize: unit * 0.068, lineHeight: 1.18, letterSpacing: "-.025em", textWrap: "balance", overflowWrap: "anywhere" }, children: title }) });
+}
+var TitleSceneTemplate = TitleScene;
+
+export {
+  TitleSceneTemplate
+};

package/dist/{chunk-MXZSDGZQ.js → chunk-G7IZBBWF.js}

@@ -1,17 +1,15 @@
 import {
+  BrandGradientOverlay,
   SceneVideoBackdrop,
+  getBackgroundTransform,
   resolveMediaPosition
-} from "./chunk-FRN6WKHA.js";
-import {
-  BrandGradientOverlay,
-  getBackgroundTransform
-} from "./chunk-W3VDIBGR.js";
+} from "./chunk-77VY4O7A.js";
 import {
   resolveMediaType
-} from "./chunk-224QNWRA.js";
+} from "./chunk-UDIODEDK.js";
 import {
   useExternalVideoBackdrop
-} from "./chunk-5CDAM24P.js";
+} from "./chunk-TVIU23OM.js";
 
 // src/visual-system/scene-templates/scene-background.tsx
 import { useEffect, useState } from "react";
@@ -197,7 +195,14 @@ var SceneBackground = ({
   ] });
 };
 
+// src/visual-system/scene-templates/cinema-media.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function MediaScene({ variables, style, width, height, progress, sceneDuration, isPlaying }) {
+  return /* @__PURE__ */ jsx2("div", { "data-template": "cinemaMedia", style: { width, height, position: "relative", overflow: "hidden" }, children: /* @__PURE__ */ jsx2(SceneBackground, { style, width, height, progress, sceneDuration, ...getMediaBackgroundProps(variables), mediaTreatment: "none", backgroundEffect: "none", isPlaying }) });
+}
+var MediaSceneTemplate = MediaScene;
+
 export {
-  getMediaBackgroundProps,
-  SceneBackground
+  MediaScene,
+  MediaSceneTemplate
 };

package/dist/{chunk-KT3M7KDL.js → chunk-HKUI5BTB.js}

@@ -1,12 +1,12 @@
 import {
   parseVideoEvent
-} from "./chunk-MMUXVA47.js";
+} from "./chunk-7M56IUUX.js";
 import {
   MAX_RETAINED_MEDIA_URL_LENGTH
-} from "./chunk-2DOLF4QN.js";
+} from "./chunk-AUPC6MDK.js";
 import {
   VIDEO_PROTOCOL_VERSION
-} from "./chunk-AOWSXU2K.js";
+} from "./chunk-7NZOMTAL.js";
 
 // src/video-chat/recovery.ts
 var MEDIA_RECOVERY_NOTICE = "Some visuals were replaced so your response can continue.";