@codemirror/view 6.4.0 → 6.4.2

package/CHANGELOG.md

@@ -1,3 +1,23 @@
+## 6.4.2 (2022-11-10)
+
+### Bug fixes
+
+Typing into a read-only editor no longer moves the cursor.
+
+Fix an issue where hover tooltips were closed when the mouse was moved over them if they had a custom parent element.
+
+Fix an issue where the editor could end up displaying incorrect height measurements (typically after initializing).
+
+## 6.4.1 (2022-11-07)
+
+### Bug fixes
+
+Fix an issue where coordinates next to replaced widgets were returned incorrectly, causing the cursor to be drawn in the wrong place.
+
+Update the `crosshairCursor` state on every mousemove event.
+
+Avoid an issue in the way that the editor enforces cursor associativity that could cause the cursor to get stuck on single-character wrapped lines.
+
 ## 6.4.0 (2022-10-18)
 
 ### Bug fixes

package/dist/index.cjs

@@ -875,7 +875,7 @@ class WidgetView extends ContentView {
             if (pos > 0 ? i == 0 : i == rects.length - 1 || rect.top < rect.bottom)
                 break;
         }
-        return flattenRect(rect, this.side > 0);
+        return this.length ? rect : flattenRect(rect, this.side > 0);
     }
     get isEditable() { return false; }
     destroy() {
@@ -1766,6 +1766,9 @@ const inputHandler = state.Facet.define();
 const perLineTextDirection = state.Facet.define({
     combine: values => values.some(x => x)
 });
+const nativeSelectionHidden = state.Facet.define({
+    combine: values => values.some(x => x)
+});
 class ScrollTarget {
     constructor(range, y = "nearest", x = "nearest", yMargin = 5, xMargin = 5) {
         this.range = range;
@@ -2679,8 +2682,9 @@ class DocView extends ContentView {
     enforceCursorAssoc() {
         if (this.compositionDeco.size)
             return;
-        let cursor = this.view.state.selection.main;
-        let sel = getSelection(this.view.root);
+        let { view } = this, cursor = view.state.selection.main;
+        let sel = getSelection(view.root);
+        let { anchorNode, anchorOffset } = view.observer.selectionRange;
         if (!sel || !cursor.empty || !cursor.assoc || !sel.modify)
             return;
         let line = LineView.find(this, cursor.head);
@@ -2695,6 +2699,12 @@ class DocView extends ContentView {
         let dom = this.domAtPos(cursor.head + cursor.assoc);
         sel.collapse(dom.node, dom.offset);
         sel.modify("move", cursor.assoc < 0 ? "forward" : "backward", "lineboundary");
+        // This can go wrong in corner cases like single-character lines,
+        // so check and reset if necessary.
+        view.observer.readSelectionRange();
+        let newRange = view.observer.selectionRange;
+        if (view.docView.posFromDOM(newRange.anchorNode, newRange.anchorOffset) != cursor.from)
+            sel.collapse(anchorNode, anchorOffset);
     }
     mayControlSelection() {
         let active = this.view.root.activeElement;
@@ -4779,7 +4789,7 @@ class ViewState {
         // Flag set when editor content was redrawn, so that the next
         // measure stage knows it must read DOM layout
         this.mustMeasureContent = true;
-        this.defaultTextDirection = exports.Direction.RTL;
+        this.defaultTextDirection = exports.Direction.LTR;
         this.visibleRanges = [];
         // Cursor 'assoc' is only significant when the cursor is on a line
         // wrap point, where it must stick to the character that it is
@@ -4844,7 +4854,8 @@ class ViewState {
         if (scrollTarget)
             this.scrollTarget = scrollTarget;
         if (!this.mustEnforceCursorAssoc && update.selectionSet && update.view.lineWrapping &&
-            update.state.selection.main.empty && update.state.selection.main.assoc)
+            update.state.selection.main.empty && update.state.selection.main.assoc &&
+            !update.state.facet(nativeSelectionHidden))
             this.mustEnforceCursorAssoc = true;
     }
     measure(view) {
@@ -4907,7 +4918,7 @@ class ViewState {
             oracle.heightChanged = false;
             for (let vp of this.viewports) {
                 let heights = vp.from == this.viewport.from ? lineHeights : view.docView.measureVisibleLineHeights(vp);
-                this.heightMap = this.heightMap.updateHeight(oracle, 0, refresh, new MeasuredHeights(vp.from, heights));
+                this.heightMap = (refresh ? HeightMap.empty().applyChanges(this.stateDeco, state.Text.empty, this.heightOracle, [new ChangedRange(0, 0, 0, view.state.doc.length)]) : this.heightMap).updateHeight(oracle, 0, refresh, new MeasuredHeights(vp.from, heights));
             }
             if (oracle.heightChanged)
                 result |= 2 /* UpdateFlag.Height */;
@@ -5473,7 +5484,8 @@ class DOMChange {
         this.bounds = null;
         this.text = "";
         let { impreciseHead: iHead, impreciseAnchor: iAnchor } = view.docView;
-        if (start > -1 && !view.state.readOnly && (this.bounds = view.docView.domBoundsAround(start, end, 0))) {
+        if (view.state.readOnly && start > -1) ;
+        else if (start > -1 && (this.bounds = view.docView.domBoundsAround(start, end, 0))) {
             let selPoints = iHead || iAnchor ? [] : selectionPoints(view);
             let reader = new DOMReader(selPoints, view.state);
             reader.readRange(this.bounds.startDOM, this.bounds.endDOM);
@@ -5767,7 +5779,8 @@ class DOMObserver {
         this.onScroll = this.onScroll.bind(this);
         if (typeof ResizeObserver == "function") {
             this.resize = new ResizeObserver(() => {
-                if (this.view.docView.lastUpdate < Date.now() - 75)
+                var _a;
+                if (((_a = this.view.docView) === null || _a === void 0 ? void 0 : _a.lastUpdate) < Date.now() - 75)
                     this.onResize();
             });
             this.resize.observe(view.scrollDOM);
@@ -7311,7 +7324,8 @@ function drawSelection(config = {}) {
     return [
         selectionConfig.of(config),
         drawSelectionPlugin,
-        hideNativeSelection
+        hideNativeSelection,
+        nativeSelectionHidden.of(true)
     ];
 }
 class Piece {
@@ -8096,6 +8110,9 @@ function crosshairCursor(options = {}) {
             keyup(e) {
                 if (e.keyCode == code || !getter(e))
                     this.set(false);
+            },
+            mousemove(e) {
+                this.set(getter(e));
             }
         }
     });
@@ -8552,10 +8569,10 @@ class HoverPlugin {
             }
         }
     }
-    mouseleave() {
+    mouseleave(e) {
         clearTimeout(this.hoverTimeout);
         this.hoverTimeout = -1;
-        if (this.active)
+        if (this.active && !isInTooltip(e.relatedTarget))
             this.view.dispatch({ effects: this.setHover.of(null) });
     }
     destroy() {

package/dist/index.js

@@ -1,4 +1,4 @@
-import { Text, RangeSet, MapMode, RangeValue, Facet, StateEffect, ChangeSet, findClusterBreak, EditorSelection, EditorState, findColumn, CharCategory, Prec, Transaction, codePointAt, codePointSize, combineConfig, StateField, RangeSetBuilder, countColumn } from '@codemirror/state';
+import { Text, RangeSet, MapMode, RangeValue, Facet, StateEffect, ChangeSet, findClusterBreak, EditorSelection, EditorState, findColumn, CharCategory, Transaction, Prec, codePointAt, codePointSize, combineConfig, StateField, RangeSetBuilder, countColumn } from '@codemirror/state';
 import { StyleModule } from 'style-mod';
 import { keyName, base, shift } from 'w3c-keyname';
 
@@ -871,7 +871,7 @@ class WidgetView extends ContentView {
             if (pos > 0 ? i == 0 : i == rects.length - 1 || rect.top < rect.bottom)
                 break;
         }
-        return flattenRect(rect, this.side > 0);
+        return this.length ? rect : flattenRect(rect, this.side > 0);
     }
     get isEditable() { return false; }
     destroy() {
@@ -1761,6 +1761,9 @@ const inputHandler = /*@__PURE__*/Facet.define();
 const perLineTextDirection = /*@__PURE__*/Facet.define({
     combine: values => values.some(x => x)
 });
+const nativeSelectionHidden = /*@__PURE__*/Facet.define({
+    combine: values => values.some(x => x)
+});
 class ScrollTarget {
     constructor(range, y = "nearest", x = "nearest", yMargin = 5, xMargin = 5) {
         this.range = range;
@@ -2673,8 +2676,9 @@ class DocView extends ContentView {
     enforceCursorAssoc() {
         if (this.compositionDeco.size)
             return;
-        let cursor = this.view.state.selection.main;
-        let sel = getSelection(this.view.root);
+        let { view } = this, cursor = view.state.selection.main;
+        let sel = getSelection(view.root);
+        let { anchorNode, anchorOffset } = view.observer.selectionRange;
         if (!sel || !cursor.empty || !cursor.assoc || !sel.modify)
             return;
         let line = LineView.find(this, cursor.head);
@@ -2689,6 +2693,12 @@ class DocView extends ContentView {
         let dom = this.domAtPos(cursor.head + cursor.assoc);
         sel.collapse(dom.node, dom.offset);
         sel.modify("move", cursor.assoc < 0 ? "forward" : "backward", "lineboundary");
+        // This can go wrong in corner cases like single-character lines,
+        // so check and reset if necessary.
+        view.observer.readSelectionRange();
+        let newRange = view.observer.selectionRange;
+        if (view.docView.posFromDOM(newRange.anchorNode, newRange.anchorOffset) != cursor.from)
+            sel.collapse(anchorNode, anchorOffset);
     }
     mayControlSelection() {
         let active = this.view.root.activeElement;
@@ -4772,7 +4782,7 @@ class ViewState {
         // Flag set when editor content was redrawn, so that the next
         // measure stage knows it must read DOM layout
         this.mustMeasureContent = true;
-        this.defaultTextDirection = Direction.RTL;
+        this.defaultTextDirection = Direction.LTR;
         this.visibleRanges = [];
         // Cursor 'assoc' is only significant when the cursor is on a line
         // wrap point, where it must stick to the character that it is
@@ -4837,7 +4847,8 @@ class ViewState {
         if (scrollTarget)
             this.scrollTarget = scrollTarget;
         if (!this.mustEnforceCursorAssoc && update.selectionSet && update.view.lineWrapping &&
-            update.state.selection.main.empty && update.state.selection.main.assoc)
+            update.state.selection.main.empty && update.state.selection.main.assoc &&
+            !update.state.facet(nativeSelectionHidden))
             this.mustEnforceCursorAssoc = true;
     }
     measure(view) {
@@ -4900,7 +4911,7 @@ class ViewState {
             oracle.heightChanged = false;
             for (let vp of this.viewports) {
                 let heights = vp.from == this.viewport.from ? lineHeights : view.docView.measureVisibleLineHeights(vp);
-                this.heightMap = this.heightMap.updateHeight(oracle, 0, refresh, new MeasuredHeights(vp.from, heights));
+                this.heightMap = (refresh ? HeightMap.empty().applyChanges(this.stateDeco, Text.empty, this.heightOracle, [new ChangedRange(0, 0, 0, view.state.doc.length)]) : this.heightMap).updateHeight(oracle, 0, refresh, new MeasuredHeights(vp.from, heights));
             }
             if (oracle.heightChanged)
                 result |= 2 /* UpdateFlag.Height */;
@@ -5466,7 +5477,8 @@ class DOMChange {
         this.bounds = null;
         this.text = "";
         let { impreciseHead: iHead, impreciseAnchor: iAnchor } = view.docView;
-        if (start > -1 && !view.state.readOnly && (this.bounds = view.docView.domBoundsAround(start, end, 0))) {
+        if (view.state.readOnly && start > -1) ;
+        else if (start > -1 && (this.bounds = view.docView.domBoundsAround(start, end, 0))) {
             let selPoints = iHead || iAnchor ? [] : selectionPoints(view);
             let reader = new DOMReader(selPoints, view.state);
             reader.readRange(this.bounds.startDOM, this.bounds.endDOM);
@@ -5760,7 +5772,8 @@ class DOMObserver {
         this.onScroll = this.onScroll.bind(this);
         if (typeof ResizeObserver == "function") {
             this.resize = new ResizeObserver(() => {
-                if (this.view.docView.lastUpdate < Date.now() - 75)
+                var _a;
+                if (((_a = this.view.docView) === null || _a === void 0 ? void 0 : _a.lastUpdate) < Date.now() - 75)
                     this.onResize();
             });
             this.resize.observe(view.scrollDOM);
@@ -7304,7 +7317,8 @@ function drawSelection(config = {}) {
     return [
         selectionConfig.of(config),
         drawSelectionPlugin,
-        hideNativeSelection
+        hideNativeSelection,
+        nativeSelectionHidden.of(true)
     ];
 }
 class Piece {
@@ -8089,6 +8103,9 @@ function crosshairCursor(options = {}) {
             keyup(e) {
                 if (e.keyCode == code || !getter(e))
                     this.set(false);
+            },
+            mousemove(e) {
+                this.set(getter(e));
             }
         }
     });
@@ -8545,10 +8562,10 @@ class HoverPlugin {
             }
         }
     }
-    mouseleave() {
+    mouseleave(e) {
         clearTimeout(this.hoverTimeout);
         this.hoverTimeout = -1;
-        if (this.active)
+        if (this.active && !isInTooltip(e.relatedTarget))
             this.view.dispatch({ effects: this.setHover.of(null) });
     }
     destroy() {

package/package.json

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