dsh-plugin-subscription-usage 0.0.0-stage → 0.2.0

package/lib/client/Notice.js

@@ -0,0 +1,93 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Frame-wide pace notice in `shell.overlay`: one line when a window will
+ * empty before it resets, or has run out. Each crossing shows once and stays
+ * dismissed for that window, keyed by provider, account, window and reset.
+ */
+import { useEffect, useMemo, useState } from 'react';
+import { pace } from '../usage/pace.js';
+import { isMetered, USAGE_PROVIDERS, shortName } from './rpc.js';
+import { usageKey } from './store.js';
+import { clockTime, Icon, tf, windowLabel } from './meter.js';
+import { useNow } from './hooks.js';
+import { usePrefs, useStore } from './context.js';
+const DISMISSED_KEY = 'dsh-plugin-subscription-usage.dismissed-notices';
+/** Dismissals survive reloads; one entry per window crossing. */
+function readDismissed() {
+    try {
+        const raw = JSON.parse(localStorage.getItem(DISMISSED_KEY) ?? '[]');
+        return new Set(Array.isArray(raw) ? raw.filter((id) => typeof id === 'string') : []);
+    }
+    catch {
+        return new Set();
+    }
+}
+/**
+ * The most urgent notice across the serving accounts, or undefined.
+ * Only serving or default accounts warn; an idle account's pace is not the user's problem yet.
+ */
+export function currentNotice(t, snapshot, now, dismissed) {
+    const candidates = [];
+    for (const provider of USAGE_PROVIDERS) {
+        if (!isMetered(snapshot.status, provider))
+            continue;
+        const status = snapshot.status?.providers[provider];
+        if (status === undefined)
+            continue;
+        for (const account of status.accounts) {
+            if (account.key !== status.servingAccount && !account.isDefault)
+                continue;
+            const entry = snapshot.usage.get(usageKey(provider, account.key));
+            if (entry?.kind !== 'ready')
+                continue;
+            for (const window of entry.usage.windows ?? []) {
+                const notice = noticeFor(t, shortName(snapshot.status, provider), provider, account.key, window, now);
+                if (notice !== undefined && !dismissed.has(notice.id))
+                    candidates.push(notice);
+            }
+        }
+    }
+    candidates.sort((a, b) => a.rank - b.rank);
+    const top = candidates[0];
+    return top === undefined ? undefined : { id: top.id, tone: top.tone, text: top.text };
+}
+function noticeFor(t, name, provider, account, window, now) {
+    const p = pace(window, now);
+    const id = `${provider}/${account}/${window.kind}/${window.scope ?? ''}/${window.resetsAt ?? ''}`;
+    const label = windowLabel(t, window);
+    if (p.state === 'out')
+        return { id: `${id}/out`, tone: 'error', rank: 0, text: tf(t, 'noticeOut', { provider: name, window: label }) };
+    if (p.state === 'over') {
+        return { id: `${id}/over`, tone: 'warn', rank: p.emptyAt - now, text: tf(t, 'noticeEmpty', { provider: name, window: label, time: clockTime(p.emptyAt, now) }) };
+    }
+    return undefined;
+}
+export function Notice(props) {
+    const { store, prefs, t } = props;
+    if (store === undefined || prefs === undefined || t === undefined)
+        return null;
+    return _jsx(NoticeBody, { store: store, prefs: prefs, t: t });
+}
+function NoticeBody({ store, prefs, t }) {
+    const snapshot = useStore(store);
+    const view = usePrefs(prefs);
+    const now = useNow(60_000);
+    const [dismissed, setDismissed] = useState(readDismissed);
+    const notice = useMemo(() => view.paceWarnings ? currentNotice(t, snapshot, now, dismissed) : undefined, [view.paceWarnings, t, snapshot, now, dismissed]);
+    useEffect(() => {
+        const onStorage = (event) => { if (event.key === DISMISSED_KEY)
+            setDismissed(readDismissed()); };
+        window.addEventListener('storage', onStorage);
+        return () => { window.removeEventListener('storage', onStorage); };
+    }, []);
+    if (notice === undefined)
+        return null;
+    const dismiss = () => {
+        const next = new Set(dismissed);
+        next.add(notice.id);
+        // Old windows never return; keep the list short.
+        localStorage.setItem(DISMISSED_KEY, JSON.stringify([...next].slice(-50)));
+        setDismissed(next);
+    };
+    return (_jsx("div", { className: "dsm-notice-host", style: { pointerEvents: 'auto' }, children: _jsxs("div", { className: `dsm-notice${notice.tone === 'error' ? ' dsm-err' : ''}`, role: "status", "aria-live": "polite", children: [_jsx(Icon, { name: "alert" }), _jsx("span", { children: notice.text }), _jsx("button", { type: "button", className: "dsm-btn dsm-icon", "aria-label": t('dismiss'), title: t('dismiss'), onClick: dismiss, children: _jsx(Icon, { name: "x" }) })] }) }));
+}

package/lib/client/ProviderCard.d.ts

@@ -0,0 +1,35 @@
+import type { PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots';
+import type { AccountStatus, UsageProviderId, ProviderStatus } from './rpc.js';
+import type { StoreSnapshot } from './store.js';
+import type { T } from './meter.js';
+import type { SurfaceInjected } from './context.js';
+import type { UsagePreferencesView } from './prefs.js';
+export type ProviderCardProps = PropsRuntime<'settings.models.provider-card'> & Partial<SurfaceInjected>;
+export declare function ProviderCard(props: ProviderCardProps): import("react").JSX.Element | null;
+/** Plan tag, default star, and serving bolt. */
+export declare function AccountTags({ t, account, status }: {
+    t: T;
+    account: AccountStatus;
+    status: ProviderStatus;
+}): import("react").JSX.Element;
+/** "live", "4m ago", or a stale warning, at the end of an account header. */
+export declare function Freshness({ t, snapshot, provider, account, now }: {
+    t: T;
+    snapshot: StoreSnapshot;
+    provider: UsageProviderId;
+    account: string;
+    now: number;
+}): import("react").JSX.Element | null;
+/** One account: header, then its windows on the shared grid. */
+export declare function Account({ t, provider, account, status, snapshot, prefs, now, onSignIn, compact, hideUsage }: {
+    t: T;
+    provider: UsageProviderId;
+    account: AccountStatus;
+    status: ProviderStatus;
+    snapshot: StoreSnapshot;
+    prefs: UsagePreferencesView;
+    now: number;
+    onSignIn?: () => void;
+    compact?: boolean;
+    hideUsage?: boolean;
+}): import("react").JSX.Element;

package/lib/client/ProviderCard.js

@@ -0,0 +1,240 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * The body of one subscription row on the Models page, rendered in the
+ * `settings.models.provider-card` slot. The active account shows in full;
+ * other accounts fold behind one summary row; Manage opens Accounts, Models
+ * and Tools inline.
+ */
+import { useEffect, useRef, useState } from 'react';
+import { call, isMetered, isProviderId } from './rpc.js';
+import { splitAccounts, usageKey } from './store.js';
+import { Icon, shortDuration, shownWindows, tf, WindowRow } from './meter.js';
+import { useNow } from './hooks.js';
+import { usePrefs, useStore } from './context.js';
+/** How often a busy sign-in re-reads status until the account lands. */
+const SIGN_IN_POLL_MS = 2000;
+export function ProviderCard(props) {
+    const { store, prefs, rpc, t } = props;
+    const provider = props.provider.provider;
+    if (store === undefined || prefs === undefined || rpc === undefined || t === undefined || !isProviderId(provider))
+        return null;
+    return _jsx(CardBody, { provider: provider, store: store, prefs: prefs, rpc: rpc, t: t });
+}
+function CardBody({ provider, store, prefs, rpc, t }) {
+    const snapshot = useStore(store);
+    const prefView = usePrefs(prefs);
+    const now = useNow(30_000);
+    const status = snapshot.status?.providers[provider];
+    const [mode, setMode] = useState({ kind: 'view' });
+    const [error, setError] = useState();
+    const [moreOpen, setMoreOpen] = useState(false);
+    // A busy sign-in polls status until the account lands or the attempt ends.
+    const busy = status?.busy === true;
+    useEffect(() => {
+        if (mode.kind !== 'signin' && !busy)
+            return;
+        const timer = setInterval(() => { void store.refreshStatus(); }, SIGN_IN_POLL_MS);
+        return () => { clearInterval(timer); };
+    }, [mode.kind, busy, store]);
+    const accountCount = status?.accounts.length ?? 0;
+    const startCount = useRef(accountCount);
+    useEffect(() => {
+        if (mode.kind === 'signin' && !busy && accountCount !== startCount.current)
+            setMode({ kind: 'view' });
+    }, [mode.kind, busy, accountCount]);
+    useEffect(() => {
+        if (status?.detail !== undefined)
+            setError(status.detail);
+    }, [status?.detail]);
+    const signIn = async (method) => {
+        setError(undefined);
+        startCount.current = accountCount;
+        try {
+            const response = await call(rpc, 'login', { provider, ...method === undefined ? {} : { method } });
+            if (response.authorizeUrl === '') {
+                await store.refreshStatus();
+                return;
+            }
+            if (response.userCode !== undefined && response.userCode !== '') {
+                setMode({ kind: 'signin', userCode: response.userCode, url: response.authorizeUrl });
+            }
+            else {
+                window.open(response.authorizeUrl, '_blank', 'noopener');
+                setMode({ kind: 'signin' });
+            }
+            void store.refreshStatus();
+        }
+        catch (failure) {
+            setError(failure instanceof Error ? failure.message : String(failure));
+        }
+    };
+    const cancel = async () => {
+        setMode({ kind: 'view' });
+        await call(rpc, 'cancel', { provider }).catch(() => undefined);
+        await store.refreshStatus();
+    };
+    if (status === undefined) {
+        return snapshot.statusError === undefined ? null : _jsx("div", { className: "dsm-sub", children: _jsx("span", { className: "dsm-card-error", children: snapshot.statusError }) });
+    }
+    if (mode.kind === 'signin') {
+        return (_jsxs("div", { className: "dsm-sub", children: [_jsx(SignIn, { t: t, provider: provider, mode: mode, rpc: rpc, onCancel: () => { void cancel(); }, onError: setError }), error === undefined ? null : _jsx("span", { className: "dsm-card-error", role: "alert", children: error })] }));
+    }
+    if (status.accounts.length === 0) {
+        return (_jsxs("div", { className: "dsm-sub", children: [_jsxs("div", { className: "dsm-foot", children: [_jsx("button", { type: "button", className: "dsm-btn dsm-primary", onClick: () => { void signIn(); }, children: t('signIn') }), provider === 'claude'
+                            ? _jsx("button", { type: "button", className: "dsm-btn dsm-ghost", onClick: () => { void signIn('keychain'); }, children: t('claudeImport') })
+                            : _jsx("span", { className: "dsm-muted", children: t('noApiKey') })] }), error === undefined ? null : _jsx("span", { className: "dsm-card-error", role: "alert", children: error })] }));
+    }
+    const split = splitAccounts(status);
+    if (split === undefined)
+        return null;
+    const { active, rest } = split;
+    return (_jsxs("div", { className: "dsm-sub", children: [_jsx(Account, { t: t, provider: provider, account: active, status: status, snapshot: snapshot, prefs: prefView, now: now, hideUsage: true, onSignIn: () => { void signIn(); } }), rest.length === 0 ? null : (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", className: "dsm-fold", "aria-expanded": moreOpen, onClick: () => { setMoreOpen(open => !open); }, children: _jsxs("span", { className: "dsm-fold-name", children: [_jsx(Icon, { name: "right", size: 12, className: "dsm-chev" }), _jsx("span", { children: rest.length === 1 ? label(rest[0]) : tf(t, 'moreAccounts', { count: rest.length }) }), rest.length === 1 ? _jsx(AccountTags, { t: t, account: rest[0], status: status }) : null] }) }), moreOpen ? (_jsx("div", { className: "dsm-fold-body", children: rest.map(account => _jsx(Account, { t: t, provider: provider, account: account, status: status, snapshot: snapshot, prefs: prefView, now: now, hideUsage: true, onSignIn: () => { void signIn(); } }, account.key)) })) : null] })), mode.kind === 'manage'
+                ? _jsx(ManagePanel, { t: t, provider: provider, status: status, rpc: rpc, onClose: () => { setMode({ kind: 'view' }); void store.refreshStatus(); }, onAddAccount: () => { void signIn(); } })
+                : (_jsxs("div", { className: "dsm-foot", children: [_jsx("button", { type: "button", className: "dsm-btn", onClick: () => { setMode({ kind: 'manage' }); }, children: t('manage') }), _jsx(PickerCount, { t: t, status: status })] })), error === undefined ? null : _jsx("span", { className: "dsm-card-error", role: "alert", children: error })] }));
+}
+const label = (account) => account.account ?? account.key;
+function usageOf(snapshot, provider, account) {
+    const entry = snapshot.usage.get(usageKey(provider, account));
+    return entry?.kind === 'ready' ? entry.usage : undefined;
+}
+/** Plan tag, default star, and serving bolt. */
+export function AccountTags({ t, account, status }) {
+    return (_jsxs(_Fragment, { children: [account.plan === undefined ? null : _jsx("span", { className: "dsm-tag", children: account.plan }), account.isDefault ? _jsx("span", { className: "dsm-glyph dsm-star", title: t('defaultAccount'), "aria-label": t('defaultAccount'), children: _jsx(Icon, { name: "star", size: 12 }) }) : null, status.servingAccount === account.key
+                ? _jsx("span", { className: "dsm-glyph dsm-live", title: t('servingAccount'), "aria-label": t('servingAccount'), children: _jsx(Icon, { name: "bolt", size: 12 }) })
+                : null] }));
+}
+/** "live", "4m ago", or a stale warning, at the end of an account header. */
+export function Freshness({ t, snapshot, provider, account, now }) {
+    if (!isMetered(snapshot.status, provider))
+        return _jsx("span", { className: "dsm-fresh", title: t('noUsageDataTitle'), children: t('noUsageData') });
+    const entry = snapshot.usage.get(usageKey(provider, account));
+    if (entry === undefined || entry.kind === 'loading')
+        return null;
+    if (entry.kind === 'error')
+        return _jsxs("span", { className: "dsm-fresh dsm-stale", title: entry.message, children: [_jsx(Icon, { name: "alert", size: 12 }), t('usageUnavailable')] });
+    const usage = entry.usage;
+    const fetchedAt = usage.fetchedAt ?? entry.receivedAt;
+    if (usage.refreshFailed === true || usage.stale === true && usage.retryAt !== undefined) {
+        const when = usage.retryAt === undefined ? '' : tf(t, 'resetsIn', { time: shortDuration(Math.max(0, usage.retryAt - now)) });
+        return (_jsxs("span", { className: "dsm-fresh dsm-stale", title: tf(t, 'staleTitle', { when }), children: [_jsx(Icon, { name: "alert", size: 12 }), tf(t, 'staleShort', { time: shortDuration(Math.max(0, now - fetchedAt)) })] }));
+    }
+    if (usage.source === 'live' && now - fetchedAt < 10 * 60_000) {
+        return _jsxs("span", { className: "dsm-fresh", title: t('liveTitle'), children: [_jsx("span", { className: "dsm-live-dot" }), t('live')] });
+    }
+    return _jsx("span", { className: "dsm-fresh", children: tf(t, 'agoShort', { time: shortDuration(Math.max(0, now - fetchedAt)) }) });
+}
+/** One account: header, then its windows on the shared grid. */
+export function Account({ t, provider, account, status, snapshot, prefs, now, onSignIn, compact, hideUsage }) {
+    const usage = usageOf(snapshot, provider, account.key);
+    const expired = usage === undefined && snapshot.usage.get(usageKey(provider, account.key))?.kind === 'error'
+        && account.expiresAt !== undefined && account.expiresAt < now;
+    return (_jsxs("div", { className: compact === true ? 'dsm-pacct' : 'dsm-acct', children: [_jsxs("div", { className: "dsm-acct-head", children: [_jsx("span", { className: "dsm-acct-name", children: label(account) }), _jsx(AccountTags, { t: t, account: account, status: status }), hideUsage === true ? null : _jsx(Freshness, { t: t, snapshot: snapshot, provider: provider, account: account.key, now: now })] }), expired && onSignIn !== undefined ? (_jsxs("div", { className: "dsm-alert", role: "alert", children: [_jsx(Icon, { name: "alert" }), _jsx("span", { children: t('signInExpired') }), _jsx("button", { type: "button", className: "dsm-btn dsm-primary", onClick: onSignIn, children: t('signInAgain') })] })) : hideUsage === true || usage?.windows === undefined || usage.windows.length === 0 ? null : (_jsx("div", { className: "dsm-wins", children: shownWindows(usage.windows).map((window, index) => _jsx(WindowRow, { t: t, window: window, display: prefs.display, now: now }, index)) }))] }));
+}
+function PickerCount({ t, status }) {
+    const total = status.catalogSize;
+    if (total === undefined)
+        return null;
+    const visible = status.visibleModels === undefined ? total : status.visibleModels.length;
+    return _jsx("span", { className: "dsm-muted dsm-num", title: t('modelsCountTitle'), children: tf(t, 'modelsCount', { visible, total }) });
+}
+function SignIn({ t, provider, mode, rpc, onCancel, onError }) {
+    const [draft, setDraft] = useState('');
+    if (mode.userCode !== undefined) {
+        return (_jsxs("div", { className: "dsm-signin", children: [_jsxs("ol", { className: "dsm-steps", children: [_jsxs("li", { "data-s": "done", children: [_jsx(Icon, { name: "check", size: 12 }), t('stepCodeIssued')] }), _jsxs("li", { "data-s": "now", children: [_jsx("span", { className: "dsm-spin" }), t('stepWaitingGithub')] })] }), _jsxs("div", { className: "dsm-foot", style: { flexWrap: 'wrap' }, children: [_jsx("span", { className: "dsm-code", children: mode.userCode }), _jsx("button", { type: "button", className: "dsm-btn dsm-icon", "aria-label": t('copyCode'), title: t('copyCode'), onClick: () => { void navigator.clipboard?.writeText(mode.userCode ?? ''); }, children: _jsx(Icon, { name: "copy" }) }), mode.url === undefined ? null : (_jsxs("a", { className: "dsm-btn", href: mode.url, target: "_blank", rel: "noopener noreferrer", children: [new URL(mode.url).host + new URL(mode.url).pathname, _jsx(Icon, { name: "ext", size: 12 })] })), _jsx("button", { type: "button", className: "dsm-btn dsm-ghost", style: { marginLeft: 'auto' }, onClick: onCancel, children: t('cancel') })] })] }));
+    }
+    const submit = async () => {
+        const input = draft.trim();
+        if (input === '')
+            return;
+        onError(undefined);
+        try {
+            await call(rpc, 'manual', { provider, input });
+            setDraft('');
+        }
+        catch (failure) {
+            onError(failure instanceof Error ? failure.message : String(failure));
+        }
+    };
+    return (_jsxs("div", { className: "dsm-signin", children: [_jsxs("ol", { className: "dsm-steps", children: [_jsxs("li", { "data-s": "done", children: [_jsx(Icon, { name: "check", size: 12 }), t('stepTabOpened')] }), _jsxs("li", { "data-s": "now", children: [_jsx("span", { className: "dsm-spin" }), t('stepApprove')] }), _jsxs("li", { children: [_jsx(Icon, { name: "check", size: 12 }), t('stepLoadModels')] })] }), _jsxs("div", { className: "dsm-foot", style: { alignItems: 'flex-start' }, children: [_jsxs("details", { className: "dsm-fallback", style: { flex: 1 }, children: [_jsxs("summary", { children: [_jsx(Icon, { name: "down", size: 12 }), t('pasteRedirect')] }), _jsxs("form", { className: "dsm-foot", onSubmit: event => { event.preventDefault(); void submit(); }, children: [_jsx("input", { className: "dsm-input", value: draft, placeholder: t('pastePlaceholder'), onChange: event => { setDraft(event.target.value); } }), _jsx("button", { type: "submit", className: "dsm-btn", disabled: draft.trim() === '', children: t('continue') })] })] }), _jsx("button", { type: "button", className: "dsm-btn dsm-ghost", onClick: onCancel, children: t('cancel') })] })] }));
+}
+const TOOL_LABEL = { web_search: 'toolWebSearch', image_generate: 'toolImage', video_generate: 'toolVideo', x_search: 'toolXSearch' };
+function ManagePanel({ t, provider, status, rpc, onClose, onAddAccount }) {
+    const [tab, setTab] = useState('accounts');
+    const [loaded, setLoaded] = useState();
+    const [draft, setDraft] = useState();
+    const [efforts, setEfforts] = useState({});
+    const [search, setSearch] = useState('');
+    const [saving, setSaving] = useState(false);
+    const [error, setError] = useState();
+    useEffect(() => {
+        let live = true;
+        call(rpc, 'providerSettings', { provider }).then(value => {
+            if (!live)
+                return;
+            setLoaded(value);
+            setDraft(value.settings);
+        }, (failure) => { if (live)
+            setError(tf(t, 'loadFailed', { message: failure instanceof Error ? failure.message : String(failure) })); });
+        return () => { live = false; };
+    }, [rpc, provider, t]);
+    const accountAction = async (endpoint, account) => {
+        setError(undefined);
+        try {
+            await call(rpc, endpoint, { provider, account });
+            onClose();
+        }
+        catch (failure) {
+            setError(failure instanceof Error ? failure.message : String(failure));
+        }
+    };
+    const save = async () => {
+        if (draft === undefined || loaded === undefined)
+            return;
+        setSaving(true);
+        setError(undefined);
+        try {
+            await call(rpc, 'setProviderSettings', { provider, settings: draft });
+            for (const [model, effort] of Object.entries(efforts)) {
+                await call(rpc, 'setModelDefault', { provider, model, ...effort === undefined ? {} : { effort } });
+            }
+            onClose();
+        }
+        catch (failure) {
+            setError(tf(t, 'saveFailed', { message: failure instanceof Error ? failure.message : String(failure) }));
+        }
+        finally {
+            setSaving(false);
+        }
+    };
+    const models = loaded?.models ?? [];
+    const allIds = models.map(m => m.id);
+    const visible = new Set(draft?.visibleModels ?? allIds);
+    const automatic = draft?.visibleModels === undefined;
+    const setVisible = (ids) => {
+        setDraft(current => {
+            const next = { ...current };
+            if (ids === undefined)
+                delete next.visibleModels;
+            else
+                next.visibleModels = ids;
+            return next;
+        });
+    };
+    const accountPrefs = draft?.accounts ?? {};
+    const setPool = (account, enabled) => {
+        setDraft(current => ({ ...current, accounts: { ...current?.accounts, [account]: { ...current?.accounts?.[account], poolEnabled: enabled } } }));
+    };
+    const toolsOn = draft?.tools ?? {};
+    const shown = models.filter(m => search === '' || m.id.toLowerCase().includes(search.toLowerCase()) || m.name.toLowerCase().includes(search.toLowerCase()));
+    return (_jsxs("div", { className: "dsm-panel", children: [_jsx("div", { className: "dsm-tabs", role: "tablist", children: ['accounts', 'models', 'tools'].filter(id => id !== 'tools' || (loaded?.tools.length ?? 0) > 0).map(id => (_jsx("button", { type: "button", role: "tab", className: "dsm-tab", "aria-selected": tab === id, onClick: () => { setTab(id); }, children: t(id === 'accounts' ? 'tabAccounts' : id === 'models' ? 'tabModels' : 'tabTools') }, id))) }), tab === 'accounts' ? (_jsxs(_Fragment, { children: [status.accounts.map(account => (_jsxs("div", { className: "dsm-row", children: [_jsxs("span", { className: "dsm-grow", children: [_jsx("span", { className: "dsm-ellipsis", children: label(account) }), _jsx(AccountTags, { t: t, account: account, status: status })] }), status.accounts.length > 1 ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "dsm-note", children: t('pool') }), _jsx("button", { type: "button", role: "switch", className: "dsm-switch", "aria-checked": accountPrefs[account.key]?.poolEnabled !== false, "aria-label": tf(t, 'poolInclude', { account: label(account) }), onClick: () => { setPool(account.key, accountPrefs[account.key]?.poolEnabled === false); } })] })) : null, account.isDefault ? null : (_jsx("button", { type: "button", className: "dsm-btn dsm-icon", title: t('makeDefault'), "aria-label": t('makeDefault'), onClick: () => { void accountAction('setDefault', account.key); }, children: _jsx(Icon, { name: "star" }) })), _jsx("button", { type: "button", className: "dsm-btn dsm-danger", onClick: () => { void accountAction('logout', account.key); }, children: t('signOut') })] }, account.key))), _jsx("div", { className: "dsm-row", children: _jsxs("button", { type: "button", className: "dsm-btn", onClick: onAddAccount, children: ["+ ", t('addAccount')] }) })] })) : null, tab === 'models' ? (_jsxs(_Fragment, { children: [_jsx("input", { className: "dsm-input", value: search, placeholder: tf(t, 'searchModels', { count: models.length }), onChange: event => { setSearch(event.target.value); } }), _jsxs("div", { className: "dsm-row", children: [_jsx("span", { className: "dsm-grow", children: t('autoShowNew') }), _jsx("button", { type: "button", role: "switch", className: "dsm-switch", "aria-checked": automatic, "aria-label": t('autoShowNew'), onClick: () => { setVisible(automatic ? allIds : undefined); } })] }), _jsxs("div", { className: "dsm-row", children: [_jsx("button", { type: "button", className: "dsm-btn", onClick: () => { setVisible(allIds); }, children: t('selectAll') }), _jsx("button", { type: "button", className: "dsm-btn", onClick: () => { setVisible([]); }, children: t('deselectAll') })] }), _jsx("div", { className: "dsm-list", children: shown.map(model => (_jsx(ModelRow, { t: t, model: model, on: visible.has(model.id), effort: model.id in efforts ? efforts[model.id] : model.configured, onToggle: () => {
+                                const next = new Set(visible);
+                                if (next.has(model.id))
+                                    next.delete(model.id);
+                                else
+                                    next.add(model.id);
+                                setVisible(allIds.filter(id => next.has(id)));
+                            }, onEffort: effort => { setEfforts(current => ({ ...current, [model.id]: effort })); } }, model.id))) }), _jsx("span", { className: "dsm-note", children: tf(t, 'pickerCount', { visible: visible.size, total: models.length }) })] })) : null, tab === 'tools' ? (_jsxs(_Fragment, { children: [(loaded?.tools ?? []).map(tool => (_jsxs("div", { className: "dsm-row", children: [_jsx("span", { className: "dsm-grow", children: t(TOOL_LABEL[tool]) }), _jsx("button", { type: "button", role: "switch", className: "dsm-switch", "aria-checked": toolsOn[tool] !== false, "aria-label": t(TOOL_LABEL[tool]), onClick: () => { setDraft(current => ({ ...current, tools: { ...current?.tools, [tool]: current?.tools?.[tool] === false } })); } })] }, tool))), _jsx("span", { className: "dsm-note", children: t('toolsNote') })] })) : null, _jsxs("div", { className: "dsm-panel-foot", children: [error === undefined ? null : _jsx("span", { className: "dsm-card-error", role: "alert", children: error }), _jsx("button", { type: "button", className: "dsm-btn dsm-ghost", onClick: onClose, children: t('cancel') }), _jsx("button", { type: "button", className: "dsm-btn dsm-primary", disabled: saving || draft === undefined, onClick: () => { void save(); }, children: saving ? t('saving') : t('save') })] })] }));
+}
+function ModelRow({ t, model, on, effort, onToggle, onEffort }) {
+    return (_jsxs("div", { className: "dsm-row", children: [_jsx("button", { type: "button", role: "switch", className: "dsm-switch", "aria-checked": on, "aria-label": tf(t, 'showInPicker', { model: model.id }), onClick: onToggle }), _jsxs("span", { className: "dsm-grow", children: [_jsx("span", { className: "dsm-ellipsis dsm-num", children: model.id }), model.contextWindow === undefined ? null : _jsxs("span", { className: "dsm-note", children: [Math.round(model.contextWindow / 1000), "K"] })] }), model.efforts.length === 0 ? null : (_jsxs("select", { className: "dsm-select", "aria-label": tf(t, 'effortFor', { model: model.id }), value: effort ?? '', onChange: event => { onEffort(event.target.value === '' ? undefined : event.target.value); }, children: [_jsx("option", { value: "", children: t('effortAuto') }), model.efforts.map(level => _jsx("option", { value: level.id, children: level.name }, level.id))] }))] }));
+}

package/lib/client/SpeedSelect.d.ts

@@ -0,0 +1,72 @@
+import type { PropsLocale, PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots';
+import type { ConnectionHandle } from '@deepseek-ai/dsh-api-remotes/client';
+/** One session's speed choice: standard routing or the fast (priority) tier. */
+export type SpeedTier = 'standard' | 'fast';
+/** `speed` endpoint value, mirrored from the node half. */
+export interface SpeedState {
+    tier: SpeedTier;
+    fastModels: string[];
+}
+/** What {@link SpeedSelect} renders from: visibility plus the current tier. */
+export interface SpeedSelectState {
+    visible: boolean;
+    model?: string;
+    tier: SpeedTier;
+}
+/**
+ * Minimal structural face of ui-model-selection's `ctx.modelDirectories`
+ * service (the sanctioned cross-plugin channel: cordis services, not value
+ * imports — same mirroring discipline as ToolCallOwnerProps). Both dsh lines
+ * ship it with this shape; it replaces rc.2's `connection.api.sessions.models`
+ * read, which the 0.1.2-alpha removed along with the whole `.api` face.
+ */
+export interface ModelDirectoriesLike {
+    /** Resolve one session's shared model directory (throws for unknown sessions). */
+    directoryFor(sessionId: string): {
+        /** Load the directory; `current` is the session's effective model selection. */
+        load(): Promise<{
+            current: {
+                provider: string;
+                model: string;
+            } | null;
+        }>;
+    };
+}
+/** Injected dependencies of {@link SpeedSelect} (slot `inject`, session-bound). */
+export interface SpeedSelectInjected {
+    /** Load the session's speed state; `visible` false keeps the control hidden. */
+    loadSpeed: () => Promise<SpeedSelectState>;
+    /** Set the session's speed tier; resolves false when the write failed. */
+    setSpeed: (tier: SpeedTier, displayedModel?: string) => Promise<boolean>;
+}
+/**
+ * Props delivered by the slot outlet: the framework session kit and InputZone
+ * owner share (unused — everything arrives session-bound through the inject
+ * face), the injected callbacks, and the locale seat.
+ */
+export type SpeedSelectProps = PropsRuntime<'conversation.input.right'> & Partial<SpeedSelectInjected> & Partial<PropsLocale<'subscription-models'>>;
+/**
+ * The `loadSpeed` half of the inject face: the plugin's own speed state plus
+ * the host's current model selection (the visibility gate). A model-RPC
+ * failure throws rather than answering "hidden" — the caller keeps its last
+ * known state, so a transient failure never locks the toggle away.
+ *
+ * `sessionId` is a plain string: slot and command contexts brand it through
+ * different dsh-session copies, and only the service boundary needs one.
+ *
+ * `models` resolves lazily per call: the ui-model-selection service may
+ * register after this plugin applies, and a shell without it (no model seat
+ * at all) simply keeps the toggle hidden.
+ */
+export declare function createSpeedLoader(connection: ConnectionHandle, models: () => ModelDirectoriesLike | undefined, sessionId: string): SpeedSelectInjected['loadSpeed'];
+/** The `setSpeed` half of the inject face: boolean outcome for the component's busy state. */
+export declare function createSpeedSetter(connection: ConnectionHandle, sessionId: string, models?: () => ModelDirectoriesLike | undefined): SpeedSelectInjected['setSpeed'];
+/**
+ * The composer Speed control: a trigger reading `速度 · 快速`/`速度 · 标准`
+ * that opens a two-row menu (standard/fast with descriptions, check mark on
+ * the current tier). The host pushes nothing on a model switch, so the
+ * control re-reads on a slow poll with a single-flight guard; a failed read
+ * keeps the last known state, so a transient RPC failure can never lock the
+ * toggle away (the earlier mount-only load had no recovery path).
+ */
+export declare function SpeedSelect({ loadSpeed, setSpeed, t }: SpeedSelectProps): import("react").JSX.Element | null;