@emailens/engine 0.11.7 → 0.11.9

package/dist/index.d.cts

@@ -1,7 +1,7 @@
-import { E as EmailClient, F as Framework, T as TransformResult, C as CSSWarning, a as CodeFix, D as DiffResult, b as ExportPromptOptions, A as AiProvider, c as AiFixResult, S as SupportLevel, d as SpamAnalysisOptions, e as SpamReport, L as LinkReport, f as AccessibilityReport, g as AccessibilityIssue, I as ImageReport, h as InboxPreview, i as SizeReport, j as TemplateReport, O as OverflowReport, V as VmlReport, k as VisualReport, l as DesignReport, m as DeliverabilityReport } from './types-bvGDId6f.cjs';
-export { B as BaseIssue, n as ClientTruncation, o as DeliverabilityCheck, p as DeliverabilityIssue, q as DesignIssue, r as EstimateOptions, s as ExportScope, t as FixType, u as ImageInfo, v as ImageIssue, w as InboxPreviewIssue, x as InputFormat, y as LinkIssue, z as OverflowIssue, P as PreviewResult, G as Severity, H as SizeIssue, J as SourceLocation, K as SpamIssue, M as TemplateIssue, N as TokenEstimate, Q as TokenEstimateWithWarnings, R as VisualIssue, U as VmlIssue, W as estimateAiFixTokens, X as generateFixPrompt, Y as heuristicTokenCount } from './types-bvGDId6f.cjs';
+import { E as EmailClient, F as Framework, T as TransformResult, C as CSSWarning, a as CodeFix, D as DiffResult, b as ExportPromptOptions, A as AiProvider, c as AiFixResult, S as SupportLevel, d as SpamAnalysisOptions, e as SpamReport, L as LinkReport, f as AccessibilityReport, g as AccessibilityIssue, I as ImageReport, h as InboxPreview, i as SizeReport, j as TemplateReport, O as OverflowReport, V as VmlReport, k as VisualReport, l as DesignReport, m as DeliverabilityReport } from './types-DiseE-UH.cjs';
+export { B as BaseIssue, n as ClientTruncation, o as DeliverabilityCheck, p as DeliverabilityIssue, q as DesignIssue, r as EstimateOptions, s as ExportScope, t as FixType, u as ImageInfo, v as ImageIssue, w as InboxPreviewIssue, x as InputFormat, y as LinkInfo, z as LinkIssue, G as OverflowIssue, P as PreviewResult, H as Severity, J as SizeIssue, K as SourceLocation, M as SpamIssue, N as TemplateIssue, Q as TokenEstimate, R as TokenEstimateWithWarnings, U as VisualIssue, W as VmlIssue, X as estimateAiFixTokens, Y as generateFixPrompt, Z as heuristicTokenCount } from './types-DiseE-UH.cjs';
 import * as cheerio from 'cheerio';
-export { C as CompileError, a as CompileReactEmailOptions, S as SandboxStrategy } from './react-email-DuZAgJtw.cjs';
+export { C as CompileError, a as CompileReactEmailOptions, S as SandboxStrategy } from './react-email-DRkmpgX-.cjs';
 
 declare const EMAIL_CLIENTS: EmailClient[];
 declare function getClient(id: string): EmailClient | undefined;
@@ -410,12 +410,32 @@ declare function checkVml(html: string, options?: {
  * `roundrect` and `rect` are the whole surface. Anything else is left alone
  * rather than approximated.
  *
- * Deliberately NOT emulated: how Word *mis*-renders a nested shape. That is a
- * real and confirmed failure (the container disappears and text stops drawing
- * further down the document), but reproducing it means perturbing Chromium's
- * layout into a picture that is wrong in a third way, different from both the
- * correct render and Outlook's. `checkVml` reports it with a line number
- * instead, which is more useful and cannot mislead.
+ * How Word *mis*-renders a nested shape is emulated, but only the parts with
+ * evidence behind them. This note used to say the failure was not emulated at
+ * all, on the grounds that reproducing it meant perturbing Chromium into a
+ * picture wrong in a third way. That argument does not survive contact with
+ * the specific effects:
+ *
+ *   - the container's fill and geometry disappear    -> drop the box. Exact.
+ *   - VML shapes further down stop drawing text      -> blank their labels.
+ *                                                       Exact, and scoped to
+ *                                                       shapes we created.
+ *   - the table structure terminates early, so later
+ *     content escapes the frame                      -> WITHDRAWN. It had no
+ *                                                       methodology, and the
+ *                                                       fixture built to
+ *                                                       measure it contradicts
+ *                                                       it.
+ *
+ * Two of the three needed no distortion at all; the third turned out not to be
+ * a rendering problem but an evidence problem. Refusing to draw any of it
+ * meant the preview showed a tidy box with a button in it, a picture no Word
+ * engine produces, sitting beside a finding that said the region was
+ * destroyed. Between a warning and a screenshot, people believe the
+ * screenshot.
+ *
+ * Affected regions carry `data-vml-outlook` so a surface can label them, since
+ * a blank button should read as "Outlook does this" and not as our bug.
  */
 /**
  * `arcsize` is a VgFraction: a proportion of *half the shape's shorter side*,

package/dist/index.d.ts

@@ -1,7 +1,7 @@
-import { E as EmailClient, F as Framework, T as TransformResult, C as CSSWarning, a as CodeFix, D as DiffResult, b as ExportPromptOptions, A as AiProvider, c as AiFixResult, S as SupportLevel, d as SpamAnalysisOptions, e as SpamReport, L as LinkReport, f as AccessibilityReport, g as AccessibilityIssue, I as ImageReport, h as InboxPreview, i as SizeReport, j as TemplateReport, O as OverflowReport, V as VmlReport, k as VisualReport, l as DesignReport, m as DeliverabilityReport } from './types-bvGDId6f.js';
-export { B as BaseIssue, n as ClientTruncation, o as DeliverabilityCheck, p as DeliverabilityIssue, q as DesignIssue, r as EstimateOptions, s as ExportScope, t as FixType, u as ImageInfo, v as ImageIssue, w as InboxPreviewIssue, x as InputFormat, y as LinkIssue, z as OverflowIssue, P as PreviewResult, G as Severity, H as SizeIssue, J as SourceLocation, K as SpamIssue, M as TemplateIssue, N as TokenEstimate, Q as TokenEstimateWithWarnings, R as VisualIssue, U as VmlIssue, W as estimateAiFixTokens, X as generateFixPrompt, Y as heuristicTokenCount } from './types-bvGDId6f.js';
+import { E as EmailClient, F as Framework, T as TransformResult, C as CSSWarning, a as CodeFix, D as DiffResult, b as ExportPromptOptions, A as AiProvider, c as AiFixResult, S as SupportLevel, d as SpamAnalysisOptions, e as SpamReport, L as LinkReport, f as AccessibilityReport, g as AccessibilityIssue, I as ImageReport, h as InboxPreview, i as SizeReport, j as TemplateReport, O as OverflowReport, V as VmlReport, k as VisualReport, l as DesignReport, m as DeliverabilityReport } from './types-DiseE-UH.js';
+export { B as BaseIssue, n as ClientTruncation, o as DeliverabilityCheck, p as DeliverabilityIssue, q as DesignIssue, r as EstimateOptions, s as ExportScope, t as FixType, u as ImageInfo, v as ImageIssue, w as InboxPreviewIssue, x as InputFormat, y as LinkInfo, z as LinkIssue, G as OverflowIssue, P as PreviewResult, H as Severity, J as SizeIssue, K as SourceLocation, M as SpamIssue, N as TemplateIssue, Q as TokenEstimate, R as TokenEstimateWithWarnings, U as VisualIssue, W as VmlIssue, X as estimateAiFixTokens, Y as generateFixPrompt, Z as heuristicTokenCount } from './types-DiseE-UH.js';
 import * as cheerio from 'cheerio';
-export { C as CompileError, a as CompileReactEmailOptions, S as SandboxStrategy } from './react-email-BROBcC8u.js';
+export { C as CompileError, a as CompileReactEmailOptions, S as SandboxStrategy } from './react-email-B82A1R_K.js';
 
 declare const EMAIL_CLIENTS: EmailClient[];
 declare function getClient(id: string): EmailClient | undefined;
@@ -410,12 +410,32 @@ declare function checkVml(html: string, options?: {
  * `roundrect` and `rect` are the whole surface. Anything else is left alone
  * rather than approximated.
  *
- * Deliberately NOT emulated: how Word *mis*-renders a nested shape. That is a
- * real and confirmed failure (the container disappears and text stops drawing
- * further down the document), but reproducing it means perturbing Chromium's
- * layout into a picture that is wrong in a third way, different from both the
- * correct render and Outlook's. `checkVml` reports it with a line number
- * instead, which is more useful and cannot mislead.
+ * How Word *mis*-renders a nested shape is emulated, but only the parts with
+ * evidence behind them. This note used to say the failure was not emulated at
+ * all, on the grounds that reproducing it meant perturbing Chromium into a
+ * picture wrong in a third way. That argument does not survive contact with
+ * the specific effects:
+ *
+ *   - the container's fill and geometry disappear    -> drop the box. Exact.
+ *   - VML shapes further down stop drawing text      -> blank their labels.
+ *                                                       Exact, and scoped to
+ *                                                       shapes we created.
+ *   - the table structure terminates early, so later
+ *     content escapes the frame                      -> WITHDRAWN. It had no
+ *                                                       methodology, and the
+ *                                                       fixture built to
+ *                                                       measure it contradicts
+ *                                                       it.
+ *
+ * Two of the three needed no distortion at all; the third turned out not to be
+ * a rendering problem but an evidence problem. Refusing to draw any of it
+ * meant the preview showed a tidy box with a button in it, a picture no Word
+ * engine produces, sitting beside a finding that said the region was
+ * destroyed. Between a warning and a screenshot, people believe the
+ * screenshot.
+ *
+ * Affected regions carry `data-vml-outlook` so a surface can label them, since
+ * a blank button should read as "Outlook does this" and not as our bug.
  */
 /**
  * `arcsize` is a VgFraction: a proportion of *half the shape's shorter side*,

package/dist/index.js

@@ -8949,10 +8949,6 @@ function splitTopLevel(value) {
   return parts;
 }
 
-// src/downlevel.ts
-import * as cheerio from "cheerio";
-import * as csstree from "css-tree";
-
 // src/color-utils.ts
 var NAMED_COLORS = {
   aliceblue: [240, 248, 255],
@@ -9390,6 +9386,8 @@ function colorDistance(a, b) {
 }
 
 // src/downlevel.ts
+import * as cheerio from "cheerio";
+import * as csstree from "css-tree";
 var LOGICAL_PROPERTY_MAP = {
   "padding-inline": ["padding-left", "padding-right"],
   "padding-block": ["padding-top", "padding-bottom"],
@@ -9840,10 +9838,23 @@ function vmlToCss(html) {
         solid ? `background-color:${solid}` : "",
         `padding:${padding}`
       ].filter(Boolean).join(";");
+      if (/data-vml="/.test(content)) {
+        return `<div data-vml="rect" data-vml-outlook="container-dropped">${content}</div>`;
+      }
       return `<div data-vml="rect" style="${background}${box}">${content}</div>`;
     }
   );
-  return out.replace(/<\/?v:(?:fill|textbox|stroke|shadow|imagedata|path|formulas|handles)[^>]*?\/?>/gi, "");
+  out = out.replace(/<\/?v:(?:fill|textbox|stroke|shadow|imagedata|path|formulas|handles)[^>]*?\/?>/gi, "");
+  return blankLabelsAfterNestedShape(out);
+}
+function blankLabelsAfterNestedShape(html) {
+  const at = html.indexOf('data-vml-outlook="container-dropped"');
+  if (at === -1) return html;
+  const tail = html.slice(at).replace(
+    /(<div data-vml="roundrect")([^>]*>)([\s\S]*?)(<\/div>)/gi,
+    (whole, open, rest, label, close) => label.trim() ? `${open}${rest.slice(0, -1)} data-vml-outlook="label-dropped">${close}` : whole
+  );
+  return html.slice(0, at) + tail;
 }
 function renderOutlookBranch(html) {
   if (!/<!--\[if/i.test(html)) return html;
@@ -9895,6 +9906,7 @@ var EMPTY_SPAM = { score: 100, level: "low", issues: [] };
 var EMPTY_LINKS = {
   totalLinks: 0,
   issues: [],
+  links: [],
   breakdown: { https: 0, http: 0, mailto: 0, tel: 0, anchor: 0, javascript: 0, protocolRelative: 0, other: 0 }
 };
 var EMPTY_ACCESSIBILITY = { score: 100, issues: [] };
@@ -10274,13 +10286,17 @@ var CLIENT_CONFIGS = {
     strippedProperties: OUTLOOK_WORD_UNSUPPORTED,
     stripMode: "strip",
     valueStrips: [
-      { prop: "background", pattern: /linear-gradient|radial-gradient/ },
-      { prop: "background-image", pattern: /linear-gradient|radial-gradient/ }
+      // Gradients and image URLs alike: the Word engine paints neither. Only
+      // VML does, and vmlToCss runs after this pass, so a hero built the
+      // bulletproof way keeps the background this strip would otherwise take.
+      { prop: "background", pattern: /linear-gradient|radial-gradient|url\(/ },
+      { prop: "background-image", pattern: /linear-gradient|radial-gradient|url\(/ }
     ],
     inlineAndStripStyles: false,
     stripExternalStylesheets: false,
     stripForms: false,
     stripSvg: false,
+    stripBackgroundAttribute: true,
     additionalChecks: outlookWindowsAdditionalChecks
   },
   "outlook-web": {
@@ -10501,6 +10517,11 @@ function applyTransform(html, config, framework) {
       $(el).replaceWith('<img alt="[SVG not supported]" />');
     });
   }
+  if (config.stripBackgroundAttribute) {
+    $("[background]").each((_, el) => {
+      $(el).removeAttr("background");
+    });
+  }
   if (config.strippedProperties.size > 0 || config.valueStrips && config.valueStrips.length > 0) {
     $("[style]").each((_, el) => {
       const style = $(el).attr("style") || "";
@@ -10525,7 +10546,9 @@ function applyTransform(html, config, framework) {
         for (const vs of (_a = config.valueStrips) != null ? _a : []) {
           if (prop === vs.prop && vs.pattern.test(value)) {
             removed.push(prop);
-            props.delete(prop);
+            const fallback = prop === "background" ? backgroundShorthandColor(value) : null;
+            if (fallback) props.set(prop, fallback);
+            else props.delete(prop);
             return;
           }
         }
@@ -12995,6 +13018,7 @@ function isPlaceholderHref(href) {
 }
 function validateLinksFromDom($) {
   const issues = [];
+  const inventory = [];
   const breakdown = { https: 0, http: 0, mailto: 0, tel: 0, anchor: 0, javascript: 0, protocolRelative: 0, other: 0 };
   const links = $("a");
   const totalLinks = links.length;
@@ -13004,13 +13028,22 @@ function validateLinksFromDom($) {
       rule: "no-links",
       message: "Email contains no links"
     });
-    return { totalLinks: 0, issues, breakdown };
+    return { totalLinks: 0, issues, breakdown, links: [] };
   }
   const hrefCounts = /* @__PURE__ */ new Map();
   links.each((_, el) => {
     const href = $(el).attr("href") || "";
     const text = $(el).text().trim();
     const category = classifyHref(href);
+    const entry = {
+      href,
+      text: text.slice(0, 80),
+      scheme: category,
+      isPlaceholder: isPlaceholderHref(href),
+      issues: []
+    };
+    inventory.push(entry);
+    const flag = (rule) => entry.issues.push(rule);
     const elLoc = locOfElement(el);
     const hrefLoc = href ? locOfAttr(el, "href") : elLoc;
     switch (category) {
@@ -13043,6 +13076,7 @@ function validateLinksFromDom($) {
       hrefCounts.set(href, (hrefCounts.get(href) || 0) + 1);
     }
     if (!href || !href.trim()) {
+      flag("empty-href");
       issues.push(__spreadValues({
         severity: "error",
         rule: "empty-href",
@@ -13052,6 +13086,7 @@ function validateLinksFromDom($) {
       return;
     }
     if (category === "javascript" && !isPlaceholderHref(href)) {
+      flag("javascript-href");
       issues.push(__spreadValues({
         severity: "error",
         rule: "javascript-href",
@@ -13062,6 +13097,7 @@ function validateLinksFromDom($) {
       return;
     }
     if (isPlaceholderHref(href)) {
+      flag("placeholder-href");
       issues.push(__spreadValues({
         severity: "warning",
         rule: "placeholder-href",
@@ -13072,6 +13108,7 @@ function validateLinksFromDom($) {
       return;
     }
     if (category === "http") {
+      flag("insecure-link");
       issues.push(__spreadValues({
         severity: "warning",
         rule: "insecure-link",
@@ -13081,6 +13118,7 @@ function validateLinksFromDom($) {
       }, hrefLoc ? { loc: hrefLoc } : {}));
     }
     if (category === "protocol-relative") {
+      flag("protocol-relative");
       issues.push(__spreadValues({
         severity: "warning",
         rule: "protocol-relative",
@@ -13090,6 +13128,7 @@ function validateLinksFromDom($) {
       }, hrefLoc ? { loc: hrefLoc } : {}));
     }
     if (text && GENERIC_LINK_TEXT.has(text.toLowerCase())) {
+      flag("generic-link-text");
       issues.push(__spreadValues({
         severity: "warning",
         rule: "generic-link-text",
@@ -13099,6 +13138,7 @@ function validateLinksFromDom($) {
       }, elLoc ? { loc: elLoc } : {}));
     }
     if (!text && !$(el).attr("aria-label") && !$(el).find("img[alt]").length) {
+      flag("empty-link-text");
       issues.push(__spreadValues({
         severity: "error",
         rule: "empty-link-text",
@@ -13107,6 +13147,7 @@ function validateLinksFromDom($) {
       }, elLoc ? { loc: elLoc } : {}));
     }
     if (category === "mailto" && href.trim().toLowerCase() === "mailto:") {
+      flag("empty-mailto");
       issues.push(__spreadValues({
         severity: "error",
         rule: "empty-mailto",
@@ -13116,6 +13157,7 @@ function validateLinksFromDom($) {
       }, hrefLoc ? { loc: hrefLoc } : {}));
     }
     if (category === "tel" && href.trim().toLowerCase() === "tel:") {
+      flag("empty-tel");
       issues.push(__spreadValues({
         severity: "error",
         rule: "empty-tel",
@@ -13125,6 +13167,7 @@ function validateLinksFromDom($) {
       }, hrefLoc ? { loc: hrefLoc } : {}));
     }
     if (href.length > 2e3) {
+      flag("long-url");
       issues.push(__spreadValues({
         severity: "info",
         rule: "long-url",
@@ -13134,7 +13177,8 @@ function validateLinksFromDom($) {
       }, hrefLoc ? { loc: hrefLoc } : {}));
     }
   });
-  links.each((_, el) => {
+  links.each((i, el) => {
+    var _a;
     const href = $(el).attr("href") || "";
     const trimmed = href.trim();
     if (trimmed.startsWith("#") && trimmed.length > 1) {
@@ -13142,6 +13186,7 @@ function validateLinksFromDom($) {
       const target = $(`[id="${targetId}"]`);
       const anchorLoc = locOfAttr(el, "href");
       if (target.length === 0) {
+        (_a = inventory[i]) == null ? void 0 : _a.issues.push("broken-anchor");
         issues.push(__spreadValues({
           severity: "error",
           rule: "broken-anchor",
@@ -13162,7 +13207,7 @@ function validateLinksFromDom($) {
       });
     }
   }
-  return { totalLinks, issues, breakdown };
+  return { totalLinks, issues, breakdown, links: inventory };
 }
 function validateLinks(html, options) {
   return fromHtml(html, EMPTY_LINKS, validateLinksFromDom, options);
@@ -14701,7 +14746,20 @@ function checkVml(html, options) {
           rule: "vml-nested-shape",
           severity: "error",
           message: `<v:${name}> is nested inside <v:${parent.name}>. Outlook does not support nesting one VML shape inside another.`,
-          detail: `Verified in Outlook Classic, and the damage is not local. Three things happen: the containing <v:${parent.name}> does not render at all (its fill and everything inside it disappear, leaving the inner shape stranded); the table structure around it terminates early, so content *after* the shape falls out of the layout and renders outside the email frame; and every VML shape further down the email stops drawing its text, so buttons and headings after this point ship as blank coloured blocks. Confirmed with byte-identical probes either side of one nested shape: the one before it renders its labels, the one after it does not. Every other client renders the HTML fallback correctly, which is why none of this is visible outside the Word engine. Fix: lift the inner shape out of <v:${parent.name}>, or drop the container shape and keep the inner one (a framed background can degrade to a solid fill colour on the <td> instead).`
+          // Two effects, not the three this used to claim. The withdrawn one
+          // said the table structure terminates early so content after the
+          // shape falls outside the email frame. It had no methodology behind
+          // it, and `T1c-blast-radius.html`, the fixture built to measure
+          // exactly this, contradicts it: the block after the nested shape
+          // rendered in place inside the same table with its background and
+          // borders intact, and only the VML labels were missing. The likely
+          // origin is over-reading "layout breaks after it" from a run where a
+          // 600px hero band vanished and everything below shifted up.
+          //
+          // Kept as a warning to whoever edits this next: the probe sentence
+          // below covers the downstream text suppression only. Do not let it
+          // lend its authority to a neighbouring clause again.
+          detail: `Verified in Outlook Classic, and the damage is not local. Two things happen: the containing <v:${parent.name}> does not render at all (its fill and everything inside it disappear, leaving the inner shape stranded); and every VML shape further down the email stops drawing its text, so buttons and headings after this point ship as blank coloured blocks. That second effect was confirmed with byte-identical probes either side of one nested shape: the one before it renders its labels, the one after it does not. Every other client renders the HTML fallback correctly, which is why none of this is visible outside the Word engine. Fix: lift the inner shape out of <v:${parent.name}>, or drop the container shape and keep the inner one (a framed background can degrade to a solid fill colour on the <td> instead).`
         }, loc));
       }
       if (!tag.selfClosing) openShapes.push(tag);