@codemirror/view 6.7.1 → 6.7.3

package/CHANGELOG.md

@@ -1,3 +1,29 @@
+## 6.7.3 (2023-01-12)
+
+### Bug fixes
+
+Fix a bug in `posAtCoords` that could cause incorrect results for positions to the left of a wrapped line.
+
+## 6.7.2 (2023-01-04)
+
+### Bug fixes
+
+Fix a regression where the cursor didn't restart its blink cycle when moving it with the pointer.
+
+Even without a `key` property, measure request objects that are already scheduled will not be scheduled again by `requestMeasure`.
+
+Fix an issue where keymaps incorrectly interpreted key events that used Ctrl+Alt modifiers to simulate AltGr on Windows.
+
+Fix a bug where line decorations with a different `class` property would be treated as equal.
+
+Fix a bug that caused `drawSelection` to not notice when it was reconfigured.
+
+Fix a crash in the gutter extension caused by sharing of mutable arrays.
+
+Fix a regression that caused touch selection on mobile platforms to not work in an uneditable editor.
+
+Fix a bug where DOM events on the boundary between lines could get assigned to the wrong line.
+
 ## 6.7.1 (2022-12-12)
 
 ### Bug fixes

package/dist/index.cjs

@@ -1348,7 +1348,9 @@ class LineDecoration extends Decoration {
         super(-200000000 /* Side.Line */, -200000000 /* Side.Line */, null, spec);
     }
     eq(other) {
-        return other instanceof LineDecoration && attrsEq(this.spec.attributes, other.spec.attributes);
+        return other instanceof LineDecoration &&
+            this.spec.class == other.spec.class &&
+            attrsEq(this.spec.attributes, other.spec.attributes);
     }
     range(from, to = from) {
         if (to != from)
@@ -3100,7 +3102,8 @@ function domPosAtCoords(parent, x, y) {
                 closestRect = rect;
                 closestX = dx;
                 closestY = dy;
-                closestOverlap = !dx || (dx > 0 ? i < rects.length - 1 : i > 0);
+                let side = dy ? (y < rect.top ? -1 : 1) : dx ? (x < rect.left ? -1 : 1) : 0;
+                closestOverlap = !side || (side > 0 ? i < rects.length - 1 : i > 0);
             }
             if (dx == 0) {
                 if (y > rect.bottom && (!aboveRect || aboveRect.bottom < rect.bottom)) {
@@ -5325,7 +5328,7 @@ function buildTheme(main, spec, scopes) {
     });
 }
 const baseTheme$1 = buildTheme("." + baseThemeID, {
-    "&.cm-editor": {
+    "&": {
         position: "relative !important",
         boxSizing: "border-box",
         "&.cm-focused": {
@@ -5609,7 +5612,7 @@ function applyDOMChange(view, domChange) {
                 insert: state.Text.of(domChange.text.slice(diff.from, diff.toB).split(LineBreakPlaceholder)) };
         }
     }
-    else if (newSel && (!view.hasFocus || !view.state.facet(editable) || newSel.main.eq(sel))) {
+    else if (newSel && (!view.hasFocus && view.state.facet(editable) || newSel.main.eq(sel))) {
         newSel = null;
     }
     if (!change && !newSel)
@@ -6673,6 +6676,8 @@ class EditorView {
         if (this.measureScheduled < 0)
             this.measureScheduled = this.win.requestAnimationFrame(() => this.measure());
         if (request) {
+            if (this.measureRequests.indexOf(request) > -1)
+                return;
             if (request.key != null)
                 for (let i = 0; i < this.measureRequests.length; i++) {
                     if (this.measureRequests[i].key === request.key) {
@@ -7356,6 +7361,8 @@ function runHandlers(map, event, view, scope) {
         if (runFor(scopeObj[prefix + modifiers(name, event, !isChar)]))
             return true;
         if (isChar && (event.altKey || event.metaKey || event.ctrlKey) &&
+            // Ctrl-Alt may be used for AltGr on Windows
+            !(browser.windows && event.ctrlKey && event.altKey) &&
             (baseName = w3cKeyname.base[event.keyCode]) && baseName != name) {
             if (runFor(scopeObj[prefix + modifiers(baseName, event, true)]))
                 return true;
@@ -7650,7 +7657,7 @@ function drawSelection(config = {}) {
     ];
 }
 function configChanged(update) {
-    return update.startState.facet(selectionConfig) != update.startState.facet(selectionConfig);
+    return update.startState.facet(selectionConfig) != update.state.facet(selectionConfig);
 }
 const cursorLayer = layer({
     above: true,
@@ -7669,7 +7676,7 @@ const cursorLayer = layer({
         return cursors;
     },
     update(update, dom) {
-        if (update.transactions.some(tr => tr.scrollIntoView))
+        if (update.transactions.some(tr => tr.selection))
             dom.style.animationName = dom.style.animationName == "cm-blink" ? "cm-blink2" : "cm-blink";
         let confChange = configChanged(update);
         if (confChange)
@@ -9235,15 +9242,14 @@ class UpdateContext {
     constructor(gutter, viewport, height) {
         this.gutter = gutter;
         this.height = height;
-        this.localMarkers = [];
         this.i = 0;
         this.cursor = state.RangeSet.iter(gutter.markers, viewport.from);
     }
     line(view, line, extraMarkers) {
-        if (this.localMarkers.length)
-            this.localMarkers = [];
-        advanceCursor(this.cursor, this.localMarkers, line.from);
-        let localMarkers = extraMarkers.length ? this.localMarkers.concat(extraMarkers) : this.localMarkers;
+        let localMarkers = [];
+        advanceCursor(this.cursor, localMarkers, line.from);
+        if (extraMarkers.length)
+            localMarkers = localMarkers.concat(extraMarkers);
         let forLine = this.gutter.config.lineMarker(view, line, localMarkers);
         if (forLine)
             localMarkers.unshift(forLine);
@@ -9281,7 +9287,17 @@ class SingleGutterView {
         this.dom.className = "cm-gutter" + (this.config.class ? " " + this.config.class : "");
         for (let prop in config.domEventHandlers) {
             this.dom.addEventListener(prop, (event) => {
-                let line = view.lineBlockAtHeight(event.clientY - view.documentTop);
+                let target = event.target, y;
+                if (target != this.dom && this.dom.contains(target)) {
+                    while (target.parentNode != this.dom)
+                        target = target.parentNode;
+                    let rect = target.getBoundingClientRect();
+                    y = (rect.top + rect.bottom) / 2;
+                }
+                else {
+                    y = event.clientY;
+                }
+                let line = view.lineBlockAtHeight(y - view.documentTop);
                 if (config.domEventHandlers[prop](view, line, event))
                     event.preventDefault();
             });

package/dist/index.js

@@ -1343,7 +1343,9 @@ class LineDecoration extends Decoration {
         super(-200000000 /* Side.Line */, -200000000 /* Side.Line */, null, spec);
     }
     eq(other) {
-        return other instanceof LineDecoration && attrsEq(this.spec.attributes, other.spec.attributes);
+        return other instanceof LineDecoration &&
+            this.spec.class == other.spec.class &&
+            attrsEq(this.spec.attributes, other.spec.attributes);
     }
     range(from, to = from) {
         if (to != from)
@@ -3094,7 +3096,8 @@ function domPosAtCoords(parent, x, y) {
                 closestRect = rect;
                 closestX = dx;
                 closestY = dy;
-                closestOverlap = !dx || (dx > 0 ? i < rects.length - 1 : i > 0);
+                let side = dy ? (y < rect.top ? -1 : 1) : dx ? (x < rect.left ? -1 : 1) : 0;
+                closestOverlap = !side || (side > 0 ? i < rects.length - 1 : i > 0);
             }
             if (dx == 0) {
                 if (y > rect.bottom && (!aboveRect || aboveRect.bottom < rect.bottom)) {
@@ -5318,7 +5321,7 @@ function buildTheme(main, spec, scopes) {
     });
 }
 const baseTheme$1 = /*@__PURE__*/buildTheme("." + baseThemeID, {
-    "&.cm-editor": {
+    "&": {
         position: "relative !important",
         boxSizing: "border-box",
         "&.cm-focused": {
@@ -5602,7 +5605,7 @@ function applyDOMChange(view, domChange) {
                 insert: Text.of(domChange.text.slice(diff.from, diff.toB).split(LineBreakPlaceholder)) };
         }
     }
-    else if (newSel && (!view.hasFocus || !view.state.facet(editable) || newSel.main.eq(sel))) {
+    else if (newSel && (!view.hasFocus && view.state.facet(editable) || newSel.main.eq(sel))) {
         newSel = null;
     }
     if (!change && !newSel)
@@ -6666,6 +6669,8 @@ class EditorView {
         if (this.measureScheduled < 0)
             this.measureScheduled = this.win.requestAnimationFrame(() => this.measure());
         if (request) {
+            if (this.measureRequests.indexOf(request) > -1)
+                return;
             if (request.key != null)
                 for (let i = 0; i < this.measureRequests.length; i++) {
                     if (this.measureRequests[i].key === request.key) {
@@ -7349,6 +7354,8 @@ function runHandlers(map, event, view, scope) {
         if (runFor(scopeObj[prefix + modifiers(name, event, !isChar)]))
             return true;
         if (isChar && (event.altKey || event.metaKey || event.ctrlKey) &&
+            // Ctrl-Alt may be used for AltGr on Windows
+            !(browser.windows && event.ctrlKey && event.altKey) &&
             (baseName = base[event.keyCode]) && baseName != name) {
             if (runFor(scopeObj[prefix + modifiers(baseName, event, true)]))
                 return true;
@@ -7643,7 +7650,7 @@ function drawSelection(config = {}) {
     ];
 }
 function configChanged(update) {
-    return update.startState.facet(selectionConfig) != update.startState.facet(selectionConfig);
+    return update.startState.facet(selectionConfig) != update.state.facet(selectionConfig);
 }
 const cursorLayer = /*@__PURE__*/layer({
     above: true,
@@ -7662,7 +7669,7 @@ const cursorLayer = /*@__PURE__*/layer({
         return cursors;
     },
     update(update, dom) {
-        if (update.transactions.some(tr => tr.scrollIntoView))
+        if (update.transactions.some(tr => tr.selection))
             dom.style.animationName = dom.style.animationName == "cm-blink" ? "cm-blink2" : "cm-blink";
         let confChange = configChanged(update);
         if (confChange)
@@ -9228,15 +9235,14 @@ class UpdateContext {
     constructor(gutter, viewport, height) {
         this.gutter = gutter;
         this.height = height;
-        this.localMarkers = [];
         this.i = 0;
         this.cursor = RangeSet.iter(gutter.markers, viewport.from);
     }
     line(view, line, extraMarkers) {
-        if (this.localMarkers.length)
-            this.localMarkers = [];
-        advanceCursor(this.cursor, this.localMarkers, line.from);
-        let localMarkers = extraMarkers.length ? this.localMarkers.concat(extraMarkers) : this.localMarkers;
+        let localMarkers = [];
+        advanceCursor(this.cursor, localMarkers, line.from);
+        if (extraMarkers.length)
+            localMarkers = localMarkers.concat(extraMarkers);
         let forLine = this.gutter.config.lineMarker(view, line, localMarkers);
         if (forLine)
             localMarkers.unshift(forLine);
@@ -9274,7 +9280,17 @@ class SingleGutterView {
         this.dom.className = "cm-gutter" + (this.config.class ? " " + this.config.class : "");
         for (let prop in config.domEventHandlers) {
             this.dom.addEventListener(prop, (event) => {
-                let line = view.lineBlockAtHeight(event.clientY - view.documentTop);
+                let target = event.target, y;
+                if (target != this.dom && this.dom.contains(target)) {
+                    while (target.parentNode != this.dom)
+                        target = target.parentNode;
+                    let rect = target.getBoundingClientRect();
+                    y = (rect.top + rect.bottom) / 2;
+                }
+                else {
+                    y = event.clientY;
+                }
+                let line = view.lineBlockAtHeight(y - view.documentTop);
                 if (config.domEventHandlers[prop](view, line, event))
                     event.preventDefault();
             });

package/package.json

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