@vanillaskyai/video 0.1.0

package/dist/chunk-ABPKM4GK.js

@@ -0,0 +1,187 @@
+import {
+  parseVideoEvent
+} from "./chunk-ERY4S6QV.js";
+import {
+  VIDEO_SCHEMA_VERSION
+} from "./chunk-EE6PK6XC.js";
+
+// src/protocol/stable-json.ts
+function stableJson(value) {
+  if (value == null || typeof value !== "object") return JSON.stringify(value);
+  if (Array.isArray(value)) return `[${value.map(stableJson).join(",")}]`;
+  const entries = Object.entries(value).filter(([, child]) => child !== void 0).sort(([left], [right]) => left < right ? -1 : left > right ? 1 : 0);
+  return `{${entries.map(([key, child]) => `${JSON.stringify(key)}:${stableJson(child)}`).join(",")}}`;
+}
+
+// src/protocol/checksum.ts
+function checksumVideo(config) {
+  const input = stableJson(config);
+  let hash = 2166136261;
+  for (let index = 0; index < input.length; index += 1) {
+    hash ^= input.charCodeAt(index);
+    hash = Math.imul(hash, 16777619) >>> 0;
+  }
+  return `fnv1a32:${hash.toString(16).padStart(8, "0")}`;
+}
+
+// src/protocol/state.ts
+function createVideoState() {
+  return {
+    status: "idle",
+    lastSequence: -1,
+    sceneRevisions: {},
+    appliedEvents: {},
+    extensions: [],
+    errors: [],
+    warnings: []
+  };
+}
+function applyVideoEvent(state, untrustedEvent, options = {}) {
+  const event = parseVideoEvent(untrustedEvent);
+  const signature = stableJson(event);
+  const priorSignature = state.appliedEvents[event.eventId];
+  if (priorSignature) {
+    if (priorSignature !== signature) throw new Error(`Event ${event.eventId} has a conflicting replay`);
+    return state;
+  }
+  if (event.sequence !== state.lastSequence + 1) {
+    throw new Error(`Video response expected sequence ${state.lastSequence + 1}, received ${event.sequence}`);
+  }
+  if (state.runId && event.runId !== state.runId) {
+    throw new Error(`Video response run changed from ${state.runId} to ${event.runId}`);
+  }
+  if (["complete", "error", "aborted"].includes(state.status)) {
+    throw new Error(`Cannot apply ${event.type} after ${state.status}`);
+  }
+  const base = {
+    ...state,
+    runId: event.runId,
+    lastSequence: event.sequence,
+    lastEventId: event.eventId,
+    appliedEvents: { ...state.appliedEvents, [event.eventId]: signature }
+  };
+  if (event.type === "response.start") {
+    if (state.status !== "idle" || event.sequence !== 0) {
+      throw new Error("response.start must be the first event");
+    }
+    return {
+      ...base,
+      status: "streaming",
+      requestId: event.data.requestId,
+      capabilities: event.data.capabilities,
+      config: {
+        schemaVersion: VIDEO_SCHEMA_VERSION,
+        orientation: event.data.format.orientation,
+        scenes: [],
+        style: event.data.style,
+        ...event.data.meta ? { meta: event.data.meta } : {}
+      }
+    };
+  }
+  if (state.status === "idle" || !state.config) throw new Error("response.start is required first");
+  if (event.type === "audio.set") {
+    if (state.config.scenes.length > 0) throw new Error("audio.set must arrive before the first scene");
+    if (state.config.audio) throw new Error("audio.set can only be applied once");
+    return { ...base, config: { ...state.config, audio: event.data.audio } };
+  }
+  if (event.type === "scene.add") {
+    if (state.capabilities?.templates != null && !state.capabilities.templates.includes(event.data.scene.templateId)) {
+      throw new Error(`Scene template ${event.data.scene.templateId} was not negotiated`);
+    }
+    if (event.data.position !== state.config.scenes.length) {
+      throw new Error(`scene.add position must be ${state.config.scenes.length}`);
+    }
+    if (event.data.revision !== 0) throw new Error("A new scene must start at revision 0");
+    if (state.sceneRevisions[event.data.scene.id] != null) {
+      throw new Error(`Scene ${event.data.scene.id} already exists`);
+    }
+    return {
+      ...base,
+      config: { ...state.config, scenes: [...state.config.scenes, event.data.scene] },
+      sceneRevisions: { ...state.sceneRevisions, [event.data.scene.id]: 0 }
+    };
+  }
+  if (event.type === "scene.patch" || event.type === "asset.patch") {
+    const sceneId = event.data.sceneId;
+    const currentRevision = state.sceneRevisions[sceneId];
+    if (currentRevision == null) throw new Error(`Scene ${sceneId} does not exist`);
+    if (options.mutableSceneIds && !options.mutableSceneIds.has(sceneId)) {
+      throw new Error(`Cannot patch scene ${sceneId} after it has already played`);
+    }
+    if (event.data.revision !== currentRevision + 1) {
+      throw new Error(`Scene ${sceneId} expected revision ${currentRevision + 1}`);
+    }
+    const sceneIndex = state.config.scenes.findIndex((item) => item.id === sceneId);
+    const currentScene = state.config.scenes[sceneIndex];
+    const nextScene = event.type === "scene.patch" ? {
+      ...currentScene,
+      ...event.data.patch,
+      variables: event.data.patch.variables ? { ...currentScene.variables, ...event.data.patch.variables } : currentScene.variables,
+      timing: event.data.patch.timing ? { ...currentScene.timing, ...event.data.patch.timing } : currentScene.timing
+    } : {
+      ...currentScene,
+      variables: { ...currentScene.variables, ...event.data.variables }
+    };
+    const scenes = [...state.config.scenes];
+    scenes[sceneIndex] = nextScene;
+    return {
+      ...base,
+      config: { ...state.config, scenes },
+      sceneRevisions: { ...state.sceneRevisions, [sceneId]: event.data.revision }
+    };
+  }
+  if (event.type === "response.complete") {
+    const expectedChecksum = checksumVideo(event.data.snapshot);
+    if (event.data.checksum !== expectedChecksum) {
+      throw new Error(`response.complete checksum mismatch: expected ${expectedChecksum}`);
+    }
+    if (stableJson(event.data.snapshot) !== stableJson(state.config)) {
+      throw new Error("response.complete snapshot does not match the reduced event stream");
+    }
+    return {
+      ...base,
+      status: "complete",
+      config: event.data.snapshot,
+      finishReason: event.data.finishReason,
+      checksum: event.data.checksum
+    };
+  }
+  if (event.type === "response.error") {
+    if (event.data.snapshot && stableJson(event.data.snapshot) !== stableJson(state.config)) {
+      throw new Error("response.error snapshot does not match the reduced event stream");
+    }
+    return {
+      ...base,
+      status: event.data.terminal ? "error" : "streaming",
+      ...event.data.snapshot ? { config: event.data.snapshot } : {},
+      errors: [...state.errors, event.data.error]
+    };
+  }
+  if (event.type === "response.warning") {
+    return { ...base, warnings: [...state.warnings, event.data.warning] };
+  }
+  if (event.type === "response.abort") {
+    if (event.data.snapshot && stableJson(event.data.snapshot) !== stableJson(state.config)) {
+      throw new Error("response.abort snapshot does not match the reduced event stream");
+    }
+    return {
+      ...base,
+      status: "aborted",
+      ...event.data.snapshot ? { config: event.data.snapshot } : {},
+      abortReason: event.data.reason
+    };
+  }
+  if (event.type.startsWith("data.")) {
+    if (!state.capabilities?.extensions?.includes(event.type)) {
+      throw new Error(`Extension ${event.type} was not negotiated`);
+    }
+    return { ...base, extensions: [...state.extensions, event] };
+  }
+  throw new Error(`Reducer does not yet support ${event.type}`);
+}
+
+export {
+  checksumVideo,
+  createVideoState,
+  applyVideoEvent
+};

package/dist/chunk-ABZACD4G.js

@@ -0,0 +1,216 @@
+import {
+  interpolate
+} from "./chunk-XTOXFMLM.js";
+import {
+  darken,
+  resolveTokens
+} from "./chunk-FNAEQ7QO.js";
+
+// src/visual-system/theme/colors.ts
+function withOpacity(hex, opacity) {
+  const match = hex.match(/^#([0-9a-f]{3,8})$/i);
+  if (!match) return hex;
+  const h = match[1];
+  let r;
+  let g;
+  let b;
+  if (h.length === 3) {
+    r = parseInt(h[0] + h[0], 16);
+    g = parseInt(h[1] + h[1], 16);
+    b = parseInt(h[2] + h[2], 16);
+  } else if (h.length >= 6) {
+    r = parseInt(h.slice(0, 2), 16);
+    g = parseInt(h.slice(2, 4), 16);
+    b = parseInt(h.slice(4, 6), 16);
+  } else {
+    return hex;
+  }
+  return `rgba(${r},${g},${b},${opacity})`;
+}
+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];
+}
+function relativeLuminance(hex) {
+  const match = hex.match(/^#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i);
+  if (!match) return void 0;
+  const value = match[1].length === 3 ? match[1].split("").map((character) => character + character).join("") : match[1].slice(0, 6);
+  const channel = (offset) => {
+    const encoded = Number.parseInt(value.slice(offset, offset + 2), 16) / 255;
+    return encoded <= 0.04045 ? encoded / 12.92 : ((encoded + 0.055) / 1.055) ** 2.4;
+  };
+  return 0.2126 * channel(0) + 0.7152 * channel(2) + 0.0722 * channel(4);
+}
+function contrastRatio(first, second) {
+  const firstLuminance = relativeLuminance(first);
+  const secondLuminance = relativeLuminance(second);
+  if (firstLuminance == null || secondLuminance == null) return 0;
+  return (Math.max(firstLuminance, secondLuminance) + 0.05) / (Math.min(firstLuminance, secondLuminance) + 0.05);
+}
+function accessibleTextColor(background, preferred) {
+  if (preferred && contrastRatio(background, preferred) >= 4.5) return preferred;
+  return contrastRatio(background, "#FFFFFF") >= contrastRatio(background, "#000000") ? "#FFFFFF" : "#000000";
+}
+function autoTextColor(background) {
+  return accessibleTextColor(background);
+}
+
+// src/visual-system/scene-templates/color-utils.ts
+import React from "react";
+var TOP_TEXT_AREA_RATIO = 0.32;
+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", {
+    style: {
+      position: "absolute",
+      inset: 0,
+      background: gradientBackground({ colorA: first, colorB: second, solidBg, progress, sceneDuration, seed, family: tokens.preset.background }),
+      pointerEvents: "none"
+    }
+  });
+};
+
+// 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 ?? "slow-zoom-in";
+  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"
+      };
+  }
+}
+
+export {
+  withOpacity,
+  accessibleTextColor,
+  autoTextColor,
+  TOP_TEXT_AREA_RATIO,
+  gradientBackground,
+  BrandGradientOverlay,
+  getBackgroundTransform
+};