@codemirror/view 6.11.2 → 6.11.3

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## 6.11.3 (2023-05-17)
+
+### Bug fixes
+
+Make sure pointer selection respects `EditorView.atomicRanges`.
+
+Preserve DOM widgets when their decoration type changes but they otherwise stay in the same place.
+
+Fix a bug in `drawSelection` that could lead to invisible or incorrect selections for a blank line below a block widget.
+
 ## 6.11.2 (2023-05-13)
 
 ### Bug fixes

package/dist/index.cjs

@@ -1647,7 +1647,7 @@ class BlockWidgetView extends ContentView {
     }
     domBoundsAround() { return null; }
     become(other) {
-        if (other instanceof BlockWidgetView && other.type == this.type &&
+        if (other instanceof BlockWidgetView &&
             other.widget.constructor == this.widget.constructor) {
             if (!other.widget.compare(this.widget))
                 this.markDirty(true);
@@ -1655,6 +1655,7 @@ class BlockWidgetView extends ContentView {
                 this.prevWidget = this.widget;
             this.widget = other.widget;
             this.length = other.length;
+            this.type = other.type;
             this.breakAfter = other.breakAfter;
             return true;
         }
@@ -2481,6 +2482,7 @@ class DOMReader {
     constructor(points, state$1) {
         this.points = points;
         this.text = "";
+        console.log("make reader");
         this.lineSeparator = state$1.facet(state.EditorState.lineSeparator);
     }
     append(text) {
@@ -2495,6 +2497,7 @@ class DOMReader {
         let parent = start.parentNode;
         for (let cur = start;;) {
             this.findPointBefore(parent, cur);
+            let oldLen = this.text.length;
             this.readNode(cur);
             let next = cur.nextSibling;
             if (next == end)
@@ -2502,7 +2505,7 @@ class DOMReader {
             let view = ContentView.get(cur), nextView = ContentView.get(next);
             if (view && nextView ? view.breakAfter :
                 (view ? view.breakAfter : isBlockElement(cur)) ||
-                    (isBlockElement(next) && (cur.nodeName != "BR" || cur.cmIgnore)))
+                    (isBlockElement(next) && (cur.nodeName != "BR" || cur.cmIgnore) && this.text.length > oldLen))
                 this.lineBreak();
             cur = next;
         }
@@ -3451,15 +3454,15 @@ function moveVertically(view, start, forward, distance) {
             return state.EditorSelection.cursor(pos, start.assoc, undefined, goal);
     }
 }
-function skipAtoms(view, oldPos, pos) {
-    let atoms = view.state.facet(atomicRanges).map(f => f(view));
+function skipAtomicRanges(atoms, pos, bias) {
     for (;;) {
-        let moved = false;
+        let moved = 0;
         for (let set of atoms) {
-            set.between(pos.from - 1, pos.from + 1, (from, to, value) => {
-                if (pos.from > from && pos.from < to) {
-                    pos = oldPos.head > pos.from ? state.EditorSelection.cursor(from, 1) : state.EditorSelection.cursor(to, -1);
-                    moved = true;
+            set.between(pos - 1, pos + 1, (from, to, value) => {
+                if (pos > from && pos < to) {
+                    let side = moved || bias || (pos - from < to - pos ? -1 : 1);
+                    pos = side < 0 ? from : to;
+                    moved = side;
                 }
             });
         }
@@ -3467,6 +3470,10 @@ function skipAtoms(view, oldPos, pos) {
             return pos;
     }
 }
+function skipAtoms(view, oldPos, pos) {
+    let newPos = skipAtomicRanges(view.state.facet(atomicRanges).map(f => f(view)), pos.from, oldPos.head > pos.from ? -1 : 1);
+    return newPos == pos.from ? pos : state.EditorSelection.cursor(newPos, newPos < pos.from ? 1 : -1);
+}
 
 // This will also be where dragging info and such goes
 class InputState {
@@ -3716,6 +3723,7 @@ class MouseSelection {
         this.scrolling = -1;
         this.lastEvent = startEvent;
         this.scrollParent = scrollableParent(view.contentDOM);
+        this.atoms = view.state.facet(atomicRanges).map(f => f(view));
         let doc = view.contentDOM.ownerDocument;
         doc.addEventListener("mousemove", this.move = this.move.bind(this));
         doc.addEventListener("mouseup", this.up = this.up.bind(this));
@@ -3789,10 +3797,33 @@ class MouseSelection {
         if (this.dragging === false)
             this.select(this.lastEvent);
     }
+    skipAtoms(sel) {
+        let ranges = null;
+        for (let i = 0; i < sel.ranges.length; i++) {
+            let range = sel.ranges[i], updated = null;
+            if (range.empty) {
+                let pos = skipAtomicRanges(this.atoms, range.from, 0);
+                if (pos != range.from)
+                    updated = state.EditorSelection.cursor(pos, -1);
+            }
+            else {
+                let from = skipAtomicRanges(this.atoms, range.from, -1);
+                let to = skipAtomicRanges(this.atoms, range.to, 1);
+                if (from != range.from || to != range.to)
+                    updated = state.EditorSelection.range(range.from == range.anchor ? from : to, range.from == range.head ? from : to);
+            }
+            if (updated) {
+                if (!ranges)
+                    ranges = sel.ranges.slice();
+                ranges[i] = updated;
+            }
+        }
+        return ranges ? state.EditorSelection.create(ranges, sel.mainIndex) : sel;
+    }
     select(event) {
-        let selection = this.style.get(event, this.extend, this.multiple);
-        if (this.mustSelect || !selection.eq(this.view.state.selection) ||
-            selection.main.assoc != this.view.state.selection.main.assoc)
+        let { view } = this, selection = this.skipAtoms(this.style.get(event, this.extend, this.multiple));
+        if (this.mustSelect || !selection.eq(view.state.selection) ||
+            selection.main.assoc != view.state.selection.main.assoc)
             this.view.dispatch({
                 selection,
                 userEvent: "select.pointer"
@@ -7718,7 +7749,7 @@ function rectanglesForRange(view, className, range) {
         let top = visualStart ? drawForLine(range.from, null, visualStart) : drawForWidget(startBlock, false);
         let bottom = visualEnd ? drawForLine(null, range.to, visualEnd) : drawForWidget(endBlock, true);
         let between = [];
-        if ((visualStart || startBlock).to < (visualEnd || endBlock).from - 1)
+        if ((visualStart || startBlock).to < (visualEnd || endBlock).from - (visualStart && visualEnd ? 1 : 0))
             between.push(piece(leftSide, top.bottom, rightSide, bottom.top));
         else if (top.bottom < bottom.top && view.elementAtHeight((top.bottom + bottom.top) / 2).type == exports.BlockType.Text)
             top.bottom = bottom.top = (top.bottom + bottom.top) / 2;

package/dist/index.js

@@ -1642,7 +1642,7 @@ class BlockWidgetView extends ContentView {
     }
     domBoundsAround() { return null; }
     become(other) {
-        if (other instanceof BlockWidgetView && other.type == this.type &&
+        if (other instanceof BlockWidgetView &&
             other.widget.constructor == this.widget.constructor) {
             if (!other.widget.compare(this.widget))
                 this.markDirty(true);
@@ -1650,6 +1650,7 @@ class BlockWidgetView extends ContentView {
                 this.prevWidget = this.widget;
             this.widget = other.widget;
             this.length = other.length;
+            this.type = other.type;
             this.breakAfter = other.breakAfter;
             return true;
         }
@@ -2475,6 +2476,7 @@ class DOMReader {
     constructor(points, state) {
         this.points = points;
         this.text = "";
+        console.log("make reader");
         this.lineSeparator = state.facet(EditorState.lineSeparator);
     }
     append(text) {
@@ -2489,6 +2491,7 @@ class DOMReader {
         let parent = start.parentNode;
         for (let cur = start;;) {
             this.findPointBefore(parent, cur);
+            let oldLen = this.text.length;
             this.readNode(cur);
             let next = cur.nextSibling;
             if (next == end)
@@ -2496,7 +2499,7 @@ class DOMReader {
             let view = ContentView.get(cur), nextView = ContentView.get(next);
             if (view && nextView ? view.breakAfter :
                 (view ? view.breakAfter : isBlockElement(cur)) ||
-                    (isBlockElement(next) && (cur.nodeName != "BR" || cur.cmIgnore)))
+                    (isBlockElement(next) && (cur.nodeName != "BR" || cur.cmIgnore) && this.text.length > oldLen))
                 this.lineBreak();
             cur = next;
         }
@@ -3445,15 +3448,15 @@ function moveVertically(view, start, forward, distance) {
             return EditorSelection.cursor(pos, start.assoc, undefined, goal);
     }
 }
-function skipAtoms(view, oldPos, pos) {
-    let atoms = view.state.facet(atomicRanges).map(f => f(view));
+function skipAtomicRanges(atoms, pos, bias) {
     for (;;) {
-        let moved = false;
+        let moved = 0;
         for (let set of atoms) {
-            set.between(pos.from - 1, pos.from + 1, (from, to, value) => {
-                if (pos.from > from && pos.from < to) {
-                    pos = oldPos.head > pos.from ? EditorSelection.cursor(from, 1) : EditorSelection.cursor(to, -1);
-                    moved = true;
+            set.between(pos - 1, pos + 1, (from, to, value) => {
+                if (pos > from && pos < to) {
+                    let side = moved || bias || (pos - from < to - pos ? -1 : 1);
+                    pos = side < 0 ? from : to;
+                    moved = side;
                 }
             });
         }
@@ -3461,6 +3464,10 @@ function skipAtoms(view, oldPos, pos) {
             return pos;
     }
 }
+function skipAtoms(view, oldPos, pos) {
+    let newPos = skipAtomicRanges(view.state.facet(atomicRanges).map(f => f(view)), pos.from, oldPos.head > pos.from ? -1 : 1);
+    return newPos == pos.from ? pos : EditorSelection.cursor(newPos, newPos < pos.from ? 1 : -1);
+}
 
 // This will also be where dragging info and such goes
 class InputState {
@@ -3710,6 +3717,7 @@ class MouseSelection {
         this.scrolling = -1;
         this.lastEvent = startEvent;
         this.scrollParent = scrollableParent(view.contentDOM);
+        this.atoms = view.state.facet(atomicRanges).map(f => f(view));
         let doc = view.contentDOM.ownerDocument;
         doc.addEventListener("mousemove", this.move = this.move.bind(this));
         doc.addEventListener("mouseup", this.up = this.up.bind(this));
@@ -3783,10 +3791,33 @@ class MouseSelection {
         if (this.dragging === false)
             this.select(this.lastEvent);
     }
+    skipAtoms(sel) {
+        let ranges = null;
+        for (let i = 0; i < sel.ranges.length; i++) {
+            let range = sel.ranges[i], updated = null;
+            if (range.empty) {
+                let pos = skipAtomicRanges(this.atoms, range.from, 0);
+                if (pos != range.from)
+                    updated = EditorSelection.cursor(pos, -1);
+            }
+            else {
+                let from = skipAtomicRanges(this.atoms, range.from, -1);
+                let to = skipAtomicRanges(this.atoms, range.to, 1);
+                if (from != range.from || to != range.to)
+                    updated = EditorSelection.range(range.from == range.anchor ? from : to, range.from == range.head ? from : to);
+            }
+            if (updated) {
+                if (!ranges)
+                    ranges = sel.ranges.slice();
+                ranges[i] = updated;
+            }
+        }
+        return ranges ? EditorSelection.create(ranges, sel.mainIndex) : sel;
+    }
     select(event) {
-        let selection = this.style.get(event, this.extend, this.multiple);
-        if (this.mustSelect || !selection.eq(this.view.state.selection) ||
-            selection.main.assoc != this.view.state.selection.main.assoc)
+        let { view } = this, selection = this.skipAtoms(this.style.get(event, this.extend, this.multiple));
+        if (this.mustSelect || !selection.eq(view.state.selection) ||
+            selection.main.assoc != view.state.selection.main.assoc)
             this.view.dispatch({
                 selection,
                 userEvent: "select.pointer"
@@ -7711,7 +7742,7 @@ function rectanglesForRange(view, className, range) {
         let top = visualStart ? drawForLine(range.from, null, visualStart) : drawForWidget(startBlock, false);
         let bottom = visualEnd ? drawForLine(null, range.to, visualEnd) : drawForWidget(endBlock, true);
         let between = [];
-        if ((visualStart || startBlock).to < (visualEnd || endBlock).from - 1)
+        if ((visualStart || startBlock).to < (visualEnd || endBlock).from - (visualStart && visualEnd ? 1 : 0))
             between.push(piece(leftSide, top.bottom, rightSide, bottom.top));
         else if (top.bottom < bottom.top && view.elementAtHeight((top.bottom + bottom.top) / 2).type == BlockType.Text)
             top.bottom = bottom.top = (top.bottom + bottom.top) / 2;

package/package.json

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