@codemirror/view 0.19.25 → 0.19.29

package/dist/index.js

@@ -270,7 +270,7 @@ class DOMPos {
     static before(dom, precise) { return new DOMPos(dom.parentNode, domIndex(dom), precise); }
     static after(dom, precise) { return new DOMPos(dom.parentNode, domIndex(dom) + 1, precise); }
 }
-const none$3 = [];
+const noChildren = [];
 class ContentView {
     constructor() {
         this.parent = null;
@@ -436,12 +436,12 @@ class ContentView {
             v = parent;
         }
     }
-    replaceChildren(from, to, children = none$3) {
+    replaceChildren(from, to, children = noChildren) {
         this.markDirty();
         for (let i = from; i < to; i++) {
             let child = this.children[i];
             if (child.parent == this)
-                child.parent = null;
+                child.destroy();
         }
         this.children.splice(from, to - from, ...children);
         for (let i = 0; i < children.length; i++)
@@ -463,6 +463,17 @@ class ContentView {
     }
     static get(node) { return node.cmView; }
     get isEditable() { return true; }
+    merge(from, to, source, hasStart, openStart, openEnd) {
+        return false;
+    }
+    become(other) { return false; }
+    // When this is a zero-length view with a side, this should return a
+    // number <= 0 to indicate it is before its position, or a
+    // number > 0 when after its position.
+    getSide() { return 0; }
+    destroy() {
+        this.parent = null;
+    }
 }
 ContentView.prototype.breakAfter = 0;
 // Remove a DOM node and return its next sibling.
@@ -490,6 +501,94 @@ class ChildCursor {
         }
     }
 }
+function replaceRange(parent, fromI, fromOff, toI, toOff, insert, breakAtStart, openStart, openEnd) {
+    let { children } = parent;
+    let before = children.length ? children[fromI] : null;
+    let last = insert.length ? insert[insert.length - 1] : null;
+    let breakAtEnd = last ? last.breakAfter : breakAtStart;
+    // Change within a single child
+    if (fromI == toI && before && !breakAtStart && !breakAtEnd && insert.length < 2 &&
+        before.merge(fromOff, toOff, insert.length ? last : null, fromOff == 0, openStart, openEnd))
+        return;
+    if (toI < children.length) {
+        let after = children[toI];
+        // Make sure the end of the child after the update is preserved in `after`
+        if (after && toOff < after.length) {
+            // If we're splitting a child, separate part of it to avoid that
+            // being mangled when updating the child before the update.
+            if (fromI == toI) {
+                after = after.split(toOff);
+                toOff = 0;
+            }
+            // If the element after the replacement should be merged with
+            // the last replacing element, update `content`
+            if (!breakAtEnd && last && after.merge(0, toOff, last, true, 0, openEnd)) {
+                insert[insert.length - 1] = after;
+            }
+            else {
+                // Remove the start of the after element, if necessary, and
+                // add it to `content`.
+                if (toOff)
+                    after.merge(0, toOff, null, false, 0, openEnd);
+                insert.push(after);
+            }
+        }
+        else if (after === null || after === void 0 ? void 0 : after.breakAfter) {
+            // The element at `toI` is entirely covered by this range.
+            // Preserve its line break, if any.
+            if (last)
+                last.breakAfter = 1;
+            else
+                breakAtStart = 1;
+        }
+        // Since we've handled the next element from the current elements
+        // now, make sure `toI` points after that.
+        toI++;
+    }
+    if (before) {
+        before.breakAfter = breakAtStart;
+        if (fromOff > 0) {
+            if (!breakAtStart && insert.length && before.merge(fromOff, before.length, insert[0], false, openStart, 0)) {
+                before.breakAfter = insert.shift().breakAfter;
+            }
+            else if (fromOff < before.length || before.children.length && before.children[before.children.length - 1].length == 0) {
+                before.merge(fromOff, before.length, null, false, openStart, 0);
+            }
+            fromI++;
+        }
+    }
+    // Try to merge widgets on the boundaries of the replacement
+    while (fromI < toI && insert.length) {
+        if (children[toI - 1].become(insert[insert.length - 1])) {
+            toI--;
+            insert.pop();
+            openEnd = insert.length ? 0 : openStart;
+        }
+        else if (children[fromI].become(insert[0])) {
+            fromI++;
+            insert.shift();
+            openStart = insert.length ? 0 : openEnd;
+        }
+        else {
+            break;
+        }
+    }
+    if (!insert.length && fromI && toI < children.length && !children[fromI - 1].breakAfter &&
+        children[toI].merge(0, 0, children[fromI - 1], false, openStart, openEnd))
+        fromI--;
+    if (fromI < toI || insert.length)
+        parent.replaceChildren(fromI, toI, insert);
+}
+function mergeChildrenInto(parent, from, to, insert, openStart, openEnd) {
+    let cur = parent.childCursor();
+    let { i: toI, off: toOff } = cur.findPos(to, 1);
+    let { i: fromI, off: fromOff } = cur.findPos(from, -1);
+    let dLen = from - to;
+    for (let view of insert)
+        dLen += view.length;
+    parent.length += dLen;
+    replaceRange(parent, fromI, fromOff, toI, toOff, insert, 0, openStart, openEnd);
+}
 
 let [nav, doc] = typeof navigator != "undefined"
     ? [navigator, document]
@@ -521,21 +620,8 @@ var browser = {
     tabSize: doc.documentElement.style.tabSize != null ? "tab-size" : "-moz-tab-size"
 };
 
-const none$2 = [];
-class InlineView extends ContentView {
-    /**
-    Return true when this view is equivalent to `other` and can take
-    on its role.
-    */
-    become(_other) { return false; }
-    // When this is a zero-length view with a side, this should return a
-    // negative number to indicate it is before its position, or a
-    // positive number when after its position.
-    getSide() { return 0; }
-}
-InlineView.prototype.children = none$2;
 const MaxJoinLen = 256;
-class TextView extends InlineView {
+class TextView extends ContentView {
     constructor(text) {
         super();
         this.text = text;
@@ -566,7 +652,7 @@ class TextView extends InlineView {
         this.markDirty();
         return true;
     }
-    slice(from) {
+    split(from) {
         let result = new TextView(this.text.slice(from));
         this.text = this.text.slice(0, from);
         return result;
@@ -582,7 +668,7 @@ class TextView extends InlineView {
         return textCoords(this.dom, pos, side);
     }
 }
-class MarkView extends InlineView {
+class MarkView extends ContentView {
     constructor(mark, children = [], length = 0) {
         super();
         this.mark = mark;
@@ -605,20 +691,20 @@ class MarkView extends InlineView {
             this.createDOM();
         super.sync(track);
     }
-    merge(from, to, source, openStart, openEnd) {
+    merge(from, to, source, _hasStart, openStart, openEnd) {
         if (source && (!(source instanceof MarkView && source.mark.eq(this.mark)) ||
             (from && openStart <= 0) || (to < this.length && openEnd <= 0)))
             return false;
-        mergeInlineChildren(this, from, to, source ? source.children : none$2, openStart - 1, openEnd - 1);
+        mergeChildrenInto(this, from, to, source ? source.children : [], openStart - 1, openEnd - 1);
         this.markDirty();
         return true;
     }
-    slice(from) {
+    split(from) {
         let result = [], off = 0, detachFrom = -1, i = 0;
         for (let elt of this.children) {
             let end = off + elt.length;
             if (end > from)
-                result.push(off < from ? elt.slice(from - off) : elt);
+                result.push(off < from ? elt.split(from - off) : elt);
             if (detachFrom < 0 && off >= from)
                 detachFrom = i;
             off = end;
@@ -626,8 +712,10 @@ class MarkView extends InlineView {
         }
         let length = this.length - from;
         this.length = from;
-        if (detachFrom > -1)
-            this.replaceChildren(detachFrom, this.children.length);
+        if (detachFrom > -1) {
+            this.children.length = detachFrom;
+            this.markDirty();
+        }
         return new MarkView(this.mark, result, length);
     }
     domAtPos(pos) {
@@ -669,7 +757,7 @@ function textCoords(text, pos, side) {
     return flatten ? flattenRect(rect, flatten < 0) : rect || null;
 }
 // Also used for collapsed ranges that don't have a placeholder widget!
-class WidgetView extends InlineView {
+class WidgetView extends ContentView {
     constructor(widget, length, side) {
         super();
         this.widget = widget;
@@ -679,7 +767,7 @@ class WidgetView extends InlineView {
     static create(widget, length, side) {
         return new (widget.customView || WidgetView)(widget, length, side);
     }
-    slice(from) {
+    split(from) {
         let result = WidgetView.create(this.widget, this.length - from, this.side);
         this.length -= from;
         return result;
@@ -691,7 +779,7 @@ class WidgetView extends InlineView {
         }
     }
     getSide() { return this.side; }
-    merge(from, to, source, openStart, openEnd) {
+    merge(from, to, source, hasStart, openStart, openEnd) {
         if (source && (!(source instanceof WidgetView) || !this.widget.compare(source.widget) ||
             from > 0 && openStart <= 0 || to < this.length && openEnd <= 0))
             return false;
@@ -736,6 +824,11 @@ class WidgetView extends InlineView {
         return (pos == 0 && side > 0 || pos == this.length && side <= 0) ? rect : flattenRect(rect, pos == 0);
     }
     get isEditable() { return false; }
+    destroy() {
+        super.destroy();
+        if (this.dom)
+            this.widget.destroy(this.dom);
+    }
 }
 class CompositionView extends WidgetView {
     domAtPos(pos) { return new DOMPos(this.widget.text, pos); }
@@ -749,10 +842,13 @@ class CompositionView extends WidgetView {
     coordsAt(pos, side) { return textCoords(this.widget.text, pos, side); }
     get isEditable() { return true; }
 }
+// Use two characters on Android, to prevent Chrome from closing the
+// virtual keyboard when backspacing after a widget (#602).
+const ZeroWidthSpace = browser.android ? "\u200b\u200b" : "\u200b";
 // These are drawn around uneditable widgets to avoid a number of
 // browser bugs that show up when the cursor is directly next to
 // uneditable inline content.
-class WidgetBufferView extends InlineView {
+class WidgetBufferView extends ContentView {
     constructor(side) {
         super();
         this.side = side;
@@ -762,15 +858,16 @@ class WidgetBufferView extends InlineView {
     become(other) {
         return other instanceof WidgetBufferView && other.side == this.side;
     }
-    slice() { return new WidgetBufferView(this.side); }
+    split() { return new WidgetBufferView(this.side); }
     sync() {
         if (!this.dom)
-            this.setDOM(document.createTextNode("\u200b"));
-        else if (this.dirty && this.dom.nodeValue != "\u200b")
-            this.dom.nodeValue = "\u200b";
+            this.setDOM(document.createTextNode(ZeroWidthSpace));
+        else if (this.dirty && this.dom.nodeValue != ZeroWidthSpace)
+            this.dom.nodeValue = ZeroWidthSpace;
     }
     getSide() { return this.side; }
     domAtPos(pos) { return DOMPos.before(this.dom); }
+    localPosFromDOM() { return 0; }
     domBoundsAround() { return null; }
     coordsAt(pos) {
         let rects = clientRectsFor(this.dom);
@@ -780,90 +877,7 @@ class WidgetBufferView extends InlineView {
         return Text.of([this.dom.nodeValue.replace(/\u200b/g, "")]);
     }
 }
-function mergeInlineChildren(parent, from, to, elts, openStart, openEnd) {
-    let cur = parent.childCursor();
-    let { i: toI, off: toOff } = cur.findPos(to, 1);
-    let { i: fromI, off: fromOff } = cur.findPos(from, -1);
-    let dLen = from - to;
-    for (let view of elts)
-        dLen += view.length;
-    parent.length += dLen;
-    let { children } = parent;
-    // Both from and to point into the same child view
-    if (fromI == toI && fromOff) {
-        let start = children[fromI];
-        // Maybe just update that view and be done
-        if (elts.length == 1 && start.merge(fromOff, toOff, elts[0], openStart, openEnd))
-            return;
-        if (elts.length == 0) {
-            start.merge(fromOff, toOff, null, openStart, openEnd);
-            return;
-        }
-        // Otherwise split it, so that we don't have to worry about aliasing front/end afterwards
-        let after = start.slice(toOff);
-        if (after.merge(0, 0, elts[elts.length - 1], 0, openEnd))
-            elts[elts.length - 1] = after;
-        else
-            elts.push(after);
-        toI++;
-        openEnd = toOff = 0;
-    }
-    // Make sure start and end positions fall on node boundaries
-    // (fromOff/toOff are no longer used after this), and that if the
-    // start or end of the elts can be merged with adjacent nodes,
-    // this is done
-    if (toOff) {
-        let end = children[toI];
-        if (elts.length && end.merge(0, toOff, elts[elts.length - 1], 0, openEnd)) {
-            elts.pop();
-            openEnd = elts.length ? 0 : openStart;
-        }
-        else {
-            end.merge(0, toOff, null, 0, 0);
-        }
-    }
-    else if (toI < children.length && elts.length &&
-        children[toI].merge(0, 0, elts[elts.length - 1], 0, openEnd)) {
-        elts.pop();
-        openEnd = elts.length ? 0 : openStart;
-    }
-    if (fromOff) {
-        let start = children[fromI];
-        if (elts.length && start.merge(fromOff, start.length, elts[0], openStart, 0)) {
-            elts.shift();
-            openStart = elts.length ? 0 : openEnd;
-        }
-        else {
-            start.merge(fromOff, start.length, null, 0, 0);
-        }
-        fromI++;
-    }
-    else if (fromI && elts.length) {
-        let end = children[fromI - 1];
-        if (end.merge(end.length, end.length, elts[0], openStart, 0)) {
-            elts.shift();
-            openStart = elts.length ? 0 : openEnd;
-        }
-    }
-    // Then try to merge any mergeable nodes at the start and end of
-    // the changed range
-    while (fromI < toI && elts.length && children[toI - 1].become(elts[elts.length - 1])) {
-        elts.pop();
-        toI--;
-        openEnd = elts.length ? 0 : openStart;
-    }
-    while (fromI < toI && elts.length && children[fromI].become(elts[0])) {
-        elts.shift();
-        fromI++;
-        openStart = elts.length ? 0 : openEnd;
-    }
-    if (!elts.length && fromI && toI < children.length &&
-        children[toI].merge(0, 0, children[fromI - 1], openStart, openEnd))
-        fromI--;
-    // And if anything remains, splice the child array to insert the new elts
-    if (elts.length || fromI != toI)
-        parent.replaceChildren(fromI, toI, elts);
-}
+TextView.prototype.children = WidgetView.prototype.children = WidgetBufferView.prototype.children = noChildren;
 function inlineDOMAtPos(dom, children, pos) {
     let i = 0;
     for (let off = 0; i < children.length; i++) {
@@ -1004,6 +1018,11 @@ class WidgetType {
     @internal
     */
     get customView() { return null; }
+    /**
+    This is called when the an instance of the widget is removed
+    from the editor view.
+    */
+    destroy(_dom) { }
 }
 /**
 The different types of blocks that can occur in an editor view.
@@ -1163,12 +1182,12 @@ class PointDecoration extends Decoration {
         super(startSide, endSide, widget, spec);
         this.block = block;
         this.isReplace = isReplace;
-        this.mapMode = !block ? MapMode.TrackDel : startSide < 0 ? MapMode.TrackBefore : MapMode.TrackAfter;
+        this.mapMode = !block ? MapMode.TrackDel : startSide <= 0 ? MapMode.TrackBefore : MapMode.TrackAfter;
     }
     // Only relevant when this.block == true
     get type() {
         return this.startSide < this.endSide ? BlockType.WidgetRange
-            : this.startSide < 0 ? BlockType.WidgetBefore : BlockType.WidgetAfter;
+            : this.startSide <= 0 ? BlockType.WidgetBefore : BlockType.WidgetAfter;
     }
     get heightRelevant() { return this.block || !!this.widget && this.widget.estimatedHeight >= 5; }
     eq(other) {
@@ -1178,7 +1197,7 @@ class PointDecoration extends Decoration {
             this.startSide == other.startSide && this.endSide == other.endSide;
     }
     range(from, to = from) {
-        if (this.isReplace && (from > to || (from == to && this.startSide > 0 && this.endSide < 0)))
+        if (this.isReplace && (from > to || (from == to && this.startSide > 0 && this.endSide <= 0)))
             throw new RangeError("Invalid range for replacement decoration");
         if (!this.isReplace && to != from)
             throw new RangeError("Widget decorations can only have zero-length ranges");
@@ -1215,16 +1234,16 @@ class LineView extends ContentView {
         this.breakAfter = 0;
     }
     // Consumes source
-    merge(from, to, source, takeDeco, openStart, openEnd) {
+    merge(from, to, source, hasStart, openStart, openEnd) {
         if (source) {
             if (!(source instanceof LineView))
                 return false;
             if (!this.dom)
                 source.transferDOM(this); // Reuse source.dom when appropriate
         }
-        if (takeDeco)
+        if (hasStart)
             this.setDeco(source ? source.attrs : null);
-        mergeInlineChildren(this, from, to, source ? source.children : none$1, openStart, openEnd);
+        mergeChildrenInto(this, from, to, source ? source.children : [], openStart, openEnd);
         return true;
     }
     split(at) {
@@ -1234,16 +1253,14 @@ class LineView extends ContentView {
             return end;
         let { i, off } = this.childPos(at);
         if (off) {
-            end.append(this.children[i].slice(off), 0);
-            this.children[i].merge(off, this.children[i].length, null, 0, 0);
+            end.append(this.children[i].split(off), 0);
+            this.children[i].merge(off, this.children[i].length, null, false, 0, 0);
             i++;
         }
         for (let j = i; j < this.children.length; j++)
             end.append(this.children[j], 0);
-        while (i > 0 && this.children[i - 1].length == 0) {
-            this.children[i - 1].parent = null;
-            i--;
-        }
+        while (i > 0 && this.children[i - 1].length == 0)
+            this.children[--i].destroy();
         this.children.length = i;
         this.markDirty();
         this.length = at;
@@ -1266,7 +1283,6 @@ class LineView extends ContentView {
             this.attrs = attrs;
         }
     }
-    // Only called when building a line view in ContentBuilder
     append(child, openStart) {
         joinInlineInto(this, child, openStart);
     }
@@ -1323,7 +1339,7 @@ class LineView extends ContentView {
     coordsAt(pos, side) {
         return coordsInChildren(this, pos, side);
     }
-    match(_other) { return false; }
+    become(_other) { return false; }
     get type() { return BlockType.Text; }
     static find(docView, pos) {
         for (let i = 0, off = 0;; i++) {
@@ -1338,7 +1354,6 @@ class LineView extends ContentView {
         }
     }
 }
-const none$1 = [];
 class BlockWidgetView extends ContentView {
     constructor(widget, length, type) {
         super();
@@ -1364,7 +1379,7 @@ class BlockWidgetView extends ContentView {
         end.breakAfter = this.breakAfter;
         return end;
     }
-    get children() { return none$1; }
+    get children() { return noChildren; }
     sync() {
         if (!this.dom || !this.widget.updateDOM(this.dom)) {
             this.setDOM(this.widget.toDOM(this.editorView));
@@ -1375,7 +1390,7 @@ class BlockWidgetView extends ContentView {
         return this.parent ? this.parent.view.state.doc.slice(this.posAtStart, this.posAtEnd) : Text$1.empty;
     }
     domBoundsAround() { return null; }
-    match(other) {
+    become(other) {
         if (other instanceof BlockWidgetView && other.type == this.type &&
             other.widget.constructor == this.widget.constructor) {
             if (!other.widget.eq(this.widget))
@@ -1389,6 +1404,11 @@ class BlockWidgetView extends ContentView {
     }
     ignoreMutation() { return true; }
     ignoreEvent(event) { return this.widget.ignoreEvent(event); }
+    destroy() {
+        super.destroy();
+        if (this.dom)
+            this.widget.destroy(this.dom);
+    }
 }
 
 class ContentBuilder {
@@ -1918,854 +1938,882 @@ class ViewUpdate {
     get empty() { return this.flags == 0 && this.transactions.length == 0; }
 }
 
-class DocView extends ContentView {
-    constructor(view) {
-        super();
-        this.view = view;
-        this.compositionDeco = Decoration.none;
-        this.decorations = [];
-        // Track a minimum width for the editor. When measuring sizes in
-        // 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;
-        // Track whether the DOM selection was set in a lossy way, so that
-        // we don't mess it up when reading it back it
-        this.impreciseAnchor = null;
-        this.impreciseHead = null;
-        this.forceSelection = false;
-        // Used by the resize observer to ignore resizes that we caused
-        // ourselves
-        this.lastUpdate = Date.now();
-        this.setDOM(view.contentDOM);
-        this.children = [new LineView];
-        this.children[0].setParent(this);
-        this.updateInner([new ChangedRange(0, 0, 0, view.state.doc.length)], this.updateDeco(), 0);
+/**
+Used to indicate [text direction](https://codemirror.net/6/docs/ref/#view.EditorView.textDirection).
+*/
+var Direction = /*@__PURE__*/(function (Direction) {
+    // (These are chosen to match the base levels, in bidi algorithm
+    // terms, of spans in that direction.)
+    /**
+    Left-to-right.
+    */
+    Direction[Direction["LTR"] = 0] = "LTR";
+    /**
+    Right-to-left.
+    */
+    Direction[Direction["RTL"] = 1] = "RTL";
+return Direction})(Direction || (Direction = {}));
+const LTR = Direction.LTR, RTL = Direction.RTL;
+// Decode a string with each type encoded as log2(type)
+function dec(str) {
+    let result = [];
+    for (let i = 0; i < str.length; i++)
+        result.push(1 << +str[i]);
+    return result;
+}
+// Character types for codepoints 0 to 0xf8
+const LowTypes = /*@__PURE__*/dec("88888888888888888888888888888888888666888888787833333333337888888000000000000000000000000008888880000000000000000000000000088888888888888888888888888888888888887866668888088888663380888308888800000000000000000000000800000000000000000000000000000008");
+// Character types for codepoints 0x600 to 0x6f9
+const ArabicTypes = /*@__PURE__*/dec("4444448826627288999999999992222222222222222222222222222222222222222222222229999999999999999999994444444444644222822222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222999999949999999229989999223333333333");
+const Brackets = /*@__PURE__*/Object.create(null), BracketStack = [];
+// There's a lot more in
+// https://www.unicode.org/Public/UCD/latest/ucd/BidiBrackets.txt,
+// which are left out to keep code size down.
+for (let p of ["()", "[]", "{}"]) {
+    let l = /*@__PURE__*/p.charCodeAt(0), r = /*@__PURE__*/p.charCodeAt(1);
+    Brackets[l] = r;
+    Brackets[r] = -l;
+}
+function charType(ch) {
+    return ch <= 0xf7 ? LowTypes[ch] :
+        0x590 <= ch && ch <= 0x5f4 ? 2 /* R */ :
+            0x600 <= ch && ch <= 0x6f9 ? ArabicTypes[ch - 0x600] :
+                0x6ee <= ch && ch <= 0x8ac ? 4 /* AL */ :
+                    0x2000 <= ch && ch <= 0x200b ? 256 /* NI */ :
+                        ch == 0x200c ? 256 /* NI */ : 1 /* L */;
+}
+const BidiRE = /[\u0590-\u05f4\u0600-\u06ff\u0700-\u08ac]/;
+/**
+Represents a contiguous range of text that has a single direction
+(as in left-to-right or right-to-left).
+*/
+class BidiSpan {
+    /**
+    @internal
+    */
+    constructor(
+    /**
+    The start of the span (relative to the start of the line).
+    */
+    from, 
+    /**
+    The end of the span.
+    */
+    to, 
+    /**
+    The ["bidi
+    level"](https://unicode.org/reports/tr9/#Basic_Display_Algorithm)
+    of the span (in this context, 0 means
+    left-to-right, 1 means right-to-left, 2 means left-to-right
+    number inside right-to-left text).
+    */
+    level) {
+        this.from = from;
+        this.to = to;
+        this.level = level;
     }
-    get root() { return this.view.root; }
-    get editorView() { return this.view; }
-    get length() { return this.view.state.doc.length; }
-    // Update the document view to a given state. scrollIntoView can be
-    // used as a hint to compute a new viewport that includes that
-    // position, if we know the editor is going to scroll that position
-    // into view.
-    update(update) {
-        let changedRanges = update.changedRanges;
-        if (this.minWidth > 0 && changedRanges.length) {
-            if (!changedRanges.every(({ fromA, toA }) => toA < this.minWidthFrom || fromA > this.minWidthTo)) {
-                this.minWidth = 0;
-            }
-            else {
-                this.minWidthFrom = update.changes.mapPos(this.minWidthFrom, 1);
-                this.minWidthTo = update.changes.mapPos(this.minWidthTo, 1);
+    /**
+    The direction of this span.
+    */
+    get dir() { return this.level % 2 ? RTL : LTR; }
+    /**
+    @internal
+    */
+    side(end, dir) { return (this.dir == dir) == end ? this.to : this.from; }
+    /**
+    @internal
+    */
+    static find(order, index, level, assoc) {
+        let maybe = -1;
+        for (let i = 0; i < order.length; i++) {
+            let span = order[i];
+            if (span.from <= index && span.to >= index) {
+                if (span.level == level)
+                    return i;
+                // When multiple spans match, if assoc != 0, take the one that
+                // covers that side, otherwise take the one with the minimum
+                // level.
+                if (maybe < 0 || (assoc != 0 ? (assoc < 0 ? span.from < index : span.to > index) : order[maybe].level > span.level))
+                    maybe = i;
             }
         }
-        if (this.view.inputState.composing < 0)
-            this.compositionDeco = Decoration.none;
-        else if (update.transactions.length)
-            this.compositionDeco = computeCompositionDeco(this.view, update.changes);
-        // When the DOM nodes around the selection are moved to another
-        // parent, Chrome sometimes reports a different selection through
-        // getSelection than the one that it actually shows to the user.
-        // This forces a selection update when lines are joined to work
-        // around that. Issue #54
-        if ((browser.ie || browser.chrome) && !this.compositionDeco.size && update &&
-            update.state.doc.lines != update.startState.doc.lines)
-            this.forceSelection = true;
-        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) {
-            return false;
-        }
-        else {
-            this.updateInner(changedRanges, deco, update.startState.doc.length);
-            if (update.transactions.length)
-                this.lastUpdate = Date.now();
-            return true;
-        }
+        if (maybe < 0)
+            throw new RangeError("Index out of range");
+        return maybe;
     }
-    reset(sel) {
-        if (this.dirty) {
-            this.view.observer.ignore(() => this.view.docView.sync());
-            this.dirty = 0 /* Not */;
-            this.updateSelection(true);
+}
+// Reused array of character types
+const types = [];
+function computeOrder(line, direction) {
+    let len = line.length, outerType = direction == LTR ? 1 /* L */ : 2 /* R */, oppositeType = direction == LTR ? 2 /* R */ : 1 /* L */;
+    if (!line || outerType == 1 /* L */ && !BidiRE.test(line))
+        return trivialOrder(len);
+    // W1. Examine each non-spacing mark (NSM) in the level run, and
+    // change the type of the NSM to the type of the previous
+    // character. If the NSM is at the start of the level run, it will
+    // get the type of sor.
+    // W2. Search backwards from each instance of a European number
+    // until the first strong type (R, L, AL, or sor) is found. If an
+    // AL is found, change the type of the European number to Arabic
+    // number.
+    // W3. Change all ALs to R.
+    // (Left after this: L, R, EN, AN, ET, CS, NI)
+    for (let i = 0, prev = outerType, prevStrong = outerType; i < len; i++) {
+        let type = charType(line.charCodeAt(i));
+        if (type == 512 /* NSM */)
+            type = prev;
+        else if (type == 8 /* EN */ && prevStrong == 4 /* AL */)
+            type = 16 /* AN */;
+        types[i] = type == 4 /* AL */ ? 2 /* R */ : type;
+        if (type & 7 /* Strong */)
+            prevStrong = type;
+        prev = type;
+    }
+    // W5. A sequence of European terminators adjacent to European
+    // numbers changes to all European numbers.
+    // W6. Otherwise, separators and terminators change to Other
+    // Neutral.
+    // W7. Search backwards from each instance of a European number
+    // until the first strong type (R, L, or sor) is found. If an L is
+    // found, then change the type of the European number to L.
+    // (Left after this: L, R, EN+AN, NI)
+    for (let i = 0, prev = outerType, prevStrong = outerType; i < len; i++) {
+        let type = types[i];
+        if (type == 128 /* CS */) {
+            if (i < len - 1 && prev == types[i + 1] && (prev & 24 /* Num */))
+                type = types[i] = prev;
+            else
+                types[i] = 256 /* NI */;
         }
-        else {
-            this.updateSelection();
+        else if (type == 64 /* ET */) {
+            let end = i + 1;
+            while (end < len && types[end] == 64 /* ET */)
+                end++;
+            let replace = (i && prev == 8 /* EN */) || (end < len && types[end] == 8 /* EN */) ? (prevStrong == 1 /* L */ ? 1 /* L */ : 8 /* EN */) : 256 /* NI */;
+            for (let j = i; j < end; j++)
+                types[j] = replace;
+            i = end - 1;
         }
-    }
-    // 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(() => {
-            // Lock the height during redrawing, since Chrome sometimes
-            // 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.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
-            // selection from the one it displays (issue #218). This tries
-            // to detect that situation.
-            let track = browser.chrome || browser.ios ? { node: observer.selectionRange.focusNode, written: false } : undefined;
-            this.sync(track);
-            this.dirty = 0 /* Not */;
-            if (track && (track.written || observer.selectionRange.focusNode != track.node))
-                this.forceSelection = true;
-            this.dom.style.height = "";
-        });
-        let gaps = [];
-        if (this.view.viewport.from || this.view.viewport.to < this.view.state.doc.length)
-            for (let child of this.children)
-                if (child instanceof BlockWidgetView && child.widget instanceof BlockGapWidget)
-                    gaps.push(child.dom);
-        observer.updateGaps(gaps);
-    }
-    updateChildren(changes, deco, oldLength) {
-        let cursor = this.childCursor(oldLength);
-        for (let i = changes.length - 1;; i--) {
-            let next = i >= 0 ? changes[i] : null;
-            if (!next)
-                break;
-            let { fromA, toA, fromB, toB } = next;
-            let { content, breakAtStart, openStart, openEnd } = ContentBuilder.build(this.view.state.doc, fromB, toB, deco);
-            let { i: toI, off: toOff } = cursor.findPos(toA, 1);
-            let { i: fromI, off: fromOff } = cursor.findPos(fromA, -1);
-            this.replaceRange(fromI, fromOff, toI, toOff, content, breakAtStart, openStart, openEnd);
+        else if (type == 8 /* EN */ && prevStrong == 1 /* L */) {
+            types[i] = 1 /* L */;
         }
+        prev = type;
+        if (type & 7 /* Strong */)
+            prevStrong = type;
     }
-    replaceRange(fromI, fromOff, toI, toOff, content, breakAtStart, openStart, openEnd) {
-        let before = this.children[fromI], last = content.length ? content[content.length - 1] : null;
-        let breakAtEnd = last ? last.breakAfter : breakAtStart;
-        // Change within a single line
-        if (fromI == toI && !breakAtStart && !breakAtEnd && content.length < 2 &&
-            before.merge(fromOff, toOff, content.length ? last : null, fromOff == 0, openStart, openEnd))
-            return;
-        let after = this.children[toI];
-        // Make sure the end of the line after the update is preserved in `after`
-        if (toOff < after.length) {
-            // If we're splitting a line, separate part of the start line to
-            // avoid that being mangled when updating the start line.
-            if (fromI == toI) {
-                after = after.split(toOff);
-                toOff = 0;
+    // N0. Process bracket pairs in an isolating run sequence
+    // sequentially in the logical order of the text positions of the
+    // opening paired brackets using the logic given below. Within this
+    // scope, bidirectional types EN and AN are treated as R.
+    for (let i = 0, sI = 0, context = 0, ch, br, type; i < len; i++) {
+        // Keeps [startIndex, type, strongSeen] triples for each open
+        // bracket on BracketStack.
+        if (br = Brackets[ch = line.charCodeAt(i)]) {
+            if (br < 0) { // Closing bracket
+                for (let sJ = sI - 3; sJ >= 0; sJ -= 3) {
+                    if (BracketStack[sJ + 1] == -br) {
+                        let flags = BracketStack[sJ + 2];
+                        let type = (flags & 2 /* EmbedInside */) ? outerType :
+                            !(flags & 4 /* OppositeInside */) ? 0 :
+                                (flags & 1 /* OppositeBefore */) ? oppositeType : outerType;
+                        if (type)
+                            types[i] = types[BracketStack[sJ]] = type;
+                        sI = sJ;
+                        break;
+                    }
+                }
             }
-            // If the element after the replacement should be merged with
-            // the last replacing element, update `content`
-            if (!breakAtEnd && last && after.merge(0, toOff, last, true, 0, openEnd)) {
-                content[content.length - 1] = after;
+            else if (BracketStack.length == 189 /* MaxDepth */) {
+                break;
             }
             else {
-                // Remove the start of the after element, if necessary, and
-                // add it to `content`.
-                if (toOff)
-                    after.merge(0, toOff, null, false, 0, openEnd);
-                content.push(after);
+                BracketStack[sI++] = i;
+                BracketStack[sI++] = ch;
+                BracketStack[sI++] = context;
             }
         }
-        else if (after.breakAfter) {
-            // The element at `toI` is entirely covered by this range.
-            // Preserve its line break, if any.
-            if (last)
-                last.breakAfter = 1;
-            else
-                breakAtStart = 1;
+        else if ((type = types[i]) == 2 /* R */ || type == 1 /* L */) {
+            let embed = type == outerType;
+            context = embed ? 0 : 1 /* OppositeBefore */;
+            for (let sJ = sI - 3; sJ >= 0; sJ -= 3) {
+                let cur = BracketStack[sJ + 2];
+                if (cur & 2 /* EmbedInside */)
+                    break;
+                if (embed) {
+                    BracketStack[sJ + 2] |= 2 /* EmbedInside */;
+                }
+                else {
+                    if (cur & 4 /* OppositeInside */)
+                        break;
+                    BracketStack[sJ + 2] |= 4 /* OppositeInside */;
+                }
+            }
         }
-        // Since we've handled the next element from the current elements
-        // now, make sure `toI` points after that.
-        toI++;
-        before.breakAfter = breakAtStart;
-        if (fromOff > 0) {
-            if (!breakAtStart && content.length && before.merge(fromOff, before.length, content[0], false, openStart, 0)) {
-                before.breakAfter = content.shift().breakAfter;
+    }
+    // N1. A sequence of neutrals takes the direction of the
+    // surrounding strong text if the text on both sides has the same
+    // direction. European and Arabic numbers act as if they were R in
+    // terms of their influence on neutrals. Start-of-level-run (sor)
+    // and end-of-level-run (eor) are used at level run boundaries.
+    // N2. Any remaining neutrals take the embedding direction.
+    // (Left after this: L, R, EN+AN)
+    for (let i = 0; i < len; i++) {
+        if (types[i] == 256 /* NI */) {
+            let end = i + 1;
+            while (end < len && types[end] == 256 /* NI */)
+                end++;
+            let beforeL = (i ? types[i - 1] : outerType) == 1 /* L */;
+            let afterL = (end < len ? types[end] : outerType) == 1 /* L */;
+            let replace = beforeL == afterL ? (beforeL ? 1 /* L */ : 2 /* R */) : outerType;
+            for (let j = i; j < end; j++)
+                types[j] = replace;
+            i = end - 1;
+        }
+    }
+    // Here we depart from the documented algorithm, in order to avoid
+    // building up an actual levels array. Since there are only three
+    // levels (0, 1, 2) in an implementation that doesn't take
+    // explicit embedding into account, we can build up the order on
+    // the fly, without following the level-based algorithm.
+    let order = [];
+    if (outerType == 1 /* L */) {
+        for (let i = 0; i < len;) {
+            let start = i, rtl = types[i++] != 1 /* L */;
+            while (i < len && rtl == (types[i] != 1 /* L */))
+                i++;
+            if (rtl) {
+                for (let j = i; j > start;) {
+                    let end = j, l = types[--j] != 2 /* R */;
+                    while (j > start && l == (types[j - 1] != 2 /* R */))
+                        j--;
+                    order.push(new BidiSpan(j, end, l ? 2 : 1));
+                }
             }
-            else if (fromOff < before.length || before.children.length && before.children[before.children.length - 1].length == 0) {
-                before.merge(fromOff, before.length, null, false, openStart, 0);
+            else {
+                order.push(new BidiSpan(start, i, 0));
             }
-            fromI++;
         }
-        // Try to merge widgets on the boundaries of the replacement
-        while (fromI < toI && content.length) {
-            if (this.children[toI - 1].match(content[content.length - 1]))
-                toI--, content.pop();
-            else if (this.children[fromI].match(content[0]))
-                fromI++, content.shift();
-            else
-                break;
+    }
+    else {
+        for (let i = 0; i < len;) {
+            let start = i, rtl = types[i++] == 2 /* R */;
+            while (i < len && rtl == (types[i] == 2 /* R */))
+                i++;
+            order.push(new BidiSpan(start, i, rtl ? 1 : 2));
         }
-        if (fromI < toI || content.length)
-            this.replaceChildren(fromI, toI, content);
     }
-    // Sync the DOM selection to this.state.selection
-    updateSelection(mustRead = false, fromPointer = false) {
-        if (mustRead)
-            this.view.observer.readSelectionRange();
-        if (!(fromPointer || this.mayControlSelection()) ||
-            browser.ios && this.view.inputState.rapidCompositionStart)
-            return;
-        let force = this.forceSelection;
-        this.forceSelection = false;
-        let main = this.view.state.selection.main;
-        // FIXME need to handle the case where the selection falls inside a block range
-        let anchor = this.domAtPos(main.anchor);
-        let head = main.empty ? anchor : this.domAtPos(main.head);
-        // Always reset on Firefox when next to an uneditable node to
-        // avoid invisible cursor bugs (#111)
-        if (browser.gecko && main.empty && betweenUneditable(anchor)) {
-            let dummy = document.createTextNode("");
-            this.view.observer.ignore(() => anchor.node.insertBefore(dummy, anchor.node.childNodes[anchor.offset] || null));
-            anchor = head = new DOMPos(dummy, 0);
-            force = true;
-        }
-        let domSel = this.view.observer.selectionRange;
-        // If the selection is already here, or in an equivalent position, don't touch it
-        if (force || !domSel.focusNode ||
-            !isEquivalentPosition(anchor.node, anchor.offset, domSel.anchorNode, domSel.anchorOffset) ||
-            !isEquivalentPosition(head.node, head.offset, domSel.focusNode, domSel.focusOffset)) {
-            this.view.observer.ignore(() => {
-                // Chrome Android will hide the virtual keyboard when tapping
-                // inside an uneditable node, and not bring it back when we
-                // move the cursor to its proper position. This tries to
-                // restore the keyboard by cycling focus.
-                if (browser.android && browser.chrome && this.dom.contains(domSel.focusNode) && inUneditable(domSel.focusNode, this.dom)) {
-                    this.dom.blur();
-                    this.dom.focus({ preventScroll: true });
-                }
-                let rawSel = getSelection(this.root);
-                if (main.empty) {
-                    // Work around https://bugzilla.mozilla.org/show_bug.cgi?id=1612076
-                    if (browser.gecko) {
-                        let nextTo = nextToUneditable(anchor.node, anchor.offset);
-                        if (nextTo && nextTo != (1 /* Before */ | 2 /* After */)) {
-                            let text = nearbyTextNode(anchor.node, anchor.offset, nextTo == 1 /* Before */ ? 1 : -1);
-                            if (text)
-                                anchor = new DOMPos(text, nextTo == 1 /* Before */ ? 0 : text.nodeValue.length);
-                        }
-                    }
-                    rawSel.collapse(anchor.node, anchor.offset);
-                    if (main.bidiLevel != null && domSel.cursorBidiLevel != null)
-                        domSel.cursorBidiLevel = main.bidiLevel;
-                }
-                else if (rawSel.extend) {
-                    // Selection.extend can be used to create an 'inverted' selection
-                    // (one where the focus is before the anchor), but not all
-                    // browsers support it yet.
-                    rawSel.collapse(anchor.node, anchor.offset);
-                    rawSel.extend(head.node, head.offset);
-                }
-                else {
-                    // Primitive (IE) way
-                    let range = document.createRange();
-                    if (main.anchor > main.head)
-                        [anchor, head] = [head, anchor];
-                    range.setEnd(head.node, head.offset);
-                    range.setStart(anchor.node, anchor.offset);
-                    rawSel.removeAllRanges();
-                    rawSel.addRange(range);
-                }
-            });
-            this.view.observer.setSelectionRange(anchor, head);
+    return order;
+}
+function trivialOrder(length) {
+    return [new BidiSpan(0, length, 0)];
+}
+let movedOver = "";
+function moveVisually(line, order, dir, start, forward) {
+    var _a;
+    let startIndex = start.head - line.from, spanI = -1;
+    if (startIndex == 0) {
+        if (!forward || !line.length)
+            return null;
+        if (order[0].level != dir) {
+            startIndex = order[0].side(false, dir);
+            spanI = 0;
         }
-        this.impreciseAnchor = anchor.precise ? null : new DOMPos(domSel.anchorNode, domSel.anchorOffset);
-        this.impreciseHead = head.precise ? null : new DOMPos(domSel.focusNode, domSel.focusOffset);
-    }
-    enforceCursorAssoc() {
-        if (this.view.composing)
-            return;
-        let cursor = this.view.state.selection.main;
-        let sel = getSelection(this.root);
-        if (!cursor.empty || !cursor.assoc || !sel.modify)
-            return;
-        let line = LineView.find(this, cursor.head);
-        if (!line)
-            return;
-        let lineStart = line.posAtStart;
-        if (cursor.head == lineStart || cursor.head == lineStart + line.length)
-            return;
-        let before = this.coordsAt(cursor.head, -1), after = this.coordsAt(cursor.head, 1);
-        if (!before || !after || before.bottom > after.top)
-            return;
-        let dom = this.domAtPos(cursor.head + cursor.assoc);
-        sel.collapse(dom.node, dom.offset);
-        sel.modify("move", cursor.assoc < 0 ? "forward" : "backward", "lineboundary");
-    }
-    mayControlSelection() {
-        return this.view.state.facet(editable) ? this.root.activeElement == this.dom
-            : hasSelection(this.dom, this.view.observer.selectionRange);
     }
-    nearest(dom) {
-        for (let cur = dom; cur;) {
-            let domView = ContentView.get(cur);
-            if (domView && domView.rootView == this)
-                return domView;
-            cur = cur.parentNode;
+    else if (startIndex == line.length) {
+        if (forward)
+            return null;
+        let last = order[order.length - 1];
+        if (last.level != dir) {
+            startIndex = last.side(true, dir);
+            spanI = order.length - 1;
         }
-        return null;
-    }
-    posFromDOM(node, offset) {
-        let view = this.nearest(node);
-        if (!view)
-            throw new RangeError("Trying to find position for a DOM position outside of the document");
-        return view.localPosFromDOM(node, offset) + view.posAtStart;
     }
-    domAtPos(pos) {
-        let { i, off } = this.childCursor().findPos(pos, -1);
-        for (; i < this.children.length - 1;) {
-            let child = this.children[i];
-            if (off < child.length || child instanceof LineView)
-                break;
-            i++;
-            off = 0;
-        }
-        return this.children[i].domAtPos(off);
+    if (spanI < 0)
+        spanI = BidiSpan.find(order, startIndex, (_a = start.bidiLevel) !== null && _a !== void 0 ? _a : -1, start.assoc);
+    let span = order[spanI];
+    // End of span. (But not end of line--that was checked for above.)
+    if (startIndex == span.side(forward, dir)) {
+        span = order[spanI += forward ? 1 : -1];
+        startIndex = span.side(!forward, dir);
     }
-    coordsAt(pos, side) {
-        for (let off = this.length, i = this.children.length - 1;; i--) {
-            let child = this.children[i], start = off - child.breakAfter - child.length;
-            if (pos > start ||
-                (pos == start && child.type != BlockType.WidgetBefore && child.type != BlockType.WidgetAfter &&
-                    (!i || side == 2 || this.children[i - 1].breakAfter ||
-                        (this.children[i - 1].type == BlockType.WidgetBefore && side > -2))))
-                return child.coordsAt(pos - start, side);
-            off = start;
-        }
+    let indexForward = forward == (span.dir == dir);
+    let nextIndex = findClusterBreak(line.text, startIndex, indexForward);
+    movedOver = line.text.slice(Math.min(startIndex, nextIndex), Math.max(startIndex, nextIndex));
+    if (nextIndex != span.side(forward, dir))
+        return EditorSelection.cursor(nextIndex + line.from, indexForward ? -1 : 1, span.level);
+    let nextSpan = spanI == (forward ? order.length - 1 : 0) ? null : order[spanI + (forward ? 1 : -1)];
+    if (!nextSpan && span.level != dir)
+        return EditorSelection.cursor(forward ? line.to : line.from, forward ? -1 : 1, dir);
+    if (nextSpan && nextSpan.level < span.level)
+        return EditorSelection.cursor(nextSpan.side(!forward, dir) + line.from, forward ? 1 : -1, nextSpan.level);
+    return EditorSelection.cursor(nextIndex + line.from, forward ? -1 : 1, span.level);
+}
+
+class DOMReader {
+    constructor(points, view) {
+        this.points = points;
+        this.view = view;
+        this.text = "";
+        this.lineBreak = view.state.lineBreak;
     }
-    measureVisibleLineHeights() {
-        let result = [], { from, to } = this.view.viewState.viewport;
-        let minWidth = Math.max(this.view.scrollDOM.clientWidth, this.minWidth) + 1;
-        for (let pos = 0, i = 0; i < this.children.length; i++) {
-            let child = this.children[i], end = pos + child.length;
-            if (end > to)
+    readRange(start, end) {
+        if (!start)
+            return this;
+        let parent = start.parentNode;
+        for (let cur = start;;) {
+            this.findPointBefore(parent, cur);
+            this.readNode(cur);
+            let next = cur.nextSibling;
+            if (next == end)
                 break;
-            if (pos >= from) {
-                result.push(child.dom.getBoundingClientRect().height);
-                let width = child.dom.scrollWidth;
-                if (width > minWidth) {
-                    this.minWidth = minWidth = width;
-                    this.minWidthFrom = pos;
-                    this.minWidthTo = end;
-                }
-            }
-            pos = end + child.breakAfter;
+            let view = ContentView.get(cur), nextView = ContentView.get(next);
+            if (view && nextView ? view.breakAfter :
+                (view ? view.breakAfter : isBlockElement(cur)) ||
+                    (isBlockElement(next) && (cur.nodeName != "BR" || cur.cmIgnore)))
+                this.text += this.lineBreak;
+            cur = next;
         }
-        return result;
+        this.findPointBefore(parent, end);
+        return this;
     }
-    measureTextSize() {
-        for (let child of this.children) {
-            if (child instanceof LineView) {
-                let measure = child.measureTextSize();
-                if (measure)
-                    return measure;
-            }
+    readNode(node) {
+        if (node.cmIgnore)
+            return;
+        let view = ContentView.get(node);
+        let fromView = view && view.overrideDOMText;
+        let text;
+        if (fromView != null)
+            text = fromView.sliceString(0, undefined, this.lineBreak);
+        else if (node.nodeType == 3)
+            text = node.nodeValue;
+        else if (node.nodeName == "BR")
+            text = node.nextSibling ? this.lineBreak : "";
+        else if (node.nodeType == 1)
+            this.readRange(node.firstChild, null);
+        if (text != null) {
+            this.findPointIn(node, text.length);
+            this.text += text;
+            // Chrome inserts two newlines when pressing shift-enter at the
+            // end of a line. This drops one of those.
+            if (browser.chrome && this.view.inputState.lastKeyCode == 13 && !node.nextSibling && /\n\n$/.test(this.text))
+                this.text = this.text.slice(0, -1);
         }
-        // If no workable line exists, force a layout of a measurable element
-        let dummy = document.createElement("div"), lineHeight, charWidth;
-        dummy.className = "cm-line";
-        dummy.textContent = "abc def ghi jkl mno pqr stu";
-        this.view.observer.ignore(() => {
-            this.dom.appendChild(dummy);
-            let rect = clientRectsFor(dummy.firstChild)[0];
-            lineHeight = dummy.getBoundingClientRect().height;
-            charWidth = rect ? rect.width / 27 : 7;
-            dummy.remove();
-        });
-        return { lineHeight, charWidth };
     }
-    childCursor(pos = this.length) {
-        // Move back to start of last element when possible, so that
-        // `ChildCursor.findPos` doesn't have to deal with the edge case
-        // of being after the last element.
-        let i = this.children.length;
-        if (i)
-            pos -= this.children[--i].length;
-        return new ChildCursor(this.children, pos, i);
+    findPointBefore(node, next) {
+        for (let point of this.points)
+            if (point.node == node && node.childNodes[point.offset] == next)
+                point.pos = this.text.length;
     }
-    computeBlockGapDeco() {
-        let deco = [], vs = this.view.viewState;
-        for (let pos = 0, i = 0;; i++) {
-            let next = i == vs.viewports.length ? null : vs.viewports[i];
-            let end = next ? next.from - 1 : this.length;
-            if (end > pos) {
-                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)
-                break;
-            pos = next.to + 1;
-        }
-        return Decoration.set(deco);
-    }
-    updateDeco() {
-        return this.decorations = [
-            ...this.view.pluginField(PluginField.decorations),
-            ...this.view.state.facet(decorations),
-            this.compositionDeco,
-            this.computeBlockGapDeco(),
-            this.view.viewState.lineGapDeco
-        ];
-    }
-    scrollIntoView({ range, center }) {
-        let rect = this.coordsAt(range.head, range.empty ? range.assoc : range.head > range.anchor ? -1 : 1), other;
-        if (!rect)
-            return;
-        if (!range.empty && (other = this.coordsAt(range.anchor, range.anchor > range.head ? -1 : 1)))
-            rect = { left: Math.min(rect.left, other.left), top: Math.min(rect.top, other.top),
-                right: Math.max(rect.right, other.right), bottom: Math.max(rect.bottom, other.bottom) };
-        let mLeft = 0, mRight = 0, mTop = 0, mBottom = 0;
-        for (let margins of this.view.pluginField(PluginField.scrollMargins))
-            if (margins) {
-                let { left, right, top, bottom } = margins;
-                if (left != null)
-                    mLeft = Math.max(mLeft, left);
-                if (right != null)
-                    mRight = Math.max(mRight, right);
-                if (top != null)
-                    mTop = Math.max(mTop, top);
-                if (bottom != null)
-                    mBottom = Math.max(mBottom, bottom);
-            }
-        scrollRectIntoView(this.view.scrollDOM, {
-            left: rect.left - mLeft, top: rect.top - mTop,
-            right: rect.right + mRight, bottom: rect.bottom + mBottom
-        }, range.head < range.anchor ? -1 : 1, center);
+    findPointIn(node, maxLen) {
+        for (let point of this.points)
+            if (point.node == node)
+                point.pos = this.text.length + Math.min(point.offset, maxLen);
     }
 }
-function betweenUneditable(pos) {
-    return pos.node.nodeType == 1 && pos.node.firstChild &&
-        (pos.offset == 0 || pos.node.childNodes[pos.offset - 1].contentEditable == "false") &&
-        (pos.offset == pos.node.childNodes.length || pos.node.childNodes[pos.offset].contentEditable == "false");
-}
-class BlockGapWidget extends WidgetType {
-    constructor(height) {
-        super();
-        this.height = height;
-    }
-    toDOM() {
-        let elt = document.createElement("div");
-        this.updateDOM(elt);
-        return elt;
-    }
-    eq(other) { return other.height == this.height; }
-    updateDOM(elt) {
-        elt.style.height = this.height + "px";
-        return true;
-    }
-    get estimatedHeight() { return this.height; }
+function isBlockElement(node) {
+    return node.nodeType == 1 && /^(DIV|P|LI|UL|OL|BLOCKQUOTE|DD|DT|H\d|SECTION|PRE)$/.test(node.nodeName);
 }
-function computeCompositionDeco(view, changes) {
-    let sel = view.observer.selectionRange;
-    let textNode = sel.focusNode && nearbyTextNode(sel.focusNode, sel.focusOffset, 0);
-    if (!textNode)
-        return Decoration.none;
-    let cView = view.docView.nearest(textNode);
-    let from, to, topNode = textNode;
-    if (cView instanceof InlineView) {
-        while (cView.parent instanceof InlineView)
-            cView = cView.parent;
-        from = cView.posAtStart;
-        to = from + cView.length;
-        topNode = cView.dom;
-    }
-    else if (cView instanceof LineView) {
-        while (topNode.parentNode != cView.dom)
-            topNode = topNode.parentNode;
-        let prev = topNode.previousSibling;
-        while (prev && !ContentView.get(prev))
-            prev = prev.previousSibling;
-        from = to = prev ? ContentView.get(prev).posAtEnd : cView.posAtStart;
-    }
-    else {
-        return Decoration.none;
-    }
-    let newFrom = changes.mapPos(from, 1), newTo = Math.max(newFrom, changes.mapPos(to, -1));
-    let text = textNode.nodeValue, { state } = view;
-    if (newTo - newFrom < text.length) {
-        if (state.sliceDoc(newFrom, Math.min(state.doc.length, newFrom + text.length)) == text)
-            newTo = newFrom + text.length;
-        else if (state.sliceDoc(Math.max(0, newTo - text.length), newTo) == text)
-            newFrom = newTo - text.length;
-        else
-            return Decoration.none;
-    }
-    else if (state.sliceDoc(newFrom, newTo) != text) {
-        return Decoration.none;
+class DOMPoint {
+    constructor(node, offset) {
+        this.node = node;
+        this.offset = offset;
+        this.pos = -1;
     }
-    return Decoration.set(Decoration.replace({ widget: new CompositionWidget(topNode, textNode) }).range(newFrom, newTo));
 }
-class CompositionWidget extends WidgetType {
-    constructor(top, text) {
+
+class DocView extends ContentView {
+    constructor(view) {
         super();
-        this.top = top;
-        this.text = text;
+        this.view = view;
+        this.compositionDeco = Decoration.none;
+        this.decorations = [];
+        // Track a minimum width for the editor. When measuring sizes in
+        // 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;
+        // Track whether the DOM selection was set in a lossy way, so that
+        // we don't mess it up when reading it back it
+        this.impreciseAnchor = null;
+        this.impreciseHead = null;
+        this.forceSelection = false;
+        // Used by the resize observer to ignore resizes that we caused
+        // ourselves
+        this.lastUpdate = Date.now();
+        this.setDOM(view.contentDOM);
+        this.children = [new LineView];
+        this.children[0].setParent(this);
+        this.updateInner([new ChangedRange(0, 0, 0, view.state.doc.length)], this.updateDeco(), 0);
     }
-    eq(other) { return this.top == other.top && this.text == other.text; }
-    toDOM() { return this.top; }
-    ignoreEvent() { return false; }
-    get customView() { return CompositionView; }
-}
-function nearbyTextNode(node, offset, side) {
-    for (;;) {
-        if (node.nodeType == 3)
-            return node;
-        if (node.nodeType == 1 && offset > 0 && side <= 0) {
-            node = node.childNodes[offset - 1];
-            offset = maxOffset(node);
+    get root() { return this.view.root; }
+    get editorView() { return this.view; }
+    get length() { return this.view.state.doc.length; }
+    // Update the document view to a given state. scrollIntoView can be
+    // used as a hint to compute a new viewport that includes that
+    // position, if we know the editor is going to scroll that position
+    // into view.
+    update(update) {
+        let changedRanges = update.changedRanges;
+        if (this.minWidth > 0 && changedRanges.length) {
+            if (!changedRanges.every(({ fromA, toA }) => toA < this.minWidthFrom || fromA > this.minWidthTo)) {
+                this.minWidth = this.minWidthFrom = this.minWidthTo = 0;
+            }
+            else {
+                this.minWidthFrom = update.changes.mapPos(this.minWidthFrom, 1);
+                this.minWidthTo = update.changes.mapPos(this.minWidthTo, 1);
+            }
         }
-        else if (node.nodeType == 1 && offset < node.childNodes.length && side >= 0) {
-            node = node.childNodes[offset];
-            offset = 0;
+        if (this.view.inputState.composing < 0)
+            this.compositionDeco = Decoration.none;
+        else if (update.transactions.length || this.dirty)
+            this.compositionDeco = computeCompositionDeco(this.view, update.changes);
+        // When the DOM nodes around the selection are moved to another
+        // parent, Chrome sometimes reports a different selection through
+        // getSelection than the one that it actually shows to the user.
+        // This forces a selection update when lines are joined to work
+        // around that. Issue #54
+        if ((browser.ie || browser.chrome) && !this.compositionDeco.size && update &&
+            update.state.doc.lines != update.startState.doc.lines)
+            this.forceSelection = true;
+        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) {
+            return false;
         }
         else {
-            return null;
+            this.updateInner(changedRanges, deco, update.startState.doc.length);
+            if (update.transactions.length)
+                this.lastUpdate = Date.now();
+            return true;
         }
     }
-}
-function nextToUneditable(node, offset) {
-    if (node.nodeType != 1)
-        return 0;
-    return (offset && node.childNodes[offset - 1].contentEditable == "false" ? 1 /* Before */ : 0) |
-        (offset < node.childNodes.length && node.childNodes[offset].contentEditable == "false" ? 2 /* After */ : 0);
-}
-class DecorationComparator$1 {
-    constructor() {
-        this.changes = [];
-    }
-    compareRange(from, to) { addRange(from, to, this.changes); }
-    comparePoint(from, to) { addRange(from, to, this.changes); }
-}
-function findChangedDeco(a, b, diff) {
-    let comp = new DecorationComparator$1;
-    RangeSet.compare(a, b, diff, comp);
-    return comp.changes;
-}
-function inUneditable(node, inside) {
-    for (let cur = node; cur && cur != inside; cur = cur.assignedSlot || cur.parentNode) {
-        if (cur.nodeType == 1 && cur.contentEditable == 'false') {
-            return true;
+    reset(sel) {
+        if (this.dirty) {
+            this.view.observer.ignore(() => this.view.docView.sync());
+            this.dirty = 0 /* Not */;
+            this.updateSelection(true);
+        }
+        else {
+            this.updateSelection();
         }
     }
-    return false;
-}
-
-/**
-Used to indicate [text direction](https://codemirror.net/6/docs/ref/#view.EditorView.textDirection).
-*/
-var Direction = /*@__PURE__*/(function (Direction) {
-    // (These are chosen to match the base levels, in bidi algorithm
-    // terms, of spans in that direction.)
-    /**
-    Left-to-right.
-    */
-    Direction[Direction["LTR"] = 0] = "LTR";
-    /**
-    Right-to-left.
-    */
-    Direction[Direction["RTL"] = 1] = "RTL";
-return Direction})(Direction || (Direction = {}));
-const LTR = Direction.LTR, RTL = Direction.RTL;
-// Decode a string with each type encoded as log2(type)
-function dec(str) {
-    let result = [];
-    for (let i = 0; i < str.length; i++)
-        result.push(1 << +str[i]);
-    return result;
-}
-// Character types for codepoints 0 to 0xf8
-const LowTypes = /*@__PURE__*/dec("88888888888888888888888888888888888666888888787833333333337888888000000000000000000000000008888880000000000000000000000000088888888888888888888888888888888888887866668888088888663380888308888800000000000000000000000800000000000000000000000000000008");
-// Character types for codepoints 0x600 to 0x6f9
-const ArabicTypes = /*@__PURE__*/dec("4444448826627288999999999992222222222222222222222222222222222222222222222229999999999999999999994444444444644222822222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222999999949999999229989999223333333333");
-const Brackets = /*@__PURE__*/Object.create(null), BracketStack = [];
-// There's a lot more in
-// https://www.unicode.org/Public/UCD/latest/ucd/BidiBrackets.txt,
-// which are left out to keep code size down.
-for (let p of ["()", "[]", "{}"]) {
-    let l = /*@__PURE__*/p.charCodeAt(0), r = /*@__PURE__*/p.charCodeAt(1);
-    Brackets[l] = r;
-    Brackets[r] = -l;
-}
-function charType(ch) {
-    return ch <= 0xf7 ? LowTypes[ch] :
-        0x590 <= ch && ch <= 0x5f4 ? 2 /* R */ :
-            0x600 <= ch && ch <= 0x6f9 ? ArabicTypes[ch - 0x600] :
-                0x6ee <= ch && ch <= 0x8ac ? 4 /* AL */ :
-                    0x2000 <= ch && ch <= 0x200b ? 256 /* NI */ :
-                        ch == 0x200c ? 256 /* NI */ : 1 /* L */;
-}
-const BidiRE = /[\u0590-\u05f4\u0600-\u06ff\u0700-\u08ac]/;
-/**
-Represents a contiguous range of text that has a single direction
-(as in left-to-right or right-to-left).
-*/
-class BidiSpan {
-    /**
-    @internal
-    */
-    constructor(
-    /**
-    The start of the span (relative to the start of the line).
-    */
-    from, 
-    /**
-    The end of the span.
-    */
-    to, 
-    /**
-    The ["bidi
-    level"](https://unicode.org/reports/tr9/#Basic_Display_Algorithm)
-    of the span (in this context, 0 means
-    left-to-right, 1 means right-to-left, 2 means left-to-right
-    number inside right-to-left text).
-    */
-    level) {
-        this.from = from;
-        this.to = to;
-        this.level = level;
+    // 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(() => {
+            // Lock the height during redrawing, since Chrome sometimes
+            // 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.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
+            // selection from the one it displays (issue #218). This tries
+            // to detect that situation.
+            let track = browser.chrome || browser.ios ? { node: observer.selectionRange.focusNode, written: false } : undefined;
+            this.sync(track);
+            this.dirty = 0 /* Not */;
+            if (track && (track.written || observer.selectionRange.focusNode != track.node))
+                this.forceSelection = true;
+            this.dom.style.height = "";
+        });
+        let gaps = [];
+        if (this.view.viewport.from || this.view.viewport.to < this.view.state.doc.length)
+            for (let child of this.children)
+                if (child instanceof BlockWidgetView && child.widget instanceof BlockGapWidget)
+                    gaps.push(child.dom);
+        observer.updateGaps(gaps);
     }
-    /**
-    The direction of this span.
-    */
-    get dir() { return this.level % 2 ? RTL : LTR; }
-    /**
-    @internal
-    */
-    side(end, dir) { return (this.dir == dir) == end ? this.to : this.from; }
-    /**
-    @internal
-    */
-    static find(order, index, level, assoc) {
-        let maybe = -1;
-        for (let i = 0; i < order.length; i++) {
-            let span = order[i];
-            if (span.from <= index && span.to >= index) {
-                if (span.level == level)
-                    return i;
-                // When multiple spans match, if assoc != 0, take the one that
-                // covers that side, otherwise take the one with the minimum
-                // level.
-                if (maybe < 0 || (assoc != 0 ? (assoc < 0 ? span.from < index : span.to > index) : order[maybe].level > span.level))
-                    maybe = i;
-            }
+    updateChildren(changes, deco, oldLength) {
+        let cursor = this.childCursor(oldLength);
+        for (let i = changes.length - 1;; i--) {
+            let next = i >= 0 ? changes[i] : null;
+            if (!next)
+                break;
+            let { fromA, toA, fromB, toB } = next;
+            let { content, breakAtStart, openStart, openEnd } = ContentBuilder.build(this.view.state.doc, fromB, toB, deco);
+            let { i: toI, off: toOff } = cursor.findPos(toA, 1);
+            let { i: fromI, off: fromOff } = cursor.findPos(fromA, -1);
+            replaceRange(this, fromI, fromOff, toI, toOff, content, breakAtStart, openStart, openEnd);
         }
-        if (maybe < 0)
-            throw new RangeError("Index out of range");
-        return maybe;
     }
-}
-// Reused array of character types
-const types = [];
-function computeOrder(line, direction) {
-    let len = line.length, outerType = direction == LTR ? 1 /* L */ : 2 /* R */, oppositeType = direction == LTR ? 2 /* R */ : 1 /* L */;
-    if (!line || outerType == 1 /* L */ && !BidiRE.test(line))
-        return trivialOrder(len);
-    // W1. Examine each non-spacing mark (NSM) in the level run, and
-    // change the type of the NSM to the type of the previous
-    // character. If the NSM is at the start of the level run, it will
-    // get the type of sor.
-    // W2. Search backwards from each instance of a European number
-    // until the first strong type (R, L, AL, or sor) is found. If an
-    // AL is found, change the type of the European number to Arabic
-    // number.
-    // W3. Change all ALs to R.
-    // (Left after this: L, R, EN, AN, ET, CS, NI)
-    for (let i = 0, prev = outerType, prevStrong = outerType; i < len; i++) {
-        let type = charType(line.charCodeAt(i));
-        if (type == 512 /* NSM */)
-            type = prev;
-        else if (type == 8 /* EN */ && prevStrong == 4 /* AL */)
-            type = 16 /* AN */;
-        types[i] = type == 4 /* AL */ ? 2 /* R */ : type;
-        if (type & 7 /* Strong */)
-            prevStrong = type;
-        prev = type;
+    // Sync the DOM selection to this.state.selection
+    updateSelection(mustRead = false, fromPointer = false) {
+        if (mustRead)
+            this.view.observer.readSelectionRange();
+        if (!(fromPointer || this.mayControlSelection()) ||
+            browser.ios && this.view.inputState.rapidCompositionStart)
+            return;
+        let force = this.forceSelection;
+        this.forceSelection = false;
+        let main = this.view.state.selection.main;
+        // FIXME need to handle the case where the selection falls inside a block range
+        let anchor = this.domAtPos(main.anchor);
+        let head = main.empty ? anchor : this.domAtPos(main.head);
+        // Always reset on Firefox when next to an uneditable node to
+        // avoid invisible cursor bugs (#111)
+        if (browser.gecko && main.empty && betweenUneditable(anchor)) {
+            let dummy = document.createTextNode("");
+            this.view.observer.ignore(() => anchor.node.insertBefore(dummy, anchor.node.childNodes[anchor.offset] || null));
+            anchor = head = new DOMPos(dummy, 0);
+            force = true;
+        }
+        let domSel = this.view.observer.selectionRange;
+        // If the selection is already here, or in an equivalent position, don't touch it
+        if (force || !domSel.focusNode ||
+            !isEquivalentPosition(anchor.node, anchor.offset, domSel.anchorNode, domSel.anchorOffset) ||
+            !isEquivalentPosition(head.node, head.offset, domSel.focusNode, domSel.focusOffset)) {
+            this.view.observer.ignore(() => {
+                // Chrome Android will hide the virtual keyboard when tapping
+                // inside an uneditable node, and not bring it back when we
+                // move the cursor to its proper position. This tries to
+                // restore the keyboard by cycling focus.
+                if (browser.android && browser.chrome && this.dom.contains(domSel.focusNode) && inUneditable(domSel.focusNode, this.dom)) {
+                    this.dom.blur();
+                    this.dom.focus({ preventScroll: true });
+                }
+                let rawSel = getSelection(this.root);
+                if (main.empty) {
+                    // Work around https://bugzilla.mozilla.org/show_bug.cgi?id=1612076
+                    if (browser.gecko) {
+                        let nextTo = nextToUneditable(anchor.node, anchor.offset);
+                        if (nextTo && nextTo != (1 /* Before */ | 2 /* After */)) {
+                            let text = nearbyTextNode(anchor.node, anchor.offset, nextTo == 1 /* Before */ ? 1 : -1);
+                            if (text)
+                                anchor = new DOMPos(text, nextTo == 1 /* Before */ ? 0 : text.nodeValue.length);
+                        }
+                    }
+                    rawSel.collapse(anchor.node, anchor.offset);
+                    if (main.bidiLevel != null && domSel.cursorBidiLevel != null)
+                        domSel.cursorBidiLevel = main.bidiLevel;
+                }
+                else if (rawSel.extend) {
+                    // Selection.extend can be used to create an 'inverted' selection
+                    // (one where the focus is before the anchor), but not all
+                    // browsers support it yet.
+                    rawSel.collapse(anchor.node, anchor.offset);
+                    rawSel.extend(head.node, head.offset);
+                }
+                else {
+                    // Primitive (IE) way
+                    let range = document.createRange();
+                    if (main.anchor > main.head)
+                        [anchor, head] = [head, anchor];
+                    range.setEnd(head.node, head.offset);
+                    range.setStart(anchor.node, anchor.offset);
+                    rawSel.removeAllRanges();
+                    rawSel.addRange(range);
+                }
+            });
+            this.view.observer.setSelectionRange(anchor, head);
+        }
+        this.impreciseAnchor = anchor.precise ? null : new DOMPos(domSel.anchorNode, domSel.anchorOffset);
+        this.impreciseHead = head.precise ? null : new DOMPos(domSel.focusNode, domSel.focusOffset);
+    }
+    enforceCursorAssoc() {
+        if (this.compositionDeco.size)
+            return;
+        let cursor = this.view.state.selection.main;
+        let sel = getSelection(this.root);
+        if (!cursor.empty || !cursor.assoc || !sel.modify)
+            return;
+        let line = LineView.find(this, cursor.head);
+        if (!line)
+            return;
+        let lineStart = line.posAtStart;
+        if (cursor.head == lineStart || cursor.head == lineStart + line.length)
+            return;
+        let before = this.coordsAt(cursor.head, -1), after = this.coordsAt(cursor.head, 1);
+        if (!before || !after || before.bottom > after.top)
+            return;
+        let dom = this.domAtPos(cursor.head + cursor.assoc);
+        sel.collapse(dom.node, dom.offset);
+        sel.modify("move", cursor.assoc < 0 ? "forward" : "backward", "lineboundary");
     }
-    // W5. A sequence of European terminators adjacent to European
-    // numbers changes to all European numbers.
-    // W6. Otherwise, separators and terminators change to Other
-    // Neutral.
-    // W7. Search backwards from each instance of a European number
-    // until the first strong type (R, L, or sor) is found. If an L is
-    // found, then change the type of the European number to L.
-    // (Left after this: L, R, EN+AN, NI)
-    for (let i = 0, prev = outerType, prevStrong = outerType; i < len; i++) {
-        let type = types[i];
-        if (type == 128 /* CS */) {
-            if (i < len - 1 && prev == types[i + 1] && (prev & 24 /* Num */))
-                type = types[i] = prev;
-            else
-                types[i] = 256 /* NI */;
+    mayControlSelection() {
+        return this.view.state.facet(editable) ? this.root.activeElement == this.dom
+            : hasSelection(this.dom, this.view.observer.selectionRange);
+    }
+    nearest(dom) {
+        for (let cur = dom; cur;) {
+            let domView = ContentView.get(cur);
+            if (domView && domView.rootView == this)
+                return domView;
+            cur = cur.parentNode;
         }
-        else if (type == 64 /* ET */) {
-            let end = i + 1;
-            while (end < len && types[end] == 64 /* ET */)
-                end++;
-            let replace = (i && prev == 8 /* EN */) || (end < len && types[end] == 8 /* EN */) ? (prevStrong == 1 /* L */ ? 1 /* L */ : 8 /* EN */) : 256 /* NI */;
-            for (let j = i; j < end; j++)
-                types[j] = replace;
-            i = end - 1;
+        return null;
+    }
+    posFromDOM(node, offset) {
+        let view = this.nearest(node);
+        if (!view)
+            throw new RangeError("Trying to find position for a DOM position outside of the document");
+        return view.localPosFromDOM(node, offset) + view.posAtStart;
+    }
+    domAtPos(pos) {
+        let { i, off } = this.childCursor().findPos(pos, -1);
+        for (; i < this.children.length - 1;) {
+            let child = this.children[i];
+            if (off < child.length || child instanceof LineView)
+                break;
+            i++;
+            off = 0;
         }
-        else if (type == 8 /* EN */ && prevStrong == 1 /* L */) {
-            types[i] = 1 /* L */;
+        return this.children[i].domAtPos(off);
+    }
+    coordsAt(pos, side) {
+        for (let off = this.length, i = this.children.length - 1;; i--) {
+            let child = this.children[i], start = off - child.breakAfter - child.length;
+            if (pos > start ||
+                (pos == start && child.type != BlockType.WidgetBefore && child.type != BlockType.WidgetAfter &&
+                    (!i || side == 2 || this.children[i - 1].breakAfter ||
+                        (this.children[i - 1].type == BlockType.WidgetBefore && side > -2))))
+                return child.coordsAt(pos - start, side);
+            off = start;
         }
-        prev = type;
-        if (type & 7 /* Strong */)
-            prevStrong = type;
     }
-    // N0. Process bracket pairs in an isolating run sequence
-    // sequentially in the logical order of the text positions of the
-    // opening paired brackets using the logic given below. Within this
-    // scope, bidirectional types EN and AN are treated as R.
-    for (let i = 0, sI = 0, context = 0, ch, br, type; i < len; i++) {
-        // Keeps [startIndex, type, strongSeen] triples for each open
-        // bracket on BracketStack.
-        if (br = Brackets[ch = line.charCodeAt(i)]) {
-            if (br < 0) { // Closing bracket
-                for (let sJ = sI - 3; sJ >= 0; sJ -= 3) {
-                    if (BracketStack[sJ + 1] == -br) {
-                        let flags = BracketStack[sJ + 2];
-                        let type = (flags & 2 /* EmbedInside */) ? outerType :
-                            !(flags & 4 /* OppositeInside */) ? 0 :
-                                (flags & 1 /* OppositeBefore */) ? oppositeType : outerType;
-                        if (type)
-                            types[i] = types[BracketStack[sJ]] = type;
-                        sI = sJ;
-                        break;
+    measureVisibleLineHeights() {
+        let result = [], { from, to } = this.view.viewState.viewport;
+        let contentWidth = this.view.contentDOM.clientWidth;
+        let isWider = contentWidth > Math.max(this.view.scrollDOM.clientWidth, this.minWidth) + 1;
+        let widest = -1;
+        for (let pos = 0, i = 0; i < this.children.length; i++) {
+            let child = this.children[i], end = pos + child.length;
+            if (end > to)
+                break;
+            if (pos >= from) {
+                let childRect = child.dom.getBoundingClientRect();
+                result.push(childRect.height);
+                if (isWider) {
+                    let last = child.dom.lastChild;
+                    let rects = last ? clientRectsFor(last) : [];
+                    if (rects.length) {
+                        let rect = rects[rects.length - 1];
+                        let width = this.view.textDirection == Direction.LTR ? rect.right - childRect.left
+                            : childRect.right - rect.left;
+                        if (width > widest) {
+                            widest = width;
+                            this.minWidth = contentWidth;
+                            this.minWidthFrom = pos;
+                            this.minWidthTo = end;
+                        }
                     }
                 }
             }
-            else if (BracketStack.length == 189 /* MaxDepth */) {
-                break;
-            }
-            else {
-                BracketStack[sI++] = i;
-                BracketStack[sI++] = ch;
-                BracketStack[sI++] = context;
-            }
+            pos = end + child.breakAfter;
         }
-        else if ((type = types[i]) == 2 /* R */ || type == 1 /* L */) {
-            let embed = type == outerType;
-            context = embed ? 0 : 1 /* OppositeBefore */;
-            for (let sJ = sI - 3; sJ >= 0; sJ -= 3) {
-                let cur = BracketStack[sJ + 2];
-                if (cur & 2 /* EmbedInside */)
-                    break;
-                if (embed) {
-                    BracketStack[sJ + 2] |= 2 /* EmbedInside */;
-                }
-                else {
-                    if (cur & 4 /* OppositeInside */)
-                        break;
-                    BracketStack[sJ + 2] |= 4 /* OppositeInside */;
-                }
+        return result;
+    }
+    measureTextSize() {
+        for (let child of this.children) {
+            if (child instanceof LineView) {
+                let measure = child.measureTextSize();
+                if (measure)
+                    return measure;
             }
         }
+        // If no workable line exists, force a layout of a measurable element
+        let dummy = document.createElement("div"), lineHeight, charWidth;
+        dummy.className = "cm-line";
+        dummy.textContent = "abc def ghi jkl mno pqr stu";
+        this.view.observer.ignore(() => {
+            this.dom.appendChild(dummy);
+            let rect = clientRectsFor(dummy.firstChild)[0];
+            lineHeight = dummy.getBoundingClientRect().height;
+            charWidth = rect ? rect.width / 27 : 7;
+            dummy.remove();
+        });
+        return { lineHeight, charWidth };
     }
-    // N1. A sequence of neutrals takes the direction of the
-    // surrounding strong text if the text on both sides has the same
-    // direction. European and Arabic numbers act as if they were R in
-    // terms of their influence on neutrals. Start-of-level-run (sor)
-    // and end-of-level-run (eor) are used at level run boundaries.
-    // N2. Any remaining neutrals take the embedding direction.
-    // (Left after this: L, R, EN+AN)
-    for (let i = 0; i < len; i++) {
-        if (types[i] == 256 /* NI */) {
-            let end = i + 1;
-            while (end < len && types[end] == 256 /* NI */)
-                end++;
-            let beforeL = (i ? types[i - 1] : outerType) == 1 /* L */;
-            let afterL = (end < len ? types[end] : outerType) == 1 /* L */;
-            let replace = beforeL == afterL ? (beforeL ? 1 /* L */ : 2 /* R */) : outerType;
-            for (let j = i; j < end; j++)
-                types[j] = replace;
-            i = end - 1;
-        }
+    childCursor(pos = this.length) {
+        // Move back to start of last element when possible, so that
+        // `ChildCursor.findPos` doesn't have to deal with the edge case
+        // of being after the last element.
+        let i = this.children.length;
+        if (i)
+            pos -= this.children[--i].length;
+        return new ChildCursor(this.children, pos, i);
     }
-    // Here we depart from the documented algorithm, in order to avoid
-    // building up an actual levels array. Since there are only three
-    // levels (0, 1, 2) in an implementation that doesn't take
-    // explicit embedding into account, we can build up the order on
-    // the fly, without following the level-based algorithm.
-    let order = [];
-    if (outerType == 1 /* L */) {
-        for (let i = 0; i < len;) {
-            let start = i, rtl = types[i++] != 1 /* L */;
-            while (i < len && rtl == (types[i] != 1 /* L */))
-                i++;
-            if (rtl) {
-                for (let j = i; j > start;) {
-                    let end = j, l = types[--j] != 2 /* R */;
-                    while (j > start && l == (types[j - 1] != 2 /* R */))
-                        j--;
-                    order.push(new BidiSpan(j, end, l ? 2 : 1));
-                }
+    computeBlockGapDeco() {
+        let deco = [], vs = this.view.viewState;
+        for (let pos = 0, i = 0;; i++) {
+            let next = i == vs.viewports.length ? null : vs.viewports[i];
+            let end = next ? next.from - 1 : this.length;
+            if (end > pos) {
+                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));
             }
-            else {
-                order.push(new BidiSpan(start, i, 0));
+            if (!next)
+                break;
+            pos = next.to + 1;
+        }
+        return Decoration.set(deco);
+    }
+    updateDeco() {
+        return this.decorations = [
+            ...this.view.pluginField(PluginField.decorations),
+            ...this.view.state.facet(decorations),
+            this.compositionDeco,
+            this.computeBlockGapDeco(),
+            this.view.viewState.lineGapDeco
+        ];
+    }
+    scrollIntoView({ range, center }) {
+        let rect = this.coordsAt(range.head, range.empty ? range.assoc : range.head > range.anchor ? -1 : 1), other;
+        if (!rect)
+            return;
+        if (!range.empty && (other = this.coordsAt(range.anchor, range.anchor > range.head ? -1 : 1)))
+            rect = { left: Math.min(rect.left, other.left), top: Math.min(rect.top, other.top),
+                right: Math.max(rect.right, other.right), bottom: Math.max(rect.bottom, other.bottom) };
+        let mLeft = 0, mRight = 0, mTop = 0, mBottom = 0;
+        for (let margins of this.view.pluginField(PluginField.scrollMargins))
+            if (margins) {
+                let { left, right, top, bottom } = margins;
+                if (left != null)
+                    mLeft = Math.max(mLeft, left);
+                if (right != null)
+                    mRight = Math.max(mRight, right);
+                if (top != null)
+                    mTop = Math.max(mTop, top);
+                if (bottom != null)
+                    mBottom = Math.max(mBottom, bottom);
             }
-        }
+        scrollRectIntoView(this.view.scrollDOM, {
+            left: rect.left - mLeft, top: rect.top - mTop,
+            right: rect.right + mRight, bottom: rect.bottom + mBottom
+        }, range.head < range.anchor ? -1 : 1, center);
+    }
+}
+function betweenUneditable(pos) {
+    return pos.node.nodeType == 1 && pos.node.firstChild &&
+        (pos.offset == 0 || pos.node.childNodes[pos.offset - 1].contentEditable == "false") &&
+        (pos.offset == pos.node.childNodes.length || pos.node.childNodes[pos.offset].contentEditable == "false");
+}
+class BlockGapWidget extends WidgetType {
+    constructor(height) {
+        super();
+        this.height = height;
+    }
+    toDOM() {
+        let elt = document.createElement("div");
+        this.updateDOM(elt);
+        return elt;
+    }
+    eq(other) { return other.height == this.height; }
+    updateDOM(elt) {
+        elt.style.height = this.height + "px";
+        return true;
+    }
+    get estimatedHeight() { return this.height; }
+}
+function computeCompositionDeco(view, changes) {
+    let sel = view.observer.selectionRange;
+    let textNode = sel.focusNode && nearbyTextNode(sel.focusNode, sel.focusOffset, 0);
+    if (!textNode)
+        return Decoration.none;
+    let cView = view.docView.nearest(textNode);
+    if (!cView)
+        return Decoration.none;
+    let from, to, topNode = textNode;
+    if (cView instanceof LineView) {
+        while (topNode.parentNode != cView.dom)
+            topNode = topNode.parentNode;
+        let prev = topNode.previousSibling;
+        while (prev && !ContentView.get(prev))
+            prev = prev.previousSibling;
+        from = to = prev ? ContentView.get(prev).posAtEnd : cView.posAtStart;
     }
     else {
-        for (let i = 0; i < len;) {
-            let start = i, rtl = types[i++] == 2 /* R */;
-            while (i < len && rtl == (types[i] == 2 /* R */))
-                i++;
-            order.push(new BidiSpan(start, i, rtl ? 1 : 2));
+        for (;;) {
+            let { parent } = cView;
+            if (!parent)
+                return Decoration.none;
+            if (parent instanceof LineView)
+                break;
+            cView = parent;
         }
+        from = cView.posAtStart;
+        to = from + cView.length;
+        topNode = cView.dom;
     }
-    return order;
+    let newFrom = changes.mapPos(from, 1), newTo = Math.max(newFrom, changes.mapPos(to, -1));
+    let { state } = view, text = topNode.nodeType == 3 ? topNode.nodeValue :
+        new DOMReader([], view).readRange(topNode.firstChild, null).text;
+    if (newTo - newFrom < text.length) {
+        if (state.sliceDoc(newFrom, Math.min(state.doc.length, newFrom + text.length)) == text)
+            newTo = newFrom + text.length;
+        else if (state.sliceDoc(Math.max(0, newTo - text.length), newTo) == text)
+            newFrom = newTo - text.length;
+        else
+            return Decoration.none;
+    }
+    else if (state.sliceDoc(newFrom, newTo) != text) {
+        return Decoration.none;
+    }
+    return Decoration.set(Decoration.replace({ widget: new CompositionWidget(topNode, textNode) }).range(newFrom, newTo));
 }
-function trivialOrder(length) {
-    return [new BidiSpan(0, length, 0)];
+class CompositionWidget extends WidgetType {
+    constructor(top, text) {
+        super();
+        this.top = top;
+        this.text = text;
+    }
+    eq(other) { return this.top == other.top && this.text == other.text; }
+    toDOM() { return this.top; }
+    ignoreEvent() { return false; }
+    get customView() { return CompositionView; }
 }
-let movedOver = "";
-function moveVisually(line, order, dir, start, forward) {
-    var _a;
-    let startIndex = start.head - line.from, spanI = -1;
-    if (startIndex == 0) {
-        if (!forward || !line.length)
-            return null;
-        if (order[0].level != dir) {
-            startIndex = order[0].side(false, dir);
-            spanI = 0;
+function nearbyTextNode(node, offset, side) {
+    for (;;) {
+        if (node.nodeType == 3)
+            return node;
+        if (node.nodeType == 1 && offset > 0 && side <= 0) {
+            node = node.childNodes[offset - 1];
+            offset = maxOffset(node);
         }
-    }
-    else if (startIndex == line.length) {
-        if (forward)
+        else if (node.nodeType == 1 && offset < node.childNodes.length && side >= 0) {
+            node = node.childNodes[offset];
+            offset = 0;
+        }
+        else {
             return null;
-        let last = order[order.length - 1];
-        if (last.level != dir) {
-            startIndex = last.side(true, dir);
-            spanI = order.length - 1;
         }
     }
-    if (spanI < 0)
-        spanI = BidiSpan.find(order, startIndex, (_a = start.bidiLevel) !== null && _a !== void 0 ? _a : -1, start.assoc);
-    let span = order[spanI];
-    // End of span. (But not end of line--that was checked for above.)
-    if (startIndex == span.side(forward, dir)) {
-        span = order[spanI += forward ? 1 : -1];
-        startIndex = span.side(!forward, dir);
+}
+function nextToUneditable(node, offset) {
+    if (node.nodeType != 1)
+        return 0;
+    return (offset && node.childNodes[offset - 1].contentEditable == "false" ? 1 /* Before */ : 0) |
+        (offset < node.childNodes.length && node.childNodes[offset].contentEditable == "false" ? 2 /* After */ : 0);
+}
+class DecorationComparator$1 {
+    constructor() {
+        this.changes = [];
     }
-    let indexForward = forward == (span.dir == dir);
-    let nextIndex = findClusterBreak(line.text, startIndex, indexForward);
-    movedOver = line.text.slice(Math.min(startIndex, nextIndex), Math.max(startIndex, nextIndex));
-    if (nextIndex != span.side(forward, dir))
-        return EditorSelection.cursor(nextIndex + line.from, indexForward ? -1 : 1, span.level);
-    let nextSpan = spanI == (forward ? order.length - 1 : 0) ? null : order[spanI + (forward ? 1 : -1)];
-    if (!nextSpan && span.level != dir)
-        return EditorSelection.cursor(forward ? line.to : line.from, forward ? -1 : 1, dir);
-    if (nextSpan && nextSpan.level < span.level)
-        return EditorSelection.cursor(nextSpan.side(!forward, dir) + line.from, forward ? 1 : -1, nextSpan.level);
-    return EditorSelection.cursor(nextIndex + line.from, forward ? -1 : 1, span.level);
+    compareRange(from, to) { addRange(from, to, this.changes); }
+    comparePoint(from, to) { addRange(from, to, this.changes); }
+}
+function findChangedDeco(a, b, diff) {
+    let comp = new DecorationComparator$1;
+    RangeSet.compare(a, b, diff, comp);
+    return comp.changes;
+}
+function inUneditable(node, inside) {
+    for (let cur = node; cur && cur != inside; cur = cur.assignedSlot || cur.parentNode) {
+        if (cur.nodeType == 1 && cur.contentEditable == 'false') {
+            return true;
+        }
+    }
+    return false;
 }
 
 function groupAt(state, pos, bias = 1) {
@@ -2903,21 +2951,29 @@ function domPosInText(node, x, y) {
 function posAtCoords(view, { x, y }, precise, bias = -1) {
     var _a;
     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;;) {
+    let block, yOffset = y - docTop, { docHeight } = view.viewState;
+    if (yOffset < 0 || yOffset > docHeight) {
+        if (precise)
+            return null;
+        yOffset = yOffset < 0 ? 0 : docHeight;
+    }
+    // Scan for a text block near the queried y position
+    for (let halfLine = view.defaultLineHeight / 2, bounced = false;;) {
         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 (block.type == BlockType.Text)
+            break;
+        for (;;) {
+            // Move the y position out of this block
+            yOffset = bias > 0 ? block.bottom + halfLine : block.top - halfLine;
+            if (yOffset >= 0 && yOffset <= docHeight)
+                break;
+            // If the document consists entirely of replaced widgets, we
+            // won't find a text block, so return 0
             if (bounced)
                 return precise ? null : 0;
-            else
-                bounced = true;
+            bounced = true;
+            bias = -bias;
         }
-        if (block.type == BlockType.Text)
-            break;
-        yOffset = bias > 0 ? block.bottom + halfLine : block.top - halfLine;
     }
     y = docTop + yOffset;
     let lineStart = block.from;
@@ -3258,10 +3314,10 @@ class InputState {
         return (event.type == "keydown" && event.keyCode != 229) ||
             event.type == "compositionend" && !browser.ios;
     }
-    startMouseSelection(view, event, style) {
+    startMouseSelection(mouseSelection) {
         if (this.mouseSelection)
             this.mouseSelection.destroy();
-        this.mouseSelection = new MouseSelection(this, view, event, style);
+        this.mouseSelection = mouseSelection;
     }
     update(update) {
         if (this.mouseSelection)
@@ -3282,10 +3338,10 @@ const PendingKeys = [
 // Key codes for modifier keys
 const modifierCodes = [16, 17, 18, 20, 91, 92, 224, 225];
 class MouseSelection {
-    constructor(inputState, view, startEvent, style) {
-        this.inputState = inputState;
+    constructor(view, startEvent, style, mustSelect) {
         this.view = view;
         this.style = style;
+        this.mustSelect = mustSelect;
         this.lastEvent = startEvent;
         let doc = view.contentDOM.ownerDocument;
         doc.addEventListener("mousemove", this.move = this.move.bind(this));
@@ -3319,16 +3375,18 @@ class MouseSelection {
         let doc = this.view.contentDOM.ownerDocument;
         doc.removeEventListener("mousemove", this.move);
         doc.removeEventListener("mouseup", this.up);
-        this.inputState.mouseSelection = null;
+        this.view.inputState.mouseSelection = null;
     }
     select(event) {
         let selection = this.style.get(event, this.extend, this.multiple);
-        if (!selection.eq(this.view.state.selection) || selection.main.assoc != this.view.state.selection.main.assoc)
+        if (this.mustSelect || !selection.eq(this.view.state.selection) ||
+            selection.main.assoc != this.view.state.selection.main.assoc)
             this.view.dispatch({
                 selection,
                 userEvent: "select.pointer",
                 scrollIntoView: true
             });
+        this.mustSelect = false;
     }
     update(update) {
         if (update.docChanged && this.dragging)
@@ -3447,9 +3505,10 @@ handlers.mousedown = (view, event) => {
     if (!style && event.button == 0)
         style = basicMouseSelection(view, event);
     if (style) {
-        if (view.root.activeElement != view.contentDOM)
+        let mustFocus = view.root.activeElement != view.contentDOM;
+        if (mustFocus)
             view.observer.ignore(() => focusPreventScroll(view.contentDOM));
-        view.inputState.startMouseSelection(view, event, style);
+        view.inputState.startMouseSelection(new MouseSelection(view, event, style, mustFocus));
     }
 };
 function rangeForClick(view, pos, bias, type) {
@@ -4164,12 +4223,12 @@ class HeightMapBranch extends HeightMap {
     get break() { return this.flags & 1 /* Break */; }
     blockAt(height, doc, top, offset) {
         let mid = top + this.left.height;
-        return height < mid || this.right.height == 0 ? this.left.blockAt(height, doc, top, offset)
+        return height < mid ? this.left.blockAt(height, doc, top, offset)
             : this.right.blockAt(height, doc, mid, offset + this.left.length + this.break);
     }
     lineAt(value, type, doc, top, offset) {
         let rightTop = top + this.left.height, rightOffset = offset + this.left.length + this.break;
-        let left = type == QueryType.ByHeight ? value < rightTop || this.right.height == 0 : value < rightOffset;
+        let left = type == QueryType.ByHeight ? value < rightTop : value < rightOffset;
         let base = left ? this.left.lineAt(value, type, doc, top, offset)
             : this.right.lineAt(value, type, doc, rightTop, rightOffset);
         if (this.break || (left ? base.to < rightOffset : base.from > rightOffset))
@@ -4310,7 +4369,9 @@ class NodeBuilder {
     }
     point(from, to, deco) {
         if (from < to || deco.heightRelevant) {
-            let height = deco.widget ? Math.max(0, deco.widget.estimatedHeight) : 0;
+            let height = deco.widget ? deco.widget.estimatedHeight : 0;
+            if (height < 0)
+                height = this.oracle.lineHeight;
             let len = to - from;
             if (deco.block) {
                 this.addBlock(new HeightMapBlock(len, height, deco.type));
@@ -4438,8 +4499,8 @@ function visiblePixelRange(dom, paddingTop) {
             break;
         }
     }
-    return { left: left - rect.left, right: right - rect.left,
-        top: top - (rect.top + paddingTop), bottom: bottom - (rect.top + paddingTop) };
+    return { left: left - rect.left, right: Math.max(left, right) - rect.left,
+        top: top - (rect.top + paddingTop), bottom: Math.max(top, bottom) - (rect.top + paddingTop) };
 }
 // Line gaps are placeholder widgets used to hide pieces of overlong
 // lines within the viewport, as a kludge to keep the editor
@@ -4666,7 +4727,7 @@ class ViewState {
         let viewport = new Viewport(map.lineAt(visibleTop - marginTop * 1000 /* Margin */, QueryType.ByHeight, doc, 0, 0).from, map.lineAt(visibleBottom + (1 - marginTop) * 1000 /* Margin */, QueryType.ByHeight, doc, 0, 0).to);
         // If scrollTarget is given, make sure the viewport includes that position
         if (scrollTarget) {
-            let { head } = scrollTarget.range, viewHeight = visibleBottom - visibleTop;
+            let { head } = scrollTarget.range, viewHeight = this.editorHeight;
             if (head < viewport.from || head > viewport.to) {
                 let block = map.lineAt(head, QueryType.ByPos, doc, 0, 0), topPos;
                 if (scrollTarget.center)
@@ -4687,6 +4748,8 @@ class ViewState {
     // Checks if a given viewport covers the visible part of the
     // document and not too much beyond that.
     viewportIsAppropriate({ from, to }, bias = 0) {
+        if (!this.inView)
+            return true;
         let { top } = this.heightMap.lineAt(from, QueryType.ByPos, this.state.doc, 0, 0);
         let { bottom } = this.heightMap.lineAt(to, QueryType.ByPos, this.state.doc, 0, 0);
         let { visibleTop, visibleBottom } = this;
@@ -4793,8 +4856,11 @@ class ViewState {
     elementAtHeight(height) {
         return scaleBlock(this.heightMap.blockAt(this.scaler.fromDOM(height), this.state.doc, 0, 0), this.scaler);
     }
+    get docHeight() {
+        return this.scaler.toDOM(this.heightMap.height);
+    }
     get contentHeight() {
-        return this.scaler.toDOM(this.heightMap.height) + this.paddingTop + this.paddingBottom;
+        return this.docHeight + this.paddingTop + this.paddingBottom;
     }
 }
 class Viewport {
@@ -5048,7 +5114,8 @@ const baseTheme = /*@__PURE__*/buildTheme("." + baseThemeID, {
     },
     ".cm-placeholder": {
         color: "#888",
-        display: "inline-block"
+        display: "inline-block",
+        verticalAlign: "top",
     },
     ".cm-button": {
         verticalAlign: "middle",
@@ -5346,7 +5413,7 @@ class DOMObserver {
         this.onChange(from, to, typeOver);
         // The view wasn't updated
         if (this.view.state == startState)
-            this.view.docView.reset(newSel);
+            this.view.update([]);
     }
     readMutation(rec) {
         let cView = this.view.docView.nearest(rec.target);
@@ -5477,11 +5544,22 @@ function applyDOMChange(view, start, end, typeOver) {
         };
     if (change) {
         let startState = view.state;
+        if (browser.ios && view.inputState.flushIOSKey(view))
+            return;
         // Android browsers don't fire reasonable key events for enter,
         // backspace, or delete. So this detects changes that look like
         // they're caused by those keys, and reinterprets them as key
-        // events.
-        if (browser.ios && view.inputState.flushIOSKey(view))
+        // events. (Some of these keys are also handled by beforeinput
+        // events and the pendingAndroidKey mechanism, but that's not
+        // reliable in all situations.)
+        if (browser.android &&
+            ((change.from == sel.from && change.to == sel.to &&
+                change.insert.length == 1 && change.insert.lines == 2 &&
+                dispatchKey(view.contentDOM, "Enter", 13)) ||
+                (change.from == sel.from - 1 && change.to == sel.to && change.insert.length == 0 &&
+                    dispatchKey(view.contentDOM, "Backspace", 8)) ||
+                (change.from == sel.from && change.to == sel.to + 1 && change.insert.length == 0 &&
+                    dispatchKey(view.contentDOM, "Delete", 46))))
             return;
         let text = change.insert.toString();
         if (view.state.facet(inputHandler).some(h => h(view, change.from, change.to, text)))
@@ -5554,76 +5632,6 @@ function findDiff(a, b, preferredPos, preferredSide) {
     }
     return { from, toA, toB };
 }
-class DOMReader {
-    constructor(points, view) {
-        this.points = points;
-        this.view = view;
-        this.text = "";
-        this.lineBreak = view.state.lineBreak;
-    }
-    readRange(start, end) {
-        if (!start)
-            return;
-        let parent = start.parentNode;
-        for (let cur = start;;) {
-            this.findPointBefore(parent, cur);
-            this.readNode(cur);
-            let next = cur.nextSibling;
-            if (next == end)
-                break;
-            let view = ContentView.get(cur), nextView = ContentView.get(next);
-            if (view && nextView ? view.breakAfter :
-                (view ? view.breakAfter : isBlockElement(cur)) ||
-                    (isBlockElement(next) && (cur.nodeName != "BR" || cur.cmIgnore)))
-                this.text += this.lineBreak;
-            cur = next;
-        }
-        this.findPointBefore(parent, end);
-    }
-    readNode(node) {
-        if (node.cmIgnore)
-            return;
-        let view = ContentView.get(node);
-        let fromView = view && view.overrideDOMText;
-        let text;
-        if (fromView != null)
-            text = fromView.sliceString(0, undefined, this.lineBreak);
-        else if (node.nodeType == 3)
-            text = node.nodeValue;
-        else if (node.nodeName == "BR")
-            text = node.nextSibling ? this.lineBreak : "";
-        else if (node.nodeType == 1)
-            this.readRange(node.firstChild, null);
-        if (text != null) {
-            this.findPointIn(node, text.length);
-            this.text += text;
-            // Chrome inserts two newlines when pressing shift-enter at the
-            // end of a line. This drops one of those.
-            if (browser.chrome && this.view.inputState.lastKeyCode == 13 && !node.nextSibling && /\n\n$/.test(this.text))
-                this.text = this.text.slice(0, -1);
-        }
-    }
-    findPointBefore(node, next) {
-        for (let point of this.points)
-            if (point.node == node && node.childNodes[point.offset] == next)
-                point.pos = this.text.length;
-    }
-    findPointIn(node, maxLen) {
-        for (let point of this.points)
-            if (point.node == node)
-                point.pos = this.text.length + Math.min(point.offset, maxLen);
-    }
-}
-function isBlockElement(node) {
-    return node.nodeType == 1 && /^(DIV|P|LI|UL|OL|BLOCKQUOTE|DD|DT|H\d|SECTION|PRE)$/.test(node.nodeName);
-}
-class DOMPoint {
-    constructor(node, offset) {
-        this.node = node;
-        this.offset = offset;
-        this.pos = -1;
-    }
-}
 function selectionPoints(view) {
     let result = [];
     if (view.root.activeElement != view.contentDOM)
@@ -5706,7 +5714,9 @@ class EditorView {
         this.dispatch = this.dispatch.bind(this);
         this.root = (config.root || getRoot(config.parent) || document);
         this.viewState = new ViewState(config.state || EditorState.create());
-        this.plugins = this.state.facet(viewPlugin).map(spec => new PluginInstance(spec).update(this));
+        this.plugins = this.state.facet(viewPlugin).map(spec => new PluginInstance(spec));
+        for (let plugin of this.plugins)
+            plugin.update(this);
         this.observer = new DOMObserver(this, (from, to, typeOver) => {
             applyDOMChange(this, from, to, typeOver);
         }, event => {
@@ -5843,8 +5853,10 @@ class EditorView {
             for (let plugin of this.plugins)
                 plugin.destroy(this);
             this.viewState = new ViewState(newState);
-            this.plugins = newState.facet(viewPlugin).map(spec => new PluginInstance(spec).update(this));
+            this.plugins = newState.facet(viewPlugin).map(spec => new PluginInstance(spec));
             this.pluginMap.clear();
+            for (let plugin of this.plugins)
+                plugin.update(this);
             this.docView = new DocView(this);
             this.inputState.ensureHandlers(this);
             this.mountStyles();
@@ -5905,7 +5917,9 @@ class EditorView {
                 if (!changed && !this.measureRequests.length && this.viewState.scrollTarget == null)
                     break;
                 if (i > 5) {
-                    console.warn(this.measureRequests.length ? "Measure loop restarted more than 5 times" : "Viewport failed to stabilize");
+                    console.warn(this.measureRequests.length
+                        ? "Measure loop restarted more than 5 times"
+                        : "Viewport failed to stabilize");
                     break;
                 }
                 let measuring = [];
@@ -5951,7 +5965,8 @@ class EditorView {
                 }
                 if (redrawn)
                     this.docView.updateSelection(true);
-                if (this.viewport.from == oldViewport.from && this.viewport.to == oldViewport.to && this.measureRequests.length == 0)
+                if (this.viewport.from == oldViewport.from && this.viewport.to == oldViewport.to &&
+                    this.measureRequests.length == 0)
                     break;
             }
         }
@@ -6243,6 +6258,11 @@ class EditorView {
     Find the DOM parent node and offset (child offset if `node` is
     an element, character offset when it is a text node) at the
     given document position.
+    
+    Note that for positions that aren't currently in
+    `visibleRanges`, the resulting DOM position isn't necessarily
+    meaningful (it may just point before or after a placeholder
+    element).
     */
     domAtPos(pos) {
         return this.docView.domAtPos(pos);