import { type CSSProperties, type ReactNode } from "react";
import { type BadgeCorner } from "./badge.js";
import type { ShaderConfig } from "./config.js";
import type { ShaderName, ShaderParams } from "./registry.js";
import { type RendererStatus, type ShaderRenderer } from "./renderer.js";
import type { ShaderSourceInput } from "./source.js";
import type { PlayMode, QualityOptions, QualityState } from "./types.js";
export interface ShaderCanvasProps<K extends ShaderName = ShaderName> {
    /** A preset from `defineShader`. Anything below overrides it. */
    preset?: ShaderConfig<K>;
    shader?: K;
    params?: ShaderParams<K>;
    /**
     * The layer a source shader reads: an image, a URL, a video, or
     * `{ shader, params }` to stack it on another shadertown shader. Omit it and
     * the shader falls back to the backdrop its registry entry names.
     */
    source?: ShaderSourceInput;
    /**
     * Resolution ceiling, frame-rate cap, and the quality tier. Omit `tier` to
     * follow the page's `setQualityTier` setting, which defaults to `auto`:
     * High first, Low once if the device, the battery, or the frame rate ask
     * for it. Name one to pin this canvas.
     */
    quality?: QualityOptions;
    /**
     * When the shader is allowed to animate.
     * `visible` (the default) animates only while on screen.
     */
    play?: PlayMode;
    className?: string;
    style?: CSSProperties;
    /** Rendered instead of the canvas when WebGPU is unavailable. */
    fallback?: ReactNode;
    onStatusChange?: (status: RendererStatus) => void;
    /**
     * The tier on screen and why, whenever it changes. Read `effective` to show
     * a reader what their device is actually drawing.
     */
    onQualityChange?: (state: QualityState) => void;
    /** Feeds the `pointer` uniform. Off by default — it costs a listener. */
    trackPointer?: boolean;
    /** Clock offset, so a paused card shows a frame worth looking at. */
    startTime?: number;
    /**
     * The shadertown credit in the corner.
     *
     * `false` removes it. A corner name — `"top-left"` and the other three —
     * keeps it and moves it there. Omit it and the canvas follows the page's
     * `setBadge` and `setBadgePosition` settings, which are shown, bottom right.
     *
     * A paid licence lifts the obligation; see the LICENSE beside the shader.
     */
    badge?: boolean | BadgeCorner;
    "aria-hidden"?: boolean;
}
/**
 * A canvas running one shadertown shader.
 *
 * The renderer is created once per mount; param changes are pushed through
 * `setParams` rather than by remounting, so dragging a slider never recompiles
 * a pipeline.
 */
export declare function ShaderCanvas<K extends ShaderName>({ preset, shader, params, source, quality, play, className, style, fallback, onStatusChange, onQualityChange, trackPointer, startTime, badge, "aria-hidden": ariaHidden, }: ShaderCanvasProps<K>): import("react").JSX.Element;
/**
 * Imperative escape hatch: attach a renderer to a canvas you own.
 * Returns the live renderer so you can drive it from animation code.
 */
export declare function useShaderRenderer<K extends ShaderName>(canvasRef: React.RefObject<HTMLCanvasElement | null>, config: ShaderConfig<K>): ShaderRenderer | null;
//# sourceMappingURL=react.d.ts.map