pixi-effects 0.1.0 → 0.2.0

package/dist/index.js

@@ -1,1774 +1,12 @@
-import { gsap } from 'gsap';
+import { CompositionSequence } from './chunk-H55V3U56.js';
+import { resolveAt } from './chunk-VJCDG6YG.js';
+export { registerSequenceType } from './chunk-VJCDG6YG.js';
 import * as PIXI from 'pixi.js';
-import { extensions, CullerPlugin, Container, Rectangle, Application, Assets, ExtensionType, Filter, UniformGroup, GpuProgram, GlProgram, defaultFilterVert, Sprite, Text, Texture, Graphics, Color, GraphicsPath } from 'pixi.js';
+import { extensions, CullerPlugin, Application, Container, Rectangle, Assets, ExtensionType, Filter, UniformGroup, GpuProgram, GlProgram, defaultFilterVert } from 'pixi.js';
+import { gsap } from 'gsap';
 import { PixiPlugin } from 'gsap/PixiPlugin';
 import { QUALITY_VERY_HIGH, QUALITY_HIGH, QUALITY_MEDIUM, QUALITY_LOW, QUALITY_VERY_LOW, Output, BufferTarget, CanvasSource, AudioBufferSource, Input, ALL_FORMATS, BlobSource, WavOutputFormat, Conversion, VideoSampleSink, MkvOutputFormat, WebMOutputFormat, MovOutputFormat, Mp4OutputFormat } from 'mediabunny';
 
-var __defProp = Object.defineProperty;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __esm = (fn, res) => function __init() {
-  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
-};
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-
-// src/expr/Parser.ts
-function isDigit(c) {
-  return c >= "0" && c <= "9";
-}
-function isIdStart(c) {
-  return c >= "a" && c <= "z" || c >= "A" && c <= "Z" || c === "_";
-}
-function isIdCont(c) {
-  return isIdStart(c) || isDigit(c);
-}
-function tokenize(src) {
-  const out = [];
-  for (let i = 0; i < src.length; ) {
-    const c = src[i];
-    if (c === " " || c === "	" || c === "\n" || c === "\r") {
-      i++;
-      continue;
-    }
-    if (isDigit(c) || c === "." && isDigit(src[i + 1] ?? "")) {
-      let j = i + 1;
-      while (j < src.length && (isDigit(src[j]) || src[j] === ".")) j++;
-      const value = parseFloat(src.slice(i, j));
-      if (Number.isNaN(value)) throw new Error(`bad number at ${i}`);
-      out.push({ type: "num", value });
-      i = j;
-      continue;
-    }
-    if (isIdStart(c)) {
-      let j = i + 1;
-      while (j < src.length && isIdCont(src[j])) j++;
-      out.push({ type: "id", name: src.slice(i, j) });
-      i = j;
-      continue;
-    }
-    if (c === "+" || c === "-" || c === "*" || c === "/") {
-      out.push({ type: "op", op: c });
-      i++;
-      continue;
-    }
-    if (c === "(") {
-      out.push({ type: "lparen" });
-      i++;
-      continue;
-    }
-    if (c === ")") {
-      out.push({ type: "rparen" });
-      i++;
-      continue;
-    }
-    if (c === ",") {
-      out.push({ type: "comma" });
-      i++;
-      continue;
-    }
-    throw new Error(`unexpected character "${c}" at ${i}`);
-  }
-  return out;
-}
-function parseExpr(c) {
-  return parseAdd(c);
-}
-function parseAdd(c) {
-  let node = parseMul(c);
-  for (; ; ) {
-    const t = c.peek();
-    if (t?.type !== "op" || t.op !== "+" && t.op !== "-") break;
-    c.next();
-    node = { kind: "bin", op: t.op, left: node, right: parseMul(c) };
-  }
-  return node;
-}
-function parseMul(c) {
-  let node = parseUnary(c);
-  for (; ; ) {
-    const t = c.peek();
-    if (t?.type !== "op" || t.op !== "*" && t.op !== "/") break;
-    c.next();
-    node = { kind: "bin", op: t.op, left: node, right: parseUnary(c) };
-  }
-  return node;
-}
-function parseUnary(c) {
-  const t = c.peek();
-  if (t?.type === "op" && t.op === "-") {
-    c.next();
-    return { kind: "neg", child: parseUnary(c) };
-  }
-  if (t?.type === "op" && t.op === "+") {
-    c.next();
-    return parseUnary(c);
-  }
-  return parsePrimary(c);
-}
-function parsePrimary(c) {
-  const t = c.next();
-  if (!t) throw new Error("unexpected end of expression");
-  if (t.type === "num") return { kind: "num", value: t.value };
-  if (t.type === "lparen") {
-    const node = parseExpr(c);
-    const close = c.next();
-    if (close?.type !== "rparen") throw new Error('expected ")"');
-    return node;
-  }
-  if (t.type === "id") {
-    if (c.peek()?.type === "lparen") {
-      c.next();
-      const args = [];
-      if (c.peek()?.type !== "rparen") {
-        args.push(parseExpr(c));
-        while (c.peek()?.type === "comma") {
-          c.next();
-          args.push(parseExpr(c));
-        }
-      }
-      const close = c.next();
-      if (close?.type !== "rparen") throw new Error('expected ")"');
-      return { kind: "call", name: t.name, args };
-    }
-    return { kind: "var", name: t.name };
-  }
-  throw new Error(`unexpected token "${t.type}"`);
-}
-function parse(src) {
-  const c = new Cursor(tokenize(src));
-  const node = parseExpr(c);
-  if (c.peek()) throw new Error("trailing input");
-  return node;
-}
-function evalNode(node, scope) {
-  switch (node.kind) {
-    case "num":
-      return node.value;
-    case "var": {
-      const v = scope[node.name];
-      if (typeof v !== "number") throw new Error(`undefined variable: ${node.name}`);
-      return v;
-    }
-    case "neg":
-      return -evalNode(node.child, scope);
-    case "bin": {
-      const l = evalNode(node.left, scope);
-      const r = evalNode(node.right, scope);
-      switch (node.op) {
-        case "+":
-          return l + r;
-        case "-":
-          return l - r;
-        case "*":
-          return l * r;
-        case "/":
-          return l / r;
-      }
-    }
-    /* c8 ignore next 5 */
-    // eslint-disable-next-line no-fallthrough
-    case "call": {
-      const fn = FUNCS[node.name];
-      if (!fn) throw new Error(`unknown function: ${node.name}`);
-      return fn(...node.args.map((a) => evalNode(a, scope)));
-    }
-  }
-}
-function isExpr(v) {
-  return typeof v === "string" && v.length > 0;
-}
-function evaluateExpr(source, scope) {
-  let ast = astCache.get(source);
-  if (ast === void 0) {
-    try {
-      ast = parse(source);
-    } catch (e) {
-      console.warn(`pixi-effects: expression failed: ${source}`, e);
-      ast = ZERO_NODE;
-    }
-    astCache.set(source, ast);
-  }
-  try {
-    return evalNode(ast, scope);
-  } catch (e) {
-    console.warn(`pixi-effects: expression failed: ${source}`, e);
-    return 0;
-  }
-}
-var FUNCS, Cursor, ZERO_NODE, astCache;
-var init_Parser = __esm({
-  "src/expr/Parser.ts"() {
-    FUNCS = {
-      min: Math.min,
-      max: Math.max,
-      abs: Math.abs,
-      floor: Math.floor,
-      ceil: Math.ceil,
-      round: Math.round,
-      sqrt: Math.sqrt,
-      pow: Math.pow,
-      sin: Math.sin,
-      cos: Math.cos,
-      tan: Math.tan
-    };
-    Cursor = class {
-      constructor(tokens) {
-        this.tokens = tokens;
-      }
-      tokens;
-      i = 0;
-      peek() {
-        return this.tokens[this.i];
-      }
-      next() {
-        return this.tokens[this.i++];
-      }
-    };
-    ZERO_NODE = { kind: "num", value: 0 };
-    astCache = /* @__PURE__ */ new Map();
-  }
-});
-
-// src/expr/normalizeProps.ts
-function normalizeProps(input, scope, options = {}) {
-  const skip = new Set(options.skipKeys ?? []);
-  return walk(input, scope, skip, null);
-}
-function walk(value, scope, skip, currentKey) {
-  if (Array.isArray(value)) {
-    return value.map((v) => walk(v, scope, skip, currentKey));
-  }
-  if (value !== null && typeof value === "object") {
-    const out = {};
-    for (const k of Object.keys(value)) {
-      out[k] = walk(value[k], scope, skip, k);
-    }
-    return out;
-  }
-  if (isExpr(value) && !(currentKey !== null && skip.has(currentKey))) {
-    if (looksLikeColorString(value)) return value;
-    return evaluateExpr(value, scope);
-  }
-  return value;
-}
-function looksLikeColorString(s) {
-  if (s.length === 0) return false;
-  if (s.charCodeAt(0) === 35) return true;
-  return /^(rgb|hsl|oklab|oklch|lab|lch)\b/i.test(s);
-}
-var init_normalizeProps = __esm({
-  "src/expr/normalizeProps.ts"() {
-    init_Parser();
-  }
-});
-function resolveAt(at, duration) {
-  if (at === void 0 || at === null) return 0;
-  return at < 0 ? duration + at : at;
-}
-function normalizeKeyframe(kf, parentDuration) {
-  const at = resolveAt(kf.at, parentDuration);
-  const duration = kf.duration ?? 0;
-  const ease = kf.ease ?? "none";
-  const hasSet = !!kf.set;
-  const hasFrom = !!kf.from;
-  const hasTo = !!kf.to;
-  let kind;
-  if (hasSet) kind = "set";
-  else if (hasFrom && hasTo) kind = "fromTo";
-  else if (hasFrom) kind = "from";
-  else if (hasTo) kind = "to";
-  else kind = "to";
-  return { at, duration, ease, kind, set: kf.set, from: kf.from, to: kf.to };
-}
-function partitionProps(props) {
-  const ownProps = {};
-  const filterProps = {};
-  for (const k of Object.keys(props)) {
-    const m = k.match(/^filters\.([^.]+)\.(.+)$/);
-    if (m) {
-      const [, name, sub] = m;
-      (filterProps[name] ??= {})[sub] = props[k];
-    } else {
-      ownProps[k] = props[k];
-    }
-  }
-  return { ownProps, filterProps };
-}
-function findFilter(target, name) {
-  if (!target?.filters) return null;
-  for (const f of target.filters) {
-    if (f?._name === name) return f;
-  }
-  return null;
-}
-function pixiwrap(props) {
-  const out = {};
-  const pixi = {};
-  let usedPixi = false;
-  for (const [k, v] of Object.entries(props)) {
-    if (PIXI_SHORTHANDS.has(k)) {
-      pixi[k] = v;
-      usedPixi = true;
-    } else {
-      out[k] = v;
-    }
-  }
-  if (usedPixi) out.pixi = pixi;
-  return out;
-}
-function applyKeyframes(timeline, target, keyframes, parentDuration, scope, skipKeys = [], offset = 0) {
-  for (const raw of keyframes ?? []) {
-    const kf = normalizeKeyframe(raw, parentDuration);
-    const at = offset + kf.at;
-    if (kf.kind === "set") {
-      const resolved = normalizeProps(kf.set, scope, { skipKeys });
-      const { ownProps, filterProps } = partitionProps(resolved);
-      if (Object.keys(ownProps).length > 0) timeline.set(target, pixiwrap(ownProps), at);
-      for (const [name, props] of Object.entries(filterProps)) {
-        const f = findFilter(target, name);
-        if (!f) continue;
-        timeline.set(f, props, at);
-      }
-    } else if (kf.kind === "to") {
-      const resolved = normalizeProps(kf.to, scope, { skipKeys });
-      const { ownProps, filterProps } = partitionProps(resolved);
-      if (Object.keys(ownProps).length > 0)
-        timeline.to(target, { ...pixiwrap(ownProps), duration: kf.duration, ease: kf.ease }, at);
-      for (const [name, props] of Object.entries(filterProps)) {
-        const f = findFilter(target, name);
-        if (!f) continue;
-        timeline.to(f, { ...props, duration: kf.duration, ease: kf.ease }, at);
-      }
-    } else if (kf.kind === "from") {
-      const resolved = normalizeProps(kf.from, scope, { skipKeys });
-      const { ownProps, filterProps } = partitionProps(resolved);
-      if (Object.keys(ownProps).length > 0)
-        timeline.from(target, { ...pixiwrap(ownProps), duration: kf.duration, ease: kf.ease }, at);
-      for (const [name, props] of Object.entries(filterProps)) {
-        const f = findFilter(target, name);
-        if (!f) continue;
-        timeline.from(f, { ...props, duration: kf.duration, ease: kf.ease }, at);
-      }
-    } else {
-      const fromResolved = normalizeProps(kf.from, scope, { skipKeys });
-      const toResolved = normalizeProps(kf.to, scope, { skipKeys });
-      const fromSplit = partitionProps(fromResolved);
-      const toSplit = partitionProps(toResolved);
-      const ownKeys = /* @__PURE__ */ new Set([...Object.keys(fromSplit.ownProps), ...Object.keys(toSplit.ownProps)]);
-      if (ownKeys.size > 0) {
-        timeline.fromTo(
-          target,
-          { ...pixiwrap(fromSplit.ownProps) },
-          { ...pixiwrap(toSplit.ownProps), duration: kf.duration, ease: kf.ease },
-          at
-        );
-      }
-      const filterNames = /* @__PURE__ */ new Set([
-        ...Object.keys(fromSplit.filterProps),
-        ...Object.keys(toSplit.filterProps)
-      ]);
-      for (const name of filterNames) {
-        const f = findFilter(target, name);
-        if (!f) continue;
-        timeline.fromTo(
-          f,
-          { ...fromSplit.filterProps[name] ?? {} },
-          { ...toSplit.filterProps[name] ?? {}, duration: kf.duration, ease: kf.ease },
-          at
-        );
-      }
-    }
-  }
-}
-function applyInitial(target, initial, scope, skipKeys = []) {
-  if (!initial) return;
-  const resolved = normalizeProps(initial, scope, { skipKeys });
-  const { ownProps, filterProps } = partitionProps(resolved);
-  if (Object.keys(ownProps).length > 0) gsap.set(target, pixiwrap(ownProps));
-  for (const [name, props] of Object.entries(filterProps)) {
-    const f = findFilter(target, name);
-    if (!f) continue;
-    gsap.set(f, props);
-  }
-}
-var PIXI_SHORTHANDS;
-var init_Timeline = __esm({
-  "src/core/Timeline.ts"() {
-    init_normalizeProps();
-    PIXI_SHORTHANDS = /* @__PURE__ */ new Set([
-      "scale",
-      "scaleX",
-      "scaleY",
-      "anchor",
-      "anchorX",
-      "anchorY",
-      "pivot",
-      "pivotX",
-      "pivotY",
-      "skew",
-      "skewX",
-      "skewY",
-      "rotation",
-      "position",
-      "positionX",
-      "positionY",
-      "tilePosition",
-      "tilePositionX",
-      "tilePositionY",
-      "tileScale",
-      "tileScaleX",
-      "tileScaleY",
-      "tint",
-      "colorize",
-      "colorizeAmount",
-      "colorMatrixFilter",
-      "blur",
-      "blurX",
-      "blurY",
-      "blurPadding",
-      "autoAlpha",
-      "lineColor",
-      "lineAlpha",
-      "fillColor",
-      "fillAlpha"
-    ]);
-  }
-});
-
-// src/expr/Scope.ts
-function buildScope(sequence, parent, root) {
-  const w = sequence.intrinsicWidth || 0;
-  const h = sequence.intrinsicHeight || 0;
-  const W = parent?.width ?? root.width;
-  const H = parent?.height ?? root.height;
-  const GW = root.width;
-  const GH = root.height;
-  const contain = w === 0 || h === 0 ? 1 : Math.min(W / w, H / h);
-  const cover = w === 0 || h === 0 ? 1 : Math.max(W / w, H / h);
-  return {
-    w,
-    h,
-    W,
-    H,
-    GW,
-    GH,
-    contain,
-    cover,
-    t: sequence.at ?? 0,
-    d: sequence.duration ?? parent?.duration ?? root.duration,
-    T: parent?.duration ?? root.duration
-  };
-}
-var init_Scope = __esm({
-  "src/expr/Scope.ts"() {
-  }
-});
-function toRgb01(input) {
-  if (Array.isArray(input)) return [input[0], input[1], input[2]];
-  const c = new Color(input);
-  return [c.red, c.green, c.blue];
-}
-var GL_FRAGMENT, WGSL_SOURCE, ChromaKeyFilter;
-var init_ChromaKey = __esm({
-  "src/filters/ChromaKey.ts"() {
-    GL_FRAGMENT = `
-in vec2 vTextureCoord;
-uniform sampler2D uTexture;
-uniform vec3 uKeyColor;
-uniform float uThreshold;
-uniform float uSmoothing;
-uniform float uSpill;
-
-out vec4 finalColor;
-
-void main(void) {
-    vec4 raw = texture(uTexture, vTextureCoord);
-
-    // Pixi passes pre-multiplied alpha into filters. Un-premultiply so the
-    // chromakey distance is computed against the source color, not a darkened
-    // version that drifts away from the key as sprite.alpha drops.
-    vec3 rgb = raw.a > 0.0 ? raw.rgb / raw.a : vec3(0.0);
-
-    vec3 ycbcr = vec3(
-        0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b,
-        -0.169 * rgb.r - 0.331 * rgb.g + 0.5 * rgb.b + 0.5,
-        0.5 * rgb.r - 0.419 * rgb.g - 0.081 * rgb.b + 0.5
-    );
-    vec3 keyYcbcr = vec3(
-        0.299 * uKeyColor.r + 0.587 * uKeyColor.g + 0.114 * uKeyColor.b,
-        -0.169 * uKeyColor.r - 0.331 * uKeyColor.g + 0.5 * uKeyColor.b + 0.5,
-        0.5 * uKeyColor.r - 0.419 * uKeyColor.g - 0.081 * uKeyColor.b + 0.5
-    );
-
-    float dist = length(ycbcr - keyYcbcr);
-    float alpha = smoothstep(uThreshold - uSmoothing, uThreshold + uSmoothing, dist);
-
-    vec3 despilled = rgb;
-    if (uSpill > 0.0) {
-        float spillAmount = max(0.0, rgb.g - max(rgb.r, rgb.b));
-        despilled.g -= spillAmount * uSpill;
-    }
-
-    float outA = raw.a * alpha;
-    finalColor = vec4(despilled * outA, outA);
-}
-`;
-    WGSL_SOURCE = `
-struct GlobalFilterUniforms {
-  uInputSize: vec4<f32>,
-  uInputPixel: vec4<f32>,
-  uInputClamp: vec4<f32>,
-  uOutputFrame: vec4<f32>,
-  uGlobalFrame: vec4<f32>,
-  uOutputTexture: vec4<f32>,
-};
-
-struct ChromaUniforms {
-  uKeyColor: vec3<f32>,
-  uThreshold: f32,
-  uSmoothing: f32,
-  uSpill: f32,
-};
-
-@group(0) @binding(0) var<uniform> gfu: GlobalFilterUniforms;
-@group(0) @binding(1) var uTexture: texture_2d<f32>;
-@group(0) @binding(2) var uSampler : sampler;
-@group(1) @binding(0) var<uniform> chromaUniforms : ChromaUniforms;
-
-struct VSOutput {
-  @builtin(position) position: vec4<f32>,
-  @location(0) uv : vec2<f32>,
-};
-
-fn filterVertexPosition(aPosition : vec2<f32>) -> vec4<f32> {
-  var position = aPosition * gfu.uOutputFrame.zw + gfu.uOutputFrame.xy;
-  position.x = position.x * (2.0 / gfu.uOutputTexture.x) - 1.0;
-  position.y = position.y * (2.0 * gfu.uOutputTexture.z / gfu.uOutputTexture.y) - gfu.uOutputTexture.z;
-  return vec4<f32>(position, 0.0, 1.0);
-}
-
-fn filterTextureCoord(aPosition : vec2<f32>) -> vec2<f32> {
-  return aPosition * (gfu.uOutputFrame.zw * gfu.uInputSize.zw);
-}
-
-// NOTE on whitespace: PIXI v8's WGSL attribute extractor is regex-based and
-// expects the noise/blur reference format \u2014 multi-line param list + space
-// before the colon. A compact one-liner with no space before the colon parses
-// as having NO vertex attributes, which then causes a "Vertex attribute slot 0
-// not present in the VertexState" pipeline validation error.
-@vertex
-fn mainVertex(
-  @location(0) aPosition : vec2<f32>,
-) -> VSOutput {
-  return VSOutput(
-    filterVertexPosition(aPosition),
-    filterTextureCoord(aPosition),
-  );
-}
-
-@fragment
-fn mainFragment(@location(0) uv : vec2<f32>) -> @location(0) vec4<f32> {
-  let raw = textureSample(uTexture, uSampler, uv);
-
-  // Un-premultiply (see comment in the GLSL version above).
-  var rgb: vec3<f32>;
-  if (raw.a > 0.0) {
-    rgb = raw.rgb / raw.a;
-  } else {
-    rgb = vec3<f32>(0.0);
-  }
-
-  let key = chromaUniforms.uKeyColor;
-
-  let ycbcr = vec3<f32>(
-    0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b,
-    -0.169 * rgb.r - 0.331 * rgb.g + 0.5 * rgb.b + 0.5,
-    0.5 * rgb.r - 0.419 * rgb.g - 0.081 * rgb.b + 0.5,
-  );
-  let keyYcbcr = vec3<f32>(
-    0.299 * key.r + 0.587 * key.g + 0.114 * key.b,
-    -0.169 * key.r - 0.331 * key.g + 0.5 * key.b + 0.5,
-    0.5 * key.r - 0.419 * key.g - 0.081 * key.b + 0.5,
-  );
-
-  let dist = length(ycbcr - keyYcbcr);
-  let alpha = smoothstep(
-    chromaUniforms.uThreshold - chromaUniforms.uSmoothing,
-    chromaUniforms.uThreshold + chromaUniforms.uSmoothing,
-    dist,
-  );
-
-  var despilled = rgb;
-  if (chromaUniforms.uSpill > 0.0) {
-    let spillAmount = max(0.0, rgb.g - max(rgb.r, rgb.b));
-    despilled.g = despilled.g - spillAmount * chromaUniforms.uSpill;
-  }
-
-  let outA = raw.a * alpha;
-  return vec4<f32>(despilled * outA, outA);
-}
-`;
-    ChromaKeyFilter = class extends Filter {
-      constructor(options = {}) {
-        const {
-          keyColor = "#00ff00",
-          threshold = 0.4,
-          smoothing = 0.1,
-          spill = 0.2
-        } = options;
-        const glProgram = GlProgram.from({
-          vertex: defaultFilterVert,
-          fragment: GL_FRAGMENT,
-          name: "chroma-key-filter"
-        });
-        const gpuProgram = GpuProgram.from({
-          vertex: { source: WGSL_SOURCE, entryPoint: "mainVertex" },
-          fragment: { source: WGSL_SOURCE, entryPoint: "mainFragment" }
-        });
-        super({
-          glProgram,
-          gpuProgram,
-          resources: {
-            chromaUniforms: new UniformGroup({
-              uKeyColor: { value: toRgb01(keyColor), type: "vec3<f32>" },
-              uThreshold: { value: threshold, type: "f32" },
-              uSmoothing: { value: smoothing, type: "f32" },
-              uSpill: { value: spill, type: "f32" }
-            })
-          }
-        });
-      }
-      get threshold() {
-        return this.resources.chromaUniforms.uniforms.uThreshold;
-      }
-      set threshold(v) {
-        this.resources.chromaUniforms.uniforms.uThreshold = v;
-      }
-      get smoothing() {
-        return this.resources.chromaUniforms.uniforms.uSmoothing;
-      }
-      set smoothing(v) {
-        this.resources.chromaUniforms.uniforms.uSmoothing = v;
-      }
-      get spill() {
-        return this.resources.chromaUniforms.uniforms.uSpill;
-      }
-      set spill(v) {
-        this.resources.chromaUniforms.uniforms.uSpill = v;
-      }
-      setKeyColor(input) {
-        const rgb = toRgb01(input);
-        const u = this.resources.chromaUniforms.uniforms.uKeyColor;
-        u[0] = rgb[0];
-        u[1] = rgb[1];
-        u[2] = rgb[2];
-      }
-    };
-  }
-});
-
-// src/filters/index.ts
-function looksLikePixiFilter(x) {
-  return !!x && typeof x === "object" && typeof x.apply === "function";
-}
-function createFilter(spec) {
-  if (spec.type === "custom") {
-    const inst2 = spec.filter;
-    if (!looksLikePixiFilter(inst2)) {
-      throw new Error('pixi-effects: { type: "custom" } requires a `filter` that is a PIXI Filter instance (duck-typed: must have an `apply` method).');
-    }
-    const named = inst2;
-    named._name = spec.name;
-    return named;
-  }
-  const Cls = registry[spec.type];
-  if (!Cls) throw new Error(`pixi-effects: unknown filter type "${spec.type}"`);
-  const { type: _t, name, ...params } = spec;
-  const inst = new Cls(params);
-  inst._name = name;
-  return inst;
-}
-var registry;
-var init_filters = __esm({
-  "src/filters/index.ts"() {
-    init_ChromaKey();
-    registry = {
-      chromaKey: ChromaKeyFilter
-    };
-  }
-});
-var Sequence;
-var init_Base = __esm({
-  "src/sequences/Base.ts"() {
-    init_Timeline();
-    init_Scope();
-    init_filters();
-    Sequence = class {
-      spec;
-      parent;
-      root;
-      target = null;
-      intrinsicWidth = 0;
-      intrinsicHeight = 0;
-      at;
-      duration;
-      filters = [];
-      /**
-       * Mask sequence built from `spec.mask`, if any. Built and added to the
-       * scene graph by the parent CompositionSequence; rendered as a mask
-       * (not a normal child) by PIXI when `target.mask = maskSequence.target`.
-       */
-      maskSequence = null;
-      constructor(spec, parent, root) {
-        this.spec = spec;
-        this.parent = parent;
-        this.root = root;
-        this.at = spec.at ?? 0;
-        this.duration = spec.duration;
-      }
-      buildFilters() {
-        const specs = this.spec.filters ?? [];
-        this.filters = specs.map(createFilter);
-        if (this.target && "filters" in this.target) {
-          this.target.filters = this.filters;
-        }
-        const fa = this.spec.filterArea;
-        if (fa && this.target) {
-          this.target.filterArea = new Rectangle(fa.x, fa.y, fa.width, fa.height);
-        }
-      }
-      scope() {
-        return buildScope(this, this.parent, this.root);
-      }
-      bindTimeline(timeline, offset = 0) {
-        if (!this.target) return;
-        const scope = this.scope();
-        applyInitial(this.target, this.spec.initial, scope);
-        applyKeyframes(timeline, this.target, this.spec.keyframes, this.duration, scope, [], offset);
-        const startTime = offset + this.at;
-        const endTime = startTime + this.duration;
-        this.target.renderable = startTime <= 0;
-        timeline.set(this.target, { renderable: true }, startTime);
-        timeline.set(this.target, { renderable: false }, endTime);
-      }
-      collectAudio(_out, _baseTime) {
-      }
-      destroy() {
-        this.maskSequence?.destroy();
-        this.maskSequence = null;
-        this.target?.destroy?.();
-        this.target = null;
-      }
-    };
-  }
-});
-
-// src/expr/colorInterp.ts
-function buildColorInterp(from, to, space) {
-  const fromRGBA = parseToRGBA(from);
-  const toRGBA = parseToRGBA(to);
-  const fromOk = rgbToOklab(fromRGBA);
-  const toOk = rgbToOklab(toRGBA);
-  if (space === "oklab") {
-    return (t) => {
-      const L = lerp(fromOk.L, toOk.L, t);
-      const a = lerp(fromOk.a, toOk.a, t);
-      const b = lerp(fromOk.b, toOk.b, t);
-      const alpha = lerp(fromRGBA.a, toRGBA.a, t);
-      return rgbaString(oklabToRgb({ L, a, b }), alpha);
-    };
-  }
-  const fromLCH = oklabToOklch(fromOk);
-  const toLCH = oklabToOklch(toOk);
-  if (fromLCH.C < 1e-4) fromLCH.h = toLCH.h;
-  if (toLCH.C < 1e-4) toLCH.h = fromLCH.h;
-  const hueDelta = shortestHueDelta(fromLCH.h, toLCH.h);
-  return (t) => {
-    const L = lerp(fromLCH.L, toLCH.L, t);
-    const C = lerp(fromLCH.C, toLCH.C, t);
-    const h = fromLCH.h + hueDelta * t;
-    const alpha = lerp(fromRGBA.a, toRGBA.a, t);
-    const ab = oklchToOklab({ L, C, h });
-    return rgbaString(oklabToRgb(ab), alpha);
-  };
-}
-function parseToRGBA(input) {
-  if (typeof input === "number") {
-    return { r: (input >> 16 & 255) / 255, g: (input >> 8 & 255) / 255, b: (input & 255) / 255, a: 1 };
-  }
-  const s = input.trim();
-  if (s.startsWith("#")) return parseHex(s);
-  if (s.startsWith("rgb")) return parseRgbFunc(s);
-  return { r: 0, g: 0, b: 0, a: 1 };
-}
-function parseHex(s) {
-  const hex = s.slice(1);
-  let r = 0, g = 0, b = 0, a = 1;
-  if (hex.length === 3 || hex.length === 4) {
-    r = parseInt(hex[0] + hex[0], 16) / 255;
-    g = parseInt(hex[1] + hex[1], 16) / 255;
-    b = parseInt(hex[2] + hex[2], 16) / 255;
-    if (hex.length === 4) a = parseInt(hex[3] + hex[3], 16) / 255;
-  } else if (hex.length === 6 || hex.length === 8) {
-    r = parseInt(hex.slice(0, 2), 16) / 255;
-    g = parseInt(hex.slice(2, 4), 16) / 255;
-    b = parseInt(hex.slice(4, 6), 16) / 255;
-    if (hex.length === 8) a = parseInt(hex.slice(6, 8), 16) / 255;
-  }
-  return { r, g, b, a };
-}
-function parseRgbFunc(s) {
-  const inner = s.replace(/^rgba?\(/, "").replace(/\)$/, "");
-  const parts = inner.split(/[,\s/]+/).filter(Boolean).map(parseFloat);
-  return {
-    r: (parts[0] ?? 0) / 255,
-    g: (parts[1] ?? 0) / 255,
-    b: (parts[2] ?? 0) / 255,
-    a: parts.length > 3 ? parts[3] ?? 1 : 1
-  };
-}
-function rgbaString(rgb, alpha) {
-  const r = Math.round(clamp01(rgb.r) * 255);
-  const g = Math.round(clamp01(rgb.g) * 255);
-  const b = Math.round(clamp01(rgb.b) * 255);
-  return `rgba(${r},${g},${b},${alpha})`;
-}
-function srgbToLinear(c) {
-  return c <= 0.04045 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
-}
-function linearToSrgb(c) {
-  return c <= 31308e-7 ? 12.92 * c : 1.055 * Math.pow(c, 1 / 2.4) - 0.055;
-}
-function rgbToOklab(rgba) {
-  const r = srgbToLinear(rgba.r);
-  const g = srgbToLinear(rgba.g);
-  const b = srgbToLinear(rgba.b);
-  const l = 0.4122214708 * r + 0.5363325363 * g + 0.0514459929 * b;
-  const m = 0.2119034982 * r + 0.6806995451 * g + 0.1073969566 * b;
-  const s = 0.0883024619 * r + 0.2817188376 * g + 0.6299787005 * b;
-  const l_ = Math.cbrt(l);
-  const m_ = Math.cbrt(m);
-  const s_ = Math.cbrt(s);
-  return {
-    L: 0.2104542553 * l_ + 0.793617785 * m_ - 0.0040720468 * s_,
-    a: 1.9779984951 * l_ - 2.428592205 * m_ + 0.4505937099 * s_,
-    b: 0.0259040371 * l_ + 0.7827717662 * m_ - 0.808675766 * s_
-  };
-}
-function oklabToRgb(lab) {
-  const l_ = lab.L + 0.3963377774 * lab.a + 0.2158037573 * lab.b;
-  const m_ = lab.L - 0.1055613458 * lab.a - 0.0638541728 * lab.b;
-  const s_ = lab.L - 0.0894841775 * lab.a - 1.291485548 * lab.b;
-  const l = l_ * l_ * l_;
-  const m = m_ * m_ * m_;
-  const s = s_ * s_ * s_;
-  return {
-    r: linearToSrgb(4.0767416621 * l - 3.3077115913 * m + 0.2309699292 * s),
-    g: linearToSrgb(-1.2684380046 * l + 2.6097574011 * m - 0.3413193965 * s),
-    b: linearToSrgb(-0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s)
-  };
-}
-function oklabToOklch(lab) {
-  return { L: lab.L, C: Math.hypot(lab.a, lab.b), h: Math.atan2(lab.b, lab.a) };
-}
-function oklchToOklab(lch) {
-  return { L: lch.L, a: lch.C * Math.cos(lch.h), b: lch.C * Math.sin(lch.h) };
-}
-function lerp(a, b, t) {
-  return a + (b - a) * t;
-}
-function clamp01(v) {
-  return v < 0 ? 0 : v > 1 ? 1 : v;
-}
-function shortestHueDelta(from, to) {
-  const TWO_PI = Math.PI * 2;
-  let d = (to - from) % TWO_PI;
-  if (d > Math.PI) d -= TWO_PI;
-  if (d < -Math.PI) d += TWO_PI;
-  return d;
-}
-var init_colorInterp = __esm({
-  "src/expr/colorInterp.ts"() {
-  }
-});
-function tweenColor(timeline, target, key, fromValue, toValue, duration, ease, at, colorSpace, onUpdate) {
-  let interp = null;
-  const proxy = { p: 0 };
-  timeline.fromTo(
-    proxy,
-    { p: 0 },
-    {
-      p: 1,
-      duration,
-      ease,
-      onStart: () => {
-        const start = fromValue !== void 0 ? fromValue : target[key];
-        if (start === void 0) return;
-        interp = colorSpace === "rgb" ? gsap.utils.interpolate(start, toValue) : buildColorInterp(start, toValue, colorSpace);
-      },
-      onUpdate: () => {
-        if (interp) {
-          target[key] = interp(proxy.p);
-          if (onUpdate) onUpdate();
-        }
-      }
-    },
-    at
-  );
-}
-var init_colorTween = __esm({
-  "src/expr/colorTween.ts"() {
-    init_colorInterp();
-  }
-});
-function stripKeys(props, keys) {
-  if (!props) return props;
-  const drop = new Set(keys);
-  const out = {};
-  let changed = false;
-  for (const k of Object.keys(props)) {
-    if (drop.has(k)) {
-      changed = true;
-      continue;
-    }
-    out[k] = props[k];
-  }
-  return changed ? out : props;
-}
-function stripKeysInKeyframe(kf, keys) {
-  return {
-    ...kf,
-    set: stripKeys(kf.set, keys),
-    to: stripKeys(kf.to, keys),
-    from: stripKeys(kf.from, keys)
-  };
-}
-var ImageSequence;
-var init_Image = __esm({
-  "src/sequences/Image.ts"() {
-    init_Base();
-    init_Timeline();
-    init_colorTween();
-    ImageSequence = class extends Sequence {
-      async build() {
-        const texture = await Assets.get(this.spec.asset);
-        const sprite = new Sprite({ texture, label: this.spec.name });
-        sprite.cullable = true;
-        this.target = sprite;
-        this.intrinsicWidth = texture.width;
-        this.intrinsicHeight = texture.height;
-        if (this.duration === void 0) {
-          this.duration = this.parent?.duration ?? this.root.duration;
-        }
-        this.buildFilters();
-      }
-      bindTimeline(timeline, offset = 0) {
-        if (!this.target) return;
-        const colorSpace = this.spec.colorSpace;
-        if (!colorSpace || colorSpace === "rgb") {
-          super.bindTimeline(timeline, offset);
-          return;
-        }
-        const scope = this.scope();
-        const initial = stripKeys(this.spec.initial, ["tint"]);
-        const keyframes = this.spec.keyframes ? this.spec.keyframes.map((kf) => stripKeysInKeyframe(kf, ["tint"])) : void 0;
-        applyInitial(this.target, initial, scope);
-        applyKeyframes(timeline, this.target, keyframes, this.duration, scope, [], offset);
-        const initTint = this.spec.initial?.tint;
-        if (initTint !== void 0) this.target.tint = initTint;
-        for (const kf of this.spec.keyframes ?? []) {
-          const at = offset + resolveAt(kf.at, this.duration);
-          const duration = kf.duration ?? 0;
-          const ease = kf.ease ?? "none";
-          const fromTint = kf.from?.tint;
-          const toTint = kf.to?.tint;
-          const setTint = kf.set?.tint;
-          if (setTint !== void 0) {
-            timeline.call(() => {
-              this.target.tint = setTint;
-            }, [], at);
-          }
-          if (toTint !== void 0) {
-            tweenColor(
-              timeline,
-              this.target,
-              "tint",
-              fromTint,
-              toTint,
-              duration,
-              ease,
-              at,
-              colorSpace
-            );
-          }
-        }
-        const startTime = offset + this.at;
-        const endTime = startTime + this.duration;
-        this.target.renderable = startTime <= 0;
-        timeline.set(this.target, { renderable: true }, startTime);
-        timeline.set(this.target, { renderable: false }, endTime);
-      }
-    };
-  }
-});
-function runSuperWithStrippedSpec(inst, strippedSpec, timeline, offset) {
-  const originalSpec = inst.spec;
-  inst.spec = strippedSpec;
-  try {
-    Sequence.prototype.bindTimeline.call(inst, timeline, offset);
-  } finally {
-    inst.spec = originalSpec;
-  }
-}
-function stripFill(spec) {
-  return {
-    ...spec,
-    initial: stripKey(spec.initial, "fill"),
-    keyframes: spec.keyframes ? spec.keyframes.map((kf) => ({
-      ...kf,
-      set: stripKey(kf.set, "fill"),
-      to: stripKey(kf.to, "fill"),
-      from: stripKey(kf.from, "fill")
-    })) : void 0
-  };
-}
-function stripKey(props, key) {
-  if (!props) return props;
-  if (!(key in props)) return props;
-  const out = {};
-  for (const k of Object.keys(props)) if (k !== key) out[k] = props[k];
-  return out;
-}
-function bindFillKeyframes(timeline, text, keyframes, parentDuration, offset, colorSpace) {
-  const state = { fill: text.style.fill };
-  const writeFill = () => {
-    text.style.fill = state.fill;
-  };
-  for (const kf of keyframes) {
-    const at = offset + resolveAt(kf.at, parentDuration);
-    const duration = kf.duration ?? 0;
-    const ease = kf.ease ?? "none";
-    const setFill = pickFill(kf.set);
-    const fromFill = pickFill(kf.from);
-    const toFill = pickFill(kf.to);
-    if (setFill !== void 0) {
-      timeline.call(() => {
-        state.fill = setFill;
-        writeFill();
-      }, [], at);
-    }
-    if (toFill !== void 0) {
-      tweenColor(
-        timeline,
-        state,
-        "fill",
-        fromFill,
-        toFill,
-        duration,
-        ease,
-        at,
-        colorSpace,
-        writeFill
-      );
-    }
-  }
-}
-function pickFill(props) {
-  if (!props) return void 0;
-  const v = props.fill;
-  if (typeof v === "string" || typeof v === "number") return v;
-  return void 0;
-}
-var STYLE_OPAQUE_KEYS, TextSequence;
-var init_Text = __esm({
-  "src/sequences/Text.ts"() {
-    init_Base();
-    init_normalizeProps();
-    init_Timeline();
-    init_colorTween();
-    STYLE_OPAQUE_KEYS = ["fontFamily", "fill", "align", "fontStyle", "fontWeight"];
-    TextSequence = class extends Sequence {
-      async build() {
-        const baseStyle = {
-          fontFamily: "Arial",
-          fontSize: 36,
-          fill: "#ffffff",
-          align: "center"
-        };
-        const text = new Text({
-          text: this.spec.text ?? "",
-          style: baseStyle,
-          label: this.spec.name
-        });
-        text.cullable = true;
-        this.target = text;
-        this.intrinsicWidth = text.width;
-        this.intrinsicHeight = text.height;
-        if (this.duration === void 0) {
-          this.duration = this.parent?.duration ?? this.root.duration;
-        }
-        if (this.spec.style) {
-          const scope = this.scope();
-          const resolved = normalizeProps(
-            this.spec.style,
-            scope,
-            { skipKeys: STYLE_OPAQUE_KEYS }
-          );
-          for (const k of Object.keys(resolved)) {
-            text.style[k] = resolved[k];
-          }
-        }
-        this.buildFilters();
-      }
-      bindTimeline(timeline, offset = 0) {
-        if (!this.target) return;
-        const colorSpace = this.spec.colorSpace ?? "rgb";
-        const stripped = stripFill(this.spec);
-        runSuperWithStrippedSpec(this, stripped, timeline, offset);
-        bindFillKeyframes(timeline, this.target, this.spec.keyframes ?? [], this.duration, offset, colorSpace);
-      }
-    };
-  }
-});
-var AudioSequence;
-var init_Audio = __esm({
-  "src/sequences/Audio.ts"() {
-    init_Base();
-    init_Timeline();
-    AudioSequence = class extends Sequence {
-      _audioBuffer = null;
-      async build() {
-        const data = await Assets.get(this.spec.asset);
-        this._audioBuffer = data.audioBuffer;
-        if (this.duration === void 0) {
-          this.duration = this.spec.duration ?? data.duration ?? this.root.duration;
-        }
-        this.target = null;
-      }
-      bindTimeline(_timeline) {
-      }
-      collectAudio(out, baseTime) {
-        if (!this._audioBuffer) return;
-        const initialVolume = this.spec.volume ?? 1;
-        const volumeKeyframes = [];
-        const dur = this.duration;
-        for (const raw of this.spec.keyframes ?? []) {
-          const kf = normalizeKeyframe(raw, dur);
-          const set = kf.set;
-          const to = kf.to;
-          const from = kf.from;
-          if (kf.kind === "set" && set && "volume" in set) {
-            volumeKeyframes.push({ time: baseTime + this.at + kf.at, value: set.volume });
-          } else if (kf.kind === "to" && to && "volume" in to) {
-            volumeKeyframes.push({ time: baseTime + this.at + kf.at + kf.duration, value: to.volume });
-          } else if (kf.kind === "fromTo" && to && "volume" in to) {
-            volumeKeyframes.push({ time: baseTime + this.at + kf.at, value: from?.volume ?? initialVolume });
-            volumeKeyframes.push({ time: baseTime + this.at + kf.at + kf.duration, value: to.volume });
-          } else if (kf.kind === "from" && from && "volume" in from) {
-            volumeKeyframes.push({ time: baseTime + this.at + kf.at, value: from.volume });
-            volumeKeyframes.push({ time: baseTime + this.at + kf.at + kf.duration, value: initialVolume });
-          }
-        }
-        out.push({
-          buffer: this._audioBuffer,
-          loop: !!this.spec.loop,
-          start: baseTime + this.at,
-          end: baseTime + this.at + dur,
-          initialVolume,
-          volumeKeyframes
-        });
-      }
-      destroy() {
-        this._audioBuffer = null;
-      }
-    };
-  }
-});
-
-// src/core/FrameCache.ts
-var FrameCache;
-var init_FrameCache = __esm({
-  "src/core/FrameCache.ts"() {
-    FrameCache = class {
-      sink;
-      capacity;
-      cache = /* @__PURE__ */ new Map();
-      _pending = /* @__PURE__ */ new Map();
-      constructor(sink, options = {}) {
-        this.sink = sink;
-        this.capacity = options.capacity ?? 30;
-      }
-      _key(time) {
-        return Math.round(time * 1e3);
-      }
-      async getFrameAt(time) {
-        const key = this._key(time);
-        if (this.cache.has(key)) {
-          const v = this.cache.get(key);
-          this.cache.delete(key);
-          this.cache.set(key, v);
-          return v;
-        }
-        const pending = this._pending.get(key);
-        if (pending) return pending;
-        const promise = this._fetch(time);
-        this._pending.set(key, promise);
-        try {
-          const frame = await promise;
-          if (frame) {
-            if (this.cache.has(key)) {
-              frame.close?.();
-              const existing = this.cache.get(key);
-              this.cache.delete(key);
-              this.cache.set(key, existing);
-              return existing;
-            }
-            this.cache.set(key, frame);
-            this._evictIfNeeded();
-          }
-          return frame;
-        } finally {
-          this._pending.delete(key);
-        }
-      }
-      async _fetch(time) {
-        try {
-          const sample = await this.sink.getSample(time);
-          if (!sample) return null;
-          const frame = sample.toVideoFrame();
-          sample.close?.();
-          return frame;
-        } catch (err) {
-          const isTransient = err instanceof DOMException && (err.name === "EncodingError" || err.name === "NotSupportedError");
-          if (isTransient) {
-            console.debug("pixi-effects: transient video decode failure at", time, "s \u2014", err.name);
-          } else {
-            console.warn("pixi-effects: video frame decode failed at", time, "s \u2014", err);
-          }
-          return null;
-        }
-      }
-      _evictIfNeeded() {
-        while (this.cache.size > this.capacity) {
-          const oldestKey = this.cache.keys().next().value;
-          if (oldestKey === void 0) break;
-          const oldestFrame = this.cache.get(oldestKey);
-          oldestFrame?.close?.();
-          this.cache.delete(oldestKey);
-        }
-      }
-      dispose() {
-        for (const f of this.cache.values()) f?.close?.();
-        this.cache.clear();
-        this._pending.clear();
-      }
-    };
-  }
-});
-var VideoSequence;
-var init_Video = __esm({
-  "src/sequences/Video.ts"() {
-    init_Base();
-    init_FrameCache();
-    VideoSequence = class extends Sequence {
-      _sourceDuration = 0;
-      _audioBuffer = null;
-      _cache = null;
-      _canvas = null;
-      _ctx = null;
-      _drawSeq = 0;
-      async build() {
-        const data = await Assets.get(this.spec.asset);
-        this._sourceDuration = data.duration;
-        this._audioBuffer = this.spec.audio !== false ? data.audioBuffer : null;
-        this._cache = new FrameCache(data.sink, { capacity: 30 });
-        const probeFrame = await this._cache.getFrameAt(0);
-        const w = probeFrame?.displayWidth ?? 1920;
-        const h = probeFrame?.displayHeight ?? 1080;
-        const canvas = document.createElement("canvas");
-        canvas.width = w;
-        canvas.height = h;
-        this._canvas = canvas;
-        this._ctx = canvas.getContext("2d", { alpha: true });
-        if (probeFrame && this._ctx) this._ctx.drawImage(probeFrame, 0, 0);
-        const texture = Texture.from(canvas);
-        const sprite = new Sprite({ texture, label: this.spec.name });
-        sprite.cullable = true;
-        this.target = sprite;
-        this.intrinsicWidth = w;
-        this.intrinsicHeight = h;
-        if (this.duration === void 0) {
-          this.duration = this.spec.duration ?? data.duration ?? this.root.duration;
-        }
-        let currentTime = 0;
-        const seq = this;
-        Object.defineProperty(sprite, "currentTime", {
-          get() {
-            return currentTime;
-          },
-          set(v) {
-            currentTime = v;
-            const mySeq = ++seq._drawSeq;
-            const lookup = seq.spec.loop && seq._sourceDuration > 0 ? v % seq._sourceDuration : v;
-            seq._cache.getFrameAt(lookup).then((frame) => {
-              if (mySeq !== seq._drawSeq) return;
-              if (!frame || !seq._ctx) return;
-              seq._ctx.drawImage(frame, 0, 0);
-              texture.source.update();
-            }).catch((err) => {
-              console.warn("pixi-effects: video frame draw failed:", err);
-            });
-          }
-        });
-        this.buildFilters();
-      }
-      bindTimeline(timeline) {
-        super.bindTimeline(timeline);
-        const playDuration = this.spec.loop ? this.duration : Math.min(this.duration, this._sourceDuration);
-        timeline.fromTo(
-          this.target,
-          { currentTime: 0 },
-          { currentTime: playDuration, duration: playDuration, ease: "none" },
-          this.at
-        );
-      }
-      collectAudio(out, baseTime) {
-        if (!this._audioBuffer) return;
-        const initialVolume = this.spec.volume ?? 1;
-        out.push({
-          buffer: this._audioBuffer,
-          loop: !!this.spec.loop,
-          start: baseTime + this.at,
-          end: baseTime + this.at + this.duration,
-          initialVolume,
-          volumeKeyframes: []
-        });
-      }
-      async awaitFrameAt(time) {
-        const mySeq = ++this._drawSeq;
-        const lookup = this.spec.loop && this._sourceDuration > 0 ? time % this._sourceDuration : time;
-        let frame = null;
-        try {
-          frame = await this._cache.getFrameAt(lookup);
-        } catch (err) {
-          console.warn("pixi-effects: awaitFrameAt failed at", time, "s \u2014", err);
-          return;
-        }
-        if (mySeq !== this._drawSeq) return;
-        if (frame && this._ctx) {
-          try {
-            this._ctx.drawImage(frame, 0, 0);
-            this.target.texture.source.update();
-          } catch (err) {
-            console.warn("pixi-effects: drawImage failed at", time, "s \u2014", err);
-          }
-        }
-      }
-      destroy() {
-        this._cache?.dispose();
-        this._cache = null;
-        super.destroy();
-      }
-    };
-  }
-});
-function seedGeometry(state, spec, scope) {
-  const keys = GEOMETRY_KEYS_BY_SHAPE[spec.shape];
-  for (const k of keys) {
-    const v = spec[k];
-    if (v !== void 0) state[k] = num(v, scope);
-  }
-}
-function seedStyle(state, initial, scope) {
-  for (const k of STYLE_KEYS) {
-    const v = initial[k];
-    if (v === void 0) continue;
-    state[k] = COLOR_KEYS.has(k) ? v : numOrZero(v, scope);
-  }
-}
-function stripLive(props, liveKeys) {
-  if (!props) return props;
-  const out = {};
-  let changed = false;
-  for (const k of Object.keys(props)) {
-    if (liveKeys.has(k)) {
-      changed = true;
-      continue;
-    }
-    out[k] = props[k];
-  }
-  return changed ? out : props;
-}
-function stripLiveKeyframe(kf, liveKeys) {
-  return {
-    ...kf,
-    set: stripLive(kf.set, liveKeys),
-    to: stripLive(kf.to, liveKeys),
-    from: stripLive(kf.from, liveKeys)
-  };
-}
-function pickLive(props, liveKeys) {
-  if (!props) return null;
-  const out = {};
-  let any = false;
-  for (const k of Object.keys(props)) {
-    if (liveKeys.has(k)) {
-      out[k] = props[k];
-      any = true;
-    }
-  }
-  return any ? out : null;
-}
-function resolveLiveValue(key, value, scope) {
-  if (COLOR_KEYS.has(key)) return value;
-  return numOrZero(value, scope);
-}
-function applyState(g, s) {
-  if (s.fillColor !== void 0) {
-    g.fill({ color: s.fillColor, alpha: s.fillAlpha });
-  }
-  if (s.strokeColor !== void 0 && s.strokeWidth > 0) {
-    g.stroke({ color: s.strokeColor, alpha: s.strokeAlpha, width: s.strokeWidth });
-  }
-}
-function drawRectFromState(g, s) {
-  const w = s.width ?? 0;
-  const h = s.height ?? 0;
-  const r = s.cornerRadius ?? 0;
-  const ax = s.anchorX ?? 0.5;
-  const ay = s.anchorY ?? 0.5;
-  const x = 0 - ax * w;
-  const y = 0 - ay * h;
-  if (r > 0) g.roundRect(x, y, w, h, r);
-  else g.rect(x, y, w, h);
-}
-function drawCircleFromState(g, s) {
-  const r = s.radius ?? 0;
-  const ax = s.anchorX ?? 0.5;
-  const ay = s.anchorY ?? 0.5;
-  g.circle((0.5 - ax) * 2 * r, (0.5 - ay) * 2 * r, r);
-}
-function drawEllipseFromState(g, s) {
-  const rx = s.radiusX ?? 0;
-  const ry = s.radiusY ?? 0;
-  const ax = s.anchorX ?? 0.5;
-  const ay = s.anchorY ?? 0.5;
-  g.ellipse((0.5 - ax) * 2 * rx, (0.5 - ay) * 2 * ry, rx, ry);
-}
-function makeLineDraw(spec, scope) {
-  const fx = num(spec.from[0], scope);
-  const fy = num(spec.from[1], scope);
-  const tx = num(spec.to[0], scope);
-  const ty = num(spec.to[1], scope);
-  return (g) => {
-    g.moveTo(fx, fy);
-    g.lineTo(tx, ty);
-  };
-}
-function makePolygonDraw(spec, scope) {
-  if (spec.points.length === 0) return () => {
-  };
-  const flat = [];
-  for (const [x, y] of spec.points) flat.push(num(x, scope), num(y, scope));
-  const closed = !spec.open;
-  return (g) => {
-    g.poly(flat, closed);
-  };
-}
-function makePathDraw(spec) {
-  return (g) => {
-    g.path(new GraphicsPath(spec.d));
-  };
-}
-function makeDrawGeometry(spec, scope, state) {
-  const stateDrawer = STATE_DRAWERS[spec.shape];
-  if (stateDrawer) return (g) => stateDrawer(g, state);
-  switch (spec.shape) {
-    case "line":
-      return makeLineDraw(spec, scope);
-    case "polygon":
-      return makePolygonDraw(spec, scope);
-    case "path":
-      return makePathDraw(spec);
-  }
-  return () => {
-  };
-}
-function bindLiveKeyframes(timeline, state, liveKeys, keyframes, parentDuration, scope, offset, colorSpace) {
-  for (const kf of keyframes) {
-    const at = offset + resolveAt(kf.at, parentDuration);
-    const duration = kf.duration ?? 0;
-    const ease = kf.ease ?? "none";
-    if (kf.set) {
-      const live = pickLive(kf.set, liveKeys);
-      if (live) {
-        for (const [k, v] of Object.entries(live)) {
-          const resolved = resolveLiveValue(k, v, scope);
-          timeline.call(() => {
-            state[k] = resolved;
-          }, [], at);
-        }
-      }
-    }
-    const fromLive = pickLive(kf.from, liveKeys);
-    const toLive = pickLive(kf.to, liveKeys);
-    const allKeys = /* @__PURE__ */ new Set([
-      ...fromLive ? Object.keys(fromLive) : [],
-      ...toLive ? Object.keys(toLive) : []
-    ]);
-    for (const k of allKeys) {
-      const key = k;
-      const fromRaw = fromLive?.[key];
-      const toRaw = toLive?.[key];
-      const fromValue = fromRaw !== void 0 ? resolveLiveValue(key, fromRaw, scope) : void 0;
-      const toValue = toRaw !== void 0 ? resolveLiveValue(key, toRaw, scope) : void 0;
-      tweenLiveKey(timeline, state, key, fromValue, toValue, duration, ease, at, colorSpace);
-    }
-  }
-}
-function tweenLiveKey(timeline, state, key, fromValue, toValue, duration, ease, at, colorSpace) {
-  if (COLOR_KEYS.has(key) && toValue !== void 0) {
-    tweenColor(
-      timeline,
-      state,
-      key,
-      fromValue,
-      toValue,
-      duration,
-      ease,
-      at,
-      colorSpace
-    );
-  } else if (toValue !== void 0) {
-    if (fromValue !== void 0) {
-      timeline.fromTo(state, { [key]: fromValue }, { [key]: toValue, duration, ease }, at);
-    } else {
-      timeline.to(state, { [key]: toValue, duration, ease }, at);
-    }
-  }
-}
-function num(v, scope) {
-  if (typeof v === "number") return v;
-  if (isExpr(v)) return evaluateExpr(v, scope);
-  const parsed = parseFloat(v);
-  return Number.isNaN(parsed) ? 0 : parsed;
-}
-function numOrZero(v, scope) {
-  if (typeof v === "number") return v;
-  if (typeof v === "string") return num(v, scope);
-  return 0;
-}
-var STYLE_KEYS, COLOR_KEYS, GEOMETRY_KEYS_BY_SHAPE, ANCHORED_SHAPES, ShapeSequence, STATE_DRAWERS;
-var init_Shape = __esm({
-  "src/sequences/Shape.ts"() {
-    init_Base();
-    init_Parser();
-    init_Timeline();
-    init_colorTween();
-    STYLE_KEYS = ["fillColor", "fillAlpha", "strokeColor", "strokeAlpha", "strokeWidth"];
-    COLOR_KEYS = /* @__PURE__ */ new Set(["fillColor", "strokeColor"]);
-    GEOMETRY_KEYS_BY_SHAPE = {
-      rect: ["width", "height", "cornerRadius", "anchorX", "anchorY"],
-      circle: ["radius", "anchorX", "anchorY"],
-      ellipse: ["radiusX", "radiusY", "anchorX", "anchorY"],
-      line: [],
-      polygon: [],
-      path: []
-    };
-    ANCHORED_SHAPES = /* @__PURE__ */ new Set(["rect", "circle", "ellipse"]);
-    ShapeSequence = class extends Sequence {
-      _state = {
-        fillColor: void 0,
-        fillAlpha: 1,
-        strokeColor: void 0,
-        strokeAlpha: 1,
-        strokeWidth: 0
-      };
-      // Closure that draws the path commands for this shape kind from the
-      // (possibly tweened) `_state`. Bound once at build; called on every frame
-      // by `Container.onRender`.
-      _drawGeometry = () => {
-      };
-      _liveKeys = new Set(STYLE_KEYS);
-      async build() {
-        const graphics = new Graphics({ label: this.spec.name });
-        graphics.cullable = true;
-        this.target = graphics;
-        if (this.duration === void 0) {
-          this.duration = this.parent?.duration ?? this.root.duration;
-        }
-        const scope = this.scope();
-        const geomKeys = GEOMETRY_KEYS_BY_SHAPE[this.spec.shape];
-        for (const k of geomKeys) this._liveKeys.add(k);
-        seedGeometry(this._state, this.spec, scope);
-        seedStyle(this._state, this.spec.initial ?? {}, scope);
-        this._drawGeometry = makeDrawGeometry(this.spec, scope, this._state);
-        this._drawGeometry(graphics);
-        applyState(graphics, this._state);
-        const bounds = graphics.getLocalBounds();
-        this.intrinsicWidth = bounds.width;
-        this.intrinsicHeight = bounds.height;
-        if (!ANCHORED_SHAPES.has(this.spec.shape)) {
-          graphics.pivot.set(bounds.x + bounds.width / 2, bounds.y + bounds.height / 2);
-        }
-        graphics.onRender = () => {
-          graphics.clear();
-          this._drawGeometry(graphics);
-          applyState(graphics, this._state);
-        };
-        this.buildFilters();
-      }
-      bindTimeline(timeline, offset = 0) {
-        if (!this.target) return;
-        const scope = this.scope();
-        const initial = stripLive(this.spec.initial, this._liveKeys);
-        const keyframes = this.spec.keyframes ? this.spec.keyframes.map((kf) => stripLiveKeyframe(kf, this._liveKeys)) : void 0;
-        applyInitial(this.target, initial, scope);
-        applyKeyframes(timeline, this.target, keyframes, this.duration, scope, [], offset);
-        const colorSpace = this.spec.colorSpace ?? "rgb";
-        bindLiveKeyframes(timeline, this._state, this._liveKeys, this.spec.keyframes ?? [], this.duration, scope, offset, colorSpace);
-        const startTime = offset + this.at;
-        const endTime = startTime + this.duration;
-        this.target.renderable = startTime <= 0;
-        timeline.set(this.target, { renderable: true }, startTime);
-        timeline.set(this.target, { renderable: false }, endTime);
-      }
-    };
-    STATE_DRAWERS = {
-      rect: drawRectFromState,
-      circle: drawCircleFromState,
-      ellipse: drawEllipseFromState
-    };
-  }
-});
-
-// src/core/Composition.ts
-async function getCompositionSequence() {
-  if (!_CompositionSequence) {
-    _CompositionSequence = (await Promise.resolve().then(() => (init_Composition2(), Composition_exports))).CompositionSequence;
-  }
-  return _CompositionSequence;
-}
-async function buildSequenceTree(specs, parent, root) {
-  const out = [];
-  for (const spec of specs) {
-    let Cls = staticTypes[spec.type];
-    if (!Cls && spec.type === "composition") {
-      Cls = await getCompositionSequence();
-    }
-    if (!Cls) {
-      console.warn(`pixi-effects: unknown sequence type "${spec.type}"`);
-      continue;
-    }
-    const seq = new Cls(spec, parent, root);
-    await seq.build();
-    if (seq.duration === void 0) {
-      seq.duration = parent?.duration ?? root.duration;
-    }
-    out.push(seq);
-  }
-  return out;
-}
-var _CompositionSequence, staticTypes;
-var init_Composition = __esm({
-  "src/core/Composition.ts"() {
-    init_Image();
-    init_Text();
-    init_Audio();
-    init_Video();
-    init_Shape();
-    _CompositionSequence = null;
-    staticTypes = {
-      image: ImageSequence,
-      text: TextSequence,
-      audio: AudioSequence,
-      video: VideoSequence,
-      shape: ShapeSequence
-    };
-  }
-});
-
-// src/sequences/Composition.ts
-var Composition_exports = {};
-__export(Composition_exports, {
-  CompositionSequence: () => CompositionSequence
-});
-var CompositionSequence;
-var init_Composition2 = __esm({
-  "src/sequences/Composition.ts"() {
-    init_Base();
-    init_Composition();
-    CompositionSequence = class extends Sequence {
-      _innerContainer = null;
-      _compositionShape = null;
-      _children = [];
-      async build() {
-        const width = this.spec.width ?? this.parent?.width ?? this.root.width;
-        const height = this.spec.height ?? this.parent?.height ?? this.root.height;
-        if (this.duration === void 0) {
-          this.duration = this.spec.duration ?? this.parent?.duration ?? this.root.duration;
-        }
-        const wrapper = new Container();
-        wrapper.cullable = true;
-        wrapper.cullableChildren = true;
-        wrapper.cullArea = new Rectangle(0, 0, width, height);
-        const inner = new Container();
-        inner.cullable = true;
-        inner.cullableChildren = true;
-        wrapper.addChild(inner);
-        this.target = wrapper;
-        this.intrinsicWidth = width;
-        this.intrinsicHeight = height;
-        this._innerContainer = inner;
-        this._compositionShape = { width, height, duration: this.duration };
-        this._children = await buildSequenceTree(
-          this.spec.sequences ?? [],
-          this._compositionShape,
-          this.root
-        );
-        for (const child of this._children) {
-          if (child.target) inner.addChild(child.target);
-          const maskSpec = child.spec.mask;
-          if (maskSpec && child.target) {
-            const built = await buildSequenceTree([maskSpec], this._compositionShape, this.root);
-            const maskSeq = built[0];
-            if (maskSeq?.target) {
-              inner.addChild(maskSeq.target);
-              const inverse = child.spec.maskInverted ?? false;
-              const t = child.target;
-              if (typeof t.setMask === "function") {
-                t.setMask({ mask: maskSeq.target, inverse });
-              } else {
-                t.mask = maskSeq.target;
-              }
-              child.maskSequence = maskSeq;
-            }
-          }
-        }
-        this.buildFilters();
-      }
-      bindTimeline(timeline, offset = 0) {
-        super.bindTimeline(timeline, offset);
-        const childOffset = offset + this.at;
-        for (const child of this._children) {
-          child.bindTimeline(timeline, childOffset);
-          child.maskSequence?.bindTimeline(timeline, childOffset);
-        }
-      }
-      collectAudio(out, baseTime) {
-        super.collectAudio(out, baseTime);
-        const childBase = baseTime + this.at;
-        for (const child of this._children) child.collectAudio(out, childBase);
-      }
-      destroy() {
-        for (const c of this._children) c.destroy();
-        super.destroy();
-      }
-    };
-  }
-});
 var registered = false;
 function ensureLoadersRegistered(audioContext) {
   if (registered) return;
@@ -1826,9 +64,6 @@ async function loadAssetBundle(assets, audioContext) {
   return await Assets.loadBundle("pixi-effects");
 }
 
-// src/core/Movie.ts
-init_Composition2();
-
 // src/core/AudioMixer.ts
 async function mixdown(audios, totalDuration, sampleRate = 44100) {
   if (audios.length === 0) return null;
@@ -1931,9 +166,6 @@ async function exportFrames(movie, options = {}) {
     movie.app.ticker.start();
   }
 }
-
-// src/core/Transitions.ts
-init_Timeline();
 var MODE_CODES = {
   "wipe-left": 0,
   "wipe-right": 1,
@@ -1943,7 +175,7 @@ var MODE_CODES = {
   "iris-out": 5,
   "dissolve": 6
 };
-var GL_FRAGMENT2 = `
+var GL_FRAGMENT = `
 in vec2 vTextureCoord;
 uniform sampler2D uTexture;
 uniform vec4 uInputSize;     // PIXI-bound: xy = sprite render texture size (with padding)
@@ -2063,7 +295,7 @@ void main(void) {
     finalColor = raw * reveal;
 }
 `;
-var WGSL_SOURCE2 = `
+var WGSL_SOURCE = `
 struct GlobalFilterUniforms {
   uInputSize: vec4<f32>,
   uInputPixel: vec4<f32>,
@@ -2211,12 +443,12 @@ var TransitionMaskFilter = class extends Filter {
     super({
       glProgram: GlProgram.from({
         vertex: defaultFilterVert,
-        fragment: GL_FRAGMENT2,
+        fragment: GL_FRAGMENT,
         name: "transition-mask-filter"
       }),
       gpuProgram: GpuProgram.from({
-        vertex: { source: WGSL_SOURCE2, entryPoint: "mainVertex" },
-        fragment: { source: WGSL_SOURCE2, entryPoint: "mainFragment" }
+        vertex: { source: WGSL_SOURCE, entryPoint: "mainVertex" },
+        fragment: { source: WGSL_SOURCE, entryPoint: "mainFragment" }
       }),
       resources: {
         transitionUniforms: new UniformGroup({
@@ -2300,6 +532,14 @@ function expandTransitions(spec) {
   const parentDuration = out.duration ?? Infinity;
   const compW = out.width;
   const compH = out.height;
+  const threeDByName = new Set(sequences.filter((s) => s.name && s.threeD).map((s) => s.name));
+  transitions.forEach((t, i) => {
+    for (const name of [t.from, t.to]) {
+      if (threeDByName.has(name)) {
+        console.warn(`pixi-effects: transitions[${i}]: "${name}" is threeD, but transitions are not supported on threeD layers yet \u2014 it will render without the camera`);
+      }
+    }
+  });
   const masksParticipants = /* @__PURE__ */ new Set();
   for (const t of transitions) {
     if (t.kind === "wipe" || t.kind === "iris" || t.kind === "dissolve" || t.kind === "zoom") {
@@ -2761,6 +1001,8 @@ var Movie = class {
         this.audioBuffer = await mixdown(audios, this.duration, audioContext.sampleRate);
       }
       this.timeline.progress(1).progress(0);
+      await this._awaitVideoFrames();
+      this._updateSpace();
       this.app.renderer.render({ container: this.app.stage });
       this._initState = "ready";
       this.emit("ready");
@@ -2779,6 +1021,7 @@ var Movie = class {
     this.currentFrame = Math.max(0, Math.min(frame, this.totalFrames));
     this.timeline.time(this.currentFrame / this.frameRate);
     await this._awaitVideoFrames();
+    this._updateSpace();
     this.app?.renderer?.render({ container: this.app.stage });
     this.emit("frame", { frame: this.currentFrame, totalFrames: this.totalFrames });
   }
@@ -2788,11 +1031,16 @@ var Movie = class {
     collectVideoSequences(this._rootSequence, collected);
     const t = this.currentFrame / this.frameRate;
     await Promise.all(collected.map((v) => {
-      const local = t - v.at;
+      const local = t - (v.absoluteStart ?? v.at);
       if (local < 0 || local > (v.duration ?? 0)) return Promise.resolve();
       return v.awaitFrameAt(local);
     }));
   }
+  /** Projects every `threeD` layer for the current frame (see src/space). */
+  _updateSpace() {
+    if (!this._rootSequence || !this.app) return;
+    this._rootSequence.updateSpace(this.currentFrame / this.frameRate, this.app.renderer);
+  }
   play() {
     if (this._initState !== "ready") return;
     if (this.currentFrame >= this.totalFrames) this.currentFrame = 0;
@@ -2901,6 +1149,7 @@ function collectVideoSequences(seq, out) {
   if (typeof seq.awaitFrameAt === "function") {
     out.push(seq);
   }
+  if (seq.maskSequence) collectVideoSequences(seq.maskSequence, out);
   for (const child of seq._children ?? []) {
     collectVideoSequences(child, out);
   }
@@ -2938,8 +1187,8 @@ function kenBurns(opts) {
     const pivotXExpr = `w * ${origin[0]}`;
     const pivotYExpr = `h * ${origin[1]}`;
     const initialScale = `${baseScale} * ${fromZ}`;
-    const xExpr = `W/2 - (${baseScale}) * ${fromZ} * w * ${0.5 - origin[0]}`;
-    const yExpr = `H/2 - (${baseScale}) * ${fromZ} * h * ${0.5 - origin[1]}`;
+    const xExpr = `W * ${origin[0]}`;
+    const yExpr = `H * ${origin[1]}`;
     initial = {
       x: xExpr,
       y: yExpr,
@@ -3018,6 +1267,26 @@ function clamp(v, lo, hi) {
   return Math.max(lo, Math.min(hi, v));
 }
 
-export { Movie, kenBurns };
+// src/transforms/withFade.ts
+function withFade(spec, opts) {
+  const at = spec.at ?? 0;
+  if (opts.in != null && opts.in > 0) {
+    spec.initial = { ...spec.initial ?? {}, alpha: 0 };
+    const kf = { at, to: { alpha: 1 }, duration: opts.in };
+    spec.keyframes = [...spec.keyframes ?? [], kf];
+  }
+  if (opts.out != null && opts.out > 0) {
+    if (spec.duration == null) {
+      throw new Error(
+        "withFade(spec, { out }) requires spec.duration to be set so the fade-out can be anchored to the sequence end. Set spec.duration before passing the spec in."
+      );
+    }
+    const kf = { at: at + spec.duration - opts.out, to: { alpha: 0 }, duration: opts.out };
+    spec.keyframes = [...spec.keyframes ?? [], kf];
+  }
+  return spec;
+}
+
+export { Movie, kenBurns, withFade };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map