import { type Attacking, type Frame } from "./frames.ts";
import { type PlaceLike, type ZoneOptions } from "./rules.ts";
import { type Unit } from "./units.ts";
import type { Language } from "./types.ts";
/** The six numbers of a matrix, as an SVG's `DOMMatrix` has them. */
export interface MatrixLike {
    a: number;
    b: number;
    c: number;
    d: number;
    e: number;
    f: number;
}
/** What the functions need of an element of the drawing: its attributes, and for the surface group its matrix to the page. */
export interface ElementLike {
    getAttribute(name: string): string | null;
    getScreenCTM?(): MatrixLike | null;
}
/** What the functions need of the drawing's `<svg>`: to find the surface group in it. A real `SVGSVGElement` is one. */
export interface SvgLike extends ElementLike {
    querySelector(selectors: string): unknown;
    closest?(selectors: string): unknown;
}
/** What the pointer functions take besides the position. */
export interface PointerOptions {
    /** The frame the answer is written in: the name of a frame of the drawing's sport (`nhl-api`, `opta`, `statsbomb`, `mlbam`), a frame, or `"surface"` for the drawing's own numbers (feet, or `units`). `"surface"` when missing. */
    provider?: Frame | string;
    /** The unit of the `"surface"` numbers: feet when missing. */
    units?: Unit;
    /** The end the provider's team attacks, as in `toSurface`: `left` says the provider's numbers are of a team that attacks the left end of the surface as it is drawn wide. */
    attacking?: Attacking;
    /** The language of the zone names. */
    language?: Language;
    /** The size of the surface when the frame is a variable one, in place of the drawing's own. */
    size?: ZoneOptions["size"];
}
/** Where the pointer is on the field. */
export interface FieldPoint {
    /** The place in the provider's frame (feet in the drawing's wide frame for `"surface"`). */
    x: number;
    y: number;
    /** The frame's name. */
    provider: string;
    /** The place on the surface: feet in the drawing's wide frame (x along the surface from the left, y across it from the top). */
    surface: {
        x: number;
        y: number;
    };
    /** True when the pointer is on the surface, or on its edge: not on the apron, the stands or the page round it. */
    inBounds: boolean;
    /** The zone and the finer area, by id (`zoneAt` in the zones entry): `undefined` off the surface. */
    zone: string | undefined;
    subzone: string | undefined;
    /** Every id that holds, with its name. */
    zones: string[];
    names: Record<string, string>;
}
/**
 * Where a page position is on the field of a drawing, in a provider's numbers, with the zone the rules put it in. `svg` is the drawing's `<svg>` element, and
 * the position is a pointer event's `clientX` and `clientY`. It holds whatever the drawing is: wide or tall, any size or padding, a range, a cropped viewBox. It answers `null` for
 * a drawing with no surface to ask (a badge, a special game, or the 3D view, whose floor is laid in CSS 3D). `provider` names a frame of the drawing's sport (`nhl-api`,
 * `opta`, `statsbomb`, `mlbam`...) and a frame of another sport is an error; without one, the numbers are the surface's own in feet.
 * @example
 * ```ts no-run
 * import { clientPointToField } from "@johnmorrisdotca/kyogijo-stadiums/pointer";
 * const svg = document.querySelector<SVGSVGElement>("svg.kyogijo")!;
 * svg.addEventListener("click", (event) => {
 *   const at = clientPointToField(svg, event.clientX, event.clientY, { provider: "nhl-api" });
 *   if (at !== null) console.log(at.x, at.y, at.zone, at.inBounds);
 * });
 * ```
 */
export declare function clientPointToField(svg: SvgLike | Element, clientX: number, clientY: number, options?: PointerOptions): FieldPoint | null;
/**
 * The page position of a place on the field: the undoing of `clientPointToField`. The place is in a provider's numbers (or the surface's own, in feet or `units`); the answer is
 * `clientX` and `clientY`, to put a marker over the drawing with. `null` for a drawing with no surface to ask.
 * @example
 * ```ts no-run
 * import { fieldPointToClient } from "@johnmorrisdotca/kyogijo-stadiums/pointer";
 * const svg = document.querySelector<SVGSVGElement>("svg.kyogijo")!;
 * const at = fieldPointToClient(svg, [69, 22], { provider: "nhl-api" });
 * declare const marker: HTMLElement;
 * if (at !== null) marker.style.transform = `translate(${at.x}px, ${at.y}px)`;
 * ```
 */
export declare function fieldPointToClient(svg: SvgLike | Element, point: PlaceLike, options?: PointerOptions): {
    x: number;
    y: number;
} | null;
/**
 * The same page position in each of several frames at once, with the zone: what a readout that shows a place in every provider asks (the demo's). `providers` defaults to every
 * frame of the drawing's sport.
 * @example
 * ```ts no-run
 * import { clientPointToFrames } from "@johnmorrisdotca/kyogijo-stadiums/pointer";
 * const svg = document.querySelector<SVGSVGElement>("svg.kyogijo")!;
 * svg.addEventListener("pointermove", (event) => {
 *   const all = clientPointToFrames(svg, event.clientX, event.clientY);
 *   console.log(all?.points.map((p) => `${p.provider}: ${p.x}, ${p.y}`), all?.zone);
 * });
 * ```
 */
export declare function clientPointToFrames(svg: SvgLike | Element, clientX: number, clientY: number, options?: Omit<PointerOptions, "provider"> & {
    providers?: readonly (Frame | string)[];
}): (Omit<FieldPoint, "x" | "y" | "provider"> & {
    points: {
        provider: string;
        title: string;
        unit: string;
        x: number;
        y: number;
    }[];
}) | null;