1681-engine 0.0.0-stage → 0.5.9

package/dist/types/ui/layout/placeTooltip.d.ts

@@ -0,0 +1,23 @@
+import { type Point, type Rect, type Size } from './geometry.js';
+export type TipSide = 'below' | 'above' | 'right' | 'left';
+export interface TooltipOptions {
+    /** The side tried first (default 'below'); the opposite one when it does not fit. */
+    side?: TipSide;
+    /** Between the anchor and the tip (default 4). */
+    gap?: number;
+    /** Kept clear of the screen's edges (default 4). */
+    margin?: number;
+    /** Across the side: line up with the anchor's start or centre on it (default 'start'). */
+    align?: 'start' | 'center';
+    snap?: boolean;
+}
+export interface TooltipPlacement extends Point {
+    /** The side it went on after flipping. */
+    side: TipSide;
+}
+/**
+ * Where a tooltip of `tip` size goes beside `anchor`: on the preferred side when it fits, flipped to the opposite one
+ * when it does not, the roomier of the two when neither does; then slid along the edge to stay on screen.
+ */
+export declare function placeTooltip(anchor: Rect, tip: Size, viewport: Size, options?: TooltipOptions): TooltipPlacement;
+//# sourceMappingURL=placeTooltip.d.ts.map

package/dist/types/ui/layout/placeTooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"placeTooltip.d.ts","sourceRoot":"","sources":["../../../../src/ui/layout/placeTooltip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,KAAK,EAAE,KAAK,IAAI,EAAE,KAAK,IAAI,EAAE,MAAM,YAAY,CAAC;AAE7E,MAAM,MAAM,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AAE3D,MAAM,WAAW,cAAc;IAC7B,qFAAqF;IACrF,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,kDAAkD;IAClD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,0FAA0F;IAC1F,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,gBAAiB,SAAQ,KAAK;IAC7C,0CAA0C;IAC1C,IAAI,EAAE,OAAO,CAAC;CACf;AAkBD;;;GAGG;AACH,wBAAgB,YAAY,CAAC,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,GAAE,cAAmB,GAAG,gBAAgB,CAwBpH"}

package/dist/types/ui/layout/scroll.d.ts

@@ -0,0 +1,17 @@
+/** How far content of `content` length can scroll in a window of `viewport` length. */
+export declare function maxScroll(content: number, viewport: number): number;
+/** A scroll offset kept between the top and the last full window of content. */
+export declare function clampScroll(offset: number, content: number, viewport: number): number;
+/**
+ * The smallest scroll that brings an item (`start`, `size` along the scroll axis) fully into view: a list moved by
+ * the keyboard follows the focus without jumping when the focus is already visible.
+ */
+export declare function scrollIntoView(offset: number, start: number, size: number, viewport: number, content: number): number;
+/** Below this speed (px a second) a fling has stopped. */
+export declare const FLING_STOP = 8;
+/**
+ * A fling's speed after `dtMs`, losing `friction` of it every 60th of a second: the same glide at any frame rate.
+ * 0 once it falls under `FLING_STOP`.
+ */
+export declare function stepFling(velocity: number, dtMs: number, friction?: number): number;
+//# sourceMappingURL=scroll.d.ts.map

package/dist/types/ui/layout/scroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll.d.ts","sourceRoot":"","sources":["../../../../src/ui/layout/scroll.ts"],"names":[],"mappings":"AAEA,uFAAuF;AACvF,wBAAgB,SAAS,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAEnE;AAED,gFAAgF;AAChF,wBAAgB,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAErF;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAKrH;AAED,0DAA0D;AAC1D,eAAO,MAAM,UAAU,IAAI,CAAC;AAE5B;;;GAGG;AACH,wBAAgB,SAAS,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,SAAO,GAAG,MAAM,CAGjF"}

package/dist/types/ui/layout/slider.d.ts

@@ -0,0 +1,7 @@
+/** A value held to the range and to the nearest `step` above `min` (no step: any value). */
+export declare function quantize(value: number, min: number, max: number, step?: number): number;
+/** Where `value` sits along the range, 0–1. */
+export declare function sliderFraction(value: number, min: number, max: number): number;
+/** The value under a pointer at `px` on a track starting at `trackStart`, `trackLength` long. */
+export declare function sliderValueAt(px: number, trackStart: number, trackLength: number, min: number, max: number, step?: number): number;
+//# sourceMappingURL=slider.d.ts.map

package/dist/types/ui/layout/slider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../../src/ui/layout/slider.ts"],"names":[],"mappings":"AAEA,4FAA4F;AAC5F,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,SAAI,GAAG,MAAM,CAMlF;AAED,+CAA+C;AAC/C,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAE9E;AAED,iGAAiG;AACjG,wBAAgB,aAAa,CAAC,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,SAAI,GAAG,MAAM,CAG7H"}

package/dist/types/ui/layout/stack.d.ts

@@ -0,0 +1,26 @@
+import { type Insets, type Rect, type Size } from './geometry.js';
+export type StackDirection = 'vertical' | 'horizontal';
+/** Where items sit across the stack: its start, middle or end, or stretched to the widest (tallest) one. */
+export type StackAlign = 'start' | 'center' | 'end' | 'stretch';
+export interface StackOptions {
+    direction?: StackDirection;
+    /** Between two items (default 0). */
+    gap?: number;
+    /** Inside the stack's edge (default 0). */
+    padding?: number | Partial<Insets>;
+    align?: StackAlign;
+    /** A cross size to align in instead of the widest item's (a column as wide as its window). */
+    crossSize?: number;
+    /** Whole pixels (pixel-perfect UI). */
+    snap?: boolean;
+}
+export interface StackResult extends Size {
+    /** One rect per item, in the order given, relative to the stack's top-left. */
+    items: Rect[];
+}
+/**
+ * Lays items one after another down (or across) with a gap, inside padding. The stack's size is what the items
+ * need, so a parent can lay the stack out in turn. Pure, for canvas widgets and DOM/React layouts alike.
+ */
+export declare function stackLayout(sizes: readonly Size[], options?: StackOptions): StackResult;
+//# sourceMappingURL=stack.d.ts.map

package/dist/types/ui/layout/stack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack.d.ts","sourceRoot":"","sources":["../../../../src/ui/layout/stack.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,MAAM,EAAE,KAAK,IAAI,EAAE,KAAK,IAAI,EAAE,MAAM,YAAY,CAAC;AAE/E,MAAM,MAAM,cAAc,GAAG,UAAU,GAAG,YAAY,CAAC;AACvD,4GAA4G;AAC5G,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;AAEhE,MAAM,WAAW,YAAY;IAC3B,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,qCAAqC;IACrC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,2CAA2C;IAC3C,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;IACnC,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,8FAA8F;IAC9F,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uCAAuC;IACvC,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,WAAY,SAAQ,IAAI;IACvC,+EAA+E;IAC/E,KAAK,EAAE,IAAI,EAAE,CAAC;CACf;AAED;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,SAAS,IAAI,EAAE,EAAE,OAAO,GAAE,YAAiB,GAAG,WAAW,CAkC3F"}

package/dist/types/ui/layout/wrapRow.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Breaks a row of items (tabs, chips, buttons) into lines no wider than `maxWidth`: each line holds the indices of
+ * its items in order. An item wider than the line still gets a line of its own rather than being dropped.
+ */
+export declare function wrapRow(widths: readonly number[], maxWidth: number, gap?: number): number[][];
+//# sourceMappingURL=wrapRow.d.ts.map

package/dist/types/ui/layout/wrapRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"wrapRow.d.ts","sourceRoot":"","sources":["../../../../src/ui/layout/wrapRow.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,wBAAgB,OAAO,CAAC,MAAM,EAAE,SAAS,MAAM,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,SAAI,GAAG,MAAM,EAAE,EAAE,CAkBxF"}

package/dist/types/ui/rich/RichText.d.ts

@@ -0,0 +1,48 @@
+import { type DestroyOptions } from 'pixi.js';
+import type { TextureRegistry } from '../../core/TextureRegistry.js';
+import { Widget } from '../Widget.js';
+import type { RichFont } from './richFonts.js';
+import { type RichAlign, type RichLayout, type RichLayoutOptions } from './richLayout.js';
+import { type RichMarkupOptions } from './richMarkup.js';
+export interface RichTextOptions extends RichLayoutOptions, RichMarkupOptions {
+    /** What the runs are drawn with: `CanvasRichFont`, `BitmapRichFont`, or a game's own. */
+    font: RichFont;
+    /** Where `[icon=…]` keys are looked up; without it icons take no room and draw nothing. */
+    textures?: TextureRegistry;
+}
+/**
+ * Text with inline markup — colour, bold, italic, size and icons (see `parseRichText`) — wrapped to a width and
+ * aligned. A `Widget`, so it stacks and pins like a `Label`, and a plain Pixi container in the world too.
+ *
+ * It does its work only when the text or the layout options change: no per-frame cost. Its runs and icons are kept
+ * and reused when the text changes, so a log line rewritten keeps its display objects. Under a pixel-perfect UI root
+ * (or with `pixelPerfect`) every run and icon lands on a whole pixel and icons scale by whole multiples.
+ */
+export declare class RichText extends Widget {
+    private source;
+    private last;
+    private readonly runs;
+    private readonly icons;
+    private readonly measure;
+    private readonly options;
+    /** Whether the last layout was on whole pixels. */
+    private snapped;
+    constructor(markup: string, options: RichTextOptions);
+    /** The markup shown. */
+    get markup(): string;
+    /** Where every line, run and icon was placed, for hit-testing a word or drawing behind one. */
+    get layout(): RichLayout;
+    /** Changes the text; the same markup again costs nothing. */
+    setText(markup: string): this;
+    /** Wraps to a new width (undefined: only at `\n`). */
+    setWrapWidth(width: number | undefined): this;
+    setAlign(align: RichAlign): this;
+    /** Lays out and draws again: after the font's colours or the icons' textures were swapped under it. */
+    relayout(): void;
+    destroy(options?: DestroyOptions): void;
+    protected redraw(): void;
+    private pixelPerfect;
+    private addRun;
+    private addIcon;
+}
+//# sourceMappingURL=RichText.d.ts.map

package/dist/types/ui/rich/RichText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RichText.d.ts","sourceRoot":"","sources":["../../../../src/ui/rich/RichText.ts"],"names":[],"mappings":"AAAA,OAAO,EAA0B,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AACtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACnC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAkB,KAAK,SAAS,EAAE,KAAK,UAAU,EAAE,KAAK,iBAAiB,EAAoB,MAAM,cAAc,CAAC;AACzH,OAAO,EAAiB,KAAK,iBAAiB,EAAkB,MAAM,cAAc,CAAC;AAErF,MAAM,WAAW,eAAgB,SAAQ,iBAAiB,EAAE,iBAAiB;IAC3E,yFAAyF;IACzF,IAAI,EAAE,QAAQ,CAAC;IACf,2FAA2F;IAC3F,QAAQ,CAAC,EAAE,eAAe,CAAC;CAC5B;AAED;;;;;;;GAOG;AACH,qBAAa,QAAS,SAAQ,MAAM;IAClC,OAAO,CAAC,MAAM,CAAM;IACpB,OAAO,CAAC,IAAI,CAAkD;IAC9D,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAmB;IACxC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAgB;IACtC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAc;IACtC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAkB;IAC1C,mDAAmD;IACnD,OAAO,CAAC,OAAO,CAAS;gBAEZ,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe;IAmBpD,wBAAwB;IACxB,IAAI,MAAM,IAAI,MAAM,CAEnB;IAED,+FAA+F;IAC/F,IAAI,MAAM,IAAI,UAAU,CAEvB;IAED,6DAA6D;IAC7D,OAAO,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI;IAO7B,sDAAsD;IACtD,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI;IAQ7C,QAAQ,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI;IAOhC,uGAAuG;IACvG,QAAQ,IAAI,IAAI;IAoCP,OAAO,CAAC,OAAO,CAAC,EAAE,cAAc,GAAG,IAAI;IAKhD,SAAS,CAAC,MAAM,IAAI,IAAI;IAIxB,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,MAAM;IAOd,OAAO,CAAC,OAAO;CAOhB"}

package/dist/types/ui/rich/richFonts.d.ts

@@ -0,0 +1,70 @@
+import { type Container } from 'pixi.js';
+import type { RichMeasure } from './richLayout.js';
+import type { RichStyle } from './richMarkup.js';
+/**
+ * What `RichText` draws its runs with: it measures text for the layout and makes and updates one display object a
+ * run. Two come with the engine — `CanvasRichFont` (any font, bold and italic) and `BitmapRichFont` (glyphs baked
+ * once, cheap to change) — and a game may write its own.
+ */
+export interface RichFont extends Omit<RichMeasure, 'iconSize'> {
+    /** A fresh, empty run. */
+    createRun(): Container;
+    /** Shows `text` in `style` on a run made by `createRun`; cheap when neither changed. */
+    updateRun(run: Container, text: string, style: RichStyle): void;
+}
+export interface RichFontOptions {
+    /** Must already be loaded (`document.fonts.load`), or the text measures and bakes in the fallback. */
+    fontFamily: string;
+    /** The size of text with no `[size]`. */
+    fontSize: number;
+    /** The colour of text with no `[color]`. */
+    color?: string;
+    stroke?: string;
+    strokeWidth?: number;
+    /** Texture pixels per pixel: text in the world is zoomed by the camera, so it is rasterised finer. */
+    resolution?: number;
+}
+/**
+ * Runs as canvas `Text`: any font the page has, with bold and italic. Every style used gets one Pixi `TextStyle`,
+ * shared by every run in it. Changing a run's text repaints and uploads its canvas, so text rewritten every frame
+ * belongs in a `BitmapRichFont`.
+ */
+export declare class CanvasRichFont implements RichFont {
+    private readonly options;
+    private readonly styles;
+    private readonly metrics;
+    constructor(options: RichFontOptions);
+    textWidth(text: string, style: RichStyle): number;
+    lineHeight(style: RichStyle): number;
+    ascent(style: RichStyle): number;
+    createRun(): Container;
+    updateRun(run: Container, text: string, style: RichStyle): void;
+    private metricsOf;
+    private pixiStyle;
+}
+export interface BitmapRichFontOptions extends RichFontOptions {
+    /** Letters beyond ASCII the text prints (see `installLabelFont`). */
+    glyphs?: string;
+}
+/**
+ * Runs as `BitmapText` from label fonts (`installLabelFont`): changing the text costs no canvas and no upload, and the
+ * runs batch. Each colour × size is a font of its own, baked the first time it is used — keep to a few and print each
+ * once while loading, or the first line to use one bakes it on that frame. Bitmap fonts have no bold or italic: those
+ * tags change nothing here.
+ */
+export declare class BitmapRichFont implements RichFont {
+    private readonly options;
+    private readonly styles;
+    private readonly metrics;
+    constructor(options: BitmapRichFontOptions);
+    textWidth(text: string, style: RichStyle): number;
+    lineHeight(style: RichStyle): number;
+    ascent(style: RichStyle): number;
+    createRun(): Container;
+    updateRun(run: Container, text: string, style: RichStyle): void;
+    private metricsOf;
+    /** Bold and italic do not reach a bitmap font: styles differing only by them share one. */
+    private fontKey;
+    private pixiStyle;
+}
+//# sourceMappingURL=richFonts.d.ts.map

package/dist/types/ui/rich/richFonts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"richFonts.d.ts","sourceRoot":"","sources":["../../../../src/ui/rich/richFonts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqE,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AAE5G,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C;;;;GAIG;AACH,MAAM,WAAW,QAAS,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC;IAC7D,0BAA0B;IAC1B,SAAS,IAAI,SAAS,CAAC;IACvB,wFAAwF;IACxF,SAAS,CAAC,GAAG,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,GAAG,IAAI,CAAC;CACjE;AAED,MAAM,WAAW,eAAe;IAC9B,sGAAsG;IACtG,UAAU,EAAE,MAAM,CAAC;IACnB,yCAAyC;IACzC,QAAQ,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sGAAsG;IACtG,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAWD;;;;GAIG;AACH,qBAAa,cAAe,YAAW,QAAQ;IAIjC,OAAO,CAAC,QAAQ,CAAC,OAAO;IAHpC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAgC;IACvD,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA8B;gBAEzB,OAAO,EAAE,eAAe;IAErD,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,GAAG,MAAM;IAKjD,UAAU,CAAC,KAAK,EAAE,SAAS,GAAG,MAAM;IAIpC,MAAM,CAAC,KAAK,EAAE,SAAS,GAAG,MAAM;IAIhC,SAAS,IAAI,SAAS;IAItB,SAAS,CAAC,GAAG,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,GAAG,IAAI;IAO/D,OAAO,CAAC,SAAS;IAWjB,OAAO,CAAC,SAAS;CAiBlB;AAED,MAAM,WAAW,qBAAsB,SAAQ,eAAe;IAC5D,qEAAqE;IACrE,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;GAKG;AACH,qBAAa,cAAe,YAAW,QAAQ;IAIjC,OAAO,CAAC,QAAQ,CAAC,OAAO;IAHpC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAgC;IACvD,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA8B;gBAEzB,OAAO,EAAE,qBAAqB;IAE3D,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,GAAG,MAAM;IAKjD,UAAU,CAAC,KAAK,EAAE,SAAS,GAAG,MAAM;IAIpC,MAAM,CAAC,KAAK,EAAE,SAAS,GAAG,MAAM;IAIhC,SAAS,IAAI,SAAS;IAItB,SAAS,CAAC,GAAG,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,GAAG,IAAI;IAO/D,OAAO,CAAC,SAAS;IAajB,2FAA2F;IAC3F,OAAO,CAAC,OAAO;IAIf,OAAO,CAAC,SAAS;CAYlB"}

package/dist/types/ui/rich/richLayout.d.ts

@@ -0,0 +1,76 @@
+import type { RichSpan, RichStyle } from './richMarkup.js';
+/**
+ * Line breaking and placement for `RichText`, pure: every width and height comes from a `RichMeasure` the caller
+ * hands in, so the same layout runs under node in a test, with a canvas font, or with a bitmap font.
+ *
+ * Lines break only at spaces and `\n`; a word wider than the whole line is broken between letters. Text and icons
+ * with no space between them (`[icon=coin]50`) stay together. Text of one style that ends up side by side on a line
+ * is one item, so a paragraph in one colour costs one display object a line.
+ */
+export interface RichMeasure {
+    /** Advance width of `text` in `style` (spaces included: they are measured on their own). */
+    textWidth(text: string, style: RichStyle): number;
+    /** Height of a line of text in `style`. */
+    lineHeight(style: RichStyle): number;
+    /** Baseline from the top of such a line; 0.8 of the line height when not given. */
+    ascent?(style: RichStyle): number;
+    /** Size of an icon's frame in texture pixels. */
+    iconSize(key: string, frame: string | undefined): {
+        width: number;
+        height: number;
+    };
+}
+export type RichAlign = 'left' | 'center' | 'right';
+export interface RichLayoutOptions {
+    /** Wrap lines to this width; unset, lines break only at `\n`. */
+    wrapWidth?: number;
+    align?: RichAlign;
+    /** Extra pixels between lines. */
+    lineSpacing?: number;
+    /**
+     * `'line'` (default): an icon is as tall as its style's line — on a pixel-perfect layout the largest whole multiple
+     * of its frame that fits, never below 1×, so its texels stay square. A number: that scale, whatever the line.
+     */
+    iconScale?: 'line' | number;
+    /** Whole-pixel positions and icon scales (a pixel-art game). */
+    pixelPerfect?: boolean;
+}
+export interface RichTextItem {
+    kind: 'text';
+    text: string;
+    style: RichStyle;
+    x: number;
+    /** Top of the text's own line box. */
+    y: number;
+    width: number;
+    height: number;
+}
+export interface RichIconItem {
+    kind: 'icon';
+    key: string;
+    frame?: string;
+    style: RichStyle;
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+export type RichItem = RichTextItem | RichIconItem;
+export interface RichLine {
+    y: number;
+    width: number;
+    height: number;
+    /** Baseline from the line's top. */
+    baseline: number;
+    items: RichItem[];
+}
+export interface RichLayout {
+    /** The box: `wrapWidth` when wrapping, else the widest line. */
+    width: number;
+    height: number;
+    lines: RichLine[];
+}
+/** Breaks spans into lines and places every run and icon. */
+export declare function layoutRichText(spans: readonly RichSpan[], measure: RichMeasure, options?: RichLayoutOptions): RichLayout;
+export declare function sameStyle(a: RichStyle, b: RichStyle): boolean;
+//# sourceMappingURL=richLayout.d.ts.map

package/dist/types/ui/rich/richLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"richLayout.d.ts","sourceRoot":"","sources":["../../../../src/ui/rich/richLayout.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAExD;;;;;;;GAOG;AAEH,MAAM,WAAW,WAAW;IAC1B,4FAA4F;IAC5F,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,GAAG,MAAM,CAAC;IAClD,2CAA2C;IAC3C,UAAU,CAAC,KAAK,EAAE,SAAS,GAAG,MAAM,CAAC;IACrC,mFAAmF;IACnF,MAAM,CAAC,CAAC,KAAK,EAAE,SAAS,GAAG,MAAM,CAAC;IAClC,iDAAiD;IACjD,QAAQ,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;CACrF;AAED,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEpD,MAAM,WAAW,iBAAiB;IAChC,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kCAAkC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,gEAAgE;IAChE,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,SAAS,CAAC;IACjB,CAAC,EAAE,MAAM,CAAC;IACV,sCAAsC;IACtC,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,SAAS,CAAC;IACjB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,YAAY,CAAC;AAEnD,MAAM,WAAW,QAAQ;IACvB,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,oCAAoC;IACpC,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,QAAQ,EAAE,CAAC;CACnB;AAED,MAAM,WAAW,UAAU;IACzB,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,QAAQ,EAAE,CAAC;CACnB;AAaD,6DAA6D;AAC7D,wBAAgB,cAAc,CAAC,KAAK,EAAE,SAAS,QAAQ,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE,OAAO,GAAE,iBAAsB,GAAG,UAAU,CA+D5H;AA4HD,wBAAgB,SAAS,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,GAAG,OAAO,CAE7D"}

package/dist/types/ui/rich/richMarkup.d.ts

@@ -0,0 +1,48 @@
+/**
+ * The markup `RichText` reads: square-bracket tags, like BBCode, chosen because a translator can type them, a chat
+ * line can carry them, and nothing in ordinary prose looks like one.
+ *
+ * | Markup | Means |
+ * |---|---|
+ * | `[color=#f0c060]…[/color]` | colour: `#rgb`, `#rrggbb`, or a name the caller defines (`colors: { gold: '#f0c060' }`) |
+ * | `[b]…[/b]`, `[i]…[/i]` | bold, italic (where the font has them) |
+ * | `[size=16]…[/size]` | font size in pixels |
+ * | `[icon=coin]`, `[icon=items:12]` | an inline icon: a texture key, and after the last `:` a frame of it |
+ * | `[[` | a literal `[` |
+ *
+ * Anything else in brackets — an unknown tag, a bad value, a close with nothing open — is printed as written, so a
+ * typo shows on screen instead of swallowing the text after it. Tags still open at the end are closed there; closing
+ * an outer tag closes the ones opened inside it. Text from players (names, chat) goes through `escapeRichText` first.
+ * Pure: no Pixi, no DOM.
+ */
+/** How a run of text is drawn. Unset fields fall back to the font's own. */
+export interface RichStyle {
+    color?: string;
+    bold: boolean;
+    italic: boolean;
+    size?: number;
+}
+export interface RichTextSpan {
+    kind: 'text';
+    text: string;
+    style: RichStyle;
+}
+export interface RichIconSpan {
+    kind: 'icon';
+    key: string;
+    frame?: string;
+    /** The style around it: its size decides the icon's height. */
+    style: RichStyle;
+}
+export type RichSpan = RichTextSpan | RichIconSpan;
+export interface RichMarkupOptions {
+    /** Colour names the markup may use besides hex (`[color=gold]`). */
+    colors?: Readonly<Record<string, string>>;
+}
+/** Makes text safe to put inside markup: every `[` doubled, so a player named `[b]` prints as typed. */
+export declare function escapeRichText(text: string): string;
+/** Parses markup into spans; adjacent text of one style is one span. */
+export declare function parseRichText(source: string, options?: RichMarkupOptions): RichSpan[];
+/** Plain text of markup: tags gone, icons gone, escapes undone (for measuring, logs, screen readers). */
+export declare function stripRichText(source: string, options?: RichMarkupOptions): string;
+//# sourceMappingURL=richMarkup.d.ts.map

package/dist/types/ui/rich/richMarkup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"richMarkup.d.ts","sourceRoot":"","sources":["../../../../src/ui/rich/richMarkup.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,4EAA4E;AAC5E,MAAM,WAAW,SAAS;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+DAA+D;IAC/D,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,YAAY,CAAC;AAEnD,MAAM,WAAW,iBAAiB;IAChC,oEAAoE;IACpE,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;CAC3C;AAMD,wGAAwG;AACxG,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAEnD;AAED,wEAAwE;AACxE,wBAAgB,aAAa,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,GAAE,iBAAsB,GAAG,QAAQ,EAAE,CAwCzF;AAED,yGAAyG;AACzG,wBAAgB,aAAa,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,GAAE,iBAAsB,GAAG,MAAM,CAIrF"}

package/dist/ui/Bar.js

@@ -0,0 +1,53 @@
+import { Sprite as n, Texture as o } from "pixi.js";
+import { drainState as c, setDrainValue as u, stepDrain as f } from "./layout/barDrain.js";
+import { Widget as d } from "./Widget.js";
+function h(e, t) {
+  const i = new n(o.WHITE);
+  return i.tint = e, i.alpha = t, i;
+}
+function a(e, t, i) {
+  return i ? Math.round(e * t) : e * t;
+}
+class v extends d {
+  constructor(t) {
+    super(), this.options = t, this.state = c(t.value ?? 1), this.back = h(t.backColor ?? 0, t.backAlpha ?? 0.5), this.trail = h(t.trailColor ?? 16777215, t.trailAlpha ?? 0.6), this.fill = h(t.color, 1), this.addChild(this.back, this.trail, this.fill), this.resize(t.width, t.height);
+  }
+  options;
+  state;
+  back;
+  trail;
+  fill;
+  ticking = !1;
+  get value() {
+    return this.state.value;
+  }
+  /** The trail's length (what was held before the last losses), 0–1. */
+  get trailValue() {
+    return this.state.trail;
+  }
+  /** Sets the bar, 0–1; `instant` drops the trail with it (a respawn, a new target). */
+  setValue(t, i = !1) {
+    if (t === this.state.value && !i) return this;
+    if (u(this.state, t, this.options), i && (this.state.trail = this.state.value), this.redraw(), this.state.trail > this.state.value && !this.ticking) {
+      const s = this.host;
+      s && (this.ticking = !0, s.animate(this));
+    }
+    return this;
+  }
+  /** Advances the drain; a bar under a `UiRoot` is ticked for you, one standing alone is ticked by the game. */
+  tick(t) {
+    return this.destroyed ? this.ticking = !1 : (f(this.state, t, this.options), this.redraw(), this.ticking = this.state.trail > this.state.value, this.ticking);
+  }
+  redraw() {
+    const t = this.boxW, i = this.boxH, s = this.host?.pixelPerfect ?? !1;
+    if (this.back.setSize(t, i), this.options.vertical) {
+      const r = a(this.state.trail, i, s), l = a(this.state.value, i, s);
+      this.trail.setSize(t, r), this.trail.position.set(0, i - r), this.fill.setSize(t, l), this.fill.position.set(0, i - l);
+    } else
+      this.trail.setSize(a(this.state.trail, t, s), i), this.fill.setSize(a(this.state.value, t, s), i);
+    this.alpha = this.enabled ? 1 : 0.5;
+  }
+}
+export {
+  v as Bar
+};

package/dist/ui/Button.js

@@ -0,0 +1,57 @@
+import { Rectangle as c } from "pixi.js";
+import { Panel as f } from "./Panel.js";
+import { Widget as d, sizeOf as l } from "./Widget.js";
+function u(o) {
+  for (let t = o; t; t = t.parent) if (t.suppressesTaps === !0) return !0;
+  return !1;
+}
+class v extends d {
+  constructor(t) {
+    super(), this.options = t, this.focusable = !0, this.onClick = t.onClick ?? null;
+    const s = t.skin;
+    for (const i of [s.normal, s.hover, s.pressed, s.disabled])
+      if (i && !this.faces.has(i)) {
+        const e = new f(i, t.width, t.height, { blocksPointer: !1 });
+        this.faces.set(i, e), this.addChild(e);
+      }
+    this.focusFace = s.focus ? new f(s.focus, t.width, t.height, { blocksPointer: !1 }) : null, this.focusFace && this.addChild(this.focusFace), this.content = t.content ?? null, this.content && this.addChild(this.content), this.makeInteractive(), this.cursor = "pointer", this.hitArea = new c(0, 0, 0, 0), this.on("pointerover", () => this.setPointer(!0, this.pressing)), this.on("pointerout", () => this.setPointer(!1, this.pressing)), this.on("pointerdown", () => this.setPointer(this.hovered, !0)), this.on("pointerup", () => this.setPointer(this.hovered, !1)), this.on("pointerupoutside", () => this.setPointer(!1, !1)), this.on("pointercancel", () => this.setPointer(!1, !1)), this.on("pointertap", () => {
+      u(this) || this.click();
+    }), this.resize(t.width, t.height);
+  }
+  options;
+  onClick;
+  faces = /* @__PURE__ */ new Map();
+  focusFace;
+  content;
+  hovered = !1;
+  pressing = !1;
+  get state() {
+    return this.enabled ? this.pressing ? "pressed" : this.hovered ? "hover" : "normal" : "disabled";
+  }
+  /** Runs the button's action, if it is enabled. */
+  click() {
+    this.enabled && this.onClick?.();
+  }
+  activate() {
+    this.click();
+  }
+  childResized(t) {
+    t === this.content && this.redraw();
+  }
+  setPointer(t, s) {
+    t === this.hovered && s === this.pressing || (this.hovered = t, this.pressing = s, this.redraw());
+  }
+  redraw() {
+    const t = this.options.skin, s = this.state, i = (s === "disabled" ? t.disabled : s === "pressed" ? t.pressed ?? t.hover : s === "hover" ? t.hover : void 0) ?? t.normal;
+    for (const [e, h] of this.faces)
+      h.visible = e === i, (h.boxWidth !== this.boxW || h.boxHeight !== this.boxH) && h.resize(this.boxW, this.boxH);
+    if (this.focusFace && (this.focusFace.visible = this.focused && this.enabled, (this.focusFace.boxWidth !== this.boxW || this.focusFace.boxHeight !== this.boxH) && this.focusFace.resize(this.boxW, this.boxH)), this.hitArea instanceof c && (this.hitArea.width = this.boxW, this.hitArea.height = this.boxH), this.content) {
+      const e = l(this.content), h = s === "pressed" ? t.pressOffset ?? 1 : 0, n = this.host?.pixelPerfect ?? !1, r = (this.boxW - e.width) / 2, a = (this.boxH - e.height) / 2 + h;
+      this.content.position.set(n ? Math.round(r) : r, n ? Math.round(a) : a);
+    }
+    this.alpha = s === "disabled" && !t.disabled ? 0.5 : 1;
+  }
+}
+export {
+  v as Button
+};

package/dist/ui/Dialog.js

@@ -0,0 +1,55 @@
+import { Sprite as d, Texture as a, Container as l, Rectangle as m } from "pixi.js";
+import { fitToViewport as c } from "./layout/fitToViewport.js";
+import { Panel as w } from "./Panel.js";
+import { Widget as p, sizeOf as n } from "./Widget.js";
+class H extends p {
+  constructor(t) {
+    super(), this.options = t, this.onClose = t.onClose ?? null, this.dim.tint = t.dimColor ?? 0, this.dim.alpha = t.dimAlpha ?? 0.5, this.dim.eventMode = "static", this.dim.on("pointertap", () => {
+      (t.dismissable ?? !0) && this.close();
+    });
+    const i = this.windowHeight();
+    this.frame = new w(t.frame, t.width, i), this.window.addChild(this.frame, t.content), this.addChild(this.dim, this.window), this.makeInteractive(), this.boxW = t.width, this.boxH = i;
+  }
+  options;
+  onClose;
+  dim = new d(a.WHITE);
+  window = new l();
+  frame;
+  root = null;
+  /** The window's height: the one given, or the content's with its padding. */
+  windowHeight() {
+    return this.options.height !== void 0 ? this.options.height : n(this.options.content).height + 2 * (this.options.padding ?? 8);
+  }
+  get isOpen() {
+    return this.root !== null;
+  }
+  open(t) {
+    return this.root ? this : (this.root = t, t.openModal(this), this);
+  }
+  close() {
+    const t = this.root;
+    t && (this.root = null, t.closeModal(this), this.onClose?.());
+  }
+  cancel() {
+    return this.options.dismissable ?? !0 ? (this.close(), !0) : !1;
+  }
+  layoutFor(t) {
+    this.dim.setSize(t.width, t.height), this.hitArea = new m(0, 0, t.width, t.height);
+    const i = this.host?.pixelPerfect ?? !1, o = this.windowHeight();
+    this.boxH = o;
+    const s = c({ width: this.options.width, height: o }, t, {
+      margin: this.options.margin ?? 8,
+      centre: !0,
+      minScale: i ? 1 : 0.5,
+      snap: i
+    });
+    this.window.position.set(s.x, s.y), this.window.scale.set(s.scale), this.frame.resize(s.width, s.height);
+    const e = this.options.padding ?? 8, r = n(this.options.content), h = (s.width - r.width) / 2;
+    this.options.content.position.set(i ? Math.round(Math.max(e, h)) : Math.max(e, h), e);
+  }
+  redraw() {
+  }
+}
+export {
+  H as Dialog
+};

package/dist/ui/FocusManager.js

@@ -0,0 +1,96 @@
+import { firstFocus as u, nextFocus as o, linearFocus as l } from "./layout/focusNav.js";
+import { Widget as h } from "./Widget.js";
+const f = {
+  up: "ui_up",
+  down: "ui_down",
+  left: "ui_left",
+  right: "ui_right",
+  accept: "ui_accept",
+  cancel: "ui_cancel",
+  next: "ui_next",
+  prev: "ui_prev"
+}, p = ["up", "down", "left", "right"];
+class x {
+  constructor(t, e = f) {
+    this.bindings = e, this.scopes.push({ container: t, onCancel: null });
+  }
+  bindings;
+  scopes = [];
+  list = null;
+  current = null;
+  get focused() {
+    return this.current;
+  }
+  /** The focusable widgets changed (added, removed, shown, hidden, enabled): collect them again on the next move. */
+  invalidate() {
+    this.list = null, this.current && (this.current.destroyed || !this.current.canFocus() || !this.inScope(this.current)) && this.focus(null);
+  }
+  /** Traps focus inside `container` until `popScope`; `onCancel` answers Cancel there (true when it used it). */
+  pushScope(t, e = null) {
+    this.scopes.push({ container: t, onCancel: e }), this.list = null, this.focus(null);
+  }
+  popScope(t) {
+    const e = this.scopes.findIndex((s) => s.container === t);
+    e <= 0 || (this.scopes.splice(e), this.list = null, this.focus(null));
+  }
+  /** The innermost scope's container (the open dialog, or the root). */
+  get scope() {
+    return this.scopes[this.scopes.length - 1].container;
+  }
+  focus(t) {
+    if (t !== this.current && (this.current?.setFocused(!1), this.current = t, !!t)) {
+      t.setFocused(!0);
+      for (let e = t.parent; e; e = e.parent) e.reveal?.(t);
+    }
+  }
+  /** Moves focus one way; the first press with nothing focused lands on the top-left widget. */
+  move(t) {
+    const e = this.widgets();
+    if (e.length === 0) return !1;
+    const s = e.map(a), n = this.current ? e.indexOf(this.current) : -1, r = n < 0 ? u(s) : o(s, n, t);
+    return r < 0 || r === n ? !1 : (this.focus(e[r]), !0);
+  }
+  /** Tab (1) or Shift+Tab (−1), in tree order, wrapping. */
+  step(t) {
+    const e = this.widgets();
+    if (e.length === 0) return !1;
+    const s = this.current ? e.indexOf(this.current) : -1;
+    return this.focus(e[l(e.length, s, t)]), !0;
+  }
+  /**
+   * Reads one step of input; call it between the game's `actions.poll()` and `endStep()`. True when the UI used a
+   * press, so the game leaves it alone.
+   */
+  handle(t) {
+    const e = this.bindings;
+    let s = !1;
+    for (const n of p)
+      t.pressed(e[n]) && (s = (this.current?.navigate(n) ?? !1) || this.move(n) || s);
+    return t.pressed(e.next) && (s = this.step(1) || s), t.pressed(e.prev) && (s = this.step(-1) || s), t.pressed(e.accept) && this.current?.canFocus() && (this.current.activate(), s = !0), t.pressed(e.cancel) && (this.scopes[this.scopes.length - 1].onCancel?.() ? s = !0 : this.current && (this.focus(null), s = !0)), s;
+  }
+  inScope(t) {
+    for (let e = t; e; e = e.parent) if (e === this.scope) return !0;
+    return !1;
+  }
+  widgets() {
+    if (!this.list) {
+      const t = [];
+      c(this.scope, t), this.list = t;
+    }
+    return this.list.filter((t) => !t.destroyed && t.canFocus());
+  }
+}
+function c(i, t) {
+  if (i.visible) {
+    i instanceof h && i.focusable && t.push(i);
+    for (const e of i.children) c(e, t);
+  }
+}
+function a(i) {
+  const t = i.getBounds();
+  return { x: t.x, y: t.y, width: t.width, height: t.height };
+}
+export {
+  f as DEFAULT_NAV,
+  x as FocusManager
+};