trtc-electron-sdk 10.3.402 → 10.3.403

package/liteav/Renderer/IRenderer.d.ts

@@ -0,0 +1,6 @@
+import { TRTCVideoFillMode } from "../trtc_define";
+import { TFrameData } from './types';
+export default interface IRenderer {
+    drawFrame(frameData: TFrameData): void;
+    setContentMode(mode: TRTCVideoFillMode): void;
+}

package/liteav/Renderer/IRenderer.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/liteav/Renderer/VideoRenderer/index.d.ts

@@ -0,0 +1,25 @@
+import { TRTCVideoFillMode, TRTCVideoPixelFormat } from "../../trtc_define";
+import IRenderer from "../IRenderer";
+import { TFrameData, TCanvasImageSourceStyleOptions } from "../types";
+declare class VideoRenderer implements IRenderer {
+    private pixelFormat;
+    private pixelFormatStr;
+    private viewContainer;
+    private contentMode;
+    private video;
+    private viewWrapper;
+    private track;
+    private writer;
+    private cacheCanvasOptions;
+    constructor(pixelFormat: TRTCVideoPixelFormat, view: HTMLElement);
+    setContentMode(mode?: TRTCVideoFillMode): void;
+    private bind;
+    private unbind;
+    drawFrame(frameData: TFrameData): Promise<void>;
+    _drawFrameH264(frameData: TFrameData): void;
+    _drawFrameNonH264(frameData: TFrameData): Promise<void>;
+    _getPixelFormat(): string;
+    _updateVideoStyle(options: TCanvasImageSourceStyleOptions): void;
+    destroy(): void;
+}
+export default VideoRenderer;

package/liteav/Renderer/VideoRenderer/index.js

@@ -0,0 +1,148 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const lodash_isequal_1 = __importDefault(require("lodash.isequal"));
+const trtc_define_1 = require("../../trtc_define");
+const util_1 = require("../util");
+class VideoRenderer {
+    constructor(pixelFormat, view) {
+        this.pixelFormat = pixelFormat;
+        this.pixelFormatStr = this._getPixelFormat();
+        this.viewContainer = view;
+        this.contentMode = trtc_define_1.TRTCVideoFillMode.TRTCVideoFillMode_Fit;
+        const viewWrapper = document.createElement('div');
+        viewWrapper.className = 'trtc-video';
+        Object.assign(viewWrapper.style, {
+            width: '100%',
+            height: '100%',
+            display: 'flex',
+            justifyContent: 'center',
+            alignItems: 'center'
+        });
+        this.viewWrapper = viewWrapper;
+        this.track = new window.MediaStreamTrackGenerator({ kind: 'video' });
+        this.writer = this.track.writable.getWriter();
+        this.video = document.createElement('video');
+        this.video.setAttribute('style', 'display: block;');
+        this.video.setAttribute('autoplay', 'autoplay');
+        this.video.muted = true;
+        this.video.srcObject = new MediaStream([this.track]);
+        this.viewWrapper.appendChild(this.video);
+        this.cacheCanvasOptions = {};
+        this.bind(view);
+    }
+    setContentMode(mode = trtc_define_1.TRTCVideoFillMode.TRTCVideoFillMode_Fit) {
+        this.contentMode = mode;
+    }
+    bind(viewContainer) {
+        this.viewContainer = viewContainer;
+        if (this.viewWrapper) {
+            this.viewContainer.appendChild(this.viewWrapper);
+        }
+    }
+    unbind() {
+        this.viewWrapper && this.viewContainer && this.viewContainer.removeChild(this.viewWrapper);
+        this.viewContainer = null;
+    }
+    drawFrame(frameData) {
+        return __awaiter(this, void 0, void 0, function* () {
+            switch (this.pixelFormat) {
+                case trtc_define_1.TRTCVideoPixelFormat.TRTCVideoPixelFormat_I420:
+                case trtc_define_1.TRTCVideoPixelFormat.TRTCVideoPixelFormat_RGBA32:
+                case trtc_define_1.TRTCVideoPixelFormat.TRTCVideoPixelFormat_BGRA32:
+                    yield this._drawFrameNonH264(frameData);
+                    break;
+                case trtc_define_1.TRTCVideoPixelFormat.TRTCVideoPixelFormat_H264:
+                    yield this._drawFrameH264(frameData);
+                    break;
+                default:
+                    console.warn('trtc:VideoRenderer.drawFrame error. Not support video format:', this.pixelFormat);
+            }
+        });
+    }
+    _drawFrameH264(frameData) {
+        // To-do
+        console.warn('trtc:H264 renderer not supported right now');
+    }
+    _drawFrameNonH264(frameData) {
+        return __awaiter(this, void 0, void 0, function* () {
+            try {
+                const { data, width, height, timestamp, rotation, isNeedRotate } = frameData;
+                if (width <= 0 || height <= 0) {
+                    throw new Error(`wrong video parameter width:${width} or height:${height}`);
+                }
+                if (this.viewWrapper && this.writer) {
+                    this._updateVideoStyle({
+                        contentWidth: width,
+                        contentHeight: height,
+                        containerWidth: this.viewWrapper.clientWidth,
+                        containerHeight: this.viewWrapper.clientHeight,
+                        contentMode: this.contentMode,
+                        rotation,
+                        isNeedRotate,
+                        isNeedMirror: false,
+                    });
+                    const vf = new window.VideoFrame(frameData.data, {
+                        format: this.pixelFormatStr,
+                        codedWidth: frameData.width,
+                        codedHeight: frameData.height,
+                        timestamp: frameData.timestamp,
+                    });
+                    yield this.writer.write(vf);
+                }
+                else {
+                    throw new Error('renderer container element is null');
+                }
+            }
+            catch (err) {
+                console.error('trtc:VideoRenderer._drawFrameH264 error:', err);
+            }
+        });
+    }
+    _getPixelFormat() {
+        switch (this.pixelFormat) {
+            case trtc_define_1.TRTCVideoPixelFormat.TRTCVideoPixelFormat_I420:
+                return 'I420';
+            case trtc_define_1.TRTCVideoPixelFormat.TRTCVideoPixelFormat_RGBA32:
+                return 'RGBA';
+            case trtc_define_1.TRTCVideoPixelFormat.TRTCVideoPixelFormat_BGRA32:
+                return 'BGRA';
+            default:
+                return '';
+        }
+    }
+    _updateVideoStyle(options) {
+        if (this.video) {
+            if ((0, lodash_isequal_1.default)(this.cacheCanvasOptions, options)) {
+                return;
+            }
+            this.cacheCanvasOptions = Object.assign({}, options);
+            const style = (0, util_1.calcVideoStyle)(options);
+            Object.keys(style).forEach(key => {
+                // @ts-ignore
+                this.video.style[key] = style[key];
+            });
+        }
+        else {
+            throw new Error('video element not exist');
+        }
+    }
+    destroy() {
+        this.unbind();
+        this.viewWrapper = null;
+        this.video = null;
+        this.cacheCanvasOptions = null;
+    }
+}
+exports.default = VideoRenderer;

package/liteav/Renderer/index.d.ts

@@ -0,0 +1,3 @@
+import { TRTCVideoPixelFormat } from '../trtc_define';
+import IRenderer from './IRenderer';
+export declare function createRenderer(pixelFormat: TRTCVideoPixelFormat, view: HTMLElement): IRenderer;

package/liteav/Renderer/index.js

@@ -0,0 +1,38 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createRenderer = void 0;
+const Canvas3DRenderer_1 = __importDefault(require("./Canvas3DRenderer"));
+const Canvas2DRenderer_1 = __importDefault(require("./Canvas2DRenderer"));
+const VideoRenderer_1 = __importDefault(require("./VideoRenderer"));
+const util_1 = require("./util");
+const isWebGLSupported = (0, util_1.isSupportWebGL)();
+function createRenderer(pixelFormat, view) {
+    let renderer = null;
+    if (isWebGLSupported) {
+        try {
+            renderer = new Canvas3DRenderer_1.default(pixelFormat, view);
+            console.log('trtc: created WebGL render');
+        }
+        catch (err) {
+            console.log('trtc: create WebGL renderer error.', err.message);
+            renderer = null;
+        }
+    }
+    if (!renderer) {
+        // @ts-ignore
+        if (window.VideoFrame && window.VideoDecoder) {
+            // Electron 15+ 版本支持 WebCodec API
+            renderer = new VideoRenderer_1.default(pixelFormat, view);
+            console.log('trtc: created Video render');
+        }
+        else {
+            renderer = new Canvas2DRenderer_1.default(pixelFormat, view);
+            console.log('trtc: created Canvas 2D render');
+        }
+    }
+    return renderer;
+}
+exports.createRenderer = createRenderer;

package/liteav/Renderer/types.d.ts

@@ -0,0 +1,19 @@
+import { TRTCVideoFillMode } from "../trtc_define";
+export declare type TFrameData = {
+    data: Uint8Array | ArrayBuffer;
+    width: number;
+    height: number;
+    timestamp: number;
+    rotation: number;
+    isNeedRotate: boolean;
+};
+export declare type TCanvasImageSourceStyleOptions = {
+    contentWidth: number;
+    contentHeight: number;
+    containerWidth: number;
+    containerHeight: number;
+    contentMode: TRTCVideoFillMode;
+    isNeedMirror: boolean;
+    isNeedRotate: boolean;
+    rotation: number;
+};

package/liteav/Renderer/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/liteav/Renderer/util.d.ts

@@ -0,0 +1,52 @@
+import { TRTCVideoStreamType } from "../trtc_define";
+/**
+ * 配置对象, 可用来打开 debug 模式
+ *
+ * @example
+ * // 使用示例代码：
+ * const TRTCCloud = require('trtc-electron-sdk');
+ * this.rtcCloud = new TRTCCloud();
+ * this.rtcCloud.getConfigObject().setDebugMode(true);
+ *
+ */
+export declare class Config {
+    private debugMode;
+    constructor();
+    setDebugMode(enable: boolean): void;
+    getDebugMode(): boolean;
+}
+export declare function isNeedKeepWidthAndHeight(rotation: number, isNeedRotate: boolean): boolean;
+export declare function calcScaleRate(vertical: boolean, contentMode: number, contentWidth: number, contentHeight: number, containerWidth: number, containerHeight: number): number;
+export declare function calcCanvasStyle(options?: {
+    contentWidth: number;
+    contentHeight: number;
+    rotation: number;
+    isNeedMirror: boolean;
+    contentMode: number;
+    containerWidth: number;
+    containerHeight: number;
+    isNeedRotate: boolean;
+}): {
+    [x: string]: any;
+};
+export declare function calcVideoStyle(options?: {
+    contentWidth: number;
+    contentHeight: number;
+    rotation: number;
+    isNeedMirror: boolean;
+    contentMode: number;
+    containerWidth: number;
+    containerHeight: number;
+    isNeedRotate: boolean;
+}): {
+    [x: string]: any;
+};
+export declare const config: Config;
+export declare function allocBuffer(length: number, userId?: string, streamType?: TRTCVideoStreamType): Uint8Array | null;
+export declare function transferBGRA2RGBA(data: Uint8Array | ArrayBuffer, width: number, height: number): Uint8Array | ArrayBuffer;
+/**
+ * 判断是否支持webGL
+ * @returns {boolean}
+ * @private
+ */
+export declare function isSupportWebGL(): boolean;

package/liteav/Renderer/util.js

@@ -0,0 +1,181 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isSupportWebGL = exports.transferBGRA2RGBA = exports.allocBuffer = exports.config = exports.calcVideoStyle = exports.calcCanvasStyle = exports.calcScaleRate = exports.isNeedKeepWidthAndHeight = exports.Config = void 0;
+/**
+ * 配置对象, 可用来打开 debug 模式
+ *
+ * @example
+ * // 使用示例代码：
+ * const TRTCCloud = require('trtc-electron-sdk');
+ * this.rtcCloud = new TRTCCloud();
+ * this.rtcCloud.getConfigObject().setDebugMode(true);
+ *
+ */
+class Config {
+    constructor() {
+        this.debugMode = false;
+    }
+    setDebugMode(enable) {
+        this.debugMode = enable;
+    }
+    getDebugMode() {
+        return this.debugMode;
+    }
+}
+exports.Config = Config;
+function isNeedKeepWidthAndHeight(rotation, isNeedRotate) {
+    // 需保持宽高不做变化
+    return rotation === 0 || rotation === 180 || !isNeedRotate;
+}
+exports.isNeedKeepWidthAndHeight = isNeedKeepWidthAndHeight;
+function calcScaleRate(vertical = false, contentMode = 0, contentWidth, contentHeight, containerWidth, containerHeight) {
+    const containerRatio = containerWidth / containerHeight;
+    const contentRatio = contentWidth / contentHeight;
+    if (isNaN(containerRatio) || isNaN(contentRatio)) {
+        return 1;
+    }
+    if (!contentMode) {
+        if (vertical) {
+            return containerRatio > contentRatio
+                ? containerHeight / contentHeight : containerWidth / contentWidth;
+        }
+        else {
+            return containerRatio < contentRatio
+                ? containerHeight / contentHeight : containerWidth / contentWidth;
+        }
+    }
+    else {
+        if (vertical) {
+            return containerRatio < contentRatio
+                ? containerHeight / contentHeight : containerWidth / contentWidth;
+        }
+        else {
+            return containerRatio > contentRatio
+                ? containerHeight / contentHeight : containerWidth / contentWidth;
+        }
+    }
+}
+exports.calcScaleRate = calcScaleRate;
+function calcCanvasStyle(options = {
+    contentWidth: 0,
+    contentHeight: 0,
+    rotation: 0,
+    isNeedMirror: false,
+    contentMode: 0,
+    containerWidth: 0,
+    containerHeight: 0,
+    isNeedRotate: true
+}) {
+    if ([0, 90, 180, 270].indexOf(options.rotation) === -1) {
+        throw new Error('Invalid value for rotation. Only support 0, 90, 180, 270');
+    }
+    const style = {
+        width: 0,
+        height: 0,
+        transform: ''
+    };
+    const isKeepWidthHeight = isNeedKeepWidthAndHeight(options.rotation, options.isNeedRotate);
+    if (isKeepWidthHeight) {
+        style.width = options.contentWidth;
+        style.height = options.contentHeight;
+    }
+    else {
+        style.height = options.contentWidth;
+        style.width = options.contentHeight;
+    }
+    const scale = calcScaleRate(!isKeepWidthHeight, options.contentMode, style.width, style.height, options.containerWidth, options.containerHeight);
+    style.transform = `scale(${scale})`;
+    if (options.isNeedMirror) {
+        style.transform = `${style.transform} rotateY(180deg)`;
+    }
+    return style;
+}
+exports.calcCanvasStyle = calcCanvasStyle;
+function calcVideoStyle(options = {
+    contentWidth: 0,
+    contentHeight: 0,
+    rotation: 0,
+    isNeedMirror: false,
+    contentMode: 0,
+    containerWidth: 0,
+    containerHeight: 0,
+    isNeedRotate: true
+}) {
+    if ([0, 90, 180, 270].indexOf(options.rotation) === -1) {
+        throw new Error('Invalid value for rotation. Only support 0, 90, 180, 270');
+    }
+    let width = 0;
+    let height = 0;
+    const isKeepWidthHeight = isNeedKeepWidthAndHeight(options.rotation, options.isNeedRotate);
+    if (isKeepWidthHeight) {
+        width = options.contentWidth;
+        height = options.contentHeight;
+    }
+    else {
+        height = options.contentWidth;
+        width = options.contentHeight;
+    }
+    const scale = calcScaleRate(!isKeepWidthHeight, options.contentMode, width, height, options.containerWidth, options.containerHeight);
+    const style = {
+        width: `${width * scale}px`,
+        height: `${height * scale}px`,
+    };
+    if (options.isNeedMirror) {
+        style.transform = 'rotateY(180deg)';
+    }
+    return style;
+}
+exports.calcVideoStyle = calcVideoStyle;
+exports.config = new Config();
+function allocBuffer(length, userId, streamType) {
+    console.debug('trtc:alloc buffer:', length, userId, streamType);
+    if (length >= 1) {
+        return Buffer.alloc(length);
+    }
+    return null;
+}
+exports.allocBuffer = allocBuffer;
+function transferBGRA2RGBA(data, width, height) {
+    const bgraData = new Uint8ClampedArray((data.buffer || data).slice(0));
+    const rgbaData = new Uint8ClampedArray((data.buffer || data).slice(0));
+    // 将 BGRA8888 转成 RGBA8888
+    for (let i = 0; i < width * height; i++) {
+        rgbaData[4 * i] = bgraData[4 * i + 2];
+        rgbaData[4 * i + 1] = bgraData[4 * i + 1];
+        rgbaData[4 * i + 2] = bgraData[4 * i];
+        rgbaData[4 * i + 3] = bgraData[4 * i + 3];
+    }
+    return rgbaData;
+}
+exports.transferBGRA2RGBA = transferBGRA2RGBA;
+/**
+ * 判断是否支持webGL
+ * @returns {boolean}
+ * @private
+ */
+function isSupportWebGL() {
+    const canvas = document.createElement('canvas');
+    let gl;
+    canvas.width = 1;
+    canvas.height = 1;
+    const options = {
+        alpha: false,
+        depth: false,
+        stencil: false,
+        antialias: false,
+        preferLowPowerToHighPerformance: true
+    };
+    try {
+        gl = canvas.getContext('webgl', options) || canvas.getContext('experimental-webgl', options);
+    }
+    catch (e) {
+        return false;
+    }
+    if (gl) {
+        return true;
+    }
+    else {
+        return false;
+    }
+}
+exports.isSupportWebGL = isSupportWebGL;

package/liteav/Renderer/yuv-buffer.d.ts

@@ -0,0 +1,189 @@
+/**
+  * Represents metadata about a YUV frame format.
+  * @typedef {Object} YUVFormat
+  * @property {number} width - width of encoded frame in luma pixels
+  * @property {number} height - height of encoded frame in luma pixels
+  * @property {number} chromaWidth - width of encoded frame in chroma pixels
+  * @property {number} chromaHeight - height of encoded frame in chroma pixels
+  * @property {number} cropLeft - upper-left X coordinate of visible crop region, in luma pixels
+  * @property {number} cropTop - upper-left Y coordinate of visible crop region, in luma pixels
+  * @property {number} cropWidth - width of visible crop region, in luma pixels
+  * @property {number} cropHeight - height of visible crop region, in luma pixels
+  * @property {number} displayWidth - final display width of visible region, in luma pixels
+  * @property {number} displayHeight - final display height of visible region, in luma pixels
+  */
+export interface YUVFormat {
+    width: number;
+    height: number;
+    chromaWidth: number;
+    chromaHeight: number;
+    cropLeft?: number;
+    cropTop?: number;
+    cropWidth?: number;
+    cropHeight?: number;
+    displayWidth?: number;
+    displayHeight?: number;
+}
+/**
+ * Represents underlying image data for a single luma or chroma plane.
+ * Cannot be interpreted without the format data from a frame buffer.
+ * @typedef {Object} YUVPlane
+ * @property {Uint8Array} bytes - typed array containing image data bytes
+ * @property {number} stride - byte distance between rows in data
+ */
+export interface YUVPlane {
+    bytes: Uint8Array;
+    stride: number;
+}
+/**
+ * Represents a YUV image frame buffer, with enough format information
+ * to interpret the data usefully. Buffer objects use generic objects
+ * under the hood and can be transferred between worker threads using
+ * the structured clone algorithm.
+ *
+ * @typedef {Object} YUVFrame
+ * @property {YUVFormat} format
+ * @property {YUVPlane} y
+ * @property {YUVPlane} u
+ * @property {YUVPlane} v
+ */
+export interface YUVFrame {
+    format: YUVFormat;
+    y: YUVPlane;
+    u: YUVPlane;
+    v: YUVPlane;
+}
+/**
+ * Represents metadata about a YUV frame format.
+ * @typedef {Object} YUVFormat
+ * @property {number} width - width of encoded frame in luma pixels
+ * @property {number} height - height of encoded frame in luma pixels
+ * @property {number} chromaWidth - width of encoded frame in chroma pixels
+ * @property {number} chromaHeight - height of encoded frame in chroma pixels
+ * @property {number} cropLeft - upper-left X coordinate of visible crop region, in luma pixels
+ * @property {number} cropTop - upper-left Y coordinate of visible crop region, in luma pixels
+ * @property {number} cropWidth - width of visible crop region, in luma pixels
+ * @property {number} cropHeight - height of visible crop region, in luma pixels
+ * @property {number} displayWidth - final display width of visible region, in luma pixels
+ * @property {number} displayHeight - final display height of visible region, in luma pixels
+ */
+/**
+ * Represents underlying image data for a single luma or chroma plane.
+ * Cannot be interpreted without the format data from a frame buffer.
+ * @typedef {Object} YUVPlane
+ * @property {Uint8Array} bytes - typed array containing image data bytes
+ * @property {number} stride - byte distance between rows in data
+ */
+/**
+ * Represents a YUV image frame buffer, with enough format information
+ * to interpret the data usefully. Buffer objects use generic objects
+ * under the hood and can be transferred between worker threads using
+ * the structured clone algorithm.
+ *
+ * @typedef {Object} YUVFrame
+ * @property {YUVFormat} format
+ * @property {YUVPlane} y
+ * @property {YUVPlane} u
+ * @property {YUVPlane} v
+ */
+/**
+ * Holder namespace for utility functions and constants related to
+ * YUV frame and plane buffers.
+ *
+ * @namespace
+ */
+declare var YUVBuffer: {
+    /**
+     * Validate a plane dimension
+     * @param {number} dim - vertical or horizontal dimension
+     * @throws exception on zero, negative, or non-integer value
+     */
+    validateDimension: (dim: number) => void;
+    /**
+     * Validate a plane offset
+     * @param {number} dim - vertical or horizontal dimension
+     * @throws exception on negative or non-integer value
+     */
+    validateOffset: (dim: number) => void;
+    /**
+     * Validate and fill out a YUVFormat object structure.
+     *
+     * At least width and height fields are required; other fields will be
+     * derived if left missing or empty:
+     * - chromaWidth and chromaHeight will be copied from width and height as for a 4:4:4 layout
+     * - cropLeft and cropTop will be 0
+     * - cropWidth and cropHeight will be set to whatever of the frame is visible after cropTop and cropLeft are applied
+     * - displayWidth and displayHeight will be set to cropWidth and cropHeight.
+     *
+     * @param {YUVFormat} fields - input fields, must include width and height.
+     * @returns {YUVFormat} - validated structure, with all derivable fields filled out.
+     * @throws exception on invalid fields or missing width/height
+     */
+    format: (fields: YUVFormat) => YUVFormat;
+    /**
+     * Pick a suitable stride for a custom-allocated thingy
+     * @param {number} width - width in bytes
+     * @returns {number} - new width in bytes at least as large
+     * @throws exception on invalid input width
+     */
+    suitableStride: (width: number) => number;
+    /**
+     * Allocate or extract a YUVPlane object from given dimensions/source.
+     * @param {number} width - width in pixels
+     * @param {number} height - height in pixels
+     * @param {Uint8Array} source - input byte array; optional (will create empty buffer if missing)
+     * @param {number} stride - row length in bytes; optional (will create a default if missing)
+     * @param {number} offset - offset into source array to extract; optional (will start at 0 if missing)
+     * @returns {YUVPlane} - freshly allocated planar buffer
+     */
+    allocPlane: (width: number, height: number, source?: Uint8Array, stride?: number, offset?: number) => YUVPlane;
+    /**
+     * Allocate a new YUVPlane object big enough for a luma plane in the given format
+     * @param {YUVFormat} format - target frame format
+     * @param {Uint8Array} source - input byte array; optional (will create empty buffer if missing)
+     * @param {number} stride - row length in bytes; optional (will create a default if missing)
+     * @param {number} offset - offset into source array to extract; optional (will start at 0 if missing)
+     * @returns {YUVPlane} - freshly allocated planar buffer
+     */
+    lumaPlane: (format: YUVFormat, source?: Uint8Array, stride?: number, offset?: number) => YUVPlane;
+    /**
+     * Allocate a new YUVPlane object big enough for a chroma plane in the given format,
+     * optionally copying data from an existing buffer.
+     *
+     * @param {YUVFormat} format - target frame format
+     * @param {Uint8Array} source - input byte array; optional (will create empty buffer if missing)
+     * @param {number} stride - row length in bytes; optional (will create a default if missing)
+     * @param {number} offset - offset into source array to extract; optional (will start at 0 if missing)
+     * @returns {YUVPlane} - freshly allocated planar buffer
+     */
+    chromaPlane: (format: YUVFormat, source?: Uint8Array, stride?: number, offset?: number) => YUVPlane;
+    /**
+     * Allocate a new YUVFrame object big enough for the given format
+     * @param {YUVFormat} format - target frame format
+     * @param {YUVPlane} y - optional Y plane; if missing, fresh one will be allocated
+     * @param {YUVPlane} u - optional U plane; if missing, fresh one will be allocated
+     * @param {YUVPlane} v - optional V plane; if missing, fresh one will be allocated
+     * @returns {YUVFrame} - freshly allocated frame buffer
+     */
+    frame: (format: YUVFormat, y: YUVPlane, u: YUVPlane, v: YUVPlane) => YUVFrame;
+    /**
+     * Duplicate a plane using new buffer memory.
+     * @param {YUVPlane} plane - input plane to copy
+     * @returns {YUVPlane} - freshly allocated and filled planar buffer
+     */
+    copyPlane: (plane: YUVPlane) => YUVPlane;
+    /**
+     * Duplicate a frame using new buffer memory.
+     * @param {YUVFrame} frame - input frame to copyFrame
+     * @returns {YUVFrame} - freshly allocated and filled frame buffer
+     */
+    copyFrame: (frame: YUVFrame) => YUVFrame;
+    /**
+     * List the backing buffers for the frame's planes for transfer between
+     * threads via Worker.postMessage.
+     * @param {YUVFrame} frame - input frame
+     * @returns {Array} - list of transferable objects
+     */
+    transferables: (frame: YUVFrame) => (ArrayBuffer | SharedArrayBuffer)[];
+};
+export default YUVBuffer;