@adecore/editor 0.42.0 → 0.44.0

package/src/keymap.ts

@@ -44,10 +44,15 @@ const ACTIONS: Partial<Record<KeymapId, KeyAction>> = {
     deleteLine: command('deleteLine'),
     moveLineUp: command('moveLineUp'),
     moveLineDown: command('moveLineDown'),
+    moveStatementUp: command('moveStatementUp'),
+    moveStatementDown: command('moveStatementDown'),
     toggleLineComment: command('toggleLineComment'),
     toggleBlockComment: command('toggleBlockComment'),
     joinLines: command('joinLines'),
     startNewLine: command('startNewLine'),
+    completeCurrentStatement: command('completeCurrentStatement'),
+    hippieCompletion: command('hippieCompletion'),
+    hippieBackwardCompletion: command('hippieBackwardCompletion'),
     startNewLineBefore: command('startNewLineBefore'),
     splitLine: command('splitLine'),
     toggleCase: command('toggleCase'),
@@ -60,6 +65,15 @@ const ACTIONS: Partial<Record<KeymapId, KeyAction>> = {
     expandSelection: command('expandSelection'),
     shrinkSelection: command('shrinkSelection'),
     matchBrace: { type: 'bracket' },
+    methodUp: view('methodUp'),
+    methodDown: view('methodDown'),
+    pasteAsPlainText: view('pasteAsPlainText'),
+    nextChange: view('nextChange'),
+    previousChange: view('previousChange'),
+    codeBlockStart: command('codeBlockStart'),
+    codeBlockEnd: command('codeBlockEnd'),
+    codeBlockStartWithSelection: command('codeBlockStartWithSelection'),
+    codeBlockEndWithSelection: command('codeBlockEndWithSelection'),
     selectNextOccurrence: command('selectNextOccurrence'),
     unselectOccurrence: command('unselectOccurrence'),
     selectAllOccurrences: command('selectAllOccurrences'),

package/src/layout.ts

@@ -57,8 +57,13 @@ export interface Inlay {
     composition?: boolean;
     /* A suggestion the host drew after the caret: text in the code face with no padding, which the caret stays in front of. */
     ghost?: boolean;
+    /* A square of this CSS color in place of the text, such as the color a literal in the code stands for. */
+    swatch?: string;
 }
 
+/* The side of a swatch in pixels, without its gaps. */
+export const SWATCH_SIZE = 12;
+
 /* A row of the host's own DOM above or below a line, as tall as the host makes it. */
 export interface BlockWidget {
     id: string;
@@ -366,10 +371,13 @@ export function scanDenseLine(
             const inlay = lineInlays[nextInlay++]!;
             const shown = visibleBidi(inlay.text);
 
+            const gaps = (inlay.gapLeft ?? 0) + (inlay.gapRight ?? 0);
             const width =
                 inlay.composition || inlay.ghost
                     ? metrics.measureText(shown)
-                    : Math.max(8, metrics.measureInlay(shown) + 12) + (inlay.gapLeft ?? 0) + (inlay.gapRight ?? 0);
+                    : inlay.swatch !== undefined
+                      ? SWATCH_SIZE + gaps
+                      : Math.max(8, metrics.measureInlay(shown) + 12) + gaps;
 
             geometry.inlays.push({ inlay, x, width, subRow: row });
             x += width;

package/src/outline.ts

@@ -215,6 +215,19 @@ export class Outline {
         this.version++;
     }
 
+    /* Where the named blocks of the structure declare their name, in no order: the stops of Method Up and Down. */
+    declarationStops(document: OutlineDocument): number[] {
+        return this.structure.flatMap((entry) => {
+            if (entry.name === undefined) {
+                return [];
+            }
+
+            const header = document.getLine(document.positionAt(entry.from).line);
+
+            return [header.start + Math.max(0, header.text.indexOf(entry.name))];
+        });
+    }
+
     /* Outermost first. Of two blocks that start on one line, only the larger one. */
     blocks(document: OutlineDocument): readonly OutlineBlock[] {
         if (this.cache?.version !== this.version) {

package/src/paint.ts

@@ -186,11 +186,20 @@ export function lineElement(
         }
 
         const span = document.createElement('span');
-        span.className = box.inlay.ghost ? 'se-ghost' : box.inlay.composition ? 'se-composition' : 'se-inlay';
+        span.className = box.inlay.ghost
+            ? 'se-ghost'
+            : box.inlay.composition
+              ? 'se-composition'
+              : box.inlay.swatch !== undefined
+                ? 'se-inlay se-swatch'
+                : 'se-inlay';
         span.dataset.inlayId = box.inlay.id;
         const { parts } = box.inlay;
 
-        if (parts === undefined) {
+        if (box.inlay.swatch !== undefined) {
+            span.style.backgroundColor = box.inlay.swatch;
+            span.setAttribute('aria-label', box.inlay.text);
+        } else if (parts === undefined) {
             span.textContent = visibleBidi(box.inlay.text);
         } else {
             parts.forEach((part, index) => {

package/src/text-queries.ts

@@ -0,0 +1,45 @@
+import type { DocumentModel } from '@adecore/editor-core';
+import type { EditorPosition, EditorPostfixOperand, EditorRange, EditorSurroundShape, EditorTextPlace, EditorUnwrapTarget } from './types.ts';
+
+/* How an editor turns the offsets of the text model into positions and back. */
+export interface Coordinates {
+    positionAt(offset: number): EditorPosition;
+    offsetAt(position: EditorPosition): number;
+}
+
+function rangeOf(coordinates: Coordinates, from: number, to: number): EditorRange {
+    return { start: coordinates.positionAt(from), end: coordinates.positionAt(to) };
+}
+
+export function placeAt(model: DocumentModel, coordinates: Coordinates, position: EditorPosition, language: string): EditorTextPlace {
+    return model.placeAt(coordinates.offsetAt(position), language);
+}
+
+export function postfixOperands(model: DocumentModel, coordinates: Coordinates, dot: EditorPosition, language: string): EditorPostfixOperand[] {
+    const at = coordinates.offsetAt(dot);
+
+    return model.postfixOperands(at, language).map((operand) => ({
+        range: rangeOf(coordinates, operand.from, operand.from + model.slice(operand.from, at).trimEnd().length),
+        statement: operand.statement
+    }));
+}
+
+export function surroundShape(model: DocumentModel, coordinates: Coordinates, range: EditorRange, language: string): EditorSurroundShape | null {
+    const shape = model.surroundShape(coordinates.offsetAt(range.start), coordinates.offsetAt(range.end), language);
+
+    return shape === null ? null : { range: rangeOf(coordinates, shape.from, shape.to), statements: shape.statements, expression: shape.expression };
+}
+
+export function unwrapTargets(
+    model: DocumentModel,
+    coordinates: Coordinates,
+    position: EditorPosition,
+    language: string,
+    indentUnit: string
+): EditorUnwrapTarget[] {
+    return model.unwrapTargets(coordinates.offsetAt(position), language, indentUnit).map((target) => ({
+        kind: target.kind,
+        range: rangeOf(coordinates, target.range.from, target.range.to),
+        edits: target.edits.map((edit) => ({ range: rangeOf(coordinates, edit.from, edit.to), text: edit.text }))
+    }));
+}

package/src/types.ts

@@ -1,6 +1,6 @@
 import type { EditorSearchClientOptions } from './search-client.ts';
 import type { Keymap } from './keymap-table.ts';
-import type { EditorCommand, FoldRole, WhitespaceCleanupOptions } from '@adecore/editor-core';
+import type { EditorCommand, FoldRole, TextPlaceKind, UnwrapKind, WhitespaceCleanupOptions } from '@adecore/editor-core';
 
 export type { EditorCommand, FoldRole };
 
@@ -28,7 +28,12 @@ export type EditorViewCommand =
     | 'toggleColumnMode'
     | 'increaseFontSize'
     | 'decreaseFontSize'
-    | 'resetFontSize';
+    | 'resetFontSize'
+    | 'methodUp'
+    | 'methodDown'
+    | 'nextChange'
+    | 'previousChange'
+    | 'pasteAsPlainText';
 
 /* How far a person may zoom the text, and whether the wheel does. */
 export interface EditorZoom {
@@ -283,6 +288,52 @@ export interface EditorContentChange {
     readonly text: string;
 }
 
+/* What the text at a position is written in, with embedded regions resolved, and whether it is code, a comment or a string. */
+export interface EditorTextPlace {
+    readonly language: string;
+    readonly kind: TextPlaceKind;
+}
+
+/* An expression that ends right before a dot. */
+export interface EditorPostfixOperand {
+    /* The expression, without the whitespace before the dot. */
+    readonly range: EditorRange;
+    /* Whether it starts a statement; only the widest operand can. */
+    readonly statement: boolean;
+}
+
+/* What a range can be surrounded with: whole statements, one expression, both or neither. */
+export interface EditorSurroundShape {
+    /* The range after trimming whitespace, widened past a trailing line comment for statements. */
+    readonly range: EditorRange;
+    readonly statements: boolean;
+    readonly expression: boolean;
+}
+
+/* A construct around a position that can be unwrapped or removed. */
+export interface EditorUnwrapTarget {
+    readonly kind: UnwrapKind;
+    /* The whole construct, for a preview. */
+    readonly range: EditorRange;
+    /* Small edits in the coordinates of the text before them, which `applyEdits` takes as they are. */
+    readonly edits: readonly EditorContentChange[];
+}
+
+/* What a copy or cut put on the clipboard. */
+export interface EditorCopy {
+    readonly text: string;
+    /* A copy of bare carets takes their lines, which paste back above the lines of bare carets. */
+    readonly wholeLines: boolean;
+    readonly cut: boolean;
+}
+
+export interface EditorPasteOptions {
+    /* Pastes above the lines of bare carets, as the paste of a copy of bare carets does; by default when the text is the last such copy. */
+    readonly wholeLines?: boolean;
+    /* False leaves the indentation of the text alone; the editor's indent on paste setting otherwise. */
+    readonly reindent?: boolean;
+}
+
 export interface EditorApplyEditsOptions {
     readonly mapSelections?: (range: EditorRange) => EditorRange;
     readonly mergeUndo?: boolean;
@@ -472,6 +523,8 @@ export interface EditorInlayHint {
     /* A gap of 4 pixels that keeps the pill off the character before it or the one after it. */
     readonly paddingLeft?: boolean;
     readonly paddingRight?: boolean;
+    /* A square of this CSS color in place of the label, such as the color a literal stands for; the label is then what assistive technology reads. */
+    readonly swatch?: string;
 }
 
 /* A hint, or one part of its label, under the pointer. */
@@ -649,6 +702,18 @@ export interface Editor {
     setLabel(label: string): void;
     /* What a language server knows about the folds: the bodies of symbols and the ranges it folds. They follow their text through edits until set again; null forgets them. */
     setFoldHints(hints: EditorFoldHints | null): void;
+    /* The places Method Up and Down stop at, such as the names of a language server's symbols. They follow their text through edits until set again; null goes back to the editor's own reading of the structure. Optional so an editor from before it still fits. */
+    setDeclarations?(positions: readonly EditorPosition[] | null): void;
+    /* A command that navigates (Method Up and Down, Code Block Start and End) moved the primary caret away from `from`. Optional so an editor from before it still fits. */
+    onNavigate?(listener: (from: EditorPosition) => void): () => void;
+    /* Whether the editor has the keyboard focus. Optional so an editor from before it still fits. */
+    hasFocus?(): boolean;
+    /* The texts of the other open documents, which Hippie completion takes words from after those of this one; null takes them away. Optional so an editor from before it still fits. */
+    setWordSources?(source: (() => readonly string[]) | null): void;
+    /* Told after a copy or cut, with the text it put on the clipboard. Optional so an editor from before it still fits. */
+    onCopy?(listener: (copy: EditorCopy) => void): () => void;
+    /* Pastes `text` as a paste from the clipboard does: at every caret, with indent on paste, and refused with its notice when the editor is read-only. False when nothing was pasted. Optional so an editor from before it still fits. */
+    paste?(text: string, options?: EditorPasteOptions): boolean;
     /*
      * Marks that follow their lines through edits until the host sets them again. Every layer (default: the unnamed one)
      * holds its own marks and the editor draws the union, so setting one layer never clears another; an empty list
@@ -699,7 +764,8 @@ export interface Editor {
     /* Colors by what the language servers know, over what the grammar made of the text; null takes them away. */
     setSemanticTokens(tokens: readonly EditorSemanticToken[] | null): void;
     /* Hints to draw as soft pills in the text, replacing the ones set before. They follow their text through edits until set again. */
-    setInlayHints(hints: readonly EditorInlayHint[]): void;
+    /* Each owner sets its own hints and keeps those of the others; ids stay unique across owners. */
+    setInlayHints(hints: readonly EditorInlayHint[], owner?: string): void;
     /* The pointer moved onto a hint or one of its parts, or null when it left them. Optional so an editor from before it still fits. */
     onInlayHover?(listener: (target: EditorInlayTarget | null) => void): () => void;
     /* Handlers see a press of the primary button on a hint before the editor does, the first to take it winning. */
@@ -808,6 +874,14 @@ export interface Editor {
     setReadOnly(readOnly: boolean, reason?: string): void;
     /* Whether the editor refuses edits. Optional so an editor from before it still fits. */
     isReadOnly?(): boolean;
+    /* What the text at a position is written in and whether it is code, a comment or a string. Optional so an editor from before it still fits. */
+    placeAt?(position: EditorPosition): EditorTextPlace;
+    /* Every expression that ends right before the `.` at `dot`, innermost first. Optional so an editor from before it still fits. */
+    postfixOperands?(dot: EditorPosition): readonly EditorPostfixOperand[];
+    /* What a range can be surrounded with; null for a blank range. Optional so an editor from before it still fits. */
+    surroundShape?(range: EditorRange): EditorSurroundShape | null;
+    /* What can be unwrapped or removed around a position, innermost first. Optional so an editor from before it still fits. */
+    unwrapTargets?(position: EditorPosition): readonly EditorUnwrapTarget[];
     /* Runs an editing command on every caret, as its key would. False when it changed nothing. */
     runCommand(command: EditorRunCommand): boolean;
     focus(): void;

package/src/view.ts

@@ -298,6 +298,7 @@ export class EditorView {
     private lenses: BlockWidget[] = [];
     private readonly replacements = new Map<string, BlockReplacement[]>();
     private occurrences: Occurrence[] = [];
+    private hippieSource: { from: number; to: number } | null = null;
     private replacePreview: { text: string; preserveCase: boolean } | null = null;
     private dropCaret: number | null = null;
     private activeGuideCache: { key: string; guide: { column: number; first: number; last: number } | null } | undefined;
@@ -316,6 +317,7 @@ export class EditorView {
     private collapsed = new Set<number>();
     /* What a language server said about the folds, in offsets that follow the text through edits. */
     private foldHints: FoldHints | null = null;
+    private declarations: number[] | null = null;
     /* The roles that fold by themselves while the file is as it was opened; null once a person edited or the file opened with folds of its own. */
     private defaultRoles: ReadonlySet<FoldRole> | null = null;
     /* The folds somebody already decided on, a person or the defaults, so a later answer of a server leaves them as they are. */
@@ -600,6 +602,16 @@ export class EditorView {
         this.render();
     }
 
+    /* The word Hippie completion took from this document, shown until the next key or edit; null takes the mark away. */
+    setHippieSource(range: { from: number; to: number } | null): void {
+        if (range === null && this.hippieSource === null) {
+            return;
+        }
+
+        this.hippieSource = range;
+        this.render();
+    }
+
     /* A name underlined as a link a press follows, with the pointer to match; null takes it away. */
     setLink(link: { from: number; to: number } | null): void {
         this.link = link;
@@ -849,6 +861,7 @@ export class EditorView {
             this.markerVersion++;
             const anchor = this.topAnchor;
             this.occurrences = [];
+            this.hippieSource = null;
             this.link = null;
             this.content.classList.remove('se-content-link');
             this.outline.edited(batches);
@@ -916,6 +929,10 @@ export class EditorView {
             this.foldHints = mapFoldHints(this.foldHints, map);
         }
 
+        if (this.declarations !== null) {
+            this.declarations = this.declarations.map((offset) => map(offset));
+        }
+
         this.customFolds = this.customFolds.map((fold) => mapRange(fold, map));
         this.find.mapBounds(changes);
 
@@ -1089,15 +1106,7 @@ export class EditorView {
             return;
         }
 
-        const ranges =
-            this.model.getLength() > FOLD_LIMIT
-                ? []
-                : this.model.getFoldingRanges({
-                      indentation: /^(python|py|yaml|yml)$/.test(this.settings.language ?? ''),
-                      tabSize: this.settings.tabSize,
-                      ...(this.settings.language === undefined ? {} : { language: this.settings.language }),
-                      ...(this.foldHints === null ? {} : { hints: this.foldHints })
-                  });
+        const ranges = this.structureRanges();
 
         this.foldRanges = this.withCustomFolds(ranges);
 
@@ -1115,6 +1124,20 @@ export class EditorView {
         this.refoldLayout();
     }
 
+    /* The folding ranges the document has now, a server's included, whether or not the folds are drawn. */
+    structureRanges(): FoldingRange[] {
+        if (this.model.getLength() > FOLD_LIMIT) {
+            return [];
+        }
+
+        return this.model.getFoldingRanges({
+            indentation: /^(python|py|yaml|yml)$/.test(this.settings.language ?? ''),
+            tabSize: this.settings.tabSize,
+            ...(this.settings.language === undefined ? {} : { language: this.settings.language }),
+            ...(this.foldHints === null ? {} : { hints: this.foldHints })
+        });
+    }
+
     /* The folds a person made of a selection, which the document's own structure does not know, among the ones it does. */
     private withCustomFolds(ranges: readonly FoldingRange[]): ViewFold[] {
         const custom = this.customFolds.flatMap((fold): ViewFold[] => {
@@ -1383,6 +1406,65 @@ export class EditorView {
         this.refoldLayout();
     }
 
+    /* The places Method Up and Down stop at; they follow their text through edits until set again, and null goes back to the editor's own reading. */
+    setDeclarations(offsets: readonly number[] | null): void {
+        this.declarations = offsets === null ? null : [...new Set(offsets)].sort((left, right) => left - right);
+    }
+
+    private methodStops(): number[] {
+        if (this.declarations !== null) {
+            return this.declarations;
+        }
+
+        const sections = this.foldRanges.filter((range) => range.kind === 'section').map((range) => this.model.getLine(range.startLine).start);
+
+        return [...new Set([...this.outline.declarationStops(this.model), ...sections])].sort((left, right) => left - right);
+    }
+
+    /* Moves the one caret to the first line of the next or previous change mark, of any layer. False when there is none. */
+    goToChange(direction: -1 | 1): boolean {
+        const line = this.model.positionAt(this.model.getPrimary().head).line;
+        const { runs } = this.resolvedChanges();
+
+        // A run the caret is in is where it already is; a deleted run is the line its mark sits on.
+        const target = direction === 1 ? runs.find((run) => run.start > line) : runs.findLast((run) => (run.kind === 'deleted' ? run.start : run.end) < line);
+
+        if (target === undefined) {
+            return false;
+        }
+
+        const offset = this.model.getLine(Math.min(target.start, this.model.getLineCount() - 1)).start;
+        this.model.setSelections([{ anchor: offset, head: offset }]);
+        this.revealOffset(offset, 'center');
+
+        return true;
+    }
+
+    /* Moves the one caret to the previous or next declaration on another line. False when there is none. */
+    goToMethod(direction: -1 | 1): boolean {
+        // The structure is read after a pause in typing, so a press right after an edit reads it now.
+        if (this.declarations === null) {
+            this.refreshFolds();
+        }
+
+        const line = this.model.positionAt(this.model.getPrimary().head).line;
+        const stops = this.methodStops();
+
+        const target =
+            direction === 1
+                ? stops.find((offset) => this.model.positionAt(offset).line > line)
+                : stops.findLast((offset) => this.model.positionAt(offset).line < line);
+
+        if (target === undefined) {
+            return false;
+        }
+
+        this.model.setSelections([{ anchor: target, head: target }]);
+        this.revealOffset(target, direction === 1 ? 'centerDown' : 'centerUp');
+
+        return true;
+    }
+
     /* Hands over what a language server knows about the folds; null forgets it. The defaults fold what the answer names, once. */
     setFoldHints(hints: FoldHints | null): void {
         this.foldHints = hints;
@@ -2480,6 +2562,10 @@ export class EditorView {
             }
         }
 
+        if (this.hippieSource !== null) {
+            marks.push({ className: 'se-hippie-source', rects: this.paintRectangles(this.hippieSource.from, this.hippieSource.to, rows) });
+        }
+
         const marginX = this.settings.rightMargin === null ? null : this.settings.rightMargin * this.layout.metrics.charWidth;
 
         // A margin past the content would stretch the scroll extent to itself, so it shows only where the text or the view reaches it.