@maildeno/editor 0.4.5 → 0.4.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@maildeno/editor",
-  "version": "0.4.5",
+  "version": "0.4.6",
   "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",
@@ -28,7 +28,7 @@
   "scripts": {
     "dev": "vite build --watch",
     "dev:element": "vite build --config vite.config.element.ts --watch",
-    "build": "vite build && vite build --config vite.config.element.ts",
+    "build": "vite build && vite build --config vite.config.element.ts && node scripts/prune-types.mjs",
     "typecheck": "vue-tsc -p tsconfig.json --noEmit && tsc -p tsconfig.node.json --noEmit",
     "prepublishOnly": "npm run typecheck && npm run build",
     "format": "prettier --write \"src/**/*.{ts,vue}\"",

package/dist/RowPreviewLegacyComponent-3QuwvWmT.js

@@ -1,402 +0,0 @@
-import { Fragment as b, computed as G, createBlock as V, createCommentVNode as v, createElementBlock as a, createElementVNode as c, createTextVNode as q, defineComponent as J, normalizeStyle as r, openBlock as o, renderList as S, resolveDynamicComponent as O, toDisplayString as x } from "vue";
-var K = ["innerHTML"], Q = ["src", "alt"], U = ["src", "alt"], X = {
-  style: {
-    width: "30%",
-    height: "30%",
-    color: "#9ca3af"
-  },
-  fill: "currentColor",
-  viewBox: "0 0 20 20"
-}, Y = ["src", "alt"], Z = ["src", "alt"], _ = ["innerHTML"], tt = { key: 8 }, et = { key: 0 }, nt = ["src", "alt"], it = {
-  key: 1,
-  style: {
-    "font-size": "7px",
-    color: "#9ca3af",
-    "font-style": "italic"
-  }
-}, ot = {
-  key: 11,
-  class: "rounded truncate",
-  style: {
-    "font-size": "7px",
-    color: "#9ca3af",
-    background: "#f3f4f6",
-    padding: "1px 3px"
-  }
-}, at = /* @__PURE__ */ J({
-  __name: "RowPreviewLegacyComponent",
-  props: {
-    comp: {},
-    scale: {}
-  },
-  setup(e) {
-    const y = e, l = G(() => y.comp.componentType ?? y.comp.type);
-    function u(t) {
-      return t ? t.replace(/<span[^>]*\bdata-merge="([^"]+)"(?:[^>]*\bdata-merge-default="([^"]*)")?[^>]*>.*?<\/span>/gs, (n, i, g) => {
-        const d = i.trim(), f = g?.trim();
-        return f ? `{{ ${d}|'${f}' }}` : `{{ ${d} }}`;
-      }) : "";
-    }
-    function m(t) {
-      const n = t?.backgroundGradient;
-      if (n?.useGradient === !0 && Array.isArray(n?.gradient?.colors) && n.gradient.colors.length >= 2) {
-        const { type: i, direction: g, colors: d } = n.gradient, f = d.map((p) => `${p.color} ${p.position}%`).join(", ");
-        return i === "radial" ? `radial-gradient(circle at center, ${f})` : `linear-gradient(${g}, ${f})`;
-      }
-      return t?.backgroundColor || "transparent";
-    }
-    function s(t) {
-      if (t && (t.includes(" ") || [
-        "Roboto",
-        "Open Sans",
-        "Lato",
-        "Montserrat",
-        "Poppins",
-        "Nunito",
-        "Raleway",
-        "Plus Jakarta Sans"
-      ].some((n) => t.includes(n))) && typeof document < "u") {
-        const n = `https://fonts.googleapis.com/css2?family=${t.replace(/ /g, "+")}:wght@300;400;500;600;700;800&display=swap`;
-        if (!document.querySelector(`link[href="${n}"]`)) {
-          const i = document.createElement("link");
-          i.href = n, i.rel = "stylesheet", document.head.appendChild(i);
-        }
-      }
-    }
-    function k(t) {
-      return t?.fontFamily && s(t.fontFamily), {
-        fontSize: Math.max(7, t?.fontSize || 24) + "px",
-        color: t?.color || "#111111",
-        fontWeight: t?.fontWeight || "bold",
-        fontFamily: t?.fontFamily || "Arial, sans-serif",
-        textAlign: t?.align || "left",
-        lineHeight: String(t?.lineHeight ?? 1.2),
-        letterSpacing: `${t?.letterSpacing ?? 0}px`,
-        textTransform: t?.textTransform || "none",
-        textDecoration: t?.textDecoration || "none",
-        background: m(t),
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 4}px ${t?.margin?.left ?? 0}px`,
-        padding: `${t?.padding?.top ?? 0}px ${t?.padding?.right ?? 0}px ${t?.padding?.bottom ?? 0}px ${t?.padding?.left ?? 0}px`
-      };
-    }
-    function w(t) {
-      return t?.fontFamily && s(t.fontFamily), {
-        fontSize: Math.max(6, t?.fontSize || 16) + "px",
-        color: t?.color || "#111111",
-        fontFamily: t?.fontFamily || "Arial, sans-serif",
-        fontWeight: t?.fontWeight || "normal",
-        fontStyle: t?.fontStyle || "normal",
-        textAlign: t?.align || "left",
-        lineHeight: String(t?.lineHeight ?? 1.5),
-        letterSpacing: `${t?.letterSpacing ?? 0}px`,
-        textTransform: t?.textTransform || "none",
-        textDecoration: t?.textDecoration || "none",
-        background: m(t),
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 4}px ${t?.margin?.left ?? 0}px`,
-        padding: `${t?.padding?.top ?? 0}px ${t?.padding?.right ?? 0}px ${t?.padding?.bottom ?? 0}px ${t?.padding?.left ?? 0}px`
-      };
-    }
-    function F(t) {
-      return {
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 0}px ${t?.margin?.left ?? 0}px`,
-        padding: `${t?.padding?.top ?? 0}px ${t?.padding?.right ?? 0}px ${t?.padding?.bottom ?? 0}px ${t?.padding?.left ?? 0}px`,
-        textAlign: t?.align || "left"
-      };
-    }
-    function z(t) {
-      const n = t?.align || "left";
-      return {
-        width: (t?.width || 100) + "%",
-        height: t?.height || "auto",
-        borderRadius: (t?.borderRadius || 0) + "px",
-        border: `${t?.border?.width || 0}px ${t?.border?.style || "solid"} ${t?.border?.color || "#000000"}`,
-        display: "block",
-        margin: n === "center" ? "0 auto" : n === "right" ? "0 0 0 auto" : "0"
-      };
-    }
-    function A(t) {
-      return {
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 0}px ${t?.margin?.left ?? 0}px`,
-        padding: `${t?.padding?.top ?? 0}px ${t?.padding?.right ?? 0}px ${t?.padding?.bottom ?? 0}px ${t?.padding?.left ?? 0}px`,
-        textAlign: t?.align || "left",
-        maxWidth: "100%"
-      };
-    }
-    function C(t) {
-      const n = t?.align || "left";
-      return {
-        width: "100%",
-        maxWidth: "100%",
-        paddingBottom: "56.25%",
-        height: "0",
-        position: "relative",
-        display: "inline-block",
-        borderRadius: (t?.borderRadius || 0) + "px",
-        border: `${t?.border?.width || 0}px ${t?.border?.style || "solid"} ${t?.border?.color || "#000000"}`,
-        overflow: "hidden",
-        marginLeft: n === "center" || n === "right" ? "auto" : "0",
-        marginRight: n === "center" ? "auto" : "0",
-        boxSizing: "border-box"
-      };
-    }
-    function H() {
-      return {
-        position: "absolute",
-        top: "0",
-        left: "0",
-        width: "100%",
-        height: "100%",
-        objectFit: "cover",
-        display: "block"
-      };
-    }
-    function M() {
-      return {
-        position: "absolute",
-        top: "0",
-        left: "0",
-        width: "100%",
-        height: "100%",
-        background: "#e5e7eb",
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center"
-      };
-    }
-    function T(t) {
-      return {
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 4}px ${t?.margin?.left ?? 0}px`,
-        textAlign: t?.align || "center"
-      };
-    }
-    function L(t) {
-      t?.fontFamily && s(t.fontFamily);
-      const n = !!t?.icon;
-      return {
-        background: m(t),
-        color: t?.color || "#ffffff",
-        fontSize: Math.max(5, t?.fontSize || 16) + "px",
-        fontWeight: t?.fontWeight || "500",
-        fontFamily: t?.fontFamily || "Arial, sans-serif",
-        letterSpacing: `${t?.letterSpacing ?? 0}px`,
-        padding: `${t?.padding?.top ?? 8}px ${t?.padding?.right ?? 16}px ${t?.padding?.bottom ?? 8}px ${t?.padding?.left ?? 16}px`,
-        borderRadius: (t?.borderRadius || 4) + "px",
-        border: `${t?.border?.width || 0}px ${t?.border?.style || "solid"} ${t?.border?.color || "#000000"}`,
-        ...n ? {
-          display: "inline-flex",
-          alignItems: "center",
-          verticalAlign: "middle"
-        } : { display: "inline-block" },
-        lineHeight: "1.2",
-        textDecoration: "none"
-      };
-    }
-    function h(t) {
-      const n = Math.max(4, t?.iconSize ?? 20), i = t?.iconGap ?? 8, g = t?.iconPosition !== "after";
-      return {
-        display: "block",
-        width: n + "px",
-        height: n + "px",
-        flexShrink: "0",
-        marginRight: g ? i + "px" : "0",
-        marginLeft: g ? "0" : i + "px"
-      };
-    }
-    function $(t) {
-      const n = t.target;
-      n.style.display = "none";
-    }
-    function R(t) {
-      return {
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 4}px ${t?.margin?.left ?? 0}px`,
-        padding: `${t?.padding?.top ?? 0}px ${t?.padding?.right ?? 0}px ${t?.padding?.bottom ?? 0}px ${t?.padding?.left ?? 0}px`,
-        textAlign: t?.align || "left"
-      };
-    }
-    function W(t) {
-      return t?.fontFamily && s(t.fontFamily), {
-        color: t?.color || "#007bff",
-        fontSize: Math.max(6, t?.fontSize || 16) + "px",
-        fontWeight: t?.fontWeight || "normal",
-        fontFamily: t?.fontFamily || "Arial, sans-serif",
-        letterSpacing: `${t?.letterSpacing ?? 0}px`,
-        textDecoration: t?.textDecoration || "underline"
-      };
-    }
-    function D(t) {
-      return t?.fontFamily && s(t.fontFamily), {
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 0}px ${t?.margin?.left ?? 0}px`,
-        padding: `${t?.padding?.top ?? 0}px ${t?.padding?.right ?? 0}px ${t?.padding?.bottom ?? 0}px ${t?.padding?.left ?? 16}px`,
-        fontSize: Math.max(6, t?.fontSize || 16) + "px",
-        fontFamily: t?.fontFamily || "Arial, sans-serif",
-        lineHeight: String(t?.lineHeight ?? 1.5),
-        letterSpacing: `${t?.letterSpacing ?? 0}px`,
-        color: t?.color || "#111111",
-        background: m(t)
-      };
-    }
-    function I(t) {
-      return {
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 0}px ${t?.margin?.left ?? 0}px`,
-        padding: `${t?.padding?.top ?? 0}px ${t?.padding?.right ?? 0}px ${t?.padding?.bottom ?? 0}px ${t?.padding?.left ?? 0}px`,
-        textAlign: t?.align || "left"
-      };
-    }
-    function P(t) {
-      const n = t?.align || "left";
-      return {
-        width: (t?.width || 100) + "%",
-        height: (t?.height || 1) + "px",
-        background: m(t),
-        border: "none",
-        margin: n === "center" ? "0 auto" : n === "right" ? "0 0 0 auto" : "0"
-      };
-    }
-    function B(t) {
-      return {
-        width: "100%",
-        height: (t?.height || 16) + "px",
-        background: m(t)
-      };
-    }
-    function E(t) {
-      return t?.fontFamily && s(t.fontFamily), {
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 0}px ${t?.margin?.left ?? 0}px`,
-        padding: `${t?.padding?.top ?? 0}px ${t?.padding?.right ?? 0}px ${t?.padding?.bottom ?? 0}px ${t?.padding?.left ?? 0}px`,
-        textAlign: t?.align || "left",
-        lineHeight: "0",
-        background: m(t)
-      };
-    }
-    function j(t, n, i) {
-      t?.fontFamily && s(t.fontFamily);
-      const g = t?.mobileStack === !0, d = t?.spacing ?? 8, f = n === 0, p = n === i - 1;
-      return {
-        display: "inline-block",
-        marginLeft: f ? "0px" : `${d / 2}px`,
-        marginRight: p ? "0px" : `${d / 2}px`,
-        fontSize: Math.max(6, t?.fontSize ?? 14) + "px",
-        lineHeight: String(t?.lineHeight ?? 1.4),
-        letterSpacing: (t?.letterSpacing ?? 0) + "px",
-        color: t?.color || "#111111",
-        fontWeight: t?.fontWeight || "normal",
-        fontFamily: t?.fontFamily ? `'${t.fontFamily}', Arial, sans-serif` : "Arial, sans-serif",
-        fontStyle: t?.fontStyle || "normal",
-        textTransform: t?.textTransform || "none",
-        textDecoration: t?.textDecoration || "none",
-        whiteSpace: g ? "normal" : "nowrap",
-        cursor: "default"
-      };
-    }
-    function N(t) {
-      return {
-        margin: `${t?.margin?.top ?? 0}px ${t?.margin?.right ?? 0}px ${t?.margin?.bottom ?? 0}px ${t?.margin?.left ?? 0}px`,
-        padding: `${t?.padding?.top ?? 0}px ${t?.padding?.right ?? 0}px ${t?.padding?.bottom ?? 0}px ${t?.padding?.left ?? 0}px`,
-        textAlign: t?.align || "left",
-        display: "flex",
-        flexWrap: "wrap",
-        gap: (t?.spacing ?? 8) + "px",
-        justifyContent: t?.align === "center" ? "center" : t?.align === "right" ? "flex-end" : "flex-start"
-      };
-    }
-    return (t, n) => l.value === "heading" ? (o(), V(O(e.comp.props?.level || "h2"), {
-      key: 0,
-      style: r(k(e.comp.props)),
-      class: "truncate",
-      innerHTML: u(e.comp.props?.content) || "Heading"
-    }, null, 8, ["style", "innerHTML"])) : l.value === "paragraph" ? (o(), a("p", {
-      key: 1,
-      style: r([w(e.comp.props), {
-        display: "-webkit-box",
-        "-webkit-line-clamp": "2",
-        "-webkit-box-orient": "vertical"
-      }]),
-      class: "overflow-hidden",
-      innerHTML: u(e.comp.props?.content) || "Text"
-    }, null, 12, K)) : l.value === "image" ? (o(), a("div", {
-      key: 2,
-      style: r(F(e.comp.props))
-    }, [c("img", {
-      src: e.comp.props?.src,
-      alt: e.comp.props?.alt || "",
-      style: r(z(e.comp.props))
-    }, null, 12, Q)], 4)) : l.value === "video" ? (o(), a("div", {
-      key: 3,
-      style: r(A(e.comp.props))
-    }, [c("div", { style: r(C(e.comp.props)) }, [e.comp.props?.coverImage ? (o(), a("img", {
-      key: 0,
-      src: e.comp.props.coverImage,
-      alt: e.comp.props?.alt || "Video",
-      style: r(H())
-    }, null, 12, U)) : (o(), a("div", {
-      key: 1,
-      style: r(M())
-    }, [(o(), a("svg", X, [...n[0] || (n[0] = [c("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)) : l.value === "button" ? (o(), a("div", {
-      key: 4,
-      style: r(T(e.comp.props))
-    }, [c("span", {
-      style: r(L(e.comp.props)),
-      class: "inline-block truncate"
-    }, [
-      e.comp.props?.icon && e.comp.props?.iconPosition !== "after" ? (o(), a("img", {
-        key: 0,
-        src: e.comp.props.icon,
-        alt: e.comp.props?.iconAlt || "",
-        style: r(h(e.comp.props)),
-        onError: $
-      }, null, 44, Y)) : v("", !0),
-      q(" " + x(e.comp.props?.text || "Button") + " ", 1),
-      e.comp.props?.icon && e.comp.props?.iconPosition === "after" ? (o(), a("img", {
-        key: 1,
-        src: e.comp.props.icon,
-        alt: e.comp.props?.iconAlt || "",
-        style: r(h(e.comp.props)),
-        onError: $
-      }, null, 44, Z)) : v("", !0)
-    ], 4)], 4)) : l.value === "anchor" ? (o(), a("div", {
-      key: 5,
-      style: r(R(e.comp.props))
-    }, [c("span", {
-      style: r(W(e.comp.props)),
-      class: "truncate block"
-    }, x(e.comp.props?.text || "Link"), 5)], 4)) : l.value === "list" ? (o(), a("div", {
-      key: 6,
-      style: r(D(e.comp.props)),
-      innerHTML: u(e.comp.props?.content) || "<ul><li>Item</li></ul>"
-    }, null, 12, _)) : l.value === "divider" ? (o(), a("div", {
-      key: 7,
-      style: r(I(e.comp.props))
-    }, [c("hr", { style: r(P(e.comp.props)) }, null, 4)], 4)) : l.value === "spacer" ? (o(), a("div", tt, [c("div", { style: r(B(e.comp.props)) }, null, 4)])) : l.value === "menu" ? (o(), a("div", {
-      key: 9,
-      style: r(E(e.comp.props))
-    }, [e.comp.props?.items?.some((i) => i.enabled && i.label) ? (o(!0), a(b, { key: 1 }, S(e.comp.props.items.filter((i) => i.enabled && i.label), (i, g) => (o(), a("span", {
-      key: i._id || g,
-      style: r(j(e.comp.props, Number(g), e.comp.props.items.filter((d) => d.enabled && d.label).length))
-    }, x(i.label), 5))), 128)) : (o(), a("div", et, " Menu "))], 4)) : l.value === "socials" ? (o(), a("div", {
-      key: 10,
-      style: r(N(e.comp.props))
-    }, [e.comp.props?.platforms?.some((i) => i.enabled && i.link) ? (o(!0), a(b, { key: 0 }, S(e.comp.props.platforms.filter((i) => i.enabled && i.link), (i) => (o(), a("span", {
-      key: i.name,
-      style: {
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center"
-      }
-    }, [c("img", {
-      src: i.icon,
-      alt: i.name,
-      style: r({
-        width: (e.comp.props?.iconSize || 24) + "px",
-        height: (e.comp.props?.iconSize || 24) + "px",
-        display: "block"
-      })
-    }, null, 12, nt)]))), 128)) : (o(), a("span", it, "Socials"))], 4)) : (o(), a("div", ot, x(l.value), 1));
-  }
-}), lt = at;
-export {
-  lt as default
-};