import GlowTourElement, { type TourElementStep } from "./base";
export default class OverlayElement extends GlowTourElement {
    private currentTransition;
    private geometryTween;
    /** Where the cutout is now — the tween's starting point on the next move. */
    private cutout;
    private visualState;
    private cssPathDSupported;
    setInteractionAllowed(allowed: boolean): void;
    /**
     * Brings the cutout onto `nextPosition`, morphing from wherever it was.
     *
     * Pass `tracked` when the caller will drive the geometry itself frame by
     * frame, as it does while a step's scroll is in flight. An animation on the
     * `d` property overrides the inline value for as long as it runs, so those
     * per-frame writes would be invisible and the cutout would land on the rect
     * captured here — the target's position before the page moved — then jump.
     * Tracked, the geometry is committed once and left alone; only opacity is
     * ever animated.
     */
    moveToTarget(nextPosition: DOMRect, step: TourElementStep, tracked?: boolean): Promise<void>;
    animateTo(position: DOMRect, step: TourElementStep): Promise<void>;
    _getNextStyles(position: DOMRect, step: TourElementStep): Keyframe;
    /** The backdrop with a hole punched around `position`, as a CSS `d` value. */
    private _cutoutPath;
    initializeProps(): void;
    private _getPathElement;
    protected _release(): void;
    updatePosition(nextPosition: DOMRect, step: TourElementStep, animateChanges?: boolean, onTransition?: (transition: Promise<void>) => void): void;
    /**
     * Pins the `viewBox` to the element's own box, so one SVG unit is one CSS
     * pixel and the cutout lands where `getBoundingClientRect()` said it should.
     */
    private syncViewBox;
    cancelAnimations(): void;
    /**
     * Starts an animation whose keyframes carry the cutout geometry.
     *
     * WebKit ignores `d` both as a CSS property and as an animatable value, so
     * there the geometry is stripped from the keyframes — the engine animates
     * fill and opacity — and {@link _startGeometryTween} moves the shape instead.
     * When it cannot, the target shape is committed up front, which is the old
     * snap-and-be-correct behaviour.
     */
    private _startPathAnimation;
    /**
     * Morphs the cutout by hand, one frame at a time, the way driver.js moves its
     * stage: the rectangle is interpolated and the path regenerated from it.
     *
     * The clock is the animation that is already running on the same element, so
     * the shape, the backdrop and anything else the engine is easing stay in step
     * without this having to re-implement a timing function. Its progress reads
     * `null` once it is over, which is the tween's cue to land and stop.
     *
     * @returns Whether the tween took ownership of the geometry. `false` leaves
     *   the caller to commit the final shape.
     */
    private _startGeometryTween;
    /** Drops the running cutout tween, leaving the shape wherever it got to. */
    private _stopGeometryTween;
    /**
     * Whether this document implements the CSS `d` property. Safari/WebKit — and
     * therefore every browser on iOS, Chrome included — does not: an inline
     * `d: path(...)` is dropped on the floor and the backdrop never draws.
     */
    private supportsCssPathD;
    /**
     * Writes the cutout geometry. The `d` attribute is the source of truth since
     * every engine honours it; the CSS property is mirrored where it exists,
     * because that is what makes the shape animatable and what wins the cascade.
     */
    private writePathD;
    /** The current geometry, as the `path("...")` CSS value the keyframes use. */
    private readPathD;
    private applyStyles;
    private commitAndCancelCurrentTransition;
    private getCurrentRenderedStyles;
    private getRenderedTargetStyles;
    private _getVisualState;
    private _isSameVisualState;
    _appear(position: DOMRect, step: TourElementStep): Promise<void>;
    _disappear(): Promise<void>;
}