@expressivecss/expressive 0.16.0 → 0.17.0

package/dist/types/components/datepicker.d.ts

@@ -191,6 +191,25 @@ export interface DatepickerOptions extends BaseOptions {
      */
     displayPluginOptions: object;
 }
+type Calendar = {
+    month: number;
+    year: number;
+};
+/** What `renderDay()` draws one cell from. */
+type DayConfig = {
+    day: number;
+    month: number;
+    year: number;
+    hasEvent: boolean;
+    isSelected: boolean;
+    isToday: boolean;
+    isDisabled: boolean;
+    isEmpty: boolean;
+    showDaysInNextAndPreviousMonths: boolean;
+    isDateRangeStart: boolean;
+    isDateRangeEnd: boolean;
+    isDateRange: boolean;
+};
 export declare class Datepicker extends Component<DatepickerOptions> {
     el: HTMLInputElement;
     id: string;
@@ -204,17 +223,12 @@ export declare class Datepicker extends Component<DatepickerOptions> {
     date: Date;
     endDate: null | Date;
     dates: Date[];
-    calendars: [{
-        month: number;
-        year: number;
-    }];
+    calendars: [Calendar];
     private displayPlugin;
     /** What setInputValue last wrote, so reading it back does not depend on the parser. */
     private _writtenInputs;
-    private _form;
     private _resetDates;
     private _selection;
-    private _resetTimer;
     private footer;
     /** Nesting depth of {@link _batchDraws}; > 0 means draws are being collected. */
     private _drawDepth;
@@ -239,7 +253,7 @@ export declare class Datepicker extends Component<DatepickerOptions> {
      * translation file is as trustworthy as whatever wrote it.
      */
     static _escape(value: unknown): string;
-    static _isDate(obj: any): boolean;
+    static _isDate(obj: unknown): obj is Date;
     /**
      * A value read without a custom parser: in the picker's own string format
      * with its names, or else as an ISO date or by the browser.
@@ -250,8 +264,8 @@ export declare class Datepicker extends Component<DatepickerOptions> {
     /**
      * @deprecated as this function has no effect without any return statement or global parameter setter.
      */
-    static _setToStartOfDay(date: any): void;
-    static _compareDates(a: any, b: any): boolean;
+    static _setToStartOfDay(date: unknown): void;
+    static _compareDates(a: Date, b: Date): boolean;
     static key: string;
     destroy(): void;
     private _removeDateOverlay;
@@ -274,6 +288,8 @@ export declare class Datepicker extends Component<DatepickerOptions> {
      * Sets date from input field.
      */
     setDateFromInput(el: HTMLInputElement): void;
+    /** Whether `date` is the date already selected for `el`. */
+    private _shows;
     private _selectTypedMultiDate;
     /**
      * Set a date on the datepicker.
@@ -284,6 +300,8 @@ export declare class Datepicker extends Component<DatepickerOptions> {
      */
     setDate(date?: Date, preventOnSelect?: boolean, isEndDate?: boolean, fromUserInput?: boolean): void;
     validateDate(date: Date): void | Date;
+    /** A copy of `date`, moved to minDate or maxDate when it falls outside them. */
+    private _withinBounds;
     /**
      * The date an input holds. Without a custom parser, Date.parse reads
      * "05/10/2026" from a dd/mm/yyyy format as 10 May, so reuse the date behind
@@ -312,7 +330,7 @@ export declare class Datepicker extends Component<DatepickerOptions> {
     /**
      * Sets the data-date attribute on the date input field
      */
-    setDataDate(el: any, date: any): void;
+    setDataDate(el: HTMLInputElement, date: Date | null): void;
     /**
      * Sets dates on the input values.
      */
@@ -321,7 +339,7 @@ export declare class Datepicker extends Component<DatepickerOptions> {
     /**
      * Sets given date as the input value on the given element.
      */
-    setInputValue(el: any, date: any): void;
+    setInputValue(el: HTMLInputElement | null, date: Date | null): void;
     /**
      * Renders the date in the modal head section.
      */
@@ -332,18 +350,18 @@ export declare class Datepicker extends Component<DatepickerOptions> {
      */
     gotoDate(date: Date): void;
     adjustCalendars(): void;
-    adjustCalendar(calendar: any): any;
+    adjustCalendar(calendar: Calendar): Calendar;
     nextMonth(): void;
     prevMonth(): void;
-    render(year: any, month: any, randId: any): string;
-    renderDay(opts: any): string;
+    render(year: number, month: number, randId: string): string;
+    renderDay(opts: DayConfig): string;
     /** Assemble calendar cells; reject unsupported elements and attributes. */
-    renderRow(days: any, isRTL: any, isRowSelected: any): string;
+    renderRow(days: string[], isRTL: boolean, isRowSelected: boolean): string;
     /** Assemble calendar rows; reject unsupported elements and attributes. */
-    renderTable(opts: any, data: any, randId: any): string;
-    renderHead(opts: any): string;
+    renderTable(opts: DatepickerOptions, data: string[], randId: string): string;
+    renderHead(opts: DatepickerOptions): string;
     /** Wrap calendar rows after validating and encoding their contents. */
-    renderBody(rows: any): string;
+    renderBody(rows: string[]): string;
     private static _calendarMarkup;
     /**
      * Whether each month arrow is usable at this position in the allowed range.
@@ -351,6 +369,14 @@ export declare class Datepicker extends Component<DatepickerOptions> {
      * Depends on the month, which is deliberately *not* part of the controls
      * cache key - so the reuse path has to recompute and reapply it.
      */
+    /**
+     * Removes the time from minDate and maxDate, on copies: the caller's Date
+     * objects are theirs. Each also sets the month and year bounds, which the
+     * arrows, the month and year lists and PageUp/PageDown read. They used to
+     * stay at their defaults, so the calendar paged into months where every
+     * day was disabled.
+     */
+    private _setDateBounds;
     private _arrowState;
     /**
      * Identifies the *shape* of the controls - everything that changes which
@@ -361,7 +387,7 @@ export declare class Datepicker extends Component<DatepickerOptions> {
      * on the displayed year, so paging across a year boundary does change it.
      */
     private _controlsCacheKey;
-    renderTitle(instance: any, c: any, year: any, month: any, refYear: any, randId: any): string;
+    renderTitle(instance: Datepicker, c: number, year: number, month: number, refYear: number, randId: string): string;
     /**
      * Run `fn`, collapsing every draw it triggers into a single one at the end.
      *
@@ -401,7 +427,7 @@ export declare class Datepicker extends Component<DatepickerOptions> {
     /** A date input's listeners. An input the picker removes keeps them, but no event reaches it then. */
     private _addInputEventHandlers;
     private _removeDateInput;
-    _handleInputClick: (e: any) => void;
+    _handleInputClick: (e: Event) => void;
     /** Shows a docked or modal calendar. A modal takes focus from the input, so the selected day gets it. */
     private _showDisplay;
     _handleInputKeydown: (e: KeyboardEvent) => void;
@@ -409,23 +435,24 @@ export declare class Datepicker extends Component<DatepickerOptions> {
     private _syncCalendarFocus;
     private _handleCalendarFocus;
     private _handleCalendarKeydown;
-    _handleCalendarClick: (e: any) => void;
+    _handleCalendarClick: (e: Event) => void;
     _handleDateRangeCalendarClick: (date: Date) => void;
     _handleClearClick: () => void;
     _clearDates: () => void;
-    _handleMonthChange: (e: any) => void;
-    _handleYearChange: (e: any) => void;
-    gotoMonth(month: any): void;
-    gotoYear(year: any): void;
-    _handleFormReset: (e: Event) => void;
+    _handleMonthChange: (e: Event) => void;
+    _handleYearChange: (e: Event) => void;
+    gotoMonth(month: string | number): void;
+    gotoYear(year: string | number): void;
+    private _readBack;
     private _readBackMultiple;
     /** A native date input's overlay text follows its value, including an empty one. */
     private _syncDataDate;
     private _readBackSingle;
     _handleInputChange: (e: Event) => void;
-    renderDayName(opts: any, day: any, abbr?: boolean): any;
+    renderDayName(opts: DatepickerOptions, day: number, abbr?: boolean): string;
     createDateInput(): HTMLInputElement;
     _finishSelection: () => void;
     _confirm: () => void;
     _cancel: () => void;
 }
+export {};

package/dist/types/components/funnelChart.d.ts

@@ -20,14 +20,11 @@ export declare class FunnelChart extends LineChart {
     static key: string;
     /** Every stage is the first series' color, so the tooltip's swatches all match it. */
     protected _read(): void;
-    show(index: number): void;
-    /** Writes a row's share after its first value in the tooltip. */
-    private _addShare;
     /**
      * A row's value as a percentage of the first row's, in whole percentages
      * with a tenth below 10%, or '' when either row has no stage.
      */
-    private _share;
+    protected _share(index: number): string;
     /** A funnel has one series of stages, so it has no legend. */
     protected _legend(): Element[];
     /**

package/dist/types/components/heatmapChart.d.ts

@@ -23,11 +23,14 @@ export declare class HeatmapChart extends LineChart {
     private _endLevels;
     /** The box the cells scroll in, beside the row labels. */
     private _scroll;
+    /** Keeps the tooltip on its cell when the chart changes size. */
+    private _resizes;
     protected get _type(): string;
     /** Color carries the value, so there is no value axis. */
     protected get _axis(): boolean;
     static key: string;
     protected get _count(): number;
+    destroy(): void;
     /** Redraws the grid, scrolled where it was. */
     update(): void;
     /** Highlights one cell, numbered row by row. Pass -1 to hide the tooltip. */

package/dist/types/components/hoverCard.d.ts

@@ -47,6 +47,7 @@ export declare class HoverCard extends Component<HoverCardOptions> {
     private _handlePointerEnter;
     private _handlePointerLeave;
     private _handleLinkFocus;
+    private _handleCardEnter;
     private _handleCardFocus;
     private _handleFocusOut;
     /** Escape is listened for only while the card shows. close() removes it, and destroy() through the signal. */

package/dist/types/components/inputMask.d.ts

@@ -22,8 +22,6 @@ export declare class InputMask extends Component<BaseOptions> {
     private _acrossLiteral;
     /** Removes slot character `index`, puts the caret where it was, and reports the edit as typing would. */
     private _remove;
-    private _onReset;
-    private _afterReset;
     private _format;
     /** Rewrites the value to the mask. Returns where the caret goes, or null when the value already fit. */
     private _rewrite;

package/dist/types/components/lineChart.d.ts

@@ -19,6 +19,8 @@ export interface LineChartOptions extends BaseOptions {
     watch: boolean;
 }
 export declare const COLORS = 4;
+/** Charts that color each row, not each series, cycle through six colors. */
+export declare const ROW_COLORS = 6;
 /**
  * The legend of a pie or radial chart: an item per row, colored as
  * `colors[i]` when that is set, holding a span for each of `rows[i]`.
@@ -26,8 +28,12 @@ export declare const COLORS = 4;
 export declare function rowLegend(className: string, colors: (string | undefined)[], rows: string[][]): HTMLUListElement;
 /** A point at a turn clockwise from the top and a distance from the middle, as "x,y". */
 export declare function polarPoint(turn: number, r: number): string;
-/** A series' color number, for its `data-series`. */
-export declare const seriesColor: (i: number) => string;
+/** A series' color number, for its `data-series`, from a palette of `colors`. */
+export declare const seriesColor: (i: number, colors?: number) => string;
+/** The rows of a series split at each null into runs of indexes, empty runs included. */
+export declare function splitRuns(values: (number | null)[]): number[][];
+/** An axis of tick labels, each placed by --at, its distance along the plot. */
+export declare function tickAxis(className: string, ticks: number[], text: (tick: number) => string, at: (tick: number) => number): HTMLOListElement;
 /**
  * The timing of the paths' motion after update(), from the chart's motion
  * tokens, as the columns' CSS transition reads them. Null for a zero
@@ -46,12 +52,39 @@ export declare function pace(el: Element): {
 export declare function morph(path: SVGElement, from: string, timing: Pace): void;
 /** The paths' motion timing. */
 type Pace = NonNullable<ReturnType<typeof pace>>;
-/** A round step that cuts `span` into at most `parts` pieces. */
+/** A round step that cuts `span` into at most `parts` pieces. A reversed span, as an author's `data-min` above the data gives, is measured by its size. */
 export declare function niceStep(span: number, parts?: number): number;
 /** The multiples of `step` from `low` to `high`, without float error. */
 export declare function steps(low: number, high: number, step: number): number[];
 /** A number format in the element's language, or the browser's for an invalid lang attribute. */
 export declare function numberFormat(el: Element, options: Intl.NumberFormatOptions): Intl.NumberFormat;
+/**
+ * A compact format that gives each tick its own label: three significant
+ * digits, or more when two ticks would read the same, as 10,050 and 10,100
+ * both do at "10.1K". 21 is the most Intl allows.
+ */
+export declare function tickFormat(el: Element, ticks: number[]): Intl.NumberFormat;
+/**
+ * A share of a whole as a percentage: whole numbers, with a tenth below 10%
+ * so a small part is not 0%. A chart that writes many keeps `formats` and
+ * clears it when the language may have changed.
+ */
+export declare function percentLabel(el: Element, share: number, formats?: Intl.NumberFormat[]): string;
+/** Whether a series header cell has a class. */
+export declare const hasClass: (series: Series, name: string) => boolean;
+/** Colors the tooltip's swatches like a mark; no color leaves the default. */
+export declare function tintTooltip(tooltip: HTMLElement, color?: string): void;
+/** A span holding `text`. */
+export declare const textSpan: (text: string) => HTMLSpanElement & {
+    textContent: string;
+};
+/**
+ * The mark a key moves to among marks `0` to `last` in table order, from
+ * `active`. The arrows keep their meaning in a right-to-left chart, since
+ * table order is no direction on screen. With nothing shown, Escape is left
+ * to a dialog or sheet around the chart.
+ */
+export declare function linearKey(key: string, active: number, last: number): number | undefined;
 /** A y scale's ends, and with .axis the values its labels mark. */
 export interface ChartScale {
     min: number;
@@ -92,8 +125,6 @@ export interface Series {
  * than a guess.
  */
 export declare function cellValue(cell: Element | undefined): number | null;
-/** Reads text as one number, as cellValue does, or null. */
-export declare function numberValue(raw: string): number | null;
 /** An axis label: the tick in `format`, with the column's signs after any minus. */
 export declare function tickText(format: Intl.NumberFormat, tick: number, [prefix, suffix]: [string, string]): string;
 /** The currency, percent and spacing around a cell's number, as [prefix, suffix]. */
@@ -257,6 +288,13 @@ export declare class LineChart extends Component<LineChartOptions> {
     private _toggle;
     /** Draws the series, which fill the plot. */
     protected _draw(drawn?: Series[]): Element;
+    /**
+     * A row's share of the whole, written after its first value in the
+     * tooltip, or undefined. Pie, funnel and treemap charts give one.
+     */
+    protected _share(_index: number): string | undefined;
+    /** The series as lines and areas, which a chart that overrides _draw can still call. */
+    protected _drawLines(drawn?: Series[]): Element;
     /**
      * After update(), the shape each series moves from: where it was drawn,
      * and for a row it had no value at, its base. That is the plot bottom,

package/dist/types/components/mapView.d.ts

@@ -1,4 +1,4 @@
-import { Component, BaseOptions } from '../core/component';
+import { Component, BaseOptions, InitElement, InitElements } from '../core/component';
 /** `[longitude, latitude]`, MapLibre's order. */
 export type LngLat = [number, number];
 /**
@@ -6,22 +6,117 @@ export type LngLat = [number, number];
  * the published types do not depend on MapLibre.
  */
 export interface MapLibre {
-    Map: new (options: object) => any;
-    Marker: new (options: object) => any;
-    Popup: new (options: object) => any;
+    Map: new (options: MapInit) => MapInstance;
+    Marker: new (options: object) => MapMarker;
+    Popup: new (options: object) => MapPopup;
+}
+/**
+ * What `new Map()` gets. Only the container is declared; the style, center,
+ * zoom and `mapOptions` ride along, and MapLibre types them itself.
+ */
+export interface MapInit {
+    container: HTMLElement;
+}
+/** A point on the map, as MapLibre hands it back. */
+export interface MapLngLat {
+    lng: number;
+    lat: number;
+}
+/** A map click, with the DOM event behind it and, on a layer, the features hit. */
+export interface MapMouseEvent {
+    originalEvent: MouseEvent;
+    lngLat: MapLngLat;
+    features?: Array<{
+        properties: Record<string, unknown>;
+        geometry: {
+            coordinates: LngLat;
+        };
+    }>;
+}
+export interface MapMarker {
+    getElement(): HTMLElement;
+    getLngLat(): MapLngLat;
+    setLngLat(at: LngLat | MapLngLat): this;
+    addTo(map: MapInstance): this;
+    on(event: 'dragstart' | 'dragend', callback: () => void): unknown;
+    remove(): unknown;
+}
+export interface MapPopup {
+    getElement(): HTMLElement | undefined;
+    setDOMContent(content: Node): this;
+    setLngLat(at: LngLat | MapLngLat): this;
+    addTo(map: MapInstance): this;
+    isOpen(): boolean;
+    on(event: 'open' | 'close', callback: () => void): unknown;
+    remove(): unknown;
+}
+/** A style layer, as `getStyle()` lists them. */
+export interface MapLayer {
+    id: string;
+    source?: string;
+    layout?: Record<string, unknown>;
+}
+/** A source, as `getSource()` returns it. */
+export interface MapSource {
+    type: string;
+}
+/** A clustered GeoJSON source, which is what `addClusters()` registers. */
+export interface MapClusterSource extends MapSource {
+    getClusterExpansionZoom(clusterId: unknown): Promise<number>;
+}
+/** The parts of a `maplibre-gl` `Map` this component calls. */
+export interface MapInstance {
+    on(event: string, listener: (e: MapMouseEvent) => void): unknown;
+    on(event: string, layer: string, listener: (e: MapMouseEvent) => void): unknown;
+    off(event: string, layer: string, listener: (e: MapMouseEvent) => void): unknown;
+    remove(): void;
+    zoomIn(): unknown;
+    zoomOut(): unknown;
+    resetNorthPitch(): unknown;
+    getZoom(): number;
+    getMinZoom(): number;
+    getMaxZoom(): number;
+    getBearing(): number;
+    getCanvas(): HTMLCanvasElement;
+    getStyle(): {
+        glyphs?: string;
+        layers: MapLayer[];
+    };
+    setStyle(style: string | object | null, options?: {
+        diff?: boolean;
+    }): unknown;
+    getSource(id: string): MapSource | undefined;
+    addSource(id: string, source: object): unknown;
+    removeSource(id: string): unknown;
+    addLayer(layer: object): unknown;
+    removeLayer(id: string): unknown;
+    project(at: MapLngLat): {
+        x: number;
+        y: number;
+    };
+    unproject(point: [number, number]): MapLngLat;
+    panBy(offset: [number, number]): unknown;
+    flyTo(options: {
+        center: LngLat;
+        zoom: number;
+    }): unknown;
+    easeTo(options: {
+        center: LngLat;
+        zoom: number;
+    }): unknown;
 }
 /** A style for each color scheme. The map follows the page's theme. */
 export interface MapThemedStyle {
     light: string | object;
     dark: string | object;
 }
-export interface MapViewOptions extends BaseOptions {
+export interface MapViewOptions<L extends MapLibre = MapLibre> extends BaseOptions {
     /**
      * The `maplibre-gl` module. ExpressiveCSS does not bundle MapLibre, so the
      * page imports it and passes it in.
      * @default null
      */
-    maplibregl: MapLibre | null;
+    maplibregl: L | null;
     /**
      * A MapLibre style URL or object, or `{ light, dark }` to follow the theme.
      * @default OpenFreeMap Positron and Dark
@@ -88,11 +183,14 @@ export interface MapClusterOptions {
  * The class is `MapView` rather than `Map` so importing it does not shadow
  * JavaScript's `Map`.
  */
-export declare class MapView extends Component<MapViewOptions> {
-    /** The MapLibre map. */
-    map: any;
+export declare class MapView<L extends MapLibre = MapLibre> extends Component<MapViewOptions<L>> {
+    /**
+     * The MapLibre map, with the full type of the `maplibregl` passed to the
+     * constructor; `init()` and `getInstance()` see the `MapInstance` subset.
+     */
+    map: InstanceType<L['Map']> | null;
     /** The MapLibre markers made from `.map-marker` children, in order. */
-    markers: any[];
+    markers: MapMarker[];
     private _children;
     private _popups;
     private _markerPopups;
@@ -107,7 +205,11 @@ export declare class MapView extends Component<MapViewOptions> {
     private _dragged;
     private _restore;
     private _actions;
-    constructor(el: HTMLElement, options: Partial<MapViewOptions>);
+    /** Initializes a map, typed by the `maplibregl` passed in. */
+    static init<L extends MapLibre>(this: typeof MapView, el: HTMLElement, options?: Partial<MapViewOptions<L>>): MapView<L>;
+    /** Initializes a map on each element, typed by the `maplibregl` passed in. */
+    static init<L extends MapLibre>(this: typeof MapView, els: InitElements<InitElement>, options?: Partial<MapViewOptions<L>>): MapView<L>[];
+    constructor(el: HTMLElement, options: Partial<MapViewOptions<L>>);
     static get defaults(): MapViewOptions;
     static key: string;
     destroy(): void;

package/dist/types/components/menu.d.ts

@@ -121,6 +121,10 @@ export declare class Menu extends Component<MenuOptions> {
     private _contextPoint;
     /** What had focus when a context menu opened; focus goes back there. */
     private _contextReturn;
+    /** Each attribute setup wrote, with the value it had before, for destroy(). */
+    private _originalAttributes;
+    /** Where the menu was before it moved next to the trigger. */
+    private _originalPlace;
     constructor(el: HTMLElement, options: Partial<MenuOptions>);
     static get defaults(): MenuOptions;
     static key: string;
@@ -132,6 +136,7 @@ export declare class Menu extends Component<MenuOptions> {
     _handleClick: (e: MouseEvent) => void;
     _handleMouseEnter: () => void;
     _handleMouseLeave: (e: MouseEvent) => void;
+    private static _inOpenTrigger;
     _handleDocumentClick: (e: MouseEvent) => void;
     _handleDocumentKeydown: (e: KeyboardEvent) => void;
     _handleTriggerKeydown: (e: KeyboardEvent) => void;
@@ -165,6 +170,15 @@ export declare class Menu extends Component<MenuOptions> {
     _resetMenuStyles(): void;
     _resetMenuPositioningStyles(): void;
     _moveMenuToElement(): void;
+    /** Keeps the value an attribute had before setup first changed it, which destroy() puts back. */
+    private _keepAttribute;
+    private _setAttribute;
+    /**
+     * Puts back the attributes setup wrote and the menu where it was, so a
+     * destroyed trigger is no longer announced as a menu button. The place is
+     * only used while it is still in the page.
+     */
+    private _restoreSetup;
     _makeMenuFocusable(): void;
     /**
      * Moves focus for Up, Down, Home or End among the list's focusable rows,

package/dist/types/components/particles.d.ts

@@ -50,6 +50,8 @@ export declare class Particles extends Component<ParticlesOptions> {
     private _particles;
     private _width;
     private _height;
+    /** The device pixel ratio the buffer was sized for, which painting scales by. */
+    private _dpr;
     private _frame;
     private _last;
     private _mouse;
@@ -69,7 +71,18 @@ export declare class Particles extends Component<ParticlesOptions> {
     private _start;
     private _stop;
     private _onPointerMove;
-    private _reset;
+    /** Matches the pixel buffer to the canvas box, which clears it. */
+    private _fit;
+    /** Scatters a new set of particles. */
+    private _scatter;
+    /**
+     * Refits the buffer and moves each particle with the box, so a drag that
+     * resizes the canvas every frame keeps the same dots. It used to scatter a
+     * new set each time. A box that had no size has no positions to keep.
+     * Refitting clears the buffer, and the observer runs after this frame's
+     * draw, so a moving canvas is painted here too or it shows blank.
+     */
+    private _resize;
     private _particle;
     private _draw;
     private _paint;

package/dist/types/components/pieChart.d.ts

@@ -43,8 +43,7 @@ export declare class PieChart extends LineChart {
     /** CSS places the tooltip on the slice's middle from --turn. */
     protected _place(index: number): void;
     /** The row's share of the whole as a percentage, or '' for none. */
-    private _share;
-    private _percent;
+    protected _share(index: number): string;
     /**
      * Each slice's row name outside it, on the slice's middle, with a leader
      * line back to the slice. Names on the right half run rightwards and those

package/dist/types/components/richTextEditor.d.ts

@@ -1,27 +1,44 @@
-import { Component, BaseOptions } from '../core/component';
+import { Component, BaseOptions, InitElement, InitElements } from '../core/component';
 /**
  * The parts of a Tiptap `Editor` this component uses. Declared here so the
  * published types do not depend on Tiptap.
  */
+/** A Tiptap command chain. Commands by name come through `command()`. */
+export interface RichTextEditorChain {
+    focus(): RichTextEditorChain;
+    run(): boolean;
+}
+/**
+ * What `new Editor()` gets. Only these are declared; the extensions and
+ * `editorProps` ride along, and Tiptap types them itself.
+ */
+export interface RichTextEditorConfig {
+    element: HTMLElement;
+    content: string;
+    editable: boolean;
+}
 export interface RichTextEditorInstance {
     commands: object;
     isEditable: boolean;
     isEmpty: boolean;
-    chain(): any;
-    can(): any;
+    chain(): RichTextEditorChain;
+    /** Each command as a check that reports whether it can run now. */
+    can(): object;
     isActive(name: string, attributes?: object): boolean;
     getHTML(): string;
     on(event: string, callback: () => void): unknown;
     off(event: string, callback: () => void): unknown;
     destroy(): void;
 }
-export interface RichTextEditorOptions extends BaseOptions {
+/** Tiptap's `Editor` class, or any class with the parts this component uses. */
+export type RichTextEditorClass = new (options: RichTextEditorConfig) => RichTextEditorInstance;
+export interface RichTextEditorOptions<E extends RichTextEditorClass = RichTextEditorClass> extends BaseOptions {
     /**
      * Tiptap's `Editor` class. ExpressiveCSS does not bundle Tiptap, so the
      * page imports it and passes it in.
      * @default null
      */
-    Editor: (new (options: any) => RichTextEditorInstance) | null;
+    Editor: E | null;
     /**
      * Tiptap extensions, usually `[StarterKit]`.
      * @default []
@@ -39,9 +56,13 @@ export interface RichTextEditorOptions extends BaseOptions {
  * disabled when their command cannot run, and `toggle*` commands report their
  * state with `aria-pressed` and `.active`.
  */
-export declare class RichTextEditor extends Component<RichTextEditorOptions> {
-    /** The Tiptap editor. */
-    editor: RichTextEditorInstance | null;
+export declare class RichTextEditor<E extends RichTextEditorClass = RichTextEditorClass> extends Component<RichTextEditorOptions<E>> {
+    /**
+     * The Tiptap editor, with the full type of the `Editor` passed to the
+     * constructor; `init()` and `getInstance()` see the `RichTextEditorInstance`
+     * subset.
+     */
+    editor: InstanceType<E> | null;
     /** The form value. */
     textarea: HTMLTextAreaElement | null;
     /** The element the editor is mounted in. */
@@ -50,7 +71,11 @@ export declare class RichTextEditor extends Component<RichTextEditorOptions> {
     private _label;
     private _required;
     private _form;
-    constructor(el: HTMLElement, options: Partial<RichTextEditorOptions>);
+    /** Initializes an editor, typed by the `Editor` passed in. */
+    static init<E extends RichTextEditorClass>(this: typeof RichTextEditor, el: HTMLElement, options?: Partial<RichTextEditorOptions<E>>): RichTextEditor<E>;
+    /** Initializes an editor on each element, typed by the `Editor` passed in. */
+    static init<E extends RichTextEditorClass>(this: typeof RichTextEditor, els: InitElements<InitElement>, options?: Partial<RichTextEditorOptions<E>>): RichTextEditor<E>[];
+    constructor(el: HTMLElement, options: Partial<RichTextEditorOptions<E>>);
     static get defaults(): RichTextEditorOptions;
     static key: string;
     destroy(): void;
@@ -58,6 +83,12 @@ export declare class RichTextEditor extends Component<RichTextEditorOptions> {
     private _handleLabelClick;
     private _skipsValidation;
     private _handleSubmit;
+    /**
+     * The form restores the textarea after the reset event, so the editor reads
+     * it back a task later. Without this the editor kept the typed text while the
+     * form submitted the default. No update is emitted, so a reset fires no input.
+     */
+    private _handleReset;
     private _handleUpdate;
     private _handleTransaction;
 }