@helios-project/player 0.48.3 → 0.76.4

package/dist/features/audio-metering.js

@@ -0,0 +1,160 @@
+import { SharedAudioContextManager } from './audio-context-manager';
+export class AudioMeter {
+    ctx;
+    splitter;
+    analyserLeft;
+    analyserRight;
+    dataArrayLeft;
+    dataArrayRight;
+    sources = new Map();
+    isEnabled = false;
+    manager;
+    observer = null;
+    constructor() {
+        this.manager = SharedAudioContextManager.getInstance();
+        this.ctx = this.manager.context;
+        this.splitter = this.ctx.createChannelSplitter(2);
+        this.analyserLeft = this.ctx.createAnalyser();
+        this.analyserRight = this.ctx.createAnalyser();
+        // Use a small buffer for responsiveness
+        this.analyserLeft.fftSize = 256;
+        this.analyserRight.fftSize = 256;
+        this.dataArrayLeft = new Float32Array(this.analyserLeft.fftSize);
+        this.dataArrayRight = new Float32Array(this.analyserRight.fftSize);
+        this.splitter.connect(this.analyserLeft, 0);
+        this.splitter.connect(this.analyserRight, 1);
+    }
+    connect(doc) {
+        if (this.ctx.state === 'suspended') {
+            this.ctx.resume().catch(e => console.warn("AudioMeter: Failed to resume context", e));
+        }
+        const scanElement = (el) => {
+            if (el.tagName !== 'AUDIO' && el.tagName !== 'VIDEO')
+                return;
+            const mediaEl = el;
+            this.connectElement(mediaEl);
+        };
+        // Initial scan
+        const mediaElements = Array.from(doc.querySelectorAll('audio, video'));
+        mediaElements.forEach(el => this.connectElement(el));
+        // Observer for dynamic elements
+        this.observer = new MutationObserver((mutations) => {
+            mutations.forEach((mutation) => {
+                mutation.addedNodes.forEach((node) => {
+                    if (node.nodeType === Node.ELEMENT_NODE) {
+                        const el = node;
+                        // Check the element itself
+                        scanElement(el);
+                        // Check children if a container was added
+                        const children = el.querySelectorAll('audio, video');
+                        children.forEach(child => scanElement(child));
+                    }
+                });
+                mutation.removedNodes.forEach((node) => {
+                    if (node.nodeType === Node.ELEMENT_NODE) {
+                        const el = node;
+                        if (el.tagName === 'AUDIO' || el.tagName === 'VIDEO') {
+                            this.disconnectElement(el);
+                        }
+                        // Also check children if a container was removed
+                        const descendants = el.querySelectorAll('audio, video');
+                        descendants.forEach(d => {
+                            this.disconnectElement(d);
+                        });
+                    }
+                });
+            });
+        });
+        const target = doc.body || doc;
+        this.observer.observe(target, { childList: true, subtree: true });
+    }
+    connectElement(el) {
+        if (this.sources.has(el))
+            return;
+        try {
+            const sharedSource = this.manager.getSharedSource(el);
+            // Metering path (Pre-fader to visualize activity even if muted)
+            // Only connect if enabled
+            if (this.isEnabled) {
+                sharedSource.connect(this.splitter);
+            }
+            this.sources.set(el, sharedSource);
+        }
+        catch (e) {
+            console.warn('AudioMeter: Failed to connect element', e);
+        }
+    }
+    disconnectElement(el) {
+        const source = this.sources.get(el);
+        if (source) {
+            source.disconnect(this.splitter);
+            this.sources.delete(el);
+        }
+    }
+    enable() {
+        if (this.isEnabled)
+            return;
+        this.isEnabled = true;
+        if (this.ctx.state === 'suspended') {
+            this.ctx.resume().catch(e => console.warn("AudioMeter: Failed to resume context", e));
+        }
+        this.sources.forEach(source => {
+            source.connect(this.splitter);
+        });
+    }
+    disable() {
+        if (!this.isEnabled)
+            return;
+        this.isEnabled = false;
+        this.sources.forEach(source => {
+            source.disconnect(this.splitter);
+        });
+    }
+    getLevels() {
+        if (!this.isEnabled) {
+            return { left: 0, right: 0, peakLeft: 0, peakRight: 0 };
+        }
+        this.analyserLeft.getFloatTimeDomainData(this.dataArrayLeft);
+        this.analyserRight.getFloatTimeDomainData(this.dataArrayRight);
+        return {
+            left: this.calculateRMS(this.dataArrayLeft),
+            right: this.calculateRMS(this.dataArrayRight),
+            peakLeft: this.calculatePeak(this.dataArrayLeft),
+            peakRight: this.calculatePeak(this.dataArrayRight)
+        };
+    }
+    calculateRMS(data) {
+        let sum = 0;
+        for (let i = 0; i < data.length; i++) {
+            sum += data[i] * data[i];
+        }
+        return Math.sqrt(sum / data.length);
+    }
+    calculatePeak(data) {
+        let max = 0;
+        for (let i = 0; i < data.length; i++) {
+            const val = Math.abs(data[i]);
+            if (val > max)
+                max = val;
+        }
+        return max;
+    }
+    dispose() {
+        if (this.observer) {
+            this.observer.disconnect();
+            this.observer = null;
+        }
+        this.sources.forEach(source => {
+            source.disconnect(this.splitter);
+        });
+        this.sources.clear();
+        try {
+            this.splitter.disconnect();
+            this.analyserLeft.disconnect();
+            this.analyserRight.disconnect();
+        }
+        catch (e) {
+            console.warn("AudioMeter: Error during dispose", e);
+        }
+    }
+}

package/dist/features/audio-tracks.d.ts

@@ -0,0 +1,42 @@
+export interface AudioTrackHost {
+    handleAudioTrackEnabledChange(track: HeliosAudioTrack): void;
+}
+export declare class HeliosAudioTrack {
+    private _id;
+    private _kind;
+    private _label;
+    private _language;
+    private _enabled;
+    private _host;
+    constructor(id: string, kind: string, label: string, language: string, enabled: boolean, host: AudioTrackHost);
+    get id(): string;
+    get kind(): string;
+    get label(): string;
+    get language(): string;
+    get enabled(): boolean;
+    set enabled(value: boolean);
+    /**
+     * Internal method to update state without triggering host callback.
+     * Used when syncing from external state.
+     */
+    _setEnabledInternal(value: boolean): void;
+}
+export declare class HeliosAudioTrackList extends EventTarget implements Iterable<HeliosAudioTrack> {
+    private tracks;
+    private _onaddtrack;
+    private _onremovetrack;
+    private _onchange;
+    get length(): number;
+    [index: number]: HeliosAudioTrack;
+    [Symbol.iterator](): Iterator<HeliosAudioTrack>;
+    getTrackById(id: string): HeliosAudioTrack | null;
+    addTrack(track: HeliosAudioTrack): void;
+    removeTrack(track: HeliosAudioTrack): void;
+    dispatchChangeEvent(): void;
+    get onaddtrack(): ((event: any) => void) | null;
+    set onaddtrack(handler: ((event: any) => void) | null);
+    get onremovetrack(): ((event: any) => void) | null;
+    set onremovetrack(handler: ((event: any) => void) | null);
+    get onchange(): ((event: any) => void) | null;
+    set onchange(handler: ((event: any) => void) | null);
+}

package/dist/features/audio-tracks.js

@@ -0,0 +1,104 @@
+export class HeliosAudioTrack {
+    _id;
+    _kind;
+    _label;
+    _language;
+    _enabled;
+    _host;
+    constructor(id, kind, label, language, enabled, host) {
+        this._id = id;
+        this._kind = kind;
+        this._label = label;
+        this._language = language;
+        this._enabled = enabled;
+        this._host = host;
+    }
+    get id() { return this._id; }
+    get kind() { return this._kind; }
+    get label() { return this._label; }
+    get language() { return this._language; }
+    get enabled() { return this._enabled; }
+    set enabled(value) {
+        if (this._enabled !== value) {
+            this._enabled = value;
+            this._host.handleAudioTrackEnabledChange(this);
+        }
+    }
+    /**
+     * Internal method to update state without triggering host callback.
+     * Used when syncing from external state.
+     */
+    _setEnabledInternal(value) {
+        this._enabled = value;
+    }
+}
+export class HeliosAudioTrackList extends EventTarget {
+    tracks = [];
+    _onaddtrack = null;
+    _onremovetrack = null;
+    _onchange = null;
+    get length() { return this.tracks.length; }
+    [Symbol.iterator]() {
+        return this.tracks[Symbol.iterator]();
+    }
+    getTrackById(id) {
+        return this.tracks.find(t => t.id === id) || null;
+    }
+    addTrack(track) {
+        this.tracks.push(track);
+        // Enable array-like access
+        this[this.tracks.length - 1] = track;
+        const event = new Event('addtrack');
+        event.track = track;
+        this.dispatchEvent(event);
+    }
+    removeTrack(track) {
+        const index = this.tracks.indexOf(track);
+        if (index !== -1) {
+            this.tracks.splice(index, 1);
+            // Re-index properties
+            for (let i = index; i < this.tracks.length; i++) {
+                this[i] = this.tracks[i];
+            }
+            delete this[this.tracks.length];
+            const event = new Event('removetrack');
+            event.track = track;
+            this.dispatchEvent(event);
+        }
+    }
+    // Helper to dispatch change event
+    dispatchChangeEvent() {
+        this.dispatchEvent(new Event('change'));
+    }
+    // Standard event handler properties
+    get onaddtrack() { return this._onaddtrack; }
+    set onaddtrack(handler) {
+        if (this._onaddtrack) {
+            this.removeEventListener('addtrack', this._onaddtrack);
+        }
+        this._onaddtrack = handler;
+        if (handler) {
+            this.addEventListener('addtrack', handler);
+        }
+    }
+    get onremovetrack() { return this._onremovetrack; }
+    set onremovetrack(handler) {
+        if (this._onremovetrack) {
+            this.removeEventListener('removetrack', this._onremovetrack);
+        }
+        this._onremovetrack = handler;
+        if (handler) {
+            this.addEventListener('removetrack', handler);
+        }
+    }
+    get onchange() { return this._onchange; }
+    set onchange(handler) {
+        if (this._onchange) {
+            this.removeEventListener('change', this._onchange);
+        }
+        this._onchange = handler;
+        if (handler) {
+            this.addEventListener('change', handler);
+        }
+    }
+}

package/dist/features/audio-utils.d.ts

@@ -1,10 +1,17 @@
+import type { AudioTrackMetadata } from "@helios-project/core";
 export interface AudioAsset {
+    id: string;
     buffer: ArrayBuffer;
     mimeType: string | null;
     volume?: number;
     muted?: boolean;
     loop?: boolean;
     startTime?: number;
+    fadeInDuration?: number;
+    fadeOutDuration?: number;
 }
-export declare function getAudioAssets(doc: Document): Promise<AudioAsset[]>;
+export declare function getAudioAssets(doc: Document, metadataTracks?: AudioTrackMetadata[], audioTrackState?: Record<string, {
+    volume: number;
+    muted: boolean;
+}>): Promise<AudioAsset[]>;
 export declare function mixAudio(assets: AudioAsset[], duration: number, sampleRate: number, rangeStart?: number): Promise<AudioBuffer>;

package/dist/features/audio-utils.js

@@ -1,26 +1,71 @@
-export async function getAudioAssets(doc) {
-    const audioTags = Array.from(doc.querySelectorAll('audio'));
-    return Promise.all(audioTags.map(async (tag) => {
-        if (!tag.src)
-            return { buffer: new ArrayBuffer(0), mimeType: null };
-        try {
-            const res = await fetch(tag.src);
-            const volumeAttr = tag.getAttribute('volume');
-            return {
-                buffer: await res.arrayBuffer(),
-                mimeType: res.headers.get('content-type'),
-                // Support non-standard 'volume' attribute for declarative usage, fallback to DOM property
-                volume: volumeAttr !== null ? parseFloat(volumeAttr) : tag.volume,
-                muted: tag.muted,
-                loop: tag.loop,
-                startTime: parseFloat(tag.getAttribute('data-start-time') || '0') || 0
-            };
+async function fetchAudioAsset(id, src, options) {
+    if (!src)
+        return { id, buffer: new ArrayBuffer(0), mimeType: null };
+    try {
+        const res = await fetch(src);
+        return {
+            id,
+            buffer: await res.arrayBuffer(),
+            mimeType: res.headers.get('content-type'),
+            volume: options.volume ?? 1,
+            muted: options.muted ?? false,
+            loop: options.loop ?? false,
+            startTime: options.startTime ?? 0,
+            fadeInDuration: options.fadeInDuration ?? 0,
+            fadeOutDuration: options.fadeOutDuration ?? 0
+        };
+    }
+    catch (e) {
+        console.warn("Failed to fetch audio asset:", src, e);
+        return { id, buffer: new ArrayBuffer(0), mimeType: null };
+    }
+}
+export async function getAudioAssets(doc, metadataTracks = [], audioTrackState = {}) {
+    const domAssetsPromises = Array.from(doc.querySelectorAll('audio')).map((tag, index) => {
+        // ID Extraction Priority:
+        // 1. data-helios-track-id (Used by DomDriver for control)
+        // 2. id attribute (Standard DOM)
+        // 3. Fallback: generated "track-${index}" (Stable fallback for listing)
+        const id = tag.getAttribute('data-helios-track-id') || tag.id || `track-${index}`;
+        const volumeAttr = tag.getAttribute('volume');
+        const state = audioTrackState[id];
+        let volume = 1;
+        let muted = false;
+        if (state) {
+            volume = state.volume;
+            muted = state.muted;
         }
-        catch (e) {
-            console.warn("Failed to fetch audio asset:", tag.src, e);
-            return { buffer: new ArrayBuffer(0), mimeType: null };
+        else {
+            volume = volumeAttr !== null ? parseFloat(volumeAttr) : tag.volume;
+            muted = tag.muted;
         }
-    }));
+        return fetchAudioAsset(id, tag.src, {
+            volume,
+            muted,
+            loop: tag.loop,
+            startTime: parseFloat(tag.getAttribute('data-start-time') || '0') || 0,
+            fadeInDuration: parseFloat(tag.getAttribute('data-helios-fade-in') || '0') || 0,
+            fadeOutDuration: parseFloat(tag.getAttribute('data-helios-fade-out') || '0') || 0
+        });
+    });
+    const metadataAssetsPromises = metadataTracks.map(track => {
+        const state = audioTrackState[track.id];
+        return fetchAudioAsset(track.id, track.src, {
+            volume: state?.volume ?? 1,
+            muted: state?.muted ?? false,
+            startTime: track.startTime,
+            fadeInDuration: track.fadeInDuration,
+            fadeOutDuration: track.fadeOutDuration,
+            loop: false // Metadata doesn't strictly support loop yet, defaults to false
+        });
+    });
+    const domAssets = await Promise.all(domAssetsPromises);
+    const metadataAssets = await Promise.all(metadataAssetsPromises);
+    // Merge: Prioritize metadata if IDs collide (Explicit state overrides DOM discovery)
+    const assetsMap = new Map();
+    domAssets.forEach(a => assetsMap.set(a.id, a));
+    metadataAssets.forEach(a => assetsMap.set(a.id, a));
+    return Array.from(assetsMap.values());
 }
 export async function mixAudio(assets, duration, sampleRate, rangeStart = 0) {
     if (typeof OfflineAudioContext === 'undefined') {
@@ -42,8 +87,8 @@ export async function mixAudio(assets, duration, sampleRate, rangeStart = 0) {
             source.buffer = audioBuffer;
             source.loop = !!asset.loop;
             const gainNode = ctx.createGain();
-            const volume = asset.muted ? 0 : (typeof asset.volume === 'number' ? asset.volume : 1);
-            gainNode.gain.value = volume;
+            const targetVolume = asset.muted ? 0 : (typeof asset.volume === 'number' ? asset.volume : 1);
+            gainNode.gain.value = targetVolume;
             source.connect(gainNode);
             gainNode.connect(ctx.destination);
             const assetStart = asset.startTime || 0;
@@ -55,6 +100,56 @@ export async function mixAudio(assets, duration, sampleRate, rangeStart = 0) {
                 startOffset = -playbackStart;
                 playbackStart = 0;
             }
+            // Apply Fades
+            if ((asset.fadeInDuration && asset.fadeInDuration > 0) || (asset.fadeOutDuration && asset.fadeOutDuration > 0)) {
+                let fadeInEndTime = playbackStart;
+                // Fade In
+                if (asset.fadeInDuration && asset.fadeInDuration > 0) {
+                    const durationRemaining = asset.fadeInDuration - startOffset;
+                    if (durationRemaining > 0) {
+                        const initialVol = targetVolume * (startOffset / asset.fadeInDuration);
+                        gainNode.gain.setValueAtTime(initialVol, playbackStart);
+                        fadeInEndTime = playbackStart + durationRemaining;
+                        gainNode.gain.linearRampToValueAtTime(targetVolume, fadeInEndTime);
+                    }
+                    else {
+                        gainNode.gain.setValueAtTime(targetVolume, playbackStart);
+                    }
+                }
+                else {
+                    gainNode.gain.setValueAtTime(targetVolume, playbackStart);
+                }
+                // Fade Out
+                if (asset.fadeOutDuration && asset.fadeOutDuration > 0) {
+                    const clipDuration = audioBuffer.duration;
+                    const assetEnd = assetStart + clipDuration;
+                    const playbackEnd = assetEnd - rangeStart;
+                    const fadeOutStart = playbackEnd - asset.fadeOutDuration;
+                    if (fadeOutStart >= 0) {
+                        if (fadeOutStart >= fadeInEndTime) {
+                            gainNode.gain.setValueAtTime(targetVolume, fadeOutStart);
+                        }
+                        else {
+                            // Overlap: Anchor at current calculated volume or targetVolume?
+                            // Simpler to anchor at targetVolume if we assume users don't overlap fades aggressively
+                            gainNode.gain.setValueAtTime(targetVolume, fadeOutStart);
+                        }
+                        gainNode.gain.linearRampToValueAtTime(0, playbackEnd);
+                    }
+                    else {
+                        const timeIntoFade = -fadeOutStart;
+                        if (timeIntoFade < asset.fadeOutDuration) {
+                            const progress = timeIntoFade / asset.fadeOutDuration;
+                            const startVol = targetVolume * (1 - progress);
+                            gainNode.gain.setValueAtTime(startVol, 0);
+                            gainNode.gain.linearRampToValueAtTime(0, playbackEnd);
+                        }
+                        else {
+                            gainNode.gain.setValueAtTime(0, 0);
+                        }
+                    }
+                }
+            }
             // source.start(when, offset)
             source.start(playbackStart, startOffset);
         }

package/dist/features/caption-parser.d.ts

@@ -0,0 +1,9 @@
+export interface SubtitleCue {
+    id?: string;
+    startTime: number;
+    endTime: number;
+    text: string;
+}
+export declare function parseCaptions(content: string): SubtitleCue[];
+export declare function parseSRT(srt: string): SubtitleCue[];
+export declare function stringifySRT(cues: SubtitleCue[]): string;

package/dist/features/caption-parser.js

@@ -0,0 +1,140 @@
+export function parseCaptions(content) {
+    const trimmed = content.trim();
+    if (trimmed.startsWith("WEBVTT")) {
+        return parseWebVTT(content);
+    }
+    return parseSRT(content);
+}
+function parseWebVTT(content) {
+    const cues = [];
+    // Normalize line endings
+    const normalized = content.replace(/\r\n/g, "\n");
+    // Split into blocks by double newlines
+    const blocks = normalized.split(/\n\n+/);
+    for (const block of blocks) {
+        const lines = block.split("\n").map(l => l.trim()).filter(l => l);
+        // Skip header block or metadata blocks
+        // Note: A robust parser would need to handle "WEBVTT" followed by text on the same line,
+        // or metadata headers. For now we skip blocks starting with keywords.
+        if (lines.length === 0 ||
+            lines[0] === "WEBVTT" ||
+            lines[0].startsWith("WEBVTT ") ||
+            lines[0].startsWith("NOTE") ||
+            lines[0].startsWith("STYLE") ||
+            lines[0].startsWith("REGION")) {
+            continue;
+        }
+        let timeLineIndex = -1;
+        for (let i = 0; i < Math.min(lines.length, 2); i++) {
+            if (lines[i].includes("-->")) {
+                timeLineIndex = i;
+                break;
+            }
+        }
+        if (timeLineIndex === -1)
+            continue;
+        const timeLine = lines[timeLineIndex];
+        const textLines = lines.slice(timeLineIndex + 1);
+        let id;
+        if (timeLineIndex > 0) {
+            id = lines[timeLineIndex - 1];
+        }
+        // WebVTT timestamp regex:
+        // (HH:)MM:SS.mmm or (HH:)MM:SS,mmm
+        const timeMatch = timeLine.match(/((?:\d{2}:)?\d{2}:\d{2}[.,]\d{3})\s*-->\s*((?:\d{2}:)?\d{2}:\d{2}[.,]\d{3})/);
+        if (timeMatch) {
+            const startTime = parseTime(timeMatch[1]);
+            const endTime = parseTime(timeMatch[2]);
+            const text = textLines.join("\n").trim();
+            if (!isNaN(startTime) && !isNaN(endTime)) {
+                cues.push({ id, startTime, endTime, text });
+            }
+        }
+    }
+    return cues;
+}
+export function parseSRT(srt) {
+    if (!srt)
+        return [];
+    const cues = [];
+    // Normalize line endings and split by double newlines to separate blocks
+    const blocks = srt.trim().replace(/\r\n/g, "\n").split(/\n\n+/);
+    for (const block of blocks) {
+        const lines = block.split("\n");
+        if (lines.length < 2)
+            continue;
+        // Usually:
+        // Line 1: Index
+        // Line 2: Timestamp range
+        // Line 3+: Text
+        // But sometimes index is missing or we need to be robust.
+        // We look for the timestamp line.
+        let timeLineIndex = -1;
+        for (let i = 0; i < Math.min(lines.length, 2); i++) {
+            if (lines[i].includes("-->")) {
+                timeLineIndex = i;
+                break;
+            }
+        }
+        if (timeLineIndex === -1)
+            continue;
+        const timeLine = lines[timeLineIndex];
+        const textLines = lines.slice(timeLineIndex + 1);
+        let id;
+        if (timeLineIndex > 0) {
+            id = lines[timeLineIndex - 1];
+        }
+        // Format: 00:00:01,000 --> 00:00:04,000
+        // We allow dot or comma for milliseconds
+        const timeMatch = timeLine.match(/(\d{1,2}:\d{2}:\d{2}[,.]\d{1,3})\s*-->\s*(\d{1,2}:\d{2}:\d{2}[,.]\d{1,3})/);
+        if (timeMatch) {
+            const startTime = parseTime(timeMatch[1]);
+            const endTime = parseTime(timeMatch[2]);
+            const text = textLines.join("\n").trim();
+            if (!isNaN(startTime) && !isNaN(endTime)) {
+                cues.push({ id, startTime, endTime, text });
+            }
+        }
+    }
+    return cues;
+}
+function parseTime(timeString) {
+    // Normalize comma to dot for parseFloat
+    const parts = timeString.replace(",", ".").split(":");
+    if (parts.length === 3) {
+        const hours = parseFloat(parts[0]);
+        const minutes = parseFloat(parts[1]);
+        const seconds = parseFloat(parts[2]);
+        return hours * 3600 + minutes * 60 + seconds;
+    }
+    else if (parts.length === 2) {
+        const minutes = parseFloat(parts[0]);
+        const seconds = parseFloat(parts[1]);
+        return minutes * 60 + seconds;
+    }
+    return NaN;
+}
+export function stringifySRT(cues) {
+    if (!cues || cues.length === 0)
+        return "";
+    return cues
+        .map((cue, index) => {
+        const start = formatTime(cue.startTime);
+        const end = formatTime(cue.endTime);
+        const id = cue.id || String(index + 1);
+        return `${id}\n${start} --> ${end}\n${cue.text}\n\n`;
+    })
+        .join("");
+}
+function formatTime(seconds) {
+    const totalMs = Math.round(seconds * 1000);
+    const hours = Math.floor(totalMs / 3600000);
+    const minutes = Math.floor((totalMs % 3600000) / 60000);
+    const secs = Math.floor((totalMs % 60000) / 1000);
+    const ms = totalMs % 1000;
+    const hh = String(hours).padStart(2, "0");
+    const mm = String(minutes).padStart(2, "0");
+    const ss = String(secs).padStart(2, "0");
+    const mmm = String(ms).padStart(3, "0");
+    return `${hh}:${mm}:${ss},${mmm}`;
+}

package/dist/features/dom-capture.d.ts

@@ -1 +1,4 @@
-export declare function captureDomToBitmap(element: HTMLElement): Promise<ImageBitmap>;
+export declare function captureDomToBitmap(element: HTMLElement, options?: {
+    targetWidth?: number;
+    targetHeight?: number;
+}): Promise<ImageBitmap>;