@mhamz.01/easyflow-texteditor 0.1.76 → 0.1.77

package/dist/index.mjs

@@ -549,10 +549,10 @@ function EditorShell({ children }) {
 }
 
 // src/components/editorLayout/editorLayout.tsx
-import { useState as useState4, useEffect as useEffect2, useRef, useCallback as useCallback2 } from "react";
+import { useState as useState4, useEffect as useEffect2, useRef as useRef2, useCallback as useCallback3, useMemo as useMemo3 } from "react";
 
 // src/components/sidebar/EditorSidebar.tsx
-import { useState as useState3 } from "react";
+import { useState as useState3, memo, useCallback as useCallback2 } from "react";
 import { MoreHorizontal, Plus, FileText } from "lucide-react";
 import { motion, AnimatePresence } from "framer-motion";
 
@@ -624,19 +624,13 @@ var tabVariants = {
     opacity: 1,
     x: 0,
     height: "auto",
-    transition: {
-      duration: 0.3,
-      ease: "easeOut"
-    }
+    transition: { duration: 0.3, ease: "easeOut" }
   },
   exit: {
     opacity: 0,
     x: -20,
     height: 0,
-    transition: {
-      duration: 0.2,
-      ease: "easeIn"
-    }
+    transition: { duration: 0.2, ease: "easeIn" }
   }
 };
 var subtabVariants = {
@@ -645,279 +639,479 @@ var subtabVariants = {
     opacity: 1,
     x: 0,
     height: "auto",
-    transition: {
-      duration: 0.25,
-      ease: "easeOut"
-    }
+    transition: { duration: 0.25, ease: "easeOut" }
   },
   exit: {
     opacity: 0,
     x: -10,
     height: 0,
-    transition: {
-      duration: 0.15,
-      ease: "easeIn"
-    }
+    transition: { duration: 0.15, ease: "easeIn" }
   }
 };
-function AppSidebar({
-  tabs,
-  activeTabId,
-  activeSubTabId,
-  canDeleteTab,
-  onAddTab,
-  onAddSubTab,
+var SubTabTitle = memo(function SubTabTitle2({
+  isEditing,
+  title,
+  tempTitle,
+  onTitleChange,
+  onStartEdit,
+  onCommit,
+  onCancel,
   onSelect,
-  onRename,
-  onDelete,
-  onRenameSubTab,
-  onDeleteSubTab
+  tabId,
+  subTabId
 }) {
-  const [editingId, setEditingId] = useState3(null);
-  const [editingSubId, setEditingSubId] = useState3(null);
-  const [tempTitle, setTempTitle] = useState3("");
-  const [openTabs, setOpenTabs] = useState3({});
-  const startRenameTab = (id, title) => {
-    setEditingId(id);
-    setEditingSubId(null);
-    setTempTitle(title);
-  };
-  const startRenameSubTab = (id, title) => {
-    setEditingSubId(id);
-    setEditingId(null);
-    setTempTitle(title);
-  };
-  const commitRenameTab = () => {
-    if (!editingId) return;
-    onRename(editingId, tempTitle.trim() || "Untitled");
-    setEditingId(null);
-  };
-  const commitRenameSubTab = (tabId) => {
-    if (!editingSubId || !onRenameSubTab) return;
-    onRenameSubTab(tabId, editingSubId, tempTitle.trim() || "Untitled");
-    setEditingSubId(null);
-  };
-  const toggleTabOpen = (tabId) => {
-    setOpenTabs((prev) => ({
-      ...prev,
-      [tabId]: !prev[tabId]
-    }));
-  };
-  return /* @__PURE__ */ jsx9(Sidebar, { children: /* @__PURE__ */ jsx9(SidebarContent, { children: /* @__PURE__ */ jsxs5(SidebarGroup, { children: [
-    /* @__PURE__ */ jsxs5(SidebarGroupLabel, { className: "flex items-center justify-between", children: [
-      "Documents",
+  return isEditing ? /* @__PURE__ */ jsx9(
+    Input,
+    {
+      value: tempTitle,
+      autoFocus: true,
+      onChange: (e) => onTitleChange(e.target.value),
+      onBlur: onCommit,
+      onKeyDown: (e) => {
+        if (e.key === "Enter") onCommit();
+        if (e.key === "Escape") onCancel();
+      },
+      className: "h-6 transition-all duration-200"
+    }
+  ) : /* @__PURE__ */ jsx9(
+    "button",
+    {
+      className: "w-full truncate text-left transition-colors duration-200 hover:text-foreground",
+      onClick: onSelect,
+      onDoubleClick: onStartEdit,
+      children: title
+    }
+  );
+});
+var TabTitle = memo(function TabTitle2({
+  isEditing,
+  title,
+  tempTitle,
+  onTitleChange,
+  onStartEdit,
+  onCommit,
+  onCancel,
+  onSelect
+}) {
+  return isEditing ? /* @__PURE__ */ jsx9(
+    Input,
+    {
+      value: tempTitle,
+      autoFocus: true,
+      onChange: (e) => onTitleChange(e.target.value),
+      onBlur: onCommit,
+      onKeyDown: (e) => {
+        if (e.key === "Enter") onCommit();
+        if (e.key === "Escape") onCancel();
+      },
+      className: "h-7 transition-all duration-200"
+    }
+  ) : /* @__PURE__ */ jsx9(
+    "button",
+    {
+      className: "w-full truncate text-left text-sm transition-colors duration-200 hover:text-foreground",
+      onClick: onSelect,
+      onDoubleClick: onStartEdit,
+      children: title
+    }
+  );
+});
+var SubTabMenu = memo(function SubTabMenu2({
+  onDelete
+}) {
+  return /* @__PURE__ */ jsxs5(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx9(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx9(
+      "button",
+      {
+        className: "opacity-0 group-hover:opacity-100 rounded p-1 transition-all duration-200 hover:bg-accent/80",
+        "aria-label": "Subtab options",
+        children: /* @__PURE__ */ jsx9(MoreHorizontal, { size: 14 })
+      }
+    ) }),
+    /* @__PURE__ */ jsx9(DropdownMenuContent, { align: "end", className: "w-40", children: /* @__PURE__ */ jsx9(
+      DropdownMenuItem,
+      {
+        className: "text-red-500 cursor-pointer transition-colors duration-150 focus:text-red-600",
+        onClick: onDelete,
+        children: "Delete"
+      }
+    ) })
+  ] });
+});
+var TabMenu = memo(function TabMenu2({
+  canDelete,
+  onAddSubTab,
+  onDelete
+}) {
+  return /* @__PURE__ */ jsxs5(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx9(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx9(
+      "button",
+      {
+        className: "opacity-0 group-hover:opacity-100 rounded p-1 transition-all duration-200 hover:bg-accent/80",
+        "aria-label": "Tab options",
+        children: /* @__PURE__ */ jsx9(MoreHorizontal, { size: 14 })
+      }
+    ) }),
+    /* @__PURE__ */ jsxs5(DropdownMenuContent, { align: "end", className: "w-40", children: [
       /* @__PURE__ */ jsx9(
-        "button",
+        DropdownMenuItem,
         {
-          onClick: onAddTab,
-          className: "rounded p-1 transition-all duration-200 hover:bg-accent hover:scale-110",
-          "aria-label": "Add new document",
-          children: /* @__PURE__ */ jsx9(Plus, { size: 16 })
+          onClick: onAddSubTab,
+          className: "cursor-pointer transition-colors duration-150",
+          children: "Add subtab"
         }
-      )
-    ] }),
-    /* @__PURE__ */ jsx9(SidebarMenu, { children: /* @__PURE__ */ jsx9(AnimatePresence, { mode: "popLayout", children: tabs.map((tab) => {
-      const isOpen = openTabs[tab.id];
-      const hasSubtabs = tab.subtabs.length > 0;
-      const isActiveTab = tab.id === activeTabId && !activeSubTabId;
-      return /* @__PURE__ */ jsx9(
-        motion.div,
+      ),
+      canDelete && /* @__PURE__ */ jsx9(
+        DropdownMenuItem,
         {
-          variants: tabVariants,
-          initial: "initial",
-          animate: "animate",
-          exit: "exit",
-          layout: true,
-          children: /* @__PURE__ */ jsxs5(SidebarMenuItem, { className: "list-none", children: [
-            /* @__PURE__ */ jsxs5(
-              "div",
-              {
-                className: `
-                          group flex items-center gap-2 rounded-md px-2 py-1.5
-                          transition-all duration-200 ease-in-out
-                          ${isActiveTab ? "bg-accent" : "hover:bg-accent/50"}
-                        `,
-                children: [
-                  hasSubtabs && /* @__PURE__ */ jsx9(
-                    "button",
-                    {
-                      onClick: (e) => {
-                        e.stopPropagation();
-                        toggleTabOpen(tab.id);
-                      },
-                      className: "flex h-5 w-5 items-center justify-center rounded transition-all duration-200 hover:bg-accent/80",
-                      "aria-label": isOpen ? "Collapse subtabs" : "Expand subtabs",
-                      children: /* @__PURE__ */ jsx9(
-                        ChevronRight,
-                        {
-                          size: 14,
-                          className: `transition-transform duration-300 ease-in-out ${isOpen ? "rotate-90" : ""}`
-                        }
-                      )
-                    }
-                  ),
-                  /* @__PURE__ */ jsx9(
-                    FileText,
-                    {
-                      size: 16,
-                      className: `flex-shrink-0 transition-all duration-200 ${hasSubtabs ? "" : "ml-5"} ${isActiveTab ? "opacity-100" : "opacity-60 group-hover:opacity-100"}`
-                    }
-                  ),
-                  /* @__PURE__ */ jsx9("div", { className: "flex-1 min-w-0", children: editingId === tab.id ? /* @__PURE__ */ jsx9(
-                    Input,
-                    {
-                      value: tempTitle,
-                      autoFocus: true,
-                      onChange: (e) => setTempTitle(e.target.value),
-                      onBlur: commitRenameTab,
-                      onKeyDown: (e) => {
-                        if (e.key === "Enter") commitRenameTab();
-                        if (e.key === "Escape") setEditingId(null);
-                      },
-                      className: "h-7 transition-all duration-200"
-                    }
-                  ) : /* @__PURE__ */ jsx9(
-                    "button",
-                    {
-                      className: "w-full truncate text-left text-sm transition-colors duration-200",
-                      onClick: () => onSelect(tab.id),
-                      onDoubleClick: () => startRenameTab(tab.id, tab.title),
-                      children: tab.title
-                    }
-                  ) }),
-                  /* @__PURE__ */ jsxs5(DropdownMenu, { children: [
-                    /* @__PURE__ */ jsx9(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-                      "button",
+          className: "text-red-500 cursor-pointer transition-colors duration-150 focus:text-red-600",
+          onClick: onDelete,
+          children: "Delete"
+        }
+      )
+    ] })
+  ] });
+});
+var SubTabItem = memo(
+  function SubTabItem2({
+    tab,
+    st,
+    activeSubTabId,
+    editingSubId,
+    tempTitle,
+    onSelect,
+    startRenameSubTab,
+    commitRenameSubTab,
+    setEditingSubId,
+    setTempTitle,
+    onDeleteSubTab
+  }) {
+    const isActiveSubTab = st.id === activeSubTabId;
+    const isEditing = editingSubId === st.id;
+    const handleSelect = useCallback2(() => {
+      onSelect(tab.id, st.id);
+    }, [onSelect, tab.id, st.id]);
+    const handleEdit = useCallback2(() => {
+      startRenameSubTab(st.id, st.title);
+    }, [startRenameSubTab, st.id, st.title]);
+    const handleCommit = useCallback2(() => {
+      commitRenameSubTab(tab.id);
+    }, [commitRenameSubTab, tab.id]);
+    const handleDelete = useCallback2(() => {
+      onDeleteSubTab(tab.id, st.id);
+    }, [onDeleteSubTab, tab.id, st.id]);
+    const handleTitleChange = useCallback2(
+      (val) => {
+        setTempTitle(val);
+      },
+      [setTempTitle]
+    );
+    const handleCancel = useCallback2(() => {
+      setEditingSubId(null);
+    }, [setEditingSubId]);
+    return /* @__PURE__ */ jsxs5(
+      motion.div,
+      {
+        variants: subtabVariants,
+        initial: "initial",
+        animate: "animate",
+        exit: "exit",
+        layout: true,
+        className: `
+          group ml-9 flex items-center gap-2 rounded-md px-2 py-1.5 text-sm
+          transition-all duration-200 ease-in-out
+          ${isActiveSubTab ? "bg-accent" : "hover:bg-accent/50"}
+        `,
+        children: [
+          /* @__PURE__ */ jsx9(
+            FileText,
+            {
+              size: 14,
+              className: `flex-shrink-0 transition-all duration-200 ${isActiveSubTab ? "opacity-100" : "opacity-50 group-hover:opacity-100"}`
+            }
+          ),
+          /* @__PURE__ */ jsx9("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsx9(
+            SubTabTitle,
+            {
+              isEditing,
+              title: st.title,
+              tempTitle,
+              onTitleChange: handleTitleChange,
+              onStartEdit: handleEdit,
+              onCommit: handleCommit,
+              onCancel: handleCancel,
+              onSelect: handleSelect,
+              tabId: tab.id,
+              subTabId: st.id
+            }
+          ) }),
+          /* @__PURE__ */ jsx9(SubTabMenu, { onDelete: handleDelete })
+        ]
+      },
+      st.id
+    );
+  },
+  (prevProps, nextProps) => {
+    return prevProps.st.id === nextProps.st.id && prevProps.activeSubTabId === nextProps.activeSubTabId && prevProps.editingSubId === nextProps.editingSubId && prevProps.tempTitle === nextProps.tempTitle && prevProps.st.title === nextProps.st.title;
+  }
+);
+var TabItem = memo(
+  function TabItem2({
+    tab,
+    activeTabId,
+    activeSubTabId,
+    canDeleteTab,
+    editingId,
+    editingSubId,
+    tempTitle,
+    openTabs,
+    onSelect,
+    onAddSubTab,
+    onDelete,
+    startRenameTab,
+    startRenameSubTab,
+    commitRenameTab,
+    commitRenameSubTab,
+    setEditingId,
+    setEditingSubId,
+    setTempTitle,
+    toggleTabOpen,
+    onRenameSubTab,
+    onDeleteSubTab,
+    setOpenTabs
+  }) {
+    const isOpen = openTabs[tab.id];
+    const hasSubtabs = tab.subtabs.length > 0;
+    const isActiveTab = tab.id === activeTabId && !activeSubTabId;
+    const isEditing = editingId === tab.id;
+    const handleSelect = useCallback2(() => {
+      onSelect(tab.id);
+    }, [onSelect, tab.id]);
+    const handleEdit = useCallback2(() => {
+      startRenameTab(tab.id, tab.title);
+    }, [startRenameTab, tab.id, tab.title]);
+    const handleCommit = useCallback2(() => {
+      commitRenameTab();
+    }, [commitRenameTab]);
+    const handleTitleChange = useCallback2(
+      (val) => {
+        setTempTitle(val);
+      },
+      [setTempTitle]
+    );
+    const handleCancel = useCallback2(() => {
+      setEditingId(null);
+    }, [setEditingId]);
+    const handleAddSubTab = useCallback2(() => {
+      onAddSubTab(tab.id);
+      setOpenTabs((prev) => ({
+        ...prev,
+        [tab.id]: true
+      }));
+    }, [onAddSubTab, tab.id, setOpenTabs]);
+    const handleToggle = useCallback2(
+      (e) => {
+        e.stopPropagation();
+        toggleTabOpen(tab.id);
+      },
+      [toggleTabOpen, tab.id]
+    );
+    const handleDelete = useCallback2(() => {
+      onDelete(tab.id);
+    }, [onDelete, tab.id]);
+    return /* @__PURE__ */ jsx9(
+      motion.div,
+      {
+        variants: tabVariants,
+        initial: "initial",
+        animate: "animate",
+        exit: "exit",
+        layout: true,
+        children: /* @__PURE__ */ jsxs5(SidebarMenuItem, { className: "list-none", children: [
+          /* @__PURE__ */ jsxs5(
+            "div",
+            {
+              className: `
+              group flex items-center gap-2 rounded-md px-2 py-1.5
+              transition-all duration-200 ease-in-out
+              ${isActiveTab ? "bg-accent" : "hover:bg-accent/50"}
+            `,
+              children: [
+                hasSubtabs && /* @__PURE__ */ jsx9(
+                  "button",
+                  {
+                    onClick: handleToggle,
+                    className: "flex h-5 w-5 items-center justify-center rounded transition-all duration-200 hover:bg-accent/80",
+                    "aria-label": isOpen ? "Collapse subtabs" : "Expand subtabs",
+                    children: /* @__PURE__ */ jsx9(
+                      ChevronRight,
                       {
-                        className: "opacity-0 group-hover:opacity-100 rounded p-1 transition-all duration-200 hover:bg-accent/80",
-                        "aria-label": "Tab options",
-                        children: /* @__PURE__ */ jsx9(MoreHorizontal, { size: 14 })
+                        size: 14,
+                        className: `transition-transform duration-300 ease-in-out ${isOpen ? "rotate-90" : ""}`
                       }
-                    ) }),
-                    /* @__PURE__ */ jsxs5(DropdownMenuContent, { align: "end", className: "w-40", children: [
-                      /* @__PURE__ */ jsx9(
-                        DropdownMenuItem,
-                        {
-                          onClick: () => {
-                            onAddSubTab(tab.id);
-                            setOpenTabs((prev) => ({
-                              ...prev,
-                              [tab.id]: true
-                            }));
-                          },
-                          className: "cursor-pointer transition-colors duration-150",
-                          children: "Add subtab"
-                        }
-                      ),
-                      canDeleteTab && /* @__PURE__ */ jsx9(
-                        DropdownMenuItem,
-                        {
-                          className: "text-red-500 cursor-pointer transition-colors duration-150 focus:text-red-600",
-                          onClick: (e) => {
-                            e.stopPropagation();
-                            onDelete(tab.id);
-                          },
-                          children: "Delete"
-                        }
-                      )
-                    ] })
-                  ] })
-                ]
-              }
-            ),
-            hasSubtabs && /* @__PURE__ */ jsx9(
-              "div",
-              {
-                className: `
-                            grid transition-all duration-300 ease-in-out
-                            ${isOpen ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0"}
-                          `,
-                children: /* @__PURE__ */ jsx9("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx9("div", { className: "pt-1 space-y-1", children: /* @__PURE__ */ jsx9(AnimatePresence, { mode: "popLayout", children: tab.subtabs.map((st) => {
-                  const isActiveSubTab = st.id === activeSubTabId;
-                  return /* @__PURE__ */ jsxs5(
-                    motion.div,
-                    {
-                      variants: subtabVariants,
-                      initial: "initial",
-                      animate: "animate",
-                      exit: "exit",
-                      layout: true,
-                      className: `
-                                        group ml-9 flex items-center gap-2 rounded-md px-2 py-1.5 text-sm
-                                        transition-all duration-200 ease-in-out
-                                        ${isActiveSubTab ? "bg-accent" : "hover:bg-accent/50"}
-                                      `,
-                      children: [
-                        /* @__PURE__ */ jsx9(
-                          FileText,
-                          {
-                            size: 14,
-                            className: `flex-shrink-0 transition-all duration-200 ${isActiveSubTab ? "opacity-100" : "opacity-50 group-hover:opacity-100"}`
-                          }
-                        ),
-                        /* @__PURE__ */ jsx9("div", { className: "flex-1 min-w-0", children: editingSubId === st.id ? /* @__PURE__ */ jsx9(
-                          Input,
-                          {
-                            value: tempTitle,
-                            autoFocus: true,
-                            onChange: (e) => setTempTitle(e.target.value),
-                            onBlur: () => commitRenameSubTab(tab.id),
-                            onKeyDown: (e) => {
-                              if (e.key === "Enter")
-                                commitRenameSubTab(tab.id);
-                              if (e.key === "Escape")
-                                setEditingSubId(null);
-                            },
-                            className: "h-6 transition-all duration-200"
-                          }
-                        ) : /* @__PURE__ */ jsx9(
-                          "button",
-                          {
-                            className: "w-full truncate text-left transition-colors duration-200",
-                            onClick: () => onSelect(tab.id, st.id),
-                            onDoubleClick: () => startRenameSubTab(st.id, st.title),
-                            children: st.title
-                          }
-                        ) }),
-                        onDeleteSubTab && /* @__PURE__ */ jsxs5(DropdownMenu, { children: [
-                          /* @__PURE__ */ jsx9(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx9(
-                            "button",
-                            {
-                              className: "opacity-0 group-hover:opacity-100 rounded p-1 transition-all duration-200 hover:bg-accent/80",
-                              "aria-label": "Subtab options",
-                              children: /* @__PURE__ */ jsx9(MoreHorizontal, { size: 14 })
-                            }
-                          ) }),
-                          /* @__PURE__ */ jsx9(
-                            DropdownMenuContent,
-                            {
-                              align: "end",
-                              className: "w-40",
-                              children: /* @__PURE__ */ jsx9(
-                                DropdownMenuItem,
-                                {
-                                  className: "text-red-500 cursor-pointer transition-colors duration-150 focus:text-red-600",
-                                  onClick: () => onDeleteSubTab(tab.id, st.id),
-                                  children: "Delete"
-                                }
-                              )
-                            }
-                          )
-                        ] })
-                      ]
-                    },
-                    st.id
-                  );
-                }) }) }) })
-              }
-            )
-          ] })
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsx9(
+                  FileText,
+                  {
+                    size: 16,
+                    className: `flex-shrink-0 transition-all duration-200 ${hasSubtabs ? "" : "ml-5"} ${isActiveTab ? "opacity-100" : "opacity-60 group-hover:opacity-100"}`
+                  }
+                ),
+                /* @__PURE__ */ jsx9("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsx9(
+                  TabTitle,
+                  {
+                    isEditing,
+                    title: tab.title,
+                    tempTitle,
+                    onTitleChange: handleTitleChange,
+                    onStartEdit: handleEdit,
+                    onCommit: handleCommit,
+                    onCancel: handleCancel,
+                    onSelect: handleSelect
+                  }
+                ) }),
+                /* @__PURE__ */ jsx9(
+                  TabMenu,
+                  {
+                    canDelete: canDeleteTab,
+                    onAddSubTab: handleAddSubTab,
+                    onDelete: handleDelete
+                  }
+                )
+              ]
+            }
+          ),
+          hasSubtabs && /* @__PURE__ */ jsx9(
+            "div",
+            {
+              className: `
+                grid transition-all duration-300 ease-in-out
+                ${isOpen ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0"}
+              `,
+              children: /* @__PURE__ */ jsx9("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx9("div", { className: "pt-1 space-y-1", children: /* @__PURE__ */ jsx9(AnimatePresence, { mode: "popLayout", children: tab.subtabs.map((st) => /* @__PURE__ */ jsx9(
+                SubTabItem,
+                {
+                  tab,
+                  st,
+                  activeSubTabId,
+                  editingSubId,
+                  tempTitle,
+                  onSelect,
+                  startRenameSubTab,
+                  commitRenameSubTab,
+                  setEditingSubId,
+                  setTempTitle,
+                  onDeleteSubTab
+                },
+                st.id
+              )) }) }) })
+            }
+          )
+        ] })
+      },
+      tab.id
+    );
+  },
+  (prevProps, nextProps) => {
+    return prevProps.tab.id === nextProps.tab.id && prevProps.tab.title === nextProps.tab.title && prevProps.tab.subtabs.length === nextProps.tab.subtabs.length && prevProps.activeTabId === nextProps.activeTabId && prevProps.activeSubTabId === nextProps.activeSubTabId && prevProps.editingId === nextProps.editingId && prevProps.editingSubId === nextProps.editingSubId && prevProps.openTabs[prevProps.tab.id] === nextProps.openTabs[nextProps.tab.id];
+  }
+);
+var AppSidebar = memo(
+  function AppSidebar2({
+    tabs,
+    activeTabId,
+    activeSubTabId,
+    canDeleteTab,
+    onAddTab,
+    onAddSubTab,
+    onSelect,
+    onRename,
+    onDelete,
+    onRenameSubTab,
+    onDeleteSubTab
+  }) {
+    const [editingId, setEditingId] = useState3(null);
+    const [editingSubId, setEditingSubId] = useState3(null);
+    const [tempTitle, setTempTitle] = useState3("");
+    const [openTabs, setOpenTabs] = useState3({});
+    const startRenameTab = useCallback2((id, title) => {
+      setEditingId(id);
+      setEditingSubId(null);
+      setTempTitle(title);
+    }, []);
+    const startRenameSubTab = useCallback2((id, title) => {
+      setEditingSubId(id);
+      setEditingId(null);
+      setTempTitle(title);
+    }, []);
+    const commitRenameTab = useCallback2(() => {
+      if (!editingId) return;
+      onRename(editingId, tempTitle.trim() || "Untitled");
+      setEditingId(null);
+    }, [editingId, tempTitle, onRename]);
+    const commitRenameSubTab = useCallback2(
+      (tabId) => {
+        if (!editingSubId || !onRenameSubTab) return;
+        onRenameSubTab(tabId, editingSubId, tempTitle.trim() || "Untitled");
+        setEditingSubId(null);
+      },
+      [editingSubId, tempTitle, onRenameSubTab]
+    );
+    const toggleTabOpen = useCallback2((tabId) => {
+      setOpenTabs((prev) => ({
+        ...prev,
+        [tabId]: !prev[tabId]
+      }));
+    }, []);
+    return /* @__PURE__ */ jsx9(Sidebar, { children: /* @__PURE__ */ jsx9(SidebarContent, { children: /* @__PURE__ */ jsxs5(SidebarGroup, { children: [
+      /* @__PURE__ */ jsxs5(SidebarGroupLabel, { className: "flex items-center justify-between", children: [
+        "Documents",
+        /* @__PURE__ */ jsx9(
+          "button",
+          {
+            onClick: onAddTab,
+            className: "rounded p-1 transition-all duration-200 hover:bg-accent hover:scale-110",
+            "aria-label": "Add new document",
+            children: /* @__PURE__ */ jsx9(Plus, { size: 16 })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx9(SidebarMenu, { children: /* @__PURE__ */ jsx9(AnimatePresence, { mode: "popLayout", children: tabs.map((tab) => /* @__PURE__ */ jsx9(
+        TabItem,
+        {
+          tab,
+          activeTabId,
+          activeSubTabId,
+          canDeleteTab,
+          editingId,
+          editingSubId,
+          tempTitle,
+          openTabs,
+          onSelect,
+          onAddSubTab,
+          onDelete,
+          startRenameTab,
+          startRenameSubTab,
+          commitRenameTab,
+          commitRenameSubTab,
+          setEditingId,
+          setEditingSubId,
+          setTempTitle,
+          toggleTabOpen,
+          onRenameSubTab,
+          onDeleteSubTab,
+          setOpenTabs
         },
         tab.id
-      );
-    }) }) })
-  ] }) }) });
-}
+      )) }) })
+    ] }) }) });
+  },
+  (prevProps, nextProps) => {
+    return JSON.stringify(prevProps.tabs) === JSON.stringify(nextProps.tabs) && prevProps.activeTabId === nextProps.activeTabId && prevProps.activeSubTabId === nextProps.activeSubTabId;
+  }
+);
 
 // src/contexts/EditorBridge.tsx
 import { createContext as createContext2, useContext as useContext2 } from "react";
@@ -939,45 +1133,55 @@ function useEditorBridge() {
   return ctx;
 }
 
+// src/contexts/EditorStateProvider.tsx
+import { createContext as createContext3, useContext as useContext3 } from "react";
+import { jsx as jsx11 } from "react/jsx-runtime";
+var EditorStateContext = createContext3(null);
+function EditorStateProvider({ children, value }) {
+  return /* @__PURE__ */ jsx11(EditorStateContext.Provider, { value, children });
+}
+
+// src/contexts/EditorActionsProvider.tsx
+import { createContext as createContext4, useContext as useContext4 } from "react";
+import { jsx as jsx12 } from "react/jsx-runtime";
+var EditorActionsContext = createContext4(null);
+function EditorActionsProvider({ children, value }) {
+  return /* @__PURE__ */ jsx12(EditorActionsContext.Provider, { value, children });
+}
+
 // src/contexts/themeProvider.tsx
 import { ThemeProvider as NextThemesProvider } from "next-themes";
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 function ThemeProvider({ children, ...props }) {
-  return /* @__PURE__ */ jsx11(NextThemesProvider, { ...props, children });
+  return /* @__PURE__ */ jsx13(NextThemesProvider, { ...props, children });
 }
 
 // src/components/editorLayout/editorLayout.tsx
-import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime";
 function EditorLayout({ children, onChange, initialTabs, onTabsChange }) {
   const [editor, setEditor] = useState4(null);
   const [tabs, setTabs] = useState4([]);
   const [activeTabId, setActiveTabId] = useState4("");
   const [activeSubTabId, setActiveSubTabId] = useState4(null);
-  const debouncedSaveRef = useRef(null);
-  const lastRestoredRef = useRef(null);
-  const isRestoringRef = useRef(false);
-  const onChangeDebounceRef = useRef(null);
-  const emitChangeDebounced = useCallback2(
+  const debouncedSaveRef = useRef2(null);
+  const onChangeDebounceRef = useRef2(null);
+  const isRestoringRef = useRef2(false);
+  const editorState = useMemo3(
+    () => ({ tabs, activeTabId, activeSubTabId }),
+    [tabs, activeTabId, activeSubTabId]
+  );
+  const emitChangeDebounced = useCallback3(
     (payload) => {
       if (!onChange) return;
-      if (onChangeDebounceRef.current) {
-        clearTimeout(onChangeDebounceRef.current);
-      }
-      onChangeDebounceRef.current = setTimeout(() => {
-        onChange(payload);
-      }, 100);
+      if (onChangeDebounceRef.current) clearTimeout(onChangeDebounceRef.current);
+      onChangeDebounceRef.current = setTimeout(() => onChange(payload), 100);
     },
     [onChange]
   );
-  const emitChange = useCallback2(
+  const emitChange = useCallback3(
     (source) => {
       if (!onChange) return;
-      emitChangeDebounced({
-        tabs,
-        activeTabId,
-        activeSubTabId,
-        source
-      });
+      emitChangeDebounced({ tabs, activeTabId, activeSubTabId, source });
     },
     [emitChangeDebounced, tabs, activeTabId, activeSubTabId]
   );
@@ -993,10 +1197,10 @@ function EditorLayout({ children, onChange, initialTabs, onTabsChange }) {
   useEffect2(() => {
     onTabsChange?.(tabs);
   }, [tabs, onTabsChange]);
-  const saveCurrentContent = useCallback2(() => {
+  const saveCurrentContent = useCallback3(() => {
     if (!editor) return tabs;
     const json = editor.getJSON();
-    const updatedTabs = tabs.map((tab) => {
+    return tabs.map((tab) => {
       if (tab.id !== activeTabId) return tab;
       if (activeSubTabId) {
         return {
@@ -1008,9 +1212,8 @@ function EditorLayout({ children, onChange, initialTabs, onTabsChange }) {
       }
       return { ...tab, content: json };
     });
-    return updatedTabs;
   }, [editor, tabs, activeTabId, activeSubTabId]);
-  const saveFromEditor = useCallback2(
+  const saveFromEditor = useCallback3(
     (editorInstance, source = "editor") => {
       const json = editorInstance.getJSON();
       setTabs((prev) => {
@@ -1039,18 +1242,16 @@ function EditorLayout({ children, onChange, initialTabs, onTabsChange }) {
     },
     [activeTabId, activeSubTabId, emitChangeDebounced]
   );
-  const debouncedSave = useCallback2(
+  const debouncedSave = useCallback3(
     (editorInstance) => {
-      if (debouncedSaveRef.current) {
-        clearTimeout(debouncedSaveRef.current);
-      }
+      if (debouncedSaveRef.current) clearTimeout(debouncedSaveRef.current);
       debouncedSaveRef.current = setTimeout(() => {
         saveFromEditor(editorInstance, "editor");
       }, 800);
     },
     [saveFromEditor]
   );
-  const addTab = () => {
+  const addTab = useCallback3(() => {
     if (debouncedSaveRef.current) {
       clearTimeout(debouncedSaveRef.current);
       debouncedSaveRef.current = null;
@@ -1064,125 +1265,137 @@ function EditorLayout({ children, onChange, initialTabs, onTabsChange }) {
     setTabs(newTabs);
     setActiveTabId(id);
     setActiveSubTabId(null);
-    setTimeout(() => {
-      editor?.commands.clearContent();
-    }, 0);
+    setTimeout(() => editor?.commands.clearContent(), 0);
     emitChangeDebounced({
       tabs: newTabs,
       activeTabId: id,
       activeSubTabId: null,
       source: "add-tab"
     });
-  };
-  const addSubTab = (tabId) => {
-    if (debouncedSaveRef.current) {
-      clearTimeout(debouncedSaveRef.current);
-      debouncedSaveRef.current = null;
-    }
-    const updatedTabs = saveCurrentContent();
-    const subId = Date.now().toString();
-    const newTabs = updatedTabs.map(
-      (tab) => tab.id === tabId ? {
-        ...tab,
-        subtabs: [
-          ...tab.subtabs,
-          { id: subId, title: "New Subtab", content: null }
-        ]
-      } : tab
-    );
-    setTabs(newTabs);
-    setActiveTabId(tabId);
-    setActiveSubTabId(subId);
-    setTimeout(() => {
-      editor?.commands.clearContent();
-    }, 0);
-    emitChangeDebounced({
-      tabs: newTabs,
-      activeTabId: tabId,
-      activeSubTabId: subId,
-      source: "add-subtab"
-    });
-  };
-  const selectNode = (tabId, subId) => {
-    if (debouncedSaveRef.current) {
-      clearTimeout(debouncedSaveRef.current);
-      debouncedSaveRef.current = null;
-    }
-    const updatedTabs = saveCurrentContent();
-    setTabs(updatedTabs);
-    setActiveTabId(tabId);
-    setActiveSubTabId(subId ?? null);
-    emitChangeDebounced({
-      tabs: updatedTabs,
-      activeTabId: tabId,
-      activeSubTabId: subId ?? null,
-      source: "tab-switch"
-    });
-  };
-  const renameTab = (id, title) => {
-    setTabs((prev) => prev.map((t) => t.id === id ? { ...t, title } : t));
-  };
-  const deleteSubTab = (tabId, subTabId) => {
-    console.log("\u{1F5D1}\uFE0F Deleting subtab:", subTabId);
-    setTabs(
-      (prev) => prev.map((tab) => {
-        if (tab.id !== tabId) return tab;
-        const remainingSubTabs = tab.subtabs.filter((st) => st.id !== subTabId);
-        if (subTabId === activeSubTabId) {
-          setActiveSubTabId(null);
-          setTimeout(() => {
-            editor?.commands.clearContent();
-          }, 0);
-        }
-        return {
-          ...tab,
-          subtabs: remainingSubTabs
-        };
-      })
-    );
-    emitChange("delete-subtab");
-  };
-  const renameSubTab = (tabId, subTabId, title) => {
-    setTabs(
-      (prev) => prev.map(
+  }, [saveCurrentContent, editor, emitChangeDebounced]);
+  const addSubTab = useCallback3(
+    (tabId) => {
+      if (debouncedSaveRef.current) {
+        clearTimeout(debouncedSaveRef.current);
+        debouncedSaveRef.current = null;
+      }
+      const updatedTabs = saveCurrentContent();
+      const subId = Date.now().toString();
+      const newTabs = updatedTabs.map(
         (tab) => tab.id === tabId ? {
           ...tab,
-          subtabs: tab.subtabs.map(
-            (st) => st.id === subTabId ? { ...st, title } : st
-          )
+          subtabs: [...tab.subtabs, { id: subId, title: "New Subtab", content: null }]
         } : tab
-      )
-    );
-  };
-  const deleteTab = (id) => {
-    console.log("\u{1F5D1}\uFE0F Deleting tab:", id);
-    if (debouncedSaveRef.current) {
-      clearTimeout(debouncedSaveRef.current);
-      debouncedSaveRef.current = null;
-    }
-    const updatedTabs = id === activeTabId ? tabs : saveCurrentContent();
-    setTabs((prev) => {
-      const remaining = (id === activeTabId ? prev : updatedTabs).filter((t) => t.id !== id);
-      if (id === activeTabId) {
-        const next = remaining[0];
-        setActiveTabId(next?.id ?? "");
-        setActiveSubTabId(null);
-        if (!next) {
-          setTimeout(() => {
-            editor?.commands.clearContent();
-          }, 0);
-        }
+      );
+      setTabs(newTabs);
+      setActiveTabId(tabId);
+      setActiveSubTabId(subId);
+      setTimeout(() => editor?.commands.clearContent(), 0);
+      emitChangeDebounced({
+        tabs: newTabs,
+        activeTabId: tabId,
+        activeSubTabId: subId,
+        source: "add-subtab"
+      });
+    },
+    [saveCurrentContent, editor, emitChangeDebounced]
+  );
+  const selectNode = useCallback3(
+    (tabId, subId) => {
+      if (debouncedSaveRef.current) {
+        clearTimeout(debouncedSaveRef.current);
+        debouncedSaveRef.current = null;
       }
-      return remaining;
-    });
-    emitChange("delete-tab");
-  };
+      const updatedTabs = saveCurrentContent();
+      setTabs(updatedTabs);
+      setActiveTabId(tabId);
+      setActiveSubTabId(subId ?? null);
+      emitChangeDebounced({
+        tabs: updatedTabs,
+        activeTabId: tabId,
+        activeSubTabId: subId ?? null,
+        source: "tab-switch"
+      });
+    },
+    [saveCurrentContent, emitChangeDebounced]
+  );
+  const renameTab = useCallback3(
+    (id, title) => {
+      setTabs((prev) => prev.map((t) => t.id === id ? { ...t, title } : t));
+    },
+    []
+  );
+  const deleteTab = useCallback3(
+    (id) => {
+      if (debouncedSaveRef.current) {
+        clearTimeout(debouncedSaveRef.current);
+        debouncedSaveRef.current = null;
+      }
+      const updatedTabs = id === activeTabId ? tabs : saveCurrentContent();
+      setTabs((prev) => {
+        const remaining = (id === activeTabId ? prev : updatedTabs).filter((t) => t.id !== id);
+        if (id === activeTabId) {
+          const next = remaining[0];
+          setActiveTabId(next?.id ?? "");
+          setActiveSubTabId(null);
+          if (!next) {
+            setTimeout(() => editor?.commands.clearContent(), 0);
+          }
+        }
+        return remaining;
+      });
+      emitChange("delete-tab");
+    },
+    [activeTabId, tabs, saveCurrentContent, editor, emitChange]
+  );
+  const deleteSubTab = useCallback3(
+    (tabId, subTabId) => {
+      setTabs(
+        (prev) => prev.map((tab) => {
+          if (tab.id !== tabId) return tab;
+          const remainingSubTabs = tab.subtabs.filter((st) => st.id !== subTabId);
+          if (subTabId === activeSubTabId) {
+            setActiveSubTabId(null);
+            setTimeout(() => editor?.commands.clearContent(), 0);
+          }
+          return { ...tab, subtabs: remainingSubTabs };
+        })
+      );
+      emitChange("delete-subtab");
+    },
+    [activeSubTabId, editor, emitChange]
+  );
+  const renameSubTab = useCallback3(
+    (tabId, subTabId, title) => {
+      setTabs(
+        (prev) => prev.map(
+          (tab) => tab.id === tabId ? {
+            ...tab,
+            subtabs: tab.subtabs.map(
+              (st) => st.id === subTabId ? { ...st, title } : st
+            )
+          } : tab
+        )
+      );
+    },
+    []
+  );
+  const editorActions = useMemo3(
+    () => ({
+      addTab,
+      addSubTab,
+      selectNode,
+      renameTab,
+      deleteTab,
+      deleteSubTab,
+      renameSubTab,
+      debouncedSave
+    }),
+    [addTab, addSubTab, selectNode, renameTab, deleteTab, deleteSubTab, renameSubTab, debouncedSave]
+  );
   useEffect2(() => {
     if (!editor) return;
     const key = { tabId: activeTabId, subTabId: activeSubTabId };
-    if (lastRestoredRef.current && lastRestoredRef.current.tabId === key.tabId && lastRestoredRef.current.subTabId === key.subTabId) {
-      return;
-    }
     if (isRestoringRef.current) return;
     isRestoringRef.current = true;
     const tab = tabs.find((t) => t.id === activeTabId);
@@ -1192,15 +1405,10 @@ function EditorLayout({ children, onChange, initialTabs, onTabsChange }) {
     } else {
       editor.commands.clearContent();
     }
-    lastRestoredRef.current = key;
     isRestoringRef.current = false;
   }, [editor, tabs, activeTabId, activeSubTabId]);
-  return /* @__PURE__ */ jsx12(ThemeProvider, { attribute: "class", defaultTheme: "system", enableSystem: true, children: /* @__PURE__ */ jsx12(EditorBridgeProvider, { value: {
-    editorContent: editor,
-    setEditorContent: setEditor,
-    debouncedSave
-  }, children: /* @__PURE__ */ jsx12(SidebarProvider, { children: /* @__PURE__ */ jsxs6("div", { className: "flex h-full w-full min-h-0 relative", children: [
-    /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx14(ThemeProvider, { attribute: "class", defaultTheme: "system", enableSystem: true, children: /* @__PURE__ */ jsx14(EditorBridgeProvider, { value: { editorContent: editor, setEditorContent: setEditor, debouncedSave }, children: /* @__PURE__ */ jsx14(EditorStateProvider, { value: editorState, children: /* @__PURE__ */ jsx14(EditorActionsProvider, { value: editorActions, children: /* @__PURE__ */ jsx14(SidebarProvider, { children: /* @__PURE__ */ jsxs6("div", { className: "flex h-full w-full min-h-0 relative", children: [
+    /* @__PURE__ */ jsx14(
       AppSidebar,
       {
         tabs,
@@ -1217,14 +1425,14 @@ function EditorLayout({ children, onChange, initialTabs, onTabsChange }) {
       }
     ),
     /* @__PURE__ */ jsxs6(SidebarInset, { className: "flex flex-col flex-1 min-h-0 overflow-hidden", children: [
-      /* @__PURE__ */ jsx12("header", { className: "h-12 flex-shrink-0 border-b flex items-center px-4", children: /* @__PURE__ */ jsx12(SidebarTrigger, {}) }),
-      /* @__PURE__ */ jsx12("div", { className: "flex-1 min-h-0 overflow-auto", children })
+      /* @__PURE__ */ jsx14("header", { className: "h-12 flex-shrink-0 border-b flex items-center px-4", children: /* @__PURE__ */ jsx14(SidebarTrigger, {}) }),
+      /* @__PURE__ */ jsx14("div", { className: "flex-1 min-h-0 overflow-auto", children })
     ] })
-  ] }) }) }) });
+  ] }) }) }) }) }) });
 }
 
 // src/components/tiptap-templates/simple/simple-editor.tsx
-import { useEffect as useEffect23, useRef as useRef7, useState as useState30 } from "react";
+import { useEffect as useEffect23, useRef as useRef8, useState as useState30 } from "react";
 import { EditorContent, EditorContext, useEditor } from "@tiptap/react";
 import { StarterKit } from "@tiptap/starter-kit";
 import Image from "@tiptap/extension-image";
@@ -1407,16 +1615,16 @@ var FontSizeStepper = Extension.create({
 });
 
 // src/components/tiptap-ui-primitive/button/button.tsx
-import { forwardRef as forwardRef2, Fragment, useMemo as useMemo3 } from "react";
+import { forwardRef as forwardRef2, Fragment, useMemo as useMemo5 } from "react";
 
 // src/components/tiptap-ui-primitive/tooltip/tooltip.tsx
 import {
   cloneElement,
-  createContext as createContext3,
+  createContext as createContext5,
   forwardRef,
   isValidElement,
-  useContext as useContext3,
-  useMemo as useMemo2,
+  useContext as useContext5,
+  useMemo as useMemo4,
   useState as useState5,
   version
 } from "react";
@@ -1435,7 +1643,7 @@ import {
   FloatingPortal,
   FloatingDelayGroup
 } from "@floating-ui/react";
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx15 } from "react/jsx-runtime";
 function useTooltip({
   initialOpen = false,
   placement = "top",
@@ -1478,7 +1686,7 @@ function useTooltip({
   const dismiss = useDismiss(context);
   const role = useRole(context, { role: "tooltip" });
   const interactions = useInteractions([hover, focus, dismiss, role]);
-  return useMemo2(
+  return useMemo4(
     () => ({
       open,
       setOpen,
@@ -1488,9 +1696,9 @@ function useTooltip({
     [open, setOpen, interactions, data]
   );
 }
-var TooltipContext = createContext3(null);
+var TooltipContext = createContext5(null);
 function useTooltipContext() {
-  const context = useContext3(TooltipContext);
+  const context = useContext5(TooltipContext);
   if (context == null) {
     throw new Error("Tooltip components must be wrapped in <TooltipProvider />");
   }
@@ -1499,14 +1707,14 @@ function useTooltipContext() {
 function Tooltip2({ children, ...props }) {
   const tooltip = useTooltip(props);
   if (!props.useDelayGroup) {
-    return /* @__PURE__ */ jsx13(TooltipContext.Provider, { value: tooltip, children });
+    return /* @__PURE__ */ jsx15(TooltipContext.Provider, { value: tooltip, children });
   }
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx15(
     FloatingDelayGroup,
     {
       delay: { open: props.delay ?? 0, close: props.closeDelay ?? 0 },
       timeoutMs: props.timeout,
-      children: /* @__PURE__ */ jsx13(TooltipContext.Provider, { value: tooltip, children })
+      children: /* @__PURE__ */ jsx15(TooltipContext.Provider, { value: tooltip, children })
     }
   );
 }
@@ -1535,7 +1743,7 @@ var TooltipTrigger2 = forwardRef(
         })
       );
     }
-    return /* @__PURE__ */ jsx13(
+    return /* @__PURE__ */ jsx15(
       "button",
       {
         ref,
@@ -1551,7 +1759,7 @@ var TooltipContent2 = forwardRef(
     const context = useTooltipContext();
     const ref = useMergeRefs([context.refs.setFloating, propRef]);
     if (!context.open) return null;
-    const content = /* @__PURE__ */ jsx13(
+    const content = /* @__PURE__ */ jsx15(
       "div",
       {
         ref,
@@ -1565,7 +1773,7 @@ var TooltipContent2 = forwardRef(
       }
     );
     if (portal) {
-      return /* @__PURE__ */ jsx13(FloatingPortal, { ...portalProps, children: content });
+      return /* @__PURE__ */ jsx15(FloatingPortal, { ...portalProps, children: content });
     }
     return content;
   }
@@ -1882,14 +2090,14 @@ var FontSizeExtension = Extension2.create({
 });
 
 // src/components/tiptap-ui-primitive/button/button.tsx
-import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs7 } from "react/jsx-runtime";
 var ShortcutDisplay = ({
   shortcuts
 }) => {
   if (shortcuts.length === 0) return null;
-  return /* @__PURE__ */ jsx14("div", { children: shortcuts.map((key, index) => /* @__PURE__ */ jsxs7(Fragment, { children: [
-    index > 0 && /* @__PURE__ */ jsx14("kbd", { children: "+" }),
-    /* @__PURE__ */ jsx14("kbd", { children: key })
+  return /* @__PURE__ */ jsx16("div", { children: shortcuts.map((key, index) => /* @__PURE__ */ jsxs7(Fragment, { children: [
+    index > 0 && /* @__PURE__ */ jsx16("kbd", { children: "+" }),
+    /* @__PURE__ */ jsx16("kbd", { children: key })
   ] }, index)) });
 };
 var Button2 = forwardRef2(
@@ -1902,12 +2110,12 @@ var Button2 = forwardRef2(
     "aria-label": ariaLabel,
     ...props
   }, ref) => {
-    const shortcuts = useMemo3(
+    const shortcuts = useMemo5(
       () => parseShortcutKeys({ shortcutKeys }),
       [shortcutKeys]
     );
     if (!tooltip || !showTooltip) {
-      return /* @__PURE__ */ jsx14(
+      return /* @__PURE__ */ jsx16(
         "button",
         {
           className: cn2("tiptap-button", className),
@@ -1919,7 +2127,7 @@ var Button2 = forwardRef2(
       );
     }
     return /* @__PURE__ */ jsxs7(Tooltip2, { delay: 200, children: [
-      /* @__PURE__ */ jsx14(
+      /* @__PURE__ */ jsx16(
         TooltipTrigger2,
         {
           className: cn2("tiptap-button", className),
@@ -1931,14 +2139,14 @@ var Button2 = forwardRef2(
       ),
       /* @__PURE__ */ jsxs7(TooltipContent2, { children: [
         tooltip,
-        /* @__PURE__ */ jsx14(ShortcutDisplay, { shortcuts })
+        /* @__PURE__ */ jsx16(ShortcutDisplay, { shortcuts })
       ] })
     ] });
   }
 );
 Button2.displayName = "Button";
 var ButtonGroup = forwardRef2(({ className, children, orientation = "vertical", ...props }, ref) => {
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx16(
     "div",
     {
       ref,
@@ -1953,7 +2161,7 @@ var ButtonGroup = forwardRef2(({ className, children, orientation = "vertical",
 ButtonGroup.displayName = "ButtonGroup";
 
 // src/components/tiptap-ui-primitive/spacer/spacer.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 function Spacer({
   orientation = "horizontal",
   size,
@@ -1968,20 +2176,20 @@ function Spacer({
       height: orientation === "horizontal" ? "1px" : size
     }
   };
-  return /* @__PURE__ */ jsx15("div", { ...props, style: computedStyle });
+  return /* @__PURE__ */ jsx17("div", { ...props, style: computedStyle });
 }
 
 // src/components/tiptap-ui-primitive/toolbar/toolbar.tsx
-import { forwardRef as forwardRef4, useCallback as useCallback4, useEffect as useEffect4, useRef as useRef3, useState as useState7 } from "react";
+import { forwardRef as forwardRef4, useCallback as useCallback5, useEffect as useEffect4, useRef as useRef4, useState as useState7 } from "react";
 
 // src/components/tiptap-ui-primitive/separator/separator.tsx
 import { forwardRef as forwardRef3 } from "react";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 var Separator3 = forwardRef3(
   ({ decorative, orientation = "vertical", className, ...divProps }, ref) => {
     const ariaOrientation = orientation === "vertical" ? orientation : void 0;
     const semanticProps = decorative ? { role: "none" } : { "aria-orientation": ariaOrientation, role: "separator" };
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx18(
       "div",
       {
         className: cn2("tiptap-separator", className),
@@ -2120,7 +2328,7 @@ function useMenuNavigation({
 }
 
 // src/hooks/use-composed-ref.ts
-import { useCallback as useCallback3, useRef as useRef2 } from "react";
+import { useCallback as useCallback4, useRef as useRef3 } from "react";
 var updateRef = (ref, value) => {
   if (typeof ref === "function") {
     ref(value);
@@ -2130,8 +2338,8 @@ var updateRef = (ref, value) => {
   }
 };
 var useComposedRef = (libRef, userRef) => {
-  const prevUserRef = useRef2(null);
-  return useCallback3(
+  const prevUserRef = useRef3(null);
+  return useCallback4(
     (instance) => {
       if (libRef && "current" in libRef) {
         ;
@@ -2150,10 +2358,10 @@ var useComposedRef = (libRef, userRef) => {
 };
 
 // src/components/tiptap-ui-primitive/toolbar/toolbar.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 var useToolbarNavigation = (toolbarRef) => {
   const [items, setItems] = useState7([]);
-  const collectItems = useCallback4(() => {
+  const collectItems = useCallback5(() => {
     if (!toolbarRef.current) return [];
     return Array.from(
       toolbarRef.current.querySelectorAll(
@@ -2204,10 +2412,10 @@ var useToolbarNavigation = (toolbarRef) => {
 };
 var Toolbar = forwardRef4(
   ({ children, className, variant = "fixed", ...props }, ref) => {
-    const toolbarRef = useRef3(null);
+    const toolbarRef = useRef4(null);
     const composedRef = useComposedRef(toolbarRef, ref);
     useToolbarNavigation(toolbarRef);
-    return /* @__PURE__ */ jsx17(
+    return /* @__PURE__ */ jsx19(
       "div",
       {
         ref: composedRef,
@@ -2223,7 +2431,7 @@ var Toolbar = forwardRef4(
 );
 Toolbar.displayName = "Toolbar";
 var ToolbarGroup = forwardRef4(
-  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx17(
+  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsx19(
     "div",
     {
       ref,
@@ -2236,7 +2444,7 @@ var ToolbarGroup = forwardRef4(
 );
 ToolbarGroup.displayName = "ToolbarGroup";
 var ToolbarSeparator = forwardRef4(
-  ({ ...props }, ref) => /* @__PURE__ */ jsx17(Separator3, { ref, orientation: "vertical", decorative: true, ...props })
+  ({ ...props }, ref) => /* @__PURE__ */ jsx19(Separator3, { ref, orientation: "vertical", decorative: true, ...props })
 );
 ToolbarSeparator.displayName = "ToolbarSeparator";
 
@@ -2252,11 +2460,11 @@ import {
   Heading3,
   Code
 } from "lucide-react";
-import { jsx as jsx18, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs8 } from "react/jsx-runtime";
 function BubbleMenuInline() {
   const { editor } = useCurrentEditor();
   if (!editor) return null;
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx20(
     BubbleMenu,
     {
       editor,
@@ -2280,76 +2488,76 @@ function BubbleMenuInline() {
         {
           className: "relative flex items-center gap-1 rounded-md border bg-[#171717] text-[#a1a1a6]  p-1 shadow-md z-[15]\r\n                   animate-in fade-in slide-in-from-top-2 duration-200",
           children: [
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(
               Button,
               {
                 variant: "ghost",
                 size: "sm",
                 onClick: () => editor.chain().focus().toggleHeading({ level: 1 }).run(),
                 className: editor.isActive("heading", { level: 1 }) ? "bg-accent" : "",
-                children: /* @__PURE__ */ jsx18(Heading1, { size: 15 })
+                children: /* @__PURE__ */ jsx20(Heading1, { size: 15 })
               }
             ),
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(
               Button,
               {
                 variant: "ghost",
                 size: "sm",
                 onClick: () => editor.chain().focus().toggleHeading({ level: 2 }).run(),
                 className: editor.isActive("heading", { level: 2 }) ? "bg-accent" : "",
-                children: /* @__PURE__ */ jsx18(Heading2, { size: 15 })
+                children: /* @__PURE__ */ jsx20(Heading2, { size: 15 })
               }
             ),
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(
               Button,
               {
                 variant: "ghost",
                 size: "sm",
                 onClick: () => editor.chain().focus().toggleHeading({ level: 3 }).run(),
                 className: editor.isActive("heading", { level: 3 }) ? "bg-accent" : "",
-                children: /* @__PURE__ */ jsx18(Heading3, { size: 15 })
+                children: /* @__PURE__ */ jsx20(Heading3, { size: 15 })
               }
             ),
-            /* @__PURE__ */ jsx18(Separator, { orientation: "vertical", className: "mx-1" }),
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(Separator, { orientation: "vertical", className: "mx-1" }),
+            /* @__PURE__ */ jsx20(
               Button,
               {
                 variant: "ghost",
                 size: "sm",
                 onClick: () => editor.chain().focus().toggleBulletList().run(),
                 className: editor.isActive("bulletList") ? "bg-accent" : "",
-                children: /* @__PURE__ */ jsx18(List, { size: 15 })
+                children: /* @__PURE__ */ jsx20(List, { size: 15 })
               }
             ),
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(
               Button,
               {
                 variant: "ghost",
                 size: "sm",
                 onClick: () => editor.chain().focus().toggleOrderedList().run(),
                 className: editor.isActive("orderedList") ? "bg-accent" : "",
-                children: /* @__PURE__ */ jsx18(ListOrdered, { size: 15 })
+                children: /* @__PURE__ */ jsx20(ListOrdered, { size: 15 })
               }
             ),
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(
               Button,
               {
                 variant: "ghost",
                 size: "sm",
                 onClick: () => editor.chain().focus().toggleTaskList().run(),
                 className: editor.isActive("taskList") ? "bg-accent" : "",
-                children: /* @__PURE__ */ jsx18(CheckSquare, { size: 15 })
+                children: /* @__PURE__ */ jsx20(CheckSquare, { size: 15 })
               }
             ),
-            /* @__PURE__ */ jsx18(Separator, { orientation: "vertical", className: "mx-1" }),
-            /* @__PURE__ */ jsx18(
+            /* @__PURE__ */ jsx20(Separator, { orientation: "vertical", className: "mx-1" }),
+            /* @__PURE__ */ jsx20(
               Button,
               {
                 variant: "ghost",
                 size: "sm",
                 onClick: () => editor.chain().focus().toggleCodeBlock().run(),
                 className: editor.isActive("codeBlock") ? "bg-accent" : "",
-                children: /* @__PURE__ */ jsx18(Code, { size: 15 })
+                children: /* @__PURE__ */ jsx20(Code, { size: 15 })
               }
             )
           ]
@@ -2364,14 +2572,14 @@ import { mergeAttributes as mergeAttributes2, Node as Node4 } from "@tiptap/reac
 import { ReactNodeViewRenderer } from "@tiptap/react";
 
 // src/components/tiptap-node/image-upload-node/image-upload-node.tsx
-import { useRef as useRef4, useState as useState8 } from "react";
+import { useRef as useRef5, useState as useState8 } from "react";
 import { NodeViewWrapper } from "@tiptap/react";
 
 // src/components/tiptap-icons/close-icon.tsx
-import { memo } from "react";
-import { jsx as jsx19 } from "react/jsx-runtime";
-var CloseIcon = memo(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx19(
+import { memo as memo2 } from "react";
+import { jsx as jsx21 } from "react/jsx-runtime";
+var CloseIcon = memo2(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx21(
     "svg",
     {
       width: "24",
@@ -2381,7 +2589,7 @@ var CloseIcon = memo(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx19(
+      children: /* @__PURE__ */ jsx21(
         "path",
         {
           d: "M18.7071 6.70711C19.0976 6.31658 19.0976 5.68342 18.7071 5.29289C18.3166 4.90237 17.6834 4.90237 17.2929 5.29289L12 10.5858L6.70711 5.29289C6.31658 4.90237 5.68342 4.90237 5.29289 5.29289C4.90237 5.68342 4.90237 6.31658 5.29289 6.70711L10.5858 12L5.29289 17.2929C4.90237 17.6834 4.90237 18.3166 5.29289 18.7071C5.68342 19.0976 6.31658 19.0976 6.70711 18.7071L12 13.4142L17.2929 18.7071C17.6834 19.0976 18.3166 19.0976 18.7071 18.7071C19.0976 18.3166 19.0976 17.6834 18.7071 17.2929L13.4142 12L18.7071 6.70711Z",
@@ -2394,7 +2602,7 @@ var CloseIcon = memo(({ className, ...props }) => {
 CloseIcon.displayName = "CloseIcon";
 
 // src/components/tiptap-node/image-upload-node/image-upload-node.tsx
-import { Fragment as Fragment2, jsx as jsx20, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx22, jsxs as jsxs9 } from "react/jsx-runtime";
 function useFileUpload(options) {
   const [fileItems, setFileItems] = useState8([]);
   const uploadFile = async (file) => {
@@ -2512,14 +2720,14 @@ var CloudUploadIcon = () => /* @__PURE__ */ jsxs9(
     fill: "currentColor",
     xmlns: "http://www.w3.org/2000/svg",
     children: [
-      /* @__PURE__ */ jsx20(
+      /* @__PURE__ */ jsx22(
         "path",
         {
           d: "M11.1953 4.41771C10.3478 4.08499 9.43578 3.94949 8.5282 4.02147C7.62062 4.09345 6.74133 4.37102 5.95691 4.83316C5.1725 5.2953 4.50354 5.92989 4.00071 6.68886C3.49788 7.44783 3.17436 8.31128 3.05465 9.2138C2.93495 10.1163 3.0222 11.0343 3.3098 11.8981C3.5974 12.7619 4.07781 13.5489 4.71463 14.1995C5.10094 14.5942 5.09414 15.2274 4.69945 15.6137C4.30476 16 3.67163 15.9932 3.28532 15.5985C2.43622 14.731 1.79568 13.6816 1.41221 12.5299C1.02875 11.3781 0.91241 10.1542 1.07201 8.95084C1.23162 7.74748 1.66298 6.59621 2.33343 5.58425C3.00387 4.57229 3.89581 3.72617 4.9417 3.10998C5.98758 2.4938 7.15998 2.1237 8.37008 2.02773C9.58018 1.93176 10.7963 2.11243 11.9262 2.55605C13.0561 2.99968 14.0703 3.69462 14.8919 4.58825C15.5423 5.29573 16.0585 6.11304 16.4177 7.00002H17.4999C18.6799 6.99991 19.8288 7.37933 20.7766 8.08222C21.7245 8.78515 22.4212 9.7743 22.7637 10.9036C23.1062 12.0328 23.0765 13.2423 22.6788 14.3534C22.2812 15.4644 21.5367 16.4181 20.5554 17.0736C20.0962 17.3803 19.4752 17.2567 19.1684 16.7975C18.8617 16.3382 18.9853 15.7172 19.4445 15.4105C20.069 14.9934 20.5427 14.3865 20.7958 13.6794C21.0488 12.9724 21.0678 12.2027 20.8498 11.4841C20.6318 10.7655 20.1885 10.136 19.5853 9.6887C18.9821 9.24138 18.251 8.99993 17.5001 9.00002H15.71C15.2679 9.00002 14.8783 8.70973 14.7518 8.28611C14.4913 7.41374 14.0357 6.61208 13.4195 5.94186C12.8034 5.27164 12.0427 4.75043 11.1953 4.41771Z",
           fill: "currentColor"
         }
       ),
-      /* @__PURE__ */ jsx20(
+      /* @__PURE__ */ jsx22(
         "path",
         {
           d: "M11 14.4142V21C11 21.5523 11.4477 22 12 22C12.5523 22 13 21.5523 13 21V14.4142L15.2929 16.7071C15.6834 17.0976 16.3166 17.0976 16.7071 16.7071C17.0976 16.3166 17.0976 15.6834 16.7071 15.2929L12.7078 11.2936C12.7054 11.2912 12.703 11.2888 12.7005 11.2864C12.5208 11.1099 12.2746 11.0008 12.003 11L12 11L11.997 11C11.8625 11.0004 11.7343 11.0273 11.6172 11.0759C11.502 11.1236 11.3938 11.1937 11.2995 11.2864C11.297 11.2888 11.2946 11.2912 11.2922 11.2936L7.29289 15.2929C6.90237 15.6834 6.90237 16.3166 7.29289 16.7071C7.68342 17.0976 8.31658 17.0976 8.70711 16.7071L11 14.4142Z",
@@ -2529,7 +2737,7 @@ var CloudUploadIcon = () => /* @__PURE__ */ jsxs9(
     ]
   }
 );
-var FileIcon = () => /* @__PURE__ */ jsx20(
+var FileIcon = () => /* @__PURE__ */ jsx22(
   "svg",
   {
     width: "43",
@@ -2538,7 +2746,7 @@ var FileIcon = () => /* @__PURE__ */ jsx20(
     fill: "currentColor",
     className: "tiptap-image-upload-dropzone-rect-primary",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx20(
+    children: /* @__PURE__ */ jsx22(
       "path",
       {
         d: "M0.75 10.75C0.75 5.64137 4.89137 1.5 10 1.5H32.3431C33.2051 1.5 34.0317 1.84241 34.6412 2.4519L40.2981 8.10876C40.9076 8.71825 41.25 9.5449 41.25 10.4069V46.75C41.25 51.8586 37.1086 56 32 56H10C4.89137 56 0.75 51.8586 0.75 46.75V10.75Z",
@@ -2550,7 +2758,7 @@ var FileIcon = () => /* @__PURE__ */ jsx20(
     )
   }
 );
-var FileCornerIcon = () => /* @__PURE__ */ jsx20(
+var FileCornerIcon = () => /* @__PURE__ */ jsx22(
   "svg",
   {
     width: "10",
@@ -2559,7 +2767,7 @@ var FileCornerIcon = () => /* @__PURE__ */ jsx20(
     viewBox: "0 0 10 10",
     fill: "currentColor",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx20(
+    children: /* @__PURE__ */ jsx22(
       "path",
       {
         d: "M0 0.75H0.343146C1.40401 0.75 2.42143 1.17143 3.17157 1.92157L8.82843 7.57843C9.57857 8.32857 10 9.34599 10 10.4069V10.75H4C1.79086 10.75 0 8.95914 0 6.75V0.75Z",
@@ -2602,7 +2810,7 @@ var ImageUploadDragArea = ({
       onFile(files);
     }
   };
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx22(
     "div",
     {
       className: `tiptap-image-upload-drag-area ${isDragActive ? "drag-active" : ""} ${isDragOver ? "drag-over" : ""}`,
@@ -2626,7 +2834,7 @@ var ImageUploadPreview = ({
     return `${parseFloat((bytes / Math.pow(k, i)).toFixed(2))} ${sizes[i]}`;
   };
   return /* @__PURE__ */ jsxs9("div", { className: "tiptap-image-upload-preview", children: [
-    fileItem.status === "uploading" && /* @__PURE__ */ jsx20(
+    fileItem.status === "uploading" && /* @__PURE__ */ jsx22(
       "div",
       {
         className: "tiptap-image-upload-progress",
@@ -2635,10 +2843,10 @@ var ImageUploadPreview = ({
     ),
     /* @__PURE__ */ jsxs9("div", { className: "tiptap-image-upload-preview-content", children: [
       /* @__PURE__ */ jsxs9("div", { className: "tiptap-image-upload-file-info", children: [
-        /* @__PURE__ */ jsx20("div", { className: "tiptap-image-upload-file-icon", children: /* @__PURE__ */ jsx20(CloudUploadIcon, {}) }),
+        /* @__PURE__ */ jsx22("div", { className: "tiptap-image-upload-file-icon", children: /* @__PURE__ */ jsx22(CloudUploadIcon, {}) }),
         /* @__PURE__ */ jsxs9("div", { className: "tiptap-image-upload-details", children: [
-          /* @__PURE__ */ jsx20("span", { className: "tiptap-image-upload-text", children: fileItem.file.name }),
-          /* @__PURE__ */ jsx20("span", { className: "tiptap-image-upload-subtext", children: formatFileSize(fileItem.file.size) })
+          /* @__PURE__ */ jsx22("span", { className: "tiptap-image-upload-text", children: fileItem.file.name }),
+          /* @__PURE__ */ jsx22("span", { className: "tiptap-image-upload-subtext", children: formatFileSize(fileItem.file.size) })
         ] })
       ] }),
       /* @__PURE__ */ jsxs9("div", { className: "tiptap-image-upload-actions", children: [
@@ -2646,7 +2854,7 @@ var ImageUploadPreview = ({
           fileItem.progress,
           "%"
         ] }),
-        /* @__PURE__ */ jsx20(
+        /* @__PURE__ */ jsx22(
           Button2,
           {
             type: "button",
@@ -2655,7 +2863,7 @@ var ImageUploadPreview = ({
               e.stopPropagation();
               onRemove();
             },
-            children: /* @__PURE__ */ jsx20(CloseIcon, { className: "tiptap-button-icon" })
+            children: /* @__PURE__ */ jsx22(CloseIcon, { className: "tiptap-button-icon" })
           }
         )
       ] })
@@ -2667,13 +2875,13 @@ var DropZoneContent = ({
   limit
 }) => /* @__PURE__ */ jsxs9(Fragment2, { children: [
   /* @__PURE__ */ jsxs9("div", { className: "tiptap-image-upload-dropzone", children: [
-    /* @__PURE__ */ jsx20(FileIcon, {}),
-    /* @__PURE__ */ jsx20(FileCornerIcon, {}),
-    /* @__PURE__ */ jsx20("div", { className: "tiptap-image-upload-icon-container", children: /* @__PURE__ */ jsx20(CloudUploadIcon, {}) })
+    /* @__PURE__ */ jsx22(FileIcon, {}),
+    /* @__PURE__ */ jsx22(FileCornerIcon, {}),
+    /* @__PURE__ */ jsx22("div", { className: "tiptap-image-upload-icon-container", children: /* @__PURE__ */ jsx22(CloudUploadIcon, {}) })
   ] }),
   /* @__PURE__ */ jsxs9("div", { className: "tiptap-image-upload-content", children: [
     /* @__PURE__ */ jsxs9("span", { className: "tiptap-image-upload-text", children: [
-      /* @__PURE__ */ jsx20("em", { children: "Click to upload" }),
+      /* @__PURE__ */ jsx22("em", { children: "Click to upload" }),
       " or drag and drop"
     ] }),
     /* @__PURE__ */ jsxs9("span", { className: "tiptap-image-upload-subtext", children: [
@@ -2689,7 +2897,7 @@ var DropZoneContent = ({
 ] });
 var ImageUploadNode = (props) => {
   const { accept, limit, maxSize } = props.node.attrs;
-  const inputRef = useRef4(null);
+  const inputRef = useRef5(null);
   const extension = props.extension;
   const uploadOptions = {
     maxSize,
@@ -2744,7 +2952,7 @@ var ImageUploadNode = (props) => {
       tabIndex: 0,
       onClick: handleClick,
       children: [
-        !hasFiles && /* @__PURE__ */ jsx20(ImageUploadDragArea, { onFile: handleUpload, children: /* @__PURE__ */ jsx20(DropZoneContent, { maxSize, limit }) }),
+        !hasFiles && /* @__PURE__ */ jsx22(ImageUploadDragArea, { onFile: handleUpload, children: /* @__PURE__ */ jsx22(DropZoneContent, { maxSize, limit }) }),
         hasFiles && /* @__PURE__ */ jsxs9("div", { className: "tiptap-image-upload-previews", children: [
           fileItems.length > 1 && /* @__PURE__ */ jsxs9("div", { className: "tiptap-image-upload-header", children: [
             /* @__PURE__ */ jsxs9("span", { children: [
@@ -2752,7 +2960,7 @@ var ImageUploadNode = (props) => {
               fileItems.length,
               " files"
             ] }),
-            /* @__PURE__ */ jsx20(
+            /* @__PURE__ */ jsx22(
               Button2,
               {
                 type: "button",
@@ -2765,7 +2973,7 @@ var ImageUploadNode = (props) => {
               }
             )
           ] }),
-          fileItems.map((fileItem) => /* @__PURE__ */ jsx20(
+          fileItems.map((fileItem) => /* @__PURE__ */ jsx22(
             ImageUploadPreview,
             {
               fileItem,
@@ -2774,7 +2982,7 @@ var ImageUploadNode = (props) => {
             fileItem.id
           ))
         ] }),
-        /* @__PURE__ */ jsx20(
+        /* @__PURE__ */ jsx22(
           "input",
           {
             ref: inputRef,
@@ -2883,13 +3091,13 @@ var HorizontalRule = TiptapHorizontalRule.extend({
 });
 
 // src/components/tiptap-ui/heading-dropdown-menu/heading-dropdown-menu.tsx
-import { forwardRef as forwardRef9, useCallback as useCallback7, useState as useState10 } from "react";
+import { forwardRef as forwardRef9, useCallback as useCallback8, useState as useState10 } from "react";
 
 // src/components/tiptap-icons/chevron-down-icon.tsx
-import { memo as memo2 } from "react";
-import { jsx as jsx21 } from "react/jsx-runtime";
-var ChevronDownIcon = memo2(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx21(
+import { memo as memo3 } from "react";
+import { jsx as jsx23 } from "react/jsx-runtime";
+var ChevronDownIcon = memo3(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx23(
     "svg",
     {
       width: "24",
@@ -2899,7 +3107,7 @@ var ChevronDownIcon = memo2(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx21(
+      children: /* @__PURE__ */ jsx23(
         "path",
         {
           fillRule: "evenodd",
@@ -2915,10 +3123,10 @@ ChevronDownIcon.displayName = "ChevronDownIcon";
 
 // src/hooks/use-tiptap-editor.ts
 import { useCurrentEditor as useCurrentEditor2, useEditorState } from "@tiptap/react";
-import { useMemo as useMemo4 } from "react";
+import { useMemo as useMemo6 } from "react";
 function useTiptapEditor(providedEditor) {
   const { editor: coreEditor } = useCurrentEditor2();
-  const mainEditor = useMemo4(
+  const mainEditor = useMemo6(
     () => providedEditor || coreEditor,
     [providedEditor, coreEditor]
   );
@@ -2943,11 +3151,11 @@ function useTiptapEditor(providedEditor) {
 }
 
 // src/components/tiptap-ui/heading-button/heading-button.tsx
-import { forwardRef as forwardRef6, useCallback as useCallback5 } from "react";
+import { forwardRef as forwardRef6, useCallback as useCallback6 } from "react";
 
 // src/components/tiptap-ui-primitive/badge/badge.tsx
 import { forwardRef as forwardRef5 } from "react";
-import { jsx as jsx22 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 var Badge = forwardRef5(
   ({
     variant,
@@ -2958,7 +3166,7 @@ var Badge = forwardRef5(
     children,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ jsx22(
+    return /* @__PURE__ */ jsx24(
       "div",
       {
         ref,
@@ -2976,12 +3184,12 @@ var Badge = forwardRef5(
 Badge.displayName = "Badge";
 
 // src/components/tiptap-ui/heading-button/heading-button.tsx
-import { Fragment as Fragment3, jsx as jsx23, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx25, jsxs as jsxs10 } from "react/jsx-runtime";
 function HeadingShortcutBadge({
   level,
   shortcutKeys = HEADING_SHORTCUT_KEYS[level]
 }) {
-  return /* @__PURE__ */ jsx23(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
+  return /* @__PURE__ */ jsx25(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
 }
 var HeadingButton = forwardRef6(
   ({
@@ -3010,7 +3218,7 @@ var HeadingButton = forwardRef6(
       hideWhenUnavailable,
       onToggled
     });
-    const handleClick = useCallback5(
+    const handleClick = useCallback6(
       (event) => {
         onClick?.(event);
         if (event.defaultPrevented) return;
@@ -3021,7 +3229,7 @@ var HeadingButton = forwardRef6(
     if (!isVisible) {
       return null;
     }
-    return /* @__PURE__ */ jsx23(
+    return /* @__PURE__ */ jsx25(
       Button2,
       {
         type: "button",
@@ -3038,9 +3246,9 @@ var HeadingButton = forwardRef6(
         ...buttonProps,
         ref,
         children: children ?? /* @__PURE__ */ jsxs10(Fragment3, { children: [
-          /* @__PURE__ */ jsx23(Icon, { className: "tiptap-button-icon" }),
-          text && /* @__PURE__ */ jsx23("span", { className: "tiptap-button-text", children: text }),
-          showShortcut && /* @__PURE__ */ jsx23(HeadingShortcutBadge, { level, shortcutKeys })
+          /* @__PURE__ */ jsx25(Icon, { className: "tiptap-button-icon" }),
+          text && /* @__PURE__ */ jsx25("span", { className: "tiptap-button-text", children: text }),
+          showShortcut && /* @__PURE__ */ jsx25(HeadingShortcutBadge, { level, shortcutKeys })
         ] })
       }
     );
@@ -3049,13 +3257,13 @@ var HeadingButton = forwardRef6(
 HeadingButton.displayName = "HeadingButton";
 
 // src/components/tiptap-ui/heading-button/use-heading.ts
-import { useCallback as useCallback6, useEffect as useEffect5, useState as useState9 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect5, useState as useState9 } from "react";
 import { NodeSelection as NodeSelection2, TextSelection as TextSelection2 } from "@tiptap/pm/state";
 
 // src/components/tiptap-icons/heading-one-icon.tsx
-import { memo as memo3 } from "react";
-import { jsx as jsx24, jsxs as jsxs11 } from "react/jsx-runtime";
-var HeadingOneIcon = memo3(({ className, ...props }) => {
+import { memo as memo4 } from "react";
+import { jsx as jsx26, jsxs as jsxs11 } from "react/jsx-runtime";
+var HeadingOneIcon = memo4(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs11(
     "svg",
     {
@@ -3067,14 +3275,14 @@ var HeadingOneIcon = memo3(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx24(
+        /* @__PURE__ */ jsx26(
           "path",
           {
             d: "M5 6C5 5.44772 4.55228 5 4 5C3.44772 5 3 5.44772 3 6V18C3 18.5523 3.44772 19 4 19C4.55228 19 5 18.5523 5 18V13H11V18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18V6C13 5.44772 12.5523 5 12 5C11.4477 5 11 5.44772 11 6V11H5V6Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx24(
+        /* @__PURE__ */ jsx26(
           "path",
           {
             d: "M21.0001 10C21.0001 9.63121 20.7971 9.29235 20.472 9.11833C20.1468 8.94431 19.7523 8.96338 19.4454 9.16795L16.4454 11.168C15.9859 11.4743 15.8617 12.0952 16.1681 12.5547C16.4744 13.0142 17.0953 13.1384 17.5548 12.8321L19.0001 11.8685V18C19.0001 18.5523 19.4478 19 20.0001 19C20.5524 19 21.0001 18.5523 21.0001 18V10Z",
@@ -3088,9 +3296,9 @@ var HeadingOneIcon = memo3(({ className, ...props }) => {
 HeadingOneIcon.displayName = "HeadingOneIcon";
 
 // src/components/tiptap-icons/heading-two-icon.tsx
-import { memo as memo4 } from "react";
-import { jsx as jsx25, jsxs as jsxs12 } from "react/jsx-runtime";
-var HeadingTwoIcon = memo4(({ className, ...props }) => {
+import { memo as memo5 } from "react";
+import { jsx as jsx27, jsxs as jsxs12 } from "react/jsx-runtime";
+var HeadingTwoIcon = memo5(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs12(
     "svg",
     {
@@ -3102,14 +3310,14 @@ var HeadingTwoIcon = memo4(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx25(
+        /* @__PURE__ */ jsx27(
           "path",
           {
             d: "M5 6C5 5.44772 4.55228 5 4 5C3.44772 5 3 5.44772 3 6V18C3 18.5523 3.44772 19 4 19C4.55228 19 5 18.5523 5 18V13H11V18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18V6C13 5.44772 12.5523 5 12 5C11.4477 5 11 5.44772 11 6V11H5V6Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx25(
+        /* @__PURE__ */ jsx27(
           "path",
           {
             d: "M22.0001 12C22.0001 10.7611 21.1663 9.79297 20.0663 9.42632C18.9547 9.05578 17.6171 9.28724 16.4001 10.2C15.9582 10.5314 15.8687 11.1582 16.2001 11.6C16.5314 12.0418 17.1582 12.1314 17.6001 11.8C18.383 11.2128 19.0455 11.1942 19.4338 11.3237C19.8339 11.457 20.0001 11.7389 20.0001 12C20.0001 12.4839 19.8554 12.7379 19.6537 12.9481C19.4275 13.1837 19.1378 13.363 18.7055 13.6307C18.6313 13.6767 18.553 13.7252 18.4701 13.777C17.9572 14.0975 17.3128 14.5261 16.8163 15.2087C16.3007 15.9177 16.0001 16.8183 16.0001 18C16.0001 18.5523 16.4478 19 17.0001 19H21.0001C21.5523 19 22.0001 18.5523 22.0001 18C22.0001 17.4477 21.5523 17 21.0001 17H18.131C18.21 16.742 18.3176 16.5448 18.4338 16.385C18.6873 16.0364 19.0429 15.7775 19.5301 15.473C19.5898 15.4357 19.6536 15.3966 19.7205 15.3556C20.139 15.0992 20.6783 14.7687 21.0964 14.3332C21.6447 13.7621 22.0001 13.0161 22.0001 12Z",
@@ -3123,9 +3331,9 @@ var HeadingTwoIcon = memo4(({ className, ...props }) => {
 HeadingTwoIcon.displayName = "HeadingTwoIcon";
 
 // src/components/tiptap-icons/heading-three-icon.tsx
-import { memo as memo5 } from "react";
-import { jsx as jsx26, jsxs as jsxs13 } from "react/jsx-runtime";
-var HeadingThreeIcon = memo5(({ className, ...props }) => {
+import { memo as memo6 } from "react";
+import { jsx as jsx28, jsxs as jsxs13 } from "react/jsx-runtime";
+var HeadingThreeIcon = memo6(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs13(
     "svg",
     {
@@ -3137,14 +3345,14 @@ var HeadingThreeIcon = memo5(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx26(
+        /* @__PURE__ */ jsx28(
           "path",
           {
             d: "M4 5C4.55228 5 5 5.44772 5 6V11H11V6C11 5.44772 11.4477 5 12 5C12.5523 5 13 5.44772 13 6V18C13 18.5523 12.5523 19 12 19C11.4477 19 11 18.5523 11 18V13H5V18C5 18.5523 4.55228 19 4 19C3.44772 19 3 18.5523 3 18V6C3 5.44772 3.44772 5 4 5Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx26(
+        /* @__PURE__ */ jsx28(
           "path",
           {
             fillRule: "evenodd",
@@ -3153,7 +3361,7 @@ var HeadingThreeIcon = memo5(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx26(
+        /* @__PURE__ */ jsx28(
           "path",
           {
             fillRule: "evenodd",
@@ -3169,9 +3377,9 @@ var HeadingThreeIcon = memo5(({ className, ...props }) => {
 HeadingThreeIcon.displayName = "HeadingThreeIcon";
 
 // src/components/tiptap-icons/heading-four-icon.tsx
-import { memo as memo6 } from "react";
-import { jsx as jsx27, jsxs as jsxs14 } from "react/jsx-runtime";
-var HeadingFourIcon = memo6(({ className, ...props }) => {
+import { memo as memo7 } from "react";
+import { jsx as jsx29, jsxs as jsxs14 } from "react/jsx-runtime";
+var HeadingFourIcon = memo7(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs14(
     "svg",
     {
@@ -3183,14 +3391,14 @@ var HeadingFourIcon = memo6(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx27(
+        /* @__PURE__ */ jsx29(
           "path",
           {
             d: "M4 5C4.55228 5 5 5.44772 5 6V11H11V6C11 5.44772 11.4477 5 12 5C12.5523 5 13 5.44772 13 6V18C13 18.5523 12.5523 19 12 19C11.4477 19 11 18.5523 11 18V13H5V18C5 18.5523 4.55228 19 4 19C3.44772 19 3 18.5523 3 18V6C3 5.44772 3.44772 5 4 5Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx27(
+        /* @__PURE__ */ jsx29(
           "path",
           {
             d: "M17 9C17.5523 9 18 9.44772 18 10V13H20V10C20 9.44772 20.4477 9 21 9C21.5523 9 22 9.44772 22 10V18C22 18.5523 21.5523 19 21 19C20.4477 19 20 18.5523 20 18V15H17C16.4477 15 16 14.5523 16 14V10C16 9.44772 16.4477 9 17 9Z",
@@ -3204,9 +3412,9 @@ var HeadingFourIcon = memo6(({ className, ...props }) => {
 HeadingFourIcon.displayName = "HeadingFourIcon";
 
 // src/components/tiptap-icons/heading-five-icon.tsx
-import { memo as memo7 } from "react";
-import { jsx as jsx28, jsxs as jsxs15 } from "react/jsx-runtime";
-var HeadingFiveIcon = memo7(({ className, ...props }) => {
+import { memo as memo8 } from "react";
+import { jsx as jsx30, jsxs as jsxs15 } from "react/jsx-runtime";
+var HeadingFiveIcon = memo8(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs15(
     "svg",
     {
@@ -3218,14 +3426,14 @@ var HeadingFiveIcon = memo7(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx28(
+        /* @__PURE__ */ jsx30(
           "path",
           {
             d: "M5 6C5 5.44772 4.55228 5 4 5C3.44772 5 3 5.44772 3 6V18C3 18.5523 3.44772 19 4 19C4.55228 19 5 18.5523 5 18V13H11V18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18V6C13 5.44772 12.5523 5 12 5C11.4477 5 11 5.44772 11 6V11H5V6Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx28(
+        /* @__PURE__ */ jsx30(
           "path",
           {
             d: "M16 10C16 9.44772 16.4477 9 17 9H21C21.5523 9 22 9.44772 22 10C22 10.5523 21.5523 11 21 11H18V12H18.3C20.2754 12 22 13.4739 22 15.5C22 17.5261 20.2754 19 18.3 19C17.6457 19 17.0925 18.8643 16.5528 18.5944C16.0588 18.3474 15.8586 17.7468 16.1055 17.2528C16.3525 16.7588 16.9532 16.5586 17.4472 16.8056C17.7074 16.9357 17.9542 17 18.3 17C19.3246 17 20 16.2739 20 15.5C20 14.7261 19.3246 14 18.3 14H17C16.4477 14 16 13.5523 16 13L16 12.9928V10Z",
@@ -3239,9 +3447,9 @@ var HeadingFiveIcon = memo7(({ className, ...props }) => {
 HeadingFiveIcon.displayName = "HeadingFiveIcon";
 
 // src/components/tiptap-icons/heading-six-icon.tsx
-import { memo as memo8 } from "react";
-import { jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
-var HeadingSixIcon = memo8(({ className, ...props }) => {
+import { memo as memo9 } from "react";
+import { jsx as jsx31, jsxs as jsxs16 } from "react/jsx-runtime";
+var HeadingSixIcon = memo9(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs16(
     "svg",
     {
@@ -3253,14 +3461,14 @@ var HeadingSixIcon = memo8(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx29(
+        /* @__PURE__ */ jsx31(
           "path",
           {
             d: "M5 6C5 5.44772 4.55228 5 4 5C3.44772 5 3 5.44772 3 6V18C3 18.5523 3.44772 19 4 19C4.55228 19 5 18.5523 5 18V13H11V18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18V6C13 5.44772 12.5523 5 12 5C11.4477 5 11 5.44772 11 6V11H5V6Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx29(
+        /* @__PURE__ */ jsx31(
           "path",
           {
             fillRule: "evenodd",
@@ -3393,7 +3601,7 @@ function useHeading(config) {
       editor.off("selectionUpdate", handleSelectionUpdate);
     };
   }, [editor, level, hideWhenUnavailable]);
-  const handleToggle = useCallback6(() => {
+  const handleToggle = useCallback7(() => {
     if (!editor) return false;
     const success = toggleHeading(editor, level);
     if (success) {
@@ -3415,22 +3623,22 @@ function useHeading(config) {
 // src/components/tiptap-ui-primitive/dropdown-menu/dropdown-menu.tsx
 import { forwardRef as forwardRef7 } from "react";
 import * as DropdownMenuPrimitive2 from "@radix-ui/react-dropdown-menu";
-import { jsx as jsx30 } from "react/jsx-runtime";
+import { jsx as jsx32 } from "react/jsx-runtime";
 function DropdownMenu2({
   ...props
 }) {
-  return /* @__PURE__ */ jsx30(DropdownMenuPrimitive2.Root, { modal: false, ...props });
+  return /* @__PURE__ */ jsx32(DropdownMenuPrimitive2.Root, { modal: false, ...props });
 }
 function DropdownMenuPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx30(DropdownMenuPrimitive2.Portal, { ...props });
+  return /* @__PURE__ */ jsx32(DropdownMenuPrimitive2.Portal, { ...props });
 }
-var DropdownMenuTrigger2 = forwardRef7(({ ...props }, ref) => /* @__PURE__ */ jsx30(DropdownMenuPrimitive2.Trigger, { ref, ...props }));
+var DropdownMenuTrigger2 = forwardRef7(({ ...props }, ref) => /* @__PURE__ */ jsx32(DropdownMenuPrimitive2.Trigger, { ref, ...props }));
 DropdownMenuTrigger2.displayName = DropdownMenuPrimitive2.Trigger.displayName;
 var DropdownMenuItem2 = DropdownMenuPrimitive2.Item;
 var DropdownMenuSubContent = forwardRef7(({ className, portal = true, ...props }, ref) => {
-  const content = /* @__PURE__ */ jsx30(
+  const content = /* @__PURE__ */ jsx32(
     DropdownMenuPrimitive2.SubContent,
     {
       ref,
@@ -3438,11 +3646,11 @@ var DropdownMenuSubContent = forwardRef7(({ className, portal = true, ...props }
       ...props
     }
   );
-  return portal ? /* @__PURE__ */ jsx30(DropdownMenuPortal, { ...typeof portal === "object" ? portal : {}, children: content }) : content;
+  return portal ? /* @__PURE__ */ jsx32(DropdownMenuPortal, { ...typeof portal === "object" ? portal : {}, children: content }) : content;
 });
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive2.SubContent.displayName;
 var DropdownMenuContent2 = forwardRef7(({ className, sideOffset = 4, portal = false, ...props }, ref) => {
-  const content = /* @__PURE__ */ jsx30(
+  const content = /* @__PURE__ */ jsx32(
     DropdownMenuPrimitive2.Content,
     {
       ref,
@@ -3452,22 +3660,22 @@ var DropdownMenuContent2 = forwardRef7(({ className, sideOffset = 4, portal = fa
       ...props
     }
   );
-  return portal ? /* @__PURE__ */ jsx30(DropdownMenuPortal, { ...typeof portal === "object" ? portal : {}, children: content }) : content;
+  return portal ? /* @__PURE__ */ jsx32(DropdownMenuPortal, { ...typeof portal === "object" ? portal : {}, children: content }) : content;
 });
 DropdownMenuContent2.displayName = DropdownMenuPrimitive2.Content.displayName;
 
 // src/components/tiptap-ui-primitive/card/card.tsx
 import { forwardRef as forwardRef8 } from "react";
-import { jsx as jsx31 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 var Card = forwardRef8(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx31("div", { ref, className: cn2("tiptap-card", className), ...props });
+    return /* @__PURE__ */ jsx33("div", { ref, className: cn2("tiptap-card", className), ...props });
   }
 );
 Card.displayName = "Card";
 var CardHeader = forwardRef8(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx31(
+    return /* @__PURE__ */ jsx33(
       "div",
       {
         ref,
@@ -3480,12 +3688,12 @@ var CardHeader = forwardRef8(
 CardHeader.displayName = "CardHeader";
 var CardBody = forwardRef8(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx31("div", { ref, className: cn2("tiptap-card-body", className), ...props });
+    return /* @__PURE__ */ jsx33("div", { ref, className: cn2("tiptap-card-body", className), ...props });
   }
 );
 CardBody.displayName = "CardBody";
 var CardItemGroup = forwardRef8(({ className, orientation = "vertical", ...props }, ref) => {
-  return /* @__PURE__ */ jsx31(
+  return /* @__PURE__ */ jsx33(
     "div",
     {
       ref,
@@ -3498,7 +3706,7 @@ var CardItemGroup = forwardRef8(({ className, orientation = "vertical", ...props
 CardItemGroup.displayName = "CardItemGroup";
 var CardGroupLabel = forwardRef8(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx31(
+    return /* @__PURE__ */ jsx33(
       "div",
       {
         ref,
@@ -3511,7 +3719,7 @@ var CardGroupLabel = forwardRef8(
 CardGroupLabel.displayName = "CardGroupLabel";
 var CardFooter = forwardRef8(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx31(
+    return /* @__PURE__ */ jsx33(
       "div",
       {
         ref,
@@ -3524,7 +3732,7 @@ var CardFooter = forwardRef8(
 CardFooter.displayName = "CardFooter";
 
 // src/components/tiptap-ui/heading-dropdown-menu/heading-dropdown-menu.tsx
-import { jsx as jsx32, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs17 } from "react/jsx-runtime";
 var HeadingDropdownMenu = forwardRef9(
   ({
     editor: providedEditor,
@@ -3541,7 +3749,7 @@ var HeadingDropdownMenu = forwardRef9(
       levels,
       hideWhenUnavailable
     });
-    const handleOpenChange = useCallback7(
+    const handleOpenChange = useCallback8(
       (open) => {
         if (!editor || !canToggle2) return;
         setIsOpen(open);
@@ -3553,7 +3761,7 @@ var HeadingDropdownMenu = forwardRef9(
       return null;
     }
     return /* @__PURE__ */ jsxs17(DropdownMenu2, { modal: true, open: isOpen, onOpenChange: handleOpenChange, children: [
-      /* @__PURE__ */ jsx32(DropdownMenuTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs17(
+      /* @__PURE__ */ jsx34(DropdownMenuTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs17(
         Button2,
         {
           type: "button",
@@ -3569,12 +3777,12 @@ var HeadingDropdownMenu = forwardRef9(
           ...buttonProps,
           ref,
           children: [
-            /* @__PURE__ */ jsx32(Icon, { className: "tiptap-button-icon" }),
-            /* @__PURE__ */ jsx32(ChevronDownIcon, { className: "tiptap-button-dropdown-small" })
+            /* @__PURE__ */ jsx34(Icon, { className: "tiptap-button-icon" }),
+            /* @__PURE__ */ jsx34(ChevronDownIcon, { className: "tiptap-button-dropdown-small" })
           ]
         }
       ) }),
-      /* @__PURE__ */ jsx32(DropdownMenuContent2, { align: "start", portal, children: /* @__PURE__ */ jsx32(Card, { children: /* @__PURE__ */ jsx32(CardBody, { children: /* @__PURE__ */ jsx32(ButtonGroup, { children: levels.map((level) => /* @__PURE__ */ jsx32(DropdownMenuItem2, { asChild: true, children: /* @__PURE__ */ jsx32(
+      /* @__PURE__ */ jsx34(DropdownMenuContent2, { align: "start", portal, children: /* @__PURE__ */ jsx34(Card, { children: /* @__PURE__ */ jsx34(CardBody, { children: /* @__PURE__ */ jsx34(ButtonGroup, { children: levels.map((level) => /* @__PURE__ */ jsx34(DropdownMenuItem2, { asChild: true, children: /* @__PURE__ */ jsx34(
         HeadingButton,
         {
           editor,
@@ -3592,10 +3800,10 @@ HeadingDropdownMenu.displayName = "HeadingDropdownMenu";
 import { useEffect as useEffect6, useState as useState11 } from "react";
 
 // src/components/tiptap-icons/heading-icon.tsx
-import { memo as memo9 } from "react";
-import { jsx as jsx33 } from "react/jsx-runtime";
-var HeadingIcon = memo9(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx33(
+import { memo as memo10 } from "react";
+import { jsx as jsx35 } from "react/jsx-runtime";
+var HeadingIcon = memo10(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx35(
     "svg",
     {
       width: "24",
@@ -3605,7 +3813,7 @@ var HeadingIcon = memo9(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx33(
+      children: /* @__PURE__ */ jsx35(
         "path",
         {
           d: "M6 3C6.55228 3 7 3.44772 7 4V11H17V4C17 3.44772 17.4477 3 18 3C18.5523 3 19 3.44772 19 4V20C19 20.5523 18.5523 21 18 21C17.4477 21 17 20.5523 17 20V13H7V20C7 20.5523 6.55228 21 6 21C5.44772 21 5 20.5523 5 20V4C5 3.44772 5.44772 3 6 3Z",
@@ -3658,12 +3866,12 @@ function useHeadingDropdownMenu(config) {
 }
 
 // src/components/tiptap-ui/image-upload-button/image-upload-button.tsx
-import { forwardRef as forwardRef10, useCallback as useCallback8 } from "react";
-import { Fragment as Fragment4, jsx as jsx34, jsxs as jsxs18 } from "react/jsx-runtime";
+import { forwardRef as forwardRef10, useCallback as useCallback9 } from "react";
+import { Fragment as Fragment4, jsx as jsx36, jsxs as jsxs18 } from "react/jsx-runtime";
 function ImageShortcutBadge({
   shortcutKeys = IMAGE_UPLOAD_SHORTCUT_KEY
 }) {
-  return /* @__PURE__ */ jsx34(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
+  return /* @__PURE__ */ jsx36(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
 }
 var ImageUploadButton = forwardRef10(
   ({
@@ -3691,7 +3899,7 @@ var ImageUploadButton = forwardRef10(
       hideWhenUnavailable,
       onInserted
     });
-    const handleClick = useCallback8(
+    const handleClick = useCallback9(
       async (event) => {
         onClick?.(event);
         if (event.defaultPrevented) return;
@@ -3703,7 +3911,7 @@ var ImageUploadButton = forwardRef10(
       return null;
     }
     const RenderIcon = CustomIcon ?? Icon;
-    return /* @__PURE__ */ jsx34(
+    return /* @__PURE__ */ jsx36(
       Button2,
       {
         type: "button",
@@ -3720,9 +3928,9 @@ var ImageUploadButton = forwardRef10(
         ...buttonProps,
         ref,
         children: children ?? /* @__PURE__ */ jsxs18(Fragment4, { children: [
-          /* @__PURE__ */ jsx34(RenderIcon, { className: "tiptap-button-icon" }),
-          text && /* @__PURE__ */ jsx34("span", { className: "tiptap-button-text", children: text }),
-          showShortcut && /* @__PURE__ */ jsx34(ImageShortcutBadge, { shortcutKeys })
+          /* @__PURE__ */ jsx36(RenderIcon, { className: "tiptap-button-icon" }),
+          text && /* @__PURE__ */ jsx36("span", { className: "tiptap-button-text", children: text }),
+          showShortcut && /* @__PURE__ */ jsx36(ImageShortcutBadge, { shortcutKeys })
         ] })
       }
     );
@@ -3731,7 +3939,7 @@ var ImageUploadButton = forwardRef10(
 ImageUploadButton.displayName = "ImageUploadButton";
 
 // src/components/tiptap-ui/image-upload-button/use-image-upload.ts
-import { useCallback as useCallback9, useEffect as useEffect8, useState as useState13 } from "react";
+import { useCallback as useCallback10, useEffect as useEffect8, useState as useState13 } from "react";
 import { useHotkeys } from "react-hotkeys-hook";
 
 // src/hooks/use-is-breakpoint.ts
@@ -3750,10 +3958,10 @@ function useIsBreakpoint(mode = "max", breakpoint = 768) {
 }
 
 // src/components/tiptap-icons/image-plus-icon.tsx
-import { memo as memo10 } from "react";
-import { jsx as jsx35 } from "react/jsx-runtime";
-var ImagePlusIcon = memo10(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx35(
+import { memo as memo11 } from "react";
+import { jsx as jsx37 } from "react/jsx-runtime";
+var ImagePlusIcon = memo11(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx37(
     "svg",
     {
       width: "24",
@@ -3763,7 +3971,7 @@ var ImagePlusIcon = memo10(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx35(
+      children: /* @__PURE__ */ jsx37(
         "path",
         {
           fillRule: "evenodd",
@@ -3851,7 +4059,7 @@ function useImageUpload(config) {
       editor.off("selectionUpdate", handleSelectionUpdate);
     };
   }, [editor, hideWhenUnavailable]);
-  const handleImage = useCallback9(async () => {
+  const handleImage = useCallback10(async () => {
     if (!editor) return false;
     const success = insertImage(editor);
     if (await success) {
@@ -3883,16 +4091,16 @@ function useImageUpload(config) {
 }
 
 // src/components/tiptap-ui/list-dropdown-menu/list-dropdown-menu.tsx
-import { useCallback as useCallback12, useState as useState16 } from "react";
+import { useCallback as useCallback13, useState as useState16 } from "react";
 
 // src/components/tiptap-ui/list-button/list-button.tsx
-import { forwardRef as forwardRef11, useCallback as useCallback10 } from "react";
-import { Fragment as Fragment5, jsx as jsx36, jsxs as jsxs19 } from "react/jsx-runtime";
+import { forwardRef as forwardRef11, useCallback as useCallback11 } from "react";
+import { Fragment as Fragment5, jsx as jsx38, jsxs as jsxs19 } from "react/jsx-runtime";
 function ListShortcutBadge({
   type,
   shortcutKeys = LIST_SHORTCUT_KEYS[type]
 }) {
-  return /* @__PURE__ */ jsx36(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
+  return /* @__PURE__ */ jsx38(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
 }
 var ListButton = forwardRef11(
   ({
@@ -3921,7 +4129,7 @@ var ListButton = forwardRef11(
       hideWhenUnavailable,
       onToggled
     });
-    const handleClick = useCallback10(
+    const handleClick = useCallback11(
       (event) => {
         onClick?.(event);
         if (event.defaultPrevented) return;
@@ -3932,7 +4140,7 @@ var ListButton = forwardRef11(
     if (!isVisible) {
       return null;
     }
-    return /* @__PURE__ */ jsx36(
+    return /* @__PURE__ */ jsx38(
       Button2,
       {
         type: "button",
@@ -3949,9 +4157,9 @@ var ListButton = forwardRef11(
         ...buttonProps,
         ref,
         children: children ?? /* @__PURE__ */ jsxs19(Fragment5, { children: [
-          /* @__PURE__ */ jsx36(Icon, { className: "tiptap-button-icon" }),
-          text && /* @__PURE__ */ jsx36("span", { className: "tiptap-button-text", children: text }),
-          showShortcut && /* @__PURE__ */ jsx36(ListShortcutBadge, { type, shortcutKeys })
+          /* @__PURE__ */ jsx38(Icon, { className: "tiptap-button-icon" }),
+          text && /* @__PURE__ */ jsx38("span", { className: "tiptap-button-text", children: text }),
+          showShortcut && /* @__PURE__ */ jsx38(ListShortcutBadge, { type, shortcutKeys })
         ] })
       }
     );
@@ -3960,13 +4168,13 @@ var ListButton = forwardRef11(
 ListButton.displayName = "ListButton";
 
 // src/components/tiptap-ui/list-button/use-list.ts
-import { useCallback as useCallback11, useEffect as useEffect9, useState as useState14 } from "react";
+import { useCallback as useCallback12, useEffect as useEffect9, useState as useState14 } from "react";
 import { NodeSelection as NodeSelection3, TextSelection as TextSelection3 } from "@tiptap/pm/state";
 
 // src/components/tiptap-icons/list-icon.tsx
-import { memo as memo11 } from "react";
-import { jsx as jsx37, jsxs as jsxs20 } from "react/jsx-runtime";
-var ListIcon = memo11(({ className, ...props }) => {
+import { memo as memo12 } from "react";
+import { jsx as jsx39, jsxs as jsxs20 } from "react/jsx-runtime";
+var ListIcon = memo12(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs20(
     "svg",
     {
@@ -3978,7 +4186,7 @@ var ListIcon = memo11(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx39(
           "path",
           {
             fillRule: "evenodd",
@@ -3987,7 +4195,7 @@ var ListIcon = memo11(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx39(
           "path",
           {
             fillRule: "evenodd",
@@ -3996,7 +4204,7 @@ var ListIcon = memo11(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx39(
           "path",
           {
             fillRule: "evenodd",
@@ -4005,7 +4213,7 @@ var ListIcon = memo11(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx39(
           "path",
           {
             fillRule: "evenodd",
@@ -4014,7 +4222,7 @@ var ListIcon = memo11(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx39(
           "path",
           {
             fillRule: "evenodd",
@@ -4023,7 +4231,7 @@ var ListIcon = memo11(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx39(
           "path",
           {
             fillRule: "evenodd",
@@ -4039,9 +4247,9 @@ var ListIcon = memo11(({ className, ...props }) => {
 ListIcon.displayName = "ListIcon";
 
 // src/components/tiptap-icons/list-ordered-icon.tsx
-import { memo as memo12 } from "react";
-import { jsx as jsx38, jsxs as jsxs21 } from "react/jsx-runtime";
-var ListOrderedIcon = memo12(({ className, ...props }) => {
+import { memo as memo13 } from "react";
+import { jsx as jsx40, jsxs as jsxs21 } from "react/jsx-runtime";
+var ListOrderedIcon = memo13(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs21(
     "svg",
     {
@@ -4053,7 +4261,7 @@ var ListOrderedIcon = memo12(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx38(
+        /* @__PURE__ */ jsx40(
           "path",
           {
             fillRule: "evenodd",
@@ -4062,7 +4270,7 @@ var ListOrderedIcon = memo12(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx38(
+        /* @__PURE__ */ jsx40(
           "path",
           {
             fillRule: "evenodd",
@@ -4071,7 +4279,7 @@ var ListOrderedIcon = memo12(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx38(
+        /* @__PURE__ */ jsx40(
           "path",
           {
             fillRule: "evenodd",
@@ -4080,7 +4288,7 @@ var ListOrderedIcon = memo12(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx38(
+        /* @__PURE__ */ jsx40(
           "path",
           {
             fillRule: "evenodd",
@@ -4089,7 +4297,7 @@ var ListOrderedIcon = memo12(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx38(
+        /* @__PURE__ */ jsx40(
           "path",
           {
             fillRule: "evenodd",
@@ -4098,7 +4306,7 @@ var ListOrderedIcon = memo12(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx38(
+        /* @__PURE__ */ jsx40(
           "path",
           {
             fillRule: "evenodd",
@@ -4114,9 +4322,9 @@ var ListOrderedIcon = memo12(({ className, ...props }) => {
 ListOrderedIcon.displayName = "ListOrderedIcon";
 
 // src/components/tiptap-icons/list-todo-icon.tsx
-import { memo as memo13 } from "react";
-import { jsx as jsx39, jsxs as jsxs22 } from "react/jsx-runtime";
-var ListTodoIcon = memo13(({ className, ...props }) => {
+import { memo as memo14 } from "react";
+import { jsx as jsx41, jsxs as jsxs22 } from "react/jsx-runtime";
+var ListTodoIcon = memo14(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs22(
     "svg",
     {
@@ -4128,7 +4336,7 @@ var ListTodoIcon = memo13(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx39(
+        /* @__PURE__ */ jsx41(
           "path",
           {
             fillRule: "evenodd",
@@ -4137,7 +4345,7 @@ var ListTodoIcon = memo13(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx39(
+        /* @__PURE__ */ jsx41(
           "path",
           {
             fillRule: "evenodd",
@@ -4146,7 +4354,7 @@ var ListTodoIcon = memo13(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx39(
+        /* @__PURE__ */ jsx41(
           "path",
           {
             fillRule: "evenodd",
@@ -4155,7 +4363,7 @@ var ListTodoIcon = memo13(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx39(
+        /* @__PURE__ */ jsx41(
           "path",
           {
             fillRule: "evenodd",
@@ -4164,7 +4372,7 @@ var ListTodoIcon = memo13(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx39(
+        /* @__PURE__ */ jsx41(
           "path",
           {
             fillRule: "evenodd",
@@ -4322,7 +4530,7 @@ function useList(config) {
       editor.off("selectionUpdate", handleSelectionUpdate);
     };
   }, [editor, type, hideWhenUnavailable]);
-  const handleToggle = useCallback11(() => {
+  const handleToggle = useCallback12(() => {
     if (!editor) return false;
     const success = toggleList(editor, type);
     if (success) {
@@ -4342,7 +4550,7 @@ function useList(config) {
 }
 
 // src/components/tiptap-ui/list-dropdown-menu/use-list-dropdown-menu.ts
-import { useEffect as useEffect10, useMemo as useMemo5, useState as useState15 } from "react";
+import { useEffect as useEffect10, useMemo as useMemo7, useState as useState15 } from "react";
 var listOptions = [
   {
     label: "Bullet List",
@@ -4396,7 +4604,7 @@ function useListDropdownMenu(config) {
   const { editor } = useTiptapEditor(providedEditor);
   const [isVisible, setIsVisible] = useState15(true);
   const listInSchema = types.some((type) => isNodeInSchema(type, editor));
-  const filteredLists = useMemo5(() => getFilteredListOptions(types), [types]);
+  const filteredLists = useMemo7(() => getFilteredListOptions(types), [types]);
   const canToggleAny = canToggleAnyList(editor, types);
   const isAnyActive = isAnyListActive(editor, types);
   const activeType = getActiveListType(editor, types);
@@ -4433,7 +4641,7 @@ function useListDropdownMenu(config) {
 }
 
 // src/components/tiptap-ui/list-dropdown-menu/list-dropdown-menu.tsx
-import { jsx as jsx40, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs23 } from "react/jsx-runtime";
 function ListDropdownMenu({
   editor: providedEditor,
   types = ["bulletList", "orderedList", "taskList"],
@@ -4449,7 +4657,7 @@ function ListDropdownMenu({
     types,
     hideWhenUnavailable
   });
-  const handleOnOpenChange = useCallback12(
+  const handleOnOpenChange = useCallback13(
     (open) => {
       setIsOpen(open);
       onOpenChange?.(open);
@@ -4460,7 +4668,7 @@ function ListDropdownMenu({
     return null;
   }
   return /* @__PURE__ */ jsxs23(DropdownMenu2, { open: isOpen, onOpenChange: handleOnOpenChange, children: [
-    /* @__PURE__ */ jsx40(DropdownMenuTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs23(
+    /* @__PURE__ */ jsx42(DropdownMenuTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs23(
       Button2,
       {
         type: "button",
@@ -4474,12 +4682,12 @@ function ListDropdownMenu({
         tooltip: "List",
         ...props,
         children: [
-          /* @__PURE__ */ jsx40(Icon, { className: "tiptap-button-icon" }),
-          /* @__PURE__ */ jsx40(ChevronDownIcon, { className: "tiptap-button-dropdown-small" })
+          /* @__PURE__ */ jsx42(Icon, { className: "tiptap-button-icon" }),
+          /* @__PURE__ */ jsx42(ChevronDownIcon, { className: "tiptap-button-dropdown-small" })
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx40(DropdownMenuContent2, { align: "start", portal, children: /* @__PURE__ */ jsx40(Card, { children: /* @__PURE__ */ jsx40(CardBody, { children: /* @__PURE__ */ jsx40(ButtonGroup, { children: filteredLists.map((option) => /* @__PURE__ */ jsx40(DropdownMenuItem2, { asChild: true, children: /* @__PURE__ */ jsx40(
+    /* @__PURE__ */ jsx42(DropdownMenuContent2, { align: "start", portal, children: /* @__PURE__ */ jsx42(Card, { children: /* @__PURE__ */ jsx42(CardBody, { children: /* @__PURE__ */ jsx42(ButtonGroup, { children: filteredLists.map((option) => /* @__PURE__ */ jsx42(DropdownMenuItem2, { asChild: true, children: /* @__PURE__ */ jsx42(
       ListButton,
       {
         editor,
@@ -4492,12 +4700,12 @@ function ListDropdownMenu({
 }
 
 // src/components/tiptap-ui/blockquote-button/blockquote-button.tsx
-import { forwardRef as forwardRef12, useCallback as useCallback13 } from "react";
-import { Fragment as Fragment6, jsx as jsx41, jsxs as jsxs24 } from "react/jsx-runtime";
+import { forwardRef as forwardRef12, useCallback as useCallback14 } from "react";
+import { Fragment as Fragment6, jsx as jsx43, jsxs as jsxs24 } from "react/jsx-runtime";
 function BlockquoteShortcutBadge({
   shortcutKeys = BLOCKQUOTE_SHORTCUT_KEY
 }) {
-  return /* @__PURE__ */ jsx41(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
+  return /* @__PURE__ */ jsx43(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
 }
 var BlockquoteButton = forwardRef12(
   ({
@@ -4524,7 +4732,7 @@ var BlockquoteButton = forwardRef12(
       hideWhenUnavailable,
       onToggled
     });
-    const handleClick = useCallback13(
+    const handleClick = useCallback14(
       (event) => {
         onClick?.(event);
         if (event.defaultPrevented) return;
@@ -4535,7 +4743,7 @@ var BlockquoteButton = forwardRef12(
     if (!isVisible) {
       return null;
     }
-    return /* @__PURE__ */ jsx41(
+    return /* @__PURE__ */ jsx43(
       Button2,
       {
         type: "button",
@@ -4552,9 +4760,9 @@ var BlockquoteButton = forwardRef12(
         ...buttonProps,
         ref,
         children: children ?? /* @__PURE__ */ jsxs24(Fragment6, { children: [
-          /* @__PURE__ */ jsx41(Icon, { className: "tiptap-button-icon" }),
-          text && /* @__PURE__ */ jsx41("span", { className: "tiptap-button-text", children: text }),
-          showShortcut && /* @__PURE__ */ jsx41(BlockquoteShortcutBadge, { shortcutKeys })
+          /* @__PURE__ */ jsx43(Icon, { className: "tiptap-button-icon" }),
+          text && /* @__PURE__ */ jsx43("span", { className: "tiptap-button-text", children: text }),
+          showShortcut && /* @__PURE__ */ jsx43(BlockquoteShortcutBadge, { shortcutKeys })
         ] })
       }
     );
@@ -4563,13 +4771,13 @@ var BlockquoteButton = forwardRef12(
 BlockquoteButton.displayName = "BlockquoteButton";
 
 // src/components/tiptap-ui/blockquote-button/use-blockquote.ts
-import { useCallback as useCallback14, useEffect as useEffect11, useState as useState17 } from "react";
+import { useCallback as useCallback15, useEffect as useEffect11, useState as useState17 } from "react";
 import { NodeSelection as NodeSelection4, TextSelection as TextSelection4 } from "@tiptap/pm/state";
 
 // src/components/tiptap-icons/blockquote-icon.tsx
-import { memo as memo14 } from "react";
-import { jsx as jsx42, jsxs as jsxs25 } from "react/jsx-runtime";
-var BlockquoteIcon = memo14(({ className, ...props }) => {
+import { memo as memo15 } from "react";
+import { jsx as jsx44, jsxs as jsxs25 } from "react/jsx-runtime";
+var BlockquoteIcon = memo15(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs25(
     "svg",
     {
@@ -4581,7 +4789,7 @@ var BlockquoteIcon = memo14(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx42(
+        /* @__PURE__ */ jsx44(
           "path",
           {
             fillRule: "evenodd",
@@ -4590,7 +4798,7 @@ var BlockquoteIcon = memo14(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx42(
+        /* @__PURE__ */ jsx44(
           "path",
           {
             fillRule: "evenodd",
@@ -4599,7 +4807,7 @@ var BlockquoteIcon = memo14(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx42(
+        /* @__PURE__ */ jsx44(
           "path",
           {
             fillRule: "evenodd",
@@ -4608,7 +4816,7 @@ var BlockquoteIcon = memo14(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx42(
+        /* @__PURE__ */ jsx44(
           "path",
           {
             fillRule: "evenodd",
@@ -4710,7 +4918,7 @@ function useBlockquote(config) {
       editor.off("selectionUpdate", handleSelectionUpdate);
     };
   }, [editor, hideWhenUnavailable]);
-  const handleToggle = useCallback14(() => {
+  const handleToggle = useCallback15(() => {
     if (!editor) return false;
     const success = toggleBlockquote(editor);
     if (success) {
@@ -4730,13 +4938,13 @@ function useBlockquote(config) {
 }
 
 // src/components/tiptap-ui/color-highlight-popover/color-highlight-popover.tsx
-import { forwardRef as forwardRef14, useMemo as useMemo7, useRef as useRef5, useState as useState19 } from "react";
+import { forwardRef as forwardRef14, useMemo as useMemo9, useRef as useRef6, useState as useState19 } from "react";
 
 // src/components/tiptap-icons/ban-icon.tsx
-import { memo as memo15 } from "react";
-import { jsx as jsx43 } from "react/jsx-runtime";
-var BanIcon = memo15(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx43(
+import { memo as memo16 } from "react";
+import { jsx as jsx45 } from "react/jsx-runtime";
+var BanIcon = memo16(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx45(
     "svg",
     {
       width: "24",
@@ -4746,7 +4954,7 @@ var BanIcon = memo15(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx43(
+      children: /* @__PURE__ */ jsx45(
         "path",
         {
           fillRule: "evenodd",
@@ -4761,10 +4969,10 @@ var BanIcon = memo15(({ className, ...props }) => {
 BanIcon.displayName = "BanIcon";
 
 // src/components/tiptap-icons/highlighter-icon.tsx
-import { memo as memo16 } from "react";
-import { jsx as jsx44 } from "react/jsx-runtime";
-var HighlighterIcon = memo16(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx44(
+import { memo as memo17 } from "react";
+import { jsx as jsx46 } from "react/jsx-runtime";
+var HighlighterIcon = memo17(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx46(
     "svg",
     {
       width: "24",
@@ -4774,7 +4982,7 @@ var HighlighterIcon = memo16(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx44(
+      children: /* @__PURE__ */ jsx46(
         "path",
         {
           fillRule: "evenodd",
@@ -4790,16 +4998,16 @@ HighlighterIcon.displayName = "HighlighterIcon";
 
 // src/components/tiptap-ui-primitive/popover/popover.tsx
 import * as PopoverPrimitive from "@radix-ui/react-popover";
-import { jsx as jsx45 } from "react/jsx-runtime";
+import { jsx as jsx47 } from "react/jsx-runtime";
 function Popover({
   ...props
 }) {
-  return /* @__PURE__ */ jsx45(PopoverPrimitive.Root, { ...props });
+  return /* @__PURE__ */ jsx47(PopoverPrimitive.Root, { ...props });
 }
 function PopoverTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ jsx45(PopoverPrimitive.Trigger, { ...props });
+  return /* @__PURE__ */ jsx47(PopoverPrimitive.Trigger, { ...props });
 }
 function PopoverContent({
   className,
@@ -4807,7 +5015,7 @@ function PopoverContent({
   sideOffset = 4,
   ...props
 }) {
-  return /* @__PURE__ */ jsx45(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx47(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx47(
     PopoverPrimitive.Content,
     {
       align,
@@ -4819,12 +5027,12 @@ function PopoverContent({
 }
 
 // src/components/tiptap-ui/color-highlight-button/color-highlight-button.tsx
-import { forwardRef as forwardRef13, useCallback as useCallback15, useMemo as useMemo6 } from "react";
-import { Fragment as Fragment7, jsx as jsx46, jsxs as jsxs26 } from "react/jsx-runtime";
+import { forwardRef as forwardRef13, useCallback as useCallback16, useMemo as useMemo8 } from "react";
+import { Fragment as Fragment7, jsx as jsx48, jsxs as jsxs26 } from "react/jsx-runtime";
 function ColorHighlightShortcutBadge({
   shortcutKeys = COLOR_HIGHLIGHT_SHORTCUT_KEY
 }) {
-  return /* @__PURE__ */ jsx46(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
+  return /* @__PURE__ */ jsx48(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
 }
 var ColorHighlightButton = forwardRef13(
   ({
@@ -4856,7 +5064,7 @@ var ColorHighlightButton = forwardRef13(
       mode,
       onApplied
     });
-    const handleClick = useCallback15(
+    const handleClick = useCallback16(
       (event) => {
         onClick?.(event);
         if (event.defaultPrevented) return;
@@ -4864,7 +5072,7 @@ var ColorHighlightButton = forwardRef13(
       },
       [handleColorHighlight, onClick]
     );
-    const buttonStyle = useMemo6(
+    const buttonStyle = useMemo8(
       () => ({
         ...style,
         "--highlight-color": highlightColor
@@ -4874,7 +5082,7 @@ var ColorHighlightButton = forwardRef13(
     if (!isVisible) {
       return null;
     }
-    return /* @__PURE__ */ jsx46(
+    return /* @__PURE__ */ jsx48(
       Button2,
       {
         type: "button",
@@ -4892,15 +5100,15 @@ var ColorHighlightButton = forwardRef13(
         ...buttonProps,
         ref,
         children: children ?? /* @__PURE__ */ jsxs26(Fragment7, { children: [
-          /* @__PURE__ */ jsx46(
+          /* @__PURE__ */ jsx48(
             "span",
             {
               className: "tiptap-button-highlight",
               style: { "--highlight-color": highlightColor }
             }
           ),
-          text && /* @__PURE__ */ jsx46("span", { className: "tiptap-button-text", children: text }),
-          showShortcut && /* @__PURE__ */ jsx46(ColorHighlightShortcutBadge, { shortcutKeys })
+          text && /* @__PURE__ */ jsx48("span", { className: "tiptap-button-text", children: text }),
+          showShortcut && /* @__PURE__ */ jsx48(ColorHighlightShortcutBadge, { shortcutKeys })
         ] })
       }
     );
@@ -4909,7 +5117,7 @@ var ColorHighlightButton = forwardRef13(
 ColorHighlightButton.displayName = "ColorHighlightButton";
 
 // src/components/tiptap-ui/color-highlight-button/use-color-highlight.ts
-import { useCallback as useCallback16, useEffect as useEffect12, useState as useState18 } from "react";
+import { useCallback as useCallback17, useEffect as useEffect12, useState as useState18 } from "react";
 import { useHotkeys as useHotkeys2 } from "react-hotkeys-hook";
 var COLOR_HIGHLIGHT_SHORTCUT_KEY = "mod+shift+h";
 var HIGHLIGHT_COLORS = [
@@ -5054,7 +5262,7 @@ function useColorHighlight(config) {
       editor.off("selectionUpdate", handleSelectionUpdate);
     };
   }, [editor, hideWhenUnavailable, mode]);
-  const handleColorHighlight = useCallback16(() => {
+  const handleColorHighlight = useCallback17(() => {
     if (!editor || !canColorHighlightState || !highlightColor || !label)
       return false;
     if (mode === "mark") {
@@ -5082,7 +5290,7 @@ function useColorHighlight(config) {
       return success;
     }
   }, [canColorHighlightState, highlightColor, editor, label, onApplied, mode]);
-  const handleRemoveHighlight = useCallback16(() => {
+  const handleRemoveHighlight = useCallback17(() => {
     const success = removeHighlight(editor, mode);
     if (success) {
       onApplied?.({ color: "", label: "Remove highlight", mode });
@@ -5115,8 +5323,8 @@ function useColorHighlight(config) {
 }
 
 // src/components/tiptap-ui/color-highlight-popover/color-highlight-popover.tsx
-import { jsx as jsx47, jsxs as jsxs27 } from "react/jsx-runtime";
-var ColorHighlightPopoverButton = forwardRef14(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx47(
+import { jsx as jsx49, jsxs as jsxs27 } from "react/jsx-runtime";
+var ColorHighlightPopoverButton = forwardRef14(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx49(
   Button2,
   {
     type: "button",
@@ -5129,7 +5337,7 @@ var ColorHighlightPopoverButton = forwardRef14(({ className, children, ...props
     tooltip: "Highlight",
     ref,
     ...props,
-    children: children ?? /* @__PURE__ */ jsx47(HighlighterIcon, { className: "tiptap-button-icon" })
+    children: children ?? /* @__PURE__ */ jsx49(HighlighterIcon, { className: "tiptap-button-icon" })
   }
 ));
 ColorHighlightPopoverButton.displayName = "ColorHighlightPopoverButton";
@@ -5145,8 +5353,8 @@ function ColorHighlightPopoverContent({
 }) {
   const { handleRemoveHighlight } = useColorHighlight({ editor });
   const isMobile = useIsBreakpoint();
-  const containerRef = useRef5(null);
-  const menuItems = useMemo7(
+  const containerRef = useRef6(null);
+  const menuItems = useMemo9(
     () => [...colors, { label: "Remove highlight", value: "none" }],
     [colors]
   );
@@ -5165,14 +5373,14 @@ function ColorHighlightPopoverContent({
     },
     autoSelectFirstItem: false
   });
-  return /* @__PURE__ */ jsx47(
+  return /* @__PURE__ */ jsx49(
     Card,
     {
       ref: containerRef,
       tabIndex: 0,
       style: isMobile ? { boxShadow: "none", border: 0 } : {},
-      children: /* @__PURE__ */ jsx47(CardBody, { style: isMobile ? { padding: 0 } : {}, children: /* @__PURE__ */ jsxs27(CardItemGroup, { orientation: "horizontal", children: [
-        /* @__PURE__ */ jsx47(ButtonGroup, { orientation: "horizontal", children: colors.map((color, index) => /* @__PURE__ */ jsx47(
+      children: /* @__PURE__ */ jsx49(CardBody, { style: isMobile ? { padding: 0 } : {}, children: /* @__PURE__ */ jsxs27(CardItemGroup, { orientation: "horizontal", children: [
+        /* @__PURE__ */ jsx49(ButtonGroup, { orientation: "horizontal", children: colors.map((color, index) => /* @__PURE__ */ jsx49(
           ColorHighlightButton,
           {
             editor,
@@ -5184,8 +5392,8 @@ function ColorHighlightPopoverContent({
           },
           color.value
         )) }),
-        /* @__PURE__ */ jsx47(Separator3, {}),
-        /* @__PURE__ */ jsx47(ButtonGroup, { orientation: "horizontal", children: /* @__PURE__ */ jsx47(
+        /* @__PURE__ */ jsx49(Separator3, {}),
+        /* @__PURE__ */ jsx49(ButtonGroup, { orientation: "horizontal", children: /* @__PURE__ */ jsx49(
           Button2,
           {
             onClick: handleRemoveHighlight,
@@ -5196,7 +5404,7 @@ function ColorHighlightPopoverContent({
             role: "menuitem",
             "data-style": "ghost",
             "data-highlighted": selectedIndex === colors.length,
-            children: /* @__PURE__ */ jsx47(BanIcon, { className: "tiptap-button-icon" })
+            children: /* @__PURE__ */ jsx49(BanIcon, { className: "tiptap-button-icon" })
           }
         ) })
       ] }) })
@@ -5205,13 +5413,13 @@ function ColorHighlightPopoverContent({
 }
 
 // src/components/tiptap-ui/link-popover/link-popover.tsx
-import { forwardRef as forwardRef15, useCallback as useCallback17, useEffect as useEffect13, useState as useState20 } from "react";
+import { forwardRef as forwardRef15, useCallback as useCallback18, useEffect as useEffect13, useState as useState20 } from "react";
 
 // src/components/tiptap-icons/corner-down-left-icon.tsx
-import { memo as memo17 } from "react";
-import { jsx as jsx48 } from "react/jsx-runtime";
-var CornerDownLeftIcon = memo17(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx48(
+import { memo as memo18 } from "react";
+import { jsx as jsx50 } from "react/jsx-runtime";
+var CornerDownLeftIcon = memo18(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx50(
     "svg",
     {
       width: "24",
@@ -5221,7 +5429,7 @@ var CornerDownLeftIcon = memo17(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx48(
+      children: /* @__PURE__ */ jsx50(
         "path",
         {
           fillRule: "evenodd",
@@ -5236,9 +5444,9 @@ var CornerDownLeftIcon = memo17(({ className, ...props }) => {
 CornerDownLeftIcon.displayName = "CornerDownLeftIcon";
 
 // src/components/tiptap-icons/external-link-icon.tsx
-import { memo as memo18 } from "react";
-import { jsx as jsx49, jsxs as jsxs28 } from "react/jsx-runtime";
-var ExternalLinkIcon = memo18(({ className, ...props }) => {
+import { memo as memo19 } from "react";
+import { jsx as jsx51, jsxs as jsxs28 } from "react/jsx-runtime";
+var ExternalLinkIcon = memo19(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs28(
     "svg",
     {
@@ -5250,14 +5458,14 @@ var ExternalLinkIcon = memo18(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx49(
+        /* @__PURE__ */ jsx51(
           "path",
           {
             d: "M14 3C14 2.44772 14.4477 2 15 2H21C21.5523 2 22 2.44772 22 3V9C22 9.55228 21.5523 10 21 10C20.4477 10 20 9.55228 20 9V5.41421L10.7071 14.7071C10.3166 15.0976 9.68342 15.0976 9.29289 14.7071C8.90237 14.3166 8.90237 13.6834 9.29289 13.2929L18.5858 4H15C14.4477 4 14 3.55228 14 3Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx49(
+        /* @__PURE__ */ jsx51(
           "path",
           {
             d: "M4.29289 7.29289C4.48043 7.10536 4.73478 7 5 7H11C11.5523 7 12 6.55228 12 6C12 5.44772 11.5523 5 11 5H5C4.20435 5 3.44129 5.31607 2.87868 5.87868C2.31607 6.44129 2 7.20435 2 8V19C2 19.7957 2.31607 20.5587 2.87868 21.1213C3.44129 21.6839 4.20435 22 5 22H16C16.7957 22 17.5587 21.6839 18.1213 21.1213C18.6839 20.5587 19 19.7957 19 19V13C19 12.4477 18.5523 12 18 12C17.4477 12 17 12.4477 17 13V19C17 19.2652 16.8946 19.5196 16.7071 19.7071C16.5196 19.8946 16.2652 20 16 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V8C4 7.73478 4.10536 7.48043 4.29289 7.29289Z",
@@ -5271,9 +5479,9 @@ var ExternalLinkIcon = memo18(({ className, ...props }) => {
 ExternalLinkIcon.displayName = "ExternalLinkIcon";
 
 // src/components/tiptap-icons/link-icon.tsx
-import { memo as memo19 } from "react";
-import { jsx as jsx50, jsxs as jsxs29 } from "react/jsx-runtime";
-var LinkIcon = memo19(({ className, ...props }) => {
+import { memo as memo20 } from "react";
+import { jsx as jsx52, jsxs as jsxs29 } from "react/jsx-runtime";
+var LinkIcon = memo20(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs29(
     "svg",
     {
@@ -5285,14 +5493,14 @@ var LinkIcon = memo19(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx50(
+        /* @__PURE__ */ jsx52(
           "path",
           {
             d: "M16.9958 1.06669C15.4226 1.05302 13.907 1.65779 12.7753 2.75074L12.765 2.76086L11.045 4.47086C10.6534 4.86024 10.6515 5.49341 11.0409 5.88507C11.4303 6.27673 12.0634 6.27858 12.4551 5.88919L14.1697 4.18456C14.9236 3.45893 15.9319 3.05752 16.9784 3.06662C18.0272 3.07573 19.0304 3.49641 19.772 4.23804C20.5137 4.97967 20.9344 5.98292 20.9435 7.03171C20.9526 8.07776 20.5515 9.08563 19.8265 9.83941L16.833 12.8329C16.4274 13.2386 15.9393 13.5524 15.4019 13.7529C14.8645 13.9533 14.2903 14.0359 13.7181 13.9949C13.146 13.9539 12.5894 13.7904 12.0861 13.5154C11.5827 13.2404 11.1444 12.8604 10.8008 12.401C10.47 11.9588 9.84333 11.8685 9.40108 12.1993C8.95883 12.5301 8.86849 13.1568 9.1993 13.599C9.71464 14.288 10.3721 14.858 11.1272 15.2705C11.8822 15.683 12.7171 15.9283 13.5753 15.9898C14.4334 16.0513 15.2948 15.9274 16.1009 15.6267C16.907 15.326 17.639 14.8555 18.2473 14.247L21.2472 11.2471L21.2593 11.2347C22.3523 10.1031 22.9571 8.58751 22.9434 7.01433C22.9297 5.44115 22.2987 3.93628 21.1863 2.82383C20.0738 1.71138 18.5689 1.08036 16.9958 1.06669Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx50(
+        /* @__PURE__ */ jsx52(
           "path",
           {
             d: "M10.4247 8.0102C9.56657 7.94874 8.70522 8.07256 7.89911 8.37326C7.09305 8.67395 6.36096 9.14458 5.75272 9.753L2.75285 12.7529L2.74067 12.7653C1.64772 13.8969 1.04295 15.4125 1.05662 16.9857C1.07029 18.5589 1.70131 20.0637 2.81376 21.1762C3.9262 22.2886 5.43108 22.9196 7.00426 22.9333C8.57744 22.947 10.0931 22.3422 11.2247 21.2493L11.2371 21.2371L12.9471 19.5271C13.3376 19.1366 13.3376 18.5034 12.9471 18.1129C12.5565 17.7223 11.9234 17.7223 11.5328 18.1129L9.82932 19.8164C9.07555 20.5414 8.06768 20.9425 7.02164 20.9334C5.97285 20.9243 4.9696 20.5036 4.22797 19.762C3.48634 19.0203 3.06566 18.0171 3.05655 16.9683C3.04746 15.9222 3.44851 14.9144 4.17355 14.1606L7.16719 11.167C7.5727 10.7613 8.06071 10.4476 8.59811 10.2471C9.13552 10.0467 9.70976 9.96412 10.2819 10.0051C10.854 10.0461 11.4106 10.2096 11.9139 10.4846C12.4173 10.7596 12.8556 11.1397 13.1992 11.599C13.53 12.0412 14.1567 12.1316 14.5989 11.8007C15.0412 11.4699 15.1315 10.8433 14.8007 10.401C14.2854 9.71205 13.6279 9.14198 12.8729 8.72948C12.1178 8.31697 11.2829 8.07166 10.4247 8.0102Z",
@@ -5306,10 +5514,10 @@ var LinkIcon = memo19(({ className, ...props }) => {
 LinkIcon.displayName = "LinkIcon";
 
 // src/components/tiptap-icons/trash-icon.tsx
-import { memo as memo20 } from "react";
-import { jsx as jsx51 } from "react/jsx-runtime";
-var TrashIcon = memo20(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx51(
+import { memo as memo21 } from "react";
+import { jsx as jsx53 } from "react/jsx-runtime";
+var TrashIcon = memo21(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx53(
     "svg",
     {
       width: "24",
@@ -5319,7 +5527,7 @@ var TrashIcon = memo20(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx51(
+      children: /* @__PURE__ */ jsx53(
         "path",
         {
           fillRule: "evenodd",
@@ -5334,23 +5542,23 @@ var TrashIcon = memo20(({ className, ...props }) => {
 TrashIcon.displayName = "TrashIcon";
 
 // src/components/tiptap-ui-primitive/input/input.tsx
-import { jsx as jsx52 } from "react/jsx-runtime";
+import { jsx as jsx54 } from "react/jsx-runtime";
 function Input2({ className, type, ...props }) {
-  return /* @__PURE__ */ jsx52("input", { type, className: cn2("tiptap-input", className), ...props });
+  return /* @__PURE__ */ jsx54("input", { type, className: cn2("tiptap-input", className), ...props });
 }
 function InputGroup({
   className,
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx52("div", { className: cn2("tiptap-input-group", className), ...props, children });
+  return /* @__PURE__ */ jsx54("div", { className: cn2("tiptap-input-group", className), ...props, children });
 }
 
 // src/components/tiptap-ui/link-popover/link-popover.tsx
-import { jsx as jsx53, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx55, jsxs as jsxs30 } from "react/jsx-runtime";
 var LinkButton = forwardRef15(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx53(
+    return /* @__PURE__ */ jsx55(
       Button2,
       {
         type: "button",
@@ -5362,7 +5570,7 @@ var LinkButton = forwardRef15(
         tooltip: "Link",
         ref,
         ...props,
-        children: children || /* @__PURE__ */ jsx53(LinkIcon, { className: "tiptap-button-icon" })
+        children: children || /* @__PURE__ */ jsx55(LinkIcon, { className: "tiptap-button-icon" })
       }
     );
   }
@@ -5383,20 +5591,20 @@ var LinkMain = ({
       setLink();
     }
   };
-  return /* @__PURE__ */ jsx53(
+  return /* @__PURE__ */ jsx55(
     Card,
     {
       style: {
         ...isMobile ? { boxShadow: "none", border: 0 } : {}
       },
-      children: /* @__PURE__ */ jsx53(
+      children: /* @__PURE__ */ jsx55(
         CardBody,
         {
           style: {
             ...isMobile ? { padding: 0 } : {}
           },
           children: /* @__PURE__ */ jsxs30(CardItemGroup, { orientation: "horizontal", children: [
-            /* @__PURE__ */ jsx53(InputGroup, { children: /* @__PURE__ */ jsx53(
+            /* @__PURE__ */ jsx55(InputGroup, { children: /* @__PURE__ */ jsx55(
               Input2,
               {
                 type: "url",
@@ -5410,7 +5618,7 @@ var LinkMain = ({
                 autoCapitalize: "off"
               }
             ) }),
-            /* @__PURE__ */ jsx53(ButtonGroup, { orientation: "horizontal", children: /* @__PURE__ */ jsx53(
+            /* @__PURE__ */ jsx55(ButtonGroup, { orientation: "horizontal", children: /* @__PURE__ */ jsx55(
               Button2,
               {
                 type: "button",
@@ -5418,12 +5626,12 @@ var LinkMain = ({
                 title: "Apply link",
                 disabled: !url && !isActive,
                 "data-style": "ghost",
-                children: /* @__PURE__ */ jsx53(CornerDownLeftIcon, { className: "tiptap-button-icon" })
+                children: /* @__PURE__ */ jsx55(CornerDownLeftIcon, { className: "tiptap-button-icon" })
               }
             ) }),
-            /* @__PURE__ */ jsx53(Separator3, {}),
+            /* @__PURE__ */ jsx55(Separator3, {}),
             /* @__PURE__ */ jsxs30(ButtonGroup, { orientation: "horizontal", children: [
-              /* @__PURE__ */ jsx53(
+              /* @__PURE__ */ jsx55(
                 Button2,
                 {
                   type: "button",
@@ -5431,10 +5639,10 @@ var LinkMain = ({
                   title: "Open in new window",
                   disabled: !url && !isActive,
                   "data-style": "ghost",
-                  children: /* @__PURE__ */ jsx53(ExternalLinkIcon, { className: "tiptap-button-icon" })
+                  children: /* @__PURE__ */ jsx55(ExternalLinkIcon, { className: "tiptap-button-icon" })
                 }
               ),
-              /* @__PURE__ */ jsx53(
+              /* @__PURE__ */ jsx55(
                 Button2,
                 {
                   type: "button",
@@ -5442,7 +5650,7 @@ var LinkMain = ({
                   title: "Remove link",
                   disabled: !url && !isActive,
                   "data-style": "ghost",
-                  children: /* @__PURE__ */ jsx53(TrashIcon, { className: "tiptap-button-icon" })
+                  children: /* @__PURE__ */ jsx55(TrashIcon, { className: "tiptap-button-icon" })
                 }
               )
             ] })
@@ -5456,7 +5664,7 @@ var LinkContent = ({ editor }) => {
   const linkPopover = useLinkPopover({
     editor
   });
-  return /* @__PURE__ */ jsx53(LinkMain, { ...linkPopover });
+  return /* @__PURE__ */ jsx55(LinkMain, { ...linkPopover });
 };
 var LinkPopover = forwardRef15(
   ({
@@ -5487,18 +5695,18 @@ var LinkPopover = forwardRef15(
       hideWhenUnavailable,
       onSetLink
     });
-    const handleOnOpenChange = useCallback17(
+    const handleOnOpenChange = useCallback18(
       (nextIsOpen) => {
         setIsOpen(nextIsOpen);
         onOpenChange?.(nextIsOpen);
       },
       [onOpenChange]
     );
-    const handleSetLink = useCallback17(() => {
+    const handleSetLink = useCallback18(() => {
       setLink();
       setIsOpen(false);
     }, [setLink]);
-    const handleClick = useCallback17(
+    const handleClick = useCallback18(
       (event) => {
         onClick?.(event);
         if (event.defaultPrevented) return;
@@ -5515,7 +5723,7 @@ var LinkPopover = forwardRef15(
       return null;
     }
     return /* @__PURE__ */ jsxs30(Popover, { open: isOpen, onOpenChange: handleOnOpenChange, children: [
-      /* @__PURE__ */ jsx53(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx53(
+      /* @__PURE__ */ jsx55(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx55(
         LinkButton,
         {
           disabled: !canSet,
@@ -5526,10 +5734,10 @@ var LinkPopover = forwardRef15(
           onClick: handleClick,
           ...buttonProps,
           ref,
-          children: children ?? /* @__PURE__ */ jsx53(Icon, { className: "tiptap-button-icon" })
+          children: children ?? /* @__PURE__ */ jsx55(Icon, { className: "tiptap-button-icon" })
         }
       ) }),
-      /* @__PURE__ */ jsx53(PopoverContent, { children: /* @__PURE__ */ jsx53(
+      /* @__PURE__ */ jsx55(PopoverContent, { children: /* @__PURE__ */ jsx55(
         LinkMain,
         {
           url,
@@ -5546,7 +5754,7 @@ var LinkPopover = forwardRef15(
 LinkPopover.displayName = "LinkPopover";
 
 // src/components/tiptap-ui/link-popover/use-link-popover.ts
-import { useCallback as useCallback18, useEffect as useEffect14, useState as useState21 } from "react";
+import { useCallback as useCallback19, useEffect as useEffect14, useState as useState21 } from "react";
 function canSetLink(editor) {
   if (!editor || !editor.isEditable) return false;
   if (isNodeTypeSelected(editor, ["image"], true)) return false;
@@ -5588,7 +5796,7 @@ function useLinkHandler(props) {
       editor.off("selectionUpdate", updateLinkState);
     };
   }, [editor]);
-  const setLink = useCallback18(() => {
+  const setLink = useCallback19(() => {
     if (!url || !editor) return;
     const { selection } = editor.state;
     const isEmpty = selection.empty;
@@ -5601,12 +5809,12 @@ function useLinkHandler(props) {
     setUrl(null);
     onSetLink?.();
   }, [editor, onSetLink, url]);
-  const removeLink = useCallback18(() => {
+  const removeLink = useCallback19(() => {
     if (!editor) return;
     editor.chain().focus().extendMarkRange("link").unsetLink().setMeta("preventAutolink", true).run();
     setUrl("");
   }, [editor]);
-  const openLink = useCallback18(
+  const openLink = useCallback19(
     (target = "_blank", features = "noopener,noreferrer") => {
       if (!url) return;
       const safeUrl = sanitizeUrl(url, window.location.href);
@@ -5677,13 +5885,13 @@ function useLinkPopover(config) {
 }
 
 // src/components/tiptap-ui/mark-button/mark-button.tsx
-import { forwardRef as forwardRef16, useCallback as useCallback19 } from "react";
-import { Fragment as Fragment8, jsx as jsx54, jsxs as jsxs31 } from "react/jsx-runtime";
+import { forwardRef as forwardRef16, useCallback as useCallback20 } from "react";
+import { Fragment as Fragment8, jsx as jsx56, jsxs as jsxs31 } from "react/jsx-runtime";
 function MarkShortcutBadge({
   type,
   shortcutKeys = MARK_SHORTCUT_KEYS[type]
 }) {
-  return /* @__PURE__ */ jsx54(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
+  return /* @__PURE__ */ jsx56(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
 }
 var MarkButton = forwardRef16(
   ({
@@ -5712,7 +5920,7 @@ var MarkButton = forwardRef16(
       hideWhenUnavailable,
       onToggled
     });
-    const handleClick = useCallback19(
+    const handleClick = useCallback20(
       (event) => {
         onClick?.(event);
         if (event.defaultPrevented) return;
@@ -5723,7 +5931,7 @@ var MarkButton = forwardRef16(
     if (!isVisible) {
       return null;
     }
-    return /* @__PURE__ */ jsx54(
+    return /* @__PURE__ */ jsx56(
       Button2,
       {
         type: "button",
@@ -5740,9 +5948,9 @@ var MarkButton = forwardRef16(
         ...buttonProps,
         ref,
         children: children ?? /* @__PURE__ */ jsxs31(Fragment8, { children: [
-          /* @__PURE__ */ jsx54(Icon, { className: "tiptap-button-icon" }),
-          text && /* @__PURE__ */ jsx54("span", { className: "tiptap-button-text", children: text }),
-          showShortcut && /* @__PURE__ */ jsx54(MarkShortcutBadge, { type, shortcutKeys })
+          /* @__PURE__ */ jsx56(Icon, { className: "tiptap-button-icon" }),
+          text && /* @__PURE__ */ jsx56("span", { className: "tiptap-button-text", children: text }),
+          showShortcut && /* @__PURE__ */ jsx56(MarkShortcutBadge, { type, shortcutKeys })
         ] })
       }
     );
@@ -5751,13 +5959,13 @@ var MarkButton = forwardRef16(
 MarkButton.displayName = "MarkButton";
 
 // src/components/tiptap-ui/mark-button/use-mark.ts
-import { useCallback as useCallback20, useEffect as useEffect15, useState as useState22 } from "react";
+import { useCallback as useCallback21, useEffect as useEffect15, useState as useState22 } from "react";
 
 // src/components/tiptap-icons/bold-icon.tsx
-import { memo as memo21 } from "react";
-import { jsx as jsx55 } from "react/jsx-runtime";
-var BoldIcon = memo21(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx55(
+import { memo as memo22 } from "react";
+import { jsx as jsx57 } from "react/jsx-runtime";
+var BoldIcon = memo22(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx57(
     "svg",
     {
       width: "24",
@@ -5767,7 +5975,7 @@ var BoldIcon = memo21(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx55(
+      children: /* @__PURE__ */ jsx57(
         "path",
         {
           fillRule: "evenodd",
@@ -5782,9 +5990,9 @@ var BoldIcon = memo21(({ className, ...props }) => {
 BoldIcon.displayName = "BoldIcon";
 
 // src/components/tiptap-icons/code2-icon.tsx
-import { memo as memo22 } from "react";
-import { jsx as jsx56, jsxs as jsxs32 } from "react/jsx-runtime";
-var Code2Icon = memo22(({ className, ...props }) => {
+import { memo as memo23 } from "react";
+import { jsx as jsx58, jsxs as jsxs32 } from "react/jsx-runtime";
+var Code2Icon = memo23(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs32(
     "svg",
     {
@@ -5796,21 +6004,21 @@ var Code2Icon = memo22(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx56(
+        /* @__PURE__ */ jsx58(
           "path",
           {
             d: "M15.4545 4.2983C15.6192 3.77115 15.3254 3.21028 14.7983 3.04554C14.2712 2.88081 13.7103 3.1746 13.5455 3.70175L8.54554 19.7017C8.38081 20.2289 8.6746 20.7898 9.20175 20.9545C9.72889 21.1192 10.2898 20.8254 10.4545 20.2983L15.4545 4.2983Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx56(
+        /* @__PURE__ */ jsx58(
           "path",
           {
             d: "M6.70711 7.29289C7.09763 7.68342 7.09763 8.31658 6.70711 8.70711L3.41421 12L6.70711 15.2929C7.09763 15.6834 7.09763 16.3166 6.70711 16.7071C6.31658 17.0976 5.68342 17.0976 5.29289 16.7071L1.29289 12.7071C0.902369 12.3166 0.902369 11.6834 1.29289 11.2929L5.29289 7.29289C5.68342 6.90237 6.31658 6.90237 6.70711 7.29289Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx56(
+        /* @__PURE__ */ jsx58(
           "path",
           {
             d: "M17.2929 7.29289C17.6834 6.90237 18.3166 6.90237 18.7071 7.29289L22.7071 11.2929C23.0976 11.6834 23.0976 12.3166 22.7071 12.7071L18.7071 16.7071C18.3166 17.0976 17.6834 17.0976 17.2929 16.7071C16.9024 16.3166 16.9024 15.6834 17.2929 15.2929L20.5858 12L17.2929 8.70711C16.9024 8.31658 16.9024 7.68342 17.2929 7.29289Z",
@@ -5824,10 +6032,10 @@ var Code2Icon = memo22(({ className, ...props }) => {
 Code2Icon.displayName = "Code2Icon";
 
 // src/components/tiptap-icons/italic-icon.tsx
-import { memo as memo23 } from "react";
-import { jsx as jsx57 } from "react/jsx-runtime";
-var ItalicIcon = memo23(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx57(
+import { memo as memo24 } from "react";
+import { jsx as jsx59 } from "react/jsx-runtime";
+var ItalicIcon = memo24(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx59(
     "svg",
     {
       width: "24",
@@ -5837,7 +6045,7 @@ var ItalicIcon = memo23(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx57(
+      children: /* @__PURE__ */ jsx59(
         "path",
         {
           d: "M15.0222 3H19C19.5523 3 20 3.44772 20 4C20 4.55228 19.5523 5 19 5H15.693L10.443 19H14C14.5523 19 15 19.4477 15 20C15 20.5523 14.5523 21 14 21H9.02418C9.00802 21.0004 8.99181 21.0004 8.97557 21H5C4.44772 21 4 20.5523 4 20C4 19.4477 4.44772 19 5 19H8.30704L13.557 5H10C9.44772 5 9 4.55228 9 4C9 3.44772 9.44772 3 10 3H14.9782C14.9928 2.99968 15.0075 2.99967 15.0222 3Z",
@@ -5850,9 +6058,9 @@ var ItalicIcon = memo23(({ className, ...props }) => {
 ItalicIcon.displayName = "ItalicIcon";
 
 // src/components/tiptap-icons/strike-icon.tsx
-import { memo as memo24 } from "react";
-import { jsx as jsx58, jsxs as jsxs33 } from "react/jsx-runtime";
-var StrikeIcon = memo24(({ className, ...props }) => {
+import { memo as memo25 } from "react";
+import { jsx as jsx60, jsxs as jsxs33 } from "react/jsx-runtime";
+var StrikeIcon = memo25(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs33(
     "svg",
     {
@@ -5864,14 +6072,14 @@ var StrikeIcon = memo24(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx58(
+        /* @__PURE__ */ jsx60(
           "path",
           {
             d: "M9.00039 3H16.0001C16.5524 3 17.0001 3.44772 17.0001 4C17.0001 4.55229 16.5524 5 16.0001 5H9.00011C8.68006 4.99983 8.36412 5.07648 8.07983 5.22349C7.79555 5.37051 7.55069 5.5836 7.36585 5.84487C7.181 6.10614 7.06155 6.40796 7.01754 6.72497C6.97352 7.04198 7.00623 7.36492 7.11292 7.66667C7.29701 8.18737 7.02414 8.75872 6.50344 8.94281C5.98274 9.1269 5.4114 8.85403 5.2273 8.33333C5.01393 7.72984 4.94851 7.08396 5.03654 6.44994C5.12456 5.81592 5.36346 5.21229 5.73316 4.68974C6.10285 4.1672 6.59256 3.74101 7.16113 3.44698C7.72955 3.15303 8.36047 2.99975 9.00039 3Z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx58(
+        /* @__PURE__ */ jsx60(
           "path",
           {
             d: "M18 13H20C20.5523 13 21 12.5523 21 12C21 11.4477 20.5523 11 20 11H4C3.44772 11 3 11.4477 3 12C3 12.5523 3.44772 13 4 13H14C14.7956 13 15.5587 13.3161 16.1213 13.8787C16.6839 14.4413 17 15.2044 17 16C17 16.7956 16.6839 17.5587 16.1213 18.1213C15.5587 18.6839 14.7956 19 14 19H6C5.44772 19 5 19.4477 5 20C5 20.5523 5.44772 21 6 21H14C15.3261 21 16.5979 20.4732 17.5355 19.5355C18.4732 18.5979 19 17.3261 19 16C19 14.9119 18.6453 13.8604 18 13Z",
@@ -5885,9 +6093,9 @@ var StrikeIcon = memo24(({ className, ...props }) => {
 StrikeIcon.displayName = "StrikeIcon";
 
 // src/components/tiptap-icons/subscript-icon.tsx
-import { memo as memo25 } from "react";
-import { jsx as jsx59, jsxs as jsxs34 } from "react/jsx-runtime";
-var SubscriptIcon = memo25(({ className, ...props }) => {
+import { memo as memo26 } from "react";
+import { jsx as jsx61, jsxs as jsxs34 } from "react/jsx-runtime";
+var SubscriptIcon = memo26(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs34(
     "svg",
     {
@@ -5899,7 +6107,7 @@ var SubscriptIcon = memo25(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx59(
+        /* @__PURE__ */ jsx61(
           "path",
           {
             fillRule: "evenodd",
@@ -5908,7 +6116,7 @@ var SubscriptIcon = memo25(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx59(
+        /* @__PURE__ */ jsx61(
           "path",
           {
             fillRule: "evenodd",
@@ -5917,7 +6125,7 @@ var SubscriptIcon = memo25(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx59(
+        /* @__PURE__ */ jsx61(
           "path",
           {
             fillRule: "evenodd",
@@ -5933,9 +6141,9 @@ var SubscriptIcon = memo25(({ className, ...props }) => {
 SubscriptIcon.displayName = "SubscriptIcon";
 
 // src/components/tiptap-icons/superscript-icon.tsx
-import { memo as memo26 } from "react";
-import { jsx as jsx60, jsxs as jsxs35 } from "react/jsx-runtime";
-var SuperscriptIcon = memo26(({ className, ...props }) => {
+import { memo as memo27 } from "react";
+import { jsx as jsx62, jsxs as jsxs35 } from "react/jsx-runtime";
+var SuperscriptIcon = memo27(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs35(
     "svg",
     {
@@ -5947,7 +6155,7 @@ var SuperscriptIcon = memo26(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx60(
+        /* @__PURE__ */ jsx62(
           "path",
           {
             fillRule: "evenodd",
@@ -5956,7 +6164,7 @@ var SuperscriptIcon = memo26(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx60(
+        /* @__PURE__ */ jsx62(
           "path",
           {
             fillRule: "evenodd",
@@ -5965,7 +6173,7 @@ var SuperscriptIcon = memo26(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx60(
+        /* @__PURE__ */ jsx62(
           "path",
           {
             fillRule: "evenodd",
@@ -5981,10 +6189,10 @@ var SuperscriptIcon = memo26(({ className, ...props }) => {
 SuperscriptIcon.displayName = "SuperscriptIcon";
 
 // src/components/tiptap-icons/underline-icon.tsx
-import { memo as memo27 } from "react";
-import { jsx as jsx61 } from "react/jsx-runtime";
-var UnderlineIcon = memo27(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx61(
+import { memo as memo28 } from "react";
+import { jsx as jsx63 } from "react/jsx-runtime";
+var UnderlineIcon = memo28(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx63(
     "svg",
     {
       width: "24",
@@ -5994,7 +6202,7 @@ var UnderlineIcon = memo27(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx61(
+      children: /* @__PURE__ */ jsx63(
         "path",
         {
           fillRule: "evenodd",
@@ -6076,7 +6284,7 @@ function useMark(config) {
       editor.off("selectionUpdate", handleSelectionUpdate);
     };
   }, [editor, type, hideWhenUnavailable]);
-  const handleMark = useCallback20(() => {
+  const handleMark = useCallback21(() => {
     if (!editor) return false;
     const success = toggleMark(editor, type);
     if (success) {
@@ -6096,13 +6304,13 @@ function useMark(config) {
 }
 
 // src/components/tiptap-ui/text-align-button/text-align-button.tsx
-import { forwardRef as forwardRef17, useCallback as useCallback21 } from "react";
-import { Fragment as Fragment9, jsx as jsx62, jsxs as jsxs36 } from "react/jsx-runtime";
+import { forwardRef as forwardRef17, useCallback as useCallback22 } from "react";
+import { Fragment as Fragment9, jsx as jsx64, jsxs as jsxs36 } from "react/jsx-runtime";
 function TextAlignShortcutBadge({
   align,
   shortcutKeys = TEXT_ALIGN_SHORTCUT_KEYS[align]
 }) {
-  return /* @__PURE__ */ jsx62(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
+  return /* @__PURE__ */ jsx64(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
 }
 var TextAlignButton = forwardRef17(
   ({
@@ -6132,7 +6340,7 @@ var TextAlignButton = forwardRef17(
       hideWhenUnavailable,
       onAligned
     });
-    const handleClick = useCallback21(
+    const handleClick = useCallback22(
       (event) => {
         onClick?.(event);
         if (event.defaultPrevented) return;
@@ -6144,7 +6352,7 @@ var TextAlignButton = forwardRef17(
       return null;
     }
     const RenderIcon = CustomIcon ?? Icon;
-    return /* @__PURE__ */ jsx62(
+    return /* @__PURE__ */ jsx64(
       Button2,
       {
         type: "button",
@@ -6161,9 +6369,9 @@ var TextAlignButton = forwardRef17(
         ...buttonProps,
         ref,
         children: children ?? /* @__PURE__ */ jsxs36(Fragment9, { children: [
-          /* @__PURE__ */ jsx62(RenderIcon, { className: "tiptap-button-icon" }),
-          text && /* @__PURE__ */ jsx62("span", { className: "tiptap-button-text", children: text }),
-          showShortcut && /* @__PURE__ */ jsx62(
+          /* @__PURE__ */ jsx64(RenderIcon, { className: "tiptap-button-icon" }),
+          text && /* @__PURE__ */ jsx64("span", { className: "tiptap-button-text", children: text }),
+          showShortcut && /* @__PURE__ */ jsx64(
             TextAlignShortcutBadge,
             {
               align,
@@ -6178,12 +6386,12 @@ var TextAlignButton = forwardRef17(
 TextAlignButton.displayName = "TextAlignButton";
 
 // src/components/tiptap-ui/text-align-button/use-text-align.ts
-import { useCallback as useCallback22, useEffect as useEffect16, useState as useState23 } from "react";
+import { useCallback as useCallback23, useEffect as useEffect16, useState as useState23 } from "react";
 
 // src/components/tiptap-icons/align-center-icon.tsx
-import { memo as memo28 } from "react";
-import { jsx as jsx63, jsxs as jsxs37 } from "react/jsx-runtime";
-var AlignCenterIcon = memo28(({ className, ...props }) => {
+import { memo as memo29 } from "react";
+import { jsx as jsx65, jsxs as jsxs37 } from "react/jsx-runtime";
+var AlignCenterIcon = memo29(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs37(
     "svg",
     {
@@ -6195,7 +6403,7 @@ var AlignCenterIcon = memo28(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx63(
+        /* @__PURE__ */ jsx65(
           "path",
           {
             fillRule: "evenodd",
@@ -6204,7 +6412,7 @@ var AlignCenterIcon = memo28(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx63(
+        /* @__PURE__ */ jsx65(
           "path",
           {
             fillRule: "evenodd",
@@ -6213,7 +6421,7 @@ var AlignCenterIcon = memo28(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx63(
+        /* @__PURE__ */ jsx65(
           "path",
           {
             fillRule: "evenodd",
@@ -6229,9 +6437,9 @@ var AlignCenterIcon = memo28(({ className, ...props }) => {
 AlignCenterIcon.displayName = "AlignCenterIcon";
 
 // src/components/tiptap-icons/align-justify-icon.tsx
-import { memo as memo29 } from "react";
-import { jsx as jsx64, jsxs as jsxs38 } from "react/jsx-runtime";
-var AlignJustifyIcon = memo29(({ className, ...props }) => {
+import { memo as memo30 } from "react";
+import { jsx as jsx66, jsxs as jsxs38 } from "react/jsx-runtime";
+var AlignJustifyIcon = memo30(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs38(
     "svg",
     {
@@ -6243,7 +6451,7 @@ var AlignJustifyIcon = memo29(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx64(
+        /* @__PURE__ */ jsx66(
           "path",
           {
             fillRule: "evenodd",
@@ -6252,7 +6460,7 @@ var AlignJustifyIcon = memo29(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx64(
+        /* @__PURE__ */ jsx66(
           "path",
           {
             fillRule: "evenodd",
@@ -6261,7 +6469,7 @@ var AlignJustifyIcon = memo29(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx64(
+        /* @__PURE__ */ jsx66(
           "path",
           {
             fillRule: "evenodd",
@@ -6277,9 +6485,9 @@ var AlignJustifyIcon = memo29(({ className, ...props }) => {
 AlignJustifyIcon.displayName = "AlignJustifyIcon";
 
 // src/components/tiptap-icons/align-left-icon.tsx
-import { memo as memo30 } from "react";
-import { jsx as jsx65, jsxs as jsxs39 } from "react/jsx-runtime";
-var AlignLeftIcon = memo30(({ className, ...props }) => {
+import { memo as memo31 } from "react";
+import { jsx as jsx67, jsxs as jsxs39 } from "react/jsx-runtime";
+var AlignLeftIcon = memo31(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs39(
     "svg",
     {
@@ -6291,7 +6499,7 @@ var AlignLeftIcon = memo30(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx65(
+        /* @__PURE__ */ jsx67(
           "path",
           {
             fillRule: "evenodd",
@@ -6300,7 +6508,7 @@ var AlignLeftIcon = memo30(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx65(
+        /* @__PURE__ */ jsx67(
           "path",
           {
             fillRule: "evenodd",
@@ -6309,7 +6517,7 @@ var AlignLeftIcon = memo30(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx65(
+        /* @__PURE__ */ jsx67(
           "path",
           {
             fillRule: "evenodd",
@@ -6325,9 +6533,9 @@ var AlignLeftIcon = memo30(({ className, ...props }) => {
 AlignLeftIcon.displayName = "AlignLeftIcon";
 
 // src/components/tiptap-icons/align-right-icon.tsx
-import { memo as memo31 } from "react";
-import { jsx as jsx66, jsxs as jsxs40 } from "react/jsx-runtime";
-var AlignRightIcon = memo31(({ className, ...props }) => {
+import { memo as memo32 } from "react";
+import { jsx as jsx68, jsxs as jsxs40 } from "react/jsx-runtime";
+var AlignRightIcon = memo32(({ className, ...props }) => {
   return /* @__PURE__ */ jsxs40(
     "svg",
     {
@@ -6339,7 +6547,7 @@ var AlignRightIcon = memo31(({ className, ...props }) => {
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
       children: [
-        /* @__PURE__ */ jsx66(
+        /* @__PURE__ */ jsx68(
           "path",
           {
             fillRule: "evenodd",
@@ -6348,7 +6556,7 @@ var AlignRightIcon = memo31(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx66(
+        /* @__PURE__ */ jsx68(
           "path",
           {
             fillRule: "evenodd",
@@ -6357,7 +6565,7 @@ var AlignRightIcon = memo31(({ className, ...props }) => {
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx66(
+        /* @__PURE__ */ jsx68(
           "path",
           {
             fillRule: "evenodd",
@@ -6444,7 +6652,7 @@ function useTextAlign(config) {
       editor.off("selectionUpdate", handleSelectionUpdate);
     };
   }, [editor, hideWhenUnavailable, align]);
-  const handleTextAlign = useCallback22(() => {
+  const handleTextAlign = useCallback23(() => {
     if (!editor) return false;
     const success = setTextAlign(editor, align);
     if (success) {
@@ -6464,13 +6672,13 @@ function useTextAlign(config) {
 }
 
 // src/components/tiptap-ui/undo-redo-button/undo-redo-button.tsx
-import { forwardRef as forwardRef18, useCallback as useCallback23 } from "react";
-import { Fragment as Fragment10, jsx as jsx67, jsxs as jsxs41 } from "react/jsx-runtime";
+import { forwardRef as forwardRef18, useCallback as useCallback24 } from "react";
+import { Fragment as Fragment10, jsx as jsx69, jsxs as jsxs41 } from "react/jsx-runtime";
 function HistoryShortcutBadge({
   action,
   shortcutKeys = UNDO_REDO_SHORTCUT_KEYS[action]
 }) {
-  return /* @__PURE__ */ jsx67(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
+  return /* @__PURE__ */ jsx69(Badge, { children: parseShortcutKeys({ shortcutKeys }) });
 }
 var UndoRedoButton = forwardRef18(
   ({
@@ -6491,7 +6699,7 @@ var UndoRedoButton = forwardRef18(
       hideWhenUnavailable,
       onExecuted
     });
-    const handleClick = useCallback23(
+    const handleClick = useCallback24(
       (event) => {
         onClick?.(event);
         if (event.defaultPrevented) return;
@@ -6502,7 +6710,7 @@ var UndoRedoButton = forwardRef18(
     if (!isVisible) {
       return null;
     }
-    return /* @__PURE__ */ jsx67(
+    return /* @__PURE__ */ jsx69(
       Button2,
       {
         type: "button",
@@ -6517,9 +6725,9 @@ var UndoRedoButton = forwardRef18(
         ...buttonProps,
         ref,
         children: children ?? /* @__PURE__ */ jsxs41(Fragment10, { children: [
-          /* @__PURE__ */ jsx67(Icon, { className: "tiptap-button-icon" }),
-          text && /* @__PURE__ */ jsx67("span", { className: "tiptap-button-text", children: text }),
-          showShortcut && /* @__PURE__ */ jsx67(
+          /* @__PURE__ */ jsx69(Icon, { className: "tiptap-button-icon" }),
+          text && /* @__PURE__ */ jsx69("span", { className: "tiptap-button-text", children: text }),
+          showShortcut && /* @__PURE__ */ jsx69(
             HistoryShortcutBadge,
             {
               action,
@@ -6534,13 +6742,13 @@ var UndoRedoButton = forwardRef18(
 UndoRedoButton.displayName = "UndoRedoButton";
 
 // src/components/tiptap-ui/undo-redo-button/use-undo-redo.ts
-import { useCallback as useCallback24, useEffect as useEffect17, useState as useState24 } from "react";
+import { useCallback as useCallback25, useEffect as useEffect17, useState as useState24 } from "react";
 
 // src/components/tiptap-icons/redo2-icon.tsx
-import { memo as memo32 } from "react";
-import { jsx as jsx68 } from "react/jsx-runtime";
-var Redo2Icon = memo32(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx68(
+import { memo as memo33 } from "react";
+import { jsx as jsx70 } from "react/jsx-runtime";
+var Redo2Icon = memo33(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx70(
     "svg",
     {
       width: "24",
@@ -6550,7 +6758,7 @@ var Redo2Icon = memo32(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx68(
+      children: /* @__PURE__ */ jsx70(
         "path",
         {
           fillRule: "evenodd",
@@ -6565,10 +6773,10 @@ var Redo2Icon = memo32(({ className, ...props }) => {
 Redo2Icon.displayName = "Redo2Icon";
 
 // src/components/tiptap-icons/undo2-icon.tsx
-import { memo as memo33 } from "react";
-import { jsx as jsx69 } from "react/jsx-runtime";
-var Undo2Icon = memo33(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx69(
+import { memo as memo34 } from "react";
+import { jsx as jsx71 } from "react/jsx-runtime";
+var Undo2Icon = memo34(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx71(
     "svg",
     {
       width: "24",
@@ -6578,7 +6786,7 @@ var Undo2Icon = memo33(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx69(
+      children: /* @__PURE__ */ jsx71(
         "path",
         {
           fillRule: "evenodd",
@@ -6645,7 +6853,7 @@ function useUndoRedo(config) {
       editor.off("transaction", handleUpdate);
     };
   }, [editor, hideWhenUnavailable, action]);
-  const handleAction = useCallback24(() => {
+  const handleAction = useCallback25(() => {
     if (!editor) return false;
     const success = executeUndoRedoAction(editor, action);
     if (success) {
@@ -6709,12 +6917,12 @@ import { ChevronDown } from "lucide-react";
 // src/components/ui/command.tsx
 import { Command as CommandPrimitive } from "cmdk";
 import { SearchIcon } from "lucide-react";
-import { jsx as jsx70, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx72, jsxs as jsxs42 } from "react/jsx-runtime";
 function Command({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx72(
     CommandPrimitive,
     {
       "data-slot": "command",
@@ -6736,8 +6944,8 @@ function CommandInput({
       "data-slot": "command-input-wrapper",
       className: "flex h-9 items-center gap-2 border-b px-3",
       children: [
-        /* @__PURE__ */ jsx70(SearchIcon, { className: "size-4 shrink-0 opacity-50" }),
-        /* @__PURE__ */ jsx70(
+        /* @__PURE__ */ jsx72(SearchIcon, { className: "size-4 shrink-0 opacity-50" }),
+        /* @__PURE__ */ jsx72(
           CommandPrimitive.Input,
           {
             "data-slot": "command-input",
@@ -6756,7 +6964,7 @@ function CommandList({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx72(
     CommandPrimitive.List,
     {
       "data-slot": "command-list",
@@ -6771,7 +6979,7 @@ function CommandList({
 function CommandEmpty({
   ...props
 }) {
-  return /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx72(
     CommandPrimitive.Empty,
     {
       "data-slot": "command-empty",
@@ -6784,7 +6992,7 @@ function CommandGroup({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx72(
     CommandPrimitive.Group,
     {
       "data-slot": "command-group",
@@ -6800,7 +7008,7 @@ function CommandItem({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx72(
     CommandPrimitive.Item,
     {
       "data-slot": "command-item",
@@ -6815,16 +7023,16 @@ function CommandItem({
 
 // src/components/ui/popover.tsx
 import * as PopoverPrimitive2 from "@radix-ui/react-popover";
-import { jsx as jsx71 } from "react/jsx-runtime";
+import { jsx as jsx73 } from "react/jsx-runtime";
 function Popover2({
   ...props
 }) {
-  return /* @__PURE__ */ jsx71(PopoverPrimitive2.Root, { "data-slot": "popover", ...props });
+  return /* @__PURE__ */ jsx73(PopoverPrimitive2.Root, { "data-slot": "popover", ...props });
 }
 function PopoverTrigger2({
   ...props
 }) {
-  return /* @__PURE__ */ jsx71(PopoverPrimitive2.Trigger, { "data-slot": "popover-trigger", ...props });
+  return /* @__PURE__ */ jsx73(PopoverPrimitive2.Trigger, { "data-slot": "popover-trigger", ...props });
 }
 function PopoverContent2({
   className,
@@ -6832,7 +7040,7 @@ function PopoverContent2({
   sideOffset = 4,
   ...props
 }) {
-  return /* @__PURE__ */ jsx71(PopoverPrimitive2.Portal, { children: /* @__PURE__ */ jsx71(
+  return /* @__PURE__ */ jsx73(PopoverPrimitive2.Portal, { children: /* @__PURE__ */ jsx73(
     PopoverPrimitive2.Content,
     {
       "data-slot": "popover-content",
@@ -6848,7 +7056,7 @@ function PopoverContent2({
 }
 
 // src/components/tiptap-ui/font-family-dropdown/font-family-dropdown.tsx
-import { jsx as jsx72, jsxs as jsxs43 } from "react/jsx-runtime";
+import { jsx as jsx74, jsxs as jsxs43 } from "react/jsx-runtime";
 function FontFamilyDropdown() {
   const { editor } = useCurrentEditor3();
   const [open, setOpen] = useState25(false);
@@ -6870,18 +7078,18 @@ function FontFamilyDropdown() {
     }, 0);
   };
   return /* @__PURE__ */ jsxs43(Popover2, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx72(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs43(
+    /* @__PURE__ */ jsx74(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs43(
       Button,
       {
         variant: "outlineFontFamily",
         className: "\r\n            min-w-[90px] h-7 px-2 flex items-center justify-between rounded-sm\r\n            border-[#a3a3a8] text-[#a3a3a8]\r\n            hover:border-[#000] hover:text-[#fff] transition-colors\r\n          ",
         children: [
           currentFont,
-          /* @__PURE__ */ jsx72(ChevronDown, { className: "w-4 h-4" })
+          /* @__PURE__ */ jsx74(ChevronDown, { className: "w-4 h-4" })
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx72(
+    /* @__PURE__ */ jsx74(
       PopoverContent2,
       {
         className: "w-[300px] p-0",
@@ -6893,11 +7101,11 @@ function FontFamilyDropdown() {
           }
         },
         children: /* @__PURE__ */ jsxs43(Command, { children: [
-          /* @__PURE__ */ jsx72("div", { className: "cmd-input-wrapper", children: /* @__PURE__ */ jsx72(CommandInput, { placeholder: "Search font..." }) }),
+          /* @__PURE__ */ jsx74("div", { className: "cmd-input-wrapper", children: /* @__PURE__ */ jsx74(CommandInput, { placeholder: "Search font..." }) }),
           /* @__PURE__ */ jsxs43(CommandList, { className: "max-h-[220px]", children: [
-            /* @__PURE__ */ jsx72(CommandEmpty, { children: "No font found." }),
+            /* @__PURE__ */ jsx74(CommandEmpty, { children: "No font found." }),
             /* @__PURE__ */ jsxs43(CommandGroup, { children: [
-              /* @__PURE__ */ jsx72(
+              /* @__PURE__ */ jsx74(
                 CommandItem,
                 {
                   onSelect: () => {
@@ -6920,7 +7128,7 @@ function FontFamilyDropdown() {
                 },
                 "default"
               ),
-              FONT_OPTIONS.map(({ label, cssFontFamily }) => /* @__PURE__ */ jsx72(
+              FONT_OPTIONS.map(({ label, cssFontFamily }) => /* @__PURE__ */ jsx74(
                 CommandItem,
                 {
                   onSelect: () => {
@@ -7031,12 +7239,12 @@ import { debounce } from "lodash";
 
 // src/components/ui/label.tsx
 import * as LabelPrimitive from "@radix-ui/react-label";
-import { jsx as jsx73 } from "react/jsx-runtime";
+import { jsx as jsx75 } from "react/jsx-runtime";
 function Label2({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx73(
+  return /* @__PURE__ */ jsx75(
     LabelPrimitive.Root,
     {
       "data-slot": "label",
@@ -7051,7 +7259,7 @@ function Label2({
 
 // src/components/tiptap-ui/color-picker/color-picker.tsx
 import React4 from "react";
-import { jsx as jsx74, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx76, jsxs as jsxs44 } from "react/jsx-runtime";
 function ColorPicker({ type = "text" }) {
   const { editor } = useCurrentEditor4();
   const [open, setOpen] = useState26(false);
@@ -7102,14 +7310,14 @@ function ColorPicker({ type = "text" }) {
   );
   if (!editor) return null;
   return /* @__PURE__ */ jsxs44(Popover2, { open, onOpenChange: (v) => setOpen(v), children: [
-    /* @__PURE__ */ jsx74(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs44(
+    /* @__PURE__ */ jsx76(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs44(
       Button,
       {
         variant: "outlineFontFamily",
         className: "flex items-center h-7 rounded-sm px-2 border-[#a3a3a8] text-[#a3a3a8] hover:text-white",
         children: [
           "Color",
-          /* @__PURE__ */ jsx74(
+          /* @__PURE__ */ jsx76(
             "span",
             {
               className: "w-3 h-3 ml-2 rounded-sm border border-black/20",
@@ -7126,9 +7334,9 @@ function ColorPicker({ type = "text" }) {
         align: "start",
         onClick: (e) => e.stopPropagation(),
         children: [
-          /* @__PURE__ */ jsx74(Label2, { className: "text-xs mb-2", children: type === "text" ? "Text Color" : "Highlight Color" }),
+          /* @__PURE__ */ jsx76(Label2, { className: "text-xs mb-2", children: type === "text" ? "Text Color" : "Highlight Color" }),
           !showCustom && /* @__PURE__ */ jsxs44("div", { className: "flex flex-col gap-3", children: [
-            /* @__PURE__ */ jsx74("div", { className: "grid grid-cols-7 gap-1", children: GRADIENT_ROWS_70.map((c) => /* @__PURE__ */ jsx74(
+            /* @__PURE__ */ jsx76("div", { className: "grid grid-cols-7 gap-1", children: GRADIENT_ROWS_70.map((c) => /* @__PURE__ */ jsx76(
               "div",
               {
                 onClick: () => {
@@ -7140,7 +7348,7 @@ function ColorPicker({ type = "text" }) {
               },
               c
             )) }),
-            /* @__PURE__ */ jsx74(
+            /* @__PURE__ */ jsx76(
               Button,
               {
                 size: "sm",
@@ -7164,7 +7372,7 @@ function ColorPicker({ type = "text" }) {
               onPointerUp: (e) => e.stopPropagation(),
               onClick: (e) => e.stopPropagation(),
               children: [
-                /* @__PURE__ */ jsx74(
+                /* @__PURE__ */ jsx76(
                   HexColorPicker,
                   {
                     color: tempHex,
@@ -7176,7 +7384,7 @@ function ColorPicker({ type = "text" }) {
                   }
                 ),
                 /* @__PURE__ */ jsxs44("div", { className: "flex gap-2 items-center", children: [
-                  /* @__PURE__ */ jsx74(
+                  /* @__PURE__ */ jsx76(
                     "input",
                     {
                       value: tempHex,
@@ -7187,7 +7395,7 @@ function ColorPicker({ type = "text" }) {
                       className: "w-full px-2 py-1 border rounded text-sm"
                     }
                   ),
-                  /* @__PURE__ */ jsx74(
+                  /* @__PURE__ */ jsx76(
                     Button,
                     {
                       size: "sm",
@@ -7200,7 +7408,7 @@ function ColorPicker({ type = "text" }) {
                     }
                   )
                 ] }),
-                /* @__PURE__ */ jsx74("div", { className: "flex justify-end mt-2", children: /* @__PURE__ */ jsx74(
+                /* @__PURE__ */ jsx76("div", { className: "flex justify-end mt-2", children: /* @__PURE__ */ jsx76(
                   Button,
                   {
                     size: "sm",
@@ -7228,7 +7436,7 @@ function ColorPicker({ type = "text" }) {
 import { useState as useState27 } from "react";
 import { useCurrentEditor as useCurrentEditor5 } from "@tiptap/react";
 import { FiTable } from "react-icons/fi";
-import { jsx as jsx75, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx77, jsxs as jsxs45 } from "react/jsx-runtime";
 function TableDropdownMenu() {
   const { editor } = useCurrentEditor5();
   const [open, setOpen] = useState27(false);
@@ -7271,30 +7479,30 @@ function TableDropdownMenu() {
     setOpen(false);
   };
   return /* @__PURE__ */ jsxs45(Popover2, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx75(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsx75(Button, { variant: "tableButton", size: "sm", children: /* @__PURE__ */ jsx75(FiTable, { size: 16, color: "#a3a3a8" }) }) }),
-    /* @__PURE__ */ jsx75(PopoverContent2, { className: "w-[220px] p-0", align: "start", children: /* @__PURE__ */ jsxs45(Command, { children: [
-      /* @__PURE__ */ jsx75(CommandInput, { placeholder: "Search table actions..." }),
-      /* @__PURE__ */ jsx75(CommandList, { className: "max-h-[260px]", children: /* @__PURE__ */ jsxs45(CommandGroup, { children: [
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("insert"), children: "Insert Table" }),
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("addColBefore"), children: "Add Column Before" }),
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("addColAfter"), children: "Add Column After" }),
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("delCol"), children: "Delete Column" }),
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("addRowBefore"), children: "Add Row Before" }),
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("addRowAfter"), children: "Add Row After" }),
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("delRow"), children: "Delete Row" }),
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("merge"), children: "Merge Cells" }),
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("split"), children: "Split Cells" }),
-        /* @__PURE__ */ jsx75(CommandItem, { onSelect: () => handleAction("deleteTable"), children: "Delete Table" })
+    /* @__PURE__ */ jsx77(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsx77(Button, { variant: "tableButton", size: "sm", children: /* @__PURE__ */ jsx77(FiTable, { size: 16, color: "#a3a3a8" }) }) }),
+    /* @__PURE__ */ jsx77(PopoverContent2, { className: "w-[220px] p-0", align: "start", children: /* @__PURE__ */ jsxs45(Command, { children: [
+      /* @__PURE__ */ jsx77(CommandInput, { placeholder: "Search table actions..." }),
+      /* @__PURE__ */ jsx77(CommandList, { className: "max-h-[260px]", children: /* @__PURE__ */ jsxs45(CommandGroup, { children: [
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("insert"), children: "Insert Table" }),
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("addColBefore"), children: "Add Column Before" }),
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("addColAfter"), children: "Add Column After" }),
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("delCol"), children: "Delete Column" }),
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("addRowBefore"), children: "Add Row Before" }),
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("addRowAfter"), children: "Add Row After" }),
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("delRow"), children: "Delete Row" }),
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("merge"), children: "Merge Cells" }),
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("split"), children: "Split Cells" }),
+        /* @__PURE__ */ jsx77(CommandItem, { onSelect: () => handleAction("deleteTable"), children: "Delete Table" })
       ] }) })
     ] }) })
   ] });
 }
 
 // src/components/tiptap-icons/arrow-left-icon.tsx
-import { memo as memo34 } from "react";
-import { jsx as jsx76 } from "react/jsx-runtime";
-var ArrowLeftIcon = memo34(({ className, ...props }) => {
-  return /* @__PURE__ */ jsx76(
+import { memo as memo35 } from "react";
+import { jsx as jsx78 } from "react/jsx-runtime";
+var ArrowLeftIcon = memo35(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx78(
     "svg",
     {
       width: "24",
@@ -7304,7 +7512,7 @@ var ArrowLeftIcon = memo34(({ className, ...props }) => {
       fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       ...props,
-      children: /* @__PURE__ */ jsx76(
+      children: /* @__PURE__ */ jsx78(
         "path",
         {
           d: "M12.7071 5.70711C13.0976 5.31658 13.0976 4.68342 12.7071 4.29289C12.3166 3.90237 11.6834 3.90237 11.2929 4.29289L4.29289 11.2929C3.90237 11.6834 3.90237 12.3166 4.29289 12.7071L11.2929 19.7071C11.6834 20.0976 12.3166 20.0976 12.7071 19.7071C13.0976 19.3166 13.0976 18.6834 12.7071 18.2929L7.41421 13L19 13C19.5523 13 20 12.5523 20 12C20 11.4477 19.5523 11 19 11L7.41421 11L12.7071 5.70711Z",
@@ -7323,9 +7531,9 @@ import { useEffect as useEffect20, useState as useState28 } from "react";
 import throttle from "lodash.throttle";
 
 // src/hooks/use-unmount.ts
-import { useRef as useRef6, useEffect as useEffect19 } from "react";
+import { useRef as useRef7, useEffect as useEffect19 } from "react";
 var useUnmount = (callback) => {
-  const ref = useRef6(callback);
+  const ref = useRef7(callback);
   ref.current = callback;
   useEffect19(
     () => () => {
@@ -7336,13 +7544,13 @@ var useUnmount = (callback) => {
 };
 
 // src/hooks/use-throttled-callback.ts
-import { useMemo as useMemo8 } from "react";
+import { useMemo as useMemo10 } from "react";
 var defaultOptions = {
   leading: false,
   trailing: true
 };
 function useThrottledCallback(fn, wait = 250, dependencies = [], options = defaultOptions) {
-  const handler = useMemo8(
+  const handler = useMemo10(
     () => throttle(fn, wait, options),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     dependencies
@@ -7393,7 +7601,7 @@ function useWindowSize() {
 }
 
 // src/hooks/use-element-rect.ts
-import { useCallback as useCallback25, useEffect as useEffect21, useState as useState29 } from "react";
+import { useCallback as useCallback26, useEffect as useEffect21, useState as useState29 } from "react";
 var initialRect = {
   x: 0,
   y: 0,
@@ -7414,7 +7622,7 @@ function useElementRect({
   useResizeObserver = true
 } = {}) {
   const [rect, setRect] = useState29(initialRect);
-  const getTargetElement = useCallback25(() => {
+  const getTargetElement = useCallback26(() => {
     if (!enabled || !isClientSide()) return null;
     if (!element) {
       return document.body;
@@ -7530,62 +7738,62 @@ function useCursorVisibility({
 }
 
 // src/components/tiptap-templates/simple/simple-editor.tsx
-import { Fragment as Fragment11, jsx as jsx77, jsxs as jsxs46 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx79, jsxs as jsxs46 } from "react/jsx-runtime";
 var MainToolbarContent = ({
   onHighlighterClick,
   onLinkClick,
   isMobile
 }) => {
   return /* @__PURE__ */ jsxs46(Fragment11, { children: [
-    /* @__PURE__ */ jsx77(Spacer, {}),
-    /* @__PURE__ */ jsx77(FontFamilyDropdown, {}),
-    /* @__PURE__ */ jsx77(ColorPicker, { type: "text" }),
+    /* @__PURE__ */ jsx79(Spacer, {}),
+    /* @__PURE__ */ jsx79(FontFamilyDropdown, {}),
+    /* @__PURE__ */ jsx79(ColorPicker, { type: "text" }),
     /* @__PURE__ */ jsxs46(ToolbarGroup, { children: [
-      /* @__PURE__ */ jsx77(MarkButton, { type: "bold" }),
-      /* @__PURE__ */ jsx77(MarkButton, { type: "italic" }),
-      /* @__PURE__ */ jsx77(MarkButton, { type: "strike" }),
-      /* @__PURE__ */ jsx77(MarkButton, { type: "code" }),
-      /* @__PURE__ */ jsx77(MarkButton, { type: "underline" }),
-      /* @__PURE__ */ jsx77(UndoRedoButton, { action: "undo" }),
-      /* @__PURE__ */ jsx77(UndoRedoButton, { action: "redo" })
+      /* @__PURE__ */ jsx79(MarkButton, { type: "bold" }),
+      /* @__PURE__ */ jsx79(MarkButton, { type: "italic" }),
+      /* @__PURE__ */ jsx79(MarkButton, { type: "strike" }),
+      /* @__PURE__ */ jsx79(MarkButton, { type: "code" }),
+      /* @__PURE__ */ jsx79(MarkButton, { type: "underline" }),
+      /* @__PURE__ */ jsx79(UndoRedoButton, { action: "undo" }),
+      /* @__PURE__ */ jsx79(UndoRedoButton, { action: "redo" })
     ] }),
-    /* @__PURE__ */ jsx77(ToolbarSeparator, {}),
+    /* @__PURE__ */ jsx79(ToolbarSeparator, {}),
     /* @__PURE__ */ jsxs46(ToolbarGroup, { children: [
-      /* @__PURE__ */ jsx77(TextAlignButton, { align: "left" }),
-      /* @__PURE__ */ jsx77(TextAlignButton, { align: "center" }),
-      /* @__PURE__ */ jsx77(TextAlignButton, { align: "right" }),
-      /* @__PURE__ */ jsx77(TextAlignButton, { align: "justify" })
+      /* @__PURE__ */ jsx79(TextAlignButton, { align: "left" }),
+      /* @__PURE__ */ jsx79(TextAlignButton, { align: "center" }),
+      /* @__PURE__ */ jsx79(TextAlignButton, { align: "right" }),
+      /* @__PURE__ */ jsx79(TextAlignButton, { align: "justify" })
     ] }),
-    /* @__PURE__ */ jsx77(ToolbarSeparator, {}),
+    /* @__PURE__ */ jsx79(ToolbarSeparator, {}),
     /* @__PURE__ */ jsxs46(ToolbarGroup, { children: [
-      /* @__PURE__ */ jsx77(HeadingDropdownMenu, { levels: [1, 2, 3, 4], portal: isMobile }),
-      /* @__PURE__ */ jsx77(
+      /* @__PURE__ */ jsx79(HeadingDropdownMenu, { levels: [1, 2, 3, 4], portal: isMobile }),
+      /* @__PURE__ */ jsx79(
         ListDropdownMenu,
         {
           types: ["bulletList", "orderedList", "taskList"],
           portal: isMobile
         }
       ),
-      /* @__PURE__ */ jsx77(BlockquoteButton, {})
+      /* @__PURE__ */ jsx79(BlockquoteButton, {})
     ] }),
-    /* @__PURE__ */ jsx77(ToolbarGroup, { children: /* @__PURE__ */ jsx77(TableDropdownMenu, {}) }),
-    /* @__PURE__ */ jsx77(ToolbarGroup, {}),
-    /* @__PURE__ */ jsx77(ToolbarSeparator, {}),
-    /* @__PURE__ */ jsx77(ToolbarGroup, { children: /* @__PURE__ */ jsx77(ImageUploadButton, { text: "Add" }) }),
-    /* @__PURE__ */ jsx77(Spacer, {}),
-    isMobile && /* @__PURE__ */ jsx77(ToolbarSeparator, {})
+    /* @__PURE__ */ jsx79(ToolbarGroup, { children: /* @__PURE__ */ jsx79(TableDropdownMenu, {}) }),
+    /* @__PURE__ */ jsx79(ToolbarGroup, {}),
+    /* @__PURE__ */ jsx79(ToolbarSeparator, {}),
+    /* @__PURE__ */ jsx79(ToolbarGroup, { children: /* @__PURE__ */ jsx79(ImageUploadButton, { text: "Add" }) }),
+    /* @__PURE__ */ jsx79(Spacer, {}),
+    isMobile && /* @__PURE__ */ jsx79(ToolbarSeparator, {})
   ] });
 };
 var MobileToolbarContent = ({
   type,
   onBack
 }) => /* @__PURE__ */ jsxs46(Fragment11, { children: [
-  /* @__PURE__ */ jsx77(ToolbarGroup, { children: /* @__PURE__ */ jsxs46(Button2, { "data-style": "ghost", onClick: onBack, children: [
-    /* @__PURE__ */ jsx77(ArrowLeftIcon, { className: "tiptap-button-icon" }),
-    type === "highlighter" ? /* @__PURE__ */ jsx77(HighlighterIcon, { className: "tiptap-button-icon" }) : /* @__PURE__ */ jsx77(LinkIcon, { className: "tiptap-button-icon" })
+  /* @__PURE__ */ jsx79(ToolbarGroup, { children: /* @__PURE__ */ jsxs46(Button2, { "data-style": "ghost", onClick: onBack, children: [
+    /* @__PURE__ */ jsx79(ArrowLeftIcon, { className: "tiptap-button-icon" }),
+    type === "highlighter" ? /* @__PURE__ */ jsx79(HighlighterIcon, { className: "tiptap-button-icon" }) : /* @__PURE__ */ jsx79(LinkIcon, { className: "tiptap-button-icon" })
   ] }) }),
-  /* @__PURE__ */ jsx77(ToolbarSeparator, {}),
-  type === "highlighter" ? /* @__PURE__ */ jsx77(ColorHighlightPopoverContent, {}) : /* @__PURE__ */ jsx77(LinkContent, {})
+  /* @__PURE__ */ jsx79(ToolbarSeparator, {}),
+  type === "highlighter" ? /* @__PURE__ */ jsx79(ColorHighlightPopoverContent, {}) : /* @__PURE__ */ jsx79(LinkContent, {})
 ] });
 function SimpleEditor() {
   const { setEditorContent, debouncedSave } = useEditorBridge();
@@ -7594,7 +7802,7 @@ function SimpleEditor() {
   const [mobileView, setMobileView] = useState30(
     "main"
   );
-  const toolbarRef = useRef7(null);
+  const toolbarRef = useRef8(null);
   const editor = useEditor({
     immediatelyRender: false,
     editorProps: {
@@ -7695,8 +7903,8 @@ function SimpleEditor() {
       window.visualViewport?.removeEventListener("scroll", updatePosition);
     };
   }, []);
-  return /* @__PURE__ */ jsx77("div", { className: "simple-editor-wrapper", children: /* @__PURE__ */ jsxs46(EditorContext.Provider, { value: { editor }, children: [
-    /* @__PURE__ */ jsx77(
+  return /* @__PURE__ */ jsx79("div", { className: "simple-editor-wrapper", children: /* @__PURE__ */ jsxs46(EditorContext.Provider, { value: { editor }, children: [
+    /* @__PURE__ */ jsx79(
       Toolbar,
       {
         ref: toolbarRef,
@@ -7705,14 +7913,14 @@ function SimpleEditor() {
             bottom: `calc(100% - ${height - rect.y}px)`
           } : {}
         },
-        children: mobileView === "main" ? /* @__PURE__ */ jsx77(
+        children: mobileView === "main" ? /* @__PURE__ */ jsx79(
           MainToolbarContent,
           {
             onHighlighterClick: () => setMobileView("highlighter"),
             onLinkClick: () => setMobileView("link"),
             isMobile
           }
-        ) : /* @__PURE__ */ jsx77(
+        ) : /* @__PURE__ */ jsx79(
           MobileToolbarContent,
           {
             type: mobileView === "highlighter" ? "highlighter" : "link",
@@ -7721,14 +7929,14 @@ function SimpleEditor() {
         )
       }
     ),
-    /* @__PURE__ */ jsx77(
+    /* @__PURE__ */ jsx79(
       EditorContent,
       {
         editor,
         role: "presentation",
         autoFocus: true,
         className: "simple-editor-content",
-        children: editor && /* @__PURE__ */ jsx77(BubbleMenuInline, {})
+        children: editor && /* @__PURE__ */ jsx79(BubbleMenuInline, {})
       }
     )
   ] }) });
@@ -7736,9 +7944,9 @@ function SimpleEditor() {
 
 // src/components/editor/editor.tsx
 import clsx2 from "clsx";
-import { jsx as jsx78 } from "react/jsx-runtime";
+import { jsx as jsx80 } from "react/jsx-runtime";
 function Editor({ onChange, className, style, onTabsChange, initialTabs }) {
-  return /* @__PURE__ */ jsx78(
+  return /* @__PURE__ */ jsx80(
     "div",
     {
       className: clsx2(
@@ -7746,7 +7954,7 @@ function Editor({ onChange, className, style, onTabsChange, initialTabs }) {
         className
       ),
       style,
-      children: /* @__PURE__ */ jsx78(EditorShell, { children: /* @__PURE__ */ jsx78(EditorLayout, { onChange, initialTabs, onTabsChange, children: /* @__PURE__ */ jsx78(SimpleEditor, {}) }) })
+      children: /* @__PURE__ */ jsx80(EditorShell, { children: /* @__PURE__ */ jsx80(EditorLayout, { onChange, initialTabs, onTabsChange, children: /* @__PURE__ */ jsx80(SimpleEditor, {}) }) })
     }
   );
 }