@adecore/editor 0.0.1 → 0.17.0-beta.1

package/dist/pointer.js

@@ -0,0 +1,243 @@
+const SCROLL_STEP = 40;
+/* A press this soon after the last one, this close to it, is the next click of a double or triple click. */
+const MULTI_CLICK_MS = 500;
+const MULTI_CLICK_DISTANCE = 4;
+/* How far the pointer goes, in pixels, before a press on a selection starts carrying it. */
+const CARRY_THRESHOLD = 5;
+/* The selection a mouse makes: a click, a drag, shift to extend, alt to add a caret or, dragged, a column, a double click for a word and a triple for a line, which a drag then grows by words and lines. */
+export class PointerSelection {
+    drag;
+    frame;
+    lastPress;
+    host;
+    constructor(host) {
+        this.host = host;
+    }
+    get dragging() {
+        return this.drag !== undefined;
+    }
+    /* A press in the text, or on a line number, which selects the line and drags by lines. */
+    start(event, area = 'text') {
+        const { model, viewport } = this.host;
+        const count = area === 'gutter' ? 1 : this.countClick(event);
+        const head = this.host.offsetAt(event.clientX, event.clientY);
+        const selections = model.getSelections();
+        const base = event.altKey && area === 'text' ? selections : [];
+        this.drag = {
+            id: event.pointerId,
+            anchor: event.shiftKey && !event.altKey ? model.getPrimary().anchor : head,
+            selections,
+            add: event.altKey && area === 'text',
+            unit: 'character',
+            keep: event.altKey && event.shiftKey,
+            box: area === 'text' && (event.altKey || this.host.columnMode()),
+            saved: { from: head, to: head },
+            anchorPoint: this.host.contentPoint(event.clientX, event.clientY),
+            x: event.clientX,
+            y: event.clientY
+        };
+        this.host.focus();
+        viewport.setPointerCapture?.(event.pointerId);
+        // Alt on a caret that is there takes it away; there is no selection to drag after that.
+        if (area === 'text' && event.altKey && count === 1 && selections.length > 1 && selections.some((selection) => selection.head === head)) {
+            model.setSelections(selections.filter((selection) => selection.head !== head));
+            this.drag = undefined;
+            return;
+        }
+        const selected = count === 1 && area === 'text' && !event.shiftKey && !event.altKey ? this.host.selectionAt(event.clientX, event.clientY) : null;
+        if (selected !== null) {
+            this.drag.unit = 'drop';
+            this.drag.carry = {
+                from: Math.min(selected.anchor, selected.head),
+                to: Math.max(selected.anchor, selected.head),
+                pressOffset: head,
+                startX: event.clientX,
+                startY: event.clientY,
+                active: false,
+                target: null
+            };
+        }
+        else if (area === 'gutter') {
+            this.pressLineNumber(event, head);
+        }
+        else if (count >= 3) {
+            this.selectUnit('line', this.host.lineAt(head), base);
+        }
+        else if (count === 2) {
+            const word = model.wordSelectionAt(head, this.host.camelHumps());
+            if (word === null) {
+                this.update();
+            }
+            else {
+                this.selectUnit('word', word, base);
+            }
+        }
+        else {
+            this.update();
+        }
+        if (this.drag && this.frame === undefined) {
+            this.frame = viewport.ownerDocument.defaultView?.requestAnimationFrame?.(() => this.autoScroll());
+        }
+    }
+    /* A line number selects its line, and with shift grows or shrinks the selection by lines. */
+    pressLineNumber(event, offset) {
+        const { model } = this.host;
+        const primary = model.getPrimary();
+        if (event.shiftKey && primary.anchor !== primary.head) {
+            model.setSelections([this.tweakedByLines(primary, offset)]);
+            this.drag = undefined;
+            return;
+        }
+        this.selectUnit('line', this.host.lineAt(offset), []);
+    }
+    selectUnit(unit, saved, base) {
+        if (this.drag === undefined) {
+            return;
+        }
+        this.drag.unit = unit;
+        this.drag.saved = saved;
+        this.drag.selections = base;
+        this.host.model.setSelections([...base, { anchor: saved.from, head: saved.to }]);
+    }
+    /* The selection after a shift press on a line number: the clicked line comes in, or goes out when it is inside. */
+    tweakedByLines(selection, offset) {
+        const { host } = this;
+        const from = Math.min(selection.anchor, selection.head);
+        const to = Math.max(selection.anchor, selection.head);
+        const first = host.visualLine(from);
+        const last = host.visualLine(to - 1);
+        const clicked = host.visualLine(offset);
+        if (clicked.y < first.y) {
+            return { anchor: to, head: clicked.start };
+        }
+        if (clicked.y > last.y) {
+            return { anchor: from, head: clicked.end };
+        }
+        if (first.y === last.y) {
+            return { anchor: selection.head, head: selection.head };
+        }
+        if (selection.anchor === to) {
+            const line = clicked.y === first.y ? host.visualLine(first.next) : clicked;
+            return { anchor: to, head: line.start };
+        }
+        const line = clicked.y === last.y ? host.visualLine(last.start - 1) : clicked;
+        return { anchor: from, head: line.end };
+    }
+    /* Pointer events carry no click count, so the presses are counted here. */
+    countClick(event) {
+        const last = this.lastPress;
+        const repeated = last !== undefined &&
+            event.timeStamp - last.time <= MULTI_CLICK_MS &&
+            Math.abs(event.clientX - last.x) <= MULTI_CLICK_DISTANCE &&
+            Math.abs(event.clientY - last.y) <= MULTI_CLICK_DISTANCE;
+        const count = repeated ? Math.min(3, last.count + 1) : 1;
+        this.lastPress = { time: event.timeStamp, x: event.clientX, y: event.clientY, count };
+        return count;
+    }
+    move(event) {
+        if (!this.drag || event.pointerId !== this.drag.id) {
+            return;
+        }
+        this.drag.x = event.clientX;
+        this.drag.y = event.clientY;
+        this.update();
+    }
+    /* The pointer went up, or was taken away: a selection that was carried lands, and one that was only pressed gives way to a caret. */
+    end(event) {
+        const { viewport } = this.host;
+        const carry = this.drag?.carry;
+        if (this.drag) {
+            viewport.releasePointerCapture?.(this.drag.id);
+        }
+        this.drag = undefined;
+        this.cancelFrame();
+        if (carry === undefined) {
+            return;
+        }
+        this.host.setDropCaret(null);
+        if (event?.type === 'pointercancel') {
+            return;
+        }
+        if (!carry.active) {
+            this.host.model.setSelections([{ anchor: carry.pressOffset, head: carry.pressOffset }]);
+        }
+        else if (carry.target !== null && event !== undefined) {
+            this.host.drop(carry.from, carry.to, carry.target, this.host.copyHeld(event));
+        }
+    }
+    /* Where the carried text would land at the pointer, once the pointer has moved far enough to carry it. */
+    updateCarry(drag, carry) {
+        if (!carry.active) {
+            if (Math.abs(drag.x - carry.startX) < CARRY_THRESHOLD && Math.abs(drag.y - carry.startY) < CARRY_THRESHOLD) {
+                return;
+            }
+            carry.active = true;
+        }
+        const offset = this.host.offsetAt(drag.x, drag.y);
+        carry.target = offset >= carry.from && offset <= carry.to ? null : offset;
+        this.host.setDropCaret(carry.target);
+    }
+    dispose() {
+        this.drag = undefined;
+        this.cancelFrame();
+    }
+    cancelFrame() {
+        if (this.frame !== undefined) {
+            this.host.viewport.ownerDocument.defaultView?.cancelAnimationFrame?.(this.frame);
+        }
+        this.frame = undefined;
+    }
+    update() {
+        if (!this.drag) {
+            return;
+        }
+        if (this.drag.carry !== undefined) {
+            this.updateCarry(this.drag, this.drag.carry);
+            return;
+        }
+        if (this.drag.box && this.drag.unit === 'character') {
+            const box = this.host.columnSelections(this.drag.anchorPoint, this.host.contentPoint(this.drag.x, this.drag.y));
+            if (box) {
+                this.host.model.setSelections(this.drag.keep ? [...this.drag.selections, ...box] : box);
+                return;
+            }
+        }
+        const head = this.host.offsetAt(this.drag.x, this.drag.y);
+        const { anchor, target } = this.reach(this.drag, head);
+        this.host.model.setSelections([...(this.drag.add ? this.drag.selections : []), { anchor, head: target }]);
+    }
+    /* Where a drag that has got to `head` selects from and to, by the unit the press began with. */
+    reach(drag, head) {
+        const { model } = this.host;
+        const backwards = head < drag.saved.from;
+        if (drag.unit === 'word') {
+            const camel = this.host.camelHumps();
+            return backwards
+                ? { anchor: drag.saved.to, target: model.wordStartBefore(head, camel) }
+                : { anchor: drag.saved.from, target: model.wordEndAfter(head, camel) };
+        }
+        if (drag.unit === 'line') {
+            const line = this.host.visualLine(head);
+            return backwards ? { anchor: drag.saved.to, target: line.start } : { anchor: drag.saved.from, target: line.next };
+        }
+        return { anchor: drag.anchor, target: head };
+    }
+    /* Holding the pointer past an edge of the view keeps scrolling that way. */
+    autoScroll() {
+        const { viewport } = this.host;
+        if (!this.drag) {
+            this.frame = undefined;
+            return;
+        }
+        const rect = viewport.getBoundingClientRect();
+        const dy = this.drag.y < rect.top ? this.drag.y - rect.top : this.drag.y > rect.bottom ? this.drag.y - rect.bottom : 0;
+        const dx = this.drag.x < rect.left ? this.drag.x - rect.left : this.drag.x > rect.right ? this.drag.x - rect.right : 0;
+        if (dy || dx) {
+            viewport.scrollTop += Math.max(-SCROLL_STEP, Math.min(SCROLL_STEP, dy));
+            viewport.scrollLeft += Math.max(-SCROLL_STEP, Math.min(SCROLL_STEP, dx));
+            this.host.scrolled();
+            this.update();
+        }
+        this.frame = viewport.ownerDocument.defaultView?.requestAnimationFrame?.(() => this.autoScroll());
+    }
+}

package/dist/scroll-animation.d.ts

@@ -0,0 +1,3 @@
+export declare const SCROLL_DURATION_MS = 100;
+export declare function scrollDuration(distance: number, lineHeight: number): number;
+export declare function easeOut(fraction: number): number;

package/dist/scroll-animation.js

@@ -0,0 +1,45 @@
+/*
+ * How a scroll that moves the view a distance goes there: not at all for a line or less, and for more
+ * over a moment that grows with the distance up to a tenth of a second, starting fast and easing out.
+ */
+/* The longest the view takes to get anywhere. */
+export const SCROLL_DURATION_MS = 100;
+/* How many lines away the view has to go before it takes any time, and how many before it takes all of it. */
+const FREE_LINES = 1;
+const FULL_LINES = 11;
+export function scrollDuration(distance, lineHeight) {
+    const lines = distance / lineHeight;
+    const part = Math.min(1, Math.max(0, (lines - FREE_LINES) / (FULL_LINES - FREE_LINES)));
+    return Math.round(part * SCROLL_DURATION_MS);
+}
+/* The curve `cubic-bezier(0, 0, 0.58, 1)`: how much of the way has been gone after a fraction of the time. */
+export function easeOut(fraction) {
+    if (fraction <= 0) {
+        return 0;
+    }
+    if (fraction >= 1) {
+        return 1;
+    }
+    const x1 = 0;
+    const y1 = 0;
+    const x2 = 0.58;
+    const y2 = 1;
+    const bezier = (t, a, b) => 3 * (1 - t) * (1 - t) * t * a + 3 * (1 - t) * t * t * b + t * t * t;
+    let low = 0;
+    let high = 1;
+    let t = fraction;
+    for (let step = 0; step < 24; step++) {
+        const x = bezier(t, x1, x2);
+        if (Math.abs(x - fraction) < 1e-5) {
+            break;
+        }
+        if (x < fraction) {
+            low = t;
+        }
+        else {
+            high = t;
+        }
+        t = (low + high) / 2;
+    }
+    return bezier(t, y1, y2);
+}

package/dist/scroll.d.ts

@@ -0,0 +1,28 @@
+export type ScrollKind = 'relative' | 'makeVisible' | 'center' | 'centerDown' | 'centerUp';
+export interface ScrollRequest {
+    readonly target: {
+        readonly x: number;
+        readonly y: number;
+    };
+    readonly view: {
+        readonly x: number;
+        readonly y: number;
+        readonly width: number;
+        readonly height: number;
+    };
+    readonly content: {
+        readonly width: number;
+        readonly height: number;
+    };
+    readonly lineHeight: number;
+    readonly charWidth: number;
+    readonly topBound: number;
+    readonly bottomBound: number;
+    readonly refrain: boolean;
+    readonly horizontal: boolean;
+    readonly inset?: number;
+}
+export declare function scrollPosition(request: ScrollRequest, kind: ScrollKind): {
+    x: number;
+    y: number;
+};

package/dist/scroll.js

@@ -0,0 +1,76 @@
+/*
+ * Where the view scrolls to when a target has to be seen. The rules are the platform's scrolling model
+ * with its defaults: a line of margin above and below the target, three characters at its sides, and a
+ * target out of reach lands a third of the way down the view.
+ */
+/* The characters kept in view to the left and right of the target. */
+const SIDE_MARGIN = 3;
+function clamp(value, maximum) {
+    return Math.min(Math.max(0, value), Math.max(0, maximum));
+}
+/* The one third mark when the margins fit above it, the middle of the view when they do not. */
+function centerOf(request) {
+    const { target, view, lineHeight, topBound } = request;
+    const third = target.y - Math.trunc(view.height / 3);
+    return third < topBound ? third : target.y - Math.trunc(Math.max(0, view.height - lineHeight) / 2);
+}
+function verticalPosition(request, kind) {
+    const { target, view, content, topBound, bottomBound } = request;
+    const height = view.height;
+    const center = centerOf(request);
+    const above = view.y > topBound;
+    const below = view.y + height < bottomBound;
+    let position = view.y;
+    if (kind === 'center') {
+        position = center;
+    }
+    else if (kind === 'centerUp') {
+        position = above || below || view.y > center ? center : position;
+    }
+    else if (kind === 'centerDown') {
+        position = above || below || view.y < center ? center : position;
+    }
+    else if (kind === 'makeVisible') {
+        position = above || below ? center : position;
+    }
+    else if (bottomBound - topBound > height) {
+        position = center;
+    }
+    else if (below) {
+        const lowest = target.y + height > content.height ? content.height : target.y + height - (target.y - topBound);
+        position = Math.max(bottomBound - height, Math.min(lowest, view.y + height) - height);
+    }
+    else if (above) {
+        const highest = target.y - height < 0 ? 0 : bottomBound - height;
+        position = Math.min(topBound, Math.max(highest, view.y));
+    }
+    const inset = request.inset ?? 0;
+    return Math.min(Math.max(inset, position), Math.max(inset, content.height - height));
+}
+function horizontalPosition(request, kind) {
+    const { target, view, content, charWidth } = request;
+    const width = view.width;
+    const left = target.x - SIDE_MARGIN * charWidth;
+    const right = target.x + SIDE_MARGIN * charWidth;
+    let position = view.x;
+    if (right - left > width) {
+        position = target.x - Math.trunc(width / 2);
+    }
+    else if (left < view.x) {
+        position = kind === 'makeVisible' && right < width ? 0 : left;
+    }
+    else if (right > view.x + width) {
+        position = right - width;
+    }
+    return clamp(position, content.width - width);
+}
+/* The scroll position that shows the target the way `kind` asks. */
+export function scrollPosition(request, kind) {
+    const { target, view } = request;
+    const inView = target.x >= view.x && target.x < view.x + view.width && target.y >= view.y && target.y < view.y + view.height;
+    const effective = request.refrain && inView && (kind === 'center' || kind === 'centerDown' || kind === 'centerUp') ? 'relative' : kind;
+    return {
+        x: request.horizontal ? horizontalPosition(request, effective) : view.x,
+        y: verticalPosition(request, effective) - (request.inset ?? 0)
+    };
+}

package/dist/semantic.d.ts

@@ -0,0 +1,8 @@
+import type { LineToken } from './types.ts';
+export interface SemanticSpan {
+    readonly from: number;
+    readonly to: number;
+    readonly color: string;
+    readonly fontStyle: number;
+}
+export declare function overlayTokens(base: readonly LineToken[], spans: readonly SemanticSpan[]): LineToken[];

package/dist/semantic.js

@@ -0,0 +1,47 @@
+/*
+ * The colors of a line with the spans laid over them: inside a span its color and font style replace
+ * the grammar's, and everywhere else the grammar's stay. The tokens of the result add up to the line
+ * as before. Spans are in order and do not overlap.
+ */
+export function overlayTokens(base, spans) {
+    const result = [];
+    const push = (length, color, fontStyle) => {
+        if (length <= 0) {
+            return;
+        }
+        const last = result[result.length - 1];
+        if (last !== undefined && last.color === color && last.fontStyle === fontStyle) {
+            result[result.length - 1] = { length: last.length + length, color, fontStyle };
+        }
+        else {
+            result.push({ length, color, fontStyle });
+        }
+    };
+    let span = 0;
+    let start = 0;
+    for (const token of base) {
+        const end = start + token.length;
+        let at = start;
+        while (at < end) {
+            while (span < spans.length && spans[span].to <= at) {
+                span++;
+            }
+            const current = spans[span];
+            if (current === undefined || current.from >= end) {
+                push(end - at, token.color, token.fontStyle);
+                at = end;
+            }
+            else if (current.from > at) {
+                push(current.from - at, token.color, token.fontStyle);
+                at = current.from;
+            }
+            else {
+                const stop = Math.min(end, current.to);
+                push(stop - at, current.color, current.fontStyle);
+                at = stop;
+            }
+        }
+        start = end;
+    }
+    return result;
+}

package/dist/shiki.d.ts

@@ -0,0 +1,7 @@
+import type { Highlighter } from 'shiki';
+import { documentLanguageOf } from './php-html.ts';
+import type { ScopeColorSource, TokenizerSource } from './types.ts';
+export { documentLanguageOf };
+export declare function loadGrammar(highlighter: Highlighter, grammar: string, text?: string): Promise<boolean>;
+export declare function shikiTokenizers(highlighter: () => Promise<Highlighter>): TokenizerSource;
+export declare function shikiScopeColors(highlighter: () => Promise<Highlighter>): ScopeColorSource;

package/dist/shiki.js

@@ -0,0 +1,106 @@
+import { documentLanguageOf, loadDocumentLanguage } from './php-html.js';
+import { scopeColorsOf } from './theme-scopes.js';
+export { documentLanguageOf };
+const PLAIN_TEXT = new Set(['', 'text', 'txt', 'plain', 'plaintext']);
+/* Colors one line at a time and hands the grammar's state from one line to the next. A grammar Shiki rebuilt does not know the states of the old one. */
+function lineTokenizer(highlighter, language, theme) {
+    let grammar = highlighter.getLanguage(language);
+    return {
+        stale() {
+            const current = highlighter.getLanguage(language);
+            const changed = current !== grammar;
+            grammar = current;
+            return changed;
+        },
+        tokenizeLine(text, state) {
+            const options = { lang: language, theme, grammarState: (state ?? undefined) };
+            const lines = highlighter.codeToTokensBase(text, options);
+            const tokens = (lines[0] ?? []).map((token) => ({
+                length: token.content.length,
+                color: token.color ?? '',
+                fontStyle: token.fontStyle ?? 0
+            }));
+            return { tokens, state: highlighter.getLastGrammarState(lines) };
+        },
+        sameState(a, b) {
+            if (a === b) {
+                return true;
+            }
+            const left = a?.getInternalStack(theme);
+            const right = b?.getInternalStack(theme);
+            return left !== undefined && right !== undefined && left.equals(right);
+        }
+    };
+}
+/* The words of a document that name a language, an alias or the id itself, and not part of a longer word. */
+function mentions(text, names) {
+    return names.some((name) => new RegExp(`(?<![\\w-])${name.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')}(?![\\w-])`, 'i').test(text));
+}
+/*
+ * A grammar embeds some languages only on demand (Vue's `lang="scss"` styles, the fences of Markdown),
+ * and Shiki builds the host grammar anew each time one of them loads later, which drops the states
+ * of every line colored before. So the ones a document names are loaded together with the host.
+ */
+async function loadEmbedded(highlighter, grammar, text) {
+    const { bundledLanguages, bundledLanguagesInfo } = await import('shiki');
+    const bundled = bundledLanguages[grammar];
+    if (bundled === undefined) {
+        return;
+    }
+    const registrations = (await bundled()).default;
+    const lazy = registrations.find((registration) => registration.name === grammar)?.embeddedLangsLazy ?? [];
+    const named = lazy.filter((id) => {
+        const aliases = bundledLanguagesInfo.find((info) => info.id === id)?.aliases ?? [];
+        return !highlighter.getLoadedLanguages().includes(id) && mentions(text, [id, ...aliases]);
+    });
+    await Promise.allSettled(named.map((id) => highlighter.loadLanguage(id)));
+}
+/*
+ * Loads the grammar of a language with what a document in it embeds, and says whether Shiki has it.
+ * `text` is the document, which decides the embedded languages that load only when named.
+ */
+export async function loadGrammar(highlighter, grammar, text = '') {
+    await loadDocumentLanguage(highlighter, grammar);
+    if (!highlighter.getLoadedLanguages().includes(grammar)) {
+        await highlighter.loadLanguage(grammar);
+    }
+    await loadEmbedded(highlighter, grammar, text);
+    return highlighter.getLoadedLanguages().includes(grammar);
+}
+/*
+ * Colors with the viewer's highlighter, so a grammar loads once for both. A language Shiki has no
+ * grammar for, or a theme it cannot load, is plain text.
+ */
+export function shikiTokenizers(highlighter) {
+    return async (language, theme, text) => {
+        if (language === undefined || PLAIN_TEXT.has(language)) {
+            return null;
+        }
+        const grammar = documentLanguageOf(language);
+        const shiki = await highlighter();
+        try {
+            if (!shiki.getLoadedThemes().includes(theme)) {
+                await shiki.loadTheme(theme);
+            }
+            return (await loadGrammar(shiki, grammar, text)) ? lineTokenizer(shiki, grammar, theme) : null;
+        }
+        catch {
+            return null;
+        }
+    };
+}
+/* The colors of a theme's own rules by scope, so what a language server classifies is drawn in the theme's colors. */
+export function shikiScopeColors(highlighter) {
+    return async (theme) => {
+        const shiki = await highlighter();
+        try {
+            if (!shiki.getLoadedThemes().includes(theme)) {
+                await shiki.loadTheme(theme);
+            }
+            return scopeColorsOf(shiki.getTheme(theme).settings);
+        }
+        catch {
+            return null;
+        }
+    };
+}

package/dist/smart-keys.d.ts

@@ -0,0 +1,3 @@
+import type { EditorSmartKeys } from './types.ts';
+export declare const DEFAULT_SMART_KEYS: EditorSmartKeys;
+export declare function resolveSmartKeys(keys: Partial<EditorSmartKeys> | undefined): EditorSmartKeys;

package/dist/smart-keys.js

@@ -0,0 +1,14 @@
+export const DEFAULT_SMART_KEYS = {
+    autoPairBrackets: true,
+    autoPairQuotes: true,
+    surroundSelection: true,
+    tabOutOfClosers: true,
+    smartIndentOnEnter: true,
+    indentOnPaste: true,
+    smartSemicolon: true,
+    camelHumps: false
+};
+/* The keys with what a host left out filled in from the defaults. */
+export function resolveSmartKeys(keys) {
+    return { ...DEFAULT_SMART_KEYS, ...keys };
+}

package/dist/testing.d.ts

@@ -0,0 +1,34 @@
+import type { Editor, EditorOptions, SmartEditorEngineOptions } from './types.ts';
+export declare function createPage(): {
+    document: Document;
+    window: Window & typeof globalThis;
+    host: HTMLElement;
+};
+export interface KeyOptions {
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    altKey?: boolean;
+    shiftKey?: boolean;
+}
+export declare function press(window: Window, target: Element, key: string, options?: KeyOptions): boolean;
+export declare function release(window: Window, target: Element, key: string, options?: KeyOptions): void;
+export declare function typeInto(window: Window, target: Element, text: string): void;
+export declare function clipboard(window: Window, target: Element, type: 'copy' | 'cut' | 'paste', data?: {
+    text: string;
+}): {
+    prevented: boolean;
+    text: string;
+};
+export declare function pointer(window: Window, target: Element, type: 'pointerdown' | 'pointermove' | 'pointerup' | 'pointercancel', x: number, y: number, options?: KeyOptions): void;
+export interface MountedEditor {
+    editor: Editor;
+    page: ReturnType<typeof createPage>;
+    input: HTMLTextAreaElement;
+    viewport: HTMLElement;
+    press(key: string, modifiers?: KeyOptions): boolean;
+    release(key: string, modifiers?: KeyOptions): void;
+    type(text: string): void;
+    clip(type: 'copy' | 'cut' | 'paste', text?: string): string;
+    click(x: number, y: number, options?: KeyOptions): void;
+}
+export declare function mountEditor(options?: Partial<EditorOptions>, engineOptions?: Partial<SmartEditorEngineOptions>): MountedEditor;