waybetter 0.1.1 → 0.7.0

package/dist/shell/panel/fonts/FontBrowser.js

@@ -0,0 +1,189 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// The font browser: every Google Fonts family (offline catalog) with live previews rendered in the
+// font itself, category filters and search, a detail view with editable sample text and weight
+// selection, plus the built-in and system fonts. Google fonts are downloaded natively once (woff2
+// from fonts.googleapis.com / fonts.gstatic.com into app data), then the site's page loads them from bytes.
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { FONT_CHOICES, fontStack, sanitizeFonts } from "../../../runtime/themeSpec.js";
+import { invoke } from "../../frame/bridge.js";
+import { useT } from "../../frame/hooks.js";
+import { tx } from "../../frame/i18n.js";
+import { Button, Segmented, Slider } from "../controls.js";
+import { panelThemes } from "../site.js";
+import { themeStore, useThemeState } from "../themes.js";
+import { CATEGORIES, availableWeights, bytesLabel, defaultWeights, loadCatalog, searchFonts, specimenUrl, stackFor, weightsLabel, } from "./catalog.js";
+const PAGE = 60;
+const SAMPLES = [
+    'The quick brown fox jumps over the lazy dog',
+    'Your timeline, your way. 1,284 likes · 3.2K reposts',
+    'Pijamalı hasta yağız şoföre çabucak güvendi',
+];
+/** Renders `text` in `font`: the installed family, else a tiny text-subset preview fetched natively. */
+function FontText({ font, text, weight, className, eager }) {
+    const ref = useRef(null);
+    const [family, setFamily] = useState(null);
+    const [visible, setVisible] = useState(!!eager);
+    const { ensureShellFont, isInstalled, previewFont } = themeStore();
+    const installed = isInstalled(font.family);
+    useEffect(() => {
+        if (visible)
+            return;
+        const node = ref.current;
+        if (!node || typeof IntersectionObserver === 'undefined') {
+            setVisible(true);
+            return;
+        }
+        const observer = new IntersectionObserver(entries => { if (entries.some(entry => entry.isIntersecting)) {
+            setVisible(true);
+            observer.disconnect();
+        } }, { rootMargin: '120px' });
+        observer.observe(node);
+        return () => observer.disconnect();
+    }, [visible]);
+    useEffect(() => {
+        if (!visible || !text)
+            return;
+        let live = true;
+        const timer = setTimeout(() => {
+            const load = installed
+                ? ensureShellFont(font.family).then(ok => ok ? font.family : null)
+                : previewFont(font.family, font.axis ? { kind: 'range', min: font.axis[0], max: font.axis[1] } : { kind: 'list', values: font.weights.slice(0, 9) }, [...new Set(text)].join('').slice(0, 120));
+            void load.then(name => { if (live)
+                setFamily(name); });
+        }, eager ? 250 : 0);
+        return () => { live = false; clearTimeout(timer); };
+    }, [visible, text, font.family, installed]);
+    return _jsx("span", { ref: ref, className: `${className ?? ''} ${family ? 'is-ready' : 'is-loading'}`, style: { fontFamily: family ? `"${family}", ${stackFor(font).slice(1).join(', ')}` : undefined, fontWeight: weight }, children: text });
+}
+export function FontBrowser({ role, current, onPick, onClose }) {
+    const t = useT();
+    const { fonts: installedFonts } = useThemeState();
+    const [tab, setTab] = useState('google');
+    const [catalog, setCatalog] = useState([]);
+    const [query, setQuery] = useState('');
+    const [category, setCategory] = useState('all');
+    const [onlyInstalled, setOnlyInstalled] = useState(false);
+    const [limit, setLimit] = useState(PAGE);
+    const [selected, setSelected] = useState(current);
+    const [active, setActive] = useState(0);
+    const search = useRef(null);
+    const list = useRef(null);
+    const root = useRef(null);
+    useEffect(() => { void loadCatalog().then(setCatalog); search.current?.focus(); }, []);
+    useEffect(() => {
+        const onKey = (event) => { if (event.key === 'Escape') {
+            event.preventDefault();
+            event.stopPropagation();
+            onClose();
+        } };
+        window.addEventListener('keydown', onKey, true);
+        return () => window.removeEventListener('keydown', onKey, true);
+    }, [onClose]);
+    const installed = useMemo(() => new Set(installedFonts.map(font => font.family)), [installedFonts]);
+    const results = useMemo(() => searchFonts(catalog, { query, category, only: onlyInstalled ? installed : undefined }), [catalog, query, category, onlyInstalled, installed]);
+    useEffect(() => { setLimit(PAGE); setActive(0); list.current?.scrollTo({ top: 0 }); }, [query, category, onlyInstalled]);
+    const shown = results.slice(0, limit);
+    const detail = catalog.find(font => font.family === selected) ?? shown[0] ?? null;
+    const onListKey = (event) => {
+        if (!shown.length)
+            return;
+        const move = (index) => {
+            const next = Math.max(0, Math.min(shown.length - 1, index));
+            setActive(next);
+            list.current?.querySelectorAll('li')[next]?.scrollIntoView({ block: 'nearest' });
+        };
+        if (event.key === 'ArrowDown') {
+            event.preventDefault();
+            move(active + 1);
+        }
+        else if (event.key === 'ArrowUp') {
+            event.preventDefault();
+            if (active === 0 && event.target === list.current)
+                search.current?.focus();
+            else
+                move(active - 1);
+        }
+        else if (event.key === 'PageDown') {
+            event.preventDefault();
+            move(active + 8);
+        }
+        else if (event.key === 'PageUp') {
+            event.preventDefault();
+            move(active - 8);
+        }
+        else if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            setSelected(shown[active].family);
+        }
+    };
+    // Inside the panel (not the whole window): site panes are native webviews above the shell elsewhere.
+    return createPortal(_jsx("div", { className: "wb-sheet-backdrop", onMouseDown: event => { if (event.target === event.currentTarget)
+            onClose(); }, children: _jsxs("div", { ref: root, className: "wb-sheet wb-fb", role: "dialog", "aria-modal": "true", "aria-label": t('wb.fonts.chooseFor', { role }), children: [_jsxs("header", { className: "wb-sheet-head", children: [_jsxs("div", { children: [_jsxs("h2", { children: [t('wb.fonts.choose'), " ", _jsx("span", { children: t('wb.fonts.forRole', { role }) })] }), _jsx("p", { children: tab === 'google' ? t('wb.fonts.googleCount', { count: catalog.length || 1800 }) : t('wb.fonts.systemHint') })] }), _jsx(Segmented, { label: t('wb.fonts.source'), size: "sm", value: tab, onChange: setTab, options: [{ value: 'google', label: 'Google Fonts' }, { value: 'system', label: t('wb.fonts.builtIn') }] }), _jsx("button", { type: "button", className: "wb-sheet-close", "aria-label": t('wb.common.close'), onClick: onClose, children: _jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", "aria-hidden": "true", children: _jsx("path", { d: "m3.5 3.5 7 7m0-7-7 7", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" }) }) })] }), tab === 'system' ? _jsx(SystemFonts, { current: current, onPick: onPick }) : _jsxs(_Fragment, { children: [_jsxs("div", { className: "wb-fb-tools", children: [_jsxs("label", { className: "bt-search wb-fb-search", children: [_jsxs("svg", { width: "14", height: "14", viewBox: "0 0 16 16", "aria-hidden": "true", children: [_jsx("circle", { cx: "7", cy: "7", r: "4.75", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }), _jsx("path", { d: "m10.5 10.5 3 3", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })] }), _jsx("input", { ref: search, type: "search", "aria-label": t('wb.fonts.search'), placeholder: t('wb.fonts.searchPlaceholder'), value: query, onChange: event => setQuery(event.target.value), onKeyDown: event => {
+                                                if (event.key === 'ArrowDown') {
+                                                    event.preventDefault();
+                                                    list.current?.focus();
+                                                    setActive(0);
+                                                }
+                                                if (event.key === 'Enter' && shown[0]) {
+                                                    event.preventDefault();
+                                                    setSelected(shown[0].family);
+                                                }
+                                            } })] }), _jsxs("div", { className: "wb-fb-cats", role: "radiogroup", "aria-label": t('wb.fonts.category'), children: [CATEGORIES.map(item => _jsx("button", { type: "button", role: "radio", "aria-checked": category === item, className: category === item ? 'is-on' : '', onClick: () => setCategory(item), children: tx(`wb.fonts.category.${item}`) }, item)), _jsxs("button", { type: "button", role: "checkbox", "aria-checked": onlyInstalled, className: `wb-fb-installed ${onlyInstalled ? 'is-on' : ''}`, onClick: () => setOnlyInstalled(!onlyInstalled), children: [t('wb.fonts.downloaded'), installed.size ? ` · ${installed.size}` : ''] })] })] }), _jsxs("div", { className: "wb-fb-body", children: [_jsxs("ul", { ref: list, className: "wb-fb-list", role: "listbox", tabIndex: 0, "aria-label": t('wb.fonts.families'), "aria-activedescendant": shown[active] ? `wb-fb-${active}` : undefined, onKeyDown: onListKey, children: [!catalog.length && _jsx("li", { className: "wb-fb-empty", children: t('wb.fonts.loadingCatalog') }), catalog.length > 0 && !shown.length && _jsx("li", { className: "wb-fb-empty", children: t('wb.fonts.noMatch', { query }) }), shown.map((font, index) => _jsxs("li", { id: `wb-fb-${index}`, role: "option", "aria-selected": font.family === selected, className: `${index === active ? 'is-active' : ''} ${font.family === selected ? 'is-on' : ''}`, onPointerEnter: () => setActive(index), onClick: () => { setActive(index); setSelected(font.family); }, children: [_jsx(FontText, { font: font, text: font.family, className: "wb-fb-name" }), _jsxs("span", { className: "wb-fb-meta", children: [tx(`wb.fonts.categoryName.${font.category}`), " \u00B7 ", font.axis ? t('wb.fonts.variable') : t('wb.fonts.weightCount', { count: font.weights.length })] }), installed.has(font.family) && _jsx("span", { className: "wb-fb-tag", children: t('wb.fonts.downloaded') }), current === font.family && _jsx("span", { className: "wb-fb-tag is-accent", children: t('wb.fonts.inUse') })] }, font.family)), results.length > limit && _jsx("li", { className: "wb-fb-more", children: _jsx(Button, { size: "sm", tone: "ghost", onClick: () => setLimit(limit + PAGE), children: t('wb.fonts.showMore', { count: Math.min(PAGE, results.length - limit), total: results.length }) }) })] }), _jsx(FontDetail, { font: detail, role: role, onPick: onPick }, detail?.family ?? 'none')] })] }), _jsx("footer", { className: "wb-sheet-foot", children: t('wb.fonts.footer') })] }) }), document.querySelector('.btp') ?? document.body);
+}
+function FontDetail({ font, role, onPick }) {
+    const t = useT();
+    const { installFont } = themeStore();
+    const { fonts } = useThemeState();
+    const [sample, setSample] = useState(SAMPLES[0]);
+    const [weight, setWeight] = useState(400);
+    const [weights, setWeights] = useState(font ? defaultWeights(font) : null);
+    const [busy, setBusy] = useState(false);
+    const [error, setError] = useState('');
+    useEffect(() => {
+        if (!font)
+            return;
+        const available = availableWeights(font);
+        setWeight(available.includes(400) ? 400 : available[0] ?? 400);
+    }, [font?.family]);
+    if (!font || !weights)
+        return _jsx("div", { className: "wb-fb-detail is-empty", children: _jsx("p", { children: t('wb.fonts.detailEmpty', { role }) }) });
+    const installed = fonts.find(item => item.family === font.family);
+    const available = availableWeights(font);
+    const pick = async () => {
+        setError('');
+        if (!installed || JSON.stringify(installed.weights) !== JSON.stringify(weights)) {
+            setBusy(true);
+            try {
+                await installFont(font.family, weights);
+            }
+            catch (reason) {
+                setBusy(false);
+                setError(reason instanceof Error ? reason.message : String(reason));
+                return;
+            }
+            setBusy(false);
+        }
+        onPick({ family: stackFor(font), source: 'google' });
+    };
+    const toggle = (value) => {
+        if (weights.kind !== 'list')
+            return;
+        const values = weights.values.includes(value) ? weights.values.filter(item => item !== value) : [...weights.values, value].sort((a, b) => a - b);
+        if (values.length)
+            setWeights({ kind: 'list', values });
+    };
+    return _jsxs("div", { className: "wb-fb-detail", children: [_jsxs("div", { className: "wb-fb-hero", children: [_jsx(FontText, { font: font, text: font.family, className: "wb-fb-hero-name", weight: weight, eager: true }), _jsxs("span", { className: "wb-fb-hero-meta", children: [tx(`wb.fonts.categoryName.${font.category}`), " \u00B7 ", font.axis ? t('wb.fonts.variableRange', { min: font.axis[0], max: font.axis[1] }) : t('wb.fonts.weightsList', { weights: font.weights.join(', ') }), installed ? ` · ${t('wb.fonts.downloadedSize', { size: bytesLabel(installed.bytes) })}` : ''] })] }), _jsxs("div", { className: "wb-fb-sample", children: [_jsx(FontText, { font: font, text: sample || font.family, className: "wb-fb-sample-text", weight: weight, eager: true }), _jsx("textarea", { "aria-label": t('wb.fonts.sample'), value: sample, maxLength: 120, rows: 2, spellCheck: false, onChange: event => setSample(event.target.value) }), _jsx("div", { className: "wb-fb-samples", children: SAMPLES.map(text => _jsxs("button", { type: "button", className: text === sample ? 'is-on' : '', onClick: () => setSample(text), children: [text.slice(0, 18), "\u2026"] }, text)) })] }), _jsxs("div", { className: "wb-fb-field", children: [_jsx("span", { children: t('wb.fonts.previewWeight') }), font.axis
+                        ? _jsx(Slider, { label: t('wb.fonts.previewWeight'), min: font.axis[0], max: font.axis[1], step: 10, value: weight, format: v => String(v), onChange: setWeight })
+                        : _jsx("div", { className: "wb-fb-weights", role: "radiogroup", "aria-label": t('wb.fonts.previewWeight'), children: available.map(value => _jsx("button", { type: "button", role: "radio", "aria-checked": weight === value, className: weight === value ? 'is-on' : '', onClick: () => setWeight(value), children: value }, value)) })] }), _jsxs("div", { className: "wb-fb-field", children: [_jsx("span", { children: t('wb.panel.updates.download') }), weights.kind === 'range'
+                        ? _jsxs("div", { className: "wb-fb-range", children: [_jsx(Slider, { label: t('wb.fonts.lightest'), min: font.axis[0], max: weights.max, step: 100, value: weights.min, format: v => t('wb.fonts.fromWeight', { weight: v }), onChange: min => setWeights({ ...weights, min }) }), _jsx(Slider, { label: t('wb.fonts.heaviest'), min: weights.min, max: font.axis[1], step: 100, value: weights.max, format: v => t('wb.fonts.toWeight', { weight: v }), onChange: max => setWeights({ ...weights, max }) })] })
+                        : _jsx("div", { className: "wb-fb-weights", role: "group", "aria-label": t('wb.fonts.weightsToDownload'), children: available.map(value => _jsx("button", { type: "button", role: "checkbox", "aria-checked": weights.values.includes(value), className: weights.values.includes(value) ? 'is-on' : '', onClick: () => toggle(value), children: value }, value)) }), _jsxs("small", { children: [font.axis ? t('wb.fonts.variableFile') : t('wb.fonts.staticFiles'), " ", weightsLabel(weights)] })] }), error && _jsx("p", { className: "wb-fb-error", role: "alert", children: error }), _jsxs("div", { className: "wb-fb-actions", children: [_jsx(Button, { tone: "primary", disabled: busy, onClick: () => void pick(), children: busy ? t('wb.fonts.downloading') : installed && JSON.stringify(installed.weights) === JSON.stringify(weights) ? t('wb.fonts.useFor', { role }) : t('wb.fonts.downloadUseFor', { role }) }), _jsx(Button, { tone: "ghost", onClick: () => void invoke('open_external_url', { url: specimenUrl(font.family) }).catch(() => { }), children: t('wb.fonts.license') })] })] });
+}
+function SystemFonts({ current, onPick }) {
+    const t = useT();
+    const [custom, setCustom] = useState('');
+    const valid = sanitizeFonts([custom.trim()]).length === 1;
+    return _jsxs("div", { className: "wb-fb-system", children: [_jsx("ul", { className: "wb-fb-grid", children: (panelThemes().fontChoices ?? FONT_CHOICES).filter(choice => choice.family.length).map(choice => _jsx("li", { children: _jsxs("button", { type: "button", className: current === choice.family[0] ? 'is-on' : '', onClick: () => onPick({ family: choice.family }), children: [_jsx("span", { style: { fontFamily: fontStack(choice.family) }, children: choice.key ? tx(choice.key, undefined, choice.label) : choice.label }), _jsx("small", { style: { fontFamily: fontStack(choice.family) }, children: "Aa Bb 0123 \u00B7 The quick brown fox" })] }) }, choice.id)) }), _jsxs("form", { className: "wb-fb-custom", onSubmit: event => { event.preventDefault(); if (valid)
+                    onPick({ family: [custom.trim(), 'system-ui', 'sans-serif'] }); }, children: [_jsxs("label", { children: [_jsx("span", { children: t('wb.fonts.installedFont') }), _jsx("input", { value: custom, placeholder: t('wb.fonts.installedPlaceholder'), onChange: event => setCustom(event.target.value), style: valid ? { fontFamily: fontStack([custom.trim()]) } : undefined })] }), _jsx(Button, { type: "submit", size: "sm", disabled: !valid, children: t('wb.fonts.useIt') })] })] });
+}
+//# sourceMappingURL=FontBrowser.js.map

package/dist/shell/panel/fonts/FontBrowser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FontBrowser.js","sourceRoot":"","sources":["../../../../../../../shell/src/panel/fonts/FontBrowser.tsx"],"names":[],"mappings":"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","sourcesContent":["// The font browser: every Google Fonts family (offline catalog) with live previews rendered in the\n// font itself, category filters and search, a detail view with editable sample text and weight\n// selection, plus the built-in and system fonts. Google fonts are downloaded natively once (woff2\n// from fonts.googleapis.com / fonts.gstatic.com into app data), then the site's page loads them from bytes.\nimport { useEffect, useMemo, useRef, useState, type KeyboardEvent as ReactKeyboardEvent } from 'react';\nimport { createPortal } from 'react-dom';\nimport { FONT_CHOICES, fontStack, sanitizeFonts } from '../../../../runtime/src/themeSpec.ts';\nimport { invoke } from '../../frame/bridge.ts';\nimport { useT } from '../../frame/hooks.ts';\nimport { tx } from '../../frame/i18n.ts';\nimport { Button, Segmented, Slider } from '../controls.tsx';\nimport { panelThemes } from '../site.ts';\nimport { themeStore, useThemeState } from '../themes.ts';\nimport {\n  CATEGORIES, availableWeights, bytesLabel, defaultWeights, loadCatalog, searchFonts, specimenUrl, stackFor, weightsLabel,\n  type CatalogFont, type Category, type Weights,\n} from './catalog.ts';\n\nexport type FontPick = { family: string[]; source?: 'google' };\nconst PAGE = 60;\nconst SAMPLES = [\n  'The quick brown fox jumps over the lazy dog',\n  'Your timeline, your way. 1,284 likes · 3.2K reposts',\n  'Pijamalı hasta yağız şoföre çabucak güvendi',\n];\n\n/** Renders `text` in `font`: the installed family, else a tiny text-subset preview fetched natively. */\nfunction FontText({ font, text, weight, className, eager }: { font: CatalogFont; text: string; weight?: number; className?: string; eager?: boolean }) {\n  const ref = useRef<HTMLSpanElement>(null);\n  const [family, setFamily] = useState<string | null>(null);\n  const [visible, setVisible] = useState(!!eager);\n  const { ensureShellFont, isInstalled, previewFont } = themeStore();\n  const installed = isInstalled(font.family);\n  useEffect(() => {\n    if (visible) return;\n    const node = ref.current;\n    if (!node || typeof IntersectionObserver === 'undefined') { setVisible(true); return; }\n    const observer = new IntersectionObserver(entries => { if (entries.some(entry => entry.isIntersecting)) { setVisible(true); observer.disconnect(); } }, { rootMargin: '120px' });\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [visible]);\n  useEffect(() => {\n    if (!visible || !text) return;\n    let live = true;\n    const timer = setTimeout(() => {\n      const load = installed\n        ? ensureShellFont(font.family).then(ok => ok ? font.family : null)\n        : previewFont(font.family, font.axis ? { kind: 'range', min: font.axis[0], max: font.axis[1] } : { kind: 'list', values: font.weights.slice(0, 9) }, [...new Set(text)].join('').slice(0, 120));\n      void load.then(name => { if (live) setFamily(name); });\n    }, eager ? 250 : 0);\n    return () => { live = false; clearTimeout(timer); };\n  }, [visible, text, font.family, installed]);\n  return <span ref={ref} className={`${className ?? ''} ${family ? 'is-ready' : 'is-loading'}`}\n    style={{ fontFamily: family ? `\"${family}\", ${stackFor(font).slice(1).join(', ')}` : undefined, fontWeight: weight }}>{text}</span>;\n}\n\nexport function FontBrowser({ role, current, onPick, onClose }: { role: string; current: string | null; onPick(pick: FontPick): void; onClose(): void }) {\n  const t = useT();\n  const { fonts: installedFonts } = useThemeState();\n  const [tab, setTab] = useState<'google' | 'system'>('google');\n  const [catalog, setCatalog] = useState<CatalogFont[]>([]);\n  const [query, setQuery] = useState('');\n  const [category, setCategory] = useState<Category | 'all'>('all');\n  const [onlyInstalled, setOnlyInstalled] = useState(false);\n  const [limit, setLimit] = useState(PAGE);\n  const [selected, setSelected] = useState<string | null>(current);\n  const [active, setActive] = useState(0);\n  const search = useRef<HTMLInputElement>(null);\n  const list = useRef<HTMLUListElement>(null);\n  const root = useRef<HTMLDivElement>(null);\n\n  useEffect(() => { void loadCatalog().then(setCatalog); search.current?.focus(); }, []);\n  useEffect(() => {\n    const onKey = (event: KeyboardEvent) => { if (event.key === 'Escape') { event.preventDefault(); event.stopPropagation(); onClose(); } };\n    window.addEventListener('keydown', onKey, true);\n    return () => window.removeEventListener('keydown', onKey, true);\n  }, [onClose]);\n\n  const installed = useMemo(() => new Set(installedFonts.map(font => font.family)), [installedFonts]);\n  const results = useMemo(() => searchFonts(catalog, { query, category, only: onlyInstalled ? installed : undefined }), [catalog, query, category, onlyInstalled, installed]);\n  useEffect(() => { setLimit(PAGE); setActive(0); list.current?.scrollTo({ top: 0 }); }, [query, category, onlyInstalled]);\n  const shown = results.slice(0, limit);\n  const detail = catalog.find(font => font.family === selected) ?? shown[0] ?? null;\n\n  const onListKey = (event: ReactKeyboardEvent) => {\n    if (!shown.length) return;\n    const move = (index: number) => {\n      const next = Math.max(0, Math.min(shown.length - 1, index));\n      setActive(next);\n      list.current?.querySelectorAll('li')[next]?.scrollIntoView({ block: 'nearest' });\n    };\n    if (event.key === 'ArrowDown') { event.preventDefault(); move(active + 1); }\n    else if (event.key === 'ArrowUp') { event.preventDefault(); if (active === 0 && event.target === list.current) search.current?.focus(); else move(active - 1); }\n    else if (event.key === 'PageDown') { event.preventDefault(); move(active + 8); }\n    else if (event.key === 'PageUp') { event.preventDefault(); move(active - 8); }\n    else if (event.key === 'Enter' || event.key === ' ') { event.preventDefault(); setSelected(shown[active]!.family); }\n  };\n\n  // Inside the panel (not the whole window): site panes are native webviews above the shell elsewhere.\n  return createPortal(<div className=\"wb-sheet-backdrop\" onMouseDown={event => { if (event.target === event.currentTarget) onClose(); }}>\n    <div ref={root} className=\"wb-sheet wb-fb\" role=\"dialog\" aria-modal=\"true\" aria-label={t('wb.fonts.chooseFor', { role })}>\n      <header className=\"wb-sheet-head\">\n        <div>\n          <h2>{t('wb.fonts.choose')} <span>{t('wb.fonts.forRole', { role })}</span></h2>\n          <p>{tab === 'google' ? t('wb.fonts.googleCount', { count: catalog.length || 1800 }) : t('wb.fonts.systemHint')}</p>\n        </div>\n        <Segmented<'google' | 'system'> label={t('wb.fonts.source')} size=\"sm\" value={tab} onChange={setTab} options={[{ value: 'google', label: 'Google Fonts' }, { value: 'system', label: t('wb.fonts.builtIn') }]}/>\n        <button type=\"button\" className=\"wb-sheet-close\" aria-label={t('wb.common.close')} onClick={onClose}><svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" aria-hidden=\"true\"><path d=\"m3.5 3.5 7 7m0-7-7 7\" stroke=\"currentColor\" strokeWidth=\"1.6\" strokeLinecap=\"round\"/></svg></button>\n      </header>\n      {tab === 'system' ? <SystemFonts current={current} onPick={onPick}/> : <>\n        <div className=\"wb-fb-tools\">\n          <label className=\"bt-search wb-fb-search\">\n            <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" aria-hidden=\"true\"><circle cx=\"7\" cy=\"7\" r=\"4.75\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\"/><path d=\"m10.5 10.5 3 3\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\"/></svg>\n            <input ref={search} type=\"search\" aria-label={t('wb.fonts.search')} placeholder={t('wb.fonts.searchPlaceholder')} value={query}\n              onChange={event => setQuery(event.target.value)}\n              onKeyDown={event => {\n                if (event.key === 'ArrowDown') { event.preventDefault(); list.current?.focus(); setActive(0); }\n                if (event.key === 'Enter' && shown[0]) { event.preventDefault(); setSelected(shown[0].family); }\n              }}/>\n          </label>\n          <div className=\"wb-fb-cats\" role=\"radiogroup\" aria-label={t('wb.fonts.category')}>\n            {CATEGORIES.map(item => <button key={item} type=\"button\" role=\"radio\" aria-checked={category === item} className={category === item ? 'is-on' : ''} onClick={() => setCategory(item)}>{tx(`wb.fonts.category.${item}`)}</button>)}\n            <button type=\"button\" role=\"checkbox\" aria-checked={onlyInstalled} className={`wb-fb-installed ${onlyInstalled ? 'is-on' : ''}`} onClick={() => setOnlyInstalled(!onlyInstalled)}>\n              {t('wb.fonts.downloaded')}{installed.size ? ` · ${installed.size}` : ''}</button>\n          </div>\n        </div>\n        <div className=\"wb-fb-body\">\n          <ul ref={list} className=\"wb-fb-list\" role=\"listbox\" tabIndex={0} aria-label={t('wb.fonts.families')} aria-activedescendant={shown[active] ? `wb-fb-${active}` : undefined} onKeyDown={onListKey}>\n            {!catalog.length && <li className=\"wb-fb-empty\">{t('wb.fonts.loadingCatalog')}</li>}\n            {catalog.length > 0 && !shown.length && <li className=\"wb-fb-empty\">{t('wb.fonts.noMatch', { query })}</li>}\n            {shown.map((font, index) => <li key={font.family} id={`wb-fb-${index}`} role=\"option\" aria-selected={font.family === selected}\n              className={`${index === active ? 'is-active' : ''} ${font.family === selected ? 'is-on' : ''}`}\n              onPointerEnter={() => setActive(index)} onClick={() => { setActive(index); setSelected(font.family); }}>\n              <FontText font={font} text={font.family} className=\"wb-fb-name\"/>\n              <span className=\"wb-fb-meta\">{tx(`wb.fonts.categoryName.${font.category}`)} · {font.axis ? t('wb.fonts.variable') : t('wb.fonts.weightCount', { count: font.weights.length })}</span>\n              {installed.has(font.family) && <span className=\"wb-fb-tag\">{t('wb.fonts.downloaded')}</span>}\n              {current === font.family && <span className=\"wb-fb-tag is-accent\">{t('wb.fonts.inUse')}</span>}\n            </li>)}\n            {results.length > limit && <li className=\"wb-fb-more\"><Button size=\"sm\" tone=\"ghost\" onClick={() => setLimit(limit + PAGE)}>{t('wb.fonts.showMore', { count: Math.min(PAGE, results.length - limit), total: results.length })}</Button></li>}\n          </ul>\n          <FontDetail key={detail?.family ?? 'none'} font={detail} role={role} onPick={onPick}/>\n        </div>\n      </>}\n      <footer className=\"wb-sheet-foot\">\n        {t('wb.fonts.footer')}\n      </footer>\n    </div>\n  </div>, document.querySelector('.btp') ?? document.body);\n}\n\nfunction FontDetail({ font, role, onPick }: { font: CatalogFont | null; role: string; onPick(pick: FontPick): void }) {\n  const t = useT();\n  const { installFont } = themeStore();\n  const { fonts } = useThemeState();\n  const [sample, setSample] = useState(SAMPLES[0]!);\n  const [weight, setWeight] = useState(400);\n  const [weights, setWeights] = useState<Weights | null>(font ? defaultWeights(font) : null);\n  const [busy, setBusy] = useState(false);\n  const [error, setError] = useState('');\n  useEffect(() => {\n    if (!font) return;\n    const available = availableWeights(font);\n    setWeight(available.includes(400) ? 400 : available[0] ?? 400);\n  }, [font?.family]);\n  if (!font || !weights) return <div className=\"wb-fb-detail is-empty\"><p>{t('wb.fonts.detailEmpty', { role })}</p></div>;\n  const installed = fonts.find(item => item.family === font.family);\n  const available = availableWeights(font);\n  const pick = async () => {\n    setError('');\n    if (!installed || JSON.stringify(installed.weights) !== JSON.stringify(weights)) {\n      setBusy(true);\n      try { await installFont(font.family, weights); }\n      catch (reason) { setBusy(false); setError(reason instanceof Error ? reason.message : String(reason)); return; }\n      setBusy(false);\n    }\n    onPick({ family: stackFor(font), source: 'google' });\n  };\n  const toggle = (value: number) => {\n    if (weights.kind !== 'list') return;\n    const values = weights.values.includes(value) ? weights.values.filter(item => item !== value) : [...weights.values, value].sort((a, b) => a - b);\n    if (values.length) setWeights({ kind: 'list', values });\n  };\n  return <div className=\"wb-fb-detail\">\n    <div className=\"wb-fb-hero\">\n      <FontText font={font} text={font.family} className=\"wb-fb-hero-name\" weight={weight} eager/>\n      <span className=\"wb-fb-hero-meta\">{tx(`wb.fonts.categoryName.${font.category}`)} · {font.axis ? t('wb.fonts.variableRange', { min: font.axis[0], max: font.axis[1] }) : t('wb.fonts.weightsList', { weights: font.weights.join(', ') })}{installed ? ` · ${t('wb.fonts.downloadedSize', { size: bytesLabel(installed.bytes) })}` : ''}</span>\n    </div>\n    <div className=\"wb-fb-sample\">\n      <FontText font={font} text={sample || font.family} className=\"wb-fb-sample-text\" weight={weight} eager/>\n      <textarea aria-label={t('wb.fonts.sample')} value={sample} maxLength={120} rows={2} spellCheck={false} onChange={event => setSample(event.target.value)}/>\n      <div className=\"wb-fb-samples\">{SAMPLES.map(text => <button key={text} type=\"button\" className={text === sample ? 'is-on' : ''} onClick={() => setSample(text)}>{text.slice(0, 18)}…</button>)}</div>\n    </div>\n    <div className=\"wb-fb-field\">\n      <span>{t('wb.fonts.previewWeight')}</span>\n      {font.axis\n        ? <Slider label={t('wb.fonts.previewWeight')} min={font.axis[0]} max={font.axis[1]} step={10} value={weight} format={v => String(v)} onChange={setWeight}/>\n        : <div className=\"wb-fb-weights\" role=\"radiogroup\" aria-label={t('wb.fonts.previewWeight')}>{available.map(value => <button key={value} type=\"button\" role=\"radio\" aria-checked={weight === value} className={weight === value ? 'is-on' : ''} onClick={() => setWeight(value)}>{value}</button>)}</div>}\n    </div>\n    <div className=\"wb-fb-field\">\n      <span>{t('wb.panel.updates.download')}</span>\n      {weights.kind === 'range'\n        ? <div className=\"wb-fb-range\">\n          <Slider label={t('wb.fonts.lightest')} min={font.axis![0]} max={weights.max} step={100} value={weights.min} format={v => t('wb.fonts.fromWeight', { weight: v })} onChange={min => setWeights({ ...weights, min })}/>\n          <Slider label={t('wb.fonts.heaviest')} min={weights.min} max={font.axis![1]} step={100} value={weights.max} format={v => t('wb.fonts.toWeight', { weight: v })} onChange={max => setWeights({ ...weights, max })}/>\n        </div>\n        : <div className=\"wb-fb-weights\" role=\"group\" aria-label={t('wb.fonts.weightsToDownload')}>{available.map(value => <button key={value} type=\"button\" role=\"checkbox\" aria-checked={weights.values.includes(value)} className={weights.values.includes(value) ? 'is-on' : ''} onClick={() => toggle(value)}>{value}</button>)}</div>}\n      <small>{font.axis ? t('wb.fonts.variableFile') : t('wb.fonts.staticFiles')} {weightsLabel(weights)}</small>\n    </div>\n    {error && <p className=\"wb-fb-error\" role=\"alert\">{error}</p>}\n    <div className=\"wb-fb-actions\">\n      <Button tone=\"primary\" disabled={busy} onClick={() => void pick()}>{busy ? t('wb.fonts.downloading') : installed && JSON.stringify(installed.weights) === JSON.stringify(weights) ? t('wb.fonts.useFor', { role }) : t('wb.fonts.downloadUseFor', { role })}</Button>\n      <Button tone=\"ghost\" onClick={() => void invoke('open_external_url', { url: specimenUrl(font.family) }).catch(() => {})}>{t('wb.fonts.license')}</Button>\n    </div>\n  </div>;\n}\n\nfunction SystemFonts({ current, onPick }: { current: string | null; onPick(pick: FontPick): void }) {\n  const t = useT();\n  const [custom, setCustom] = useState('');\n  const valid = sanitizeFonts([custom.trim()]).length === 1;\n  return <div className=\"wb-fb-system\">\n    <ul className=\"wb-fb-grid\">\n      {(panelThemes().fontChoices ?? FONT_CHOICES).filter(choice => choice.family.length).map(choice => <li key={choice.id}>\n        <button type=\"button\" className={current === choice.family[0] ? 'is-on' : ''} onClick={() => onPick({ family: choice.family })}>\n          <span style={{ fontFamily: fontStack(choice.family) }}>{choice.key ? tx(choice.key, undefined, choice.label) : choice.label}</span>\n          <small style={{ fontFamily: fontStack(choice.family) }}>Aa Bb 0123 · The quick brown fox</small>\n        </button>\n      </li>)}\n    </ul>\n    <form className=\"wb-fb-custom\" onSubmit={event => { event.preventDefault(); if (valid) onPick({ family: [custom.trim(), 'system-ui', 'sans-serif'] }); }}>\n      <label><span>{t('wb.fonts.installedFont')}</span>\n        <input value={custom} placeholder={t('wb.fonts.installedPlaceholder')} onChange={event => setCustom(event.target.value)} style={valid ? { fontFamily: fontStack([custom.trim()]) } : undefined}/></label>\n      <Button type=\"submit\" size=\"sm\" disabled={!valid}>{t('wb.fonts.useIt')}</Button>\n    </form>\n  </div>;\n}\n"]}

package/dist/shell/panel/fonts/FontRoles.d.ts

@@ -0,0 +1,20 @@
+import { type FontRole, type FontRoleName, type FontSpec } from '../../../runtime/themeSpec.ts';
+import '../builder.css';
+/** A font role's name and hint in the active language (`fonts.role.<role>.label/.hint`). */
+export declare const roleInfo: (role: FontRoleName) => {
+    label: string;
+    hint: string;
+};
+/** The name a role shows: its own first family, or where it inherits from. */
+export declare function roleLabel(font: FontSpec, role: FontRoleName): {
+    name: string;
+    inherited: boolean;
+    stack?: string;
+};
+/** Loads the Google fonts a font spec names into the panel so its labels render in them. */
+export declare function useShellFonts(font: FontSpec): void;
+export declare function FontRoles({ font, onRole, compact }: {
+    font: FontSpec;
+    onRole(role: FontRoleName, next: FontRole, commit?: boolean): void;
+    compact?: boolean;
+}): import("react").JSX.Element;

package/dist/shell/panel/fonts/FontRoles.js

@@ -0,0 +1,77 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// "Which font goes where": one row per font role. Every role inherits the interface font until it
+// is given its own (from Google Fonts, the bundled Geist fonts or an installed system font), and
+// every role but the interface can fine-tune weight, size, letter spacing and tabular figures.
+import { useEffect, useState } from 'react';
+import { FONT_ROLE_NAMES, ROLE_LIMITS, fontStack, sanitizeFonts } from "../../../runtime/themeSpec.js";
+import { useT } from "../../frame/hooks.js";
+import { formatNumber, t, tx } from "../../frame/i18n.js";
+import { Button, Select, Slider, Toggle } from "../controls.js";
+import { panelSite, panelThemes } from "../site.js";
+import { themeStore, useThemeState } from "../themes.js";
+import { FontBrowser } from "./FontBrowser.js";
+import '../builder.css';
+/** A font role's name and hint in the active language (`fonts.role.<role>.label/.hint`). */
+export const roleInfo = (role) => ({ label: tx(`wb.fonts.role.${role}.label`), hint: tx(`wb.fonts.role.${role}.hint`) });
+const WEIGHTS = [100, 200, 300, 400, 500, 600, 700, 800, 900];
+const spec = (role) => role === 'inherit' ? { family: [] } : role;
+const tidy = (next) => Object.keys(next).length === 1 && !next.family.length ? 'inherit' : next;
+/** The name a role shows: its own first family, or where it inherits from. */
+export function roleLabel(font, role) {
+    const own = font.roles[role];
+    if (own !== 'inherit' && own.family.length)
+        return { name: own.family[0], inherited: false, stack: fontStack(own.family) };
+    const siteFont = panelThemes().siteFont;
+    if (role === 'interface')
+        return { name: siteFont, inherited: true };
+    if (role === 'mono')
+        return { name: t('wb.fonts.monospace'), inherited: true, stack: fontStack(['Cascadia Mono', 'Consolas', 'ui-monospace', 'monospace']) };
+    const base = font.roles.interface;
+    if (base !== 'inherit' && base.family.length)
+        return { name: base.family[0], inherited: true, stack: fontStack(base.family) };
+    return { name: role === 'chrome' ? `Geist (${panelSite().brand.name})` : siteFont, inherited: true };
+}
+/** Loads the Google fonts a font spec names into the panel so its labels render in them. */
+export function useShellFonts(font) {
+    const { fonts } = useThemeState();
+    const { ensureShellFont, isInstalled } = themeStore();
+    useEffect(() => {
+        for (const role of FONT_ROLE_NAMES) {
+            const value = font.roles[role];
+            if (value !== 'inherit' && value.source === 'google' && value.family[0] && isInstalled(value.family[0]))
+                void ensureShellFont(value.family[0]);
+        }
+    }, [font, fonts]);
+}
+export function FontRoles({ font, onRole, compact }) {
+    const t = useT();
+    const [browsing, setBrowsing] = useState(null);
+    const [open, setOpen] = useState(null);
+    useShellFonts(font);
+    const pick = (role, choice) => {
+        const current = spec(font.roles[role]);
+        const next = { ...current, family: sanitizeFonts(choice.family) };
+        if (choice.source)
+            next.source = choice.source;
+        else
+            delete next.source;
+        onRole(role, tidy(next));
+        setBrowsing(null);
+    };
+    return _jsxs("div", { className: `wb-roles ${compact ? 'is-compact' : ''}`, children: [FONT_ROLE_NAMES.map(role => {
+                const label = roleLabel(font, role);
+                const value = font.roles[role];
+                const own = spec(value);
+                const tuned = role !== 'interface' && (own.weight !== undefined || own.size !== undefined || own.tracking !== undefined || !!own.tabular);
+                const set = (patch, commit = true) => {
+                    const next = { ...own, ...patch };
+                    for (const key of Object.keys(patch))
+                        if (patch[key] === undefined)
+                            delete next[key];
+                    onRole(role, tidy(next), commit);
+                };
+                const info = roleInfo(role);
+                return _jsxs("div", { className: `wb-role ${open === role ? 'is-open' : ''}`, role: "group", "aria-label": info.label, children: [_jsxs("div", { className: "wb-role-main", children: [_jsxs("div", { className: "wb-role-copy", children: [_jsx("strong", { children: info.label }), !compact && _jsx("small", { children: info.hint })] }), _jsxs("button", { type: "button", className: `wb-role-font ${label.inherited ? 'is-inherited' : ''}`, onClick: () => setBrowsing(role), "aria-label": label.inherited ? t('wb.fonts.roleInherited', { role: info.label, font: label.name }) : t('wb.fonts.roleOwn', { role: info.label, font: label.name }), children: [_jsx("span", { className: "wb-role-sample", style: { fontFamily: label.stack, fontWeight: own.weight, letterSpacing: own.tracking !== undefined ? `${own.tracking}em` : undefined, fontVariantNumeric: own.tabular ? 'tabular-nums' : undefined }, children: role === 'numbers' ? `${formatNumber(1284)} · ${formatNumber(3200, { notation: 'compact' })}` : role === 'mono' ? 'const x = 42;' : label.name }), _jsxs("span", { className: "wb-role-name", children: [label.inherited ? t('wb.fonts.inherits', { font: label.name }) : label.name, own.source === 'google' && _jsx("em", { children: "Google" })] })] }), _jsxs("div", { className: "wb-role-actions", children: [role !== 'interface' && _jsx("button", { type: "button", className: `wb-role-tune ${tuned ? 'is-tuned' : ''}`, "aria-expanded": open === role, "aria-label": t('wb.fonts.fineTune', { role: info.label }), title: t('wb.fonts.fineTuneTitle'), onClick: () => setOpen(open === role ? null : role), children: _jsx("svg", { width: "14", height: "14", viewBox: "0 0 16 16", "aria-hidden": "true", children: _jsx("path", { d: "M3 5h6m3 0h1M3 11h1m3 0h6M9 3.5v3M4 9.5v3", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) }), value !== 'inherit' && _jsx(Button, { size: "sm", tone: "ghost", onClick: () => onRole(role, 'inherit'), title: t('wb.fonts.inheritAgain'), children: t('wb.common.reset') })] })] }), open === role && role !== 'interface' && _jsxs("div", { className: "wb-role-tuning", children: [_jsxs("label", { children: [_jsx("span", { children: t('wb.fonts.weight') }), _jsx(Select, { label: t('wb.fonts.roleWeight', { role: info.label }), value: String(own.weight ?? 'auto'), width: 130, options: [{ value: 'auto', label: t('wb.fonts.asSite') }, ...WEIGHTS.map(w => ({ value: String(w), label: String(w), style: { fontWeight: w } }))], onChange: v => set({ weight: v === 'auto' ? undefined : Number(v) }) })] }), _jsxs("label", { children: [_jsx("span", { children: t('wb.fonts.size') }), _jsx(Slider, { label: t('wb.fonts.roleSize', { role: info.label }), min: ROLE_LIMITS.size[0] * 100, max: ROLE_LIMITS.size[1] * 100, step: 1, value: Math.round((own.size ?? 1) * 100), format: v => t('wb.appearance.percent', { value: v / 100 }), onChange: v => set({ size: v === 100 ? undefined : v / 100 }, false), onCommit: v => set({ size: v === 100 ? undefined : v / 100 }) })] }), _jsxs("label", { children: [_jsx("span", { children: t('wb.fonts.spacing') }), _jsx(Slider, { label: t('wb.fonts.roleSpacing', { role: info.label }), min: ROLE_LIMITS.tracking[0] * 1000, max: ROLE_LIMITS.tracking[1] * 1000, step: 2, value: Math.round((own.tracking ?? 0) * 1000), format: v => `${formatNumber(v / 1000, { minimumFractionDigits: 3, maximumFractionDigits: 3 })} em`, onChange: v => set({ tracking: v === 0 ? undefined : v / 1000 }, false), onCommit: v => set({ tracking: v === 0 ? undefined : v / 1000 }) })] }), _jsxs("label", { className: "is-inline", children: [_jsx("span", { children: t('wb.fonts.tabular') }), _jsx(Toggle, { label: t('wb.fonts.roleTabular', { role: info.label }), checked: !!own.tabular, onChange: tabular => set({ tabular: tabular || undefined }) })] })] })] }, role);
+            }), browsing && _jsx(FontBrowser, { role: roleInfo(browsing).label, current: spec(font.roles[browsing]).family[0] ?? null, onPick: choice => pick(browsing, choice), onClose: () => setBrowsing(null) })] });
+}
+//# sourceMappingURL=FontRoles.js.map

package/dist/shell/panel/fonts/FontRoles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FontRoles.js","sourceRoot":"","sources":["../../../../../../../shell/src/panel/fonts/FontRoles.tsx"],"names":[],"mappings":";AAAA,kGAAkG;AAClG,iGAAiG;AACjG,+FAA+F;AAC/F,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,SAAS,EAAE,aAAa,EAAsE,MAAM,sCAAsC,CAAC;AAClL,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,gBAAiB,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,EAAE,WAAW,EAAiB,MAAM,kBAAmB,CAAC;AAC/D,OAAO,gBAAgB,CAAC;AAExB,4FAA4F;AAC5F,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,IAAkB,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,iBAAiB,IAAI,QAAQ,CAAC,EAAE,IAAI,EAAE,EAAE,CAAC,iBAAiB,IAAI,OAAO,CAAC,EAAE,CAAC,CAAC;AAEvI,MAAM,OAAO,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;AAC9D,MAAM,IAAI,GAAG,CAAC,IAAc,EAAgB,EAAE,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;AAC1F,MAAM,IAAI,GAAG,CAAC,IAAkB,EAAY,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC;AAExH,8EAA8E;AAC9E,MAAM,UAAU,SAAS,CAAC,IAAc,EAAE,IAAkB;IAC1D,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IAC7B,IAAI,GAAG,KAAK,SAAS,IAAI,GAAG,CAAC,MAAM,CAAC,MAAM;QAAE,OAAO,EAAE,IAAI,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC,CAAE,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;IAC5H,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC,QAAQ,CAAC;IACxC,IAAI,IAAI,KAAK,WAAW;QAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACrE,IAAI,IAAI,KAAK,MAAM;QAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,oBAAoB,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,eAAe,EAAE,UAAU,EAAE,cAAc,EAAE,WAAW,CAAC,CAAC,EAAE,CAAC;IAC7J,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;IAClC,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM;QAAE,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAE,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;IAC/H,OAAO,EAAE,IAAI,EAAE,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,UAAU,SAAS,EAAE,CAAC,KAAK,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AACvG,CAAC;AAED,4FAA4F;AAC5F,MAAM,UAAU,aAAa,CAAC,IAAc;IAC1C,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,EAAE,CAAC;IAClC,MAAM,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,UAAU,EAAE,CAAC;IACtD,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,MAAM,IAAI,IAAI,eAAe,EAAE,CAAC;YACnC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;YAC/B,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,CAAC,MAAM,KAAK,QAAQ,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;gBAAE,KAAK,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;QACjJ,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;AACpB,CAAC;AAED,MAAM,UAAU,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAA6G;IAC5J,MAAM,CAAC,GAAG,IAAI,EAAE,CAAC;IACjB,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAsB,IAAI,CAAC,CAAC;IACpE,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAsB,IAAI,CAAC,CAAC;IAC5D,aAAa,CAAC,IAAI,CAAC,CAAC;IACpB,MAAM,IAAI,GAAG,CAAC,IAAkB,EAAE,MAAgB,EAAE,EAAE;QACpD,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;QACvC,MAAM,IAAI,GAAiB,EAAE,GAAG,OAAO,EAAE,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;QAChF,IAAI,MAAM,CAAC,MAAM;YAAE,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;;YAAM,OAAO,IAAI,CAAC,MAAM,CAAC;QACxE,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QACzB,WAAW,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC,CAAC;IACF,OAAO,eAAK,SAAS,EAAE,YAAY,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,aAC7D,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;gBAC1B,MAAM,KAAK,GAAG,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;gBACpC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;gBAC/B,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC;gBACxB,MAAM,KAAK,GAAG,IAAI,KAAK,WAAW,IAAI,CAAC,GAAG,CAAC,MAAM,KAAK,SAAS,IAAI,GAAG,CAAC,IAAI,KAAK,SAAS,IAAI,GAAG,CAAC,QAAQ,KAAK,SAAS,IAAI,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;gBAC1I,MAAM,GAAG,GAAG,CAAC,KAA4B,EAAE,MAAM,GAAG,IAAI,EAAE,EAAE;oBAC1D,MAAM,IAAI,GAAiB,EAAE,GAAG,GAAG,EAAE,GAAG,KAAK,EAAE,CAAC;oBAChD,KAAK,MAAM,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAA8B;wBAAE,IAAI,KAAK,CAAC,GAAG,CAAC,KAAK,SAAS;4BAAE,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC;oBAClH,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC,CAAC;gBACnC,CAAC,CAAC;gBACF,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;gBAC5B,OAAO,eAAgB,SAAS,EAAE,WAAW,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,gBAAa,IAAI,CAAC,KAAK,aAChH,eAAK,SAAS,EAAC,cAAc,aAC3B,eAAK,SAAS,EAAC,cAAc,aAC3B,2BAAS,IAAI,CAAC,KAAK,GAAU,EAC5B,CAAC,OAAO,IAAI,0BAAQ,IAAI,CAAC,IAAI,GAAS,IACnC,EACN,kBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,gBAAgB,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,gBAC5G,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,wBAAwB,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,kBAAkB,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC,aACjK,eAAM,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,KAAK,EAAE,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,aAAa,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,QAAQ,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,kBAAkB,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,EAAE,YACnO,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,IAAI,CAAC,MAAM,YAAY,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,GAC1I,EACP,gBAAM,SAAS,EAAC,cAAc,aAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,mBAAmB,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,EAAE,GAAG,CAAC,MAAM,KAAK,QAAQ,IAAI,kCAAe,IAAQ,IACxJ,EACT,eAAK,SAAS,EAAC,iBAAiB,aAC7B,IAAI,KAAK,WAAW,IAAI,iBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,gBAAgB,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,mBAAiB,IAAI,KAAK,IAAI,gBAAc,CAAC,CAAC,mBAAmB,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,wBAAwB,CAAC,EAC7N,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,YACnD,cAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,iBAAa,MAAM,YAAC,eAAM,CAAC,EAAC,2CAA2C,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,WAAW,EAAC,KAAK,EAAC,aAAa,EAAC,OAAO,GAAE,GAAM,GACjM,EACR,KAAK,KAAK,SAAS,IAAI,KAAC,MAAM,IAAC,IAAI,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,uBAAuB,CAAC,YAAG,CAAC,CAAC,iBAAiB,CAAC,GAAU,IAC7J,IACF,EACL,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,WAAW,IAAI,eAAK,SAAS,EAAC,gBAAgB,aACvE,4BAAO,yBAAO,CAAC,CAAC,iBAAiB,CAAC,GAAQ,EACxC,KAAC,MAAM,IAAC,KAAK,EAAE,CAAC,CAAC,qBAAqB,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC,MAAM,IAAI,MAAM,CAAC,EAAE,KAAK,EAAE,GAAG,EAC5G,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAAE,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAClJ,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,IAAQ,EACnF,4BAAO,yBAAO,CAAC,CAAC,eAAe,CAAC,GAAQ,EACtC,KAAC,MAAM,IAAC,KAAK,EAAE,CAAC,CAAC,mBAAmB,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,GAAG,EAAE,GAAG,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,GAAG,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,CAAC,GAAG,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,uBAAuB,EAAE,EAAE,KAAK,EAAE,CAAC,GAAG,GAAG,EAAE,CAAC,EACzO,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,EAAE,EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,EAAE,CAAC,GAAG,IAAQ,EAClJ,4BAAO,yBAAO,CAAC,CAAC,kBAAkB,CAAC,GAAQ,EACzC,KAAC,MAAM,IAAC,KAAK,EAAE,CAAC,CAAC,sBAAsB,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,QAAQ,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CAAC,CAAC,GAAG,IAAI,EAAE,EAAE,qBAAqB,EAAE,CAAC,EAAE,qBAAqB,EAAE,CAAC,EAAE,CAAC,KAAK,EACnS,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,EAAE,EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,EAAE,CAAC,GAAG,IAAQ,EACxJ,iBAAO,SAAS,EAAC,WAAW,aAAC,yBAAO,CAAC,CAAC,kBAAkB,CAAC,GAAQ,EAAA,KAAC,MAAM,IAAC,KAAK,EAAE,CAAC,CAAC,sBAAsB,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,CAAC,GAAG,IAAQ,IAC3N,KAjCS,IAAI,CAkCf,CAAC;YACT,CAAC,CAAC,EACD,QAAQ,IAAI,KAAC,WAAW,IAAC,IAAI,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,IAAI,EAC7G,MAAM,EAAE,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,IAC3E,CAAC;AACT,CAAC","sourcesContent":["// \"Which font goes where\": one row per font role. Every role inherits the interface font until it\n// is given its own (from Google Fonts, the bundled Geist fonts or an installed system font), and\n// every role but the interface can fine-tune weight, size, letter spacing and tabular figures.\nimport { useEffect, useState } from 'react';\nimport { FONT_ROLE_NAMES, ROLE_LIMITS, fontStack, sanitizeFonts, type FontRole, type FontRoleName, type FontRoleSpec, type FontSpec } from '../../../../runtime/src/themeSpec.ts';\nimport { useT } from '../../frame/hooks.ts';\nimport { formatNumber, t, tx } from '../../frame/i18n.ts';\nimport { Button, Select, Slider, Toggle } from '../controls.tsx';\nimport { panelSite, panelThemes } from '../site.ts';\nimport { themeStore, useThemeState } from '../themes.ts';\nimport { FontBrowser, type FontPick } from './FontBrowser.tsx';\nimport '../builder.css';\n\n/** A font role's name and hint in the active language (`fonts.role.<role>.label/.hint`). */\nexport const roleInfo = (role: FontRoleName) => ({ label: tx(`wb.fonts.role.${role}.label`), hint: tx(`wb.fonts.role.${role}.hint`) });\n\nconst WEIGHTS = [100, 200, 300, 400, 500, 600, 700, 800, 900];\nconst spec = (role: FontRole): FontRoleSpec => role === 'inherit' ? { family: [] } : role;\nconst tidy = (next: FontRoleSpec): FontRole => Object.keys(next).length === 1 && !next.family.length ? 'inherit' : next;\n\n/** The name a role shows: its own first family, or where it inherits from. */\nexport function roleLabel(font: FontSpec, role: FontRoleName): { name: string; inherited: boolean; stack?: string } {\n  const own = font.roles[role];\n  if (own !== 'inherit' && own.family.length) return { name: own.family[0]!, inherited: false, stack: fontStack(own.family) };\n  const siteFont = panelThemes().siteFont;\n  if (role === 'interface') return { name: siteFont, inherited: true };\n  if (role === 'mono') return { name: t('wb.fonts.monospace'), inherited: true, stack: fontStack(['Cascadia Mono', 'Consolas', 'ui-monospace', 'monospace']) };\n  const base = font.roles.interface;\n  if (base !== 'inherit' && base.family.length) return { name: base.family[0]!, inherited: true, stack: fontStack(base.family) };\n  return { name: role === 'chrome' ? `Geist (${panelSite().brand.name})` : siteFont, inherited: true };\n}\n\n/** Loads the Google fonts a font spec names into the panel so its labels render in them. */\nexport function useShellFonts(font: FontSpec) {\n  const { fonts } = useThemeState();\n  const { ensureShellFont, isInstalled } = themeStore();\n  useEffect(() => {\n    for (const role of FONT_ROLE_NAMES) {\n      const value = font.roles[role];\n      if (value !== 'inherit' && value.source === 'google' && value.family[0] && isInstalled(value.family[0])) void ensureShellFont(value.family[0]);\n    }\n  }, [font, fonts]);\n}\n\nexport function FontRoles({ font, onRole, compact }: { font: FontSpec; onRole(role: FontRoleName, next: FontRole, commit?: boolean): void; compact?: boolean }) {\n  const t = useT();\n  const [browsing, setBrowsing] = useState<FontRoleName | null>(null);\n  const [open, setOpen] = useState<FontRoleName | null>(null);\n  useShellFonts(font);\n  const pick = (role: FontRoleName, choice: FontPick) => {\n    const current = spec(font.roles[role]);\n    const next: FontRoleSpec = { ...current, family: sanitizeFonts(choice.family) };\n    if (choice.source) next.source = choice.source; else delete next.source;\n    onRole(role, tidy(next));\n    setBrowsing(null);\n  };\n  return <div className={`wb-roles ${compact ? 'is-compact' : ''}`}>\n    {FONT_ROLE_NAMES.map(role => {\n      const label = roleLabel(font, role);\n      const value = font.roles[role];\n      const own = spec(value);\n      const tuned = role !== 'interface' && (own.weight !== undefined || own.size !== undefined || own.tracking !== undefined || !!own.tabular);\n      const set = (patch: Partial<FontRoleSpec>, commit = true) => {\n        const next: FontRoleSpec = { ...own, ...patch };\n        for (const key of Object.keys(patch) as Array<keyof FontRoleSpec>) if (patch[key] === undefined) delete next[key];\n        onRole(role, tidy(next), commit);\n      };\n      const info = roleInfo(role);\n      return <div key={role} className={`wb-role ${open === role ? 'is-open' : ''}`} role=\"group\" aria-label={info.label}>\n        <div className=\"wb-role-main\">\n          <div className=\"wb-role-copy\">\n            <strong>{info.label}</strong>\n            {!compact && <small>{info.hint}</small>}\n          </div>\n          <button type=\"button\" className={`wb-role-font ${label.inherited ? 'is-inherited' : ''}`} onClick={() => setBrowsing(role)}\n            aria-label={label.inherited ? t('wb.fonts.roleInherited', { role: info.label, font: label.name }) : t('wb.fonts.roleOwn', { role: info.label, font: label.name })}>\n            <span className=\"wb-role-sample\" style={{ fontFamily: label.stack, fontWeight: own.weight, letterSpacing: own.tracking !== undefined ? `${own.tracking}em` : undefined, fontVariantNumeric: own.tabular ? 'tabular-nums' : undefined }}>\n              {role === 'numbers' ? `${formatNumber(1284)} · ${formatNumber(3200, { notation: 'compact' })}` : role === 'mono' ? 'const x = 42;' : label.name}\n            </span>\n            <span className=\"wb-role-name\">{label.inherited ? t('wb.fonts.inherits', { font: label.name }) : label.name}{own.source === 'google' && <em>Google</em>}</span>\n          </button>\n          <div className=\"wb-role-actions\">\n            {role !== 'interface' && <button type=\"button\" className={`wb-role-tune ${tuned ? 'is-tuned' : ''}`} aria-expanded={open === role} aria-label={t('wb.fonts.fineTune', { role: info.label })} title={t('wb.fonts.fineTuneTitle')}\n              onClick={() => setOpen(open === role ? null : role)}>\n              <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" aria-hidden=\"true\"><path d=\"M3 5h6m3 0h1M3 11h1m3 0h6M9 3.5v3M4 9.5v3\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\"/></svg>\n            </button>}\n            {value !== 'inherit' && <Button size=\"sm\" tone=\"ghost\" onClick={() => onRole(role, 'inherit')} title={t('wb.fonts.inheritAgain')}>{t('wb.common.reset')}</Button>}\n          </div>\n        </div>\n        {open === role && role !== 'interface' && <div className=\"wb-role-tuning\">\n          <label><span>{t('wb.fonts.weight')}</span>\n            <Select label={t('wb.fonts.roleWeight', { role: info.label })} value={String(own.weight ?? 'auto')} width={130}\n              options={[{ value: 'auto', label: t('wb.fonts.asSite') }, ...WEIGHTS.map(w => ({ value: String(w), label: String(w), style: { fontWeight: w } }))]}\n              onChange={v => set({ weight: v === 'auto' ? undefined : Number(v) })}/></label>\n          <label><span>{t('wb.fonts.size')}</span>\n            <Slider label={t('wb.fonts.roleSize', { role: info.label })} min={ROLE_LIMITS.size[0] * 100} max={ROLE_LIMITS.size[1] * 100} step={1} value={Math.round((own.size ?? 1) * 100)} format={v => t('wb.appearance.percent', { value: v / 100 })}\n              onChange={v => set({ size: v === 100 ? undefined : v / 100 }, false)} onCommit={v => set({ size: v === 100 ? undefined : v / 100 })}/></label>\n          <label><span>{t('wb.fonts.spacing')}</span>\n            <Slider label={t('wb.fonts.roleSpacing', { role: info.label })} min={ROLE_LIMITS.tracking[0] * 1000} max={ROLE_LIMITS.tracking[1] * 1000} step={2} value={Math.round((own.tracking ?? 0) * 1000)} format={v => `${formatNumber(v / 1000, { minimumFractionDigits: 3, maximumFractionDigits: 3 })} em`}\n              onChange={v => set({ tracking: v === 0 ? undefined : v / 1000 }, false)} onCommit={v => set({ tracking: v === 0 ? undefined : v / 1000 })}/></label>\n          <label className=\"is-inline\"><span>{t('wb.fonts.tabular')}</span><Toggle label={t('wb.fonts.roleTabular', { role: info.label })} checked={!!own.tabular} onChange={tabular => set({ tabular: tabular || undefined })}/></label>\n        </div>}\n      </div>;\n    })}\n    {browsing && <FontBrowser role={roleInfo(browsing).label} current={spec(font.roles[browsing]).family[0] ?? null}\n      onPick={choice => pick(browsing, choice)} onClose={() => setBrowsing(null)}/>}\n  </div>;\n}\n"]}

package/dist/shell/panel/fonts/catalog.d.ts

@@ -0,0 +1,37 @@
+export type Category = 'sans' | 'serif' | 'display' | 'handwriting' | 'mono';
+export type CatalogFont = {
+    family: string;
+    category: Category;
+    axis: [number, number] | null;
+    weights: number[];
+    rank: number;
+};
+export type Weights = {
+    kind: 'range';
+    min: number;
+    max: number;
+} | {
+    kind: 'list';
+    values: number[];
+};
+/** Filter chips; labels are `fonts.category.<id>` (short) and `fonts.categoryName.<id>` (full) in the catalogs. */
+export declare const CATEGORIES: Array<Category | 'all'>;
+export declare function parseCatalog(raw: unknown): CatalogFont[];
+/** The bundled catalog, loaded on first use (it is ~90 KB, so it stays out of the shell's first paint). */
+export declare function loadCatalog(): Promise<CatalogFont[]>;
+/** Search by name (prefix matches first, then popularity), within a category and optionally only installed ones. */
+export declare function searchFonts(fonts: CatalogFont[], options: {
+    query?: string;
+    category?: Category | 'all';
+    only?: Set<string>;
+}): CatalogFont[];
+/** What to download by default: the whole weight axis of a variable font, else regular and bold (or the nearest). */
+export declare function defaultWeights(font: CatalogFont): Weights;
+/** The weights a font can be previewed at (every 100 inside the axis, or the static weights). */
+export declare const availableWeights: (font: CatalogFont) => number[];
+/** A stack that falls back sensibly while the font loads, or where it lacks a glyph. */
+export declare function stackFor(font: Pick<CatalogFont, 'family' | 'category'>): string[];
+export declare const weightsLabel: (weights: Weights) => string;
+export declare const bytesLabel: (bytes: number) => string;
+/** Google Fonts' own page for a family (its license and designers), opened in the browser. */
+export declare const specimenUrl: (family: string) => string;

package/dist/shell/panel/fonts/catalog.js

@@ -0,0 +1,68 @@
+// The Google Fonts catalog the font browser shows: an offline snapshot (googleFontsCatalog.json,
+// regenerated by packages/shell/scripts/google-fonts-catalog.mjs) of family names, categories and
+// weights. The list itself is never fetched by the app; only the font files the owner picks are
+// (natively). Pure helpers, shared with the tests.
+import { textLocale } from "../../frame/i18n.js";
+/** Filter chips; labels are `fonts.category.<id>` (short) and `fonts.categoryName.<id>` (full) in the catalogs. */
+export const CATEGORIES = ['all', 'sans', 'serif', 'display', 'handwriting', 'mono'];
+const KNOWN = new Set(['sans', 'serif', 'display', 'handwriting', 'mono']);
+const NAME = /^[A-Za-z0-9]+( [A-Za-z0-9]+)*$/;
+export function parseCatalog(raw) {
+    const families = raw?.families;
+    if (!Array.isArray(families))
+        return [];
+    return families
+        .filter(([family, category, , weights]) => typeof family === 'string' && NAME.test(family) && family.length <= 48 && KNOWN.has(category) && Array.isArray(weights))
+        .map(([family, category, axis, weights, rank]) => ({
+        family, category: category,
+        axis: Array.isArray(axis) && axis.length === 2 ? [axis[0], axis[1]] : null,
+        weights: weights.filter(w => Number.isInteger(w) && w >= 100 && w <= 1000), rank: Number(rank) || 9999,
+    }));
+}
+let loaded = null;
+/** The bundled catalog, loaded on first use (it is ~90 KB, so it stays out of the shell's first paint). */
+export function loadCatalog() {
+    loaded ??= import('./googleFontsCatalog.json').then(module => parseCatalog(module.default));
+    return loaded;
+}
+/** Search by name (prefix matches first, then popularity), within a category and optionally only installed ones. */
+export function searchFonts(fonts, options) {
+    const query = (options.query ?? '').trim().toLowerCase();
+    const list = fonts.filter(font => (!options.category || options.category === 'all' || font.category === options.category)
+        && (!options.only || options.only.has(font.family))
+        && (!query || font.family.toLowerCase().includes(query)));
+    if (!query)
+        return list.sort((a, b) => a.rank - b.rank);
+    const score = (font) => {
+        const name = font.family.toLowerCase();
+        return name === query ? 0 : name.startsWith(query) ? 1 : name.split(' ').some(word => word.startsWith(query)) ? 2 : 3;
+    };
+    return list.sort((a, b) => score(a) - score(b) || a.rank - b.rank);
+}
+/** What to download by default: the whole weight axis of a variable font, else regular and bold (or the nearest). */
+export function defaultWeights(font) {
+    if (font.axis)
+        return { kind: 'range', min: font.axis[0], max: font.axis[1] };
+    const pick = (target) => font.weights.reduce((best, w) => Math.abs(w - target) < Math.abs(best - target) ? w : best, font.weights[0] ?? 400);
+    return { kind: 'list', values: [...new Set([pick(400), pick(700)])].sort((a, b) => a - b) };
+}
+/** The weights a font can be previewed at (every 100 inside the axis, or the static weights). */
+export const availableWeights = (font) => font.axis
+    ? Array.from({ length: 9 }, (_, i) => (i + 1) * 100).filter(w => w >= font.axis[0] && w <= font.axis[1])
+    : font.weights;
+/** A stack that falls back sensibly while the font loads, or where it lacks a glyph. */
+export function stackFor(font) {
+    const fallback = {
+        sans: ['system-ui', 'sans-serif'], serif: ['Georgia', 'serif'], display: ['system-ui', 'sans-serif'],
+        handwriting: ['cursive'], mono: ['ui-monospace', 'monospace'],
+    };
+    return [font.family, ...fallback[font.category]];
+}
+export const weightsLabel = (weights) => weights.kind === 'range' ? `${weights.min}–${weights.max}` : weights.values.join(', ');
+const numberLocale = () => textLocale().split('-x-')[0] || 'en';
+export const bytesLabel = (bytes) => bytes >= 1_000_000
+    ? `${new Intl.NumberFormat(numberLocale(), { minimumFractionDigits: 1, maximumFractionDigits: 1 }).format(bytes / 1_000_000)} MB`
+    : `${new Intl.NumberFormat(numberLocale()).format(Math.max(1, Math.round(bytes / 1000)))} KB`;
+/** Google Fonts' own page for a family (its license and designers), opened in the browser. */
+export const specimenUrl = (family) => `https://fonts.google.com/specimen/${family.replace(/ /g, '+')}`;
+//# sourceMappingURL=catalog.js.map

package/dist/shell/panel/fonts/catalog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog.js","sourceRoot":"","sources":["../../../../../../../shell/src/panel/fonts/catalog.ts"],"names":[],"mappings":"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","sourcesContent":["// The Google Fonts catalog the font browser shows: an offline snapshot (googleFontsCatalog.json,\n// regenerated by packages/shell/scripts/google-fonts-catalog.mjs) of family names, categories and\n// weights. The list itself is never fetched by the app; only the font files the owner picks are\n// (natively). Pure helpers, shared with the tests.\n\nimport { textLocale } from '../../frame/i18n.ts';\n\nexport type Category = 'sans' | 'serif' | 'display' | 'handwriting' | 'mono';\nexport type CatalogFont = { family: string; category: Category; axis: [number, number] | null; weights: number[]; rank: number };\nexport type Weights = { kind: 'range'; min: number; max: number } | { kind: 'list'; values: number[] };\n\n/** Filter chips; labels are `fonts.category.<id>` (short) and `fonts.categoryName.<id>` (full) in the catalogs. */\nexport const CATEGORIES: Array<Category | 'all'> = ['all', 'sans', 'serif', 'display', 'handwriting', 'mono'];\n\ntype Raw = { families: Array<[string, string, [number, number] | null, number[], number]> };\nconst KNOWN = new Set<Category>(['sans', 'serif', 'display', 'handwriting', 'mono']);\nconst NAME = /^[A-Za-z0-9]+( [A-Za-z0-9]+)*$/;\n\nexport function parseCatalog(raw: unknown): CatalogFont[] {\n  const families = (raw as Raw | null)?.families;\n  if (!Array.isArray(families)) return [];\n  return families\n    .filter(([family, category, , weights]) => typeof family === 'string' && NAME.test(family) && family.length <= 48 && KNOWN.has(category as Category) && Array.isArray(weights))\n    .map(([family, category, axis, weights, rank]) => ({\n      family, category: category as Category,\n      axis: Array.isArray(axis) && axis.length === 2 ? [axis[0], axis[1]] as [number, number] : null,\n      weights: weights.filter(w => Number.isInteger(w) && w >= 100 && w <= 1000), rank: Number(rank) || 9999,\n    }));\n}\n\nlet loaded: Promise<CatalogFont[]> | null = null;\n/** The bundled catalog, loaded on first use (it is ~90 KB, so it stays out of the shell's first paint). */\nexport function loadCatalog(): Promise<CatalogFont[]> {\n  loaded ??= import('./googleFontsCatalog.json').then(module => parseCatalog(module.default));\n  return loaded;\n}\n\n/** Search by name (prefix matches first, then popularity), within a category and optionally only installed ones. */\nexport function searchFonts(fonts: CatalogFont[], options: { query?: string; category?: Category | 'all'; only?: Set<string> }): CatalogFont[] {\n  const query = (options.query ?? '').trim().toLowerCase();\n  const list = fonts.filter(font =>\n    (!options.category || options.category === 'all' || font.category === options.category)\n    && (!options.only || options.only.has(font.family))\n    && (!query || font.family.toLowerCase().includes(query)));\n  if (!query) return list.sort((a, b) => a.rank - b.rank);\n  const score = (font: CatalogFont) => {\n    const name = font.family.toLowerCase();\n    return name === query ? 0 : name.startsWith(query) ? 1 : name.split(' ').some(word => word.startsWith(query)) ? 2 : 3;\n  };\n  return list.sort((a, b) => score(a) - score(b) || a.rank - b.rank);\n}\n\n/** What to download by default: the whole weight axis of a variable font, else regular and bold (or the nearest). */\nexport function defaultWeights(font: CatalogFont): Weights {\n  if (font.axis) return { kind: 'range', min: font.axis[0], max: font.axis[1] };\n  const pick = (target: number) => font.weights.reduce((best, w) => Math.abs(w - target) < Math.abs(best - target) ? w : best, font.weights[0] ?? 400);\n  return { kind: 'list', values: [...new Set([pick(400), pick(700)])].sort((a, b) => a - b) };\n}\n\n/** The weights a font can be previewed at (every 100 inside the axis, or the static weights). */\nexport const availableWeights = (font: CatalogFont) => font.axis\n  ? Array.from({ length: 9 }, (_, i) => (i + 1) * 100).filter(w => w >= font.axis![0] && w <= font.axis![1])\n  : font.weights;\n\n/** A stack that falls back sensibly while the font loads, or where it lacks a glyph. */\nexport function stackFor(font: Pick<CatalogFont, 'family' | 'category'>): string[] {\n  const fallback: Record<Category, string[]> = {\n    sans: ['system-ui', 'sans-serif'], serif: ['Georgia', 'serif'], display: ['system-ui', 'sans-serif'],\n    handwriting: ['cursive'], mono: ['ui-monospace', 'monospace'],\n  };\n  return [font.family, ...fallback[font.category]];\n}\n\nexport const weightsLabel = (weights: Weights) => weights.kind === 'range' ? `${weights.min}–${weights.max}` : weights.values.join(', ');\nconst numberLocale = () => textLocale().split('-x-')[0] || 'en';\nexport const bytesLabel = (bytes: number) => bytes >= 1_000_000\n  ? `${new Intl.NumberFormat(numberLocale(), { minimumFractionDigits: 1, maximumFractionDigits: 1 }).format(bytes / 1_000_000)} MB`\n  : `${new Intl.NumberFormat(numberLocale()).format(Math.max(1, Math.round(bytes / 1000)))} KB`;\n/** Google Fonts' own page for a family (its license and designers), opened in the browser. */\nexport const specimenUrl = (family: string) => `https://fonts.google.com/specimen/${family.replace(/ /g, '+')}`;\n"]}