npm - @wrongstack/webui - Versions diffs - 1.0.9 → 1.0.11 - Mend

@wrongstack/webui 1.0.9 → 1.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (340) hide show

package/dist/lib/font-scale-css.d.ts ADDED Viewed

@@ -0,0 +1,45 @@
+/**
+ * Build-time PostCSS plugin behind the typography panel's "interface text
+ * size" control.
+ *
+ * The WebUI sizes text two ways: ~1650 arbitrary `text-[11px]` classes and
+ * ~1700 rem-based `text-xs`/`text-sm` classes, plus hand-written `font-size`
+ * declarations in the stylesheets. Rewriting every call site would be a huge,
+ * collision-prone diff, and a root `font-size` change would only reach the rem
+ * half (and would also scale Tailwind spacing). Instead this plugin rewrites
+ * the *compiled* declarations once:
+ *
+ *   font-size: 11px              → font-size: calc(11px * var(--ui-font-scale, 1))
+ *   font-size: var(--text-xs)    → font-size: calc(var(--text-xs) * var(--ui-font-scale, 1))
+ *   line-height: 16px            → line-height: calc(16px * var(--ui-font-scale, 1))
+ *
+ * so one CSS variable on <html> scales every absolute text size. Relative
+ * values (`em`, `%`, unitless line-heights) already follow their parent and
+ * are left alone — wrapping them would apply the scale twice. Third-party CSS
+ * (Monaco, xterm, React Flow — anything under `node_modules`) is skipped: those
+ * widgets size themselves from JS options that the font settings feed directly.
+ */
+export declare const UI_FONT_SCALE_VAR = "--ui-font-scale";
+type ScalableProperty = 'font-size' | 'line-height';
+export declare function isScalableProperty(prop: string): prop is ScalableProperty;
+/** Returns the scaled value, or `null` when the declaration must stay as-is. */
+export declare function scaleTypographyValue(prop: ScalableProperty, value: string): string | null;
+interface DeclarationLike {
+    prop: string;
+    value: string;
+    source?: {
+        input?: {
+            file?: string | undefined;
+        } | undefined;
+    } | undefined;
+}
+export interface FontScalePluginOptions {
+    /** Decide per source file; default skips anything under `node_modules`. */
+    include?: ((file: string | undefined) => boolean) | undefined;
+}
+export declare function fontScalePostcssPlugin(options?: FontScalePluginOptions): {
+    postcssPlugin: string;
+    Declaration(decl: DeclarationLike): void;
+};
+export {};
+//# sourceMappingURL=font-scale-css.d.ts.map

package/dist/lib/fonts.d.ts ADDED Viewed

@@ -0,0 +1,502 @@
+/**
+ * Font registry — the single source of every typeface and text size in the
+ * WebUI.
+ *
+ * Six roles cover every text surface:
+ *
+ *   ui        `--font-sans`      buttons, menus, panels, lists, settings
+ *   display   `--font-display`   page and section headings
+ *   reading   `--font-reading`   chat replies, markdown, mailbox (follows ui)
+ *   code      `--font-mono`      code blocks, logs, IDs, tabular readouts
+ *   editor    `--font-editor`    Monaco editor + diff view        (follows code)
+ *   terminal  `--font-terminal`  xterm sessions                   (follows code)
+ *
+ * A `FontSettings` value is a preset, optional per-role overrides, and the
+ * size/spacing controls. `applyFontSettings` writes the resolved values onto
+ * `<html>` as inline custom properties; `index.css` holds the base values and
+ * the derived-role fallbacks, so a role left at its default writes nothing.
+ * Monaco and xterm cannot read CSS variables — they take `editorFontOptions` /
+ * `terminalFontOptions` directly. Interface text size reaches the ~3300 sized
+ * class names through the build-time `font-scale-css` PostCSS plugin.
+ *
+ * Every non-system family is self-hosted through `@fontsource`. The four
+ * default faces are imported eagerly in `main.tsx`; the rest load on demand
+ * via `loadFontFamilies`, so an unused font costs nothing at runtime.
+ *
+ * To add a family: add an entry to `FONT_FAMILY_LIST` (with `package` and a
+ * literal `load` import) and install the package. To add a preset: add an
+ * entry to `FONT_PRESETS` and `settings:fonts.presets.<id>` keys in all 7
+ * locale files.
+ */
+export type FontRole = 'ui' | 'display' | 'reading' | 'code' | 'editor' | 'terminal';
+export type FontCategory = 'sans' | 'serif' | 'mono';
+/** bundled = imported eagerly in main.tsx · lazy = loaded on first use · system = OS fonts only */
+export type FontSource = 'bundled' | 'lazy' | 'system';
+export declare const FONT_ROLES: readonly FontRole[];
+type DerivedRole = 'reading' | 'editor' | 'terminal';
+/** Derived roles follow their parent until overridden (by a preset or the user). */
+export declare const DERIVED_ROLE_PARENT: Readonly<Record<DerivedRole, FontRole>>;
+export declare function isDerivedRole(role: FontRole): role is DerivedRole;
+export declare const ROLE_CATEGORIES: Readonly<Record<FontRole, readonly FontCategory[]>>;
+export declare const FONT_ROLE_CSS_VARIABLE: Readonly<Record<FontRole, string>>;
+interface FontFamilyBase {
+    id: string;
+    /** Proper font name — shown untranslated in the picker. */
+    label: string;
+    category: FontCategory;
+    /** Full CSS `font-family` stack; the first entry is the self-hosted face. */
+    stack: string;
+    source: FontSource;
+    /** npm package that ships the face (absent for system stacks). */
+    package?: string;
+    /** Lazy families only: literal import(s) so Vite can split each font. */
+    load?: () => Promise<unknown>;
+}
+declare const FONT_FAMILY_LIST: readonly [{
+    readonly id: 'manrope';
+    readonly label: 'Manrope';
+    readonly category: 'sans';
+    readonly source: 'bundled';
+    readonly package: '@fontsource-variable/manrope';
+    readonly stack: '"Manrope Variable", "Manrope", ui-sans-serif, system-ui, sans-serif';
+}, {
+    readonly id: 'space-grotesk';
+    readonly label: 'Space Grotesk';
+    readonly category: 'sans';
+    readonly source: 'bundled';
+    readonly package: '@fontsource-variable/space-grotesk';
+    readonly stack: '"Space Grotesk Variable", "Space Grotesk", "Manrope Variable", system-ui, sans-serif';
+}, {
+    readonly id: 'plex-sans';
+    readonly label: 'IBM Plex Sans';
+    readonly category: 'sans';
+    readonly source: 'bundled';
+    readonly package: '@fontsource-variable/ibm-plex-sans';
+    readonly stack: '"IBM Plex Sans Variable", "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif';
+}, {
+    readonly id: 'inter';
+    readonly label: 'Inter';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/inter';
+    readonly stack: '"Inter Variable", "Inter", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/inter");
+    }>;
+}, {
+    readonly id: 'geist';
+    readonly label: 'Geist';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/geist';
+    readonly stack: '"Geist Variable", "Geist", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/geist");
+    }>;
+}, {
+    readonly id: 'dm-sans';
+    readonly label: 'DM Sans';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/dm-sans';
+    readonly stack: '"DM Sans Variable", "DM Sans", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/dm-sans");
+    }>;
+}, {
+    readonly id: 'source-sans-3';
+    readonly label: 'Source Sans 3';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/source-sans-3';
+    readonly stack: '"Source Sans 3 Variable", "Source Sans 3", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/source-sans-3");
+    }>;
+}, {
+    readonly id: 'nunito-sans';
+    readonly label: 'Nunito Sans';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/nunito-sans';
+    readonly stack: '"Nunito Sans Variable", "Nunito Sans", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/nunito-sans");
+    }>;
+}, {
+    readonly id: 'figtree';
+    readonly label: 'Figtree';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/figtree';
+    readonly stack: '"Figtree Variable", "Figtree", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/figtree");
+    }>;
+}, {
+    readonly id: 'plus-jakarta-sans';
+    readonly label: 'Plus Jakarta Sans';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/plus-jakarta-sans';
+    readonly stack: '"Plus Jakarta Sans Variable", "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/plus-jakarta-sans");
+    }>;
+}, {
+    readonly id: 'outfit';
+    readonly label: 'Outfit';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/outfit';
+    readonly stack: '"Outfit Variable", "Outfit", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/outfit");
+    }>;
+}, {
+    readonly id: 'onest';
+    readonly label: 'Onest';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/onest';
+    readonly stack: '"Onest Variable", "Onest", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/onest");
+    }>;
+}, {
+    readonly id: 'lexend';
+    readonly label: 'Lexend';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/lexend';
+    readonly stack: '"Lexend Variable", "Lexend", ui-sans-serif, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/lexend");
+    }>;
+}, {
+    readonly id: 'atkinson-next';
+    readonly label: 'Atkinson Hyperlegible Next';
+    readonly category: 'sans';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/atkinson-hyperlegible-next';
+    readonly stack: '"Atkinson Hyperlegible Next Variable", "Atkinson Hyperlegible Next", Verdana, system-ui, sans-serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/atkinson-hyperlegible-next");
+    }>;
+}, {
+    readonly id: 'system-sans';
+    readonly label: 'System UI';
+    readonly category: 'sans';
+    readonly source: 'system';
+    readonly stack: 'system-ui, -apple-system, "Segoe UI Variable Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif';
+}, {
+    readonly id: 'source-serif-4';
+    readonly label: 'Source Serif 4';
+    readonly category: 'serif';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/source-serif-4';
+    readonly stack: '"Source Serif 4 Variable", "Source Serif 4", Georgia, "Times New Roman", serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/source-serif-4");
+    }>;
+}, {
+    readonly id: 'literata';
+    readonly label: 'Literata';
+    readonly category: 'serif';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/literata';
+    readonly stack: '"Literata Variable", "Literata", Georgia, "Times New Roman", serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/literata");
+    }>;
+}, {
+    readonly id: 'plex-serif';
+    readonly label: 'IBM Plex Serif';
+    readonly category: 'serif';
+    readonly source: 'lazy';
+    readonly package: '@fontsource/ibm-plex-serif';
+    readonly stack: '"IBM Plex Serif", Georgia, "Times New Roman", serif';
+    readonly load: () => Promise<[typeof import("@fontsource/*"), typeof import("@fontsource/*"), typeof import("@fontsource/*")]>;
+}, {
+    readonly id: 'fraunces';
+    readonly label: 'Fraunces';
+    readonly category: 'serif';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/fraunces';
+    readonly stack: '"Fraunces Variable", "Fraunces", Georgia, "Times New Roman", serif';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/fraunces");
+    }>;
+}, {
+    readonly id: 'system-serif';
+    readonly label: 'Charter / Georgia';
+    readonly category: 'serif';
+    readonly source: 'system';
+    readonly stack: '"Iowan Old Style", Charter, "Source Serif 4", Georgia, "Times New Roman", serif';
+}, {
+    readonly id: 'plex-mono';
+    readonly label: 'IBM Plex Mono';
+    readonly category: 'mono';
+    readonly source: 'bundled';
+    readonly package: '@fontsource/ibm-plex-mono';
+    readonly stack: '"IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace';
+}, {
+    readonly id: 'jetbrains-mono';
+    readonly label: 'JetBrains Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/jetbrains-mono';
+    readonly stack: '"JetBrains Mono Variable", "JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/jetbrains-mono");
+    }>;
+}, {
+    readonly id: 'fira-code';
+    readonly label: 'Fira Code';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/fira-code';
+    readonly stack: '"Fira Code Variable", "Fira Code", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/fira-code");
+    }>;
+}, {
+    readonly id: 'cascadia-code';
+    readonly label: 'Cascadia Code';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/cascadia-code';
+    readonly stack: '"Cascadia Code Variable", "Cascadia Code", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/cascadia-code");
+    }>;
+}, {
+    readonly id: 'geist-mono';
+    readonly label: 'Geist Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/geist-mono';
+    readonly stack: '"Geist Mono Variable", "Geist Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/geist-mono");
+    }>;
+}, {
+    readonly id: 'source-code-pro';
+    readonly label: 'Source Code Pro';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/source-code-pro';
+    readonly stack: '"Source Code Pro Variable", "Source Code Pro", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/source-code-pro");
+    }>;
+}, {
+    readonly id: 'roboto-mono';
+    readonly label: 'Roboto Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/roboto-mono';
+    readonly stack: '"Roboto Mono Variable", "Roboto Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/roboto-mono");
+    }>;
+}, {
+    readonly id: 'victor-mono';
+    readonly label: 'Victor Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/victor-mono';
+    readonly stack: '"Victor Mono Variable", "Victor Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/victor-mono");
+    }>;
+}, {
+    readonly id: 'commit-mono';
+    readonly label: 'Commit Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource/commit-mono';
+    readonly stack: '"Commit Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<[typeof import("@fontsource/*"), typeof import("@fontsource/*"), typeof import("@fontsource/*")]>;
+}, {
+    readonly id: 'red-hat-mono';
+    readonly label: 'Red Hat Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/red-hat-mono';
+    readonly stack: '"Red Hat Mono Variable", "Red Hat Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/red-hat-mono");
+    }>;
+}, {
+    readonly id: 'intel-one-mono';
+    readonly label: 'Intel One Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource/intel-one-mono';
+    readonly stack: '"Intel One Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<[typeof import("@fontsource/*"), typeof import("@fontsource/*"), typeof import("@fontsource/*")]>;
+}, {
+    readonly id: 'martian-mono';
+    readonly label: 'Martian Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/martian-mono';
+    readonly stack: '"Martian Mono Variable", "Martian Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/martian-mono");
+    }>;
+}, {
+    readonly id: 'noto-sans-mono';
+    readonly label: 'Noto Sans Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource-variable/noto-sans-mono';
+    readonly stack: '"Noto Sans Mono Variable", "Noto Sans Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<{
+        default: typeof import("@fontsource-variable/noto-sans-mono");
+    }>;
+}, {
+    readonly id: 'iosevka';
+    readonly label: 'Iosevka';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource/iosevka';
+    readonly stack: '"Iosevka", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<typeof import("@fontsource/*")>;
+}, {
+    readonly id: 'ubuntu-mono';
+    readonly label: 'Ubuntu Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource/ubuntu-mono';
+    readonly stack: '"Ubuntu Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<[typeof import("@fontsource/*"), typeof import("@fontsource/*")]>;
+}, {
+    readonly id: 'space-mono';
+    readonly label: 'Space Mono';
+    readonly category: 'mono';
+    readonly source: 'lazy';
+    readonly package: '@fontsource/space-mono';
+    readonly stack: '"Space Mono", "IBM Plex Mono", ui-monospace, monospace';
+    readonly load: () => Promise<[typeof import("@fontsource/*"), typeof import("@fontsource/*")]>;
+}, {
+    readonly id: 'system-mono';
+    readonly label: 'System Mono';
+    readonly category: 'mono';
+    readonly source: 'system';
+    readonly stack: 'ui-monospace, "SF Mono", "Cascadia Mono", Consolas, Menlo, "Liberation Mono", monospace';
+}];
+export type FontFamilyId = (typeof FONT_FAMILY_LIST)[number]['id'];
+export interface FontFamilyDefinition extends FontFamilyBase {
+    id: FontFamilyId;
+}
+export declare const FONT_FAMILIES: readonly FontFamilyDefinition[];
+export type FontPresetId = 'workbench' | 'plex' | 'modern' | 'geist' | 'classic' | 'editorial' | 'readable' | 'friendly' | 'monospace' | 'system';
+export interface FontPresetDefinition {
+    id: FontPresetId;
+    labelKey: string;
+    descriptionKey: string;
+    /** Base roles are required; derived roles follow their parent unless set. */
+    families: Readonly<Record<'ui' | 'display' | 'code', FontFamilyId> & Partial<Record<DerivedRole, FontFamilyId>>>;
+}
+export declare const FONT_PRESETS: readonly FontPresetDefinition[];
+export declare const DEFAULT_FONT_PRESET: FontPresetId;
+export declare const FONT_SIZE_LIMITS: {
+    /** Multiplier for every absolute text size in the interface. */
+    readonly uiScale: {
+        readonly min: 0.8;
+        readonly max: 1.4;
+        readonly step: 0.05;
+    };
+    readonly editorFontSize: {
+        readonly min: 10;
+        readonly max: 24;
+        readonly step: 1;
+    };
+    readonly terminalFontSize: {
+        readonly min: 10;
+        readonly max: 24;
+        readonly step: 1;
+    };
+    /** Multiplier of the code font size (editor, diff view, code blocks). */
+    readonly codeLineHeight: {
+        readonly min: 1.2;
+        readonly max: 2;
+        readonly step: 0.05;
+    };
+    /** xterm row-height multiplier. */
+    readonly terminalLineHeight: {
+        readonly min: 1;
+        readonly max: 1.6;
+        readonly step: 0.05;
+    };
+};
+export type FontNumericSetting = keyof typeof FONT_SIZE_LIMITS;
+export interface FontSettings {
+    preset: FontPresetId;
+    /** Per-role family overrides. Only real deviations from the fallback are kept. */
+    overrides: Partial<Record<FontRole, FontFamilyId>>;
+    uiScale: number;
+    editorFontSize: number;
+    terminalFontSize: number;
+    codeLineHeight: number;
+    terminalLineHeight: number;
+    /** Programming ligatures in code blocks and the editor (not xterm). */
+    ligatures: boolean;
+}
+export type SizePresetId = 'compact' | 'normal' | 'comfortable' | 'large';
+export interface SizePresetDefinition {
+    id: SizePresetId;
+    labelKey: string;
+    values: Readonly<Pick<FontSettings, FontNumericSetting>>;
+}
+export declare const SIZE_PRESETS: readonly SizePresetDefinition[];
+export declare const DEFAULT_FONT_SETTINGS: FontSettings;
+export declare function isFontRole(value: unknown): value is FontRole;
+export declare function isFontPresetId(value: unknown): value is FontPresetId;
+export declare function isFontFamilyId(value: unknown): value is FontFamilyId;
+export declare function getFontPreset(value: unknown): FontPresetDefinition;
+export declare function getFontFamily(id: FontFamilyId): FontFamilyDefinition;
+export declare function fontFamiliesForRole(role: FontRole): FontFamilyDefinition[];
+export declare function isFamilyAllowedForRole(role: FontRole, id: FontFamilyId): boolean;
+export declare function clampFontSetting(key: FontNumericSetting, value: unknown): number;
+/** Coerce an untrusted (persisted/legacy) value into valid settings. */
+export declare function normalizeFontSettings(value: unknown): FontSettings;
+/** Tolerates missing settings (a store mocked without `fonts`) by resolving
+ *  to the defaults. */
+export declare function resolveFontFamilies(settings: FontSettings | undefined): Record<FontRole, FontFamilyId>;
+/** The family a role shows when its override is cleared. */
+export declare function fallbackFontFamily(settings: FontSettings, role: FontRole): FontFamilyId;
+export declare function resolveFontStacks(settings: FontSettings | undefined): Record<FontRole, string>;
+export declare function matchSizePreset(settings: FontSettings): SizePresetId | null;
+export interface EditorFontOptions {
+    fontFamily: string;
+    fontSize: number;
+    /** Absolute pixels — Monaco treats small values as multipliers. */
+    lineHeight: number;
+    fontLigatures: boolean;
+}
+export declare function editorFontOptions(settings: FontSettings | undefined): EditorFontOptions;
+export interface TerminalFontOptions {
+    fontFamily: string;
+    fontSize: number;
+    lineHeight: number;
+}
+export declare function terminalFontOptions(settings: FontSettings | undefined): TerminalFontOptions;
+/** Inline-style font size that follows the interface text scale — for the
+ *  few components that size text from JS (graphs, inline-styled panels). */
+export declare function scaledPx(px: number): string;
+export declare const CODE_LIGATURE_FEATURES_ON = "\"liga\" 1, \"calt\" 1";
+export declare const CODE_LIGATURE_FEATURES_OFF = "\"liga\" 0, \"calt\" 0";
+/** Write settings onto <html>. Values equal to their `index.css` fallback are
+ *  removed, so the stylesheet stays the single source of the defaults. */
+export declare function applyFontSettings(root: HTMLElement, settings: FontSettings): void;
+/** Load (once) and wait for the given families. Resolves even when a font
+ *  fails — the stack's fallbacks keep rendering. Listeners fire after each
+ *  newly finished family so canvas-measured widgets (Monaco, xterm) re-measure. */
+export declare function loadFontFamilies(ids: Iterable<FontFamilyId>): Promise<void>;
+export declare function subscribeFontLoads(listener: () => void): () => void;
+export declare function getFontLoadVersion(): number;
+export {};
+//# sourceMappingURL=fonts.d.ts.map

package/dist/stores/config-store.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
+import { type FontSettings } from '@/lib/fonts';
 import { type PaletteId } from '@/lib/palettes';
 export interface ConfigState {
     provider: string;
@@ -26,6 +27,9 @@ export interface ConfigState {
      *  blocks. Mirrors the ThemeProvider's `wrongstack-palette` localStorage
      *  entry so the choice survives reloads and cross-surface config reads. */
     palette: PaletteId;
+    /** Typography — preset, per-role overrides, and size controls; see
+     *  `lib/fonts.ts`. Applied to <html> (and font loading) by ThemeProvider. */
+    fonts: FontSettings;
     autoConnect: boolean;
     /** Play a soft synthesized chime when run.result lands with status=done.
      *  Off by default — opt-in via the Command Palette. Persisted so the
@@ -34,9 +38,10 @@ export interface ConfigState {
     soundOnComplete: boolean;
     setProvider: (provider: string) => void;
     setModel: (model: string) => void;
-    setConfig: (config: Partial<Omit<ConfigState, 'setProvider' | 'setModel' | 'setConfig' | 'setTheme' | 'setPalette'>>) => void;
+    setConfig: (config: Partial<Omit<ConfigState, 'setProvider' | 'setModel' | 'setConfig' | 'setTheme' | 'setPalette' | 'setFonts'>>) => void;
     setTheme: (theme: 'light' | 'dark' | 'system') => void;
     setPalette: (palette: PaletteId) => void;
+    setFonts: (fonts: FontSettings) => void;
     setWsConnected: (connected: boolean) => void;
     setWsStatus: (s: ConfigState['wsStatus']) => void;
     setSoundOnComplete: (on: boolean) => void;
@@ -51,6 +56,7 @@ export declare const useConfigStore: import("zustand").UseBoundStore<Omit<import
             baseUrl: string | undefined;
             theme: "dark" | "light" | "system";
             palette: PaletteId;
+            fonts: FontSettings;
             autoConnect: boolean;
             soundOnComplete: boolean;
         }, unknown>>) => void;
@@ -65,6 +71,7 @@ export declare const useConfigStore: import("zustand").UseBoundStore<Omit<import
             baseUrl: string | undefined;
             theme: "dark" | "light" | "system";
             palette: PaletteId;
+            fonts: FontSettings;
             autoConnect: boolean;
             soundOnComplete: boolean;
         }, unknown>>;

package/dist/stores/types.d.ts CHANGED Viewed

@@ -83,6 +83,12 @@ export interface ChatMessage {
     /** Wall-clock ms reported by the backend in tool.executed; rendered next
      *  to the tool name so the user can spot slow tools at a glance. */
     toolDurationMs?: number | undefined;
+    /** Authoritative output metrics from `tool.executed`. These can differ from
+     *  the displayed body when the backend bounded a large result, so cards must
+     *  preserve them rather than re-counting the preview string. */
+    toolOutputBytes?: number | undefined;
+    toolOutputTokens?: number | undefined;
+    toolOutputLines?: number | undefined;
     /** Backend's tool_use id (e.g. "toolu_..." from Anthropic). Used to map
      *  tool.executed events back to the right bubble when the model fires
      *  multiple tools in parallel — currentToolId alone only points at the

package/dist/stores/ui-store-types.d.ts CHANGED Viewed

@@ -28,7 +28,7 @@ export type View = (typeof VIEWS)[number];
 export declare function coerceView(value: unknown): View;
 export declare const DOCK_SECTIONS: readonly ['goal', 'goal-state', 'fleet', 'work', 'worktrees', 'collab'];
 export declare function coerceDockSection(value: unknown): DockSection | null;
-export declare const SETTINGS_TABS: readonly ['general', 'provider', 'connection', 'agent', 'execution', 'fallbacks', 'routing', 'fleet', 'integrations', 'chimera', 'context', 'logs', 'security', 'display'];
+export declare const SETTINGS_TABS: readonly ['general', 'fonts', 'provider', 'connection', 'agent', 'execution', 'fallbacks', 'routing', 'fleet', 'integrations', 'chimera', 'context', 'logs', 'security', 'display'];
 export declare function coerceSettingsTab(value: unknown): string;
 /** Single source of truth for the secondary panel width bounds. */
 export declare const SIDEBAR_MIN_WIDTH = 240;