mail-editor-pancake 0.0.9 → 0.1.0

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "mail-editor-pancake",
-  "version": "0.0.9",
+  "version": "0.1.0",
   "private": false,
-  "description": "面向运营的轻量邮件可视化编辑器（monorepo 根）",
+  "description": "面向运营的轻量邮件可视化编辑器",
   "devDependencies": {
     "@biomejs/biome": "^1.9.4",
     "@types/node": "^25.6.0",

package/packages/blocks/dist/index.js

@@ -1,4 +1,4 @@
-import { defineBlock as h, blockButtonWidthCss as F, docContentWidthCss as L, mjRawEmailTableWrap as V, mjRawCellTypographyFromStyles as U, normalizeFontWeightStep as f, FONT_WEIGHT_STEP_OPTIONS as M } from "@simple-mail/core";
+import { defineBlock as h, blockButtonWidthCss as F, docContentWidthCss as L, htmlContainsMjmlTags as U, mjRawEmailTableWrap as J, mjRawCellTypographyFromStyles as G, normalizeFontWeightStep as y, FONT_WEIGHT_STEP_OPTIONS as j, isRichHtmlEffectivelyEmpty as q } from "@simple-mail/core";
 const m = {
   html: '<svg width="24" height="24" viewBox="0 0 24 24" fill="none"><rect x="3.5" y="4" width="17" height="16" rx="2" stroke="currentColor" stroke-width="1.5" fill="none"/><path d="M8 8.5l3 3.5-3 3.5M16 8.5l-3 3.5 3 3.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg>',
   text: '<svg width="24" height="24" viewBox="0 0 24 24"><path d="M5 6h14M5 10h14M5 14h10M5 18h8" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" fill="none"/></svg>',
@@ -11,7 +11,7 @@ const m = {
   social: '<svg width="24" height="24" viewBox="0 0 24 24"><circle cx="6" cy="12" r="2.5" stroke="currentColor" stroke-width="1.4" fill="none"/><circle cx="12" cy="12" r="2.5" stroke="currentColor" stroke-width="1.4" fill="none"/><circle cx="18" cy="12" r="2.5" stroke="currentColor" stroke-width="1.4" fill="none"/></svg>',
   footer: '<svg width="24" height="24" viewBox="0 0 24 24"><rect x="3.5" y="5" width="17" height="10" rx="1.5" stroke="currentColor" stroke-width="1.4" fill="none"/><path d="M5 18h14" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg>',
   socialGroup: '<svg width="24" height="24" viewBox="0 0 24 24" fill="none"><rect x="3" y="5" width="18" height="14" rx="2" stroke="currentColor" stroke-width="1.5"/><circle cx="8" cy="12" r="2" stroke="currentColor" stroke-width="1.4"/><circle cx="12" cy="12" r="2" stroke="currentColor" stroke-width="1.4"/><circle cx="16" cy="12" r="2" stroke="currentColor" stroke-width="1.4"/></svg>'
-}, x = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), G = h({
+}, f = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), K = h({
   type: "button",
   name: "按钮",
   category: "content",
@@ -69,22 +69,22 @@ const m = {
     placeholder: "按钮文字"
   },
   toMjml: (e) => {
-    const t = `${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`, o = `${e.innerPaddingV}px ${e.innerPaddingH}px`, n = F(e.width), i = n ? ` width="${x(n)}"` : "";
-    return `<mj-button href="${x(e.href)}" background-color="${x(
+    const t = `${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`, o = `${e.innerPaddingV}px ${e.innerPaddingH}px`, n = F(e.width), i = n ? ` width="${f(n)}"` : "";
+    return `<mj-button href="${f(e.href)}" background-color="${f(
       e.backgroundColor
-    )}" color="${x(e.color)}" border-radius="${e.borderRadius}px" font-size="${x(
+    )}" color="${f(e.color)}" border-radius="${e.borderRadius}px" font-size="${f(
       e.fontSize
-    )}" align="${e.align}" padding="${t}" inner-padding="${o}"${i}>${x(
+    )}" align="${e.align}" padding="${t}" inner-padding="${o}"${i}>${f(
       e.text
     )}</mj-button>`;
   },
   renderPreview: (e) => {
     const t = F(e.width), o = t ? `width:${t};max-width:100%;box-sizing:border-box;` : "";
     return `<div style="padding:${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px;text-align:${e.align};">
-      <a href="${x(e.href)}" style="display:inline-block;background:${e.backgroundColor};border-radius:${e.borderRadius}px;padding:${e.innerPaddingV}px ${e.innerPaddingH}px;text-decoration:none;font-size:${e.fontSize};line-height:1.2;${o}"><span class="sm-button-text" style="color:${e.color}">${x(e.text)}</span></a>
+      <a href="${f(e.href)}" style="display:inline-block;background:${e.backgroundColor};border-radius:${e.borderRadius}px;padding:${e.innerPaddingV}px ${e.innerPaddingH}px;text-decoration:none;font-size:${e.fontSize};line-height:1.2;${o}"><span class="sm-button-text" style="color:${e.color}">${f(e.text)}</span></a>
     </div>`;
   }
-}), P = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), q = h({
+}), A = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), D = h({
   type: "divider",
   name: "分隔线",
   category: "content",
@@ -103,11 +103,11 @@ const m = {
     { key: "paddingTop", label: "上边距", type: "number", min: 0, max: 80 },
     { key: "paddingBottom", label: "下边距", type: "number", min: 0, max: 80 }
   ],
-  toMjml: (e) => `<mj-divider border-color="${P(e.color)}" border-width="${e.thickness}px" width="${P(
+  toMjml: (e) => `<mj-divider border-color="${A(e.color)}" border-width="${e.thickness}px" width="${A(
     e.width
   )}" padding="${e.paddingTop}px 0px ${e.paddingBottom}px 0px" />`,
   renderPreview: (e) => `<div style="padding:${e.paddingTop}px 0 ${e.paddingBottom}px 0;"><div style="border-top:${e.thickness}px solid ${e.color};width:${e.width};margin:0 auto;"></div></div>`
-}), b = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), J = h({
+}), b = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), X = h({
   type: "custom:footer",
   name: "页脚",
   category: "custom",
@@ -136,7 +136,7 @@ const m = {
       ${b(e.address)}<br/>
       <a href="${b(e.unsubscribeHref)}" style="color:${e.textColor};">${b(e.unsubscribeText)}</a>
     </div>`
-}), k = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), K = h({
+}), k = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), Y = h({
   type: "hero",
   name: "Hero 大图",
   category: "content",
@@ -216,7 +216,7 @@ const m = {
     </mj-hero>`;
   },
   renderPreview: (e, t) => {
-    const o = L(t.doc.meta.width), n = e.verticalAlign === "top" ? "flex-start" : e.verticalAlign === "bottom" ? "flex-end" : "center", i = `${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`, a = k(e.backgroundUrl);
+    const o = L(t.doc.meta.width), n = e.verticalAlign === "top" ? "flex-start" : e.verticalAlign === "bottom" ? "flex-end" : "center", i = `${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`, c = k(e.backgroundUrl);
     return `<div
       style="
         box-sizing:border-box;
@@ -224,7 +224,7 @@ const m = {
         max-width:${o};
         min-height:${e.height}px;
         margin:0 auto;
-        background-image:linear-gradient(to bottom,rgba(0,0,0,0.25),rgba(0,0,0,0.35)),url(${a});
+        background-image:linear-gradient(to bottom,rgba(0,0,0,0.25),rgba(0,0,0,0.35)),url(${c});
         background-size:cover;
         background-position:center;
         background-color:${e.backgroundColor};
@@ -248,7 +248,7 @@ const m = {
       >${e.content}</div>
     </div>`;
   }
-}), D = h({
+}), Z = h({
   type: "html",
   name: "HTML",
   category: "content",
@@ -265,7 +265,7 @@ const m = {
       key: "html",
       label: "HTML",
       type: "textarea",
-      help: "插入 MJML 的 mj-raw。邮件客户端常会过滤脚本与不支持的标签。"
+      help: "只写 HTML（如 <a>、<table>），不要写 <mj-text> 等 MJML 标签；MJML 标签在 mj-raw 内不会被编译。简单链接建议用「文本」块。"
     },
     { key: "paddingTop", label: "内边距", type: "spacing" }
   ],
@@ -278,10 +278,13 @@ const m = {
   },
   toMjml: (e, t) => {
     const o = `${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`;
-    return V(o, e.html, U(t.doc.styles));
+    return J(o, e.html, G(t.doc.styles));
   },
-  renderPreview: (e) => `<div class="sm-html-content" style="padding:${`${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`};min-height:1em;">${e.html}</div>`
-}), w = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), X = h({
+  renderPreview: (e) => {
+    const t = `${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`, o = U(e.html) ? '<div class="sm-html-mjml-warn">检测到 MJML 标签，此处应只写 HTML，预览可能显示异常。</div>' : "";
+    return `<div class="sm-html-content" style="padding:${t};min-height:1em;">${o}${e.html}</div>`;
+  }
+}), w = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), Q = h({
   type: "image",
   name: "图片",
   category: "content",
@@ -334,7 +337,7 @@ const m = {
       e.src
     )}" alt="${w(e.alt)}" style="display:block;${t}max-width:100%;${n}border:0;outline:none;" /></div>`;
   }
-}), B = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), Y = h({
+}), M = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), ee = h({
   type: "custom:logo",
   name: "公司 Logo",
   category: "custom",
@@ -361,25 +364,25 @@ const m = {
       ]
     }
   ],
-  toMjml: (e) => `<mj-image src="${B(e.src)}" href="${B(e.href)}" width="${e.width}px" align="${e.align}" alt="logo" padding="8px 0px 8px 0px" />`,
+  toMjml: (e) => `<mj-image src="${M(e.src)}" href="${M(e.href)}" width="${e.width}px" align="${e.align}" alt="logo" padding="8px 0px 8px 0px" />`,
   renderPreview: (e) => {
     const t = e.align === "center" ? "margin:0 auto;" : e.align === "right" ? "margin-left:auto;" : "";
-    return `<div style="padding:8px 0;text-align:${e.align};"><img src="${B(
+    return `<div style="padding:8px 0;text-align:${e.align};"><img src="${M(
       e.src
     )}" alt="logo" style="display:block;${t}width:${e.width}px;max-width:100%;height:auto;" /></div>`;
   }
 });
-function H(e) {
+function E(e) {
   const t = e.trim();
   return t === "ig" ? "instagram" : t === "rabbit" || t === "tiktok" || t === "reddit" ? "web" : t;
 }
-const Z = [
+const te = [
   { label: "X", value: "x" },
   { label: "Rabbit", value: "rabbit" },
   { label: "Facebook", value: "facebook" },
   { label: "TikTok", value: "tiktok" },
   { label: "Instagram", value: "ig" }
-], Q = [
+], oe = [
   { label: "微信", value: "wechat" },
   { label: "微博", value: "weibo" },
   { label: "X", value: "x" },
@@ -390,7 +393,7 @@ const Z = [
   { label: "YouTube", value: "youtube" },
   { label: "Reddit", value: "reddit" },
   { label: "网页", value: "web" }
-], ee = {
+], ne = {
   wechat: { color: "#1AAD19", preview: "信" },
   weibo: { color: "#E6162D", preview: "微" },
   x: { color: "#000000", preview: "X" },
@@ -405,11 +408,11 @@ const Z = [
   rabbit: { color: "#FF2442", preview: "R" },
   website: { color: "#6b7280", preview: "◇" },
   web: { color: "#6b7280", preview: "◇" }
-}, g = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), te = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
-function E(e) {
-  return ee[e] ?? { color: "#6b7280", preview: "·" };
+}, p = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), ie = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+function N(e) {
+  return ne[e] ?? { color: "#6b7280", preview: "·" };
 }
-const oe = "https://www.mailjet.com/images/theme/v1/icons/ico-social/", ne = {
+const le = "https://www.mailjet.com/images/theme/v1/icons/ico-social/", re = {
   facebook: "facebook.png",
   twitter: "twitter.png",
   x: "twitter-x.png",
@@ -428,26 +431,26 @@ const oe = "https://www.mailjet.com/images/theme/v1/icons/ico-social/", ne = {
   soundcloud: "soundcloud.png",
   dribbble: "dribbble.png"
 };
-function ie(e) {
-  const t = ne[H(e)];
-  return t ? `${oe}${t}` : null;
+function ae(e) {
+  const t = re[E(e)];
+  return t ? `${le}${t}` : null;
 }
-function N(e) {
-  const { network: t, iconSize: o, iconBorderRadius: n, iconSrc: i, backgroundColor: a } = e, d = le(o, n), c = E(t), l = (a == null ? void 0 : a.trim()) || c.color, r = (i == null ? void 0 : i.trim()) || ie(t);
-  return r ? `<span style="display:inline-flex;width:${o}px;height:${o}px;border-radius:${d};background:${l};overflow:hidden;align-items:center;justify-content:center;flex-shrink:0;line-height:0;"><img src="${g(r)}" alt="" width="${o}" height="${o}" style="display:block;width:${o}px;height:${o}px;border-radius:${d};" /></span>` : `<span style="display:inline-flex;width:${o}px;height:${o}px;border-radius:${d};background:${l};color:#fff;align-items:center;justify-content:center;font-size:${Math.round(
+function W(e) {
+  const { network: t, iconSize: o, iconBorderRadius: n, iconSrc: i, backgroundColor: c } = e, d = ce(o, n), s = N(t), l = (c == null ? void 0 : c.trim()) || s.color, a = (i == null ? void 0 : i.trim()) || ae(t);
+  return a ? `<span style="display:inline-flex;width:${o}px;height:${o}px;border-radius:${d};background:${l};overflow:hidden;align-items:center;justify-content:center;flex-shrink:0;line-height:0;"><img src="${p(a)}" alt="" width="${o}" height="${o}" style="display:block;width:${o}px;height:${o}px;border-radius:${d};" /></span>` : `<span style="display:inline-flex;width:${o}px;height:${o}px;border-radius:${d};background:${l};color:#fff;align-items:center;justify-content:center;font-size:${Math.round(
     o / 2
-  )}px;font-weight:600;flex-shrink:0;overflow:hidden;">${c.preview}</span>`;
+  )}px;font-weight:600;flex-shrink:0;overflow:hidden;">${s.preview}</span>`;
 }
 function S(e) {
   return `${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`;
 }
-function W(e, t) {
+function I(e, t) {
   const o = Math.max(1, Number(e) || 28), n = Number(t);
   if (!Number.isFinite(n) || n <= 0) return "0px";
   const i = o / 2;
   return n >= 999 || n >= i ? "999px" : `${Math.min(n, o)}px`;
 }
-function le(e, t) {
+function ce(e, t) {
   const o = Math.max(1, Number(e) || 28), n = Number(t);
   if (!Number.isFinite(n) || n <= 0) return "0";
   const i = o / 2;
@@ -457,51 +460,51 @@ function C(e, t = 10) {
   const o = Number(e);
   return !Number.isFinite(o) || o < 0 ? t : Math.min(64, Math.round(o));
 }
-function I(e) {
+function O(e) {
   return e === "right" ? "flex-end" : e === "left" ? "flex-start" : "center";
 }
-function O(e, t) {
-  var c;
-  const o = t.labelFontSize > 0 ? t.labelFontSize : 13, n = Math.max(8, Math.min(48, o)), i = f(t.labelFontWeight), a = ((c = t.labelColor) == null ? void 0 : c.trim()) || "#333333", d = g(i);
+function _(e, t) {
+  var s;
+  const o = t.labelFontSize > 0 ? t.labelFontSize : 13, n = Math.max(8, Math.min(48, o)), i = y(t.labelFontWeight), c = ((s = t.labelColor) == null ? void 0 : s.trim()) || "#333333", d = p(i);
   return e.map((l) => {
-    var j, T, R;
-    const r = E(l.network), s = ((j = l.backgroundColor) == null ? void 0 : j.trim()) || r.color, y = [
-      `name="${g(H(l.network))}"`,
-      `href="${g(l.href)}"`,
-      `background-color="${g(s)}"`,
-      `color="${g(a)}"`,
+    var T, z, R;
+    const a = N(l.network), r = ((T = l.backgroundColor) == null ? void 0 : T.trim()) || a.color, u = [
+      `name="${p(E(l.network))}"`,
+      `href="${p(l.href)}"`,
+      `background-color="${p(r)}"`,
+      `color="${p(c)}"`,
       `font-size="${n}px"`,
       `font-weight="${d}"`
-    ].join(" "), $ = (T = l.iconSrc) == null ? void 0 : T.trim(), u = $ ? `${y} src="${g($)}"` : y, z = ((R = l.label) == null ? void 0 : R.trim()) ?? "";
-    return z ? `  <mj-social-element ${u}>
-    ${te(z)}
-  </mj-social-element>` : `  <mj-social-element ${u} />`;
+    ].join(" "), $ = (z = l.iconSrc) == null ? void 0 : z.trim(), x = $ ? `${u} src="${p($)}"` : u, B = ((R = l.label) == null ? void 0 : R.trim()) ?? "";
+    return B ? `  <mj-social-element ${x}>
+    ${ie(B)}
+  </mj-social-element>` : `  <mj-social-element ${x} />`;
   }).join(`
 `);
 }
-const _ = [
+const V = [
   { network: "x", href: "https://x.com/" },
   { network: "rabbit", href: "https://example.com" },
   { network: "facebook", href: "https://facebook.com/" },
   { network: "tiktok", href: "https://www.tiktok.com/" },
   { network: "ig", href: "https://instagram.com/" }
 ];
-function A(e) {
+function P(e) {
   var o;
   if ((o = e.elements) != null && o.length) return e.elements;
   const t = e.links;
   return Array.isArray(t) && t.length ? t.map((n) => ({
     network: String(n.network ?? "web"),
     href: String(n.href ?? "")
-  })) : _;
+  })) : V;
 }
-const re = h({
+const se = h({
   type: "custom:social",
   name: "社交链接",
   category: "custom",
   icon: m.social,
   defaultProps: {
-    elements: _,
+    elements: V,
     align: "center",
     iconSize: 28,
     iconBorderRadius: 999,
@@ -519,7 +522,7 @@ const re = h({
       key: "elements",
       label: "社交链接",
       type: "socialLinkList",
-      options: Z,
+      options: te,
       help: "平台：X、Rabbit、Facebook、TikTok、Instagram (ig)。可填标签、自定义图标 URL。MJML 侧 Rabbit/TikTok 使用 web 占位图标，需要品牌图时请填「图标 URL」。"
     },
     {
@@ -535,7 +538,7 @@ const re = h({
       label: "标签字重",
       type: "select",
       selectVariant: "segmented",
-      options: [...M]
+      options: [...j]
     },
     { key: "labelColor", label: "标签颜色", type: "color" },
     {
@@ -571,41 +574,41 @@ const re = h({
     { key: "paddingTop", label: "外边距", type: "spacing" }
   ],
   toMjml: (e) => {
-    const t = S(e), o = W(e.iconSize, e.iconBorderRadius ?? 999), n = C(e.iconSpacing, 10), i = `align="${e.align}" icon-size="${e.iconSize}px" mode="horizontal" border-radius="${o}" inner-padding="${n}px" padding="${t}"`, a = A(e).filter((l) => {
-      var r;
-      return (r = l.href) == null ? void 0 : r.trim();
+    const t = S(e), o = I(e.iconSize, e.iconBorderRadius ?? 999), n = C(e.iconSpacing, 10), i = `align="${e.align}" icon-size="${e.iconSize}px" mode="horizontal" border-radius="${o}" inner-padding="${n}px" padding="${t}"`, c = P(e).filter((l) => {
+      var a;
+      return (a = l.href) == null ? void 0 : a.trim();
     }), d = {
       labelFontSize: Number(e.labelFontSize ?? 13),
-      labelFontWeight: f(String(e.labelFontWeight ?? "400")),
+      labelFontWeight: y(String(e.labelFontWeight ?? "400")),
       labelColor: String(e.labelColor ?? "#333333")
-    }, c = O(a, d);
-    return c.trim() ? `<mj-social ${i}>
-${c}
+    }, s = _(c, d);
+    return s.trim() ? `<mj-social ${i}>
+${s}
 </mj-social>` : `<mj-social ${i}></mj-social>`;
   },
   renderPreview: (e) => {
-    var r;
-    const t = e.labelFontSize != null && e.labelFontSize > 0 ? e.labelFontSize : 13, o = Math.max(8, Math.min(48, t)), n = f(e.labelFontWeight), i = ((r = e.labelColor) == null ? void 0 : r.trim()) || "#333333", a = C(e.iconSpacing, 10), d = I(e.align), c = A(e).filter((s) => {
-      var p;
-      return (p = s.href) == null ? void 0 : p.trim();
-    }).map((s) => {
-      var u;
-      const p = ((u = s.label) == null ? void 0 : u.trim()) ?? "", y = N({
-        network: s.network,
+    var a;
+    const t = e.labelFontSize != null && e.labelFontSize > 0 ? e.labelFontSize : 13, o = Math.max(8, Math.min(48, t)), n = y(e.labelFontWeight), i = ((a = e.labelColor) == null ? void 0 : a.trim()) || "#333333", c = C(e.iconSpacing, 10), d = O(e.align), s = P(e).filter((r) => {
+      var g;
+      return (g = r.href) == null ? void 0 : g.trim();
+    }).map((r) => {
+      var x;
+      const g = ((x = r.label) == null ? void 0 : x.trim()) ?? "", u = W({
+        network: r.network,
         iconSize: e.iconSize,
         iconBorderRadius: e.iconBorderRadius ?? 999,
-        iconSrc: s.iconSrc,
-        backgroundColor: s.backgroundColor
-      }), $ = p ? `<span style="font-size:${o}px !important;font-weight:${n};color:${g(
+        iconSrc: r.iconSrc,
+        backgroundColor: r.backgroundColor
+      }), $ = g ? `<span style="font-size:${o}px !important;font-weight:${n};color:${p(
         i
-      )} !important;line-height:1.2;">${g(p)}</span>` : "";
-      return `<span style="display:inline-flex;align-items:center;gap:6px;"><a href="${g(
-        s.href
-      )}" style="display:inline-flex;align-items:center;text-decoration:none;line-height:0;">${y}</a>${$}</span>`;
+      )} !important;line-height:1.2;">${p(g)}</span>` : "";
+      return `<span style="display:inline-flex;align-items:center;gap:6px;"><a href="${p(
+        r.href
+      )}" style="display:inline-flex;align-items:center;text-decoration:none;line-height:0;">${u}</a>${$}</span>`;
     }).join(""), l = S(e);
-    return `<div style="display:flex;flex-wrap:wrap;justify-content:${d};align-items:center;gap:${a}px;padding:${l};">${c || '<span style="color:#9ca3af;font-size:12px;">请填写链接 URL</span>'}</div>`;
+    return `<div style="display:flex;flex-wrap:wrap;justify-content:${d};align-items:center;gap:${c}px;padding:${l};">${s || '<span style="color:#9ca3af;font-size:12px;">请填写链接 URL</span>'}</div>`;
   }
-}), ae = h({
+}), de = h({
   type: "social-group",
   name: "社交组",
   category: "content",
@@ -632,7 +635,7 @@ ${c}
       key: "elements",
       label: "社交链接",
       type: "socialLinkList",
-      options: Q,
+      options: oe,
       help: "每行：平台、链接、可选标签文字、自定义图标 URL、图标背景色。标签的字号/字重/颜色在下方统一设置。"
     },
     {
@@ -648,7 +651,7 @@ ${c}
       label: "标签字重",
       type: "select",
       selectVariant: "segmented",
-      options: [...M]
+      options: [...j]
     },
     { key: "labelColor", label: "标签颜色", type: "color" },
     {
@@ -684,41 +687,41 @@ ${c}
     { key: "paddingTop", label: "外边距", type: "spacing" }
   ],
   toMjml: (e) => {
-    const t = S(e), o = W(e.iconSize, e.iconBorderRadius ?? 999), n = C(e.iconSpacing, 10), i = `align="${e.align}" icon-size="${e.iconSize}px" mode="horizontal" border-radius="${o}" inner-padding="${n}px" padding="${t}"`, a = e.elements.filter((l) => {
-      var r;
-      return (r = l.href) == null ? void 0 : r.trim();
+    const t = S(e), o = I(e.iconSize, e.iconBorderRadius ?? 999), n = C(e.iconSpacing, 10), i = `align="${e.align}" icon-size="${e.iconSize}px" mode="horizontal" border-radius="${o}" inner-padding="${n}px" padding="${t}"`, c = e.elements.filter((l) => {
+      var a;
+      return (a = l.href) == null ? void 0 : a.trim();
     }), d = {
       labelFontSize: Number(e.labelFontSize ?? 13),
-      labelFontWeight: f(String(e.labelFontWeight ?? "400")),
+      labelFontWeight: y(String(e.labelFontWeight ?? "400")),
       labelColor: String(e.labelColor ?? "#333333")
-    }, c = O(a, d);
-    return c.trim() ? `<mj-social ${i}>
-${c}
+    }, s = _(c, d);
+    return s.trim() ? `<mj-social ${i}>
+${s}
 </mj-social>` : `<mj-social ${i}></mj-social>`;
   },
   renderPreview: (e) => {
-    var r;
-    const t = e.labelFontSize != null && e.labelFontSize > 0 ? e.labelFontSize : 13, o = Math.max(8, Math.min(48, t)), n = f(e.labelFontWeight), i = ((r = e.labelColor) == null ? void 0 : r.trim()) || "#333333", a = C(e.iconSpacing, 10), d = I(e.align), c = e.elements.filter((s) => {
-      var p;
-      return (p = s.href) == null ? void 0 : p.trim();
-    }).map((s) => {
-      var u;
-      const p = ((u = s.label) == null ? void 0 : u.trim()) ?? "", y = N({
-        network: s.network,
+    var a;
+    const t = e.labelFontSize != null && e.labelFontSize > 0 ? e.labelFontSize : 13, o = Math.max(8, Math.min(48, t)), n = y(e.labelFontWeight), i = ((a = e.labelColor) == null ? void 0 : a.trim()) || "#333333", c = C(e.iconSpacing, 10), d = O(e.align), s = e.elements.filter((r) => {
+      var g;
+      return (g = r.href) == null ? void 0 : g.trim();
+    }).map((r) => {
+      var x;
+      const g = ((x = r.label) == null ? void 0 : x.trim()) ?? "", u = W({
+        network: r.network,
         iconSize: e.iconSize,
         iconBorderRadius: e.iconBorderRadius ?? 999,
-        iconSrc: s.iconSrc,
-        backgroundColor: s.backgroundColor
-      }), $ = p ? `<span style="font-size:${o}px !important;font-weight:${n};color:${g(
+        iconSrc: r.iconSrc,
+        backgroundColor: r.backgroundColor
+      }), $ = g ? `<span style="font-size:${o}px !important;font-weight:${n};color:${p(
         i
-      )} !important;line-height:1.2;">${g(p)}</span>` : "";
-      return `<span style="display:inline-flex;align-items:center;gap:6px;"><a href="${g(
-        s.href
-      )}" style="display:inline-flex;align-items:center;text-decoration:none;line-height:0;">${y}</a>${$}</span>`;
+      )} !important;line-height:1.2;">${p(g)}</span>` : "";
+      return `<span style="display:inline-flex;align-items:center;gap:6px;"><a href="${p(
+        r.href
+      )}" style="display:inline-flex;align-items:center;text-decoration:none;line-height:0;">${u}</a>${$}</span>`;
     }).join(""), l = S(e);
-    return `<div style="display:flex;flex-wrap:wrap;justify-content:${d};align-items:center;gap:${a}px;padding:${l};">${c || '<span style="color:#9ca3af;font-size:12px;">请添加社交链接</span>'}</div>`;
+    return `<div style="display:flex;flex-wrap:wrap;justify-content:${d};align-items:center;gap:${c}px;padding:${l};">${s || '<span style="color:#9ca3af;font-size:12px;">请添加社交链接</span>'}</div>`;
   }
-}), ce = h({
+}), ge = h({
   type: "spacer",
   name: "间距",
   category: "content",
@@ -727,7 +730,7 @@ ${c}
   schema: [{ key: "height", label: "高度 (px)", type: "number", min: 1, max: 200 }],
   toMjml: (e) => `<mj-spacer height="${e.height}px" />`,
   renderPreview: (e) => `<div style="height:${e.height}px;line-height:${e.height}px;"></div>`
-}), v = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), se = h({
+}), v = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), H = "输入文本…", pe = h({
   type: "text",
   name: "文本",
   category: "content",
@@ -766,7 +769,7 @@ ${c}
       type: "select",
       selectVariant: "segmented",
       inheritGlobal: !0,
-      options: [...M]
+      options: [...j]
     },
     {
       key: "lineHeight",
@@ -801,53 +804,53 @@ ${c}
     mode: "rich",
     multiline: !0,
     propKey: "content",
-    placeholder: "输入文本…"
+    placeholder: H
   },
   toMjml: (e) => {
-    const t = `${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`, o = e.fontFamily ? ` font-family="${v(e.fontFamily)}"` : "", n = String(e.fontWeight ?? "").trim(), i = n ? ` font-weight="${v(f(n))}"` : "", a = String(e.lineHeight ?? "").trim(), d = a ? ` line-height="${v(a)}"` : "", c = String(e.color ?? "").trim(), l = c ? ` color="${v(c)}"` : "", r = String(e.fontSize ?? "").trim(), s = r ? ` font-size="${v(r)}"` : "";
-    return `<mj-text align="${e.align}"${l}${s}${d}${o}${i} padding="${t}">${e.content}</mj-text>`;
+    const t = `${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px`, o = e.fontFamily ? ` font-family="${v(e.fontFamily)}"` : "", n = String(e.fontWeight ?? "").trim(), i = n ? ` font-weight="${v(y(n))}"` : "", c = String(e.lineHeight ?? "").trim(), d = c ? ` line-height="${v(c)}"` : "", s = String(e.color ?? "").trim(), l = s ? ` color="${v(s)}"` : "", a = String(e.fontSize ?? "").trim(), r = a ? ` font-size="${v(a)}"` : "";
+    return `<mj-text align="${e.align}"${l}${r}${d}${o}${i} padding="${t}">${e.content}</mj-text>`;
   },
   renderPreview: (e) => {
-    const t = e.fontFamily ? `font-family:${e.fontFamily};` : "", o = String(e.fontWeight ?? "").trim(), n = o ? `font-weight:${f(o)};` : "", i = String(e.lineHeight ?? "").trim(), a = i ? `line-height:${i};` : "line-height:normal;", d = String(e.color ?? "").trim(), c = d ? `color:${d};` : "", l = String(e.fontSize ?? "").trim(), r = l ? `font-size:${l};` : "";
-    return `<div class="sm-text-content" style="text-align:${e.align};${c}${r}${n}${a}${t}padding:${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px;">${e.content}</div>`;
+    const t = e.fontFamily ? `font-family:${e.fontFamily};` : "", o = String(e.fontWeight ?? "").trim(), n = o ? `font-weight:${y(o)};` : "", i = String(e.lineHeight ?? "").trim(), c = i ? `line-height:${i};` : "line-height:normal;", d = String(e.color ?? "").trim(), s = d ? `color:${d};` : "", l = String(e.fontSize ?? "").trim(), a = l ? `font-size:${l};` : "", r = q(e.content), g = r ? " is-empty" : "", u = r ? ` data-placeholder="${H}"` : "";
+    return `<div class="sm-text-content${g}"${u} style="text-align:${e.align};${s}${a}${n}${c}${t}padding:${e.paddingTop}px ${e.paddingRight}px ${e.paddingBottom}px ${e.paddingLeft}px;">${e.content}</div>`;
   }
-}), de = [
-  se,
-  D,
-  X,
-  ae,
+}), he = [
+  pe,
+  Z,
+  Q,
+  de,
+  Y,
   K,
-  G,
-  q,
-  ce
-], ge = [Y, re, J], he = [...de, ...ge];
+  D,
+  ge
+], me = [ee, se, X], ue = [...he, ...me];
 export {
-  Q as SOCIAL_NETWORK_OPTIONS,
-  he as allBlocks,
-  de as builtinBlocks,
-  G as buttonBlock,
-  q as dividerBlock,
-  g as escAttr,
-  te as escMjmlText,
-  ge as exampleCustomBlocks,
-  I as flexJustifyFromAlign,
-  J as footerBlock,
-  K as heroBlock,
-  D as htmlBlock,
-  X as imageBlock,
-  Y as logoBlock,
-  ie as mjSocialDefaultIconSrc,
-  H as mjSocialElementName,
-  O as mjSocialElementsLines,
+  oe as SOCIAL_NETWORK_OPTIONS,
+  ue as allBlocks,
+  he as builtinBlocks,
+  K as buttonBlock,
+  D as dividerBlock,
+  p as escAttr,
+  ie as escMjmlText,
+  me as exampleCustomBlocks,
+  O as flexJustifyFromAlign,
+  X as footerBlock,
+  Y as heroBlock,
+  Z as htmlBlock,
+  Q as imageBlock,
+  ee as logoBlock,
+  ae as mjSocialDefaultIconSrc,
+  E as mjSocialElementName,
+  _ as mjSocialElementsLines,
   S as paddingQuad,
-  N as renderSocialIconPreviewHtml,
-  re as socialBlock,
-  ae as socialGroupBlock,
-  le as socialIconBorderRadiusCss,
-  W as socialIconBorderRadiusMjml,
+  W as renderSocialIconPreviewHtml,
+  se as socialBlock,
+  de as socialGroupBlock,
+  ce as socialIconBorderRadiusCss,
+  I as socialIconBorderRadiusMjml,
   C as socialIconSpacingPx,
-  E as socialMeta,
-  ce as spacerBlock,
-  se as textBlock
+  N as socialMeta,
+  ge as spacerBlock,
+  pe as textBlock
 };
 //# sourceMappingURL=index.js.map