@samva/markup 0.18.0 → 0.19.0

package/AGENTS.md

@@ -49,6 +49,13 @@ Tooling entries are what a host (Vite, the CLI, the editor, the API, the templat
   compiled and rendered as a template that imports the brand. It imports no
   Vite, esbuild, Node builtins or caniemail, so it runs in Node, Bun, Workers and the browser
   (`tests/browser-entries.test.ts` loads it without `process`).
+- `@samva/markup/markdown` — `parseIssue(source, file)` reads typed YAML frontmatter and static
+  Markdown/SML component tags into semantic nodes with exact source ranges; `compileIssue` inserts
+  them into an email-only TSX layout (default `layout.tsx`) at one `IssueContent` directive imported
+  from `@samva/markup/email`, before CSS is applied. The issue slug/title/preheader set its compiled
+  identity/subject/preview; the layout supplies schema and fixtures. `inspectMarkdownNode` in
+  `./edit` resolves its origins; `applySourceReplacements` takes `{ markdown: { file } }` to validate
+  Markdown edits. Expressions, raw HTML, unknown tags and invalid metadata are diagnostics.
 - `@samva/markup/compatibility` — `checkCompatibility`, which checks each fixture against
   the client matrix and locates findings at source; `checkHtmlCompatibility` for HTML a host
   already has; `hasBlockingCompatibility` and the matrix. It is the only entry that loads
@@ -56,9 +63,9 @@ Tooling entries are what a host (Vite, the CLI, the editor, the API, the templat
 - `@samva/markup/diagnostics` — source spans and line maps, the `DIAGNOSTIC_CODES` registry with
   each code's fix and upgrade recipe, and `EmailDiagnostic`. It does not load the compiler, so a
   host that only reports imports it.
-- `@samva/markup/render` — `render(template, input, { channel, locale?, timeZone?, brandPlugin? })`,
-  which returns the `channel`'s message (`RenderedEmail`, `RenderedSms` with its segment counts, or
-  `RenderedWhatsApp`) and throws only `RenderError`, including for a template compiled by another
+- `@samva/markup/render` — `render(template, input, { target, locale?, timeZone?, brandPlugin? })`,
+  which returns the target's output (`RenderedEmail`, `RenderedPage` with body HTML and head hints,
+  `RenderedSms` with its segment counts, or `RenderedWhatsApp`) and throws only `RenderError`, including for a template compiled by another
   `COMPILED_TEMPLATE_VERSION`; the `Compiled*` types; the email element table and `escapeText` /
   `escapeAttribute`; `smsSegmentInfo`. Its import closure excludes the compiler's libraries
   (`tests/entry-closure.test.ts`): it is the send-time security boundary and what the API bundles.
@@ -168,7 +175,7 @@ Read the contract before authoring. Import only subpaths declared in `package.js
 
 - `tsc --noEmit` over the template project catches unsupported elements, attributes, and props.
 - `compileTemplate` reports every static-profile, binding and fixture finding with a source
-  location, and `render(compiled.template, fixture, { channel: "email" })` proves one fixture's
+  location, and `render(compiled.template, fixture, { target: "email" })` proves one fixture's
   output without executing the template.
 - `samva templates check` (from `@samva/cli`) compiles every entry and renders every fixture,
   reporting findings with source locations.

package/CHANGELOG.md

@@ -1,3 +1,39 @@
+## @samva/markup@0.19.0
+
+### Author newsletter issues in SML Markdown
+
+Parse `issues/*.md` with typed YAML frontmatter and static SML component tags through
+`@samva/markup/markdown`. Unknown components, raw HTML, expressions, and invalid metadata return
+located diagnostics. Prose and component attributes retain exact editable source spans. Prose
+edits preserve ordinary punctuation and protect only syntax-sensitive delimiters and whitespace.
+
+Compile each issue into an email-only TSX layout containing one `<IssueContent />` from
+`@samva/markup/email`, then render the shared document to email or web. Vite discovers issues
+separately from template entries and includes them in project build, render, and export workflows.
+Existing template email output and golden digests are unchanged.
+
+### Render email templates as web pages
+
+**Breaking:** replace `render(template, input, { channel })` with
+`render(template, input, { target })`. Use `target: "email"`, `"sms"`, or `"whatsapp"` for message
+delivery, and `target: "web"` for the semantic HTML body and head hints of an email template.
+Recompile stored templates to compiled document version `sml: 2` before rendering them with this
+version. Compilation digests change with this document format.
+
+Email and web share the template's components, bindings, conditions, loops, and source positions.
+Email preserves the existing rendered HTML, subject, preheader, and text byte for byte, including
+Outlook fallbacks. The web target emits semantic HTML with styles supplied separately to the page
+shell. `templateEmailDegradations` locates component fidelity declarations in source, and
+`checkCompatibility` reports content losses alongside client HTML findings.
+
+### An important declaration keeps `!important` when it is inlined
+
+A stylesheet `!important` that wins the cascade is written onto the element's `style` with `!important`. The flag used to decide the winner and then disappear, so a later important rule could override the inlined value. An author's own important inline style is kept the same way.
+
+A logical padding shorthand keeps that flag on every physical side. `padding-inline: 3px 4px !important` becomes `padding-left: 3px !important` and `padding-right: 4px !important`.
+
+A property the generated dark-mode class restates is inlined without `!important`, including a declaration that only overlaps the color that changed. That class also uses `!important`, and an important inline style would keep the light color. A weaker rule kept in the head, such as a hover, is copied onto a more specific selector so it does not take that color; the copy inside the dark-mode query keeps the theme switch. A stronger rule is copied again after that guard. A shorthand in that copy also restates any locked longhand that still outranks it, so the shorthand does not reset a stronger inline color. The dark-mode copy resolves that shorthand and the longhand at their dark values. A pseudo-element keeps the color it sets for itself.
+
 ## @samva/markup@0.17.0
 
 ### One compiler for every host, one render, one error model

package/README.md

@@ -107,10 +107,10 @@ export default defineTemplate({
 
 A template is read, not run. `@samva/markup/compiler` parses the file and the project files it
 imports without evaluating them, checks every binding against the schema, resolves Tailwind and CSS
-against the markup, and produces the compiled template: JSON, versioned (`"sml": 1`), carrying the
-markup, the bindings, the conditions, the loops and the formatters. `@samva/markup/render`
-renders that template against an input. It is a pure function with no dependencies, so nothing executes
-at send time.
+against the markup, and produces a semantic document: JSON, versioned (`"sml": 2`), carrying
+components, block and inline content, bindings, conditions, loops, formatters, and source positions.
+`@samva/markup/render` lowers that document to the requested target against an input. Rendering is
+pure, with no authored code or external I/O at send time.
 
 ```ts
 import { render } from "@samva/markup/render";
@@ -125,12 +125,28 @@ const compiled = await compileTemplate({
 if (compiled.template === undefined) throw new Error(compiled.diagnostics.map(String).join("\n"));
 
 const { subject, preheader, html, text } = render(compiled.template, compiled.fixtures.default, {
-  channel: "email",
+  target: "email",
   locale: "en-US",
   timeZone: "UTC",
 });
 ```
 
+Every email template also has a web target. It returns the page body and hints for the host's page
+shell; the host owns the document head, canonical URL, indexing, and access control.
+
+```ts
+const page = render(compiled.template, compiled.fixtures.default, { target: "web" });
+// page.html is semantic HTML; page.headHints carries the styles and document hints.
+```
+
+Email lowering preserves email layout, Outlook fallbacks, subject, preheader, and plain text.
+Web lowering uses semantic elements and supplies styles separately from the HTML body. Both read
+the same authored components and source positions. `COMPONENT_DEGRADATIONS` from
+`@samva/markup/compatibility` declares what each component loses in email.
+`templateEmailDegradations(compiled.template)` locates those declarations in the authored source;
+`checkCompatibility` reports content degradations alongside client HTML findings. A `same`
+declaration records that content is preserved and adds no finding.
+
 ### The static profile
 
 The profile is the subset of TSX the compiler reads without running it: the forms an agent already
@@ -253,3 +269,71 @@ Portable validation uses `@cfworker/json-schema` without runtime code generation
 2020-12 meta-schema is checked at every supported schema position, and the explicit profile rejects
 keywords outside its contract before interpretation. The AJV dependency supplies static meta-schema
 JSON; its code generator is not invoked in a loaded template.
+
+## Markdown newsletter issues
+
+`@samva/markup/markdown` parses newsletter prose into the same semantic document as TSX. Files
+carry YAML frontmatter and CommonMark prose, with static tags from SML's email component set:
+
+```md
+---
+title: October product news
+slug: october-product-news
+topic: product
+preheader: What shipped this month
+seo:
+  description: October updates from the team
+  image: https://example.com/october.png
+gate:
+  leadIn: 2
+---
+
+# What shipped
+
+Read the **latest updates**.
+
+<Button href="https://example.com/updates">See every update</Button>
+```
+
+`title`, `slug`, and `topic` are required nonempty strings. The slug is lowercase kebab-case.
+`preheader` is optional text; `seo` accepts optional `title`, `description`, and an absolute HTTPS
+`image`; `gate.leadIn` counts leading top-level content blocks before a host-owned subscription
+wall. SML preserves this metadata; the host owns SEO tags, gating, and publication. Unknown fields,
+invalid YAML, raw HTML, unknown components, expressions, spreads, and nonliteral props are errors.
+Use explicit `[label](url)` links; angle autolinks are outside this grammar.
+Numeric and boolean props use quoted values (`height="24"`, `stack="false"`); bare boolean flags
+mean true. Fenced code is literal content, including any HTML or braces inside it.
+
+A layout is an ordinary email-only `defineTemplate` entry containing one static `<IssueContent />`
+imported from `@samva/markup/email`. The directive takes no props or children and must sit outside
+conditions and loops. It disappears during compilation before styles are applied.
+
+```ts
+import { compileIssue, parseIssue } from "@samva/markup/markdown";
+import { render } from "@samva/markup/render";
+
+const parsed = parseIssue(files["issues/october.md"], "issues/october.md");
+const compiled = await compileIssue({
+  files,
+  entry: "issues/october.md",
+  layout: "layout.tsx",
+  assetBase: "https://assets.example.com",
+});
+if (compiled.template) {
+  const page = render(compiled.template, compiled.fixtures.default, { target: "web" });
+}
+```
+
+`compileIssue` takes its schema, fixtures, theme and body shell from the layout; the issue slug
+becomes the compiled identity, its title becomes the subject, and its preheader becomes the inbox
+preview. Frontmatter is returned separately and is not injected into layout inputs. Layout and issue
+nodes retain their own source files. `parseIssue` returns no usable nodes when it reports an error.
+
+`inspectMarkdownNode` from `@samva/markup/edit` resolves a rendered origin to editable prose and
+literal attributes. Pass `{ tag: "a" }` as its fourth argument to distinguish a link from a
+paragraph sharing its source origin; without a tag it prefers the editable element. Feed its
+property to `literalReplacement`, then call `applySourceReplacements`
+with `{ markdown: { file: "issues/october.md" } }` to validate the rewritten issue. Offsets are
+UTF-16, end-exclusive, and stale spans are refused. Prose edits retain ordinary punctuation;
+syntax delimiters are escaped only where they could change the authored structure, and literal
+line breaks or edge whitespace are encoded as character references.

package/dist/assets-BSpgZOSR.js

@@ -0,0 +1,61 @@
+//#region src/email/assets.ts
+/** Files a template may import, and what they are served as. */
+const ASSET_CONTENT_TYPES = {
+	".png": "image/png",
+	".jpg": "image/jpeg",
+	".jpeg": "image/jpeg",
+	".gif": "image/gif",
+	".webp": "image/webp",
+	".avif": "image/avif",
+	".svg": "image/svg+xml",
+	".ico": "image/x-icon",
+	".woff": "font/woff",
+	".woff2": "font/woff2",
+	".ttf": "font/ttf",
+	".otf": "font/otf",
+	".pdf": "application/pdf",
+	".txt": "text/plain"
+};
+const extensionOf = (path) => {
+	const dot = path.lastIndexOf(".");
+	return dot < 0 ? "" : path.slice(dot).toLowerCase();
+};
+/** True when the compiler turns this import into a content-addressed asset. */
+const isAssetPath = (path) => Object.hasOwn(ASSET_CONTENT_TYPES, extensionOf(path));
+const hex = (buffer) => Array.from(new Uint8Array(buffer), (byte) => byte.toString(16).padStart(2, "0")).join("");
+/** Address one file by its content. */
+const assetEntry = async (path, bytes) => {
+	const extension = extensionOf(path);
+	const view = new Uint8Array(bytes.byteLength);
+	view.set(bytes);
+	const digest = hex(await crypto.subtle.digest("SHA-256", view));
+	return {
+		path,
+		digest,
+		bytes: bytes.byteLength,
+		contentType: ASSET_CONTENT_TYPES[extension] ?? "application/octet-stream",
+		fileName: `${digest}${extension}`
+	};
+};
+/**
+* The URL an asset has under a base. The base is a build input: publication
+* passes its hosted origin, and a local export passes whatever it will serve
+* the exported files from.
+*/
+const assetUrl = (entry, base) => `${base.replace(/\/+$/, "")}/${entry.fileName}`;
+const EXTERNAL_IMAGE = /^https:\/\//i;
+/** Record, but never fetch, a URL the template points at. */
+const isExternalAsset = (reference) => EXTERNAL_IMAGE.test(reference);
+/**
+* Reject an asset base that would produce URLs a client will not load. The
+* relative forms are the ones a page on disk resolves against its own
+* directory, which is what a local export writes.
+*/
+const checkAssetBase = (base) => /^(https:\/\/|\.{1,2}\/|\/)/i.test(base) ? [] : [{
+	code: "invalid-asset-base",
+	severity: "error",
+	message: `Asset base ${JSON.stringify(base)} must be an https URL, an absolute path, or a relative path for a local export.`,
+	origins: []
+}];
+//#endregion
+export { isAssetPath as a, checkAssetBase as i, assetEntry as n, isExternalAsset as o, assetUrl as r, ASSET_CONTENT_TYPES as t };

package/dist/assets-k7_v3IOJ.d.ts

@@ -0,0 +1,39 @@
+import { n as EmailDiagnostic } from "./diagnostics-C3TSx6SU.js";
+//#region src/email/assets.d.ts
+/** Files a template may import, and what they are served as. */
+declare const ASSET_CONTENT_TYPES: Readonly<Record<string, string>>;
+interface AssetEntry {
+  /** Project-relative path the template imported. */
+  readonly path: string;
+  /** SHA-256 of the exact bytes, lowercase hex. */
+  readonly digest: string;
+  readonly bytes: number;
+  readonly contentType: string;
+  /** `<digest><ext>` — the name the asset has under any base. */
+  readonly fileName: string;
+}
+interface AssetManifest {
+  /** Where these assets are served from in this build. */
+  readonly base: string;
+  readonly assets: readonly AssetEntry[];
+}
+/** True when the compiler turns this import into a content-addressed asset. */
+declare const isAssetPath: (path: string) => boolean;
+/** Address one file by its content. */
+declare const assetEntry: (path: string, bytes: Uint8Array) => Promise<AssetEntry>;
+/**
+ * The URL an asset has under a base. The base is a build input: publication
+ * passes its hosted origin, and a local export passes whatever it will serve
+ * the exported files from.
+ */
+declare const assetUrl: (entry: AssetEntry, base: string) => string;
+/** Record, but never fetch, a URL the template points at. */
+declare const isExternalAsset: (reference: string) => boolean;
+/**
+ * Reject an asset base that would produce URLs a client will not load. The
+ * relative forms are the ones a page on disk resolves against its own
+ * directory, which is what a local export writes.
+ */
+declare const checkAssetBase: (base: string) => readonly EmailDiagnostic[];
+//#endregion
+export { assetUrl as a, isExternalAsset as c, assetEntry as i, AssetEntry as n, checkAssetBase as o, AssetManifest as r, isAssetPath as s, ASSET_CONTENT_TYPES as t };

package/dist/{assets-CS5Xa_mr.d.ts → brand-Bxb6Sm7y.d.ts}

@@ -1,6 +1,36 @@
-import { t as BrandPlugin } from "./brand-plugin-Dj9SMpfS.js";
-import { n as EmailDiagnostic } from "./diagnostics-D4vSLQrO.js";
-import { i as EmailNode } from "./jsx-runtime-DL8NVF1f.js";
+import { i as EmailNode } from "./jsx-runtime-HHfrVZEf.js";
+//#region src/email/brand-plugin.d.ts
+/**
+ * How a template reaches its brand and how the footer `BrandFooter` renders is
+ * marked for the send path that delivers it. The compiler and the IR renderer
+ * read every brand import, footer marker and unsubscribe link from the plugin
+ * a build passes; `samvaBrandPlugin` is the default.
+ */
+interface BrandPlugin {
+  /**
+   * The module and stylesheet specifier a template imports its brand from.
+   * `<specifier>/<slug>` names one brand; the bare specifier names the default.
+   */
+  readonly specifier: string;
+  /** Marks the block `BrandFooter` renders, so the send path finds a template's own footer. */
+  readonly footerAttribute: `data-${string}`;
+  /** Marks the footer row that carries the unsubscribe link, so a send can drop it. */
+  readonly unsubscribeRowAttribute: `data-${string}`;
+  /** The unsubscribe link's href; the send path substitutes each delivery's URL for it. */
+  readonly unsubscribeUrlPlaceholder: string;
+  /**
+   * Written on the unsubscribe link, so the send path delivers it without
+   * click tracking: a rewritten link would carry another recipient's token.
+   */
+  readonly noTrackAttribute: `data-${string}`;
+}
+/** The brand a specifier names: `undefined` slug means the default brand; `undefined` when it names none. */
+declare const parseBrandSpecifier: (specifier: string, options?: {
+  readonly brandPlugin?: BrandPlugin | undefined;
+}) => {
+  readonly slug: string | undefined;
+} | undefined;
+//#endregion
 //#region src/email/brand.d.ts
 interface EmailBrandAddress {
   readonly street1: string;
@@ -74,41 +104,4 @@ declare const withoutUnsubscribeRow: (rendered: {
   readonly text: string | undefined;
 };
 //#endregion
-//#region src/email/assets.d.ts
-/** Files a template may import, and what they are served as. */
-declare const ASSET_CONTENT_TYPES: Readonly<Record<string, string>>;
-interface AssetEntry {
-  /** Project-relative path the template imported. */
-  readonly path: string;
-  /** SHA-256 of the exact bytes, lowercase hex. */
-  readonly digest: string;
-  readonly bytes: number;
-  readonly contentType: string;
-  /** `<digest><ext>` — the name the asset has under any base. */
-  readonly fileName: string;
-}
-interface AssetManifest {
-  /** Where these assets are served from in this build. */
-  readonly base: string;
-  readonly assets: readonly AssetEntry[];
-}
-/** True when the compiler turns this import into a content-addressed asset. */
-declare const isAssetPath: (path: string) => boolean;
-/** Address one file by its content. */
-declare const assetEntry: (path: string, bytes: Uint8Array) => Promise<AssetEntry>;
-/**
- * The URL an asset has under a base. The base is a build input: publication
- * passes its hosted origin, and a local export passes whatever it will serve
- * the exported files from.
- */
-declare const assetUrl: (entry: AssetEntry, base: string) => string;
-/** Record, but never fetch, a URL the template points at. */
-declare const isExternalAsset: (reference: string) => boolean;
-/**
- * Reject an asset base that would produce URLs a client will not load. The
- * relative forms are the ones a page on disk resolves against its own
- * directory, which is what a local export writes.
- */
-declare const checkAssetBase: (base: string) => readonly EmailDiagnostic[];
-//#endregion
-export { EmailBrandSocialLink as _, assetUrl as a, renderedFooterMarkers as b, isExternalAsset as c, BrandFooterProps as d, BrandLogoProps as f, EmailBrandFooter as g, EmailBrandAssets as h, assetEntry as i, BRAND_COMPONENT_CLASSES as l, EmailBrandAddress as m, AssetEntry as n, checkAssetBase as o, EmailBrand as p, AssetManifest as r, isAssetPath as s, ASSET_CONTENT_TYPES as t, BrandComponents as u, RenderedFooterMarkers as v, withoutUnsubscribeRow as x, brandComponents as y };
+export { EmailBrand as a, EmailBrandFooter as c, brandComponents as d, renderedFooterMarkers as f, parseBrandSpecifier as h, BrandLogoProps as i, EmailBrandSocialLink as l, BrandPlugin as m, BrandComponents as n, EmailBrandAddress as o, withoutUnsubscribeRow as p, BrandFooterProps as r, EmailBrandAssets as s, BRAND_COMPONENT_CLASSES as t, RenderedFooterMarkers as u };

package/dist/brand.d.ts

@@ -1,5 +1,5 @@
-import { t as BrandPlugin } from "./brand-plugin-Dj9SMpfS.js";
-import { _ as EmailBrandSocialLink, a as assetUrl, b as renderedFooterMarkers, c as isExternalAsset, d as BrandFooterProps, f as BrandLogoProps, g as EmailBrandFooter, h as EmailBrandAssets, i as assetEntry, l as BRAND_COMPONENT_CLASSES, m as EmailBrandAddress, n as AssetEntry, o as checkAssetBase, p as EmailBrand, r as AssetManifest, s as isAssetPath, t as ASSET_CONTENT_TYPES, u as BrandComponents, v as RenderedFooterMarkers, x as withoutUnsubscribeRow, y as brandComponents } from "./assets-CS5Xa_mr.js";
+import { a as EmailBrand, c as EmailBrandFooter, d as brandComponents, f as renderedFooterMarkers, i as BrandLogoProps, l as EmailBrandSocialLink, m as BrandPlugin, n as BrandComponents, o as EmailBrandAddress, p as withoutUnsubscribeRow, r as BrandFooterProps, s as EmailBrandAssets, t as BRAND_COMPONENT_CLASSES, u as RenderedFooterMarkers } from "./brand-Bxb6Sm7y.js";
+import { a as assetUrl, c as isExternalAsset, i as assetEntry, n as AssetEntry, o as checkAssetBase, r as AssetManifest, s as isAssetPath, t as ASSET_CONTENT_TYPES } from "./assets-k7_v3IOJ.js";
 import { t as Diagnostic } from "./diagnostic-model-DxthUZBT.js";
 import { Result } from "better-result";
 //#region src/email/samva-brand-plugin.d.ts

package/dist/brand.js

@@ -1,4 +1,4 @@
-import { f as samvaBrandPlugin } from "./render-template-DwPDm3Hq.js";
-import { a as ASSET_CONTENT_TYPES, c as checkAssetBase, i as withoutUnsubscribeRow, l as isAssetPath, n as brandComponents, o as assetEntry, r as renderedFooterMarkers, s as assetUrl, t as BRAND_COMPONENT_CLASSES, u as isExternalAsset } from "./brand-CIiEqkU7.js";
-import { a as THEME_COLOR_ROLES, c as foregroundDefaults, i as THEME_COLORS, l as parseBrandCss, n as DEFAULT_THEME_CSS, o as THEME_TOKENS, r as FILL_COLORS, s as contrastForeground, t as DEFAULT_THEME, u as printBrandCss } from "./theme-css-P9F5S7Ic.js";
+import { B as brandComponents, H as withoutUnsubscribeRow, V as renderedFooterMarkers, et as samvaBrandPlugin, z as BRAND_COMPONENT_CLASSES } from "./components-DNBCz20_.js";
+import { a as isAssetPath, i as checkAssetBase, n as assetEntry, o as isExternalAsset, r as assetUrl, t as ASSET_CONTENT_TYPES } from "./assets-BSpgZOSR.js";
+import { a as THEME_COLOR_ROLES, c as foregroundDefaults, i as THEME_COLORS, l as parseBrandCss, n as DEFAULT_THEME_CSS, o as THEME_TOKENS, r as FILL_COLORS, s as contrastForeground, t as DEFAULT_THEME, u as printBrandCss } from "./theme-css-BujDuuEA.js";
 export { ASSET_CONTENT_TYPES, BRAND_COMPONENT_CLASSES, DEFAULT_THEME, DEFAULT_THEME_CSS, FILL_COLORS, THEME_COLORS, THEME_COLOR_ROLES, THEME_TOKENS, assetEntry, assetUrl, brandComponents, checkAssetBase, contrastForeground, foregroundDefaults, isAssetPath, isExternalAsset, parseBrandCss, printBrandCss, renderedFooterMarkers, samvaBrandPlugin, withoutUnsubscribeRow };

package/dist/compatibility.d.ts

@@ -1,7 +1,7 @@
-import { t as BrandPlugin } from "./brand-plugin-Dj9SMpfS.js";
-import { n as EmailDiagnostic } from "./diagnostics-D4vSLQrO.js";
-import { v as CompiledTemplate } from "./compiled-template-Bc4Dq9zy.js";
-import { r as EmittedPosition } from "./preview-rNoJBEIY.js";
+import { m as BrandPlugin } from "./brand-Bxb6Sm7y.js";
+import { n as EmailDiagnostic } from "./diagnostics-C3TSx6SU.js";
+import { G as EmailDegradation, K as SemanticComponentName, W as COMPONENT_DEGRADATIONS, q as componentDegradation, v as CompiledTemplate } from "./compiled-template-CPDHvFlt.js";
+import { r as EmittedPosition } from "./preview-DRLWgmfg.js";
 import { caniemail } from "caniemail";
 //#region src/email/compatibility.d.ts
 type CaniemailClient = Parameters<typeof caniemail>[0]["clients"][number];
@@ -62,6 +62,16 @@ declare const unknownCoverage: (titles: Iterable<string>) => readonly EmailDiagn
 declare const hasBlockingCompatibility: (findings: readonly EmailDiagnostic[]) => boolean;
 //#endregion
 //#region src/sml/compatibility.d.ts
+/** One authored component's content fidelity in email, independent of client presentation. */
+interface ComponentEmailDegradation extends EmailDegradation {
+  readonly component: SemanticComponentName;
+  readonly origins: EmailDiagnostic["origins"];
+}
+/**
+ * The document's declarations, including conditional branches. A declaration describes the
+ * component when used; fixture-specific client observations still come from the rendered HTML.
+ */
+declare const templateEmailDegradations: (template: CompiledTemplate) => readonly ComponentEmailDegradation[];
 /**
  * Check what each declared fixture delivers against the pinned client matrix. The rules run on the
  * rendered document, because what a client drops is what the compiler produced, and every finding
@@ -73,4 +83,4 @@ declare const checkCompatibility: (template: CompiledTemplate, fixtures: Readonl
   readonly brandPlugin?: BrandPlugin | undefined;
 }) => readonly EmailDiagnostic[];
 //#endregion
-export { COMPATIBILITY_PROVENANCE, type CompatibilityInput, type CompatibilityProvenance, EMAIL_CLIENT_MATRIX, ESSENTIAL_CONSTRUCTS, type EmailClientTarget, checkCompatibility, checkHtmlCompatibility, hasBlockingCompatibility, unknownCoverage };
+export { COMPATIBILITY_PROVENANCE, COMPONENT_DEGRADATIONS, type CompatibilityInput, type CompatibilityProvenance, type ComponentEmailDegradation, EMAIL_CLIENT_MATRIX, ESSENTIAL_CONSTRUCTS, type EmailClientTarget, type EmailDegradation, type SemanticComponentName, checkCompatibility, checkHtmlCompatibility, componentDegradation, hasBlockingCompatibility, templateEmailDegradations, unknownCoverage };

package/dist/compatibility.js

@@ -1,7 +1,7 @@
-import { r as renderEmail } from "./render-template-DwPDm3Hq.js";
-import { n as parseColor } from "./css-color-DLM12Osu.js";
-import { n as matchesSelector } from "./selectors-CYWCoxZr.js";
-import { t as parseStylesheet } from "./css-B_aVKrDo.js";
+import { A as renderEmail, K as isValueNode, U as COMPONENT_DEGRADATIONS, W as componentDegradation } from "./components-DNBCz20_.js";
+import { o as parseColor } from "./dark-scheme-BGDCCaUq.js";
+import { n as matchesSelector, r as parseStylesheet } from "./selectors-CKGuc9MO.js";
+import { t as DIAGNOSTIC_CODES } from "./diagnostic-codes-BCwfUgnF.js";
 import { generate, parse, walk } from "css-tree";
 import { caniemail, parseHtml, rawData } from "caniemail";
 //#region src/email/compatibility-assessment.ts
@@ -768,6 +768,48 @@ const hasBlockingCompatibility = (findings) => findings.some((finding) => findin
 //#endregion
 //#region src/sml/compatibility.ts
 /**
+* The document's declarations, including conditional branches. A declaration describes the
+* component when used; fixture-specific client observations still come from the rendered HTML.
+*/
+const templateEmailDegradations = (template) => {
+	if (template.email === void 0) return [];
+	const declarations = [];
+	const pending = [template.email.body];
+	const seen = /* @__PURE__ */ new Set();
+	while (pending.length > 0) {
+		const node = pending.pop();
+		if (isValueNode(node) || seen.has(node)) continue;
+		seen.add(node);
+		if ("type" in node && node.type === "component") {
+			const src = node.src;
+			declarations.push({
+				component: node.name,
+				...componentDegradation(node.name),
+				origins: src === void 0 ? [] : [{
+					fileName: template.sources?.[src[2] ?? 0] ?? "",
+					lineNumber: src[0],
+					columnNumber: src[1]
+				}]
+			});
+		}
+		if ("if" in node) pending.push(...[...node.then, ...node.else ?? []].reverse());
+		else if ("children" in node) pending.push(...(node.children ?? []).toReversed());
+	}
+	return declarations;
+};
+/** Translate content losses into the same located report as HTML compatibility findings. */
+const degradationFindings = (declarations) => declarations.flatMap((declaration) => declaration.kind === "same" ? [] : [{
+	code: "email-component-degradation",
+	severity: "warning",
+	message: `<${declaration.component}>: ${declaration.note}`,
+	origins: declaration.origins,
+	notes: DIAGNOSTIC_CODES["email-component-degradation"].fix,
+	compatibility: {
+		assessment: "degradation",
+		title: declaration.note
+	}
+}]);
+/**
 * Check what each declared fixture delivers against the pinned client matrix. The rules run on the
 * rendered document, because what a client drops is what the compiler produced, and every finding
 * is located at the source of the element that produced it. A fixture the renderer refuses throws
@@ -801,7 +843,8 @@ const checkCompatibility = (template, fixtures, options = {}) => {
 			...options.clients === void 0 ? {} : { clients: options.clients }
 		}));
 	}
+	findings.push(...degradationFindings(templateEmailDegradations(template)));
 	return findings;
 };
 //#endregion
-export { COMPATIBILITY_PROVENANCE, EMAIL_CLIENT_MATRIX, ESSENTIAL_CONSTRUCTS, checkCompatibility, checkHtmlCompatibility, hasBlockingCompatibility, unknownCoverage };
+export { COMPATIBILITY_PROVENANCE, COMPONENT_DEGRADATIONS, EMAIL_CLIENT_MATRIX, ESSENTIAL_CONSTRUCTS, checkCompatibility, checkHtmlCompatibility, componentDegradation, hasBlockingCompatibility, templateEmailDegradations, unknownCoverage };