@holoscript/core 7.0.0 → 8.0.0

package/dist/chunk-YYXH45E2.js

@@ -0,0 +1,426 @@
+// src/compiler/RemotionBridge.ts
+function bridgeToRemotion(composition, options = {}) {
+  const bridge = new RemotionBridgeImpl(options);
+  return bridge.convert(composition);
+}
+var RemotionBridgeImpl = class {
+  constructor(options = {}) {
+    this.width = options.width ?? 1920;
+    this.height = options.height ?? 1080;
+    this.fps = options.fps ?? 30;
+    this.defaultDurationSeconds = options.defaultDurationSeconds ?? 10;
+    this.include3DCanvas = options.include3DCanvas ?? true;
+    this.multiPass = options.multiPass ?? false;
+    this.componentImportPath = options.componentImportPath ?? "./components";
+    this.isTypeScript = (options.outputFormat ?? "typescript") === "typescript";
+  }
+  convert(composition) {
+    const durationInFrames = this.calculateDuration(composition);
+    const compositionConfig = {
+      id: this.sanitizeId(composition.name),
+      width: this.width,
+      height: this.height,
+      fps: this.fps,
+      durationInFrames
+    };
+    const sequences = this.extractSequences(composition);
+    const audioClips = this.extractAudioClips(composition);
+    const interpolationTracks = this.extractInterpolationTracks(composition);
+    const renderPasses = this.buildRenderPasses();
+    const componentSource = this.generateComponentSource(
+      composition,
+      sequences,
+      interpolationTracks
+    );
+    const rootSource = this.generateRootSource(compositionConfig, audioClips);
+    return {
+      composition: compositionConfig,
+      sequences,
+      audioClips,
+      componentSource,
+      rootSource,
+      interpolationTracks,
+      renderPasses
+    };
+  }
+  // ---------------------------------------------------------------------------
+  // Duration calculation
+  // ---------------------------------------------------------------------------
+  calculateDuration(composition) {
+    let maxTimeSeconds = this.defaultDurationSeconds;
+    for (const timeline of composition.timelines ?? []) {
+      for (const entry of timeline.entries ?? []) {
+        maxTimeSeconds = Math.max(maxTimeSeconds, entry.time + 1);
+      }
+    }
+    return Math.ceil(maxTimeSeconds * this.fps);
+  }
+  // ---------------------------------------------------------------------------
+  // Sequence extraction
+  // ---------------------------------------------------------------------------
+  extractSequences(composition) {
+    const sequences = [];
+    for (const timeline of composition.timelines ?? []) {
+      const entries = [...timeline.entries ?? []].sort((a, b) => a.time - b.time);
+      for (let i = 0; i < entries.length; i++) {
+        const entry = entries[i];
+        const nextEntry = entries[i + 1];
+        const startFrame = Math.round(entry.time * this.fps);
+        const endFrame = nextEntry ? Math.round(nextEntry.time * this.fps) : Math.round((entry.time + 1) * this.fps);
+        const sequence = {
+          name: `${timeline.name}_${i}`,
+          from: startFrame,
+          durationInFrames: Math.max(1, endFrame - startFrame),
+          component: this.actionToComponent(entry.action),
+          props: this.actionToProps(entry)
+        };
+        sequences.push(sequence);
+      }
+    }
+    return sequences;
+  }
+  actionToComponent(action) {
+    switch (action.kind) {
+      case "animate":
+        return "AnimateObject";
+      case "emit":
+        return "EmitEvent";
+      case "call":
+        return "CallMethod";
+      default:
+        return "Noop";
+    }
+  }
+  actionToProps(entry) {
+    const action = entry.action;
+    const props = { time: entry.time };
+    if (action.kind === "animate") {
+      props.target = action.target;
+      props.properties = action.properties;
+    } else if (action.kind === "emit") {
+      props.event = action.event;
+      props.data = action.data;
+    } else if (action.kind === "call") {
+      props.method = action.method;
+      props.args = action.args;
+    }
+    return props;
+  }
+  // ---------------------------------------------------------------------------
+  // Audio extraction
+  // ---------------------------------------------------------------------------
+  extractAudioClips(composition) {
+    const clips = [];
+    for (const audio of composition.audio ?? []) {
+      const clip = {
+        src: this.extractAudioSrc(audio)
+      };
+      for (const prop of audio.properties) {
+        if (prop.key === "volume" && typeof prop.value === "number") {
+          clip.volume = prop.value;
+        }
+        if (prop.key === "playbackRate" && typeof prop.value === "number") {
+          clip.playbackRate = prop.value;
+        }
+        if (prop.key === "spatial" && typeof prop.value === "boolean") {
+          clip.spatial = prop.value;
+        }
+        if (prop.key === "startTime" && typeof prop.value === "number") {
+          clip.startFrom = Math.round(prop.value * this.fps);
+        }
+      }
+      clips.push(clip);
+    }
+    return clips;
+  }
+  extractAudioSrc(audio) {
+    for (const prop of audio.properties) {
+      if (prop.key === "src" && typeof prop.value === "string") return prop.value;
+      if (prop.key === "source" && typeof prop.value === "string") return prop.value;
+      if (prop.key === "url" && typeof prop.value === "string") return prop.value;
+    }
+    return `./audio/${audio.name}.mp3`;
+  }
+  // ---------------------------------------------------------------------------
+  // Interpolation tracks
+  // ---------------------------------------------------------------------------
+  extractInterpolationTracks(composition) {
+    const trackMap = /* @__PURE__ */ new Map();
+    for (const timeline of composition.timelines ?? []) {
+      for (const entry of timeline.entries ?? []) {
+        if (entry.action.kind !== "animate") continue;
+        const target = entry.action.target;
+        const properties = entry.action.properties;
+        for (const [prop, value] of Object.entries(properties)) {
+          if (typeof value !== "number") continue;
+          const trackKey = `${target}.${prop}`;
+          if (!trackMap.has(trackKey)) {
+            trackMap.set(trackKey, {
+              target,
+              property: prop,
+              keyframes: []
+            });
+          }
+          const track = trackMap.get(trackKey);
+          track.keyframes.push({
+            frame: Math.round(entry.time * this.fps),
+            value
+          });
+        }
+      }
+    }
+    for (const track of trackMap.values()) {
+      track.keyframes.sort((a, b) => a.frame - b.frame);
+    }
+    return Array.from(trackMap.values());
+  }
+  // ---------------------------------------------------------------------------
+  // Render passes
+  // ---------------------------------------------------------------------------
+  buildRenderPasses() {
+    const passes = [
+      { name: "Beauty", type: "beauty", outputSuffix: "", enabled: true }
+    ];
+    if (this.multiPass) {
+      passes.push(
+        { name: "Depth", type: "depth", outputSuffix: "_depth", enabled: true },
+        { name: "Normal", type: "normal", outputSuffix: "_normal", enabled: true },
+        { name: "ID Mask", type: "id", outputSuffix: "_id", enabled: true },
+        { name: "Wireframe", type: "wireframe", outputSuffix: "_wire", enabled: false }
+      );
+    }
+    return passes;
+  }
+  // ---------------------------------------------------------------------------
+  // Code generation: Scene component
+  // ---------------------------------------------------------------------------
+  generateComponentSource(composition, sequences, tracks) {
+    this.isTypeScript ? "tsx" : "jsx";
+    const typeAnnotation = this.isTypeScript ? ": React.FC" : "";
+    const lines = [];
+    lines.push(`// Auto-generated by HoloScript RemotionBridge`);
+    lines.push(`// Source composition: "${composition.name}"`);
+    lines.push(``);
+    lines.push(`import React from 'react';`);
+    lines.push(
+      `import { useCurrentFrame, useVideoConfig, interpolate, Sequence } from 'remotion';`
+    );
+    if (this.include3DCanvas) {
+      lines.push(`import { Canvas } from '@react-three/fiber';`);
+      lines.push(`import { OrbitControls, Environment } from '@react-three/drei';`);
+    }
+    lines.push(``);
+    if (tracks.length > 0) {
+      lines.push(`// --- Interpolation Tracks ---`);
+      lines.push(``);
+      for (const track of tracks) {
+        const fnName = `get_${this.sanitizeId(track.target)}_${track.property}`;
+        const inputRange = track.keyframes.map((k) => k.frame);
+        const outputRange = track.keyframes.map((k) => k.value);
+        lines.push(`function ${fnName}(frame${this.isTypeScript ? ": number" : ""}) {`);
+        lines.push(
+          `  return interpolate(frame, ${JSON.stringify(inputRange)}, ${JSON.stringify(outputRange)}, {`
+        );
+        lines.push(`    extrapolateLeft: 'clamp',`);
+        lines.push(`    extrapolateRight: 'clamp',`);
+        lines.push(`  });`);
+        lines.push(`}`);
+        lines.push(``);
+      }
+    }
+    if (this.include3DCanvas) {
+      lines.push(`function SceneObjects() {`);
+      lines.push(`  const frame = useCurrentFrame();`);
+      lines.push(``);
+      lines.push(`  return (`);
+      lines.push(`    <>`);
+      for (const light of composition.lights ?? []) {
+        lines.push(`      ${this.lightToJSX(light)}`);
+      }
+      for (const obj of composition.objects ?? []) {
+        lines.push(`      ${this.objectToJSX(obj, tracks)}`);
+      }
+      for (const group of composition.spatialGroups ?? []) {
+        lines.push(`      ${this.groupToJSX(group, tracks)}`);
+      }
+      lines.push(`    </>`);
+      lines.push(`  );`);
+      lines.push(`}`);
+      lines.push(``);
+    }
+    const componentName = this.sanitizeId(composition.name) + "Scene";
+    lines.push(`export const ${componentName}${typeAnnotation} = () => {`);
+    lines.push(`  const frame = useCurrentFrame();`);
+    lines.push(`  const { durationInFrames } = useVideoConfig();`);
+    lines.push(``);
+    lines.push(`  return (`);
+    lines.push(`    <div style={{ width: '100%', height: '100%', background: '#000' }}>`);
+    for (const seq of sequences) {
+      lines.push(
+        `      <Sequence from={${seq.from}} durationInFrames={${seq.durationInFrames}} name="${seq.name}">`
+      );
+      lines.push(`        {/* ${seq.component}: ${JSON.stringify(seq.props)} */}`);
+      lines.push(`      </Sequence>`);
+    }
+    if (this.include3DCanvas) {
+      lines.push(`      <Canvas camera={{ position: [0, 1.6, 5], fov: 60 }}>`);
+      lines.push(`        <SceneObjects />`);
+      lines.push(`        <OrbitControls />`);
+      lines.push(`        <Environment preset="apartment" />`);
+      lines.push(`      </Canvas>`);
+    }
+    lines.push(`    </div>`);
+    lines.push(`  );`);
+    lines.push(`};`);
+    lines.push(``);
+    lines.push(`export default ${componentName};`);
+    return lines.join("\n");
+  }
+  // ---------------------------------------------------------------------------
+  // Code generation: Remotion Root
+  // ---------------------------------------------------------------------------
+  generateRootSource(config, audioClips) {
+    const lines = [];
+    const componentName = config.id + "Scene";
+    lines.push(`// Auto-generated Remotion Root by HoloScript RemotionBridge`);
+    lines.push(``);
+    lines.push(`import { Composition } from 'remotion';`);
+    lines.push(`import { ${componentName} } from '${this.componentImportPath}/${componentName}';`);
+    if (audioClips.length > 0) {
+      lines.push(`import { Audio } from 'remotion';`);
+    }
+    lines.push(``);
+    lines.push(`export const RemotionRoot = () => {`);
+    lines.push(`  return (`);
+    lines.push(`    <>`);
+    lines.push(`      <Composition`);
+    lines.push(`        id="${config.id}"`);
+    lines.push(`        component={${componentName}}`);
+    lines.push(`        durationInFrames={${config.durationInFrames}}`);
+    lines.push(`        fps={${config.fps}}`);
+    lines.push(`        width={${config.width}}`);
+    lines.push(`        height={${config.height}}`);
+    lines.push(`      />`);
+    lines.push(`    </>`);
+    lines.push(`  );`);
+    lines.push(`};`);
+    return lines.join("\n");
+  }
+  // ---------------------------------------------------------------------------
+  // JSX generation helpers
+  // ---------------------------------------------------------------------------
+  lightToJSX(light) {
+    const props = this.propsToJSXAttrs(light.properties);
+    switch (light.lightType) {
+      case "directional":
+        return `<directionalLight ${props} />`;
+      case "point":
+        return `<pointLight ${props} />`;
+      case "spot":
+        return `<spotLight ${props} />`;
+      case "hemisphere":
+        return `<hemisphereLight ${props} />`;
+      case "ambient":
+        return `<ambientLight ${props} />`;
+      default:
+        return `<pointLight ${props} />`;
+    }
+  }
+  objectToJSX(obj, tracks) {
+    const geometry = this.inferGeometry(obj);
+    const position = this.extractVec3(obj.properties, "position", [0, 0, 0]);
+    const scale = this.extractVec3(obj.properties, "scale", [1, 1, 1]);
+    const color = this.extractColor(obj);
+    const hasAnimation = tracks.some((t) => t.target === obj.name);
+    const positionExpr = hasAnimation ? `[get_${this.sanitizeId(obj.name)}_x?.(frame) ?? ${position[0]}, get_${this.sanitizeId(obj.name)}_y?.(frame) ?? ${position[1]}, get_${this.sanitizeId(obj.name)}_z?.(frame) ?? ${position[2]}]` : `[${position.join(", ")}]`;
+    return [
+      `<mesh position={${positionExpr}} scale={[${scale.join(", ")}]} name="${obj.name}">`,
+      `        <${geometry}Geometry />`,
+      `        <meshStandardMaterial color="${color}" />`,
+      `      </mesh>`
+    ].join("\n      ");
+  }
+  groupToJSX(group, tracks) {
+    const position = this.extractGroupVec3(group, "position", [0, 0, 0]);
+    const children = (group.objects ?? []).map((o) => `        ${this.objectToJSX(o, tracks)}`).join("\n");
+    return [
+      `<group position={[${position.join(", ")}]} name="${group.name}">`,
+      children,
+      `      </group>`
+    ].join("\n      ");
+  }
+  // ---------------------------------------------------------------------------
+  // Property extraction
+  // ---------------------------------------------------------------------------
+  extractVec3(properties, key, defaultVal) {
+    for (const prop of properties) {
+      if (prop.key === key && Array.isArray(prop.value)) {
+        const arr = prop.value;
+        return [arr[0] ?? defaultVal[0], arr[1] ?? defaultVal[1], arr[2] ?? defaultVal[2]];
+      }
+    }
+    return defaultVal;
+  }
+  extractGroupVec3(group, key, defaultVal) {
+    for (const prop of group.properties) {
+      if (prop.key === key && Array.isArray(prop.value)) {
+        const arr = prop.value;
+        return [arr[0] ?? defaultVal[0], arr[1] ?? defaultVal[1], arr[2] ?? defaultVal[2]];
+      }
+    }
+    return defaultVal;
+  }
+  extractColor(obj) {
+    for (const prop of obj.properties) {
+      if (prop.key === "color" && typeof prop.value === "string") return prop.value;
+    }
+    for (const trait of obj.traits ?? []) {
+      if (trait.config["color"] && typeof trait.config["color"] === "string") {
+        return trait.config["color"];
+      }
+    }
+    return "#888888";
+  }
+  inferGeometry(obj) {
+    for (const prop of obj.properties) {
+      if ((prop.key === "geometry" || prop.key === "shape") && typeof prop.value === "string") {
+        return this.mapGeometryName(prop.value);
+      }
+    }
+    return "box";
+  }
+  mapGeometryName(name) {
+    const map = {
+      box: "box",
+      cube: "box",
+      sphere: "sphere",
+      orb: "sphere",
+      cylinder: "cylinder",
+      cone: "cone",
+      plane: "plane",
+      torus: "torus",
+      ring: "torus"
+    };
+    return map[name.toLowerCase()] ?? "box";
+  }
+  propsToJSXAttrs(properties) {
+    return properties.map((p) => {
+      if (typeof p.value === "string") return `${p.key}="${p.value}"`;
+      if (typeof p.value === "number") return `${p.key}={${p.value}}`;
+      if (typeof p.value === "boolean") return p.value ? p.key : "";
+      if (Array.isArray(p.value)) return `${p.key}={[${p.value.join(", ")}]}`;
+      return "";
+    }).filter(Boolean).join(" ");
+  }
+  // ---------------------------------------------------------------------------
+  // Utility
+  // ---------------------------------------------------------------------------
+  sanitizeId(name) {
+    return name.replace(/[^a-zA-Z0-9]/g, "_").replace(/^[0-9]/, "_$&");
+  }
+};
+var RemotionBridge_default = bridgeToRemotion;
+
+export { RemotionBridgeImpl, RemotionBridge_default, bridgeToRemotion };
+//# sourceMappingURL=chunk-YYXH45E2.js.map
+//# sourceMappingURL=chunk-YYXH45E2.js.map