cms-block-editor 1.0.12 → 1.0.13

package/dist/index.mjs

@@ -13,7 +13,7 @@ import LexicalErrorBoundary from "@lexical/react/LexicalErrorBoundary";
 
 // src/plugins/SlashCommandPlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext2 } from "@lexical/react/LexicalComposerContext";
-import { useEffect as useEffect3, useState as useState4 } from "react";
+import { useEffect as useEffect4, useState as useState5 } from "react";
 import {
   $createParagraphNode,
   $getSelection,
@@ -731,26 +731,465 @@ var ImageNode = class _ImageNode extends DecoratorNode {
   }
 };
 
-// src/blocks/YouTubeNode.tsx
+// src/blocks/VideoNode.tsx
 import { DecoratorNode as DecoratorNode2 } from "lexical";
-import { useCallback as useCallback2, useRef as useRef2, useState as useState3 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect3, useRef as useRef2, useState as useState3 } from "react";
 import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function YouTubeComponent({
-  id,
+function VideoComponent({
+  src,
   width: initialWidth,
   height: initialHeight,
+  autoplay = false,
+  loop = false,
+  muted = false,
+  controls = true,
   nodeKey,
   editor
 }) {
+  const videoRef = useRef2(null);
   const wrapperRef = useRef2(null);
   const [isResizing, setIsResizing] = useState3(false);
   const [isSelected, setIsSelected] = useState3(false);
-  const [isDragging, setIsDragging] = useState3(false);
+  const [showSettings, setShowSettings] = useState3(false);
   const [size, setSize] = useState3({
+    width: initialWidth || 640,
+    height: initialHeight || 360
+  });
+  const [settings, setSettings] = useState3({
+    autoplay,
+    loop,
+    muted,
+    controls
+  });
+  useEffect3(() => {
+    if (videoRef.current && (!size.width || !size.height)) {
+      const video = videoRef.current;
+      const onLoadedMetadata = () => {
+        setSize({
+          width: initialWidth || video.videoWidth || 640,
+          height: initialHeight || video.videoHeight || 360
+        });
+      };
+      if (video.readyState >= 1) {
+        onLoadedMetadata();
+      } else {
+        video.addEventListener("loadedmetadata", onLoadedMetadata);
+        return () => video.removeEventListener("loadedmetadata", onLoadedMetadata);
+      }
+    }
+  }, [initialWidth, initialHeight, size.width, size.height]);
+  const onResizeStart = useCallback2((e, direction) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setIsResizing(true);
+    const startX = e.clientX;
+    const startY = e.clientY;
+    const startWidth = size.width;
+    const startHeight = size.height;
+    const aspectRatio = startWidth / startHeight;
+    let finalWidth = startWidth;
+    let finalHeight = startHeight;
+    const onMouseMove = (moveEvent) => {
+      const deltaX = moveEvent.clientX - startX;
+      const deltaY = moveEvent.clientY - startY;
+      let newWidth = startWidth;
+      let newHeight = startHeight;
+      if (direction === "e" || direction === "ne" || direction === "se") {
+        newWidth = Math.max(200, startWidth + deltaX);
+        newHeight = newWidth / aspectRatio;
+      } else if (direction === "w" || direction === "nw" || direction === "sw") {
+        newWidth = Math.max(200, startWidth - deltaX);
+        newHeight = newWidth / aspectRatio;
+      } else if (direction === "n") {
+        newHeight = Math.max(150, startHeight - deltaY);
+        newWidth = newHeight * aspectRatio;
+      } else if (direction === "s") {
+        newHeight = Math.max(150, startHeight + deltaY);
+        newWidth = newHeight * aspectRatio;
+      }
+      finalWidth = newWidth;
+      finalHeight = newHeight;
+      setSize({ width: newWidth, height: newHeight });
+    };
+    const onMouseUp = () => {
+      setIsResizing(false);
+      editor.update(() => {
+        const node = editor.getEditorState()._nodeMap.get(nodeKey);
+        if (node && node instanceof VideoNode) {
+          const writable = node.getWritable();
+          writable.__width = finalWidth;
+          writable.__height = finalHeight;
+        }
+      });
+      document.removeEventListener("mousemove", onMouseMove);
+      document.removeEventListener("mouseup", onMouseUp);
+    };
+    document.addEventListener("mousemove", onMouseMove);
+    document.addEventListener("mouseup", onMouseUp);
+  }, [size, editor, nodeKey]);
+  const updateSettings = (newSettings) => {
+    const updated = { ...settings, ...newSettings };
+    setSettings(updated);
+    editor.update(() => {
+      const node = editor.getEditorState()._nodeMap.get(nodeKey);
+      if (node && node instanceof VideoNode) {
+        const writable = node.getWritable();
+        writable.__autoplay = updated.autoplay;
+        writable.__loop = updated.loop;
+        writable.__muted = updated.muted;
+        writable.__controls = updated.controls;
+      }
+    });
+  };
+  const deleteVideo = () => {
+    editor.update(() => {
+      const node = editor.getEditorState()._nodeMap.get(nodeKey);
+      if (node) {
+        node.remove();
+      }
+    });
+  };
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      ref: wrapperRef,
+      className: `video-node-wrapper ${isSelected ? "selected" : ""} ${isResizing ? "resizing" : ""}`,
+      onClick: () => setIsSelected(!isSelected),
+      style: {
+        width: size.width ? `${size.width}px` : "auto",
+        maxWidth: "100%",
+        position: "relative",
+        display: "inline-block",
+        margin: "16px 0",
+        cursor: isSelected ? "default" : "pointer"
+      },
+      children: [
+        /* @__PURE__ */ jsx3(
+          "video",
+          {
+            ref: videoRef,
+            src,
+            autoPlay: settings.autoplay,
+            loop: settings.loop,
+            muted: settings.muted,
+            controls: settings.controls,
+            style: {
+              width: "100%",
+              height: "auto",
+              display: "block",
+              borderRadius: "4px",
+              border: isSelected ? "2px solid #667eea" : "2px solid transparent",
+              transition: "border-color 0.2s",
+              backgroundColor: "#000"
+            }
+          }
+        ),
+        isSelected && /* @__PURE__ */ jsxs3(Fragment2, { children: [
+          /* @__PURE__ */ jsxs3("div", { style: {
+            position: "absolute",
+            top: "8px",
+            right: "8px",
+            display: "flex",
+            gap: "8px",
+            zIndex: 10
+          }, children: [
+            /* @__PURE__ */ jsx3(
+              "button",
+              {
+                onClick: (e) => {
+                  e.stopPropagation();
+                  setShowSettings(!showSettings);
+                },
+                style: {
+                  padding: "8px 16px",
+                  background: "#667eea",
+                  color: "white",
+                  border: "none",
+                  borderRadius: "6px",
+                  fontSize: "13px",
+                  fontWeight: "500",
+                  cursor: "pointer",
+                  boxShadow: "0 2px 8px rgba(0,0,0,0.2)",
+                  transition: "all 0.2s"
+                },
+                children: "\u2699\uFE0F Settings"
+              }
+            ),
+            /* @__PURE__ */ jsx3(
+              "button",
+              {
+                onClick: (e) => {
+                  e.stopPropagation();
+                  if (confirm("Delete this video?")) {
+                    deleteVideo();
+                  }
+                },
+                style: {
+                  padding: "8px 16px",
+                  background: "#ef4444",
+                  color: "white",
+                  border: "none",
+                  borderRadius: "6px",
+                  fontSize: "13px",
+                  fontWeight: "500",
+                  cursor: "pointer",
+                  boxShadow: "0 2px 8px rgba(0,0,0,0.2)",
+                  transition: "all 0.2s"
+                },
+                children: "\u{1F5D1}\uFE0F Delete"
+              }
+            )
+          ] }),
+          showSettings && /* @__PURE__ */ jsxs3(
+            "div",
+            {
+              style: {
+                position: "absolute",
+                top: "48px",
+                right: "8px",
+                background: "white",
+                border: "1px solid #e5e7eb",
+                borderRadius: "8px",
+                padding: "16px",
+                boxShadow: "0 4px 12px rgba(0,0,0,0.15)",
+                zIndex: 20,
+                minWidth: "200px"
+              },
+              onClick: (e) => e.stopPropagation(),
+              children: [
+                /* @__PURE__ */ jsx3("h4", { style: { margin: "0 0 12px 0", fontSize: "14px", fontWeight: "600" }, children: "Video Settings" }),
+                /* @__PURE__ */ jsxs3("label", { style: { display: "flex", alignItems: "center", marginBottom: "8px", fontSize: "13px", cursor: "pointer" }, children: [
+                  /* @__PURE__ */ jsx3(
+                    "input",
+                    {
+                      type: "checkbox",
+                      checked: settings.controls,
+                      onChange: (e) => updateSettings({ controls: e.target.checked }),
+                      style: { marginRight: "8px" }
+                    }
+                  ),
+                  "Show Controls"
+                ] }),
+                /* @__PURE__ */ jsxs3("label", { style: { display: "flex", alignItems: "center", marginBottom: "8px", fontSize: "13px", cursor: "pointer" }, children: [
+                  /* @__PURE__ */ jsx3(
+                    "input",
+                    {
+                      type: "checkbox",
+                      checked: settings.autoplay,
+                      onChange: (e) => updateSettings({ autoplay: e.target.checked }),
+                      style: { marginRight: "8px" }
+                    }
+                  ),
+                  "Autoplay"
+                ] }),
+                /* @__PURE__ */ jsxs3("label", { style: { display: "flex", alignItems: "center", marginBottom: "8px", fontSize: "13px", cursor: "pointer" }, children: [
+                  /* @__PURE__ */ jsx3(
+                    "input",
+                    {
+                      type: "checkbox",
+                      checked: settings.loop,
+                      onChange: (e) => updateSettings({ loop: e.target.checked }),
+                      style: { marginRight: "8px" }
+                    }
+                  ),
+                  "Loop"
+                ] }),
+                /* @__PURE__ */ jsxs3("label", { style: { display: "flex", alignItems: "center", fontSize: "13px", cursor: "pointer" }, children: [
+                  /* @__PURE__ */ jsx3(
+                    "input",
+                    {
+                      type: "checkbox",
+                      checked: settings.muted,
+                      onChange: (e) => updateSettings({ muted: e.target.checked }),
+                      style: { marginRight: "8px" }
+                    }
+                  ),
+                  "Muted"
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx3(
+            "div",
+            {
+              className: "video-resize-handle video-resize-handle-se",
+              onMouseDown: (e) => onResizeStart(e, "se"),
+              style: {
+                position: "absolute",
+                right: "-4px",
+                bottom: "-4px",
+                width: "12px",
+                height: "12px",
+                background: "#667eea",
+                cursor: "nwse-resize",
+                borderRadius: "50%",
+                boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
+                border: "2px solid white"
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx3(
+            "div",
+            {
+              className: "video-resize-handle video-resize-handle-sw",
+              onMouseDown: (e) => onResizeStart(e, "sw"),
+              style: {
+                position: "absolute",
+                left: "-4px",
+                bottom: "-4px",
+                width: "12px",
+                height: "12px",
+                background: "#667eea",
+                cursor: "nesw-resize",
+                borderRadius: "50%",
+                boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
+                border: "2px solid white"
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx3(
+            "div",
+            {
+              className: "video-resize-handle video-resize-handle-ne",
+              onMouseDown: (e) => onResizeStart(e, "ne"),
+              style: {
+                position: "absolute",
+                right: "-4px",
+                top: "-4px",
+                width: "12px",
+                height: "12px",
+                background: "#667eea",
+                cursor: "nesw-resize",
+                borderRadius: "50%",
+                boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
+                border: "2px solid white"
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx3(
+            "div",
+            {
+              className: "video-resize-handle video-resize-handle-nw",
+              onMouseDown: (e) => onResizeStart(e, "nw"),
+              style: {
+                position: "absolute",
+                left: "-4px",
+                top: "-4px",
+                width: "12px",
+                height: "12px",
+                background: "#667eea",
+                cursor: "nwse-resize",
+                borderRadius: "50%",
+                boxShadow: "0 2px 4px rgba(0,0,0,0.2)",
+                border: "2px solid white"
+              }
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+var VideoNode = class _VideoNode extends DecoratorNode2 {
+  static getType() {
+    return "video";
+  }
+  static clone(node) {
+    return new _VideoNode(
+      node.__src,
+      node.__width,
+      node.__height,
+      node.__autoplay,
+      node.__loop,
+      node.__muted,
+      node.__controls,
+      node.__key
+    );
+  }
+  static isInline() {
+    return true;
+  }
+  constructor(src, width, height, autoplay = false, loop = false, muted = false, controls = true, key) {
+    super(key);
+    this.__src = src;
+    this.__width = width;
+    this.__height = height;
+    this.__autoplay = autoplay;
+    this.__loop = loop;
+    this.__muted = muted;
+    this.__controls = controls;
+  }
+  createDOM() {
+    const span = document.createElement("span");
+    span.style.display = "inline-block";
+    span.style.maxWidth = "100%";
+    return span;
+  }
+  updateDOM() {
+    return false;
+  }
+  decorate(editor) {
+    return /* @__PURE__ */ jsx3(
+      VideoComponent,
+      {
+        src: this.__src,
+        width: this.__width,
+        height: this.__height,
+        autoplay: this.__autoplay,
+        loop: this.__loop,
+        muted: this.__muted,
+        controls: this.__controls,
+        nodeKey: this.__key,
+        editor
+      }
+    );
+  }
+  exportJSON() {
+    return {
+      type: "video",
+      src: this.__src,
+      width: this.__width,
+      height: this.__height,
+      autoplay: this.__autoplay,
+      loop: this.__loop,
+      muted: this.__muted,
+      controls: this.__controls,
+      version: 1
+    };
+  }
+  static importJSON(serializedNode) {
+    return new _VideoNode(
+      serializedNode.src,
+      serializedNode.width,
+      serializedNode.height,
+      serializedNode.autoplay,
+      serializedNode.loop,
+      serializedNode.muted,
+      serializedNode.controls
+    );
+  }
+};
+
+// src/blocks/YouTubeNode.tsx
+import { DecoratorNode as DecoratorNode3 } from "lexical";
+import { useCallback as useCallback3, useRef as useRef3, useState as useState4 } from "react";
+import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function YouTubeComponent({
+  id,
+  width: initialWidth,
+  height: initialHeight,
+  nodeKey,
+  editor
+}) {
+  const wrapperRef = useRef3(null);
+  const [isResizing, setIsResizing] = useState4(false);
+  const [isSelected, setIsSelected] = useState4(false);
+  const [isDragging, setIsDragging] = useState4(false);
+  const [size, setSize] = useState4({
     width: initialWidth || 560,
     height: initialHeight || 315
   });
-  const onResizeStart = useCallback2((e, direction) => {
+  const onResizeStart = useCallback3((e, direction) => {
     e.preventDefault();
     e.stopPropagation();
     setIsResizing(true);
@@ -799,7 +1238,7 @@ function YouTubeComponent({
     document.addEventListener("mousemove", onMouseMove);
     document.addEventListener("mouseup", onMouseUp);
   }, [size, editor, nodeKey]);
-  const onDragStart = useCallback2((e) => {
+  const onDragStart = useCallback3((e) => {
     if (e.target.className.includes("resize-handle")) {
       return;
     }
@@ -842,7 +1281,7 @@ function YouTubeComponent({
     document.addEventListener("mousemove", onMouseMove);
     document.addEventListener("mouseup", onMouseUp);
   }, [id, size, nodeKey, editor]);
-  return /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs4(
     "div",
     {
       ref: wrapperRef,
@@ -858,7 +1297,7 @@ function YouTubeComponent({
         cursor: isSelected ? "move" : "pointer"
       },
       children: [
-        /* @__PURE__ */ jsx3(
+        /* @__PURE__ */ jsx4(
           "iframe",
           {
             src: `https://www.youtube.com/embed/${id}`,
@@ -875,8 +1314,8 @@ function YouTubeComponent({
             }
           }
         ),
-        isSelected && /* @__PURE__ */ jsxs3(Fragment2, { children: [
-          /* @__PURE__ */ jsx3(
+        isSelected && /* @__PURE__ */ jsxs4(Fragment3, { children: [
+          /* @__PURE__ */ jsx4(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-nw",
@@ -896,7 +1335,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx3(
+          /* @__PURE__ */ jsx4(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-ne",
@@ -916,7 +1355,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx3(
+          /* @__PURE__ */ jsx4(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-sw",
@@ -936,7 +1375,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx3(
+          /* @__PURE__ */ jsx4(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-se",
@@ -956,7 +1395,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx3(
+          /* @__PURE__ */ jsx4(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-n",
@@ -976,7 +1415,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx3(
+          /* @__PURE__ */ jsx4(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-s",
@@ -996,7 +1435,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx3(
+          /* @__PURE__ */ jsx4(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-e",
@@ -1016,7 +1455,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx3(
+          /* @__PURE__ */ jsx4(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-w",
@@ -1041,7 +1480,7 @@ function YouTubeComponent({
     }
   );
 }
-var YouTubeNode = class _YouTubeNode extends DecoratorNode2 {
+var YouTubeNode = class _YouTubeNode extends DecoratorNode3 {
   static getType() {
     return "youtube";
   }
@@ -1067,7 +1506,7 @@ var YouTubeNode = class _YouTubeNode extends DecoratorNode2 {
     return false;
   }
   decorate(editor) {
-    return /* @__PURE__ */ jsx3(
+    return /* @__PURE__ */ jsx4(
       YouTubeComponent,
       {
         id: this.__id,
@@ -1205,12 +1644,12 @@ function $createColumnNode() {
 }
 
 // src/plugins/SlashCommandPlugin.tsx
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function SlashCommandPlugin() {
   const [editor] = useLexicalComposerContext2();
-  const [showMenu, setShowMenu] = useState4(false);
-  const [search, setSearch] = useState4("");
-  const [selectedIndex, setSelectedIndex] = useState4(0);
+  const [showMenu, setShowMenu] = useState5(false);
+  const [search, setSearch] = useState5("");
+  const [selectedIndex, setSelectedIndex] = useState5(0);
   const commands = [
     {
       title: "Heading 1",
@@ -1332,6 +1771,31 @@ function SlashCommandPlugin() {
         input.click();
       }
     },
+    {
+      title: "Video",
+      description: "Insert a video",
+      keywords: ["video", "mp4", "movie", "film"],
+      onSelect: (editor2) => {
+        const input = document.createElement("input");
+        input.type = "file";
+        input.accept = "video/*";
+        input.onchange = (e) => {
+          const file = e.target?.files?.[0];
+          if (file) {
+            const url = URL.createObjectURL(file);
+            editor2.update(() => {
+              const selection = $getSelection();
+              if ($isRangeSelection(selection)) {
+                const videoNode = new VideoNode(url);
+                const nodes = [videoNode];
+                selection.insertNodes(nodes);
+              }
+            });
+          }
+        };
+        input.click();
+      }
+    },
     {
       title: "Image from URL",
       description: "Insert an image from a URL",
@@ -1393,7 +1857,7 @@ function SlashCommandPlugin() {
     const searchLower = search.toLowerCase();
     return cmd.title.toLowerCase().includes(searchLower) || cmd.description.toLowerCase().includes(searchLower) || cmd.keywords.some((kw) => kw.includes(searchLower));
   });
-  useEffect3(() => {
+  useEffect4(() => {
     return editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {
         const selection = $getSelection();
@@ -1415,7 +1879,7 @@ function SlashCommandPlugin() {
       });
     });
   }, [editor, showMenu]);
-  useEffect3(() => {
+  useEffect4(() => {
     if (!showMenu) return;
     const handleKeyDown = (event) => {
       if (event.key === "ArrowDown") {
@@ -1461,17 +1925,17 @@ function SlashCommandPlugin() {
   if (!showMenu || filteredCommands.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsxs4("div", { className: "slash-menu", children: [
-    /* @__PURE__ */ jsx4("div", { className: "slash-menu-title", children: "Commands" }),
-    filteredCommands.map((cmd, index) => /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5("div", { className: "slash-menu", children: [
+    /* @__PURE__ */ jsx5("div", { className: "slash-menu-title", children: "Commands" }),
+    filteredCommands.map((cmd, index) => /* @__PURE__ */ jsxs5(
       "div",
       {
         className: `slash-menu-item ${index === selectedIndex ? "selected" : ""}`,
         onClick: () => executeCommand(cmd),
         onMouseEnter: () => setSelectedIndex(index),
         children: [
-          /* @__PURE__ */ jsx4("div", { className: "slash-menu-item-title", children: cmd.title }),
-          /* @__PURE__ */ jsx4("div", { className: "slash-menu-item-description", children: cmd.description })
+          /* @__PURE__ */ jsx5("div", { className: "slash-menu-item-title", children: cmd.title }),
+          /* @__PURE__ */ jsx5("div", { className: "slash-menu-item-description", children: cmd.description })
         ]
       },
       cmd.title
@@ -1500,11 +1964,11 @@ import { $createCodeNode as $createCodeNode2 } from "@lexical/code";
 
 // src/plugins/ColorPickerPlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext3 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState5, useCallback as useCallback3, useEffect as useEffect4, useRef as useRef3 } from "react";
+import { useState as useState6, useCallback as useCallback4, useEffect as useEffect5, useRef as useRef4 } from "react";
 import { $getSelection as $getSelection2, $isRangeSelection as $isRangeSelection2, $isTextNode } from "lexical";
 import { $patchStyleText } from "@lexical/selection";
 import { MdFormatColorText, MdFormatColorFill } from "react-icons/md";
-import { Fragment as Fragment3, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 var PRESET_COLORS = [
   "#000000",
   "#434343",
@@ -1589,15 +2053,15 @@ var PRESET_COLORS = [
 ];
 function ColorPickerPlugin() {
   const [editor] = useLexicalComposerContext3();
-  const [showTextColorPicker, setShowTextColorPicker] = useState5(false);
-  const [showBgColorPicker, setShowBgColorPicker] = useState5(false);
-  const [currentTextColor, setCurrentTextColor] = useState5("#000000");
-  const [currentBgColor, setCurrentBgColor] = useState5("transparent");
-  const [textColorPosition, setTextColorPosition] = useState5({ top: 0, left: 0 });
-  const [bgColorPosition, setBgColorPosition] = useState5({ top: 0, left: 0 });
-  const textColorRef = useRef3(null);
-  const bgColorRef = useRef3(null);
-  useEffect4(() => {
+  const [showTextColorPicker, setShowTextColorPicker] = useState6(false);
+  const [showBgColorPicker, setShowBgColorPicker] = useState6(false);
+  const [currentTextColor, setCurrentTextColor] = useState6("#000000");
+  const [currentBgColor, setCurrentBgColor] = useState6("transparent");
+  const [textColorPosition, setTextColorPosition] = useState6({ top: 0, left: 0 });
+  const [bgColorPosition, setBgColorPosition] = useState6({ top: 0, left: 0 });
+  const textColorRef = useRef4(null);
+  const bgColorRef = useRef4(null);
+  useEffect5(() => {
     return editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {
         const selection = $getSelection2();
@@ -1621,7 +2085,7 @@ function ColorPickerPlugin() {
       });
     });
   }, [editor]);
-  useEffect4(() => {
+  useEffect5(() => {
     const handleClickOutside = (event) => {
       if (textColorRef.current && !textColorRef.current.contains(event.target)) {
         setShowTextColorPicker(false);
@@ -1633,7 +2097,7 @@ function ColorPickerPlugin() {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  const applyTextColor = useCallback3((color) => {
+  const applyTextColor = useCallback4((color) => {
     editor.update(() => {
       const selection = $getSelection2();
       if ($isRangeSelection2(selection)) {
@@ -1642,7 +2106,7 @@ function ColorPickerPlugin() {
     });
     setCurrentTextColor(color);
   }, [editor]);
-  const applyBackgroundColor = useCallback3((color) => {
+  const applyBackgroundColor = useCallback4((color) => {
     editor.update(() => {
       const selection = $getSelection2();
       if ($isRangeSelection2(selection)) {
@@ -1651,7 +2115,7 @@ function ColorPickerPlugin() {
     });
     setCurrentBgColor(color);
   }, [editor]);
-  const toggleTextColorPicker = useCallback3((event) => {
+  const toggleTextColorPicker = useCallback4((event) => {
     if (!showTextColorPicker) {
       const button = event.currentTarget;
       const rect = button.getBoundingClientRect();
@@ -1663,7 +2127,7 @@ function ColorPickerPlugin() {
     setShowTextColorPicker(!showTextColorPicker);
     setShowBgColorPicker(false);
   }, [showTextColorPicker]);
-  const toggleBgColorPicker = useCallback3((event) => {
+  const toggleBgColorPicker = useCallback4((event) => {
     if (!showBgColorPicker) {
       const button = event.currentTarget;
       const rect = button.getBoundingClientRect();
@@ -1675,7 +2139,7 @@ function ColorPickerPlugin() {
     setShowBgColorPicker(!showBgColorPicker);
     setShowTextColorPicker(false);
   }, [showBgColorPicker]);
-  const removeTextColor = useCallback3(() => {
+  const removeTextColor = useCallback4(() => {
     editor.update(() => {
       const selection = $getSelection2();
       if ($isRangeSelection2(selection)) {
@@ -1685,7 +2149,7 @@ function ColorPickerPlugin() {
     setCurrentTextColor("#000000");
     setShowTextColorPicker(false);
   }, [editor]);
-  const removeBgColor = useCallback3(() => {
+  const removeBgColor = useCallback4(() => {
     editor.update(() => {
       const selection = $getSelection2();
       if ($isRangeSelection2(selection)) {
@@ -1695,18 +2159,18 @@ function ColorPickerPlugin() {
     setCurrentBgColor("transparent");
     setShowBgColorPicker(false);
   }, [editor]);
-  return /* @__PURE__ */ jsxs5(Fragment3, { children: [
-    /* @__PURE__ */ jsxs5("div", { className: "cms-color-picker-plugin", ref: textColorRef, children: [
-      /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsxs6(Fragment4, { children: [
+    /* @__PURE__ */ jsxs6("div", { className: "cms-color-picker-plugin", ref: textColorRef, children: [
+      /* @__PURE__ */ jsx6(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleTextColorPicker,
           title: "Text Color",
           type: "button",
-          children: /* @__PURE__ */ jsxs5("div", { className: "cms-color-button-wrapper", children: [
-            /* @__PURE__ */ jsx5(MdFormatColorText, { size: 18 }),
-            /* @__PURE__ */ jsx5(
+          children: /* @__PURE__ */ jsxs6("div", { className: "cms-color-button-wrapper", children: [
+            /* @__PURE__ */ jsx6(MdFormatColorText, { size: 18 }),
+            /* @__PURE__ */ jsx6(
               "div",
               {
                 className: "cms-color-indicator",
@@ -1716,7 +2180,7 @@ function ColorPickerPlugin() {
           ] })
         }
       ),
-      showTextColorPicker && /* @__PURE__ */ jsxs5(
+      showTextColorPicker && /* @__PURE__ */ jsxs6(
         "div",
         {
           className: "cms-color-picker-menu",
@@ -1725,9 +2189,9 @@ function ColorPickerPlugin() {
             left: `${textColorPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsxs5("div", { className: "cms-color-picker-header", children: [
-              /* @__PURE__ */ jsx5("span", { children: "Text Color" }),
-              /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsxs6("div", { className: "cms-color-picker-header", children: [
+              /* @__PURE__ */ jsx6("span", { children: "Text Color" }),
+              /* @__PURE__ */ jsx6(
                 "button",
                 {
                   className: "cms-color-remove-btn",
@@ -1737,7 +2201,7 @@ function ColorPickerPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx5("div", { className: "cms-color-grid", children: PRESET_COLORS.map((color) => /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsx6("div", { className: "cms-color-grid", children: PRESET_COLORS.map((color) => /* @__PURE__ */ jsx6(
               "button",
               {
                 className: `cms-color-swatch ${currentTextColor === color ? "active" : ""}`,
@@ -1748,9 +2212,9 @@ function ColorPickerPlugin() {
               },
               color
             )) }),
-            /* @__PURE__ */ jsx5("div", { className: "cms-color-custom", children: /* @__PURE__ */ jsxs5("label", { children: [
+            /* @__PURE__ */ jsx6("div", { className: "cms-color-custom", children: /* @__PURE__ */ jsxs6("label", { children: [
               "Custom:",
-              /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsx6(
                 "input",
                 {
                   type: "color",
@@ -1764,17 +2228,17 @@ function ColorPickerPlugin() {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs5("div", { className: "cms-color-picker-plugin", ref: bgColorRef, children: [
-      /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsxs6("div", { className: "cms-color-picker-plugin", ref: bgColorRef, children: [
+      /* @__PURE__ */ jsx6(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleBgColorPicker,
           title: "Background Color",
           type: "button",
-          children: /* @__PURE__ */ jsxs5("div", { className: "cms-color-button-wrapper", children: [
-            /* @__PURE__ */ jsx5(MdFormatColorFill, { size: 18 }),
-            /* @__PURE__ */ jsx5(
+          children: /* @__PURE__ */ jsxs6("div", { className: "cms-color-button-wrapper", children: [
+            /* @__PURE__ */ jsx6(MdFormatColorFill, { size: 18 }),
+            /* @__PURE__ */ jsx6(
               "div",
               {
                 className: "cms-color-indicator",
@@ -1784,7 +2248,7 @@ function ColorPickerPlugin() {
           ] })
         }
       ),
-      showBgColorPicker && /* @__PURE__ */ jsxs5(
+      showBgColorPicker && /* @__PURE__ */ jsxs6(
         "div",
         {
           className: "cms-color-picker-menu",
@@ -1793,9 +2257,9 @@ function ColorPickerPlugin() {
             left: `${bgColorPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsxs5("div", { className: "cms-color-picker-header", children: [
-              /* @__PURE__ */ jsx5("span", { children: "Background Color" }),
-              /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsxs6("div", { className: "cms-color-picker-header", children: [
+              /* @__PURE__ */ jsx6("span", { children: "Background Color" }),
+              /* @__PURE__ */ jsx6(
                 "button",
                 {
                   className: "cms-color-remove-btn",
@@ -1805,7 +2269,7 @@ function ColorPickerPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx5("div", { className: "cms-color-grid", children: PRESET_COLORS.map((color) => /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsx6("div", { className: "cms-color-grid", children: PRESET_COLORS.map((color) => /* @__PURE__ */ jsx6(
               "button",
               {
                 className: `cms-color-swatch ${currentBgColor === color ? "active" : ""}`,
@@ -1816,9 +2280,9 @@ function ColorPickerPlugin() {
               },
               color
             )) }),
-            /* @__PURE__ */ jsx5("div", { className: "cms-color-custom", children: /* @__PURE__ */ jsxs5("label", { children: [
+            /* @__PURE__ */ jsx6("div", { className: "cms-color-custom", children: /* @__PURE__ */ jsxs6("label", { children: [
               "Custom:",
-              /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsx6(
                 "input",
                 {
                   type: "color",
@@ -1837,28 +2301,28 @@ function ColorPickerPlugin() {
 
 // src/plugins/SpacingPlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext4 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState6, useCallback as useCallback4, useEffect as useEffect5, useRef as useRef4 } from "react";
+import { useState as useState7, useCallback as useCallback5, useEffect as useEffect6, useRef as useRef5 } from "react";
 import { $getSelection as $getSelection3, $isRangeSelection as $isRangeSelection3, $isTextNode as $isTextNode2 } from "lexical";
 import { $patchStyleText as $patchStyleText2 } from "@lexical/selection";
 import { MdSettings } from "react-icons/md";
 import { TbBoxPadding, TbBoxMargin } from "react-icons/tb";
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 var SPACING_PRESETS = [0, 4, 8, 12, 16, 20, 24, 32, 40, 48];
 function SpacingPlugin() {
   const [editor] = useLexicalComposerContext4();
-  const [showSpacingMenu, setShowSpacingMenu] = useState6(false);
-  const [spacingPosition, setSpacingPosition] = useState6({ top: 0, left: 0 });
-  const spacingRef = useRef4(null);
-  const [display, setDisplay] = useState6("inline");
-  const [paddingTop, setPaddingTop] = useState6(0);
-  const [paddingRight, setPaddingRight] = useState6(0);
-  const [paddingBottom, setPaddingBottom] = useState6(0);
-  const [paddingLeft, setPaddingLeft] = useState6(0);
-  const [marginTop, setMarginTop] = useState6(0);
-  const [marginRight, setMarginRight] = useState6(0);
-  const [marginBottom, setMarginBottom] = useState6(0);
-  const [marginLeft, setMarginLeft] = useState6(0);
-  useEffect5(() => {
+  const [showSpacingMenu, setShowSpacingMenu] = useState7(false);
+  const [spacingPosition, setSpacingPosition] = useState7({ top: 0, left: 0 });
+  const spacingRef = useRef5(null);
+  const [display, setDisplay] = useState7("inline");
+  const [paddingTop, setPaddingTop] = useState7(0);
+  const [paddingRight, setPaddingRight] = useState7(0);
+  const [paddingBottom, setPaddingBottom] = useState7(0);
+  const [paddingLeft, setPaddingLeft] = useState7(0);
+  const [marginTop, setMarginTop] = useState7(0);
+  const [marginRight, setMarginRight] = useState7(0);
+  const [marginBottom, setMarginBottom] = useState7(0);
+  const [marginLeft, setMarginLeft] = useState7(0);
+  useEffect6(() => {
     return editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {
         const selection = $getSelection3();
@@ -1894,7 +2358,7 @@ function SpacingPlugin() {
       });
     });
   }, [editor]);
-  useEffect5(() => {
+  useEffect6(() => {
     const handleClickOutside = (event) => {
       if (spacingRef.current && !spacingRef.current.contains(event.target)) {
         setShowSpacingMenu(false);
@@ -1903,7 +2367,7 @@ function SpacingPlugin() {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  const applyStyles = useCallback4((styles) => {
+  const applyStyles = useCallback5((styles) => {
     editor.update(() => {
       const selection = $getSelection3();
       if ($isRangeSelection3(selection)) {
@@ -1911,11 +2375,11 @@ function SpacingPlugin() {
       }
     });
   }, [editor]);
-  const handleDisplayChange = useCallback4((newDisplay) => {
+  const handleDisplayChange = useCallback5((newDisplay) => {
     applyStyles({ display: newDisplay });
     setDisplay(newDisplay);
   }, [applyStyles]);
-  const handlePaddingChange = useCallback4((side, value) => {
+  const handlePaddingChange = useCallback5((side, value) => {
     const styleKey = `padding-${side}`;
     applyStyles({ [styleKey]: `${value}px` });
     if (side === "top") setPaddingTop(value);
@@ -1923,7 +2387,7 @@ function SpacingPlugin() {
     else if (side === "bottom") setPaddingBottom(value);
     else if (side === "left") setPaddingLeft(value);
   }, [applyStyles]);
-  const handleMarginChange = useCallback4((side, value) => {
+  const handleMarginChange = useCallback5((side, value) => {
     const styleKey = `margin-${side}`;
     applyStyles({ [styleKey]: `${value}px` });
     if (side === "top") setMarginTop(value);
@@ -1931,7 +2395,7 @@ function SpacingPlugin() {
     else if (side === "bottom") setMarginBottom(value);
     else if (side === "left") setMarginLeft(value);
   }, [applyStyles]);
-  const handlePaddingAll = useCallback4((value) => {
+  const handlePaddingAll = useCallback5((value) => {
     applyStyles({
       "padding-top": `${value}px`,
       "padding-right": `${value}px`,
@@ -1943,7 +2407,7 @@ function SpacingPlugin() {
     setPaddingBottom(value);
     setPaddingLeft(value);
   }, [applyStyles]);
-  const handleMarginAll = useCallback4((value) => {
+  const handleMarginAll = useCallback5((value) => {
     applyStyles({
       "margin-top": `${value}px`,
       "margin-right": `${value}px`,
@@ -1955,7 +2419,7 @@ function SpacingPlugin() {
     setMarginBottom(value);
     setMarginLeft(value);
   }, [applyStyles]);
-  const resetSpacing = useCallback4(() => {
+  const resetSpacing = useCallback5(() => {
     applyStyles({
       display: null,
       "padding-top": null,
@@ -1977,7 +2441,7 @@ function SpacingPlugin() {
     setMarginBottom(0);
     setMarginLeft(0);
   }, [applyStyles]);
-  const toggleSpacingMenu = useCallback4((event) => {
+  const toggleSpacingMenu = useCallback5((event) => {
     if (!showSpacingMenu) {
       const button = event.currentTarget;
       const rect = button.getBoundingClientRect();
@@ -1988,18 +2452,18 @@ function SpacingPlugin() {
     }
     setShowSpacingMenu(!showSpacingMenu);
   }, [showSpacingMenu]);
-  return /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-plugin", ref: spacingRef, children: [
-    /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-plugin", ref: spacingRef, children: [
+    /* @__PURE__ */ jsx7(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: toggleSpacingMenu,
         title: "Spacing & Display",
         type: "button",
-        children: /* @__PURE__ */ jsx6(MdSettings, { size: 18 })
+        children: /* @__PURE__ */ jsx7(MdSettings, { size: 18 })
       }
     ),
-    showSpacingMenu && /* @__PURE__ */ jsxs6(
+    showSpacingMenu && /* @__PURE__ */ jsxs7(
       "div",
       {
         className: "cms-spacing-menu",
@@ -2008,9 +2472,9 @@ function SpacingPlugin() {
           left: `${spacingPosition.left}px`
         },
         children: [
-          /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-header", children: [
-            /* @__PURE__ */ jsx6("span", { children: "Spacing & Display" }),
-            /* @__PURE__ */ jsx6(
+          /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-header", children: [
+            /* @__PURE__ */ jsx7("span", { children: "Spacing & Display" }),
+            /* @__PURE__ */ jsx7(
               "button",
               {
                 className: "cms-spacing-reset-btn",
@@ -2020,10 +2484,10 @@ function SpacingPlugin() {
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-section", children: [
-            /* @__PURE__ */ jsx6("div", { className: "cms-spacing-label", children: "Display Mode" }),
-            /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-display-buttons", children: [
-              /* @__PURE__ */ jsx6(
+          /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-section", children: [
+            /* @__PURE__ */ jsx7("div", { className: "cms-spacing-label", children: "Display Mode" }),
+            /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-display-buttons", children: [
+              /* @__PURE__ */ jsx7(
                 "button",
                 {
                   className: `cms-spacing-display-btn ${display === "inline" ? "active" : ""}`,
@@ -2032,7 +2496,7 @@ function SpacingPlugin() {
                   children: "Inline"
                 }
               ),
-              /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsx7(
                 "button",
                 {
                   className: `cms-spacing-display-btn ${display === "inline-block" ? "active" : ""}`,
@@ -2041,7 +2505,7 @@ function SpacingPlugin() {
                   children: "Inline Block"
                 }
               ),
-              /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsx7(
                 "button",
                 {
                   className: `cms-spacing-display-btn ${display === "block" ? "active" : ""}`,
@@ -2052,12 +2516,12 @@ function SpacingPlugin() {
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-section", children: [
-            /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-label", children: [
-              /* @__PURE__ */ jsx6(TbBoxPadding, { size: 16 }),
-              /* @__PURE__ */ jsx6("span", { children: "Padding (px)" })
+          /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-section", children: [
+            /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-label", children: [
+              /* @__PURE__ */ jsx7(TbBoxPadding, { size: 16 }),
+              /* @__PURE__ */ jsx7("span", { children: "Padding (px)" })
             ] }),
-            /* @__PURE__ */ jsx6("div", { className: "cms-spacing-quick-buttons", children: SPACING_PRESETS.map((value) => /* @__PURE__ */ jsx6(
+            /* @__PURE__ */ jsx7("div", { className: "cms-spacing-quick-buttons", children: SPACING_PRESETS.map((value) => /* @__PURE__ */ jsx7(
               "button",
               {
                 className: "cms-spacing-quick-btn",
@@ -2067,10 +2531,10 @@ function SpacingPlugin() {
               },
               `padding-${value}`
             )) }),
-            /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-controls", children: [
-              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx6("label", { children: "Top" }),
-                /* @__PURE__ */ jsx6(
+            /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-controls", children: [
+              /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx7("label", { children: "Top" }),
+                /* @__PURE__ */ jsx7(
                   "input",
                   {
                     type: "number",
@@ -2081,9 +2545,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx6("label", { children: "Right" }),
-                /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx7("label", { children: "Right" }),
+                /* @__PURE__ */ jsx7(
                   "input",
                   {
                     type: "number",
@@ -2094,9 +2558,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx6("label", { children: "Bottom" }),
-                /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx7("label", { children: "Bottom" }),
+                /* @__PURE__ */ jsx7(
                   "input",
                   {
                     type: "number",
@@ -2107,9 +2571,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx6("label", { children: "Left" }),
-                /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx7("label", { children: "Left" }),
+                /* @__PURE__ */ jsx7(
                   "input",
                   {
                     type: "number",
@@ -2122,12 +2586,12 @@ function SpacingPlugin() {
               ] })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-section", children: [
-            /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-label", children: [
-              /* @__PURE__ */ jsx6(TbBoxMargin, { size: 16 }),
-              /* @__PURE__ */ jsx6("span", { children: "Margin (px)" })
+          /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-section", children: [
+            /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-label", children: [
+              /* @__PURE__ */ jsx7(TbBoxMargin, { size: 16 }),
+              /* @__PURE__ */ jsx7("span", { children: "Margin (px)" })
             ] }),
-            /* @__PURE__ */ jsx6("div", { className: "cms-spacing-quick-buttons", children: SPACING_PRESETS.map((value) => /* @__PURE__ */ jsx6(
+            /* @__PURE__ */ jsx7("div", { className: "cms-spacing-quick-buttons", children: SPACING_PRESETS.map((value) => /* @__PURE__ */ jsx7(
               "button",
               {
                 className: "cms-spacing-quick-btn",
@@ -2137,10 +2601,10 @@ function SpacingPlugin() {
               },
               `margin-${value}`
             )) }),
-            /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-controls", children: [
-              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx6("label", { children: "Top" }),
-                /* @__PURE__ */ jsx6(
+            /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-controls", children: [
+              /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx7("label", { children: "Top" }),
+                /* @__PURE__ */ jsx7(
                   "input",
                   {
                     type: "number",
@@ -2151,9 +2615,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx6("label", { children: "Right" }),
-                /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx7("label", { children: "Right" }),
+                /* @__PURE__ */ jsx7(
                   "input",
                   {
                     type: "number",
@@ -2164,9 +2628,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx6("label", { children: "Bottom" }),
-                /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx7("label", { children: "Bottom" }),
+                /* @__PURE__ */ jsx7(
                   "input",
                   {
                     type: "number",
@@ -2177,9 +2641,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx6("label", { children: "Left" }),
-                /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsxs7("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx7("label", { children: "Left" }),
+                /* @__PURE__ */ jsx7(
                   "input",
                   {
                     type: "number",
@@ -2200,7 +2664,7 @@ function SpacingPlugin() {
 
 // src/plugins/ExportImportPlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext5 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState7, useCallback as useCallback5, useRef as useRef5, useEffect as useEffect6 } from "react";
+import { useState as useState8, useCallback as useCallback6, useRef as useRef6, useEffect as useEffect7 } from "react";
 import { MdFileDownload, MdFileUpload } from "react-icons/md";
 
 // src/utils/htmlExport.ts
@@ -2672,19 +3136,19 @@ async function pasteMarkdownFromClipboard(editor) {
 }
 
 // src/plugins/ExportImportPlugin.tsx
-import { Fragment as Fragment4, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 function ExportImportPlugin() {
   const [editor] = useLexicalComposerContext5();
-  const [showExportMenu, setShowExportMenu] = useState7(false);
-  const [showImportMenu, setShowImportMenu] = useState7(false);
-  const [exportPosition, setExportPosition] = useState7({ top: 0, left: 0 });
-  const [importPosition, setImportPosition] = useState7({ top: 0, left: 0 });
-  const [notification, setNotification] = useState7(null);
-  const exportRef = useRef5(null);
-  const importRef = useRef5(null);
-  const fileInputRef = useRef5(null);
-  const [importType, setImportType] = useState7("html");
-  useEffect6(() => {
+  const [showExportMenu, setShowExportMenu] = useState8(false);
+  const [showImportMenu, setShowImportMenu] = useState8(false);
+  const [exportPosition, setExportPosition] = useState8({ top: 0, left: 0 });
+  const [importPosition, setImportPosition] = useState8({ top: 0, left: 0 });
+  const [notification, setNotification] = useState8(null);
+  const exportRef = useRef6(null);
+  const importRef = useRef6(null);
+  const fileInputRef = useRef6(null);
+  const [importType, setImportType] = useState8("html");
+  useEffect7(() => {
     const handleClickOutside = (event) => {
       if (exportRef.current && !exportRef.current.contains(event.target)) {
         setShowExportMenu(false);
@@ -2696,7 +3160,7 @@ function ExportImportPlugin() {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  useEffect6(() => {
+  useEffect7(() => {
     if (notification) {
       const timer = setTimeout(() => setNotification(null), 3e3);
       return () => clearTimeout(timer);
@@ -2705,7 +3169,7 @@ function ExportImportPlugin() {
   const showNotification = (message) => {
     setNotification(message);
   };
-  const toggleExportMenu = useCallback5((event) => {
+  const toggleExportMenu = useCallback6((event) => {
     if (!showExportMenu) {
       const button = event.currentTarget;
       const rect = button.getBoundingClientRect();
@@ -2717,7 +3181,7 @@ function ExportImportPlugin() {
     setShowExportMenu(!showExportMenu);
     setShowImportMenu(false);
   }, [showExportMenu]);
-  const toggleImportMenu = useCallback5((event) => {
+  const toggleImportMenu = useCallback6((event) => {
     if (!showImportMenu) {
       const button = event.currentTarget;
       const rect = button.getBoundingClientRect();
@@ -2729,22 +3193,22 @@ function ExportImportPlugin() {
     setShowImportMenu(!showImportMenu);
     setShowExportMenu(false);
   }, [showImportMenu]);
-  const handleExportHTML = useCallback5(() => {
+  const handleExportHTML = useCallback6(() => {
     downloadHTML(editor, "content.html", { includeStyles: false });
     setShowExportMenu(false);
     showNotification("HTML exported successfully!");
   }, [editor]);
-  const handleExportHTMLWithStyles = useCallback5(() => {
+  const handleExportHTMLWithStyles = useCallback6(() => {
     downloadHTML(editor, "content.html", { includeStyles: true });
     setShowExportMenu(false);
     showNotification("HTML with styles exported!");
   }, [editor]);
-  const handleExportMarkdown = useCallback5(() => {
+  const handleExportMarkdown = useCallback6(() => {
     downloadMarkdown(editor, "content.md");
     setShowExportMenu(false);
     showNotification("Markdown exported successfully!");
   }, [editor]);
-  const handleCopyHTML = useCallback5(async () => {
+  const handleCopyHTML = useCallback6(async () => {
     const html = exportToHTML(editor);
     try {
       await navigator.clipboard.writeText(html);
@@ -2754,15 +3218,15 @@ function ExportImportPlugin() {
       showNotification("Failed to copy HTML");
     }
   }, [editor]);
-  const handleCopyMarkdown = useCallback5(async () => {
+  const handleCopyMarkdown = useCallback6(async () => {
     const success = await copyMarkdownToClipboard(editor);
     setShowExportMenu(false);
     showNotification(success ? "Markdown copied to clipboard!" : "Failed to copy Markdown");
   }, [editor]);
-  const handleImportFile = useCallback5(() => {
+  const handleImportFile = useCallback6(() => {
     fileInputRef.current?.click();
   }, []);
-  const handleFileChange = useCallback5((event) => {
+  const handleFileChange = useCallback6((event) => {
     const file = event.target.files?.[0];
     if (!file) return;
     if (importType === "html") {
@@ -2792,7 +3256,7 @@ function ExportImportPlugin() {
     }
     event.target.value = "";
   }, [editor, importType]);
-  const handlePasteHTML = useCallback5(async () => {
+  const handlePasteHTML = useCallback6(async () => {
     try {
       const html = await navigator.clipboard.readText();
       importFromHTML(editor, html);
@@ -2802,7 +3266,7 @@ function ExportImportPlugin() {
       showNotification("Failed to paste HTML");
     }
   }, [editor]);
-  const handlePasteMarkdown = useCallback5(async () => {
+  const handlePasteMarkdown = useCallback6(async () => {
     try {
       const markdown = await navigator.clipboard.readText();
       importFromMarkdown(editor, markdown);
@@ -2812,19 +3276,19 @@ function ExportImportPlugin() {
       showNotification("Failed to paste Markdown");
     }
   }, [editor]);
-  return /* @__PURE__ */ jsxs7(Fragment4, { children: [
-    /* @__PURE__ */ jsxs7("div", { className: "cms-export-import-plugin", ref: exportRef, children: [
-      /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsxs8(Fragment5, { children: [
+    /* @__PURE__ */ jsxs8("div", { className: "cms-export-import-plugin", ref: exportRef, children: [
+      /* @__PURE__ */ jsx8(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleExportMenu,
           title: "Export Content",
           type: "button",
-          children: /* @__PURE__ */ jsx7(MdFileDownload, { size: 18 })
+          children: /* @__PURE__ */ jsx8(MdFileDownload, { size: 18 })
         }
       ),
-      showExportMenu && /* @__PURE__ */ jsxs7(
+      showExportMenu && /* @__PURE__ */ jsxs8(
         "div",
         {
           className: "cms-export-import-menu",
@@ -2833,79 +3297,79 @@ function ExportImportPlugin() {
             left: `${exportPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsx7("div", { className: "cms-export-import-header", children: "Export Content" }),
-            /* @__PURE__ */ jsxs7(
+            /* @__PURE__ */ jsx8("div", { className: "cms-export-import-header", children: "Export Content" }),
+            /* @__PURE__ */ jsxs8(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleExportHTML,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx7("span", { className: "cms-export-import-icon", children: "\u{1F4C4}" }),
-                  /* @__PURE__ */ jsxs7("div", { children: [
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-title", children: "HTML" }),
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-desc", children: "Download as HTML file" })
+                  /* @__PURE__ */ jsx8("span", { className: "cms-export-import-icon", children: "\u{1F4C4}" }),
+                  /* @__PURE__ */ jsxs8("div", { children: [
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-title", children: "HTML" }),
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-desc", children: "Download as HTML file" })
                   ] })
                 ]
               }
             ),
-            /* @__PURE__ */ jsxs7(
+            /* @__PURE__ */ jsxs8(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleExportHTMLWithStyles,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx7("span", { className: "cms-export-import-icon", children: "\u{1F3A8}" }),
-                  /* @__PURE__ */ jsxs7("div", { children: [
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-title", children: "HTML + Styles" }),
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-desc", children: "Complete HTML document" })
+                  /* @__PURE__ */ jsx8("span", { className: "cms-export-import-icon", children: "\u{1F3A8}" }),
+                  /* @__PURE__ */ jsxs8("div", { children: [
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-title", children: "HTML + Styles" }),
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-desc", children: "Complete HTML document" })
                   ] })
                 ]
               }
             ),
-            /* @__PURE__ */ jsxs7(
+            /* @__PURE__ */ jsxs8(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleExportMarkdown,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx7("span", { className: "cms-export-import-icon", children: "\u{1F4DD}" }),
-                  /* @__PURE__ */ jsxs7("div", { children: [
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-title", children: "Markdown" }),
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-desc", children: "Download as .md file" })
+                  /* @__PURE__ */ jsx8("span", { className: "cms-export-import-icon", children: "\u{1F4DD}" }),
+                  /* @__PURE__ */ jsxs8("div", { children: [
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-title", children: "Markdown" }),
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-desc", children: "Download as .md file" })
                   ] })
                 ]
               }
             ),
-            /* @__PURE__ */ jsx7("div", { className: "cms-export-import-divider" }),
-            /* @__PURE__ */ jsxs7(
+            /* @__PURE__ */ jsx8("div", { className: "cms-export-import-divider" }),
+            /* @__PURE__ */ jsxs8(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleCopyHTML,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx7("span", { className: "cms-export-import-icon", children: "\u{1F4CB}" }),
-                  /* @__PURE__ */ jsxs7("div", { children: [
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-title", children: "Copy HTML" }),
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-desc", children: "Copy to clipboard" })
+                  /* @__PURE__ */ jsx8("span", { className: "cms-export-import-icon", children: "\u{1F4CB}" }),
+                  /* @__PURE__ */ jsxs8("div", { children: [
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-title", children: "Copy HTML" }),
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-desc", children: "Copy to clipboard" })
                   ] })
                 ]
               }
             ),
-            /* @__PURE__ */ jsxs7(
+            /* @__PURE__ */ jsxs8(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleCopyMarkdown,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx7("span", { className: "cms-export-import-icon", children: "\u{1F4CB}" }),
-                  /* @__PURE__ */ jsxs7("div", { children: [
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-title", children: "Copy Markdown" }),
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-desc", children: "Copy to clipboard" })
+                  /* @__PURE__ */ jsx8("span", { className: "cms-export-import-icon", children: "\u{1F4CB}" }),
+                  /* @__PURE__ */ jsxs8("div", { children: [
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-title", children: "Copy Markdown" }),
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-desc", children: "Copy to clipboard" })
                   ] })
                 ]
               }
@@ -2914,18 +3378,18 @@ function ExportImportPlugin() {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs7("div", { className: "cms-export-import-plugin", ref: importRef, children: [
-      /* @__PURE__ */ jsx7(
+    /* @__PURE__ */ jsxs8("div", { className: "cms-export-import-plugin", ref: importRef, children: [
+      /* @__PURE__ */ jsx8(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleImportMenu,
           title: "Import Content",
           type: "button",
-          children: /* @__PURE__ */ jsx7(MdFileUpload, { size: 18 })
+          children: /* @__PURE__ */ jsx8(MdFileUpload, { size: 18 })
         }
       ),
-      showImportMenu && /* @__PURE__ */ jsxs7(
+      showImportMenu && /* @__PURE__ */ jsxs8(
         "div",
         {
           className: "cms-export-import-menu",
@@ -2934,9 +3398,9 @@ function ExportImportPlugin() {
             left: `${importPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsx7("div", { className: "cms-export-import-header", children: "Import Content" }),
-            /* @__PURE__ */ jsxs7("div", { className: "cms-import-type-selector", children: [
-              /* @__PURE__ */ jsx7(
+            /* @__PURE__ */ jsx8("div", { className: "cms-export-import-header", children: "Import Content" }),
+            /* @__PURE__ */ jsxs8("div", { className: "cms-import-type-selector", children: [
+              /* @__PURE__ */ jsx8(
                 "button",
                 {
                   className: `cms-import-type-btn ${importType === "html" ? "active" : ""}`,
@@ -2945,7 +3409,7 @@ function ExportImportPlugin() {
                   children: "HTML"
                 }
               ),
-              /* @__PURE__ */ jsx7(
+              /* @__PURE__ */ jsx8(
                 "button",
                 {
                   className: `cms-import-type-btn ${importType === "markdown" ? "active" : ""}`,
@@ -2955,17 +3419,17 @@ function ExportImportPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs7(
+            /* @__PURE__ */ jsxs8(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleImportFile,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx7("span", { className: "cms-export-import-icon", children: "\u{1F4C1}" }),
-                  /* @__PURE__ */ jsxs7("div", { children: [
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-title", children: "From File" }),
-                    /* @__PURE__ */ jsxs7("div", { className: "cms-export-import-desc", children: [
+                  /* @__PURE__ */ jsx8("span", { className: "cms-export-import-icon", children: "\u{1F4C1}" }),
+                  /* @__PURE__ */ jsxs8("div", { children: [
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-title", children: "From File" }),
+                    /* @__PURE__ */ jsxs8("div", { className: "cms-export-import-desc", children: [
                       "Upload ",
                       importType.toUpperCase(),
                       " file"
@@ -2974,17 +3438,17 @@ function ExportImportPlugin() {
                 ]
               }
             ),
-            /* @__PURE__ */ jsxs7(
+            /* @__PURE__ */ jsxs8(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: importType === "html" ? handlePasteHTML : handlePasteMarkdown,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx7("span", { className: "cms-export-import-icon", children: "\u{1F4CB}" }),
-                  /* @__PURE__ */ jsxs7("div", { children: [
-                    /* @__PURE__ */ jsx7("div", { className: "cms-export-import-title", children: "From Clipboard" }),
-                    /* @__PURE__ */ jsxs7("div", { className: "cms-export-import-desc", children: [
+                  /* @__PURE__ */ jsx8("span", { className: "cms-export-import-icon", children: "\u{1F4CB}" }),
+                  /* @__PURE__ */ jsxs8("div", { children: [
+                    /* @__PURE__ */ jsx8("div", { className: "cms-export-import-title", children: "From Clipboard" }),
+                    /* @__PURE__ */ jsxs8("div", { className: "cms-export-import-desc", children: [
                       "Paste ",
                       importType.toUpperCase()
                     ] })
@@ -2995,7 +3459,7 @@ function ExportImportPlugin() {
           ]
         }
       ),
-      /* @__PURE__ */ jsx7(
+      /* @__PURE__ */ jsx8(
         "input",
         {
           ref: fileInputRef,
@@ -3006,13 +3470,13 @@ function ExportImportPlugin() {
         }
       )
     ] }),
-    notification && /* @__PURE__ */ jsx7("div", { className: "cms-export-import-notification", children: notification })
+    notification && /* @__PURE__ */ jsx8("div", { className: "cms-export-import-notification", children: notification })
   ] });
 }
 
 // src/plugins/SectionCreatorPlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext6 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState8, useCallback as useCallback6, useRef as useRef6, useEffect as useEffect7 } from "react";
+import { useState as useState9, useCallback as useCallback7, useRef as useRef7, useEffect as useEffect8 } from "react";
 import { $getSelection as $getSelection4, $isRangeSelection as $isRangeSelection4, $createParagraphNode as $createParagraphNode3 } from "lexical";
 
 // src/blocks/SectionNode.tsx
@@ -3593,13 +4057,13 @@ var SECTION_TEMPLATES = [
 // src/plugins/SectionCreatorPlugin.tsx
 import { $generateNodesFromDOM as $generateNodesFromDOM2 } from "@lexical/html";
 import { MdViewModule } from "react-icons/md";
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 function SectionCreatorPlugin() {
   const [editor] = useLexicalComposerContext6();
-  const [showSectionMenu, setShowSectionMenu] = useState8(false);
-  const [sectionPosition, setSectionPosition] = useState8({ top: 0, left: 0 });
-  const sectionRef = useRef6(null);
-  useEffect7(() => {
+  const [showSectionMenu, setShowSectionMenu] = useState9(false);
+  const [sectionPosition, setSectionPosition] = useState9({ top: 0, left: 0 });
+  const sectionRef = useRef7(null);
+  useEffect8(() => {
     const handleClickOutside = (event) => {
       if (sectionRef.current && !sectionRef.current.contains(event.target)) {
         setShowSectionMenu(false);
@@ -3608,7 +4072,7 @@ function SectionCreatorPlugin() {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  const toggleSectionMenu = useCallback6((event) => {
+  const toggleSectionMenu = useCallback7((event) => {
     if (!showSectionMenu) {
       const button = event.currentTarget;
       const rect = button.getBoundingClientRect();
@@ -3619,7 +4083,7 @@ function SectionCreatorPlugin() {
     }
     setShowSectionMenu(!showSectionMenu);
   }, [showSectionMenu]);
-  const insertSection = useCallback6((template) => {
+  const insertSection = useCallback7((template) => {
     editor.update(() => {
       const selection = $getSelection4();
       if ($isRangeSelection4(selection)) {
@@ -3642,18 +4106,18 @@ function SectionCreatorPlugin() {
     });
     setShowSectionMenu(false);
   }, [editor]);
-  return /* @__PURE__ */ jsxs8("div", { className: "cms-section-creator-plugin", ref: sectionRef, children: [
-    /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsxs9("div", { className: "cms-section-creator-plugin", ref: sectionRef, children: [
+    /* @__PURE__ */ jsx9(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: toggleSectionMenu,
         title: "Insert Section",
         type: "button",
-        children: /* @__PURE__ */ jsx8(MdViewModule, { size: 18 })
+        children: /* @__PURE__ */ jsx9(MdViewModule, { size: 18 })
       }
     ),
-    showSectionMenu && /* @__PURE__ */ jsxs8(
+    showSectionMenu && /* @__PURE__ */ jsxs9(
       "div",
       {
         className: "cms-section-menu",
@@ -3662,24 +4126,24 @@ function SectionCreatorPlugin() {
           left: `${sectionPosition.left}px`
         },
         children: [
-          /* @__PURE__ */ jsx8("div", { className: "cms-section-menu-header", children: /* @__PURE__ */ jsx8("span", { children: "Insert Section" }) }),
-          /* @__PURE__ */ jsx8("div", { className: "cms-section-grid", children: SECTION_TEMPLATES.map((template) => /* @__PURE__ */ jsxs8(
+          /* @__PURE__ */ jsx9("div", { className: "cms-section-menu-header", children: /* @__PURE__ */ jsx9("span", { children: "Insert Section" }) }),
+          /* @__PURE__ */ jsx9("div", { className: "cms-section-grid", children: SECTION_TEMPLATES.map((template) => /* @__PURE__ */ jsxs9(
             "button",
             {
               className: "cms-section-card",
               onClick: () => insertSection(template),
               type: "button",
               children: [
-                /* @__PURE__ */ jsx8("div", { className: "cms-section-card-icon", children: template.icon }),
-                /* @__PURE__ */ jsxs8("div", { className: "cms-section-card-content", children: [
-                  /* @__PURE__ */ jsx8("div", { className: "cms-section-card-title", children: template.name }),
-                  /* @__PURE__ */ jsx8("div", { className: "cms-section-card-desc", children: template.description })
+                /* @__PURE__ */ jsx9("div", { className: "cms-section-card-icon", children: template.icon }),
+                /* @__PURE__ */ jsxs9("div", { className: "cms-section-card-content", children: [
+                  /* @__PURE__ */ jsx9("div", { className: "cms-section-card-title", children: template.name }),
+                  /* @__PURE__ */ jsx9("div", { className: "cms-section-card-desc", children: template.description })
                 ] })
               ]
             },
             template.type
           )) }),
-          /* @__PURE__ */ jsx8("div", { className: "cms-section-menu-footer", children: /* @__PURE__ */ jsx8("p", { children: "\u{1F4A1} Tip: Sections are fully editable after insertion" }) })
+          /* @__PURE__ */ jsx9("div", { className: "cms-section-menu-footer", children: /* @__PURE__ */ jsx9("p", { children: "\u{1F4A1} Tip: Sections are fully editable after insertion" }) })
         ]
       }
     )
@@ -3688,21 +4152,21 @@ function SectionCreatorPlugin() {
 
 // src/plugins/TablePlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext7 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState9, useCallback as useCallback7, useRef as useRef7, useEffect as useEffect8 } from "react";
+import { useState as useState10, useCallback as useCallback8, useRef as useRef8, useEffect as useEffect9 } from "react";
 import { $getSelection as $getSelection5, $isRangeSelection as $isRangeSelection5, $createParagraphNode as $createParagraphNode4 } from "lexical";
 import {
   $createTableNodeWithDimensions
 } from "@lexical/table";
 import { MdTableChart } from "react-icons/md";
-import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 function TablePlugin() {
   const [editor] = useLexicalComposerContext7();
-  const [showModal, setShowModal] = useState9(false);
-  const [rows, setRows] = useState9(3);
-  const [columns, setColumns] = useState9(3);
-  const [includeHeaders, setIncludeHeaders] = useState9(true);
-  const modalRef = useRef7(null);
-  useEffect8(() => {
+  const [showModal, setShowModal] = useState10(false);
+  const [rows, setRows] = useState10(3);
+  const [columns, setColumns] = useState10(3);
+  const [includeHeaders, setIncludeHeaders] = useState10(true);
+  const modalRef = useRef8(null);
+  useEffect9(() => {
     const handleClickOutside = (event) => {
       if (modalRef.current && !modalRef.current.contains(event.target)) {
         setShowModal(false);
@@ -3711,13 +4175,13 @@ function TablePlugin() {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  const openModal = useCallback7(() => {
+  const openModal = useCallback8(() => {
     setShowModal(true);
     setRows(3);
     setColumns(3);
     setIncludeHeaders(true);
   }, []);
-  const insertTable = useCallback7(() => {
+  const insertTable = useCallback8(() => {
     editor.update(() => {
       const selection = $getSelection5();
       if ($isRangeSelection5(selection)) {
@@ -3733,7 +4197,7 @@ function TablePlugin() {
     });
     setShowModal(false);
   }, [editor, rows, columns, includeHeaders]);
-  const handleKeyDown = useCallback7((e) => {
+  const handleKeyDown = useCallback8((e) => {
     if (e.key === "Enter") {
       e.preventDefault();
       insertTable();
@@ -3741,31 +4205,31 @@ function TablePlugin() {
       setShowModal(false);
     }
   }, [insertTable]);
-  return /* @__PURE__ */ jsxs9("div", { className: "cms-table-plugin", ref: modalRef, children: [
-    /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsxs10("div", { className: "cms-table-plugin", ref: modalRef, children: [
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: openModal,
         title: "Insert Table",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdTableChart, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdTableChart, { size: 18 })
       }
     ),
-    showModal && /* @__PURE__ */ jsxs9(Fragment5, { children: [
-      /* @__PURE__ */ jsx9("div", { className: "cms-modal-backdrop", onClick: () => setShowModal(false) }),
-      /* @__PURE__ */ jsxs9("div", { className: "cms-table-modal", children: [
-        /* @__PURE__ */ jsx9("div", { className: "cms-table-modal-header", children: /* @__PURE__ */ jsx9("span", { children: "Insert Table" }) }),
-        /* @__PURE__ */ jsxs9("div", { className: "cms-table-modal-content", children: [
-          /* @__PURE__ */ jsxs9("div", { className: "cms-table-preview", children: [
-            /* @__PURE__ */ jsx9("div", { className: "cms-table-preview-grid", children: Array.from({ length: rows }).map((_, rowIndex) => /* @__PURE__ */ jsx9("div", { className: "cms-table-preview-row", children: Array.from({ length: columns }).map((_2, colIndex) => /* @__PURE__ */ jsx9(
+    showModal && /* @__PURE__ */ jsxs10(Fragment6, { children: [
+      /* @__PURE__ */ jsx10("div", { className: "cms-modal-backdrop", onClick: () => setShowModal(false) }),
+      /* @__PURE__ */ jsxs10("div", { className: "cms-table-modal", children: [
+        /* @__PURE__ */ jsx10("div", { className: "cms-table-modal-header", children: /* @__PURE__ */ jsx10("span", { children: "Insert Table" }) }),
+        /* @__PURE__ */ jsxs10("div", { className: "cms-table-modal-content", children: [
+          /* @__PURE__ */ jsxs10("div", { className: "cms-table-preview", children: [
+            /* @__PURE__ */ jsx10("div", { className: "cms-table-preview-grid", children: Array.from({ length: rows }).map((_, rowIndex) => /* @__PURE__ */ jsx10("div", { className: "cms-table-preview-row", children: Array.from({ length: columns }).map((_2, colIndex) => /* @__PURE__ */ jsx10(
               "div",
               {
                 className: `cms-table-preview-cell ${includeHeaders && rowIndex === 0 ? "header" : ""}`
               },
               colIndex
             )) }, rowIndex)) }),
-            /* @__PURE__ */ jsxs9("div", { className: "cms-table-preview-label", children: [
+            /* @__PURE__ */ jsxs10("div", { className: "cms-table-preview-label", children: [
               rows,
               " \xD7 ",
               columns,
@@ -3773,10 +4237,10 @@ function TablePlugin() {
               includeHeaders ? "(with headers)" : ""
             ] })
           ] }),
-          /* @__PURE__ */ jsxs9("div", { className: "cms-form-group", children: [
-            /* @__PURE__ */ jsx9("label", { htmlFor: "table-rows", children: "Rows" }),
-            /* @__PURE__ */ jsxs9("div", { className: "cms-number-input-group", children: [
-              /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsxs10("div", { className: "cms-form-group", children: [
+            /* @__PURE__ */ jsx10("label", { htmlFor: "table-rows", children: "Rows" }),
+            /* @__PURE__ */ jsxs10("div", { className: "cms-number-input-group", children: [
+              /* @__PURE__ */ jsx10(
                 "button",
                 {
                   onClick: () => setRows(Math.max(1, rows - 1)),
@@ -3785,7 +4249,7 @@ function TablePlugin() {
                   children: "\u2212"
                 }
               ),
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "input",
                 {
                   id: "table-rows",
@@ -3798,7 +4262,7 @@ function TablePlugin() {
                   className: "cms-number-input"
                 }
               ),
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "button",
                 {
                   onClick: () => setRows(Math.min(20, rows + 1)),
@@ -3809,10 +4273,10 @@ function TablePlugin() {
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxs9("div", { className: "cms-form-group", children: [
-            /* @__PURE__ */ jsx9("label", { htmlFor: "table-columns", children: "Columns" }),
-            /* @__PURE__ */ jsxs9("div", { className: "cms-number-input-group", children: [
-              /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsxs10("div", { className: "cms-form-group", children: [
+            /* @__PURE__ */ jsx10("label", { htmlFor: "table-columns", children: "Columns" }),
+            /* @__PURE__ */ jsxs10("div", { className: "cms-number-input-group", children: [
+              /* @__PURE__ */ jsx10(
                 "button",
                 {
                   onClick: () => setColumns(Math.max(1, columns - 1)),
@@ -3821,7 +4285,7 @@ function TablePlugin() {
                   children: "\u2212"
                 }
               ),
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "input",
                 {
                   id: "table-columns",
@@ -3834,7 +4298,7 @@ function TablePlugin() {
                   className: "cms-number-input"
                 }
               ),
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "button",
                 {
                   onClick: () => setColumns(Math.min(10, columns + 1)),
@@ -3845,8 +4309,8 @@ function TablePlugin() {
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsx9("div", { className: "cms-form-group", children: /* @__PURE__ */ jsxs9("label", { className: "cms-checkbox-label", children: [
-            /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsx10("div", { className: "cms-form-group", children: /* @__PURE__ */ jsxs10("label", { className: "cms-checkbox-label", children: [
+            /* @__PURE__ */ jsx10(
               "input",
               {
                 type: "checkbox",
@@ -3855,12 +4319,12 @@ function TablePlugin() {
                 className: "cms-checkbox"
               }
             ),
-            /* @__PURE__ */ jsx9("span", { children: "Include header row" })
+            /* @__PURE__ */ jsx10("span", { children: "Include header row" })
           ] }) }),
-          /* @__PURE__ */ jsxs9("div", { className: "cms-table-presets", children: [
-            /* @__PURE__ */ jsx9("p", { className: "cms-table-presets-title", children: "Quick Presets:" }),
-            /* @__PURE__ */ jsxs9("div", { className: "cms-table-preset-buttons", children: [
-              /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsxs10("div", { className: "cms-table-presets", children: [
+            /* @__PURE__ */ jsx10("p", { className: "cms-table-presets-title", children: "Quick Presets:" }),
+            /* @__PURE__ */ jsxs10("div", { className: "cms-table-preset-buttons", children: [
+              /* @__PURE__ */ jsx10(
                 "button",
                 {
                   onClick: () => {
@@ -3873,7 +4337,7 @@ function TablePlugin() {
                   children: "3\xD73"
                 }
               ),
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "button",
                 {
                   onClick: () => {
@@ -3886,7 +4350,7 @@ function TablePlugin() {
                   children: "5\xD73"
                 }
               ),
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "button",
                 {
                   onClick: () => {
@@ -3899,7 +4363,7 @@ function TablePlugin() {
                   children: "4\xD74"
                 }
               ),
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "button",
                 {
                   onClick: () => {
@@ -3914,8 +4378,8 @@ function TablePlugin() {
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxs9("div", { className: "cms-modal-actions", children: [
-            /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsxs10("div", { className: "cms-modal-actions", children: [
+            /* @__PURE__ */ jsx10(
               "button",
               {
                 onClick: () => setShowModal(false),
@@ -3924,7 +4388,7 @@ function TablePlugin() {
                 children: "Cancel"
               }
             ),
-            /* @__PURE__ */ jsx9(
+            /* @__PURE__ */ jsx10(
               "button",
               {
                 onClick: insertTable,
@@ -3941,7 +4405,7 @@ function TablePlugin() {
 }
 
 // src/plugins/ToolbarPlugin.tsx
-import { useState as useState10, useCallback as useCallback8, useEffect as useEffect9 } from "react";
+import { useState as useState11, useCallback as useCallback9, useEffect as useEffect10 } from "react";
 import {
   MdUndo,
   MdRedo,
@@ -3970,18 +4434,18 @@ import {
   LuHeading2,
   LuHeading3
 } from "react-icons/lu";
-import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 function ToolbarPlugin() {
   const [editor] = useLexicalComposerContext8();
-  const [isBold, setIsBold] = useState10(false);
-  const [isItalic, setIsItalic] = useState10(false);
-  const [isUnderline, setIsUnderline] = useState10(false);
-  const [isStrikethrough, setIsStrikethrough] = useState10(false);
-  const [isCode, setIsCode] = useState10(false);
-  const [blockType, setBlockType] = useState10("paragraph");
-  const [showLayoutMenu, setShowLayoutMenu] = useState10(false);
-  const [layoutMenuPosition, setLayoutMenuPosition] = useState10({ top: 0, left: 0 });
-  useEffect9(() => {
+  const [isBold, setIsBold] = useState11(false);
+  const [isItalic, setIsItalic] = useState11(false);
+  const [isUnderline, setIsUnderline] = useState11(false);
+  const [isStrikethrough, setIsStrikethrough] = useState11(false);
+  const [isCode, setIsCode] = useState11(false);
+  const [blockType, setBlockType] = useState11("paragraph");
+  const [showLayoutMenu, setShowLayoutMenu] = useState11(false);
+  const [layoutMenuPosition, setLayoutMenuPosition] = useState11({ top: 0, left: 0 });
+  useEffect10(() => {
     return editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {
         const selection = $getSelection6();
@@ -3995,7 +4459,7 @@ function ToolbarPlugin() {
       });
     });
   }, [editor]);
-  const handleImageUpload = useCallback8(() => {
+  const handleImageUpload = useCallback9(() => {
     const input = document.createElement("input");
     input.type = "file";
     input.accept = "image/*";
@@ -4020,7 +4484,7 @@ function ToolbarPlugin() {
     };
     input.click();
   }, [editor]);
-  const formatHeading = useCallback8((level) => {
+  const formatHeading = useCallback9((level) => {
     editor.update(() => {
       const selection = $getSelection6();
       if ($isRangeSelection6(selection)) {
@@ -4029,7 +4493,7 @@ function ToolbarPlugin() {
     });
     setBlockType(level);
   }, [editor]);
-  const formatParagraph = useCallback8(() => {
+  const formatParagraph = useCallback9(() => {
     editor.update(() => {
       const selection = $getSelection6();
       if ($isRangeSelection6(selection)) {
@@ -4038,7 +4502,7 @@ function ToolbarPlugin() {
     });
     setBlockType("paragraph");
   }, [editor]);
-  const formatQuote = useCallback8(() => {
+  const formatQuote = useCallback9(() => {
     editor.update(() => {
       const selection = $getSelection6();
       if ($isRangeSelection6(selection)) {
@@ -4047,7 +4511,7 @@ function ToolbarPlugin() {
     });
     setBlockType("quote");
   }, [editor]);
-  const formatCode = useCallback8(() => {
+  const formatCode = useCallback9(() => {
     editor.update(() => {
       const selection = $getSelection6();
       if ($isRangeSelection6(selection)) {
@@ -4056,45 +4520,45 @@ function ToolbarPlugin() {
     });
     setBlockType("code");
   }, [editor]);
-  const formatBold = useCallback8(() => {
+  const formatBold = useCallback9(() => {
     editor.dispatchCommand(FORMAT_TEXT_COMMAND, "bold");
   }, [editor]);
-  const formatItalic = useCallback8(() => {
+  const formatItalic = useCallback9(() => {
     editor.dispatchCommand(FORMAT_TEXT_COMMAND, "italic");
   }, [editor]);
-  const formatUnderline = useCallback8(() => {
+  const formatUnderline = useCallback9(() => {
     editor.dispatchCommand(FORMAT_TEXT_COMMAND, "underline");
   }, [editor]);
-  const formatStrikethrough = useCallback8(() => {
+  const formatStrikethrough = useCallback9(() => {
     editor.dispatchCommand(FORMAT_TEXT_COMMAND, "strikethrough");
   }, [editor]);
-  const formatInlineCode = useCallback8(() => {
+  const formatInlineCode = useCallback9(() => {
     editor.dispatchCommand(FORMAT_TEXT_COMMAND, "code");
   }, [editor]);
-  const formatBulletList = useCallback8(() => {
+  const formatBulletList = useCallback9(() => {
     editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, void 0);
   }, [editor]);
-  const formatNumberedList = useCallback8(() => {
+  const formatNumberedList = useCallback9(() => {
     editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, void 0);
   }, [editor]);
-  const formatAlignLeft = useCallback8(() => {
+  const formatAlignLeft = useCallback9(() => {
     editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, "left");
   }, [editor]);
-  const formatAlignCenter = useCallback8(() => {
+  const formatAlignCenter = useCallback9(() => {
     editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, "center");
   }, [editor]);
-  const formatAlignRight = useCallback8(() => {
+  const formatAlignRight = useCallback9(() => {
     editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, "right");
   }, [editor]);
-  const formatAlignJustify = useCallback8(() => {
+  const formatAlignJustify = useCallback9(() => {
     editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, "justify");
   }, [editor]);
-  const insertLink = useCallback8(() => {
+  const insertLink = useCallback9(() => {
     if (window.__insertLink) {
       window.__insertLink();
     }
   }, []);
-  const insertLayout = useCallback8((layoutType) => {
+  const insertLayout = useCallback9((layoutType) => {
     editor.update(() => {
       const selection = $getSelection6();
       if ($isRangeSelection6(selection)) {
@@ -4115,7 +4579,7 @@ function ToolbarPlugin() {
     });
     setShowLayoutMenu(false);
   }, [editor]);
-  const toggleLayoutMenu = useCallback8((event) => {
+  const toggleLayoutMenu = useCallback9((event) => {
     if (!showLayoutMenu) {
       const button = event.currentTarget;
       const rect = button.getBoundingClientRect();
@@ -4126,248 +4590,248 @@ function ToolbarPlugin() {
     }
     setShowLayoutMenu(!showLayoutMenu);
   }, [showLayoutMenu]);
-  const handleUndo = useCallback8(() => {
+  const handleUndo = useCallback9(() => {
     editor.dispatchCommand(UNDO_COMMAND, void 0);
   }, [editor]);
-  const handleRedo = useCallback8(() => {
+  const handleRedo = useCallback9(() => {
     editor.dispatchCommand(REDO_COMMAND, void 0);
   }, [editor]);
-  return /* @__PURE__ */ jsxs10("div", { className: "cms-toolbar", children: [
-    /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsxs11("div", { className: "cms-toolbar", children: [
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: handleUndo,
         title: "Undo (Cmd+Z)",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdUndo, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdUndo, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: handleRedo,
         title: "Redo (Cmd+Shift+Z)",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdRedo, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdRedo, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "paragraph" ? "active" : ""}`,
         onClick: formatParagraph,
         title: "Paragraph",
         type: "button",
-        children: /* @__PURE__ */ jsx10(BiParagraph, { size: 18 })
+        children: /* @__PURE__ */ jsx11(BiParagraph, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "h1" ? "active" : ""}`,
         onClick: () => formatHeading("h1"),
         title: "Heading 1",
         type: "button",
-        children: /* @__PURE__ */ jsx10(LuHeading1, { size: 18 })
+        children: /* @__PURE__ */ jsx11(LuHeading1, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "h2" ? "active" : ""}`,
         onClick: () => formatHeading("h2"),
         title: "Heading 2",
         type: "button",
-        children: /* @__PURE__ */ jsx10(LuHeading2, { size: 18 })
+        children: /* @__PURE__ */ jsx11(LuHeading2, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "h3" ? "active" : ""}`,
         onClick: () => formatHeading("h3"),
         title: "Heading 3",
         type: "button",
-        children: /* @__PURE__ */ jsx10(LuHeading3, { size: 18 })
+        children: /* @__PURE__ */ jsx11(LuHeading3, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${isBold ? "active" : ""}`,
         onClick: formatBold,
         title: "Bold (Cmd+B)",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatBold, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatBold, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${isItalic ? "active" : ""}`,
         onClick: formatItalic,
         title: "Italic (Cmd+I)",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatItalic, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatItalic, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${isUnderline ? "active" : ""}`,
         onClick: formatUnderline,
         title: "Underline (Cmd+U)",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatUnderlined, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatUnderlined, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${isStrikethrough ? "active" : ""}`,
         onClick: formatStrikethrough,
         title: "Strikethrough",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatStrikethrough, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatStrikethrough, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${isCode ? "active" : ""}`,
         onClick: formatInlineCode,
         title: "Inline Code",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdCode, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdCode, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(ColorPickerPlugin, {}),
-    /* @__PURE__ */ jsx10(SpacingPlugin, {}),
-    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(ColorPickerPlugin, {}),
+    /* @__PURE__ */ jsx11(SpacingPlugin, {}),
+    /* @__PURE__ */ jsx11("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatBulletList,
         title: "Bullet List",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatListBulleted, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatListBulleted, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatNumberedList,
         title: "Numbered List",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatListNumbered, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatListNumbered, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatAlignLeft,
         title: "Align Left",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatAlignLeft, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatAlignLeft, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatAlignCenter,
         title: "Align Center",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatAlignCenter, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatAlignCenter, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatAlignRight,
         title: "Align Right",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatAlignRight, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatAlignRight, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatAlignJustify,
         title: "Justify",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatAlignJustify, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatAlignJustify, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "quote" ? "active" : ""}`,
         onClick: formatQuote,
         title: "Quote",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdFormatQuote, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdFormatQuote, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "code" ? "active" : ""}`,
         onClick: formatCode,
         title: "Code Block",
         type: "button",
-        children: /* @__PURE__ */ jsx10(BiCodeBlock, { size: 18 })
+        children: /* @__PURE__ */ jsx11(BiCodeBlock, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: insertLink,
         title: "Insert Link",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdLink, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdLink, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: handleImageUpload,
         title: "Upload Image",
         type: "button",
-        children: /* @__PURE__ */ jsx10(MdImage, { size: 18 })
+        children: /* @__PURE__ */ jsx11(MdImage, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx10(ExportImportPlugin, {}),
-    /* @__PURE__ */ jsx10(SectionCreatorPlugin, {}),
-    /* @__PURE__ */ jsx10(TablePlugin, {}),
-    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsxs10("div", { className: "cms-layout-plugin", children: [
-      /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx11(ExportImportPlugin, {}),
+    /* @__PURE__ */ jsx11(SectionCreatorPlugin, {}),
+    /* @__PURE__ */ jsx11(TablePlugin, {}),
+    /* @__PURE__ */ jsx11("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsxs11("div", { className: "cms-layout-plugin", children: [
+      /* @__PURE__ */ jsx11(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleLayoutMenu,
           title: "Insert Layout",
           type: "button",
-          children: /* @__PURE__ */ jsx10(MdViewColumn, { size: 18 })
+          children: /* @__PURE__ */ jsx11(MdViewColumn, { size: 18 })
         }
       ),
-      showLayoutMenu && /* @__PURE__ */ jsxs10(
+      showLayoutMenu && /* @__PURE__ */ jsxs11(
         "div",
         {
           className: "cms-layout-menu",
@@ -4376,96 +4840,96 @@ function ToolbarPlugin() {
             left: `${layoutMenuPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsx10("div", { className: "cms-layout-menu-title", children: "Choose Layout" }),
-            /* @__PURE__ */ jsxs10("div", { className: "cms-layout-menu-section", children: [
-              /* @__PURE__ */ jsx10("div", { className: "cms-layout-menu-subtitle", children: "Columns (Flex)" }),
-              /* @__PURE__ */ jsxs10(
+            /* @__PURE__ */ jsx11("div", { className: "cms-layout-menu-title", children: "Choose Layout" }),
+            /* @__PURE__ */ jsxs11("div", { className: "cms-layout-menu-section", children: [
+              /* @__PURE__ */ jsx11("div", { className: "cms-layout-menu-subtitle", children: "Columns (Flex)" }),
+              /* @__PURE__ */ jsxs11(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("2-column"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs10("div", { className: "cms-layout-preview cms-layout-preview-2col", children: [
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" })
+                    /* @__PURE__ */ jsxs11("div", { className: "cms-layout-preview cms-layout-preview-2col", children: [
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" })
                     ] }),
-                    /* @__PURE__ */ jsx10("span", { children: "2 Columns" })
+                    /* @__PURE__ */ jsx11("span", { children: "2 Columns" })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs10(
+              /* @__PURE__ */ jsxs11(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("3-column"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs10("div", { className: "cms-layout-preview cms-layout-preview-3col", children: [
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" })
+                    /* @__PURE__ */ jsxs11("div", { className: "cms-layout-preview cms-layout-preview-3col", children: [
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" })
                     ] }),
-                    /* @__PURE__ */ jsx10("span", { children: "3 Columns" })
+                    /* @__PURE__ */ jsx11("span", { children: "3 Columns" })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs10(
+              /* @__PURE__ */ jsxs11(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("4-column"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs10("div", { className: "cms-layout-preview cms-layout-preview-4col", children: [
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" })
+                    /* @__PURE__ */ jsxs11("div", { className: "cms-layout-preview cms-layout-preview-4col", children: [
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" })
                     ] }),
-                    /* @__PURE__ */ jsx10("span", { children: "4 Columns" })
+                    /* @__PURE__ */ jsx11("span", { children: "4 Columns" })
                   ]
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs10("div", { className: "cms-layout-menu-section", children: [
-              /* @__PURE__ */ jsx10("div", { className: "cms-layout-menu-subtitle", children: "Grid" }),
-              /* @__PURE__ */ jsxs10(
+            /* @__PURE__ */ jsxs11("div", { className: "cms-layout-menu-section", children: [
+              /* @__PURE__ */ jsx11("div", { className: "cms-layout-menu-subtitle", children: "Grid" }),
+              /* @__PURE__ */ jsxs11(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("grid-2x2"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs10("div", { className: "cms-layout-preview cms-layout-preview-grid-2x2", children: [
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" })
+                    /* @__PURE__ */ jsxs11("div", { className: "cms-layout-preview cms-layout-preview-grid-2x2", children: [
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" })
                     ] }),
-                    /* @__PURE__ */ jsx10("span", { children: "2\xD72 Grid" })
+                    /* @__PURE__ */ jsx11("span", { children: "2\xD72 Grid" })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs10(
+              /* @__PURE__ */ jsxs11(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("grid-3x3"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs10("div", { className: "cms-layout-preview cms-layout-preview-grid-3x3", children: [
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx10("div", { className: "cms-layout-preview-col" })
+                    /* @__PURE__ */ jsxs11("div", { className: "cms-layout-preview cms-layout-preview-grid-3x3", children: [
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" }),
+                      /* @__PURE__ */ jsx11("div", { className: "cms-layout-preview-col" })
                     ] }),
-                    /* @__PURE__ */ jsx10("span", { children: "3\xD73 Grid" })
+                    /* @__PURE__ */ jsx11("span", { children: "3\xD73 Grid" })
                   ]
                 }
               )
@@ -4479,14 +4943,14 @@ function ToolbarPlugin() {
 
 // src/plugins/ImageUploadPlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext9 } from "@lexical/react/LexicalComposerContext";
-import { useEffect as useEffect10 } from "react";
+import { useEffect as useEffect11 } from "react";
 import { $getSelection as $getSelection7, $isRangeSelection as $isRangeSelection7, COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW3, DRAGOVER_COMMAND, DROP_COMMAND } from "lexical";
 function ImageUploadPlugin({
   onImageAdded,
   useBase64Url = true
 }) {
   const [editor] = useLexicalComposerContext9();
-  useEffect10(() => {
+  useEffect11(() => {
     const removeDragOverListener = editor.registerCommand(
       DRAGOVER_COMMAND,
       (event) => {
@@ -4547,26 +5011,104 @@ function ImageUploadPlugin({
   return null;
 }
 
-// src/plugins/LinkPlugin.tsx
+// src/plugins/VideoUploadPlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext10 } from "@lexical/react/LexicalComposerContext";
-import { useEffect as useEffect11, useState as useState11, useCallback as useCallback9 } from "react";
+import { useEffect as useEffect12 } from "react";
+import { $getSelection as $getSelection8, $isRangeSelection as $isRangeSelection8, COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW4, DRAGOVER_COMMAND as DRAGOVER_COMMAND2, DROP_COMMAND as DROP_COMMAND2 } from "lexical";
+function VideoUploadPlugin({
+  onVideoAdded,
+  useBase64Url = false
+}) {
+  const [editor] = useLexicalComposerContext10();
+  useEffect12(() => {
+    const removeDragOverListener = editor.registerCommand(
+      DRAGOVER_COMMAND2,
+      (event) => {
+        const files = event.dataTransfer?.files;
+        if (files && files.length > 0) {
+          const file = files[0];
+          if (file.type.startsWith("video/")) {
+            event.preventDefault();
+            return true;
+          }
+        }
+        return false;
+      },
+      COMMAND_PRIORITY_LOW4
+    );
+    const removeDropListener = editor.registerCommand(
+      DROP_COMMAND2,
+      //@ts-ignore
+      async (event) => {
+        const files = event.dataTransfer?.files;
+        if (files && files.length > 0) {
+          const file = files[0];
+          if (file.type.startsWith("video/")) {
+            event.preventDefault();
+            let url;
+            if (onVideoAdded) {
+              try {
+                url = await onVideoAdded(file);
+              } catch (error) {
+                console.error("Error uploading video:", error);
+                alert("Failed to upload video. Please try again.");
+                return false;
+              }
+            } else if (useBase64Url) {
+              console.warn("Using base64 for video - this may cause performance issues");
+              url = await new Promise((resolve) => {
+                const reader = new FileReader();
+                reader.onload = (e) => {
+                  resolve(e.target?.result);
+                };
+                reader.readAsDataURL(file);
+              });
+            } else {
+              alert("Video upload handler not configured. Please provide onVideoAdded prop.");
+              return false;
+            }
+            editor.update(() => {
+              const selection = $getSelection8();
+              if ($isRangeSelection8(selection)) {
+                const videoNode = new VideoNode(url);
+                selection.insertNodes([videoNode]);
+              }
+            });
+            return true;
+          }
+        }
+        return false;
+      },
+      COMMAND_PRIORITY_LOW4
+    );
+    return () => {
+      removeDragOverListener();
+      removeDropListener();
+    };
+  }, [editor, onVideoAdded, useBase64Url]);
+  return null;
+}
+
+// src/plugins/LinkPlugin.tsx
+import { useLexicalComposerContext as useLexicalComposerContext11 } from "@lexical/react/LexicalComposerContext";
+import { useEffect as useEffect13, useState as useState12, useCallback as useCallback10 } from "react";
 import {
-  $getSelection as $getSelection8,
-  $isRangeSelection as $isRangeSelection8,
-  COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW4,
+  $getSelection as $getSelection9,
+  $isRangeSelection as $isRangeSelection9,
+  COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW5,
   KEY_ESCAPE_COMMAND as KEY_ESCAPE_COMMAND2,
   $createTextNode as $createTextNode2
 } from "lexical";
 import { $createLinkNode as $createLinkNode2, TOGGLE_LINK_COMMAND } from "@lexical/link";
-import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
 function LinkPlugin() {
-  const [editor] = useLexicalComposerContext10();
-  const [showModal, setShowModal] = useState11(false);
-  const [linkUrl, setLinkUrl] = useState11("");
-  const [linkText, setLinkText] = useState11("");
-  const [linkTitle, setLinkTitle] = useState11("");
-  const [openInNewTab, setOpenInNewTab] = useState11(false);
-  useEffect11(() => {
+  const [editor] = useLexicalComposerContext11();
+  const [showModal, setShowModal] = useState12(false);
+  const [linkUrl, setLinkUrl] = useState12("");
+  const [linkText, setLinkText] = useState12("");
+  const [linkTitle, setLinkTitle] = useState12("");
+  const [openInNewTab, setOpenInNewTab] = useState12(false);
+  useEffect13(() => {
     return editor.registerCommand(
       KEY_ESCAPE_COMMAND2,
       () => {
@@ -4576,13 +5118,13 @@ function LinkPlugin() {
         }
         return false;
       },
-      COMMAND_PRIORITY_LOW4
+      COMMAND_PRIORITY_LOW5
     );
   }, [editor, showModal]);
-  const handleInsertLink = useCallback9(() => {
+  const handleInsertLink = useCallback10(() => {
     editor.update(() => {
-      const selection = $getSelection8();
-      if ($isRangeSelection8(selection)) {
+      const selection = $getSelection9();
+      if ($isRangeSelection9(selection)) {
         const selectedText = selection.getTextContent();
         setLinkText(selectedText || "");
         setShowModal(true);
@@ -4593,8 +5135,8 @@ function LinkPlugin() {
     e.preventDefault();
     if (!linkUrl) return;
     editor.update(() => {
-      const selection = $getSelection8();
-      if ($isRangeSelection8(selection)) {
+      const selection = $getSelection9();
+      if ($isRangeSelection9(selection)) {
         if (selection.getTextContent()) {
           editor.dispatchCommand(TOGGLE_LINK_COMMAND, {
             url: linkUrl,
@@ -4627,17 +5169,17 @@ function LinkPlugin() {
     setLinkTitle("");
     setOpenInNewTab(false);
   };
-  useEffect11(() => {
+  useEffect13(() => {
     window.__insertLink = handleInsertLink;
     return () => {
       delete window.__insertLink;
     };
   }, [handleInsertLink]);
   if (!showModal) return null;
-  return /* @__PURE__ */ jsx11("div", { className: "cms-link-modal-overlay", onClick: handleCancel, children: /* @__PURE__ */ jsxs11("div", { className: "cms-link-modal", onClick: (e) => e.stopPropagation(), children: [
-    /* @__PURE__ */ jsxs11("div", { className: "cms-link-modal-header", children: [
-      /* @__PURE__ */ jsx11("h3", { children: "Insert Link" }),
-      /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsx12("div", { className: "cms-link-modal-overlay", onClick: handleCancel, children: /* @__PURE__ */ jsxs12("div", { className: "cms-link-modal", onClick: (e) => e.stopPropagation(), children: [
+    /* @__PURE__ */ jsxs12("div", { className: "cms-link-modal-header", children: [
+      /* @__PURE__ */ jsx12("h3", { children: "Insert Link" }),
+      /* @__PURE__ */ jsx12(
         "button",
         {
           className: "cms-link-modal-close",
@@ -4647,10 +5189,10 @@ function LinkPlugin() {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs11("form", { onSubmit: handleSubmit, className: "cms-link-modal-form", children: [
-      /* @__PURE__ */ jsxs11("div", { className: "cms-link-modal-field", children: [
-        /* @__PURE__ */ jsx11("label", { htmlFor: "link-text", children: "Link Text" }),
-        /* @__PURE__ */ jsx11(
+    /* @__PURE__ */ jsxs12("form", { onSubmit: handleSubmit, className: "cms-link-modal-form", children: [
+      /* @__PURE__ */ jsxs12("div", { className: "cms-link-modal-field", children: [
+        /* @__PURE__ */ jsx12("label", { htmlFor: "link-text", children: "Link Text" }),
+        /* @__PURE__ */ jsx12(
           "input",
           {
             id: "link-text",
@@ -4662,9 +5204,9 @@ function LinkPlugin() {
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs11("div", { className: "cms-link-modal-field", children: [
-        /* @__PURE__ */ jsx11("label", { htmlFor: "link-url", children: "URL *" }),
-        /* @__PURE__ */ jsx11(
+      /* @__PURE__ */ jsxs12("div", { className: "cms-link-modal-field", children: [
+        /* @__PURE__ */ jsx12("label", { htmlFor: "link-url", children: "URL *" }),
+        /* @__PURE__ */ jsx12(
           "input",
           {
             id: "link-url",
@@ -4676,9 +5218,9 @@ function LinkPlugin() {
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs11("div", { className: "cms-link-modal-field", children: [
-        /* @__PURE__ */ jsx11("label", { htmlFor: "link-title", children: "Title (optional)" }),
-        /* @__PURE__ */ jsx11(
+      /* @__PURE__ */ jsxs12("div", { className: "cms-link-modal-field", children: [
+        /* @__PURE__ */ jsx12("label", { htmlFor: "link-title", children: "Title (optional)" }),
+        /* @__PURE__ */ jsx12(
           "input",
           {
             id: "link-title",
@@ -4689,8 +5231,8 @@ function LinkPlugin() {
           }
         )
       ] }),
-      /* @__PURE__ */ jsx11("div", { className: "cms-link-modal-field cms-link-modal-checkbox", children: /* @__PURE__ */ jsxs11("label", { children: [
-        /* @__PURE__ */ jsx11(
+      /* @__PURE__ */ jsx12("div", { className: "cms-link-modal-field cms-link-modal-checkbox", children: /* @__PURE__ */ jsxs12("label", { children: [
+        /* @__PURE__ */ jsx12(
           "input",
           {
             type: "checkbox",
@@ -4698,10 +5240,10 @@ function LinkPlugin() {
             onChange: (e) => setOpenInNewTab(e.target.checked)
           }
         ),
-        /* @__PURE__ */ jsx11("span", { children: "Open in new tab" })
+        /* @__PURE__ */ jsx12("span", { children: "Open in new tab" })
       ] }) }),
-      /* @__PURE__ */ jsxs11("div", { className: "cms-link-modal-actions", children: [
-        /* @__PURE__ */ jsx11(
+      /* @__PURE__ */ jsxs12("div", { className: "cms-link-modal-actions", children: [
+        /* @__PURE__ */ jsx12(
           "button",
           {
             type: "button",
@@ -4710,7 +5252,7 @@ function LinkPlugin() {
             children: "Cancel"
           }
         ),
-        /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx12(
           "button",
           {
             type: "submit",
@@ -4725,14 +5267,14 @@ function LinkPlugin() {
 }
 
 // src/plugins/SectionEditorPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext11 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState12, useCallback as useCallback10, useRef as useRef8, useEffect as useEffect12 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext12 } from "@lexical/react/LexicalComposerContext";
+import { useState as useState13, useCallback as useCallback11, useRef as useRef9, useEffect as useEffect14 } from "react";
 import {
-  $getSelection as $getSelection9,
-  $isRangeSelection as $isRangeSelection9,
+  $getSelection as $getSelection10,
+  $isRangeSelection as $isRangeSelection10,
   $getNodeByKey,
   SELECTION_CHANGE_COMMAND,
-  COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW5
+  COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW6
 } from "lexical";
 import { MdSettings as MdSettings2, MdClose } from "react-icons/md";
 import {
@@ -4741,7 +5283,7 @@ import {
   FaAlignRight,
   FaAlignJustify
 } from "react-icons/fa";
-import { Fragment as Fragment6, jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
 var PRESET_COLORS2 = [
   "#ffffff",
   "#f8f9fa",
@@ -4775,18 +5317,18 @@ var PRESET_COLORS2 = [
   "#1dd1a1"
 ];
 function SectionEditorPlugin() {
-  const [editor] = useLexicalComposerContext11();
-  const [selectedSection, setSelectedSection] = useState12(null);
-  const [showEditor, setShowEditor] = useState12(false);
-  const [editorPosition, setEditorPosition] = useState12({ top: 0, left: 0 });
-  const editorRef = useRef8(null);
-  useEffect12(() => {
+  const [editor] = useLexicalComposerContext12();
+  const [selectedSection, setSelectedSection] = useState13(null);
+  const [showEditor, setShowEditor] = useState13(false);
+  const [editorPosition, setEditorPosition] = useState13({ top: 0, left: 0 });
+  const editorRef = useRef9(null);
+  useEffect14(() => {
     return editor.registerCommand(
       SELECTION_CHANGE_COMMAND,
       () => {
         editor.getEditorState().read(() => {
-          const selection = $getSelection9();
-          if ($isRangeSelection9(selection)) {
+          const selection = $getSelection10();
+          if ($isRangeSelection10(selection)) {
             const nodes = selection.getNodes();
             for (const node2 of nodes) {
               let parent = node2.getParent();
@@ -4806,10 +5348,10 @@ function SectionEditorPlugin() {
         });
         return false;
       },
-      COMMAND_PRIORITY_LOW5
+      COMMAND_PRIORITY_LOW6
     );
   }, [editor]);
-  useEffect12(() => {
+  useEffect14(() => {
     const handleClickOutside = (event) => {
       if (editorRef.current && !editorRef.current.contains(event.target)) {
         setShowEditor(false);
@@ -4818,7 +5360,7 @@ function SectionEditorPlugin() {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  const toggleEditor = useCallback10((event) => {
+  const toggleEditor = useCallback11((event) => {
     if (!showEditor) {
       const button = event.currentTarget;
       const rect = button.getBoundingClientRect();
@@ -4829,7 +5371,7 @@ function SectionEditorPlugin() {
     }
     setShowEditor(!showEditor);
   }, [showEditor]);
-  const updateSection = useCallback10((updater) => {
+  const updateSection = useCallback11((updater) => {
     if (!selectedSection) return;
     editor.update(() => {
       const node2 = $getNodeByKey(selectedSection.key);
@@ -4838,64 +5380,64 @@ function SectionEditorPlugin() {
       }
     });
   }, [editor, selectedSection]);
-  const setBackgroundColor = useCallback10((color) => {
+  const setBackgroundColor = useCallback11((color) => {
     updateSection((node2) => node2.setBackgroundColor(color));
   }, [updateSection]);
-  const setBackgroundImage = useCallback10((image) => {
+  const setBackgroundImage = useCallback11((image) => {
     updateSection((node2) => node2.setBackgroundImage(image));
   }, [updateSection]);
-  const setBackgroundSize = useCallback10((size) => {
+  const setBackgroundSize = useCallback11((size) => {
     updateSection((node2) => node2.setBackgroundSize(size));
   }, [updateSection]);
-  const setBackgroundPosition = useCallback10((position) => {
+  const setBackgroundPosition = useCallback11((position) => {
     updateSection((node2) => node2.setBackgroundPosition(position));
   }, [updateSection]);
-  const setBackgroundRepeat = useCallback10((repeat) => {
+  const setBackgroundRepeat = useCallback11((repeat) => {
     updateSection((node2) => node2.setBackgroundRepeat(repeat));
   }, [updateSection]);
-  const setGradientOverlay = useCallback10((gradient) => {
+  const setGradientOverlay = useCallback11((gradient) => {
     updateSection((node2) => node2.setGradientOverlay(gradient));
   }, [updateSection]);
-  const setOpacity = useCallback10((opacity) => {
+  const setOpacity = useCallback11((opacity) => {
     updateSection((node2) => node2.setOpacity(opacity));
   }, [updateSection]);
-  const removeBackgroundImage = useCallback10(() => {
+  const removeBackgroundImage = useCallback11(() => {
     updateSection((node2) => {
       node2.setBackgroundImage(void 0);
       node2.setGradientOverlay(void 0);
     });
   }, [updateSection]);
-  const setTextAlign = useCallback10((align) => {
+  const setTextAlign = useCallback11((align) => {
     updateSection((node2) => node2.setTextAlign(align));
   }, [updateSection]);
-  const setLayoutType = useCallback10((layout) => {
+  const setLayoutType = useCallback11((layout) => {
     updateSection((node2) => node2.setLayoutType(layout));
   }, [updateSection]);
-  const setFlexDirection = useCallback10((direction) => {
+  const setFlexDirection = useCallback11((direction) => {
     updateSection((node2) => node2.setFlexDirection(direction));
   }, [updateSection]);
-  const setFlexWrap = useCallback10((wrap) => {
+  const setFlexWrap = useCallback11((wrap) => {
     updateSection((node2) => node2.setFlexWrap(wrap));
   }, [updateSection]);
-  const setAlignItems = useCallback10((align) => {
+  const setAlignItems = useCallback11((align) => {
     updateSection((node2) => node2.setAlignItems(align));
   }, [updateSection]);
-  const setJustifyContent = useCallback10((justify) => {
+  const setJustifyContent = useCallback11((justify) => {
     updateSection((node2) => node2.setJustifyContent(justify));
   }, [updateSection]);
-  const setGap = useCallback10((gap) => {
+  const setGap = useCallback11((gap) => {
     updateSection((node2) => node2.setGap(gap));
   }, [updateSection]);
-  const setPadding = useCallback10((padding) => {
+  const setPadding = useCallback11((padding) => {
     updateSection((node2) => node2.setPadding(padding));
   }, [updateSection]);
-  const setMargin = useCallback10((margin) => {
+  const setMargin = useCallback11((margin) => {
     updateSection((node2) => node2.setMargin(margin));
   }, [updateSection]);
-  const setGridColumns = useCallback10((columns) => {
+  const setGridColumns = useCallback11((columns) => {
     updateSection((node2) => node2.setGridTemplateColumns(columns));
   }, [updateSection]);
-  const setGridRows = useCallback10((rows) => {
+  const setGridRows = useCallback11((rows) => {
     updateSection((node2) => node2.setGridTemplateRows(rows));
   }, [updateSection]);
   if (!selectedSection) {
@@ -4920,8 +5462,8 @@ function SectionEditorPlugin() {
   const currentMargin = node.getMargin() || "0px";
   const currentGridColumns = node.getGridTemplateColumns() || "repeat(3, 1fr)";
   const currentGridRows = node.getGridTemplateRows() || "auto";
-  return /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-plugin", ref: editorRef, children: [
-    /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-plugin", ref: editorRef, children: [
+    /* @__PURE__ */ jsxs13(
       "button",
       {
         className: "cms-toolbar-button cms-section-edit-button",
@@ -4929,12 +5471,12 @@ function SectionEditorPlugin() {
         title: "Edit Section",
         type: "button",
         children: [
-          /* @__PURE__ */ jsx12(MdSettings2, { size: 18 }),
-          /* @__PURE__ */ jsx12("span", { className: "cms-section-indicator", children: "Section" })
+          /* @__PURE__ */ jsx13(MdSettings2, { size: 18 }),
+          /* @__PURE__ */ jsx13("span", { className: "cms-section-indicator", children: "Section" })
         ]
       }
     ),
-    showEditor && /* @__PURE__ */ jsxs12(
+    showEditor && /* @__PURE__ */ jsxs13(
       "div",
       {
         className: "cms-section-editor-menu",
@@ -4943,22 +5485,22 @@ function SectionEditorPlugin() {
           left: `${editorPosition.left}px`
         },
         children: [
-          /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-header", children: [
-            /* @__PURE__ */ jsx12("span", { children: "Section Settings" }),
-            /* @__PURE__ */ jsx12(
+          /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-header", children: [
+            /* @__PURE__ */ jsx13("span", { children: "Section Settings" }),
+            /* @__PURE__ */ jsx13(
               "button",
               {
                 className: "cms-close-button",
                 onClick: () => setShowEditor(false),
                 type: "button",
-                children: /* @__PURE__ */ jsx12(MdClose, { size: 16 })
+                children: /* @__PURE__ */ jsx13(MdClose, { size: 16 })
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-content", children: [
-            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx12("label", { children: "Background Color" }),
-              /* @__PURE__ */ jsx12("div", { className: "cms-color-grid", children: PRESET_COLORS2.map((color) => /* @__PURE__ */ jsx12(
+          /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-content", children: [
+            /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx13("label", { children: "Background Color" }),
+              /* @__PURE__ */ jsx13("div", { className: "cms-color-grid", children: PRESET_COLORS2.map((color) => /* @__PURE__ */ jsx13(
                 "button",
                 {
                   className: `cms-color-swatch ${currentBgColor === color ? "active" : ""}`,
@@ -4969,7 +5511,7 @@ function SectionEditorPlugin() {
                 },
                 color
               )) }),
-              /* @__PURE__ */ jsx12(
+              /* @__PURE__ */ jsx13(
                 "input",
                 {
                   type: "color",
@@ -4979,9 +5521,9 @@ function SectionEditorPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx12("label", { children: "Background Image" }),
-              /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx13("label", { children: "Background Image" }),
+              /* @__PURE__ */ jsx13(
                 "input",
                 {
                   type: "text",
@@ -4991,66 +5533,66 @@ function SectionEditorPlugin() {
                   className: "cms-text-input"
                 }
               ),
-              currentBgImage && /* @__PURE__ */ jsxs12(Fragment6, { children: [
-                /* @__PURE__ */ jsxs12("div", { className: "cms-bg-controls", children: [
-                  /* @__PURE__ */ jsxs12("div", { className: "cms-bg-control-item", children: [
-                    /* @__PURE__ */ jsx12("label", { children: "Size" }),
-                    /* @__PURE__ */ jsxs12(
+              currentBgImage && /* @__PURE__ */ jsxs13(Fragment7, { children: [
+                /* @__PURE__ */ jsxs13("div", { className: "cms-bg-controls", children: [
+                  /* @__PURE__ */ jsxs13("div", { className: "cms-bg-control-item", children: [
+                    /* @__PURE__ */ jsx13("label", { children: "Size" }),
+                    /* @__PURE__ */ jsxs13(
                       "select",
                       {
                         value: currentBgSize,
                         onChange: (e) => setBackgroundSize(e.target.value),
                         className: "cms-select-small",
                         children: [
-                          /* @__PURE__ */ jsx12("option", { value: "cover", children: "Cover" }),
-                          /* @__PURE__ */ jsx12("option", { value: "contain", children: "Contain" }),
-                          /* @__PURE__ */ jsx12("option", { value: "auto", children: "Auto" }),
-                          /* @__PURE__ */ jsx12("option", { value: "100% 100%", children: "Stretch" })
+                          /* @__PURE__ */ jsx13("option", { value: "cover", children: "Cover" }),
+                          /* @__PURE__ */ jsx13("option", { value: "contain", children: "Contain" }),
+                          /* @__PURE__ */ jsx13("option", { value: "auto", children: "Auto" }),
+                          /* @__PURE__ */ jsx13("option", { value: "100% 100%", children: "Stretch" })
                         ]
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ jsxs12("div", { className: "cms-bg-control-item", children: [
-                    /* @__PURE__ */ jsx12("label", { children: "Position" }),
-                    /* @__PURE__ */ jsxs12(
+                  /* @__PURE__ */ jsxs13("div", { className: "cms-bg-control-item", children: [
+                    /* @__PURE__ */ jsx13("label", { children: "Position" }),
+                    /* @__PURE__ */ jsxs13(
                       "select",
                       {
                         value: currentBgPosition,
                         onChange: (e) => setBackgroundPosition(e.target.value),
                         className: "cms-select-small",
                         children: [
-                          /* @__PURE__ */ jsx12("option", { value: "center", children: "Center" }),
-                          /* @__PURE__ */ jsx12("option", { value: "top", children: "Top" }),
-                          /* @__PURE__ */ jsx12("option", { value: "bottom", children: "Bottom" }),
-                          /* @__PURE__ */ jsx12("option", { value: "left", children: "Left" }),
-                          /* @__PURE__ */ jsx12("option", { value: "right", children: "Right" }),
-                          /* @__PURE__ */ jsx12("option", { value: "top left", children: "Top Left" }),
-                          /* @__PURE__ */ jsx12("option", { value: "top right", children: "Top Right" }),
-                          /* @__PURE__ */ jsx12("option", { value: "bottom left", children: "Bottom Left" }),
-                          /* @__PURE__ */ jsx12("option", { value: "bottom right", children: "Bottom Right" })
+                          /* @__PURE__ */ jsx13("option", { value: "center", children: "Center" }),
+                          /* @__PURE__ */ jsx13("option", { value: "top", children: "Top" }),
+                          /* @__PURE__ */ jsx13("option", { value: "bottom", children: "Bottom" }),
+                          /* @__PURE__ */ jsx13("option", { value: "left", children: "Left" }),
+                          /* @__PURE__ */ jsx13("option", { value: "right", children: "Right" }),
+                          /* @__PURE__ */ jsx13("option", { value: "top left", children: "Top Left" }),
+                          /* @__PURE__ */ jsx13("option", { value: "top right", children: "Top Right" }),
+                          /* @__PURE__ */ jsx13("option", { value: "bottom left", children: "Bottom Left" }),
+                          /* @__PURE__ */ jsx13("option", { value: "bottom right", children: "Bottom Right" })
                         ]
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ jsxs12("div", { className: "cms-bg-control-item", children: [
-                    /* @__PURE__ */ jsx12("label", { children: "Repeat" }),
-                    /* @__PURE__ */ jsxs12(
+                  /* @__PURE__ */ jsxs13("div", { className: "cms-bg-control-item", children: [
+                    /* @__PURE__ */ jsx13("label", { children: "Repeat" }),
+                    /* @__PURE__ */ jsxs13(
                       "select",
                       {
                         value: currentBgRepeat,
                         onChange: (e) => setBackgroundRepeat(e.target.value),
                         className: "cms-select-small",
                         children: [
-                          /* @__PURE__ */ jsx12("option", { value: "no-repeat", children: "No Repeat" }),
-                          /* @__PURE__ */ jsx12("option", { value: "repeat", children: "Repeat" }),
-                          /* @__PURE__ */ jsx12("option", { value: "repeat-x", children: "Repeat X" }),
-                          /* @__PURE__ */ jsx12("option", { value: "repeat-y", children: "Repeat Y" })
+                          /* @__PURE__ */ jsx13("option", { value: "no-repeat", children: "No Repeat" }),
+                          /* @__PURE__ */ jsx13("option", { value: "repeat", children: "Repeat" }),
+                          /* @__PURE__ */ jsx13("option", { value: "repeat-x", children: "Repeat X" }),
+                          /* @__PURE__ */ jsx13("option", { value: "repeat-y", children: "Repeat Y" })
                         ]
                       }
                     )
                   ] })
                 ] }),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     onClick: removeBackgroundImage,
@@ -5061,10 +5603,10 @@ function SectionEditorPlugin() {
                 )
               ] })
             ] }),
-            currentBgImage && /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx12("label", { children: "Gradient Overlay" }),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-gradient-presets", children: [
-                /* @__PURE__ */ jsx12(
+            currentBgImage && /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx13("label", { children: "Gradient Overlay" }),
+              /* @__PURE__ */ jsxs13("div", { className: "cms-gradient-presets", children: [
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     onClick: () => setGradientOverlay(""),
@@ -5073,7 +5615,7 @@ function SectionEditorPlugin() {
                     children: "None"
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.7))"),
@@ -5083,7 +5625,7 @@ function SectionEditorPlugin() {
                     type: "button"
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5))"),
@@ -5093,7 +5635,7 @@ function SectionEditorPlugin() {
                     type: "button"
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(102,126,234,0.8), rgba(118,75,162,0.8))"),
@@ -5103,7 +5645,7 @@ function SectionEditorPlugin() {
                     type: "button"
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(250,112,154,0.8), rgba(254,225,64,0.8))"),
@@ -5113,7 +5655,7 @@ function SectionEditorPlugin() {
                     type: "button"
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(67,233,123,0.8), rgba(56,249,215,0.8))"),
@@ -5124,7 +5666,7 @@ function SectionEditorPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsx12(
+              /* @__PURE__ */ jsx13(
                 "input",
                 {
                   type: "text",
@@ -5135,13 +5677,13 @@ function SectionEditorPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsxs12("label", { children: [
+            /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsxs13("label", { children: [
                 "Opacity: ",
                 Math.round((currentOpacity || 1) * 100),
                 "%"
               ] }),
-              /* @__PURE__ */ jsx12(
+              /* @__PURE__ */ jsx13(
                 "input",
                 {
                   type: "range",
@@ -5153,62 +5695,62 @@ function SectionEditorPlugin() {
                   className: "cms-range-input"
                 }
               ),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-preset-buttons", children: [
-                /* @__PURE__ */ jsx12("button", { onClick: () => setOpacity(0.25), type: "button", children: "25%" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setOpacity(0.5), type: "button", children: "50%" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setOpacity(0.75), type: "button", children: "75%" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setOpacity(1), type: "button", children: "100%" })
+              /* @__PURE__ */ jsxs13("div", { className: "cms-preset-buttons", children: [
+                /* @__PURE__ */ jsx13("button", { onClick: () => setOpacity(0.25), type: "button", children: "25%" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setOpacity(0.5), type: "button", children: "50%" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setOpacity(0.75), type: "button", children: "75%" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setOpacity(1), type: "button", children: "100%" })
               ] })
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx12("label", { children: "Text Alignment" }),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-button-group", children: [
-                /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx13("label", { children: "Text Alignment" }),
+              /* @__PURE__ */ jsxs13("div", { className: "cms-button-group", children: [
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     className: `cms-icon-button ${currentTextAlign === "left" ? "active" : ""}`,
                     onClick: () => setTextAlign("left"),
                     title: "Align Left",
                     type: "button",
-                    children: /* @__PURE__ */ jsx12(FaAlignLeft, {})
+                    children: /* @__PURE__ */ jsx13(FaAlignLeft, {})
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     className: `cms-icon-button ${currentTextAlign === "center" ? "active" : ""}`,
                     onClick: () => setTextAlign("center"),
                     title: "Align Center",
                     type: "button",
-                    children: /* @__PURE__ */ jsx12(FaAlignCenter, {})
+                    children: /* @__PURE__ */ jsx13(FaAlignCenter, {})
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     className: `cms-icon-button ${currentTextAlign === "right" ? "active" : ""}`,
                     onClick: () => setTextAlign("right"),
                     title: "Align Right",
                     type: "button",
-                    children: /* @__PURE__ */ jsx12(FaAlignRight, {})
+                    children: /* @__PURE__ */ jsx13(FaAlignRight, {})
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     className: `cms-icon-button ${currentTextAlign === "justify" ? "active" : ""}`,
                     onClick: () => setTextAlign("justify"),
                     title: "Justify",
                     type: "button",
-                    children: /* @__PURE__ */ jsx12(FaAlignJustify, {})
+                    children: /* @__PURE__ */ jsx13(FaAlignJustify, {})
                   }
                 )
               ] })
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx12("label", { children: "Layout Type" }),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-button-group", children: [
-                /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx13("label", { children: "Layout Type" }),
+              /* @__PURE__ */ jsxs13("div", { className: "cms-button-group", children: [
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     className: `cms-layout-button ${currentLayout === "block" ? "active" : ""}`,
@@ -5217,7 +5759,7 @@ function SectionEditorPlugin() {
                     children: "Block"
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     className: `cms-layout-button ${currentLayout === "flex" ? "active" : ""}`,
@@ -5226,7 +5768,7 @@ function SectionEditorPlugin() {
                     children: "Flex"
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "button",
                   {
                     className: `cms-layout-button ${currentLayout === "grid" ? "active" : ""}`,
@@ -5237,81 +5779,81 @@ function SectionEditorPlugin() {
                 )
               ] })
             ] }),
-            currentLayout === "flex" && /* @__PURE__ */ jsxs12(Fragment6, { children: [
-              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx12("label", { children: "Flex Direction" }),
-                /* @__PURE__ */ jsxs12(
+            currentLayout === "flex" && /* @__PURE__ */ jsxs13(Fragment7, { children: [
+              /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx13("label", { children: "Flex Direction" }),
+                /* @__PURE__ */ jsxs13(
                   "select",
                   {
                     value: currentFlexDirection,
                     onChange: (e) => setFlexDirection(e.target.value),
                     className: "cms-select",
                     children: [
-                      /* @__PURE__ */ jsx12("option", { value: "row", children: "Row" }),
-                      /* @__PURE__ */ jsx12("option", { value: "column", children: "Column" }),
-                      /* @__PURE__ */ jsx12("option", { value: "row-reverse", children: "Row Reverse" }),
-                      /* @__PURE__ */ jsx12("option", { value: "column-reverse", children: "Column Reverse" })
+                      /* @__PURE__ */ jsx13("option", { value: "row", children: "Row" }),
+                      /* @__PURE__ */ jsx13("option", { value: "column", children: "Column" }),
+                      /* @__PURE__ */ jsx13("option", { value: "row-reverse", children: "Row Reverse" }),
+                      /* @__PURE__ */ jsx13("option", { value: "column-reverse", children: "Column Reverse" })
                     ]
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx12("label", { children: "Flex Wrap" }),
-                /* @__PURE__ */ jsxs12(
+              /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx13("label", { children: "Flex Wrap" }),
+                /* @__PURE__ */ jsxs13(
                   "select",
                   {
                     value: currentFlexWrap,
                     onChange: (e) => setFlexWrap(e.target.value),
                     className: "cms-select",
                     children: [
-                      /* @__PURE__ */ jsx12("option", { value: "nowrap", children: "No Wrap" }),
-                      /* @__PURE__ */ jsx12("option", { value: "wrap", children: "Wrap" }),
-                      /* @__PURE__ */ jsx12("option", { value: "wrap-reverse", children: "Wrap Reverse" })
+                      /* @__PURE__ */ jsx13("option", { value: "nowrap", children: "No Wrap" }),
+                      /* @__PURE__ */ jsx13("option", { value: "wrap", children: "Wrap" }),
+                      /* @__PURE__ */ jsx13("option", { value: "wrap-reverse", children: "Wrap Reverse" })
                     ]
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx12("label", { children: "Align Items" }),
-                /* @__PURE__ */ jsxs12(
+              /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx13("label", { children: "Align Items" }),
+                /* @__PURE__ */ jsxs13(
                   "select",
                   {
                     value: currentAlignItems,
                     onChange: (e) => setAlignItems(e.target.value),
                     className: "cms-select",
                     children: [
-                      /* @__PURE__ */ jsx12("option", { value: "flex-start", children: "Start" }),
-                      /* @__PURE__ */ jsx12("option", { value: "center", children: "Center" }),
-                      /* @__PURE__ */ jsx12("option", { value: "flex-end", children: "End" }),
-                      /* @__PURE__ */ jsx12("option", { value: "stretch", children: "Stretch" })
+                      /* @__PURE__ */ jsx13("option", { value: "flex-start", children: "Start" }),
+                      /* @__PURE__ */ jsx13("option", { value: "center", children: "Center" }),
+                      /* @__PURE__ */ jsx13("option", { value: "flex-end", children: "End" }),
+                      /* @__PURE__ */ jsx13("option", { value: "stretch", children: "Stretch" })
                     ]
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx12("label", { children: "Justify Content" }),
-                /* @__PURE__ */ jsxs12(
+              /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx13("label", { children: "Justify Content" }),
+                /* @__PURE__ */ jsxs13(
                   "select",
                   {
                     value: currentJustifyContent,
                     onChange: (e) => setJustifyContent(e.target.value),
                     className: "cms-select",
                     children: [
-                      /* @__PURE__ */ jsx12("option", { value: "flex-start", children: "Start" }),
-                      /* @__PURE__ */ jsx12("option", { value: "center", children: "Center" }),
-                      /* @__PURE__ */ jsx12("option", { value: "flex-end", children: "End" }),
-                      /* @__PURE__ */ jsx12("option", { value: "space-between", children: "Space Between" }),
-                      /* @__PURE__ */ jsx12("option", { value: "space-around", children: "Space Around" }),
-                      /* @__PURE__ */ jsx12("option", { value: "space-evenly", children: "Space Evenly" })
+                      /* @__PURE__ */ jsx13("option", { value: "flex-start", children: "Start" }),
+                      /* @__PURE__ */ jsx13("option", { value: "center", children: "Center" }),
+                      /* @__PURE__ */ jsx13("option", { value: "flex-end", children: "End" }),
+                      /* @__PURE__ */ jsx13("option", { value: "space-between", children: "Space Between" }),
+                      /* @__PURE__ */ jsx13("option", { value: "space-around", children: "Space Around" }),
+                      /* @__PURE__ */ jsx13("option", { value: "space-evenly", children: "Space Evenly" })
                     ]
                   }
                 )
               ] })
             ] }),
-            currentLayout === "grid" && /* @__PURE__ */ jsxs12(Fragment6, { children: [
-              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx12("label", { children: "Grid Columns" }),
-                /* @__PURE__ */ jsx12(
+            currentLayout === "grid" && /* @__PURE__ */ jsxs13(Fragment7, { children: [
+              /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx13("label", { children: "Grid Columns" }),
+                /* @__PURE__ */ jsx13(
                   "input",
                   {
                     type: "text",
@@ -5321,16 +5863,16 @@ function SectionEditorPlugin() {
                     className: "cms-text-input"
                   }
                 ),
-                /* @__PURE__ */ jsxs12("div", { className: "cms-preset-buttons", children: [
-                  /* @__PURE__ */ jsx12("button", { onClick: () => setGridColumns("1fr"), type: "button", children: "1 Col" }),
-                  /* @__PURE__ */ jsx12("button", { onClick: () => setGridColumns("repeat(2, 1fr)"), type: "button", children: "2 Cols" }),
-                  /* @__PURE__ */ jsx12("button", { onClick: () => setGridColumns("repeat(3, 1fr)"), type: "button", children: "3 Cols" }),
-                  /* @__PURE__ */ jsx12("button", { onClick: () => setGridColumns("repeat(4, 1fr)"), type: "button", children: "4 Cols" })
+                /* @__PURE__ */ jsxs13("div", { className: "cms-preset-buttons", children: [
+                  /* @__PURE__ */ jsx13("button", { onClick: () => setGridColumns("1fr"), type: "button", children: "1 Col" }),
+                  /* @__PURE__ */ jsx13("button", { onClick: () => setGridColumns("repeat(2, 1fr)"), type: "button", children: "2 Cols" }),
+                  /* @__PURE__ */ jsx13("button", { onClick: () => setGridColumns("repeat(3, 1fr)"), type: "button", children: "3 Cols" }),
+                  /* @__PURE__ */ jsx13("button", { onClick: () => setGridColumns("repeat(4, 1fr)"), type: "button", children: "4 Cols" })
                 ] })
               ] }),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx12("label", { children: "Grid Rows" }),
-                /* @__PURE__ */ jsx12(
+              /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx13("label", { children: "Grid Rows" }),
+                /* @__PURE__ */ jsx13(
                   "input",
                   {
                     type: "text",
@@ -5342,12 +5884,12 @@ function SectionEditorPlugin() {
                 )
               ] })
             ] }),
-            (currentLayout === "flex" || currentLayout === "grid") && /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsxs12("label", { children: [
+            (currentLayout === "flex" || currentLayout === "grid") && /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsxs13("label", { children: [
                 "Gap: ",
                 currentGap
               ] }),
-              /* @__PURE__ */ jsx12(
+              /* @__PURE__ */ jsx13(
                 "input",
                 {
                   type: "range",
@@ -5358,17 +5900,17 @@ function SectionEditorPlugin() {
                   className: "cms-range-input"
                 }
               ),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-preset-buttons", children: [
-                /* @__PURE__ */ jsx12("button", { onClick: () => setGap("0px"), type: "button", children: "0" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setGap("8px"), type: "button", children: "8" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setGap("16px"), type: "button", children: "16" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setGap("24px"), type: "button", children: "24" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setGap("32px"), type: "button", children: "32" })
+              /* @__PURE__ */ jsxs13("div", { className: "cms-preset-buttons", children: [
+                /* @__PURE__ */ jsx13("button", { onClick: () => setGap("0px"), type: "button", children: "0" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setGap("8px"), type: "button", children: "8" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setGap("16px"), type: "button", children: "16" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setGap("24px"), type: "button", children: "24" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setGap("32px"), type: "button", children: "32" })
               ] })
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx12("label", { children: "Padding" }),
-              /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx13("label", { children: "Padding" }),
+              /* @__PURE__ */ jsx13(
                 "input",
                 {
                   type: "text",
@@ -5378,17 +5920,17 @@ function SectionEditorPlugin() {
                   className: "cms-text-input"
                 }
               ),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-preset-buttons", children: [
-                /* @__PURE__ */ jsx12("button", { onClick: () => setPadding("0px"), type: "button", children: "0" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setPadding("20px"), type: "button", children: "20" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setPadding("40px"), type: "button", children: "40" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setPadding("60px"), type: "button", children: "60" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setPadding("80px"), type: "button", children: "80" })
+              /* @__PURE__ */ jsxs13("div", { className: "cms-preset-buttons", children: [
+                /* @__PURE__ */ jsx13("button", { onClick: () => setPadding("0px"), type: "button", children: "0" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setPadding("20px"), type: "button", children: "20" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setPadding("40px"), type: "button", children: "40" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setPadding("60px"), type: "button", children: "60" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setPadding("80px"), type: "button", children: "80" })
               ] })
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx12("label", { children: "Margin" }),
-              /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs13("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx13("label", { children: "Margin" }),
+              /* @__PURE__ */ jsx13(
                 "input",
                 {
                   type: "text",
@@ -5398,11 +5940,11 @@ function SectionEditorPlugin() {
                   className: "cms-text-input"
                 }
               ),
-              /* @__PURE__ */ jsxs12("div", { className: "cms-preset-buttons", children: [
-                /* @__PURE__ */ jsx12("button", { onClick: () => setMargin("0px"), type: "button", children: "0" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setMargin("20px 0"), type: "button", children: "20 V" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setMargin("40px 0"), type: "button", children: "40 V" }),
-                /* @__PURE__ */ jsx12("button", { onClick: () => setMargin("0 auto"), type: "button", children: "Center" })
+              /* @__PURE__ */ jsxs13("div", { className: "cms-preset-buttons", children: [
+                /* @__PURE__ */ jsx13("button", { onClick: () => setMargin("0px"), type: "button", children: "0" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setMargin("20px 0"), type: "button", children: "20 V" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setMargin("40px 0"), type: "button", children: "40 V" }),
+                /* @__PURE__ */ jsx13("button", { onClick: () => setMargin("0 auto"), type: "button", children: "Center" })
               ] })
             ] })
           ] })
@@ -5413,14 +5955,14 @@ function SectionEditorPlugin() {
 }
 
 // src/plugins/EmbedPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext12 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState14, useCallback as useCallback12, useRef as useRef10, useEffect as useEffect14 } from "react";
-import { $getSelection as $getSelection10, $isRangeSelection as $isRangeSelection10, $createParagraphNode as $createParagraphNode6 } from "lexical";
+import { useLexicalComposerContext as useLexicalComposerContext13 } from "@lexical/react/LexicalComposerContext";
+import { useState as useState15, useCallback as useCallback13, useRef as useRef11, useEffect as useEffect16 } from "react";
+import { $getSelection as $getSelection11, $isRangeSelection as $isRangeSelection11, $createParagraphNode as $createParagraphNode6 } from "lexical";
 
 // src/blocks/EmbedNode.tsx
-import { DecoratorNode as DecoratorNode3 } from "lexical";
-import { useCallback as useCallback11, useEffect as useEffect13, useRef as useRef9, useState as useState13 } from "react";
-import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+import { DecoratorNode as DecoratorNode4 } from "lexical";
+import { useCallback as useCallback12, useEffect as useEffect15, useRef as useRef10, useState as useState14 } from "react";
+import { Fragment as Fragment8, jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
 function detectEmbedType(url) {
   if (url.includes("youtube.com") || url.includes("youtu.be")) return "youtube";
   if (url.includes("facebook.com") || url.includes("fb.watch")) return "facebook";
@@ -5480,24 +6022,24 @@ function EmbedComponent({
   nodeKey,
   editor
 }) {
-  const wrapperRef = useRef9(null);
-  const [isResizing, setIsResizing] = useState13(false);
-  const [isSelected, setIsSelected] = useState13(false);
-  const [embedHtml, setEmbedHtml] = useState13("");
+  const wrapperRef = useRef10(null);
+  const [isResizing, setIsResizing] = useState14(false);
+  const [isSelected, setIsSelected] = useState14(false);
+  const [embedHtml, setEmbedHtml] = useState14("");
   const width = initialWidth || (type === "spotify" ? 300 : 560);
   const height = initialHeight || (type === "spotify" ? 380 : 315);
-  const [size, setSize] = useState13({
+  const [size, setSize] = useState14({
     width,
     height
   });
-  useEffect13(() => {
+  useEffect15(() => {
     setSize({
       width: initialWidth || (type === "spotify" ? 300 : 560),
       height: initialHeight || (type === "spotify" ? 380 : 315)
     });
   }, [initialWidth, initialHeight, type]);
   const embedUrl = getEmbedUrl(url, type);
-  useEffect13(() => {
+  useEffect15(() => {
     if (type === "instagram" || type === "twitter" || type === "tiktok") {
       loadOEmbed(url, type);
     }
@@ -5527,7 +6069,7 @@ function EmbedComponent({
       console.error("Failed to load oEmbed:", error);
     }
   };
-  const onResizeStart = useCallback11((e, direction) => {
+  const onResizeStart = useCallback12((e, direction) => {
     e.preventDefault();
     e.stopPropagation();
     setIsResizing(true);
@@ -5578,7 +6120,7 @@ function EmbedComponent({
   }, [size, editor, nodeKey]);
   const renderEmbed = () => {
     if (embedHtml && (type === "instagram" || type === "twitter" || type === "tiktok")) {
-      return /* @__PURE__ */ jsx13(
+      return /* @__PURE__ */ jsx14(
         "div",
         {
           dangerouslySetInnerHTML: { __html: embedHtml },
@@ -5587,7 +6129,7 @@ function EmbedComponent({
       );
     }
     if (type === "youtube" || type === "vimeo" || type === "facebook" || type === "spotify" || type === "soundcloud") {
-      return /* @__PURE__ */ jsx13(
+      return /* @__PURE__ */ jsx14(
         "iframe",
         {
           src: embedUrl,
@@ -5603,14 +6145,14 @@ function EmbedComponent({
         }
       );
     }
-    return /* @__PURE__ */ jsxs13("div", { style: {
+    return /* @__PURE__ */ jsxs14("div", { style: {
       padding: "20px",
       background: "#f8f9fa",
       borderRadius: "8px",
       textAlign: "center"
     }, children: [
-      /* @__PURE__ */ jsx13("p", { style: { margin: "0 0 10px 0", color: "#6c757d" }, children: "Embedded Content" }),
-      /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx14("p", { style: { margin: "0 0 10px 0", color: "#6c757d" }, children: "Embedded Content" }),
+      /* @__PURE__ */ jsx14(
         "a",
         {
           href: url,
@@ -5622,7 +6164,7 @@ function EmbedComponent({
       )
     ] });
   };
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     "div",
     {
       ref: wrapperRef,
@@ -5642,8 +6184,8 @@ function EmbedComponent({
       },
       children: [
         renderEmbed(),
-        isSelected && (type === "youtube" || type === "vimeo" || type === "facebook" || type === "spotify" || type === "soundcloud") && /* @__PURE__ */ jsxs13(Fragment7, { children: [
-          /* @__PURE__ */ jsx13(
+        isSelected && (type === "youtube" || type === "vimeo" || type === "facebook" || type === "spotify" || type === "soundcloud") && /* @__PURE__ */ jsxs14(Fragment8, { children: [
+          /* @__PURE__ */ jsx14(
             "div",
             {
               className: "embed-resize-handle embed-resize-handle-se",
@@ -5663,7 +6205,7 @@ function EmbedComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsx14(
             "div",
             {
               className: "embed-resize-handle embed-resize-handle-ne",
@@ -5688,7 +6230,7 @@ function EmbedComponent({
     }
   );
 }
-var EmbedNode = class _EmbedNode extends DecoratorNode3 {
+var EmbedNode = class _EmbedNode extends DecoratorNode4 {
   static getType() {
     return "embed";
   }
@@ -5715,7 +6257,7 @@ var EmbedNode = class _EmbedNode extends DecoratorNode3 {
     return false;
   }
   decorate(editor) {
-    return /* @__PURE__ */ jsx13(
+    return /* @__PURE__ */ jsx14(
       EmbedComponent,
       {
         url: this.__url,
@@ -5752,13 +6294,13 @@ function $createEmbedNode(url, type, width, height) {
 
 // src/plugins/EmbedPlugin.tsx
 import { MdVideoLibrary } from "react-icons/md";
-import { Fragment as Fragment8, jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
 function EmbedPlugin() {
-  const [editor] = useLexicalComposerContext12();
-  const [showModal, setShowModal] = useState14(false);
-  const [embedUrl, setEmbedUrl] = useState14("");
-  const modalRef = useRef10(null);
-  useEffect14(() => {
+  const [editor] = useLexicalComposerContext13();
+  const [showModal, setShowModal] = useState15(false);
+  const [embedUrl, setEmbedUrl] = useState15("");
+  const modalRef = useRef11(null);
+  useEffect16(() => {
     const handleClickOutside = (event) => {
       if (modalRef.current && !modalRef.current.contains(event.target)) {
         setShowModal(false);
@@ -5767,15 +6309,15 @@ function EmbedPlugin() {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  const openModal = useCallback12((event) => {
+  const openModal = useCallback13((event) => {
     setShowModal(true);
     setEmbedUrl("");
   }, []);
-  const insertEmbed = useCallback12(() => {
+  const insertEmbed = useCallback13(() => {
     if (!embedUrl.trim()) return;
     editor.update(() => {
-      const selection = $getSelection10();
-      if ($isRangeSelection10(selection)) {
+      const selection = $getSelection11();
+      if ($isRangeSelection11(selection)) {
         const embedNode = $createEmbedNode(embedUrl.trim());
         selection.insertNodes([embedNode]);
         const paragraph = $createParagraphNode6();
@@ -5786,7 +6328,7 @@ function EmbedPlugin() {
     setShowModal(false);
     setEmbedUrl("");
   }, [editor, embedUrl]);
-  const handleKeyDown = useCallback12((e) => {
+  const handleKeyDown = useCallback13((e) => {
     if (e.key === "Enter") {
       e.preventDefault();
       insertEmbed();
@@ -5794,38 +6336,38 @@ function EmbedPlugin() {
       setShowModal(false);
     }
   }, [insertEmbed]);
-  return /* @__PURE__ */ jsxs14("div", { className: "cms-embed-plugin", ref: modalRef, children: [
-    /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsxs15("div", { className: "cms-embed-plugin", ref: modalRef, children: [
+    /* @__PURE__ */ jsx15(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: openModal,
         title: "Insert Embed (YouTube, Facebook, Instagram, etc.)",
         type: "button",
-        children: /* @__PURE__ */ jsx14(MdVideoLibrary, { size: 18 })
+        children: /* @__PURE__ */ jsx15(MdVideoLibrary, { size: 18 })
       }
     ),
-    showModal && /* @__PURE__ */ jsxs14(Fragment8, { children: [
-      /* @__PURE__ */ jsx14("div", { className: "cms-modal-backdrop", onClick: () => setShowModal(false) }),
-      /* @__PURE__ */ jsxs14("div", { className: "cms-embed-modal", children: [
-        /* @__PURE__ */ jsx14("div", { className: "cms-embed-modal-header", children: /* @__PURE__ */ jsx14("span", { children: "Insert Embed" }) }),
-        /* @__PURE__ */ jsxs14("div", { className: "cms-embed-modal-content", children: [
-          /* @__PURE__ */ jsxs14("div", { className: "cms-embed-info", children: [
-            /* @__PURE__ */ jsx14("p", { children: "Paste a link from:" }),
-            /* @__PURE__ */ jsxs14("div", { className: "cms-embed-platforms", children: [
-              /* @__PURE__ */ jsx14("span", { className: "cms-embed-platform", children: "YouTube" }),
-              /* @__PURE__ */ jsx14("span", { className: "cms-embed-platform", children: "Facebook" }),
-              /* @__PURE__ */ jsx14("span", { className: "cms-embed-platform", children: "Instagram" }),
-              /* @__PURE__ */ jsx14("span", { className: "cms-embed-platform", children: "Twitter/X" }),
-              /* @__PURE__ */ jsx14("span", { className: "cms-embed-platform", children: "TikTok" }),
-              /* @__PURE__ */ jsx14("span", { className: "cms-embed-platform", children: "Vimeo" }),
-              /* @__PURE__ */ jsx14("span", { className: "cms-embed-platform", children: "Spotify" }),
-              /* @__PURE__ */ jsx14("span", { className: "cms-embed-platform", children: "SoundCloud" })
+    showModal && /* @__PURE__ */ jsxs15(Fragment9, { children: [
+      /* @__PURE__ */ jsx15("div", { className: "cms-modal-backdrop", onClick: () => setShowModal(false) }),
+      /* @__PURE__ */ jsxs15("div", { className: "cms-embed-modal", children: [
+        /* @__PURE__ */ jsx15("div", { className: "cms-embed-modal-header", children: /* @__PURE__ */ jsx15("span", { children: "Insert Embed" }) }),
+        /* @__PURE__ */ jsxs15("div", { className: "cms-embed-modal-content", children: [
+          /* @__PURE__ */ jsxs15("div", { className: "cms-embed-info", children: [
+            /* @__PURE__ */ jsx15("p", { children: "Paste a link from:" }),
+            /* @__PURE__ */ jsxs15("div", { className: "cms-embed-platforms", children: [
+              /* @__PURE__ */ jsx15("span", { className: "cms-embed-platform", children: "YouTube" }),
+              /* @__PURE__ */ jsx15("span", { className: "cms-embed-platform", children: "Facebook" }),
+              /* @__PURE__ */ jsx15("span", { className: "cms-embed-platform", children: "Instagram" }),
+              /* @__PURE__ */ jsx15("span", { className: "cms-embed-platform", children: "Twitter/X" }),
+              /* @__PURE__ */ jsx15("span", { className: "cms-embed-platform", children: "TikTok" }),
+              /* @__PURE__ */ jsx15("span", { className: "cms-embed-platform", children: "Vimeo" }),
+              /* @__PURE__ */ jsx15("span", { className: "cms-embed-platform", children: "Spotify" }),
+              /* @__PURE__ */ jsx15("span", { className: "cms-embed-platform", children: "SoundCloud" })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs14("div", { className: "cms-form-group", children: [
-            /* @__PURE__ */ jsx14("label", { htmlFor: "embed-url", children: "URL" }),
-            /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsxs15("div", { className: "cms-form-group", children: [
+            /* @__PURE__ */ jsx15("label", { htmlFor: "embed-url", children: "URL" }),
+            /* @__PURE__ */ jsx15(
               "input",
               {
                 id: "embed-url",
@@ -5839,20 +6381,20 @@ function EmbedPlugin() {
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs14("div", { className: "cms-embed-examples", children: [
-            /* @__PURE__ */ jsx14("p", { className: "cms-embed-examples-title", children: "Example URLs:" }),
-            /* @__PURE__ */ jsxs14("ul", { className: "cms-embed-examples-list", children: [
-              /* @__PURE__ */ jsx14("li", { children: "https://www.youtube.com/watch?v=dQw4w9WgXcQ" }),
-              /* @__PURE__ */ jsx14("li", { children: "https://www.facebook.com/username/posts/123456" }),
-              /* @__PURE__ */ jsx14("li", { children: "https://www.instagram.com/p/ABC123/" }),
-              /* @__PURE__ */ jsx14("li", { children: "https://twitter.com/username/status/123456" }),
-              /* @__PURE__ */ jsx14("li", { children: "https://www.tiktok.com/@username/video/123456" }),
-              /* @__PURE__ */ jsx14("li", { children: "https://vimeo.com/123456789" }),
-              /* @__PURE__ */ jsx14("li", { children: "https://open.spotify.com/track/123456" })
+          /* @__PURE__ */ jsxs15("div", { className: "cms-embed-examples", children: [
+            /* @__PURE__ */ jsx15("p", { className: "cms-embed-examples-title", children: "Example URLs:" }),
+            /* @__PURE__ */ jsxs15("ul", { className: "cms-embed-examples-list", children: [
+              /* @__PURE__ */ jsx15("li", { children: "https://www.youtube.com/watch?v=dQw4w9WgXcQ" }),
+              /* @__PURE__ */ jsx15("li", { children: "https://www.facebook.com/username/posts/123456" }),
+              /* @__PURE__ */ jsx15("li", { children: "https://www.instagram.com/p/ABC123/" }),
+              /* @__PURE__ */ jsx15("li", { children: "https://twitter.com/username/status/123456" }),
+              /* @__PURE__ */ jsx15("li", { children: "https://www.tiktok.com/@username/video/123456" }),
+              /* @__PURE__ */ jsx15("li", { children: "https://vimeo.com/123456789" }),
+              /* @__PURE__ */ jsx15("li", { children: "https://open.spotify.com/track/123456" })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs14("div", { className: "cms-modal-actions", children: [
-            /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsxs15("div", { className: "cms-modal-actions", children: [
+            /* @__PURE__ */ jsx15(
               "button",
               {
                 onClick: () => setShowModal(false),
@@ -5861,7 +6403,7 @@ function EmbedPlugin() {
                 children: "Cancel"
               }
             ),
-            /* @__PURE__ */ jsx14(
+            /* @__PURE__ */ jsx15(
               "button",
               {
                 onClick: insertEmbed,
@@ -5879,34 +6421,36 @@ function EmbedPlugin() {
 }
 
 // src/core/EditorShell.tsx
-import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
 function EditorShell({
   onChange,
   onImageAdded,
+  onVideoAdded,
   useBase64Url
 }) {
-  return /* @__PURE__ */ jsxs15("div", { className: "cms-editor-shell", children: [
-    /* @__PURE__ */ jsx15(ToolbarPlugin, {}),
-    /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsxs16("div", { className: "cms-editor-shell", children: [
+    /* @__PURE__ */ jsx16(ToolbarPlugin, {}),
+    /* @__PURE__ */ jsx16(
       RichTextPlugin,
       {
-        contentEditable: /* @__PURE__ */ jsx15(ContentEditable, { className: "cms-editor-content" }),
-        placeholder: /* @__PURE__ */ jsx15("div", { className: "cms-editor-placeholder", children: "Start typing or press / for commands..." }),
+        contentEditable: /* @__PURE__ */ jsx16(ContentEditable, { className: "cms-editor-content" }),
+        placeholder: /* @__PURE__ */ jsx16("div", { className: "cms-editor-placeholder", children: "Start typing or press / for commands..." }),
         ErrorBoundary: LexicalErrorBoundary
       }
     ),
-    /* @__PURE__ */ jsx15(HistoryPlugin, {}),
-    /* @__PURE__ */ jsx15(ListPlugin, {}),
-    /* @__PURE__ */ jsx15(LexicalLinkPlugin, {}),
-    /* @__PURE__ */ jsx15(LexicalTablePlugin, {}),
-    /* @__PURE__ */ jsx15(SlashCommandPlugin, {}),
-    /* @__PURE__ */ jsx15(ImageUploadPlugin, { onImageAdded, useBase64Url }),
-    /* @__PURE__ */ jsx15(ImageEditorPlugin, {}),
-    /* @__PURE__ */ jsx15(LinkPlugin, {}),
-    /* @__PURE__ */ jsx15(SectionEditorPlugin, {}),
-    /* @__PURE__ */ jsx15(EmbedPlugin, {}),
-    /* @__PURE__ */ jsx15(TablePlugin, {}),
-    onChange && /* @__PURE__ */ jsx15(
+    /* @__PURE__ */ jsx16(HistoryPlugin, {}),
+    /* @__PURE__ */ jsx16(ListPlugin, {}),
+    /* @__PURE__ */ jsx16(LexicalLinkPlugin, {}),
+    /* @__PURE__ */ jsx16(LexicalTablePlugin, {}),
+    /* @__PURE__ */ jsx16(SlashCommandPlugin, {}),
+    /* @__PURE__ */ jsx16(ImageUploadPlugin, { onImageAdded, useBase64Url }),
+    /* @__PURE__ */ jsx16(VideoUploadPlugin, { onVideoAdded, useBase64Url }),
+    /* @__PURE__ */ jsx16(ImageEditorPlugin, {}),
+    /* @__PURE__ */ jsx16(LinkPlugin, {}),
+    /* @__PURE__ */ jsx16(SectionEditorPlugin, {}),
+    /* @__PURE__ */ jsx16(EmbedPlugin, {}),
+    /* @__PURE__ */ jsx16(TablePlugin, {}),
+    onChange && /* @__PURE__ */ jsx16(
       OnChangePlugin,
       {
         onChange: (editorState) => {
@@ -5953,6 +6497,7 @@ function createEditorConfig(value) {
       TableCellNode,
       TableRowNode,
       ImageNode,
+      VideoNode,
       QuoteNode,
       ColumnsNode,
       ColumnNode,
@@ -5965,18 +6510,20 @@ function createEditorConfig(value) {
 }
 
 // src/core/CMSBlockEditor.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 function CMSBlockEditor({
   value,
   onChange,
   onImageAdded,
+  onVideoAdded,
   useBase64Url = true
 }) {
-  return /* @__PURE__ */ jsx16(LexicalComposer, { initialConfig: createEditorConfig(value), children: /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx17(LexicalComposer, { initialConfig: createEditorConfig(value), children: /* @__PURE__ */ jsx17(
     EditorShell,
     {
       onChange,
       onImageAdded,
+      onVideoAdded,
       useBase64Url
     }
   ) });
@@ -5987,12 +6534,12 @@ import { LexicalComposer as LexicalComposer2 } from "@lexical/react/LexicalCompo
 import { RichTextPlugin as RichTextPlugin2 } from "@lexical/react/LexicalRichTextPlugin";
 import { ContentEditable as ContentEditable2 } from "@lexical/react/LexicalContentEditable";
 import LexicalErrorBoundary2 from "@lexical/react/LexicalErrorBoundary";
-import { useEffect as useEffect15 } from "react";
-import { useLexicalComposerContext as useLexicalComposerContext13 } from "@lexical/react/LexicalComposerContext";
-import { jsx as jsx17, jsxs as jsxs16 } from "react/jsx-runtime";
+import { useEffect as useEffect17 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext14 } from "@lexical/react/LexicalComposerContext";
+import { jsx as jsx18, jsxs as jsxs17 } from "react/jsx-runtime";
 function ReadOnlyPlugin() {
-  const [editor] = useLexicalComposerContext13();
-  useEffect15(() => {
+  const [editor] = useLexicalComposerContext14();
+  useEffect17(() => {
     editor.setEditable(false);
   }, [editor]);
   return null;
@@ -6002,22 +6549,24 @@ function CMSRenderer({ content, className = "" }) {
     ...createEditorConfig(content),
     editable: false
   };
-  return /* @__PURE__ */ jsx17(LexicalComposer2, { initialConfig: config, children: /* @__PURE__ */ jsxs16("div", { className: `cms-renderer ${className}`, children: [
-    /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx18(LexicalComposer2, { initialConfig: config, children: /* @__PURE__ */ jsxs17("div", { className: `cms-renderer ${className}`, children: [
+    /* @__PURE__ */ jsx18(
       RichTextPlugin2,
       {
-        contentEditable: /* @__PURE__ */ jsx17(ContentEditable2, { className: "cms-renderer-content" }),
+        contentEditable: /* @__PURE__ */ jsx18(ContentEditable2, { className: "cms-renderer-content" }),
         placeholder: null,
         ErrorBoundary: LexicalErrorBoundary2
       }
     ),
-    /* @__PURE__ */ jsx17(ReadOnlyPlugin, {})
+    /* @__PURE__ */ jsx18(ReadOnlyPlugin, {})
   ] }) });
 }
 export {
   CMSBlockEditor,
   CMSRenderer,
+  ImageNode,
   OPEN_IMAGE_EDITOR_COMMAND,
+  VideoNode,
   appendHTML,
   copyMarkdownToClipboard,
   downloadHTML,