waybetter 0.1.1 → 0.7.0

package/dist/runtime/themeApi.js

@@ -0,0 +1,220 @@
+// `api.theme`: the active theme as plain values, so plugins (and the UI kit) can match it. The site
+// adapter resolves its own theme document into a `ResolvedTheme` (colors by role, radius, font,
+// mode) and says when it changes; this module turns that into `--wb-*` CSS custom properties and
+// a small `current()` / `onChange()` API. When the site keeps its own colors (no theme, e.g. X
+// default), the adapter still resolves the site's palette, so plugins always see real colors.
+//
+// Pure except `createThemeApi` / `readPageTheme`, which read the page.
+/**
+ * Font roles: `interface` (the site's UI), `post` (main content text), `heading` (names and
+ * headings), `numbers` (counts), `mono` (code), `chrome` (the app's own window: tabs, address bar,
+ * panel) and `dialog` (plugin dialogs and toasts from the UI kit).
+ */
+export const FONT_ROLE_NAMES = ['interface', 'post', 'heading', 'numbers', 'mono', 'chrome', 'dialog'];
+/** Monospaced families, in order: what a `mono` role that inherits (or a source without fonts) gets. */
+export const MONO_FAMILIES = ['Cascadia Mono', 'SF Mono', 'Consolas', 'Menlo', 'ui-monospace', 'monospace'];
+export const MONO_FONT = MONO_FAMILIES.map(name => (/^(ui-monospace|monospace)$/.test(name) ? name : `"${name}"`)).join(', ');
+/** Where the theme file JSON Schema is published with the `waybetter` npm package (`"$schema"` in theme files). */
+export const THEME_SCHEMA_URL = 'https://unpkg.com/waybetter/theme.schema.json';
+export const FALLBACK_FONT = 'system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif';
+const HEX = /^#[0-9a-f]{6}$/i;
+/** `#rrggbb` → [r, g, b]. */
+export function hexToRgb(hex) {
+    const n = parseInt(hex.slice(1, 7), 16);
+    return [(n >> 16) & 255, (n >> 8) & 255, n & 255];
+}
+/** WCAG relative luminance of `#rrggbb`. */
+export function relativeLuminance(hex) {
+    const [r, g, b] = hexToRgb(hex).map(v => { const c = v / 255; return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4; });
+    return 0.2126 * r + 0.7152 * g + 0.0722 * b;
+}
+/** WCAG contrast ratio of two `#rrggbb` colors (1–21). */
+export function contrastRatio(a, b) {
+    const [x, y] = [relativeLuminance(a), relativeLuminance(b)].sort((m, n) => n - m);
+    return (x + 0.05) / (y + 0.05);
+}
+/** White when it reaches 4.5:1 on `hex`, otherwise whichever of black and white reads better. */
+export function readableOn(hex) {
+    const white = contrastRatio(hex, '#ffffff');
+    return white >= 4.5 || white >= contrastRatio(hex, '#000000') ? '#ffffff' : '#000000';
+}
+/** `rgb(…)` / `rgba(…)` / `#rgb` / `#rrggbb` to `#rrggbb`; null when it is transparent or unparsable. */
+export function toHex(value) {
+    const text = (value ?? '').trim();
+    if (HEX.test(text))
+        return text.toLowerCase();
+    const short = /^#([0-9a-f])([0-9a-f])([0-9a-f])$/i.exec(text);
+    if (short)
+        return `#${short[1]}${short[1]}${short[2]}${short[2]}${short[3]}${short[3]}`.toLowerCase();
+    const match = /^rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)(?:\s*[,/]\s*([\d.]+%?))?\s*\)$/.exec(text);
+    if (!match)
+        return null;
+    if (match[4] !== undefined && parseFloat(match[4]) === 0)
+        return null;
+    return `#${[match[1], match[2], match[3]].map(v => Math.min(255, Number(v)).toString(16).padStart(2, '0')).join('')}`;
+}
+/** `a` moved toward `b` by `t` (0–1), per channel. */
+export function mix(a, b, t) {
+    const [x, y] = [hexToRgb(a), hexToRgb(b)];
+    return `#${x.map((v, i) => Math.round(v + (y[i] - v) * t).toString(16).padStart(2, '0')).join('')}`;
+}
+/**
+ * A complete resolved theme from a few page colors (background, text, accent), for sites or moments
+ * without a theme engine. Surfaces, border and muted text sit between background and text.
+ */
+export function themeFromColors(bg, text, accent, extra = {}) {
+    const dark = relativeLuminance(bg) < relativeLuminance(text);
+    const colors = {
+        bg, text, accent,
+        surface: mix(bg, text, dark ? 0.05 : 0.03),
+        elevated: mix(bg, text, dark ? 0.1 : 0.07),
+        border: mix(bg, text, dark ? 0.2 : 0.15),
+        muted: mix(bg, text, 0.62),
+        onAccent: readableOn(accent),
+        inverse: text,
+        onInverse: bg,
+        page: bg,
+    };
+    return { id: 'page', name: 'Page colors', mode: dark ? 'dark' : 'light', siteDefault: true, radius: 16, buttonRadius: 9999, font: FALLBACK_FONT, ...extra, colors };
+}
+/** The page's own colors (computed body background and text), used when no theme source exists. */
+export function readPageTheme(win, accent = '#1d9bf0') {
+    let bg = null;
+    let text = null;
+    let font = '';
+    try {
+        const body = win.document.body;
+        if (body) {
+            const style = win.getComputedStyle(body);
+            bg = toHex(style.backgroundColor) ?? toHex(win.getComputedStyle(win.document.documentElement).backgroundColor);
+            text = toHex(style.color);
+            font = style.fontFamily;
+        }
+    }
+    catch { /* No layout yet. */ }
+    const dark = !!win.matchMedia?.('(prefers-color-scheme: dark)').matches;
+    bg ??= dark ? '#000000' : '#ffffff';
+    text ??= relativeLuminance(bg) < 0.2 ? '#e7e9ea' : '#0f1419';
+    if (contrastRatio(bg, text) < 3)
+        text = readableOn(bg);
+    return themeFromColors(bg, text, accent, font ? { font } : {});
+}
+/** Fills in any role a source left out and freezes the result. */
+export function normalizeResolved(theme) {
+    const bg = toHex(theme.colors?.bg) ?? '#ffffff';
+    let text = toHex(theme.colors?.text) ?? readableOn(bg);
+    if (contrastRatio(bg, text) < 3)
+        text = readableOn(bg);
+    const base = themeFromColors(bg, text, toHex(theme.colors?.accent) ?? '#1d9bf0');
+    const colors = { ...base.colors };
+    for (const key of Object.keys(colors)) {
+        const value = theme.colors?.[key];
+        if (key !== 'bg' && key !== 'text' && typeof value === 'string' && HEX.test(value))
+            colors[key] = value.toLowerCase();
+    }
+    if (!HEX.test(theme.colors.onAccent ?? ''))
+        colors.onAccent = readableOn(colors.accent);
+    const radius = Number.isFinite(theme.radius) ? Math.max(0, Math.min(28, theme.radius)) : 16;
+    const buttonRadius = Number.isFinite(theme.buttonRadius) ? Math.max(0, theme.buttonRadius) : 9999;
+    const font = theme.font || FALLBACK_FONT;
+    return Object.freeze({
+        id: String(theme.id || 'theme'), name: String(theme.name || ''), mode: theme.mode === 'light' ? 'light' : 'dark',
+        siteDefault: !!theme.siteDefault, radius, buttonRadius, font,
+        colors: Object.freeze(colors),
+        fonts: normalizeFonts(theme.fonts, font),
+    });
+}
+const cssSafe = (value) => value.replace(/[;{}<>\\]/g, '');
+const finite = (value, min, max) => typeof value === 'number' && Number.isFinite(value) ? Math.min(max, Math.max(min, value)) : null;
+/** Every role filled in: missing roles inherit the interface font (`mono` a monospaced stack). */
+export function normalizeFonts(fonts, font) {
+    const out = {};
+    const base = fonts?.interface?.stack ? cssSafe(fonts.interface.stack) : font;
+    for (const role of FONT_ROLE_NAMES) {
+        const given = fonts?.[role];
+        const stack = given?.stack ? cssSafe(given.stack) : role === 'mono' ? MONO_FONT : base;
+        out[role] = Object.freeze({
+            stack,
+            weight: finite(given?.weight, 100, 900),
+            size: finite(given?.size, 0.5, 2) ?? 1,
+            tracking: finite(given?.tracking, -0.1, 0.2),
+            tabular: !!given?.tabular,
+            inherited: given ? !!given.inherited : true,
+        });
+    }
+    return Object.freeze(out);
+}
+const VAR_NAMES = {
+    bg: '--wb-bg', surface: '--wb-surface', elevated: '--wb-elevated', border: '--wb-border', text: '--wb-text', muted: '--wb-muted',
+    accent: '--wb-accent', onAccent: '--wb-on-accent', inverse: '--wb-inverse', onInverse: '--wb-on-inverse', page: '--wb-page',
+};
+/**
+ * The theme as CSS custom properties: `--wb-bg`, `--wb-surface`, `--wb-elevated`, `--wb-border`,
+ * `--wb-text`, `--wb-muted`, `--wb-accent`, `--wb-on-accent`, `--wb-inverse`, `--wb-on-inverse`,
+ * `--wb-page`, `--wb-radius`, `--wb-button-radius`, `--wb-font`, `--wb-mode` (`light`/`dark`), and
+ * one stack per font role: `--wb-font-interface`, `--wb-font-post`, `--wb-font-heading`,
+ * `--wb-font-numbers`, `--wb-font-mono`, `--wb-font-chrome`, `--wb-font-dialog`.
+ */
+export function themeVars(theme) {
+    const vars = {};
+    for (const [key, name] of Object.entries(VAR_NAMES))
+        vars[name] = theme.colors[key];
+    vars['--wb-radius'] = `${theme.radius}px`;
+    vars['--wb-button-radius'] = `${theme.buttonRadius}px`;
+    vars['--wb-font'] = theme.font;
+    const fonts = theme.fonts ?? normalizeFonts(undefined, theme.font);
+    for (const role of FONT_ROLE_NAMES)
+        vars[`--wb-font-${role}`] = fonts[role].stack;
+    vars['--wb-mode'] = theme.mode;
+    return vars;
+}
+/** `:root{--wb-…}` for a `<style>` element (values come from a resolved theme, never raw input). */
+export function themeVarsCss(theme, selector = ':root') {
+    const safe = (value) => value.replace(/[;{}<>\\]/g, '');
+    return `${selector}{${Object.entries(themeVars(theme)).map(([name, value]) => `${name}:${safe(value)}`).join(';')}}`;
+}
+/** A stable key: equal keys mean nothing visible changed. */
+export const themeKey = (theme) => JSON.stringify(theme);
+/**
+ * `api.theme`. With a site `source` it reports the site's resolved theme (falling back to the page's
+ * computed colors while the source has none); without one, only the page's colors.
+ */
+export function createThemeApi(win, source, fallbackAccent) {
+    const report = (error) => console.error('[wayBetter] theme listener failed', error);
+    const current = () => {
+        let resolved = null;
+        try {
+            resolved = source?.current() ?? null;
+        }
+        catch (error) {
+            report(error);
+        }
+        return normalizeResolved(resolved ?? readPageTheme(win, fallbackAccent));
+    };
+    return Object.freeze({
+        current,
+        onChange(listener) {
+            if (!source)
+                return () => { };
+            let last = '';
+            try {
+                last = themeKey(current());
+            }
+            catch { /* Reported by current(). */ }
+            return source.onChange(() => {
+                const next = current();
+                const key = themeKey(next);
+                if (key === last)
+                    return;
+                last = key;
+                try {
+                    listener(next);
+                }
+                catch (error) {
+                    report(error);
+                }
+            });
+        },
+    });
+}
+//# sourceMappingURL=themeApi.js.map

package/dist/runtime/themeApi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeApi.js","sourceRoot":"","sources":["../../../runtime/src/themeApi.ts"],"names":[],"mappings":"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","sourcesContent":["// `api.theme`: the active theme as plain values, so plugins (and the UI kit) can match it. The site\n// adapter resolves its own theme document into a `ResolvedTheme` (colors by role, radius, font,\n// mode) and says when it changes; this module turns that into `--wb-*` CSS custom properties and\n// a small `current()` / `onChange()` API. When the site keeps its own colors (no theme, e.g. X\n// default), the adapter still resolves the site's palette, so plugins always see real colors.\n//\n// Pure except `createThemeApi` / `readPageTheme`, which read the page.\n\nexport type ThemeMode = 'light' | 'dark';\n\n/** Every color role a theme has, resolved (derived roles filled in, legibility enforced). */\nexport type ResolvedColors = {\n  /** The main surface behind content (the site's column background). */\n  bg: string;\n  /** A raised surface (cards, inputs). */\n  surface: string;\n  /** Hover / selected surface, one step above `surface`. */\n  elevated: string;\n  border: string;\n  text: string;\n  /** Secondary text. */\n  muted: string;\n  accent: string;\n  /** Readable text on `accent`. */\n  onAccent: string;\n  /** The site's filled primary button and its label. */\n  inverse: string;\n  onInverse: string;\n  /** The canvas behind the columns (equals `bg` unless the theme paints a page). */\n  page: string;\n};\n\nexport type ResolvedTheme = {\n  /** Theme id (`x` for the site's own look). */\n  id: string;\n  name: string;\n  mode: ThemeMode;\n  /** True when the site's own colors are shown (no theme colors). */\n  siteDefault: boolean;\n  colors: ResolvedColors;\n  /** Card / dialog corner radius in px. */\n  radius: number;\n  /** Button corner radius in px (9999 = pill). */\n  buttonRadius: number;\n  /** CSS `font-family` stack of the interface. */\n  font: string;\n  /**\n   * Which font goes where: every role resolved (a role that inherits carries the stack it inherits).\n   * Always present after `normalizeResolved`; adapters without font roles may leave it out.\n   */\n  fonts?: ResolvedFonts;\n};\n\n/**\n * Font roles: `interface` (the site's UI), `post` (main content text), `heading` (names and\n * headings), `numbers` (counts), `mono` (code), `chrome` (the app's own window: tabs, address bar,\n * panel) and `dialog` (plugin dialogs and toasts from the UI kit).\n */\nexport const FONT_ROLE_NAMES = ['interface', 'post', 'heading', 'numbers', 'mono', 'chrome', 'dialog'] as const;\nexport type FontRoleName = typeof FONT_ROLE_NAMES[number];\nexport type ResolvedFont = {\n  /** CSS `font-family` stack. */\n  stack: string;\n  /** Weight the role asks for, or null to keep the text's own. */\n  weight: number | null;\n  /** Size relative to the site's (1 = unchanged). */\n  size: number;\n  /** Letter spacing in em, or null to keep the text's own. */\n  tracking: number | null;\n  /** Tabular (fixed-width) figures. */\n  tabular: boolean;\n  /** True when the role inherits its family from another role or the site. */\n  inherited: boolean;\n};\nexport type ResolvedFonts = Record<FontRoleName, ResolvedFont>;\n/** Monospaced families, in order: what a `mono` role that inherits (or a source without fonts) gets. */\nexport const MONO_FAMILIES = ['Cascadia Mono', 'SF Mono', 'Consolas', 'Menlo', 'ui-monospace', 'monospace'];\nexport const MONO_FONT = MONO_FAMILIES.map(name => (/^(ui-monospace|monospace)$/.test(name) ? name : `\"${name}\"`)).join(', ');\n\n/** What a site adapter provides: the current resolved theme and change notifications. */\nexport type ThemeSource = {\n  current(): ResolvedTheme | null;\n  onChange(listener: () => void): () => void;\n};\n\nexport type ThemeApi = {\n  /** The active theme, resolved. A frozen snapshot: call again after `onChange`. */\n  current(): ResolvedTheme;\n  /** Calls `listener(theme)` after the theme (or the site's light/dark mode) changes. Returns a dispose. */\n  onChange(listener: (theme: ResolvedTheme) => void): () => void;\n};\n\n/** Where the theme file JSON Schema is published with the `waybetter` npm package (`\"$schema\"` in theme files). */\nexport const THEME_SCHEMA_URL = 'https://unpkg.com/waybetter/theme.schema.json';\n\nexport const FALLBACK_FONT = 'system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif';\n\nconst HEX = /^#[0-9a-f]{6}$/i;\n\n/** `#rrggbb` → [r, g, b]. */\nexport function hexToRgb(hex: string): [number, number, number] {\n  const n = parseInt(hex.slice(1, 7), 16);\n  return [(n >> 16) & 255, (n >> 8) & 255, n & 255];\n}\n\n/** WCAG relative luminance of `#rrggbb`. */\nexport function relativeLuminance(hex: string): number {\n  const [r, g, b] = hexToRgb(hex).map(v => { const c = v / 255; return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4; }) as [number, number, number];\n  return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n}\n\n/** WCAG contrast ratio of two `#rrggbb` colors (1–21). */\nexport function contrastRatio(a: string, b: string): number {\n  const [x, y] = [relativeLuminance(a), relativeLuminance(b)].sort((m, n) => n - m) as [number, number];\n  return (x + 0.05) / (y + 0.05);\n}\n\n/** White when it reaches 4.5:1 on `hex`, otherwise whichever of black and white reads better. */\nexport function readableOn(hex: string): string {\n  const white = contrastRatio(hex, '#ffffff');\n  return white >= 4.5 || white >= contrastRatio(hex, '#000000') ? '#ffffff' : '#000000';\n}\n\n/** `rgb(…)` / `rgba(…)` / `#rgb` / `#rrggbb` to `#rrggbb`; null when it is transparent or unparsable. */\nexport function toHex(value: string | null | undefined): string | null {\n  const text = (value ?? '').trim();\n  if (HEX.test(text)) return text.toLowerCase();\n  const short = /^#([0-9a-f])([0-9a-f])([0-9a-f])$/i.exec(text);\n  if (short) return `#${short[1]}${short[1]}${short[2]}${short[2]}${short[3]}${short[3]}`.toLowerCase();\n  const match = /^rgba?\\(\\s*(\\d+)[,\\s]+(\\d+)[,\\s]+(\\d+)(?:\\s*[,/]\\s*([\\d.]+%?))?\\s*\\)$/.exec(text);\n  if (!match) return null;\n  if (match[4] !== undefined && parseFloat(match[4]) === 0) return null;\n  return `#${[match[1], match[2], match[3]].map(v => Math.min(255, Number(v)).toString(16).padStart(2, '0')).join('')}`;\n}\n\n/** `a` moved toward `b` by `t` (0–1), per channel. */\nexport function mix(a: string, b: string, t: number): string {\n  const [x, y] = [hexToRgb(a), hexToRgb(b)];\n  return `#${x.map((v, i) => Math.round(v + (y[i]! - v) * t).toString(16).padStart(2, '0')).join('')}`;\n}\n\n/**\n * A complete resolved theme from a few page colors (background, text, accent), for sites or moments\n * without a theme engine. Surfaces, border and muted text sit between background and text.\n */\nexport function themeFromColors(bg: string, text: string, accent: string, extra: Partial<Omit<ResolvedTheme, 'colors'>> = {}): ResolvedTheme {\n  const dark = relativeLuminance(bg) < relativeLuminance(text);\n  const colors: ResolvedColors = {\n    bg, text, accent,\n    surface: mix(bg, text, dark ? 0.05 : 0.03),\n    elevated: mix(bg, text, dark ? 0.1 : 0.07),\n    border: mix(bg, text, dark ? 0.2 : 0.15),\n    muted: mix(bg, text, 0.62),\n    onAccent: readableOn(accent),\n    inverse: text,\n    onInverse: bg,\n    page: bg,\n  };\n  return { id: 'page', name: 'Page colors', mode: dark ? 'dark' : 'light', siteDefault: true, radius: 16, buttonRadius: 9999, font: FALLBACK_FONT, ...extra, colors };\n}\n\n/** The page's own colors (computed body background and text), used when no theme source exists. */\nexport function readPageTheme(win: Window, accent = '#1d9bf0'): ResolvedTheme {\n  let bg: string | null = null;\n  let text: string | null = null;\n  let font = '';\n  try {\n    const body = win.document.body;\n    if (body) {\n      const style = win.getComputedStyle(body);\n      bg = toHex(style.backgroundColor) ?? toHex(win.getComputedStyle(win.document.documentElement).backgroundColor);\n      text = toHex(style.color);\n      font = style.fontFamily;\n    }\n  } catch { /* No layout yet. */ }\n  const dark = !!win.matchMedia?.('(prefers-color-scheme: dark)').matches;\n  bg ??= dark ? '#000000' : '#ffffff';\n  text ??= relativeLuminance(bg) < 0.2 ? '#e7e9ea' : '#0f1419';\n  if (contrastRatio(bg, text) < 3) text = readableOn(bg);\n  return themeFromColors(bg, text, accent, font ? { font } : {});\n}\n\n/** Fills in any role a source left out and freezes the result. */\nexport function normalizeResolved(theme: ResolvedTheme): ResolvedTheme {\n  const bg = toHex(theme.colors?.bg) ?? '#ffffff';\n  let text = toHex(theme.colors?.text) ?? readableOn(bg);\n  if (contrastRatio(bg, text) < 3) text = readableOn(bg);\n  const base = themeFromColors(bg, text, toHex(theme.colors?.accent) ?? '#1d9bf0');\n  const colors = { ...base.colors };\n  for (const key of Object.keys(colors) as Array<keyof ResolvedColors>) {\n    const value = theme.colors?.[key];\n    if (key !== 'bg' && key !== 'text' && typeof value === 'string' && HEX.test(value)) colors[key] = value.toLowerCase();\n  }\n  if (!HEX.test(theme.colors.onAccent ?? '')) colors.onAccent = readableOn(colors.accent);\n  const radius = Number.isFinite(theme.radius) ? Math.max(0, Math.min(28, theme.radius)) : 16;\n  const buttonRadius = Number.isFinite(theme.buttonRadius) ? Math.max(0, theme.buttonRadius) : 9999;\n  const font = theme.font || FALLBACK_FONT;\n  return Object.freeze({\n    id: String(theme.id || 'theme'), name: String(theme.name || ''), mode: theme.mode === 'light' ? 'light' : 'dark',\n    siteDefault: !!theme.siteDefault, radius, buttonRadius, font,\n    colors: Object.freeze(colors),\n    fonts: normalizeFonts(theme.fonts, font),\n  });\n}\n\nconst cssSafe = (value: string) => value.replace(/[;{}<>\\\\]/g, '');\nconst finite = (value: unknown, min: number, max: number): number | null =>\n  typeof value === 'number' && Number.isFinite(value) ? Math.min(max, Math.max(min, value)) : null;\n\n/** Every role filled in: missing roles inherit the interface font (`mono` a monospaced stack). */\nexport function normalizeFonts(fonts: Partial<Record<FontRoleName, Partial<ResolvedFont>>> | undefined, font: string): ResolvedFonts {\n  const out = {} as Record<FontRoleName, ResolvedFont>;\n  const base = fonts?.interface?.stack ? cssSafe(fonts.interface.stack) : font;\n  for (const role of FONT_ROLE_NAMES) {\n    const given = fonts?.[role];\n    const stack = given?.stack ? cssSafe(given.stack) : role === 'mono' ? MONO_FONT : base;\n    out[role] = Object.freeze({\n      stack,\n      weight: finite(given?.weight, 100, 900),\n      size: finite(given?.size, 0.5, 2) ?? 1,\n      tracking: finite(given?.tracking, -0.1, 0.2),\n      tabular: !!given?.tabular,\n      inherited: given ? !!given.inherited : true,\n    });\n  }\n  return Object.freeze(out);\n}\n\nconst VAR_NAMES: Record<keyof ResolvedColors, string> = {\n  bg: '--wb-bg', surface: '--wb-surface', elevated: '--wb-elevated', border: '--wb-border', text: '--wb-text', muted: '--wb-muted',\n  accent: '--wb-accent', onAccent: '--wb-on-accent', inverse: '--wb-inverse', onInverse: '--wb-on-inverse', page: '--wb-page',\n};\n\n/**\n * The theme as CSS custom properties: `--wb-bg`, `--wb-surface`, `--wb-elevated`, `--wb-border`,\n * `--wb-text`, `--wb-muted`, `--wb-accent`, `--wb-on-accent`, `--wb-inverse`, `--wb-on-inverse`,\n * `--wb-page`, `--wb-radius`, `--wb-button-radius`, `--wb-font`, `--wb-mode` (`light`/`dark`), and\n * one stack per font role: `--wb-font-interface`, `--wb-font-post`, `--wb-font-heading`,\n * `--wb-font-numbers`, `--wb-font-mono`, `--wb-font-chrome`, `--wb-font-dialog`.\n */\nexport function themeVars(theme: ResolvedTheme): Record<string, string> {\n  const vars: Record<string, string> = {};\n  for (const [key, name] of Object.entries(VAR_NAMES)) vars[name] = theme.colors[key as keyof ResolvedColors];\n  vars['--wb-radius'] = `${theme.radius}px`;\n  vars['--wb-button-radius'] = `${theme.buttonRadius}px`;\n  vars['--wb-font'] = theme.font;\n  const fonts = theme.fonts ?? normalizeFonts(undefined, theme.font);\n  for (const role of FONT_ROLE_NAMES) vars[`--wb-font-${role}`] = fonts[role].stack;\n  vars['--wb-mode'] = theme.mode;\n  return vars;\n}\n\n/** `:root{--wb-…}` for a `<style>` element (values come from a resolved theme, never raw input). */\nexport function themeVarsCss(theme: ResolvedTheme, selector = ':root'): string {\n  const safe = (value: string) => value.replace(/[;{}<>\\\\]/g, '');\n  return `${selector}{${Object.entries(themeVars(theme)).map(([name, value]) => `${name}:${safe(value)}`).join(';')}}`;\n}\n\n/** A stable key: equal keys mean nothing visible changed. */\nexport const themeKey = (theme: ResolvedTheme) => JSON.stringify(theme);\n\n/**\n * `api.theme`. With a site `source` it reports the site's resolved theme (falling back to the page's\n * computed colors while the source has none); without one, only the page's colors.\n */\nexport function createThemeApi(win: Window, source?: ThemeSource, fallbackAccent?: string): ThemeApi {\n  const report = (error: unknown) => console.error('[wayBetter] theme listener failed', error);\n  const current = (): ResolvedTheme => {\n    let resolved: ResolvedTheme | null = null;\n    try { resolved = source?.current() ?? null; } catch (error) { report(error); }\n    return normalizeResolved(resolved ?? readPageTheme(win, fallbackAccent));\n  };\n  return Object.freeze({\n    current,\n    onChange(listener: (theme: ResolvedTheme) => void) {\n      if (!source) return () => {};\n      let last = '';\n      try { last = themeKey(current()); } catch { /* Reported by current(). */ }\n      return source.onChange(() => {\n        const next = current();\n        const key = themeKey(next);\n        if (key === last) return;\n        last = key;\n        try { listener(next); } catch (error) { report(error); }\n      });\n    },\n  });\n}\n"]}

package/dist/runtime/themeBar.d.ts

@@ -0,0 +1,28 @@
+export declare const BAR_ATTR = "data-wb-bar";
+export type BarMode = 'labels' | 'icons';
+/** One item as the measurer sees it: its label text and font, and the fixed parts around the label. */
+export type BarItem = {
+    label: string;
+    font: string;
+    fixed: number;
+};
+/**
+ * Pure: the mode for `items` in `available` px, with `gap` between items. Hysteresis: leaving icons
+ * mode needs 16px more room than staying in labels mode, so a bar never flaps at the threshold.
+ */
+export declare function barMode(items: Array<{
+    labelWidth: number;
+    fixed: number;
+}>, available: number, gap: number, current: BarMode | null, hysteresis?: number): BarMode;
+export type BarMeasurerOptions = {
+    /** The bar's item container (X: the nav). */
+    nav: string;
+    /** Items inside it, and inside an item its icon box and label box. */
+    item: string;
+    icon: string;
+    label: string;
+    /** Only while this matches (a bar layout is active). */
+    when?: string;
+};
+/** Measures on nav resize and font loads; writes the mode on <html>. Returns a stop function. */
+export declare function installBarMeasurer(win: Window, options: BarMeasurerOptions): () => void;

package/dist/runtime/themeBar.js

@@ -0,0 +1,82 @@
+// Theme engine v3, step 9 (.omc/plans/theme-engine-v3.md 4.1): one bar component. Whether a bar's
+// items carry their labels is measured, never guessed from a width breakpoint: the sum of the whole
+// labels (text measured in the label's own font), icons, paddings and gaps against the room the items
+// have. The mode lands on `html[data-wb-bar="labels|icons"]`; the bar's CSS keys on it. A label is
+// therefore whole or absent, never cut ("H…", 1.0.2).
+export const BAR_ATTR = 'data-wb-bar';
+/**
+ * Pure: the mode for `items` in `available` px, with `gap` between items. Hysteresis: leaving icons
+ * mode needs 16px more room than staying in labels mode, so a bar never flaps at the threshold.
+ */
+export function barMode(items, available, gap, current, hysteresis = 16) {
+    if (!items.length || !items.some(item => item.labelWidth > 0))
+        return 'labels';
+    const need = items.reduce((sum, item) => sum + item.labelWidth + item.fixed, 0) + gap * Math.max(0, items.length - 1);
+    const room = current === 'icons' ? available - hysteresis : available;
+    return need <= room ? 'labels' : 'icons';
+}
+const px = (value) => { const n = parseFloat(value); return Number.isFinite(n) ? n : 0; };
+/** Measures on nav resize and font loads; writes the mode on <html>. Returns a stop function. */
+export function installBarMeasurer(win, options) {
+    const doc = win.document;
+    const canvas = doc.createElement('canvas');
+    const ctx = canvas.getContext('2d');
+    const textWidth = (text, font) => { if (!ctx)
+        return text.length * 8; ctx.font = font; return Math.ceil(ctx.measureText(text).width); };
+    let nav = null;
+    let frame = 0;
+    const measure = () => {
+        frame = 0;
+        const html = doc.documentElement;
+        if (options.when && !doc.querySelector(options.when)) {
+            html.removeAttribute(BAR_ATTR);
+            return;
+        }
+        if (!nav?.isConnected)
+            return;
+        const items = [...nav.querySelectorAll(`:scope > ${options.item}`)].filter(el => el.offsetParent !== null || el.getClientRects().length);
+        const measured = items.map(item => {
+            const label = item.querySelector(options.label);
+            const icon = item.querySelector(options.icon);
+            const pill = item.firstElementChild ?? item;
+            const ps = win.getComputedStyle(pill);
+            const fixed = px(ps.paddingLeft) + px(ps.paddingRight) + px(ps.borderLeftWidth) + px(ps.borderRightWidth) + (icon ? Math.max(icon.getBoundingClientRect().width, 20) : 0);
+            if (!label || !label.textContent?.trim())
+                return { labelWidth: 0, fixed };
+            const ls = win.getComputedStyle(label);
+            // The label's own font, read even while the label is display:none (computed styles resolve it).
+            const font = `${ls.fontStyle} ${ls.fontWeight} ${ls.fontSize} ${ls.fontFamily}`;
+            return { labelWidth: textWidth(label.textContent.trim(), font) + px(ls.marginLeft) + px(ls.marginRight) + 2, fixed };
+        });
+        const ns = win.getComputedStyle(nav);
+        const available = nav.clientWidth - px(ns.paddingLeft) - px(ns.paddingRight);
+        const current = html.getAttribute(BAR_ATTR);
+        const mode = barMode(measured, available, px(ns.columnGap) || 0, current);
+        if (current !== mode)
+            html.setAttribute(BAR_ATTR, mode);
+    };
+    const schedule = () => { if (!frame)
+        frame = win.requestAnimationFrame(measure); };
+    const Resize = win.ResizeObserver;
+    const sized = Resize ? new Resize(schedule) : null;
+    const attach = () => {
+        const found = doc.querySelector(options.nav);
+        if (found !== nav) {
+            if (nav)
+                sized?.unobserve(nav);
+            nav = found;
+            if (nav)
+                sized?.observe(nav);
+        }
+        schedule();
+    };
+    attach();
+    // The nav mounts late and is replaced on some navigations; items and fonts change rarely.
+    const timer = win.setInterval(attach, 1500);
+    const fonts = doc.fonts;
+    fonts?.addEventListener?.('loadingdone', schedule);
+    win.addEventListener('resize', schedule);
+    return () => { win.clearInterval(timer); sized?.disconnect(); fonts?.removeEventListener?.('loadingdone', schedule); win.removeEventListener('resize', schedule); if (frame)
+        win.cancelAnimationFrame(frame); doc.documentElement.removeAttribute(BAR_ATTR); };
+}
+//# sourceMappingURL=themeBar.js.map

package/dist/runtime/themeBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeBar.js","sourceRoot":"","sources":["../../../runtime/src/themeBar.ts"],"names":[],"mappings":"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","sourcesContent":["// Theme engine v3, step 9 (.omc/plans/theme-engine-v3.md 4.1): one bar component. Whether a bar's\n// items carry their labels is measured, never guessed from a width breakpoint: the sum of the whole\n// labels (text measured in the label's own font), icons, paddings and gaps against the room the items\n// have. The mode lands on `html[data-wb-bar=\"labels|icons\"]`; the bar's CSS keys on it. A label is\n// therefore whole or absent, never cut (\"H…\", 1.0.2).\n\nexport const BAR_ATTR = 'data-wb-bar';\nexport type BarMode = 'labels' | 'icons';\n\n/** One item as the measurer sees it: its label text and font, and the fixed parts around the label. */\nexport type BarItem = { label: string; font: string; fixed: number };\n\n/**\n * Pure: the mode for `items` in `available` px, with `gap` between items. Hysteresis: leaving icons\n * mode needs 16px more room than staying in labels mode, so a bar never flaps at the threshold.\n */\nexport function barMode(items: Array<{ labelWidth: number; fixed: number }>, available: number, gap: number, current: BarMode | null, hysteresis = 16): BarMode {\n  if (!items.length || !items.some(item => item.labelWidth > 0)) return 'labels';\n  const need = items.reduce((sum, item) => sum + item.labelWidth + item.fixed, 0) + gap * Math.max(0, items.length - 1);\n  const room = current === 'icons' ? available - hysteresis : available;\n  return need <= room ? 'labels' : 'icons';\n}\n\nexport type BarMeasurerOptions = {\n  /** The bar's item container (X: the nav). */\n  nav: string;\n  /** Items inside it, and inside an item its icon box and label box. */\n  item: string; icon: string; label: string;\n  /** Only while this matches (a bar layout is active). */\n  when?: string;\n};\n\nconst px = (value: string) => { const n = parseFloat(value); return Number.isFinite(n) ? n : 0; };\n\n/** Measures on nav resize and font loads; writes the mode on <html>. Returns a stop function. */\nexport function installBarMeasurer(win: Window, options: BarMeasurerOptions): () => void {\n  const doc = win.document;\n  const canvas = doc.createElement('canvas');\n  const ctx = canvas.getContext('2d');\n  const textWidth = (text: string, font: string) => { if (!ctx) return text.length * 8; ctx.font = font; return Math.ceil(ctx.measureText(text).width); };\n  let nav: Element | null = null;\n  let frame = 0;\n  const measure = () => {\n    frame = 0;\n    const html = doc.documentElement;\n    if (options.when && !doc.querySelector(options.when)) { html.removeAttribute(BAR_ATTR); return; }\n    if (!nav?.isConnected) return;\n    const items = [...nav.querySelectorAll(`:scope > ${options.item}`)].filter(el => (el as HTMLElement).offsetParent !== null || el.getClientRects().length);\n    const measured = items.map(item => {\n      const label = item.querySelector(options.label) as HTMLElement | null;\n      const icon = item.querySelector(options.icon) as HTMLElement | null;\n      const pill = (item.firstElementChild as HTMLElement | null) ?? (item as HTMLElement);\n      const ps = win.getComputedStyle(pill);\n      const fixed = px(ps.paddingLeft) + px(ps.paddingRight) + px(ps.borderLeftWidth) + px(ps.borderRightWidth) + (icon ? Math.max(icon.getBoundingClientRect().width, 20) : 0);\n      if (!label || !label.textContent?.trim()) return { labelWidth: 0, fixed };\n      const ls = win.getComputedStyle(label);\n      // The label's own font, read even while the label is display:none (computed styles resolve it).\n      const font = `${ls.fontStyle} ${ls.fontWeight} ${ls.fontSize} ${ls.fontFamily}`;\n      return { labelWidth: textWidth(label.textContent.trim(), font) + px(ls.marginLeft) + px(ls.marginRight) + 2, fixed };\n    });\n    const ns = win.getComputedStyle(nav);\n    const available = (nav as HTMLElement).clientWidth - px(ns.paddingLeft) - px(ns.paddingRight);\n    const current = (html.getAttribute(BAR_ATTR) as BarMode | null);\n    const mode = barMode(measured, available, px(ns.columnGap) || 0, current);\n    if (current !== mode) html.setAttribute(BAR_ATTR, mode);\n  };\n  const schedule = () => { if (!frame) frame = win.requestAnimationFrame(measure); };\n  const Resize = (win as Window & { ResizeObserver?: typeof ResizeObserver }).ResizeObserver;\n  const sized = Resize ? new Resize(schedule) : null;\n  const attach = () => {\n    const found = doc.querySelector(options.nav);\n    if (found !== nav) { if (nav) sized?.unobserve(nav); nav = found; if (nav) sized?.observe(nav); }\n    schedule();\n  };\n  attach();\n  // The nav mounts late and is replaced on some navigations; items and fonts change rarely.\n  const timer = win.setInterval(attach, 1500);\n  const fonts = (doc as Document & { fonts?: FontFaceSet }).fonts;\n  fonts?.addEventListener?.('loadingdone', schedule);\n  win.addEventListener('resize', schedule);\n  return () => { win.clearInterval(timer); sized?.disconnect(); fonts?.removeEventListener?.('loadingdone', schedule); win.removeEventListener('resize', schedule); if (frame) win.cancelAnimationFrame(frame); doc.documentElement.removeAttribute(BAR_ATTR); };\n}\n"]}

package/dist/runtime/themeChoice.d.ts

@@ -0,0 +1,52 @@
+import { type IconPack } from './themeIcons.ts';
+import { type Palette, type ThemeOverrides, type ThemeSpec } from './themeSpec.ts';
+/**
+ * What is persisted natively and handed to the page runtime. `icons` is the owner's icon pack (theme
+ * engine v2): absent follows the theme's suggestion, `site` keeps the site's own icons, else a pack id.
+ */
+export type ThemeChoice = {
+    preset: string;
+    accent: string | null;
+    overrides: ThemeOverrides;
+    themes: ThemeSpec[];
+    icons?: string;
+    packs?: IconPack[];
+};
+/** Icon packs the owner imported (standalone documents, kept with the choice so every site tab has them). */
+export declare const MAX_USER_PACKS = 8;
+/** Imported themes kept in a choice (the JSON Schema of the native side says the same). */
+export declare const MAX_USER_THEMES = 24;
+export type ThemeCatalog = {
+    /** The site's built-in themes; the first is its own look (and the default choice). */
+    builtins: readonly ThemeSpec[];
+    /** Nothing chosen: the first built-in theme, no customizations. */
+    defaultChoice: ThemeChoice;
+    /** Any JSON to a valid choice (imported themes sanitized, bounded and deduplicated; unknown ids fall back). */
+    normalize(input: unknown): ThemeChoice;
+    /** The theme document a choice refers to (built-in or imported), before overrides. */
+    base(choice: ThemeChoice): ThemeSpec;
+    /** The effective theme: the selected document with the panel's overrides and accent, legible. */
+    resolve(choice: ThemeChoice): ThemeSpec;
+    /** The effective palette: the theme's colors (or none for the site's own) with the accent override applied. */
+    palette(choice: ThemeChoice): Partial<Palette> | null;
+    /** Every theme that can be picked: the built-in ones, then the choice's imported ones. */
+    all(choice: ThemeChoice): ThemeSpec[];
+};
+export declare function createThemeCatalog(builtins: readonly ThemeSpec[]): ThemeCatalog;
+/** The choice a tab's theme id stands for (themeScopes: account and pane themes): the global choice itself, or that theme without customizations. */
+export declare function choiceForId(global: ThemeChoice, id: string): ThemeChoice;
+/** The shape persisted natively: empty groups are dropped so "no override" stays unambiguous. */
+export declare function serializeChoice(choice: ThemeChoice): {
+    packs?: IconPack[] | undefined;
+    icons?: string | undefined;
+    themes?: ThemeSpec[] | undefined;
+    overrides?: {
+        [k: string]: Record<string, string> | import("./themeSpec.ts").Background | Partial<import("./themeSpec.ts").ThemeColors> | (Partial<Omit<import("./themeSpec.ts").FontSpec, "roles">> & {
+            roles?: Partial<import("./themeSpec.ts").FontRoles>;
+        }) | Partial<import("./themeSpec.ts").ShapeSpec> | Partial<import("./themeSpec.ts").LayoutSpec> | Partial<import("./themeSpec.ts").EffectsSpec> | {
+            text: string;
+        };
+    } | undefined;
+    preset: string;
+    accent: string | null;
+};

package/dist/runtime/themeChoice.js

@@ -0,0 +1,69 @@
+// The owner's theme choice: which theme document is on (a built-in one or an imported one), the
+// panel's customizations on top of it and an accent override. Native code persists it and hands it
+// to every site tab; the shell's theme store and the panel edit it. A site brings its built-in
+// themes (`createThemeCatalog(builtins)`; the first one is the site's own look, the default). Pure.
+import { sanitizeIconPack } from "./themeIcons.js";
+import { applyOverrides, isHex, sanitizeSpec } from "./themeSpec.js";
+/** Icon packs the owner imported (standalone documents, kept with the choice so every site tab has them). */
+export const MAX_USER_PACKS = 8;
+/** Imported themes kept in a choice (the JSON Schema of the native side says the same). */
+export const MAX_USER_THEMES = 24;
+const OVERRIDE_GROUPS = ['colors', 'font', 'shape', 'layout', 'background', 'effects', 'css', 'variants'];
+export function createThemeCatalog(builtins) {
+    if (!builtins.length)
+        throw new Error('wayBetter themes: a site needs at least one built-in theme (its own look)');
+    const first = builtins[0];
+    const defaultChoice = { preset: first.id, accent: null, overrides: {}, themes: [] };
+    const isBuiltin = (id) => builtins.some(item => item.id === id);
+    function normalize(input) {
+        const source = input && typeof input === 'object' ? input : {};
+        const themes = [];
+        if (Array.isArray(source.themes)) {
+            for (const raw of source.themes.slice(0, MAX_USER_THEMES)) {
+                const theme = sanitizeSpec(raw);
+                if (!isBuiltin(theme.id) && !themes.some(item => item.id === theme.id))
+                    themes.push(theme);
+            }
+        }
+        const known = (id) => typeof id === 'string' && (isBuiltin(id) || themes.some(item => item.id === id));
+        const preset = known(source.preset) ? source.preset : first.id;
+        const accent = isHex(source.accent) ? source.accent.toLowerCase() : null;
+        const overrides = {};
+        const rawOverrides = source.overrides && typeof source.overrides === 'object' ? source.overrides : {};
+        for (const key of OVERRIDE_GROUPS) {
+            const value = rawOverrides[key];
+            if (value && typeof value === 'object' && !Array.isArray(value))
+                overrides[key] = value;
+        }
+        const icons = typeof source.icons === 'string' && /^[a-z0-9-]{1,40}$/.test(source.icons) && source.icons !== 'theme' ? source.icons : undefined;
+        const packs = [];
+        if (Array.isArray(source.packs)) {
+            for (const raw of source.packs.slice(0, MAX_USER_PACKS)) {
+                const pack = sanitizeIconPack(raw);
+                if (pack && !packs.some(item => item.id === pack.id))
+                    packs.push(pack);
+            }
+        }
+        return { preset, accent, overrides, themes, ...(icons ? { icons } : {}), ...(packs.length ? { packs } : {}) };
+    }
+    const base = (choice) => choice.themes.find(item => item.id === choice.preset) ?? builtins.find(item => item.id === choice.preset) ?? first;
+    const resolve = (choice) => applyOverrides(base(choice), choice.overrides, choice.accent);
+    function palette(choice) {
+        const theme = resolve(choice);
+        if (theme.colors)
+            return theme.colors;
+        return choice.accent ? { accent: choice.accent } : null;
+    }
+    const all = (choice) => [...builtins, ...choice.themes];
+    return { builtins, defaultChoice, normalize, base, resolve, palette, all };
+}
+/** The choice a tab's theme id stands for (themeScopes: account and pane themes): the global choice itself, or that theme without customizations. */
+export function choiceForId(global, id) {
+    return id === global.preset ? global : { preset: id, accent: null, overrides: {}, themes: global.themes, ...(global.icons ? { icons: global.icons } : {}), ...(global.packs?.length ? { packs: global.packs } : {}) };
+}
+/** The shape persisted natively: empty groups are dropped so "no override" stays unambiguous. */
+export function serializeChoice(choice) {
+    const overrides = Object.fromEntries(Object.entries(choice.overrides).filter(([, value]) => value && Object.keys(value).length));
+    return { preset: choice.preset, accent: choice.accent, ...(Object.keys(overrides).length ? { overrides } : {}), ...(choice.themes.length ? { themes: choice.themes } : {}), ...(choice.icons ? { icons: choice.icons } : {}), ...(choice.packs?.length ? { packs: choice.packs } : {}) };
+}
+//# sourceMappingURL=themeChoice.js.map

package/dist/runtime/themeChoice.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeChoice.js","sourceRoot":"","sources":["../../../runtime/src/themeChoice.ts"],"names":[],"mappings":"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","sourcesContent":["// The owner's theme choice: which theme document is on (a built-in one or an imported one), the\n// panel's customizations on top of it and an accent override. Native code persists it and hands it\n// to every site tab; the shell's theme store and the panel edit it. A site brings its built-in\n// themes (`createThemeCatalog(builtins)`; the first one is the site's own look, the default). Pure.\n\nimport { sanitizeIconPack, type IconPack } from './themeIcons.ts';\nimport { applyOverrides, isHex, sanitizeSpec, type Palette, type ThemeOverrides, type ThemeSpec } from './themeSpec.ts';\n\n/**\n * What is persisted natively and handed to the page runtime. `icons` is the owner's icon pack (theme\n * engine v2): absent follows the theme's suggestion, `site` keeps the site's own icons, else a pack id.\n */\nexport type ThemeChoice = { preset: string; accent: string | null; overrides: ThemeOverrides; themes: ThemeSpec[]; icons?: string; packs?: IconPack[] };\n\n/** Icon packs the owner imported (standalone documents, kept with the choice so every site tab has them). */\nexport const MAX_USER_PACKS = 8;\n\n/** Imported themes kept in a choice (the JSON Schema of the native side says the same). */\nexport const MAX_USER_THEMES = 24;\nconst OVERRIDE_GROUPS = ['colors', 'font', 'shape', 'layout', 'background', 'effects', 'css', 'variants'] as const;\n\nexport type ThemeCatalog = {\n  /** The site's built-in themes; the first is its own look (and the default choice). */\n  builtins: readonly ThemeSpec[];\n  /** Nothing chosen: the first built-in theme, no customizations. */\n  defaultChoice: ThemeChoice;\n  /** Any JSON to a valid choice (imported themes sanitized, bounded and deduplicated; unknown ids fall back). */\n  normalize(input: unknown): ThemeChoice;\n  /** The theme document a choice refers to (built-in or imported), before overrides. */\n  base(choice: ThemeChoice): ThemeSpec;\n  /** The effective theme: the selected document with the panel's overrides and accent, legible. */\n  resolve(choice: ThemeChoice): ThemeSpec;\n  /** The effective palette: the theme's colors (or none for the site's own) with the accent override applied. */\n  palette(choice: ThemeChoice): Partial<Palette> | null;\n  /** Every theme that can be picked: the built-in ones, then the choice's imported ones. */\n  all(choice: ThemeChoice): ThemeSpec[];\n};\n\nexport function createThemeCatalog(builtins: readonly ThemeSpec[]): ThemeCatalog {\n  if (!builtins.length) throw new Error('wayBetter themes: a site needs at least one built-in theme (its own look)');\n  const first = builtins[0]!;\n  const defaultChoice: ThemeChoice = { preset: first.id, accent: null, overrides: {}, themes: [] };\n  const isBuiltin = (id: unknown) => builtins.some(item => item.id === id);\n\n  function normalize(input: unknown): ThemeChoice {\n    const source = input && typeof input === 'object' ? input as Record<string, unknown> : {};\n    const themes: ThemeSpec[] = [];\n    if (Array.isArray(source.themes)) {\n      for (const raw of source.themes.slice(0, MAX_USER_THEMES)) {\n        const theme = sanitizeSpec(raw);\n        if (!isBuiltin(theme.id) && !themes.some(item => item.id === theme.id)) themes.push(theme);\n      }\n    }\n    const known = (id: unknown) => typeof id === 'string' && (isBuiltin(id) || themes.some(item => item.id === id));\n    const preset = known(source.preset) ? source.preset as string : first.id;\n    const accent = isHex(source.accent) ? source.accent.toLowerCase() : null;\n    const overrides: ThemeOverrides = {};\n    const rawOverrides = source.overrides && typeof source.overrides === 'object' ? source.overrides as Record<string, unknown> : {};\n    for (const key of OVERRIDE_GROUPS) {\n      const value = rawOverrides[key];\n      if (value && typeof value === 'object' && !Array.isArray(value)) (overrides as Record<string, unknown>)[key] = value;\n    }\n    const icons = typeof source.icons === 'string' && /^[a-z0-9-]{1,40}$/.test(source.icons) && source.icons !== 'theme' ? source.icons : undefined;\n    const packs: IconPack[] = [];\n    if (Array.isArray(source.packs)) {\n      for (const raw of source.packs.slice(0, MAX_USER_PACKS)) {\n        const pack = sanitizeIconPack(raw);\n        if (pack && !packs.some(item => item.id === pack.id)) packs.push(pack);\n      }\n    }\n    return { preset, accent, overrides, themes, ...(icons ? { icons } : {}), ...(packs.length ? { packs } : {}) };\n  }\n\n  const base = (choice: ThemeChoice) => choice.themes.find(item => item.id === choice.preset) ?? builtins.find(item => item.id === choice.preset) ?? first;\n  const resolve = (choice: ThemeChoice) => applyOverrides(base(choice), choice.overrides, choice.accent);\n  function palette(choice: ThemeChoice): Partial<Palette> | null {\n    const theme = resolve(choice);\n    if (theme.colors) return theme.colors;\n    return choice.accent ? { accent: choice.accent } : null;\n  }\n  const all = (choice: ThemeChoice) => [...builtins, ...choice.themes];\n  return { builtins, defaultChoice, normalize, base, resolve, palette, all };\n}\n\n/** The choice a tab's theme id stands for (themeScopes: account and pane themes): the global choice itself, or that theme without customizations. */\nexport function choiceForId(global: ThemeChoice, id: string): ThemeChoice {\n  return id === global.preset ? global : { preset: id, accent: null, overrides: {}, themes: global.themes, ...(global.icons ? { icons: global.icons } : {}), ...(global.packs?.length ? { packs: global.packs } : {}) };\n}\n\n/** The shape persisted natively: empty groups are dropped so \"no override\" stays unambiguous. */\nexport function serializeChoice(choice: ThemeChoice) {\n  const overrides = Object.fromEntries(Object.entries(choice.overrides).filter(([, value]) => value && Object.keys(value).length));\n  return { preset: choice.preset, accent: choice.accent, ...(Object.keys(overrides).length ? { overrides } : {}), ...(choice.themes.length ? { themes: choice.themes } : {}), ...(choice.icons ? { icons: choice.icons } : {}), ...(choice.packs?.length ? { packs: choice.packs } : {}) };\n}\n"]}