ct-rich-text-editor 1.3.12 → 1.3.13

package/dist/{index-78acd11a.js → index-38cb7602.js}

@@ -202,7 +202,7 @@ const EditorTheme = "";
 const PlaygroundEditorTheme = "";
 const AIChatPlugin$1 = "";
 const backendInstance = axios.create({
-  baseURL: "https://api.cteditor.com/",
+  baseURL: "http://localhost:3000/",
   headers: {
     "Content-Type": "application/json"
   }
@@ -1479,7 +1479,7 @@ const AiTextTransform = async ({ content, apiKey }) => {
 const AI_ACTION_COMMAND = createCommand(
   "AI_ACTION_COMMAND"
 );
-const ImageView = React__default.lazy(() => import("./index-7be32483.js"));
+const ImageView = React__default.lazy(() => import("./index-26434d4e.js"));
 function isGoogleDocCheckboxImg(img) {
   return img.parentElement != null && img.parentElement.tagName === "LI" && img.previousSibling === null && img.getAttribute("aria-roledescription") === "checkbox";
 }
@@ -15272,7 +15272,7 @@ const EmbedComponent = ({ url, displayType, alignment, nodeKey }) => {
     }
   );
 };
-const FileComponent = React$1.lazy(() => import("./index-c2f3d30e.js"));
+const FileComponent = React$1.lazy(() => import("./index-fa2d3309.js"));
 function convertFileElement(domNode) {
   if (domNode instanceof HTMLDivElement) {
     const dataUrl = domNode.getAttribute("data-lexical-file-src");
@@ -17827,7 +17827,7 @@ function ChartComponent({
     setIsLoading(true);
     const toastId = toast.loading("Updating chart...");
     try {
-      const backendUrl = "https://api.cteditor.com/".replace(/\/$/, "");
+      const backendUrl = "http://localhost:3000/".replace(/\/$/, "");
       const apiKey = localStorage.getItem("apiKey") || "";
       const response = await fetch(`${backendUrl}/api/chat/regenerate`, {
         method: "POST",
@@ -18567,188 +18567,6 @@ const formatMenuItems = [
   }
 ];
 const LOWEST_PRIORITY = 1;
-class FeatureSuggestionAPI {
-  static async createSuggestion(data, apiKey) {
-    const response = await backendAPI.post(
-      "/api/feature-suggestions",
-      data,
-      apiKey ? { headers: { "X-API-Key": apiKey } } : void 0
-    );
-    return response.data;
-  }
-}
-function FeatureSuggestionDialog({
-  open,
-  onOpenChange
-}) {
-  const { apiKey } = useEditor();
-  const [title, setTitle] = useState$1("");
-  const [description, setDescription] = useState$1("");
-  const [link, setLink] = useState$1("");
-  const [isSubmitting, setIsSubmitting] = useState$1(false);
-  const [errors, setErrors] = useState$1({});
-  const validateForm = () => {
-    const newErrors = {};
-    if (!title.trim()) {
-      newErrors.title = "Title is required";
-    }
-    if (!description.trim()) {
-      newErrors.description = "Description is required";
-    } else if (description.trim().length < 10) {
-      newErrors.description = "Description must be at least 10 characters";
-    }
-    if (link.trim()) {
-      try {
-        new URL(link.trim());
-      } catch {
-        newErrors.link = "Please enter a valid URL";
-      }
-    }
-    setErrors(newErrors);
-    return Object.keys(newErrors).length === 0;
-  };
-  const handleSubmit = async (e) => {
-    e.preventDefault();
-    if (!validateForm()) {
-      return;
-    }
-    setIsSubmitting(true);
-    try {
-      await FeatureSuggestionAPI.createSuggestion(
-        {
-          title: title.trim(),
-          description: description.trim(),
-          link: link.trim() || null
-        },
-        apiKey || void 0
-      );
-      toast.success("Success!", {
-        description: "Your feature suggestion has been submitted successfully!"
-      });
-      setTitle("");
-      setDescription("");
-      setLink("");
-      setErrors({});
-      onOpenChange(false);
-    } catch (error) {
-      console.error("Error submitting suggestion:", error);
-      toast.error("Error", {
-        description: "Failed to submit feature suggestion. Please try again."
-      });
-    } finally {
-      setIsSubmitting(false);
-    }
-  };
-  const handleCancel = () => {
-    setTitle("");
-    setDescription("");
-    setLink("");
-    setErrors({});
-    onOpenChange(false);
-  };
-  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[500px]", children: [
-    /* @__PURE__ */ jsxs(DialogHeader, { children: [
-      /* @__PURE__ */ jsxs(DialogTitle, { className: "cteditor-flex cteditor-items-center cteditor-gap-2", children: [
-        /* @__PURE__ */ jsx(Lightbulb, { className: "cteditor-h-5 cteditor-w-5 cteditor-text-primary" }),
-        "Suggest a Feature"
-      ] }),
-      /* @__PURE__ */ jsx(DialogDescription, { children: "Help us improve by suggesting new features you'd like to see" })
-    ] }),
-    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, children: [
-      /* @__PURE__ */ jsxs("div", { className: "cteditor-grid cteditor-gap-4 cteditor-py-4", children: [
-        /* @__PURE__ */ jsxs("div", { className: "cteditor-grid cteditor-gap-2", children: [
-          /* @__PURE__ */ jsx(Label$2, { htmlFor: "title", children: "Feature Name *" }),
-          /* @__PURE__ */ jsx(
-            Input$1,
-            {
-              id: "title",
-              placeholder: "Enter a title for your feature suggestion",
-              value: title,
-              onChange: (e) => {
-                setTitle(e.target.value);
-                if (errors.title) {
-                  setErrors({ ...errors, title: void 0 });
-                }
-              },
-              className: errors.title ? "cteditor-border-red-500 focus-visible:cteditor-ring-red-500" : ""
-            }
-          ),
-          errors.title && /* @__PURE__ */ jsx("p", { className: "cteditor-text-sm cteditor-text-red-500", children: errors.title })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "cteditor-grid cteditor-gap-2", children: [
-          /* @__PURE__ */ jsx(Label$2, { htmlFor: "description", children: "Description *" }),
-          /* @__PURE__ */ jsx(
-            "textarea",
-            {
-              id: "description",
-              placeholder: "Describe your feature suggestion in detail. What problem would it solve? How would it work?",
-              value: description,
-              onChange: (e) => {
-                setDescription(e.target.value);
-                if (errors.description) {
-                  setErrors({ ...errors, description: void 0 });
-                }
-              },
-              className: `cteditor-flex cteditor-min-h-[120px] cteditor-w-full cteditor-rounded-md cteditor-border cteditor-border-input cteditor-bg-transparent cteditor-px-3 cteditor-py-2 cteditor-text-base cteditor-shadow-sm placeholder:cteditor-text-muted-foreground focus-visible:cteditor-outline-none focus-visible:cteditor-ring-1 focus-visible:cteditor-ring-ring disabled:cteditor-cursor-not-allowed disabled:cteditor-opacity-50 ${errors.description ? "cteditor-border-red-500 focus-visible:cteditor-ring-red-500" : ""}`
-            }
-          ),
-          errors.description && /* @__PURE__ */ jsx("p", { className: "cteditor-text-sm cteditor-text-red-500", children: errors.description })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "cteditor-grid cteditor-gap-2", children: [
-          /* @__PURE__ */ jsx(Label$2, { htmlFor: "link", children: "Related Link (Optional)" }),
-          /* @__PURE__ */ jsx(
-            Input$1,
-            {
-              id: "link",
-              type: "text",
-              placeholder: "https://example.com",
-              value: link,
-              onChange: (e) => {
-                setLink(e.target.value);
-                if (errors.link) {
-                  setErrors({ ...errors, link: void 0 });
-                }
-              },
-              onPaste: (e) => {
-                e.stopPropagation();
-              },
-              className: errors.link ? "cteditor-border-red-500 focus-visible:cteditor-ring-red-500" : ""
-            }
-          ),
-          errors.link && /* @__PURE__ */ jsx("p", { className: "cteditor-text-sm cteditor-text-red-500", children: errors.link })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "cteditor-p-3 cteditor-bg-muted/50 cteditor-rounded-lg", children: [
-          /* @__PURE__ */ jsxs("div", { className: "cteditor-flex cteditor-items-center cteditor-gap-1 cteditor-mb-2", children: [
-            /* @__PURE__ */ jsx(Lightbulb, { className: "cteditor-h-4 cteditor-w-4" }),
-            /* @__PURE__ */ jsx("h3", { className: "cteditor-text-sm cteditor-font-medium", children: "Tips for a great suggestion:" })
-          ] }),
-          /* @__PURE__ */ jsxs("ul", { className: "cteditor-text-xs cteditor-text-muted-foreground cteditor-space-y-1", children: [
-            /* @__PURE__ */ jsx("li", { children: "• Be specific about what you want and why it would be useful" }),
-            /* @__PURE__ */ jsx("li", { children: "• Explain the problem your suggestion would solve" }),
-            /* @__PURE__ */ jsx("li", { children: "• Consider how other users might benefit from this feature" }),
-            /* @__PURE__ */ jsx("li", { children: "• Include any relevant examples or use cases" })
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs(DialogFooter, { children: [
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            type: "button",
-            variant: "outline",
-            onClick: handleCancel,
-            disabled: isSubmitting,
-            children: "Cancel"
-          }
-        ),
-        /* @__PURE__ */ jsx(Button, { type: "submit", disabled: isSubmitting, children: isSubmitting ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(Loader2, { className: "cteditor-h-4 cteditor-w-4 cteditor-animate-spin cteditor-mr-2" }),
-          "Submitting..."
-        ] }) : "Submit Suggestion" })
-      ] })
-    ] })
-  ] }) });
-}
 const DEFAULT_FONT_SIZE = 15;
 const INITIAL_TOOLBAR_STATE = {
   bgColor: "#fff",
@@ -19612,6 +19430,8 @@ function TableOptionPlugin() {
       } else {
         $insertNodeToNearestRoot(tableNode);
       }
+      const exitParagraph = $createParagraphNode();
+      tableNode.insertAfter(exitParagraph);
       if ($isTableRowNode(headerRow)) {
         const cells = headerRow.getChildren();
         if (cells.length > 0 && $isTableCellNode(cells[0])) {
@@ -20157,10 +19977,10 @@ const PDF_CONFIG = {
 };
 const loadHtml2Pdf = async () => {
   try {
-    const mod = await import("./html2pdf.bundle.min-9fbba084.js").then((n) => n.h);
+    const mod = await import("./html2pdf.bundle.min-277f1c42.js").then((n) => n.h);
     return (mod == null ? void 0 : mod.default) || mod;
   } catch {
-    const mod2 = await import("./html2pdf.bundle-83da4814.js").then((n) => n.h);
+    const mod2 = await import("./html2pdf.bundle-f58b88f5.js").then((n) => n.h);
     return (mod2 == null ? void 0 : mod2.default) || mod2;
   }
 };
@@ -22348,6 +22168,86 @@ const BlockFormatMenu = ({ blockType }) => {
     }
   ) });
 };
+const CHART_TYPES = [
+  { value: "bar", label: "Bar Chart", icon: "📊", description: "Vertical bars for comparing values" },
+  { value: "horizontal-bar", label: "Horizontal Bar", icon: "📈", description: "Horizontal bars for categories" },
+  { value: "line", label: "Line Chart", icon: "📉", description: "Connected points showing trends" },
+  { value: "pie", label: "Pie Chart", icon: "🥧", description: "Circular chart for proportions" },
+  { value: "donut", label: "Donut Chart", icon: "🍩", description: "Hollow circle showing proportions" }
+];
+const DEFAULT_COLORS = [
+  "#4285f4",
+  // Blue
+  "#ea4335",
+  // Red
+  "#fbbc04",
+  // Yellow
+  "#34a853",
+  // Green
+  "#ff6d01"
+  // Orange
+];
+function ChartInsertDialog({
+  open,
+  onOpenChange,
+  onInsert
+}) {
+  const [selectedType, setSelectedType] = useState$1("bar");
+  const handleInsert = () => {
+    const dummyMetadata = {
+      type: selectedType,
+      values: [10, 20, 15, 25, 30],
+      labels: ["Item 1", "Item 2", "Item 3", "Item 4", "Item 5"],
+      title: "Sample Chart",
+      colors: DEFAULT_COLORS
+    };
+    onInsert(dummyMetadata);
+    onOpenChange(false);
+  };
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[500px]", children: [
+    /* @__PURE__ */ jsxs(DialogHeader, { children: [
+      /* @__PURE__ */ jsxs(DialogTitle, { className: "cteditor-flex cteditor-items-center cteditor-gap-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "cteditor-text-2xl", children: "📊" }),
+        "Insert Chart"
+      ] }),
+      /* @__PURE__ */ jsx(DialogDescription, { children: "Select a chart type to insert into your document. You can customize it after insertion." })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "cteditor-space-y-4 ", children: [
+      /* @__PURE__ */ jsx(Label$2, { className: "cteditor-text-sm cteditor-font-medium", children: "Chart Type" }),
+      /* @__PURE__ */ jsx("div", { className: "cteditor-grid cteditor-gap-3", children: CHART_TYPES.map((type) => /* @__PURE__ */ jsxs(
+        "button",
+        {
+          onClick: () => setSelectedType(type.value),
+          className: `cteditor-flex cteditor-items-start cteditor-gap-3 cteditor-p-4 cteditor-rounded-lg cteditor-border-2 cteditor-transition-all cteditor-text-left ${selectedType === type.value ? "cteditor-border-primary cteditor-bg-primary/5" : "cteditor-border-gray-200 dark:cteditor-border-gray-700 hover:cteditor-border-gray-300 dark:hover:cteditor-border-gray-600"}`,
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "cteditor-text-2xl", children: type.icon }),
+            /* @__PURE__ */ jsxs("div", { className: "cteditor-flex-1", children: [
+              /* @__PURE__ */ jsx("div", { className: "cteditor-font-medium cteditor-text-sm", children: type.label }),
+              /* @__PURE__ */ jsx("div", { className: "cteditor-text-xs cteditor-text-gray-600 dark:cteditor-text-gray-400 cteditor-mt-1", children: type.description })
+            ] }),
+            selectedType === type.value && /* @__PURE__ */ jsx("div", { className: "cteditor-flex cteditor-items-center cteditor-justify-center cteditor-w-5 cteditor-h-5 cteditor-rounded-full cteditor-bg-primary cteditor-text-primary-foreground", children: /* @__PURE__ */ jsx("svg", { className: "cteditor-w-3 cteditor-h-3", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z", clipRule: "evenodd" }) }) })
+          ]
+        },
+        type.value
+      )) }),
+      /* @__PURE__ */ jsx("div", { className: "cteditor-p-3 cteditor-rounded-md cteditor-bg-blue-50 dark:cteditor-bg-blue-950/20 cteditor-border cteditor-border-blue-200 dark:cteditor-border-blue-800", children: /* @__PURE__ */ jsxs("div", { className: "cteditor-flex cteditor-items-start cteditor-gap-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "cteditor-text-blue-600 dark:cteditor-text-blue-400", children: "ℹ️" }),
+        /* @__PURE__ */ jsx("p", { className: "cteditor-text-xs cteditor-text-blue-700 dark:cteditor-text-blue-300", children: 'A sample chart with dummy data will be inserted. You can edit the chart by hovering over it and clicking the "Edit Chart" button.' })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsxs(DialogFooter, { className: "cteditor-gap-2", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          onClick: () => onOpenChange(false),
+          children: "Cancel"
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { onClick: handleInsert, children: "Insert Chart" })
+    ] })
+  ] }) });
+}
 const ColorPicker$3 = "";
 function u() {
   return (u = Object.assign || function(e) {
@@ -23125,6 +23025,188 @@ const EmojiPickerWidget = forwardRef(
   }
 );
 EmojiPickerWidget.displayName = "EmojiPickerWidget";
+class FeatureSuggestionAPI {
+  static async createSuggestion(data, apiKey) {
+    const response = await backendAPI.post(
+      "/api/feature-suggestions",
+      data,
+      apiKey ? { headers: { "X-API-Key": apiKey } } : void 0
+    );
+    return response.data;
+  }
+}
+function FeatureSuggestionDialog({
+  open,
+  onOpenChange
+}) {
+  const { apiKey } = useEditor();
+  const [title, setTitle] = useState$1("");
+  const [description, setDescription] = useState$1("");
+  const [link, setLink] = useState$1("");
+  const [isSubmitting, setIsSubmitting] = useState$1(false);
+  const [errors, setErrors] = useState$1({});
+  const validateForm = () => {
+    const newErrors = {};
+    if (!title.trim()) {
+      newErrors.title = "Title is required";
+    }
+    if (!description.trim()) {
+      newErrors.description = "Description is required";
+    } else if (description.trim().length < 10) {
+      newErrors.description = "Description must be at least 10 characters";
+    }
+    if (link.trim()) {
+      try {
+        new URL(link.trim());
+      } catch {
+        newErrors.link = "Please enter a valid URL";
+      }
+    }
+    setErrors(newErrors);
+    return Object.keys(newErrors).length === 0;
+  };
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    if (!validateForm()) {
+      return;
+    }
+    setIsSubmitting(true);
+    try {
+      await FeatureSuggestionAPI.createSuggestion(
+        {
+          title: title.trim(),
+          description: description.trim(),
+          link: link.trim() || null
+        },
+        apiKey || void 0
+      );
+      toast.success("Success!", {
+        description: "Your feature suggestion has been submitted successfully!"
+      });
+      setTitle("");
+      setDescription("");
+      setLink("");
+      setErrors({});
+      onOpenChange(false);
+    } catch (error) {
+      console.error("Error submitting suggestion:", error);
+      toast.error("Error", {
+        description: "Failed to submit feature suggestion. Please try again."
+      });
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+  const handleCancel = () => {
+    setTitle("");
+    setDescription("");
+    setLink("");
+    setErrors({});
+    onOpenChange(false);
+  };
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[500px]", children: [
+    /* @__PURE__ */ jsxs(DialogHeader, { children: [
+      /* @__PURE__ */ jsxs(DialogTitle, { className: "cteditor-flex cteditor-items-center cteditor-gap-2", children: [
+        /* @__PURE__ */ jsx(Lightbulb, { className: "cteditor-h-5 cteditor-w-5 cteditor-text-primary" }),
+        "Suggest a Feature"
+      ] }),
+      /* @__PURE__ */ jsx(DialogDescription, { children: "Help us improve by suggesting new features you'd like to see" })
+    ] }),
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, children: [
+      /* @__PURE__ */ jsxs("div", { className: "cteditor-grid cteditor-gap-4 cteditor-py-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "cteditor-grid cteditor-gap-2", children: [
+          /* @__PURE__ */ jsx(Label$2, { htmlFor: "title", children: "Feature Name *" }),
+          /* @__PURE__ */ jsx(
+            Input$1,
+            {
+              id: "title",
+              placeholder: "Enter a title for your feature suggestion",
+              value: title,
+              onChange: (e) => {
+                setTitle(e.target.value);
+                if (errors.title) {
+                  setErrors({ ...errors, title: void 0 });
+                }
+              },
+              className: errors.title ? "cteditor-border-red-500 focus-visible:cteditor-ring-red-500" : ""
+            }
+          ),
+          errors.title && /* @__PURE__ */ jsx("p", { className: "cteditor-text-sm cteditor-text-red-500", children: errors.title })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "cteditor-grid cteditor-gap-2", children: [
+          /* @__PURE__ */ jsx(Label$2, { htmlFor: "description", children: "Description *" }),
+          /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              id: "description",
+              placeholder: "Describe your feature suggestion in detail. What problem would it solve? How would it work?",
+              value: description,
+              onChange: (e) => {
+                setDescription(e.target.value);
+                if (errors.description) {
+                  setErrors({ ...errors, description: void 0 });
+                }
+              },
+              className: `cteditor-flex cteditor-min-h-[120px] cteditor-w-full cteditor-rounded-md cteditor-border cteditor-border-input cteditor-bg-transparent cteditor-px-3 cteditor-py-2 cteditor-text-base cteditor-shadow-sm placeholder:cteditor-text-muted-foreground focus-visible:cteditor-outline-none focus-visible:cteditor-ring-1 focus-visible:cteditor-ring-ring disabled:cteditor-cursor-not-allowed disabled:cteditor-opacity-50 ${errors.description ? "cteditor-border-red-500 focus-visible:cteditor-ring-red-500" : ""}`
+            }
+          ),
+          errors.description && /* @__PURE__ */ jsx("p", { className: "cteditor-text-sm cteditor-text-red-500", children: errors.description })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "cteditor-grid cteditor-gap-2", children: [
+          /* @__PURE__ */ jsx(Label$2, { htmlFor: "link", children: "Related Link (Optional)" }),
+          /* @__PURE__ */ jsx(
+            Input$1,
+            {
+              id: "link",
+              type: "text",
+              placeholder: "https://example.com",
+              value: link,
+              onChange: (e) => {
+                setLink(e.target.value);
+                if (errors.link) {
+                  setErrors({ ...errors, link: void 0 });
+                }
+              },
+              onPaste: (e) => {
+                e.stopPropagation();
+              },
+              className: errors.link ? "cteditor-border-red-500 focus-visible:cteditor-ring-red-500" : ""
+            }
+          ),
+          errors.link && /* @__PURE__ */ jsx("p", { className: "cteditor-text-sm cteditor-text-red-500", children: errors.link })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "cteditor-p-3 cteditor-bg-muted/50 cteditor-rounded-lg", children: [
+          /* @__PURE__ */ jsxs("div", { className: "cteditor-flex cteditor-items-center cteditor-gap-1 cteditor-mb-2", children: [
+            /* @__PURE__ */ jsx(Lightbulb, { className: "cteditor-h-4 cteditor-w-4" }),
+            /* @__PURE__ */ jsx("h3", { className: "cteditor-text-sm cteditor-font-medium", children: "Tips for a great suggestion:" })
+          ] }),
+          /* @__PURE__ */ jsxs("ul", { className: "cteditor-text-xs cteditor-text-muted-foreground cteditor-space-y-1", children: [
+            /* @__PURE__ */ jsx("li", { children: "• Be specific about what you want and why it would be useful" }),
+            /* @__PURE__ */ jsx("li", { children: "• Explain the problem your suggestion would solve" }),
+            /* @__PURE__ */ jsx("li", { children: "• Consider how other users might benefit from this feature" }),
+            /* @__PURE__ */ jsx("li", { children: "• Include any relevant examples or use cases" })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(DialogFooter, { children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: handleCancel,
+            disabled: isSubmitting,
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsx(Button, { type: "submit", disabled: isSubmitting, children: isSubmitting ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Loader2, { className: "cteditor-h-4 cteditor-w-4 cteditor-animate-spin cteditor-mr-2" }),
+          "Submitting..."
+        ] }) : "Submit Suggestion" })
+      ] })
+    ] })
+  ] }) });
+}
 const DEFAULT_FONTS = [
   "Arial",
   "Courier New",
@@ -25315,86 +25397,6 @@ const NotePanelMenu = ({ className }) => {
     }) })
   ] });
 };
-const CHART_TYPES = [
-  { value: "bar", label: "Bar Chart", icon: "📊", description: "Vertical bars for comparing values" },
-  { value: "horizontal-bar", label: "Horizontal Bar", icon: "📈", description: "Horizontal bars for categories" },
-  { value: "line", label: "Line Chart", icon: "📉", description: "Connected points showing trends" },
-  { value: "pie", label: "Pie Chart", icon: "🥧", description: "Circular chart for proportions" },
-  { value: "donut", label: "Donut Chart", icon: "🍩", description: "Hollow circle showing proportions" }
-];
-const DEFAULT_COLORS = [
-  "#4285f4",
-  // Blue
-  "#ea4335",
-  // Red
-  "#fbbc04",
-  // Yellow
-  "#34a853",
-  // Green
-  "#ff6d01"
-  // Orange
-];
-function ChartInsertDialog({
-  open,
-  onOpenChange,
-  onInsert
-}) {
-  const [selectedType, setSelectedType] = useState$1("bar");
-  const handleInsert = () => {
-    const dummyMetadata = {
-      type: selectedType,
-      values: [10, 20, 15, 25, 30],
-      labels: ["Item 1", "Item 2", "Item 3", "Item 4", "Item 5"],
-      title: "Sample Chart",
-      colors: DEFAULT_COLORS
-    };
-    onInsert(dummyMetadata);
-    onOpenChange(false);
-  };
-  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[500px]", children: [
-    /* @__PURE__ */ jsxs(DialogHeader, { children: [
-      /* @__PURE__ */ jsxs(DialogTitle, { className: "cteditor-flex cteditor-items-center cteditor-gap-2", children: [
-        /* @__PURE__ */ jsx("span", { className: "cteditor-text-2xl", children: "📊" }),
-        "Insert Chart"
-      ] }),
-      /* @__PURE__ */ jsx(DialogDescription, { children: "Select a chart type to insert into your document. You can customize it after insertion." })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "cteditor-space-y-4 ", children: [
-      /* @__PURE__ */ jsx(Label$2, { className: "cteditor-text-sm cteditor-font-medium", children: "Chart Type" }),
-      /* @__PURE__ */ jsx("div", { className: "cteditor-grid cteditor-gap-3", children: CHART_TYPES.map((type) => /* @__PURE__ */ jsxs(
-        "button",
-        {
-          onClick: () => setSelectedType(type.value),
-          className: `cteditor-flex cteditor-items-start cteditor-gap-3 cteditor-p-4 cteditor-rounded-lg cteditor-border-2 cteditor-transition-all cteditor-text-left ${selectedType === type.value ? "cteditor-border-primary cteditor-bg-primary/5" : "cteditor-border-gray-200 dark:cteditor-border-gray-700 hover:cteditor-border-gray-300 dark:hover:cteditor-border-gray-600"}`,
-          children: [
-            /* @__PURE__ */ jsx("span", { className: "cteditor-text-2xl", children: type.icon }),
-            /* @__PURE__ */ jsxs("div", { className: "cteditor-flex-1", children: [
-              /* @__PURE__ */ jsx("div", { className: "cteditor-font-medium cteditor-text-sm", children: type.label }),
-              /* @__PURE__ */ jsx("div", { className: "cteditor-text-xs cteditor-text-gray-600 dark:cteditor-text-gray-400 cteditor-mt-1", children: type.description })
-            ] }),
-            selectedType === type.value && /* @__PURE__ */ jsx("div", { className: "cteditor-flex cteditor-items-center cteditor-justify-center cteditor-w-5 cteditor-h-5 cteditor-rounded-full cteditor-bg-primary cteditor-text-primary-foreground", children: /* @__PURE__ */ jsx("svg", { className: "cteditor-w-3 cteditor-h-3", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z", clipRule: "evenodd" }) }) })
-          ]
-        },
-        type.value
-      )) }),
-      /* @__PURE__ */ jsx("div", { className: "cteditor-p-3 cteditor-rounded-md cteditor-bg-blue-50 dark:cteditor-bg-blue-950/20 cteditor-border cteditor-border-blue-200 dark:cteditor-border-blue-800", children: /* @__PURE__ */ jsxs("div", { className: "cteditor-flex cteditor-items-start cteditor-gap-2", children: [
-        /* @__PURE__ */ jsx("span", { className: "cteditor-text-blue-600 dark:cteditor-text-blue-400", children: "ℹ️" }),
-        /* @__PURE__ */ jsx("p", { className: "cteditor-text-xs cteditor-text-blue-700 dark:cteditor-text-blue-300", children: 'A sample chart with dummy data will be inserted. You can edit the chart by hovering over it and clicking the "Edit Chart" button.' })
-      ] }) })
-    ] }),
-    /* @__PURE__ */ jsxs(DialogFooter, { className: "cteditor-gap-2", children: [
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          variant: "outline",
-          onClick: () => onOpenChange(false),
-          children: "Cancel"
-        }
-      ),
-      /* @__PURE__ */ jsx(Button, { onClick: handleInsert, children: "Insert Chart" })
-    ] })
-  ] }) });
-}
 const useStyles$1 = () => ({
   root: "cteditor-p-2 cteditor-border-b cteditor-border-[#e0e0e0] cteditor-max-w-full cteditor-overflow-x-auto",
   toolbar: "cteditor-p-2 cteditor-max-w-full cteditor-overflow-x-auto cteditor-flex cteditor-flex-nowrap cteditor-gap-1",
@@ -25771,42 +25773,49 @@ const Toolbar = ({
   useCallback(() => {
     setIsChartDialogOpen(false);
   }, []);
-  const handleChartInsert = useCallback(async (metadata) => {
-    const toastId = toast.loading("Generating chart...");
-    try {
-      const backendUrl = "https://api.cteditor.com/".replace(/\/$/, "");
-      const response = await fetch(`${backendUrl}/api/chat/regenerate`, {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json",
-          "x-api-key": apiKey || ""
-        },
-        body: JSON.stringify(metadata)
-      });
-      if (!response.ok) {
-        const errorData = await response.json().catch(() => ({}));
-        throw new Error(errorData.message || `Server error: ${response.status}`);
-      }
-      const data = await response.json();
-      if (!data.success || !data.html) {
-        throw new Error(data.message || "Failed to generate chart");
-      }
-      editor.update(() => {
-        const chartNode = $createChartNode(data.html, metadata);
-        const selection = $getSelection();
-        if (!selection) {
-          const root2 = $getRoot();
-          root2.append(chartNode);
-        } else {
-          $insertNodes([chartNode]);
+  const handleChartInsert = useCallback(
+    async (metadata) => {
+      const toastId = toast.loading("Generating chart...");
+      try {
+        const backendUrl = "http://localhost:3000/".replace(/\/$/, "");
+        const response = await fetch(`${backendUrl}/api/chat/regenerate`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+            "x-api-key": apiKey || ""
+          },
+          body: JSON.stringify(metadata)
+        });
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({}));
+          throw new Error(
+            errorData.message || `Server error: ${response.status}`
+          );
         }
-      });
-      toast.success("Chart inserted successfully!", { id: toastId });
-    } catch (error) {
-      const errorMessage = error instanceof Error ? error.message : "Unknown error occurred";
-      toast.error(`Failed to insert chart: ${errorMessage}`, { id: toastId });
-    }
-  }, [editor, apiKey]);
+        const data = await response.json();
+        if (!data.success || !data.html) {
+          throw new Error(data.message || "Failed to generate chart");
+        }
+        editor.update(() => {
+          const chartNode = $createChartNode(data.html, metadata);
+          const selection = $getSelection();
+          if (!selection) {
+            const root2 = $getRoot();
+            root2.append(chartNode);
+          } else {
+            $insertNodes([chartNode]);
+          }
+          const paragraphNode = $createParagraphNode();
+          chartNode.insertAfter(paragraphNode);
+        });
+        toast.success("Chart inserted successfully!", { id: toastId });
+      } catch (error) {
+        const errorMessage = error instanceof Error ? error.message : "Unknown error occurred";
+        toast.error(`Failed to insert chart: ${errorMessage}`, { id: toastId });
+      }
+    },
+    [editor, apiKey]
+  );
   const handleExportPDF = useCallback(async () => {
     try {
       setIsExportingPDF(true);
@@ -25836,7 +25845,11 @@ const Toolbar = ({
         });
       }, 200);
       const timestamp = (/* @__PURE__ */ new Date()).toISOString().slice(0, 19).replace(/[:T]/g, "-");
-      await exportEditorToPDF(activeEditor, `export-${timestamp}.pdf`, apiKey || void 0);
+      await exportEditorToPDF(
+        activeEditor,
+        `export-${timestamp}.pdf`,
+        apiKey || void 0
+      );
       clearInterval(progressInterval);
       setExportProgress(100);
       toast.success("PDF exported successfully!", {
@@ -26450,7 +26463,12 @@ const Toolbar = ({
                         DropdownMenuItem,
                         {
                           asChild: true,
-                          onSelect: (e) => e.preventDefault(),
+                          onSelect: () => {
+                            editor.dispatchCommand(
+                              CREATE_TABLE_COMMAND,
+                              void 0
+                            );
+                          },
                           children: /* @__PURE__ */ jsxs(
                             "div",
                             {
@@ -26657,7 +26675,10 @@ const Toolbar = ({
                           /* @__PURE__ */ jsxs(
                             "button",
                             {
-                              onClick: () => editor.dispatchCommand(AI_TRANSLATE_COMMAND, void 0),
+                              onClick: () => editor.dispatchCommand(
+                                AI_TRANSLATE_COMMAND,
+                                void 0
+                              ),
                               className: "cteditor-w-full cteditor-justify-start cteditor-gap-2",
                               children: [
                                 /* @__PURE__ */ jsx("div", { className: "[&>svg]:cteditor-size-5 cteditor-size-6 cteditor-flex cteditor-justify-center cteditor-items-center", children: /* @__PURE__ */ jsx(TranslateIcon, {}) }),
@@ -26694,7 +26715,10 @@ const Toolbar = ({
                           /* @__PURE__ */ jsxs(
                             "button",
                             {
-                              onClick: () => editor.dispatchCommand(AI_ADJUST_TONE_COMMAND, void 0),
+                              onClick: () => editor.dispatchCommand(
+                                AI_ADJUST_TONE_COMMAND,
+                                void 0
+                              ),
                               className: "cteditor-w-full cteditor-justify-start cteditor-gap-2",
                               children: [
                                 /* @__PURE__ */ jsx("div", { className: "[&>svg]:cteditor-size-5 cteditor-size-6 cteditor-flex cteditor-justify-center cteditor-items-center", children: /* @__PURE__ */ jsx(Volume2, {}) }),
@@ -27046,7 +27070,7 @@ class GrammarAIService {
     __publicField(this, "apiEndpoint");
     __publicField(this, "requestTimeout", REQUEST_TIMEOUT);
     __publicField(this, "sentenceCache", /* @__PURE__ */ new Map());
-    this.apiEndpoint = "https://api.cteditor.com/" + apiEndpoint;
+    this.apiEndpoint = "http://localhost:3000/" + apiEndpoint;
   }
   isSentenceCached(text) {
     const hash = generateSentenceHash(text);
@@ -27179,7 +27203,7 @@ function CombinedAutocompleteGrammarPlugin({
   onSelectOption,
   minMatchLength = 2,
   maxSuggestions = 10,
-  apiEndpoint = "api/ai/process",
+  apiEndpoint = "api/grammar/process",
   enableAI = true,
   debounceDelay = 800
 }) {
@@ -27206,7 +27230,9 @@ function CombinedAutocompleteGrammarPlugin({
   );
   const [errors, setErrors] = useState$1([]);
   const [errorMap, setErrorMap] = useState$1(/* @__PURE__ */ new Map());
-  const [checkingSentences, setCheckingSentences] = useState$1(/* @__PURE__ */ new Set());
+  const [checkingSentences, setCheckingSentences] = useState$1(
+    /* @__PURE__ */ new Set()
+  );
   const [ignoredErrors, setIgnoredErrors] = useState$1(/* @__PURE__ */ new Set());
   const [correctedSentences, setCorrectedSentences] = useState$1(
     /* @__PURE__ */ new Set()
@@ -27828,24 +27854,37 @@ function CombinedAutocompleteGrammarPlugin({
               )
             ] }),
             /* @__PURE__ */ jsx("div", { className: "cteditor-p-3 cteditor-bg-red-50 dark:cteditor-bg-red-900/10 cteditor-rounded-lg cteditor-border-2 cteditor-border-red-200 dark:cteditor-border-red-800", children: /* @__PURE__ */ jsx("p", { className: "cteditor-text-sm cteditor-line-through cteditor-text-red-700 dark:cteditor-text-red-400 cteditor-font-semibold", children: error.original }) }),
-            error.suggestions.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "cteditor-space-y-2", children: [
+            error.suggestions.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "cteditor-space-y-2 overflow-y-auto cteditor-max-h-48", children: [
               /* @__PURE__ */ jsx("p", { className: "cteditor-text-xs cteditor-font-bold cteditor-text-gray-700 dark:cteditor-text-gray-300 cteditor-uppercase cteditor-tracking-wider", children: "Suggestions:" }),
-              error.suggestions.slice(0, 3).map((suggestion, idx) => /* @__PURE__ */ jsxs(
-                "button",
+              /* @__PURE__ */ jsx(
+                "div",
                 {
-                  onClick: (e) => {
-                    e.preventDefault();
-                    e.stopPropagation();
-                    applyCorrection(suggestion, error);
+                  style: {
+                    //add overflow y logic
+                    overflowY: "auto",
+                    maxHeight: "130px",
+                    display: "grid",
+                    gridTemplateColumns: "1fr",
+                    gap: "8px"
                   },
-                  className: "cteditor-w-full cteditor-flex cteditor-items-center cteditor-gap-3 cteditor-px-4 cteditor-py-3 cteditor-bg-green-50 dark:cteditor-bg-green-900/10 hover:cteditor-bg-green-100 cteditor-border-2 cteditor-border-green-200 cteditor-rounded-lg cteditor-transition-all",
-                  children: [
-                    /* @__PURE__ */ jsx(CheckCircle, { className: "cteditor-w-5 cteditor-h-5 cteditor-text-green-600" }),
-                    /* @__PURE__ */ jsx("span", { className: "cteditor-text-sm cteditor-font-semibold cteditor-text-green-700", children: suggestion })
-                  ]
-                },
-                idx
-              )),
+                  children: error.suggestions.map((suggestion, idx) => /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      onClick: (e) => {
+                        e.preventDefault();
+                        e.stopPropagation();
+                        applyCorrection(suggestion, error);
+                      },
+                      className: "cteditor-w-full cteditor-flex cteditor-items-center cteditor-gap-3 cteditor-px-4 cteditor-py-3 cteditor-bg-green-50 dark:cteditor-bg-green-900/10 hover:cteditor-bg-green-100 cteditor-border-2 cteditor-border-green-200 cteditor-rounded-lg cteditor-transition-all",
+                      children: [
+                        /* @__PURE__ */ jsx(CheckCircle, { className: "cteditor-w-5 cteditor-h-5 cteditor-text-green-600" }),
+                        /* @__PURE__ */ jsx("span", { className: "cteditor-text-sm cteditor-font-semibold cteditor-text-green-700", children: suggestion })
+                      ]
+                    },
+                    idx
+                  ))
+                }
+              ),
               error.type === "grammar" && error.correctedSentence && /* @__PURE__ */ jsx(
                 "button",
                 {
@@ -30439,7 +30478,7 @@ function LinkPreviewPlugin() {
         return;
       }
       const linkElement = target.closest("a");
-      if (linkElement) {
+      if (linkElement && editorElement.contains(linkElement)) {
         const href = linkElement.getAttribute("href");
         if (href && href !== "https://" && href !== "http://" && href !== "#") {
           if (showTimeout) {
@@ -30476,7 +30515,7 @@ function LinkPreviewPlugin() {
         return;
       }
       const linkElement = target.closest("a");
-      if (linkElement) {
+      if (linkElement && editorElement.contains(linkElement)) {
         if (showTimeout) {
           clearTimeout(showTimeout);
           showTimeout = null;
@@ -30491,10 +30530,35 @@ function LinkPreviewPlugin() {
         }
       }
     };
+    const handlePreviewMouseOver = (event) => {
+      const target = event.target;
+      if (target.closest(".link-preview-card")) {
+        isOverPreview = true;
+        if (hideTimeout) {
+          clearTimeout(hideTimeout);
+          hideTimeout = null;
+        }
+      }
+    };
+    const handlePreviewMouseOut = (event) => {
+      const target = event.target;
+      const relatedTarget = event.relatedTarget;
+      if (target.closest(".link-preview-card")) {
+        isOverPreview = false;
+        const movingToLink = relatedTarget == null ? void 0 : relatedTarget.closest("a");
+        if (!movingToLink || !editorElement.contains(movingToLink)) {
+          hideTimeout = window.setTimeout(() => {
+            if (!isOverPreview) {
+              setHoveredLink(null);
+            }
+          }, 300);
+        }
+      }
+    };
     editorElement.addEventListener("mouseover", handleMouseOver);
     editorElement.addEventListener("mouseout", handleMouseOut);
-    document.body.addEventListener("mouseover", handleMouseOver);
-    document.body.addEventListener("mouseout", handleMouseOut);
+    document.body.addEventListener("mouseover", handlePreviewMouseOver);
+    document.body.addEventListener("mouseout", handlePreviewMouseOut);
     return () => {
       if (showTimeout) {
         clearTimeout(showTimeout);
@@ -30504,8 +30568,8 @@ function LinkPreviewPlugin() {
       }
       editorElement.removeEventListener("mouseover", handleMouseOver);
       editorElement.removeEventListener("mouseout", handleMouseOut);
-      document.body.removeEventListener("mouseover", handleMouseOver);
-      document.body.removeEventListener("mouseout", handleMouseOut);
+      document.body.removeEventListener("mouseover", handlePreviewMouseOver);
+      document.body.removeEventListener("mouseout", handlePreviewMouseOut);
     };
   }, [editor]);
   if (!hoveredLink) {
@@ -31684,8 +31748,6 @@ const basicColors = [
   "#9b9b9b",
   "#ffffff"
 ];
-const WIDTH = 214;
-const HEIGHT = 150;
 function ColorPicker({
   color,
   onChange,
@@ -31694,19 +31756,6 @@ function ColorPicker({
   const [selfColor, setSelfColor] = useState$1(transformColor("hex", color));
   const [inputColor, setInputColor] = useState$1(color);
   const innerDivRef = useRef(null);
-  const saturationPosition = useMemo(
-    () => ({
-      x: selfColor.hsv.s / 100 * WIDTH,
-      y: (100 - selfColor.hsv.v) / 100 * HEIGHT
-    }),
-    [selfColor.hsv.s, selfColor.hsv.v]
-  );
-  const huePosition = useMemo(
-    () => ({
-      x: selfColor.hsv.h / 360 * WIDTH
-    }),
-    [selfColor.hsv]
-  );
   const onSetHex = (hex) => {
     setInputColor(hex);
     if (/^#[0-9A-Fa-f]{6}$/i.test(hex)) {
@@ -31717,15 +31766,17 @@ function ColorPicker({
   const onMoveSaturation = ({ x: x2, y: y2 }) => {
     const newHsv = {
       ...selfColor.hsv,
-      s: x2 / WIDTH * 100,
-      v: 100 - y2 / HEIGHT * 100
+      s: x2,
+      // x is already 0-100
+      v: 100 - y2
+      // y is 0-100, so 100-y is correct for Value
     };
     const newColor = transformColor("hsv", newHsv);
     setSelfColor(newColor);
     setInputColor(newColor.hex);
   };
   const onMoveHue = ({ x: x2 }) => {
-    const newHsv = { ...selfColor.hsv, h: x2 / WIDTH * 360 };
+    const newHsv = { ...selfColor.hsv, h: x2 / 100 * 360 };
     const newColor = transformColor("hsv", newHsv);
     setSelfColor(newColor);
     setInputColor(newColor.hex);
@@ -31744,67 +31795,69 @@ function ColorPicker({
     setSelfColor(newColor);
     setInputColor(newColor.hex);
   }, [color]);
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: "color-picker-wrapper",
-      ref: innerDivRef,
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "cteditor-flex cteditor-gap-2 cteditor-justify-between cteditor-mb-2", children: [
-          /* @__PURE__ */ jsx(TextInput, { label: "Hex", onChange: onSetHex, value: inputColor }),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "color-picker-color",
-              style: { backgroundColor: selfColor.hex }
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "color-picker-basic-color", children: basicColors.map((basicColor) => /* @__PURE__ */ jsx(
-          "button",
-          {
-            className: basicColor === selfColor.hex ? " active" : "",
-            style: { backgroundColor: basicColor },
-            onClick: () => {
-              setInputColor(basicColor);
-              setSelfColor(transformColor("hex", basicColor));
-            }
-          },
-          basicColor
-        )) }),
-        /* @__PURE__ */ jsx(
-          MoveWrapper,
-          {
-            className: "color-picker-saturation",
-            style: { backgroundColor: `hsl(${selfColor.hsv.h}, 100%, 50%)` },
-            onChange: onMoveSaturation,
-            children: /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: "color-picker-saturation_cursor",
-                style: {
-                  backgroundColor: selfColor.hex,
-                  left: saturationPosition.x,
-                  top: saturationPosition.y
-                }
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsx(MoveWrapper, { className: "color-picker-hue", onChange: onMoveHue, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs("div", { className: "color-picker-wrapper", ref: innerDivRef, children: [
+    /* @__PURE__ */ jsxs("div", { className: "cteditor-flex cteditor-gap-2 cteditor-justify-between cteditor-mb-2", children: [
+      /* @__PURE__ */ jsx(TextInput, { label: "Hex", onChange: onSetHex, value: inputColor }),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "color-picker-color",
+          style: { backgroundColor: selfColor.hex }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "color-picker-basic-color", children: basicColors.map((basicColor) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: basicColor === selfColor.hex ? " active" : "",
+        style: { backgroundColor: basicColor },
+        onClick: () => {
+          setInputColor(basicColor);
+          setSelfColor(transformColor("hex", basicColor));
+        }
+      },
+      basicColor
+    )) }),
+    /* @__PURE__ */ jsx(
+      MoveWrapper,
+      {
+        className: "color-picker-saturation",
+        style: { backgroundColor: `hsl(${selfColor.hsv.h}, 100%, 50%)` },
+        onChange: onMoveSaturation,
+        children: /* @__PURE__ */ jsx(
           "div",
           {
-            className: "color-picker-hue_cursor",
+            className: "color-picker-saturation_cursor",
             style: {
-              backgroundColor: `hsl(${selfColor.hsv.h}, 100%, 50%)`,
-              left: huePosition.x
+              backgroundColor: selfColor.hex,
+              // Use percentages for positioning
+              left: `${selfColor.hsv.s}%`,
+              top: `${100 - selfColor.hsv.v}%`
             }
           }
-        ) }),
-        onApply && /* @__PURE__ */ jsx(Button, { className: "cteditor-w-full cteditor-mt-3", onClick: () => onApply(selfColor.hex), children: "Apply Color" })
-      ]
-    }
-  );
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(MoveWrapper, { className: "color-picker-hue", onChange: onMoveHue, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "color-picker-hue_cursor",
+        style: {
+          backgroundColor: `hsl(${selfColor.hsv.h}, 100%, 50%)`,
+          // Use percentages for positioning
+          left: `${selfColor.hsv.h / 360 * 100}%`
+        }
+      }
+    ) }),
+    onApply && /* @__PURE__ */ jsx(
+      Button,
+      {
+        className: "cteditor-w-full cteditor-mt-3",
+        onClick: () => onApply(selfColor.hex),
+        children: "Apply Color"
+      }
+    )
+  ] });
 }
 function MoveWrapper({
   className,
@@ -31814,6 +31867,10 @@ function MoveWrapper({
 }) {
   const divRef = useRef(null);
   const draggedRef = useRef(false);
+  const onChangeRef = useRef(onChange);
+  useEffect$1(() => {
+    onChangeRef.current = onChange;
+  }, [onChange]);
   const move = (e) => {
     if (divRef.current) {
       const { current: div } = divRef;
@@ -31821,7 +31878,11 @@ function MoveWrapper({
       const zoom = calculateZoomLevel(div);
       const x2 = clamp(e.clientX / zoom - left, width, 0);
       const y2 = clamp(e.clientY / zoom - top, height, 0);
-      onChange({ x: x2, y: y2 });
+      const xPercent = x2 / width * 100;
+      const yPercent = y2 / height * 100;
+      if (onChangeRef.current) {
+        onChangeRef.current({ x: xPercent, y: yPercent });
+      }
     }
   };
   const onMouseDown = (e) => {
@@ -32653,7 +32714,7 @@ function TableActionMenu({
   );
   const handleCellBackgroundColor = useCallback(
     (value) => {
-      const getContrastColor = (hexColor) => {
+      const getContrastColor2 = (hexColor) => {
         const hex = hexColor.replace("#", "");
         const r2 = parseInt(hex.substr(0, 2), 16);
         const g2 = parseInt(hex.substr(2, 2), 16);
@@ -32661,7 +32722,7 @@ function TableActionMenu({
         const luminance = (0.299 * r2 + 0.587 * g2 + 0.114 * b2) / 255;
         return luminance > 0.5 ? "#000000" : "#FFFFFF";
       };
-      const textColor = getContrastColor(value);
+      const textColor = getContrastColor2(value);
       const cellKeysToStyle = [];
       editor.update(() => {
         if (tableCellNode.isAttached()) {
@@ -33210,7 +33271,7 @@ function TableCellActionMenuContainer({
       return () => clearTimeout(timer);
     }
   }, [colorPickerModal]);
-  return /* @__PURE__ */ jsxs("div", { className: "table-cell-action-button-container", ref: menuButtonRef, children: [
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "table-cell-action-button-container", ref: menuButtonRef, children: [
     tableCellNode != null && /* @__PURE__ */ jsxs(Fragment, { children: [
       !isMenuOpen && /* @__PURE__ */ jsx(
         "button",
@@ -33255,7 +33316,7 @@ function TableCellActionMenuContainer({
       )
     ] }),
     colorPickerModal
-  ] });
+  ] }) });
 }
 function TableActionMenuPlugin({
   anchorElem,
@@ -35080,6 +35141,190 @@ const WordCountPlugin = () => {
     }
   );
 };
+function exportEditorWithStriping(editor) {
+  const rootElement = editor.getRootElement();
+  if (!rootElement)
+    return "";
+  const tableStyleMap = /* @__PURE__ */ new Map();
+  const liveTables = rootElement.querySelectorAll("table");
+  liveTables.forEach((table, index2) => {
+    const colors = detectTableColorsFromVariables(table);
+    if (colors) {
+      tableStyleMap.set(index2, colors);
+    }
+  });
+  let htmlString = "";
+  editor.getEditorState().read(() => {
+    htmlString = $generateHtmlFromNodes(editor, null);
+  });
+  return processHtmlForExport(htmlString, tableStyleMap);
+}
+function detectTableColorsFromVariables(table) {
+  const computed = window.getComputedStyle(table);
+  const oddVar = computed.getPropertyValue("--table-odd-striping-color").trim();
+  const evenVar = computed.getPropertyValue("--table-even-striping-color").trim();
+  const isValidColor = (c2) => c2 && c2 !== "initial" && c2 !== "inherit" && c2 !== "";
+  if (isValidColor(oddVar) || isValidColor(evenVar)) {
+    return {
+      odd: isValidColor(oddVar) ? oddVar : "",
+      even: isValidColor(evenVar) ? evenVar : ""
+    };
+  }
+  const rows = Array.from(table.querySelectorAll("tr")).filter(
+    (row) => row.querySelector("td")
+  );
+  if (rows.length >= 2) {
+    const r1 = window.getComputedStyle(
+      rows[0].querySelector("td")
+    ).backgroundColor;
+    const r2 = window.getComputedStyle(
+      rows[1].querySelector("td")
+    ).backgroundColor;
+    if (r1 !== r2 && r1 !== "rgba(0, 0, 0, 0)") {
+      return { odd: r1, even: r2 };
+    }
+  }
+  return null;
+}
+function processHtmlForExport(html, tableStyleMap) {
+  const parser = new DOMParser();
+  const doc = parser.parseFromString(html, "text/html");
+  const tables = doc.querySelectorAll("table");
+  tables.forEach((table, index2) => {
+    const colors = tableStyleMap.get(index2);
+    if (!colors)
+      return;
+    const tbody = table.querySelector("tbody") || table;
+    const dataRows = Array.from(tbody.querySelectorAll("tr")).filter(
+      (row) => row.querySelector("td")
+    );
+    dataRows.forEach((row, rowIndex) => {
+      const isOdd = !(rowIndex % 2 === 0);
+      const bgColor = isOdd ? colors.odd : colors.even;
+      if (bgColor) {
+        const textColor = getContrastColor(bgColor);
+        row.querySelectorAll("td").forEach((cell) => {
+          const el = cell;
+          el.style.setProperty("background-color", bgColor, "important");
+          el.style.color = textColor;
+          el.querySelectorAll("*").forEach((nested) => {
+            nested.style.color = textColor;
+          });
+        });
+      }
+    });
+  });
+  cleanupHeaderCellStructure(doc.body);
+  applyGenericSafeStyles(doc.body);
+  cleanupClasses(doc.body);
+  return doc.body.innerHTML;
+}
+function cleanupHeaderCellStructure(container) {
+  const allHeaderCells = container.querySelectorAll("th");
+  allHeaderCells.forEach((th) => {
+    const paragraphs = th.querySelectorAll("p");
+    paragraphs.forEach((p2) => {
+      const childNodes = Array.from(p2.childNodes);
+      const hasOnlyBr = childNodes.filter(
+        (node) => {
+          var _a;
+          return node.nodeType === Node.ELEMENT_NODE || ((_a = node.textContent) == null ? void 0 : _a.trim());
+        }
+      ).length === 1 && p2.querySelector("br");
+      if (hasOnlyBr) {
+        const br = p2.querySelector("br");
+        if (br)
+          br.remove();
+      }
+    });
+  });
+}
+function applyGenericSafeStyles(container) {
+  const addStyle = (selector, styles) => {
+    container.querySelectorAll(selector).forEach((el) => {
+      el.style.cssText += "; " + styles;
+    });
+  };
+  const fontReset = 'font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; font-size: 14px; line-height: 1.5;';
+  addStyle("table, p, span, li, td, th, div, h1, h2, h3, h4, h5, h6", fontReset);
+  addStyle("th p, td p", "margin: 0; padding: 0;");
+  addStyle(
+    "table",
+    "border-collapse: collapse; width: 100%; max-width: 100%; margin: 20px 0;"
+  );
+  addStyle(
+    "th, td",
+    "border: 1px solid #dfe1e5; padding: 10px; vertical-align: middle; text-align: left;"
+  );
+  addStyle("th", "background-color: #f8f9fa; font-weight: 600;");
+  addStyle("img", "max-width: 100%; height: auto; display: block;");
+  addStyle("h1", "font-size: 2em; font-weight: bold; margin: 0.67em 0;");
+  addStyle("h2", "font-size: 1.5em; font-weight: bold; margin: 0.75em 0;");
+  addStyle("h3", "font-size: 1.17em; font-weight: bold; margin: 0.83em 0;");
+  addStyle("h4", "font-size: 1em; font-weight: bold; margin: 1.12em 0;");
+  addStyle("h5", "font-size: 0.83em; font-weight: bold; margin: 1.5em 0;");
+  addStyle("h6", "font-size: 0.75em; font-weight: bold; margin: 1.67em 0;");
+  addStyle("ul, ol", "margin: 1em 0; padding-left: 40px;");
+  addStyle("li", "margin: 0.5em 0;");
+  addStyle("a", "color: #0066cc; text-decoration: underline;");
+  addStyle(
+    "code",
+    'font-family: "Courier New", Courier, monospace; background-color: #f5f5f5; padding: 2px 4px; border-radius: 3px;'
+  );
+  addStyle(
+    "pre",
+    'font-family: "Courier New", Courier, monospace; background-color: #f5f5f5; padding: 10px; border-radius: 5px; overflow-x: auto; margin: 1em 0;'
+  );
+  addStyle(
+    "blockquote",
+    "border-left: 4px solid #ddd; margin: 1em 0; padding-left: 1em; color: #666;"
+  );
+  addStyle("strong, b", "font-weight: bold;");
+  addStyle("em, i", "font-style: italic;");
+  addStyle("hr", "border: none; border-top: 1px solid #ddd; margin: 1em 0;");
+}
+function cleanupClasses(container) {
+  const classesToRemove = [
+    "PlaygroundEditorTheme__",
+    "editor-",
+    "cteditor-",
+    "table-custom-odd-striping",
+    "table-custom-even-striping",
+    "has-header-row"
+  ];
+  container.querySelectorAll("*").forEach((elem) => {
+    const classList = Array.from(elem.classList);
+    classList.forEach((className) => {
+      if (classesToRemove.some((prefix) => className.startsWith(prefix))) {
+        elem.classList.remove(className);
+      }
+    });
+    if (elem.classList.length === 0)
+      elem.removeAttribute("class");
+  });
+}
+function getContrastColor(color) {
+  if (color.includes("var("))
+    return "#000000";
+  let r2 = 0, g2 = 0, b2 = 0;
+  if (color.startsWith("#")) {
+    const hex = color.replace("#", "");
+    r2 = parseInt(hex.length === 3 ? hex[0] + hex[0] : hex.substring(0, 2), 16);
+    g2 = parseInt(hex.length === 3 ? hex[1] + hex[1] : hex.substring(2, 4), 16);
+    b2 = parseInt(hex.length === 3 ? hex[2] + hex[2] : hex.substring(4, 6), 16);
+  } else if (color.includes("rgb")) {
+    const matches = color.match(/\d+/g);
+    if (matches && matches.length >= 3) {
+      r2 = parseInt(matches[0]);
+      g2 = parseInt(matches[1]);
+      b2 = parseInt(matches[2]);
+    }
+  } else {
+    return "#000000";
+  }
+  const yiq = (r2 * 299 + g2 * 587 + b2 * 114) / 1e3;
+  return yiq >= 128 ? "#000000" : "#FFFFFF";
+}
 const useAutoExpandingHeight = ({
   minHeight = 150,
   maxHeight = 800,
@@ -35177,23 +35422,30 @@ const CombinedPluginWrapper = () => {
   if (!toolbarState.isAutocompleteEnabled || !toolbarState.isGrammarCheckEnabled) {
     return null;
   }
-  return /* @__PURE__ */ jsx(CombinedAutocompleteGrammarPlugin, { minMatchLength: 2, maxSuggestions: 10, enableAI: (toolbarState == null ? void 0 : toolbarState.isAutocompleteEnabled) ?? true });
+  return /* @__PURE__ */ jsx(
+    CombinedAutocompleteGrammarPlugin,
+    {
+      minMatchLength: 2,
+      maxSuggestions: 10,
+      enableAI: (toolbarState == null ? void 0 : toolbarState.isAutocompleteEnabled) ?? true
+    }
+  );
 };
-const OnChangeWrapper = ({ onChange }) => {
+const OnChangeWrapper = ({
+  onChange
+}) => {
   const [editor] = useLexicalComposerContext();
-  const handleChange = (editorState) => {
-    editorState.read(() => {
-      $getRoot();
-      $getSelection();
-      if (onChange) {
-        const htmlContent = $generateHtmlFromNodes(editor, null);
-        onChange(htmlContent);
-      }
-    });
+  const handleChange = () => {
+    const exportReady = exportEditorWithStriping(editor);
+    if (onChange) {
+      onChange(exportReady);
+    }
   };
   return /* @__PURE__ */ jsx(OnChangePlugin, { onChange: handleChange });
 };
-const InitialContentPlugin = ({ initialContent }) => {
+const InitialContentPlugin = ({
+  initialContent
+}) => {
   const [editor] = useLexicalComposerContext();
   useEffect$1(() => {
     if (!initialContent)
@@ -35223,7 +35475,9 @@ const CellBackgroundPersistencePlugin = () => {
           const cells = tableElement.querySelectorAll("td, th");
           cells.forEach((cell) => {
             const htmlCell = cell;
-            const cellKey = Object.keys(htmlCell).find((key) => key.startsWith("__reactProps")) ? htmlCell["__lexicalKey"] : void 0;
+            const cellKey = Object.keys(htmlCell).find(
+              (key) => key.startsWith("__reactProps")
+            ) ? htmlCell["__lexicalKey"] : void 0;
             if (!cellKey)
               return;
             try {
@@ -35237,9 +35491,17 @@ const CellBackgroundPersistencePlugin = () => {
                   const b2 = parseInt(hex.substr(4, 2), 16);
                   const luminance = (0.299 * r2 + 0.587 * g2 + 0.114 * b2) / 255;
                   const textColor = luminance > 0.5 ? "#000000" : "#FFFFFF";
-                  htmlCell.style.setProperty("background-color", bgColor, "important");
+                  htmlCell.style.setProperty(
+                    "background-color",
+                    bgColor,
+                    "important"
+                  );
                   htmlCell.style.setProperty("color", textColor, "important");
-                  htmlCell.style.setProperty("border-color", "#bbb", "important");
+                  htmlCell.style.setProperty(
+                    "border-color",
+                    "#bbb",
+                    "important"
+                  );
                   const nestedElements = htmlCell.querySelectorAll("*");
                   nestedElements.forEach((elem) => {
                     if (elem instanceof HTMLElement) {
@@ -35248,7 +35510,11 @@ const CellBackgroundPersistencePlugin = () => {
                   });
                   const hasHeaderStyles = cellNode.getHeaderStyles();
                   if (hasHeaderStyles) {
-                    htmlCell.style.setProperty("font-weight", "600", "important");
+                    htmlCell.style.setProperty(
+                      "font-weight",
+                      "600",
+                      "important"
+                    );
                   }
                 }
               }
@@ -35422,7 +35688,12 @@ const ConfigurableEditor = ({
             features: config.floatingMenuOptions
           }
         ),
-        /* @__PURE__ */ jsx(FloatingEnhanceButtonPlugin, { anchorElem: floatingAnchorElem })
+        /* @__PURE__ */ jsx(
+          FloatingEnhanceButtonPlugin,
+          {
+            anchorElem: floatingAnchorElem
+          }
+        )
       ] })
     ] }) }),
     /* @__PURE__ */ jsx(
@@ -35590,4 +35861,4 @@ export {
   useHtmlView as u,
   verifyApiKey as v
 };
-//# sourceMappingURL=index-78acd11a.js.map
+//# sourceMappingURL=index-38cb7602.js.map