@codemirror/view 0.19.24 → 0.19.25

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## 0.19.25 (2021-12-02)
+
+### Bug fixes
+
+Widgets around replaced ranges are now visible when their side does not point towards the replaced range.
+
+A replaced line with a line decoration no longer creates an extra empty line block in the editor.
+
+The `scrollPastEnd` extension will now over-reserve space at the bottom of the editor on startup, to prevent restored scroll positions from being clipped.
+
+### New features
+
+`EditorView.editorAttributes` and `contentAttributes` may now hold functions that produce the attributes.
+
 ## 0.19.24 (2021-12-01)
 
 ### Bug fixes

package/dist/index.cjs

@@ -1086,8 +1086,9 @@ class Decoration extends rangeset.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
@@ -1096,8 +1097,8 @@ class Decoration extends rangeset.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);
     }
     /**
@@ -1127,7 +1128,7 @@ Decoration.none = rangeset.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;
@@ -1148,7 +1149,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);
@@ -1727,36 +1728,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;
@@ -1772,20 +1776,12 @@ class PluginInstance {
             }
         }
     }
+    deactivate() {
+        this.spec = this.value = null;
+    }
 }
-PluginInstance.dummy = new PluginInstance(ViewPlugin.define(() => ({})));
-function combineFacetAttrs(values) {
-    let result = {};
-    for (let i = values.length - 1; i >= 0; i--)
-        combineAttrs(values[i], result);
-    return result;
-}
-const editorAttributes = state.Facet.define({
-    combine: combineFacetAttrs
-});
-const contentAttributes = state.Facet.define({
-    combine: combineFacetAttrs
-});
+const editorAttributes = state.Facet.define();
+const contentAttributes = state.Facet.define();
 // Provide decorations
 const decorations = state.Facet.define();
 const styleModule = state.Facet.define();
@@ -1933,12 +1929,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;
@@ -2008,7 +2004,7 @@ 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;
@@ -2931,7 +2927,7 @@ function posAtCoords(view, { x, y }, precise, bias = -1) {
     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);
@@ -5065,7 +5061,7 @@ const baseTheme = buildTheme("." + baseThemeID, {
         color: "inherit",
         fontSize: "70%",
         padding: ".2em 1em",
-        borderRadius: "3px"
+        borderRadius: "1px"
     },
     "&light .cm-button": {
         backgroundImage: "linear-gradient(#eff1f5, #d9d9df)",
@@ -5387,6 +5383,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);
     }
@@ -5683,6 +5680,7 @@ class EditorView {
     */
     config = {}) {
         this.plugins = [];
+        this.pluginMap = new Map;
         this.editorAttrs = {};
         this.contentAttrs = {};
         this.bidiCache = [];
@@ -5852,6 +5850,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();
@@ -5882,6 +5881,7 @@ class EditorView {
                 if (plugin.mustUpdate != update)
                     plugin.destroy(this);
             this.plugins = newPlugins;
+            this.pluginMap.clear();
             this.inputState.ensureHandlers(this);
         }
         else {
@@ -5889,7 +5889,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
@@ -5978,7 +5978,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 = {
@@ -5994,7 +5994,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);
@@ -6063,10 +6063,10 @@ 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
@@ -6553,6 +6553,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) {
@@ -7205,35 +7213,29 @@ class TabWidget extends WidgetType {
 }
 
 const plugin = 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; })];
 }
 
 /**

package/dist/index.d.ts

@@ -431,6 +431,7 @@ interface MeasureRequest<T> {
     */
     key?: any;
 }
+declare type AttrSource = Attrs | ((view: EditorView) => Attrs | null);
 /**
 View [plugins](https://codemirror.net/6/docs/ref/#view.ViewPlugin) are given instances of this
 class, which describe what happened, whenever the view is updated.
@@ -694,6 +695,7 @@ declare class EditorView {
     readonly contentDOM: HTMLElement;
     private announceDOM;
     private plugins;
+    private pluginMap;
     private editorAttrs;
     private contentAttrs;
     private styleModules;
@@ -1008,7 +1010,7 @@ declare class EditorView {
     mounted in its [document
     root](https://codemirror.net/6/docs/ref/#view.EditorView.constructor^config.root).
     */
-    static styleModule: _codemirror_state.Facet<StyleModule, readonly StyleModule[]>;
+    static styleModule: Facet<StyleModule, readonly StyleModule[]>;
     /**
     Facet that can be used to add DOM event handlers. The value
     should be an object mapping event names to handler functions. The
@@ -1029,7 +1031,7 @@ declare class EditorView {
     content. When one returns true, no further input handlers are
     called and the default behavior is prevented.
     */
-    static inputHandler: _codemirror_state.Facet<(view: EditorView, from: number, to: number, text: string) => boolean, readonly ((view: EditorView, from: number, to: number, text: string) => boolean)[]>;
+    static inputHandler: Facet<(view: EditorView, from: number, to: number, text: string) => boolean, readonly ((view: EditorView, from: number, to: number, text: string) => boolean)[]>;
     /**
     Allows you to provide a function that should be called when the
     library catches an exception from an extension (mostly from view
@@ -1037,12 +1039,12 @@ declare class EditorView {
     from user-code-provided callbacks). This is mostly useful for
     debugging and logging. See [`logException`](https://codemirror.net/6/docs/ref/#view.logException).
     */
-    static exceptionSink: _codemirror_state.Facet<(exception: any) => void, readonly ((exception: any) => void)[]>;
+    static exceptionSink: Facet<(exception: any) => void, readonly ((exception: any) => void)[]>;
     /**
     A facet that can be used to register a function to be called
     every time the view updates.
     */
-    static updateListener: _codemirror_state.Facet<(update: ViewUpdate) => void, readonly ((update: ViewUpdate) => void)[]>;
+    static updateListener: Facet<(update: ViewUpdate) => void, readonly ((update: ViewUpdate) => void)[]>;
     /**
     Facet that controls whether the editor content DOM is editable.
     When its highest-precedence value is `false`, the element will
@@ -1051,33 +1053,33 @@ declare class EditorView {
     even when those are bound to keys or buttons. See the
     [`readOnly`](https://codemirror.net/6/docs/ref/#state.EditorState.readOnly) facet for that.)
     */
-    static editable: _codemirror_state.Facet<boolean, boolean>;
+    static editable: Facet<boolean, boolean>;
     /**
     Allows you to influence the way mouse selection happens. The
     functions in this facet will be called for a `mousedown` event
     on the editor, and can return an object that overrides the way a
     selection is computed from that mouse click or drag.
     */
-    static mouseSelectionStyle: _codemirror_state.Facet<MakeSelectionStyle, readonly MakeSelectionStyle[]>;
+    static mouseSelectionStyle: Facet<MakeSelectionStyle, readonly MakeSelectionStyle[]>;
     /**
     Facet used to configure whether a given selection drag event
     should move or copy the selection. The given predicate will be
     called with the `mousedown` event, and can return `true` when
     the drag should move the content.
     */
-    static dragMovesSelection: _codemirror_state.Facet<(event: MouseEvent) => boolean, readonly ((event: MouseEvent) => boolean)[]>;
+    static dragMovesSelection: Facet<(event: MouseEvent) => boolean, readonly ((event: MouseEvent) => boolean)[]>;
     /**
     Facet used to configure whether a given selecting click adds
     a new range to the existing selection or replaces it entirely.
     */
-    static clickAddsSelectionRange: _codemirror_state.Facet<(event: MouseEvent) => boolean, readonly ((event: MouseEvent) => boolean)[]>;
+    static clickAddsSelectionRange: Facet<(event: MouseEvent) => boolean, readonly ((event: MouseEvent) => boolean)[]>;
     /**
     A facet that determines which [decorations](https://codemirror.net/6/docs/ref/#view.Decoration)
     are shown in the view. See also [view
     plugins](https://codemirror.net/6/docs/ref/#view.EditorView^decorations), which have a separate
     mechanism for providing decorations.
     */
-    static decorations: _codemirror_state.Facet<DecorationSet, readonly DecorationSet[]>;
+    static decorations: Facet<DecorationSet, readonly DecorationSet[]>;
     /**
     Create a theme extension. The first argument can be a
     [`style-mod`](https://github.com/marijnh/style-mod#documentation)
@@ -1115,12 +1117,12 @@ declare class EditorView {
     Facet that provides additional DOM attributes for the editor's
     editable DOM element.
     */
-    static contentAttributes: _codemirror_state.Facet<Attrs, Attrs>;
+    static contentAttributes: Facet<AttrSource, readonly AttrSource[]>;
     /**
     Facet that provides DOM attributes for the editor's outer
     element.
     */
-    static editorAttributes: _codemirror_state.Facet<Attrs, Attrs>;
+    static editorAttributes: Facet<AttrSource, readonly AttrSource[]>;
     /**
     An extension that enables line wrapping in the editor (by
     setting CSS `white-space` to `pre-wrap` in the content).
@@ -1318,10 +1320,10 @@ Configuration options.
 config?: SpecialCharConfig): Extension;
 
 /**
-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.

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();
@@ -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;
@@ -2004,7 +2000,7 @@ 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;
@@ -2926,7 +2922,7 @@ function posAtCoords(view, { x, y }, precise, bias = -1) {
     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);
@@ -5059,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)",
@@ -5381,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);
     }
@@ -5677,6 +5674,7 @@ class EditorView {
     */
     config = {}) {
         this.plugins = [];
+        this.pluginMap = new Map;
         this.editorAttrs = {};
         this.contentAttrs = {};
         this.bidiCache = [];
@@ -5846,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();
@@ -5876,6 +5875,7 @@ class EditorView {
                 if (plugin.mustUpdate != update)
                     plugin.destroy(this);
             this.plugins = newPlugins;
+            this.pluginMap.clear();
             this.inputState.ensureHandlers(this);
         }
         else {
@@ -5883,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
@@ -5972,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 = {
@@ -5988,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);
@@ -6057,10 +6057,10 @@ 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
@@ -6547,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) {
@@ -7199,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; })];
 }
 
 /**

package/package.json

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