@lumir-company/editor 0.4.15 → 0.4.17

package/dist/index.js

@@ -24,7 +24,10 @@ __export(index_exports, {
   BACKGROUND_COLORS: () => BACKGROUND_COLORS,
   ContentUtils: () => ContentUtils,
   EditorConfig: () => EditorConfig,
+  FONT_SIZE_PRESETS: () => FONT_SIZE_PRESETS,
   FloatingMenu: () => FloatingMenu,
+  FontSize: () => FontSize,
+  FontSizeButton: () => FontSizeButton2,
   HtmlPreviewBlock: () => HtmlPreviewBlock,
   HtmlPreviewSchema: () => schema,
   LinkPreviewBlock: () => LinkPreviewBlock,
@@ -35,15 +38,17 @@ __export(index_exports, {
   cn: () => cn,
   createS3Uploader: () => createS3Uploader,
   fetchLinkMetadata: () => fetchLinkMetadata,
-  getHexFromColorValue: () => getHexFromColorValue
+  getHexFromColorValue: () => getHexFromColorValue,
+  liftFontSize: () => liftFontSize,
+  lowerFontSize: () => lowerFontSize
 });
 module.exports = __toCommonJS(index_exports);
 
 // src/components/LumirEditor.tsx
-var import_react30 = require("react");
-var import_react31 = require("@blocknote/react");
+var import_react37 = require("react");
+var import_react38 = require("@blocknote/react");
 var import_mantine = require("@blocknote/mantine");
-var import_core5 = require("@blocknote/core");
+var import_core9 = require("@blocknote/core");
 var import_locales = require("@blocknote/core/locales");
 
 // src/utils/cn.ts
@@ -280,8 +285,8 @@ var createS3Uploader = (config) => {
 };
 
 // src/blocks/HtmlPreview.tsx
-var import_react5 = require("@blocknote/react");
-var import_core = require("@blocknote/core");
+var import_react6 = require("@blocknote/react");
+var import_core3 = require("@blocknote/core");
 
 // src/blocks/LinkPreview.tsx
 var import_react = require("@blocknote/react");
@@ -1241,9 +1246,336 @@ var VideoBlock = (0, import_react3.createReactBlockSpec)(
   }
 );
 
-// src/blocks/HtmlPreview.tsx
-var import_react6 = require("react");
+// src/blocks/columns/ColumnList.ts
+var import_core = require("@blocknote/core");
+
+// src/blocks/columns/columnNormalization.ts
+var import_prosemirror_state = require("prosemirror-state");
+var columnNormalizationKey = new import_prosemirror_state.PluginKey("lumirColumnNormalization");
+function columnNormalization() {
+  return new import_prosemirror_state.Plugin({
+    key: columnNormalizationKey,
+    appendTransaction(transactions, _oldState, newState) {
+      if (!transactions.some((tr2) => tr2.docChanged)) {
+        return null;
+      }
+      const lists = [];
+      newState.doc.descendants((node, pos) => {
+        if (node.type.name === "columnList") {
+          lists.push({ pos, node });
+          return false;
+        }
+        return void 0;
+      });
+      if (lists.length === 0) {
+        return null;
+      }
+      const tr = newState.tr;
+      let modified = false;
+      for (let i = lists.length - 1; i >= 0; i--) {
+        const { pos, node } = lists[i];
+        const nonEmptyColumns = [];
+        node.forEach((col) => {
+          if (col.type.name === "column" && col.childCount > 0) {
+            nonEmptyColumns.push(col);
+          }
+        });
+        if (nonEmptyColumns.length >= 2) {
+          continue;
+        }
+        const from = tr.mapping.map(pos);
+        const to = tr.mapping.map(pos + node.nodeSize);
+        const blocks = [];
+        nonEmptyColumns.forEach((col) => {
+          col.forEach((bc) => blocks.push(bc));
+        });
+        if (blocks.length > 0) {
+          tr.replaceWith(from, to, blocks);
+        } else {
+          tr.delete(from, to);
+        }
+        modified = true;
+      }
+      return modified ? tr : null;
+    }
+  });
+}
+
+// src/blocks/columns/columnDnd.ts
+var import_prosemirror_state2 = require("prosemirror-state");
+var import_prosemirror_view = require("prosemirror-view");
+
+// src/blocks/columns/mergeColumns.ts
+function mergeBlocksIntoColumns(editor, draggedId, targetId, side) {
+  if (!editor || !draggedId || !targetId || draggedId === targetId) {
+    return false;
+  }
+  const dragged = editor.getBlock?.(draggedId);
+  const target = editor.getBlock?.(targetId);
+  if (!dragged || !target) {
+    return false;
+  }
+  if (dragged.type === "columnList" || dragged.type === "column" || target.type === "columnList" || target.type === "column") {
+    return false;
+  }
+  const columnList = {
+    type: "columnList",
+    children: side === "left" ? [
+      { type: "column", children: [dragged] },
+      { type: "column", children: [target] }
+    ] : [
+      { type: "column", children: [target] },
+      { type: "column", children: [dragged] }
+    ]
+  };
+  try {
+    const run = () => {
+      editor.removeBlocks([draggedId]);
+      editor.replaceBlocks([targetId], [columnList]);
+    };
+    if (typeof editor.transact === "function") {
+      editor.transact(run);
+    } else {
+      run();
+    }
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+// src/blocks/columns/columnDnd.ts
+var columnDndKey = new import_prosemirror_state2.PluginKey("lumirColumnDnd");
+function edgeThreshold(width) {
+  return Math.min(80, width * 0.3);
+}
+function topLevelBlockAtCoords(view, x, y) {
+  const found = view.posAtCoords({ left: x, top: y });
+  if (!found) {
+    return null;
+  }
+  const $pos = view.state.doc.resolve(found.pos);
+  for (let d = $pos.depth; d > 0; d--) {
+    if ($pos.node(d).type.name === "blockContainer") {
+      if (d !== 2 || $pos.node(d - 1).type.name !== "blockGroup") {
+        return null;
+      }
+      const pos = $pos.before(d);
+      const node = $pos.node(d);
+      const dom = view.nodeDOM(pos);
+      if (!dom || !node.attrs?.id) {
+        return null;
+      }
+      return { pos, nodeSize: node.nodeSize, id: node.attrs.id, dom };
+    }
+  }
+  return null;
+}
+function draggedBlockId(view) {
+  const sel = view.state.selection;
+  return sel?.node?.attrs?.id ?? null;
+}
+function setDnd(view, next) {
+  const cur = columnDndKey.getState(view.state);
+  if (cur && cur.targetPos === next.targetPos && cur.side === next.side) {
+    return;
+  }
+  view.dispatch(view.state.tr.setMeta(columnDndKey, next));
+}
+var CLEARED = { targetPos: null, side: null };
+function columnDnd() {
+  return new import_prosemirror_state2.Plugin({
+    key: columnDndKey,
+    state: {
+      init: () => CLEARED,
+      apply(tr, prev) {
+        const meta = tr.getMeta(columnDndKey);
+        if (meta) {
+          return meta;
+        }
+        if (tr.docChanged && prev.targetPos !== null) {
+          return CLEARED;
+        }
+        return prev;
+      }
+    },
+    props: {
+      handleDOMEvents: {
+        dragover: (view, event) => {
+          if (!view.dragging) {
+            return false;
+          }
+          const target = topLevelBlockAtCoords(
+            view,
+            event.clientX,
+            event.clientY
+          );
+          const draggedId = draggedBlockId(view);
+          if (!target || !draggedId || target.id === draggedId) {
+            setDnd(view, CLEARED);
+            view.dom.classList.remove("lumir-col-dnd-active");
+            return false;
+          }
+          const rect = target.dom.getBoundingClientRect();
+          const th = edgeThreshold(rect.width);
+          let side = null;
+          if (event.clientX - rect.left <= th) {
+            side = "left";
+          } else if (rect.right - event.clientX <= th) {
+            side = "right";
+          }
+          if (side) {
+            setDnd(view, { targetPos: target.pos, side });
+            view.dom.classList.add("lumir-col-dnd-active");
+          } else {
+            setDnd(view, CLEARED);
+            view.dom.classList.remove("lumir-col-dnd-active");
+          }
+          return false;
+        },
+        dragend: (view) => {
+          setDnd(view, CLEARED);
+          view.dom.classList.remove("lumir-col-dnd-active");
+          return false;
+        },
+        dragleave: (view, event) => {
+          if (!event.relatedTarget) {
+            setDnd(view, CLEARED);
+            view.dom.classList.remove("lumir-col-dnd-active");
+          }
+          return false;
+        }
+      },
+      handleDrop: (view, _event, _slice, _moved) => {
+        const st = columnDndKey.getState(view.state);
+        view.dom.classList.remove("lumir-col-dnd-active");
+        if (!st || st.side === null || st.targetPos === null) {
+          return false;
+        }
+        const draggedId = draggedBlockId(view);
+        const targetNode = view.state.doc.nodeAt(st.targetPos);
+        const targetId = targetNode?.attrs?.id;
+        view.dispatch(view.state.tr.setMeta(columnDndKey, CLEARED));
+        if (!draggedId || !targetId) {
+          return false;
+        }
+        const editor = view.__lumirEditor;
+        if (!editor) {
+          return false;
+        }
+        const ok = mergeBlocksIntoColumns(editor, draggedId, targetId, st.side);
+        return ok;
+      },
+      decorations: (state) => {
+        const st = columnDndKey.getState(state);
+        if (!st || st.side === null || st.targetPos === null) {
+          return null;
+        }
+        const node = state.doc.nodeAt(st.targetPos);
+        if (!node) {
+          return null;
+        }
+        return import_prosemirror_view.DecorationSet.create(state.doc, [
+          import_prosemirror_view.Decoration.node(st.targetPos, st.targetPos + node.nodeSize, {
+            class: st.side === "left" ? "lumir-col-drop-left" : "lumir-col-drop-right"
+          })
+        ]);
+      }
+    }
+  });
+}
+
+// src/blocks/columns/ColumnList.ts
+var ColumnList = (0, import_core.createStronglyTypedTiptapNode)({
+  name: "columnList",
+  group: "childContainer bnBlock blockGroupChild",
+  content: "column column+",
+  parseHTML() {
+    return [{ tag: 'div[data-node-type="columnList"]' }];
+  },
+  renderHTML({ HTMLAttributes }) {
+    const dom = document.createElement("div");
+    dom.className = "bn-column-list";
+    dom.setAttribute("data-node-type", "columnList");
+    for (const [attribute, value] of Object.entries(HTMLAttributes)) {
+      if (attribute !== "class") {
+        dom.setAttribute(attribute, value);
+      }
+    }
+    return { dom, contentDOM: dom };
+  },
+  // columnNormalization: 빈 컬럼/1단 columnList 자동 복구(unwrap).
+  // columnDnd: 블록을 다른 블록 좌/우로 드롭하면 2단 컬럼 생성.
+  addProseMirrorPlugins() {
+    return [columnNormalization(), columnDnd()];
+  }
+});
+
+// src/blocks/columns/Column.ts
+var import_core2 = require("@blocknote/core");
+var Column = (0, import_core2.createStronglyTypedTiptapNode)({
+  name: "column",
+  group: "bnBlock childContainer",
+  content: "blockContainer+",
+  addAttributes() {
+    return {
+      width: {
+        default: 1,
+        parseHTML: (element) => {
+          const w = parseFloat(element.getAttribute("data-column-width") || "");
+          return Number.isFinite(w) && w > 0 ? w : 1;
+        },
+        renderHTML: (attributes) => {
+          if (!attributes.width || attributes.width === 1) {
+            return {};
+          }
+          return { "data-column-width": String(attributes.width) };
+        }
+      }
+    };
+  },
+  parseHTML() {
+    return [{ tag: 'div[data-node-type="column"]' }];
+  },
+  renderHTML({ HTMLAttributes }) {
+    const dom = document.createElement("div");
+    dom.className = "bn-column";
+    dom.setAttribute("data-node-type", "column");
+    for (const [attribute, value] of Object.entries(HTMLAttributes)) {
+      if (attribute !== "class") {
+        dom.setAttribute(attribute, value);
+      }
+    }
+    return { dom, contentDOM: dom };
+  }
+});
+
+// src/styles/FontSizeStyle.tsx
+var import_react5 = require("@blocknote/react");
 var import_jsx_runtime3 = require("react/jsx-runtime");
+var FontSize = (0, import_react5.createReactStyleSpec)(
+  {
+    type: "fontSize",
+    propSchema: "string"
+  },
+  {
+    render: (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { fontSize: props.value }, ref: props.contentRef })
+  }
+);
+var FONT_SIZE_PRESETS = [
+  "10px",
+  "12px",
+  "14px",
+  "16px",
+  "18px",
+  "20px",
+  "24px",
+  "28px"
+];
+
+// src/blocks/HtmlPreview.tsx
+var import_react7 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
 var MIN_HEIGHT = 100;
 var MAX_HEIGHT = 1200;
 var ensureCharset = (html) => {
@@ -1281,7 +1613,7 @@ var createSecureBlobUrl = (htmlContent) => {
   });
   return URL.createObjectURL(blob);
 };
-var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
+var HtmlPreviewBlock = (0, import_react6.createReactBlockSpec)(
   {
     type: "htmlPreview",
     propSchema: {
@@ -1299,15 +1631,15 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
   },
   {
     render: (props) => {
-      const [isExpanded, setIsExpanded] = (0, import_react6.useState)(true);
-      const [isResizing, setIsResizing] = (0, import_react6.useState)(false);
-      const [blobUrl, setBlobUrl] = (0, import_react6.useState)("");
-      const containerRef = (0, import_react6.useRef)(null);
+      const [isExpanded, setIsExpanded] = (0, import_react7.useState)(true);
+      const [isResizing, setIsResizing] = (0, import_react7.useState)(false);
+      const [blobUrl, setBlobUrl] = (0, import_react7.useState)("");
+      const containerRef = (0, import_react7.useRef)(null);
       const htmlContent = props.block.props.htmlContent || "";
       const fileName = props.block.props.fileName || "HTML Document";
       const savedHeight = props.block.props.height || "400px";
       const currentHeight = parseInt(savedHeight, 10) || 400;
-      (0, import_react6.useEffect)(() => {
+      (0, import_react7.useEffect)(() => {
         if (htmlContent) {
           const url = createSecureBlobUrl(htmlContent);
           setBlobUrl(url);
@@ -1316,14 +1648,14 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
           };
         }
       }, [htmlContent]);
-      const handleResizeStart = (0, import_react6.useCallback)(
+      const handleResizeStart = (0, import_react7.useCallback)(
         (e) => {
           e.preventDefault();
           e.stopPropagation();
           setIsResizing(true);
           const startY = e.clientY;
           const startHeight = currentHeight;
-          const handleMouseMove = (moveEvent) => {
+          const handleMouseMove2 = (moveEvent) => {
             const deltaY = moveEvent.clientY - startY;
             const newHeight = Math.min(
               MAX_HEIGHT,
@@ -1335,15 +1667,15 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
           };
           const handleMouseUp = () => {
             setIsResizing(false);
-            document.removeEventListener("mousemove", handleMouseMove);
+            document.removeEventListener("mousemove", handleMouseMove2);
             document.removeEventListener("mouseup", handleMouseUp);
           };
-          document.addEventListener("mousemove", handleMouseMove);
+          document.addEventListener("mousemove", handleMouseMove2);
           document.addEventListener("mouseup", handleMouseUp);
         },
         [currentHeight, props.editor, props.block]
       );
-      const handleExport = (0, import_react6.useCallback)(
+      const handleExport = (0, import_react7.useCallback)(
         (e) => {
           e.stopPropagation();
           const safeFileName = sanitizeFileName(fileName);
@@ -1364,7 +1696,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
         },
         [htmlContent, fileName]
       );
-      const handleOpenNewWindow = (0, import_react6.useCallback)(
+      const handleOpenNewWindow = (0, import_react7.useCallback)(
         (e) => {
           e.stopPropagation();
           if (typeof window === "undefined") return;
@@ -1378,7 +1710,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
         },
         [htmlContent]
       );
-      return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
         "div",
         {
           ref: containerRef,
@@ -1394,7 +1726,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
             boxShadow: "none"
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
               "div",
               {
                 style: {
@@ -1406,7 +1738,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                   borderBottom: isExpanded ? "1px solid #e0e0e0" : "none"
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
                     "div",
                     {
                       style: {
@@ -1418,7 +1750,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                       },
                       onClick: () => setIsExpanded(!isExpanded),
                       children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
                           "svg",
                           {
                             width: "16",
@@ -1433,15 +1765,15 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                               transform: isExpanded ? "rotate(180deg)" : "rotate(0deg)",
                               transition: "transform 0.2s"
                             },
-                            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("polyline", { points: "6 9 12 15 18 9" })
+                            children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "6 9 12 15 18 9" })
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { fontWeight: 500, fontSize: "14px" }, children: fileName })
+                        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { style: { fontWeight: 500, fontSize: "14px" }, children: fileName })
                       ]
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
                       "button",
                       {
                         onClick: handleOpenNewWindow,
@@ -1464,7 +1796,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                         onMouseLeave: (e) => {
                           e.currentTarget.style.backgroundColor = "transparent";
                         },
-                        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
                           "svg",
                           {
                             width: "16",
@@ -1476,15 +1808,15 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                             strokeLinecap: "round",
                             strokeLinejoin: "round",
                             children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("polyline", { points: "15 3 21 3 21 9" }),
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
+                              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
+                              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "15 3 21 3 21 9" }),
+                              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
                             ]
                           }
                         )
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
                       "button",
                       {
                         onClick: handleExport,
@@ -1507,7 +1839,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                         onMouseLeave: (e) => {
                           e.currentTarget.style.backgroundColor = "transparent";
                         },
-                        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
                           "svg",
                           {
                             width: "16",
@@ -1519,9 +1851,9 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                             strokeLinecap: "round",
                             strokeLinejoin: "round",
                             children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("polyline", { points: "7 10 12 15 17 10" }),
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "12", y1: "15", x2: "12", y2: "3" })
+                              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+                              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polyline", { points: "7 10 12 15 17 10" }),
+                              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: "12", y1: "15", x2: "12", y2: "3" })
                             ]
                           }
                         )
@@ -1531,7 +1863,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                 ]
               }
             ),
-            isExpanded && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+            isExpanded && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
               "div",
               {
                 style: {
@@ -1540,7 +1872,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                   position: "relative"
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
                     "iframe",
                     {
                       src: blobUrl || "about:blank",
@@ -1557,7 +1889,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                       loading: "lazy"
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
                     "div",
                     {
                       onMouseDown: handleResizeStart,
@@ -1582,7 +1914,7 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
                           e.currentTarget.style.backgroundColor = "transparent";
                         }
                       },
-                      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
                         "div",
                         {
                           style: {
@@ -1604,72 +1936,83 @@ var HtmlPreviewBlock = (0, import_react5.createReactBlockSpec)(
     }
   }
 );
-var schema = import_core.BlockNoteSchema.create({
+var ColumnListBlock = (0, import_core3.createBlockSpecFromStronglyTypedTiptapNode)(
+  ColumnList,
+  {}
+);
+var ColumnBlock = (0, import_core3.createBlockSpecFromStronglyTypedTiptapNode)(Column, {});
+var schema = import_core3.BlockNoteSchema.create({
   blockSpecs: {
-    ...import_core.defaultBlockSpecs,
+    ...import_core3.defaultBlockSpecs,
     htmlPreview: HtmlPreviewBlock,
     linkPreview: LinkPreviewBlock,
-    video: VideoBlock
+    video: VideoBlock,
+    columnList: ColumnListBlock,
+    column: ColumnBlock
   },
-  inlineContentSpecs: import_core.defaultInlineContentSpecs,
-  styleSpecs: import_core.defaultStyleSpecs
+  inlineContentSpecs: import_core3.defaultInlineContentSpecs,
+  styleSpecs: {
+    ...import_core3.defaultStyleSpecs,
+    // 인라인 글자 크기. 저장 JSON 직렬화는 형제 키 방식(font-size-serialization.ts) 사용.
+    fontSize: FontSize
+  }
 });
 
 // src/components/FloatingMenu/index.tsx
-var import_react17 = require("react");
+var import_react19 = require("react");
 
 // src/components/FloatingMenu/Icons.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 var Icons = {
-  undo: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z" }) }),
-  redo: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22L3.9 16c1.05-3.19 4.05-5.5 7.6-5.5 1.95 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z" }) }),
-  bold: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M15.6 10.79c.97-.67 1.65-1.77 1.65-2.79 0-2.26-1.75-4-4-4H7v14h7.04c2.09 0 3.71-1.7 3.71-3.79 0-1.52-.86-2.82-2.15-3.42zM10 6.5h3c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5h-3v-3zm3.5 9H10v-3h3.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z" }) }),
-  italic: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M10 4v3h2.21l-3.42 8H6v3h8v-3h-2.21l3.42-8H18V4z" }) }),
-  underline: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12 17c3.31 0 6-2.69 6-6V3h-2.5v8c0 1.93-1.57 3.5-3.5 3.5S8.5 12.93 8.5 11V3H6v8c0 3.31 2.69 6 6 6zm-7 2v2h14v-2H5z" }) }),
-  strikethrough: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M10 19h4v-3h-4v3zM5 4v3h5v3h4V7h5V4H5zM3 14h18v-2H3v2z" }) }),
-  alignLeft: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M15 15H3v2h12v-2zm0-8H3v2h12V7zM3 13h18v-2H3v2zm0 8h18v-2H3v2zM3 3v2h18V3H3z" }) }),
-  alignCenter: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z" }) }),
-  alignRight: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M3 21h18v-2H3v2zm6-4h12v-2H9v2zm-6-4h18v-2H3v2zm6-4h12V7H9v2zM3 3v2h18V3H3z" }) }),
-  bulletList: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M4 10.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm0-6c-.83 0-1.5.67-1.5 1.5S3.17 7.5 4 7.5 5.5 6.83 5.5 6 4.83 4.5 4 4.5zm0 12c-.83 0-1.5.68-1.5 1.5s.68 1.5 1.5 1.5 1.5-.68 1.5-1.5-.67-1.5-1.5-1.5zM7 19h14v-2H7v2zm0-6h14v-2H7v2zm0-8v2h14V5H7z" }) }),
-  numberedList: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1v.9h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z" }) }),
-  image: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z" }) }),
-  expandMore: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" }) }),
-  textColor: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M11 3L5.5 17h2.25l1.12-3h6.25l1.12 3h2.25L13 3h-2zm-1.38 9L12 5.67 14.38 12H9.62z" }) }),
-  bgColor: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M16.56 8.94L7.62 0 6.21 1.41l2.38 2.38-5.15 5.15c-.59.59-.59 1.54 0 2.12l5.5 5.5c.29.29.68.44 1.06.44s.77-.15 1.06-.44l5.5-5.5c.59-.58.59-1.53 0-2.12zM5.21 10L10 5.21 14.79 10H5.21zM19 11.5s-2 2.17-2 3.5c0 1.1.9 2 2 2s2-.9 2-2c0-1.33-2-3.5-2-3.5z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { fillOpacity: ".36", d: "M0 20h24v4H0z" })
+  undo: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z" }) }),
+  redo: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22L3.9 16c1.05-3.19 4.05-5.5 7.6-5.5 1.95 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z" }) }),
+  bold: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M15.6 10.79c.97-.67 1.65-1.77 1.65-2.79 0-2.26-1.75-4-4-4H7v14h7.04c2.09 0 3.71-1.7 3.71-3.79 0-1.52-.86-2.82-2.15-3.42zM10 6.5h3c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5h-3v-3zm3.5 9H10v-3h3.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z" }) }),
+  italic: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M10 4v3h2.21l-3.42 8H6v3h8v-3h-2.21l3.42-8H18V4z" }) }),
+  underline: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 17c3.31 0 6-2.69 6-6V3h-2.5v8c0 1.93-1.57 3.5-3.5 3.5S8.5 12.93 8.5 11V3H6v8c0 3.31 2.69 6 6 6zm-7 2v2h14v-2H5z" }) }),
+  strikethrough: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M10 19h4v-3h-4v3zM5 4v3h5v3h4V7h5V4H5zM3 14h18v-2H3v2z" }) }),
+  alignLeft: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M15 15H3v2h12v-2zm0-8H3v2h12V7zM3 13h18v-2H3v2zm0 8h18v-2H3v2zM3 3v2h18V3H3z" }) }),
+  alignCenter: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z" }) }),
+  alignRight: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M3 21h18v-2H3v2zm6-4h12v-2H9v2zm-6-4h18v-2H3v2zm6-4h12V7H9v2zM3 3v2h18V3H3z" }) }),
+  bulletList: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M4 10.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm0-6c-.83 0-1.5.67-1.5 1.5S3.17 7.5 4 7.5 5.5 6.83 5.5 6 4.83 4.5 4 4.5zm0 12c-.83 0-1.5.68-1.5 1.5s.68 1.5 1.5 1.5 1.5-.68 1.5-1.5-.67-1.5-1.5-1.5zM7 19h14v-2H7v2zm0-6h14v-2H7v2zm0-8v2h14V5H7z" }) }),
+  numberedList: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1v.9h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z" }) }),
+  image: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z" }) }),
+  expandMore: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" }) }),
+  textColor: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M11 3L5.5 17h2.25l1.12-3h6.25l1.12 3h2.25L13 3h-2zm-1.38 9L12 5.67 14.38 12H9.62z" }) }),
+  bgColor: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M16.56 8.94L7.62 0 6.21 1.41l2.38 2.38-5.15 5.15c-.59.59-.59 1.54 0 2.12l5.5 5.5c.29.29.68.44 1.06.44s.77-.15 1.06-.44l5.5-5.5c.59-.58.59-1.53 0-2.12zM5.21 10L10 5.21 14.79 10H5.21zM19 11.5s-2 2.17-2 3.5c0 1.1.9 2 2 2s2-.9 2-2c0-1.33-2-3.5-2-3.5z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { fillOpacity: ".36", d: "M0 20h24v4H0z" })
   ] }),
-  link: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z" }) }),
-  chevronRight: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }) }),
-  chevronLeft: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" }) }),
-  table: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M20 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h15c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM10 17H5v-2h5v2zm0-4H5v-2h5v2zm0-4H5V7h5v2zm9 8h-7v-2h7v2zm0-4h-7v-2h7v2zm0-4h-7V7h7v2z" }) }),
-  htmlFile: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm-1 2v5h5l-5-5zm-4 14H7v-1h2v1zm0-2H7v-1h2v1zm-2-2h2v1H7v-1zm4 4h-2v-1h2v1zm0-2h-2v-1h2v1zm0-2h-2v-1h2v1zm6 4h-4v-1h4v1zm0-2h-4v-1h4v1zm0-2h-4v-1h4v1z" }) })
+  link: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z" }) }),
+  chevronRight: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }) }),
+  chevronLeft: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" }) }),
+  table: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M20 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h15c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM10 17H5v-2h5v2zm0-4H5v-2h5v2zm0-4H5V7h5v2zm9 8h-7v-2h7v2zm0-4h-7v-2h7v2zm0-4h-7V7h7v2z" }) }),
+  htmlFile: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm-1 2v5h5l-5-5zm-4 14H7v-1h2v1zm0-2H7v-1h2v1zm-2-2h2v1H7v-1zm4 4h-2v-1h2v1zm0-2h-2v-1h2v1zm0-2h-2v-1h2v1zm6 4h-4v-1h4v1zm0-2h-4v-1h4v1zm0-2h-4v-1h4v1z" }) })
 };
 var BlockTypeIcons = {
-  paragraph: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M5 5h14v2H5zM5 11h14v2H5zM5 17h10v2H5z" }) }),
-  h1: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "lumir-block-icon-text", children: "H1" }),
-  h2: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "lumir-block-icon-text", children: "H2" }),
-  h3: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "lumir-block-icon-text", children: "H3" }),
-  h4: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "lumir-block-icon-text", children: "H4" }),
-  h5: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "lumir-block-icon-text", children: "H5" }),
-  h6: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "lumir-block-icon-text", children: "H6" }),
-  toggleH1: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "lumir-block-icon-toggle", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M8 5v14l11-7z" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: "H1" })
+  paragraph: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M5 5h14v2H5zM5 11h14v2H5zM5 17h10v2H5z" }) }),
+  h1: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "lumir-block-icon-text", children: "H1" }),
+  h2: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "lumir-block-icon-text", children: "H2" }),
+  h3: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "lumir-block-icon-text", children: "H3" }),
+  h4: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "lumir-block-icon-text", children: "H4" }),
+  h5: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "lumir-block-icon-text", children: "H5" }),
+  h6: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "lumir-block-icon-text", children: "H6" }),
+  toggleH1: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "lumir-block-icon-toggle", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M8 5v14l11-7z" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: "H1" })
   ] }),
-  toggleH2: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "lumir-block-icon-toggle", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M8 5v14l11-7z" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: "H2" })
+  toggleH2: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "lumir-block-icon-toggle", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M8 5v14l11-7z" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: "H2" })
   ] }),
-  toggleH3: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "lumir-block-icon-toggle", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M8 5v14l11-7z" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: "H3" })
+  toggleH3: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "lumir-block-icon-toggle", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M8 5v14l11-7z" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: "H3" })
   ] }),
-  quote: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M6 17h3l2-4V7H5v6h3zm8 0h3l2-4V7h-6v6h3z" }) }),
-  codeBlock: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z" }) }),
-  toggleList: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M10 6h10v2H10zM10 11h10v2H10zM10 16h10v2H10z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  quote: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M6 17h3l2-4V7H5v6h3zm8 0h3l2-4V7h-6v6h3z" }) }),
+  codeBlock: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z" }) }),
+  toggleList: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M10 6h10v2H10zM10 11h10v2H10zM10 16h10v2H10z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       "path",
       {
         d: "M4 8l4 4-4 4",
@@ -1681,15 +2024,15 @@ var BlockTypeIcons = {
       }
     )
   ] }),
-  bulletList: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "4", cy: "6", r: "1.5" }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "4", cy: "12", r: "1.5" }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "4", cy: "18", r: "1.5" }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M8 5h12v2H8zM8 11h12v2H8zM8 17h12v2H8z" })
+  bulletList: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "4", cy: "6", r: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "4", cy: "12", r: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "4", cy: "18", r: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M8 5h12v2H8zM8 11h12v2H8zM8 17h12v2H8z" })
   ] }),
-  numberedList: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1v.9h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z" }) }),
-  checkList: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  numberedList: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1v.9h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z" }) }),
+  checkList: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       "rect",
       {
         x: "3",
@@ -1702,7 +2045,7 @@ var BlockTypeIcons = {
         strokeWidth: "1.5"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       "path",
       {
         d: "M4.5 7l1.5 1.5 3-3",
@@ -1713,8 +2056,8 @@ var BlockTypeIcons = {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12 6h8v2h-8z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 6h8v2h-8z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       "rect",
       {
         x: "3",
@@ -1727,53 +2070,53 @@ var BlockTypeIcons = {
         strokeWidth: "1.5"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12 16h8v2h-8z" })
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 16h8v2h-8z" })
   ] })
 };
 
 // src/components/FloatingMenu/components/ToolbarDivider.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var ToolbarDivider = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "lumir-toolbar-divider" });
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var ToolbarDivider = () => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "lumir-toolbar-divider" });
 
 // src/components/FloatingMenu/components/UndoRedoButtons.tsx
-var import_react7 = require("react");
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_react8 = require("react");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var UndoRedoButtons = ({ editor }) => {
-  const handleUndo = (0, import_react7.useCallback)(() => {
+  const handleUndo = (0, import_react8.useCallback)(() => {
     try {
       editor?.undo?.();
     } catch (err) {
       console.error("Undo failed:", err);
     }
   }, [editor]);
-  const handleRedo = (0, import_react7.useCallback)(() => {
+  const handleRedo = (0, import_react8.useCallback)(() => {
     try {
       editor?.redo?.();
     } catch (err) {
       console.error("Redo failed:", err);
     }
   }, [editor]);
-  const handleMouseDown = (0, import_react7.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react8.useCallback)((e) => {
     e.preventDefault();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "lumir-toolbar-group", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "lumir-toolbar-group", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       "button",
       {
         className: "lumir-toolbar-btn",
         onClick: handleUndo,
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: "\uC2E4\uD589 \uCDE8\uC18C",
         type: "button",
         children: Icons.undo
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       "button",
       {
         className: "lumir-toolbar-btn",
         onClick: handleRedo,
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: "\uB2E4\uC2DC \uC2E4\uD589",
         type: "button",
         children: Icons.redo
@@ -1783,8 +2126,8 @@ var UndoRedoButtons = ({ editor }) => {
 };
 
 // src/components/FloatingMenu/components/TextStyleButton.tsx
-var import_react8 = require("react");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_react9 = require("react");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var iconMap = {
   bold: Icons.bold,
   italic: Icons.italic,
@@ -1810,22 +2153,22 @@ var TextStyleButton = ({
     }
   };
   const isActive = getIsActive();
-  const handleClick = (0, import_react8.useCallback)(() => {
+  const handleClick = (0, import_react9.useCallback)(() => {
     try {
       editor?.toggleStyles?.({ [style]: true });
     } catch (err) {
       console.error(`Toggle ${style} failed:`, err);
     }
   }, [editor, style]);
-  const handleMouseDown = (0, import_react8.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react9.useCallback)((e) => {
     e.preventDefault();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     "button",
     {
       className: cn("lumir-toolbar-btn", isActive && "is-active"),
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: titleMap[style],
       type: "button",
       children: iconMap[style]
@@ -1834,7 +2177,7 @@ var TextStyleButton = ({
 };
 
 // src/components/FloatingMenu/components/AlignButton.tsx
-var import_react9 = require("react");
+var import_react10 = require("react");
 
 // src/utils/prosemirror-table-utils.ts
 function getSelectedCellPositions(editor) {
@@ -1893,9 +2236,44 @@ function getFirstSelectedCellAttr(editor, attr) {
   const node = tiptap.state.doc.nodeAt(positions[0]);
   return node?.attrs?.[attr];
 }
+function findTableNodePos(tiptap, blockId) {
+  let tablePos = -1;
+  tiptap.state.doc.descendants((node, pos) => {
+    if (tablePos !== -1) return false;
+    if (node.type.name === "blockContainer" && node.attrs?.id === blockId && node.firstChild?.type.name === "table") {
+      tablePos = pos + 1;
+      return false;
+    }
+    return void 0;
+  });
+  return tablePos;
+}
+function setTableAlignment(editor, blockId, alignment) {
+  const tiptap = editor?._tiptapEditor;
+  if (!tiptap || !blockId) return false;
+  const tablePos = findTableNodePos(tiptap, blockId);
+  if (tablePos < 0) return false;
+  const node = tiptap.state.doc.nodeAt(tablePos);
+  if (!node || node.type.name !== "table") return false;
+  tiptap.view?.dispatch(
+    tiptap.state.tr.setNodeMarkup(tablePos, void 0, {
+      ...node.attrs,
+      tableAlignment: alignment
+    })
+  );
+  return true;
+}
+function getTableAlignment(editor, blockId) {
+  const tiptap = editor?._tiptapEditor;
+  if (!tiptap || !blockId) return "left";
+  const tablePos = findTableNodePos(tiptap, blockId);
+  if (tablePos < 0) return "left";
+  const node = tiptap.state.doc.nodeAt(tablePos);
+  return node?.attrs?.tableAlignment || "left";
+}
 
 // src/components/FloatingMenu/components/AlignButton.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 var iconMap2 = {
   left: Icons.alignLeft,
   center: Icons.alignCenter,
@@ -1922,7 +2300,7 @@ var AlignButton = ({
     }
   };
   const isActive = getCurrentAlignment() === alignment;
-  const handleClick = (0, import_react9.useCallback)(() => {
+  const handleClick = (0, import_react10.useCallback)(() => {
     try {
       if (setSelectedCellsAttr(editor, "textAlignment", alignment)) {
         return;
@@ -1935,15 +2313,15 @@ var AlignButton = ({
       console.error(`Set alignment ${alignment} failed:`, err);
     }
   }, [editor, alignment]);
-  const handleMouseDown = (0, import_react9.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react10.useCallback)((e) => {
     e.preventDefault();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     "button",
     {
       className: cn("lumir-toolbar-btn", isActive && "is-active"),
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: titleMap2[alignment],
       type: "button",
       children: iconMap2[alignment]
@@ -1952,8 +2330,8 @@ var AlignButton = ({
 };
 
 // src/components/FloatingMenu/components/ListButton.tsx
-var import_react10 = require("react");
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_react11 = require("react");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 var iconMap3 = {
   bullet: Icons.bulletList,
   numbered: Icons.numberedList
@@ -1973,7 +2351,7 @@ var ListButton = ({ editor, type }) => {
     }
   };
   const isActive = getIsActive();
-  const handleClick = (0, import_react10.useCallback)(() => {
+  const handleClick = (0, import_react11.useCallback)(() => {
     try {
       const block = editor?.getTextCursorPosition()?.block;
       if (block && editor?.updateBlock) {
@@ -1985,15 +2363,15 @@ var ListButton = ({ editor, type }) => {
       console.error(`List toggle failed:`, err);
     }
   }, [editor, type]);
-  const handleMouseDown = (0, import_react10.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react11.useCallback)((e) => {
     e.preventDefault();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     "button",
     {
       className: cn("lumir-toolbar-btn", isActive && "is-active"),
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: titleMap3[type],
       type: "button",
       children: iconMap3[type]
@@ -2002,13 +2380,13 @@ var ListButton = ({ editor, type }) => {
 };
 
 // src/components/FloatingMenu/components/ImageButton.tsx
-var import_react11 = require("react");
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_react12 = require("react");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 var ImageButton = ({
   editor,
   onImageUpload
 }) => {
-  const handleClick = (0, import_react11.useCallback)(() => {
+  const handleClick = (0, import_react12.useCallback)(() => {
     if (onImageUpload) {
       onImageUpload();
     } else {
@@ -2033,15 +2411,15 @@ var ImageButton = ({
       input.click();
     }
   }, [editor, onImageUpload]);
-  const handleMouseDown = (0, import_react11.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react12.useCallback)((e) => {
     e.preventDefault();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "button",
     {
       className: "lumir-toolbar-btn",
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: "\uC774\uBBF8\uC9C0 \uC0BD\uC785",
       type: "button",
       children: Icons.image
@@ -2050,7 +2428,7 @@ var ImageButton = ({
 };
 
 // src/components/FloatingMenu/components/ColorButton.tsx
-var import_react12 = require("react");
+var import_react13 = require("react");
 
 // src/constants/colors.ts
 var TEXT_COLORS = [
@@ -2084,13 +2462,13 @@ var getHexFromColorValue = (value, type) => {
 };
 
 // src/components/FloatingMenu/components/ColorButton.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var ColorButton = ({ editor, type }) => {
-  const [isOpen, setIsOpen] = (0, import_react12.useState)(false);
-  const [currentColor, setCurrentColor] = (0, import_react12.useState)("default");
-  const dropdownRef = (0, import_react12.useRef)(null);
+  const [isOpen, setIsOpen] = (0, import_react13.useState)(false);
+  const [currentColor, setCurrentColor] = (0, import_react13.useState)("default");
+  const dropdownRef = (0, import_react13.useRef)(null);
   const colors = type === "text" ? TEXT_COLORS : BACKGROUND_COLORS;
-  const getCurrentColor = (0, import_react12.useCallback)(() => {
+  const getCurrentColor = (0, import_react13.useCallback)(() => {
     try {
       if (isInTableCell(editor)) {
         const attr = type === "text" ? "textColor" : "backgroundColor";
@@ -2106,13 +2484,13 @@ var ColorButton = ({ editor, type }) => {
     }
     return "default";
   }, [editor, type]);
-  (0, import_react12.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (isOpen) {
       const color = getCurrentColor();
       setCurrentColor(color);
     }
   }, [isOpen, getCurrentColor]);
-  (0, import_react12.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     const handleClickOutside = (e) => {
       if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
         setIsOpen(false);
@@ -2121,7 +2499,7 @@ var ColorButton = ({ editor, type }) => {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  const handleColorSelect = (0, import_react12.useCallback)(
+  const handleColorSelect = (0, import_react13.useCallback)(
     (color) => {
       try {
         if (!editor) return;
@@ -2140,21 +2518,21 @@ var ColorButton = ({ editor, type }) => {
     },
     [editor, type]
   );
-  const handleMouseDown = (0, import_react12.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react13.useCallback)((e) => {
     e.preventDefault();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
       "button",
       {
         className: "lumir-toolbar-btn lumir-color-btn",
         onClick: () => setIsOpen(!isOpen),
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: type === "text" ? "\uD14D\uC2A4\uD2B8 \uC0C9\uC0C1" : "\uBC30\uACBD \uC0C9\uC0C1",
         type: "button",
         children: [
           type === "text" ? Icons.textColor : Icons.bgColor,
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
             "span",
             {
               className: "lumir-color-indicator",
@@ -2166,7 +2544,7 @@ var ColorButton = ({ editor, type }) => {
         ]
       }
     ),
-    isOpen && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "lumir-dropdown-menu lumir-color-menu", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "lumir-color-grid", children: colors.map((color) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "lumir-dropdown-menu lumir-color-menu", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "lumir-color-grid", children: colors.map((color) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       "button",
       {
         className: cn(
@@ -2174,7 +2552,7 @@ var ColorButton = ({ editor, type }) => {
           currentColor === color.value && "is-active"
         ),
         onClick: () => handleColorSelect(color.value),
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: color.name,
         style: { backgroundColor: color.hex },
         type: "button"
@@ -2184,9 +2562,101 @@ var ColorButton = ({ editor, type }) => {
   ] });
 };
 
+// src/components/FloatingMenu/components/FontSizeButton.tsx
+var import_react14 = require("react");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var DEFAULT_LABEL = "\uAE30\uBCF8";
+var toLabel = (size) => size.replace(/px$/, "");
+var FontSizeButton = ({ editor }) => {
+  const [isOpen, setIsOpen] = (0, import_react14.useState)(false);
+  const dropdownRef = (0, import_react14.useRef)(null);
+  const getCurrentSize = () => {
+    try {
+      return editor?.getActiveStyles?.()?.fontSize || "";
+    } catch {
+      return "";
+    }
+  };
+  const currentSize = getCurrentSize();
+  (0, import_react14.useEffect)(() => {
+    const handleClickOutside = (e) => {
+      if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
+        setIsOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, []);
+  const handleSizeSelect = (0, import_react14.useCallback)(
+    (size) => {
+      try {
+        if (!editor) return;
+        if (size === "") {
+          editor.removeStyles?.({ fontSize: "" });
+        } else {
+          editor.addStyles?.({ fontSize: size });
+        }
+        setIsOpen(false);
+        setTimeout(() => editor.focus?.());
+      } catch (err) {
+        console.error("Font size apply failed:", err);
+      }
+    },
+    [editor]
+  );
+  const handleMouseDown2 = (0, import_react14.useCallback)((e) => {
+    e.preventDefault();
+  }, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+      "button",
+      {
+        className: "lumir-dropdown-btn lumir-font-size-btn",
+        onClick: () => setIsOpen(!isOpen),
+        onMouseDown: handleMouseDown2,
+        title: "\uAE00\uC790 \uD06C\uAE30",
+        type: "button",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "lumir-font-size-label", children: currentSize ? toLabel(currentSize) : DEFAULT_LABEL }),
+          Icons.expandMore
+        ]
+      }
+    ),
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "lumir-dropdown-menu lumir-font-size-menu", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        "button",
+        {
+          className: cn(
+            "lumir-dropdown-item",
+            currentSize === "" && "is-active"
+          ),
+          onClick: () => handleSizeSelect(""),
+          onMouseDown: handleMouseDown2,
+          type: "button",
+          children: DEFAULT_LABEL
+        }
+      ),
+      FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        "button",
+        {
+          className: cn(
+            "lumir-dropdown-item",
+            currentSize === size && "is-active"
+          ),
+          onClick: () => handleSizeSelect(size),
+          onMouseDown: handleMouseDown2,
+          type: "button",
+          children: toLabel(size)
+        },
+        size
+      ))
+    ] })
+  ] });
+};
+
 // src/components/FloatingMenu/components/LinkButton.tsx
-var import_react13 = require("react");
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_react15 = require("react");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 var isDangerousProtocol = (url) => {
   const trimmedUrl = url.trim().toLowerCase();
   const dangerousPatterns = [
@@ -2212,13 +2682,13 @@ var normalizeUrl = (url) => {
   return `https://${trimmedUrl}`;
 };
 var LinkButton = ({ editor }) => {
-  const [isOpen, setIsOpen] = (0, import_react13.useState)(false);
-  const [linkUrl, setLinkUrl] = (0, import_react13.useState)("");
-  const [errorMsg, setErrorMsg] = (0, import_react13.useState)(null);
-  const dropdownRef = (0, import_react13.useRef)(null);
-  const inputRef = (0, import_react13.useRef)(null);
-  const hasSelectionRef = (0, import_react13.useRef)(false);
-  (0, import_react13.useEffect)(() => {
+  const [isOpen, setIsOpen] = (0, import_react15.useState)(false);
+  const [linkUrl, setLinkUrl] = (0, import_react15.useState)("");
+  const [errorMsg, setErrorMsg] = (0, import_react15.useState)(null);
+  const dropdownRef = (0, import_react15.useRef)(null);
+  const inputRef = (0, import_react15.useRef)(null);
+  const hasSelectionRef = (0, import_react15.useRef)(false);
+  (0, import_react15.useEffect)(() => {
     const handleClickOutside = (e) => {
       if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
         setIsOpen(false);
@@ -2229,7 +2699,7 @@ var LinkButton = ({ editor }) => {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  (0, import_react13.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     if (isOpen && inputRef.current) {
       try {
         const selectedText = editor?.getSelectedText?.() || "";
@@ -2240,7 +2710,7 @@ var LinkButton = ({ editor }) => {
       setTimeout(() => inputRef.current?.focus(), 0);
     }
   }, [isOpen, editor]);
-  const handleSubmit = (0, import_react13.useCallback)(
+  const handleSubmit = (0, import_react15.useCallback)(
     (e) => {
       e?.preventDefault();
       setErrorMsg(null);
@@ -2267,15 +2737,15 @@ var LinkButton = ({ editor }) => {
     },
     [editor, linkUrl]
   );
-  const handleCancel = (0, import_react13.useCallback)(() => {
+  const handleCancel = (0, import_react15.useCallback)(() => {
     setIsOpen(false);
     setLinkUrl("");
     setErrorMsg(null);
   }, []);
-  const handleMouseDown = (0, import_react13.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react15.useCallback)((e) => {
     e.preventDefault();
   }, []);
-  const handleKeyDown = (0, import_react13.useCallback)(
+  const handleKeyDown = (0, import_react15.useCallback)(
     (e) => {
       if (e.key === "Enter") {
         handleSubmit();
@@ -2285,20 +2755,20 @@ var LinkButton = ({ editor }) => {
     },
     [handleSubmit, handleCancel]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       "button",
       {
         className: "lumir-toolbar-btn",
         onClick: () => setIsOpen(!isOpen),
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: "\uB9C1\uD06C \uC0BD\uC785",
         type: "button",
         children: Icons.link
       }
     ),
-    isOpen && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "lumir-dropdown-menu lumir-link-menu", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("form", { onSubmit: handleSubmit, className: "lumir-link-form", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "lumir-dropdown-menu lumir-link-menu", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("form", { onSubmit: handleSubmit, className: "lumir-link-form", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         "input",
         {
           ref: inputRef,
@@ -2311,10 +2781,10 @@ var LinkButton = ({ editor }) => {
             setErrorMsg(null);
           },
           onKeyDown: handleKeyDown,
-          onMouseDown: handleMouseDown
+          onMouseDown: handleMouseDown2
         }
       ),
-      errorMsg && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      errorMsg && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         "div",
         {
           style: {
@@ -2326,23 +2796,23 @@ var LinkButton = ({ editor }) => {
           children: errorMsg
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "lumir-link-actions", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "lumir-link-actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
           "button",
           {
             type: "button",
             className: "lumir-link-btn lumir-link-cancel",
             onClick: handleCancel,
-            onMouseDown: handleMouseDown,
+            onMouseDown: handleMouseDown2,
             children: "\uCDE8\uC18C"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
           "button",
           {
             type: "submit",
             className: "lumir-link-btn lumir-link-submit",
-            onMouseDown: handleMouseDown,
+            onMouseDown: handleMouseDown2,
             disabled: !linkUrl.trim(),
             children: "\uD655\uC778"
           }
@@ -2353,10 +2823,10 @@ var LinkButton = ({ editor }) => {
 };
 
 // src/components/FloatingMenu/components/TableButton.tsx
-var import_react14 = require("react");
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_react16 = require("react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 var TableButton = ({ editor }) => {
-  const handleClick = (0, import_react14.useCallback)(() => {
+  const handleClick = (0, import_react16.useCallback)(() => {
     try {
       const block = editor?.getTextCursorPosition()?.block;
       if (!block || !editor?.insertBlocks) return;
@@ -2378,15 +2848,15 @@ var TableButton = ({ editor }) => {
       console.error("Table insert failed:", err);
     }
   }, [editor]);
-  const handleMouseDown = (0, import_react14.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react16.useCallback)((e) => {
     e.preventDefault();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     "button",
     {
       className: "lumir-toolbar-btn",
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: "\uD14C\uC774\uBE14 \uC0BD\uC785",
       type: "button",
       children: Icons.table
@@ -2395,13 +2865,13 @@ var TableButton = ({ editor }) => {
 };
 
 // src/components/FloatingMenu/components/HTMLImportButton.tsx
-var import_react15 = require("react");
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_react17 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 var HTMLImportButton = ({
   editor
 }) => {
-  const fileInputRef = (0, import_react15.useRef)(null);
-  const handleFileUpload = (0, import_react15.useCallback)(
+  const fileInputRef = (0, import_react17.useRef)(null);
+  const handleFileUpload = (0, import_react17.useCallback)(
     (e) => {
       const file = e.target.files?.[0];
       if (!file) return;
@@ -2437,14 +2907,14 @@ var HTMLImportButton = ({
     },
     [editor]
   );
-  const handleClick = (0, import_react15.useCallback)(() => {
+  const handleClick = (0, import_react17.useCallback)(() => {
     fileInputRef.current?.click();
   }, []);
-  const handleMouseDown = (0, import_react15.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react17.useCallback)((e) => {
     e.preventDefault();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       "input",
       {
         ref: fileInputRef,
@@ -2454,12 +2924,12 @@ var HTMLImportButton = ({
         style: { display: "none" }
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       "button",
       {
         className: "lumir-toolbar-btn",
         onClick: handleClick,
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: "HTML Import",
         type: "button",
         children: Icons.htmlFile
@@ -2469,8 +2939,8 @@ var HTMLImportButton = ({
 };
 
 // src/components/FloatingMenu/components/BlockTypeSelect.tsx
-var import_react16 = require("react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_react18 = require("react");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var blockTypeCategories = [
   {
     category: "Headings",
@@ -2500,8 +2970,8 @@ var blockTypes = blockTypeCategories.flatMap(
   (cat) => cat.items
 );
 var BlockTypeSelect = ({ editor }) => {
-  const [isOpen, setIsOpen] = (0, import_react16.useState)(false);
-  const dropdownRef = (0, import_react16.useRef)(null);
+  const [isOpen, setIsOpen] = (0, import_react18.useState)(false);
+  const dropdownRef = (0, import_react18.useRef)(null);
   const getCurrentBlock = () => {
     try {
       return editor?.getTextCursorPosition()?.block;
@@ -2513,7 +2983,7 @@ var BlockTypeSelect = ({ editor }) => {
   const currentType = currentBlock?.type || "paragraph";
   const currentLevel = currentBlock?.props?.level;
   const isCurrentToggle = currentType === "heading" && currentBlock?.props?.isToggleable === true;
-  (0, import_react16.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     const handleClickOutside = (e) => {
       if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
         setIsOpen(false);
@@ -2542,7 +3012,7 @@ var BlockTypeSelect = ({ editor }) => {
       console.error("Block type change failed:", err);
     }
   };
-  const handleMouseDown = (0, import_react16.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react18.useCallback)((e) => {
     e.preventDefault();
   }, []);
   const getCurrentLabel = () => {
@@ -2573,24 +3043,24 @@ var BlockTypeSelect = ({ editor }) => {
     }
     return currentType === bt.type;
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
       "button",
       {
         className: "lumir-dropdown-btn lumir-block-type-btn",
         onClick: () => setIsOpen(!isOpen),
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         type: "button",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "lumir-block-icon", children: BlockTypeIcons[getCurrentIcon()] }),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "lumir-block-label", children: getCurrentLabel() }),
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "lumir-block-icon", children: BlockTypeIcons[getCurrentIcon()] }),
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "lumir-block-label", children: getCurrentLabel() }),
           Icons.expandMore
         ]
       }
     ),
-    isOpen && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "lumir-dropdown-menu lumir-block-menu", children: blockTypeCategories.map((category) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "lumir-block-category", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "lumir-block-category-title", children: category.category }),
-      category.items.map((bt) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "lumir-dropdown-menu lumir-block-menu", children: blockTypeCategories.map((category) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "lumir-block-category", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "lumir-block-category-title", children: category.category }),
+      category.items.map((bt) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
         "button",
         {
           className: cn(
@@ -2598,10 +3068,10 @@ var BlockTypeSelect = ({ editor }) => {
             isActiveItem(bt) && "is-active"
           ),
           onClick: () => handleTypeChange(bt.type, bt.level, bt.isToggle),
-          onMouseDown: handleMouseDown,
+          onMouseDown: handleMouseDown2,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "lumir-block-icon", children: BlockTypeIcons[bt.icon] }),
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "lumir-block-item-title", children: bt.label })
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "lumir-block-icon", children: BlockTypeIcons[bt.icon] }),
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "lumir-block-item-title", children: bt.label })
           ]
         },
         bt.icon
@@ -2611,7 +3081,7 @@ var BlockTypeSelect = ({ editor }) => {
 };
 
 // src/components/FloatingMenu/index.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var COMPACT_BREAKPOINT = 700;
 var MINIMIZED_BREAKPOINT = 400;
 var FloatingMenu = ({
@@ -2620,12 +3090,12 @@ var FloatingMenu = ({
   className,
   onImageUpload
 }) => {
-  const wrapperRef = (0, import_react17.useRef)(null);
-  const [isCompact, setIsCompact] = (0, import_react17.useState)(false);
-  const [isMinimizable, setIsMinimizable] = (0, import_react17.useState)(false);
-  const [isMinimized, setIsMinimized] = (0, import_react17.useState)(false);
-  const [, setSelectionTick] = (0, import_react17.useState)(0);
-  (0, import_react17.useEffect)(() => {
+  const wrapperRef = (0, import_react19.useRef)(null);
+  const [isCompact, setIsCompact] = (0, import_react19.useState)(false);
+  const [isMinimizable, setIsMinimizable] = (0, import_react19.useState)(false);
+  const [isMinimized, setIsMinimized] = (0, import_react19.useState)(false);
+  const [, setSelectionTick] = (0, import_react19.useState)(0);
+  (0, import_react19.useEffect)(() => {
     if (!editor) return;
     let debounceTimer = null;
     const DEBOUNCE_DELAY = 150;
@@ -2649,7 +3119,7 @@ var FloatingMenu = ({
       unsubscribeContent?.();
     };
   }, [editor]);
-  (0, import_react17.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     const checkWidth = () => {
       if (wrapperRef.current) {
         const width = wrapperRef.current.offsetWidth;
@@ -2664,8 +3134,8 @@ var FloatingMenu = ({
     }
     return () => resizeObserver.disconnect();
   }, []);
-  const MinimizedLayout = () => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  const MinimizedLayout = () => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
       "button",
       {
         className: "lumir-toolbar-button lumir-toggle-button",
@@ -2676,117 +3146,120 @@ var FloatingMenu = ({
         children: isMinimized ? Icons.chevronRight : Icons.chevronLeft
       }
     ),
-    !isMinimized && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(UndoRedoButtons, { editor }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(BlockTypeSelect, { editor }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "bold" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "italic" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "underline" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "strike" })
+    !isMinimized && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(UndoRedoButtons, { editor }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(BlockTypeSelect, { editor }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "bold" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "italic" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "underline" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "strike" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AlignButton, { editor, alignment: "left" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AlignButton, { editor, alignment: "center" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AlignButton, { editor, alignment: "right" })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlignButton, { editor, alignment: "left" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlignButton, { editor, alignment: "center" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlignButton, { editor, alignment: "right" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ListButton, { editor, type: "bullet" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ListButton, { editor, type: "numbered" })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ListButton, { editor, type: "bullet" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ListButton, { editor, type: "numbered" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ColorButton, { editor, type: "text" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ColorButton, { editor, type: "background" })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(FontSizeButton, { editor }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ColorButton, { editor, type: "text" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ColorButton, { editor, type: "background" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ImageButton, { editor, onImageUpload }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(LinkButton, { editor }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TableButton, { editor }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(HTMLImportButton, { editor })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ImageButton, { editor, onImageUpload }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(LinkButton, { editor }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TableButton, { editor }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(HTMLImportButton, { editor })
       ] })
     ] })
   ] });
-  const SingleRowLayout = () => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(UndoRedoButtons, { editor }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(BlockTypeSelect, { editor }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "bold" }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "italic" }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "underline" }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "strike" })
+  const SingleRowLayout = () => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(UndoRedoButtons, { editor }),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(BlockTypeSelect, { editor }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "bold" }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "italic" }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "underline" }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "strike" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AlignButton, { editor, alignment: "left" }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AlignButton, { editor, alignment: "center" }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AlignButton, { editor, alignment: "right" })
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlignButton, { editor, alignment: "left" }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlignButton, { editor, alignment: "center" }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlignButton, { editor, alignment: "right" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ListButton, { editor, type: "bullet" }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ListButton, { editor, type: "numbered" })
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ListButton, { editor, type: "bullet" }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ListButton, { editor, type: "numbered" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ColorButton, { editor, type: "text" }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ColorButton, { editor, type: "background" })
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(FontSizeButton, { editor }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ColorButton, { editor, type: "text" }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ColorButton, { editor, type: "background" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ImageButton, { editor, onImageUpload }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(LinkButton, { editor }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TableButton, { editor }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(HTMLImportButton, { editor })
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ImageButton, { editor, onImageUpload }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(LinkButton, { editor }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TableButton, { editor }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(HTMLImportButton, { editor })
     ] })
   ] });
-  const TwoRowLayout = () => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-row", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(UndoRedoButtons, { editor }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "bold" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "italic" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "underline" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TextStyleButton, { editor, style: "strike" })
+  const TwoRowLayout = () => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(UndoRedoButtons, { editor }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "bold" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "italic" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "underline" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TextStyleButton, { editor, style: "strike" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AlignButton, { editor, alignment: "left" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AlignButton, { editor, alignment: "center" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AlignButton, { editor, alignment: "right" })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlignButton, { editor, alignment: "left" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlignButton, { editor, alignment: "center" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlignButton, { editor, alignment: "right" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ListButton, { editor, type: "bullet" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ListButton, { editor, type: "numbered" })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ListButton, { editor, type: "bullet" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ListButton, { editor, type: "numbered" })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-row", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(BlockTypeSelect, { editor }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ColorButton, { editor, type: "text" }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ColorButton, { editor, type: "background" })
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(BlockTypeSelect, { editor }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(FontSizeButton, { editor }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ColorButton, { editor, type: "text" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ColorButton, { editor, type: "background" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolbarDivider, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "lumir-toolbar-group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ImageButton, { editor, onImageUpload }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(LinkButton, { editor }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TableButton, { editor }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(HTMLImportButton, { editor })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolbarDivider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "lumir-toolbar-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ImageButton, { editor, onImageUpload }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(LinkButton, { editor }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TableButton, { editor }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(HTMLImportButton, { editor })
       ] })
     ] })
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
     "div",
     {
       ref: wrapperRef,
@@ -2796,7 +3269,7 @@ var FloatingMenu = ({
         className
       ),
       "data-position": position,
-      children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         "div",
         {
           className: cn(
@@ -2805,7 +3278,7 @@ var FloatingMenu = ({
             isMinimizable && "is-minimizable",
             isMinimized && "is-minimized"
           ),
-          children: isMinimizable ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(MinimizedLayout, {}) : isCompact ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TwoRowLayout, {}) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SingleRowLayout, {})
+          children: isMinimizable ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(MinimizedLayout, {}) : isCompact ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TwoRowLayout, {}) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SingleRowLayout, {})
         }
       )
     }
@@ -2905,8 +3378,8 @@ var LumirEditorError = class _LumirEditorError extends Error {
 };
 
 // src/extensions/VerticalAlignmentExtension.ts
-var import_core2 = require("@tiptap/core");
-var VerticalAlignmentExtension = import_core2.Extension.create({
+var import_core4 = require("@tiptap/core");
+var VerticalAlignmentExtension = import_core4.Extension.create({
   name: "verticalAlignment",
   addGlobalAttributes() {
     return [
@@ -2936,19 +3409,593 @@ var VerticalAlignmentExtension = import_core2.Extension.create({
   }
 });
 
-// src/components/CustomFormattingToolbar.tsx
-var import_react24 = require("@blocknote/react");
+// src/extensions/RowHeightExtension.ts
+var import_core5 = require("@tiptap/core");
 
-// src/components/TextAlignButtonWithVA.tsx
-var import_core3 = require("@blocknote/core");
-var import_react18 = require("react");
-var import_react19 = require("@blocknote/react");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+// src/extensions/rowResizing.ts
+var import_prosemirror_state3 = require("prosemirror-state");
+var import_prosemirror_view2 = require("prosemirror-view");
+var import_prosemirror_tables = require("prosemirror-tables");
+
+// src/constants/limits.ts
+var MAX_FILE_SIZE = 10 * 1024 * 1024;
+var MAX_VIDEO_FILE_SIZE = 100 * 1024 * 1024;
+var BLOCKED_EXTENSIONS = [".svg", ".svgz"];
+var ALLOWED_VIDEO_MIME_TYPES = /* @__PURE__ */ new Set([
+  "video/mp4",
+  "video/webm",
+  "video/ogg",
+  "video/quicktime"
+  // .mov
+]);
+var ALLOWED_VIDEO_EXTENSIONS = [
+  ".mp4",
+  ".webm",
+  ".ogg",
+  ".mov"
+];
+var ROW_RESIZE_MIN_HEIGHT = 24;
+var ROW_RESIZE_HANDLE_WIDTH = 5;
+
+// src/extensions/rowResizing.ts
+var rowResizingPluginKey = new import_prosemirror_state3.PluginKey(
+  "lumirRowResizing"
+);
+var RowResizeState = class _RowResizeState {
+  constructor(activeHandle, dragging) {
+    this.activeHandle = activeHandle;
+    this.dragging = dragging;
+  }
+  apply(tr) {
+    const action = tr.getMeta(rowResizingPluginKey);
+    if (action && action.setHandle != null) {
+      return new _RowResizeState(action.setHandle, null);
+    }
+    if (action && action.setDragging !== void 0) {
+      return new _RowResizeState(this.activeHandle, action.setDragging);
+    }
+    if (this.activeHandle > -1 && tr.docChanged) {
+      let handle = tr.mapping.map(this.activeHandle, -1);
+      if (!(0, import_prosemirror_tables.pointsAtCell)(tr.doc.resolve(handle))) {
+        handle = -1;
+      }
+      return new _RowResizeState(handle, this.dragging);
+    }
+    return this;
+  }
+};
+function rowResizing({
+  handleWidth = ROW_RESIZE_HANDLE_WIDTH,
+  minHeight = ROW_RESIZE_MIN_HEIGHT
+} = {}) {
+  return new import_prosemirror_state3.Plugin({
+    key: rowResizingPluginKey,
+    state: {
+      init() {
+        return new RowResizeState(-1, null);
+      },
+      apply(tr, prev) {
+        return prev.apply(tr);
+      }
+    },
+    props: {
+      attributes: (state) => {
+        const pluginState = rowResizingPluginKey.getState(state);
+        return pluginState && pluginState.activeHandle > -1 ? { class: "row-resize-cursor" } : {};
+      },
+      handleDOMEvents: {
+        mousemove: (view, event) => {
+          handleMouseMove(view, event, handleWidth);
+        },
+        mouseleave: (view) => {
+          handleMouseLeave(view);
+        },
+        mousedown: (view, event) => {
+          handleMouseDown(view, event, minHeight);
+        }
+      },
+      decorations: (state) => {
+        const pluginState = rowResizingPluginKey.getState(state);
+        if (pluginState && pluginState.activeHandle > -1) {
+          return handleDecorations(state, pluginState);
+        }
+        return void 0;
+      }
+    }
+  });
+}
+function handleMouseMove(view, event, handleWidth) {
+  if (!view.editable) {
+    return;
+  }
+  const pluginState = rowResizingPluginKey.getState(view.state);
+  if (!pluginState) {
+    return;
+  }
+  if (!pluginState.dragging) {
+    const target = domCellAround(event.target);
+    let cell = -1;
+    if (target) {
+      const { top, bottom } = target.getBoundingClientRect();
+      if (event.clientY - top <= handleWidth) {
+        cell = edgeCell(view, event, "top", handleWidth);
+      } else if (bottom - event.clientY <= handleWidth) {
+        cell = edgeCell(view, event, "bottom", handleWidth);
+      }
+    }
+    if (cell !== pluginState.activeHandle) {
+      updateHandle(view, cell);
+    }
+  }
+}
+function handleMouseLeave(view) {
+  if (!view.editable) {
+    return;
+  }
+  const pluginState = rowResizingPluginKey.getState(view.state);
+  if (pluginState && pluginState.activeHandle > -1 && !pluginState.dragging) {
+    updateHandle(view, -1);
+  }
+}
+function handleMouseDown(view, event, minHeight) {
+  if (!view.editable) {
+    return false;
+  }
+  const win = view.dom.ownerDocument.defaultView ?? window;
+  const pluginState = rowResizingPluginKey.getState(view.state);
+  if (!pluginState || pluginState.activeHandle === -1 || pluginState.dragging) {
+    return false;
+  }
+  const startHeight = currentRowHeight(view, pluginState.activeHandle);
+  setDragging(view, {
+    startY: event.clientY,
+    startHeight,
+    currentHeight: startHeight
+  });
+  function finish(finishEvent) {
+    win.removeEventListener("mouseup", finish);
+    win.removeEventListener("mousemove", move);
+    const ps = rowResizingPluginKey.getState(view.state);
+    if (ps?.dragging) {
+      const finalHeight = draggedHeight(ps.dragging, finishEvent, minHeight);
+      setDragging(view, null);
+      commitRowHeight(view, ps.activeHandle, finalHeight);
+    }
+  }
+  function move(moveEvent) {
+    if (moveEvent.buttons === 0 || moveEvent.buttons === void 0 && !moveEvent.which) {
+      return finish(moveEvent);
+    }
+    const ps = rowResizingPluginKey.getState(view.state);
+    if (!ps?.dragging) {
+      return;
+    }
+    const h = draggedHeight(ps.dragging, moveEvent, minHeight);
+    if (h !== ps.dragging.currentHeight) {
+      setDragging(view, { ...ps.dragging, currentHeight: h });
+    }
+  }
+  win.addEventListener("mouseup", finish);
+  win.addEventListener("mousemove", move);
+  event.preventDefault();
+  return true;
+}
+function setDragging(view, dragging) {
+  view.dispatch(
+    view.state.tr.setMeta(rowResizingPluginKey, { setDragging: dragging })
+  );
+}
+function currentRowHeight(view, cellPos) {
+  const info = targetRowInfo(view, cellPos);
+  const tr = rowTrElement(view, cellPos, info.row);
+  return tr ? tr.offsetHeight : ROW_RESIZE_MIN_HEIGHT;
+}
+function commitRowHeight(view, cellPos, height) {
+  const { table, map, start, row } = targetRowInfo(view, cellPos);
+  const tr = view.state.tr;
+  const seen = /* @__PURE__ */ new Set();
+  for (let col = 0; col < map.width; col++) {
+    const cellRelPos = map.map[row * map.width + col];
+    if (seen.has(cellRelPos)) {
+      continue;
+    }
+    seen.add(cellRelPos);
+    const rect = map.findCell(cellRelPos);
+    if (rect.bottom - 1 !== row) {
+      continue;
+    }
+    const node = table.nodeAt(cellRelPos);
+    if (!node || node.attrs.rowHeight === height) {
+      continue;
+    }
+    tr.setNodeMarkup(start + cellRelPos, void 0, {
+      ...node.attrs,
+      rowHeight: height
+    });
+  }
+  if (tr.docChanged) {
+    view.dispatch(tr);
+  }
+}
+function targetRowInfo(view, cellPos) {
+  const $cell = view.state.doc.resolve(cellPos);
+  const table = $cell.node(-1);
+  const map = import_prosemirror_tables.TableMap.get(table);
+  const start = $cell.start(-1);
+  const rect = map.findCell($cell.pos - start);
+  return { table, map, start, row: rect.bottom - 1, $cell };
+}
+function rowTrElement(view, cellPos, row) {
+  let dom = view.nodeDOM(cellPos);
+  while (dom && dom.nodeName !== "TABLE") {
+    dom = dom.parentNode;
+  }
+  if (!dom) {
+    return null;
+  }
+  return dom.rows[row] ?? null;
+}
+function domCellAround(target) {
+  let node = target;
+  while (node && node.nodeName !== "TD" && node.nodeName !== "TH") {
+    node = node.classList?.contains("ProseMirror") ? null : node.parentNode;
+  }
+  return node;
+}
+function edgeCell(view, event, side, handleWidth) {
+  const offset2 = side === "bottom" ? -handleWidth : handleWidth;
+  const found = view.posAtCoords({
+    left: event.clientX,
+    top: event.clientY + offset2
+  });
+  if (!found) {
+    return -1;
+  }
+  const $cell = (0, import_prosemirror_tables.cellAround)(view.state.doc.resolve(found.pos));
+  if (!$cell) {
+    return -1;
+  }
+  if (side === "bottom") {
+    return $cell.pos;
+  }
+  const map = import_prosemirror_tables.TableMap.get($cell.node(-1));
+  const start = $cell.start(-1);
+  const index = map.map.indexOf($cell.pos - start);
+  return index < map.width ? -1 : start + map.map[index - map.width];
+}
+function updateHandle(view, value) {
+  view.dispatch(
+    view.state.tr.setMeta(rowResizingPluginKey, { setHandle: value })
+  );
+}
+function draggedHeight(dragging, event, minHeight) {
+  const offset2 = event.clientY - dragging.startY;
+  return Math.max(minHeight, dragging.startHeight + offset2);
+}
+function handleDecorations(state, pluginState) {
+  const decorations = [];
+  const $cell = state.doc.resolve(pluginState.activeHandle);
+  const table = $cell.node(-1);
+  if (!table) {
+    return import_prosemirror_view2.DecorationSet.empty;
+  }
+  const map = import_prosemirror_tables.TableMap.get(table);
+  const start = $cell.start(-1);
+  const row = map.findCell($cell.pos - start).bottom - 1;
+  const dragging = pluginState.dragging;
+  const seen = /* @__PURE__ */ new Set();
+  for (let col = 0; col < map.width; col++) {
+    const cellRelPos = map.map[row * map.width + col];
+    if (seen.has(cellRelPos)) {
+      continue;
+    }
+    seen.add(cellRelPos);
+    if (map.findCell(cellRelPos).bottom - 1 !== row) {
+      continue;
+    }
+    const node = table.nodeAt(cellRelPos);
+    if (!node) {
+      continue;
+    }
+    const from = start + cellRelPos;
+    const to = from + node.nodeSize;
+    if (dragging) {
+      decorations.push(
+        import_prosemirror_view2.Decoration.node(from, to, {
+          class: "row-resize-dragging",
+          style: `height: ${dragging.currentHeight}px`
+        })
+      );
+    }
+    const handle = document.createElement("div");
+    handle.className = "row-resize-handle";
+    decorations.push(import_prosemirror_view2.Decoration.widget(to - 1, handle));
+  }
+  return import_prosemirror_view2.DecorationSet.create(state.doc, decorations);
+}
+
+// src/extensions/tableCellAttrPreserve.ts
+var import_prosemirror_state4 = require("prosemirror-state");
+var tableCellAttrPreserveKey = new import_prosemirror_state4.PluginKey(
+  "lumirTableCellAttrPreserve"
+);
+var PRESERVED_ATTRS = [
+  { name: "rowHeight", default: null },
+  { name: "verticalAlignment", default: "top" }
+];
+function isMeaningful(attrName, value, def) {
+  if (value === null || value === void 0) {
+    return false;
+  }
+  return value !== def;
+}
+function meaningfulAttrs(node) {
+  let out = null;
+  for (const { name, default: def } of PRESERVED_ATTRS) {
+    const v = node.attrs?.[name];
+    if (isMeaningful(name, v, def)) {
+      (out ?? (out = {}))[name] = v;
+    }
+  }
+  return out;
+}
+function collectCellAttrs(doc) {
+  const result = /* @__PURE__ */ new Map();
+  doc.descendants((node) => {
+    if (node.type.name !== "blockContainer") {
+      return void 0;
+    }
+    const id = node.attrs?.id;
+    const table = node.firstChild;
+    if (!id || table?.type.name !== "table") {
+      return void 0;
+    }
+    const cells = /* @__PURE__ */ new Map();
+    let rowIndex = 0;
+    table.forEach((rowNode) => {
+      if (rowNode.type.name === "tableRow") {
+        let cellIndex = 0;
+        rowNode.forEach((cellNode) => {
+          const attrs = meaningfulAttrs(cellNode);
+          if (attrs) {
+            cells.set(`${rowIndex}:${cellIndex}`, attrs);
+          }
+          cellIndex++;
+        });
+        rowIndex++;
+      }
+    });
+    if (cells.size > 0) {
+      result.set(id, cells);
+    }
+    return false;
+  });
+  return result;
+}
+function tableCellAttrPreserve() {
+  return new import_prosemirror_state4.Plugin({
+    key: tableCellAttrPreserveKey,
+    appendTransaction(transactions, oldState, newState) {
+      if (!transactions.some((tr2) => tr2.docChanged)) {
+        return null;
+      }
+      const oldMap = collectCellAttrs(oldState.doc);
+      if (oldMap.size === 0) {
+        return null;
+      }
+      const tr = newState.tr;
+      let changed = false;
+      let curTableCells = null;
+      let curRowIndex = -1;
+      let curCellIndex = 0;
+      newState.doc.descendants((node, pos) => {
+        const name = node.type.name;
+        if (name === "blockContainer") {
+          const id = node.attrs?.id;
+          const table = node.firstChild;
+          if (id && table?.type.name === "table" && oldMap.has(id)) {
+            curTableCells = oldMap.get(id);
+            curRowIndex = -1;
+          } else {
+            curTableCells = null;
+          }
+          return void 0;
+        }
+        if (!curTableCells) {
+          return void 0;
+        }
+        if (name === "tableRow") {
+          curRowIndex++;
+          curCellIndex = 0;
+          return void 0;
+        }
+        if (name === "tableCell" || name === "tableHeader") {
+          const wanted = curTableCells.get(`${curRowIndex}:${curCellIndex}`);
+          curCellIndex++;
+          if (wanted) {
+            const patch = {};
+            let needs = false;
+            for (const { name: attrName, default: def } of PRESERVED_ATTRS) {
+              if (!(attrName in wanted)) {
+                continue;
+              }
+              const cur = node.attrs?.[attrName];
+              if (cur === null || cur === void 0 || cur === def) {
+                patch[attrName] = wanted[attrName];
+                needs = true;
+              }
+            }
+            if (needs) {
+              tr.setNodeMarkup(pos, void 0, { ...node.attrs, ...patch });
+              changed = true;
+            }
+          }
+          return false;
+        }
+        return void 0;
+      });
+      return changed ? tr : null;
+    }
+  });
+}
+
+// src/extensions/RowHeightExtension.ts
+var RowHeightExtension = import_core5.Extension.create({
+  name: "rowHeight",
+  addOptions() {
+    return { resizable: true };
+  },
+  addGlobalAttributes() {
+    return [
+      {
+        types: ["tableCell", "tableHeader"],
+        attributes: {
+          rowHeight: {
+            default: null,
+            parseHTML: (element) => {
+              const fromStyle = parseInt(element.style?.height ?? "", 10);
+              if (Number.isFinite(fromStyle) && fromStyle > 0) {
+                return fromStyle;
+              }
+              const fromAttr = parseInt(
+                element.getAttribute("data-row-height") ?? "",
+                10
+              );
+              return Number.isFinite(fromAttr) && fromAttr > 0 ? fromAttr : null;
+            },
+            renderHTML: (attributes) => {
+              const h = attributes.rowHeight;
+              if (!h || typeof h !== "number") {
+                return {};
+              }
+              return { style: `height: ${h}px` };
+            }
+          }
+        }
+      }
+    ];
+  },
+  addProseMirrorPlugins() {
+    const plugins = [tableCellAttrPreserve()];
+    if (this.options.resizable) {
+      plugins.push(rowResizing());
+    }
+    return plugins;
+  }
+});
+
+// src/extensions/TableAlignmentExtension.ts
+var import_core6 = require("@tiptap/core");
+var import_prosemirror_state5 = require("prosemirror-state");
+var import_prosemirror_view3 = require("prosemirror-view");
+var tableAlignmentDecoKey = new import_prosemirror_state5.PluginKey("lumirTableAlignmentDeco");
+function tableAlignmentDecorationPlugin() {
+  return new import_prosemirror_state5.Plugin({
+    key: tableAlignmentDecoKey,
+    props: {
+      decorations(state) {
+        const decorations = [];
+        state.doc.descendants((node, pos) => {
+          if (node.type.name === "table") {
+            const align = node.attrs.tableAlignment;
+            if (align && align !== "left") {
+              decorations.push(
+                import_prosemirror_view3.Decoration.node(pos, pos + node.nodeSize, {
+                  "data-table-alignment": align
+                })
+              );
+            }
+            return false;
+          }
+          return void 0;
+        });
+        return import_prosemirror_view3.DecorationSet.create(state.doc, decorations);
+      }
+    }
+  });
+}
+var TableAlignmentExtension = import_core6.Extension.create({
+  name: "tableAlignment",
+  addGlobalAttributes() {
+    return [
+      {
+        types: ["table"],
+        attributes: {
+          tableAlignment: {
+            default: "left",
+            parseHTML: (element) => element.getAttribute("data-table-alignment") || "left",
+            renderHTML: (attributes) => {
+              if (!attributes.tableAlignment || attributes.tableAlignment === "left") {
+                return {};
+              }
+              return { "data-table-alignment": attributes.tableAlignment };
+            }
+          }
+        }
+      }
+    ];
+  },
+  addProseMirrorPlugins() {
+    return [tableAlignmentDecorationPlugin()];
+  }
+});
+
+// src/blocks/columns/insertColumns.ts
+var import_prosemirror_state6 = require("prosemirror-state");
+function insertTwoColumns(editor) {
+  const tiptap = editor?._tiptapEditor;
+  if (!tiptap) {
+    return false;
+  }
+  const { state, schema: schema2 } = tiptap;
+  const { blockContainer, paragraph, column, columnList } = schema2.nodes;
+  if (!blockContainer || !paragraph || !column || !columnList) {
+    return false;
+  }
+  const $from = state.selection.$from;
+  for (let d = $from.depth; d > 0; d--) {
+    const name = $from.node(d).type.name;
+    if (name === "column" || name === "columnList") {
+      return false;
+    }
+  }
+  let depth = $from.depth;
+  while (depth > 0 && $from.node(depth).type.name !== "blockContainer") {
+    depth--;
+  }
+  if (depth === 0) {
+    return false;
+  }
+  const insertPos = $from.after(depth);
+  const mkBlock = () => blockContainer.create(null, paragraph.create());
+  const mkColumn = () => column.create(null, mkBlock());
+  const list = columnList.create(null, [mkColumn(), mkColumn()]);
+  try {
+    let tr = state.tr.insert(insertPos, list);
+    try {
+      tr = tr.setSelection(import_prosemirror_state6.TextSelection.create(tr.doc, insertPos + 4));
+    } catch {
+    }
+    tiptap.view.dispatch(tr.scrollIntoView());
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+// src/components/CustomFormattingToolbar.tsx
+var import_react30 = require("@blocknote/react");
+
+// src/components/TextAlignButtonWithVA.tsx
+var import_core7 = require("@blocknote/core");
+var import_react20 = require("react");
+var import_react21 = require("@blocknote/react");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var icons = {
-  left: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("path", { d: "M15 15H3v2h12v-2zm0-8H3v2h12V7zM3 13h18v-2H3v2zm0 8h18v-2H3v2zM3 3v2h18V3H3z" }) }),
-  center: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("path", { d: "M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z" }) }),
-  right: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("path", { d: "M3 21h18v-2H3v2zm6-4h12v-2H9v2zm-6-4h18v-2H3v2zm6-4h12V7H9v2zM3 3v2h18V3H3z" }) }),
-  justify: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("path", { d: "M3 21h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18V7H3v2zM3 3v2h18V3H3z" }) })
+  left: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M15 15H3v2h12v-2zm0-8H3v2h12V7zM3 13h18v-2H3v2zm0 8h18v-2H3v2zM3 3v2h18V3H3z" }) }),
+  center: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z" }) }),
+  right: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M3 21h18v-2H3v2zm6-4h12v-2H9v2zm-6-4h18v-2H3v2zm6-4h12V7H9v2zM3 3v2h18V3H3z" }) }),
+  justify: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M3 21h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18V7H3v2zM3 3v2h18V3H3z" }) })
 };
 var tooltipMap = {
   left: "\uC67C\uCABD \uC815\uB82C",
@@ -2957,12 +4004,12 @@ var tooltipMap = {
   justify: "\uC591\uCABD \uC815\uB82C"
 };
 var TextAlignButtonWithVA = (props) => {
-  const Components = (0, import_react19.useComponentsContext)();
-  const editor = (0, import_react19.useBlockNoteEditor)();
-  const selectedBlocks = (0, import_react19.useSelectedBlocks)(editor);
-  const textAlignment = (0, import_react18.useMemo)(() => {
+  const Components = (0, import_react21.useComponentsContext)();
+  const editor = (0, import_react21.useBlockNoteEditor)();
+  const selectedBlocks = (0, import_react21.useSelectedBlocks)(editor);
+  const textAlignment = (0, import_react20.useMemo)(() => {
     const block = selectedBlocks[0];
-    if ((0, import_core3.checkBlockHasDefaultProp)("textAlignment", block, editor)) {
+    if ((0, import_core7.checkBlockHasDefaultProp)("textAlignment", block, editor)) {
       return block.props.textAlignment;
     }
     if (block.type === "table") {
@@ -2971,7 +4018,7 @@ var TextAlignButtonWithVA = (props) => {
         return;
       }
       const allCellsInTable = cellSelection.cells.map(
-        ({ row, col }) => (0, import_core3.mapTableCell)(
+        ({ row, col }) => (0, import_core7.mapTableCell)(
           block.content.rows[row].cells[col]
         ).props.textAlignment
       );
@@ -2982,7 +4029,7 @@ var TextAlignButtonWithVA = (props) => {
     }
     return;
   }, [editor, selectedBlocks]);
-  const setTextAlignment = (0, import_react18.useCallback)(
+  const setTextAlignment = (0, import_react20.useCallback)(
     (newAlignment) => {
       editor.focus();
       for (const block of selectedBlocks) {
@@ -3003,7 +4050,7 @@ var TextAlignButtonWithVA = (props) => {
             }
           }
           tiptap.view?.dispatch(tr);
-        } else if ((0, import_core3.checkBlockTypeHasDefaultProp)("textAlignment", block.type, editor)) {
+        } else if ((0, import_core7.checkBlockTypeHasDefaultProp)("textAlignment", block.type, editor)) {
           editor.updateBlock(block, {
             props: { textAlignment: newAlignment }
           });
@@ -3012,7 +4059,7 @@ var TextAlignButtonWithVA = (props) => {
     },
     [editor, selectedBlocks]
   );
-  const show = (0, import_react18.useMemo)(() => {
+  const show = (0, import_react20.useMemo)(() => {
     return !!selectedBlocks.find(
       (block) => "textAlignment" in block.props || block.type === "table" && block.children
     );
@@ -3020,7 +4067,7 @@ var TextAlignButtonWithVA = (props) => {
   if (!show || !editor.isEditable) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     Components.FormattingToolbar.Button,
     {
       className: "bn-button",
@@ -3035,21 +4082,21 @@ var TextAlignButtonWithVA = (props) => {
 };
 
 // src/components/VerticalAlignButton.tsx
-var import_react20 = require("react");
-var import_react21 = require("@blocknote/react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_react22 = require("react");
+var import_react23 = require("@blocknote/react");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var icons2 = {
-  top: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("line", { x1: "5", y1: "5", x2: "11", y2: "5" })
+  top: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("line", { x1: "5", y1: "5", x2: "11", y2: "5" })
   ] }),
-  middle: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("line", { x1: "5", y1: "8", x2: "11", y2: "8" })
+  middle: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("line", { x1: "5", y1: "8", x2: "11", y2: "8" })
   ] }),
-  bottom: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("line", { x1: "5", y1: "11", x2: "11", y2: "11" })
+  bottom: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("line", { x1: "5", y1: "11", x2: "11", y2: "11" })
   ] })
 };
 var tooltips = {
@@ -3071,13 +4118,13 @@ function getCurrentVerticalAlignment(editor) {
   return alignments.every((a) => a === first) ? first : void 0;
 }
 var VerticalAlignButton = (props) => {
-  const Components = (0, import_react21.useComponentsContext)();
-  const editor = (0, import_react21.useBlockNoteEditor)();
-  const selectedBlocks = (0, import_react21.useSelectedBlocks)(editor);
-  const currentAlignment = (0, import_react20.useMemo)(() => {
+  const Components = (0, import_react23.useComponentsContext)();
+  const editor = (0, import_react23.useBlockNoteEditor)();
+  const selectedBlocks = (0, import_react23.useSelectedBlocks)(editor);
+  const currentAlignment = (0, import_react22.useMemo)(() => {
     return getCurrentVerticalAlignment(editor);
   }, [editor, selectedBlocks]);
-  const setVerticalAlignment = (0, import_react20.useCallback)(
+  const setVerticalAlignment = (0, import_react22.useCallback)(
     (alignment) => {
       const tiptap = editor._tiptapEditor;
       if (!tiptap) return;
@@ -3099,13 +4146,13 @@ var VerticalAlignButton = (props) => {
     },
     [editor]
   );
-  const isInTable = (0, import_react20.useMemo)(() => {
+  const isInTable = (0, import_react22.useMemo)(() => {
     return selectedBlocks.some((block) => block.type === "table");
   }, [selectedBlocks]);
   if (!isInTable || !editor.isEditable) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     Components.FormattingToolbar.Button,
     {
       className: "bn-button",
@@ -3119,11 +4166,167 @@ var VerticalAlignButton = (props) => {
   );
 };
 
+// src/components/TableAlignButton.tsx
+var import_react24 = require("react");
+var import_react25 = require("@blocknote/react");
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var icons3 = {
+  left: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("rect", { x: "1.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
+  ] }),
+  center: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("rect", { x: "4.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
+  ] }),
+  right: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("rect", { x: "7.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
+  ] })
+};
+var tooltips2 = {
+  left: "\uD45C \uC67C\uCABD \uC815\uB82C",
+  center: "\uD45C \uAC00\uC6B4\uB370 \uC815\uB82C",
+  right: "\uD45C \uC624\uB978\uCABD \uC815\uB82C"
+};
+var TableAlignButton = (props) => {
+  const Components = (0, import_react25.useComponentsContext)();
+  const editor = (0, import_react25.useBlockNoteEditor)();
+  const selectedBlocks = (0, import_react25.useSelectedBlocks)(editor);
+  const tableBlock = (0, import_react24.useMemo)(
+    () => selectedBlocks.find((block) => block.type === "table"),
+    [selectedBlocks]
+  );
+  const current = (0, import_react24.useMemo)(() => {
+    if (!tableBlock?.id) return "left";
+    return getTableAlignment(editor, tableBlock.id);
+  }, [editor, tableBlock, selectedBlocks]);
+  const apply = (0, import_react24.useCallback)(() => {
+    if (!tableBlock?.id) return;
+    editor.focus();
+    setTableAlignment(editor, tableBlock.id, props.alignment);
+  }, [editor, tableBlock, props.alignment]);
+  if (!tableBlock || !editor.isEditable) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    Components.FormattingToolbar.Button,
+    {
+      className: "bn-button",
+      "data-test": `tableAlign${props.alignment.charAt(0).toUpperCase() + props.alignment.slice(1)}`,
+      onClick: apply,
+      isSelected: current === props.alignment,
+      label: tooltips2[props.alignment],
+      mainTooltip: tooltips2[props.alignment],
+      icon: icons3[props.alignment]
+    }
+  );
+};
+
+// src/components/FontSizeButton.tsx
+var import_react26 = require("@blocknote/react");
+var import_react27 = require("react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var DEFAULT_LABEL2 = "\uAE30\uBCF8";
+var toLabel2 = (size) => size.replace(/px$/, "");
+function FontSizeIcon({ size }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    "span",
+    {
+      style: {
+        pointerEvents: "none",
+        fontSize: "12px",
+        fontWeight: 600,
+        lineHeight: "20px",
+        whiteSpace: "nowrap"
+      },
+      children: size ? toLabel2(size) : "\uAC00A"
+    }
+  );
+}
+function FontSizeButton2() {
+  const Components = (0, import_react26.useComponentsContext)();
+  const editor = (0, import_react26.useBlockNoteEditor)();
+  const ed = editor;
+  const styleSchema = editor.schema.styleSchema;
+  const fontSizeInSchema = styleSchema.fontSize?.type === "fontSize" && styleSchema.fontSize?.propSchema === "string";
+  const selectedBlocks = (0, import_react26.useSelectedBlocks)(editor);
+  const [currentSize, setCurrentSize] = (0, import_react27.useState)(
+    fontSizeInSchema ? ed.getActiveStyles().fontSize || "" : ""
+  );
+  (0, import_react26.useEditorContentOrSelectionChange)(() => {
+    if (fontSizeInSchema) {
+      setCurrentSize(ed.getActiveStyles().fontSize || "");
+    }
+  }, editor);
+  const setFontSize = (0, import_react27.useCallback)(
+    (size) => {
+      size === "" ? ed.removeStyles({ fontSize: "" }) : ed.addStyles({ fontSize: size });
+      setTimeout(() => editor.focus());
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [editor]
+  );
+  const show = (0, import_react27.useMemo)(() => {
+    if (!fontSizeInSchema) {
+      return false;
+    }
+    for (const block of selectedBlocks) {
+      if (block.content !== void 0) {
+        return true;
+      }
+    }
+    return false;
+  }, [fontSizeInSchema, selectedBlocks]);
+  if (!show || !editor.isEditable) {
+    return null;
+  }
+  const tooltip = "\uAE00\uC790 \uD06C\uAE30";
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Components.Generic.Menu.Root, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      Components.FormattingToolbar.Button,
+      {
+        className: "bn-button",
+        "data-test": "font-size",
+        label: tooltip,
+        mainTooltip: tooltip,
+        icon: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(FontSizeIcon, { size: currentSize })
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Components.Generic.Menu.Dropdown, { className: "bn-menu-dropdown", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Components.Generic.Menu.Label, { children: "\uAE00\uC790 \uD06C\uAE30" }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        Components.Generic.Menu.Item,
+        {
+          onClick: () => setFontSize(""),
+          checked: currentSize === "",
+          "data-test": "font-size-default",
+          children: DEFAULT_LABEL2
+        },
+        "font-size-default"
+      ),
+      FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        Components.Generic.Menu.Item,
+        {
+          onClick: () => setFontSize(size),
+          checked: currentSize === size,
+          "data-test": "font-size-" + toLabel2(size),
+          children: toLabel2(size)
+        },
+        "font-size-" + size
+      ))
+    ] })
+  ] });
+}
+
 // src/components/color/LumirColorControls.tsx
-var import_core4 = require("@blocknote/core");
-var import_react22 = require("@blocknote/react");
-var import_react23 = require("react");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_core8 = require("@blocknote/core");
+var import_react28 = require("@blocknote/react");
+var import_react29 = require("react");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var COLORS = [
   "default",
   "gray",
@@ -3140,7 +4343,7 @@ function ColorIcon(props) {
   const textColor = props.textColor || "default";
   const backgroundColor = props.backgroundColor || "default";
   const size = props.size || 16;
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       className: "bn-color-icon",
@@ -3159,7 +4362,7 @@ function ColorIcon(props) {
   );
 }
 function CellFillIcon({ size = 18 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "svg",
     {
       width: size,
@@ -3168,17 +4371,17 @@ function CellFillIcon({ size = 18 }) {
       fill: "currentColor",
       style: { pointerEvents: "none" },
       "aria-hidden": "true",
-      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M16.56 8.94 7.62 0 6.21 1.41l2.38 2.38-5.15 5.15c-.59.59-.59 1.54 0 2.12l5.5 5.5c.29.29.68.44 1.06.44s.77-.15 1.06-.44l5.5-5.5c.59-.58.59-1.53 0-2.12zM5.21 10 10 5.21 14.79 10H5.21zM19 11.5s-2 2.17-2 3.5c0 1.1.9 2 2 2s2-.9 2-2c0-1.33-2-3.5-2-3.5z" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("path", { d: "M16.56 8.94 7.62 0 6.21 1.41l2.38 2.38-5.15 5.15c-.59.59-.59 1.54 0 2.12l5.5 5.5c.29.29.68.44 1.06.44s.77-.15 1.06-.44l5.5-5.5c.59-.58.59-1.53 0-2.12zM5.21 10 10 5.21 14.79 10H5.21zM19 11.5s-2 2.17-2 3.5c0 1.1.9 2 2 2s2-.9 2-2c0-1.33-2-3.5-2-3.5z" })
     }
   );
 }
 function LumirColorPicker(props) {
-  const Components = (0, import_react22.useComponentsContext)();
-  const dict = (0, import_react22.useDictionary)();
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
-    props.text ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Components.Generic.Menu.Label, { children: props.textTitle ?? dict.color_picker.text_title }),
-      COLORS.map((color) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  const Components = (0, import_react28.useComponentsContext)();
+  const dict = (0, import_react28.useDictionary)();
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+    props.text ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Components.Generic.Menu.Label, { children: props.textTitle ?? dict.color_picker.text_title }),
+      COLORS.map((color) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
         Components.Generic.Menu.Item,
         {
           onClick: () => {
@@ -3186,16 +4389,16 @@ function LumirColorPicker(props) {
             props.text.setColor(color);
           },
           "data-test": "text-color-" + color,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ColorIcon, { textColor: color, size: props.iconSize }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ColorIcon, { textColor: color, size: props.iconSize }),
           checked: props.text.color === color,
           children: dict.color_picker.colors[color]
         },
         "text-color-" + color
       ))
     ] }) : null,
-    props.background ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Components.Generic.Menu.Label, { children: props.backgroundTitle ?? dict.color_picker.background_title }),
-      COLORS.map((color) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    props.background ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Components.Generic.Menu.Label, { children: props.backgroundTitle ?? dict.color_picker.background_title }),
+      COLORS.map((color) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
         Components.Generic.Menu.Item,
         {
           onClick: () => {
@@ -3203,7 +4406,7 @@ function LumirColorPicker(props) {
             props.background.setColor(color);
           },
           "data-test": "background-color-" + color,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ColorIcon, { backgroundColor: color, size: props.iconSize }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ColorIcon, { backgroundColor: color, size: props.iconSize }),
           checked: props.background.color === color,
           children: dict.color_picker.colors[color]
         },
@@ -3213,20 +4416,20 @@ function LumirColorPicker(props) {
   ] });
 }
 function LumirColorStyleButton() {
-  const Components = (0, import_react22.useComponentsContext)();
-  const editor = (0, import_react22.useBlockNoteEditor)();
+  const Components = (0, import_react28.useComponentsContext)();
+  const editor = (0, import_react28.useBlockNoteEditor)();
   const ed = editor;
   const styleSchema = editor.schema.styleSchema;
   const textColorInSchema = styleSchema.textColor?.type === "textColor" && styleSchema.textColor?.propSchema === "string";
   const backgroundColorInSchema = styleSchema.backgroundColor?.type === "backgroundColor" && styleSchema.backgroundColor?.propSchema === "string";
-  const selectedBlocks = (0, import_react22.useSelectedBlocks)(editor);
-  const [currentTextColor, setCurrentTextColor] = (0, import_react23.useState)(
+  const selectedBlocks = (0, import_react28.useSelectedBlocks)(editor);
+  const [currentTextColor, setCurrentTextColor] = (0, import_react29.useState)(
     textColorInSchema ? ed.getActiveStyles().textColor || "default" : "default"
   );
-  const [currentBackgroundColor, setCurrentBackgroundColor] = (0, import_react23.useState)(
+  const [currentBackgroundColor, setCurrentBackgroundColor] = (0, import_react29.useState)(
     backgroundColorInSchema ? ed.getActiveStyles().backgroundColor || "default" : "default"
   );
-  (0, import_react22.useEditorContentOrSelectionChange)(() => {
+  (0, import_react28.useEditorContentOrSelectionChange)(() => {
     const active = ed.getActiveStyles();
     if (textColorInSchema) {
       setCurrentTextColor(active.textColor || "default");
@@ -3235,7 +4438,7 @@ function LumirColorStyleButton() {
       setCurrentBackgroundColor(active.backgroundColor || "default");
     }
   }, editor);
-  const setTextColor = (0, import_react23.useCallback)(
+  const setTextColor = (0, import_react29.useCallback)(
     (color) => {
       color === "default" ? ed.removeStyles({ textColor: color }) : ed.addStyles({ textColor: color });
       setTimeout(() => editor.focus());
@@ -3243,7 +4446,7 @@ function LumirColorStyleButton() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [editor]
   );
-  const setBackgroundColor = (0, import_react23.useCallback)(
+  const setBackgroundColor = (0, import_react29.useCallback)(
     (color) => {
       color === "default" ? ed.removeStyles({ backgroundColor: color }) : ed.addStyles({ backgroundColor: color });
       setTimeout(() => editor.focus());
@@ -3251,7 +4454,7 @@ function LumirColorStyleButton() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [editor]
   );
-  const show = (0, import_react23.useMemo)(() => {
+  const show = (0, import_react29.useMemo)(() => {
     if (!textColorInSchema && !backgroundColorInSchema) {
       return false;
     }
@@ -3266,15 +4469,15 @@ function LumirColorStyleButton() {
     return null;
   }
   const tooltip = "\uD14D\uC2A4\uD2B8 \uC0C9\xB7\uBC30\uACBD";
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(Components.Generic.Menu.Root, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Components.Generic.Menu.Root, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       Components.FormattingToolbar.Button,
       {
         className: "bn-button",
         "data-test": "colors",
         label: tooltip,
         mainTooltip: tooltip,
-        icon: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           ColorIcon,
           {
             textColor: currentTextColor,
@@ -3284,11 +4487,11 @@ function LumirColorStyleButton() {
         )
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       Components.Generic.Menu.Dropdown,
       {
         className: "bn-menu-dropdown bn-color-picker-dropdown",
-        children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           LumirColorPicker,
           {
             textTitle: "\uD14D\uC2A4\uD2B8 \uC0C9",
@@ -3302,18 +4505,18 @@ function LumirColorStyleButton() {
   ] });
 }
 function LumirCellColorToolbarButton() {
-  const Components = (0, import_react22.useComponentsContext)();
-  const editor = (0, import_react22.useBlockNoteEditor)();
-  const selectedBlocks = (0, import_react22.useSelectedBlocks)(editor);
-  const isMultiCell = (0, import_react23.useMemo)(() => {
+  const Components = (0, import_react28.useComponentsContext)();
+  const editor = (0, import_react28.useBlockNoteEditor)();
+  const selectedBlocks = (0, import_react28.useSelectedBlocks)(editor);
+  const isMultiCell = (0, import_react29.useMemo)(() => {
     if (selectedBlocks.length !== 1 || selectedBlocks[0].type !== "table") {
       return false;
     }
     const cs = editor.tableHandles?.getCellSelection();
     return !!cs && cs.cells.length > 1;
   }, [editor, selectedBlocks]);
-  const stashRef = (0, import_react23.useRef)([]);
-  const applyBackground = (0, import_react23.useCallback)(
+  const stashRef = (0, import_react29.useRef)([]);
+  const applyBackground = (0, import_react29.useCallback)(
     (color) => {
       const live = getSelectedCellPositions(editor);
       const positions = live.length > 0 ? live : stashRef.current;
@@ -3326,7 +4529,7 @@ function LumirCellColorToolbarButton() {
     return null;
   }
   const tooltip = "\uC140 \uBC30\uACBD\uC0C9";
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     Components.Generic.Menu.Root,
     {
       onOpenChange: (open) => {
@@ -3335,21 +4538,21 @@ function LumirCellColorToolbarButton() {
         }
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           Components.FormattingToolbar.Button,
           {
             className: "bn-button",
             "data-test": "cell-colors",
             label: tooltip,
             mainTooltip: tooltip,
-            icon: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(CellFillIcon, { size: 18 })
+            icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CellFillIcon, { size: 18 })
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           Components.Generic.Menu.Dropdown,
           {
             className: "bn-menu-dropdown bn-color-picker-dropdown",
-            children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
               LumirColorPicker,
               {
                 backgroundTitle: "\uC140 \uBC30\uACBD",
@@ -3363,12 +4566,12 @@ function LumirCellColorToolbarButton() {
   );
 }
 function LumirCellColorPickerButton(props) {
-  const Components = (0, import_react22.useComponentsContext)();
-  const editor = (0, import_react22.useBlockNoteEditor)();
+  const Components = (0, import_react28.useComponentsContext)();
+  const editor = (0, import_react28.useBlockNoteEditor)();
   const updateColor = (color, type) => {
     const newTable = props.block.content.rows.map((row) => ({
       ...row,
-      cells: row.cells.map((cell) => (0, import_core4.mapTableCell)(cell))
+      cells: row.cells.map((cell) => (0, import_core8.mapTableCell)(cell))
     }));
     if (type === "text") {
       newTable[props.rowIndex].cells[props.colIndex].props.textColor = color;
@@ -3385,25 +4588,25 @@ function LumirCellColorPickerButton(props) {
   if (!currentCell || editor.settings.tables.cellTextColor === false && editor.settings.tables.cellBackgroundColor === false) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(Components.Generic.Menu.Root, { position: "right", sub: true, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Components.Generic.Menu.Trigger, { sub: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Components.Generic.Menu.Item, { className: "bn-menu-item", subTrigger: true, children: "\uC140 \uC0C9\xB7\uBC30\uACBD" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Components.Generic.Menu.Root, { position: "right", sub: true, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Components.Generic.Menu.Trigger, { sub: true, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Components.Generic.Menu.Item, { className: "bn-menu-item", subTrigger: true, children: "\uC140 \uC0C9\xB7\uBC30\uACBD" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       Components.Generic.Menu.Dropdown,
       {
         sub: true,
         className: "bn-menu-dropdown bn-color-picker-dropdown",
-        children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           LumirColorPicker,
           {
             iconSize: 18,
             textTitle: "\uC140 \uAE00\uC790\uC0C9",
             backgroundTitle: "\uC140 \uBC30\uACBD",
             text: editor.settings.tables.cellTextColor ? {
-              color: (0, import_core4.isTableCell)(currentCell) ? currentCell.props.textColor : "default",
+              color: (0, import_core8.isTableCell)(currentCell) ? currentCell.props.textColor : "default",
               setColor: (color) => updateColor(color, "text")
             } : void 0,
             background: editor.settings.tables.cellBackgroundColor ? {
-              color: (0, import_core4.isTableCell)(currentCell) ? currentCell.props.backgroundColor : "default",
+              color: (0, import_core8.isTableCell)(currentCell) ? currentCell.props.backgroundColor : "default",
               setColor: (color) => updateColor(color, "background")
             } : void 0
           }
@@ -3413,21 +4616,21 @@ function LumirCellColorPickerButton(props) {
   ] });
 }
 function LumirTableCellMenu(props) {
-  const Components = (0, import_react22.useComponentsContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  const Components = (0, import_react28.useComponentsContext)();
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     Components.Generic.Menu.Dropdown,
     {
       className: "bn-menu-dropdown bn-drag-handle-menu",
-      children: props.children || /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-          import_react22.SplitButton,
+      children: props.children || /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          import_react28.SplitButton,
           {
             block: props.block,
             rowIndex: props.rowIndex,
             colIndex: props.colIndex
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           LumirCellColorPickerButton,
           {
             block: props.block,
@@ -3441,95 +4644,164 @@ function LumirTableCellMenu(props) {
 }
 
 // src/components/CustomFormattingToolbar.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var CustomFormattingToolbar = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react24.FormattingToolbar, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.BlockTypeSelect, {}, "blockTypeSelect"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.TableCellMergeButton, {}, "tableCellMergeButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.FileCaptionButton, {}, "fileCaptionButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.FileReplaceButton, {}, "replaceFileButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.FileRenameButton, {}, "fileRenameButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.FileDeleteButton, {}, "fileDeleteButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.FileDownloadButton, {}, "fileDownloadButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.FilePreviewButton, {}, "filePreviewButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.BasicTextStyleButton, { basicTextStyle: "bold" }, "boldStyleButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-      import_react24.BasicTextStyleButton,
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react30.FormattingToolbar, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.BlockTypeSelect, {}, "blockTypeSelect"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.TableCellMergeButton, {}, "tableCellMergeButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.FileCaptionButton, {}, "fileCaptionButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.FileReplaceButton, {}, "replaceFileButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.FileRenameButton, {}, "fileRenameButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.FileDeleteButton, {}, "fileDeleteButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.FileDownloadButton, {}, "fileDownloadButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.FilePreviewButton, {}, "filePreviewButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.BasicTextStyleButton, { basicTextStyle: "bold" }, "boldStyleButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      import_react30.BasicTextStyleButton,
       {
         basicTextStyle: "italic"
       },
       "italicStyleButton"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-      import_react24.BasicTextStyleButton,
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      import_react30.BasicTextStyleButton,
       {
         basicTextStyle: "underline"
       },
       "underlineStyleButton"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-      import_react24.BasicTextStyleButton,
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      import_react30.BasicTextStyleButton,
       {
         basicTextStyle: "strike"
       },
       "strikeStyleButton"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(TextAlignButtonWithVA, { textAlignment: "left" }, "textAlignLeftButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TextAlignButtonWithVA, { textAlignment: "left" }, "textAlignLeftButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       TextAlignButtonWithVA,
       {
         textAlignment: "center"
       },
       "textAlignCenterButton"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(TextAlignButtonWithVA, { textAlignment: "right" }, "textAlignRightButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TextAlignButtonWithVA, { textAlignment: "right" }, "textAlignRightButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       VerticalAlignButton,
       {
         verticalAlignment: "top"
       },
       "verticalAlignTop"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       VerticalAlignButton,
       {
         verticalAlignment: "middle"
       },
       "verticalAlignMiddle"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       VerticalAlignButton,
       {
         verticalAlignment: "bottom"
       },
       "verticalAlignBottom"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(LumirColorStyleButton, {}, "colorStyleButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(LumirCellColorToolbarButton, {}, "cellColorButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.NestBlockButton, {}, "nestBlockButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.UnnestBlockButton, {}, "unnestBlockButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react24.CreateLinkButton, {}, "createLinkButton")
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TableAlignButton, { alignment: "left" }, "tableAlignLeft"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TableAlignButton, { alignment: "center" }, "tableAlignCenter"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TableAlignButton, { alignment: "right" }, "tableAlignRight"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(FontSizeButton2, {}, "fontSizeButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(LumirColorStyleButton, {}, "colorStyleButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(LumirCellColorToolbarButton, {}, "cellColorButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.NestBlockButton, {}, "nestBlockButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.UnnestBlockButton, {}, "unnestBlockButton"),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react30.CreateLinkButton, {}, "createLinkButton")
+  ] });
+};
+
+// src/components/LumirDragHandleMenu.tsx
+var import_react31 = require("@blocknote/react");
+var import_jsx_runtime25 = require("react/jsx-runtime");
+var TABLE_ALIGN_ICONS = {
+  left: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("rect", { x: "1.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
+  ] }),
+  center: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("rect", { x: "4.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
+  ] }),
+  right: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("rect", { x: "7.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
+  ] })
+};
+var TABLE_ALIGN_LABELS = {
+  left: "\uD45C \uC67C\uCABD \uC815\uB82C",
+  center: "\uD45C \uAC00\uC6B4\uB370 \uC815\uB82C",
+  right: "\uD45C \uC624\uB978\uCABD \uC815\uB82C"
+};
+function TableAlignmentItems(props) {
+  const Components = (0, import_react31.useComponentsContext)();
+  const editor = (0, import_react31.useBlockNoteEditor)();
+  if (props.block?.type !== "table" || !props.block?.id) {
+    return null;
+  }
+  const current = getTableAlignment(editor, props.block.id);
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: ["left", "center", "right"].map((align) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    Components.Generic.Menu.Item,
+    {
+      icon: TABLE_ALIGN_ICONS[align],
+      checked: current === align,
+      onClick: () => {
+        setTableAlignment(editor, props.block.id, align);
+        editor.setTextCursorPosition(props.block.id);
+      },
+      children: TABLE_ALIGN_LABELS[align]
+    },
+    `tableAlign-${align}`
+  )) });
+}
+var LumirDragHandleMenu = (props) => {
+  const dict = (0, import_react31.useDictionary)();
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react31.DragHandleMenu, { ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react31.RemoveBlockItem, { ...props, children: dict.drag_handle.delete_menuitem }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react31.BlockColorsItem, { ...props, children: dict.drag_handle.colors_menuitem }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react31.TableRowHeaderItem, { ...props, children: dict.drag_handle.header_row_menuitem }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react31.TableColumnHeaderItem, { ...props, children: dict.drag_handle.header_column_menuitem }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(TableAlignmentItems, { block: props.block })
   ] });
 };
 
 // src/components/LumirTableHandlesController.tsx
-var import_react27 = require("@blocknote/react");
-var import_react28 = require("@floating-ui/react");
-var import_react29 = require("react");
+var import_react34 = require("@blocknote/react");
+var import_react35 = require("@floating-ui/react");
+var import_react36 = require("react");
 
 // src/components/hooks/useFocusedCellHandlePositioning.ts
-var import_react25 = require("@floating-ui/react");
-var import_react26 = require("react");
+var import_react32 = require("@floating-ui/react");
+var import_react33 = require("react");
 function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
-  const { refs, floatingStyles, context } = (0, import_react25.useFloating)({
+  const { refs, floatingStyles, context, update } = (0, import_react32.useFloating)({
     open: show,
     placement: orientation === "row" ? "left" : orientation === "col" ? "top" : "right",
     // col/row: 가장자리 선(zero-size)에, cell: 셀 우측 보더에 14px hit-area 중앙 정렬(-7).
-    middleware: [(0, import_react25.offset)(-7)],
-    whileElementsMounted: import_react25.autoUpdate
+    middleware: [(0, import_react32.offset)(-7)],
+    whileElementsMounted: import_react32.autoUpdate
   });
-  const { isMounted, styles } = (0, import_react25.useTransitionStyles)(context);
-  (0, import_react26.useEffect)(() => {
+  const { isMounted, styles } = (0, import_react32.useTransitionStyles)(context);
+  (0, import_react33.useEffect)(() => {
+    if (!show || !tbodyEl) {
+      return;
+    }
+    const ro = new ResizeObserver(() => update());
+    ro.observe(tbodyEl);
+    return () => ro.disconnect();
+  }, [show, tbodyEl, update]);
+  (0, import_react33.useEffect)(() => {
     if (!cellEl) {
       refs.setReference(null);
       return;
@@ -3549,7 +4821,7 @@ function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
       }
     });
   }, [cellEl, tbodyEl, orientation, refs]);
-  return (0, import_react26.useMemo)(
+  return (0, import_react33.useMemo)(
     () => ({
       isMounted,
       ref: refs.setFloating,
@@ -3564,7 +4836,7 @@ function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
 }
 
 // src/components/LumirTableHandlesController.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 function syncCoreHoverToFocusedCell(cellEl) {
   const r = cellEl.getBoundingClientRect();
   cellEl.dispatchEvent(
@@ -3578,15 +4850,15 @@ function syncCoreHoverToFocusedCell(cellEl) {
   );
 }
 function LumirTableHandlesController() {
-  const editor = (0, import_react27.useBlockNoteEditor)();
-  const [focused, setFocused] = (0, import_react29.useState)(null);
-  const [menuContainerRef, setMenuContainerRef] = (0, import_react29.useState)(null);
-  const [overlayEl, setOverlayEl] = (0, import_react29.useState)(null);
-  const [openMenu, setOpenMenu] = (0, import_react29.useState)(null);
-  const frozenRef = (0, import_react29.useRef)(false);
-  const menuOpenRef = (0, import_react29.useRef)(false);
-  const draggingRef = (0, import_react29.useRef)(false);
-  const recompute = (0, import_react29.useCallback)(() => {
+  const editor = (0, import_react34.useBlockNoteEditor)();
+  const [focused, setFocused] = (0, import_react36.useState)(null);
+  const [menuContainerRef, setMenuContainerRef] = (0, import_react36.useState)(null);
+  const [overlayEl, setOverlayEl] = (0, import_react36.useState)(null);
+  const [openMenu, setOpenMenu] = (0, import_react36.useState)(null);
+  const frozenRef = (0, import_react36.useRef)(false);
+  const menuOpenRef = (0, import_react36.useRef)(false);
+  const draggingRef = (0, import_react36.useRef)(false);
+  const recompute = (0, import_react36.useCallback)(() => {
     if (frozenRef.current) {
       return;
     }
@@ -3634,11 +4906,11 @@ function LumirTableHandlesController() {
       widgetContainer
     });
   }, [editor]);
-  (0, import_react27.useEditorContentOrSelectionChange)(recompute, editor);
-  (0, import_react29.useEffect)(() => {
+  (0, import_react34.useEditorContentOrSelectionChange)(recompute, editor);
+  (0, import_react36.useEffect)(() => {
     recompute();
   }, [recompute]);
-  (0, import_react29.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     const onUp = () => {
       requestAnimationFrame(() => {
         if (!menuOpenRef.current && !draggingRef.current && frozenRef.current) {
@@ -3650,7 +4922,7 @@ function LumirTableHandlesController() {
     window.addEventListener("pointerup", onUp);
     return () => window.removeEventListener("pointerup", onUp);
   }, [recompute]);
-  (0, import_react29.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     const f = focused;
     if (!f || !overlayEl) {
       return;
@@ -3675,7 +4947,13 @@ function LumirTableHandlesController() {
       overlayEl.style.height = `${bottom - top}px`;
     };
     update();
-    return (0, import_react28.autoUpdate)(f.cellEl, overlayEl, update);
+    const stopAutoUpdate = (0, import_react35.autoUpdate)(f.cellEl, overlayEl, update);
+    const ro = new ResizeObserver(update);
+    ro.observe(f.tbodyEl);
+    return () => {
+      stopAutoUpdate();
+      ro.disconnect();
+    };
   }, [focused, overlayEl, openMenu]);
   const cellEl = focused?.cellEl ?? null;
   const tbodyEl = focused?.tbodyEl ?? null;
@@ -3689,21 +4967,21 @@ function LumirTableHandlesController() {
     show
   );
   const th = editor.tableHandles;
-  const coreState = (0, import_react27.useUIPluginState)(
+  const coreState = (0, import_react34.useUIPluginState)(
     editor.tableHandles.onUpdate.bind(editor.tableHandles)
   );
-  const { addOrRemoveColumnsButton, addOrRemoveRowsButton } = (0, import_react27.useExtendButtonsPositioning)(
+  const { addOrRemoveColumnsButton, addOrRemoveRowsButton } = (0, import_react34.useExtendButtonsPositioning)(
     coreState?.showAddOrRemoveColumnsButton || false,
     coreState?.showAddOrRemoveRowsButton || false,
     coreState?.referencePosTable || null
   );
-  const onStartExtend = (0, import_react29.useCallback)(() => {
+  const onStartExtend = (0, import_react36.useCallback)(() => {
     editor.tableHandles?.freezeHandles();
   }, [editor]);
-  const onEndExtend = (0, import_react29.useCallback)(() => {
+  const onEndExtend = (0, import_react36.useCallback)(() => {
     editor.tableHandles?.unfreezeHandles();
   }, [editor]);
-  const menuHandlers = (0, import_react29.useMemo)(() => {
+  const menuHandlers = (0, import_react36.useMemo)(() => {
     const mk = (kind) => ({
       freeze: () => {
         menuOpenRef.current = true;
@@ -3721,10 +4999,10 @@ function LumirTableHandlesController() {
     });
     return { col: mk("col"), row: mk("row"), cell: mk("cell") };
   }, [editor, recompute]);
-  const onGutterPointerDown = (0, import_react29.useCallback)(() => {
+  const onGutterPointerDown = (0, import_react36.useCallback)(() => {
     frozenRef.current = true;
   }, []);
-  const onGutterPointerEnter = (0, import_react29.useCallback)(
+  const onGutterPointerEnter = (0, import_react36.useCallback)(
     (e) => {
       if (e.buttons === 0 && focused) {
         syncCoreHoverToFocusedCell(focused.cellEl);
@@ -3732,7 +5010,7 @@ function LumirTableHandlesController() {
     },
     [focused]
   );
-  const makeDragStart = (0, import_react29.useCallback)(
+  const makeDragStart = (0, import_react36.useCallback)(
     (dir) => (e) => {
       draggingRef.current = true;
       frozenRef.current = true;
@@ -3744,19 +5022,19 @@ function LumirTableHandlesController() {
     },
     [editor]
   );
-  const onDragEnd = (0, import_react29.useCallback)(() => {
+  const onDragEnd = (0, import_react36.useCallback)(() => {
     editor.tableHandles?.dragEnd();
     draggingRef.current = false;
     frozenRef.current = false;
     recompute();
   }, [editor, recompute]);
-  const noop = (0, import_react29.useCallback)(() => {
+  const noop = (0, import_react36.useCallback)(() => {
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { ref: setMenuContainerRef }),
-    th && focused && menuContainerRef && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react28.FloatingPortal, { root: focused.widgetContainer, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { ref: setOverlayEl, className: "lumir-tbl-cell-focus" }),
-      colHandle.isMounted && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { ref: setMenuContainerRef }),
+    th && focused && menuContainerRef && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react35.FloatingPortal, { root: focused.widgetContainer, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { ref: setOverlayEl, className: "lumir-tbl-cell-focus" }),
+      colHandle.isMounted && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
         "div",
         {
           ref: colHandle.ref,
@@ -3765,9 +5043,9 @@ function LumirTableHandlesController() {
           onPointerEnter: onGutterPointerEnter,
           onPointerDown: onGutterPointerDown,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "lumir-tbl-gutter" }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-              import_react27.TableHandle,
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "lumir-tbl-gutter" }),
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+              import_react34.TableHandle,
               {
                 editor,
                 orientation: "column",
@@ -3785,7 +5063,7 @@ function LumirTableHandlesController() {
           ]
         }
       ),
-      rowHandle.isMounted && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+      rowHandle.isMounted && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
         "div",
         {
           ref: rowHandle.ref,
@@ -3794,9 +5072,9 @@ function LumirTableHandlesController() {
           onPointerEnter: onGutterPointerEnter,
           onPointerDown: onGutterPointerDown,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "lumir-tbl-gutter" }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-              import_react27.TableHandle,
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "lumir-tbl-gutter" }),
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+              import_react34.TableHandle,
               {
                 editor,
                 orientation: "row",
@@ -3814,7 +5092,7 @@ function LumirTableHandlesController() {
           ]
         }
       ),
-      cellHandle.isMounted && openMenu !== "col" && openMenu !== "row" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+      cellHandle.isMounted && openMenu !== "col" && openMenu !== "row" && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
         "div",
         {
           ref: cellHandle.ref,
@@ -3822,9 +5100,9 @@ function LumirTableHandlesController() {
           className: "lumir-tbl-gutter-wrap lumir-tbl-gutter-wrap--cell" + (openMenu === "cell" ? " lumir-tbl-gutter-wrap--active" : ""),
           onPointerDown: onGutterPointerDown,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "lumir-tbl-gutter" }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-              import_react27.TableCellButton,
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "lumir-tbl-gutter" }),
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+              import_react34.TableCellButton,
               {
                 editor,
                 rowIndex: focused.rowIndex,
@@ -3840,9 +5118,9 @@ function LumirTableHandlesController() {
         }
       )
     ] }),
-    th && coreState?.widgetContainer && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react28.FloatingPortal, { root: coreState.widgetContainer, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { ref: addOrRemoveRowsButton.ref, style: addOrRemoveRowsButton.style, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-        import_react27.ExtendButton,
+    th && coreState?.widgetContainer && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react35.FloatingPortal, { root: coreState.widgetContainer, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { ref: addOrRemoveRowsButton.ref, style: addOrRemoveRowsButton.style, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+        import_react34.ExtendButton,
         {
           editor,
           orientation: "addOrRemoveRows",
@@ -3851,13 +5129,13 @@ function LumirTableHandlesController() {
           onMouseUp: onEndExtend
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         "div",
         {
           ref: addOrRemoveColumnsButton.ref,
           style: addOrRemoveColumnsButton.style,
-          children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-            import_react27.ExtendButton,
+          children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+            import_react34.ExtendButton,
             {
               editor,
               orientation: "addOrRemoveColumns",
@@ -3873,15 +5151,17 @@ function LumirTableHandlesController() {
 }
 
 // src/utils/table-vertical-alignment.ts
-function injectVerticalAlignment(blocks, editor) {
-  const tiptap = editor?._tiptapEditor;
-  if (!tiptap) return blocks;
-  const { doc } = tiptap.state;
-  const tableVAMap = buildTableVerticalAlignmentMap(doc);
-  if (tableVAMap.size === 0) return blocks;
-  return patchBlocks(blocks, tableVAMap);
+var CELL_ATTR_DEFAULTS = {
+  verticalAlignment: "top",
+  rowHeight: null
+};
+function isMeaningful2(attr, value) {
+  if (value === null || value === void 0) {
+    return false;
+  }
+  return value !== CELL_ATTR_DEFAULTS[attr];
 }
-function buildTableVerticalAlignmentMap(doc) {
+function buildTableCellAttrMap(doc, attrs) {
   const result = /* @__PURE__ */ new Map();
   doc.descendants((node) => {
     if (node.type.name === "blockContainer") {
@@ -3894,9 +5174,15 @@ function buildTableVerticalAlignmentMap(doc) {
           if (rowNode.type.name === "tableRow") {
             let colIndex = 0;
             rowNode.forEach((cellNode) => {
-              const va = cellNode.attrs?.verticalAlignment;
-              if (va && va !== "top") {
-                cells.push({ row: rowIndex, col: colIndex, va });
+              const props = {};
+              for (const attr of attrs) {
+                const value = cellNode.attrs?.[attr];
+                if (isMeaningful2(attr, value)) {
+                  props[attr] = value;
+                }
+              }
+              if (Object.keys(props).length > 0) {
+                cells.push({ row: rowIndex, col: colIndex, props });
               }
               colIndex++;
             });
@@ -3912,18 +5198,21 @@ function buildTableVerticalAlignmentMap(doc) {
   });
   return result;
 }
-function patchBlocks(blocks, tableVAMap) {
+function patchBlocks(blocks, cellAttrMap) {
   return blocks.map((block) => {
     if (block.type !== "table" || !block.id || !block.content) {
       if (block.children && block.children.length > 0) {
         return {
           ...block,
-          children: patchBlocks(block.children, tableVAMap)
+          children: patchBlocks(
+            block.children,
+            cellAttrMap
+          )
         };
       }
       return block;
     }
-    const cells = tableVAMap.get(block.id);
+    const cells = cellAttrMap.get(block.id);
     if (!cells || cells.length === 0) {
       return block;
     }
@@ -3936,11 +5225,13 @@ function patchBlocks(blocks, tableVAMap) {
         const match = cells.find(
           (c) => c.row === rowIndex && c.col === colIndex
         );
-        if (!match) return cell;
+        if (!match) {
+          return cell;
+        }
         if (cell && typeof cell === "object" && cell.type === "tableCell") {
           return {
             ...cell,
-            props: { ...cell.props, verticalAlignment: match.va }
+            props: { ...cell.props, ...match.props }
           };
         }
         return cell;
@@ -3953,6 +5244,161 @@ function patchBlocks(blocks, tableVAMap) {
     };
   });
 }
+function injectTableCellAttrs(blocks, editor, attrs) {
+  const tiptap = editor?._tiptapEditor;
+  if (!tiptap) {
+    return blocks;
+  }
+  const { doc } = tiptap.state;
+  const cellAttrMap = buildTableCellAttrMap(doc, attrs);
+  if (cellAttrMap.size === 0) {
+    return blocks;
+  }
+  return patchBlocks(blocks, cellAttrMap);
+}
+var TABLE_BLOCK_ATTR_DEFAULTS = {
+  tableAlignment: "left"
+};
+function buildTableBlockAttrMap(doc, attrs) {
+  const result = /* @__PURE__ */ new Map();
+  doc.descendants((node) => {
+    if (node.type.name === "blockContainer") {
+      const blockId = node.attrs?.id;
+      const contentNode = node.firstChild;
+      if (blockId && contentNode?.type.name === "table") {
+        const props = {};
+        for (const attr of attrs) {
+          const value = contentNode.attrs?.[attr];
+          if (value !== null && value !== void 0 && value !== TABLE_BLOCK_ATTR_DEFAULTS[attr]) {
+            props[attr] = value;
+          }
+        }
+        if (Object.keys(props).length > 0) {
+          result.set(blockId, props);
+        }
+      }
+      return false;
+    }
+    return void 0;
+  });
+  return result;
+}
+function patchTableBlockProps(blocks, attrMap) {
+  return blocks.map((block) => {
+    if (block.type === "table" && block.id && attrMap.has(block.id)) {
+      return {
+        ...block,
+        props: { ...block.props, ...attrMap.get(block.id) }
+      };
+    }
+    if (block.children && block.children.length > 0) {
+      return {
+        ...block,
+        children: patchTableBlockProps(
+          block.children,
+          attrMap
+        )
+      };
+    }
+    return block;
+  });
+}
+function injectTableBlockAttrs(blocks, editor) {
+  const tiptap = editor?._tiptapEditor;
+  if (!tiptap) {
+    return blocks;
+  }
+  const { doc } = tiptap.state;
+  const attrMap = buildTableBlockAttrMap(doc, ["tableAlignment"]);
+  if (attrMap.size === 0) {
+    return blocks;
+  }
+  return patchTableBlockProps(blocks, attrMap);
+}
+
+// src/utils/font-size-serialization.ts
+function mapPreservingRef(arr, fn) {
+  let changed = false;
+  const next = arr.map((item) => {
+    const mapped = fn(item);
+    if (mapped !== item) changed = true;
+    return mapped;
+  });
+  return changed ? next : arr;
+}
+function mapStyledItem(item, dir) {
+  if (!item || typeof item !== "object" || item.type !== "text") {
+    return item;
+  }
+  if (dir === "lower") {
+    const fs2 = item.styles?.fontSize;
+    if (fs2 == null) return item;
+    const { fontSize: _removed, ...restStyles } = item.styles;
+    return { ...item, styles: restStyles, fontSize: fs2 };
+  }
+  const fs = item.fontSize;
+  if (fs == null) return item;
+  const { fontSize: _lifted, ...rest } = item;
+  return { ...rest, styles: { ...item.styles ?? {}, fontSize: fs } };
+}
+function mapInlineItem(node, dir) {
+  if (!node || typeof node !== "object") return node;
+  if (node.type === "link" && Array.isArray(node.content)) {
+    const content = mapPreservingRef(
+      node.content,
+      (n) => mapStyledItem(n, dir)
+    );
+    return content === node.content ? node : { ...node, content };
+  }
+  return mapStyledItem(node, dir);
+}
+function mapCell(cell, dir) {
+  if (cell && typeof cell === "object" && cell.type === "tableCell") {
+    if (!Array.isArray(cell.content)) return cell;
+    const content = mapPreservingRef(
+      cell.content,
+      (n) => mapInlineItem(n, dir)
+    );
+    return content === cell.content ? cell : { ...cell, content };
+  }
+  if (Array.isArray(cell)) {
+    return mapPreservingRef(cell, (n) => mapInlineItem(n, dir));
+  }
+  return cell;
+}
+function mapBlock(block, dir) {
+  if (!block || typeof block !== "object") return block;
+  let next = block;
+  const content = block.content;
+  if (Array.isArray(content)) {
+    const mapped = mapPreservingRef(content, (n) => mapInlineItem(n, dir));
+    if (mapped !== content) next = { ...next, content: mapped };
+  } else if (content && typeof content === "object" && content.type === "tableContent" && Array.isArray(content.rows)) {
+    const rows = mapPreservingRef(content.rows, (row) => {
+      if (!row || !Array.isArray(row.cells)) return row;
+      const cells = mapPreservingRef(
+        row.cells,
+        (cell) => mapCell(cell, dir)
+      );
+      return cells === row.cells ? row : { ...row, cells };
+    });
+    if (rows !== content.rows) next = { ...next, content: { ...content, rows } };
+  }
+  if (Array.isArray(block.children) && block.children.length > 0) {
+    const children = mapPreservingRef(
+      block.children,
+      (b) => mapBlock(b, dir)
+    );
+    if (children !== block.children) next = { ...next, children };
+  }
+  return next;
+}
+function lowerFontSize(blocks) {
+  return mapPreservingRef(blocks, (b) => mapBlock(b, "lower"));
+}
+function liftFontSize(blocks) {
+  return mapPreservingRef(blocks, (b) => mapBlock(b, "lift"));
+}
 
 // src/utils/excel-paste.ts
 var NAMED_COLORS = {
@@ -4183,26 +5629,8 @@ function normalizeExcelTableHtml(html) {
   }
 }
 
-// src/constants/limits.ts
-var MAX_FILE_SIZE = 10 * 1024 * 1024;
-var MAX_VIDEO_FILE_SIZE = 100 * 1024 * 1024;
-var BLOCKED_EXTENSIONS = [".svg", ".svgz"];
-var ALLOWED_VIDEO_MIME_TYPES = /* @__PURE__ */ new Set([
-  "video/mp4",
-  "video/webm",
-  "video/ogg",
-  "video/quicktime"
-  // .mov
-]);
-var ALLOWED_VIDEO_EXTENSIONS = [
-  ".mp4",
-  ".webm",
-  ".ogg",
-  ".mov"
-];
-
 // src/components/LumirEditor.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var DEBUG_LOG = (loc, msg, data) => {
   const p = fetch("http://127.0.0.1:7686/ingest/1f8ee1c5-0cf0-4ae7-91ed-5ea7ed17130a", {
     method: "POST",
@@ -4367,6 +5795,12 @@ var isVideoFile = (file, maxSize) => {
   });
   return result;
 };
+var isSuppressiblePopupSelection = (editor, selection) => {
+  if (!selection) return false;
+  if (selection.node) return false;
+  if (isInTableCell(editor)) return false;
+  return true;
+};
 var isHtmlFile = (file) => {
   return file.size > 0 && (file.type === "text/html" || file.name?.toLowerCase().endsWith(".html") || file.name?.toLowerCase().endsWith(".htm"));
 };
@@ -4427,9 +5861,9 @@ var findBlockWithLink = (blocks, targetUrl) => {
   return null;
 };
 var ConvertToPreviewButton = ({ url }) => {
-  const editor = (0, import_react31.useBlockNoteEditor)();
-  const Components = (0, import_react31.useComponentsContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  const editor = (0, import_react38.useBlockNoteEditor)();
+  const Components = (0, import_react38.useComponentsContext)();
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     Components.LinkToolbar.Button,
     {
       className: "bn-button",
@@ -4448,29 +5882,29 @@ var ConvertToPreviewButton = ({ url }) => {
           console.error("Convert to link preview failed:", err);
         }
       },
-      icon: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("rect", { x: "1", y: "3", width: "14", height: "10", rx: "2", stroke: "currentColor", strokeWidth: "1.5", fill: "none" }),
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("line", { x1: "1", y1: "9", x2: "15", y2: "9", stroke: "currentColor", strokeWidth: "1.5" }),
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("circle", { cx: "5", cy: "6.5", r: "1.5", stroke: "currentColor", strokeWidth: "1", fill: "none" })
+      icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("rect", { x: "1", y: "3", width: "14", height: "10", rx: "2", stroke: "currentColor", strokeWidth: "1.5", fill: "none" }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("line", { x1: "1", y1: "9", x2: "15", y2: "9", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("circle", { cx: "5", cy: "6.5", r: "1.5", stroke: "currentColor", strokeWidth: "1", fill: "none" })
       ] })
     }
   );
 };
 var CustomLinkToolbar = (props) => {
-  const editor = (0, import_react31.useBlockNoteEditor)();
-  const Components = (0, import_react31.useComponentsContext)();
+  const editor = (0, import_react38.useBlockNoteEditor)();
+  const Components = (0, import_react38.useComponentsContext)();
   const hasLinkPreview = !!editor?._linkPreviewApiEndpoint;
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
     Components.LinkToolbar.Root,
     {
       className: "bn-toolbar bn-link-toolbar",
       onMouseEnter: props.stopHideTimer,
       onMouseLeave: props.startHideTimer,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react31.EditLinkButton, { url: props.url, text: props.text, editLink: props.editLink }),
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react31.OpenLinkButton, { url: props.url }),
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react31.DeleteLinkButton, { deleteLink: props.deleteLink }),
-        hasLinkPreview && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ConvertToPreviewButton, { url: props.url })
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react38.EditLinkButton, { url: props.url, text: props.text, editLink: props.editLink }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react38.OpenLinkButton, { url: props.url }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react38.DeleteLinkButton, { deleteLink: props.deleteLink }),
+        hasLinkPreview && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ConvertToPreviewButton, { url: props.url })
       ]
     }
   );
@@ -4514,13 +5948,13 @@ function LumirEditor({
   onError,
   onImageDelete
 }) {
-  const [isUploading, setIsUploading] = (0, import_react30.useState)(false);
-  const [uploadProgress, setUploadProgress] = (0, import_react30.useState)(null);
-  const [errorMessage, setErrorMessage] = (0, import_react30.useState)(null);
-  const floatingMenuFileInputRef = (0, import_react30.useRef)(null);
-  const floatingMenuBlockRef = (0, import_react30.useRef)(null);
-  const floatingMenuUploadStartTimeRef = (0, import_react30.useRef)(0);
-  const handleError = (0, import_react30.useCallback)(
+  const [isUploading, setIsUploading] = (0, import_react37.useState)(false);
+  const [uploadProgress, setUploadProgress] = (0, import_react37.useState)(null);
+  const [errorMessage, setErrorMessage] = (0, import_react37.useState)(null);
+  const floatingMenuFileInputRef = (0, import_react37.useRef)(null);
+  const floatingMenuBlockRef = (0, import_react37.useRef)(null);
+  const floatingMenuUploadStartTimeRef = (0, import_react37.useRef)(0);
+  const handleError = (0, import_react37.useCallback)(
     (error) => {
       onError?.(error);
       setErrorMessage(error.getUserMessage());
@@ -4528,10 +5962,12 @@ function LumirEditor({
     },
     [onError]
   );
-  const validatedContent = (0, import_react30.useMemo)(() => {
-    return ContentUtils.validateContent(initialContent, initialEmptyBlocks);
+  const validatedContent = (0, import_react37.useMemo)(() => {
+    return liftFontSize(
+      ContentUtils.validateContent(initialContent, initialEmptyBlocks)
+    );
   }, [initialContent, initialEmptyBlocks]);
-  const tableConfig = (0, import_react30.useMemo)(() => {
+  const tableConfig = (0, import_react37.useMemo)(() => {
     return EditorConfig.getDefaultTableConfig(tables);
   }, [
     tables?.splitCells,
@@ -4539,10 +5975,10 @@ function LumirEditor({
     tables?.cellTextColor,
     tables?.headers
   ]);
-  const headingConfig = (0, import_react30.useMemo)(() => {
+  const headingConfig = (0, import_react37.useMemo)(() => {
     return EditorConfig.getDefaultHeadingConfig(heading);
   }, [heading?.levels?.join(",") ?? ""]);
-  const disabledExtensions = (0, import_react30.useMemo)(() => {
+  const disabledExtensions = (0, import_react37.useMemo)(() => {
     return EditorConfig.getDisabledExtensions(
       disableExtensions,
       allowVideoUpload,
@@ -4550,18 +5986,18 @@ function LumirEditor({
       allowFileUpload
     );
   }, [disableExtensions, allowVideoUpload, allowAudioUpload, allowFileUpload]);
-  (0, import_react30.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     DEBUG_LOG("LumirEditor:init:disabledExtensions", "snapshot", {
       allowVideoUpload,
       hasVideoInDisabled: disabledExtensions.includes("video"),
       disabledList: disabledExtensions.slice(0, 15)
     });
   }, [allowVideoUpload, disabledExtensions]);
-  const fileNameTransformRef = (0, import_react30.useRef)(s3Upload?.fileNameTransform);
-  (0, import_react30.useEffect)(() => {
+  const fileNameTransformRef = (0, import_react37.useRef)(s3Upload?.fileNameTransform);
+  (0, import_react37.useEffect)(() => {
     fileNameTransformRef.current = s3Upload?.fileNameTransform;
   }, [s3Upload?.fileNameTransform]);
-  const memoizedS3Upload = (0, import_react30.useMemo)(() => {
+  const memoizedS3Upload = (0, import_react37.useMemo)(() => {
     if (!s3Upload) return void 0;
     return {
       apiEndpoint: s3Upload.apiEndpoint,
@@ -4590,7 +6026,7 @@ function LumirEditor({
     s3Upload?.maxRetries,
     s3Upload?.onProgress
   ]);
-  const editor = (0, import_react31.useCreateBlockNote)(
+  const editor = (0, import_react38.useCreateBlockNote)(
     {
       // HTML 미리보기 블록이 포함된 커스텀 스키마 사용
       schema,
@@ -4612,7 +6048,14 @@ function LumirEditor({
       // 확장 비활성: 비디오/오디오/파일 제어
       disableExtensions: disabledExtensions,
       _tiptapOptions: {
-        extensions: [VerticalAlignmentExtension]
+        extensions: [
+          VerticalAlignmentExtension,
+          // 행 높이 attr 등록은 항상(저장된 높이 렌더), 드래그 리사이즈 UI는
+          // tableHandles prop으로 게이트(기존 grip 컨트롤러와 동일 게이트).
+          RowHeightExtension.configure({ resizable: tableHandles }),
+          // 표 블록 정렬(좌/가운데/우) attr.
+          TableAlignmentExtension
+        ]
       },
       placeholders: placeholder ? { default: placeholder, emptyDocument: placeholder } : void 0,
       tabBehavior,
@@ -4788,33 +6231,65 @@ function LumirEditor({
       memoizedS3Upload,
       allowVideoUpload,
       linkPreview?.apiEndpoint,
-      placeholder
+      placeholder,
+      // tableHandles 변경 시 RowHeightExtension의 resizable 게이트가 반영되도록 재생성
+      tableHandles
     ]
   );
   if (editor && linkPreview?.apiEndpoint) {
     editor._linkPreviewApiEndpoint = linkPreview.apiEndpoint;
   }
-  (0, import_react30.useEffect)(() => {
+  if (editor) {
+    try {
+      const view = editor.prosemirrorView;
+      if (view) {
+        view.__lumirEditor = editor;
+      }
+    } catch {
+    }
+  }
+  (0, import_react37.useEffect)(() => {
     if (editor) {
       editor.isEditable = editable;
     }
   }, [editor, editable]);
-  (0, import_react30.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
+    if (!editor || !floatingMenu) return;
+    const ft = editor.formattingToolbar;
+    if (!ft?.onUpdate) return;
+    const unsubscribe = ft.onUpdate((state) => {
+      if (!state?.show) return;
+      const selection = editor._tiptapEditor?.state?.selection;
+      if (isSuppressiblePopupSelection(editor, selection)) {
+        ft.closeMenu();
+      }
+    });
+    return unsubscribe;
+  }, [editor, floatingMenu]);
+  (0, import_react37.useEffect)(() => {
     if (!editor || !onContentChange) return;
     const handleContentChange = () => {
       const blocks = editor.topLevelBlocks;
-      const patched = injectVerticalAlignment(blocks, editor);
+      const patched = lowerFontSize(
+        injectTableBlockAttrs(
+          injectTableCellAttrs(blocks, editor, [
+            "verticalAlignment",
+            "rowHeight"
+          ]),
+          editor
+        )
+      );
       onContentChange(patched);
     };
     return editor.onEditorContentChange(handleContentChange);
   }, [editor, onContentChange]);
-  const previousMediaUrlsRef = (0, import_react30.useRef)(/* @__PURE__ */ new Set());
-  (0, import_react30.useEffect)(() => {
+  const previousMediaUrlsRef = (0, import_react37.useRef)(/* @__PURE__ */ new Set());
+  (0, import_react37.useEffect)(() => {
     if (!editor) return;
     const initialBlocks = editor.topLevelBlocks;
     previousMediaUrlsRef.current = extractMediaUrls(initialBlocks);
   }, [editor]);
-  (0, import_react30.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     if (!editor || !onImageDelete) return;
     const handleMediaDeleteCheck = () => {
       const currentBlocks = editor.topLevelBlocks;
@@ -4828,7 +6303,7 @@ function LumirEditor({
     };
     return editor.onEditorContentChange(handleMediaDeleteCheck);
   }, [editor, onImageDelete]);
-  (0, import_react30.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     const el = editor?.domElement;
     if (!el) return;
     const handleDragOver = (e) => {
@@ -4959,20 +6434,20 @@ function LumirEditor({
       el.removeEventListener("drop", handleDrop, { capture: true });
     };
   }, [editor, allowVideoUpload]);
-  const computedSideMenu = (0, import_react30.useMemo)(() => {
+  const computedSideMenu = (0, import_react37.useMemo)(() => {
     return sideMenuAddButton ? sideMenu : false;
   }, [sideMenuAddButton, sideMenu]);
-  const DragHandleOnlySideMenu = (0, import_react30.useMemo)(() => {
-    return (props) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react31.SideMenu, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react31.DragHandleButton, { ...props }) });
+  const DragHandleOnlySideMenu = (0, import_react37.useMemo)(() => {
+    return (props) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react38.SideMenu, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react38.DragHandleButton, { ...props, dragHandleMenu: LumirDragHandleMenu }) });
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
     "div",
     {
       className: cn("lumirEditor", className),
       style: { position: "relative", display: "flex", flexDirection: "column" },
       children: [
-        floatingMenu && editor && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        floatingMenu && editor && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
             "input",
             {
               ref: floatingMenuFileInputRef,
@@ -5043,7 +6518,7 @@ function LumirEditor({
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
             FloatingMenu,
             {
               editor,
@@ -5075,7 +6550,7 @@ function LumirEditor({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
           import_mantine.BlockNoteView,
           {
             editor,
@@ -5090,21 +6565,21 @@ function LumirEditor({
             tableHandles: false,
             onSelectionChange,
             children: [
-              tableHandles && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LumirTableHandlesController, {}),
-              formattingToolbar && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-                import_react31.FormattingToolbarController,
+              tableHandles && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(LumirTableHandlesController, {}),
+              formattingToolbar && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                import_react38.FormattingToolbarController,
                 {
                   formattingToolbar: CustomFormattingToolbar
                 }
               ),
-              linkToolbar && (linkPreview?.apiEndpoint ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react31.LinkToolbarController, { linkToolbar: CustomLinkToolbar }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react31.LinkToolbarController, {})),
-              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-                import_react31.SuggestionMenuController,
+              linkToolbar && (linkPreview?.apiEndpoint ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react38.LinkToolbarController, { linkToolbar: CustomLinkToolbar }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react38.LinkToolbarController, {})),
+              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                import_react38.SuggestionMenuController,
                 {
                   triggerCharacter: "/",
-                  getItems: (0, import_react30.useCallback)(
+                  getItems: (0, import_react37.useCallback)(
                     async (query) => {
-                      const items = (0, import_react31.getDefaultReactSlashMenuItems)(editor);
+                      const items = (0, import_react38.getDefaultReactSlashMenuItems)(editor);
                       const filtered = items.filter((item) => {
                         const key = (item?.key || "").toString().toLowerCase();
                         const title = (item?.title || "").toString().toLowerCase();
@@ -5146,7 +6621,7 @@ function LumirEditor({
                         },
                         aliases: ["html", "preview", "\uC6F9", "\uC6F9\uD398\uC774\uC9C0"],
                         group: "Embeds",
-                        icon: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+                        icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
                           "svg",
                           {
                             width: "18",
@@ -5158,19 +6633,45 @@ function LumirEditor({
                             strokeLinecap: "round",
                             strokeLinejoin: "round",
                             children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("polyline", { points: "16 18 22 12 16 6" }),
-                              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("polyline", { points: "8 6 2 12 8 18" })
+                              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("polyline", { points: "16 18 22 12 16 6" }),
+                              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("polyline", { points: "8 6 2 12 8 18" })
                             ]
                           }
                         ),
                         subtext: "HTML \uD30C\uC77C\uC744 \uBBF8\uB9AC\uBCF4\uAE30\uB85C \uC0BD\uC785"
                       };
-                      const allItems = [...filtered, htmlPreviewItem];
+                      const columnItem = {
+                        title: "2\uB2E8 \uCEEC\uB7FC",
+                        onItemClick: () => {
+                          insertTwoColumns(editor);
+                        },
+                        aliases: ["columns", "column", "2col", "\uB2E8", "\uCEEC\uB7FC", "\uB2E4\uB2E8", "\uBD84\uD560"],
+                        group: "Basic blocks",
+                        icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+                          "svg",
+                          {
+                            width: "18",
+                            height: "18",
+                            viewBox: "0 0 24 24",
+                            fill: "none",
+                            stroke: "currentColor",
+                            strokeWidth: "2",
+                            strokeLinecap: "round",
+                            strokeLinejoin: "round",
+                            children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("rect", { x: "3", y: "4", width: "7", height: "16", rx: "1" }),
+                              /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("rect", { x: "14", y: "4", width: "7", height: "16", rx: "1" })
+                            ]
+                          }
+                        ),
+                        subtext: "\uBE14\uB85D\uC744 \uC88C\uC6B0 2\uB2E8\uC73C\uB85C \uBC30\uCE58"
+                      };
+                      const allItems = [...filtered, htmlPreviewItem, columnItem];
                       if (linkPreview?.apiEndpoint) {
                         allItems.push({
                           title: "Link Preview",
                           onItemClick: () => {
-                            (0, import_core5.insertOrUpdateBlock)(editor, {
+                            (0, import_core9.insertOrUpdateBlock)(editor, {
                               type: "linkPreview",
                               props: { url: "" }
                             });
@@ -5184,7 +6685,7 @@ function LumirEditor({
                             "\uD504\uB9AC\uBDF0"
                           ],
                           group: "Embeds",
-                          icon: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+                          icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
                             "svg",
                             {
                               width: "18",
@@ -5196,8 +6697,8 @@ function LumirEditor({
                               strokeLinecap: "round",
                               strokeLinejoin: "round",
                               children: [
-                                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }),
-                                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" })
+                                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }),
+                                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" })
                               ]
                             }
                           ),
@@ -5233,21 +6734,21 @@ function LumirEditor({
                   )
                 }
               ),
-              !sideMenuAddButton && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react31.SideMenuController, { sideMenu: DragHandleOnlySideMenu })
+              !sideMenuAddButton && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react38.SideMenuController, { sideMenu: DragHandleOnlySideMenu })
             ]
           }
         ),
-        isUploading && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "lumirEditor-upload-overlay", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "lumirEditor-spinner" }),
-          uploadProgress !== null && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { className: "lumirEditor-upload-progress", children: [
+        isUploading && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "lumirEditor-upload-overlay", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "lumirEditor-spinner" }),
+          uploadProgress !== null && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("span", { className: "lumirEditor-upload-progress", children: [
             uploadProgress,
             "%"
           ] })
         ] }),
-        errorMessage && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "lumirEditor-error-toast", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "lumirEditor-error-icon", children: "\u26A0\uFE0F" }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "lumirEditor-error-message", children: errorMessage }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        errorMessage && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "lumirEditor-error-toast", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "lumirEditor-error-icon", children: "\u26A0\uFE0F" }),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "lumirEditor-error-message", children: errorMessage }),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
             "button",
             {
               className: "lumirEditor-error-close",
@@ -5266,7 +6767,10 @@ function LumirEditor({
   BACKGROUND_COLORS,
   ContentUtils,
   EditorConfig,
+  FONT_SIZE_PRESETS,
   FloatingMenu,
+  FontSize,
+  FontSizeButton,
   HtmlPreviewBlock,
   HtmlPreviewSchema,
   LinkPreviewBlock,
@@ -5277,6 +6781,8 @@ function LumirEditor({
   cn,
   createS3Uploader,
   fetchLinkMetadata,
-  getHexFromColorValue
+  getHexFromColorValue,
+  liftFontSize,
+  lowerFontSize
 });
 //# sourceMappingURL=index.js.map