@codemirror/autocomplete 0.19.14 → 0.20.1

package/dist/index.js

@@ -1,8 +1,6 @@
-import { Annotation, Facet, combineConfig, StateEffect, StateField, Prec, EditorSelection, Text, MapMode } from '@codemirror/state';
-import { Direction, logException, EditorView, ViewPlugin, Decoration, WidgetType, keymap } from '@codemirror/view';
-import { showTooltip, getTooltip } from '@codemirror/tooltip';
+import { Annotation, EditorSelection, codePointAt, codePointSize, fromCodePoint, Facet, combineConfig, StateEffect, StateField, Prec, Text, MapMode, RangeValue, RangeSet, CharCategory } from '@codemirror/state';
+import { logException, Direction, showTooltip, EditorView, ViewPlugin, getTooltip, Decoration, WidgetType, keymap } from '@codemirror/view';
 import { syntaxTree, indentUnit } from '@codemirror/language';
-import { codePointAt, codePointSize, fromCodePoint } from '@codemirror/text';
 
 /**
 An instance of this is passed to completion source functions.
@@ -98,10 +96,10 @@ completes them.
 */
 function completeFromList(list) {
     let options = list.map(o => typeof o == "string" ? { label: o } : o);
-    let [span, match] = options.every(o => /^\w+$/.test(o.label)) ? [/\w*$/, /\w+$/] : prefixMatch(options);
+    let [validFor, match] = options.every(o => /^\w+$/.test(o.label)) ? [/\w*$/, /\w+$/] : prefixMatch(options);
     return (context) => {
         let token = context.matchBefore(match);
-        return token || context.explicit ? { from: token ? token.from : context.pos, options, span } : null;
+        return token || context.explicit ? { from: token ? token.from : context.pos, options, validFor } : null;
     };
 }
 /**
@@ -152,12 +150,24 @@ picking a completion.
 */
 const pickedCompletion = /*@__PURE__*/Annotation.define();
 function applyCompletion(view, option) {
-    let apply = option.completion.apply || option.completion.label;
+    const apply = option.completion.apply || option.completion.label;
     let result = option.source;
     if (typeof apply == "string") {
-        view.dispatch({
-            changes: { from: result.from, to: result.to, insert: apply },
-            selection: { anchor: result.from + apply.length },
+        view.dispatch(view.state.changeByRange(range => {
+            if (range == view.state.selection.main)
+                return {
+                    changes: { from: result.from, to: result.to, insert: apply },
+                    range: EditorSelection.cursor(result.from + apply.length)
+                };
+            let len = result.to - result.from;
+            if (!range.empty ||
+                len && view.state.sliceDoc(range.from - len, range.from) != view.state.sliceDoc(result.from, result.to))
+                return { range };
+            return {
+                changes: { from: range.from - len, to: range.from, insert: apply },
+                range: EditorSelection.cursor(range.from - len + apply.length)
+            };
+        }), {
             userEvent: "input.complete",
             annotations: pickedCompletion.of(option.completion)
         });
@@ -306,6 +316,7 @@ const completionConfig = /*@__PURE__*/Facet.define({
         return combineConfig(configs, {
             activateOnTyping: true,
             override: null,
+            closeOnBlur: true,
             maxRenderedOptions: 100,
             defaultKeymap: true,
             optionClass: () => "",
@@ -314,6 +325,7 @@ const completionConfig = /*@__PURE__*/Facet.define({
             addToOptions: []
         }, {
             defaultKeymap: (a, b) => a && b,
+            closeOnBlur: (a, b) => a && b,
             icons: (a, b) => a && b,
             optionClass: (a, b) => c => joinClass(a(c), b(c)),
             addToOptions: (a, b) => a.concat(b)
@@ -370,22 +382,6 @@ function optionContent(config) {
     });
     return content.sort((a, b) => a.position - b.position).map(a => a.render);
 }
-function createInfoDialog(option, view) {
-    let dom = document.createElement("div");
-    dom.className = "cm-tooltip cm-completionInfo";
-    let { info } = option.completion;
-    if (typeof info == "string") {
-        dom.textContent = info;
-    }
-    else {
-        let content = info(option.completion);
-        if (content.then)
-            content.then(node => dom.appendChild(node), e => logException(view.state, e, "completion info"));
-        else
-            dom.appendChild(content);
-    }
-    return dom;
-}
 function rangeAroundSelected(total, selected, max) {
     if (total <= max)
         return { from: 0, to: total };
@@ -454,13 +450,31 @@ class CompletionTooltip {
                 this.info.remove();
                 this.info = null;
             }
-            let option = open.options[open.selected];
-            if (option.completion.info) {
-                this.info = this.dom.appendChild(createInfoDialog(option, this.view));
-                this.view.requestMeasure(this.placeInfo);
+            let { completion } = open.options[open.selected];
+            let { info } = completion;
+            if (!info)
+                return;
+            let infoResult = typeof info === 'string' ? document.createTextNode(info) : info(completion);
+            if (!infoResult)
+                return;
+            if ('then' in infoResult) {
+                infoResult.then(node => {
+                    if (node && this.view.state.field(this.stateField, false) == cState)
+                        this.addInfoPane(node);
+                }).catch(e => logException(this.view.state, e, "completion info"));
+            }
+            else {
+                this.addInfoPane(infoResult);
             }
         }
     }
+    addInfoPane(content) {
+        let dom = this.info = document.createElement("div");
+        dom.className = "cm-tooltip cm-completionInfo";
+        dom.appendChild(content);
+        this.dom.appendChild(dom);
+        this.view.requestMeasure(this.placeInfo);
+    }
     updateSelectedOption(selected) {
         let set = null;
         for (let opt = this.list.firstChild, i = this.range.from; opt; opt = opt.nextSibling, i++) {
@@ -546,7 +560,6 @@ function scrollIntoView(container, element) {
         container.scrollTop += self.bottom - parent.bottom;
 }
 
-const MaxOptions = 300;
 // Used to pick a preferred option when two options with the same
 // label occur in the result.
 function score(option) {
@@ -558,8 +571,14 @@ function sortOptions(active, state) {
     for (let a of active)
         if (a.hasResult()) {
             if (a.result.filter === false) {
-                for (let option of a.result.options)
-                    options.push(new Option(option, a, [1e9 - i++]));
+                let getMatch = a.result.getMatch;
+                for (let option of a.result.options) {
+                    let match = [1e9 - i++];
+                    if (getMatch)
+                        for (let n of getMatch(option))
+                            match.push(n);
+                    options.push(new Option(option, a, match));
+                }
             }
             else {
                 let matcher = new FuzzyMatcher(state.sliceDoc(a.from, a.to)), match;
@@ -573,10 +592,9 @@ function sortOptions(active, state) {
         }
     let result = [], prev = null;
     for (let opt of options.sort(cmpOption)) {
-        if (result.length == MaxOptions)
-            break;
         if (!prev || prev.label != opt.completion.label || prev.detail != opt.completion.detail ||
-            prev.type != opt.completion.type || prev.apply != opt.completion.apply)
+            (prev.type != null && opt.completion.type != null && prev.type != opt.completion.type) ||
+            prev.apply != opt.completion.apply)
             result.push(opt);
         else if (score(opt.completion) > score(prev))
             result[result.length - 1] = opt;
@@ -726,24 +744,27 @@ class ActiveSource {
     }
 }
 class ActiveResult extends ActiveSource {
-    constructor(source, explicitPos, result, from, to, span) {
+    constructor(source, explicitPos, result, from, to) {
         super(source, 2 /* Result */, explicitPos);
         this.result = result;
         this.from = from;
         this.to = to;
-        this.span = span;
     }
     hasResult() { return true; }
     handleUserEvent(tr, type, conf) {
+        var _a;
         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 ||
             type == "delete" && cur(tr.startState) == this.from)
             return new ActiveSource(this.source, type == "input" && conf.activateOnTyping ? 1 /* Pending */ : 0 /* Inactive */);
-        let explicitPos = this.explicitPos < 0 ? -1 : tr.changes.mapPos(this.explicitPos);
-        if (this.span && (from == to || this.span.test(tr.state.sliceDoc(from, to))))
-            return new ActiveResult(this.source, explicitPos, this.result, from, to, this.span);
+        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));
         return new ActiveSource(this.source, 1 /* Pending */, explicitPos);
     }
     handleChange(tr) {
@@ -751,9 +772,15 @@ class ActiveResult extends ActiveSource {
     }
     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), this.span);
+            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) {
+    if (!validFor)
+        return false;
+    let text = state.sliceDoc(from, to);
+    return typeof validFor == "function" ? validFor(text, from, to, state) : ensureAnchor(validFor, true).test(text);
+}
 const startCompletionEffect = /*@__PURE__*/StateEffect.define();
 const closeCompletionEffect = /*@__PURE__*/StateEffect.define();
 const setActiveEffect = /*@__PURE__*/StateEffect.define({
@@ -927,7 +954,7 @@ const completionPlugin = /*@__PURE__*/ViewPlugin.fromClass(class {
                 continue;
             this.running.splice(i--, 1);
             if (query.done) {
-                let active = new ActiveResult(query.active.source, query.active.explicitPos, query.done, query.done.from, (_a = query.done.to) !== null && _a !== void 0 ? _a : cur(query.updates.length ? query.updates[0].startState : this.view.state), query.done.span && query.done.filter !== false ? ensureAnchor(query.done.span, true) : null);
+                let active = new ActiveResult(query.active.source, query.active.explicitPos, query.done, query.done.from, (_a = query.done.to) !== null && _a !== void 0 ? _a : cur(query.updates.length ? query.updates[0].startState : this.view.state));
                 // Replay the transactions that happened since the start of
                 // the request and see if that preserves the result
                 for (let tr of query.updates)
@@ -959,6 +986,11 @@ const completionPlugin = /*@__PURE__*/ViewPlugin.fromClass(class {
     }
 }, {
     eventHandlers: {
+        blur() {
+            let state = this.view.state.field(completionState, false);
+            if (state && state.tooltip && this.view.state.facet(completionConfig).closeOnBlur)
+                this.view.dispatch({ effects: closeCompletionEffect.of(null) });
+        },
         compositionstart() {
             this.composing = 1 /* Started */;
         },
@@ -1200,8 +1232,9 @@ function fieldSelection(ranges, field) {
     return EditorSelection.create(ranges.filter(r => r.field == field).map(r => EditorSelection.range(r.from, r.to)));
 }
 /**
-Convert a snippet template to a function that can apply it.
-Snippets are written using syntax like this:
+Convert a snippet template to a function that can
+[apply](https://codemirror.net/6/docs/ref/#autocomplete.Completion.apply) it. Snippets are written
+using syntax like this:
 
     "for (let ${index} = 0; ${index} < ${end}; ${index}++) {\n\t${}\n}"
 
@@ -1384,8 +1417,238 @@ const completeAnyWord = context => {
         return null;
     let from = token ? token.from : context.pos;
     let options = collectWords(context.state.doc, wordCache(wordChars), re, 50000 /* Range */, from);
-    return { from, options, span: mapRE(re, s => "^" + s) };
+    return { from, options, validFor: mapRE(re, s => "^" + s) };
+};
+
+const defaults = {
+    brackets: ["(", "[", "{", "'", '"'],
+    before: ")]}:;>"
+};
+const closeBracketEffect = /*@__PURE__*/StateEffect.define({
+    map(value, mapping) {
+        let mapped = mapping.mapPos(value, -1, MapMode.TrackAfter);
+        return mapped == null ? undefined : mapped;
+    }
+});
+const skipBracketEffect = /*@__PURE__*/StateEffect.define({
+    map(value, mapping) { return mapping.mapPos(value); }
+});
+const closedBracket = /*@__PURE__*/new class extends RangeValue {
+};
+closedBracket.startSide = 1;
+closedBracket.endSide = -1;
+const bracketState = /*@__PURE__*/StateField.define({
+    create() { return RangeSet.empty; },
+    update(value, tr) {
+        if (tr.selection) {
+            let lineStart = tr.state.doc.lineAt(tr.selection.main.head).from;
+            let prevLineStart = tr.startState.doc.lineAt(tr.startState.selection.main.head).from;
+            if (lineStart != tr.changes.mapPos(prevLineStart, -1))
+                value = RangeSet.empty;
+        }
+        value = value.map(tr.changes);
+        for (let effect of tr.effects) {
+            if (effect.is(closeBracketEffect))
+                value = value.update({ add: [closedBracket.range(effect.value, effect.value + 1)] });
+            else if (effect.is(skipBracketEffect))
+                value = value.update({ filter: from => from != effect.value });
+        }
+        return value;
+    }
+});
+/**
+Extension to enable bracket-closing behavior. When a closeable
+bracket is typed, its closing bracket is immediately inserted
+after the cursor. When closing a bracket directly in front of a
+closing bracket inserted by the extension, the cursor moves over
+that bracket.
+*/
+function closeBrackets() {
+    return [inputHandler, bracketState];
+}
+const definedClosing = "()[]{}<>";
+function closing(ch) {
+    for (let i = 0; i < definedClosing.length; i += 2)
+        if (definedClosing.charCodeAt(i) == ch)
+            return definedClosing.charAt(i + 1);
+    return fromCodePoint(ch < 128 ? ch : ch + 1);
+}
+function config(state, pos) {
+    return state.languageDataAt("closeBrackets", pos)[0] || defaults;
+}
+const android = typeof navigator == "object" && /*@__PURE__*//Android\b/.test(navigator.userAgent);
+const inputHandler = /*@__PURE__*/EditorView.inputHandler.of((view, from, to, insert) => {
+    if ((android ? view.composing : view.compositionStarted) || view.state.readOnly)
+        return false;
+    let sel = view.state.selection.main;
+    if (insert.length > 2 || insert.length == 2 && codePointSize(codePointAt(insert, 0)) == 1 ||
+        from != sel.from || to != sel.to)
+        return false;
+    let tr = insertBracket(view.state, insert);
+    if (!tr)
+        return false;
+    view.dispatch(tr);
+    return true;
+});
+/**
+Command that implements deleting a pair of matching brackets when
+the cursor is between them.
+*/
+const deleteBracketPair = ({ state, dispatch }) => {
+    if (state.readOnly)
+        return false;
+    let conf = config(state, state.selection.main.head);
+    let tokens = conf.brackets || defaults.brackets;
+    let dont = null, changes = state.changeByRange(range => {
+        if (range.empty) {
+            let before = prevChar(state.doc, range.head);
+            for (let token of tokens) {
+                if (token == before && nextChar(state.doc, range.head) == closing(codePointAt(token, 0)))
+                    return { changes: { from: range.head - token.length, to: range.head + token.length },
+                        range: EditorSelection.cursor(range.head - token.length),
+                        userEvent: "delete.backward" };
+            }
+        }
+        return { range: dont = range };
+    });
+    if (!dont)
+        dispatch(state.update(changes, { scrollIntoView: true }));
+    return !dont;
 };
+/**
+Close-brackets related key bindings. Binds Backspace to
+[`deleteBracketPair`](https://codemirror.net/6/docs/ref/#autocomplete.deleteBracketPair).
+*/
+const closeBracketsKeymap = [
+    { key: "Backspace", run: deleteBracketPair }
+];
+/**
+Implements the extension's behavior on text insertion. If the
+given string counts as a bracket in the language around the
+selection, and replacing the selection with it requires custom
+behavior (inserting a closing version or skipping past a
+previously-closed bracket), this function returns a transaction
+representing that custom behavior. (You only need this if you want
+to programmatically insert brackets—the
+[`closeBrackets`](https://codemirror.net/6/docs/ref/#autocomplete.closeBrackets) extension will
+take care of running this for user input.)
+*/
+function insertBracket(state, bracket) {
+    let conf = config(state, state.selection.main.head);
+    let tokens = conf.brackets || defaults.brackets;
+    for (let tok of tokens) {
+        let closed = closing(codePointAt(tok, 0));
+        if (bracket == tok)
+            return closed == tok ? handleSame(state, tok, tokens.indexOf(tok + tok + tok) > -1)
+                : handleOpen(state, tok, closed, conf.before || defaults.before);
+        if (bracket == closed && closedBracketAt(state, state.selection.main.from))
+            return handleClose(state, tok, closed);
+    }
+    return null;
+}
+function closedBracketAt(state, pos) {
+    let found = false;
+    state.field(bracketState).between(0, state.doc.length, from => {
+        if (from == pos)
+            found = true;
+    });
+    return found;
+}
+function nextChar(doc, pos) {
+    let next = doc.sliceString(pos, pos + 2);
+    return next.slice(0, codePointSize(codePointAt(next, 0)));
+}
+function prevChar(doc, pos) {
+    let prev = doc.sliceString(pos - 2, pos);
+    return codePointSize(codePointAt(prev, 0)) == prev.length ? prev : prev.slice(1);
+}
+function handleOpen(state, open, close, closeBefore) {
+    let dont = null, changes = state.changeByRange(range => {
+        if (!range.empty)
+            return { changes: [{ insert: open, from: range.from }, { insert: close, from: range.to }],
+                effects: closeBracketEffect.of(range.to + open.length),
+                range: EditorSelection.range(range.anchor + open.length, range.head + open.length) };
+        let next = nextChar(state.doc, range.head);
+        if (!next || /\s/.test(next) || closeBefore.indexOf(next) > -1)
+            return { changes: { insert: open + close, from: range.head },
+                effects: closeBracketEffect.of(range.head + open.length),
+                range: EditorSelection.cursor(range.head + open.length) };
+        return { range: dont = range };
+    });
+    return dont ? null : state.update(changes, {
+        scrollIntoView: true,
+        userEvent: "input.type"
+    });
+}
+function handleClose(state, _open, close) {
+    let dont = null, moved = state.selection.ranges.map(range => {
+        if (range.empty && nextChar(state.doc, range.head) == close)
+            return EditorSelection.cursor(range.head + close.length);
+        return dont = range;
+    });
+    return dont ? null : state.update({
+        selection: EditorSelection.create(moved, state.selection.mainIndex),
+        scrollIntoView: true,
+        effects: state.selection.ranges.map(({ from }) => skipBracketEffect.of(from))
+    });
+}
+// Handles cases where the open and close token are the same, and
+// possibly triple quotes (as in `"""abc"""`-style quoting).
+function handleSame(state, token, allowTriple) {
+    let dont = null, changes = state.changeByRange(range => {
+        if (!range.empty)
+            return { changes: [{ insert: token, from: range.from }, { insert: token, from: range.to }],
+                effects: closeBracketEffect.of(range.to + token.length),
+                range: EditorSelection.range(range.anchor + token.length, range.head + token.length) };
+        let pos = range.head, next = nextChar(state.doc, pos);
+        if (next == token) {
+            if (nodeStart(state, pos)) {
+                return { changes: { insert: token + token, from: pos },
+                    effects: closeBracketEffect.of(pos + token.length),
+                    range: EditorSelection.cursor(pos + token.length) };
+            }
+            else if (closedBracketAt(state, pos)) {
+                let isTriple = allowTriple && state.sliceDoc(pos, pos + token.length * 3) == token + token + token;
+                return { range: EditorSelection.cursor(pos + token.length * (isTriple ? 3 : 1)),
+                    effects: skipBracketEffect.of(pos) };
+            }
+        }
+        else if (allowTriple && state.sliceDoc(pos - 2 * token.length, pos) == token + token &&
+            nodeStart(state, pos - 2 * token.length)) {
+            return { changes: { insert: token + token + token + token, from: pos },
+                effects: closeBracketEffect.of(pos + token.length),
+                range: EditorSelection.cursor(pos + token.length) };
+        }
+        else if (state.charCategorizer(pos)(next) != CharCategory.Word) {
+            let prev = state.sliceDoc(pos - 1, pos);
+            if (prev != token && state.charCategorizer(pos)(prev) != CharCategory.Word && !probablyInString(state, pos, token))
+                return { changes: { insert: token + token, from: pos },
+                    effects: closeBracketEffect.of(pos + token.length),
+                    range: EditorSelection.cursor(pos + token.length) };
+        }
+        return { range: dont = range };
+    });
+    return dont ? null : state.update(changes, {
+        scrollIntoView: true,
+        userEvent: "input.type"
+    });
+}
+function nodeStart(state, pos) {
+    let tree = syntaxTree(state).resolveInner(pos + 1);
+    return tree.parent && tree.from == pos;
+}
+function probablyInString(state, pos, quoteToken) {
+    let node = syntaxTree(state).resolveInner(pos, -1);
+    for (let i = 0; i < 5; i++) {
+        if (state.sliceDoc(node.from, node.from + quoteToken.length) == quoteToken)
+            return true;
+        let parent = node.to == pos && node.parent;
+        if (!parent)
+            break;
+        node = parent;
+    }
+    return false;
+}
 
 /**
 Returns an extension that enables autocompletion.
@@ -1431,13 +1694,19 @@ function completionStatus(state) {
     return cState && cState.active.some(a => a.state == 1 /* Pending */) ? "pending"
         : cState && cState.active.some(a => a.state != 0 /* Inactive */) ? "active" : null;
 }
+const completionArrayCache = /*@__PURE__*/new WeakMap;
 /**
 Returns the available completions as an array.
 */
 function currentCompletions(state) {
     var _a;
     let open = (_a = state.field(completionState, false)) === null || _a === void 0 ? void 0 : _a.open;
-    return open ? open.options.map(o => o.completion) : [];
+    if (!open)
+        return [];
+    let completions = completionArrayCache.get(open.options);
+    if (!completions)
+        completionArrayCache.set(open.options, completions = open.options.map(o => o.completion));
+    return completions;
 }
 /**
 Return the currently selected completion, if any.
@@ -1447,5 +1716,21 @@ function selectedCompletion(state) {
     let open = (_a = state.field(completionState, false)) === null || _a === void 0 ? void 0 : _a.open;
     return open ? open.options[open.selected].completion : null;
 }
+/**
+Returns the currently selected position in the active completion
+list, or null if no completions are active.
+*/
+function selectedCompletionIndex(state) {
+    var _a;
+    let open = (_a = state.field(completionState, false)) === null || _a === void 0 ? void 0 : _a.open;
+    return open ? open.selected : null;
+}
+/**
+Create an effect that can be attached to a transaction to change
+the currently selected completion.
+*/
+function setSelectedCompletion(index) {
+    return setSelectedEffect.of(index);
+}
 
-export { CompletionContext, acceptCompletion, autocompletion, clearSnippet, closeCompletion, completeAnyWord, completeFromList, completionKeymap, completionStatus, currentCompletions, ifIn, ifNotIn, moveCompletionSelection, nextSnippetField, pickedCompletion, prevSnippetField, selectedCompletion, snippet, snippetCompletion, snippetKeymap, startCompletion };
+export { CompletionContext, acceptCompletion, autocompletion, clearSnippet, closeBrackets, closeBracketsKeymap, closeCompletion, completeAnyWord, completeFromList, completionKeymap, completionStatus, currentCompletions, deleteBracketPair, ifIn, ifNotIn, insertBracket, moveCompletionSelection, nextSnippetField, pickedCompletion, prevSnippetField, selectedCompletion, selectedCompletionIndex, setSelectedCompletion, snippet, snippetCompletion, snippetKeymap, startCompletion };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codemirror/autocomplete",
-  "version": "0.19.14",
+  "version": "0.20.1",
   "description": "Autocompletion for the CodeMirror code editor",
   "scripts": {
     "test": "cm-runtests",
@@ -26,12 +26,10 @@
   "sideEffects": false,
   "license": "MIT",
   "dependencies": {
-    "@codemirror/language": "^0.19.0",
-    "@codemirror/state": "^0.19.4",
-    "@codemirror/text": "^0.19.2",
-    "@codemirror/tooltip": "^0.19.12",
-    "@codemirror/view": "^0.19.0",
-    "@lezer/common": "^0.15.0"
+    "@codemirror/language": "^0.20.0",
+    "@codemirror/state": "^0.20.0",
+    "@codemirror/view": "^0.20.0",
+    "@lezer/common": "^0.16.0"
   },
   "devDependencies": {
     "@codemirror/buildhelper": "^0.1.5"