@codemirror/view 6.3.1 → 6.4.0

package/CHANGELOG.md

@@ -1,3 +1,21 @@
+## 6.4.0 (2022-10-18)
+
+### Bug fixes
+
+Avoid an issue where `scrollPastEnd` makes a single-line editor have a vertical scrollbar.
+
+Work around a Chrome bug where it inserts a newline when you press space at the start of a wrapped line.
+
+Align `rectangularSelection`'s behavior with other popular editors by making it create cursors at the end of lines that are too short to touch the rectangle.
+
+Fix an issue where coordinates on mark decoration boundaries were sometimes taken from the wrong side of the position.
+
+Prevent scrolling artifacts caused by attempts to scroll stuff into view when the editor isn't being displayed.
+
+### New features
+
+`TooltipView` objects can now provide a `destroy` method to be called when the tooltip is removed.
+
 ## 6.3.1 (2022-10-10)
 
 ### Bug fixes

package/dist/index.cjs

@@ -1054,57 +1054,31 @@ function joinInlineInto(parent, view, open) {
     parent.length += view.length;
 }
 function coordsInChildren(view, pos, side) {
-    if (!view.children.length)
-        return fallbackRect(view);
-    return (side <= 0 ? coordsInChildrenBefore : coordsInChildrenAfter)(view, pos);
-}
-function coordsInChildrenBefore(view, pos) {
-    // Find the last leaf in the tree that touches pos and doesn't have getSide() > 0
-    let found = null, foundPos = -1;
+    let before = null, beforePos = -1, after = null, afterPos = -1;
     function scan(view, pos) {
         for (let i = 0, off = 0; i < view.children.length && off <= pos; i++) {
             let child = view.children[i], end = off + child.length;
             if (end >= pos) {
                 if (child.children.length) {
-                    if (scan(child, pos - off))
-                        return true;
+                    scan(child, pos - off);
                 }
-                else if (end >= pos) {
-                    if (end == pos && child.getSide() > 0)
-                        return true;
-                    found = child;
-                    foundPos = pos - off;
+                else if (!after && (end > pos || off == end && child.getSide() > 0)) {
+                    after = child;
+                    afterPos = pos - off;
                 }
-            }
-            off = end;
-        }
-    }
-    scan(view, pos);
-    return found ? found.coordsAt(Math.max(0, foundPos), -1) : coordsInChildrenAfter(view, pos);
-}
-function coordsInChildrenAfter(view, pos) {
-    // Find the first leaf in the tree that touches pos and doesn't have getSide() < 0
-    let found = null, foundPos = -1;
-    function scan(view, pos) {
-        for (let i = view.children.length - 1, off = view.length; i >= 0 && off >= pos; i--) {
-            let child = view.children[i];
-            off -= child.length;
-            if (off <= pos) {
-                if (child.children.length) {
-                    if (scan(child, pos - off))
-                        return true;
-                }
-                else if (off <= pos) {
-                    if (off == pos && child.getSide() < 0)
-                        return true;
-                    found = child;
-                    foundPos = pos - off;
+                else if (off < pos || (off == end && child.getSide() < 0)) {
+                    before = child;
+                    beforePos = pos - off;
                 }
             }
+            off = end;
         }
     }
     scan(view, pos);
-    return found ? found.coordsAt(Math.max(0, foundPos), 1) : coordsInChildrenBefore(view, pos);
+    let target = (side < 0 ? before : after) || before || after;
+    if (target)
+        return target.coordsAt(Math.max(0, target == before ? beforePos : afterPos), side);
+    return fallbackRect(view);
 }
 function fallbackRect(view) {
     let last = view.dom.lastChild;
@@ -5572,6 +5546,15 @@ function applyDOMChange(view, domChange) {
             newSel = state.EditorSelection.single(newSel.main.anchor - 1, newSel.main.head - 1);
         change = { from: sel.from, to: sel.to, insert: state.Text.of([" "]) };
     }
+    else if (browser.chrome && change && change.from == change.to && change.from == sel.head &&
+        change.insert.toString() == "\n " && view.lineWrapping) {
+        // In Chrome, if you insert a space at the start of a wrapped
+        // line, it will actually insert a newline and a space, causing a
+        // bogus new line to be created in CodeMirror (#968)
+        if (newSel)
+            newSel = state.EditorSelection.single(newSel.main.anchor - 1, newSel.main.head - 1);
+        change = { from: sel.from, to: sel.to, insert: state.Text.of([" "]) };
+    }
     if (change) {
         let startState = view.state;
         if (browser.ios && view.inputState.flushIOSKey(view))
@@ -6496,17 +6479,19 @@ class EditorView {
                             logException(this.state, e);
                         }
                     }
-                if (this.viewState.scrollTarget) {
-                    this.docView.scrollIntoView(this.viewState.scrollTarget);
-                    this.viewState.scrollTarget = null;
-                    scrolled = true;
-                }
-                else {
-                    let diff = this.viewState.lineBlockAt(refBlock.from).top - refBlock.top;
-                    if (diff > 1 || diff < -1) {
-                        this.scrollDOM.scrollTop += diff;
+                if (this.viewState.editorHeight) {
+                    if (this.viewState.scrollTarget) {
+                        this.docView.scrollIntoView(this.viewState.scrollTarget);
+                        this.viewState.scrollTarget = null;
                         scrolled = true;
                     }
+                    else {
+                        let diff = this.viewState.lineBlockAt(refBlock.from).top - refBlock.top;
+                        if (diff > 1 || diff < -1) {
+                            this.scrollDOM.scrollTop += diff;
+                            scrolled = true;
+                        }
+                    }
                 }
                 if (redrawn)
                     this.docView.updateSelection(true);
@@ -7912,7 +7897,8 @@ const plugin = ViewPlugin.fromClass(class {
         this.attrs = { style: "padding-bottom: 1000px" };
     }
     update(update) {
-        let height = update.view.viewState.editorHeight - update.view.defaultLineHeight;
+        let { view } = update;
+        let height = view.viewState.editorHeight - view.defaultLineHeight - view.documentPadding.top - 0.5;
         if (height != this.height) {
             this.height = height;
             this.attrs = { style: `padding-bottom: ${height}px` };
@@ -8014,7 +8000,10 @@ function rectangleFor(state$1, a, b) {
         for (let i = startLine; i <= endLine; i++) {
             let line = state$1.doc.line(i);
             let start = state.findColumn(line.text, startCol, state$1.tabSize, true);
-            if (start > -1) {
+            if (start < 0) {
+                ranges.push(state.EditorSelection.cursor(line.to));
+            }
+            else {
                 let end = state.findColumn(line.text, endCol, state$1.tabSize);
                 ranges.push(state.EditorSelection.range(line.from + start, line.from + end));
             }
@@ -8126,6 +8115,7 @@ class TooltipViewManager {
         this.tooltipViews = this.tooltips.map(createTooltipView);
     }
     update(update) {
+        var _a;
         let input = update.state.facet(this.facet);
         let tooltips = input.filter(x => x);
         if (input === this.input) {
@@ -8154,8 +8144,10 @@ class TooltipViewManager {
             }
         }
         for (let t of this.tooltipViews)
-            if (tooltipViews.indexOf(t) < 0)
+            if (tooltipViews.indexOf(t) < 0) {
                 t.dom.remove();
+                (_a = t.destroy) === null || _a === void 0 ? void 0 : _a.call(t);
+            }
         this.input = input;
         this.tooltips = tooltips;
         this.tooltipViews = tooltipViews;
@@ -8274,11 +8266,13 @@ const tooltipPlugin = ViewPlugin.fromClass(class {
         return tooltipView;
     }
     destroy() {
-        var _a;
+        var _a, _b;
         this.view.win.removeEventListener("resize", this.measureSoon);
-        for (let { dom } of this.manager.tooltipViews)
-            dom.remove();
-        (_a = this.intersectionObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+        for (let tooltipView of this.manager.tooltipViews) {
+            tooltipView.dom.remove();
+            (_a = tooltipView.destroy) === null || _a === void 0 ? void 0 : _a.call(tooltipView);
+        }
+        (_b = this.intersectionObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
         clearTimeout(this.measureTimeout);
     }
     readMeasure() {

package/dist/index.d.ts

@@ -1579,6 +1579,11 @@ interface TooltipView {
     */
     update?(update: ViewUpdate): void;
     /**
+    Called when the tooltip is removed from the editor or the editor
+    is destroyed.
+    */
+    destroy?(): void;
+    /**
     Called when the tooltip has been (re)positioned.
     */
     positioned?(): void;

package/dist/index.js

@@ -1050,57 +1050,31 @@ function joinInlineInto(parent, view, open) {
     parent.length += view.length;
 }
 function coordsInChildren(view, pos, side) {
-    if (!view.children.length)
-        return fallbackRect(view);
-    return (side <= 0 ? coordsInChildrenBefore : coordsInChildrenAfter)(view, pos);
-}
-function coordsInChildrenBefore(view, pos) {
-    // Find the last leaf in the tree that touches pos and doesn't have getSide() > 0
-    let found = null, foundPos = -1;
+    let before = null, beforePos = -1, after = null, afterPos = -1;
     function scan(view, pos) {
         for (let i = 0, off = 0; i < view.children.length && off <= pos; i++) {
             let child = view.children[i], end = off + child.length;
             if (end >= pos) {
                 if (child.children.length) {
-                    if (scan(child, pos - off))
-                        return true;
+                    scan(child, pos - off);
                 }
-                else if (end >= pos) {
-                    if (end == pos && child.getSide() > 0)
-                        return true;
-                    found = child;
-                    foundPos = pos - off;
+                else if (!after && (end > pos || off == end && child.getSide() > 0)) {
+                    after = child;
+                    afterPos = pos - off;
                 }
-            }
-            off = end;
-        }
-    }
-    scan(view, pos);
-    return found ? found.coordsAt(Math.max(0, foundPos), -1) : coordsInChildrenAfter(view, pos);
-}
-function coordsInChildrenAfter(view, pos) {
-    // Find the first leaf in the tree that touches pos and doesn't have getSide() < 0
-    let found = null, foundPos = -1;
-    function scan(view, pos) {
-        for (let i = view.children.length - 1, off = view.length; i >= 0 && off >= pos; i--) {
-            let child = view.children[i];
-            off -= child.length;
-            if (off <= pos) {
-                if (child.children.length) {
-                    if (scan(child, pos - off))
-                        return true;
-                }
-                else if (off <= pos) {
-                    if (off == pos && child.getSide() < 0)
-                        return true;
-                    found = child;
-                    foundPos = pos - off;
+                else if (off < pos || (off == end && child.getSide() < 0)) {
+                    before = child;
+                    beforePos = pos - off;
                 }
             }
+            off = end;
         }
     }
     scan(view, pos);
-    return found ? found.coordsAt(Math.max(0, foundPos), 1) : coordsInChildrenBefore(view, pos);
+    let target = (side < 0 ? before : after) || before || after;
+    if (target)
+        return target.coordsAt(Math.max(0, target == before ? beforePos : afterPos), side);
+    return fallbackRect(view);
 }
 function fallbackRect(view) {
     let last = view.dom.lastChild;
@@ -5565,6 +5539,15 @@ function applyDOMChange(view, domChange) {
             newSel = EditorSelection.single(newSel.main.anchor - 1, newSel.main.head - 1);
         change = { from: sel.from, to: sel.to, insert: Text.of([" "]) };
     }
+    else if (browser.chrome && change && change.from == change.to && change.from == sel.head &&
+        change.insert.toString() == "\n " && view.lineWrapping) {
+        // In Chrome, if you insert a space at the start of a wrapped
+        // line, it will actually insert a newline and a space, causing a
+        // bogus new line to be created in CodeMirror (#968)
+        if (newSel)
+            newSel = EditorSelection.single(newSel.main.anchor - 1, newSel.main.head - 1);
+        change = { from: sel.from, to: sel.to, insert: Text.of([" "]) };
+    }
     if (change) {
         let startState = view.state;
         if (browser.ios && view.inputState.flushIOSKey(view))
@@ -6489,17 +6472,19 @@ class EditorView {
                             logException(this.state, e);
                         }
                     }
-                if (this.viewState.scrollTarget) {
-                    this.docView.scrollIntoView(this.viewState.scrollTarget);
-                    this.viewState.scrollTarget = null;
-                    scrolled = true;
-                }
-                else {
-                    let diff = this.viewState.lineBlockAt(refBlock.from).top - refBlock.top;
-                    if (diff > 1 || diff < -1) {
-                        this.scrollDOM.scrollTop += diff;
+                if (this.viewState.editorHeight) {
+                    if (this.viewState.scrollTarget) {
+                        this.docView.scrollIntoView(this.viewState.scrollTarget);
+                        this.viewState.scrollTarget = null;
                         scrolled = true;
                     }
+                    else {
+                        let diff = this.viewState.lineBlockAt(refBlock.from).top - refBlock.top;
+                        if (diff > 1 || diff < -1) {
+                            this.scrollDOM.scrollTop += diff;
+                            scrolled = true;
+                        }
+                    }
                 }
                 if (redrawn)
                     this.docView.updateSelection(true);
@@ -7905,7 +7890,8 @@ const plugin = /*@__PURE__*/ViewPlugin.fromClass(class {
         this.attrs = { style: "padding-bottom: 1000px" };
     }
     update(update) {
-        let height = update.view.viewState.editorHeight - update.view.defaultLineHeight;
+        let { view } = update;
+        let height = view.viewState.editorHeight - view.defaultLineHeight - view.documentPadding.top - 0.5;
         if (height != this.height) {
             this.height = height;
             this.attrs = { style: `padding-bottom: ${height}px` };
@@ -8007,7 +7993,10 @@ function rectangleFor(state, a, b) {
         for (let i = startLine; i <= endLine; i++) {
             let line = state.doc.line(i);
             let start = findColumn(line.text, startCol, state.tabSize, true);
-            if (start > -1) {
+            if (start < 0) {
+                ranges.push(EditorSelection.cursor(line.to));
+            }
+            else {
                 let end = findColumn(line.text, endCol, state.tabSize);
                 ranges.push(EditorSelection.range(line.from + start, line.from + end));
             }
@@ -8119,6 +8108,7 @@ class TooltipViewManager {
         this.tooltipViews = this.tooltips.map(createTooltipView);
     }
     update(update) {
+        var _a;
         let input = update.state.facet(this.facet);
         let tooltips = input.filter(x => x);
         if (input === this.input) {
@@ -8147,8 +8137,10 @@ class TooltipViewManager {
             }
         }
         for (let t of this.tooltipViews)
-            if (tooltipViews.indexOf(t) < 0)
+            if (tooltipViews.indexOf(t) < 0) {
                 t.dom.remove();
+                (_a = t.destroy) === null || _a === void 0 ? void 0 : _a.call(t);
+            }
         this.input = input;
         this.tooltips = tooltips;
         this.tooltipViews = tooltipViews;
@@ -8267,11 +8259,13 @@ const tooltipPlugin = /*@__PURE__*/ViewPlugin.fromClass(class {
         return tooltipView;
     }
     destroy() {
-        var _a;
+        var _a, _b;
         this.view.win.removeEventListener("resize", this.measureSoon);
-        for (let { dom } of this.manager.tooltipViews)
-            dom.remove();
-        (_a = this.intersectionObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+        for (let tooltipView of this.manager.tooltipViews) {
+            tooltipView.dom.remove();
+            (_a = tooltipView.destroy) === null || _a === void 0 ? void 0 : _a.call(tooltipView);
+        }
+        (_b = this.intersectionObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
         clearTimeout(this.measureTimeout);
     }
     readMeasure() {

package/package.json

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