@kgalexander/mcreate 0.0.13 → 0.0.14

package/dist/{chunk-LAW7VVEQ.mjs → chunk-QGWWLZOW.mjs}

@@ -1,5 +1,5 @@
 // src/core/index.tsx
-import { useMemo as useMemo16, useState as useState16, useEffect as useEffect20, useCallback as useCallback16, useRef as useRef11 } from "react";
+import { useMemo as useMemo17, useState as useState16, useEffect as useEffect20, useCallback as useCallback17, useRef as useRef11 } from "react";
 import { cloneDeep as cloneDeep2, isEqual, debounce } from "lodash";
 
 // src/core/utils/idx.ts
@@ -1871,7 +1871,6 @@ var defaultTemplate = {
     id: page.id || generateId()
   }))
 };
-var MAX_PAID_LEVEL = 3;
 var useEditorStore = create()(
   devtools(
     immer((set) => ({
@@ -1880,6 +1879,7 @@ var useEditorStore = create()(
       templateId: null,
       onSave: null,
       onToast: null,
+      onExit: null,
       previewMode: false,
       focusIdx: null,
       hoverIdx: null,
@@ -1903,14 +1903,20 @@ var useEditorStore = create()(
       isSaving: false,
       // Subscription level (0 = free, 1-3 = paid tiers)
       isPaidLevel: 0,
+      // User data
+      images: [],
+      userData: null,
       // Initialize store with external template (for npm package usage)
-      initializeWithTemplate: (templateId, template, onSave, onToast, isPaidLevel) => {
+      initializeWithTemplate: (templateId, template, onSave, onToast, data, onExit) => {
         set((state) => {
           state.templateId = templateId;
           state.template = template;
           state.onSave = onSave ?? null;
           state.onToast = onToast ?? null;
-          state.isPaidLevel = isPaidLevel ?? 0;
+          state.onExit = onExit ?? null;
+          state.isPaidLevel = data?.isPaidLevel ?? 0;
+          state.images = data?.images ?? [];
+          state.userData = data?.userData ?? null;
           state.templateSize = calculateTemplateSize(template);
           state.isAtSizeLimit = false;
           state.history = [cloneDeep(template)];
@@ -3138,6 +3144,17 @@ var LINK_TYPES = [
     prefix: "tel:"
   }
 ];
+var LINK_PRESETS = {
+  Phone: [
+    { label: "Personal Phone", key: "personal_phone_number" },
+    { label: "Office Phone", key: "office_phone_number" },
+    { label: "Business Phone", key: "business_phone_number" }
+  ],
+  Website: [
+    { label: "Team Website", key: "team_website" },
+    { label: "Brokerage Website", key: "brokerage_website" }
+  ]
+};
 var detectLinkType = (href) => {
   if (href.startsWith("mailto:")) return LINK_TYPES[0];
   if (href.startsWith("tel:")) return LINK_TYPES[2];
@@ -3164,7 +3181,18 @@ var MAX_LINE_HEIGHT = 3;
 var LINE_HEIGHT_STEP = 0.1;
 var HIDDEN_SELECTION_VISUAL_ELEMENTS = ["text", "divider", "column"];
 var NOT_DRAGGABLE_ELEMENTS = ["page", "social-item", "text", "property-card", "property-card-single-two", "property-card-triple", "property-card-triple-item"];
-var IMAGE_SELECTION_VALID_TYPES = ["section", "section-column", "image", "section-property-km", "section-property-single-two", "section-property-triple", "property-card", "property-card-single-two", "property-card-triple", "property-card-triple-item"];
+var EDITOR_COLORS = {
+  /** Purple — drag/drop state */
+  drag: {
+    solid: "rgb(59, 130, 246)",
+    half: "rgba(59, 130, 246, 0.5)"
+  },
+  /** Blue — hover/selection state */
+  hover: {
+    solid: "rgb(59, 130, 246)",
+    half: "rgba(59, 130, 246, 0.5)"
+  }
+};
 
 // src/core/editor/components/ShadowDomRenderer.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -3192,32 +3220,32 @@ function getEditorStyles(isDragButtonHovered, textEditingIdx) {
 
   /* Hover state - uses CSS variable for dynamic color */
   .${EMAIL_BLOCK_CLASS_NAME}.is-hovered {
-    outline-color: var(--outline-color-hover, rgba(59, 130, 246, 0.5));
+    outline-color: var(--outline-color-hover, ${EDITOR_COLORS.hover.half});
   }
 
   /* Selected state - uses CSS variable for dynamic color */
   .${EMAIL_BLOCK_CLASS_NAME}.is-selected {
-    outline-color: var(--outline-color, rgb(59, 130, 246));
+    outline-color: var(--outline-color, ${EDITOR_COLORS.hover.solid});
   }
 
   /* Drop target state - highlight section being dropped into */
   .${EMAIL_BLOCK_CLASS_NAME}.is-drop-target {
-    outline-color: rgb(147, 51, 234) !important;
+    outline-color: ${EDITOR_COLORS.drag.solid} !important;
   }
 
   /* Column selection in section-column - 50% opacity blue */
   .${EMAIL_BLOCK_CLASS_NAME}.is-column-selected {
-    outline-color: rgba(59, 130, 246, 0.5);
+    outline-color: ${EDITOR_COLORS.hover.half};
   }
 
   /* Column hover when child element is hovered - 50% opacity blue */
   .${EMAIL_BLOCK_CLASS_NAME}.is-column-hover-parent {
-    outline-color: rgba(59, 130, 246, 0.5);
+    outline-color: ${EDITOR_COLORS.hover.half};
   }
 
   /* Card selection in property-card-triple - 50% opacity blue */
   .${EMAIL_BLOCK_CLASS_NAME}.is-card-selected {
-    outline-color: rgba(59, 130, 246, 0.5);
+    outline-color: ${EDITOR_COLORS.hover.half};
   }
 
   /* Hide selection visual for configured elements (unless drag button hovered) */
@@ -3237,12 +3265,12 @@ function getEditorStyles(isDragButtonHovered, textEditingIdx) {
     outline-color: transparent !important;
   }
   .node-type-button.is-selected > table {
-    outline: 2px solid var(--outline-color, rgb(59, 130, 246));
+    outline: 2px solid var(--outline-color, ${EDITOR_COLORS.hover.solid});
     outline-offset: -2px;
     border-radius: 2px;
   }
   .node-type-button.is-hovered:not(.is-selected) > table {
-    outline: 2px solid var(--outline-color-hover, rgba(59, 130, 246, 0.5));
+    outline: 2px solid var(--outline-color-hover, ${EDITOR_COLORS.hover.half});
     outline-offset: -2px;
     border-radius: 2px;
   }
@@ -3255,12 +3283,12 @@ function getEditorStyles(isDragButtonHovered, textEditingIdx) {
     outline-color: transparent !important;
   }
   .node-type-image.is-selected table td {
-    outline: 2px solid var(--outline-color, rgb(59, 130, 246));
+    outline: 2px solid var(--outline-color, ${EDITOR_COLORS.hover.solid});
     outline-offset: -2px;
     border-radius: 2px;
   }
   .node-type-image.is-hovered:not(.is-selected) table td {
-    outline: 2px solid var(--outline-color-hover, rgba(59, 130, 246, 0.5));
+    outline: 2px solid var(--outline-color-hover, ${EDITOR_COLORS.hover.half});
     outline-offset: -2px;
     border-radius: 2px;
   }
@@ -3278,7 +3306,7 @@ function getEditorStyles(isDragButtonHovered, textEditingIdx) {
   /* Drop indicator - uses CSS variable for dynamic color */
   .drop-indicator {
     position: absolute;
-    background-color: var(--outline-color, rgb(59, 130, 246));
+    background-color: var(--outline-color, ${EDITOR_COLORS.hover.solid});
     pointer-events: none;
     z-index: 1000;
   }
@@ -3589,8 +3617,8 @@ var ShadowDomRenderer = memo(function ShadowDomRenderer2({
     contentWrapper.className = "shadow-content";
     contentWrapper.innerHTML = html;
     contentWrapper.style.setProperty("--company-footer-opacity", showCompanyFooter ? "1" : "0.25");
-    contentWrapper.style.setProperty("--outline-color", isDragging ? "rgb(147, 51, 234)" : "rgb(59, 130, 246)");
-    contentWrapper.style.setProperty("--outline-color-hover", isDragging ? "rgba(147, 51, 234, 0.5)" : "rgba(59, 130, 246, 0.5)");
+    contentWrapper.style.setProperty("--outline-color", isDragging ? EDITOR_COLORS.drag.solid : EDITOR_COLORS.hover.solid);
+    contentWrapper.style.setProperty("--outline-color-hover", isDragging ? EDITOR_COLORS.drag.half : EDITOR_COLORS.hover.half);
     const template = useEditorStore.getState().template;
     const linkColor2 = template?.content?.[0]?.data?.value?.linkColor || "#0000ff";
     contentWrapper.style.setProperty("--link-color", linkColor2);
@@ -3610,8 +3638,8 @@ var ShadowDomRenderer = memo(function ShadowDomRenderer2({
     if (!shadowRootRef.current) return;
     const contentWrapper = shadowRootRef.current.querySelector(".shadow-content");
     if (contentWrapper) {
-      contentWrapper.style.setProperty("--outline-color", isDragging ? "rgb(147, 51, 234)" : "rgb(59, 130, 246)");
-      contentWrapper.style.setProperty("--outline-color-hover", isDragging ? "rgba(147, 51, 234, 0.5)" : "rgba(59, 130, 246, 0.5)");
+      contentWrapper.style.setProperty("--outline-color", isDragging ? EDITOR_COLORS.drag.solid : EDITOR_COLORS.hover.solid);
+      contentWrapper.style.setProperty("--outline-color-hover", isDragging ? EDITOR_COLORS.drag.half : EDITOR_COLORS.hover.half);
       contentWrapper.style.setProperty("--company-footer-opacity", showCompanyFooter ? "1" : "0.25");
       const template = useEditorStore.getState().template;
       const linkColor2 = template?.content?.[0]?.data?.value?.linkColor || "#0000ff";
@@ -4071,11 +4099,11 @@ var ShadowDomRenderer = memo(function ShadowDomRenderer2({
             width: 3,
             height: dropIndicator.height
           },
-          backgroundColor: isDragging ? "rgb(147, 51, 234)" : "#3b82f6",
+          backgroundColor: isDragging ? EDITOR_COLORS.drag.solid : EDITOR_COLORS.hover.solid,
           borderRadius: 2,
           pointerEvents: "none",
           zIndex: 9999,
-          boxShadow: isDragging ? "0 0 4px rgba(147, 51, 234, 0.5)" : "0 0 4px rgba(59, 130, 246, 0.5)"
+          boxShadow: isDragging ? `0 0 4px ${EDITOR_COLORS.drag.half}` : `0 0 4px ${EDITOR_COLORS.hover.half}`
         },
         children: (dropIndicator.isNewSection || dropIndicator.isSplitSection) && /* @__PURE__ */ jsx(
           "div",
@@ -4085,7 +4113,7 @@ var ShadowDomRenderer = memo(function ShadowDomRenderer2({
               top: "50%",
               left: "50%",
               transform: "translate(-50%, -50%)",
-              backgroundColor: "rgb(147, 51, 234)",
+              backgroundColor: EDITOR_COLORS.drag.solid,
               color: "white",
               fontSize: 12,
               fontWeight: 600,
@@ -12091,7 +12119,7 @@ var TiptapOverlayContent = ({ idx, getReferenceRect, getShadowElement, initialWi
 };
 
 // src/core/editor/components/element-float.tsx
-import { useEffect as useEffect12, useMemo as useMemo10 } from "react";
+import { useEffect as useEffect12, useMemo as useMemo11 } from "react";
 import { useFloating as useFloating4, offset as offset4, shift as shift3, flip as flip2, autoUpdate as autoUpdate3 } from "@floating-ui/react";
 
 // src/core/editor/components/float-ui/actions/delete-button.tsx
@@ -12145,7 +12173,7 @@ var DuplicateButton = () => {
 };
 
 // src/core/editor/components/href-menu.tsx
-import { useState as useState3, useEffect as useEffect7 } from "react";
+import { useState as useState3, useEffect as useEffect7, useCallback as useCallback4, useMemo as useMemo5 } from "react";
 
 // src/components/ui/dropdown-menu.tsx
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
@@ -12322,19 +12350,36 @@ var useHref = () => {
 import { jsx as jsx25, jsxs as jsxs12 } from "react/jsx-runtime";
 var HrefMenu = () => {
   const { href, setHref, clearHref, copyHref, hasHref } = useHref();
+  const userData = useEditorStore((s) => s.userData);
   const [isOpen, setIsOpen] = useState3(false);
   const [inputValue, setInputValue] = useState3("");
   const [showCopied, setShowCopied] = useState3(false);
   const [linkType, setLinkType] = useState3(LINK_TYPES[1]);
   const [isLinkTypeOpen, setIsLinkTypeOpen] = useState3(false);
+  const [isPresetOpen, setIsPresetOpen] = useState3(false);
+  console.log("userData", userData);
+  const availablePresets = useMemo5(() => {
+    const presetDefs = LINK_PRESETS[linkType.name] ?? [];
+    if (!userData) return [];
+    const all = presetDefs.filter((p) => userData[p.key]).map((p) => ({ ...p, value: String(userData[p.key]) }));
+    if (!inputValue) return all;
+    const query = inputValue.toLowerCase();
+    return all.filter((p) => p.value.toLowerCase().includes(query));
+  }, [linkType.name, userData, inputValue]);
+  const handlePresetSelect = useCallback4((value) => {
+    setInputValue(value);
+    setIsPresetOpen(false);
+  }, []);
   useEffect7(() => {
     if (isOpen) {
       setLinkType(detectLinkType(href));
       setInputValue(stripPrefix(href));
+      setIsPresetOpen(true);
     }
   }, [isOpen, href]);
   const handleInputChange = (e) => {
     setInputValue(e.target.value);
+    setIsPresetOpen(true);
   };
   const buildHref = (value) => {
     if (!value) return "";
@@ -12344,15 +12389,22 @@ var HrefMenu = () => {
     if (value.startsWith(linkType.prefix)) return value;
     return linkType.prefix + value;
   };
+  const handleInputClick = () => {
+    if (availablePresets.length > 0) {
+      setIsPresetOpen(true);
+    }
+  };
   const handleInputBlur = () => {
     setHref(buildHref(inputValue));
   };
   const handleKeyDown = (e) => {
     if (e.key === "Enter") {
       setHref(buildHref(inputValue));
+      setIsPresetOpen(false);
       setIsOpen(false);
     }
     if (e.key === "Escape") {
+      setIsPresetOpen(false);
       setIsOpen(false);
     }
   };
@@ -12395,55 +12447,85 @@ var HrefMenu = () => {
     /* @__PURE__ */ jsxs12(DropdownMenuContent, { side: "bottom", className: "w-[250px] p-3 shadow-lg z-50001", children: [
       /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-2", children: [
         /* @__PURE__ */ jsx25(Label, { children: "Enter a link" }),
-        /* @__PURE__ */ jsxs12("div", { className: "relative", children: [
-          /* @__PURE__ */ jsx25(
-            Input,
-            {
-              type: linkType.inputType,
-              placeholder: linkType.placeholder,
-              className: "w-full rounded-[12px] shadow-none pl-12 h-[44px]",
-              value: inputValue,
-              onChange: handleInputChange,
-              onBlur: handleInputBlur,
-              onKeyDown: handleKeyDown,
-              autoFocus: true
-            }
-          ),
-          /* @__PURE__ */ jsxs12(Popover, { open: isLinkTypeOpen, onOpenChange: setIsLinkTypeOpen, children: [
-            /* @__PURE__ */ jsxs12(Tooltip, { children: [
-              /* @__PURE__ */ jsx25(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx25(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx25(Button, { size: "icon", variant: "ghost", className: "absolute shadow-none rounded-[12px] left-1.5 top-1/2 -translate-y-1/2 h-[34px] w-[34px] cursor-pointer", children: /* @__PURE__ */ jsx25(linkType.icon, {}) }) }) }),
-              /* @__PURE__ */ jsx25(TooltipContent, { side: "top", className: "z-50001", children: "Link Type" })
-            ] }),
+        /* @__PURE__ */ jsxs12(Popover, { open: isPresetOpen && availablePresets.length > 0, onOpenChange: setIsPresetOpen, children: [
+          /* @__PURE__ */ jsx25(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs12("div", { className: "relative", children: [
             /* @__PURE__ */ jsx25(
-              PopoverContent,
+              Input,
               {
-                side: "bottom",
-                align: "start",
-                className: "w-[160px] p-1 z-50001",
-                onPointerDownOutside: (e) => e.preventDefault(),
-                children: LINK_TYPES.map((type) => /* @__PURE__ */ jsxs12(
-                  Button,
-                  {
-                    variant: "ghost",
-                    className: "w-full justify-between shadow-none cursor-pointer",
-                    onClick: (e) => {
-                      e.stopPropagation();
-                      setLinkType(type);
-                      setIsLinkTypeOpen(false);
+                type: linkType.inputType,
+                placeholder: linkType.placeholder,
+                className: "w-full rounded-[12px] shadow-none pl-12 h-[44px]",
+                value: inputValue,
+                onChange: handleInputChange,
+                onClick: handleInputClick,
+                onBlur: handleInputBlur,
+                onKeyDown: handleKeyDown,
+                autoFocus: true
+              }
+            ),
+            /* @__PURE__ */ jsxs12(Popover, { open: isLinkTypeOpen, onOpenChange: setIsLinkTypeOpen, children: [
+              /* @__PURE__ */ jsxs12(Tooltip, { children: [
+                /* @__PURE__ */ jsx25(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx25(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx25(Button, { size: "icon", variant: "ghost", className: "absolute shadow-none rounded-[12px] left-1.5 top-1/2 -translate-y-1/2 h-[34px] w-[34px] cursor-pointer", children: /* @__PURE__ */ jsx25(linkType.icon, {}) }) }) }),
+                /* @__PURE__ */ jsx25(TooltipContent, { side: "top", className: "z-50001", children: "Link Type" })
+              ] }),
+              /* @__PURE__ */ jsx25(
+                PopoverContent,
+                {
+                  side: "bottom",
+                  align: "start",
+                  className: "w-[160px] p-1 z-50001",
+                  onPointerDownOutside: (e) => e.preventDefault(),
+                  children: LINK_TYPES.map((type) => /* @__PURE__ */ jsxs12(
+                    Button,
+                    {
+                      variant: "ghost",
+                      className: "w-full justify-between shadow-none cursor-pointer",
+                      onClick: (e) => {
+                        e.stopPropagation();
+                        setLinkType(type);
+                        setIsLinkTypeOpen(false);
+                      },
+                      children: [
+                        /* @__PURE__ */ jsxs12("span", { className: "flex items-center gap-2", children: [
+                          /* @__PURE__ */ jsx25(type.icon, { className: "size-4" }),
+                          type.name
+                        ] }),
+                        linkType.name === type.name && /* @__PURE__ */ jsx25(CheckIcon3, { className: "size-4" })
+                      ]
                     },
-                    children: [
-                      /* @__PURE__ */ jsxs12("span", { className: "flex items-center gap-2", children: [
-                        /* @__PURE__ */ jsx25(type.icon, { className: "size-4" }),
-                        type.name
-                      ] }),
-                      linkType.name === type.name && /* @__PURE__ */ jsx25(CheckIcon3, { className: "size-4" })
-                    ]
+                    type.name
+                  ))
+                }
+              )
+            ] })
+          ] }) }),
+          /* @__PURE__ */ jsx25(
+            PopoverContent,
+            {
+              side: "bottom",
+              align: "start",
+              className: "w-[var(--radix-popover-trigger-width)] p-0 overflow-hidden z-50001",
+              onOpenAutoFocus: (e) => e.preventDefault(),
+              children: /* @__PURE__ */ jsx25("div", { className: "flex flex-col max-h-[200px] overflow-y-auto", children: availablePresets.map((preset) => /* @__PURE__ */ jsxs12(
+                "button",
+                {
+                  className: `flex items-center justify-between px-3 py-2 text-sm hover:bg-accent cursor-pointer ${inputValue === preset.value ? "bg-accent font-medium" : ""}`,
+                  onMouseDown: (e) => {
+                    e.preventDefault();
+                    handlePresetSelect(preset.value);
                   },
-                  type.name
-                ))
-              }
-            )
-          ] })
+                  children: [
+                    /* @__PURE__ */ jsxs12("div", { className: "flex flex-col items-start gap-0.5", children: [
+                      /* @__PURE__ */ jsx25("span", { className: "text-xs text-muted-foreground", children: preset.label }),
+                      /* @__PURE__ */ jsx25("span", { className: "text-sm", children: preset.value })
+                    ] }),
+                    inputValue === preset.value && /* @__PURE__ */ jsx25(CheckIcon3, { className: "w-4 h-4 shrink-0" })
+                  ]
+                },
+                preset.key
+              )) })
+            }
+          )
         ] })
       ] }),
       /* @__PURE__ */ jsx25(Separator, { className: "my-2" }),
@@ -12508,11 +12590,11 @@ var ButtonFloat = () => {
 import { ChevronsLeftRightIcon, ChevronsRightLeftIcon, MoreHorizontalIcon } from "lucide-react";
 
 // src/core/editor/hooks/use-full-width-toggle.ts
-import { useCallback as useCallback4, useMemo as useMemo5 } from "react";
+import { useCallback as useCallback5, useMemo as useMemo6 } from "react";
 import { get as lodashGet3 } from "lodash";
 function useFullWidthToggle() {
   const { focusIdx, template, updateElement } = useEditorStore();
-  const { element, isFullWidth } = useMemo5(() => {
+  const { element, isFullWidth } = useMemo6(() => {
     if (!focusIdx || !template) return { element: null, isFullWidth: false };
     const path = focusIdx.startsWith("content.") ? focusIdx.replace("content.", "content[0].").replace(/\.\[(\d+)\]/g, "[$1]") : focusIdx;
     const el = lodashGet3(template, path);
@@ -12521,7 +12603,7 @@ function useFullWidthToggle() {
       isFullWidth: el?.attributes?.["full-width"] === "full-width"
     };
   }, [focusIdx, template]);
-  const handleToggleFullWidth = useCallback4(() => {
+  const handleToggleFullWidth = useCallback5(() => {
     if (!focusIdx || !element) return;
     const newAttributes = { ...element.attributes };
     if (isFullWidth) {
@@ -12558,11 +12640,11 @@ var SectionFloat = () => {
 import { CheckIcon as CheckIcon4, ChevronsLeftRightIcon as ChevronsLeftRightIcon2, ChevronsRightLeftIcon as ChevronsRightLeftIcon2, Layers2Icon, MoreHorizontalIcon as MoreHorizontalIcon2 } from "lucide-react";
 
 // src/core/editor/hooks/use-no-wrap.ts
-import { useCallback as useCallback5, useMemo as useMemo6 } from "react";
+import { useCallback as useCallback6, useMemo as useMemo7 } from "react";
 import { get as lodashGet4 } from "lodash";
 function useNoWrap() {
   const { focusIdx, template, updateElement } = useEditorStore();
-  const { element, noWrap } = useMemo6(() => {
+  const { element, noWrap } = useMemo7(() => {
     if (!focusIdx || !template) return { element: null, noWrap: false };
     const path = focusIdx.startsWith("content.") ? focusIdx.replace("content.", "content[0].").replace(/\.\[(\d+)\]/g, "[$1]") : focusIdx;
     const el = lodashGet4(template, path);
@@ -12571,7 +12653,7 @@ function useNoWrap() {
       noWrap: el?.data?.value?.noWrap === true
     };
   }, [focusIdx, template]);
-  const handleToggleNoWrap = useCallback5(() => {
+  const handleToggleNoWrap = useCallback6(() => {
     if (!focusIdx || !element) return;
     updateElement(focusIdx, {
       data: {
@@ -12702,7 +12784,7 @@ import { Accessibility, MoreHorizontalIcon as MoreHorizontalIcon4, TrashIcon as
 import { useState as useState6, useEffect as useEffect9 } from "react";
 
 // src/core/editor/components/social-item-menu.tsx
-import { useState as useState5, useEffect as useEffect8, useMemo as useMemo7, useCallback as useCallback6 } from "react";
+import { useState as useState5, useEffect as useEffect8, useMemo as useMemo8, useCallback as useCallback7 } from "react";
 import { PencilIcon as PencilIcon3, CheckIcon as CheckIcon5, CopyIcon as CopyIcon4 } from "lucide-react";
 import { get as lodashGet5 } from "lodash";
 import { jsx as jsx33, jsxs as jsxs18 } from "react/jsx-runtime";
@@ -12713,7 +12795,7 @@ var SocialItemMenu = ({ hasHref }) => {
   const [contentInputValue, setContentInputValue] = useState5("");
   const { href, setHref, copyHref } = useHref();
   const { focusIdx, template, updateElement } = useEditorStore();
-  const element = useMemo7(() => {
+  const element = useMemo8(() => {
     if (!focusIdx || !template) return null;
     const path = focusIdx.startsWith("content.") ? focusIdx.replace("content.", "content[0].").replace(/\.?\[(\d+)\]/g, "[$1]") : focusIdx;
     return lodashGet5(template, path);
@@ -12725,12 +12807,12 @@ var SocialItemMenu = ({ hasHref }) => {
       setContentInputValue(content);
     }
   }, [isOpen, href, content]);
-  const handleCopy = useCallback6(async () => {
+  const handleCopy = useCallback7(async () => {
     await copyHref();
     setShowCopied(true);
     setTimeout(() => setShowCopied(false), 2e3);
   }, [copyHref]);
-  const handleDone = useCallback6(() => {
+  const handleDone = useCallback7(() => {
     setHref(normalizeWebsiteUrl(hrefInputValue));
     if (focusIdx && element) {
       updateElement(focusIdx, {
@@ -12826,11 +12908,11 @@ var SocialItemMenu = ({ hasHref }) => {
 };
 
 // src/core/editor/hooks/use-alt.ts
-import { useMemo as useMemo8, useCallback as useCallback7 } from "react";
+import { useMemo as useMemo9, useCallback as useCallback8 } from "react";
 import { get as lodashGet6 } from "lodash";
 var useAlt = () => {
   const { focusIdx, updateElement, template } = useEditorStore();
-  const { element, alt } = useMemo8(() => {
+  const { element, alt } = useMemo9(() => {
     if (!focusIdx || !template) {
       return { element: null, alt: "" };
     }
@@ -12841,13 +12923,13 @@ var useAlt = () => {
       alt: el?.attributes?.alt || ""
     };
   }, [focusIdx, template]);
-  const setAlt = useCallback7((text2) => {
+  const setAlt = useCallback8((text2) => {
     if (!focusIdx || !element) return;
     updateElement(focusIdx, {
       attributes: { ...element.attributes, alt: text2 }
     });
   }, [focusIdx, element, updateElement]);
-  const clearAlt = useCallback7(() => {
+  const clearAlt = useCallback8(() => {
     if (!focusIdx || !element) return;
     updateElement(focusIdx, {
       attributes: { ...element.attributes, alt: "" }
@@ -12961,7 +13043,7 @@ var DividerFloat = () => {
 // src/core/editor/components/element-gear/image/float.tsx
 import { Accessibility as Accessibility2, CheckIcon as CheckIcon6, MoreHorizontalIcon as MoreHorizontalIcon5, Proportions } from "lucide-react";
 import lodashGet7 from "lodash/get";
-import { useState as useState7, useEffect as useEffect10, useMemo as useMemo9, useCallback as useCallback8 } from "react";
+import { useState as useState7, useEffect as useEffect10, useMemo as useMemo10, useCallback as useCallback9 } from "react";
 import { Fragment as Fragment13, jsx as jsx36, jsxs as jsxs21 } from "react/jsx-runtime";
 var ImageFloat = () => {
   const { href, hasHref } = useHref();
@@ -12970,7 +13052,7 @@ var ImageFloat = () => {
   const [showMoreView, setShowMoreView] = useState7(null);
   const [dropdownOpen, setDropdownOpen] = useState7(false);
   const [altInputValue, setAltInputValue] = useState7("");
-  const { element, isFluidOnMobile } = useMemo9(() => {
+  const { element, isFluidOnMobile } = useMemo10(() => {
     if (!focusIdx || !template) return { element: null, isFluidOnMobile: false };
     const path = focusIdx.startsWith("content.") ? focusIdx.replace("content.", "content[0].").replace(/\.\[(\d+)\]/g, "[$1]") : focusIdx;
     const el = lodashGet7(template, path);
@@ -12979,7 +13061,7 @@ var ImageFloat = () => {
       isFluidOnMobile: el?.attributes?.["fluid-on-mobile"] === "true"
     };
   }, [focusIdx, template]);
-  const toggleFluidOnMobile = useCallback8(() => {
+  const toggleFluidOnMobile = useCallback9(() => {
     if (!focusIdx || !element) return;
     const newAttributes = { ...element.attributes };
     if (isFluidOnMobile) {
@@ -13338,7 +13420,7 @@ var ElementFloat = ({ getReferenceRect, focusIdx, elementType }) => {
   );
 };
 var ElementFloatContent = ({ getReferenceRect, FloatComponent }) => {
-  const virtualReference = useMemo10(() => ({
+  const virtualReference = useMemo11(() => ({
     getBoundingClientRect: () => {
       const rect = getReferenceRect();
       if (!rect) {
@@ -13377,14 +13459,14 @@ var ElementFloatContent = ({ getReferenceRect, FloatComponent }) => {
 };
 
 // src/core/editor/components/scaling/divider-scale.tsx
-import { useMemo as useMemo11, useEffect as useEffect13, useState as useState9, useRef as useRef5, useCallback as useCallback10 } from "react";
+import { useMemo as useMemo12, useEffect as useEffect13, useState as useState9, useRef as useRef5, useCallback as useCallback11 } from "react";
 import { useFloating as useFloating5, offset as offset5, autoUpdate as autoUpdate4 } from "@floating-ui/react";
 import { jsx as jsx42, jsxs as jsxs25 } from "react/jsx-runtime";
 var DividerScale = ({ getReferenceRect }) => {
   const [dimensions, setDimensions] = useState9({ width: 0, height: 0 });
   const [activeSide, setActiveSide] = useState9(null);
   const { focusIdx, template, setIsScaling } = useEditorStore();
-  const { currentWidth, currentAlign } = useMemo11(() => {
+  const { currentWidth, currentAlign } = useMemo12(() => {
     if (!focusIdx || !template) return { currentWidth: 100, currentAlign: "center" };
     const element = getValueByIdx(template, focusIdx);
     const rawWidth = element?.attributes?.width;
@@ -13394,12 +13476,12 @@ var DividerScale = ({ getReferenceRect }) => {
     return { currentWidth: width, currentAlign: align };
   }, [focusIdx, template]);
   const dragRef = useRef5(null);
-  const getContainerWidth = useCallback10(() => {
+  const getContainerWidth = useCallback11(() => {
     const rect = getReferenceRect();
     if (!rect || currentWidth <= 0) return null;
     return rect.width / (currentWidth / 100);
   }, [getReferenceRect, currentWidth]);
-  const handlePointerDown = useCallback10((e, side) => {
+  const handlePointerDown = useCallback11((e, side) => {
     e.preventDefault();
     e.stopPropagation();
     const containerWidth = getContainerWidth();
@@ -13417,7 +13499,7 @@ var DividerScale = ({ getReferenceRect }) => {
     document.addEventListener("pointermove", handlePointerMove);
     document.addEventListener("pointerup", handlePointerUp);
   }, [getContainerWidth, currentWidth, currentAlign, setIsScaling]);
-  const handlePointerMove = useCallback10((e) => {
+  const handlePointerMove = useCallback11((e) => {
     if (!dragRef.current) return;
     const { startX, startWidth, containerWidth, side, align } = dragRef.current;
     const deltaX = e.clientX - startX;
@@ -13437,7 +13519,7 @@ var DividerScale = ({ getReferenceRect }) => {
       }
     });
   }, []);
-  const handlePointerUp = useCallback10(() => {
+  const handlePointerUp = useCallback11(() => {
     setActiveSide(null);
     setIsScaling(false);
     dragRef.current = null;
@@ -13450,7 +13532,7 @@ var DividerScale = ({ getReferenceRect }) => {
       document.removeEventListener("pointerup", handlePointerUp);
     };
   }, [handlePointerMove, handlePointerUp]);
-  const virtualReference = useMemo11(() => ({
+  const virtualReference = useMemo12(() => ({
     getBoundingClientRect: () => {
       const rect = getReferenceRect();
       if (!rect) {
@@ -13524,14 +13606,14 @@ var DividerScale = ({ getReferenceRect }) => {
 };
 
 // src/core/editor/components/scaling/button-scale.tsx
-import { useMemo as useMemo12, useEffect as useEffect14, useState as useState10, useRef as useRef6, useCallback as useCallback11 } from "react";
+import { useMemo as useMemo13, useEffect as useEffect14, useState as useState10, useRef as useRef6, useCallback as useCallback12 } from "react";
 import { useFloating as useFloating6, offset as offset6, autoUpdate as autoUpdate5 } from "@floating-ui/react";
 import { jsx as jsx43, jsxs as jsxs26 } from "react/jsx-runtime";
 var ButtonScale = ({ getReferenceRect }) => {
   const [dimensions, setDimensions] = useState10({ width: 0, height: 0 });
   const [activeSide, setActiveSide] = useState10(null);
   const { focusIdx, template, setIsScaling } = useEditorStore();
-  const { currentWidth, currentHeight, currentAlign } = useMemo12(() => {
+  const { currentWidth, currentHeight, currentAlign } = useMemo13(() => {
     if (!focusIdx || !template) {
       return { currentWidth: 24, currentHeight: 44, currentAlign: "center" };
     }
@@ -13546,12 +13628,12 @@ var ButtonScale = ({ getReferenceRect }) => {
     return { currentWidth: width, currentHeight: height, currentAlign: align };
   }, [focusIdx, template]);
   const dragRef = useRef6(null);
-  const getContainerWidth = useCallback11(() => {
+  const getContainerWidth = useCallback12(() => {
     const rect = getReferenceRect();
     if (!rect || currentWidth <= 0) return null;
     return rect.width / (currentWidth / 100);
   }, [getReferenceRect, currentWidth]);
-  const handlePointerDown = useCallback11((e, side) => {
+  const handlePointerDown = useCallback12((e, side) => {
     e.preventDefault();
     e.stopPropagation();
     if (document.activeElement instanceof HTMLElement) {
@@ -13573,7 +13655,7 @@ var ButtonScale = ({ getReferenceRect }) => {
     document.addEventListener("pointermove", handlePointerMove);
     document.addEventListener("pointerup", handlePointerUp);
   }, [getContainerWidth, currentWidth, currentHeight, currentAlign, setIsScaling]);
-  const handlePointerMove = useCallback11((e) => {
+  const handlePointerMove = useCallback12((e) => {
     if (!dragRef.current) return;
     const { startX, startY, startWidth, startHeight, containerWidth, side, align } = dragRef.current;
     const state = useEditorStore.getState();
@@ -13605,7 +13687,7 @@ var ButtonScale = ({ getReferenceRect }) => {
       });
     }
   }, []);
-  const handlePointerUp = useCallback11(() => {
+  const handlePointerUp = useCallback12(() => {
     setActiveSide(null);
     setIsScaling(false);
     dragRef.current = null;
@@ -13618,7 +13700,7 @@ var ButtonScale = ({ getReferenceRect }) => {
       document.removeEventListener("pointerup", handlePointerUp);
     };
   }, [handlePointerMove, handlePointerUp]);
-  const virtualReference = useMemo12(() => ({
+  const virtualReference = useMemo13(() => ({
     getBoundingClientRect: () => {
       const rect = getReferenceRect();
       if (!rect) {
@@ -13708,14 +13790,14 @@ var ButtonScale = ({ getReferenceRect }) => {
 };
 
 // src/core/editor/components/scaling/image-scale.tsx
-import { useMemo as useMemo13, useEffect as useEffect15, useState as useState11, useRef as useRef7, useCallback as useCallback12 } from "react";
+import { useMemo as useMemo14, useEffect as useEffect15, useState as useState11, useRef as useRef7, useCallback as useCallback13 } from "react";
 import { useFloating as useFloating7, offset as offset7, autoUpdate as autoUpdate6 } from "@floating-ui/react";
 import { jsx as jsx44, jsxs as jsxs27 } from "react/jsx-runtime";
 var ImageScale = ({ getReferenceRect }) => {
   const [dimensions, setDimensions] = useState11({ width: 0, height: 0 });
   const [activeSide, setActiveSide] = useState11(null);
   const { focusIdx, template, setIsScaling } = useEditorStore();
-  const { currentWidth, currentHeight, currentAlign } = useMemo13(() => {
+  const { currentWidth, currentHeight, currentAlign } = useMemo14(() => {
     if (!focusIdx || !template) {
       return { currentWidth: 0, currentHeight: 0, currentAlign: "center" };
     }
@@ -13730,7 +13812,7 @@ var ImageScale = ({ getReferenceRect }) => {
     return { currentWidth: width, currentHeight: height, currentAlign: align };
   }, [focusIdx, template]);
   const dragRef = useRef7(null);
-  const handlePointerDown = useCallback12((e, side) => {
+  const handlePointerDown = useCallback13((e, side) => {
     e.preventDefault();
     e.stopPropagation();
     if (document.activeElement instanceof HTMLElement) {
@@ -13753,7 +13835,7 @@ var ImageScale = ({ getReferenceRect }) => {
     document.addEventListener("pointermove", handlePointerMove);
     document.addEventListener("pointerup", handlePointerUp);
   }, [getReferenceRect, currentWidth, currentHeight, currentAlign, setIsScaling]);
-  const handlePointerMove = useCallback12((e) => {
+  const handlePointerMove = useCallback13((e) => {
     if (!dragRef.current) return;
     const { startX, startY, startWidth, startHeight, side, align } = dragRef.current;
     const state = useEditorStore.getState();
@@ -13784,7 +13866,7 @@ var ImageScale = ({ getReferenceRect }) => {
       });
     }
   }, []);
-  const handlePointerUp = useCallback12(() => {
+  const handlePointerUp = useCallback13(() => {
     setActiveSide(null);
     setIsScaling(false);
     dragRef.current = null;
@@ -13797,7 +13879,7 @@ var ImageScale = ({ getReferenceRect }) => {
       document.removeEventListener("pointerup", handlePointerUp);
     };
   }, [handlePointerMove, handlePointerUp]);
-  const virtualReference = useMemo13(() => ({
+  const virtualReference = useMemo14(() => ({
     getBoundingClientRect: () => {
       const rect = getReferenceRect();
       if (!rect) {
@@ -13887,14 +13969,14 @@ var ImageScale = ({ getReferenceRect }) => {
 };
 
 // src/core/editor/components/scaling/spacer-scale.tsx
-import { useMemo as useMemo14, useEffect as useEffect16, useState as useState12, useRef as useRef8, useCallback as useCallback13 } from "react";
+import { useMemo as useMemo15, useEffect as useEffect16, useState as useState12, useRef as useRef8, useCallback as useCallback14 } from "react";
 import { useFloating as useFloating8, offset as offset8, autoUpdate as autoUpdate7 } from "@floating-ui/react";
 import { jsx as jsx45, jsxs as jsxs28 } from "react/jsx-runtime";
 var SpacerScale = ({ getReferenceRect }) => {
   const [dimensions, setDimensions] = useState12({ width: 0, height: 0 });
   const [activeSide, setActiveSide] = useState12(null);
   const { focusIdx, template, setIsScaling } = useEditorStore();
-  const currentHeight = useMemo14(() => {
+  const currentHeight = useMemo15(() => {
     if (!focusIdx || !template) return 12;
     const element = getValueByIdx(template, focusIdx);
     const rawHeight = element?.attributes?.height;
@@ -13902,7 +13984,7 @@ var SpacerScale = ({ getReferenceRect }) => {
     return isNaN(parsedHeight) ? 12 : Math.max(12, Math.min(200, parsedHeight));
   }, [focusIdx, template]);
   const dragRef = useRef8(null);
-  const handlePointerDown = useCallback13((e, side) => {
+  const handlePointerDown = useCallback14((e, side) => {
     e.preventDefault();
     e.stopPropagation();
     if (document.activeElement instanceof HTMLElement) {
@@ -13918,7 +14000,7 @@ var SpacerScale = ({ getReferenceRect }) => {
     document.addEventListener("pointermove", handlePointerMove);
     document.addEventListener("pointerup", handlePointerUp);
   }, [currentHeight, setIsScaling]);
-  const handlePointerMove = useCallback13((e) => {
+  const handlePointerMove = useCallback14((e) => {
     if (!dragRef.current) return;
     const { startY, startHeight, side } = dragRef.current;
     const state = useEditorStore.getState();
@@ -13936,7 +14018,7 @@ var SpacerScale = ({ getReferenceRect }) => {
       }
     });
   }, []);
-  const handlePointerUp = useCallback13(() => {
+  const handlePointerUp = useCallback14(() => {
     setActiveSide(null);
     setIsScaling(false);
     dragRef.current = null;
@@ -13949,7 +14031,7 @@ var SpacerScale = ({ getReferenceRect }) => {
       document.removeEventListener("pointerup", handlePointerUp);
     };
   }, [handlePointerMove, handlePointerUp]);
-  const virtualReference = useMemo14(() => ({
+  const virtualReference = useMemo15(() => ({
     getBoundingClientRect: () => {
       const rect = getReferenceRect();
       if (!rect) {
@@ -14023,19 +14105,19 @@ var SpacerScale = ({ getReferenceRect }) => {
 };
 
 // src/core/editor/components/scaling/column-scale.tsx
-import { useMemo as useMemo15, useEffect as useEffect17, useState as useState13, useRef as useRef9, useCallback as useCallback14 } from "react";
+import { useMemo as useMemo16, useEffect as useEffect17, useState as useState13, useRef as useRef9, useCallback as useCallback15 } from "react";
 import { Fragment as Fragment17, jsx as jsx46 } from "react/jsx-runtime";
 var ColumnScale = ({ sectionColumnIdx, shadowRoot }) => {
   const [activeDivider, setActiveDivider] = useState13(null);
   const [columnRects, setColumnRects] = useState13([]);
   const { template, setIsScaling, setFocusIdx, stopTextEditing } = useEditorStore();
-  const columnWidths = useMemo15(() => {
+  const columnWidths = useMemo16(() => {
     if (!template) return [];
     const sectionColumn = getValueByIdx(template, sectionColumnIdx);
     return sectionColumn?.data?.value?.columnWidths || [];
   }, [template, sectionColumnIdx]);
   const dragRef = useRef9(null);
-  const updateColumnRects = useCallback14(() => {
+  const updateColumnRects = useCallback15(() => {
     if (!shadowRoot) return;
     const allColumns = shadowRoot.querySelectorAll(".node-type-column");
     const matchingColumns = [];
@@ -14080,7 +14162,7 @@ var ColumnScale = ({ sectionColumnIdx, shadowRoot }) => {
   const parseWidth = (width) => {
     return parseFloat(width.replace("%", ""));
   };
-  const handlePointerDown = useCallback14((e, dividerIndex) => {
+  const handlePointerDown = useCallback15((e, dividerIndex) => {
     e.preventDefault();
     e.stopPropagation();
     stopTextEditing();
@@ -14106,7 +14188,7 @@ var ColumnScale = ({ sectionColumnIdx, shadowRoot }) => {
     document.addEventListener("pointermove", handlePointerMove);
     document.addEventListener("pointerup", handlePointerUp);
   }, [columnRects, columnWidths, setIsScaling]);
-  const handlePointerMove = useCallback14((e) => {
+  const handlePointerMove = useCallback15((e) => {
     if (!dragRef.current) return;
     const { startX, leftColIndex, rightColIndex, startLeftWidth, startRightWidth, sectionWidth, allWidths } = dragRef.current;
     const deltaX = e.clientX - startX;
@@ -14140,7 +14222,7 @@ var ColumnScale = ({ sectionColumnIdx, shadowRoot }) => {
       }
     });
   }, [sectionColumnIdx]);
-  const handlePointerUp = useCallback14(() => {
+  const handlePointerUp = useCallback15(() => {
     setActiveDivider(null);
     setIsScaling(false);
     dragRef.current = null;
@@ -14227,7 +14309,7 @@ function Spinner({ className, ...props }) {
 import { EyeIcon } from "lucide-react";
 
 // src/render/useMjmlCompiler.ts
-import { useState as useState14, useCallback as useCallback15 } from "react";
+import { useState as useState14, useCallback as useCallback16 } from "react";
 async function compileMjml(mjml) {
   console.log("Compiling MJML", mjml);
   const response = await fetch("/api/mrender", {
@@ -14544,13 +14626,13 @@ function Editor({ setEditorLoading }) {
     };
     convertMjml();
   }, [renderData]);
-  const debouncedUpdateContent = useMemo16(
+  const debouncedUpdateContent = useMemo17(
     () => debounce((contentIdx, content) => {
       updateElementContent(contentIdx, content);
     }, 200),
     [updateElementContent]
   );
-  const handleElementClick = useCallback16(
+  const handleElementClick = useCallback17(
     (idx) => {
       if (isInsideCompanyFooter(idx, template)) {
         return;
@@ -14563,7 +14645,7 @@ function Editor({ setEditorLoading }) {
     },
     [setFocusIdx, template]
   );
-  const handleElementHover = useCallback16(
+  const handleElementHover = useCallback17(
     (idx) => {
       if (!isDragging) {
         if (idx) {
@@ -14577,19 +14659,19 @@ function Editor({ setEditorLoading }) {
     },
     [isDragging, setHoverIdx, template]
   );
-  const handleContentInput = useCallback16(
+  const handleContentInput = useCallback17(
     (contentIdx, content) => {
       debouncedUpdateContent(contentIdx, content);
     },
     [debouncedUpdateContent]
   );
-  const handleEditingStart = useCallback16(() => {
+  const handleEditingStart = useCallback17(() => {
     setIsEditing(true);
   }, []);
-  const handleEditingEnd = useCallback16(() => {
+  const handleEditingEnd = useCallback17(() => {
     setIsEditing(false);
   }, []);
-  const handleSlashCommand = useCallback16(
+  const handleSlashCommand = useCallback17(
     (cursorRect) => {
       setSlashCommand({
         isActive: true,
@@ -14604,10 +14686,10 @@ function Editor({ setEditorLoading }) {
     },
     [setSlashCommand]
   );
-  const handleSlashCommandClose = useCallback16(() => {
+  const handleSlashCommandClose = useCallback17(() => {
     clearSlashCommand();
   }, [clearSlashCommand]);
-  const handleTextEditStart = useCallback16(
+  const handleTextEditStart = useCallback17(
     (idx, initialWidth, initialHeight, clickX, clickY, content, styles) => {
       const getReferenceRect2 = () => {
         if (!shadowRootRef.current) return null;
@@ -14622,11 +14704,11 @@ function Editor({ setEditorLoading }) {
     },
     [startTextEditing]
   );
-  const findParentSectionIdx = useCallback16((idx) => {
+  const findParentSectionIdx = useCallback17((idx) => {
     const match = /^(content\.children\.\[\d+\])/.exec(idx);
     return match ? match[1] : null;
   }, []);
-  const handleDragOver = useCallback16(
+  const handleDragOver = useCallback17(
     (_e, dragInfo) => {
       const currentDataTransfer = useEditorStore.getState().dataTransfer;
       if (!currentDataTransfer) return;
@@ -15037,7 +15119,7 @@ function Editor({ setEditorLoading }) {
     [findParentSectionIdx]
     // Only dependency is the helper function
   );
-  const handleDrop = useCallback16(
+  const handleDrop = useCallback17(
     (_e, _dragInfo) => {
       const currentDataTransfer = useEditorStore.getState().dataTransfer;
       if (!currentDataTransfer) return;
@@ -15176,7 +15258,7 @@ function Editor({ setEditorLoading }) {
     },
     [addElement, addElementInNewSection, moveElement, moveElementToNewSection, splitTextAndInsertElement, splitSectionAndInsertElement, setIsDragging, setIsDragButtonHovered, setDataTransfer, setHoverIdx]
   );
-  const handleDragLeave = useCallback16(() => {
+  const handleDragLeave = useCallback17(() => {
     setDropIndicator(null);
     setDropTargetIdx(null);
     dragParentIdxRef.current = null;
@@ -15192,13 +15274,13 @@ function Editor({ setEditorLoading }) {
     sectionElementCacheRef.current.clear();
     sectionRectCacheRef.current.clear();
   }, []);
-  const handleShadowRootRef = useCallback16((shadowRoot) => {
+  const handleShadowRootRef = useCallback17((shadowRoot) => {
     shadowRootRef.current = shadowRoot;
   }, []);
-  const handleSelectionRectChange = useCallback16((rect) => {
+  const handleSelectionRectChange = useCallback17((rect) => {
     setHasSelectedElement(rect !== null);
   }, []);
-  const getReferenceRect = useCallback16(() => {
+  const getReferenceRect = useCallback17(() => {
     if (!shadowRootRef.current || !focusIdx) return null;
     const selectedEl = shadowRootRef.current.querySelector(
       `.node-idx-${CSS.escape(focusIdx)}`
@@ -15226,7 +15308,7 @@ function Editor({ setEditorLoading }) {
   }, [focusIdx]);
   const selectedElement = focusIdx && renderData ? getValueByIdx(renderData, focusIdx) : null;
   const canDragSelectedElement = selectedElement && selectedElement.type !== "column" && !(focusIdx && renderData && isInsideCompanyFooter(focusIdx, renderData));
-  const showCompanyFooter = useMemo16(
+  const showCompanyFooter = useMemo17(
     () => template.content[0]?.data?.value?.showCompanyFooter ?? true,
     [template.content[0]?.data?.value?.showCompanyFooter]
   );
@@ -15336,7 +15418,6 @@ export {
   parsePrice,
   json2mjml,
   MAX_TEMPLATE_SIZE,
-  MAX_PAID_LEVEL,
   useEditorStore,
   BUTTON_ALIGNMENTS,
   ALIGNMENT_ICONS,
@@ -15355,7 +15436,6 @@ export {
   MIN_LINE_HEIGHT,
   MAX_LINE_HEIGHT,
   LINE_HEIGHT_STEP,
-  IMAGE_SELECTION_VALID_TYPES,
   setupDragImage,
   getElementDisplayName,
   cn,