dsh-subscriptions 0.1.0

package/lib/client/VideoGenerateToolview.js

@@ -0,0 +1,175 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Keyed toolview for the `video_generate` tool: renders the generated video
+ * inline in the conversation. The row shows the call's prompt while running
+ * and after settling; a settled success loads the MP4 bytes through the node
+ * half's `/subscriptions-auth` `video` endpoint (by bare file name), builds a
+ * Blob URL, and plays it in a native `<video controls>` element. The file
+ * name comes from the result's presentation meta when the dispatch was
+ * top-level, and is recovered from the "Saved video to …" text line for
+ * nested (Code Mode) dispatches, where the harness computes no meta. A result
+ * with neither renders its text; an error result renders the first error line.
+ *
+ * The 'tool.call.toolview' SlotMap entry is declared by
+ * ImageGenerateToolview.tsx in this same package (one declaration per
+ * augmentation), so this file only mirrors the owner-props shape.
+ */
+import { useEffect, useState } from 'react';
+import * as primitives from '@deepseek-ai/dsh-client-ui-primitives';
+import { hostIcon } from './host-icons.js';
+import { callSubscriptionsAuth } from './subscriptions-rpc.js';
+import { en } from './locales.js';
+/** DSH 0.1.7 renamed IconSparkle16; resolving it by name keeps older hosts working too. */
+const SparkleIcon = hostIcon(primitives, 'Sparkle');
+/** Title prompt truncation budget (characters). */
+const PROMPT_MAX_LENGTH = 60;
+/**
+ * Build the video loader over the `/subscriptions-auth` `video` endpoint.
+ * @param rpc - Connection RPC caller.
+ * @returns loader resolving a bare file name to the decoded bytes.
+ */
+export function createVideoLoader(rpc) {
+    return name => callSubscriptionsAuth(rpc, 'video', { name });
+}
+/**
+ * English-dictionary fallback for a missing locale seat (standalone renders);
+ * the framework always supplies the namespace-bound one.
+ */
+function fallbackTranslate(key, params) {
+    let text = en[key];
+    for (const [name, value] of Object.entries(params ?? {})) {
+        text = text.replaceAll(`{${name}}`, String(value));
+    }
+    return text;
+}
+/** Extract the prompt from the call's raw args JSON; falls back to the first string value, then the raw line. */
+function derivePrompt(argsRaw) {
+    let parsed;
+    try {
+        parsed = JSON.parse(argsRaw);
+    }
+    catch {
+        // Non-JSON args (mid-stream truncation): fall back to the raw string below.
+        parsed = undefined;
+    }
+    let prompt;
+    if (typeof parsed === 'object' && parsed !== null) {
+        const args = parsed;
+        if (typeof args.prompt === 'string' && args.prompt !== '')
+            prompt = args.prompt;
+        else {
+            for (const value of Object.values(args)) {
+                if (typeof value === 'string' && value !== '') {
+                    prompt = value;
+                    break;
+                }
+            }
+        }
+    }
+    const line = (prompt ?? argsRaw).split('\n', 1)[0] ?? '';
+    return line.length > PROMPT_MAX_LENGTH ? `${line.slice(0, PROMPT_MAX_LENGTH)}…` : line;
+}
+/** Flatten a settled result's text blocks (the fallback body and the error line). */
+function resultText(block) {
+    if (!('kind' in block))
+        return '';
+    const parts = [];
+    for (const part of block.content) {
+        if (part.type === 'text')
+            parts.push(part.text);
+    }
+    if (parts.length === 0 && block.error !== undefined)
+        parts.push(`${block.error.name}: ${block.error.code}`);
+    return parts.join('\n');
+}
+/**
+ * The generated video's bare file name: presentation meta first (top-level
+ * dispatches), then the render text's "Saved video to …" line (nested
+ * dispatches compute no meta).
+ */
+function resolveFileName(block) {
+    if (!('kind' in block))
+        return undefined;
+    const meta = block.meta;
+    if (typeof meta === 'object' && meta !== null) {
+        const fileName = meta.fileName;
+        if (typeof fileName === 'string' && fileName.length > 0)
+            return fileName;
+    }
+    const match = /^Saved video to (.+\.mp4)/m.exec(resultText(block));
+    if (match === null)
+        return undefined;
+    const path = match[1];
+    return path.slice(path.lastIndexOf('/') + 1);
+}
+/** Decode a base64 payload into bytes (browser-side; no Buffer). */
+function base64Bytes(dataBase64) {
+    const binary = atob(dataBase64);
+    const bytes = new Uint8Array(binary.length);
+    for (let index = 0; index < binary.length; index++)
+        bytes[index] = binary.charCodeAt(index);
+    return bytes;
+}
+const styles = {
+    container: { display: 'flex', flexDirection: 'column', gap: 6, padding: '4px 0' },
+    row: { display: 'flex', alignItems: 'center', gap: 6, minWidth: 0 },
+    icon: { display: 'inline-flex', flexShrink: 0, color: 'var(--dsw-alias-label-tertiary)' },
+    title: {
+        fontSize: 13, lineHeight: '20px', color: 'var(--dsw-alias-label-primary)',
+        overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap',
+    },
+    subtle: { margin: 0, fontSize: 12, lineHeight: '18px', color: 'var(--dsw-alias-label-tertiary)' },
+    output: {
+        margin: 0, fontSize: 12, lineHeight: '18px', color: 'var(--dsw-alias-label-secondary)',
+        whiteSpace: 'pre-wrap', overflowWrap: 'anywhere',
+    },
+    error: { margin: 0, fontSize: 12, lineHeight: '18px', color: 'var(--dsw-alias-state-error-primary)' },
+    video: {
+        display: 'block', maxWidth: 480, width: '100%', borderRadius: 8,
+        backgroundColor: 'var(--dsw-alias-bg-skeleton)',
+    },
+};
+/**
+ * The `video_generate` keyed toolview component.
+ * @param props - owner share, inject face, and locale seat (spread flat).
+ * @returns the call row plus, once settled, the player / text / error body.
+ */
+export function VideoGenerateToolview(props) {
+    const { block, loadVideo } = props;
+    const t = props.t ?? fallbackTranslate;
+    const settled = block !== undefined && 'kind' in block;
+    const isError = settled && block.isError;
+    const fileName = block !== undefined && settled && !isError ? resolveFileName(block) : undefined;
+    const [load, setLoad] = useState({ phase: 'loading' });
+    useEffect(() => {
+        if (fileName === undefined || loadVideo === undefined)
+            return;
+        let cancelled = false;
+        let objectUrl;
+        setLoad({ phase: 'loading' });
+        loadVideo(fileName).then((video) => {
+            if (cancelled)
+                return;
+            // Uint8Array#slice detaches a plain ArrayBuffer view for BlobPart.
+            objectUrl = URL.createObjectURL(new Blob([base64Bytes(video.dataBase64).slice()], { type: video.mediaType }));
+            setLoad({ phase: 'ready', url: objectUrl });
+        }, (error) => {
+            if (cancelled)
+                return;
+            setLoad({ phase: 'failed', message: error instanceof Error ? error.message : String(error) });
+        });
+        return () => {
+            cancelled = true;
+            if (objectUrl !== undefined)
+                URL.revokeObjectURL(objectUrl);
+        };
+    }, [fileName, loadVideo]);
+    if (block === undefined)
+        return null;
+    const argsRaw = (settled ? block.call?.argsRaw : block.phase === 'start' ? block.argsRaw : undefined) ?? '';
+    const title = `video_generate: ${derivePrompt(argsRaw)}`;
+    const text = settled ? resultText(block) : '';
+    return (_jsxs("div", { style: styles.container, children: [_jsxs("div", { style: styles.row, children: [_jsx("span", { style: styles.icon, children: _jsx(SparkleIcon, { size: 14 }) }), _jsx("span", { style: styles.title, children: title })] }), !settled && _jsx("p", { style: styles.subtle, children: t('generatingVideo') }), settled && isError && text !== '' && (_jsx("p", { style: styles.error, children: text.split('\n', 1)[0] })), settled && !isError && fileName !== undefined && load.phase === 'loading' && (_jsx("p", { style: styles.subtle, children: t('videoLoading') })), settled && !isError && fileName !== undefined && load.phase === 'failed' && (_jsx("p", { style: styles.error, children: t('videoLoadFailed', { message: load.message }) })), settled && !isError && fileName !== undefined && load.phase === 'ready' && (
+            // eslint-disable-next-line jsx-a11y/media-has-caption -- generated clip; no caption track exists.
+            _jsx("video", { style: styles.video, src: load.url, controls: true, preload: "metadata" })), settled && !isError && fileName === undefined && text !== '' && (_jsx("p", { style: styles.output, children: text }))] }));
+}

package/lib/client/account-preferences.d.ts

@@ -0,0 +1,24 @@
+import type { AccountPreferences, ProviderPreferences } from '../provider-settings.js';
+export interface AccountCatalogRow {
+    key: string;
+    label: string;
+    models: {
+        id: string;
+        name: string;
+    }[];
+    unavailable?: boolean;
+}
+/** Missing allowlist follows discovery; explicit [] must remain empty. */
+export declare function accountPoolSelection(account: AccountPreferences, models: readonly {
+    id: string;
+}[]): Set<string>;
+/** Retain unavailable saved IDs so a temporary catalog failure cannot erase them. */
+export declare function accountModelRows(account: AccountCatalogRow, preferences: AccountPreferences): {
+    unavailable: boolean;
+    id: string;
+    name: string;
+}[];
+/** The model editor owns everything except the separately managed accounts. */
+export declare function mergeLatestAccounts(draft: ProviderPreferences, latest: ProviderPreferences): ProviderPreferences;
+/** Only touched accounts replace their latest preferences; other settings survive. */
+export declare function mergeAccountChanges(latest: ProviderPreferences, changes: Record<string, AccountPreferences>): ProviderPreferences;

package/lib/client/account-preferences.js

@@ -0,0 +1,21 @@
+/** Missing allowlist follows discovery; explicit [] must remain empty. */
+export function accountPoolSelection(account, models) {
+    return new Set(account.poolModels ?? models.map(model => model.id));
+}
+/** Retain unavailable saved IDs so a temporary catalog failure cannot erase them. */
+export function accountModelRows(account, preferences) {
+    const known = new Set(account.models.map(model => model.id));
+    return [
+        ...account.models.map(model => ({ ...model, unavailable: false })),
+        ...(preferences.poolModels ?? []).filter(id => !known.has(id)).map(id => ({ id, name: id, unavailable: true })),
+    ];
+}
+/** The model editor owns everything except the separately managed accounts. */
+export function mergeLatestAccounts(draft, latest) {
+    const { accounts: _stale, ...settings } = draft;
+    return { ...settings, ...(latest.accounts === undefined ? {} : { accounts: latest.accounts }) };
+}
+/** Only touched accounts replace their latest preferences; other settings survive. */
+export function mergeAccountChanges(latest, changes) {
+    return { ...latest, accounts: { ...latest.accounts, ...changes } };
+}

package/lib/client/fast-command.d.ts

@@ -0,0 +1,2 @@
+/** Build the locale resolver used by the /fast command contribution. */
+export declare function fastCommandDescription(t: () => string): () => string;

package/lib/client/fast-command.js

@@ -0,0 +1,4 @@
+/** Build the locale resolver used by the /fast command contribution. */
+export function fastCommandDescription(t) {
+    return () => t();
+}

package/lib/client/host-contract.d.ts

@@ -0,0 +1,90 @@
+/**
+ * Everything the client half assumes about the DSH host that the compiler
+ * cannot check.
+ *
+ * The client bundle reads host modules at runtime, not at build time. A
+ * renamed icon export compiles against the old type declarations and then
+ * renders `undefined`. A slot outlet the host stops rendering never mounts our
+ * entry, so the page looks normal and the feature is just gone. A removed DOM
+ * marker only breaks layout. None of these fail `tsc`, and a unit test with
+ * a hand-made host cannot see them either.
+ *
+ * So each such assumption is listed here once, next to the host package that
+ * owns it. `scripts/check-host-contract.mjs` downloads every supported DSH
+ * version and checks that each entry appears in that version's published
+ * code. The host E2E reads the same diagnostics entries to catch slot
+ * crashes. The spec test/host-contract.spec.ts scans src/client and fails
+ * when code starts relying on a literal host name that is missing here.
+ *
+ * This module has no imports, so plain Node scripts can import it directly.
+ */
+/** Prefix of the console warning the client logs when a host lacks a listed name. */
+export declare const HOST_CONTRACT_MISS = "dsh-subscriptions: host contract miss";
+export declare const HOST_CONTRACT: {
+    /**
+     * Host modules the client bundle loads by specifier. The web shell serves
+     * only the modules in its static module table (`staticModules` in
+     * dsh-web-frontend), so each specifier the built lib/client.js loads must
+     * be a key of that table.
+     */
+    readonly moduleTable: "@deepseek-ai/dsh-web-frontend";
+    /** Named runtime exports the client reads from a host module. */
+    readonly exports: {
+        readonly '@deepseek-ai/dsh-client-ui-primitives': readonly ["useAnchoredPosition", "useDismissOnOutsidePointer"];
+    };
+    /**
+     * 16px glyphs read through hostIcon(). The host must export
+     * `Icon<Name>Regular` (DSH 0.1.7 and later) or `Icon<Name>16` (earlier).
+     */
+    readonly icons: {
+        readonly package: "@deepseek-ai/dsh-client-ui-primitives";
+        readonly names: readonly ["Sparkle", "DataOutline"];
+    };
+    /** Slots the client registers into, each with the package that renders its outlet. */
+    readonly slots: {
+        readonly 'settings.section': "@deepseek-ai/dsh-client-ui-settings-general";
+        readonly 'tool.call.toolview': "@deepseek-ai/dsh-client-ui-tool";
+        readonly 'conversation.input.right': "@deepseek-ai/dsh-client-ui-conversation";
+        readonly 'conversation.composer.dock': "@deepseek-ai/dsh-client-ui-conversation";
+    };
+    /**
+     * Context services the client injects or reads, each with the package that
+     * provides it (`ctx.provide("<name>")` or a cordis Service named `<name>`).
+     * A service nobody provides leaves the plugin's apply() waiting forever,
+     * with nothing in the console.
+     */
+    readonly services: {
+        readonly commandUi: "@deepseek-ai/dsh-client-ui-commands";
+        readonly connection: "@deepseek-ai/dsh-client-connection";
+        readonly locale: "@deepseek-ai/dsh-client-locale";
+        readonly modelDirectories: "@deepseek-ai/dsh-client-ui-model-selection";
+        readonly slots: "@deepseek-ai/dsh-client-ui-renderer";
+    };
+    /** DOM attributes the client looks up in host-rendered markup. */
+    readonly markers: {
+        /** The shipped StatsPills row; the usage badge renders into it as a third pill. */
+        readonly composerStats: {
+            readonly attribute: "data-composer-stats";
+            readonly package: "@deepseek-ai/dsh-client-ui-chat";
+        };
+    };
+    /**
+     * What the slot renderer emits when an entry throws. It catches the error,
+     * logs `crashLog`, and renders an element carrying `errorAttribute` in the
+     * entry's place, so a crash never reaches the page's error handlers. The
+     * host E2E watches for both.
+     */
+    readonly diagnostics: {
+        readonly package: "@deepseek-ai/dsh-client-ui-renderer";
+        readonly crashLog: "slot entry crashed in";
+        readonly errorAttribute: "data-slot-error";
+        readonly slotAttribute: "data-slot";
+    };
+    /** Design tokens the client styles with; the host theme must define each one. */
+    readonly tokens: {
+        readonly package: "@deepseek-ai/dsh-client-ui-theme";
+        readonly names: readonly ["--dsw-alias-bg-layer-1", "--dsw-alias-bg-skeleton", "--dsw-alias-border-l2", "--dsw-alias-border-l2-darkmode-thin", "--dsw-alias-interactive-bg-hover", "--dsw-alias-interactive-bg-hover-solid", "--dsw-alias-label-dimmed", "--dsw-alias-label-primary", "--dsw-alias-label-secondary", "--dsw-alias-label-tertiary", "--dsw-alias-state-error-primary", "--dsw-alias-state-success-primary", "--dsw-alias-state-warn-label", "--dsw-elevation-prominent", "--dsw-specific-menu"];
+    };
+};
+/** A glyph name listed in {@link HOST_CONTRACT}; hostIcon() accepts no other. */
+export type HostIconName = (typeof HOST_CONTRACT.icons.names)[number];

package/lib/client/host-contract.js

@@ -0,0 +1,101 @@
+/**
+ * Everything the client half assumes about the DSH host that the compiler
+ * cannot check.
+ *
+ * The client bundle reads host modules at runtime, not at build time. A
+ * renamed icon export compiles against the old type declarations and then
+ * renders `undefined`. A slot outlet the host stops rendering never mounts our
+ * entry, so the page looks normal and the feature is just gone. A removed DOM
+ * marker only breaks layout. None of these fail `tsc`, and a unit test with
+ * a hand-made host cannot see them either.
+ *
+ * So each such assumption is listed here once, next to the host package that
+ * owns it. `scripts/check-host-contract.mjs` downloads every supported DSH
+ * version and checks that each entry appears in that version's published
+ * code. The host E2E reads the same diagnostics entries to catch slot
+ * crashes. The spec test/host-contract.spec.ts scans src/client and fails
+ * when code starts relying on a literal host name that is missing here.
+ *
+ * This module has no imports, so plain Node scripts can import it directly.
+ */
+/** Prefix of the console warning the client logs when a host lacks a listed name. */
+export const HOST_CONTRACT_MISS = 'dsh-subscriptions: host contract miss';
+export const HOST_CONTRACT = {
+    /**
+     * Host modules the client bundle loads by specifier. The web shell serves
+     * only the modules in its static module table (`staticModules` in
+     * dsh-web-frontend), so each specifier the built lib/client.js loads must
+     * be a key of that table.
+     */
+    moduleTable: '@deepseek-ai/dsh-web-frontend',
+    /** Named runtime exports the client reads from a host module. */
+    exports: {
+        '@deepseek-ai/dsh-client-ui-primitives': ['useAnchoredPosition', 'useDismissOnOutsidePointer'],
+    },
+    /**
+     * 16px glyphs read through hostIcon(). The host must export
+     * `Icon<Name>Regular` (DSH 0.1.7 and later) or `Icon<Name>16` (earlier).
+     */
+    icons: {
+        package: '@deepseek-ai/dsh-client-ui-primitives',
+        names: ['Sparkle', 'DataOutline'],
+    },
+    /** Slots the client registers into, each with the package that renders its outlet. */
+    slots: {
+        'settings.section': '@deepseek-ai/dsh-client-ui-settings-general',
+        'tool.call.toolview': '@deepseek-ai/dsh-client-ui-tool',
+        'conversation.input.right': '@deepseek-ai/dsh-client-ui-conversation',
+        'conversation.composer.dock': '@deepseek-ai/dsh-client-ui-conversation',
+    },
+    /**
+     * Context services the client injects or reads, each with the package that
+     * provides it (`ctx.provide("<name>")` or a cordis Service named `<name>`).
+     * A service nobody provides leaves the plugin's apply() waiting forever,
+     * with nothing in the console.
+     */
+    services: {
+        commandUi: '@deepseek-ai/dsh-client-ui-commands',
+        connection: '@deepseek-ai/dsh-client-connection',
+        locale: '@deepseek-ai/dsh-client-locale',
+        modelDirectories: '@deepseek-ai/dsh-client-ui-model-selection',
+        slots: '@deepseek-ai/dsh-client-ui-renderer',
+    },
+    /** DOM attributes the client looks up in host-rendered markup. */
+    markers: {
+        /** The shipped StatsPills row; the usage badge renders into it as a third pill. */
+        composerStats: { attribute: 'data-composer-stats', package: '@deepseek-ai/dsh-client-ui-chat' },
+    },
+    /**
+     * What the slot renderer emits when an entry throws. It catches the error,
+     * logs `crashLog`, and renders an element carrying `errorAttribute` in the
+     * entry's place, so a crash never reaches the page's error handlers. The
+     * host E2E watches for both.
+     */
+    diagnostics: {
+        package: '@deepseek-ai/dsh-client-ui-renderer',
+        crashLog: 'slot entry crashed in',
+        errorAttribute: 'data-slot-error',
+        slotAttribute: 'data-slot',
+    },
+    /** Design tokens the client styles with; the host theme must define each one. */
+    tokens: {
+        package: '@deepseek-ai/dsh-client-ui-theme',
+        names: [
+            '--dsw-alias-bg-layer-1',
+            '--dsw-alias-bg-skeleton',
+            '--dsw-alias-border-l2',
+            '--dsw-alias-border-l2-darkmode-thin',
+            '--dsw-alias-interactive-bg-hover',
+            '--dsw-alias-interactive-bg-hover-solid',
+            '--dsw-alias-label-dimmed',
+            '--dsw-alias-label-primary',
+            '--dsw-alias-label-secondary',
+            '--dsw-alias-label-tertiary',
+            '--dsw-alias-state-error-primary',
+            '--dsw-alias-state-success-primary',
+            '--dsw-alias-state-warn-label',
+            '--dsw-elevation-prominent',
+            '--dsw-specific-menu',
+        ],
+    },
+};

package/lib/client/host-icons.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Glyphs from the host's icon set that survive its renames. DSH 0.1.7
+ * renamed the 16px glyphs from `Icon<Name>16` to `Icon<Name>Regular`. The
+ * client reads host modules at runtime, so a named import of a glyph the
+ * host no longer exports is `undefined`, and rendering it crashes the whole
+ * slot (React error #130).
+ *
+ * A glyph name must be listed in HOST_CONTRACT.icons, which
+ * scripts/check-host-contract.mjs checks against each supported DSH version.
+ */
+import type { ComponentType } from 'react';
+import type { IconProps } from '@deepseek-ai/dsh-client-ui-primitives';
+import type { HostIconName } from './host-contract.js';
+/**
+ * Resolve one 16px glyph under either host naming.
+ *
+ * A glyph the host lacks renders nothing, and the lookup logs a
+ * {@link HOST_CONTRACT_MISS} warning. The host E2E fails on that warning, so a
+ * missing icon is reported instead of shipping as a blank space.
+ * @param icons - the host primitives module (`import * as`), read by name.
+ * @param name - the glyph name without prefix or size, e.g. `Sparkle`.
+ * @returns the host's component, or one rendering nothing.
+ */
+export declare function hostIcon(icons: object, name: HostIconName): ComponentType<IconProps>;

package/lib/client/host-icons.js

@@ -0,0 +1,21 @@
+import { HOST_CONTRACT, HOST_CONTRACT_MISS } from './host-contract.js';
+/** A decorative glyph the host lacks renders nothing rather than crashing. */
+const NoIcon = () => null;
+/**
+ * Resolve one 16px glyph under either host naming.
+ *
+ * A glyph the host lacks renders nothing, and the lookup logs a
+ * {@link HOST_CONTRACT_MISS} warning. The host E2E fails on that warning, so a
+ * missing icon is reported instead of shipping as a blank space.
+ * @param icons - the host primitives module (`import * as`), read by name.
+ * @param name - the glyph name without prefix or size, e.g. `Sparkle`.
+ * @returns the host's component, or one rendering nothing.
+ */
+export function hostIcon(icons, name) {
+    const exports = icons;
+    const icon = exports[`Icon${name}Regular`] ?? exports[`Icon${name}16`];
+    if (icon !== undefined)
+        return icon;
+    console.warn(`${HOST_CONTRACT_MISS}: ${HOST_CONTRACT.icons.package} exports neither Icon${name}Regular nor Icon${name}16`);
+    return NoIcon;
+}

package/lib/client/index.d.ts

@@ -0,0 +1,27 @@
+import type { Context as ClientContext } from '@deepseek-ai/cordis';
+import type { SubscriptionsKey } from './locales.js';
+export type { SubscriptionsSectionInjected, SubscriptionsSectionProps } from './SubscriptionsSection.js';
+export type { ImageGenerateToolviewInjected, ImageGenerateToolviewProps } from './ImageGenerateToolview.js';
+export type { VideoGenerateToolviewInjected, VideoGenerateToolviewProps } from './VideoGenerateToolview.js';
+export type { SpeedSelectInjected, SpeedSelectProps, SpeedState, SpeedTier } from './SpeedSelect.js';
+export type { SubscriptionUsageBadgeInjected, SubscriptionUsageBadgeProps } from './SubscriptionUsageBadge.js';
+export type { SubscriptionsKey } from './locales.js';
+declare module '@deepseek-ai/dsh-client-ui-slots' {
+    interface LocaleNamespaceMap {
+        /** The Subscriptions settings page copy. */
+        'settings.subscriptions': SubscriptionsKey;
+    }
+}
+/**
+ * Required services (cordis fiber inject): `slots` carries the registration
+ * seat, `connection` the `/subscriptions-auth` RPC caller, and `locale` the copy
+ * dictionaries.
+ */
+export declare const inject: string[];
+/**
+ * Register the Subscriptions section once the `settings.section` declaration
+ * is on the ledger (the shell's apply order relative to this one is NOT
+ * constrained; registration depends on the slot through `slots.inject()`).
+ * @param ctx - client root context.
+ */
+export declare function apply(ctx: ClientContext): void;

package/lib/client/index.js

@@ -0,0 +1,136 @@
+// `.js` extension: this package's tsconfig lacks the reference repo's
+// allowImportingTsExtensions/rewriteRelativeImportExtensions pair; under
+// nodenext the .js specifier resolves to the .tsx source (see README note).
+import { SubscriptionsSection } from './SubscriptionsSection.js';
+import { ImageGenerateToolview, createImageLoader } from './ImageGenerateToolview.js';
+import { VideoGenerateToolview, createVideoLoader } from './VideoGenerateToolview.js';
+import { SpeedSelect, createSpeedLoader, createSpeedSetter } from './SpeedSelect.js';
+import { SubscriptionUsageBadge, createCurrentModelReader } from './SubscriptionUsageBadge.js';
+import { en, zh } from './locales.js';
+import { fastCommandDescription } from './fast-command.js';
+/** Dictionary namespace owned by this plugin. */
+const NS = 'settings.subscriptions';
+/**
+ * Required services (cordis fiber inject): `slots` carries the registration
+ * seat, `connection` the `/subscriptions-auth` RPC caller, and `locale` the copy
+ * dictionaries.
+ */
+export const inject = ['slots', 'connection', 'locale'];
+/**
+ * Register the Subscriptions section once the `settings.section` declaration
+ * is on the ledger (the shell's apply order relative to this one is NOT
+ * constrained; registration depends on the slot through `slots.inject()`).
+ * @param ctx - client root context.
+ */
+export function apply(ctx) {
+    ctx.effect(() => ctx.locale.register(NS, { zh, en }), 'dsh-subscriptions: copy dictionaries');
+    // Settings-shell nudge: the panel (nav title + header row + section body)
+    // sits flush against the panel's top edge; push it down a little to leave
+    // breathing room. Scoped by the settings panel's own dialog role + nav child
+    // so other aria-modal dialogs (e.g. the attachment lightbox) are untouched.
+    ctx.effect(() => {
+        const style = document.createElement('style');
+        style.setAttribute('data-plugin', 'dsh-subscriptions');
+        style.textContent = 'div[role="dialog"][aria-modal="true"]:has(> nav) { padding-top: 14px; }';
+        document.head.appendChild(style);
+        return () => style.remove();
+    }, 'dsh-subscriptions: settings panel breathing room');
+    // The shell's Context merge types `connection` as the host handle; in the
+    // browser shell the same key holds the full client ConnectionHandle.
+    const connection = ctx.get('connection');
+    const t = ctx.locale.bind(NS);
+    const injected = () => ({ rpc: connection.rpc, t });
+    ctx.slots.inject('settings.section', () => ctx.slots.register({
+        name: 'settings.section',
+        id: 'subscriptions',
+        order: 90,
+        // A thunk re-evaluated per read, so the nav label follows the active locale.
+        label: () => t('nav'),
+        inject: injected,
+    }, SubscriptionsSection));
+    // The image_generate keyed toolview owns how image calls render inline; its
+    // gallery bytes ride the same channel through the injected loader. The
+    // framework synthesizes the toolview's own `t` seat from `locale: NS`.
+    const toolviewInjected = () => ({ load: createImageLoader(connection.rpc) });
+    ctx.slots.inject('tool.call.toolview', () => ctx.slots.register({
+        name: 'tool.call.toolview',
+        key: 'image_generate',
+        locale: NS,
+        inject: toolviewInjected,
+    }, ImageGenerateToolview));
+    // The video_generate keyed toolview plays the saved MP4 inline; its bytes
+    // ride the same channel's `video` endpoint through the injected loader.
+    const videoToolviewInjected = () => ({ loadVideo: createVideoLoader(connection.rpc) });
+    ctx.slots.inject('tool.call.toolview', () => ctx.slots.register({
+        name: 'tool.call.toolview',
+        key: 'video_generate',
+        locale: NS,
+        inject: videoToolviewInjected,
+    }, VideoGenerateToolview));
+    // The composer Speed toggle (codex fast tier) sits in the right tool row,
+    // just left of the model selector; the framework synthesizes its `t` seat
+    // from `locale: NS`, and the inject face binds each session's RPC calls.
+    // The current-model read rides ui-model-selection's `modelDirectories`
+    // service, resolved lazily so registration order never matters.
+    const models = () => ctx.get('modelDirectories');
+    ctx.slots.inject('conversation.input.right', () => ctx.slots.register({
+        name: 'conversation.input.right',
+        id: 'codex-speed',
+        order: 0,
+        locale: NS,
+        inject: (sessionId) => ({
+            loadSpeed: createSpeedLoader(connection, models, sessionId),
+            setSpeed: createSpeedSetter(connection, sessionId),
+        }),
+    }, SpeedSelect));
+    // The subscription usage badge renders a stats pill in the composer's dock
+    // (conversation.composer.dock) — collapsed, the current model's provider
+    // (e.g. "Codex 6d1h 25%"); clicking opens every provider's windows. A fresh
+    // id means it appears beside the shipped StatsPills, never replacing them;
+    // the current-model read shares the Speed toggle's `modelDirectories` path.
+    ctx.slots.inject('conversation.composer.dock', () => ctx.slots.register({
+        name: 'conversation.composer.dock',
+        id: 'subscription-usage',
+        order: 10,
+        locale: NS,
+        inject: (sessionId) => ({
+            rpc: connection.rpc,
+            currentModel: createCurrentModelReader(models, sessionId),
+        }),
+    }, SubscriptionUsageBadge));
+    // The /fast slash command offers the same Standard/Fast choice as a popup.
+    // `available` is synchronous and sees only the session id, so the command
+    // stays listed everywhere; `options` throws the friendly gate when the
+    // session's current model is not a fast-capable codex model (the same
+    // in-popup error posture the /model contribution uses for its guards).
+    ctx.inject(['commandUi'], (scope) => {
+        const command = scope.get('commandUi');
+        scope.effect(() => command.register({
+            name: 'fast',
+            // dsh 0.1.5-alpha made `description` a locale resolver evaluated per
+            // candidate pass (commit 5d9603b76, "feat(web): localize slash command
+            // descriptions"); earlier lines read the value as a plain string. The
+            // bare string threw `contribution.description is not a function` inside
+            // the registry's candidate pass on 0.1.5, aborting the whole `/` source
+            // and hiding every host command — /plan, /model, /goal, ... — not just
+            // /fast. Older lines render a function child as empty copy, no crash.
+            description: fastCommandDescription(() => t('commandFast')),
+            available: () => true,
+            ui: {
+                kind: 'popupSelect',
+                options: async (session) => {
+                    const state = await createSpeedLoader(connection, models, session.sessionId)();
+                    if (!state.visible)
+                        throw new Error(t('commandFastUnavailable'));
+                    return [
+                        { id: 'standard', label: t('speedStandard'), detail: t('speedStandardDescription') },
+                        { id: 'fast', label: t('speedFast'), detail: t('speedFastDescription') },
+                    ].map(option => ({ ...option, active: option.id === state.tier }));
+                },
+                onSelect: async (option, session) => {
+                    await createSpeedSetter(connection, session.sessionId)(option.id);
+                },
+            },
+        }), 'dsh-subscriptions: /fast contribution');
+    });
+}