@skhema/embed 0.1.9 → 0.1.10

package/dist/styles/design-tokens.d.ts

@@ -31,6 +31,38 @@ export declare const COMPONENT_COLORS: {
     };
 };
 export type ComponentColorKey = keyof typeof COMPONENT_COLORS;
+/**
+ * Email-safe flat hex palette for the card surface, per theme. These mirror the
+ * Tailwind slate values behind the `CARD_VARS` HSL tokens, pre-resolved to hex
+ * because email clients ignore `<style>` / CSS vars. The card renderer
+ * (`@skhema/embed/render`) inlines these so the live browser embed and email
+ * share one colour system (see the "converge on hex" decision).
+ */
+export declare const CARD_PALETTE: {
+    readonly light: {
+        readonly cardBg: "#ffffff";
+        readonly border: "#e2e8f0";
+        readonly text: "#020817";
+        readonly textMuted: "#64748b";
+    };
+    readonly dark: {
+        readonly cardBg: "#020817";
+        readonly border: "#1e293b";
+        readonly text: "#f8fafc";
+        readonly textMuted: "#94a3b8";
+    };
+};
+export type CardTheme = keyof typeof CARD_PALETTE;
+/** Save-button brand colours (hex) — match the `--skhema-primary*` HSL tokens. */
+export declare const PRIMARY_HEX = "#cd476a";
+export declare const PRIMARY_HOVER_HEX = "#b53d5e";
+export declare const PRIMARY_PRESSED_HEX = "#9d3552";
+/** Card geometry / typography shared by the renderer and the browser embed. */
+export declare const CARD_RADIUS = "4px";
+export declare const CARD_SHADOW = "0 1px 3px 0 rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1)";
+export declare const CARD_SHADOW_LG = "0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)";
+export declare const FONT_STACK = "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Inter', sans-serif";
+export declare const MONO_STACK = "ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace";
 /**
  * Shared base card CSS variables for light and dark modes.
  */
@@ -54,10 +86,6 @@ export declare const CARD_VARS: {
         readonly '--skhema-surface-subtle': "hsl(217.2 32.6% 12%)";
     };
 };
-/**
- * Shared card structure styles (used by both SkhemaElement and SkhemaComponent).
- */
-export declare const SHARED_CARD_STYLES = "\n/* Monospace acronym badge */\n.skhema-acronym-badge {\n  display: inline-flex;\n  align-items: center;\n  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;\n  font-size: 10px;\n  font-weight: 600;\n  padding: 2px 6px;\n  border-radius: 2px;\n  letter-spacing: 0.02em;\n  flex-shrink: 0;\n}\n\n/* Footer attribution tagline */\n.skhema-footer-attribution {\n  font-size: 11px;\n  color: var(--skhema-text-muted);\n  line-height: 1.4;\n}\n\n.skhema-footer-attribution a {\n  color: var(--skhema-text-muted);\n  text-decoration: underline;\n  text-decoration-color: var(--skhema-border);\n  text-underline-offset: 2px;\n}\n\n.skhema-footer-attribution a:hover {\n  color: var(--skhema-text);\n}\n\n/* Contributor line in footer */\n.skhema-contributor-line {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 12px;\n  color: var(--skhema-text-muted);\n}\n\n.skhema-contributor-line svg {\n  width: 14px;\n  height: 14px;\n  flex-shrink: 0;\n}\n\n.skhema-author-link {\n  color: inherit;\n  text-decoration: none;\n}\n\n.skhema-author-link:hover {\n  color: var(--skhema-text);\n  text-decoration: underline;\n}\n\n/* Save button \u2014 primary brand color */\n.skhema-save-btn {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  background: var(--skhema-primary);\n  color: white;\n  border: none;\n  padding: 6px 14px;\n  border-radius: calc(var(--skhema-radius) + 2px);\n  font-size: 12px;\n  font-weight: 500;\n  text-decoration: none;\n  cursor: pointer;\n  transition: background 0.15s ease;\n  white-space: nowrap;\n}\n\n.skhema-save-btn:hover {\n  background: var(--skhema-primary-hover);\n}\n\n.skhema-save-btn:active {\n  background: var(--skhema-primary-pressed);\n}\n\n.skhema-save-btn:focus {\n  outline: 2px solid var(--skhema-primary);\n  outline-offset: 2px;\n}\n\n.skhema-save-btn::after {\n  content: '\\2192';\n  font-size: 13px;\n}\n";
 /**
  * User SVG icon (inline, no external deps).
  */

package/dist/styles/design-tokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"design-tokens.d.ts","sourceRoot":"","sources":["../../src/styles/design-tokens.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BnB,CAAA;AAEV,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,gBAAgB,CAAA;AAE7D;;GAEG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;CAmBZ,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,kBAAkB,m4DA4F9B,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,kRAA4P,CAAA"}
+{"version":3,"file":"design-tokens.d.ts","sourceRoot":"","sources":["../../src/styles/design-tokens.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BnB,CAAA;AAEV,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,gBAAgB,CAAA;AAE7D;;;;;;GAMG;AACH,eAAO,MAAM,YAAY;;;;;;;;;;;;;CAaf,CAAA;AAEV,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,YAAY,CAAA;AAEjD,kFAAkF;AAClF,eAAO,MAAM,WAAW,YAAY,CAAA;AACpC,eAAO,MAAM,iBAAiB,YAAY,CAAA;AAC1C,eAAO,MAAM,mBAAmB,YAAY,CAAA;AAE5C,+EAA+E;AAC/E,eAAO,MAAM,WAAW,QAAQ,CAAA;AAChC,eAAO,MAAM,WAAW,gEACuC,CAAA;AAC/D,eAAO,MAAM,cAAc,qEACyC,CAAA;AACpE,eAAO,MAAM,UAAU,iFACyD,CAAA;AAChF,eAAO,MAAM,UAAU,wEACgD,CAAA;AAEvE;;GAEG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;CAmBZ,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,aAAa,kRAA4P,CAAA"}

package/dist/tokens.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const validation = require("./validation-CNWaQfh_.cjs");
+const validation = require("./validation-DCw9rQeH.cjs");
 exports.CARD_VARS = validation.CARD_VARS;
 exports.COMPONENT_COLORS = validation.COMPONENT_COLORS;
 exports.USER_ICON_SVG = validation.USER_ICON_SVG;

package/dist/tokens.d.ts

@@ -10,7 +10,7 @@
  *
  * Everything re-exported below is pure (no DOM, no side effects).
  */
-export { COMPONENT_COLORS, CARD_VARS, USER_ICON_SVG, } from './styles/design-tokens.js';
+export { CARD_VARS, COMPONENT_COLORS, USER_ICON_SVG, } from './styles/design-tokens.js';
 export type { ComponentColorKey } from './styles/design-tokens.js';
 export { getComponentTypeAcronym, getComponentTypeLabel, getElementTypesForComponent, isValidComponentType, resolveComponentType, validateElementBelongsToComponent, } from './utils/component-validation.js';
 export { getElementTypeAcronym, getElementTypeLabel, isValidElementType, } from './utils/validation.js';

package/dist/tokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EACL,gBAAgB,EAChB,SAAS,EACT,aAAa,GACd,MAAM,2BAA2B,CAAA;AAClC,YAAY,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAA;AAElE,OAAO,EACL,uBAAuB,EACvB,qBAAqB,EACrB,2BAA2B,EAC3B,oBAAoB,EACpB,oBAAoB,EACpB,iCAAiC,GAClC,MAAM,iCAAiC,CAAA;AAExC,OAAO,EACL,qBAAqB,EACrB,mBAAmB,EACnB,kBAAkB,GACnB,MAAM,uBAAuB,CAAA"}
+{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EACL,SAAS,EACT,gBAAgB,EAChB,aAAa,GACd,MAAM,2BAA2B,CAAA;AAClC,YAAY,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAA;AAElE,OAAO,EACL,uBAAuB,EACvB,qBAAqB,EACrB,2BAA2B,EAC3B,oBAAoB,EACpB,oBAAoB,EACpB,iCAAiC,GAClC,MAAM,iCAAiC,CAAA;AAExC,OAAO,EACL,qBAAqB,EACrB,mBAAmB,EACnB,kBAAkB,GACnB,MAAM,uBAAuB,CAAA"}

package/dist/tokens.es.js

@@ -1,4 +1,4 @@
-import { C, a, U, g, b, c, d, e, i, f, r, v } from "./validation-MSiRF5Wt.js";
+import { C, a, U, g, b, c, d, e, i, f, r, v } from "./validation-Dt4L_df8.js";
 export {
   C as CARD_VARS,
   a as COMPONENT_COLORS,

package/dist/utils/color.d.ts

@@ -0,0 +1,25 @@
+/**
+ * DOM-free colour utilities for the email-safe card renderer.
+ *
+ * The card palette (`COMPONENT_COLORS`) is authored in `oklch()` for the live
+ * browser embed, but email clients can't parse `oklch()` and `<style>` is
+ * stripped, so every colour must be a pre-computed sRGB hex with all styles
+ * inlined. This converts a single `oklch(...)` token to hex, compositing any
+ * alpha over a flat background (white for light cards, the dark card surface
+ * for dark cards) so the result is opaque and email-safe.
+ *
+ * This is the single source of the conversion that `sk comms curated` and the
+ * `CuratedElements` email template previously duplicated.
+ */
+/** Brand pink (hsl(344 57% 54%)) — fallback when a component palette is missing. */
+export declare const BRAND_PINK = "#cd476a";
+/**
+ * Convert a single `oklch(...)` token to an email-safe sRGB hex. When the token
+ * carries an alpha (e.g. the badge `bg` @ 0.15 / `border` @ 0.3), the colour is
+ * composited over `overHex` so the result is a flat opaque hex.
+ *
+ * @param token  An `oklch(L C H)` or `oklch(L C H / A)` string.
+ * @param overHex The flat background to composite alpha over (default white).
+ */
+export declare function oklchToHex(token: string, overHex?: string): string;
+//# sourceMappingURL=color.d.ts.map

package/dist/utils/color.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../src/utils/color.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,oFAAoF;AACpF,eAAO,MAAM,UAAU,YAAY,CAAA;AAWnC;;;;;;;GAOG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,SAAY,GAAG,MAAM,CAqCrE"}

package/dist/utils/sanitization.d.ts

@@ -1,5 +1,11 @@
 /**
- * Content sanitization utilities for Skhema web component
+ * Content sanitization utilities for Skhema cards.
+ *
+ * DOM-free by design: `sanitizeContent` is imported by the email-safe card
+ * renderer (`@skhema/embed/render`), which must run in Node / email / CLI
+ * runtimes with no `document`. Keep every export here free of DOM access at
+ * call time (the legacy `stripHtml` below is the one exception and is not used
+ * by the renderer).
  */
 /**
  * Sanitizes content to prevent XSS attacks and removes URLs

package/dist/utils/sanitization.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sanitization.d.ts","sourceRoot":"","sources":["../../src/utils/sanitization.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAqBvD;AA4DD;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,OAAO,EAAE,MAAM,GAAG;IACxD,QAAQ,EAAE,OAAO,CAAA;IACjB,MAAM,EAAE,MAAM,EAAE,CAAA;CACjB,CAqCA;AAED;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAIjD;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAUrD"}
+{"version":3,"file":"sanitization.d.ts","sourceRoot":"","sources":["../../src/utils/sanitization.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAcH;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAcvD;AA4DD;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,OAAO,EAAE,MAAM,GAAG;IACxD,QAAQ,EAAE,OAAO,CAAA;IACjB,MAAM,EAAE,MAAM,EAAE,CAAA;CACjB,CAqCA;AAED;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAIjD;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAUrD"}

package/dist/{validation-CNWaQfh_.cjs → validation-DCw9rQeH.cjs}

@@ -27,6 +27,36 @@ const COMPONENT_COLORS = {
     border: "oklch(0.65 0.06 65 / 0.3)"
   }
 };
+const CARD_PALETTE = {
+  light: {
+    cardBg: "#ffffff",
+    // hsl(0 0% 100%)
+    border: "#e2e8f0",
+    // hsl(214.3 31.8% 91.4%) — slate-200
+    text: "#020817",
+    // hsl(222.2 84% 4.9%)  — slate-950
+    textMuted: "#64748b"
+    // hsl(215.4 16.3% 46.9%) — slate-500
+  },
+  dark: {
+    cardBg: "#020817",
+    // hsl(222.2 84% 4.9%)  — slate-950
+    border: "#1e293b",
+    // hsl(217.2 32.6% 17.5%) — slate-800
+    text: "#f8fafc",
+    // hsl(210 40% 98%)     — slate-50
+    textMuted: "#94a3b8"
+    // hsl(215 20.2% 65.1%)  — slate-400
+  }
+};
+const PRIMARY_HEX = "#cd476a";
+const PRIMARY_HOVER_HEX = "#b53d5e";
+const PRIMARY_PRESSED_HEX = "#9d3552";
+const CARD_RADIUS = "4px";
+const CARD_SHADOW = "0 1px 3px 0 rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1)";
+const CARD_SHADOW_LG = "0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)";
+const FONT_STACK = "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Inter', sans-serif";
+const MONO_STACK = "ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace";
 const CARD_VARS = {
   light: {
     "--skhema-bg": "hsl(0 0% 100%)",
@@ -47,99 +77,6 @@ const CARD_VARS = {
     "--skhema-surface-subtle": "hsl(217.2 32.6% 12%)"
   }
 };
-const SHARED_CARD_STYLES = `
-/* Monospace acronym badge */
-.skhema-acronym-badge {
-  display: inline-flex;
-  align-items: center;
-  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
-  font-size: 10px;
-  font-weight: 600;
-  padding: 2px 6px;
-  border-radius: 2px;
-  letter-spacing: 0.02em;
-  flex-shrink: 0;
-}
-
-/* Footer attribution tagline */
-.skhema-footer-attribution {
-  font-size: 11px;
-  color: var(--skhema-text-muted);
-  line-height: 1.4;
-}
-
-.skhema-footer-attribution a {
-  color: var(--skhema-text-muted);
-  text-decoration: underline;
-  text-decoration-color: var(--skhema-border);
-  text-underline-offset: 2px;
-}
-
-.skhema-footer-attribution a:hover {
-  color: var(--skhema-text);
-}
-
-/* Contributor line in footer */
-.skhema-contributor-line {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-size: 12px;
-  color: var(--skhema-text-muted);
-}
-
-.skhema-contributor-line svg {
-  width: 14px;
-  height: 14px;
-  flex-shrink: 0;
-}
-
-.skhema-author-link {
-  color: inherit;
-  text-decoration: none;
-}
-
-.skhema-author-link:hover {
-  color: var(--skhema-text);
-  text-decoration: underline;
-}
-
-/* Save button — primary brand color */
-.skhema-save-btn {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-  background: var(--skhema-primary);
-  color: white;
-  border: none;
-  padding: 6px 14px;
-  border-radius: calc(var(--skhema-radius) + 2px);
-  font-size: 12px;
-  font-weight: 500;
-  text-decoration: none;
-  cursor: pointer;
-  transition: background 0.15s ease;
-  white-space: nowrap;
-}
-
-.skhema-save-btn:hover {
-  background: var(--skhema-primary-hover);
-}
-
-.skhema-save-btn:active {
-  background: var(--skhema-primary-pressed);
-}
-
-.skhema-save-btn:focus {
-  outline: 2px solid var(--skhema-primary);
-  outline-offset: 2px;
-}
-
-.skhema-save-btn::after {
-  content: '\\2192';
-  font-size: 13px;
-}
-`;
 const USER_ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>`;
 function isValidComponentType(componentType) {
   const validTypes = Object.values(types.COMPONENT_TYPES).map((t) => t.value);
@@ -214,9 +151,17 @@ function getElementTypeAcronym(elementType) {
   const type = Object.values(types.ELEMENT_TYPES).find((t) => t.value === elementType);
   return type?.acronym || elementType.substring(0, 2).toUpperCase();
 }
+exports.CARD_PALETTE = CARD_PALETTE;
+exports.CARD_RADIUS = CARD_RADIUS;
+exports.CARD_SHADOW = CARD_SHADOW;
+exports.CARD_SHADOW_LG = CARD_SHADOW_LG;
 exports.CARD_VARS = CARD_VARS;
 exports.COMPONENT_COLORS = COMPONENT_COLORS;
-exports.SHARED_CARD_STYLES = SHARED_CARD_STYLES;
+exports.FONT_STACK = FONT_STACK;
+exports.MONO_STACK = MONO_STACK;
+exports.PRIMARY_HEX = PRIMARY_HEX;
+exports.PRIMARY_HOVER_HEX = PRIMARY_HOVER_HEX;
+exports.PRIMARY_PRESSED_HEX = PRIMARY_PRESSED_HEX;
 exports.USER_ICON_SVG = USER_ICON_SVG;
 exports.getComponentTypeAcronym = getComponentTypeAcronym;
 exports.getComponentTypeLabel = getComponentTypeLabel;
@@ -228,4 +173,4 @@ exports.isValidElementType = isValidElementType;
 exports.resolveComponentType = resolveComponentType;
 exports.validateAttributes = validateAttributes;
 exports.validateElementBelongsToComponent = validateElementBelongsToComponent;
-//# sourceMappingURL=validation-CNWaQfh_.cjs.map
+//# sourceMappingURL=validation-DCw9rQeH.cjs.map

package/dist/validation-DCw9rQeH.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"validation-DCw9rQeH.cjs","sources":["../src/styles/design-tokens.ts","../src/utils/component-validation.ts","../src/utils/validation.ts"],"sourcesContent":["/**\n * Hardcoded color tokens for component-type badge colors.\n * Embeds can't rely on host page CSS vars, so we use inline values.\n * Source: skhema-web/src/app/globals.css oklch tokens converted to HSL-ish for browser compat.\n */\n\nexport const COMPONENT_COLORS = {\n  diagnosis: {\n    bg: 'oklch(0.65 0.06 25 / 0.15)',\n    text: 'oklch(0.65 0.06 25)',\n    border: 'oklch(0.65 0.06 25 / 0.3)',\n  },\n  method: {\n    bg: 'oklch(0.6 0.06 250 / 0.15)',\n    text: 'oklch(0.6 0.06 250)',\n    border: 'oklch(0.6 0.06 250 / 0.3)',\n  },\n  initiatives: {\n    bg: 'oklch(0.6 0.06 155 / 0.15)',\n    text: 'oklch(0.6 0.06 155)',\n    border: 'oklch(0.6 0.06 155 / 0.3)',\n  },\n  measures: {\n    bg: 'oklch(0.6 0.06 300 / 0.15)',\n    text: 'oklch(0.6 0.06 300)',\n    border: 'oklch(0.6 0.06 300 / 0.3)',\n  },\n  support: {\n    bg: 'oklch(0.65 0.06 65 / 0.15)',\n    text: 'oklch(0.65 0.06 65)',\n    border: 'oklch(0.65 0.06 65 / 0.3)',\n  },\n} as const\n\nexport type ComponentColorKey = keyof typeof COMPONENT_COLORS\n\n/**\n * Email-safe flat hex palette for the card surface, per theme. These mirror the\n * Tailwind slate values behind the `CARD_VARS` HSL tokens, pre-resolved to hex\n * because email clients ignore `<style>` / CSS vars. The card renderer\n * (`@skhema/embed/render`) inlines these so the live browser embed and email\n * share one colour system (see the \"converge on hex\" decision).\n */\nexport const CARD_PALETTE = {\n  light: {\n    cardBg: '#ffffff', // hsl(0 0% 100%)\n    border: '#e2e8f0', // hsl(214.3 31.8% 91.4%) — slate-200\n    text: '#020817', // hsl(222.2 84% 4.9%)  — slate-950\n    textMuted: '#64748b', // hsl(215.4 16.3% 46.9%) — slate-500\n  },\n  dark: {\n    cardBg: '#020817', // hsl(222.2 84% 4.9%)  — slate-950\n    border: '#1e293b', // hsl(217.2 32.6% 17.5%) — slate-800\n    text: '#f8fafc', // hsl(210 40% 98%)     — slate-50\n    textMuted: '#94a3b8', // hsl(215 20.2% 65.1%)  — slate-400\n  },\n} as const\n\nexport type CardTheme = keyof typeof CARD_PALETTE\n\n/** Save-button brand colours (hex) — match the `--skhema-primary*` HSL tokens. */\nexport const PRIMARY_HEX = '#cd476a' // hsl(344 57% 54%)\nexport const PRIMARY_HOVER_HEX = '#b53d5e' // hsl(344 50% 47%)\nexport const PRIMARY_PRESSED_HEX = '#9d3552' // hsl(343 50% 41%)\n\n/** Card geometry / typography shared by the renderer and the browser embed. */\nexport const CARD_RADIUS = '4px' // calc(0.1rem + 2px) ≈ 3.6px\nexport const CARD_SHADOW =\n  '0 1px 3px 0 rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1)'\nexport const CARD_SHADOW_LG =\n  '0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)'\nexport const FONT_STACK =\n  \"-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Inter', sans-serif\"\nexport const MONO_STACK =\n  \"ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace\"\n\n/**\n * Shared base card CSS variables for light and dark modes.\n */\nexport const CARD_VARS = {\n  light: {\n    '--skhema-bg': 'hsl(0 0% 100%)',\n    '--skhema-card': 'hsl(0 0% 100%)',\n    '--skhema-border': 'hsl(214.3 31.8% 91.4%)',\n    '--skhema-text': 'hsl(222.2 84% 4.9%)',\n    '--skhema-text-muted': 'hsl(215.4 16.3% 46.9%)',\n    '--skhema-accent': 'hsl(210 40% 96%)',\n    '--skhema-surface-subtle': 'hsl(210 40% 97%)',\n  },\n  dark: {\n    '--skhema-bg': 'hsl(222.2 84% 4.9%)',\n    '--skhema-card': 'hsl(222.2 84% 4.9%)',\n    '--skhema-border': 'hsl(217.2 32.6% 17.5%)',\n    '--skhema-text': 'hsl(210 40% 98%)',\n    '--skhema-text-muted': 'hsl(215 20.2% 65.1%)',\n    '--skhema-accent': 'hsl(217.2 32.6% 17.5%)',\n    '--skhema-surface-subtle': 'hsl(217.2 32.6% 12%)',\n  },\n} as const\n\n/**\n * User SVG icon (inline, no external deps).\n */\nexport const USER_ICON_SVG = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2\"/><circle cx=\"12\" cy=\"7\" r=\"4\"/></svg>`\n","import type { ComponentValue, ElementValue } from '@skhema/types'\nimport { COMPONENT_TYPES, SKHEMA_MAPPING } from '@skhema/types'\n\n/**\n * Validate that a string is a valid component type.\n */\nexport function isValidComponentType(\n  componentType: string\n): componentType is ComponentValue {\n  const validTypes = Object.values(COMPONENT_TYPES).map((t) => t.value)\n  return validTypes.includes(componentType as ComponentValue)\n}\n\n/**\n * Validate that an element type belongs to the given component type.\n */\nexport function validateElementBelongsToComponent(\n  elementType: string,\n  componentType: string\n): boolean {\n  if (!isValidComponentType(componentType)) return false\n\n  const validElements =\n    SKHEMA_MAPPING.elementFlow[\n      componentType as keyof typeof SKHEMA_MAPPING.elementFlow\n    ]\n  if (!validElements) return false\n\n  return validElements.some((e) => e.value === elementType)\n}\n\n/**\n * Get the human-readable label for a component type.\n */\nexport function getComponentTypeLabel(componentType: string): string {\n  const type = Object.values(COMPONENT_TYPES).find(\n    (t) => t.value === componentType\n  )\n  return type?.label || componentType\n}\n\n/**\n * Get the acronym for a component type (e.g., 'BD' for diagnosis).\n */\nexport function getComponentTypeAcronym(componentType: string): string {\n  const type = Object.values(COMPONENT_TYPES).find(\n    (t) => t.value === componentType\n  )\n  return type?.acronym || componentType.substring(0, 2).toUpperCase()\n}\n\n/**\n * Resolve which component type an element belongs to.\n * Returns the component value, or 'diagnosis' as fallback.\n */\nexport function resolveComponentType(elementType: string): ComponentValue {\n  for (const [componentValue, elements] of Object.entries(\n    SKHEMA_MAPPING.elementFlow\n  )) {\n    if (elements.some((e) => e.value === elementType)) {\n      return componentValue as ComponentValue\n    }\n  }\n  return 'diagnosis'\n}\n\n/**\n * Get all valid element types for a given component, ordered per the mapping.\n */\nexport function getElementTypesForComponent(\n  componentType: string\n): ElementValue[] {\n  if (!isValidComponentType(componentType)) return []\n  const elements =\n    SKHEMA_MAPPING.elementFlow[\n      componentType as keyof typeof SKHEMA_MAPPING.elementFlow\n    ]\n  return elements?.map((e) => e.value) || []\n}\n","import type { ElementValue } from '@skhema/types'\nimport { ELEMENT_TYPES } from '@skhema/types'\n\nexport function isValidElementType(\n  elementType: string\n): elementType is ElementValue {\n  const validTypes = Object.values(ELEMENT_TYPES).map((type) => type.value)\n  return validTypes.includes(elementType as ElementValue)\n}\n\nexport function validateAttributes(element: HTMLElement): {\n  isValid: boolean\n  errors: string[]\n  elementType?: ElementValue\n  contributorId?: string\n} {\n  const errors: string[] = []\n\n  const elementType = element.getAttribute('element-type')\n  const contributorId = element.getAttribute('contributor-id')\n\n  if (!elementType) {\n    errors.push('Missing required attribute: element-type')\n  } else if (!isValidElementType(elementType)) {\n    const validTypes = Object.values(ELEMENT_TYPES)\n      .map((t) => t.value)\n      .join(', ')\n    errors.push(\n      `Invalid element-type \"${elementType}\". Valid types: ${validTypes}`\n    )\n  }\n\n  if (!contributorId) {\n    errors.push('Missing required attribute: contributor-id')\n  } else if (contributorId.trim().length === 0) {\n    errors.push('contributor-id cannot be empty')\n  }\n\n  return {\n    isValid: errors.length === 0,\n    errors,\n    elementType: isValidElementType(elementType || '')\n      ? (elementType as ElementValue)\n      : undefined,\n    contributorId: contributorId || undefined,\n  }\n}\n\nexport function getElementTypeLabel(elementType: ElementValue): string {\n  const type = Object.values(ELEMENT_TYPES).find((t) => t.value === elementType)\n  return type?.label || elementType\n}\n\nexport function getElementTypeAcronym(elementType: ElementValue): string {\n  const type = Object.values(ELEMENT_TYPES).find((t) => t.value === elementType)\n  return type?.acronym || elementType.substring(0, 2).toUpperCase()\n}\n"],"names":["COMPONENT_TYPES","SKHEMA_MAPPING","ELEMENT_TYPES"],"mappings":"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"}

package/dist/{validation-MSiRF5Wt.js → validation-Dt4L_df8.js}

@@ -1,4 +1,4 @@
-import { SKHEMA_MAPPING, COMPONENT_TYPES, ELEMENT_TYPES } from "@skhema/types";
+import { COMPONENT_TYPES, SKHEMA_MAPPING, ELEMENT_TYPES } from "@skhema/types";
 const COMPONENT_COLORS = {
   diagnosis: {
     bg: "oklch(0.65 0.06 25 / 0.15)",
@@ -26,6 +26,36 @@ const COMPONENT_COLORS = {
     border: "oklch(0.65 0.06 65 / 0.3)"
   }
 };
+const CARD_PALETTE = {
+  light: {
+    cardBg: "#ffffff",
+    // hsl(0 0% 100%)
+    border: "#e2e8f0",
+    // hsl(214.3 31.8% 91.4%) — slate-200
+    text: "#020817",
+    // hsl(222.2 84% 4.9%)  — slate-950
+    textMuted: "#64748b"
+    // hsl(215.4 16.3% 46.9%) — slate-500
+  },
+  dark: {
+    cardBg: "#020817",
+    // hsl(222.2 84% 4.9%)  — slate-950
+    border: "#1e293b",
+    // hsl(217.2 32.6% 17.5%) — slate-800
+    text: "#f8fafc",
+    // hsl(210 40% 98%)     — slate-50
+    textMuted: "#94a3b8"
+    // hsl(215 20.2% 65.1%)  — slate-400
+  }
+};
+const PRIMARY_HEX = "#cd476a";
+const PRIMARY_HOVER_HEX = "#b53d5e";
+const PRIMARY_PRESSED_HEX = "#9d3552";
+const CARD_RADIUS = "4px";
+const CARD_SHADOW = "0 1px 3px 0 rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1)";
+const CARD_SHADOW_LG = "0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)";
+const FONT_STACK = "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Inter', sans-serif";
+const MONO_STACK = "ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace";
 const CARD_VARS = {
   light: {
     "--skhema-bg": "hsl(0 0% 100%)",
@@ -46,99 +76,6 @@ const CARD_VARS = {
     "--skhema-surface-subtle": "hsl(217.2 32.6% 12%)"
   }
 };
-const SHARED_CARD_STYLES = `
-/* Monospace acronym badge */
-.skhema-acronym-badge {
-  display: inline-flex;
-  align-items: center;
-  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
-  font-size: 10px;
-  font-weight: 600;
-  padding: 2px 6px;
-  border-radius: 2px;
-  letter-spacing: 0.02em;
-  flex-shrink: 0;
-}
-
-/* Footer attribution tagline */
-.skhema-footer-attribution {
-  font-size: 11px;
-  color: var(--skhema-text-muted);
-  line-height: 1.4;
-}
-
-.skhema-footer-attribution a {
-  color: var(--skhema-text-muted);
-  text-decoration: underline;
-  text-decoration-color: var(--skhema-border);
-  text-underline-offset: 2px;
-}
-
-.skhema-footer-attribution a:hover {
-  color: var(--skhema-text);
-}
-
-/* Contributor line in footer */
-.skhema-contributor-line {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-size: 12px;
-  color: var(--skhema-text-muted);
-}
-
-.skhema-contributor-line svg {
-  width: 14px;
-  height: 14px;
-  flex-shrink: 0;
-}
-
-.skhema-author-link {
-  color: inherit;
-  text-decoration: none;
-}
-
-.skhema-author-link:hover {
-  color: var(--skhema-text);
-  text-decoration: underline;
-}
-
-/* Save button — primary brand color */
-.skhema-save-btn {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-  background: var(--skhema-primary);
-  color: white;
-  border: none;
-  padding: 6px 14px;
-  border-radius: calc(var(--skhema-radius) + 2px);
-  font-size: 12px;
-  font-weight: 500;
-  text-decoration: none;
-  cursor: pointer;
-  transition: background 0.15s ease;
-  white-space: nowrap;
-}
-
-.skhema-save-btn:hover {
-  background: var(--skhema-primary-hover);
-}
-
-.skhema-save-btn:active {
-  background: var(--skhema-primary-pressed);
-}
-
-.skhema-save-btn:focus {
-  outline: 2px solid var(--skhema-primary);
-  outline-offset: 2px;
-}
-
-.skhema-save-btn::after {
-  content: '\\2192';
-  font-size: 13px;
-}
-`;
 const USER_ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>`;
 function isValidComponentType(componentType) {
   const validTypes = Object.values(COMPONENT_TYPES).map((t) => t.value);
@@ -215,7 +152,9 @@ function getElementTypeAcronym(elementType) {
 }
 export {
   CARD_VARS as C,
-  SHARED_CARD_STYLES as S,
+  FONT_STACK as F,
+  MONO_STACK as M,
+  PRIMARY_HEX as P,
   USER_ICON_SVG as U,
   COMPONENT_COLORS as a,
   getComponentTypeLabel as b,
@@ -224,9 +163,15 @@ export {
   getElementTypesForComponent as e,
   isValidElementType as f,
   getComponentTypeAcronym as g,
-  validateAttributes as h,
+  CARD_PALETTE as h,
   isValidComponentType as i,
+  CARD_RADIUS as j,
+  CARD_SHADOW as k,
+  CARD_SHADOW_LG as l,
+  PRIMARY_HOVER_HEX as m,
+  PRIMARY_PRESSED_HEX as n,
+  validateAttributes as o,
   resolveComponentType as r,
   validateElementBelongsToComponent as v
 };
-//# sourceMappingURL=validation-MSiRF5Wt.js.map
+//# sourceMappingURL=validation-Dt4L_df8.js.map

package/dist/validation-Dt4L_df8.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"validation-Dt4L_df8.js","sources":["../src/styles/design-tokens.ts","../src/utils/component-validation.ts","../src/utils/validation.ts"],"sourcesContent":["/**\n * Hardcoded color tokens for component-type badge colors.\n * Embeds can't rely on host page CSS vars, so we use inline values.\n * Source: skhema-web/src/app/globals.css oklch tokens converted to HSL-ish for browser compat.\n */\n\nexport const COMPONENT_COLORS = {\n  diagnosis: {\n    bg: 'oklch(0.65 0.06 25 / 0.15)',\n    text: 'oklch(0.65 0.06 25)',\n    border: 'oklch(0.65 0.06 25 / 0.3)',\n  },\n  method: {\n    bg: 'oklch(0.6 0.06 250 / 0.15)',\n    text: 'oklch(0.6 0.06 250)',\n    border: 'oklch(0.6 0.06 250 / 0.3)',\n  },\n  initiatives: {\n    bg: 'oklch(0.6 0.06 155 / 0.15)',\n    text: 'oklch(0.6 0.06 155)',\n    border: 'oklch(0.6 0.06 155 / 0.3)',\n  },\n  measures: {\n    bg: 'oklch(0.6 0.06 300 / 0.15)',\n    text: 'oklch(0.6 0.06 300)',\n    border: 'oklch(0.6 0.06 300 / 0.3)',\n  },\n  support: {\n    bg: 'oklch(0.65 0.06 65 / 0.15)',\n    text: 'oklch(0.65 0.06 65)',\n    border: 'oklch(0.65 0.06 65 / 0.3)',\n  },\n} as const\n\nexport type ComponentColorKey = keyof typeof COMPONENT_COLORS\n\n/**\n * Email-safe flat hex palette for the card surface, per theme. These mirror the\n * Tailwind slate values behind the `CARD_VARS` HSL tokens, pre-resolved to hex\n * because email clients ignore `<style>` / CSS vars. The card renderer\n * (`@skhema/embed/render`) inlines these so the live browser embed and email\n * share one colour system (see the \"converge on hex\" decision).\n */\nexport const CARD_PALETTE = {\n  light: {\n    cardBg: '#ffffff', // hsl(0 0% 100%)\n    border: '#e2e8f0', // hsl(214.3 31.8% 91.4%) — slate-200\n    text: '#020817', // hsl(222.2 84% 4.9%)  — slate-950\n    textMuted: '#64748b', // hsl(215.4 16.3% 46.9%) — slate-500\n  },\n  dark: {\n    cardBg: '#020817', // hsl(222.2 84% 4.9%)  — slate-950\n    border: '#1e293b', // hsl(217.2 32.6% 17.5%) — slate-800\n    text: '#f8fafc', // hsl(210 40% 98%)     — slate-50\n    textMuted: '#94a3b8', // hsl(215 20.2% 65.1%)  — slate-400\n  },\n} as const\n\nexport type CardTheme = keyof typeof CARD_PALETTE\n\n/** Save-button brand colours (hex) — match the `--skhema-primary*` HSL tokens. */\nexport const PRIMARY_HEX = '#cd476a' // hsl(344 57% 54%)\nexport const PRIMARY_HOVER_HEX = '#b53d5e' // hsl(344 50% 47%)\nexport const PRIMARY_PRESSED_HEX = '#9d3552' // hsl(343 50% 41%)\n\n/** Card geometry / typography shared by the renderer and the browser embed. */\nexport const CARD_RADIUS = '4px' // calc(0.1rem + 2px) ≈ 3.6px\nexport const CARD_SHADOW =\n  '0 1px 3px 0 rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1)'\nexport const CARD_SHADOW_LG =\n  '0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)'\nexport const FONT_STACK =\n  \"-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Inter', sans-serif\"\nexport const MONO_STACK =\n  \"ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace\"\n\n/**\n * Shared base card CSS variables for light and dark modes.\n */\nexport const CARD_VARS = {\n  light: {\n    '--skhema-bg': 'hsl(0 0% 100%)',\n    '--skhema-card': 'hsl(0 0% 100%)',\n    '--skhema-border': 'hsl(214.3 31.8% 91.4%)',\n    '--skhema-text': 'hsl(222.2 84% 4.9%)',\n    '--skhema-text-muted': 'hsl(215.4 16.3% 46.9%)',\n    '--skhema-accent': 'hsl(210 40% 96%)',\n    '--skhema-surface-subtle': 'hsl(210 40% 97%)',\n  },\n  dark: {\n    '--skhema-bg': 'hsl(222.2 84% 4.9%)',\n    '--skhema-card': 'hsl(222.2 84% 4.9%)',\n    '--skhema-border': 'hsl(217.2 32.6% 17.5%)',\n    '--skhema-text': 'hsl(210 40% 98%)',\n    '--skhema-text-muted': 'hsl(215 20.2% 65.1%)',\n    '--skhema-accent': 'hsl(217.2 32.6% 17.5%)',\n    '--skhema-surface-subtle': 'hsl(217.2 32.6% 12%)',\n  },\n} as const\n\n/**\n * User SVG icon (inline, no external deps).\n */\nexport const USER_ICON_SVG = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2\"/><circle cx=\"12\" cy=\"7\" r=\"4\"/></svg>`\n","import type { ComponentValue, ElementValue } from '@skhema/types'\nimport { COMPONENT_TYPES, SKHEMA_MAPPING } from '@skhema/types'\n\n/**\n * Validate that a string is a valid component type.\n */\nexport function isValidComponentType(\n  componentType: string\n): componentType is ComponentValue {\n  const validTypes = Object.values(COMPONENT_TYPES).map((t) => t.value)\n  return validTypes.includes(componentType as ComponentValue)\n}\n\n/**\n * Validate that an element type belongs to the given component type.\n */\nexport function validateElementBelongsToComponent(\n  elementType: string,\n  componentType: string\n): boolean {\n  if (!isValidComponentType(componentType)) return false\n\n  const validElements =\n    SKHEMA_MAPPING.elementFlow[\n      componentType as keyof typeof SKHEMA_MAPPING.elementFlow\n    ]\n  if (!validElements) return false\n\n  return validElements.some((e) => e.value === elementType)\n}\n\n/**\n * Get the human-readable label for a component type.\n */\nexport function getComponentTypeLabel(componentType: string): string {\n  const type = Object.values(COMPONENT_TYPES).find(\n    (t) => t.value === componentType\n  )\n  return type?.label || componentType\n}\n\n/**\n * Get the acronym for a component type (e.g., 'BD' for diagnosis).\n */\nexport function getComponentTypeAcronym(componentType: string): string {\n  const type = Object.values(COMPONENT_TYPES).find(\n    (t) => t.value === componentType\n  )\n  return type?.acronym || componentType.substring(0, 2).toUpperCase()\n}\n\n/**\n * Resolve which component type an element belongs to.\n * Returns the component value, or 'diagnosis' as fallback.\n */\nexport function resolveComponentType(elementType: string): ComponentValue {\n  for (const [componentValue, elements] of Object.entries(\n    SKHEMA_MAPPING.elementFlow\n  )) {\n    if (elements.some((e) => e.value === elementType)) {\n      return componentValue as ComponentValue\n    }\n  }\n  return 'diagnosis'\n}\n\n/**\n * Get all valid element types for a given component, ordered per the mapping.\n */\nexport function getElementTypesForComponent(\n  componentType: string\n): ElementValue[] {\n  if (!isValidComponentType(componentType)) return []\n  const elements =\n    SKHEMA_MAPPING.elementFlow[\n      componentType as keyof typeof SKHEMA_MAPPING.elementFlow\n    ]\n  return elements?.map((e) => e.value) || []\n}\n","import type { ElementValue } from '@skhema/types'\nimport { ELEMENT_TYPES } from '@skhema/types'\n\nexport function isValidElementType(\n  elementType: string\n): elementType is ElementValue {\n  const validTypes = Object.values(ELEMENT_TYPES).map((type) => type.value)\n  return validTypes.includes(elementType as ElementValue)\n}\n\nexport function validateAttributes(element: HTMLElement): {\n  isValid: boolean\n  errors: string[]\n  elementType?: ElementValue\n  contributorId?: string\n} {\n  const errors: string[] = []\n\n  const elementType = element.getAttribute('element-type')\n  const contributorId = element.getAttribute('contributor-id')\n\n  if (!elementType) {\n    errors.push('Missing required attribute: element-type')\n  } else if (!isValidElementType(elementType)) {\n    const validTypes = Object.values(ELEMENT_TYPES)\n      .map((t) => t.value)\n      .join(', ')\n    errors.push(\n      `Invalid element-type \"${elementType}\". Valid types: ${validTypes}`\n    )\n  }\n\n  if (!contributorId) {\n    errors.push('Missing required attribute: contributor-id')\n  } else if (contributorId.trim().length === 0) {\n    errors.push('contributor-id cannot be empty')\n  }\n\n  return {\n    isValid: errors.length === 0,\n    errors,\n    elementType: isValidElementType(elementType || '')\n      ? (elementType as ElementValue)\n      : undefined,\n    contributorId: contributorId || undefined,\n  }\n}\n\nexport function getElementTypeLabel(elementType: ElementValue): string {\n  const type = Object.values(ELEMENT_TYPES).find((t) => t.value === elementType)\n  return type?.label || elementType\n}\n\nexport function getElementTypeAcronym(elementType: ElementValue): string {\n  const type = Object.values(ELEMENT_TYPES).find((t) => t.value === elementType)\n  return type?.acronym || elementType.substring(0, 2).toUpperCase()\n}\n"],"names":[],"mappings":";AAMO,MAAM,mBAAmB;AAAA,EAC9B,WAAW;AAAA,IACT,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ;AAAA,EAAA;AAAA,EAEV,QAAQ;AAAA,IACN,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ;AAAA,EAAA;AAAA,EAEV,aAAa;AAAA,IACX,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ;AAAA,EAAA;AAAA,EAEV,UAAU;AAAA,IACR,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ;AAAA,EAAA;AAAA,EAEV,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ;AAAA,EAAA;AAEZ;AAWO,MAAM,eAAe;AAAA,EAC1B,OAAO;AAAA,IACL,QAAQ;AAAA;AAAA,IACR,QAAQ;AAAA;AAAA,IACR,MAAM;AAAA;AAAA,IACN,WAAW;AAAA;AAAA,EAAA;AAAA,EAEb,MAAM;AAAA,IACJ,QAAQ;AAAA;AAAA,IACR,QAAQ;AAAA;AAAA,IACR,MAAM;AAAA;AAAA,IACN,WAAW;AAAA;AAAA,EAAA;AAEf;AAKO,MAAM,cAAc;AACpB,MAAM,oBAAoB;AAC1B,MAAM,sBAAsB;AAG5B,MAAM,cAAc;AACpB,MAAM,cACX;AACK,MAAM,iBACX;AACK,MAAM,aACX;AACK,MAAM,aACX;AAKK,MAAM,YAAY;AAAA,EACvB,OAAO;AAAA,IACL,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,iBAAiB;AAAA,IACjB,uBAAuB;AAAA,IACvB,mBAAmB;AAAA,IACnB,2BAA2B;AAAA,EAAA;AAAA,EAE7B,MAAM;AAAA,IACJ,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,iBAAiB;AAAA,IACjB,uBAAuB;AAAA,IACvB,mBAAmB;AAAA,IACnB,2BAA2B;AAAA,EAAA;AAE/B;AAKO,MAAM,gBAAgB;ACjGtB,SAAS,qBACd,eACiC;AACjC,QAAM,aAAa,OAAO,OAAO,eAAe,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK;AACpE,SAAO,WAAW,SAAS,aAA+B;AAC5D;AAKO,SAAS,kCACd,aACA,eACS;AACT,MAAI,CAAC,qBAAqB,aAAa,EAAG,QAAO;AAEjD,QAAM,gBACJ,eAAe,YACb,aACF;AACF,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,cAAc,KAAK,CAAC,MAAM,EAAE,UAAU,WAAW;AAC1D;AAKO,SAAS,sBAAsB,eAA+B;AACnE,QAAM,OAAO,OAAO,OAAO,eAAe,EAAE;AAAA,IAC1C,CAAC,MAAM,EAAE,UAAU;AAAA,EAAA;AAErB,SAAO,MAAM,SAAS;AACxB;AAKO,SAAS,wBAAwB,eAA+B;AACrE,QAAM,OAAO,OAAO,OAAO,eAAe,EAAE;AAAA,IAC1C,CAAC,MAAM,EAAE,UAAU;AAAA,EAAA;AAErB,SAAO,MAAM,WAAW,cAAc,UAAU,GAAG,CAAC,EAAE,YAAA;AACxD;AAMO,SAAS,qBAAqB,aAAqC;AACxE,aAAW,CAAC,gBAAgB,QAAQ,KAAK,OAAO;AAAA,IAC9C,eAAe;AAAA,EAAA,GACd;AACD,QAAI,SAAS,KAAK,CAAC,MAAM,EAAE,UAAU,WAAW,GAAG;AACjD,aAAO;AAAA,IACT;AAAA,EACF;AACA,SAAO;AACT;AAKO,SAAS,4BACd,eACgB;AAChB,MAAI,CAAC,qBAAqB,aAAa,UAAU,CAAA;AACjD,QAAM,WACJ,eAAe,YACb,aACF;AACF,SAAO,UAAU,IAAI,CAAC,MAAM,EAAE,KAAK,KAAK,CAAA;AAC1C;AC3EO,SAAS,mBACd,aAC6B;AAC7B,QAAM,aAAa,OAAO,OAAO,aAAa,EAAE,IAAI,CAAC,SAAS,KAAK,KAAK;AACxE,SAAO,WAAW,SAAS,WAA2B;AACxD;AAEO,SAAS,mBAAmB,SAKjC;AACA,QAAM,SAAmB,CAAA;AAEzB,QAAM,cAAc,QAAQ,aAAa,cAAc;AACvD,QAAM,gBAAgB,QAAQ,aAAa,gBAAgB;AAE3D,MAAI,CAAC,aAAa;AAChB,WAAO,KAAK,0CAA0C;AAAA,EACxD,WAAW,CAAC,mBAAmB,WAAW,GAAG;AAC3C,UAAM,aAAa,OAAO,OAAO,aAAa,EAC3C,IAAI,CAAC,MAAM,EAAE,KAAK,EAClB,KAAK,IAAI;AACZ,WAAO;AAAA,MACL,yBAAyB,WAAW,mBAAmB,UAAU;AAAA,IAAA;AAAA,EAErE;AAEA,MAAI,CAAC,eAAe;AAClB,WAAO,KAAK,4CAA4C;AAAA,EAC1D,WAAW,cAAc,KAAA,EAAO,WAAW,GAAG;AAC5C,WAAO,KAAK,gCAAgC;AAAA,EAC9C;AAEA,SAAO;AAAA,IACL,SAAS,OAAO,WAAW;AAAA,IAC3B;AAAA,IACA,aAAa,mBAAmB,eAAe,EAAE,IAC5C,cACD;AAAA,IACJ,eAAe,iBAAiB;AAAA,EAAA;AAEpC;AAEO,SAAS,oBAAoB,aAAmC;AACrE,QAAM,OAAO,OAAO,OAAO,aAAa,EAAE,KAAK,CAAC,MAAM,EAAE,UAAU,WAAW;AAC7E,SAAO,MAAM,SAAS;AACxB;AAEO,SAAS,sBAAsB,aAAmC;AACvE,QAAM,OAAO,OAAO,OAAO,aAAa,EAAE,KAAK,CAAC,MAAM,EAAE,UAAU,WAAW;AAC7E,SAAO,MAAM,WAAW,YAAY,UAAU,GAAG,CAAC,EAAE,YAAA;AACtD;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skhema/embed",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "description": "Embeddable component for integrating strategic elements with Skhema.",
   "main": "dist/index.cjs",
   "module": "dist/index.es.js",
@@ -26,6 +26,12 @@
       "require": "./dist/tokens.cjs",
       "default": "./dist/tokens.es.js"
     },
+    "./render": {
+      "types": "./dist/render.d.ts",
+      "import": "./dist/render.es.js",
+      "require": "./dist/render.cjs",
+      "default": "./dist/render.es.js"
+    },
     "./cdn": {
       "types": "./dist/cdn.d.ts",
       "import": "./dist/embed.min.js"
@@ -45,8 +51,8 @@
     "lint:fix": "eslint . --fix",
     "format": "prettier --write .",
     "format:check": "prettier --check .",
-    "test": "echo \"No tests configured yet\"",
-    "test:watch": "echo \"No tests configured yet\"",
+    "test": "vitest run",
+    "test:watch": "vitest",
     "check": "npm run typecheck && npm run lint && npm run format:check",
     "check:fix": "npm run format && npm run lint:fix",
     "preview": "vite preview",
@@ -76,7 +82,8 @@
     "terser": "^5.0.0",
     "typescript": "^5.0.0",
     "vite": "^7.0.0",
-    "vite-plugin-dts": "^4.0.0"
+    "vite-plugin-dts": "^4.0.0",
+    "vitest": "^4.0.17"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

package/dist/utils/author-attribution.d.ts

@@ -1,16 +0,0 @@
-/**
- * Resolve author display from element attributes.
- * Prefer author-name; contributor-name is deprecated.
- */
-export interface AuthorAttribution {
-    authorName: string;
-    authorSlug?: string;
-}
-export declare function readAuthorAttribution(element: HTMLElement): AuthorAttribution | null;
-/**
- * Footer HTML: "By {authorName}", linked when authorSlug is set.
- */
-export declare function formatAuthorAttributionHtml(authorName: string, authorSlug?: string): string;
-export declare function formatContributorIdFallback(contributorId: string): string;
-export declare function resolveAuthorFooterHtml(element: HTMLElement, contributorId: string): string;
-//# sourceMappingURL=author-attribution.d.ts.map

package/dist/utils/author-attribution.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"author-attribution.d.ts","sourceRoot":"","sources":["../../src/utils/author-attribution.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,WAAW,iBAAiB;IAChC,UAAU,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,WAAW,GACnB,iBAAiB,GAAG,IAAI,CAY1B;AAUD;;GAEG;AACH,wBAAgB,2BAA2B,CACzC,UAAU,EAAE,MAAM,EAClB,UAAU,CAAC,EAAE,MAAM,GAClB,MAAM,CAMR;AAED,wBAAgB,2BAA2B,CAAC,aAAa,EAAE,MAAM,GAAG,MAAM,CAKzE;AAED,wBAAgB,uBAAuB,CACrC,OAAO,EAAE,WAAW,EACpB,aAAa,EAAE,MAAM,GACpB,MAAM,CASR"}

package/dist/validation-CNWaQfh_.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"validation-CNWaQfh_.cjs","sources":["../src/styles/design-tokens.ts","../src/utils/component-validation.ts","../src/utils/validation.ts"],"sourcesContent":["/**\n * Hardcoded color tokens for component-type badge colors.\n * Embeds can't rely on host page CSS vars, so we use inline values.\n * Source: skhema-web/src/app/globals.css oklch tokens converted to HSL-ish for browser compat.\n */\n\nexport const COMPONENT_COLORS = {\n  diagnosis: {\n    bg: 'oklch(0.65 0.06 25 / 0.15)',\n    text: 'oklch(0.65 0.06 25)',\n    border: 'oklch(0.65 0.06 25 / 0.3)',\n  },\n  method: {\n    bg: 'oklch(0.6 0.06 250 / 0.15)',\n    text: 'oklch(0.6 0.06 250)',\n    border: 'oklch(0.6 0.06 250 / 0.3)',\n  },\n  initiatives: {\n    bg: 'oklch(0.6 0.06 155 / 0.15)',\n    text: 'oklch(0.6 0.06 155)',\n    border: 'oklch(0.6 0.06 155 / 0.3)',\n  },\n  measures: {\n    bg: 'oklch(0.6 0.06 300 / 0.15)',\n    text: 'oklch(0.6 0.06 300)',\n    border: 'oklch(0.6 0.06 300 / 0.3)',\n  },\n  support: {\n    bg: 'oklch(0.65 0.06 65 / 0.15)',\n    text: 'oklch(0.65 0.06 65)',\n    border: 'oklch(0.65 0.06 65 / 0.3)',\n  },\n} as const\n\nexport type ComponentColorKey = keyof typeof COMPONENT_COLORS\n\n/**\n * Shared base card CSS variables for light and dark modes.\n */\nexport const CARD_VARS = {\n  light: {\n    '--skhema-bg': 'hsl(0 0% 100%)',\n    '--skhema-card': 'hsl(0 0% 100%)',\n    '--skhema-border': 'hsl(214.3 31.8% 91.4%)',\n    '--skhema-text': 'hsl(222.2 84% 4.9%)',\n    '--skhema-text-muted': 'hsl(215.4 16.3% 46.9%)',\n    '--skhema-accent': 'hsl(210 40% 96%)',\n    '--skhema-surface-subtle': 'hsl(210 40% 97%)',\n  },\n  dark: {\n    '--skhema-bg': 'hsl(222.2 84% 4.9%)',\n    '--skhema-card': 'hsl(222.2 84% 4.9%)',\n    '--skhema-border': 'hsl(217.2 32.6% 17.5%)',\n    '--skhema-text': 'hsl(210 40% 98%)',\n    '--skhema-text-muted': 'hsl(215 20.2% 65.1%)',\n    '--skhema-accent': 'hsl(217.2 32.6% 17.5%)',\n    '--skhema-surface-subtle': 'hsl(217.2 32.6% 12%)',\n  },\n} as const\n\n/**\n * Shared card structure styles (used by both SkhemaElement and SkhemaComponent).\n */\nexport const SHARED_CARD_STYLES = `\n/* Monospace acronym badge */\n.skhema-acronym-badge {\n  display: inline-flex;\n  align-items: center;\n  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;\n  font-size: 10px;\n  font-weight: 600;\n  padding: 2px 6px;\n  border-radius: 2px;\n  letter-spacing: 0.02em;\n  flex-shrink: 0;\n}\n\n/* Footer attribution tagline */\n.skhema-footer-attribution {\n  font-size: 11px;\n  color: var(--skhema-text-muted);\n  line-height: 1.4;\n}\n\n.skhema-footer-attribution a {\n  color: var(--skhema-text-muted);\n  text-decoration: underline;\n  text-decoration-color: var(--skhema-border);\n  text-underline-offset: 2px;\n}\n\n.skhema-footer-attribution a:hover {\n  color: var(--skhema-text);\n}\n\n/* Contributor line in footer */\n.skhema-contributor-line {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 12px;\n  color: var(--skhema-text-muted);\n}\n\n.skhema-contributor-line svg {\n  width: 14px;\n  height: 14px;\n  flex-shrink: 0;\n}\n\n.skhema-author-link {\n  color: inherit;\n  text-decoration: none;\n}\n\n.skhema-author-link:hover {\n  color: var(--skhema-text);\n  text-decoration: underline;\n}\n\n/* Save button — primary brand color */\n.skhema-save-btn {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  background: var(--skhema-primary);\n  color: white;\n  border: none;\n  padding: 6px 14px;\n  border-radius: calc(var(--skhema-radius) + 2px);\n  font-size: 12px;\n  font-weight: 500;\n  text-decoration: none;\n  cursor: pointer;\n  transition: background 0.15s ease;\n  white-space: nowrap;\n}\n\n.skhema-save-btn:hover {\n  background: var(--skhema-primary-hover);\n}\n\n.skhema-save-btn:active {\n  background: var(--skhema-primary-pressed);\n}\n\n.skhema-save-btn:focus {\n  outline: 2px solid var(--skhema-primary);\n  outline-offset: 2px;\n}\n\n.skhema-save-btn::after {\n  content: '\\\\2192';\n  font-size: 13px;\n}\n`\n\n/**\n * User SVG icon (inline, no external deps).\n */\nexport const USER_ICON_SVG = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2\"/><circle cx=\"12\" cy=\"7\" r=\"4\"/></svg>`\n","import type { ComponentValue, ElementValue } from '@skhema/types'\nimport { COMPONENT_TYPES, SKHEMA_MAPPING } from '@skhema/types'\n\n/**\n * Validate that a string is a valid component type.\n */\nexport function isValidComponentType(\n  componentType: string\n): componentType is ComponentValue {\n  const validTypes = Object.values(COMPONENT_TYPES).map((t) => t.value)\n  return validTypes.includes(componentType as ComponentValue)\n}\n\n/**\n * Validate that an element type belongs to the given component type.\n */\nexport function validateElementBelongsToComponent(\n  elementType: string,\n  componentType: string\n): boolean {\n  if (!isValidComponentType(componentType)) return false\n\n  const validElements =\n    SKHEMA_MAPPING.elementFlow[\n      componentType as keyof typeof SKHEMA_MAPPING.elementFlow\n    ]\n  if (!validElements) return false\n\n  return validElements.some((e) => e.value === elementType)\n}\n\n/**\n * Get the human-readable label for a component type.\n */\nexport function getComponentTypeLabel(componentType: string): string {\n  const type = Object.values(COMPONENT_TYPES).find(\n    (t) => t.value === componentType\n  )\n  return type?.label || componentType\n}\n\n/**\n * Get the acronym for a component type (e.g., 'BD' for diagnosis).\n */\nexport function getComponentTypeAcronym(componentType: string): string {\n  const type = Object.values(COMPONENT_TYPES).find(\n    (t) => t.value === componentType\n  )\n  return type?.acronym || componentType.substring(0, 2).toUpperCase()\n}\n\n/**\n * Resolve which component type an element belongs to.\n * Returns the component value, or 'diagnosis' as fallback.\n */\nexport function resolveComponentType(elementType: string): ComponentValue {\n  for (const [componentValue, elements] of Object.entries(\n    SKHEMA_MAPPING.elementFlow\n  )) {\n    if (elements.some((e) => e.value === elementType)) {\n      return componentValue as ComponentValue\n    }\n  }\n  return 'diagnosis'\n}\n\n/**\n * Get all valid element types for a given component, ordered per the mapping.\n */\nexport function getElementTypesForComponent(\n  componentType: string\n): ElementValue[] {\n  if (!isValidComponentType(componentType)) return []\n  const elements =\n    SKHEMA_MAPPING.elementFlow[\n      componentType as keyof typeof SKHEMA_MAPPING.elementFlow\n    ]\n  return elements?.map((e) => e.value) || []\n}\n","import type { ElementValue } from '@skhema/types'\nimport { ELEMENT_TYPES } from '@skhema/types'\n\nexport function isValidElementType(\n  elementType: string\n): elementType is ElementValue {\n  const validTypes = Object.values(ELEMENT_TYPES).map((type) => type.value)\n  return validTypes.includes(elementType as ElementValue)\n}\n\nexport function validateAttributes(element: HTMLElement): {\n  isValid: boolean\n  errors: string[]\n  elementType?: ElementValue\n  contributorId?: string\n} {\n  const errors: string[] = []\n\n  const elementType = element.getAttribute('element-type')\n  const contributorId = element.getAttribute('contributor-id')\n\n  if (!elementType) {\n    errors.push('Missing required attribute: element-type')\n  } else if (!isValidElementType(elementType)) {\n    const validTypes = Object.values(ELEMENT_TYPES)\n      .map((t) => t.value)\n      .join(', ')\n    errors.push(\n      `Invalid element-type \"${elementType}\". Valid types: ${validTypes}`\n    )\n  }\n\n  if (!contributorId) {\n    errors.push('Missing required attribute: contributor-id')\n  } else if (contributorId.trim().length === 0) {\n    errors.push('contributor-id cannot be empty')\n  }\n\n  return {\n    isValid: errors.length === 0,\n    errors,\n    elementType: isValidElementType(elementType || '')\n      ? (elementType as ElementValue)\n      : undefined,\n    contributorId: contributorId || undefined,\n  }\n}\n\nexport function getElementTypeLabel(elementType: ElementValue): string {\n  const type = Object.values(ELEMENT_TYPES).find((t) => t.value === elementType)\n  return type?.label || elementType\n}\n\nexport function getElementTypeAcronym(elementType: ElementValue): string {\n  const type = Object.values(ELEMENT_TYPES).find((t) => t.value === elementType)\n  return type?.acronym || elementType.substring(0, 2).toUpperCase()\n}\n"],"names":["COMPONENT_TYPES","SKHEMA_MAPPING","ELEMENT_TYPES"],"mappings":"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"}