@maildeno/editor 0.4.2 → 0.4.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@maildeno/editor",
-  "version": "0.4.2",
+  "version": "0.4.4",
   "description": "An open-source, framework-agnostic email template editor. Drag-and-drop block editing, HTML/MJML/React Email/JSON export, and a pluggable ESP-conditional-logic engine with zero required backend.",
   "type": "module",
   "types": "./dist/index.d.ts",

package/dist/RowPreviewChildren-DT0y0lKC.js

@@ -1,4 +0,0 @@
-import { G as _sfc_main } from "./element-C2ZH0Z_i.js";
-export {
-  _sfc_main as default
-};

package/dist/RowPreviewChildren-OsbF7_vu.js

@@ -1,4 +0,0 @@
-import { _ as _sfc_main } from "./index-DhFg3uKs.js";
-export {
-  _sfc_main as default
-};

package/dist/RowPreviewLegacyComponent-BV4b5bHQ.js

@@ -1,487 +0,0 @@
-import { n as defineComponent, o as computed, q as openBlock, A as createBlock, v as normalizeStyle, B as resolveDynamicComponent, t as createElementBlock, C as createBaseVNode, y as createCommentVNode, D as createTextVNode, E as toDisplayString, F as Fragment, u as renderList } from "./element-C2ZH0Z_i.js";
-const _hoisted_1 = ["innerHTML"];
-const _hoisted_2 = ["src", "alt"];
-const _hoisted_3 = ["src", "alt"];
-const _hoisted_4 = {
-  style: { "width": "30%", "height": "30%", "color": "#9ca3af" },
-  fill: "currentColor",
-  viewBox: "0 0 20 20"
-};
-const _hoisted_5 = ["src", "alt"];
-const _hoisted_6 = ["src", "alt"];
-const _hoisted_7 = ["innerHTML"];
-const _hoisted_8 = { key: 8 };
-const _hoisted_9 = { key: 0 };
-const _hoisted_10 = ["src", "alt"];
-const _hoisted_11 = {
-  key: 1,
-  style: { "font-size": "7px", "color": "#9ca3af", "font-style": "italic" }
-};
-const _hoisted_12 = {
-  key: 11,
-  class: "rounded truncate",
-  style: { "font-size": "7px", "color": "#9ca3af", "background": "#f3f4f6", "padding": "1px 3px" }
-};
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "RowPreviewLegacyComponent",
-  props: {
-    comp: {},
-    scale: {}
-  },
-  setup(__props) {
-    const props = __props;
-    const compType = computed(() => props.comp.componentType ?? props.comp.type);
-    function resolvePreviewHtml(html) {
-      if (!html) return "";
-      return html.replace(
-        /<span[^>]*\bdata-merge="([^"]+)"(?:[^>]*\bdata-merge-default="([^"]*)")?[^>]*>.*?<\/span>/gs,
-        (_, name, fallback) => {
-          const tag = name.trim();
-          const def = fallback == null ? void 0 : fallback.trim();
-          return def ? `{{ ${tag}|'${def}' }}` : `{{ ${tag} }}`;
-        }
-      );
-    }
-    function resolveBackground(item) {
-      var _a;
-      const bg = item == null ? void 0 : item.backgroundGradient;
-      const hasGradient = (bg == null ? void 0 : bg.useGradient) === true && Array.isArray((_a = bg == null ? void 0 : bg.gradient) == null ? void 0 : _a.colors) && bg.gradient.colors.length >= 2;
-      if (hasGradient) {
-        const { type, direction, colors } = bg.gradient;
-        const stops = colors.map((c) => `${c.color} ${c.position}%`).join(", ");
-        return type === "radial" ? `radial-gradient(circle at center, ${stops})` : `linear-gradient(${direction}, ${stops})`;
-      }
-      return (item == null ? void 0 : item.backgroundColor) || "transparent";
-    }
-    function loadGoogleFont(fontFamily) {
-      if (!fontFamily) return;
-      const knownGoogleFonts = [
-        "Roboto",
-        "Open Sans",
-        "Lato",
-        "Montserrat",
-        "Poppins",
-        "Nunito",
-        "Raleway",
-        "Plus Jakarta Sans"
-      ];
-      const isGoogle = fontFamily.includes(" ") || knownGoogleFonts.some((f) => fontFamily.includes(f));
-      if (isGoogle && typeof document !== "undefined") {
-        const formatted = fontFamily.replace(/ /g, "+");
-        const href = `https://fonts.googleapis.com/css2?family=${formatted}:wght@300;400;500;600;700;800&display=swap`;
-        if (!document.querySelector(`link[href="${href}"]`)) {
-          const link = document.createElement("link");
-          link.href = href;
-          link.rel = "stylesheet";
-          document.head.appendChild(link);
-        }
-      }
-    }
-    function headingStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      if (p == null ? void 0 : p.fontFamily) loadGoogleFont(p.fontFamily);
-      return {
-        fontSize: Math.max(7, (p == null ? void 0 : p.fontSize) || 24) + "px",
-        color: (p == null ? void 0 : p.color) || "#111111",
-        fontWeight: (p == null ? void 0 : p.fontWeight) || "bold",
-        fontFamily: (p == null ? void 0 : p.fontFamily) || "Arial, sans-serif",
-        textAlign: (p == null ? void 0 : p.align) || "left",
-        lineHeight: String((p == null ? void 0 : p.lineHeight) ?? 1.2),
-        letterSpacing: `${(p == null ? void 0 : p.letterSpacing) ?? 0}px`,
-        textTransform: (p == null ? void 0 : p.textTransform) || "none",
-        textDecoration: (p == null ? void 0 : p.textDecoration) || "none",
-        background: resolveBackground(p),
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 4}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        padding: `${((_e = p == null ? void 0 : p.padding) == null ? void 0 : _e.top) ?? 0}px ${((_f = p == null ? void 0 : p.padding) == null ? void 0 : _f.right) ?? 0}px ${((_g = p == null ? void 0 : p.padding) == null ? void 0 : _g.bottom) ?? 0}px ${((_h = p == null ? void 0 : p.padding) == null ? void 0 : _h.left) ?? 0}px`
-      };
-    }
-    function paragraphStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      if (p == null ? void 0 : p.fontFamily) loadGoogleFont(p.fontFamily);
-      return {
-        fontSize: Math.max(6, (p == null ? void 0 : p.fontSize) || 16) + "px",
-        color: (p == null ? void 0 : p.color) || "#111111",
-        fontFamily: (p == null ? void 0 : p.fontFamily) || "Arial, sans-serif",
-        fontWeight: (p == null ? void 0 : p.fontWeight) || "normal",
-        fontStyle: (p == null ? void 0 : p.fontStyle) || "normal",
-        textAlign: (p == null ? void 0 : p.align) || "left",
-        lineHeight: String((p == null ? void 0 : p.lineHeight) ?? 1.5),
-        letterSpacing: `${(p == null ? void 0 : p.letterSpacing) ?? 0}px`,
-        textTransform: (p == null ? void 0 : p.textTransform) || "none",
-        textDecoration: (p == null ? void 0 : p.textDecoration) || "none",
-        background: resolveBackground(p),
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 4}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        padding: `${((_e = p == null ? void 0 : p.padding) == null ? void 0 : _e.top) ?? 0}px ${((_f = p == null ? void 0 : p.padding) == null ? void 0 : _f.right) ?? 0}px ${((_g = p == null ? void 0 : p.padding) == null ? void 0 : _g.bottom) ?? 0}px ${((_h = p == null ? void 0 : p.padding) == null ? void 0 : _h.left) ?? 0}px`
-      };
-    }
-    function imageContainerStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      return {
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 0}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        padding: `${((_e = p == null ? void 0 : p.padding) == null ? void 0 : _e.top) ?? 0}px ${((_f = p == null ? void 0 : p.padding) == null ? void 0 : _f.right) ?? 0}px ${((_g = p == null ? void 0 : p.padding) == null ? void 0 : _g.bottom) ?? 0}px ${((_h = p == null ? void 0 : p.padding) == null ? void 0 : _h.left) ?? 0}px`,
-        textAlign: (p == null ? void 0 : p.align) || "left"
-      };
-    }
-    function imageStyle(p) {
-      var _a, _b, _c;
-      const align = (p == null ? void 0 : p.align) || "left";
-      return {
-        width: ((p == null ? void 0 : p.width) || 100) + "%",
-        height: (p == null ? void 0 : p.height) || "auto",
-        borderRadius: ((p == null ? void 0 : p.borderRadius) || 0) + "px",
-        border: `${((_a = p == null ? void 0 : p.border) == null ? void 0 : _a.width) || 0}px ${((_b = p == null ? void 0 : p.border) == null ? void 0 : _b.style) || "solid"} ${((_c = p == null ? void 0 : p.border) == null ? void 0 : _c.color) || "#000000"}`,
-        display: "block",
-        margin: align === "center" ? "0 auto" : align === "right" ? "0 0 0 auto" : "0"
-      };
-    }
-    function videoContainerStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      return {
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 0}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        padding: `${((_e = p == null ? void 0 : p.padding) == null ? void 0 : _e.top) ?? 0}px ${((_f = p == null ? void 0 : p.padding) == null ? void 0 : _f.right) ?? 0}px ${((_g = p == null ? void 0 : p.padding) == null ? void 0 : _g.bottom) ?? 0}px ${((_h = p == null ? void 0 : p.padding) == null ? void 0 : _h.left) ?? 0}px`,
-        textAlign: (p == null ? void 0 : p.align) || "left",
-        maxWidth: "100%"
-      };
-    }
-    function videoThumbnailStyle(p) {
-      var _a, _b, _c;
-      const align = (p == null ? void 0 : p.align) || "left";
-      return {
-        width: "100%",
-        maxWidth: "100%",
-        paddingBottom: "56.25%",
-        height: "0",
-        position: "relative",
-        display: "inline-block",
-        borderRadius: ((p == null ? void 0 : p.borderRadius) || 0) + "px",
-        border: `${((_a = p == null ? void 0 : p.border) == null ? void 0 : _a.width) || 0}px ${((_b = p == null ? void 0 : p.border) == null ? void 0 : _b.style) || "solid"} ${((_c = p == null ? void 0 : p.border) == null ? void 0 : _c.color) || "#000000"}`,
-        overflow: "hidden",
-        marginLeft: align === "center" ? "auto" : align === "right" ? "auto" : "0",
-        marginRight: align === "center" ? "auto" : "0",
-        boxSizing: "border-box"
-      };
-    }
-    function videoImageStyle() {
-      return {
-        position: "absolute",
-        top: "0",
-        left: "0",
-        width: "100%",
-        height: "100%",
-        objectFit: "cover",
-        display: "block"
-      };
-    }
-    function videoPlaceholderStyle() {
-      return {
-        position: "absolute",
-        top: "0",
-        left: "0",
-        width: "100%",
-        height: "100%",
-        background: "#e5e7eb",
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center"
-      };
-    }
-    function buttonContainerStyle(p) {
-      var _a, _b, _c, _d;
-      return {
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 4}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        textAlign: (p == null ? void 0 : p.align) || "center"
-      };
-    }
-    function buttonStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g;
-      if (p == null ? void 0 : p.fontFamily) loadGoogleFont(p.fontFamily);
-      const hasIcon = !!(p == null ? void 0 : p.icon);
-      return {
-        background: resolveBackground(p),
-        color: (p == null ? void 0 : p.color) || "#ffffff",
-        fontSize: Math.max(5, (p == null ? void 0 : p.fontSize) || 16) + "px",
-        fontWeight: (p == null ? void 0 : p.fontWeight) || "500",
-        fontFamily: (p == null ? void 0 : p.fontFamily) || "Arial, sans-serif",
-        letterSpacing: `${(p == null ? void 0 : p.letterSpacing) ?? 0}px`,
-        padding: `${((_a = p == null ? void 0 : p.padding) == null ? void 0 : _a.top) ?? 8}px ${((_b = p == null ? void 0 : p.padding) == null ? void 0 : _b.right) ?? 16}px ${((_c = p == null ? void 0 : p.padding) == null ? void 0 : _c.bottom) ?? 8}px ${((_d = p == null ? void 0 : p.padding) == null ? void 0 : _d.left) ?? 16}px`,
-        borderRadius: ((p == null ? void 0 : p.borderRadius) || 4) + "px",
-        border: `${((_e = p == null ? void 0 : p.border) == null ? void 0 : _e.width) || 0}px ${((_f = p == null ? void 0 : p.border) == null ? void 0 : _f.style) || "solid"} ${((_g = p == null ? void 0 : p.border) == null ? void 0 : _g.color) || "#000000"}`,
-        // Icon branch uses inline-flex so icon + text align cleanly on one row.
-        // Plain branch stays inline-block (unchanged behaviour).
-        ...hasIcon ? {
-          display: "inline-flex",
-          alignItems: "center",
-          verticalAlign: "middle"
-        } : { display: "inline-block" },
-        lineHeight: "1.2",
-        textDecoration: "none"
-      };
-    }
-    function buttonIconStyle(p) {
-      const size = Math.max(4, (p == null ? void 0 : p.iconSize) ?? 20);
-      const gap = (p == null ? void 0 : p.iconGap) ?? 8;
-      const isBefore = (p == null ? void 0 : p.iconPosition) !== "after";
-      return {
-        display: "block",
-        width: size + "px",
-        height: size + "px",
-        flexShrink: "0",
-        marginRight: isBefore ? gap + "px" : "0",
-        marginLeft: isBefore ? "0" : gap + "px"
-      };
-    }
-    function onIconError(e) {
-      const img = e.target;
-      img.style.display = "none";
-    }
-    function anchorContainerStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      return {
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 4}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        padding: `${((_e = p == null ? void 0 : p.padding) == null ? void 0 : _e.top) ?? 0}px ${((_f = p == null ? void 0 : p.padding) == null ? void 0 : _f.right) ?? 0}px ${((_g = p == null ? void 0 : p.padding) == null ? void 0 : _g.bottom) ?? 0}px ${((_h = p == null ? void 0 : p.padding) == null ? void 0 : _h.left) ?? 0}px`,
-        textAlign: (p == null ? void 0 : p.align) || "left"
-      };
-    }
-    function anchorStyle(p) {
-      if (p == null ? void 0 : p.fontFamily) loadGoogleFont(p.fontFamily);
-      return {
-        color: (p == null ? void 0 : p.color) || "#007bff",
-        fontSize: Math.max(6, (p == null ? void 0 : p.fontSize) || 16) + "px",
-        fontWeight: (p == null ? void 0 : p.fontWeight) || "normal",
-        fontFamily: (p == null ? void 0 : p.fontFamily) || "Arial, sans-serif",
-        letterSpacing: `${(p == null ? void 0 : p.letterSpacing) ?? 0}px`,
-        textDecoration: (p == null ? void 0 : p.textDecoration) || "underline"
-      };
-    }
-    function listWrapStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      if (p == null ? void 0 : p.fontFamily) loadGoogleFont(p.fontFamily);
-      return {
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 0}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        padding: `${((_e = p == null ? void 0 : p.padding) == null ? void 0 : _e.top) ?? 0}px ${((_f = p == null ? void 0 : p.padding) == null ? void 0 : _f.right) ?? 0}px ${((_g = p == null ? void 0 : p.padding) == null ? void 0 : _g.bottom) ?? 0}px ${((_h = p == null ? void 0 : p.padding) == null ? void 0 : _h.left) ?? 16}px`,
-        fontSize: Math.max(6, (p == null ? void 0 : p.fontSize) || 16) + "px",
-        fontFamily: (p == null ? void 0 : p.fontFamily) || "Arial, sans-serif",
-        lineHeight: String((p == null ? void 0 : p.lineHeight) ?? 1.5),
-        letterSpacing: `${(p == null ? void 0 : p.letterSpacing) ?? 0}px`,
-        color: (p == null ? void 0 : p.color) || "#111111",
-        background: resolveBackground(p)
-      };
-    }
-    function dividerContainerStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      return {
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 0}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        padding: `${((_e = p == null ? void 0 : p.padding) == null ? void 0 : _e.top) ?? 0}px ${((_f = p == null ? void 0 : p.padding) == null ? void 0 : _f.right) ?? 0}px ${((_g = p == null ? void 0 : p.padding) == null ? void 0 : _g.bottom) ?? 0}px ${((_h = p == null ? void 0 : p.padding) == null ? void 0 : _h.left) ?? 0}px`,
-        textAlign: (p == null ? void 0 : p.align) || "left"
-      };
-    }
-    function dividerStyle(p) {
-      const align = (p == null ? void 0 : p.align) || "left";
-      return {
-        width: ((p == null ? void 0 : p.width) || 100) + "%",
-        height: ((p == null ? void 0 : p.height) || 1) + "px",
-        background: resolveBackground(p),
-        border: "none",
-        margin: align === "center" ? "0 auto" : align === "right" ? "0 0 0 auto" : "0"
-      };
-    }
-    function spacerStyle(p) {
-      return {
-        width: "100%",
-        height: ((p == null ? void 0 : p.height) || 16) + "px",
-        background: resolveBackground(p)
-      };
-    }
-    function menuContainerStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      if (p == null ? void 0 : p.fontFamily) loadGoogleFont(p.fontFamily);
-      return {
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 0}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        padding: `${((_e = p == null ? void 0 : p.padding) == null ? void 0 : _e.top) ?? 0}px ${((_f = p == null ? void 0 : p.padding) == null ? void 0 : _f.right) ?? 0}px ${((_g = p == null ? void 0 : p.padding) == null ? void 0 : _g.bottom) ?? 0}px ${((_h = p == null ? void 0 : p.padding) == null ? void 0 : _h.left) ?? 0}px`,
-        textAlign: (p == null ? void 0 : p.align) || "left",
-        lineHeight: "0",
-        background: resolveBackground(p)
-      };
-    }
-    function menuItemStyle(p, index, total) {
-      if (p == null ? void 0 : p.fontFamily) loadGoogleFont(p.fontFamily);
-      const isStacked = (p == null ? void 0 : p.mobileStack) === true;
-      const spacing = (p == null ? void 0 : p.spacing) ?? 8;
-      const isFirst = index === 0;
-      const isLast = index === total - 1;
-      return {
-        // display is always block, used for showcase
-        display: "inline-block",
-        marginLeft: isFirst ? "0px" : `${spacing / 2}px`,
-        marginRight: isLast ? "0px" : `${spacing / 2}px`,
-        // marginBottom: isStacked && !isLast ? `${spacing}px` : "0",
-        fontSize: Math.max(6, (p == null ? void 0 : p.fontSize) ?? 14) + "px",
-        lineHeight: String((p == null ? void 0 : p.lineHeight) ?? 1.4),
-        letterSpacing: ((p == null ? void 0 : p.letterSpacing) ?? 0) + "px",
-        color: (p == null ? void 0 : p.color) || "#111111",
-        fontWeight: (p == null ? void 0 : p.fontWeight) || "normal",
-        fontFamily: (p == null ? void 0 : p.fontFamily) ? `'${p.fontFamily}', Arial, sans-serif` : "Arial, sans-serif",
-        fontStyle: (p == null ? void 0 : p.fontStyle) || "normal",
-        textTransform: (p == null ? void 0 : p.textTransform) || "none",
-        textDecoration: (p == null ? void 0 : p.textDecoration) || "none",
-        whiteSpace: isStacked ? "normal" : "nowrap",
-        cursor: "default"
-      };
-    }
-    function socialsContainerStyle(p) {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      return {
-        margin: `${((_a = p == null ? void 0 : p.margin) == null ? void 0 : _a.top) ?? 0}px ${((_b = p == null ? void 0 : p.margin) == null ? void 0 : _b.right) ?? 0}px ${((_c = p == null ? void 0 : p.margin) == null ? void 0 : _c.bottom) ?? 0}px ${((_d = p == null ? void 0 : p.margin) == null ? void 0 : _d.left) ?? 0}px`,
-        padding: `${((_e = p == null ? void 0 : p.padding) == null ? void 0 : _e.top) ?? 0}px ${((_f = p == null ? void 0 : p.padding) == null ? void 0 : _f.right) ?? 0}px ${((_g = p == null ? void 0 : p.padding) == null ? void 0 : _g.bottom) ?? 0}px ${((_h = p == null ? void 0 : p.padding) == null ? void 0 : _h.left) ?? 0}px`,
-        textAlign: (p == null ? void 0 : p.align) || "left",
-        display: "flex",
-        flexWrap: "wrap",
-        gap: ((p == null ? void 0 : p.spacing) ?? 8) + "px",
-        justifyContent: (p == null ? void 0 : p.align) === "center" ? "center" : (p == null ? void 0 : p.align) === "right" ? "flex-end" : "flex-start"
-      };
-    }
-    return (_ctx, _cache) => {
-      var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t;
-      return compType.value === "heading" ? (openBlock(), createBlock(resolveDynamicComponent(((_a = __props.comp.props) == null ? void 0 : _a.level) || "h2"), {
-        key: 0,
-        style: normalizeStyle(headingStyle(__props.comp.props)),
-        class: "truncate",
-        innerHTML: resolvePreviewHtml((_b = __props.comp.props) == null ? void 0 : _b.content) || "Heading"
-      }, null, 8, ["style", "innerHTML"])) : compType.value === "paragraph" ? (openBlock(), createElementBlock("p", {
-        key: 1,
-        style: normalizeStyle([paragraphStyle(__props.comp.props), { "display": "-webkit-box", "-webkit-line-clamp": "2", "-webkit-box-orient": "vertical" }]),
-        class: "overflow-hidden",
-        innerHTML: resolvePreviewHtml((_c = __props.comp.props) == null ? void 0 : _c.content) || "Text"
-      }, null, 12, _hoisted_1)) : compType.value === "image" ? (openBlock(), createElementBlock("div", {
-        key: 2,
-        style: normalizeStyle(imageContainerStyle(__props.comp.props))
-      }, [
-        createBaseVNode("img", {
-          src: (_d = __props.comp.props) == null ? void 0 : _d.src,
-          alt: ((_e = __props.comp.props) == null ? void 0 : _e.alt) || "",
-          style: normalizeStyle(imageStyle(__props.comp.props))
-        }, null, 12, _hoisted_2)
-      ], 4)) : compType.value === "video" ? (openBlock(), createElementBlock("div", {
-        key: 3,
-        style: normalizeStyle(videoContainerStyle(__props.comp.props))
-      }, [
-        createBaseVNode("div", {
-          style: normalizeStyle(videoThumbnailStyle(__props.comp.props))
-        }, [
-          ((_f = __props.comp.props) == null ? void 0 : _f.coverImage) ? (openBlock(), createElementBlock("img", {
-            key: 0,
-            src: __props.comp.props.coverImage,
-            alt: ((_g = __props.comp.props) == null ? void 0 : _g.alt) || "Video",
-            style: normalizeStyle(videoImageStyle())
-          }, null, 12, _hoisted_3)) : (openBlock(), createElementBlock("div", {
-            key: 1,
-            style: normalizeStyle(videoPlaceholderStyle())
-          }, [
-            (openBlock(), createElementBlock("svg", _hoisted_4, [..._cache[0] || (_cache[0] = [
-              createBaseVNode("path", {
-                "fill-rule": "evenodd",
-                d: "M10 18a8 8 0 100-16 8 8 0 000 16zM9.555 7.168A1 1 0 008 8v4a1 1 0 001.555.832l3-2a1 1 0 000-1.664l-3-2z",
-                "clip-rule": "evenodd"
-              }, null, -1)
-            ])]))
-          ], 4))
-        ], 4)
-      ], 4)) : compType.value === "button" ? (openBlock(), createElementBlock("div", {
-        key: 4,
-        style: normalizeStyle(buttonContainerStyle(__props.comp.props))
-      }, [
-        createBaseVNode("span", {
-          style: normalizeStyle(buttonStyle(__props.comp.props)),
-          class: "inline-block truncate"
-        }, [
-          ((_h = __props.comp.props) == null ? void 0 : _h.icon) && ((_i = __props.comp.props) == null ? void 0 : _i.iconPosition) !== "after" ? (openBlock(), createElementBlock("img", {
-            key: 0,
-            src: __props.comp.props.icon,
-            alt: ((_j = __props.comp.props) == null ? void 0 : _j.iconAlt) || "",
-            style: normalizeStyle(buttonIconStyle(__props.comp.props)),
-            onError: onIconError
-          }, null, 44, _hoisted_5)) : createCommentVNode("", true),
-          createTextVNode(" " + toDisplayString(((_k = __props.comp.props) == null ? void 0 : _k.text) || "Button") + " ", 1),
-          ((_l = __props.comp.props) == null ? void 0 : _l.icon) && ((_m = __props.comp.props) == null ? void 0 : _m.iconPosition) === "after" ? (openBlock(), createElementBlock("img", {
-            key: 1,
-            src: __props.comp.props.icon,
-            alt: ((_n = __props.comp.props) == null ? void 0 : _n.iconAlt) || "",
-            style: normalizeStyle(buttonIconStyle(__props.comp.props)),
-            onError: onIconError
-          }, null, 44, _hoisted_6)) : createCommentVNode("", true)
-        ], 4)
-      ], 4)) : compType.value === "anchor" ? (openBlock(), createElementBlock("div", {
-        key: 5,
-        style: normalizeStyle(anchorContainerStyle(__props.comp.props))
-      }, [
-        createBaseVNode("span", {
-          style: normalizeStyle(anchorStyle(__props.comp.props)),
-          class: "truncate block"
-        }, toDisplayString(((_o = __props.comp.props) == null ? void 0 : _o.text) || "Link"), 5)
-      ], 4)) : compType.value === "list" ? (openBlock(), createElementBlock("div", {
-        key: 6,
-        style: normalizeStyle(listWrapStyle(__props.comp.props)),
-        innerHTML: resolvePreviewHtml((_p = __props.comp.props) == null ? void 0 : _p.content) || "<ul><li>Item</li></ul>"
-      }, null, 12, _hoisted_7)) : compType.value === "divider" ? (openBlock(), createElementBlock("div", {
-        key: 7,
-        style: normalizeStyle(dividerContainerStyle(__props.comp.props))
-      }, [
-        createBaseVNode("hr", {
-          style: normalizeStyle(dividerStyle(__props.comp.props))
-        }, null, 4)
-      ], 4)) : compType.value === "spacer" ? (openBlock(), createElementBlock("div", _hoisted_8, [
-        createBaseVNode("div", {
-          style: normalizeStyle(spacerStyle(__props.comp.props))
-        }, null, 4)
-      ])) : compType.value === "menu" ? (openBlock(), createElementBlock("div", {
-        key: 9,
-        style: normalizeStyle(menuContainerStyle(__props.comp.props))
-      }, [
-        !((_r = (_q = __props.comp.props) == null ? void 0 : _q.items) == null ? void 0 : _r.some((i) => i.enabled && i.label)) ? (openBlock(), createElementBlock("div", _hoisted_9, " Menu ")) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(__props.comp.props.items.filter(
-          (i) => i.enabled && i.label
-        ), (item, idx) => {
-          return openBlock(), createElementBlock("span", {
-            key: item._id || idx,
-            style: normalizeStyle(
-              menuItemStyle(
-                __props.comp.props,
-                Number(idx),
-                __props.comp.props.items.filter((i) => i.enabled && i.label).length
-              )
-            )
-          }, toDisplayString(item.label), 5);
-        }), 128))
-      ], 4)) : compType.value === "socials" ? (openBlock(), createElementBlock("div", {
-        key: 10,
-        style: normalizeStyle(socialsContainerStyle(__props.comp.props))
-      }, [
-        ((_t = (_s = __props.comp.props) == null ? void 0 : _s.platforms) == null ? void 0 : _t.some((p) => p.enabled && p.link)) ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(__props.comp.props.platforms.filter(
-          (p) => p.enabled && p.link
-        ), (platform) => {
-          var _a2, _b2;
-          return openBlock(), createElementBlock("span", {
-            key: platform.name,
-            style: {
-              display: "inline-flex",
-              alignItems: "center",
-              justifyContent: "center"
-            }
-          }, [
-            createBaseVNode("img", {
-              src: platform.icon,
-              alt: platform.name,
-              style: normalizeStyle({
-                width: (((_a2 = __props.comp.props) == null ? void 0 : _a2.iconSize) || 24) + "px",
-                height: (((_b2 = __props.comp.props) == null ? void 0 : _b2.iconSize) || 24) + "px",
-                display: "block"
-              })
-            }, null, 12, _hoisted_10)
-          ]);
-        }), 128)) : (openBlock(), createElementBlock("span", _hoisted_11, "Socials"))
-      ], 4)) : (openBlock(), createElementBlock("div", _hoisted_12, toDisplayString(compType.value), 1));
-    };
-  }
-});
-export {
-  _sfc_main as default
-};