@onereach/ui-components 4.10.3 → 4.10.4-beta.2954.0

package/dist/bundled/v2/{index-cf2c3c27.js → index-a67049f4.js}

@@ -3895,19 +3895,23 @@ class StyleModule {
     (root[SET] || new StyleSet(root)).mount(Array.isArray(modules) ? modules : [modules]);
   }
 }
-let adoptedSet = null;
+let adoptedSet = new Map(); //<Document, StyleSet>
+
 class StyleSet {
   constructor(root) {
-    if (!root.head && root.adoptedStyleSheets && typeof CSSStyleSheet != "undefined") {
-      if (adoptedSet) {
-        root.adoptedStyleSheets = [adoptedSet.sheet, ...root.adoptedStyleSheets];
-        return root[SET] = adoptedSet;
+    let doc = root.ownerDocument || root,
+      win = doc.defaultView;
+    if (!root.head && root.adoptedStyleSheets && win.CSSStyleSheet) {
+      let adopted = adoptedSet.get(doc);
+      if (adopted) {
+        root.adoptedStyleSheets = [adopted.sheet, ...root.adoptedStyleSheets];
+        return root[SET] = adopted;
       }
-      this.sheet = new CSSStyleSheet();
+      this.sheet = new win.CSSStyleSheet();
       root.adoptedStyleSheets = [this.sheet, ...root.adoptedStyleSheets];
-      adoptedSet = this;
+      adoptedSet.set(doc, this);
     } else {
-      this.styleTag = (root.ownerDocument || root).createElement("style");
+      this.styleTag = doc.createElement("style");
       let target = root.head || root;
       target.insertBefore(this.styleTag, target.firstChild);
     }
@@ -4152,12 +4156,6 @@ function scanFor(node, off, targetNode, targetOff, dir) {
 function maxOffset(node) {
   return node.nodeType == 3 ? node.nodeValue.length : node.childNodes.length;
 }
-const Rect0 = {
-  left: 0,
-  right: 0,
-  top: 0,
-  bottom: 0
-};
 function flattenRect(rect, left) {
   let x = left ? rect.left : rect.right;
   return {
@@ -4290,7 +4288,12 @@ class DOMSelectionState {
     return this.anchorNode == domSel.anchorNode && this.anchorOffset == domSel.anchorOffset && this.focusNode == domSel.focusNode && this.focusOffset == domSel.focusOffset;
   }
   setRange(range) {
-    this.set(range.anchorNode, range.anchorOffset, range.focusNode, range.focusOffset);
+    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;
@@ -4367,6 +4370,8 @@ 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;
@@ -4425,12 +4430,6 @@ class ContentView {
   posAfter(view) {
     return this.posBefore(view) + view.length;
   }
-  // Will return a rectangle directly before (when side < 0), after
-  // (side > 0) or directly on (when the browser supports it) the
-  // given position.
-  coordsAt(_pos, _side) {
-    return null;
-  }
   sync(view, track) {
     if (this.dirty & 2 /* Dirty.Node */) {
       let parent = this.dom;
@@ -4888,13 +4887,16 @@ function textCoords(text, pos, side) {
     if (side < 0) from--;else if (to < length) to++;
   }
   let rects = textRange(text, from, to).getClientRects();
-  if (!rects.length) return Rect0;
+  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 (widget.customView || WidgetView)(widget, length, side);
+  }
   constructor(widget, length, side) {
     super();
     this.widget = widget;
@@ -4902,9 +4904,6 @@ class WidgetView extends ContentView {
     this.side = side;
     this.prevWidget = null;
   }
-  static create(widget, length, side) {
-    return new (widget.customView || WidgetView)(widget, length, side);
-  }
   split(from) {
     let result = WidgetView.create(this.widget, this.length - from, this.side);
     this.length -= from;
@@ -4927,13 +4926,12 @@ class WidgetView extends ContentView {
     return true;
   }
   become(other) {
-    if (other.length == this.length && other instanceof WidgetView && other.side == this.side) {
-      if (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;
-        return true;
-      }
+    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;
   }
@@ -4961,9 +4959,11 @@ class WidgetView extends ContentView {
     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 Rect0;
+    if (!rects.length) return null;
     for (let i = pos > 0 ? rects.length - 1 : 0;; i += pos > 0 ? -1 : 1) {
       rect = rects[i];
       if (pos > 0 ? i == 0 : i == rects.length - 1 || rect.top < rect.bottom) break;
@@ -4991,7 +4991,7 @@ class CompositionView extends WidgetView {
       text
     } = this.widget;
     if (!topView) return new DOMPos(text, Math.min(pos, text.nodeValue.length));
-    return scanCompositionTree(pos, 0, topView, text, (v, p) => v.domAtPos(p), p => new DOMPos(text, Math.min(p, text.nodeValue.length)));
+    return scanCompositionTree(pos, 0, topView, text, this.length - topView.length, (v, p) => v.domAtPos(p), (text, p) => new DOMPos(text, Math.min(p, text.nodeValue.length)));
   }
   sync() {
     this.setDOM(this.widget.toDOM());
@@ -5002,7 +5002,7 @@ class CompositionView extends WidgetView {
       text
     } = this.widget;
     if (!topView) return Math.min(offset, this.length);
-    return posFromDOMInCompositionTree(node, offset, topView, text);
+    return posFromDOMInCompositionTree(node, offset, topView, text, this.length - topView.length);
   }
   ignoreMutation() {
     return false;
@@ -5016,7 +5016,7 @@ class CompositionView extends WidgetView {
       text
     } = this.widget;
     if (!topView) return textCoords(text, pos, side);
-    return scanCompositionTree(pos, side, topView, text, (v, pos, side) => v.coordsAt(pos, side), (pos, side) => textCoords(text, pos, side));
+    return scanCompositionTree(pos, side, topView, text, this.length - topView.length, (v, pos, side) => v.coordsAt(pos, side), (text, pos, side) => textCoords(text, pos, side));
   }
   destroy() {
     var _a;
@@ -5033,36 +5033,92 @@ class CompositionView extends WidgetView {
 // Uses the old structure of a chunk of content view frozen for
 // composition to try and find a reasonable DOM location for the given
 // offset.
-function scanCompositionTree(pos, side, view, text, enterView, fromText) {
+function scanCompositionTree(pos, side, view, text, dLen, enterView, fromText) {
   if (view instanceof MarkView) {
     for (let child = view.dom.firstChild; child; child = child.nextSibling) {
       let desc = ContentView.get(child);
-      if (!desc) return fromText(pos, side);
-      let hasComp = contains(child, text);
-      let len = desc.length + (hasComp ? text.nodeValue.length : 0);
-      if (pos < len || pos == len && desc.getSide() <= 0) return hasComp ? scanCompositionTree(pos, side, desc, text, enterView, fromText) : enterView(desc, pos, side);
-      pos -= len;
+      if (!desc) {
+        let inner = scanCompositionNode(pos, side, child, fromText);
+        if (typeof inner != "number") return inner;
+        pos = inner;
+      } else {
+        let hasComp = contains(child, text);
+        let len = desc.length + (hasComp ? dLen : 0);
+        if (pos < len || pos == len && desc.getSide() <= 0) return hasComp ? scanCompositionTree(pos, side, desc, text, dLen, enterView, fromText) : enterView(desc, pos, side);
+        pos -= len;
+      }
     }
     return enterView(view, view.length, -1);
   } else if (view.dom == text) {
-    return fromText(pos, side);
+    return fromText(text, pos, side);
   } else {
     return enterView(view, pos, side);
   }
 }
-function posFromDOMInCompositionTree(node, offset, view, text) {
+function scanCompositionNode(pos, side, node, fromText) {
+  if (node.nodeType == 3) {
+    let len = node.nodeValue.length;
+    if (pos <= len) return fromText(node, pos, side);
+    pos -= len;
+  } else if (node.nodeType == 1 && node.contentEditable != "false") {
+    for (let child = node.firstChild; child; child = child.nextSibling) {
+      let inner = scanCompositionNode(pos, side, child, fromText);
+      if (typeof inner != "number") return inner;
+      pos = inner;
+    }
+  }
+  return pos;
+}
+function posFromDOMInCompositionTree(node, offset, view, text, dLen) {
   if (view instanceof MarkView) {
     let pos = 0;
-    for (let child of view.children) {
-      let hasComp = contains(child.dom, text);
-      if (contains(child.dom, node)) return pos + (hasComp ? posFromDOMInCompositionTree(node, offset, child, text) : child.localPosFromDOM(node, offset));
-      pos += hasComp ? text.nodeValue.length : child.length;
+    for (let child = view.dom.firstChild; child; child = child.nextSibling) {
+      let childView = ContentView.get(child);
+      if (childView) {
+        let hasComp = contains(child, text);
+        if (contains(child, node)) return pos + (hasComp ? posFromDOMInCompositionTree(node, offset, childView, text, dLen) : childView.localPosFromDOM(node, offset));
+        pos += childView.length + (hasComp ? dLen : 0);
+      } else {
+        let inner = posFromDOMInOpaqueNode(node, offset, child);
+        if (inner.result != null) return pos + inner.result;
+        pos += inner.size;
+      }
     }
   } else if (view.dom == text) {
     return Math.min(offset, text.nodeValue.length);
   }
   return view.localPosFromDOM(node, offset);
 }
+function posFromDOMInOpaqueNode(node, offset, target) {
+  if (target.nodeType == 3) {
+    return node == target ? {
+      result: offset
+    } : {
+      size: target.nodeValue.length
+    };
+  } else if (target.nodeType == 1 && target.contentEditable != "false") {
+    let pos = 0;
+    for (let child = target.firstChild, i = 0;; child = child.nextSibling, i++) {
+      if (node == target && i == offset) return {
+        result: pos
+      };
+      if (!child) return {
+        size: pos
+      };
+      let inner = posFromDOMInOpaqueNode(node, offset, child);
+      if (inner.result != null) return {
+        result: offset + inner.result
+      };
+      pos += inner.size;
+    }
+  } else {
+    return target.contains(node) ? {
+      result: 0
+    } : {
+      size: 0
+    };
+  }
+}
 // 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.
@@ -5104,16 +5160,7 @@ class WidgetBufferView extends ContentView {
     return null;
   }
   coordsAt(pos) {
-    let imgRect = this.dom.getBoundingClientRect();
-    // Since the <img> height doesn't correspond to text height, try
-    // to borrow the height from some sibling node.
-    let siblingRect = inlineSiblingRect(this, this.side > 0 ? -1 : 1);
-    return siblingRect && siblingRect.top < imgRect.bottom && siblingRect.bottom > imgRect.top ? {
-      left: imgRect.left,
-      right: imgRect.right,
-      top: siblingRect.top,
-      bottom: siblingRect.bottom
-    } : imgRect;
+    return this.dom.getBoundingClientRect();
   }
   get overrideDOMText() {
     return Text.empty;
@@ -5123,28 +5170,6 @@ class WidgetBufferView extends ContentView {
   }
 }
 TextView.prototype.children = WidgetView.prototype.children = WidgetBufferView.prototype.children = noChildren;
-function inlineSiblingRect(view, side) {
-  let parent = view.parent,
-    index = parent ? parent.children.indexOf(view) : -1;
-  while (parent && index >= 0) {
-    if (side < 0 ? index > 0 : index < parent.children.length) {
-      let next = parent.children[index + side];
-      if (next instanceof TextView) {
-        let nextRect = next.coordsAt(side < 0 ? next.length : 0, side);
-        if (nextRect) return nextRect;
-      }
-      index += side;
-    } else if (parent instanceof MarkView && parent.parent) {
-      index = parent.parent.children.indexOf(parent) + (side < 0 ? 0 : 1);
-      parent = parent.parent;
-    } else {
-      let last = parent.dom.lastChild;
-      if (last && last.nodeName == "BR") return last.getClientRects()[0];
-      break;
-    }
-  }
-  return undefined;
-}
 function inlineDOMAtPos(parent, pos) {
   let dom = parent.dom,
     {
@@ -5195,10 +5220,10 @@ function coordsInChildren(view, pos, side) {
       if (end >= pos) {
         if (child.children.length) {
           scan(child, pos - off);
-        } else if ((!after || after instanceof WidgetBufferView && side > 0) && (end > pos || off == end && child.getSide() > 0)) {
+        } else if ((!after || after.isHidden && side > 0) && (end > pos || off == end && child.getSide() > 0)) {
           after = child;
           afterPos = pos - off;
-        } else if (off < pos || off == end && child.getSide() < 0) {
+        } else if (off < pos || off == end && child.getSide() < 0 && !child.isHidden) {
           before = child;
           beforePos = pos - off;
         }
@@ -5295,6 +5320,16 @@ class WidgetType {
     return true;
   }
   /**
+  Override the way screen coordinates for positions at/in the
+  widget are found. `pos` will be the offset into the widget, and
+  `side` the side of the position that is being queried—less than
+  zero for before, greater than zero for after, and zero for
+  directly at that position.
+  */
+  coordsAt(dom, pos, side) {
+    return null;
+  }
+  /**
   @internal
   */
   get customView() {
@@ -5727,11 +5762,12 @@ class BlockWidgetView extends ContentView {
     return null;
   }
   become(other) {
-    if (other instanceof BlockWidgetView && other.type == this.type && other.widget.constructor == this.widget.constructor) {
+    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.type = other.type;
       this.breakAfter = other.breakAfter;
       return true;
     }
@@ -5749,6 +5785,9 @@ class BlockWidgetView extends ContentView {
   get isWidget() {
     return true;
   }
+  coordsAt(pos, side) {
+    return this.widget.coordsAt(this.dom, pos, side);
+  }
   destroy() {
     super.destroy();
     if (this.dom) this.widget.destroy(this.dom);
@@ -6080,6 +6119,27 @@ const contentAttributes = /*@__PURE__*/Facet.define();
 const decorations = /*@__PURE__*/Facet.define();
 const atomicRanges = /*@__PURE__*/Facet.define();
 const scrollMargins = /*@__PURE__*/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 = /*@__PURE__*/Facet.define();
 class ChangedRange {
   constructor(fromA, toA, fromB, toB) {
@@ -6261,6 +6321,12 @@ Represents a contiguous range of text that has a single direction
 (as in left-to-right or right-to-left).
 */
 class BidiSpan {
+  /**
+  The direction of this span.
+  */
+  get dir() {
+    return this.level % 2 ? RTL : LTR;
+  }
   /**
   @internal
   */
@@ -6286,12 +6352,6 @@ class BidiSpan {
     this.level = level;
   }
   /**
-  The direction of this span.
-  */
-  get dir() {
-    return this.level % 2 ? RTL : LTR;
-  }
-  /**
   @internal
   */
   side(end, dir) {
@@ -6512,12 +6572,13 @@ class DOMReader {
     let parent = start.parentNode;
     for (let cur = start;;) {
       this.findPointBefore(parent, cur);
+      let oldLen = this.text.length;
       this.readNode(cur);
       let next = cur.nextSibling;
       if (next == end) break;
       let view = ContentView.get(cur),
         nextView = ContentView.get(next);
-      if (view && nextView ? view.breakAfter : (view ? view.breakAfter : isBlockElement(cur)) || isBlockElement(next) && (cur.nodeName != "BR" || cur.cmIgnore)) this.lineBreak();
+      if (view && nextView ? view.breakAfter : (view ? view.breakAfter : isBlockElement(cur)) || isBlockElement(next) && (cur.nodeName != "BR" || cur.cmIgnore) && this.text.length > oldLen) this.lineBreak();
       cur = next;
     }
     this.findPointBefore(parent, end);
@@ -6579,6 +6640,9 @@ class DOMPoint {
   }
 }
 class DocView extends ContentView {
+  get length() {
+    return this.view.state.doc.length;
+  }
   constructor(view) {
     super();
     this.view = view;
@@ -6609,9 +6673,6 @@ class DocView extends ContentView {
     this.updateDeco();
     this.updateInner([new ChangedRange(0, 0, 0, view.state.doc.length)], 0);
   }
-  get length() {
-    return this.view.state.doc.length;
-  }
   // Update the document view to a given state. scrollIntoView can be
   // used as a hint to compute a new viewport that includes that
   // position, if we know the editor is going to scroll that position
@@ -6716,7 +6777,10 @@ class DocView extends ContentView {
     let mustRead = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
     let fromPointer = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
     if (mustRead || !this.view.observer.selectionRange.focusNode) this.view.observer.readSelectionRange();
-    if (!(fromPointer || this.mayControlSelection())) return;
+    let activeElt = this.view.root.activeElement,
+      focused = activeElt == this.dom;
+    let selectionNotFocus = !focused && hasSelection(this.dom, this.view.observer.selectionRange) && !(activeElt && this.dom.contains(activeElt));
+    if (!(focused || fromPointer || selectionNotFocus)) return;
     let force = this.forceSelection;
     this.forceSelection = false;
     let main = this.view.state.selection.main;
@@ -6777,6 +6841,10 @@ class DocView extends ContentView {
           rawSel.removeAllRanges();
           rawSel.addRange(range);
         }
+        if (selectionNotFocus && this.view.root.activeElement == this.dom) {
+          this.dom.blur();
+          if (activeElt) activeElt.focus();
+        }
       });
       this.view.observer.setSelectionRange(anchor, head);
     }
@@ -6811,10 +6879,6 @@ class DocView extends ContentView {
     let newRange = view.observer.selectionRange;
     if (view.docView.posFromDOM(newRange.anchorNode, newRange.anchorOffset) != cursor.from) sel.collapse(anchorNode, anchorOffset);
   }
-  mayControlSelection() {
-    let active = this.view.root.activeElement;
-    return active == this.dom || hasSelection(this.dom, this.view.observer.selectionRange) && !(active && this.dom.contains(active));
-  }
   nearest(dom) {
     for (let cur = dom; cur;) {
       let domView = ContentView.get(cur);
@@ -6970,27 +7034,12 @@ class DocView extends ContentView {
       right: Math.max(rect.right, other.right),
       bottom: Math.max(rect.bottom, other.bottom)
     };
-    let mLeft = 0,
-      mRight = 0,
-      mTop = 0,
-      mBottom = 0;
-    for (let margins of this.view.state.facet(scrollMargins).map(f => f(this.view))) if (margins) {
-      let {
-        left,
-        right,
-        top,
-        bottom
-      } = margins;
-      if (left != null) mLeft = Math.max(mLeft, left);
-      if (right != null) mRight = Math.max(mRight, right);
-      if (top != null) mTop = Math.max(mTop, top);
-      if (bottom != null) mBottom = Math.max(mBottom, bottom);
-    }
+    let margins = getScrollMargins(this.view);
     let targetRect = {
-      left: rect.left - mLeft,
-      top: rect.top - mTop,
-      right: rect.right + mRight,
-      bottom: rect.bottom + mBottom
+      left: rect.left - margins.left,
+      top: rect.top - margins.top,
+      right: rect.right + margins.right,
+      bottom: rect.bottom + margins.bottom
     };
     scrollRectIntoView(this.view.scrollDOM, targetRect, range.head < range.anchor ? -1 : 1, target.x, target.y, target.xMargin, target.yMargin, this.view.textDirection == Direction.LTR);
   }
@@ -7070,9 +7119,10 @@ function computeCompositionDeco(view, changes) {
       state
     } = view,
     text = node.nodeType == 3 ? node.nodeValue : new DOMReader([], state).readRange(node.firstChild, null).text;
+  if (text.indexOf(LineBreakPlaceholder) > -1) return Decoration.none; // Don't try to preserve multi-line compositions
   if (newTo - newFrom < text.length) {
-    if (state.doc.sliceString(newFrom, Math.min(state.doc.length, newFrom + text.length), LineBreakPlaceholder) == text) newTo = newFrom + text.length;else if (state.doc.sliceString(Math.max(0, newTo - text.length), newTo, LineBreakPlaceholder) == text) newFrom = newTo - text.length;else return Decoration.none;
-  } else if (state.doc.sliceString(newFrom, newTo, LineBreakPlaceholder) != text) {
+    if (state.doc.sliceString(newFrom, Math.min(state.doc.length, newFrom + text.length)) == text) newTo = newFrom + text.length;else if (state.doc.sliceString(Math.max(0, newTo - text.length), newTo) == text) newFrom = newTo - text.length;else return Decoration.none;
+  } else if (state.doc.sliceString(newFrom, newTo) != text) {
     return Decoration.none;
   }
   let topView = ContentView.get(node);
@@ -7489,24 +7539,32 @@ function moveVertically(view, start, forward, distance) {
     if (curY < rect.top || curY > rect.bottom || (dir < 0 ? pos < startPos : pos > startPos)) return EditorSelection.cursor(pos, start.assoc, undefined, goal);
   }
 }
-function skipAtoms(view, oldPos, pos) {
-  let atoms = view.state.facet(atomicRanges).map(f => f(view));
+function skipAtomicRanges(atoms, pos, bias) {
   for (;;) {
-    let moved = false;
+    let moved = 0;
     for (let set of atoms) {
-      set.between(pos.from - 1, pos.from + 1, (from, to, value) => {
-        if (pos.from > from && pos.from < to) {
-          pos = oldPos.head > pos.from ? EditorSelection.cursor(from, 1) : EditorSelection.cursor(to, -1);
-          moved = true;
+      set.between(pos - 1, pos + 1, (from, to, value) => {
+        if (pos > from && pos < to) {
+          let side = moved || bias || (pos - from < to - pos ? -1 : 1);
+          pos = side < 0 ? from : to;
+          moved = side;
         }
       });
     }
     if (!moved) return pos;
   }
 }
+function skipAtoms(view, oldPos, pos) {
+  let newPos = skipAtomicRanges(view.state.facet(atomicRanges).map(f => f(view)), pos.from, oldPos.head > pos.from ? -1 : 1);
+  return newPos == pos.from ? pos : EditorSelection.cursor(newPos, newPos < pos.from ? 1 : -1);
+}
 
 // This will also be where dragging info and such goes
 class InputState {
+  setSelectionOrigin(origin) {
+    this.lastSelectionOrigin = origin;
+    this.lastSelectionTime = Date.now();
+  }
   constructor(view) {
     this.lastKeyCode = 0;
     this.lastKeyTime = 0;
@@ -7571,6 +7629,9 @@ class InputState {
         }
       }
     });
+    view.scrollDOM.addEventListener("drop", event => {
+      if (event.target == view.scrollDOM && event.clientY > view.contentDOM.getBoundingClientRect().bottom) handleEvent(handlers.drop, event);
+    });
     if (browser.chrome && browser.chrome_version == 102) {
       // FIXME remove at some point
       // On Chrome 102, viewport updates somehow stop wheel-based
@@ -7591,10 +7652,6 @@ class InputState {
     // issue where the composition vanishes when you press enter.
     if (browser.safari) view.contentDOM.addEventListener("input", () => null);
   }
-  setSelectionOrigin(origin) {
-    this.lastSelectionOrigin = origin;
-    this.lastSelectionTime = Date.now();
-  }
   ensureHandlers(view, plugins) {
     var _a;
     let handlers;
@@ -7645,6 +7702,7 @@ class InputState {
     this.lastKeyCode = event.keyCode;
     this.lastKeyTime = Date.now();
     if (event.keyCode == 9 && Date.now() < this.lastEscPress + 2000) return true;
+    if (event.keyCode != 27 && modifierCodes.indexOf(event.keyCode) < 0) view.inputState.lastEscPress = 0;
     // Chrome for Android usually doesn't fire proper key events, but
     // occasionally does, usually surrounded by a bunch of complicated
     // composition changes. When an enter or backspace key event is
@@ -7735,6 +7793,7 @@ class MouseSelection {
     this.scrolling = -1;
     this.lastEvent = startEvent;
     this.scrollParent = scrollableParent(view.contentDOM);
+    this.atoms = view.state.facet(atomicRanges).map(f => f(view));
     let doc = view.contentDOM.ownerDocument;
     doc.addEventListener("mousemove", this.move = this.move.bind(this));
     doc.addEventListener("mouseup", this.up = this.up.bind(this));
@@ -7764,8 +7823,9 @@ class MouseSelection {
       right: this.view.win.innerWidth,
       bottom: this.view.win.innerHeight
     };
-    if (event.clientX <= rect.left + dragScrollMargin) sx = -dragScrollSpeed(rect.left - event.clientX);else if (event.clientX >= rect.right - dragScrollMargin) sx = dragScrollSpeed(event.clientX - rect.right);
-    if (event.clientY <= rect.top + dragScrollMargin) sy = -dragScrollSpeed(rect.top - event.clientY);else if (event.clientY >= rect.bottom - dragScrollMargin) sy = dragScrollSpeed(event.clientY - rect.bottom);
+    let margins = getScrollMargins(this.view);
+    if (event.clientX - margins.left <= rect.left + dragScrollMargin) sx = -dragScrollSpeed(rect.left - event.clientX);else if (event.clientX + margins.right >= rect.right - dragScrollMargin) sx = dragScrollSpeed(event.clientX - rect.right);
+    if (event.clientY - margins.top <= rect.top + dragScrollMargin) sy = -dragScrollSpeed(rect.top - event.clientY);else if (event.clientY + margins.bottom >= rect.bottom - dragScrollMargin) sy = dragScrollSpeed(event.clientY - rect.bottom);
     this.setScrollSpeed(sx, sy);
   }
   up(event) {
@@ -7801,9 +7861,32 @@ class MouseSelection {
     }
     if (this.dragging === false) this.select(this.lastEvent);
   }
+  skipAtoms(sel) {
+    let ranges = null;
+    for (let i = 0; i < sel.ranges.length; i++) {
+      let range = sel.ranges[i],
+        updated = null;
+      if (range.empty) {
+        let pos = skipAtomicRanges(this.atoms, range.from, 0);
+        if (pos != range.from) updated = EditorSelection.cursor(pos, -1);
+      } else {
+        let from = skipAtomicRanges(this.atoms, range.from, -1);
+        let to = skipAtomicRanges(this.atoms, range.to, 1);
+        if (from != range.from || to != range.to) updated = EditorSelection.range(range.from == range.anchor ? from : to, range.from == range.head ? from : to);
+      }
+      if (updated) {
+        if (!ranges) ranges = sel.ranges.slice();
+        ranges[i] = updated;
+      }
+    }
+    return ranges ? EditorSelection.create(ranges, sel.mainIndex) : sel;
+  }
   select(event) {
-    let selection = this.style.get(event, this.extend, this.multiple);
-    if (this.mustSelect || !selection.eq(this.view.state.selection) || selection.main.assoc != this.view.state.selection.main.assoc) this.view.dispatch({
+    let {
+        view
+      } = this,
+      selection = this.skipAtoms(this.style.get(event, this.extend, this.multiple));
+    if (this.mustSelect || !selection.eq(view.state.selection) || selection.main.assoc != view.state.selection.main.assoc) this.view.dispatch({
       selection,
       userEvent: "select.pointer"
     });
@@ -7910,7 +7993,7 @@ function doPaste(view, input) {
 }
 handlers.keydown = (view, event) => {
   view.inputState.setSelectionOrigin("select");
-  if (event.keyCode == 27) view.inputState.lastEscPress = Date.now();else if (modifierCodes.indexOf(event.keyCode) < 0) view.inputState.lastEscPress = 0;
+  if (event.keyCode == 27) view.inputState.lastEscPress = Date.now();
 };
 handlers.touchstart = (view, e) => {
   view.inputState.lastTouchTime = Date.now();
@@ -8231,11 +8314,20 @@ handlers.compositionend = view => {
   view.inputState.compositionPendingKey = true;
   view.inputState.compositionPendingChange = view.observer.pendingRecords().length > 0;
   view.inputState.compositionFirstChange = null;
-  if (browser.chrome && browser.android) view.observer.flushSoon();
-  setTimeout(() => {
-    // Force the composition state to be cleared if it hasn't already been
-    if (view.inputState.composing < 0 && view.docView.compositionDeco.size) view.update([]);
-  }, 50);
+  if (browser.chrome && browser.android) {
+    // Delay flushing for a bit on Android because it'll often fire a
+    // bunch of contradictory changes in a row at end of compositon
+    view.observer.flushSoon();
+  } else if (view.inputState.compositionPendingChange) {
+    // If we found pending records, schedule a flush.
+    Promise.resolve().then(() => view.observer.flush());
+  } else {
+    // Otherwise, make sure that, if no changes come in soon, the
+    // composition view is cleared.
+    setTimeout(() => {
+      if (view.inputState.composing < 0 && view.docView.compositionDeco.size) view.update([]);
+    }, 50);
+  }
 };
 handlers.contextmenu = view => {
   view.inputState.lastContextMenu = Date.now();
@@ -8369,15 +8461,34 @@ class BlockInfo {
   */
   height,
   /**
-  The type of element this is. When querying lines, this may be
-  an array of all the blocks that make up the line.
+  @internal
+  */
+  children,
+  /**
+  @internal
   */
-  type) {
+  deco) {
     this.from = from;
     this.length = length;
     this.top = top;
     this.height = height;
-    this.type = type;
+    this.children = children;
+    this.deco = deco;
+  }
+  /**
+  The type of element this is. When querying lines, this may be
+  an array of all the blocks that make up the line.
+  */
+  get type() {
+    var _a, _b, _c;
+    return (_c = (_a = this.children) !== null && _a !== void 0 ? _a : (_b = this.deco) === null || _b === void 0 ? void 0 : _b.type) !== null && _c !== void 0 ? _c : BlockType.Text;
+  }
+  /**
+  If this is a widget block, this will return the widget
+  associated with it.
+  */
+  get widget() {
+    return this.deco && this.deco.widget;
   }
   /**
   The end of the element as a document position.
@@ -8395,8 +8506,8 @@ class BlockInfo {
   @internal
   */
   join(other) {
-    let detail = (Array.isArray(this.type) ? this.type : [this]).concat(Array.isArray(other.type) ? other.type : [other]);
-    return new BlockInfo(this.from, this.length + other.length, this.top, this.height + other.height, detail);
+    let children = (this.children || [this]).concat(other.children || [other]);
+    return new BlockInfo(this.from, this.length + other.length, this.top, this.height + other.height, children, null);
   }
 }
 var QueryType = /*@__PURE__*/function (QueryType) {
@@ -8516,12 +8627,12 @@ class HeightMap {
 }
 HeightMap.prototype.size = 1;
 class HeightMapBlock extends HeightMap {
-  constructor(length, height, type) {
+  constructor(length, height, deco) {
     super(length, height);
-    this.type = type;
+    this.deco = deco;
   }
   blockAt(_height, _oracle, top, offset) {
-    return new BlockInfo(offset, this.length, top, this.height, this.type);
+    return new BlockInfo(offset, this.length, top, this.height, null, this.deco);
   }
   lineAt(_value, _type, oracle, top, offset) {
     return this.blockAt(0, oracle, top, offset);
@@ -8542,7 +8653,7 @@ class HeightMapBlock extends HeightMap {
 }
 class HeightMapText extends HeightMapBlock {
   constructor(length, height) {
-    super(length, height, BlockType.Text);
+    super(length, height, null);
     this.collapsed = 0; // Amount of collapsed content in the line
     this.widgetHeight = 0; // Maximum inline widget height
   }
@@ -8582,7 +8693,7 @@ class HeightMapGap extends HeightMap {
     if (oracle.lineWrapping) {
       let totalPerLine = Math.min(this.height, oracle.lineHeight * lines);
       perLine = totalPerLine / lines;
-      perChar = (this.height - totalPerLine) / (this.length - lines - 1);
+      if (this.length > lines + 1) perChar = (this.height - totalPerLine) / (this.length - lines - 1);
     } else {
       perLine = this.height / lines;
     }
@@ -8605,14 +8716,14 @@ class HeightMapGap extends HeightMap {
       let line = oracle.doc.lineAt(guess),
         lineHeight = perLine + line.length * perChar;
       let lineTop = Math.max(top, height - lineHeight / 2);
-      return new BlockInfo(line.from, line.length, lineTop, lineHeight, BlockType.Text);
+      return new BlockInfo(line.from, line.length, lineTop, lineHeight, null, null);
     } else {
       let line = Math.max(0, Math.min(lastLine - firstLine, Math.floor((height - top) / perLine)));
       let {
         from,
         length
       } = oracle.doc.line(firstLine + line);
-      return new BlockInfo(from, length, top + perLine * line, perLine, BlockType.Text);
+      return new BlockInfo(from, length, top + perLine * line, perLine, null, null);
     }
   }
   lineAt(value, type, oracle, top, offset) {
@@ -8622,7 +8733,7 @@ class HeightMapGap extends HeightMap {
         from,
         to
       } = oracle.doc.lineAt(value);
-      return new BlockInfo(from, to - from, 0, 0, BlockType.Text);
+      return new BlockInfo(from, to - from, 0, 0, null, null);
     }
     let {
       firstLine,
@@ -8633,7 +8744,7 @@ class HeightMapGap extends HeightMap {
       lineHeight = perLine + line.length * perChar;
     let linesAbove = line.number - firstLine;
     let lineTop = top + perLine * linesAbove + perChar * (line.from - offset - linesAbove);
-    return new BlockInfo(line.from, line.length, Math.max(top, Math.min(lineTop, top + this.height - lineHeight)), lineHeight, BlockType.Text);
+    return new BlockInfo(line.from, line.length, Math.max(top, Math.min(lineTop, top + this.height - lineHeight)), lineHeight, null, null);
   }
   forEachLine(from, to, oracle, top, offset, f) {
     from = Math.max(from, offset);
@@ -8650,7 +8761,7 @@ class HeightMapGap extends HeightMap {
         lineTop += perLine * linesAbove + perChar * (from - offset - linesAbove);
       }
       let lineHeight = perLine + perChar * line.length;
-      f(new BlockInfo(line.from, line.length, lineTop, lineHeight, BlockType.Text));
+      f(new BlockInfo(line.from, line.length, lineTop, lineHeight, null, null));
       lineTop += lineHeight;
       pos = line.to + 1;
     }
@@ -8850,7 +8961,7 @@ class NodeBuilder {
       if (height < 0) height = this.oracle.lineHeight;
       let len = to - from;
       if (deco.block) {
-        this.addBlock(new HeightMapBlock(len, height, deco.type));
+        this.addBlock(new HeightMapBlock(len, height, deco));
       } else if (len || height >= relevantWidgetHeight) {
         this.addLineDeco(height, len);
       }
@@ -8888,11 +8999,13 @@ class NodeBuilder {
     return line;
   }
   addBlock(block) {
+    var _a;
     this.enterLine();
-    if (block.type == BlockType.WidgetAfter && !this.isCovered) this.ensureLine();
+    let type = (_a = block.deco) === null || _a === void 0 ? void 0 : _a.type;
+    if (type == BlockType.WidgetAfter && !this.isCovered) this.ensureLine();
     this.nodes.push(block);
     this.writtenTo = this.pos = this.pos + block.length;
-    if (block.type != BlockType.WidgetBefore) this.covering = block;
+    if (type != BlockType.WidgetBefore) this.covering = block;
   }
   addLineDeco(height, length) {
     let line = this.ensureLine();
@@ -9540,7 +9653,7 @@ function scaleBlock(block, scaler) {
   if (scaler.scale == 1) return block;
   let bTop = scaler.toDOM(block.top),
     bBottom = scaler.toDOM(block.bottom);
-  return new BlockInfo(block.from, block.length, bTop, bBottom - bTop, Array.isArray(block.type) ? block.type.map(b => scaleBlock(b, scaler)) : block.type);
+  return new BlockInfo(block.from, block.length, bTop, bBottom - bTop, block.children && block.children.map(b => scaleBlock(b, scaler)), block.deco);
 }
 const theme = /*@__PURE__*/Facet.define({
   combine: strs => strs.join(" ")
@@ -9640,16 +9753,16 @@ const baseTheme$1$1 = /*@__PURE__*/buildTheme("." + baseThemeID, {
   "&dark .cm-selectionBackground": {
     background: "#222"
   },
-  "&light.cm-focused .cm-selectionBackground": {
+  "&light.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground": {
     background: "#d7d4f0"
   },
-  "&dark.cm-focused .cm-selectionBackground": {
+  "&dark.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground": {
     background: "#233"
   },
   ".cm-cursorLayer": {
     pointerEvents: "none"
   },
-  "&.cm-focused .cm-cursorLayer": {
+  "&.cm-focused > .cm-scroller > .cm-cursorLayer": {
     animation: "steps(1) cm-blink 1.2s infinite"
   },
   // Two animations defined so that we can switch between them to
@@ -9683,7 +9796,7 @@ const baseTheme$1$1 = /*@__PURE__*/buildTheme("." + baseThemeID, {
   ".cm-dropCursor": {
     position: "absolute"
   },
-  "&.cm-focused .cm-cursor": {
+  "&.cm-focused > .cm-scroller > .cm-cursorLayer .cm-cursor": {
     display: "block"
   },
   "&light .cm-activeLine": {
@@ -9857,6 +9970,7 @@ function applyDOMChange(view, domChange) {
       newSel
     } = domChange,
     sel = view.state.selection.main;
+  let lastKey = view.inputState.lastKeyTime > Date.now() - 100 ? view.inputState.lastKeyCode : -1;
   if (domChange.bounds) {
     let {
       from,
@@ -9866,7 +9980,7 @@ function applyDOMChange(view, domChange) {
       preferredSide = null;
     // Prefer anchoring to end when Backspace is pressed (or, on
     // Android, when something was deleted)
-    if (view.inputState.lastKeyCode === 8 && view.inputState.lastKeyTime > Date.now() - 100 || browser.android && domChange.text.length < to - from) {
+    if (lastKey === 8 || browser.android && domChange.text.length < to - from) {
       preferredPos = sel.to;
       preferredSide = "end";
     }
@@ -9874,7 +9988,7 @@ function applyDOMChange(view, domChange) {
     if (diff) {
       // Chrome inserts two newlines when pressing shift-enter at the
       // end of a line. DomChange drops one of those.
-      if (browser.chrome && view.inputState.lastKeyCode == 13 && diff.toB == diff.from + 2 && domChange.text.slice(diff.from, diff.toB) == LineBreakPlaceholder + LineBreakPlaceholder) diff.toB--;
+      if (browser.chrome && lastKey == 13 && diff.toB == diff.from + 2 && domChange.text.slice(diff.from, diff.toB) == LineBreakPlaceholder + LineBreakPlaceholder) diff.toB--;
       change = {
         from: from + diff.from,
         to: from + diff.toA,
@@ -9930,7 +10044,7 @@ function applyDOMChange(view, domChange) {
     // events. (Some of these keys are also handled by beforeinput
     // events and the pendingAndroidKey mechanism, but that's not
     // reliable in all situations.)
-    if (browser.android && (change.from == sel.from && change.to == sel.to && change.insert.length == 1 && change.insert.lines == 2 && dispatchKey(view.contentDOM, "Enter", 13) || change.from == sel.from - 1 && change.to == sel.to && change.insert.length == 0 && dispatchKey(view.contentDOM, "Backspace", 8) || change.from == sel.from && change.to == sel.to + 1 && change.insert.length == 0 && dispatchKey(view.contentDOM, "Delete", 46))) return true;
+    if (browser.android && (change.from == sel.from && change.to == sel.to && change.insert.length == 1 && change.insert.lines == 2 && dispatchKey(view.contentDOM, "Enter", 13) || (change.from == sel.from - 1 && change.to == sel.to && change.insert.length == 0 || lastKey == 8 && change.insert.length < change.to - change.from) && dispatchKey(view.contentDOM, "Backspace", 8) || change.from == sel.from && change.to == sel.to + 1 && change.insert.length == 0 && dispatchKey(view.contentDOM, "Delete", 46))) return true;
     let text = change.insert.toString();
     if (view.state.facet(inputHandler).some(h => h(view, change.from, change.to, text))) return true;
     if (view.inputState.composing >= 0) view.inputState.composing++;
@@ -10147,7 +10261,9 @@ class DOMObserver {
           this.intersecting = !this.intersecting;
           if (this.intersecting != this.view.inView) this.onScrollChanged(document.createEvent("Event"));
         }
-      }, {});
+      }, {
+        threshold: [0, .001]
+      });
       this.intersection.observe(this.dom);
       this.gapIntersection = new IntersectionObserver(entries => {
         if (entries.length > 0 && entries[entries.length - 1].intersectionRatio > 0) this.onScrollChanged(document.createEvent("Event"));
@@ -10300,7 +10416,10 @@ class DOMObserver {
         let key = this.delayedAndroidKey;
         if (key) {
           this.clearDelayedAndroidKey();
-          if (!this.flush() && key.force) dispatchKey(this.dom, key.key, key.keyCode);
+          this.view.inputState.lastKeyCode = key.keyCode;
+          this.view.inputState.lastKeyTime = Date.now();
+          let flushed = this.flush();
+          if (!flushed && key.force) dispatchKey(this.dom, key.key, key.keyCode);
         }
       };
       this.flushingAndroidKey = this.view.win.requestAnimationFrame(flush);
@@ -10514,58 +10633,6 @@ line number gutter. It handles events and dispatches state
 transactions for editing actions.
 */
 class EditorView {
-  /**
-  Construct a new view. You'll want to either provide a `parent`
-  option, or put `view.dom` into your document after creating a
-  view, so that the user can see the editor.
-  */
-  constructor() {
-    let config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    this.plugins = [];
-    this.pluginMap = new Map();
-    this.editorAttrs = {};
-    this.contentAttrs = {};
-    this.bidiCache = [];
-    this.destroyed = false;
-    /**
-    @internal
-    */
-    this.updateState = 2 /* UpdateState.Updating */;
-    /**
-    @internal
-    */
-    this.measureScheduled = -1;
-    /**
-    @internal
-    */
-    this.measureRequests = [];
-    this.contentDOM = document.createElement("div");
-    this.scrollDOM = document.createElement("div");
-    this.scrollDOM.tabIndex = -1;
-    this.scrollDOM.className = "cm-scroller";
-    this.scrollDOM.appendChild(this.contentDOM);
-    this.announceDOM = document.createElement("div");
-    this.announceDOM.style.cssText = "position: fixed; top: -10000px";
-    this.announceDOM.setAttribute("aria-live", "polite");
-    this.dom = document.createElement("div");
-    this.dom.appendChild(this.announceDOM);
-    this.dom.appendChild(this.scrollDOM);
-    this._dispatch = config.dispatch || (tr => this.update([tr]));
-    this.dispatch = this.dispatch.bind(this);
-    this._root = config.root || getRoot(config.parent) || document;
-    this.viewState = new ViewState(config.state || EditorState.create(config));
-    this.plugins = this.state.facet(viewPlugin).map(spec => new PluginInstance(spec));
-    for (let plugin of this.plugins) plugin.update(this);
-    this.observer = new DOMObserver(this);
-    this.inputState = new InputState(this);
-    this.inputState.ensureHandlers(this, this.plugins);
-    this.docView = new DocView(this);
-    this.mountStyles();
-    this.updateAttrs();
-    this.updateState = 0 /* UpdateState.Idle */;
-    this.requestMeasure();
-    if (config.parent) config.parent.appendChild(this.dom);
-  }
   /**
   The current editor state.
   */
@@ -10629,8 +10696,61 @@ class EditorView {
   get win() {
     return this.dom.ownerDocument.defaultView || window;
   }
+  /**
+  Construct a new view. You'll want to either provide a `parent`
+  option, or put `view.dom` into your document after creating a
+  view, so that the user can see the editor.
+  */
+  constructor() {
+    let config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    this.plugins = [];
+    this.pluginMap = new Map();
+    this.editorAttrs = {};
+    this.contentAttrs = {};
+    this.bidiCache = [];
+    this.destroyed = false;
+    /**
+    @internal
+    */
+    this.updateState = 2 /* UpdateState.Updating */;
+    /**
+    @internal
+    */
+    this.measureScheduled = -1;
+    /**
+    @internal
+    */
+    this.measureRequests = [];
+    this.contentDOM = document.createElement("div");
+    this.scrollDOM = document.createElement("div");
+    this.scrollDOM.tabIndex = -1;
+    this.scrollDOM.className = "cm-scroller";
+    this.scrollDOM.appendChild(this.contentDOM);
+    this.announceDOM = document.createElement("div");
+    this.announceDOM.style.cssText = "position: fixed; top: -10000px";
+    this.announceDOM.setAttribute("aria-live", "polite");
+    this.dom = document.createElement("div");
+    this.dom.appendChild(this.announceDOM);
+    this.dom.appendChild(this.scrollDOM);
+    this._dispatch = config.dispatch || (tr => this.update([tr]));
+    this.dispatch = this.dispatch.bind(this);
+    this._root = config.root || getRoot(config.parent) || document;
+    this.viewState = new ViewState(config.state || EditorState.create(config));
+    this.plugins = this.state.facet(viewPlugin).map(spec => new PluginInstance(spec));
+    for (let plugin of this.plugins) plugin.update(this);
+    this.observer = new DOMObserver(this);
+    this.inputState = new InputState(this);
+    this.inputState.ensureHandlers(this, this.plugins);
+    this.docView = new DocView(this);
+    this.mountStyles();
+    this.updateAttrs();
+    this.updateState = 0 /* UpdateState.Idle */;
+    this.requestMeasure();
+    if (config.parent) config.parent.appendChild(this.dom);
+  }
   dispatch() {
-    this._dispatch(arguments.length == 1 && (arguments.length <= 0 ? undefined : arguments[0]) instanceof Transaction ? arguments.length <= 0 ? undefined : arguments[0] : this.state.update(...arguments));
+    let tr = arguments.length == 1 && (arguments.length <= 0 ? undefined : arguments[0]) instanceof Transaction ? arguments.length <= 0 ? undefined : arguments[0] : this.state.update(...arguments);
+    this._dispatch(tr, this);
   }
   /**
   Update the view for the given array of transactions. This will
@@ -11710,7 +11830,7 @@ function rectanglesForRange(view, className, range) {
     let top = visualStart ? drawForLine(range.from, null, visualStart) : drawForWidget(startBlock, false);
     let bottom = visualEnd ? drawForLine(null, range.to, visualEnd) : drawForWidget(endBlock, true);
     let between = [];
-    if ((visualStart || startBlock).to < (visualEnd || endBlock).from - 1) between.push(piece(leftSide, top.bottom, rightSide, bottom.top));else if (top.bottom < bottom.top && view.elementAtHeight((top.bottom + bottom.top) / 2).type == BlockType.Text) top.bottom = bottom.top = (top.bottom + bottom.top) / 2;
+    if ((visualStart || startBlock).to < (visualEnd || endBlock).from - (visualStart && visualEnd ? 1 : 0)) between.push(piece(leftSide, top.bottom, rightSide, bottom.top));else if (top.bottom < bottom.top && view.elementAtHeight((top.bottom + bottom.top) / 2).type == BlockType.Text) top.bottom = bottom.top = (top.bottom + bottom.top) / 2;
     return pieces(top).concat(between).concat(pieces(bottom));
   }
   function piece(left, top, right, bottom) {
@@ -11739,6 +11859,7 @@ function rectanglesForRange(view, className, range) {
       // coordsAtPos queries, would break selection drawing.
       let fromCoords = view.coordsAtPos(from, from == line.to ? -2 : 2);
       let toCoords = view.coordsAtPos(to, to == line.from ? 2 : -2);
+      if (!fromCoords || !toCoords) return;
       top = Math.min(fromCoords.top, toCoords.top, top);
       bottom = Math.max(fromCoords.bottom, toCoords.bottom, bottom);
       if (dir == Direction.LTR) horizontal.push(ltr && fromOpen ? leftSide : fromCoords.left, ltr && toOpen ? rightSide : toCoords.right);else horizontal.push(!ltr && toOpen ? leftSide : toCoords.left, !ltr && fromOpen ? rightSide : fromCoords.right);
@@ -12428,10 +12549,10 @@ function rectangularSelection(options) {
   return EditorView.mouseSelectionStyle.of((view, event) => filter(event) ? rectangleSelectionStyle(view, event) : null);
 }
 const keys = {
-  Alt: [18, e => e.altKey],
-  Control: [17, e => e.ctrlKey],
-  Shift: [16, e => e.shiftKey],
-  Meta: [91, e => e.metaKey]
+  Alt: [18, e => !!e.altKey],
+  Control: [17, e => !!e.ctrlKey],
+  Shift: [16, e => !!e.shiftKey],
+  Meta: [91, e => !!e.metaKey]
 };
 const showCrosshair = {
   style: "cursor: crosshair"
@@ -12804,6 +12925,10 @@ const showTooltip = /*@__PURE__*/Facet.define({
 });
 const showHoverTooltip = /*@__PURE__*/Facet.define();
 class HoverTooltipHost {
+  // Needs to be static so that host tooltip instances always match
+  static create(view) {
+    return new HoverTooltipHost(view);
+  }
   constructor(view) {
     this.view = view;
     this.mounted = false;
@@ -12811,10 +12936,6 @@ class HoverTooltipHost {
     this.dom.classList.add("cm-tooltip-hover");
     this.manager = new TooltipViewManager(view, showHoverTooltip, t => this.createHostedView(t));
   }
-  // Needs to be static so that host tooltip instances always match
-  static create(view) {
-    return new HoverTooltipHost(view);
-  }
   createHostedView(tooltip) {
     let hostedView = tooltip.create(this.view);
     hostedView.dom.classList.add("cm-tooltip-section");
@@ -12836,6 +12957,10 @@ class HoverTooltipHost {
   update(update) {
     this.manager.update(update);
   }
+  destroy() {
+    var _a;
+    for (let t of this.manager.tooltipViews) (_a = t.destroy) === null || _a === void 0 ? void 0 : _a.call(t);
+  }
 }
 const showHoverTooltipHost = /*@__PURE__*/showTooltip.compute([showHoverTooltip], state => {
   let tooltips = state.facet(showHoverTooltip).filter(t => t);
@@ -13221,6 +13346,7 @@ const defaults = {
   elementStyle: "",
   markers: () => RangeSet.empty,
   lineMarker: () => null,
+  widgetMarker: () => null,
   lineMarkerChange: null,
   initialSpacer: null,
   updateSpacer: null,
@@ -13296,19 +13422,22 @@ const gutterView = /*@__PURE__*/ViewPlugin.fromClass(class {
     let classSet = [];
     let contexts = this.gutters.map(gutter => new UpdateContext(gutter, this.view.viewport, -this.view.documentPadding.top));
     for (let line of this.view.viewportLineBlocks) {
-      let text;
+      if (classSet.length) classSet = [];
       if (Array.isArray(line.type)) {
-        for (let b of line.type) if (b.type == BlockType.Text) {
-          text = b;
-          break;
+        let first = true;
+        for (let b of line.type) {
+          if (b.type == BlockType.Text && first) {
+            advanceCursor(lineClasses, classSet, b.from);
+            for (let cx of contexts) cx.line(this.view, b, classSet);
+            first = false;
+          } else if (b.widget) {
+            for (let cx of contexts) cx.widget(this.view, b);
+          }
         }
-      } else {
-        text = line.type == BlockType.Text ? line : undefined;
+      } else if (line.type == BlockType.Text) {
+        advanceCursor(lineClasses, classSet, line.from);
+        for (let cx of contexts) cx.line(this.view, line, classSet);
       }
-      if (!text) continue;
-      if (classSet.length) classSet = [];
-      advanceCursor(lineClasses, classSet, line.from);
-      for (let cx of contexts) cx.line(this.view, text, classSet);
     }
     for (let cx of contexts) cx.finish();
     if (detach) this.view.scrollDOM.insertBefore(this.dom, after);
@@ -13371,6 +13500,21 @@ class UpdateContext {
     this.i = 0;
     this.cursor = RangeSet.iter(gutter.markers, viewport.from);
   }
+  addElement(view, block, markers) {
+    let {
+        gutter
+      } = this,
+      above = block.top - this.height;
+    if (this.i == gutter.elements.length) {
+      let newElt = new GutterElement(view, block.height, above, markers);
+      gutter.elements.push(newElt);
+      gutter.dom.appendChild(newElt.dom);
+    } else {
+      gutter.elements[this.i].update(view, block.height, above, markers);
+    }
+    this.height = block.bottom;
+    this.i++;
+  }
   line(view, line, extraMarkers) {
     let localMarkers = [];
     advanceCursor(this.cursor, localMarkers, line.from);
@@ -13379,16 +13523,11 @@ class UpdateContext {
     if (forLine) localMarkers.unshift(forLine);
     let gutter = this.gutter;
     if (localMarkers.length == 0 && !gutter.config.renderEmptyElements) return;
-    let above = line.top - this.height;
-    if (this.i == gutter.elements.length) {
-      let newElt = new GutterElement(view, line.height, above, localMarkers);
-      gutter.elements.push(newElt);
-      gutter.dom.appendChild(newElt.dom);
-    } else {
-      gutter.elements[this.i].update(view, line.height, above, localMarkers);
-    }
-    this.height = line.bottom;
-    this.i++;
+    this.addElement(view, line, localMarkers);
+  }
+  widget(view, block) {
+    let marker = this.gutter.config.widgetMarker(view, block.widget, block);
+    if (marker) this.addElement(view, block, [marker]);
   }
   finish() {
     let gutter = this.gutter;
@@ -13550,6 +13689,7 @@ const lineNumberGutter = /*@__PURE__*/activeGutters.compute([lineNumberConfig],
     if (others.some(m => m.toDOM)) return null;
     return new NumberMarker(formatNumber(view, view.state.doc.lineAt(line.from).number));
   },
+  widgetMarker: () => null,
   lineMarkerChange: update => update.startState.facet(lineNumberConfig) != update.state.facet(lineNumberConfig),
   initialSpacer(view) {
     return new NumberMarker(formatNumber(view, maxLineNumber(view.state.doc.lines)));
@@ -18388,4 +18528,4 @@ function createTokenType(extra, tagStr) {
   return type.id;
 }
 
-export { getTooltip as $, Annotation as A, highlightSpecialChars as B, ChangeSet as C, Direction as D, EditorView as E, Facet as F, foldGutter as G, drawSelection as H, IndentContext as I, dropCursor as J, indentOnInput as K, syntaxHighlighting as L, defaultHighlightStyle as M, NodeProp as N, bracketMatching as O, Prec as P, rectangularSelection as Q, RangeSetBuilder as R, StateField as S, Transaction as T, crosshairCursor as U, ViewPlugin as V, WidgetType as W, highlightActiveLine as X, keymap as Y, foldKeymap as Z, showTooltip as _, EditorSelection as a, MapMode as a0, RangeValue as a1, RangeSet as a2, Parser as a3, NodeSet as a4, NodeType as a5, DefaultBufferLength as a6, Tree as a7, IterMode as a8, styleTags as a9, tags as aa, parseMixed as ab, LanguageSupport as ac, LRLanguage as ad, indentNodeProp as ae, continuedIndent as af, foldNodeProp as ag, foldInside as ah, flatIndent as ai, delimitedIndent as aj, NodeWeakMap as ak, Tag as al, Language as am, defineLanguageFacet as an, languageDataProp as ao, LanguageDescription as ap, ParseContext as aq, HighlightStyle as ar, ChangeDesc as b, combineConfig as c, Text as d, indentUnit as e, countColumn as f, getIndentation as g, getIndentUnit as h, indentString as i, StateEffect as j, findClusterBreak as k, Decoration as l, matchBrackets as m, codePointAt as n, codePointSize as o, getPanel as p, CharCategory as q, fromCodePoint as r, syntaxTree as s, showPanel as t, EditorState as u, runScopeHandlers as v, hoverTooltip as w, logException as x, lineNumbers as y, highlightActiveLineGutter as z };
+export { showTooltip as $, Annotation as A, foldGutter as B, ChangeSet as C, Direction as D, EditorView as E, Facet as F, drawSelection as G, dropCursor as H, IndentContext as I, indentOnInput as J, syntaxHighlighting as K, defaultHighlightStyle as L, bracketMatching as M, NodeProp as N, rectangularSelection as O, Prec as P, crosshairCursor as Q, RangeSetBuilder as R, StateField as S, Transaction as T, highlightActiveLine as U, ViewPlugin as V, WidgetType as W, keymap as X, foldKeymap as Y, getTooltip as Z, logException as _, EditorSelection as a, MapMode as a0, RangeValue as a1, RangeSet as a2, Parser as a3, NodeSet as a4, NodeType as a5, DefaultBufferLength as a6, Tree as a7, IterMode as a8, styleTags as a9, tags as aa, parseMixed as ab, LanguageSupport as ac, LRLanguage as ad, indentNodeProp as ae, continuedIndent as af, foldNodeProp as ag, foldInside as ah, flatIndent as ai, delimitedIndent as aj, NodeWeakMap as ak, Tag as al, Language as am, defineLanguageFacet as an, languageDataProp as ao, LanguageDescription as ap, ParseContext as aq, HighlightStyle as ar, ChangeDesc as b, combineConfig as c, Text as d, indentUnit as e, countColumn as f, getIndentation as g, getIndentUnit as h, indentString as i, StateEffect as j, findClusterBreak as k, Decoration as l, matchBrackets as m, codePointAt as n, codePointSize as o, getPanel as p, CharCategory as q, fromCodePoint as r, syntaxTree as s, showPanel as t, EditorState as u, runScopeHandlers as v, hoverTooltip as w, lineNumbers as x, highlightActiveLineGutter as y, highlightSpecialChars as z };