@twick/core 0.14.21 → 0.15.0

package/dist/index.d.ts

@@ -0,0 +1,3919 @@
+interface EventHandler<T> {
+    (value: T): any;
+}
+/**
+ * A base for dispatching {@link Subscribable}s.
+ *
+ * @typeParam TValue - The type of the argument passed to subscribers.
+ * @typeParam THandler - The type of the callback function.
+ */
+declare abstract class EventDispatcherBase<TValue, THandler extends EventHandler<TValue> = EventHandler<TValue>> {
+    readonly subscribable: Subscribable<TValue, THandler>;
+    private subscribers;
+    /**
+     * {@inheritDoc Subscribable.subscribe}
+     */
+    subscribe(handler: THandler): () => void;
+    /**
+     * {@inheritDoc Subscribable.unsubscribe}
+     */
+    unsubscribe(handler: THandler): void;
+    /**
+     * Unsubscribe all subscribers from the event.
+     */
+    clear(): void;
+    protected notifySubscribers(value: TValue): ReturnType<THandler>[];
+}
+/**
+ * Provides safe access to the public interface of {@link EventDispatcherBase}.
+ *
+ * @remarks
+ * External classes can use it to subscribe to an event without being able to
+ * dispatch it.
+ *
+ * @typeParam TValue - The type of the argument passed to subscribers.
+ * @typeParam THandler - The type of the callback function.
+ */
+declare class Subscribable<TValue, THandler extends EventHandler<TValue> = EventHandler<TValue>> {
+    protected dispatcher: EventDispatcherBase<TValue, THandler>;
+    constructor(dispatcher: EventDispatcherBase<TValue, THandler>);
+    /**
+     * Subscribe to the event.
+     *
+     * @param handler - The handler to invoke when the event occurs.
+     *
+     * @returns A callback function that cancels the subscription.
+     */
+    subscribe(handler: THandler): () => void;
+    /**
+     * Unsubscribe from the event.
+     *
+     * @param handler - The handler to unsubscribe.
+     */
+    unsubscribe(handler: THandler): void;
+}
+
+interface AsyncEventHandler<T> {
+    (value: T): Promise<void>;
+}
+/**
+ * Dispatches an asynchronous {@link SubscribableEvent}.
+ *
+ * @remarks
+ * The {@link dispatch} method returns a promise that resolves when all the
+ * handlers resolve.
+ *
+ * @example
+ * ```ts
+ * class Example {
+ *   // expose the event to external classes
+ *   public get onValueChanged {
+ *     return this.value.subscribable;
+ *   }
+ *   // create a private dispatcher
+ *   private value = new AsyncEventDispatcher<number>();
+ *
+ *   private async dispatchExample() {
+ *     // dispatching returns a Promise.
+ *     await this.value.dispatch(0);
+ *   }
+ * }
+ * ```
+ *
+ * @typeParam T - The type of the argument passed to subscribers.
+ */
+declare class AsyncEventDispatcher<T> extends EventDispatcherBase<T, AsyncEventHandler<T>> {
+    dispatch(value: T): Promise<void>;
+}
+/**
+ * Provides safe access to the public interface of {@link AsyncEventDispatcher}.
+ *
+ * @remarks
+ * External classes can use it to subscribe to an event without being able to
+ * dispatch it.
+ *
+ * @typeParam T - The type of the argument passed to subscribers.
+ */
+type SubscribableAsyncEvent<T> = Subscribable<T, AsyncEventHandler<T>>;
+
+/**
+ * Dispatches a {@link SubscribableEvent}.
+ *
+ * @example
+ * ```ts
+ * class Example {
+ *   // expose the event to external classes
+ *   public get onValueChanged {
+ *     return this.value.subscribable;
+ *   }
+ *   // create a private dispatcher
+ *   private value = new EventDispatcher<number>();
+ *
+ *   private dispatchExample() {
+ *     // dispatching will notify all subscribers.
+ *     this.value.dispatch(0);
+ *   }
+ * }
+ * ```
+ *
+ * @typeParam T - The type of the value argument to subscribers.
+ */
+declare class EventDispatcher<T> extends EventDispatcherBase<T> {
+    dispatch(value: T): void;
+}
+/**
+ * Provides safe access to the public interface of {@link EventDispatcher}.
+ *
+ * @remarks
+ * External classes can use it to subscribe to an event without being able to
+ * dispatch it.
+ *
+ * @typeParam T - The type of the argument passed to subscribers.
+ */
+type SubscribableEvent<T> = Subscribable<T>;
+
+/**
+ * Dispatches a {@link SubscribableFlagEvent}.
+ *
+ * @remarks
+ * Subscribers are notified only when the flag is set.
+ * Subsequent calls to {@link raise} don't trigger anything.
+ * Any handlers added while the flag is raised are immediately invoked.
+ *
+ * Resetting the flag doesn't notify the subscribers, but raising it again does.
+ *
+ * @example
+ * ```ts
+ * class Example {
+ *   // expose the event to external classes
+ *   public get onChanged {
+ *     return this.flag.subscribable;
+ *   }
+ *   // create a private dispatcher
+ *   private flag = new FlagDispatcher();
+ *
+ *   private dispatchExample() {
+ *     // setting the flag will notify all subscribers
+ *     this.flag.raise();
+ *   }
+ * }
+ * ```
+ */
+declare class FlagDispatcher extends EventDispatcherBase<void> {
+    private value;
+    /**
+     * Notify all current and future subscribers.
+     */
+    raise(): void;
+    /**
+     * Stop notifying future subscribers.
+     */
+    reset(): void;
+    /**
+     * Are subscribers being notified?
+     */
+    isRaised(): boolean;
+    subscribe(handler: EventHandler<void>): () => void;
+}
+/**
+ * Provides safe access to the public interface of {@link FlagDispatcher}.
+ *
+ * @remarks
+ * External classes can use it to subscribe to an event without being able to
+ * dispatch it.
+ */
+type SubscribableFlagEvent = Subscribable<void>;
+
+/**
+ * Dispatches a {@link SubscribableValueEvent}
+ *
+ * @remarks
+ * Changing the value stored by a value dispatcher will immediately notify all
+ * its subscribers.
+ *
+ * @example
+ * ```ts
+ * class Example {
+ *   // expose the event to external classes
+ *   public get onValueChanged {
+ *     return this.value.subscribable;
+ *   }
+ *   // create a private dispatcher
+ *   private value = new ValueDispatcher(0);
+ *
+ *   private changingValueExample() {
+ *     // changing the value will notify all subscribers.
+ *     this.value.current = 7;
+ *   }
+ * }
+ * ```
+ *
+ * @typeParam T - The type of the value passed to subscribers.
+ */
+declare class ValueDispatcher<T> extends EventDispatcherBase<T> {
+    private value;
+    readonly subscribable: SubscribableValueEvent<T>;
+    /**
+     * {@inheritDoc SubscribableValueEvent.current}
+     */
+    get current(): T;
+    /**
+     * Set the current value of this dispatcher.
+     *
+     * @remarks
+     * Setting the value will immediately notify all subscribers.
+     *
+     * @param value - The new value.
+     */
+    set current(value: T);
+    /**
+     * @param value - The initial value.
+     */
+    constructor(value: T);
+    /**
+     * {@inheritDoc SubscribableValueEvent.subscribe}
+     */
+    subscribe(handler: EventHandler<T>, dispatchImmediately?: boolean): () => void;
+}
+/**
+ * Provides safe access to the public interface of {@link ValueDispatcher}.
+ *
+ * @remarks
+ * External classes can use it to subscribe to an event without being able to
+ * dispatch it.
+ *
+ * @typeParam T - The type of the value passed to subscribers.
+ */
+declare class SubscribableValueEvent<T> extends Subscribable<T, EventHandler<T>> {
+    /**
+     * Get the most recent value of this dispatcher.
+     */
+    get current(): T;
+    /**
+     * Subscribe to the event.
+     *
+     * Subscribing will immediately invoke the handler with the most recent value.
+     *
+     * @param handler - The handler to invoke when the event occurs.
+     * @param dispatchImmediately - Whether the handler should be immediately
+     *                              invoked with the most recent value.
+     *
+     * @returns Callback function that cancels the subscription.
+     */
+    subscribe(handler: EventHandler<T>, dispatchImmediately?: boolean): () => void;
+}
+
+declare enum LogLevel {
+    Error = "error",
+    Warn = "warn",
+    Info = "info",
+    Http = "http",
+    Verbose = "verbose",
+    Debug = "debug",
+    Silly = "silly"
+}
+/**
+ * Represents an individual log entry.
+ *
+ * @remarks
+ * When displayed in the editor, the log entry will have the following format:
+ * ```
+ *                              inspect node ┐
+ *   ┌ expand more          duration ┐       │
+ *   ▼                               ▼       ▼
+ * ┌────────────────────────────────────────────┐
+ * │ ▶ message                       300 ms (+) │
+ * ├────────────────────────────────────────────┤
+ * │ remarks                                    │
+ * │ object                                     │
+ * │ stacktrace                                 │
+ * └────────────────────────────────────────────┘
+ * ```
+ */
+interface LogPayload {
+    /**
+     * The log level.
+     */
+    level?: LogLevel;
+    /**
+     * The main message of the log.
+     *
+     * @remarks
+     * Always visible.
+     */
+    message: string;
+    /**
+     * Additional information about the log.
+     *
+     * @remarks
+     * Visible only when the log is expanded.
+     */
+    remarks?: string;
+    /**
+     * An object that will be serialized as JSON and displayed under the message.
+     *
+     * @remarks
+     * Visible only when the log is expanded.
+     */
+    object?: any;
+    /**
+     * The stack trace of the log.
+     *
+     * @remarks
+     * Visible only when the log is expanded.
+     * The current stack trace can be obtained using `new Error().stack`.
+     * Both Chromium and Firefox stack traces are supported.
+     */
+    stack?: string;
+    /**
+     * An optional duration in milliseconds.
+     *
+     * @remarks
+     * Can be used to display any duration related to the log.
+     * The value is always visible next to the message.
+     */
+    durationMs?: number;
+    /**
+     * An optional key used to inspect a related object.
+     *
+     * @remarks
+     * This will be used together with the {@link scenes.Inspectable} interface to
+     * display additional information about the inspected object.
+     * When specified, the log will have an "inspect" button that will open the
+     * "Properties" tab and select the inspected object.
+     */
+    inspect?: string;
+    /**
+     * Any additional information that the log may contain.
+     */
+    [K: string]: any;
+}
+declare class Logger {
+    /**
+     * Triggered when a new message is logged.
+     */
+    get onLogged(): Subscribable<LogPayload, EventHandler<LogPayload>>;
+    private readonly logged;
+    readonly history: LogPayload[];
+    private profilers;
+    log(payload: LogPayload): void;
+    error(payload: string | LogPayload): void;
+    warn(payload: string | LogPayload): void;
+    info(payload: string | LogPayload): void;
+    http(payload: string | LogPayload): void;
+    verbose(payload: string | LogPayload): void;
+    debug(payload: string | LogPayload): void;
+    silly(payload: string | LogPayload): void;
+    protected logLevel(level: LogLevel, payload: string | LogPayload): void;
+    profile(id: string, payload?: LogPayload): void;
+}
+
+declare function map(from: number, to: number, value: number): number;
+declare function remap(fromIn: number, toIn: number, fromOut: number, toOut: number, value: number): number;
+declare function clamp(min: number, max: number, value: number): number;
+declare function clampRemap(fromIn: number, toIn: number, fromOut: number, toOut: number, value: number): number;
+
+interface InterpolationFunction<T, TRest extends any[] = any[]> {
+    (from: T, to: T, value: number, ...args: TRest): T;
+}
+declare function textLerp(from: string, to: string, value: number): string;
+/**
+ * Interpolate between any two Records, including objects and Maps, even with
+ * mismatched keys.
+ *
+ * @remarks
+ * Any old key that is missing in `to` will be removed immediately once value is
+ * not 0. Any new key that is missing in `from` will be added once value reaches
+ * 1.
+ *
+ * @param from - The input to favor when value is 0.
+ * @param to - The input to favor when value is 1.
+ * @param value - On a scale between 0 and 1, how closely to favor from vs to.
+ *
+ * @returns A value matching the structure of from and to.
+ */
+declare function deepLerp<TFrom extends Record<any, unknown>, TTo extends Record<any, unknown>>(from: TFrom, to: TTo, value: number): TFrom | TTo;
+declare function deepLerp<TFrom extends Record<any, unknown>, TTo extends Record<any, unknown>>(from: TFrom, to: TTo, value: number, suppressWarnings: boolean): TFrom | TTo;
+/**
+ * Interpolate between any two values, including objects, arrays, and Maps.
+ *
+ * @param from - The input to favor when value is 0.
+ * @param to - The input to favor when value is 1.
+ * @param value - On a scale between 0 and 1, how closely to favor from vs to.
+ *
+ * @returns A value matching the structure of from and to.
+ */
+declare function deepLerp<T>(from: T, to: T, value: number): T;
+declare function deepLerp<T>(from: T, to: T, value: number, suppressWarnings: boolean): T;
+declare function boolLerp<T>(from: T, to: T, value: number): T;
+declare function arcLerp(value: number, reverse: boolean, ratio: number): {
+    x: number;
+    y: number;
+};
+
+declare function noop(): ThreadGenerator;
+/**
+ * A class representing an individual thread.
+ *
+ * @remarks
+ * Thread is a wrapper for a generator that can be executed concurrently.
+ *
+ * Aside from the main thread, all threads need to have a parent.
+ * If a parent finishes execution, all of its child threads are terminated.
+ */
+declare class Thread {
+    /**
+     * The generator wrapped by this thread.
+     */
+    readonly runner: ThreadGenerator & {
+        task?: Thread;
+    };
+    children: Thread[];
+    /**
+     * The next value to be passed to the wrapped generator.
+     */
+    value: unknown;
+    /**
+     * The current time of this thread.
+     *
+     * @remarks
+     * Used by {@link flow.waitFor} and other time-based functions to properly
+     * support durations shorter than one frame.
+     */
+    readonly time: SimpleSignal<number, void>;
+    /**
+     * The fixed time of this thread.
+     *
+     * @remarks
+     * Fixed time is a multiple of the frame duration. It can be used to account
+     * for the difference between this thread's {@link time} and the time of the
+     * current animation frame.
+     */
+    get fixed(): number;
+    /**
+     * Check if this thread or any of its ancestors has been canceled.
+     */
+    get canceled(): boolean;
+    get paused(): boolean;
+    parent: Thread | null;
+    private isCanceled;
+    private isPaused;
+    private fixedTime;
+    private queue;
+    constructor(
+    /**
+     * The generator wrapped by this thread.
+     */
+    runner: ThreadGenerator & {
+        task?: Thread;
+    });
+    /**
+     * Progress the wrapped generator once.
+     */
+    next(): IteratorYieldResult<void | ThreadGenerator | Promise<any> | Promisable<any>> | IteratorReturnResult<void> | {
+        value: null;
+        done: boolean;
+    };
+    /**
+     * Prepare the thread for the next update cycle.
+     *
+     * @param dt - The delta time of the next cycle.
+     */
+    update(dt: number): void;
+    spawn(child: ThreadGenerator | (() => ThreadGenerator)): ThreadGenerator;
+    add(child: Thread): void;
+    drain(callback: (task: ThreadGenerator) => void): void;
+    cancel(): void;
+    pause(value: boolean): void;
+}
+
+interface Promisable<T> {
+    toPromise(): Promise<T>;
+}
+declare function isPromisable(value: any): value is Promisable<any>;
+/**
+ * The main generator type produced by all generator functions in Motion Canvas.
+ *
+ * @example
+ * Yielded values can be used to control the flow of animation:
+ *
+ * Progress to the next frame:
+ * ```ts
+ * yield;
+ * ```
+ *
+ * Run another generator synchronously:
+ * ```ts
+ * yield* generatorFunction();
+ * ```
+ *
+ * Run another generator concurrently:
+ * ```ts
+ * const task = yield generatorFunction();
+ * ```
+ *
+ * Await a Promise:
+ * ```ts
+ * const result = yield asyncFunction();
+ * ```
+ */
+type ThreadGenerator = Generator<ThreadGenerator | Promise<any> | Promisable<any> | void, void, Thread | any>;
+/**
+ * Check if the given value is a {@link ThreadGenerator}.
+ *
+ * @param value - A possible thread {@link ThreadGenerator}.
+ */
+declare function isThreadGenerator(value: unknown): value is ThreadGenerator;
+
+/**
+ * Cancel all listed tasks.
+ *
+ * Example:
+ * ```ts
+ * const task = yield generatorFunction();
+ *
+ * // do something concurrently
+ *
+ * yield* cancel(task);
+ * ```
+ *
+ * @param tasks - A list of tasks to cancel.
+ */
+declare function cancel(...tasks: ThreadGenerator[]): void;
+
+/**
+ * Run the given task concurrently.
+ *
+ * @example
+ * Using an existing task:
+ * ```ts
+ * spawn(rect().opacity(1, 1));
+ * ```
+ * Using a generator function:
+ * ```ts
+ * spawn(function* () {
+ *   yield* rect().opacity(1, 1);
+ *   yield* waitFor('click');
+ *   yield* rect().opacity(0, 1);
+ * });
+ * ```
+ * Await the spawned task:
+ * ```ts
+ * const task = spawn(rect().opacity(1, 1));
+ * // do some other things
+ * yield* join(task); // await the task
+ * ```
+ *
+ * @param task - Either a generator function or a task to run.
+ */
+declare function spawn(task: ThreadGenerator | (() => ThreadGenerator)): ThreadGenerator;
+
+/**
+ * Check if the given value is a [Promise][promise].
+ *
+ * @param value - A possible [Promise][promise].
+ *
+ * [promise]: https://developer.mozilla.org/en-US/docs/web/javascript/reference/global_objects/promise
+ */
+declare function isPromise(value: any): value is Promise<any>;
+/**
+ * A generator function or a normal function that returns a generator.
+ */
+interface ThreadsFactory {
+    (): ThreadGenerator;
+}
+interface ThreadsCallback {
+    (root: Thread): void;
+}
+/**
+ * Create a context in which generators can be run concurrently.
+ *
+ * @remarks
+ * From the perspective of the external generator, `threads` is executed
+ * synchronously. By default, each scene generator is wrapped in its own
+ * `threads` generator.
+ *
+ * @example
+ * ```ts
+ * // first
+ *
+ * yield* threads(function* () {
+ *   const task = yield generatorFunction();
+ *   // second
+ * }); // <- `task` will be terminated here because the scope
+ *     //    of this `threads` generator has ended
+ *
+ * // third
+ * ```
+ *
+ * @param factory - A function that returns the generator to run.
+ * @param callback - Called whenever threads are created, canceled or finished.
+ *                   Used for debugging purposes.
+ */
+declare function threads(factory: ThreadsFactory, callback?: ThreadsCallback): ThreadGenerator;
+
+type ProgressFunction = (value: number, time: number) => void;
+declare function spring(spring: Spring | null, from: number, to: number, settleTolerance: number, onProgress: ProgressFunction, onEnd?: ProgressFunction): ThreadGenerator;
+declare function spring(spring: Spring | null, from: number, to: number, onProgress: ProgressFunction, onEnd?: ProgressFunction): ThreadGenerator;
+interface Spring {
+    mass: number;
+    stiffness: number;
+    damping: number;
+    initialVelocity?: number;
+}
+declare function makeSpring(mass: number, stiffness: number, damping: number, initialVelocity?: number): Spring;
+declare const BeatSpring: Spring;
+declare const PlopSpring: Spring;
+declare const BounceSpring: Spring;
+declare const SwingSpring: Spring;
+declare const JumpSpring: Spring;
+declare const StrikeSpring: Spring;
+declare const SmoothSpring: Spring;
+
+interface TimingFunction {
+    (value: number, from?: number, to?: number): number;
+}
+declare function sin(value: number, from?: number, to?: number): number;
+declare function easeInSine(value: number, from?: number, to?: number): number;
+declare function easeOutSine(value: number, from?: number, to?: number): number;
+declare function easeInOutSine(value: number, from?: number, to?: number): number;
+declare function easeInQuad(value: number, from?: number, to?: number): number;
+declare function easeOutQuad(value: number, from?: number, to?: number): number;
+declare function easeInOutQuad(value: number, from?: number, to?: number): number;
+declare function easeInCubic(value: number, from?: number, to?: number): number;
+declare function easeOutCubic(value: number, from?: number, to?: number): number;
+declare function easeInOutCubic(value: number, from?: number, to?: number): number;
+declare function easeInQuart(value: number, from?: number, to?: number): number;
+declare function easeOutQuart(value: number, from?: number, to?: number): number;
+declare function easeInOutQuart(value: number, from?: number, to?: number): number;
+declare function easeInQuint(value: number, from?: number, to?: number): number;
+declare function easeOutQuint(value: number, from?: number, to?: number): number;
+declare function easeInOutQuint(value: number, from?: number, to?: number): number;
+declare function easeInExpo(value: number, from?: number, to?: number): number;
+declare function easeOutExpo(value: number, from?: number, to?: number): number;
+declare function easeInOutExpo(value: number, from?: number, to?: number): number;
+declare function easeInCirc(value: number, from?: number, to?: number): number;
+declare function easeOutCirc(value: number, from?: number, to?: number): number;
+declare function easeInOutCirc(value: number, from?: number, to?: number): number;
+declare function createEaseInBack(s?: number): TimingFunction;
+declare function createEaseOutBack(s?: number): TimingFunction;
+declare function createEaseInOutBack(s?: number, v?: number): TimingFunction;
+declare function createEaseInElastic(s?: number): TimingFunction;
+declare function createEaseOutElastic(s?: number): TimingFunction;
+declare function createEaseInOutElastic(s?: number): TimingFunction;
+declare function createEaseInBounce(n?: number, d?: number): TimingFunction;
+declare function createEaseOutBounce(n?: number, d?: number): TimingFunction;
+declare function createEaseInOutBounce(n?: number, d?: number): TimingFunction;
+declare function linear(value: number, from?: number, to?: number): number;
+declare function cos(value: number, from?: number, to?: number): number;
+declare const easeInBack: TimingFunction;
+declare const easeOutBack: TimingFunction;
+declare const easeInOutBack: TimingFunction;
+declare const easeInBounce: TimingFunction;
+declare const easeOutBounce: TimingFunction;
+declare const easeInOutBounce: TimingFunction;
+declare const easeInElastic: TimingFunction;
+declare const easeOutElastic: TimingFunction;
+declare const easeInOutElastic: TimingFunction;
+
+declare function tween(seconds: number, onProgress: (value: number, time: number) => void, onEnd?: (value: number, time: number) => void): ThreadGenerator;
+
+interface PromiseHandle<T> {
+    promise: Promise<T>;
+    value: T;
+    stack?: string;
+    owner?: any;
+}
+declare class DependencyContext<TOwner = void> implements Promisable<DependencyContext<TOwner>> {
+    protected owner: TOwner;
+    protected static collectionSet: Set<DependencyContext<any>>;
+    protected static collectionStack: DependencyContext<any>[];
+    protected static promises: PromiseHandle<any>[];
+    static collectPromise<T>(promise: Promise<T>): PromiseHandle<T | null>;
+    static collectPromise<T>(promise: Promise<T>, initialValue: T): PromiseHandle<T>;
+    static hasPromises(): boolean;
+    static consumePromises(): Promise<PromiseHandle<any>[]>;
+    protected readonly invokable: any;
+    protected dependencies: Set<Subscribable<void, EventHandler<void>>>;
+    protected event: FlagDispatcher;
+    protected markDirty: () => void;
+    constructor(owner: TOwner);
+    protected invoke(): void;
+    protected startCollecting(): void;
+    protected finishCollecting(): void;
+    protected clearDependencies(): void;
+    protected collect(): void;
+    dispose(): void;
+    toPromise(): Promise<this>;
+}
+
+declare const DEFAULT: unique symbol;
+
+type SignalValue<TValue> = TValue | (() => TValue);
+type SignalGenerator<TSetterValue, TValue extends TSetterValue> = ThreadGenerator & {
+    /**
+     * Tween to the specified value.
+     */
+    to: SignalTween<TSetterValue, TValue>;
+    /**
+     * Tween back to the original value.
+     *
+     * @param time - The duration of the tween.
+     * @param timingFunction - The timing function of the tween.
+     * @param interpolationFunction - The interpolation function of the tween.
+     */
+    back: (time: number, timingFunction?: TimingFunction, interpolationFunction?: InterpolationFunction<TValue>) => SignalGenerator<TSetterValue, TValue>;
+    /**
+     * Wait for the specified duration.
+     *
+     * @param duration - The duration to wait.
+     */
+    wait: (duration: number) => SignalGenerator<TSetterValue, TValue>;
+    /**
+     * Run the given task.
+     *
+     * @param task - The generator to run.
+     */
+    run: (task: ThreadGenerator) => SignalGenerator<TSetterValue, TValue>;
+    /**
+     * Invoke the given callback.
+     *
+     * @param callback - The callback to invoke.
+     */
+    do: (callback: () => void) => SignalGenerator<TSetterValue, TValue>;
+};
+interface SignalSetter<TValue, TOwner = void> {
+    (value: SignalValue<TValue> | typeof DEFAULT): TOwner;
+}
+interface SignalGetter<TValue> {
+    (): TValue;
+}
+interface SignalTween<TSetterValue, TValue extends TSetterValue> {
+    (value: SignalValue<TSetterValue> | typeof DEFAULT, time: number, timingFunction?: TimingFunction, interpolationFunction?: InterpolationFunction<TValue>): SignalGenerator<TSetterValue, TValue>;
+}
+interface SignalExtensions<TSetterValue, TValue extends TSetterValue> {
+    getter: SignalGetter<TValue>;
+    setter: SignalSetter<TSetterValue>;
+    tweener(value: SignalValue<TSetterValue>, time: number, timingFunction?: TimingFunction, interpolationFunction?: InterpolationFunction<TValue>): ThreadGenerator;
+}
+
+type SimpleSignal<TValue, TReturn = void> = Signal<TValue, TValue, TReturn>;
+interface Signal<TSetterValue, TValue extends TSetterValue, TOwner = void, TContext = SignalContext<TSetterValue, TValue, TOwner>> extends SignalSetter<TSetterValue, TOwner>, SignalGetter<TValue>, SignalTween<TSetterValue, TValue> {
+    /**
+     * {@inheritDoc SignalContext.reset}
+     */
+    reset(): TOwner;
+    /**
+     * {@inheritDoc SignalContext.save}
+     */
+    save(): TOwner;
+    /**
+     * {@inheritDoc SignalContext.isInitial}
+     */
+    isInitial(): boolean;
+    context: TContext;
+}
+declare class SignalContext<TSetterValue, TValue extends TSetterValue = TSetterValue, TOwner = void> extends DependencyContext<TOwner> {
+    private initial;
+    private readonly interpolation;
+    protected parser: (value: TSetterValue) => TValue;
+    protected extensions: SignalExtensions<TSetterValue, TValue>;
+    protected current: SignalValue<TSetterValue> | undefined;
+    protected last: TValue | undefined;
+    protected tweening: boolean;
+    constructor(initial: SignalValue<TSetterValue> | undefined, interpolation: InterpolationFunction<TValue>, owner?: TOwner, parser?: (value: TSetterValue) => TValue, extensions?: Partial<SignalExtensions<TSetterValue, TValue>>);
+    toSignal(): Signal<TSetterValue, TValue, TOwner>;
+    parse(value: TSetterValue): TValue;
+    set(value: SignalValue<TSetterValue> | typeof DEFAULT): TOwner;
+    setter(value: SignalValue<TSetterValue> | typeof DEFAULT): TOwner;
+    get(): TValue;
+    getter(): TValue;
+    protected invoke(value?: SignalValue<TSetterValue> | typeof DEFAULT, duration?: number, timingFunction?: TimingFunction, interpolationFunction?: InterpolationFunction<TValue>): TValue | TOwner | SignalGenerator<TSetterValue, TValue>;
+    protected createQueue(defaultTimingFunction: TimingFunction, defaultInterpolationFunction: InterpolationFunction<TValue>): SignalGenerator<TSetterValue, TValue>;
+    protected tween(value: SignalValue<TSetterValue> | typeof DEFAULT, duration: number, timingFunction: TimingFunction, interpolationFunction: InterpolationFunction<TValue>): ThreadGenerator;
+    tweener(value: SignalValue<TSetterValue>, duration: number, timingFunction: TimingFunction, interpolationFunction: InterpolationFunction<TValue>): ThreadGenerator;
+    dispose(): void;
+    /**
+     * Reset the signal to its initial value (if one has been set).
+     *
+     * @example
+     * ```ts
+     * const signal = createSignal(7);
+     *
+     * signal.reset();
+     * // same as:
+     * signal(7);
+     * ```
+     */
+    reset(): TOwner;
+    /**
+     * Compute the current value of the signal and immediately set it.
+     *
+     * @remarks
+     * This method can be used to stop the signal from updating while keeping its
+     * current value.
+     *
+     * @example
+     * ```ts
+     * signal.save();
+     * // same as:
+     * signal(signal());
+     * ```
+     */
+    save(): TOwner;
+    /**
+     * Check if the signal is currently using its initial value.
+     *
+     * @example
+     * ```ts
+     *
+     * const signal = createSignal(0);
+     * signal.isInitial(); // true
+     *
+     * signal(5);
+     * signal.isInitial(); // false
+     *
+     * signal(DEFAULT);
+     * signal.isInitial(); // true
+     * ```
+     */
+    isInitial(): boolean;
+    /**
+     * Get the initial value of this signal.
+     */
+    getInitial(): SignalValue<TSetterValue> | undefined;
+    /**
+     * Get the raw value of this signal.
+     *
+     * @remarks
+     * If the signal was provided with a factory function, the function itself
+     * will be returned, without invoking it.
+     *
+     * This method can be used to create copies of signals.
+     *
+     * @example
+     * ```ts
+     * const a = createSignal(2);
+     * const b = createSignal(() => a);
+     * // b() == 2
+     *
+     * const bClone = createSignal(b.raw());
+     * // bClone() == 2
+     *
+     * a(4);
+     * // b() == 4
+     * // bClone() == 4
+     * ```
+     */
+    raw(): SignalValue<TSetterValue> | undefined;
+    /**
+     * Is the signal undergoing a tween?
+     */
+    isTweening(): boolean;
+}
+
+type CompoundSignal<TSetterValue, TValue extends TSetterValue, TKeys extends keyof TValue = keyof TValue, TOwner = void, TContext = CompoundSignalContext<TSetterValue, TValue, TKeys, TOwner>> = Signal<TSetterValue, TValue, TOwner, TContext> & {
+    [K in TKeys]: Signal<TValue[K], TValue[K], TOwner extends void ? CompoundSignal<TSetterValue, TValue, TKeys, TOwner, TContext> : TOwner>;
+};
+declare class CompoundSignalContext<TSetterValue, TValue extends TSetterValue, TKeys extends keyof TValue = keyof TValue, TOwner = void> extends SignalContext<TSetterValue, TValue, TOwner> {
+    private readonly entries;
+    readonly signals: [keyof TValue, Signal<any, any, TOwner>][];
+    constructor(entries: (TKeys | [keyof TValue, Signal<any, any, TOwner>])[], parser: (value: TSetterValue) => TValue, initial: SignalValue<TSetterValue>, interpolation: InterpolationFunction<TValue>, owner?: TOwner, extensions?: Partial<SignalExtensions<TSetterValue, TValue>>);
+    toSignal(): CompoundSignal<TSetterValue, TValue, TKeys, TOwner>;
+    parse(value: TSetterValue): TValue;
+    getter(): TValue;
+    setter(value: SignalValue<TValue>): TOwner;
+    reset(): TOwner;
+    save(): TOwner;
+    isInitial(): boolean;
+    raw(): TSetterValue;
+}
+
+interface Computed<TValue> {
+    (...args: any[]): TValue;
+    context: ComputedContext<TValue>;
+}
+declare class ComputedContext<TValue> extends DependencyContext<any> {
+    private readonly factory;
+    private last;
+    constructor(factory: (...args: any[]) => TValue, owner?: any);
+    toSignal(): Computed<TValue>;
+    dispose(): void;
+    protected invoke(...args: any[]): TValue;
+}
+
+declare function createComputed<TValue>(factory: (...args: any[]) => TValue, owner?: any): Computed<TValue>;
+
+declare function createComputedAsync<T>(factory: () => Promise<T>): Computed<T | null>;
+declare function createComputedAsync<T>(factory: () => Promise<T>, initial: T): Computed<T>;
+
+declare function createSignal<TValue, TOwner = void>(initial?: SignalValue<TValue>, interpolation?: InterpolationFunction<TValue>, owner?: TOwner): SimpleSignal<TValue, TOwner>;
+
+declare function isReactive<T>(value: SignalValue<T>): value is () => T;
+declare function modify<TFrom, TTo>(value: SignalValue<TFrom>, modification: (value: TFrom) => TTo): SignalValue<TTo>;
+declare function unwrap<T>(value: SignalValue<T>): T;
+
+declare enum Direction {
+    Top = 4,
+    Bottom = 8,
+    Left = 16,
+    Right = 32
+}
+declare enum Center {
+    Vertical = 1,
+    Horizontal = 2
+}
+declare enum Origin {
+    Middle = 3,
+    Top = 5,
+    Bottom = 9,
+    Left = 18,
+    Right = 34,
+    TopLeft = 20,
+    TopRight = 36,
+    BottomLeft = 24,
+    BottomRight = 40
+}
+
+declare const EPSILON = 0.000001;
+interface Type {
+    toSymbol(): symbol;
+}
+interface WebGLConvertible {
+    toUniform(gl: WebGL2RenderingContext, location: WebGLUniformLocation): void;
+}
+declare function isType(value: any): value is Type;
+
+type SerializedVector2<T = number> = {
+    x: T;
+    y: T;
+};
+type PossibleVector2<T = number> = SerializedVector2<T> | {
+    width: T;
+    height: T;
+} | T | [T, T] | undefined;
+type Vector2Signal<T> = CompoundSignal<PossibleVector2, Vector2, 'x' | 'y', T>;
+type SimpleVector2Signal<T> = Signal<PossibleVector2, Vector2, T>;
+/**
+ * Represents a two-dimensional vector.
+ */
+declare class Vector2 implements Type, WebGLConvertible {
+    static readonly symbol: unique symbol;
+    static readonly zero: Vector2;
+    static readonly one: Vector2;
+    static readonly right: Vector2;
+    static readonly left: Vector2;
+    static readonly up: Vector2;
+    static readonly down: Vector2;
+    /**
+     * A constant equal to `Vector2(0, -1)`
+     */
+    static readonly top: Vector2;
+    /**
+     * A constant equal to `Vector2(0, 1)`
+     */
+    static readonly bottom: Vector2;
+    /**
+     * A constant equal to `Vector2(-1, -1)`
+     */
+    static readonly topLeft: Vector2;
+    /**
+     * A constant equal to `Vector2(1, -1)`
+     */
+    static readonly topRight: Vector2;
+    /**
+     * A constant equal to `Vector2(-1, 1)`
+     */
+    static readonly bottomLeft: Vector2;
+    /**
+     * A constant equal to `Vector2(1, 1)`
+     */
+    static readonly bottomRight: Vector2;
+    x: number;
+    y: number;
+    static createSignal(initial?: SignalValue<PossibleVector2>, interpolation?: InterpolationFunction<Vector2>, owner?: any): Vector2Signal<void>;
+    static lerp(from: Vector2, to: Vector2, value: number | Vector2): Vector2;
+    static arcLerp(from: Vector2, to: Vector2, value: number, reverse?: boolean, ratio?: number): Vector2;
+    static createArcLerp(reverse?: boolean, ratio?: number): (from: Vector2, to: Vector2, value: number) => Vector2;
+    /**
+     * Interpolates between two vectors on the polar plane by interpolating
+     * the angles and magnitudes of the vectors individually.
+     *
+     * @param from - The starting vector.
+     * @param to - The target vector.
+     * @param value - The t-value of the interpolation.
+     * @param counterclockwise - Whether the vector should get rotated
+     *                           counterclockwise. Defaults to `false`.
+     * @param origin - The center of rotation. Defaults to the origin.
+     *
+     * @remarks
+     * This function is useful when used in conjunction with {@link rotate} to
+     * animate an object's position on a circular arc (see examples).
+     *
+     * @example
+     * Animating an object in a circle around the origin
+     * ```tsx
+     * circle().position(
+     *   circle().position().rotate(180),
+     *   1,
+     *   easeInOutCubic,
+     *   Vector2.polarLerp
+     * );
+     * ```
+     * @example
+     * Rotating an object around the point `[-200, 100]`
+     * ```ts
+     * circle().position(
+     *   circle().position().rotate(180, [-200, 100]),
+     *   1,
+     *   easeInOutCubic,
+     *   Vector2.createPolarLerp(false, [-200, 100]),
+     * );
+     * ```
+     * @example
+     * Rotating an object counterclockwise around the origin
+     * ```ts
+     * circle().position(
+     *   circle().position().rotate(180),
+     *   1,
+     *   easeInOutCubic,
+     *   Vector2.createPolarLerp(true),
+     * );
+     * ```
+     */
+    static polarLerp(from: Vector2, to: Vector2, value: number, counterclockwise?: boolean, origin?: Vector2): Vector2;
+    /**
+     * Helper function to create a {@link Vector2.polarLerp} interpolation
+     * function with additional parameters.
+     *
+     * @param counterclockwise - Whether the point should get rotated
+     *                           counterclockwise.
+     * @param center - The center of rotation. Defaults to the origin.
+     */
+    static createPolarLerp(counterclockwise?: boolean, center?: PossibleVector2): (from: Vector2, to: Vector2, value: number) => Vector2;
+    static fromOrigin(origin: Origin | Direction): Vector2;
+    static fromScalar(value: number): Vector2;
+    static fromRadians(radians: number): Vector2;
+    static fromDegrees(degrees: number): Vector2;
+    /**
+     * Return the angle in radians between the vector described by x and y and the
+     * positive x-axis.
+     *
+     * @param x - The x component of the vector.
+     * @param y - The y component of the vector.
+     */
+    static radians(x: number, y: number): number;
+    /**
+     * Return the angle in degrees between the vector described by x and y and the
+     * positive x-axis.
+     *
+     * @param x - The x component of the vector.
+     * @param y - The y component of the vector.
+     *
+     * @remarks
+     * The returned angle will be between -180 and 180 degrees.
+     */
+    static degrees(x: number, y: number): number;
+    static magnitude(x: number, y: number): number;
+    static squaredMagnitude(x: number, y: number): number;
+    static angleBetween(u: Vector2, v: Vector2): number;
+    get width(): number;
+    set width(value: number);
+    get height(): number;
+    set height(value: number);
+    get magnitude(): number;
+    get squaredMagnitude(): number;
+    get normalized(): Vector2;
+    get safe(): Vector2;
+    get flipped(): Vector2;
+    get floored(): Vector2;
+    get perpendicular(): Vector2;
+    /**
+     * Return the angle in radians between the vector and the positive x-axis.
+     */
+    get radians(): number;
+    /**
+     * Return the angle in degrees between the vector and the positive x-axis.
+     *
+     * @remarks
+     * The returned angle will be between -180 and 180 degrees.
+     */
+    get degrees(): number;
+    get ctg(): number;
+    constructor();
+    constructor(from: PossibleVector2);
+    constructor(x: number, y: number);
+    lerp(to: Vector2, value: Vector2 | number): Vector2;
+    getOriginOffset(origin: Origin | Direction): Vector2;
+    scale(value: number): Vector2;
+    mul(possibleVector: PossibleVector2): Vector2;
+    div(possibleVector: PossibleVector2): Vector2;
+    add(possibleVector: PossibleVector2): Vector2;
+    sub(possibleVector: PossibleVector2): Vector2;
+    dot(possibleVector: PossibleVector2): number;
+    cross(possibleVector: PossibleVector2): number;
+    mod(possibleVector: PossibleVector2): Vector2;
+    addX(value: number): Vector2;
+    addY(value: number): Vector2;
+    toSymbol(): symbol;
+    toString(): string;
+    toUniform(gl: WebGL2RenderingContext, location: WebGLUniformLocation): void;
+    serialize(): SerializedVector2;
+    /**
+     * Check if two vectors are exactly equal to each other.
+     *
+     * @remarks
+     * If you need to compensate for floating point inaccuracies, use the
+     * {@link equals} method, instead.
+     *
+     * @param other - The vector to compare.
+     */
+    exactlyEquals(other: Vector2): boolean;
+    /**
+     * Check if two vectors are equal to each other.
+     *
+     * @remarks
+     * This method allows passing an allowed error margin when comparing vectors
+     * to compensate for floating point inaccuracies. To check if two vectors are
+     * exactly equal, use the {@link exactlyEquals} method, instead.
+     *
+     * @param other - The vector to compare.
+     * @param threshold - The allowed error threshold when comparing the vectors.
+     */
+    equals(other: Vector2, threshold?: number): boolean;
+}
+
+type PossibleMatrix2D = Matrix2D | DOMMatrix | [number, number, number, number, number, number] | [PossibleVector2, PossibleVector2, PossibleVector2] | undefined;
+/**
+ * A specialized 2x3 Matrix representing a 2D transformation.
+ *
+ * A Matrix2D contains six elements defined as
+ * [a, b,
+ *  c, d,
+ *  tx, ty]
+ *
+ * This is a shortcut for a 3x3 matrix of the form
+ * [a, b, 0,
+ *  c, d, 0
+ *  tx, ty, 1]
+ *
+ * Note that because a Matrix2D ignores the z-values of each component vectors,
+ * it does not satisfy all properties of a "real" 3x3 matrix.
+ *
+ *   - A Matrix2D has no transpose
+ *   - A(B + C) = AB + AC does not hold for a Matrix2D
+ *   - (rA)^-1 = r^-1 A^-1, r != 0 does not hold for a Matrix2D
+ *   - r(AB) = (rA)B = A(rB) does not hold for a Matrix2D
+ */
+declare class Matrix2D implements Type, WebGLConvertible {
+    static readonly symbol: unique symbol;
+    readonly values: Float32Array;
+    static readonly identity: Matrix2D;
+    static readonly zero: Matrix2D;
+    static fromRotation(angle: number): Matrix2D;
+    static fromTranslation(translation: PossibleVector2): Matrix2D;
+    static fromScaling(scale: PossibleVector2): Matrix2D;
+    get x(): Vector2;
+    get y(): Vector2;
+    get scaleX(): number;
+    set scaleX(value: number);
+    get skewX(): number;
+    set skewX(value: number);
+    get scaleY(): number;
+    set scaleY(value: number);
+    get skewY(): number;
+    set skewY(value: number);
+    get translateX(): number;
+    set translateX(value: number);
+    get translateY(): number;
+    set translateY(value: number);
+    get rotation(): number;
+    set rotation(angle: number);
+    get translation(): Vector2;
+    set translation(translation: PossibleVector2);
+    get scaling(): Vector2;
+    set scaling(value: PossibleVector2);
+    /**
+     * Get the inverse of the matrix.
+     *
+     * @remarks
+     * If the matrix is not invertible, i.e. its determinant is `0`, this will
+     * return `null`, instead.
+     *
+     * @example
+     * ```ts
+     * const matrix = new Matrix2D(
+     *   [1, 2],
+     *   [3, 4],
+     *   [5, 6],
+     * );
+     *
+     * const inverse = matrix.inverse;
+     * // => Matrix2D(
+     * //      [-2, 1],
+     * //      [1.5, -0.5],
+     * //      [1, -2],
+     * //   )
+     * ```
+     */
+    get inverse(): Matrix2D | null;
+    /**
+     * Get the determinant of the matrix.
+     */
+    get determinant(): number;
+    get domMatrix(): DOMMatrix;
+    constructor();
+    constructor(matrix: PossibleMatrix2D);
+    constructor(x: PossibleVector2, y: PossibleVector2, z: PossibleVector2);
+    constructor(a: number, b: number, c: number, d: number, tx: number, ty: number);
+    /**
+     * Get the nth component vector of the matrix. Only defined for 0, 1, and 2.
+     *
+     * @example
+     * ```ts
+     * const matrix = new Matrix2D(
+     *   [1, 0],
+     *   [0, 0],
+     *   [1, 0],
+     * );
+     *
+     * const x = matrix.column(0);
+     * // Vector2(1, 0)
+     *
+     * const y = matrix.column(1);
+     * // Vector2(0, 0)
+     *
+     * const z = matrix.column(1);
+     * // Vector2(1, 0)
+     * ```
+     *
+     * @param index - The index of the component vector to retrieve.
+     */
+    column(index: number): Vector2;
+    /**
+     * Returns the nth row of the matrix. Only defined for 0 and 1.
+     *
+     * @example
+     * ```ts
+     * const matrix = new Matrix2D(
+     *   [1, 0],
+     *   [0, 0],
+     *   [1, 0],
+     * );
+     *
+     * const firstRow = matrix.column(0);
+     * // [1, 0, 1]
+     *
+     * const secondRow = matrix.column(1);
+     * // [0, 0, 0]
+     * ```
+     *
+     * @param index - The index of the row to retrieve.
+     */
+    row(index: number): [number, number, number];
+    /**
+     * Returns the matrix product of this matrix with the provided matrix.
+     *
+     * @remarks
+     * This method returns a new matrix representing the result of the
+     * computation. It will not modify the source matrix.
+     *
+     * @example
+     * ```ts
+     * const a = new Matrix2D(
+     *   [1, 2],
+     *   [0, 1],
+     *   [1, 1],
+     * );
+     * const b = new Matrix2D(
+     *   [2, 1],
+     *   [1, 1],
+     *   [1, 1],
+     * );
+     *
+     * const result = a.mul(b);
+     * // => Matrix2D(
+     * //     [2, 5],
+     * //     [1, 3],
+     * //     [2, 4],
+     * //   )
+     * ```
+     *
+     * @param other - The matrix to multiply with
+     */
+    mul(other: Matrix2D): Matrix2D;
+    /**
+     * Rotate the matrix by the provided angle. By default, the angle is
+     * provided in degrees.
+     *
+     * @remarks
+     * This method returns a new matrix representing the result of the
+     * computation. It will not modify the source matrix.
+     *
+     * @example
+     * ```ts
+     * const a = new Matrix2D(
+     *   [1, 2],
+     *   [3, 4],
+     *   [5, 6],
+     * );
+     *
+     * const result = a.rotate(90);
+     * // => Matrix2D(
+     * //     [3, 4],
+     * //     [-1, -2],
+     * //     [5, 6],
+     * //   )
+     *
+     * // Provide the angle in radians
+     * const result = a.rotate(Math.PI * 0.5, true);
+     * // => Matrix2D(
+     * //     [3, 4],
+     * //     [-1, -2],
+     * //     [5, 6],
+     * //   )
+     * ```
+     *
+     * @param angle - The angle by which to rotate the matrix.
+     * @param degrees - Whether the angle is provided in degrees.
+     */
+    rotate(angle: number, degrees?: boolean): Matrix2D;
+    /**
+     * Scale the x and y component vectors of the matrix.
+     *
+     * @remarks
+     * If `vec` is provided as a vector, the x and y component vectors of the
+     * matrix will be scaled by the x and y parts of the vector, respectively.
+     *
+     * If `vec` is provided as a scalar, the x and y component vectors will be
+     * scaled uniformly by this factor.
+     *
+     * This method returns a new matrix representing the result of the
+     * computation. It will not modify the source matrix.
+     *
+     * @example
+     * ```ts
+     * const matrix = new Matrix2D(
+     *   [1, 2],
+     *   [3, 4],
+     *   [5, 6],
+     * );
+     *
+     * const result1 = matrix.scale([2, 3]);
+     * // => new Matrix2D(
+     * //      [2, 4],
+     * //      [9, 12],
+     * //      [5, 6],
+     * //    )
+     *
+     * const result2 = matrix.scale(2);
+     * // => new Matrix2D(
+     * //      [2, 4],
+     * //      [6, 8],
+     * //      [5, 6],
+     * //    )
+     * ```
+     *
+     * @param vec - The factor by which to scale the matrix
+     */
+    scale(vec: PossibleVector2): Matrix2D;
+    /**
+     * Multiply each value of the matrix by a scalar.
+     *
+     * * @example
+     * ```ts
+     * const matrix = new Matrix2D(
+     *   [1, 2],
+     *   [3, 4],
+     *   [5, 6],
+     * );
+     *
+     * const result1 = matrix.mulScalar(2);
+     * // => new Matrix2D(
+     * //      [2, 4],
+     * //      [6, 8],
+     * //      [10, 12],
+     * //    )
+     * ```
+     *
+     * @param s - The value by which to scale each term
+     */
+    mulScalar(s: number): Matrix2D;
+    /**
+     * Translate the matrix by the dimensions of the provided vector.
+     *
+     * @remarks
+     * If `vec` is provided as a scalar, matrix will be translated uniformly
+     * by this factor.
+     *
+     * This method returns a new matrix representing the result of the
+     * computation. It will not modify the source matrix.
+     *
+     * @example
+     * ```ts
+     * const matrix = new Matrix2D(
+     *   [1, 2],
+     *   [3, 4],
+     *   [5, 6],
+     * );
+     *
+     * const result1 = matrix.translate([2, 3]);
+     * // => new Matrix2D(
+     * //      [1, 2],
+     * //      [3, 4],
+     * //      [16, 22],
+     * //    )
+     *
+     * const result2 = matrix.translate(2);
+     * // => new Matrix2D(
+     * //      [1, 2],
+     * //      [3, 4],
+     * //      [13, 18],
+     * //    )
+     * ```
+     *
+     * @param vec - The vector by which to translate the matrix
+     */
+    translate(vec: PossibleVector2): Matrix2D;
+    /**
+     * Add the provided matrix to this matrix.
+     *
+     * @remarks
+     * This method returns a new matrix representing the result of the
+     * computation. It will not modify the source matrix.
+     *
+     * @example
+     * ```ts
+     * const a = new Matrix2D(
+     *   [1, 2],
+     *   [3, 4],
+     *   [5, 6],
+     * );
+     * const a = new Matrix2D(
+     *   [7, 8],
+     *   [9, 10],
+     *   [11, 12],
+     * );
+     *
+     * const result = a.add(b);
+     * // => Matrix2D(
+     * //      [8, 10],
+     * //      [12, 14],
+     * //      [16, 18],
+     * //    )
+     * ```
+     *
+     * @param other - The matrix to add
+     */
+    add(other: Matrix2D): Matrix2D;
+    /**
+     * Subtract the provided matrix from this matrix.
+     *
+     * @remarks
+     * This method returns a new matrix representing the result of the
+     * computation. It will not modify the source matrix.
+     *
+     * @example
+     * ```ts
+     * const a = new Matrix2D(
+     *   [1, 2],
+     *   [3, 4],
+     *   [5, 6],
+     * );
+     * const a = new Matrix2D(
+     *   [7, 8],
+     *   [9, 10],
+     *   [11, 12],
+     * );
+     *
+     * const result = a.sub(b);
+     * // => Matrix2D(
+     * //      [-6, -6],
+     * //      [-6, -6],
+     * //      [-6, -6],
+     * //    )
+     * ```
+     *
+     * @param other - The matrix to subract
+     */
+    sub(other: Matrix2D): Matrix2D;
+    toSymbol(): symbol;
+    toUniform(gl: WebGL2RenderingContext, location: WebGLUniformLocation): void;
+    equals(other: Matrix2D, threshold?: number): boolean;
+    exactlyEquals(other: Matrix2D): boolean;
+}
+
+type SerializedSpacing = {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+};
+type PossibleSpacing = SerializedSpacing | number | [number, number] | [number, number, number] | [number, number, number, number] | undefined;
+type SpacingSignal<T> = CompoundSignal<PossibleSpacing, Spacing, 'top' | 'right' | 'bottom' | 'left', T>;
+declare class Spacing implements Type, WebGLConvertible {
+    static readonly symbol: unique symbol;
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+    static createSignal(initial?: SignalValue<PossibleSpacing>, interpolation?: InterpolationFunction<Spacing>): SpacingSignal<void>;
+    static lerp(from: Spacing, to: Spacing, value: number): Spacing;
+    get x(): number;
+    get y(): number;
+    constructor();
+    constructor(from: PossibleSpacing);
+    constructor(all: number);
+    constructor(vertical: number, horizontal: number);
+    constructor(top: number, horizontal: number, bottom: number);
+    constructor(top: number, right: number, bottom: number, left: number);
+    lerp(to: Spacing, value: number): Spacing;
+    scale(value: number): Spacing;
+    addScalar(value: number): Spacing;
+    toSymbol(): symbol;
+    toString(): string;
+    toUniform(gl: WebGL2RenderingContext, location: WebGLUniformLocation): void;
+    serialize(): SerializedSpacing;
+}
+
+type SerializedBBox = {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+};
+type PossibleBBox = SerializedBBox | [number, number, number, number] | Vector2 | undefined;
+type RectSignal<T> = CompoundSignal<PossibleBBox, BBox, 'x' | 'y' | 'width' | 'height', T>;
+declare class BBox implements Type, WebGLConvertible {
+    static readonly symbol: unique symbol;
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    static createSignal(initial?: SignalValue<PossibleBBox>, interpolation?: InterpolationFunction<BBox>): RectSignal<void>;
+    static lerp(from: BBox, to: BBox, value: number | Vector2 | BBox): BBox;
+    static arcLerp(from: BBox, to: BBox, value: number, reverse?: boolean, ratio?: number): BBox;
+    static fromSizeCentered(size: Vector2): BBox;
+    static fromPoints(...points: Vector2[]): BBox;
+    static fromBBoxes(...boxes: BBox[]): BBox;
+    lerp(to: BBox, value: number | Vector2 | BBox): BBox;
+    get position(): Vector2;
+    set position(value: Vector2);
+    get size(): Vector2;
+    get center(): Vector2;
+    get left(): number;
+    set left(value: number);
+    get right(): number;
+    set right(value: number);
+    get top(): number;
+    set top(value: number);
+    get bottom(): number;
+    set bottom(value: number);
+    get topLeft(): Vector2;
+    get topRight(): Vector2;
+    get bottomLeft(): Vector2;
+    get bottomRight(): Vector2;
+    get corners(): [Vector2, Vector2, Vector2, Vector2];
+    get pixelPerfect(): BBox;
+    constructor();
+    constructor(from: PossibleBBox);
+    constructor(position: Vector2, size: Vector2);
+    constructor(x: number, y?: number, width?: number, height?: number);
+    transform(matrix: PossibleMatrix2D): BBox;
+    transformCorners(matrix: PossibleMatrix2D): Vector2[];
+    /**
+     * Expand the bounding box to accommodate the given spacing.
+     *
+     * @param value - The value to expand the bounding box by.
+     */
+    expand(value: PossibleSpacing): BBox;
+    /**
+     * {@inheritDoc expand}
+     *
+     * @deprecated Use {@link expand} instead.
+     */
+    addSpacing(value: PossibleSpacing): BBox;
+    includes(point: Vector2): boolean;
+    intersects(other: BBox): boolean;
+    intersection(other: BBox): BBox;
+    union(other: BBox): BBox;
+    toSymbol(): symbol;
+    toString(): string;
+    toUniform(gl: WebGL2RenderingContext, location: WebGLUniformLocation): void;
+    serialize(): SerializedBBox;
+}
+
+type CanvasColorSpace = 'srgb' | 'display-p3';
+type CanvasOutputMimeType = 'image/png' | 'image/jpeg' | 'image/webp';
+
+type SerializedColor = string;
+interface ColorObject {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+}
+type PossibleColor = SerializedColor | number | Color | ColorObject;
+type CuloriInterpolatorMode = 'a98' | 'cubehelix' | 'dlab' | 'dlch' | 'hsi' | 'hsl' | 'hsv' | 'hwb' | 'jab' | 'jch' | 'lab' | 'lab65' | 'lch' | 'lch65' | 'lchuv' | 'lrgb' | 'luv' | 'okhsl' | 'okhsv' | 'oklab' | 'oklch' | 'p3' | 'prophoto' | 'rec2020' | 'rgb' | 'xyz' | 'xyz50' | 'xyz65' | 'yiq';
+type ColorSignal<T> = Signal<PossibleColor, Color, T>;
+/**
+ * Represents a color using RGBA values (0-1 range).
+ */
+declare class Color implements Type, WebGLConvertible {
+    static symbol: symbol;
+    readonly symbol: symbol;
+    readonly r: number;
+    readonly g: number;
+    readonly b: number;
+    readonly a: number;
+    constructor(value?: PossibleColor);
+    /**
+     * Interpolates between two colors using LCH color space.
+     */
+    static lerp(from: PossibleColor | null, to: PossibleColor | null, value: number, mode?: CuloriInterpolatorMode): Color;
+    /**
+     * Creates an interpolation function for colors (uses LCH space via culori).
+     */
+    static createLerp(mode?: CuloriInterpolatorMode): InterpolationFunction<Color, any[]>;
+    /**
+     * Creates a signal for the Color type.
+     */
+    static createSignal(initial?: SignalValue<PossibleColor>, interpolation?: InterpolationFunction<Color>): ColorSignal<void>;
+    toSymbol(): symbol;
+    /**
+     * Returns the color components as a [r, g, b, a] array (0-1 range).
+     */
+    private gl;
+    toUniform(gl: WebGL2RenderingContext, location: WebGLUniformLocation): void;
+    /**
+     * Serializes the color to an `rgba()` CSS string.
+     */
+    serialize(): SerializedColor;
+    /**
+     * Serializes the color to an `rgb()` CSS string (omitting alpha).
+     */
+    css(): SerializedColor;
+    /**
+     * Returns the alpha value of the color (0-1 range).
+     */
+    alpha(): number;
+    /**
+     * Serializes the color to an RRGGBBAA hex string using culori.
+     */
+    hex(): string;
+    /**
+     * Linearly interpolates from this color to another using LCH space.
+     */
+    lerp(to: PossibleColor, value: number, mode?: CuloriInterpolatorMode): Color;
+}
+
+declare function transformAngle(angle: number, matrix: DOMMatrix): number;
+declare function transformScalar(scalar: number, matrix: DOMMatrix): number;
+
+declare function flipOrigin(origin: Direction, axis?: Center): Direction;
+declare function flipOrigin(origin: Origin, axis?: Center): Origin;
+/**
+ * Convert the given origin to a vector representing its offset.
+ *
+ * @example
+ * ```ts
+ * const bottomRight = originToOffset(Origin.TopRight);
+ * // bottomRight = {x: 1, y: -1}
+ * ```
+ *
+ * @param origin - The origin to convert.
+ */
+declare function originToOffset(origin: Origin | Direction): Vector2;
+
+/**
+ * These are the functions that can be used to apply transformations to a vector.
+ *
+ * These can't be methods of the vector class because they depend on Matrix2D which
+ * would create a circular dependency.
+ */
+
+declare function transformVectorAsPoint(vector: Vector2, matrix: PossibleMatrix2D): Vector2;
+declare function transformVector(vector: Vector2, matrix: PossibleMatrix2D): Vector2;
+/**
+ * Rotates the vector around a point by the provided angle.
+ *
+ * @param vector - The vector to rotate.
+ * @param angle - The angle by which to rotate in degrees.
+ * @param center - The center of rotation. Defaults to the origin.
+ */
+declare function rotateVector(vector: Vector2, angle: number, center?: PossibleVector2): Vector2;
+
+/**
+ * Represents a runtime Motion Canvas plugin.
+ */
+interface Plugin {
+    /**
+     * A unique name of the plugin.
+     *
+     * @remarks
+     * The name should be unique across the entire ecosystem of Motion Canvas.
+     * If a plugin with the same name has already been registered, this plugin
+     * will be ignored.
+     *
+     * If you intend to publish your plugin to npm, it is recommended to prefix
+     * this name with the name of your npm package.
+     *
+     * Other identifiers defined by the plugin, such as a tab id, will be
+     * automatically prefixed with this name and as such don't have to be unique.
+     */
+    name: string;
+    /**
+     * Modify the project settings before the project is initialized.
+     *
+     * @param settings - The project settings.
+     */
+    settings?(settings: UserProject): UserProject | void;
+    /**
+     * Receive the project instance right after it is initialized.
+     *
+     * @param project - The project instance.
+     */
+    project?(project: Project): void;
+    /**
+     * Receive the player instance right after it is initialized.
+     *
+     * @param player - The player instance.
+     */
+    player?(player: Player): void;
+    /**
+     * Receive the renderer instance right after it is initialized.
+     *
+     * @param renderer - The renderer instance.
+     */
+    renderer?(renderer: Renderer): void;
+    /**
+     * Provide custom exporters for the project.
+     *
+     * @param project - The project instance.
+     */
+    exporters?(project: Project): ExporterClass[];
+}
+
+/**
+ * A helper function for exporting Motion Canvas plugins.
+ *
+ * @param plugin - The plugin configuration.
+ *
+ * @example
+ * ```ts
+ * export default makePlugin({
+ *   name: 'my-custom-plugin',
+ * });
+ * ```
+ */
+declare function makePlugin(plugin: Plugin | (() => Plugin)): () => Plugin;
+
+/**
+ * @internal
+ */
+interface WebGLContextOwner {
+    setup(gl: WebGL2RenderingContext): void;
+    teardown(gl: WebGL2RenderingContext): void;
+}
+declare class SharedWebGLContext {
+    private readonly logger;
+    private gl;
+    private currentOwner;
+    private readonly programLookup;
+    constructor(logger: Logger);
+    borrow(owner: WebGLContextOwner): WebGL2RenderingContext;
+    /**
+     * Dispose the WebGL context to free up resources.
+     */
+    dispose(): void;
+    getProgram(fragment: string, vertex: string): WebGLProgram | null;
+    private getShader;
+    private getGL;
+}
+
+/**
+ * @internal
+ */
+declare const UNIFORM_RESOLUTION = "resolution";
+/**
+ * @internal
+ */
+declare const UNIFORM_DESTINATION_TEXTURE = "destinationTexture";
+/**
+ * @internal
+ */
+declare const UNIFORM_SOURCE_TEXTURE = "sourceTexture";
+/**
+ * @internal
+ */
+declare const UNIFORM_TIME = "time";
+/**
+ * @internal
+ */
+declare const UNIFORM_DELTA_TIME = "deltaTime";
+/**
+ * @internal
+ */
+declare const UNIFORM_FRAMERATE = "framerate";
+/**
+ * @internal
+ */
+declare const UNIFORM_FRAME = "frame";
+/**
+ * @internal
+ */
+declare const UNIFORM_SOURCE_MATRIX = "sourceMatrix";
+/**
+ * @internal
+ */
+declare const UNIFORM_DESTINATION_MATRIX = "destinationMatrix";
+/**
+ * @internal
+ */
+declare class Shaders implements WebGLContextOwner {
+    private readonly scene;
+    private readonly sharedContext;
+    private gl;
+    private positionBuffer;
+    private sourceTexture;
+    private destinationTexture;
+    private positionLocation;
+    private readonly quadPositions;
+    constructor(scene: Scene, sharedContext: SharedWebGLContext);
+    setup(gl: WebGL2RenderingContext): void;
+    teardown(gl: WebGL2RenderingContext): void;
+    private handleReload;
+    private updateViewport;
+    getGL(): WebGL2RenderingContext;
+    getProgram(fragment: string): WebGLProgram | null;
+    copyTextures(destination: TexImageSource, source: TexImageSource): void;
+    clear(): void;
+    render(): void;
+    private copyTexture;
+}
+
+interface Slide {
+    id: string;
+    name: string;
+    time: number;
+    scene: Scene;
+    stack?: string;
+}
+declare class Slides {
+    private readonly scene;
+    get onChanged(): SubscribableValueEvent<Slide[]>;
+    private readonly slides;
+    private readonly lookup;
+    private readonly collisionLookup;
+    private current;
+    private canResume;
+    private waitsForId;
+    private targetId;
+    constructor(scene: Scene);
+    setTarget(target: string | null): void;
+    resume(): void;
+    isWaitingFor(slide: string): boolean;
+    isWaiting(): boolean;
+    didHappen(slide: string): boolean;
+    getCurrent(): Slide | null;
+    register(name: string, initialTime: number): void;
+    shouldWait(name: string): boolean;
+    private handleReload;
+    private handleReset;
+    private handleRecalculated;
+    private toId;
+}
+
+declare class Variables {
+    private readonly scene;
+    private signals;
+    private variables;
+    constructor(scene: Scene);
+    /**
+     * Get variable signal if exists or create signal if not
+     *
+     * @param name - The name of the variable.
+     * @param initial - The initial value of the variable. It will be used if the
+     *                  variable was not configured from the outside.
+     */
+    get<T>(name: string, initial: T): () => T;
+    /**
+     * Update all signals with new project variable values.
+     */
+    updateSignals(variables: Record<string, unknown>): void;
+    /**
+     * Reset all stored signals.
+     */
+    handleReset: () => void;
+}
+
+/**
+ * The constructor used when creating new scenes.
+ *
+ * @remarks
+ * Each class implementing the {@link Scene} interface should have a matching
+ * constructor.
+ *
+ * @typeParam T - The type of the configuration object. This object will be
+ *                passed to the constructor from
+ *                {@link SceneDescription.config}.
+ */
+interface SceneConstructor<T> {
+    new (description: FullSceneDescription<T>): Scene;
+}
+/**
+ * Describes a scene exposed by scene files.
+ *
+ * @typeParam T - The type of the configuration object.
+ */
+interface SceneDescription<T = unknown> {
+    /**
+     * Name of the scene.
+     */
+    name: string;
+    /**
+     * The class used to instantiate the scene.
+     */
+    klass: SceneConstructor<T>;
+    /**
+     * Configuration object.
+     */
+    config: T;
+    /**
+     * The stack trace at the moment of creation.
+     */
+    stack?: string;
+    /**
+     * A list of plugins to include in the project.
+     */
+    plugins?: (Plugin | string)[];
+}
+/**
+ * Describes a complete scene together with the meta file.
+ *
+ * @typeParam T - The type of the configuration object.
+ */
+interface FullSceneDescription<T = unknown> extends SceneDescription<T> {
+    size: Vector2;
+    resolutionScale: number;
+    playback: PlaybackStatus;
+    logger: Logger;
+    sharedWebGLContext: SharedWebGLContext;
+    experimentalFeatures?: boolean;
+}
+/**
+ * A part of the {@link SceneDescription} that can be updated during reload.
+ *
+ * @typeParam T - The type of the configuration object.
+ */
+interface SceneDescriptionReload<T = unknown> {
+    size?: Vector2;
+    resolutionScale?: number;
+    config?: T;
+    stack?: string;
+}
+type DescriptionOf<TScene> = TScene extends Scene<infer TConfig> ? SceneDescription<TConfig> : never;
+/**
+ * Describes cached information about the timing of a scene.
+ */
+interface CachedSceneData {
+    firstFrame: number;
+    lastFrame: number;
+    transitionDuration: number;
+    duration: number;
+}
+/**
+ * Signifies the various stages of a {@link Scene}'s render lifecycle.
+ */
+declare enum SceneRenderEvent {
+    /**
+     * Occurs before the render starts when the Scene transitions are applied.
+     */
+    BeforeRender = 0,
+    /**
+     * Occurs at the beginning of a render when the Scene's
+     * {@link utils.useContext} handlers are applied.
+     */
+    BeginRender = 1,
+    /**
+     * Occurs at the end of a render when the Scene's
+     * {@link utils.useContextAfter} handlers are applied.
+     */
+    FinishRender = 2,
+    /**
+     * Occurs after a render ends.
+     */
+    AfterRender = 3
+}
+/**
+ * The main interface for scenes.
+ *
+ * @remarks
+ * Any class implementing this interface should have a constructor matching
+ * {@link SceneConstructor}.
+ *
+ * @typeParam T - The type of the configuration object.
+ */
+interface Scene<T = unknown> {
+    /**
+     * Name of the scene.
+     *
+     * @remarks
+     * Will be passed as the second argument to the constructor.
+     */
+    readonly name: string;
+    /**
+     * Reference to the project.
+     */
+    readonly playback: PlaybackStatus;
+    /**
+     * @experimental
+     */
+    readonly shaders: Shaders;
+    readonly slides: Slides;
+    readonly logger: Logger;
+    readonly variables: Variables;
+    creationStack?: string;
+    /**
+     * The frame at which this scene starts.
+     */
+    get firstFrame(): number;
+    /**
+     * The frame at which this scene ends.
+     */
+    get lastFrame(): number;
+    /**
+     * Triggered when the cached data changes.
+     *
+     * @eventProperty
+     */
+    get onCacheChanged(): SubscribableValueEvent<CachedSceneData>;
+    /**
+     * Triggered when the scene is reloaded.
+     *
+     * @eventProperty
+     */
+    get onReloaded(): SubscribableEvent<void>;
+    /**
+     * Triggered after scene is recalculated.
+     *
+     * @eventProperty
+     */
+    get onRecalculated(): SubscribableEvent<void>;
+    /**
+     * The {@link scenes.LifecycleEvents} of this scene.
+     */
+    get lifecycleEvents(): LifecycleEvents;
+    /**
+     * The {@link scenes.LifecycleEvents} of this scene.
+     *
+     * @deprecated Use {@link lifecycleEvents} instead.
+     */
+    get LifecycleEvents(): LifecycleEvents;
+    /**
+     * Triggered at various stages of the render lifecycle with an event title and a Context2D.
+     *
+     * @eventProperty
+     */
+    get onRenderLifecycle(): SubscribableEvent<[
+        SceneRenderEvent,
+        CanvasRenderingContext2D
+    ]>;
+    /**
+     * Triggered when the scene is reset.
+     *
+     * @eventProperty
+     */
+    get onReset(): SubscribableEvent<void>;
+    /**
+     * The scene directly before this scene, or null if omitted for performance.
+     */
+    get previous(): Scene | null;
+    /**
+     * Whether experimental features are enabled.
+     */
+    get experimentalFeatures(): boolean;
+    /**
+     * Render the scene onto a canvas.
+     *
+     * @param context - The context to used when rendering.
+     */
+    render(context: CanvasRenderingContext2D): Promise<void>;
+    /**
+     * Reload the scene.
+     *
+     * @remarks
+     * This method is called whenever something related to this scene has changed:
+     * time events, source code, metadata, etc.
+     *
+     * Should trigger {@link onReloaded}.
+     *
+     * @param description - If present, an updated version of the description.
+     */
+    reload(description?: SceneDescriptionReload<T>): void;
+    /**
+     * Recalculate the scene.
+     *
+     * @remarks
+     * The task of this method is to calculate new timings stored in the cache.
+     * When this method is invoked, `this.project.frame` is set to the frame at
+     * which this scene should start ({@link firstFrame}).
+     *
+     * At the end of execution, this method should set `this.project.frame` to the
+     * frame at which this scene ends ({@link lastFrame}).
+     *
+     * Should trigger {@link onRecalculated}.
+     */
+    recalculate(setFrame: (frame: number) => void): Promise<void>;
+    /**
+     * Progress this scene one frame forward.
+     */
+    next(): Promise<void>;
+    /**
+     * Reset this scene to its initial state.
+     *
+     * @param previous - If present, the previous scene.
+     */
+    reset(previous?: Scene): Promise<void>;
+    /**
+     * Get the size of this scene.
+     *
+     * @remarks
+     * Usually returns `this.project.getSize()`.
+     */
+    getSize(): Vector2;
+    /**
+     * Get the real size of this scene.
+     *
+     * @remarks
+     * Returns the size of the scene multiplied by the resolution scale.
+     * This is the actual size of the canvas onto which the scene is rendered.
+     */
+    getRealSize(): Vector2;
+    /**
+     * Is this scene in the {@link SceneState.AfterTransitionIn} state?
+     */
+    isAfterTransitionIn(): boolean;
+    /**
+     * Is this scene in the {@link SceneState.CanTransitionOut} state?
+     */
+    canTransitionOut(): boolean;
+    /**
+     * Is this scene in the {@link SceneState.Finished} state?
+     */
+    isFinished(): boolean;
+    /**
+     * Enter the {@link SceneState.Initial} state.
+     */
+    enterInitial(): void;
+    /**
+     * Enter the {@link SceneState.AfterTransitionIn} state.
+     */
+    enterAfterTransitionIn(): void;
+    /**
+     * Enter the {@link SceneState.CanTransitionOut} state.
+     */
+    enterCanTransitionOut(): void;
+    /**
+     * Is this scene cached?
+     *
+     * @remarks
+     * Used only by {@link GeneratorScene}. Seeking through a project that
+     * contains at least one uncached scene will log a warning to the console.
+     *
+     * Should always return `true`.
+     */
+    isCached(): boolean;
+    /**
+     * Get all media assets
+     */
+    getMediaAssets(): Array<AssetInfo>;
+    stopAllMedia(): void;
+    adjustVolume(volumeScale: number): void;
+    /**
+     * Should this scene be rendered below the previous scene during a transition?
+     */
+    previousOnTop: SignalValue<boolean>;
+}
+
+/**
+ * Lifecycle events for {@link Scene} that are cleared on every reset.
+ */
+declare class LifecycleEvents {
+    private readonly scene;
+    get onBeforeRender(): Subscribable<CanvasRenderingContext2D, EventHandler<CanvasRenderingContext2D>>;
+    protected readonly beforeRender: EventDispatcher<CanvasRenderingContext2D>;
+    get onBeginRender(): Subscribable<CanvasRenderingContext2D, EventHandler<CanvasRenderingContext2D>>;
+    protected readonly beginRender: EventDispatcher<CanvasRenderingContext2D>;
+    get onFinishRender(): Subscribable<CanvasRenderingContext2D, EventHandler<CanvasRenderingContext2D>>;
+    protected readonly finishRender: EventDispatcher<CanvasRenderingContext2D>;
+    get onAfterRender(): Subscribable<CanvasRenderingContext2D, EventHandler<CanvasRenderingContext2D>>;
+    protected readonly afterRender: EventDispatcher<CanvasRenderingContext2D>;
+    constructor(scene: Scene);
+}
+
+/**
+ * Scenes can implement this interface to display their thread hierarchy in the
+ * UI.
+ *
+ * @remarks
+ * This interface is only useful when a scene uses thread generators to run.
+ */
+interface Threadable {
+    /**
+     * Triggered when the main thread changes.
+     *
+     * @eventProperty
+     */
+    get onThreadChanged(): SubscribableValueEvent<Thread | null>;
+}
+declare function isThreadable(value: any): value is Threadable;
+
+interface ThreadGeneratorFactory<T> {
+    (view: T): ThreadGenerator;
+}
+/**
+ * The default implementation of the {@link Scene} interface.
+ *
+ * Uses generators to control the animation.
+ */
+declare abstract class GeneratorScene<T> implements Scene<ThreadGeneratorFactory<T>>, Threadable {
+    readonly name: string;
+    readonly playback: PlaybackStatus;
+    readonly logger: Logger;
+    readonly shaders: Shaders;
+    readonly slides: Slides;
+    readonly variables: Variables;
+    creationStack?: string;
+    previousOnTop: SignalValue<boolean>;
+    get firstFrame(): number;
+    get lastFrame(): number;
+    get onCacheChanged(): SubscribableValueEvent<CachedSceneData>;
+    private readonly cache;
+    get onReloaded(): Subscribable<void, EventHandler<void>>;
+    private readonly reloaded;
+    get onRecalculated(): Subscribable<void, EventHandler<void>>;
+    private readonly recalculated;
+    get onThreadChanged(): SubscribableValueEvent<Thread | null>;
+    private readonly thread;
+    get onRenderLifecycle(): Subscribable<[SceneRenderEvent, CanvasRenderingContext2D], EventHandler<[SceneRenderEvent, CanvasRenderingContext2D]>>;
+    protected readonly renderLifecycle: EventDispatcher<[SceneRenderEvent, CanvasRenderingContext2D]>;
+    get onReset(): Subscribable<void, EventHandler<void>>;
+    private readonly afterReset;
+    readonly lifecycleEvents: LifecycleEvents;
+    get LifecycleEvents(): LifecycleEvents;
+    get previous(): Scene<unknown> | null;
+    getMediaAssets(): Array<AssetInfo>;
+    stopAllMedia(): void;
+    abstract adjustVolume(volumeScale: number): void;
+    readonly experimentalFeatures: boolean;
+    protected resolutionScale: number;
+    private runnerFactory;
+    private previousScene;
+    private runner;
+    private state;
+    private cached;
+    private counters;
+    private size;
+    constructor(description: FullSceneDescription<ThreadGeneratorFactory<T>>);
+    abstract getView(): T;
+    /**
+     * Update the view.
+     *
+     * Invoked after each step of the main generator.
+     * Can be used for calculating layout.
+     *
+     * Can modify the state of the view.
+     */
+    update(): void;
+    render(context: CanvasRenderingContext2D): Promise<void>;
+    protected abstract draw(context: CanvasRenderingContext2D): Promise<void>;
+    reload({ config, size, stack, resolutionScale, }?: SceneDescriptionReload<ThreadGeneratorFactory<T>>): void;
+    recalculate(setFrame: (frame: number) => void): Promise<void>;
+    next(): Promise<void>;
+    reset(previousScene?: Scene | null): Promise<void>;
+    getSize(): Vector2;
+    getRealSize(): Vector2;
+    isAfterTransitionIn(): boolean;
+    canTransitionOut(): boolean;
+    isFinished(): boolean;
+    enterInitial(): void;
+    enterAfterTransitionIn(): void;
+    enterCanTransitionOut(): void;
+    isCached(): boolean;
+    /**
+     * Invoke the given callback in the context of this scene.
+     *
+     * @remarks
+     * This method makes sure that the context of this scene is globally available
+     * during the execution of the callback.
+     *
+     * @param callback - The callback to invoke.
+     */
+    protected execute<T>(callback: () => T): T;
+}
+
+/**
+ * Represents an element to inspect.
+ *
+ * @remarks
+ * The type is not important because the UI does not interact with it.
+ * It serves as a key that will be passed back to an Inspectable scene to
+ * receive more information about said element.
+ */
+type InspectedElement = unknown;
+/**
+ * Represents attributes of an inspected element.
+ */
+type InspectedAttributes = {
+    stack?: string;
+    [K: string]: any;
+};
+/**
+ * Scenes can implement this interface to make their components
+ * inspectable through the UI.
+ */
+interface Inspectable {
+    /**
+     * Get a possible element to inspect at a given position.
+     *
+     * @param x - The x coordinate.
+     * @param y - The y coordinate.
+     */
+    inspectPosition(x: number, y: number): InspectedElement | null;
+    /**
+     * Check if the inspected element is still valid.
+     *
+     * @remarks
+     * If a scene destroys and recreates its components upon every reset, the
+     * reference may no longer be valid. Even though the component is still
+     * present. This method should check that and return a new reference.
+     *
+     * @param element - The element to validate.
+     */
+    validateInspection(element: InspectedElement | null): InspectedElement | null;
+    /**
+     * Return the attributes of the inspected element.
+     *
+     * @remarks
+     * This information will be displayed in the "Properties" panel.
+     *
+     * @param element - The element to inspect.
+     */
+    inspectAttributes(element: InspectedElement): InspectedAttributes | null;
+    /**
+     * Draw an overlay for the inspected element.
+     *
+     * @remarks
+     * This method can be used to overlay additional information about an
+     * element on top of the animation.
+     *
+     * @param element - The element for which to draw an overlay.
+     * @param matrix - A local-to-screen matrix.
+     * @param context - The context to draw with.
+     */
+    drawOverlay(element: InspectedElement, matrix: DOMMatrix, context: CanvasRenderingContext2D): void;
+    /**
+     * Transform the absolute mouse coordinates into the scene's coordinate system.
+     *
+     * @param x - The x coordinate.
+     * @param y - The y coordinate.
+     */
+    transformMousePosition(x: number, y: number): Vector2 | null;
+}
+declare function isInspectable(value: any): value is Inspectable;
+
+/**
+ * // TODO(refactor): maybe we can delete this
+ *
+ * A random number generator based on
+ * {@link https://gist.github.com/tommyettinger/46a874533244883189143505d203312c | Mulberry32}.
+ */
+declare class Random {
+    private state;
+    /**
+     * Previously generated Gaussian random number.
+     *
+     * @remarks
+     * This is an optimization.
+     * Since {@link gauss} generates a pair of independent Gaussian random
+     * numbers, it returns one immediately and stores the other for the next call
+     * to {@link gauss}.
+     */
+    private nextGauss;
+    constructor(state: number);
+    /**
+     * @internal
+     */
+    static createSeed(): number;
+    /**
+     * Get the next random float in the given range.
+     *
+     * @param from - The start of the range.
+     * @param to - The end of the range.
+     */
+    nextFloat(from?: number, to?: number): number;
+    /**
+     * Get the next random integer in the given range.
+     *
+     * @param from - The start of the range.
+     * @param to - The end of the range. Exclusive.
+     */
+    nextInt(from?: number, to?: number): number;
+    /**
+     * Get a random float from a gaussian distribution.
+     * @param mean - The mean of the distribution.
+     * @param stdev - The standard deviation of the distribution.
+     */
+    gauss(mean?: number, stdev?: number): number;
+    /**
+     * Get an array filled with random floats in the given range.
+     *
+     * @param size - The size of the array.
+     * @param from - The start of the range.
+     * @param to - The end of the range.
+     */
+    floatArray(size: number, from?: number, to?: number): number[];
+    /**
+     Get an array filled with random integers in the given range.
+     *
+     * @param size - The size of the array.
+     * @param from - The start of the range.
+     * @param to - The end of the range. Exclusive.
+     */
+    intArray(size: number, from?: number, to?: number): number[];
+    /**
+     * Create a new independent generator.
+     */
+    spawn(): Random;
+    private next;
+}
+
+/**
+ * Describes the state of a scene.
+ */
+declare enum SceneState {
+    /**
+     * The scene has just been created/reset.
+     */
+    Initial = 0,
+    /**
+     * The scene has finished transitioning in.
+     *
+     * @remarks
+     * Informs the Project that the previous scene is no longer necessary and can
+     * be disposed of.
+     */
+    AfterTransitionIn = 1,
+    /**
+     * The scene is ready to transition out.
+     *
+     * @remarks
+     * Informs the project that the next scene can begin.
+     * The {@link Scene.next} method will still be invoked until the next scene
+     * enters {@link AfterTransitionIn}.
+     */
+    CanTransitionOut = 2,
+    /**
+     * The scene has finished.
+     *
+     * @remarks
+     * Invoking {@link Scene.next} won't have any effect.
+     */
+    Finished = 3
+}
+
+interface StageSettings {
+    size: Vector2;
+    resolutionScale: number;
+    colorSpace: CanvasColorSpace;
+    background: Color | string | null;
+}
+/**
+ * Manages canvases on which an animation can be displayed.
+ */
+declare class Stage {
+    private background;
+    private resolutionScale;
+    private colorSpace;
+    private size;
+    readonly finalBuffer: HTMLCanvasElement;
+    private readonly currentBuffer;
+    private readonly previousBuffer;
+    private context;
+    private currentContext;
+    private previousContext;
+    private get canvasSize();
+    constructor();
+    configure({ colorSpace, size, resolutionScale, background, }: Partial<StageSettings>): void;
+    render(currentScene: Scene, previousScene: Scene | null): Promise<void>;
+    resizeCanvas(context: CanvasRenderingContext2D): void;
+}
+
+/**
+ * An estimate of the time remaining until the process is finished.
+ */
+interface TimeEstimate {
+    /**
+     * The completion percentage ranging from `0` to `1`.
+     */
+    completion: number;
+    /**
+     * The time passed since the beginning of the process in milliseconds.
+     */
+    elapsed: number;
+    /**
+     * The estimated time remaining until the process is finished in milliseconds.
+     */
+    eta: number;
+}
+/**
+ * Calculates the estimated time remaining until a process is finished.
+ */
+declare class TimeEstimator {
+    get onCompletionChanged(): SubscribableValueEvent<number>;
+    private readonly completion;
+    private startTimestamp;
+    private lastUpdateTimestamp;
+    private nextCompletion;
+    /**
+     * Get the current time estimate.
+     *
+     * @param timestamp - The timestamp to calculate the estimate against.
+     *                    Defaults to `performance.now()`.
+     */
+    estimate(timestamp?: number): TimeEstimate;
+    /**
+     * Update the completion percentage.
+     *
+     * @param completion - The completion percentage ranging from `0` to `1`.
+     * @param timestamp - A timestamp at which the process was updated.
+     *                    Defaults to `performance.now()`.
+     */
+    update(completion: number, timestamp?: number): void;
+    reportProgress(): void;
+    /**
+     * Reset the estimator.
+     *
+     * @param nextCompletion - If known, the completion percentage of the next
+     *                         update.
+     * @param timestamp - A timestamp at which the process started.
+     *                    Defaults to `performance.now()`.
+     */
+    reset(nextCompletion?: number, timestamp?: number): void;
+}
+
+interface RendererSettings extends StageSettings {
+    name: string;
+    range: [number, number];
+    fps: number;
+    exporter: ExporterSettings;
+    hiddenFolderId?: string;
+}
+interface AssetInfo {
+    key: string;
+    type: 'video' | 'audio';
+    src: string;
+    playbackRate: number;
+    volume: number;
+    currentTime: number;
+    duration: number;
+    decoder?: string | null;
+}
+declare enum RendererState {
+    Initial = 0,
+    Working = 1,
+    Aborting = 2
+}
+declare enum RendererResult {
+    Success = 0,
+    Error = 1,
+    Aborted = 2
+}
+/**
+ * The rendering logic used by the editor to export animations.
+ *
+ * @remarks
+ * This class uses the `PlaybackManager` to render animations. In contrast to a
+ * player, a renderer does not use an update loop. It plays through the
+ * animation as fast as it can, occasionally pausing to keep the UI responsive.
+ *
+ * The actual exporting is outsourced to an Exporter.
+ */
+declare class Renderer {
+    private project;
+    get onStateChanged(): SubscribableValueEvent<RendererState>;
+    private readonly state;
+    get onFinished(): Subscribable<RendererResult, EventHandler<RendererResult>>;
+    private readonly finished;
+    get onFrameChanged(): SubscribableValueEvent<number>;
+    private readonly frame;
+    readonly stage: Stage;
+    readonly estimator: TimeEstimator;
+    private readonly lock;
+    private readonly playback;
+    private readonly status;
+    private readonly sharedWebGLContext;
+    private exporter;
+    private abortController;
+    constructor(project: Project);
+    /**
+     * Returns number of frames that a project will have.
+     */
+    getNumberOfFrames(settings: RendererSettings): Promise<number>;
+    frameToTime(frame: number): number;
+    timeToFrame(second: number): number;
+    /**
+     * Render the animation using the provided settings.
+     *
+     * @param settings - The rendering settings.
+     */
+    render(settings: RendererSettings): Promise<void>;
+    /**
+     * Abort the ongoing render process.
+     */
+    abort(): void;
+    /**
+     * Export an individual frame.
+     *
+     * @remarks
+     * This method always uses the default `ImageExporter`.
+     *
+     * @param settings - The rendering settings.
+     * @param time - The timestamp to export.
+     */
+    renderFrame(settings: RendererSettings, time: number): Promise<void>;
+    private run;
+    private reloadScenes;
+    private exportFrame;
+    private getMediaByFrames;
+}
+
+/**
+ * The static interface for exporters.
+ */
+interface ExporterClass {
+    /**
+     * The unique identifier of this exporter.
+     *
+     * @remarks
+     * This identifier will be used to store the settings of this exporter.
+     * It's recommended to prepend it with the name of the package to avoid
+     * collisions.
+     */
+    readonly id: string;
+    /**
+     * The name of this exporter.
+     *
+     * @remarks
+     * This name will be displayed in the editor.
+     */
+    readonly displayName: string;
+    /**
+     * Create an instance of this exporter.
+     *
+     * @remarks
+     * A new exporter is created whenever the user starts a new rendering process.
+     *
+     * @param project - The current project.
+     * @param settings - The rendering settings.
+     */
+    create(project: Project, settings: RendererSettings): Promise<Exporter>;
+}
+/**
+ * The main interface for implementing custom exporters.
+ */
+interface Exporter {
+    /**
+     * Prepare the rendering configuration.
+     *
+     * @remarks
+     * Called at the beginning of the rendering process, before anything else has
+     * been set up. The returned value can be used to override the rendering
+     * settings provided by the user.
+     */
+    configuration?(): Promise<RendererSettings | void>;
+    /**
+     * Begin the rendering process.
+     *
+     * @remarks
+     * Called after the rendering has been set up, right before the first frame
+     * is rendered. Once `start()` is called, it is guaranteed that the `stop()`
+     * method will be called as well. Can be used to initialize any resources that
+     * require a clean-up.
+     */
+    start?(): Promise<void>;
+    /**
+     * Export a frame.
+     *
+     * @remarks
+     * Called each time after a frame is rendered.
+     *
+     * @param canvas - A canvas containing the rendered frame.
+     * @param frame - The frame number.
+     * @param sceneFrame - The frame number within the scene.
+     * @param sceneName - The name of the scene with which the frame is associated.
+     * @param signal - An abort signal triggered if the user aborts the rendering.
+     */
+    handleFrame(canvas: HTMLCanvasElement, frame: number, sceneFrame: number, sceneName: string, signal: AbortSignal): Promise<void>;
+    /**
+     * after processing the image stream and generating an audio file, merge the video and audio stream as the final video
+     */
+    mergeMedia?(): Promise<void>;
+    /**
+     * Take in media assets per frame and generate audio track for the video.
+     */
+    generateAudio?(assetsInfo: AssetInfo[][], startFrame: number, endFrame: number): Promise<void>;
+    /**
+     * Download all assets necessary for the export process
+     */
+    downloadVideos?(assetsInfo: AssetInfo[][]): Promise<void>;
+    /**
+     * Finish the rendering process.
+     *
+     * @remarks
+     * Called after rendering the visual elements has finished and audio so that audio track can be merged.
+     *
+     * @param result - The result of the rendering.
+     */
+    stop?(result: RendererResult): Promise<void>;
+    /**
+     * Finish the rendering process.
+     *
+     * @remarks
+     * Guaranteed to be called after the rendering has finished - no matter the
+     * result. Performs clean-up.
+     *
+     */
+    kill?(): Promise<void>;
+}
+
+interface FfmpegExporterOptions {
+    format: 'mp4' | 'webm' | 'proRes';
+}
+/**
+ * FFmpeg video exporter.
+ *
+ * @remarks
+ * Most of the export logic is handled on the server. This class communicates
+ * with the FFmpegBridge through a WebSocket connection which lets it invoke
+ * methods on the FFmpegExporterServer class.
+ *
+ * For example, calling the following method:
+ * ```ts
+ * async this.invoke('process', 7);
+ * ```
+ * Will invoke the `process` method on the FFmpegExporterServer class with `7`
+ * as the argument. The result of the method will be returned as a Promise.
+ *
+ * Before any methods can be invoked, the FFmpegExporterServer class must be
+ * initialized by invoking `start`.
+ */
+declare class FFmpegExporterClient implements Exporter {
+    static readonly id = "@twick/core/ffmpeg";
+    static readonly displayName = "Video (FFmpeg)";
+    private readonly settings;
+    private readonly exporterOptions;
+    static create(_: Project, settings: RendererSettings): Promise<FFmpegExporterClient>;
+    private static readonly response;
+    constructor(settings: RendererSettings);
+    start(): Promise<void>;
+    handleFrame(canvas: HTMLCanvasElement): Promise<void>;
+    private blobToDataUrl;
+    stop(result: RendererResult): Promise<void>;
+    kill(): Promise<void>;
+    downloadVideos(assets: AssetInfo[][]): Promise<void>;
+    generateAudio(assets: AssetInfo[][], startFrame: number, endFrame: number): Promise<void>;
+    mergeMedia(): Promise<void>;
+    /**
+     * Remotely invoke a method on the server and wait for a response.
+     *
+     * @param method - The method name to execute on the server.
+     * @param data - The data that will be passed as an argument to the method.
+     *               Should be serializable.
+     */
+    private invoke;
+}
+
+interface ImageExporterOptions {
+    quality: number;
+    fileType: CanvasOutputMimeType;
+    groupByScene: boolean;
+}
+/**
+ * Image sequence exporter.
+ *
+ * @internal
+ */
+declare class ImageExporter implements Exporter {
+    private readonly logger;
+    static readonly id = "@twick/core/image-sequence";
+    static readonly displayName = "Image sequence";
+    static create(project: Project, settings: RendererSettings): Promise<ImageExporter>;
+    private static readonly response;
+    private readonly frameLookup;
+    private readonly projectName;
+    private readonly quality;
+    private readonly fileType;
+    private readonly groupByScene;
+    constructor(logger: Logger, settings: RendererSettings);
+    start(): Promise<void>;
+    handleFrame(canvas: HTMLCanvasElement, frame: number, sceneFrame: number, sceneName: string, signal: AbortSignal): Promise<void>;
+    downloadVideos(assets: AssetInfo[][]): Promise<void>;
+    stop(): Promise<void>;
+    private handleResponse;
+}
+
+declare class WasmExporter implements Exporter {
+    private readonly project;
+    private readonly settings;
+    static readonly id = "@twick/core/wasm";
+    static readonly displayName = "Video (Wasm)";
+    static create(project: Project, settings: RendererSettings): Promise<WasmExporter>;
+    constructor(project: Project, settings: RendererSettings);
+    start(): Promise<void>;
+    private encoder;
+    handleFrame(canvas: HTMLCanvasElement): Promise<void>;
+    stop(): Promise<void>;
+    generateAudio(assets: AssetInfo[][], startFrame: number, endFrame: number): Promise<void>;
+    mergeMedia(): Promise<void>;
+    downloadVideos(assets: AssetInfo[][]): Promise<void>;
+}
+
+interface Versions {
+    core: string;
+    two: string | null;
+    ui: string | null;
+    vitePlugin: string | null;
+}
+declare function createVersionObject(version: string): {
+    core: string;
+    two: string;
+    ui: string;
+    vitePlugin: string;
+};
+type ExporterSettings = {
+    name: '@twick/core/image-sequence';
+    options: ImageExporterOptions;
+} | {
+    name: '@twick/core/ffmpeg';
+    options: FfmpegExporterOptions;
+} | {
+    name: '@twick/core/wasm';
+};
+interface ProjectSettings {
+    shared: {
+        background: Color;
+        range: [number, number];
+        size: Vector2;
+    };
+    rendering: {
+        exporter: ExporterSettings;
+        fps: number;
+        resolutionScale: number;
+        colorSpace: CanvasColorSpace;
+    };
+    preview: {
+        fps: number;
+        resolutionScale: number;
+    };
+}
+interface UserProjectSettings {
+    shared: {
+        range: [number, number];
+        background: string | null;
+        size: {
+            x: number;
+            y: number;
+        };
+    };
+    rendering: {
+        exporter: ExporterSettings;
+        fps: number;
+        resolutionScale: number;
+        colorSpace: CanvasColorSpace;
+    };
+    preview: {
+        fps: number;
+        resolutionScale: number;
+    };
+}
+/**
+ * Settings that can be passed to the renderVideo / renderPartialVideo functions
+ */
+type RenderVideoUserProjectSettings = {
+    range?: UserProjectSettings['shared']['range'];
+    background?: UserProjectSettings['shared']['background'];
+    size?: UserProjectSettings['shared']['size'];
+    exporter?: UserProjectSettings['rendering']['exporter'];
+};
+/**
+ * Settings that can be passed to the createProject function
+ */
+type PartialUserProjectSettings = {
+    shared?: Partial<UserProjectSettings['shared']>;
+    rendering?: Partial<UserProjectSettings['rendering']>;
+    preview?: Partial<UserProjectSettings['preview']>;
+};
+interface UserProject {
+    /**
+     * The name of the project.
+     */
+    name?: string;
+    /**
+     * A list of scene descriptions that make up the project.
+     */
+    scenes: SceneDescription<any>[];
+    /**
+     * Default values for project variables.
+     *
+     * @see https://motioncanvas.io/docs/project-variables
+     */
+    variables?: Record<string, unknown>;
+    /**
+     * Enable experimental features.
+     *
+     * @see https://motioncanvas.io/docs/experimental
+     *
+     * @experimental
+     */
+    experimentalFeatures?: boolean;
+    /**
+     * Settings for the project. This includes shared settings, rendering settings
+     * and preview settings.
+     *
+     * Includes things like the background color, the resolution, the frame rate,
+     * and the exporter to use.
+     */
+    settings?: PartialUserProjectSettings;
+}
+/**
+ * Internal project that includes legacy properties that can't be changed by the user
+ * as well as defaulted properties in case the user didn't provide them.
+ */
+interface Project extends Omit<UserProject, 'settings'> {
+    name: string;
+    settings: ProjectSettings;
+    /**
+     * @deprecated Not exposed in the public API. We set the exporters as plugins
+     * which is why we can't delete this yet.
+     *
+     * // TODO(konsti): get rid of plugins
+     *
+     * A list of plugins to include in the project.
+     *
+     * @remarks
+     * When a string is provided, the plugin will be imported dynamically using
+     * the string as the module specifier. This is the preferred way to include
+     * editor plugins because it makes sure that the plugin's source code gets
+     * excluded from the production build.
+     */
+    plugins: Plugin[];
+    /**
+     * Not exposed in the public API.
+     */
+    logger: Logger;
+    /**
+     * Manually set via a constant. This should be automated by reading the
+     * package.json files of the packages.
+     */
+    versions: Versions;
+}
+
+declare const defaultUserProjectSettings: UserProjectSettings;
+declare function makeProject(project: UserProject): Project;
+declare function addEditorToProject(project: Project): Promise<{
+    plugins: any[];
+    name: string;
+    settings: ProjectSettings;
+    logger: Logger;
+    versions: Versions;
+    scenes: SceneDescription<any>[];
+    variables?: Record<string, unknown> | undefined;
+    experimentalFeatures?: boolean | undefined;
+}>;
+
+declare enum PlaybackState {
+    Playing = 0,
+    Rendering = 1,
+    Paused = 2,
+    Presenting = 3
+}
+/**
+ * A general class for managing a sequence of scenes.
+ *
+ * @remarks
+ * This class provides primitive operations that can be executed on a scene
+ * sequence, such as {@link progress} or {@link seek}.
+ *
+ * @internal
+ */
+declare class PlaybackManager {
+    /**
+     * Triggered when the active scene changes.
+     *
+     * @eventProperty
+     */
+    get onSceneChanged(): SubscribableValueEvent<Scene<unknown>>;
+    /**
+     * Triggered when the scenes get recalculated.
+     *
+     * @remarks
+     * This event indicates that the timing of at least one scene has changed.
+     *
+     * @eventProperty
+     */
+    get onScenesRecalculated(): SubscribableValueEvent<Scene<unknown>[]>;
+    frame: number;
+    speed: number;
+    fps: number;
+    duration: number;
+    finished: boolean;
+    slides: Slide[];
+    previousScene: Scene | null;
+    state: PlaybackState;
+    get currentScene(): Scene;
+    set currentScene(scene: Scene);
+    private currentSceneReference;
+    private scenes;
+    setup(scenes: Scene[]): void;
+    progress(): Promise<boolean>;
+    seek(frame: number): Promise<boolean>;
+    reset(): Promise<void>;
+    reload(description?: SceneDescriptionReload<never>): void;
+    recalculate(): Promise<void>;
+    private next;
+    private findBestScene;
+    private getNextScene;
+}
+
+/**
+ * A read-only representation of the playback.
+ */
+declare class PlaybackStatus {
+    private readonly playback;
+    constructor(playback: PlaybackManager);
+    /**
+     * Convert seconds to frames using the current framerate.
+     *
+     * @param seconds - The seconds to convert.
+     */
+    secondsToFrames(seconds: number): number;
+    /**
+     * Convert frames to seconds using the current framerate.
+     *
+     * @param frames - The frames to convert.
+     */
+    framesToSeconds(frames: number): number;
+    get time(): number;
+    get frame(): number;
+    get speed(): number;
+    get fps(): number;
+    get state(): PlaybackState;
+    /**
+     * The time passed since the last frame in seconds.
+     */
+    get deltaTime(): number;
+}
+
+interface PlayerState extends Record<string, unknown> {
+    paused: boolean;
+    loop: boolean;
+    muted: boolean;
+    volume: number;
+    speed: number;
+}
+interface PlayerSettings {
+    range: [number, number];
+    fps: number;
+    size: Vector2;
+    resolutionScale: number;
+}
+/**
+ * The player logic used by the editor and embeddable player.
+ *
+ * @remarks
+ * This class builds on top of the `PlaybackManager` to provide a simple
+ * interface similar to other media players. It plays through the animation
+ * using a real-time update loop.
+ */
+declare class Player {
+    private project;
+    private settings;
+    private initialState;
+    private initialFrame;
+    /**
+     * Triggered during each iteration of the update loop when the frame is ready
+     * to be rendered.
+     *
+     * @remarks
+     * Player does not perform any rendering on its own. For the animation to be
+     * visible, another class must subscribe to this event and perform the
+     * rendering itself. {@link Stage} can be used to display the animation.
+     *
+     * @eventProperty
+     */
+    get onRender(): Subscribable<void, AsyncEventHandler<void>>;
+    private readonly render;
+    get onStateChanged(): SubscribableValueEvent<PlayerState>;
+    private readonly playerState;
+    get onFrameChanged(): SubscribableValueEvent<number>;
+    private readonly frame;
+    get onDurationChanged(): SubscribableValueEvent<number>;
+    private readonly duration;
+    /**
+     * Triggered right after recalculation finishes.
+     *
+     * @remarks
+     * Can be used to provide visual feedback.
+     *
+     * @eventProperty
+     */
+    get onRecalculated(): Subscribable<void, EventHandler<void>>;
+    private readonly recalculated;
+    readonly playback: PlaybackManager;
+    readonly status: PlaybackStatus;
+    readonly logger: Logger;
+    private readonly sharedWebGLContext;
+    private readonly lock;
+    private startTime;
+    private endTime;
+    private requestId;
+    private renderTime;
+    private requestedSeek;
+    private requestedRender;
+    private requestedRecalculation;
+    private size;
+    private resolutionScale;
+    private active;
+    private get startFrame();
+    private get endFrame();
+    private get finished();
+    constructor(project: Project, settings?: Partial<PlayerSettings>, initialState?: Partial<PlayerState>, initialFrame?: number);
+    configure(settings: PlayerSettings): Promise<void>;
+    /**
+     * Whether the given frame is inside the animation range.
+     *
+     * @param frame - The frame to check.
+     */
+    isInRange(frame: number): boolean;
+    /**
+     * Whether the given frame is inside the user-defined range.
+     *
+     * @param frame - The frame to check.
+     */
+    isInUserRange(frame: number): boolean;
+    requestSeek(value: number): void;
+    requestPreviousFrame(): void;
+    requestNextFrame(): void;
+    requestReset(): void;
+    requestRender(): void;
+    toggleLoop(value?: boolean): void;
+    togglePlayback(value?: boolean): void;
+    toggleAudio(value?: boolean): void;
+    setAudioVolume(value: number): void;
+    addAudioVolume(value: number): void;
+    setSpeed(value: number): void;
+    setVariables(variables: Record<string, unknown>): void;
+    /**
+     * Activate the player.
+     *
+     * @remarks
+     * A player needs to be active in order for the update loop to run. Each
+     * player is active by default.
+     */
+    activate(): void;
+    /**
+     * Deactivate the player.
+     *
+     * @remarks
+     * Deactivating the player prevents its update loop from running. This should
+     * be done before disposing the player, to prevent it from running in the
+     * background.
+     *
+     * Just pausing the player does not stop the loop.
+     */
+    deactivate(): void;
+    private requestRecalculation;
+    private prepare;
+    private run;
+    private request;
+    clampRange(frame: number): number;
+}
+
+type SharedSettings = Project['settings']['shared'];
+type PreviewSettings = Project['settings']['preview'];
+type RenderingSettings = Project['settings']['rendering'];
+declare function getFullPreviewSettings(project: Project): SharedSettings & PreviewSettings;
+declare function getFullRenderingSettings(project: Project): SharedSettings & RenderingSettings;
+
+declare function decorate(fn: Callback, ...decorators: MethodDecorator[]): void;
+
+/**
+ * Create a lazy decorator.
+ *
+ * @remarks
+ * A property marked as lazy will not be initialized until it's requested for
+ * the first time. Lazy properties are read-only.
+ *
+ * Must be used for any static properties that require the DOM API to be
+ * initialized.
+ *
+ * @param factory - A function that returns the value of this property.
+ */
+declare function lazy(factory: () => unknown): PropertyDecorator;
+
+declare function threadable(customName?: string): MethodDecorator;
+
+/**
+ * Run all tasks concurrently and wait for all of them to finish.
+ *
+ * @example
+ * ```ts
+ * // current time: 0s
+ * yield* all(
+ *   rect.fill('#ff0000', 2),
+ *   rect.opacity(1, 1),
+ * );
+ * // current time: 2s
+ * ```
+ *
+ * @param tasks - A list of tasks to run.
+ */
+declare function all(...tasks: ThreadGenerator[]): ThreadGenerator;
+
+/**
+ * Run all tasks concurrently and wait for any of them to finish.
+ *
+ * @example
+ * ```ts
+ * // current time: 0s
+ * yield* any(
+ *   rect.fill('#ff0000', 2),
+ *   rect.opacity(1, 1),
+ * );
+ * // current time: 1s
+ * ```
+ *
+ * @param tasks - A list of tasks to run.
+ */
+declare function any(...tasks: ThreadGenerator[]): ThreadGenerator;
+
+/**
+ * Run tasks one after another.
+ *
+ * @example
+ * ```ts
+ * // current time: 0s
+ * yield* chain(
+ *   rect.fill('#ff0000', 2),
+ *   rect.opacity(1, 1),
+ * );
+ * // current time: 3s
+ * ```
+ *
+ * Note that the same animation can be written as:
+ * ```ts
+ * yield* rect.fill('#ff0000', 2),
+ * yield* rect.opacity(1, 1),
+ * ```
+ *
+ * The reason `chain` exists is to make it easier to pass it to other flow
+ * functions. For example:
+ * ```ts
+ * yield* all(
+ *   rect.radius(20, 3),
+ *   chain(
+ *     rect.fill('#ff0000', 2),
+ *     rect.opacity(1, 1),
+ *   ),
+ * );
+ * ```
+ *
+ * @param tasks - A list of tasks to run.
+ */
+declare function chain(...tasks: (ThreadGenerator | Callback)[]): ThreadGenerator;
+
+/**
+ * Run the given generator or callback after a specific amount of time.
+ *
+ * @example
+ * ```ts
+ * yield* delay(1, rect.fill('#ff0000', 2));
+ * ```
+ *
+ * Note that the same animation can be written as:
+ * ```ts
+ * yield* waitFor(1),
+ * yield* rect.fill('#ff0000', 2),
+ * ```
+ *
+ * The reason `delay` exists is to make it easier to pass it to other flow
+ * functions. For example:
+ * ```ts
+ * yield* all(
+ *   rect.opacity(1, 3),
+ *   delay(1, rect.fill('#ff0000', 2));
+ * );
+ * ```
+ *
+ * @param time - The delay in seconds
+ * @param task - The task or callback to run after the delay.
+ */
+declare function delay(time: number, task: ThreadGenerator | Callback): ThreadGenerator;
+
+interface EveryCallback {
+    /**
+     * A callback called by {@link EveryTimer} every N seconds.
+     *
+     * @param tick - The amount of times the timer has ticked.
+     */
+    (tick: number): void;
+}
+interface EveryTimer {
+    /**
+     * The generator responsible for running this timer.
+     */
+    runner: ThreadGenerator;
+    setInterval(value: number): void;
+    setCallback(value: EveryCallback): void;
+    /**
+     * Wait until the timer ticks.
+     */
+    sync(): ThreadGenerator;
+}
+/**
+ * Call the given callback every N seconds.
+ *
+ * @example
+ * ```ts
+ * const timer = every(2, time => console.log(time));
+ * yield timer.runner;
+ *
+ * // current time: 0s
+ * yield* waitFor(5);
+ * // current time: 5s
+ * yield* timer.sync();
+ * // current time: 6s
+ * ```
+ *
+ * @param interval - The interval between subsequent calls.
+ * @param callback - The callback to be called.
+ */
+declare function every(interval: number, callback: EveryCallback): EveryTimer;
+
+/**
+ * Pause the current generator until all listed tasks are finished.
+ *
+ * @example
+ * ```ts
+ * const task = yield generatorFunction();
+ *
+ * // do something concurrently
+ *
+ * yield* join(task);
+ * ```
+ *
+ * @param tasks - A list of tasks to join.
+ */
+declare function join(...tasks: ThreadGenerator[]): ThreadGenerator;
+/**
+ * Pause the current generator until listed tasks are finished.
+ *
+ * @example
+ * ```ts
+ * const taskA = yield generatorFunctionA();
+ * const taskB = yield generatorFunctionB();
+ *
+ * // do something concurrently
+ *
+ * // await any of the tasks
+ * yield* join(false, taskA, taskB);
+ * ```
+ *
+ * @param all - Whether we should wait for all tasks or for at least one.
+ * @param tasks - A list of tasks to join.
+ */
+declare function join(all: boolean, ...tasks: ThreadGenerator[]): ThreadGenerator;
+
+interface LoopCallback {
+    /**
+     * A callback called by {@link loop} during each iteration.
+     *
+     * @param i - The current iteration index.
+     */
+    (i: number): ThreadGenerator | void;
+}
+/**
+ * Run the given generator in a loop.
+ *
+ * @remarks
+ * Each iteration waits until the previous one is completed.
+ * Because this loop never finishes it cannot be used in the main thread.
+ * Instead, use `yield` or {@link threading.spawn} to run the loop concurrently.
+ *
+ * @example
+ * Rotate the `rect` indefinitely:
+ * ```ts
+ * yield loop(
+ *   () => rect.rotation(0).rotation(360, 2, linear),
+ * );
+ * ```
+ *
+ * @param factory - A function creating the generator to run. Because generators
+ *                  can't be reset, a new generator is created on each
+ *                  iteration.
+ */
+declare function loop(factory: LoopCallback): ThreadGenerator;
+/**
+ * Run the given generator N times.
+ *
+ * @remarks
+ * Each iteration waits until the previous one is completed.
+ *
+ * @example
+ * ```ts
+ * const colors = [
+ *   '#ff6470',
+ *   '#ffc66d',
+ *   '#68abdf',
+ *   '#99c47a',
+ * ];
+ *
+ * yield* loop(
+ *   colors.length,
+ *   i => rect.fill(colors[i], 2),
+ * );
+ * ```
+ *
+ * @param iterations - The number of iterations.
+ * @param factory - A function creating the generator to run. Because generators
+ *                  can't be reset, a new generator is created on each
+ *                  iteration.
+ */
+declare function loop(iterations: number, factory: LoopCallback): ThreadGenerator;
+
+/**
+ * Run a generator in a loop for the given amount of time.
+ *
+ * @remarks
+ * Generators are executed completely before the next iteration starts.
+ * An iteration is allowed to finish even when the time is up. This means that
+ * the actual duration of the loop may be longer than the given duration.
+ *
+ * @example
+ * ```ts
+ * yield* loopFor(
+ *   3,
+ *   () => circle().position.x(-10, 0.1).to(10, 0.1)
+ * );
+ * ```
+ *
+ * @param seconds - The duration in seconds.
+ * @param factory - A function creating the generator to run. Because generators
+ *                  can't be reset, a new generator is created on each
+ *                  iteration.
+ */
+declare function loopFor(seconds: number, factory: LoopCallback): ThreadGenerator;
+
+declare function setTaskName(task: Generator, source: Generator | string): void;
+declare function getTaskName(task: Generator): string;
+
+/**
+ * Turn the given generator function into a task.
+ *
+ * @remarks
+ * If you want to immediately run the generator in its own thread, you can use
+ * {@link threading.spawn} instead. This function is useful when you want to
+ * pass the created task to other flow functions.
+ *
+ * @example
+ * ```ts
+ * yield* all(
+ *   run(function* () {
+ *     // do things
+ *   }),
+ *   rect.opacity(1, 1),
+ * );
+ * ```
+ *
+ * @param runner - A generator function or a factory that creates the generator.
+ */
+declare function run(runner: () => ThreadGenerator): ThreadGenerator;
+/**
+ * Turn the given generator function into a task.
+ *
+ * @remarks
+ * If you want to immediately run the generator in its own thread, you can use
+ * {@link threading.spawn} instead. This function is useful when you want to
+ * pass the created task to other flow functions.
+ *
+ * @example
+ * ```ts
+ * yield* all(
+ *   run(function* () {
+ *     // do things
+ *   }),
+ *   rect.opacity(1, 1),
+ * );
+ * ```
+ *
+ * @param runner - A generator function or a factory that creates the generator.
+ * @param name - An optional name used when displaying this generator in the UI.
+ */
+declare function run(name: string, runner: () => ThreadGenerator): ThreadGenerator;
+
+/**
+ * Wait for the given amount of time.
+ *
+ * @example
+ * ```ts
+ * // current time: 0s
+ * yield waitFor(2);
+ * // current time: 2s
+ * yield waitFor(3);
+ * // current time: 5s
+ * ```
+ *
+ * @param seconds - The relative time in seconds.
+ * @param after - An optional task to be run after the function completes.
+ */
+declare function waitFor(seconds?: number, after?: ThreadGenerator): ThreadGenerator;
+
+/**
+ * Start all tasks one after another with a constant delay between.
+ *
+ * @remarks
+ * The function doesn't wait until the previous task in the sequence has
+ * finished. Once the delay has passed, the next task will start even if
+ * the previous is still running.
+ *
+ * @example
+ * ```ts
+ * yield* sequence(
+ *   0.1,
+ *   ...rects.map(rect => rect.x(100, 1))
+ * );
+ * ```
+ *
+ * @param delay - The delay between each of the tasks.
+ * @param tasks - A list of tasks to be run in a sequence.
+ */
+declare function sequence(delay: number, ...tasks: ThreadGenerator[]): ThreadGenerator;
+
+type ImageDataSource = CanvasImageSource & {
+    width: number;
+    height: number;
+};
+declare function loadImage(source: string): Promise<HTMLImageElement>;
+declare function loadAnimation(sources: string[]): Promise<HTMLImageElement[]>;
+declare function getImageData(image: ImageDataSource): ImageData;
+
+/**
+ * The default plugin included in every Motion Canvas project.
+ *
+ * TODO(refactor): I don't think these are plugins anymore.
+ *
+ * @internal
+ */
+declare const _default: () => Plugin;
+
+/**
+ * Perform a transition that fades between the scenes.
+ *
+ * @param duration - The duration of the transition.
+ */
+declare function fadeTransition(duration?: number): ThreadGenerator;
+
+/**
+ * Perform a transition that slides the scene in the given direction.
+ *
+ * @param direction - The direction in which to slide.
+ * @param duration - The duration of the transition.
+ */
+declare function slideTransition(direction: Direction, duration?: number): ThreadGenerator;
+/**
+ * Perform a transition that slides the scene towards the given origin.
+ *
+ * @param origin - The origin towards which to slide.
+ * @param duration - The duration of the transition.
+ */
+declare function slideTransition(origin: Origin, duration?: number): ThreadGenerator;
+
+/**
+ * Transition to the current scene by altering the Context2D before scenes are rendered.
+ *
+ * @param current - The callback to use before the current scene is rendered.
+ * @param previous - The callback to use before the previous scene is rendered.
+ * @param previousOnTop - Whether the previous scene should be rendered on top.
+ */
+declare function useTransition(current: (ctx: CanvasRenderingContext2D) => void, previous?: (ctx: CanvasRenderingContext2D) => void, previousOnTop?: SignalValue<boolean>): () => void;
+
+/**
+ * Perform a transition that zooms in on a given area of the scene.
+ *
+ * @param area - The area on which to zoom in.
+ * @param duration - The duration of the transition.
+ */
+declare function zoomInTransition(area: BBox, duration?: number): ThreadGenerator;
+
+/**
+ * Perform a transition that zooms out from a given area of the scene.
+ *
+ * @param area - The area from which to zoom out.
+ * @param duration - The duration of the transition.
+ */
+declare function zoomOutTransition(area: BBox, duration?: number): ThreadGenerator;
+
+declare function beginSlide(name: string): ThreadGenerator;
+
+declare function capitalize<T extends string>(value: T): Capitalize<T>;
+
+interface ReferenceReceiver<T> {
+    (reference: T): void;
+}
+interface Reference<T> extends ReferenceReceiver<T> {
+    (): T;
+}
+declare function createRef<T>(): Reference<T>;
+declare function makeRef<TObject, TKey extends keyof TObject>(object: TObject, key: TKey): ReferenceReceiver<TObject[TKey]>;
+type RefsProperty<TValue> = TValue extends (config: {
+    refs?: infer TReference;
+}) => void ? TReference : never;
+declare function makeRefs<T extends (config: {
+    refs?: any;
+}) => void>(): RefsProperty<T>;
+
+type ReferenceArray<T> = T[] & Reference<T>;
+/**
+ * Create an array of references.
+ *
+ * @remarks
+ * The returned object is both an array and a reference that can be passed
+ * directly to the `ref` property of a node.
+ *
+ * @example
+ * ```tsx
+ * const labels = createRefArray<Txt>();
+ *
+ * view.add(['A', 'B'].map(text => <Txt ref={labels}>{text}</Txt>));
+ * view.add(<Txt ref={labels}>C</Txt>);
+ *
+ * // accessing the references individually:
+ * yield* labels[0].text('A changes', 0.3);
+ * yield* labels[1].text('B changes', 0.3);
+ * yield* labels[2].text('C changes', 0.3);
+ *
+ * // accessing all references at once:
+ * yield* all(...labels.map(label => label.fill('white', 0.3)));
+ * ```
+ */
+declare function createRefArray<T>(): ReferenceArray<T>;
+
+type ReferenceMap<T> = Map<string, Reference<T>> & Record<string, Reference<T>> & {
+    /**
+     * Maps the references in this group to a new array.
+     *
+     * @param callback - The function to transform each reference.
+     *
+     * @returns An array of the transformed references.
+     */
+    mapRefs<TValue>(callback: (value: T, index: number) => TValue): TValue[];
+};
+/**
+ * Create a group of references.
+ *
+ * @remarks
+ * The returned object lets you easily create multiple references to the same
+ * type without initializing them individually.
+ *
+ * You can retrieve references by accessing the object's properties. If the
+ * reference for a given property does not exist, it will be created
+ * automatically.
+ *
+ * @example
+ * ```tsx
+ * const labels = createRefMap<Txt>();
+ *
+ * view.add(
+ *   <>
+ *     <Txt ref={labels.a}>A</Txt>
+ *     <Txt ref={labels.b}>B</Txt>
+ *     <Txt ref={labels.c}>C</Txt>
+ *   </>,
+ * );
+ *
+ * // accessing the references individually:
+ * yield* labels.a().text('A changes', 0.3);
+ * yield* labels.b().text('B changes', 0.3);
+ * yield* labels.c().text('C changes', 0.3);
+ *
+ * // checking if the given reference exists:
+ * if ('d' in labels) {
+ *   yield* labels.d().text('D changes', 0.3);
+ * }
+ *
+ * // accessing all references at once:
+ * yield* all(...labels.mapRefs(label => label.fill('white', 0.3)));
+ * ```
+ */
+declare function createRefMap<T>(): ReferenceMap<T>;
+
+/**
+ * Logs a debug message with an arbitrary payload.
+ *
+ * @remarks
+ * This method is a shortcut for calling `useLogger().debug()` which allows
+ * you to more easily log non-string values as well.
+ *
+ * @example
+ * ```ts
+ * export default makeScene2D(function* (view) {
+ *   const circle = createRef<Circle>();
+ *
+ *   view.add(
+ *     <Circle ref={circle} width={320} height={320} fill={'lightseagreen'} />,
+ *   );
+ *
+ *   debug(circle().position());
+ * });
+ * ```
+ *
+ * @param payload - The payload to log
+ */
+declare function debug(payload: any): void;
+
+/**
+ * Mark the given function as deprecated.
+ *
+ * @param fn - The function to deprecate.
+ * @param message - The log message.
+ * @param remarks - The optional log remarks.
+ */
+declare function deprecate<TArgs extends any[], TReturn>(fn: (...args: TArgs) => TReturn, message: string, remarks?: string): (...args: TArgs) => TReturn;
+
+type DetailedErrorProps = Pick<LogPayload, 'message' | 'remarks' | 'object' | 'durationMs' | 'inspect'>;
+declare class DetailedError extends Error {
+    /**
+     * {@inheritDoc app.LogPayload.message}
+     */
+    readonly remarks?: string;
+    /**
+     * {@inheritDoc app.LogPayload.object}
+     */
+    readonly object?: any;
+    /**
+     * {@inheritDoc app.LogPayload.durationMs}
+     */
+    readonly durationMs?: number;
+    /**
+     * {@inheritDoc app.LogPayload.inspect}
+     */
+    readonly inspect?: string;
+    constructor(message: string, remarks?: string);
+    constructor(props: DetailedErrorProps);
+}
+
+declare function errorToLog(error: any): LogPayload;
+
+declare const experimentalFeatures = "\nThis feature requires enabling the `experimentalFeatures` flag in your project\nconfiguration:\n\n```ts\nexport default makeProject({\n  experimentalFeatures: true,\n  // ...\n});\n```\n\n[Learn more](https://motioncanvas.io/docs/experimental) about experimental\nfeatures.\n";
+type ExperimentalErrorProps = Pick<LogPayload, 'message' | 'remarks' | 'object' | 'durationMs' | 'inspect'>;
+declare class ExperimentalError extends DetailedError {
+    constructor(message: string, remarks?: string);
+    constructor(props: ExperimentalErrorProps);
+}
+
+declare function experimentalLog(message: string, remarks?: string): LogPayload;
+
+declare function getContext(options?: CanvasRenderingContext2DSettings, canvas?: HTMLCanvasElement): CanvasRenderingContext2D;
+
+/**
+ * A constant for converting radians to degrees
+ *
+ * @example
+ * const degrees = 0.6 * RAD2DEG;
+ */
+declare const RAD2DEG: number;
+/**
+ * A constant for converting degrees to radians
+ *
+ * @example
+ * const radians = 30 * DEG2RAD;
+ */
+declare const DEG2RAD: number;
+
+/**
+ * Create an array containing a range of numbers.
+ *
+ * @example
+ * ```ts
+ * const array1 = range(3); // [0, 1, 2]
+ * const array2 = range(-3); // [0, -1, -2]
+ * ```
+ *
+ * @param length - The length of the array.
+ */
+declare function range(length: number): number[];
+/**
+ * Create an array containing a range of numbers.
+ *
+ * @example
+ * ```ts
+ * const array1 = range(3, 7); // [3, 4, 5, 6]
+ * const array2 = range(7, 3); // [7, 6, 5, 4]
+ * ```
+ *
+ * @param from - The start of the range.
+ * @param to - The end of the range. `to` itself is not included in the result.
+ */
+declare function range(from: number, to: number): number[];
+/**
+ * Create an array containing a range of numbers.
+ *
+ * @example
+ * ```ts
+ * const array1 = range(1, 2, 0.25); // [1, 1.25, 1.5, 1.75]
+ * const array2 = range(2, 1, -0.25); // [2, 1.75, 1.5, 1.25]
+ * ```
+ *
+ * @param from - The start of the range.
+ * @param to - The end of the range. `to` itself is not included in the result.
+ * @param step - The value by which to increment or decrement.
+ */
+declare function range(from: number, to: number, step: number): number[];
+
+/**
+ * A simple semaphore implementation with a capacity of 1.
+ *
+ * @internal
+ */
+declare class Semaphore {
+    private resolveCurrent;
+    private current;
+    acquire(): Promise<void>;
+    release(): void;
+}
+
+/**
+ * Provide a function to access the Context2D before the scene is rendered.
+ *
+ * @param callback - The function that will be provided the context before render.
+ */
+declare function useContext(callback: (ctx: CanvasRenderingContext2D) => void): () => void;
+/**
+ * Provide a function to access the Context2D after the scene is rendered.
+ *
+ * @param callback - The function that will be provided the context after render.
+ */
+declare function useContextAfter(callback: (ctx: CanvasRenderingContext2D) => void): () => void;
+
+/**
+ * Get a reference to the playback status.
+ */
+declare function usePlayback(): PlaybackStatus;
+declare function startPlayback(playback: PlaybackStatus): void;
+declare function endPlayback(playback: PlaybackStatus): void;
+
+/**
+ * Get a reference to the current scene.
+ */
+declare function useScene(): Scene;
+declare function startScene(scene: Scene): void;
+declare function endScene(scene: Scene): void;
+declare function useLogger(): Logger | Console;
+/**
+ * Mark the current scene as ready to transition out.
+ *
+ * @remarks
+ * Usually used together with transitions. When a scene is marked as finished,
+ * the transition will start but the scene generator will continue running.
+ */
+declare function finishScene(): void;
+
+/**
+ * Get a reference to the current thread.
+ */
+declare function useThread(): Thread;
+declare function startThread(thread: Thread): void;
+declare function endThread(thread: Thread): void;
+
+/**
+ * Get the real time since the start of the animation.
+ *
+ * @remarks
+ * The returned value accounts for offsets caused by functions such as
+ * {@link flow.waitFor}.
+ *
+ * @example
+ * ```ts
+ * // current time: 0s
+ * yield* waitFor(0.02);
+ *
+ * // current time: 0.016(6)s
+ * // real time: 0.02s
+ * const realTime = useTime();
+ * ```
+ */
+declare function useTime(): number;
+
+export { type AssetInfo, AsyncEventDispatcher, type AsyncEventHandler, BBox, BeatSpring, BounceSpring, type CachedSceneData, type CanvasColorSpace, type CanvasOutputMimeType, Center, Color, type ColorObject, type ColorSignal, type CompoundSignal, CompoundSignalContext, type Computed, ComputedContext, DEFAULT, DEG2RAD, _default as DefaultPlugin, DependencyContext, type DescriptionOf, DetailedError, Direction, EPSILON, EventDispatcher, EventDispatcherBase, type EventHandler, type EveryCallback, type EveryTimer, ExperimentalError, type Exporter, type ExporterClass, type ExporterSettings, FFmpegExporterClient, type FfmpegExporterOptions, FlagDispatcher, type FullSceneDescription, GeneratorScene, type ImageDataSource, ImageExporter, type ImageExporterOptions, type Inspectable, type InspectedAttributes, type InspectedElement, type InterpolationFunction, JumpSpring, LifecycleEvents, LogLevel, type LogPayload, Logger, type LoopCallback, Matrix2D, Origin, type PartialUserProjectSettings, PlaybackManager, PlaybackState, PlaybackStatus, Player, type PlayerSettings, type PlayerState, PlopSpring, type Plugin, type PossibleBBox, type PossibleColor, type PossibleMatrix2D, type PossibleSpacing, type PossibleVector2, type Project, type ProjectSettings, type Promisable, type PromiseHandle, RAD2DEG, Random, type RectSignal, type Reference, type ReferenceArray, type ReferenceMap, type ReferenceReceiver, type RefsProperty, type RenderVideoUserProjectSettings, Renderer, RendererResult, type RendererSettings, RendererState, type Scene, type SceneConstructor, type SceneDescription, type SceneDescriptionReload, SceneRenderEvent, SceneState, Semaphore, type SerializedBBox, type SerializedColor, type SerializedSpacing, type SerializedVector2, Shaders, SharedWebGLContext, type Signal, SignalContext, type SignalExtensions, type SignalGenerator, type SignalGetter, type SignalSetter, type SignalTween, type SignalValue, type SimpleSignal, type SimpleVector2Signal, type Slide, Slides, SmoothSpring, Spacing, type SpacingSignal, type Spring, Stage, type StageSettings, StrikeSpring, Subscribable, type SubscribableAsyncEvent, type SubscribableEvent, type SubscribableFlagEvent, SubscribableValueEvent, SwingSpring, Thread, type ThreadGenerator, type ThreadGeneratorFactory, type Threadable, type ThreadsCallback, type ThreadsFactory, type TimingFunction, type Type, UNIFORM_DELTA_TIME, UNIFORM_DESTINATION_MATRIX, UNIFORM_DESTINATION_TEXTURE, UNIFORM_FRAME, UNIFORM_FRAMERATE, UNIFORM_RESOLUTION, UNIFORM_SOURCE_MATRIX, UNIFORM_SOURCE_TEXTURE, UNIFORM_TIME, type UserProject, type UserProjectSettings, ValueDispatcher, Variables, Vector2, type Vector2Signal, type Versions, WasmExporter, type WebGLContextOwner, type WebGLConvertible, addEditorToProject, all, any, arcLerp, beginSlide, boolLerp, cancel, capitalize, chain, clamp, clampRemap, cos, createComputed, createComputedAsync, createEaseInBack, createEaseInBounce, createEaseInElastic, createEaseInOutBack, createEaseInOutBounce, createEaseInOutElastic, createEaseOutBack, createEaseOutBounce, createEaseOutElastic, createRef, createRefArray, createRefMap, createSignal, createVersionObject, debug, decorate, deepLerp, defaultUserProjectSettings, delay, deprecate, easeInBack, easeInBounce, easeInCirc, easeInCubic, easeInElastic, easeInExpo, easeInOutBack, easeInOutBounce, easeInOutCirc, easeInOutCubic, easeInOutElastic, easeInOutExpo, easeInOutQuad, easeInOutQuart, easeInOutQuint, easeInOutSine, easeInQuad, easeInQuart, easeInQuint, easeInSine, easeOutBack, easeOutBounce, easeOutCirc, easeOutCubic, easeOutElastic, easeOutExpo, easeOutQuad, easeOutQuart, easeOutQuint, easeOutSine, endPlayback, endScene, endThread, errorToLog, every, experimentalFeatures, experimentalLog, fadeTransition, finishScene, flipOrigin, getContext, getFullPreviewSettings, getFullRenderingSettings, getImageData, getTaskName, isInspectable, isPromisable, isPromise, isReactive, isThreadGenerator, isThreadable, isType, join, lazy, linear, loadAnimation, loadImage, loop, loopFor, makePlugin, makeProject, makeRef, makeRefs, makeSpring, map, modify, noop, originToOffset, range, remap, rotateVector, run, sequence, setTaskName, sin, slideTransition, spawn, spring, startPlayback, startScene, startThread, textLerp, threadable, threads, transformAngle, transformScalar, transformVector, transformVectorAsPoint, tween, unwrap, useContext, useContextAfter, useLogger, usePlayback, useScene, useThread, useTime, useTransition, waitFor, zoomInTransition, zoomOutTransition };