@jackuait/blok 0.6.0-beta.13 → 0.6.0-beta.14

package/dist/tools.mjs

@@ -1,18 +1,18 @@
-var Ee = Object.defineProperty, xe = Object.defineProperties;
-var Te = Object.getOwnPropertyDescriptors;
-var At = Object.getOwnPropertySymbols;
-var Be = Object.prototype.hasOwnProperty, Re = Object.prototype.propertyIsEnumerable;
-var Et = (r, t, e) => t in r ? Ee(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e, E = (r, t) => {
+var Le = Object.defineProperty, Ie = Object.defineProperties;
+var De = Object.getOwnPropertyDescriptors;
+var Et = Object.getOwnPropertySymbols;
+var He = Object.prototype.hasOwnProperty, Pe = Object.prototype.propertyIsEnumerable;
+var xt = (r, t, e) => t in r ? Le(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e, E = (r, t) => {
   for (var e in t || (t = {}))
-    Be.call(t, e) && Et(r, e, t[e]);
-  if (At)
-    for (var e of At(t))
-      Re.call(t, e) && Et(r, e, t[e]);
+    He.call(t, e) && xt(r, e, t[e]);
+  if (Et)
+    for (var e of Et(t))
+      Pe.call(t, e) && xt(r, e, t[e]);
   return r;
-}, F = (r, t) => xe(r, Te(t));
-import { t as w, D as I, as as Ie, at as Le, a2 as De, au as Pe, av as Ne, aw as He, ax as Oe, ay as Me, az as _e, aA as Qt, aB as te, aC as ee, n as We, o as xt, aa as Tt, a8 as Ge, aD as $e, O as ne, V as oe, P as U, aE as qe, aF as Fe, a4 as se, aG as Ve, aH as ze, aI as Ue, aJ as Ke, aK as je, aL as Xe, aM as Ye, aN as Ze, aO as Je, I as Qe, aP as tn, C as O, aQ as en, aR as nn, S as ot, aS as on, l as sn, ad as rn } from "./chunks/inline-tool-convert-DrSwadw_.mjs";
-import { ah as Ds } from "./chunks/inline-tool-convert-DrSwadw_.mjs";
-const ie = (r) => {
+}, W = (r, t) => Ie(r, De(t));
+import { t as v, D as L, at as Ne, au as Oe, a4 as Me, av as _e, aw as We, ax as Ge, ay as $e, az as qe, aA as Fe, aB as se, aC as ie, aD as re, n as ze, o as Tt, ab as Bt, a9 as Ve, aE as Ue, aF as Ke, R as le, X as ae, aG as je, P as U, aH as Xe, aI as Ye, a6 as ce, aJ as Ze, aK as Je, aL as Qe, aM as tn, aN as en, aO as nn, aP as Rt, aQ as Lt, aR as It, K as on, aS as sn, G as O, aT as rn, aU as ln, S as ot, aV as an, l as cn, ae as dn } from "./chunks/inline-tool-convert-MjSaP8r7.mjs";
+import { ai as $s } from "./chunks/inline-tool-convert-MjSaP8r7.mjs";
+const de = (r) => {
   if (!r || !r.includes("data-blok-fake-background"))
     return r;
   const t = document.createElement("div");
@@ -33,7 +33,7 @@ const ie = (r) => {
   "[&[data-blok-empty=true]]:before:text-gray-text",
   "[&[data-blok-empty=true]]:before:cursor-text",
   "[&[data-blok-empty=true]]:before:content-[attr(data-placeholder)]"
-], ln = [
+], hn = [
   "empty:focus:before:pointer-events-none",
   "empty:focus:before:text-gray-text",
   "empty:focus:before:cursor-text",
@@ -42,7 +42,7 @@ const ie = (r) => {
   "[&[data-empty=true]:focus]:before:text-gray-text",
   "[&[data-empty=true]:focus]:before:cursor-text",
   "[&[data-empty=true]:focus]:before:content-[attr(data-blok-placeholder-active)]"
-], an = [
+], un = [
   "[[data-blok-empty=true]_&]:empty:before:pointer-events-none",
   "[[data-blok-empty=true]_&]:empty:before:text-gray-text",
   "[[data-blok-empty=true]_&]:empty:before:cursor-text",
@@ -51,22 +51,22 @@ const ie = (r) => {
   "[[data-blok-empty=true]_&[data-empty=true]]:before:text-gray-text",
   "[[data-blok-empty=true]_&[data-empty=true]]:before:cursor-text",
   "[[data-blok-empty=true]_&[data-empty=true]]:before:content-[attr(data-blok-placeholder-active)]"
-], cn = (r) => {
+], pn = (r) => {
   const t = r.innerHTML.trim();
   return t === "" || t === "<br>";
-}, dn = (r) => {
+}, gn = (r) => {
   r.innerHTML === "<br>" && (r.innerHTML = "");
   const t = window.getSelection();
   if (!t) return;
   const e = document.createRange();
   e.selectNodeContents(r), e.collapse(!0), t.removeAllRanges(), t.addRange(e);
-}, hn = (r) => {
-  cn(r) && dn(r);
-}, St = (r, t, e = "data-placeholder") => {
+}, fn = (r) => {
+  pn(r) && gn(r);
+}, kt = (r, t, e = "data-placeholder") => {
   r.setAttribute(e, t != null ? t : "");
-  const n = () => hn(r);
+  const n = () => fn(r);
   r.addEventListener("focus", n), r.addEventListener("input", n);
-}, un = (r) => {
+}, mn = (r) => {
   const t = document.createElement("div");
   t.innerHTML = r.trim();
   const e = document.createDocumentFragment();
@@ -116,14 +116,14 @@ const ie = (r) => {
   }
   drawView() {
     const t = document.createElement("DIV");
-    t.className = w(
+    t.className = v(
       this.api.styles.block,
       nt.WRAPPER_CLASSES,
-      ln,
-      an
-    ), t.setAttribute(I.tool, "paragraph"), t.contentEditable = "false";
+      hn,
+      un
+    ), t.setAttribute(L.tool, "paragraph"), t.contentEditable = "false";
     const e = this.buildInlineStyles();
-    return Object.keys(e).length > 0 && Object.assign(t.style, e), this._data.text && (t.innerHTML = this._data.text), this.readOnly ? t.setAttribute("data-blok-placeholder-active", this.api.i18n.t(this._placeholder)) : (t.contentEditable = "true", t.addEventListener("keyup", this.onKeyUp), St(t, this.api.i18n.t(this._placeholder), "data-blok-placeholder-active")), t;
+    return Object.keys(e).length > 0 && Object.assign(t.style, e), this._data.text && (t.innerHTML = this._data.text), this.readOnly ? t.setAttribute("data-blok-placeholder-active", this.api.i18n.t(this._placeholder)) : (t.contentEditable = "true", t.addEventListener("keyup", this.onKeyUp), kt(t, this.api.i18n.t(this._placeholder), "data-blok-placeholder-active")), t;
   }
   /**
    * Return Tool's view
@@ -143,7 +143,7 @@ const ie = (r) => {
     if (!this._element)
       return;
     this._data.text += t.text;
-    const e = un(t.text);
+    const e = mn(t.text);
     this._element.appendChild(e), this._element.normalize();
   }
   /**
@@ -164,7 +164,7 @@ const ie = (r) => {
    */
   save(t) {
     return {
-      text: ie(t.innerHTML)
+      text: de(t.innerHTML)
     };
   }
   /**
@@ -241,7 +241,7 @@ const ie = (r) => {
    */
   static get toolbox() {
     return {
-      icon: Ie,
+      icon: Ne,
       title: "Text",
       titleKey: "text",
       searchTerms: ["p", "paragraph", "plain"]
@@ -256,8 +256,8 @@ nt.WRAPPER_CLASSES = [
   "[&>p:first-of-type]:mt-0",
   "[&>p:last-of-type]:mb-0"
 ];
-let Bt = nt;
-const G = class G {
+let Dt = nt;
+const $ = class $ {
   /**
    * Render plugin's main Element and fill it with saved data
    *
@@ -344,9 +344,9 @@ const G = class G {
   buildSettingsFromToolboxEntries(t) {
     return t.map((e) => {
       var c, d, h, u;
-      const n = e.data, o = (c = n == null ? void 0 : n.level) != null ? c : this.defaultLevel.number, s = G.DEFAULT_LEVELS.find((p) => p.number === o), i = (d = s == null ? void 0 : s.name) != null ? d : `Heading ${o}`, l = this.resolveToolboxEntryTitle(e, i);
+      const n = e.data, o = (c = n == null ? void 0 : n.level) != null ? c : this.defaultLevel.number, s = $.DEFAULT_LEVELS.find((p) => p.number === o), i = (d = s == null ? void 0 : s.name) != null ? d : `Heading ${o}`, l = this.resolveToolboxEntryTitle(e, i);
       return {
-        icon: (u = (h = e.icon) != null ? h : s == null ? void 0 : s.icon) != null ? u : Le,
+        icon: (u = (h = e.icon) != null ? h : s == null ? void 0 : s.icon) != null ? u : Oe,
         title: l,
         onActivate: () => this.setLevel(o),
         closeOnActivate: !0,
@@ -365,7 +365,7 @@ const G = class G {
    * @returns Resolved title string
    */
   resolveToolboxEntryTitle(t, e) {
-    return De(this.api.i18n, t, e);
+    return Me(this.api.i18n, t, e);
   }
   /**
    * Callback for Block's settings buttons
@@ -467,9 +467,9 @@ const G = class G {
    */
   getTag() {
     const t = document.createElement(this.currentLevel.tag);
-    t.innerHTML = this._data.text || "", t.className = w(G.BASE_STYLES, this.currentLevel.styles, ht);
+    t.innerHTML = this._data.text || "", t.className = v($.BASE_STYLES, this.currentLevel.styles, ht);
     const { inlineStyles: e } = this.currentLevel;
-    return e && Object.assign(t.style, e), t.setAttribute(I.tool, "header"), t.contentEditable = this.readOnly ? "false" : "true", this.readOnly ? t.setAttribute("data-placeholder", this.api.i18n.t(this._settings.placeholder || "")) : St(t, this.api.i18n.t(this._settings.placeholder || "")), t;
+    return e && Object.assign(t.style, e), t.setAttribute(L.tool, "header"), t.contentEditable = this.readOnly ? "false" : "true", this.readOnly ? t.setAttribute("data-placeholder", this.api.i18n.t(this._settings.placeholder || "")) : kt(t, this.api.i18n.t(this._settings.placeholder || "")), t;
   }
   /**
    * Get current level
@@ -497,7 +497,7 @@ const G = class G {
    * @returns Level array
    */
   get levels() {
-    const t = this._settings.levelOverrides || {}, e = G.DEFAULT_LEVELS.map((o) => {
+    const t = this._settings.levelOverrides || {}, e = $.DEFAULT_LEVELS.map((o) => {
       var l;
       const s = t[o.number] || {}, i = {};
       return s.size && (i.fontSize = s.size), s.marginTop && (i.marginTop = s.marginTop), s.marginBottom && (i.marginBottom = s.marginBottom), {
@@ -554,7 +554,7 @@ const G = class G {
    * @returns ToolboxConfig array with entries for H1-H6
    */
   static get toolbox() {
-    return G.DEFAULT_LEVELS.map((t) => ({
+    return $.DEFAULT_LEVELS.map((t) => ({
       icon: t.icon,
       title: t.name,
       titleKey: t.nameKey,
@@ -565,19 +565,19 @@ const G = class G {
     }));
   }
 };
-G.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", G.DEFAULT_LEVELS = [
-  { number: 1, tag: "H1", nameKey: "tools.header.heading1", name: "Heading 1", icon: Pe, styles: "text-4xl font-bold mt-8 mb-1" },
-  { number: 2, tag: "H2", nameKey: "tools.header.heading2", name: "Heading 2", icon: Ne, 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: Oe, styles: "text-xl font-semibold mt-3 mb-px" },
-  { number: 5, tag: "H5", nameKey: "tools.header.heading5", name: "Heading 5", icon: Me, styles: "text-base font-semibold mt-3 mb-px" },
-  { number: 6, tag: "H6", nameKey: "tools.header.heading6", name: "Heading 6", icon: _e, styles: "text-sm font-semibold mt-3 mb-px" }
+$.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", $.DEFAULT_LEVELS = [
+  { number: 1, tag: "H1", nameKey: "tools.header.heading1", name: "Heading 1", icon: _e, styles: "text-4xl font-bold mt-8 mb-1" },
+  { number: 2, tag: "H2", nameKey: "tools.header.heading2", name: "Heading 2", icon: We, styles: "text-3xl font-semibold mt-6 mb-px" },
+  { number: 3, tag: "H3", nameKey: "tools.header.heading3", name: "Heading 3", icon: Ge, 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: qe, styles: "text-base font-semibold mt-3 mb-px" },
+  { number: 6, tag: "H6", nameKey: "tools.header.heading6", name: "Heading 6", icon: Fe, styles: "text-sm font-semibold mt-3 mb-px" }
 ];
-let Rt = G;
-const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl-0.5 leading-[1.6em]", fn = "flex items-start pl-0.5", mn = "mt-1 w-4 mr-2 h-4 cursor-pointer accent-current", Cn = "tools.list.placeholder", x = "list", re = {
+let Ht = $;
+const K = 24, Cn = "outline-none py-[3px] mt-[2px] mb-px", yn = "outline-none pl-0.5 leading-[1.6em]", bn = "flex items-start pl-0.5", vn = "mt-1 w-4 mr-2 h-4 cursor-pointer accent-current", Sn = "tools.list.placeholder", x = "list", he = {
   contentContainer: "list-content-container",
   checklistContent: "list-checklist-content"
-}, le = (r, t) => {
+}, ue = (r, t) => {
   const e = r;
   e._placeholder = t, Object.defineProperty(e, "getPlaceholder", {
     value: () => e._placeholder,
@@ -585,8 +585,8 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
     enumerable: !0,
     configurable: !1
   });
-}, ae = (r) => {
-  const { data: t, keydownHandler: e, readOnly: n } = r, o = yn(r), s = t.style === "checklist" ? vn(r) : bn(r);
+}, pe = (r) => {
+  const { data: t, keydownHandler: e, readOnly: n } = r, o = wn(r), s = t.style === "checklist" ? An(r) : kn(r);
   o.appendChild(s), !n && e && o.addEventListener("keydown", e);
   const i = s.querySelector("[data-list-marker]"), l = s.querySelector('input[type="checkbox"]'), a = s.querySelector("[contenteditable]");
   return {
@@ -595,52 +595,52 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
     markerElement: i,
     checkboxElement: l
   };
-}, yn = (r) => {
+}, wn = (r) => {
   var n;
   const { data: t } = r, e = document.createElement("div");
-  return e.className = pn, e.setAttribute(I.tool, x), e.setAttribute("data-list-style", t.style), e.setAttribute("data-list-depth", String((n = t.depth) != null ? n : 0)), t.start !== void 0 && t.start !== 1 && e.setAttribute("data-list-start", String(t.start)), e;
-}, bn = (r) => {
+  return e.className = Cn, e.setAttribute(L.tool, x), e.setAttribute("data-list-style", t.style), e.setAttribute("data-list-depth", String((n = t.depth) != null ? n : 0)), t.start !== void 0 && t.start !== 1 && e.setAttribute("data-list-start", String(t.start)), e;
+}, kn = (r) => {
   var c;
   const { data: t, itemColor: e, itemSize: n, placeholder: o } = r, s = document.createElement("div");
-  s.setAttribute("role", "listitem"), s.className = w(gn, "flex", ...ht), e && (s.style.color = e), n && (s.style.fontSize = n);
+  s.setAttribute("role", "listitem"), s.className = v(yn, "flex", ...ht), e && (s.style.color = e), n && (s.style.fontSize = n);
   const i = (c = t.depth) != null ? c : 0;
   i > 0 && (s.style.marginLeft = `${i * K}px`);
-  const l = wn(t.style, i);
+  const l = En(t.style, i);
   l.setAttribute("data-list-marker", "true"), l.setAttribute("data-blok-mutation-free", "true"), s.appendChild(l);
   const a = document.createElement("div");
-  return a.className = w("flex-1 min-w-0 outline-none", ...ht), a.setAttribute("data-blok-testid", re.contentContainer), a.contentEditable = r.readOnly ? "false" : "true", a.innerHTML = t.text, le(a, o), s.appendChild(a), s;
-}, vn = (r) => {
+  return a.className = v("flex-1 min-w-0 outline-none", ...ht), a.setAttribute("data-blok-testid", he.contentContainer), a.contentEditable = r.readOnly ? "false" : "true", a.innerHTML = t.text, ue(a, o), s.appendChild(a), s;
+}, An = (r) => {
   var d;
   const { data: t, itemColor: e, itemSize: n, placeholder: o, readOnly: s } = r, i = document.createElement("div");
-  i.setAttribute("role", "listitem"), i.className = fn, e && (i.style.color = e), n && (i.style.fontSize = n);
+  i.setAttribute("role", "listitem"), i.className = bn, e && (i.style.color = e), n && (i.style.fontSize = n);
   const l = (d = t.depth) != null ? d : 0;
   l > 0 && (i.style.marginLeft = `${l * K}px`);
   const a = document.createElement("input");
-  a.type = "checkbox", a.className = mn, a.checked = !!t.checked, a.disabled = s;
+  a.type = "checkbox", a.className = vn, a.checked = !!t.checked, a.disabled = s;
   const c = document.createElement("div");
-  return c.className = w(
+  return c.className = v(
     "flex-1 outline-none leading-[1.6em]",
     t.checked ? "line-through opacity-60" : "",
     ...ht
-  ), c.setAttribute("data-blok-testid", re.checklistContent), c.setAttribute("data-checked", String(t.checked)), c.contentEditable = s ? "false" : "true", c.innerHTML = t.text, le(c, o), i.appendChild(a), i.appendChild(c), i;
-}, wn = (r, t) => {
+  ), c.setAttribute("data-blok-testid", he.checklistContent), c.setAttribute("data-checked", String(t.checked)), c.contentEditable = s ? "false" : "true", c.innerHTML = t.text, ue(c, o), i.appendChild(a), i.appendChild(c), i;
+}, En = (r, t) => {
   const e = document.createElement("span");
   if (e.className = "flex-shrink-0 select-none", e.setAttribute("aria-hidden", "true"), e.contentEditable = "false", r === "ordered")
-    e.textContent = "1.", e.className = w(e.className, "text-right"), e.style.paddingRight = "11px", e.style.minWidth = "fit-content";
+    e.textContent = "1.", e.className = v(e.className, "text-right"), e.style.paddingRight = "11px", e.style.minWidth = "fit-content";
   else {
-    const n = Sn(t);
-    e.textContent = n, e.className = w(e.className, "w-6 text-center flex justify-center"), e.style.paddingLeft = "1px", e.style.paddingRight = "13px", e.style.fontSize = "24px", e.style.fontFamily = "Arial";
+    const n = xn(t);
+    e.textContent = n, e.className = v(e.className, "w-6 text-center flex justify-center"), e.style.paddingLeft = "1px", e.style.paddingRight = "13px", e.style.fontSize = "24px", e.style.fontFamily = "Arial";
   }
   return e;
-}, Sn = (r) => {
+}, xn = (r) => {
   const t = ["•", "◦", "▪"];
   return t[r % t.length];
-}, kn = (r) => {
+}, Tn = (r) => {
   const { data: t, readOnly: e, placeholder: n, itemColor: o, itemSize: s, element: i, setupItemPlaceholder: l, onCheckboxChange: a, keydownHandler: c } = r;
   if (!i) return null;
   const d = i.parentNode;
   if (!d) return null;
-  const h = ae({
+  const h = pe({
     data: t,
     readOnly: e,
     placeholder: n,
@@ -655,26 +655,26 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
     });
   }
   return d.replaceChild(h.wrapper, i), h.wrapper;
-}, An = (r, t, e) => {
+}, Bn = (r, t, e) => {
   if (!t) return r;
   const n = e(), s = {
-    text: n ? ie(n.innerHTML) : r.text,
+    text: n ? de(n.innerHTML) : r.text,
     style: r.style,
     checked: r.checked
   };
   return r.start !== void 0 && r.start !== 1 && (s.start = r.start), r.depth !== void 0 && r.depth > 0 && (s.depth = r.depth), s;
-}, En = (r, t, e, n, o) => {
-  var m, C, y;
+}, Rn = (r, t, e, n, o) => {
+  var C, f, y;
   if (!e)
     return { newData: r, inPlace: !1 };
-  const s = (m = r.depth) != null ? m : 0, i = (C = t.depth) != null ? C : 0, l = r.style, a = t.style;
+  const s = (C = r.depth) != null ? C : 0, i = (f = t.depth) != null ? f : 0, l = r.style, a = t.style;
   if (l !== a)
     return { newData: r, inPlace: !1 };
-  const c = "depth" in t ? t.depth : 0, d = F(E(E({}, r), t), {
+  const c = "depth" in t ? t.depth : 0, d = W(E(E({}, r), t), {
     depth: c
   }), h = n();
   return h && typeof t.text == "string" && (h.innerHTML = t.text), s !== i ? (o.adjustDepthTo(i), o.updateMarkerForDepth(i, a), { newData: d, inPlace: !0 }) : (a === "checklist" && o.updateCheckboxState((y = t.checked) != null ? y : !1), { newData: d, inPlace: !0 });
-}, xn = (r, t) => {
+}, Ln = (r, t) => {
   const { element: e, getContentElement: n, parseHTML: o, data: s } = r;
   if (!e)
     return;
@@ -684,13 +684,13 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
     const l = o(t.text);
     i.appendChild(l), i.normalize();
   }
-}, Tn = (r, t, e, n) => r.map((o) => ({
+}, In = (r, t, e, n) => r.map((o) => ({
   icon: o.icon,
   title: e(`toolNames.${o.titleKey}`),
   onActivate: () => n(o.style),
   closeOnActivate: !0,
   isActive: t === o.style
-})), Bn = (r) => {
+})), Dn = (r) => {
   if (!r)
     return;
   const e = (r.getAttribute("style") || "").match(/margin-left:\s*(\d+)px/);
@@ -698,7 +698,7 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
     return;
   const n = parseInt(e[1], 10);
   return n > 0 ? { left: n } : void 0;
-}, Rn = (r) => {
+}, Hn = (r) => {
   const t = r.closest("[data-list-depth]");
   if (!t)
     return;
@@ -707,10 +707,10 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
     return;
   const n = parseInt(e, 10);
   return n > 0 ? { left: n * K } : void 0;
-}, In = (r) => {
-  const t = r.closest('[role="listitem"]') || r.querySelector('[role="listitem"]'), e = Bn(t);
-  return e !== void 0 ? e : Rn(r);
-}, Ln = (r, t) => {
+}, Pn = (r) => {
+  const t = r.closest('[role="listitem"]') || r.querySelector('[role="listitem"]'), e = Dn(t);
+  return e !== void 0 ? e : Hn(r);
+}, Nn = (r, t) => {
   const e = document.createRange();
   if (e.setStart(r, 0), e.setEnd(t.startContainer, t.startOffset), !r.lastChild)
     return {
@@ -719,33 +719,33 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
     };
   const n = document.createRange();
   return n.setStart(t.endContainer, t.endOffset), n.setEndAfter(r.lastChild), {
-    beforeContent: It(e.cloneContents()),
-    afterContent: It(n.cloneContents())
+    beforeContent: Pt(e.cloneContents()),
+    afterContent: Pt(n.cloneContents())
   };
-}, It = (r) => {
+}, Pt = (r) => {
   const t = document.createElement("div");
   return t.appendChild(r), t.innerHTML;
-}, Dn = (r) => {
+}, On = (r) => {
   const t = document.createElement("div");
   t.innerHTML = r.trim();
   const e = document.createDocumentFragment();
   return e.append(...Array.from(t.childNodes)), e;
-}, Pn = (r, t) => {
+}, Mn = (r, t) => {
   const e = document.createRange();
   return e.selectNodeContents(r), e.setEnd(t.startContainer, t.startOffset), e.toString().length === 0;
-}, Nn = (r, t) => {
+}, _n = (r, t) => {
   const e = document.createRange();
   e.selectNodeContents(r), e.setEnd(t.startContainer, t.startOffset);
   const n = e.toString().length === 0, o = document.createRange();
   o.selectNodeContents(r), o.setStart(t.endContainer, t.endOffset);
   const s = o.toString().length === 0;
   return n && s;
-}, Hn = (r) => {
+}, Wn = (r) => {
   if (typeof r != "object" || r === null)
     return !1;
   const e = Object.entries(r).find(([n]) => n === "items");
   return e === void 0 ? !1 : Array.isArray(e[1]);
-}, On = (r) => typeof r == "object" && r !== null, Mn = (r) => typeof r == "string" ? r : "", _n = (r, t) => r === "unordered" || r === "ordered" || r === "checklist" ? r : t, Wn = (r) => !!r, Gn = (r, t) => typeof r == "number" ? r : t, $n = (r, t) => {
+}, Gn = (r) => typeof r == "object" && r !== null, $n = (r) => typeof r == "string" ? r : "", qn = (r, t) => r === "unordered" || r === "ordered" || r === "checklist" ? r : t, Fn = (r) => !!r, zn = (r, t) => typeof r == "number" ? r : t, Vn = (r, t) => {
   const e = t.defaultStyle || "unordered";
   if (!r || typeof r != "object")
     return {
@@ -754,7 +754,7 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
       checked: !1,
       depth: 0
     };
-  if (Hn(r)) {
+  if (Wn(r)) {
     const n = r.items[0], o = (n == null ? void 0 : n.content) || "", s = (n == null ? void 0 : n.checked) || !1;
     return E({
       text: o,
@@ -763,8 +763,8 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
       depth: 0
     }, r.start !== void 0 && r.start !== 1 ? { start: r.start } : {});
   }
-  if (On(r)) {
-    const n = Mn(r.text), o = _n(r.style, e), s = Wn(r.checked), i = Gn(r.depth, 0), l = r.start, a = typeof l == "number" && l !== void 0 && l !== 1 ? l : void 0;
+  if (Gn(r)) {
+    const n = $n(r.text), o = qn(r.style, e), s = Fn(r.checked), i = zn(r.depth, 0), l = r.start, a = typeof l == "number" && l !== void 0 && l !== 1 ? l : void 0;
     return E({
       text: n,
       style: o,
@@ -779,7 +779,7 @@ const K = 24, pn = "outline-none py-[3px] mt-[2px] mb-px", gn = "outline-none pl
     depth: 0
   };
 };
-class ce {
+class ge {
   constructor(t) {
     this.blocks = t;
   }
@@ -839,7 +839,7 @@ class ce {
     return n ? Math.round(parseInt(n[1], 10) / K) : 0;
   }
 }
-const qn = (r, t) => {
+const Un = (r, t) => {
   if (!r) return null;
   if (t === "checklist") {
     const n = r.querySelector("[contenteditable]");
@@ -847,15 +847,15 @@ const qn = (r, t) => {
   }
   const e = r.querySelector('[data-blok-testid="list-content-container"]');
   return e instanceof HTMLElement ? e : null;
-}, Fn = (r, t, e) => {
+}, Kn = (r, t, e) => {
   r && r.setAttribute("data-list-depth", String(e));
   const n = r == null ? void 0 : r.querySelector('[role="listitem"]');
   n instanceof HTMLElement && (n.style.marginLeft = e > 0 ? `${e * K}px` : ""), t.depth = e;
-}, de = (r, t) => t.getBlockDepth(r), he = (r, t) => t.getBlockStyle(r), Vn = (r, t) => t.getBulletCharacter(r), Lt = (r, t, e, n, o) => {
+}, fe = (r, t) => t.getBlockDepth(r), me = (r, t) => t.getBlockStyle(r), jn = (r, t) => t.getBulletCharacter(r), Nt = (r, t, e, n, o) => {
   var i;
   const s = r && (i = n.getBlockIndex(r)) != null ? i : n.getCurrentBlockIndex();
   return s <= 0 ? 0 : o.getSiblingIndex(s, t, e);
-}, zn = (r, t, e, n, o, s) => {
+}, Xn = (r, t, e, n, o, s) => {
   var a, c;
   if (r === 0)
     return (a = n.start) != null ? a : 1;
@@ -866,10 +866,10 @@ const qn = (r, t) => {
     n.style
   );
   return l === null ? 1 : s.getBlockStartValue(l);
-}, Dt = (r, t, e, n, o, s) => {
-  const l = zn(r, t, n, e, o, s) + r;
+}, Ot = (r, t, e, n, o, s) => {
+  const l = Xn(r, t, n, e, o, s) + r;
   return s.formatNumber(l, t);
-}, Un = (r, t, e, n) => n.findGroupStart(r, t, e), ue = (r, t, e, n) => {
+}, Yn = (r, t, e, n) => n.findGroupStart(r, t, e), Ce = (r, t, e, n) => {
   if (!r)
     return;
   const o = r.holder, s = o == null ? void 0 : o.querySelector('[data-list-style="ordered"]');
@@ -881,9 +881,9 @@ const qn = (r, t) => {
   const l = t.getBlockIndex(r.id);
   if (l == null)
     return;
-  const a = de(r, e), c = he(r, n) || "ordered", d = n.getSiblingIndex(l, a, c), u = n.getGroupStartValue(l, a, d, c) + d, p = n.formatNumber(u, a);
+  const a = fe(r, e), c = me(r, n) || "ordered", d = n.getSiblingIndex(l, a, c), u = n.getGroupStartValue(l, a, d, c) + d, p = n.formatNumber(u, a);
   i.textContent = p;
-}, Kn = (r, t, e, n, o, s, i, l) => {
+}, Zn = (r, t, e, n, o, s, i, l) => {
   const a = (c) => {
     if (c >= t)
       return;
@@ -894,61 +894,62 @@ const qn = (r, t) => {
     const d = s.getBlockByIndex(c);
     if (!d || d.name !== x)
       return;
-    const h = de(d, i);
+    const h = fe(d, i);
     if (h < n)
       return;
     if (h > n) {
       a(c + 1);
       return;
     }
-    he(d, l) === o && (ue(d, s, i, l), a(c + 1));
+    me(d, l) === o && (Ce(d, s, i, l), a(c + 1));
   };
   a(r);
-}, jn = (r, t, e) => {
+}, Jn = (r, t, e) => {
   const n = r.getBlocksCount();
   Array.from({ length: n }, (o, s) => s).forEach((o) => {
     const s = r.getBlockByIndex(o);
     if (!s || s.name !== x)
       return;
     const i = s.holder;
-    i != null && i.querySelector('[data-list-style="ordered"]') && ue(s, r, t, e);
+    i != null && i.querySelector('[data-list-style="ordered"]') && Ce(s, r, t, e);
   });
 }, Y = (r, t, e = "end") => {
-  requestAnimationFrame(() => {
-    const n = t.holder;
-    if (!n) return;
-    const o = n.querySelector('[contenteditable="true"]');
-    if (!(o instanceof HTMLElement)) {
-      r.caret.setToBlock(t, e), r.caret.updateLastCaretAfterPosition();
+  const n = (i) => {
+    const l = t.holder;
+    if (!l) return;
+    const a = l.querySelector('[contenteditable="true"]');
+    if (!(a instanceof HTMLElement)) {
+      r.caret.setToBlock(t, e), i && r.caret.updateLastCaretAfterPosition();
       return;
     }
-    o.focus();
-    const s = window.getSelection();
-    if (!s) return;
-    const i = document.createRange();
-    e === "start" ? (i.setStart(o, 0), i.collapse(!0)) : (i.selectNodeContents(o), i.collapse(!1)), s.removeAllRanges(), s.addRange(i), r.caret.updateLastCaretAfterPosition();
-  });
-}, Xn = async (r) => {
-  var m;
+    a.focus();
+    const c = window.getSelection();
+    if (!c) return;
+    const d = document.createRange();
+    e === "start" ? (d.setStart(a, 0), d.collapse(!0)) : (d.selectNodeContents(a), d.collapse(!1)), c.removeAllRanges(), c.addRange(d), i && r.caret.updateLastCaretAfterPosition();
+  }, o = t.holder;
+  (o == null ? void 0 : o.querySelector('[contenteditable="true"]')) instanceof HTMLElement ? n(!1) : requestAnimationFrame(() => n(!0));
+}, Qn = async (r) => {
+  var C;
   const { api: t, blockId: e, data: n, element: o, getContentElement: s } = r, i = window.getSelection();
   if (!i || !o) return;
   const l = s();
   if (!l) return;
   const a = l.innerHTML.trim();
   if (a === "" || a === "<br>") {
-    await Yn(r);
+    await to(r);
     return;
   }
-  const c = i.getRangeAt(0), { beforeContent: d, afterContent: h } = Ln(l, c), u = e && (m = t.blocks.getBlockIndex(e)) != null ? m : t.blocks.getCurrentBlockIndex();
+  const c = i.getRangeAt(0), { beforeContent: d, afterContent: h } = Nn(l, c), u = e && (C = t.blocks.getBlockIndex(e)) != null ? C : t.blocks.getCurrentBlockIndex();
   if (!e) {
     l.innerHTML = d, n.text = d;
-    const C = t.blocks.insert(x, {
+    const f = t.blocks.insert(x, {
       text: h,
       style: n.style,
       checked: !1,
       depth: n.depth
     }, void 0, u + 1, !0);
-    Y(t, C, "start");
+    Y(t, f, "start");
     return;
   }
   const p = t.blocks.splitBlock(
@@ -964,37 +965,37 @@ const qn = (r, t) => {
     u + 1
   );
   n.text = d, Y(t, p, "start");
-}, Yn = async (r) => {
+}, to = async (r) => {
   const { api: t, blockId: e, getDepth: n } = r;
   if (n() > 0) {
-    await pe(r);
+    await ye(r);
     return;
   }
   if (e === void 0)
     return;
   const s = await t.blocks.convert(e, "paragraph", { text: "" });
   Y(t, s, "start");
-}, Zn = async (r, t) => {
+}, eo = async (r, t) => {
   const { api: e, blockId: n, data: o, element: s, getContentElement: i, getDepth: l, syncContentFromDOM: a } = r, c = window.getSelection();
   if (!c || !s) return;
   const d = c.getRangeAt(0), h = i();
   if (!h) return;
   a();
   const u = o.text, p = l();
-  if (Nn(h, d) && !c.isCollapsed) {
+  if (_n(h, d) && !c.isCollapsed) {
     t.preventDefault(), h.innerHTML = "", o.text = "";
     const y = document.createRange();
     y.setStart(h, 0), y.collapse(!0), c.removeAllRanges(), c.addRange(y);
     return;
   }
-  if (!Pn(h, d) || (t.preventDefault(), n === void 0))
+  if (!Mn(h, d) || (t.preventDefault(), n === void 0))
     return;
-  const C = await e.blocks.convert(n, "paragraph", { text: u });
+  const f = await e.blocks.convert(n, "paragraph", { text: u });
   p > 0 && requestAnimationFrame(() => {
-    const y = C.holder;
+    const y = f.holder;
     y && (y.style.marginLeft = `${p * K}px`, y.setAttribute("data-blok-depth", String(p)));
-  }), Y(e, C, "start");
-}, Jn = async (r, t) => {
+  }), Y(e, f, "start");
+}, no = async (r, t) => {
   const { api: e, blockId: n, data: o, syncContentFromDOM: s, getDepth: i } = r, l = e.blocks.getCurrentBlockIndex();
   if (l === 0) return;
   const a = e.blocks.getBlockByIndex(l - 1);
@@ -1004,22 +1005,22 @@ const qn = (r, t) => {
   s();
   const h = c + 1;
   o.depth = h;
-  const u = await e.blocks.update(n || "", F(E({}, o), {
+  const u = await e.blocks.update(n || "", W(E({}, o), {
     depth: h
   }));
   Y(e, u);
-}, pe = async (r) => {
+}, ye = async (r) => {
   const { api: t, blockId: e, data: n, syncContentFromDOM: o, getDepth: s } = r, i = s();
   if (i === 0) return;
   o();
   const l = i - 1;
   n.depth = l;
-  const a = await t.blocks.update(e || "", F(E({}, n), {
+  const a = await t.blocks.update(e || "", W(E({}, n), {
     depth: l
   }));
   Y(t, a);
-}, Qn = (r) => {
-  const { data: t, readOnly: e, placeholder: n, itemColor: o, itemSize: s, setupItemPlaceholder: i, onCheckboxChange: l, keydownHandler: a } = r, c = ae({
+}, oo = (r) => {
+  const { data: t, readOnly: e, placeholder: n, itemColor: o, itemSize: s, setupItemPlaceholder: i, onCheckboxChange: l, keydownHandler: a } = r, c = pe({
     data: t,
     readOnly: e,
     placeholder: n,
@@ -1034,14 +1035,14 @@ const qn = (r, t) => {
     });
   }
   return c.wrapper;
-}, to = (r) => {
+}, so = (r) => {
   const t = (e) => {
     if (e <= 0) return "";
     const n = e - 1;
     return t(Math.floor(n / 26)) + String.fromCharCode(97 + n % 26);
   };
   return t(r);
-}, eo = (r) => {
+}, io = (r) => {
   const t = [
     [1e3, "m"],
     [900, "cm"],
@@ -1063,7 +1064,7 @@ const qn = (r, t) => {
   };
   return e(r, 0);
 };
-class ge {
+class be {
   constructor(t) {
     this.blocks = t;
   }
@@ -1122,7 +1123,7 @@ class ge {
    */
   formatNumber(t, e) {
     const n = e % 3;
-    return n === 1 ? `${to(t)}.` : n === 2 ? `${eo(t)}.` : `${t}.`;
+    return n === 1 ? `${so(t)}.` : n === 2 ? `${io(t)}.` : `${t}.`;
   }
   /**
    * Get the start value for a list group.
@@ -1219,9 +1220,9 @@ class ge {
   }
 }
 const gt = { value: !1 };
-class no {
+class ro {
   constructor(t) {
-    this.blocks = t, this.depthValidator = new ce(t), this.markerCalculator = new ge(t);
+    this.blocks = t, this.depthValidator = new ge(t), this.markerCalculator = new be(t);
   }
   /**
    * Update this block's marker element with the correct index.
@@ -1328,15 +1329,15 @@ class no {
     if (s == null)
       return;
     const i = this.depthValidator.getBlockDepth(t), l = this.getBlockStyle(t) || "ordered", a = this.markerCalculator.getSiblingIndex(s, i, l), c = this.markerCalculator.getGroupStartValue(s, i, a, l), h = (a === 0 && c === 1 ? (() => {
-      const p = n.closest("[data-list-start]"), m = p == null ? void 0 : p.getAttribute("data-list-start");
-      if (!m) return c;
-      const C = parseInt(m, 10);
-      return isNaN(C) ? c : C;
+      const p = n.closest("[data-list-start]"), C = p == null ? void 0 : p.getAttribute("data-list-start");
+      if (!C) return c;
+      const f = parseInt(C, 10);
+      return isNaN(f) ? c : f;
     })() : c) + a, u = this.markerCalculator.formatNumber(h, i);
     o.textContent = u;
   }
 }
-const oo = (r) => r instanceof HTMLElement, so = /* @__PURE__ */ new Set([
+const lo = (r) => r instanceof HTMLElement, ao = /* @__PURE__ */ new Set([
   "decimal",
   "decimal-leading-zero",
   "lower-roman",
@@ -1367,12 +1368,12 @@ const oo = (r) => r instanceof HTMLElement, so = /* @__PURE__ */ new Set([
   "telugu",
   "thai",
   "tibetan"
-]), io = /* @__PURE__ */ new Set([
+]), co = /* @__PURE__ */ new Set([
   "disc",
   "circle",
   "square",
   "none"
-]), ro = (r) => {
+]), ho = (r) => {
   const t = r.getAttribute("data-list-style");
   if (t === "ordered") return "ordered";
   if (t === "unordered") return "unordered";
@@ -1381,25 +1382,25 @@ const oo = (r) => r instanceof HTMLElement, so = /* @__PURE__ */ new Set([
   const n = e.match(/list-style-type\s*:\s*([^;]+)/);
   if (!n) return null;
   const o = n[1].trim().toLowerCase();
-  return so.has(o) ? "ordered" : io.has(o) ? "unordered" : null;
-}, lo = (r, t) => {
+  return ao.has(o) ? "ordered" : co.has(o) ? "unordered" : null;
+}, uo = (r, t) => {
   const e = r.parentElement;
   if ((e == null ? void 0 : e.tagName) === "OL") return "ordered";
   if ((e == null ? void 0 : e.tagName) === "UL")
     return r.querySelector('input[type="checkbox"]') ? "checklist" : "unordered";
-  const n = ro(r);
+  const n = ho(r);
   return n || t;
-}, ao = (r) => {
+}, po = (r) => {
   const t = r.innerHTML || r.textContent || "", e = r.querySelector('input[type="checkbox"]'), n = e instanceof HTMLInputElement ? e.checked : !1;
   return { text: t, checked: n };
-}, co = (r) => {
+}, go = (r) => {
   const t = r.getAttribute("aria-level");
   if (t) {
     const e = parseInt(t, 10);
     return Math.max(0, e - 1);
   }
   return 0;
-}, ho = () => ({
+}, fo = () => ({
   text: {
     br: !0,
     a: {
@@ -1411,7 +1412,7 @@ const oo = (r) => r instanceof HTMLElement, so = /* @__PURE__ */ new Set([
     i: !0,
     mark: !0
   }
-}), uo = () => ({
+}), mo = () => ({
   tags: [
     {
       li: {
@@ -1422,35 +1423,35 @@ const oo = (r) => r instanceof HTMLElement, so = /* @__PURE__ */ new Set([
       }
     }
   ]
-}), po = () => ({
+}), Co = () => ({
   export: (r) => r.text,
   import: (r) => ({
     text: r,
     style: "unordered",
     checked: !1
   })
-}), Pt = [
+}), Mt = [
   {
     name: "bulletedList",
     titleKey: "bulletedList",
     style: "unordered",
-    icon: Qt
+    icon: se
   },
   {
     name: "numberedList",
     titleKey: "numberedList",
     style: "ordered",
-    icon: te
+    icon: ie
   },
   {
     name: "todoList",
     titleKey: "todoList",
     style: "checklist",
-    icon: ee
+    icon: re
   }
-], go = () => [
+], yo = () => [
   {
-    icon: Qt,
+    icon: se,
     title: "Bulleted list",
     titleKey: "bulletedList",
     data: { style: "unordered" },
@@ -1459,7 +1460,7 @@ const oo = (r) => r instanceof HTMLElement, so = /* @__PURE__ */ new Set([
     shortcut: "-"
   },
   {
-    icon: te,
+    icon: ie,
     title: "Numbered list",
     titleKey: "numberedList",
     data: { style: "ordered" },
@@ -1468,7 +1469,7 @@ const oo = (r) => r instanceof HTMLElement, so = /* @__PURE__ */ new Set([
     shortcut: "1."
   },
   {
-    icon: ee,
+    icon: re,
     title: "To-do list",
     titleKey: "todoList",
     data: { style: "checklist" },
@@ -1477,22 +1478,22 @@ const oo = (r) => r instanceof HTMLElement, so = /* @__PURE__ */ new Set([
     shortcut: "[]"
   }
 ];
-class xs {
+class Ns {
   constructor({ data: t, config: e, api: n, readOnly: o, block: s }) {
     this._element = null, this.handleBlockChanged = (i) => {
       var l;
       this.isBlockChangedEventPayload(i) && (i.event.type === "block-removed" || i.event.type === "block-added") && ((l = this.markerManager) == null || l.scheduleUpdateAll());
-    }, this.api = n, this.readOnly = o, this._settings = e || {}, this._data = this.normalizeData(t), this.depthValidator = new ce(n.blocks), this.markerCalculator = new ge(n.blocks), this.markerManager = this._data.style === "ordered" ? new no(n.blocks) : null, s && (this.blockId = s.id), this._data.style === "ordered" && this.api.events.on("block changed", this.handleBlockChanged);
+    }, this.api = n, this.readOnly = o, this._settings = e || {}, this._data = this.normalizeData(t), this.depthValidator = new ge(n.blocks), this.markerCalculator = new be(n.blocks), this.markerManager = this._data.style === "ordered" ? new ro(n.blocks) : null, s && (this.blockId = s.id), this._data.style === "ordered" && this.api.events.on("block changed", this.handleBlockChanged);
   }
   isBlockChangedEventPayload(t) {
     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 $n(t, this._settings);
+    return Vn(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 ? Mt : Mt.filter((e) => t.includes(e.style));
   }
   get itemColor() {
     return this._settings.itemColor;
@@ -1501,13 +1502,13 @@ class xs {
     return this._settings.itemSize;
   }
   get placeholder() {
-    return this.api.i18n.t(Cn);
+    return this.api.i18n.t(Sn);
   }
   setupItemPlaceholder(t) {
-    this.readOnly || St(t, this.placeholder);
+    this.readOnly || kt(t, this.placeholder);
   }
   render() {
-    return this._element = Qn({
+    return this._element = oo({
       data: this._data,
       readOnly: this.readOnly,
       placeholder: this.placeholder,
@@ -1537,7 +1538,7 @@ class xs {
     e !== n && this.adjustDepthTo(n);
   }
   adjustDepthTo(t) {
-    Fn(this._element, this._data, t);
+    Kn(this._element, this._data, t);
   }
   removed() {
     this._data.style === "ordered" && (this.api.events.off("block changed", this.handleBlockChanged), requestAnimationFrame(() => {
@@ -1545,30 +1546,30 @@ class xs {
     }));
   }
   updateAllOrderedListMarkers() {
-    jn(this.api.blocks, this.depthValidator, this.markerCalculator);
+    Jn(this.api.blocks, this.depthValidator, this.markerCalculator);
   }
   updateMarker() {
     var s;
     const t = (s = this._element) == null ? void 0 : s.querySelector("[data-list-marker]");
     if (!t)
       return;
-    const e = this.getDepth(), n = Lt(this.blockId, e, this._data.style, this.api.blocks, this.markerCalculator), o = Dt(n, e, this._data, this.blockId, this.api.blocks, this.markerCalculator);
+    const e = this.getDepth(), n = Nt(this.blockId, e, this._data.style, this.api.blocks, this.markerCalculator), o = Ot(n, e, this._data, this.blockId, this.api.blocks, this.markerCalculator);
     t.textContent = o;
   }
   updateSiblingListMarkers() {
     var i;
-    const t = this.blockId ? (i = this.api.blocks.getBlockIndex(this.blockId)) != null ? i : this.api.blocks.getCurrentBlockIndex() : this.api.blocks.getCurrentBlockIndex(), e = this.getDepth(), n = this._data.style, o = this.api.blocks.getBlocksCount(), s = Un(t, e, n, this.markerCalculator);
-    Kn(s, o, t, e, n, this.api.blocks, this.depthValidator, this.markerCalculator);
+    const t = this.blockId ? (i = this.api.blocks.getBlockIndex(this.blockId)) != null ? i : this.api.blocks.getCurrentBlockIndex() : this.api.blocks.getCurrentBlockIndex(), e = this.getDepth(), n = this._data.style, o = this.api.blocks.getBlocksCount(), s = Yn(t, e, n, this.markerCalculator);
+    Zn(s, o, t, e, n, this.api.blocks, this.depthValidator, this.markerCalculator);
   }
   updateMarkerForDepth(t, e) {
     var o;
     const n = (o = this._element) == null ? void 0 : o.querySelector('[aria-hidden="true"]');
     if (n instanceof HTMLElement)
       if (e === "ordered") {
-        const s = Lt(this.blockId, t, this._data.style, this.api.blocks, this.markerCalculator), i = Dt(s, t, this._data, this.blockId, this.api.blocks, this.markerCalculator);
+        const s = Nt(this.blockId, t, this._data.style, this.api.blocks, this.markerCalculator), i = Ot(s, t, this._data, this.blockId, this.api.blocks, this.markerCalculator);
         n.textContent = i;
       } else {
-        const s = Vn(t, this.markerCalculator);
+        const s = jn(t, this.markerCalculator);
         n.textContent = s;
       }
   }
@@ -1608,7 +1609,7 @@ class xs {
       syncContentFromDOM: this.syncContentFromDOM.bind(this),
       getDepth: this.getDepth.bind(this)
     };
-    await Xn(t);
+    await Qn(t);
   }
   async handleBackspace(t) {
     const e = {
@@ -1620,7 +1621,7 @@ class xs {
       syncContentFromDOM: this.syncContentFromDOM.bind(this),
       getDepth: this.getDepth.bind(this)
     };
-    await Zn(e, t);
+    await eo(e, t);
   }
   async handleIndent() {
     const t = {
@@ -1632,7 +1633,7 @@ class xs {
       syncContentFromDOM: this.syncContentFromDOM.bind(this),
       getDepth: this.getDepth.bind(this)
     };
-    await Jn(t, this.depthValidator);
+    await no(t, this.depthValidator);
   }
   async handleOutdent() {
     const t = {
@@ -1644,7 +1645,7 @@ class xs {
       syncContentFromDOM: this.syncContentFromDOM.bind(this),
       getDepth: this.getDepth.bind(this)
     };
-    await pe(t);
+    await ye(t);
   }
   syncContentFromDOM() {
     var n;
@@ -1655,10 +1656,10 @@ class xs {
     e instanceof HTMLInputElement && (this._data.checked = e.checked);
   }
   getContentElement() {
-    return qn(this._element, this._data.style);
+    return Un(this._element, this._data.style);
   }
   renderSettings() {
-    return Tn(this.availableStyles, this._data.style, this.api.i18n.t, (t) => this.setStyle(t));
+    return In(this.availableStyles, this._data.style, this.api.i18n.t, (t) => this.setStyle(t));
   }
   setStyle(t) {
     const e = this._data.style;
@@ -1667,7 +1668,7 @@ class xs {
     });
   }
   rerender() {
-    const t = kn({
+    const t = Tn({
       data: this._data,
       readOnly: this.readOnly,
       placeholder: this.placeholder,
@@ -1686,10 +1687,10 @@ class xs {
     return typeof t.text == "string";
   }
   save() {
-    return An(this._data, this._element, this.getContentElement.bind(this));
+    return Bn(this._data, this._element, this.getContentElement.bind(this));
   }
   setData(t) {
-    const e = En(
+    const e = Rn(
       this._data,
       t,
       this._element,
@@ -1703,35 +1704,35 @@ class xs {
     return this._data = e.newData, e.inPlace;
   }
   merge(t) {
-    xn(
+    Ln(
       {
         data: this._data,
         element: this._element,
         getContentElement: this.getContentElement.bind(this),
-        parseHTML: Dn
+        parseHTML: On
       },
       t
     );
   }
   static get conversionConfig() {
-    return po();
+    return Co();
   }
   static get sanitize() {
-    return ho();
+    return fo();
   }
   static get pasteConfig() {
-    return uo();
+    return mo();
   }
   onPaste(t) {
     const e = t.detail;
     if (!("data" in e)) return;
     const n = e.data;
-    if (!oo(n))
+    if (!lo(n))
       return;
-    const { text: o, checked: s } = ao(n), i = co(n);
+    const { text: o, checked: s } = po(n), i = go(n);
     this._data = {
       text: o,
-      style: lo(n, this._data.style),
+      style: uo(n, this._data.style),
       checked: s,
       depth: i
     }, this.rerender();
@@ -1740,19 +1741,19 @@ class xs {
     return !0;
   }
   getContentOffset(t) {
-    return In(t);
+    return Pn(t);
   }
   static get toolbox() {
-    return go();
+    return yo();
   }
 }
-const fo = "data-blok-table-add-row", mo = "data-blok-table-add-col", Nt = 150, Co = 5, Ht = 40, Ot = [
+const bo = "data-blok-table-add-row", vo = "data-blok-table-add-col", _t = 150, So = 5, Wt = 40, Gt = [
   "flex",
   "items-center",
   "justify-center",
   "transition-opacity",
   "duration-150"
-], Mt = [
+], $t = [
   "flex",
   "items-center",
   "justify-center",
@@ -1760,20 +1761,31 @@ const fo = "data-blok-table-add-row", mo = "data-blok-table-add-col", Nt = 150,
   "border-gray-300",
   "rounded-full",
   "group-hover/add:bg-gray-50"
-], _t = "12";
-class yo {
+], qt = "12";
+class wo {
   constructor(t) {
-    this.rowHideTimeout = null, this.colHideTimeout = null, this.rowVisible = !1, this.colVisible = !1, this.interactive = !0, this.dragState = null, this.wrapper = t.wrapper, this.grid = t.grid, this.i18n = t.i18n, this.boundAddRowClick = t.onAddRow, this.boundAddColClick = t.onAddColumn, this.onDragStart = t.onDragStart, this.onDragAddRow = t.onDragAddRow, this.onDragRemoveRow = t.onDragRemoveRow, this.onDragAddCol = t.onDragAddCol, this.onDragRemoveCol = t.onDragRemoveCol, this.onDragEnd = t.onDragEnd, this.getNewColumnWidth = t.getNewColumnWidth, this.boundMouseMove = this.handleMouseMove.bind(this), this.boundMouseLeave = this.handleMouseLeave.bind(this), this.boundPointerMove = this.handlePointerMove.bind(this), this.boundPointerUp = this.handlePointerUp.bind(this), this.boundPointerCancel = this.handlePointerCancel.bind(this), this.boundRowPointerDown = (e) => this.handlePointerDown("row", e), this.boundColPointerDown = (e) => this.handlePointerDown("col", e), this.addRowBtn = this.createAddRowButton(), this.addColBtn = this.createAddColumnButton(), this.wrapper.appendChild(this.addRowBtn), this.grid.appendChild(this.addColBtn), this.syncRowButtonWidth(), this.wrapper.addEventListener("mousemove", this.boundMouseMove), this.wrapper.addEventListener("mouseleave", this.boundMouseLeave), this.addRowBtn.addEventListener("pointerdown", this.boundRowPointerDown), this.addColBtn.addEventListener("pointerdown", this.boundColPointerDown);
+    this.rowHideTimeout = null, this.colHideTimeout = null, this.rowVisible = !1, this.colVisible = !1, this.interactive = !0, this.dragState = null, this.wrapper = t.wrapper, this.grid = t.grid, this.i18n = t.i18n, this.boundAddRowClick = t.onAddRow, this.boundAddColClick = t.onAddColumn, this.onDragStart = t.onDragStart, this.onDragAddRow = t.onDragAddRow, this.onDragRemoveRow = t.onDragRemoveRow, this.onDragAddCol = t.onDragAddCol, this.onDragRemoveCol = t.onDragRemoveCol, this.onDragEnd = t.onDragEnd, this.getNewColumnWidth = t.getNewColumnWidth, this.boundMouseMove = this.handleMouseMove.bind(this), this.boundMouseLeave = this.handleMouseLeave.bind(this), this.boundPointerMove = this.handlePointerMove.bind(this), this.boundPointerUp = this.handlePointerUp.bind(this), this.boundPointerCancel = this.handlePointerCancel.bind(this), this.boundRowPointerDown = (e) => this.handlePointerDown("row", e), this.boundColPointerDown = (e) => this.handlePointerDown("col", e), this.addRowBtn = this.createAddRowButton(), this.addColBtn = this.createAddColumnButton(), this.wrapper.appendChild(this.addRowBtn), this.wrapper.appendChild(this.addColBtn), this.syncRowButtonWidth(), this.wrapper.addEventListener("mousemove", this.boundMouseMove), this.wrapper.addEventListener("mouseleave", this.boundMouseLeave), this.addRowBtn.addEventListener("pointerdown", this.boundRowPointerDown), this.addColBtn.addEventListener("pointerdown", this.boundColPointerDown);
   }
   /**
-   * Match the add-row button width to the grid's explicit width.
-   * When the grid has a pixel width (from colWidths), the button must use
-   * the same value so it scrolls with the table instead of staying at 100%
-   * of the wrapper's visible area.
+   * Match the add-row button width and horizontal position to the grid.
+   *
+   * Pixel mode (colWidths set): clamp to the scroll container's visible
+   * width so the button never overflows the table boundary.
+   *
+   * Percent mode (no colWidths): clear `width` and use `left`/`right`
+   * constraints so the browser auto-sizes the button to the wrapper's
+   * content area, avoiding the wrapper's right padding.
    */
   syncRowButtonWidth() {
     const t = this.grid.style.width;
-    this.addRowBtn.style.width = t && t.endsWith("px") ? t : "100%";
+    if (t && t.endsWith("px")) {
+      const e = parseFloat(t), n = this.grid.parentElement, s = n !== null && n !== this.wrapper && n.clientWidth > 0 ? Math.min(e, n.clientWidth) : e;
+      this.addRowBtn.style.width = `${s}px`, this.addRowBtn.style.right = "", this.addRowBtn.style.left = "0px", this.addRowBtn.style.transform = "", this.addColBtn.style.left = `${s}px`, this.addColBtn.style.right = "";
+    } else {
+      this.addRowBtn.style.width = "", this.addRowBtn.style.left = "0px", this.addRowBtn.style.transform = "";
+      const e = parseFloat(getComputedStyle(this.wrapper).paddingRight) || 0;
+      this.addRowBtn.style.right = `${e}px`, this.addColBtn.style.left = "", this.addColBtn.style.right = "-16px";
+    }
   }
   /**
    * Toggle display of both add buttons.
@@ -1823,7 +1835,7 @@ class yo {
       e === "row" ? this.onDragAddRow() : this.onDragAddCol(), this.dragState.addedCount++;
     for (; this.dragState.addedCount > l; )
       e === "row" ? this.onDragRemoveRow() : this.onDragRemoveCol(), this.dragState.addedCount--;
-    Math.abs(i) > Co && !this.dragState.didDrag && (this.dragState.didDrag = !0, document.body.style.cursor = e === "row" ? "row-resize" : "col-resize", We(), this.onDragStart());
+    Math.abs(i) > So && !this.dragState.didDrag && (this.dragState.didDrag = !0, document.body.style.cursor = e === "row" ? "row-resize" : "col-resize", ze(), this.onDragStart());
   }
   handlePointerUp(t) {
     if (!this.dragState)
@@ -1859,8 +1871,8 @@ class yo {
     return (o == null ? void 0 : o.offsetWidth) || 100;
   }
   handleMouseMove(t) {
-    const e = this.grid.getBoundingClientRect(), n = Math.abs(t.clientY - e.bottom), o = Math.abs(t.clientX - e.right);
-    n <= Ht ? this.showRow() : this.scheduleHideRow(), o <= Ht ? this.showCol() : this.scheduleHideCol();
+    const e = this.grid.getBoundingClientRect(), n = this.grid.parentElement, s = n !== null && n !== this.wrapper ? Math.min(e.right, n.getBoundingClientRect().right) : e.right, i = Math.abs(t.clientY - e.bottom), l = Math.abs(t.clientX - s);
+    i <= Wt ? this.showRow() : this.scheduleHideRow(), l <= Wt ? this.showCol() : this.scheduleHideCol();
   }
   handleMouseLeave() {
     this.scheduleHideRow(), this.scheduleHideCol();
@@ -1875,13 +1887,13 @@ class yo {
     var t;
     !this.rowVisible || this.rowHideTimeout !== null || ((t = this.dragState) == null ? void 0 : t.axis) === "row" || (this.rowHideTimeout = setTimeout(() => {
       this.addRowBtn.style.opacity = "0", this.addRowBtn.style.pointerEvents = "none", this.rowVisible = !1, this.rowHideTimeout = null;
-    }, Nt));
+    }, _t));
   }
   scheduleHideCol() {
     var t;
     !this.colVisible || this.colHideTimeout !== null || ((t = this.dragState) == null ? void 0 : t.axis) === "col" || (this.colHideTimeout = setTimeout(() => {
       this.addColBtn.style.opacity = "0", this.addColBtn.style.pointerEvents = "none", this.colVisible = !1, this.colHideTimeout = null;
-    }, Nt));
+    }, _t));
   }
   clearRowTimeout() {
     this.rowHideTimeout !== null && (clearTimeout(this.rowHideTimeout), this.rowHideTimeout = null);
@@ -1891,31 +1903,31 @@ class yo {
   }
   createAddRowButton() {
     const t = document.createElement("div");
-    t.className = w(Ot, "group/add", "items-start", "cursor-row-resize"), t.setAttribute(fo, ""), t.setAttribute("contenteditable", "false"), t.style.opacity = "0", t.style.pointerEvents = "none", t.style.position = "absolute", t.style.left = "0", t.style.bottom = "-36px", t.style.boxSizing = "content-box", t.style.width = "100%", t.style.height = "32px", t.style.padding = "4px 8px 0", t.style.marginLeft = "-8px";
+    t.className = v(Gt, "group/add", "items-start", "cursor-row-resize"), t.setAttribute(bo, ""), t.setAttribute("contenteditable", "false"), t.style.opacity = "0", t.style.pointerEvents = "none", t.style.position = "absolute", t.style.left = "0", t.style.bottom = "-36px", t.style.zIndex = "1", t.style.height = "32px";
     const e = document.createElement("div");
-    return e.className = w(Mt), e.style.width = "100%", e.style.height = "16px", this.appendIcon(e), t.appendChild(e), xt(t, Tt([
+    return e.className = v($t), e.style.width = "100%", e.style.height = "16px", this.appendIcon(e), t.appendChild(e), Tt(t, Bt([
       this.i18n.t("tools.table.clickToAddRow"),
       this.i18n.t("tools.table.dragToAddRemoveRows")
     ]), { placement: "bottom", marginTop: -16 }), t;
   }
   createAddColumnButton() {
     const t = document.createElement("div");
-    t.className = w(Ot, "group/add", "justify-start", "cursor-col-resize"), t.setAttribute(mo, ""), t.setAttribute("contenteditable", "false"), t.style.opacity = "0", t.style.pointerEvents = "none", t.style.position = "absolute", t.style.right = "-36px", t.style.top = "0px", t.style.bottom = "0px", t.style.width = "32px";
+    t.className = v(Gt, "group/add", "justify-start", "cursor-col-resize"), t.setAttribute(vo, ""), t.setAttribute("contenteditable", "false"), t.style.opacity = "0", t.style.pointerEvents = "none", t.style.position = "absolute", t.style.right = "-16px", t.style.top = "0px", t.style.bottom = "0px", t.style.width = "32px";
     const e = document.createElement("div");
-    return e.className = w(Mt), e.style.width = "16px", e.style.height = "100%", this.appendIcon(e), t.appendChild(e), xt(t, Tt([
+    return e.className = v($t), e.style.width = "16px", e.style.height = "100%", this.appendIcon(e), t.appendChild(e), Tt(t, Bt([
       this.i18n.t("tools.table.clickToAddColumn"),
       this.i18n.t("tools.table.dragToAddRemoveColumns")
     ]), { placement: "bottom" }), t;
   }
   appendIcon(t) {
-    t.insertAdjacentHTML("beforeend", Ge);
+    t.insertAdjacentHTML("beforeend", Ve);
     const e = t.querySelector("svg");
-    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"));
+    e && (e.setAttribute("width", qt), e.setAttribute("height", qt), e.setAttribute("viewBox", "0 0 24 24"), e.classList.add("text-gray-500", "pointer-events-none"));
   }
 }
-const f = "data-blok-table-row", g = "data-blok-table-cell", M = 1, st = `${M}px solid #d1d5db`, bo = [
+const m = "data-blok-table-row", g = "data-blok-table-cell", M = 1, st = `${M}px solid #d1d5db`, ko = [
   "flex"
-], vo = [
+], Ao = [
   "py-1",
   "px-2",
   "min-h-[2em]",
@@ -1923,11 +1935,11 @@ const f = "data-blok-table-row", g = "data-blok-table-cell", M = 1, st = `${M}px
   "leading-normal",
   "text-sm",
   "cursor-text"
-], wo = (r) => {
+], Eo = (r) => {
   const t = Math.round(100 / r * 100) / 100;
   return Array.from({ length: r }, () => t);
 };
-class So {
+class xo {
   constructor(t) {
     this.readOnly = t.readOnly;
   }
@@ -1937,7 +1949,7 @@ class So {
   createGrid(t, e, n) {
     const o = document.createElement("div");
     o.style.borderTop = st, o.style.borderLeft = st;
-    const s = n != null ? n : wo(e);
+    const s = n != null ? n : Eo(e);
     return Array.from({ length: t }).forEach(() => {
       o.appendChild(this.createRow(e, s));
     }), o;
@@ -1953,14 +1965,14 @@ class So {
    * Otherwise appends at the end.
    */
   addRow(t, e) {
-    const n = this.getColumnCount(t), o = this.getRawCellWidths(t), s = this.createRow(n, o), i = t.querySelectorAll(`[${f}]`);
+    const n = this.getColumnCount(t), o = this.getRawCellWidths(t), s = this.createRow(n, o), i = t.querySelectorAll(`[${m}]`);
     return e !== void 0 && e < i.length ? t.insertBefore(s, i[e]) : t.appendChild(s), s;
   }
   /**
    * Delete a row at index
    */
   deleteRow(t, e) {
-    const n = t.querySelectorAll(`[${f}]`);
+    const n = t.querySelectorAll(`[${m}]`);
     e < n.length && n[e].remove();
   }
   /**
@@ -1972,7 +1984,7 @@ class So {
    * existing columns from shrinking when the table is in percent mode.
    */
   addColumn(t, e, n, o) {
-    const s = t.querySelectorAll(`[${f}]`), i = this.getColumnCount(t), l = n !== void 0 && n.length === i, a = l || this.detectWidthUnit(t) === "px";
+    const s = t.querySelectorAll(`[${m}]`), i = this.getColumnCount(t), l = n !== void 0 && n.length === i, a = l || this.detectWidthUnit(t) === "px";
     return l && this.convertToPixelWidths(s, n), a ? (this.addColumnPx(s, i, e, o), !0) : (this.addColumnPercent(s, i, e), !0);
   }
   /**
@@ -2016,8 +2028,8 @@ class So {
     const s = 1 - 0.5 / e;
     t.forEach((i) => {
       i.querySelectorAll(`[${g}]`).forEach((u) => {
-        const p = u, m = parseFloat(p.style.width) || 100 / e, C = Math.round(m * s * 100) / 100;
-        p.style.width = `${C}%`;
+        const p = u, C = parseFloat(p.style.width) || 100 / e, f = Math.round(C * s * 100) / 100;
+        p.style.width = `${f}%`;
       });
       const a = Math.round(100 / e / 2 * 100) / 100, c = i.querySelectorAll(`[${g}]`), d = n === void 0 || n >= c.length, h = this.createCell(`${a}%`);
       if (!d) {
@@ -2031,7 +2043,7 @@ class So {
    * Delete a column at index
    */
   deleteColumn(t, e) {
-    t.querySelectorAll(`[${f}]`).forEach((o) => {
+    t.querySelectorAll(`[${m}]`).forEach((o) => {
       const s = o.querySelectorAll(`[${g}]`);
       e >= s.length || s[e].remove();
     });
@@ -2043,12 +2055,12 @@ class So {
   moveRow(t, e, n) {
     if (e === n)
       return;
-    const o = Array.from(t.querySelectorAll(`[${f}]`));
+    const o = Array.from(t.querySelectorAll(`[${m}]`));
     if (e >= o.length || n >= o.length)
       return;
     const s = o[e];
     s.remove();
-    const i = Array.from(t.querySelectorAll(`[${f}]`));
+    const i = Array.from(t.querySelectorAll(`[${m}]`));
     n >= i.length ? t.appendChild(s) : t.insertBefore(s, i[n]);
   }
   /**
@@ -2058,7 +2070,7 @@ class So {
   moveColumn(t, e, n) {
     if (e === n)
       return;
-    t.querySelectorAll(`[${f}]`).forEach((s) => {
+    t.querySelectorAll(`[${m}]`).forEach((s) => {
       const i = Array.from(s.querySelectorAll(`[${g}]`));
       if (e >= i.length || n >= i.length)
         return;
@@ -2072,20 +2084,20 @@ class So {
    * Get number of rows
    */
   getRowCount(t) {
-    return t.querySelectorAll(`[${f}]`).length;
+    return t.querySelectorAll(`[${m}]`).length;
   }
   /**
    * Get number of columns (from first row)
    */
   getColumnCount(t) {
-    const e = t.querySelector(`[${f}]`);
+    const e = t.querySelector(`[${m}]`);
     return e ? e.querySelectorAll(`[${g}]`).length : 0;
   }
   /**
    * Get a specific cell element
    */
   getCell(t, e, n) {
-    const o = t.querySelectorAll(`[${f}]`);
+    const o = t.querySelectorAll(`[${m}]`);
     if (e >= o.length)
       return null;
     const s = o[e].querySelectorAll(`[${g}]`);
@@ -2095,7 +2107,7 @@ class So {
    * Read column widths from the DOM
    */
   getColWidths(t) {
-    const e = t.querySelector(`[${f}]`);
+    const e = t.querySelector(`[${m}]`);
     if (!e)
       return [];
     const n = e.querySelectorAll(`[${g}]`), o = [];
@@ -2108,7 +2120,7 @@ class So {
    * Detect whether cells use 'px' or '%' widths
    */
   detectWidthUnit(t) {
-    const e = t.querySelector(`[${f}]`);
+    const e = t.querySelector(`[${m}]`);
     if (!e)
       return "%";
     const n = e.querySelector(`[${g}]`);
@@ -2118,7 +2130,7 @@ class So {
    * Read raw CSS width strings (e.g. "200px", "33.33%") from first row cells
    */
   getRawCellWidths(t) {
-    const e = t.querySelector(`[${f}]`);
+    const e = t.querySelector(`[${m}]`);
     if (!e)
       return [];
     const n = e.querySelectorAll(`[${g}]`);
@@ -2129,7 +2141,7 @@ class So {
    */
   createRow(t, e) {
     const n = document.createElement("div");
-    return n.className = w(bo), n.setAttribute(f, ""), Array.from({ length: t }).forEach((o, s) => {
+    return n.className = v(ko), n.setAttribute(m, ""), Array.from({ length: t }).forEach((o, s) => {
       n.appendChild(this.createCell(e[s]));
     }), n;
   }
@@ -2138,13 +2150,13 @@ class So {
    */
   createCell(t) {
     const e = document.createElement("div");
-    e.className = w(vo), e.style.borderRight = st, e.style.borderBottom = st, e.style.flexShrink = "0", e.style.overflow = "hidden", e.style.overflowWrap = "break-word", t !== void 0 && (e.style.width = typeof t == "string" ? t : `${t}%`), e.setAttribute(g, "");
+    e.className = v(Ao), e.style.borderRight = st, e.style.borderBottom = st, e.style.flexShrink = "0", e.style.overflow = "hidden", e.style.overflowWrap = "break-word", t !== void 0 && (e.style.width = typeof t == "string" ? t : `${t}%`), e.setAttribute(g, "");
     const n = document.createElement("div");
     return n.setAttribute(R, ""), e.appendChild(n), e;
   }
 }
 const ut = (r) => typeof r == "object" && r !== null && "blocks" in r, R = "data-blok-table-cell-blocks";
-class ko {
+class To {
   constructor(t) {
     var e;
     this._activeCellWithBlocks = null, this.cellsPendingCheck = /* @__PURE__ */ new Set(), this.pendingCheckScheduled = !1, this.removedBlockCells = /* @__PURE__ */ new Map(), this.deferredEvents = [], this.handleBlockMutation = (n) => {
@@ -2159,7 +2171,7 @@ class ko {
         this.handleBlockRemoved(s);
         return;
       }
-      if (o !== "block-added")
+      if (o !== "block-added" || s.target.id === this.tableBlockId)
         return;
       const i = s.index;
       if (i === void 0)
@@ -2172,8 +2184,16 @@ class ko {
       const a = s.target.holder, c = a.closest(`[${R}]`);
       c && this.stripPlaceholders(c);
       const d = c && !this.model.findCellForBlock(s.target.id) ? c.closest(`[${g}]`) : null;
-      if (d && this.syncBlockToModel(d, s.target.id), c || !this.gridElement.contains(a))
+      if (d && this.syncBlockToModel(d, s.target.id), c)
         return;
+      if (!this.gridElement.contains(a)) {
+        const u = this.api.blocks.getCurrentBlockIndex(), p = u >= 0 ? this.api.blocks.getBlockByIndex(u) : null;
+        if (!(p != null && this.getOwnedCellForBlock(p.id) !== null))
+          return;
+        const f = this.findCellForNewBlock(i);
+        f && (this.claimBlockForCell(f, s.target.id), this.syncBlockToModel(f, s.target.id), this.cellsPendingCheck.delete(f));
+        return;
+      }
       const h = this.findCellForNewBlock(i);
       h && (this.claimBlockForCell(h, s.target.id), this.syncBlockToModel(h, s.target.id), this.cellsPendingCheck.delete(h));
     }, this.handleCellBlankSpaceClick = (n) => {
@@ -2301,7 +2321,7 @@ class ko {
    * - If referenced blocks are missing from BlockManager, a fallback paragraph is created.
    */
   initializeCells(t) {
-    const e = this.gridElement.querySelectorAll(`[${f}]`), n = [];
+    const e = this.gridElement.querySelectorAll(`[${m}]`), n = [];
     return t.forEach((o, s) => {
       const i = e[s];
       if (!i)
@@ -2314,12 +2334,12 @@ class ko {
         const u = h.querySelector(`[${R}]`);
         if (!u)
           return;
-        const p = ut(c) && c.blocks.length > 0 ? [...c.blocks] : null, m = p ? this.mountBlocksInCell(u, p) : [];
-        if (m.length > 0)
-          a.push({ blocks: p != null ? p : m });
+        const p = ut(c) && c.blocks.length > 0 ? [...c.blocks] : null, C = p ? this.mountBlocksInCell(u, p) : [];
+        if (C.length > 0)
+          a.push({ blocks: p != null ? p : C });
         else {
-          const C = typeof c == "string" ? c : "", y = C.split(/<br\s*\/?>/i).map((A) => A.trim()).filter(Boolean), v = y.length > 0 ? y : [C], k = [];
-          for (const A of v) {
+          const f = typeof c == "string" ? c : "", y = f.split(/<br\s*\/?>/i).map((A) => A.trim()).filter(Boolean), S = y.length > 0 ? y : [f], k = [];
+          for (const A of S) {
             const T = this.api.blocks.insert("paragraph", { text: A }, {}, this.api.blocks.getBlocksCount(), !1);
             u.appendChild(T.holder), this.api.blocks.setBlockParent(T.id, this.tableBlockId), k.push(T.id);
           }
@@ -2368,7 +2388,7 @@ class ko {
     if (o === void 0)
       return;
     const s = this.api.blocks.getBlockByIndex(o);
-    s && (n.appendChild(s.holder), this.api.blocks.setBlockParent(e, this.tableBlockId), this.stripPlaceholders(n));
+    s && (s.holder.contains(n) || (n.appendChild(s.holder), this.api.blocks.setBlockParent(e, this.tableBlockId), this.stripPlaceholders(n)));
   }
   /**
    * Given a new block's index, find which cell it should belong to
@@ -2424,10 +2444,10 @@ class ko {
    * Get the row/col position of a cell element within the grid.
    */
   getCellPosition(t) {
-    const e = t.closest(`[${f}]`);
+    const e = t.closest(`[${m}]`);
     if (!e)
       return null;
-    const o = Array.from(this.gridElement.querySelectorAll(`[${f}]`)).indexOf(e);
+    const o = Array.from(this.gridElement.querySelectorAll(`[${m}]`)).indexOf(e);
     if (o < 0)
       return null;
     const i = Array.from(e.querySelectorAll(`[${g}]`)).indexOf(t);
@@ -2581,21 +2601,21 @@ class ko {
     this.deferredEvents.length = 0;
   }
 }
-const Z = 16, Ao = [
+const Z = 16, Bo = [
   [2, 2],
   [8, 2],
   [2, 7],
   [8, 7],
   [2, 12],
   [8, 12]
-], Eo = [
+], Ro = [
   [2, 2],
   [7, 2],
   [12, 2],
   [2, 8],
   [7, 8],
   [12, 8]
-], fe = (r) => {
+], ve = (r) => {
   const t = document.createElementNS("http://www.w3.org/2000/svg", "svg"), e = r === "horizontal";
   t.setAttribute("width", e ? "14" : "10"), t.setAttribute("height", e ? "10" : "14"), t.setAttribute("viewBox", e ? "0 0 14 10" : "0 0 10 14"), t.setAttribute("fill", "currentColor"), t.classList.add(
     "opacity-0",
@@ -2604,13 +2624,13 @@ const Z = 16, Ao = [
     "text-gray-400",
     "pointer-events-none"
   );
-  const n = e ? Eo : Ao;
+  const n = e ? Ro : Bo;
   for (const [o, s] of n) {
     const i = document.createElementNS("http://www.w3.org/2000/svg", "circle");
     i.setAttribute("cx", String(o)), i.setAttribute("cy", String(s)), i.setAttribute("r", "1.5"), t.appendChild(i);
   }
   return t;
-}, xo = (r, t) => {
+}, Lo = (r, t) => {
   t === "col" ? Object.assign(r.style, { height: `${Z}px` }) : Object.assign(r.style, { width: `${Z}px` }), r.classList.add("bg-gray-200"), r.classList.remove("bg-gray-300");
   const e = r.querySelector("svg");
   e && (e.classList.remove("opacity-0"), e.classList.add("opacity-100"));
@@ -2618,7 +2638,7 @@ const Z = 16, Ao = [
   t === "col" ? Object.assign(r.style, { height: `${e}px` }) : Object.assign(r.style, { width: `${e}px` }), r.classList.remove("bg-gray-200"), r.classList.add("bg-gray-300");
   const n = r.querySelector("svg");
   n && (n.classList.add("opacity-0"), n.classList.remove("opacity-100"));
-}, mt = "data-blok-table-cell-selected", To = "2px solid #3b82f6", Ct = "data-blok-table-selection-pill", Bo = 16, Ro = 20, Wt = 4, Io = [
+}, mt = "data-blok-table-cell-selected", Io = "2px solid #3b82f6", Ct = "data-blok-table-selection-pill", Do = 16, Ho = 20, Ft = 4, Po = [
   "absolute",
   "z-[3]",
   "rounded",
@@ -2631,10 +2651,10 @@ const Z = 16, Ao = [
   "overflow-hidden",
   "cursor-pointer",
   "bg-blue-500"
-], Lo = (r) => r.style.userSelect === "none";
-class Gt {
+], No = (r) => r.style.userSelect === "none";
+class zt {
   constructor(t) {
-    this.anchorCell = null, this.extentCell = null, this.isSelecting = !1, this.hasSelection = !1, this.selectedCells = [], this.overlay = null, this.pill = null, this.pillPopover = null, this.grid = t.grid, this.rectangleSelection = t.rectangleSelection, this.onSelectionActiveChange = t.onSelectionActiveChange, this.onClearContent = t.onClearContent, this.onCopy = t.onCopy, this.onCut = t.onCut, this.i18n = t.i18n, this.grid.style.position = "relative", this.boundPointerDown = this.handlePointerDown.bind(this), this.boundPointerMove = this.handlePointerMove.bind(this), this.boundPointerUp = this.handlePointerUp.bind(this), this.boundClearSelection = this.handleClearSelection.bind(this), this.boundCancelRectangle = this.handleCancelRectangle.bind(this), this.boundKeyDown = this.handleKeyDown.bind(this), this.boundCopyHandler = this.handleCopy.bind(this), this.boundCutHandler = this.handleCut.bind(this), this.grid.addEventListener("pointerdown", this.boundPointerDown), document.addEventListener("keydown", this.boundKeyDown), document.addEventListener("copy", this.boundCopyHandler), document.addEventListener("cut", this.boundCutHandler);
+    this.anchorCell = null, this.extentCell = null, this.isSelecting = !1, this.hasSelection = !1, this.selectedCells = [], this.overlay = null, this.pill = null, this.pillPopover = null, this.grid = t.grid, this.rectangleSelection = t.rectangleSelection, this.onSelectionActiveChange = t.onSelectionActiveChange, this.onClearContent = t.onClearContent, this.onCopy = t.onCopy, this.onCut = t.onCut, this.onCopyViaButton = t.onCopyViaButton, this.isPopoverOpen = t.isPopoverOpen, this.i18n = t.i18n, this.grid.style.position = "relative", this.boundPointerDown = this.handlePointerDown.bind(this), this.boundPointerMove = this.handlePointerMove.bind(this), this.boundPointerUp = this.handlePointerUp.bind(this), this.boundClearSelection = this.handleClearSelection.bind(this), this.boundCancelRectangle = this.handleCancelRectangle.bind(this), this.boundKeyDown = this.handleKeyDown.bind(this), this.boundCopyHandler = this.handleCopy.bind(this), this.boundCutHandler = this.handleCut.bind(this), this.grid.addEventListener("pointerdown", this.boundPointerDown), document.addEventListener("keydown", this.boundKeyDown), document.addEventListener("copy", this.boundCopyHandler), document.addEventListener("cut", this.boundCutHandler);
   }
   destroy() {
     this.destroyPillPopover(), this.clearSelection(), this.grid.removeEventListener("pointerdown", this.boundPointerDown), document.removeEventListener("pointermove", this.boundPointerMove), document.removeEventListener("pointerup", this.boundPointerUp), document.removeEventListener("pointerdown", this.boundClearSelection), document.removeEventListener("mousemove", this.boundCancelRectangle, !0), document.removeEventListener("keydown", this.boundKeyDown), document.removeEventListener("copy", this.boundCopyHandler), document.removeEventListener("cut", this.boundCutHandler);
@@ -2644,14 +2664,14 @@ class Gt {
    */
   selectRow(t) {
     var o, s;
-    const n = (s = (o = this.grid.querySelectorAll(`[${f}]`)[0]) == null ? void 0 : o.querySelectorAll(`[${g}]`).length) != null ? s : 0;
+    const n = (s = (o = this.grid.querySelectorAll(`[${m}]`)[0]) == null ? void 0 : o.querySelectorAll(`[${g}]`).length) != null ? s : 0;
     n !== 0 && this.showProgrammaticSelection(t, 0, t, n - 1);
   }
   /**
    * Programmatically select an entire column.
    */
   selectColumn(t) {
-    const n = this.grid.querySelectorAll(`[${f}]`).length;
+    const n = this.grid.querySelectorAll(`[${m}]`).length;
     n !== 0 && this.showProgrammaticSelection(0, t, n - 1, t);
   }
   /**
@@ -2661,7 +2681,7 @@ class Gt {
     this.clearSelection();
   }
   handlePointerDown(t) {
-    if (Lo(this.grid) || t.button !== 0)
+    if (No(this.grid) || t.button !== 0)
       return;
     const e = t.target;
     if (e.closest("[data-blok-table-grip]") || e.closest("[data-blok-table-resize]") || e.closest(`[${Ct}]`))
@@ -2697,8 +2717,9 @@ class Gt {
     document.removeEventListener("mousemove", this.boundCancelRectangle, !0), document.removeEventListener("pointermove", this.boundPointerMove), document.removeEventListener("pointerup", this.boundPointerUp), this.isSelecting && (this.grid.style.userSelect = "", this.hasSelection = !0, document.addEventListener("pointerdown", this.boundClearSelection)), this.isSelecting = !1, this.anchorCell = null, this.extentCell = null;
   }
   handleClearSelection(t) {
+    var n;
     const e = t.target;
-    e instanceof HTMLElement && e.closest(`[${Ct}]`) || this.pillPopover === null && (document.removeEventListener("pointerdown", this.boundClearSelection), this.clearSelection());
+    e instanceof HTMLElement && e.closest(`[${Ct}]`) || this.pillPopover === null && ((n = this.isPopoverOpen) != null && n.call(this) || (document.removeEventListener("pointerdown", this.boundClearSelection), this.clearSelection()));
   }
   handleKeyDown(t) {
     var e;
@@ -2733,20 +2754,20 @@ class Gt {
     this.selectedCells.forEach((T) => {
       T.removeAttribute(mt);
     }), this.selectedCells = [];
-    const t = Math.min(this.anchorCell.row, this.extentCell.row), e = Math.max(this.anchorCell.row, this.extentCell.row), n = Math.min(this.anchorCell.col, this.extentCell.col), o = Math.max(this.anchorCell.col, this.extentCell.col), s = this.grid.querySelectorAll(`[${f}]`);
+    const t = Math.min(this.anchorCell.row, this.extentCell.row), e = Math.max(this.anchorCell.row, this.extentCell.row), n = Math.min(this.anchorCell.col, this.extentCell.col), o = Math.max(this.anchorCell.col, this.extentCell.col), s = this.grid.querySelectorAll(`[${m}]`);
     this.selectedCells = this.collectCellsInRange(s, t, e, n, o), this.selectedCells.forEach((T) => {
       T.setAttribute(mt, "");
     });
     const i = (k = s[t]) == null ? void 0 : k.querySelectorAll(`[${g}]`)[n], l = (A = s[e]) == null ? void 0 : A.querySelectorAll(`[${g}]`)[o];
     if (!i || !l)
       return;
-    const a = this.grid.getBoundingClientRect(), c = i.getBoundingClientRect(), d = l.getBoundingClientRect(), h = getComputedStyle(this.grid), u = parseFloat(h.borderTopWidth) || 0, p = parseFloat(h.borderLeftWidth) || 0, m = d.right - c.left + 1, C = d.bottom - c.top + 1, y = c.top - a.top - u - 1, v = c.left - a.left - p - 1;
-    this.overlay || (this.overlay = document.createElement("div"), this.overlay.setAttribute("data-blok-table-selection-overlay", ""), this.overlay.style.position = "absolute", this.overlay.style.border = To, this.overlay.style.pointerEvents = "none", this.overlay.style.boxSizing = "border-box", this.overlay.style.borderRadius = "2px", this.grid.appendChild(this.overlay)), this.overlay.style.top = `${y}px`, this.overlay.style.left = `${v}px`, this.overlay.style.width = `${m}px`, this.overlay.style.height = `${C}px`, this.pill || (this.pill = this.createPill(), this.grid.appendChild(this.pill)), this.pill.style.left = `${v + m - 1}px`, this.pill.style.top = `${y + C / 2}px`;
+    const a = this.grid.getBoundingClientRect(), c = i.getBoundingClientRect(), d = l.getBoundingClientRect(), h = getComputedStyle(this.grid), u = parseFloat(h.borderTopWidth) || 0, p = parseFloat(h.borderLeftWidth) || 0, C = d.right - c.left + 1, f = d.bottom - c.top + 1, y = c.top - a.top - u - 1, S = c.left - a.left - p - 1;
+    this.overlay || (this.overlay = document.createElement("div"), this.overlay.setAttribute("data-blok-table-selection-overlay", ""), this.overlay.style.position = "absolute", this.overlay.style.border = Io, this.overlay.style.pointerEvents = "none", this.overlay.style.boxSizing = "border-box", this.overlay.style.borderRadius = "2px", this.grid.appendChild(this.overlay)), this.overlay.style.top = `${y}px`, this.overlay.style.left = `${S}px`, this.overlay.style.width = `${C}px`, this.overlay.style.height = `${f}px`, this.pill || (this.pill = this.createPill(), this.grid.appendChild(this.pill)), this.pill.style.left = `${S + C - 1}px`, this.pill.style.top = `${y + f / 2}px`;
   }
   createPill() {
     const t = document.createElement("div");
-    t.setAttribute(Ct, ""), t.setAttribute("contenteditable", "false"), t.className = w(Io), t.style.width = `${Wt}px`, t.style.height = `${Ro}px`, t.style.pointerEvents = "auto", t.style.transform = "translate(-50%, -50%)", t.style.outline = "2px solid white";
-    const e = fe("vertical");
+    t.setAttribute(Ct, ""), t.setAttribute("contenteditable", "false"), t.className = v(Po), t.style.width = `${Ft}px`, t.style.height = `${Ho}px`, t.style.pointerEvents = "auto", t.style.transform = "translate(-50%, -50%)", t.style.outline = "2px solid white";
+    const e = ve("vertical");
     return e.classList.remove("text-gray-400"), e.classList.add("text-white"), t.appendChild(e), t.addEventListener("mouseenter", () => {
       this.pillPopover === null && this.expandPill();
     }), t.addEventListener("mouseleave", () => {
@@ -2759,36 +2780,47 @@ class Gt {
     if (this.destroyPillPopover(), !this.pill)
       return;
     this.expandPill();
-    const t = [
+    const t = je === "Meta" ? "⌘C" : "Ctrl+C", e = [
       {
-        icon: $e,
+        icon: Ue,
+        title: this.i18n.t("tools.table.copySelection"),
+        secondaryLabel: t,
+        closeOnActivate: !0,
+        onActivate: () => {
+          var n;
+          (n = this.onCopyViaButton) == null || n.call(this, [...this.selectedCells]);
+        }
+      },
+      {
+        icon: Ke,
         title: this.i18n.t("tools.table.clearSelection"),
+        secondaryLabel: "Del",
         closeOnActivate: !0,
         onActivate: () => {
-          var e;
-          (e = this.onClearContent) == null || e.call(this, [...this.selectedCells]), this.clearSelection();
+          var n;
+          (n = this.onClearContent) == null || n.call(this, [...this.selectedCells]), this.clearSelection();
         }
       }
     ];
-    this.pillPopover = new ne({
-      items: t,
+    this.pillPopover = new le({
+      items: e,
       trigger: this.pill,
       flippable: !0
-    }), this.pillPopover.on(oe.Closed, () => {
+    }), this.pillPopover.on(ae.Closed, () => {
       this.pillPopover !== null && (this.destroyPillPopover(), this.collapsePill());
     }), this.pillPopover.show();
   }
   expandPill() {
     if (!this.pill)
       return;
-    this.pill.style.width = `${Bo}px`;
+    this.pill.style.width = `${Do}px`;
     const t = this.pill.querySelector("svg");
     t && (t.classList.remove("opacity-0"), t.classList.add("opacity-100"));
   }
   collapsePill() {
     if (!this.pill)
       return;
-    this.pill.style.width = `${Wt}px`;
+    this.pill.style.width = `${Ft}px`;
     const t = this.pill.querySelector("svg");
     t && (t.classList.add("opacity-0"), t.classList.remove("opacity-100"));
   }
@@ -2802,23 +2834,23 @@ class Gt {
     const e = t.closest(`[${g}]`);
     if (!e)
       return null;
-    const n = e.closest(`[${f}]`);
+    const n = e.closest(`[${m}]`);
     if (!n || !this.grid.contains(n))
       return null;
-    const s = Array.from(this.grid.querySelectorAll(`[${f}]`)).indexOf(n);
+    const s = Array.from(this.grid.querySelectorAll(`[${m}]`)).indexOf(n);
     if (s < 0)
       return null;
     const l = Array.from(n.querySelectorAll(`[${g}]`)).indexOf(e);
     return l < 0 ? null : { row: s, col: l };
   }
   clampExtentToEdge(t) {
-    var c, d, h, u, p, m;
+    var c, d, h, u, p, C;
     if (!this.anchorCell || !this.isSelecting)
       return;
-    const e = this.grid.getBoundingClientRect(), n = this.grid.querySelectorAll(`[${f}]`), o = n.length, s = (d = (c = n[0]) == null ? void 0 : c.querySelectorAll(`[${g}]`).length) != null ? d : 0;
+    const e = this.grid.getBoundingClientRect(), n = this.grid.querySelectorAll(`[${m}]`), o = n.length, s = (d = (c = n[0]) == null ? void 0 : c.querySelectorAll(`[${g}]`).length) != null ? d : 0;
     if (o === 0 || s === 0)
       return;
-    const i = this.clampAxis(t.clientY, e.top, e.bottom, o, (u = (h = this.extentCell) == null ? void 0 : h.row) != null ? u : this.anchorCell.row), l = this.clampAxis(t.clientX, e.left, e.right, s, (m = (p = this.extentCell) == null ? void 0 : p.col) != null ? m : this.anchorCell.col), a = { row: i, col: l };
+    const i = this.clampAxis(t.clientY, e.top, e.bottom, o, (u = (h = this.extentCell) == null ? void 0 : h.row) != null ? u : this.anchorCell.row), l = this.clampAxis(t.clientX, e.left, e.right, s, (C = (p = this.extentCell) == null ? void 0 : p.col) != null ? C : this.anchorCell.col), a = { row: i, col: l };
     (!this.extentCell || this.extentCell.row !== a.row || this.extentCell.col !== a.col) && (this.extentCell = a, this.paintSelection());
   }
   collectCellsInRange(t, e, n, o, s) {
@@ -2835,8 +2867,8 @@ class Gt {
     return t < e ? 0 : t > n ? o - 1 : s;
   }
 }
-const V = (r) => {
-  const t = r.querySelector(`[${f}]`);
+const z = (r) => {
+  const t = r.querySelector(`[${m}]`);
   if (!t)
     return [];
   const e = t.querySelectorAll(`[${g}]`);
@@ -2845,7 +2877,7 @@ const V = (r) => {
   );
 }, dt = (r, t) => {
   const e = t.reduce((s, i) => s + i, 0), n = r;
-  n.style.width = `${e + M}px`, r.querySelectorAll(`[${f}]`).forEach((s) => {
+  n.style.width = `${e + M}px`, r.querySelectorAll(`[${m}]`).forEach((s) => {
     s.querySelectorAll(`[${g}]`).forEach((l, a) => {
       if (a < t.length) {
         const c = l;
@@ -2853,30 +2885,30 @@ const V = (r) => {
       }
     });
   });
-}, Do = (r, t) => {
-  const e = Array.from(r.querySelectorAll(`[${f}]`)), n = e.findIndex((i) => Array.from(i.querySelectorAll(`[${g}]`)).includes(t));
+}, Oo = (r, t) => {
+  const e = Array.from(r.querySelectorAll(`[${m}]`)), n = e.findIndex((i) => Array.from(i.querySelectorAll(`[${g}]`)).includes(t));
   if (n === -1)
     return null;
   const s = Array.from(e[n].querySelectorAll(`[${g}]`)).indexOf(t);
   return { row: n, col: s };
-}, me = (r) => {
+}, Se = (r) => {
   var e;
   const t = r.querySelector(`[${R}]`);
   return t ? ((e = t.textContent) != null ? e : "").trim().length === 0 : !0;
-}, Po = (r, t) => {
-  const n = r.querySelectorAll(`[${f}]`)[t];
+}, Mo = (r, t) => {
+  const n = r.querySelectorAll(`[${m}]`)[t];
   if (!n)
     return !0;
   const o = n.querySelectorAll(`[${g}]`);
-  return Array.from(o).every((s) => me(s));
-}, No = (r, t) => {
-  const e = r.querySelectorAll(`[${f}]`);
+  return Array.from(o).every((s) => Se(s));
+}, _o = (r, t) => {
+  const e = r.querySelectorAll(`[${m}]`);
   return Array.from(e).every((n) => {
     const s = n.querySelectorAll(`[${g}]`)[t];
-    return !s || me(s);
+    return !s || Se(s);
   });
-}, Ho = (r) => {
-  const t = r.querySelectorAll(`[${f}]`), e = t[0];
+}, Wo = (r) => {
+  const t = r.querySelectorAll(`[${m}]`), e = t[0];
   if (!e)
     return;
   const n = e.querySelectorAll(`[${g}]`), o = Array.from(n).reduce(
@@ -2892,51 +2924,51 @@ const V = (r) => {
       c.style.width = `${Math.round(d * s * 100) / 100}%`;
     });
   });
-}, Oo = (r, t, e) => {
+}, Go = (r, t, e) => {
   if (!r)
     return r;
   const n = [...r], [o] = n.splice(t, 1);
   return n.splice(e, 0, o), n;
-}, Mo = (r, t) => {
+}, $o = (r, t) => {
   if (!r)
     return r;
   const e = [...r];
   return e.splice(t, 1), e.length > 0 ? e : void 0;
-}, _o = (r, t, e, n, o) => {
-  const s = e != null ? e : V(r), i = n !== void 0 ? Math.round(n / 2 * 100) / 100 : et(s);
+}, qo = (r, t, e, n, o) => {
+  const s = e != null ? e : z(r), i = n !== void 0 ? Math.round(n / 2 * 100) / 100 : et(s);
   o.addColumn(r, t, s, i);
   const l = [...s];
   return l.splice(t, 0, i), l;
 }, et = (r) => Math.round(
   r.reduce((t, e) => t + e, 0) / r.length / 2 * 100
-) / 100, Wo = (r) => r.length === 0 ? 0 : Math.round(r.reduce((t, e) => t + e, 0) / r.length * 100) / 100, Go = (r, t, e) => {
+) / 100, Fo = (r) => r.length === 0 ? 0 : Math.round(r.reduce((t, e) => t + e, 0) / r.length * 100) / 100, zo = (r, t, e) => {
   var s;
   if (!r)
     return [];
-  const o = r.querySelectorAll(`[${f}]`)[e];
+  const o = r.querySelectorAll(`[${m}]`)[e];
   return o ? (s = t == null ? void 0 : t.getBlockIdsFromCells(o.querySelectorAll(`[${g}]`))) != null ? s : [] : [];
-}, $o = (r, t, e) => {
+}, Vo = (r, t, e) => {
   var s;
   if (!r)
     return [];
-  const n = r.querySelectorAll(`[${f}]`), o = [];
+  const n = r.querySelectorAll(`[${m}]`), o = [];
   return n.forEach((i) => {
     const l = i.querySelectorAll(`[${g}]`);
     e < l.length && o.push(l[e]);
   }), (s = t == null ? void 0 : t.getBlockIdsFromCells(o)) != null ? s : [];
-}, N = (r, t) => {
+}, H = (r, t) => {
   r.querySelectorAll(`[${g}]`).forEach((n) => {
     t == null || t.ensureCellHasBlock(n);
   });
-}, qo = (r, t, e, n) => {
-  const o = r.querySelectorAll(`[${f}]`);
+}, Uo = (r, t, e, n) => {
+  const o = r.querySelectorAll(`[${m}]`);
   t.forEach((s, i) => {
     const l = o[i];
     if (!l)
       return;
     const a = l.querySelectorAll(`[${g}]`);
     s.forEach((c, d) => {
-      var m;
+      var C;
       const h = a[d];
       if (!h)
         return;
@@ -2946,23 +2978,28 @@ const V = (r) => {
       const p = u.querySelectorAll("[data-blok-id]").length > 0;
       if (!(!ut(c) && p)) {
         if (!ut(c)) {
-          const C = typeof c == "string" ? c : "";
-          u.textContent = C;
+          const f = typeof c == "string" ? c : "";
+          u.textContent = f;
           return;
         }
-        !p && ((m = u.textContent) != null ? m : "").length > 0 && (u.textContent = "");
-        for (const C of c.blocks) {
-          const y = e.blocks.getBlockIndex(C);
+        !p && ((C = u.textContent) != null ? C : "").length > 0 && (u.textContent = "");
+        for (const f of c.blocks) {
+          const y = e.blocks.getBlockIndex(f);
           if (y === void 0)
             continue;
-          const v = e.blocks.getBlockByIndex(y);
-          v && u.appendChild(v.holder);
+          const S = e.blocks.getBlockByIndex(y);
+          S && u.appendChild(S.holder);
         }
+        u.querySelectorAll("[data-blok-placeholder-active]").forEach((f) => {
+          f.removeAttribute("data-blok-placeholder-active");
+        }), u.querySelectorAll("[data-placeholder]").forEach((f) => {
+          f.removeAttribute("data-placeholder");
+        });
       }
     });
   });
-}, $t = (r, t) => {
-  var l, a, c, d, h, u, p, m, C, y;
+}, Vt = (r, t) => {
+  var l, a, c, d, h, u, p, C, f, y;
   if (!(typeof r == "object" && r !== null && "content" in r))
     return {
       withHeadings: (l = t.withHeadings) != null ? l : !1,
@@ -2974,45 +3011,39 @@ const V = (r) => {
   return {
     withHeadings: (u = (h = n.withHeadings) != null ? h : t.withHeadings) != null ? u : !1,
     withHeadingColumn: (p = n.withHeadingColumn) != null ? p : !1,
-    stretched: (C = (m = n.stretched) != null ? m : t.stretched) != null ? C : !1,
+    stretched: (f = (C = n.stretched) != null ? C : t.stretched) != null ? f : !1,
     content: (y = n.content) != null ? y : [],
     colWidths: i,
     initialColWidth: n.initialColWidth
   };
-}, Fo = (r, t) => {
+}, Ko = (r, t) => {
   r.addEventListener("keydown", (e) => {
     const o = e.target.closest(`[${g}]`);
     if (!o)
       return;
-    const s = Do(r, o);
+    const s = Oo(r, o);
     s && (t == null || t.handleKeyDown(e, s));
   });
-}, Ce = ["overflow-x-auto", "pt-[9px]", "pl-[9px]"], qt = (r) => {
-  r == null || r.classList.add(...Ce);
+}, we = ["overflow-x-auto", "overflow-y-hidden"], Ut = (r) => {
+  r == null || r.classList.add(...we);
 }, tt = (r, t) => {
   if (!r)
     return;
-  const e = r.firstElementChild;
-  if (!e)
-    return;
-  const n = e.querySelectorAll(`[${f}]`);
-  n.forEach((o) => {
-    o.removeAttribute("data-blok-table-heading");
-  }), t && n.length > 0 && n[0].setAttribute("data-blok-table-heading", "");
-}, W = (r, t) => {
+  const e = r.querySelectorAll(`[${m}]`);
+  e.forEach((n) => {
+    n.removeAttribute("data-blok-table-heading");
+  }), t && e.length > 0 && e[0].setAttribute("data-blok-table-heading", "");
+}, G = (r, t) => {
   if (!r)
     return;
-  const e = r.firstElementChild;
-  if (!e)
-    return;
-  e.querySelectorAll(`[${g}]`).forEach((o) => {
-    o.removeAttribute("data-blok-table-heading-col");
-  }), t && e.querySelectorAll(`[${f}]`).forEach((s) => {
-    const i = s.querySelector(`[${g}]`);
-    i && i.setAttribute("data-blok-table-heading-col", "");
+  r.querySelectorAll(`[${g}]`).forEach((n) => {
+    n.removeAttribute("data-blok-table-heading-col");
+  }), t && r.querySelectorAll(`[${m}]`).forEach((o) => {
+    const s = o.querySelector(`[${g}]`);
+    s && s.setAttribute("data-blok-table-heading-col", "");
   });
 };
-class Vo {
+class jo {
   constructor(t) {
     var e, n, o;
     this.withHeadingsValue = (e = t == null ? void 0 : t.withHeadings) != null ? e : !1, this.withHeadingColumnValue = (n = t == null ? void 0 : t.withHeadingColumn) != null ? n : !1, this.stretchedValue = (o = t == null ? void 0 : t.stretched) != null ? o : !1, this.colWidthsValue = t != null && t.colWidths ? [...t.colWidths] : void 0, this.initialColWidthValue = t == null ? void 0 : t.initialColWidth, this.contentGrid = this.normalizeContent(t == null ? void 0 : t.content), this.blockCellMap = /* @__PURE__ */ new Map(), this.rebuildBlockCellMap();
@@ -3308,8 +3339,8 @@ class Vo {
     return e;
   }
 }
-const Ft = "data-blok-table-resize", zo = "data-blok-table-cell", Uo = "data-blok-table-row", Ko = 50, yt = 16;
-class jo {
+const Kt = "data-blok-table-resize", Xo = "data-blok-table-cell", Yo = "data-blok-table-row", Zo = 50, yt = 16;
+class Jo {
   constructor(t, e, n, o, s, i = !1) {
     this._enabled = !0, this.isDragging = !1, this.dragStartX = 0, this.dragColIndex = -1, this.startColWidth = 0, this.dragRowCells = null, this.handles = [], this.gridEl = t, this.colWidths = [...e], this.onChange = n, this.onDragStart = o != null ? o : null, this.onDrag = s != null ? s : null, this.needsInitialApply = i, this.boundPointerDown = this.onPointerDown.bind(this), this.boundPointerMove = this.onPointerMove.bind(this), this.boundPointerUp = this.onPointerUp.bind(this), this.gridEl.style.position = "relative", i || this.applyWidths(), this.createHandles(), this.gridEl.addEventListener("pointerdown", this.boundPointerDown);
   }
@@ -3336,7 +3367,7 @@ class jo {
   }
   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 = `-${M}px`, e.style.bottom = "0px", e.style.width = `${yt}px`, e.style.left = `${n - yt / 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(Kt, ""), e.setAttribute("data-col", String(t)), e.style.position = "absolute", e.style.top = `-${M}px`, e.style.bottom = "0px", e.style.width = `${yt}px`, e.style.left = `${n - yt / 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");
@@ -3356,7 +3387,7 @@ class jo {
     if (!this._enabled)
       return;
     const e = t.target;
-    if (!e.hasAttribute(Ft))
+    if (!e.hasAttribute(Kt))
       return;
     t.preventDefault(), this.needsInitialApply && (this.applyWidths(), this.updateHandlePositions(), this.needsInitialApply = !1);
     const n = e.getAttribute("data-col");
@@ -3366,7 +3397,7 @@ class jo {
     var s, i;
     if (!this.isDragging)
       return;
-    const e = t.clientX - this.dragStartX, n = this.startColWidth + e, o = Math.max(Ko, n);
+    const e = t.clientX - this.dragStartX, n = this.startColWidth + e, o = Math.max(Zo, n);
     this.colWidths[this.dragColIndex] = o, this.applyWidths((s = this.dragRowCells) != null ? s : void 0), this.updateHandlePositions(), (i = this.onDrag) == null || i.call(this);
   }
   onPointerUp() {
@@ -3377,8 +3408,8 @@ class jo {
     t && (t.style.opacity = "0"), document.removeEventListener("pointermove", this.boundPointerMove), document.removeEventListener("pointerup", this.boundPointerUp), this.dragRowCells = null, this.onChange([...this.colWidths]);
   }
   resolveRowCells() {
-    const t = this.gridEl.querySelectorAll(`[${Uo}]`);
-    return Array.from(t, (e) => Array.from(e.querySelectorAll(`[${zo}]`)));
+    const t = this.gridEl.querySelectorAll(`[${Yo}]`);
+    return Array.from(t, (e) => Array.from(e.querySelectorAll(`[${Xo}]`)));
   }
   applyWidths(t = this.resolveRowCells()) {
     const e = this.colWidths.reduce((n, o) => n + o, 0);
@@ -3389,34 +3420,34 @@ class jo {
     });
   }
 }
-const Vt = (r, t, e) => (e.grid.addRow(r, t), N(r, e.cellBlocks), {
+const jt = (r, t, e) => (e.grid.addRow(r, t), H(r, e.cellBlocks), {
   pendingHighlight: { type: "row", index: t },
   moveSelection: null,
   colWidths: e.data.colWidths,
   withHeadings: e.data.withHeadings,
   withHeadingColumn: e.data.withHeadingColumn
-}), zt = (r, t, e) => {
-  const n = _o(r, t, e.data.colWidths, e.data.initialColWidth, e.grid);
-  return N(r, e.cellBlocks), {
+}), Xt = (r, t, e) => {
+  const n = qo(r, t, e.data.colWidths, e.data.initialColWidth, e.grid);
+  return H(r, e.cellBlocks), {
     pendingHighlight: { type: "col", index: t },
     moveSelection: null,
     colWidths: n,
     withHeadings: e.data.withHeadings,
     withHeadingColumn: e.data.withHeadingColumn
   };
-}, Xo = (r, t, e, n) => (n.grid.moveRow(r, t, e), {
+}, Qo = (r, t, e, n) => (n.grid.moveRow(r, t, e), {
   pendingHighlight: null,
   moveSelection: { type: "row", index: e },
   colWidths: n.data.colWidths,
   withHeadings: n.data.withHeadings,
   withHeadingColumn: n.data.withHeadingColumn
-}), Yo = (r, t, e, n) => (n.grid.moveColumn(r, t, e), {
+}), ts = (r, t, e, n) => (n.grid.moveColumn(r, t, e), {
   pendingHighlight: null,
   moveSelection: { type: "col", index: e },
-  colWidths: Oo(n.data.colWidths, t, e),
+  colWidths: Go(n.data.colWidths, t, e),
   withHeadings: n.data.withHeadings,
   withHeadingColumn: n.data.withHeadingColumn
-}), Zo = (r, t, e) => {
+}), es = (r, t, e) => {
   var s, i;
   (i = e.cellBlocks) == null || i.deleteBlocks((s = e.blocksToDelete) != null ? s : []), e.grid.deleteRow(r, t);
   const n = e.grid.getRowCount(r);
@@ -3427,11 +3458,11 @@ const Vt = (r, t, e) => (e.grid.addRow(r, t), N(r, e.cellBlocks), {
     withHeadings: e.data.withHeadings,
     withHeadingColumn: e.data.withHeadingColumn
   };
-}, Jo = (r, t, e) => {
+}, ns = (r, t, e) => {
   var i, l;
   (l = e.cellBlocks) == null || l.deleteBlocks((i = e.blocksToDelete) != null ? i : []), e.grid.deleteColumn(r, t);
-  const n = Mo(e.data.colWidths, t);
-  n ? dt(r, n) : Ho(r);
+  const n = $o(e.data.colWidths, t);
+  n ? dt(r, n) : Wo(r);
   const o = e.grid.getColumnCount(r);
   return {
     pendingHighlight: { type: "col", index: t < o ? t : t - 1 },
@@ -3440,24 +3471,24 @@ const Vt = (r, t, e) => (e.grid.addRow(r, t), N(r, e.cellBlocks), {
     withHeadings: e.data.withHeadings,
     withHeadingColumn: e.data.withHeadingColumn
   };
-}, Qo = (r, t, e) => {
+}, os = (r, t, e) => {
   switch (t.type) {
     case "insert-row-above":
-      return Vt(r, t.index, e);
+      return jt(r, t.index, e);
     case "insert-row-below":
-      return Vt(r, t.index + 1, e);
+      return jt(r, t.index + 1, e);
     case "insert-col-left":
-      return zt(r, t.index, e);
+      return Xt(r, t.index, e);
     case "insert-col-right":
-      return zt(r, t.index + 1, e);
+      return Xt(r, t.index + 1, e);
     case "move-row":
-      return Xo(r, t.fromIndex, t.toIndex, e);
+      return Qo(r, t.fromIndex, t.toIndex, e);
     case "move-col":
-      return Yo(r, t.fromIndex, t.toIndex, e);
+      return ts(r, t.fromIndex, t.toIndex, e);
     case "delete-row":
-      return Zo(r, t.index, e);
+      return es(r, t.index, e);
     case "delete-col":
-      return Jo(r, t.index, e);
+      return ns(r, t.index, e);
     case "toggle-heading":
       return {
         pendingHighlight: { type: "row", index: 0 },
@@ -3475,8 +3506,8 @@ const Vt = (r, t, e) => (e.grid.addRow(r, t), N(r, e.cellBlocks), {
         withHeadingColumn: !e.data.withHeadingColumn
       };
   }
-}, Ut = 10, ts = "data-blok-table-drag-ghost", bt = (r) => {
-  const t = r.querySelector(`[${f}]`);
+}, Yt = 10, ss = "data-blok-table-drag-ghost", vt = (r) => {
+  const t = r.querySelector(`[${m}]`);
   return t ? Array.from(t.querySelectorAll(`[${g}]`)).reduce(
     (n, o) => {
       const s = n[n.length - 1];
@@ -3485,7 +3516,7 @@ const Vt = (r, t, e) => (e.grid.addRow(r, t), N(r, e.cellBlocks), {
     [0]
   ) : [0];
 };
-class es {
+class is {
   constructor(t) {
     var e;
     this.isDragging = !1, this.dragType = null, this.dragFromIndex = -1, this.dragStartX = 0, this.dragStartY = 0, this.dropIndicator = null, this.dragOverlayCells = [], this.ghostEl = null, this.ghostOffsetX = 0, this.ghostOffsetY = 0, this.resolveTracking = null, this.grid = t.grid, this.onAction = t.onAction, this.onDragStateChange = (e = t.onDragStateChange) != null ? e : null, this.boundDocPointerMove = this.handleDocPointerMove.bind(this), this.boundDocPointerUp = this.handleDocPointerUp.bind(this), this.boundDocPointerCancel = this.handleDocPointerCancel.bind(this);
@@ -3509,7 +3540,7 @@ class es {
   }
   handleDocPointerMove(t) {
     const e = Math.abs(t.clientX - this.dragStartX), n = Math.abs(t.clientY - this.dragStartY);
-    !this.isDragging && (e > Ut || n > Ut) && (this.isDragging = !0, this.startDrag()), this.isDragging && (this.updateDragIndicator(t), this.updateGhostPosition(t));
+    !this.isDragging && (e > Yt || n > Yt) && (this.isDragging = !0, this.startDrag()), this.isDragging && (this.updateDragIndicator(t), this.updateGhostPosition(t));
   }
   handleDocPointerUp(t) {
     var e, n;
@@ -3528,7 +3559,7 @@ class es {
     this.grid.style.userSelect = "none", document.body.style.cursor = "grabbing", (t = this.onDragStateChange) == null || t.call(this, !0, this.dragType), this.highlightSourceCells(), this.createDropIndicator(), this.createGhost();
   }
   highlightSourceCells() {
-    const t = this.grid.querySelectorAll(`[${f}]`);
+    const t = this.grid.querySelectorAll(`[${m}]`);
     if (this.dragType === "row") {
       this.highlightRowCells(t);
       return;
@@ -3559,7 +3590,7 @@ class es {
     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 = `${-M}px`, t.right = "0", t.transition = "top 100ms ease";
     else {
-      const e = this.grid.querySelectorAll(`[${f}]`), n = e[e.length - 1], o = n ? n.offsetTop + n.offsetHeight : 0;
+      const e = this.grid.querySelectorAll(`[${m}]`), n = e[e.length - 1], o = n ? n.offsetTop + n.offsetHeight : 0;
       t.width = "3px", t.top = `${-M}px`, t.height = `${o + M}px`, t.transition = "left 100ms ease";
     }
     this.grid.appendChild(this.dropIndicator);
@@ -3584,7 +3615,7 @@ class es {
     var i;
     if (!this.dropIndicator)
       return;
-    const n = t.clientX - e.left, o = this.getColDropIndex(n), s = bt(this.grid);
+    const n = t.clientX - e.left, o = this.getColDropIndex(n), s = vt(this.grid);
     this.dropIndicator.style.left = `${((i = s[o]) != null ? i : 0) - 1.5}px`;
   }
   finishDrag(t) {
@@ -3605,7 +3636,7 @@ class es {
   }
   createGhost() {
     const t = document.createElement("div");
-    t.setAttribute(ts, ""), t.setAttribute("contenteditable", "false");
+    t.setAttribute(ss, ""), t.setAttribute("contenteditable", "false");
     const e = t.style;
     e.position = "fixed", e.pointerEvents = "none", e.opacity = "0.5", e.zIndex = "50", e.borderRadius = "4px", e.overflow = "hidden", e.boxShadow = "0 4px 12px rgba(0,0,0,0.15)", this.ghostEl = t;
     const n = this.getSourceRect();
@@ -3616,11 +3647,11 @@ class es {
   }
   getRowSourceRect() {
     var n;
-    const e = this.grid.querySelectorAll(`[${f}]`)[this.dragFromIndex];
+    const e = this.grid.querySelectorAll(`[${m}]`)[this.dragFromIndex];
     return (n = e == null ? void 0 : e.getBoundingClientRect()) != null ? n : null;
   }
   getColSourceRect() {
-    const t = this.grid.querySelectorAll(`[${f}]`), e = t[0], n = t[t.length - 1];
+    const t = this.grid.querySelectorAll(`[${m}]`), e = t[0], n = t[t.length - 1];
     if (!e || !n)
       return null;
     const o = e.querySelectorAll(`[${g}]`)[this.dragFromIndex], s = n.querySelectorAll(`[${g}]`)[this.dragFromIndex];
@@ -3630,7 +3661,7 @@ class es {
     return new DOMRect(i.left, i.top, i.width, l.bottom - i.top);
   }
   buildRowGhost() {
-    const e = this.grid.querySelectorAll(`[${f}]`)[this.dragFromIndex];
+    const e = this.grid.querySelectorAll(`[${m}]`)[this.dragFromIndex];
     if (!e || !this.ghostEl)
       return;
     const n = this.ghostEl.style;
@@ -3643,7 +3674,7 @@ class es {
   buildColumnGhost() {
     if (!this.ghostEl)
       return;
-    const t = this.grid.querySelectorAll(`[${f}]`), e = this.ghostEl.style;
+    const t = this.grid.querySelectorAll(`[${m}]`), e = this.ghostEl.style;
     e.display = "flex", e.flexDirection = "column", t.forEach((n) => {
       var l;
       const o = n.querySelectorAll(`[${g}]`);
@@ -3660,7 +3691,7 @@ class es {
     this.dragType === "row" && (e.top = `${t.clientY - this.ghostOffsetY}px`), this.dragType === "col" && (e.left = `${t.clientX - this.ghostOffsetX}px`);
   }
   getRowDropIndex(t) {
-    const e = Array.from(this.grid.querySelectorAll(`[${f}]`)), n = e.map((i) => i.offsetTop);
+    const e = Array.from(this.grid.querySelectorAll(`[${m}]`)), n = e.map((i) => i.offsetTop);
     if (e.length > 0) {
       const i = e[e.length - 1];
       n.push(i.offsetTop + i.offsetHeight);
@@ -3669,7 +3700,7 @@ class es {
     return o.indexOf(s);
   }
   getRowDropTopPx(t) {
-    const e = this.grid.querySelectorAll(`[${f}]`);
+    const e = this.grid.querySelectorAll(`[${m}]`);
     if (t < e.length)
       return e[t].offsetTop;
     if (e.length > 0) {
@@ -3679,11 +3710,11 @@ class es {
     return 0;
   }
   getColDropIndex(t) {
-    const n = bt(this.grid).map((s) => Math.abs(t - s)), o = Math.min(...n);
+    const n = vt(this.grid).map((s) => Math.abs(t - s)), o = Math.min(...n);
     return n.indexOf(o);
   }
 }
-const ns = [
+const rs = [
   "flex",
   "items-center",
   "select-none",
@@ -3695,7 +3726,7 @@ const ns = [
   "mb-px",
   "cursor-pointer",
   "can-hover:hover:bg-item-hover-bg"
-], os = [
+], ls = [
   "flex",
   "items-center",
   "justify-center",
@@ -3704,13 +3735,13 @@ const ns = [
   "mr-2",
   "[&_svg]:w-icon",
   "[&_svg]:h-icon"
-], ss = [
+], as = [
   "mr-auto",
   "truncate",
   "text-sm",
   "font-medium",
   "leading-5"
-], is = [
+], cs = [
   "relative",
   "w-[34px]",
   "h-[20px]",
@@ -3718,7 +3749,7 @@ const ns = [
   "transition-colors",
   "duration-200",
   "shrink-0"
-], rs = [
+], ds = [
   "absolute",
   "top-[2px]",
   "w-4",
@@ -3728,29 +3759,29 @@ const ns = [
   "shadow-sm",
   "transition-[left]",
   "duration-200"
-], ye = (r) => {
+], ke = (r) => {
   const { icon: t, label: e, isActive: n, onToggle: o } = r, s = { active: n }, i = document.createElement("div");
-  i.className = w(ns);
+  i.className = v(rs);
   const l = document.createElement("div");
-  l.className = w(os), l.innerHTML = t, i.appendChild(l);
+  l.className = v(ls), l.innerHTML = t, i.appendChild(l);
   const a = document.createElement("span");
-  a.className = w(ss), a.textContent = e, i.appendChild(a);
+  a.className = v(as), a.textContent = e, i.appendChild(a);
   const c = document.createElement("div");
-  c.className = w(is);
+  c.className = v(cs);
   const d = document.createElement("div");
-  d.className = w(rs), c.appendChild(d), i.appendChild(c);
+  d.className = v(ds), c.appendChild(d), i.appendChild(c);
   const h = () => {
     c.style.backgroundColor = s.active ? "#3b82f6" : "#d1d5db", d.style.left = s.active ? "16px" : "2px";
   };
   return h(), i.addEventListener("click", (u) => {
     u.stopPropagation(), s.active = !s.active, h(), o(s.active);
   }), i;
-}, ls = (r, t) => {
+}, hs = (r, t) => {
   const e = r === 0 ? [
     {
       type: U.Html,
-      element: ye({
-        icon: Ue,
+      element: ke({
+        icon: Qe,
         label: t.i18n.t("tools.table.headerColumn"),
         isActive: t.isHeadingColumn(),
         onToggle: () => {
@@ -3761,7 +3792,7 @@ const ns = [
     { type: U.Separator }
   ] : [], n = [
     {
-      icon: qe,
+      icon: Xe,
       title: t.i18n.t("tools.table.insertColumnLeft"),
       closeOnActivate: !0,
       onActivate: () => {
@@ -3769,7 +3800,7 @@ const ns = [
       }
     },
     {
-      icon: Fe,
+      icon: Ye,
       title: t.i18n.t("tools.table.insertColumnRight"),
       closeOnActivate: !0,
       onActivate: () => {
@@ -3779,7 +3810,7 @@ const ns = [
   ], o = t.getColumnCount() > 1, s = [
     { type: U.Separator },
     {
-      icon: se,
+      icon: ce,
       title: t.i18n.t("tools.table.deleteColumn"),
       isDestructive: !0,
       isDisabled: !o,
@@ -3790,12 +3821,12 @@ const ns = [
     }
   ];
   return [...e, ...n, ...s];
-}, as = (r, t) => {
+}, us = (r, t) => {
   const e = r === 0 ? [
     {
       type: U.Html,
-      element: ye({
-        icon: Ke,
+      element: ke({
+        icon: tn,
         label: t.i18n.t("tools.table.headerRow"),
         isActive: t.isHeadingRow(),
         onToggle: () => {
@@ -3806,7 +3837,7 @@ const ns = [
     { type: U.Separator }
   ] : [], n = [
     {
-      icon: Ve,
+      icon: Ze,
       title: t.i18n.t("tools.table.insertRowAbove"),
       closeOnActivate: !0,
       onActivate: () => {
@@ -3814,7 +3845,7 @@ const ns = [
       }
     },
     {
-      icon: ze,
+      icon: Je,
       title: t.i18n.t("tools.table.insertRowBelow"),
       closeOnActivate: !0,
       onActivate: () => {
@@ -3824,7 +3855,7 @@ const ns = [
   ], o = t.getRowCount() > 1, s = [
     { type: U.Separator },
     {
-      icon: se,
+      icon: ce,
       title: t.i18n.t("tools.table.deleteRow"),
       isDestructive: !0,
       isDisabled: !o,
@@ -3835,21 +3866,21 @@ const ns = [
     }
   ];
   return [...e, ...n, ...s];
-}, cs = (r, t, e, n, o) => {
+}, ps = (r, t, e, n, o) => {
   o.destroyPopover(), o.clearHideTimeout();
   const s = r === "col" ? e.col[t] : e.row[t];
   if (!s)
     return { popover: null, grip: null };
-  const i = r === "col" ? ls(t, n) : as(t, n), l = new ne({
+  const i = r === "col" ? hs(t, n) : us(t, n), l = new le({
     items: i,
     trigger: s,
     flippable: !0
   });
-  return l.on(oe.Closed, () => {
+  return l.on(ae.Closed, () => {
     var a;
     o.destroyPopover(), o.applyVisibleClasses(s), o.scheduleHideAll(), (a = o.onGripPopoverClose) == null || a.call(o);
   }), o.hideAllGripsExcept(s), o.applyActiveClasses(s), r === "col" ? s.style.height = `${Z}px` : s.style.width = `${Z}px`, { popover: l, grip: s };
-}, Kt = "data-blok-table-grip", it = "data-blok-table-grip-col", jt = "data-blok-table-grip-row", ds = 150, hs = 24, rt = 4, lt = 4, us = 20, at = [
+}, Zt = "data-blok-table-grip", it = "data-blok-table-grip-col", Jt = "data-blok-table-grip-row", gs = 150, fs = 24, rt = 4, lt = 4, ms = 20, at = [
   "absolute",
   "z-[3]",
   "rounded",
@@ -3862,23 +3893,23 @@ const ns = [
   "items-center",
   "justify-center",
   "overflow-hidden"
-], Xt = [
+], Qt = [
   "bg-gray-300",
   "opacity-0",
   "pointer-events-none"
-], ps = [
+], Cs = [
   "bg-gray-300",
   "opacity-100",
   "pointer-events-auto"
-], gs = [
+], ys = [
   "bg-blue-500",
   "text-white",
   "opacity-100",
   "pointer-events-auto"
 ];
-class fs {
+class bs {
   constructor(t) {
-    this.colGrips = [], this.rowGrips = [], this.popoverState = { popover: null, grip: null }, this.lockedGrip = null, this.hideTimeout = null, this.activeColGripIndex = -1, this.activeRowGripIndex = -1, this.isInsideTable = !1, this.rowResizeObserver = null, this.grid = t.grid, this.getColumnCount = t.getColumnCount, this.getRowCount = t.getRowCount, this.isHeadingRow = t.isHeadingRow, this.isHeadingColumn = t.isHeadingColumn, this.onAction = t.onAction, this.onGripClick = t.onGripClick, this.onGripPopoverClose = t.onGripPopoverClose, this.i18n = t.i18n, this.drag = new es({
+    this.colGrips = [], this.rowGrips = [], this.popoverState = { popover: null, grip: null }, this.lockedGrip = null, this.hideTimeout = null, this.activeColGripIndex = -1, this.activeRowGripIndex = -1, this.isInsideTable = !1, this.rowResizeObserver = null, this.boundScrollHandler = null, this.grid = t.grid, this.overlay = t.overlay, this.scrollContainer = t.scrollContainer, this.getColumnCount = t.getColumnCount, this.getRowCount = t.getRowCount, this.isHeadingRow = t.isHeadingRow, this.isHeadingColumn = t.isHeadingColumn, this.onAction = t.onAction, this.onGripClick = t.onGripClick, this.onGripPopoverClose = t.onGripPopoverClose, this.i18n = t.i18n, this.drag = new is({
       grid: this.grid,
       onAction: this.onAction,
       onDragStateChange: (e, n) => {
@@ -3901,37 +3932,52 @@ class fs {
     const n = t === "col" ? this.colGrips[e] : this.rowGrips[e];
     n && (this.unlockGrip(), this.clearHideTimeout(), this.hideAllGripsExcept(n), this.applyActiveClasses(n), t === "col" ? n.style.height = `${Z}px` : n.style.width = `${Z}px`, this.lockedGrip = n, document.addEventListener("pointerdown", this.boundUnlockGrip));
   }
-  handleUnlockGrip() {
+  handleUnlockGrip(t) {
     document.removeEventListener("pointerdown", this.boundUnlockGrip), this.lockedGrip && (this.applyIdleClasses(this.lockedGrip), this.lockedGrip = null);
+    const e = t.target instanceof HTMLElement ? t.target : null, n = e == null ? void 0 : e.closest(`[${g}]`);
+    if (n) {
+      const o = this.getCellPosition(n);
+      o && (this.clearHideTimeout(), this.showColGrip(o.col), this.showRowGrip(o.row), this.isInsideTable = !0);
+    }
   }
   unlockGrip() {
     document.removeEventListener("pointerdown", this.boundUnlockGrip), this.lockedGrip = null;
   }
+  get isPopoverOpen() {
+    return this.popoverState.popover !== null;
+  }
   destroy() {
     this.destroyPopover(), this.unlockGrip(), this.drag.cleanup(), this.grid.removeEventListener("mouseover", this.boundMouseOver), this.grid.removeEventListener("mouseleave", this.boundMouseLeave), this.clearHideTimeout(), this.destroyGrips();
   }
   createGrips() {
-    const t = this.getColumnCount(), e = this.getRowCount();
-    Array.from({ length: t }).forEach((n, o) => {
-      const s = this.createGripElement("col", o);
-      this.colGrips.push(s), this.grid.appendChild(s);
-    }), Array.from({ length: e }).forEach((n, o) => {
-      const s = this.createGripElement("row", o);
-      this.rowGrips.push(s), this.grid.appendChild(s);
-    }), this.positionGrips(), this.observeRowHeights();
+    var o;
+    const t = this.getColumnCount(), e = this.getRowCount(), n = (o = this.overlay) != null ? o : this.grid;
+    Array.from({ length: t }).forEach((s, i) => {
+      const l = this.createGripElement("col", i);
+      this.colGrips.push(l), n.appendChild(l);
+    }), Array.from({ length: e }).forEach((s, i) => {
+      const l = this.createGripElement("row", i);
+      this.rowGrips.push(l), n.appendChild(l);
+    }), this.positionGrips(), this.observeRowHeights(), this.attachScrollListener();
+  }
+  attachScrollListener() {
+    this.overlay && this.scrollContainer && (this.boundScrollHandler = () => this.positionGrips(), this.scrollContainer.addEventListener("scroll", this.boundScrollHandler));
+  }
+  detachScrollListener() {
+    this.boundScrollHandler && this.scrollContainer && (this.scrollContainer.removeEventListener("scroll", this.boundScrollHandler), this.boundScrollHandler = null);
   }
   destroyGrips() {
     var t;
-    (t = this.rowResizeObserver) == null || t.disconnect(), this.rowResizeObserver = null, this.colGrips.forEach((e) => e.remove()), this.rowGrips.forEach((e) => e.remove()), this.colGrips = [], this.rowGrips = [], this.activeColGripIndex = -1, this.activeRowGripIndex = -1, this.isInsideTable = !1;
+    (t = this.rowResizeObserver) == null || t.disconnect(), this.rowResizeObserver = null, this.detachScrollListener(), this.colGrips.forEach((e) => e.remove()), this.rowGrips.forEach((e) => e.remove()), this.colGrips = [], this.rowGrips = [], this.activeColGripIndex = -1, this.activeRowGripIndex = -1, this.isInsideTable = !1;
   }
   createGripElement(t, e) {
     const n = document.createElement("div");
-    n.className = w(at, Xt), n.setAttribute(Kt, ""), n.setAttribute(t === "col" ? it : jt, String(e)), n.setAttribute("contenteditable", "false");
-    const o = t === "col" ? hs : lt, s = t === "col" ? rt : us, i = t === "col" ? rt : lt;
-    return n.style.width = `${o}px`, n.style.height = `${s}px`, n.style.transform = "translate(-50%, -50%)", n.style.outline = "2px solid white", n.appendChild(fe(t === "col" ? "horizontal" : "vertical")), n.addEventListener("pointerdown", this.boundPointerDown), n.addEventListener("mouseenter", () => {
-      this.isGripInteractionLocked() || xo(n, t);
+    n.className = v(at, Qt), n.setAttribute(Zt, ""), n.setAttribute(t === "col" ? it : Jt, String(e)), n.setAttribute("contenteditable", "false");
+    const o = t === "col" ? fs : lt, s = t === "col" ? rt : ms, i = t === "col" ? rt : lt;
+    return n.style.width = `${o}px`, n.style.height = `${s}px`, n.style.transform = "translate(-50%, -50%)", n.style.outline = "2px solid white", n.appendChild(ve(t === "col" ? "horizontal" : "vertical")), n.addEventListener("pointerdown", this.boundPointerDown), n.addEventListener("mouseenter", () => {
+      this.overlay && this.clearHideTimeout(), this.isGripInteractionLocked() || Lo(n, t);
     }), n.addEventListener("mouseleave", () => {
-      this.isGripInteractionLocked() || ft(n, t, i);
+      this.isGripInteractionLocked() || (ft(n, t, i), this.overlay && this.scheduleHideAll());
     }), n;
   }
   /**
@@ -3939,20 +3985,20 @@ class fs {
    * Called after resize or structural changes.
    */
   positionGrips() {
-    const t = this.grid.querySelectorAll(`[${f}]`);
+    const t = this.grid.querySelectorAll(`[${m}]`);
     if (!t[0])
       return;
-    const n = bt(this.grid);
-    this.colGrips.forEach((o, s) => {
-      if (s + 1 >= n.length)
+    const n = vt(this.grid), o = this.overlay && this.scrollContainer ? this.scrollContainer.scrollLeft : 0, s = this.overlay && this.scrollContainer ? this.scrollContainer.clientWidth : 1 / 0;
+    this.colGrips.forEach((i, l) => {
+      if (l + 1 >= n.length)
         return;
-      const i = (n[s] + n[s + 1]) / 2, l = o.style;
-      l.top = `${-M / 2}px`, l.left = `${i}px`;
-    }), this.rowGrips.forEach((o, s) => {
-      if (s >= t.length)
+      const c = (n[l] + n[l + 1]) / 2 - o, d = i.style;
+      d.top = `${-M / 2}px`, d.left = `${c}px`, this.overlay && (d.visibility = c < 0 || c > s ? "hidden" : "");
+    }), this.rowGrips.forEach((i, l) => {
+      if (l >= t.length)
         return;
-      const i = t[s], l = i.offsetTop + i.offsetHeight / 2, a = o.style;
-      a.left = `${-M / 2}px`, a.top = `${l}px`;
+      const a = t[l], c = a.offsetTop + a.offsetHeight / 2, d = i.style;
+      d.left = `${-M / 2}px`, d.top = `${c}px`;
     });
   }
   /**
@@ -3962,7 +4008,7 @@ class fs {
     var e;
     (e = this.rowResizeObserver) == null || e.disconnect(), this.rowResizeObserver = new ResizeObserver(() => {
       this.positionGrips();
-    }), this.grid.querySelectorAll(`[${f}]`).forEach((n) => {
+    }), this.grid.querySelectorAll(`[${m}]`).forEach((n) => {
       var o;
       (o = this.rowResizeObserver) == null || o.observe(n);
     });
@@ -3984,10 +4030,10 @@ class fs {
     this.isGripInteractionLocked() || this.scheduleHideAll();
   }
   getCellPosition(t) {
-    const e = t.closest(`[${f}]`);
+    const e = t.closest(`[${m}]`);
     if (!e)
       return null;
-    const o = Array.from(this.grid.querySelectorAll(`[${f}]`)).indexOf(e);
+    const o = Array.from(this.grid.querySelectorAll(`[${m}]`)).indexOf(e);
     if (o < 0)
       return null;
     const i = Array.from(e.querySelectorAll(`[${g}]`)).indexOf(t);
@@ -4025,12 +4071,12 @@ class fs {
   }
   applyVisibleClasses(t) {
     const e = t, n = e.hasAttribute(it);
-    ft(e, n ? "col" : "row", n ? rt : lt), this.isInsideTable && (e.style.transition = "none"), e.className = w(at, ps), e.setAttribute("data-blok-table-grip-visible", ""), this.isInsideTable && (e.offsetHeight, e.style.transition = "");
+    ft(e, n ? "col" : "row", n ? rt : lt), this.isInsideTable && (e.style.transition = "none"), e.className = v(at, Cs), e.setAttribute("data-blok-table-grip-visible", ""), this.isInsideTable && (e.offsetHeight, e.style.transition = "");
     const i = e.querySelector("svg");
     i && (i.classList.remove("text-white"), i.classList.add("text-gray-400"));
   }
   applyActiveClasses(t) {
-    Object.assign(t, { className: w(at, gs) }), t.setAttribute("data-blok-table-grip-visible", "");
+    Object.assign(t, { className: v(at, ys) }), t.setAttribute("data-blok-table-grip-visible", "");
     const e = t.querySelector("svg");
     e && (e.classList.remove("text-gray-400", "opacity-0"), e.classList.add("text-white", "opacity-100"));
   }
@@ -4041,7 +4087,7 @@ class fs {
   }
   applyIdleClasses(t) {
     const e = t, n = e.hasAttribute(it), o = n ? "col" : "row", s = 12, i = n ? rt + s : lt + s;
-    this.isInsideTable && (e.style.transition = "none"), ft(e, o, i), e.className = w(at, Xt), e.removeAttribute("data-blok-table-grip-visible"), this.isInsideTable && (e.offsetHeight, e.style.transition = "");
+    this.isInsideTable && (e.style.transition = "none"), ft(e, o, i), e.className = v(at, Qt), e.removeAttribute("data-blok-table-grip-visible"), this.isInsideTable && (e.offsetHeight, e.style.transition = "");
   }
   handleDragStateChange(t, e) {
     [...this.colGrips, ...this.rowGrips].forEach((n) => {
@@ -4052,14 +4098,14 @@ class fs {
   scheduleHideAll() {
     this.hideTimeout = setTimeout(() => {
       this.hideColGrip(), this.hideRowGrip(), this.isInsideTable = !1, this.hideTimeout = null;
-    }, ds);
+    }, gs);
   }
   clearHideTimeout() {
     this.hideTimeout !== null && (clearTimeout(this.hideTimeout), this.hideTimeout = null);
   }
   // ── Click / Drag discrimination ──────────────────────────────
   handlePointerDown(t) {
-    const n = t.target.closest(`[${Kt}]`);
+    const n = t.target.closest(`[${Zt}]`);
     if (!n)
       return;
     t.preventDefault(), t.stopPropagation();
@@ -4072,13 +4118,13 @@ class fs {
     const e = t.getAttribute(it);
     if (e !== null)
       return { type: "col", index: Number(e) };
-    const n = t.getAttribute(jt);
+    const n = t.getAttribute(Jt);
     return n !== null ? { type: "row", index: Number(n) } : null;
   }
   // ── Popover menus ────────────────────────────────────────────
   openPopover(t, e) {
     var n, o;
-    this.popoverState = cs(
+    this.popoverState = ps(
       t,
       e,
       { col: this.colGrips, row: this.rowGrips },
@@ -4108,17 +4154,94 @@ class fs {
     }
   }
 }
-const ms = 3, Cs = 3, ys = [
+const vs = "data-blok-table-haze", te = "data-blok-table-haze-visible", bt = 1, Ss = [
+  "absolute",
+  "top-0",
+  "bottom-0",
+  "w-12",
+  "pointer-events-none",
+  "opacity-0",
+  "transition-opacity",
+  "duration-150",
+  "z-[1]"
+], ws = [
+  "left-0",
+  "bg-gradient-to-r",
+  "from-white/80",
+  "to-transparent"
+], ks = [
+  "right-5",
+  "bg-gradient-to-l",
+  "from-white/80",
+  "to-transparent"
+];
+class As {
+  constructor() {
+    this.leftHaze = null, this.rightHaze = null, this.scrollContainer = null, this.boundOnScroll = null, this.ticking = !1;
+  }
+  /**
+   * Create haze overlay elements and attach the scroll listener.
+   *
+   * @param wrapper - The table wrapper element (position: relative)
+   * @param scrollContainer - The scroll container with overflow-x: auto
+   */
+  init(t, e) {
+    this.scrollContainer = e, this.leftHaze = this.createHazeElement("left"), this.rightHaze = this.createHazeElement("right"), t.appendChild(this.leftHaze), t.appendChild(this.rightHaze), this.boundOnScroll = () => {
+      this.ticking || (requestAnimationFrame(() => {
+        this.syncVisibility(), this.ticking = !1;
+      }), this.ticking = !0);
+    }, e.addEventListener("scroll", this.boundOnScroll, { passive: !0 }), this.syncVisibility();
+  }
+  /**
+   * Recalculate haze visibility (e.g. after column resize or add/delete).
+   */
+  update() {
+    this.syncVisibility();
+  }
+  /**
+   * Remove overlay elements and detach the scroll listener.
+   */
+  destroy() {
+    var t, e;
+    this.boundOnScroll && this.scrollContainer && this.scrollContainer.removeEventListener("scroll", this.boundOnScroll), (t = this.leftHaze) == null || t.remove(), (e = this.rightHaze) == null || e.remove(), this.leftHaze = null, this.rightHaze = null, this.scrollContainer = null, this.boundOnScroll = null, this.ticking = !1;
+  }
+  createHazeElement(t) {
+    const e = document.createElement("div");
+    return e.setAttribute(vs, t), e.setAttribute("aria-hidden", "true"), e.classList.add(...Ss, ...t === "left" ? ws : ks), e;
+  }
+  syncVisibility() {
+    const t = this.scrollContainer;
+    if (!t)
+      return;
+    const { overflowX: e } = getComputedStyle(t);
+    if (!(e === "auto" || e === "scroll")) {
+      this.setVisible(this.leftHaze, !1), this.setVisible(this.rightHaze, !1);
+      return;
+    }
+    const { scrollLeft: o, scrollWidth: s, clientWidth: i } = t, l = s - i;
+    this.setVisible(this.leftHaze, o > bt), this.setVisible(this.rightHaze, l > bt && o < l - bt);
+  }
+  setVisible(t, e) {
+    t && (e ? t.setAttribute(te, "") : t.removeAttribute(te));
+  }
+}
+const Es = 3, xs = 3, Ts = [
   "my-2",
   "pr-5"
-], bs = [
-  "relative"
+], Bs = [
+  "relative",
+  'after:content-[""]',
+  "after:absolute",
+  "after:-bottom-10",
+  "after:left-0",
+  "after:right-0",
+  "after:h-10"
 ];
-class Ts {
+class Os {
   constructor({ data: t, config: e, api: n, readOnly: o, block: s }) {
-    this.initialContent = null, this.resize = null, this.addControls = null, this.rowColControls = null, this.cellBlocks = null, this.cellSelection = null, this.element = null, this.pendingHighlight = null, this.isNewTable = !1, this.unregisterRestrictedTools = null, this.setDataGeneration = 0, this.structuralOpDepth = 0, this.api = n, this.readOnly = o, this.config = e != null ? e : {};
-    const i = $t(t, this.config);
-    this.initialContent = i.content, this.grid = new So({ readOnly: o }), this.model = new Vo(i), this.blockId = s == null ? void 0 : s.id, this.config.restrictedTools !== void 0 && (this.unregisterRestrictedTools = je(this.config.restrictedTools));
+    this.initialContent = null, this.resize = null, this.addControls = null, this.rowColControls = null, this.cellBlocks = null, this.cellSelection = null, this.scrollHaze = null, this.element = null, this.gridElement = null, this.scrollContainer = null, this.gripOverlay = null, this.pendingHighlight = null, this.isNewTable = !1, this.unregisterRestrictedTools = null, this.setDataGeneration = 0, this.structuralOpDepth = 0, this.api = n, this.readOnly = o, this.config = e != null ? e : {};
+    const i = Vt(t, this.config);
+    this.initialContent = i.content, this.grid = new xo({ readOnly: o }), this.model = new jo(i), this.blockId = s == null ? void 0 : s.id, this.config.restrictedTools !== void 0 && (this.unregisterRestrictedTools = en(this.config.restrictedTools));
   }
   /**
    * Execute a function within a structural operation lock.
@@ -4143,14 +4266,17 @@ class Ts {
    * Execute a structural operation within a Yjs transaction.
    * Combines the structural op lock (event deferral) with Yjs undo grouping.
    * Used for interactive operations that should be a single undo entry.
+   *
+   * @param fn - The structural operation to execute
+   * @param discard - If true, discard deferred events (forwarded to runStructuralOp)
    */
-  runTransactedStructuralOp(t) {
+  runTransactedStructuralOp(t, e = !1) {
     if (!this.api.blocks.transact)
-      return this.runStructuralOp(t);
-    const e = { current: void 0 };
+      return this.runStructuralOp(t, e);
+    const n = { current: void 0 };
     return this.api.blocks.transact(() => {
-      e.current = this.runStructuralOp(t);
-    }), e.current;
+      n.current = this.runStructuralOp(t, e);
+    }), n.current;
   }
   /**
    * Tear down all visual subsystems (resize, add-controls, row/col-controls,
@@ -4158,8 +4284,8 @@ class Ts {
    * destroy(). Does NOT tear down cellBlocks — that has special Yjs handling.
    */
   teardownSubsystems() {
-    var t, e, n, o;
-    (t = this.resize) == null || t.destroy(), this.resize = null, (e = this.addControls) == null || e.destroy(), this.addControls = null, (n = this.rowColControls) == null || n.destroy(), this.rowColControls = null, (o = this.cellSelection) == null || o.destroy(), this.cellSelection = null;
+    var t, e, n, o, s;
+    (t = this.resize) == null || t.destroy(), this.resize = null, (e = this.addControls) == null || e.destroy(), this.addControls = null, (n = this.rowColControls) == null || n.destroy(), this.rowColControls = null, (o = this.cellSelection) == null || o.destroy(), this.cellSelection = null, (s = this.scrollHaze) == null || s.destroy(), this.scrollHaze = null;
   }
   /**
    * Initialize all visual subsystems on a grid element.
@@ -4167,11 +4293,11 @@ class Ts {
    * subsystem initialization order.
    */
   initSubsystems(t) {
-    this.initResize(t), this.initAddControls(t), this.initRowColControls(t), this.initCellSelection(t), this.initGridPasteListener(t);
+    this.initResize(t), this.initAddControls(t), this.initRowColControls(t), this.initCellSelection(t), this.initGridPasteListener(t), this.initScrollHaze();
   }
   static get toolbox() {
     return {
-      icon: Xe,
+      icon: nn,
       title: "Table",
       titleKey: "tools.table.title",
       searchTerms: ["table", "grid", "spreadsheet"]
@@ -4199,40 +4325,63 @@ class Ts {
       }
     };
   }
+  /**
+   * Ensure a scroll container exists between the wrapper and the grid.
+   * Creates one on demand (e.g. when the first resize converts percent → pixel mode).
+   */
+  ensureScrollContainer() {
+    if (this.scrollContainer)
+      return this.scrollContainer;
+    const t = document.createElement("div");
+    t.setAttribute("data-blok-table-scroll", "");
+    const e = this.gridElement;
+    return e && this.element && (this.element.insertBefore(t, e), t.appendChild(e)), this.scrollContainer = t, t;
+  }
   render() {
     var s, i, l, a, c, d, h;
     const t = document.createElement("div");
-    t.className = w(ys, !this.readOnly && bs, this.model.colWidths && Ce), t.setAttribute(I.tool, "table"), this.readOnly && t.setAttribute("data-blok-table-readonly", ""), this.isNewTable = ((i = (s = this.initialContent) == null ? void 0 : s.length) != null ? i : 0) === 0;
-    const e = ((l = this.initialContent) == null ? void 0 : l.length) || this.config.rows || ms, n = ((a = this.initialContent) == null ? void 0 : a.reduce((u, p) => {
-      var m;
-      return Math.max(u, (m = p == null ? void 0 : p.length) != null ? m : 0);
-    }, 0)) || this.config.cols || Cs, o = this.grid.createGrid(e, n, this.model.colWidths);
-    return ((d = (c = this.initialContent) == null ? void 0 : c.length) != null ? d : 0) > 0 && this.grid.fillGrid(o, (h = this.initialContent) != null ? h : []), this.model.colWidths && dt(o, this.model.colWidths), t.appendChild(o), this.element = t, this.model.withHeadings && tt(this.element, this.model.withHeadings), this.model.withHeadingColumn && W(this.element, this.model.withHeadingColumn), this.readOnly || (this.initCellBlocks(o), Fo(o, this.cellBlocks)), t;
+    t.className = v(Ts, !this.readOnly && Bs), t.setAttribute(L.tool, "table"), this.readOnly && t.setAttribute("data-blok-table-readonly", ""), this.isNewTable = ((i = (s = this.initialContent) == null ? void 0 : s.length) != null ? i : 0) === 0;
+    const e = ((l = this.initialContent) == null ? void 0 : l.length) || this.config.rows || Es, n = ((a = this.initialContent) == null ? void 0 : a.reduce((u, p) => {
+      var C;
+      return Math.max(u, (C = p == null ? void 0 : p.length) != null ? C : 0);
+    }, 0)) || this.config.cols || xs, o = this.grid.createGrid(e, n, this.model.colWidths);
+    if (((d = (c = this.initialContent) == null ? void 0 : c.length) != null ? d : 0) > 0 && this.grid.fillGrid(o, (h = this.initialContent) != null ? h : []), this.model.colWidths && dt(o, this.model.colWidths), this.gridElement = o, this.model.colWidths || !this.readOnly) {
+      const u = document.createElement("div");
+      u.setAttribute("data-blok-table-scroll", "");
+      const p = this.model.colWidths ? we : [];
+      u.classList.add(...p), u.appendChild(o), t.appendChild(u), this.scrollContainer = u;
+    } else
+      t.appendChild(o), this.scrollContainer = null;
+    if (!this.readOnly) {
+      const u = document.createElement("div");
+      u.setAttribute("data-blok-table-grip-overlay", ""), u.style.position = "absolute", u.style.inset = "0", u.style.pointerEvents = "none", u.style.zIndex = "3", t.appendChild(u), this.gripOverlay = u;
+    }
+    return this.element = t, this.model.withHeadings && tt(this.gridElement, this.model.withHeadings), this.model.withHeadingColumn && G(this.gridElement, this.model.withHeadingColumn), this.readOnly || (this.initCellBlocks(o), Ko(o, this.cellBlocks)), t;
   }
   rendered() {
     var n, o;
     if (!this.element || this.initialContent === null)
       return;
-    const t = this.element.firstElementChild;
+    const t = this.gridElement;
     if (!t)
       return;
     const e = this.initialContent;
     if (this.initialContent = null, this.readOnly) {
-      qo(t, e, this.api, (n = this.blockId) != null ? n : ""), this.initReadOnlyCellSelection(t);
+      Uo(t, e, this.api, (n = this.blockId) != null ? n : ""), this.initReadOnlyCellSelection(t), this.initScrollHaze();
       return;
     }
-    if (this.runStructuralOp(() => {
+    if (this.runTransactedStructuralOp(() => {
       var l, a;
-      const s = (a = (l = this.cellBlocks) == null ? void 0 : l.initializeCells(e)) != null ? a : e, i = this.isNewTable && s.length === 0 ? Array.from(t.querySelectorAll(`[${f}]`), (c) => {
+      const s = (a = (l = this.cellBlocks) == null ? void 0 : l.initializeCells(e)) != null ? a : e, i = this.isNewTable && s.length === 0 ? Array.from(t.querySelectorAll(`[${m}]`), (c) => {
         const d = c.querySelectorAll(`[${g}]`).length;
         return Array.from({ length: d }, () => ({ blocks: [] }));
       }) : s;
-      this.model.replaceAll(F(E({}, this.model.snapshot()), {
+      this.model.replaceAll(W(E({}, this.model.snapshot()), {
         content: i
-      })), this.isNewTable && N(t, this.cellBlocks);
+      })), this.isNewTable && H(t, this.cellBlocks);
     }, !0), this.model.initialColWidth === void 0) {
-      const s = (o = this.model.colWidths) != null ? o : V(t);
-      this.model.setInitialColWidth(s.length > 0 ? Wo(s) : void 0);
+      const s = (o = this.model.colWidths) != null ? o : z(t);
+      this.model.setInitialColWidth(s.length > 0 ? Fo(s) : void 0);
     }
     if (this.initSubsystems(t), this.isNewTable) {
       const s = t.querySelector('[contenteditable="true"]');
@@ -4250,15 +4399,15 @@ class Ts {
    * Follows the onPaste() pattern: delete old blocks, re-render, reinitialize.
    */
   setData(t) {
-    var l, a;
+    var l;
     this.setDataGeneration++;
-    const e = this.setDataGeneration, n = $t(
+    const e = this.setDataGeneration, n = Vt(
       E(E({}, this.model.snapshot()), t),
       this.config
     );
     this.initialContent = n.content, this.model.replaceAll(n), this.api.blocks.isSyncingFromYjs || this.runStructuralOp(() => {
-      var c;
-      (c = this.cellBlocks) == null || c.deleteAllBlocks();
+      var a;
+      (a = this.cellBlocks) == null || a.deleteAllBlocks();
     }, !0), (l = this.cellBlocks) == null || l.destroy();
     const o = this.element;
     if (!(o != null && o.parentNode) || e !== this.setDataGeneration)
@@ -4266,96 +4415,106 @@ class Ts {
     this.teardownSubsystems();
     const s = this.render();
     o.parentNode.replaceChild(s, o);
-    const i = (a = this.element) == null ? void 0 : a.firstElementChild;
+    const i = this.gridElement;
     this.readOnly || !i || e === this.setDataGeneration && (this.runStructuralOp(() => {
-      var d, h, u, p;
-      const c = (p = (u = (h = this.cellBlocks) == null ? void 0 : h.initializeCells((d = this.initialContent) != null ? d : [])) != null ? u : this.initialContent) != null ? p : [];
-      e === this.setDataGeneration && (this.model.replaceAll(F(E({}, this.model.snapshot()), {
-        content: c
-      })), this.initialContent = null);
+      var c, d, h, u;
+      const a = (u = (h = (d = this.cellBlocks) == null ? void 0 : d.initializeCells((c = this.initialContent) != null ? c : [])) != null ? h : this.initialContent) != null ? u : [];
+      if (e === this.setDataGeneration) {
+        if (this.api.blocks.isSyncingFromYjs && a.length === 0 && i) {
+          const p = Array.from(i.querySelectorAll(`[${m}]`), (C) => {
+            const f = C.querySelectorAll(`[${g}]`).length;
+            return Array.from({ length: f }, () => ({ blocks: [] }));
+          });
+          this.model.replaceAll(W(E({}, this.model.snapshot()), {
+            content: p
+          })), H(i, this.cellBlocks);
+        } else
+          this.model.replaceAll(W(E({}, this.model.snapshot()), {
+            content: a
+          }));
+        this.initialContent = null;
+      }
     }, !0), e === this.setDataGeneration && this.initSubsystems(i));
   }
   onPaste(t) {
-    var h, u, p;
+    var h, u;
     const e = t.detail.data, n = e.querySelectorAll("tr"), o = [];
-    n.forEach((m) => {
-      const C = m.querySelectorAll("td, th"), y = [];
-      C.forEach((v) => {
-        y.push(v.innerHTML);
-      }), y.length > 0 && o.push(y);
+    n.forEach((p) => {
+      const C = p.querySelectorAll("td, th"), f = [];
+      C.forEach((y) => {
+        f.push(y.innerHTML);
+      }), f.length > 0 && o.push(f);
     });
     const s = e.querySelector("thead") !== null, i = ((h = n[0]) == null ? void 0 : h.querySelector("th")) !== null, l = s || i;
     this.initialContent = o, this.model.setWithHeadings(l), this.model.setWithHeadingColumn(!1), this.model.setColWidths(void 0), this.runStructuralOp(() => {
-      var m;
-      (m = this.cellBlocks) == null || m.deleteAllBlocks();
+      var p;
+      (p = this.cellBlocks) == null || p.deleteAllBlocks();
     }, !0), (u = this.cellBlocks) == null || u.destroy(), this.teardownSubsystems();
     const a = this.element;
     if (!(a != null && a.parentNode))
       return;
     const c = this.render();
     a.parentNode.replaceChild(c, a);
-    const d = (p = this.element) == null ? void 0 : p.firstElementChild;
+    const d = this.gridElement;
     !this.readOnly && d && (this.runStructuralOp(() => {
-      var C, y, v, k;
-      const m = (k = (v = (y = this.cellBlocks) == null ? void 0 : y.initializeCells((C = this.initialContent) != null ? C : [])) != null ? v : this.initialContent) != null ? k : [];
-      this.model.replaceAll(F(E({}, this.model.snapshot()), {
-        content: m
+      var C, f, y, S;
+      const p = (S = (y = (f = this.cellBlocks) == null ? void 0 : f.initializeCells((C = this.initialContent) != null ? C : [])) != null ? y : this.initialContent) != null ? S : [];
+      this.model.replaceAll(W(E({}, this.model.snapshot()), {
+        content: p
       })), this.initialContent = null;
     }, !0), this.initSubsystems(d));
   }
   destroy() {
     var t, e, n;
-    (t = this.unregisterRestrictedTools) == null || t.call(this), this.unregisterRestrictedTools = null, this.api.blocks.isSyncingFromYjs || (e = this.cellBlocks) == null || e.deleteAllBlocks(), this.teardownSubsystems(), (n = this.cellBlocks) == null || n.destroy(), this.cellBlocks = null, this.element = null;
+    (t = this.unregisterRestrictedTools) == null || t.call(this), this.unregisterRestrictedTools = null, this.api.blocks.isSyncingFromYjs || (e = this.cellBlocks) == null || e.deleteAllBlocks(), this.teardownSubsystems(), (n = this.cellBlocks) == null || n.destroy(), this.cellBlocks = null, this.gridElement = null, this.scrollContainer = null, this.element = null;
   }
   deleteRowWithCleanup(t) {
-    var n;
-    const e = (n = this.element) == null ? void 0 : n.firstElementChild;
+    const e = this.gridElement;
     e && this.runTransactedStructuralOp(() => {
-      var s;
-      const { blocksToDelete: o } = this.model.deleteRow(t);
-      (s = this.cellBlocks) == null || s.deleteBlocks(o), this.grid.deleteRow(e, t);
+      var o;
+      const { blocksToDelete: n } = this.model.deleteRow(t);
+      (o = this.cellBlocks) == null || o.deleteBlocks(n), this.grid.deleteRow(e, t);
     });
   }
   deleteColumnWithCleanup(t) {
-    var n;
-    const e = (n = this.element) == null ? void 0 : n.firstElementChild;
+    const e = this.gridElement;
     e && this.runTransactedStructuralOp(() => {
-      var s;
-      const { blocksToDelete: o } = this.model.deleteColumn(t);
-      (s = this.cellBlocks) == null || s.deleteBlocks(o), this.grid.deleteColumn(e, t);
+      var o;
+      const { blocksToDelete: n } = this.model.deleteColumn(t);
+      (o = this.cellBlocks) == null || o.deleteBlocks(n), this.grid.deleteColumn(e, t);
     });
   }
   getBlockIdsInRow(t) {
-    return Go(this.element, this.cellBlocks, t);
+    return zo(this.element, this.cellBlocks, t);
   }
   getBlockIdsInColumn(t) {
-    return $o(this.element, this.cellBlocks, t);
+    return Vo(this.element, this.cellBlocks, t);
   }
   initAddControls(t) {
     var n;
     if ((n = this.addControls) == null || n.destroy(), !this.element)
       return;
     const e = { addedCols: 0 };
-    this.addControls = new yo({
+    this.addControls = new wo({
       wrapper: this.element,
       grid: t,
       i18n: this.api.i18n,
       getNewColumnWidth: () => {
         var s;
-        const o = (s = this.model.colWidths) != null ? s : V(t);
+        const o = (s = this.model.colWidths) != null ? s : z(t);
         return this.model.initialColWidth !== void 0 ? Math.round(this.model.initialColWidth / 2 * 100) / 100 : et(o);
       },
       onAddRow: () => {
         this.runTransactedStructuralOp(() => {
           var o, s;
-          this.grid.addRow(t), this.model.addRow(), N(t, this.cellBlocks), tt(this.element, this.model.withHeadings), W(this.element, this.model.withHeadingColumn), this.initResize(t), (o = this.addControls) == null || o.syncRowButtonWidth(), (s = this.rowColControls) == null || s.refresh();
+          this.grid.addRow(t), this.model.addRow(), H(t, this.cellBlocks), tt(this.gridElement, this.model.withHeadings), G(this.gridElement, this.model.withHeadingColumn), this.initResize(t), (o = this.addControls) == null || o.syncRowButtonWidth(), (s = this.rowColControls) == null || s.refresh();
         });
       },
       onAddColumn: () => {
         this.runTransactedStructuralOp(() => {
           var i, l, a;
-          const o = (i = this.model.colWidths) != null ? i : V(t), s = this.model.initialColWidth !== void 0 ? Math.round(this.model.initialColWidth / 2 * 100) / 100 : et(o);
-          this.grid.addColumn(t, void 0, o, s), this.model.addColumn(void 0, s), this.model.setColWidths([...o, s]), N(t, this.cellBlocks), W(this.element, this.model.withHeadingColumn), this.initResize(t), (l = this.addControls) == null || l.syncRowButtonWidth(), (a = this.rowColControls) == null || a.refresh();
+          const o = (i = this.model.colWidths) != null ? i : z(t), s = this.model.initialColWidth !== void 0 ? Math.round(this.model.initialColWidth / 2 * 100) / 100 : et(o);
+          this.grid.addColumn(t, void 0, o, s), this.model.addColumn(void 0, s), this.model.setColWidths([...o, s]), H(t, this.cellBlocks), G(this.gridElement, this.model.withHeadingColumn), this.initResize(t), (l = this.addControls) == null || l.syncRowButtonWidth(), (a = this.rowColControls) == null || a.refresh(), this.scrollContainer && (this.scrollContainer.scrollLeft = this.scrollContainer.scrollWidth);
         });
       },
       onDragStart: () => {
@@ -4364,14 +4523,14 @@ class Ts {
       },
       onDragAddRow: () => {
         this.runTransactedStructuralOp(() => {
-          this.grid.addRow(t), this.model.addRow(), N(t, this.cellBlocks), tt(this.element, this.model.withHeadings), W(this.element, this.model.withHeadingColumn);
+          this.grid.addRow(t), this.model.addRow(), H(t, this.cellBlocks), tt(this.gridElement, this.model.withHeadings), G(this.gridElement, this.model.withHeadingColumn);
         });
       },
       onDragRemoveRow: () => {
         this.runTransactedStructuralOp(() => {
           var s;
           const o = this.grid.getRowCount(t);
-          if (o > 1 && Po(t, o - 1)) {
+          if (o > 1 && Mo(t, o - 1)) {
             const { blocksToDelete: i } = this.model.deleteRow(o - 1);
             (s = this.cellBlocks) == null || s.deleteBlocks(i), this.grid.deleteRow(t, o - 1);
           }
@@ -4380,15 +4539,15 @@ class Ts {
       onDragAddCol: () => {
         this.runTransactedStructuralOp(() => {
           var l;
-          const o = (l = this.model.colWidths) != null ? l : V(t), s = this.model.initialColWidth !== void 0 ? Math.round(this.model.initialColWidth / 2 * 100) / 100 : et(o), i = [...o, s];
-          this.grid.addColumn(t, void 0, o, s), this.model.addColumn(void 0, s), this.model.setColWidths(i), dt(t, i), N(t, this.cellBlocks), W(this.element, this.model.withHeadingColumn), this.initResize(t), e.addedCols++, this.element && (this.element.scrollLeft = this.element.scrollWidth);
+          const o = (l = this.model.colWidths) != null ? l : z(t), s = this.model.initialColWidth !== void 0 ? Math.round(this.model.initialColWidth / 2 * 100) / 100 : et(o), i = [...o, s];
+          this.grid.addColumn(t, void 0, o, s), this.model.addColumn(void 0, s), this.model.setColWidths(i), dt(t, i), H(t, this.cellBlocks), G(this.gridElement, this.model.withHeadingColumn), this.initResize(t), e.addedCols++, this.scrollContainer && (this.scrollContainer.scrollLeft = this.scrollContainer.scrollWidth);
         });
       },
       onDragRemoveCol: () => {
         this.runTransactedStructuralOp(() => {
           var l;
           const o = this.grid.getColumnCount(t);
-          if (o <= 1 || !No(t, o - 1))
+          if (o <= 1 || !_o(t, o - 1))
             return;
           const { blocksToDelete: s } = this.model.deleteColumn(o - 1);
           (l = this.cellBlocks) == null || l.deleteBlocks(s), this.grid.deleteColumn(t, o - 1);
@@ -4398,48 +4557,50 @@ class Ts {
       },
       onDragEnd: () => {
         var o, s;
-        this.initResize(t), (o = this.addControls) == null || o.syncRowButtonWidth(), (s = this.rowColControls) == null || s.refresh(), this.element && (this.element.scrollLeft = e.addedCols > 0 ? this.element.scrollWidth : 0), e.addedCols = 0;
+        this.initResize(t), (o = this.addControls) == null || o.syncRowButtonWidth(), (s = this.rowColControls) == null || s.refresh(), this.scrollContainer && (this.scrollContainer.scrollLeft = e.addedCols > 0 ? this.scrollContainer.scrollWidth : 0), e.addedCols = 0;
       }
     });
   }
   initRowColControls(t) {
-    var e;
-    (e = this.rowColControls) == null || e.destroy(), this.element && (this.rowColControls = new fs({
+    var e, n, o;
+    (e = this.rowColControls) == null || e.destroy(), this.element && (this.rowColControls = new bs({
       grid: t,
+      overlay: (n = this.gripOverlay) != null ? n : void 0,
+      scrollContainer: (o = this.scrollContainer) != null ? o : void 0,
       getColumnCount: () => this.grid.getColumnCount(t),
       getRowCount: () => this.grid.getRowCount(t),
       isHeadingRow: () => this.model.withHeadings,
       isHeadingColumn: () => this.model.withHeadingColumn,
       i18n: this.api.i18n,
-      onAction: (n) => this.handleRowColAction(t, n),
-      onDragStateChange: (n) => {
-        var o;
-        this.resize && (this.resize.enabled = !n), (o = this.addControls) == null || o.setDisplay(!n), n && this.api.toolbar.close({ setExplicitlyClosed: !1 });
+      onAction: (s) => this.handleRowColAction(t, s),
+      onDragStateChange: (s) => {
+        var i;
+        this.resize && (this.resize.enabled = !s), (i = this.addControls) == null || i.setDisplay(!s), s && this.api.toolbar.close({ setExplicitlyClosed: !1 });
       },
-      onGripClick: (n, o) => {
-        var s, i;
-        n === "row" ? (s = this.cellSelection) == null || s.selectRow(o) : (i = this.cellSelection) == null || i.selectColumn(o);
+      onGripClick: (s, i) => {
+        var l, a;
+        s === "row" ? (l = this.cellSelection) == null || l.selectRow(i) : (a = this.cellSelection) == null || a.selectColumn(i);
       },
       onGripPopoverClose: () => {
-        var n, o;
+        var s, i;
         if (this.pendingHighlight) {
-          const { type: s, index: i } = this.pendingHighlight;
-          this.pendingHighlight = null, (n = this.rowColControls) == null || n.setActiveGrip(s, i), requestAnimationFrame(() => {
-            var l, a;
-            s === "row" ? (l = this.cellSelection) == null || l.selectRow(i) : (a = this.cellSelection) == null || a.selectColumn(i);
+          const { type: l, index: a } = this.pendingHighlight;
+          this.pendingHighlight = null, (s = this.rowColControls) == null || s.setActiveGrip(l, a), requestAnimationFrame(() => {
+            var c, d;
+            l === "row" ? (c = this.cellSelection) == null || c.selectRow(a) : (d = this.cellSelection) == null || d.selectColumn(a);
           });
         } else
-          (o = this.cellSelection) == null || o.clearActiveSelection();
+          (i = this.cellSelection) == null || i.clearActiveSelection();
       }
     }));
   }
   handleRowColAction(t, e) {
     const n = this.setDataGeneration;
     this.runTransactedStructuralOp(() => {
-      var c, d, h, u, p, m, C;
-      if (n !== this.setDataGeneration || ((c = this.element) == null ? void 0 : c.firstElementChild) !== t)
+      var c, d, h, u, p;
+      if (n !== this.setDataGeneration || this.gridElement !== t)
         return;
-      const o = this.model.colWidths, { blocksToDelete: s } = this.syncModelForAction(e), i = Qo(
+      const o = this.model.colWidths, { blocksToDelete: s } = this.syncModelForAction(e), i = os(
         t,
         e,
         {
@@ -4454,10 +4615,10 @@ class Ts {
           blocksToDelete: s
         }
       );
-      if (n !== this.setDataGeneration || ((d = this.element) == null ? void 0 : d.firstElementChild) !== t || (this.model.setColWidths(i.colWidths), this.model.setWithHeadings(i.withHeadings), this.model.setWithHeadingColumn(i.withHeadingColumn), this.pendingHighlight = i.pendingHighlight, tt(this.element, this.model.withHeadings), W(this.element, this.model.withHeadingColumn), this.initResize(t), (h = this.addControls) == null || h.syncRowButtonWidth(), (u = this.rowColControls) == null || u.refresh(), !i.moveSelection))
+      if (n !== this.setDataGeneration || this.gridElement !== t || (this.model.setColWidths(i.colWidths), this.model.setWithHeadings(i.withHeadings), this.model.setWithHeadingColumn(i.withHeadingColumn), this.pendingHighlight = i.pendingHighlight, tt(this.gridElement, this.model.withHeadings), G(this.gridElement, this.model.withHeadingColumn), this.initResize(t), (c = this.addControls) == null || c.syncRowButtonWidth(), (d = this.rowColControls) == null || d.refresh(), !i.moveSelection))
         return;
       const { type: l, index: a } = i.moveSelection;
-      l === "row" ? (p = this.cellSelection) == null || p.selectRow(a) : (m = this.cellSelection) == null || m.selectColumn(a), (C = this.rowColControls) == null || C.setActiveGrip(l, a);
+      l === "row" ? (h = this.cellSelection) == null || h.selectRow(a) : (u = this.cellSelection) == null || u.selectColumn(a), (p = this.rowColControls) == null || p.setActiveGrip(l, a);
     });
   }
   syncModelForAction(t) {
@@ -4490,28 +4651,28 @@ class Ts {
   initResize(t) {
     var o, s;
     (o = this.resize) == null || o.destroy();
-    const e = this.model.colWidths === void 0, n = (s = this.model.colWidths) != null ? s : V(t);
-    e || qt(this.element), this.resize = new jo(
+    const e = this.model.colWidths === void 0, n = (s = this.model.colWidths) != null ? s : z(t);
+    e || Ut(this.ensureScrollContainer()), this.resize = new Jo(
       t,
       n,
       (i) => {
-        var l;
-        this.model.setColWidths(i), qt(this.element), (l = this.rowColControls) == null || l.positionGrips();
+        var l, a, c;
+        this.model.setColWidths(i), Ut(this.ensureScrollContainer()), (l = this.rowColControls) == null || l.positionGrips(), (a = this.addControls) == null || a.syncRowButtonWidth(), (c = this.scrollHaze) == null || c.update();
       },
       () => {
         var i;
         (i = this.rowColControls) == null || i.hideAllGrips();
       },
       () => {
-        var i;
-        (i = this.addControls) == null || i.syncRowButtonWidth();
+        var i, l;
+        (i = this.addControls) == null || i.syncRowButtonWidth(), (l = this.scrollHaze) == null || l.update();
       },
       e
     );
   }
   initCellBlocks(t) {
     var e;
-    this.cellBlocks = new ko({
+    this.cellBlocks = new To({
       api: this.api,
       gridElement: t,
       tableBlockId: (e = this.blockId) != null ? e : "",
@@ -4523,52 +4684,67 @@ class Ts {
     const n = this.collectCellBlockData(t);
     if (n.length === 0)
       return;
-    const o = Ye(n);
-    e.setData("text/html", Ze(o)), e.setData("text/plain", Je(o));
+    const o = Rt(n);
+    e.setData("text/html", Lt(o)), e.setData("text/plain", It(o));
+  }
+  handleCellCopyViaButton(t) {
+    const e = this.collectCellBlockData(t);
+    if (e.length === 0)
+      return;
+    const n = Rt(e), o = Lt(n), s = It(n), i = new Blob([o], { type: "text/html" }), l = new Blob([s], { type: "text/plain" });
+    navigator.clipboard.write([
+      new ClipboardItem({
+        "text/html": i,
+        "text/plain": l
+      })
+    ]);
   }
   collectCellBlockData(t) {
-    var o;
-    const e = (o = this.element) == null ? void 0 : o.firstElementChild;
+    const e = this.gridElement;
     if (!e)
       return [];
-    const n = Array.from(e.querySelectorAll(`[${f}]`));
-    return t.map((s) => {
-      var p;
-      const i = s.closest(`[${f}]`);
-      if (!i)
+    const n = Array.from(e.querySelectorAll(`[${m}]`));
+    return t.map((o) => {
+      var u;
+      const s = o.closest(`[${m}]`);
+      if (!s)
         return null;
-      const l = n.indexOf(i), c = Array.from(i.querySelectorAll(`[${g}]`)).indexOf(s), d = s.querySelector(`[${R}]`), h = [];
-      if (!d)
-        return { row: l, col: c, blocks: h };
-      d.querySelectorAll("[data-blok-id]").forEach((m) => {
-        const C = m.getAttribute("data-blok-id");
+      const i = n.indexOf(s), a = Array.from(s.querySelectorAll(`[${g}]`)).indexOf(o), c = o.querySelector(`[${R}]`), d = [];
+      if (!c)
+        return { row: i, col: a, blocks: d };
+      c.querySelectorAll("[data-blok-id]").forEach((p) => {
+        const C = p.getAttribute("data-blok-id");
         if (!C)
           return;
-        const y = this.api.blocks.getBlockIndex(C);
-        if (y === void 0)
+        const f = this.api.blocks.getBlockIndex(C);
+        if (f === void 0)
           return;
-        const v = this.api.blocks.getBlockByIndex(y);
-        v && h.push(E({
-          tool: v.name,
-          data: v.preservedData
-        }, Object.keys(v.preservedTunes).length > 0 ? { tunes: v.preservedTunes } : {}));
+        const y = this.api.blocks.getBlockByIndex(f);
+        y && d.push(E({
+          tool: y.name,
+          data: y.preservedData
+        }, Object.keys(y.preservedTunes).length > 0 ? { tunes: y.preservedTunes } : {}));
       });
-      const u = h.length === 0 ? ((p = d.textContent) != null ? p : "").trim() : "";
-      return h.length === 0 && u.length > 0 && h.push({
+      const h = d.length === 0 ? ((u = c.textContent) != null ? u : "").trim() : "";
+      return d.length === 0 && h.length > 0 && d.push({
         tool: "paragraph",
-        data: { text: u }
-      }), { row: l, col: c, blocks: h };
-    }).filter((s) => s !== null);
+        data: { text: h }
+      }), { row: i, col: a, blocks: d };
+    }).filter((o) => o !== null);
   }
   initCellSelection(t) {
     var n;
     (n = this.cellSelection) == null || n.destroy();
     const e = this.api.rectangleSelection;
-    this.cellSelection = new Gt({
+    this.cellSelection = new zt({
       grid: t,
       rectangleSelection: e,
       // Pass reference
       i18n: this.api.i18n,
+      isPopoverOpen: () => {
+        var o, s;
+        return (s = (o = this.rowColControls) == null ? void 0 : o.isPopoverOpen) != null ? s : !1;
+      },
       onSelectionActiveChange: (o) => {
         var s, i;
         this.resize && (this.resize.enabled = !o), (s = this.addControls) == null || s.setInteractive(!o), (i = this.rowColControls) == null || i.setGripsDisplay(!o);
@@ -4584,6 +4760,9 @@ class Ts {
       },
       onCut: (o, s) => {
         this.handleCellCopy(o, s);
+      },
+      onCopyViaButton: (o) => {
+        this.handleCellCopyViaButton(o);
       }
     });
   }
@@ -4591,15 +4770,22 @@ class Ts {
     var n;
     (n = this.cellSelection) == null || n.destroy();
     const e = this.api.rectangleSelection;
-    this.cellSelection = new Gt({
+    this.cellSelection = new zt({
       grid: t,
       rectangleSelection: e,
       i18n: this.api.i18n,
       onCopy: (o, s) => {
         this.handleCellCopy(o, s);
+      },
+      onCopyViaButton: (o) => {
+        this.handleCellCopyViaButton(o);
       }
     });
   }
+  initScrollHaze() {
+    var t;
+    (t = this.scrollHaze) == null || t.destroy(), !(!this.element || !this.scrollContainer) && (this.scrollHaze = new As(), this.scrollHaze.init(this.element, this.scrollContainer));
+  }
   initGridPasteListener(t) {
     t.addEventListener("paste", (e) => {
       this.handleGridPaste(e, t);
@@ -4608,7 +4794,7 @@ class Ts {
   handleGridPaste(t, e) {
     if (this.readOnly || !t.clipboardData || t.defaultPrevented)
       return;
-    const n = t.clipboardData.getData("text/html"), o = Qe(n), s = o === null ? tn(n) : null, i = o != null ? o : s;
+    const n = t.clipboardData.getData("text/html"), o = on(n), s = o === null ? sn(n) : null, i = o != null ? o : s;
     if (!i || s !== null && new DOMParser().parseFromString(n, "text/html").querySelectorAll("table").length > 1)
       return;
     const l = document.activeElement;
@@ -4617,35 +4803,35 @@ class Ts {
     const a = l.closest(`[${g}]`);
     if (!a || !e.contains(a))
       return;
-    const c = a.closest(`[${f}]`);
+    const c = a.closest(`[${m}]`);
     if (!c)
       return;
     t.preventDefault(), t.stopPropagation();
-    const h = Array.from(e.querySelectorAll(`[${f}]`)).indexOf(c), p = Array.from(c.querySelectorAll(`[${g}]`)).indexOf(a);
+    const h = Array.from(e.querySelectorAll(`[${m}]`)).indexOf(c), p = Array.from(c.querySelectorAll(`[${g}]`)).indexOf(a);
     this.pastePayloadIntoCells(e, i, h, p);
   }
   pastePayloadIntoCells(t, e, n, o) {
     this.runTransactedStructuralOp(() => {
       var h, u;
       this.expandGridForPaste(t, n + e.rows, o + e.cols);
-      const d = t.querySelectorAll(`[${f}]`);
-      Array.from({ length: e.rows }, (p, m) => m).forEach((p) => {
-        const m = d[n + p];
-        if (!m)
+      const d = t.querySelectorAll(`[${m}]`);
+      Array.from({ length: e.rows }, (p, C) => C).forEach((p) => {
+        const C = d[n + p];
+        if (!C)
           return;
-        const C = m.querySelectorAll(`[${g}]`);
-        Array.from({ length: e.cols }, (y, v) => v).forEach((y) => {
+        const f = C.querySelectorAll(`[${g}]`);
+        Array.from({ length: e.cols }, (y, S) => S).forEach((y) => {
           var k, A;
-          const v = C[o + y];
-          if (v) {
-            this.pasteCellPayload(v, e.cells[p][y]);
-            const T = (A = (k = this.cellBlocks) == null ? void 0 : k.getBlockIdsFromCells([v])) != null ? A : [];
+          const S = f[o + y];
+          if (S) {
+            this.pasteCellPayload(S, e.cells[p][y]);
+            const T = (A = (k = this.cellBlocks) == null ? void 0 : k.getBlockIdsFromCells([S])) != null ? A : [];
             this.model.setCellBlocks(n + p, o + y, T);
           }
         });
       }), this.initResize(t), (h = this.addControls) == null || h.syncRowButtonWidth(), (u = this.rowColControls) == null || u.refresh();
     });
-    const i = t.querySelectorAll(`[${f}]`)[n + e.rows - 1], l = i == null ? void 0 : i.querySelectorAll(`[${g}]`)[o + e.cols - 1];
+    const i = t.querySelectorAll(`[${m}]`)[n + e.rows - 1], l = i == null ? void 0 : i.querySelectorAll(`[${g}]`)[o + e.cols - 1];
     if (!l || !this.cellBlocks || !this.api.caret)
       return;
     const a = this.cellBlocks.getBlockIdsFromCells([l]), c = a[a.length - 1];
@@ -4657,11 +4843,11 @@ class Ts {
   expandGridForPaste(t, e, n) {
     const o = this.grid.getRowCount(t), s = this.grid.getColumnCount(t);
     Array.from({ length: Math.max(0, e - o) }).forEach(() => {
-      this.grid.addRow(t), this.model.addRow(), N(t, this.cellBlocks), tt(this.element, this.model.withHeadings), W(this.element, this.model.withHeadingColumn);
+      this.grid.addRow(t), this.model.addRow(), H(t, this.cellBlocks), tt(this.gridElement, this.model.withHeadings), G(this.gridElement, this.model.withHeadingColumn);
     }), Array.from({ length: Math.max(0, n - s) }).forEach(() => {
       var a;
-      const i = (a = this.model.colWidths) != null ? a : V(t), l = this.model.initialColWidth !== void 0 ? Math.round(this.model.initialColWidth / 2 * 100) / 100 : et(i);
-      this.grid.addColumn(t, void 0, i, l), this.model.addColumn(void 0, l), this.model.setColWidths([...i, l]), N(t, this.cellBlocks), W(this.element, this.model.withHeadingColumn);
+      const i = (a = this.model.colWidths) != null ? a : z(t), l = this.model.initialColWidth !== void 0 ? Math.round(this.model.initialColWidth / 2 * 100) / 100 : et(i);
+      this.grid.addColumn(t, void 0, i, l), this.model.addColumn(void 0, l), this.model.setColWidths([...i, l]), H(t, this.cellBlocks), G(this.gridElement, this.model.withHeadingColumn);
     });
   }
   /**
@@ -4692,10 +4878,10 @@ class Ts {
     }
   }
 }
-const z = (r) => {
+const V = (r) => {
   const t = r.tagName;
   return t === "B" || t === "STRONG";
-}, pt = (r) => !!(r && r.nodeType === Node.ELEMENT_NODE && z(r)), be = (r) => r.textContent.length === 0, H = (r) => r ? r.nodeType === Node.ELEMENT_NODE && z(r) ? _(r) : H(r.parentNode) : null, _ = (r) => {
+}, pt = (r) => !!(r && r.nodeType === Node.ELEMENT_NODE && V(r)), Ae = (r) => r.textContent.length === 0, N = (r) => r ? r.nodeType === Node.ELEMENT_NODE && V(r) ? _(r) : N(r.parentNode) : null, _ = (r) => {
   if (r.tagName === "STRONG")
     return r;
   const t = document.createElement("strong");
@@ -4704,7 +4890,7 @@ const z = (r) => {
   }); r.firstChild; )
     t.appendChild(r.firstChild);
   return r.replaceWith(t), t;
-}, vs = (r) => {
+}, Rs = (r) => {
   const t = r.nextSibling;
   if ((t == null ? void 0 : t.nodeType) === Node.TEXT_NODE)
     return t;
@@ -4713,15 +4899,15 @@ const z = (r) => {
     return null;
   const n = r.ownerDocument.createTextNode("");
   return e.insertBefore(n, t), n;
-}, ws = (r) => {
+}, Ls = (r) => {
   if (!r.boldElement.isConnected)
     return null;
-  const t = _(r.boldElement), e = r.boundary, o = e.isConnected && e.previousSibling === t ? e : vs(t);
+  const t = _(r.boldElement), e = r.boundary, o = e.isConnected && e.previousSibling === t ? e : Rs(t);
   return o ? {
     boundary: o,
     boldElement: t
   } : null;
-}, vt = (r, t) => r ? r === t || t.contains(r) : !1, S = {
+}, St = (r, t) => r ? r === t || t.contains(r) : !1, w = {
   COLLAPSED_LENGTH: "data-blok-bold-collapsed-length",
   COLLAPSED_ACTIVE: "data-blok-bold-collapsed-active",
   PREV_LENGTH: "data-blok-bold-prev-length",
@@ -4754,13 +4940,13 @@ const z = (r) => {
    * @param element - The element to check
    */
   isActivePlaceholder(t) {
-    return t.getAttribute(S.COLLAPSED_ACTIVE) === "true" || t.hasAttribute(S.COLLAPSED_LENGTH);
+    return t.getAttribute(w.COLLAPSED_ACTIVE) === "true" || t.hasAttribute(w.COLLAPSED_LENGTH);
   }
   /**
    * Get the ATTR constants for external use
    */
   static get ATTR() {
-    return S;
+    return w;
   }
   /**
    * Enter collapsed bold mode by inserting an empty <strong> for typing
@@ -4771,7 +4957,7 @@ const z = (r) => {
     if (!t.collapsed)
       return;
     const n = document.createElement("strong"), o = document.createTextNode("");
-    n.appendChild(o), n.setAttribute(S.COLLAPSED_ACTIVE, "true");
+    n.appendChild(o), n.setAttribute(w.COLLAPSED_ACTIVE, "true");
     const s = t.startContainer, i = t.startOffset;
     if (!(s.nodeType === Node.TEXT_NODE ? this.insertCollapsedBoldIntoText(s, n, i) : s.nodeType === Node.ELEMENT_NODE ? (this.insertCollapsedBoldIntoElement(s, n, i), !0) : !1))
       return;
@@ -4793,7 +4979,7 @@ const z = (r) => {
     const s = t.textContent, i = s.slice(0, n), l = s.slice(n);
     t.textContent = i;
     const a = l.length ? document.createTextNode(l) : null;
-    return a && o.insertBefore(a, t.nextSibling), o.insertBefore(e, a != null ? a : t.nextSibling), e.setAttribute(S.PREV_LENGTH, i.length.toString()), !0;
+    return a && o.insertBefore(a, t.nextSibling), o.insertBefore(e, a != null ? a : t.nextSibling), e.setAttribute(w.PREV_LENGTH, i.length.toString()), !0;
   }
   /**
    * Insert a collapsed bold wrapper directly into an element container
@@ -4801,7 +4987,7 @@ const z = (r) => {
   insertCollapsedBoldIntoElement(t, e, n) {
     var s;
     const o = (s = t.childNodes[n]) != null ? s : null;
-    t.insertBefore(e, o), e.setAttribute(S.PREV_LENGTH, "0");
+    t.insertBefore(e, o), e.setAttribute(w.PREV_LENGTH, "0");
   }
   /**
    * Exit a collapsed bold selection by moving caret outside the bold element
@@ -4811,14 +4997,14 @@ const z = (r) => {
   exit(t, e) {
     const n = _(e), o = n.parentNode;
     if (o)
-      return be(n) ? this.removeEmptyBoldElement(t, n, o) : this.exitBoldWithContent(t, n, o);
+      return Ae(n) ? this.removeEmptyBoldElement(t, n, o) : this.exitBoldWithContent(t, n, o);
   }
   removeEmptyBoldElement(t, e, n) {
     const o = document.createRange();
     return o.setStartBefore(e), o.collapse(!0), n.removeChild(e), t.removeAllRanges(), t.addRange(o), o;
   }
   exitBoldWithContent(t, e, n) {
-    e.setAttribute(S.COLLAPSED_LENGTH, e.textContent.length.toString()), e.removeAttribute(S.PREV_LENGTH), e.removeAttribute(S.COLLAPSED_ACTIVE), e.removeAttribute(S.LEADING_WHITESPACE);
+    e.setAttribute(w.COLLAPSED_LENGTH, e.textContent.length.toString()), e.removeAttribute(w.PREV_LENGTH), e.removeAttribute(w.COLLAPSED_ACTIVE), e.removeAttribute(w.LEADING_WHITESPACE);
     const o = e.nextSibling, s = !o || o.nodeType !== Node.TEXT_NODE, i = s ? document.createTextNode("​") : null;
     i && n.insertBefore(i, o);
     const l = i != null ? i : o;
@@ -4839,7 +5025,7 @@ const z = (r) => {
   maintain() {
     if (typeof document != "undefined")
       for (const t of Array.from(this.records)) {
-        const e = ws(t);
+        const e = Ls(t);
         if (!e) {
           this.records.delete(t);
           continue;
@@ -4876,13 +5062,13 @@ const z = (r) => {
    */
   synchronize(t) {
     var i, l;
-    const e = (i = t == null ? void 0 : t.anchorNode) != null ? i : t == null ? void 0 : t.focusNode, n = e && e.nodeType === Node.ELEMENT_NODE ? e : e == null ? void 0 : e.parentElement, o = (l = n == null ? void 0 : n.closest(O(I.editor))) != null ? l : n == null ? void 0 : n.ownerDocument;
+    const e = (i = t == null ? void 0 : t.anchorNode) != null ? i : t == null ? void 0 : t.focusNode, n = e && e.nodeType === Node.ELEMENT_NODE ? e : e == null ? void 0 : e.parentElement, o = (l = n == null ? void 0 : n.closest(O(L.editor))) != null ? l : n == null ? void 0 : n.ownerDocument;
     if (!o)
       return;
-    const s = `strong[${S.COLLAPSED_ACTIVE}="true"]`;
+    const s = `strong[${w.COLLAPSED_ACTIVE}="true"]`;
     o.querySelectorAll(s).forEach((a) => {
-      var kt;
-      const c = a.getAttribute(S.PREV_LENGTH), d = a.previousSibling;
+      var At;
+      const c = a.getAttribute(w.PREV_LENGTH), d = a.previousSibling;
       if (!c || !d || d.nodeType !== Node.TEXT_NODE)
         return;
       const h = Number(c);
@@ -4891,18 +5077,18 @@ const z = (r) => {
       const u = d, p = u.textContent;
       if (p.length <= h)
         return;
-      const m = p.slice(0, h), C = p.slice(h);
-      u.textContent = m;
-      const y = C.match(/^[\u00A0\s]+/);
-      if (y && !a.hasAttribute(S.LEADING_WHITESPACE) && a.setAttribute(S.LEADING_WHITESPACE, y[0]), C.length === 0)
+      const C = p.slice(0, h), f = p.slice(h);
+      u.textContent = C;
+      const y = f.match(/^[\u00A0\s]+/);
+      if (y && !a.hasAttribute(w.LEADING_WHITESPACE) && a.setAttribute(w.LEADING_WHITESPACE, y[0]), f.length === 0)
         return;
-      const v = a.textContent, k = v + C, A = (kt = a.getAttribute(S.LEADING_WHITESPACE)) != null ? kt : "", $ = A.length > 0 && v.length === 0 && !k.startsWith(A) ? A + k : k, q = document.createTextNode($);
+      const S = a.textContent, k = S + f, A = (At = a.getAttribute(w.LEADING_WHITESPACE)) != null ? At : "", q = A.length > 0 && S.length === 0 && !k.startsWith(A) ? A + k : k, F = document.createTextNode(q);
       for (; a.firstChild; )
         a.removeChild(a.firstChild);
-      if (a.appendChild(q), !(t != null && t.isCollapsed) || !vt(t.focusNode, u))
+      if (a.appendChild(F), !(t != null && t.isCollapsed) || !St(t.focusNode, u))
         return;
-      const Q = document.createRange(), Ae = q.textContent.length;
-      Q.setStart(q, Ae), Q.collapse(!0), t.removeAllRanges(), t.addRange(Q);
+      const Q = document.createRange(), Re = F.textContent.length;
+      Q.setStart(F, Re), Q.collapse(!0), t.removeAllRanges(), t.addRange(Q);
     });
   }
   /**
@@ -4914,29 +5100,29 @@ const z = (r) => {
     const e = (i = t == null ? void 0 : t.anchorNode) != null ? i : t == null ? void 0 : t.focusNode;
     if (!e)
       return;
-    const n = e.nodeType === Node.ELEMENT_NODE ? e : e.parentElement, o = n == null ? void 0 : n.closest(O(I.editor));
+    const n = e.nodeType === Node.ELEMENT_NODE ? e : e.parentElement, o = n == null ? void 0 : n.closest(O(L.editor));
     if (!o)
       return;
-    o.querySelectorAll(`strong[${S.COLLAPSED_LENGTH}]`).forEach((l) => {
+    o.querySelectorAll(`strong[${w.COLLAPSED_LENGTH}]`).forEach((l) => {
       var A, T;
-      const a = l.getAttribute(S.COLLAPSED_LENGTH);
+      const a = l.getAttribute(w.COLLAPSED_LENGTH);
       if (!a)
         return;
       const c = Number(a), d = l.textContent;
       if (!Number.isFinite(c))
         return;
-      const h = d.length > c, u = h ? this.splitCollapsedBoldText(l, c, d) : null, p = l.getAttribute(S.PREV_LENGTH), m = p ? Number(p) : NaN, C = l.previousSibling, y = (C == null ? void 0 : C.nodeType) === Node.TEXT_NODE ? C : null, v = (A = y == null ? void 0 : y.textContent) != null ? A : "", k = !!(p && Number.isFinite(m) && y && v.length > m);
+      const h = d.length > c, u = h ? this.splitCollapsedBoldText(l, c, d) : null, p = l.getAttribute(w.PREV_LENGTH), C = p ? Number(p) : NaN, f = l.previousSibling, y = (f == null ? void 0 : f.nodeType) === Node.TEXT_NODE ? f : null, S = (A = y == null ? void 0 : y.textContent) != null ? A : "", k = !!(p && Number.isFinite(C) && y && S.length > C);
       if (k && y) {
-        const $ = v.slice(0, m), q = v.slice(m);
-        y.textContent = $;
-        const Q = document.createTextNode(q);
+        const q = S.slice(0, C), F = S.slice(C);
+        y.textContent = q;
+        const Q = document.createTextNode(F);
         (T = l.parentNode) == null || T.insertBefore(Q, l.nextSibling);
       }
-      if (k && l.removeAttribute(S.PREV_LENGTH), t != null && t.isCollapsed && u && vt(t.focusNode, l)) {
-        const $ = document.createRange(), q = u.textContent.length;
-        $.setStart(u, q), $.collapse(!0), t.removeAllRanges(), t.addRange($);
+      if (k && l.removeAttribute(w.PREV_LENGTH), t != null && t.isCollapsed && u && St(t.focusNode, l)) {
+        const q = document.createRange(), F = u.textContent.length;
+        q.setStart(u, F), q.collapse(!0), t.removeAllRanges(), t.addRange(q);
       }
-      h && l.removeAttribute(S.COLLAPSED_LENGTH);
+      h && l.removeAttribute(w.COLLAPSED_LENGTH);
     });
   }
   /**
@@ -4994,8 +5180,8 @@ const z = (r) => {
     const e = t.getRangeAt(0);
     if (!e.collapsed)
       return;
-    const n = H(e.startContainer);
-    (n == null ? void 0 : n.getAttribute(S.COLLAPSED_ACTIVE)) !== "true" && (this.moveCaretFromElementContainer(t, e) || this.moveCaretFromTextContainer(t, e));
+    const n = N(e.startContainer);
+    (n == null ? void 0 : n.getAttribute(w.COLLAPSED_ACTIVE)) !== "true" && (this.moveCaretFromElementContainer(t, e) || this.moveCaretFromTextContainer(t, e));
   }
   /**
    * Adjust caret when selection container is an element adjacent to bold content
@@ -5053,7 +5239,7 @@ const z = (r) => {
       this.setCaret(t, n, s.length);
       return;
     }
-    const l = H(n);
+    const l = N(n);
     if (!l || e.startOffset !== n.textContent.length)
       return;
     const a = this.ensureFollowingTextNode(l, l.nextSibling);
@@ -5101,7 +5287,7 @@ const z = (r) => {
 };
 P.instance = null;
 let B = P;
-const Ss = {
+const Is = {
   convertLegacyTags: !0,
   normalizeWhitespace: !0,
   removeEmpty: !0,
@@ -5114,7 +5300,7 @@ class D {
    * @param options - Configuration for the normalization pass
    */
   constructor(t) {
-    this.options = E(E({}, Ss), t);
+    this.options = E(E({}, Is), t);
   }
   /**
    * Run normalization on a scoped element
@@ -5210,7 +5396,7 @@ class D {
    * @returns true if the element is empty and doesn't contain the preserved node
    */
   isEmptyAndSafe(t) {
-    return !(t.textContent.length === 0) || B.getInstance().isActivePlaceholder(t) ? !1 : !(this.options.preserveNode && vt(this.options.preserveNode, t));
+    return !(t.textContent.length === 0) || B.getInstance().isActivePlaceholder(t) ? !1 : !(this.options.preserveNode && St(this.options.preserveNode, t));
   }
   /**
    * Merge a <strong> element with adjacent <strong> siblings
@@ -5249,11 +5435,11 @@ class D {
     const n = e.nodeType === Node.ELEMENT_NODE ? e : e.parentElement;
     if (!n)
       return null;
-    const o = (l = n.closest('[data-blok-component="paragraph"]')) != null ? l : n.closest(O(I.elementContent));
-    return o || n.closest(O(I.editor));
+    const o = (l = n.closest('[data-blok-component="paragraph"]')) != null ? l : n.closest(O(L.elementContent));
+    return o || n.closest(O(L.editor));
   }
 }
-const L = class L {
+const I = class I {
   constructor() {
     this.handlers = /* @__PURE__ */ new Map(), this.listenersRegistered = !1, this.handleSelectionChange = () => {
       const t = this.getSelection();
@@ -5286,13 +5472,13 @@ const L = class L {
    * Get the singleton instance
    */
   static getInstance() {
-    return L.instance || (L.instance = new L()), L.instance;
+    return I.instance || (I.instance = new I()), I.instance;
   }
   /**
    * Reset the singleton instance (for testing)
    */
   static reset() {
-    L.instance && (L.instance.removeListeners(), L.instance.handlers.clear()), L.instance = null;
+    I.instance && (I.instance.removeListeners(), I.instance.handlers.clear()), I.instance = null;
   }
   /**
    * Register a handler for an inline tool
@@ -5344,9 +5530,9 @@ const L = class L {
     return !(e.meta && !s || e.ctrl && !t.ctrlKey);
   }
 };
-L.instance = null;
-let wt = L;
-const ks = (r, t) => {
+I.instance = null;
+let wt = I;
+const Ds = (r, t) => {
   try {
     return r.intersectsNode(t);
   } catch (e) {
@@ -5355,23 +5541,23 @@ const ks = (r, t) => {
     const o = r.compareBoundaryPoints(Range.END_TO_START, n) > 0, s = r.compareBoundaryPoints(Range.START_TO_END, n) < 0;
     return o && s;
   }
-}, ve = (r) => document.createTreeWalker(
+}, Ee = (r) => document.createTreeWalker(
   r.commonAncestorContainer,
   NodeFilter.SHOW_TEXT,
   {
-    acceptNode: (t) => ks(r, t) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT
+    acceptNode: (t) => Ds(r, t) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT
   }
-), J = (r, t) => r ? r.nodeType === Node.ELEMENT_NODE && t(r) ? r : J(r.parentNode, t) : null, we = (r, t) => J(r, t) !== null, Se = (r, t, e = {}) => {
+), J = (r, t) => r ? r.nodeType === Node.ELEMENT_NODE && t(r) ? r : J(r.parentNode, t) : null, xe = (r, t) => J(r, t) !== null, Te = (r, t, e = {}) => {
   if (r.collapsed)
     return J(r.startContainer, t) !== null;
-  const n = ve(r), o = [];
+  const n = Ee(r), o = [];
   for (; n.nextNode(); ) {
     const s = n.currentNode, i = s.textContent;
     e.ignoreWhitespace && i.trim().length === 0 || i.length !== 0 && o.push(s);
   }
-  return o.length === 0 ? J(r.startContainer, t) !== null : o.every((s) => we(s, t));
-}, ke = (r, t) => {
-  const e = /* @__PURE__ */ new Set(), n = ve(r);
+  return o.length === 0 ? J(r.startContainer, t) !== null : o.every((s) => xe(s, t));
+}, Be = (r, t) => {
+  const e = /* @__PURE__ */ new Set(), n = Ee(r);
   for (; n.nextNode(); ) {
     const o = J(n.currentNode, t);
     o && e.add(o);
@@ -5436,7 +5622,7 @@ const ks = (r, t) => {
    */
   render() {
     return {
-      icon: en,
+      icon: rn,
       name: "bold",
       onActivate: () => {
         this.toggleBold();
@@ -5498,7 +5684,7 @@ const ks = (r, t) => {
     o.setAttribute("data-blok-bold-marker", `unwrap-${b.markerSequence++}`), o.appendChild(s), this.removeNestedBold(o), t.insertNode(o);
     const i = document.createRange();
     for (i.selectNodeContents(o), n.removeAllRanges(), n.addRange(i); ; ) {
-      const d = H(o);
+      const d = N(o);
       if (!d)
         break;
       this.moveMarkerOutOfBold(o, d);
@@ -5508,7 +5694,7 @@ const ks = (r, t) => {
       const d = document.createRange();
       return d.setStartBefore(l), d.setEndAfter(a), n.removeAllRanges(), n.addRange(d), d;
     })() : void 0) || n.removeAllRanges(), D.normalizeAroundSelection(n), e.forEach((d) => {
-      be(d) && d.remove();
+      Ae(d) && d.remove();
     }), this.notifySelectionChange();
   }
   /**
@@ -5573,7 +5759,7 @@ const ks = (r, t) => {
    * @param options.ignoreWhitespace - Whether to ignore whitespace-only text nodes
    */
   isRangeBold(t, e) {
-    return Se(t, z, e);
+    return Te(t, V, e);
   }
   /**
    * Remove nested bold tags from a root node
@@ -5605,20 +5791,20 @@ const ks = (r, t) => {
    */
   findBoldElementFromRangeOrSelection(t, e) {
     if (!t)
-      return e ? H(e.focusNode) : null;
-    const n = H(t.startContainer);
+      return e ? N(e.focusNode) : null;
+    const n = N(t.startContainer);
     if (n)
       return n;
-    const o = H(t.commonAncestorContainer);
-    return o || (t.startContainer.nodeType === Node.ELEMENT_NODE && z(t.startContainer) ? t.startContainer : null);
+    const o = N(t.commonAncestorContainer);
+    return o || (t.startContainer.nodeType === Node.ELEMENT_NODE && V(t.startContainer) ? t.startContainer : null);
   }
   /**
    * Merge adjacent bold elements into a single element
    * @param element - The bold element to merge with adjacent elements
    */
   mergeAdjacentBold(t) {
-    const e = _(t), n = e.previousSibling, o = n && n.nodeType === Node.ELEMENT_NODE && z(n) ? b.mergeStrongNodes(n, e) : e, s = o.nextSibling;
-    return s && s.nodeType === Node.ELEMENT_NODE && z(s) ? b.mergeStrongNodes(o, s) : o;
+    const e = _(t), n = e.previousSibling, o = n && n.nodeType === Node.ELEMENT_NODE && V(n) ? b.mergeStrongNodes(n, e) : e, s = o.nextSibling;
+    return s && s.nodeType === Node.ELEMENT_NODE && V(s) ? b.mergeStrongNodes(o, s) : o;
   }
   /**
    * Toggle bold formatting for a collapsed selection (caret position)
@@ -5628,7 +5814,7 @@ const ks = (r, t) => {
     const t = window.getSelection();
     if (!t || t.rangeCount === 0)
       return;
-    const e = t.getRangeAt(0), n = H(e.startContainer), o = (() => {
+    const e = t.getRangeAt(0), n = N(e.startContainer), o = (() => {
       if (n && n.getAttribute(B.ATTR.COLLAPSED_ACTIVE) !== "true")
         return B.getInstance().exit(t, n);
       const s = n != null ? n : b.getBoundaryBold(e);
@@ -5657,7 +5843,7 @@ const ks = (r, 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, o = n == null ? void 0 : n.closest(O(I.editor));
+    const e = t.anchorNode, n = (e == null ? void 0 : e.nodeType) === Node.ELEMENT_NODE ? e : e == null ? void 0 : e.parentElement, o = n == null ? void 0 : n.closest(O(L.editor));
     if (!o)
       return;
     const s = o.querySelector("[data-blok-testid=inline-toolbar]");
@@ -5712,7 +5898,7 @@ const ks = (r, t) => {
    */
   static findBlokScopeFromNode(t) {
     const e = t.nodeType === Node.ELEMENT_NODE ? t : t.parentElement;
-    return !e || typeof e.closest != "function" ? null : e.closest(`${O(I.interface)}, ${O(I.editor)}`);
+    return !e || typeof e.closest != "function" ? null : e.closest(`${O(L.interface)}, ${O(L.editor)}`);
   }
   /**
    * Get a bold element at the boundary of a collapsed range
@@ -5730,7 +5916,7 @@ const ks = (r, t) => {
   static getBoundaryBoldForText(t, e) {
     const n = e.textContent.length;
     if (t.startOffset === n)
-      return H(e);
+      return N(e);
     if (t.startOffset !== 0)
       return null;
     const o = e.previousSibling;
@@ -5756,7 +5942,7 @@ const ks = (r, t) => {
     if (!e)
       return !1;
     const n = e.nodeType === Node.ELEMENT_NODE ? e : e.parentElement;
-    return !!(n != null && n.closest(O(I.editor)));
+    return !!(n != null && n.closest(O(L.editor)));
   }
   /**
    * Get HTML content of a range with bold tags removed
@@ -5781,11 +5967,11 @@ const ks = (r, t) => {
    * @param range - The range to search for bold ancestors
    */
   collectBoldAncestors(t) {
-    return ke(t, z);
+    return Be(t, V);
   }
 };
 b.isInline = !0, b.title = "Bold", b.titleKey = "bold", b.markerSequence = 0, b.isProcessingMutation = !1, b.instances = /* @__PURE__ */ new Set(), b.guardKeydownListenerRegistered = !1, b.shortcut = "CMD+B";
-let Yt = b;
+let ee = b;
 const ct = (r) => {
   const t = r.tagName;
   return t === "I" || t === "EM";
@@ -5806,7 +5992,7 @@ const ct = (r) => {
    */
   render() {
     return {
-      icon: nn,
+      icon: ln,
       name: "italic",
       onActivate: () => {
         this.toggleItalic();
@@ -5865,7 +6051,7 @@ const ct = (r) => {
    * @param options - Options for checking italic status
    */
   isRangeItalic(t, e) {
-    return Se(t, ct, e);
+    return Te(t, ct, e);
   }
   /**
    * Wrap selection with <i> tag
@@ -5905,7 +6091,7 @@ const ct = (r) => {
    * @param node - The node to check
    */
   hasItalicParent(t) {
-    return we(t, ct);
+    return xe(t, ct);
   }
   /**
    * Find an italic element in the parent chain
@@ -5919,7 +6105,7 @@ const ct = (r) => {
    * @param range - The range to search for italic ancestors
    */
   collectItalicAncestors(t) {
-    return ke(t, ct);
+    return Be(t, ct);
   }
   /**
    * Get HTML content of a range with italic tags removed
@@ -6007,7 +6193,7 @@ const ct = (r) => {
   }
 };
 j.isInline = !0, j.title = "Italic", j.titleKey = "italic", j.shortcut = "CMD+I";
-let Zt = j;
+let ne = j;
 const X = class X {
   /**
    * @param api - Blok API
@@ -6043,7 +6229,7 @@ const X = class X {
    */
   render() {
     return {
-      icon: on,
+      icon: an,
       name: "link",
       isActive: () => !!this.selection.findParentTag("A"),
       children: {
@@ -6086,7 +6272,7 @@ const X = class X {
       this.nodes.input.value = o !== null ? o : "";
     } else
       this.nodes.input.value = "";
-    this.nodes.input.className = w(this.INPUT_BASE_CLASSES, "block"), this.setBooleanStateAttribute(this.nodes.input, this.DATA_ATTRIBUTES.inputOpened, !0), this.selection.setFakeBackground(), this.selection.save(), t && this.focusInputWithRetry(), this.inputOpened = !0;
+    this.nodes.input.className = v(this.INPUT_BASE_CLASSES, "block"), this.setBooleanStateAttribute(this.nodes.input, this.DATA_ATTRIBUTES.inputOpened, !0), this.selection.setFakeBackground(), this.selection.save(), t && this.focusInputWithRetry(), this.inputOpened = !0;
   }
   /**
    * Ensures the link input receives focus even if other listeners steal it
@@ -6102,7 +6288,7 @@ const X = class X {
    */
   getButtonElement() {
     const t = document.querySelector(
-      `${O(I.interface, rn)} [data-blok-item-name="link"]`
+      `${O(L.interface, dn)} [data-blok-item-name="link"]`
     );
     return t && t !== this.nodes.button && (t.addEventListener("click", this.handleButtonClick, !0), this.nodes.button = t), t;
   }
@@ -6159,7 +6345,7 @@ const X = class X {
       this.notifier.show({
         message: this.i18n.t("tools.link.invalidLink"),
         style: "error"
-      }), sn("Incorrect Link pasted", "warn", e);
+      }), cn("Incorrect Link pasted", "warn", e);
       return;
     }
     const n = this.prepareLink(e);
@@ -6237,26 +6423,26 @@ const X = class X {
   }
 };
 X.isInline = !0, X.title = "Link", X.titleKey = "link", X.shortcut = "CMD+K";
-let Jt = X;
-const Bs = {
+let oe = X;
+const Ms = {
   paragraph: { preserveBlank: !0 },
   header: {},
   list: {},
   table: {}
-}, Rs = {
+}, _s = {
   bold: {},
   italic: {},
   link: {}
 };
 export {
-  Yt as Bold,
-  Ds as Convert,
-  Rt as Header,
-  Zt as Italic,
-  Jt as Link,
-  xs as List,
-  Bt as Paragraph,
-  Ts as Table,
-  Bs as defaultBlockTools,
-  Rs as defaultInlineTools
+  ee as Bold,
+  $s as Convert,
+  Ht as Header,
+  ne as Italic,
+  oe as Link,
+  Ns as List,
+  Dt as Paragraph,
+  Os as Table,
+  Ms as defaultBlockTools,
+  _s as defaultInlineTools
 };