@blocknote/core - npm Package Compare versions

Comparing version 0.2.2 to 0.2.3

dist/blocknote.js

 var re = Object.defineProperty;
-var ie = (o, e, t) => e in o ? re(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
-var h = (o, e, t) => (ie(o, typeof e != "symbol" ? e + "" : e, t), t);
-import { combineTransactionSteps as Q, getChangedRanges as X, findChildren as _, Node as w, mergeAttributes as N, InputRule as U, isTextSelection as se, isNodeSelection as ae, posToDOMRect as Z, Extension as E, findParentNode as de, getMarkRange as K, findChildrenInRange as le, extensions as P, Editor as ce } from "@tiptap/core";
+var ie = (t, e, o) => e in t ? re(t, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : t[e] = o;
+var h = (t, e, o) => (ie(t, typeof e != "symbol" ? e + "" : e, o), o);
+import { combineTransactionSteps as J, getChangedRanges as Q, findChildren as D, Node as T, mergeAttributes as S, InputRule as $, isTextSelection as se, isNodeSelection as ae, posToDOMRect as X, Extension as P, findParentNode as le, getMarkRange as W, findChildrenInRange as de, extensions as N, Editor as ce } from "@tiptap/core";
 import ue from "@tiptap/extension-bold";
@@ -10,37 +10,29 @@ import he from "@tiptap/extension-code";
 import fe from "@tiptap/extension-hard-break";
-import { History as ge } from "@tiptap/extension-history";
-import ke from "@tiptap/extension-italic";
+import { History as ke } from "@tiptap/extension-history";
+import ge from "@tiptap/extension-italic";
 import ye from "@tiptap/extension-strike";
 import be from "@tiptap/extension-text";
 import ve from "@tiptap/extension-underline";
-import { Slice as z, Fragment as ee } from "prosemirror-model";
-import { PluginKey as v, Plugin as T, TextSelection as W, Selection as F, NodeSelection as Ie } from "prosemirror-state";
-import * as Te from "prosemirror-view";
+import { Slice as z, Fragment as Z } from "prosemirror-model";
+import { PluginKey as B, Plugin as M, TextSelection as K, Selection as F, NodeSelection as Be } from "prosemirror-state";
+import * as Me from "prosemirror-view";
 import { Decoration as L, DecorationSet as O } from "prosemirror-view";
 import { escapeRegExp as V } from "lodash";
-import { Link as te } from "@tiptap/extension-link";
-import Ce from "@tiptap/extension-paragraph";
-import { v4 as Be } from "uuid";
-const j = {
-  blockColor: "data-block-color",
-  blockStyle: "data-block-style",
-  id: "data-id",
-  depth: "data-depth",
-  depthChange: "data-depth-change"
-};
-function k(o, e) {
-  if (e <= 0 || e > o.nodeSize)
+import { Link as ee } from "@tiptap/extension-link";
+import { v4 as Ce } from "uuid";
+function g(t, e) {
+  if (e <= 0 || e > t.nodeSize)
     return;
-  const t = o.resolve(e), n = t.depth;
-  let r = t.node(n), a = n;
+  const o = t.resolve(e), n = o.depth;
+  let r = o.node(n), a = n;
   for (; a >= 0; ) {
     if (a === 0)
       return;
-    if (r.type.name === "block")
+    if (r.type.name === "blockContainer")
       break;
-    a -= 1, r = t.node(a);
+    a -= 1, r = o.node(a);
   }
-  const d = r.attrs.id, i = r.firstChild, s = i.type, c = r.childCount === 2 ? r.lastChild.childCount : 0, p = t.start(a), u = t.end(a);
+  const l = r.attrs.id, i = r.firstChild, s = i.type, c = r.childCount === 2 ? r.lastChild.childCount : 0, p = o.start(a), u = o.end(a);
   return {
-    id: d,
+    id: l,
     node: r,
@@ -55,14 +47,13 @@ contentNode: i,
 }
-const Y = new v("previous-blocks"), Me = {
-  listItemType: "list-item-type",
-  listItemIndex: "list-item-index",
-  headingLevel: "heading-level",
+const Y = new B("previous-blocks"), we = {
+  index: "index",
+  level: "level",
   type: "type",
   depth: "depth",
   "depth-change": "depth-change"
-}, we = () => new T({
+}, Ie = () => new M({
   key: Y,
-  view(o) {
+  view(t) {
     return {
-      update: async (e, t) => {
+      update: async (e, o) => {
         var n;
@@ -84,27 +75,25 @@ (n = this.key) != null && n.getState(e.state).needsUpdate && setTimeout(() => {
     },
-    apply(o, e, t, n) {
-      if (e.needsUpdate = !1, e.prevBlockAttrs = {}, !o.docChanged || t.doc.eq(n.doc))
+    apply(t, e, o, n) {
+      if (e.needsUpdate = !1, e.prevBlockAttrs = {}, !t.docChanged || o.doc.eq(n.doc))
         return e;
-      const r = Q(t.doc, [o]);
-      return X(r).forEach(() => {
-        const d = _(t.doc, (c) => c.attrs.id), i = new Map(
-          d.map((c) => [c.node.attrs.id, c])
-        ), s = _(n.doc, (c) => c.attrs.id);
+      const r = J(o.doc, [t]);
+      return Q(r).forEach(() => {
+        const l = D(o.doc, (c) => c.attrs.id), i = new Map(
+          l.map((c) => [c.node.attrs.id, c])
+        ), s = D(n.doc, (c) => c.attrs.id);
         for (let c of s) {
-          const p = i.get(c.node.attrs.id), u = p == null ? void 0 : p.node.firstChild, l = c.node.firstChild;
-          if (p && u && l) {
+          const p = i.get(c.node.attrs.id), u = p == null ? void 0 : p.node.firstChild, d = c.node.firstChild;
+          if (p && u && d) {
             const m = {
-              listItemType: l.attrs.listItemType,
-              listItemIndex: l.attrs.listItemIndex,
-              headingLevel: l.attrs.headingLevel,
-              type: l.type.name,
+              index: d.attrs.index,
+              level: d.attrs.level,
+              type: d.type.name,
               depth: n.doc.resolve(c.pos).depth
             }, f = {
-              listItemType: u.attrs.listItemType,
-              listItemIndex: u.attrs.listItemIndex,
-              headingLevel: u.attrs.headingLevel,
+              index: u.attrs.index,
+              level: u.attrs.level,
               type: u.type.name,
-              depth: t.doc.resolve(p.pos).depth
-            }, y = f.listItemIndex === null && m.listItemIndex !== null, b = f.listItemIndex !== null && m.listItemIndex !== null && f.listItemIndex === m.listItemIndex, g = f.listItemType === "ordered" && m.listItemType === "ordered" ? y || b : !0;
-            JSON.stringify(f) !== JSON.stringify(m) && g && (f["depth-change"] = f.depth - m.depth, e.prevBlockAttrs[c.node.attrs.id] = f, console.log(
+              depth: o.doc.resolve(p.pos).depth
+            }, y = f.index === null && m.index !== null, b = f.index !== null && m.index !== null && f.index === m.index, k = f.type === "numberedListItem" && m.type === "numberedListItem" ? y || b : !0;
+            JSON.stringify(f) !== JSON.stringify(m) && k && (f["depth-change"] = f.depth - m.depth, e.prevBlockAttrs[c.node.attrs.id] = f, console.log(
               "id:",
@@ -123,8 +112,8 @@ c.node.attrs.id,
   props: {
-    decorations(o) {
-      const e = this.getState(o);
+    decorations(t) {
+      const e = this.getState(t);
       if (!e.needsUpdate)
         return;
-      const t = [];
-      return o.doc.descendants((n, r) => {
+      const o = [];
+      return t.doc.descendants((n, r) => {
         if (!n.attrs.id)
@@ -135,27 +124,33 @@ return;
           return;
-        const d = {};
+        const l = {};
         for (let [s, c] of Object.entries(a))
-          d["data-prev-" + Me[s]] = c || "none";
+          l["data-prev-" + we[s]] = c || "none";
         console.log(
           "previousBlockTypePlugin committing decorations",
-          d
+          l
         );
         const i = L.node(r, r + n.nodeSize, {
-          ...d
+          ...l
         });
-        t.push(i);
-      }), O.create(o.doc, t);
+        o.push(i);
+      }), O.create(t.doc, o);
     }
   }
-}), Se = "_blockOuter_r256c_5", xe = "_block_r256c_5", Ee = "_blockContent_r256c_25", Pe = "_blockGroup_r256c_53", Ae = "_isEmpty_r256c_238", Ne = "_isFilter_r256c_239", He = "_hasAnchor_r256c_252", I = {
-  blockOuter: Se,
-  block: xe,
-  blockContent: Ee,
-  blockGroup: Pe,
-  isEmpty: Ae,
+}), Te = "_blockOuter_6qmsf_5", Ee = "_block_6qmsf_5", xe = "_blockContent_6qmsf_25", Se = "_blockGroup_6qmsf_53", Pe = "_isEmpty_6qmsf_238", Ne = "_isFilter_6qmsf_239", Ae = "_hasAnchor_6qmsf_252", v = {
+  blockOuter: Te,
+  block: Ee,
+  blockContent: xe,
+  blockGroup: Se,
+  isEmpty: Pe,
   isFilter: Ne,
-  hasAnchor: He
-}, Le = w.create({
-  name: "block",
-  group: "block",
+  hasAnchor: Ae
+}, He = {
+  blockColor: "data-block-color",
+  blockStyle: "data-block-style",
+  id: "data-id",
+  depth: "data-depth",
+  depthChange: "data-depth-change"
+}, Le = T.create({
+  name: "blockContainer",
+  group: "blockContainer",
   content: "blockContent blockGroup?",
@@ -183,9 +178,9 @@ priority: 50,
         tag: "div",
-        getAttrs: (o) => {
-          if (typeof o == "string")
+        getAttrs: (t) => {
+          if (typeof t == "string")
             return !1;
           const e = {};
-          for (let [t, n] of Object.entries(j))
-            o.getAttribute(n) && (e[t] = o.getAttribute(n));
-          return o.getAttribute("data-node-type") === "block" ? e : !1;
+          for (let [o, n] of Object.entries(He))
+            t.getAttribute(n) && (e[o] = t.getAttribute(n));
+          return t.getAttribute("data-node-type") === "blockContainer" ? e : !1;
         }
@@ -195,10 +190,7 @@ }
   },
-  renderHTML({ HTMLAttributes: o }) {
-    const e = {};
-    for (let [t, n] of Object.entries(j))
-      o[t] !== void 0 && (e[n] = o[t]);
+  renderHTML({ HTMLAttributes: t }) {
     return [
       "div",
-      N(e, {
-        class: I.blockOuter,
+      S(t, {
+        class: v.blockOuter,
         "data-node-type": "block-outer"
@@ -208,4 +200,4 @@ }),
         "div",
-        N(e, {
-          class: I.block,
+        S(t, {
+          class: v.block,
           "data-node-type": this.name
@@ -219,50 +211,50 @@ }),
     return {
-      BNCreateBlock: (o) => ({ state: e, dispatch: t }) => {
-        const n = e.schema.nodes.block.createAndFill();
-        return t && e.tr.insert(o, n), !0;
+      BNCreateBlock: (t) => ({ state: e, dispatch: o }) => {
+        const n = e.schema.nodes.blockContainer.createAndFill();
+        return o && e.tr.insert(t, n), !0;
       },
-      BNDeleteBlock: (o) => ({ state: e, view: t, dispatch: n }) => {
-        const r = k(e.doc, o);
+      BNDeleteBlock: (t) => ({ state: e, view: o, dispatch: n }) => {
+        const r = g(e.doc, t);
         if (r === void 0)
           return !1;
-        const { startPos: a, endPos: d } = r;
-        return n && (e.tr.deleteRange(a, d), e.tr.setSelection(
-          new W(e.doc.resolve(a + 1))
-        ), t.focus()), !0;
+        const { startPos: a, endPos: l } = r;
+        return n && (e.tr.deleteRange(a, l), e.tr.setSelection(
+          new K(e.doc.resolve(a + 1))
+        ), o.focus()), !0;
       },
-      BNMergeBlocks: (o) => ({ state: e, dispatch: t }) => {
-        const n = e.doc.resolve(o + 1).node().type.name === "block", r = e.doc.resolve(o - 1).node().type.name === "block";
+      BNMergeBlocks: (t) => ({ state: e, dispatch: o }) => {
+        const n = e.doc.resolve(t + 1).node().type.name === "blockContainer", r = e.doc.resolve(t - 1).node().type.name === "blockContainer";
         if (!n || !r)
           return !1;
-        const a = k(
+        const a = g(
           e.doc,
-          o + 1
-        ), { node: d, contentNode: i, startPos: s, endPos: c, depth: p } = a;
-        if (d.childCount === 2) {
+          t + 1
+        ), { node: l, contentNode: i, startPos: s, endPos: c, depth: p } = a;
+        if (l.childCount === 2) {
           const m = e.doc.resolve(
             s + i.nodeSize + 1
           ), f = e.doc.resolve(c - 1), y = m.blockRange(f);
-          t && e.tr.lift(y, p - 1);
+          o && e.tr.lift(y, p - 1);
         }
-        let u = o - 1, l = k(e.doc, u);
-        for (; l.numChildBlocks > 0; )
-          if (u--, l = k(e.doc, u), l === void 0)
+        let u = t - 1, d = g(e.doc, u);
+        for (; d.numChildBlocks > 0; )
+          if (u--, d = g(e.doc, u), d === void 0)
             return !1;
-        return t && (e.tr.deleteRange(s, s + i.nodeSize), e.tr.insertText(i.textContent, u - 1), e.tr.setSelection(
-          new W(e.doc.resolve(u - 1))
+        return o && (e.tr.deleteRange(s, s + i.nodeSize), e.tr.insertText(i.textContent, u - 1), e.tr.setSelection(
+          new K(e.doc.resolve(u - 1))
         )), !0;
       },
-      BNSplitBlock: (o, e) => ({ state: t, dispatch: n }) => {
-        const r = k(t.doc, o);
+      BNSplitBlock: (t, e) => ({ state: o, dispatch: n }) => {
+        const r = g(o.doc, t);
         if (r === void 0)
           return !1;
-        const { contentNode: a, contentType: d, startPos: i, endPos: s, depth: c } = r, p = s + 1, u = t.doc.textBetween(o, s), l = t.schema.nodes.block.createAndFill(), m = p + 2;
-        n && (t.tr.insert(p, l), t.tr.insertText(u, m), e && t.tr.setBlockType(
+        const { contentNode: a, contentType: l, startPos: i, endPos: s, depth: c } = r, p = s + 1, u = o.doc.textBetween(t, s), d = o.schema.nodes.blockContainer.createAndFill(), m = p + 2;
+        n && (o.tr.insert(p, d), o.tr.insertText(u, m), e && o.tr.setBlockType(
           m,
           m,
-          t.schema.node(d).type,
+          o.schema.node(l).type,
           a.attrs
         ));
-        const f = t.doc.content.cut(i, o);
-        return n && t.tr.replace(
+        const f = o.doc.content.cut(i, t);
+        return n && o.tr.replace(
           i,
@@ -273,25 +265,28 @@ s,
       },
-      BNSetContentType: (o, e) => ({ state: t, dispatch: n }) => {
-        const r = k(t.doc, o);
+      BNUpdateBlock: (t, e) => ({ state: o, dispatch: n }) => {
+        const r = g(o.doc, t);
         if (r === void 0)
           return !1;
-        const { startPos: a, contentNode: d } = r;
-        return n && t.tr.setBlockType(
-          a + 1,
-          a + d.nodeSize + 1,
-          t.schema.node(e.name).type,
-          e.attrs
+        const { node: a, startPos: l, contentNode: i } = r;
+        return n && o.tr.setBlockType(
+          l + 1,
+          l + i.nodeSize + 1,
+          o.schema.node(e.type).type,
+          {
+            ...a.attrs,
+            ...e.props
+          }
         ), !0;
       },
-      BNCreateBlockOrSetContentType: (o, e) => ({ state: t, chain: n }) => {
-        const r = k(t.doc, o);
+      BNCreateOrUpdateBlock: (t, e) => ({ state: o, chain: n }) => {
+        const r = g(o.doc, t);
         if (r === void 0)
           return !1;
-        const { node: a, startPos: d, endPos: i } = r;
+        const { node: a, startPos: l, endPos: i } = r;
         if (a.textContent.length === 0) {
-          const s = d + 1;
-          return n().BNSetContentType(o, e).setTextSelection(s).run();
+          const s = l + 1;
+          return n().BNUpdateBlock(t, e).setTextSelection(s).run();
         } else {
           const s = i + 1, c = s + 1;
-          return n().BNCreateBlock(s).BNSetContentType(c, e).setTextSelection(c).run();
+          return n().BNCreateBlock(s).BNUpdateBlock(c, e).setTextSelection(c).run();
         }
@@ -302,37 +297,38 @@ }
   addProseMirrorPlugins() {
-    return [we()];
+    return [Ie()];
   },
   addKeyboardShortcuts() {
     return {
-      Backspace: () => this.editor.commands.first(({ commands: t }) => [
-        () => t.deleteSelection(),
-        () => t.undoInputRule(),
-        () => t.command(({ state: n }) => {
-          const { contentType: r } = k(
+      Backspace: () => this.editor.commands.first(({ commands: o }) => [
+        () => o.deleteSelection(),
+        () => o.undoInputRule(),
+        () => o.command(({ state: n }) => {
+          const { contentType: r } = g(
             n.doc,
             n.selection.from
-          ), a = n.selection.$anchor.parentOffset === 0, d = r.name === "textContent";
-          return a && !d ? t.BNSetContentType(n.selection.from, {
-            name: "textContent"
+          ), a = n.selection.$anchor.parentOffset === 0, l = r.name === "paragraph";
+          return a && !l ? o.BNUpdateBlock(n.selection.from, {
+            type: "paragraph",
+            props: {}
           }) : !1;
         }),
-        () => t.command(({ state: n }) => n.selection.$anchor.parentOffset === 0 ? t.liftListItem("block") : !1),
-        () => t.command(({ state: n }) => {
-          const { depth: r, startPos: a } = k(
+        () => o.command(({ state: n }) => n.selection.$anchor.parentOffset === 0 ? o.liftListItem("blockContainer") : !1),
+        () => o.command(({ state: n }) => {
+          const { depth: r, startPos: a } = g(
             n.doc,
             n.selection.from
-          ), d = n.selection.$anchor.parentOffset === 0, i = n.selection.anchor === n.selection.head, s = a === 2, c = a - 1;
-          return !s && d && i && r === 2 ? t.BNMergeBlocks(c) : !1;
+          ), l = n.selection.$anchor.parentOffset === 0, i = n.selection.anchor === n.selection.head, s = a === 2, c = a - 1;
+          return !s && l && i && r === 2 ? o.BNMergeBlocks(c) : !1;
         })
       ]),
-      Enter: () => this.editor.commands.first(({ commands: t }) => [
-        () => t.command(({ state: n }) => {
-          const { node: r, depth: a } = k(
+      Enter: () => this.editor.commands.first(({ commands: o }) => [
+        () => o.command(({ state: n }) => {
+          const { node: r, depth: a } = g(
             n.doc,
             n.selection.from
-          ), d = n.selection.$anchor.parentOffset === 0, i = n.selection.anchor === n.selection.head, s = r.textContent.length === 0, c = a > 2;
-          return d && i && s && c ? t.liftListItem("block") : !1;
+          ), l = n.selection.$anchor.parentOffset === 0, i = n.selection.anchor === n.selection.head, s = r.textContent.length === 0, c = a > 2;
+          return l && i && s && c ? o.liftListItem("blockContainer") : !1;
         }),
-        () => t.command(({ state: n, chain: r }) => {
-          const { node: a, endPos: d } = k(
+        () => o.command(({ state: n, chain: r }) => {
+          const { node: a, endPos: l } = g(
             n.doc,
@@ -342,3 +338,3 @@ n.selection.from
           if (i && s && c) {
-            const p = d + 1, u = p + 2;
+            const p = l + 1, u = p + 2;
             return r().BNCreateBlock(p).setTextSelection(u).run(), !0;
@@ -348,4 +344,4 @@ }
         }),
-        () => t.command(({ state: n, chain: r }) => {
-          const { node: a } = k(
+        () => o.command(({ state: n, chain: r }) => {
+          const { node: a } = g(
             n.doc,
@@ -357,56 +353,39 @@ n.selection.from
       ]),
-      Tab: () => this.editor.commands.sinkListItem("block"),
-      "Shift-Tab": () => this.editor.commands.liftListItem("block"),
+      Tab: () => (this.editor.commands.sinkListItem("blockContainer"), !0),
+      "Shift-Tab": () => (this.editor.commands.liftListItem("blockContainer"), !0),
       "Mod-Alt-0": () => this.editor.commands.BNCreateBlock(
         this.editor.state.selection.anchor + 2
       ),
-      "Mod-Alt-1": () => this.editor.commands.BNSetContentType(
-        this.editor.state.selection.anchor,
-        {
-          name: "headingContent",
-          attrs: {
-            headingLevel: "1"
-          }
+      "Mod-Alt-1": () => this.editor.commands.BNUpdateBlock(this.editor.state.selection.anchor, {
+        type: "heading",
+        props: {
+          level: "1"
         }
-      ),
-      "Mod-Alt-2": () => this.editor.commands.BNSetContentType(
-        this.editor.state.selection.anchor,
-        {
-          name: "headingContent",
-          attrs: {
-            headingLevel: "2"
-          }
+      }),
+      "Mod-Alt-2": () => this.editor.commands.BNUpdateBlock(this.editor.state.selection.anchor, {
+        type: "heading",
+        props: {
+          level: "2"
         }
-      ),
-      "Mod-Alt-3": () => this.editor.commands.BNSetContentType(
-        this.editor.state.selection.anchor,
-        {
-          name: "headingContent",
-          attrs: {
-            headingLevel: "3"
-          }
+      }),
+      "Mod-Alt-3": () => this.editor.commands.BNUpdateBlock(this.editor.state.selection.anchor, {
+        type: "heading",
+        props: {
+          level: "3"
         }
-      ),
-      "Mod-Shift-7": () => this.editor.commands.BNSetContentType(
-        this.editor.state.selection.anchor,
-        {
-          name: "listItemContent",
-          attrs: {
-            listItemType: "unordered"
-          }
-        }
-      ),
-      "Mod-Shift-8": () => this.editor.commands.BNSetContentType(
-        this.editor.state.selection.anchor,
-        {
-          name: "listItemContent",
-          attrs: {
-            listItemType: "ordered"
-          }
-        }
-      )
+      }),
+      "Mod-Shift-7": () => this.editor.commands.BNUpdateBlock(this.editor.state.selection.anchor, {
+        type: "bulletListItem",
+        props: {}
+      }),
+      "Mod-Shift-8": () => this.editor.commands.BNUpdateBlock(this.editor.state.selection.anchor, {
+        type: "numberedListItem",
+        props: {}
+      })
     };
   }
-}), Oe = w.create({
+}), Oe = T.create({
   name: "blockGroup",
+  group: "blockGroup",
+  content: "blockContainer+",
   addOptions() {
@@ -417,3 +396,2 @@ return {
   },
-  content: "block+",
   parseHTML() {
@@ -423,12 +401,12 @@ return [
         tag: "div",
-        getAttrs: (o) => typeof o == "string" ? !1 : o.getAttribute("data-node-type") === "block-group" ? null : !1
+        getAttrs: (t) => typeof t == "string" ? !1 : t.getAttribute("data-node-type") === "blockGroup" ? null : !1
       }
     ];
   },
-  renderHTML({ HTMLAttributes: o }) {
+  renderHTML({ HTMLAttributes: t }) {
     return [
       "div",
-      N(this.options.HTMLAttributes, o, {
-        class: I.blockGroup,
-        "data-node-type": "block-group"
+      S(this.options.HTMLAttributes, t, {
+        class: v.blockGroup,
+        "data-node-type": "blockGroup"
       }),
@@ -438,4 +416,4 @@ 0
   }
-}), Re = w.create({
-  name: "textContent",
+}), Re = T.create({
+  name: "paragraph",
   group: "blockContent",
@@ -448,3 +426,3 @@ content: "inline*",
         priority: 200,
-        node: "block"
+        node: "blockContainer"
       }
@@ -457,3 +435,3 @@ ];
       {
-        class: I.blockContent,
+        class: v.blockContent,
         "data-content-type": this.name
@@ -464,4 +442,4 @@ },
   }
-}), Fe = w.create({
-  name: "headingContent",
+}), Fe = T.create({
+  name: "heading",
   group: "blockContent",
@@ -471,7 +449,7 @@ content: "inline*",
     return {
-      headingLevel: {
+      level: {
         default: "1",
-        parseHTML: (o) => o.getAttribute("data-heading-level"),
-        renderHTML: (o) => ({
-          "data-heading-level": o.headingLevel
+        parseHTML: (t) => t.getAttribute("data-level"),
+        renderHTML: (t) => ({
+          "data-level": t.level
         })
@@ -483,9 +461,9 @@ }
     return [
-      ...["1", "2", "3"].map((o) => new U({
-        find: new RegExp(`^(#{${parseInt(o)}})\\s$`),
-        handler: ({ state: e, chain: t, range: n }) => {
-          t().BNSetContentType(e.selection.from, {
-            name: "headingContent",
-            attrs: {
-              headingLevel: o
+      ...["1", "2", "3"].map((t) => new $({
+        find: new RegExp(`^(#{${parseInt(t)}})\\s$`),
+        handler: ({ state: e, chain: o, range: n }) => {
+          o().BNUpdateBlock(e.selection.from, {
+            type: "heading",
+            props: {
+              level: t
             }
@@ -501,54 +479,111 @@ }).deleteRange({ from: n.from, to: n.to });
         tag: "h1",
-        attrs: { headingLevel: "1" },
-        node: "block"
+        attrs: { level: "1" },
+        node: "blockContainer"
       },
       {
         tag: "h2",
-        attrs: { headingLevel: "2" },
-        node: "block"
+        attrs: { level: "2" },
+        node: "blockContainer"
       },
       {
         tag: "h3",
-        attrs: { headingLevel: "3" },
-        node: "block"
+        attrs: { level: "3" },
+        node: "blockContainer"
       }
     ];
   },
-  renderHTML({ node: o, HTMLAttributes: e }) {
-    return console.log(o.attrs), [
+  renderHTML({ node: t, HTMLAttributes: e }) {
+    return [
       "div",
-      N(e, {
-        class: I.blockContent,
+      S(e, {
+        class: v.blockContent,
         "data-content-type": this.name
       }),
-      ["h" + o.attrs.headingLevel, 0]
+      ["h" + t.attrs.level, 0]
     ];
   }
-}), De = new v("ordered-list-item-index"), _e = () => new T({
+}), te = (t) => {
+  const { node: e, contentType: o } = g(
+    t.state.doc,
+    t.state.selection.from
+  ), n = t.state.selection.anchor === t.state.selection.head;
+  return !o.name.endsWith("ListItem") || !n ? !1 : t.commands.first(({ state: r, chain: a, commands: l }) => [
+    () => l.command(() => e.textContent.length === 0 ? l.BNUpdateBlock(r.selection.from, {
+      type: "paragraph",
+      props: {}
+    }) : !1),
+    () => l.command(() => e.textContent.length > 0 ? (a().deleteSelection().BNSplitBlock(r.selection.from, !0).run(), !0) : !1)
+  ]);
+}, _e = T.create({
+  name: "bulletListItem",
+  group: "blockContent",
+  content: "inline*",
+  addInputRules() {
+    return [
+      new $({
+        find: new RegExp("^[-+*]\\s$"),
+        handler: ({ state: t, chain: e, range: o }) => {
+          e().BNUpdateBlock(t.selection.from, {
+            type: "bulletListItem",
+            props: {}
+          }).deleteRange({ from: o.from, to: o.to });
+        }
+      })
+    ];
+  },
+  addKeyboardShortcuts() {
+    return {
+      Enter: () => te(this.editor)
+    };
+  },
+  parseHTML() {
+    return [
+      {
+        tag: "li",
+        getAttrs: (t) => {
+          if (typeof t == "string")
+            return !1;
+          const e = t.parentElement;
+          return e === null ? !1 : e.getAttribute("data-content-type") === "bulletListItem" ? {} : e.tagName === "UL" ? {} : !1;
+        },
+        node: "blockContainer"
+      }
+    ];
+  },
+  renderHTML({ HTMLAttributes: t }) {
+    return [
+      "div",
+      S(t, {
+        class: v.blockContent,
+        "data-content-type": this.name
+      }),
+      ["li", 0]
+    ];
+  }
+}), De = new B("numbered-list-indexing"), Ue = () => new M({
   key: De,
-  appendTransaction: (o, e, t) => {
-    const n = t.tr;
-    n.setMeta("orderedListIndexing", !0);
+  appendTransaction: (t, e, o) => {
+    const n = o.tr;
+    n.setMeta("numberedListIndexing", !0);
     let r = !1;
-    return t.doc.descendants((a, d) => {
-      if (a.type.name === "block" && a.firstChild.type.name === "listItemContent" && a.firstChild.attrs.listItemType === "ordered") {
+    return o.doc.descendants((a, l) => {
+      if (a.type.name === "blockContainer" && a.firstChild.type.name === "numberedListItem") {
         let i = "1";
-        const s = d === 1, c = k(n.doc, d + 1);
+        const s = l === 1, c = g(n.doc, l + 1);
         if (c === void 0)
           return;
         if (!s) {
-          const l = k(n.doc, d - 2);
-          if (l === void 0)
+          const d = g(n.doc, l - 2);
+          if (d === void 0)
             return;
-          if (!(c.depth !== l.depth)) {
-            const f = l.contentNode;
-            if (l.contentType.name === "listItemContent" && f.attrs.listItemType === "ordered") {
-              const g = f.attrs.listItemIndex;
-              i = (parseInt(g) + 1).toString();
+          if (!(c.depth !== d.depth)) {
+            const f = d.contentNode;
+            if (d.contentType.name === "numberedListItem") {
+              const k = f.attrs.index;
+              i = (parseInt(k) + 1).toString();
             }
           }
         }
-        c.contentNode.attrs.listItemIndex !== i && (r = !0, n.setNodeMarkup(d + 1, void 0, {
-          listItemType: "ordered",
-          listItemIndex: i
+        c.contentNode.attrs.index !== i && (r = !0, n.setNodeMarkup(l + 1, void 0, {
+          index: i
         }));
@@ -558,4 +593,4 @@ }
   }
-}), Ue = w.create({
-  name: "listItemContent",
+}), $e = T.create({
+  name: "numberedListItem",
   group: "blockContent",
@@ -565,14 +600,7 @@ content: "inline*",
     return {
-      listItemType: {
-        default: "unordered",
-        parseHTML: (o) => o.getAttribute("data-list-item-type"),
-        renderHTML: (o) => ({
-          "data-list-item-type": o.listItemType
-        })
-      },
-      listItemIndex: {
+      index: {
         default: null,
-        parseHTML: (o) => o.getAttribute("data-list-item-index"),
-        renderHTML: (o) => ({
-          "data-list-item-index": o.listItemIndex
+        parseHTML: (t) => t.getAttribute("data-index"),
+        renderHTML: (t) => ({
+          "data-index": t.index
         })
@@ -584,22 +612,9 @@ }
     return [
-      new U({
-        find: new RegExp("^[-+*]\\s$"),
-        handler: ({ state: o, chain: e, range: t }) => {
-          e().BNSetContentType(o.selection.from, {
-            name: "listItemContent",
-            attrs: {
-              listItemType: "unordered"
-            }
-          }).deleteRange({ from: t.from, to: t.to });
-        }
-      }),
-      new U({
+      new $({
         find: new RegExp("^1\\.\\s$"),
-        handler: ({ state: o, chain: e, range: t }) => {
-          e().BNSetContentType(o.selection.from, {
-            name: "listItemContent",
-            attrs: {
-              listItemType: "ordered"
-            }
-          }).deleteRange({ from: t.from, to: t.to });
+        handler: ({ state: t, chain: e, range: o }) => {
+          e().BNUpdateBlock(t.selection.from, {
+            type: "numberedListItem",
+            props: {}
+          }).deleteRange({ from: o.from, to: o.to });
         }
@@ -611,18 +626,7 @@ })
     return {
-      Enter: () => {
-        const { node: e, contentType: t } = k(
-          this.editor.state.doc,
-          this.editor.state.selection.from
-        ), n = this.editor.state.selection.anchor === this.editor.state.selection.head;
-        return t.name !== "listItemContent" || !n ? !1 : this.editor.commands.first(({ state: r, chain: a, commands: d }) => [
-          () => d.command(() => e.textContent.length === 0 ? d.BNSetContentType(r.selection.from, {
-            name: "textContent"
-          }) : !1),
-          () => d.command(() => e.textContent.length > 0 ? (a().deleteSelection().BNSplitBlock(r.selection.from, !0).run(), !0) : !1)
-        ]);
-      }
+      Enter: () => te(this.editor)
     };
   },
   addProseMirrorPlugins() {
-    return [_e()];
+    return [Ue()];
   },
@@ -633,17 +637,17 @@ parseHTML() {
         tag: "li",
-        getAttrs: (o) => {
-          if (typeof o == "string")
+        getAttrs: (t) => {
+          if (typeof t == "string")
             return !1;
-          const e = o.parentElement;
-          return e === null ? !1 : e.getAttribute("data-content-type") === "listItemContent" ? { listItemType: e.getAttribute("data-list-item-type") } : e.tagName === "UL" ? { listItemType: "unordered" } : e.tagName === "OL" ? { listItemType: "ordered" } : !1;
+          const e = t.parentElement;
+          return e === null ? !1 : e.getAttribute("data-content-type") === "numberedListItem" ? {} : e.tagName === "OL" ? {} : !1;
         },
-        node: "block"
+        node: "blockContainer"
       }
     ];
   },
-  renderHTML({ HTMLAttributes: o }) {
+  renderHTML({ HTMLAttributes: t }) {
     return [
       "div",
-      N(o, {
-        class: I.blockContent,
+      S(t, {
+        class: v.blockContent,
         "data-content-type": this.name
@@ -654,9 +658,10 @@ }),
   }
-}), $e = [
+}), ze = [
   Re,
   Fe,
-  Ue,
+  _e,
+  $e,
   Le,
   Oe,
-  w.create({
+  T.create({
     name: "doc",
@@ -667,6 +672,6 @@ topNode: !0,
 ];
-class ze {
+class qe {
   constructor({
     editor: e,
-    formattingToolbarFactory: t,
+    formattingToolbarFactory: o,
     view: n,
@@ -681,4 +686,4 @@ shouldShow: r
     h(this, "toolbarIsOpen", !1);
-    h(this, "shouldShow", ({ view: e, state: t, from: n, to: r }) => {
-      const { doc: a, selection: d } = t, { empty: i } = d, s = !a.textBetween(n, r).length && se(t.selection);
+    h(this, "shouldShow", ({ view: e, state: o, from: n, to: r }) => {
+      const { doc: a, selection: l } = o, { empty: i } = l, s = !a.textBetween(n, r).length && se(o.selection);
       return !(!e.hasFocus() || i || s);
@@ -699,3 +704,3 @@ });
     h(this, "blurHandler", ({ event: e }) => {
-      var t, n;
+      var o, n;
       if (this.preventHide) {
@@ -705,18 +710,18 @@ this.preventHide = !1;
       }
-      (e == null ? void 0 : e.relatedTarget) && ((n = (t = this.formattingToolbar.element) == null ? void 0 : t.parentNode) == null ? void 0 : n.contains(
+      (e == null ? void 0 : e.relatedTarget) && ((n = (o = this.formattingToolbar.element) == null ? void 0 : o.parentNode) == null ? void 0 : n.contains(
         e.relatedTarget
       )) || this.toolbarIsOpen && (this.formattingToolbar.hide(), this.toolbarIsOpen = !1);
     });
-    this.editor = e, this.view = n, this.formattingToolbar = t(this.getStaticParams()), r && (this.shouldShow = r), this.view.dom.addEventListener("mousedown", this.viewMousedownHandler), this.view.dom.addEventListener("mouseup", this.viewMouseupHandler), this.view.dom.addEventListener("dragstart", this.dragstartHandler), this.editor.on("focus", this.focusHandler), this.editor.on("blur", this.blurHandler);
+    this.editor = e, this.view = n, this.formattingToolbar = o(this.getStaticParams()), r && (this.shouldShow = r), this.view.dom.addEventListener("mousedown", this.viewMousedownHandler), this.view.dom.addEventListener("mouseup", this.viewMouseupHandler), this.view.dom.addEventListener("dragstart", this.dragstartHandler), this.editor.on("focus", this.focusHandler), this.editor.on("blur", this.blurHandler);
   }
-  update(e, t) {
-    var l;
-    const { state: n, composing: r } = e, { doc: a, selection: d } = n, i = t && t.doc.eq(a) && t.selection.eq(d);
+  update(e, o) {
+    var d;
+    const { state: n, composing: r } = e, { doc: a, selection: l } = n, i = o && o.doc.eq(a) && o.selection.eq(l);
     if (r || i)
       return;
-    const { ranges: s } = d, c = Math.min(...s.map((m) => m.$from.pos)), p = Math.max(...s.map((m) => m.$to.pos)), u = (l = this.shouldShow) == null ? void 0 : l.call(this, {
+    const { ranges: s } = l, c = Math.min(...s.map((m) => m.$from.pos)), p = Math.max(...s.map((m) => m.$to.pos)), u = (d = this.shouldShow) == null ? void 0 : d.call(this, {
       editor: this.editor,
       view: e,
       state: n,
-      oldState: t,
+      oldState: o,
       from: c,
@@ -748,9 +753,9 @@ to: p
   getSelectionBoundingBox() {
-    const { state: e } = this.editor.view, { selection: t } = e, { ranges: n } = t, r = Math.min(...n.map((d) => d.$from.pos)), a = Math.max(...n.map((d) => d.$to.pos));
-    if (ae(t)) {
-      const d = this.editor.view.nodeDOM(r);
-      if (d)
-        return d.getBoundingClientRect();
+    const { state: e } = this.editor.view, { selection: o } = e, { ranges: n } = o, r = Math.min(...n.map((l) => l.$from.pos)), a = Math.max(...n.map((l) => l.$to.pos));
+    if (ae(o)) {
+      const l = this.editor.view.nodeDOM(r);
+      if (l)
+        return l.getBoundingClientRect();
     }
-    return Z(this.editor.view, r, a);
+    return X(this.editor.view, r, a);
   }
@@ -771,14 +776,14 @@ getStaticParams() {
       },
-      setHyperlink: (e, t) => {
+      setHyperlink: (e, o) => {
         if (e === "")
           return;
         let { from: n, to: r } = this.editor.state.selection;
-        t || (t = this.editor.state.doc.textBetween(n, r));
+        o || (o = this.editor.state.doc.textBetween(n, r));
         const a = this.editor.schema.mark("link", { href: e });
         this.editor.view.dispatch(
-          this.editor.view.state.tr.insertText(t, n, r).addMark(n, n + t.length, a)
+          this.editor.view.state.tr.insertText(o, n, r).addMark(n, n + o.length, a)
         ), this.editor.view.focus();
       },
-      setBlockType: (e) => {
-        this.editor.view.focus(), this.editor.commands.BNSetContentType(
+      updateBlock: (e) => {
+        this.editor.view.focus(), this.editor.commands.BNUpdateBlock(
           this.editor.state.selection.from,
@@ -791,2 +796,6 @@ e
   getDynamicParams() {
+    const e = g(
+      this.editor.state.doc,
+      this.editor.state.selection.from
+    );
     return {
@@ -803,14 +812,14 @@ boldIsActive: this.editor.isActive("bold"),
       ),
-      activeBlockType: {
-        name: this.editor.state.selection.$from.node().type.name,
-        attrs: this.editor.state.selection.$from.node().attrs
+      block: {
+        type: e.contentType.name,
+        props: e.contentNode.attrs
       },
-      selectionBoundingBox: this.getSelectionBoundingBox()
+      referenceRect: this.getSelectionBoundingBox()
     };
   }
 }
-const qe = (o) => new T({
-  key: new v("FormattingToolbarPlugin"),
-  view: (e) => new ze({ view: e, ...o })
-}), Ge = E.create({
+const Ge = (t) => new M({
+  key: new B("FormattingToolbarPlugin"),
+  view: (e) => new qe({ view: e, ...t })
+}), We = P.create({
   name: "FormattingToolbarExtension",
@@ -823,53 +832,23 @@ addProseMirrorPlugins() {
     return [
-      qe({
+      Ge({
         editor: this.editor,
         formattingToolbarFactory: this.options.formattingToolbarFactory,
-        pluginKey: new v("FormattingToolbarPlugin")
+        pluginKey: new B("FormattingToolbarPlugin")
       })
     ];
   }
-});
-class A extends F {
-  constructor(t, n) {
-    super(t, n);
-    h(this, "nodes");
-    const r = t.node();
-    this.nodes = [], t.doc.nodesBetween(t.pos, n.pos, (a, d, i) => {
-      if (i !== null && i.eq(r))
-        return this.nodes.push(a), !1;
-    });
-  }
-  static create(t, n, r = n) {
-    return new A(t.resolve(n), t.resolve(r));
-  }
-  content() {
-    return new z(ee.from(this.nodes), 0, 0);
-  }
-  eq(t) {
-    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]))
-        return !1;
-    return !0;
-  }
-  map(t, n) {
-    let r = n.mapResult(this.from), a = n.mapResult(this.to);
-    return a.deleted ? F.near(t.resolve(r.pos)) : r.deleted ? F.near(t.resolve(a.pos)) : new A(
-      t.resolve(r.pos),
-      t.resolve(a.pos)
-    );
-  }
-  toJSON() {
-    return { type: "node", anchor: this.anchor, head: this.head };
-  }
-}
-const Ke = de((o) => o.type.name === "block");
-function We(o, e) {
+}), Ke = "_bnEditor_xixap_3", Ve = "_bnRoot_xixap_13", Ye = "_dragPreview_xixap_27", U = {
+  bnEditor: Ke,
+  bnRoot: Ve,
+  dragPreview: Ye
+}, je = le(
+  (t) => t.type.name === "blockContainer"
+);
+function Je(t, e) {
   if (!e.empty)
     return;
-  const t = e.$anchor.nodeBefore;
-  if (!t || !t.text)
+  const o = e.$anchor.nodeBefore;
+  if (!o || !o.text)
     return;
-  const n = new RegExp(`${V(o)}([^${V(o)}]*)$`), r = t.text.match(n);
+  const n = new RegExp(`${V(t)}([^${V(t)}]*)$`), r = o.text.match(n);
   if (!!r)
@@ -879,3 +858,3 @@ return {
       range: {
-        from: e.$anchor.pos - r[1].length - o.length,
+        from: e.$anchor.pos - r[1].length - t.length,
         to: e.$anchor.pos
@@ -885,6 +864,6 @@ }
 }
-class Ve {
+class Qe {
   constructor({
     editor: e,
-    pluginKey: t,
+    pluginKey: o,
     onSelectItem: n = () => {
@@ -899,3 +878,3 @@ },
     h(this, "itemCallback");
-    this.editor = e, this.pluginKey = t, this.pluginState = {
+    this.editor = e, this.pluginKey = o, this.pluginState = {
       active: !1,
@@ -915,5 +894,5 @@ range: null,
   }
-  update(e, t) {
-    const n = this.pluginKey.getState(t), r = this.pluginKey.getState(e.state), a = !n.active && r.active, d = n.active && !r.active, i = n.active && r.active;
-    !a && !i && !d || (this.pluginState = d ? n : r, d && (this.suggestionsMenu.hide(), this.suggestionsMenu.element.removeEventListener(
+  update(e, o) {
+    const n = this.pluginKey.getState(o), r = this.pluginKey.getState(e.state), a = !n.active && r.active, l = n.active && !r.active, i = n.active && r.active;
+    !a && !i && !l || (this.pluginState = l ? n : r, l && (this.suggestionsMenu.hide(), this.suggestionsMenu.element.removeEventListener(
       "mousedown",
@@ -938,10 +917,10 @@ (s) => s.preventDefault()
       selectedItemIndex: this.pluginState.selectedItemIndex,
-      queryStartBoundingBox: e.getBoundingClientRect()
+      referenceRect: e.getBoundingClientRect()
     };
   }
 }
-function je({
-  pluginKey: o,
+function Xe({
+  pluginKey: t,
   editor: e,
-  char: t,
+  char: o,
   suggestionsMenuFactory: n,
@@ -952,14 +931,14 @@ onSelectItem: r = () => {
 }) {
-  if (t.length !== 1)
+  if (o.length !== 1)
     throw new Error("'char' should be a single character");
-  const d = (i) => {
-    i.dispatch(i.state.tr.setMeta(o, { deactivate: !0 }));
+  const l = (i) => {
+    i.dispatch(i.state.tr.setMeta(t, { deactivate: !0 }));
   };
-  return new T({
-    key: o,
-    view: (i) => new Ve({
+  return new M({
+    key: t,
+    view: (i) => new Qe({
       editor: e,
-      pluginKey: o,
+      pluginKey: t,
       onSelectItem: (s) => {
-        d(i), r(s);
+        l(i), r(s);
       },
@@ -983,32 +962,32 @@ suggestionsMenuFactory: n
         var m, f, y, b;
-        const { selection: u } = i, l = { ...s };
-        if (i.getMeta("orderedListIndexing") !== void 0)
-          return l;
-        if (((m = i.getMeta(o)) == null ? void 0 : m.selectedItemIndexChanged) !== void 0) {
-          let g = i.getMeta(o).selectedItemIndexChanged;
-          return g < 0 && (g = s.items.length - 1), g >= s.items.length && (g = 0), l.selectedItemIndex = g, l;
+        const { selection: u } = i, d = { ...s };
+        if (i.getMeta("numberedListIndexing") !== void 0)
+          return d;
+        if (((m = i.getMeta(t)) == null ? void 0 : m.selectedItemIndexChanged) !== void 0) {
+          let k = i.getMeta(t).selectedItemIndexChanged;
+          return k < 0 && (k = s.items.length - 1), k >= s.items.length && (k = 0), d.selectedItemIndex = k, d;
         }
-        if (u.from === u.to && !((f = i.getMeta(o)) != null && f.deactivate) && !i.getMeta("focus") && !i.getMeta("blur") && !i.getMeta("pointer")) {
+        if (u.from === u.to && !((f = i.getMeta(t)) != null && f.deactivate) && !i.getMeta("focus") && !i.getMeta("blur") && !i.getMeta("pointer")) {
           if (s.active && u.from <= s.range.from)
-            l.active = !1;
-          else if ((y = i.getMeta(o)) != null && y.activate) {
-            const g = `id_${Math.floor(
+            d.active = !1;
+          else if ((y = i.getMeta(t)) != null && y.activate) {
+            const k = `id_${Math.floor(
               Math.random() * 4294967295
             )}`;
-            l.decorationId = g, l.range = {
+            d.decorationId = k, d.range = {
               from: u.from - 1,
               to: u.to
-            }, l.query = "", l.active = !0, l.type = (b = i.getMeta(o)) == null ? void 0 : b.type, l.selectedItemIndex = 0;
+            }, d.query = "", d.active = !0, d.type = (b = i.getMeta(t)) == null ? void 0 : b.type, d.selectedItemIndex = 0;
           } else if (s.active) {
-            const g = We(
-              s.type === "slash" ? t : "",
+            const k = Je(
+              s.type === "slash" ? o : "",
               p.selection
             );
-            if (!g)
+            if (!k)
               throw new Error("active but no match (suggestions)");
-            l.range = g.range, l.active = !0, l.decorationId = s.decorationId, l.query = g.query, l.selectedItemIndex = 0;
+            d.range = k.range, d.active = !0, d.decorationId = s.decorationId, d.query = k.query, d.selectedItemIndex = 0;
           }
         } else
-          l.active = !1;
-        return l.active && (l.items = a(l.query), l.items.length ? l.notFoundCount = 0 : l.range.to > s.range.to ? l.notFoundCount = s.notFoundCount + 1 : l.notFoundCount = s.notFoundCount, l.notFoundCount > 3 && (l.active = !1)), l.active || (l.decorationId = null, l.range = null, l.query = null, l.notFoundCount = 0, l.items = []), l;
+          d.active = !1;
+        return d.active && (d.items = a(d.query), d.items.length ? d.notFoundCount = 0 : d.range.to > s.range.to ? d.notFoundCount = s.notFoundCount + 1 : d.notFoundCount = s.notFoundCount, d.notFoundCount > 3 && (d.active = !1)), d.active || (d.decorationId = null, d.range = null, d.query = null, d.notFoundCount = 0, d.items = []), d;
       }
@@ -1020,3 +999,3 @@ },
         if (c) {
-          const { items: p, range: u, selectedItemIndex: l } = o.getState(
+          const { items: p, range: u, selectedItemIndex: d } = t.getState(
             i.state
@@ -1026,4 +1005,4 @@ );
             return i.dispatch(
-              i.state.tr.setMeta(o, {
-                selectedItemIndexChanged: l - 1
+              i.state.tr.setMeta(t, {
+                selectedItemIndexChanged: d - 1
               })
@@ -1033,9 +1012,9 @@ ), !0;
             return i.dispatch(
-              i.state.tr.setMeta(o, {
-                selectedItemIndexChanged: l + 1
+              i.state.tr.setMeta(t, {
+                selectedItemIndexChanged: d + 1
               })
             ), !0;
           if (s.key === "Enter")
-            return d(i), r({
-              item: p[l],
+            return l(i), r({
+              item: p[d],
               editor: e,
@@ -1045,6 +1024,6 @@ range: u
           if (s.key === "Escape")
-            return d(i), !0;
-        } else if (s.key === t)
+            return l(i), !0;
+        } else if (s.key === o)
           return i.dispatch(
-            i.state.tr.insertText(t).scrollIntoView().setMeta(o, { activate: !0, type: "slash" })
+            i.state.tr.insertText(o).scrollIntoView().setMeta(t, { activate: !0, type: "slash" })
           ), !0;
@@ -1054,3 +1033,3 @@ return !1;
       handleClick(i) {
-        d(i);
+        l(i);
       },
@@ -1064,8 +1043,8 @@ decorations(i) {
         if (u === "drag") {
-          const l = Ke(i.selection);
-          if (l)
+          const d = je(i.selection);
+          if (d)
             return O.create(i.doc, [
               L.node(
-                l.pos,
-                l.pos + l.node.nodeSize,
+                d.pos,
+                d.pos + d.node.nodeSize,
                 {
@@ -1090,26 +1069,26 @@ nodeName: "span",
 }
-const Ye = () => /Mac/.test(navigator.platform) || /AppleWebKit/.test(navigator.userAgent) && /Mobile\/\w+/.test(navigator.userAgent);
-function S(o) {
-  return Ye() ? o.replace("Mod", "\u2318") : o.replace("Mod", "Ctrl");
+const Ze = () => /Mac/.test(navigator.platform) || /AppleWebKit/.test(navigator.userAgent) && /Mobile\/\w+/.test(navigator.userAgent);
+function E(t) {
+  return Ze() ? t.replace("Mod", "\u2318") : t.replace("Mod", "Ctrl");
 }
-var B = /* @__PURE__ */ ((o) => (o.HEADINGS = "Headings", o.BASIC_BLOCKS = "Basic Blocks", o.CODE = "Code Blocks", o.INLINE = "Inline", o.EMBED = "Embed", o.PLUGIN = "Plugin", o))(B || {});
+var w = /* @__PURE__ */ ((t) => (t.HEADINGS = "Headings", t.BASIC_BLOCKS = "Basic Blocks", t.CODE = "Code Blocks", t.INLINE = "Inline", t.EMBED = "Embed", t.PLUGIN = "Plugin", t))(w || {});
 class x {
-  constructor(e, t, n, r = [], a, d) {
+  constructor(e, o, n, r = [], a, l) {
     h(this, "groupName");
-    this.name = e, this.group = t, this.execute = n, this.aliases = r, this.hint = a, this.shortcut = d, this.groupName = t;
+    this.name = e, this.group = o, this.execute = n, this.aliases = r, this.hint = a, this.shortcut = l, this.groupName = o;
   }
   match(e) {
     return this.name.toLowerCase().startsWith(e.toLowerCase()) || this.aliases.filter(
-      (t) => t.toLowerCase().startsWith(e.toLowerCase())
+      (o) => o.toLowerCase().startsWith(e.toLowerCase())
     ).length !== 0;
   }
 }
-const Je = {
+const et = {
   heading: new x(
     "Heading",
-    B.HEADINGS,
-    (o, e) => o.chain().focus().deleteRange(e).BNCreateBlockOrSetContentType(e.from, {
-      name: "headingContent",
-      attrs: {
-        headingLevel: "1"
+    w.HEADINGS,
+    (t, e) => t.chain().focus().deleteRange(e).BNCreateOrUpdateBlock(e.from, {
+      type: "heading",
+      props: {
+        level: "1"
       }
@@ -1119,11 +1098,11 @@ }).run(),
     "Used for a top-level heading",
-    S("Mod-Alt-1")
+    E("Mod-Alt-1")
   ),
   heading2: new x(
     "Heading 2",
-    B.HEADINGS,
-    (o, e) => o.chain().focus().deleteRange(e).BNCreateBlockOrSetContentType(e.from, {
-      name: "headingContent",
-      attrs: {
-        headingLevel: "2"
+    w.HEADINGS,
+    (t, e) => t.chain().focus().deleteRange(e).BNCreateOrUpdateBlock(e.from, {
+      type: "heading",
+      props: {
+        level: "2"
       }
@@ -1133,11 +1112,11 @@ }).run(),
     "Used for key sections",
-    S("Mod-Alt-2")
+    E("Mod-Alt-2")
   ),
   heading3: new x(
     "Heading 3",
-    B.HEADINGS,
-    (o, e) => o.chain().focus().deleteRange(e).BNCreateBlockOrSetContentType(e.from, {
-      name: "headingContent",
-      attrs: {
-        headingLevel: "3"
+    w.HEADINGS,
+    (t, e) => t.chain().focus().deleteRange(e).BNCreateOrUpdateBlock(e.from, {
+      type: "heading",
+      props: {
+        level: "3"
       }
@@ -1147,43 +1126,42 @@ }).run(),
     "Used for subsections and group headings",
-    S("Mod-Alt-3")
+    E("Mod-Alt-3")
   ),
   numberedList: new x(
     "Numbered List",
-    B.BASIC_BLOCKS,
-    (o, e) => o.chain().focus().deleteRange(e).BNCreateBlockOrSetContentType(e.from, {
-      name: "listItemContent",
-      attrs: {
-        listItemType: "ordered"
-      }
+    w.BASIC_BLOCKS,
+    (t, e) => t.chain().focus().deleteRange(e).BNCreateOrUpdateBlock(e.from, {
+      type: "numberedListItem",
+      props: {}
     }).run(),
     ["li", "list", "numberedlist", "numbered list"],
     "Used to display a numbered list",
-    S("Mod-Shift-7")
+    E("Mod-Shift-7")
   ),
   bulletList: new x(
     "Bullet List",
-    B.BASIC_BLOCKS,
-    (o, e) => o.chain().focus().deleteRange(e).BNCreateBlockOrSetContentType(e.from, {
-      name: "listItemContent",
-      attrs: {
-        listItemType: "unordered"
-      }
+    w.BASIC_BLOCKS,
+    (t, e) => t.chain().focus().deleteRange(e).BNCreateOrUpdateBlock(e.from, {
+      type: "bulletListItem",
+      props: {}
     }).run(),
     ["ul", "list", "bulletlist", "bullet list"],
     "Used to display an unordered list",
-    S("Mod-Shift-8")
+    E("Mod-Shift-8")
   ),
   paragraph: new x(
     "Paragraph",
-    B.BASIC_BLOCKS,
-    (o, e) => o.chain().focus().deleteRange(e).BNCreateBlockOrSetContentType(e.from, { name: "textContent" }).run(),
+    w.BASIC_BLOCKS,
+    (t, e) => t.chain().focus().deleteRange(e).BNCreateOrUpdateBlock(e.from, {
+      type: "paragraph",
+      props: {}
+    }).run(),
     ["p"],
     "Used for the body of your document",
-    S("Mod-Alt-0")
+    E("Mod-Alt-0")
   )
-}, q = new v("suggestions-slash-commands"), Qe = E.create({
+}, q = new B("suggestions-slash-commands"), tt = P.create({
   name: "slash-command",
   addOptions() {
     return {
-      commands: Je,
+      commands: et,
       slashMenuFactory: void 0
@@ -1196,3 +1174,3 @@ };
     return [
-      je({
+      Xe({
         pluginKey: q,
@@ -1202,10 +1180,10 @@ editor: this.editor,
         suggestionsMenuFactory: this.options.slashMenuFactory,
-        items: (o) => {
+        items: (t) => {
           const e = [];
-          for (const t in this.options.commands)
-            e.push(this.options.commands[t]);
-          return e.filter((t) => t.match(o));
+          for (const o in this.options.commands)
+            e.push(this.options.commands[o]);
+          return e.filter((o) => o.match(t));
         },
-        onSelectItem: ({ item: o, editor: e, range: t }) => {
-          o.execute(e, t);
+        onSelectItem: ({ item: t, editor: e, range: o }) => {
+          t.execute(e, o);
         }
@@ -1215,23 +1193,55 @@ })
   }
-}), Xe = "_bnEditor_xixap_3", Ze = "_bnRoot_xixap_13", et = "_dragPreview_xixap_27", $ = {
-  bnEditor: Xe,
-  bnRoot: Ze,
-  dragPreview: et
-}, tt = Te.__serializeForClipboard;
-let D, M;
-function ot() {
-  if (!D) {
-    const o = document.querySelector(
+});
+class A extends F {
+  constructor(o, n) {
+    super(o, n);
+    h(this, "nodes");
+    const r = o.node();
+    this.nodes = [], o.doc.nodesBetween(o.pos, n.pos, (a, l, i) => {
+      if (i !== null && i.eq(r))
+        return this.nodes.push(a), !1;
+    });
+  }
+  static create(o, n, r = n) {
+    return new A(o.resolve(n), o.resolve(r));
+  }
+  content() {
+    return new z(Z.from(this.nodes), 0, 0);
+  }
+  eq(o) {
+    if (!(o instanceof A) || this.nodes.length !== o.nodes.length || this.from !== o.from || this.to !== o.to)
+      return !1;
+    for (let n = 0; n < this.nodes.length; n++)
+      if (!this.nodes[n].eq(o.nodes[n]))
+        return !1;
+    return !0;
+  }
+  map(o, n) {
+    let r = n.mapResult(this.from), a = n.mapResult(this.to);
+    return a.deleted ? F.near(o.resolve(r.pos)) : r.deleted ? F.near(o.resolve(a.pos)) : new A(
+      o.resolve(r.pos),
+      o.resolve(a.pos)
+    );
+  }
+  toJSON() {
+    return { type: "node", anchor: this.anchor, head: this.head };
+  }
+}
+const ot = Me.__serializeForClipboard;
+let _, I;
+function nt() {
+  if (!_) {
+    const t = document.querySelector(
       ".ProseMirror > [class*='blockGroup']"
     );
-    o && (D = rt(o).left);
+    t && (_ = it(t).left);
   }
-  return D;
+  return _;
 }
-function nt(o) {
+function rt(t) {
   let e = {
-    left: o.left + document.body.scrollLeft,
-    top: o.top + document.body.scrollTop,
-    width: o.width,
-    height: o.height,
+    left: t.left + document.body.scrollLeft,
+    top: t.top + document.body.scrollTop,
+    width: t.width,
+    height: t.height,
     bottom: 0,
@@ -1242,11 +1252,11 @@ right: 0
 }
-function rt(o) {
-  return nt(o.getBoundingClientRect());
+function it(t) {
+  return rt(t.getBoundingClientRect());
 }
-function oe(o, e) {
+function oe(t, e) {
   var r;
-  let t = e.posAtCoords(o);
-  if (!t)
+  let o = e.posAtCoords(t);
+  if (!o)
     return;
-  let n = e.domAtPos(t.pos).node;
+  let n = e.domAtPos(o.pos).node;
   if (n !== e.dom) {
@@ -1259,7 +1269,7 @@ for (; n && n.parentNode && n.parentNode !== e.dom && !((r = n.hasAttribute) != null && r.call(n, "data-id")); )
 }
-function it(o, e) {
-  let t = oe(o, e);
-  if (t && t.node.nodeType === 1) {
+function st(t, e) {
+  let o = oe(t, e);
+  if (o && o.node.nodeType === 1) {
     const n = e.docView;
-    let r = n.nearestDesc(t.node, !0);
+    let r = n.nearestDesc(o.node, !0);
     return !r || r === n ? null : r.posBefore;
@@ -1269,50 +1279,50 @@ }
 }
-function st(o, e) {
-  let t, n;
-  const r = e.resolve(o.from).node().type.spec.group === "blockContent", a = e.resolve(o.to).node().type.spec.group === "blockContent", d = Math.min(o.$anchor.depth, o.$head.depth);
+function at(t, e) {
+  let o, n;
+  const r = e.resolve(t.from).node().type.spec.group === "blockContent", a = e.resolve(t.to).node().type.spec.group === "blockContent", l = Math.min(t.$anchor.depth, t.$head.depth);
   if (r && a) {
-    const i = o.$from.start(d - 1), s = o.$to.end(d - 1);
-    t = e.resolve(i - 1).pos, n = e.resolve(s + 1).pos;
+    const i = t.$from.start(l - 1), s = t.$to.end(l - 1);
+    o = e.resolve(i - 1).pos, n = e.resolve(s + 1).pos;
   } else
-    t = o.from, n = o.to;
-  return { from: t, to: n };
+    o = t.from, n = t.to;
+  return { from: o, to: n };
 }
-function J(o, e, t = e) {
-  e === t && (t += o.state.doc.resolve(e + 1).node().nodeSize);
-  const n = o.domAtPos(e).node.cloneNode(!0), r = o.domAtPos(e).node, a = (s, c) => Array.prototype.indexOf.call(s.children, c), d = a(
+function j(t, e, o = e) {
+  e === o && (o += t.state.doc.resolve(e + 1).node().nodeSize);
+  const n = t.domAtPos(e).node.cloneNode(!0), r = t.domAtPos(e).node, a = (s, c) => Array.prototype.indexOf.call(s.children, c), l = a(
     r,
-    o.domAtPos(e + 1).node.parentElement
+    t.domAtPos(e + 1).node.parentElement
   ), i = a(
     r,
-    o.domAtPos(t - 1).node.parentElement
+    t.domAtPos(o - 1).node.parentElement
   );
   for (let s = r.childElementCount - 1; s >= 0; s--)
-    (s > i || s < d) && n.removeChild(n.children[s]);
-  M = n, M.className = $.dragPreview, document.body.appendChild(M);
+    (s > i || s < l) && n.removeChild(n.children[s]);
+  I = n, I.className = U.dragPreview, document.body.appendChild(I);
 }
-function at() {
-  M !== void 0 && (document.body.removeChild(M), M = void 0);
+function lt() {
+  I !== void 0 && (document.body.removeChild(I), I = void 0);
 }
-function dt(o, e) {
-  if (!o.dataTransfer)
+function dt(t, e) {
+  if (!t.dataTransfer)
     return;
-  let t = {
+  let o = {
     left: e.dom.clientWidth / 2,
-    top: o.clientY
-  }, n = it(t, e);
+    top: t.clientY
+  }, n = st(o, e);
   if (n != null) {
-    const r = e.state.selection, a = e.state.doc, { from: d, to: i } = st(r, a), s = d <= n && n < i, c = !r.$anchor.node().eq(r.$head.node());
+    const r = e.state.selection, a = e.state.doc, { from: l, to: i } = at(r, a), s = l <= n && n < i, c = !r.$anchor.node().eq(r.$head.node());
     s && c ? (e.dispatch(
-      e.state.tr.setSelection(A.create(a, d, i))
-    ), J(e, d, i)) : (e.dispatch(
-      e.state.tr.setSelection(Ie.create(e.state.doc, n))
-    ), J(e, n));
-    let p = e.state.selection.content(), { dom: u, text: l } = tt(e, p);
-    o.dataTransfer.clearData(), o.dataTransfer.setData("text/html", u.innerHTML), o.dataTransfer.setData("text/plain", l), o.dataTransfer.effectAllowed = "move", o.dataTransfer.setDragImage(M, 0, 0), e.dragging = { slice: p, move: !0 };
+      e.state.tr.setSelection(A.create(a, l, i))
+    ), j(e, l, i)) : (e.dispatch(
+      e.state.tr.setSelection(Be.create(e.state.doc, n))
+    ), j(e, n));
+    let p = e.state.selection.content(), { dom: u, text: d } = ot(e, p);
+    t.dataTransfer.clearData(), t.dataTransfer.setData("text/html", u.innerHTML), t.dataTransfer.setData("text/plain", d), t.dataTransfer.effectAllowed = "move", t.dataTransfer.setDragImage(I, 0, 0), e.dragging = { slice: p, move: !0 };
   }
 }
-class lt {
+class ct {
   constructor({
     editor: e,
-    blockMenuFactory: t,
+    blockMenuFactory: o,
     horizontalPosAnchoredAtRoot: n
@@ -1326,3 +1336,3 @@ }) {
     h(this, "menuFrozen", !1);
-    this.editor = e, this.horizontalPosAnchoredAtRoot = n, this.blockMenu = t(this.getStaticParams()), document.body.addEventListener(
+    this.editor = e, this.horizontalPosAnchoredAtRoot = n, this.blockMenu = o(this.getStaticParams()), document.body.addEventListener(
       "mousemove",
@@ -1336,10 +1346,10 @@ (r) => {
           top: r.clientY
-        }, d = oe(a, this.editor.view);
-        if (!d) {
+        }, l = oe(a, this.editor.view);
+        if (!l) {
           this.menuOpen && (this.menuOpen = !1, this.blockMenu.hide());
           return;
         }
-        if (this.menuOpen && ((s = this.hoveredBlock) == null ? void 0 : s.hasAttribute("data-id")) && ((c = this.hoveredBlock) == null ? void 0 : c.getAttribute("data-id")) === d.id)
+        if (this.menuOpen && ((s = this.hoveredBlock) == null ? void 0 : s.hasAttribute("data-id")) && ((c = this.hoveredBlock) == null ? void 0 : c.getAttribute("data-id")) === l.id)
           return;
-        const i = d.node.firstChild;
+        const i = l.node.firstChild;
         this.hoveredBlock = i, i && (this.menuOpen ? this.blockMenu.render(this.getDynamicParams(), !1) : (this.menuOpen = !0, this.blockMenu.render(this.getDynamicParams(), !0)));
@@ -1368,9 +1378,9 @@ },
     this.menuOpen = !1, this.menuFrozen = !0, this.blockMenu.hide();
-    const e = this.hoveredBlock.getBoundingClientRect(), t = this.editor.view.posAtCoords({
+    const e = this.hoveredBlock.getBoundingClientRect(), o = this.editor.view.posAtCoords({
       left: e.left,
       top: e.top
     });
-    if (!t)
+    if (!o)
       return;
-    const n = k(this.editor.state.doc, t.pos);
+    const n = g(this.editor.state.doc, o.pos);
     if (n === void 0)
@@ -1380,4 +1390,4 @@ return;
     if (r.textContent.length !== 0) {
-      const d = a + 1, i = d + 2;
-      this.editor.chain().BNCreateBlock(d).BNSetContentType(i, { name: "textContent" }).setTextSelection(i).run();
+      const l = a + 1, i = l + 2;
+      this.editor.chain().BNCreateBlock(l).BNUpdateBlock(i, { type: "paragraph", props: {} }).setTextSelection(i).run();
     }
@@ -1393,7 +1403,7 @@ this.editor.view.focus(), this.editor.view.dispatch(
     this.menuOpen = !1, this.blockMenu.hide();
-    const e = this.hoveredBlock.getBoundingClientRect(), t = this.editor.view.posAtCoords({
+    const e = this.hoveredBlock.getBoundingClientRect(), o = this.editor.view.posAtCoords({
       left: e.left,
       top: e.top
     });
-    !t || this.editor.commands.BNDeleteBlock(t.pos);
+    !o || this.editor.commands.BNDeleteBlock(o.pos);
   }
@@ -1405,3 +1415,3 @@ getStaticParams() {
       blockDragStart: (e) => dt(e, this.editor.view),
-      blockDragEnd: () => at(),
+      blockDragEnd: () => lt(),
       freezeMenu: () => {
@@ -1418,4 +1428,4 @@ this.menuFrozen = !0;
     return {
-      blockBoundingBox: new DOMRect(
-        this.horizontalPosAnchoredAtRoot ? ot() : e.x,
+      referenceRect: new DOMRect(
+        this.horizontalPosAnchoredAtRoot ? nt() : e.x,
         e.y,
@@ -1428,10 +1438,10 @@ e.width,
 }
-const ct = (o) => new T({
-  key: new v("DraggableBlocksPlugin"),
-  view: () => new lt({
-    editor: o.editor,
-    blockMenuFactory: o.blockSideMenuFactory,
+const ut = (t) => new M({
+  key: new B("DraggableBlocksPlugin"),
+  view: () => new ct({
+    editor: t.editor,
+    blockMenuFactory: t.blockSideMenuFactory,
     horizontalPosAnchoredAtRoot: !0
   })
-}), ut = E.create({
+}), ht = P.create({
   name: "DraggableBlocksExtension",
@@ -1445,3 +1455,3 @@ priority: 1e3,
     return [
-      ct({
+      ut({
         editor: this.editor,
@@ -1452,5 +1462,5 @@ blockSideMenuFactory: this.options.blockSideMenuFactory
   }
-}), ht = new v("HyperlinkToolbarPlugin");
-class pt {
-  constructor({ editor: e, hyperlinkToolbarFactory: t }) {
+}), pt = new B("HyperlinkToolbarPlugin");
+class mt {
+  constructor({ editor: e, hyperlinkToolbarFactory: o }) {
     h(this, "editor");
@@ -1467,3 +1477,3 @@ h(this, "hyperlinkToolbar");
     h(this, "hyperlinkMarkRange");
-    this.editor = e, this.hyperlinkToolbar = t(this.getStaticParams()), this.startMenuUpdateTimer = () => {
+    this.editor = e, this.hyperlinkToolbar = o(this.getStaticParams()), this.startMenuUpdateTimer = () => {
       this.menuUpdateTimer = setTimeout(() => {
@@ -1474,9 +1484,9 @@ this.update();
       if (this.mouseHoveredHyperlinkMark = void 0, this.mouseHoveredHyperlinkMarkRange = void 0, this.stopMenuUpdateTimer(), n.target instanceof HTMLAnchorElement && n.target.nodeName === "A") {
-        const r = n.target, a = e.view.posAtDOM(r, 0) + 1, d = e.state.doc.resolve(
+        const r = n.target, a = e.view.posAtDOM(r, 0) + 1, l = e.state.doc.resolve(
           a
-        ), i = d.marks();
+        ), i = l.marks();
         for (const s of i)
           if (s.type.name === e.schema.mark("link").type.name) {
-            this.mouseHoveredHyperlinkMark = s, this.mouseHoveredHyperlinkMarkRange = K(
-              d,
+            this.mouseHoveredHyperlinkMark = s, this.mouseHoveredHyperlinkMarkRange = W(
+              l,
               s.type,
@@ -1492,3 +1502,3 @@ s.attrs
   update() {
-    var t, n, r, a;
+    var o, n, r, a;
     if (!this.editor.view.hasFocus())
@@ -1498,6 +1508,6 @@ return;
     if (this.hyperlinkMark = void 0, this.hyperlinkMarkRange = void 0, this.keyboardHoveredHyperlinkMark = void 0, this.keyboardHoveredHyperlinkMarkRange = void 0, this.editor.state.selection.empty) {
-      const d = this.editor.state.selection.$from.marks();
-      for (const i of d)
+      const l = this.editor.state.selection.$from.marks();
+      for (const i of l)
         if (i.type.name === this.editor.schema.mark("link").type.name) {
-          this.keyboardHoveredHyperlinkMark = i, this.keyboardHoveredHyperlinkMarkRange = K(
+          this.keyboardHoveredHyperlinkMark = i, this.keyboardHoveredHyperlinkMarkRange = W(
             this.editor.state.selection.$from,
@@ -1512,3 +1522,3 @@ i.type,
       if (this.getDynamicParams(), !e) {
-        this.hyperlinkToolbar.render(this.getDynamicParams(), !0), (t = this.hyperlinkToolbar.element) == null || t.addEventListener(
+        this.hyperlinkToolbar.render(this.getDynamicParams(), !0), (o = this.hyperlinkToolbar.element) == null || o.addEventListener(
           "mouseleave",
@@ -1523,2 +1533,3 @@ this.startMenuUpdateTimer
       this.hyperlinkToolbar.render(this.getDynamicParams(), !1);
+      return;
     }
@@ -1538,5 +1549,5 @@ if (!this.hyperlinkMark && e) {
     return {
-      editHyperlink: (e, t) => {
+      editHyperlink: (e, o) => {
         const n = this.editor.view.state.tr.insertText(
-          t,
+          o,
           this.hyperlinkMarkRange.from,
@@ -1547,3 +1558,3 @@ this.hyperlinkMarkRange.to
           this.hyperlinkMarkRange.from,
-          this.hyperlinkMarkRange.from + t.length,
+          this.hyperlinkMarkRange.from + o.length,
           this.editor.schema.mark("link", { href: e })
@@ -1570,3 +1581,3 @@ ), this.editor.view.dispatch(n), this.editor.view.focus(), this.hyperlinkToolbar.hide();
       ),
-      boundingBox: Z(
+      referenceRect: X(
         this.editor.view,
@@ -1579,17 +1590,17 @@ this.hyperlinkMarkRange.from,
 }
-const mt = (o, e) => new T({
-  key: ht,
-  view: () => new pt({
-    editor: o,
+const ft = (t, e) => new M({
+  key: pt,
+  view: () => new mt({
+    editor: t,
     hyperlinkToolbarFactory: e.hyperlinkToolbarFactory
   })
-}), ft = te.extend({
+}), kt = ee.extend({
   priority: 500,
   addProseMirrorPlugins() {
-    var o;
+    var t;
     if (!this.options.hyperlinkToolbarFactory)
       throw new Error("UI Element factory not defined for HyperlinkMark");
     return [
-      ...((o = this.parent) == null ? void 0 : o.call(this)) || [],
-      mt(this.editor, {
+      ...((t = this.parent) == null ? void 0 : t.call(this)) || [],
+      ft(this.editor, {
         hyperlinkToolbarFactory: this.options.hyperlinkToolbarFactory
@@ -1599,7 +1610,3 @@ })
   }
-}), gt = Ce.extend({
-  addKeyboardShortcuts: () => ({
-    "Mod-Alt-0": () => !1
-  })
-}), kt = new v("blocknote-placeholder"), yt = E.create({
+}), gt = new B("blocknote-placeholder"), yt = P.create({
   name: "placeholder",
@@ -1620,7 +1627,7 @@ addOptions() {
     return [
-      new T({
-        key: kt,
+      new M({
+        key: gt,
         props: {
-          decorations: (o) => {
-            const { doc: e, selection: t } = o, n = q.getState(o), r = this.editor.isEditable || !this.options.showOnlyWhenEditable, { anchor: a } = t, d = [];
+          decorations: (t) => {
+            const { doc: e, selection: o } = t, n = q.getState(t), r = this.editor.isEditable || !this.options.showOnlyWhenEditable, { anchor: a } = o, l = [];
             if (!!r)
@@ -1632,9 +1639,9 @@ return e.descendants((i, s) => {
                   this.editor.isEmpty && u.push(this.options.emptyEditorClass), c && u.push(this.options.hasAnchorClass), (n == null ? void 0 : n.type) === "drag" && (n == null ? void 0 : n.active) && u.push(this.options.isFilterClass);
-                  const l = L.node(s, s + i.nodeSize, {
+                  const d = L.node(s, s + i.nodeSize, {
                     class: u.join(" ")
                   });
-                  d.push(l);
+                  l.push(d);
                 }
                 return this.options.includeChildren;
-              }), O.create(e, d);
+              }), O.create(e, l);
           }
@@ -1645,11 +1652,11 @@ }
   }
-}), bt = E.create({
+}), bt = P.create({
   name: "trailingNode",
   addProseMirrorPlugins() {
-    const o = new v(this.name);
+    const t = new B(this.name);
     return [
-      new T({
-        key: o,
-        appendTransaction: (e, t, n) => {
-          const { doc: r, tr: a, schema: d } = n, i = o.getState(n), s = r.content.size - 2, c = d.nodes.block, p = d.nodes.textContent;
+      new M({
+        key: t,
+        appendTransaction: (e, o, n) => {
+          const { doc: r, tr: a, schema: l } = n, i = t.getState(n), s = r.content.size - 2, c = l.nodes.blockContainer, p = l.nodes.paragraph;
           if (!!i)
@@ -1662,12 +1669,12 @@ return a.insert(
         state: {
-          init: (e, t) => {
+          init: (e, o) => {
           },
-          apply: (e, t) => {
+          apply: (e, o) => {
             if (!e.docChanged)
-              return t;
+              return o;
             let n = e.doc.lastChild;
             if (!n || n.type.name !== "blockGroup")
               throw new Error("Expected blockGroup");
-            if (n = n.lastChild, !n || n.type.name !== "block")
-              throw new Error("Expected block");
+            if (n = n.lastChild, !n || n.type.name !== "blockContainer")
+              throw new Error("Expected blockContainer");
             return n.nodeSize > 4;
@@ -1680,16 +1687,16 @@ }
 });
-function vt(o, e = JSON.stringify) {
-  const t = {};
-  return o.filter((n) => {
+function vt(t, e = JSON.stringify) {
+  const o = {};
+  return t.filter((n) => {
     const r = e(n);
-    return Object.prototype.hasOwnProperty.call(t, r) ? !1 : t[r] = !0;
+    return Object.prototype.hasOwnProperty.call(o, r) ? !1 : o[r] = !0;
   });
 }
-function It(o) {
-  const e = o.filter(
-    (n, r) => o.indexOf(n) !== r
+function Bt(t) {
+  const e = t.filter(
+    (n, r) => t.indexOf(n) !== r
   );
   return vt(e);
 }
-const Tt = E.create({
+const Mt = P.create({
   name: "uniqueID",
@@ -1701,3 +1708,3 @@ priority: 1e4,
       types: [],
-      generateID: () => window.__TEST_OPTIONS ? (window.__TEST_OPTIONS.mockID === void 0 ? window.__TEST_OPTIONS.mockID = 0 : window.__TEST_OPTIONS.mockID++, parseInt(window.__TEST_OPTIONS.mockID)) : Be(),
+      generateID: () => window.__TEST_OPTIONS ? (window.__TEST_OPTIONS.mockID === void 0 ? window.__TEST_OPTIONS.mockID = 0 : window.__TEST_OPTIONS.mockID++, parseInt(window.__TEST_OPTIONS.mockID)) : Ce(),
       filterTransaction: null
@@ -1712,3 +1719,7 @@ };
           [this.options.attributeName]: {
-            default: null
+            default: null,
+            parseHTML: (t) => t.getAttribute(`data-${this.options.attributeName}`),
+            renderHTML: (t) => ({
+              [`data-${this.options.attributeName}`]: t[this.options.attributeName]
+            })
           }
@@ -1724,33 +1735,33 @@ }
       return;
-    const { view: o, state: e } = this.editor, { tr: t, doc: n } = e, { types: r, attributeName: a, generateID: d } = this.options;
-    _(n, (s) => r.includes(s.type.name) && s.attrs[a] === null).forEach(({ node: s, pos: c }) => {
-      t.setNodeMarkup(c, void 0, {
+    const { view: t, state: e } = this.editor, { tr: o, doc: n } = e, { types: r, attributeName: a, generateID: l } = this.options;
+    D(n, (s) => r.includes(s.type.name) && s.attrs[a] === null).forEach(({ node: s, pos: c }) => {
+      o.setNodeMarkup(c, void 0, {
         ...s.attrs,
-        [a]: d()
+        [a]: l()
       });
-    }), t.setMeta("addToHistory", !1), o.dispatch(t);
+    }), o.setMeta("addToHistory", !1), t.dispatch(o);
   },
   addProseMirrorPlugins() {
-    let o = null, e = !1;
+    let t = null, e = !1;
     return [
-      new T({
-        key: new v("uniqueID"),
-        appendTransaction: (t, n, r) => {
+      new M({
+        key: new B("uniqueID"),
+        appendTransaction: (o, n, r) => {
           console.log("appendTransaction");
-          const a = t.some((f) => f.docChanged) && !n.doc.eq(r.doc), d = this.options.filterTransaction && t.some((f) => {
+          const a = o.some((f) => f.docChanged) && !n.doc.eq(r.doc), l = this.options.filterTransaction && o.some((f) => {
             var y, b;
             return !(!((b = (y = this.options).filterTransaction) === null || b === void 0) && b.call(y, f));
           });
-          if (!a || d)
+          if (!a || l)
             return;
-          const { tr: i } = r, { types: s, attributeName: c, generateID: p } = this.options, u = Q(
+          const { tr: i } = r, { types: s, attributeName: c, generateID: p } = this.options, u = J(
             n.doc,
-            t
-          ), { mapping: l } = u;
-          if (X(u).forEach(({ newRange: f }) => {
-            const y = le(
+            o
+          ), { mapping: d } = u;
+          if (Q(u).forEach(({ newRange: f }) => {
+            const y = de(
               r.doc,
               f,
               (C) => s.includes(C.type.name)
-            ), b = y.map(({ node: C }) => C.attrs[c]).filter((C) => C !== null), g = It(b);
+            ), b = y.map(({ node: C }) => C.attrs[c]).filter((C) => C !== null), k = Bt(b);
             y.forEach(({ node: C, pos: H }) => {
@@ -1766,4 +1777,4 @@ var R;
               }
-              const { deleted: ne } = l.invert().mapResult(H);
-              ne && g.includes(G) && i.setNodeMarkup(H, void 0, {
+              const { deleted: ne } = d.invert().mapResult(H);
+              ne && k.includes(G) && i.setNodeMarkup(H, void 0, {
                 ...C.attrs,
@@ -1776,6 +1787,6 @@ [c]: p()
         },
-        view(t) {
+        view(o) {
           const n = (r) => {
             var a;
-            o = !((a = t.dom.parentElement) === null || a === void 0) && a.contains(r.target) ? t.dom.parentElement : null;
+            t = !((a = o.dom.parentElement) === null || a === void 0) && a.contains(r.target) ? o.dom.parentElement : null;
           };
@@ -1790,14 +1801,14 @@ return window.addEventListener("dragstart", n), {
           handleDOMEvents: {
-            drop: (t, n) => {
+            drop: (o, n) => {
               var r;
-              return (o !== t.dom.parentElement || ((r = n.dataTransfer) === null || r === void 0 ? void 0 : r.effectAllowed) === "copy") && (o = null, e = !0), !1;
+              return (t !== o.dom.parentElement || ((r = n.dataTransfer) === null || r === void 0 ? void 0 : r.effectAllowed) === "copy") && (t = null, e = !0), !1;
             },
             paste: () => (e = !0, !1)
           },
-          transformPasted: (t) => {
+          transformPasted: (o) => {
             if (!e)
-              return t;
-            const { types: n, attributeName: r } = this.options, a = (d) => {
+              return o;
+            const { types: n, attributeName: r } = this.options, a = (l) => {
               const i = [];
-              return d.forEach((s) => {
+              return l.forEach((s) => {
                 if (s.isText) {
@@ -1820,8 +1831,8 @@ i.push(s);
                 i.push(c);
-              }), ee.from(i);
+              }), Z.from(i);
             };
             return e = !1, new z(
-              a(t.content),
-              t.openStart,
-              t.openEnd
+              a(o.content),
+              o.openStart,
+              o.openEnd
             );
@@ -1833,23 +1844,19 @@ }
   }
-}), Kt = w.create({
-  name: "doc",
-  topNode: !0,
-  content: "block+"
-}), Ct = (o) => {
+}), Ct = (t) => {
   const e = [
-    P.ClipboardTextSerializer,
-    P.Commands,
-    P.Editable,
-    P.FocusEvents,
-    P.Tabindex,
+    N.ClipboardTextSerializer,
+    N.Commands,
+    N.Editable,
+    N.FocusEvents,
+    N.Tabindex,
     me,
     yt.configure({
-      emptyNodeClass: I.isEmpty,
-      hasAnchorClass: I.hasAnchor,
-      isFilterClass: I.isFilter,
+      emptyNodeClass: v.isEmpty,
+      hasAnchorClass: v.hasAnchor,
+      isFilterClass: v.isFilter,
       includeChildren: !0,
       showOnlyCurrent: !1
     }),
-    Tt.configure({
-      types: ["block"]
+    Mt.configure({
+      types: ["blockContainer"]
     }),
@@ -1860,29 +1867,28 @@ fe,
     he,
-    ke,
+    ge,
     ye,
     ve,
-    gt,
-    ...$e,
+    ...ze,
     pe.configure({ width: 5, color: "#ddeeff" }),
-    ge,
+    ke,
     bt
   ];
-  return o.blockSideMenuFactory && e.push(
-    ut.configure({
-      blockSideMenuFactory: o.blockSideMenuFactory
+  return t.blockSideMenuFactory && e.push(
+    ht.configure({
+      blockSideMenuFactory: t.blockSideMenuFactory
     })
-  ), o.formattingToolbarFactory && e.push(
-    Ge.configure({
-      formattingToolbarFactory: o.formattingToolbarFactory
+  ), t.formattingToolbarFactory && e.push(
+    We.configure({
+      formattingToolbarFactory: t.formattingToolbarFactory
     })
-  ), o.hyperlinkToolbarFactory ? e.push(
-    ft.configure({
-      hyperlinkToolbarFactory: o.hyperlinkToolbarFactory
+  ), t.hyperlinkToolbarFactory ? e.push(
+    kt.configure({
+      hyperlinkToolbarFactory: t.hyperlinkToolbarFactory
     })
-  ) : e.push(te), o.slashMenuFactory && e.push(
-    Qe.configure({
-      slashMenuFactory: o.slashMenuFactory
+  ) : e.push(ee), t.slashMenuFactory && e.push(
+    tt.configure({
+      slashMenuFactory: t.slashMenuFactory
     })
   ), e;
-}, Bt = {
+}, wt = {
   enableInputRules: !0,
@@ -1892,12 +1898,12 @@ enablePasteRules: !0,
 };
-class Wt {
+class Gt {
   constructor(e = {}) {
     h(this, "tiptapEditor");
-    var a, d, i;
-    const t = Ct(
+    var a, l, i;
+    const o = Ct(
       e.uiFactories || {}
     );
-    let n = e.disableHistoryExtension ? t.filter((s) => s.name !== "history") : t;
+    let n = e.disableHistoryExtension ? o.filter((s) => s.name !== "history") : o;
     const r = {
-      ...Bt,
+      ...wt,
       ...e,
@@ -1909,5 +1915,5 @@ extensions: e.enableBlockNoteExtensions === !1 ? e.extensions : [...e.extensions || [], ...n],
           class: [
-            $.bnEditor,
-            $.bnRoot,
-            ((i = (d = e.editorProps) == null ? void 0 : d.attributes) == null ? void 0 : i.class) || ""
+            U.bnEditor,
+            U.bnRoot,
+            ((i = (l = e.editorProps) == null ? void 0 : l.attributes) == null ? void 0 : i.class) || ""
           ].join(" ")
@@ -1921,5 +1927,4 @@ }
 export {
-  Wt as BlockNoteEditor,
-  Kt as Document,
-  B as SlashMenuGroups,
+  Gt as BlockNoteEditor,
+  w as SlashMenuGroups,
   x as SlashMenuItem,
@@ -1926,0 +1931,0 @@ Ct as getBlockNoteExtensions

package.json

@@ -6,3 +6,3 @@ {
   "license": "MPL-2.0",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "files": [
@@ -81,3 +81,5 @@ "dist",
     "uuid": "^8.3.2",
-    "y-prosemirror": "1.0.20"
+    "y-prosemirror": "1.0.20",
+    "y-protocols": "1.0.5",
+    "yjs": "13.5.44"
   },
@@ -107,3 +109,3 @@ "devDependencies": {
   },
-  "gitHead": "839c9554e572d416e79eb5f95eb70943096d2403"
+  "gitHead": "04fb17b9fd76a5a9a5a3476c0a1d441848110ea9"
 }

src/BlockNoteExtensions.ts

 import { Extensions, extensions } from "@tiptap/core";
 
-import { Node } from "@tiptap/core";
 import Bold from "@tiptap/extension-bold";
@@ -19,3 +18,2 @@ import Code from "@tiptap/extension-code";
 import HyperlinkMark from "./extensions/HyperlinkToolbar/HyperlinkMark";
-import { FixedParagraph } from "./extensions/Paragraph/FixedParagraph";
 import { Placeholder } from "./extensions/Placeholder/PlaceholderExtension";
@@ -32,8 +30,2 @@ import SlashMenuExtension from "./extensions/SlashMenu";
 
-export const Document = Node.create({
-  name: "doc",
-  topNode: true,
-  content: "block+",
-});
-
 export type UiFactories = Partial<{
@@ -69,3 +61,3 @@ formattingToolbarFactory: FormattingToolbarFactory;
     UniqueID.configure({
-      types: ["block"],
+      types: ["blockContainer"],
     }),
@@ -84,3 +76,2 @@ HardBreak,
     Underline,
-    FixedParagraph,
 
@@ -87,0 +78,0 @@ // custom blocks:

src/extensions/Blocks/helpers/findBlock.ts

 import { findParentNode } from "@tiptap/core";
 
-export const findBlock = findParentNode((node) => node.type.name === "block");
+export const findBlock = findParentNode(
+  (node) => node.type.name === "blockContainer"
+);

src/extensions/Blocks/helpers/getBlockInfoFromPos.ts

@@ -40,3 +40,3 @@ import { Node, NodeType } from "prosemirror-model";
     }
-    if (node.type.name === "block") {
+    if (node.type.name === "blockContainer") {
       break;
@@ -43,0 +43,0 @@ }

src/extensions/Blocks/index.ts

 import { Node } from "@tiptap/core";
-import { Block } from "./nodes/Block";
+import { BlockContainer } from "./nodes/BlockContainer";
 import { BlockGroup } from "./nodes/BlockGroup";
-import { TextContent } from "./nodes/BlockTypes/TextBlock/TextContent";
-import { HeadingContent } from "./nodes/BlockTypes/HeadingBlock/HeadingContent";
-import { ListItemContent } from "./nodes/BlockTypes/ListItemBlock/ListItemContent";
+import { ParagraphBlockContent } from "./nodes/BlockContent/ParagraphBlockContent/ParagraphBlockContent";
+import { HeadingBlockContent } from "./nodes/BlockContent/HeadingBlockContent/HeadingBlockContent";
+import { BulletListItemBlockContent } from "./nodes/BlockContent/ListItemBlockContent/BulletListItemBlockContent/BulletListItemBlockContent";
+import { NumberedListItemBlockContent } from "./nodes/BlockContent/ListItemBlockContent/NumberedListItemBlockContent/NumberedListItemBlockContent";
 
 export const blocks: any[] = [
-  TextContent,
-  HeadingContent,
-  ListItemContent,
-  Block,
+  ParagraphBlockContent,
+  HeadingBlockContent,
+  BulletListItemBlockContent,
+  NumberedListItemBlockContent,
+  BlockContainer,
   BlockGroup,
@@ -14,0 +16,0 @@ Node.create({

src/extensions/Blocks/nodes/BlockGroup.ts

@@ -6,2 +6,4 @@ import { mergeAttributes, Node } from "@tiptap/core";
   name: "blockGroup",
+  group: "blockGroup",
+  content: "blockContainer+",
 
@@ -14,4 +16,2 @@ addOptions() {
 
-  content: "block+",
-
   parseHTML() {
@@ -26,3 +26,3 @@ return [
 
-          if (element.getAttribute("data-node-type") === "block-group") {
+          if (element.getAttribute("data-node-type") === "blockGroup") {
             // Null means the element matches, but we don't want to add any attributes to the node.
@@ -43,3 +43,3 @@ return null;
         class: styles.blockGroup,
-        "data-node-type": "block-group",
+        "data-node-type": "blockGroup",
       }),
@@ -46,0 +46,0 @@ 0,

src/extensions/Blocks/PreviousBlockTypePlugin.ts

@@ -12,5 +12,7 @@ import {
 const nodeAttributes: Record<string, string> = {
-  listItemType: "list-item-type",
-  listItemIndex: "list-item-index",
-  headingLevel: "heading-level",
+  // Numbered List Items
+  index: "index",
+  // Headings
+  level: "level",
+  // All Blocks
   type: "type",
@@ -95,5 +97,4 @@ depth: "depth",
               const newAttrs = {
-                listItemType: newContentNode.attrs.listItemType,
-                listItemIndex: newContentNode.attrs.listItemIndex,
-                headingLevel: newContentNode.attrs.headingLevel,
+                index: newContentNode.attrs.index,
+                level: newContentNode.attrs.level,
                 type: newContentNode.type.name,
@@ -104,5 +105,4 @@ depth: newState.doc.resolve(node.pos).depth,
               const oldAttrs = {
-                listItemType: oldContentNode.attrs.listItemType,
-                listItemIndex: oldContentNode.attrs.listItemIndex,
-                headingLevel: oldContentNode.attrs.headingLevel,
+                index: oldContentNode.attrs.index,
+                level: oldContentNode.attrs.level,
                 type: oldContentNode.type.name,
@@ -112,24 +112,23 @@ depth: oldState.doc.resolve(oldNode.pos).depth,
 
-              // Hacky fix to avoid processing certain transactions created by ordered list indexing plugin.
+              // Hacky fix to avoid processing certain transactions created by the numbered list indexing plugin.
 
-              // True when an existing ordered list item is assigned an index for the first time, which happens
+              // True when an existing numbered list item is assigned an index for the first time, which happens
               // immediately after it's created. Using this condition to start an animation ensures it's not
-              // immediately overridden by a different transaction created by the ordered list indexing plugin.
+              // immediately overridden by a different transaction created by the numbered list indexing plugin.
               const indexInitialized =
-                oldAttrs.listItemIndex === null &&
-                newAttrs.listItemIndex !== null;
+                oldAttrs.index === null && newAttrs.index !== null;
 
-              // True when an existing ordered list item changes nesting levels, before its index is updated by the
-              // ordered list indexing plugin. This condition ensures that animations for indentation still work with
-              // ordered list items, while preventing unnecessary animations being done when dragging/dropping them.
+              // True when an existing numbered list item changes nesting levels, before its index is updated by the
+              // numbered list indexing plugin. This condition ensures that animations for indentation still work with
+              // numbered list items, while preventing unnecessary animations being done when dragging/dropping them.
               const depthChanged =
-                oldAttrs.listItemIndex !== null &&
-                newAttrs.listItemIndex !== null &&
-                oldAttrs.listItemIndex === newAttrs.listItemIndex;
+                oldAttrs.index !== null &&
+                newAttrs.index !== null &&
+                oldAttrs.index === newAttrs.index;
 
-              // Only false for transactions in which the block remains an ordered list item before & after, but neither
+              // Only false for transactions in which the block remains a numbered list item before & after, but neither
               // of the previous conditions apply.
               const shouldUpdate =
-                oldAttrs.listItemType === "ordered" &&
-                newAttrs.listItemType === "ordered"
+                oldAttrs.type === "numberedListItem" &&
+                newAttrs.type === "numberedListItem"
                   ? indexInitialized || depthChanged
@@ -169,3 +168,2 @@ : true;
         if (!pluginState.needsUpdate) {
-          // console.log("0");
           return undefined;
@@ -178,3 +176,2 @@ }
           if (!node.attrs.id) {
-            // console.log("1");
             return;
@@ -184,3 +181,2 @@ }
           if (!prevAttrs) {
-            // console.log("2");
             return;
@@ -187,0 +183,0 @@ }

src/extensions/DraggableBlocks/BlockSideMenuFactoryTypes.ts

@@ -13,3 +13,3 @@ import { EditorElement, ElementFactory } from "../../shared/EditorElement";
 export type BlockSideMenuDynamicParams = {
-  blockBoundingBox: DOMRect;
+  referenceRect: DOMRect;
 };
@@ -16,0 +16,0 @@

src/extensions/DraggableBlocks/DraggableBlocksPlugin.ts

@@ -6,4 +6,5 @@ import { Editor } from "@tiptap/core";
 import { EditorView } from "prosemirror-view";
-import { MultipleNodeSelection } from "../Blocks/MultipleNodeSelection";
-import { DraggableBlocksOptions } from "./DraggableBlocksExtension";
+import styles from "../../editor.module.css";
+import { getBlockInfoFromPos } from "../Blocks/helpers/getBlockInfoFromPos";
+import { SlashMenuPluginKey } from "../SlashMenu/SlashMenuExtension";
 import {
@@ -15,5 +16,4 @@ BlockSideMenu,
 } from "./BlockSideMenuFactoryTypes";
-import { getBlockInfoFromPos } from "../Blocks/helpers/getBlockInfoFromPos";
-import { SlashMenuPluginKey } from "../SlashMenu/SlashMenuExtension";
-import styles from "../../editor.module.css";
+import { DraggableBlocksOptions } from "./DraggableBlocksExtension";
+import { MultipleNodeSelection } from "./MultipleNodeSelection";
 
@@ -382,3 +382,3 @@ const serializeForClipboard = (pv as any).__serializeForClipboard;
         .BNCreateBlock(newBlockInsertionPos)
-        .BNSetContentType(newBlockContentPos, { name: "textContent" })
+        .BNUpdateBlock(newBlockContentPos, { type: "paragraph", props: {} })
         .setTextSelection(newBlockContentPos)
@@ -435,3 +435,3 @@ .run();
     return {
-      blockBoundingBox: new DOMRect(
+      referenceRect: new DOMRect(
         this.horizontalPosAnchoredAtRoot
@@ -438,0 +438,0 @@ ? getHorizontalAnchor()

src/extensions/FormattingToolbar/FormattingToolbarFactoryTypes.ts

 import { EditorElement, ElementFactory } from "../../shared/EditorElement";
-import { BlockContentType } from "../Blocks/nodes/Block";
+import { Block, BlockUpdate } from "../Blocks/apiTypes";
 
@@ -11,3 +11,3 @@ export type FormattingToolbarStaticParams = {
 
-  setBlockType: (type: BlockContentType) => void;
+  updateBlock: (blockUpdate: BlockUpdate) => void;
 };
@@ -24,8 +24,5 @@
 
-  // BlockContentType is mostly used to set a block's type, so the attr field is optional as block content types have
-  // default values for attributes. However, it means that a block type's attributes field will never be undefined due to
-  // these default values, which the Required type enforces.
-  activeBlockType: Required<BlockContentType>;
+  block: Block;
 
-  selectionBoundingBox: DOMRect;
+  referenceRect: DOMRect;
 };
@@ -32,0 +29,0 @@

src/extensions/FormattingToolbar/FormattingToolbarPlugin.ts

@@ -9,2 +9,4 @@ import {
 import { EditorView } from "prosemirror-view";
+import { Block, BlockUpdate } from "../Blocks/apiTypes";
+import { getBlockInfoFromPos } from "../Blocks/helpers/getBlockInfoFromPos";
 import {
@@ -16,3 +18,2 @@ FormattingToolbar,
 } from "./FormattingToolbarFactoryTypes";
-import { BlockContentType } from "../Blocks/nodes/Block";
 
@@ -270,7 +271,7 @@ // Same as TipTap bubblemenu plugin, but with these changes:
       },
-      setBlockType: (type: BlockContentType) => {
+      updateBlock: (blockUpdate: BlockUpdate) => {
         this.editor.view.focus();
-        this.editor.commands.BNSetContentType(
+        this.editor.commands.BNUpdateBlock(
           this.editor.state.selection.from,
-          type
+          blockUpdate
         );
@@ -282,2 +283,7 @@ },
   getDynamicParams(): FormattingToolbarDynamicParams {
+    const blockInfo = getBlockInfoFromPos(
+      this.editor.state.doc,
+      this.editor.state.selection.from
+    )!;
+
     return {
@@ -296,7 +302,9 @@ boldIsActive: this.editor.isActive("bold"),
       ),
-      activeBlockType: {
-        name: this.editor.state.selection.$from.node().type.name,
-        attrs: this.editor.state.selection.$from.node().attrs,
-      } as Required<BlockContentType>,
-      selectionBoundingBox: this.getSelectionBoundingBox(),
+      // Needs type cast as there is no way to create a type that dynamically updates based on which extensions are
+      // loaded by the editor.
+      block: {
+        type: blockInfo.contentType.name,
+        props: blockInfo.contentNode.attrs,
+      } as Block,
+      referenceRect: this.getSelectionBoundingBox(),
     };
@@ -303,0 +311,0 @@ }

src/extensions/HyperlinkToolbar/HyperlinkToolbarFactoryTypes.ts

@@ -12,3 +12,3 @@ import { EditorElement, ElementFactory } from "../../shared/EditorElement";
 
-  boundingBox: DOMRect;
+  referenceRect: DOMRect;
 };
@@ -15,0 +15,0 @@

src/extensions/HyperlinkToolbar/HyperlinkToolbarPlugin.ts

@@ -169,2 +169,4 @@ import { Editor, getMarkRange, posToDOMRect, Range } from "@tiptap/core";
       this.hyperlinkToolbar.render(this.getDynamicParams(), false);
+
+      return;
     }
@@ -231,3 +233,3 @@
       ),
-      boundingBox: posToDOMRect(
+      referenceRect: posToDOMRect(
         this.editor.view,
@@ -234,0 +236,0 @@ this.hyperlinkMarkRange!.from,

src/extensions/TrailingNode/TrailingNodeExtension.ts

@@ -35,4 +35,4 @@ import { Extension } from "@tiptap/core";
           const endPosition = doc.content.size - 2;
-          const type = schema.nodes["block"];
-          const contentType = schema.nodes["textContent"];
+          const type = schema.nodes["blockContainer"];
+          const contentType = schema.nodes["paragraph"];
           if (!shouldInsertNodeAtEnd) {
@@ -65,4 +65,4 @@ return;
 
-            if (!lastNode || lastNode.type.name !== "block") {
-              throw new Error("Expected block");
+            if (!lastNode || lastNode.type.name !== "blockContainer") {
+              throw new Error("Expected blockContainer");
             }
@@ -69,0 +69,0 @@ return lastNode.nodeSize > 4; // empty <block><content/></block> is length 4

src/extensions/UniqueID/UniqueID.ts

@@ -78,2 +78,8 @@ import {
             default: null,
+            parseHTML: (element) =>
+              element.getAttribute(`data-${this.options.attributeName}`),
+            renderHTML: (attributes) => ({
+              [`data-${this.options.attributeName}`]:
+                attributes[this.options.attributeName],
+            }),
           },
@@ -80,0 +86,0 @@ },

src/index.ts

 export * from "./BlockNoteEditor";
 export * from "./BlockNoteExtensions";
-export type { BlockContentType } from "./extensions/Blocks/nodes/Block";
+export type { Block, BlockUpdate } from "./extensions/Blocks/apiTypes";
 export * from "./extensions/FormattingToolbar/FormattingToolbarFactoryTypes";
@@ -8,3 +8,4 @@ export * from "./extensions/DraggableBlocks/BlockSideMenuFactoryTypes";
 export * from "./extensions/SlashMenu/SlashMenuItem";
+export * from "./shared/EditorElement";
 export type { SuggestionItem } from "./shared/plugins/suggestion/SuggestionItem";
 export * from "./shared/plugins/suggestion/SuggestionsMenuFactoryTypes";

src/shared/EditorElement.ts

@@ -1,10 +0,16 @@
-export type EditorElement<ElementDynamicParams extends Record<string, any>> = {
-  element: HTMLElement | undefined;
-  render: (params: ElementDynamicParams, isHidden: boolean) => void;
-  hide: () => void;
+export type RequiredStaticParams = Record<string, any>;
+export type RequiredDynamicParams = Record<string, any> & {
+  referenceRect: DOMRect;
 };
 
+export type EditorElement<ElementDynamicParams extends RequiredDynamicParams> =
+  {
+    element: HTMLElement | undefined;
+    render: (params: ElementDynamicParams, isHidden: boolean) => void;
+    hide: () => void;
+  };
+
 export type ElementFactory<
-  ElementStaticParams extends Record<string, any>,
-  ElementDynamicParams extends Record<string, any>
+  ElementStaticParams extends RequiredStaticParams,
+  ElementDynamicParams extends RequiredDynamicParams
 > = (staticParams: ElementStaticParams) => EditorElement<ElementDynamicParams>;

src/shared/plugins/suggestion/SuggestionPlugin.ts

@@ -204,3 +204,3 @@ import { Editor, Range } from "@tiptap/core";
       selectedItemIndex: this.pluginState.selectedItemIndex,
-      queryStartBoundingBox: decorationNode!.getBoundingClientRect(),
+      referenceRect: decorationNode!.getBoundingClientRect(),
     };
@@ -276,3 +276,3 @@ }
         // TODO: More clearly define which transactions should be ignored and which should deactivate the menu.
-        if (transaction.getMeta("orderedListIndexing") !== undefined) {
+        if (transaction.getMeta("numberedListIndexing") !== undefined) {
           return next;
@@ -279,0 +279,0 @@ }

src/shared/plugins/suggestion/SuggestionsMenuFactoryTypes.ts

@@ -12,3 +12,3 @@ import { EditorElement, ElementFactory } from "../../EditorElement";
 
-  queryStartBoundingBox: DOMRect;
+  referenceRect: DOMRect;
 };
@@ -15,0 +15,0 @@

types/src/BlockNoteEditor.d.ts

 import { Editor, EditorOptions } from "@tiptap/core";
 import { UiFactories } from "./BlockNoteExtensions";
-export declare type BlockNoteEditorOptions = EditorOptions & {
+export type BlockNoteEditorOptions = EditorOptions & {
     enableBlockNoteExtensions: boolean;
@@ -5,0 +5,0 @@ disableHistoryExtension: boolean;

types/src/BlockNoteExtensions.d.ts

 import { Extensions } from "@tiptap/core";
-import { Node } from "@tiptap/core";
 import { FormattingToolbarFactory } from "./extensions/FormattingToolbar/FormattingToolbarFactoryTypes";
@@ -8,4 +7,3 @@ import { HyperlinkToolbarFactory } from "./extensions/HyperlinkToolbar/HyperlinkToolbarFactoryTypes";
 import { SlashMenuItem } from "./extensions/SlashMenu/SlashMenuItem";
-export declare const Document: Node<any, any>;
-export declare type UiFactories = Partial<{
+export type UiFactories = Partial<{
     formattingToolbarFactory: FormattingToolbarFactory;
@@ -12,0 +10,0 @@ hyperlinkToolbarFactory: HyperlinkToolbarFactory;

types/src/extensions/Blocks/helpers/getBlockInfoFromPos.d.ts

 import { Node, NodeType } from "prosemirror-model";
-export declare type BlockInfo = {
+export type BlockInfo = {
     id: string;
@@ -4,0 +4,0 @@ node: Node;

types/src/extensions/DraggableBlocks/BlockSideMenuFactoryTypes.d.ts

 import { EditorElement, ElementFactory } from "../../shared/EditorElement";
-export declare type BlockSideMenuStaticParams = {
+export type BlockSideMenuStaticParams = {
     addBlock: () => void;
@@ -10,6 +10,6 @@ deleteBlock: () => void;
 };
-export declare type BlockSideMenuDynamicParams = {
-    blockBoundingBox: DOMRect;
+export type BlockSideMenuDynamicParams = {
+    referenceRect: DOMRect;
 };
-export declare type BlockSideMenu = EditorElement<BlockSideMenuDynamicParams>;
-export declare type BlockSideMenuFactory = ElementFactory<BlockSideMenuStaticParams, BlockSideMenuDynamicParams>;
+export type BlockSideMenu = EditorElement<BlockSideMenuDynamicParams>;
+export type BlockSideMenuFactory = ElementFactory<BlockSideMenuStaticParams, BlockSideMenuDynamicParams>;

types/src/extensions/DraggableBlocks/DraggableBlocksExtension.d.ts

 import { Editor, Extension } from "@tiptap/core";
 import { BlockSideMenuFactory } from "./BlockSideMenuFactoryTypes";
-export declare type DraggableBlocksOptions = {
+export type DraggableBlocksOptions = {
     editor: Editor;
@@ -5,0 +5,0 @@ blockSideMenuFactory: BlockSideMenuFactory;

types/src/extensions/DraggableBlocks/DraggableBlocksPlugin.d.ts

 import { Editor } from "@tiptap/core";
 import { Plugin } from "prosemirror-state";
+import { BlockSideMenu, BlockSideMenuDynamicParams, BlockSideMenuFactory, BlockSideMenuStaticParams } from "./BlockSideMenuFactoryTypes";
 import { DraggableBlocksOptions } from "./DraggableBlocksExtension";
-import { BlockSideMenu, BlockSideMenuDynamicParams, BlockSideMenuFactory, BlockSideMenuStaticParams } from "./BlockSideMenuFactoryTypes";
 export declare function createRect(rect: DOMRect): {
@@ -21,3 +21,3 @@ left: number;
 };
-export declare type BlockMenuViewProps = {
+export type BlockMenuViewProps = {
     editor: Editor;
@@ -24,0 +24,0 @@ blockMenuFactory: BlockSideMenuFactory;

types/src/extensions/FormattingToolbar/FormattingToolbarFactoryTypes.d.ts

 import { EditorElement, ElementFactory } from "../../shared/EditorElement";
-import { BlockContentType } from "../Blocks/nodes/Block";
-export declare type FormattingToolbarStaticParams = {
+import { Block, BlockUpdate } from "../Blocks/apiTypes";
+export type FormattingToolbarStaticParams = {
     toggleBold: () => void;
@@ -9,5 +9,5 @@ toggleItalic: () => void;
     setHyperlink: (url: string, text?: string) => void;
-    setBlockType: (type: BlockContentType) => void;
+    updateBlock: (blockUpdate: BlockUpdate) => void;
 };
-export declare type FormattingToolbarDynamicParams = {
+export type FormattingToolbarDynamicParams = {
     boldIsActive: boolean;
@@ -20,6 +20,6 @@ italicIsActive: boolean;
     activeHyperlinkText: string;
-    activeBlockType: Required<BlockContentType>;
-    selectionBoundingBox: DOMRect;
+    block: Block;
+    referenceRect: DOMRect;
 };
-export declare type FormattingToolbar = EditorElement<FormattingToolbarDynamicParams>;
-export declare type FormattingToolbarFactory = ElementFactory<FormattingToolbarStaticParams, FormattingToolbarDynamicParams>;
+export type FormattingToolbar = EditorElement<FormattingToolbarDynamicParams>;
+export type FormattingToolbarFactory = ElementFactory<FormattingToolbarStaticParams, FormattingToolbarDynamicParams>;

types/src/extensions/FormattingToolbar/FormattingToolbarPlugin.d.ts

@@ -18,3 +18,3 @@ import { Editor } from "@tiptap/core";
 }
-export declare type FormattingToolbarViewProps = FormattingToolbarPluginProps & {
+export type FormattingToolbarViewProps = FormattingToolbarPluginProps & {
     view: EditorView;
@@ -21,0 +21,0 @@ };

types/src/extensions/HyperlinkToolbar/HyperlinkToolbarFactoryTypes.d.ts

 import { EditorElement, ElementFactory } from "../../shared/EditorElement";
-export declare type HyperlinkToolbarStaticParams = {
+export type HyperlinkToolbarStaticParams = {
     editHyperlink: (url: string, text: string) => void;
     deleteHyperlink: () => void;
 };
-export declare type HyperlinkToolbarDynamicParams = {
+export type HyperlinkToolbarDynamicParams = {
     url: string;
     text: string;
-    boundingBox: DOMRect;
+    referenceRect: DOMRect;
 };
-export declare type HyperlinkToolbar = EditorElement<HyperlinkToolbarDynamicParams>;
-export declare type HyperlinkToolbarFactory = ElementFactory<HyperlinkToolbarStaticParams, HyperlinkToolbarDynamicParams>;
+export type HyperlinkToolbar = EditorElement<HyperlinkToolbarDynamicParams>;
+export type HyperlinkToolbarFactory = ElementFactory<HyperlinkToolbarStaticParams, HyperlinkToolbarDynamicParams>;

types/src/extensions/HyperlinkToolbar/HyperlinkToolbarPlugin.d.ts

 import { Editor } from "@tiptap/core";
 import { Plugin } from "prosemirror-state";
 import { HyperlinkToolbarFactory } from "./HyperlinkToolbarFactoryTypes";
-export declare type HyperlinkToolbarPluginProps = {
+export type HyperlinkToolbarPluginProps = {
     hyperlinkToolbarFactory: HyperlinkToolbarFactory;
 };
-export declare type HyperlinkToolbarViewProps = {
+export type HyperlinkToolbarViewProps = {
     editor: Editor;
@@ -9,0 +9,0 @@ hyperlinkToolbarFactory: HyperlinkToolbarFactory;

types/src/extensions/SlashMenu/SlashMenuExtension.d.ts

@@ -5,3 +5,3 @@ import { Extension } from "@tiptap/core";
 import { SlashMenuItem } from "./SlashMenuItem";
-export declare type SlashMenuOptions = {
+export type SlashMenuOptions = {
     commands: {
@@ -8,0 +8,0 @@ [key: string]: SlashMenuItem;

types/src/extensions/SlashMenu/SlashMenuItem.d.ts

 import { Editor, Range } from "@tiptap/core";
 import { SuggestionItem } from "../../shared/plugins/suggestion/SuggestionItem";
-export declare type SlashMenuCallback = (editor: Editor, range: Range) => boolean;
+export type SlashMenuCallback = (editor: Editor, range: Range) => boolean;
 export declare enum SlashMenuGroups {
@@ -5,0 +5,0 @@ HEADINGS = "Headings",

types/src/index.d.ts

 export * from "./BlockNoteEditor";
 export * from "./BlockNoteExtensions";
-export type { BlockContentType } from "./extensions/Blocks/nodes/Block";
+export type { Block, BlockUpdate } from "./extensions/Blocks/apiTypes";
 export * from "./extensions/FormattingToolbar/FormattingToolbarFactoryTypes";
@@ -8,3 +8,4 @@ export * from "./extensions/DraggableBlocks/BlockSideMenuFactoryTypes";
 export * from "./extensions/SlashMenu/SlashMenuItem";
+export * from "./shared/EditorElement";
 export type { SuggestionItem } from "./shared/plugins/suggestion/SuggestionItem";
 export * from "./shared/plugins/suggestion/SuggestionsMenuFactoryTypes";

types/src/shared/EditorElement.d.ts

@@ -1,2 +0,6 @@
-export declare type EditorElement<ElementDynamicParams extends Record<string, any>> = {
+export type RequiredStaticParams = Record<string, any>;
+export type RequiredDynamicParams = Record<string, any> & {
+    referenceRect: DOMRect;
+};
+export type EditorElement<ElementDynamicParams extends RequiredDynamicParams> = {
     element: HTMLElement | undefined;
@@ -6,2 +10,2 @@ render: (params: ElementDynamicParams, isHidden: boolean) => void;
 };
-export declare type ElementFactory<ElementStaticParams extends Record<string, any>, ElementDynamicParams extends Record<string, any>> = (staticParams: ElementStaticParams) => EditorElement<ElementDynamicParams>;
+export type ElementFactory<ElementStaticParams extends RequiredStaticParams, ElementDynamicParams extends RequiredDynamicParams> = (staticParams: ElementStaticParams) => EditorElement<ElementDynamicParams>;

types/src/shared/plugins/suggestion/SuggestionPlugin.d.ts

@@ -5,3 +5,3 @@ import { Editor, Range } from "@tiptap/core";
 import { SuggestionItem } from "./SuggestionItem";
-export declare type SuggestionPluginOptions<T extends SuggestionItem> = {
+export type SuggestionPluginOptions<T extends SuggestionItem> = {
     /**
@@ -43,3 +43,3 @@ * The name of the plugin.
 };
-declare type SuggestionPluginState<T extends SuggestionItem> = {
+type SuggestionPluginState<T extends SuggestionItem> = {
     active: boolean;
@@ -54,3 +54,3 @@ range: Range | null;
 };
-export declare type MenuType = "slash" | "drag";
+export type MenuType = "slash" | "drag";
 /**
@@ -57,0 +57,0 @@ * Finds a command: a specified character (e.g. '/') followed by a string of characters (all characters except the specified character are allowed).

types/src/shared/plugins/suggestion/SuggestionsMenuFactoryTypes.d.ts

 import { EditorElement, ElementFactory } from "../../EditorElement";
 import { SuggestionItem } from "./SuggestionItem";
-export declare type SuggestionsMenuStaticParams<T extends SuggestionItem> = {
+export type SuggestionsMenuStaticParams<T extends SuggestionItem> = {
     itemCallback: (item: T) => void;
 };
-export declare type SuggestionsMenuDynamicParams<T extends SuggestionItem> = {
+export type SuggestionsMenuDynamicParams<T extends SuggestionItem> = {
     items: T[];
     selectedItemIndex: number;
-    queryStartBoundingBox: DOMRect;
+    referenceRect: DOMRect;
 };
-export declare type SuggestionsMenu<T extends SuggestionItem> = EditorElement<SuggestionsMenuDynamicParams<T>>;
-export declare type SuggestionsMenuFactory<T extends SuggestionItem> = ElementFactory<SuggestionsMenuStaticParams<T>, SuggestionsMenuDynamicParams<T>>;
+export type SuggestionsMenu<T extends SuggestionItem> = EditorElement<SuggestionsMenuDynamicParams<T>>;
+export type SuggestionsMenuFactory<T extends SuggestionItem> = ElementFactory<SuggestionsMenuStaticParams<T>, SuggestionsMenuDynamicParams<T>>;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1533252

increased by3.05%

Number of package files

133

increased by15.65%

Lines of code

8858

increased by3.49%

Worsened metrics

Dependency count

34

increased by6.25%

Number of low quality alerts

3

increased by50%

Dependency changes

• + Addedy-protocols@1.0.5

• + Addedyjs@13.5.44

• + Addedy-protocols@1.0.5(transitive)

• + Addedyjs@13.5.44(transitive)

• - Removedy-protocols@1.0.6(transitive)

• - Removedyjs@13.6.20(transitive)