@adecore/editor-core 0.44.0 → 0.44.2

package/dist/document.d.ts

@@ -97,6 +97,7 @@ export declare class DocumentModel {
     typeText(text: string, options?: TypeTextOptions): boolean;
     private takeBackArrows;
     private completeArrows;
+    private completeTemplates;
     paste(text: string, options?: CommandOptions & {
         wholeLines?: boolean;
     }): boolean;

package/dist/document.js

@@ -14,7 +14,7 @@ import { blockFolds } from './block-folds.js';
 import { applyFoldHints, markFileHeader } from './fold-roles.js';
 import { lexicalFolds } from './lexical-folds.js';
 import { rangeOf, whitespaceOf } from './line-text.js';
-import { isQuote, replacesComparison, surround, swapQuotes } from './typing-handlers.js';
+import { isQuote, replacesComparison, surround, swapQuotes, templateLiteralEdits, templateString } from './typing-handlers.js';
 import { scanBrackets } from './brackets.js';
 import { BracketTracker } from './bracket-tracker.js';
 import { hasSmartSemicolon, isPhp } from './lexical.js';
@@ -58,6 +58,10 @@ function trailingBlankLength(text) {
 function changesText(rope, edit) {
     return edit.text.length !== edit.to - edit.from || rope.slice(edit.from, edit.to) !== edit.text;
 }
+/* Where an offset stands after edits that end at or before it moved it; an insertion at the offset pushes it on. */
+function shifted(edits, offset) {
+    return edits.reduce((moved, edit) => (edit.to <= offset ? moved + edit.text.length - (edit.to - edit.from) : moved), offset);
+}
 /* Merges the carets' edits into one simultaneous batch and works out where each caret lands in the result. */
 function selectionTransaction(plans) {
     const edits = [];
@@ -591,7 +595,8 @@ export class DocumentModel {
     /*
      * Types `text` at every caret as one keystroke would: it wraps a selection in a bracket or quote,
      * closes an opener, types over a closer that is already there and, in TypeScript, JavaScript and
-     * PHP, moves a `;` to the end of a statement. In PHP a `-` after a variable becomes `->`. Comments
+     * PHP, moves a `;` to the end of a statement. In PHP a `-` after a variable becomes `->`. In JavaScript and
+     * TypeScript a `{` that completes `${` in a quoted string makes it a template literal. Comments
      * and string contents are left alone. Returns whether anything changed, a swallowed closer included.
      */
     typeText(text, options = {}) {
@@ -617,6 +622,7 @@ export class DocumentModel {
             surround: options.surroundSelection !== false && single,
             smartSemicolon: options.smartSemicolon !== false && hasSmartSemicolon(language),
             smartArrow: options.smartArrow !== false && single && isPhp(language),
+            templateLiterals: options.templateLiterals !== false && text === '{',
             overArrows: text === '>' ? arrows : new Set(),
             dedent: options.smartEnter !== false
         };
@@ -630,6 +636,7 @@ export class DocumentModel {
             this.rememberStatementClosers(plans, transaction, language);
             this.rememberPairs(plans, transaction);
             this.completeArrows(plans, transaction);
+            this.completeTemplates(plans, transaction, language);
         }
         return changed || plans.some((plan) => plan.consumed);
     }
@@ -654,6 +661,23 @@ export class DocumentModel {
             this.arrows = new Set(at.map(moved));
         }
     }
+    /* Turns the quoted strings a `${` was typed in into template literals, as a step of their own so the first undo leaves the quotes back. */
+    completeTemplates(plans, transaction, language) {
+        // Carets in one string find the same quotes.
+        const strings = new Map();
+        for (const plan of plans) {
+            if (plan.template) {
+                strings.set(shifted(transaction.edits, plan.template.open), shifted(transaction.edits, plan.template.close));
+            }
+        }
+        const source = this.editSource(language);
+        const edits = [...strings].flatMap(([open, close]) => templateLiteralEdits(source, open, close));
+        if (edits.length > 0) {
+            // A caret right before a closing quote stays there, which the default mapping of an edit that replaces the quote would not do.
+            const selections = this.selections.map((selection) => ({ anchor: shifted(edits, selection.anchor), head: shifted(edits, selection.head) }));
+            this.applyEdits(edits, { source: 'input', selections });
+        }
+    }
     /*
      * Pastes `text` at every selection. With as many lines as carets each caret takes one; `wholeLines`
      * marks text copied from a bare caret, which goes above the lines of bare carets.
@@ -844,6 +868,12 @@ export class DocumentModel {
                 return wrapped;
             }
         }
+        if (input.templateLiterals && from === to) {
+            const template = templateString(this.editSource(language), from, language);
+            if (template) {
+                return { from, to, text: input.brackets ? '{}' : '{', anchor: 1, head: 1, paired: input.brackets, template };
+            }
+        }
         if (pairing && pairs[text] !== undefined && from === to && this.shouldClosePair(from, text, after, context, input)) {
             return { from, to, text: text + pairs[text], anchor: 1, head: 1, paired: true };
         }

package/dist/types.d.ts

@@ -57,6 +57,7 @@ export interface CommandOptions {
     language?: string;
     smartSemicolon?: boolean;
     smartArrow?: boolean;
+    templateLiterals?: boolean;
     tabOutOfClosers?: boolean;
     smartEnter?: boolean;
     indentOnPaste?: boolean;

package/dist/typing-handlers.d.ts

@@ -1,4 +1,5 @@
 import type { EditSource } from './edit-source.ts';
+import type { TextEdit } from './types.ts';
 export interface HandlerEdit {
     from: number;
     to: number;
@@ -13,3 +14,8 @@ export declare function surround(selected: string, typed: string): {
     text: string;
     inner: string;
 };
+export declare function templateString(source: EditSource, offset: number, language: string): {
+    open: number;
+    close: number;
+} | null;
+export declare function templateLiteralEdits(source: EditSource, open: number, close: number): TextEdit[];

package/dist/typing-handlers.js

@@ -123,3 +123,66 @@ export function surround(selected, typed) {
     }
     return { text: typed + inner + matchingDelimiter(typed), inner };
 }
+const scriptLanguages = /^(javascript|typescript|jsx|tsx|javascriptreact|typescriptreact|js|ts|mjs|cjs|mts|cts)$/i;
+const moduleSpecifier = /(?:\bfrom|\bimport|\brequire)\s*\(?\s*$/;
+/*
+ * The quotes of the string a `${` is typed in when that makes it a template literal: a single- or
+ * double-quoted string of a script, closed on its line and not the specifier of a module.
+ */
+export function templateString(source, offset, language) {
+    const line = source.lineAt(offset);
+    const script = scriptLanguages.test(language) || (/^vue$/i.test(language) && source.region(line) === 'script');
+    const { start, end } = source.line(line);
+    const before = source.slice(start, offset);
+    if (!script || !before.endsWith('$') || escapedIn(before, before.length - 1)) {
+        return null;
+    }
+    const context = source.context(offset);
+    if (context.mode !== 'quote' || context.escaped || (context.quote !== "'" && context.quote !== '"')) {
+        return null;
+    }
+    let open = before.length - 1;
+    while (open >= 0 && (before[open] !== context.quote || escapedIn(before, open))) {
+        open--;
+    }
+    if (open < 0 || moduleSpecifier.test(before.slice(0, open))) {
+        return null;
+    }
+    const after = source.slice(offset, end);
+    for (let at = 0; at < after.length; at++) {
+        if (after[at] === '\\') {
+            at++;
+        }
+        else if (after[at] === context.quote) {
+            return { open: start + open, close: offset + at };
+        }
+    }
+    return null;
+}
+function escapedIn(text, index) {
+    let slashes = 0;
+    while (index - slashes - 1 >= 0 && text[index - slashes - 1] === '\\') {
+        slashes++;
+    }
+    return slashes % 2 === 1;
+}
+/* The edits that make the string between the quotes at `open` and `close` a template literal: its backticks are escaped and its escaped old quotes are not. */
+export function templateLiteralEdits(source, open, close) {
+    const quote = source.charAt(open);
+    const body = source.slice(open + 1, close);
+    const edits = [{ from: open, to: open + 1, text: '`' }];
+    for (let index = 0; index < body.length; index++) {
+        const at = open + 1 + index;
+        if (body[index] === '\\') {
+            if (body[index + 1] === quote) {
+                edits.push({ from: at, to: at + 1, text: '' });
+            }
+            index++;
+        }
+        else if (body[index] === '`') {
+            edits.push({ from: at, to: at + 1, text: '\\`' });
+        }
+    }
+    edits.push({ from: close, to: close + 1, text: '`' });
+    return edits;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adecore/editor-core",
-  "version": "0.44.0",
+  "version": "0.44.2",
   "type": "module",
   "exports": {
     ".": {

package/src/document.ts

@@ -16,7 +16,7 @@ import { blockFolds } from './block-folds.ts';
 import { applyFoldHints, markFileHeader } from './fold-roles.ts';
 import { lexicalFolds } from './lexical-folds.ts';
 import { rangeOf, whitespaceOf } from './line-text.ts';
-import { isQuote, replacesComparison, surround, swapQuotes } from './typing-handlers.ts';
+import { isQuote, replacesComparison, surround, swapQuotes, templateLiteralEdits, templateString } from './typing-handlers.ts';
 import { scanBrackets } from './brackets.ts';
 import type { BracketIndex, BracketMatch } from './brackets.ts';
 import { BracketTracker } from './bracket-tracker.ts';
@@ -109,6 +109,8 @@ interface SelectionEdit extends TextEdit {
     paired?: boolean;
     /* A `-` the editor completes to `->` in a step of its own, once the `-` is in. */
     arrow?: boolean;
+    /* A `${` typed in a quoted string, which becomes a template literal in a step of its own; where its quotes stand before the edit. */
+    template?: { open: number; close: number };
 }
 
 interface SelectionTransaction {
@@ -130,6 +132,7 @@ interface TypingInput {
     surround: boolean;
     smartSemicolon: boolean;
     smartArrow: boolean;
+    templateLiterals: boolean;
     /* The carets right after a `->` the editor completed, where a typed `>` goes over the one that is there. */
     overArrows: ReadonlySet<number>;
     /* A closing bracket typed on a line of its own goes back to the indentation of its opener. */
@@ -187,6 +190,11 @@ function changesText(rope: TextRope, edit: TextEdit): boolean {
     return edit.text.length !== edit.to - edit.from || rope.slice(edit.from, edit.to) !== edit.text;
 }
 
+/* Where an offset stands after edits that end at or before it moved it; an insertion at the offset pushes it on. */
+function shifted(edits: readonly TextEdit[], offset: number): number {
+    return edits.reduce((moved, edit) => (edit.to <= offset ? moved + edit.text.length - (edit.to - edit.from) : moved), offset);
+}
+
 /* Merges the carets' edits into one simultaneous batch and works out where each caret lands in the result. */
 function selectionTransaction(plans: readonly SelectionEdit[]): SelectionTransaction {
     const edits: TextEdit[] = [];
@@ -883,7 +891,8 @@ export class DocumentModel {
     /*
      * Types `text` at every caret as one keystroke would: it wraps a selection in a bracket or quote,
      * closes an opener, types over a closer that is already there and, in TypeScript, JavaScript and
-     * PHP, moves a `;` to the end of a statement. In PHP a `-` after a variable becomes `->`. Comments
+     * PHP, moves a `;` to the end of a statement. In PHP a `-` after a variable becomes `->`. In JavaScript and
+     * TypeScript a `{` that completes `${` in a quoted string makes it a template literal. Comments
      * and string contents are left alone. Returns whether anything changed, a swallowed closer included.
      */
     typeText(text: string, options: TypeTextOptions = {}): boolean {
@@ -914,6 +923,7 @@ export class DocumentModel {
             surround: options.surroundSelection !== false && single,
             smartSemicolon: options.smartSemicolon !== false && hasSmartSemicolon(language),
             smartArrow: options.smartArrow !== false && single && isPhp(language),
+            templateLiterals: options.templateLiterals !== false && text === '{',
             overArrows: text === '>' ? arrows : new Set(),
             dedent: options.smartEnter !== false
         };
@@ -935,6 +945,7 @@ export class DocumentModel {
             this.rememberStatementClosers(plans, transaction, language);
             this.rememberPairs(plans, transaction);
             this.completeArrows(plans, transaction);
+            this.completeTemplates(plans, transaction, language);
         }
 
         return changed || plans.some((plan) => plan.consumed);
@@ -972,6 +983,27 @@ export class DocumentModel {
         }
     }
 
+    /* Turns the quoted strings a `${` was typed in into template literals, as a step of their own so the first undo leaves the quotes back. */
+    private completeTemplates(plans: readonly SelectionEdit[], transaction: SelectionTransaction, language: string): void {
+        // Carets in one string find the same quotes.
+        const strings = new Map<number, number>();
+
+        for (const plan of plans) {
+            if (plan.template) {
+                strings.set(shifted(transaction.edits, plan.template.open), shifted(transaction.edits, plan.template.close));
+            }
+        }
+
+        const source = this.editSource(language);
+        const edits = [...strings].flatMap(([open, close]) => templateLiteralEdits(source, open, close));
+
+        if (edits.length > 0) {
+            // A caret right before a closing quote stays there, which the default mapping of an edit that replaces the quote would not do.
+            const selections = this.selections.map((selection) => ({ anchor: shifted(edits, selection.anchor), head: shifted(edits, selection.head) }));
+            this.applyEdits(edits, { source: 'input', selections });
+        }
+    }
+
     /*
      * Pastes `text` at every selection. With as many lines as carets each caret takes one; `wholeLines`
      * marks text copied from a bare caret, which goes above the lines of bare carets.
@@ -1233,6 +1265,14 @@ export class DocumentModel {
             }
         }
 
+        if (input.templateLiterals && from === to) {
+            const template = templateString(this.editSource(language), from, language);
+
+            if (template) {
+                return { from, to, text: input.brackets ? '{}' : '{', anchor: 1, head: 1, paired: input.brackets, template };
+            }
+        }
+
         if (pairing && pairs[text] !== undefined && from === to && this.shouldClosePair(from, text, after, context, input)) {
             return { from, to, text: text + pairs[text], anchor: 1, head: 1, paired: true };
         }

package/src/types.ts

@@ -147,6 +147,8 @@ export interface CommandOptions {
     smartSemicolon?: boolean;
     /* In PHP a `-` typed after a variable, a member or a `)` or `]` becomes `->`. On unless false. */
     smartArrow?: boolean;
+    /* In JavaScript and TypeScript a `${` typed in a quoted string makes it a template literal, in a second undo step. On unless false. */
+    templateLiterals?: boolean;
     /* Tab steps over a closer the editor inserted. On unless false. */
     tabOutOfClosers?: boolean;
     /* Enter computes the indentation of the new line, continues comments and closes braces. On unless false. */

package/src/typing-handlers.ts

@@ -1,4 +1,5 @@
 import type { EditSource } from './edit-source.ts';
+import type { TextEdit } from './types.ts';
 
 /* A change of text in one place and where the caret stands in what replaces it. */
 export interface HandlerEdit {
@@ -169,3 +170,85 @@ export function surround(selected: string, typed: string): { text: string; inner
 
     return { text: typed + inner + matchingDelimiter(typed), inner };
 }
+
+const scriptLanguages = /^(javascript|typescript|jsx|tsx|javascriptreact|typescriptreact|js|ts|mjs|cjs|mts|cts)$/i;
+const moduleSpecifier = /(?:\bfrom|\bimport|\brequire)\s*\(?\s*$/;
+
+/*
+ * The quotes of the string a `${` is typed in when that makes it a template literal: a single- or
+ * double-quoted string of a script, closed on its line and not the specifier of a module.
+ */
+export function templateString(source: EditSource, offset: number, language: string): { open: number; close: number } | null {
+    const line = source.lineAt(offset);
+    const script = scriptLanguages.test(language) || (/^vue$/i.test(language) && source.region(line) === 'script');
+
+    const { start, end } = source.line(line);
+    const before = source.slice(start, offset);
+
+    if (!script || !before.endsWith('$') || escapedIn(before, before.length - 1)) {
+        return null;
+    }
+
+    const context = source.context(offset);
+
+    if (context.mode !== 'quote' || context.escaped || (context.quote !== "'" && context.quote !== '"')) {
+        return null;
+    }
+
+    let open = before.length - 1;
+
+    while (open >= 0 && (before[open] !== context.quote || escapedIn(before, open))) {
+        open--;
+    }
+
+    if (open < 0 || moduleSpecifier.test(before.slice(0, open))) {
+        return null;
+    }
+
+    const after = source.slice(offset, end);
+
+    for (let at = 0; at < after.length; at++) {
+        if (after[at] === '\\') {
+            at++;
+        } else if (after[at] === context.quote) {
+            return { open: start + open, close: offset + at };
+        }
+    }
+
+    return null;
+}
+
+function escapedIn(text: string, index: number): boolean {
+    let slashes = 0;
+
+    while (index - slashes - 1 >= 0 && text[index - slashes - 1] === '\\') {
+        slashes++;
+    }
+
+    return slashes % 2 === 1;
+}
+
+/* The edits that make the string between the quotes at `open` and `close` a template literal: its backticks are escaped and its escaped old quotes are not. */
+export function templateLiteralEdits(source: EditSource, open: number, close: number): TextEdit[] {
+    const quote = source.charAt(open);
+    const body = source.slice(open + 1, close);
+    const edits: TextEdit[] = [{ from: open, to: open + 1, text: '`' }];
+
+    for (let index = 0; index < body.length; index++) {
+        const at = open + 1 + index;
+
+        if (body[index] === '\\') {
+            if (body[index + 1] === quote) {
+                edits.push({ from: at, to: at + 1, text: '' });
+            }
+
+            index++;
+        } else if (body[index] === '`') {
+            edits.push({ from: at, to: at + 1, text: '\\`' });
+        }
+    }
+
+    edits.push({ from: close, to: close + 1, text: '`' });
+
+    return edits;
+}