@codemirror/autocomplete 6.12.0 → 6.14.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+## 6.14.0 (2024-03-10)
+
+### New features
+
+Completion results can now define a `map` method that can be used to adjust position-dependent information for document changes.
+
+## 6.13.0 (2024-02-29)
+
+### New features
+
+Completions may now provide 'commit characters' that, when typed, commit the completion before inserting the character.
+
 ## 6.12.0 (2024-01-12)
 
 ### Bug fixes

package/dist/index.cjs

@@ -909,26 +909,33 @@ class ActiveResult extends ActiveSource {
     hasResult() { return true; }
     handleUserEvent(tr, type, conf) {
         var _a;
+        let result = this.result;
+        if (result.map && !tr.changes.empty)
+            result = result.map(result, tr.changes);
         let from = tr.changes.mapPos(this.from), to = tr.changes.mapPos(this.to, 1);
         let pos = cur(tr.state);
         if ((this.explicitPos < 0 ? pos <= from : pos < this.from) ||
-            pos > to ||
+            pos > to || !result ||
             type == "delete" && cur(tr.startState) == this.from)
             return new ActiveSource(this.source, type == "input" && conf.activateOnTyping ? 1 /* State.Pending */ : 0 /* State.Inactive */);
-        let explicitPos = this.explicitPos < 0 ? -1 : tr.changes.mapPos(this.explicitPos), updated;
-        if (checkValid(this.result.validFor, tr.state, from, to))
-            return new ActiveResult(this.source, explicitPos, this.result, from, to);
-        if (this.result.update &&
-            (updated = this.result.update(this.result, from, to, new CompletionContext(tr.state, pos, explicitPos >= 0))))
-            return new ActiveResult(this.source, explicitPos, updated, updated.from, (_a = updated.to) !== null && _a !== void 0 ? _a : cur(tr.state));
+        let explicitPos = this.explicitPos < 0 ? -1 : tr.changes.mapPos(this.explicitPos);
+        if (checkValid(result.validFor, tr.state, from, to))
+            return new ActiveResult(this.source, explicitPos, result, from, to);
+        if (result.update &&
+            (result = result.update(result, from, to, new CompletionContext(tr.state, pos, explicitPos >= 0))))
+            return new ActiveResult(this.source, explicitPos, result, result.from, (_a = result.to) !== null && _a !== void 0 ? _a : cur(tr.state));
         return new ActiveSource(this.source, 1 /* State.Pending */, explicitPos);
     }
     handleChange(tr) {
         return tr.changes.touchesRange(this.from, this.to) ? new ActiveSource(this.source, 0 /* State.Inactive */) : this.map(tr.changes);
     }
     map(mapping) {
-        return mapping.empty ? this :
-            new ActiveResult(this.source, this.explicitPos < 0 ? -1 : mapping.mapPos(this.explicitPos), this.result, mapping.mapPos(this.from), mapping.mapPos(this.to, 1));
+        if (mapping.empty)
+            return this;
+        let result = this.result.map ? this.result.map(this.result, mapping) : this.result;
+        if (!result)
+            return new ActiveSource(this.source, 0 /* State.Inactive */);
+        return new ActiveResult(this.source, this.explicitPos < 0 ? -1 : mapping.mapPos(this.explicitPos), this.result, mapping.mapPos(this.from), mapping.mapPos(this.to, 1));
     }
 }
 function checkValid(validFor, state, from, to) {
@@ -1179,6 +1186,21 @@ const completionPlugin = view.ViewPlugin.fromClass(class {
         }
     }
 });
+const windows = typeof navigator == "object" && /Win/.test(navigator.platform);
+const commitCharacters = state.Prec.highest(view.EditorView.domEventHandlers({
+    keydown(event, view) {
+        let field = view.state.field(completionState, false);
+        if (!field || !field.open || field.open.disabled || field.open.selected < 0 ||
+            event.key.length > 1 || event.ctrlKey && !(windows && event.altKey) || event.metaKey)
+            return false;
+        let option = field.open.options[field.open.selected];
+        let result = field.active.find(a => a.source == option.source);
+        let commitChars = option.completion.commitCharacters || result.result.commitCharacters;
+        if (commitChars && commitChars.indexOf(event.key) > -1)
+            applyCompletion(view, option);
+        return false;
+    }
+}));
 
 const baseTheme = view.EditorView.baseTheme({
     ".cm-tooltip.cm-tooltip-autocomplete": {
@@ -1900,6 +1922,7 @@ Returns an extension that enables autocompletion.
 */
 function autocompletion(config = {}) {
     return [
+        commitCharacters,
         completionState,
         completionConfig.of(config),
         completionPlugin,

package/dist/index.d.cts

@@ -1,5 +1,5 @@
 import * as _codemirror_state from '@codemirror/state';
-import { EditorState, TransactionSpec, Transaction, StateCommand, Facet, Extension, StateEffect } from '@codemirror/state';
+import { EditorState, ChangeDesc, TransactionSpec, Transaction, StateCommand, Facet, Extension, StateEffect } from '@codemirror/state';
 import { EditorView, Rect, KeyBinding, Command } from '@codemirror/view';
 import * as _lezer_common from '@lezer/common';
 
@@ -54,6 +54,11 @@ interface Completion {
     */
     type?: string;
     /**
+    When this option is selected, and one of these characters is
+    typed, insert the completion before typing the character.
+    */
+    commitCharacters?: readonly string[];
+    /**
     When given, should be a number from -99 to 99 that adjusts how
     this completion is ranked compared to other completions that
     match the input as well as this one. A negative number moves it
@@ -255,6 +260,20 @@ interface CompletionResult {
     completion still applies in the new state.
     */
     update?: (current: CompletionResult, from: number, to: number, context: CompletionContext) => CompletionResult | null;
+    /**
+    When results contain position-dependent information in, for
+    example, `apply` methods, you can provide this method to update
+    the result for transactions that happen after the query. It is
+    not necessary to update `from` and `to`—those are tracked
+    automatically.
+    */
+    map?: (current: CompletionResult, changes: ChangeDesc) => CompletionResult | null;
+    /**
+    Set a default set of [commit
+    characters](https://codemirror.net/6/docs/ref/#autocomplete.Completion.commitCharacters) for all
+    options in this result.
+    */
+    commitCharacters?: readonly string[];
 }
 /**
 This annotation is added to transactions that are produced by

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as _codemirror_state from '@codemirror/state';
-import { EditorState, TransactionSpec, Transaction, StateCommand, Facet, Extension, StateEffect } from '@codemirror/state';
+import { EditorState, ChangeDesc, TransactionSpec, Transaction, StateCommand, Facet, Extension, StateEffect } from '@codemirror/state';
 import { EditorView, Rect, KeyBinding, Command } from '@codemirror/view';
 import * as _lezer_common from '@lezer/common';
 
@@ -54,6 +54,11 @@ interface Completion {
     */
     type?: string;
     /**
+    When this option is selected, and one of these characters is
+    typed, insert the completion before typing the character.
+    */
+    commitCharacters?: readonly string[];
+    /**
     When given, should be a number from -99 to 99 that adjusts how
     this completion is ranked compared to other completions that
     match the input as well as this one. A negative number moves it
@@ -255,6 +260,20 @@ interface CompletionResult {
     completion still applies in the new state.
     */
     update?: (current: CompletionResult, from: number, to: number, context: CompletionContext) => CompletionResult | null;
+    /**
+    When results contain position-dependent information in, for
+    example, `apply` methods, you can provide this method to update
+    the result for transactions that happen after the query. It is
+    not necessary to update `from` and `to`—those are tracked
+    automatically.
+    */
+    map?: (current: CompletionResult, changes: ChangeDesc) => CompletionResult | null;
+    /**
+    Set a default set of [commit
+    characters](https://codemirror.net/6/docs/ref/#autocomplete.Completion.commitCharacters) for all
+    options in this result.
+    */
+    commitCharacters?: readonly string[];
 }
 /**
 This annotation is added to transactions that are produced by

package/dist/index.js

@@ -907,26 +907,33 @@ class ActiveResult extends ActiveSource {
     hasResult() { return true; }
     handleUserEvent(tr, type, conf) {
         var _a;
+        let result = this.result;
+        if (result.map && !tr.changes.empty)
+            result = result.map(result, tr.changes);
         let from = tr.changes.mapPos(this.from), to = tr.changes.mapPos(this.to, 1);
         let pos = cur(tr.state);
         if ((this.explicitPos < 0 ? pos <= from : pos < this.from) ||
-            pos > to ||
+            pos > to || !result ||
             type == "delete" && cur(tr.startState) == this.from)
             return new ActiveSource(this.source, type == "input" && conf.activateOnTyping ? 1 /* State.Pending */ : 0 /* State.Inactive */);
-        let explicitPos = this.explicitPos < 0 ? -1 : tr.changes.mapPos(this.explicitPos), updated;
-        if (checkValid(this.result.validFor, tr.state, from, to))
-            return new ActiveResult(this.source, explicitPos, this.result, from, to);
-        if (this.result.update &&
-            (updated = this.result.update(this.result, from, to, new CompletionContext(tr.state, pos, explicitPos >= 0))))
-            return new ActiveResult(this.source, explicitPos, updated, updated.from, (_a = updated.to) !== null && _a !== void 0 ? _a : cur(tr.state));
+        let explicitPos = this.explicitPos < 0 ? -1 : tr.changes.mapPos(this.explicitPos);
+        if (checkValid(result.validFor, tr.state, from, to))
+            return new ActiveResult(this.source, explicitPos, result, from, to);
+        if (result.update &&
+            (result = result.update(result, from, to, new CompletionContext(tr.state, pos, explicitPos >= 0))))
+            return new ActiveResult(this.source, explicitPos, result, result.from, (_a = result.to) !== null && _a !== void 0 ? _a : cur(tr.state));
         return new ActiveSource(this.source, 1 /* State.Pending */, explicitPos);
     }
     handleChange(tr) {
         return tr.changes.touchesRange(this.from, this.to) ? new ActiveSource(this.source, 0 /* State.Inactive */) : this.map(tr.changes);
     }
     map(mapping) {
-        return mapping.empty ? this :
-            new ActiveResult(this.source, this.explicitPos < 0 ? -1 : mapping.mapPos(this.explicitPos), this.result, mapping.mapPos(this.from), mapping.mapPos(this.to, 1));
+        if (mapping.empty)
+            return this;
+        let result = this.result.map ? this.result.map(this.result, mapping) : this.result;
+        if (!result)
+            return new ActiveSource(this.source, 0 /* State.Inactive */);
+        return new ActiveResult(this.source, this.explicitPos < 0 ? -1 : mapping.mapPos(this.explicitPos), this.result, mapping.mapPos(this.from), mapping.mapPos(this.to, 1));
     }
 }
 function checkValid(validFor, state, from, to) {
@@ -1177,6 +1184,21 @@ const completionPlugin = /*@__PURE__*/ViewPlugin.fromClass(class {
         }
     }
 });
+const windows = typeof navigator == "object" && /*@__PURE__*//Win/.test(navigator.platform);
+const commitCharacters = /*@__PURE__*/Prec.highest(/*@__PURE__*/EditorView.domEventHandlers({
+    keydown(event, view) {
+        let field = view.state.field(completionState, false);
+        if (!field || !field.open || field.open.disabled || field.open.selected < 0 ||
+            event.key.length > 1 || event.ctrlKey && !(windows && event.altKey) || event.metaKey)
+            return false;
+        let option = field.open.options[field.open.selected];
+        let result = field.active.find(a => a.source == option.source);
+        let commitChars = option.completion.commitCharacters || result.result.commitCharacters;
+        if (commitChars && commitChars.indexOf(event.key) > -1)
+            applyCompletion(view, option);
+        return false;
+    }
+}));
 
 const baseTheme = /*@__PURE__*/EditorView.baseTheme({
     ".cm-tooltip.cm-tooltip-autocomplete": {
@@ -1898,6 +1920,7 @@ Returns an extension that enables autocompletion.
 */
 function autocompletion(config = {}) {
     return [
+        commitCharacters,
         completionState,
         completionConfig.of(config),
         completionPlugin,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codemirror/autocomplete",
-  "version": "6.12.0",
+  "version": "6.14.0",
   "description": "Autocompletion for the CodeMirror code editor",
   "scripts": {
     "test": "cm-runtests",