@rufous/ui 0.2.54 → 0.2.56

package/dist/main.cjs

@@ -9183,7 +9183,7 @@ var TranslateModal = ({ editor, onClose, onTranslate, initialSource, initialTarg
     },
     /* @__PURE__ */ import_react54.default.createElement("span", { className: "translate-code" }, lang.code),
     /* @__PURE__ */ import_react54.default.createElement("span", { className: "translate-name" }, lang.name)
-  ))))), error && /* @__PURE__ */ import_react54.default.createElement("div", { className: "translate-error" }, error)), /* @__PURE__ */ import_react54.default.createElement("div", { className: "modal-footer" }, /* @__PURE__ */ import_react54.default.createElement("div", { className: "modal-footer-left" }, /* @__PURE__ */ import_react54.default.createElement("button", { className: "modal-btn-cancel", onClick: onClose }, "\xD7 Cancel")), /* @__PURE__ */ import_react54.default.createElement("button", { className: "modal-btn-apply", onClick: handleSave, disabled: translating }, translating ? "Translating..." : "\u2714 Save"))));
+  ))))), error && /* @__PURE__ */ import_react54.default.createElement("div", { className: "translate-error" }, error)), /* @__PURE__ */ import_react54.default.createElement("div", { className: "modal-footer" }, /* @__PURE__ */ import_react54.default.createElement("div", { className: "modal-footer-left" }, /* @__PURE__ */ import_react54.default.createElement("button", { className: "modal-btn-cancel", onClick: onClose }, "Cancel")), /* @__PURE__ */ import_react54.default.createElement("button", { className: "modal-btn-apply", onClick: handleSave, disabled: translating }, translating ? "Translating..." : "Save"))));
 };
 var TranslateModal_default = TranslateModal;
 
@@ -9706,31 +9706,32 @@ var CustomTaskItem = import_extension_task_item.default.extend({
           }
         }
         if (taskItemDepth === -1) {
-          const parentDepth = $from.depth > 0 ? $from.depth - 1 : 0;
+          if ($from.depth < 1) return false;
+          const parentDepth = $from.depth - 1;
           const indexInParent = $from.index(parentDepth);
           if (indexInParent > 0) {
             const prevNode = $from.node(parentDepth).child(indexInParent - 1);
             if (prevNode.type.name === "taskList") {
-              const lastTaskItem = prevNode.lastChild;
-              if (lastTaskItem) {
+              try {
                 const tr = state.tr;
-                const paraStart = $from.before($from.depth > 0 ? $from.depth : 1);
-                const paraEnd = $from.after($from.depth > 0 ? $from.depth : 1);
+                const paraStart = $from.before($from.depth);
+                const paraEnd = $from.after($from.depth);
                 const paraContent = $from.parent.content;
-                const taskListStart = $from.before(parentDepth) !== void 0 ? paraStart - 1 : null;
-                if (taskListStart !== null) {
-                  const $taskListEnd = tr.doc.resolve(taskListStart);
-                  const lastItemParaEnd = $taskListEnd.end($taskListEnd.depth);
-                  tr.delete(paraStart, paraEnd);
-                  let insertAt = lastItemParaEnd;
-                  paraContent.forEach((inline) => {
-                    tr.insert(insertAt, inline);
-                    insertAt += inline.nodeSize;
-                  });
-                  tr.setSelection(import_prosemirror_state.TextSelection.create(tr.doc, lastItemParaEnd));
-                  this.editor.view.dispatch(tr);
-                  return true;
-                }
+                const taskListEndPos = paraStart - 1;
+                if (taskListEndPos < 0) return false;
+                const $taskListEnd = tr.doc.resolve(taskListEndPos);
+                const lastItemParaEnd = $taskListEnd.end($taskListEnd.depth);
+                tr.delete(paraStart, paraEnd);
+                let insertAt = lastItemParaEnd;
+                paraContent.forEach((inline) => {
+                  tr.insert(insertAt, inline);
+                  insertAt += inline.nodeSize;
+                });
+                tr.setSelection(import_prosemirror_state.TextSelection.create(tr.doc, lastItemParaEnd));
+                this.editor.view.dispatch(tr);
+                return true;
+              } catch {
+                return false;
               }
             }
           }
@@ -9801,7 +9802,8 @@ var CustomTaskItem = import_extension_task_item.default.extend({
           "border: 2px solid " + colors.border,
           `background-image: url("${imageUrl}")`,
           "background-repeat: no-repeat",
-          "background-position: center"
+          "background-position: center",
+          "box-sizing: unset !important"
         ].join("; ");
         li.setAttribute("data-status", status);
       };
@@ -10032,12 +10034,24 @@ var Dropdown = ({ trigger, children, className = "", keepOpen = false }) => {
     const menu = menuRef.current;
     menu.style.left = "0";
     menu.style.right = "auto";
-    const rect = menu.getBoundingClientRect();
-    const vw = window.innerWidth;
-    if (rect.right > vw - 8) {
-      menu.style.left = "auto";
-      menu.style.right = "0";
-    }
+    requestAnimationFrame(() => {
+      if (!menu) return;
+      const rect = menu.getBoundingClientRect();
+      const vw = window.innerWidth;
+      const parentLeft = ref.current?.getBoundingClientRect().left || 0;
+      if (rect.right > vw - 8) {
+        menu.style.left = "auto";
+        menu.style.right = "0";
+        const newRect = menu.getBoundingClientRect();
+        if (newRect.left < 8) {
+          menu.style.left = `${8 - parentLeft}px`;
+          menu.style.right = "auto";
+        }
+      } else if (rect.left < 8) {
+        menu.style.left = `${8 - parentLeft}px`;
+        menu.style.right = "auto";
+      }
+    });
   }, [open]);
   return /* @__PURE__ */ import_react55.default.createElement("div", { className: `dropdown ${className}`, ref }, /* @__PURE__ */ import_react55.default.createElement(
     "button",
@@ -10302,10 +10316,11 @@ var ColorPickerPanel = ({ editor, onClose }) => {
     }
   ))), /* @__PURE__ */ import_react55.default.createElement("div", { className: "color-picker-footer" }, /* @__PURE__ */ import_react55.default.createElement("div", { className: "color-picker-preview", style: { background: activeColor || "#000" } }), /* @__PURE__ */ import_react55.default.createElement("button", { className: "color-picker-remove", onClick: removeColor, title: "Remove color" }, "\u2713")));
 };
-var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTextToSpeech, onClose, onImageUpload }) => {
+var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTextToSpeech, onClose, onImageUpload, visibleButtons }) => {
   const [, setEditorState] = (0, import_react55.useState)(0);
   const [isFullscreen, setIsFullscreen] = (0, import_react55.useState)(false);
   const [todoEnabled, setTodoEnabled] = (0, import_react55.useState)(false);
+  const show = (id) => !visibleButtons || visibleButtons.has(id);
   (0, import_react55.useEffect)(() => {
     if (!editor) return;
     const onTransaction = () => setEditorState((n) => n + 1);
@@ -10389,7 +10404,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
     setTimeout(() => setTranslateStatus(""), 2e3);
   }, [editor, translateSource, translateTarget, onTranslate]);
   if (!editor) return null;
-  return /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar" }, /* @__PURE__ */ import_react55.default.createElement("div", { className: `toolbar-row ${onClose ? "with-close" : ""}` }, /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, /* @__PURE__ */ import_react55.default.createElement(
+  return /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar" }, /* @__PURE__ */ import_react55.default.createElement("div", { className: `toolbar-row ${onClose ? "with-close" : ""}` }, (show("undo") || show("redo")) && /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, show("undo") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: "toolbar-btn",
@@ -10398,7 +10413,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Undo (Ctrl+Z)"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconUndo, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("redo") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: "toolbar-btn",
@@ -10407,7 +10422,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Redo (Ctrl+Y)"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconRedo, null)
-  )), /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, /* @__PURE__ */ import_react55.default.createElement(AICommands_default, { editor, onAICommand })), /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, /* @__PURE__ */ import_react55.default.createElement(
+  )), show("ai") && /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, /* @__PURE__ */ import_react55.default.createElement(AICommands_default, { editor, onAICommand })), /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, show("paragraph") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: {
@@ -10474,7 +10489,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       " Code Block"
     ),
     /* @__PURE__ */ import_react55.default.createElement("button", { className: "dropdown-item", onClick: () => editor.chain().focus().setHorizontalRule().run() }, "\u2014 Horizontal Rule")
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("fontsize") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: {
@@ -10501,7 +10516,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
         sizeStr
       );
     })
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("font") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: {
@@ -10528,7 +10543,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
         font
       );
     })
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("color") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: {
@@ -10538,7 +10553,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       keepOpen: true
     },
     (close) => /* @__PURE__ */ import_react55.default.createElement(ColorPickerPanel, { editor, onClose: close })
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("bold") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: `toolbar-btn ${editor.isActive("bold") ? "is-active" : ""}`,
@@ -10546,7 +10561,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Bold (Ctrl+B)"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconBold, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("italic") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: `toolbar-btn ${editor.isActive("italic") ? "is-active" : ""}`,
@@ -10554,7 +10569,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Italic (Ctrl+I)"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconItalic, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("strike") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: { label: /* @__PURE__ */ import_react55.default.createElement(IconStrike, null), title: "Text decoration", className: editor.isActive("strike") ? "is-active" : "" }
@@ -10579,7 +10594,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
         c.run();
       }
     } }, "\u2715 Clear formatting")
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("link") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: `toolbar-btn ${editor.isActive("link") ? "is-active" : ""}`,
@@ -10587,7 +10602,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Insert Link"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconLink, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("lineheight") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: {
@@ -10614,7 +10629,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
         lh
       );
     })
-  )), /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, /* @__PURE__ */ import_react55.default.createElement(
+  )), (show("ul") || show("ol")) && /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, show("ul") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: {
@@ -10657,7 +10672,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       " ",
       item.label
     ))
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("ol") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: {
@@ -10702,7 +10717,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       " ",
       item.label
     ))
-  )), /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, /* @__PURE__ */ import_react55.default.createElement(
+  )), (show("align") || show("indent") || show("outdent")) && /* @__PURE__ */ import_react55.default.createElement("div", { className: "toolbar-group" }, show("align") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: {
@@ -10727,7 +10742,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       " ",
       item.label
     ))
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("indent") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: "toolbar-btn",
@@ -10748,7 +10763,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Increase Indent"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconIndentIncrease, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("outdent") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: "toolbar-btn",
@@ -10769,7 +10784,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Decrease Indent"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconIndentDecrease, null)
-  )), /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: /* @__PURE__ */ import_react55.default.createElement(IconTable, null), title: "Insert Table" }, keepOpen: true }, (close) => /* @__PURE__ */ import_react55.default.createElement(TableGridSelector, { editor, onClose: close })), /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: /* @__PURE__ */ import_react55.default.createElement(IconImage, null), title: "Insert Image" }, keepOpen: true }, (close) => /* @__PURE__ */ import_react55.default.createElement(ImagePanel, { editor, onClose: close, onImageUpload })), /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: /* @__PURE__ */ import_react55.default.createElement(IconVideo, null), title: "Insert Video" }, keepOpen: true }, (close) => /* @__PURE__ */ import_react55.default.createElement(InsertPanel, { editor, onClose: close, mode: "video" })), /* @__PURE__ */ import_react55.default.createElement(
+  )), show("table") && /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: /* @__PURE__ */ import_react55.default.createElement(IconTable, null), title: "Insert Table" }, keepOpen: true }, (close) => /* @__PURE__ */ import_react55.default.createElement(TableGridSelector, { editor, onClose: close })), show("image") && /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: /* @__PURE__ */ import_react55.default.createElement(IconImage, null), title: "Insert Image" }, keepOpen: true }, (close) => /* @__PURE__ */ import_react55.default.createElement(ImagePanel, { editor, onClose: close, onImageUpload })), show("video") && /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: /* @__PURE__ */ import_react55.default.createElement(IconVideo, null), title: "Insert Video" }, keepOpen: true }, (close) => /* @__PURE__ */ import_react55.default.createElement(InsertPanel, { editor, onClose: close, mode: "video" })), show("cut") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: "toolbar-btn",
@@ -10777,7 +10792,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Cut (Ctrl+X)"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconCut, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("copy") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: "toolbar-btn",
@@ -10785,7 +10800,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Copy selected text"
     },
     copySuccess ? /* @__PURE__ */ import_react55.default.createElement(IconCheck, null) : /* @__PURE__ */ import_react55.default.createElement(IconCopy, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("paste") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: "toolbar-btn",
@@ -10793,7 +10808,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Paste (Ctrl+V)"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconPaste, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: "\u03A9", title: "Special characters", className: "special-characters-btn" } }, /* @__PURE__ */ import_react55.default.createElement("div", { className: "char-grid" }, SPECIAL_CHARS.map((char) => /* @__PURE__ */ import_react55.default.createElement(
+  ), show("specialchars") && /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: "\u03A9", title: "Special characters", className: "special-characters-btn" } }, /* @__PURE__ */ import_react55.default.createElement("div", { className: "char-grid" }, SPECIAL_CHARS.map((char) => /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       key: char,
@@ -10801,7 +10816,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       onClick: () => insertSpecialChar(char)
     },
     char
-  )))), /* @__PURE__ */ import_react55.default.createElement(
+  )))), show("code") && /* @__PURE__ */ import_react55.default.createElement(
     Dropdown,
     {
       trigger: { label: /* @__PURE__ */ import_react55.default.createElement(IconCode, null), title: "Code", className: editor.isActive("code") || editor.isActive("codeBlock") ? "is-active" : "" }
@@ -10825,7 +10840,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       }
     } }, "</>", " Inline Code"),
     /* @__PURE__ */ import_react55.default.createElement("button", { className: "dropdown-item", onClick: () => editor.chain().focus().toggleCodeBlock().run() }, "{ }", " Code Block")
-  ), /* @__PURE__ */ import_react55.default.createElement(
+  ), show("fullscreen") && /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: `toolbar-btn ${isFullscreen ? "is-active" : ""}`,
@@ -10833,7 +10848,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Toggle Fullscreen"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconFullscreen, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(TextToSpeech_default, { editor, onTextToSpeech }), /* @__PURE__ */ import_react55.default.createElement(SpeechToText_default, { editor, onSpeechToText }), /* @__PURE__ */ import_react55.default.createElement("div", { className: "translate-split-btn" }, /* @__PURE__ */ import_react55.default.createElement(
+  ), show("tts") && /* @__PURE__ */ import_react55.default.createElement(TextToSpeech_default, { editor, onTextToSpeech }), show("stt") && /* @__PURE__ */ import_react55.default.createElement(SpeechToText_default, { editor, onSpeechToText }), show("translate") && /* @__PURE__ */ import_react55.default.createElement("div", { className: "translate-split-btn" }, /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: "toolbar-btn",
@@ -10841,7 +10856,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
       title: "Translate selected text"
     },
     /* @__PURE__ */ import_react55.default.createElement(IconTranslate, null)
-  ), /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: "", title: "Translate options", className: "translate-arrow-btn" } }, /* @__PURE__ */ import_react55.default.createElement("button", { className: "dropdown-item", onClick: () => setShowTranslateModal(true) }, "Options")), translateStatus && /* @__PURE__ */ import_react55.default.createElement("span", { className: `translate-toast-popup ${translateStatus === "Please select the text" || translateStatus === "Translation failed" ? "error" : ""}` }, translateStatus)), /* @__PURE__ */ import_react55.default.createElement("div", { className: "todo-split-btn" }, /* @__PURE__ */ import_react55.default.createElement(
+  ), /* @__PURE__ */ import_react55.default.createElement(Dropdown, { trigger: { label: "", title: "Translate options", className: "translate-arrow-btn" } }, /* @__PURE__ */ import_react55.default.createElement("button", { className: "dropdown-item", onClick: () => setShowTranslateModal(true) }, "Options")), translateStatus && /* @__PURE__ */ import_react55.default.createElement("span", { className: `translate-toast-popup ${translateStatus === "Please select the text" || translateStatus === "Translation failed" ? "error" : ""}` }, translateStatus)), show("todo") && /* @__PURE__ */ import_react55.default.createElement("div", { className: "todo-split-btn" }, /* @__PURE__ */ import_react55.default.createElement(
     "button",
     {
       className: `toolbar-btn ${todoEnabled ? "is-active" : ""}`,
@@ -11084,7 +11099,7 @@ var ImagePropertiesModal = ({ editor, node, onClose }) => {
       checked: openInNewTab,
       onChange: (e) => setOpenInNewTab(e.target.checked)
     }
-  ), "Open link in new tab")) : /* @__PURE__ */ import_react56.default.createElement(import_react56.default.Fragment, null, /* @__PURE__ */ import_react56.default.createElement("label", { className: "modal-label" }, "CSS Class"), /* @__PURE__ */ import_react56.default.createElement("input", { type: "text", className: "modal-input", placeholder: "e.g. rounded shadow" }), /* @__PURE__ */ import_react56.default.createElement("label", { className: "modal-label" }, "Inline Style"), /* @__PURE__ */ import_react56.default.createElement("input", { type: "text", className: "modal-input", placeholder: "e.g. border: 1px solid #ccc" }))))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "modal-footer" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "modal-footer-left" }, /* @__PURE__ */ import_react56.default.createElement("button", { className: "modal-btn-cancel", onClick: onClose }, "\xD7 Cancel"), /* @__PURE__ */ import_react56.default.createElement("button", { className: "modal-btn-delete", onClick: handleDelete }, "\u{1F5D1} Delete")), /* @__PURE__ */ import_react56.default.createElement("button", { className: "modal-btn-apply", onClick: handleApply }, "\u2714 Apply"))));
+  ), "Open link in new tab")) : /* @__PURE__ */ import_react56.default.createElement(import_react56.default.Fragment, null, /* @__PURE__ */ import_react56.default.createElement("label", { className: "modal-label" }, "CSS Class"), /* @__PURE__ */ import_react56.default.createElement("input", { type: "text", className: "modal-input", placeholder: "e.g. rounded shadow" }), /* @__PURE__ */ import_react56.default.createElement("label", { className: "modal-label" }, "Inline Style"), /* @__PURE__ */ import_react56.default.createElement("input", { type: "text", className: "modal-input", placeholder: "e.g. border: 1px solid #ccc" }))))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "modal-footer" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "modal-footer-left" }, /* @__PURE__ */ import_react56.default.createElement("button", { className: "modal-btn-cancel", onClick: onClose }, "Cancel"), /* @__PURE__ */ import_react56.default.createElement("button", { className: "modal-btn-delete", onClick: handleDelete }, "Delete")), /* @__PURE__ */ import_react56.default.createElement("button", { className: "modal-btn-apply", onClick: handleApply }, "Apply"))));
 };
 var ImageToolbar = ({ editor }) => {
   const [showModal, setShowModal] = (0, import_react56.useState)(false);
@@ -11337,7 +11352,7 @@ var VideoPropertiesModal = ({ editor, node, nodeType, onClose }) => {
       value: height,
       onChange: (e) => handleHeightChange(e.target.value)
     }
-  )))), /* @__PURE__ */ import_react57.default.createElement("div", { className: "modal-footer" }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "modal-footer-left" }, /* @__PURE__ */ import_react57.default.createElement("button", { className: "modal-btn-cancel", onClick: onClose }, "\xD7 Cancel"), /* @__PURE__ */ import_react57.default.createElement("button", { className: "modal-btn-delete", onClick: handleDelete }, "\u{1F5D1} Delete")), /* @__PURE__ */ import_react57.default.createElement("button", { className: "modal-btn-apply", onClick: handleApply }, "\u2714 Apply"))));
+  )))), /* @__PURE__ */ import_react57.default.createElement("div", { className: "modal-footer" }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "modal-footer-left" }, /* @__PURE__ */ import_react57.default.createElement("button", { className: "modal-btn-cancel", onClick: onClose }, "Cancel"), /* @__PURE__ */ import_react57.default.createElement("button", { className: "modal-btn-delete", onClick: handleDelete }, "Delete")), /* @__PURE__ */ import_react57.default.createElement("button", { className: "modal-btn-apply", onClick: handleApply }, "Apply"))));
 };
 var VideoToolbar = ({ editor }) => {
   const [showModal, setShowModal] = (0, import_react57.useState)(false);
@@ -11470,6 +11485,62 @@ var VideoToolbar = ({ editor }) => {
 var VideoToolbar_default = VideoToolbar;
 
 // lib/RufousTextEditor/RufousTextEditor.tsx
+var VARIANT_BUTTONS = {
+  default: [
+    "undo",
+    "redo",
+    "|",
+    "ai",
+    "|",
+    "paragraph",
+    "fontsize",
+    "font",
+    "color",
+    "bold",
+    "italic",
+    "strike",
+    "link",
+    "lineheight",
+    "|",
+    "ul",
+    "ol",
+    "|",
+    "align",
+    "indent",
+    "outdent",
+    "|",
+    "table",
+    "image",
+    "video",
+    "|",
+    "cut",
+    "copy",
+    "paste",
+    "specialchars",
+    "code",
+    "fullscreen",
+    "|",
+    "tts",
+    "stt",
+    "translate",
+    "|",
+    "todo"
+  ],
+  basic: [
+    "undo",
+    "redo",
+    "|",
+    "paragraph",
+    "fontsize",
+    "font",
+    "bold",
+    "italic",
+    "link",
+    "|",
+    "ul",
+    "ol"
+  ]
+};
 var RufousTextEditor = ({
   content: initialContent,
   placeholder: customPlaceholder,
@@ -11485,6 +11556,10 @@ var RufousTextEditor = ({
   onImageUpload,
   onClose,
   mentions,
+  variant = "default",
+  buttons,
+  hideButtons,
+  width,
   height,
   resizable = false,
   className,
@@ -11492,6 +11567,14 @@ var RufousTextEditor = ({
   sx
 }) => {
   const sxClass = useSx(sx);
+  const toolbarButtons = (0, import_react58.useMemo)(() => {
+    const list = buttons || VARIANT_BUTTONS[variant] || VARIANT_BUTTONS.default;
+    const visible = new Set(list.filter((b) => b !== "|"));
+    if (hideButtons) {
+      hideButtons.forEach((b) => visible.delete(b));
+    }
+    return visible;
+  }, [buttons, variant, hideButtons]);
   const mentionSuggestion = (0, import_react58.useMemo)(() => createMentionSuggestion(mentions), [mentions]);
   const onChangeRef = (0, import_react58.useRef)(onChange);
   const onBlurRef = (0, import_react58.useRef)(onBlur);
@@ -11657,6 +11740,25 @@ var RufousTextEditor = ({
       if ((event.ctrlKey || event.metaKey) && event.key === "k") {
         event.preventDefault();
         setLinkRef.current?.();
+        return;
+      }
+      if (event.key === " " && editor.isActive("link")) {
+        const { $from } = editor.state.selection;
+        const linkMark = editor.state.schema.marks.link;
+        const parent = $from.parent;
+        let atLinkEnd = false;
+        parent.forEach((child, offset2) => {
+          if (child.isText && child.marks.some((m) => m.type === linkMark)) {
+            const childEnd = offset2 + child.nodeSize;
+            if ($from.parentOffset === childEnd) {
+              atLinkEnd = true;
+            }
+          }
+        });
+        if (atLinkEnd) {
+          event.preventDefault();
+          editor.chain().focus().unsetMark("link").insertContent(" ").run();
+        }
       }
     };
     editor.view.dom.addEventListener("keydown", handleKeyDown);
@@ -11717,7 +11819,6 @@ var RufousTextEditor = ({
     setLinkSelection(null);
     editor?.chain().focus().run();
   }, [editor]);
-  const [saveFormat, setSaveFormat] = (0, import_react58.useState)("html");
   const [saveStatus, setSaveStatus] = (0, import_react58.useState)("");
   const handleSave = (0, import_react58.useCallback)(() => {
     if (!editor || !onSaveProp) return;
@@ -11729,12 +11830,6 @@ var RufousTextEditor = ({
     if (!editor || !onExportProp) return;
     onExportProp(editor.getHTML(), editor.getJSON());
   }, [editor, onExportProp]);
-  const handleClear = (0, import_react58.useCallback)(() => {
-    if (!editor) return;
-    if (window.confirm("Clear all content? This cannot be undone.")) {
-      editor.commands.clearContent();
-    }
-  }, [editor]);
   const providerValue = (0, import_react58.useMemo)(() => ({ editor }), [editor]);
   return /* @__PURE__ */ import_react58.default.createElement(
     "div",
@@ -11742,6 +11837,7 @@ var RufousTextEditor = ({
       className: `rf-rte-wrapper editor-wrapper ${resizable ? "rf-rte-resizable" : ""} ${sxClass} ${className || ""}`,
       style: {
         ...style,
+        ...width ? { width: typeof width === "number" ? `${width}px` : width } : {},
         ...height ? { height: typeof height === "number" ? `${height}px` : height } : {}
       }
     },
@@ -11755,7 +11851,8 @@ var RufousTextEditor = ({
         onSpeechToText,
         onTextToSpeech,
         onImageUpload,
-        onClose
+        onClose,
+        visibleButtons: toolbarButtons
       }
     ), /* @__PURE__ */ import_react58.default.createElement(import_react59.EditorContent, { editor, className: "editor-content-wrapper" }), /* @__PURE__ */ import_react58.default.createElement(ImageToolbar_default, { editor }), /* @__PURE__ */ import_react58.default.createElement(VideoToolbar_default, { editor }), editor && /* @__PURE__ */ import_react58.default.createElement(
       import_react59.BubbleMenu,
@@ -11870,16 +11967,7 @@ var RufousTextEditor = ({
         },
         "\u201C Quote"
       )
-    ), /* @__PURE__ */ import_react58.default.createElement("div", { className: "status-bar" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "status-bar-left" }, /* @__PURE__ */ import_react58.default.createElement(
-      "select",
-      {
-        value: saveFormat,
-        onChange: (e) => setSaveFormat(e.target.value),
-        className: "format-select"
-      },
-      /* @__PURE__ */ import_react58.default.createElement("option", { value: "html" }, "HTML"),
-      /* @__PURE__ */ import_react58.default.createElement("option", { value: "json" }, "JSON")
-    ), onSaveProp && /* @__PURE__ */ import_react58.default.createElement("button", { onClick: handleSave, className: "status-btn save-btn" }, "Save"), onExportProp && /* @__PURE__ */ import_react58.default.createElement("button", { onClick: handleExport, className: "status-btn export-btn" }, "Export"), /* @__PURE__ */ import_react58.default.createElement("button", { onClick: handleClear, className: "status-btn clear-btn" }, "Clear")), /* @__PURE__ */ import_react58.default.createElement("div", { className: "status-bar-right" }, saveStatus && /* @__PURE__ */ import_react58.default.createElement("span", { className: "save-status" }, saveStatus), editor && /* @__PURE__ */ import_react58.default.createElement(import_react58.default.Fragment, null, /* @__PURE__ */ import_react58.default.createElement("span", { className: "word-count" }, "CHARS: ", editor.storage.characterCount?.characters?.() ?? editor.getText().length), /* @__PURE__ */ import_react58.default.createElement("span", { className: "word-count" }, "WORDS: ", editor.storage.characterCount?.words?.() ?? editor.getText().split(/\s+/).filter(Boolean).length)))), linkModalOpen && /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal-overlay", onClick: handleLinkCancel }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal", onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal-body" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal-field" }, /* @__PURE__ */ import_react58.default.createElement("label", { className: "link-modal-label" }, "URL"), /* @__PURE__ */ import_react58.default.createElement(
+    ), /* @__PURE__ */ import_react58.default.createElement("div", { className: "status-bar" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "status-bar-left" }, onSaveProp && /* @__PURE__ */ import_react58.default.createElement("button", { onClick: handleSave, className: "status-btn save-btn" }, "Save"), onExportProp && /* @__PURE__ */ import_react58.default.createElement("button", { onClick: handleExport, className: "status-btn export-btn" }, "Export")), /* @__PURE__ */ import_react58.default.createElement("div", { className: "status-bar-right" }, saveStatus && /* @__PURE__ */ import_react58.default.createElement("span", { className: "save-status" }, saveStatus), editor && /* @__PURE__ */ import_react58.default.createElement(import_react58.default.Fragment, null, /* @__PURE__ */ import_react58.default.createElement("span", { className: "word-count" }, "CHARS: ", editor.storage.characterCount?.characters?.() ?? editor.getText().length), /* @__PURE__ */ import_react58.default.createElement("span", { className: "word-count" }, "WORDS: ", editor.storage.characterCount?.words?.() ?? editor.getText().split(/\s+/).filter(Boolean).length)))), linkModalOpen && /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal-overlay", onClick: handleLinkCancel }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal", onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal-body" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal-field" }, /* @__PURE__ */ import_react58.default.createElement("label", { className: "link-modal-label" }, "URL"), /* @__PURE__ */ import_react58.default.createElement(
       "input",
       {
         type: "url",
@@ -11904,18 +11992,6 @@ var RufousTextEditor = ({
         },
         placeholder: "Link text"
       }
-    )), /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal-field" }, /* @__PURE__ */ import_react58.default.createElement("label", { className: "link-modal-label" }, "Class name"), /* @__PURE__ */ import_react58.default.createElement(
-      "input",
-      {
-        type: "text",
-        className: "link-modal-input",
-        value: linkClassName,
-        onChange: (e) => setLinkClassName(e.target.value),
-        onKeyDown: (e) => {
-          if (e.key === "Enter") handleLinkSubmit();
-        },
-        placeholder: ""
-      }
     )), /* @__PURE__ */ import_react58.default.createElement("div", { className: "link-modal-checkboxes" }, /* @__PURE__ */ import_react58.default.createElement("label", { className: "link-modal-checkbox" }, /* @__PURE__ */ import_react58.default.createElement(
       "input",
       {