@codemirror/view 6.38.8 → 6.39.0-beta.1

package/dist/index.cjs

@@ -35,1079 +35,6 @@ var browser = {
     tabSize: doc.documentElement.style.tabSize != null ? "tab-size" : "-moz-tab-size"
 };
 
-function getSelection(root) {
-    let target;
-    // Browsers differ on whether shadow roots have a getSelection
-    // method. If it exists, use that, otherwise, call it on the
-    // document.
-    if (root.nodeType == 11) { // Shadow root
-        target = root.getSelection ? root : root.ownerDocument;
-    }
-    else {
-        target = root;
-    }
-    return target.getSelection();
-}
-function contains(dom, node) {
-    return node ? dom == node || dom.contains(node.nodeType != 1 ? node.parentNode : node) : false;
-}
-function hasSelection(dom, selection) {
-    if (!selection.anchorNode)
-        return false;
-    try {
-        // Firefox will raise 'permission denied' errors when accessing
-        // properties of `sel.anchorNode` when it's in a generated CSS
-        // element.
-        return contains(dom, selection.anchorNode);
-    }
-    catch (_) {
-        return false;
-    }
-}
-function clientRectsFor(dom) {
-    if (dom.nodeType == 3)
-        return textRange(dom, 0, dom.nodeValue.length).getClientRects();
-    else if (dom.nodeType == 1)
-        return dom.getClientRects();
-    else
-        return [];
-}
-// Scans forward and backward through DOM positions equivalent to the
-// given one to see if the two are in the same place (i.e. after a
-// text node vs at the end of that text node)
-function isEquivalentPosition(node, off, targetNode, targetOff) {
-    return targetNode ? (scanFor(node, off, targetNode, targetOff, -1) ||
-        scanFor(node, off, targetNode, targetOff, 1)) : false;
-}
-function domIndex(node) {
-    for (var index = 0;; index++) {
-        node = node.previousSibling;
-        if (!node)
-            return index;
-    }
-}
-function isBlockElement(node) {
-    return node.nodeType == 1 && /^(DIV|P|LI|UL|OL|BLOCKQUOTE|DD|DT|H\d|SECTION|PRE)$/.test(node.nodeName);
-}
-function scanFor(node, off, targetNode, targetOff, dir) {
-    for (;;) {
-        if (node == targetNode && off == targetOff)
-            return true;
-        if (off == (dir < 0 ? 0 : maxOffset(node))) {
-            if (node.nodeName == "DIV")
-                return false;
-            let parent = node.parentNode;
-            if (!parent || parent.nodeType != 1)
-                return false;
-            off = domIndex(node) + (dir < 0 ? 0 : 1);
-            node = parent;
-        }
-        else if (node.nodeType == 1) {
-            node = node.childNodes[off + (dir < 0 ? -1 : 0)];
-            if (node.nodeType == 1 && node.contentEditable == "false")
-                return false;
-            off = dir < 0 ? maxOffset(node) : 0;
-        }
-        else {
-            return false;
-        }
-    }
-}
-function maxOffset(node) {
-    return node.nodeType == 3 ? node.nodeValue.length : node.childNodes.length;
-}
-function flattenRect(rect, left) {
-    let x = left ? rect.left : rect.right;
-    return { left: x, right: x, top: rect.top, bottom: rect.bottom };
-}
-function windowRect(win) {
-    let vp = win.visualViewport;
-    if (vp)
-        return {
-            left: 0, right: vp.width,
-            top: 0, bottom: vp.height
-        };
-    return { left: 0, right: win.innerWidth,
-        top: 0, bottom: win.innerHeight };
-}
-function getScale(elt, rect) {
-    let scaleX = rect.width / elt.offsetWidth;
-    let scaleY = rect.height / elt.offsetHeight;
-    if (scaleX > 0.995 && scaleX < 1.005 || !isFinite(scaleX) || Math.abs(rect.width - elt.offsetWidth) < 1)
-        scaleX = 1;
-    if (scaleY > 0.995 && scaleY < 1.005 || !isFinite(scaleY) || Math.abs(rect.height - elt.offsetHeight) < 1)
-        scaleY = 1;
-    return { scaleX, scaleY };
-}
-function scrollRectIntoView(dom, rect, side, x, y, xMargin, yMargin, ltr) {
-    let doc = dom.ownerDocument, win = doc.defaultView || window;
-    for (let cur = dom, stop = false; cur && !stop;) {
-        if (cur.nodeType == 1) { // Element
-            let bounding, top = cur == doc.body;
-            let scaleX = 1, scaleY = 1;
-            if (top) {
-                bounding = windowRect(win);
-            }
-            else {
-                if (/^(fixed|sticky)$/.test(getComputedStyle(cur).position))
-                    stop = true;
-                if (cur.scrollHeight <= cur.clientHeight && cur.scrollWidth <= cur.clientWidth) {
-                    cur = cur.assignedSlot || cur.parentNode;
-                    continue;
-                }
-                let rect = cur.getBoundingClientRect();
-                ({ scaleX, scaleY } = getScale(cur, rect));
-                // Make sure scrollbar width isn't included in the rectangle
-                bounding = { left: rect.left, right: rect.left + cur.clientWidth * scaleX,
-                    top: rect.top, bottom: rect.top + cur.clientHeight * scaleY };
-            }
-            let moveX = 0, moveY = 0;
-            if (y == "nearest") {
-                if (rect.top < bounding.top) {
-                    moveY = rect.top - (bounding.top + yMargin);
-                    if (side > 0 && rect.bottom > bounding.bottom + moveY)
-                        moveY = rect.bottom - bounding.bottom + yMargin;
-                }
-                else if (rect.bottom > bounding.bottom) {
-                    moveY = rect.bottom - bounding.bottom + yMargin;
-                    if (side < 0 && (rect.top - moveY) < bounding.top)
-                        moveY = rect.top - (bounding.top + yMargin);
-                }
-            }
-            else {
-                let rectHeight = rect.bottom - rect.top, boundingHeight = bounding.bottom - bounding.top;
-                let targetTop = y == "center" && rectHeight <= boundingHeight ? rect.top + rectHeight / 2 - boundingHeight / 2 :
-                    y == "start" || y == "center" && side < 0 ? rect.top - yMargin :
-                        rect.bottom - boundingHeight + yMargin;
-                moveY = targetTop - bounding.top;
-            }
-            if (x == "nearest") {
-                if (rect.left < bounding.left) {
-                    moveX = rect.left - (bounding.left + xMargin);
-                    if (side > 0 && rect.right > bounding.right + moveX)
-                        moveX = rect.right - bounding.right + xMargin;
-                }
-                else if (rect.right > bounding.right) {
-                    moveX = rect.right - bounding.right + xMargin;
-                    if (side < 0 && rect.left < bounding.left + moveX)
-                        moveX = rect.left - (bounding.left + xMargin);
-                }
-            }
-            else {
-                let targetLeft = x == "center" ? rect.left + (rect.right - rect.left) / 2 - (bounding.right - bounding.left) / 2 :
-                    (x == "start") == ltr ? rect.left - xMargin :
-                        rect.right - (bounding.right - bounding.left) + xMargin;
-                moveX = targetLeft - bounding.left;
-            }
-            if (moveX || moveY) {
-                if (top) {
-                    win.scrollBy(moveX, moveY);
-                }
-                else {
-                    let movedX = 0, movedY = 0;
-                    if (moveY) {
-                        let start = cur.scrollTop;
-                        cur.scrollTop += moveY / scaleY;
-                        movedY = (cur.scrollTop - start) * scaleY;
-                    }
-                    if (moveX) {
-                        let start = cur.scrollLeft;
-                        cur.scrollLeft += moveX / scaleX;
-                        movedX = (cur.scrollLeft - start) * scaleX;
-                    }
-                    rect = { left: rect.left - movedX, top: rect.top - movedY,
-                        right: rect.right - movedX, bottom: rect.bottom - movedY };
-                    if (movedX && Math.abs(movedX - moveX) < 1)
-                        x = "nearest";
-                    if (movedY && Math.abs(movedY - moveY) < 1)
-                        y = "nearest";
-                }
-            }
-            if (top)
-                break;
-            if (rect.top < bounding.top || rect.bottom > bounding.bottom ||
-                rect.left < bounding.left || rect.right > bounding.right)
-                rect = { left: Math.max(rect.left, bounding.left), right: Math.min(rect.right, bounding.right),
-                    top: Math.max(rect.top, bounding.top), bottom: Math.min(rect.bottom, bounding.bottom) };
-            cur = cur.assignedSlot || cur.parentNode;
-        }
-        else if (cur.nodeType == 11) { // A shadow root
-            cur = cur.host;
-        }
-        else {
-            break;
-        }
-    }
-}
-function scrollableParents(dom) {
-    let doc = dom.ownerDocument, x, y;
-    for (let cur = dom.parentNode; cur;) {
-        if (cur == doc.body || (x && y)) {
-            break;
-        }
-        else if (cur.nodeType == 1) {
-            if (!y && cur.scrollHeight > cur.clientHeight)
-                y = cur;
-            if (!x && cur.scrollWidth > cur.clientWidth)
-                x = cur;
-            cur = cur.assignedSlot || cur.parentNode;
-        }
-        else if (cur.nodeType == 11) {
-            cur = cur.host;
-        }
-        else {
-            break;
-        }
-    }
-    return { x, y };
-}
-class DOMSelectionState {
-    constructor() {
-        this.anchorNode = null;
-        this.anchorOffset = 0;
-        this.focusNode = null;
-        this.focusOffset = 0;
-    }
-    eq(domSel) {
-        return this.anchorNode == domSel.anchorNode && this.anchorOffset == domSel.anchorOffset &&
-            this.focusNode == domSel.focusNode && this.focusOffset == domSel.focusOffset;
-    }
-    setRange(range) {
-        let { anchorNode, focusNode } = range;
-        // Clip offsets to node size to avoid crashes when Safari reports bogus offsets (#1152)
-        this.set(anchorNode, Math.min(range.anchorOffset, anchorNode ? maxOffset(anchorNode) : 0), focusNode, Math.min(range.focusOffset, focusNode ? maxOffset(focusNode) : 0));
-    }
-    set(anchorNode, anchorOffset, focusNode, focusOffset) {
-        this.anchorNode = anchorNode;
-        this.anchorOffset = anchorOffset;
-        this.focusNode = focusNode;
-        this.focusOffset = focusOffset;
-    }
-}
-let preventScrollSupported = null;
-// Safari 26 breaks preventScroll support
-if (browser.safari && browser.safari_version >= 26)
-    preventScrollSupported = false;
-// Feature-detects support for .focus({preventScroll: true}), and uses
-// a fallback kludge when not supported.
-function focusPreventScroll(dom) {
-    if (dom.setActive)
-        return dom.setActive(); // in IE
-    if (preventScrollSupported)
-        return dom.focus(preventScrollSupported);
-    let stack = [];
-    for (let cur = dom; cur; cur = cur.parentNode) {
-        stack.push(cur, cur.scrollTop, cur.scrollLeft);
-        if (cur == cur.ownerDocument)
-            break;
-    }
-    dom.focus(preventScrollSupported == null ? {
-        get preventScroll() {
-            preventScrollSupported = { preventScroll: true };
-            return true;
-        }
-    } : undefined);
-    if (!preventScrollSupported) {
-        preventScrollSupported = false;
-        for (let i = 0; i < stack.length;) {
-            let elt = stack[i++], top = stack[i++], left = stack[i++];
-            if (elt.scrollTop != top)
-                elt.scrollTop = top;
-            if (elt.scrollLeft != left)
-                elt.scrollLeft = left;
-        }
-    }
-}
-let scratchRange;
-function textRange(node, from, to = from) {
-    let range = scratchRange || (scratchRange = document.createRange());
-    range.setEnd(node, to);
-    range.setStart(node, from);
-    return range;
-}
-function dispatchKey(elt, name, code, mods) {
-    let options = { key: name, code: name, keyCode: code, which: code, cancelable: true };
-    if (mods)
-        ({ altKey: options.altKey, ctrlKey: options.ctrlKey, shiftKey: options.shiftKey, metaKey: options.metaKey } = mods);
-    let down = new KeyboardEvent("keydown", options);
-    down.synthetic = true;
-    elt.dispatchEvent(down);
-    let up = new KeyboardEvent("keyup", options);
-    up.synthetic = true;
-    elt.dispatchEvent(up);
-    return down.defaultPrevented || up.defaultPrevented;
-}
-function getRoot(node) {
-    while (node) {
-        if (node && (node.nodeType == 9 || node.nodeType == 11 && node.host))
-            return node;
-        node = node.assignedSlot || node.parentNode;
-    }
-    return null;
-}
-function clearAttributes(node) {
-    while (node.attributes.length)
-        node.removeAttributeNode(node.attributes[0]);
-}
-function atElementStart(doc, selection) {
-    let node = selection.focusNode, offset = selection.focusOffset;
-    if (!node || selection.anchorNode != node || selection.anchorOffset != offset)
-        return false;
-    // Safari can report bogus offsets (#1152)
-    offset = Math.min(offset, maxOffset(node));
-    for (;;) {
-        if (offset) {
-            if (node.nodeType != 1)
-                return false;
-            let prev = node.childNodes[offset - 1];
-            if (prev.contentEditable == "false")
-                offset--;
-            else {
-                node = prev;
-                offset = maxOffset(node);
-            }
-        }
-        else if (node == doc) {
-            return true;
-        }
-        else {
-            offset = domIndex(node);
-            node = node.parentNode;
-        }
-    }
-}
-function isScrolledToBottom(elt) {
-    return elt.scrollTop > Math.max(1, elt.scrollHeight - elt.clientHeight - 4);
-}
-function textNodeBefore(startNode, startOffset) {
-    for (let node = startNode, offset = startOffset;;) {
-        if (node.nodeType == 3 && offset > 0) {
-            return { node: node, offset: offset };
-        }
-        else if (node.nodeType == 1 && offset > 0) {
-            if (node.contentEditable == "false")
-                return null;
-            node = node.childNodes[offset - 1];
-            offset = maxOffset(node);
-        }
-        else if (node.parentNode && !isBlockElement(node)) {
-            offset = domIndex(node);
-            node = node.parentNode;
-        }
-        else {
-            return null;
-        }
-    }
-}
-function textNodeAfter(startNode, startOffset) {
-    for (let node = startNode, offset = startOffset;;) {
-        if (node.nodeType == 3 && offset < node.nodeValue.length) {
-            return { node: node, offset: offset };
-        }
-        else if (node.nodeType == 1 && offset < node.childNodes.length) {
-            if (node.contentEditable == "false")
-                return null;
-            node = node.childNodes[offset];
-            offset = 0;
-        }
-        else if (node.parentNode && !isBlockElement(node)) {
-            offset = domIndex(node) + 1;
-            node = node.parentNode;
-        }
-        else {
-            return null;
-        }
-    }
-}
-
-class DOMPos {
-    constructor(node, offset, precise = true) {
-        this.node = node;
-        this.offset = offset;
-        this.precise = precise;
-    }
-    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 noChildren = [];
-class ContentView {
-    constructor() {
-        this.parent = null;
-        this.dom = null;
-        this.flags = 2 /* ViewFlag.NodeDirty */;
-    }
-    get overrideDOMText() { return null; }
-    get posAtStart() {
-        return this.parent ? this.parent.posBefore(this) : 0;
-    }
-    get posAtEnd() {
-        return this.posAtStart + this.length;
-    }
-    posBefore(view) {
-        let pos = this.posAtStart;
-        for (let child of this.children) {
-            if (child == view)
-                return pos;
-            pos += child.length + child.breakAfter;
-        }
-        throw new RangeError("Invalid child in posBefore");
-    }
-    posAfter(view) {
-        return this.posBefore(view) + view.length;
-    }
-    sync(view, track) {
-        if (this.flags & 2 /* ViewFlag.NodeDirty */) {
-            let parent = this.dom;
-            let prev = null, next;
-            for (let child of this.children) {
-                if (child.flags & 7 /* ViewFlag.Dirty */) {
-                    if (!child.dom && (next = prev ? prev.nextSibling : parent.firstChild)) {
-                        let contentView = ContentView.get(next);
-                        if (!contentView || !contentView.parent && contentView.canReuseDOM(child))
-                            child.reuseDOM(next);
-                    }
-                    child.sync(view, track);
-                    child.flags &= ~7 /* ViewFlag.Dirty */;
-                }
-                next = prev ? prev.nextSibling : parent.firstChild;
-                if (track && !track.written && track.node == parent && next != child.dom)
-                    track.written = true;
-                if (child.dom.parentNode == parent) {
-                    while (next && next != child.dom)
-                        next = rm$1(next);
-                }
-                else {
-                    parent.insertBefore(child.dom, next);
-                }
-                prev = child.dom;
-            }
-            next = prev ? prev.nextSibling : parent.firstChild;
-            if (next && track && track.node == parent)
-                track.written = true;
-            while (next)
-                next = rm$1(next);
-        }
-        else if (this.flags & 1 /* ViewFlag.ChildDirty */) {
-            for (let child of this.children)
-                if (child.flags & 7 /* ViewFlag.Dirty */) {
-                    child.sync(view, track);
-                    child.flags &= ~7 /* ViewFlag.Dirty */;
-                }
-        }
-    }
-    reuseDOM(_dom) { }
-    localPosFromDOM(node, offset) {
-        let after;
-        if (node == this.dom) {
-            after = this.dom.childNodes[offset];
-        }
-        else {
-            let bias = maxOffset(node) == 0 ? 0 : offset == 0 ? -1 : 1;
-            for (;;) {
-                let parent = node.parentNode;
-                if (parent == this.dom)
-                    break;
-                if (bias == 0 && parent.firstChild != parent.lastChild) {
-                    if (node == parent.firstChild)
-                        bias = -1;
-                    else
-                        bias = 1;
-                }
-                node = parent;
-            }
-            if (bias < 0)
-                after = node;
-            else
-                after = node.nextSibling;
-        }
-        if (after == this.dom.firstChild)
-            return 0;
-        while (after && !ContentView.get(after))
-            after = after.nextSibling;
-        if (!after)
-            return this.length;
-        for (let i = 0, pos = 0;; i++) {
-            let child = this.children[i];
-            if (child.dom == after)
-                return pos;
-            pos += child.length + child.breakAfter;
-        }
-    }
-    domBoundsAround(from, to, offset = 0) {
-        let fromI = -1, fromStart = -1, toI = -1, toEnd = -1;
-        for (let i = 0, pos = offset, prevEnd = offset; i < this.children.length; i++) {
-            let child = this.children[i], end = pos + child.length;
-            if (pos < from && end > to)
-                return child.domBoundsAround(from, to, pos);
-            if (end >= from && fromI == -1) {
-                fromI = i;
-                fromStart = pos;
-            }
-            if (pos > to && child.dom.parentNode == this.dom) {
-                toI = i;
-                toEnd = prevEnd;
-                break;
-            }
-            prevEnd = end;
-            pos = end + child.breakAfter;
-        }
-        return { from: fromStart, to: toEnd < 0 ? offset + this.length : toEnd,
-            startDOM: (fromI ? this.children[fromI - 1].dom.nextSibling : null) || this.dom.firstChild,
-            endDOM: toI < this.children.length && toI >= 0 ? this.children[toI].dom : null };
-    }
-    markDirty(andParent = false) {
-        this.flags |= 2 /* ViewFlag.NodeDirty */;
-        this.markParentsDirty(andParent);
-    }
-    markParentsDirty(childList) {
-        for (let parent = this.parent; parent; parent = parent.parent) {
-            if (childList)
-                parent.flags |= 2 /* ViewFlag.NodeDirty */;
-            if (parent.flags & 1 /* ViewFlag.ChildDirty */)
-                return;
-            parent.flags |= 1 /* ViewFlag.ChildDirty */;
-            childList = false;
-        }
-    }
-    setParent(parent) {
-        if (this.parent != parent) {
-            this.parent = parent;
-            if (this.flags & 7 /* ViewFlag.Dirty */)
-                this.markParentsDirty(true);
-        }
-    }
-    setDOM(dom) {
-        if (this.dom == dom)
-            return;
-        if (this.dom)
-            this.dom.cmView = null;
-        this.dom = dom;
-        dom.cmView = this;
-    }
-    get rootView() {
-        for (let v = this;;) {
-            let parent = v.parent;
-            if (!parent)
-                return v;
-            v = parent;
-        }
-    }
-    replaceChildren(from, to, children = noChildren) {
-        this.markDirty();
-        for (let i = from; i < to; i++) {
-            let child = this.children[i];
-            if (child.parent == this && children.indexOf(child) < 0)
-                child.destroy();
-        }
-        if (children.length < 250)
-            this.children.splice(from, to - from, ...children);
-        else
-            this.children = [].concat(this.children.slice(0, from), children, this.children.slice(to));
-        for (let i = 0; i < children.length; i++)
-            children[i].setParent(this);
-    }
-    ignoreMutation(_rec) { return false; }
-    ignoreEvent(_event) { return false; }
-    childCursor(pos = this.length) {
-        return new ChildCursor(this.children, pos, this.children.length);
-    }
-    childPos(pos, bias = 1) {
-        return this.childCursor().findPos(pos, bias);
-    }
-    toString() {
-        let name = this.constructor.name.replace("View", "");
-        return name + (this.children.length ? "(" + this.children.join() + ")" :
-            this.length ? "[" + (name == "Text" ? this.text : this.length) + "]" : "") +
-            (this.breakAfter ? "#" : "");
-    }
-    static get(node) { return node.cmView; }
-    get isEditable() { return true; }
-    get isWidget() { return false; }
-    get isHidden() { return false; }
-    merge(from, to, source, hasStart, openStart, openEnd) {
-        return false;
-    }
-    become(other) { return false; }
-    canReuseDOM(other) {
-        return other.constructor == this.constructor && !((this.flags | other.flags) & 8 /* ViewFlag.Composition */);
-    }
-    // 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() {
-        for (let child of this.children)
-            if (child.parent == this)
-                child.destroy();
-        this.parent = null;
-    }
-}
-ContentView.prototype.breakAfter = 0;
-// Remove a DOM node and return its next sibling.
-function rm$1(dom) {
-    let next = dom.nextSibling;
-    dom.parentNode.removeChild(dom);
-    return next;
-}
-class ChildCursor {
-    constructor(children, pos, i) {
-        this.children = children;
-        this.pos = pos;
-        this.i = i;
-        this.off = 0;
-    }
-    findPos(pos, bias = 1) {
-        for (;;) {
-            if (pos > this.pos || pos == this.pos &&
-                (bias > 0 || this.i == 0 || this.children[this.i - 1].breakAfter)) {
-                this.off = pos - this.pos;
-                return this;
-            }
-            let next = this.children[--this.i];
-            this.pos -= next.length + next.breakAfter;
-        }
-    }
-}
-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 || after.breakAfter && (last === null || last === void 0 ? void 0 : last.breakAfter))) {
-            // 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.children.length && !after.children[0].length)
-                    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);
-}
-
-const MaxJoinLen = 256;
-class TextView extends ContentView {
-    constructor(text) {
-        super();
-        this.text = text;
-    }
-    get length() { return this.text.length; }
-    createDOM(textDOM) {
-        this.setDOM(textDOM || document.createTextNode(this.text));
-    }
-    sync(view, track) {
-        if (!this.dom)
-            this.createDOM();
-        if (this.dom.nodeValue != this.text) {
-            if (track && track.node == this.dom)
-                track.written = true;
-            this.dom.nodeValue = this.text;
-        }
-    }
-    reuseDOM(dom) {
-        if (dom.nodeType == 3)
-            this.createDOM(dom);
-    }
-    merge(from, to, source) {
-        if ((this.flags & 8 /* ViewFlag.Composition */) ||
-            source && (!(source instanceof TextView) ||
-                this.length - (to - from) + source.length > MaxJoinLen ||
-                (source.flags & 8 /* ViewFlag.Composition */)))
-            return false;
-        this.text = this.text.slice(0, from) + (source ? source.text : "") + this.text.slice(to);
-        this.markDirty();
-        return true;
-    }
-    split(from) {
-        let result = new TextView(this.text.slice(from));
-        this.text = this.text.slice(0, from);
-        this.markDirty();
-        result.flags |= this.flags & 8 /* ViewFlag.Composition */;
-        return result;
-    }
-    localPosFromDOM(node, offset) {
-        return node == this.dom ? offset : offset ? this.text.length : 0;
-    }
-    domAtPos(pos) { return new DOMPos(this.dom, pos); }
-    domBoundsAround(_from, _to, offset) {
-        return { from: offset, to: offset + this.length, startDOM: this.dom, endDOM: this.dom.nextSibling };
-    }
-    coordsAt(pos, side) {
-        return textCoords(this.dom, pos, side);
-    }
-}
-class MarkView extends ContentView {
-    constructor(mark, children = [], length = 0) {
-        super();
-        this.mark = mark;
-        this.children = children;
-        this.length = length;
-        for (let ch of children)
-            ch.setParent(this);
-    }
-    setAttrs(dom) {
-        clearAttributes(dom);
-        if (this.mark.class)
-            dom.className = this.mark.class;
-        if (this.mark.attrs)
-            for (let name in this.mark.attrs)
-                dom.setAttribute(name, this.mark.attrs[name]);
-        return dom;
-    }
-    canReuseDOM(other) {
-        return super.canReuseDOM(other) && !((this.flags | other.flags) & 8 /* ViewFlag.Composition */);
-    }
-    reuseDOM(node) {
-        if (node.nodeName == this.mark.tagName.toUpperCase()) {
-            this.setDOM(node);
-            this.flags |= 4 /* ViewFlag.AttrsDirty */ | 2 /* ViewFlag.NodeDirty */;
-        }
-    }
-    sync(view, track) {
-        if (!this.dom)
-            this.setDOM(this.setAttrs(document.createElement(this.mark.tagName)));
-        else if (this.flags & 4 /* ViewFlag.AttrsDirty */)
-            this.setAttrs(this.dom);
-        super.sync(view, track);
-    }
-    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;
-        mergeChildrenInto(this, from, to, source ? source.children.slice() : [], openStart - 1, openEnd - 1);
-        this.markDirty();
-        return true;
-    }
-    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.split(from - off) : elt);
-            if (detachFrom < 0 && off >= from)
-                detachFrom = i;
-            off = end;
-            i++;
-        }
-        let length = this.length - from;
-        this.length = from;
-        if (detachFrom > -1) {
-            this.children.length = detachFrom;
-            this.markDirty();
-        }
-        return new MarkView(this.mark, result, length);
-    }
-    domAtPos(pos) {
-        return inlineDOMAtPos(this, pos);
-    }
-    coordsAt(pos, side) {
-        return coordsInChildren(this, pos, side);
-    }
-}
-function textCoords(text, pos, side) {
-    let length = text.nodeValue.length;
-    if (pos > length)
-        pos = length;
-    let from = pos, to = pos, flatten = 0;
-    if (pos == 0 && side < 0 || pos == length && side >= 0) {
-        if (!(browser.chrome || browser.gecko)) { // These browsers reliably return valid rectangles for empty ranges
-            if (pos) {
-                from--;
-                flatten = 1;
-            } // FIXME this is wrong in RTL text
-            else if (to < length) {
-                to++;
-                flatten = -1;
-            }
-        }
-    }
-    else {
-        if (side < 0)
-            from--;
-        else if (to < length)
-            to++;
-    }
-    let rects = textRange(text, from, to).getClientRects();
-    if (!rects.length)
-        return null;
-    let rect = rects[(flatten ? flatten < 0 : side >= 0) ? 0 : rects.length - 1];
-    if (browser.safari && !flatten && rect.width == 0)
-        rect = Array.prototype.find.call(rects, r => r.width) || rect;
-    return flatten ? flattenRect(rect, flatten < 0) : rect || null;
-}
-// Also used for collapsed ranges that don't have a placeholder widget!
-class WidgetView extends ContentView {
-    static create(widget, length, side) {
-        return new WidgetView(widget, length, side);
-    }
-    constructor(widget, length, side) {
-        super();
-        this.widget = widget;
-        this.length = length;
-        this.side = side;
-        this.prevWidget = null;
-    }
-    split(from) {
-        let result = WidgetView.create(this.widget, this.length - from, this.side);
-        this.length -= from;
-        return result;
-    }
-    sync(view) {
-        if (!this.dom || !this.widget.updateDOM(this.dom, view)) {
-            if (this.dom && this.prevWidget)
-                this.prevWidget.destroy(this.dom);
-            this.prevWidget = null;
-            this.setDOM(this.widget.toDOM(view));
-            if (!this.widget.editable)
-                this.dom.contentEditable = "false";
-        }
-    }
-    getSide() { return this.side; }
-    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;
-        this.length = from + (source ? source.length : 0) + (this.length - to);
-        return true;
-    }
-    become(other) {
-        if (other instanceof WidgetView && other.side == this.side &&
-            this.widget.constructor == other.widget.constructor) {
-            if (!this.widget.compare(other.widget))
-                this.markDirty(true);
-            if (this.dom && !this.prevWidget)
-                this.prevWidget = this.widget;
-            this.widget = other.widget;
-            this.length = other.length;
-            return true;
-        }
-        return false;
-    }
-    ignoreMutation() { return true; }
-    ignoreEvent(event) { return this.widget.ignoreEvent(event); }
-    get overrideDOMText() {
-        if (this.length == 0)
-            return state.Text.empty;
-        let top = this;
-        while (top.parent)
-            top = top.parent;
-        let { view } = top, text = view && view.state.doc, start = this.posAtStart;
-        return text ? text.slice(start, start + this.length) : state.Text.empty;
-    }
-    domAtPos(pos) {
-        return (this.length ? pos == 0 : this.side > 0)
-            ? DOMPos.before(this.dom)
-            : DOMPos.after(this.dom, pos == this.length);
-    }
-    domBoundsAround() { return null; }
-    coordsAt(pos, side) {
-        let custom = this.widget.coordsAt(this.dom, pos, side);
-        if (custom)
-            return custom;
-        let rects = this.dom.getClientRects(), rect = null;
-        if (!rects.length)
-            return null;
-        let fromBack = this.side ? this.side < 0 : pos > 0;
-        for (let i = fromBack ? rects.length - 1 : 0;; i += (fromBack ? -1 : 1)) {
-            rect = rects[i];
-            if (pos > 0 ? i == 0 : i == rects.length - 1 || rect.top < rect.bottom)
-                break;
-        }
-        return flattenRect(rect, !fromBack);
-    }
-    get isEditable() { return false; }
-    get isWidget() { return true; }
-    get isHidden() { return this.widget.isHidden; }
-    destroy() {
-        super.destroy();
-        if (this.dom)
-            this.widget.destroy(this.dom);
-    }
-}
-// 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 ContentView {
-    constructor(side) {
-        super();
-        this.side = side;
-    }
-    get length() { return 0; }
-    merge() { return false; }
-    become(other) {
-        return other instanceof WidgetBufferView && other.side == this.side;
-    }
-    split() { return new WidgetBufferView(this.side); }
-    sync() {
-        if (!this.dom) {
-            let dom = document.createElement("img");
-            dom.className = "cm-widgetBuffer";
-            dom.setAttribute("aria-hidden", "true");
-            this.setDOM(dom);
-        }
-    }
-    getSide() { return this.side; }
-    domAtPos(pos) { return this.side > 0 ? DOMPos.before(this.dom) : DOMPos.after(this.dom); }
-    localPosFromDOM() { return 0; }
-    domBoundsAround() { return null; }
-    coordsAt(pos) {
-        return this.dom.getBoundingClientRect();
-    }
-    get overrideDOMText() {
-        return state.Text.empty;
-    }
-    get isHidden() { return true; }
-}
-TextView.prototype.children = WidgetView.prototype.children = WidgetBufferView.prototype.children = noChildren;
-function inlineDOMAtPos(parent, pos) {
-    let dom = parent.dom, { children } = parent, i = 0;
-    for (let off = 0; i < children.length; i++) {
-        let child = children[i], end = off + child.length;
-        if (end == off && child.getSide() <= 0)
-            continue;
-        if (pos > off && pos < end && child.dom.parentNode == dom)
-            return child.domAtPos(pos - off);
-        if (pos <= off)
-            break;
-        off = end;
-    }
-    for (let j = i; j > 0; j--) {
-        let prev = children[j - 1];
-        if (prev.dom.parentNode == dom)
-            return prev.domAtPos(prev.length);
-    }
-    for (let j = i; j < children.length; j++) {
-        let next = children[j];
-        if (next.dom.parentNode == dom)
-            return next.domAtPos(0);
-    }
-    return new DOMPos(dom, 0);
-}
-// Assumes `view`, if a mark view, has precisely 1 child.
-function joinInlineInto(parent, view, open) {
-    let last, { children } = parent;
-    if (open > 0 && view instanceof MarkView && children.length &&
-        (last = children[children.length - 1]) instanceof MarkView && last.mark.eq(view.mark)) {
-        joinInlineInto(last, view.children[0], open - 1);
-    }
-    else {
-        children.push(view);
-        view.setParent(parent);
-    }
-    parent.length += view.length;
-}
-function coordsInChildren(view, pos, side) {
-    let before = null, beforePos = -1, after = null, afterPos = -1;
-    function scan(view, pos) {
-        for (let i = 0, off = 0; i < view.children.length && off <= pos; i++) {
-            let child = view.children[i], end = off + child.length;
-            if (end >= pos) {
-                if (child.children.length) {
-                    scan(child, pos - off);
-                }
-                else if ((!after || after.isHidden && (side > 0 || onSameLine(after, child))) &&
-                    (end > pos || off == end && child.getSide() > 0)) {
-                    after = child;
-                    afterPos = pos - off;
-                }
-                else if (off < pos || (off == end && child.getSide() < 0) && !child.isHidden) {
-                    before = child;
-                    beforePos = pos - off;
-                }
-            }
-            off = end;
-        }
-    }
-    scan(view, pos);
-    let target = (side < 0 ? before : after) || before || after;
-    if (target)
-        return target.coordsAt(Math.max(0, target == before ? beforePos : afterPos), side);
-    return fallbackRect(view);
-}
-function fallbackRect(view) {
-    let last = view.dom.lastChild;
-    if (!last)
-        return view.dom.getBoundingClientRect();
-    let rects = clientRectsFor(last);
-    return rects[rects.length - 1] || null;
-}
-function onSameLine(a, b) {
-    let posA = a.coordsAt(0, 1), posB = b.coordsAt(0, 1);
-    return posA && posB && posB.top < posA.bottom;
-}
-
 function combineAttrs(source, target) {
     for (let name in source) {
         if (name == "class" && target.class)
@@ -1137,6 +64,20 @@ function attrsEq(a, b, ignore) {
     }
     return true;
 }
+function setAttrs(dom, attrs) {
+    for (let i = dom.attributes.length - 1; i >= 0; i--) {
+        let name = dom.attributes[i].name;
+        if (attrs[name] == null)
+            dom.removeAttribute(name);
+    }
+    for (let name in attrs) {
+        let value = attrs[name];
+        if (name == "style")
+            dom.style.cssText = value;
+        else if (dom.getAttribute(name) != value)
+            dom.setAttribute(name, value);
+    }
+}
 function updateAttrs(dom, prev, attrs) {
     let changed = false;
     if (prev)
@@ -1369,16 +310,11 @@ class MarkDecoration extends Decoration {
         let { start, end } = getInclusive(spec);
         super(start ? -1 /* Side.InlineIncStart */ : 500000000 /* Side.NonIncStart */, end ? 1 /* Side.InlineIncEnd */ : -600000000 /* Side.NonIncEnd */, null, spec);
         this.tagName = spec.tagName || "span";
-        this.class = spec.class || "";
-        this.attrs = spec.attributes || null;
+        this.attrs = spec.class && spec.attributes ? combineAttrs(spec.attributes, { class: spec.class })
+            : spec.class ? { class: spec.class } : spec.attributes || noAttrs;
     }
     eq(other) {
-        var _a, _b;
-        return this == other ||
-            other instanceof MarkDecoration &&
-                this.tagName == other.tagName &&
-                (this.class || ((_a = this.attrs) === null || _a === void 0 ? void 0 : _a.class)) == (other.class || ((_b = other.attrs) === null || _b === void 0 ? void 0 : _b.class)) &&
-                attrsEq(this.attrs, other.attrs, "class");
+        return this == other || other instanceof MarkDecoration && this.tagName == other.tagName && attrsEq(this.attrs, other.attrs);
     }
     range(from, to = from) {
         if (from >= to)
@@ -1452,438 +388,427 @@ function addRange(from, to, ranges, margin = 0) {
     else
         ranges.push(from, to);
 }
+/**
+A block wrapper defines a DOM node that wraps lines or other block
+wrappers at the top of the document. It affects any line or block
+widget that starts inside its range, including blocks starting
+directly at `from` but not including `to`.
+*/
+class BlockWrapper extends state.RangeValue {
+    constructor(tagName, attributes) {
+        super();
+        this.tagName = tagName;
+        this.attributes = attributes;
+    }
+    eq(other) {
+        return other == this ||
+            other instanceof BlockWrapper && this.tagName == other.tagName && attrsEq(this.attributes, other.attributes);
+    }
+    /**
+    Create a block wrapper object with the given tag name and
+    attributes.
+    */
+    static create(spec) {
+        return new BlockWrapper(spec.tagName, spec.attributes || noAttrs);
+    }
+    /**
+    Create a range set from the given block wrapper ranges.
+    */
+    static set(of, sort = false) {
+        return state.RangeSet.of(of, sort);
+    }
+}
+BlockWrapper.prototype.startSide = BlockWrapper.prototype.endSide = -1;
 
-class LineView extends ContentView {
-    constructor() {
-        super(...arguments);
-        this.children = [];
-        this.length = 0;
-        this.prevAttrs = undefined;
-        this.attrs = null;
-        this.breakAfter = 0;
-    }
-    // Consumes source
-    merge(from, to, source, hasStart, openStart, openEnd) {
-        if (source) {
-            if (!(source instanceof LineView))
+function getSelection(root) {
+    let target;
+    // Browsers differ on whether shadow roots have a getSelection
+    // method. If it exists, use that, otherwise, call it on the
+    // document.
+    if (root.nodeType == 11) { // Shadow root
+        target = root.getSelection ? root : root.ownerDocument;
+    }
+    else {
+        target = root;
+    }
+    return target.getSelection();
+}
+function contains(dom, node) {
+    return node ? dom == node || dom.contains(node.nodeType != 1 ? node.parentNode : node) : false;
+}
+function hasSelection(dom, selection) {
+    if (!selection.anchorNode)
+        return false;
+    try {
+        // Firefox will raise 'permission denied' errors when accessing
+        // properties of `sel.anchorNode` when it's in a generated CSS
+        // element.
+        return contains(dom, selection.anchorNode);
+    }
+    catch (_) {
+        return false;
+    }
+}
+function clientRectsFor(dom) {
+    if (dom.nodeType == 3)
+        return textRange(dom, 0, dom.nodeValue.length).getClientRects();
+    else if (dom.nodeType == 1)
+        return dom.getClientRects();
+    else
+        return [];
+}
+// Scans forward and backward through DOM positions equivalent to the
+// given one to see if the two are in the same place (i.e. after a
+// text node vs at the end of that text node)
+function isEquivalentPosition(node, off, targetNode, targetOff) {
+    return targetNode ? (scanFor(node, off, targetNode, targetOff, -1) ||
+        scanFor(node, off, targetNode, targetOff, 1)) : false;
+}
+function domIndex(node) {
+    for (var index = 0;; index++) {
+        node = node.previousSibling;
+        if (!node)
+            return index;
+    }
+}
+function isBlockElement(node) {
+    return node.nodeType == 1 && /^(DIV|P|LI|UL|OL|BLOCKQUOTE|DD|DT|H\d|SECTION|PRE)$/.test(node.nodeName);
+}
+function scanFor(node, off, targetNode, targetOff, dir) {
+    for (;;) {
+        if (node == targetNode && off == targetOff)
+            return true;
+        if (off == (dir < 0 ? 0 : maxOffset(node))) {
+            if (node.nodeName == "DIV")
+                return false;
+            let parent = node.parentNode;
+            if (!parent || parent.nodeType != 1)
                 return false;
-            if (!this.dom)
-                source.transferDOM(this); // Reuse source.dom when appropriate
+            off = domIndex(node) + (dir < 0 ? 0 : 1);
+            node = parent;
+        }
+        else if (node.nodeType == 1) {
+            node = node.childNodes[off + (dir < 0 ? -1 : 0)];
+            if (node.nodeType == 1 && node.contentEditable == "false")
+                return false;
+            off = dir < 0 ? maxOffset(node) : 0;
+        }
+        else {
+            return false;
         }
-        if (hasStart)
-            this.setDeco(source ? source.attrs : null);
-        mergeChildrenInto(this, from, to, source ? source.children.slice() : [], openStart, openEnd);
-        return true;
     }
-    split(at) {
-        let end = new LineView;
-        end.breakAfter = this.breakAfter;
-        if (this.length == 0)
-            return end;
-        let { i, off } = this.childPos(at);
-        if (off) {
-            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].destroy();
-        this.children.length = i;
-        this.markDirty();
-        this.length = at;
-        return end;
-    }
-    transferDOM(other) {
-        if (!this.dom)
-            return;
-        this.markDirty();
-        other.setDOM(this.dom);
-        other.prevAttrs = this.prevAttrs === undefined ? this.attrs : this.prevAttrs;
-        this.prevAttrs = undefined;
-        this.dom = null;
-    }
-    setDeco(attrs) {
-        if (!attrsEq(this.attrs, attrs)) {
-            if (this.dom) {
-                this.prevAttrs = this.attrs;
-                this.markDirty();
+}
+function maxOffset(node) {
+    return node.nodeType == 3 ? node.nodeValue.length : node.childNodes.length;
+}
+function flattenRect(rect, left) {
+    let x = left ? rect.left : rect.right;
+    return { left: x, right: x, top: rect.top, bottom: rect.bottom };
+}
+function windowRect(win) {
+    let vp = win.visualViewport;
+    if (vp)
+        return {
+            left: 0, right: vp.width,
+            top: 0, bottom: vp.height
+        };
+    return { left: 0, right: win.innerWidth,
+        top: 0, bottom: win.innerHeight };
+}
+function getScale(elt, rect) {
+    let scaleX = rect.width / elt.offsetWidth;
+    let scaleY = rect.height / elt.offsetHeight;
+    if (scaleX > 0.995 && scaleX < 1.005 || !isFinite(scaleX) || Math.abs(rect.width - elt.offsetWidth) < 1)
+        scaleX = 1;
+    if (scaleY > 0.995 && scaleY < 1.005 || !isFinite(scaleY) || Math.abs(rect.height - elt.offsetHeight) < 1)
+        scaleY = 1;
+    return { scaleX, scaleY };
+}
+function scrollRectIntoView(dom, rect, side, x, y, xMargin, yMargin, ltr) {
+    let doc = dom.ownerDocument, win = doc.defaultView || window;
+    for (let cur = dom, stop = false; cur && !stop;) {
+        if (cur.nodeType == 1) { // Element
+            let bounding, top = cur == doc.body;
+            let scaleX = 1, scaleY = 1;
+            if (top) {
+                bounding = windowRect(win);
+            }
+            else {
+                if (/^(fixed|sticky)$/.test(getComputedStyle(cur).position))
+                    stop = true;
+                if (cur.scrollHeight <= cur.clientHeight && cur.scrollWidth <= cur.clientWidth) {
+                    cur = cur.assignedSlot || cur.parentNode;
+                    continue;
+                }
+                let rect = cur.getBoundingClientRect();
+                ({ scaleX, scaleY } = getScale(cur, rect));
+                // Make sure scrollbar width isn't included in the rectangle
+                bounding = { left: rect.left, right: rect.left + cur.clientWidth * scaleX,
+                    top: rect.top, bottom: rect.top + cur.clientHeight * scaleY };
+            }
+            let moveX = 0, moveY = 0;
+            if (y == "nearest") {
+                if (rect.top < bounding.top) {
+                    moveY = rect.top - (bounding.top + yMargin);
+                    if (side > 0 && rect.bottom > bounding.bottom + moveY)
+                        moveY = rect.bottom - bounding.bottom + yMargin;
+                }
+                else if (rect.bottom > bounding.bottom) {
+                    moveY = rect.bottom - bounding.bottom + yMargin;
+                    if (side < 0 && (rect.top - moveY) < bounding.top)
+                        moveY = rect.top - (bounding.top + yMargin);
+                }
+            }
+            else {
+                let rectHeight = rect.bottom - rect.top, boundingHeight = bounding.bottom - bounding.top;
+                let targetTop = y == "center" && rectHeight <= boundingHeight ? rect.top + rectHeight / 2 - boundingHeight / 2 :
+                    y == "start" || y == "center" && side < 0 ? rect.top - yMargin :
+                        rect.bottom - boundingHeight + yMargin;
+                moveY = targetTop - bounding.top;
+            }
+            if (x == "nearest") {
+                if (rect.left < bounding.left) {
+                    moveX = rect.left - (bounding.left + xMargin);
+                    if (side > 0 && rect.right > bounding.right + moveX)
+                        moveX = rect.right - bounding.right + xMargin;
+                }
+                else if (rect.right > bounding.right) {
+                    moveX = rect.right - bounding.right + xMargin;
+                    if (side < 0 && rect.left < bounding.left + moveX)
+                        moveX = rect.left - (bounding.left + xMargin);
+                }
+            }
+            else {
+                let targetLeft = x == "center" ? rect.left + (rect.right - rect.left) / 2 - (bounding.right - bounding.left) / 2 :
+                    (x == "start") == ltr ? rect.left - xMargin :
+                        rect.right - (bounding.right - bounding.left) + xMargin;
+                moveX = targetLeft - bounding.left;
+            }
+            if (moveX || moveY) {
+                if (top) {
+                    win.scrollBy(moveX, moveY);
+                }
+                else {
+                    let movedX = 0, movedY = 0;
+                    if (moveY) {
+                        let start = cur.scrollTop;
+                        cur.scrollTop += moveY / scaleY;
+                        movedY = (cur.scrollTop - start) * scaleY;
+                    }
+                    if (moveX) {
+                        let start = cur.scrollLeft;
+                        cur.scrollLeft += moveX / scaleX;
+                        movedX = (cur.scrollLeft - start) * scaleX;
+                    }
+                    rect = { left: rect.left - movedX, top: rect.top - movedY,
+                        right: rect.right - movedX, bottom: rect.bottom - movedY };
+                    if (movedX && Math.abs(movedX - moveX) < 1)
+                        x = "nearest";
+                    if (movedY && Math.abs(movedY - moveY) < 1)
+                        y = "nearest";
+                }
             }
-            this.attrs = attrs;
+            if (top)
+                break;
+            if (rect.top < bounding.top || rect.bottom > bounding.bottom ||
+                rect.left < bounding.left || rect.right > bounding.right)
+                rect = { left: Math.max(rect.left, bounding.left), right: Math.min(rect.right, bounding.right),
+                    top: Math.max(rect.top, bounding.top), bottom: Math.min(rect.bottom, bounding.bottom) };
+            cur = cur.assignedSlot || cur.parentNode;
         }
-    }
-    append(child, openStart) {
-        joinInlineInto(this, child, openStart);
-    }
-    // Only called when building a line view in ContentBuilder
-    addLineDeco(deco) {
-        let attrs = deco.spec.attributes, cls = deco.spec.class;
-        if (attrs)
-            this.attrs = combineAttrs(attrs, this.attrs || {});
-        if (cls)
-            this.attrs = combineAttrs({ class: cls }, this.attrs || {});
-    }
-    domAtPos(pos) {
-        return inlineDOMAtPos(this, pos);
-    }
-    reuseDOM(node) {
-        if (node.nodeName == "DIV") {
-            this.setDOM(node);
-            this.flags |= 4 /* ViewFlag.AttrsDirty */ | 2 /* ViewFlag.NodeDirty */;
+        else if (cur.nodeType == 11) { // A shadow root
+            cur = cur.host;
         }
-    }
-    sync(view, track) {
-        var _a;
-        if (!this.dom) {
-            this.setDOM(document.createElement("div"));
-            this.dom.className = "cm-line";
-            this.prevAttrs = this.attrs ? null : undefined;
-        }
-        else if (this.flags & 4 /* ViewFlag.AttrsDirty */) {
-            clearAttributes(this.dom);
-            this.dom.className = "cm-line";
-            this.prevAttrs = this.attrs ? null : undefined;
-        }
-        if (this.prevAttrs !== undefined) {
-            updateAttrs(this.dom, this.prevAttrs, this.attrs);
-            this.dom.classList.add("cm-line");
-            this.prevAttrs = undefined;
-        }
-        super.sync(view, track);
-        let last = this.dom.lastChild;
-        while (last && ContentView.get(last) instanceof MarkView)
-            last = last.lastChild;
-        if (!last || !this.length ||
-            last.nodeName != "BR" && ((_a = ContentView.get(last)) === null || _a === void 0 ? void 0 : _a.isEditable) == false &&
-                (!browser.ios || !this.children.some(ch => ch instanceof TextView))) {
-            let hack = document.createElement("BR");
-            hack.cmIgnore = true;
-            this.dom.appendChild(hack);
+        else {
+            break;
         }
     }
-    measureTextSize() {
-        if (this.children.length == 0 || this.length > 20)
-            return null;
-        let totalWidth = 0, textHeight;
-        for (let child of this.children) {
-            if (!(child instanceof TextView) || /[^ -~]/.test(child.text))
-                return null;
-            let rects = clientRectsFor(child.dom);
-            if (rects.length != 1)
-                return null;
-            totalWidth += rects[0].width;
-            textHeight = rects[0].height;
+}
+function scrollableParents(dom) {
+    let doc = dom.ownerDocument, x, y;
+    for (let cur = dom.parentNode; cur;) {
+        if (cur == doc.body || (x && y)) {
+            break;
         }
-        return !totalWidth ? null : {
-            lineHeight: this.dom.getBoundingClientRect().height,
-            charWidth: totalWidth / this.length,
-            textHeight
-        };
-    }
-    coordsAt(pos, side) {
-        let rect = coordsInChildren(this, pos, side);
-        // Correct rectangle height for empty lines when the returned
-        // height is larger than the text height.
-        if (!this.children.length && rect && this.parent) {
-            let { heightOracle } = this.parent.view.viewState, height = rect.bottom - rect.top;
-            if (Math.abs(height - heightOracle.lineHeight) < 2 && heightOracle.textHeight < height) {
-                let dist = (height - heightOracle.textHeight) / 2;
-                return { top: rect.top + dist, bottom: rect.bottom - dist, left: rect.left, right: rect.left };
-            }
+        else if (cur.nodeType == 1) {
+            if (!y && cur.scrollHeight > cur.clientHeight)
+                y = cur;
+            if (!x && cur.scrollWidth > cur.clientWidth)
+                x = cur;
+            cur = cur.assignedSlot || cur.parentNode;
         }
-        return rect;
-    }
-    become(other) {
-        return other instanceof LineView && this.children.length == 0 && other.children.length == 0 &&
-            attrsEq(this.attrs, other.attrs) && this.breakAfter == other.breakAfter;
-    }
-    covers() { return true; }
-    static find(docView, pos) {
-        for (let i = 0, off = 0; i < docView.children.length; i++) {
-            let block = docView.children[i], end = off + block.length;
-            if (end >= pos) {
-                if (block instanceof LineView)
-                    return block;
-                if (end > pos)
-                    break;
-            }
-            off = end + block.breakAfter;
+        else if (cur.nodeType == 11) {
+            cur = cur.host;
+        }
+        else {
+            break;
         }
-        return null;
     }
+    return { x, y };
 }
-class BlockWidgetView extends ContentView {
-    constructor(widget, length, deco) {
-        super();
-        this.widget = widget;
-        this.length = length;
-        this.deco = deco;
-        this.breakAfter = 0;
-        this.prevWidget = null;
+class DOMSelectionState {
+    constructor() {
+        this.anchorNode = null;
+        this.anchorOffset = 0;
+        this.focusNode = null;
+        this.focusOffset = 0;
     }
-    merge(from, to, source, _takeDeco, openStart, openEnd) {
-        if (source && (!(source instanceof BlockWidgetView) || !this.widget.compare(source.widget) ||
-            from > 0 && openStart <= 0 || to < this.length && openEnd <= 0))
-            return false;
-        this.length = from + (source ? source.length : 0) + (this.length - to);
-        return true;
+    eq(domSel) {
+        return this.anchorNode == domSel.anchorNode && this.anchorOffset == domSel.anchorOffset &&
+            this.focusNode == domSel.focusNode && this.focusOffset == domSel.focusOffset;
     }
-    domAtPos(pos) {
-        return pos == 0 ? DOMPos.before(this.dom) : DOMPos.after(this.dom, pos == this.length);
+    setRange(range) {
+        let { anchorNode, focusNode } = range;
+        // Clip offsets to node size to avoid crashes when Safari reports bogus offsets (#1152)
+        this.set(anchorNode, Math.min(range.anchorOffset, anchorNode ? maxOffset(anchorNode) : 0), focusNode, Math.min(range.focusOffset, focusNode ? maxOffset(focusNode) : 0));
     }
-    split(at) {
-        let len = this.length - at;
-        this.length = at;
-        let end = new BlockWidgetView(this.widget, len, this.deco);
-        end.breakAfter = this.breakAfter;
-        return end;
+    set(anchorNode, anchorOffset, focusNode, focusOffset) {
+        this.anchorNode = anchorNode;
+        this.anchorOffset = anchorOffset;
+        this.focusNode = focusNode;
+        this.focusOffset = focusOffset;
     }
-    get children() { return noChildren; }
-    sync(view) {
-        if (!this.dom || !this.widget.updateDOM(this.dom, view)) {
-            if (this.dom && this.prevWidget)
-                this.prevWidget.destroy(this.dom);
-            this.prevWidget = null;
-            this.setDOM(this.widget.toDOM(view));
-            if (!this.widget.editable)
-                this.dom.contentEditable = "false";
-        }
+}
+let preventScrollSupported = null;
+// Safari 26 breaks preventScroll support
+if (browser.safari && browser.safari_version >= 26)
+    preventScrollSupported = false;
+// Feature-detects support for .focus({preventScroll: true}), and uses
+// a fallback kludge when not supported.
+function focusPreventScroll(dom) {
+    if (dom.setActive)
+        return dom.setActive(); // in IE
+    if (preventScrollSupported)
+        return dom.focus(preventScrollSupported);
+    let stack = [];
+    for (let cur = dom; cur; cur = cur.parentNode) {
+        stack.push(cur, cur.scrollTop, cur.scrollLeft);
+        if (cur == cur.ownerDocument)
+            break;
     }
-    get overrideDOMText() {
-        return this.parent ? this.parent.view.state.doc.slice(this.posAtStart, this.posAtEnd) : state.Text.empty;
-    }
-    domBoundsAround() { return null; }
-    become(other) {
-        if (other instanceof BlockWidgetView &&
-            other.widget.constructor == this.widget.constructor) {
-            if (!other.widget.compare(this.widget))
-                this.markDirty(true);
-            if (this.dom && !this.prevWidget)
-                this.prevWidget = this.widget;
-            this.widget = other.widget;
-            this.length = other.length;
-            this.deco = other.deco;
-            this.breakAfter = other.breakAfter;
+    dom.focus(preventScrollSupported == null ? {
+        get preventScroll() {
+            preventScrollSupported = { preventScroll: true };
             return true;
         }
-        return false;
-    }
-    ignoreMutation() { return true; }
-    ignoreEvent(event) { return this.widget.ignoreEvent(event); }
-    get isEditable() { return false; }
-    get isWidget() { return true; }
-    coordsAt(pos, side) {
-        let custom = this.widget.coordsAt(this.dom, pos, side);
-        if (custom)
-            return custom;
-        if (this.widget instanceof BlockGapWidget)
-            return null;
-        return flattenRect(this.dom.getBoundingClientRect(), this.length ? pos == 0 : side <= 0);
-    }
-    destroy() {
-        super.destroy();
-        if (this.dom)
-            this.widget.destroy(this.dom);
-    }
-    covers(side) {
-        let { startSide, endSide } = this.deco;
-        return startSide == endSide ? false : side < 0 ? startSide < 0 : endSide > 0;
+    } : undefined);
+    if (!preventScrollSupported) {
+        preventScrollSupported = false;
+        for (let i = 0; i < stack.length;) {
+            let elt = stack[i++], top = stack[i++], left = stack[i++];
+            if (elt.scrollTop != top)
+                elt.scrollTop = top;
+            if (elt.scrollLeft != left)
+                elt.scrollLeft = left;
+        }
     }
 }
-class BlockGapWidget extends WidgetType {
-    constructor(height) {
-        super();
-        this.height = height;
-    }
-    toDOM() {
-        let elt = document.createElement("div");
-        elt.className = "cm-gap";
-        this.updateDOM(elt);
-        return elt;
-    }
-    eq(other) { return other.height == this.height; }
-    updateDOM(elt) {
-        elt.style.height = this.height + "px";
-        return true;
-    }
-    get editable() { return true; }
-    get estimatedHeight() { return this.height; }
-    ignoreEvent() { return false; }
+let scratchRange;
+function textRange(node, from, to = from) {
+    let range = scratchRange || (scratchRange = document.createRange());
+    range.setEnd(node, to);
+    range.setStart(node, from);
+    return range;
 }
-
-class ContentBuilder {
-    constructor(doc, pos, end, disallowBlockEffectsFor) {
-        this.doc = doc;
-        this.pos = pos;
-        this.end = end;
-        this.disallowBlockEffectsFor = disallowBlockEffectsFor;
-        this.content = [];
-        this.curLine = null;
-        this.breakAtStart = 0;
-        this.pendingBuffer = 0 /* Buf.No */;
-        this.bufferMarks = [];
-        // Set to false directly after a widget that covers the position after it
-        this.atCursorPos = true;
-        this.openStart = -1;
-        this.openEnd = -1;
-        this.text = "";
-        this.textOff = 0;
-        this.cursor = doc.iter();
-        this.skip = pos;
-    }
-    posCovered() {
-        if (this.content.length == 0)
-            return !this.breakAtStart && this.doc.lineAt(this.pos).from != this.pos;
-        let last = this.content[this.content.length - 1];
-        return !(last.breakAfter || last instanceof BlockWidgetView && last.deco.endSide < 0);
+function dispatchKey(elt, name, code, mods) {
+    let options = { key: name, code: name, keyCode: code, which: code, cancelable: true };
+    if (mods)
+        ({ altKey: options.altKey, ctrlKey: options.ctrlKey, shiftKey: options.shiftKey, metaKey: options.metaKey } = mods);
+    let down = new KeyboardEvent("keydown", options);
+    down.synthetic = true;
+    elt.dispatchEvent(down);
+    let up = new KeyboardEvent("keyup", options);
+    up.synthetic = true;
+    elt.dispatchEvent(up);
+    return down.defaultPrevented || up.defaultPrevented;
+}
+function getRoot(node) {
+    while (node) {
+        if (node && (node.nodeType == 9 || node.nodeType == 11 && node.host))
+            return node;
+        node = node.assignedSlot || node.parentNode;
     }
-    getLine() {
-        if (!this.curLine) {
-            this.content.push(this.curLine = new LineView);
-            this.atCursorPos = true;
+    return null;
+}
+function atElementStart(doc, selection) {
+    let node = selection.focusNode, offset = selection.focusOffset;
+    if (!node || selection.anchorNode != node || selection.anchorOffset != offset)
+        return false;
+    // Safari can report bogus offsets (#1152)
+    offset = Math.min(offset, maxOffset(node));
+    for (;;) {
+        if (offset) {
+            if (node.nodeType != 1)
+                return false;
+            let prev = node.childNodes[offset - 1];
+            if (prev.contentEditable == "false")
+                offset--;
+            else {
+                node = prev;
+                offset = maxOffset(node);
+            }
         }
-        return this.curLine;
-    }
-    flushBuffer(active = this.bufferMarks) {
-        if (this.pendingBuffer) {
-            this.curLine.append(wrapMarks(new WidgetBufferView(-1), active), active.length);
-            this.pendingBuffer = 0 /* Buf.No */;
+        else if (node == doc) {
+            return true;
+        }
+        else {
+            offset = domIndex(node);
+            node = node.parentNode;
         }
     }
-    addBlockWidget(view) {
-        this.flushBuffer();
-        this.curLine = null;
-        this.content.push(view);
-    }
-    finish(openEnd) {
-        if (this.pendingBuffer && openEnd <= this.bufferMarks.length)
-            this.flushBuffer();
-        else
-            this.pendingBuffer = 0 /* Buf.No */;
-        if (!this.posCovered() &&
-            !(openEnd && this.content.length && this.content[this.content.length - 1] instanceof BlockWidgetView))
-            this.getLine();
-    }
-    buildText(length, active, openStart) {
-        while (length > 0) {
-            if (this.textOff == this.text.length) {
-                let { value, lineBreak, done } = this.cursor.next(this.skip);
-                this.skip = 0;
-                if (done)
-                    throw new Error("Ran out of text content when drawing inline views");
-                if (lineBreak) {
-                    if (!this.posCovered())
-                        this.getLine();
-                    if (this.content.length)
-                        this.content[this.content.length - 1].breakAfter = 1;
-                    else
-                        this.breakAtStart = 1;
-                    this.flushBuffer();
-                    this.curLine = null;
-                    this.atCursorPos = true;
-                    length--;
-                    continue;
-                }
-                else {
-                    this.text = value;
-                    this.textOff = 0;
-                }
-            }
-            let remaining = Math.min(this.text.length - this.textOff, length);
-            let take = Math.min(remaining, 512 /* T.Chunk */);
-            this.flushBuffer(active.slice(active.length - openStart));
-            this.getLine().append(wrapMarks(new TextView(this.text.slice(this.textOff, this.textOff + take)), active), openStart);
-            this.atCursorPos = true;
-            this.textOff += take;
-            length -= take;
-            openStart = remaining <= take ? 0 : active.length;
+}
+function isScrolledToBottom(elt) {
+    return elt.scrollTop > Math.max(1, elt.scrollHeight - elt.clientHeight - 4);
+}
+function textNodeBefore(startNode, startOffset) {
+    for (let node = startNode, offset = startOffset;;) {
+        if (node.nodeType == 3 && offset > 0) {
+            return { node: node, offset: offset };
+        }
+        else if (node.nodeType == 1 && offset > 0) {
+            if (node.contentEditable == "false")
+                return null;
+            node = node.childNodes[offset - 1];
+            offset = maxOffset(node);
+        }
+        else if (node.parentNode && !isBlockElement(node)) {
+            offset = domIndex(node);
+            node = node.parentNode;
+        }
+        else {
+            return null;
         }
     }
-    span(from, to, active, openStart) {
-        this.buildText(to - from, active, openStart);
-        this.pos = to;
-        if (this.openStart < 0)
-            this.openStart = openStart;
-    }
-    point(from, to, deco, active, openStart, index) {
-        if (this.disallowBlockEffectsFor[index] && deco instanceof PointDecoration) {
-            if (deco.block)
-                throw new RangeError("Block decorations may not be specified via plugins");
-            if (to > this.doc.lineAt(this.pos).to)
-                throw new RangeError("Decorations that replace line breaks may not be specified via plugins");
-        }
-        let len = to - from;
-        if (deco instanceof PointDecoration) {
-            if (deco.block) {
-                if (deco.startSide > 0 && !this.posCovered())
-                    this.getLine();
-                this.addBlockWidget(new BlockWidgetView(deco.widget || NullWidget.block, len, deco));
-            }
-            else {
-                let view = WidgetView.create(deco.widget || NullWidget.inline, len, len ? 0 : deco.startSide);
-                let cursorBefore = this.atCursorPos && !view.isEditable && openStart <= active.length &&
-                    (from < to || deco.startSide > 0);
-                let cursorAfter = !view.isEditable && (from < to || openStart > active.length || deco.startSide <= 0);
-                let line = this.getLine();
-                if (this.pendingBuffer == 2 /* Buf.IfCursor */ && !cursorBefore && !view.isEditable)
-                    this.pendingBuffer = 0 /* Buf.No */;
-                this.flushBuffer(active);
-                if (cursorBefore) {
-                    line.append(wrapMarks(new WidgetBufferView(1), active), openStart);
-                    openStart = active.length + Math.max(0, openStart - active.length);
-                }
-                line.append(wrapMarks(view, active), openStart);
-                this.atCursorPos = cursorAfter;
-                this.pendingBuffer = !cursorAfter ? 0 /* Buf.No */ : from < to || openStart > active.length ? 1 /* Buf.Yes */ : 2 /* Buf.IfCursor */;
-                if (this.pendingBuffer)
-                    this.bufferMarks = active.slice();
-            }
-        }
-        else if (this.doc.lineAt(this.pos).from == this.pos) { // Line decoration
-            this.getLine().addLineDeco(deco);
-        }
-        if (len) {
-            // Advance the iterator past the replaced content
-            if (this.textOff + len <= this.text.length) {
-                this.textOff += len;
-            }
-            else {
-                this.skip += len - (this.text.length - this.textOff);
-                this.text = "";
-                this.textOff = 0;
-            }
-            this.pos = to;
+}
+function textNodeAfter(startNode, startOffset) {
+    for (let node = startNode, offset = startOffset;;) {
+        if (node.nodeType == 3 && offset < node.nodeValue.length) {
+            return { node: node, offset: offset };
+        }
+        else if (node.nodeType == 1 && offset < node.childNodes.length) {
+            if (node.contentEditable == "false")
+                return null;
+            node = node.childNodes[offset];
+            offset = 0;
+        }
+        else if (node.parentNode && !isBlockElement(node)) {
+            offset = domIndex(node) + 1;
+            node = node.parentNode;
+        }
+        else {
+            return null;
         }
-        if (this.openStart < 0)
-            this.openStart = openStart;
-    }
-    static build(text, from, to, decorations, dynamicDecorationMap) {
-        let builder = new ContentBuilder(text, from, to, dynamicDecorationMap);
-        builder.openEnd = state.RangeSet.spans(decorations, from, to, builder);
-        if (builder.openStart < 0)
-            builder.openStart = builder.openEnd;
-        builder.finish(builder.openEnd);
-        return builder;
     }
 }
-function wrapMarks(view, active) {
-    for (let mark of active)
-        view = new MarkView(mark, [view], view.length);
-    return view;
-}
-class NullWidget extends WidgetType {
-    constructor(tag) {
-        super();
-        this.tag = tag;
+class DOMPos {
+    constructor(node, offset, precise = true) {
+        this.node = node;
+        this.offset = offset;
+        this.precise = precise;
     }
-    eq(other) { return other.tag == this.tag; }
-    toDOM() { return document.createElement(this.tag); }
-    updateDOM(elt) { return elt.nodeName.toLowerCase() == this.tag; }
-    get isHidden() { return true; }
+    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); }
 }
-NullWidget.inline = new NullWidget("span");
-NullWidget.block = new NullWidget("div");
 
 /**
 Used to indicate [text direction](https://codemirror.net/6/docs/ref/#view.EditorView.textDirection).
@@ -2445,341 +1370,1467 @@ const viewPlugin = state.Facet.define({
             return true;
         });
     }
-});
+});
+/**
+View plugins associate stateful values with a view. They can
+influence the way the content is drawn, and are notified of things
+that happen in the view. They optionally take an argument, in
+which case you need to call [`of`](https://codemirror.net/6/docs/ref/#view.ViewPlugin.of) to create
+an extension for the plugin. When the argument type is undefined,
+you can use the plugin instance as an extension directly.
+*/
+class ViewPlugin {
+    constructor(
+    /**
+    @internal
+    */
+    id, 
+    /**
+    @internal
+    */
+    create, 
+    /**
+    @internal
+    */
+    domEventHandlers, 
+    /**
+    @internal
+    */
+    domEventObservers, buildExtensions) {
+        this.id = id;
+        this.create = create;
+        this.domEventHandlers = domEventHandlers;
+        this.domEventObservers = domEventObservers;
+        this.baseExtensions = buildExtensions(this);
+        this.extension = this.baseExtensions.concat(viewPlugin.of({ plugin: this, arg: undefined }));
+    }
+    /**
+    Create an extension for this plugin with the given argument.
+    */
+    of(arg) {
+        return this.baseExtensions.concat(viewPlugin.of({ plugin: this, arg }));
+    }
+    /**
+    Define a plugin from a constructor function that creates the
+    plugin's value, given an editor view.
+    */
+    static define(create, spec) {
+        const { eventHandlers, eventObservers, provide, decorations: deco } = spec || {};
+        return new ViewPlugin(nextPluginID++, create, eventHandlers, eventObservers, plugin => {
+            let ext = [];
+            if (deco)
+                ext.push(decorations.of(view => {
+                    let pluginInst = view.plugin(plugin);
+                    return pluginInst ? deco(pluginInst) : Decoration.none;
+                }));
+            if (provide)
+                ext.push(provide(plugin));
+            return ext;
+        });
+    }
+    /**
+    Create a plugin for a class whose constructor takes a single
+    editor view as argument.
+    */
+    static fromClass(cls, spec) {
+        return ViewPlugin.define((view, arg) => new cls(view, arg), spec);
+    }
+}
+class PluginInstance {
+    constructor(spec) {
+        this.spec = spec;
+        // When starting an update, all plugins have this field set to the
+        // update object, indicating they need to be updated. When finished
+        // updating, it is set to `null`. Retrieving a plugin that needs to
+        // be updated with `view.plugin` forces an eager update.
+        this.mustUpdate = null;
+        // This is null when the plugin is initially created, but
+        // initialized on the first update.
+        this.value = null;
+    }
+    get plugin() { return this.spec && this.spec.plugin; }
+    update(view) {
+        if (!this.value) {
+            if (this.spec) {
+                try {
+                    this.value = this.spec.plugin.create(view, this.spec.arg);
+                }
+                catch (e) {
+                    logException(view.state, e, "CodeMirror plugin crashed");
+                    this.deactivate();
+                }
+            }
+        }
+        else if (this.mustUpdate) {
+            let update = this.mustUpdate;
+            this.mustUpdate = null;
+            if (this.value.update) {
+                try {
+                    this.value.update(update);
+                }
+                catch (e) {
+                    logException(update.state, e, "CodeMirror plugin crashed");
+                    if (this.value.destroy)
+                        try {
+                            this.value.destroy();
+                        }
+                        catch (_) { }
+                    this.deactivate();
+                }
+            }
+        }
+        return this;
+    }
+    destroy(view) {
+        var _a;
+        if ((_a = this.value) === null || _a === void 0 ? void 0 : _a.destroy) {
+            try {
+                this.value.destroy();
+            }
+            catch (e) {
+                logException(view.state, e, "CodeMirror plugin crashed");
+            }
+        }
+    }
+    deactivate() {
+        this.spec = this.value = null;
+    }
+}
+const editorAttributes = state.Facet.define();
+const contentAttributes = state.Facet.define();
+// Provide decorations
+const decorations = state.Facet.define();
+const blockWrappers = state.Facet.define();
+const outerDecorations = state.Facet.define();
+const atomicRanges = state.Facet.define();
+const bidiIsolatedRanges = state.Facet.define();
+function getIsolatedRanges(view, line) {
+    let isolates = view.state.facet(bidiIsolatedRanges);
+    if (!isolates.length)
+        return isolates;
+    let sets = isolates.map(i => i instanceof Function ? i(view) : i);
+    let result = [];
+    state.RangeSet.spans(sets, line.from, line.to, {
+        point() { },
+        span(fromDoc, toDoc, active, open) {
+            let from = fromDoc - line.from, to = toDoc - line.from;
+            let level = result;
+            for (let i = active.length - 1; i >= 0; i--, open--) {
+                let direction = active[i].spec.bidiIsolate, update;
+                if (direction == null)
+                    direction = autoDirection(line.text, from, to);
+                if (open > 0 && level.length &&
+                    (update = level[level.length - 1]).to == from && update.direction == direction) {
+                    update.to = to;
+                    level = update.inner;
+                }
+                else {
+                    let add = { from, to, direction, inner: [] };
+                    level.push(add);
+                    level = add.inner;
+                }
+            }
+        }
+    });
+    return result;
+}
+const scrollMargins = state.Facet.define();
+function getScrollMargins(view) {
+    let left = 0, right = 0, top = 0, bottom = 0;
+    for (let source of view.state.facet(scrollMargins)) {
+        let m = source(view);
+        if (m) {
+            if (m.left != null)
+                left = Math.max(left, m.left);
+            if (m.right != null)
+                right = Math.max(right, m.right);
+            if (m.top != null)
+                top = Math.max(top, m.top);
+            if (m.bottom != null)
+                bottom = Math.max(bottom, m.bottom);
+        }
+    }
+    return { left, right, top, bottom };
+}
+const styleModule = state.Facet.define();
+class ChangedRange {
+    constructor(fromA, toA, fromB, toB) {
+        this.fromA = fromA;
+        this.toA = toA;
+        this.fromB = fromB;
+        this.toB = toB;
+    }
+    join(other) {
+        return new ChangedRange(Math.min(this.fromA, other.fromA), Math.max(this.toA, other.toA), Math.min(this.fromB, other.fromB), Math.max(this.toB, other.toB));
+    }
+    addToSet(set) {
+        let i = set.length, me = this;
+        for (; i > 0; i--) {
+            let range = set[i - 1];
+            if (range.fromA > me.toA)
+                continue;
+            if (range.toA < me.fromA)
+                break;
+            me = me.join(range);
+            set.splice(i - 1, 1);
+        }
+        set.splice(i, 0, me);
+        return set;
+    }
+    // Extend a set to cover all the content in `ranges`, which is a
+    // flat array with each pair of numbers representing fromB/toB
+    // positions. These pairs are generated in unchanged ranges, so the
+    // offset between doc A and doc B is the same for their start and
+    // end points.
+    static extendWithRanges(diff, ranges) {
+        if (ranges.length == 0)
+            return diff;
+        let result = [];
+        for (let dI = 0, rI = 0, off = 0;;) {
+            let nextD = dI < diff.length ? diff[dI].fromB : 1e9;
+            let nextR = rI < ranges.length ? ranges[rI] : 1e9;
+            let fromB = Math.min(nextD, nextR);
+            if (fromB == 1e9)
+                break;
+            let fromA = fromB + off, toB = fromB, toA = fromA;
+            for (;;) {
+                if (rI < ranges.length && ranges[rI] <= toB) {
+                    let end = ranges[rI + 1];
+                    rI += 2;
+                    toB = Math.max(toB, end);
+                    toA = Math.max(toA, end + off);
+                }
+                else if (dI < diff.length && diff[dI].fromB <= toB) {
+                    let next = diff[dI++];
+                    toB = Math.max(toB, next.toB);
+                    toA = Math.max(toA, next.toA);
+                    off = next.toA - next.toB;
+                }
+                else {
+                    break;
+                }
+            }
+            result.push(new ChangedRange(fromA, toA, fromB, toB));
+        }
+        return result;
+    }
+}
 /**
-View plugins associate stateful values with a view. They can
-influence the way the content is drawn, and are notified of things
-that happen in the view. They optionally take an argument, in
-which case you need to call [`of`](https://codemirror.net/6/docs/ref/#view.ViewPlugin.of) to create
-an extension for the plugin. When the argument type is undefined,
-you can use the plugin instance as an extension directly.
+View [plugins](https://codemirror.net/6/docs/ref/#view.ViewPlugin) are given instances of this
+class, which describe what happened, whenever the view is updated.
 */
-class ViewPlugin {
+class ViewUpdate {
     constructor(
     /**
-    @internal
+    The editor view that the update is associated with.
     */
-    id, 
+    view, 
     /**
-    @internal
+    The new editor state.
     */
-    create, 
+    state$1, 
     /**
-    @internal
+    The transactions involved in the update. May be empty.
     */
-    domEventHandlers, 
+    transactions) {
+        this.view = view;
+        this.state = state$1;
+        this.transactions = transactions;
+        /**
+        @internal
+        */
+        this.flags = 0;
+        this.startState = view.state;
+        this.changes = state.ChangeSet.empty(this.startState.doc.length);
+        for (let tr of transactions)
+            this.changes = this.changes.compose(tr.changes);
+        let changedRanges = [];
+        this.changes.iterChangedRanges((fromA, toA, fromB, toB) => changedRanges.push(new ChangedRange(fromA, toA, fromB, toB)));
+        this.changedRanges = changedRanges;
+    }
     /**
     @internal
     */
-    domEventObservers, buildExtensions) {
-        this.id = id;
-        this.create = create;
-        this.domEventHandlers = domEventHandlers;
-        this.domEventObservers = domEventObservers;
-        this.baseExtensions = buildExtensions(this);
-        this.extension = this.baseExtensions.concat(viewPlugin.of({ plugin: this, arg: undefined }));
+    static create(view, state, transactions) {
+        return new ViewUpdate(view, state, transactions);
     }
     /**
-    Create an extension for this plugin with the given argument.
+    Tells you whether the [viewport](https://codemirror.net/6/docs/ref/#view.EditorView.viewport) or
+    [visible ranges](https://codemirror.net/6/docs/ref/#view.EditorView.visibleRanges) changed in this
+    update.
     */
-    of(arg) {
-        return this.baseExtensions.concat(viewPlugin.of({ plugin: this, arg }));
+    get viewportChanged() {
+        return (this.flags & 4 /* UpdateFlag.Viewport */) > 0;
     }
     /**
-    Define a plugin from a constructor function that creates the
-    plugin's value, given an editor view.
+    Returns true when
+    [`viewportChanged`](https://codemirror.net/6/docs/ref/#view.ViewUpdate.viewportChanged) is true
+    and the viewport change is not just the result of mapping it in
+    response to document changes.
     */
-    static define(create, spec) {
-        const { eventHandlers, eventObservers, provide, decorations: deco } = spec || {};
-        return new ViewPlugin(nextPluginID++, create, eventHandlers, eventObservers, plugin => {
-            let ext = [];
-            if (deco)
-                ext.push(decorations.of(view => {
-                    let pluginInst = view.plugin(plugin);
-                    return pluginInst ? deco(pluginInst) : Decoration.none;
-                }));
-            if (provide)
-                ext.push(provide(plugin));
-            return ext;
-        });
+    get viewportMoved() {
+        return (this.flags & 8 /* UpdateFlag.ViewportMoved */) > 0;
     }
     /**
-    Create a plugin for a class whose constructor takes a single
-    editor view as argument.
+    Indicates whether the height of a block element in the editor
+    changed in this update.
     */
-    static fromClass(cls, spec) {
-        return ViewPlugin.define((view, arg) => new cls(view, arg), spec);
+    get heightChanged() {
+        return (this.flags & 2 /* UpdateFlag.Height */) > 0;
     }
+    /**
+    Returns true when the document was modified or the size of the
+    editor, or elements within the editor, changed.
+    */
+    get geometryChanged() {
+        return this.docChanged || (this.flags & (16 /* UpdateFlag.Geometry */ | 2 /* UpdateFlag.Height */)) > 0;
+    }
+    /**
+    True when this update indicates a focus change.
+    */
+    get focusChanged() {
+        return (this.flags & 1 /* UpdateFlag.Focus */) > 0;
+    }
+    /**
+    Whether the document changed in this update.
+    */
+    get docChanged() {
+        return !this.changes.empty;
+    }
+    /**
+    Whether the selection was explicitly set in this update.
+    */
+    get selectionSet() {
+        return this.transactions.some(tr => tr.selection);
+    }
+    /**
+    @internal
+    */
+    get empty() { return this.flags == 0 && this.transactions.length == 0; }
 }
-class PluginInstance {
-    constructor(spec) {
-        this.spec = spec;
-        // When starting an update, all plugins have this field set to the
-        // update object, indicating they need to be updated. When finished
-        // updating, it is set to `null`. Retrieving a plugin that needs to
-        // be updated with `view.plugin` forces an eager update.
-        this.mustUpdate = null;
-        // This is null when the plugin is initially created, but
-        // initialized on the first update.
-        this.value = null;
+
+const noChildren = [];
+class Tile {
+    constructor(dom, length, flags = 0) {
+        this.dom = dom;
+        this.length = length;
+        this.flags = flags;
+        this.parent = null;
+        dom.cmTile = this;
     }
-    get plugin() { return this.spec && this.spec.plugin; }
-    update(view) {
-        if (!this.value) {
-            if (this.spec) {
-                try {
-                    this.value = this.spec.plugin.create(view, this.spec.arg);
+    get breakAfter() { return (this.flags & 1 /* TileFlag.BreakAfter */); }
+    get children() { return noChildren; }
+    isWidget() { return false; }
+    get isHidden() { return false; }
+    isComposite() { return false; }
+    isLine() { return false; }
+    isText() { return false; }
+    isBlock() { return false; }
+    get domAttrs() { return null; }
+    sync() {
+        this.flags |= 2 /* TileFlag.Synced */;
+        if (this.flags & 4 /* TileFlag.AttrsDirty */) {
+            this.flags &= ~4 /* TileFlag.AttrsDirty */;
+            let attrs = this.domAttrs;
+            if (attrs)
+                setAttrs(this.dom, attrs);
+        }
+    }
+    toString() {
+        return this.constructor.name + (this.children.length ? `(${this.children})` : "") + (this.breakAfter ? "#" : "");
+    }
+    destroy() { this.parent = null; }
+    setDOM(dom) {
+        this.dom = dom;
+        dom.cmTile = this;
+    }
+    get posAtStart() {
+        return this.parent ? this.parent.posBefore(this) : 0;
+    }
+    get posAtEnd() {
+        return this.posAtStart + this.length;
+    }
+    posBefore(tile) {
+        let pos = this.posAtStart;
+        for (let child of this.children) {
+            if (child == tile)
+                return pos;
+            pos += child.length + child.breakAfter;
+        }
+        throw new RangeError("Invalid child in posBefore");
+    }
+    posAfter(tile) {
+        return this.posBefore(tile) + tile.length;
+    }
+    covers(side) { return true; }
+    coordsIn(pos, side) { return null; }
+    domPosFor(off, side) {
+        let index = domIndex(this.dom);
+        let after = this.length ? off > 0 : side > 0;
+        return new DOMPos(this.parent.dom, index + (after ? 1 : 0), off == 0 || off == this.length);
+    }
+    markDirty(attrs) {
+        this.flags &= ~2 /* TileFlag.Synced */;
+        if (attrs)
+            this.flags |= 4 /* TileFlag.AttrsDirty */;
+        if (this.parent && (this.parent.flags & 2 /* TileFlag.Synced */))
+            this.parent.markDirty(false);
+    }
+    get overrideDOMText() { return null; }
+    get root() {
+        for (let t = this; t; t = t.parent)
+            if (t instanceof DocTile)
+                return t;
+        return null;
+    }
+    static get(dom) {
+        return dom.cmTile;
+    }
+}
+class CompositeTile extends Tile {
+    constructor(dom) {
+        super(dom, 0);
+        this._children = [];
+    }
+    isComposite() { return true; }
+    get children() { return this._children; }
+    get lastChild() { return this.children.length ? this.children[this.children.length - 1] : null; }
+    append(child) {
+        this.children.push(child);
+        child.parent = this;
+    }
+    sync() {
+        if (this.flags & 2 /* TileFlag.Synced */)
+            return;
+        super.sync();
+        let parent = this.dom, prev = null, next;
+        let length = 0;
+        for (let child of this.children) {
+            child.sync();
+            length += child.length + child.breakAfter;
+            next = prev ? prev.nextSibling : parent.firstChild;
+            if (child.dom.parentNode == parent) {
+                while (next && next != child.dom)
+                    next = rm$1(next);
+            }
+            else {
+                parent.insertBefore(child.dom, next);
+            }
+            prev = child.dom;
+        }
+        next = prev ? prev.nextSibling : parent.firstChild;
+        while (next)
+            next = rm$1(next);
+        this.length = length;
+    }
+}
+// Remove a DOM node and return its next sibling.
+function rm$1(dom) {
+    let next = dom.nextSibling;
+    dom.parentNode.removeChild(dom);
+    return next;
+}
+// The top-level tile. Its dom property equals view.contentDOM.
+class DocTile extends CompositeTile {
+    constructor(view, dom) {
+        super(dom);
+        this.view = view;
+    }
+    owns(tile) {
+        for (; tile; tile = tile.parent)
+            if (tile == this)
+                return true;
+        return false;
+    }
+    isBlock() { return true; }
+    nearest(dom) {
+        for (;;) {
+            if (!dom)
+                return null;
+            let tile = Tile.get(dom);
+            if (tile && this.owns(tile))
+                return tile;
+            dom = dom.parentNode;
+        }
+    }
+    blockTiles(f) {
+        for (let stack = [], cur = this, i = 0, pos = 0;;) {
+            if (i == cur.children.length) {
+                if (!stack.length)
+                    return;
+                cur = cur.parent;
+                if (cur.breakAfter)
+                    pos++;
+                i = stack.pop();
+            }
+            else {
+                let next = cur.children[i++];
+                if (next instanceof BlockWrapperTile) {
+                    stack.push(i);
+                    cur = next;
+                    i = 0;
                 }
-                catch (e) {
-                    logException(view.state, e, "CodeMirror plugin crashed");
-                    this.deactivate();
+                else {
+                    let end = pos + next.length;
+                    let result = f(next, pos);
+                    if (result !== undefined)
+                        return result;
+                    pos = end + next.breakAfter;
+                }
+            }
+        }
+    }
+    // Find the block at the given position. If side < -1, make sure to
+    // stay before block widgets at that position, if side > 1, after
+    // such widgets (used for selection drawing, which needs to be able
+    // to get coordinates for positions that aren't valid cursor positions).
+    resolveBlock(pos, side) {
+        let before, beforeOff = -1, after, afterOff = -1;
+        this.blockTiles((tile, off) => {
+            let end = off + tile.length;
+            if (pos >= off && pos <= end) {
+                if (tile.isWidget() && side >= -1 && side <= 1) {
+                    if (tile.flags & 32 /* TileFlag.After */)
+                        return true;
+                    if (tile.flags & 16 /* TileFlag.Before */)
+                        before = undefined;
+                }
+                if ((off < pos || pos == end && (side < -1 ? tile.length : tile.covers(1))) &&
+                    (!before || !tile.isWidget() && before.isWidget())) {
+                    before = tile;
+                    beforeOff = pos - off;
+                }
+                if ((end > pos || pos == off && (side > 1 ? tile.length : tile.covers(-1))) &&
+                    (!after || !tile.isWidget() && after.isWidget())) {
+                    after = tile;
+                    afterOff = pos - off;
+                }
+            }
+        });
+        if (!before && !after)
+            throw new Error("No tile at position " + pos);
+        return before && side < 0 || !after ? { tile: before, offset: beforeOff } : { tile: after, offset: afterOff };
+    }
+}
+class BlockWrapperTile extends CompositeTile {
+    constructor(dom, wrapper) {
+        super(dom);
+        this.wrapper = wrapper;
+    }
+    isBlock() { return true; }
+    covers(side) {
+        if (!this.children.length)
+            return false;
+        return side < 0 ? this.children[0].covers(-1) : this.lastChild.covers(1);
+    }
+    get domAttrs() { return this.wrapper.attributes; }
+    static of(wrapper, dom) {
+        let tile = new BlockWrapperTile(dom || document.createElement(wrapper.tagName), wrapper);
+        if (!dom)
+            tile.flags |= 4 /* TileFlag.AttrsDirty */;
+        return tile;
+    }
+}
+class LineTile extends CompositeTile {
+    constructor(dom, attrs) {
+        super(dom);
+        this.attrs = attrs;
+    }
+    isLine() { return true; }
+    static start(attrs, dom, keepAttrs) {
+        let line = new LineTile(dom || document.createElement("div"), attrs);
+        if (!dom || !keepAttrs)
+            line.flags |= 4 /* TileFlag.AttrsDirty */;
+        return line;
+    }
+    get domAttrs() { return this.attrs; }
+    // Find the tile associated with a given position in this line.
+    resolveInline(pos, side, forCoords) {
+        let before = null, beforeOff = -1, after = null, afterOff = -1;
+        function scan(tile, pos) {
+            for (let i = 0, off = 0; i < tile.children.length && off <= pos; i++) {
+                let child = tile.children[i], end = off + child.length;
+                if (end >= pos) {
+                    if (child.isComposite()) {
+                        scan(child, pos - off);
+                    }
+                    else if ((!after || after.isHidden && (side > 0 || forCoords && onSameLine(after, child))) &&
+                        (end > pos || (child.flags & 32 /* TileFlag.After */))) {
+                        after = child;
+                        afterOff = pos - off;
+                    }
+                    else if (off < pos || (child.flags & 16 /* TileFlag.Before */) && !child.isHidden) {
+                        before = child;
+                        beforeOff = pos - off;
+                    }
+                }
+                off = end;
+            }
+        }
+        scan(this, pos);
+        let target = ((side < 0 ? before : after) || before || after);
+        return target ? { tile: target, offset: target == before ? beforeOff : afterOff } : null;
+    }
+    coordsIn(pos, side) {
+        let found = this.resolveInline(pos, side, true);
+        if (!found)
+            return fallbackRect(this);
+        return found.tile.coordsIn(Math.max(0, found.offset), side);
+    }
+    domIn(pos, side) {
+        let found = this.resolveInline(pos, side);
+        if (found) {
+            let { tile, offset } = found;
+            if (this.dom.contains(tile.dom)) {
+                if (tile.isText())
+                    return new DOMPos(tile.dom, Math.min(tile.dom.nodeValue.length, offset));
+                return tile.domPosFor(offset, side);
+            }
+            let parent = found.tile.parent, saw = false;
+            for (let ch of parent.children) {
+                if (saw)
+                    return new DOMPos(ch.dom, 0);
+                if (ch == found.tile) {
+                    saw = true;
+                }
+            }
+        }
+        return new DOMPos(this.dom, 0);
+    }
+}
+function fallbackRect(tile) {
+    let last = tile.dom.lastChild;
+    if (!last)
+        return tile.dom.getBoundingClientRect();
+    let rects = clientRectsFor(last);
+    return rects[rects.length - 1] || null;
+}
+function onSameLine(a, b) {
+    let posA = a.coordsIn(0, 1), posB = b.coordsIn(0, 1);
+    return posA && posB && posB.top < posA.bottom;
+}
+class MarkTile extends CompositeTile {
+    constructor(dom, mark) {
+        super(dom);
+        this.mark = mark;
+    }
+    get domAttrs() { return this.mark.attrs; }
+    static of(mark, dom) {
+        let tile = new MarkTile(dom || document.createElement(mark.tagName), mark);
+        if (!dom)
+            tile.flags |= 4 /* TileFlag.AttrsDirty */;
+        return tile;
+    }
+}
+class TextTile extends Tile {
+    constructor(dom, text) {
+        super(dom, text.length);
+        this.text = text;
+    }
+    sync() {
+        if (this.flags & 2 /* TileFlag.Synced */)
+            return;
+        super.sync();
+        if (this.dom.nodeValue != this.text)
+            this.dom.nodeValue = this.text;
+    }
+    isText() { return true; }
+    toString() { return JSON.stringify(this.text); }
+    coordsIn(pos, side) {
+        let length = this.dom.nodeValue.length;
+        if (pos > length)
+            pos = length;
+        let from = pos, to = pos, flatten = 0;
+        if (pos == 0 && side < 0 || pos == length && side >= 0) {
+            if (!(browser.chrome || browser.gecko)) { // These browsers reliably return valid rectangles for empty ranges
+                if (pos) {
+                    from--;
+                    flatten = 1;
+                } // FIXME this is wrong in RTL text
+                else if (to < length) {
+                    to++;
+                    flatten = -1;
                 }
             }
         }
-        else if (this.mustUpdate) {
-            let update = this.mustUpdate;
-            this.mustUpdate = null;
-            if (this.value.update) {
-                try {
-                    this.value.update(update);
-                }
-                catch (e) {
-                    logException(update.state, e, "CodeMirror plugin crashed");
-                    if (this.value.destroy)
-                        try {
-                            this.value.destroy();
-                        }
-                        catch (_) { }
-                    this.deactivate();
-                }
-            }
+        else {
+            if (side < 0)
+                from--;
+            else if (to < length)
+                to++;
         }
-        return this;
+        let rects = textRange(this.dom, from, to).getClientRects();
+        if (!rects.length)
+            return null;
+        let rect = rects[(flatten ? flatten < 0 : side >= 0) ? 0 : rects.length - 1];
+        if (browser.safari && !flatten && rect.width == 0)
+            rect = Array.prototype.find.call(rects, r => r.width) || rect;
+        return flatten ? flattenRect(rect, flatten < 0) : rect || null;
     }
-    destroy(view) {
-        var _a;
-        if ((_a = this.value) === null || _a === void 0 ? void 0 : _a.destroy) {
-            try {
-                this.value.destroy();
-            }
-            catch (e) {
-                logException(view.state, e, "CodeMirror plugin crashed");
+    static of(text, dom) {
+        let tile = new TextTile(dom || document.createTextNode(text), text);
+        if (!dom)
+            tile.flags |= 2 /* TileFlag.Synced */;
+        return tile;
+    }
+}
+class WidgetTile extends Tile {
+    constructor(dom, length, widget, flags) {
+        super(dom, length, flags);
+        this.widget = widget;
+    }
+    isWidget() { return true; }
+    get isHidden() { return this.widget.isHidden; }
+    covers(side) {
+        if (this.flags & 48 /* TileFlag.PointWidget */)
+            return false;
+        return (this.flags & (side < 0 ? 64 /* TileFlag.IncStart */ : 128 /* TileFlag.IncEnd */)) > 0;
+    }
+    coordsIn(pos, side) { return this.coordsInWidget(pos, side, false); }
+    coordsInWidget(pos, side, block) {
+        let custom = this.widget.coordsAt(this.dom, pos, side);
+        if (custom)
+            return custom;
+        if (block) {
+            return flattenRect(this.dom.getBoundingClientRect(), this.length ? pos == 0 : side <= 0);
+        }
+        else {
+            let rects = this.dom.getClientRects(), rect = null;
+            if (!rects.length)
+                return null;
+            let fromBack = (this.flags & 16 /* TileFlag.Before */) ? true : (this.flags & 32 /* TileFlag.After */) ? false : pos > 0;
+            for (let i = fromBack ? rects.length - 1 : 0;; i += (fromBack ? -1 : 1)) {
+                rect = rects[i];
+                if (pos > 0 ? i == 0 : i == rects.length - 1 || rect.top < rect.bottom)
+                    break;
             }
+            return flattenRect(rect, !fromBack);
         }
     }
-    deactivate() {
-        this.spec = this.value = null;
+    get overrideDOMText() {
+        if (!this.length)
+            return state.Text.empty;
+        let { root } = this;
+        if (!root)
+            return state.Text.empty;
+        let start = this.posAtStart;
+        return root.view.state.doc.slice(start, start + this.length);
+    }
+    destroy() {
+        super.destroy();
+        this.widget.destroy(this.dom);
+    }
+    static of(widget, view, length, flags, dom) {
+        if (!dom) {
+            dom = widget.toDOM(view);
+            if (!widget.editable)
+                dom.contentEditable = "false";
+        }
+        return new WidgetTile(dom, length, widget, flags);
     }
 }
-const editorAttributes = state.Facet.define();
-const contentAttributes = state.Facet.define();
-// Provide decorations
-const decorations = state.Facet.define();
-const outerDecorations = state.Facet.define();
-const atomicRanges = state.Facet.define();
-const bidiIsolatedRanges = state.Facet.define();
-function getIsolatedRanges(view, line) {
-    let isolates = view.state.facet(bidiIsolatedRanges);
-    if (!isolates.length)
-        return isolates;
-    let sets = isolates.map(i => i instanceof Function ? i(view) : i);
-    let result = [];
-    state.RangeSet.spans(sets, line.from, line.to, {
-        point() { },
-        span(fromDoc, toDoc, active, open) {
-            let from = fromDoc - line.from, to = toDoc - line.from;
-            let level = result;
-            for (let i = active.length - 1; i >= 0; i--, open--) {
-                let direction = active[i].spec.bidiIsolate, update;
-                if (direction == null)
-                    direction = autoDirection(line.text, from, to);
-                if (open > 0 && level.length &&
-                    (update = level[level.length - 1]).to == from && update.direction == direction) {
-                    update.to = to;
-                    level = update.inner;
+// 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 WidgetBufferTile extends Tile {
+    constructor(flags) {
+        let img = document.createElement("img");
+        img.className = "cm-widgetBuffer";
+        img.setAttribute("aria-hidden", "true");
+        super(img, 0, flags);
+    }
+    get isHidden() { return false; }
+    get overrideDOMText() { return state.Text.empty; }
+    coordsIn(pos) { return this.dom.getBoundingClientRect(); }
+}
+// Represents a position in the tile tree.
+class TilePointer {
+    constructor(top) {
+        this.index = 0;
+        this.beforeBreak = false;
+        this.parents = [];
+        this.tile = top;
+    }
+    // Advance by the given distance. If side is -1, stop leaving or
+    // entering tiles, or skipping zero-length tiles, once the distance
+    // has been traversed. When side is 1, leave, enter, or skip
+    // everything at the end position.
+    advance(dist, side, walker) {
+        let { tile, index, beforeBreak, parents } = this;
+        while (dist || side > 0) {
+            if (!tile.isComposite()) {
+                if (index == tile.length) {
+                    beforeBreak = !!tile.breakAfter;
+                    ({ tile, index } = parents.pop());
+                    index++;
+                }
+                else if (!dist) {
+                    break;
                 }
                 else {
-                    let add = { from, to, direction, inner: [] };
-                    level.push(add);
-                    level = add.inner;
+                    let take = Math.min(dist, tile.length - index);
+                    if (walker)
+                        walker.skip(tile, index, index + take);
+                    dist -= take;
+                    index += take;
+                }
+            }
+            else if (beforeBreak) {
+                if (!dist)
+                    break;
+                if (walker)
+                    walker.break();
+                dist--;
+                beforeBreak = false;
+            }
+            else if (index == tile.children.length) {
+                if (!dist && !parents.length)
+                    break;
+                if (walker)
+                    walker.leave(tile);
+                beforeBreak = !!tile.breakAfter;
+                ({ tile, index } = parents.pop());
+                index++;
+            }
+            else {
+                let next = tile.children[index], brk = next.breakAfter;
+                if ((side > 0 ? next.length <= dist : next.length < dist) &&
+                    (!walker || walker.skip(next, 0, next.length) !== false || !next.isComposite)) {
+                    beforeBreak = !!brk;
+                    index++;
+                    dist -= next.length;
+                }
+                else {
+                    parents.push({ tile, index });
+                    tile = next;
+                    index = 0;
+                    if (walker && next.isComposite())
+                        walker.enter(next);
                 }
             }
         }
-    });
-    return result;
+        this.tile = tile;
+        this.index = index;
+        this.beforeBreak = beforeBreak;
+        return this;
+    }
+    get root() { return (this.parents.length ? this.parents[0].tile : this.tile); }
 }
-const scrollMargins = state.Facet.define();
-function getScrollMargins(view) {
-    let left = 0, right = 0, top = 0, bottom = 0;
-    for (let source of view.state.facet(scrollMargins)) {
-        let m = source(view);
-        if (m) {
-            if (m.left != null)
-                left = Math.max(left, m.left);
-            if (m.right != null)
-                right = Math.max(right, m.right);
-            if (m.top != null)
-                top = Math.max(top, m.top);
-            if (m.bottom != null)
-                bottom = Math.max(bottom, m.bottom);
-        }
+
+// Used to track open block wrappers
+class OpenWrapper {
+    constructor(from, to, wrapper, rank) {
+        this.from = from;
+        this.to = to;
+        this.wrapper = wrapper;
+        this.rank = rank;
     }
-    return { left, right, top, bottom };
 }
-const styleModule = state.Facet.define();
-class ChangedRange {
-    constructor(fromA, toA, fromB, toB) {
-        this.fromA = fromA;
-        this.toA = toA;
-        this.fromB = fromB;
-        this.toB = toB;
+// This class builds up a new document tile using input from either
+// iteration over the old tree or iteration over the document +
+// decorations. The add* methods emit elements into the tile
+// structure. To avoid awkward synchronization issues, marks and block
+// wrappers are treated as belonging to to their content, rather than
+// opened/closed independently.
+//
+// All composite tiles that are touched by changes are rebuilt,
+// reusing as much of the old tree (either whole nodes or just DOM
+// elements) as possible. The new tree is built without the Synced
+// flag, and then synced (during which DOM parent/child relations are
+// fixed up, text nodes filled in, and attributes added) in a second
+// phase.
+class TileBuilder {
+    constructor(cache, root, blockWrappers) {
+        this.cache = cache;
+        this.root = root;
+        this.blockWrappers = blockWrappers;
+        this.curLine = null;
+        this.lastBlock = null;
+        this.afterWidget = null;
+        this.pos = 0;
+        this.wrappers = [];
+        this.wrapperPos = 0;
     }
-    join(other) {
-        return new ChangedRange(Math.min(this.fromA, other.fromA), Math.max(this.toA, other.toA), Math.min(this.fromB, other.fromB), Math.max(this.toB, other.toB));
+    addText(text, marks, openStart, tile) {
+        var _a;
+        this.flushBuffer();
+        let parent = this.ensureMarks(marks, openStart);
+        let prev = parent.lastChild;
+        if (prev && prev.isText() && !(prev.flags & 8 /* TileFlag.Composition */)) {
+            this.cache.reused.set(prev, 2 /* Reused.DOM */);
+            let tile = parent.children[parent.children.length - 1] = new TextTile(prev.dom, prev.text + text);
+            tile.parent = parent;
+        }
+        else {
+            parent.append(tile || TextTile.of(text, (_a = this.cache.find(TextTile)) === null || _a === void 0 ? void 0 : _a.dom));
+        }
+        this.pos += text.length;
+        this.afterWidget = null;
+    }
+    addComposition(composition, context) {
+        let line = this.curLine;
+        if (line.dom != context.line.dom) {
+            line.setDOM(this.cache.reused.has(context.line) ? freeNode(context.line.dom) : context.line.dom);
+            this.cache.reused.set(context.line, 2 /* Reused.DOM */);
+        }
+        let head = line;
+        for (let i = context.marks.length - 1; i >= 0; i--) {
+            let mark = context.marks[i];
+            let last = head.lastChild;
+            if (last instanceof MarkTile && last.mark.eq(mark.mark)) {
+                if (last.dom != mark.dom)
+                    last.setDOM(freeNode(mark.dom));
+                head = last;
+            }
+            else {
+                if (this.cache.reused.get(mark)) {
+                    let tile = Tile.get(mark.dom);
+                    if (tile)
+                        tile.setDOM(freeNode(mark.dom));
+                }
+                let nw = MarkTile.of(mark.mark, mark.dom);
+                head.append(nw);
+                head = nw;
+            }
+            this.cache.reused.set(mark, 2 /* Reused.DOM */);
+        }
+        let text = new TextTile(composition.text, composition.text.nodeValue);
+        text.flags |= 8 /* TileFlag.Composition */;
+        head.append(text);
     }
-    addToSet(set) {
-        let i = set.length, me = this;
-        for (; i > 0; i--) {
-            let range = set[i - 1];
-            if (range.fromA > me.toA)
-                continue;
-            if (range.toA < me.fromA)
-                break;
-            me = me.join(range);
-            set.splice(i - 1, 1);
+    addInlineWidget(widget, marks, openStart) {
+        // Adjacent same-side-facing non-replacing widgets don't need buffers between them
+        let noSpace = this.afterWidget && (widget.flags & 48 /* TileFlag.PointWidget */) &&
+            (this.afterWidget.flags & 48 /* TileFlag.PointWidget */) == (widget.flags & 48 /* TileFlag.PointWidget */);
+        if (!noSpace)
+            this.flushBuffer();
+        let parent = this.ensureMarks(marks, openStart);
+        if (!noSpace && !(widget.flags & 16 /* TileFlag.Before */))
+            parent.append(this.getBuffer(1));
+        parent.append(widget);
+        this.pos += widget.length;
+        this.afterWidget = widget;
+    }
+    addMark(tile, marks, openStart) {
+        this.flushBuffer();
+        let parent = this.ensureMarks(marks, openStart);
+        parent.append(tile);
+        this.pos += tile.length;
+        this.afterWidget = null;
+    }
+    addBlockWidget(widget) {
+        this.getBlockPos().append(widget);
+        this.pos += widget.length;
+        this.lastBlock = widget;
+        this.endLine();
+    }
+    continueWidget(length) {
+        let widget = this.afterWidget || this.lastBlock;
+        widget.length += length;
+        this.pos += length;
+    }
+    addLineStart(attrs, dom) {
+        var _a;
+        if (!attrs)
+            attrs = lineBaseAttrs;
+        let tile = LineTile.start(attrs, dom || ((_a = this.cache.find(LineTile)) === null || _a === void 0 ? void 0 : _a.dom), !!dom);
+        this.getBlockPos().append(this.lastBlock = this.curLine = tile);
+    }
+    addLine(tile) {
+        this.getBlockPos().append(tile);
+        this.pos += tile.length;
+        this.lastBlock = tile;
+        this.endLine();
+    }
+    addBreak() {
+        this.lastBlock.flags |= 1 /* TileFlag.BreakAfter */;
+        this.endLine();
+        this.pos++;
+    }
+    addLineStartIfNotCovered(attrs) {
+        if (!this.blockPosCovered())
+            this.addLineStart(attrs);
+    }
+    ensureLine(attrs) {
+        if (!this.curLine)
+            this.addLineStart(attrs);
+    }
+    ensureMarks(marks, openStart) {
+        var _a;
+        let parent = this.curLine;
+        for (let i = marks.length - 1; i >= 0; i--) {
+            let mark = marks[i], last;
+            if (openStart > 0 && (last = parent.lastChild) && last instanceof MarkTile && last.mark.eq(mark)) {
+                parent = last;
+                openStart--;
+            }
+            else {
+                let tile = MarkTile.of(mark, (_a = this.cache.find(MarkTile, m => m.mark.eq(mark))) === null || _a === void 0 ? void 0 : _a.dom);
+                parent.append(tile);
+                parent = tile;
+                openStart = 0;
+            }
         }
-        set.splice(i, 0, me);
-        return set;
+        return parent;
     }
-    static extendWithRanges(diff, ranges) {
-        if (ranges.length == 0)
-            return diff;
-        let result = [];
-        for (let dI = 0, rI = 0, posA = 0, posB = 0;; dI++) {
-            let next = dI == diff.length ? null : diff[dI], off = posA - posB;
-            let end = next ? next.fromB : 1e9;
-            while (rI < ranges.length && ranges[rI] < end) {
-                let from = ranges[rI], to = ranges[rI + 1];
-                let fromB = Math.max(posB, from), toB = Math.min(end, to);
-                if (fromB <= toB)
-                    new ChangedRange(fromB + off, toB + off, fromB, toB).addToSet(result);
-                if (to > end)
-                    break;
-                else
-                    rI += 2;
+    endLine() {
+        if (this.curLine) {
+            this.flushBuffer();
+            let last = this.curLine.lastChild;
+            if (!last || !hasContent(this.curLine, false) ||
+                last.dom.nodeName != "BR" && last.isWidget() && !(browser.ios && hasContent(this.curLine, true)))
+                this.curLine.append(this.cache.findWidget(BreakWidget, 0, 32 /* TileFlag.After */) ||
+                    new WidgetTile(BreakWidget.toDOM(), 0, BreakWidget, 32 /* TileFlag.After */));
+            this.curLine = this.afterWidget = null;
+        }
+    }
+    updateBlockWrappers() {
+        if (this.wrapperPos > this.pos + 10000 /* C.WrapperReset */) {
+            this.blockWrappers.goto(this.pos);
+            this.wrappers.length = 0;
+        }
+        for (let i = this.wrappers.length - 1; i >= 0; i--)
+            if (this.wrappers[i].to < this.pos)
+                this.wrappers.splice(i, 1);
+        for (let cur = this.blockWrappers; cur.value && cur.from <= this.pos; cur.next())
+            if (cur.to >= this.pos) {
+                let wrap = new OpenWrapper(cur.from, cur.to, cur.value, cur.rank), i = this.wrappers.length;
+                while (i > 0 && this.wrappers[i - 1].rank < wrap.rank)
+                    i--;
+                this.wrappers.splice(i, 0, wrap);
+            }
+        this.wrapperPos = this.pos;
+    }
+    getBlockPos() {
+        var _a;
+        this.updateBlockWrappers();
+        let parent = this.root;
+        for (let wrap of this.wrappers) {
+            let last = parent.lastChild;
+            if (wrap.from < this.pos && last instanceof BlockWrapperTile && last.wrapper.eq(wrap.wrapper)) {
+                parent = last;
+            }
+            else {
+                let tile = BlockWrapperTile.of(wrap.wrapper, (_a = this.cache.find(BlockWrapperTile, t => t.wrapper.eq(wrap.wrapper))) === null || _a === void 0 ? void 0 : _a.dom);
+                parent.append(tile);
+                parent = tile;
             }
-            if (!next)
-                return result;
-            new ChangedRange(next.fromA, next.toA, next.fromB, next.toB).addToSet(result);
-            posA = next.toA;
-            posB = next.toB;
         }
+        return parent;
     }
-}
-/**
-View [plugins](https://codemirror.net/6/docs/ref/#view.ViewPlugin) are given instances of this
-class, which describe what happened, whenever the view is updated.
-*/
-class ViewUpdate {
-    constructor(
-    /**
-    The editor view that the update is associated with.
-    */
-    view, 
-    /**
-    The new editor state.
-    */
-    state$1, 
-    /**
-    The transactions involved in the update. May be empty.
-    */
-    transactions) {
-        this.view = view;
-        this.state = state$1;
-        this.transactions = transactions;
-        /**
-        @internal
-        */
-        this.flags = 0;
-        this.startState = view.state;
-        this.changes = state.ChangeSet.empty(this.startState.doc.length);
-        for (let tr of transactions)
-            this.changes = this.changes.compose(tr.changes);
-        let changedRanges = [];
-        this.changes.iterChangedRanges((fromA, toA, fromB, toB) => changedRanges.push(new ChangedRange(fromA, toA, fromB, toB)));
-        this.changedRanges = changedRanges;
+    blockPosCovered() {
+        let last = this.lastBlock;
+        return last != null && !last.breakAfter && (!last.isWidget() || (last.flags & (32 /* TileFlag.After */ | 128 /* TileFlag.IncEnd */)) > 0);
     }
-    /**
-    @internal
-    */
-    static create(view, state, transactions) {
-        return new ViewUpdate(view, state, transactions);
+    getBuffer(side) {
+        let flags = 2 /* TileFlag.Synced */ | (side < 0 ? 16 /* TileFlag.Before */ : 32 /* TileFlag.After */);
+        let found = this.cache.find(WidgetBufferTile, undefined, 1 /* Reused.Full */);
+        if (found)
+            found.flags = flags;
+        return found || new WidgetBufferTile(flags);
     }
-    /**
-    Tells you whether the [viewport](https://codemirror.net/6/docs/ref/#view.EditorView.viewport) or
-    [visible ranges](https://codemirror.net/6/docs/ref/#view.EditorView.visibleRanges) changed in this
-    update.
-    */
-    get viewportChanged() {
-        return (this.flags & 4 /* UpdateFlag.Viewport */) > 0;
+    flushBuffer() {
+        if (this.afterWidget && !(this.afterWidget.flags & 32 /* TileFlag.After */)) {
+            this.afterWidget.parent.append(this.getBuffer(-1));
+            this.afterWidget = null;
+        }
     }
-    /**
-    Returns true when
-    [`viewportChanged`](https://codemirror.net/6/docs/ref/#view.ViewUpdate.viewportChanged) is true
-    and the viewport change is not just the result of mapping it in
-    response to document changes.
-    */
-    get viewportMoved() {
-        return (this.flags & 8 /* UpdateFlag.ViewportMoved */) > 0;
+}
+// Helps getting efficient access to the document text.
+class TextStream {
+    constructor(doc) {
+        this.skipCount = 0;
+        this.text = "";
+        this.textOff = 0;
+        this.cursor = doc.iter();
     }
-    /**
-    Indicates whether the height of a block element in the editor
-    changed in this update.
-    */
-    get heightChanged() {
-        return (this.flags & 2 /* UpdateFlag.Height */) > 0;
+    skip(len) {
+        // Advance the iterator past the replaced content
+        if (this.textOff + len <= this.text.length) {
+            this.textOff += len;
+        }
+        else {
+            this.skipCount += len - (this.text.length - this.textOff);
+            this.text = "";
+            this.textOff = 0;
+        }
+    }
+    next(maxLen) {
+        if (this.textOff == this.text.length) {
+            let { value, lineBreak, done } = this.cursor.next(this.skipCount);
+            this.skipCount = 0;
+            if (done)
+                throw new Error("Ran out of text content when drawing inline views");
+            this.text = value;
+            let len = this.textOff = Math.min(maxLen, value.length);
+            return lineBreak ? null : value.slice(0, len);
+        }
+        let end = Math.min(this.text.length, this.textOff + maxLen);
+        let chars = this.text.slice(this.textOff, end);
+        this.textOff = end;
+        return chars;
+    }
+}
+// Assign the tile classes bucket numbers for caching.
+const buckets = [WidgetTile, LineTile, TextTile, MarkTile, WidgetBufferTile, BlockWrapperTile, DocTile];
+for (let i = 0; i < buckets.length; i++)
+    buckets[i].bucket = i;
+// Leaf tiles and line tiles may be reused in their entirety. All
+// others will get new tiles allocated, using the old DOM when
+// possible.
+class TileCache {
+    constructor(view) {
+        this.view = view;
+        // Buckets are circular buffers, using `index` as the current
+        // position.
+        this.buckets = buckets.map(() => []);
+        this.index = buckets.map(() => 0);
+        this.reused = new Map;
+    }
+    // Put a tile in the cache.
+    add(tile) {
+        let i = tile.constructor.bucket, bucket = this.buckets[i];
+        if (bucket.length < 6 /* C.Bucket */)
+            bucket.push(tile);
+        else
+            bucket[this.index[i] = (this.index[i] + 1) % 6 /* C.Bucket */] = tile;
+    }
+    find(cls, test, type = 2 /* Reused.DOM */) {
+        let i = cls.bucket;
+        let bucket = this.buckets[i], off = this.index[i];
+        for (let j = bucket.length - 1; j >= 0; j--) {
+            // Look at the most recently added items first (last-in, first-out)
+            let index = (j + off) % bucket.length, tile = bucket[index];
+            if ((!test || test(tile)) && !this.reused.has(tile)) {
+                bucket.splice(index, 1);
+                if (index < off)
+                    this.index[i]--;
+                this.reused.set(tile, type);
+                return tile;
+            }
+        }
+        return null;
+    }
+    findWidget(widget, length, flags) {
+        let widgets = this.buckets[0];
+        if (widgets.length)
+            for (let i = 0, pass = 0;; i++) {
+                if (i == widgets.length) {
+                    if (pass)
+                        return null;
+                    pass = 1;
+                    i = 0;
+                }
+                let tile = widgets[i];
+                if (!this.reused.has(tile) &&
+                    (pass == 0 ? tile.widget.compare(widget)
+                        : tile.widget.constructor == widget.constructor && widget.updateDOM(tile.dom, this.view))) {
+                    widgets.splice(i, 1);
+                    if (i < this.index[0])
+                        this.index[0]--;
+                    this.reused.set(tile, 1 /* Reused.Full */);
+                    tile.length = length;
+                    tile.flags = (tile.flags & ~(496 /* TileFlag.Widget */ | 1 /* TileFlag.BreakAfter */)) | flags;
+                    return tile;
+                }
+            }
     }
-    /**
-    Returns true when the document was modified or the size of the
-    editor, or elements within the editor, changed.
-    */
-    get geometryChanged() {
-        return this.docChanged || (this.flags & (16 /* UpdateFlag.Geometry */ | 2 /* UpdateFlag.Height */)) > 0;
+    reuse(tile) {
+        this.reused.set(tile, 1 /* Reused.Full */);
+        return tile;
     }
-    /**
-    True when this update indicates a focus change.
-    */
-    get focusChanged() {
-        return (this.flags & 1 /* UpdateFlag.Focus */) > 0;
+    maybeReuse(tile, type = 2 /* Reused.DOM */) {
+        if (this.reused.has(tile))
+            return undefined;
+        this.reused.set(tile, type);
+        return tile.dom;
     }
-    /**
-    Whether the document changed in this update.
-    */
-    get docChanged() {
-        return !this.changes.empty;
+}
+// This class organizes a pass over the document, guided by the array
+// of replaced ranges. For ranges that haven't changed, it iterates
+// the old tree and copies its content into the new document. For
+// changed ranges, it runs a decoration iterator to guide generation
+// of content.
+class TileUpdate {
+    constructor(view, old, blockWrappers, decorations, disallowBlockEffectsFor) {
+        this.view = view;
+        this.decorations = decorations;
+        this.disallowBlockEffectsFor = disallowBlockEffectsFor;
+        this.openWidget = false;
+        this.openMarks = 0;
+        this.cache = new TileCache(view);
+        this.text = new TextStream(view.state.doc);
+        this.builder = new TileBuilder(this.cache, new DocTile(view, view.contentDOM), state.RangeSet.iter(blockWrappers));
+        this.cache.reused.set(old, 2 /* Reused.DOM */);
+        this.old = new TilePointer(old);
+    }
+    run(changes, composition) {
+        let compositionContext = composition && this.getCompositionContext(composition.text);
+        for (let posA = 0, posB = 0, i = 0;;) {
+            let next = i < changes.length ? changes[i++] : null;
+            let skipA = next ? next.fromA : this.old.root.length;
+            if (skipA > posA) {
+                let len = skipA - posA;
+                this.preserve(len, !i, !next);
+                posA = skipA;
+                posB += len;
+            }
+            if (!next)
+                break;
+            this.forward(next.fromA, next.toA);
+            // Compositions need to be handled specially, forcing the
+            // focused text node and its parent nodes to remain stable at
+            // that point in the document.
+            if (composition && next.fromA <= composition.range.fromA && next.toA >= composition.range.toA) {
+                this.emit(posB, composition.range.fromB);
+                this.builder.addComposition(composition, compositionContext);
+                this.emit(composition.range.toB, next.toB);
+            }
+            else {
+                this.emit(posB, next.toB);
+            }
+            posB = next.toB;
+            posA = next.toA;
+        }
+        if (this.builder.curLine)
+            this.builder.endLine();
+        return this.builder.root;
+    }
+    preserve(length, incStart, incEnd) {
+        let activeMarks = getMarks(this.old), openMarks = this.openMarks;
+        this.old.advance(length, incEnd ? 1 : -1, {
+            skip: (tile, from, to) => {
+                if (tile.isWidget()) {
+                    if (this.openWidget) {
+                        this.builder.continueWidget(to - from);
+                    }
+                    else {
+                        let widget = to > 0 || from < tile.length
+                            ? WidgetTile.of(tile.widget, this.view, to - from, tile.flags & 496 /* TileFlag.Widget */, this.cache.maybeReuse(tile))
+                            : this.cache.reuse(tile);
+                        if (widget.flags & 256 /* TileFlag.Block */) {
+                            widget.flags &= ~1 /* TileFlag.BreakAfter */;
+                            this.builder.addBlockWidget(widget);
+                        }
+                        else {
+                            this.builder.addInlineWidget(widget, activeMarks, openMarks);
+                            openMarks = activeMarks.length;
+                        }
+                    }
+                }
+                else if (tile.isText()) {
+                    if (!from && to == tile.length) {
+                        this.builder.addText(tile.text, activeMarks, openMarks, this.cache.reuse(tile));
+                    }
+                    else {
+                        this.cache.add(tile);
+                        this.builder.addText(tile.text.slice(from, to), activeMarks, openMarks);
+                    }
+                    openMarks = activeMarks.length;
+                }
+                else if (tile.isLine()) {
+                    tile.flags &= ~1 /* TileFlag.BreakAfter */;
+                    this.cache.reused.set(tile, 1 /* Reused.Full */);
+                    this.builder.addLine(tile);
+                }
+                else if (tile instanceof WidgetBufferTile) {
+                    this.cache.add(tile);
+                }
+                else if (tile instanceof MarkTile) {
+                    this.builder.addMark(tile, activeMarks, openMarks);
+                    this.cache.reused.set(tile, 1 /* Reused.Full */);
+                }
+                else {
+                    return false;
+                }
+                this.openWidget = false;
+            },
+            enter: (tile) => {
+                if (tile.isLine()) {
+                    this.builder.addLineStart(tile.attrs, this.cache.maybeReuse(tile));
+                }
+                else {
+                    this.cache.add(tile);
+                    if (tile instanceof MarkTile)
+                        activeMarks.unshift(tile.mark);
+                }
+                this.openWidget = false;
+            },
+            leave: (tile) => {
+                if (tile.isLine()) {
+                    if (activeMarks.length)
+                        activeMarks.length = openMarks = 0;
+                }
+                else if (tile instanceof MarkTile) {
+                    activeMarks.shift();
+                    openMarks = Math.min(openMarks, activeMarks.length);
+                }
+            },
+            break: () => {
+                this.builder.addBreak();
+                this.openWidget = false;
+            },
+        });
+        this.text.skip(length);
+    }
+    emit(from, to) {
+        let pendingLineAttrs = null;
+        let b = this.builder, markCount = 0;
+        let openEnd = state.RangeSet.spans(this.decorations, from, to, {
+            point: (from, to, deco, active, openStart, index) => {
+                if (deco instanceof PointDecoration) {
+                    if (this.disallowBlockEffectsFor[index]) {
+                        if (deco.block)
+                            throw new RangeError("Block decorations may not be specified via plugins");
+                        if (to > this.view.state.doc.lineAt(from).to)
+                            throw new RangeError("Decorations that replace line breaks may not be specified via plugins");
+                    }
+                    markCount = active.length;
+                    if (openStart > active.length) {
+                        b.continueWidget(to - from);
+                    }
+                    else {
+                        let widget = deco.widget || (deco.block ? NullWidget.block : NullWidget.inline);
+                        let flags = widgetFlags(deco);
+                        let tile = this.cache.findWidget(widget, to - from, flags) || WidgetTile.of(widget, this.view, to - from, flags);
+                        if (deco.block) {
+                            if (deco.startSide > 0)
+                                b.addLineStartIfNotCovered(pendingLineAttrs);
+                            b.addBlockWidget(tile);
+                        }
+                        else {
+                            b.ensureLine(pendingLineAttrs);
+                            b.addInlineWidget(tile, active, openStart);
+                        }
+                    }
+                    pendingLineAttrs = null;
+                }
+                else {
+                    pendingLineAttrs = addLineDeco(pendingLineAttrs, deco);
+                }
+                if (to > from)
+                    this.text.skip(to - from);
+            },
+            span: (from, to, active, openStart) => {
+                for (let pos = from; pos < to;) {
+                    let chars = this.text.next(Math.min(512 /* C.Chunk */, to - pos));
+                    if (chars == null) { // Line break
+                        b.addLineStartIfNotCovered(pendingLineAttrs);
+                        b.addBreak();
+                        pos++;
+                    }
+                    else {
+                        b.ensureLine(pendingLineAttrs);
+                        b.addText(chars, active, openStart);
+                        pos += chars.length;
+                    }
+                    pendingLineAttrs = null;
+                }
+            }
+        });
+        b.addLineStartIfNotCovered(pendingLineAttrs);
+        this.openWidget = openEnd > markCount;
+        this.openMarks = openEnd;
+    }
+    forward(from, to) {
+        this.old.advance(to - from, 1, {
+            skip: (tile, from, to) => {
+                if (tile.isText() || to == tile.length)
+                    this.cache.add(tile);
+            },
+            enter: tile => this.cache.add(tile),
+            leave: () => { },
+            break: () => { }
+        });
     }
-    /**
-    Whether the selection was explicitly set in this update.
-    */
-    get selectionSet() {
-        return this.transactions.some(tr => tr.selection);
+    getCompositionContext(text) {
+        let marks = [], line = null;
+        for (let parent = text.parentNode;; parent = parent.parentNode) {
+            let tile = Tile.get(parent);
+            if (parent == this.view.contentDOM)
+                break;
+            if (tile instanceof MarkTile)
+                marks.push(tile);
+            else if (tile === null || tile === void 0 ? void 0 : tile.isLine())
+                line = tile;
+            else if (parent.nodeName == "DIV" && !line && parent != this.view.contentDOM)
+                line = new LineTile(parent, lineBaseAttrs);
+            else
+                marks.push(MarkTile.of(new MarkDecoration({ tagName: parent.nodeName.toLowerCase(), attributes: getAttrs(parent) }), parent));
+        }
+        return { line: line, marks };
     }
-    /**
-    @internal
-    */
-    get empty() { return this.flags == 0 && this.transactions.length == 0; }
 }
+function hasContent(tile, requireText) {
+    let scan = (tile) => {
+        for (let ch of tile.children)
+            if ((requireText ? ch.isText() : ch.length) || scan(ch))
+                return true;
+        return false;
+    };
+    return scan(tile);
+}
+function widgetFlags(deco) {
+    let flags = deco.isReplace ? (deco.startSide < 0 ? 64 /* TileFlag.IncStart */ : 0) | (deco.endSide > 0 ? 128 /* TileFlag.IncEnd */ : 0)
+        : (deco.startSide > 0 ? 32 /* TileFlag.After */ : 16 /* TileFlag.Before */);
+    if (deco.block)
+        flags |= 256 /* TileFlag.Block */;
+    return flags;
+}
+const lineBaseAttrs = { class: "cm-line" };
+function addLineDeco(value, deco) {
+    let attrs = deco.spec.attributes, cls = deco.spec.class;
+    if (!attrs && !cls)
+        return value;
+    if (!value)
+        value = { class: "cm-line" };
+    if (attrs)
+        combineAttrs(attrs, value);
+    if (cls)
+        value.class += " " + cls;
+    return value;
+}
+function getMarks(ptr) {
+    let found = [];
+    for (let i = ptr.parents.length; i > 1; i--) {
+        let tile = i == ptr.parents.length ? ptr.tile : ptr.parents[i].tile;
+        if (tile instanceof MarkTile)
+            found.push(tile.mark);
+    }
+    return found;
+}
+function freeNode(node) {
+    let tile = Tile.get(node);
+    if (tile)
+        tile.setDOM(node.cloneNode());
+    return node;
+}
+class NullWidget extends WidgetType {
+    constructor(tag) {
+        super();
+        this.tag = tag;
+    }
+    eq(other) { return other.tag == this.tag; }
+    toDOM() { return document.createElement(this.tag); }
+    updateDOM(elt) { return elt.nodeName.toLowerCase() == this.tag; }
+    get isHidden() { return true; }
+}
+NullWidget.inline = new NullWidget("span");
+NullWidget.block = new NullWidget("div");
+const BreakWidget = new class extends WidgetType {
+    toDOM() { return document.createElement("br"); }
+    get isHidden() { return true; }
+    get editable() { return true; }
+};
 
-class DocView extends ContentView {
-    get length() { return this.view.state.doc.length; }
+class DocView {
     constructor(view) {
-        super();
         this.view = view;
         this.decorations = [];
+        this.blockWrappers = [];
         this.dynamicDecorationMap = [false];
         this.domChanged = null;
         this.hasComposition = null;
-        this.markedForComposition = new Set;
         this.editContextFormatting = Decoration.none;
         this.lastCompositionAfterCursor = false;
         // Track a minimum width for the editor. When measuring sizes in
@@ -2800,11 +2851,9 @@ class DocView extends ContentView {
         // 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.updateDeco();
-        this.updateInner([new ChangedRange(0, 0, 0, view.state.doc.length)], 0, null);
+        this.tile = new DocTile(view, view.contentDOM);
+        this.updateInner([new ChangedRange(0, 0, 0, view.state.doc.length)], null);
     }
     // Update the document view to a given state.
     update(update) {
@@ -2830,7 +2879,6 @@ class DocView extends ContentView {
         let composition = readCompositionAt > -1 ? findCompositionRange(this.view, update.changes, readCompositionAt) : null;
         this.domChanged = null;
         if (this.hasComposition) {
-            this.markedForComposition.clear();
             let { from, to } = this.hasComposition;
             changedRanges = new ChangedRange(from, to, update.changes.mapPos(from, -1), update.changes.mapPos(to, 1))
                 .addToSet(changedRanges.slice());
@@ -2844,14 +2892,21 @@ class DocView extends ContentView {
         if ((browser.ie || browser.chrome) && !composition && 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.flags & 7 /* ViewFlag.Dirty */) && changedRanges.length == 0) {
+        let prevDeco = this.decorations, prevWrappers = this.blockWrappers;
+        this.updateDeco();
+        let decoDiff = findChangedDeco(prevDeco, this.decorations, update.changes);
+        if (decoDiff.length)
+            changedRanges = ChangedRange.extendWithRanges(changedRanges, decoDiff);
+        let blockDiff = findChangedWrappers(prevWrappers, this.blockWrappers, update.changes);
+        if (blockDiff.length)
+            changedRanges = ChangedRange.extendWithRanges(changedRanges, blockDiff);
+        if (composition && !changedRanges.some(r => r.fromA <= composition.range.fromA && r.toA >= composition.range.toA))
+            changedRanges = composition.range.addToSet(changedRanges.slice());
+        if ((this.tile.flags & 2 /* TileFlag.Synced */) && changedRanges.length == 0) {
             return false;
         }
         else {
-            this.updateInner(changedRanges, update.startState.doc.length, composition);
+            this.updateInner(changedRanges, composition);
             if (update.transactions.length)
                 this.lastUpdate = Date.now();
             return true;
@@ -2859,76 +2914,39 @@ class DocView extends ContentView {
     }
     // Used by update and the constructor do perform the actual DOM
     // update
-    updateInner(changes, oldLength, composition) {
+    updateInner(changes, composition) {
         this.view.viewState.mustMeasureContent = true;
-        this.updateChildren(changes, oldLength, composition);
         let { observer } = this.view;
         observer.ignore(() => {
+            if (composition || changes.length) {
+                let oldTile = this.tile;
+                let builder = new TileUpdate(this.view, oldTile, this.blockWrappers, this.decorations, this.dynamicDecorationMap);
+                this.tile = builder.run(changes, composition);
+                destroyDropped(oldTile, builder.cache.reused);
+            }
             // 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 / this.view.scaleY + "px";
-            this.dom.style.flexBasis = this.minWidth ? this.minWidth + "px" : "";
+            this.tile.dom.style.height = this.view.viewState.contentHeight / this.view.scaleY + "px";
+            this.tile.dom.style.flexBasis = 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(this.view, track);
-            this.flags &= ~7 /* ViewFlag.Dirty */;
+            this.tile.sync();
             if (track && (track.written || observer.selectionRange.focusNode != track.node))
                 this.forceSelection = true;
-            this.dom.style.height = "";
+            this.tile.dom.style.height = "";
         });
-        this.markedForComposition.forEach(cView => cView.flags &= ~8 /* ViewFlag.Composition */);
         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)
+            for (let child of this.tile.children)
+                if (child.isWidget() && child.widget instanceof BlockGapWidget)
                     gaps.push(child.dom);
         observer.updateGaps(gaps);
     }
-    updateChildren(changes, oldLength, composition) {
-        let ranges = composition ? composition.range.addToSet(changes.slice()) : changes;
-        let cursor = this.childCursor(oldLength);
-        for (let i = ranges.length - 1;; i--) {
-            let next = i >= 0 ? ranges[i] : null;
-            if (!next)
-                break;
-            let { fromA, toA, fromB, toB } = next, content, breakAtStart, openStart, openEnd;
-            if (composition && composition.range.fromB < toB && composition.range.toB > fromB) {
-                let before = ContentBuilder.build(this.view.state.doc, fromB, composition.range.fromB, this.decorations, this.dynamicDecorationMap);
-                let after = ContentBuilder.build(this.view.state.doc, composition.range.toB, toB, this.decorations, this.dynamicDecorationMap);
-                breakAtStart = before.breakAtStart;
-                openStart = before.openStart;
-                openEnd = after.openEnd;
-                let compLine = this.compositionView(composition);
-                if (after.breakAtStart) {
-                    compLine.breakAfter = 1;
-                }
-                else if (after.content.length &&
-                    compLine.merge(compLine.length, compLine.length, after.content[0], false, after.openStart, 0)) {
-                    compLine.breakAfter = after.content[0].breakAfter;
-                    after.content.shift();
-                }
-                if (before.content.length &&
-                    compLine.merge(0, 0, before.content[before.content.length - 1], true, 0, before.openEnd)) {
-                    before.content.pop();
-                }
-                content = before.content.concat(compLine).concat(after.content);
-            }
-            else {
-                ({ content, breakAtStart, openStart, openEnd } =
-                    ContentBuilder.build(this.view.state.doc, fromB, toB, this.decorations, this.dynamicDecorationMap));
-            }
-            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 (composition)
-            this.fixCompositionDOM(composition);
-    }
     updateEditContextFormatting(update) {
         this.editContextFormatting = this.editContextFormatting.map(update.changes);
         for (let tr of update.transactions)
@@ -2937,47 +2955,26 @@ class DocView extends ContentView {
                     this.editContextFormatting = effect.value;
                 }
     }
-    compositionView(composition) {
-        let cur = new TextView(composition.text.nodeValue);
-        cur.flags |= 8 /* ViewFlag.Composition */;
-        for (let { deco } of composition.marks)
-            cur = new MarkView(deco, [cur], cur.length);
-        let line = new LineView;
-        line.append(cur, 0);
-        return line;
-    }
-    fixCompositionDOM(composition) {
-        let fix = (dom, cView) => {
-            cView.flags |= 8 /* ViewFlag.Composition */ | (cView.children.some(c => c.flags & 7 /* ViewFlag.Dirty */) ? 1 /* ViewFlag.ChildDirty */ : 0);
-            this.markedForComposition.add(cView);
-            let prev = ContentView.get(dom);
-            if (prev && prev != cView)
-                prev.dom = null;
-            cView.setDOM(dom);
-        };
-        let pos = this.childPos(composition.range.fromB, 1);
-        let cView = this.children[pos.i];
-        fix(composition.line, cView);
-        for (let i = composition.marks.length - 1; i >= -1; i--) {
-            pos = cView.childPos(pos.off, 1);
-            cView = cView.children[pos.i];
-            fix(i >= 0 ? composition.marks[i].node : composition.text, cView);
-        }
-    }
     // Sync the DOM selection to this.state.selection
     updateSelection(mustRead = false, fromPointer = false) {
         if (mustRead || !this.view.observer.selectionRange.focusNode)
             this.view.observer.readSelectionRange();
-        let activeElt = this.view.root.activeElement, focused = activeElt == this.dom;
-        let selectionNotFocus = !focused && !(this.view.state.facet(editable) || this.dom.tabIndex > -1) &&
-            hasSelection(this.dom, this.view.observer.selectionRange) && !(activeElt && this.dom.contains(activeElt));
+        let { dom } = this.tile;
+        let activeElt = this.view.root.activeElement, focused = activeElt == dom;
+        let selectionNotFocus = !focused && !(this.view.state.facet(editable) || dom.tabIndex > -1) &&
+            hasSelection(dom, this.view.observer.selectionRange) && !(activeElt && dom.contains(activeElt));
         if (!(focused || fromPointer || selectionNotFocus))
             return;
         let force = this.forceSelection;
         this.forceSelection = false;
-        let main = this.view.state.selection.main;
-        let anchor = this.moveToLine(this.domAtPos(main.anchor));
-        let head = main.empty ? anchor : this.moveToLine(this.domAtPos(main.head));
+        let main = this.view.state.selection.main, anchor, head;
+        if (main.empty) {
+            head = anchor = this.inlineDOMNearPos(main.anchor, main.assoc || 1);
+        }
+        else {
+            head = this.inlineDOMNearPos(main.head, main.head == main.from ? 1 : -1);
+            anchor = this.inlineDOMNearPos(main.anchor, main.anchor == main.from ? 1 : -1);
+        }
         // Always reset on Firefox when next to an uneditable node to
         // avoid invisible cursor bugs (#111)
         if (browser.gecko && main.empty && !this.hasComposition && betweenUneditable(anchor)) {
@@ -2995,10 +2992,10 @@ class DocView extends ContentView {
                 // 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 });
+                if (browser.android && browser.chrome && dom.contains(domSel.focusNode) &&
+                    inUneditable(domSel.focusNode, dom)) {
+                    dom.blur();
+                    dom.focus({ preventScroll: true });
                 }
                 let rawSel = getSelection(this.view.root);
                 if (!rawSel) ;
@@ -3039,8 +3036,8 @@ class DocView extends ContentView {
                     rawSel.removeAllRanges();
                     rawSel.addRange(range);
                 }
-                if (selectionNotFocus && this.view.root.activeElement == this.dom) {
-                    this.dom.blur();
+                if (selectionNotFocus && this.view.root.activeElement == dom) {
+                    dom.blur();
                     if (activeElt)
                         activeElt.focus();
                 }
@@ -3066,7 +3063,7 @@ class DocView extends ContentView {
         let { anchorNode, anchorOffset } = view.observer.selectionRange;
         if (!sel || !cursor.empty || !cursor.assoc || !sel.modify)
             return;
-        let line = LineView.find(this, cursor.head);
+        let line = this.lineAt(cursor.head);
         if (!line)
             return;
         let lineStart = line.posAtStart;
@@ -3075,7 +3072,7 @@ class DocView extends ContentView {
         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);
+        let dom = this.domAtPos(cursor.head + cursor.assoc, cursor.assoc);
         sel.collapse(dom.node, dom.offset);
         sel.modify("move", cursor.assoc < 0 ? "forward" : "backward", "lineboundary");
         // This can go wrong in corner cases like single-character lines,
@@ -3085,143 +3082,213 @@ class DocView extends ContentView {
         if (view.docView.posFromDOM(newRange.anchorNode, newRange.anchorOffset) != cursor.from)
             sel.collapse(anchorNode, anchorOffset);
     }
-    // If a position is in/near a block widget, move it to a nearby text
-    // line, since we don't want the cursor inside a block widget.
-    moveToLine(pos) {
-        // Block widgets will return positions before/after them, which
-        // are thus directly in the document DOM element.
-        let dom = this.dom, newPos;
-        if (pos.node != dom)
-            return pos;
-        for (let i = pos.offset; !newPos && i < dom.childNodes.length; i++) {
-            let view = ContentView.get(dom.childNodes[i]);
-            if (view instanceof LineView)
-                newPos = view.domAtPos(0);
+    posFromDOM(node, offset) {
+        let tile = this.tile.nearest(node);
+        if (!tile)
+            return this.tile.dom.compareDocumentPosition(node) & 2 /* PRECEDING */ ? 0 : this.view.state.doc.length;
+        let start = tile.posAtStart;
+        if (tile.isComposite()) {
+            let after;
+            if (node == tile.dom) {
+                after = tile.dom.childNodes[offset];
+            }
+            else {
+                let bias = maxOffset(node) == 0 ? 0 : offset == 0 ? -1 : 1;
+                for (;;) {
+                    let parent = node.parentNode;
+                    if (parent == tile.dom)
+                        break;
+                    if (bias == 0 && parent.firstChild != parent.lastChild) {
+                        if (node == parent.firstChild)
+                            bias = -1;
+                        else
+                            bias = 1;
+                    }
+                    node = parent;
+                }
+                if (bias < 0)
+                    after = node;
+                else
+                    after = node.nextSibling;
+            }
+            if (after == tile.dom.firstChild)
+                return start;
+            while (after && !Tile.get(after))
+                after = after.nextSibling;
+            if (!after)
+                return start + tile.length;
+            for (let i = 0, pos = start;; i++) {
+                let child = tile.children[i];
+                if (child.dom == after)
+                    return pos;
+                pos += child.length + child.breakAfter;
+            }
         }
-        for (let i = pos.offset - 1; !newPos && i >= 0; i--) {
-            let view = ContentView.get(dom.childNodes[i]);
-            if (view instanceof LineView)
-                newPos = view.domAtPos(view.length);
+        else if (tile.isText()) {
+            return node == tile.dom ? start + offset : start + (offset ? tile.length : 0);
         }
-        return newPos ? new DOMPos(newPos.node, newPos.offset, true) : pos;
-    }
-    nearest(dom) {
-        for (let cur = dom; cur;) {
-            let domView = ContentView.get(cur);
-            if (domView && domView.rootView == this)
-                return domView;
-            cur = cur.parentNode;
+        else {
+            return start;
         }
-        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);
+    domAtPos(pos, side) {
+        let { tile, offset } = this.tile.resolveBlock(pos, side);
+        if (tile.isWidget())
+            return tile.domPosFor(pos, side);
+        return tile.domIn(offset, side);
     }
-    coordsAt(pos, side) {
-        let best = null, bestPos = 0;
-        for (let off = this.length, i = this.children.length - 1; i >= 0; i--) {
-            let child = this.children[i], end = off - child.breakAfter, start = end - child.length;
-            if (end < pos)
-                break;
-            if (start <= pos && (start < pos || child.covers(-1)) && (end > pos || child.covers(1)) &&
-                (!best || child instanceof LineView && !(best instanceof LineView && side >= 0))) {
-                best = child;
-                bestPos = start;
+    inlineDOMNearPos(pos, side) {
+        let before, beforeOff = -1, beforeBad = false;
+        let after, afterOff = -1, afterBad = false;
+        this.tile.blockTiles((tile, off) => {
+            if (tile.isWidget()) {
+                if ((tile.flags & 32 /* TileFlag.After */) && before)
+                    return true;
+                if (tile.flags & 16 /* TileFlag.Before */)
+                    beforeBad = true;
             }
-            else if (best && start == pos && end == pos && child instanceof BlockWidgetView && Math.abs(side) < 2) {
-                if (child.deco.startSide < 0)
-                    break;
-                else if (i)
-                    best = null;
+            else {
+                let end = off + tile.length;
+                if (off <= pos) {
+                    before = tile;
+                    beforeOff = pos - off;
+                    beforeBad = end < pos;
+                }
+                if (end >= pos && !after) {
+                    after = tile;
+                    afterOff = pos - off;
+                    afterBad = off > pos;
+                }
+                if (off > pos && after)
+                    return true;
             }
-            off = start;
+        });
+        if (!before && !after)
+            return this.domAtPos(pos, side);
+        if (beforeBad && after)
+            before = null;
+        else if (afterBad && before)
+            after = null;
+        return before && side < 0 || !after ? before.domIn(beforeOff, side) : after.domIn(afterOff, side);
+    }
+    coordsAt(pos, side) {
+        let { tile, offset } = this.tile.resolveBlock(pos, side);
+        if (tile.isWidget()) {
+            if (tile.widget instanceof BlockGapWidget)
+                return null;
+            return tile.coordsInWidget(offset, side, true);
         }
-        return best ? best.coordsAt(pos - bestPos, side) : null;
+        return tile.coordsIn(offset, side);
+    }
+    lineAt(pos) {
+        let { tile } = this.tile.resolveBlock(pos, 1);
+        return tile.isLine() ? tile : null;
     }
     coordsForChar(pos) {
-        let { i, off } = this.childPos(pos, 1), child = this.children[i];
-        if (!(child instanceof LineView))
+        let { tile, offset } = this.tile.resolveBlock(pos, 1);
+        if (!tile.isLine())
             return null;
-        while (child.children.length) {
-            let { i, off: childOff } = child.childPos(off, 1);
-            for (;; i++) {
-                if (i == child.children.length)
+        function scan(tile, offset) {
+            if (tile.isComposite()) {
+                for (let ch of tile.children) {
+                    if (ch.length >= offset) {
+                        let found = scan(ch, offset);
+                        if (found)
+                            return found;
+                    }
+                    offset -= ch.length;
+                    if (offset < 0)
+                        break;
+                }
+            }
+            else if (tile.isText() && offset < tile.length) {
+                let end = state.findClusterBreak(tile.text, offset);
+                if (end == offset)
                     return null;
-                if ((child = child.children[i]).length)
-                    break;
+                let rects = textRange(tile.dom, offset, end).getClientRects();
+                for (let i = 0; i < rects.length; i++) {
+                    let rect = rects[i];
+                    if (i == rects.length - 1 || rect.top < rect.bottom && rect.left < rect.right)
+                        return rect;
+                }
             }
-            off = childOff;
-        }
-        if (!(child instanceof TextView))
             return null;
-        let end = state.findClusterBreak(child.text, off);
-        if (end == off)
-            return null;
-        let rects = textRange(child.dom, off, end).getClientRects();
-        for (let i = 0; i < rects.length; i++) {
-            let rect = rects[i];
-            if (i == rects.length - 1 || rect.top < rect.bottom && rect.left < rect.right)
-                return rect;
         }
-        return null;
+        return scan(tile, offset);
     }
     measureVisibleLineHeights(viewport) {
         let result = [], { from, to } = viewport;
         let contentWidth = this.view.contentDOM.clientWidth;
         let isWider = contentWidth > Math.max(this.view.scrollDOM.clientWidth, this.minWidth) + 1;
         let widest = -1, ltr = this.view.textDirection == exports.Direction.LTR;
-        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 = ltr ? rect.right - childRect.left : childRect.right - rect.left;
-                        if (width > widest) {
-                            widest = width;
-                            this.minWidth = contentWidth;
-                            this.minWidthFrom = pos;
-                            this.minWidthTo = end;
+        let spaceAbove = 0;
+        let scan = (tile, pos, measureBounds) => {
+            for (let i = 0; i < tile.children.length; i++) {
+                if (pos > to)
+                    break;
+                let child = tile.children[i], end = pos + child.length;
+                if (child instanceof BlockWrapperTile) {
+                    if (end > from)
+                        scan(child, pos, child.dom.getBoundingClientRect());
+                }
+                else if (pos >= from) {
+                    let childRect = child.dom.getBoundingClientRect(), { height } = childRect;
+                    if (measureBounds && !i)
+                        spaceAbove += childRect.top - measureBounds.top;
+                    if (spaceAbove > 0)
+                        result.push(-spaceAbove);
+                    result.push(height + spaceAbove);
+                    spaceAbove = 0;
+                    if (measureBounds && i == tile.children.length - 1)
+                        spaceAbove += measureBounds.bottom - childRect.bottom;
+                    if (isWider) {
+                        let last = child.dom.lastChild;
+                        let rects = last ? clientRectsFor(last) : [];
+                        if (rects.length) {
+                            let rect = rects[rects.length - 1];
+                            let width = ltr ? rect.right - childRect.left : childRect.right - rect.left;
+                            if (width > widest) {
+                                widest = width;
+                                this.minWidth = contentWidth;
+                                this.minWidthFrom = pos;
+                                this.minWidthTo = end;
+                            }
                         }
                     }
                 }
+                pos = end + child.breakAfter;
             }
-            pos = end + child.breakAfter;
-        }
+        };
+        scan(this.tile, 0, null);
         return result;
     }
     textDirectionAt(pos) {
-        let { i } = this.childPos(pos, 1);
-        return getComputedStyle(this.children[i].dom).direction == "rtl" ? exports.Direction.RTL : exports.Direction.LTR;
+        let { tile } = this.tile.resolveBlock(pos, 1);
+        return getComputedStyle(tile.dom).direction == "rtl" ? exports.Direction.RTL : exports.Direction.LTR;
     }
     measureTextSize() {
-        for (let child of this.children) {
-            if (child instanceof LineView) {
-                let measure = child.measureTextSize();
-                if (measure)
-                    return measure;
+        let lineMeasure = this.tile.blockTiles(tile => {
+            if (tile.isLine() && tile.children.length && tile.length <= 20) {
+                let totalWidth = 0, textHeight;
+                for (let child of tile.children) {
+                    if (!child.isText() || /[^ -~]/.test(child.text))
+                        return undefined;
+                    let rects = clientRectsFor(child.dom);
+                    if (rects.length != 1)
+                        return undefined;
+                    totalWidth += rects[0].width;
+                    textHeight = rects[0].height;
+                }
+                if (totalWidth)
+                    return {
+                        lineHeight: tile.dom.getBoundingClientRect().height,
+                        charWidth: totalWidth / tile.length,
+                        textHeight
+                    };
             }
-        }
+        });
+        if (lineMeasure)
+            return lineMeasure;
         // If no workable line exists, force a layout of a measurable element
         let dummy = document.createElement("div"), lineHeight, charWidth, textHeight;
         dummy.className = "cm-line";
@@ -3229,7 +3296,7 @@ class DocView extends ContentView {
         dummy.style.position = "absolute";
         dummy.textContent = "abc def ghi jkl mno pqr stu";
         this.view.observer.ignore(() => {
-            this.dom.appendChild(dummy);
+            this.tile.dom.appendChild(dummy);
             let rect = clientRectsFor(dummy.firstChild)[0];
             lineHeight = dummy.getBoundingClientRect().height;
             charWidth = rect ? rect.width / 27 : 7;
@@ -3238,20 +3305,11 @@ class DocView extends ContentView {
         });
         return { lineHeight, charWidth, textHeight };
     }
-    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);
-    }
     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;
+            let end = next ? next.from - 1 : this.view.state.doc.length;
             if (end > pos) {
                 let height = (vs.lineBlockAt(end).bottom - vs.lineBlockAt(pos).top) / this.view.scaleY;
                 deco.push(Decoration.replace({
@@ -3291,7 +3349,7 @@ class DocView extends ContentView {
         ];
         while (i < this.decorations.length)
             this.dynamicDecorationMap[i++] = false;
-        return this.decorations;
+        this.blockWrappers = this.view.state.facet(blockWrappers).map(v => typeof v == "function" ? v(this.view) : v);
     }
     scrollIntoView(target) {
         if (target.isSnapshot) {
@@ -3325,11 +3383,20 @@ class DocView extends ContentView {
         scrollRectIntoView(this.view.scrollDOM, targetRect, range.head < range.anchor ? -1 : 1, target.x, target.y, Math.max(Math.min(target.xMargin, offsetWidth), -offsetWidth), Math.max(Math.min(target.yMargin, offsetHeight), -offsetHeight), this.view.textDirection == exports.Direction.LTR);
     }
     lineHasWidget(pos) {
-        let { i } = this.childCursor().findPos(pos);
-        if (i == this.children.length)
-            return false;
-        let scan = (child) => child instanceof WidgetView || child.children.some(scan);
-        return scan(this.children[i]);
+        let scan = (child) => child.isWidget() || child.children.some(scan);
+        return scan(this.tile.resolveBlock(pos, 1).tile);
+    }
+    destroy() {
+        destroyDropped(this.tile);
+    }
+}
+function destroyDropped(tile, reused) {
+    let r = reused === null || reused === void 0 ? void 0 : reused.get(tile);
+    if (r != 1 /* Reused.Full */) {
+        if (r == null)
+            tile.destroy();
+        for (let ch of tile.children)
+            destroyDropped(ch, reused);
     }
 }
 function betweenUneditable(pos) {
@@ -3345,13 +3412,13 @@ function findCompositionNode(view, headPos) {
     let textAfter = textNodeAfter(sel.focusNode, sel.focusOffset);
     let textNode = textBefore || textAfter;
     if (textAfter && textBefore && textAfter.node != textBefore.node) {
-        let descAfter = ContentView.get(textAfter.node);
-        if (!descAfter || descAfter instanceof TextView && descAfter.text != textAfter.node.nodeValue) {
+        let tileAfter = Tile.get(textAfter.node);
+        if (!tileAfter || tileAfter.isText() && tileAfter.text != textAfter.node.nodeValue) {
             textNode = textAfter;
         }
         else if (view.docView.lastCompositionAfterCursor) {
-            let descBefore = ContentView.get(textBefore.node);
-            if (!(!descBefore || descBefore instanceof TextView && descBefore.text != textBefore.node.nodeValue))
+            let tileBefore = Tile.get(textBefore.node);
+            if (!(!tileBefore || tileBefore.isText() && tileBefore.text != textBefore.node.nodeValue))
                 textNode = textAfter;
         }
     }
@@ -3372,23 +3439,7 @@ function findCompositionRange(view, changes, headPos) {
     if (view.state.doc.sliceString(found.from, found.to) != text)
         return null;
     let inv = changes.invertedDesc;
-    let range = new ChangedRange(inv.mapPos(from), inv.mapPos(to), from, to);
-    let marks = [];
-    for (let parent = textNode.parentNode;; parent = parent.parentNode) {
-        let parentView = ContentView.get(parent);
-        if (parentView instanceof MarkView)
-            marks.push({ node: parent, deco: parentView.mark });
-        else if (parentView instanceof LineView || parent.nodeName == "DIV" && parent.parentNode == view.contentDOM)
-            return { range, text: textNode, marks, line: parent };
-        else if (parent != view.contentDOM)
-            marks.push({ node: parent, deco: new MarkDecoration({
-                    inclusive: true,
-                    attributes: getAttrs(parent),
-                    tagName: parent.tagName.toLowerCase()
-                }) });
-        else
-            return null;
-    }
+    return { range: new ChangedRange(inv.mapPos(from), inv.mapPos(to), from, to), text: textNode };
 }
 function nextToUneditable(node, offset) {
     if (node.nodeType != 1)
@@ -3409,6 +3460,19 @@ function findChangedDeco(a, b, diff) {
     state.RangeSet.compare(a, b, diff, comp);
     return comp.changes;
 }
+class WrapperComparator {
+    constructor() {
+        this.changes = [];
+    }
+    compareRange(from, to) { addRange(from, to, this.changes); }
+    comparePoint() { }
+    boundChange(pos) { addRange(pos, pos, this.changes); }
+}
+function findChangedWrappers(a, b, diff) {
+    let comp = new WrapperComparator;
+    state.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') {
@@ -3426,6 +3490,26 @@ function touchesComposition(changes, composition) {
         });
     return touched;
 }
+class BlockGapWidget extends WidgetType {
+    constructor(height) {
+        super();
+        this.height = height;
+    }
+    toDOM() {
+        let elt = document.createElement("div");
+        elt.className = "cm-gap";
+        this.updateDOM(elt);
+        return elt;
+    }
+    eq(other) { return other.height == this.height; }
+    updateDOM(elt) {
+        elt.style.height = this.height + "px";
+        return true;
+    }
+    get editable() { return true; }
+    get estimatedHeight() { return this.height; }
+    ignoreEvent() { return false; }
+}
 
 function groupAt(state$1, pos, bias = 1) {
     let categorize = state$1.charCategorizer(pos);
@@ -3561,7 +3645,7 @@ function domPosInText(node, x, y) {
     return { node, offset: closestOffset > -1 ? closestOffset : generalSide > 0 ? node.nodeValue.length : 0 };
 }
 function posAtCoords(view, coords, precise, bias = -1) {
-    var _a, _b;
+    var _a;
     let content = view.contentDOM.getBoundingClientRect(), docTop = content.top + view.viewState.paddingTop;
     let block, { docHeight } = view.viewState;
     let { x, y } = coords, yOffset = y - docTop;
@@ -3611,7 +3695,7 @@ function posAtCoords(view, coords, precise, bias = -1) {
     // There's visible editor content under the point, so we can try
     // using caret(Position|Range)FromPoint as a shortcut
     let node, offset = -1;
-    if (element && ((_a = view.docView.nearest(element)) === null || _a === void 0 ? void 0 : _a.isEditable) != false) {
+    if (element && !((_a = view.docView.tile.nearest(element)) === null || _a === void 0 ? void 0 : _a.isWidget())) {
         if (doc.caretPositionFromPoint) {
             let pos = doc.caretPositionFromPoint(x, y);
             if (pos)
@@ -3633,23 +3717,21 @@ function posAtCoords(view, coords, precise, bias = -1) {
             offset = Math.min(maxOffset(node), offset);
     }
     // No luck, do our own (potentially expensive) search
-    if (!node || !view.docView.dom.contains(node)) {
-        let line = LineView.find(view.docView, lineStart);
+    if (!node || !view.contentDOM.contains(node)) {
+        let line = view.docView.lineAt(lineStart);
         if (!line)
             return yOffset > block.top + block.height / 2 ? block.to : block.from;
         ({ node, offset } = domPosAtCoords(line.dom, x, y));
     }
-    let nearest = view.docView.nearest(node);
+    let nearest = view.docView.tile.nearest(node);
     if (!nearest)
         return null;
-    if (nearest.isWidget && ((_b = nearest.dom) === null || _b === void 0 ? void 0 : _b.nodeType) == 1) {
+    if (nearest.isWidget()) {
         let rect = nearest.dom.getBoundingClientRect();
         return coords.y < rect.top || coords.y <= rect.bottom && coords.x <= (rect.left + rect.right) / 2
             ? nearest.posAtStart : nearest.posAtEnd;
     }
-    else {
-        return nearest.localPosFromDOM(node, offset) + nearest.posAtStart;
-    }
+    return view.docView.posFromDOM(node, offset);
 }
 function posAtCoordsImprecise(view, contentRect, block, x, y) {
     let into = Math.round((x - contentRect.left) * view.defaultCharacterWidth);
@@ -3865,13 +3947,16 @@ class DOMReader {
             this.findPointBefore(parent, cur);
             let oldLen = this.text.length;
             this.readNode(cur);
-            let next = cur.nextSibling;
-            if (next == end)
+            let tile = Tile.get(cur), next = cur.nextSibling;
+            if (next == end) {
+                if (tile === null || tile === void 0 ? void 0 : tile.breakAfter)
+                    this.lineBreak();
                 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.length > oldLen)) &&
+            }
+            let nextTile = Tile.get(next);
+            if ((tile && nextTile ? tile.breakAfter :
+                (tile ? tile.breakAfter : isBlockElement(cur)) ||
+                    (isBlockElement(next) && (cur.nodeName != "BR" || (tile === null || tile === void 0 ? void 0 : tile.isWidget())) && this.text.length > oldLen)) &&
                 !isEmptyToEnd(next, end))
                 this.lineBreak();
             cur = next;
@@ -3906,10 +3991,8 @@ class DOMReader {
         }
     }
     readNode(node) {
-        if (node.cmIgnore)
-            return;
-        let view = ContentView.get(node);
-        let fromView = view && view.overrideDOMText;
+        let tile = Tile.get(node);
+        let fromView = tile && tile.overrideDOMText;
         if (fromView != null) {
             this.findPointInside(node, fromView.length);
             for (let i = fromView.iter(); !i.next().done;) {
@@ -3956,8 +4039,8 @@ function isEmptyToEnd(node, end) {
     for (;; node = node.nextSibling) {
         if (node == end || !node)
             break;
-        let view = ContentView.get(node);
-        if (!((view === null || view === void 0 ? void 0 : view.isWidget) || node.cmIgnore))
+        let view = Tile.get(node);
+        if (!(view === null || view === void 0 ? void 0 : view.isWidget()))
             return false;
         if (view)
             (widgets || (widgets = [])).push(view);
@@ -3989,7 +4072,7 @@ class DOMChange {
             // Ignore changes when the editor is read-only
             this.newSel = null;
         }
-        else if (start > -1 && (this.bounds = view.docView.domBoundsAround(start, end, 0))) {
+        else if (start > -1 && (this.bounds = domBoundsAround(view.docView.tile, start, end, 0))) {
             let selPoints = iHead || iAnchor ? [] : selectionPoints(view);
             let reader = new DOMReader(selPoints, view.state);
             reader.readRange(this.bounds.startDOM, this.bounds.endDOM);
@@ -4027,6 +4110,36 @@ class DOMChange {
         }
     }
 }
+function domBoundsAround(tile, from, to, offset) {
+    if (tile.isComposite()) {
+        let fromI = -1, fromStart = -1, toI = -1, toEnd = -1;
+        for (let i = 0, pos = offset, prevEnd = offset; i < tile.children.length; i++) {
+            let child = tile.children[i], end = pos + child.length;
+            if (pos < from && end > to)
+                return domBoundsAround(child, from, to, pos);
+            if (end >= from && fromI == -1) {
+                fromI = i;
+                fromStart = pos;
+            }
+            if (pos > to && child.dom.parentNode == tile.dom) {
+                toI = i;
+                toEnd = prevEnd;
+                break;
+            }
+            prevEnd = end;
+            pos = end + child.breakAfter;
+        }
+        return { from: fromStart, to: toEnd < 0 ? offset + tile.length : toEnd,
+            startDOM: (fromI ? tile.children[fromI - 1].dom.nextSibling : null) || tile.dom.firstChild,
+            endDOM: toI < tile.children.length && toI >= 0 ? tile.children[toI].dom : null };
+    }
+    else if (tile.isText()) {
+        return { from: offset, to: offset + tile.length, startDOM: tile.dom, endDOM: tile.dom.nextSibling };
+    }
+    else {
+        return null;
+    }
+}
 function applyDOMChange(view, domChange) {
     let change;
     let { newSel } = domChange, sel = view.state.selection.main;
@@ -4650,8 +4763,8 @@ function eventBelongsToEditor(view, event) {
         return true;
     if (event.defaultPrevented)
         return false;
-    for (let node = event.target, cView; node != view.contentDOM; node = node.parentNode)
-        if (!node || node.nodeType == 11 || ((cView = ContentView.get(node)) && cView.ignoreEvent(event)))
+    for (let node = event.target, tile; node != view.contentDOM; node = node.parentNode)
+        if (!node || node.nodeType == 11 || ((tile = Tile.get(node)) && tile.isWidget() && tile.widget.ignoreEvent(event)))
             return false;
     return true;
 }
@@ -4770,7 +4883,7 @@ function rangeForClick(view, pos, bias, type) {
         return groupAt(view.state, pos, bias);
     }
     else { // Triple click
-        let visual = LineView.find(view.docView, pos), line = view.state.doc.lineAt(visual ? visual.posAtEnd : pos);
+        let visual = view.docView.lineAt(pos), line = view.state.doc.lineAt(visual ? visual.posAtEnd : pos);
         let from = visual ? visual.posAtStart : line.from, to = visual ? visual.posAtEnd : line.to;
         if (to < view.state.doc.length && to == line.to)
             to++;
@@ -4782,7 +4895,7 @@ let inside = (x, y, rect) => y >= rect.top && y <= rect.bottom && x >= rect.left
 // given position, whether they are related to the element before or
 // the element after the position.
 function findPositionSide(view, pos, x, y) {
-    let line = LineView.find(view.docView, pos);
+    let line = view.docView.lineAt(pos);
     if (!line)
         return 1;
     let off = pos - line.posAtStart;
@@ -4792,10 +4905,10 @@ function findPositionSide(view, pos, x, y) {
     if (off == line.length)
         return -1;
     // Positions on top of an element point at that element
-    let before = line.coordsAt(off, -1);
+    let before = line.coordsIn(off, -1);
     if (before && inside(x, y, before))
         return -1;
-    let after = line.coordsAt(off, 1);
+    let after = line.coordsIn(off, 1);
     if (after && inside(x, y, after))
         return 1;
     // This is probably a line wrap point. Pick before if the point is
@@ -4857,9 +4970,9 @@ function removeRangeAround(sel, pos) {
 handlers.dragstart = (view, event) => {
     let { selection: { main: range } } = view.state;
     if (event.target.draggable) {
-        let cView = view.docView.nearest(event.target);
-        if (cView && cView.isWidget) {
-            let from = cView.posAtStart, to = from + cView.length;
+        let tile = view.docView.tile.nearest(event.target);
+        if (tile && tile.isWidget()) {
+            let from = tile.posAtStart, to = from + tile.length;
             if (from >= range.to || to <= range.from)
                 range = state.EditorSelection.range(from, to);
         }
@@ -5211,7 +5324,7 @@ class HeightOracle {
     }
 }
 // This object is used by `updateHeight` to make DOM measurements
-// arrive at the right nides. The `heights` array is a sequence of
+// arrive at the right nodes. The `heights` array is a sequence of
 // block heights, starting from position `from`.
 class MeasuredHeights {
     constructor(from, heights) {
@@ -5250,7 +5363,7 @@ class BlockInfo {
     /**
     @internal Weird packed field that holds an array of children
     for composite blocks, a decoration for block widgets, and a
-    number indicating the amount of widget-create line breaks for
+    number indicating the amount of widget-created line breaks for
     text blocks.
     */
     _content) {
@@ -5354,7 +5467,7 @@ class HeightMap {
         }
         return me.updateHeight(oracle, 0);
     }
-    static empty() { return new HeightMapText(0, 0); }
+    static empty() { return new HeightMapText(0, 0, 0); }
     // nodes uses null values to indicate the position of line breaks.
     // There are never line breaks at the start or end of the array, or
     // two line breaks next to each other, and the array isn't allowed
@@ -5418,45 +5531,64 @@ function replace(old, val) {
     return val;
 }
 HeightMap.prototype.size = 1;
+const SpaceDeco = Decoration.replace({});
 class HeightMapBlock extends HeightMap {
     constructor(length, height, deco) {
         super(length, height);
         this.deco = deco;
+        this.spaceAbove = 0;
     }
-    blockAt(_height, _oracle, top, offset) {
-        return new BlockInfo(offset, this.length, top, this.height, this.deco || 0);
+    mainBlock(top, offset) {
+        return new BlockInfo(offset, this.length, top + this.spaceAbove, this.height - this.spaceAbove, this.deco || 0);
+    }
+    blockAt(height, _oracle, top, offset) {
+        return this.spaceAbove && height < top + this.spaceAbove ? new BlockInfo(offset, 0, top, this.spaceAbove, SpaceDeco)
+            : this.mainBlock(top, offset);
     }
     lineAt(_value, _type, oracle, top, offset) {
-        return this.blockAt(0, oracle, top, offset);
+        let main = this.mainBlock(top, offset);
+        return this.spaceAbove ? this.blockAt(0, oracle, top, offset).join(main) : main;
     }
     forEachLine(from, to, oracle, top, offset, f) {
         if (from <= offset + this.length && to >= offset)
-            f(this.blockAt(0, oracle, top, offset));
+            f(this.lineAt(0, QueryType.ByPos, oracle, top, offset));
+    }
+    setMeasuredHeight(measured) {
+        let next = measured.heights[measured.index++];
+        if (next < 0) {
+            this.spaceAbove = -next;
+            next = measured.heights[measured.index++];
+        }
+        else {
+            this.spaceAbove = 0;
+        }
+        this.setHeight(next);
     }
     updateHeight(oracle, offset = 0, _force = false, measured) {
         if (measured && measured.from <= offset && measured.more)
-            this.setHeight(measured.heights[measured.index++]);
+            this.setMeasuredHeight(measured);
         this.outdated = false;
         return this;
     }
     toString() { return `block(${this.length})`; }
 }
 class HeightMapText extends HeightMapBlock {
-    constructor(length, height) {
+    constructor(length, height, above) {
         super(length, height, null);
         this.collapsed = 0; // Amount of collapsed content in the line
         this.widgetHeight = 0; // Maximum inline widget height
         this.breaks = 0; // Number of widget-introduced line breaks on the line
+        this.spaceAbove = above;
     }
-    blockAt(_height, _oracle, top, offset) {
-        return new BlockInfo(offset, this.length, top, this.height, this.breaks);
+    mainBlock(top, offset) {
+        return new BlockInfo(offset, this.length, top + this.spaceAbove, this.height - this.spaceAbove, this.breaks);
     }
     replace(_from, _to, nodes) {
         let node = nodes[0];
         if (nodes.length == 1 && (node instanceof HeightMapText || node instanceof HeightMapGap && (node.flags & 4 /* Flag.SingleLine */)) &&
             Math.abs(this.length - node.length) < 10) {
             if (node instanceof HeightMapGap)
-                node = new HeightMapText(node.length, this.height);
+                node = new HeightMapText(node.length, this.height, this.spaceAbove);
             else
                 node.height = this.height;
             if (!this.outdated)
@@ -5468,11 +5600,14 @@ class HeightMapText extends HeightMapBlock {
         }
     }
     updateHeight(oracle, offset = 0, force = false, measured) {
-        if (measured && measured.from <= offset && measured.more)
-            this.setHeight(measured.heights[measured.index++]);
-        else if (force || this.outdated)
+        if (measured && measured.from <= offset && measured.more) {
+            this.setMeasuredHeight(measured);
+        }
+        else if (force || this.outdated) {
+            this.spaceAbove = 0;
             this.setHeight(Math.max(this.widgetHeight, oracle.heightForLine(this.length - this.collapsed)) +
                 this.breaks * oracle.lineHeight);
+        }
         this.outdated = false;
         return this;
     }
@@ -5579,12 +5714,16 @@ class HeightMapGap extends HeightMap {
                 let len = oracle.doc.lineAt(pos).length;
                 if (nodes.length)
                     nodes.push(null);
-                let height = measured.heights[measured.index++];
+                let height = measured.heights[measured.index++], above = 0;
+                if (height < 0) {
+                    above = -height;
+                    height = measured.heights[measured.index++];
+                }
                 if (singleHeight == -1)
                     singleHeight = height;
                 else if (Math.abs(height - singleHeight) >= Epsilon)
                     singleHeight = -2;
-                let line = new HeightMapText(len, height);
+                let line = new HeightMapText(len, height, above);
                 line.outdated = false;
                 nodes.push(line);
                 pos += len + 1;
@@ -5749,7 +5888,7 @@ class NodeBuilder {
             if (last instanceof HeightMapText)
                 last.length += end - this.pos;
             else if (end > this.pos || !this.isCovered)
-                this.nodes.push(new HeightMapText(end - this.pos, -1));
+                this.nodes.push(new HeightMapText(end - this.pos, -1, 0));
             this.writtenTo = end;
             if (to > end) {
                 this.nodes.push(null);
@@ -5791,7 +5930,7 @@ class NodeBuilder {
             this.nodes.push(null);
         }
         if (this.pos > from)
-            this.nodes.push(new HeightMapText(this.pos - from, -1));
+            this.nodes.push(new HeightMapText(this.pos - from, -1, 0));
         this.writtenTo = this.pos;
     }
     blankContent(from, to) {
@@ -5805,7 +5944,7 @@ class NodeBuilder {
         let last = this.nodes.length ? this.nodes[this.nodes.length - 1] : null;
         if (last instanceof HeightMapText)
             return last;
-        let line = new HeightMapText(0, -1);
+        let line = new HeightMapText(0, -1, 0);
         this.nodes.push(line);
         return line;
     }
@@ -5830,7 +5969,7 @@ class NodeBuilder {
     finish(from) {
         let last = this.nodes.length == 0 ? null : this.nodes[this.nodes.length - 1];
         if (this.lineStart > -1 && !(last instanceof HeightMapText) && !this.isCovered)
-            this.nodes.push(new HeightMapText(0, -1));
+            this.nodes.push(new HeightMapText(0, -1, 0));
         else if (this.writtenTo < this.pos || last == null)
             this.nodes.push(this.blankContent(this.writtenTo, this.pos));
         let pos = from;
@@ -6957,8 +7096,8 @@ class DOMObserver {
         let { view } = this, sel = this.selectionRange;
         if (view.state.facet(editable) ? view.root.activeElement != this.dom : !hasSelection(this.dom, sel))
             return;
-        let context = sel.anchorNode && view.docView.nearest(sel.anchorNode);
-        if (context && context.ignoreEvent(event)) {
+        let context = sel.anchorNode && view.docView.tile.nearest(sel.anchorNode);
+        if (context && context.isWidget() && context.widget.ignoreEvent(event)) {
             if (!wasChanged)
                 this.selectionChanged = false;
             return;
@@ -7188,20 +7327,18 @@ class DOMObserver {
         return handled;
     }
     readMutation(rec) {
-        let cView = this.view.docView.nearest(rec.target);
-        if (!cView || cView.ignoreMutation(rec))
+        let tile = this.view.docView.tile.nearest(rec.target);
+        if (!tile || tile.isWidget())
             return null;
-        cView.markDirty(rec.type == "attributes");
-        if (rec.type == "attributes")
-            cView.flags |= 4 /* ViewFlag.AttrsDirty */;
+        tile.markDirty(rec.type == "attributes");
         if (rec.type == "childList") {
-            let childBefore = findChild(cView, rec.previousSibling || rec.target.previousSibling, -1);
-            let childAfter = findChild(cView, rec.nextSibling || rec.target.nextSibling, 1);
-            return { from: childBefore ? cView.posAfter(childBefore) : cView.posAtStart,
-                to: childAfter ? cView.posBefore(childAfter) : cView.posAtEnd, typeOver: false };
+            let childBefore = findChild(tile, rec.previousSibling || rec.target.previousSibling, -1);
+            let childAfter = findChild(tile, rec.nextSibling || rec.target.nextSibling, 1);
+            return { from: childBefore ? tile.posAfter(childBefore) : tile.posAtStart,
+                to: childAfter ? tile.posBefore(childAfter) : tile.posAtEnd, typeOver: false };
         }
         else if (rec.type == "characterData") {
-            return { from: cView.posAtStart, to: cView.posAtEnd, typeOver: rec.target.nodeValue == rec.oldValue };
+            return { from: tile.posAtStart, to: tile.posAtEnd, typeOver: rec.target.nodeValue == rec.oldValue };
         }
         else {
             return null;
@@ -7266,20 +7403,20 @@ class DOMObserver {
         }
     }
 }
-function findChild(cView, dom, dir) {
+function findChild(tile, dom, dir) {
     while (dom) {
-        let curView = ContentView.get(dom);
-        if (curView && curView.parent == cView)
-            return curView;
+        let curTile = Tile.get(dom);
+        if (curTile && curTile.parent == tile)
+            return curTile;
         let parent = dom.parentNode;
-        dom = parent != cView.dom ? parent : dir > 0 ? dom.nextSibling : dom.previousSibling;
+        dom = parent != tile.dom ? parent : dir > 0 ? dom.nextSibling : dom.previousSibling;
     }
     return null;
 }
 function buildSelectionRangeFromRange(view, range) {
     let anchorNode = range.startContainer, anchorOffset = range.startOffset;
     let focusNode = range.endContainer, focusOffset = range.endOffset;
-    let curAnchor = view.docView.domAtPos(view.state.selection.main.anchor);
+    let curAnchor = view.docView.domAtPos(view.state.selection.main.anchor, 1);
     // Since such a range doesn't distinguish between anchor and head,
     // use a heuristic that flips it around if its end matches the
     // current anchor.
@@ -8205,8 +8342,8 @@ class EditorView {
     meaningful (it may just point before or after a placeholder
     element).
     */
-    domAtPos(pos) {
-        return this.docView.domAtPos(pos);
+    domAtPos(pos, side = 1) {
+        return this.docView.domAtPos(pos, side);
     }
     /**
     Find the document position at the given DOM node. Can be useful
@@ -8474,8 +8611,8 @@ class EditorView {
     static findFromDOM(dom) {
         var _a;
         let content = dom.querySelector(".cm-content");
-        let cView = content && ContentView.get(content) || ContentView.get(dom);
-        return ((_a = cView === null || cView === void 0 ? void 0 : cView.rootView) === null || _a === void 0 ? void 0 : _a.view) || null;
+        let tile = content && Tile.get(content) || Tile.get(dom);
+        return ((_a = tile === null || tile === void 0 ? void 0 : tile.root) === null || _a === void 0 ? void 0 : _a.view) || null;
     }
 }
 /**
@@ -8587,6 +8724,14 @@ containing the decorations to
 */
 EditorView.decorations = decorations;
 /**
+[Block wrappers](https://codemirror.net/6/docs/ref/#view.BlockWrapper) provide a way to add DOM
+structure around editor lines and block widgets. Sets of
+wrappers are provided in a similar way to decorations, and are
+nested in a similar way when they overlap. A wrapper affects all
+lines and block widgets that start inside its range.
+*/
+EditorView.blockWrappers = blockWrappers;
+/**
 Facet that works much like
 [`decorations`](https://codemirror.net/6/docs/ref/#view.EditorView^decorations), but puts its
 inputs at the very bottom of the precedence stack, meaning mark
@@ -10406,12 +10551,12 @@ class HoverPlugin {
     startHover() {
         clearTimeout(this.restartTimeout);
         let { view, lastMove } = this;
-        let desc = view.docView.nearest(lastMove.target);
-        if (!desc)
+        let tile = view.docView.tile.nearest(lastMove.target);
+        if (!tile)
             return;
         let pos, side = 1;
-        if (desc instanceof WidgetView) {
-            pos = desc.posAtStart;
+        if (tile.isWidget()) {
+            pos = tile.posAtStart;
         }
         else {
             pos = view.posAtCoords(lastMove);
@@ -11479,6 +11624,7 @@ const __test = { HeightMap, HeightOracle, MeasuredHeights, QueryType, ChangedRan
 
 exports.BidiSpan = BidiSpan;
 exports.BlockInfo = BlockInfo;
+exports.BlockWrapper = BlockWrapper;
 exports.Decoration = Decoration;
 exports.EditorView = EditorView;
 exports.GutterMarker = GutterMarker;