@codemirror/view 6.0.2 → 6.1.1

package/CHANGELOG.md

@@ -1,3 +1,29 @@
+## 6.1.1 (2022-07-25)
+
+### Bug fixes
+
+Make `highlightSpecialChars` replace directional isolate characters by default.
+
+The editor will now try to suppress browsers' native behavior of resetting the selection in the editable content when the editable element is focused (programmatically, with tab, etc).
+
+Fix a CSS issue that made it possible, when the gutters were wide enough, for them to overlap with the content.
+
+## 6.1.0 (2022-07-19)
+
+### New features
+
+`MatchDecorator` now supports a `decorate` option that can be used to customize the way decorations are added for each match.
+
+## 6.0.3 (2022-07-08)
+
+### Bug fixes
+
+Fix a problem where `posAtCoords` could incorrectly return the start of the next line when querying positions between lines.
+
+Fix an issue where registering a high-precedence keymap made keymap handling take precedence over other keydown event handlers.
+
+Ctrl/Cmd-clicking can now remove ranges from a multi-range selection.
+
 ## 6.0.2 (2022-06-23)
 
 ### Bug fixes

package/dist/index.cjs

@@ -268,6 +268,31 @@ function clearAttributes(node) {
     while (node.attributes.length)
         node.removeAttributeNode(node.attributes[0]);
 }
+function atElementStart(doc, selection) {
+    let node = selection.focusNode, offset = selection.focusOffset;
+    if (!node || selection.anchorNode != node || selection.anchorOffset != offset)
+        return false;
+    for (;;) {
+        if (offset) {
+            if (node.nodeType != 1)
+                return false;
+            let prev = node.childNodes[offset - 1];
+            if (prev.contentEditable == "false")
+                offset--;
+            else {
+                node = prev;
+                offset = maxOffset(node);
+            }
+        }
+        else if (node == doc) {
+            return true;
+        }
+        else {
+            offset = domIndex(node);
+            node = node.parentNode;
+        }
+    }
+}
 
 class DOMPos {
     constructor(node, offset, precise = true) {
@@ -3137,7 +3162,8 @@ function posAtCoords(view, { x, y }, precise, bias = -1) {
             let range = doc.caretRangeFromPoint(x, y);
             if (range) {
                 ({ startContainer: node, startOffset: offset } = range);
-                if (browser.safari && isSuspiciousCaretResult(node, offset, x))
+                if (browser.safari && isSuspiciousSafariCaretResult(node, offset, x) ||
+                    browser.chrome && isSuspiciousChromeCaretResult(node, offset, x))
                     node = undefined;
             }
         }
@@ -3164,7 +3190,7 @@ function posAtCoordsImprecise(view, contentRect, block, x, y) {
 // the space between lines as belonging to the last character of the
 // line before. This is used to detect such a result so that it can be
 // ignored (issue #401).
-function isSuspiciousCaretResult(node, offset, x) {
+function isSuspiciousSafariCaretResult(node, offset, x) {
     let len;
     if (node.nodeType != 3 || offset != (len = node.nodeValue.length))
         return false;
@@ -3173,6 +3199,22 @@ function isSuspiciousCaretResult(node, offset, x) {
             return false;
     return textRange(node, len - 1, len).getBoundingClientRect().left > x;
 }
+// Chrome will move positions between lines to the start of the next line
+function isSuspiciousChromeCaretResult(node, offset, x) {
+    if (offset != 0)
+        return false;
+    for (let cur = node;;) {
+        let parent = cur.parentNode;
+        if (!parent || parent.nodeType != 1 || parent.firstChild != cur)
+            return false;
+        if (parent.classList.contains("cm-line"))
+            break;
+        cur = parent;
+    }
+    let rect = node.nodeType == 1 ? node.getBoundingClientRect()
+        : textRange(node, 0, Math.max(node.nodeValue.length, 1)).getBoundingClientRect();
+    return x - rect.left > 5;
+}
 function moveToLineBoundary(view, start, forward, includeWrap) {
     let line = view.state.doc.lineAt(start.head);
     let coords = !includeWrap || !view.lineWrapping ? null
@@ -3272,6 +3314,10 @@ class InputState {
     constructor(view) {
         this.lastKeyCode = 0;
         this.lastKeyTime = 0;
+        this.lastTouchTime = 0;
+        this.lastFocusTime = 0;
+        this.lastScrollTop = 0;
+        this.lastScrollLeft = 0;
         this.chromeScrollHack = -1;
         // On iOS, some keys need to have their default behavior happen
         // (after which we retroactively handle them and reset the DOM) to
@@ -3373,6 +3419,8 @@ class InputState {
         return false;
     }
     runScrollHandlers(view, event) {
+        this.lastScrollTop = view.scrollDOM.scrollTop;
+        this.lastScrollLeft = view.scrollDOM.scrollLeft;
         for (let set of this.customHandlers) {
             let handler = set.handlers.scroll;
             if (handler) {
@@ -3617,9 +3665,8 @@ handlers.keydown = (view, event) => {
     else if (modifierCodes.indexOf(event.keyCode) < 0)
         view.inputState.lastEscPress = 0;
 };
-let lastTouch = 0;
 handlers.touchstart = (view, e) => {
-    lastTouch = Date.now();
+    view.inputState.lastTouchTime = Date.now();
     view.inputState.setSelectionOrigin("select.pointer");
 };
 handlers.touchmove = view => {
@@ -3627,7 +3674,7 @@ handlers.touchmove = view => {
 };
 handlers.mousedown = (view, event) => {
     view.observer.flush();
-    if (lastTouch > Date.now() - 2000 && getClickType(event) == 1)
+    if (view.inputState.lastTouchTime > Date.now() - 2000 && getClickType(event) == 1)
         return; // Ignore touch interaction
     let style = null;
     for (let makeStyle of view.state.facet(mouseSelectionStyle)) {
@@ -3731,6 +3778,8 @@ function basicMouseSelection(view, event) {
             }
             if (extend)
                 return startSel.replaceRange(startSel.main.extend(range.from, range.to));
+            else if (multiple && startSel.ranges.length > 1 && startSel.ranges.some(r => r.eq(range)))
+                return removeRange(startSel, range);
             else if (multiple)
                 return startSel.addRange(range);
             else
@@ -3738,6 +3787,12 @@ function basicMouseSelection(view, event) {
         }
     };
 }
+function removeRange(sel, range) {
+    for (let i = 0;; i++) {
+        if (sel.ranges[i].eq(range))
+            return state.EditorSelection.create(sel.ranges.slice(0, i).concat(sel.ranges.slice(i + 1)), sel.mainIndex == i ? 0 : sel.mainIndex - (sel.mainIndex > i ? 1 : 0));
+    }
+}
 handlers.dragstart = (view, event) => {
     let { selection: { main } } = view.state;
     let { mouseSelection } = view.inputState;
@@ -3873,7 +3928,15 @@ function updateForFocusChange(view) {
             view.update([]);
     }, 10);
 }
-handlers.focus = updateForFocusChange;
+handlers.focus = view => {
+    view.inputState.lastFocusTime = Date.now();
+    // When focusing reset the scroll position, move it back to where it was
+    if (!view.scrollDOM.scrollTop && (view.inputState.lastScrollTop || view.inputState.lastScrollLeft)) {
+        view.scrollDOM.scrollTop = view.inputState.lastScrollTop;
+        view.scrollDOM.scrollLeft = view.inputState.lastScrollLeft;
+    }
+    updateForFocusChange(view);
+};
 handlers.blur = view => {
     view.observer.clearSelectionRange();
     updateForFocusChange(view);
@@ -5222,8 +5285,8 @@ const baseTheme$1 = buildTheme("." + baseThemeID, {
     // Two animations defined so that we can switch between them to
     // restart the animation without forcing another style
     // recomputation.
-    "@keyframes cm-blink": { "0%": {}, "50%": { visibility: "hidden" }, "100%": {} },
-    "@keyframes cm-blink2": { "0%": {}, "50%": { visibility: "hidden" }, "100%": {} },
+    "@keyframes cm-blink": { "0%": {}, "50%": { opacity: 0 }, "100%": {} },
+    "@keyframes cm-blink2": { "0%": {}, "50%": { opacity: 0 }, "100%": {} },
     ".cm-cursor, .cm-dropCursor": {
         position: "absolute",
         borderLeft: "1.2px solid black",
@@ -5244,6 +5307,7 @@ const baseTheme$1 = buildTheme("." + baseThemeID, {
     "&light .cm-specialChar": { color: "red" },
     "&dark .cm-specialChar": { color: "#f78" },
     ".cm-gutters": {
+        flexShrink: 0,
         display: "flex",
         height: "100%",
         boxSizing: "border-box",
@@ -5500,15 +5564,28 @@ class DOMObserver {
             this.flush(false);
     }
     readSelectionRange() {
-        let { root } = this.view;
+        let { view } = this;
         // The Selection object is broken in shadow roots in Safari. See
         // https://github.com/codemirror/dev/issues/414
-        let range = browser.safari && root.nodeType == 11 && deepActiveElement() == this.view.contentDOM &&
-            safariSelectionRangeHack(this.view) || getSelection(root);
+        let range = browser.safari && view.root.nodeType == 11 && deepActiveElement() == this.dom &&
+            safariSelectionRangeHack(this.view) || getSelection(view.root);
         if (!range || this.selectionRange.eq(range))
             return false;
+        let local = hasSelection(this.dom, range);
+        // Detect the situation where the browser has, on focus, moved the
+        // selection to the start of the content element. Reset it to the
+        // position from the editor state.
+        if (local && !this.selectionChanged && this.selectionRange.focusNode &&
+            view.inputState.lastFocusTime > Date.now() - 200 &&
+            view.inputState.lastTouchTime < Date.now() - 300 &&
+            atElementStart(this.dom, range)) {
+            view.docView.updateSelection();
+            return false;
+        }
         this.selectionRange.setRange(range);
-        return this.selectionChanged = true;
+        if (local)
+            this.selectionChanged = true;
+        return true;
     }
     setSelectionRange(anchor, head) {
         this.selectionRange.set(anchor.node, anchor.offset, head.node, head.offset);
@@ -5595,7 +5672,7 @@ class DOMObserver {
                 this.delayedAndroidKey = null;
                 this.delayedFlush = -1;
                 if (!this.flush())
-                    dispatchKey(this.view.contentDOM, key.key, key.keyCode);
+                    dispatchKey(this.dom, key.key, key.keyCode);
             });
         // Since backspace beforeinput is sometimes signalled spuriously,
         // Enter always takes precedence.
@@ -5649,6 +5726,7 @@ class DOMObserver {
         let newSel = this.selectionChanged && hasSelection(this.dom, this.selectionRange);
         if (from < 0 && !newSel)
             return;
+        this.view.inputState.lastFocusTime = 0;
         this.selectionChanged = false;
         let startState = this.view.state;
         let handled = this.onChange(from, to, typeOver);
@@ -6890,11 +6968,11 @@ function modifiers(name, event, shift) {
         name = "Shift-" + name;
     return name;
 }
-const handleKeyEvents = EditorView.domEventHandlers({
+const handleKeyEvents = state.Prec.default(EditorView.domEventHandlers({
     keydown(event, view) {
         return runHandlers(getKeymap(view.state), event, view, "editor");
     }
-});
+}));
 /**
 Facet used for registering keymaps.
 
@@ -7356,7 +7434,7 @@ function iterMatches(doc, re, from, to, f) {
     for (let cursor = doc.iterRange(from, to), pos = from, m; !cursor.next().done; pos += cursor.value.length) {
         if (!cursor.lineBreak)
             while (m = re.exec(cursor.value))
-                f(pos + m.index, pos + m.index + m[0].length, m);
+                f(pos + m.index, m);
     }
 }
 function matchRanges(view, maxLength) {
@@ -7386,11 +7464,20 @@ class MatchDecorator {
     Create a decorator.
     */
     constructor(config) {
-        let { regexp, decoration, boundary, maxLength = 1000 } = config;
+        const { regexp, decoration, decorate, boundary, maxLength = 1000 } = config;
         if (!regexp.global)
             throw new RangeError("The regular expression given to MatchDecorator should have its 'g' flag set");
         this.regexp = regexp;
-        this.getDeco = typeof decoration == "function" ? decoration : () => decoration;
+        if (decorate) {
+            this.addMatch = (match, view, from, add) => decorate(add, from, from + match[0].length, match, view);
+        }
+        else if (decoration) {
+            let getDeco = typeof decoration == "function" ? decoration : () => decoration;
+            this.addMatch = (match, view, from, add) => add(from, from + match[0].length, getDeco(match, view, from));
+        }
+        else {
+            throw new RangeError("Either 'decorate' or 'decoration' should be provided to MatchDecorator");
+        }
         this.boundary = boundary;
         this.maxLength = maxLength;
     }
@@ -7400,9 +7487,9 @@ class MatchDecorator {
     plugin.
     */
     createDeco(view) {
-        let build = new state.RangeSetBuilder();
+        let build = new state.RangeSetBuilder(), add = build.add.bind(build);
         for (let { from, to } of matchRanges(view, this.maxLength))
-            iterMatches(view.state.doc, this.regexp, from, to, (a, b, m) => build.add(a, b, this.getDeco(m, view, a)));
+            iterMatches(view.state.doc, this.regexp, from, to, (from, m) => this.addMatch(m, view, from, add));
         return build.finish();
     }
     /**
@@ -7444,15 +7531,14 @@ class MatchDecorator {
                         }
                 }
                 let ranges = [], m;
+                let add = (from, to, deco) => ranges.push(deco.range(from, to));
                 if (fromLine == toLine) {
                     this.regexp.lastIndex = start - fromLine.from;
-                    while ((m = this.regexp.exec(fromLine.text)) && m.index < end - fromLine.from) {
-                        let pos = m.index + fromLine.from;
-                        ranges.push(this.getDeco(m, view, pos).range(pos, pos + m[0].length));
-                    }
+                    while ((m = this.regexp.exec(fromLine.text)) && m.index < end - fromLine.from)
+                        this.addMatch(m, view, m.index + fromLine.from, add);
                 }
                 else {
-                    iterMatches(view.state.doc, this.regexp, start, end, (from, to, m) => ranges.push(this.getDeco(m, view, from).range(from, to)));
+                    iterMatches(view.state.doc, this.regexp, start, end, (from, m) => this.addMatch(m, view, from, add));
                 }
                 deco = deco.update({ filterFrom: start, filterTo: end, filter: (from, to) => from < start || to > end, add: ranges });
             }
@@ -7462,7 +7548,7 @@ class MatchDecorator {
 }
 
 const UnicodeRegexpSupport = /x/.unicode != null ? "gu" : "g";
-const Specials = new RegExp("[\u0000-\u0008\u000a-\u001f\u007f-\u009f\u00ad\u061c\u200b\u200e\u200f\u2028\u2029\u202d\u202e\ufeff\ufff9-\ufffc]", UnicodeRegexpSupport);
+const Specials = new RegExp("[\u0000-\u0008\u000a-\u001f\u007f-\u009f\u00ad\u061c\u200b\u200e\u200f\u2028\u2029\u202d\u202e\u2066\u2067\u2069\ufeff\ufff9-\ufffc]", UnicodeRegexpSupport);
 const Names = {
     0: "null",
     7: "bell",
@@ -7479,6 +7565,9 @@ const Names = {
     8232: "line separator",
     8237: "left-to-right override",
     8238: "right-to-left override",
+    8294: "left-to-right isolate",
+    8295: "right-to-left isolate",
+    8297: "pop directional isolate",
     8233: "paragraph separator",
     65279: "zero width no-break space",
     65532: "object replacement"

package/dist/index.d.ts

@@ -1357,7 +1357,7 @@ represent a matching configuration.
 */
 declare class MatchDecorator {
     private regexp;
-    private getDeco;
+    private addMatch;
     private boundary;
     private maxLength;
     /**
@@ -1374,7 +1374,18 @@ declare class MatchDecorator {
         The decoration to apply to matches, either directly or as a
         function of the match.
         */
-        decoration: Decoration | ((match: RegExpExecArray, view: EditorView, pos: number) => Decoration);
+        decoration?: Decoration | ((match: RegExpExecArray, view: EditorView, pos: number) => Decoration);
+        /**
+        Customize the way decorations are added for matches. This
+        function, when given, will be called for matches and should
+        call `add` to create decorations for them. Note that the
+        decorations should appear *in* the given range, and the
+        function should have no side effects beyond calling `add`.
+        
+        The `decoration` option is ignored when `decorate` is
+        provided.
+        */
+        decorate?: (add: (from: number, to: number, decoration: Decoration) => void, from: number, to: number, match: RegExpExecArray, view: EditorView) => void;
         /**
         By default, changed lines are re-matched entirely. You can
         provide a boundary expression, which should match single

package/dist/index.js

@@ -264,6 +264,31 @@ function clearAttributes(node) {
     while (node.attributes.length)
         node.removeAttributeNode(node.attributes[0]);
 }
+function atElementStart(doc, selection) {
+    let node = selection.focusNode, offset = selection.focusOffset;
+    if (!node || selection.anchorNode != node || selection.anchorOffset != offset)
+        return false;
+    for (;;) {
+        if (offset) {
+            if (node.nodeType != 1)
+                return false;
+            let prev = node.childNodes[offset - 1];
+            if (prev.contentEditable == "false")
+                offset--;
+            else {
+                node = prev;
+                offset = maxOffset(node);
+            }
+        }
+        else if (node == doc) {
+            return true;
+        }
+        else {
+            offset = domIndex(node);
+            node = node.parentNode;
+        }
+    }
+}
 
 class DOMPos {
     constructor(node, offset, precise = true) {
@@ -3131,7 +3156,8 @@ function posAtCoords(view, { x, y }, precise, bias = -1) {
             let range = doc.caretRangeFromPoint(x, y);
             if (range) {
                 ({ startContainer: node, startOffset: offset } = range);
-                if (browser.safari && isSuspiciousCaretResult(node, offset, x))
+                if (browser.safari && isSuspiciousSafariCaretResult(node, offset, x) ||
+                    browser.chrome && isSuspiciousChromeCaretResult(node, offset, x))
                     node = undefined;
             }
         }
@@ -3158,7 +3184,7 @@ function posAtCoordsImprecise(view, contentRect, block, x, y) {
 // the space between lines as belonging to the last character of the
 // line before. This is used to detect such a result so that it can be
 // ignored (issue #401).
-function isSuspiciousCaretResult(node, offset, x) {
+function isSuspiciousSafariCaretResult(node, offset, x) {
     let len;
     if (node.nodeType != 3 || offset != (len = node.nodeValue.length))
         return false;
@@ -3167,6 +3193,22 @@ function isSuspiciousCaretResult(node, offset, x) {
             return false;
     return textRange(node, len - 1, len).getBoundingClientRect().left > x;
 }
+// Chrome will move positions between lines to the start of the next line
+function isSuspiciousChromeCaretResult(node, offset, x) {
+    if (offset != 0)
+        return false;
+    for (let cur = node;;) {
+        let parent = cur.parentNode;
+        if (!parent || parent.nodeType != 1 || parent.firstChild != cur)
+            return false;
+        if (parent.classList.contains("cm-line"))
+            break;
+        cur = parent;
+    }
+    let rect = node.nodeType == 1 ? node.getBoundingClientRect()
+        : textRange(node, 0, Math.max(node.nodeValue.length, 1)).getBoundingClientRect();
+    return x - rect.left > 5;
+}
 function moveToLineBoundary(view, start, forward, includeWrap) {
     let line = view.state.doc.lineAt(start.head);
     let coords = !includeWrap || !view.lineWrapping ? null
@@ -3266,6 +3308,10 @@ class InputState {
     constructor(view) {
         this.lastKeyCode = 0;
         this.lastKeyTime = 0;
+        this.lastTouchTime = 0;
+        this.lastFocusTime = 0;
+        this.lastScrollTop = 0;
+        this.lastScrollLeft = 0;
         this.chromeScrollHack = -1;
         // On iOS, some keys need to have their default behavior happen
         // (after which we retroactively handle them and reset the DOM) to
@@ -3367,6 +3413,8 @@ class InputState {
         return false;
     }
     runScrollHandlers(view, event) {
+        this.lastScrollTop = view.scrollDOM.scrollTop;
+        this.lastScrollLeft = view.scrollDOM.scrollLeft;
         for (let set of this.customHandlers) {
             let handler = set.handlers.scroll;
             if (handler) {
@@ -3611,9 +3659,8 @@ handlers.keydown = (view, event) => {
     else if (modifierCodes.indexOf(event.keyCode) < 0)
         view.inputState.lastEscPress = 0;
 };
-let lastTouch = 0;
 handlers.touchstart = (view, e) => {
-    lastTouch = Date.now();
+    view.inputState.lastTouchTime = Date.now();
     view.inputState.setSelectionOrigin("select.pointer");
 };
 handlers.touchmove = view => {
@@ -3621,7 +3668,7 @@ handlers.touchmove = view => {
 };
 handlers.mousedown = (view, event) => {
     view.observer.flush();
-    if (lastTouch > Date.now() - 2000 && getClickType(event) == 1)
+    if (view.inputState.lastTouchTime > Date.now() - 2000 && getClickType(event) == 1)
         return; // Ignore touch interaction
     let style = null;
     for (let makeStyle of view.state.facet(mouseSelectionStyle)) {
@@ -3725,6 +3772,8 @@ function basicMouseSelection(view, event) {
             }
             if (extend)
                 return startSel.replaceRange(startSel.main.extend(range.from, range.to));
+            else if (multiple && startSel.ranges.length > 1 && startSel.ranges.some(r => r.eq(range)))
+                return removeRange(startSel, range);
             else if (multiple)
                 return startSel.addRange(range);
             else
@@ -3732,6 +3781,12 @@ function basicMouseSelection(view, event) {
         }
     };
 }
+function removeRange(sel, range) {
+    for (let i = 0;; i++) {
+        if (sel.ranges[i].eq(range))
+            return EditorSelection.create(sel.ranges.slice(0, i).concat(sel.ranges.slice(i + 1)), sel.mainIndex == i ? 0 : sel.mainIndex - (sel.mainIndex > i ? 1 : 0));
+    }
+}
 handlers.dragstart = (view, event) => {
     let { selection: { main } } = view.state;
     let { mouseSelection } = view.inputState;
@@ -3867,7 +3922,15 @@ function updateForFocusChange(view) {
             view.update([]);
     }, 10);
 }
-handlers.focus = updateForFocusChange;
+handlers.focus = view => {
+    view.inputState.lastFocusTime = Date.now();
+    // When focusing reset the scroll position, move it back to where it was
+    if (!view.scrollDOM.scrollTop && (view.inputState.lastScrollTop || view.inputState.lastScrollLeft)) {
+        view.scrollDOM.scrollTop = view.inputState.lastScrollTop;
+        view.scrollDOM.scrollLeft = view.inputState.lastScrollLeft;
+    }
+    updateForFocusChange(view);
+};
 handlers.blur = view => {
     view.observer.clearSelectionRange();
     updateForFocusChange(view);
@@ -5215,8 +5278,8 @@ const baseTheme$1 = /*@__PURE__*/buildTheme("." + baseThemeID, {
     // Two animations defined so that we can switch between them to
     // restart the animation without forcing another style
     // recomputation.
-    "@keyframes cm-blink": { "0%": {}, "50%": { visibility: "hidden" }, "100%": {} },
-    "@keyframes cm-blink2": { "0%": {}, "50%": { visibility: "hidden" }, "100%": {} },
+    "@keyframes cm-blink": { "0%": {}, "50%": { opacity: 0 }, "100%": {} },
+    "@keyframes cm-blink2": { "0%": {}, "50%": { opacity: 0 }, "100%": {} },
     ".cm-cursor, .cm-dropCursor": {
         position: "absolute",
         borderLeft: "1.2px solid black",
@@ -5237,6 +5300,7 @@ const baseTheme$1 = /*@__PURE__*/buildTheme("." + baseThemeID, {
     "&light .cm-specialChar": { color: "red" },
     "&dark .cm-specialChar": { color: "#f78" },
     ".cm-gutters": {
+        flexShrink: 0,
         display: "flex",
         height: "100%",
         boxSizing: "border-box",
@@ -5493,15 +5557,28 @@ class DOMObserver {
             this.flush(false);
     }
     readSelectionRange() {
-        let { root } = this.view;
+        let { view } = this;
         // The Selection object is broken in shadow roots in Safari. See
         // https://github.com/codemirror/dev/issues/414
-        let range = browser.safari && root.nodeType == 11 && deepActiveElement() == this.view.contentDOM &&
-            safariSelectionRangeHack(this.view) || getSelection(root);
+        let range = browser.safari && view.root.nodeType == 11 && deepActiveElement() == this.dom &&
+            safariSelectionRangeHack(this.view) || getSelection(view.root);
         if (!range || this.selectionRange.eq(range))
             return false;
+        let local = hasSelection(this.dom, range);
+        // Detect the situation where the browser has, on focus, moved the
+        // selection to the start of the content element. Reset it to the
+        // position from the editor state.
+        if (local && !this.selectionChanged && this.selectionRange.focusNode &&
+            view.inputState.lastFocusTime > Date.now() - 200 &&
+            view.inputState.lastTouchTime < Date.now() - 300 &&
+            atElementStart(this.dom, range)) {
+            view.docView.updateSelection();
+            return false;
+        }
         this.selectionRange.setRange(range);
-        return this.selectionChanged = true;
+        if (local)
+            this.selectionChanged = true;
+        return true;
     }
     setSelectionRange(anchor, head) {
         this.selectionRange.set(anchor.node, anchor.offset, head.node, head.offset);
@@ -5588,7 +5665,7 @@ class DOMObserver {
                 this.delayedAndroidKey = null;
                 this.delayedFlush = -1;
                 if (!this.flush())
-                    dispatchKey(this.view.contentDOM, key.key, key.keyCode);
+                    dispatchKey(this.dom, key.key, key.keyCode);
             });
         // Since backspace beforeinput is sometimes signalled spuriously,
         // Enter always takes precedence.
@@ -5642,6 +5719,7 @@ class DOMObserver {
         let newSel = this.selectionChanged && hasSelection(this.dom, this.selectionRange);
         if (from < 0 && !newSel)
             return;
+        this.view.inputState.lastFocusTime = 0;
         this.selectionChanged = false;
         let startState = this.view.state;
         let handled = this.onChange(from, to, typeOver);
@@ -6883,11 +6961,11 @@ function modifiers(name, event, shift) {
         name = "Shift-" + name;
     return name;
 }
-const handleKeyEvents = /*@__PURE__*/EditorView.domEventHandlers({
+const handleKeyEvents = /*@__PURE__*/Prec.default(/*@__PURE__*/EditorView.domEventHandlers({
     keydown(event, view) {
         return runHandlers(getKeymap(view.state), event, view, "editor");
     }
-});
+}));
 /**
 Facet used for registering keymaps.
 
@@ -7349,7 +7427,7 @@ function iterMatches(doc, re, from, to, f) {
     for (let cursor = doc.iterRange(from, to), pos = from, m; !cursor.next().done; pos += cursor.value.length) {
         if (!cursor.lineBreak)
             while (m = re.exec(cursor.value))
-                f(pos + m.index, pos + m.index + m[0].length, m);
+                f(pos + m.index, m);
     }
 }
 function matchRanges(view, maxLength) {
@@ -7379,11 +7457,20 @@ class MatchDecorator {
     Create a decorator.
     */
     constructor(config) {
-        let { regexp, decoration, boundary, maxLength = 1000 } = config;
+        const { regexp, decoration, decorate, boundary, maxLength = 1000 } = config;
         if (!regexp.global)
             throw new RangeError("The regular expression given to MatchDecorator should have its 'g' flag set");
         this.regexp = regexp;
-        this.getDeco = typeof decoration == "function" ? decoration : () => decoration;
+        if (decorate) {
+            this.addMatch = (match, view, from, add) => decorate(add, from, from + match[0].length, match, view);
+        }
+        else if (decoration) {
+            let getDeco = typeof decoration == "function" ? decoration : () => decoration;
+            this.addMatch = (match, view, from, add) => add(from, from + match[0].length, getDeco(match, view, from));
+        }
+        else {
+            throw new RangeError("Either 'decorate' or 'decoration' should be provided to MatchDecorator");
+        }
         this.boundary = boundary;
         this.maxLength = maxLength;
     }
@@ -7393,9 +7480,9 @@ class MatchDecorator {
     plugin.
     */
     createDeco(view) {
-        let build = new RangeSetBuilder();
+        let build = new RangeSetBuilder(), add = build.add.bind(build);
         for (let { from, to } of matchRanges(view, this.maxLength))
-            iterMatches(view.state.doc, this.regexp, from, to, (a, b, m) => build.add(a, b, this.getDeco(m, view, a)));
+            iterMatches(view.state.doc, this.regexp, from, to, (from, m) => this.addMatch(m, view, from, add));
         return build.finish();
     }
     /**
@@ -7437,15 +7524,14 @@ class MatchDecorator {
                         }
                 }
                 let ranges = [], m;
+                let add = (from, to, deco) => ranges.push(deco.range(from, to));
                 if (fromLine == toLine) {
                     this.regexp.lastIndex = start - fromLine.from;
-                    while ((m = this.regexp.exec(fromLine.text)) && m.index < end - fromLine.from) {
-                        let pos = m.index + fromLine.from;
-                        ranges.push(this.getDeco(m, view, pos).range(pos, pos + m[0].length));
-                    }
+                    while ((m = this.regexp.exec(fromLine.text)) && m.index < end - fromLine.from)
+                        this.addMatch(m, view, m.index + fromLine.from, add);
                 }
                 else {
-                    iterMatches(view.state.doc, this.regexp, start, end, (from, to, m) => ranges.push(this.getDeco(m, view, from).range(from, to)));
+                    iterMatches(view.state.doc, this.regexp, start, end, (from, m) => this.addMatch(m, view, from, add));
                 }
                 deco = deco.update({ filterFrom: start, filterTo: end, filter: (from, to) => from < start || to > end, add: ranges });
             }
@@ -7455,7 +7541,7 @@ class MatchDecorator {
 }
 
 const UnicodeRegexpSupport = /x/.unicode != null ? "gu" : "g";
-const Specials = /*@__PURE__*/new RegExp("[\u0000-\u0008\u000a-\u001f\u007f-\u009f\u00ad\u061c\u200b\u200e\u200f\u2028\u2029\u202d\u202e\ufeff\ufff9-\ufffc]", UnicodeRegexpSupport);
+const Specials = /*@__PURE__*/new RegExp("[\u0000-\u0008\u000a-\u001f\u007f-\u009f\u00ad\u061c\u200b\u200e\u200f\u2028\u2029\u202d\u202e\u2066\u2067\u2069\ufeff\ufff9-\ufffc]", UnicodeRegexpSupport);
 const Names = {
     0: "null",
     7: "bell",
@@ -7472,6 +7558,9 @@ const Names = {
     8232: "line separator",
     8237: "left-to-right override",
     8238: "right-to-left override",
+    8294: "left-to-right isolate",
+    8295: "right-to-left isolate",
+    8297: "pop directional isolate",
     8233: "paragraph separator",
     65279: "zero width no-break space",
     65532: "object replacement"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codemirror/view",
-  "version": "6.0.2",
+  "version": "6.1.1",
   "description": "DOM view component for the CodeMirror code editor",
   "scripts": {
     "test": "cm-runtests",