cms-block-editor 1.0.9 → 1.0.12

package/dist/index.mjs

@@ -12,8 +12,8 @@ import { TablePlugin as LexicalTablePlugin } from "@lexical/react/LexicalTablePl
 import LexicalErrorBoundary from "@lexical/react/LexicalErrorBoundary";
 
 // src/plugins/SlashCommandPlugin.tsx
-import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
-import { useEffect as useEffect2, useState as useState3 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext2 } from "@lexical/react/LexicalComposerContext";
+import { useEffect as useEffect3, useState as useState4 } from "react";
 import {
   $createParagraphNode,
   $getSelection,
@@ -24,8 +24,305 @@ import { $createListNode, $createListItemNode } from "@lexical/list";
 
 // src/blocks/ImageNode.tsx
 import { DecoratorNode } from "lexical";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect as useEffect2, useRef, useState as useState2 } from "react";
+
+// src/plugins/ImageEditorPlugin.tsx
+import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
+import { useEffect, useState } from "react";
+import { COMMAND_PRIORITY_LOW, createCommand } from "lexical";
+import { jsx, jsxs } from "react/jsx-runtime";
+var OPEN_IMAGE_EDITOR_COMMAND = createCommand();
+function ImageEditorPlugin() {
+  const [editor] = useLexicalComposerContext();
+  const [editorState, setEditorState] = useState({
+    isOpen: false,
+    nodeKey: null,
+    src: "",
+    originalSrc: "",
+    crop: { x: 0, y: 0, width: 100, height: 100 },
+    filters: {
+      brightness: 100,
+      contrast: 100,
+      saturation: 100,
+      blur: 0,
+      grayscale: 0,
+      sepia: 0,
+      hueRotate: 0
+    }
+  });
+  useEffect(() => {
+    return editor.registerCommand(
+      OPEN_IMAGE_EDITOR_COMMAND,
+      ({ nodeKey, src }) => {
+        setEditorState({
+          isOpen: true,
+          nodeKey,
+          src,
+          originalSrc: src,
+          crop: { x: 0, y: 0, width: 100, height: 100 },
+          filters: {
+            brightness: 100,
+            contrast: 100,
+            saturation: 100,
+            blur: 0,
+            grayscale: 0,
+            sepia: 0,
+            hueRotate: 0
+          }
+        });
+        return true;
+      },
+      COMMAND_PRIORITY_LOW
+    );
+  }, [editor]);
+  const applyFilters = () => {
+    const canvas = document.createElement("canvas");
+    const ctx = canvas.getContext("2d");
+    const img = new Image();
+    img.crossOrigin = "anonymous";
+    img.onload = () => {
+      const cropWidth = img.width * editorState.crop.width / 100;
+      const cropHeight = img.height * editorState.crop.height / 100;
+      const cropX = img.width * editorState.crop.x / 100;
+      const cropY = img.height * editorState.crop.y / 100;
+      canvas.width = cropWidth;
+      canvas.height = cropHeight;
+      if (ctx) {
+        const { brightness, contrast, saturation, blur, grayscale, sepia, hueRotate } = editorState.filters;
+        ctx.filter = `
+          brightness(${brightness}%)
+          contrast(${contrast}%)
+          saturate(${saturation}%)
+          blur(${blur}px)
+          grayscale(${grayscale}%)
+          sepia(${sepia}%)
+          hue-rotate(${hueRotate}deg)
+        `;
+        ctx.drawImage(img, cropX, cropY, cropWidth, cropHeight, 0, 0, cropWidth, cropHeight);
+        const editedSrc = canvas.toDataURL("image/png");
+        editor.update(() => {
+          const node = editor.getEditorState()._nodeMap.get(editorState.nodeKey);
+          if (node && node instanceof ImageNode) {
+            const writable = node.getWritable();
+            writable.__src = editedSrc;
+          }
+        });
+        handleClose();
+      }
+    };
+    img.src = editorState.originalSrc;
+  };
+  const handleClose = () => {
+    setEditorState((prev) => ({ ...prev, isOpen: false, nodeKey: null }));
+  };
+  const resetFilters = () => {
+    setEditorState((prev) => ({
+      ...prev,
+      filters: {
+        brightness: 100,
+        contrast: 100,
+        saturation: 100,
+        blur: 0,
+        grayscale: 0,
+        sepia: 0,
+        hueRotate: 0
+      }
+    }));
+  };
+  const applyPreset = (preset) => {
+    const presets = {
+      vintage: { brightness: 110, contrast: 90, saturation: 80, blur: 0, grayscale: 0, sepia: 40, hueRotate: 0 },
+      bw: { brightness: 100, contrast: 110, saturation: 0, blur: 0, grayscale: 100, sepia: 0, hueRotate: 0 },
+      warm: { brightness: 105, contrast: 100, saturation: 110, blur: 0, grayscale: 0, sepia: 20, hueRotate: 10 },
+      cool: { brightness: 100, contrast: 100, saturation: 110, blur: 0, grayscale: 0, sepia: 0, hueRotate: 180 },
+      dramatic: { brightness: 90, contrast: 130, saturation: 120, blur: 0, grayscale: 0, sepia: 0, hueRotate: 0 },
+      soft: { brightness: 110, contrast: 85, saturation: 90, blur: 1, grayscale: 0, sepia: 0, hueRotate: 0 }
+    };
+    if (presets[preset]) {
+      setEditorState((prev) => ({ ...prev, filters: presets[preset] }));
+    }
+  };
+  if (!editorState.isOpen) return null;
+  const filterStyle = {
+    filter: `
+      brightness(${editorState.filters.brightness}%)
+      contrast(${editorState.filters.contrast}%)
+      saturate(${editorState.filters.saturation}%)
+      blur(${editorState.filters.blur}px)
+      grayscale(${editorState.filters.grayscale}%)
+      sepia(${editorState.filters.sepia}%)
+      hue-rotate(${editorState.filters.hueRotate}deg)
+    `
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "cms-image-editor-modal", children: [
+    /* @__PURE__ */ jsx("div", { className: "cms-image-editor-overlay", onClick: handleClose }),
+    /* @__PURE__ */ jsxs("div", { className: "cms-image-editor-content", children: [
+      /* @__PURE__ */ jsxs("div", { className: "cms-image-editor-header", children: [
+        /* @__PURE__ */ jsx("h2", { children: "Edit Image" }),
+        /* @__PURE__ */ jsx("button", { onClick: handleClose, className: "cms-close-btn", children: "\xD7" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "cms-image-editor-body", children: [
+        /* @__PURE__ */ jsx("div", { className: "cms-image-editor-preview", children: /* @__PURE__ */ jsx("img", { src: editorState.src, alt: "Preview", style: filterStyle }) }),
+        /* @__PURE__ */ jsxs("div", { className: "cms-image-editor-controls", children: [
+          /* @__PURE__ */ jsxs("div", { className: "cms-editor-section", children: [
+            /* @__PURE__ */ jsx("h3", { children: "Presets" }),
+            /* @__PURE__ */ jsxs("div", { className: "cms-preset-buttons", children: [
+              /* @__PURE__ */ jsx("button", { onClick: () => applyPreset("vintage"), children: "Vintage" }),
+              /* @__PURE__ */ jsx("button", { onClick: () => applyPreset("bw"), children: "B&W" }),
+              /* @__PURE__ */ jsx("button", { onClick: () => applyPreset("warm"), children: "Warm" }),
+              /* @__PURE__ */ jsx("button", { onClick: () => applyPreset("cool"), children: "Cool" }),
+              /* @__PURE__ */ jsx("button", { onClick: () => applyPreset("dramatic"), children: "Dramatic" }),
+              /* @__PURE__ */ jsx("button", { onClick: () => applyPreset("soft"), children: "Soft" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "cms-editor-section", children: [
+            /* @__PURE__ */ jsx("h3", { children: "Filters" }),
+            /* @__PURE__ */ jsx("div", { className: "cms-filter-control", children: /* @__PURE__ */ jsxs("label", { children: [
+              "Brightness: ",
+              editorState.filters.brightness,
+              "%",
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "range",
+                  min: "0",
+                  max: "200",
+                  value: editorState.filters.brightness,
+                  onChange: (e) => setEditorState((prev) => ({
+                    ...prev,
+                    filters: { ...prev.filters, brightness: Number(e.target.value) }
+                  }))
+                }
+              )
+            ] }) }),
+            /* @__PURE__ */ jsx("div", { className: "cms-filter-control", children: /* @__PURE__ */ jsxs("label", { children: [
+              "Contrast: ",
+              editorState.filters.contrast,
+              "%",
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "range",
+                  min: "0",
+                  max: "200",
+                  value: editorState.filters.contrast,
+                  onChange: (e) => setEditorState((prev) => ({
+                    ...prev,
+                    filters: { ...prev.filters, contrast: Number(e.target.value) }
+                  }))
+                }
+              )
+            ] }) }),
+            /* @__PURE__ */ jsx("div", { className: "cms-filter-control", children: /* @__PURE__ */ jsxs("label", { children: [
+              "Saturation: ",
+              editorState.filters.saturation,
+              "%",
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "range",
+                  min: "0",
+                  max: "200",
+                  value: editorState.filters.saturation,
+                  onChange: (e) => setEditorState((prev) => ({
+                    ...prev,
+                    filters: { ...prev.filters, saturation: Number(e.target.value) }
+                  }))
+                }
+              )
+            ] }) }),
+            /* @__PURE__ */ jsx("div", { className: "cms-filter-control", children: /* @__PURE__ */ jsxs("label", { children: [
+              "Blur: ",
+              editorState.filters.blur,
+              "px",
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "range",
+                  min: "0",
+                  max: "10",
+                  value: editorState.filters.blur,
+                  onChange: (e) => setEditorState((prev) => ({
+                    ...prev,
+                    filters: { ...prev.filters, blur: Number(e.target.value) }
+                  }))
+                }
+              )
+            ] }) }),
+            /* @__PURE__ */ jsx("div", { className: "cms-filter-control", children: /* @__PURE__ */ jsxs("label", { children: [
+              "Grayscale: ",
+              editorState.filters.grayscale,
+              "%",
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "range",
+                  min: "0",
+                  max: "100",
+                  value: editorState.filters.grayscale,
+                  onChange: (e) => setEditorState((prev) => ({
+                    ...prev,
+                    filters: { ...prev.filters, grayscale: Number(e.target.value) }
+                  }))
+                }
+              )
+            ] }) }),
+            /* @__PURE__ */ jsx("div", { className: "cms-filter-control", children: /* @__PURE__ */ jsxs("label", { children: [
+              "Sepia: ",
+              editorState.filters.sepia,
+              "%",
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "range",
+                  min: "0",
+                  max: "100",
+                  value: editorState.filters.sepia,
+                  onChange: (e) => setEditorState((prev) => ({
+                    ...prev,
+                    filters: { ...prev.filters, sepia: Number(e.target.value) }
+                  }))
+                }
+              )
+            ] }) }),
+            /* @__PURE__ */ jsx("div", { className: "cms-filter-control", children: /* @__PURE__ */ jsxs("label", { children: [
+              "Hue Rotate: ",
+              editorState.filters.hueRotate,
+              "\xB0",
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "range",
+                  min: "0",
+                  max: "360",
+                  value: editorState.filters.hueRotate,
+                  onChange: (e) => setEditorState((prev) => ({
+                    ...prev,
+                    filters: { ...prev.filters, hueRotate: Number(e.target.value) }
+                  }))
+                }
+              )
+            ] }) })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "cms-editor-section", children: [
+            /* @__PURE__ */ jsx("h3", { children: "Crop" }),
+            /* @__PURE__ */ jsx("div", { className: "cms-crop-info", children: /* @__PURE__ */ jsx("p", { children: "Click and drag on the image to crop (coming soon)" }) })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "cms-image-editor-footer", children: [
+        /* @__PURE__ */ jsx("button", { onClick: resetFilters, className: "cms-btn-secondary", children: "Reset" }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("button", { onClick: handleClose, className: "cms-btn-secondary", children: "Cancel" }),
+          /* @__PURE__ */ jsx("button", { onClick: applyFilters, className: "cms-btn-primary", children: "Apply" })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+
+// src/blocks/ImageNode.tsx
+import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function ImageComponent({
   src,
   alt,
@@ -36,14 +333,14 @@ function ImageComponent({
 }) {
   const imageRef = useRef(null);
   const wrapperRef = useRef(null);
-  const [isResizing, setIsResizing] = useState(false);
-  const [isSelected, setIsSelected] = useState(false);
-  const [isDragging, setIsDragging] = useState(false);
-  const [size, setSize] = useState({
+  const [isResizing, setIsResizing] = useState2(false);
+  const [isSelected, setIsSelected] = useState2(false);
+  const [isDragging, setIsDragging] = useState2(false);
+  const [size, setSize] = useState2({
     width: initialWidth || 0,
     height: initialHeight || 0
   });
-  useEffect(() => {
+  useEffect2(() => {
     if (imageRef.current && (!size.width || !size.height)) {
       const img = imageRef.current;
       const onLoad = () => {
@@ -152,7 +449,7 @@ function ImageComponent({
     document.addEventListener("mousemove", onMouseMove);
     document.addEventListener("mouseup", onMouseUp);
   }, [src, alt, size, nodeKey, editor]);
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsxs2(
     "div",
     {
       ref: wrapperRef,
@@ -168,7 +465,7 @@ function ImageComponent({
         cursor: isSelected ? "move" : "pointer"
       },
       children: [
-        /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx2(
           "img",
           {
             ref: imageRef,
@@ -185,8 +482,40 @@ function ImageComponent({
             }
           }
         ),
-        isSelected && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(
+        isSelected && /* @__PURE__ */ jsxs2(Fragment, { children: [
+          /* @__PURE__ */ jsx2(
+            "button",
+            {
+              onClick: (e) => {
+                e.stopPropagation();
+                editor.dispatchCommand(OPEN_IMAGE_EDITOR_COMMAND, { nodeKey, src });
+              },
+              style: {
+                position: "absolute",
+                top: "8px",
+                right: "8px",
+                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)",
+                zIndex: 10,
+                transition: "all 0.2s"
+              },
+              onMouseEnter: (e) => {
+                e.currentTarget.style.background = "#5568d3";
+              },
+              onMouseLeave: (e) => {
+                e.currentTarget.style.background = "#667eea";
+              },
+              children: "\u270F\uFE0F Edit"
+            }
+          ),
+          /* @__PURE__ */ jsx2(
             "div",
             {
               className: "image-resize-handle image-resize-handle-nw",
@@ -205,7 +534,7 @@ function ImageComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx2(
             "div",
             {
               className: "image-resize-handle image-resize-handle-ne",
@@ -224,7 +553,7 @@ function ImageComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx2(
             "div",
             {
               className: "image-resize-handle image-resize-handle-sw",
@@ -243,7 +572,7 @@ function ImageComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx2(
             "div",
             {
               className: "image-resize-handle image-resize-handle-se",
@@ -262,7 +591,7 @@ function ImageComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx2(
             "div",
             {
               className: "image-resize-handle image-resize-handle-n",
@@ -281,7 +610,7 @@ function ImageComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx2(
             "div",
             {
               className: "image-resize-handle image-resize-handle-s",
@@ -300,7 +629,7 @@ function ImageComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx2(
             "div",
             {
               className: "image-resize-handle image-resize-handle-e",
@@ -319,7 +648,7 @@ function ImageComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx2(
             "div",
             {
               className: "image-resize-handle image-resize-handle-w",
@@ -370,7 +699,7 @@ var ImageNode = class _ImageNode extends DecoratorNode {
     return false;
   }
   decorate(editor) {
-    return /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx2(
       ImageComponent,
       {
         src: this.__src,
@@ -404,8 +733,8 @@ var ImageNode = class _ImageNode extends DecoratorNode {
 
 // src/blocks/YouTubeNode.tsx
 import { DecoratorNode as DecoratorNode2 } from "lexical";
-import { useCallback as useCallback2, useRef as useRef2, useState as useState2 } from "react";
-import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { useCallback as useCallback2, 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,
   width: initialWidth,
@@ -414,10 +743,10 @@ function YouTubeComponent({
   editor
 }) {
   const wrapperRef = useRef2(null);
-  const [isResizing, setIsResizing] = useState2(false);
-  const [isSelected, setIsSelected] = useState2(false);
-  const [isDragging, setIsDragging] = useState2(false);
-  const [size, setSize] = useState2({
+  const [isResizing, setIsResizing] = useState3(false);
+  const [isSelected, setIsSelected] = useState3(false);
+  const [isDragging, setIsDragging] = useState3(false);
+  const [size, setSize] = useState3({
     width: initialWidth || 560,
     height: initialHeight || 315
   });
@@ -513,7 +842,7 @@ function YouTubeComponent({
     document.addEventListener("mousemove", onMouseMove);
     document.addEventListener("mouseup", onMouseUp);
   }, [id, size, nodeKey, editor]);
-  return /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsxs3(
     "div",
     {
       ref: wrapperRef,
@@ -529,7 +858,7 @@ function YouTubeComponent({
         cursor: isSelected ? "move" : "pointer"
       },
       children: [
-        /* @__PURE__ */ jsx2(
+        /* @__PURE__ */ jsx3(
           "iframe",
           {
             src: `https://www.youtube.com/embed/${id}`,
@@ -546,8 +875,8 @@ function YouTubeComponent({
             }
           }
         ),
-        isSelected && /* @__PURE__ */ jsxs2(Fragment2, { children: [
-          /* @__PURE__ */ jsx2(
+        isSelected && /* @__PURE__ */ jsxs3(Fragment2, { children: [
+          /* @__PURE__ */ jsx3(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-nw",
@@ -567,7 +896,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx2(
+          /* @__PURE__ */ jsx3(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-ne",
@@ -587,7 +916,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx2(
+          /* @__PURE__ */ jsx3(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-sw",
@@ -607,7 +936,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx2(
+          /* @__PURE__ */ jsx3(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-se",
@@ -627,7 +956,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx2(
+          /* @__PURE__ */ jsx3(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-n",
@@ -647,7 +976,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx2(
+          /* @__PURE__ */ jsx3(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-s",
@@ -667,7 +996,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx2(
+          /* @__PURE__ */ jsx3(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-e",
@@ -687,7 +1016,7 @@ function YouTubeComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx2(
+          /* @__PURE__ */ jsx3(
             "div",
             {
               className: "youtube-resize-handle youtube-resize-handle-w",
@@ -738,7 +1067,7 @@ var YouTubeNode = class _YouTubeNode extends DecoratorNode2 {
     return false;
   }
   decorate(editor) {
-    return /* @__PURE__ */ jsx2(
+    return /* @__PURE__ */ jsx3(
       YouTubeComponent,
       {
         id: this.__id,
@@ -876,12 +1205,12 @@ function $createColumnNode() {
 }
 
 // src/plugins/SlashCommandPlugin.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 function SlashCommandPlugin() {
-  const [editor] = useLexicalComposerContext();
-  const [showMenu, setShowMenu] = useState3(false);
-  const [search, setSearch] = useState3("");
-  const [selectedIndex, setSelectedIndex] = useState3(0);
+  const [editor] = useLexicalComposerContext2();
+  const [showMenu, setShowMenu] = useState4(false);
+  const [search, setSearch] = useState4("");
+  const [selectedIndex, setSelectedIndex] = useState4(0);
   const commands = [
     {
       title: "Heading 1",
@@ -1064,7 +1393,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));
   });
-  useEffect2(() => {
+  useEffect3(() => {
     return editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {
         const selection = $getSelection();
@@ -1086,7 +1415,7 @@ function SlashCommandPlugin() {
       });
     });
   }, [editor, showMenu]);
-  useEffect2(() => {
+  useEffect3(() => {
     if (!showMenu) return;
     const handleKeyDown = (event) => {
       if (event.key === "ArrowDown") {
@@ -1132,17 +1461,17 @@ function SlashCommandPlugin() {
   if (!showMenu || filteredCommands.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsxs3("div", { className: "slash-menu", children: [
-    /* @__PURE__ */ jsx3("div", { className: "slash-menu-title", children: "Commands" }),
-    filteredCommands.map((cmd, index) => /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs4("div", { className: "slash-menu", children: [
+    /* @__PURE__ */ jsx4("div", { className: "slash-menu-title", children: "Commands" }),
+    filteredCommands.map((cmd, index) => /* @__PURE__ */ jsxs4(
       "div",
       {
         className: `slash-menu-item ${index === selectedIndex ? "selected" : ""}`,
         onClick: () => executeCommand(cmd),
         onMouseEnter: () => setSelectedIndex(index),
         children: [
-          /* @__PURE__ */ jsx3("div", { className: "slash-menu-item-title", children: cmd.title }),
-          /* @__PURE__ */ jsx3("div", { className: "slash-menu-item-description", children: cmd.description })
+          /* @__PURE__ */ jsx4("div", { className: "slash-menu-item-title", children: cmd.title }),
+          /* @__PURE__ */ jsx4("div", { className: "slash-menu-item-description", children: cmd.description })
         ]
       },
       cmd.title
@@ -1151,7 +1480,7 @@ function SlashCommandPlugin() {
 }
 
 // src/plugins/ToolbarPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext7 } from "@lexical/react/LexicalComposerContext";
+import { useLexicalComposerContext as useLexicalComposerContext8 } from "@lexical/react/LexicalComposerContext";
 import {
   $getSelection as $getSelection6,
   $isRangeSelection as $isRangeSelection6,
@@ -1170,12 +1499,12 @@ import {
 import { $createCodeNode as $createCodeNode2 } from "@lexical/code";
 
 // src/plugins/ColorPickerPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext2 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState4, useCallback as useCallback3, useEffect as useEffect3, useRef as useRef3 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext3 } from "@lexical/react/LexicalComposerContext";
+import { useState as useState5, useCallback as useCallback3, useEffect as useEffect4, useRef as useRef3 } 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 jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 var PRESET_COLORS = [
   "#000000",
   "#434343",
@@ -1259,16 +1588,16 @@ var PRESET_COLORS = [
   "#4c1130"
 ];
 function ColorPickerPlugin() {
-  const [editor] = useLexicalComposerContext2();
-  const [showTextColorPicker, setShowTextColorPicker] = useState4(false);
-  const [showBgColorPicker, setShowBgColorPicker] = useState4(false);
-  const [currentTextColor, setCurrentTextColor] = useState4("#000000");
-  const [currentBgColor, setCurrentBgColor] = useState4("transparent");
-  const [textColorPosition, setTextColorPosition] = useState4({ top: 0, left: 0 });
-  const [bgColorPosition, setBgColorPosition] = useState4({ top: 0, left: 0 });
+  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);
-  useEffect3(() => {
+  useEffect4(() => {
     return editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {
         const selection = $getSelection2();
@@ -1292,7 +1621,7 @@ function ColorPickerPlugin() {
       });
     });
   }, [editor]);
-  useEffect3(() => {
+  useEffect4(() => {
     const handleClickOutside = (event) => {
       if (textColorRef.current && !textColorRef.current.contains(event.target)) {
         setShowTextColorPicker(false);
@@ -1366,18 +1695,18 @@ function ColorPickerPlugin() {
     setCurrentBgColor("transparent");
     setShowBgColorPicker(false);
   }, [editor]);
-  return /* @__PURE__ */ jsxs4(Fragment3, { children: [
-    /* @__PURE__ */ jsxs4("div", { className: "cms-color-picker-plugin", ref: textColorRef, children: [
-      /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsxs5(Fragment3, { children: [
+    /* @__PURE__ */ jsxs5("div", { className: "cms-color-picker-plugin", ref: textColorRef, children: [
+      /* @__PURE__ */ jsx5(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleTextColorPicker,
           title: "Text Color",
           type: "button",
-          children: /* @__PURE__ */ jsxs4("div", { className: "cms-color-button-wrapper", children: [
-            /* @__PURE__ */ jsx4(MdFormatColorText, { size: 18 }),
-            /* @__PURE__ */ jsx4(
+          children: /* @__PURE__ */ jsxs5("div", { className: "cms-color-button-wrapper", children: [
+            /* @__PURE__ */ jsx5(MdFormatColorText, { size: 18 }),
+            /* @__PURE__ */ jsx5(
               "div",
               {
                 className: "cms-color-indicator",
@@ -1387,7 +1716,7 @@ function ColorPickerPlugin() {
           ] })
         }
       ),
-      showTextColorPicker && /* @__PURE__ */ jsxs4(
+      showTextColorPicker && /* @__PURE__ */ jsxs5(
         "div",
         {
           className: "cms-color-picker-menu",
@@ -1396,9 +1725,9 @@ function ColorPickerPlugin() {
             left: `${textColorPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsxs4("div", { className: "cms-color-picker-header", children: [
-              /* @__PURE__ */ jsx4("span", { children: "Text Color" }),
-              /* @__PURE__ */ jsx4(
+            /* @__PURE__ */ jsxs5("div", { className: "cms-color-picker-header", children: [
+              /* @__PURE__ */ jsx5("span", { children: "Text Color" }),
+              /* @__PURE__ */ jsx5(
                 "button",
                 {
                   className: "cms-color-remove-btn",
@@ -1408,7 +1737,7 @@ function ColorPickerPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx4("div", { className: "cms-color-grid", children: PRESET_COLORS.map((color) => /* @__PURE__ */ jsx4(
+            /* @__PURE__ */ jsx5("div", { className: "cms-color-grid", children: PRESET_COLORS.map((color) => /* @__PURE__ */ jsx5(
               "button",
               {
                 className: `cms-color-swatch ${currentTextColor === color ? "active" : ""}`,
@@ -1419,9 +1748,9 @@ function ColorPickerPlugin() {
               },
               color
             )) }),
-            /* @__PURE__ */ jsx4("div", { className: "cms-color-custom", children: /* @__PURE__ */ jsxs4("label", { children: [
+            /* @__PURE__ */ jsx5("div", { className: "cms-color-custom", children: /* @__PURE__ */ jsxs5("label", { children: [
               "Custom:",
-              /* @__PURE__ */ jsx4(
+              /* @__PURE__ */ jsx5(
                 "input",
                 {
                   type: "color",
@@ -1435,17 +1764,17 @@ function ColorPickerPlugin() {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs4("div", { className: "cms-color-picker-plugin", ref: bgColorRef, children: [
-      /* @__PURE__ */ jsx4(
+    /* @__PURE__ */ jsxs5("div", { className: "cms-color-picker-plugin", ref: bgColorRef, children: [
+      /* @__PURE__ */ jsx5(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleBgColorPicker,
           title: "Background Color",
           type: "button",
-          children: /* @__PURE__ */ jsxs4("div", { className: "cms-color-button-wrapper", children: [
-            /* @__PURE__ */ jsx4(MdFormatColorFill, { size: 18 }),
-            /* @__PURE__ */ jsx4(
+          children: /* @__PURE__ */ jsxs5("div", { className: "cms-color-button-wrapper", children: [
+            /* @__PURE__ */ jsx5(MdFormatColorFill, { size: 18 }),
+            /* @__PURE__ */ jsx5(
               "div",
               {
                 className: "cms-color-indicator",
@@ -1455,7 +1784,7 @@ function ColorPickerPlugin() {
           ] })
         }
       ),
-      showBgColorPicker && /* @__PURE__ */ jsxs4(
+      showBgColorPicker && /* @__PURE__ */ jsxs5(
         "div",
         {
           className: "cms-color-picker-menu",
@@ -1464,9 +1793,9 @@ function ColorPickerPlugin() {
             left: `${bgColorPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsxs4("div", { className: "cms-color-picker-header", children: [
-              /* @__PURE__ */ jsx4("span", { children: "Background Color" }),
-              /* @__PURE__ */ jsx4(
+            /* @__PURE__ */ jsxs5("div", { className: "cms-color-picker-header", children: [
+              /* @__PURE__ */ jsx5("span", { children: "Background Color" }),
+              /* @__PURE__ */ jsx5(
                 "button",
                 {
                   className: "cms-color-remove-btn",
@@ -1476,7 +1805,7 @@ function ColorPickerPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx4("div", { className: "cms-color-grid", children: PRESET_COLORS.map((color) => /* @__PURE__ */ jsx4(
+            /* @__PURE__ */ jsx5("div", { className: "cms-color-grid", children: PRESET_COLORS.map((color) => /* @__PURE__ */ jsx5(
               "button",
               {
                 className: `cms-color-swatch ${currentBgColor === color ? "active" : ""}`,
@@ -1487,9 +1816,9 @@ function ColorPickerPlugin() {
               },
               color
             )) }),
-            /* @__PURE__ */ jsx4("div", { className: "cms-color-custom", children: /* @__PURE__ */ jsxs4("label", { children: [
+            /* @__PURE__ */ jsx5("div", { className: "cms-color-custom", children: /* @__PURE__ */ jsxs5("label", { children: [
               "Custom:",
-              /* @__PURE__ */ jsx4(
+              /* @__PURE__ */ jsx5(
                 "input",
                 {
                   type: "color",
@@ -1507,29 +1836,29 @@ function ColorPickerPlugin() {
 }
 
 // src/plugins/SpacingPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext3 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState5, useCallback as useCallback4, useEffect as useEffect4, useRef as useRef4 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext4 } from "@lexical/react/LexicalComposerContext";
+import { useState as useState6, useCallback as useCallback4, useEffect as useEffect5, useRef as useRef4 } 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 jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 var SPACING_PRESETS = [0, 4, 8, 12, 16, 20, 24, 32, 40, 48];
 function SpacingPlugin() {
-  const [editor] = useLexicalComposerContext3();
-  const [showSpacingMenu, setShowSpacingMenu] = useState5(false);
-  const [spacingPosition, setSpacingPosition] = useState5({ top: 0, left: 0 });
+  const [editor] = useLexicalComposerContext4();
+  const [showSpacingMenu, setShowSpacingMenu] = useState6(false);
+  const [spacingPosition, setSpacingPosition] = useState6({ top: 0, left: 0 });
   const spacingRef = useRef4(null);
-  const [display, setDisplay] = useState5("inline");
-  const [paddingTop, setPaddingTop] = useState5(0);
-  const [paddingRight, setPaddingRight] = useState5(0);
-  const [paddingBottom, setPaddingBottom] = useState5(0);
-  const [paddingLeft, setPaddingLeft] = useState5(0);
-  const [marginTop, setMarginTop] = useState5(0);
-  const [marginRight, setMarginRight] = useState5(0);
-  const [marginBottom, setMarginBottom] = useState5(0);
-  const [marginLeft, setMarginLeft] = useState5(0);
-  useEffect4(() => {
+  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(() => {
     return editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {
         const selection = $getSelection3();
@@ -1565,7 +1894,7 @@ function SpacingPlugin() {
       });
     });
   }, [editor]);
-  useEffect4(() => {
+  useEffect5(() => {
     const handleClickOutside = (event) => {
       if (spacingRef.current && !spacingRef.current.contains(event.target)) {
         setShowSpacingMenu(false);
@@ -1659,18 +1988,18 @@ function SpacingPlugin() {
     }
     setShowSpacingMenu(!showSpacingMenu);
   }, [showSpacingMenu]);
-  return /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-plugin", ref: spacingRef, children: [
-    /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-plugin", ref: spacingRef, children: [
+    /* @__PURE__ */ jsx6(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: toggleSpacingMenu,
         title: "Spacing & Display",
         type: "button",
-        children: /* @__PURE__ */ jsx5(MdSettings, { size: 18 })
+        children: /* @__PURE__ */ jsx6(MdSettings, { size: 18 })
       }
     ),
-    showSpacingMenu && /* @__PURE__ */ jsxs5(
+    showSpacingMenu && /* @__PURE__ */ jsxs6(
       "div",
       {
         className: "cms-spacing-menu",
@@ -1679,9 +2008,9 @@ function SpacingPlugin() {
           left: `${spacingPosition.left}px`
         },
         children: [
-          /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-header", children: [
-            /* @__PURE__ */ jsx5("span", { children: "Spacing & Display" }),
-            /* @__PURE__ */ jsx5(
+          /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-header", children: [
+            /* @__PURE__ */ jsx6("span", { children: "Spacing & Display" }),
+            /* @__PURE__ */ jsx6(
               "button",
               {
                 className: "cms-spacing-reset-btn",
@@ -1691,10 +2020,10 @@ function SpacingPlugin() {
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-section", children: [
-            /* @__PURE__ */ jsx5("div", { className: "cms-spacing-label", children: "Display Mode" }),
-            /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-display-buttons", children: [
-              /* @__PURE__ */ jsx5(
+          /* @__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(
                 "button",
                 {
                   className: `cms-spacing-display-btn ${display === "inline" ? "active" : ""}`,
@@ -1703,7 +2032,7 @@ function SpacingPlugin() {
                   children: "Inline"
                 }
               ),
-              /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsx6(
                 "button",
                 {
                   className: `cms-spacing-display-btn ${display === "inline-block" ? "active" : ""}`,
@@ -1712,7 +2041,7 @@ function SpacingPlugin() {
                   children: "Inline Block"
                 }
               ),
-              /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsx6(
                 "button",
                 {
                   className: `cms-spacing-display-btn ${display === "block" ? "active" : ""}`,
@@ -1723,12 +2052,12 @@ function SpacingPlugin() {
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-section", children: [
-            /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-label", children: [
-              /* @__PURE__ */ jsx5(TbBoxPadding, { size: 16 }),
-              /* @__PURE__ */ jsx5("span", { children: "Padding (px)" })
+          /* @__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__ */ jsx5("div", { className: "cms-spacing-quick-buttons", children: SPACING_PRESETS.map((value) => /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsx6("div", { className: "cms-spacing-quick-buttons", children: SPACING_PRESETS.map((value) => /* @__PURE__ */ jsx6(
               "button",
               {
                 className: "cms-spacing-quick-btn",
@@ -1738,10 +2067,10 @@ function SpacingPlugin() {
               },
               `padding-${value}`
             )) }),
-            /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-controls", children: [
-              /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx5("label", { children: "Top" }),
-                /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-controls", children: [
+              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx6("label", { children: "Top" }),
+                /* @__PURE__ */ jsx6(
                   "input",
                   {
                     type: "number",
@@ -1752,9 +2081,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx5("label", { children: "Right" }),
-                /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx6("label", { children: "Right" }),
+                /* @__PURE__ */ jsx6(
                   "input",
                   {
                     type: "number",
@@ -1765,9 +2094,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx5("label", { children: "Bottom" }),
-                /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx6("label", { children: "Bottom" }),
+                /* @__PURE__ */ jsx6(
                   "input",
                   {
                     type: "number",
@@ -1778,9 +2107,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx5("label", { children: "Left" }),
-                /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx6("label", { children: "Left" }),
+                /* @__PURE__ */ jsx6(
                   "input",
                   {
                     type: "number",
@@ -1793,12 +2122,12 @@ function SpacingPlugin() {
               ] })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-section", children: [
-            /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-label", children: [
-              /* @__PURE__ */ jsx5(TbBoxMargin, { size: 16 }),
-              /* @__PURE__ */ jsx5("span", { children: "Margin (px)" })
+          /* @__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__ */ jsx5("div", { className: "cms-spacing-quick-buttons", children: SPACING_PRESETS.map((value) => /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsx6("div", { className: "cms-spacing-quick-buttons", children: SPACING_PRESETS.map((value) => /* @__PURE__ */ jsx6(
               "button",
               {
                 className: "cms-spacing-quick-btn",
@@ -1808,10 +2137,10 @@ function SpacingPlugin() {
               },
               `margin-${value}`
             )) }),
-            /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-controls", children: [
-              /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx5("label", { children: "Top" }),
-                /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-controls", children: [
+              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx6("label", { children: "Top" }),
+                /* @__PURE__ */ jsx6(
                   "input",
                   {
                     type: "number",
@@ -1822,9 +2151,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx5("label", { children: "Right" }),
-                /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx6("label", { children: "Right" }),
+                /* @__PURE__ */ jsx6(
                   "input",
                   {
                     type: "number",
@@ -1835,9 +2164,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx5("label", { children: "Bottom" }),
-                /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx6("label", { children: "Bottom" }),
+                /* @__PURE__ */ jsx6(
                   "input",
                   {
                     type: "number",
@@ -1848,9 +2177,9 @@ function SpacingPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs5("div", { className: "cms-spacing-control", children: [
-                /* @__PURE__ */ jsx5("label", { children: "Left" }),
-                /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsxs6("div", { className: "cms-spacing-control", children: [
+                /* @__PURE__ */ jsx6("label", { children: "Left" }),
+                /* @__PURE__ */ jsx6(
                   "input",
                   {
                     type: "number",
@@ -1870,8 +2199,8 @@ function SpacingPlugin() {
 }
 
 // src/plugins/ExportImportPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext4 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState6, useCallback as useCallback5, useRef as useRef5, useEffect as useEffect5 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext5 } from "@lexical/react/LexicalComposerContext";
+import { useState as useState7, useCallback as useCallback5, useRef as useRef5, useEffect as useEffect6 } from "react";
 import { MdFileDownload, MdFileUpload } from "react-icons/md";
 
 // src/utils/htmlExport.ts
@@ -2343,19 +2672,19 @@ async function pasteMarkdownFromClipboard(editor) {
 }
 
 // src/plugins/ExportImportPlugin.tsx
-import { Fragment as Fragment4, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 function ExportImportPlugin() {
-  const [editor] = useLexicalComposerContext4();
-  const [showExportMenu, setShowExportMenu] = useState6(false);
-  const [showImportMenu, setShowImportMenu] = useState6(false);
-  const [exportPosition, setExportPosition] = useState6({ top: 0, left: 0 });
-  const [importPosition, setImportPosition] = useState6({ top: 0, left: 0 });
-  const [notification, setNotification] = useState6(null);
+  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] = useState6("html");
-  useEffect5(() => {
+  const [importType, setImportType] = useState7("html");
+  useEffect6(() => {
     const handleClickOutside = (event) => {
       if (exportRef.current && !exportRef.current.contains(event.target)) {
         setShowExportMenu(false);
@@ -2367,7 +2696,7 @@ function ExportImportPlugin() {
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  useEffect5(() => {
+  useEffect6(() => {
     if (notification) {
       const timer = setTimeout(() => setNotification(null), 3e3);
       return () => clearTimeout(timer);
@@ -2483,19 +2812,19 @@ function ExportImportPlugin() {
       showNotification("Failed to paste Markdown");
     }
   }, [editor]);
-  return /* @__PURE__ */ jsxs6(Fragment4, { children: [
-    /* @__PURE__ */ jsxs6("div", { className: "cms-export-import-plugin", ref: exportRef, children: [
-      /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsxs7(Fragment4, { children: [
+    /* @__PURE__ */ jsxs7("div", { className: "cms-export-import-plugin", ref: exportRef, children: [
+      /* @__PURE__ */ jsx7(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleExportMenu,
           title: "Export Content",
           type: "button",
-          children: /* @__PURE__ */ jsx6(MdFileDownload, { size: 18 })
+          children: /* @__PURE__ */ jsx7(MdFileDownload, { size: 18 })
         }
       ),
-      showExportMenu && /* @__PURE__ */ jsxs6(
+      showExportMenu && /* @__PURE__ */ jsxs7(
         "div",
         {
           className: "cms-export-import-menu",
@@ -2504,79 +2833,79 @@ function ExportImportPlugin() {
             left: `${exportPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsx6("div", { className: "cms-export-import-header", children: "Export Content" }),
-            /* @__PURE__ */ jsxs6(
+            /* @__PURE__ */ jsx7("div", { className: "cms-export-import-header", children: "Export Content" }),
+            /* @__PURE__ */ jsxs7(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleExportHTML,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx6("span", { className: "cms-export-import-icon", children: "\u{1F4C4}" }),
-                  /* @__PURE__ */ jsxs6("div", { children: [
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-title", children: "HTML" }),
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-desc", children: "Download as HTML file" })
+                  /* @__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__ */ jsxs6(
+            /* @__PURE__ */ jsxs7(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleExportHTMLWithStyles,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx6("span", { className: "cms-export-import-icon", children: "\u{1F3A8}" }),
-                  /* @__PURE__ */ jsxs6("div", { children: [
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-title", children: "HTML + Styles" }),
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-desc", children: "Complete HTML document" })
+                  /* @__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__ */ jsxs6(
+            /* @__PURE__ */ jsxs7(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleExportMarkdown,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx6("span", { className: "cms-export-import-icon", children: "\u{1F4DD}" }),
-                  /* @__PURE__ */ jsxs6("div", { children: [
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-title", children: "Markdown" }),
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-desc", children: "Download as .md file" })
+                  /* @__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__ */ jsx6("div", { className: "cms-export-import-divider" }),
-            /* @__PURE__ */ jsxs6(
+            /* @__PURE__ */ jsx7("div", { className: "cms-export-import-divider" }),
+            /* @__PURE__ */ jsxs7(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleCopyHTML,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx6("span", { className: "cms-export-import-icon", children: "\u{1F4CB}" }),
-                  /* @__PURE__ */ jsxs6("div", { children: [
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-title", children: "Copy HTML" }),
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-desc", children: "Copy to clipboard" })
+                  /* @__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__ */ jsxs6(
+            /* @__PURE__ */ jsxs7(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleCopyMarkdown,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx6("span", { className: "cms-export-import-icon", children: "\u{1F4CB}" }),
-                  /* @__PURE__ */ jsxs6("div", { children: [
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-title", children: "Copy Markdown" }),
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-desc", children: "Copy to clipboard" })
+                  /* @__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" })
                   ] })
                 ]
               }
@@ -2585,18 +2914,18 @@ function ExportImportPlugin() {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs6("div", { className: "cms-export-import-plugin", ref: importRef, children: [
-      /* @__PURE__ */ jsx6(
+    /* @__PURE__ */ jsxs7("div", { className: "cms-export-import-plugin", ref: importRef, children: [
+      /* @__PURE__ */ jsx7(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleImportMenu,
           title: "Import Content",
           type: "button",
-          children: /* @__PURE__ */ jsx6(MdFileUpload, { size: 18 })
+          children: /* @__PURE__ */ jsx7(MdFileUpload, { size: 18 })
         }
       ),
-      showImportMenu && /* @__PURE__ */ jsxs6(
+      showImportMenu && /* @__PURE__ */ jsxs7(
         "div",
         {
           className: "cms-export-import-menu",
@@ -2605,9 +2934,9 @@ function ExportImportPlugin() {
             left: `${importPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsx6("div", { className: "cms-export-import-header", children: "Import Content" }),
-            /* @__PURE__ */ jsxs6("div", { className: "cms-import-type-selector", children: [
-              /* @__PURE__ */ jsx6(
+            /* @__PURE__ */ jsx7("div", { className: "cms-export-import-header", children: "Import Content" }),
+            /* @__PURE__ */ jsxs7("div", { className: "cms-import-type-selector", children: [
+              /* @__PURE__ */ jsx7(
                 "button",
                 {
                   className: `cms-import-type-btn ${importType === "html" ? "active" : ""}`,
@@ -2616,7 +2945,7 @@ function ExportImportPlugin() {
                   children: "HTML"
                 }
               ),
-              /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsx7(
                 "button",
                 {
                   className: `cms-import-type-btn ${importType === "markdown" ? "active" : ""}`,
@@ -2626,17 +2955,17 @@ function ExportImportPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs6(
+            /* @__PURE__ */ jsxs7(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: handleImportFile,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx6("span", { className: "cms-export-import-icon", children: "\u{1F4C1}" }),
-                  /* @__PURE__ */ jsxs6("div", { children: [
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-title", children: "From File" }),
-                    /* @__PURE__ */ jsxs6("div", { className: "cms-export-import-desc", 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: [
                       "Upload ",
                       importType.toUpperCase(),
                       " file"
@@ -2645,17 +2974,17 @@ function ExportImportPlugin() {
                 ]
               }
             ),
-            /* @__PURE__ */ jsxs6(
+            /* @__PURE__ */ jsxs7(
               "button",
               {
                 className: "cms-export-import-item",
                 onClick: importType === "html" ? handlePasteHTML : handlePasteMarkdown,
                 type: "button",
                 children: [
-                  /* @__PURE__ */ jsx6("span", { className: "cms-export-import-icon", children: "\u{1F4CB}" }),
-                  /* @__PURE__ */ jsxs6("div", { children: [
-                    /* @__PURE__ */ jsx6("div", { className: "cms-export-import-title", children: "From Clipboard" }),
-                    /* @__PURE__ */ jsxs6("div", { className: "cms-export-import-desc", 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: [
                       "Paste ",
                       importType.toUpperCase()
                     ] })
@@ -2666,7 +2995,7 @@ function ExportImportPlugin() {
           ]
         }
       ),
-      /* @__PURE__ */ jsx6(
+      /* @__PURE__ */ jsx7(
         "input",
         {
           ref: fileInputRef,
@@ -2677,13 +3006,13 @@ function ExportImportPlugin() {
         }
       )
     ] }),
-    notification && /* @__PURE__ */ jsx6("div", { className: "cms-export-import-notification", children: notification })
+    notification && /* @__PURE__ */ jsx7("div", { className: "cms-export-import-notification", children: notification })
   ] });
 }
 
 // src/plugins/SectionCreatorPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext5 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState7, useCallback as useCallback6, useRef as useRef6, useEffect as useEffect6 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext6 } from "@lexical/react/LexicalComposerContext";
+import { useState as useState8, useCallback as useCallback6, useRef as useRef6, useEffect as useEffect7 } from "react";
 import { $getSelection as $getSelection4, $isRangeSelection as $isRangeSelection4, $createParagraphNode as $createParagraphNode3 } from "lexical";
 
 // src/blocks/SectionNode.tsx
@@ -3264,13 +3593,13 @@ var SECTION_TEMPLATES = [
 // src/plugins/SectionCreatorPlugin.tsx
 import { $generateNodesFromDOM as $generateNodesFromDOM2 } from "@lexical/html";
 import { MdViewModule } from "react-icons/md";
-import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 function SectionCreatorPlugin() {
-  const [editor] = useLexicalComposerContext5();
-  const [showSectionMenu, setShowSectionMenu] = useState7(false);
-  const [sectionPosition, setSectionPosition] = useState7({ top: 0, left: 0 });
+  const [editor] = useLexicalComposerContext6();
+  const [showSectionMenu, setShowSectionMenu] = useState8(false);
+  const [sectionPosition, setSectionPosition] = useState8({ top: 0, left: 0 });
   const sectionRef = useRef6(null);
-  useEffect6(() => {
+  useEffect7(() => {
     const handleClickOutside = (event) => {
       if (sectionRef.current && !sectionRef.current.contains(event.target)) {
         setShowSectionMenu(false);
@@ -3313,18 +3642,18 @@ function SectionCreatorPlugin() {
     });
     setShowSectionMenu(false);
   }, [editor]);
-  return /* @__PURE__ */ jsxs7("div", { className: "cms-section-creator-plugin", ref: sectionRef, children: [
-    /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsxs8("div", { className: "cms-section-creator-plugin", ref: sectionRef, children: [
+    /* @__PURE__ */ jsx8(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: toggleSectionMenu,
         title: "Insert Section",
         type: "button",
-        children: /* @__PURE__ */ jsx7(MdViewModule, { size: 18 })
+        children: /* @__PURE__ */ jsx8(MdViewModule, { size: 18 })
       }
     ),
-    showSectionMenu && /* @__PURE__ */ jsxs7(
+    showSectionMenu && /* @__PURE__ */ jsxs8(
       "div",
       {
         className: "cms-section-menu",
@@ -3333,24 +3662,24 @@ function SectionCreatorPlugin() {
           left: `${sectionPosition.left}px`
         },
         children: [
-          /* @__PURE__ */ jsx7("div", { className: "cms-section-menu-header", children: /* @__PURE__ */ jsx7("span", { children: "Insert Section" }) }),
-          /* @__PURE__ */ jsx7("div", { className: "cms-section-grid", children: SECTION_TEMPLATES.map((template) => /* @__PURE__ */ jsxs7(
+          /* @__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(
             "button",
             {
               className: "cms-section-card",
               onClick: () => insertSection(template),
               type: "button",
               children: [
-                /* @__PURE__ */ jsx7("div", { className: "cms-section-card-icon", children: template.icon }),
-                /* @__PURE__ */ jsxs7("div", { className: "cms-section-card-content", children: [
-                  /* @__PURE__ */ jsx7("div", { className: "cms-section-card-title", children: template.name }),
-                  /* @__PURE__ */ jsx7("div", { className: "cms-section-card-desc", children: template.description })
+                /* @__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 })
                 ] })
               ]
             },
             template.type
           )) }),
-          /* @__PURE__ */ jsx7("div", { className: "cms-section-menu-footer", children: /* @__PURE__ */ jsx7("p", { children: "\u{1F4A1} Tip: Sections are fully editable after insertion" }) })
+          /* @__PURE__ */ jsx8("div", { className: "cms-section-menu-footer", children: /* @__PURE__ */ jsx8("p", { children: "\u{1F4A1} Tip: Sections are fully editable after insertion" }) })
         ]
       }
     )
@@ -3358,22 +3687,22 @@ function SectionCreatorPlugin() {
 }
 
 // src/plugins/TablePlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext6 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState8, useCallback as useCallback7, useRef as useRef7, useEffect as useEffect7 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext7 } from "@lexical/react/LexicalComposerContext";
+import { useState as useState9, useCallback as useCallback7, useRef as useRef7, useEffect as useEffect8 } 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 jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 function TablePlugin() {
-  const [editor] = useLexicalComposerContext6();
-  const [showModal, setShowModal] = useState8(false);
-  const [rows, setRows] = useState8(3);
-  const [columns, setColumns] = useState8(3);
-  const [includeHeaders, setIncludeHeaders] = useState8(true);
+  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);
-  useEffect7(() => {
+  useEffect8(() => {
     const handleClickOutside = (event) => {
       if (modalRef.current && !modalRef.current.contains(event.target)) {
         setShowModal(false);
@@ -3412,31 +3741,31 @@ function TablePlugin() {
       setShowModal(false);
     }
   }, [insertTable]);
-  return /* @__PURE__ */ jsxs8("div", { className: "cms-table-plugin", ref: modalRef, children: [
-    /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsxs9("div", { className: "cms-table-plugin", ref: modalRef, children: [
+    /* @__PURE__ */ jsx9(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: openModal,
         title: "Insert Table",
         type: "button",
-        children: /* @__PURE__ */ jsx8(MdTableChart, { size: 18 })
+        children: /* @__PURE__ */ jsx9(MdTableChart, { size: 18 })
       }
     ),
-    showModal && /* @__PURE__ */ jsxs8(Fragment5, { children: [
-      /* @__PURE__ */ jsx8("div", { className: "cms-modal-backdrop", onClick: () => setShowModal(false) }),
-      /* @__PURE__ */ jsxs8("div", { className: "cms-table-modal", children: [
-        /* @__PURE__ */ jsx8("div", { className: "cms-table-modal-header", children: /* @__PURE__ */ jsx8("span", { children: "Insert Table" }) }),
-        /* @__PURE__ */ jsxs8("div", { className: "cms-table-modal-content", children: [
-          /* @__PURE__ */ jsxs8("div", { className: "cms-table-preview", children: [
-            /* @__PURE__ */ jsx8("div", { className: "cms-table-preview-grid", children: Array.from({ length: rows }).map((_, rowIndex) => /* @__PURE__ */ jsx8("div", { className: "cms-table-preview-row", children: Array.from({ length: columns }).map((_2, colIndex) => /* @__PURE__ */ jsx8(
+    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(
               "div",
               {
                 className: `cms-table-preview-cell ${includeHeaders && rowIndex === 0 ? "header" : ""}`
               },
               colIndex
             )) }, rowIndex)) }),
-            /* @__PURE__ */ jsxs8("div", { className: "cms-table-preview-label", children: [
+            /* @__PURE__ */ jsxs9("div", { className: "cms-table-preview-label", children: [
               rows,
               " \xD7 ",
               columns,
@@ -3444,10 +3773,10 @@ function TablePlugin() {
               includeHeaders ? "(with headers)" : ""
             ] })
           ] }),
-          /* @__PURE__ */ jsxs8("div", { className: "cms-form-group", children: [
-            /* @__PURE__ */ jsx8("label", { htmlFor: "table-rows", children: "Rows" }),
-            /* @__PURE__ */ jsxs8("div", { className: "cms-number-input-group", children: [
-              /* @__PURE__ */ jsx8(
+          /* @__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(
                 "button",
                 {
                   onClick: () => setRows(Math.max(1, rows - 1)),
@@ -3456,7 +3785,7 @@ function TablePlugin() {
                   children: "\u2212"
                 }
               ),
-              /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx9(
                 "input",
                 {
                   id: "table-rows",
@@ -3469,7 +3798,7 @@ function TablePlugin() {
                   className: "cms-number-input"
                 }
               ),
-              /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx9(
                 "button",
                 {
                   onClick: () => setRows(Math.min(20, rows + 1)),
@@ -3480,10 +3809,10 @@ function TablePlugin() {
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxs8("div", { className: "cms-form-group", children: [
-            /* @__PURE__ */ jsx8("label", { htmlFor: "table-columns", children: "Columns" }),
-            /* @__PURE__ */ jsxs8("div", { className: "cms-number-input-group", children: [
-              /* @__PURE__ */ jsx8(
+          /* @__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(
                 "button",
                 {
                   onClick: () => setColumns(Math.max(1, columns - 1)),
@@ -3492,7 +3821,7 @@ function TablePlugin() {
                   children: "\u2212"
                 }
               ),
-              /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx9(
                 "input",
                 {
                   id: "table-columns",
@@ -3505,7 +3834,7 @@ function TablePlugin() {
                   className: "cms-number-input"
                 }
               ),
-              /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx9(
                 "button",
                 {
                   onClick: () => setColumns(Math.min(10, columns + 1)),
@@ -3516,8 +3845,8 @@ function TablePlugin() {
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsx8("div", { className: "cms-form-group", children: /* @__PURE__ */ jsxs8("label", { className: "cms-checkbox-label", children: [
-            /* @__PURE__ */ jsx8(
+          /* @__PURE__ */ jsx9("div", { className: "cms-form-group", children: /* @__PURE__ */ jsxs9("label", { className: "cms-checkbox-label", children: [
+            /* @__PURE__ */ jsx9(
               "input",
               {
                 type: "checkbox",
@@ -3526,12 +3855,12 @@ function TablePlugin() {
                 className: "cms-checkbox"
               }
             ),
-            /* @__PURE__ */ jsx8("span", { children: "Include header row" })
+            /* @__PURE__ */ jsx9("span", { children: "Include header row" })
           ] }) }),
-          /* @__PURE__ */ jsxs8("div", { className: "cms-table-presets", children: [
-            /* @__PURE__ */ jsx8("p", { className: "cms-table-presets-title", children: "Quick Presets:" }),
-            /* @__PURE__ */ jsxs8("div", { className: "cms-table-preset-buttons", children: [
-              /* @__PURE__ */ jsx8(
+          /* @__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(
                 "button",
                 {
                   onClick: () => {
@@ -3544,7 +3873,7 @@ function TablePlugin() {
                   children: "3\xD73"
                 }
               ),
-              /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx9(
                 "button",
                 {
                   onClick: () => {
@@ -3557,7 +3886,7 @@ function TablePlugin() {
                   children: "5\xD73"
                 }
               ),
-              /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx9(
                 "button",
                 {
                   onClick: () => {
@@ -3570,7 +3899,7 @@ function TablePlugin() {
                   children: "4\xD74"
                 }
               ),
-              /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx9(
                 "button",
                 {
                   onClick: () => {
@@ -3585,8 +3914,8 @@ function TablePlugin() {
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxs8("div", { className: "cms-modal-actions", children: [
-            /* @__PURE__ */ jsx8(
+          /* @__PURE__ */ jsxs9("div", { className: "cms-modal-actions", children: [
+            /* @__PURE__ */ jsx9(
               "button",
               {
                 onClick: () => setShowModal(false),
@@ -3595,7 +3924,7 @@ function TablePlugin() {
                 children: "Cancel"
               }
             ),
-            /* @__PURE__ */ jsx8(
+            /* @__PURE__ */ jsx9(
               "button",
               {
                 onClick: insertTable,
@@ -3612,7 +3941,7 @@ function TablePlugin() {
 }
 
 // src/plugins/ToolbarPlugin.tsx
-import { useState as useState9, useCallback as useCallback8, useEffect as useEffect8 } from "react";
+import { useState as useState10, useCallback as useCallback8, useEffect as useEffect9 } from "react";
 import {
   MdUndo,
   MdRedo,
@@ -3641,18 +3970,18 @@ import {
   LuHeading2,
   LuHeading3
 } from "react-icons/lu";
-import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 function ToolbarPlugin() {
-  const [editor] = useLexicalComposerContext7();
-  const [isBold, setIsBold] = useState9(false);
-  const [isItalic, setIsItalic] = useState9(false);
-  const [isUnderline, setIsUnderline] = useState9(false);
-  const [isStrikethrough, setIsStrikethrough] = useState9(false);
-  const [isCode, setIsCode] = useState9(false);
-  const [blockType, setBlockType] = useState9("paragraph");
-  const [showLayoutMenu, setShowLayoutMenu] = useState9(false);
-  const [layoutMenuPosition, setLayoutMenuPosition] = useState9({ top: 0, left: 0 });
-  useEffect8(() => {
+  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(() => {
     return editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {
         const selection = $getSelection6();
@@ -3803,242 +4132,242 @@ function ToolbarPlugin() {
   const handleRedo = useCallback8(() => {
     editor.dispatchCommand(REDO_COMMAND, void 0);
   }, [editor]);
-  return /* @__PURE__ */ jsxs9("div", { className: "cms-toolbar", children: [
-    /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsxs10("div", { className: "cms-toolbar", children: [
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: handleUndo,
         title: "Undo (Cmd+Z)",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdUndo, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdUndo, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: handleRedo,
         title: "Redo (Cmd+Shift+Z)",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdRedo, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdRedo, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "paragraph" ? "active" : ""}`,
         onClick: formatParagraph,
         title: "Paragraph",
         type: "button",
-        children: /* @__PURE__ */ jsx9(BiParagraph, { size: 18 })
+        children: /* @__PURE__ */ jsx10(BiParagraph, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "h1" ? "active" : ""}`,
         onClick: () => formatHeading("h1"),
         title: "Heading 1",
         type: "button",
-        children: /* @__PURE__ */ jsx9(LuHeading1, { size: 18 })
+        children: /* @__PURE__ */ jsx10(LuHeading1, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "h2" ? "active" : ""}`,
         onClick: () => formatHeading("h2"),
         title: "Heading 2",
         type: "button",
-        children: /* @__PURE__ */ jsx9(LuHeading2, { size: 18 })
+        children: /* @__PURE__ */ jsx10(LuHeading2, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "h3" ? "active" : ""}`,
         onClick: () => formatHeading("h3"),
         title: "Heading 3",
         type: "button",
-        children: /* @__PURE__ */ jsx9(LuHeading3, { size: 18 })
+        children: /* @__PURE__ */ jsx10(LuHeading3, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${isBold ? "active" : ""}`,
         onClick: formatBold,
         title: "Bold (Cmd+B)",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatBold, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatBold, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${isItalic ? "active" : ""}`,
         onClick: formatItalic,
         title: "Italic (Cmd+I)",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatItalic, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatItalic, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${isUnderline ? "active" : ""}`,
         onClick: formatUnderline,
         title: "Underline (Cmd+U)",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatUnderlined, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatUnderlined, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${isStrikethrough ? "active" : ""}`,
         onClick: formatStrikethrough,
         title: "Strikethrough",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatStrikethrough, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatStrikethrough, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${isCode ? "active" : ""}`,
         onClick: formatInlineCode,
         title: "Inline Code",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdCode, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdCode, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(ColorPickerPlugin, {}),
-    /* @__PURE__ */ jsx9(SpacingPlugin, {}),
-    /* @__PURE__ */ jsx9("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(ColorPickerPlugin, {}),
+    /* @__PURE__ */ jsx10(SpacingPlugin, {}),
+    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatBulletList,
         title: "Bullet List",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatListBulleted, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatListBulleted, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatNumberedList,
         title: "Numbered List",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatListNumbered, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatListNumbered, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatAlignLeft,
         title: "Align Left",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatAlignLeft, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatAlignLeft, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatAlignCenter,
         title: "Align Center",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatAlignCenter, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatAlignCenter, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatAlignRight,
         title: "Align Right",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatAlignRight, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatAlignRight, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: formatAlignJustify,
         title: "Justify",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatAlignJustify, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatAlignJustify, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "quote" ? "active" : ""}`,
         onClick: formatQuote,
         title: "Quote",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdFormatQuote, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdFormatQuote, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: `cms-toolbar-button ${blockType === "code" ? "active" : ""}`,
         onClick: formatCode,
         title: "Code Block",
         type: "button",
-        children: /* @__PURE__ */ jsx9(BiCodeBlock, { size: 18 })
+        children: /* @__PURE__ */ jsx10(BiCodeBlock, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10("div", { className: "cms-toolbar-divider" }),
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: insertLink,
         title: "Insert Link",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdLink, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdLink, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: handleImageUpload,
         title: "Upload Image",
         type: "button",
-        children: /* @__PURE__ */ jsx9(MdImage, { size: 18 })
+        children: /* @__PURE__ */ jsx10(MdImage, { size: 18 })
       }
     ),
-    /* @__PURE__ */ jsx9("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsx9(ExportImportPlugin, {}),
-    /* @__PURE__ */ jsx9(SectionCreatorPlugin, {}),
-    /* @__PURE__ */ jsx9(TablePlugin, {}),
-    /* @__PURE__ */ jsx9("div", { className: "cms-toolbar-divider" }),
-    /* @__PURE__ */ jsxs9("div", { className: "cms-layout-plugin", children: [
-      /* @__PURE__ */ jsx9(
+    /* @__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(
         "button",
         {
           className: "cms-toolbar-button",
           onClick: toggleLayoutMenu,
           title: "Insert Layout",
           type: "button",
-          children: /* @__PURE__ */ jsx9(MdViewColumn, { size: 18 })
+          children: /* @__PURE__ */ jsx10(MdViewColumn, { size: 18 })
         }
       ),
-      showLayoutMenu && /* @__PURE__ */ jsxs9(
+      showLayoutMenu && /* @__PURE__ */ jsxs10(
         "div",
         {
           className: "cms-layout-menu",
@@ -4047,96 +4376,96 @@ function ToolbarPlugin() {
             left: `${layoutMenuPosition.left}px`
           },
           children: [
-            /* @__PURE__ */ jsx9("div", { className: "cms-layout-menu-title", children: "Choose Layout" }),
-            /* @__PURE__ */ jsxs9("div", { className: "cms-layout-menu-section", children: [
-              /* @__PURE__ */ jsx9("div", { className: "cms-layout-menu-subtitle", children: "Columns (Flex)" }),
-              /* @__PURE__ */ jsxs9(
+            /* @__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(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("2-column"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs9("div", { className: "cms-layout-preview cms-layout-preview-2col", children: [
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" })
+                    /* @__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__ */ jsx9("span", { children: "2 Columns" })
+                    /* @__PURE__ */ jsx10("span", { children: "2 Columns" })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs9(
+              /* @__PURE__ */ jsxs10(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("3-column"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs9("div", { className: "cms-layout-preview cms-layout-preview-3col", children: [
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" })
+                    /* @__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__ */ jsx9("span", { children: "3 Columns" })
+                    /* @__PURE__ */ jsx10("span", { children: "3 Columns" })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs9(
+              /* @__PURE__ */ jsxs10(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("4-column"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs9("div", { className: "cms-layout-preview cms-layout-preview-4col", children: [
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" })
+                    /* @__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__ */ jsx9("span", { children: "4 Columns" })
+                    /* @__PURE__ */ jsx10("span", { children: "4 Columns" })
                   ]
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs9("div", { className: "cms-layout-menu-section", children: [
-              /* @__PURE__ */ jsx9("div", { className: "cms-layout-menu-subtitle", children: "Grid" }),
-              /* @__PURE__ */ jsxs9(
+            /* @__PURE__ */ jsxs10("div", { className: "cms-layout-menu-section", children: [
+              /* @__PURE__ */ jsx10("div", { className: "cms-layout-menu-subtitle", children: "Grid" }),
+              /* @__PURE__ */ jsxs10(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("grid-2x2"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs9("div", { className: "cms-layout-preview cms-layout-preview-grid-2x2", children: [
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" })
+                    /* @__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__ */ jsx9("span", { children: "2\xD72 Grid" })
+                    /* @__PURE__ */ jsx10("span", { children: "2\xD72 Grid" })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs9(
+              /* @__PURE__ */ jsxs10(
                 "button",
                 {
                   className: "cms-layout-menu-item",
                   onClick: () => insertLayout("grid-3x3"),
                   type: "button",
                   children: [
-                    /* @__PURE__ */ jsxs9("div", { className: "cms-layout-preview cms-layout-preview-grid-3x3", children: [
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" }),
-                      /* @__PURE__ */ jsx9("div", { className: "cms-layout-preview-col" })
+                    /* @__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__ */ jsx9("span", { children: "3\xD73 Grid" })
+                    /* @__PURE__ */ jsx10("span", { children: "3\xD73 Grid" })
                   ]
                 }
               )
@@ -4149,22 +4478,22 @@ function ToolbarPlugin() {
 }
 
 // src/plugins/ImageUploadPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext8 } from "@lexical/react/LexicalComposerContext";
-import { useEffect as useEffect9 } from "react";
-import { $getSelection as $getSelection7, $isRangeSelection as $isRangeSelection7, COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW2, DRAGOVER_COMMAND, DROP_COMMAND } from "lexical";
+import { useLexicalComposerContext as useLexicalComposerContext9 } from "@lexical/react/LexicalComposerContext";
+import { useEffect as useEffect10 } 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] = useLexicalComposerContext8();
-  useEffect9(() => {
+  const [editor] = useLexicalComposerContext9();
+  useEffect10(() => {
     const removeDragOverListener = editor.registerCommand(
       DRAGOVER_COMMAND,
       (event) => {
         event.preventDefault();
         return true;
       },
-      COMMAND_PRIORITY_LOW2
+      COMMAND_PRIORITY_LOW3
     );
     const removeDropListener = editor.registerCommand(
       DROP_COMMAND,
@@ -4208,7 +4537,7 @@ function ImageUploadPlugin({
         }
         return false;
       },
-      COMMAND_PRIORITY_LOW2
+      COMMAND_PRIORITY_LOW3
     );
     return () => {
       removeDragOverListener();
@@ -4219,25 +4548,25 @@ function ImageUploadPlugin({
 }
 
 // src/plugins/LinkPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext9 } from "@lexical/react/LexicalComposerContext";
-import { useEffect as useEffect10, useState as useState10, useCallback as useCallback9 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext10 } from "@lexical/react/LexicalComposerContext";
+import { useEffect as useEffect11, useState as useState11, useCallback as useCallback9 } from "react";
 import {
   $getSelection as $getSelection8,
   $isRangeSelection as $isRangeSelection8,
-  COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW3,
+  COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW4,
   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 jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 function LinkPlugin() {
-  const [editor] = useLexicalComposerContext9();
-  const [showModal, setShowModal] = useState10(false);
-  const [linkUrl, setLinkUrl] = useState10("");
-  const [linkText, setLinkText] = useState10("");
-  const [linkTitle, setLinkTitle] = useState10("");
-  const [openInNewTab, setOpenInNewTab] = useState10(false);
-  useEffect10(() => {
+  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(() => {
     return editor.registerCommand(
       KEY_ESCAPE_COMMAND2,
       () => {
@@ -4247,7 +4576,7 @@ function LinkPlugin() {
         }
         return false;
       },
-      COMMAND_PRIORITY_LOW3
+      COMMAND_PRIORITY_LOW4
     );
   }, [editor, showModal]);
   const handleInsertLink = useCallback9(() => {
@@ -4298,17 +4627,17 @@ function LinkPlugin() {
     setLinkTitle("");
     setOpenInNewTab(false);
   };
-  useEffect10(() => {
+  useEffect11(() => {
     window.__insertLink = handleInsertLink;
     return () => {
       delete window.__insertLink;
     };
   }, [handleInsertLink]);
   if (!showModal) return null;
-  return /* @__PURE__ */ jsx10("div", { className: "cms-link-modal-overlay", onClick: handleCancel, children: /* @__PURE__ */ jsxs10("div", { className: "cms-link-modal", onClick: (e) => e.stopPropagation(), children: [
-    /* @__PURE__ */ jsxs10("div", { className: "cms-link-modal-header", children: [
-      /* @__PURE__ */ jsx10("h3", { children: "Insert Link" }),
-      /* @__PURE__ */ jsx10(
+  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(
         "button",
         {
           className: "cms-link-modal-close",
@@ -4318,10 +4647,10 @@ function LinkPlugin() {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs10("form", { onSubmit: handleSubmit, className: "cms-link-modal-form", children: [
-      /* @__PURE__ */ jsxs10("div", { className: "cms-link-modal-field", children: [
-        /* @__PURE__ */ jsx10("label", { htmlFor: "link-text", children: "Link Text" }),
-        /* @__PURE__ */ jsx10(
+    /* @__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(
           "input",
           {
             id: "link-text",
@@ -4333,9 +4662,9 @@ function LinkPlugin() {
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs10("div", { className: "cms-link-modal-field", children: [
-        /* @__PURE__ */ jsx10("label", { htmlFor: "link-url", children: "URL *" }),
-        /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsxs11("div", { className: "cms-link-modal-field", children: [
+        /* @__PURE__ */ jsx11("label", { htmlFor: "link-url", children: "URL *" }),
+        /* @__PURE__ */ jsx11(
           "input",
           {
             id: "link-url",
@@ -4347,9 +4676,9 @@ function LinkPlugin() {
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs10("div", { className: "cms-link-modal-field", children: [
-        /* @__PURE__ */ jsx10("label", { htmlFor: "link-title", children: "Title (optional)" }),
-        /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsxs11("div", { className: "cms-link-modal-field", children: [
+        /* @__PURE__ */ jsx11("label", { htmlFor: "link-title", children: "Title (optional)" }),
+        /* @__PURE__ */ jsx11(
           "input",
           {
             id: "link-title",
@@ -4360,8 +4689,8 @@ function LinkPlugin() {
           }
         )
       ] }),
-      /* @__PURE__ */ jsx10("div", { className: "cms-link-modal-field cms-link-modal-checkbox", children: /* @__PURE__ */ jsxs10("label", { children: [
-        /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsx11("div", { className: "cms-link-modal-field cms-link-modal-checkbox", children: /* @__PURE__ */ jsxs11("label", { children: [
+        /* @__PURE__ */ jsx11(
           "input",
           {
             type: "checkbox",
@@ -4369,10 +4698,10 @@ function LinkPlugin() {
             onChange: (e) => setOpenInNewTab(e.target.checked)
           }
         ),
-        /* @__PURE__ */ jsx10("span", { children: "Open in new tab" })
+        /* @__PURE__ */ jsx11("span", { children: "Open in new tab" })
       ] }) }),
-      /* @__PURE__ */ jsxs10("div", { className: "cms-link-modal-actions", children: [
-        /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsxs11("div", { className: "cms-link-modal-actions", children: [
+        /* @__PURE__ */ jsx11(
           "button",
           {
             type: "button",
@@ -4381,7 +4710,7 @@ function LinkPlugin() {
             children: "Cancel"
           }
         ),
-        /* @__PURE__ */ jsx10(
+        /* @__PURE__ */ jsx11(
           "button",
           {
             type: "submit",
@@ -4396,14 +4725,14 @@ function LinkPlugin() {
 }
 
 // src/plugins/SectionEditorPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext10 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState11, useCallback as useCallback10, useRef as useRef8, useEffect as useEffect11 } from "react";
+import { useLexicalComposerContext as useLexicalComposerContext11 } from "@lexical/react/LexicalComposerContext";
+import { useState as useState12, useCallback as useCallback10, useRef as useRef8, useEffect as useEffect12 } from "react";
 import {
   $getSelection as $getSelection9,
   $isRangeSelection as $isRangeSelection9,
   $getNodeByKey,
   SELECTION_CHANGE_COMMAND,
-  COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW4
+  COMMAND_PRIORITY_LOW as COMMAND_PRIORITY_LOW5
 } from "lexical";
 import { MdSettings as MdSettings2, MdClose } from "react-icons/md";
 import {
@@ -4412,7 +4741,7 @@ import {
   FaAlignRight,
   FaAlignJustify
 } from "react-icons/fa";
-import { Fragment as Fragment6, jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
 var PRESET_COLORS2 = [
   "#ffffff",
   "#f8f9fa",
@@ -4446,12 +4775,12 @@ var PRESET_COLORS2 = [
   "#1dd1a1"
 ];
 function SectionEditorPlugin() {
-  const [editor] = useLexicalComposerContext10();
-  const [selectedSection, setSelectedSection] = useState11(null);
-  const [showEditor, setShowEditor] = useState11(false);
-  const [editorPosition, setEditorPosition] = useState11({ top: 0, left: 0 });
+  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);
-  useEffect11(() => {
+  useEffect12(() => {
     return editor.registerCommand(
       SELECTION_CHANGE_COMMAND,
       () => {
@@ -4477,10 +4806,10 @@ function SectionEditorPlugin() {
         });
         return false;
       },
-      COMMAND_PRIORITY_LOW4
+      COMMAND_PRIORITY_LOW5
     );
   }, [editor]);
-  useEffect11(() => {
+  useEffect12(() => {
     const handleClickOutside = (event) => {
       if (editorRef.current && !editorRef.current.contains(event.target)) {
         setShowEditor(false);
@@ -4591,8 +4920,8 @@ function SectionEditorPlugin() {
   const currentMargin = node.getMargin() || "0px";
   const currentGridColumns = node.getGridTemplateColumns() || "repeat(3, 1fr)";
   const currentGridRows = node.getGridTemplateRows() || "auto";
-  return /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-plugin", ref: editorRef, children: [
-    /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-plugin", ref: editorRef, children: [
+    /* @__PURE__ */ jsxs12(
       "button",
       {
         className: "cms-toolbar-button cms-section-edit-button",
@@ -4600,12 +4929,12 @@ function SectionEditorPlugin() {
         title: "Edit Section",
         type: "button",
         children: [
-          /* @__PURE__ */ jsx11(MdSettings2, { size: 18 }),
-          /* @__PURE__ */ jsx11("span", { className: "cms-section-indicator", children: "Section" })
+          /* @__PURE__ */ jsx12(MdSettings2, { size: 18 }),
+          /* @__PURE__ */ jsx12("span", { className: "cms-section-indicator", children: "Section" })
         ]
       }
     ),
-    showEditor && /* @__PURE__ */ jsxs11(
+    showEditor && /* @__PURE__ */ jsxs12(
       "div",
       {
         className: "cms-section-editor-menu",
@@ -4614,22 +4943,22 @@ function SectionEditorPlugin() {
           left: `${editorPosition.left}px`
         },
         children: [
-          /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-header", children: [
-            /* @__PURE__ */ jsx11("span", { children: "Section Settings" }),
-            /* @__PURE__ */ jsx11(
+          /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-header", children: [
+            /* @__PURE__ */ jsx12("span", { children: "Section Settings" }),
+            /* @__PURE__ */ jsx12(
               "button",
               {
                 className: "cms-close-button",
                 onClick: () => setShowEditor(false),
                 type: "button",
-                children: /* @__PURE__ */ jsx11(MdClose, { size: 16 })
+                children: /* @__PURE__ */ jsx12(MdClose, { size: 16 })
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-content", children: [
-            /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx11("label", { children: "Background Color" }),
-              /* @__PURE__ */ jsx11("div", { className: "cms-color-grid", children: PRESET_COLORS2.map((color) => /* @__PURE__ */ jsx11(
+          /* @__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(
                 "button",
                 {
                   className: `cms-color-swatch ${currentBgColor === color ? "active" : ""}`,
@@ -4640,7 +4969,7 @@ function SectionEditorPlugin() {
                 },
                 color
               )) }),
-              /* @__PURE__ */ jsx11(
+              /* @__PURE__ */ jsx12(
                 "input",
                 {
                   type: "color",
@@ -4650,9 +4979,9 @@ function SectionEditorPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx11("label", { children: "Background Image" }),
-              /* @__PURE__ */ jsx11(
+            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx12("label", { children: "Background Image" }),
+              /* @__PURE__ */ jsx12(
                 "input",
                 {
                   type: "text",
@@ -4662,66 +4991,66 @@ function SectionEditorPlugin() {
                   className: "cms-text-input"
                 }
               ),
-              currentBgImage && /* @__PURE__ */ jsxs11(Fragment6, { children: [
-                /* @__PURE__ */ jsxs11("div", { className: "cms-bg-controls", children: [
-                  /* @__PURE__ */ jsxs11("div", { className: "cms-bg-control-item", children: [
-                    /* @__PURE__ */ jsx11("label", { children: "Size" }),
-                    /* @__PURE__ */ jsxs11(
+              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(
                       "select",
                       {
                         value: currentBgSize,
                         onChange: (e) => setBackgroundSize(e.target.value),
                         className: "cms-select-small",
                         children: [
-                          /* @__PURE__ */ jsx11("option", { value: "cover", children: "Cover" }),
-                          /* @__PURE__ */ jsx11("option", { value: "contain", children: "Contain" }),
-                          /* @__PURE__ */ jsx11("option", { value: "auto", children: "Auto" }),
-                          /* @__PURE__ */ jsx11("option", { value: "100% 100%", children: "Stretch" })
+                          /* @__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__ */ jsxs11("div", { className: "cms-bg-control-item", children: [
-                    /* @__PURE__ */ jsx11("label", { children: "Position" }),
-                    /* @__PURE__ */ jsxs11(
+                  /* @__PURE__ */ jsxs12("div", { className: "cms-bg-control-item", children: [
+                    /* @__PURE__ */ jsx12("label", { children: "Position" }),
+                    /* @__PURE__ */ jsxs12(
                       "select",
                       {
                         value: currentBgPosition,
                         onChange: (e) => setBackgroundPosition(e.target.value),
                         className: "cms-select-small",
                         children: [
-                          /* @__PURE__ */ jsx11("option", { value: "center", children: "Center" }),
-                          /* @__PURE__ */ jsx11("option", { value: "top", children: "Top" }),
-                          /* @__PURE__ */ jsx11("option", { value: "bottom", children: "Bottom" }),
-                          /* @__PURE__ */ jsx11("option", { value: "left", children: "Left" }),
-                          /* @__PURE__ */ jsx11("option", { value: "right", children: "Right" }),
-                          /* @__PURE__ */ jsx11("option", { value: "top left", children: "Top Left" }),
-                          /* @__PURE__ */ jsx11("option", { value: "top right", children: "Top Right" }),
-                          /* @__PURE__ */ jsx11("option", { value: "bottom left", children: "Bottom Left" }),
-                          /* @__PURE__ */ jsx11("option", { value: "bottom right", children: "Bottom Right" })
+                          /* @__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__ */ jsxs11("div", { className: "cms-bg-control-item", children: [
-                    /* @__PURE__ */ jsx11("label", { children: "Repeat" }),
-                    /* @__PURE__ */ jsxs11(
+                  /* @__PURE__ */ jsxs12("div", { className: "cms-bg-control-item", children: [
+                    /* @__PURE__ */ jsx12("label", { children: "Repeat" }),
+                    /* @__PURE__ */ jsxs12(
                       "select",
                       {
                         value: currentBgRepeat,
                         onChange: (e) => setBackgroundRepeat(e.target.value),
                         className: "cms-select-small",
                         children: [
-                          /* @__PURE__ */ jsx11("option", { value: "no-repeat", children: "No Repeat" }),
-                          /* @__PURE__ */ jsx11("option", { value: "repeat", children: "Repeat" }),
-                          /* @__PURE__ */ jsx11("option", { value: "repeat-x", children: "Repeat X" }),
-                          /* @__PURE__ */ jsx11("option", { value: "repeat-y", children: "Repeat Y" })
+                          /* @__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__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     onClick: removeBackgroundImage,
@@ -4732,10 +5061,10 @@ function SectionEditorPlugin() {
                 )
               ] })
             ] }),
-            currentBgImage && /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx11("label", { children: "Gradient Overlay" }),
-              /* @__PURE__ */ jsxs11("div", { className: "cms-gradient-presets", children: [
-                /* @__PURE__ */ jsx11(
+            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(
                   "button",
                   {
                     onClick: () => setGradientOverlay(""),
@@ -4744,7 +5073,7 @@ function SectionEditorPlugin() {
                     children: "None"
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.7))"),
@@ -4754,7 +5083,7 @@ function SectionEditorPlugin() {
                     type: "button"
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5))"),
@@ -4764,7 +5093,7 @@ function SectionEditorPlugin() {
                     type: "button"
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(102,126,234,0.8), rgba(118,75,162,0.8))"),
@@ -4774,7 +5103,7 @@ function SectionEditorPlugin() {
                     type: "button"
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(250,112,154,0.8), rgba(254,225,64,0.8))"),
@@ -4784,7 +5113,7 @@ function SectionEditorPlugin() {
                     type: "button"
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     onClick: () => setGradientOverlay("linear-gradient(rgba(67,233,123,0.8), rgba(56,249,215,0.8))"),
@@ -4795,7 +5124,7 @@ function SectionEditorPlugin() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsx11(
+              /* @__PURE__ */ jsx12(
                 "input",
                 {
                   type: "text",
@@ -4806,13 +5135,13 @@ function SectionEditorPlugin() {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsxs11("label", { children: [
+            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsxs12("label", { children: [
                 "Opacity: ",
                 Math.round((currentOpacity || 1) * 100),
                 "%"
               ] }),
-              /* @__PURE__ */ jsx11(
+              /* @__PURE__ */ jsx12(
                 "input",
                 {
                   type: "range",
@@ -4824,62 +5153,62 @@ function SectionEditorPlugin() {
                   className: "cms-range-input"
                 }
               ),
-              /* @__PURE__ */ jsxs11("div", { className: "cms-preset-buttons", children: [
-                /* @__PURE__ */ jsx11("button", { onClick: () => setOpacity(0.25), type: "button", children: "25%" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setOpacity(0.5), type: "button", children: "50%" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setOpacity(0.75), type: "button", children: "75%" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setOpacity(1), type: "button", children: "100%" })
+              /* @__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__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx11("label", { children: "Text Alignment" }),
-              /* @__PURE__ */ jsxs11("div", { className: "cms-button-group", children: [
-                /* @__PURE__ */ jsx11(
+            /* @__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(
                   "button",
                   {
                     className: `cms-icon-button ${currentTextAlign === "left" ? "active" : ""}`,
                     onClick: () => setTextAlign("left"),
                     title: "Align Left",
                     type: "button",
-                    children: /* @__PURE__ */ jsx11(FaAlignLeft, {})
+                    children: /* @__PURE__ */ jsx12(FaAlignLeft, {})
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     className: `cms-icon-button ${currentTextAlign === "center" ? "active" : ""}`,
                     onClick: () => setTextAlign("center"),
                     title: "Align Center",
                     type: "button",
-                    children: /* @__PURE__ */ jsx11(FaAlignCenter, {})
+                    children: /* @__PURE__ */ jsx12(FaAlignCenter, {})
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     className: `cms-icon-button ${currentTextAlign === "right" ? "active" : ""}`,
                     onClick: () => setTextAlign("right"),
                     title: "Align Right",
                     type: "button",
-                    children: /* @__PURE__ */ jsx11(FaAlignRight, {})
+                    children: /* @__PURE__ */ jsx12(FaAlignRight, {})
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     className: `cms-icon-button ${currentTextAlign === "justify" ? "active" : ""}`,
                     onClick: () => setTextAlign("justify"),
                     title: "Justify",
                     type: "button",
-                    children: /* @__PURE__ */ jsx11(FaAlignJustify, {})
+                    children: /* @__PURE__ */ jsx12(FaAlignJustify, {})
                   }
                 )
               ] })
             ] }),
-            /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx11("label", { children: "Layout Type" }),
-              /* @__PURE__ */ jsxs11("div", { className: "cms-button-group", children: [
-                /* @__PURE__ */ jsx11(
+            /* @__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(
                   "button",
                   {
                     className: `cms-layout-button ${currentLayout === "block" ? "active" : ""}`,
@@ -4888,7 +5217,7 @@ function SectionEditorPlugin() {
                     children: "Block"
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     className: `cms-layout-button ${currentLayout === "flex" ? "active" : ""}`,
@@ -4897,7 +5226,7 @@ function SectionEditorPlugin() {
                     children: "Flex"
                   }
                 ),
-                /* @__PURE__ */ jsx11(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     className: `cms-layout-button ${currentLayout === "grid" ? "active" : ""}`,
@@ -4908,81 +5237,81 @@ function SectionEditorPlugin() {
                 )
               ] })
             ] }),
-            currentLayout === "flex" && /* @__PURE__ */ jsxs11(Fragment6, { children: [
-              /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx11("label", { children: "Flex Direction" }),
-                /* @__PURE__ */ jsxs11(
+            currentLayout === "flex" && /* @__PURE__ */ jsxs12(Fragment6, { children: [
+              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx12("label", { children: "Flex Direction" }),
+                /* @__PURE__ */ jsxs12(
                   "select",
                   {
                     value: currentFlexDirection,
                     onChange: (e) => setFlexDirection(e.target.value),
                     className: "cms-select",
                     children: [
-                      /* @__PURE__ */ jsx11("option", { value: "row", children: "Row" }),
-                      /* @__PURE__ */ jsx11("option", { value: "column", children: "Column" }),
-                      /* @__PURE__ */ jsx11("option", { value: "row-reverse", children: "Row Reverse" }),
-                      /* @__PURE__ */ jsx11("option", { value: "column-reverse", children: "Column Reverse" })
+                      /* @__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__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx11("label", { children: "Flex Wrap" }),
-                /* @__PURE__ */ jsxs11(
+              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx12("label", { children: "Flex Wrap" }),
+                /* @__PURE__ */ jsxs12(
                   "select",
                   {
                     value: currentFlexWrap,
                     onChange: (e) => setFlexWrap(e.target.value),
                     className: "cms-select",
                     children: [
-                      /* @__PURE__ */ jsx11("option", { value: "nowrap", children: "No Wrap" }),
-                      /* @__PURE__ */ jsx11("option", { value: "wrap", children: "Wrap" }),
-                      /* @__PURE__ */ jsx11("option", { value: "wrap-reverse", children: "Wrap Reverse" })
+                      /* @__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__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx11("label", { children: "Align Items" }),
-                /* @__PURE__ */ jsxs11(
+              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx12("label", { children: "Align Items" }),
+                /* @__PURE__ */ jsxs12(
                   "select",
                   {
                     value: currentAlignItems,
                     onChange: (e) => setAlignItems(e.target.value),
                     className: "cms-select",
                     children: [
-                      /* @__PURE__ */ jsx11("option", { value: "flex-start", children: "Start" }),
-                      /* @__PURE__ */ jsx11("option", { value: "center", children: "Center" }),
-                      /* @__PURE__ */ jsx11("option", { value: "flex-end", children: "End" }),
-                      /* @__PURE__ */ jsx11("option", { value: "stretch", children: "Stretch" })
+                      /* @__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__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx11("label", { children: "Justify Content" }),
-                /* @__PURE__ */ jsxs11(
+              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx12("label", { children: "Justify Content" }),
+                /* @__PURE__ */ jsxs12(
                   "select",
                   {
                     value: currentJustifyContent,
                     onChange: (e) => setJustifyContent(e.target.value),
                     className: "cms-select",
                     children: [
-                      /* @__PURE__ */ jsx11("option", { value: "flex-start", children: "Start" }),
-                      /* @__PURE__ */ jsx11("option", { value: "center", children: "Center" }),
-                      /* @__PURE__ */ jsx11("option", { value: "flex-end", children: "End" }),
-                      /* @__PURE__ */ jsx11("option", { value: "space-between", children: "Space Between" }),
-                      /* @__PURE__ */ jsx11("option", { value: "space-around", children: "Space Around" }),
-                      /* @__PURE__ */ jsx11("option", { value: "space-evenly", children: "Space Evenly" })
+                      /* @__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" })
                     ]
                   }
                 )
               ] })
             ] }),
-            currentLayout === "grid" && /* @__PURE__ */ jsxs11(Fragment6, { children: [
-              /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx11("label", { children: "Grid Columns" }),
-                /* @__PURE__ */ jsx11(
+            currentLayout === "grid" && /* @__PURE__ */ jsxs12(Fragment6, { children: [
+              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx12("label", { children: "Grid Columns" }),
+                /* @__PURE__ */ jsx12(
                   "input",
                   {
                     type: "text",
@@ -4992,16 +5321,16 @@ function SectionEditorPlugin() {
                     className: "cms-text-input"
                   }
                 ),
-                /* @__PURE__ */ jsxs11("div", { className: "cms-preset-buttons", children: [
-                  /* @__PURE__ */ jsx11("button", { onClick: () => setGridColumns("1fr"), type: "button", children: "1 Col" }),
-                  /* @__PURE__ */ jsx11("button", { onClick: () => setGridColumns("repeat(2, 1fr)"), type: "button", children: "2 Cols" }),
-                  /* @__PURE__ */ jsx11("button", { onClick: () => setGridColumns("repeat(3, 1fr)"), type: "button", children: "3 Cols" }),
-                  /* @__PURE__ */ jsx11("button", { onClick: () => setGridColumns("repeat(4, 1fr)"), type: "button", children: "4 Cols" })
+                /* @__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__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-                /* @__PURE__ */ jsx11("label", { children: "Grid Rows" }),
-                /* @__PURE__ */ jsx11(
+              /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+                /* @__PURE__ */ jsx12("label", { children: "Grid Rows" }),
+                /* @__PURE__ */ jsx12(
                   "input",
                   {
                     type: "text",
@@ -5013,12 +5342,12 @@ function SectionEditorPlugin() {
                 )
               ] })
             ] }),
-            (currentLayout === "flex" || currentLayout === "grid") && /* @__PURE__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsxs11("label", { children: [
+            (currentLayout === "flex" || currentLayout === "grid") && /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsxs12("label", { children: [
                 "Gap: ",
                 currentGap
               ] }),
-              /* @__PURE__ */ jsx11(
+              /* @__PURE__ */ jsx12(
                 "input",
                 {
                   type: "range",
@@ -5029,17 +5358,17 @@ function SectionEditorPlugin() {
                   className: "cms-range-input"
                 }
               ),
-              /* @__PURE__ */ jsxs11("div", { className: "cms-preset-buttons", children: [
-                /* @__PURE__ */ jsx11("button", { onClick: () => setGap("0px"), type: "button", children: "0" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setGap("8px"), type: "button", children: "8" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setGap("16px"), type: "button", children: "16" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setGap("24px"), type: "button", children: "24" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setGap("32px"), type: "button", children: "32" })
+              /* @__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__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx11("label", { children: "Padding" }),
-              /* @__PURE__ */ jsx11(
+            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx12("label", { children: "Padding" }),
+              /* @__PURE__ */ jsx12(
                 "input",
                 {
                   type: "text",
@@ -5049,17 +5378,17 @@ function SectionEditorPlugin() {
                   className: "cms-text-input"
                 }
               ),
-              /* @__PURE__ */ jsxs11("div", { className: "cms-preset-buttons", children: [
-                /* @__PURE__ */ jsx11("button", { onClick: () => setPadding("0px"), type: "button", children: "0" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setPadding("20px"), type: "button", children: "20" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setPadding("40px"), type: "button", children: "40" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setPadding("60px"), type: "button", children: "60" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setPadding("80px"), type: "button", children: "80" })
+              /* @__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__ */ jsxs11("div", { className: "cms-section-editor-group", children: [
-              /* @__PURE__ */ jsx11("label", { children: "Margin" }),
-              /* @__PURE__ */ jsx11(
+            /* @__PURE__ */ jsxs12("div", { className: "cms-section-editor-group", children: [
+              /* @__PURE__ */ jsx12("label", { children: "Margin" }),
+              /* @__PURE__ */ jsx12(
                 "input",
                 {
                   type: "text",
@@ -5069,11 +5398,11 @@ function SectionEditorPlugin() {
                   className: "cms-text-input"
                 }
               ),
-              /* @__PURE__ */ jsxs11("div", { className: "cms-preset-buttons", children: [
-                /* @__PURE__ */ jsx11("button", { onClick: () => setMargin("0px"), type: "button", children: "0" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setMargin("20px 0"), type: "button", children: "20 V" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setMargin("40px 0"), type: "button", children: "40 V" }),
-                /* @__PURE__ */ jsx11("button", { onClick: () => setMargin("0 auto"), type: "button", children: "Center" })
+              /* @__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" })
               ] })
             ] })
           ] })
@@ -5084,14 +5413,14 @@ function SectionEditorPlugin() {
 }
 
 // src/plugins/EmbedPlugin.tsx
-import { useLexicalComposerContext as useLexicalComposerContext11 } from "@lexical/react/LexicalComposerContext";
-import { useState as useState13, useCallback as useCallback12, useRef as useRef10, useEffect as useEffect13 } from "react";
+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";
 
 // src/blocks/EmbedNode.tsx
 import { DecoratorNode as DecoratorNode3 } from "lexical";
-import { useCallback as useCallback11, useEffect as useEffect12, useRef as useRef9, useState as useState12 } from "react";
-import { Fragment as Fragment7, jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+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";
 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";
@@ -5152,23 +5481,23 @@ function EmbedComponent({
   editor
 }) {
   const wrapperRef = useRef9(null);
-  const [isResizing, setIsResizing] = useState12(false);
-  const [isSelected, setIsSelected] = useState12(false);
-  const [embedHtml, setEmbedHtml] = useState12("");
+  const [isResizing, setIsResizing] = useState13(false);
+  const [isSelected, setIsSelected] = useState13(false);
+  const [embedHtml, setEmbedHtml] = useState13("");
   const width = initialWidth || (type === "spotify" ? 300 : 560);
   const height = initialHeight || (type === "spotify" ? 380 : 315);
-  const [size, setSize] = useState12({
+  const [size, setSize] = useState13({
     width,
     height
   });
-  useEffect12(() => {
+  useEffect13(() => {
     setSize({
       width: initialWidth || (type === "spotify" ? 300 : 560),
       height: initialHeight || (type === "spotify" ? 380 : 315)
     });
   }, [initialWidth, initialHeight, type]);
   const embedUrl = getEmbedUrl(url, type);
-  useEffect12(() => {
+  useEffect13(() => {
     if (type === "instagram" || type === "twitter" || type === "tiktok") {
       loadOEmbed(url, type);
     }
@@ -5249,7 +5578,7 @@ function EmbedComponent({
   }, [size, editor, nodeKey]);
   const renderEmbed = () => {
     if (embedHtml && (type === "instagram" || type === "twitter" || type === "tiktok")) {
-      return /* @__PURE__ */ jsx12(
+      return /* @__PURE__ */ jsx13(
         "div",
         {
           dangerouslySetInnerHTML: { __html: embedHtml },
@@ -5258,7 +5587,7 @@ function EmbedComponent({
       );
     }
     if (type === "youtube" || type === "vimeo" || type === "facebook" || type === "spotify" || type === "soundcloud") {
-      return /* @__PURE__ */ jsx12(
+      return /* @__PURE__ */ jsx13(
         "iframe",
         {
           src: embedUrl,
@@ -5274,14 +5603,14 @@ function EmbedComponent({
         }
       );
     }
-    return /* @__PURE__ */ jsxs12("div", { style: {
+    return /* @__PURE__ */ jsxs13("div", { style: {
       padding: "20px",
       background: "#f8f9fa",
       borderRadius: "8px",
       textAlign: "center"
     }, children: [
-      /* @__PURE__ */ jsx12("p", { style: { margin: "0 0 10px 0", color: "#6c757d" }, children: "Embedded Content" }),
-      /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsx13("p", { style: { margin: "0 0 10px 0", color: "#6c757d" }, children: "Embedded Content" }),
+      /* @__PURE__ */ jsx13(
         "a",
         {
           href: url,
@@ -5293,7 +5622,7 @@ function EmbedComponent({
       )
     ] });
   };
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13(
     "div",
     {
       ref: wrapperRef,
@@ -5313,8 +5642,8 @@ function EmbedComponent({
       },
       children: [
         renderEmbed(),
-        isSelected && (type === "youtube" || type === "vimeo" || type === "facebook" || type === "spotify" || type === "soundcloud") && /* @__PURE__ */ jsxs12(Fragment7, { children: [
-          /* @__PURE__ */ jsx12(
+        isSelected && (type === "youtube" || type === "vimeo" || type === "facebook" || type === "spotify" || type === "soundcloud") && /* @__PURE__ */ jsxs13(Fragment7, { children: [
+          /* @__PURE__ */ jsx13(
             "div",
             {
               className: "embed-resize-handle embed-resize-handle-se",
@@ -5334,7 +5663,7 @@ function EmbedComponent({
               }
             }
           ),
-          /* @__PURE__ */ jsx12(
+          /* @__PURE__ */ jsx13(
             "div",
             {
               className: "embed-resize-handle embed-resize-handle-ne",
@@ -5386,7 +5715,7 @@ var EmbedNode = class _EmbedNode extends DecoratorNode3 {
     return false;
   }
   decorate(editor) {
-    return /* @__PURE__ */ jsx12(
+    return /* @__PURE__ */ jsx13(
       EmbedComponent,
       {
         url: this.__url,
@@ -5423,13 +5752,13 @@ function $createEmbedNode(url, type, width, height) {
 
 // src/plugins/EmbedPlugin.tsx
 import { MdVideoLibrary } from "react-icons/md";
-import { Fragment as Fragment8, jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
 function EmbedPlugin() {
-  const [editor] = useLexicalComposerContext11();
-  const [showModal, setShowModal] = useState13(false);
-  const [embedUrl, setEmbedUrl] = useState13("");
+  const [editor] = useLexicalComposerContext12();
+  const [showModal, setShowModal] = useState14(false);
+  const [embedUrl, setEmbedUrl] = useState14("");
   const modalRef = useRef10(null);
-  useEffect13(() => {
+  useEffect14(() => {
     const handleClickOutside = (event) => {
       if (modalRef.current && !modalRef.current.contains(event.target)) {
         setShowModal(false);
@@ -5465,38 +5794,38 @@ function EmbedPlugin() {
       setShowModal(false);
     }
   }, [insertEmbed]);
-  return /* @__PURE__ */ jsxs13("div", { className: "cms-embed-plugin", ref: modalRef, children: [
-    /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsxs14("div", { className: "cms-embed-plugin", ref: modalRef, children: [
+    /* @__PURE__ */ jsx14(
       "button",
       {
         className: "cms-toolbar-button",
         onClick: openModal,
         title: "Insert Embed (YouTube, Facebook, Instagram, etc.)",
         type: "button",
-        children: /* @__PURE__ */ jsx13(MdVideoLibrary, { size: 18 })
+        children: /* @__PURE__ */ jsx14(MdVideoLibrary, { size: 18 })
       }
     ),
-    showModal && /* @__PURE__ */ jsxs13(Fragment8, { children: [
-      /* @__PURE__ */ jsx13("div", { className: "cms-modal-backdrop", onClick: () => setShowModal(false) }),
-      /* @__PURE__ */ jsxs13("div", { className: "cms-embed-modal", children: [
-        /* @__PURE__ */ jsx13("div", { className: "cms-embed-modal-header", children: /* @__PURE__ */ jsx13("span", { children: "Insert Embed" }) }),
-        /* @__PURE__ */ jsxs13("div", { className: "cms-embed-modal-content", children: [
-          /* @__PURE__ */ jsxs13("div", { className: "cms-embed-info", children: [
-            /* @__PURE__ */ jsx13("p", { children: "Paste a link from:" }),
-            /* @__PURE__ */ jsxs13("div", { className: "cms-embed-platforms", children: [
-              /* @__PURE__ */ jsx13("span", { className: "cms-embed-platform", children: "YouTube" }),
-              /* @__PURE__ */ jsx13("span", { className: "cms-embed-platform", children: "Facebook" }),
-              /* @__PURE__ */ jsx13("span", { className: "cms-embed-platform", children: "Instagram" }),
-              /* @__PURE__ */ jsx13("span", { className: "cms-embed-platform", children: "Twitter/X" }),
-              /* @__PURE__ */ jsx13("span", { className: "cms-embed-platform", children: "TikTok" }),
-              /* @__PURE__ */ jsx13("span", { className: "cms-embed-platform", children: "Vimeo" }),
-              /* @__PURE__ */ jsx13("span", { className: "cms-embed-platform", children: "Spotify" }),
-              /* @__PURE__ */ jsx13("span", { className: "cms-embed-platform", children: "SoundCloud" })
+    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" })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs13("div", { className: "cms-form-group", children: [
-            /* @__PURE__ */ jsx13("label", { htmlFor: "embed-url", children: "URL" }),
-            /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsxs14("div", { className: "cms-form-group", children: [
+            /* @__PURE__ */ jsx14("label", { htmlFor: "embed-url", children: "URL" }),
+            /* @__PURE__ */ jsx14(
               "input",
               {
                 id: "embed-url",
@@ -5510,20 +5839,20 @@ function EmbedPlugin() {
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs13("div", { className: "cms-embed-examples", children: [
-            /* @__PURE__ */ jsx13("p", { className: "cms-embed-examples-title", children: "Example URLs:" }),
-            /* @__PURE__ */ jsxs13("ul", { className: "cms-embed-examples-list", children: [
-              /* @__PURE__ */ jsx13("li", { children: "https://www.youtube.com/watch?v=dQw4w9WgXcQ" }),
-              /* @__PURE__ */ jsx13("li", { children: "https://www.facebook.com/username/posts/123456" }),
-              /* @__PURE__ */ jsx13("li", { children: "https://www.instagram.com/p/ABC123/" }),
-              /* @__PURE__ */ jsx13("li", { children: "https://twitter.com/username/status/123456" }),
-              /* @__PURE__ */ jsx13("li", { children: "https://www.tiktok.com/@username/video/123456" }),
-              /* @__PURE__ */ jsx13("li", { children: "https://vimeo.com/123456789" }),
-              /* @__PURE__ */ jsx13("li", { children: "https://open.spotify.com/track/123456" })
+          /* @__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__ */ jsxs13("div", { className: "cms-modal-actions", children: [
-            /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsxs14("div", { className: "cms-modal-actions", children: [
+            /* @__PURE__ */ jsx14(
               "button",
               {
                 onClick: () => setShowModal(false),
@@ -5532,7 +5861,7 @@ function EmbedPlugin() {
                 children: "Cancel"
               }
             ),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx14(
               "button",
               {
                 onClick: insertEmbed,
@@ -5550,33 +5879,34 @@ function EmbedPlugin() {
 }
 
 // src/core/EditorShell.tsx
-import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
 function EditorShell({
   onChange,
   onImageAdded,
   useBase64Url
 }) {
-  return /* @__PURE__ */ jsxs14("div", { className: "cms-editor-shell", children: [
-    /* @__PURE__ */ jsx14(ToolbarPlugin, {}),
-    /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsxs15("div", { className: "cms-editor-shell", children: [
+    /* @__PURE__ */ jsx15(ToolbarPlugin, {}),
+    /* @__PURE__ */ jsx15(
       RichTextPlugin,
       {
-        contentEditable: /* @__PURE__ */ jsx14(ContentEditable, { className: "cms-editor-content" }),
-        placeholder: /* @__PURE__ */ jsx14("div", { className: "cms-editor-placeholder", children: "Start typing or press / for commands..." }),
+        contentEditable: /* @__PURE__ */ jsx15(ContentEditable, { className: "cms-editor-content" }),
+        placeholder: /* @__PURE__ */ jsx15("div", { className: "cms-editor-placeholder", children: "Start typing or press / for commands..." }),
         ErrorBoundary: LexicalErrorBoundary
       }
     ),
-    /* @__PURE__ */ jsx14(HistoryPlugin, {}),
-    /* @__PURE__ */ jsx14(ListPlugin, {}),
-    /* @__PURE__ */ jsx14(LexicalLinkPlugin, {}),
-    /* @__PURE__ */ jsx14(LexicalTablePlugin, {}),
-    /* @__PURE__ */ jsx14(SlashCommandPlugin, {}),
-    /* @__PURE__ */ jsx14(ImageUploadPlugin, { onImageAdded, useBase64Url }),
-    /* @__PURE__ */ jsx14(LinkPlugin, {}),
-    /* @__PURE__ */ jsx14(SectionEditorPlugin, {}),
-    /* @__PURE__ */ jsx14(EmbedPlugin, {}),
-    /* @__PURE__ */ jsx14(TablePlugin, {}),
-    onChange && /* @__PURE__ */ jsx14(
+    /* @__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(
       OnChangePlugin,
       {
         onChange: (editorState) => {
@@ -5635,14 +5965,14 @@ function createEditorConfig(value) {
 }
 
 // src/core/CMSBlockEditor.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 function CMSBlockEditor({
   value,
   onChange,
   onImageAdded,
   useBase64Url = true
 }) {
-  return /* @__PURE__ */ jsx15(LexicalComposer, { initialConfig: createEditorConfig(value), children: /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(LexicalComposer, { initialConfig: createEditorConfig(value), children: /* @__PURE__ */ jsx16(
     EditorShell,
     {
       onChange,
@@ -5657,12 +5987,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 useEffect14 } from "react";
-import { useLexicalComposerContext as useLexicalComposerContext12 } from "@lexical/react/LexicalComposerContext";
-import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
+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";
 function ReadOnlyPlugin() {
-  const [editor] = useLexicalComposerContext12();
-  useEffect14(() => {
+  const [editor] = useLexicalComposerContext13();
+  useEffect15(() => {
     editor.setEditable(false);
   }, [editor]);
   return null;
@@ -5672,21 +6002,22 @@ function CMSRenderer({ content, className = "" }) {
     ...createEditorConfig(content),
     editable: false
   };
-  return /* @__PURE__ */ jsx16(LexicalComposer2, { initialConfig: config, children: /* @__PURE__ */ jsxs15("div", { className: `cms-renderer ${className}`, children: [
-    /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx17(LexicalComposer2, { initialConfig: config, children: /* @__PURE__ */ jsxs16("div", { className: `cms-renderer ${className}`, children: [
+    /* @__PURE__ */ jsx17(
       RichTextPlugin2,
       {
-        contentEditable: /* @__PURE__ */ jsx16(ContentEditable2, { className: "cms-renderer-content" }),
+        contentEditable: /* @__PURE__ */ jsx17(ContentEditable2, { className: "cms-renderer-content" }),
         placeholder: null,
         ErrorBoundary: LexicalErrorBoundary2
       }
     ),
-    /* @__PURE__ */ jsx16(ReadOnlyPlugin, {})
+    /* @__PURE__ */ jsx17(ReadOnlyPlugin, {})
   ] }) });
 }
 export {
   CMSBlockEditor,
   CMSRenderer,
+  OPEN_IMAGE_EDITOR_COMMAND,
   appendHTML,
   copyMarkdownToClipboard,
   downloadHTML,