@blocknote/core 0.8.1 → 0.8.2

package/dist/blocknote.js

@@ -1,18 +1,18 @@
 var Nt = Object.defineProperty;
-var At = (o, e, t) => e in o ? Nt(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
-var h = (o, e, t) => (At(o, typeof e != "symbol" ? e + "" : e, t), t);
-import { Node as R, InputRule as Y, mergeAttributes as w, Extension as v, findChildren as j, combineTransactionSteps as Ht, getChangedRanges as Ot, findChildrenInRange as Dt, Mark as st, findParentNode as Ft, isTextSelection as Rt, isNodeSelection as zt, posToDOMRect as at, getMarkRange as Q, extensions as N, Editor as Ut } from "@tiptap/core";
+var Lt = (o, e, t) => e in o ? Nt(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
+var h = (o, e, t) => (Lt(o, typeof e != "symbol" ? e + "" : e, t), t);
+import { Node as R, InputRule as V, mergeAttributes as x, Extension as v, findChildren as j, combineTransactionSteps as Ht, getChangedRanges as Ot, findChildrenInRange as Dt, Mark as st, findParentNode as Ft, isTextSelection as Rt, isNodeSelection as zt, posToDOMRect as at, getMarkRange as Q, extensions as N, Editor as Ut } from "@tiptap/core";
 import { PluginKey as E, Plugin as C, TextSelection as tt, Selection as G, NodeSelection as $t } from "prosemirror-state";
-import { Slice as I, Fragment as _, DOMSerializer as q, DOMParser as Gt } from "prosemirror-model";
+import { Slice as T, Fragment as P, DOMSerializer as q, DOMParser as Gt } from "prosemirror-model";
 import { v4 as jt } from "uuid";
 import lt from "rehype-parse";
 import qt from "rehype-remark";
 import dt from "rehype-stringify";
 import ct from "remark-gfm";
 import Wt from "remark-parse";
-import Yt from "remark-rehype";
-import Vt from "remark-stringify";
-import { unified as V } from "unified";
+import Vt from "remark-rehype";
+import Yt from "remark-stringify";
+import { unified as Y } from "unified";
 import { fromDom as et } from "hast-util-from-dom";
 import { Bold as Kt } from "@tiptap/extension-bold";
 import { Code as Jt } from "@tiptap/extension-code";
@@ -39,7 +39,7 @@ const ht = "_blockOuter_xgzwr_5", pt = "_block_xgzwr_5", ft = "_reactNodeViewRen
   inlineContent: yt,
   isFilter: bt,
   hasAnchor: vt
-}, Yo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, Vo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   block: pt,
   blockContent: mt,
@@ -91,7 +91,7 @@ function ce(o, e) {
     dom: t
   };
 }
-function Vo(o) {
+function Yo(o) {
   return {
     node: H({
       name: o.type,
@@ -161,7 +161,7 @@ const ue = H({
   },
   addInputRules() {
     return [
-      ...["1", "2", "3"].map((o) => new Y({
+      ...["1", "2", "3"].map((o) => new V({
         find: new RegExp(`^(#{${parseInt(o)}})\\s$`),
         handler: ({ state: e, chain: t, range: n }) => {
           t().BNUpdateBlock(e.selection.from, {
@@ -196,7 +196,7 @@ const ue = H({
   renderHTML({ node: o, HTMLAttributes: e }) {
     return [
       "div",
-      w(e, {
+      x(e, {
         class: k.blockContent,
         "data-content-type": this.name
       }),
@@ -253,7 +253,7 @@ const Et = (o) => {
   addInputRules() {
     return [
       // Creates an unordered list when starting with "-", "+", or "*".
-      new Y({
+      new V({
         find: new RegExp("^[-+*]\\s$"),
         handler: ({ state: o, chain: e, range: t }) => {
           e().BNUpdateBlock(o.selection.from, {
@@ -299,7 +299,7 @@ const Et = (o) => {
   renderHTML({ HTMLAttributes: o }) {
     return [
       "div",
-      w(o, {
+      x(o, {
         class: k.blockContent,
         "data-content-type": this.name
       }),
@@ -353,7 +353,7 @@ const Et = (o) => {
   addInputRules() {
     return [
       // Creates an ordered list when starting with "1.".
-      new Y({
+      new V({
         find: new RegExp("^1\\.\\s$"),
         handler: ({ state: o, chain: e, range: t }) => {
           e().BNUpdateBlock(o.selection.from, {
@@ -404,7 +404,7 @@ const Et = (o) => {
   renderHTML({ HTMLAttributes: o }) {
     return [
       "div",
-      w(o, {
+      x(o, {
         class: k.blockContent,
         "data-content-type": this.name
       }),
@@ -428,14 +428,14 @@ const Et = (o) => {
   renderHTML({ HTMLAttributes: o }) {
     return [
       "div",
-      w(o, {
+      x(o, {
         class: k.blockContent,
         "data-content-type": this.name
       }),
       ["p", { class: k.inlineContent }, 0]
     ];
   }
-}), A = {
+}), L = {
   backgroundColor: {
     default: "transparent"
   },
@@ -449,22 +449,22 @@ const Et = (o) => {
   }
 }, ke = {
   paragraph: {
-    propSchema: A,
+    propSchema: L,
     node: ge
   },
   heading: {
     propSchema: {
-      ...A,
+      ...L,
       level: { default: "1", values: ["1", "2", "3"] }
     },
     node: ue
   },
   bulletListItem: {
-    propSchema: A,
+    propSchema: L,
     node: he
   },
   numberedListItem: {
-    propSchema: A,
+    propSchema: L,
     node: me
   }
 };
@@ -544,21 +544,21 @@ const K = v.create({
             const b = Dt(
               r.doc,
               m,
-              (M) => l.includes(M.type.name)
-            ), y = b.map(({ node: M }) => M.attrs[d]).filter((M) => M !== null), U = be(y);
-            b.forEach(({ node: M, pos: O }) => {
+              (B) => l.includes(B.type.name)
+            ), y = b.map(({ node: B }) => B.attrs[d]).filter((B) => B !== null), U = be(y);
+            b.forEach(({ node: B, pos: O }) => {
               var $;
               const Z = ($ = a.doc.nodeAt(O)) === null || $ === void 0 ? void 0 : $.attrs[d];
               if (Z === null) {
                 a.setNodeMarkup(O, void 0, {
-                  ...M.attrs,
+                  ...B.attrs,
                   [d]: c()
                 });
                 return;
               }
-              const { deleted: Lt } = p.invert().mapResult(O);
-              Lt && U.includes(Z) && a.setNodeMarkup(O, void 0, {
-                ...M.attrs,
+              const { deleted: At } = p.invert().mapResult(O);
+              At && U.includes(Z) && a.setNodeMarkup(O, void 0, {
+                ...B.attrs,
                 [d]: c()
               });
             });
@@ -615,9 +615,9 @@ const K = v.create({
                   l.marks
                 );
                 a.push(d);
-              }), _.from(a);
+              }), P.from(a);
             };
-            return e = !1, new I(
+            return e = !1, new T(
               i(t.content),
               t.openStart,
               t.openEnd
@@ -639,11 +639,11 @@ const Ct = /* @__PURE__ */ new Set([
   "underline",
   "strike",
   "code"
-]), Mt = /* @__PURE__ */ new Set(["textColor", "backgroundColor"]);
+]), Bt = /* @__PURE__ */ new Set(["textColor", "backgroundColor"]);
 function nt(o, e) {
   const t = [];
   for (const [n, r] of Object.entries(o.styles))
-    Ct.has(n) ? t.push(e.mark(n)) : Mt.has(n) && t.push(e.mark(n, { color: r }));
+    Ct.has(n) ? t.push(e.mark(n)) : Bt.has(n) && t.push(e.mark(n, { color: r }));
   return o.text.split(/(\n)/g).filter((n) => n.length > 0).map((n) => n === `
 ` ? e.nodes.hardBreak.create() : e.text(n, t));
 }
@@ -651,7 +651,7 @@ function Ee(o, e) {
   const t = e.marks.link.create({
     href: o.href
   });
-  return Bt(o.content, e).map((n) => {
+  return wt(o.content, e).map((n) => {
     if (n.type.name === "text")
       return n.mark([...n.marks, t]);
     if (n.type.name === "hardBreak")
@@ -659,7 +659,7 @@ function Ee(o, e) {
     throw new Error("unexpected node type");
   });
 }
-function Bt(o, e) {
+function wt(o, e) {
   let t = [];
   if (typeof o == "string")
     return t.push(
@@ -669,13 +669,13 @@ function Bt(o, e) {
     t.push(...nt(n, e));
   return t;
 }
-function Tt(o, e) {
+function Mt(o, e) {
   let t = [];
   for (const n of o)
     if (n.type === "link")
       t.push(...Ee(n, e));
     else if (n.type === "text")
-      t.push(...Bt([n], e));
+      t.push(...wt([n], e));
     else
       throw new ve(n);
   return t;
@@ -694,7 +694,7 @@ function z(o, e) {
       e.text(o.content)
     );
   else {
-    const a = Tt(o.content, e);
+    const a = Mt(o.content, e);
     r = e.nodes[n].create(o.props, a);
   }
   const i = [];
@@ -732,7 +732,7 @@ function Ce(o) {
         i = s;
       else if (Ct.has(s.type.name))
         r[s.type.name] = !0;
-      else if (Mt.has(s.type.name))
+      else if (Bt.has(s.type.name))
         r[s.type.name] = s.attrs.color;
       else
         throw Error("Mark is of an unrecognized type: " + s.type.name);
@@ -787,7 +787,7 @@ function Ce(o) {
     };
   }), t && e.push(t), e;
 }
-function B(o, e, t) {
+function w(o, e, t) {
   if (o.type.name !== "blockContainer")
     throw Error(
       "Node must be of type blockContainer, but is of type" + o.type.name + "."
@@ -809,12 +809,12 @@ function B(o, e, t) {
         "Block is of an unrecognized type: " + r.contentType.name
       );
     const f = p.propSchema;
-    c in f ? s[c] = u : c !== "id" && !(c in A) && console.warn("Block has an unrecognized attribute: " + c);
+    c in f ? s[c] = u : c !== "id" && !(c in L) && console.warn("Block has an unrecognized attribute: " + c);
   }
   const a = Ce(r.contentNode), l = [];
   for (let c = 0; c < r.numChildBlocks; c++)
     l.push(
-      B(r.node.lastChild.child(c), e, t)
+      w(r.node.lastChild.child(c), e, t)
     );
   const d = {
     id: i,
@@ -834,7 +834,7 @@ function J(o, e) {
     posBeforeNode: n
   };
 }
-function wt(o, e, t = "before", n) {
+function Tt(o, e, t = "before", n) {
   const r = typeof e == "string" ? e : e.id, i = [];
   for (const d of o)
     i.push(z(d, n.schema));
@@ -856,11 +856,11 @@ function wt(o, e, t = "before", n) {
   }
   n.view.dispatch(n.state.tr.insert(s, i));
 }
-function Me(o, e, t) {
+function Be(o, e, t) {
   const n = typeof o == "string" ? o : o.id, { posBeforeNode: r } = J(n, t.state.doc);
   t.commands.BNUpdateBlock(r + 1, e);
 }
-function St(o, e) {
+function xt(o, e) {
   const t = new Set(
     o.map(
       (r) => typeof r == "string" ? r : r.id
@@ -885,10 +885,10 @@ function St(o, e) {
     );
   }
 }
-function Be(o, e, t) {
-  wt(e, o[0], "before", t), St(o, t);
+function we(o, e, t) {
+  Tt(e, o[0], "before", t), xt(o, t);
 }
-function Te() {
+function Me() {
   const o = (e) => {
     let t = e.children.length;
     for (let n = 0; n < t; n++) {
@@ -904,7 +904,7 @@ function Te() {
   };
   return o;
 }
-function we(o) {
+function Te(o) {
   const e = /* @__PURE__ */ new Set([
     ...o.orderedListItemBlockTypes,
     ...o.unorderedListItemBlockTypes
@@ -948,13 +948,13 @@ function we(o) {
   };
   return t;
 }
-async function xt(o, e) {
+async function St(o, e) {
   const t = document.createElement("div"), n = q.fromSchema(e);
   for (const i of o) {
     const s = z(i, e), a = n.serializeNode(s);
     t.appendChild(a);
   }
-  return (await V().use(lt, { fragment: !0 }).use(we, {
+  return (await Y().use(lt, { fragment: !0 }).use(Te, {
     orderedListItemBlockTypes: /* @__PURE__ */ new Set(["numberedListItem"]),
     unorderedListItemBlockTypes: /* @__PURE__ */ new Set(["bulletListItem"])
   }).use(dt).process(t.innerHTML)).value;
@@ -964,21 +964,21 @@ async function It(o, e, t) {
   n.innerHTML = o.trim();
   const i = Gt.fromSchema(t).parse(n), s = [];
   for (let a = 0; a < i.firstChild.childCount; a++)
-    s.push(B(i.firstChild.child(a), e));
+    s.push(w(i.firstChild.child(a), e));
   return s;
 }
-async function Se(o, e) {
-  return (await V().use(lt, { fragment: !0 }).use(Te).use(qt).use(ct).use(Vt).process(await xt(o, e))).value;
+async function xe(o, e) {
+  return (await Y().use(lt, { fragment: !0 }).use(Me).use(qt).use(ct).use(Yt).process(await St(o, e))).value;
 }
-async function xe(o, e, t) {
-  const n = await V().use(Wt).use(ct).use(Yt).use(dt).process(o);
+async function Se(o, e, t) {
+  const n = await Y().use(Wt).use(ct).use(Vt).use(dt).process(o);
   return It(n.value, e, t);
 }
-const Ie = "_bnEditor_4vj2p_3", _e = "_bnRoot_4vj2p_20", Pe = "_defaultStyles_4vj2p_35", Le = "_dragPreview_4vj2p_68", P = {
+const Ie = "_bnEditor_4vj2p_3", Pe = "_bnRoot_4vj2p_20", _e = "_defaultStyles_4vj2p_35", Ae = "_dragPreview_4vj2p_68", _ = {
   bnEditor: Ie,
-  bnRoot: _e,
-  defaultStyles: Pe,
-  dragPreview: Le,
+  bnRoot: Pe,
+  defaultStyles: _e,
+  dragPreview: Ae,
   "collaboration-cursor__caret": "_collaboration-cursor__caret_4vj2p_74",
   "collaboration-cursor__label": "_collaboration-cursor__label_4vj2p_85"
 }, Ne = v.create({
@@ -1011,7 +1011,7 @@ const Ie = "_bnEditor_4vj2p_3", _e = "_bnRoot_4vj2p_20", Pe = "_defaultStyles_4v
       }
     };
   }
-}), Ae = st.create({
+}), Le = st.create({
   name: "backgroundColor",
   addAttributes() {
     return {
@@ -1163,13 +1163,13 @@ const Ie = "_bnEditor_4vj2p_3", _e = "_bnRoot_4vj2p_20", Pe = "_defaultStyles_4v
   renderHTML({ HTMLAttributes: o }) {
     return [
       "div",
-      w(o, {
+      x(o, {
         class: k.blockOuter,
         "data-node-type": "block-outer"
       }),
       [
         "div",
-        w(o, {
+        x(o, {
           // TODO: maybe remove html attributes from inner block
           class: k.block,
           "data-node-type": this.name
@@ -1207,7 +1207,7 @@ const Ie = "_bnEditor_4vj2p_3", _e = "_bnRoot_4vj2p_20", Pe = "_defaultStyles_4v
             a.childCount === 2 ? t.tr.replace(
               i + l.nodeSize + 1,
               s - 1,
-              new I(_.from(d), 0, 0)
+              new T(P.from(d), 0, 0)
             ) : t.tr.insert(
               i + l.nodeSize,
               t.schema.nodes.blockGroup.create({}, d)
@@ -1215,10 +1215,10 @@ const Ie = "_bnEditor_4vj2p_3", _e = "_bnRoot_4vj2p_20", Pe = "_defaultStyles_4v
           }
           if (e.content !== void 0) {
             let d = [];
-            typeof e.content == "string" ? d.push(t.schema.text(e.content)) : d = Tt(e.content, t.schema), t.tr.replace(
+            typeof e.content == "string" ? d.push(t.schema.text(e.content)) : d = Mt(e.content, t.schema), t.tr.replace(
               i + 1,
               i + l.nodeSize - 1,
-              new I(_.from(d), 0, 0)
+              new T(P.from(d), 0, 0)
             );
           }
           t.tr.setNodeMarkup(
@@ -1270,7 +1270,13 @@ const Ie = "_bnEditor_4vj2p_3", _e = "_bnRoot_4vj2p_20", Pe = "_defaultStyles_4v
         for (; p.numChildBlocks > 0; )
           if (u--, p = g(e.doc, u), p === void 0)
             return !1;
-        return t && (e.tr.deleteRange(l, l + a.nodeSize), e.tr.insertText(a.textContent, u - 1), e.tr.setSelection(
+        return t && (t(
+          e.tr.deleteRange(l, l + a.nodeSize).replace(
+            u - 1,
+            l,
+            new T(a.content, 0, 0)
+          ).scrollIntoView()
+        ), e.tr.setSelection(
           new tt(e.doc.resolve(u - 1))
         )), !0;
       },
@@ -1284,8 +1290,8 @@ const Ie = "_bnEditor_4vj2p_3", _e = "_bnRoot_4vj2p_20", Pe = "_defaultStyles_4v
         return n && (t.tr.insert(f, p), t.tr.replace(
           m,
           m + 1,
-          u.content.size > 0 ? new I(
-            _.from(u),
+          u.content.size > 0 ? new T(
+            P.from(u),
             d + 2,
             d + 2
           ) : void 0
@@ -1299,8 +1305,8 @@ const Ie = "_bnEditor_4vj2p_3", _e = "_bnRoot_4vj2p_20", Pe = "_defaultStyles_4v
         ), t.tr.replace(
           a + 1,
           l - 1,
-          c.content.size > 0 ? new I(
-            _.from(c),
+          c.content.size > 0 ? new T(
+            P.from(c),
             d + 2,
             d + 2
           ) : void 0
@@ -1429,7 +1435,7 @@ const Ie = "_bnEditor_4vj2p_3", _e = "_bnRoot_4vj2p_20", Pe = "_defaultStyles_4v
   renderHTML({ HTMLAttributes: o }) {
     return [
       "div",
-      w(this.options.HTMLAttributes, o, {
+      x(this.options.HTMLAttributes, o, {
         class: k.blockGroup,
         "data-node-type": "blockGroup"
       }),
@@ -1493,9 +1499,7 @@ class je {
     h(this, "suggestionsMenu");
     h(this, "pluginState");
     h(this, "itemCallback");
-    h(this, "handleScroll", () => {
-      this.pluginKey.getState(this.editor._tiptapEditor.state).active && this.suggestionsMenu.render(this.getDynamicParams(), !1);
-    });
+    h(this, "lastPosition");
     this.editor = e, this.pluginKey = t, this.pluginState = W(), this.itemCallback = (i) => {
       e._tiptapEditor.chain().focus().deleteRange({
         from: this.pluginState.queryStartPos - this.pluginState.triggerCharacter.length,
@@ -1504,7 +1508,7 @@ class je {
         item: i,
         editor: e
       });
-    }, this.suggestionsMenu = r(this.getStaticParams()), document.addEventListener("scroll", this.handleScroll);
+    }, this.suggestionsMenu = r(this.getStaticParams());
   }
   update(e, t) {
     const n = this.pluginKey.getState(t), r = this.pluginKey.getState(e.state), i = !n.active && r.active, s = n.active && !r.active, a = n.active && r.active;
@@ -1516,22 +1520,29 @@ class je {
       (l) => l.preventDefault()
     )));
   }
-  destroy() {
-    document.removeEventListener("scroll", this.handleScroll);
-  }
   getStaticParams() {
     return {
-      itemCallback: (e) => this.itemCallback(e)
+      itemCallback: (e) => this.itemCallback(e),
+      getReferenceRect: () => {
+        const e = document.querySelector(
+          `[data-decoration-id="${this.pluginState.decorationId}"]`
+        );
+        if (!e) {
+          if (this.lastPosition === void 0)
+            throw new Error(
+              "Attempted to access trigger character reference rect before rendering suggestions menu."
+            );
+          return this.lastPosition;
+        }
+        const t = e.getBoundingClientRect();
+        return this.lastPosition = t, t;
+      }
     };
   }
   getDynamicParams() {
-    const e = document.querySelector(
-      `[data-decoration-id="${this.pluginState.decorationId}"]`
-    );
     return {
       items: this.pluginState.items,
-      keyboardHoveredItemIndex: this.pluginState.keyboardHoveredItemIndex,
-      referenceRect: e.getBoundingClientRect()
+      keyboardHoveredItemIndex: this.pluginState.keyboardHoveredItemIndex
     };
   }
 }
@@ -1707,7 +1718,7 @@ const X = new E("suggestions-slash-commands"), We = () => v.create({
     ];
   }
 });
-class L extends G {
+class A extends G {
   constructor(t, n) {
     super(t, n);
     h(this, "nodes");
@@ -1718,13 +1729,13 @@ class L extends G {
     });
   }
   static create(t, n, r = n) {
-    return new L(t.resolve(n), t.resolve(r));
+    return new A(t.resolve(n), t.resolve(r));
   }
   content() {
-    return new I(_.from(this.nodes), 0, 0);
+    return new T(P.from(this.nodes), 0, 0);
   }
   eq(t) {
-    if (!(t instanceof L) || this.nodes.length !== t.nodes.length || this.from !== t.from || this.to !== t.to)
+    if (!(t instanceof A) || this.nodes.length !== t.nodes.length || this.from !== t.from || this.to !== t.to)
       return !1;
     for (let n = 0; n < this.nodes.length; n++)
       if (!this.nodes[n].eq(t.nodes[n]))
@@ -1733,7 +1744,7 @@ class L extends G {
   }
   map(t, n) {
     let r = n.mapResult(this.from), i = n.mapResult(this.to);
-    return i.deleted ? G.near(t.resolve(r.pos)) : r.deleted ? G.near(t.resolve(i.pos)) : new L(
+    return i.deleted ? G.near(t.resolve(r.pos)) : r.deleted ? G.near(t.resolve(i.pos)) : new A(
       t.resolve(r.pos),
       t.resolve(i.pos)
     );
@@ -1742,9 +1753,9 @@ class L extends G {
     return { type: "node", anchor: this.anchor, head: this.head };
   }
 }
-const Ye = ae.__serializeForClipboard;
-let T;
-function _t(o, e) {
+const Ve = ae.__serializeForClipboard;
+let M;
+function Pt(o, e) {
   var r;
   if (!e.dom.isConnected)
     return;
@@ -1759,8 +1770,8 @@ function _t(o, e) {
       return { node: n, id: n.getAttribute("data-id") };
   }
 }
-function Ve(o, e) {
-  let t = _t(o, e);
+function Ye(o, e) {
+  let t = Pt(o, e);
   if (t && t.node.nodeType === 1) {
     const n = e.docView;
     let r = n.nearestDesc(t.node, !0);
@@ -1791,14 +1802,14 @@ function it(o, e, t = e) {
   );
   for (let c = r.childElementCount - 1; c >= 0; c--)
     (c > a || c < s) && n.removeChild(n.children[c]);
-  Pt(), T = n;
+  _t(), M = n;
   const d = o.dom.className.split(" ").filter(
     (c) => !c.includes("bn") && !c.includes("ProseMirror") && !c.includes("editor")
   ).join(" ");
-  T.className = T.className + " " + P.dragPreview + " " + d, document.body.appendChild(T);
+  M.className = M.className + " " + _.dragPreview + " " + d, document.body.appendChild(M);
 }
-function Pt() {
-  T !== void 0 && (document.body.removeChild(T), T = void 0);
+function _t() {
+  M !== void 0 && (document.body.removeChild(M), M = void 0);
 }
 function Je(o, e) {
   if (!o.dataTransfer)
@@ -1808,16 +1819,16 @@ function Je(o, e) {
     left: t.left + t.width / 2,
     // take middle of editor
     top: o.clientY
-  }, r = Ve(n, e);
+  }, r = Ye(n, e);
   if (r != null) {
-    const i = e.state.selection, s = e.state.doc, { from: a, to: l } = Ke(i, s), d = a <= r && r < l, c = i.$anchor.node() !== i.$head.node() || i instanceof L;
+    const i = e.state.selection, s = e.state.doc, { from: a, to: l } = Ke(i, s), d = a <= r && r < l, c = i.$anchor.node() !== i.$head.node() || i instanceof A;
     d && c ? (e.dispatch(
-      e.state.tr.setSelection(L.create(s, a, l))
+      e.state.tr.setSelection(A.create(s, a, l))
     ), it(e, a, l)) : (e.dispatch(
       e.state.tr.setSelection($t.create(e.state.doc, r))
     ), it(e, r));
-    let u = e.state.selection.content(), { dom: p, text: f } = Ye(e, u);
-    o.dataTransfer.clearData(), o.dataTransfer.setData("text/html", p.innerHTML), o.dataTransfer.setData("text/plain", f), o.dataTransfer.effectAllowed = "move", o.dataTransfer.setDragImage(T, 0, 0), e.dragging = { slice: u, move: !0 };
+    let u = e.state.selection.content(), { dom: p, text: f } = Ve(e, u);
+    o.dataTransfer.clearData(), o.dataTransfer.setData("text/html", p.innerHTML), o.dataTransfer.setData("text/plain", f), o.dataTransfer.effectAllowed = "move", o.dataTransfer.setDragImage(M, 0, 0), e.dragging = { slice: u, move: !0 };
   }
 }
 class Xe {
@@ -1839,6 +1850,7 @@ class Xe {
     h(this, "isDragging", !1);
     h(this, "menuOpen", !1);
     h(this, "menuFrozen", !1);
+    h(this, "lastPosition");
     /**
      * Sets isDragging when dragging text.
      */
@@ -1906,21 +1918,17 @@ class Xe {
         left: t.left + t.width / 2,
         // take middle of editor
         top: e.clientY
-      }, s = _t(i, this.ttEditor.view);
+      }, s = Pt(i, this.ttEditor.view);
       if (!s || !this.editor.isEditable) {
         this.menuOpen && (this.menuOpen = !1, this.blockMenu.hide());
         return;
       }
       this.menuOpen && ((d = this.hoveredBlock) != null && d.hasAttribute("data-id")) && ((c = this.hoveredBlock) == null ? void 0 : c.getAttribute("data-id")) === s.id || (this.hoveredBlock = s.node, !s.node.firstChild) || this.editor.isEditable && (this.menuOpen ? this.blockMenu.render(this.getDynamicParams(), !1) : (this.menuOpen = !0, this.blockMenu.render(this.getDynamicParams(), !0)));
     });
-    h(this, "onScroll", () => {
-      const e = this.ttEditor.view.dom.firstChild.getBoundingClientRect();
-      this.horizontalPosAnchor = e.x, this.menuOpen && this.blockMenu.render(this.getDynamicParams(), !1);
-    });
-    this.editor = t, this.ttEditor = e, this.horizontalPosAnchoredAtRoot = r, this.horizontalPosAnchor = this.ttEditor.view.dom.firstChild.getBoundingClientRect().x, this.blockMenu = n(this.getStaticParams()), document.body.addEventListener("drop", this.onDrop, !0), document.body.addEventListener("dragover", this.onDragOver), this.ttEditor.view.dom.addEventListener("dragstart", this.onDragStart), document.body.addEventListener("mousemove", this.onMouseMove, !0), document.addEventListener("scroll", this.onScroll), document.body.addEventListener("mousedown", this.onMouseDown, !0), document.body.addEventListener("keydown", this.onKeyDown, !0);
+    this.editor = t, this.ttEditor = e, this.horizontalPosAnchoredAtRoot = r, this.horizontalPosAnchor = this.ttEditor.view.dom.firstChild.getBoundingClientRect().x, this.blockMenu = n(this.getStaticParams()), document.body.addEventListener("drop", this.onDrop, !0), document.body.addEventListener("dragover", this.onDragOver), this.ttEditor.view.dom.addEventListener("dragstart", this.onDragStart), document.body.addEventListener("mousemove", this.onMouseMove, !0), document.body.addEventListener("mousedown", this.onMouseDown, !0), document.body.addEventListener("keydown", this.onKeyDown, !0);
   }
   destroy() {
-    this.menuOpen && (this.menuOpen = !1, this.blockMenu.hide()), document.body.removeEventListener("mousemove", this.onMouseMove), document.body.removeEventListener("dragover", this.onDragOver), this.ttEditor.view.dom.removeEventListener("dragstart", this.onDragStart), document.body.removeEventListener("drop", this.onDrop), document.body.removeEventListener("mousedown", this.onMouseDown), document.removeEventListener("scroll", this.onScroll), document.body.removeEventListener("keydown", this.onKeyDown);
+    this.menuOpen && (this.menuOpen = !1, this.blockMenu.hide()), document.body.removeEventListener("mousemove", this.onMouseMove), document.body.removeEventListener("dragover", this.onDragOver), this.ttEditor.view.dom.removeEventListener("dragstart", this.onDragStart), document.body.removeEventListener("drop", this.onDrop), document.body.removeEventListener("mousedown", this.onMouseDown), document.body.removeEventListener("keydown", this.onKeyDown);
   }
   addBlock() {
     this.menuOpen = !1, this.menuFrozen = !0, this.blockMenu.hide();
@@ -1954,25 +1962,29 @@ class Xe {
       blockDragStart: (e) => {
         this.isDragging = !0, Je(e, this.ttEditor.view);
       },
-      blockDragEnd: () => Pt(),
+      blockDragEnd: () => _t(),
       freezeMenu: () => {
         this.menuFrozen = !0;
       },
       unfreezeMenu: () => {
         this.menuFrozen = !1;
+      },
+      getReferenceRect: () => {
+        if (!this.menuOpen) {
+          if (this.lastPosition === void 0)
+            throw new Error(
+              "Attempted to access block reference rect before rendering block side menu."
+            );
+          return this.lastPosition;
+        }
+        const t = this.hoveredBlock.firstChild.getBoundingClientRect();
+        return this.horizontalPosAnchoredAtRoot && (t.x = this.horizontalPosAnchor), this.lastPosition = t, t;
       }
     };
   }
   getDynamicParams() {
-    const t = this.hoveredBlock.firstChild.getBoundingClientRect();
     return {
-      block: this.editor.getBlock(this.hoveredBlock.getAttribute("data-id")),
-      referenceRect: new DOMRect(
-        this.horizontalPosAnchoredAtRoot ? this.horizontalPosAnchor : t.x,
-        t.y,
-        t.width,
-        t.height
-      )
+      block: this.editor.getBlock(this.hoveredBlock.getAttribute("data-id"))
     };
   }
 }
@@ -2017,6 +2029,7 @@ class to {
     h(this, "preventShow", !1);
     h(this, "toolbarIsOpen", !1);
     h(this, "prevWasEditable", null);
+    h(this, "lastPosition");
     h(this, "shouldShow", ({ view: e, state: t, from: n, to: r }) => {
       const { doc: i, selection: s } = t, { empty: a } = s, l = !i.textBetween(n, r).length && Rt(t.selection);
       return !(!e.hasFocus() || a || l);
@@ -2043,10 +2056,7 @@ class to {
       e && e.relatedTarget && // Element is outside the toolbar.
       (this.formattingToolbar.element === e.relatedTarget || (t = this.formattingToolbar.element) != null && t.contains(e.relatedTarget)) || this.toolbarIsOpen && (this.formattingToolbar.hide(), this.toolbarIsOpen = !1);
     });
-    h(this, "scrollHandler", () => {
-      this.toolbarIsOpen && this.formattingToolbar.render(this.getDynamicParams(), !1);
-    });
-    this.editor = e, this.ttEditor = t, this.view = r, this.formattingToolbar = n(this.getStaticParams()), this.view.dom.addEventListener("mousedown", this.viewMousedownHandler), this.view.dom.addEventListener("mouseup", this.viewMouseupHandler), this.view.dom.addEventListener("dragstart", this.dragstartHandler), this.ttEditor.on("focus", this.focusHandler), this.ttEditor.on("blur", this.blurHandler), document.addEventListener("scroll", this.scrollHandler);
+    this.editor = e, this.ttEditor = t, this.view = r, this.formattingToolbar = n(this.getStaticParams()), this.view.dom.addEventListener("mousedown", this.viewMousedownHandler), this.view.dom.addEventListener("mouseup", this.viewMouseupHandler), this.view.dom.addEventListener("dragstart", this.dragstartHandler), this.ttEditor.on("focus", this.focusHandler), this.ttEditor.on("blur", this.blurHandler);
   }
   update(e, t) {
     var p;
@@ -2061,11 +2071,11 @@ class to {
       to: c
     });
     if (this.editor.isEditable && !this.toolbarIsOpen && !this.preventShow && (u || this.preventHide)) {
-      this.formattingToolbar.render(this.getDynamicParams(), !0), this.toolbarIsOpen = !0;
+      this.formattingToolbar.render({}, !0), this.toolbarIsOpen = !0;
       return;
     }
     if (this.toolbarIsOpen && !this.preventShow && (u || this.preventHide)) {
-      this.formattingToolbar.render(this.getDynamicParams(), !1);
+      this.formattingToolbar.render({}, !1);
       return;
     }
     if (this.toolbarIsOpen && !this.preventHide && (!u || this.preventShow || !this.editor.isEditable)) {
@@ -2074,7 +2084,7 @@ class to {
     }
   }
   destroy() {
-    this.view.dom.removeEventListener("mousedown", this.viewMousedownHandler), this.view.dom.removeEventListener("mouseup", this.viewMouseupHandler), this.view.dom.removeEventListener("dragstart", this.dragstartHandler), this.ttEditor.off("focus", this.focusHandler), this.ttEditor.off("blur", this.blurHandler), document.removeEventListener("scroll", this.scrollHandler);
+    this.view.dom.removeEventListener("mousedown", this.viewMousedownHandler), this.view.dom.removeEventListener("mouseup", this.viewMouseupHandler), this.view.dom.removeEventListener("dragstart", this.dragstartHandler), this.ttEditor.off("focus", this.focusHandler), this.ttEditor.off("blur", this.blurHandler);
   }
   getSelectionBoundingBox() {
     const { state: e } = this.ttEditor.view, { selection: t } = e, { ranges: n } = t, r = Math.min(...n.map((s) => s.$from.pos)), i = Math.max(...n.map((s) => s.$to.pos));
@@ -2087,12 +2097,18 @@ class to {
   }
   getStaticParams() {
     return {
-      editor: this.editor
-    };
-  }
-  getDynamicParams() {
-    return {
-      referenceRect: this.getSelectionBoundingBox()
+      editor: this.editor,
+      getReferenceRect: () => {
+        if (!this.toolbarIsOpen) {
+          if (this.lastPosition === void 0)
+            throw new Error(
+              "Attempted to access selection reference rect before rendering formatting toolbar."
+            );
+          return this.lastPosition;
+        }
+        const e = this.getSelectionBoundingBox();
+        return this.lastPosition = e, e;
+      }
     };
   }
 }
@@ -2129,6 +2145,7 @@ class ro {
     h(this, "keyboardHoveredHyperlinkMarkRange");
     h(this, "hyperlinkMark");
     h(this, "hyperlinkMarkRange");
+    h(this, "lastPosition");
     h(this, "mouseOverHandler", (e) => {
       if (this.mouseHoveredHyperlinkMark = void 0, this.mouseHoveredHyperlinkMarkRange = void 0, this.stopMenuUpdateTimer(), e.target instanceof HTMLAnchorElement && e.target.nodeName === "A") {
         const t = e.target, n = this.editor.view.posAtDOM(t, 0) + 1, r = this.editor.state.doc.resolve(
@@ -2154,14 +2171,11 @@ class ro {
       this.editor.view.dom !== e.target && !this.editor.view.dom.contains(e.target) && // Element is outside the toolbar.
       this.hyperlinkToolbar.element !== e.target && !((t = this.hyperlinkToolbar.element) != null && t.contains(e.target)) && this.hyperlinkToolbar.hide();
     });
-    h(this, "scrollHandler", () => {
-      this.hyperlinkMark !== void 0 && this.hyperlinkToolbar.render(this.getDynamicParams(), !1);
-    });
     this.editor = e, this.hyperlinkToolbar = t(this.getStaticParams()), this.startMenuUpdateTimer = () => {
       this.menuUpdateTimer = setTimeout(() => {
         this.update();
       }, 250);
-    }, this.stopMenuUpdateTimer = () => (this.menuUpdateTimer && (clearTimeout(this.menuUpdateTimer), this.menuUpdateTimer = void 0), !1), this.editor.view.dom.addEventListener("mouseover", this.mouseOverHandler), document.addEventListener("click", this.clickHandler, !0), document.addEventListener("scroll", this.scrollHandler);
+    }, this.stopMenuUpdateTimer = () => (this.menuUpdateTimer && (clearTimeout(this.menuUpdateTimer), this.menuUpdateTimer = void 0), !1), this.editor.view.dom.addEventListener("mouseover", this.mouseOverHandler), document.addEventListener("click", this.clickHandler, !0);
   }
   update() {
     var t, n, r, i;
@@ -2209,7 +2223,7 @@ class ro {
     this.editor.view.dom.removeEventListener(
       "mouseover",
       this.mouseOverHandler
-    ), document.removeEventListener("scroll", this.scrollHandler);
+    );
   }
   getStaticParams() {
     return {
@@ -2233,6 +2247,21 @@ class ro {
             this.hyperlinkMark.type
           ).setMeta("preventAutolink", !0)
         ), this.editor.view.focus(), this.hyperlinkToolbar.hide();
+      },
+      getReferenceRect: () => {
+        if (!this.hyperlinkMark) {
+          if (this.lastPosition === void 0)
+            throw new Error(
+              "Attempted to access hyperlink reference rect before rendering hyperlink toolbar."
+            );
+          return this.lastPosition;
+        }
+        const e = at(
+          this.editor.view,
+          this.hyperlinkMarkRange.from,
+          this.hyperlinkMarkRange.to
+        );
+        return this.lastPosition = e, e;
       }
     };
   }
@@ -2242,11 +2271,6 @@ class ro {
       text: this.editor.view.state.doc.textBetween(
         this.hyperlinkMarkRange.from,
         this.hyperlinkMarkRange.to
-      ),
-      referenceRect: at(
-        this.editor.view,
-        this.hyperlinkMarkRange.from,
-        this.hyperlinkMarkRange.to
       )
     };
   }
@@ -2329,7 +2353,7 @@ class S extends co {
     ).length !== 0), this.name = e, this.execute = t, this.aliases = n;
   }
 }
-function x(o, e) {
+function I(o, e) {
   const t = o.getTextCursorPosition().block;
   t.content.length === 1 && t.content[0].type === "text" && t.content[0].text === "/" || t.content.length === 0 ? o.updateBlock(t, e) : (o.insertBlocks([e], t, "after"), o.setTextCursorPosition(o.getTextCursorPosition().nextBlock));
 }
@@ -2337,7 +2361,7 @@ const uo = [
   // Command for creating a level 1 heading
   new S(
     "Heading",
-    (o) => x(o, {
+    (o) => I(o, {
       type: "heading",
       props: { level: "1" }
     }),
@@ -2346,7 +2370,7 @@ const uo = [
   // Command for creating a level 2 heading
   new S(
     "Heading 2",
-    (o) => x(o, {
+    (o) => I(o, {
       type: "heading",
       props: { level: "2" }
     }),
@@ -2355,7 +2379,7 @@ const uo = [
   // Command for creating a level 3 heading
   new S(
     "Heading 3",
-    (o) => x(o, {
+    (o) => I(o, {
       type: "heading",
       props: { level: "3" }
     }),
@@ -2364,7 +2388,7 @@ const uo = [
   // Command for creating an ordered list
   new S(
     "Numbered List",
-    (o) => x(o, {
+    (o) => I(o, {
       type: "numberedListItem"
     }),
     ["li", "list", "numberedlist", "numbered list"]
@@ -2372,7 +2396,7 @@ const uo = [
   // Command for creating a bullet list
   new S(
     "Bullet List",
-    (o) => x(o, {
+    (o) => I(o, {
       type: "bulletListItem"
     }),
     ["ul", "list", "bulletlist", "bullet list"]
@@ -2380,7 +2404,7 @@ const uo = [
   // Command for creating a paragraph (pretty useless)
   new S(
     "Paragraph",
-    (o) => x(o, {
+    (o) => I(o, {
       type: "paragraph"
     }),
     ["p"]
@@ -2633,7 +2657,7 @@ const uo = [
     se,
     fo,
     po,
-    Ae,
+    Le,
     Ne,
     ho,
     // custom blocks:
@@ -2655,9 +2679,9 @@ const uo = [
     );
     const t = (n) => {
       const r = document.createElement("span");
-      r.classList.add(P["collaboration-cursor__caret"]), r.setAttribute("style", `border-color: ${n.color}`);
+      r.classList.add(_["collaboration-cursor__caret"]), r.setAttribute("style", `border-color: ${n.color}`);
       const i = document.createElement("span");
-      i.classList.add(P["collaboration-cursor__label"]), i.setAttribute("style", `background-color: ${n.color}`), i.insertBefore(document.createTextNode(n.name), null);
+      i.classList.add(_["collaboration-cursor__label"]), i.setAttribute("style", `background-color: ${n.color}`), i.insertBefore(document.createTextNode(n.name), null);
       const s = document.createTextNode("⁠"), a = document.createTextNode("⁠");
       return r.insertBefore(s, null), r.insertBefore(i, null), r.insertBefore(a, null), r;
     };
@@ -2701,6 +2725,7 @@ class Ko {
     h(this, "_tiptapEditor");
     h(this, "blockCache", /* @__PURE__ */ new WeakMap());
     h(this, "schema");
+    h(this, "ready", !1);
     var i, s, a;
     this.options = e;
     const t = {
@@ -2732,15 +2757,15 @@ class Ko {
       ...t._tiptapOptions,
       onCreate: () => {
         var l;
-        (l = t.onEditorReady) == null || l.call(t, this), t.initialContent && this.replaceBlocks(this.topLevelBlocks, t.initialContent);
+        (l = t.onEditorReady) == null || l.call(t, this), t.initialContent && this.replaceBlocks(this.topLevelBlocks, t.initialContent), this.ready = !0;
       },
       onUpdate: () => {
         var l;
-        (l = t.onEditorContentChange) == null || l.call(t, this);
+        this.ready && ((l = t.onEditorContentChange) == null || l.call(t, this));
       },
       onSelectionUpdate: () => {
         var l;
-        (l = t.onTextCursorPositionChange) == null || l.call(t, this);
+        this.ready && ((l = t.onTextCursorPositionChange) == null || l.call(t, this));
       },
       editable: e.editable === void 0 ? !0 : e.editable,
       extensions: t.enableBlockNoteExtensions === !1 ? (i = t._tiptapOptions) == null ? void 0 : i.extensions : [...((s = t._tiptapOptions) == null ? void 0 : s.extensions) || [], ...n],
@@ -2749,9 +2774,9 @@ class Ko {
           "data-theme": e.theme || "light",
           ...t.editorDOMAttributes || {},
           class: [
-            P.bnEditor,
-            P.bnRoot,
-            t.defaultStyles ? P.defaultStyles : "",
+            _.bnEditor,
+            _.bnRoot,
+            t.defaultStyles ? _.defaultStyles : "",
             ((a = t.editorDOMAttributes) == null ? void 0 : a.class) || ""
           ].join(" ")
         }
@@ -2774,7 +2799,7 @@ class Ko {
    */
   get topLevelBlocks() {
     const e = [];
-    return this._tiptapEditor.state.doc.firstChild.descendants((t) => (e.push(B(t, this.schema, this.blockCache)), !1)), e;
+    return this._tiptapEditor.state.doc.firstChild.descendants((t) => (e.push(w(t, this.schema, this.blockCache)), !1)), e;
   }
   /**
    * Gets a snapshot of an existing block from the editor.
@@ -2784,7 +2809,7 @@ class Ko {
   getBlock(e) {
     const t = typeof e == "string" ? e : e.id;
     let n;
-    return this._tiptapEditor.state.doc.firstChild.descendants((r) => typeof n < "u" ? !1 : r.type.name !== "blockContainer" || r.attrs.id !== t ? !0 : (n = B(r, this.schema, this.blockCache), !1)), n;
+    return this._tiptapEditor.state.doc.firstChild.descendants((r) => typeof n < "u" ? !1 : r.type.name !== "blockContainer" || r.attrs.id !== t ? !0 : (n = w(r, this.schema, this.blockCache), !1)), n;
   }
   /**
    * Traverses all blocks in the editor depth-first, and executes a callback for each.
@@ -2826,9 +2851,9 @@ class Ko {
     i > 0 && (a = this._tiptapEditor.state.doc.resolve(n - 2).node());
     let l;
     return i < s - 1 && (l = this._tiptapEditor.state.doc.resolve(r + 2).node()), {
-      block: B(e, this.schema, this.blockCache),
-      prevBlock: a === void 0 ? void 0 : B(a, this.schema, this.blockCache),
-      nextBlock: l === void 0 ? void 0 : B(l, this.schema, this.blockCache)
+      block: w(e, this.schema, this.blockCache),
+      prevBlock: a === void 0 ? void 0 : w(a, this.schema, this.blockCache),
+      nextBlock: l === void 0 ? void 0 : w(l, this.schema, this.blockCache)
     };
   }
   /**
@@ -2854,7 +2879,7 @@ class Ko {
       return;
     const e = [];
     return this._tiptapEditor.state.doc.descendants((t, n) => t.type.spec.group !== "blockContent" || n + t.nodeSize < this._tiptapEditor.state.selection.from || n > this._tiptapEditor.state.selection.to ? !0 : (e.push(
-      B(
+      w(
         this._tiptapEditor.state.doc.resolve(n).node(),
         this.schema,
         this.blockCache
@@ -2884,7 +2909,7 @@ class Ko {
    * `referenceBlock`. Inserts the blocks at the start of the existing block's children if "nested" is used.
    */
   insertBlocks(e, t, n = "before") {
-    wt(e, t, n, this._tiptapEditor);
+    Tt(e, t, n, this._tiptapEditor);
   }
   /**
    * Updates an existing block in the editor. Since updatedBlock is a PartialBlock object, some fields might not be
@@ -2894,14 +2919,14 @@ class Ko {
    * @param update A partial block which defines how the existing block should be changed.
    */
   updateBlock(e, t) {
-    Me(e, t, this._tiptapEditor);
+    Be(e, t, this._tiptapEditor);
   }
   /**
    * Removes existing blocks from the editor. Throws an error if any of the blocks could not be found.
    * @param blocksToRemove An array of identifiers for existing blocks that should be removed.
    */
   removeBlocks(e) {
-    St(e, this._tiptapEditor);
+    xt(e, this._tiptapEditor);
   }
   /**
    * Replaces existing blocks in the editor with new blocks. If the blocks that should be removed are not adjacent or
@@ -2911,7 +2936,7 @@ class Ko {
    * @param blocksToInsert An array of partial blocks to replace the old ones with.
    */
   replaceBlocks(e, t) {
-    Be(e, t, this._tiptapEditor);
+    we(e, t, this._tiptapEditor);
   }
   /**
    * Gets the active text styles at the text cursor position or at the end of the current selection if it's active.
@@ -3038,7 +3063,7 @@ class Ko {
    * @returns The blocks, serialized as an HTML string.
    */
   async blocksToHTML(e) {
-    return xt(e, this._tiptapEditor.schema);
+    return St(e, this._tiptapEditor.schema);
   }
   /**
    * Parses blocks from an HTML string. Tries to create `Block` objects out of any HTML block-level elements, and
@@ -3057,7 +3082,7 @@ class Ko {
    * @returns The blocks, serialized as a Markdown string.
    */
   async blocksToMarkdown(e) {
-    return Se(e, this._tiptapEditor.schema);
+    return xe(e, this._tiptapEditor.schema);
   }
   /**
    * Creates a list of blocks from a Markdown string. Tries to create `Block` and `InlineNode` objects based on
@@ -3067,7 +3092,7 @@ class Ko {
    * @returns The blocks parsed from the Markdown string.
    */
   async markdownToBlocks(e) {
-    return xe(e, this.schema, this._tiptapEditor.schema);
+    return Se(e, this.schema, this._tiptapEditor.schema);
   }
   /**
    * Updates the user info for the current user that's shown to other collaborators.
@@ -3084,12 +3109,12 @@ export {
   S as BaseSlashMenuItem,
   Ko as BlockNoteEditor,
   $e as CustomBlockSerializerExtension,
-  Yo as blockStyles,
+  Vo as blockStyles,
   ot as camelToDataKebab,
-  Vo as createBlockSpec,
+  Yo as createBlockSpec,
   H as createTipTapBlock,
   ke as defaultBlockSchema,
-  A as defaultProps,
+  L as defaultProps,
   uo as defaultSlashMenuItems,
   go as getBlockNoteExtensions,
   de as parse,