import React from 'react';
import type { EffectsProp } from './effects/effect-types.js';
import type { InteractiveBaseProps } from './Interactive.js';
import type { AbsoluteFillLayout } from './Sequence.js';
declare global {
    interface ElementImage {
        readonly width: number;
        readonly height: number;
        close(): void;
    }
    interface CanvasRenderingContext2D {
        drawElementImage(element: Element | ElementImage, dx: number, dy: number): DOMMatrix;
        drawElementImage(element: Element | ElementImage, dx: number, dy: number, dwidth: number, dheight: number): DOMMatrix;
        drawElementImage(element: Element | ElementImage, sx: number, sy: number, swidth: number, sheight: number, dx: number, dy: number): DOMMatrix;
        drawElementImage(element: Element | ElementImage, sx: number, sy: number, swidth: number, sheight: number, dx: number, dy: number, dwidth: number, dheight: number): DOMMatrix;
    }
    interface OffscreenCanvasRenderingContext2D {
        drawElementImage(element: Element | ElementImage, dx: number, dy: number): DOMMatrix;
        drawElementImage(element: Element | ElementImage, dx: number, dy: number, dwidth: number, dheight: number): DOMMatrix;
        drawElementImage(element: Element | ElementImage, sx: number, sy: number, swidth: number, sheight: number, dx: number, dy: number): DOMMatrix;
        drawElementImage(element: Element | ElementImage, sx: number, sy: number, swidth: number, sheight: number, dx: number, dy: number, dwidth: number, dheight: number): DOMMatrix;
    }
    interface WebGLRenderingContextBase {
        texElementImage2D(target: GLenum, level: GLint, internalformat: GLint, format: GLenum, type: GLenum, element: Element | ElementImage): void;
        texElementImage2D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, element: Element | ElementImage): void;
        texElementImage2D(target: GLenum, level: GLint, internalformat: GLint, sx: GLfloat, sy: GLfloat, swidth: GLfloat, sheight: GLfloat, format: GLenum, type: GLenum, element: Element | ElementImage): void;
        texElementImage2D(target: GLenum, level: GLint, internalformat: GLint, sx: GLfloat, sy: GLfloat, swidth: GLfloat, sheight: GLfloat, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, element: Element | ElementImage): void;
    }
    interface HTMLCanvasElementEventMap {
        paint: Event;
    }
    interface HTMLCanvasElement {
        layoutSubtree?: boolean;
        onpaint: ((this: HTMLCanvasElement, ev: Event) => unknown) | null;
        requestPaint?(): void;
        captureElementImage(element: Element): ElementImage;
        getElementTransform(element: Element | ElementImage, drawTransform: DOMMatrix): DOMMatrix;
    }
}
export type HtmlInCanvasOnPaintParams = {
    /**
     * The `OffscreenCanvas` from {@link HTMLCanvasElement.transferControlToOffscreen}
     * on the layout `<canvas>` (same logical canvas as the forwarded ref).
     */
    readonly canvas: OffscreenCanvas;
    readonly element: HTMLDivElement;
    readonly elementImage: ElementImage;
    readonly pixelDensity: number;
};
export declare const isHtmlInCanvasSupported: () => boolean;
/** Shown when {@link isHtmlInCanvasSupported} is false: APIs are absent (old Chrome and/or flag off). */
export declare const HTML_IN_CANVAS_UNSUPPORTED_MESSAGE = "HTML in Canvas is not supported. Two common causes: Chrome is older than version 148 (update Chrome), or the HTML-in-Canvas flag is disabled at chrome://flags/#canvas-draw-element (enable it and restart Chrome).";
export type HtmlInCanvasOnPaint = (params: HtmlInCanvasOnPaintParams) => void | Promise<void>;
export type HtmlInCanvasOnInitCleanup = () => void;
export type HtmlInCanvasOnInit = (params: HtmlInCanvasOnPaintParams) => HtmlInCanvasOnInitCleanup | Promise<HtmlInCanvasOnInitCleanup>;
export type HtmlInCanvasPixelDensity = number;
export type HtmlInCanvasProps = Omit<InteractiveBaseProps, 'children'> & Omit<AbsoluteFillLayout, 'layout' | 'styleWhilePostmounted' | 'postmountFor' | 'premountFor' | 'styleWhilePremounted'> & {
    readonly durationInFrames?: number;
    readonly width: number;
    readonly height: number;
    readonly effects?: EffectsProp;
    readonly children: React.ReactNode;
    readonly onPaint?: HtmlInCanvasOnPaint;
    readonly onInit?: HtmlInCanvasOnInit;
    readonly pixelDensity?: HtmlInCanvasPixelDensity;
};
export declare const htmlInCanvasSchema: {
    readonly 'style.transformOrigin': {
        readonly type: "transform-origin";
        readonly step: 1;
        readonly default: "50% 50%";
        readonly description: "Transform origin";
    };
    readonly 'style.translate': {
        readonly type: "translate";
        readonly step: 1;
        readonly default: "0px 0px";
        readonly description: "Offset";
    };
    readonly 'style.scale': {
        readonly type: "scale";
        readonly max: 100;
        readonly step: 0.01;
        readonly default: 1;
        readonly description: "Scale";
    };
    readonly 'style.rotate': {
        readonly type: "rotation-css";
        readonly step: 1;
        readonly default: "0deg";
        readonly description: "Rotation";
    };
    readonly 'style.opacity': {
        readonly type: "number";
        readonly min: 0;
        readonly max: 1;
        readonly step: 0.01;
        readonly default: 1;
        readonly description: "Opacity";
        readonly hiddenFromList: false;
    };
    readonly durationInFrames: {
        readonly type: "number";
        readonly default: undefined;
        readonly min: 1;
        readonly step: 1;
        readonly hiddenFromList: true;
    };
    readonly from: {
        readonly type: "number";
        readonly default: 0;
        readonly step: 1;
        readonly hiddenFromList: true;
    };
    readonly trimBefore: {
        readonly type: "number";
        readonly default: 0;
        readonly min: 0;
        readonly step: 1;
        readonly hiddenFromList: true;
    };
    readonly freeze: {
        readonly type: "number";
        readonly default: null;
        readonly step: 1;
        readonly hiddenFromList: true;
    };
    readonly hidden: import("./interactivity-schema.js").BooleanFieldSchema;
    readonly name: import("./interactivity-schema.js").HiddenFieldSchema;
    readonly showInTimeline: import("./interactivity-schema.js").HiddenFieldSchema;
    readonly pixelDensity: {
        readonly type: "number";
        readonly min: 1;
        readonly max: 3;
        readonly step: 0.1;
        readonly default: 1;
        readonly description: "Pixel density";
        readonly hiddenFromList: false;
    };
};
export declare const HtmlInCanvas: React.ForwardRefExoticComponent<Omit<InteractiveBaseProps, "children"> & Omit<AbsoluteFillLayout, "layout" | "postmountFor" | "premountFor" | "styleWhilePostmounted" | "styleWhilePremounted"> & {
    readonly durationInFrames?: number | undefined;
    readonly width: number;
    readonly height: number;
    readonly effects?: EffectsProp | undefined;
    readonly children: React.ReactNode;
    readonly onPaint?: HtmlInCanvasOnPaint | undefined;
    readonly onInit?: HtmlInCanvasOnInit | undefined;
    readonly pixelDensity?: number | undefined;
} & React.RefAttributes<HTMLCanvasElement>> & {
    readonly isSupported: () => boolean;
};