@codemirror/view 0.19.21 → 0.19.25

package/dist/index.js

@@ -1082,8 +1082,9 @@ class Decoration extends RangeValue {
     position.
     */
     static widget(spec) {
-        let side = spec.side || 0;
-        return new PointDecoration(spec, side, side, !!spec.block, spec.widget || null, false);
+        let side = spec.side || 0, block = !!spec.block;
+        side += block ? (side > 0 ? 300000000 /* BlockAfter */ : -400000000 /* BlockBefore */) : (side > 0 ? 100000000 /* InlineAfter */ : -100000000 /* InlineBefore */);
+        return new PointDecoration(spec, side, side, block, spec.widget || null, false);
     }
     /**
     Create a replace decoration which replaces the given range with
@@ -1092,8 +1093,8 @@ class Decoration extends RangeValue {
     static replace(spec) {
         let block = !!spec.block;
         let { start, end } = getInclusive(spec, block);
-        let startSide = 100000000 /* Big */ * (start ? -1 : 1) * (block ? 2 : 1);
-        let endSide = 100000000 /* Big */ * (end ? 1 : -1) * (block ? 2 : 1);
+        let startSide = block ? (start ? -300000000 /* BlockIncStart */ : -1 /* InlineIncStart */) : 400000000 /* NonIncStart */;
+        let endSide = block ? (end ? 200000000 /* BlockIncEnd */ : 1 /* InlineIncEnd */) : -500000000 /* NonIncEnd */;
         return new PointDecoration(spec, startSide, endSide, block, spec.widget || null, true);
     }
     /**
@@ -1123,7 +1124,7 @@ Decoration.none = RangeSet.empty;
 class MarkDecoration extends Decoration {
     constructor(spec) {
         let { start, end } = getInclusive(spec);
-        super(100000000 /* Big */ * (start ? -1 : 1), 100000000 /* Big */ * (end ? 1 : -1), null, spec);
+        super(start ? -1 /* InlineIncStart */ : 400000000 /* NonIncStart */, end ? 1 /* InlineIncEnd */ : -500000000 /* NonIncEnd */, null, spec);
         this.tagName = spec.tagName || "span";
         this.class = spec.class || "";
         this.attrs = spec.attributes || null;
@@ -1144,7 +1145,7 @@ class MarkDecoration extends Decoration {
 MarkDecoration.prototype.point = false;
 class LineDecoration extends Decoration {
     constructor(spec) {
-        super(-100000000 /* Big */, -100000000 /* Big */, null, spec);
+        super(-200000000 /* Line */, -200000000 /* Line */, null, spec);
     }
     eq(other) {
         return other instanceof LineDecoration && attrsEq(this.spec.attributes, other.spec.attributes);
@@ -1723,36 +1724,39 @@ class PluginInstance {
         this.value = null;
     }
     takeField(type, target) {
-        for (let { field, get } of this.spec.fields)
-            if (field == type)
-                target.push(get(this.value));
+        if (this.spec)
+            for (let { field, get } of this.spec.fields)
+                if (field == type)
+                    target.push(get(this.value));
     }
     update(view) {
         if (!this.value) {
-            try {
-                this.value = this.spec.create(view);
-            }
-            catch (e) {
-                logException(view.state, e, "CodeMirror plugin crashed");
-                return PluginInstance.dummy;
+            if (this.spec) {
+                try {
+                    this.value = this.spec.create(view);
+                }
+                catch (e) {
+                    logException(view.state, e, "CodeMirror plugin crashed");
+                    this.deactivate();
+                }
             }
         }
         else if (this.mustUpdate) {
             let update = this.mustUpdate;
             this.mustUpdate = null;
-            if (!this.value.update)
-                return this;
-            try {
-                this.value.update(update);
-            }
-            catch (e) {
-                logException(update.state, e, "CodeMirror plugin crashed");
-                if (this.value.destroy)
-                    try {
-                        this.value.destroy();
-                    }
-                    catch (_) { }
-                return PluginInstance.dummy;
+            if (this.value.update) {
+                try {
+                    this.value.update(update);
+                }
+                catch (e) {
+                    logException(update.state, e, "CodeMirror plugin crashed");
+                    if (this.value.destroy)
+                        try {
+                            this.value.destroy();
+                        }
+                        catch (_) { }
+                    this.deactivate();
+                }
             }
         }
         return this;
@@ -1768,20 +1772,12 @@ class PluginInstance {
             }
         }
     }
+    deactivate() {
+        this.spec = this.value = null;
+    }
 }
-PluginInstance.dummy = /*@__PURE__*/new PluginInstance(/*@__PURE__*/ViewPlugin.define(() => ({})));
-function combineFacetAttrs(values) {
-    let result = {};
-    for (let i = values.length - 1; i >= 0; i--)
-        combineAttrs(values[i], result);
-    return result;
-}
-const editorAttributes = /*@__PURE__*/Facet.define({
-    combine: combineFacetAttrs
-});
-const contentAttributes = /*@__PURE__*/Facet.define({
-    combine: combineFacetAttrs
-});
+const editorAttributes = /*@__PURE__*/Facet.define();
+const contentAttributes = /*@__PURE__*/Facet.define();
 // Provide decorations
 const decorations = /*@__PURE__*/Facet.define();
 const styleModule = /*@__PURE__*/Facet.define();
@@ -1908,7 +1904,7 @@ class ViewUpdate {
     Whether the document changed in this update.
     */
     get docChanged() {
-        return this.transactions.some(tr => tr.docChanged);
+        return !this.changes.empty;
     }
     /**
     Whether the selection was explicitly set in this update.
@@ -1929,12 +1925,12 @@ class DocView extends ContentView {
         this.compositionDeco = Decoration.none;
         this.decorations = [];
         // Track a minimum width for the editor. When measuring sizes in
-        // checkLayout, this is updated to point at the width of a given
-        // element and its extent in the document. When a change happens in
-        // that range, these are reset. That way, once we've seen a
-        // line/element of a given length, we keep the editor wide enough to
-        // fit at least that element, until it is changed, at which point we
-        // forget it again.
+        // measureVisibleLineHeights, this is updated to point at the width
+        // of a given element and its extent in the document. When a change
+        // happens in that range, these are reset. That way, once we've seen
+        // a line/element of a given length, we keep the editor wide enough
+        // to fit at least that element, until it is changed, at which point
+        // we forget it again.
         this.minWidth = 0;
         this.minWidthFrom = 0;
         this.minWidthTo = 0;
@@ -1984,10 +1980,7 @@ class DocView extends ContentView {
         let prevDeco = this.decorations, deco = this.updateDeco();
         let decoDiff = findChangedDeco(prevDeco, deco, update.changes);
         changedRanges = ChangedRange.extendWithRanges(changedRanges, decoDiff);
-        if (this.dirty == 0 /* Not */ && changedRanges.length == 0 &&
-            !(update.flags & 4 /* Viewport */) &&
-            update.state.selection.main.from >= this.view.viewport.from &&
-            update.state.selection.main.to <= this.view.viewport.to) {
+        if (this.dirty == 0 /* Not */ && changedRanges.length == 0) {
             return false;
         }
         else {
@@ -2007,9 +2000,10 @@ class DocView extends ContentView {
             this.updateSelection();
         }
     }
-    // Used both by update and checkLayout do perform the actual DOM
+    // Used by update and the constructor do perform the actual DOM
     // update
     updateInner(changes, deco, oldLength) {
+        this.view.viewState.mustMeasureContent = true;
         this.updateChildren(changes, deco, oldLength);
         let { observer } = this.view;
         observer.ignore(() => {
@@ -2017,7 +2011,7 @@ class DocView extends ContentView {
             // messes with the scroll position during DOM mutation (though
             // no relayout is triggered and I cannot imagine how it can
             // recompute the scroll position without a layout)
-            this.dom.style.height = this.view.viewState.domHeight + "px";
+            this.dom.style.height = this.view.viewState.contentHeight + "px";
             this.dom.style.minWidth = this.minWidth ? this.minWidth + "px" : "";
             // Chrome will sometimes, when DOM mutations occur directly
             // around the selection, get confused and report a different
@@ -2302,7 +2296,7 @@ class DocView extends ContentView {
             let next = i == vs.viewports.length ? null : vs.viewports[i];
             let end = next ? next.from - 1 : this.length;
             if (end > pos) {
-                let height = vs.lineAt(end, 0).bottom - vs.lineAt(pos, 0).top;
+                let height = vs.lineBlockAt(end).bottom - vs.lineBlockAt(pos).top;
                 deco.push(Decoration.replace({ widget: new BlockGapWidget(height), block: true, inclusive: true }).range(pos, end));
             }
             if (!next)
@@ -2908,13 +2902,14 @@ function domPosInText(node, x, y) {
 }
 function posAtCoords(view, { x, y }, precise, bias = -1) {
     var _a;
-    let content = view.contentDOM.getBoundingClientRect(), block;
+    let content = view.contentDOM.getBoundingClientRect(), docTop = content.top + view.viewState.paddingTop;
     let halfLine = view.defaultLineHeight / 2;
+    let block, yOffset = y - docTop;
     for (let bounced = false;;) {
-        block = view.blockAtHeight(y, content.top);
-        if (block.top > y || block.bottom < y) {
-            bias = block.top > y ? -1 : 1;
-            y = Math.min(block.bottom - halfLine, Math.max(block.top + halfLine, y));
+        block = view.elementAtHeight(yOffset);
+        if (block.top > yOffset || block.bottom < yOffset) {
+            bias = block.top > yOffset ? -1 : 1;
+            yOffset = Math.min(block.bottom - halfLine, Math.max(block.top + halfLine, yOffset));
             if (bounced)
                 return precise ? null : 0;
             else
@@ -2922,11 +2917,12 @@ function posAtCoords(view, { x, y }, precise, bias = -1) {
         }
         if (block.type == BlockType.Text)
             break;
-        y = bias > 0 ? block.bottom + halfLine : block.top - halfLine;
+        yOffset = bias > 0 ? block.bottom + halfLine : block.top - halfLine;
     }
+    y = docTop + yOffset;
     let lineStart = block.from;
     // Clip x to the viewport sides
-    x = Math.max(content.left + 1, Math.min(content.right - 1, x));
+    x = Math.max(content.left + 1, Math.min(Math.max(content.right, content.left + view.docView.minWidth) - 1, x));
     // If this is outside of the rendered viewport, we can't determine a position
     if (lineStart < view.viewport.from)
         return view.viewport.from == 0 ? 0 : posAtCoordsImprecise(view, content, block, x, y);
@@ -3036,17 +3032,17 @@ function moveVertically(view, start, forward, distance) {
         return EditorSelection.cursor(startPos);
     let goal = start.goalColumn, startY;
     let rect = view.contentDOM.getBoundingClientRect();
-    let startCoords = view.coordsAtPos(startPos);
+    let startCoords = view.coordsAtPos(startPos), docTop = view.documentTop;
     if (startCoords) {
         if (goal == null)
             goal = startCoords.left - rect.left;
         startY = dir < 0 ? startCoords.top : startCoords.bottom;
     }
     else {
-        let line = view.viewState.lineAt(startPos, view.dom.getBoundingClientRect().top);
+        let line = view.viewState.lineBlockAt(startPos - docTop);
         if (goal == null)
             goal = Math.min(rect.right - rect.left, view.defaultCharacterWidth * (startPos - line.from));
-        startY = dir < 0 ? line.top : line.bottom;
+        startY = (dir < 0 ? line.top : line.bottom) + docTop;
     }
     let resolvedGoal = rect.left + goal;
     let dist = distance !== null && distance !== void 0 ? distance : (view.defaultLineHeight >> 1);
@@ -3297,7 +3293,7 @@ class MouseSelection {
         this.extend = startEvent.shiftKey;
         this.multiple = view.state.facet(EditorState.allowMultipleSelections) && addsSelectionRange(view, startEvent);
         this.dragMove = dragMovesSelection(view, startEvent);
-        this.dragging = isInPrimarySelection(view, startEvent) ? null : false;
+        this.dragging = isInPrimarySelection(view, startEvent) && getClickType(startEvent) == 1 ? null : false;
         // When clicking outside of the selection, immediately apply the
         // effect of starting the selection
         if (this.dragging === false) {
@@ -3518,7 +3514,7 @@ function basicMouseSelection(view, event) {
     let last = start, lastEvent = event;
     return {
         update(update) {
-            if (update.changes) {
+            if (update.docChanged) {
                 if (start)
                     start.pos = update.changes.mapPos(start.pos);
                 startSel = startSel.map(update.changes);
@@ -3782,7 +3778,10 @@ class HeightOracle {
         return lines * this.lineHeight;
     }
     setDoc(doc) { this.doc = doc; return this; }
-    mustRefresh(lineHeights, whiteSpace, direction) {
+    mustRefreshForStyle(whiteSpace, direction) {
+        return (wrappingWhiteSpace.indexOf(whiteSpace) > -1) != this.lineWrapping || this.direction != direction;
+    }
+    mustRefreshForHeights(lineHeights) {
         let newHeight = false;
         for (let i = 0; i < lineHeights.length; i++) {
             let h = lineHeights[i];
@@ -3794,7 +3793,7 @@ class HeightOracle {
                 this.heightSamples[Math.floor(h * 10)] = true;
             }
         }
-        return newHeight || (wrappingWhiteSpace.indexOf(whiteSpace) > -1) != this.lineWrapping || this.direction != direction;
+        return newHeight;
     }
     refresh(whiteSpace, direction, lineHeight, charWidth, lineLength, knownHeights) {
         let lineWrapping = wrappingWhiteSpace.indexOf(whiteSpace) > -1;
@@ -3848,7 +3847,8 @@ class BlockInfo {
     */
     length, 
     /**
-    The top position of the element.
+    The top position of the element (relative to the top of the
+    document).
     */
     top, 
     /**
@@ -3882,13 +3882,19 @@ class BlockInfo {
             .concat(Array.isArray(other.type) ? other.type : [other]);
         return new BlockInfo(this.from, this.length + other.length, this.top, this.height + other.height, detail);
     }
+    /**
+    FIXME remove on next breaking release @internal
+    */
+    moveY(offset) {
+        return !offset ? this : new BlockInfo(this.from, this.length, this.top + offset, this.height, Array.isArray(this.type) ? this.type.map(b => b.moveY(offset)) : this.type);
+    }
 }
 var QueryType = /*@__PURE__*/(function (QueryType) {
     QueryType[QueryType["ByPos"] = 0] = "ByPos";
     QueryType[QueryType["ByHeight"] = 1] = "ByHeight";
     QueryType[QueryType["ByPosNoHeight"] = 2] = "ByPosNoHeight";
 return QueryType})(QueryType || (QueryType = {}));
-const Epsilon = 1e-4;
+const Epsilon = 1e-3;
 class HeightMap {
     constructor(length, // The number of characters covered
     height, // Height of this part of the document
@@ -4115,22 +4121,30 @@ class HeightMapGap extends HeightMap {
             // can't be widgets or collapsed ranges in those lines, because
             // they would already have been added to the heightmap (gaps
             // only contain plain text).
-            let nodes = [], pos = Math.max(offset, measured.from);
+            let nodes = [], pos = Math.max(offset, measured.from), singleHeight = -1;
+            let wasChanged = oracle.heightChanged;
             if (measured.from > offset)
                 nodes.push(new HeightMapGap(measured.from - offset - 1).updateHeight(oracle, offset));
             while (pos <= end && measured.more) {
                 let len = oracle.doc.lineAt(pos).length;
                 if (nodes.length)
                     nodes.push(null);
-                let line = new HeightMapText(len, measured.heights[measured.index++]);
+                let height = measured.heights[measured.index++];
+                if (singleHeight == -1)
+                    singleHeight = height;
+                else if (Math.abs(height - singleHeight) >= Epsilon)
+                    singleHeight = -2;
+                let line = new HeightMapText(len, height);
                 line.outdated = false;
                 nodes.push(line);
                 pos += len + 1;
             }
             if (pos <= end)
                 nodes.push(null, new HeightMapGap(end - pos).updateHeight(oracle, pos));
-            oracle.heightChanged = true;
-            return HeightMap.of(nodes);
+            let result = HeightMap.of(nodes);
+            oracle.heightChanged = wasChanged || singleHeight < 0 || Math.abs(result.height - this.height) >= Epsilon ||
+                Math.abs(singleHeight - this.lines(oracle.doc, offset).lineHeight) >= Epsilon;
+            return result;
         }
         else if (force || this.outdated) {
             this.setHeight(oracle, oracle.heightForGap(offset, offset + this.length));
@@ -4488,7 +4502,8 @@ class ViewState {
         this.inView = true;
         this.paddingTop = 0;
         this.paddingBottom = 0;
-        this.contentWidth = 0;
+        this.contentDOMWidth = 0;
+        this.contentDOMHeight = 0;
         this.editorHeight = 0;
         this.heightOracle = new HeightOracle;
         // See VP.MaxDOMHeight
@@ -4496,6 +4511,9 @@ class ViewState {
         this.scrollTarget = null;
         // Briefly set to true when printing, to disable viewport limiting
         this.printing = false;
+        // Flag set when editor content was redrawn, so that the next
+        // measure stage knows it must read DOM layout
+        this.mustMeasureContent = true;
         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
@@ -4508,6 +4526,7 @@ class ViewState {
         this.mustEnforceCursorAssoc = false;
         this.heightMap = HeightMap.empty().applyChanges(state.facet(decorations), Text.empty, this.heightOracle.setDoc(state.doc), [new ChangedRange(0, 0, 0, state.doc.length)]);
         this.viewport = this.getViewport(0, null);
+        this.updateViewportLines();
         this.updateForViewport();
         this.lineGaps = this.ensureLineGaps([]);
         this.lineGapDeco = Decoration.set(this.lineGaps.map(gap => gap.draw(false)));
@@ -4518,7 +4537,7 @@ class ViewState {
         for (let i = 0; i <= 1; i++) {
             let pos = i ? main.head : main.anchor;
             if (!viewports.some(({ from, to }) => pos >= from && pos <= to)) {
-                let { from, to } = this.lineAt(pos, 0);
+                let { from, to } = this.lineBlockAt(pos);
                 viewports.push(new Viewport(from, to));
             }
         }
@@ -4526,6 +4545,12 @@ class ViewState {
         this.scaler = this.heightMap.height <= 7000000 /* MaxDOMHeight */ ? IdScaler :
             new BigScaler(this.heightOracle.doc, this.heightMap, this.viewports);
     }
+    updateViewportLines() {
+        this.viewportLines = [];
+        this.heightMap.forEachLine(this.viewport.from, this.viewport.to, this.state.doc, 0, 0, block => {
+            this.viewportLines.push(this.scaler.scale == 1 ? block : scaleBlock(block, this.scaler));
+        });
+    }
     update(update, scrollTarget = null) {
         let prev = this.state;
         this.state = update.state;
@@ -4540,7 +4565,11 @@ class ViewState {
         if (scrollTarget && (scrollTarget.range.head < viewport.from || scrollTarget.range.head > viewport.to) ||
             !this.viewportIsAppropriate(viewport))
             viewport = this.getViewport(0, scrollTarget);
+        let updateLines = !update.changes.empty || (update.flags & 2 /* Height */) ||
+            viewport.from != this.viewport.from || viewport.to != this.viewport.to;
         this.viewport = viewport;
+        if (updateLines)
+            this.updateViewportLines();
         this.updateForViewport();
         if (this.lineGaps.length || this.viewport.to - this.viewport.from > 4000 /* DoubleMargin */)
             this.updateLineGaps(this.ensureLineGaps(this.mapLineGaps(this.lineGaps, update.changes)));
@@ -4551,13 +4580,17 @@ class ViewState {
             update.state.selection.main.empty && update.state.selection.main.assoc)
             this.mustEnforceCursorAssoc = true;
     }
-    measure(docView, repeated) {
-        let dom = docView.dom, whiteSpace = "", direction = Direction.LTR;
-        let result = 0;
-        if (!repeated) {
+    measure(view) {
+        let dom = view.contentDOM, style = window.getComputedStyle(dom);
+        let oracle = this.heightOracle;
+        let whiteSpace = style.whiteSpace, direction = style.direction == "rtl" ? Direction.RTL : Direction.LTR;
+        let refresh = this.heightOracle.mustRefreshForStyle(whiteSpace, direction);
+        let measureContent = refresh || this.mustMeasureContent || this.contentDOMHeight != dom.clientHeight;
+        let result = 0, bias = 0;
+        if (measureContent) {
+            this.mustMeasureContent = false;
+            this.contentDOMHeight = dom.clientHeight;
             // Vertical padding
-            let style = window.getComputedStyle(dom);
-            whiteSpace = style.whiteSpace, direction = (style.direction == "rtl" ? Direction.RTL : Direction.LTR);
             let paddingTop = parseInt(style.paddingTop) || 0, paddingBottom = parseInt(style.paddingBottom) || 0;
             if (this.paddingTop != paddingTop || this.paddingBottom != paddingBottom) {
                 result |= 8 /* Geometry */;
@@ -4572,39 +4605,42 @@ class ViewState {
         this.inView = this.pixelViewport.bottom > this.pixelViewport.top && this.pixelViewport.right > this.pixelViewport.left;
         if (!this.inView)
             return 0;
-        let lineHeights = docView.measureVisibleLineHeights();
-        let refresh = false, bias = 0, oracle = this.heightOracle;
-        if (!repeated) {
-            let contentWidth = docView.dom.clientWidth;
-            if (oracle.mustRefresh(lineHeights, whiteSpace, direction) ||
-                oracle.lineWrapping && Math.abs(contentWidth - this.contentWidth) > oracle.charWidth) {
-                let { lineHeight, charWidth } = docView.measureTextSize();
+        if (measureContent) {
+            let lineHeights = view.docView.measureVisibleLineHeights();
+            if (oracle.mustRefreshForHeights(lineHeights))
+                refresh = true;
+            let contentWidth = dom.clientWidth;
+            if (refresh || oracle.lineWrapping && Math.abs(contentWidth - this.contentDOMWidth) > oracle.charWidth) {
+                let { lineHeight, charWidth } = view.docView.measureTextSize();
                 refresh = oracle.refresh(whiteSpace, direction, lineHeight, charWidth, contentWidth / charWidth, lineHeights);
                 if (refresh) {
-                    docView.minWidth = 0;
+                    view.docView.minWidth = 0;
                     result |= 8 /* Geometry */;
                 }
             }
-            if (this.contentWidth != contentWidth) {
-                this.contentWidth = contentWidth;
+            if (this.contentDOMWidth != contentWidth) {
+                this.contentDOMWidth = contentWidth;
                 result |= 8 /* Geometry */;
             }
-            if (this.editorHeight != docView.view.scrollDOM.clientHeight) {
-                this.editorHeight = docView.view.scrollDOM.clientHeight;
+            if (this.editorHeight != view.scrollDOM.clientHeight) {
+                this.editorHeight = view.scrollDOM.clientHeight;
                 result |= 8 /* Geometry */;
             }
             if (dTop > 0 && dBottom > 0)
                 bias = Math.max(dTop, dBottom);
             else if (dTop < 0 && dBottom < 0)
                 bias = Math.min(dTop, dBottom);
-        }
-        oracle.heightChanged = false;
-        this.heightMap = this.heightMap.updateHeight(oracle, 0, refresh, new MeasuredHeights(this.viewport.from, lineHeights));
-        if (oracle.heightChanged)
-            result |= 2 /* Height */;
-        if (!this.viewportIsAppropriate(this.viewport, bias) ||
-            this.scrollTarget && (this.scrollTarget.range.head < this.viewport.from || this.scrollTarget.range.head > this.viewport.to))
+            oracle.heightChanged = false;
+            this.heightMap = this.heightMap.updateHeight(oracle, 0, refresh, new MeasuredHeights(this.viewport.from, lineHeights));
+            if (oracle.heightChanged)
+                result |= 2 /* Height */;
+        }
+        let viewportChange = !this.viewportIsAppropriate(this.viewport, bias) ||
+            this.scrollTarget && (this.scrollTarget.range.head < this.viewport.from || this.scrollTarget.range.head > this.viewport.to);
+        if (viewportChange)
             this.viewport = this.getViewport(bias, this.scrollTarget);
+        if ((result & 2 /* Height */) || viewportChange)
+            this.updateViewportLines();
         this.updateForViewport();
         if (this.lineGaps.length || this.viewport.to - this.viewport.from > 4000 /* DoubleMargin */)
             this.updateLineGaps(this.ensureLineGaps(refresh ? [] : this.lineGaps));
@@ -4615,12 +4651,12 @@ class ViewState {
             // to a line end is going to trigger a layout anyway, so it
             // can't be a pure write. It should be rare that it does any
             // writing.
-            docView.enforceCursorAssoc();
+            view.docView.enforceCursorAssoc();
         }
         return result;
     }
-    get visibleTop() { return this.scaler.fromDOM(this.pixelViewport.top, 0); }
-    get visibleBottom() { return this.scaler.fromDOM(this.pixelViewport.bottom, 0); }
+    get visibleTop() { return this.scaler.fromDOM(this.pixelViewport.top); }
+    get visibleBottom() { return this.scaler.fromDOM(this.pixelViewport.bottom); }
     getViewport(bias, scrollTarget) {
         // This will divide VP.Margin between the top and the
         // bottom, depending on the bias (the change in viewport position
@@ -4680,12 +4716,12 @@ class ViewState {
         // This won't work at all in predominantly right-to-left text.
         if (this.heightOracle.direction != Direction.LTR)
             return gaps;
-        this.heightMap.forEachLine(this.viewport.from, this.viewport.to, this.state.doc, 0, 0, line => {
+        for (let line of this.viewportLines) {
             if (line.length < 4000 /* DoubleMargin */)
-                return;
+                continue;
             let structure = lineStructure(line.from, line.to, this.state);
             if (structure.total < 4000 /* DoubleMargin */)
-                return;
+                continue;
             let viewFrom, viewTo;
             if (this.heightOracle.lineWrapping) {
                 let marginHeight = (2000 /* Margin */ / this.heightOracle.lineLength) * this.heightOracle.lineHeight;
@@ -4715,7 +4751,7 @@ class ViewState {
                         Math.abs(gap.from - from) < 1000 /* HalfMargin */ && Math.abs(gap.to - to) < 1000 /* HalfMargin */) ||
                         new LineGap(from, to, this.gapSize(line, from, to, structure)));
                 }
-        });
+        }
         return gaps;
     }
     gapSize(line, from, to, structure) {
@@ -4747,27 +4783,18 @@ class ViewState {
         this.visibleRanges = ranges;
         return changed ? 4 /* Viewport */ : 0;
     }
-    lineAt(pos, editorTop) {
-        editorTop += this.paddingTop;
-        return scaleBlock(this.heightMap.lineAt(pos, QueryType.ByPos, this.state.doc, editorTop, 0), this.scaler, editorTop);
-    }
-    lineAtHeight(height, editorTop) {
-        editorTop += this.paddingTop;
-        return scaleBlock(this.heightMap.lineAt(this.scaler.fromDOM(height, editorTop), QueryType.ByHeight, this.state.doc, editorTop, 0), this.scaler, editorTop);
+    lineBlockAt(pos) {
+        return (pos >= this.viewport.from && pos <= this.viewport.to && this.viewportLines.find(b => b.from <= pos && b.to >= pos)) ||
+            scaleBlock(this.heightMap.lineAt(pos, QueryType.ByPos, this.state.doc, 0, 0), this.scaler);
     }
-    blockAtHeight(height, editorTop) {
-        editorTop += this.paddingTop;
-        return scaleBlock(this.heightMap.blockAt(this.scaler.fromDOM(height, editorTop), this.state.doc, editorTop, 0), this.scaler, editorTop);
+    lineBlockAtHeight(height) {
+        return scaleBlock(this.heightMap.lineAt(this.scaler.fromDOM(height), QueryType.ByHeight, this.state.doc, 0, 0), this.scaler);
     }
-    forEachLine(from, to, f, editorTop) {
-        editorTop += this.paddingTop;
-        return this.heightMap.forEachLine(from, to, this.state.doc, editorTop, 0, this.scaler.scale == 1 ? f : b => f(scaleBlock(b, this.scaler, editorTop)));
+    elementAtHeight(height) {
+        return scaleBlock(this.heightMap.blockAt(this.scaler.fromDOM(height), this.state.doc, 0, 0), this.scaler);
     }
     get contentHeight() {
-        return this.domHeight + this.paddingTop + this.paddingBottom;
-    }
-    get domHeight() {
-        return this.scaler.toDOM(this.heightMap.height, this.paddingTop);
+        return this.scaler.toDOM(this.heightMap.height) + this.paddingTop + this.paddingBottom;
     }
 }
 class Viewport {
@@ -4864,36 +4891,34 @@ class BigScaler {
             base = obj.bottom;
         }
     }
-    toDOM(n, top) {
-        n -= top;
+    toDOM(n) {
         for (let i = 0, base = 0, domBase = 0;; i++) {
             let vp = i < this.viewports.length ? this.viewports[i] : null;
             if (!vp || n < vp.top)
-                return domBase + (n - base) * this.scale + top;
+                return domBase + (n - base) * this.scale;
             if (n <= vp.bottom)
-                return vp.domTop + (n - vp.top) + top;
+                return vp.domTop + (n - vp.top);
             base = vp.bottom;
             domBase = vp.domBottom;
         }
     }
-    fromDOM(n, top) {
-        n -= top;
+    fromDOM(n) {
         for (let i = 0, base = 0, domBase = 0;; i++) {
             let vp = i < this.viewports.length ? this.viewports[i] : null;
             if (!vp || n < vp.domTop)
-                return base + (n - domBase) / this.scale + top;
+                return base + (n - domBase) / this.scale;
             if (n <= vp.domBottom)
-                return vp.top + (n - vp.domTop) + top;
+                return vp.top + (n - vp.domTop);
             base = vp.bottom;
             domBase = vp.domBottom;
         }
     }
 }
-function scaleBlock(block, scaler, top) {
+function scaleBlock(block, scaler) {
     if (scaler.scale == 1)
         return block;
-    let bTop = scaler.toDOM(block.top, top), bBottom = scaler.toDOM(block.bottom, top);
-    return new BlockInfo(block.from, block.length, bTop, bBottom - bTop, Array.isArray(block.type) ? block.type.map(b => scaleBlock(b, scaler, top)) : block.type);
+    let bTop = scaler.toDOM(block.top), bBottom = scaler.toDOM(block.bottom);
+    return new BlockInfo(block.from, block.length, bTop, bBottom - bTop, Array.isArray(block.type) ? block.type.map(b => scaleBlock(b, scaler)) : block.type);
 }
 
 const theme = /*@__PURE__*/Facet.define({ combine: strs => strs.join(" ") });
@@ -5030,7 +5055,7 @@ const baseTheme = /*@__PURE__*/buildTheme("." + baseThemeID, {
         color: "inherit",
         fontSize: "70%",
         padding: ".2em 1em",
-        borderRadius: "3px"
+        borderRadius: "1px"
     },
     "&light .cm-button": {
         backgroundImage: "linear-gradient(#eff1f5, #d9d9df)",
@@ -5352,6 +5377,7 @@ class DOMObserver {
         for (let dom of this.scrollTargets)
             dom.removeEventListener("scroll", this.onScroll);
         window.removeEventListener("scroll", this.onScroll);
+        this.dom.ownerDocument.removeEventListener("selectionchange", this.onSelectionChange);
         clearTimeout(this.parentCheck);
         clearTimeout(this.resizeTimeout);
     }
@@ -5648,6 +5674,7 @@ class EditorView {
     */
     config = {}) {
         this.plugins = [];
+        this.pluginMap = new Map;
         this.editorAttrs = {};
         this.contentAttrs = {};
         this.bidiCache = [];
@@ -5817,6 +5844,7 @@ class EditorView {
                 plugin.destroy(this);
             this.viewState = new ViewState(newState);
             this.plugins = newState.facet(viewPlugin).map(spec => new PluginInstance(spec).update(this));
+            this.pluginMap.clear();
             this.docView = new DocView(this);
             this.inputState.ensureHandlers(this);
             this.mountStyles();
@@ -5847,6 +5875,7 @@ class EditorView {
                 if (plugin.mustUpdate != update)
                     plugin.destroy(this);
             this.plugins = newPlugins;
+            this.pluginMap.clear();
             this.inputState.ensureHandlers(this);
         }
         else {
@@ -5854,7 +5883,7 @@ class EditorView {
                 p.mustUpdate = update;
         }
         for (let i = 0; i < this.plugins.length; i++)
-            this.plugins[i] = this.plugins[i].update(this);
+            this.plugins[i].update(this);
     }
     /**
     @internal
@@ -5872,11 +5901,11 @@ class EditorView {
             for (let i = 0;; i++) {
                 this.updateState = 1 /* Measuring */;
                 let oldViewport = this.viewport;
-                let changed = this.viewState.measure(this.docView, i > 0);
+                let changed = this.viewState.measure(this);
                 if (!changed && !this.measureRequests.length && this.viewState.scrollTarget == null)
                     break;
                 if (i > 5) {
-                    console.warn("Viewport failed to stabilize");
+                    console.warn(this.measureRequests.length ? "Measure loop restarted more than 5 times" : "Viewport failed to stabilize");
                     break;
                 }
                 let measuring = [];
@@ -5892,7 +5921,7 @@ class EditorView {
                         return BadMeasure;
                     }
                 });
-                let update = new ViewUpdate(this, this.state);
+                let update = new ViewUpdate(this, this.state), redrawn = false;
                 update.flags |= changed;
                 if (!updated)
                     updated = update;
@@ -5902,13 +5931,15 @@ class EditorView {
                 if (!update.empty) {
                     this.updatePlugins(update);
                     this.inputState.update(update);
+                    this.updateAttrs();
+                    redrawn = this.docView.update(update);
                 }
-                this.updateAttrs();
-                let redrawn = changed > 0 && this.docView.update(update);
                 for (let i = 0; i < measuring.length; i++)
                     if (measured[i] != BadMeasure) {
                         try {
-                            measuring[i].write(measured[i], this);
+                            let m = measuring[i];
+                            if (m.write)
+                                m.write(measured[i], this);
                         }
                         catch (e) {
                             logException(this.state, e);
@@ -5918,8 +5949,8 @@ class EditorView {
                     this.docView.scrollIntoView(this.viewState.scrollTarget);
                     this.viewState.scrollTarget = null;
                 }
-                if (changed)
-                    this.docView.updateSelection(redrawn);
+                if (redrawn)
+                    this.docView.updateSelection(true);
                 if (this.viewport.from == oldViewport.from && this.viewport.to == oldViewport.to && this.measureRequests.length == 0)
                     break;
             }
@@ -5941,7 +5972,7 @@ class EditorView {
             this.state.facet(theme);
     }
     updateAttrs() {
-        let editorAttrs = combineAttrs(this.state.facet(editorAttributes), {
+        let editorAttrs = attrsFromFacet(this, editorAttributes, {
             class: "cm-editor" + (this.hasFocus ? " cm-focused " : " ") + this.themeClasses
         });
         let contentAttrs = {
@@ -5957,7 +5988,7 @@ class EditorView {
         };
         if (this.state.readOnly)
             contentAttrs["aria-readonly"] = "true";
-        combineAttrs(this.state.facet(contentAttributes), contentAttrs);
+        attrsFromFacet(this, contentAttributes, contentAttrs);
         this.observer.ignore(() => {
             updateAttrs(this.contentDOM, this.contentAttrs, contentAttrs);
             updateAttrs(this.dom, this.editorAttrs, editorAttrs);
@@ -6026,10 +6057,24 @@ class EditorView {
     the return value of this method.
     */
     plugin(plugin) {
-        for (let inst of this.plugins)
-            if (inst.spec == plugin)
-                return inst.update(this).value;
-        return null;
+        let known = this.pluginMap.get(plugin);
+        if (known === undefined || known && known.spec != plugin)
+            this.pluginMap.set(plugin, known = this.plugins.find(p => p.spec == plugin) || null);
+        return known && known.update(this).value;
+    }
+    /**
+    The top position of the document, in screen coordinates. This
+    may be negative when the editor is scrolled down. Points
+    directly to the top of the first line, not above the padding.
+    */
+    get documentTop() {
+        return this.contentDOM.getBoundingClientRect().top + this.viewState.paddingTop;
+    }
+    /**
+    Reports the padding above and below the document.
+    */
+    get documentPadding() {
+        return { top: this.viewState.paddingTop, bottom: this.viewState.paddingBottom };
     }
     /**
     Find the line or block widget at the given vertical position.
@@ -6041,10 +6086,21 @@ class EditorView {
     position, or a precomputed document top
     (`view.contentDOM.getBoundingClientRect().top`) to limit layout
     queries.
+    
+    *Deprecated: use `blockAtHeight` instead.*
     */
     blockAtHeight(height, docTop) {
+        let top = ensureTop(docTop, this);
+        return this.elementAtHeight(height - top).moveY(top);
+    }
+    /**
+    Find the text line or block widget at the given vertical
+    position (which is interpreted as relative to the [top of the
+    document](https://codemirror.net/6/docs/ref/#view.EditorView.documentTop)
+    */
+    elementAtHeight(height) {
         this.readMeasured();
-        return this.viewState.blockAtHeight(height, ensureTop(docTop, this.contentDOM));
+        return this.viewState.elementAtHeight(height);
     }
     /**
     Find information for the visual line (see
@@ -6056,20 +6112,43 @@ class EditorView {
     Defaults to treating `height` as a screen position. See
     [`blockAtHeight`](https://codemirror.net/6/docs/ref/#view.EditorView.blockAtHeight) for the
     interpretation of the `docTop` parameter.
+    
+    *Deprecated: use `lineBlockAtHeight` instead.*
     */
     visualLineAtHeight(height, docTop) {
+        let top = ensureTop(docTop, this);
+        return this.lineBlockAtHeight(height - top).moveY(top);
+    }
+    /**
+    Find the line block (see
+    [`lineBlockAt`](https://codemirror.net/6/docs/ref/#view.EditorView.lineBlockAt) at the given
+    height.
+    */
+    lineBlockAtHeight(height) {
         this.readMeasured();
-        return this.viewState.lineAtHeight(height, ensureTop(docTop, this.contentDOM));
+        return this.viewState.lineBlockAtHeight(height);
     }
     /**
     Iterate over the height information of the visual lines in the
     viewport. The heights of lines are reported relative to the
     given document top, which defaults to the screen position of the
     document (forcing a layout).
+    
+    *Deprecated: use `viewportLineBlocks` instead.*
     */
     viewportLines(f, docTop) {
-        let { from, to } = this.viewport;
-        this.viewState.forEachLine(from, to, f, ensureTop(docTop, this.contentDOM));
+        let top = ensureTop(docTop, this);
+        for (let line of this.viewportLineBlocks)
+            f(line.moveY(top));
+    }
+    /**
+    Get the extent and vertical position of all [line
+    blocks](https://codemirror.net/6/docs/ref/#view.EditorView.lineBlockAt) in the viewport. Positions
+    are relative to the [top of the
+    document](https://codemirror.net/6/docs/ref/#view.EditorView.documentTop);
+    */
+    get viewportLineBlocks() {
+        return this.viewState.viewportLines;
     }
     /**
     Find the extent and height of the visual line (a range delimited
@@ -6080,9 +6159,22 @@ class EditorView {
     argument, which defaults to 0 for this method. You can pass
     `view.contentDOM.getBoundingClientRect().top` here to get screen
     coordinates.
+    
+    *Deprecated: use `lineBlockAt` instead.*
     */
     visualLineAt(pos, docTop = 0) {
-        return this.viewState.lineAt(pos, docTop);
+        return this.lineBlockAt(pos).moveY(docTop + this.viewState.paddingTop);
+    }
+    /**
+    Find the line block around the given document position. A line
+    block is a range delimited on both sides by either a
+    non-[hidden](https://codemirror.net/6/docs/ref/#view.Decoration^range) line breaks, or the
+    start/end of the document. It will usually just hold a line of
+    text, but may be broken into multiple textblocks by block
+    widgets.
+    */
+    lineBlockAt(pos) {
+        return this.viewState.lineBlockAt(pos);
     }
     /**
     The editor's total content height.
@@ -6415,8 +6507,9 @@ search match).
 EditorView.announce = /*@__PURE__*/StateEffect.define();
 // Maximum line length for which we compute accurate bidi info
 const MaxBidiLine = 4096;
-function ensureTop(given, dom) {
-    return given == null ? dom.getBoundingClientRect().top : given;
+// FIXME remove this and its callers on next breaking release
+function ensureTop(given, view) {
+    return (given == null ? view.contentDOM.getBoundingClientRect().top : given) + view.viewState.paddingTop;
 }
 let resizeDebounce = -1;
 function ensureGlobalHandler() {
@@ -6454,6 +6547,14 @@ class CachedOrder {
         return result;
     }
 }
+function attrsFromFacet(view, facet, base) {
+    for (let sources = view.state.facet(facet), i = sources.length - 1; i >= 0; i--) {
+        let source = sources[i], value = typeof source == "function" ? source(view) : source;
+        if (value)
+            combineAttrs(value, base);
+    }
+    return base;
+}
 
 const currentPlatform = browser.mac ? "mac" : browser.windows ? "win" : browser.linux ? "linux" : "key";
 function normalizeKeyName(name, platform) {
@@ -6767,7 +6868,7 @@ function wrappedLine(view, pos, inside) {
         type: BlockType.Text };
 }
 function blockAt(view, pos) {
-    let line = view.visualLineAt(pos);
+    let line = view.lineBlockAt(pos);
     if (Array.isArray(line.type))
         for (let l of line.type) {
             if (l.to > pos || l.to == pos && (l.to == line.to || l.type == BlockType.Text))
@@ -7106,35 +7207,29 @@ class TabWidget extends WidgetType {
 }
 
 const plugin = /*@__PURE__*/ViewPlugin.fromClass(class {
-    constructor(view) {
-        this.height = -1;
-        this.measure = {
-            read: view => Math.max(0, view.scrollDOM.clientHeight - view.defaultLineHeight),
-            write: (value, view) => {
-                if (Math.abs(value - this.height) > 1) {
-                    this.height = value;
-                    view.contentDOM.style.paddingBottom = value + "px";
-                }
-            }
-        };
-        view.requestMeasure(this.measure);
+    constructor() {
+        this.height = 1000;
+        this.attrs = { style: "padding-bottom: 1000px" };
     }
     update(update) {
-        if (update.geometryChanged)
-            update.view.requestMeasure(this.measure);
+        let height = update.view.viewState.editorHeight - update.view.defaultLineHeight;
+        if (height != this.height) {
+            this.height = height;
+            this.attrs = { style: `padding-bottom: ${height}px` };
+        }
     }
 });
 /**
-Returns a plugin that makes sure the content has a bottom margin
-equivalent to the height of the editor, minus one line height, so
-that every line in the document can be scrolled to the top of the
-editor.
+Returns an extension that makes sure the content has a bottom
+margin equivalent to the height of the editor, minus one line
+height, so that every line in the document can be scrolled to the
+top of the editor.
 
 This is only meaningful when the editor is scrollable, and should
 not be enabled in editors that take the size of their content.
 */
 function scrollPastEnd() {
-    return plugin;
+    return [plugin, contentAttributes.of(view => { var _a; return ((_a = view.plugin(plugin)) === null || _a === void 0 ? void 0 : _a.attrs) || null; })];
 }
 
 /**
@@ -7158,7 +7253,7 @@ const activeLineHighlighter = /*@__PURE__*/ViewPlugin.fromClass(class {
         for (let r of view.state.selection.ranges) {
             if (!r.empty)
                 return Decoration.none;
-            let line = view.visualLineAt(r.head);
+            let line = view.lineBlockAt(r.head);
             if (line.from > lastLineStart) {
                 deco.push(lineDeco.range(line.from));
                 lastLineStart = line.from;