npm - tetrons - Versions diffs - 2.3.90 → 2.3.92 - Mend

tetrons 2.3.90 → 2.3.92

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dist/components/tetrons/EditorContent.tsx +1 -1
package/dist/index.cjs +169 -132
package/dist/index.mjs +169 -132
package/package.json +1 -1

package/dist/components/tetrons/EditorContent.tsx CHANGED Viewed

@@ -2,7 +2,7 @@
 import { MathInline } from "./extensions/MathExtension";
 import React, { useEffect, useRef, useState } from "react";
 import { useEditor, EditorContent as TiptapEditorContent } from "@tiptap/react";
-import type { AddOn } from "./toolbar/TetronsToolbar";
+import type { AddOn } from "../../types/types";
 import { getActivePlan, Plan } from "../../utils/licenseTracker";
 import Document from "@tiptap/extension-document";

package/dist/index.cjs CHANGED Viewed

@@ -16016,14 +16016,10 @@ function ActionGroup({ editor }) {
         setDropdownOpen(false);
       }
     };
-    if (dropdownOpen) {
+    if (dropdownOpen)
       document.addEventListener("mousedown", handleClickOutside);
-    } else {
-      document.removeEventListener("mousedown", handleClickOutside);
-    }
-    return () => {
-      document.removeEventListener("mousedown", handleClickOutside);
-    };
+    else document.removeEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
   }, [dropdownOpen]);
   const zoomIn = () => {
     const element = document.querySelector(
@@ -16032,8 +16028,7 @@ function ActionGroup({ editor }) {
     if (element) {
       const style = element.style;
       const currentZoom = parseFloat(style.zoom || "1");
-      const next = Math.min(currentZoom + 0.1, 2);
-      style.zoom = next.toString();
+      style.zoom = Math.min(currentZoom + 0.1, 2).toString();
     }
   };
   const zoomOut = () => {
@@ -16043,28 +16038,24 @@ function ActionGroup({ editor }) {
     if (element) {
       const style = element.style;
       const currentZoom = parseFloat(style.zoom || "1");
-      const next = Math.max(currentZoom - 0.1, 0.5);
-      style.zoom = next.toString();
+      style.zoom = Math.max(currentZoom - 0.1, 0.5).toString();
     }
   };
   const handlePrint = () => {
+    if (!editor) return;
     const html = editor.getHTML();
     const printWindow = window.open("", "_blank");
     if (printWindow) {
-      printWindow.document.write(`
-        <html>
-          <head>
-            <title>Print</title>
-          </head>
-          <body>${html}</body>
-        </html>
-      `);
+      printWindow.document.write(
+        `<html><head><title>Print</title></head><body>${html}</body></html>`
+      );
       printWindow.document.close();
       printWindow.focus();
       printWindow.print();
     }
   };
   const handleSave = async () => {
+    if (!editor) return;
     const content = editor.getJSON();
     try {
       const response = await fetch("/api/save", {
@@ -16074,14 +16065,14 @@ function ActionGroup({ editor }) {
       });
       if (!response.ok) throw new Error("Failed to save file");
       const result = await response.json();
-      console.log(result.message);
-      alert("Content saved successfully!");
+      alert(result.message || "Content saved successfully!");
     } catch (error) {
-      console.error("Error saving content:", error);
+      console.error(error);
       alert("Failed to save content.");
     }
   };
   const handleDownloadPDF = async () => {
+    if (!editor) return;
     const html = editor.getHTML();
     const container = document.createElement("div");
     container.innerHTML = html;
@@ -16089,22 +16080,22 @@ function ActionGroup({ editor }) {
     document.body.appendChild(container);
     try {
       const domToPdf = (await import("dom-to-pdf")).default;
-      const options = {
-        filename: "document.pdf",
-        overrideWidth: 800,
-        overrideHeight: 1120
-      };
-      domToPdf(container, options, () => {
-        console.log("PDF downloaded!");
-      });
+      domToPdf(
+        container,
+        { filename: "document.pdf", overrideWidth: 800, overrideHeight: 1120 },
+        () => {
+          console.log("PDF downloaded!");
+        }
+      );
     } catch (error) {
-      console.error("PDF download failed", error);
+      console.error(error);
       alert("Failed to download PDF.");
     } finally {
       document.body.removeChild(container);
     }
   };
   const handleDownloadHTML = () => {
+    if (!editor) return;
     const html = editor.getHTML();
     const blob = new Blob([html], { type: "text/html" });
     const link = document.createElement("a");
@@ -16115,15 +16106,11 @@ function ActionGroup({ editor }) {
     document.body.removeChild(link);
   };
   const handleDownloadDOCX = async () => {
+    if (!editor) return;
     const { Document: Document2, Packer, Paragraph: Paragraph2 } = await import("docx");
     const text = editor.getText();
     const doc3 = new Document2({
-      sections: [
-        {
-          properties: {},
-          children: [new Paragraph2(text)]
-        }
-      ]
+      sections: [{ properties: {}, children: [new Paragraph2(text)] }]
     });
     const blob = await Packer.toBlob(doc3);
     const link = document.createElement("a");
@@ -16133,49 +16120,59 @@ function ActionGroup({ editor }) {
     link.click();
     document.body.removeChild(link);
   };
-  return /* @__PURE__ */ import_react10.default.createElement("div", { className: "action-group", role: "group", "aria-label": "Editor actions" }, /* @__PURE__ */ import_react10.default.createElement(ToolbarButton_default, { icon: import_md.MdZoomIn, onClick: zoomIn, title: "Zoom In" }), /* @__PURE__ */ import_react10.default.createElement(ToolbarButton_default, { icon: import_md.MdZoomOut, onClick: zoomOut, title: "Zoom Out" }), /* @__PURE__ */ import_react10.default.createElement(ToolbarButton_default, { icon: import_md.MdPrint, onClick: handlePrint, title: "Print" }), /* @__PURE__ */ import_react10.default.createElement(ToolbarButton_default, { icon: import_md.MdSave, onClick: handleSave, title: "Save" }), /* @__PURE__ */ import_react10.default.createElement("div", { className: "relative", ref: dropdownRef }, /* @__PURE__ */ import_react10.default.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => setDropdownOpen((open) => !open),
-      "aria-haspopup": "menu",
-      "aria-expanded": dropdownOpen ? "true" : "false",
-      className: "export-button",
-      title: "Export"
-    },
-    /* @__PURE__ */ import_react10.default.createElement(import_md.MdDownload, null),
-    /* @__PURE__ */ import_react10.default.createElement("span", { className: "text-sm" })
-  ), dropdownOpen && /* @__PURE__ */ import_react10.default.createElement("div", { className: "export-dropdown" }, /* @__PURE__ */ import_react10.default.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => {
-        setDropdownOpen(false);
-        handleDownloadPDF();
-      }
-    },
-    "Export as PDF"
-  ), /* @__PURE__ */ import_react10.default.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => {
-        setDropdownOpen(false);
-        handleDownloadHTML();
-      }
-    },
-    "Export as HTML"
-  ), /* @__PURE__ */ import_react10.default.createElement(
-    "button",
+  if (!editor) return null;
+  return /* @__PURE__ */ import_react10.default.createElement(
+    "div",
     {
-      type: "button",
-      onClick: () => {
-        setDropdownOpen(false);
-        handleDownloadDOCX();
-      }
+      className: "action-group bg-white text-black dark:bg-gray-800 dark:text-white",
+      role: "group",
+      "aria-label": "Editor actions"
     },
-    "Export as DOCX"
-  ))));
+    /* @__PURE__ */ import_react10.default.createElement(ToolbarButton_default, { icon: import_md.MdZoomIn, onClick: zoomIn, title: "Zoom In" }),
+    /* @__PURE__ */ import_react10.default.createElement(ToolbarButton_default, { icon: import_md.MdZoomOut, onClick: zoomOut, title: "Zoom Out" }),
+    /* @__PURE__ */ import_react10.default.createElement(ToolbarButton_default, { icon: import_md.MdPrint, onClick: handlePrint, title: "Print" }),
+    /* @__PURE__ */ import_react10.default.createElement(ToolbarButton_default, { icon: import_md.MdSave, onClick: handleSave, title: "Save" }),
+    /* @__PURE__ */ import_react10.default.createElement("div", { className: "relative", ref: dropdownRef }, /* @__PURE__ */ import_react10.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => setDropdownOpen((o) => !o),
+        className: "export-button",
+        title: "Export"
+      },
+      /* @__PURE__ */ import_react10.default.createElement(import_md.MdDownload, null)
+    ), dropdownOpen && /* @__PURE__ */ import_react10.default.createElement("div", { className: "export-dropdown" }, /* @__PURE__ */ import_react10.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          setDropdownOpen(false);
+          handleDownloadPDF();
+        }
+      },
+      "Export as PDF"
+    ), /* @__PURE__ */ import_react10.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          setDropdownOpen(false);
+          handleDownloadHTML();
+        }
+      },
+      "Export as HTML"
+    ), /* @__PURE__ */ import_react10.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          setDropdownOpen(false);
+          handleDownloadDOCX();
+        }
+      },
+      "Export as DOCX"
+    )))
+  );
 }
 // src/components/tetrons/toolbar/ClipboardGroup.tsx
@@ -16638,13 +16635,18 @@ function InsertGroup({ editor }) {
 var import_react15 = __toESM(require("react"));
 var import_md5 = require("react-icons/md");
 function ListAlignGroup({ editor }) {
-  return /* @__PURE__ */ import_react15.default.createElement("div", { className: "list-align-group" }, /* @__PURE__ */ import_react15.default.createElement(
+  if (!editor) return null;
+  const canToggleBullet = editor.can().toggleBulletList() || editor.isEmpty;
+  const canToggleOrdered = editor.can().toggleOrderedList() || editor.isEmpty;
+  const canSink = editor.can().sinkListItem("listItem");
+  const canLift = editor.can().liftListItem("listItem");
+  return /* @__PURE__ */ import_react15.default.createElement("div", { className: "list-align-group bg-white text-black dark:bg-gray-800 dark:text-white" }, /* @__PURE__ */ import_react15.default.createElement(
     ToolbarButton_default,
     {
       icon: import_md5.MdFormatListBulleted,
       title: "Bulleted List",
       onClick: () => editor.chain().focus().toggleBulletList().run(),
-      disabled: !editor.can().toggleBulletList()
+      disabled: !canToggleBullet
     }
   ), /* @__PURE__ */ import_react15.default.createElement(
     ToolbarButton_default,
@@ -16652,7 +16654,7 @@ function ListAlignGroup({ editor }) {
       icon: import_md5.MdFormatListNumbered,
       title: "Numbered List",
       onClick: () => editor.chain().focus().toggleOrderedList().run(),
-      disabled: !editor.can().toggleOrderedList()
+      disabled: !canToggleOrdered
     }
   ), /* @__PURE__ */ import_react15.default.createElement(
     ToolbarButton_default,
@@ -16660,7 +16662,7 @@ function ListAlignGroup({ editor }) {
       icon: import_md5.MdFormatIndentIncrease,
       title: "Increase Indent",
       onClick: () => editor.chain().focus().sinkListItem("listItem").run(),
-      disabled: !editor.can().sinkListItem("listItem")
+      disabled: !canSink
     }
   ), /* @__PURE__ */ import_react15.default.createElement(
     ToolbarButton_default,
@@ -16668,7 +16670,7 @@ function ListAlignGroup({ editor }) {
       icon: import_md5.MdFormatIndentDecrease,
       title: "Decrease Indent",
       onClick: () => editor.chain().focus().liftListItem("listItem").run(),
-      disabled: !editor.can().liftListItem("listItem")
+      disabled: !canLift
     }
   ), /* @__PURE__ */ import_react15.default.createElement(
     ToolbarButton_default,
@@ -16729,26 +16731,7 @@ async function checkGrammar(text) {
 }
 // src/components/tetrons/toolbar/MiscGroup.tsx
-function MiscGroup({ editor }) {
-  const handlePreview = () => {
-    const html = editor.getHTML();
-    const previewWindow = window.open("", "_blank");
-    if (previewWindow) {
-      previewWindow.document.open();
-      previewWindow.document.write(`
-        <html>
-          <head>
-            <title>Preview</title>
-            <style>
-              body { font-family: sans-serif; padding: 2rem; line-height: 1.6; }
-            </style>
-          </head>
-          <body>${html}</body>
-        </html>
-      `);
-      previewWindow.document.close();
-    }
-  };
+function MiscGroup({ editor, enabledFeatures }) {
   const handleGrammarCheck = async () => {
     const text = editor.getText();
     try {
@@ -16772,7 +16755,26 @@ Reason: ${issue.message}
       alert("\u274C Failed to check grammar. Please try again later.");
     }
   };
-  return /* @__PURE__ */ import_react16.default.createElement("div", { className: "misc-group" }, /* @__PURE__ */ import_react16.default.createElement(
+  const handlePreview = () => {
+    const html = editor.getHTML();
+    const previewWindow = window.open("", "_blank");
+    if (previewWindow) {
+      previewWindow.document.open();
+      previewWindow.document.write(`
+        <html>
+          <head>
+            <title>Preview</title>
+            <style>
+              body { font-family: sans-serif; padding: 2rem; line-height: 1.6; }
+            </style>
+          </head>
+          <body>${html}</body>
+        </html>
+      `);
+      previewWindow.document.close();
+    }
+  };
+  return /* @__PURE__ */ import_react16.default.createElement("div", { className: "misc-group" }, enabledFeatures.includes("undo") && /* @__PURE__ */ import_react16.default.createElement(
     ToolbarButton_default,
     {
       icon: import_md6.MdUndo,
@@ -16780,7 +16782,7 @@ Reason: ${issue.message}
       onClick: () => editor.chain().focus().undo().run(),
       disabled: !editor.can().undo()
     }
-  ), /* @__PURE__ */ import_react16.default.createElement(
+  ), enabledFeatures.includes("redo") && /* @__PURE__ */ import_react16.default.createElement(
     ToolbarButton_default,
     {
       icon: import_md6.MdRedo,
@@ -16788,14 +16790,14 @@ Reason: ${issue.message}
       onClick: () => editor.chain().focus().redo().run(),
       disabled: !editor.can().redo()
     }
-  ), /* @__PURE__ */ import_react16.default.createElement(
+  ), enabledFeatures.includes("resetFormatting") && /* @__PURE__ */ import_react16.default.createElement(
     ToolbarButton_default,
     {
       icon: import_md6.MdRefresh,
       label: "Reset Formatting",
       onClick: () => editor.chain().focus().unsetAllMarks().clearNodes().run()
     }
-  ), /* @__PURE__ */ import_react16.default.createElement(
+  ), enabledFeatures.includes("codeBlock") && /* @__PURE__ */ import_react16.default.createElement(
     ToolbarButton_default,
     {
       icon: import_md6.MdCode,
@@ -16803,14 +16805,14 @@ Reason: ${issue.message}
       onClick: () => editor.chain().focus().toggleCodeBlock().run(),
       isActive: editor.isActive("codeBlock")
     }
-  ), /* @__PURE__ */ import_react16.default.createElement(
+  ), enabledFeatures.includes("preview") && /* @__PURE__ */ import_react16.default.createElement(
     ToolbarButton_default,
     {
       icon: import_md6.MdVisibility,
       label: "Preview",
       onClick: handlePreview
     }
-  ), /* @__PURE__ */ import_react16.default.createElement(
+  ), enabledFeatures.includes("spell check") && /* @__PURE__ */ import_react16.default.createElement(
     ToolbarButton_default,
     {
       icon: import_md6.MdSpellcheck,
@@ -16877,7 +16879,7 @@ var import_react18 = __toESM(require("react"));
 var import_fa2 = require("react-icons/fa");
 var import_loaders = require("@uiball/loaders");
 var import_framer_motion = require("framer-motion");
-function AiGroup({ editor }) {
+function AiGroup({ editor, enabledFeatures }) {
   const [isRecording, setIsRecording] = (0, import_react18.useState)(false);
   const [audioBlob, setAudioBlob] = (0, import_react18.useState)(null);
   const [isTranscribing, setIsTranscribing] = (0, import_react18.useState)(false);
@@ -16960,7 +16962,8 @@ function AiGroup({ editor }) {
       setIsLoadingAI(false);
     }
   };
-  return /* @__PURE__ */ import_react18.default.createElement("div", { className: "group relative space-y-3" }, /* @__PURE__ */ import_react18.default.createElement("div", { className: "flex gap-2 items-center" }, !isRecording ? /* @__PURE__ */ import_react18.default.createElement(
+  if (!enabledFeatures.includes("voice to text")) return null;
+  return /* @__PURE__ */ import_react18.default.createElement("div", { className: "group flex flex-col gap-2 items-start" }, /* @__PURE__ */ import_react18.default.createElement("div", { className: "flex gap-2 items-center" }, !isRecording ? /* @__PURE__ */ import_react18.default.createElement(
     "button",
     {
       type: "button",
@@ -17043,20 +17046,15 @@ var MathModal2 = (0, import_dynamic.default)(() => Promise.resolve().then(() =>
 var CodeEditorModal2 = (0, import_dynamic.default)(() => Promise.resolve().then(() => (init_CodeEditorModal(), CodeEditorModal_exports)), {
   ssr: false
 });
-var AddOnGroup = ({ editor }) => {
-  const [isModalOpen, setModalOpen] = (0, import_react22.useState)(false);
+var AddOnGroup = ({ editor, addOns }) => {
+  const [isMathModalOpen, setMathModalOpen] = (0, import_react22.useState)(false);
   const [latexValue, setLatexValue] = (0, import_react22.useState)("");
   const [isCodeModalOpen, setCodeModalOpen] = (0, import_react22.useState)(false);
   if (!editor) return null;
-  const insertCodeBlock = () => {
-    setCodeModalOpen(true);
-  };
+  const insertCodeBlock = () => setCodeModalOpen(true);
   const handleMathInsert = (latex) => {
-    editor.chain().focus().insertContent({
-      type: "mathInline",
-      attrs: { formula: latex }
-    }).run();
-    setModalOpen(false);
+    editor.chain().focus().insertContent({ type: "mathInline", attrs: { formula: latex } }).run();
+    setMathModalOpen(false);
     setLatexValue("");
   };
   const handleSubmitCode = (code) => {
@@ -17082,7 +17080,7 @@ var AddOnGroup = ({ editor }) => {
     }).run();
     setCodeModalOpen(false);
   };
-  return /* @__PURE__ */ import_react22.default.createElement(import_react22.default.Fragment, null, /* @__PURE__ */ import_react22.default.createElement("div", { className: "group flex gap-2 items-center" }, /* @__PURE__ */ import_react22.default.createElement(
+  return /* @__PURE__ */ import_react22.default.createElement(import_react22.default.Fragment, null, /* @__PURE__ */ import_react22.default.createElement("div", { className: "group flex gap-2 items-center" }, addOns.includes("code") && /* @__PURE__ */ import_react22.default.createElement(
     "button",
     {
       type: "button",
@@ -17091,25 +17089,25 @@ var AddOnGroup = ({ editor }) => {
       title: "Open Code Editor"
     },
     /* @__PURE__ */ import_react22.default.createElement(import_lucide_react.MessageSquareCode, { size: 18 })
-  ), /* @__PURE__ */ import_react22.default.createElement(
+  ), addOns.includes("math") && /* @__PURE__ */ import_react22.default.createElement(
     "button",
     {
       type: "button",
-      onClick: () => setModalOpen(true),
+      onClick: () => setMathModalOpen(true),
       className: "addon-btn",
       title: "Insert Math Equation"
     },
     /* @__PURE__ */ import_react22.default.createElement(import_lucide_react.SquareRadical, { size: 18 })
-  )), /* @__PURE__ */ import_react22.default.createElement(
+  )), addOns.includes("math") && /* @__PURE__ */ import_react22.default.createElement(
     MathModal2,
     {
-      isOpen: isModalOpen,
-      onClose: () => setModalOpen(false),
+      isOpen: isMathModalOpen,
+      onClose: () => setMathModalOpen(false),
       onSubmit: handleMathInsert,
       value: latexValue,
       setValue: setLatexValue
     }
-  ), /* @__PURE__ */ import_react22.default.createElement(
+  ), addOns.includes("code") && /* @__PURE__ */ import_react22.default.createElement(
     CodeEditorModal2,
     {
       isOpen: isCodeModalOpen,
@@ -17129,9 +17127,8 @@ function TetronsToolbar({
 }) {
   const [autoSave, setAutoSave] = (0, import_react23.useState)(false);
   (0, import_react23.useEffect)(() => {
-    if (!editor) return;
+    if (!editor || !autoSave) return;
     const handleUpdate = () => {
-      if (!autoSave) return;
       const content = editor.getJSON();
       fetch("/api/save", {
         method: "POST",
@@ -17150,7 +17147,18 @@ function TetronsToolbar({
       case "premium":
         return addOns;
       case "platinum":
-        return ["math", "code"];
+        return [
+          "math",
+          "code",
+          "ai",
+          "voice to text",
+          "undo",
+          "redo",
+          "resetFormatting",
+          "preview",
+          "codeBlock",
+          "spell check"
+        ];
       default:
         return [];
     }
@@ -17163,7 +17171,36 @@ function TetronsToolbar({
       checked: autoSave,
       onChange: (e) => setAutoSave(e.target.checked)
     }
-  ), /* @__PURE__ */ import_react23.default.createElement("label", { htmlFor: "autoSave" }, "Auto Save")), ["pro", "premium", "platinum"].includes(version) && /* @__PURE__ */ import_react23.default.createElement(FileGroup, { editor }), /* @__PURE__ */ import_react23.default.createElement(ClipboardGroup, { editor }), /* @__PURE__ */ import_react23.default.createElement(FontStyleGroup, { editor }), /* @__PURE__ */ import_react23.default.createElement(ListAlignGroup, { editor }), ["premium", "platinum"].includes(version) && /* @__PURE__ */ import_react23.default.createElement(import_react23.default.Fragment, null, /* @__PURE__ */ import_react23.default.createElement(InsertGroup, { editor }), /* @__PURE__ */ import_react23.default.createElement(ActionGroup, { editor })), (["pro", "premium"].includes(version) && effectiveAddOns.includes("spell check") || version === "platinum") && /* @__PURE__ */ import_react23.default.createElement(MiscGroup, { editor }), (version === "premium" && effectiveAddOns.includes("ai") || version === "platinum") && /* @__PURE__ */ import_react23.default.createElement(AiGroup, { editor }), effectiveAddOns.length > 0 && /* @__PURE__ */ import_react23.default.createElement(AddOnGroup_default, { editor }));
+  ), /* @__PURE__ */ import_react23.default.createElement("label", { htmlFor: "autoSave" }, "Auto Save")), ["pro", "premium", "platinum"].includes(version) && /* @__PURE__ */ import_react23.default.createElement(FileGroup, { editor }), /* @__PURE__ */ import_react23.default.createElement(ClipboardGroup, { editor }), /* @__PURE__ */ import_react23.default.createElement(FontStyleGroup, { editor }), /* @__PURE__ */ import_react23.default.createElement(ListAlignGroup, { editor }), ["premium", "platinum"].includes(version) && /* @__PURE__ */ import_react23.default.createElement(import_react23.default.Fragment, null, /* @__PURE__ */ import_react23.default.createElement(InsertGroup, { editor }), /* @__PURE__ */ import_react23.default.createElement(ActionGroup, { editor })), ["pro", "premium", "platinum"].includes(version) && /* @__PURE__ */ import_react23.default.createElement(
+    MiscGroup,
+    {
+      editor,
+      enabledFeatures: effectiveAddOns.filter(
+        (a) => [
+          "undo",
+          "redo",
+          "resetFormatting",
+          "preview",
+          "codeBlock",
+          "spell check"
+        ].includes(a)
+      )
+    }
+  ), effectiveAddOns.some((a) => ["ai", "voice to text"].includes(a)) && /* @__PURE__ */ import_react23.default.createElement(
+    AiGroup,
+    {
+      editor,
+      enabledFeatures: effectiveAddOns.filter(
+        (a) => ["ai", "voice to text"].includes(a)
+      )
+    }
+  ), effectiveAddOns.some((a) => a === "math" || a === "code") && /* @__PURE__ */ import_react23.default.createElement(
+    AddOnGroup_default,
+    {
+      editor,
+      addOns: effectiveAddOns.filter((a) => a === "math" || a === "code")
+    }
+  ));
 }
 // src/components/tetrons/EditorContent.tsx

package/dist/index.mjs CHANGED Viewed

@@ -15986,14 +15986,10 @@ function ActionGroup({ editor }) {
         setDropdownOpen(false);
       }
     };
-    if (dropdownOpen) {
+    if (dropdownOpen)
       document.addEventListener("mousedown", handleClickOutside);
-    } else {
-      document.removeEventListener("mousedown", handleClickOutside);
-    }
-    return () => {
-      document.removeEventListener("mousedown", handleClickOutside);
-    };
+    else document.removeEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
   }, [dropdownOpen]);
   const zoomIn = () => {
     const element = document.querySelector(
@@ -16002,8 +15998,7 @@ function ActionGroup({ editor }) {
     if (element) {
       const style = element.style;
       const currentZoom = parseFloat(style.zoom || "1");
-      const next = Math.min(currentZoom + 0.1, 2);
-      style.zoom = next.toString();
+      style.zoom = Math.min(currentZoom + 0.1, 2).toString();
     }
   };
   const zoomOut = () => {
@@ -16013,28 +16008,24 @@ function ActionGroup({ editor }) {
     if (element) {
       const style = element.style;
       const currentZoom = parseFloat(style.zoom || "1");
-      const next = Math.max(currentZoom - 0.1, 0.5);
-      style.zoom = next.toString();
+      style.zoom = Math.max(currentZoom - 0.1, 0.5).toString();
     }
   };
   const handlePrint = () => {
+    if (!editor) return;
     const html = editor.getHTML();
     const printWindow = window.open("", "_blank");
     if (printWindow) {
-      printWindow.document.write(`
-        <html>
-          <head>
-            <title>Print</title>
-          </head>
-          <body>${html}</body>
-        </html>
-      `);
+      printWindow.document.write(
+        `<html><head><title>Print</title></head><body>${html}</body></html>`
+      );
       printWindow.document.close();
       printWindow.focus();
       printWindow.print();
     }
   };
   const handleSave = async () => {
+    if (!editor) return;
     const content = editor.getJSON();
     try {
       const response = await fetch("/api/save", {
@@ -16044,14 +16035,14 @@ function ActionGroup({ editor }) {
       });
       if (!response.ok) throw new Error("Failed to save file");
       const result = await response.json();
-      console.log(result.message);
-      alert("Content saved successfully!");
+      alert(result.message || "Content saved successfully!");
     } catch (error) {
-      console.error("Error saving content:", error);
+      console.error(error);
       alert("Failed to save content.");
     }
   };
   const handleDownloadPDF = async () => {
+    if (!editor) return;
     const html = editor.getHTML();
     const container = document.createElement("div");
     container.innerHTML = html;
@@ -16059,22 +16050,22 @@ function ActionGroup({ editor }) {
     document.body.appendChild(container);
     try {
       const domToPdf = (await import("dom-to-pdf")).default;
-      const options = {
-        filename: "document.pdf",
-        overrideWidth: 800,
-        overrideHeight: 1120
-      };
-      domToPdf(container, options, () => {
-        console.log("PDF downloaded!");
-      });
+      domToPdf(
+        container,
+        { filename: "document.pdf", overrideWidth: 800, overrideHeight: 1120 },
+        () => {
+          console.log("PDF downloaded!");
+        }
+      );
     } catch (error) {
-      console.error("PDF download failed", error);
+      console.error(error);
       alert("Failed to download PDF.");
     } finally {
       document.body.removeChild(container);
     }
   };
   const handleDownloadHTML = () => {
+    if (!editor) return;
     const html = editor.getHTML();
     const blob = new Blob([html], { type: "text/html" });
     const link = document.createElement("a");
@@ -16085,15 +16076,11 @@ function ActionGroup({ editor }) {
     document.body.removeChild(link);
   };
   const handleDownloadDOCX = async () => {
+    if (!editor) return;
     const { Document: Document2, Packer, Paragraph: Paragraph2 } = await import("docx");
     const text = editor.getText();
     const doc3 = new Document2({
-      sections: [
-        {
-          properties: {},
-          children: [new Paragraph2(text)]
-        }
-      ]
+      sections: [{ properties: {}, children: [new Paragraph2(text)] }]
     });
     const blob = await Packer.toBlob(doc3);
     const link = document.createElement("a");
@@ -16103,49 +16090,59 @@ function ActionGroup({ editor }) {
     link.click();
     document.body.removeChild(link);
   };
-  return /* @__PURE__ */ React5.createElement("div", { className: "action-group", role: "group", "aria-label": "Editor actions" }, /* @__PURE__ */ React5.createElement(ToolbarButton_default, { icon: MdZoomIn, onClick: zoomIn, title: "Zoom In" }), /* @__PURE__ */ React5.createElement(ToolbarButton_default, { icon: MdZoomOut, onClick: zoomOut, title: "Zoom Out" }), /* @__PURE__ */ React5.createElement(ToolbarButton_default, { icon: MdPrint, onClick: handlePrint, title: "Print" }), /* @__PURE__ */ React5.createElement(ToolbarButton_default, { icon: MdSave, onClick: handleSave, title: "Save" }), /* @__PURE__ */ React5.createElement("div", { className: "relative", ref: dropdownRef }, /* @__PURE__ */ React5.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => setDropdownOpen((open) => !open),
-      "aria-haspopup": "menu",
-      "aria-expanded": dropdownOpen ? "true" : "false",
-      className: "export-button",
-      title: "Export"
-    },
-    /* @__PURE__ */ React5.createElement(MdDownload, null),
-    /* @__PURE__ */ React5.createElement("span", { className: "text-sm" })
-  ), dropdownOpen && /* @__PURE__ */ React5.createElement("div", { className: "export-dropdown" }, /* @__PURE__ */ React5.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => {
-        setDropdownOpen(false);
-        handleDownloadPDF();
-      }
-    },
-    "Export as PDF"
-  ), /* @__PURE__ */ React5.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => {
-        setDropdownOpen(false);
-        handleDownloadHTML();
-      }
-    },
-    "Export as HTML"
-  ), /* @__PURE__ */ React5.createElement(
-    "button",
+  if (!editor) return null;
+  return /* @__PURE__ */ React5.createElement(
+    "div",
     {
-      type: "button",
-      onClick: () => {
-        setDropdownOpen(false);
-        handleDownloadDOCX();
-      }
+      className: "action-group bg-white text-black dark:bg-gray-800 dark:text-white",
+      role: "group",
+      "aria-label": "Editor actions"
     },
-    "Export as DOCX"
-  ))));
+    /* @__PURE__ */ React5.createElement(ToolbarButton_default, { icon: MdZoomIn, onClick: zoomIn, title: "Zoom In" }),
+    /* @__PURE__ */ React5.createElement(ToolbarButton_default, { icon: MdZoomOut, onClick: zoomOut, title: "Zoom Out" }),
+    /* @__PURE__ */ React5.createElement(ToolbarButton_default, { icon: MdPrint, onClick: handlePrint, title: "Print" }),
+    /* @__PURE__ */ React5.createElement(ToolbarButton_default, { icon: MdSave, onClick: handleSave, title: "Save" }),
+    /* @__PURE__ */ React5.createElement("div", { className: "relative", ref: dropdownRef }, /* @__PURE__ */ React5.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => setDropdownOpen((o) => !o),
+        className: "export-button",
+        title: "Export"
+      },
+      /* @__PURE__ */ React5.createElement(MdDownload, null)
+    ), dropdownOpen && /* @__PURE__ */ React5.createElement("div", { className: "export-dropdown" }, /* @__PURE__ */ React5.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          setDropdownOpen(false);
+          handleDownloadPDF();
+        }
+      },
+      "Export as PDF"
+    ), /* @__PURE__ */ React5.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          setDropdownOpen(false);
+          handleDownloadHTML();
+        }
+      },
+      "Export as HTML"
+    ), /* @__PURE__ */ React5.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          setDropdownOpen(false);
+          handleDownloadDOCX();
+        }
+      },
+      "Export as DOCX"
+    )))
+  );
 }
 // src/components/tetrons/toolbar/ClipboardGroup.tsx
@@ -16640,13 +16637,18 @@ import {
   MdFormatAlignJustify
 } from "react-icons/md";
 function ListAlignGroup({ editor }) {
-  return /* @__PURE__ */ React9.createElement("div", { className: "list-align-group" }, /* @__PURE__ */ React9.createElement(
+  if (!editor) return null;
+  const canToggleBullet = editor.can().toggleBulletList() || editor.isEmpty;
+  const canToggleOrdered = editor.can().toggleOrderedList() || editor.isEmpty;
+  const canSink = editor.can().sinkListItem("listItem");
+  const canLift = editor.can().liftListItem("listItem");
+  return /* @__PURE__ */ React9.createElement("div", { className: "list-align-group bg-white text-black dark:bg-gray-800 dark:text-white" }, /* @__PURE__ */ React9.createElement(
     ToolbarButton_default,
     {
       icon: MdFormatListBulleted,
       title: "Bulleted List",
       onClick: () => editor.chain().focus().toggleBulletList().run(),
-      disabled: !editor.can().toggleBulletList()
+      disabled: !canToggleBullet
     }
   ), /* @__PURE__ */ React9.createElement(
     ToolbarButton_default,
@@ -16654,7 +16656,7 @@ function ListAlignGroup({ editor }) {
       icon: MdFormatListNumbered,
       title: "Numbered List",
       onClick: () => editor.chain().focus().toggleOrderedList().run(),
-      disabled: !editor.can().toggleOrderedList()
+      disabled: !canToggleOrdered
     }
   ), /* @__PURE__ */ React9.createElement(
     ToolbarButton_default,
@@ -16662,7 +16664,7 @@ function ListAlignGroup({ editor }) {
       icon: MdFormatIndentIncrease,
       title: "Increase Indent",
       onClick: () => editor.chain().focus().sinkListItem("listItem").run(),
-      disabled: !editor.can().sinkListItem("listItem")
+      disabled: !canSink
     }
   ), /* @__PURE__ */ React9.createElement(
     ToolbarButton_default,
@@ -16670,7 +16672,7 @@ function ListAlignGroup({ editor }) {
       icon: MdFormatIndentDecrease,
       title: "Decrease Indent",
       onClick: () => editor.chain().focus().liftListItem("listItem").run(),
-      disabled: !editor.can().liftListItem("listItem")
+      disabled: !canLift
     }
   ), /* @__PURE__ */ React9.createElement(
     ToolbarButton_default,
@@ -16738,26 +16740,7 @@ async function checkGrammar(text) {
 }
 // src/components/tetrons/toolbar/MiscGroup.tsx
-function MiscGroup({ editor }) {
-  const handlePreview = () => {
-    const html = editor.getHTML();
-    const previewWindow = window.open("", "_blank");
-    if (previewWindow) {
-      previewWindow.document.open();
-      previewWindow.document.write(`
-        <html>
-          <head>
-            <title>Preview</title>
-            <style>
-              body { font-family: sans-serif; padding: 2rem; line-height: 1.6; }
-            </style>
-          </head>
-          <body>${html}</body>
-        </html>
-      `);
-      previewWindow.document.close();
-    }
-  };
+function MiscGroup({ editor, enabledFeatures }) {
   const handleGrammarCheck = async () => {
     const text = editor.getText();
     try {
@@ -16781,7 +16764,26 @@ Reason: ${issue.message}
       alert("\u274C Failed to check grammar. Please try again later.");
     }
   };
-  return /* @__PURE__ */ React10.createElement("div", { className: "misc-group" }, /* @__PURE__ */ React10.createElement(
+  const handlePreview = () => {
+    const html = editor.getHTML();
+    const previewWindow = window.open("", "_blank");
+    if (previewWindow) {
+      previewWindow.document.open();
+      previewWindow.document.write(`
+        <html>
+          <head>
+            <title>Preview</title>
+            <style>
+              body { font-family: sans-serif; padding: 2rem; line-height: 1.6; }
+            </style>
+          </head>
+          <body>${html}</body>
+        </html>
+      `);
+      previewWindow.document.close();
+    }
+  };
+  return /* @__PURE__ */ React10.createElement("div", { className: "misc-group" }, enabledFeatures.includes("undo") && /* @__PURE__ */ React10.createElement(
     ToolbarButton_default,
     {
       icon: MdUndo,
@@ -16789,7 +16791,7 @@ Reason: ${issue.message}
       onClick: () => editor.chain().focus().undo().run(),
       disabled: !editor.can().undo()
     }
-  ), /* @__PURE__ */ React10.createElement(
+  ), enabledFeatures.includes("redo") && /* @__PURE__ */ React10.createElement(
     ToolbarButton_default,
     {
       icon: MdRedo,
@@ -16797,14 +16799,14 @@ Reason: ${issue.message}
       onClick: () => editor.chain().focus().redo().run(),
       disabled: !editor.can().redo()
     }
-  ), /* @__PURE__ */ React10.createElement(
+  ), enabledFeatures.includes("resetFormatting") && /* @__PURE__ */ React10.createElement(
     ToolbarButton_default,
     {
       icon: MdRefresh,
       label: "Reset Formatting",
       onClick: () => editor.chain().focus().unsetAllMarks().clearNodes().run()
     }
-  ), /* @__PURE__ */ React10.createElement(
+  ), enabledFeatures.includes("codeBlock") && /* @__PURE__ */ React10.createElement(
     ToolbarButton_default,
     {
       icon: MdCode,
@@ -16812,14 +16814,14 @@ Reason: ${issue.message}
       onClick: () => editor.chain().focus().toggleCodeBlock().run(),
       isActive: editor.isActive("codeBlock")
     }
-  ), /* @__PURE__ */ React10.createElement(
+  ), enabledFeatures.includes("preview") && /* @__PURE__ */ React10.createElement(
     ToolbarButton_default,
     {
       icon: MdVisibility,
       label: "Preview",
       onClick: handlePreview
     }
-  ), /* @__PURE__ */ React10.createElement(
+  ), enabledFeatures.includes("spell check") && /* @__PURE__ */ React10.createElement(
     ToolbarButton_default,
     {
       icon: MdSpellcheck,
@@ -16886,7 +16888,7 @@ import React12, { useState as useState7, useRef as useRef6 } from "react";
 import { FaMicrophone, FaStop } from "react-icons/fa";
 import { Waveform } from "@uiball/loaders";
 import { motion, AnimatePresence } from "framer-motion";
-function AiGroup({ editor }) {
+function AiGroup({ editor, enabledFeatures }) {
   const [isRecording, setIsRecording] = useState7(false);
   const [audioBlob, setAudioBlob] = useState7(null);
   const [isTranscribing, setIsTranscribing] = useState7(false);
@@ -16969,7 +16971,8 @@ function AiGroup({ editor }) {
       setIsLoadingAI(false);
     }
   };
-  return /* @__PURE__ */ React12.createElement("div", { className: "group relative space-y-3" }, /* @__PURE__ */ React12.createElement("div", { className: "flex gap-2 items-center" }, !isRecording ? /* @__PURE__ */ React12.createElement(
+  if (!enabledFeatures.includes("voice to text")) return null;
+  return /* @__PURE__ */ React12.createElement("div", { className: "group flex flex-col gap-2 items-start" }, /* @__PURE__ */ React12.createElement("div", { className: "flex gap-2 items-center" }, !isRecording ? /* @__PURE__ */ React12.createElement(
     "button",
     {
       type: "button",
@@ -17052,20 +17055,15 @@ var MathModal2 = dynamic(() => Promise.resolve().then(() => (init_MathModal(), M
 var CodeEditorModal2 = dynamic(() => Promise.resolve().then(() => (init_CodeEditorModal(), CodeEditorModal_exports)), {
   ssr: false
 });
-var AddOnGroup = ({ editor }) => {
-  const [isModalOpen, setModalOpen] = useState9(false);
+var AddOnGroup = ({ editor, addOns }) => {
+  const [isMathModalOpen, setMathModalOpen] = useState9(false);
   const [latexValue, setLatexValue] = useState9("");
   const [isCodeModalOpen, setCodeModalOpen] = useState9(false);
   if (!editor) return null;
-  const insertCodeBlock = () => {
-    setCodeModalOpen(true);
-  };
+  const insertCodeBlock = () => setCodeModalOpen(true);
   const handleMathInsert = (latex) => {
-    editor.chain().focus().insertContent({
-      type: "mathInline",
-      attrs: { formula: latex }
-    }).run();
-    setModalOpen(false);
+    editor.chain().focus().insertContent({ type: "mathInline", attrs: { formula: latex } }).run();
+    setMathModalOpen(false);
     setLatexValue("");
   };
   const handleSubmitCode = (code) => {
@@ -17091,7 +17089,7 @@ var AddOnGroup = ({ editor }) => {
     }).run();
     setCodeModalOpen(false);
   };
-  return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "group flex gap-2 items-center" }, /* @__PURE__ */ React15.createElement(
+  return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "group flex gap-2 items-center" }, addOns.includes("code") && /* @__PURE__ */ React15.createElement(
     "button",
     {
       type: "button",
@@ -17100,25 +17098,25 @@ var AddOnGroup = ({ editor }) => {
       title: "Open Code Editor"
     },
     /* @__PURE__ */ React15.createElement(MessageSquareCode, { size: 18 })
-  ), /* @__PURE__ */ React15.createElement(
+  ), addOns.includes("math") && /* @__PURE__ */ React15.createElement(
     "button",
     {
       type: "button",
-      onClick: () => setModalOpen(true),
+      onClick: () => setMathModalOpen(true),
       className: "addon-btn",
       title: "Insert Math Equation"
     },
     /* @__PURE__ */ React15.createElement(SquareRadical, { size: 18 })
-  )), /* @__PURE__ */ React15.createElement(
+  )), addOns.includes("math") && /* @__PURE__ */ React15.createElement(
     MathModal2,
     {
-      isOpen: isModalOpen,
-      onClose: () => setModalOpen(false),
+      isOpen: isMathModalOpen,
+      onClose: () => setMathModalOpen(false),
       onSubmit: handleMathInsert,
       value: latexValue,
       setValue: setLatexValue
     }
-  ), /* @__PURE__ */ React15.createElement(
+  ), addOns.includes("code") && /* @__PURE__ */ React15.createElement(
     CodeEditorModal2,
     {
       isOpen: isCodeModalOpen,
@@ -17138,9 +17136,8 @@ function TetronsToolbar({
 }) {
   const [autoSave, setAutoSave] = useState10(false);
   useEffect8(() => {
-    if (!editor) return;
+    if (!editor || !autoSave) return;
     const handleUpdate = () => {
-      if (!autoSave) return;
       const content = editor.getJSON();
       fetch("/api/save", {
         method: "POST",
@@ -17159,7 +17156,18 @@ function TetronsToolbar({
       case "premium":
         return addOns;
       case "platinum":
-        return ["math", "code"];
+        return [
+          "math",
+          "code",
+          "ai",
+          "voice to text",
+          "undo",
+          "redo",
+          "resetFormatting",
+          "preview",
+          "codeBlock",
+          "spell check"
+        ];
       default:
         return [];
     }
@@ -17172,7 +17180,36 @@ function TetronsToolbar({
       checked: autoSave,
       onChange: (e) => setAutoSave(e.target.checked)
     }
-  ), /* @__PURE__ */ React16.createElement("label", { htmlFor: "autoSave" }, "Auto Save")), ["pro", "premium", "platinum"].includes(version) && /* @__PURE__ */ React16.createElement(FileGroup, { editor }), /* @__PURE__ */ React16.createElement(ClipboardGroup, { editor }), /* @__PURE__ */ React16.createElement(FontStyleGroup, { editor }), /* @__PURE__ */ React16.createElement(ListAlignGroup, { editor }), ["premium", "platinum"].includes(version) && /* @__PURE__ */ React16.createElement(React16.Fragment, null, /* @__PURE__ */ React16.createElement(InsertGroup, { editor }), /* @__PURE__ */ React16.createElement(ActionGroup, { editor })), (["pro", "premium"].includes(version) && effectiveAddOns.includes("spell check") || version === "platinum") && /* @__PURE__ */ React16.createElement(MiscGroup, { editor }), (version === "premium" && effectiveAddOns.includes("ai") || version === "platinum") && /* @__PURE__ */ React16.createElement(AiGroup, { editor }), effectiveAddOns.length > 0 && /* @__PURE__ */ React16.createElement(AddOnGroup_default, { editor }));
+  ), /* @__PURE__ */ React16.createElement("label", { htmlFor: "autoSave" }, "Auto Save")), ["pro", "premium", "platinum"].includes(version) && /* @__PURE__ */ React16.createElement(FileGroup, { editor }), /* @__PURE__ */ React16.createElement(ClipboardGroup, { editor }), /* @__PURE__ */ React16.createElement(FontStyleGroup, { editor }), /* @__PURE__ */ React16.createElement(ListAlignGroup, { editor }), ["premium", "platinum"].includes(version) && /* @__PURE__ */ React16.createElement(React16.Fragment, null, /* @__PURE__ */ React16.createElement(InsertGroup, { editor }), /* @__PURE__ */ React16.createElement(ActionGroup, { editor })), ["pro", "premium", "platinum"].includes(version) && /* @__PURE__ */ React16.createElement(
+    MiscGroup,
+    {
+      editor,
+      enabledFeatures: effectiveAddOns.filter(
+        (a) => [
+          "undo",
+          "redo",
+          "resetFormatting",
+          "preview",
+          "codeBlock",
+          "spell check"
+        ].includes(a)
+      )
+    }
+  ), effectiveAddOns.some((a) => ["ai", "voice to text"].includes(a)) && /* @__PURE__ */ React16.createElement(
+    AiGroup,
+    {
+      editor,
+      enabledFeatures: effectiveAddOns.filter(
+        (a) => ["ai", "voice to text"].includes(a)
+      )
+    }
+  ), effectiveAddOns.some((a) => a === "math" || a === "code") && /* @__PURE__ */ React16.createElement(
+    AddOnGroup_default,
+    {
+      editor,
+      addOns: effectiveAddOns.filter((a) => a === "math" || a === "code")
+    }
+  ));
 }
 // src/components/tetrons/EditorContent.tsx

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "tetrons",
-  "version": "2.3.90",
+  "version": "2.3.92",
   "description": "A Next.js project written in TypeScript",
   "main": "dist/index.js",
   "module": "dist/index.mjs",