@niuee/board/input-flow-control/zoom-control-state-machine.d.ts

<h1 align="center"> board </h1> <p align="center"> board supercharges your html canvas element giving it the capabilities to pan, zoom, rotate, and much more. </p> <p align="center"> <a href="https://www.npmjs.com/package/@niuee/board">

import { Point } from "../util/misc";
import { TemplateStateMachine, TemplateState } from "../being";
import type { State, EventReactions, BaseContext } from "../being";
/**
 * @description The possible states of the zoom control state machine.
 *
 * @category Input Flow Control
 */
export type ZoomControlStates = "ACCEPTING_USER_INPUT" | "TRANSITION" | "LOCKED_ON_OBJECT";
/**
 * @description The payload for the zoom by at input event.
 *
 * @category Input Flow Control
 */
export type ZoomByAtInputPayload = {
    deltaZoom: number;
    anchorPoint: Point;
};
/**
 * @description The payload for the zoom to at input event.
 *
 * @category Input Flow Control
 */
export type ZoomToAtInputPayload = {
    targetZoom: number;
    anchorPoint: Point;
};
/**
 * @description The payload for the zoom by payload.
 *
 * @category Input Flow Control
 */
export type ZoomByPayload = {
    deltaZoom: number;
};
/**
 * @description The payload for the zoom to payload.
 *
 * @category Input Flow Control
 */
export type ZoomToPayload = {
    targetZoom: number;
};
/**
 * @description The payload mapping for the events of the zoom control state machine.
 *
 * @category Input Flow Control
 */
export type ZoomEventPayloadMapping = {
    "userZoomByAtInput": ZoomByAtInputPayload;
    "userZoomToAtInput": ZoomToAtInputPayload;
    "transitionZoomByAtInput": ZoomByAtInputPayload;
    "transitionZoomToAtInput": ZoomToAtInputPayload;
    "transitionZoomByAtCenterInput": ZoomByPayload;
    "transitionZoomToAtCenterInput": ZoomToAtInputPayload;
    "transitionZoomToAtWorldInput": ZoomToAtInputPayload;
    "lockedOnObjectZoomByAtInput": ZoomByAtInputPayload;
    "lockedOnObjectZoomToAtInput": ZoomToAtInputPayload;
    "unlock": {};
    "initiateTransition": {};
};
/**
 * @description The context for the zoom control state machine.
 *
 * @category Input Flow Control
 */
export interface ZoomContext extends BaseContext {
    zoomToAt: (targetZoom: number, at: Point) => void;
    zoomByAt: (delta: number, at: Point) => void;
    zoomTo: (targetZoom: number) => void;
    zoomBy: (delta: number) => void;
    zoomToAtWorld: (targetZoom: number, at: Point) => void;
    zoomByAtWorld: (delta: number, at: Point) => void;
}
/**
 * @description The accepting user input state of the zoom control state machine.
 *
 * @category Input Flow Control
 */
export declare class ZoomAcceptingUserInputState extends TemplateState<ZoomEventPayloadMapping, ZoomContext, ZoomControlStates> {
    private _eventReactions;
    get eventReactions(): EventReactions<ZoomEventPayloadMapping, ZoomContext, ZoomControlStates>;
    userZoomByAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["userZoomByAtInput"]): void;
    userZoomToAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["userZoomToAtInput"]): void;
}
/**
 * @description The transition state of the zoom control state machine.
 *
 * @category Input Flow Control
 */
export declare class ZoomTransitionState extends TemplateState<ZoomEventPayloadMapping, ZoomContext, ZoomControlStates> {
    constructor();
    private _eventReactions;
    get eventReactions(): EventReactions<ZoomEventPayloadMapping, ZoomContext, ZoomControlStates>;
    lockedOnObjectZoomByAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["lockedOnObjectZoomByAtInput"]): void;
    lockedOnObjectZoomToAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["lockedOnObjectZoomToAtInput"]): void;
    userZoomByAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["userZoomByAtInput"]): void;
    userZoomToAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["userZoomToAtInput"]): void;
    transitionZoomByAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["transitionZoomByAtInput"]): void;
    transitionZoomByAtCenterInput(context: ZoomContext, payload: ZoomEventPayloadMapping["transitionZoomByAtCenterInput"]): void;
    transitionZoomToAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["transitionZoomToAtInput"]): void;
    transitionZoomToAtCenterInput(context: ZoomContext, payload: ZoomEventPayloadMapping["transitionZoomToAtCenterInput"]): void;
    transitionZoomToAtWorldInput(context: ZoomContext, payload: ZoomEventPayloadMapping["transitionZoomToAtWorldInput"]): void;
}
/**
 * @description The locked on object state of the zoom control state machine.
 *
 * @category Input Flow Control
 */
export declare class ZoomLockedOnObjectState extends TemplateState<ZoomEventPayloadMapping, ZoomContext, ZoomControlStates> {
    constructor();
    private _eventReactions;
    get eventReactions(): EventReactions<ZoomEventPayloadMapping, ZoomContext, ZoomControlStates>;
    lockedOnObjectZoomByAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["lockedOnObjectZoomByAtInput"]): void;
    lockedOnObjectZoomToAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["lockedOnObjectZoomToAtInput"]): void;
    userZoomByAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["userZoomByAtInput"]): void;
    userZoomToAtInput(context: ZoomContext, payload: ZoomEventPayloadMapping["userZoomToAtInput"]): void;
}
/**
 * @description The zoom control state machine.
 *
 * @category Input Flow Control
 */
export declare class ZoomControlStateMachine extends TemplateStateMachine<ZoomEventPayloadMapping, ZoomContext, ZoomControlStates> {
    constructor(states: Record<ZoomControlStates, State<ZoomEventPayloadMapping, ZoomContext, ZoomControlStates>>, initialState: ZoomControlStates, context: ZoomContext);
    notifyZoomByAtInput(delta: number, at: Point): void;
    notifyZoomByAtInputAnimation(delta: number, at: Point): void;
    notifyZoomToAtCenterInput(targetZoom: number, at: Point): void;
    notifyZoomToAtWorldInput(targetZoom: number, at: Point): void;
    initateTransition(): void;
}
/**
 * @description Create the object containing the default zoom control states.
 *
 * @category Input Flow Control
 */
export declare function createDefaultZoomControlStates(): Record<ZoomControlStates, State<ZoomEventPayloadMapping, ZoomContext, ZoomControlStates>>;
/**
 * @description Create the default zoom control state machine.
 *
 * @category Input Flow Control
 */
export declare function createDefaultZoomControlStateMachine(context: ZoomContext): ZoomControlStateMachine;