waybetter 0.1.0 → 0.6.0

package/dist/runtime/themeSpec.js

@@ -0,0 +1,439 @@
+// Theme documents: a wayBetter theme is a JSON document (like a BetterDiscord theme, but data instead
+// of a stylesheet) describing colors, type, shape, density, layout, background and motion; the format
+// is `theme.schema.json` in the `waybetter` package. This module is the document side of the theme
+// engine: types, the schema's defaults, sanitizing, import, panel overrides, legibility, font roles
+// and stacks, and page backgrounds. Pure, so it runs in the page runtime, the settings previews and
+// the tests. What a theme does to one site's page (its selectors, its palette) is the site's
+// (themeRuntime.ts takes a site adapter).
+//
+// Safety: a theme is sanitized field by field before it becomes CSS. Colors are six-digit hex,
+// numbers are clamped, enums are fixed, font names match a strict pattern, background images are
+// `data:image/*;base64` only, and CSS is built from those values (never concatenated from raw
+// strings). The single escape hatch is `css`, which is the same trust level as the owner's own
+// Custom CSS and is shown as such when a theme is imported.
+//
+// Fonts: sites usually block remote and `data:` fonts (CSP `font-src`), so a theme may name installed
+// system fonts, "Geist" / "Geist Mono" (bundled and registered from bytes: `FontFace(ArrayBuffer)` is
+// not a fetch), or Google Fonts families the owner downloaded (`source: "google"`, fonts.ts).
+import { FONT_ROLE_NAMES, MONO_FAMILIES, contrastRatio, hexToRgb, mix, relativeLuminance } from "./themeApi.js";
+import { deriveColors } from "./themeTokens.js";
+import { ACTION_NAMES, sanitizeComponents } from "./themeComponents.js";
+import { sanitizeDecor } from "./themeDecor.js";
+import { sanitizeThemeIcons } from "./themeIcons.js";
+import { sanitizeVariants } from "./themeVariants.js";
+export { FONT_ROLE_NAMES } from "./themeApi.js";
+// ---------------------------------------------------------------------------------------------
+// The schema's defaults: a theme that sets nothing changes nothing (the site keeps its own geometry;
+// a site's structure CSS only emits rules where a theme differs from these).
+export const BASE_SHAPE = { radius: 16, button: 9999, avatar: 'circle' };
+export const INHERIT_ROLES = { interface: 'inherit', post: 'inherit', heading: 'inherit', numbers: 'inherit', mono: 'inherit', chrome: 'inherit', dialog: 'inherit' };
+/** A font spec from the interface/post stacks alone (every other role inherits). */
+export const withRoles = (font) => ({
+    ...font,
+    roles: { ...INHERIT_ROLES, ...(font.family.length ? { interface: { family: font.family } } : {}), ...(font.tweet.length ? { post: { family: font.tweet } } : {}) },
+});
+export const BASE_FONT = withRoles({ family: [], tweet: [], scale: 1, weight: 400, bold: 700, tracking: 0, leading: 0 });
+export const BASE_LAYOUT = { column: 600, sidebar: 350, density: 'default', cards: false, frame: false };
+export const BASE_EFFECTS = { motion: 0, hover: 'none', shadow: 'none', crt: false };
+/** The system UI stack themes put after their own sans-serif families. */
+export const SYSTEM_SANS = ['Segoe UI', '-apple-system', 'BlinkMacSystemFont', 'system-ui', 'sans-serif'];
+// ---------------------------------------------------------------------------------------------
+// Colors and contrast (luminance and ratios: themeApi.ts)
+export const isHex = (value) => typeof value === 'string' && /^#[0-9a-f]{6}$/i.test(value);
+/** `#rrggbb` + alpha as `rgba()`. */
+export const rgba = (hex, alpha) => `rgba(${hexToRgb(hex).join(', ')}, ${+alpha.toFixed(3)})`;
+/** Moves `color` toward black or white until it reaches `ratio` against every surface. */
+export function reach(color, surfaces, ratio) {
+    const worst = (c) => Math.min(...surfaces.map(s => contrastRatio(c, s)));
+    if (worst(color) >= ratio)
+        return color;
+    const lightSurfaces = surfaces.reduce((sum, s) => sum + relativeLuminance(s), 0) / surfaces.length > 0.18;
+    const pole = lightSurfaces ? '#000000' : '#ffffff';
+    for (let t = 0.04; t <= 1; t += 0.04) {
+        const next = mix(color, pole, t);
+        if (worst(next) >= ratio)
+            return next;
+    }
+    return pole;
+}
+/**
+ * Guarantees legibility for any palette (built-in, imported or overridden): text, secondary text
+ * and links reach WCAG AA (4.5:1) on every surface, including the page canvas, and the site's filled
+ * button keeps a readable label and stands out from the page (3:1).
+ */
+export function ensureContrast(colors) {
+    const surfaces = [colors.bg, colors.surface, colors.elevated, ...(colors.page ? [colors.page] : [])];
+    const out = { ...colors };
+    out.text = reach(colors.text, surfaces, 7);
+    out.muted = reach(colors.muted, surfaces, 4.5);
+    // Links live inside the columns, never on the page canvas.
+    out.accent = reach(colors.accent, [colors.bg, colors.surface, colors.elevated], 4.5);
+    const inverse = colors.inverse ?? out.text;
+    const onInverse = colors.onInverse ?? colors.bg;
+    out.inverse = reach(inverse, [colors.bg], 3);
+    out.onInverse = reach(onInverse, [out.inverse], 4.5);
+    // Action colors are icons and counts: non-text contrast on the column and on a raised row.
+    if (colors.actions)
+        out.actions = Object.fromEntries(Object.entries(colors.actions).map(([name, color]) => [name, reach(color, [colors.bg, colors.surface], 3)]));
+    return out;
+}
+// ---------------------------------------------------------------------------------------------
+// Sanitizing
+const GENERIC_FONTS = new Set(['system-ui', 'sans-serif', 'serif', 'monospace', 'cursive', 'ui-sans-serif', 'ui-serif', 'ui-monospace', 'ui-rounded', '-apple-system', 'BlinkMacSystemFont']);
+const FONT_NAME = /^[A-Za-z0-9][A-Za-z0-9 .\-]{0,47}$/;
+const DATA_IMAGE = /^data:image\/(png|jpeg|webp|gif|avif);base64,[A-Za-z0-9+/]+={0,2}$/;
+export const MAX_IMAGE_CHARS = 1_100_000;
+export const MAX_CSS_CHARS = 60_000;
+const PATTERNS = ['dots', 'grid', 'diagonal', 'scanlines', 'paper', 'clouds'];
+const obj = (value) => value && typeof value === 'object' && !Array.isArray(value) ? value : {};
+const num = (value, min, max, fallback) => typeof value === 'number' && Number.isFinite(value) ? Math.min(max, Math.max(min, value)) : fallback;
+const pick = (value, options, fallback) => options.includes(value) ? value : fallback;
+const text = (value, max, fallback = '') => typeof value === 'string' ? value.replace(/[\u0000-\u001f\u007f]/g, '').trim().slice(0, max) : fallback;
+export function sanitizeFonts(value) {
+    if (!Array.isArray(value))
+        return [];
+    return value.filter((name) => typeof name === 'string' && (GENERIC_FONTS.has(name) || FONT_NAME.test(name))).slice(0, 8);
+}
+/** A theme needs its background, text and accent; any other role it leaves out is derived from the
+ * base structure (themeTokens.ts `deriveColors`), so every theme has the same proportions. */
+function sanitizeColors(value) {
+    const source = obj(value);
+    if (!['bg', 'text', 'accent'].every(role => isHex(source[role])))
+        return null;
+    const named = Object.fromEntries(['bg', 'surface', 'elevated', 'border', 'text', 'muted', 'accent']
+        .filter(role => isHex(source[role])).map(role => [role, source[role].toLowerCase()]));
+    const colors = deriveColors(named);
+    for (const role of ['inverse', 'onInverse', 'page'])
+        if (isHex(source[role]))
+            colors[role] = source[role].toLowerCase();
+    const actions = obj(source.actions);
+    const named_actions = Object.fromEntries(ACTION_NAMES.filter(name => isHex(actions[name])).map(name => [name, actions[name].toLowerCase()]));
+    if (Object.keys(named_actions).length)
+        colors.actions = named_actions;
+    return colors;
+}
+export function sanitizeBackground(value) {
+    const source = obj(value);
+    if (source.kind === 'gradient' && isHex(source.from) && isHex(source.to)) {
+        return { kind: 'gradient', from: source.from.toLowerCase(), to: source.to.toLowerCase(), angle: Math.round(num(source.angle, 0, 360, 180)), ...(isHex(source.glow) ? { glow: source.glow.toLowerCase() } : {}) };
+    }
+    if (source.kind === 'pattern' && isHex(source.ink)) {
+        return { kind: 'pattern', pattern: pick(source.pattern, PATTERNS, 'dots'), ink: source.ink.toLowerCase(), opacity: num(source.opacity, 0, 0.6, 0.1), size: Math.round(num(source.size, 2, 400, 24)) };
+    }
+    if (source.kind === 'image' && typeof source.url === 'string' && source.url.length <= MAX_IMAGE_CHARS && DATA_IMAGE.test(source.url)) {
+        return { kind: 'image', url: source.url, fit: pick(source.fit, ['cover', 'tile'], 'cover'), dim: num(source.dim, 0.35, 0.95, 0.6) };
+    }
+    return { kind: 'none' };
+}
+/** Bounds of a role's own settings (the JSON Schema says the same; tested). */
+export const ROLE_LIMITS = { weight: [100, 900], size: [0.75, 1.5], tracking: [-0.05, 0.1] };
+/** One role from JSON: "inherit", or a stack with optional extras (clamped; unknown keys dropped). */
+export function sanitizeFontRole(value, role) {
+    if (value === 'inherit' || value === null || value === undefined)
+        return 'inherit';
+    const source = obj(value);
+    if (!Object.keys(source).length)
+        return 'inherit';
+    const family = sanitizeFonts(source.family);
+    const out = { family };
+    if (source.source === 'google' && family.length && !GENERIC_FONTS.has(family[0]))
+        out.source = 'google';
+    if (role !== 'interface') {
+        if (typeof source.weight === 'number' && Number.isFinite(source.weight))
+            out.weight = Math.round(num(source.weight, ...ROLE_LIMITS.weight, 400));
+        if (typeof source.size === 'number' && Number.isFinite(source.size))
+            out.size = +num(source.size, ...ROLE_LIMITS.size, 1).toFixed(3);
+        if (typeof source.tracking === 'number' && Number.isFinite(source.tracking))
+            out.tracking = +num(source.tracking, ...ROLE_LIMITS.tracking, 0).toFixed(4);
+        if (source.tabular === true)
+            out.tabular = true;
+    }
+    // A role that changes nothing is the same as inheriting.
+    return Object.keys(out).length === 1 && !family.length ? 'inherit' : out;
+}
+const roleFamily = (role) => role === 'inherit' ? [] : role.family;
+/** A role with a new family, keeping its other settings (and its Google source only for the same font). */
+export function withFamily(role, family, source) {
+    const rest = role === 'inherit' ? {} : { ...role };
+    delete rest.source;
+    delete rest.family;
+    const next = { ...rest, family, ...(source && family.length ? { source } : {}) };
+    return Object.keys(next).length === 1 && !family.length ? 'inherit' : next;
+}
+/**
+ * The roles of a font group from JSON over `base`: `roles.<name>` wins; the legacy shorthand
+ * (`family` → interface, `tweet` → post) applies when that role is not named, so theme files and
+ * saved customizations from before font roles keep working.
+ */
+function sanitizeRoles(source, base) {
+    const named = obj(source.roles);
+    const roles = { ...base.roles };
+    for (const role of FONT_ROLE_NAMES)
+        if (role in named)
+            roles[role] = sanitizeFontRole(named[role], role);
+    if (!('interface' in named) && 'family' in source)
+        roles.interface = withFamily(base.roles.interface, sanitizeFonts(source.family), sameFirst(source.family, base.roles.interface));
+    if (!('post' in named) && 'tweet' in source)
+        roles.post = withFamily(base.roles.post, sanitizeFonts(source.tweet), sameFirst(source.tweet, base.roles.post));
+    return roles;
+}
+/** Keeps a role's Google source when the shorthand still names the same first family. */
+function sameFirst(stack, role) {
+    return role !== 'inherit' && role.source === 'google' && Array.isArray(stack) && stack[0] === role.family[0] ? 'google' : undefined;
+}
+function sanitizeFont(value, base) {
+    const source = obj(value);
+    const roles = sanitizeRoles(source, base);
+    return {
+        family: roleFamily(roles.interface),
+        tweet: roleFamily(roles.post),
+        roles,
+        scale: num(source.scale, 0.85, 1.2, base.scale),
+        weight: Math.round(num(source.weight, 300, 500, base.weight)),
+        bold: Math.round(num(source.bold, 500, 800, base.bold)),
+        tracking: num(source.tracking, -0.03, 0.06, base.tracking),
+        leading: source.leading === 0 ? 0 : num(source.leading, 1.2, 1.8, base.leading),
+    };
+}
+const sanitizeShape = (value, base) => {
+    const source = obj(value);
+    return { radius: Math.round(num(source.radius, 0, 28, base.radius)), button: Math.round(num(source.button, 0, 9999, base.button)), avatar: pick(source.avatar, ['circle', 'rounded', 'square'], base.avatar) };
+};
+const sanitizeLayout = (value, base) => {
+    const source = obj(value);
+    return {
+        column: Math.round(num(source.column, 520, 820, base.column)), sidebar: Math.round(num(source.sidebar, 290, 400, base.sidebar)),
+        density: pick(source.density, ['compact', 'default', 'comfortable'], base.density),
+        cards: typeof source.cards === 'boolean' ? source.cards : base.cards, frame: typeof source.frame === 'boolean' ? source.frame : base.frame,
+    };
+};
+const sanitizeEffects = (value, base) => {
+    const source = obj(value);
+    return {
+        motion: Math.round(num(source.motion, 0, 400, base.motion)), hover: pick(source.hover, ['none', 'tint', 'lift', 'glow'], base.hover),
+        shadow: pick(source.shadow, ['none', 'soft', 'deep'], base.shadow), crt: typeof source.crt === 'boolean' ? source.crt : base.crt,
+    };
+};
+export const slug = (value) => value.toLowerCase().normalize('NFKD').replace(/[^a-z0-9]+/g, '-').replace(/^-+|-+$/g, '').slice(0, 40) || 'theme';
+/** Any JSON to a complete, safe theme. Missing groups fall back to the schema's defaults. */
+export function sanitizeSpec(input) {
+    const source = obj(input);
+    const name = text(source.name, 60) || 'Untitled theme';
+    const id = typeof source.id === 'string' && /^[a-z0-9-]{1,40}$/.test(source.id) ? source.id : slug(name);
+    return {
+        id, name, description: text(source.description, 200), author: text(source.author, 60), version: 1,
+        mode: pick(source.mode, ['light', 'dark', 'auto'], 'auto'),
+        colors: sanitizeColors(source.colors),
+        font: sanitizeFont(source.font, BASE_FONT),
+        shape: sanitizeShape(source.shape, BASE_SHAPE),
+        layout: sanitizeLayout(source.layout, BASE_LAYOUT),
+        background: sanitizeBackground(source.background),
+        effects: sanitizeEffects(source.effects, BASE_EFFECTS),
+        css: typeof source.css === 'string' ? source.css.slice(0, MAX_CSS_CHARS) : '',
+        ...structureGroups(source),
+    };
+}
+/** The optional structure groups of a theme, each present only when it says something valid. */
+function structureGroups(source) {
+    const components = sanitizeComponents(source.components), variants = sanitizeVariants(source.variants);
+    const decor = sanitizeDecor(source.decor), icons = sanitizeThemeIcons(source.icons);
+    return { ...(components ? { components } : {}), ...(variants ? { variants } : {}), ...(decor ? { decor } : {}), ...(icons ? { icons } : {}) };
+}
+/** True when a theme carries any of the structure groups (components, variants, decoration, icons). */
+export const hasStructure = (theme) => !!(theme.components || theme.variants || theme.decor || theme.icons);
+/** Parses an imported file; errors are human-readable. */
+export function parseThemeJson(json) {
+    let raw;
+    try {
+        raw = JSON.parse(json);
+    }
+    catch {
+        return { error: 'This file is not valid JSON.' };
+    }
+    const source = obj(raw);
+    if (typeof source.name !== 'string' || !source.name.trim())
+        return { error: 'A theme needs a "name".' };
+    const theme = sanitizeSpec(raw);
+    const warnings = [];
+    if (source.colors !== undefined && source.colors !== null && !theme.colors)
+        warnings.push('Colors were ignored: bg, text and accent must be #rrggbb (the other roles are derived when missing).');
+    if (theme.css)
+        warnings.push('Contains custom CSS, which runs inside the site like your own Custom CSS.');
+    if (source.background && theme.background.kind === 'none' && obj(source.background).kind !== 'none')
+        warnings.push('The background was ignored (images must be data:image/png, jpeg, webp, gif or avif, up to about 800 KB).');
+    if (theme.colors) {
+        const fixed = ensureContrast(theme.colors);
+        if (fixed.text !== theme.colors.text || fixed.muted !== theme.colors.muted || fixed.accent !== theme.colors.accent)
+            warnings.push('Some text colors were adjusted to stay readable.');
+    }
+    return { theme, warnings };
+}
+/** Applies panel overrides (and an accent) on top of a theme. Colors are then made legible. */
+export function applyOverrides(theme, overrides = {}, accent = null) {
+    const o = obj(overrides);
+    let colors = theme.colors ? { ...theme.colors, ...Object.fromEntries(Object.entries(obj(o.colors)).filter(([, v]) => isHex(v))) } : null;
+    if (colors && accent)
+        colors = { ...colors, accent, ...(theme.colors?.inverse === theme.colors?.accent ? { inverse: accent } : {}) };
+    return {
+        ...theme,
+        colors: colors ? ensureContrast(colors) : null,
+        // Missing keys fall back to the theme's own; the legacy `family`/`tweet` shorthand still overrides.
+        font: o.font ? sanitizeFont(o.font, theme.font) : theme.font,
+        shape: o.shape ? sanitizeShape({ ...theme.shape, ...o.shape }, theme.shape) : theme.shape,
+        layout: o.layout ? sanitizeLayout({ ...theme.layout, ...o.layout }, theme.layout) : theme.layout,
+        background: o.background ? sanitizeBackground(o.background) : theme.background,
+        effects: o.effects ? sanitizeEffects({ ...theme.effects, ...o.effects }, theme.effects) : theme.effects,
+        css: o.css && typeof o.css.text === 'string' ? o.css.text.slice(0, MAX_CSS_CHARS) : theme.css,
+        ...variantOverrides(theme, o.variants),
+    };
+}
+/** A theme's variants with the owner's per-axis say on top (the raw merge goes through the sanitizer, so the site's own option removes the axis). */
+function variantOverrides(theme, overrides) {
+    if (!overrides || typeof overrides !== 'object')
+        return {};
+    const variants = sanitizeVariants({ ...theme.variants, ...overrides });
+    return { variants: variants ?? undefined };
+}
+/** True when a theme changes nothing about the site (the site's own look without overrides). */
+export function isNeutral(theme) {
+    return !theme.colors && JSON.stringify([theme.font, theme.shape, theme.layout, theme.effects]) === JSON.stringify([BASE_FONT, BASE_SHAPE, BASE_LAYOUT, BASE_EFFECTS])
+        && theme.background.kind === 'none' && !theme.css && !hasStructure(theme);
+}
+// ---------------------------------------------------------------------------------------------
+// Fonts
+/** Bundled families and the names they are registered under (shell: @fontsource; site pages: FontFace, fonts.ts). */
+export const BUNDLED_FONTS = { 'Geist': 'Geist Variable', 'Geist Mono': 'Geist Mono Variable' };
+export function fontStack(names) {
+    const out = [];
+    for (const name of names) {
+        const real = BUNDLED_FONTS[name];
+        if (real)
+            out.push(`"${real}"`);
+        out.push(GENERIC_FONTS.has(name) ? name : `"${name}"`);
+    }
+    // Emoji and CJK keep working whatever the theme names.
+    return [...new Set(out), '"Segoe UI Emoji"', '"Apple Color Emoji"', 'sans-serif'].join(', ');
+}
+/** Roles that are drawn inside the site's page (chrome is wayBetter's own window). */
+export const PAGE_ROLES = ['interface', 'post', 'heading', 'numbers', 'mono', 'dialog'];
+const rolesUsing = (theme, roles) => roles.flatMap(role => roleFamily(theme.font.roles[role]));
+/** Bundled families (Geist, Geist Mono) a theme names in the site's page. */
+export const bundledFontsUsed = (theme, roles = PAGE_ROLES) => {
+    const names = new Set(rolesUsing(theme, roles));
+    return Object.keys(BUNDLED_FONTS).filter(name => names.has(name));
+};
+/** Google Fonts families a theme uses (`source: "google"`), for the given roles. */
+export function googleFontsUsed(theme, roles = FONT_ROLE_NAMES) {
+    const out = new Set();
+    for (const role of roles) {
+        const spec = theme.font.roles[role];
+        if (spec !== 'inherit' && spec.source === 'google' && spec.family[0])
+            out.add(spec.family[0]);
+    }
+    return [...out];
+}
+/**
+ * Every role resolved. `site` is the stack an inheriting interface uses: the site's own font in its
+ * page, wayBetter's own UI font in the shell. Every other role inherits the interface, except that an
+ * inheriting `mono` keeps a monospaced stack (`mono`: themeApi.ts `MONO_FAMILIES`, code rarely suits
+ * an interface font).
+ */
+export function resolveFontRoles(font, site, mono = fontStack(MONO_FAMILIES)) {
+    const base = font.roles.interface;
+    const baseFamily = roleFamily(base);
+    const root = {
+        stack: baseFamily.length ? fontStack(baseFamily) : site, family: baseFamily, inherited: !baseFamily.length,
+        google: base !== 'inherit' && base.source === 'google' ? baseFamily[0] ?? null : null,
+        weight: null, size: 1, tracking: null, tabular: false,
+    };
+    const out = { interface: root };
+    for (const role of FONT_ROLE_NAMES) {
+        if (role === 'interface')
+            continue;
+        const spec = font.roles[role];
+        const own = roleFamily(spec);
+        const from = own.length
+            ? { stack: fontStack(own), family: own, inherited: false, google: spec !== 'inherit' && spec.source === 'google' ? own[0] : null }
+            : role === 'mono' ? { stack: mono, family: [], inherited: true, google: null }
+                : { stack: root.stack, family: root.family, inherited: true, google: root.google };
+        out[role] = {
+            ...from,
+            weight: spec === 'inherit' ? null : spec.weight ?? null,
+            size: spec === 'inherit' ? 1 : spec.size ?? 1,
+            tracking: spec === 'inherit' ? null : spec.tracking ?? null,
+            tabular: spec !== 'inherit' && !!spec.tabular,
+        };
+    }
+    return out;
+}
+/** Font choices offered by the panel; any installed family can also be named in theme JSON. */
+export const FONT_CHOICES = [
+    { id: 'geist', label: 'Geist', family: ['Geist', ...SYSTEM_SANS] },
+    { id: 'geist-mono', label: 'Geist Mono', family: ['Geist Mono', 'Cascadia Mono', 'Consolas', 'Menlo', 'ui-monospace', 'monospace'] },
+    { id: 'system', label: 'System UI', key: 'wb.fonts.choice.system', family: SYSTEM_SANS },
+    { id: 'helvetica', label: 'Helvetica / Arial', family: ['Helvetica Neue', 'Helvetica', 'Arial', 'sans-serif'] },
+    { id: 'humanist', label: 'Humanist (Segoe, Avenir)', key: 'wb.fonts.choice.humanist', family: ['Avenir Next', 'Segoe UI Variable Text', 'Segoe UI', 'sans-serif'] },
+    { id: 'rounded', label: 'Rounded', key: 'wb.fonts.choice.rounded', family: ['ui-rounded', 'SF Pro Rounded', 'Nunito', 'Bahnschrift', 'Segoe UI', 'sans-serif'] },
+    { id: 'serif', label: 'Serif (Charter, Georgia)', key: 'wb.fonts.choice.serif', family: ['Charter', 'Iowan Old Style', 'Georgia', 'Cambria', 'serif'] },
+    { id: 'mono', label: 'System mono', key: 'wb.fonts.choice.mono', family: ['Cascadia Mono', 'SF Mono', 'Consolas', 'Menlo', 'ui-monospace', 'monospace'] },
+];
+/** The choice whose stack is exactly `family` in `choices`, or `custom`. */
+export const fontChoiceOf = (family, choices = FONT_CHOICES) => choices.find(choice => choice.family.join('|') === family.join('|'))?.id ?? 'custom';
+// ---------------------------------------------------------------------------------------------
+// Backgrounds
+const svgUrl = (svg) => `url("data:image/svg+xml,${encodeURIComponent(svg)}")`;
+/**
+ * The site's page background. A site's `<html>` and `<body>` are often one viewport tall while the
+ * content overflows them (X's timeline), so a background painted on both had `<body>` paint its own
+ * copy over its box, which scrolls away: after a partial scroll the gradient/glow showed only below a hard seam. Now
+ * `<html>` holds the plain page color, `<body>` is transparent (beating, by specificity, the
+ * palette's `html,body{background-color}` and its `[style^="background-color: …"]` remap of the
+ * inline color X puts on `<body>`) and every layer sits on one viewport-sized fixed
+ * layer behind all of the page (`z-index:-1` in the root stacking context), with no `fixed` attachments.
+ */
+export function pageBackgroundCss(background, page) {
+    const out = [`html:root{background:${page} !important}`, `html:root body{background:transparent !important}`];
+    if (background.kind !== 'none') {
+        out.push(`html:root::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;contain:strict;background:${backgroundLayers(background, page, false)}}`);
+    }
+    return out;
+}
+/**
+ * CSS `background` layers for the page canvas (behind the site's columns). `attach` keeps the `fixed`
+ * attachments for a box that scrolls (the Theme Builder preview); the site's page gets the layers without
+ * them, on one viewport-sized fixed layer (`pageBackgroundCss`).
+ */
+export function backgroundLayers(background, page, attach = true) {
+    const fixed = attach ? ' fixed' : '';
+    switch (background.kind) {
+        case 'gradient': {
+            const glow = background.glow ? `radial-gradient(1200px 600px at 50% -10%, ${rgba(background.glow, 0.55)}, transparent 70%), ` : '';
+            return `${glow}linear-gradient(${background.angle}deg, ${background.from}, ${background.to})${fixed}, ${page}`;
+        }
+        case 'pattern': {
+            const { ink, opacity: a, size: s } = background;
+            const c = rgba(ink, a);
+            switch (background.pattern) {
+                case 'dots': return `radial-gradient(${c} 1px, transparent 1.6px) 0 0 / ${s}px ${s}px, ${page}`;
+                case 'grid': return `linear-gradient(${c} 1px, transparent 1px) 0 0 / ${s}px ${s}px, linear-gradient(90deg, ${c} 1px, transparent 1px) 0 0 / ${s}px ${s}px, ${page}`;
+                case 'diagonal': return `repeating-linear-gradient(135deg, ${c} 0 1px, transparent 1px ${s}px), ${page}`;
+                case 'scanlines': return `repeating-linear-gradient(0deg, ${c} 0 1px, transparent 1px ${s}px), radial-gradient(ellipse at 50% 40%, ${rgba(ink, a * 1.6)}, transparent 70%)${fixed}, ${page}`;
+                case 'paper': return `${svgUrl(`<svg xmlns="http://www.w3.org/2000/svg" width="${s}" height="${s}"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency=".85" numOctaves="3" stitchTiles="stitch"/><feColorMatrix values="0 0 0 0 ${hexToRgb(ink).map(v => (v / 255).toFixed(3)).join(' 0 0 0 0 ')} 0 0 0 ${(a * 2.2).toFixed(3)} 0"/></filter><rect width="100%" height="100%" filter="url(#n)"/></svg>`)} 0 0 / ${s}px ${s}px, ${page}`;
+                case 'clouds': return [
+                    `radial-gradient(${s}px ${Math.round(s * 0.42)}px at 12% 22%, ${c}, transparent 70%)${fixed}`,
+                    `radial-gradient(${Math.round(s * 1.3)}px ${Math.round(s * 0.5)}px at 86% 12%, ${c}, transparent 70%)${fixed}`,
+                    `radial-gradient(${Math.round(s * 1.1)}px ${Math.round(s * 0.4)}px at 78% 70%, ${c}, transparent 70%)${fixed}`,
+                    `radial-gradient(${Math.round(s * 0.9)}px ${Math.round(s * 0.36)}px at 18% 82%, ${c}, transparent 70%)${fixed}`,
+                    `linear-gradient(180deg, ${mix(page, '#ffffff', 0.25)}, ${page} 60%)${fixed}`, page,
+                ].join(', ');
+            }
+            return page;
+        }
+        case 'image': {
+            const scrim = `linear-gradient(${rgba(page, background.dim)}, ${rgba(page, background.dim)})${fixed}`;
+            return background.fit === 'tile' ? `${scrim}, url("${background.url}") 0 0 / auto repeat, ${page}` : `${scrim}, url("${background.url}") center / cover no-repeat${fixed}, ${page}`;
+        }
+        default: return page;
+    }
+}
+//# sourceMappingURL=themeSpec.js.map

package/dist/runtime/themeSpec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeSpec.js","sourceRoot":"","sources":["../../../runtime/src/themeSpec.ts"],"names":[],"mappings":"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","sourcesContent":["// Theme documents: a wayBetter theme is a JSON document (like a BetterDiscord theme, but data instead\n// of a stylesheet) describing colors, type, shape, density, layout, background and motion; the format\n// is `theme.schema.json` in the `waybetter` package. This module is the document side of the theme\n// engine: types, the schema's defaults, sanitizing, import, panel overrides, legibility, font roles\n// and stacks, and page backgrounds. Pure, so it runs in the page runtime, the settings previews and\n// the tests. What a theme does to one site's page (its selectors, its palette) is the site's\n// (themeRuntime.ts takes a site adapter).\n//\n// Safety: a theme is sanitized field by field before it becomes CSS. Colors are six-digit hex,\n// numbers are clamped, enums are fixed, font names match a strict pattern, background images are\n// `data:image/*;base64` only, and CSS is built from those values (never concatenated from raw\n// strings). The single escape hatch is `css`, which is the same trust level as the owner's own\n// Custom CSS and is shown as such when a theme is imported.\n//\n// Fonts: sites usually block remote and `data:` fonts (CSP `font-src`), so a theme may name installed\n// system fonts, \"Geist\" / \"Geist Mono\" (bundled and registered from bytes: `FontFace(ArrayBuffer)` is\n// not a fetch), or Google Fonts families the owner downloaded (`source: \"google\"`, fonts.ts).\n\nimport { FONT_ROLE_NAMES, MONO_FAMILIES, contrastRatio, hexToRgb, mix, relativeLuminance, type FontRoleName } from './themeApi.ts';\nimport { deriveColors } from './themeTokens.ts';\nimport { ACTION_NAMES, sanitizeComponents, type ActionColors, type ThemeComponents } from './themeComponents.ts';\nimport { sanitizeDecor, type ThemeDecor } from './themeDecor.ts';\nimport { sanitizeThemeIcons, type ThemeIcons } from './themeIcons.ts';\nimport { sanitizeVariants, type ThemeVariants } from './themeVariants.ts';\n\nexport { FONT_ROLE_NAMES } from './themeApi.ts';\nexport type { FontRoleName } from './themeApi.ts';\n\nexport type Role = 'bg' | 'surface' | 'elevated' | 'border' | 'text' | 'muted' | 'accent';\n/** The site's filled primary button (X: \"Post\"/\"Follow\"): an `inverse` background with an `onInverse` label. */\nexport type ButtonRole = 'inverse' | 'onInverse';\nexport type Palette = Record<Role, string> & Partial<Record<ButtonRole, string>>;\n/**\n * `page` is the canvas behind the site's columns (defaults to `bg`); the columns stay on `bg`.\n * `actions` are the colors of a set action (liked, reposted, bookmarked) and of the reply hover;\n * absent, the site's own action colors stay.\n */\nexport type ThemeColors = Palette & { page?: string; actions?: ActionColors };\n\nexport type Density = 'compact' | 'default' | 'comfortable';\nexport type AvatarShape = 'circle' | 'rounded' | 'square';\nexport type Pattern = 'dots' | 'grid' | 'diagonal' | 'scanlines' | 'paper' | 'clouds';\nexport type Background =\n  | { kind: 'none' }\n  | { kind: 'gradient'; from: string; to: string; angle: number; glow?: string }\n  | { kind: 'pattern'; pattern: Pattern; ink: string; opacity: number; size: number }\n  | { kind: 'image'; url: string; fit: 'cover' | 'tile'; dim: number };\n\n/**\n * One role's font (roles: themeApi.ts `FONT_ROLE_NAMES`). `family` is a font stack; empty keeps the\n * inherited family and only changes the rest. `source: \"google\"` says the first family comes from\n * Google Fonts (downloaded once, asked first when a theme is imported, loaded from bytes). `weight`\n * (100-900), `size` (0.75-1.5, relative to the site's size), `tracking` (em) and `tabular` figures\n * are optional; the interface role takes only `family`/`source` (its size, weights and tracking are\n * `scale`, `weight`, `bold` and `tracking` of the whole theme).\n */\nexport type FontRoleSpec = { family: string[]; source?: 'google'; weight?: number; size?: number; tracking?: number; tabular?: boolean };\nexport type FontRole = 'inherit' | FontRoleSpec;\nexport type FontRoles = Record<FontRoleName, FontRole>;\n\nexport type FontSpec = {\n  /**\n   * Interface font stack (replaces the site's own font everywhere). Empty keeps the site's.\n   * Shorthand kept for older theme files and older apps: it always equals `roles.interface`'s family.\n   */\n  family: string[];\n  /** Post text stack (e.g. a serif reading face); shorthand of `roles.post`'s family. */\n  tweet: string[];\n  /** Which font goes where. Every role inherits from `interface` unless it says otherwise. */\n  roles: FontRoles;\n  /** Multiplies the site's pixel font sizes (0.85-1.2). */\n  scale: number;\n  /** Regular weight (300-500) and bold weight (500-800) that replace the site's 400/700. */\n  weight: number;\n  bold: number;\n  /** Letter spacing in em (-0.03-0.06). */\n  tracking: number;\n  /** Line height multiplier for post text (0 keeps the site's). */\n  leading: number;\n};\nexport type ShapeSpec = { radius: number; button: number; avatar: AvatarShape };\nexport type LayoutSpec = { column: number; sidebar: number; density: Density; cards: boolean; frame: boolean };\nexport type EffectsSpec = { motion: number; hover: 'none' | 'tint' | 'lift' | 'glow'; shadow: 'none' | 'soft' | 'deep'; crt: boolean };\n\nexport type ThemeSpec = {\n  id: string;\n  name: string;\n  description: string;\n  author: string;\n  version: 1;\n  /** Which way the theme leans; used for scrollbars/form controls and previews. */\n  mode: 'light' | 'dark' | 'auto';\n  /** null keeps the site's own colors (X: Default / Dim / Lights out). */\n  colors: ThemeColors | null;\n  font: FontSpec;\n  shape: ShapeSpec;\n  layout: LayoutSpec;\n  background: Background;\n  effects: EffectsSpec;\n  /** Free-form CSS appended last (owner-trusted, like Custom CSS). */\n  css: string;\n  // The groups below are optional and additive: a theme without them is drawn exactly as before,\n  // and an app that does not know them drops them and draws the rest.\n  /** How each piece of the site is built (themeComponents.ts). */\n  components?: ThemeComponents;\n  /** Structural choices: where the navigation sits, how a post is laid out (themeVariants.ts). */\n  variants?: ThemeVariants;\n  /** Lines, bars, focus ring, selection, scrollbars, motion (themeDecor.ts). */\n  decor?: ThemeDecor;\n  /** Which icon pack the theme suggests, with small adjustments (themeIcons.ts). */\n  icons?: ThemeIcons;\n};\n\n/** Panel overrides: any group may be partially overridden on top of the selected theme. */\nexport type ThemeOverrides = {\n  colors?: Partial<ThemeColors>;\n  /** `roles` is merged role by role (a named role replaces that role only). */\n  font?: Partial<Omit<FontSpec, 'roles'>> & { roles?: Partial<FontRoles> };\n  shape?: Partial<ShapeSpec>;\n  layout?: Partial<LayoutSpec>;\n  background?: Background;\n  effects?: Partial<EffectsSpec>;\n  /** The theme's own CSS as edited in the panel (replaces the theme document's `css`). */\n  css?: { text: string };\n  /** The owner's say on a theme's layout suggestions, axis by axis (an axis set to the site's own option switches it off). */\n  variants?: Record<string, string>;\n};\n\n// ---------------------------------------------------------------------------------------------\n// The schema's defaults: a theme that sets nothing changes nothing (the site keeps its own geometry;\n// a site's structure CSS only emits rules where a theme differs from these).\n\nexport const BASE_SHAPE: ShapeSpec = { radius: 16, button: 9999, avatar: 'circle' };\nexport const INHERIT_ROLES: FontRoles = { interface: 'inherit', post: 'inherit', heading: 'inherit', numbers: 'inherit', mono: 'inherit', chrome: 'inherit', dialog: 'inherit' };\n/** A font spec from the interface/post stacks alone (every other role inherits). */\nexport const withRoles = (font: Omit<FontSpec, 'roles'>): FontSpec => ({\n  ...font,\n  roles: { ...INHERIT_ROLES, ...(font.family.length ? { interface: { family: font.family } } : {}), ...(font.tweet.length ? { post: { family: font.tweet } } : {}) },\n});\nexport const BASE_FONT: FontSpec = withRoles({ family: [], tweet: [], scale: 1, weight: 400, bold: 700, tracking: 0, leading: 0 });\nexport const BASE_LAYOUT: LayoutSpec = { column: 600, sidebar: 350, density: 'default', cards: false, frame: false };\nexport const BASE_EFFECTS: EffectsSpec = { motion: 0, hover: 'none', shadow: 'none', crt: false };\n\n/** The system UI stack themes put after their own sans-serif families. */\nexport const SYSTEM_SANS = ['Segoe UI', '-apple-system', 'BlinkMacSystemFont', 'system-ui', 'sans-serif'];\n\n// ---------------------------------------------------------------------------------------------\n// Colors and contrast (luminance and ratios: themeApi.ts)\n\nexport const isHex = (value: unknown): value is string => typeof value === 'string' && /^#[0-9a-f]{6}$/i.test(value);\n/** `#rrggbb` + alpha as `rgba()`. */\nexport const rgba = (hex: string, alpha: number) => `rgba(${hexToRgb(hex).join(', ')}, ${+alpha.toFixed(3)})`;\n\n/** Moves `color` toward black or white until it reaches `ratio` against every surface. */\nexport function reach(color: string, surfaces: string[], ratio: number): string {\n  const worst = (c: string) => Math.min(...surfaces.map(s => contrastRatio(c, s)));\n  if (worst(color) >= ratio) return color;\n  const lightSurfaces = surfaces.reduce((sum, s) => sum + relativeLuminance(s), 0) / surfaces.length > 0.18;\n  const pole = lightSurfaces ? '#000000' : '#ffffff';\n  for (let t = 0.04; t <= 1; t += 0.04) {\n    const next = mix(color, pole, t);\n    if (worst(next) >= ratio) return next;\n  }\n  return pole;\n}\n\n/**\n * Guarantees legibility for any palette (built-in, imported or overridden): text, secondary text\n * and links reach WCAG AA (4.5:1) on every surface, including the page canvas, and the site's filled\n * button keeps a readable label and stands out from the page (3:1).\n */\nexport function ensureContrast<T extends Palette & { page?: string; actions?: ActionColors }>(colors: T): T {\n  const surfaces = [colors.bg, colors.surface, colors.elevated, ...(colors.page ? [colors.page] : [])];\n  const out = { ...colors };\n  out.text = reach(colors.text, surfaces, 7);\n  out.muted = reach(colors.muted, surfaces, 4.5);\n  // Links live inside the columns, never on the page canvas.\n  out.accent = reach(colors.accent, [colors.bg, colors.surface, colors.elevated], 4.5);\n  const inverse = colors.inverse ?? out.text;\n  const onInverse = colors.onInverse ?? colors.bg;\n  out.inverse = reach(inverse, [colors.bg], 3);\n  out.onInverse = reach(onInverse, [out.inverse], 4.5);\n  // Action colors are icons and counts: non-text contrast on the column and on a raised row.\n  if (colors.actions) out.actions = Object.fromEntries(Object.entries(colors.actions).map(([name, color]) => [name, reach(color as string, [colors.bg, colors.surface], 3)]));\n  return out;\n}\n\n// ---------------------------------------------------------------------------------------------\n// Sanitizing\n\nconst GENERIC_FONTS = new Set(['system-ui', 'sans-serif', 'serif', 'monospace', 'cursive', 'ui-sans-serif', 'ui-serif', 'ui-monospace', 'ui-rounded', '-apple-system', 'BlinkMacSystemFont']);\nconst FONT_NAME = /^[A-Za-z0-9][A-Za-z0-9 .\\-]{0,47}$/;\nconst DATA_IMAGE = /^data:image\\/(png|jpeg|webp|gif|avif);base64,[A-Za-z0-9+/]+={0,2}$/;\nexport const MAX_IMAGE_CHARS = 1_100_000;\nexport const MAX_CSS_CHARS = 60_000;\nconst PATTERNS: Pattern[] = ['dots', 'grid', 'diagonal', 'scanlines', 'paper', 'clouds'];\n\nconst obj = (value: unknown): Record<string, unknown> => value && typeof value === 'object' && !Array.isArray(value) ? value as Record<string, unknown> : {};\nconst num = (value: unknown, min: number, max: number, fallback: number) => typeof value === 'number' && Number.isFinite(value) ? Math.min(max, Math.max(min, value)) : fallback;\nconst pick = <T extends string>(value: unknown, options: readonly T[], fallback: T): T => options.includes(value as T) ? value as T : fallback;\nconst text = (value: unknown, max: number, fallback = '') => typeof value === 'string' ? value.replace(/[\\u0000-\\u001f\\u007f]/g, '').trim().slice(0, max) : fallback;\n\nexport function sanitizeFonts(value: unknown): string[] {\n  if (!Array.isArray(value)) return [];\n  return value.filter((name): name is string => typeof name === 'string' && (GENERIC_FONTS.has(name) || FONT_NAME.test(name))).slice(0, 8);\n}\n\n/** A theme needs its background, text and accent; any other role it leaves out is derived from the\n * base structure (themeTokens.ts `deriveColors`), so every theme has the same proportions. */\nfunction sanitizeColors(value: unknown): ThemeColors | null {\n  const source = obj(value);\n  if (!(['bg', 'text', 'accent'] as const).every(role => isHex(source[role]))) return null;\n  const named = Object.fromEntries((['bg', 'surface', 'elevated', 'border', 'text', 'muted', 'accent'] as Role[])\n    .filter(role => isHex(source[role])).map(role => [role, (source[role] as string).toLowerCase()]));\n  const colors = deriveColors(named as { bg: string; text: string; accent: string }) as ThemeColors;\n  for (const role of ['inverse', 'onInverse', 'page'] as const) if (isHex(source[role])) colors[role] = (source[role] as string).toLowerCase();\n  const actions = obj(source.actions);\n  const named_actions = Object.fromEntries(ACTION_NAMES.filter(name => isHex(actions[name])).map(name => [name, (actions[name] as string).toLowerCase()]));\n  if (Object.keys(named_actions).length) colors.actions = named_actions;\n  return colors;\n}\n\nexport function sanitizeBackground(value: unknown): Background {\n  const source = obj(value);\n  if (source.kind === 'gradient' && isHex(source.from) && isHex(source.to)) {\n    return { kind: 'gradient', from: source.from.toLowerCase(), to: source.to.toLowerCase(), angle: Math.round(num(source.angle, 0, 360, 180)), ...(isHex(source.glow) ? { glow: source.glow.toLowerCase() } : {}) };\n  }\n  if (source.kind === 'pattern' && isHex(source.ink)) {\n    return { kind: 'pattern', pattern: pick(source.pattern, PATTERNS, 'dots'), ink: source.ink.toLowerCase(), opacity: num(source.opacity, 0, 0.6, 0.1), size: Math.round(num(source.size, 2, 400, 24)) };\n  }\n  if (source.kind === 'image' && typeof source.url === 'string' && source.url.length <= MAX_IMAGE_CHARS && DATA_IMAGE.test(source.url)) {\n    return { kind: 'image', url: source.url, fit: pick(source.fit, ['cover', 'tile'] as const, 'cover'), dim: num(source.dim, 0.35, 0.95, 0.6) };\n  }\n  return { kind: 'none' };\n}\n\n/** Bounds of a role's own settings (the JSON Schema says the same; tested). */\nexport const ROLE_LIMITS = { weight: [100, 900], size: [0.75, 1.5], tracking: [-0.05, 0.1] } as const;\n\n/** One role from JSON: \"inherit\", or a stack with optional extras (clamped; unknown keys dropped). */\nexport function sanitizeFontRole(value: unknown, role: FontRoleName): FontRole {\n  if (value === 'inherit' || value === null || value === undefined) return 'inherit';\n  const source = obj(value);\n  if (!Object.keys(source).length) return 'inherit';\n  const family = sanitizeFonts(source.family);\n  const out: FontRoleSpec = { family };\n  if (source.source === 'google' && family.length && !GENERIC_FONTS.has(family[0]!)) out.source = 'google';\n  if (role !== 'interface') {\n    if (typeof source.weight === 'number' && Number.isFinite(source.weight)) out.weight = Math.round(num(source.weight, ...ROLE_LIMITS.weight, 400));\n    if (typeof source.size === 'number' && Number.isFinite(source.size)) out.size = +num(source.size, ...ROLE_LIMITS.size, 1).toFixed(3);\n    if (typeof source.tracking === 'number' && Number.isFinite(source.tracking)) out.tracking = +num(source.tracking, ...ROLE_LIMITS.tracking, 0).toFixed(4);\n    if (source.tabular === true) out.tabular = true;\n  }\n  // A role that changes nothing is the same as inheriting.\n  return Object.keys(out).length === 1 && !family.length ? 'inherit' : out;\n}\n\nconst roleFamily = (role: FontRole): string[] => role === 'inherit' ? [] : role.family;\n/** A role with a new family, keeping its other settings (and its Google source only for the same font). */\nexport function withFamily(role: FontRole, family: string[], source?: 'google'): FontRole {\n  const rest = role === 'inherit' ? {} : { ...role };\n  delete (rest as Partial<FontRoleSpec>).source;\n  delete (rest as Partial<FontRoleSpec>).family;\n  const next: FontRoleSpec = { ...rest, family, ...(source && family.length ? { source } : {}) };\n  return Object.keys(next).length === 1 && !family.length ? 'inherit' : next;\n}\n\n/**\n * The roles of a font group from JSON over `base`: `roles.<name>` wins; the legacy shorthand\n * (`family` → interface, `tweet` → post) applies when that role is not named, so theme files and\n * saved customizations from before font roles keep working.\n */\nfunction sanitizeRoles(source: Record<string, unknown>, base: FontSpec): FontRoles {\n  const named = obj(source.roles);\n  const roles = { ...base.roles };\n  for (const role of FONT_ROLE_NAMES) if (role in named) roles[role] = sanitizeFontRole(named[role], role);\n  if (!('interface' in named) && 'family' in source) roles.interface = withFamily(base.roles.interface, sanitizeFonts(source.family), sameFirst(source.family, base.roles.interface));\n  if (!('post' in named) && 'tweet' in source) roles.post = withFamily(base.roles.post, sanitizeFonts(source.tweet), sameFirst(source.tweet, base.roles.post));\n  return roles;\n}\n/** Keeps a role's Google source when the shorthand still names the same first family. */\nfunction sameFirst(stack: unknown, role: FontRole): 'google' | undefined {\n  return role !== 'inherit' && role.source === 'google' && Array.isArray(stack) && stack[0] === role.family[0] ? 'google' : undefined;\n}\n\nfunction sanitizeFont(value: unknown, base: FontSpec): FontSpec {\n  const source = obj(value);\n  const roles = sanitizeRoles(source, base);\n  return {\n    family: roleFamily(roles.interface),\n    tweet: roleFamily(roles.post),\n    roles,\n    scale: num(source.scale, 0.85, 1.2, base.scale),\n    weight: Math.round(num(source.weight, 300, 500, base.weight)),\n    bold: Math.round(num(source.bold, 500, 800, base.bold)),\n    tracking: num(source.tracking, -0.03, 0.06, base.tracking),\n    leading: source.leading === 0 ? 0 : num(source.leading, 1.2, 1.8, base.leading),\n  };\n}\nconst sanitizeShape = (value: unknown, base: ShapeSpec): ShapeSpec => {\n  const source = obj(value);\n  return { radius: Math.round(num(source.radius, 0, 28, base.radius)), button: Math.round(num(source.button, 0, 9999, base.button)), avatar: pick(source.avatar, ['circle', 'rounded', 'square'] as const, base.avatar) };\n};\nconst sanitizeLayout = (value: unknown, base: LayoutSpec): LayoutSpec => {\n  const source = obj(value);\n  return {\n    column: Math.round(num(source.column, 520, 820, base.column)), sidebar: Math.round(num(source.sidebar, 290, 400, base.sidebar)),\n    density: pick(source.density, ['compact', 'default', 'comfortable'] as const, base.density),\n    cards: typeof source.cards === 'boolean' ? source.cards : base.cards, frame: typeof source.frame === 'boolean' ? source.frame : base.frame,\n  };\n};\nconst sanitizeEffects = (value: unknown, base: EffectsSpec): EffectsSpec => {\n  const source = obj(value);\n  return {\n    motion: Math.round(num(source.motion, 0, 400, base.motion)), hover: pick(source.hover, ['none', 'tint', 'lift', 'glow'] as const, base.hover),\n    shadow: pick(source.shadow, ['none', 'soft', 'deep'] as const, base.shadow), crt: typeof source.crt === 'boolean' ? source.crt : base.crt,\n  };\n};\n\nexport const slug = (value: string) => value.toLowerCase().normalize('NFKD').replace(/[^a-z0-9]+/g, '-').replace(/^-+|-+$/g, '').slice(0, 40) || 'theme';\n\n/** Any JSON to a complete, safe theme. Missing groups fall back to the schema's defaults. */\nexport function sanitizeSpec(input: unknown): ThemeSpec {\n  const source = obj(input);\n  const name = text(source.name, 60) || 'Untitled theme';\n  const id = typeof source.id === 'string' && /^[a-z0-9-]{1,40}$/.test(source.id) ? source.id : slug(name);\n  return {\n    id, name, description: text(source.description, 200), author: text(source.author, 60), version: 1,\n    mode: pick(source.mode, ['light', 'dark', 'auto'] as const, 'auto'),\n    colors: sanitizeColors(source.colors),\n    font: sanitizeFont(source.font, BASE_FONT),\n    shape: sanitizeShape(source.shape, BASE_SHAPE),\n    layout: sanitizeLayout(source.layout, BASE_LAYOUT),\n    background: sanitizeBackground(source.background),\n    effects: sanitizeEffects(source.effects, BASE_EFFECTS),\n    css: typeof source.css === 'string' ? source.css.slice(0, MAX_CSS_CHARS) : '',\n    ...structureGroups(source),\n  };\n}\n\n/** The optional structure groups of a theme, each present only when it says something valid. */\nfunction structureGroups(source: Record<string, unknown>): Pick<ThemeSpec, 'components' | 'variants' | 'decor' | 'icons'> {\n  const components = sanitizeComponents(source.components), variants = sanitizeVariants(source.variants);\n  const decor = sanitizeDecor(source.decor), icons = sanitizeThemeIcons(source.icons);\n  return { ...(components ? { components } : {}), ...(variants ? { variants } : {}), ...(decor ? { decor } : {}), ...(icons ? { icons } : {}) };\n}\n\n/** True when a theme carries any of the structure groups (components, variants, decoration, icons). */\nexport const hasStructure = (theme: ThemeSpec) => !!(theme.components || theme.variants || theme.decor || theme.icons);\n\n/** Parses an imported file; errors are human-readable. */\nexport function parseThemeJson(json: string): { theme: ThemeSpec; warnings: string[] } | { error: string } {\n  let raw: unknown;\n  try { raw = JSON.parse(json); } catch { return { error: 'This file is not valid JSON.' }; }\n  const source = obj(raw);\n  if (typeof source.name !== 'string' || !source.name.trim()) return { error: 'A theme needs a \"name\".' };\n  const theme = sanitizeSpec(raw);\n  const warnings: string[] = [];\n  if (source.colors !== undefined && source.colors !== null && !theme.colors) warnings.push('Colors were ignored: bg, text and accent must be #rrggbb (the other roles are derived when missing).');\n  if (theme.css) warnings.push('Contains custom CSS, which runs inside the site like your own Custom CSS.');\n  if (source.background && theme.background.kind === 'none' && obj(source.background).kind !== 'none') warnings.push('The background was ignored (images must be data:image/png, jpeg, webp, gif or avif, up to about 800 KB).');\n  if (theme.colors) {\n    const fixed = ensureContrast(theme.colors);\n    if (fixed.text !== theme.colors.text || fixed.muted !== theme.colors.muted || fixed.accent !== theme.colors.accent) warnings.push('Some text colors were adjusted to stay readable.');\n  }\n  return { theme, warnings };\n}\n\n/** Applies panel overrides (and an accent) on top of a theme. Colors are then made legible. */\nexport function applyOverrides(theme: ThemeSpec, overrides: ThemeOverrides = {}, accent: string | null = null): ThemeSpec {\n  const o = obj(overrides) as ThemeOverrides;\n  let colors = theme.colors ? { ...theme.colors, ...Object.fromEntries(Object.entries(obj(o.colors)).filter(([, v]) => isHex(v))) } as ThemeColors : null;\n  if (colors && accent) colors = { ...colors, accent, ...(theme.colors?.inverse === theme.colors?.accent ? { inverse: accent } : {}) };\n  return {\n    ...theme,\n    colors: colors ? ensureContrast(colors) : null,\n    // Missing keys fall back to the theme's own; the legacy `family`/`tweet` shorthand still overrides.\n    font: o.font ? sanitizeFont(o.font, theme.font) : theme.font,\n    shape: o.shape ? sanitizeShape({ ...theme.shape, ...o.shape }, theme.shape) : theme.shape,\n    layout: o.layout ? sanitizeLayout({ ...theme.layout, ...o.layout }, theme.layout) : theme.layout,\n    background: o.background ? sanitizeBackground(o.background) : theme.background,\n    effects: o.effects ? sanitizeEffects({ ...theme.effects, ...o.effects }, theme.effects) : theme.effects,\n    css: o.css && typeof o.css.text === 'string' ? o.css.text.slice(0, MAX_CSS_CHARS) : theme.css,\n    ...variantOverrides(theme, o.variants),\n  };\n}\n\n/** A theme's variants with the owner's per-axis say on top (the raw merge goes through the sanitizer, so the site's own option removes the axis). */\nfunction variantOverrides(theme: ThemeSpec, overrides: unknown): Pick<ThemeSpec, 'variants'> {\n  if (!overrides || typeof overrides !== 'object') return {};\n  const variants = sanitizeVariants({ ...theme.variants, ...(overrides as Record<string, unknown>) });\n  return { variants: variants ?? undefined };\n}\n\n/** True when a theme changes nothing about the site (the site's own look without overrides). */\nexport function isNeutral(theme: ThemeSpec): boolean {\n  return !theme.colors && JSON.stringify([theme.font, theme.shape, theme.layout, theme.effects]) === JSON.stringify([BASE_FONT, BASE_SHAPE, BASE_LAYOUT, BASE_EFFECTS])\n    && theme.background.kind === 'none' && !theme.css && !hasStructure(theme);\n}\n\n// ---------------------------------------------------------------------------------------------\n// Fonts\n\n/** Bundled families and the names they are registered under (shell: @fontsource; site pages: FontFace, fonts.ts). */\nexport const BUNDLED_FONTS: Record<string, string> = { 'Geist': 'Geist Variable', 'Geist Mono': 'Geist Mono Variable' };\n\nexport function fontStack(names: string[]): string {\n  const out: string[] = [];\n  for (const name of names) {\n    const real = BUNDLED_FONTS[name];\n    if (real) out.push(`\"${real}\"`);\n    out.push(GENERIC_FONTS.has(name) ? name : `\"${name}\"`);\n  }\n  // Emoji and CJK keep working whatever the theme names.\n  return [...new Set(out), '\"Segoe UI Emoji\"', '\"Apple Color Emoji\"', 'sans-serif'].join(', ');\n}\n/** Roles that are drawn inside the site's page (chrome is wayBetter's own window). */\nexport const PAGE_ROLES: FontRoleName[] = ['interface', 'post', 'heading', 'numbers', 'mono', 'dialog'];\nconst rolesUsing = (theme: ThemeSpec, roles: readonly FontRoleName[]) => roles.flatMap(role => roleFamily(theme.font.roles[role]));\n/** Bundled families (Geist, Geist Mono) a theme names in the site's page. */\nexport const bundledFontsUsed = (theme: ThemeSpec, roles: readonly FontRoleName[] = PAGE_ROLES) => {\n  const names = new Set(rolesUsing(theme, roles));\n  return Object.keys(BUNDLED_FONTS).filter(name => names.has(name));\n};\n/** Google Fonts families a theme uses (`source: \"google\"`), for the given roles. */\nexport function googleFontsUsed(theme: ThemeSpec, roles: readonly FontRoleName[] = FONT_ROLE_NAMES): string[] {\n  const out = new Set<string>();\n  for (const role of roles) {\n    const spec = theme.font.roles[role];\n    if (spec !== 'inherit' && spec.source === 'google' && spec.family[0]) out.add(spec.family[0]);\n  }\n  return [...out];\n}\n\n/** A role resolved to what is drawn: the stack actually used and its settings. */\nexport type ResolvedFontRole = {\n  /** CSS `font-family`. */\n  stack: string;\n  /** The families of that stack (empty when it is the site's or app's own font). */\n  family: string[];\n  /** True when the family comes from another role (or the site/app default). */\n  inherited: boolean;\n  /** A Google Fonts family the stack starts with. */\n  google: string | null;\n  weight: number | null;\n  size: number;\n  tracking: number | null;\n  tabular: boolean;\n};\nexport type ResolvedFontRoles = Record<FontRoleName, ResolvedFontRole>;\n\n/**\n * Every role resolved. `site` is the stack an inheriting interface uses: the site's own font in its\n * page, wayBetter's own UI font in the shell. Every other role inherits the interface, except that an\n * inheriting `mono` keeps a monospaced stack (`mono`: themeApi.ts `MONO_FAMILIES`, code rarely suits\n * an interface font).\n */\nexport function resolveFontRoles(font: FontSpec, site: string, mono = fontStack(MONO_FAMILIES)): ResolvedFontRoles {\n  const base = font.roles.interface;\n  const baseFamily = roleFamily(base);\n  const root: ResolvedFontRole = {\n    stack: baseFamily.length ? fontStack(baseFamily) : site, family: baseFamily, inherited: !baseFamily.length,\n    google: base !== 'inherit' && base.source === 'google' ? baseFamily[0] ?? null : null,\n    weight: null, size: 1, tracking: null, tabular: false,\n  };\n  const out = { interface: root } as ResolvedFontRoles;\n  for (const role of FONT_ROLE_NAMES) {\n    if (role === 'interface') continue;\n    const spec = font.roles[role];\n    const own = roleFamily(spec);\n    const from = own.length\n      ? { stack: fontStack(own), family: own, inherited: false, google: spec !== 'inherit' && spec.source === 'google' ? own[0]! : null }\n      : role === 'mono' ? { stack: mono, family: [] as string[], inherited: true, google: null }\n      : { stack: root.stack, family: root.family, inherited: true, google: root.google };\n    out[role] = {\n      ...from,\n      weight: spec === 'inherit' ? null : spec.weight ?? null,\n      size: spec === 'inherit' ? 1 : spec.size ?? 1,\n      tracking: spec === 'inherit' ? null : spec.tracking ?? null,\n      tabular: spec !== 'inherit' && !!spec.tabular,\n    };\n  }\n  return out;\n}\n\n/**\n * A named font stack offered by the panel's pickers. `key` names its translated label\n * (`wb.fonts.choice.*`); `label` is the English one. A site adds its own font first (X: \"X's Chirp\",\n * an empty family that keeps the site's type).\n */\nexport type FontChoice = { id: string; label: string; key?: string; family: string[] };\n/** Font choices offered by the panel; any installed family can also be named in theme JSON. */\nexport const FONT_CHOICES: FontChoice[] = [\n  { id: 'geist', label: 'Geist', family: ['Geist', ...SYSTEM_SANS] },\n  { id: 'geist-mono', label: 'Geist Mono', family: ['Geist Mono', 'Cascadia Mono', 'Consolas', 'Menlo', 'ui-monospace', 'monospace'] },\n  { id: 'system', label: 'System UI', key: 'wb.fonts.choice.system', family: SYSTEM_SANS },\n  { id: 'helvetica', label: 'Helvetica / Arial', family: ['Helvetica Neue', 'Helvetica', 'Arial', 'sans-serif'] },\n  { id: 'humanist', label: 'Humanist (Segoe, Avenir)', key: 'wb.fonts.choice.humanist', family: ['Avenir Next', 'Segoe UI Variable Text', 'Segoe UI', 'sans-serif'] },\n  { id: 'rounded', label: 'Rounded', key: 'wb.fonts.choice.rounded', family: ['ui-rounded', 'SF Pro Rounded', 'Nunito', 'Bahnschrift', 'Segoe UI', 'sans-serif'] },\n  { id: 'serif', label: 'Serif (Charter, Georgia)', key: 'wb.fonts.choice.serif', family: ['Charter', 'Iowan Old Style', 'Georgia', 'Cambria', 'serif'] },\n  { id: 'mono', label: 'System mono', key: 'wb.fonts.choice.mono', family: ['Cascadia Mono', 'SF Mono', 'Consolas', 'Menlo', 'ui-monospace', 'monospace'] },\n];\n/** The choice whose stack is exactly `family` in `choices`, or `custom`. */\nexport const fontChoiceOf = (family: string[], choices: readonly FontChoice[] = FONT_CHOICES) => choices.find(choice => choice.family.join('|') === family.join('|'))?.id ?? 'custom';\n\n// ---------------------------------------------------------------------------------------------\n// Backgrounds\n\nconst svgUrl = (svg: string) => `url(\"data:image/svg+xml,${encodeURIComponent(svg)}\")`;\n\n/**\n * The site's page background. A site's `<html>` and `<body>` are often one viewport tall while the\n * content overflows them (X's timeline), so a background painted on both had `<body>` paint its own\n * copy over its box, which scrolls away: after a partial scroll the gradient/glow showed only below a hard seam. Now\n * `<html>` holds the plain page color, `<body>` is transparent (beating, by specificity, the\n * palette's `html,body{background-color}` and its `[style^=\"background-color: …\"]` remap of the\n * inline color X puts on `<body>`) and every layer sits on one viewport-sized fixed\n * layer behind all of the page (`z-index:-1` in the root stacking context), with no `fixed` attachments.\n */\nexport function pageBackgroundCss(background: Background, page: string): string[] {\n  const out = [`html:root{background:${page} !important}`, `html:root body{background:transparent !important}`];\n  if (background.kind !== 'none') {\n    out.push(`html:root::before{content:\"\";position:fixed;inset:0;z-index:-1;pointer-events:none;contain:strict;background:${backgroundLayers(background, page, false)}}`);\n  }\n  return out;\n}\n\n/**\n * CSS `background` layers for the page canvas (behind the site's columns). `attach` keeps the `fixed`\n * attachments for a box that scrolls (the Theme Builder preview); the site's page gets the layers without\n * them, on one viewport-sized fixed layer (`pageBackgroundCss`).\n */\nexport function backgroundLayers(background: Background, page: string, attach = true): string {\n  const fixed = attach ? ' fixed' : '';\n  switch (background.kind) {\n    case 'gradient': {\n      const glow = background.glow ? `radial-gradient(1200px 600px at 50% -10%, ${rgba(background.glow, 0.55)}, transparent 70%), ` : '';\n      return `${glow}linear-gradient(${background.angle}deg, ${background.from}, ${background.to})${fixed}, ${page}`;\n    }\n    case 'pattern': {\n      const { ink, opacity: a, size: s } = background;\n      const c = rgba(ink, a);\n      switch (background.pattern) {\n        case 'dots': return `radial-gradient(${c} 1px, transparent 1.6px) 0 0 / ${s}px ${s}px, ${page}`;\n        case 'grid': return `linear-gradient(${c} 1px, transparent 1px) 0 0 / ${s}px ${s}px, linear-gradient(90deg, ${c} 1px, transparent 1px) 0 0 / ${s}px ${s}px, ${page}`;\n        case 'diagonal': return `repeating-linear-gradient(135deg, ${c} 0 1px, transparent 1px ${s}px), ${page}`;\n        case 'scanlines': return `repeating-linear-gradient(0deg, ${c} 0 1px, transparent 1px ${s}px), radial-gradient(ellipse at 50% 40%, ${rgba(ink, a * 1.6)}, transparent 70%)${fixed}, ${page}`;\n        case 'paper': return `${svgUrl(`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"${s}\" height=\"${s}\"><filter id=\"n\"><feTurbulence type=\"fractalNoise\" baseFrequency=\".85\" numOctaves=\"3\" stitchTiles=\"stitch\"/><feColorMatrix values=\"0 0 0 0 ${hexToRgb(ink).map(v => (v / 255).toFixed(3)).join(' 0 0 0 0 ')} 0 0 0 ${(a * 2.2).toFixed(3)} 0\"/></filter><rect width=\"100%\" height=\"100%\" filter=\"url(#n)\"/></svg>`)} 0 0 / ${s}px ${s}px, ${page}`;\n        case 'clouds': return [\n          `radial-gradient(${s}px ${Math.round(s * 0.42)}px at 12% 22%, ${c}, transparent 70%)${fixed}`,\n          `radial-gradient(${Math.round(s * 1.3)}px ${Math.round(s * 0.5)}px at 86% 12%, ${c}, transparent 70%)${fixed}`,\n          `radial-gradient(${Math.round(s * 1.1)}px ${Math.round(s * 0.4)}px at 78% 70%, ${c}, transparent 70%)${fixed}`,\n          `radial-gradient(${Math.round(s * 0.9)}px ${Math.round(s * 0.36)}px at 18% 82%, ${c}, transparent 70%)${fixed}`,\n          `linear-gradient(180deg, ${mix(page, '#ffffff', 0.25)}, ${page} 60%)${fixed}`, page,\n        ].join(', ');\n      }\n      return page;\n    }\n    case 'image': {\n      const scrim = `linear-gradient(${rgba(page, background.dim)}, ${rgba(page, background.dim)})${fixed}`;\n      return background.fit === 'tile' ? `${scrim}, url(\"${background.url}\") 0 0 / auto repeat, ${page}` : `${scrim}, url(\"${background.url}\") center / cover no-repeat${fixed}, ${page}`;\n    }\n    default: return page;\n  }\n}\n"]}

package/dist/runtime/themeTokens.d.ts

@@ -17,6 +17,18 @@ export type ColorModel = {
     exact: Map<string, Rgb>;
     sourceAccent: Oklab;
     accent: Oklab | null;
+    /**
+     * Text only: the stretch of the site's axis between its most raised surface and its secondary text.
+     * A foreground the site paints there (a dimmed icon, a gray it also uses for borders) would land
+     * between the theme's background and its secondary text, under every contrast a theme guarantees;
+     * it becomes the theme's secondary text instead. Below `from` a foreground is as dark (or light) as
+     * the site's surfaces: a label on a filled surface, which keeps its place.
+     */
+    dim: {
+        from: number;
+        to: number;
+        color: Rgb;
+    } | null;
 };
 /**
  * How a color is used decides which site role wins where the site reuses one value for two roles (Default's