@codemirror/autocomplete 0.19.15 → 0.20.2

package/CHANGELOG.md

@@ -1,3 +1,35 @@
+## 0.20.2 (2022-05-24)
+
+### New features
+
+The package now exports an `insertCompletionText` helper that implements the default behavior for applying a completion.
+
+## 0.20.1 (2022-05-16)
+
+### New features
+
+The new `closeOnBlur` option determines whether the completion tooltip is closed when the editor loses focus.
+
+`CompletionResult` objects with `filter: false` may now have a `getMatch` property that determines the matched range in the options.
+
+## 0.20.0 (2022-04-20)
+
+### Breaking changes
+
+`CompletionResult.span` has been renamed to `validFor`, and may now hold a function as well as a regular expression.
+
+### Bug fixes
+
+Remove code that dropped any options beyond the 300th one when matching and sorting option lists.
+
+Completion will now apply to all cursors when there are multiple cursors.
+
+### New features
+
+`CompletionResult.update` can now be used to implement quick autocompletion updates in a synchronous way.
+
+The @codemirror/closebrackets package was merged into this one.
+
 ## 0.19.15 (2022-03-23)
 
 ### New features

package/dist/index.cjs

@@ -4,9 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var state = require('@codemirror/state');
 var view = require('@codemirror/view');
-var tooltip = require('@codemirror/tooltip');
 var language = require('@codemirror/language');
-var text = require('@codemirror/text');
 
 /**
 An instance of this is passed to completion source functions.
@@ -102,10 +100,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;
     };
 }
 /**
@@ -155,20 +153,35 @@ This annotation is added to transactions that are produced by
 picking a completion.
 */
 const pickedCompletion = state.Annotation.define();
+/**
+Helper function that returns a transaction spec which inserts a
+completion's text in the main selection range, and any other
+selection range that has the same text in front of it.
+*/
+function insertCompletionText(state$1, text, from, to) {
+    return state$1.changeByRange(range => {
+        if (range == state$1.selection.main)
+            return {
+                changes: { from: from, to: to, insert: text },
+                range: state.EditorSelection.cursor(from + text.length)
+            };
+        let len = to - from;
+        if (!range.empty ||
+            len && state$1.sliceDoc(range.from - len, range.from) != state$1.sliceDoc(from, to))
+            return { range };
+        return {
+            changes: { from: range.from - len, to: range.from, insert: text },
+            range: state.EditorSelection.cursor(range.from - len + text.length)
+        };
+    });
+}
 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 },
-            userEvent: "input.complete",
-            annotations: pickedCompletion.of(option.completion)
-        });
-    }
-    else {
+    if (typeof apply == "string")
+        view.dispatch(insertCompletionText(view.state, apply, result.from, result.to));
+    else
         apply(view, option.completion, result.from, result.to);
-    }
 }
 const SourceCache = new WeakMap();
 function asSource(source) {
@@ -194,10 +207,10 @@ class FuzzyMatcher {
         this.precise = [];
         this.byWord = [];
         for (let p = 0; p < pattern.length;) {
-            let char = text.codePointAt(pattern, p), size = text.codePointSize(char);
+            let char = state.codePointAt(pattern, p), size = state.codePointSize(char);
             this.chars.push(char);
             let part = pattern.slice(p, p + size), upper = part.toUpperCase();
-            this.folded.push(text.codePointAt(upper == part ? part.toLowerCase() : upper, 0));
+            this.folded.push(state.codePointAt(upper == part ? part.toLowerCase() : upper, 0));
             p += size;
         }
         this.astral = pattern.length != this.chars.length;
@@ -218,9 +231,9 @@ class FuzzyMatcher {
         // For single-character queries, only match when they occur right
         // at the start
         if (chars.length == 1) {
-            let first = text.codePointAt(word, 0);
-            return first == chars[0] ? [0, 0, text.codePointSize(first)]
-                : first == folded[0] ? [-200 /* CaseFold */, 0, text.codePointSize(first)] : null;
+            let first = state.codePointAt(word, 0);
+            return first == chars[0] ? [0, 0, state.codePointSize(first)]
+                : first == folded[0] ? [-200 /* CaseFold */, 0, state.codePointSize(first)] : null;
         }
         let direct = word.indexOf(this.pattern);
         if (direct == 0)
@@ -228,10 +241,10 @@ class FuzzyMatcher {
         let len = chars.length, anyTo = 0;
         if (direct < 0) {
             for (let i = 0, e = Math.min(word.length, 200); i < e && anyTo < len;) {
-                let next = text.codePointAt(word, i);
+                let next = state.codePointAt(word, i);
                 if (next == chars[anyTo] || next == folded[anyTo])
                     any[anyTo++] = i;
-                i += text.codePointSize(next);
+                i += state.codePointSize(next);
             }
             // No match, exit immediately
             if (anyTo < len)
@@ -249,7 +262,7 @@ class FuzzyMatcher {
         let hasLower = /[a-z]/.test(word), wordAdjacent = true;
         // Go over the option's text, scanning for the various kinds of matches
         for (let i = 0, e = Math.min(word.length, 200), prevType = 0 /* NonWord */; i < e && byWordTo < len;) {
-            let next = text.codePointAt(word, i);
+            let next = state.codePointAt(word, i);
             if (direct < 0) {
                 if (preciseTo < len && next == chars[preciseTo])
                     precise[preciseTo++] = i;
@@ -267,7 +280,7 @@ class FuzzyMatcher {
             }
             let ch, type = next < 0xff
                 ? (next >= 48 && next <= 57 || next >= 97 && next <= 122 ? 2 /* Lower */ : next >= 65 && next <= 90 ? 1 /* Upper */ : 0 /* NonWord */)
-                : ((ch = text.fromCodePoint(next)) != ch.toLowerCase() ? 1 /* Upper */ : ch != ch.toUpperCase() ? 2 /* Lower */ : 0 /* NonWord */);
+                : ((ch = state.fromCodePoint(next)) != ch.toLowerCase() ? 1 /* Upper */ : ch != ch.toUpperCase() ? 2 /* Lower */ : 0 /* NonWord */);
             if (!i || type == 1 /* Upper */ && hasLower || prevType == 0 /* NonWord */ && type != 0 /* NonWord */) {
                 if (chars[byWordTo] == next || (folded[byWordTo] == next && (byWordFolded = true)))
                     byWord[byWordTo++] = i;
@@ -275,7 +288,7 @@ class FuzzyMatcher {
                     wordAdjacent = false;
             }
             prevType = type;
-            i += text.codePointSize(next);
+            i += state.codePointSize(next);
         }
         if (byWordTo == len && byWord[0] == 0 && wordAdjacent)
             return this.result(-100 /* ByWord */ + (byWordFolded ? -200 /* CaseFold */ : 0), byWord, word);
@@ -293,7 +306,7 @@ class FuzzyMatcher {
     result(score, positions, word) {
         let result = [score - word.length], i = 1;
         for (let pos of positions) {
-            let to = pos + (this.astral ? text.codePointSize(text.codePointAt(word, pos)) : 1);
+            let to = pos + (this.astral ? state.codePointSize(state.codePointAt(word, pos)) : 1);
             if (i > 1 && result[i - 1] == pos)
                 result[i - 1] = to;
             else {
@@ -310,6 +323,7 @@ const completionConfig = state.Facet.define({
         return state.combineConfig(configs, {
             activateOnTyping: true,
             override: null,
+            closeOnBlur: true,
             maxRenderedOptions: 100,
             defaultKeymap: true,
             optionClass: () => "",
@@ -318,6 +332,7 @@ const completionConfig = state.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)
@@ -552,7 +567,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) {
@@ -564,8 +578,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;
@@ -579,10 +599,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;
@@ -732,24 +751,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) {
@@ -757,9 +779,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 = state.StateEffect.define();
 const closeCompletionEffect = state.StateEffect.define();
 const setActiveEffect = state.StateEffect.define({
@@ -770,7 +798,7 @@ const completionState = state.StateField.define({
     create() { return CompletionState.start(); },
     update(value, tr) { return value.update(tr); },
     provide: f => [
-        tooltip.showTooltip.from(f, val => val.tooltip),
+        view.showTooltip.from(f, val => val.tooltip),
         view.EditorView.contentAttributes.from(f, state => state.attrs)
     ]
 });
@@ -781,20 +809,20 @@ Returns a command that moves the completion selection forward or
 backward by the given amount.
 */
 function moveCompletionSelection(forward, by = "option") {
-    return (view) => {
-        let cState = view.state.field(completionState, false);
+    return (view$1) => {
+        let cState = view$1.state.field(completionState, false);
         if (!cState || !cState.open || Date.now() - cState.open.timestamp < CompletionInteractMargin)
             return false;
-        let step = 1, tooltip$1;
-        if (by == "page" && (tooltip$1 = tooltip.getTooltip(view, cState.open.tooltip)))
-            step = Math.max(2, Math.floor(tooltip$1.dom.offsetHeight /
-                tooltip$1.dom.querySelector("li").offsetHeight) - 1);
+        let step = 1, tooltip;
+        if (by == "page" && (tooltip = view.getTooltip(view$1, cState.open.tooltip)))
+            step = Math.max(2, Math.floor(tooltip.dom.offsetHeight /
+                tooltip.dom.querySelector("li").offsetHeight) - 1);
         let selected = cState.open.selected + step * (forward ? 1 : -1), { length } = cState.open.options;
         if (selected < 0)
             selected = by == "page" ? 0 : length - 1;
         else if (selected >= length)
             selected = by == "page" ? length - 1 : 0;
-        view.dispatch({ effects: setSelectedEffect.of(selected) });
+        view$1.dispatch({ effects: setSelectedEffect.of(selected) });
         return true;
     };
 }
@@ -933,7 +961,7 @@ const completionPlugin = view.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)
@@ -965,6 +993,11 @@ const completionPlugin = view.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 */;
         },
@@ -1206,8 +1239,9 @@ function fieldSelection(ranges, field) {
     return state.EditorSelection.create(ranges.filter(r => r.field == field).map(r => state.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}"
 
@@ -1390,8 +1424,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 = state.StateEffect.define({
+    map(value, mapping) {
+        let mapped = mapping.mapPos(value, -1, state.MapMode.TrackAfter);
+        return mapped == null ? undefined : mapped;
+    }
+});
+const skipBracketEffect = state.StateEffect.define({
+    map(value, mapping) { return mapping.mapPos(value); }
+});
+const closedBracket = new class extends state.RangeValue {
+};
+closedBracket.startSide = 1;
+closedBracket.endSide = -1;
+const bracketState = state.StateField.define({
+    create() { return state.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 = state.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 state.fromCodePoint(ch < 128 ? ch : ch + 1);
+}
+function config(state, pos) {
+    return state.languageDataAt("closeBrackets", pos)[0] || defaults;
+}
+const android = typeof navigator == "object" && /Android\b/.test(navigator.userAgent);
+const inputHandler = view.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 && state.codePointSize(state.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: state$1, dispatch }) => {
+    if (state$1.readOnly)
+        return false;
+    let conf = config(state$1, state$1.selection.main.head);
+    let tokens = conf.brackets || defaults.brackets;
+    let dont = null, changes = state$1.changeByRange(range => {
+        if (range.empty) {
+            let before = prevChar(state$1.doc, range.head);
+            for (let token of tokens) {
+                if (token == before && nextChar(state$1.doc, range.head) == closing(state.codePointAt(token, 0)))
+                    return { changes: { from: range.head - token.length, to: range.head + token.length },
+                        range: state.EditorSelection.cursor(range.head - token.length),
+                        userEvent: "delete.backward" };
+            }
+        }
+        return { range: dont = range };
+    });
+    if (!dont)
+        dispatch(state$1.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$1, bracket) {
+    let conf = config(state$1, state$1.selection.main.head);
+    let tokens = conf.brackets || defaults.brackets;
+    for (let tok of tokens) {
+        let closed = closing(state.codePointAt(tok, 0));
+        if (bracket == tok)
+            return closed == tok ? handleSame(state$1, tok, tokens.indexOf(tok + tok + tok) > -1)
+                : handleOpen(state$1, tok, closed, conf.before || defaults.before);
+        if (bracket == closed && closedBracketAt(state$1, state$1.selection.main.from))
+            return handleClose(state$1, 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, state.codePointSize(state.codePointAt(next, 0)));
+}
+function prevChar(doc, pos) {
+    let prev = doc.sliceString(pos - 2, pos);
+    return state.codePointSize(state.codePointAt(prev, 0)) == prev.length ? prev : prev.slice(1);
+}
+function handleOpen(state$1, open, close, closeBefore) {
+    let dont = null, changes = state$1.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: state.EditorSelection.range(range.anchor + open.length, range.head + open.length) };
+        let next = nextChar(state$1.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: state.EditorSelection.cursor(range.head + open.length) };
+        return { range: dont = range };
+    });
+    return dont ? null : state$1.update(changes, {
+        scrollIntoView: true,
+        userEvent: "input.type"
+    });
+}
+function handleClose(state$1, _open, close) {
+    let dont = null, moved = state$1.selection.ranges.map(range => {
+        if (range.empty && nextChar(state$1.doc, range.head) == close)
+            return state.EditorSelection.cursor(range.head + close.length);
+        return dont = range;
+    });
+    return dont ? null : state$1.update({
+        selection: state.EditorSelection.create(moved, state$1.selection.mainIndex),
+        scrollIntoView: true,
+        effects: state$1.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$1, token, allowTriple) {
+    let dont = null, changes = state$1.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: state.EditorSelection.range(range.anchor + token.length, range.head + token.length) };
+        let pos = range.head, next = nextChar(state$1.doc, pos);
+        if (next == token) {
+            if (nodeStart(state$1, pos)) {
+                return { changes: { insert: token + token, from: pos },
+                    effects: closeBracketEffect.of(pos + token.length),
+                    range: state.EditorSelection.cursor(pos + token.length) };
+            }
+            else if (closedBracketAt(state$1, pos)) {
+                let isTriple = allowTriple && state$1.sliceDoc(pos, pos + token.length * 3) == token + token + token;
+                return { range: state.EditorSelection.cursor(pos + token.length * (isTriple ? 3 : 1)),
+                    effects: skipBracketEffect.of(pos) };
+            }
+        }
+        else if (allowTriple && state$1.sliceDoc(pos - 2 * token.length, pos) == token + token &&
+            nodeStart(state$1, pos - 2 * token.length)) {
+            return { changes: { insert: token + token + token + token, from: pos },
+                effects: closeBracketEffect.of(pos + token.length),
+                range: state.EditorSelection.cursor(pos + token.length) };
+        }
+        else if (state$1.charCategorizer(pos)(next) != state.CharCategory.Word) {
+            let prev = state$1.sliceDoc(pos - 1, pos);
+            if (prev != token && state$1.charCategorizer(pos)(prev) != state.CharCategory.Word && !probablyInString(state$1, pos, token))
+                return { changes: { insert: token + token, from: pos },
+                    effects: closeBracketEffect.of(pos + token.length),
+                    range: state.EditorSelection.cursor(pos + token.length) };
+        }
+        return { range: dont = range };
+    });
+    return dont ? null : state$1.update(changes, {
+        scrollIntoView: true,
+        userEvent: "input.type"
+    });
+}
+function nodeStart(state, pos) {
+    let tree = language.syntaxTree(state).resolveInner(pos + 1);
+    return tree.parent && tree.from == pos;
+}
+function probablyInString(state, pos, quoteToken) {
+    let node = language.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.
@@ -1480,14 +1744,19 @@ exports.CompletionContext = CompletionContext;
 exports.acceptCompletion = acceptCompletion;
 exports.autocompletion = autocompletion;
 exports.clearSnippet = clearSnippet;
+exports.closeBrackets = closeBrackets;
+exports.closeBracketsKeymap = closeBracketsKeymap;
 exports.closeCompletion = closeCompletion;
 exports.completeAnyWord = completeAnyWord;
 exports.completeFromList = completeFromList;
 exports.completionKeymap = completionKeymap;
 exports.completionStatus = completionStatus;
 exports.currentCompletions = currentCompletions;
+exports.deleteBracketPair = deleteBracketPair;
 exports.ifIn = ifIn;
 exports.ifNotIn = ifNotIn;
+exports.insertBracket = insertBracket;
+exports.insertCompletionText = insertCompletionText;
 exports.moveCompletionSelection = moveCompletionSelection;
 exports.nextSnippetField = nextSnippetField;
 exports.pickedCompletion = pickedCompletion;

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as _codemirror_state from '@codemirror/state';
-import { EditorState, Transaction, StateCommand, Facet, Extension, StateEffect } from '@codemirror/state';
+import { EditorState, TransactionSpec, Transaction, StateCommand, Facet, Extension, StateEffect } from '@codemirror/state';
 import { EditorView, KeyBinding, Command } from '@codemirror/view';
 import * as _lezer_common from '@lezer/common';
 
@@ -18,6 +18,11 @@ interface CompletionConfig {
     */
     override?: readonly CompletionSource[] | null;
     /**
+    Determines whether the completion tooltip is closed when the
+    editor loses focus. Defaults to true.
+    */
+    closeOnBlur?: boolean;
+    /**
     The maximum number of options to render to the DOM.
     */
     maxRenderedOptions?: number;
@@ -52,8 +57,7 @@ interface CompletionConfig {
     completion, and should produce a DOM node to show. `position`
     determines where in the DOM the result appears, relative to
     other added widgets and the standard content. The default icons
-    have position 20, the label position 50, and the detail position
-    70.
+    have position 20, the label position 50, and the detail position 70.
     */
     addToOptions?: {
         render: (completion: Completion, state: EditorState) => Node | null;
@@ -226,33 +230,57 @@ interface CompletionResult {
     */
     options: readonly Completion[];
     /**
-    When given, further input that causes the part of the document
-    between ([mapped](https://codemirror.net/6/docs/ref/#state.ChangeDesc.mapPos)) `from` and `to` to
-    match this regular expression will not query the completion
-    source again, but continue with this list of options. This can
-    help a lot with responsiveness, since it allows the completion
-    list to be updated synchronously.
+    When given, further typing or deletion that causes the part of
+    the document between ([mapped](https://codemirror.net/6/docs/ref/#state.ChangeDesc.mapPos)) `from`
+    and `to` to match this regular expression or predicate function
+    will not query the completion source again, but continue with
+    this list of options. This can help a lot with responsiveness,
+    since it allows the completion list to be updated synchronously.
     */
-    span?: RegExp;
+    validFor?: RegExp | ((text: string, from: number, to: number, state: EditorState) => boolean);
     /**
     By default, the library filters and scores completions. Set
     `filter` to `false` to disable this, and cause your completions
     to all be included, in the order they were given. When there are
     other sources, unfiltered completions appear at the top of the
-    list of completions. `span` must not be given when `filter` is
-    `false`, because it only works when filtering.
+    list of completions. `validFor` must not be given when `filter`
+    is `false`, because it only works when filtering.
     */
     filter?: boolean;
+    /**
+    When [`filter`](https://codemirror.net/6/docs/ref/#autocomplete.CompletionResult.filter) is set to
+    `false`, this may be provided to compute the ranges on the label
+    that match the input. Should return an array of numbers where
+    each pair of adjacent numbers provide the start and end of a
+    range.
+    */
+    getMatch?: (completion: Completion) => readonly number[];
+    /**
+    Synchronously update the completion result after typing or
+    deletion. If given, this should not do any expensive work, since
+    it will be called during editor state updates. The function
+    should make sure (similar to
+    [`validFor`](https://codemirror.net/6/docs/ref/#autocomplete.CompletionResult.validFor)) that the
+    completion still applies in the new state.
+    */
+    update?: (current: CompletionResult, from: number, to: number, context: CompletionContext) => CompletionResult | null;
 }
 /**
 This annotation is added to transactions that are produced by
 picking a completion.
 */
 declare const pickedCompletion: _codemirror_state.AnnotationType<Completion>;
+/**
+Helper function that returns a transaction spec which inserts a
+completion's text in the main selection range, and any other
+selection range that has the same text in front of it.
+*/
+declare function insertCompletionText(state: EditorState, text: string, from: number, to: number): TransactionSpec;
 
 /**
-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}"
 
@@ -331,6 +359,56 @@ return those as completions.
 */
 declare const completeAnyWord: CompletionSource;
 
+/**
+Configures bracket closing behavior for a syntax (via
+[language data](https://codemirror.net/6/docs/ref/#state.EditorState.languageDataAt)) using the `"closeBrackets"`
+identifier.
+*/
+interface CloseBracketConfig {
+    /**
+    The opening brackets to close. Defaults to `["(", "[", "{", "'",
+    '"']`. Brackets may be single characters or a triple of quotes
+    (as in `"''''"`).
+    */
+    brackets?: string[];
+    /**
+    Characters in front of which newly opened brackets are
+    automatically closed. Closing always happens in front of
+    whitespace. Defaults to `")]}:;>"`.
+    */
+    before?: string;
+}
+/**
+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.
+*/
+declare function closeBrackets(): Extension;
+/**
+Command that implements deleting a pair of matching brackets when
+the cursor is between them.
+*/
+declare const deleteBracketPair: StateCommand;
+/**
+Close-brackets related key bindings. Binds Backspace to
+[`deleteBracketPair`](https://codemirror.net/6/docs/ref/#autocomplete.deleteBracketPair).
+*/
+declare const closeBracketsKeymap: readonly KeyBinding[];
+/**
+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.)
+*/
+declare function insertBracket(state: EditorState, bracket: string): Transaction | null;
+
 /**
 Returns an extension that enables autocompletion.
 */
@@ -373,4 +451,4 @@ the currently selected completion.
 */
 declare function setSelectedCompletion(index: number): StateEffect<unknown>;
 
-export { Completion, CompletionContext, CompletionResult, CompletionSource, acceptCompletion, autocompletion, clearSnippet, closeCompletion, completeAnyWord, completeFromList, completionKeymap, completionStatus, currentCompletions, ifIn, ifNotIn, moveCompletionSelection, nextSnippetField, pickedCompletion, prevSnippetField, selectedCompletion, selectedCompletionIndex, setSelectedCompletion, snippet, snippetCompletion, snippetKeymap, startCompletion };
+export { CloseBracketConfig, Completion, CompletionContext, CompletionResult, CompletionSource, acceptCompletion, autocompletion, clearSnippet, closeBrackets, closeBracketsKeymap, closeCompletion, completeAnyWord, completeFromList, completionKeymap, completionStatus, currentCompletions, deleteBracketPair, ifIn, ifNotIn, insertBracket, insertCompletionText, moveCompletionSelection, nextSnippetField, pickedCompletion, prevSnippetField, selectedCompletion, selectedCompletionIndex, setSelectedCompletion, snippet, snippetCompletion, snippetKeymap, startCompletion };

package/dist/index.js

@@ -1,8 +1,6 @@
-import { Annotation, Facet, combineConfig, StateEffect, StateField, Prec, EditorSelection, Text, MapMode } from '@codemirror/state';
-import { logException, Direction, 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;
     };
 }
 /**
@@ -151,20 +149,35 @@ This annotation is added to transactions that are produced by
 picking a completion.
 */
 const pickedCompletion = /*@__PURE__*/Annotation.define();
+/**
+Helper function that returns a transaction spec which inserts a
+completion's text in the main selection range, and any other
+selection range that has the same text in front of it.
+*/
+function insertCompletionText(state, text, from, to) {
+    return state.changeByRange(range => {
+        if (range == state.selection.main)
+            return {
+                changes: { from: from, to: to, insert: text },
+                range: EditorSelection.cursor(from + text.length)
+            };
+        let len = to - from;
+        if (!range.empty ||
+            len && state.sliceDoc(range.from - len, range.from) != state.sliceDoc(from, to))
+            return { range };
+        return {
+            changes: { from: range.from - len, to: range.from, insert: text },
+            range: EditorSelection.cursor(range.from - len + text.length)
+        };
+    });
+}
 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 },
-            userEvent: "input.complete",
-            annotations: pickedCompletion.of(option.completion)
-        });
-    }
-    else {
+    if (typeof apply == "string")
+        view.dispatch(insertCompletionText(view.state, apply, result.from, result.to));
+    else
         apply(view, option.completion, result.from, result.to);
-    }
 }
 const SourceCache = /*@__PURE__*/new WeakMap();
 function asSource(source) {
@@ -306,6 +319,7 @@ const completionConfig = /*@__PURE__*/Facet.define({
         return combineConfig(configs, {
             activateOnTyping: true,
             override: null,
+            closeOnBlur: true,
             maxRenderedOptions: 100,
             defaultKeymap: true,
             optionClass: () => "",
@@ -314,6 +328,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)
@@ -548,7 +563,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) {
@@ -560,8 +574,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;
@@ -575,10 +595,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;
@@ -728,24 +747,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) {
@@ -753,9 +775,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({
@@ -929,7 +957,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)
@@ -961,6 +989,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 */;
         },
@@ -1202,8 +1235,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}"
 
@@ -1386,8 +1420,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.
@@ -1472,4 +1736,4 @@ 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, selectedCompletionIndex, setSelectedCompletion, snippet, snippetCompletion, snippetKeymap, startCompletion };
+export { CompletionContext, acceptCompletion, autocompletion, clearSnippet, closeBrackets, closeBracketsKeymap, closeCompletion, completeAnyWord, completeFromList, completionKeymap, completionStatus, currentCompletions, deleteBracketPair, ifIn, ifNotIn, insertBracket, insertCompletionText, moveCompletionSelection, nextSnippetField, pickedCompletion, prevSnippetField, selectedCompletion, selectedCompletionIndex, setSelectedCompletion, snippet, snippetCompletion, snippetKeymap, startCompletion };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codemirror/autocomplete",
-  "version": "0.19.15",
+  "version": "0.20.2",
   "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"