@kerusiweb/core 2.1.0 → 2.3.0

package/dist/view/seat-glyph.d.ts

@@ -0,0 +1,137 @@
+import { RenderSeat } from '../render/render-model.js';
+import { SeatBox } from '../render/seat-shapes.js';
+import { PlacedSeat } from '../render/section-layout.js';
+import { KerusiSeatStyle } from './kerusi-seat-style.js';
+import { KerusiSeatmapColors, SeatOccupantVariant } from './kerusi-seatmap-colors.js';
+/**
+ * The seat glyph, resolved: every path, paint and position a binding draws
+ * inside one seat's `<g>`.
+ *
+ * Both bindings used to call the paint and shape functions one by one, and each
+ * kept its own copy of the "mark box" rule below. That is exactly the code the
+ * architecture says belongs in core, so it lives here now and a binding only
+ * binds the result. It is also what a custom seat template receives, so a
+ * consumer drawing their own seat can reuse the library's paths and colours
+ * rather than re-derive them.
+ */
+/** A filled path. */
+export interface SeatGlyphShape {
+    /** The path's `d` attribute. */
+    d: string;
+    /** A CSS paint, usually a `var(--kerusi-*, …)` with the resolved fallback. */
+    fill: string;
+}
+export interface SeatGlyph {
+    /** `null` for an available or blocked seat: nothing to mark. */
+    variant: SeatOccupantVariant | null;
+    /** The classes for the seat's `<g>`: `kerusi-seat`, its status, and the modifiers. */
+    className: string;
+    /**
+     * The `data-*` attributes for the seat's `<g>`, so CSS can pick seats out by
+     * what the document says about them. An absent field is not rendered.
+     */
+    data: SeatDataAttributes;
+    /** The seat's own placed box. */
+    box: SeatBox;
+    /**
+     * The box the decorative marks sit on: the seat's own, or the selected core's
+     * when it is selected. See {@link resolveSeatGlyph}.
+     */
+    markBox: SeatBox;
+    /**
+     * The outline: by default square-ish at the front and tapered at the back, so
+     * facing reads from the shape; otherwise the seat style's `shape`.
+     */
+    body: SeatGlyphShape;
+    /** The dimming wash over a held or booked seat; absent otherwise. */
+    wash?: SeatGlyphShape;
+    /** The bright plate inside a selected seat's frame; absent otherwise. */
+    core?: SeatGlyphShape;
+    /** The occupant figure for a selected, held or booked seat; absent otherwise. */
+    occupant?: SeatGlyphShape & {
+        variant: SeatOccupantVariant;
+        /** `none` except for the hollow held figure. */
+        stroke: string;
+        strokeWidth: number;
+    };
+    /** The seat number, centred on the seat and kept upright. */
+    label: {
+        text: string;
+        x: number;
+        y: number;
+        fontSize: number;
+        fill: string;
+        /** A core-coloured halo behind a selected seat's number; `none` otherwise. */
+        halo: string;
+        haloWidth: number;
+        /** Cancels the seat's rotation; `null` when the seat does not rotate. */
+        transform: string | null;
+    };
+    /** The corner marker for `accessibility.wheelchairAccessible`; absent otherwise. */
+    wheelchair?: {
+        cx: number;
+        cy: number;
+        r: number;
+        fill: string;
+    };
+}
+/** See {@link SeatGlyph.data}. Each field is bound as the attribute named beside it. */
+export interface SeatDataAttributes {
+    /** `data-seat-type`: `Seat.type`. */
+    type: string;
+    /** `data-seat-status`: the merged availability, same as the status class. */
+    status: string;
+    /** `data-section-id`: the section the seat belongs to. */
+    section: string;
+    /** `data-seat-row`: `Seat.row`, when the seat names one. */
+    row?: string;
+    /**
+     * `data-seat-attributes`: `Seat.attributes`, space-separated, when there are
+     * any, so `[data-seat-attributes~="aisle"]` matches one tag among several.
+     */
+    attributes?: string;
+}
+/**
+ * What a custom seat template is handed: the seat, whether it is selected, and
+ * the stock glyph already resolved for it. Each binding extends this with a
+ * framework-native way to draw the stock glyph (`defaultContent`).
+ */
+export interface KerusiSeatContext {
+    /** The seat as placed in its section, in viewBox units. */
+    placed: PlacedSeat;
+    /** The resolved seat: status, type, price, accessibility, `source.metadata`. */
+    seat: RenderSeat;
+    /** Whether the seat is in the current selection. */
+    selected: boolean;
+    /** The stock glyph's paths and paints, for reuse. */
+    glyph: SeatGlyph;
+}
+/**
+ * Resolves the stock glyph for one placed seat.
+ *
+ * Everything over a selected seat sits on its core, so every mark is measured
+ * from the core's box rather than the seat's. Drawing to the seat's box leaves
+ * the occupant's hips crossing the frame, where a figure tinted `selectedBg`
+ * lands on a frame filled `selectedBg` and reads as a hard nub. Because the core
+ * is an exact scaled copy of the body (see `seatSelectedFrame`), measuring from
+ * it keeps every clearance a mark had against the body, so the frame width stays
+ * free to change. *
+ * `style` is the seat's resolved `seatStyle` / `seatTypeStyles` entry (see
+ * `resolveSeatStyle`). It changes the seat's own colour, label colour and
+ * classes; it never changes a selected or blocked seat's fill.
+ */
+export declare function resolveSeatGlyph(placed: PlacedSeat, selected: boolean, colors: Required<KerusiSeatmapColors>, typeColors: boolean, style?: KerusiSeatStyle): SeatGlyph;
+/**
+ * The outline for a legend type swatch drawn in its type's `shape`, on a
+ * `size`-square box, or `undefined` to keep the flat square swatch: a type with
+ * no shape, or the default `'seat'`, has nothing a square does not already say.
+ */
+export declare function legendSwatchPath(typeStyle: KerusiSeatStyle | undefined, size: number): string | undefined;
+/** The `data-*` attributes for a seat's `<g>`; see {@link SeatDataAttributes}. */
+export declare function seatDataAttributes(seat: RenderSeat): SeatDataAttributes;
+/**
+ * The class list for a seat's `<g>`: the hooks the READMEs document, then any
+ * `extra` classes from the seat's style.
+ */
+export declare function seatClassName(seat: RenderSeat, selected: boolean, extra?: string | readonly string[]): string;
+//# sourceMappingURL=seat-glyph.d.ts.map

package/dist/view/seat-glyph.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"seat-glyph.d.ts","sourceRoot":"","sources":["../../src/view/seat-glyph.ts"],"names":[],"mappings":"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"}

package/dist/view/seat-glyph.js

@@ -0,0 +1,130 @@
+import { seatMarkerAnchor, seatOccupantPath, seatOccupantStroke, seatSelectedFrame, seatShapePath, } from '../render/seat-shapes.js';
+import { classList } from './kerusi-seat-style.js';
+import { occupantFillFor, occupantStrokeFor, seatCoreFill, seatFill, seatOccupantVariant, seatTextFill, seatWashFill, } from './kerusi-seatmap-colors.js';
+/**
+ * Resolves the stock glyph for one placed seat.
+ *
+ * Everything over a selected seat sits on its core, so every mark is measured
+ * from the core's box rather than the seat's. Drawing to the seat's box leaves
+ * the occupant's hips crossing the frame, where a figure tinted `selectedBg`
+ * lands on a frame filled `selectedBg` and reads as a hard nub. Because the core
+ * is an exact scaled copy of the body (see `seatSelectedFrame`), measuring from
+ * it keeps every clearance a mark had against the body, so the frame width stays
+ * free to change. *
+ * `style` is the seat's resolved `seatStyle` / `seatTypeStyles` entry (see
+ * `resolveSeatStyle`). It changes the seat's own colour, label colour and
+ * classes; it never changes a selected or blocked seat's fill.
+ */
+export function resolveSeatGlyph(placed, selected, colors, typeColors, style) {
+    const seat = placed.seat;
+    const variant = seatOccupantVariant(seat, selected);
+    const box = {
+        x: placed.x,
+        y: placed.y,
+        width: placed.width,
+        height: placed.height,
+    };
+    const markBox = selected ? coreBox(box) : box;
+    const shape = style?.shape;
+    const bodyD = seatShapePath(shape, box.x, box.y, box.width, box.height);
+    const anchor = seatMarkerAnchor(shape);
+    const textFill = seatTextFill(seat, selected, colors, typeColors, style);
+    return {
+        variant,
+        className: seatClassName(seat, selected, style?.className),
+        data: seatDataAttributes(seat),
+        box,
+        markBox,
+        body: { d: bodyD, fill: seatFill(seat, selected, colors, typeColors, style) },
+        wash: variant === 'held' || variant === 'booked'
+            ? { d: bodyD, fill: seatWashFill(variant, colors) }
+            : undefined,
+        core: selected
+            ? {
+                d: seatShapePath(shape, markBox.x, markBox.y, markBox.width, markBox.height),
+                fill: seatCoreFill(colors),
+            }
+            : undefined,
+        occupant: variant
+            ? {
+                variant,
+                d: seatOccupantPath(markBox.x, markBox.y, markBox.width, markBox.height),
+                fill: occupantFillFor(variant, colors),
+                stroke: occupantStrokeFor(variant, colors),
+                strokeWidth: seatOccupantStroke(markBox.width, markBox.height),
+            }
+            : undefined,
+        label: {
+            text: seat.label,
+            x: placed.centerX,
+            y: placed.centerY,
+            fontSize: placed.fontSize,
+            fill: textFill,
+            // The label is centred on the occupant's shoulder line, so without the
+            // halo a selected seat's number is `selectedBg` over a `selectedBg`
+            // silhouette. It also rescues a label too long for the core.
+            halo: selected ? seatCoreFill(colors) : 'none',
+            haloWidth: selected ? placed.fontSize * 0.22 : 0,
+            transform: placed.rotation
+                ? `rotate(${-placed.rotation} ${placed.centerX} ${placed.centerY})`
+                : null,
+        },
+        // The marker keeps the same relative corner on whichever box it sits on, so
+        // a selected seat's dot stays whole instead of being bitten off by the frame.
+        wheelchair: seat.accessibility?.wheelchairAccessible
+            ? {
+                cx: markBox.x + markBox.width * anchor.x,
+                cy: markBox.y + markBox.height * anchor.y,
+                r: markBox.width * 0.13,
+                fill: textFill,
+            }
+            : undefined,
+    };
+}
+/**
+ * The outline for a legend type swatch drawn in its type's `shape`, on a
+ * `size`-square box, or `undefined` to keep the flat square swatch: a type with
+ * no shape, or the default `'seat'`, has nothing a square does not already say.
+ */
+export function legendSwatchPath(typeStyle, size) {
+    const shape = typeStyle?.shape;
+    return shape && shape !== 'seat' ? seatShapePath(shape, 0, 0, size, size) : undefined;
+}
+/** The selected core's box: the seat's, inset by the frame width on every side. */
+function coreBox(box) {
+    const frame = seatSelectedFrame(box.width, box.height);
+    return {
+        x: box.x + frame,
+        y: box.y + frame,
+        width: box.width - frame * 2,
+        height: box.height - frame * 2,
+    };
+}
+/** The `data-*` attributes for a seat's `<g>`; see {@link SeatDataAttributes}. */
+export function seatDataAttributes(seat) {
+    return {
+        type: seat.type.id,
+        status: seat.status,
+        section: seat.sectionId,
+        row: seat.row || undefined,
+        attributes: seat.attributes.length ? seat.attributes.join(' ') : undefined,
+    };
+}
+/**
+ * The class list for a seat's `<g>`: the hooks the READMEs document, then any
+ * `extra` classes from the seat's style.
+ */
+export function seatClassName(seat, selected, extra) {
+    return [
+        'kerusi-seat',
+        `kerusi-seat--${seat.status}`,
+        selected ? 'kerusi-seat--selected' : '',
+        seat.selectable ? '' : 'kerusi-seat--unselectable',
+        seat.accessibility?.wheelchairAccessible ? 'kerusi-seat--wheelchair' : '',
+        seat.companions.length > 0 ? 'kerusi-seat--companion' : '',
+        ...classList(extra),
+    ]
+        .filter(Boolean)
+        .join(' ');
+}
+//# sourceMappingURL=seat-glyph.js.map

package/dist/view/seat-glyph.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"seat-glyph.js","sourceRoot":"","sources":["../../src/view/seat-glyph.ts"],"names":[],"mappings":"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"}

package/dist/view/viewport-gesture.d.ts

@@ -0,0 +1,65 @@
+import { KerusiViewport, ViewportLimits, ViewportPoint, ViewportSize } from './viewport.js';
+/**
+ * Pointer gestures on a zoomable map, as a reducer.
+ *
+ * One pointer pans, two pinch. The rule that matters most is the one that keeps
+ * seat selection intact: a touch that never leaves a small circle around where
+ * it landed is a *tap* and changes nothing, so the `click` that follows still
+ * reaches the seat. A binding feeds `down` / `move` / `up` / `cancel` in
+ * container coordinates and applies what comes back; it never has to know what
+ * a pinch is.
+ */
+/** How far a pointer may travel, in CSS pixels, and still be a tap. */
+export declare const TAP_SLOP_PX = 8;
+export type GestureEvent = {
+    type: 'down' | 'move';
+    id: number;
+    point: ViewportPoint;
+} | {
+    type: 'up' | 'cancel';
+    id: number;
+};
+/** Where the gesture stands. Opaque to callers: pass it back in. */
+export interface GestureState {
+    /** Tracked pointer ids, oldest first. A pinch uses the first two. */
+    readonly ids: readonly number[];
+    /** Where each tracked pointer is now. */
+    readonly points: Readonly<Record<number, ViewportPoint>>;
+    /** The viewport and pointer positions the current movement is measured from. */
+    readonly origin: {
+        readonly viewport: KerusiViewport;
+        readonly points: Readonly<Record<number, ViewportPoint>>;
+    } | null;
+    /** True once the gesture is a pan or a pinch rather than a possible tap. */
+    readonly moved: boolean;
+}
+export declare const IDLE_GESTURE: GestureState;
+export interface GestureContext {
+    /** The live viewport. */
+    viewport: KerusiViewport;
+    /** The map's laid-out size, unscaled. */
+    content: ViewportSize;
+    /** The visible area. */
+    container: ViewportSize;
+    limits?: ViewportLimits;
+    /** Overrides {@link TAP_SLOP_PX}. */
+    slop?: number;
+}
+export interface GestureResult {
+    state: GestureState;
+    /** The viewport after this event; the very same object when nothing changed. */
+    viewport: KerusiViewport;
+    /**
+     * True on the event that turns a possible tap into a gesture. A binding
+     * captures the pointers then, not earlier: capturing on `down` would
+     * retarget the tap's `click` away from the seat.
+     */
+    capture: boolean;
+    /**
+     * True on the `up` that ends a gesture. The browser still fires a `click`
+     * after a drag, and it must not select the seat under the finger.
+     */
+    suppressClick: boolean;
+}
+export declare function reduceGesture(state: GestureState, event: GestureEvent, context: GestureContext): GestureResult;
+//# sourceMappingURL=viewport-gesture.d.ts.map

package/dist/view/viewport-gesture.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewport-gesture.d.ts","sourceRoot":"","sources":["../../src/view/viewport-gesture.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,cAAc,EACd,cAAc,EACd,aAAa,EACb,YAAY,EAEb,MAAM,eAAe,CAAC;AAEvB;;;;;;;;;GASG;AAEH,uEAAuE;AACvE,eAAO,MAAM,WAAW,IAAI,CAAC;AAE7B,MAAM,MAAM,YAAY,GACpB;IAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,aAAa,CAAA;CAAE,GAC3D;IAAE,IAAI,EAAE,IAAI,GAAG,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CAAC;AAE1C,oEAAoE;AACpE,MAAM,WAAW,YAAY;IAC3B,qEAAqE;IACrE,QAAQ,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,CAAC;IAChC,yCAAyC;IACzC,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC;IACzD,gFAAgF;IAChF,QAAQ,CAAC,MAAM,EAAE;QACf,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;QAClC,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC;KAC1D,GAAG,IAAI,CAAC;IACT,4EAA4E;IAC5E,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,YAAY,EAAE,YAKzB,CAAC;AAEH,MAAM,WAAW,cAAc;IAC7B,yBAAyB;IACzB,QAAQ,EAAE,cAAc,CAAC;IACzB,yCAAyC;IACzC,OAAO,EAAE,YAAY,CAAC;IACtB,wBAAwB;IACxB,SAAS,EAAE,YAAY,CAAC;IACxB,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,qCAAqC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,YAAY,CAAC;IACpB,gFAAgF;IAChF,QAAQ,EAAE,cAAc,CAAC;IACzB;;;;OAIG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,wBAAgB,aAAa,CAC3B,KAAK,EAAE,YAAY,EACnB,KAAK,EAAE,YAAY,EACnB,OAAO,EAAE,cAAc,GACtB,aAAa,CAUf"}

package/dist/view/viewport-gesture.js

@@ -0,0 +1,145 @@
+import { clampViewport, zoomLimits, } from './viewport.js';
+/**
+ * Pointer gestures on a zoomable map, as a reducer.
+ *
+ * One pointer pans, two pinch. The rule that matters most is the one that keeps
+ * seat selection intact: a touch that never leaves a small circle around where
+ * it landed is a *tap* and changes nothing, so the `click` that follows still
+ * reaches the seat. A binding feeds `down` / `move` / `up` / `cancel` in
+ * container coordinates and applies what comes back; it never has to know what
+ * a pinch is.
+ */
+/** How far a pointer may travel, in CSS pixels, and still be a tap. */
+export const TAP_SLOP_PX = 8;
+export const IDLE_GESTURE = Object.freeze({
+    ids: [],
+    points: {},
+    origin: null,
+    moved: false,
+});
+export function reduceGesture(state, event, context) {
+    switch (event.type) {
+        case 'down':
+            return onDown(state, event.id, event.point, context);
+        case 'move':
+            return onMove(state, event.id, event.point, context);
+        case 'up':
+        case 'cancel':
+            return onEnd(state, event.id, event.type === 'up', context);
+    }
+}
+function onDown(state, id, point, context) {
+    const ids = state.ids.includes(id) ? state.ids : [...state.ids, id];
+    const points = { ...state.points, [id]: point };
+    // A second finger makes it a pinch at once; there is no tap with two fingers.
+    const moved = state.moved || ids.length > 1;
+    return {
+        // Re-baselined on every change to the pointer set, so nothing jumps.
+        state: { ids, points, origin: { viewport: context.viewport, points }, moved },
+        viewport: context.viewport,
+        capture: moved && !state.moved,
+        suppressClick: false,
+    };
+}
+function onMove(state, id, point, context) {
+    if (!state.ids.includes(id) || !state.origin) {
+        return unchanged(state, context);
+    }
+    const points = { ...state.points, [id]: point };
+    let moved = state.moved;
+    let capture = false;
+    if (!moved) {
+        const slop = context.slop ?? TAP_SLOP_PX;
+        const start = state.origin.points[id] ?? point;
+        if (distance(start, point) <= slop) {
+            return {
+                state: { ...state, points },
+                viewport: context.viewport,
+                capture: false,
+                suppressClick: false,
+            };
+        }
+        moved = true;
+        capture = true;
+    }
+    const next = transformFromOrigin(state, points, context);
+    return {
+        state: { ...state, points, moved },
+        viewport: next,
+        capture,
+        suppressClick: false,
+    };
+}
+function onEnd(state, id, isUp, context) {
+    if (!state.ids.includes(id)) {
+        return unchanged(state, context);
+    }
+    const ids = state.ids.filter((other) => other !== id);
+    const points = { ...state.points };
+    delete points[id];
+    if (ids.length === 0) {
+        return {
+            state: IDLE_GESTURE,
+            viewport: context.viewport,
+            capture: false,
+            // A cancel means the browser took the gesture (a page scroll), and no
+            // click follows it.
+            suppressClick: isUp && state.moved,
+        };
+    }
+    // One finger of a pinch lifted: the other carries on as a pan from here.
+    return {
+        state: {
+            ids,
+            points,
+            origin: { viewport: context.viewport, points },
+            moved: state.moved,
+        },
+        viewport: context.viewport,
+        capture: false,
+        suppressClick: false,
+    };
+}
+/** Pan for one pointer; pan and zoom about the midpoint for two. */
+function transformFromOrigin(state, points, context) {
+    const origin = state.origin;
+    const limits = context.limits ?? zoomLimits();
+    const [first, second] = state.ids;
+    const from = [origin.points[first]];
+    const to = [points[first]];
+    if (second !== undefined) {
+        from.push(origin.points[second]);
+        to.push(points[second]);
+    }
+    const fromCentre = centroid(from);
+    const toCentre = centroid(to);
+    const base = origin.viewport;
+    let zoom = base.zoom;
+    if (from.length === 2) {
+        const fromSpan = distance(from[0], from[1]);
+        if (fromSpan > 0) {
+            zoom = clampZoom(base.zoom * (distance(to[0], to[1]) / fromSpan), limits);
+        }
+    }
+    // The map point that sat under the gesture's start stays under its midpoint.
+    const ratio = zoom / base.zoom;
+    return clampViewport({
+        zoom,
+        x: toCentre.x - (fromCentre.x - base.x) * ratio,
+        y: toCentre.y - (fromCentre.y - base.y) * ratio,
+    }, context.content, context.container, limits);
+}
+function unchanged(state, context) {
+    return { state, viewport: context.viewport, capture: false, suppressClick: false };
+}
+function distance(a, b) {
+    return Math.hypot(a.x - b.x, a.y - b.y);
+}
+function centroid(points) {
+    const sum = points.reduce((acc, p) => ({ x: acc.x + p.x, y: acc.y + p.y }), { x: 0, y: 0 });
+    return { x: sum.x / points.length, y: sum.y / points.length };
+}
+function clampZoom(zoom, limits) {
+    return Math.min(limits.maxZoom, Math.max(limits.minZoom, zoom));
+}
+//# sourceMappingURL=viewport-gesture.js.map

package/dist/view/viewport-gesture.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewport-gesture.js","sourceRoot":"","sources":["../../src/view/viewport-gesture.ts"],"names":[],"mappings":"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"}

package/dist/view/viewport.d.ts

@@ -0,0 +1,144 @@
+/**
+ * The zoom-and-pan model behind a `zoomable` seat map.
+ *
+ * A viewport is a CSS transform applied to the whole map: `translate(x, y)
+ * scale(zoom)` about the map's top-left corner. Everything here is arithmetic on
+ * numbers the caller measured, so it holds no DOM and every function is pure.
+ * The bindings own the measuring and the event listeners; this owns what a
+ * wheel tick, a key press or a pinch *means*.
+ *
+ * Zoom 1 is "fit": the map exactly as it lays out without zooming. It is also
+ * the minimum, so the map can never be shrunk below the container.
+ */
+/** Zoom and pan of the map, as a CSS transform about its top-left corner. */
+export interface KerusiViewport {
+    /** Scale relative to fit. 1 is fit-to-container. */
+    zoom: number;
+    /** Translation in CSS pixels, applied before the scale. */
+    x: number;
+    y: number;
+}
+export interface ViewportPoint {
+    x: number;
+    y: number;
+}
+export interface ViewportSize {
+    width: number;
+    height: number;
+}
+export interface ViewportRect extends ViewportPoint, ViewportSize {
+}
+export interface ViewportLimits {
+    minZoom: number;
+    maxZoom: number;
+}
+/** The map exactly as laid out: no zoom, no pan. */
+export declare const FIT_VIEWPORT: KerusiViewport;
+/** Zoom is relative to fit, so the floor is always 1. */
+export declare const MIN_ZOOM = 1;
+/** The default ceiling: enough to make a seat on a 375px phone comfortably tappable. */
+export declare const DEFAULT_MAX_ZOOM = 4;
+/** What one press of a zoom button or the `+` / `-` key multiplies the zoom by. */
+export declare const ZOOM_STEP = 1.5;
+/** How far an arrow key pans, in CSS pixels. */
+export declare const KEYBOARD_PAN_STEP = 48;
+/** The gap kept between a revealed seat and the container's edge, in CSS pixels. */
+export declare const REVEAL_MARGIN = 16;
+/** Wheel zoom: the exponent per pixel of `deltaY`, so a pinch's small deltas stay smooth. */
+export declare const WHEEL_ZOOM_SENSITIVITY = 0.01;
+/** A single wheel event never moves further than this, so a mouse notch is one step. */
+export declare const WHEEL_MAX_DELTA = 50;
+/** The limits for a given ceiling. A ceiling below fit still leaves fit reachable. */
+export declare function zoomLimits(maxZoom?: number): ViewportLimits;
+/**
+ * Brings a viewport back inside its limits.
+ *
+ * Zoom is clamped to the limits. Pan is clamped so the scaled map never leaves
+ * the container, and on an axis where the scaled map is *smaller* than the
+ * container (a maximized map on a large screen) it is centred instead.
+ */
+export declare function clampViewport(viewport: KerusiViewport, content: ViewportSize, container: ViewportSize, limits?: ViewportLimits): KerusiViewport;
+/** Fit, centred where the map is smaller than its container. */
+export declare function fitViewport(content: ViewportSize, container: ViewportSize, limits?: ViewportLimits): KerusiViewport;
+/**
+ * Zooms to an absolute level, keeping the map point under `anchor` where it is.
+ * `anchor` is in container coordinates — the pointer, the midpoint of a pinch,
+ * or the container's centre for a button.
+ */
+export declare function zoomViewportTo(viewport: KerusiViewport, zoom: number, anchor: ViewportPoint, content: ViewportSize, container: ViewportSize, limits?: ViewportLimits): KerusiViewport;
+/** Zooms by a factor about `anchor`. See {@link zoomViewportTo}. */
+export declare function zoomViewportBy(viewport: KerusiViewport, factor: number, anchor: ViewportPoint, content: ViewportSize, container: ViewportSize, limits?: ViewportLimits): KerusiViewport;
+/** One zoom-button step about the container's centre: `1` in, `-1` out. */
+export declare function stepViewport(viewport: KerusiViewport, direction: 1 | -1, content: ViewportSize, container: ViewportSize, limits?: ViewportLimits): KerusiViewport;
+/** Pans by a delta in CSS pixels, held inside the map's bounds. */
+export declare function panViewportBy(viewport: KerusiViewport, dx: number, dy: number, content: ViewportSize, container: ViewportSize, limits?: ViewportLimits): KerusiViewport;
+/**
+ * Pans just far enough to bring `rect` inside the container, with a margin.
+ *
+ * `rect` is where the thing is on screen *now*, in container coordinates — a
+ * seat's bounding box minus the container's. Measuring the result of the
+ * current transform, rather than computing a position from the layout, is what
+ * keeps this correct whatever the section widths and unit scale are. A rect
+ * bigger than the container is aligned by its leading edge.
+ */
+export declare function revealRect(viewport: KerusiViewport, rect: ViewportRect, content: ViewportSize, container: ViewportSize, margin?: number, limits?: ViewportLimits): KerusiViewport;
+/**
+ * The zoom factor a wheel event asks for, or `null` if it is not a zoom
+ * gesture.
+ *
+ * Only Ctrl/Cmd + wheel zooms. Browsers report a trackpad pinch as a wheel
+ * event with `ctrlKey` set, so one rule covers both. A plain wheel returns
+ * `null`, which is the cue for a binding to leave it alone so the page still
+ * scrolls — and only a non-null result should be `preventDefault`ed.
+ */
+export declare function wheelZoomFactor(event: {
+    deltaY: number;
+    deltaMode?: number;
+    ctrlKey: boolean;
+    metaKey: boolean;
+}): number | null;
+/** The keys {@link keyboardViewport} understands, for a binding's own filtering. */
+export interface ViewportKeyInput {
+    key: string;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    altKey?: boolean;
+    /**
+     * Whether the viewport itself, rather than a seat inside it, has focus.
+     * Arrow keys pan only then: on a seat they keep moving seat focus.
+     */
+    viewportFocused?: boolean;
+}
+/**
+ * What a key press does to the viewport, or `null` if it does nothing.
+ *
+ * `+` / `=` zoom in, `-` zoom out, `0` resets to fit, and — only when the
+ * viewport itself has focus — the arrow keys pan. Ctrl, Cmd and Alt
+ * combinations are the browser's own zoom shortcuts and are left alone.
+ */
+export declare function keyboardViewport(viewport: KerusiViewport, input: ViewportKeyInput, content: ViewportSize, container: ViewportSize, limits?: ViewportLimits): KerusiViewport | null;
+/**
+ * Whether a key event came from somewhere text is typed.
+ *
+ * A host can put its own controls inside the map, and `+`, `-` and `0` are
+ * characters before they are shortcuts. Takes the target structurally so core
+ * never has to name a DOM type.
+ */
+export declare function isTextEntryTarget(target: {
+    tagName?: string;
+    isContentEditable?: boolean;
+} | null | undefined): boolean;
+/** Whether two viewports are the same view, ignoring sub-pixel noise. */
+export declare function viewportsEqual(a: KerusiViewport, b: KerusiViewport): boolean;
+/** The CSS `transform` for a viewport. Apply with `transform-origin: 0 0`. */
+export declare function viewportTransform(viewport: KerusiViewport): string;
+/**
+ * The `touch-action` a zoomable map sets on its viewport.
+ *
+ * At fit there is nothing to pan, so a one-finger vertical swipe stays the
+ * page's: `pan-y` leaves vertical scrolling to the browser while still handing
+ * us pinch. Once zoomed in, one finger means pan, and a maximized map covers
+ * the page, so both take every gesture with `none`.
+ */
+export declare function viewportTouchAction(viewport: KerusiViewport, maximized: boolean): string;
+//# sourceMappingURL=viewport.d.ts.map

package/dist/view/viewport.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewport.d.ts","sourceRoot":"","sources":["../../src/view/viewport.ts"],"names":[],"mappings":"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"}