@remotion/web-renderer 4.0.402 → 4.0.404

package/dist/get-encodable-codecs.d.ts

@@ -0,0 +1,9 @@
+import { type WebRendererAudioCodec, type WebRendererContainer, type WebRendererQuality, type WebRendererVideoCodec } from './mediabunny-mappings';
+export type GetEncodableVideoCodecsOptions = {
+    videoBitrate?: number | WebRendererQuality;
+};
+export type GetEncodableAudioCodecsOptions = {
+    audioBitrate?: number | WebRendererQuality;
+};
+export declare const getEncodableVideoCodecs: (container: WebRendererContainer, options?: GetEncodableVideoCodecsOptions | undefined) => Promise<WebRendererVideoCodec[]>;
+export declare const getEncodableAudioCodecs: (container: WebRendererContainer, options?: GetEncodableAudioCodecsOptions | undefined) => Promise<WebRendererAudioCodec[]>;

package/dist/index.d.ts

@@ -1,7 +1,11 @@
 import './symbol-dispose';
 export type { EmittedArtifact, WebRendererOnArtifact } from './artifact';
+export { canRenderMediaOnWeb } from './can-render-media-on-web';
+export type { CanRenderIssue, CanRenderMediaOnWebOptions, CanRenderMediaOnWebResult, } from './can-render-media-on-web';
 export type { FrameRange } from './frame-range';
-export type { WebRendererContainer, WebRendererQuality, WebRendererVideoCodec, } from './mediabunny-mappings';
+export { getEncodableAudioCodecs, getEncodableVideoCodecs, type GetEncodableAudioCodecsOptions, type GetEncodableVideoCodecsOptions, } from './get-encodable-codecs';
+export { getDefaultAudioCodecForContainer, getDefaultVideoCodecForContainer, getSupportedAudioCodecsForContainer, getSupportedVideoCodecsForContainer, } from './mediabunny-mappings';
+export type { WebRendererAudioCodec, WebRendererContainer, WebRendererQuality, WebRendererVideoCodec, } from './mediabunny-mappings';
 export type { WebRendererOutputTarget } from './output-target';
 export { renderMediaOnWeb } from './render-media-on-web';
 export type { RenderMediaOnWebOptions, RenderMediaOnWebProgress, RenderMediaOnWebProgressCallback, RenderMediaOnWebResult, } from './render-media-on-web';

package/dist/internal-state.d.ts

@@ -6,7 +6,8 @@ type HelperCanvas = {
         aPosition: number;
         aTexCoord: number;
         uTransform: WebGLUniformLocation | null;
-        uProjection: WebGLUniformLocation | null;
+        uResolution: WebGLUniformLocation | null;
+        uOffset: WebGLUniformLocation | null;
         uTexture: WebGLUniformLocation | null;
     };
     cleanup: () => void;

package/dist/mediabunny-mappings.d.ts

@@ -2,9 +2,14 @@ import type { Quality } from 'mediabunny';
 import { type OutputFormat } from 'mediabunny';
 export type WebRendererVideoCodec = 'h264' | 'h265' | 'vp8' | 'vp9' | 'av1';
 export type WebRendererContainer = 'mp4' | 'webm';
+export type WebRendererAudioCodec = 'aac' | 'opus';
 export type WebRendererQuality = 'very-low' | 'low' | 'medium' | 'high' | 'very-high';
 export declare const codecToMediabunnyCodec: (codec: WebRendererVideoCodec) => "av1" | "avc" | "hevc" | "vp8" | "vp9";
 export declare const containerToMediabunnyContainer: (container: WebRendererContainer) => OutputFormat;
 export declare const getDefaultVideoCodecForContainer: (container: WebRendererContainer) => WebRendererVideoCodec;
 export declare const getQualityForWebRendererQuality: (quality: WebRendererQuality) => Quality;
 export declare const getMimeType: (container: WebRendererContainer) => string;
+export declare const getDefaultAudioCodecForContainer: (container: WebRendererContainer) => WebRendererAudioCodec;
+export declare const getSupportedVideoCodecsForContainer: (container: WebRendererContainer) => WebRendererVideoCodec[];
+export declare const getSupportedAudioCodecsForContainer: (container: WebRendererContainer) => WebRendererAudioCodec[];
+export declare const audioCodecToMediabunnyAudioCodec: (audioCodec: WebRendererAudioCodec) => "aac" | "alaw" | "flac" | "mp3" | "opus" | "pcm-f32" | "pcm-f32be" | "pcm-f64" | "pcm-f64be" | "pcm-s16" | "pcm-s16be" | "pcm-s24" | "pcm-s24be" | "pcm-s32" | "pcm-s32be" | "pcm-s8" | "pcm-u8" | "ulaw" | "vorbis";

package/dist/render-media-on-web.d.ts

@@ -3,7 +3,7 @@ import type { AnyZodObject, z } from 'zod';
 import { type WebRendererOnArtifact } from './artifact';
 import { type FrameRange } from './frame-range';
 import type { InternalState } from './internal-state';
-import type { WebRendererContainer, WebRendererQuality } from './mediabunny-mappings';
+import type { WebRendererAudioCodec, WebRendererContainer, WebRendererQuality } from './mediabunny-mappings';
 import { type WebRendererVideoCodec } from './mediabunny-mappings';
 import type { WebRendererOutputTarget } from './output-target';
 import type { CompositionCalculateMetadataOrExplicit } from './props-if-has-props';
@@ -35,6 +35,8 @@ type OptionalRenderMediaOnWebOptions<Schema extends AnyZodObject> = {
     schema: Schema | undefined;
     mediaCacheSizeInBytes: number | null;
     videoCodec: WebRendererVideoCodec;
+    audioCodec: WebRendererAudioCodec | null;
+    audioBitrate: number | WebRendererQuality;
     container: WebRendererContainer;
     signal: AbortSignal | null;
     onProgress: RenderMediaOnWebProgressCallback | null;

package/dist/renoun.d.ts

@@ -0,0 +1,119 @@
+/** Image format for encoded screenshot output. */
+export type ImageFormat = 'png' | 'jpeg' | 'webp';
+/** Options for rendering a screenshot to canvas. */
+export interface RenderOptions {
+    /**
+     * Canvas background color. Set to `null` (or omit) for a transparent canvas.
+     * When provided, the string is passed directly to `fillStyle`.
+     */
+    backgroundColor?: string | null;
+    /**
+     * Optional existing canvas to render into.
+     * When omitted, a new canvas element is created.
+     */
+    canvas?: HTMLCanvasElement;
+    /**
+     * Rendering scale factor. Defaults to `window.devicePixelRatio` (or `1`).
+     */
+    scale?: number;
+    /**
+     * Crop origin X (CSS pixels) relative to the element's left edge.
+     * Defaults to the element's left edge.
+     */
+    x?: number;
+    /**
+     * Crop origin Y (CSS pixels) relative to the element's top edge.
+     * Defaults to the element's top edge.
+     */
+    y?: number;
+    /**
+     * Output width in CSS pixels. Defaults to the element's width.
+     */
+    width?: number;
+    /**
+     * Output height in CSS pixels. Defaults to the element's height.
+     */
+    height?: number;
+    /**
+     * Controls how `position: fixed` elements outside the captured subtree are
+     * handled.
+     *
+     * - `none` – ignore all fixed elements outside `element`.
+     * - `intersecting` – include fixed elements whose bounding rect intersects the capture rect.
+     * - `all` – include all fixed elements that overlap the viewport.
+     */
+    includeFixed?: 'none' | 'intersecting' | 'all';
+}
+/** Options for encoding a canvas to an image format. */
+export interface EncodeOptions {
+    /**
+     * Image format to encode. Defaults to `'png'`.
+     */
+    format?: ImageFormat;
+    /**
+     * Image quality for lossy formats (`jpeg`, `webp`). A number between `0` and `1`.
+     * Ignored for `png`. Defaults to `0.92`.
+     */
+    quality?: number;
+}
+/** Combined options for one-shot screenshot methods that render and encode. */
+export type ScreenshotOptions = RenderOptions & EncodeOptions;
+/**
+ * A promise-like object representing a screenshot capture. The underlying
+ * render happens once; subsequent calls to `.canvas()`, `.blob()`, or `.url()`
+ * reuse the same rendered canvas.
+ */
+export interface ScreenshotTask extends Promise<HTMLCanvasElement> {
+    /** Returns the rendered canvas. */
+    canvas(): Promise<HTMLCanvasElement>;
+    /** Encodes the rendered canvas to a Blob. */
+    blob(options?: EncodeOptions): Promise<Blob>;
+    /**
+     * Encodes the rendered canvas to a Blob and creates an object URL.
+     * Remember to call `URL.revokeObjectURL(url)` when done to avoid memory leaks.
+     */
+    url(options?: EncodeOptions): Promise<string>;
+}
+/**
+ * Renders a DOM element into a canvas using modern browser features.
+ *
+ * Returns a `ScreenshotTask` that is both a Promise and provides methods
+ * to encode the rendered canvas. The underlying render happens once;
+ * subsequent calls to `.canvas()`, `.blob()`, or `.url()` reuse the same result.
+ *
+ * This implementation targets evergreen browsers only and assumes a real DOM +
+ * Canvas2D environment (not Node.js).
+ *
+ * @example
+ * // Capture handle pattern - render once, encode multiple ways
+ * const shot = screenshot(element, { scale: 2 })
+ * const canvas = await shot.canvas()
+ * const pngBlob = await shot.blob({ format: 'png' })
+ * const webpUrl = await shot.url({ format: 'webp', quality: 0.9 })
+ *
+ * @example
+ * // Direct await returns the canvas
+ * const canvas = await screenshot(element)
+ *
+ * @example
+ * // One-shot convenience methods
+ * const canvas = await screenshot.canvas(element, { scale: 2 })
+ * const blob = await screenshot.blob(element, { format: 'jpeg', quality: 0.85 })
+ * const url = await screenshot.url(element, { format: 'png' })
+ */
+declare function screenshot(target: Element | string, options?: RenderOptions): ScreenshotTask;
+declare namespace screenshot {
+    var canvas: (target: string | Element, options?: RenderOptions | undefined) => Promise<HTMLCanvasElement>;
+}
+declare namespace screenshot {
+    var blob: (target: string | Element, options?: ScreenshotOptions | undefined) => Promise<Blob>;
+}
+declare namespace screenshot {
+    var url: (target: string | Element, options?: ScreenshotOptions | undefined) => Promise<string>;
+}
+export { screenshot };
+declare global {
+    interface CanvasRenderingContext2D {
+        _filterPolyfillValue?: string;
+    }
+}

package/dist/resolve-audio-codec.d.ts

@@ -0,0 +1,13 @@
+import { type Quality } from 'mediabunny';
+import type { CanRenderIssue } from './can-render-types';
+import { type WebRendererAudioCodec, type WebRendererContainer } from './mediabunny-mappings';
+export type ResolveAudioCodecResult = {
+    codec: WebRendererAudioCodec | null;
+    issues: CanRenderIssue[];
+};
+export declare const resolveAudioCodec: (options: {
+    container: WebRendererContainer;
+    requestedCodec: WebRendererAudioCodec | null | undefined;
+    userSpecifiedAudioCodec: boolean;
+    bitrate: number | Quality;
+}) => Promise<ResolveAudioCodecResult>;

package/dist/validate-dimensions.d.ts

@@ -0,0 +1,7 @@
+import type { CanRenderIssue } from './can-render-types';
+import type { WebRendererVideoCodec } from './mediabunny-mappings';
+export declare const validateDimensions: (options: {
+    width: number;
+    height: number;
+    codec: WebRendererVideoCodec;
+}) => CanRenderIssue | null;

package/dist/wait-for-ready.d.ts

@@ -1,5 +1,6 @@
 import type { DelayRenderScope } from 'remotion';
-export declare const waitForReady: ({ timeoutInMilliseconds, scope, signal, apiName, internalState, }: {
+import type { BackgroundKeepalive } from './background-keepalive';
+export declare const waitForReady: ({ timeoutInMilliseconds, scope, signal, apiName, internalState, keepalive, }: {
     timeoutInMilliseconds: number;
     scope: DelayRenderScope;
     signal: AbortSignal | null;
@@ -22,4 +23,5 @@ export declare const waitForReady: ({ timeoutInMilliseconds, scope, signal, apiN
         getAudioMixingTime: () => number;
         addAudioMixingTime: (time: number) => void;
     } | null;
+    keepalive: BackgroundKeepalive | null;
 }) => Promise<void>;

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/web-renderer"
 	},
 	"name": "@remotion/web-renderer",
-	"version": "4.0.402",
+	"version": "4.0.404",
 	"main": "dist/index.js",
 	"type": "module",
 	"sideEffects": false,
@@ -18,14 +18,14 @@
 	"author": "Remotion <jonny@remotion.dev>",
 	"license": "UNLICENSED",
 	"dependencies": {
-		"@remotion/licensing": "4.0.402",
-		"remotion": "4.0.402",
+		"@remotion/licensing": "4.0.404",
+		"remotion": "4.0.404",
 		"mediabunny": "1.27.3"
 	},
 	"devDependencies": {
-		"@remotion/eslint-config-internal": "4.0.402",
-		"@remotion/player": "4.0.402",
-		"@remotion/media": "4.0.402",
+		"@remotion/eslint-config-internal": "4.0.404",
+		"@remotion/player": "4.0.404",
+		"@remotion/media": "4.0.404",
 		"@typescript/native-preview": "7.0.0-dev.20260105.1",
 		"@vitejs/plugin-react": "4.1.0",
 		"@vitest/browser-playwright": "4.0.9",