waybetter 0.1.0 → 0.6.0

package/dist/shell/frame/hooks.js

@@ -0,0 +1,97 @@
+// React hooks over the frame's shared state (profiles, decks, the language, site text, developer
+// mode, sync, themes, the update status). Each re-renders its component when that state changes.
+import { useEffect, useReducer, useState, useSyncExternalStore } from 'react';
+import { parseUpdateStatus } from "../updateModel.js";
+import { isTauri } from "../windowControls.js";
+import { invoke, listen } from "./bridge.js";
+import { dev } from "./devHost.js";
+import { subscribeText, t, textLocale } from "./i18n.js";
+import { shell } from "./state.js";
+import { syncState } from "./syncHost.js";
+/** Re-renders the calling component when the language changes; returns `t`. */
+export function useT() {
+    useSyncExternalStore(subscribeText, textLocale, textLocale);
+    return t;
+}
+/** Re-renders on every window event in `events`. */
+function useEvents(...events) {
+    const [, tick] = useReducer((n) => n + 1, 0);
+    useEffect(() => {
+        for (const event of events)
+            window.addEventListener(event, tick);
+        return () => { for (const event of events)
+            window.removeEventListener(event, tick); };
+    }, []);
+}
+/** Current profile list; re-renders on every `setProfiles`. */
+export function useProfiles() {
+    const [profiles, set] = useState(shell.profiles);
+    useEffect(() => {
+        const update = () => set(shell.profiles);
+        window.addEventListener('bt-profiles', update);
+        update();
+        return () => window.removeEventListener('bt-profiles', update);
+    }, []);
+    return profiles;
+}
+/** Re-renders when the focused pane (or the layout) changes. */
+export function usePaneTick() {
+    const [tick, setTick] = useState(0);
+    useEffect(() => {
+        const bump = () => setTick(value => value + 1);
+        window.addEventListener('bt-active-pane', bump);
+        return () => window.removeEventListener('bt-active-pane', bump);
+    }, []);
+    return tick;
+}
+/** Re-renders when the site's runtime text changes (`siteChanged()`). */
+export const useSiteText = () => useEvents('bt-site');
+/** Re-renders on deck and profile changes. */
+export const useDecks = () => useEvents('bt-decks', 'bt-profiles');
+export function useDev() {
+    useEvents('bt-dev');
+    return dev;
+}
+export function useSync() {
+    useEvents('bt-sync');
+    return syncState;
+}
+/** The theme state of `store`; loads it once. */
+export function useThemeState(store) {
+    const [value, setValue] = useState(store.current());
+    useEffect(() => {
+        const update = () => setValue(store.current());
+        const off = store.subscribe(update);
+        void store.loadThemes();
+        update();
+        return off;
+    }, [store]);
+    return value;
+}
+/**
+ * Native update status for the titlebar chip. Native code checks, downloads and verifies; the
+ * shell only reads the status, confirms it started (`app_ready`) and asks to apply a ready update.
+ */
+export function useUpdateStatus() {
+    const [status, setStatus] = useState({ state: 'idle' });
+    useEffect(() => {
+        if (!isTauri)
+            return;
+        let unlisten;
+        let disposed = false;
+        listen('update-status', event => setStatus(parseUpdateStatus(event.payload)))
+            .then(fn => { if (disposed)
+            fn();
+        else
+            unlisten = fn; })
+            .catch(() => { });
+        // Handshake: the shell rendered, so a just-installed update is confirmed working.
+        invoke('app_ready').then(value => setStatus(parseUpdateStatus(value))).catch(() => { });
+        return () => { disposed = true; unlisten?.(); };
+    }, []);
+    const apply = () => {
+        invoke('apply_update').catch(() => invoke('update_status').then(value => setStatus(parseUpdateStatus(value))).catch(() => { }));
+    };
+    return [status, apply];
+}
+//# sourceMappingURL=hooks.js.map

package/dist/shell/frame/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../../../../../../shell/src/frame/hooks.ts"],"names":[],"mappings":"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","sourcesContent":["// React hooks over the frame's shared state (profiles, decks, the language, site text, developer\n// mode, sync, themes, the update status). Each re-renders its component when that state changes.\n\nimport { useEffect, useReducer, useState, useSyncExternalStore } from 'react';\nimport { parseUpdateStatus, type UpdateStatus } from '../updateModel.ts';\nimport { isTauri } from '../windowControls.ts';\nimport { invoke, listen } from './bridge.ts';\nimport { dev } from './devHost.ts';\nimport { subscribeText, t, textLocale } from './i18n.ts';\nimport { shell } from './state.ts';\nimport { syncState } from './syncHost.ts';\nimport type { ThemeDoc, ThemeStore } from './themeStore.ts';\nimport type { ProfileSettings } from '../profileModel.ts';\n\n/** Re-renders the calling component when the language changes; returns `t`. */\nexport function useT(): typeof t {\n  useSyncExternalStore(subscribeText, textLocale, textLocale);\n  return t;\n}\n\n/** Re-renders on every window event in `events`. */\nfunction useEvents(...events: string[]) {\n  const [, tick] = useReducer((n: number) => n + 1, 0);\n  useEffect(() => {\n    for (const event of events) window.addEventListener(event, tick);\n    return () => { for (const event of events) window.removeEventListener(event, tick); };\n  }, []);\n}\n\n/** Current profile list; re-renders on every `setProfiles`. */\nexport function useProfiles(): ProfileSettings {\n  const [profiles, set] = useState(shell.profiles);\n  useEffect(() => {\n    const update = () => set(shell.profiles);\n    window.addEventListener('bt-profiles', update);\n    update();\n    return () => window.removeEventListener('bt-profiles', update);\n  }, []);\n  return profiles;\n}\n\n/** Re-renders when the focused pane (or the layout) changes. */\nexport function usePaneTick(): number {\n  const [tick, setTick] = useState(0);\n  useEffect(() => {\n    const bump = () => setTick(value => value + 1);\n    window.addEventListener('bt-active-pane', bump);\n    return () => window.removeEventListener('bt-active-pane', bump);\n  }, []);\n  return tick;\n}\n\n/** Re-renders when the site's runtime text changes (`siteChanged()`). */\nexport const useSiteText = () => useEvents('bt-site');\n\n/** Re-renders on deck and profile changes. */\nexport const useDecks = () => useEvents('bt-decks', 'bt-profiles');\n\nexport function useDev() {\n  useEvents('bt-dev');\n  return dev;\n}\n\nexport function useSync() {\n  useEvents('bt-sync');\n  return syncState;\n}\n\n/** The theme state of `store`; loads it once. */\nexport function useThemeState<Choice, Spec extends ThemeDoc>(store: ThemeStore<Choice, Spec>) {\n  const [value, setValue] = useState(store.current());\n  useEffect(() => {\n    const update = () => setValue(store.current());\n    const off = store.subscribe(update);\n    void store.loadThemes();\n    update();\n    return off;\n  }, [store]);\n  return value;\n}\n\n/**\n * Native update status for the titlebar chip. Native code checks, downloads and verifies; the\n * shell only reads the status, confirms it started (`app_ready`) and asks to apply a ready update.\n */\nexport function useUpdateStatus(): [UpdateStatus, () => void] {\n  const [status, setStatus] = useState<UpdateStatus>({ state: 'idle' });\n  useEffect(() => {\n    if (!isTauri) return;\n    let unlisten: (() => void) | undefined;\n    let disposed = false;\n    listen('update-status', event => setStatus(parseUpdateStatus(event.payload)))\n      .then(fn => { if (disposed) fn(); else unlisten = fn; })\n      .catch(() => {});\n    // Handshake: the shell rendered, so a just-installed update is confirmed working.\n    invoke('app_ready').then(value => setStatus(parseUpdateStatus(value))).catch(() => {});\n    return () => { disposed = true; unlisten?.(); };\n  }, []);\n  const apply = () => {\n    invoke('apply_update').catch(() => invoke('update_status').then(value => setStatus(parseUpdateStatus(value))).catch(() => {}));\n  };\n  return [status, apply];\n}\n"]}

package/dist/shell/frame/i18n.d.ts

@@ -0,0 +1,27 @@
+export type Params = Record<string, string | number | boolean | Date | null | undefined>;
+/** The part of a waybetter/i18n instance the frame uses. */
+export type ShellI18n = {
+    readonly locale: string;
+    tx(key: string, params?: Params, fallback?: string): string;
+    onChange(listener: (locale: string) => void): () => void;
+    number(value: number, options?: Intl.NumberFormatOptions): string;
+    relative(value: number, unit: Intl.RelativeTimeFormatUnit): string;
+    date(value: string | number | Date, options?: Intl.DateTimeFormatOptions): string;
+};
+/** Binds the frame to the app's i18n instance (once, before the shell renders). */
+export declare function setShellI18n(i18n: ShellI18n): void;
+/** Sets the parameters every frame message gets (createShell: `{ site }`). */
+export declare function setTextDefaults(values: Params): void;
+/** The message for a framework key in the active language (the key itself when unbound or missing). */
+export declare function t(key: string, params?: Params): string;
+/** Like `t` for keys assembled at runtime: `fallback` when the key is unknown. */
+export declare function tx(key: string, params?: Params, fallback?: string): string;
+/** Language changes (for `useT`). */
+export declare function subscribeText(listener: () => void): () => void;
+export declare const textLocale: () => string;
+/** A number in the active language ("5 min", "5 dk" with a unit style). */
+export declare function formatNumber(value: number, options?: Intl.NumberFormatOptions): string;
+/** A date (and time) in the active language: `formatDate(iso, { dateStyle: 'medium' })`. */
+export declare function formatDate(value: string | number | Date, options?: Intl.DateTimeFormatOptions): string;
+/** "3 minutes ago" style text for a timestamp in the active language. */
+export declare function relativeTime(then: number, now?: number): string;

package/dist/shell/frame/i18n.js

@@ -0,0 +1,66 @@
+// The shell frame's words. They live in the framework catalogs (`waybetter/locales/<bcp47>.json`,
+// `wb.*`); the app hands the frame its i18n instance (`setShellI18n`, a `createI18n` from
+// waybetter/i18n that has the framework catalogs merged in), so the frame speaks the app's language
+// and re-renders when it changes (`useT`, hooks.ts). Without one (a unit test), a key reads as itself.
+// Pure (no React, no Tauri), so the models that use it are unit-tested under node.
+//
+// Placeholders: `{site}` is the site's name ("X").
+let current = null;
+/** Parameters every frame message gets (`{site}`: the site's name, set by createShell). */
+let defaults = {};
+const listeners = new Set();
+let unbind = null;
+/** Binds the frame to the app's i18n instance (once, before the shell renders). */
+export function setShellI18n(i18n) {
+    unbind?.();
+    current = i18n;
+    unbind = i18n.onChange(() => { for (const listener of [...listeners])
+        listener(); });
+    for (const listener of [...listeners])
+        listener();
+}
+/** Sets the parameters every frame message gets (createShell: `{ site }`). */
+export function setTextDefaults(values) {
+    defaults = { ...values };
+}
+/** The message for a framework key in the active language (the key itself when unbound or missing). */
+export function t(key, params) {
+    return current ? current.tx(key, { ...defaults, ...params }) : key;
+}
+/** Like `t` for keys assembled at runtime: `fallback` when the key is unknown. */
+export function tx(key, params, fallback) {
+    return current ? current.tx(key, { ...defaults, ...params }, fallback) : fallback ?? key;
+}
+/** Language changes (for `useT`). */
+export function subscribeText(listener) {
+    listeners.add(listener);
+    return () => { listeners.delete(listener); };
+}
+export const textLocale = () => current?.locale ?? '';
+/** A number in the active language ("5 min", "5 dk" with a unit style). */
+export function formatNumber(value, options) {
+    return current ? current.number(value, options) : String(value);
+}
+/** A date (and time) in the active language: `formatDate(iso, { dateStyle: 'medium' })`. */
+export function formatDate(value, options = { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' }) {
+    return current ? current.date(value, options) : new Date(value).toISOString();
+}
+/** "3 minutes ago" style text for a timestamp in the active language. */
+export function relativeTime(then, now = Date.now()) {
+    if (!current)
+        return new Date(then).toISOString();
+    const seconds = Math.round((then - now) / 1000);
+    const abs = Math.abs(seconds);
+    if (abs < 45)
+        return current.relative(0, 'second');
+    if (abs < 3600)
+        return current.relative(Math.round(seconds / 60), 'minute');
+    if (abs < 86400)
+        return current.relative(Math.round(seconds / 3600), 'hour');
+    if (abs < 86400 * 30)
+        return current.relative(Math.round(seconds / 86400), 'day');
+    if (abs < 86400 * 365)
+        return current.relative(Math.round(seconds / (86400 * 30)), 'month');
+    return current.relative(Math.round(seconds / (86400 * 365)), 'year');
+}
+//# sourceMappingURL=i18n.js.map

package/dist/shell/frame/i18n.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n.js","sourceRoot":"","sources":["../../../../../../shell/src/frame/i18n.ts"],"names":[],"mappings":"AAAA,kGAAkG;AAClG,0FAA0F;AAC1F,oGAAoG;AACpG,uGAAuG;AACvG,mFAAmF;AACnF,EAAE;AACF,mDAAmD;AAcnD,IAAI,OAAO,GAAqB,IAAI,CAAC;AACrC,2FAA2F;AAC3F,IAAI,QAAQ,GAAW,EAAE,CAAC;AAC1B,MAAM,SAAS,GAAG,IAAI,GAAG,EAAc,CAAC;AACxC,IAAI,MAAM,GAAwB,IAAI,CAAC;AAEvC,mFAAmF;AACnF,MAAM,UAAU,YAAY,CAAC,IAAe;IAC1C,MAAM,EAAE,EAAE,CAAC;IACX,OAAO,GAAG,IAAI,CAAC;IACf,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,EAAE,GAAG,KAAK,MAAM,QAAQ,IAAI,CAAC,GAAG,SAAS,CAAC;QAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;IACrF,KAAK,MAAM,QAAQ,IAAI,CAAC,GAAG,SAAS,CAAC;QAAE,QAAQ,EAAE,CAAC;AACpD,CAAC;AAED,8EAA8E;AAC9E,MAAM,UAAU,eAAe,CAAC,MAAc;IAC5C,QAAQ,GAAG,EAAE,GAAG,MAAM,EAAE,CAAC;AAC3B,CAAC;AAED,uGAAuG;AACvG,MAAM,UAAU,CAAC,CAAC,GAAW,EAAE,MAAe;IAC5C,OAAO,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,EAAE,GAAG,QAAQ,EAAE,GAAG,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;AACrE,CAAC;AAED,kFAAkF;AAClF,MAAM,UAAU,EAAE,CAAC,GAAW,EAAE,MAAe,EAAE,QAAiB;IAChE,OAAO,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,EAAE,GAAG,QAAQ,EAAE,GAAG,MAAM,EAAE,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,IAAI,GAAG,CAAC;AAC3F,CAAC;AAED,qCAAqC;AACrC,MAAM,UAAU,aAAa,CAAC,QAAoB;IAChD,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IACxB,OAAO,GAAG,EAAE,GAAG,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;AAC/C,CAAC;AACD,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,OAAO,EAAE,MAAM,IAAI,EAAE,CAAC;AAEtD,2EAA2E;AAC3E,MAAM,UAAU,YAAY,CAAC,KAAa,EAAE,OAAkC;IAC5E,OAAO,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;AAClE,CAAC;AAED,4FAA4F;AAC5F,MAAM,UAAU,UAAU,CAAC,KAA6B,EAAE,UAAsC,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE;IACpK,OAAO,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;AAChF,CAAC;AAED,yEAAyE;AACzE,MAAM,UAAU,YAAY,CAAC,IAAY,EAAE,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE;IACzD,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE,CAAC;IAClD,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,GAAG,GAAG,CAAC,GAAG,IAAI,CAAC,CAAC;IAChD,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IAC9B,IAAI,GAAG,GAAG,EAAE;QAAE,OAAO,OAAO,CAAC,QAAQ,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;IACnD,IAAI,GAAG,GAAG,IAAI;QAAE,OAAO,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC,EAAE,QAAQ,CAAC,CAAC;IAC5E,IAAI,GAAG,GAAG,KAAK;QAAE,OAAO,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,EAAE,MAAM,CAAC,CAAC;IAC7E,IAAI,GAAG,GAAG,KAAK,GAAG,EAAE;QAAE,OAAO,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;IAClF,IAAI,GAAG,GAAG,KAAK,GAAG,GAAG;QAAE,OAAO,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;IAC5F,OAAO,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;AACvE,CAAC","sourcesContent":["// The shell frame's words. They live in the framework catalogs (`waybetter/locales/<bcp47>.json`,\n// `wb.*`); the app hands the frame its i18n instance (`setShellI18n`, a `createI18n` from\n// waybetter/i18n that has the framework catalogs merged in), so the frame speaks the app's language\n// and re-renders when it changes (`useT`, hooks.ts). Without one (a unit test), a key reads as itself.\n// Pure (no React, no Tauri), so the models that use it are unit-tested under node.\n//\n// Placeholders: `{site}` is the site's name (\"X\").\n\nexport type Params = Record<string, string | number | boolean | Date | null | undefined>;\n\n/** The part of a waybetter/i18n instance the frame uses. */\nexport type ShellI18n = {\n  readonly locale: string;\n  tx(key: string, params?: Params, fallback?: string): string;\n  onChange(listener: (locale: string) => void): () => void;\n  number(value: number, options?: Intl.NumberFormatOptions): string;\n  relative(value: number, unit: Intl.RelativeTimeFormatUnit): string;\n  date(value: string | number | Date, options?: Intl.DateTimeFormatOptions): string;\n};\n\nlet current: ShellI18n | null = null;\n/** Parameters every frame message gets (`{site}`: the site's name, set by createShell). */\nlet defaults: Params = {};\nconst listeners = new Set<() => void>();\nlet unbind: (() => void) | null = null;\n\n/** Binds the frame to the app's i18n instance (once, before the shell renders). */\nexport function setShellI18n(i18n: ShellI18n) {\n  unbind?.();\n  current = i18n;\n  unbind = i18n.onChange(() => { for (const listener of [...listeners]) listener(); });\n  for (const listener of [...listeners]) listener();\n}\n\n/** Sets the parameters every frame message gets (createShell: `{ site }`). */\nexport function setTextDefaults(values: Params) {\n  defaults = { ...values };\n}\n\n/** The message for a framework key in the active language (the key itself when unbound or missing). */\nexport function t(key: string, params?: Params): string {\n  return current ? current.tx(key, { ...defaults, ...params }) : key;\n}\n\n/** Like `t` for keys assembled at runtime: `fallback` when the key is unknown. */\nexport function tx(key: string, params?: Params, fallback?: string): string {\n  return current ? current.tx(key, { ...defaults, ...params }, fallback) : fallback ?? key;\n}\n\n/** Language changes (for `useT`). */\nexport function subscribeText(listener: () => void): () => void {\n  listeners.add(listener);\n  return () => { listeners.delete(listener); };\n}\nexport const textLocale = () => current?.locale ?? '';\n\n/** A number in the active language (\"5 min\", \"5 dk\" with a unit style). */\nexport function formatNumber(value: number, options?: Intl.NumberFormatOptions): string {\n  return current ? current.number(value, options) : String(value);\n}\n\n/** A date (and time) in the active language: `formatDate(iso, { dateStyle: 'medium' })`. */\nexport function formatDate(value: string | number | Date, options: Intl.DateTimeFormatOptions = { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' }): string {\n  return current ? current.date(value, options) : new Date(value).toISOString();\n}\n\n/** \"3 minutes ago\" style text for a timestamp in the active language. */\nexport function relativeTime(then: number, now = Date.now()): string {\n  if (!current) return new Date(then).toISOString();\n  const seconds = Math.round((then - now) / 1000);\n  const abs = Math.abs(seconds);\n  if (abs < 45) return current.relative(0, 'second');\n  if (abs < 3600) return current.relative(Math.round(seconds / 60), 'minute');\n  if (abs < 86400) return current.relative(Math.round(seconds / 3600), 'hour');\n  if (abs < 86400 * 30) return current.relative(Math.round(seconds / 86400), 'day');\n  if (abs < 86400 * 365) return current.relative(Math.round(seconds / (86400 * 30)), 'month');\n  return current.relative(Math.round(seconds / (86400 * 365)), 'year');\n}\n"]}

package/dist/shell/frame/iconPack.d.ts

@@ -0,0 +1,11 @@
+import type { IconGlyph, IconName, IconPack } from '../../runtime/themeIcons.ts';
+/** Sets the chrome's pack (the theme store calls it with the global theme's). */
+export declare function setChromeIconPack(pack: IconPack | null): void;
+export declare const useChromeIconPack: () => IconPack | null;
+/** Which pack glyph stands for each of the frame's own glyph names. */
+export declare const CHROME_ICON_NAMES: Readonly<Record<string, IconName>>;
+/** One pack glyph as SVG children (no `<svg>` wrapper). */
+export declare function GlyphPaths({ glyph, pack }: {
+    glyph: IconGlyph;
+    pack: IconPack;
+}): import("react").JSX.Element;

package/dist/shell/frame/iconPack.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// The icon pack of the shell's own chrome: the global theme's pack (or the owner's pick), drawn in
+// place of the frame's line glyphs wherever the pack has a glyph for that meaning. The glyphs are
+// the pack's validated path data (framework themeIcons.ts), rendered as SVG elements by React, never
+// as markup.
+import { useSyncExternalStore } from 'react';
+let current = null;
+const listeners = new Set();
+/** Sets the chrome's pack (the theme store calls it with the global theme's). */
+export function setChromeIconPack(pack) {
+    if (pack === current)
+        return;
+    current = pack;
+    for (const listener of [...listeners])
+        listener();
+}
+const subscribe = (listener) => { listeners.add(listener); return () => { listeners.delete(listener); }; };
+export const useChromeIconPack = () => useSyncExternalStore(subscribe, () => current, () => null);
+/** Which pack glyph stands for each of the frame's own glyph names. */
+export const CHROME_ICON_NAMES = {
+    home: 'home', search: 'search', explore: 'explore', bell: 'notifications', mail: 'messages', bookmark: 'bookmarks', user: 'profile',
+    list: 'lists', close: 'close', back: 'back', image: 'media', draft: 'compose', edit: 'compose', settings: 'settings',
+};
+let gradients = 0;
+/** One pack glyph as SVG children (no `<svg>` wrapper). */
+export function GlyphPaths({ glyph, pack }) {
+    const style = pack.style;
+    if ('d' in glyph) {
+        return glyph.stroke
+            ? _jsx("path", { d: glyph.d, style: { fill: 'none', stroke: 'currentColor', strokeWidth: style.stroke, strokeLinecap: style.cap, strokeLinejoin: style.join } })
+            : _jsx("path", { d: glyph.d, fillRule: glyph.rule, style: { fill: 'currentColor', stroke: 'none' } });
+    }
+    if ('layers' in glyph) {
+        const base = `wbg${++gradients}`;
+        return _jsx(_Fragment, { children: glyph.layers.map((layer, index) => {
+                const id = `${base}-${index}`;
+                const fill = typeof layer.fill === 'string'
+                    ? (layer.fill.startsWith('#') ? layer.fill : 'currentColor')
+                    : `url(#${id})`;
+                return _jsxs("g", { children: [typeof layer.fill === 'object' && _jsx("defs", { children: _jsxs("linearGradient", { id: id, x1: "0", y1: "0", x2: "0", y2: "1", children: [_jsx("stop", { offset: "0", stopColor: layer.fill.from }), _jsx("stop", { offset: "1", stopColor: layer.fill.to })] }) }), _jsx("path", { d: layer.d, fillRule: layer.rule, opacity: layer.opacity, style: { fill, stroke: 'none' } })] }, index);
+            }) });
+    }
+    return _jsx("image", { href: glyph.png, width: "24", height: "24", style: glyph.pixel ? { imageRendering: 'pixelated' } : undefined });
+}
+//# sourceMappingURL=iconPack.js.map

package/dist/shell/frame/iconPack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"iconPack.js","sourceRoot":"","sources":["../../../../../../shell/src/frame/iconPack.tsx"],"names":[],"mappings":";AAAA,mGAAmG;AACnG,kGAAkG;AAClG,qGAAqG;AACrG,aAAa;AAEb,OAAO,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAG7C,IAAI,OAAO,GAAoB,IAAI,CAAC;AACpC,MAAM,SAAS,GAAG,IAAI,GAAG,EAAc,CAAC;AAExC,iFAAiF;AACjF,MAAM,UAAU,iBAAiB,CAAC,IAAqB;IACrD,IAAI,IAAI,KAAK,OAAO;QAAE,OAAO;IAC7B,OAAO,GAAG,IAAI,CAAC;IACf,KAAK,MAAM,QAAQ,IAAI,CAAC,GAAG,SAAS,CAAC;QAAE,QAAQ,EAAE,CAAC;AACpD,CAAC;AACD,MAAM,SAAS,GAAG,CAAC,QAAoB,EAAE,EAAE,GAAG,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,GAAG,EAAE,GAAG,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACvH,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,oBAAoB,CAAC,SAAS,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC;AAElG,uEAAuE;AACvE,MAAM,CAAC,MAAM,iBAAiB,GAAuC;IACnE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,eAAe,EAAE,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS;IACnI,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU;CACrH,CAAC;AAEF,IAAI,SAAS,GAAG,CAAC,CAAC;AAClB,2DAA2D;AAC3D,MAAM,UAAU,UAAU,CAAC,EAAE,KAAK,EAAE,IAAI,EAAwC;IAC9E,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;IACzB,IAAI,GAAG,IAAI,KAAK,EAAE,CAAC;QACjB,OAAO,KAAK,CAAC,MAAM;YACjB,CAAC,CAAC,eAAM,CAAC,EAAE,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,KAAK,CAAC,MAAM,EAAE,aAAa,EAAE,KAAK,CAAC,GAAG,EAAE,cAAc,EAAE,KAAK,CAAC,IAAI,EAAE,GAAG;YACvJ,CAAC,CAAC,eAAM,CAAC,EAAE,KAAK,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC;IACjG,CAAC;IACD,IAAI,QAAQ,IAAI,KAAK,EAAE,CAAC;QACtB,MAAM,IAAI,GAAG,MAAM,EAAE,SAAS,EAAE,CAAC;QACjC,OAAO,4BAAG,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;gBAC1C,MAAM,EAAE,GAAG,GAAG,IAAI,IAAI,KAAK,EAAE,CAAC;gBAC9B,MAAM,IAAI,GAAG,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ;oBACzC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,cAAc,CAAC;oBAC5D,CAAC,CAAC,QAAQ,EAAE,GAAG,CAAC;gBAClB,OAAO,wBACJ,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ,IAAI,yBAAM,0BAAgB,EAAE,EAAE,EAAE,EAAE,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,aAAC,eAAM,MAAM,EAAC,GAAG,EAAC,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,EAAA,eAAM,MAAM,EAAC,GAAG,EAAC,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,GAAG,IAAiB,GAAO,EAC/M,eAAM,CAAC,EAAE,KAAK,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,KAFrF,KAAK,CAGhB,CAAC;YACP,CAAC,CAAC,GAAI,CAAC;IACT,CAAC;IACD,OAAO,gBAAO,IAAI,EAAE,KAAK,CAAC,GAAG,EAAE,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC,SAAS,GAAG,CAAC;AAC5H,CAAC","sourcesContent":["// The icon pack of the shell's own chrome: the global theme's pack (or the owner's pick), drawn in\n// place of the frame's line glyphs wherever the pack has a glyph for that meaning. The glyphs are\n// the pack's validated path data (framework themeIcons.ts), rendered as SVG elements by React, never\n// as markup.\n\nimport { useSyncExternalStore } from 'react';\nimport type { IconGlyph, IconName, IconPack } from '../../../runtime/src/themeIcons.ts';\n\nlet current: IconPack | null = null;\nconst listeners = new Set<() => void>();\n\n/** Sets the chrome's pack (the theme store calls it with the global theme's). */\nexport function setChromeIconPack(pack: IconPack | null) {\n  if (pack === current) return;\n  current = pack;\n  for (const listener of [...listeners]) listener();\n}\nconst subscribe = (listener: () => void) => { listeners.add(listener); return () => { listeners.delete(listener); }; };\nexport const useChromeIconPack = () => useSyncExternalStore(subscribe, () => current, () => null);\n\n/** Which pack glyph stands for each of the frame's own glyph names. */\nexport const CHROME_ICON_NAMES: Readonly<Record<string, IconName>> = {\n  home: 'home', search: 'search', explore: 'explore', bell: 'notifications', mail: 'messages', bookmark: 'bookmarks', user: 'profile',\n  list: 'lists', close: 'close', back: 'back', image: 'media', draft: 'compose', edit: 'compose', settings: 'settings',\n};\n\nlet gradients = 0;\n/** One pack glyph as SVG children (no `<svg>` wrapper). */\nexport function GlyphPaths({ glyph, pack }: { glyph: IconGlyph; pack: IconPack }) {\n  const style = pack.style;\n  if ('d' in glyph) {\n    return glyph.stroke\n      ? <path d={glyph.d} style={{ fill: 'none', stroke: 'currentColor', strokeWidth: style.stroke, strokeLinecap: style.cap, strokeLinejoin: style.join }}/>\n      : <path d={glyph.d} fillRule={glyph.rule} style={{ fill: 'currentColor', stroke: 'none' }}/>;\n  }\n  if ('layers' in glyph) {\n    const base = `wbg${++gradients}`;\n    return <>{glyph.layers.map((layer, index) => {\n      const id = `${base}-${index}`;\n      const fill = typeof layer.fill === 'string'\n        ? (layer.fill.startsWith('#') ? layer.fill : 'currentColor')\n        : `url(#${id})`;\n      return <g key={index}>\n        {typeof layer.fill === 'object' && <defs><linearGradient id={id} x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\"><stop offset=\"0\" stopColor={layer.fill.from}/><stop offset=\"1\" stopColor={layer.fill.to}/></linearGradient></defs>}\n        <path d={layer.d} fillRule={layer.rule} opacity={layer.opacity} style={{ fill, stroke: 'none' }}/>\n      </g>;\n    })}</>;\n  }\n  return <image href={glyph.png} width=\"24\" height=\"24\" style={glyph.pixel ? { imageRendering: 'pixelated' } : undefined}/>;\n}\n"]}

package/dist/shell/frame/icons.d.ts

@@ -0,0 +1,71 @@
+export declare const ICONS: {
+    readonly back: "M15 5l-7 7 7 7";
+    readonly forward: "M9 5l7 7-7 7";
+    readonly reload: "M20 12a8 8 0 1 1-2.34-5.66M20 4v5h-5";
+    readonly stop: "M6 6l12 12M18 6L6 18";
+    readonly close: "M7 7l10 10M17 7L7 17";
+    readonly plus: "M12 5v14M5 12h14";
+    readonly external: "M14 4h6v6M20 4l-9 9M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5";
+    readonly split: "M4 5h16v14H4zM12 5v14";
+    readonly splitDown: "M4 5h16v14H4zM4 12h16";
+    readonly chevron: "M7 10l5 5 5-5";
+    readonly check: "M5 12.5l4.5 4.5L19 7.5";
+    readonly pin: "M9 4h6l-1 6 3 3H7l3-3zM12 13v7";
+    readonly unpin: "M9 4h6l-1 6 3 3H7l3-3zM12 13v7M4 4l16 16";
+    readonly copy: "M9 9h10v11H9zM5 15V4h10";
+    readonly duplicate: "M8 8h11v11H8zM5 16V5h11";
+    readonly closeOthers: "M4 6h16M4 12h10M4 18h7M15 15l5 5M20 15l-5 5";
+    readonly search: "M11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14zM20 20l-4-4";
+    readonly home: "M4 11l8-7 8 7M6 9.5V20h4.5v-5.5h3V20H18V9.5";
+    readonly bell: "M6 16V11a6 6 0 1 1 12 0v5l1.5 2h-15zM10 20.5h4";
+    readonly bookmark: "M7 4h10v16l-5-4-5 4z";
+    readonly mail: "M4 6h16v12H4zM4 7l8 6 8-6";
+    readonly list: "M9 6h11M9 12h11M9 18h11M4.5 6h.01M4.5 12h.01M4.5 18h.01";
+    readonly explore: "M12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18zM15.5 8.5l-2 5-5 2 2-5z";
+    readonly globe: "M12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18zM3 12h18M12 3c3 3.5 3 14.5 0 18M12 3c-3 3.5-3 14.5 0 18";
+    readonly settings: "M12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6zM19.4 13.5l1.6 1.2-2 3.4-1.9-.7a7 7 0 0 1-2 1.2L14.8 21h-4l-.3-2.4a7 7 0 0 1-2-1.2l-1.9.7-2-3.4 1.6-1.2a7 7 0 0 1 0-2.4L4.6 9.9l2-3.4 1.9.7a7 7 0 0 1 2-1.2L10.8 3.6h4l.3 2.4a7 7 0 0 1 2 1.2l1.9-.7 2 3.4-1.6 1.2a7 7 0 0 1 0 2.4z";
+    readonly palette: "M12 21a9 9 0 1 1 9-9c0 2-1.5 3-3.5 3H16a2 2 0 0 0-1.5 3.3A1.6 1.6 0 0 1 12 21zM7.5 11h.01M10 7.5h.01M14.5 7.5h.01";
+    readonly image: "M4 5h16v14H4zM4 16l5-5 4 4 2-2 5 5M15 9.5h.01";
+    readonly draft: "M5 20h4L20 9l-4-4L5 16zM14 7l4 4";
+    readonly user: "M12 12a4 4 0 1 1 0-8 4 4 0 0 1 0 8zM4.5 20a7.5 7.5 0 0 1 15 0";
+    readonly sparkle: "M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8zM19 16l.7 1.8 1.8.7-1.8.7L19 21l-.7-1.8-1.8-.7 1.8-.7z";
+    readonly bolt: "M13 3L5 14h6l-1 7 8-11h-6z";
+    readonly filter: "M4 5h16l-6 7v6l-4 2v-8z";
+    readonly history: "M4 12a8 8 0 1 0 2.3-5.6M4 4v4.5h4.5M12 8v4l3 2";
+    readonly trash: "M5 7h14M10 7V4h4v3M7 7l1 13h8l1-13";
+    readonly edit: "M4 20h4L19 9l-4-4L4 16zM14 6l4 4";
+    readonly grid: "M4 4h7v7H4zM13 4h7v7h-7zM4 13h7v7H4zM13 13h7v7h-7z";
+    readonly chevronRight: "M10 7l5 5-5 5";
+    readonly minus: "M5 12h14";
+    readonly columns: "M4 5h16v14H4zM9.5 5v14M14.5 5v14";
+    readonly layers: "M12 4l8 4-8 4-8-4zM4 12l8 4 8-4M4 16l8 4 8-4";
+    readonly zoom: "M11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14zM20 20l-4-4M8.5 11h5M11 8.5v5";
+    readonly plug: "M9 3v5M15 3v5M6.5 8h11v3.5a5.5 5.5 0 0 1-11 0zM12 17v4";
+    readonly bag: "M5 8h14l-1 12H6zM9 8V7a3 3 0 0 1 6 0v1";
+    readonly layout: "M4 5h16v14H4zM10 5v14M10 12h10";
+    readonly keyboard: "M3 7h18v10H3zM7 10.5h.01M11 10.5h.01M15 10.5h.01M7.5 13.5h9";
+    readonly command: "M5 8l4 4-4 4M12 16h7";
+    readonly code: "M9 8l-4 4 4 4M15 8l4 4-4 4";
+    readonly folder: "M4 7h6l2 2h8v10H4z";
+    readonly info: "M12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18zM12 11v5M12 8h.01";
+    readonly shield: "M12 3l7 3v5.5c0 4.2-2.9 7.9-7 9.5-4.1-1.6-7-5.3-7-9.5V6z";
+    readonly flag: "M6 21V4M6 5h11l-2 4 2 4H6";
+};
+export type IconName = keyof typeof ICONS;
+/** One of the frame's glyphs, or the chrome icon pack's glyph for the same meaning (iconPack.tsx). */
+export declare const Icon: ({ name, className }: {
+    name: IconName;
+    className?: string;
+}) => import("react").JSX.Element;
+/** Readable initial on a profile color: dark ink on light colors, white on dark ones. */
+export declare function inkOn(hex: string): string;
+export declare const initial: (name: string) => string;
+/** Round account avatar: the profile's initial on its color. */
+/** An account's X profile picture when known (`src`), else its initial on the profile color. */
+export declare const Avatar: ({ name, color, size, className, src }: {
+    name: string;
+    color: string;
+    size?: number;
+    className?: string;
+    src?: string;
+}) => import("react").JSX.Element;

package/dist/shell/frame/icons.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// Shared 24px stroke glyphs for the shell chrome (1.75 stroke, round joins; sized by CSS).
+import { CHROME_ICON_NAMES, GlyphPaths, useChromeIconPack } from "./iconPack.js";
+export const ICONS = {
+    back: 'M15 5l-7 7 7 7',
+    forward: 'M9 5l7 7-7 7',
+    reload: 'M20 12a8 8 0 1 1-2.34-5.66M20 4v5h-5',
+    stop: 'M6 6l12 12M18 6L6 18',
+    close: 'M7 7l10 10M17 7L7 17',
+    plus: 'M12 5v14M5 12h14',
+    external: 'M14 4h6v6M20 4l-9 9M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5',
+    split: 'M4 5h16v14H4zM12 5v14',
+    splitDown: 'M4 5h16v14H4zM4 12h16',
+    chevron: 'M7 10l5 5 5-5',
+    check: 'M5 12.5l4.5 4.5L19 7.5',
+    pin: 'M9 4h6l-1 6 3 3H7l3-3zM12 13v7',
+    unpin: 'M9 4h6l-1 6 3 3H7l3-3zM12 13v7M4 4l16 16',
+    copy: 'M9 9h10v11H9zM5 15V4h10',
+    duplicate: 'M8 8h11v11H8zM5 16V5h11',
+    closeOthers: 'M4 6h16M4 12h10M4 18h7M15 15l5 5M20 15l-5 5',
+    search: 'M11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14zM20 20l-4-4',
+    home: 'M4 11l8-7 8 7M6 9.5V20h4.5v-5.5h3V20H18V9.5',
+    bell: 'M6 16V11a6 6 0 1 1 12 0v5l1.5 2h-15zM10 20.5h4',
+    bookmark: 'M7 4h10v16l-5-4-5 4z',
+    mail: 'M4 6h16v12H4zM4 7l8 6 8-6',
+    list: 'M9 6h11M9 12h11M9 18h11M4.5 6h.01M4.5 12h.01M4.5 18h.01',
+    explore: 'M12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18zM15.5 8.5l-2 5-5 2 2-5z',
+    globe: 'M12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18zM3 12h18M12 3c3 3.5 3 14.5 0 18M12 3c-3 3.5-3 14.5 0 18',
+    settings: 'M12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6zM19.4 13.5l1.6 1.2-2 3.4-1.9-.7a7 7 0 0 1-2 1.2L14.8 21h-4l-.3-2.4a7 7 0 0 1-2-1.2l-1.9.7-2-3.4 1.6-1.2a7 7 0 0 1 0-2.4L4.6 9.9l2-3.4 1.9.7a7 7 0 0 1 2-1.2L10.8 3.6h4l.3 2.4a7 7 0 0 1 2 1.2l1.9-.7 2 3.4-1.6 1.2a7 7 0 0 1 0 2.4z',
+    palette: 'M12 21a9 9 0 1 1 9-9c0 2-1.5 3-3.5 3H16a2 2 0 0 0-1.5 3.3A1.6 1.6 0 0 1 12 21zM7.5 11h.01M10 7.5h.01M14.5 7.5h.01',
+    image: 'M4 5h16v14H4zM4 16l5-5 4 4 2-2 5 5M15 9.5h.01',
+    draft: 'M5 20h4L20 9l-4-4L5 16zM14 7l4 4',
+    user: 'M12 12a4 4 0 1 1 0-8 4 4 0 0 1 0 8zM4.5 20a7.5 7.5 0 0 1 15 0',
+    sparkle: 'M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8zM19 16l.7 1.8 1.8.7-1.8.7L19 21l-.7-1.8-1.8-.7 1.8-.7z',
+    bolt: 'M13 3L5 14h6l-1 7 8-11h-6z',
+    filter: 'M4 5h16l-6 7v6l-4 2v-8z',
+    history: 'M4 12a8 8 0 1 0 2.3-5.6M4 4v4.5h4.5M12 8v4l3 2',
+    trash: 'M5 7h14M10 7V4h4v3M7 7l1 13h8l1-13',
+    edit: 'M4 20h4L19 9l-4-4L4 16zM14 6l4 4',
+    grid: 'M4 4h7v7H4zM13 4h7v7h-7zM4 13h7v7H4zM13 13h7v7h-7z',
+    // The app menu's rows (AppMenu.tsx).
+    chevronRight: 'M10 7l5 5-5 5',
+    minus: 'M5 12h14',
+    columns: 'M4 5h16v14H4zM9.5 5v14M14.5 5v14',
+    layers: 'M12 4l8 4-8 4-8-4zM4 12l8 4 8-4M4 16l8 4 8-4',
+    zoom: 'M11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14zM20 20l-4-4M8.5 11h5M11 8.5v5',
+    plug: 'M9 3v5M15 3v5M6.5 8h11v3.5a5.5 5.5 0 0 1-11 0zM12 17v4',
+    bag: 'M5 8h14l-1 12H6zM9 8V7a3 3 0 0 1 6 0v1',
+    layout: 'M4 5h16v14H4zM10 5v14M10 12h10',
+    keyboard: 'M3 7h18v10H3zM7 10.5h.01M11 10.5h.01M15 10.5h.01M7.5 13.5h9',
+    command: 'M5 8l4 4-4 4M12 16h7',
+    code: 'M9 8l-4 4 4 4M15 8l4 4-4 4',
+    folder: 'M4 7h6l2 2h8v10H4z',
+    info: 'M12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18zM12 11v5M12 8h.01',
+    shield: 'M12 3l7 3v5.5c0 4.2-2.9 7.9-7 9.5-4.1-1.6-7-5.3-7-9.5V6z',
+    flag: 'M6 21V4M6 5h11l-2 4 2 4H6',
+};
+/** One of the frame's glyphs, or the chrome icon pack's glyph for the same meaning (iconPack.tsx). */
+export const Icon = ({ name, className }) => {
+    const pack = useChromeIconPack();
+    const mapped = CHROME_ICON_NAMES[name];
+    const glyph = pack && mapped ? pack.glyphs[mapped] : undefined;
+    return _jsx("svg", { className: className ? `bt-glyph ${className}` : 'bt-glyph', viewBox: "0 0 24 24", "aria-hidden": "true", children: glyph && pack ? _jsx(GlyphPaths, { glyph: glyph, pack: pack }) : _jsx("path", { d: ICONS[name] }) });
+};
+/** Readable initial on a profile color: dark ink on light colors, white on dark ones. */
+export function inkOn(hex) {
+    const value = Number.parseInt(hex.slice(1), 16);
+    const [r, g, b] = [(value >> 16) & 255, (value >> 8) & 255, value & 255];
+    return (0.299 * r + 0.587 * g + 0.114 * b) > 150 ? '#0b0d12' : '#ffffff';
+}
+export const initial = (name) => ([...name.trim()][0] ?? '?').toUpperCase();
+/** Round account avatar: the profile's initial on its color. */
+/** An account's X profile picture when known (`src`), else its initial on the profile color. */
+export const Avatar = ({ name, color, size = 20, className = '', src }) => _jsx("span", { className: `bt-avatar ${src ? 'bt-avatar--image' : ''} ${className}`, "aria-hidden": "true", style: { width: size, height: size, flexBasis: size, background: color, color: inkOn(color), fontSize: Math.round(size * 0.46) }, children: src ? _jsx("img", { src: src, alt: "", width: size, height: size, draggable: false, referrerPolicy: "no-referrer" }) : initial(name) });
+//# sourceMappingURL=icons.js.map

package/dist/shell/frame/icons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.js","sourceRoot":"","sources":["../../../../../../shell/src/frame/icons.tsx"],"names":[],"mappings":"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","sourcesContent":["// Shared 24px stroke glyphs for the shell chrome (1.75 stroke, round joins; sized by CSS).\n\nimport { CHROME_ICON_NAMES, GlyphPaths, useChromeIconPack } from './iconPack.tsx';\n\nexport const ICONS = {\n  back: 'M15 5l-7 7 7 7',\n  forward: 'M9 5l7 7-7 7',\n  reload: 'M20 12a8 8 0 1 1-2.34-5.66M20 4v5h-5',\n  stop: 'M6 6l12 12M18 6L6 18',\n  close: 'M7 7l10 10M17 7L7 17',\n  plus: 'M12 5v14M5 12h14',\n  external: 'M14 4h6v6M20 4l-9 9M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5',\n  split: 'M4 5h16v14H4zM12 5v14',\n  splitDown: 'M4 5h16v14H4zM4 12h16',\n  chevron: 'M7 10l5 5 5-5',\n  check: 'M5 12.5l4.5 4.5L19 7.5',\n  pin: 'M9 4h6l-1 6 3 3H7l3-3zM12 13v7',\n  unpin: 'M9 4h6l-1 6 3 3H7l3-3zM12 13v7M4 4l16 16',\n  copy: 'M9 9h10v11H9zM5 15V4h10',\n  duplicate: 'M8 8h11v11H8zM5 16V5h11',\n  closeOthers: 'M4 6h16M4 12h10M4 18h7M15 15l5 5M20 15l-5 5',\n  search: 'M11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14zM20 20l-4-4',\n  home: 'M4 11l8-7 8 7M6 9.5V20h4.5v-5.5h3V20H18V9.5',\n  bell: 'M6 16V11a6 6 0 1 1 12 0v5l1.5 2h-15zM10 20.5h4',\n  bookmark: 'M7 4h10v16l-5-4-5 4z',\n  mail: 'M4 6h16v12H4zM4 7l8 6 8-6',\n  list: 'M9 6h11M9 12h11M9 18h11M4.5 6h.01M4.5 12h.01M4.5 18h.01',\n  explore: 'M12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18zM15.5 8.5l-2 5-5 2 2-5z',\n  globe: 'M12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18zM3 12h18M12 3c3 3.5 3 14.5 0 18M12 3c-3 3.5-3 14.5 0 18',\n  settings: 'M12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6zM19.4 13.5l1.6 1.2-2 3.4-1.9-.7a7 7 0 0 1-2 1.2L14.8 21h-4l-.3-2.4a7 7 0 0 1-2-1.2l-1.9.7-2-3.4 1.6-1.2a7 7 0 0 1 0-2.4L4.6 9.9l2-3.4 1.9.7a7 7 0 0 1 2-1.2L10.8 3.6h4l.3 2.4a7 7 0 0 1 2 1.2l1.9-.7 2 3.4-1.6 1.2a7 7 0 0 1 0 2.4z',\n  palette: 'M12 21a9 9 0 1 1 9-9c0 2-1.5 3-3.5 3H16a2 2 0 0 0-1.5 3.3A1.6 1.6 0 0 1 12 21zM7.5 11h.01M10 7.5h.01M14.5 7.5h.01',\n  image: 'M4 5h16v14H4zM4 16l5-5 4 4 2-2 5 5M15 9.5h.01',\n  draft: 'M5 20h4L20 9l-4-4L5 16zM14 7l4 4',\n  user: 'M12 12a4 4 0 1 1 0-8 4 4 0 0 1 0 8zM4.5 20a7.5 7.5 0 0 1 15 0',\n  sparkle: 'M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8zM19 16l.7 1.8 1.8.7-1.8.7L19 21l-.7-1.8-1.8-.7 1.8-.7z',\n  bolt: 'M13 3L5 14h6l-1 7 8-11h-6z',\n  filter: 'M4 5h16l-6 7v6l-4 2v-8z',\n  history: 'M4 12a8 8 0 1 0 2.3-5.6M4 4v4.5h4.5M12 8v4l3 2',\n  trash: 'M5 7h14M10 7V4h4v3M7 7l1 13h8l1-13',\n  edit: 'M4 20h4L19 9l-4-4L4 16zM14 6l4 4',\n  grid: 'M4 4h7v7H4zM13 4h7v7h-7zM4 13h7v7H4zM13 13h7v7h-7z',\n  // The app menu's rows (AppMenu.tsx).\n  chevronRight: 'M10 7l5 5-5 5',\n  minus: 'M5 12h14',\n  columns: 'M4 5h16v14H4zM9.5 5v14M14.5 5v14',\n  layers: 'M12 4l8 4-8 4-8-4zM4 12l8 4 8-4M4 16l8 4 8-4',\n  zoom: 'M11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14zM20 20l-4-4M8.5 11h5M11 8.5v5',\n  plug: 'M9 3v5M15 3v5M6.5 8h11v3.5a5.5 5.5 0 0 1-11 0zM12 17v4',\n  bag: 'M5 8h14l-1 12H6zM9 8V7a3 3 0 0 1 6 0v1',\n  layout: 'M4 5h16v14H4zM10 5v14M10 12h10',\n  keyboard: 'M3 7h18v10H3zM7 10.5h.01M11 10.5h.01M15 10.5h.01M7.5 13.5h9',\n  command: 'M5 8l4 4-4 4M12 16h7',\n  code: 'M9 8l-4 4 4 4M15 8l4 4-4 4',\n  folder: 'M4 7h6l2 2h8v10H4z',\n  info: 'M12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18zM12 11v5M12 8h.01',\n  shield: 'M12 3l7 3v5.5c0 4.2-2.9 7.9-7 9.5-4.1-1.6-7-5.3-7-9.5V6z',\n  flag: 'M6 21V4M6 5h11l-2 4 2 4H6',\n} as const;\n\nexport type IconName = keyof typeof ICONS;\n\n/** One of the frame's glyphs, or the chrome icon pack's glyph for the same meaning (iconPack.tsx). */\nexport const Icon = ({ name, className }: { name: IconName; className?: string }) => {\n  const pack = useChromeIconPack();\n  const mapped = CHROME_ICON_NAMES[name];\n  const glyph = pack && mapped ? pack.glyphs[mapped] : undefined;\n  return <svg className={className ? `bt-glyph ${className}` : 'bt-glyph'} viewBox=\"0 0 24 24\" aria-hidden=\"true\">{glyph && pack ? <GlyphPaths glyph={glyph} pack={pack}/> : <path d={ICONS[name]}/>}</svg>;\n};\n\n/** Readable initial on a profile color: dark ink on light colors, white on dark ones. */\nexport function inkOn(hex: string): string {\n  const value = Number.parseInt(hex.slice(1), 16);\n  const [r, g, b] = [(value >> 16) & 255, (value >> 8) & 255, value & 255];\n  return (0.299 * r + 0.587 * g + 0.114 * b) > 150 ? '#0b0d12' : '#ffffff';\n}\n\nexport const initial = (name: string) => ([...name.trim()][0] ?? '?').toUpperCase();\n\n/** Round account avatar: the profile's initial on its color. */\n/** An account's X profile picture when known (`src`), else its initial on the profile color. */\nexport const Avatar = ({ name, color, size = 20, className = '', src }: { name: string; color: string; size?: number; className?: string; src?: string }) =>\n  <span className={`bt-avatar ${src ? 'bt-avatar--image' : ''} ${className}`} aria-hidden=\"true\"\n    style={{ width: size, height: size, flexBasis: size, background: color, color: inkOn(color), fontSize: Math.round(size * 0.46) }}>\n    {src ? <img src={src} alt=\"\" width={size} height={size} draggable={false} referrerPolicy=\"no-referrer\"/> : initial(name)}</span>;\n"]}

package/dist/shell/frame/index.d.ts

@@ -0,0 +1,34 @@
+import type { ComponentType } from 'react';
+import { type NativeApi } from './bridge.ts';
+import { type ShellI18n } from './i18n.ts';
+import { type ShellSite } from './site.ts';
+export type ShellOptions = {
+    /** The app's Tauri API: `invoke` and `listen` from @tauri-apps/api, and `getCurrentWindow`. */
+    native: NativeApi;
+    /** The app's i18n instance (waybetter/i18n `createI18n`, the framework catalogs merged in). */
+    i18n: ShellI18n;
+    /** A development build (keeps the devtools shortcut). */
+    dev?: boolean;
+};
+/**
+ * Sets the site and the app's native API and language for every frame module, and returns the
+ * shell's root component. Call once, before anything of the frame renders (the app's own panel
+ * may render the frame's pieces, e.g. in a preview, without the shell).
+ */
+export declare function createShell(site: ShellSite, options: ShellOptions): ComponentType;
+export type { ShellSite, DeckSite, PaletteSite, ColumnKind, ColumnFlag, DeckPreset, Completer, Suggestion } from './site.ts';
+export { site, siteChanged } from './site.ts';
+export type { NativeApi, Invoke, Listen, ShellWindow, MockHandler } from './bridge.ts';
+export { invoke, listen, isNative, installPreviewMocks } from './bridge.ts';
+export type { ShellI18n } from './i18n.ts';
+export { setShellI18n } from './i18n.ts';
+export { bootScript, BOOT_CACHE_KEY } from './boot.ts';
+export { createThemeStore, type ThemeAdapter, type ThemeStore, type ThemeDoc, type InstalledFont, type Weights } from './themeStore.ts';
+export { chromeVars, CHROME_VAR_NAMES, SHELL_UI_FONT, SHELL_MONO_FONT, type ChromeTheme } from './chromeTheme.ts';
+export { shell, setOverlay, scheduleSync, flushSync, isWeb, tabAction, setProfiles, type TabParams, type WebParams } from './state.ts';
+export type { PaletteItem, PaletteAction, PaletteContext } from './paletteModel.ts';
+export { Icon, Avatar, ICONS, type IconName } from './icons.tsx';
+export { DEFAULT_MENU, MENU_BUILTINS, MENU_MESSAGES, menuWith, menuWithout, type BuiltinMenuItem, type MenuEntry, type MenuGroups, type MenuItemSpec, type MenuLanguages, type MenuModes, type ReportDetails, type ShellMenu, } from './menuModel.ts';
+export { openAppMenu, type AppMenuRequest } from './AppMenu.tsx';
+export { createLanguage, resolveLocale, type Language, type LanguageOptions, type LanguagePreference } from './language.ts';
+export { createAppI18n, type AppI18n, type AppI18nOptions, type AppLanguage } from './appI18n.ts';

package/dist/shell/frame/index.js

@@ -0,0 +1,43 @@
+// The wayBetter shell frame: `createShell(site, options)` gives an app the whole shell (tabs in the
+// titlebar row, splits, the smart address bar, the new-tab page, the command palette, the account
+// switcher, decks of site columns, workspaces, developer mode and sync chips, the media panel,
+// pane themes, overlays and the native layout sync). The app describes its site (`ShellSite`) and
+// passes its Tauri API and i18n instance; styles come with the components (`--wb-*` tokens).
+//
+//   const Shell = createShell(site, { native: { invoke, listen, currentWindow: getCurrentWindow }, i18n });
+//   createRoot(root).render(<Shell/>);
+import { setNative } from "./bridge.js";
+import { decks, defaultDeckSettings } from "./deckStore.js";
+import { setShellI18n, setTextDefaults } from "./i18n.js";
+import Shell, { setDevBuild } from "./Shell.js";
+import { configureSite } from "./site.js";
+import { probeLayer, shell } from "./state.js";
+/**
+ * Sets the site and the app's native API and language for every frame module, and returns the
+ * shell's root component. Call once, before anything of the frame renders (the app's own panel
+ * may render the frame's pieces, e.g. in a preview, without the shell).
+ */
+export function createShell(site, options) {
+    setNative(options.native);
+    setShellI18n(options.i18n);
+    setTextDefaults({ site: site.name });
+    configureSite(site);
+    setDevBuild(!!options.dev);
+    shell.homeUrl = site.homeUrl;
+    decks.settings = defaultDeckSettings();
+    probeLayer();
+    return Shell;
+}
+export { site, siteChanged } from "./site.js";
+export { invoke, listen, isNative, installPreviewMocks } from "./bridge.js";
+export { setShellI18n } from "./i18n.js";
+export { bootScript, BOOT_CACHE_KEY } from "./boot.js";
+export { createThemeStore } from "./themeStore.js";
+export { chromeVars, CHROME_VAR_NAMES, SHELL_UI_FONT, SHELL_MONO_FONT } from "./chromeTheme.js";
+export { shell, setOverlay, scheduleSync, flushSync, isWeb, tabAction, setProfiles } from "./state.js";
+export { Icon, Avatar, ICONS } from "./icons.js";
+export { DEFAULT_MENU, MENU_BUILTINS, MENU_MESSAGES, menuWith, menuWithout, } from "./menuModel.js";
+export { openAppMenu } from "./AppMenu.js";
+export { createLanguage, resolveLocale } from "./language.js";
+export { createAppI18n } from "./appI18n.js";
+//# sourceMappingURL=index.js.map

package/dist/shell/frame/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../shell/src/frame/index.ts"],"names":[],"mappings":"AAAA,oGAAoG;AACpG,kGAAkG;AAClG,+FAA+F;AAC/F,kGAAkG;AAClG,6FAA6F;AAC7F,EAAE;AACF,4GAA4G;AAC5G,uCAAuC;AAGvC,OAAO,EAAE,SAAS,EAAkB,MAAM,aAAa,CAAC;AACxD,OAAO,EAAE,KAAK,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,eAAe,EAAkB,MAAM,WAAW,CAAC;AAC1E,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,YAAa,CAAC;AACjD,OAAO,EAAE,aAAa,EAAkB,MAAM,WAAW,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAW/C;;;;GAIG;AACH,MAAM,UAAU,WAAW,CAAC,IAAe,EAAE,OAAqB;IAChE,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IAC1B,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IAC3B,eAAe,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;IACrC,aAAa,CAAC,IAAI,CAAC,CAAC;IACpB,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IAC3B,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;IAC7B,KAAK,CAAC,QAAQ,GAAG,mBAAmB,EAAE,CAAC;IACvC,UAAU,EAAE,CAAC;IACb,OAAO,KAAK,CAAC;AACf,CAAC;AAGD,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE9C,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAE5E,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAuF,MAAM,iBAAiB,CAAC;AACxI,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,aAAa,EAAE,eAAe,EAAoB,MAAM,kBAAkB,CAAC;AAClH,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAkC,MAAM,YAAY,CAAC;AAEvI,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAiB,MAAM,YAAa,CAAC;AACjE,OAAO,EACL,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,WAAW,GAElE,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,WAAW,EAAuB,MAAM,cAAe,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,aAAa,EAAgE,MAAM,eAAe,CAAC;AAC5H,OAAO,EAAE,aAAa,EAAuD,MAAM,cAAc,CAAC","sourcesContent":["// The wayBetter shell frame: `createShell(site, options)` gives an app the whole shell (tabs in the\n// titlebar row, splits, the smart address bar, the new-tab page, the command palette, the account\n// switcher, decks of site columns, workspaces, developer mode and sync chips, the media panel,\n// pane themes, overlays and the native layout sync). The app describes its site (`ShellSite`) and\n// passes its Tauri API and i18n instance; styles come with the components (`--wb-*` tokens).\n//\n//   const Shell = createShell(site, { native: { invoke, listen, currentWindow: getCurrentWindow }, i18n });\n//   createRoot(root).render(<Shell/>);\n\nimport type { ComponentType } from 'react';\nimport { setNative, type NativeApi } from './bridge.ts';\nimport { decks, defaultDeckSettings } from './deckStore.ts';\nimport { setShellI18n, setTextDefaults, type ShellI18n } from './i18n.ts';\nimport Shell, { setDevBuild } from './Shell.tsx';\nimport { configureSite, type ShellSite } from './site.ts';\nimport { probeLayer, shell } from './state.ts';\n\nexport type ShellOptions = {\n  /** The app's Tauri API: `invoke` and `listen` from @tauri-apps/api, and `getCurrentWindow`. */\n  native: NativeApi;\n  /** The app's i18n instance (waybetter/i18n `createI18n`, the framework catalogs merged in). */\n  i18n: ShellI18n;\n  /** A development build (keeps the devtools shortcut). */\n  dev?: boolean;\n};\n\n/**\n * Sets the site and the app's native API and language for every frame module, and returns the\n * shell's root component. Call once, before anything of the frame renders (the app's own panel\n * may render the frame's pieces, e.g. in a preview, without the shell).\n */\nexport function createShell(site: ShellSite, options: ShellOptions): ComponentType {\n  setNative(options.native);\n  setShellI18n(options.i18n);\n  setTextDefaults({ site: site.name });\n  configureSite(site);\n  setDevBuild(!!options.dev);\n  shell.homeUrl = site.homeUrl;\n  decks.settings = defaultDeckSettings();\n  probeLayer();\n  return Shell;\n}\n\nexport type { ShellSite, DeckSite, PaletteSite, ColumnKind, ColumnFlag, DeckPreset, Completer, Suggestion } from './site.ts';\nexport { site, siteChanged } from './site.ts';\nexport type { NativeApi, Invoke, Listen, ShellWindow, MockHandler } from './bridge.ts';\nexport { invoke, listen, isNative, installPreviewMocks } from './bridge.ts';\nexport type { ShellI18n } from './i18n.ts';\nexport { setShellI18n } from './i18n.ts';\nexport { bootScript, BOOT_CACHE_KEY } from './boot.ts';\nexport { createThemeStore, type ThemeAdapter, type ThemeStore, type ThemeDoc, type InstalledFont, type Weights } from './themeStore.ts';\nexport { chromeVars, CHROME_VAR_NAMES, SHELL_UI_FONT, SHELL_MONO_FONT, type ChromeTheme } from './chromeTheme.ts';\nexport { shell, setOverlay, scheduleSync, flushSync, isWeb, tabAction, setProfiles, type TabParams, type WebParams } from './state.ts';\nexport type { PaletteItem, PaletteAction, PaletteContext } from './paletteModel.ts';\nexport { Icon, Avatar, ICONS, type IconName } from './icons.tsx';\nexport {\n  DEFAULT_MENU, MENU_BUILTINS, MENU_MESSAGES, menuWith, menuWithout,\n  type BuiltinMenuItem, type MenuEntry, type MenuGroups, type MenuItemSpec, type MenuLanguages, type MenuModes, type ReportDetails, type ShellMenu,\n} from './menuModel.ts';\nexport { openAppMenu, type AppMenuRequest } from './AppMenu.tsx';\nexport { createLanguage, resolveLocale, type Language, type LanguageOptions, type LanguagePreference } from './language.ts';\nexport { createAppI18n, type AppI18n, type AppI18nOptions, type AppLanguage } from './appI18n.ts';\n"]}

package/dist/shell/frame/language.d.ts

@@ -0,0 +1,58 @@
+import type { Invoke, Listen } from './bridge.ts';
+/** `site`: follow the site's own language. `system`: follow the OS. Otherwise a catalog tag. */
+export type LanguagePreference = 'site' | 'system' | string;
+/** The part of a waybetter/i18n instance the language state drives. */
+export type LanguageI18n = {
+    readonly locale: string;
+    readonly available: readonly string[];
+    setLocale(locale: string): Promise<string>;
+    resolved(prefixes?: readonly string[]): Record<string, string>;
+};
+export type LanguageOptions = {
+    i18n: LanguageI18n;
+    /** Key prefixes native code and site tabs need; the shell hands exactly these over (`i18n_set`). */
+    nativePrefixes: readonly string[];
+    /** The app's Tauri `invoke` and `listen` (the language is set up before the shell frame is). */
+    native: {
+        invoke: Invoke;
+        listen: Listen;
+    };
+    /** Where the choice is kept for the app's other local windows (default `wb.language`). */
+    storageKey?: string;
+    /**
+     * The supported tier: automatic choices ("Follow the site", "Follow system") resolve only to
+     * these (English is always one). Any other catalog is a community language: it applies only
+     * when picked explicitly. Default: every catalog is supported.
+     */
+    supported?: readonly string[];
+};
+/** Where the shell keeps its choice for the app's other local windows (localStorage). */
+export declare const DEFAULT_STORAGE_KEY = "wb.language";
+/**
+ * The catalog to use for a preference, the site's reported language and the OS preferences.
+ * Automatic choices ("site", "system") only resolve to `supported` languages (default: all of
+ * `available`), through the normal fallback chain (pt-BR -> pt, zh-TW -> zh-Hant); a language
+ * picked explicitly applies whatever its tier.
+ */
+export declare function resolveLocale(preference: LanguagePreference, siteLang: string | null, system: readonly string[], available: readonly string[], supported?: readonly string[]): string;
+/**
+ * The community language an automatic choice would have used had it been supported (the site's or
+ * the system's), or null: the panel offers it as a one-click switch.
+ */
+export declare function communitySuggestion(preference: LanguagePreference, siteLang: string | null, system: readonly string[], available: readonly string[], supported?: readonly string[]): string | null;
+export type Language = ReturnType<typeof createLanguage>;
+export declare function createLanguage(options: LanguageOptions): {
+    initShell: (isNative: boolean) => Promise<void>;
+    initFollower: (forced?: string | null) => Promise<void>;
+    state: () => {
+        preference: string;
+        siteLang: string | null;
+        system: string[];
+        locale: string;
+        community: string | null;
+    };
+    set: (preference: LanguagePreference) => Promise<void>;
+    subscribe: (listener: () => void) => () => void;
+    forcePreview: (tag: string) => Promise<void>;
+    storageKey: string;
+};