@lumir-company/editor 0.4.16 → 0.4.17

package/dist/index.js

@@ -45,10 +45,10 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/components/LumirEditor.tsx
-var import_react34 = require("react");
-var import_react35 = 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
@@ -286,7 +286,7 @@ var createS3Uploader = (config) => {
 
 // src/blocks/HtmlPreview.tsx
 var import_react6 = require("@blocknote/react");
-var import_core = require("@blocknote/core");
+var import_core3 = require("@blocknote/core");
 
 // src/blocks/LinkPreview.tsx
 var import_react = require("@blocknote/react");
@@ -1246,6 +1246,310 @@ var VideoBlock = (0, import_react3.createReactBlockSpec)(
   }
 );
 
+// 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");
@@ -1351,7 +1655,7 @@ var HtmlPreviewBlock = (0, import_react6.createReactBlockSpec)(
           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,
@@ -1363,10 +1667,10 @@ var HtmlPreviewBlock = (0, import_react6.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]
@@ -1632,16 +1936,23 @@ var HtmlPreviewBlock = (0, import_react6.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,
+  inlineContentSpecs: import_core3.defaultInlineContentSpecs,
   styleSpecs: {
-    ...import_core.defaultStyleSpecs,
+    ...import_core3.defaultStyleSpecs,
     // 인라인 글자 크기. 저장 JSON 직렬화는 형제 키 방식(font-size-serialization.ts) 사용.
     fontSize: FontSize
   }
@@ -1785,7 +2096,7 @@ var UndoRedoButtons = ({ editor }) => {
       console.error("Redo failed:", err);
     }
   }, [editor]);
-  const handleMouseDown = (0, import_react8.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react8.useCallback)((e) => {
     e.preventDefault();
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "lumir-toolbar-group", children: [
@@ -1794,7 +2105,7 @@ var UndoRedoButtons = ({ editor }) => {
       {
         className: "lumir-toolbar-btn",
         onClick: handleUndo,
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: "\uC2E4\uD589 \uCDE8\uC18C",
         type: "button",
         children: Icons.undo
@@ -1805,7 +2116,7 @@ var UndoRedoButtons = ({ editor }) => {
       {
         className: "lumir-toolbar-btn",
         onClick: handleRedo,
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: "\uB2E4\uC2DC \uC2E4\uD589",
         type: "button",
         children: Icons.redo
@@ -1849,7 +2160,7 @@ var TextStyleButton = ({
       console.error(`Toggle ${style} failed:`, err);
     }
   }, [editor, style]);
-  const handleMouseDown = (0, import_react9.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react9.useCallback)((e) => {
     e.preventDefault();
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
@@ -1857,7 +2168,7 @@ var TextStyleButton = ({
     {
       className: cn("lumir-toolbar-btn", isActive && "is-active"),
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: titleMap[style],
       type: "button",
       children: iconMap[style]
@@ -1925,6 +2236,41 @@ 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_runtime9 = require("react/jsx-runtime");
@@ -1967,7 +2313,7 @@ var AlignButton = ({
       console.error(`Set alignment ${alignment} failed:`, err);
     }
   }, [editor, alignment]);
-  const handleMouseDown = (0, import_react10.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react10.useCallback)((e) => {
     e.preventDefault();
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
@@ -1975,7 +2321,7 @@ var AlignButton = ({
     {
       className: cn("lumir-toolbar-btn", isActive && "is-active"),
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: titleMap2[alignment],
       type: "button",
       children: iconMap2[alignment]
@@ -2017,7 +2363,7 @@ var ListButton = ({ editor, type }) => {
       console.error(`List toggle failed:`, err);
     }
   }, [editor, type]);
-  const handleMouseDown = (0, import_react11.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react11.useCallback)((e) => {
     e.preventDefault();
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
@@ -2025,7 +2371,7 @@ var ListButton = ({ editor, type }) => {
     {
       className: cn("lumir-toolbar-btn", isActive && "is-active"),
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: titleMap3[type],
       type: "button",
       children: iconMap3[type]
@@ -2065,7 +2411,7 @@ var ImageButton = ({
       input.click();
     }
   }, [editor, onImageUpload]);
-  const handleMouseDown = (0, import_react12.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react12.useCallback)((e) => {
     e.preventDefault();
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
@@ -2073,7 +2419,7 @@ var ImageButton = ({
     {
       className: "lumir-toolbar-btn",
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: "\uC774\uBBF8\uC9C0 \uC0BD\uC785",
       type: "button",
       children: Icons.image
@@ -2172,7 +2518,7 @@ var ColorButton = ({ editor, type }) => {
     },
     [editor, type]
   );
-  const handleMouseDown = (0, import_react13.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react13.useCallback)((e) => {
     e.preventDefault();
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
@@ -2181,7 +2527,7 @@ var ColorButton = ({ editor, type }) => {
       {
         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: [
@@ -2206,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"
@@ -2258,7 +2604,7 @@ var FontSizeButton = ({ editor }) => {
     },
     [editor]
   );
-  const handleMouseDown = (0, import_react14.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react14.useCallback)((e) => {
     e.preventDefault();
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
@@ -2267,7 +2613,7 @@ var FontSizeButton = ({ editor }) => {
       {
         className: "lumir-dropdown-btn lumir-font-size-btn",
         onClick: () => setIsOpen(!isOpen),
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: "\uAE00\uC790 \uD06C\uAE30",
         type: "button",
         children: [
@@ -2285,7 +2631,7 @@ var FontSizeButton = ({ editor }) => {
             currentSize === "" && "is-active"
           ),
           onClick: () => handleSizeSelect(""),
-          onMouseDown: handleMouseDown,
+          onMouseDown: handleMouseDown2,
           type: "button",
           children: DEFAULT_LABEL
         }
@@ -2298,7 +2644,7 @@ var FontSizeButton = ({ editor }) => {
             currentSize === size && "is-active"
           ),
           onClick: () => handleSizeSelect(size),
-          onMouseDown: handleMouseDown,
+          onMouseDown: handleMouseDown2,
           type: "button",
           children: toLabel(size)
         },
@@ -2396,7 +2742,7 @@ var LinkButton = ({ editor }) => {
     setLinkUrl("");
     setErrorMsg(null);
   }, []);
-  const handleMouseDown = (0, import_react15.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react15.useCallback)((e) => {
     e.preventDefault();
   }, []);
   const handleKeyDown = (0, import_react15.useCallback)(
@@ -2415,7 +2761,7 @@ var LinkButton = ({ editor }) => {
       {
         className: "lumir-toolbar-btn",
         onClick: () => setIsOpen(!isOpen),
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: "\uB9C1\uD06C \uC0BD\uC785",
         type: "button",
         children: Icons.link
@@ -2435,7 +2781,7 @@ var LinkButton = ({ editor }) => {
             setErrorMsg(null);
           },
           onKeyDown: handleKeyDown,
-          onMouseDown: handleMouseDown
+          onMouseDown: handleMouseDown2
         }
       ),
       errorMsg && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
@@ -2457,7 +2803,7 @@ var LinkButton = ({ editor }) => {
             type: "button",
             className: "lumir-link-btn lumir-link-cancel",
             onClick: handleCancel,
-            onMouseDown: handleMouseDown,
+            onMouseDown: handleMouseDown2,
             children: "\uCDE8\uC18C"
           }
         ),
@@ -2466,7 +2812,7 @@ var LinkButton = ({ editor }) => {
           {
             type: "submit",
             className: "lumir-link-btn lumir-link-submit",
-            onMouseDown: handleMouseDown,
+            onMouseDown: handleMouseDown2,
             disabled: !linkUrl.trim(),
             children: "\uD655\uC778"
           }
@@ -2502,7 +2848,7 @@ var TableButton = ({ editor }) => {
       console.error("Table insert failed:", err);
     }
   }, [editor]);
-  const handleMouseDown = (0, import_react16.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react16.useCallback)((e) => {
     e.preventDefault();
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
@@ -2510,7 +2856,7 @@ var TableButton = ({ editor }) => {
     {
       className: "lumir-toolbar-btn",
       onClick: handleClick,
-      onMouseDown: handleMouseDown,
+      onMouseDown: handleMouseDown2,
       title: "\uD14C\uC774\uBE14 \uC0BD\uC785",
       type: "button",
       children: Icons.table
@@ -2564,7 +2910,7 @@ var HTMLImportButton = ({
   const handleClick = (0, import_react17.useCallback)(() => {
     fileInputRef.current?.click();
   }, []);
-  const handleMouseDown = (0, import_react17.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react17.useCallback)((e) => {
     e.preventDefault();
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
@@ -2583,7 +2929,7 @@ var HTMLImportButton = ({
       {
         className: "lumir-toolbar-btn",
         onClick: handleClick,
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         title: "HTML Import",
         type: "button",
         children: Icons.htmlFile
@@ -2666,7 +3012,7 @@ var BlockTypeSelect = ({ editor }) => {
       console.error("Block type change failed:", err);
     }
   };
-  const handleMouseDown = (0, import_react18.useCallback)((e) => {
+  const handleMouseDown2 = (0, import_react18.useCallback)((e) => {
     e.preventDefault();
   }, []);
   const getCurrentLabel = () => {
@@ -2703,7 +3049,7 @@ var BlockTypeSelect = ({ editor }) => {
       {
         className: "lumir-dropdown-btn lumir-block-type-btn",
         onClick: () => setIsOpen(!isOpen),
-        onMouseDown: handleMouseDown,
+        onMouseDown: handleMouseDown2,
         type: "button",
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "lumir-block-icon", children: BlockTypeIcons[getCurrentIcon()] }),
@@ -2722,7 +3068,7 @@ var BlockTypeSelect = ({ editor }) => {
             isActiveItem(bt) && "is-active"
           ),
           onClick: () => handleTypeChange(bt.type, bt.level, bt.isToggle),
-          onMouseDown: handleMouseDown,
+          onMouseDown: handleMouseDown2,
           children: [
             /* @__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 })
@@ -3032,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 [
@@ -3063,11 +3409,585 @@ var VerticalAlignmentExtension = import_core2.Extension.create({
   }
 });
 
+// src/extensions/RowHeightExtension.ts
+var import_core5 = require("@tiptap/core");
+
+// 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_react28 = require("@blocknote/react");
+var import_react30 = require("@blocknote/react");
 
 // src/components/TextAlignButtonWithVA.tsx
-var import_core3 = require("@blocknote/core");
+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");
@@ -3089,7 +4009,7 @@ var TextAlignButtonWithVA = (props) => {
   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") {
@@ -3098,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
       );
@@ -3130,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 }
           });
@@ -3246,14 +4166,74 @@ var VerticalAlignButton = (props) => {
   );
 };
 
-// src/components/FontSizeButton.tsx
-var import_react24 = require("@blocknote/react");
-var import_react25 = require("react");
+// 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_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     "span",
     {
       style: {
@@ -3268,21 +4248,21 @@ function FontSizeIcon({ size }) {
   );
 }
 function FontSizeButton2() {
-  const Components = (0, import_react24.useComponentsContext)();
-  const editor = (0, import_react24.useBlockNoteEditor)();
+  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_react24.useSelectedBlocks)(editor);
-  const [currentSize, setCurrentSize] = (0, import_react25.useState)(
+  const selectedBlocks = (0, import_react26.useSelectedBlocks)(editor);
+  const [currentSize, setCurrentSize] = (0, import_react27.useState)(
     fontSizeInSchema ? ed.getActiveStyles().fontSize || "" : ""
   );
-  (0, import_react24.useEditorContentOrSelectionChange)(() => {
+  (0, import_react26.useEditorContentOrSelectionChange)(() => {
     if (fontSizeInSchema) {
       setCurrentSize(ed.getActiveStyles().fontSize || "");
     }
   }, editor);
-  const setFontSize = (0, import_react25.useCallback)(
+  const setFontSize = (0, import_react27.useCallback)(
     (size) => {
       size === "" ? ed.removeStyles({ fontSize: "" }) : ed.addStyles({ fontSize: size });
       setTimeout(() => editor.focus());
@@ -3290,7 +4270,7 @@ function FontSizeButton2() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [editor]
   );
-  const show = (0, import_react25.useMemo)(() => {
+  const show = (0, import_react27.useMemo)(() => {
     if (!fontSizeInSchema) {
       return false;
     }
@@ -3305,20 +4285,20 @@ function FontSizeButton2() {
     return null;
   }
   const tooltip = "\uAE00\uC790 \uD06C\uAE30";
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Components.Generic.Menu.Root, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  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_runtime21.jsx)(FontSizeIcon, { size: currentSize })
+        icon: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(FontSizeIcon, { size: currentSize })
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Components.Generic.Menu.Dropdown, { className: "bn-menu-dropdown", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Components.Generic.Menu.Label, { children: "\uAE00\uC790 \uD06C\uAE30" }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    /* @__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(""),
@@ -3328,7 +4308,7 @@ function FontSizeButton2() {
         },
         "font-size-default"
       ),
-      FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
         Components.Generic.Menu.Item,
         {
           onClick: () => setFontSize(size),
@@ -3343,10 +4323,10 @@ function FontSizeButton2() {
 }
 
 // src/components/color/LumirColorControls.tsx
-var import_core4 = require("@blocknote/core");
-var import_react26 = require("@blocknote/react");
-var import_react27 = require("react");
-var import_jsx_runtime22 = 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",
@@ -3363,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_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       className: "bn-color-icon",
@@ -3382,7 +4362,7 @@ function ColorIcon(props) {
   );
 }
 function CellFillIcon({ size = 18 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "svg",
     {
       width: size,
@@ -3391,17 +4371,17 @@ function CellFillIcon({ size = 18 }) {
       fill: "currentColor",
       style: { pointerEvents: "none" },
       "aria-hidden": "true",
-      children: /* @__PURE__ */ (0, import_jsx_runtime22.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_react26.useComponentsContext)();
-  const dict = (0, import_react26.useDictionary)();
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-    props.text ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Components.Generic.Menu.Label, { children: props.textTitle ?? dict.color_picker.text_title }),
-      COLORS.map((color) => /* @__PURE__ */ (0, import_jsx_runtime22.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: () => {
@@ -3409,16 +4389,16 @@ function LumirColorPicker(props) {
             props.text.setColor(color);
           },
           "data-test": "text-color-" + color,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime22.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_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Components.Generic.Menu.Label, { children: props.backgroundTitle ?? dict.color_picker.background_title }),
-      COLORS.map((color) => /* @__PURE__ */ (0, import_jsx_runtime22.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: () => {
@@ -3426,7 +4406,7 @@ function LumirColorPicker(props) {
             props.background.setColor(color);
           },
           "data-test": "background-color-" + color,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime22.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]
         },
@@ -3436,20 +4416,20 @@ function LumirColorPicker(props) {
   ] });
 }
 function LumirColorStyleButton() {
-  const Components = (0, import_react26.useComponentsContext)();
-  const editor = (0, import_react26.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_react26.useSelectedBlocks)(editor);
-  const [currentTextColor, setCurrentTextColor] = (0, import_react27.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_react27.useState)(
+  const [currentBackgroundColor, setCurrentBackgroundColor] = (0, import_react29.useState)(
     backgroundColorInSchema ? ed.getActiveStyles().backgroundColor || "default" : "default"
   );
-  (0, import_react26.useEditorContentOrSelectionChange)(() => {
+  (0, import_react28.useEditorContentOrSelectionChange)(() => {
     const active = ed.getActiveStyles();
     if (textColorInSchema) {
       setCurrentTextColor(active.textColor || "default");
@@ -3458,7 +4438,7 @@ function LumirColorStyleButton() {
       setCurrentBackgroundColor(active.backgroundColor || "default");
     }
   }, editor);
-  const setTextColor = (0, import_react27.useCallback)(
+  const setTextColor = (0, import_react29.useCallback)(
     (color) => {
       color === "default" ? ed.removeStyles({ textColor: color }) : ed.addStyles({ textColor: color });
       setTimeout(() => editor.focus());
@@ -3466,7 +4446,7 @@ function LumirColorStyleButton() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [editor]
   );
-  const setBackgroundColor = (0, import_react27.useCallback)(
+  const setBackgroundColor = (0, import_react29.useCallback)(
     (color) => {
       color === "default" ? ed.removeStyles({ backgroundColor: color }) : ed.addStyles({ backgroundColor: color });
       setTimeout(() => editor.focus());
@@ -3474,7 +4454,7 @@ function LumirColorStyleButton() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [editor]
   );
-  const show = (0, import_react27.useMemo)(() => {
+  const show = (0, import_react29.useMemo)(() => {
     if (!textColorInSchema && !backgroundColorInSchema) {
       return false;
     }
@@ -3489,15 +4469,15 @@ function LumirColorStyleButton() {
     return null;
   }
   const tooltip = "\uD14D\uC2A4\uD2B8 \uC0C9\xB7\uBC30\uACBD";
-  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)(
+  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_runtime22.jsx)(
+        icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           ColorIcon,
           {
             textColor: currentTextColor,
@@ -3507,11 +4487,11 @@ function LumirColorStyleButton() {
         )
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       Components.Generic.Menu.Dropdown,
       {
         className: "bn-menu-dropdown bn-color-picker-dropdown",
-        children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           LumirColorPicker,
           {
             textTitle: "\uD14D\uC2A4\uD2B8 \uC0C9",
@@ -3525,18 +4505,18 @@ function LumirColorStyleButton() {
   ] });
 }
 function LumirCellColorToolbarButton() {
-  const Components = (0, import_react26.useComponentsContext)();
-  const editor = (0, import_react26.useBlockNoteEditor)();
-  const selectedBlocks = (0, import_react26.useSelectedBlocks)(editor);
-  const isMultiCell = (0, import_react27.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_react27.useRef)([]);
-  const applyBackground = (0, import_react27.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;
@@ -3549,7 +4529,7 @@ function LumirCellColorToolbarButton() {
     return null;
   }
   const tooltip = "\uC140 \uBC30\uACBD\uC0C9";
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     Components.Generic.Menu.Root,
     {
       onOpenChange: (open) => {
@@ -3558,21 +4538,21 @@ function LumirCellColorToolbarButton() {
         }
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime22.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_runtime22.jsx)(CellFillIcon, { size: 18 })
+            icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CellFillIcon, { size: 18 })
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           Components.Generic.Menu.Dropdown,
           {
             className: "bn-menu-dropdown bn-color-picker-dropdown",
-            children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
               LumirColorPicker,
               {
                 backgroundTitle: "\uC140 \uBC30\uACBD",
@@ -3586,12 +4566,12 @@ function LumirCellColorToolbarButton() {
   );
 }
 function LumirCellColorPickerButton(props) {
-  const Components = (0, import_react26.useComponentsContext)();
-  const editor = (0, import_react26.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;
@@ -3608,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_runtime22.jsxs)(Components.Generic.Menu.Root, { position: "right", sub: true, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Components.Generic.Menu.Trigger, { sub: true, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Components.Generic.Menu.Item, { className: "bn-menu-item", subTrigger: true, children: "\uC140 \uC0C9\xB7\uBC30\uACBD" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.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_runtime22.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
           }
@@ -3636,21 +4616,21 @@ function LumirCellColorPickerButton(props) {
   ] });
 }
 function LumirTableCellMenu(props) {
-  const Components = (0, import_react26.useComponentsContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime22.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_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-          import_react26.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_runtime22.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           LumirCellColorPickerButton,
           {
             block: props.block,
@@ -3664,96 +4644,164 @@ function LumirTableCellMenu(props) {
 }
 
 // src/components/CustomFormattingToolbar.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var CustomFormattingToolbar = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react28.FormattingToolbar, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.BlockTypeSelect, {}, "blockTypeSelect"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.TableCellMergeButton, {}, "tableCellMergeButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.FileCaptionButton, {}, "fileCaptionButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.FileReplaceButton, {}, "replaceFileButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.FileRenameButton, {}, "fileRenameButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.FileDeleteButton, {}, "fileDeleteButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.FileDownloadButton, {}, "fileDownloadButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.FilePreviewButton, {}, "filePreviewButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.BasicTextStyleButton, { basicTextStyle: "bold" }, "boldStyleButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-      import_react28.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_runtime23.jsx)(
-      import_react28.BasicTextStyleButton,
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      import_react30.BasicTextStyleButton,
       {
         basicTextStyle: "underline"
       },
       "underlineStyleButton"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-      import_react28.BasicTextStyleButton,
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      import_react30.BasicTextStyleButton,
       {
         basicTextStyle: "strike"
       },
       "strikeStyleButton"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TextAlignButtonWithVA, { textAlignment: "left" }, "textAlignLeftButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.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_runtime23.jsx)(TextAlignButtonWithVA, { textAlignment: "right" }, "textAlignRightButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.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_runtime23.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       VerticalAlignButton,
       {
         verticalAlignment: "middle"
       },
       "verticalAlignMiddle"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       VerticalAlignButton,
       {
         verticalAlignment: "bottom"
       },
       "verticalAlignBottom"
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(FontSizeButton2, {}, "fontSizeButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(LumirColorStyleButton, {}, "colorStyleButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(LumirCellColorToolbarButton, {}, "cellColorButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.NestBlockButton, {}, "nestBlockButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.UnnestBlockButton, {}, "unnestBlockButton"),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react28.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/LumirTableHandlesController.tsx
+// src/components/LumirDragHandleMenu.tsx
 var import_react31 = require("@blocknote/react");
-var import_react32 = require("@floating-ui/react");
-var import_react33 = require("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_react34 = require("@blocknote/react");
+var import_react35 = require("@floating-ui/react");
+var import_react36 = require("react");
 
 // src/components/hooks/useFocusedCellHandlePositioning.ts
-var import_react29 = require("@floating-ui/react");
-var import_react30 = 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_react29.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_react29.offset)(-7)],
-    whileElementsMounted: import_react29.autoUpdate
+    middleware: [(0, import_react32.offset)(-7)],
+    whileElementsMounted: import_react32.autoUpdate
   });
-  const { isMounted, styles } = (0, import_react29.useTransitionStyles)(context);
-  (0, import_react30.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;
@@ -3773,7 +4821,7 @@ function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
       }
     });
   }, [cellEl, tbodyEl, orientation, refs]);
-  return (0, import_react30.useMemo)(
+  return (0, import_react33.useMemo)(
     () => ({
       isMounted,
       ref: refs.setFloating,
@@ -3788,7 +4836,7 @@ function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
 }
 
 // src/components/LumirTableHandlesController.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 function syncCoreHoverToFocusedCell(cellEl) {
   const r = cellEl.getBoundingClientRect();
   cellEl.dispatchEvent(
@@ -3802,15 +4850,15 @@ function syncCoreHoverToFocusedCell(cellEl) {
   );
 }
 function LumirTableHandlesController() {
-  const editor = (0, import_react31.useBlockNoteEditor)();
-  const [focused, setFocused] = (0, import_react33.useState)(null);
-  const [menuContainerRef, setMenuContainerRef] = (0, import_react33.useState)(null);
-  const [overlayEl, setOverlayEl] = (0, import_react33.useState)(null);
-  const [openMenu, setOpenMenu] = (0, import_react33.useState)(null);
-  const frozenRef = (0, import_react33.useRef)(false);
-  const menuOpenRef = (0, import_react33.useRef)(false);
-  const draggingRef = (0, import_react33.useRef)(false);
-  const recompute = (0, import_react33.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;
     }
@@ -3858,11 +4906,11 @@ function LumirTableHandlesController() {
       widgetContainer
     });
   }, [editor]);
-  (0, import_react31.useEditorContentOrSelectionChange)(recompute, editor);
-  (0, import_react33.useEffect)(() => {
+  (0, import_react34.useEditorContentOrSelectionChange)(recompute, editor);
+  (0, import_react36.useEffect)(() => {
     recompute();
   }, [recompute]);
-  (0, import_react33.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     const onUp = () => {
       requestAnimationFrame(() => {
         if (!menuOpenRef.current && !draggingRef.current && frozenRef.current) {
@@ -3874,7 +4922,7 @@ function LumirTableHandlesController() {
     window.addEventListener("pointerup", onUp);
     return () => window.removeEventListener("pointerup", onUp);
   }, [recompute]);
-  (0, import_react33.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     const f = focused;
     if (!f || !overlayEl) {
       return;
@@ -3899,7 +4947,13 @@ function LumirTableHandlesController() {
       overlayEl.style.height = `${bottom - top}px`;
     };
     update();
-    return (0, import_react32.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;
@@ -3913,21 +4967,21 @@ function LumirTableHandlesController() {
     show
   );
   const th = editor.tableHandles;
-  const coreState = (0, import_react31.useUIPluginState)(
+  const coreState = (0, import_react34.useUIPluginState)(
     editor.tableHandles.onUpdate.bind(editor.tableHandles)
   );
-  const { addOrRemoveColumnsButton, addOrRemoveRowsButton } = (0, import_react31.useExtendButtonsPositioning)(
+  const { addOrRemoveColumnsButton, addOrRemoveRowsButton } = (0, import_react34.useExtendButtonsPositioning)(
     coreState?.showAddOrRemoveColumnsButton || false,
     coreState?.showAddOrRemoveRowsButton || false,
     coreState?.referencePosTable || null
   );
-  const onStartExtend = (0, import_react33.useCallback)(() => {
+  const onStartExtend = (0, import_react36.useCallback)(() => {
     editor.tableHandles?.freezeHandles();
   }, [editor]);
-  const onEndExtend = (0, import_react33.useCallback)(() => {
+  const onEndExtend = (0, import_react36.useCallback)(() => {
     editor.tableHandles?.unfreezeHandles();
   }, [editor]);
-  const menuHandlers = (0, import_react33.useMemo)(() => {
+  const menuHandlers = (0, import_react36.useMemo)(() => {
     const mk = (kind) => ({
       freeze: () => {
         menuOpenRef.current = true;
@@ -3945,10 +4999,10 @@ function LumirTableHandlesController() {
     });
     return { col: mk("col"), row: mk("row"), cell: mk("cell") };
   }, [editor, recompute]);
-  const onGutterPointerDown = (0, import_react33.useCallback)(() => {
+  const onGutterPointerDown = (0, import_react36.useCallback)(() => {
     frozenRef.current = true;
   }, []);
-  const onGutterPointerEnter = (0, import_react33.useCallback)(
+  const onGutterPointerEnter = (0, import_react36.useCallback)(
     (e) => {
       if (e.buttons === 0 && focused) {
         syncCoreHoverToFocusedCell(focused.cellEl);
@@ -3956,7 +5010,7 @@ function LumirTableHandlesController() {
     },
     [focused]
   );
-  const makeDragStart = (0, import_react33.useCallback)(
+  const makeDragStart = (0, import_react36.useCallback)(
     (dir) => (e) => {
       draggingRef.current = true;
       frozenRef.current = true;
@@ -3968,19 +5022,19 @@ function LumirTableHandlesController() {
     },
     [editor]
   );
-  const onDragEnd = (0, import_react33.useCallback)(() => {
+  const onDragEnd = (0, import_react36.useCallback)(() => {
     editor.tableHandles?.dragEnd();
     draggingRef.current = false;
     frozenRef.current = false;
     recompute();
   }, [editor, recompute]);
-  const noop = (0, import_react33.useCallback)(() => {
+  const noop = (0, import_react36.useCallback)(() => {
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { ref: setMenuContainerRef }),
-    th && focused && menuContainerRef && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react32.FloatingPortal, { root: focused.widgetContainer, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { ref: setOverlayEl, className: "lumir-tbl-cell-focus" }),
-      colHandle.isMounted && /* @__PURE__ */ (0, import_jsx_runtime24.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,
@@ -3989,9 +5043,9 @@ function LumirTableHandlesController() {
           onPointerEnter: onGutterPointerEnter,
           onPointerDown: onGutterPointerDown,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "lumir-tbl-gutter" }),
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-              import_react31.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",
@@ -4009,7 +5063,7 @@ function LumirTableHandlesController() {
           ]
         }
       ),
-      rowHandle.isMounted && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+      rowHandle.isMounted && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
         "div",
         {
           ref: rowHandle.ref,
@@ -4018,9 +5072,9 @@ function LumirTableHandlesController() {
           onPointerEnter: onGutterPointerEnter,
           onPointerDown: onGutterPointerDown,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "lumir-tbl-gutter" }),
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-              import_react31.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",
@@ -4038,7 +5092,7 @@ function LumirTableHandlesController() {
           ]
         }
       ),
-      cellHandle.isMounted && openMenu !== "col" && openMenu !== "row" && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+      cellHandle.isMounted && openMenu !== "col" && openMenu !== "row" && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
         "div",
         {
           ref: cellHandle.ref,
@@ -4046,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_runtime24.jsx)("span", { className: "lumir-tbl-gutter" }),
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-              import_react31.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,
@@ -4064,9 +5118,9 @@ function LumirTableHandlesController() {
         }
       )
     ] }),
-    th && coreState?.widgetContainer && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react32.FloatingPortal, { root: coreState.widgetContainer, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { ref: addOrRemoveRowsButton.ref, style: addOrRemoveRowsButton.style, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-        import_react31.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",
@@ -4075,13 +5129,13 @@ function LumirTableHandlesController() {
           onMouseUp: onEndExtend
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         "div",
         {
           ref: addOrRemoveColumnsButton.ref,
           style: addOrRemoveColumnsButton.style,
-          children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-            import_react31.ExtendButton,
+          children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+            import_react34.ExtendButton,
             {
               editor,
               orientation: "addOrRemoveColumns",
@@ -4097,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") {
@@ -4118,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++;
             });
@@ -4136,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;
     }
@@ -4160,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;
@@ -4177,6 +5244,77 @@ 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) {
@@ -4491,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_runtime25 = 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",
@@ -4741,9 +5861,9 @@ var findBlockWithLink = (blocks, targetUrl) => {
   return null;
 };
 var ConvertToPreviewButton = ({ url }) => {
-  const editor = (0, import_react35.useBlockNoteEditor)();
-  const Components = (0, import_react35.useComponentsContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime25.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",
@@ -4762,29 +5882,29 @@ var ConvertToPreviewButton = ({ url }) => {
           console.error("Convert to link preview failed:", err);
         }
       },
-      icon: /* @__PURE__ */ (0, import_jsx_runtime25.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_runtime25.jsx)("rect", { x: "1", y: "3", width: "14", height: "10", rx: "2", stroke: "currentColor", strokeWidth: "1.5", fill: "none" }),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("line", { x1: "1", y1: "9", x2: "15", y2: "9", stroke: "currentColor", strokeWidth: "1.5" }),
-        /* @__PURE__ */ (0, import_jsx_runtime25.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_react35.useBlockNoteEditor)();
-  const Components = (0, import_react35.useComponentsContext)();
+  const editor = (0, import_react38.useBlockNoteEditor)();
+  const Components = (0, import_react38.useComponentsContext)();
   const hasLinkPreview = !!editor?._linkPreviewApiEndpoint;
-  return /* @__PURE__ */ (0, import_jsx_runtime25.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_runtime25.jsx)(import_react35.EditLinkButton, { url: props.url, text: props.text, editLink: props.editLink }),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react35.OpenLinkButton, { url: props.url }),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react35.DeleteLinkButton, { deleteLink: props.deleteLink }),
-        hasLinkPreview && /* @__PURE__ */ (0, import_jsx_runtime25.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 })
       ]
     }
   );
@@ -4828,13 +5948,13 @@ function LumirEditor({
   onError,
   onImageDelete
 }) {
-  const [isUploading, setIsUploading] = (0, import_react34.useState)(false);
-  const [uploadProgress, setUploadProgress] = (0, import_react34.useState)(null);
-  const [errorMessage, setErrorMessage] = (0, import_react34.useState)(null);
-  const floatingMenuFileInputRef = (0, import_react34.useRef)(null);
-  const floatingMenuBlockRef = (0, import_react34.useRef)(null);
-  const floatingMenuUploadStartTimeRef = (0, import_react34.useRef)(0);
-  const handleError = (0, import_react34.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());
@@ -4842,12 +5962,12 @@ function LumirEditor({
     },
     [onError]
   );
-  const validatedContent = (0, import_react34.useMemo)(() => {
+  const validatedContent = (0, import_react37.useMemo)(() => {
     return liftFontSize(
       ContentUtils.validateContent(initialContent, initialEmptyBlocks)
     );
   }, [initialContent, initialEmptyBlocks]);
-  const tableConfig = (0, import_react34.useMemo)(() => {
+  const tableConfig = (0, import_react37.useMemo)(() => {
     return EditorConfig.getDefaultTableConfig(tables);
   }, [
     tables?.splitCells,
@@ -4855,10 +5975,10 @@ function LumirEditor({
     tables?.cellTextColor,
     tables?.headers
   ]);
-  const headingConfig = (0, import_react34.useMemo)(() => {
+  const headingConfig = (0, import_react37.useMemo)(() => {
     return EditorConfig.getDefaultHeadingConfig(heading);
   }, [heading?.levels?.join(",") ?? ""]);
-  const disabledExtensions = (0, import_react34.useMemo)(() => {
+  const disabledExtensions = (0, import_react37.useMemo)(() => {
     return EditorConfig.getDisabledExtensions(
       disableExtensions,
       allowVideoUpload,
@@ -4866,18 +5986,18 @@ function LumirEditor({
       allowFileUpload
     );
   }, [disableExtensions, allowVideoUpload, allowAudioUpload, allowFileUpload]);
-  (0, import_react34.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_react34.useRef)(s3Upload?.fileNameTransform);
-  (0, import_react34.useEffect)(() => {
+  const fileNameTransformRef = (0, import_react37.useRef)(s3Upload?.fileNameTransform);
+  (0, import_react37.useEffect)(() => {
     fileNameTransformRef.current = s3Upload?.fileNameTransform;
   }, [s3Upload?.fileNameTransform]);
-  const memoizedS3Upload = (0, import_react34.useMemo)(() => {
+  const memoizedS3Upload = (0, import_react37.useMemo)(() => {
     if (!s3Upload) return void 0;
     return {
       apiEndpoint: s3Upload.apiEndpoint,
@@ -4906,7 +6026,7 @@ function LumirEditor({
     s3Upload?.maxRetries,
     s3Upload?.onProgress
   ]);
-  const editor = (0, import_react35.useCreateBlockNote)(
+  const editor = (0, import_react38.useCreateBlockNote)(
     {
       // HTML 미리보기 블록이 포함된 커스텀 스키마 사용
       schema,
@@ -4928,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,
@@ -5104,18 +6231,29 @@ function LumirEditor({
       memoizedS3Upload,
       allowVideoUpload,
       linkPreview?.apiEndpoint,
-      placeholder
+      placeholder,
+      // tableHandles 변경 시 RowHeightExtension의 resizable 게이트가 반영되도록 재생성
+      tableHandles
     ]
   );
   if (editor && linkPreview?.apiEndpoint) {
     editor._linkPreviewApiEndpoint = linkPreview.apiEndpoint;
   }
-  (0, import_react34.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_react34.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     if (!editor || !floatingMenu) return;
     const ft = editor.formattingToolbar;
     if (!ft?.onUpdate) return;
@@ -5128,22 +6266,30 @@ function LumirEditor({
     });
     return unsubscribe;
   }, [editor, floatingMenu]);
-  (0, import_react34.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     if (!editor || !onContentChange) return;
     const handleContentChange = () => {
       const blocks = editor.topLevelBlocks;
-      const patched = lowerFontSize(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_react34.useRef)(/* @__PURE__ */ new Set());
-  (0, import_react34.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_react34.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     if (!editor || !onImageDelete) return;
     const handleMediaDeleteCheck = () => {
       const currentBlocks = editor.topLevelBlocks;
@@ -5157,7 +6303,7 @@ function LumirEditor({
     };
     return editor.onEditorContentChange(handleMediaDeleteCheck);
   }, [editor, onImageDelete]);
-  (0, import_react34.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     const el = editor?.domElement;
     if (!el) return;
     const handleDragOver = (e) => {
@@ -5288,20 +6434,20 @@ function LumirEditor({
       el.removeEventListener("drop", handleDrop, { capture: true });
     };
   }, [editor, allowVideoUpload]);
-  const computedSideMenu = (0, import_react34.useMemo)(() => {
+  const computedSideMenu = (0, import_react37.useMemo)(() => {
     return sideMenuAddButton ? sideMenu : false;
   }, [sideMenuAddButton, sideMenu]);
-  const DragHandleOnlySideMenu = (0, import_react34.useMemo)(() => {
-    return (props) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react35.SideMenu, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react35.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_runtime25.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_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        floatingMenu && editor && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
             "input",
             {
               ref: floatingMenuFileInputRef,
@@ -5372,7 +6518,7 @@ function LumirEditor({
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
             FloatingMenu,
             {
               editor,
@@ -5404,7 +6550,7 @@ function LumirEditor({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
           import_mantine.BlockNoteView,
           {
             editor,
@@ -5419,21 +6565,21 @@ function LumirEditor({
             tableHandles: false,
             onSelectionChange,
             children: [
-              tableHandles && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(LumirTableHandlesController, {}),
-              formattingToolbar && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-                import_react35.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_runtime25.jsx)(import_react35.LinkToolbarController, { linkToolbar: CustomLinkToolbar }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react35.LinkToolbarController, {})),
-              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-                import_react35.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_react34.useCallback)(
+                  getItems: (0, import_react37.useCallback)(
                     async (query) => {
-                      const items = (0, import_react35.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();
@@ -5475,7 +6621,7 @@ function LumirEditor({
                         },
                         aliases: ["html", "preview", "\uC6F9", "\uC6F9\uD398\uC774\uC9C0"],
                         group: "Embeds",
-                        icon: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+                        icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
                           "svg",
                           {
                             width: "18",
@@ -5487,19 +6633,45 @@ function LumirEditor({
                             strokeLinecap: "round",
                             strokeLinejoin: "round",
                             children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("polyline", { points: "16 18 22 12 16 6" }),
-                              /* @__PURE__ */ (0, import_jsx_runtime25.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: "" }
                             });
@@ -5513,7 +6685,7 @@ function LumirEditor({
                             "\uD504\uB9AC\uBDF0"
                           ],
                           group: "Embeds",
-                          icon: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+                          icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
                             "svg",
                             {
                               width: "18",
@@ -5525,8 +6697,8 @@ function LumirEditor({
                               strokeLinecap: "round",
                               strokeLinejoin: "round",
                               children: [
-                                /* @__PURE__ */ (0, import_jsx_runtime25.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_runtime25.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" })
                               ]
                             }
                           ),
@@ -5562,21 +6734,21 @@ function LumirEditor({
                   )
                 }
               ),
-              !sideMenuAddButton && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react35.SideMenuController, { sideMenu: DragHandleOnlySideMenu })
+              !sideMenuAddButton && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react38.SideMenuController, { sideMenu: DragHandleOnlySideMenu })
             ]
           }
         ),
-        isUploading && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "lumirEditor-upload-overlay", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "lumirEditor-spinner" }),
-          uploadProgress !== null && /* @__PURE__ */ (0, import_jsx_runtime25.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_runtime25.jsxs)("div", { className: "lumirEditor-error-toast", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "lumirEditor-error-icon", children: "\u26A0\uFE0F" }),
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "lumirEditor-error-message", children: errorMessage }),
-          /* @__PURE__ */ (0, import_jsx_runtime25.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",