@cueframe/kernel 0.1.3 → 0.2.0

package/dist/chunk-5OTQ7M43.js

@@ -0,0 +1,718 @@
+import {
+  cacheDir,
+  componentDir
+} from "./chunk-WB2VFDQZ.js";
+import {
+  COMPONENT_CHROMIUM_OPTIONS
+} from "./chunk-CGHTMZNC.js";
+import {
+  ComponentRuntimeError,
+  ComponentRuntimeErrorCode
+} from "./chunk-LQUWKBST.js";
+
+// ../execution/component-runtime/src/browserFirewall.ts
+function isLoopbackHost(hostname) {
+  return hostname === "localhost" || hostname === "127.0.0.1" || hostname === "[::1]";
+}
+function decideComponentRequest(url, resourceType, documentOrigin, allowedAssetOrigins) {
+  let parsed;
+  try {
+    parsed = new URL(url);
+  } catch {
+    return { allow: false, documentOrigin };
+  }
+  if (parsed.protocol === "data:" || parsed.protocol === "blob:" || parsed.protocol === "about:") {
+    return { allow: true, documentOrigin };
+  }
+  if (parsed.protocol !== "http:" && parsed.protocol !== "https:") {
+    return { allow: false, documentOrigin };
+  }
+  if (documentOrigin === null && resourceType === "Document" && isLoopbackHost(parsed.hostname)) {
+    return { allow: true, documentOrigin: parsed.origin };
+  }
+  return {
+    allow: parsed.origin === documentOrigin || allowedAssetOrigins.has(parsed.origin),
+    documentOrigin
+  };
+}
+var PAGE_LOCKDOWN = `
+Object.defineProperties(globalThis, {
+  open: { value: undefined },
+  Worker: { value: undefined },
+  SharedWorker: { value: undefined },
+  RTCPeerConnection: { value: undefined },
+  webkitRTCPeerConnection: { value: undefined },
+  WebSocket: { value: undefined },
+  EventSource: { value: undefined }
+});
+`;
+var COMPONENT_PAGE_LOCKDOWN = PAGE_LOCKDOWN;
+async function installComponentRequestFirewall(browser, allowedAssetOrigins) {
+  let closing = false;
+  const denied = [];
+  const closeBrowser = browser.close.bind(browser);
+  browser.close = async (options) => {
+    closing = true;
+    return await closeBrowser(options);
+  };
+  const configureSession = async (client) => {
+    let documentOrigin = null;
+    client.on("Fetch.requestPaused", (event) => {
+      const decision = decideComponentRequest(
+        event.request.url,
+        event.resourceType,
+        documentOrigin,
+        allowedAssetOrigins
+      );
+      documentOrigin = decision.documentOrigin;
+      if (!decision.allow) denied.push(event.request.url);
+      const action = decision.allow ? client.send("Fetch.continueRequest", { requestId: event.requestId }) : client.send("Fetch.failRequest", { requestId: event.requestId, errorReason: "BlockedByClient" });
+      void action.catch(() => {
+      });
+    });
+    await client.send("Fetch.enable", { patterns: [{ urlPattern: "*" }] });
+    await client.send("Page.addScriptToEvaluateOnNewDocument", { source: PAGE_LOCKDOWN });
+    await client.send("Runtime.runIfWaitingForDebugger");
+  };
+  browser.connection.on("sessionattached", (client) => {
+    void configureSession(client).catch(() => {
+      if (!closing) void browser.close({ silent: true }).catch(() => {
+      });
+    });
+  });
+  await browser.connection.send("Target.setAutoAttach", {
+    autoAttach: true,
+    waitForDebuggerOnStart: true,
+    flatten: true,
+    filter: [{ type: "page", exclude: false }, { exclude: true }]
+  });
+  return { deniedRequests: () => denied };
+}
+
+// ../execution/component-runtime/src/render.ts
+import { mkdirSync, realpathSync, writeFileSync } from "fs";
+import { dirname, isAbsolute, join, relative, resolve, sep } from "path";
+import { fileURLToPath } from "url";
+
+// ../execution/component-runtime/src/determinism.ts
+function createDeterministicRuntimeScope(target) {
+  const failure = (name) => {
+    throw new Error(`Ambient nondeterministic API is not allowed: ${name}. Use render.frame, render.fps, and render.seed.`);
+  };
+  const deniedFunction = (name) => function deniedAmbientApi() {
+    return failure(name);
+  };
+  const guardedFacade = (value, label, blockedKeys, denyCall = false) => {
+    const blocked = new Set(blockedKeys);
+    const deniedByKey = /* @__PURE__ */ new Map();
+    const denied = (key) => {
+      let fn = deniedByKey.get(key);
+      if (!fn) {
+        fn = deniedFunction(`${label}.${String(key)}`);
+        deniedByKey.set(key, fn);
+      }
+      return fn;
+    };
+    return new Proxy(value, {
+      get(original, key, receiver) {
+        return blocked.has(key) ? denied(key) : Reflect.get(original, key, receiver);
+      },
+      getOwnPropertyDescriptor(original, key) {
+        const descriptor = Reflect.getOwnPropertyDescriptor(original, key);
+        if (!blocked.has(key) || descriptor?.configurable === false) return descriptor;
+        return {
+          configurable: true,
+          enumerable: descriptor?.enumerable ?? false,
+          writable: false,
+          value: denied(key)
+        };
+      },
+      set(original, key, next, receiver) {
+        if (blocked.has(key)) return failure(`${label}.${String(key)} mutation`);
+        return Reflect.set(original, key, next, receiver);
+      },
+      defineProperty(original, key, descriptor) {
+        if (blocked.has(key)) return failure(`${label}.${String(key)} mutation`);
+        return Reflect.defineProperty(original, key, descriptor);
+      },
+      deleteProperty(original, key) {
+        if (blocked.has(key)) return failure(`${label}.${String(key)} mutation`);
+        return Reflect.deleteProperty(original, key);
+      },
+      apply(original, thisArg, args) {
+        if (denyCall) return failure(label);
+        return Reflect.apply(original, thisArg, args);
+      },
+      construct(original, args, newTarget) {
+        if (denyCall) return failure(label);
+        return Reflect.construct(original, args, newTarget);
+      }
+    });
+  };
+  const overrides = /* @__PURE__ */ new Map();
+  const math = target.Math;
+  if (math && (typeof math === "object" || typeof math === "function")) {
+    overrides.set("Math", guardedFacade(math, "Math", ["random"]));
+  }
+  const date = target.Date;
+  if (typeof date === "function") {
+    overrides.set("Date", guardedFacade(date, "Date", ["now"], true));
+  }
+  const performance = target.performance;
+  if (performance && (typeof performance === "object" || typeof performance === "function")) {
+    overrides.set("performance", guardedFacade(performance, "performance", ["now", "timeOrigin"]));
+  }
+  const crypto = target.crypto;
+  if (crypto && (typeof crypto === "object" || typeof crypto === "function")) {
+    overrides.set("crypto", guardedFacade(crypto, "crypto", ["getRandomValues", "randomUUID"]));
+  }
+  for (const name of ["requestAnimationFrame", "setTimeout", "setInterval", "Worker", "SharedWorker"]) {
+    if (name in target) overrides.set(name, deniedFunction(name));
+  }
+  let scope;
+  scope = new Proxy(target, {
+    get(original, key) {
+      if (key === "globalThis" || key === "window" || key === "self") return scope;
+      return overrides.has(key) ? overrides.get(key) : Reflect.get(original, key, original);
+    },
+    getOwnPropertyDescriptor(original, key) {
+      if (key === "globalThis" || key === "window" || key === "self" || overrides.has(key)) {
+        const descriptor = Reflect.getOwnPropertyDescriptor(original, key);
+        if (descriptor?.configurable === false) return descriptor;
+        return {
+          configurable: true,
+          enumerable: descriptor?.enumerable ?? true,
+          writable: false,
+          value: key === "globalThis" || key === "window" || key === "self" ? scope : overrides.get(key)
+        };
+      }
+      return Reflect.getOwnPropertyDescriptor(original, key);
+    },
+    set(original, key, value, receiver) {
+      if (overrides.has(key) || key === "globalThis" || key === "window" || key === "self") {
+        return failure(`${String(key)} mutation`);
+      }
+      return Reflect.set(original, key, value, receiver);
+    },
+    defineProperty(original, key, descriptor) {
+      if (overrides.has(key) || key === "globalThis" || key === "window" || key === "self") {
+        return failure(`${String(key)} mutation`);
+      }
+      return Reflect.defineProperty(original, key, descriptor);
+    },
+    deleteProperty(original, key) {
+      if (overrides.has(key) || key === "globalThis" || key === "window" || key === "self") {
+        return failure(`${String(key)} mutation`);
+      }
+      return Reflect.deleteProperty(original, key);
+    }
+  });
+  return scope;
+}
+function deterministicRuntimeScopeSource() {
+  return createDeterministicRuntimeScope.toString();
+}
+
+// ../execution/component-runtime/src/render.ts
+var LOCAL_ROOT_FILENAME = "Root.local.tsx";
+var LOCAL_ENTRY_FILENAME = "entry.local.tsx";
+var LOCAL_COMPOSITION_ID = "CueFrameLocalStill";
+var GRAPHICS_ATTESTATION_PREFIX = "__cueframe_graphics_v2__:";
+var BROWSER_RUNTIME_ERROR_PREFIX = "__cueframe_component_error_v2__:";
+function componentRuntimeError(error, fallbackCode, retryable = false) {
+  if (error instanceof ComponentRuntimeError) return error;
+  const message = error instanceof Error ? error.message : String(error);
+  const marker = message.lastIndexOf(BROWSER_RUNTIME_ERROR_PREFIX);
+  if (marker >= 0) {
+    const payload = message.slice(marker + BROWSER_RUNTIME_ERROR_PREFIX.length);
+    const separator = payload.indexOf(":");
+    const code = ComponentRuntimeErrorCode.safeParse(separator >= 0 ? payload.slice(0, separator) : payload);
+    if (code.success) {
+      return new ComponentRuntimeError(
+        code.data,
+        separator >= 0 ? payload.slice(separator + 1) : message,
+        { retryable: code.data === "component_device_lost" || code.data === "component_deadline_exceeded", cause: error }
+      );
+    }
+  }
+  return new ComponentRuntimeError(fallbackCode, message, { retryable, cause: error });
+}
+function parseGraphicsAttestationLog(text) {
+  if (!text.startsWith(GRAPHICS_ATTESTATION_PREFIX)) return null;
+  try {
+    const parsed = JSON.parse(text.slice(GRAPHICS_ATTESTATION_PREFIX.length));
+    if (parsed.api !== "canvas2d" && parsed.api !== "webgpu" || parsed.acceleration !== "hardware" && parsed.acceleration !== "software" || parsed.deviceLost !== false) return null;
+    return parsed;
+  } catch {
+    return null;
+  }
+}
+function graphicsCollector(required) {
+  let attestation = null;
+  return {
+    onBrowserLog(log) {
+      const parsed = parseGraphicsAttestationLog(log.text);
+      if (!parsed) return;
+      if (parsed.api !== required.api) {
+        throw new ComponentRuntimeError(
+          "component_graphics_mismatch",
+          `Renderer reported ${parsed.api} for a ${required.api} component.`
+        );
+      }
+      if (attestation && JSON.stringify(attestation) !== JSON.stringify(parsed)) {
+        throw new ComponentRuntimeError(
+          "component_graphics_mismatch",
+          "Renderer workers reported inconsistent graphics adapters."
+        );
+      }
+      attestation = parsed;
+    },
+    receipt() {
+      if (!attestation) {
+        throw new ComponentRuntimeError(
+          "component_graphics_unavailable",
+          `Renderer produced no trusted ${required.api} attestation.`
+        );
+      }
+      return attestation;
+    }
+  };
+}
+function toImportSpecifier(fromDir, toFile) {
+  const rel = relative(fromDir, toFile).split("\\").join("/");
+  return rel.startsWith(".") ? rel : `./${rel}`;
+}
+function generateLocalRoot(ws, opts) {
+  const dir = cacheDir(ws);
+  mkdirSync(dir, { recursive: true });
+  const componentFile = join(componentDir(ws, opts.id), "index");
+  const componentSpecifier = toImportSpecifier(dir, componentFile);
+  const root = `// GENERATED by @cueframe/component-runtime \u2014 DO NOT EDIT.
+import React from 'react';
+import { useEffect, useState } from 'react';
+import { Composition, cancelRender, continueRender, delayRender, getInputProps, useCurrentFrame } from 'remotion';
+
+const importAuthoredComponent = async () => {
+  return import(${JSON.stringify(componentSpecifier)});
+};
+
+const GuardedAuthoredComponent: React.FC<{
+  Component: React.ComponentType<any>;
+  componentProps: Record<string, unknown>;
+}> = ({Component, componentProps}) => {
+  return <Component {...componentProps} />;
+};
+
+const Resolved: React.FC = () => {
+  const input = getInputProps() as {
+    params: Record<string, unknown>;
+    assets: Record<string, unknown>;
+    seed: string;
+    graphics: {
+      api: 'canvas2d' | 'webgpu';
+      required: true;
+      accelerationPreference: 'hardware-preferred' | 'software-allowed';
+    };
+  };
+  const frame = useCurrentFrame();
+  const [Component, setComponent] = useState<React.ComponentType<any> | null>(null);
+  const [waitHandle] = useState(() => input.graphics.api === 'webgpu'
+    ? delayRender('CueFrame WebGPU admission')
+    : null);
+
+  useEffect(() => {
+    let active = true;
+    let admissionTimer: ReturnType<typeof setTimeout> | undefined;
+    const canvasPrototype = HTMLCanvasElement.prototype as unknown as {
+      getContext: (kind: string, ...args: unknown[]) => unknown;
+    };
+    const originalGetContext = canvasPrototype.getContext;
+
+    void (async () => {
+      try {
+        if (input.graphics.api === 'canvas2d') {
+          const loaded = await importAuthoredComponent();
+          if (!active) return;
+          setComponent(() => loaded.default);
+          console.info(${JSON.stringify(GRAPHICS_ATTESTATION_PREFIX)} + JSON.stringify({
+            api: 'canvas2d', acceleration: 'software', deviceLost: false,
+          }));
+          return;
+        }
+
+        const gpu = (navigator as unknown as { gpu?: { requestAdapter: (options?: unknown) => Promise<unknown> } }).gpu;
+        if (!gpu) throw new Error(${JSON.stringify(BROWSER_RUNTIME_ERROR_PREFIX)} + 'component_graphics_unavailable:The staged browser does not expose WebGPU.');
+        let adapterInfo: { description?: string; architecture?: string; device?: string; vendor?: string; isFallbackAdapter?: boolean } = {};
+        const gpuPrototype = Object.getPrototypeOf(gpu) as { requestAdapter: (options?: unknown) => Promise<any> };
+        const originalRequestAdapter = gpuPrototype.requestAdapter;
+        gpuPrototype.requestAdapter = async function (options?: unknown) {
+          const adapter = await originalRequestAdapter.call(this, options);
+          if (adapter?.info) adapterInfo = adapter.info;
+          return adapter;
+        };
+        canvasPrototype.getContext = function (kind: string, ...args: unknown[]) {
+          if (kind !== 'webgpu') {
+            throw new Error('A WebGPU-required component may only create a WebGPU canvas context.');
+          }
+          const context = originalGetContext.call(this, kind, ...args) as null | { configure: (configuration: any) => void };
+          if (!context) return context;
+          const contextPrototype = Object.getPrototypeOf(context) as { configure: (configuration: any) => void; __cueframePatched?: boolean };
+          if (!contextPrototype.__cueframePatched) {
+            const originalConfigure = contextPrototype.configure;
+            Object.defineProperty(contextPrototype, '__cueframePatched', { value: true });
+            contextPrototype.configure = function (configuration: any) {
+              const result = originalConfigure.call(this, configuration);
+              if (active) {
+                const adapterName = [adapterInfo.vendor, adapterInfo.architecture, adapterInfo.device, adapterInfo.description]
+                  .filter(Boolean)
+                  .join(' ');
+                const softwarePattern = /swiftshader|software|fallback/i;
+                const acceleration = adapterInfo.isFallbackAdapter === true || softwarePattern.test(adapterName)
+                  ? 'software'
+                  : 'hardware';
+                console.info(${JSON.stringify(GRAPHICS_ATTESTATION_PREFIX)} + JSON.stringify({
+                  api: 'webgpu', acceleration, adapterName: adapterName || undefined, deviceLost: false,
+                }));
+                const device = configuration?.device as { lost?: Promise<unknown> } | undefined;
+                void device?.lost?.then(() => {
+                  if (active) cancelRender(new Error(${JSON.stringify(BROWSER_RUNTIME_ERROR_PREFIX)} + 'component_device_lost:WebGPU device was lost during component rendering.'));
+                });
+                active = false;
+                if (admissionTimer) clearTimeout(admissionTimer);
+                continueRender(waitHandle as number);
+              }
+              return result;
+            };
+          }
+          return context;
+        };
+        Object.defineProperty(globalThis, 'OffscreenCanvas', { value: undefined, configurable: true });
+        const loaded = await importAuthoredComponent();
+        if (!active) return;
+        setComponent(() => loaded.default);
+        admissionTimer = setTimeout(() => {
+          if (active) cancelRender(new Error(${JSON.stringify(BROWSER_RUNTIME_ERROR_PREFIX)} + 'component_graphics_mismatch:The component did not configure a WebGPU canvas surface.'));
+        }, 10_000);
+      } catch (error) {
+        cancelRender(error instanceof Error ? error : new Error(String(error)));
+      }
+    })();
+    return () => {
+      active = false;
+      if (admissionTimer) clearTimeout(admissionTimer);
+      canvasPrototype.getContext = originalGetContext;
+    };
+  }, []);
+
+  if (!Component) return null;
+  return <GuardedAuthoredComponent
+    Component={Component}
+    componentProps={{
+      durationInFrames: ${opts.durationInFrames},
+      params: input.params,
+      assets: input.assets,
+      render: {
+        frame,
+        fps: ${opts.fps},
+        width: ${opts.width},
+        height: ${opts.height},
+        seed: input.seed,
+        colorSpace: 'srgb',
+      },
+    }}
+  />;
+};
+
+export const RemotionRoot: React.FC = () => (
+  <Composition
+    id=${JSON.stringify(LOCAL_COMPOSITION_ID)}
+    component={Resolved}
+    durationInFrames={${opts.durationInFrames}}
+    fps={${opts.fps}}
+    width={${opts.width}}
+    height={${opts.height}}
+    defaultProps={{}}
+  />
+);
+`;
+  writeFileSync(join(dir, LOCAL_ROOT_FILENAME), root);
+  const entry = `// GENERATED by @cueframe/component-runtime \u2014 DO NOT EDIT.
+import { registerRoot } from 'remotion';
+import { RemotionRoot } from './${LOCAL_ROOT_FILENAME}';
+registerRoot(RemotionRoot);
+`;
+  const entryPath = join(dir, LOCAL_ENTRY_FILENAME);
+  writeFileSync(entryPath, entry);
+  return entryPath;
+}
+var DeterministicAuthoredModulePlugin = class {
+  #authoredComponentRoot;
+  #scopeSource;
+  constructor(authoredComponentRoot) {
+    this.#authoredComponentRoot = realpathSync(authoredComponentRoot);
+    this.#scopeSource = deterministicRuntimeScopeSource();
+  }
+  apply(compiler) {
+    const pluginName = "CueFrameDeterministicAuthoredModulePlugin";
+    compiler.hooks.compilation.tap(pluginName, (compilation) => {
+      const hooks = compiler.webpack.javascript.JavascriptModulesPlugin.getCompilationHooks(compilation);
+      const { ConcatSource } = compiler.webpack.sources;
+      hooks.renderModuleContent.tap(
+        pluginName,
+        (source, module) => {
+          if (!module.resource) return source;
+          const resource = realpathSync(module.resource.split("?")[0]);
+          const relativeResource = relative(this.#authoredComponentRoot, resource);
+          const belongsToAuthoredComponent = relativeResource === "" || relativeResource !== ".." && !relativeResource.startsWith(`..${sep}`) && !isAbsolute(relativeResource);
+          if (!belongsToAuthoredComponent) return source;
+          return new ConcatSource(
+            "const __cueframeHostGlobal = globalThis;\n{\nconst {globalThis, window, self, Math, Date, performance, crypto, requestAnimationFrame, setTimeout, setInterval, Worker, SharedWorker} = (",
+            this.#scopeSource,
+            ")(__cueframeHostGlobal);\n{\n",
+            source,
+            "\n}\n}\n"
+          );
+        }
+      );
+    });
+  }
+};
+function buildLocalWebpackOverride(renderEntryRoot, authoredComponentRoot) {
+  const animateEntry = join(resolve(renderEntryRoot, ".."), "animate", "src", "index.ts");
+  return (config) => ({
+    ...config,
+    resolve: {
+      ...config.resolve,
+      modules: [
+        ...config.resolve?.modules ?? ["node_modules"],
+        join(renderEntryRoot, "node_modules"),
+        join(resolve(renderEntryRoot, ".."), "animate", "node_modules"),
+        join(resolve(renderEntryRoot, "..", ".."), "node_modules"),
+        join(resolve(renderEntryRoot, "..", "..", ".."), "node_modules")
+      ],
+      alias: {
+        "@cueframe/animate$": animateEntry
+      }
+    },
+    plugins: [
+      ...config.plugins ?? [],
+      new DeterministicAuthoredModulePlugin(authoredComponentRoot)
+    ]
+  });
+}
+async function importFromRenderEntry(renderEntryRoot, spec) {
+  const { createRequire } = await import("module");
+  const { pathToFileURL } = await import("url");
+  const requireFromRenderEntry = createRequire(join(renderEntryRoot, "package.json"));
+  return await import(pathToFileURL(requireFromRenderEntry.resolve(spec)).href);
+}
+function resolveRenderEntryRoot(override) {
+  if (override) return override;
+  if (process.env.RENDER_ENTRY_ROOT) return process.env.RENDER_ENTRY_ROOT;
+  const here = dirname(fileURLToPath(import.meta.url));
+  return join(resolve(here, "..", ".."), "render-entry");
+}
+async function prepareLocalBundle(opts) {
+  const renderEntryRoot = resolveRenderEntryRoot(opts.renderEntryRoot);
+  const browserExecutable = process.env.REMOTION_CHROME_EXECUTABLE || void 0;
+  const entryPoint = generateLocalRoot(opts.ws, {
+    id: opts.id,
+    width: opts.width,
+    height: opts.height,
+    fps: opts.fps,
+    durationInFrames: opts.durationInFrames
+  });
+  const { bundle } = await importFromRenderEntry(
+    renderEntryRoot,
+    "@remotion/bundler"
+  );
+  let serveUrl;
+  try {
+    serveUrl = await bundle({
+      entryPoint,
+      webpackOverride: buildLocalWebpackOverride(renderEntryRoot, componentDir(opts.ws, opts.id))
+    });
+  } catch (error) {
+    throw componentRuntimeError(error, "component_does_not_compile");
+  }
+  return {
+    serveUrl,
+    browserExecutable,
+    inputProps: {
+      params: opts.params,
+      assets: opts.assets ?? {},
+      seed: opts.seed ?? "cueframe",
+      graphics: opts.graphics ?? {
+        api: "canvas2d",
+        required: true,
+        accelerationPreference: "software-allowed"
+      }
+    },
+    renderEntryRoot
+  };
+}
+async function renderComponentStill(opts) {
+  const width = opts.width ?? 1920;
+  const height = opts.height ?? 1080;
+  const fps = opts.fps ?? 30;
+  const durationInFrames = opts.durationInFrames ?? 1;
+  const frame = opts.frame ?? 0;
+  const { serveUrl, browserExecutable, inputProps, renderEntryRoot } = await prepareLocalBundle({
+    ws: opts.ws,
+    id: opts.id,
+    width,
+    height,
+    fps,
+    durationInFrames,
+    params: opts.params,
+    assets: opts.assets,
+    seed: opts.seed,
+    graphics: opts.graphics,
+    renderEntryRoot: opts.renderEntryRoot
+  });
+  const { openBrowser, selectComposition, renderStill } = await importFromRenderEntry(
+    renderEntryRoot,
+    "@remotion/renderer"
+  );
+  const requiredGraphics = opts.graphics ?? {
+    api: "canvas2d",
+    required: true,
+    accelerationPreference: "software-allowed"
+  };
+  const collector = graphicsCollector(requiredGraphics);
+  let browser;
+  try {
+    browser = await openBrowser("chrome", {
+      browserExecutable,
+      chromiumOptions: COMPONENT_CHROMIUM_OPTIONS
+    });
+  } catch (error) {
+    throw componentRuntimeError(error, "component_resource_exhausted", true);
+  }
+  const firewall = await installComponentRequestFirewall(browser, opts.allowedAssetOrigins ?? /* @__PURE__ */ new Set());
+  try {
+    const composition = await selectComposition({
+      serveUrl,
+      id: LOCAL_COMPOSITION_ID,
+      inputProps,
+      puppeteerInstance: browser,
+      onBrowserLog: collector.onBrowserLog
+    });
+    const pngPath = join(cacheDir(opts.ws), `still-${opts.id}.png`);
+    await renderStill({
+      composition,
+      serveUrl,
+      inputProps,
+      output: pngPath,
+      frame,
+      puppeteerInstance: browser,
+      timeoutInMilliseconds: 12e4,
+      onBrowserLog: collector.onBrowserLog
+    });
+    const denied = firewall.deniedRequests();
+    if (denied.length > 0) {
+      throw new ComponentRuntimeError("component_network_denied", `Component attempted ${denied.length} denied network request(s).`);
+    }
+    return { pngPath, actualGraphics: collector.receipt() };
+  } catch (error) {
+    throw componentRuntimeError(error, "component_runtime_error");
+  } finally {
+    await browser.close({ silent: true });
+  }
+}
+function alphaRenderConfig(codec) {
+  return codec === "prores" ? { codec: "prores", proResProfile: "4444", pixelFormat: "yuva444p10le", imageFormat: "png", muted: true } : { codec: "vp9", pixelFormat: "yuva420p", imageFormat: "png", muted: true };
+}
+function alphaExt(codec) {
+  return codec === "prores" ? "mov" : "webm";
+}
+async function renderComponentAlpha(opts) {
+  const width = opts.width ?? 1920;
+  const height = opts.height ?? 1080;
+  const fps = opts.fps ?? 30;
+  const durationInFrames = opts.durationInFrames ?? fps * 3;
+  const codec = opts.codec ?? "prores";
+  const { serveUrl, browserExecutable, inputProps, renderEntryRoot } = await prepareLocalBundle({
+    ws: opts.ws,
+    id: opts.id,
+    width,
+    height,
+    fps,
+    durationInFrames,
+    params: opts.params,
+    assets: opts.assets,
+    seed: opts.seed,
+    graphics: opts.graphics,
+    renderEntryRoot: opts.renderEntryRoot
+  });
+  const { openBrowser, selectComposition, renderMedia } = await importFromRenderEntry(
+    renderEntryRoot,
+    "@remotion/renderer"
+  );
+  const requiredGraphics = opts.graphics ?? {
+    api: "canvas2d",
+    required: true,
+    accelerationPreference: "software-allowed"
+  };
+  const collector = graphicsCollector(requiredGraphics);
+  let browser;
+  try {
+    browser = await openBrowser("chrome", {
+      browserExecutable,
+      chromiumOptions: COMPONENT_CHROMIUM_OPTIONS
+    });
+  } catch (error) {
+    throw componentRuntimeError(error, "component_resource_exhausted", true);
+  }
+  const firewall = await installComponentRequestFirewall(browser, opts.allowedAssetOrigins ?? /* @__PURE__ */ new Set());
+  try {
+    const composition = await selectComposition({
+      serveUrl,
+      id: LOCAL_COMPOSITION_ID,
+      inputProps,
+      puppeteerInstance: browser,
+      onBrowserLog: collector.onBrowserLog
+    });
+    const rangeSuffix = opts.frameRange ? `-${opts.frameRange[0]}-${opts.frameRange[1]}` : "";
+    const videoPath = join(cacheDir(opts.ws), `alpha-${opts.id}${rangeSuffix}.${alphaExt(codec)}`);
+    await renderMedia({
+      composition,
+      serveUrl,
+      inputProps,
+      puppeteerInstance: browser,
+      outputLocation: videoPath,
+      ...alphaRenderConfig(codec),
+      onBrowserLog: collector.onBrowserLog,
+      concurrency: 1,
+      ...opts.frameRange ? { frameRange: opts.frameRange } : {}
+    });
+    const denied = firewall.deniedRequests();
+    if (denied.length > 0) {
+      throw new ComponentRuntimeError("component_network_denied", `Component attempted ${denied.length} denied network request(s).`);
+    }
+    return { videoPath, actualGraphics: collector.receipt() };
+  } catch (error) {
+    throw componentRuntimeError(error, "component_runtime_error");
+  } finally {
+    await browser.close({ silent: true });
+  }
+}
+
+export {
+  decideComponentRequest,
+  COMPONENT_PAGE_LOCKDOWN,
+  installComponentRequestFirewall,
+  LOCAL_ROOT_FILENAME,
+  LOCAL_ENTRY_FILENAME,
+  LOCAL_COMPOSITION_ID,
+  GRAPHICS_ATTESTATION_PREFIX,
+  parseGraphicsAttestationLog,
+  generateLocalRoot,
+  buildLocalWebpackOverride,
+  importFromRenderEntry,
+  resolveRenderEntryRoot,
+  renderComponentStill,
+  alphaRenderConfig,
+  alphaExt,
+  renderComponentAlpha
+};