@jackuait/blok 0.6.0-beta.7 → 0.6.0-beta.9

package/dist/blok.mjs

@@ -1,5 +1,5 @@
-import { B as s, v as a } from "./chunks/blok-Bjkxis7j.mjs";
-import { D as A } from "./chunks/inline-tool-convert-5DE7c2fi.mjs";
+import { B as s, v as a } from "./chunks/blok-Bn6Q_o8h.mjs";
+import { D as A } from "./chunks/inline-tool-convert-SRTkyaZn.mjs";
 export {
   s as Blok,
   A as DATA_ATTR,

package/dist/chunks/{blok-Bjkxis7j.mjs → blok-Bn6Q_o8h.mjs}

@@ -20,7 +20,7 @@ var Eo = (s, t) => {
   return e;
 };
 var Ie = (s, t, e) => Io(s, typeof t != "symbol" ? t + "" : t, e);
-import { L as uo, l as C, c as Qi, i as z, a as k, S as w, D as y, t as O, b as I, P as G, E as yn, g as wt, d as tl, e as gr, f as $e, h as st, j as A, k as le, m as Ut, n as kr, s as el, o as po, p as Bn, q as wn, r as S, u as Vo, v as hs, F as ae, w as Wo, x as ds, y as us, z as ut, A as ol, B as nl, C as sl, I as rl, G as Xo, H as Ke, J as ce, K as Mt, M as br, N as Ot, O as K, Q as Ht, R as il, T as ll, U as ps, V as al, W as cl, X as hl, Y as dl, Z as ul, _ as mr, $ as pl, a0 as yr, a1 as Br, a2 as Ct, a3 as fl, a4 as wr, a5 as vr, a6 as gl, a7 as kl, a8 as bl, a9 as ml, aa as yl, ab as Bl, ac as fs, ad as xr, ae as wl, af as vl, ag as xl, ah as Tl, ai as Sl, aj as Cl, ak as Il, al as El } from "./inline-tool-convert-5DE7c2fi.mjs";
+import { L as uo, l as C, c as Qi, i as z, a as k, S as w, D as y, t as O, b as I, P as G, E as yn, g as wt, d as tl, e as gr, f as $e, h as ot, j as A, k as le, m as Ut, n as kr, s as el, o as po, p as Bn, q as wn, r as T, u as Vo, v as hs, F as ae, w as Wo, x as ds, y as us, z as ut, A as ol, B as nl, C as sl, I as rl, G as Xo, H as Ke, J as ce, K as Mt, M as br, N as Ot, O as K, Q as Ht, R as il, T as ll, U as ps, V as al, W as cl, X as hl, Y as dl, Z as ul, _ as mr, $ as pl, a0 as yr, a1 as Br, a2 as Ct, a3 as fl, a4 as wr, a5 as vr, a6 as gl, a7 as kl, a8 as bl, a9 as ml, aa as yl, ab as Bl, ac as fs, ad as xr, ae as wl, af as vl, ag as xl, ah as Tl, ai as Sl, aj as Cl, ak as Il, al as El } from "./inline-tool-convert-SRTkyaZn.mjs";
 function Ml(s) {
   return s && s.__esModule && Object.prototype.hasOwnProperty.call(s, "default") ? s.default : s;
 }
@@ -928,7 +928,7 @@ class jl {
     });
   }
 }
-var nt = /* @__PURE__ */ ((s) => (s.RENDERED = "rendered", s.MOVED = "moved", s.UPDATED = "updated", s.REMOVED = "removed", s.ON_PASTE = "onPaste", s))(nt || {});
+var st = /* @__PURE__ */ ((s) => (s.RENDERED = "rendered", s.MOVED = "moved", s.UPDATED = "updated", s.REMOVED = "removed", s.ON_PASTE = "onPaste", s))(st || {});
 class vn extends yn {
   /**
    * @param options - block constructor options
@@ -1411,6 +1411,7 @@ class Ul extends x {
       update: this.update,
       composeBlockData: this.composeBlockData,
       convert: this.convert,
+      setBlockParent: (t, e) => this.setBlockParent(t, e),
       stopBlockMutationWatching: (t) => this.stopBlockMutationWatching(t),
       splitBlock: this.splitBlock
     };
@@ -1436,7 +1437,7 @@ class Ul extends x {
   getBlockIndex(t) {
     const e = this.Blok.BlockManager.getBlockById(t);
     if (!e) {
-      st("There is no block with id `" + t + "`", "warn");
+      ot("There is no block with id `" + t + "`", "warn");
       return;
     }
     return this.Blok.BlockManager.getBlockIndex(e);
@@ -1448,7 +1449,7 @@ class Ul extends x {
   getBlockByIndex(t) {
     const e = this.Blok.BlockManager.getBlockByIndex(t);
     if (e === void 0) {
-      st("There is no block at index `" + t + "`", "warn");
+      ot("There is no block at index `" + t + "`", "warn");
       return;
     }
     return new et(e);
@@ -1459,7 +1460,7 @@ class Ul extends x {
    */
   getById(t) {
     const e = this.Blok.BlockManager.getBlockById(t);
-    return e === void 0 ? (st("There is no block with id `" + t + "`", "warn"), null) : new et(e);
+    return e === void 0 ? (ot("There is no block with id `" + t + "`", "warn"), null) : new et(e);
   }
   /**
    * Get Block API object by any child html element
@@ -1469,7 +1470,7 @@ class Ul extends x {
     var o, n;
     const e = this.Blok.BlockManager.getBlock(t);
     if (e === void 0) {
-      st(`There is no block corresponding to element <${(n = (o = t.tagName) == null ? void 0 : o.toLowerCase()) != null ? n : "unknown"}>`, "warn");
+      ot(`There is no block corresponding to element <${(n = (o = t.tagName) == null ? void 0 : o.toLowerCase()) != null ? n : "unknown"}>`, "warn");
       return;
     }
     return new et(e);
@@ -1498,13 +1499,13 @@ class Ul extends x {
   async delete(t = this.Blok.BlockManager.currentBlockIndex) {
     const e = this.Blok.BlockManager.getBlockByIndex(t);
     if (e === void 0) {
-      st(`There is no block at index \`${t}\``, "warn");
+      ot(`There is no block at index \`${t}\``, "warn");
       return;
     }
     try {
       await this.Blok.BlockManager.removeBlock(e);
     } catch (o) {
-      st(o, "warn");
+      ot(o, "warn");
       return;
     }
     this.Blok.BlockManager.blocks.length === 0 && this.Blok.BlockManager.insert(), this.Blok.BlockManager.currentBlock && this.Blok.Caret.setToBlock(this.Blok.BlockManager.currentBlock, this.Blok.Caret.positions.END), this.Blok.Toolbar.close();
@@ -1532,6 +1533,19 @@ class Ul extends x {
   async renderFromHTML(t) {
     return await this.Blok.BlockManager.clear(), this.Blok.Paste.processText(t, !0);
   }
+  /**
+   * Sets the parent of a block, updating both the block's parentId and the parent's contentIds.
+   * @param blockId - id of the block to reparent
+   * @param parentId - id of the new parent block, or null for root level
+   */
+  setBlockParent(t, e) {
+    const o = this.Blok.BlockManager.getBlockById(t);
+    if (o === void 0) {
+      ot("There is no block with id `" + t + "`", "warn");
+      return;
+    }
+    this.Blok.BlockManager.setBlockParent(o, e);
+  }
   /**
    * Stops mutation watching on a block at the specified index.
    * This is used to prevent spurious block-changed events during block replacement.
@@ -1783,7 +1797,7 @@ class ql {
    * @returns {Promise<NotifierModule>} loaded notifier module
    */
   loadNotifierModule() {
-    return this.notifierModule !== null ? Promise.resolve(this.notifierModule) : (this.loadingPromise === null && (this.loadingPromise = import("./index-CJfN4Vuv.mjs").then((t) => {
+    return this.notifierModule !== null ? Promise.resolve(this.notifierModule) : (this.loadingPromise === null && (this.loadingPromise = import("./index-oe38cp86.mjs").then((t) => {
       const e = t;
       if (!this.isNotifierModule(e))
         throw new Error('notifier module does not expose a "show" method.');
@@ -1919,7 +1933,7 @@ function ta() {
             }
             var b = i(f), g;
             b && (g = Array.prototype.some.call(f.childNodes, n));
-            var m = !!u.parentNode, v = n(u) && n(f) && m, T = f.nodeName.toLowerCase(), L = a(this.config, T, f), Q = b && g;
+            var m = !!u.parentNode, v = n(u) && n(f) && m, S = f.nodeName.toLowerCase(), L = a(this.config, S, f), Q = b && g;
             if (Q || c(f, L) || !this.config.keepNestedBlockElements && v) {
               if (!(f.nodeName === "SCRIPT" || f.nodeName === "STYLE"))
                 for (; f.childNodes.length > 0; )
@@ -2140,7 +2154,7 @@ class ba extends x {
     var r, i;
     const t = "Blok's content can not be saved in read-only mode";
     if (this.Blok.ReadOnly.isEnabled)
-      throw st(t, "warn"), new Error(t);
+      throw ot(t, "warn"), new Error(t);
     const e = await this.Blok.Saver.save();
     if (e !== void 0)
       return e;
@@ -2268,7 +2282,7 @@ class Ba extends x {
    */
   toggleBlockSettings(t) {
     if (this.Blok.BlockManager.currentBlockIndex === -1) {
-      st("Could't toggle the Toolbar because there is no block selected ", "warn");
+      ot("Could't toggle the Toolbar because there is no block selected ", "warn");
       return;
     }
     (t != null ? t : !this.Blok.BlockSettings.opened) ? (this.Blok.Toolbar.moveAndOpen(), this.Blok.BlockSettings.open()) : this.Blok.BlockSettings.close();
@@ -2279,7 +2293,7 @@ class Ba extends x {
    */
   toggleToolbox(t) {
     if (this.Blok.BlockManager.currentBlockIndex === -1) {
-      st("Could't toggle the Toolbox because there is no block selected ", "warn");
+      ot("Could't toggle the Toolbox because there is no block selected ", "warn");
       return;
     }
     (t != null ? t : !this.Blok.Toolbar.toolbox.opened) ? (this.Blok.Toolbar.moveAndOpen(), this.Blok.Toolbar.toolbox.open()) : this.Blok.Toolbar.toolbox.close();
@@ -4393,8 +4407,8 @@ class Ih extends Ir {
       c ? this.stopCapturing() : h || this.clear(!1, !0);
       const u = new Hn();
       a.afterState.forEach((g, m) => {
-        const v = a.beforeState.get(m) || 0, T = g - v;
-        T > 0 && jn(u, m, v, T);
+        const v = a.beforeState.get(m) || 0, S = g - v;
+        S > 0 && jn(u, m, v, S);
       });
       const p = ec();
       let f = !1;
@@ -8985,14 +8999,14 @@ class Pi extends x {
   }
 }
 const tr = {
-  Backspace: S.BACKSPACE,
-  Delete: S.DELETE,
-  Enter: S.ENTER,
-  Tab: S.TAB,
-  ArrowDown: S.DOWN,
-  ArrowRight: S.RIGHT,
-  ArrowUp: S.UP,
-  ArrowLeft: S.LEFT
+  Backspace: T.BACKSPACE,
+  Delete: T.DELETE,
+  Enter: T.ENTER,
+  Tab: T.TAB,
+  ArrowDown: T.DOWN,
+  ArrowRight: T.RIGHT,
+  ArrowUp: T.UP,
+  ArrowLeft: T.LEFT
 }, pd = /* @__PURE__ */ new Set(["Enter", "Process", "Spacebar", "Space", "Dead"]), De = '[contenteditable="true"], textarea, input', Pt = "list", er = "header", fd = /^\[(x|X| )?\]\s([\s\S]*)$/, gd = /^[-*]\s([\s\S]*)$/, kd = /^(\d+)[.)]\s([\s\S]*)$/, bd = /^(#{1,6})\s([\s\S]*)$/;
 class Co {
   constructor(t) {
@@ -9238,31 +9252,31 @@ class yd extends Co {
     const e = so(t);
     if (e === null || or(t, "down"))
       return;
-    const o = ae.usedKeys.includes(e) && (!t.shiftKey || e === S.TAB);
+    const o = ae.usedKeys.includes(e) && (!t.shiftKey || e === T.TAB);
     if (this.Blok.UI.someToolbarOpened && o)
       return;
     t.shiftKey || (this.Blok.Toolbar.close(), this.Blok.InlineToolbar.close());
     const n = w.get();
     n != null && n.anchorNode && !this.Blok.BlockSelection.anyBlockSelected && this.Blok.BlockManager.setCurrentBlockByChildNode(n.anchorNode);
     const { currentBlock: r } = this.Blok.BlockManager, i = t.target, l = document.activeElement instanceof HTMLElement ? document.activeElement : null, a = [
-      r == null ? void 0 : r.inputs.find((T) => i !== null && T.contains(i)),
-      r == null ? void 0 : r.inputs.find((T) => l !== null && T.contains(l)),
+      r == null ? void 0 : r.inputs.find((S) => i !== null && S.contains(i)),
+      r == null ? void 0 : r.inputs.find((S) => l !== null && S.contains(l)),
       i == null ? void 0 : i.closest(De),
       l == null ? void 0 : l.closest(De)
     ], c = (v = r == null ? void 0 : r.currentInput) != null ? v : a.find(
-      (T) => T instanceof HTMLElement
-    ), d = (c !== void 0 ? se(c) : void 0) || this.Blok.BlockSelection.anyBlockSelected, u = t.shiftKey && e === S.DOWN;
+      (S) => S instanceof HTMLElement
+    ), d = (c !== void 0 ? se(c) : void 0) || this.Blok.BlockSelection.anyBlockSelected, u = t.shiftKey && e === T.DOWN;
     if (u && d) {
       this.Blok.CrossBlockSelection.toggleBlockSelectedState();
       return;
     }
     u && this.Blok.InlineToolbar.tryToShow();
-    const f = e === S.RIGHT && !t.shiftKey && !this.isRtl && c instanceof HTMLElement ? ud(c) : null;
+    const f = e === T.RIGHT && !t.shiftKey && !this.isRtl && c instanceof HTMLElement ? ud(c) : null;
     if (f !== null) {
       w.setCursor(f.node, f.offset), t.preventDefault();
       return;
     }
-    const b = e === S.DOWN, g = e === S.RIGHT && !this.isRtl;
+    const b = e === T.DOWN, g = e === T.RIGHT && !this.isRtl;
     if (b ? this.Blok.Caret.navigateVerticalNext() : g ? this.Blok.Caret.navigateNext() : !1) {
       t.preventDefault();
       return;
@@ -9278,7 +9292,7 @@ class yd extends Co {
   handleArrowLeftAndUp(t) {
     var g;
     const e = this.Blok.UI.someToolbarOpened, o = so(t);
-    if (o === null || or(t, "up") || e && ae.usedKeys.includes(o) && (!t.shiftKey || o === S.TAB))
+    if (o === null || or(t, "up") || e && ae.usedKeys.includes(o) && (!t.shiftKey || o === T.TAB))
       return;
     e && this.Blok.UI.closeAllToolbars(), t.shiftKey || (this.Blok.Toolbar.close(), this.Blok.InlineToolbar.close());
     const n = window.getSelection();
@@ -9290,13 +9304,13 @@ class yd extends Co {
       l == null ? void 0 : l.closest(De)
     ], c = (g = r == null ? void 0 : r.currentInput) != null ? g : a.find(
       (m) => m instanceof HTMLElement
-    ), d = (c !== void 0 ? Ue(c) : void 0) || this.Blok.BlockSelection.anyBlockSelected, u = t.shiftKey && o === S.UP;
+    ), d = (c !== void 0 ? Ue(c) : void 0) || this.Blok.BlockSelection.anyBlockSelected, u = t.shiftKey && o === T.UP;
     if (u && d) {
       this.Blok.CrossBlockSelection.toggleBlockSelectedState(!1);
       return;
     }
     u && this.Blok.InlineToolbar.tryToShow();
-    const p = o === S.UP, f = o === S.LEFT && !this.isRtl;
+    const p = o === T.UP, f = o === T.LEFT && !this.isRtl;
     if (p ? this.Blok.Caret.navigateVerticalPrevious() : f ? this.Blok.Caret.navigatePrevious() : !1) {
       t.preventDefault();
       return;
@@ -9334,16 +9348,16 @@ class Bd extends Co {
     const i = r.textContent || "", l = o.holder.getAttribute("data-blok-depth"), a = l ? parseInt(l, 10) : 0, c = fd.exec(i);
     if (c) {
       this.Blok.YjsManager.stopCapturing();
-      const T = ((v = c[1]) == null ? void 0 : v.toLowerCase()) === "x", L = c[1] !== void 0 ? 4 : 3, Q = this.extractRemainingHtml(r, L), X = this.getCaretOffset(r) - L, St = t.replace(o, Pt, B({
+      const S = ((v = c[1]) == null ? void 0 : v.toLowerCase()) === "x", L = c[1] !== void 0 ? 4 : 3, Q = this.extractRemainingHtml(r, L), X = this.getCaretOffset(r) - L, St = t.replace(o, Pt, B({
         text: Q,
         style: "checklist",
-        checked: T
+        checked: S
       }, a > 0 ? { depth: a } : {}));
       return this.setCaretAfterConversion(St, X), this.Blok.YjsManager.stopCapturing(), !0;
     }
     if (gd.exec(i)) {
       this.Blok.YjsManager.stopCapturing();
-      const T = 2, L = this.extractRemainingHtml(r, T), Q = this.getCaretOffset(r) - T, X = t.replace(o, Pt, B({
+      const S = 2, L = this.extractRemainingHtml(r, S), Q = this.getCaretOffset(r) - S, X = t.replace(o, Pt, B({
         text: L,
         style: "unordered",
         checked: !1
@@ -9521,24 +9535,24 @@ class vd extends x {
     if (this.navigationMode.handleKey(t) || this.navigationMode.handleEscape(t) || (this.beforeKeydownProcessing(t), this.blockSelectionKeys.handleDeletion(t)) || t.defaultPrevented)
       return;
     switch (so(t)) {
-      case S.BACKSPACE:
+      case T.BACKSPACE:
         this.keyboardNavigation.handleBackspace(t);
         break;
-      case S.DELETE:
+      case T.DELETE:
         this.keyboardNavigation.handleDelete(t);
         break;
-      case S.ENTER:
+      case T.ENTER:
         this.keyboardNavigation.handleEnter(t);
         break;
-      case S.DOWN:
-      case S.RIGHT:
+      case T.DOWN:
+      case T.RIGHT:
         this.keyboardNavigation.handleArrowRightAndDown(t);
         break;
-      case S.UP:
-      case S.LEFT:
+      case T.UP:
+      case T.LEFT:
         this.keyboardNavigation.handleArrowLeftAndUp(t);
         break;
-      case S.TAB:
+      case T.TAB:
         if (this.blockSelectionKeys.handleIndent(t))
           return;
         this.keyboardNavigation.handleTab(t);
@@ -9635,7 +9649,7 @@ class vd extends x {
    * @param {KeyboardEvent} event - keyboard event
    */
   needToolbarClosing(t) {
-    const e = so(t), o = e === S.ENTER, n = e === S.TAB, r = o && this.Blok.Toolbar.toolbox.opened, i = o && this.Blok.BlockSettings.opened, l = o && this.Blok.InlineToolbar.opened, a = n, c = this.Blok.Toolbar.toolbox.opened && !o && !n;
+    const e = so(t), o = e === T.ENTER, n = e === T.TAB, r = o && this.Blok.Toolbar.toolbox.opened, i = o && this.Blok.BlockSettings.opened, l = o && this.Blok.InlineToolbar.opened, a = n, c = this.Blok.Toolbar.toolbox.opened && !o && !n;
     return !(t.shiftKey || a || r || i || l || c);
   }
 }
@@ -9709,7 +9723,7 @@ class zo {
       const r = t - 1, i = Math.max(0, r), l = this.blocks[i], a = t > 0 ? "afterend" : "beforebegin";
       this.insertToDOM(n, a, l);
     }
-    this.blocks.splice(t, 0, n), n.call(nt.MOVED, {
+    this.blocks.splice(t, 0, n), n.call(st.MOVED, {
       fromIndex: e,
       toIndex: t
     });
@@ -9728,7 +9742,7 @@ class zo {
     const n = t > this.length ? this.length : t;
     if (o) {
       const l = this.blocks[n];
-      l.call(nt.REMOVED), l.destroy(), l.holder.remove();
+      l.call(st.REMOVED), l.destroy(), l.holder.remove();
     }
     const r = o ? 1 : 0;
     if (this.blocks.splice(n, r, e), n > 0) {
@@ -9752,7 +9766,7 @@ class zo {
     if (!(t in this.blocks))
       throw Error("Incorrect index");
     const o = this.blocks[t];
-    o.holder.replaceWith(e.holder), o.call(nt.REMOVED), this.blocks[t] = e, e.call(nt.RENDERED);
+    o.holder.replaceWith(e.holder), o.call(st.REMOVED), this.blocks[t] = e, e.call(st.RENDERED);
   }
   /**
    * Inserts several blocks at once
@@ -9764,14 +9778,14 @@ class zo {
     for (const n of t)
       o.appendChild(n.holder);
     if (!this.length) {
-      this.blocks.push(...t), this.workingArea.appendChild(o), t.forEach((n) => n.call(nt.RENDERED));
+      this.blocks.push(...t), this.workingArea.appendChild(o), t.forEach((n) => n.call(st.RENDERED));
       return;
     }
     if (e > 0) {
       const n = Math.min(e - 1, this.length - 1);
       this.blocks[n].holder.after(o);
     }
-    e === 0 && this.workingArea.prepend(o), this.blocks.splice(e, 0, ...t), t.forEach((n) => n.call(nt.RENDERED));
+    e === 0 && this.workingArea.prepend(o), this.blocks.splice(e, 0, ...t), t.forEach((n) => n.call(st.RENDERED));
   }
   /**
    * Remove block
@@ -9779,13 +9793,13 @@ class zo {
    */
   remove(t) {
     const e = isNaN(t) ? this.length - 1 : t, o = this.blocks[e];
-    o.call(nt.REMOVED), o.destroy(), o.holder.remove(), this.blocks.splice(e, 1);
+    o.call(st.REMOVED), o.destroy(), o.holder.remove(), this.blocks.splice(e, 1);
   }
   /**
    * Remove all blocks
    */
   removeAll() {
-    this.workingArea.innerHTML = "", this.blocks.forEach((t) => t.call(nt.REMOVED)), this.blocks.length = 0;
+    this.workingArea.innerHTML = "", this.blocks.forEach((t) => t.call(st.REMOVED)), this.blocks.length = 0;
   }
   /**
    * Insert Block after passed target
@@ -9820,7 +9834,7 @@ class zo {
    * @param {Block} target — Block related to position
    */
   insertToDOM(t, e, o) {
-    e && o !== void 0 ? o.holder.insertAdjacentElement(e, t.holder) : this.workingArea.appendChild(t.holder), t.call(nt.RENDERED);
+    e && o !== void 0 ? o.holder.insertAdjacentElement(e, t.holder) : this.workingArea.appendChild(t.holder), t.call(st.RENDERED);
   }
 }
 class xd {
@@ -10418,7 +10432,7 @@ class Ad {
       skipYjsSync: !0
     }, n);
     this.yjsSync.withAtomicOperation(() => void r.ready.then(() => {
-      r.call(nt.ON_PASTE, e), r.refreshToolRootElement();
+      r.call(st.ON_PASTE, e), r.refreshToolRootElement();
     }).catch((l) => {
       C(`${t}: onPaste callback call is failed`, "error", l);
     }));
@@ -10799,7 +10813,7 @@ class _d {
     return (this.registeredShortcuts.get(t) || []).find(({ name: n }) => n === e);
   }
 }
-const ot = new _d();
+const nt = new _d();
 class Pd {
   /**
    * @param wrapper - Editor wrapper element
@@ -10816,17 +10830,17 @@ class Pd {
     setTimeout(() => {
       const t = ["CMD+SHIFT+UP", "CMD+SHIFT+DOWN"];
       for (const e of this.registeredShortcutNames)
-        ot.remove(document, e);
+        nt.remove(document, e);
       this.registeredShortcutNames.length = 0;
       for (const e of t)
-        ot.remove(document, e);
-      ot.add({
+        nt.remove(document, e);
+      nt.add({
         name: "CMD+SHIFT+UP",
         on: document,
         handler: (e) => {
           this.shouldHandleShortcut(e) && (e.preventDefault(), this.handlers.onMoveUp());
         }
-      }), this.registeredShortcutNames.push("CMD+SHIFT+UP"), ot.add({
+      }), this.registeredShortcutNames.push("CMD+SHIFT+UP"), nt.add({
         name: "CMD+SHIFT+DOWN",
         on: document,
         handler: (e) => {
@@ -10840,7 +10854,7 @@ class Pd {
    */
   unregister() {
     for (const t of this.registeredShortcutNames)
-      ot.remove(document, t);
+      nt.remove(document, t);
     this.registeredShortcutNames.length = 0;
   }
   /**
@@ -11681,7 +11695,7 @@ class jd extends x {
    * to select all and copy them
    */
   prepare() {
-    this.selection = new w(), ot.add({
+    this.selection = new w(), nt.add({
       name: "CMD+A",
       handler: (t) => {
         const { BlockManager: e, ReadOnly: o } = this.Blok;
@@ -11861,7 +11875,7 @@ class jd extends x {
    * De-registers Shortcut CMD+A
    */
   destroy() {
-    ot.remove(this.Blok.UI.nodes.redactor, "CMD+A");
+    nt.remove(this.Blok.UI.nodes.redactor, "CMD+A");
   }
   /**
    * First CMD+A selects all input content by native behaviour,
@@ -13607,7 +13621,7 @@ class lu extends x {
   async ensureI18nextLoaded(t, e) {
     if (this.i18nextWrapper !== null)
       return;
-    const { loadI18next: o } = await import("./i18next-loader-D-sjerXt.mjs");
+    const { loadI18next: o } = await import("./i18next-loader-DjR4d8M7.mjs");
     this.i18nextWrapper = await o(t, e);
   }
   /**
@@ -13781,7 +13795,7 @@ class Se {
    * Process paste of single Block tool content.
    */
   async processSingleBlock(t, e) {
-    const { Caret: o, BlockManager: n } = this.Blok, { currentBlock: r } = n, { Dom: i } = await import("./inline-tool-convert-5DE7c2fi.mjs").then((a) => a.aI), l = i;
+    const { Caret: o, BlockManager: n } = this.Blok, { currentBlock: r } = n, { Dom: i } = await import("./inline-tool-convert-SRTkyaZn.mjs").then((a) => a.aI), l = i;
     if (!r || t.tool !== r.name || !l.containsOnlyInlineElements(t.content.innerHTML)) {
       await this.insertBlock(t, e);
       return;
@@ -14568,13 +14582,13 @@ class uu extends x {
     const i = r.getBoundingClientRect(), l = this.getScrollTop(), a = e - l;
     if (!(a >= i.top && a <= i.bottom))
       return;
-    const h = this.getScrollLeft(), d = t - h, u = r.querySelector('[data-blok-testid="block-content"]'), p = u ? u.getBoundingClientRect() : i, f = d >= p.left && d <= p.right, b = document.elementFromPoint(t - h, a);
-    !b || (!b.closest(ut(y.toolbar)) && !o && (this.Blok.BlockSelection.allBlocksSelected = !1, this.clearSelection(), this.stackOfSelected = []), [
+    const h = this.getScrollLeft(), d = t - h, u = this.Blok.UI.contentRect, p = d >= u.left && d <= u.right, f = document.elementFromPoint(t - h, a);
+    !f || (!f.closest(ut(y.toolbar)) && !o && (this.Blok.BlockSelection.allBlocksSelected = !1, this.clearSelection(), this.stackOfSelected = []), [
       ut(y.elementContent),
       ut(y.toolbar),
       ut(y.popover),
       rl
-    ].some((T) => !!b.closest(T))) || (f && this.Blok.Toolbar.close(), this.mousedown = !0, this.startX = t, this.startY = e);
+    ].some((v) => !!f.closest(v))) || (p && this.Blok.Toolbar.close(), this.mousedown = !0, this.startX = t, this.startY = e);
   }
   /**
    * Clear all params to end selection
@@ -14970,29 +14984,29 @@ class Du extends x {
         const r = this.config.dataModel || "auto", i = vu(t);
         this.detectedInputFormat = i.format;
         const a = (Mu(r, i.format) ? Tu(t) : t).map((c) => {
-          const { tunes: h, id: d, parent: u, content: p } = c, f = c.type, g = ((T) => typeof T == "object" && T !== null)(c.data) ? c.data : {}, m = o.available.has(f) ? {
+          const { tunes: h, id: d, parent: u, content: p } = c, f = c.type, g = ((S) => typeof S == "object" && S !== null)(c.data) ? c.data : {}, m = o.available.has(f) ? {
             tool: f,
             data: g
-          } : (st(`Tool «${f}» is not found. Check 'tools' property at the Blok config.`, "warn"), {
+          } : (ot(`Tool «${f}» is not found. Check 'tools' property at the Blok config.`, "warn"), {
             tool: o.stubTool,
             data: this.composeStubDataForTool(f, g, d)
           });
-          return ((T, L) => {
+          return ((S, L) => {
             try {
               return n.composeBlock({
                 id: d,
-                tool: T,
+                tool: S,
                 data: L,
                 tunes: h,
                 parentId: u,
                 contentIds: p
               });
             } catch (Q) {
-              C(`Block «${T}» skipped because of plugins error`, "error", {
+              C(`Block «${S}» skipped because of plugins error`, "error", {
                 data: L,
                 error: Q
               });
-              const X = this.composeStubDataForTool(T, L, d);
+              const X = this.composeStubDataForTool(S, L, d);
               return n.composeBlock({
                 id: d,
                 tool: o.stubTool,
@@ -15062,7 +15076,7 @@ class Ru extends x {
     } catch (i) {
       this.lastSaveError = i;
       const l = i instanceof Error ? i : new Error(String(i));
-      st("Saving failed due to the Error %o", "error", l);
+      ot("Saving failed due to the Error %o", "error", l);
       return;
     }
   }
@@ -15111,7 +15125,7 @@ class Ru extends x {
         C("Stub block data is malformed and was skipped");
         return;
       }
-      const m = u === void 0 || z(u), v = b !== void 0 && b.length > 0, T = B(B(B({
+      const m = u === void 0 || z(u), v = b !== void 0 && b.length > 0, S = B(B(B({
         id: c,
         type: h,
         data: d
@@ -15122,7 +15136,7 @@ class Ru extends x {
       }), v && {
         content: b
       });
-      e.push(T);
+      e.push(S);
     });
     const o = this.config.dataModel || "auto", n = (a = (l = (i = this.Blok.Renderer) == null ? void 0 : i.getDetectedInputFormat) == null ? void 0 : l.call(i)) != null ? a : "flat", r = Au(o, n) ? Eu(e) : e;
     return {
@@ -15210,10 +15224,10 @@ class ur extends ce {
     const e = !Mt(), o = new ae({
       focusedItemClass: br.focused,
       allowedKeys: [
-        S.TAB,
-        S.UP,
-        S.DOWN,
-        S.ENTER
+        T.TAB,
+        T.UP,
+        T.DOWN,
+        T.ENTER
       ]
     });
     super(
@@ -15592,12 +15606,12 @@ class Pu extends x {
     super(...arguments), this.opened = !1, this.isOpening = !1, this.selection = new w(), this.popover = null, this.flipperInstance = new ae({
       focusedItemClass: br.focused,
       allowedKeys: [
-        S.TAB,
-        S.UP,
-        S.DOWN,
-        S.ENTER,
-        S.RIGHT,
-        S.LEFT
+        T.TAB,
+        T.UP,
+        T.DOWN,
+        T.ENTER,
+        T.RIGHT,
+        T.LEFT
       ]
     }), this.flipperKeydownHandler = null, this.flipperKeydownSource = null, this.close = () => {
       this.opened && (this.opened = !1, this.isOpening = !1, w.isAtBlok || this.selection.restore(), this.selection.clearSaved(), this.detachFlipperKeydownListener(), this.clearBlockSelectionOnClose(), this.eventsDispatcher.emit(this.events.closed), this.popover && (this.popover.off(Ht.Closed, this.onPopoverClose), this.popover.destroy(), this.popover.getElement().remove(), this.popover = null));
@@ -16140,7 +16154,7 @@ class Hu extends yn {
    * @param {string} shortcut - shortcut according to the ShortcutData Module format
    */
   enableShortcutForTool(t, e) {
-    ot.add({
+    nt.add({
       name: e,
       on: this.api.ui.nodes.redactor,
       handler: async (o) => {
@@ -16164,7 +16178,7 @@ class Hu extends yn {
   removeAllShortcuts() {
     this.toolsToBeDisplayed.forEach((t) => {
       const e = t.shortcut;
-      e && ot.remove(this.api.ui.nodes.redactor, e);
+      e && nt.remove(this.api.ui.nodes.redactor, e);
     });
   }
   /**
@@ -16333,10 +16347,10 @@ class Uu {
       this.closeToolbox();
       return;
     }
-    const i = this.hoveredBlockInternal, l = (i == null ? void 0 : i.name) === "paragraph", a = l && ((v = i.pluginsContent.textContent) == null ? void 0 : v.startsWith("/")), c = l && i.isEmpty, h = i !== null ? e.getBlockIndex(i) : e.currentBlockIndex, d = t ? h : h + 1, u = e.blocks.slice(d), p = (T) => {
+    const i = this.hoveredBlockInternal, l = (i == null ? void 0 : i.name) === "paragraph", a = l && ((v = i.pluginsContent.textContent) == null ? void 0 : v.startsWith("/")), c = l && i.isEmpty, h = i !== null ? e.getBlockIndex(i) : e.currentBlockIndex, d = t ? h : h + 1, u = e.blocks.slice(d), p = (S) => {
       var L;
-      return ((L = T.holder.parentElement) == null ? void 0 : L.closest('[data-blok-testid="block-wrapper"]')) !== null;
-    }, f = !t && i && u.length > 0 ? u.findIndex((T) => !p(T)) : 0, b = d + (f === -1 ? u.length : f), g = c || a ? i : e.insertDefaultBlockAtIndex(b, !0);
+      return ((L = S.holder.parentElement) == null ? void 0 : L.closest('[data-blok-testid="block-wrapper"]')) !== null;
+    }, f = !t && i && u.length > 0 ? u.findIndex((S) => !p(S)) : 0, b = d + (f === -1 ? u.length : f), g = c || a ? i : e.insertDefaultBlockAtIndex(b, !0);
     g !== i && p(g) && (i == null || i.holder.after(g.holder)), a ? r.setToBlock(g, r.positions.DEFAULT, 1) : (r.setToBlock(g, r.positions.START), r.insertContentAtCaretPosition("/")), this.moveAndOpenToolbar(g), this.openToolbox();
   }
 }
@@ -16375,11 +16389,11 @@ class zu {
    * @returns the Y position in pixels, or null if calculation is not possible
    */
   calculateToolbarY(t, e) {
-    var T;
+    var S;
     const { targetBlock: o, hoveredTarget: n, isMobile: r } = t;
     if (!o || !e)
       return null;
-    const l = o.holder.getBoundingClientRect(), a = n == null ? void 0 : n.closest('[role="listitem"]'), c = a == null ? void 0 : a.querySelector("[contenteditable]"), h = (T = c != null ? c : a) != null ? T : o.pluginsContent, u = h.getBoundingClientRect().top - l.top, p = window.getComputedStyle(h), f = parseInt(p.paddingTop, 10) || 0, b = parseFloat(p.lineHeight) || 24, g = parseInt(window.getComputedStyle(e).height, 10);
+    const l = o.holder.getBoundingClientRect(), a = n == null ? void 0 : n.closest('[role="listitem"]'), c = a == null ? void 0 : a.querySelector("[contenteditable]"), h = (S = c != null ? c : a) != null ? S : o.pluginsContent, u = h.getBoundingClientRect().top - l.top, p = window.getComputedStyle(h), f = parseInt(p.paddingTop, 10) || 0, b = parseFloat(p.lineHeight) || 24, g = parseInt(window.getComputedStyle(e).height, 10);
     return r ? u - g : u + f + b / 2 - g / 2;
   }
   /**
@@ -16759,21 +16773,23 @@ class Ku extends x {
     const o = t != null ? t : this.Blok.BlockManager.currentBlock;
     if (!o)
       return;
+    this.hoveredBlockIsFromTableCell = o.holder.closest("[data-blok-table-cell-blocks]") !== null;
     const n = this.resolveTableCellBlock(o);
-    this.hoveredBlockIsFromTableCell = n !== o, this.hoveredBlock && this.hoveredBlock !== n && this.hoveredBlock.cleanupDraggable(), this.hoveredBlock = n, this.plusButtonHandler.setHoveredBlock(n), this.settingsTogglerHandler.setHoveredBlock(n), this.positioner.setHoveredTarget(e != null ? e : null), this.positioner.resetCachedPosition();
+    this.hoveredBlock && this.hoveredBlock !== n && this.hoveredBlock.cleanupDraggable(), this.hoveredBlock = n, this.plusButtonHandler.setHoveredBlock(n), this.settingsTogglerHandler.setHoveredBlock(n), this.positioner.setHoveredTarget(e != null ? e : null), this.positioner.resetCachedPosition();
     const { wrapper: r, plusButton: i, settingsToggler: l } = this.nodes;
     if (!r || !i)
       return;
-    this.hoveredBlockIsFromTableCell ? (i.style.display = "none", l && (l.style.display = "none")) : (i.style.display = "", l && (l.style.display = ""));
-    const a = n.holder, { isMobile: c } = this.Blok.UI, h = this.positioner.calculateToolbarY(
-      { targetBlock: n, hoveredTarget: e != null ? e : null, isMobile: c },
+    const a = this.hoveredBlockIsFromTableCell ? "none" : "";
+    i.style.display = a, l && (l.style.display = a);
+    const c = n.holder, { isMobile: h } = this.Blok.UI, d = this.positioner.calculateToolbarY(
+      { targetBlock: n, hoveredTarget: e != null ? e : null, isMobile: h },
       i
     );
-    if (h === null)
+    if (d === null)
       return;
-    this.positioner.moveToY(this.nodes, h), a.appendChild(r), l && !this.Blok.ReadOnly.isEnabled && n.setupDraggable(l, this.Blok.DragManager), this.positioner.applyContentOffset(this.nodes, n);
-    const d = n.getTunes(), u = d.toolTunes.length > 0 || d.commonTunes.length > 0;
-    this.Blok.BlockManager.blocks.length === 1 && n.isEmpty && !u ? this.blockTunesToggler.hide() : this.blockTunesToggler.show(), this.open();
+    this.positioner.moveToY(this.nodes, d), c.appendChild(r), l && !this.Blok.ReadOnly.isEnabled && n.setupDraggable(l, this.Blok.DragManager), this.positioner.applyContentOffset(this.nodes, n);
+    const u = n.getTunes(), p = u.toolTunes.length > 0 || u.commonTunes.length > 0;
+    this.Blok.BlockManager.blocks.length === 1 && n.isEmpty && !p ? this.blockTunesToggler.hide() : this.blockTunesToggler.show(), this.open();
   }
   /**
    * Move Toolbar to the specified block (or first selected block) and open it for multi-block selection.
@@ -16793,18 +16809,15 @@ class Ku extends x {
     this.toolboxInstance.opened && this.toolboxInstance.close(), this.explicitlyClosed = !1;
     const o = t != null ? t : e[0];
     this.hoveredBlock && this.hoveredBlock !== o && this.hoveredBlock.cleanupDraggable(), this.hoveredBlock = o, this.plusButtonHandler.setHoveredBlock(o), this.settingsTogglerHandler.setHoveredBlock(o), this.positioner.setHoveredTarget(null), this.positioner.resetCachedPosition();
-    const { wrapper: n, plusButton: r } = this.nodes;
+    const { wrapper: n, plusButton: r, settingsToggler: i } = this.nodes;
     if (!n || !r)
       return;
-    const i = o.holder, l = this.positioner.calculateToolbarY(
+    r.style.display = "", i && (i.style.display = "");
+    const l = o.holder, a = this.positioner.calculateToolbarY(
       { targetBlock: o, hoveredTarget: null, isMobile: !1 },
       r
     );
-    if (l === null)
-      return;
-    this.positioner.moveToY(this.nodes, l), i.appendChild(n);
-    const { settingsToggler: a } = this.nodes;
-    a && !this.Blok.ReadOnly.isEnabled && o.setupDraggable(a, this.Blok.DragManager), this.positioner.applyContentOffset(this.nodes, o), this.blockTunesToggler.show(), this.open();
+    a !== null && (this.positioner.moveToY(this.nodes, a), l.appendChild(n), i && !this.Blok.ReadOnly.isEnabled && o.setupDraggable(i, this.Blok.DragManager), this.positioner.applyContentOffset(this.nodes, o), this.blockTunesToggler.show(), this.open());
   }
   /**
    * Close the Toolbar
@@ -17349,7 +17362,7 @@ class tp {
    */
   destroy() {
     for (const [, t] of this.registeredShortcuts.entries())
-      ot.remove(document, t);
+      nt.remove(document, t);
     this.registeredShortcuts.clear(), this.shortcutsRegistered = !1;
   }
   /**
@@ -17380,7 +17393,7 @@ class tp {
    */
   enableShortcuts(t, e) {
     const o = this.registeredShortcuts.get(t);
-    o !== e && (this.isShortcutTakenByAnotherTool(t, e) || (o !== void 0 && (ot.remove(document, o), this.registeredShortcuts.delete(t)), ot.add({
+    o !== e && (this.isShortcutTakenByAnotherTool(t, e) || (o !== void 0 && (nt.remove(document, o), this.registeredShortcuts.delete(t)), nt.add({
       name: e,
       handler: (n) => {
         const { BlockManager: r } = this.getBlok(), { currentBlock: i } = r;
@@ -17587,7 +17600,7 @@ class op extends x {
    * Shows Inline Toolbar
    */
   async open() {
-    var i, l, a, c, h, d, u, p, f, b, g, m, v, T, L, Q, X, St, rs, is, ls;
+    var i, l, a, c, h, d, u, p, f, b, g, m, v, S, L, Q, X, St, rs, is, ls;
     if (this.opened || (this.initialize(), this.opened = !0, this.popover && ((l = (i = this.popover).hide) == null || l.call(i), (c = (a = this.popover).destroy) == null || c.call(a), this.popover = null), this.createToolsInstances(), !this.nodes.wrapper))
       return;
     this.nodes.wrapper.innerHTML = "";
@@ -17600,7 +17613,7 @@ class op extends x {
         search: this.Blok.I18n.t("popover.search")
       }
     });
-    const o = (T = (g = (b = this.popover).getMountElement) == null ? void 0 : g.call(b)) != null ? T : (v = (m = this.popover).getElement) == null ? void 0 : v.call(m), n = (Q = (L = this.popover).getElement) == null ? void 0 : Q.call(L), r = (rs = (St = (X = this.popover.size) == null ? void 0 : X.width) != null ? St : n == null ? void 0 : n.getBoundingClientRect().width) != null ? rs : 0;
+    const o = (S = (g = (b = this.popover).getMountElement) == null ? void 0 : g.call(b)) != null ? S : (v = (m = this.popover).getElement) == null ? void 0 : v.call(m), n = (Q = (L = this.popover).getElement) == null ? void 0 : Q.call(L), r = (rs = (St = (X = this.popover.size) == null ? void 0 : X.width) != null ? St : n == null ? void 0 : n.getBoundingClientRect().width) != null ? rs : 0;
     this.applyPosition(r), o && this.nodes.wrapper && this.nodes.wrapper.appendChild(o), (ls = (is = this.popover).show) == null || ls.call(is);
   }
   /**
@@ -19436,9 +19449,9 @@ const Sp = Ke(), ie = class ie {
         save: "save"
       }
     }).forEach(([g, m]) => {
-      Object.entries(m).forEach(([v, T]) => {
+      Object.entries(m).forEach(([v, S]) => {
         const L = g, Q = t.moduleInstances.API.methods[L];
-        this[T] = Q[v];
+        this[S] = Q[v];
       });
     });
     const b = t.moduleInstances.API.methods.ui;

package/dist/chunks/{i18next-loader-D-sjerXt.mjs → i18next-loader-DjR4d8M7.mjs}

@@ -1,4 +1,4 @@
-import { e as i } from "./blok-Bjkxis7j.mjs";
+import { e as i } from "./blok-Bn6Q_o8h.mjs";
 const l = async (e, r) => {
   const n = (await import("./i18next-CugVlwWp.mjs")).default.createInstance(), s = {
     lng: e,

package/dist/chunks/{index-CJfN4Vuv.mjs → index-oe38cp86.mjs}

@@ -1,4 +1,4 @@
-import { a2 as s, t as f } from "./inline-tool-convert-5DE7c2fi.mjs";
+import { a2 as s, t as f } from "./inline-tool-convert-SRTkyaZn.mjs";
 const a = {
   wrapper: s(
     "fixed z-[2] bottom-5 left-5",

package/dist/chunks/{inline-tool-convert-5DE7c2fi.mjs → inline-tool-convert-SRTkyaZn.mjs}

@@ -278,7 +278,7 @@ const d = {
   DELETE: 46
 }, Ae = {
   LEFT: 0
-}, Se = 650, Wt = () => "0.6.0-beta.7";
+}, Se = 650, Wt = () => "0.6.0-beta.9";
 var Vt = /* @__PURE__ */ ((n) => (n.VERBOSE = "VERBOSE", n.INFO = "INFO", n.WARN = "WARN", n.ERROR = "ERROR", n))(Vt || {});
 const V = (n, t, e = "log", o, s = "color: inherit") => {
   const i = typeof console == "undefined" ? void 0 : console;

package/dist/full.mjs

@@ -12,8 +12,8 @@ var e = (a, l, o) => l in a ? n(a, l, { enumerable: !0, configurable: !0, writab
 }, r = (a, l) => t(a, c(l));
 import { Link as p, Italic as f, Bold as I, List as k, Header as u, Paragraph as B } from "./tools.mjs";
 import { defaultBlockTools as v, defaultInlineTools as A } from "./tools.mjs";
-import { B as H, v as P } from "./chunks/blok-Bjkxis7j.mjs";
-import { D as _ } from "./chunks/inline-tool-convert-5DE7c2fi.mjs";
+import { B as H, v as P } from "./chunks/blok-Bn6Q_o8h.mjs";
+import { D as _ } from "./chunks/inline-tool-convert-SRTkyaZn.mjs";
 const m = {
   paragraph: {
     class: B,

package/dist/tools.mjs

@@ -10,8 +10,8 @@ var Tt = (i, t, e) => t in i ? ke(i, t, { enumerable: !0, configurable: !0, writ
       Le.call(t, e) && Tt(i, e, t[e]);
   return i;
 }, tt = (i, t) => xe(i, Te(t));
-import { t as v, D as E, am as Be, an as Ie, _ as Ne, ao as De, ap as He, aq as Pe, ar as _e, as as Oe, at as Me, au as Qt, av as te, aw as ee, o as We, p as Rt, a5 as Lt, a3 as $e, ax as Ge, J as ne, Q as se, P as F, ay as qe, az as Fe, a0 as oe, aA as ze, aB as Ve, aC as Ue, aD as Ke, aE as je, z as H, aF as Xe, aG as Ye, S as et, aH as Ze, l as Je, a8 as Qe } from "./chunks/inline-tool-convert-5DE7c2fi.mjs";
-import { ab as xo } from "./chunks/inline-tool-convert-5DE7c2fi.mjs";
+import { t as v, D as E, am as Be, an as Ie, _ as Ne, ao as De, ap as Pe, aq as He, ar as _e, as as Oe, at as Me, au as Qt, av as te, aw as ee, o as We, p as Rt, a5 as Lt, a3 as $e, ax as Ge, J as ne, Q as se, P as F, ay as qe, az as Fe, a0 as oe, aA as ze, aB as Ve, aC as Ue, aD as Ke, aE as je, z as P, aF as Xe, aG as Ye, S as et, aH as Ze, l as Je, a8 as Qe } from "./chunks/inline-tool-convert-SRTkyaZn.mjs";
+import { ab as xo } from "./chunks/inline-tool-convert-SRTkyaZn.mjs";
 const ie = (i) => {
   if (!i || !i.includes("data-blok-fake-background"))
     return i;
@@ -194,7 +194,11 @@ const ie = (i) => {
   static get sanitize() {
     return {
       text: {
-        br: !0
+        br: !0,
+        img: {
+          src: !0,
+          style: !0
+        }
       }
     };
   }
@@ -550,8 +554,8 @@ const O = class O {
 };
 O.BASE_STYLES = "py-[3px] px-[2px] m-0 !leading-[1.3] outline-none [&_p]:!p-0 [&_p]:!m-0 [&_div]:!p-0 [&_div]:!m-0", O.DEFAULT_LEVELS = [
   { number: 1, tag: "H1", nameKey: "tools.header.heading1", name: "Heading 1", icon: De, styles: "text-4xl font-bold mt-8 mb-1" },
-  { number: 2, tag: "H2", nameKey: "tools.header.heading2", name: "Heading 2", icon: He, styles: "text-3xl font-semibold mt-6 mb-px" },
-  { number: 3, tag: "H3", nameKey: "tools.header.heading3", name: "Heading 3", icon: Pe, styles: "text-2xl font-semibold mt-4 mb-px" },
+  { number: 2, tag: "H2", nameKey: "tools.header.heading2", name: "Heading 2", icon: Pe, styles: "text-3xl font-semibold mt-6 mb-px" },
+  { number: 3, tag: "H3", nameKey: "tools.header.heading3", name: "Heading 3", icon: He, styles: "text-2xl font-semibold mt-4 mb-px" },
   { number: 4, tag: "H4", nameKey: "tools.header.heading4", name: "Heading 4", icon: _e, styles: "text-xl font-semibold mt-3 mb-px" },
   { number: 5, tag: "H5", nameKey: "tools.header.heading5", name: "Heading 5", icon: Oe, styles: "text-base font-semibold mt-3 mb-px" },
   { number: 6, tag: "H6", nameKey: "tools.header.heading6", name: "Heading 6", icon: Me, styles: "text-sm font-semibold mt-3 mb-px" }
@@ -728,7 +732,7 @@ const z = 24, rn = "outline-none py-[3px] mt-[2px] mb-px", ln = "outline-none pl
     return !1;
   const e = Object.entries(i).find(([n]) => n === "items");
   return e === void 0 ? !1 : Array.isArray(e[1]);
-}, Ln = (i) => typeof i == "object" && i !== null, Bn = (i) => typeof i == "string" ? i : "", In = (i, t) => i === "unordered" || i === "ordered" || i === "checklist" ? i : t, Nn = (i) => !!i, Dn = (i, t) => typeof i == "number" ? i : t, Hn = (i, t) => {
+}, Ln = (i) => typeof i == "object" && i !== null, Bn = (i) => typeof i == "string" ? i : "", In = (i, t) => i === "unordered" || i === "ordered" || i === "checklist" ? i : t, Nn = (i) => !!i, Dn = (i, t) => typeof i == "number" ? i : t, Pn = (i, t) => {
   const e = t.defaultStyle || "unordered";
   if (!i || typeof i != "object")
     return {
@@ -822,7 +826,7 @@ class ce {
     return n ? Math.round(parseInt(n[1], 10) / z) : 0;
   }
 }
-const Pn = (i, t) => {
+const Hn = (i, t) => {
   if (!i) return null;
   if (t === "checklist") {
     const n = i.querySelector("[contenteditable]");
@@ -849,7 +853,7 @@ const Pn = (i, t) => {
     n.style
   );
   return l === null ? 1 : o.getBlockStartValue(l);
-}, Ht = (i, t, e, n, s, o) => {
+}, Pt = (i, t, e, n, s, o) => {
   const l = Mn(i, t, n, e, s, o) + i;
   return o.formatNumber(l, t);
 }, Wn = (i, t, e, n) => n.findGroupStart(i, t, e), ue = (i, t, e, n) => {
@@ -1412,7 +1416,7 @@ const Yn = (i) => i instanceof HTMLElement, Zn = /* @__PURE__ */ new Set([
     style: "unordered",
     checked: !1
   })
-}), Pt = [
+}), Ht = [
   {
     name: "bulletedList",
     titleKey: "bulletedList",
@@ -1471,11 +1475,11 @@ class vo {
     return typeof t == "object" && t !== null && "event" in t && typeof t.event == "object" && t.event !== null && "type" in t.event && typeof t.event.type == "string";
   }
   normalizeData(t) {
-    return Hn(t, this._settings);
+    return Pn(t, this._settings);
   }
   get availableStyles() {
     const t = this._settings.styles;
-    return !t || t.length === 0 ? Pt : Pt.filter((e) => t.includes(e.style));
+    return !t || t.length === 0 ? Ht : Ht.filter((e) => t.includes(e.style));
   }
   get itemColor() {
     return this._settings.itemColor;
@@ -1535,7 +1539,7 @@ class vo {
     const t = (o = this._element) == null ? void 0 : o.querySelector("[data-list-marker]");
     if (!t)
       return;
-    const e = this.getDepth(), n = Dt(this.blockId, e, this._data.style, this.api.blocks, this.markerCalculator), s = Ht(n, e, this._data, this.blockId, this.api.blocks, this.markerCalculator);
+    const e = this.getDepth(), n = Dt(this.blockId, e, this._data.style, this.api.blocks, this.markerCalculator), s = Pt(n, e, this._data, this.blockId, this.api.blocks, this.markerCalculator);
     t.textContent = s;
   }
   updateSiblingListMarkers() {
@@ -1548,7 +1552,7 @@ class vo {
     const n = (s = this._element) == null ? void 0 : s.querySelector('[aria-hidden="true"]');
     if (n instanceof HTMLElement)
       if (e === "ordered") {
-        const o = Dt(this.blockId, t, this._data.style, this.api.blocks, this.markerCalculator), r = Ht(o, t, this._data, this.blockId, this.api.blocks, this.markerCalculator);
+        const o = Dt(this.blockId, t, this._data.style, this.api.blocks, this.markerCalculator), r = Pt(o, t, this._data, this.blockId, this.api.blocks, this.markerCalculator);
         n.textContent = r;
       } else {
         const o = On(t, this.markerCalculator);
@@ -1638,7 +1642,7 @@ class vo {
     e instanceof HTMLInputElement && (this._data.checked = e.checked);
   }
   getContentElement() {
-    return Pn(this._element, this._data.style);
+    return Hn(this._element, this._data.style);
   }
   renderSettings() {
     return vn(this.availableStyles, this._data.style, this.api.i18n.t, (t) => this.setStyle(t));
@@ -1886,7 +1890,7 @@ class ds {
     e && (e.setAttribute("width", $t), e.setAttribute("height", $t), e.setAttribute("viewBox", "0 0 24 24"), e.classList.add("text-gray-500", "pointer-events-none"));
   }
 }
-const g = "data-blok-table-row", u = "data-blok-table-cell", P = 1, nt = `${P}px solid #d1d5db`, hs = [
+const g = "data-blok-table-row", u = "data-blok-table-cell", H = 1, nt = `${H}px solid #d1d5db`, hs = [
   "flex"
 ], us = [
   "py-1",
@@ -2189,7 +2193,7 @@ class fs {
         return;
       const d = c.getAttribute("data-blok-id");
       d && this.api.caret.setToBlock(d, "end");
-    }, this.api = t.api, this.gridElement = t.gridElement, this.onNavigateToCell = t.onNavigateToCell, this.api.events.on("block changed", this.handleBlockMutation), this.gridElement.addEventListener("click", this.handleCellBlankSpaceClick);
+    }, this.api = t.api, this.gridElement = t.gridElement, this.tableBlockId = t.tableBlockId, this.onNavigateToCell = t.onNavigateToCell, this.api.events.on("block changed", this.handleBlockMutation), this.gridElement.addEventListener("click", this.handleCellBlankSpaceClick);
   }
   /**
    * Get the currently active cell that contains blocks
@@ -2314,7 +2318,7 @@ class fs {
           a.push({ blocks: f });
         else {
           const m = typeof c == "string" ? c : "", C = this.api.blocks.insert("paragraph", { text: m }, {}, this.api.blocks.getBlocksCount(), !1);
-          p.appendChild(C.holder), a.push({ blocks: [C.id] });
+          p.appendChild(C.holder), this.api.blocks.setBlockParent(C.id, this.tableBlockId), a.push({ blocks: [C.id] });
         }
         this.stripPlaceholders(p);
       }), n.push(a);
@@ -2342,7 +2346,7 @@ class fs {
       if (o === void 0)
         continue;
       const r = this.api.blocks.getBlockByIndex(o);
-      r && (t.appendChild(r.holder), n.push(s));
+      r && (t.appendChild(r.holder), this.api.blocks.setBlockParent(s, this.tableBlockId), n.push(s));
     }
     return n;
   }
@@ -2357,7 +2361,7 @@ class fs {
     if (s === void 0)
       return;
     const o = this.api.blocks.getBlockByIndex(s);
-    o && (n.appendChild(o.holder), this.stripPlaceholders(n));
+    o && (n.appendChild(o.holder), this.api.blocks.setBlockParent(e, this.tableBlockId), this.stripPlaceholders(n));
   }
   /**
    * Given a new block's index, find which cell it should belong to
@@ -2386,7 +2390,7 @@ class fs {
     if (!e || e.querySelector("[data-blok-id]") !== null)
       return;
     const s = this.api.blocks.insert("paragraph", { text: "" }, {}, this.api.blocks.getBlocksCount(), !0);
-    e.appendChild(s.holder), this.stripPlaceholders(e);
+    e.appendChild(s.holder), this.api.blocks.setBlockParent(s.id, this.tableBlockId), this.stripPlaceholders(e);
   }
   /**
    * If the removed block's holder is currently inside a cell of this table,
@@ -2714,7 +2718,7 @@ const U = (i) => {
   );
 }, ct = (i, t) => {
   const e = t.reduce((o, r) => o + r, 0), n = i;
-  n.style.width = `${e + P}px`, i.querySelectorAll(`[${g}]`).forEach((o) => {
+  n.style.width = `${e + H}px`, i.querySelectorAll(`[${g}]`).forEach((o) => {
     o.querySelectorAll(`[${u}]`).forEach((l, a) => {
       if (a < t.length) {
         const c = l;
@@ -2785,7 +2789,7 @@ const U = (i) => {
     return [];
   const s = i.querySelectorAll(`[${g}]`)[e];
   return s ? (o = t == null ? void 0 : t.getBlockIdsFromCells(s.querySelectorAll(`[${u}]`))) != null ? o : [] : [];
-}, Hs = (i, t, e) => {
+}, Ps = (i, t, e) => {
   var o;
   if (!i)
     return [];
@@ -2814,7 +2818,7 @@ const U = (i) => {
   i.querySelectorAll(`[${u}]`).forEach((n) => {
     t == null || t.ensureCellHasBlock(n);
   });
-}, Ps = (i, t, e) => {
+}, Hs = (i, t, e) => {
   const n = i.querySelectorAll(`[${g}]`);
   t.forEach((s, o) => {
     const r = n[o];
@@ -2929,7 +2933,7 @@ class Gs {
   }
   createHandle(t) {
     const e = document.createElement("div"), n = this.getHandleLeftPx(t);
-    return e.setAttribute(Ft, ""), e.setAttribute("data-col", String(t)), e.style.position = "absolute", e.style.top = `-${P}px`, e.style.bottom = "0px", e.style.width = `${Ct}px`, e.style.left = `${n - Ct / 2}px`, e.style.cursor = "col-resize", e.style.zIndex = "2", e.style.background = "linear-gradient(to right, transparent 7px, #3b82f6 7px, #3b82f6 9px, transparent 9px)", e.style.opacity = "0", e.style.transition = "opacity 150ms ease", e.setAttribute("contenteditable", "false"), e.addEventListener("mouseenter", () => {
+    return e.setAttribute(Ft, ""), e.setAttribute("data-col", String(t)), e.style.position = "absolute", e.style.top = `-${H}px`, e.style.bottom = "0px", e.style.width = `${Ct}px`, e.style.left = `${n - Ct / 2}px`, e.style.cursor = "col-resize", e.style.zIndex = "2", e.style.background = "linear-gradient(to right, transparent 7px, #3b82f6 7px, #3b82f6 9px, transparent 9px)", e.style.opacity = "0", e.style.transition = "opacity 150ms ease", e.setAttribute("contenteditable", "false"), e.addEventListener("mouseenter", () => {
       this.isDragging || (e.style.opacity = "1");
     }), e.addEventListener("mouseleave", () => {
       this.isDragging || (e.style.opacity = "0");
@@ -2971,7 +2975,7 @@ class Gs {
   }
   applyWidths() {
     const t = this.colWidths.reduce((n, s) => n + s, 0);
-    this.gridEl.style.width = `${t + P}px`, this.gridEl.querySelectorAll(`[${Ws}]`).forEach((n) => {
+    this.gridEl.style.width = `${t + H}px`, this.gridEl.querySelectorAll(`[${Ws}]`).forEach((n) => {
       n.querySelectorAll(`[${Ms}]`).forEach((o, r) => {
         if (r < this.colWidths.length) {
           const l = o;
@@ -3138,10 +3142,10 @@ class js {
     this.dropIndicator = document.createElement("div");
     const t = this.dropIndicator.style;
     if (t.position = "absolute", t.backgroundColor = "#3b82f6", t.borderRadius = "1.5px", t.zIndex = "5", t.pointerEvents = "none", this.dropIndicator.setAttribute("contenteditable", "false"), this.dragType === "row")
-      t.height = "3px", t.left = `${-P}px`, t.right = "0", t.transition = "top 100ms ease";
+      t.height = "3px", t.left = `${-H}px`, t.right = "0", t.transition = "top 100ms ease";
     else {
       const e = this.grid.querySelectorAll(`[${g}]`), n = e[e.length - 1], s = n ? n.offsetTop + n.offsetHeight : 0;
-      t.width = "3px", t.top = `${-P}px`, t.height = `${s + P}px`, t.transition = "left 100ms ease";
+      t.width = "3px", t.top = `${-H}px`, t.height = `${s + H}px`, t.transition = "left 100ms ease";
     }
     this.grid.appendChild(this.dropIndicator);
   }
@@ -3530,12 +3534,12 @@ class ao {
       if (o + 1 >= n.length)
         return;
       const r = (n[o] + n[o + 1]) / 2, l = s.style;
-      l.top = `${-P / 2}px`, l.left = `${r}px`;
+      l.top = `${-H / 2}px`, l.left = `${r}px`;
     }), this.rowGrips.forEach((s, o) => {
       if (o >= t.length)
         return;
       const r = t[o], l = r.offsetTop + r.offsetHeight / 2, a = s.style;
-      a.left = `${-P / 2}px`, a.top = `${l}px`;
+      a.left = `${-H / 2}px`, a.top = `${l}px`;
     });
   }
   /**
@@ -3745,7 +3749,7 @@ class So {
     const t = this.element.firstElementChild;
     if (t) {
       if (this.readOnly) {
-        Ps(t, this.data.content, this.api);
+        Hs(t, this.data.content, this.api);
         return;
       }
       if (this.data.content = (n = (e = this.cellBlocks) == null ? void 0 : e.initializeCells(this.data.content)) != null ? n : this.data.content, this.isNewTable && G(t, this.cellBlocks), this.data.initialColWidth === void 0) {
@@ -3810,7 +3814,7 @@ class So {
     return Ds(this.element, this.cellBlocks, t);
   }
   getBlockIdsInColumn(t) {
-    return Hs(this.element, this.cellBlocks, t);
+    return Ps(this.element, this.cellBlocks, t);
   }
   initAddControls(t) {
     var n;
@@ -4140,7 +4144,7 @@ const q = (i) => {
    */
   synchronize(t) {
     var r, l;
-    const e = (r = t == null ? void 0 : t.anchorNode) != null ? r : t == null ? void 0 : t.focusNode, n = e && e.nodeType === Node.ELEMENT_NODE ? e : e == null ? void 0 : e.parentElement, s = (l = n == null ? void 0 : n.closest(H(E.editor))) != null ? l : n == null ? void 0 : n.ownerDocument;
+    const e = (r = t == null ? void 0 : t.anchorNode) != null ? r : t == null ? void 0 : t.focusNode, n = e && e.nodeType === Node.ELEMENT_NODE ? e : e == null ? void 0 : e.parentElement, s = (l = n == null ? void 0 : n.closest(P(E.editor))) != null ? l : n == null ? void 0 : n.ownerDocument;
     if (!s)
       return;
     const o = `strong[${S.COLLAPSED_ACTIVE}="true"]`;
@@ -4178,7 +4182,7 @@ const q = (i) => {
     const e = (r = t == null ? void 0 : t.anchorNode) != null ? r : t == null ? void 0 : t.focusNode;
     if (!e)
       return;
-    const n = e.nodeType === Node.ELEMENT_NODE ? e : e.parentElement, s = n == null ? void 0 : n.closest(H(E.editor));
+    const n = e.nodeType === Node.ELEMENT_NODE ? e : e.parentElement, s = n == null ? void 0 : n.closest(P(E.editor));
     if (!s)
       return;
     s.querySelectorAll(`strong[${S.COLLAPSED_LENGTH}]`).forEach((l) => {
@@ -4513,8 +4517,8 @@ class R {
     const n = e.nodeType === Node.ELEMENT_NODE ? e : e.parentElement;
     if (!n)
       return null;
-    const s = (l = n.closest('[data-blok-component="paragraph"]')) != null ? l : n.closest(H(E.elementContent));
-    return s || n.closest(H(E.editor));
+    const s = (l = n.closest('[data-blok-component="paragraph"]')) != null ? l : n.closest(P(E.elementContent));
+    return s || n.closest(P(E.editor));
   }
 }
 const T = class T {
@@ -4921,7 +4925,7 @@ const Co = (i, t) => {
     const t = window.getSelection();
     if (!t)
       return;
-    const e = t.anchorNode, n = (e == null ? void 0 : e.nodeType) === Node.ELEMENT_NODE ? e : e == null ? void 0 : e.parentElement, s = n == null ? void 0 : n.closest(H(E.editor));
+    const e = t.anchorNode, n = (e == null ? void 0 : e.nodeType) === Node.ELEMENT_NODE ? e : e == null ? void 0 : e.parentElement, s = n == null ? void 0 : n.closest(P(E.editor));
     if (!s)
       return;
     const o = s.querySelector("[data-blok-testid=inline-toolbar]");
@@ -4976,7 +4980,7 @@ const Co = (i, t) => {
    */
   static findBlokScopeFromNode(t) {
     const e = t.nodeType === Node.ELEMENT_NODE ? t : t.parentElement;
-    return !e || typeof e.closest != "function" ? null : e.closest(`${H(E.interface)}, ${H(E.editor)}`);
+    return !e || typeof e.closest != "function" ? null : e.closest(`${P(E.interface)}, ${P(E.editor)}`);
   }
   /**
    * Get a bold element at the boundary of a collapsed range
@@ -5020,7 +5024,7 @@ const Co = (i, t) => {
     if (!e)
       return !1;
     const n = e.nodeType === Node.ELEMENT_NODE ? e : e.parentElement;
-    return !!(n != null && n.closest(H(E.editor)));
+    return !!(n != null && n.closest(P(E.editor)));
   }
   /**
    * Get HTML content of a range with bold tags removed
@@ -5366,7 +5370,7 @@ const j = class j {
    */
   getButtonElement() {
     const t = document.querySelector(
-      `${H(E.interface, Qe)} [data-blok-item-name="link"]`
+      `${P(E.interface, Qe)} [data-blok-item-name="link"]`
     );
     return t && t !== this.nodes.button && (t.addEventListener("click", this.handleButtonClick, !0), this.nodes.button = t), t;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jackuait/blok",
-  "version": "0.6.0-beta.7",
+  "version": "0.6.0-beta.9",
   "description": "Blok — headless, highly extensible rich text editor built for developers who need to implement a block-based editing experience (similar to Notion) without building it from scratch",
   "module": "dist/blok.mjs",
   "types": "./types/index.d.ts",

package/src/components/modules/api/blocks.ts

@@ -38,6 +38,7 @@ export class BlocksAPI extends Module {
       update: this.update,
       composeBlockData: this.composeBlockData,
       convert: this.convert,
+      setBlockParent: (blockId: string, parentId: string | null): void => this.setBlockParent(blockId, parentId),
       stopBlockMutationWatching: (index: number): void => this.stopBlockMutationWatching(index),
       splitBlock: this.splitBlock,
     };
@@ -376,6 +377,23 @@ export class BlocksAPI extends Module {
     return blocksToInsert.map((block) => new BlockAPI(block));
   };
 
+  /**
+   * Sets the parent of a block, updating both the block's parentId and the parent's contentIds.
+   * @param blockId - id of the block to reparent
+   * @param parentId - id of the new parent block, or null for root level
+   */
+  private setBlockParent(blockId: string, parentId: string | null): void {
+    const block = this.Blok.BlockManager.getBlockById(blockId);
+
+    if (block === undefined) {
+      logLabeled('There is no block with id `' + blockId + '`', 'warn');
+
+      return;
+    }
+
+    this.Blok.BlockManager.setBlockParent(block, parentId);
+  }
+
   /**
    * Stops mutation watching on a block at the specified index.
    * This is used to prevent spurious block-changed events during block replacement.

package/src/components/modules/rectangleSelection.ts

@@ -143,11 +143,10 @@ export class RectangleSelection extends Module {
      * Check if pointer is within the content area's horizontal bounds.
      * This determines whether we should close the toolbar when starting selection.
      * Clicks outside the content area (to the left or right, in the margin/toolbar zone)
-     * should NOT close the toolbar. Use the first block's content element for bounds,
-     * falling back to the redactor bounds if no content element exists.
+     * should NOT close the toolbar. Uses UI.contentRect which queries the first block's
+     * content element and caches the result.
      */
-    const contentElement = redactor.querySelector('[data-blok-testid="block-content"]');
-    const contentRect = contentElement ? contentElement.getBoundingClientRect() : editorRect;
+    const contentRect = this.Blok.UI.contentRect;
     const withinEditorHorizontally = pointerX >= contentRect.left && pointerX <= contentRect.right;
 
     const elemWhereSelectionStart = document.elementFromPoint(pageX - scrollLeft, pointerY);

package/src/components/modules/toolbar/index.ts

@@ -335,14 +335,14 @@ export class Toolbar extends Module<ToolbarNodes> {
       return;
     }
 
-    const targetBlock = this.resolveTableCellBlock(unresolvedBlock);
-
     /**
-     * Track whether the original block was inside a table cell.
-     * When true, the toolbar suppresses plus button and settings toggler,
-     * and the toolbox uses the original current block for cell detection.
+     * Track whether the original block is inside a table cell.
+     * Check the DOM directly rather than relying on resolution success,
+     * so that the flag is correct even when resolution falls back to the original block.
      */
-    this.hoveredBlockIsFromTableCell = targetBlock !== unresolvedBlock;
+    this.hoveredBlockIsFromTableCell = unresolvedBlock.holder.closest('[data-blok-table-cell-blocks]') !== null;
+
+    const targetBlock = this.resolveTableCellBlock(unresolvedBlock);
 
     /** Clean up draggable on previous block if any */
     if (this.hoveredBlock && this.hoveredBlock !== targetBlock) {
@@ -366,18 +366,12 @@ export class Toolbar extends Module<ToolbarNodes> {
      * The toolbar still positions itself for toolbox/slash-search purposes,
      * but plus button and settings toggler remain hidden.
      */
-    if (this.hoveredBlockIsFromTableCell) {
-      plusButton.style.display = 'none';
+    const displayValue = this.hoveredBlockIsFromTableCell ? 'none' : '';
 
-      if (settingsToggler) {
-        settingsToggler.style.display = 'none';
-      }
-    } else {
-      plusButton.style.display = '';
+    plusButton.style.display = displayValue;
 
-      if (settingsToggler) {
-        settingsToggler.style.display = '';
-      }
+    if (settingsToggler) {
+      settingsToggler.style.display = displayValue;
     }
 
     const targetBlockHolder = targetBlock.holder;
@@ -485,12 +479,22 @@ export class Toolbar extends Module<ToolbarNodes> {
     this.positioner.setHoveredTarget(null); // No target for multi-block selection
     this.positioner.resetCachedPosition(); // Reset cached position when moving to a new block
 
-    const { wrapper, plusButton } = this.nodes;
+    const { wrapper, plusButton, settingsToggler } = this.nodes;
 
     if (!wrapper || !plusButton) {
       return;
     }
 
+    /**
+     * Restore plus button and settings toggler visibility for multi-block selection,
+     * in case they were hidden for table cell blocks.
+     */
+    plusButton.style.display = '';
+
+    if (settingsToggler) {
+      settingsToggler.style.display = '';
+    }
+
     const targetBlockHolder = targetBlock.holder;
 
     const toolbarY = this.positioner.calculateToolbarY(
@@ -505,9 +509,6 @@ export class Toolbar extends Module<ToolbarNodes> {
     this.positioner.moveToY(this.nodes, toolbarY);
     targetBlockHolder.appendChild(wrapper);
 
-    /** Set up draggable on the target block using the settings toggler as drag handle */
-    const { settingsToggler } = this.nodes;
-
     if (settingsToggler && !this.Blok.ReadOnly.isEnabled) {
       targetBlock.setupDraggable(settingsToggler, this.Blok.DragManager);
     }

package/src/tools/paragraph/index.ts

@@ -13,7 +13,7 @@ import type {
   PasteEvent,
   ToolboxConfig,
   ConversionConfig,
-  SanitizerConfig,
+  ToolSanitizerConfig,
   PasteConfig,
 } from '../../../types';
 import { DATA_ATTR } from '../../components/constants';
@@ -369,10 +369,14 @@ export class Paragraph implements BlockTool {
    *
    * @returns SanitizerConfig
    */
-  public static get sanitize(): SanitizerConfig {
+  public static get sanitize(): ToolSanitizerConfig {
     return {
       text: {
         br: true,
+        img: {
+          src: true,
+          style: true,
+        },
       },
     };
   }

package/src/tools/table/table-cell-blocks.ts

@@ -45,6 +45,7 @@ interface TableCellBlocksOptions {
 export class TableCellBlocks {
   private api: API;
   private gridElement: HTMLElement;
+  private tableBlockId: string;
   private _activeCellWithBlocks: CellPosition | null = null;
   private onNavigateToCell?: CellNavigationCallback;
 
@@ -68,6 +69,7 @@ export class TableCellBlocks {
   constructor(options: TableCellBlocksOptions) {
     this.api = options.api;
     this.gridElement = options.gridElement;
+    this.tableBlockId = options.tableBlockId;
     this.onNavigateToCell = options.onNavigateToCell;
 
     this.api.events.on('block changed', this.handleBlockMutation);
@@ -269,6 +271,7 @@ export class TableCellBlocks {
           const block = this.api.blocks.insert('paragraph', { text }, {}, this.api.blocks.getBlocksCount(), false);
 
           container.appendChild(block.holder);
+          this.api.blocks.setBlockParent(block.id, this.tableBlockId);
           normalizedRow.push({ blocks: [block.id] });
         }
 
@@ -315,6 +318,7 @@ export class TableCellBlocks {
       }
 
       container.appendChild(block.holder);
+      this.api.blocks.setBlockParent(blockId, this.tableBlockId);
       mountedIds.push(blockId);
     }
 
@@ -344,6 +348,7 @@ export class TableCellBlocks {
     }
 
     container.appendChild(block.holder);
+    this.api.blocks.setBlockParent(blockId, this.tableBlockId);
     this.stripPlaceholders(container);
   }
 
@@ -402,6 +407,7 @@ export class TableCellBlocks {
     const block = this.api.blocks.insert('paragraph', { text: '' }, {}, this.api.blocks.getBlocksCount(), true);
 
     container.appendChild(block.holder);
+    this.api.blocks.setBlockParent(block.id, this.tableBlockId);
     this.stripPlaceholders(container);
   }
 

package/types/api/blocks.d.ts

@@ -78,6 +78,14 @@ export interface Blocks {
    */
   getChildren(parentId: string): BlockAPI[];
 
+  /**
+   * Sets the parent of a block, updating both the block's parentId and the parent's contentIds.
+   *
+   * @param blockId - id of the block to reparent
+   * @param parentId - id of the new parent block, or null for root level
+   */
+  setBlockParent(blockId: string, parentId: string | null): void;
+
   /**
    * Returns Blocks count
    * @return {number}